@gxp-dev/mod-ui 2.0.0

package/dist/components/compositions/elements/input/TextInput.vue2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextInput.vue2.js","sources":["../../../../../src/components/compositions/elements/input/TextInput.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven text input composition. Composes the shadcn `Input`\n * primitive with `FieldFrame` chrome (label + helpText + errors).\n *\n * Self-contained — usable directly in any Vue app:\n *\n *   <TextInput v-model=\"firstName\" label=\"First name\" required />\n *\n * The JSON-driven engine renders this via `ElementRenderer`, which\n * binds `modelValue` / `errors` to the form-data store automatically.\n */\nimport { onMounted, useTemplateRef } from \"vue\"\nimport { Input } from \"@/components/ui/input\"\nimport { FieldFrame } from \"@/components/ui/field-frame\"\n\nexport interface TextInputProps {\n  modelValue?: string | number | null\n  id?: string\n  name?: string\n  label?: string\n  hideLabel?: boolean\n  placeholder?: string\n  required?: boolean\n  readonly?: boolean\n  disabled?: boolean\n  maxlength?: number\n  minlength?: number\n  helpText?: string\n  errors?: string[]\n  autoFocus?: boolean\n}\n\nconst props = withDefaults(defineProps<TextInputProps>(), {\n  errors: () => [],\n})\n\nconst model = defineModel<string | number | null>(\"modelValue\")\n\nconst inputRef = useTemplateRef<HTMLInputElement>(\"inputRef\")\n\nonMounted(() => {\n  if (props.autoFocus) {\n    inputRef.value?.focus()\n  }\n})\n</script>\n\n<template>\n  <FieldFrame\n    :label=\"label\"\n    :required=\"required\"\n    :hide-label=\"hideLabel\"\n    :for=\"id\"\n    :help-text=\"helpText\"\n    :errors=\"errors\"\n  >\n    <Input\n      ref=\"inputRef\"\n      :model-value=\"model ?? undefined\"\n      :id=\"id\"\n      :name=\"name ?? undefined\"\n      type=\"text\"\n      :placeholder=\"placeholder ?? ''\"\n      :readonly=\"readonly\"\n      :disabled=\"disabled\"\n      :required=\"required\"\n      :maxlength=\"maxlength\"\n      :minlength=\"minlength\"\n      :data-element-name=\"name ?? undefined\"\n      :class=\"errors.length ? 'border-destructive ring-destructive' : ''\"\n      @update:model-value=\"(v: string | number | undefined) => (model = v ?? '')\"\n    />\n  </FieldFrame>\n</template>\n"],"names":["props","__props","model","_useModel","inputRef","useTemplateRef","onMounted","_a","_createBlock","_unref","FieldFrame","_createVNode","Input","_normalizeClass","_cache","v"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAiCA,UAAMA,IAAQC,GAIRC,IAAQC,KAAoC,YAAY,GAExDC,IAAWC,EAAiC,UAAU;AAE5D,WAAAC,EAAU,MAAM;;AACd,MAAIN,EAAM,eACRO,IAAAH,EAAS,UAAT,QAAAG,EAAgB;AAAA,IAEpB,CAAC,mBAICC,EAwBaC,EAAAC,CAAA,GAAA;AAAA,MAvBV,OAAOT,EAAA;AAAA,MACP,UAAUA,EAAA;AAAA,MACV,cAAYA,EAAA;AAAA,MACZ,KAAKA,EAAA;AAAA,MACL,aAAWA,EAAA;AAAA,MACX,QAAQA,EAAA;AAAA,IAAA;iBAET,MAeE;AAAA,QAfFU,EAeEF,EAAAG,CAAA,GAAA;AAAA,mBAdI;AAAA,UAAJ,KAAIR;AAAA,UACH,eAAaF,EAAA,SAAS;AAAA,UACtB,IAAID,EAAA;AAAA,UACJ,MAAMA,EAAA,QAAQ;AAAA,UACf,MAAK;AAAA,UACJ,aAAaA,EAAA,eAAW;AAAA,UACxB,UAAUA,EAAA;AAAA,UACV,UAAUA,EAAA;AAAA,UACV,UAAUA,EAAA;AAAA,UACV,WAAWA,EAAA;AAAA,UACX,WAAWA,EAAA;AAAA,UACX,qBAAmBA,EAAA,QAAQ;AAAA,UAC3B,OAAKY,EAAEZ,EAAA,OAAO,SAAM,wCAAA,EAAA;AAAA,UACpB,uBAAkBa,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAGC,MAAoCb,EAAA,QAAQa,KAAC;AAAA,QAAA;;;;;;"}

package/dist/components/compositions/elements/input/TextareaInput.vue.js

@@ -0,0 +1,5 @@
+import f from "./TextareaInput.vue2.js";
+export {
+  f as default
+};
+//# sourceMappingURL=TextareaInput.vue.js.map

package/dist/components/compositions/elements/input/TextareaInput.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextareaInput.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/compositions/elements/input/TextareaInput.vue2.js

@@ -0,0 +1,66 @@
+import { defineComponent as i, useModel as m, useTemplateRef as u, onMounted as f, openBlock as s, createBlock as c, unref as o, withCtx as h, createVNode as x, normalizeClass as b, mergeModels as g } from "vue";
+import v from "../../../ui/textarea/Textarea.vue.js";
+import y from "../../../ui/field-frame/FieldFrame.vue.js";
+const w = /* @__PURE__ */ i({
+  __name: "TextareaInput",
+  props: /* @__PURE__ */ g({
+    modelValue: {},
+    id: {},
+    name: {},
+    label: {},
+    hideLabel: { type: Boolean },
+    placeholder: {},
+    required: { type: Boolean },
+    readonly: { type: Boolean },
+    disabled: { type: Boolean },
+    maxlength: {},
+    minlength: {},
+    rows: { default: 3 },
+    helpText: {},
+    errors: { default: () => [] },
+    autoFocus: { type: Boolean }
+  }, {
+    modelValue: {},
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(e) {
+    const r = e, a = m(e, "modelValue"), t = u("textareaRef");
+    return f(() => {
+      var l;
+      r.autoFocus && ((l = t.value) == null || l.focus());
+    }), (l, d) => (s(), c(o(y), {
+      label: e.label,
+      required: e.required,
+      "hide-label": e.hideLabel,
+      for: e.id,
+      "help-text": e.helpText,
+      errors: e.errors
+    }, {
+      default: h(() => [
+        x(o(v), {
+          ref_key: "textareaRef",
+          ref: t,
+          "model-value": a.value ?? void 0,
+          id: e.id,
+          name: e.name ?? void 0,
+          placeholder: e.placeholder ?? "",
+          readonly: e.readonly,
+          disabled: e.disabled,
+          required: e.required,
+          maxlength: e.maxlength,
+          minlength: e.minlength,
+          rows: e.rows,
+          "data-element-name": e.name ?? void 0,
+          class: b(e.errors.length ? "border-destructive ring-destructive" : ""),
+          "onUpdate:modelValue": d[0] || (d[0] = (n) => a.value = n ?? "")
+        }, null, 8, ["model-value", "id", "name", "placeholder", "readonly", "disabled", "required", "maxlength", "minlength", "rows", "data-element-name", "class"])
+      ]),
+      _: 1
+    }, 8, ["label", "required", "hide-label", "for", "help-text", "errors"]));
+  }
+});
+export {
+  w as default
+};
+//# sourceMappingURL=TextareaInput.vue2.js.map

package/dist/components/compositions/elements/input/TextareaInput.vue2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextareaInput.vue2.js","sources":["../../../../../src/components/compositions/elements/input/TextareaInput.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven textarea input composition. Composes the shadcn\n * `Textarea` primitive and `FieldFrame` chrome.\n *\n * Self-contained — usable directly in any Vue app:\n *\n *   <TextareaInput v-model=\"bio\" label=\"Bio\" :rows=\"5\" />\n */\nimport { onMounted, useTemplateRef } from \"vue\"\nimport { Textarea } from \"@/components/ui/textarea\"\nimport { FieldFrame } from \"@/components/ui/field-frame\"\n\nexport interface TextareaInputProps {\n  modelValue?: string\n  id?: string\n  name?: string\n  label?: string\n  hideLabel?: boolean\n  placeholder?: string\n  required?: boolean\n  readonly?: boolean\n  disabled?: boolean\n  maxlength?: number\n  minlength?: number\n  rows?: number\n  helpText?: string\n  errors?: string[]\n  autoFocus?: boolean\n}\n\nconst props = withDefaults(defineProps<TextareaInputProps>(), {\n  rows: 3,\n  errors: () => [],\n})\n\nconst model = defineModel<string>(\"modelValue\")\n\nconst textareaRef = useTemplateRef<HTMLTextAreaElement>(\"textareaRef\")\n\nonMounted(() => {\n  if (props.autoFocus) {\n    textareaRef.value?.focus()\n  }\n})\n</script>\n\n<template>\n  <FieldFrame\n    :label=\"label\"\n    :required=\"required\"\n    :hide-label=\"hideLabel\"\n    :for=\"id\"\n    :help-text=\"helpText\"\n    :errors=\"errors\"\n  >\n    <Textarea\n      ref=\"textareaRef\"\n      :model-value=\"model ?? undefined\"\n      :id=\"id\"\n      :name=\"name ?? undefined\"\n      :placeholder=\"placeholder ?? ''\"\n      :readonly=\"readonly\"\n      :disabled=\"disabled\"\n      :required=\"required\"\n      :maxlength=\"maxlength\"\n      :minlength=\"minlength\"\n      :rows=\"rows\"\n      :data-element-name=\"name ?? undefined\"\n      :class=\"errors.length ? 'border-destructive ring-destructive' : ''\"\n      @update:model-value=\"(v: string | undefined) => (model = v ?? '')\"\n    />\n  </FieldFrame>\n</template>\n"],"names":["props","__props","model","_useModel","textareaRef","useTemplateRef","onMounted","_a","_createBlock","_unref","FieldFrame","_createVNode","Textarea","_normalizeClass","_cache","v"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AA+BA,UAAMA,IAAQC,GAKRC,IAAQC,EAAmBF,GAAC,YAAY,GAExCG,IAAcC,EAAoC,aAAa;AAErE,WAAAC,EAAU,MAAM;;AACd,MAAIN,EAAM,eACRO,IAAAH,EAAY,UAAZ,QAAAG,EAAmB;AAAA,IAEvB,CAAC,mBAICC,EAwBaC,EAAAC,CAAA,GAAA;AAAA,MAvBV,OAAOT,EAAA;AAAA,MACP,UAAUA,EAAA;AAAA,MACV,cAAYA,EAAA;AAAA,MACZ,KAAKA,EAAA;AAAA,MACL,aAAWA,EAAA;AAAA,MACX,QAAQA,EAAA;AAAA,IAAA;iBAET,MAeE;AAAA,QAfFU,EAeEF,EAAAG,CAAA,GAAA;AAAA,mBAdI;AAAA,UAAJ,KAAIR;AAAA,UACH,eAAaF,EAAA,SAAS;AAAA,UACtB,IAAID,EAAA;AAAA,UACJ,MAAMA,EAAA,QAAQ;AAAA,UACd,aAAaA,EAAA,eAAW;AAAA,UACxB,UAAUA,EAAA;AAAA,UACV,UAAUA,EAAA;AAAA,UACV,UAAUA,EAAA;AAAA,UACV,WAAWA,EAAA;AAAA,UACX,WAAWA,EAAA;AAAA,UACX,MAAMA,EAAA;AAAA,UACN,qBAAmBA,EAAA,QAAQ;AAAA,UAC3B,OAAKY,EAAEZ,EAAA,OAAO,SAAM,wCAAA,EAAA;AAAA,UACpB,uBAAkBa,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAGC,MAA2Bb,EAAA,QAAQa,KAAC;AAAA,QAAA;;;;;;"}

package/dist/components/compositions/elements/input/UrlInput.vue.js

@@ -0,0 +1,5 @@
+import f from "./UrlInput.vue2.js";
+export {
+  f as default
+};
+//# sourceMappingURL=UrlInput.vue.js.map

package/dist/components/compositions/elements/input/UrlInput.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UrlInput.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/compositions/elements/input/UrlInput.vue2.js

@@ -0,0 +1,65 @@
+import { defineComponent as i, useModel as u, useTemplateRef as m, onMounted as f, openBlock as c, createBlock as h, unref as o, withCtx as s, createVNode as b, normalizeClass as g, mergeModels as x } from "vue";
+import y from "../../../ui/input/Input.vue.js";
+import v from "../../../ui/field-frame/FieldFrame.vue.js";
+const M = /* @__PURE__ */ i({
+  __name: "UrlInput",
+  props: /* @__PURE__ */ x({
+    modelValue: {},
+    id: {},
+    name: {},
+    label: {},
+    hideLabel: { type: Boolean },
+    placeholder: {},
+    required: { type: Boolean },
+    readonly: { type: Boolean },
+    disabled: { type: Boolean },
+    maxlength: {},
+    minlength: {},
+    helpText: {},
+    errors: { default: () => [] },
+    autoFocus: { type: Boolean }
+  }, {
+    modelValue: {},
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(e) {
+    const r = e, a = u(e, "modelValue"), t = m("inputRef");
+    return f(() => {
+      var l;
+      r.autoFocus && ((l = t.value) == null || l.focus());
+    }), (l, d) => (c(), h(o(v), {
+      label: e.label,
+      required: e.required,
+      "hide-label": e.hideLabel,
+      for: e.id,
+      "help-text": e.helpText,
+      errors: e.errors
+    }, {
+      default: s(() => [
+        b(o(y), {
+          ref_key: "inputRef",
+          ref: t,
+          "model-value": a.value ?? void 0,
+          id: e.id,
+          name: e.name ?? void 0,
+          type: "url",
+          placeholder: e.placeholder ?? "",
+          readonly: e.readonly,
+          disabled: e.disabled,
+          required: e.required,
+          maxlength: e.maxlength,
+          minlength: e.minlength,
+          "data-element-name": e.name ?? void 0,
+          class: g(e.errors.length ? "border-destructive ring-destructive" : ""),
+          "onUpdate:modelValue": d[0] || (d[0] = (n) => a.value = n == null ? "" : String(n))
+        }, null, 8, ["model-value", "id", "name", "placeholder", "readonly", "disabled", "required", "maxlength", "minlength", "data-element-name", "class"])
+      ]),
+      _: 1
+    }, 8, ["label", "required", "hide-label", "for", "help-text", "errors"]));
+  }
+});
+export {
+  M as default
+};
+//# sourceMappingURL=UrlInput.vue2.js.map

package/dist/components/compositions/elements/input/UrlInput.vue2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UrlInput.vue2.js","sources":["../../../../../src/components/compositions/elements/input/UrlInput.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven URL input composition. Composes the shadcn `Input`\n * primitive (with `type=\"url\"`) and `FieldFrame` chrome.\n *\n * Self-contained — usable directly in any Vue app:\n *\n *   <UrlInput v-model=\"website\" label=\"Website\" />\n */\nimport { onMounted, useTemplateRef } from \"vue\"\nimport { Input } from \"@/components/ui/input\"\nimport { FieldFrame } from \"@/components/ui/field-frame\"\n\nexport interface UrlInputProps {\n  modelValue?: string\n  id?: string\n  name?: string\n  label?: string\n  hideLabel?: boolean\n  placeholder?: string\n  required?: boolean\n  readonly?: boolean\n  disabled?: boolean\n  maxlength?: number\n  minlength?: number\n  helpText?: string\n  errors?: string[]\n  autoFocus?: boolean\n}\n\nconst props = withDefaults(defineProps<UrlInputProps>(), {\n  errors: () => [],\n})\n\nconst model = defineModel<string>(\"modelValue\")\n\nconst inputRef = useTemplateRef<HTMLInputElement>(\"inputRef\")\n\nonMounted(() => {\n  if (props.autoFocus) {\n    inputRef.value?.focus()\n  }\n})\n</script>\n\n<template>\n  <FieldFrame\n    :label=\"label\"\n    :required=\"required\"\n    :hide-label=\"hideLabel\"\n    :for=\"id\"\n    :help-text=\"helpText\"\n    :errors=\"errors\"\n  >\n    <Input\n      ref=\"inputRef\"\n      :model-value=\"model ?? undefined\"\n      :id=\"id\"\n      :name=\"name ?? undefined\"\n      type=\"url\"\n      :placeholder=\"placeholder ?? ''\"\n      :readonly=\"readonly\"\n      :disabled=\"disabled\"\n      :required=\"required\"\n      :maxlength=\"maxlength\"\n      :minlength=\"minlength\"\n      :data-element-name=\"name ?? undefined\"\n      :class=\"errors.length ? 'border-destructive ring-destructive' : ''\"\n      @update:model-value=\"(v: string | number | undefined) => (model = v == null ? '' : String(v))\"\n    />\n  </FieldFrame>\n</template>\n"],"names":["props","__props","model","_useModel","inputRef","useTemplateRef","onMounted","_a","_createBlock","_unref","FieldFrame","_createVNode","Input","_normalizeClass","_cache","v"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AA8BA,UAAMA,IAAQC,GAIRC,IAAQC,EAAmBF,GAAC,YAAY,GAExCG,IAAWC,EAAiC,UAAU;AAE5D,WAAAC,EAAU,MAAM;;AACd,MAAIN,EAAM,eACRO,IAAAH,EAAS,UAAT,QAAAG,EAAgB;AAAA,IAEpB,CAAC,mBAICC,EAwBaC,EAAAC,CAAA,GAAA;AAAA,MAvBV,OAAOT,EAAA;AAAA,MACP,UAAUA,EAAA;AAAA,MACV,cAAYA,EAAA;AAAA,MACZ,KAAKA,EAAA;AAAA,MACL,aAAWA,EAAA;AAAA,MACX,QAAQA,EAAA;AAAA,IAAA;iBAET,MAeE;AAAA,QAfFU,EAeEF,EAAAG,CAAA,GAAA;AAAA,mBAdI;AAAA,UAAJ,KAAIR;AAAA,UACH,eAAaF,EAAA,SAAS;AAAA,UACtB,IAAID,EAAA;AAAA,UACJ,MAAMA,EAAA,QAAQ;AAAA,UACf,MAAK;AAAA,UACJ,aAAaA,EAAA,eAAW;AAAA,UACxB,UAAUA,EAAA;AAAA,UACV,UAAUA,EAAA;AAAA,UACV,UAAUA,EAAA;AAAA,UACV,WAAWA,EAAA;AAAA,UACX,WAAWA,EAAA;AAAA,UACX,qBAAmBA,EAAA,QAAQ;AAAA,UAC3B,OAAKY,EAAEZ,EAAA,OAAO,SAAM,wCAAA,EAAA;AAAA,UACpB,uBAAkBa,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAGC,MAAoCb,EAAA,QAAQa,KAAC,OAAA,KAAgB,OAAOA,CAAC;AAAA,QAAA;;;;;;"}

package/dist/components/compositions/elements/option-select/AsyncSelectOption.vue.js

@@ -0,0 +1,5 @@
+import f from "./AsyncSelectOption.vue2.js";
+export {
+  f as default
+};
+//# sourceMappingURL=AsyncSelectOption.vue.js.map

package/dist/components/compositions/elements/option-select/AsyncSelectOption.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AsyncSelectOption.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/compositions/elements/option-select/AsyncSelectOption.vue2.js

@@ -0,0 +1,170 @@
+import { defineComponent as A, useModel as q, watch as w, computed as c, openBlock as r, createBlock as f, unref as l, withCtx as o, createVNode as d, normalizeClass as C, createCommentVNode as S, createElementBlock as L, toDisplayString as g, createTextVNode as O, Fragment as N, renderList as U, mergeModels as R } from "vue";
+import { Search as z, Loader2 as D } from "lucide-vue-next";
+import E from "../../../ui/combobox/Combobox.vue.js";
+import F from "../../../ui/combobox/ComboboxAnchor.vue.js";
+import I from "../../../ui/combobox/ComboboxContent.vue.js";
+import j from "../../../ui/combobox/ComboboxEmpty.vue.js";
+import "@vueuse/core";
+import "reka-ui";
+import "clsx";
+import "tailwind-merge";
+import G from "../../../ui/combobox/ComboboxInput.vue.js";
+import H from "../../../ui/combobox/ComboboxItem.vue.js";
+import J from "../../../ui/combobox/ComboboxItemIndicator.vue.js";
+import K from "../../../ui/field-frame/FieldFrame.vue.js";
+import { useAsyncSearch as P } from "../../../../composables/useAsyncSearch.js";
+const Q = {
+  key: 0,
+  class: "px-2 py-2 text-sm text-muted-foreground",
+  "data-testid": "async-select-loading-text"
+}, se = /* @__PURE__ */ A({
+  __name: "AsyncSelectOption",
+  props: /* @__PURE__ */ R({
+    modelValue: {},
+    id: {},
+    name: {},
+    label: {},
+    hideLabel: { type: Boolean },
+    placeholder: {},
+    required: { type: Boolean },
+    readonly: { type: Boolean },
+    disabled: { type: Boolean },
+    helpText: {},
+    errors: { default: () => [] },
+    onSearch: {},
+    initialOptions: { default: () => [] },
+    minSearchLength: { default: 1 },
+    debounceMs: { default: 250 },
+    loadingText: { default: "Loading..." },
+    emptyText: { default: "No results" }
+  }, {
+    modelValue: {},
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(a, { expose: k }) {
+    const t = a, u = q(a, "modelValue");
+    function p(e) {
+      return typeof e == "string" ? { label: e, value: e, disabled: !1 } : {
+        label: e.label,
+        value: String(e.value),
+        disabled: !!e.disabled
+      };
+    }
+    const { query: v, results: h, isLoading: y, trigger: x } = P({
+      onSearch: t.onSearch,
+      initialOptions: t.initialOptions,
+      minSearchLength: t.minSearchLength,
+      debounceMs: t.debounceMs
+    });
+    w(
+      () => t.initialOptions,
+      (e) => {
+        v.value.length < t.minSearchLength && (h.value = e ? [...e] : []);
+      }
+    );
+    const b = c(
+      () => (h.value ?? []).map(p)
+    ), V = c(() => {
+      const e = (t.initialOptions ?? []).map(p), i = b.value, n = /* @__PURE__ */ new Map();
+      for (const s of e)
+        n.set(s.value, s);
+      for (const s of i)
+        n.set(s.value, s);
+      return Array.from(n.values());
+    }), m = c(() => {
+      if (!(u.value === void 0 || u.value === null))
+        return String(u.value);
+    }), B = c(() => {
+      if (m.value === void 0)
+        return "";
+      const e = V.value.find((i) => i.value === m.value);
+      return e ? e.label : m.value;
+    });
+    function $(e) {
+      const i = e.target.value;
+      x(i);
+    }
+    function M(e) {
+      if (Array.isArray(e)) {
+        u.value = e[0] === void 0 ? null : e[0];
+        return;
+      }
+      u.value = e === void 0 ? null : e;
+    }
+    function T(e) {
+      e && v.value === "" && (h.value = t.initialOptions ? [...t.initialOptions] : []);
+    }
+    return k({ trigger: x }), (e, i) => (r(), f(l(K), {
+      label: a.label,
+      required: a.required,
+      "hide-label": a.hideLabel,
+      for: a.id,
+      "help-text": a.helpText,
+      errors: a.errors
+    }, {
+      default: o(() => [
+        d(l(E), {
+          "model-value": m.value,
+          disabled: a.disabled || a.readonly,
+          "ignore-filter": "",
+          "onUpdate:modelValue": M,
+          "onUpdate:open": T
+        }, {
+          default: o(() => [
+            d(l(F), {
+              "data-element-name": a.name ?? void 0,
+              "data-testid": "async-select-anchor",
+              class: C(a.errors.length ? "border-destructive ring-destructive" : "")
+            }, {
+              default: o(() => [
+                d(l(z), { class: "mr-2 h-4 w-4 shrink-0 opacity-50" }),
+                d(l(G), {
+                  id: a.id,
+                  "model-value": l(v),
+                  placeholder: B.value || (a.placeholder ?? "Search…"),
+                  "data-testid": "async-select-input",
+                  onInput: $
+                }, null, 8, ["id", "model-value", "placeholder"]),
+                l(y) ? (r(), f(l(D), {
+                  key: 0,
+                  "data-testid": "async-select-loader",
+                  class: "ml-2 h-4 w-4 shrink-0 animate-spin text-muted-foreground"
+                })) : S("", !0)
+              ]),
+              _: 1
+            }, 8, ["data-element-name", "class"]),
+            d(l(I), null, {
+              default: o(() => [
+                l(y) ? (r(), L("div", Q, g(a.loadingText), 1)) : b.value.length === 0 ? (r(), f(l(j), { key: 1 }, {
+                  default: o(() => [
+                    O(g(a.emptyText), 1)
+                  ]),
+                  _: 1
+                })) : S("", !0),
+                (r(!0), L(N, null, U(b.value, (n) => (r(), f(l(H), {
+                  key: n.value,
+                  value: n.value,
+                  disabled: n.disabled
+                }, {
+                  default: o(() => [
+                    d(l(J)),
+                    O(" " + g(n.label), 1)
+                  ]),
+                  _: 2
+                }, 1032, ["value", "disabled"]))), 128))
+              ]),
+              _: 1
+            })
+          ]),
+          _: 1
+        }, 8, ["model-value", "disabled"])
+      ]),
+      _: 1
+    }, 8, ["label", "required", "hide-label", "for", "help-text", "errors"]));
+  }
+});
+export {
+  se as default
+};
+//# sourceMappingURL=AsyncSelectOption.vue2.js.map

package/dist/components/compositions/elements/option-select/AsyncSelectOption.vue2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AsyncSelectOption.vue2.js","sources":["../../../../../src/components/compositions/elements/option-select/AsyncSelectOption.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven async select composition. Combines the shadcn Combobox\n * primitive with a Promise-returning `onSearch` callback the consumer\n * supplies — the composition itself makes no HTTP calls.\n *\n *   <AsyncSelectOption\n *     v-model=\"userId\"\n *     label=\"User\"\n *     :on-search=\"(q) => fetch(`/users?q=${q}`).then(r => r.json())\"\n *     :initial-options=\"[]\"\n *     :min-search-length=\"1\"\n *   />\n */\nimport { computed, watch } from \"vue\"\nimport { Loader2, Search } from \"lucide-vue-next\"\nimport type { SelectOptionLike } from \"@/definitions/shared/select-options\"\nimport {\n  Combobox,\n  ComboboxAnchor,\n  ComboboxContent,\n  ComboboxEmpty,\n  ComboboxInput,\n  ComboboxItem,\n  ComboboxItemIndicator,\n} from \"@/components/ui/combobox\"\nimport { FieldFrame } from \"@/components/ui/field-frame\"\nimport { useAsyncSearch } from \"@/composables/useAsyncSearch\"\n\nexport interface AsyncSelectOptionProps {\n  modelValue?: string | number | null\n  id?: string\n  name?: string\n  label?: string\n  hideLabel?: boolean\n  placeholder?: string\n  required?: boolean\n  readonly?: boolean\n  disabled?: boolean\n  helpText?: string\n  errors?: string[]\n  /** Called when the user types — must return a Promise of options. */\n  onSearch?: (query: string) => Promise<SelectOptionLike[]>\n  /** Options shown before any search runs. */\n  initialOptions?: SelectOptionLike[]\n  /** Minimum length before `onSearch` is invoked. Default 1. */\n  minSearchLength?: number\n  /** Debounce delay before `onSearch` fires. Default 250. */\n  debounceMs?: number\n  loadingText?: string\n  emptyText?: string\n}\n\nconst props = withDefaults(defineProps<AsyncSelectOptionProps>(), {\n  errors: () => [],\n  initialOptions: () => [],\n  minSearchLength: 1,\n  debounceMs: 250,\n  loadingText: \"Loading...\",\n  emptyText: \"No results\",\n})\n\nconst model = defineModel<string | number | null>(\"modelValue\")\n\ninterface NormalisedOption {\n  label: string\n  value: string\n  disabled: boolean\n}\n\nfunction normaliseOption(opt: SelectOptionLike): NormalisedOption {\n  if (typeof opt === \"string\") {\n    return { label: opt, value: opt, disabled: false }\n  }\n  return {\n    label: opt.label,\n    value: String(opt.value),\n    disabled: Boolean(opt.disabled),\n  }\n}\n\nconst { query, results, isLoading, trigger } = useAsyncSearch({\n  onSearch: props.onSearch,\n  initialOptions: props.initialOptions,\n  minSearchLength: props.minSearchLength,\n  debounceMs: props.debounceMs,\n})\n\n// Keep results in sync when initialOptions change and there's no query.\nwatch(\n  () => props.initialOptions,\n  (next) => {\n    if (query.value.length < props.minSearchLength) {\n      results.value = next ? [...next] : []\n    }\n  },\n)\n\nconst normalisedResults = computed<NormalisedOption[]>(() =>\n  (results.value ?? []).map(normaliseOption),\n)\n\nconst normalisedAll = computed<NormalisedOption[]>(() => {\n  const initial = (props.initialOptions ?? []).map(normaliseOption)\n  const fromResults = normalisedResults.value\n  const merged = new Map<string, NormalisedOption>()\n  for (const o of initial) {\n    merged.set(o.value, o)\n  }\n  for (const o of fromResults) {\n    merged.set(o.value, o)\n  }\n  return Array.from(merged.values())\n})\n\nconst currentValue = computed<string | undefined>(() => {\n  if (model.value === undefined || model.value === null) {\n    return undefined\n  }\n  return String(model.value)\n})\n\nconst selectedLabel = computed<string>(() => {\n  if (currentValue.value === undefined) {\n    return \"\"\n  }\n  const match = normalisedAll.value.find((o) => o.value === currentValue.value)\n  return match ? match.label : currentValue.value\n})\n\nfunction onInput(event: Event): void {\n  const next = (event.target as HTMLInputElement).value\n  trigger(next)\n}\n\nfunction onUpdate(next: unknown): void {\n  if (Array.isArray(next)) {\n    model.value = next[0] === undefined ? null : (next[0] as string | number)\n    return\n  }\n  model.value = next === undefined ? null : (next as string | number)\n}\n\nfunction onOpenChange(open: boolean): void {\n  if (open && query.value === \"\") {\n    // Surface initial options on first open.\n    results.value = props.initialOptions ? [...props.initialOptions] : []\n  }\n}\n\ndefineExpose({ trigger })\n</script>\n\n<template>\n  <FieldFrame\n    :label=\"label\"\n    :required=\"required\"\n    :hide-label=\"hideLabel\"\n    :for=\"id\"\n    :help-text=\"helpText\"\n    :errors=\"errors\"\n  >\n    <Combobox\n      :model-value=\"currentValue\"\n      :disabled=\"disabled || readonly\"\n      ignore-filter\n      @update:model-value=\"onUpdate\"\n      @update:open=\"onOpenChange\"\n    >\n      <ComboboxAnchor\n        :data-element-name=\"name ?? undefined\"\n        data-testid=\"async-select-anchor\"\n        :class=\"errors.length ? 'border-destructive ring-destructive' : ''\"\n      >\n        <Search class=\"mr-2 h-4 w-4 shrink-0 opacity-50\" />\n        <ComboboxInput\n          :id=\"id\"\n          :model-value=\"query\"\n          :placeholder=\"selectedLabel || (placeholder ?? 'Search…')\"\n          data-testid=\"async-select-input\"\n          @input=\"onInput\"\n        />\n        <Loader2\n          v-if=\"isLoading\"\n          data-testid=\"async-select-loader\"\n          class=\"ml-2 h-4 w-4 shrink-0 animate-spin text-muted-foreground\"\n        />\n      </ComboboxAnchor>\n      <ComboboxContent>\n        <div\n          v-if=\"isLoading\"\n          class=\"px-2 py-2 text-sm text-muted-foreground\"\n          data-testid=\"async-select-loading-text\"\n        >\n          {{ loadingText }}\n        </div>\n        <ComboboxEmpty v-else-if=\"normalisedResults.length === 0\">\n          {{ emptyText }}\n        </ComboboxEmpty>\n        <ComboboxItem\n          v-for=\"opt in normalisedResults\"\n          :key=\"opt.value\"\n          :value=\"opt.value\"\n          :disabled=\"opt.disabled\"\n        >\n          <ComboboxItemIndicator />\n          {{ opt.label }}\n        </ComboboxItem>\n      </ComboboxContent>\n    </Combobox>\n  </FieldFrame>\n</template>\n"],"names":["props","__props","model","_useModel","normaliseOption","opt","query","results","isLoading","trigger","useAsyncSearch","watch","next","normalisedResults","computed","normalisedAll","initial","fromResults","merged","o","currentValue","selectedLabel","match","onInput","event","onUpdate","onOpenChange","open","__expose","_createBlock","_unref","FieldFrame","_createVNode","Combobox","ComboboxAnchor","_normalizeClass","Search","ComboboxInput","Loader2","ComboboxContent","_createElementBlock","_hoisted_1","_toDisplayString","ComboboxEmpty","_Fragment","_renderList","ComboboxItem","ComboboxItemIndicator"],"mappings":"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"}

package/dist/components/compositions/elements/option-select/AutoCompleteOption.vue.js

@@ -0,0 +1,5 @@
+import f from "./AutoCompleteOption.vue2.js";
+export {
+  f as default
+};
+//# sourceMappingURL=AutoCompleteOption.vue.js.map

package/dist/components/compositions/elements/option-select/AutoCompleteOption.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AutoCompleteOption.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/compositions/elements/option-select/AutoCompleteOption.vue2.js

@@ -0,0 +1,124 @@
+import { defineComponent as g, useModel as V, computed as m, ref as B, openBlock as s, createBlock as c, unref as a, withCtx as i, createVNode as r, normalizeClass as $, createTextVNode as v, createElementBlock as L, Fragment as S, renderList as q, toDisplayString as C, mergeModels as k } from "vue";
+import { Search as w } from "lucide-vue-next";
+import x from "../../../ui/combobox/Combobox.vue.js";
+import A from "../../../ui/combobox/ComboboxAnchor.vue.js";
+import M from "../../../ui/combobox/ComboboxContent.vue.js";
+import N from "../../../ui/combobox/ComboboxEmpty.vue.js";
+import "@vueuse/core";
+import "reka-ui";
+import "clsx";
+import "tailwind-merge";
+import T from "../../../ui/combobox/ComboboxInput.vue.js";
+import U from "../../../ui/combobox/ComboboxItem.vue.js";
+import O from "../../../ui/combobox/ComboboxItemIndicator.vue.js";
+import z from "../../../ui/field-frame/FieldFrame.vue.js";
+const Y = /* @__PURE__ */ g({
+  __name: "AutoCompleteOption",
+  props: /* @__PURE__ */ k({
+    modelValue: {},
+    options: { default: () => [] },
+    id: {},
+    name: {},
+    label: {},
+    hideLabel: { type: Boolean },
+    placeholder: {},
+    required: { type: Boolean },
+    readonly: { type: Boolean },
+    disabled: { type: Boolean },
+    helpText: {},
+    errors: { default: () => [] },
+    minSearchLength: { default: 0 }
+  }, {
+    modelValue: {},
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(l) {
+    const f = l, d = V(l, "modelValue");
+    function b(e) {
+      return typeof e == "string" ? { label: e, value: e, disabled: !1 } : {
+        label: e.label,
+        value: String(e.value),
+        disabled: !!e.disabled
+      };
+    }
+    const n = m(
+      () => (f.options ?? []).map(b)
+    ), u = B(""), h = m(() => {
+      const e = u.value.trim().toLowerCase();
+      return e.length < f.minSearchLength || e === "" ? n.value : n.value.filter((t) => t.label.toLowerCase().includes(e));
+    }), p = m(() => {
+      if (!(d.value === void 0 || d.value === null))
+        return String(d.value);
+    });
+    function y(e) {
+      if (Array.isArray(e)) {
+        d.value = e[0] === void 0 ? null : e[0];
+        return;
+      }
+      d.value = e === void 0 ? null : e;
+    }
+    return (e, t) => (s(), c(a(z), {
+      label: l.label,
+      required: l.required,
+      "hide-label": l.hideLabel,
+      for: l.id,
+      "help-text": l.helpText,
+      errors: l.errors
+    }, {
+      default: i(() => [
+        r(a(x), {
+          "model-value": p.value,
+          disabled: l.disabled || l.readonly,
+          "onUpdate:modelValue": y
+        }, {
+          default: i(() => [
+            r(a(A), {
+              "data-element-name": l.name ?? void 0,
+              class: $(l.errors.length ? "border-destructive ring-destructive" : "")
+            }, {
+              default: i(() => [
+                r(a(w), { class: "mr-2 h-4 w-4 shrink-0 opacity-50" }),
+                r(a(T), {
+                  id: l.id,
+                  modelValue: u.value,
+                  "onUpdate:modelValue": t[0] || (t[0] = (o) => u.value = o),
+                  placeholder: l.placeholder ?? "Search…"
+                }, null, 8, ["id", "modelValue", "placeholder"])
+              ]),
+              _: 1
+            }, 8, ["data-element-name", "class"]),
+            r(a(M), null, {
+              default: i(() => [
+                r(a(N), null, {
+                  default: i(() => [...t[1] || (t[1] = [
+                    v("No matches.", -1)
+                  ])]),
+                  _: 1
+                }),
+                (s(!0), L(S, null, q(h.value, (o) => (s(), c(a(U), {
+                  key: o.value,
+                  value: o.value,
+                  disabled: o.disabled
+                }, {
+                  default: i(() => [
+                    r(a(O)),
+                    v(" " + C(o.label), 1)
+                  ]),
+                  _: 2
+                }, 1032, ["value", "disabled"]))), 128))
+              ]),
+              _: 1
+            })
+          ]),
+          _: 1
+        }, 8, ["model-value", "disabled"])
+      ]),
+      _: 1
+    }, 8, ["label", "required", "hide-label", "for", "help-text", "errors"]));
+  }
+});
+export {
+  Y as default
+};
+//# sourceMappingURL=AutoCompleteOption.vue2.js.map

package/dist/components/compositions/elements/option-select/AutoCompleteOption.vue2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AutoCompleteOption.vue2.js","sources":["../../../../../src/components/compositions/elements/option-select/AutoCompleteOption.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven autocomplete composition. Wraps the shadcn Combobox\n * primitive with client-side search filtering.\n *\n *   <AutoCompleteOption v-model=\"city\" :options=\"[...]\" label=\"City\" />\n */\nimport { computed, ref } from \"vue\"\nimport { Search } from \"lucide-vue-next\"\nimport type { SelectOptionLike } from \"@/definitions/shared/select-options\"\nimport {\n  Combobox,\n  ComboboxAnchor,\n  ComboboxContent,\n  ComboboxEmpty,\n  ComboboxInput,\n  ComboboxItem,\n  ComboboxItemIndicator,\n} from \"@/components/ui/combobox\"\nimport { FieldFrame } from \"@/components/ui/field-frame\"\n\nexport interface AutoCompleteOptionProps {\n  modelValue?: string | number | null\n  options?: SelectOptionLike[]\n  id?: string\n  name?: string\n  label?: string\n  hideLabel?: boolean\n  placeholder?: string\n  required?: boolean\n  readonly?: boolean\n  disabled?: boolean\n  helpText?: string\n  errors?: string[]\n  minSearchLength?: number\n}\n\nconst props = withDefaults(defineProps<AutoCompleteOptionProps>(), {\n  errors: () => [],\n  options: () => [],\n  minSearchLength: 0,\n})\n\nconst model = defineModel<string | number | null>(\"modelValue\")\n\ninterface NormalisedOption {\n  label: string\n  value: string\n  disabled: boolean\n}\n\nfunction normaliseOption(opt: SelectOptionLike): NormalisedOption {\n  if (typeof opt === \"string\") {\n    return { label: opt, value: opt, disabled: false }\n  }\n  return {\n    label: opt.label,\n    value: String(opt.value),\n    disabled: Boolean(opt.disabled),\n  }\n}\n\nconst normalised = computed<NormalisedOption[]>(() =>\n  (props.options ?? []).map(normaliseOption),\n)\n\nconst query = ref(\"\")\n\nconst filtered = computed<NormalisedOption[]>(() => {\n  const q = query.value.trim().toLowerCase()\n  if (q.length < props.minSearchLength) {\n    return normalised.value\n  }\n  if (q === \"\") {\n    return normalised.value\n  }\n  return normalised.value.filter((o) => o.label.toLowerCase().includes(q))\n})\n\nconst currentValue = computed<string | undefined>(() => {\n  if (model.value === undefined || model.value === null) {\n    return undefined\n  }\n  return String(model.value)\n})\n\nfunction onUpdate(next: unknown): void {\n  if (Array.isArray(next)) {\n    model.value = next[0] === undefined ? null : (next[0] as string | number)\n    return\n  }\n  model.value = next === undefined ? null : (next as string | number)\n}\n</script>\n\n<template>\n  <FieldFrame\n    :label=\"label\"\n    :required=\"required\"\n    :hide-label=\"hideLabel\"\n    :for=\"id\"\n    :help-text=\"helpText\"\n    :errors=\"errors\"\n  >\n    <Combobox\n      :model-value=\"currentValue\"\n      :disabled=\"disabled || readonly\"\n      @update:model-value=\"onUpdate\"\n    >\n      <ComboboxAnchor\n        :data-element-name=\"name ?? undefined\"\n        :class=\"errors.length ? 'border-destructive ring-destructive' : ''\"\n      >\n        <Search class=\"mr-2 h-4 w-4 shrink-0 opacity-50\" />\n        <ComboboxInput\n          :id=\"id\"\n          v-model=\"query\"\n          :placeholder=\"placeholder ?? 'Search…'\"\n        />\n      </ComboboxAnchor>\n      <ComboboxContent>\n        <ComboboxEmpty>No matches.</ComboboxEmpty>\n        <ComboboxItem\n          v-for=\"opt in filtered\"\n          :key=\"opt.value\"\n          :value=\"opt.value\"\n          :disabled=\"opt.disabled\"\n        >\n          <ComboboxItemIndicator />\n          {{ opt.label }}\n        </ComboboxItem>\n      </ComboboxContent>\n    </Combobox>\n  </FieldFrame>\n</template>\n"],"names":["props","__props","model","_useModel","normaliseOption","opt","normalised","computed","query","ref","filtered","q","o","currentValue","onUpdate","next","_createBlock","_unref","FieldFrame","_createVNode","Combobox","ComboboxAnchor","_normalizeClass","Search","ComboboxInput","$event","ComboboxContent","ComboboxEmpty","_cache","_createElementBlock","_Fragment","_renderList","ComboboxItem","ComboboxItemIndicator","_toDisplayString"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqCA,UAAMA,IAAQC,GAMRC,IAAQC,KAAoC,YAAY;AAQ9D,aAASC,EAAgBC,GAAyC;AAChE,aAAI,OAAOA,KAAQ,WACV,EAAE,OAAOA,GAAK,OAAOA,GAAK,UAAU,GAAA,IAEtC;AAAA,QACL,OAAOA,EAAI;AAAA,QACX,OAAO,OAAOA,EAAI,KAAK;AAAA,QACvB,UAAU,EAAQA,EAAI;AAAA,MAAQ;AAAA,IAElC;AAEA,UAAMC,IAAaC;AAAA,MAA6B,OAC7CP,EAAM,WAAW,CAAA,GAAI,IAAII,CAAe;AAAA,IAAA,GAGrCI,IAAQC,EAAI,EAAE,GAEdC,IAAWH,EAA6B,MAAM;AAClD,YAAMI,IAAIH,EAAM,MAAM,KAAA,EAAO,YAAA;AAI7B,aAHIG,EAAE,SAASX,EAAM,mBAGjBW,MAAM,KACDL,EAAW,QAEbA,EAAW,MAAM,OAAO,CAACM,MAAMA,EAAE,MAAM,YAAA,EAAc,SAASD,CAAC,CAAC;AAAA,IACzE,CAAC,GAEKE,IAAeN,EAA6B,MAAM;AACtD,UAAI,EAAAL,EAAM,UAAU,UAAaA,EAAM,UAAU;AAGjD,eAAO,OAAOA,EAAM,KAAK;AAAA,IAC3B,CAAC;AAED,aAASY,EAASC,GAAqB;AACrC,UAAI,MAAM,QAAQA,CAAI,GAAG;AACvB,QAAAb,EAAM,QAAQa,EAAK,CAAC,MAAM,SAAY,OAAQA,EAAK,CAAC;AACpD;AAAA,MACF;AACA,MAAAb,EAAM,QAAQa,MAAS,SAAY,OAAQA;AAAA,IAC7C;2BAIEC,EAqCaC,EAAAC,CAAA,GAAA;AAAA,MApCV,OAAOjB,EAAA;AAAA,MACP,UAAUA,EAAA;AAAA,MACV,cAAYA,EAAA;AAAA,MACZ,KAAKA,EAAA;AAAA,MACL,aAAWA,EAAA;AAAA,MACX,QAAQA,EAAA;AAAA,IAAA;iBAET,MA4BW;AAAA,QA5BXkB,EA4BWF,EAAAG,CAAA,GAAA;AAAA,UA3BR,eAAaP,EAAA;AAAA,UACb,UAAUZ,EAAA,YAAYA,EAAA;AAAA,UACtB,uBAAoBa;AAAA,QAAA;qBAErB,MAUiB;AAAA,YAVjBK,EAUiBF,EAAAI,CAAA,GAAA;AAAA,cATd,qBAAmBpB,EAAA,QAAQ;AAAA,cAC3B,OAAKqB,EAAErB,EAAA,OAAO,SAAM,wCAAA,EAAA;AAAA,YAAA;yBAErB,MAAmD;AAAA,gBAAnDkB,EAAmDF,EAAAM,CAAA,GAAA,EAA3C,OAAM,oCAAkC;AAAA,gBAChDJ,EAIEF,EAAAO,CAAA,GAAA;AAAA,kBAHC,IAAIvB,EAAA;AAAA,8BACIO,EAAA;AAAA,gEAAAA,EAAK,QAAAiB;AAAA,kBACb,aAAaxB,EAAA,eAAW;AAAA,gBAAA;;;;YAG7BkB,EAWkBF,EAAAS,CAAA,GAAA,MAAA;AAAA,yBAVhB,MAA0C;AAAA,gBAA1CP,EAA0CF,EAAAU,CAAA,GAAA,MAAA;AAAA,6BAA3B,MAAW,CAAA,GAAAC,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA;AAAA,sBAAX,eAAW,EAAA;AAAA,kBAAA;;;wBAC1BC,EAQeC,GAAA,MAAAC,EAPCrB,EAAA,OAAQ,CAAfL,YADTW,EAQeC,EAAAe,CAAA,GAAA;AAAA,kBANZ,KAAK3B,EAAI;AAAA,kBACT,OAAOA,EAAI;AAAA,kBACX,UAAUA,EAAI;AAAA,gBAAA;6BAEf,MAAyB;AAAA,oBAAzBc,EAAyBF,EAAAgB,CAAA,CAAA;AAAA,sBAAA,MACzBC,EAAG7B,EAAI,KAAK,GAAA,CAAA;AAAA,kBAAA;;;;;;;;;;;;;;"}

package/dist/components/compositions/elements/option-select/CheckboxOption.vue.js

@@ -0,0 +1,5 @@
+import f from "./CheckboxOption.vue2.js";
+export {
+  f as default
+};
+//# sourceMappingURL=CheckboxOption.vue.js.map

package/dist/components/compositions/elements/option-select/CheckboxOption.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckboxOption.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/compositions/elements/option-select/CheckboxOption.vue2.js

@@ -0,0 +1,90 @@
+import { defineComponent as g, useModel as y, computed as u, openBlock as i, createBlock as B, unref as d, withCtx as m, createElementVNode as V, normalizeClass as k, createElementBlock as s, Fragment as $, renderList as C, createVNode as c, createTextVNode as q, toDisplayString as S, mergeModels as T } from "vue";
+import w from "../../../ui/checkbox/Checkbox.vue.js";
+import "../../../ui/label/index.js";
+import L from "../../../ui/field-frame/FieldFrame.vue.js";
+import M from "../../../ui/label/Label.vue.js";
+const N = ["data-element-name"], z = /* @__PURE__ */ g({
+  __name: "CheckboxOption",
+  props: /* @__PURE__ */ T({
+    modelValue: {},
+    options: { default: () => [] },
+    id: {},
+    name: {},
+    label: {},
+    hideLabel: { type: Boolean },
+    inline: { type: Boolean },
+    required: { type: Boolean },
+    readonly: { type: Boolean },
+    disabled: { type: Boolean },
+    helpText: {},
+    errors: { default: () => [] }
+  }, {
+    modelValue: {},
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(l) {
+    const f = l, r = y(l, "modelValue");
+    function b(e) {
+      return typeof e == "string" ? { label: e, value: e, disabled: !1 } : {
+        label: e.label,
+        value: String(e.value),
+        disabled: !!e.disabled
+      };
+    }
+    const v = u(
+      () => (f.options ?? []).map(b)
+    ), o = u(() => {
+      const e = r.value;
+      return e ? Array.isArray(e) ? e.map((n) => String(n)) : [String(e)] : [];
+    });
+    function h(e) {
+      return o.value.includes(e);
+    }
+    function x(e, n) {
+      const a = o.value;
+      n === !0 ? a.includes(e) || (r.value = [...a, e]) : r.value = a.filter((t) => t !== e);
+    }
+    return (e, n) => (i(), B(d(L), {
+      label: l.label,
+      required: l.required,
+      "hide-label": l.hideLabel,
+      "help-text": l.helpText,
+      errors: l.errors
+    }, {
+      default: m(() => [
+        V("div", {
+          class: k(l.inline ? "flex flex-row flex-wrap gap-4" : "grid gap-2"),
+          "data-element-name": l.name ?? void 0
+        }, [
+          (i(!0), s($, null, C(v.value, (a) => (i(), s("div", {
+            key: a.value,
+            class: "flex items-center gap-2"
+          }, [
+            c(d(w), {
+              id: `${l.id ?? "checkbox"}-${a.value}`,
+              name: l.name,
+              "model-value": h(a.value),
+              disabled: a.disabled || l.disabled || l.readonly,
+              "onUpdate:modelValue": (t) => x(a.value, t)
+            }, null, 8, ["id", "name", "model-value", "disabled", "onUpdate:modelValue"]),
+            c(d(M), {
+              for: `${l.id ?? "checkbox"}-${a.value}`,
+              class: "cursor-pointer"
+            }, {
+              default: m(() => [
+                q(S(a.label), 1)
+              ]),
+              _: 2
+            }, 1032, ["for"])
+          ]))), 128))
+        ], 10, N)
+      ]),
+      _: 1
+    }, 8, ["label", "required", "hide-label", "help-text", "errors"]));
+  }
+});
+export {
+  z as default
+};
+//# sourceMappingURL=CheckboxOption.vue2.js.map