@gxp-dev/mod-ui 2.0.0 → 2.0.3

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

@@ -1 +1 @@
-{"version":3,"file":"SelectOption.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"SelectOption.vue.js","sources":["../../../../../src/components/compositions/elements/option-select/SelectOption.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven single-select composition. Composes the shadcn `Select`\n * primitive with `FieldFrame` chrome.\n *\n * Self-contained — usable directly in any Vue app:\n *\n *   <SelectOption v-model=\"role\" :options=\"[...]\" label=\"Role\" />\n *\n * The JSON-driven engine renders this via `ElementRenderer`, which binds\n * `modelValue` / `errors` to the form-data store automatically.\n */\nimport { computed } from \"vue\"\nimport type { SelectOptionLike } from \"@/definitions/shared/select-options\"\nimport {\n  Select,\n  SelectContent,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n} from \"@/components/ui/select\"\nimport { FieldFrame } from \"@/components/ui/field-frame\"\n\nexport interface SelectOptionProps {\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}\n\nconst props = withDefaults(defineProps<SelectOptionProps>(), {\n  errors: () => [],\n  options: () => [],\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 triggerValue = 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 (next === undefined || next === null) {\n    model.value = null\n    return\n  }\n  if (typeof next === \"string\" || typeof next === \"number\") {\n    model.value = next\n    return\n  }\n  if (Array.isArray(next)) {\n    const first = next[0]\n    model.value =\n      typeof first === \"string\" || typeof first === \"number\" ? first : null\n    return\n  }\n  model.value = String(next)\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    <Select\n      :model-value=\"triggerValue\"\n      :disabled=\"disabled || readonly\"\n      :name=\"name\"\n      :required=\"required\"\n      @update:model-value=\"onUpdate\"\n    >\n      <SelectTrigger\n        :id=\"id\"\n        :data-element-name=\"name ?? undefined\"\n        :class=\"errors.length ? 'border-destructive ring-destructive' : ''\"\n      >\n        <SelectValue :placeholder=\"placeholder ?? 'Select…'\" />\n      </SelectTrigger>\n      <SelectContent>\n        <SelectItem\n          v-for=\"opt in normalised\"\n          :key=\"opt.value\"\n          :value=\"opt.value\"\n          :disabled=\"opt.disabled\"\n        >\n          {{ opt.label }}\n        </SelectItem>\n      </SelectContent>\n    </Select>\n  </FieldFrame>\n</template>\n"],"names":["props","__props","model","_useModel","normaliseOption","opt","normalised","computed","triggerValue","onUpdate","next","first","_createBlock","_unref","FieldFrame","_createVNode","Select","SelectTrigger","_normalizeClass","SelectValue","SelectContent","_createElementBlock","_Fragment","_renderList","SelectItem","_createTextVNode","_toDisplayString"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsCA,UAAMA,IAAQC,GAKRC,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,IAAeD,EAA6B,MAAM;AACtD,UAAI,EAAAL,EAAM,UAAU,UAAaA,EAAM,UAAU;AAGjD,eAAO,OAAOA,EAAM,KAAK;AAAA,IAC3B,CAAC;AAED,aAASO,EAASC,GAAqB;AACrC,UAA0BA,KAAS,MAAM;AACvC,QAAAR,EAAM,QAAQ;AACd;AAAA,MACF;AACA,UAAI,OAAOQ,KAAS,YAAY,OAAOA,KAAS,UAAU;AACxD,QAAAR,EAAM,QAAQQ;AACd;AAAA,MACF;AACA,UAAI,MAAM,QAAQA,CAAI,GAAG;AACvB,cAAMC,IAAQD,EAAK,CAAC;AACpB,QAAAR,EAAM,QACJ,OAAOS,KAAU,YAAY,OAAOA,KAAU,WAAWA,IAAQ;AACnE;AAAA,MACF;AACA,MAAAT,EAAM,QAAQ,OAAOQ,CAAI;AAAA,IAC3B;2BAIEE,EAiCaC,EAAAC,CAAA,GAAA;AAAA,MAhCV,OAAOb,EAAA;AAAA,MACP,UAAUA,EAAA;AAAA,MACV,cAAYA,EAAA;AAAA,MACZ,KAAKA,EAAA;AAAA,MACL,aAAWA,EAAA;AAAA,MACX,QAAQA,EAAA;AAAA,IAAA;iBAET,MAwBS;AAAA,QAxBTc,EAwBSF,EAAAG,CAAA,GAAA;AAAA,UAvBN,eAAaR,EAAA;AAAA,UACb,UAAUP,EAAA,YAAYA,EAAA;AAAA,UACtB,MAAMA,EAAA;AAAA,UACN,UAAUA,EAAA;AAAA,UACV,uBAAoBQ;AAAA,QAAA;qBAErB,MAMgB;AAAA,YANhBM,EAMgBF,EAAAI,CAAA,GAAA;AAAA,cALb,IAAIhB,EAAA;AAAA,cACJ,qBAAmBA,EAAA,QAAQ;AAAA,cAC3B,OAAKiB,EAAEjB,EAAA,OAAO,SAAM,wCAAA,EAAA;AAAA,YAAA;yBAErB,MAAuD;AAAA,gBAAvDc,EAAuDF,EAAAM,CAAA,GAAA;AAAA,kBAAzC,aAAalB,EAAA,eAAW;AAAA,gBAAA;;;;YAExCc,EASgBF,EAAAO,CAAA,GAAA,MAAA;AAAA,yBAPZ,MAAyB;AAAA,wBAD3BC,EAOaC,GAAA,MAAAC,EANGjB,EAAA,OAAU,CAAjBD,YADTO,EAOaC,EAAAW,CAAA,GAAA;AAAA,kBALV,KAAKnB,EAAI;AAAA,kBACT,OAAOA,EAAI;AAAA,kBACX,UAAUA,EAAI;AAAA,gBAAA;6BAEf,MAAe;AAAA,oBAAZoB,EAAAC,EAAArB,EAAI,KAAK,GAAA,CAAA;AAAA,kBAAA;;;;;;;;;;;;;;"}

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

@@ -1,119 +1,5 @@
-import { defineComponent as h, useModel as y, computed as u, openBlock as n, createBlock as m, unref as r, withCtx as i, createVNode as o, normalizeClass as g, createElementBlock as p, Fragment as B, renderList as V, createTextVNode as q, toDisplayString as S, mergeModels as $ } from "vue";
-import k from "../../../ui/select/Select.vue.js";
-import C from "../../../ui/select/SelectContent.vue.js";
-import "@vueuse/core";
-import "reka-ui";
-import "clsx";
-import "tailwind-merge";
-import L from "../../../ui/select/SelectItem.vue.js";
-import "lucide-vue-next";
-import M from "../../../ui/select/SelectTrigger.vue.js";
-import T from "../../../ui/select/SelectValue.vue.js";
-import A from "../../../ui/field-frame/FieldFrame.vue.js";
-const I = /* @__PURE__ */ h({
-  __name: "SelectOption",
-  props: /* @__PURE__ */ $({
-    modelValue: {},
-    options: { default: () => [] },
-    id: {},
-    name: {},
-    label: {},
-    hideLabel: { type: Boolean },
-    placeholder: {},
-    required: { type: Boolean },
-    readonly: { type: Boolean },
-    disabled: { type: Boolean },
-    helpText: {},
-    errors: { default: () => [] }
-  }, {
-    modelValue: {},
-    modelModifiers: {}
-  }),
-  emits: ["update:modelValue"],
-  setup(e) {
-    const f = e, a = y(e, "modelValue");
-    function s(l) {
-      return typeof l == "string" ? { label: l, value: l, disabled: !1 } : {
-        label: l.label,
-        value: String(l.value),
-        disabled: !!l.disabled
-      };
-    }
-    const c = u(
-      () => (f.options ?? []).map(s)
-    ), b = u(() => {
-      if (!(a.value === void 0 || a.value === null))
-        return String(a.value);
-    });
-    function v(l) {
-      if (l == null) {
-        a.value = null;
-        return;
-      }
-      if (typeof l == "string" || typeof l == "number") {
-        a.value = l;
-        return;
-      }
-      if (Array.isArray(l)) {
-        const t = l[0];
-        a.value = typeof t == "string" || typeof t == "number" ? t : null;
-        return;
-      }
-      a.value = String(l);
-    }
-    return (l, t) => (n(), m(r(A), {
-      label: e.label,
-      required: e.required,
-      "hide-label": e.hideLabel,
-      for: e.id,
-      "help-text": e.helpText,
-      errors: e.errors
-    }, {
-      default: i(() => [
-        o(r(k), {
-          "model-value": b.value,
-          disabled: e.disabled || e.readonly,
-          name: e.name,
-          required: e.required,
-          "onUpdate:modelValue": v
-        }, {
-          default: i(() => [
-            o(r(M), {
-              id: e.id,
-              "data-element-name": e.name ?? void 0,
-              class: g(e.errors.length ? "border-destructive ring-destructive" : "")
-            }, {
-              default: i(() => [
-                o(r(T), {
-                  placeholder: e.placeholder ?? "Select…"
-                }, null, 8, ["placeholder"])
-              ]),
-              _: 1
-            }, 8, ["id", "data-element-name", "class"]),
-            o(r(C), null, {
-              default: i(() => [
-                (n(!0), p(B, null, V(c.value, (d) => (n(), m(r(L), {
-                  key: d.value,
-                  value: d.value,
-                  disabled: d.disabled
-                }, {
-                  default: i(() => [
-                    q(S(d.label), 1)
-                  ]),
-                  _: 2
-                }, 1032, ["value", "disabled"]))), 128))
-              ]),
-              _: 1
-            })
-          ]),
-          _: 1
-        }, 8, ["model-value", "disabled", "name", "required"])
-      ]),
-      _: 1
-    }, 8, ["label", "required", "hide-label", "for", "help-text", "errors"]));
-  }
-});
+import f from "./SelectOption.vue.js";
 export {
-  I as default
+  f as default
 };
 //# sourceMappingURL=SelectOption.vue2.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"SelectOption.vue2.js","sources":["../../../../../src/components/compositions/elements/option-select/SelectOption.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven single-select composition. Composes the shadcn `Select`\n * primitive with `FieldFrame` chrome.\n *\n * Self-contained — usable directly in any Vue app:\n *\n *   <SelectOption v-model=\"role\" :options=\"[...]\" label=\"Role\" />\n *\n * The JSON-driven engine renders this via `ElementRenderer`, which binds\n * `modelValue` / `errors` to the form-data store automatically.\n */\nimport { computed } from \"vue\"\nimport type { SelectOptionLike } from \"@/definitions/shared/select-options\"\nimport {\n  Select,\n  SelectContent,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n} from \"@/components/ui/select\"\nimport { FieldFrame } from \"@/components/ui/field-frame\"\n\nexport interface SelectOptionProps {\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}\n\nconst props = withDefaults(defineProps<SelectOptionProps>(), {\n  errors: () => [],\n  options: () => [],\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 triggerValue = 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 (next === undefined || next === null) {\n    model.value = null\n    return\n  }\n  if (typeof next === \"string\" || typeof next === \"number\") {\n    model.value = next\n    return\n  }\n  if (Array.isArray(next)) {\n    const first = next[0]\n    model.value =\n      typeof first === \"string\" || typeof first === \"number\" ? first : null\n    return\n  }\n  model.value = String(next)\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    <Select\n      :model-value=\"triggerValue\"\n      :disabled=\"disabled || readonly\"\n      :name=\"name\"\n      :required=\"required\"\n      @update:model-value=\"onUpdate\"\n    >\n      <SelectTrigger\n        :id=\"id\"\n        :data-element-name=\"name ?? undefined\"\n        :class=\"errors.length ? 'border-destructive ring-destructive' : ''\"\n      >\n        <SelectValue :placeholder=\"placeholder ?? 'Select…'\" />\n      </SelectTrigger>\n      <SelectContent>\n        <SelectItem\n          v-for=\"opt in normalised\"\n          :key=\"opt.value\"\n          :value=\"opt.value\"\n          :disabled=\"opt.disabled\"\n        >\n          {{ opt.label }}\n        </SelectItem>\n      </SelectContent>\n    </Select>\n  </FieldFrame>\n</template>\n"],"names":["props","__props","model","_useModel","normaliseOption","opt","normalised","computed","triggerValue","onUpdate","next","first","_createBlock","_unref","FieldFrame","_createVNode","Select","SelectTrigger","_normalizeClass","SelectValue","SelectContent","_createElementBlock","_Fragment","_renderList","SelectItem","_createTextVNode","_toDisplayString"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsCA,UAAMA,IAAQC,GAKRC,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,IAAeD,EAA6B,MAAM;AACtD,UAAI,EAAAL,EAAM,UAAU,UAAaA,EAAM,UAAU;AAGjD,eAAO,OAAOA,EAAM,KAAK;AAAA,IAC3B,CAAC;AAED,aAASO,EAASC,GAAqB;AACrC,UAA0BA,KAAS,MAAM;AACvC,QAAAR,EAAM,QAAQ;AACd;AAAA,MACF;AACA,UAAI,OAAOQ,KAAS,YAAY,OAAOA,KAAS,UAAU;AACxD,QAAAR,EAAM,QAAQQ;AACd;AAAA,MACF;AACA,UAAI,MAAM,QAAQA,CAAI,GAAG;AACvB,cAAMC,IAAQD,EAAK,CAAC;AACpB,QAAAR,EAAM,QACJ,OAAOS,KAAU,YAAY,OAAOA,KAAU,WAAWA,IAAQ;AACnE;AAAA,MACF;AACA,MAAAT,EAAM,QAAQ,OAAOQ,CAAI;AAAA,IAC3B;2BAIEE,EAiCaC,EAAAC,CAAA,GAAA;AAAA,MAhCV,OAAOb,EAAA;AAAA,MACP,UAAUA,EAAA;AAAA,MACV,cAAYA,EAAA;AAAA,MACZ,KAAKA,EAAA;AAAA,MACL,aAAWA,EAAA;AAAA,MACX,QAAQA,EAAA;AAAA,IAAA;iBAET,MAwBS;AAAA,QAxBTc,EAwBSF,EAAAG,CAAA,GAAA;AAAA,UAvBN,eAAaR,EAAA;AAAA,UACb,UAAUP,EAAA,YAAYA,EAAA;AAAA,UACtB,MAAMA,EAAA;AAAA,UACN,UAAUA,EAAA;AAAA,UACV,uBAAoBQ;AAAA,QAAA;qBAErB,MAMgB;AAAA,YANhBM,EAMgBF,EAAAI,CAAA,GAAA;AAAA,cALb,IAAIhB,EAAA;AAAA,cACJ,qBAAmBA,EAAA,QAAQ;AAAA,cAC3B,OAAKiB,EAAEjB,EAAA,OAAO,SAAM,wCAAA,EAAA;AAAA,YAAA;yBAErB,MAAuD;AAAA,gBAAvDc,EAAuDF,EAAAM,CAAA,GAAA;AAAA,kBAAzC,aAAalB,EAAA,eAAW;AAAA,gBAAA;;;;YAExCc,EASgBF,EAAAO,CAAA,GAAA,MAAA;AAAA,yBAPZ,MAAyB;AAAA,wBAD3BC,EAOaC,GAAA,MAAAC,EANGjB,EAAA,OAAU,CAAjBD,YADTO,EAOaC,EAAAW,CAAA,GAAA;AAAA,kBALV,KAAKnB,EAAI;AAAA,kBACT,OAAOA,EAAI;AAAA,kBACX,UAAUA,EAAI;AAAA,gBAAA;6BAEf,MAAe;AAAA,oBAAZoB,EAAAC,EAAArB,EAAI,KAAK,GAAA,CAAA;AAAA,kBAAA;;;;;;;;;;;;;;"}
+{"version":3,"file":"SelectOption.vue2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/compositions/elements/picker/AsyncSelectPicker.vue.d.ts

@@ -0,0 +1,40 @@
+import { SelectOptionLike } from '../../../../definitions/shared/select-options';
+export interface AsyncSelectPickerProps {
+    modelValue?: string | number | null;
+    id?: string;
+    name?: string;
+    label?: string;
+    hideLabel?: boolean;
+    placeholder?: string;
+    required?: boolean;
+    readonly?: boolean;
+    disabled?: boolean;
+    helpText?: string;
+    errors?: string[];
+    onSearch?: (query: string) => Promise<SelectOptionLike[]>;
+    initialOptions?: SelectOptionLike[];
+    minSearchLength?: number;
+    debounceMs?: number;
+    loadingText?: string;
+    emptyText?: string;
+}
+type __VLS_Props = AsyncSelectPickerProps;
+type __VLS_PublicProps = {
+    "modelValue"?: string | number | null;
+} & __VLS_Props;
+declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {
+    trigger: (next: string) => void;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:modelValue": (value: string | number | null) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string | number | null) => any) | undefined;
+}>, {
+    minSearchLength: number;
+    emptyText: string;
+    errors: string[];
+    initialOptions: SelectOptionLike[];
+    debounceMs: number;
+    loadingText: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+export default _default;
+//# sourceMappingURL=AsyncSelectPicker.vue.d.ts.map

package/dist/components/compositions/elements/picker/AsyncSelectPicker.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AsyncSelectPicker.vue.d.ts","sourceRoot":"","sources":["../../../../../src/components/compositions/elements/picker/AsyncSelectPicker.vue"],"names":[],"mappings":"AA8OA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,qCAAqC,CAAA;AAa3E,MAAM,WAAW,sBAAsB;IACrC,UAAU,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAAA;IACnC,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,MAAM,CAAC,EAAE,MAAM,EAAE,CAAA;IACjB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC,gBAAgB,EAAE,CAAC,CAAA;IACzD,cAAc,CAAC,EAAE,gBAAgB,EAAE,CAAA;IACnC,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,KAAK,WAAW,GAAG,sBAAsB,CAAC;AA8G1C,KAAK,iBAAiB,GAAG;IACzB,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC;CACrC,GAAG,WAAW,CAAC;;;;;;;;qBAtHI,MAAM;eAGZ,MAAM;YANT,MAAM,EAAE;oBAEA,gBAAgB,EAAE;gBAEtB,MAAM;iBACL,MAAM;;AAgXtB,wBAUG"}

package/dist/components/compositions/elements/picker/AsyncSelectPicker.vue.js

@@ -1,5 +1,185 @@
-import f from "./AsyncSelectPicker.vue2.js";
+import { defineComponent as T, useModel as A, watch as C, computed as f, openBlock as i, createBlock as h, unref as t, withCtx as d, createVNode as r, normalizeClass as q, createElementBlock as v, toDisplayString as c, createElementVNode as N, createCommentVNode as L, createTextVNode as V, Fragment as U, renderList as _, mergeModels as D } from "vue";
+import { ChevronsUpDown as E, Search as R, Loader2 as j } from "lucide-vue-next";
+import z from "../../../ui/combobox/Combobox.vue.js";
+import F from "../../../ui/combobox/ComboboxAnchor.vue.js";
+import I from "../../../ui/combobox/ComboboxContent.vue.js";
+import P 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 Q } from "../../../../composables/useAsyncSearch.js";
+const W = {
+  key: 0,
+  class: "truncate text-sm",
+  "data-testid": "async-picker-label"
+}, X = {
+  key: 1,
+  class: "text-sm text-muted-foreground"
+}, Y = { class: "flex items-center border-b px-2 py-1.5" }, Z = {
+  key: 0,
+  class: "px-2 py-2 text-sm text-muted-foreground",
+  "data-testid": "async-picker-loading-text"
+}, ve = /* @__PURE__ */ T({
+  __name: "AsyncSelectPicker",
+  props: /* @__PURE__ */ D({
+    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: O }) {
+    const l = a, s = A(a, "modelValue");
+    function g(e) {
+      return typeof e == "string" ? { label: e, value: e, disabled: !1 } : {
+        label: e.label,
+        value: String(e.value),
+        disabled: !!e.disabled
+      };
+    }
+    const { query: p, results: b, isLoading: x, trigger: k } = Q({
+      onSearch: l.onSearch,
+      initialOptions: l.initialOptions,
+      minSearchLength: l.minSearchLength,
+      debounceMs: l.debounceMs
+    });
+    C(
+      () => l.initialOptions,
+      (e) => {
+        p.value.length < l.minSearchLength && (b.value = e ? [...e] : []);
+      }
+    );
+    const y = f(
+      () => (b.value ?? []).map(g)
+    ), w = f(() => {
+      const e = (l.initialOptions ?? []).map(g), o = y.value, n = /* @__PURE__ */ new Map();
+      for (const u of e)
+        n.set(u.value, u);
+      for (const u of o)
+        n.set(u.value, u);
+      return Array.from(n.values());
+    }), m = f(() => {
+      if (!(s.value === void 0 || s.value === null))
+        return String(s.value);
+    }), S = f(() => {
+      if (m.value === void 0)
+        return "";
+      const e = w.value.find((o) => o.value === m.value);
+      return e ? e.label : m.value;
+    });
+    function B(e) {
+      const o = e.target.value;
+      k(o);
+    }
+    function $(e) {
+      if (Array.isArray(e)) {
+        s.value = e[0] === void 0 ? null : e[0];
+        return;
+      }
+      s.value = e === void 0 ? null : e;
+    }
+    function M(e) {
+      e && p.value === "" && (b.value = l.initialOptions ? [...l.initialOptions] : []);
+    }
+    return O({ trigger: k }), (e, o) => (i(), h(t(K), {
+      label: a.label,
+      required: a.required,
+      "hide-label": a.hideLabel,
+      for: a.id,
+      "help-text": a.helpText,
+      errors: a.errors
+    }, {
+      default: d(() => [
+        r(t(z), {
+          "model-value": m.value,
+          disabled: a.disabled || a.readonly,
+          "ignore-filter": "",
+          "onUpdate:modelValue": $,
+          "onUpdate:open": M
+        }, {
+          default: d(() => [
+            r(t(F), {
+              "data-element-name": a.name ?? void 0,
+              "data-testid": "async-picker-anchor",
+              class: q([
+                "justify-between text-left",
+                a.errors.length ? "border-destructive ring-destructive" : ""
+              ])
+            }, {
+              default: d(() => [
+                S.value ? (i(), v("span", W, c(S.value), 1)) : (i(), v("span", X, c(a.placeholder ?? "Select…"), 1)),
+                r(t(E), { class: "ml-2 h-4 w-4 shrink-0 opacity-50" })
+              ]),
+              _: 1
+            }, 8, ["data-element-name", "class"]),
+            r(t(I), null, {
+              default: d(() => [
+                N("div", Y, [
+                  r(t(R), { class: "mr-2 h-4 w-4 shrink-0 opacity-50" }),
+                  r(t(G), {
+                    id: a.id,
+                    "model-value": t(p),
+                    placeholder: a.placeholder ?? "Search…",
+                    class: "h-8",
+                    "data-testid": "async-picker-input",
+                    onInput: B
+                  }, null, 8, ["id", "model-value", "placeholder"]),
+                  t(x) ? (i(), h(t(j), {
+                    key: 0,
+                    "data-testid": "async-picker-loader",
+                    class: "ml-2 h-4 w-4 shrink-0 animate-spin text-muted-foreground"
+                  })) : L("", !0)
+                ]),
+                t(x) ? (i(), v("div", Z, c(a.loadingText), 1)) : y.value.length === 0 ? (i(), h(t(P), { key: 1 }, {
+                  default: d(() => [
+                    V(c(a.emptyText), 1)
+                  ]),
+                  _: 1
+                })) : L("", !0),
+                (i(!0), v(U, null, _(y.value, (n) => (i(), h(t(H), {
+                  key: n.value,
+                  value: n.value,
+                  disabled: n.disabled
+                }, {
+                  default: d(() => [
+                    r(t(J)),
+                    V(" " + c(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 {
-  f as default
+  ve as default
 };
 //# sourceMappingURL=AsyncSelectPicker.vue.js.map

package/dist/components/compositions/elements/picker/AsyncSelectPicker.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"AsyncSelectPicker.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"AsyncSelectPicker.vue.js","sources":["../../../../../src/components/compositions/elements/picker/AsyncSelectPicker.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven async select picker composition. Same callback-driven\n * search surface as `AsyncSelectOption` but presented as a button-style\n * picker — the trigger reads as a single selected value with a chevron,\n * and the Combobox panel appears beneath it.\n *\n *   <AsyncSelectPicker\n *     v-model=\"userId\"\n *     label=\"User\"\n *     :on-search=\"(q) => fetch(`/users?q=${q}`).then(r => r.json())\"\n *   />\n */\nimport { computed, watch } from \"vue\"\nimport { ChevronsUpDown, 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 AsyncSelectPickerProps {\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  onSearch?: (query: string) => Promise<SelectOptionLike[]>\n  initialOptions?: SelectOptionLike[]\n  minSearchLength?: number\n  debounceMs?: number\n  loadingText?: string\n  emptyText?: string\n}\n\nconst props = withDefaults(defineProps<AsyncSelectPickerProps>(), {\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\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    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-picker-anchor\"\n        :class=\"[\n          'justify-between text-left',\n          errors.length ? 'border-destructive ring-destructive' : '',\n        ]\"\n      >\n        <span\n          v-if=\"selectedLabel\"\n          class=\"truncate text-sm\"\n          data-testid=\"async-picker-label\"\n        >\n          {{ selectedLabel }}\n        </span>\n        <span v-else class=\"text-sm text-muted-foreground\">\n          {{ placeholder ?? \"Select…\" }}\n        </span>\n        <ChevronsUpDown class=\"ml-2 h-4 w-4 shrink-0 opacity-50\" />\n      </ComboboxAnchor>\n      <ComboboxContent>\n        <div class=\"flex items-center border-b px-2 py-1.5\">\n          <Search class=\"mr-2 h-4 w-4 shrink-0 opacity-50\" />\n          <ComboboxInput\n            :id=\"id\"\n            :model-value=\"query\"\n            :placeholder=\"placeholder ?? 'Search…'\"\n            class=\"h-8\"\n            data-testid=\"async-picker-input\"\n            @input=\"onInput\"\n          />\n          <Loader2\n            v-if=\"isLoading\"\n            data-testid=\"async-picker-loader\"\n            class=\"ml-2 h-4 w-4 shrink-0 animate-spin text-muted-foreground\"\n          />\n        </div>\n        <div\n          v-if=\"isLoading\"\n          class=\"px-2 py-2 text-sm text-muted-foreground\"\n          data-testid=\"async-picker-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","_createElementBlock","_hoisted_1","_toDisplayString","_hoisted_2","ChevronsUpDown","ComboboxContent","_createElementVNode","_hoisted_3","Search","ComboboxInput","Loader2","_hoisted_4","ComboboxEmpty","_Fragment","_renderList","ComboboxItem","ComboboxItemIndicator"],"mappings":"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"}

package/dist/components/compositions/elements/picker/AsyncSelectPicker.vue2.js

@@ -1,185 +1,5 @@
-import { defineComponent as T, useModel as A, watch as C, computed as f, openBlock as i, createBlock as h, unref as t, withCtx as d, createVNode as r, normalizeClass as q, createElementBlock as v, toDisplayString as c, createElementVNode as N, createCommentVNode as L, createTextVNode as V, Fragment as U, renderList as _, mergeModels as D } from "vue";
-import { ChevronsUpDown as E, Search as R, Loader2 as j } from "lucide-vue-next";
-import z from "../../../ui/combobox/Combobox.vue.js";
-import F from "../../../ui/combobox/ComboboxAnchor.vue.js";
-import I from "../../../ui/combobox/ComboboxContent.vue.js";
-import P 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 Q } from "../../../../composables/useAsyncSearch.js";
-const W = {
-  key: 0,
-  class: "truncate text-sm",
-  "data-testid": "async-picker-label"
-}, X = {
-  key: 1,
-  class: "text-sm text-muted-foreground"
-}, Y = { class: "flex items-center border-b px-2 py-1.5" }, Z = {
-  key: 0,
-  class: "px-2 py-2 text-sm text-muted-foreground",
-  "data-testid": "async-picker-loading-text"
-}, ve = /* @__PURE__ */ T({
-  __name: "AsyncSelectPicker",
-  props: /* @__PURE__ */ D({
-    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: O }) {
-    const l = a, s = A(a, "modelValue");
-    function g(e) {
-      return typeof e == "string" ? { label: e, value: e, disabled: !1 } : {
-        label: e.label,
-        value: String(e.value),
-        disabled: !!e.disabled
-      };
-    }
-    const { query: p, results: b, isLoading: x, trigger: k } = Q({
-      onSearch: l.onSearch,
-      initialOptions: l.initialOptions,
-      minSearchLength: l.minSearchLength,
-      debounceMs: l.debounceMs
-    });
-    C(
-      () => l.initialOptions,
-      (e) => {
-        p.value.length < l.minSearchLength && (b.value = e ? [...e] : []);
-      }
-    );
-    const y = f(
-      () => (b.value ?? []).map(g)
-    ), w = f(() => {
-      const e = (l.initialOptions ?? []).map(g), o = y.value, n = /* @__PURE__ */ new Map();
-      for (const u of e)
-        n.set(u.value, u);
-      for (const u of o)
-        n.set(u.value, u);
-      return Array.from(n.values());
-    }), m = f(() => {
-      if (!(s.value === void 0 || s.value === null))
-        return String(s.value);
-    }), S = f(() => {
-      if (m.value === void 0)
-        return "";
-      const e = w.value.find((o) => o.value === m.value);
-      return e ? e.label : m.value;
-    });
-    function B(e) {
-      const o = e.target.value;
-      k(o);
-    }
-    function $(e) {
-      if (Array.isArray(e)) {
-        s.value = e[0] === void 0 ? null : e[0];
-        return;
-      }
-      s.value = e === void 0 ? null : e;
-    }
-    function M(e) {
-      e && p.value === "" && (b.value = l.initialOptions ? [...l.initialOptions] : []);
-    }
-    return O({ trigger: k }), (e, o) => (i(), h(t(K), {
-      label: a.label,
-      required: a.required,
-      "hide-label": a.hideLabel,
-      for: a.id,
-      "help-text": a.helpText,
-      errors: a.errors
-    }, {
-      default: d(() => [
-        r(t(z), {
-          "model-value": m.value,
-          disabled: a.disabled || a.readonly,
-          "ignore-filter": "",
-          "onUpdate:modelValue": $,
-          "onUpdate:open": M
-        }, {
-          default: d(() => [
-            r(t(F), {
-              "data-element-name": a.name ?? void 0,
-              "data-testid": "async-picker-anchor",
-              class: q([
-                "justify-between text-left",
-                a.errors.length ? "border-destructive ring-destructive" : ""
-              ])
-            }, {
-              default: d(() => [
-                S.value ? (i(), v("span", W, c(S.value), 1)) : (i(), v("span", X, c(a.placeholder ?? "Select…"), 1)),
-                r(t(E), { class: "ml-2 h-4 w-4 shrink-0 opacity-50" })
-              ]),
-              _: 1
-            }, 8, ["data-element-name", "class"]),
-            r(t(I), null, {
-              default: d(() => [
-                N("div", Y, [
-                  r(t(R), { class: "mr-2 h-4 w-4 shrink-0 opacity-50" }),
-                  r(t(G), {
-                    id: a.id,
-                    "model-value": t(p),
-                    placeholder: a.placeholder ?? "Search…",
-                    class: "h-8",
-                    "data-testid": "async-picker-input",
-                    onInput: B
-                  }, null, 8, ["id", "model-value", "placeholder"]),
-                  t(x) ? (i(), h(t(j), {
-                    key: 0,
-                    "data-testid": "async-picker-loader",
-                    class: "ml-2 h-4 w-4 shrink-0 animate-spin text-muted-foreground"
-                  })) : L("", !0)
-                ]),
-                t(x) ? (i(), v("div", Z, c(a.loadingText), 1)) : y.value.length === 0 ? (i(), h(t(P), { key: 1 }, {
-                  default: d(() => [
-                    V(c(a.emptyText), 1)
-                  ]),
-                  _: 1
-                })) : L("", !0),
-                (i(!0), v(U, null, _(y.value, (n) => (i(), h(t(H), {
-                  key: n.value,
-                  value: n.value,
-                  disabled: n.disabled
-                }, {
-                  default: d(() => [
-                    r(t(J)),
-                    V(" " + c(n.label), 1)
-                  ]),
-                  _: 2
-                }, 1032, ["value", "disabled"]))), 128))
-              ]),
-              _: 1
-            })
-          ]),
-          _: 1
-        }, 8, ["model-value", "disabled"])
-      ]),
-      _: 1
-    }, 8, ["label", "required", "hide-label", "for", "help-text", "errors"]));
-  }
-});
+import f from "./AsyncSelectPicker.vue.js";
 export {
-  ve as default
+  f as default
 };
 //# sourceMappingURL=AsyncSelectPicker.vue2.js.map

package/dist/components/compositions/elements/picker/AsyncSelectPicker.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"AsyncSelectPicker.vue2.js","sources":["../../../../../src/components/compositions/elements/picker/AsyncSelectPicker.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven async select picker composition. Same callback-driven\n * search surface as `AsyncSelectOption` but presented as a button-style\n * picker — the trigger reads as a single selected value with a chevron,\n * and the Combobox panel appears beneath it.\n *\n *   <AsyncSelectPicker\n *     v-model=\"userId\"\n *     label=\"User\"\n *     :on-search=\"(q) => fetch(`/users?q=${q}`).then(r => r.json())\"\n *   />\n */\nimport { computed, watch } from \"vue\"\nimport { ChevronsUpDown, 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 AsyncSelectPickerProps {\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  onSearch?: (query: string) => Promise<SelectOptionLike[]>\n  initialOptions?: SelectOptionLike[]\n  minSearchLength?: number\n  debounceMs?: number\n  loadingText?: string\n  emptyText?: string\n}\n\nconst props = withDefaults(defineProps<AsyncSelectPickerProps>(), {\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\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    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-picker-anchor\"\n        :class=\"[\n          'justify-between text-left',\n          errors.length ? 'border-destructive ring-destructive' : '',\n        ]\"\n      >\n        <span\n          v-if=\"selectedLabel\"\n          class=\"truncate text-sm\"\n          data-testid=\"async-picker-label\"\n        >\n          {{ selectedLabel }}\n        </span>\n        <span v-else class=\"text-sm text-muted-foreground\">\n          {{ placeholder ?? \"Select…\" }}\n        </span>\n        <ChevronsUpDown class=\"ml-2 h-4 w-4 shrink-0 opacity-50\" />\n      </ComboboxAnchor>\n      <ComboboxContent>\n        <div class=\"flex items-center border-b px-2 py-1.5\">\n          <Search class=\"mr-2 h-4 w-4 shrink-0 opacity-50\" />\n          <ComboboxInput\n            :id=\"id\"\n            :model-value=\"query\"\n            :placeholder=\"placeholder ?? 'Search…'\"\n            class=\"h-8\"\n            data-testid=\"async-picker-input\"\n            @input=\"onInput\"\n          />\n          <Loader2\n            v-if=\"isLoading\"\n            data-testid=\"async-picker-loader\"\n            class=\"ml-2 h-4 w-4 shrink-0 animate-spin text-muted-foreground\"\n          />\n        </div>\n        <div\n          v-if=\"isLoading\"\n          class=\"px-2 py-2 text-sm text-muted-foreground\"\n          data-testid=\"async-picker-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","_createElementBlock","_hoisted_1","_toDisplayString","_hoisted_2","ChevronsUpDown","ComboboxContent","_createElementVNode","_hoisted_3","Search","ComboboxInput","Loader2","_hoisted_4","ComboboxEmpty","_Fragment","_renderList","ComboboxItem","ComboboxItemIndicator"],"mappings":"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"}
+{"version":3,"file":"AsyncSelectPicker.vue2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/compositions/elements/picker/ColorPicker.vue.d.ts

@@ -0,0 +1,29 @@
+export interface ColorPickerProps {
+    modelValue?: string | null;
+    id?: string;
+    name?: string;
+    label?: string;
+    hideLabel?: boolean;
+    placeholder?: string;
+    required?: boolean;
+    readonly?: boolean;
+    disabled?: boolean;
+    helpText?: string;
+    errors?: string[];
+    colorFormat?: "hex" | "rgb" | "hsl";
+    swatches?: string[];
+}
+type __VLS_Props = ColorPickerProps;
+type __VLS_PublicProps = {
+    "modelValue"?: string | null;
+} & __VLS_Props;
+declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:modelValue": (value: string | null) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string | null) => any) | undefined;
+}>, {
+    swatches: string[];
+    errors: string[];
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+export default _default;
+//# sourceMappingURL=ColorPicker.vue.d.ts.map