import { openBlock as a, createElementBlock as n, normalizeClass as m, withKeys as h, normalizeStyle as b, resolveComponent as y, createTextVNode as v, toDisplayString as q, Fragment as S, createCommentVNode as d, createElementVNode as p, createBlock as g } from "vue";
const f = (t, r) => {
  const e = t.__vccOpts || t;
  for (const [o, s] of r)
    e[o] = s;
  return e;
}, k = {
  name: "InputText",
  props: {
    id: { type: String, required: !0 },
    type: { type: String, required: !0 },
    placeholder: { type: String, required: !0 },
    error: { type: Boolean, required: !1, default: !1 },
    required: { type: Boolean, required: !1, default: !1 },
    disabled: { type: Boolean, required: !1, default: !1 },
    value: { type: String, required: !1, default: null },
    label: { type: String, required: !1, default: null }
  }
}, B = ["id", "disabled", "type", "name", "required", "placeholder", "value"];
function I(t, r, e, o, s, u) {
  return a(), n("input", {
    id: e.id,
    disabled: e.disabled,
    type: e.type,
    class: m({ error: e.error }),
    name: `input_${e.id}`,
    required: e.required,
    placeholder: e.placeholder,
    value: e.value,
    onKeyup: r[0] || (r[0] = h((i) => t.$emit("setter", i.target.value), ["enter"])),
    onInput: r[1] || (r[1] = (i) => {
      t.$emit("setter", i.target.value), t.$emit("removeError", e.id);
    })
  }, null, 42, B);
}
const x = /* @__PURE__ */ f(k, [["render", I]]);
const E = {
  name: "InputTextArea",
  props: {
    id: { type: String, required: !0 },
    placeholder: { type: String, required: !0 },
    error: { type: Boolean, required: !1, default: !1 },
    required: { type: Boolean, required: !1, default: !1 },
    disabled: { type: Boolean, required: !1, default: !1 },
    value: { type: String, required: !1, default: null },
    label: { type: String, required: !1, default: null },
    height: { type: String, required: !1, default: "42px" }
  }
}, _ = ["id", "disabled", "name", "value", "required", "placeholder"];
function M(t, r, e, o, s, u) {
  return a(), n("textarea", {
    id: e.id,
    disabled: e.disabled,
    class: m({ error: e.error }),
    name: `input_${e.id}`,
    value: e.value,
    required: e.required,
    placeholder: e.placeholder,
    onKeyup: r[0] || (r[0] = h((i) => t.$emit("setter", i.target.value), ["enter"])),
    onInput: r[1] || (r[1] = (i) => {
      t.$emit("setter", i.target.value), t.$emit("removeError", e.id);
    }),
    style: b(`height:${e.height}`)
  }, null, 46, _);
}
const T = /* @__PURE__ */ f(E, [["render", M]]), O = {
  name: "Input",
  components: {
    InputTextArea: T,
    InputText: x
  },
  emits: ["setter"],
  props: {
    item: { type: Object, required: !0 }
  },
  computed: {
    error() {
      return this.item.errors && Object.values(this.item.errors).find(
        (r) => r.validated === !1
      ) ? !0 : this.item.error;
    },
    errorMessage() {
      if (this.item.hideError)
        return null;
      if (this.item.errors) {
        const t = Object.values(this.item.errors).find(
          (r) => r.validated === !1
        );
        if (t)
          return t.message;
      }
      return this.item.errorMessage;
    }
  }
}, j = ["for"], w = {
  key: 2,
  class: "error"
};
function C(t, r, e, o, s, u) {
  const i = y("input-text"), c = y("input-text-area");
  return e.item ? (a(), n("div", {
    key: 0,
    class: m(["input-field", e.item.classes])
  }, [
    e.item.label ? (a(), n("label", {
      key: 0,
      for: e.item.id
    }, [
      v(q(e.item.label) + " ", 1),
      e.item.required ? (a(), n(S, { key: 0 }, [
        v("*")
      ], 64)) : d("", !0),
      e.item.help ? (a(), n("button", {
        key: 1,
        class: "reset helper",
        onMouseover: r[0] || (r[0] = (l) => t.showHelpPopover = !0),
        onMouseleave: r[1] || (r[1] = (l) => t.showHelpPopover = !1)
      }, null, 32)) : d("", !0)
    ], 8, j)) : d("", !0),
    p("div", {
      class: m(["input-container", { "has-icon": e.item.icon }])
    }, [
      ["text", "email"].includes(e.item.type) ? (a(), g(i, {
        key: 0,
        type: e.item.type,
        required: e.item.required,
        disabled: e.item.disabled,
        id: e.item.id,
        error: u.error,
        placeholder: e.item.placeholder,
        value: e.item.value,
        onSetter: r[2] || (r[2] = (l) => t.$emit("setter", l)),
        onRemoveError: r[3] || (r[3] = (l) => t.$emit("remove-error", l))
      }, null, 8, ["type", "required", "disabled", "id", "error", "placeholder", "value"])) : d("", !0),
      e.item.type === "textarea" ? (a(), g(c, {
        key: 1,
        required: e.item.required,
        disabled: e.item.disabled,
        id: e.item.id,
        error: u.error,
        placeholder: e.item.placeholder,
        value: e.item.value,
        height: e.item.height,
        onSetter: r[4] || (r[4] = (l) => t.$emit("setter", l)),
        onRemoveError: r[5] || (r[5] = (l) => t.$emit("remove-error", l))
      }, null, 8, ["required", "disabled", "id", "error", "placeholder", "value", "height"])) : d("", !0),
      u.errorMessage ? (a(), n("span", w, q(u.errorMessage), 1)) : d("", !0)
    ], 2)
  ], 2)) : d("", !0);
}
const N = /* @__PURE__ */ f(O, [["render", C]]);
export {
  N as Input
};
//# sourceMappingURL=o2o-ui.mjs.map
