@gxp-dev/mod-ui 2.0.12 → 2.0.14

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

@@ -1,98 +0,0 @@
-import e from "../../../ui/checkbox/Checkbox.js";
-import "../../../ui/checkbox/index.js";
-import t from "../../../ui/label/Label.js";
-import "../../../ui/label/index.js";
-import n from "../../../ui/field-frame/FieldFrame.js";
-import "../../../ui/field-frame/index.js";
-import { Fragment as r, computed as i, createBlock as a, createElementBlock as o, createElementVNode as s, createTextVNode as c, createVNode as l, defineComponent as u, mergeModels as d, normalizeClass as f, openBlock as p, renderList as m, toDisplayString as h, unref as g, useModel as _, withCtx as v } from "vue";
-//#region src/components/compositions/elements/option-select/CheckboxOption.vue?vue&type=script&setup=true&lang.ts
-var y = ["data-element-name"], b = /* @__PURE__ */ u({
-	__name: "CheckboxOption",
-	props: /* @__PURE__ */ d({
-		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(u) {
-		let d = u, b = _(u, "modelValue");
-		function x(e) {
-			return typeof e == "string" ? {
-				label: e,
-				value: e,
-				disabled: !1
-			} : {
-				label: e.label,
-				value: String(e.value),
-				disabled: !!e.disabled
-			};
-		}
-		let S = i(() => (d.options ?? []).map(x)), C = i(() => {
-			let e = b.value;
-			return e ? Array.isArray(e) ? e.map((e) => String(e)) : [String(e)] : [];
-		});
-		function w(e) {
-			return C.value.includes(e);
-		}
-		function T(e, t) {
-			let n = C.value;
-			t === !0 ? n.includes(e) || (b.value = [...n, e]) : b.value = n.filter((t) => t !== e);
-		}
-		return (i, d) => (p(), a(g(n), {
-			label: u.label,
-			required: u.required,
-			"hide-label": u.hideLabel,
-			"help-text": u.helpText,
-			errors: u.errors
-		}, {
-			default: v(() => [s("div", {
-				class: f(u.inline ? "flex flex-row flex-wrap gap-4" : "grid gap-2"),
-				"data-element-name": u.name ?? void 0
-			}, [(p(!0), o(r, null, m(S.value, (n) => (p(), o("div", {
-				key: n.value,
-				class: "flex items-center gap-2"
-			}, [l(g(e), {
-				id: `${u.id ?? "checkbox"}-${n.value}`,
-				name: u.name,
-				"model-value": w(n.value),
-				disabled: n.disabled || u.disabled || u.readonly,
-				"onUpdate:modelValue": (e) => T(n.value, e)
-			}, null, 8, [
-				"id",
-				"name",
-				"model-value",
-				"disabled",
-				"onUpdate:modelValue"
-			]), l(g(t), {
-				for: `${u.id ?? "checkbox"}-${n.value}`,
-				class: "cursor-pointer"
-			}, {
-				default: v(() => [c(h(n.label), 1)]),
-				_: 2
-			}, 1032, ["for"])]))), 128))], 10, y)]),
-			_: 1
-		}, 8, [
-			"label",
-			"required",
-			"hide-label",
-			"help-text",
-			"errors"
-		]));
-	}
-});
-//#endregion
-export { b as default };
-
-//# sourceMappingURL=CheckboxOption.vue_vue_type_script_setup_true_lang.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"CheckboxOption.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../../src/components/compositions/elements/option-select/CheckboxOption.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven multi-checkbox composition. Renders one Checkbox per\n * option and stores the result as an array of selected values.\n *\n *   <CheckboxOption v-model=\"prefs\" :options=\"[...]\" label=\"Preferences\" />\n */\nimport { computed } from \"vue\"\nimport type { SelectOptionLike } from \"@/definitions/shared/select-options\"\nimport { Checkbox } from \"@/components/ui/checkbox\"\nimport { Label } from \"@/components/ui/label\"\nimport { FieldFrame } from \"@/components/ui/field-frame\"\n\nexport interface CheckboxOptionProps {\n  modelValue?: Array<string | number> | null\n  options?: SelectOptionLike[]\n  id?: string\n  name?: string\n  label?: string\n  hideLabel?: boolean\n  inline?: boolean\n  required?: boolean\n  readonly?: boolean\n  disabled?: boolean\n  helpText?: string\n  errors?: string[]\n}\n\nconst props = withDefaults(defineProps<CheckboxOptionProps>(), {\n  errors: () => [],\n  options: () => [],\n})\n\nconst model = defineModel<Array<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 selected = computed<string[]>(() => {\n  const v = model.value\n  if (!v) {\n    return []\n  }\n  if (Array.isArray(v)) {\n    return v.map((x) => String(x))\n  }\n  return [String(v)]\n})\n\nfunction isChecked(val: string): boolean {\n  return selected.value.includes(val)\n}\n\nfunction onToggle(val: string, checked: boolean | \"indeterminate\"): void {\n  const current = selected.value\n  if (checked === true) {\n    if (!current.includes(val)) {\n      model.value = [...current, val]\n    }\n  } else {\n    model.value = current.filter((v) => v !== val)\n  }\n}\n</script>\n\n<template>\n  <FieldFrame\n    :label=\"label\"\n    :required=\"required\"\n    :hide-label=\"hideLabel\"\n    :help-text=\"helpText\"\n    :errors=\"errors\"\n  >\n    <div\n      :class=\"inline ? 'flex flex-row flex-wrap gap-4' : 'grid gap-2'\"\n      :data-element-name=\"name ?? undefined\"\n    >\n      <div\n        v-for=\"opt in normalised\"\n        :key=\"opt.value\"\n        class=\"flex items-center gap-2\"\n      >\n        <Checkbox\n          :id=\"`${id ?? 'checkbox'}-${opt.value}`\"\n          :name=\"name\"\n          :model-value=\"isChecked(opt.value)\"\n          :disabled=\"opt.disabled || disabled || readonly\"\n          @update:model-value=\"(c) => onToggle(opt.value, c)\"\n        />\n        <Label\n          :for=\"`${id ?? 'checkbox'}-${opt.value}`\"\n          class=\"cursor-pointer\"\n        >\n          {{ opt.label }}\n        </Label>\n      </div>\n    </div>\n  </FieldFrame>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA4BA,IAAM,IAAQ,GAKR,IAAQ,EAA0C,GAAC,YAAY;EAQrE,SAAS,EAAgB,GAAyC;GAIhE,OAHI,OAAO,KAAQ,WACV;IAAE,OAAO;IAAK,OAAO;IAAK,UAAU;GAAM,IAE5C;IACL,OAAO,EAAI;IACX,OAAO,OAAO,EAAI,KAAK;IACvB,UAAU,EAAQ,EAAI;GACxB;EACF;EAEA,IAAM,IAAa,SAChB,EAAM,WAAW,CAAC,GAAG,IAAI,CAAe,CAC3C,GAEM,IAAW,QAAyB;GACxC,IAAM,IAAI,EAAM;GAOhB,OANK,IAGD,MAAM,QAAQ,CAAC,IACV,EAAE,KAAK,MAAM,OAAO,CAAC,CAAC,IAExB,CAAC,OAAO,CAAC,CAAC,IALR,CAAC;EAMZ,CAAC;EAED,SAAS,EAAU,GAAsB;GACvC,OAAO,EAAS,MAAM,SAAS,CAAG;EACpC;EAEA,SAAS,EAAS,GAAa,GAA0C;GACvE,IAAM,IAAU,EAAS;GACzB,AAAI,MAAY,KACT,EAAQ,SAAS,CAAG,MACvB,EAAM,QAAQ,CAAC,GAAG,GAAS,CAAG,KAGhC,EAAM,QAAQ,EAAQ,QAAQ,MAAM,MAAM,CAAG;EAEjD;yBAIE,EA+Ba,EAAA,CAAA,GAAA;GA9BV,OAAO,EAAA;GACP,UAAU,EAAA;GACV,cAAY,EAAA;GACZ,aAAW,EAAA;GACX,QAAQ,EAAA;;oBAyBH,CAvBN,EAuBM,OAAA;IAtBH,OAAK,EAAE,EAAA,SAAM,kCAAA,YAAA;IACb,qBAAmB,EAAA,QAAQ,KAAA;eAE5B,EAkBM,GAAA,MAAA,EAjBU,EAAA,QAAP,YADT,EAkBM,OAAA;IAhBH,KAAK,EAAI;IACV,OAAM;OAEN,EAME,EAAA,CAAA,GAAA;IALC,IAAE,GAAK,EAAA,MAAE,WAAA,GAAkB,EAAI;IAC/B,MAAM,EAAA;IACN,eAAa,EAAU,EAAI,KAAK;IAChC,UAAU,EAAI,YAAY,EAAA,YAAY,EAAA;IACtC,wBAAqB,MAAM,EAAS,EAAI,OAAO,CAAC;;;;;;;OAEnD,EAKQ,EAAA,CAAA,GAAA;IAJL,KAAG,GAAK,EAAA,MAAE,WAAA,GAAkB,EAAI;IACjC,OAAM;;qBAES,CAAA,EAAA,EAAZ,EAAI,KAAK,GAAA,CAAA,CAAA,CAAA"}

package/dist/components/compositions/elements/option-select/IntegrationConnectorOption.js

@@ -1,7 +0,0 @@
-import e from "./IntegrationConnectorOption.vue_vue_type_script_setup_true_lang.js";
-//#region src/components/compositions/elements/option-select/IntegrationConnectorOption.vue
-var t = e;
-//#endregion
-export { t as default };
-
-//# sourceMappingURL=IntegrationConnectorOption.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"IntegrationConnectorOption.js","names":[],"sources":["../../../../../src/components/compositions/elements/option-select/IntegrationConnectorOption.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven integration-connector composition. Renders a Combobox of\n * connectors the host supplies via `onLoadConnectors`. Each row shows\n * the connector's lucide icon, label, type Badge and a status dot.\n * When `onConnect` is supplied, a per-row Connect / Reconnect button\n * surfaces for any connector with `status !== \"connected\"`.\n *\n *   <IntegrationConnectorOption\n *     v-model=\"connectorId\"\n *     label=\"Connector\"\n *     :on-load-connectors=\"() => fetch('/connectors').then((r) => r.json())\"\n *     :on-connect=\"(id) => beginOAuth(id)\"\n *   />\n */\nimport { computed, ref, watch, type Component } from \"vue\"\nimport { Loader2, Search } from \"@lucide/vue\"\nimport {\n  Combobox,\n  ComboboxAnchor,\n  ComboboxContent,\n  ComboboxEmpty,\n  ComboboxInput,\n  ComboboxItem,\n  ComboboxItemIndicator,\n} from \"@/components/ui/combobox\"\nimport { Button } from \"@/components/ui/button\"\nimport { Badge } from \"@/components/ui/badge\"\nimport { FieldFrame } from \"@/components/ui/field-frame\"\nimport type { Connector } from \"@/definitions/shared/connector\"\nimport { useConnectorLoader } from \"@/composables/useConnectorLoader\"\n\nexport interface IntegrationConnectorOptionProps {\n  modelValue?: string | 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  /** REQUIRED. Returns the list of connectors. */\n  onLoadConnectors: () => Promise<Connector[]>\n  /** When supplied, surfaces a per-row Connect button on non-connected rows. */\n  onConnect?: (id: string) => Promise<void>\n  loadingText?: string\n  emptyText?: string\n  errorText?: string\n}\n\nconst props = withDefaults(defineProps<IntegrationConnectorOptionProps>(), {\n  errors: () => [],\n  loadingText: \"Loading connectors...\",\n  emptyText: \"No connectors available\",\n  errorText: \"Could not load connectors\",\n})\n\nconst model = defineModel<string | null>(\"modelValue\")\n\nconst { connectors, isLoading, error, refresh, isConnecting, connect } =\n  useConnectorLoader(() => props.onLoadConnectors())\n\nconst STATUS_DOT_CLASS: Record<NonNullable<Connector[\"status\"]>, string> = {\n  connected: \"bg-success\",\n  disconnected: \"bg-muted-foreground/40\",\n  error: \"bg-destructive\",\n}\n\nfunction statusDotClass(status: Connector[\"status\"]): string {\n  if (status && STATUS_DOT_CLASS[status]) {\n    return STATUS_DOT_CLASS[status]\n  }\n  return \"bg-muted-foreground/40\"\n}\n\nfunction toPascalCase(input: string): string {\n  return input\n    .replace(/[-_\\s]+(.)?/g, (_, ch?: string) => (ch ? ch.toUpperCase() : \"\"))\n    .replace(/^(.)/, (m) => m.toUpperCase())\n}\n\nconst iconRegistry = ref<Record<string, Component | null>>({})\n\nasync function ensureIcon(name: string): Promise<void> {\n  if (!name) {\n    return\n  }\n  const pascal = toPascalCase(name)\n  if (pascal in iconRegistry.value) {\n    return\n  }\n  const mod = await import(\"@lucide/vue\")\n  const registry = mod as unknown as Record<string, Component | undefined>\n  iconRegistry.value = {\n    ...iconRegistry.value,\n    [pascal]: registry[pascal] ?? null,\n  }\n}\n\nwatch(\n  connectors,\n  (next) => {\n    for (const c of next) {\n      if (c.icon) {\n        void ensureIcon(c.icon)\n      }\n    }\n  },\n  { immediate: true },\n)\n\nfunction iconFor(name?: string): Component | null {\n  if (!name) {\n    return null\n  }\n  return iconRegistry.value[toPascalCase(name)] ?? null\n}\n\nconst query = ref<string>(\"\")\n\nconst filteredConnectors = computed<Connector[]>(() => {\n  const q = query.value.trim().toLowerCase()\n  if (!q) {\n    return connectors.value\n  }\n  return connectors.value.filter((c) =>\n    [c.label, c.type ?? \"\", c.id].some((field) =>\n      field.toLowerCase().includes(q),\n    ),\n  )\n})\n\nconst selectedConnector = computed<Connector | null>(() => {\n  if (model.value === undefined || model.value === null) {\n    return null\n  }\n  return connectors.value.find((c) => c.id === model.value) ?? null\n})\n\nconst currentValue = computed<string | undefined>(() => {\n  if (model.value === undefined || model.value === null) {\n    return undefined\n  }\n  return model.value\n})\n\nfunction onInput(event: Event): void {\n  query.value = (event.target as HTMLInputElement).value\n}\n\nfunction onUpdate(next: unknown): void {\n  if (Array.isArray(next)) {\n    model.value = next[0] === undefined ? null : (next[0] as string)\n    return\n  }\n  model.value = next === undefined ? null : (next as string)\n}\n\nasync function handleConnect(id: string, event?: Event): Promise<void> {\n  event?.stopPropagation()\n  event?.preventDefault()\n  await connect(id, props.onConnect)\n}\n\ndefineExpose({ refresh, handleConnect })\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    >\n      <ComboboxAnchor\n        :data-element-name=\"name ?? undefined\"\n        data-testid=\"integration-connector-option-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=\"\n            selectedConnector?.label || (placeholder ?? 'Select connector…')\n          \"\n          data-testid=\"integration-connector-option-input\"\n          @input=\"onInput\"\n        />\n        <Loader2\n          v-if=\"isLoading\"\n          data-testid=\"integration-connector-option-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=\"integration-connector-option-loading-text\"\n        >\n          {{ loadingText }}\n        </div>\n        <div\n          v-else-if=\"error\"\n          class=\"flex flex-col gap-2 px-2 py-2\"\n          data-testid=\"integration-connector-option-error\"\n        >\n          <p class=\"text-sm text-destructive\">{{ errorText }}</p>\n          <Button\n            type=\"button\"\n            size=\"sm\"\n            variant=\"outline\"\n            data-testid=\"integration-connector-option-retry\"\n            @click=\"refresh\"\n          >\n            Retry\n          </Button>\n        </div>\n        <ComboboxEmpty v-else-if=\"filteredConnectors.length === 0\">\n          {{ emptyText }}\n        </ComboboxEmpty>\n        <ComboboxItem\n          v-for=\"conn in filteredConnectors\"\n          :key=\"conn.id\"\n          :value=\"conn.id\"\n          :data-testid=\"`integration-connector-option-item-${conn.id}`\"\n        >\n          <ComboboxItemIndicator />\n          <div class=\"flex flex-1 items-center gap-2\">\n            <component\n              :is=\"iconFor(conn.icon)\"\n              v-if=\"iconFor(conn.icon)\"\n              class=\"size-4 shrink-0\"\n            />\n            <span class=\"truncate text-sm\">{{ conn.label }}</span>\n            <Badge v-if=\"conn.type\" variant=\"outline\" size=\"sm\">\n              {{ conn.type }}\n            </Badge>\n            <span\n              :class=\"['ml-auto inline-block size-2 rounded-full', statusDotClass(conn.status)]\"\n              :data-status=\"conn.status ?? 'unknown'\"\n              :data-testid=\"`integration-connector-option-status-${conn.id}`\"\n            />\n            <Button\n              v-if=\"onConnect && conn.status !== 'connected'\"\n              type=\"button\"\n              size=\"sm\"\n              variant=\"outline\"\n              class=\"ml-2\"\n              :disabled=\"Boolean(isConnecting[conn.id])\"\n              :data-testid=\"`integration-connector-option-connect-${conn.id}`\"\n              @click.stop=\"handleConnect(conn.id, $event)\"\n            >\n              <Loader2\n                v-if=\"isConnecting[conn.id]\"\n                class=\"size-3 animate-spin\"\n              />\n              <span>{{\n                conn.status === \"error\" ? \"Reconnect\" : \"Connect\"\n              }}</span>\n            </Button>\n          </div>\n        </ComboboxItem>\n      </ComboboxContent>\n    </Combobox>\n  </FieldFrame>\n</template>\n"],"mappings":""}

package/dist/components/compositions/elements/option-select/IntegrationConnectorOption.vue_vue_type_script_setup_true_lang.js

@@ -1,223 +0,0 @@
-import e from "../../../ui/badge/Badge.js";
-import "../../../ui/badge/index.js";
-import t from "../../../ui/button/Button.js";
-import "../../../ui/button/index.js";
-import n from "../../../ui/combobox/Combobox.js";
-import r from "../../../ui/combobox/ComboboxAnchor.js";
-import i from "../../../ui/combobox/ComboboxContent.js";
-import a from "../../../ui/combobox/ComboboxEmpty.js";
-import o from "../../../ui/combobox/ComboboxInput.js";
-import s from "../../../ui/combobox/ComboboxItem.js";
-import ee from "../../../ui/combobox/ComboboxItemIndicator.js";
-import "../../../ui/combobox/index.js";
-import te from "../../../ui/field-frame/FieldFrame.js";
-import "../../../ui/field-frame/index.js";
-import { useConnectorLoader as c } from "../../../../composables/useConnectorLoader.js";
-import { Fragment as l, computed as u, createBlock as d, createCommentVNode as f, createElementBlock as p, createElementVNode as m, createTextVNode as h, createVNode as g, defineComponent as _, mergeModels as v, normalizeClass as y, openBlock as b, ref as x, renderList as S, resolveDynamicComponent as C, toDisplayString as w, unref as T, useModel as E, watch as D, withCtx as O, withModifiers as ne } from "vue";
-import { Loader2 as k, Search as A } from "@lucide/vue";
-//#region src/components/compositions/elements/option-select/IntegrationConnectorOption.vue?vue&type=script&setup=true&lang.ts
-var j = {
-	key: 0,
-	class: "px-2 py-2 text-sm text-muted-foreground",
-	"data-testid": "integration-connector-option-loading-text"
-}, M = {
-	key: 1,
-	class: "flex flex-col gap-2 px-2 py-2",
-	"data-testid": "integration-connector-option-error"
-}, N = { class: "text-sm text-destructive" }, P = { class: "flex flex-1 items-center gap-2" }, F = { class: "truncate text-sm" }, I = ["data-status", "data-testid"], L = /* @__PURE__ */ _({
-	__name: "IntegrationConnectorOption",
-	props: /* @__PURE__ */ v({
-		modelValue: {},
-		id: {},
-		name: {},
-		label: {},
-		hideLabel: { type: Boolean },
-		placeholder: {},
-		required: { type: Boolean },
-		readonly: { type: Boolean },
-		disabled: { type: Boolean },
-		helpText: {},
-		errors: { default: () => [] },
-		onLoadConnectors: {},
-		onConnect: {},
-		loadingText: { default: "Loading connectors..." },
-		emptyText: { default: "No connectors available" },
-		errorText: { default: "Could not load connectors" }
-	}, {
-		modelValue: {},
-		modelModifiers: {}
-	}),
-	emits: ["update:modelValue"],
-	setup(_, { expose: v }) {
-		let L = _, R = E(_, "modelValue"), { connectors: z, isLoading: B, error: V, refresh: H, isConnecting: U, connect: W } = c(() => L.onLoadConnectors()), G = {
-			connected: "bg-success",
-			disconnected: "bg-muted-foreground/40",
-			error: "bg-destructive"
-		};
-		function K(e) {
-			return e && G[e] ? G[e] : "bg-muted-foreground/40";
-		}
-		function q(e) {
-			return e.replace(/[-_\s]+(.)?/g, (e, t) => t ? t.toUpperCase() : "").replace(/^(.)/, (e) => e.toUpperCase());
-		}
-		let J = x({});
-		async function Y(e) {
-			if (!e) return;
-			let t = q(e);
-			if (t in J.value) return;
-			let n = await import("@lucide/vue");
-			J.value = {
-				...J.value,
-				[t]: n[t] ?? null
-			};
-		}
-		D(z, (e) => {
-			for (let t of e) t.icon && Y(t.icon);
-		}, { immediate: !0 });
-		function X(e) {
-			return e ? J.value[q(e)] ?? null : null;
-		}
-		let Z = x(""), Q = u(() => {
-			let e = Z.value.trim().toLowerCase();
-			return e ? z.value.filter((t) => [
-				t.label,
-				t.type ?? "",
-				t.id
-			].some((t) => t.toLowerCase().includes(e))) : z.value;
-		}), re = u(() => R.value === void 0 || R.value === null ? null : z.value.find((e) => e.id === R.value) ?? null), ie = u(() => {
-			if (!(R.value === void 0 || R.value === null)) return R.value;
-		});
-		function ae(e) {
-			Z.value = e.target.value;
-		}
-		function oe(e) {
-			if (Array.isArray(e)) {
-				R.value = e[0] === void 0 ? null : e[0];
-				return;
-			}
-			R.value = e === void 0 ? null : e;
-		}
-		async function $(e, t) {
-			t?.stopPropagation(), t?.preventDefault(), await W(e, L.onConnect);
-		}
-		return v({
-			refresh: H,
-			handleConnect: $
-		}), (c, u) => (b(), d(T(te), {
-			label: _.label,
-			required: _.required,
-			"hide-label": _.hideLabel,
-			for: _.id,
-			"help-text": _.helpText,
-			errors: _.errors
-		}, {
-			default: O(() => [g(T(n), {
-				"model-value": ie.value,
-				disabled: _.disabled || _.readonly,
-				"ignore-filter": "",
-				"onUpdate:modelValue": oe
-			}, {
-				default: O(() => [g(T(r), {
-					"data-element-name": _.name ?? void 0,
-					"data-testid": "integration-connector-option-anchor",
-					class: y(_.errors.length ? "border-destructive ring-destructive" : "")
-				}, {
-					default: O(() => [
-						g(T(A), { class: "mr-2 h-4 w-4 shrink-0 opacity-50" }),
-						g(T(o), {
-							id: _.id,
-							"model-value": Z.value,
-							placeholder: re.value?.label || (_.placeholder ?? "Select connector…"),
-							"data-testid": "integration-connector-option-input",
-							onInput: ae
-						}, null, 8, [
-							"id",
-							"model-value",
-							"placeholder"
-						]),
-						T(B) ? (b(), d(T(k), {
-							key: 0,
-							"data-testid": "integration-connector-option-loader",
-							class: "ml-2 h-4 w-4 shrink-0 animate-spin text-muted-foreground"
-						})) : f("", !0)
-					]),
-					_: 1
-				}, 8, ["data-element-name", "class"]), g(T(i), null, {
-					default: O(() => [T(B) ? (b(), p("div", j, w(_.loadingText), 1)) : T(V) ? (b(), p("div", M, [m("p", N, w(_.errorText), 1), g(T(t), {
-						type: "button",
-						size: "sm",
-						variant: "outline",
-						"data-testid": "integration-connector-option-retry",
-						onClick: T(H)
-					}, {
-						default: O(() => [...u[0] ||= [h(" Retry ", -1)]]),
-						_: 1
-					}, 8, ["onClick"])])) : Q.value.length === 0 ? (b(), d(T(a), { key: 2 }, {
-						default: O(() => [h(w(_.emptyText), 1)]),
-						_: 1
-					})) : f("", !0), (b(!0), p(l, null, S(Q.value, (n) => (b(), d(T(s), {
-						key: n.id,
-						value: n.id,
-						"data-testid": `integration-connector-option-item-${n.id}`
-					}, {
-						default: O(() => [g(T(ee)), m("div", P, [
-							X(n.icon) ? (b(), d(C(X(n.icon)), {
-								key: 0,
-								class: "size-4 shrink-0"
-							})) : f("", !0),
-							m("span", F, w(n.label), 1),
-							n.type ? (b(), d(T(e), {
-								key: 1,
-								variant: "outline",
-								size: "sm"
-							}, {
-								default: O(() => [h(w(n.type), 1)]),
-								_: 2
-							}, 1024)) : f("", !0),
-							m("span", {
-								class: y(["ml-auto inline-block size-2 rounded-full", K(n.status)]),
-								"data-status": n.status ?? "unknown",
-								"data-testid": `integration-connector-option-status-${n.id}`
-							}, null, 10, I),
-							_.onConnect && n.status !== "connected" ? (b(), d(T(t), {
-								key: 2,
-								type: "button",
-								size: "sm",
-								variant: "outline",
-								class: "ml-2",
-								disabled: !!T(U)[n.id],
-								"data-testid": `integration-connector-option-connect-${n.id}`,
-								onClick: ne((e) => $(n.id, e), ["stop"])
-							}, {
-								default: O(() => [T(U)[n.id] ? (b(), d(T(k), {
-									key: 0,
-									class: "size-3 animate-spin"
-								})) : f("", !0), m("span", null, w(n.status === "error" ? "Reconnect" : "Connect"), 1)]),
-								_: 2
-							}, 1032, [
-								"disabled",
-								"data-testid",
-								"onClick"
-							])) : f("", !0)
-						])]),
-						_: 2
-					}, 1032, ["value", "data-testid"]))), 128))]),
-					_: 1
-				})]),
-				_: 1
-			}, 8, ["model-value", "disabled"])]),
-			_: 1
-		}, 8, [
-			"label",
-			"required",
-			"hide-label",
-			"for",
-			"help-text",
-			"errors"
-		]));
-	}
-});
-//#endregion
-export { L as default };
-
-//# sourceMappingURL=IntegrationConnectorOption.vue_vue_type_script_setup_true_lang.js.map

package/dist/components/compositions/elements/option-select/IntegrationConnectorOption.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"IntegrationConnectorOption.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../../src/components/compositions/elements/option-select/IntegrationConnectorOption.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven integration-connector composition. Renders a Combobox of\n * connectors the host supplies via `onLoadConnectors`. Each row shows\n * the connector's lucide icon, label, type Badge and a status dot.\n * When `onConnect` is supplied, a per-row Connect / Reconnect button\n * surfaces for any connector with `status !== \"connected\"`.\n *\n *   <IntegrationConnectorOption\n *     v-model=\"connectorId\"\n *     label=\"Connector\"\n *     :on-load-connectors=\"() => fetch('/connectors').then((r) => r.json())\"\n *     :on-connect=\"(id) => beginOAuth(id)\"\n *   />\n */\nimport { computed, ref, watch, type Component } from \"vue\"\nimport { Loader2, Search } from \"@lucide/vue\"\nimport {\n  Combobox,\n  ComboboxAnchor,\n  ComboboxContent,\n  ComboboxEmpty,\n  ComboboxInput,\n  ComboboxItem,\n  ComboboxItemIndicator,\n} from \"@/components/ui/combobox\"\nimport { Button } from \"@/components/ui/button\"\nimport { Badge } from \"@/components/ui/badge\"\nimport { FieldFrame } from \"@/components/ui/field-frame\"\nimport type { Connector } from \"@/definitions/shared/connector\"\nimport { useConnectorLoader } from \"@/composables/useConnectorLoader\"\n\nexport interface IntegrationConnectorOptionProps {\n  modelValue?: string | 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  /** REQUIRED. Returns the list of connectors. */\n  onLoadConnectors: () => Promise<Connector[]>\n  /** When supplied, surfaces a per-row Connect button on non-connected rows. */\n  onConnect?: (id: string) => Promise<void>\n  loadingText?: string\n  emptyText?: string\n  errorText?: string\n}\n\nconst props = withDefaults(defineProps<IntegrationConnectorOptionProps>(), {\n  errors: () => [],\n  loadingText: \"Loading connectors...\",\n  emptyText: \"No connectors available\",\n  errorText: \"Could not load connectors\",\n})\n\nconst model = defineModel<string | null>(\"modelValue\")\n\nconst { connectors, isLoading, error, refresh, isConnecting, connect } =\n  useConnectorLoader(() => props.onLoadConnectors())\n\nconst STATUS_DOT_CLASS: Record<NonNullable<Connector[\"status\"]>, string> = {\n  connected: \"bg-success\",\n  disconnected: \"bg-muted-foreground/40\",\n  error: \"bg-destructive\",\n}\n\nfunction statusDotClass(status: Connector[\"status\"]): string {\n  if (status && STATUS_DOT_CLASS[status]) {\n    return STATUS_DOT_CLASS[status]\n  }\n  return \"bg-muted-foreground/40\"\n}\n\nfunction toPascalCase(input: string): string {\n  return input\n    .replace(/[-_\\s]+(.)?/g, (_, ch?: string) => (ch ? ch.toUpperCase() : \"\"))\n    .replace(/^(.)/, (m) => m.toUpperCase())\n}\n\nconst iconRegistry = ref<Record<string, Component | null>>({})\n\nasync function ensureIcon(name: string): Promise<void> {\n  if (!name) {\n    return\n  }\n  const pascal = toPascalCase(name)\n  if (pascal in iconRegistry.value) {\n    return\n  }\n  const mod = await import(\"@lucide/vue\")\n  const registry = mod as unknown as Record<string, Component | undefined>\n  iconRegistry.value = {\n    ...iconRegistry.value,\n    [pascal]: registry[pascal] ?? null,\n  }\n}\n\nwatch(\n  connectors,\n  (next) => {\n    for (const c of next) {\n      if (c.icon) {\n        void ensureIcon(c.icon)\n      }\n    }\n  },\n  { immediate: true },\n)\n\nfunction iconFor(name?: string): Component | null {\n  if (!name) {\n    return null\n  }\n  return iconRegistry.value[toPascalCase(name)] ?? null\n}\n\nconst query = ref<string>(\"\")\n\nconst filteredConnectors = computed<Connector[]>(() => {\n  const q = query.value.trim().toLowerCase()\n  if (!q) {\n    return connectors.value\n  }\n  return connectors.value.filter((c) =>\n    [c.label, c.type ?? \"\", c.id].some((field) =>\n      field.toLowerCase().includes(q),\n    ),\n  )\n})\n\nconst selectedConnector = computed<Connector | null>(() => {\n  if (model.value === undefined || model.value === null) {\n    return null\n  }\n  return connectors.value.find((c) => c.id === model.value) ?? null\n})\n\nconst currentValue = computed<string | undefined>(() => {\n  if (model.value === undefined || model.value === null) {\n    return undefined\n  }\n  return model.value\n})\n\nfunction onInput(event: Event): void {\n  query.value = (event.target as HTMLInputElement).value\n}\n\nfunction onUpdate(next: unknown): void {\n  if (Array.isArray(next)) {\n    model.value = next[0] === undefined ? null : (next[0] as string)\n    return\n  }\n  model.value = next === undefined ? null : (next as string)\n}\n\nasync function handleConnect(id: string, event?: Event): Promise<void> {\n  event?.stopPropagation()\n  event?.preventDefault()\n  await connect(id, props.onConnect)\n}\n\ndefineExpose({ refresh, handleConnect })\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    >\n      <ComboboxAnchor\n        :data-element-name=\"name ?? undefined\"\n        data-testid=\"integration-connector-option-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=\"\n            selectedConnector?.label || (placeholder ?? 'Select connector…')\n          \"\n          data-testid=\"integration-connector-option-input\"\n          @input=\"onInput\"\n        />\n        <Loader2\n          v-if=\"isLoading\"\n          data-testid=\"integration-connector-option-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=\"integration-connector-option-loading-text\"\n        >\n          {{ loadingText }}\n        </div>\n        <div\n          v-else-if=\"error\"\n          class=\"flex flex-col gap-2 px-2 py-2\"\n          data-testid=\"integration-connector-option-error\"\n        >\n          <p class=\"text-sm text-destructive\">{{ errorText }}</p>\n          <Button\n            type=\"button\"\n            size=\"sm\"\n            variant=\"outline\"\n            data-testid=\"integration-connector-option-retry\"\n            @click=\"refresh\"\n          >\n            Retry\n          </Button>\n        </div>\n        <ComboboxEmpty v-else-if=\"filteredConnectors.length === 0\">\n          {{ emptyText }}\n        </ComboboxEmpty>\n        <ComboboxItem\n          v-for=\"conn in filteredConnectors\"\n          :key=\"conn.id\"\n          :value=\"conn.id\"\n          :data-testid=\"`integration-connector-option-item-${conn.id}`\"\n        >\n          <ComboboxItemIndicator />\n          <div class=\"flex flex-1 items-center gap-2\">\n            <component\n              :is=\"iconFor(conn.icon)\"\n              v-if=\"iconFor(conn.icon)\"\n              class=\"size-4 shrink-0\"\n            />\n            <span class=\"truncate text-sm\">{{ conn.label }}</span>\n            <Badge v-if=\"conn.type\" variant=\"outline\" size=\"sm\">\n              {{ conn.type }}\n            </Badge>\n            <span\n              :class=\"['ml-auto inline-block size-2 rounded-full', statusDotClass(conn.status)]\"\n              :data-status=\"conn.status ?? 'unknown'\"\n              :data-testid=\"`integration-connector-option-status-${conn.id}`\"\n            />\n            <Button\n              v-if=\"onConnect && conn.status !== 'connected'\"\n              type=\"button\"\n              size=\"sm\"\n              variant=\"outline\"\n              class=\"ml-2\"\n              :disabled=\"Boolean(isConnecting[conn.id])\"\n              :data-testid=\"`integration-connector-option-connect-${conn.id}`\"\n              @click.stop=\"handleConnect(conn.id, $event)\"\n            >\n              <Loader2\n                v-if=\"isConnecting[conn.id]\"\n                class=\"size-3 animate-spin\"\n              />\n              <span>{{\n                conn.status === \"error\" ? \"Reconnect\" : \"Connect\"\n              }}</span>\n            </Button>\n          </div>\n        </ComboboxItem>\n      </ComboboxContent>\n    </Combobox>\n  </FieldFrame>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAqDA,IAAM,IAAQ,GAOR,IAAQ,EAA0B,GAAC,YAAY,GAE/C,EAAE,eAAY,cAAW,UAAO,YAAS,iBAAc,eAC3D,QAAyB,EAAM,iBAAiB,CAAC,GAE7C,IAAqE;GACzE,WAAW;GACX,cAAc;GACd,OAAO;EACT;EAEA,SAAS,EAAe,GAAqC;GAI3D,OAHI,KAAU,EAAiB,KACtB,EAAiB,KAEnB;EACT;EAEA,SAAS,EAAa,GAAuB;GAC3C,OAAO,EACJ,QAAQ,iBAAiB,GAAG,MAAiB,IAAK,EAAG,YAAY,IAAI,EAAG,EACxE,QAAQ,SAAS,MAAM,EAAE,YAAY,CAAC;EAC3C;EAEA,IAAM,IAAe,EAAsC,CAAC,CAAC;EAE7D,eAAe,EAAW,GAA6B;GACrD,IAAI,CAAC,GACH;GAEF,IAAM,IAAS,EAAa,CAAI;GAChC,IAAI,KAAU,EAAa,OACzB;GAGF,IAAM,IAAW,MADC,OAAO;GAEzB,EAAa,QAAQ;IACnB,GAAG,EAAa;KACf,IAAS,EAAS,MAAW;GAChC;EACF;EAEA,EACE,IACC,MAAS;GACR,KAAK,IAAM,KAAK,GACd,AAAI,EAAE,QACJ,EAAgB,EAAE,IAAI;EAG5B,GACA,EAAE,WAAW,GAAK,CACpB;EAEA,SAAS,EAAQ,GAAiC;GAIhD,OAHK,IAGE,EAAa,MAAM,EAAa,CAAI,MAAM,OAFxC;EAGX;EAEA,IAAM,IAAQ,EAAY,EAAE,GAEtB,IAAqB,QAA4B;GACrD,IAAM,IAAI,EAAM,MAAM,KAAK,EAAE,YAAY;GAIzC,OAHK,IAGE,EAAW,MAAM,QAAQ,MAC9B;IAAC,EAAE;IAAO,EAAE,QAAQ;IAAI,EAAE;GAAE,EAAE,MAAM,MAClC,EAAM,YAAY,EAAE,SAAS,CAAC,CAChC,CACF,IANS,EAAW;EAOtB,CAAC,GAEK,KAAoB,QACpB,EAAM,UAAU,KAAA,KAAa,EAAM,UAAU,OACxC,OAEF,EAAW,MAAM,MAAM,MAAM,EAAE,OAAO,EAAM,KAAK,KAAK,IAC9D,GAEK,KAAe,QAAmC;GAClD,QAAM,UAAU,KAAA,KAAa,EAAM,UAAU,OAGjD,OAAO,EAAM;EACf,CAAC;EAED,SAAS,GAAQ,GAAoB;GACnC,EAAM,QAAS,EAAM,OAA4B;EACnD;EAEA,SAAS,GAAS,GAAqB;GACrC,IAAI,MAAM,QAAQ,CAAI,GAAG;IACvB,EAAM,QAAQ,EAAK,OAAO,KAAA,IAAY,OAAQ,EAAK;IACnD;GACF;GACA,EAAM,QAAQ,MAAS,KAAA,IAAY,OAAQ;EAC7C;EAEA,eAAe,EAAc,GAAY,GAA8B;GAGrE,AAFA,GAAO,gBAAgB,GACvB,GAAO,eAAe,GACtB,MAAM,EAAQ,GAAI,EAAM,SAAS;EACnC;SAEA,EAAa;GAAE;GAAS;EAAc,CAAC,mBAIrC,EA0Ga,EAAA,EAAA,GAAA;GAzGV,OAAO,EAAA;GACP,UAAU,EAAA;GACV,cAAY,EAAA;GACZ,KAAK,EAAA;GACL,aAAW,EAAA;GACX,QAAQ,EAAA;;oBAmGE,CAjGX,EAiGW,EAAA,CAAA,GAAA;IAhGR,eAAa,GAAA;IACb,UAAU,EAAA,YAAY,EAAA;IACvB,iBAAA;IACC,uBAAoB;;qBAsBJ,CApBjB,EAoBiB,EAAA,CAAA,GAAA;KAnBd,qBAAmB,EAAA,QAAQ,KAAA;KAC5B,eAAY;KACX,OAAK,EAAE,EAAA,OAAO,SAAM,wCAAA,EAAA;;sBAE8B;MAAnD,EAAmD,EAAA,CAAA,GAAA,EAA3C,OAAM,mCAAkC,CAAA;MAChD,EAQE,EAAA,CAAA,GAAA;OAPC,IAAI,EAAA;OACJ,eAAa,EAAA;OACb,aAA0B,GAAA,OAAmB,UAAU,EAAA,eAAW;OAGnE,eAAY;OACJ;;;;;;MAGF,EAAA,CAAA,KAAA,EAAA,GADR,EAIE,EAAA,CAAA,GAAA;;OAFA,eAAY;OACZ,OAAM;;;;2CAGV,EAqEkB,EAAA,CAAA,GAAA,MAAA;sBA9DV,CALE,EAAA,CAAA,KAAA,EAAA,GADR,EAMM,OANN,GAMM,EADD,EAAA,WAAW,GAAA,CAAA,KAGH,EAAA,CAAA,KAAA,EAAA,GADb,EAeM,OAfN,GAeM,CAVJ,EAAuD,KAAvD,GAAuD,EAAhB,EAAA,SAAS,GAAA,CAAA,GAChD,EAQS,EAAA,CAAA,GAAA;MAPP,MAAK;MACL,MAAK;MACL,SAAQ;MACR,eAAY;MACX,SAAO,EAAA,CAAA;;uBAGV,CAAA,GAAA,AAAA,EAAA,OAAA,CAAA,EAFC,WAED,EAAA,CAAA,CAAA,CAAA;;6BAEwB,EAAA,MAAmB,WAAM,KAAA,EAAA,GAAnD,EAEgB,EAAA,CAAA,GAAA,EAAA,KAAA,EAAA,GAAA;uBADC,CAAA,EAAA,EAAZ,EAAA,SAAS,GAAA,CAAA,CAAA,CAAA;;8BAEd,EAyCe,GAAA,MAAA,EAxCE,EAAA,QAAR,YADT,EAyCe,EAAA,CAAA,GAAA;MAvCZ,KAAK,EAAK;MACV,OAAO,EAAK;MACZ,eAAW,qCAAuC,EAAK;;uBAE/B,CAAzB,EAAyB,EAAA,EAAA,CAAA,GACzB,EAiCM,OAjCN,GAiCM;OA9BI,EAAQ,EAAK,IAAI,KAAA,EAAA,GAFzB,EAIE,EAHK,EAAQ,EAAK,IAAI,CAAA,GAAA;;QAEtB,OAAM;;OAER,EAAsD,QAAtD,GAAsD,EAApB,EAAK,KAAK,GAAA,CAAA;OAC/B,EAAK,QAAA,EAAA,GAAlB,EAEQ,EAAA,CAAA,GAAA;;QAFgB,SAAQ;QAAU,MAAK;;yBAC9B,CAAA,EAAA,EAAZ,EAAK,IAAI,GAAA,CAAA,CAAA,CAAA;;;OAEd,EAIE,QAAA;QAHC,OAAK,EAAA,CAAA,4CAA+C,EAAe,EAAK,MAAM,CAAA,CAAA;QAC9E,eAAa,EAAK,UAAM;QACxB,eAAW,uCAAyC,EAAK;;OAGpD,EAAA,aAAa,EAAK,WAAM,eAAA,EAAA,GADhC,EAiBS,EAAA,CAAA,GAAA;;QAfP,MAAK;QACL,MAAK;QACL,SAAQ;QACR,OAAM;QACL,UAAU,EAAQ,EAAA,CAAA,EAAa,EAAK;QACpC,eAAW,wCAA0C,EAAK;QAC1D,SAAK,IAAA,MAAO,EAAc,EAAK,IAAI,CAAM,GAAA,CAAA,MAAA,CAAA;;yBAKxC,CAFM,EAAA,CAAA,EAAa,EAAK,OAAA,EAAA,GAD1B,EAGE,EAAA,CAAA,GAAA;;SADA,OAAM;yBAER,EAES,QAAA,MAAA,EADP,EAAK,WAAM,UAAA,cAAA,SAAA,GAAA,CAAA,CAAA,CAAA"}

package/dist/components/compositions/elements/option-select/ListOption.js

@@ -1,7 +0,0 @@
-import e from "./ListOption.vue_vue_type_script_setup_true_lang.js";
-//#region src/components/compositions/elements/option-select/ListOption.vue
-var t = e;
-//#endregion
-export { t as default };
-
-//# sourceMappingURL=ListOption.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"ListOption.js","names":[],"sources":["../../../../../src/components/compositions/elements/option-select/ListOption.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven single-select chip list. Each option becomes a clickable\n * Badge. When `clearable` is true, re-clicking the active chip clears\n * the selection.\n *\n *   <ListOption v-model=\"status\" :options=\"[...]\" label=\"Status\" />\n */\nimport { computed } from \"vue\"\nimport type { SelectOptionLike } from \"@/definitions/shared/select-options\"\nimport { Badge } from \"@/components/ui/badge\"\nimport { FieldFrame } from \"@/components/ui/field-frame\"\n\nexport interface ListOptionProps {\n  modelValue?: string | number | null\n  options?: SelectOptionLike[]\n  id?: string\n  name?: string\n  label?: string\n  hideLabel?: boolean\n  required?: boolean\n  readonly?: boolean\n  disabled?: boolean\n  helpText?: string\n  errors?: string[]\n  clearable?: boolean\n}\n\nconst props = withDefaults(defineProps<ListOptionProps>(), {\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 currentValue = computed<string | undefined>(() => {\n  if (model.value === undefined || model.value === null) {\n    return undefined\n  }\n  return String(model.value)\n})\n\nfunction isActive(val: string): boolean {\n  return currentValue.value === val\n}\n\nfunction selectValue(opt: NormalisedOption): void {\n  if (opt.disabled || props.disabled || props.readonly) {\n    return\n  }\n  if (currentValue.value === opt.value && props.clearable) {\n    model.value = null\n    return\n  }\n  model.value = opt.value\n}\n</script>\n\n<template>\n  <FieldFrame\n    :label=\"label\"\n    :required=\"required\"\n    :hide-label=\"hideLabel\"\n    :help-text=\"helpText\"\n    :errors=\"errors\"\n  >\n    <div\n      class=\"flex flex-wrap gap-2\"\n      :data-element-name=\"name ?? undefined\"\n    >\n      <Badge\n        v-for=\"opt in normalised\"\n        :key=\"opt.value\"\n        as=\"button\"\n        type=\"button\"\n        :variant=\"isActive(opt.value) ? 'default' : 'outline'\"\n        size=\"lg\"\n        :class=\"[\n          'cursor-pointer transition-colors',\n          opt.disabled || disabled || readonly\n            ? 'pointer-events-none opacity-50'\n            : '',\n        ]\"\n        :data-active=\"isActive(opt.value)\"\n        :aria-pressed=\"isActive(opt.value)\"\n        @click=\"selectValue(opt)\"\n      >\n        {{ opt.label }}\n      </Badge>\n    </div>\n  </FieldFrame>\n</template>\n"],"mappings":""}

package/dist/components/compositions/elements/option-select/ListOption.vue_vue_type_script_setup_true_lang.js

@@ -1,98 +0,0 @@
-import e from "../../../ui/badge/Badge.js";
-import "../../../ui/badge/index.js";
-import t from "../../../ui/field-frame/FieldFrame.js";
-import "../../../ui/field-frame/index.js";
-import { Fragment as n, computed as r, createBlock as i, createElementBlock as a, createElementVNode as o, createTextVNode as s, defineComponent as c, mergeModels as l, normalizeClass as u, openBlock as d, renderList as f, toDisplayString as p, unref as m, useModel as h, withCtx as g } from "vue";
-//#region src/components/compositions/elements/option-select/ListOption.vue?vue&type=script&setup=true&lang.ts
-var _ = ["data-element-name"], v = /* @__PURE__ */ c({
-	__name: "ListOption",
-	props: /* @__PURE__ */ l({
-		modelValue: {},
-		options: { default: () => [] },
-		id: {},
-		name: {},
-		label: {},
-		hideLabel: { type: Boolean },
-		required: { type: Boolean },
-		readonly: { type: Boolean },
-		disabled: { type: Boolean },
-		helpText: {},
-		errors: { default: () => [] },
-		clearable: { type: Boolean }
-	}, {
-		modelValue: {},
-		modelModifiers: {}
-	}),
-	emits: ["update:modelValue"],
-	setup(c) {
-		let l = c, v = h(c, "modelValue");
-		function y(e) {
-			return typeof e == "string" ? {
-				label: e,
-				value: e,
-				disabled: !1
-			} : {
-				label: e.label,
-				value: String(e.value),
-				disabled: !!e.disabled
-			};
-		}
-		let b = r(() => (l.options ?? []).map(y)), x = r(() => {
-			if (!(v.value === void 0 || v.value === null)) return String(v.value);
-		});
-		function S(e) {
-			return x.value === e;
-		}
-		function C(e) {
-			if (!(e.disabled || l.disabled || l.readonly)) {
-				if (x.value === e.value && l.clearable) {
-					v.value = null;
-					return;
-				}
-				v.value = e.value;
-			}
-		}
-		return (r, l) => (d(), i(m(t), {
-			label: c.label,
-			required: c.required,
-			"hide-label": c.hideLabel,
-			"help-text": c.helpText,
-			errors: c.errors
-		}, {
-			default: g(() => [o("div", {
-				class: "flex flex-wrap gap-2",
-				"data-element-name": c.name ?? void 0
-			}, [(d(!0), a(n, null, f(b.value, (t) => (d(), i(m(e), {
-				key: t.value,
-				as: "button",
-				type: "button",
-				variant: S(t.value) ? "default" : "outline",
-				size: "lg",
-				class: u(["cursor-pointer transition-colors", t.disabled || c.disabled || c.readonly ? "pointer-events-none opacity-50" : ""]),
-				"data-active": S(t.value),
-				"aria-pressed": S(t.value),
-				onClick: (e) => C(t)
-			}, {
-				default: g(() => [s(p(t.label), 1)]),
-				_: 2
-			}, 1032, [
-				"variant",
-				"class",
-				"data-active",
-				"aria-pressed",
-				"onClick"
-			]))), 128))], 8, _)]),
-			_: 1
-		}, 8, [
-			"label",
-			"required",
-			"hide-label",
-			"help-text",
-			"errors"
-		]));
-	}
-});
-//#endregion
-export { v as default };
-
-//# sourceMappingURL=ListOption.vue_vue_type_script_setup_true_lang.js.map

package/dist/components/compositions/elements/option-select/ListOption.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ListOption.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../../src/components/compositions/elements/option-select/ListOption.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven single-select chip list. Each option becomes a clickable\n * Badge. When `clearable` is true, re-clicking the active chip clears\n * the selection.\n *\n *   <ListOption v-model=\"status\" :options=\"[...]\" label=\"Status\" />\n */\nimport { computed } from \"vue\"\nimport type { SelectOptionLike } from \"@/definitions/shared/select-options\"\nimport { Badge } from \"@/components/ui/badge\"\nimport { FieldFrame } from \"@/components/ui/field-frame\"\n\nexport interface ListOptionProps {\n  modelValue?: string | number | null\n  options?: SelectOptionLike[]\n  id?: string\n  name?: string\n  label?: string\n  hideLabel?: boolean\n  required?: boolean\n  readonly?: boolean\n  disabled?: boolean\n  helpText?: string\n  errors?: string[]\n  clearable?: boolean\n}\n\nconst props = withDefaults(defineProps<ListOptionProps>(), {\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 currentValue = computed<string | undefined>(() => {\n  if (model.value === undefined || model.value === null) {\n    return undefined\n  }\n  return String(model.value)\n})\n\nfunction isActive(val: string): boolean {\n  return currentValue.value === val\n}\n\nfunction selectValue(opt: NormalisedOption): void {\n  if (opt.disabled || props.disabled || props.readonly) {\n    return\n  }\n  if (currentValue.value === opt.value && props.clearable) {\n    model.value = null\n    return\n  }\n  model.value = opt.value\n}\n</script>\n\n<template>\n  <FieldFrame\n    :label=\"label\"\n    :required=\"required\"\n    :hide-label=\"hideLabel\"\n    :help-text=\"helpText\"\n    :errors=\"errors\"\n  >\n    <div\n      class=\"flex flex-wrap gap-2\"\n      :data-element-name=\"name ?? undefined\"\n    >\n      <Badge\n        v-for=\"opt in normalised\"\n        :key=\"opt.value\"\n        as=\"button\"\n        type=\"button\"\n        :variant=\"isActive(opt.value) ? 'default' : 'outline'\"\n        size=\"lg\"\n        :class=\"[\n          'cursor-pointer transition-colors',\n          opt.disabled || disabled || readonly\n            ? 'pointer-events-none opacity-50'\n            : '',\n        ]\"\n        :data-active=\"isActive(opt.value)\"\n        :aria-pressed=\"isActive(opt.value)\"\n        @click=\"selectValue(opt)\"\n      >\n        {{ opt.label }}\n      </Badge>\n    </div>\n  </FieldFrame>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;EA4BA,IAAM,IAAQ,GAKR,IAAQ,EAAmC,GAAC,YAAY;EAQ9D,SAAS,EAAgB,GAAyC;GAIhE,OAHI,OAAO,KAAQ,WACV;IAAE,OAAO;IAAK,OAAO;IAAK,UAAU;GAAM,IAE5C;IACL,OAAO,EAAI;IACX,OAAO,OAAO,EAAI,KAAK;IACvB,UAAU,EAAQ,EAAI;GACxB;EACF;EAEA,IAAM,IAAa,SAChB,EAAM,WAAW,CAAC,GAAG,IAAI,CAAe,CAC3C,GAEM,IAAe,QAAmC;GAClD,QAAM,UAAU,KAAA,KAAa,EAAM,UAAU,OAGjD,OAAO,OAAO,EAAM,KAAK;EAC3B,CAAC;EAED,SAAS,EAAS,GAAsB;GACtC,OAAO,EAAa,UAAU;EAChC;EAEA,SAAS,EAAY,GAA6B;GAC5C,QAAI,YAAY,EAAM,YAAY,EAAM,WAG5C;QAAI,EAAa,UAAU,EAAI,SAAS,EAAM,WAAW;KACvD,EAAM,QAAQ;KACd;IACF;IACA,EAAM,QAAQ,EAAI;GADlB;EAEF;yBAIE,EA+Ba,EAAA,CAAA,GAAA;GA9BV,OAAO,EAAA;GACP,UAAU,EAAA;GACV,cAAY,EAAA;GACZ,aAAW,EAAA;GACX,QAAQ,EAAA;;oBAyBH,CAvBN,EAuBM,OAAA;IAtBJ,OAAM;IACL,qBAAmB,EAAA,QAAQ,KAAA;eAE5B,EAkBQ,GAAA,MAAA,EAjBQ,EAAA,QAAP,YADT,EAkBQ,EAAA,CAAA,GAAA;IAhBL,KAAK,EAAI;IACV,IAAG;IACH,MAAK;IACJ,SAAS,EAAS,EAAI,KAAK,IAAA,YAAA;IAC5B,MAAK;IACJ,OAAK,EAAA,CAAA,oCAA4D,EAAI,YAAY,EAAA,YAAY,EAAA,WAAA,mCAAA,EAAA,CAAA;IAM7F,eAAa,EAAS,EAAI,KAAK;IAC/B,gBAAc,EAAS,EAAI,KAAK;IAChC,UAAK,MAAE,EAAY,CAAG;;qBAER,CAAA,EAAA,EAAZ,EAAI,KAAK,GAAA,CAAA,CAAA,CAAA"}

