whelk-ui 0.0.7 → 0.0.8

package/dist/whelk-ui.js

@@ -1,5 +1,5 @@
-import { defineComponent as m, openBlock as a, createElementBlock as c, unref as r, renderSlot as d, createCommentVNode as s, toDisplayString as _ } from "vue";
-const o = {
+import { defineComponent as x, openBlock as s, createElementBlock as f, unref as R, renderSlot as L, createCommentVNode as g, toDisplayString as y, useModel as k, computed as _, withDirectives as V, createElementVNode as m, vModelCheckbox as j, mergeModels as $, ref as q, resolveComponent as B, Fragment as O, normalizeClass as A, withKeys as F, createVNode as I, createBlock as h, withCtx as N, createTextVNode as S, vModelText as D, renderList as G, resolveDynamicComponent as K, Transition as E, vShow as U } from "vue";
+const C = {
   Disable: "DISABLE",
   Error: "ERROR",
   Loading: "LOADING",
@@ -7,35 +7,688 @@ const o = {
   LoggingOut: "LOGGING_OUT",
   NoAction: "NO_ACTION",
   Saving: "SAVING"
-}, b = ["disabled"], l = { key: 1 }, g = /* @__PURE__ */ m({
+}, P = ["disabled"], z = { key: 1 }, X = /* @__PURE__ */ x({
   __name: "ButtonComponent",
   props: {
     objectState: {
       type: String,
-      default: o.NoAction,
+      default: C.NoAction,
       required: !1,
       validator: function(e) {
-        return Object.values(o).includes(e);
+        return Object.values(C).includes(e);
       }
     }
   },
   setup(e) {
-    return (t, n) => (a(), c("button", {
-      disabled: e.objectState !== r(o).NoAction
+    return (a, o) => (s(), f("button", {
+      disabled: e.objectState !== R(C).NoAction
     }, [
-      e.objectState === r(o).NoAction ? d(t.$slots, "default", { key: 0 }, void 0, !0) : s("", !0),
-      e.objectState !== r(o).NoAction ? (a(), c("span", l, _(e.objectState), 1)) : s("", !0)
-    ], 8, b));
+      e.objectState === R(C).NoAction ? L(a.$slots, "default", { key: 0 }, void 0, !0) : g("", !0),
+      e.objectState !== R(C).NoAction ? (s(), f("span", z, y(e.objectState), 1)) : g("", !0)
+    ], 8, P));
   }
-}), p = (e, t) => {
-  const n = e.__vccOpts || e;
-  for (const [i, u] of t)
-    n[i] = u;
-  return n;
-}, f = /* @__PURE__ */ p(g, [["__scopeId", "data-v-3de7a432"]]), O = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+}), b = (e, a) => {
+  const o = e.__vccOpts || e;
+  for (const [t, i] of a)
+    o[t] = i;
+  return o;
+}, H = /* @__PURE__ */ b(X, [["__scopeId", "data-v-3de7a432"]]), J = {}, Q = { class: "card" };
+function W(e, a) {
+  return s(), f("div", Q, [
+    L(e.$slots, "default", {}, void 0, !0)
+  ]);
+}
+const Y = /* @__PURE__ */ b(J, [["render", W], ["__scopeId", "data-v-025f3983"]]), Z = { class: "checkbox-component" }, ee = ["id", "name"], te = ["for"], ae = /* @__PURE__ */ x({
+  __name: "CheckBox",
+  props: /* @__PURE__ */ $({
+    id: {
+      type: String,
+      required: !0
+    },
+    label: {
+      type: String,
+      required: !0
+    }
+  }, {
+    modelValue: {},
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(e) {
+    const a = k(e, "modelValue"), o = e, t = _(() => `checkbox-${o.id}`);
+    return (i, l) => (s(), f("div", Z, [
+      V(m("input", {
+        id: t.value,
+        name: e.label,
+        "onUpdate:modelValue": l[0] || (l[0] = (n) => a.value = n),
+        type: "checkbox"
+      }, null, 8, ee), [
+        [j, a.value]
+      ]),
+      m("label", { for: t.value }, y(o.label), 9, te)
+    ]));
+  }
+}), le = /* @__PURE__ */ b(ae, [["__scopeId", "data-v-39385668"]]), oe = {}, ne = { class: "form-group" };
+function re(e, a) {
+  return s(), f("div", ne, [
+    L(e.$slots, "default", {}, void 0, !0)
+  ]);
+}
+const M = /* @__PURE__ */ b(oe, [["render", re], ["__scopeId", "data-v-142c8936"]]), ie = {}, se = { class: "render-error-message" };
+function ue(e, a) {
+  return s(), f("span", se, [
+    L(e.$slots, "default", {}, void 0, !0)
+  ]);
+}
+const w = /* @__PURE__ */ b(ie, [["render", ue], ["__scopeId", "data-v-e384ff35"]]), de = ["id"], ce = {
+  key: 0,
+  class: "tooltip-title"
+}, me = { class: "tooltip-message" }, pe = ["data-tooltip-target"], fe = /* @__PURE__ */ x({
+  __name: "ToolTip",
+  props: {
+    id: {
+      type: String,
+      required: !0
+    },
+    message: {
+      type: String,
+      required: !0
+    },
+    title: {
+      type: String,
+      default: ""
+    }
+  },
+  setup(e) {
+    const a = e, o = _(() => `tooltip-${a.id}`), t = q("tooltip");
+    return (i, l) => {
+      const n = B("Info");
+      return s(), f(O, null, [
+        m("div", {
+          id: o.value,
+          class: A(t.value),
+          role: "tooltip"
+        }, [
+          a.title !== "" && a.title !== null && a.title !== void 0 ? (s(), f("p", ce, y(a.title), 1)) : g("", !0),
+          m("p", me, y(a.message), 1)
+        ], 10, de),
+        m("span", {
+          "data-tooltip-target": o.value,
+          type: "tooltip",
+          onMouseenter: l[0] || (l[0] = (u) => t.value = "tooltip show"),
+          onMouseleave: l[1] || (l[1] = (u) => t.value = "tooltip"),
+          onFocus: l[2] || (l[2] = (u) => t.value = "tooltip show"),
+          onBlur: l[3] || (l[3] = (u) => t.value = "tooltip"),
+          onKeydown: l[4] || (l[4] = F((u) => t.value = "tooltip", ["esc"]))
+        }, [
+          I(n)
+        ], 40, pe)
+      ], 64);
+    };
+  }
+}), T = /* @__PURE__ */ b(fe, [["__scopeId", "data-v-5121adbc"]]), ve = ["for"], ge = {
+  key: 1,
+  "aria-description": "Field is required"
+}, be = ["id", "name"], he = /* @__PURE__ */ x({
+  __name: "DatetimeComponent",
+  props: /* @__PURE__ */ $({
+    isRequired: {
+      type: Boolean,
+      default: !1
+    },
+    label: {
+      type: String,
+      required: !0
+    },
+    tooltipMessage: {
+      type: String,
+      required: !1,
+      default: ""
+    },
+    tooltipTitle: {
+      type: String,
+      required: !1,
+      default: ""
+    }
+  }, {
+    model: {
+      type: Date,
+      required: !1
+    },
+    modelModifiers: {}
+  }),
+  emits: /* @__PURE__ */ $(["isValid"], ["update:model"]),
+  setup(e, { emit: a }) {
+    const o = a, t = e, i = k(e, "model"), l = q(!1), n = q(""), u = _(() => "input-" + t.label?.toLowerCase()?.replace(" ", "-"));
+    function v() {
+      l.value = !1, n.value = "";
+      let r = Number(i?.value?.toString().length);
+      r = isNaN(r) ? 0 : r, t.isRequired && r === 0 && (l.value = !0, n.value = "This field is required"), o("isValid", !l.value);
+    }
+    return (r, c) => (s(), h(M, { class: "datetime-component" }, {
+      default: N(() => [
+        m("label", { for: u.value }, [
+          t.tooltipMessage !== "" ? (s(), h(T, {
+            key: 0,
+            title: e.tooltipTitle,
+            message: e.tooltipMessage,
+            id: u.value
+          }, null, 8, ["title", "message", "id"])) : g("", !0),
+          S(" " + y(e.label), 1),
+          e.isRequired ? (s(), f("span", ge, "*")) : g("", !0)
+        ], 8, ve),
+        V(m("input", {
+          id: u.value,
+          type: "datetime-local",
+          name: t.label,
+          "onUpdate:modelValue": c[0] || (c[0] = (d) => i.value = d),
+          onKeyup: v,
+          onFocusout: v
+        }, null, 40, be), [
+          [D, i.value]
+        ]),
+        I(w, { "error-message": n.value }, null, 8, ["error-message"])
+      ]),
+      _: 1
+    }));
+  }
+}), _e = /* @__PURE__ */ b(he, [["__scopeId", "data-v-905d8a98"]]), ye = { class: "drop-down-items" }, $e = ["onClick"], qe = /* @__PURE__ */ x({
+  __name: "DropDownItem",
+  props: {
+    dropDownItems: {
+      type: Array,
+      required: !0
+    }
+  },
+  emits: ["dropDownItemClicked"],
+  setup(e, { emit: a }) {
+    const o = a;
+    function t(i) {
+      o("dropDownItemClicked", i);
+    }
+    return (i, l) => (s(), f("div", ye, [
+      (s(!0), f(O, null, G(e.dropDownItems, (n) => (s(), f("div", {
+        class: "drop-down-item",
+        onClick: (u) => t(n.trigger),
+        key: n.label
+      }, [
+        (s(), h(K(n.icon))),
+        S(" " + y(n.label), 1)
+      ], 8, $e))), 128))
+    ]));
+  }
+}), xe = /* @__PURE__ */ b(qe, [["__scopeId", "data-v-eb1af184"]]), Ie = { class: "drop-down" }, Ne = /* @__PURE__ */ x({
+  __name: "DropDown",
+  props: {
+    dropDownItems: {
+      type: Array,
+      required: !0
+    }
+  },
+  emits: ["dropDownItemClicked"],
+  setup(e, { emit: a }) {
+    const o = a, t = q(!1);
+    function i() {
+      t.value = !t.value;
+    }
+    function l(n) {
+      o("dropDownItemClicked", n), t.value = !1;
+    }
+    return (n, u) => (s(), f("div", Ie, [
+      m("button", {
+        type: "button",
+        onClick: i
+      }, [
+        L(n.$slots, "default", {}, void 0, !0)
+      ]),
+      I(E, null, {
+        default: N(() => [
+          V(I(xe, {
+            onDropDownItemClicked: l,
+            "drop-down-items": e.dropDownItems
+          }, null, 8, ["drop-down-items"]), [
+            [U, t.value]
+          ])
+        ]),
+        _: 1
+      }),
+      I(E, null, {
+        default: N(() => [
+          t.value ? (s(), f("div", {
+            key: 0,
+            onClick: i,
+            class: "drop-down-backdrop"
+          })) : g("", !0)
+        ]),
+        _: 1
+      })
+    ]));
+  }
+}), ke = /* @__PURE__ */ b(Ne, [["__scopeId", "data-v-755569e8"]]), Ve = ["for"], Se = { class: "number-input-row" }, Me = ["aria-label", "disabled"], Te = ["aria-label", "disabled"], we = /* @__PURE__ */ x({
+  __name: "NumberInput",
+  props: /* @__PURE__ */ $({
+    label: {
+      type: String,
+      required: !0
+    },
+    maxValue: {
+      type: Number,
+      default: Number.MAX_SAFE_INTEGER
+    },
+    minValue: {
+      type: Number,
+      default: Number.MIN_SAFE_INTEGER
+    },
+    stepIncrement: {
+      type: Number,
+      default: 1
+    },
+    tooltipMessage: {
+      type: String,
+      required: !1,
+      default: ""
+    },
+    tooltipTitle: {
+      type: String,
+      required: !1,
+      default: ""
+    }
+  }, {
+    modelValue: {
+      type: Number,
+      default: 0
+    },
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(e) {
+    const a = e, o = k(e, "modelValue"), t = q(""), i = _(() => "input-" + a.label?.toLowerCase()?.replace(" ", "-")), l = _(() => o.value >= a.maxValue), n = _(() => o.value <= a.minValue);
+    function u() {
+      if (t.value = "", n.value) {
+        t.value = "Reached Lowest Value";
+        return;
+      }
+      let c = Math.abs(a.minValue - o.value);
+      c = c < Math.abs(a.stepIncrement) ? c : Math.abs(a.stepIncrement);
+      let d = o.value - c;
+      d = d > a.maxValue ? a.maxValue : d, o.value = d;
+    }
+    function v() {
+      if (t.value = "", l.value) {
+        t.value = "Reached Maxium Value";
+        return;
+      }
+      let c = Math.abs(a.maxValue - o.value);
+      c = c < Math.abs(a.stepIncrement) ? c : Math.abs(a.stepIncrement);
+      let d = o.value + c;
+      d = d < a.minValue ? a.minValue : d, o.value = d;
+    }
+    function r(c) {
+      t.value = "";
+      let p = c.target?.valueAsNumber;
+      p === void 0 && (t.value = "Model is undefined - default 0", p = 0), isNaN(p) && (t.value = "Not a number - default 0", p = 0), p = p > a.maxValue ? a.maxValue : p, p = p < a.minValue ? a.minValue : p, o.value = p;
+    }
+    return (c, d) => (s(), h(M, { class: "number-input" }, {
+      default: N(() => [
+        m("label", { for: i.value }, [
+          a.tooltipMessage !== "" ? (s(), h(T, {
+            key: 0,
+            title: e.tooltipTitle,
+            message: e.tooltipMessage,
+            id: i.value
+          }, null, 8, ["title", "message", "id"])) : g("", !0),
+          S(" " + y(e.label), 1)
+        ], 8, Ve),
+        m("div", Se, [
+          m("button", {
+            type: "button",
+            class: "negative",
+            "aria-label": `Decrement current value of ${o.value} by ${a.stepIncrement}`,
+            disabled: n.value,
+            onClick: u
+          }, " - ", 8, Me),
+          V(m("input", {
+            type: "number",
+            "aria-label": "Current value picked",
+            "aria-describedby": "helper-text-explanation",
+            "onUpdate:modelValue": d[0] || (d[0] = (p) => o.value = p),
+            onChange: d[1] || (d[1] = (p) => r(p)),
+            onKeyup: d[2] || (d[2] = (p) => r(p))
+          }, null, 544), [
+            [D, o.value]
+          ]),
+          m("button", {
+            type: "button",
+            class: "positive",
+            "aria-label": `Increment current value of ${o.value} by ${a.stepIncrement}`,
+            disabled: l.value,
+            onClick: v
+          }, " + ", 8, Te)
+        ]),
+        I(w, { "error-message": t.value }, null, 8, ["error-message"])
+      ]),
+      _: 1
+    }));
+  }
+}), Ce = /* @__PURE__ */ b(we, [["__scopeId", "data-v-06558243"]]), Le = ["for"], De = {
+  key: 1,
+  "aria-description": "Field is required"
+}, Re = ["id", "name", "placeholder"], Ee = /* @__PURE__ */ x({
+  __name: "PasswordInput",
+  props: /* @__PURE__ */ $({
+    isRequired: {
+      type: Boolean,
+      default: !1
+    },
+    label: {
+      type: String,
+      required: !0
+    },
+    minLength: {
+      type: Number,
+      default: 0,
+      required: !1,
+      validator: (e) => !Number.isNaN(e)
+    },
+    placeholderText: {
+      type: String,
+      required: !1,
+      default: ""
+    },
+    tooltipMessage: {
+      type: String,
+      required: !1,
+      default: ""
+    },
+    tooltipTitle: {
+      type: String,
+      required: !1,
+      default: ""
+    }
+  }, {
+    modelValue: {},
+    modelModifiers: {}
+  }),
+  emits: /* @__PURE__ */ $(["isValid"], ["update:modelValue"]),
+  setup(e, { emit: a }) {
+    const o = a, t = e, i = k(e, "modelValue"), l = q(!1), n = q(""), u = _(() => "input-" + t.label?.toLowerCase()?.replace(" ", "-"));
+    function v() {
+      l.value = !1, n.value = "";
+      let r = Number(i?.value?.toString().length);
+      r = isNaN(r) ? 0 : r, t.isRequired && r === 0 && (l.value = !0, n.value = "This field is required"), t.minLength > 0 && r < t.minLength && (l.value = !0, n.value = `This field has a minimum length ${r} / ${t.minLength}`), o("isValid", !l.value);
+    }
+    return (r, c) => (s(), h(M, { class: "text-input" }, {
+      default: N(() => [
+        m("label", { for: u.value }, [
+          t.tooltipMessage !== "" ? (s(), h(T, {
+            key: 0,
+            title: e.tooltipTitle,
+            message: e.tooltipMessage,
+            id: u.value
+          }, null, 8, ["title", "message", "id"])) : g("", !0),
+          S(" " + y(e.label), 1),
+          e.isRequired ? (s(), f("span", De, "*")) : g("", !0)
+        ], 8, Le),
+        V(m("input", {
+          id: u.value,
+          type: "password",
+          name: t.label,
+          placeholder: t.placeholderText,
+          "onUpdate:modelValue": c[0] || (c[0] = (d) => i.value = d),
+          onKeyup: v,
+          onFocusout: v
+        }, null, 40, Re), [
+          [D, i.value]
+        ]),
+        I(w, { "error-message": n.value }, null, 8, ["error-message"])
+      ]),
+      _: 1
+    }));
+  }
+}), Oe = /* @__PURE__ */ b(Ee, [["__scopeId", "data-v-d179e9e2"]]), Ae = ["for"], je = { class: "switch-text" }, Be = /* @__PURE__ */ x({
+  __name: "SwitchComponent",
+  props: /* @__PURE__ */ $({
+    label: {
+      type: String,
+      required: !0
+    },
+    offText: {
+      type: String,
+      required: !1,
+      default: ""
+    },
+    onText: {
+      type: String,
+      required: !1,
+      default: ""
+    },
+    tooltipMessage: {
+      type: String,
+      required: !1,
+      default: ""
+    },
+    tooltipTitle: {
+      type: String,
+      required: !1,
+      default: ""
+    }
+  }, {
+    modelValue: {
+      type: Boolean
+    },
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(e) {
+    const a = e, o = _(() => l.value ? "switch on" : "switch off"), t = _(() => "input-" + a.label?.toLowerCase()?.replace(" ", "-")), i = _(() => l.value ? a.onText : a.offText), l = k(e, "modelValue");
+    function n() {
+      l.value = !l.value;
+    }
+    return (u, v) => (s(), h(M, { class: "switch-component" }, {
+      default: N(() => [
+        m("label", { for: t.value }, [
+          a.tooltipMessage !== "" ? (s(), h(T, {
+            key: 0,
+            title: e.tooltipTitle,
+            message: e.tooltipMessage,
+            id: t.value
+          }, null, 8, ["title", "message", "id"])) : g("", !0),
+          S(" " + y(e.label), 1)
+        ], 8, Ae),
+        m("div", {
+          onClick: n,
+          class: A(o.value)
+        }, [
+          m("div", je, y(i.value), 1),
+          v[0] || (v[0] = m("div", { class: "switch-block" }, null, -1))
+        ], 2)
+      ]),
+      _: 1
+    }));
+  }
+}), Fe = /* @__PURE__ */ b(Be, [["__scopeId", "data-v-f28e5f26"]]), Ge = ["for"], Ke = {
+  key: 1,
+  "aria-description": "Field is required"
+}, Ue = ["id", "name", "placeholder"], Pe = /* @__PURE__ */ x({
+  __name: "TextArea",
+  props: /* @__PURE__ */ $({
+    isRequired: {
+      type: Boolean,
+      default: !1
+    },
+    label: {
+      type: String,
+      required: !0
+    },
+    minLength: {
+      type: Number,
+      default: 0,
+      required: !1,
+      validator: (e) => !Number.isNaN(e)
+    },
+    maxLength: {
+      type: Number,
+      default: 0,
+      required: !1,
+      validator: (e) => !Number.isNaN(e)
+    },
+    placeholderText: {
+      type: String,
+      required: !1,
+      default: ""
+    },
+    tooltipMessage: {
+      type: String,
+      required: !1,
+      default: ""
+    },
+    tooltipTitle: {
+      type: String,
+      required: !1,
+      default: ""
+    }
+  }, {
+    model: {
+      type: String,
+      required: !1,
+      default: ""
+    },
+    modelModifiers: {}
+  }),
+  emits: /* @__PURE__ */ $(["isValid"], ["update:model"]),
+  setup(e, { emit: a }) {
+    const o = a, t = e, i = k(e, "model"), l = q(!1), n = q(""), u = _(() => "input-" + t.label?.toLowerCase()?.replace(" ", "-"));
+    function v() {
+      l.value = !1, n.value = "";
+      let r = Number(i?.value?.toString().length);
+      r = isNaN(r) ? 0 : r, t.isRequired && r === 0 && (l.value = !0, n.value = "This field is required"), t.minLength > 0 && r < t.minLength && (l.value = !0, n.value = `This field has a minimum length ${r} / ${t.minLength}`), t.maxLength > 0 && r > t.maxLength && (l.value = !0, n.value = `This field has a maximum length ${r} / ${t.maxLength}`), o("isValid", !l.value);
+    }
+    return (r, c) => (s(), h(M, null, {
+      default: N(() => [
+        m("label", { for: u.value }, [
+          t.tooltipMessage !== "" ? (s(), h(T, {
+            key: 0,
+            title: e.tooltipTitle,
+            message: e.tooltipMessage,
+            id: u.value
+          }, null, 8, ["title", "message", "id"])) : g("", !0),
+          S(" " + y(e.label), 1),
+          e.isRequired ? (s(), f("span", Ke, "*")) : g("", !0)
+        ], 8, Ge),
+        V(m("textarea", {
+          rows: "10",
+          id: u.value,
+          type: "text",
+          name: t.label,
+          placeholder: t.placeholderText,
+          "onUpdate:modelValue": c[0] || (c[0] = (d) => i.value = d),
+          onKeyup: v,
+          onFocusout: v
+        }, null, 40, Ue), [
+          [D, i.value]
+        ]),
+        I(w, { "error-message": n.value }, null, 8, ["error-message"])
+      ]),
+      _: 1
+    }));
+  }
+}), ze = /* @__PURE__ */ b(Pe, [["__scopeId", "data-v-88c9adeb"]]), Xe = ["for"], He = {
+  key: 1,
+  "aria-description": "Field is required"
+}, Je = ["id", "name", "placeholder"], Qe = /* @__PURE__ */ x({
+  __name: "TextInput",
+  props: /* @__PURE__ */ $({
+    isRequired: {
+      type: Boolean,
+      default: !1
+    },
+    label: {
+      type: String,
+      required: !0
+    },
+    minLength: {
+      type: Number,
+      default: 0,
+      required: !1,
+      validator: (e) => !Number.isNaN(e)
+    },
+    maxLength: {
+      type: Number,
+      default: 0,
+      required: !1,
+      validator: (e) => !Number.isNaN(e)
+    },
+    placeholderText: {
+      type: String,
+      required: !1,
+      default: ""
+    },
+    tooltipMessage: {
+      type: String,
+      required: !1,
+      default: ""
+    },
+    tooltipTitle: {
+      type: String,
+      required: !1,
+      default: ""
+    }
+  }, {
+    modelValue: { required: !0 },
+    modelModifiers: {}
+  }),
+  emits: /* @__PURE__ */ $(["isValid"], ["update:modelValue"]),
+  setup(e, { emit: a }) {
+    const o = a, t = e, i = k(e, "modelValue"), l = q(!1), n = q(""), u = _(() => "input-" + t.label?.toLowerCase()?.replace(" ", "-"));
+    function v() {
+      l.value = !1, n.value = "";
+      let r = Number(i?.value?.toString().length);
+      r = isNaN(r) ? 0 : r, t.isRequired && r === 0 && (l.value = !0, n.value = "This field is required"), t.minLength > 0 && r < t.minLength && (l.value = !0, n.value = `This field has a minimum length ${r} / ${t.minLength}`), t.maxLength > 0 && r > t.maxLength && (l.value = !0, n.value = `This field has a maximum length ${r} / ${t.maxLength}`), o("isValid", !l.value);
+    }
+    return (r, c) => (s(), h(M, { class: "text-input" }, {
+      default: N(() => [
+        m("label", { for: u.value }, [
+          t.tooltipMessage !== "" ? (s(), h(T, {
+            key: 0,
+            title: e.tooltipTitle,
+            message: e.tooltipMessage,
+            id: u.value
+          }, null, 8, ["title", "message", "id"])) : g("", !0),
+          S(" " + y(e.label), 1),
+          e.isRequired ? (s(), f("span", He, "*")) : g("", !0)
+        ], 8, Xe),
+        V(m("input", {
+          id: u.value,
+          type: "text",
+          name: t.label,
+          placeholder: t.placeholderText,
+          "onUpdate:modelValue": c[0] || (c[0] = (d) => i.value = d),
+          onKeyup: v,
+          onFocusout: v
+        }, null, 40, Je), [
+          [D, i.value]
+        ]),
+        I(w, { "error-message": n.value }, null, 8, ["error-message"])
+      ]),
+      _: 1
+    }));
+  }
+}), We = /* @__PURE__ */ b(Qe, [["__scopeId", "data-v-354652ea"]]), Ye = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
-  ButtonComponent: f
-}, Symbol.toStringTag, { value: "Module" })), k = {
+  ButtonComponent: H,
+  CardComponent: Y,
+  CheckBox: le,
+  DatetimeComponent: _e,
+  DropDown: ke,
+  FormGroup: M,
+  NumberInput: Ce,
+  PasswordInput: Oe,
+  RenderErrorMessage: w,
+  SwitchComponent: Fe,
+  TextArea: ze,
+  TextInput: We,
+  ToolTip: T
+}, Symbol.toStringTag, { value: "Module" })), et = {
   customer: "Customer",
   group: "Group",
   kanban_board: "Kanban Board",
@@ -47,7 +700,7 @@ const o = {
   project: "Project",
   task: "Task",
   user: "User"
-}, S = {
+}, tt = {
   customer: "customer",
   kanban_board: "kanban_board",
   kanban_card: "kanban_card",
@@ -57,17 +710,29 @@ const o = {
   requirement_item: "requirement_item",
   project: "project",
   task: "task"
-}, q = {
+}, at = {
   install(e) {
-    Object.entries(O).forEach(([t, n]) => {
-      e.component(t, n);
+    Object.entries(Ye).forEach(([a, o]) => {
+      e.component(a, o);
     });
   }
 };
 export {
-  f as ButtonComponent,
-  o as ObjectStateEnum,
-  k as ObjectTitleCaseEnums,
-  S as ObjectTypeEnums,
-  q as default
+  H as ButtonComponent,
+  Y as CardComponent,
+  le as CheckBox,
+  _e as DatetimeComponent,
+  ke as DropDown,
+  M as FormGroup,
+  Ce as NumberInput,
+  C as ObjectStateEnum,
+  et as ObjectTitleCaseEnums,
+  tt as ObjectTypeEnums,
+  Oe as PasswordInput,
+  w as RenderErrorMessage,
+  Fe as SwitchComponent,
+  ze as TextArea,
+  We as TextInput,
+  T as ToolTip,
+  at as default
 };