package/dist/components/compositions/elements/option-select/PillSelectOption.js

@@ -1,7 +0,0 @@
-import e from "./PillSelectOption.vue_vue_type_script_setup_true_lang.js";
-//#region src/components/compositions/elements/option-select/PillSelectOption.vue
-var t = e;
-//#endregion
-export { t as default };
-
-//# sourceMappingURL=PillSelectOption.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"PillSelectOption.js","names":[],"sources":["../../../../../src/components/compositions/elements/option-select/PillSelectOption.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven multi-select pill composition. Each option becomes a\n * toggleable Badge with multi-select semantics.\n *\n *   <PillSelectOption v-model=\"tags\" :options=\"[...]\" label=\"Tags\" />\n */\nimport { computed } from \"vue\"\nimport type { SelectOptionLike } from \"@/definitions/shared/select-options\"\nimport { Badge } from \"@/components/ui/badge\"\nimport { FieldFrame } from \"@/components/ui/field-frame\"\n\nexport interface PillSelectOptionProps {\n  modelValue?: Array<string | number> | null\n  options?: SelectOptionLike[]\n  id?: string\n  name?: string\n  label?: string\n  hideLabel?: boolean\n  required?: boolean\n  readonly?: boolean\n  disabled?: boolean\n  helpText?: string\n  errors?: string[]\n}\n\nconst props = withDefaults(defineProps<PillSelectOptionProps>(), {\n  errors: () => [],\n  options: () => [],\n})\n\nconst model = defineModel<Array<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 selected = computed<string[]>(() => {\n  const v = model.value\n  if (!v) {\n    return []\n  }\n  if (Array.isArray(v)) {\n    return v.map((x) => String(x))\n  }\n  return [String(v)]\n})\n\nfunction isActive(val: string): boolean {\n  return selected.value.includes(val)\n}\n\nfunction togglePill(opt: NormalisedOption): void {\n  if (opt.disabled || props.disabled || props.readonly) {\n    return\n  }\n  const current = selected.value\n  if (current.includes(opt.value)) {\n    model.value = current.filter((v) => v !== opt.value)\n  } else {\n    model.value = [...current, opt.value]\n  }\n}\n</script>\n\n<template>\n  <FieldFrame\n    :label=\"label\"\n    :required=\"required\"\n    :hide-label=\"hideLabel\"\n    :help-text=\"helpText\"\n    :errors=\"errors\"\n  >\n    <div\n      class=\"flex flex-wrap gap-2\"\n      :data-element-name=\"name ?? undefined\"\n    >\n      <Badge\n        v-for=\"opt in normalised\"\n        :key=\"opt.value\"\n        as=\"button\"\n        type=\"button\"\n        :variant=\"isActive(opt.value) ? 'default' : 'outline'\"\n        size=\"lg\"\n        :class=\"[\n          'cursor-pointer transition-colors',\n          opt.disabled || disabled || readonly\n            ? 'pointer-events-none opacity-50'\n            : '',\n        ]\"\n        :data-active=\"isActive(opt.value)\"\n        :aria-pressed=\"isActive(opt.value)\"\n        @click=\"togglePill(opt)\"\n      >\n        {{ opt.label }}\n      </Badge>\n    </div>\n  </FieldFrame>\n</template>\n"],"mappings":""}

package/dist/components/compositions/elements/option-select/PillSelectOption.vue_vue_type_script_setup_true_lang.js

@@ -1,94 +0,0 @@
-import e from "../../../ui/badge/Badge.js";
-import "../../../ui/badge/index.js";
-import t from "../../../ui/field-frame/FieldFrame.js";
-import "../../../ui/field-frame/index.js";
-import { Fragment as n, computed as r, createBlock as i, createElementBlock as a, createElementVNode as o, createTextVNode as s, defineComponent as c, mergeModels as l, normalizeClass as u, openBlock as d, renderList as f, toDisplayString as p, unref as m, useModel as h, withCtx as g } from "vue";
-//#region src/components/compositions/elements/option-select/PillSelectOption.vue?vue&type=script&setup=true&lang.ts
-var _ = ["data-element-name"], v = /* @__PURE__ */ c({
-	__name: "PillSelectOption",
-	props: /* @__PURE__ */ l({
-		modelValue: {},
-		options: { default: () => [] },
-		id: {},
-		name: {},
-		label: {},
-		hideLabel: { type: Boolean },
-		required: { type: Boolean },
-		readonly: { type: Boolean },
-		disabled: { type: Boolean },
-		helpText: {},
-		errors: { default: () => [] }
-	}, {
-		modelValue: {},
-		modelModifiers: {}
-	}),
-	emits: ["update:modelValue"],
-	setup(c) {
-		let l = c, v = h(c, "modelValue");
-		function y(e) {
-			return typeof e == "string" ? {
-				label: e,
-				value: e,
-				disabled: !1
-			} : {
-				label: e.label,
-				value: String(e.value),
-				disabled: !!e.disabled
-			};
-		}
-		let b = r(() => (l.options ?? []).map(y)), x = r(() => {
-			let e = v.value;
-			return e ? Array.isArray(e) ? e.map((e) => String(e)) : [String(e)] : [];
-		});
-		function S(e) {
-			return x.value.includes(e);
-		}
-		function C(e) {
-			if (e.disabled || l.disabled || l.readonly) return;
-			let t = x.value;
-			t.includes(e.value) ? v.value = t.filter((t) => t !== e.value) : v.value = [...t, e.value];
-		}
-		return (r, l) => (d(), i(m(t), {
-			label: c.label,
-			required: c.required,
-			"hide-label": c.hideLabel,
-			"help-text": c.helpText,
-			errors: c.errors
-		}, {
-			default: g(() => [o("div", {
-				class: "flex flex-wrap gap-2",
-				"data-element-name": c.name ?? void 0
-			}, [(d(!0), a(n, null, f(b.value, (t) => (d(), i(m(e), {
-				key: t.value,
-				as: "button",
-				type: "button",
-				variant: S(t.value) ? "default" : "outline",
-				size: "lg",
-				class: u(["cursor-pointer transition-colors", t.disabled || c.disabled || c.readonly ? "pointer-events-none opacity-50" : ""]),
-				"data-active": S(t.value),
-				"aria-pressed": S(t.value),
-				onClick: (e) => C(t)
-			}, {
-				default: g(() => [s(p(t.label), 1)]),
-				_: 2
-			}, 1032, [
-				"variant",
-				"class",
-				"data-active",
-				"aria-pressed",
-				"onClick"
-			]))), 128))], 8, _)]),
-			_: 1
-		}, 8, [
-			"label",
-			"required",
-			"hide-label",
-			"help-text",
-			"errors"
-		]));
-	}
-});
-//#endregion
-export { v as default };
-
-//# sourceMappingURL=PillSelectOption.vue_vue_type_script_setup_true_lang.js.map