@treeui/vue 0.7.0 → 0.10.0

package/dist/components/TCard.vue_vue_type_script_setup_true_lang.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TCard.vue_vue_type_script_setup_true_lang.cjs","names":["$slots"],"sources":["../../src/components/TCard.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue';\nimport type { TCardVariant, TSize } from '../types/contracts';\n\nconst props = withDefaults(\n  defineProps<{\n    as?: string;\n    variant?: TCardVariant;\n    size?: TSize;\n    title?: string;\n  }>(),\n  {\n    as: 'section',\n    variant: 'outline',\n    size: 'md',\n    title: undefined,\n  },\n);\n\nconst classes = computed(() => [\n  't-card',\n  `t-card--${props.variant}`,\n  `t-card--${props.size}`,\n]);\n\nconst hasHeader = computed(() => !!props.title);\n</script>\n\n<template>\n  <component\n    :is=\"as\"\n    :class=\"classes\"\n  >\n    <header\n      v-if=\"$slots.header || hasHeader || $slots.actions\"\n      class=\"t-card__header\"\n    >\n      <slot name=\"header\">\n        <span\n          v-if=\"title\"\n          class=\"t-card__title\"\n        >\n          {{ title }}\n        </span>\n        <span\n          v-if=\"$slots.actions\"\n          class=\"t-card__actions\"\n        >\n          <slot name=\"actions\" />\n        </span>\n      </slot>\n    </header>\n    <div class=\"t-card__body\">\n      <slot />\n    </div>\n    <footer\n      v-if=\"$slots.footer\"\n      class=\"t-card__footer\"\n    >\n      <slot name=\"footer\" />\n    </footer>\n  </component>\n</template>\n"],"mappings":"6UAIA,IAAM,EAAQ,EAeR,GAAA,EAAA,EAAA,SAAA,KAAyB,CAC7B,SACA,WAAW,EAAM,UACjB,WAAW,EAAM,MACnB,CAAC,EAEK,GAAA,EAAA,EAAA,SAAA,KAA2B,CAAC,CAAC,EAAM,KAAK,kFAKrC,EAAA,EAAE,EAAA,CACN,OAAA,EAAA,EAAA,eAAA,CAAO,EAAA,KAAO,CAAA,EAAA,2BAoBN,CAjBDA,EAAAA,OAAO,QAAU,EAAA,OAAaA,EAAAA,OAAO,UAAA,EAAA,EAAA,UAAA,CAAA,GAAA,EAAA,EAAA,mBAAA,CAiBpC,SAlBT,EAkBS,EAAA,EAAA,EAAA,WAAA,CADA,EAAA,OAAA,SAAA,CAAA,MAAA,CAXG,EAAA,QAAA,EAAA,EAAA,UAAA,CAAA,GAAA,EAAA,EAAA,mBAAA,CAID,OALP,GAAA,EAAA,EAAA,gBAAA,CAIK,EAAA,KAAK,EAAA,CAAA,IAAA,EAAA,EAAA,mBAAA,CAAA,GAAA,EAAA,EAGFA,EAAAA,OAAO,UAAA,EAAA,EAAA,UAAA,CAAA,GAAA,EAAA,EAAA,mBAAA,CAIR,OALP,EAKO,EAAA,EAAA,EAAA,WAAA,CADkB,EAAA,OAAA,SAAA,CAAA,CAAA,IAAA,EAAA,EAAA,mBAAA,CAAA,GAAA,EAAA,CAAA,CAAA,CAAA,CAAA,IAAA,EAAA,EAAA,mBAAA,CAAA,GAAA,EAAA,2BAMvB,MAFN,EAEM,EAAA,EAAA,EAAA,WAAA,CADI,EAAA,OAAA,SAAA,CAAA,CAAA,EAGFA,EAAAA,OAAO,SAAA,EAAA,EAAA,UAAA,CAAA,GAAA,EAAA,EAAA,mBAAA,CAIN,SALT,EAKS,EAAA,EAAA,EAAA,WAAA,CADe,EAAA,OAAA,QAAA,CAAA,CAAA,IAAA,EAAA,EAAA,mBAAA,CAAA,GAAA,EAAA"}

package/dist/components/TCard.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,42 @@
+import { computed as e, createBlock as t, createCommentVNode as n, createElementBlock as r, createElementVNode as i, defineComponent as a, normalizeClass as o, openBlock as s, renderSlot as c, resolveDynamicComponent as l, toDisplayString as u, withCtx as d } from "vue";
+//#region src/components/TCard.vue?vue&type=script&setup=true&lang.ts
+var f = {
+	key: 0,
+	class: "t-card__header"
+}, p = {
+	key: 0,
+	class: "t-card__title"
+}, m = {
+	key: 1,
+	class: "t-card__actions"
+}, h = { class: "t-card__body" }, g = {
+	key: 1,
+	class: "t-card__footer"
+}, _ = /*@__PURE__*/ a({
+	__name: "TCard",
+	props: {
+		as: { default: "section" },
+		variant: { default: "outline" },
+		size: { default: "md" },
+		title: { default: void 0 }
+	},
+	setup(a) {
+		let _ = a, v = e(() => [
+			"t-card",
+			`t-card--${_.variant}`,
+			`t-card--${_.size}`
+		]), y = e(() => !!_.title);
+		return (e, _) => (s(), t(l(a.as), { class: o(v.value) }, {
+			default: d(() => [
+				e.$slots.header || y.value || e.$slots.actions ? (s(), r("header", f, [c(e.$slots, "header", {}, () => [a.title ? (s(), r("span", p, u(a.title), 1)) : n("", !0), e.$slots.actions ? (s(), r("span", m, [c(e.$slots, "actions")])) : n("", !0)])])) : n("", !0),
+				i("div", h, [c(e.$slots, "default")]),
+				e.$slots.footer ? (s(), r("footer", g, [c(e.$slots, "footer")])) : n("", !0)
+			]),
+			_: 3
+		}, 8, ["class"]));
+	}
+});
+//#endregion
+export { _ as default };
+
+//# sourceMappingURL=TCard.vue_vue_type_script_setup_true_lang.js.map

package/dist/components/TCard.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TCard.vue_vue_type_script_setup_true_lang.js","names":["$slots"],"sources":["../../src/components/TCard.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue';\nimport type { TCardVariant, TSize } from '../types/contracts';\n\nconst props = withDefaults(\n  defineProps<{\n    as?: string;\n    variant?: TCardVariant;\n    size?: TSize;\n    title?: string;\n  }>(),\n  {\n    as: 'section',\n    variant: 'outline',\n    size: 'md',\n    title: undefined,\n  },\n);\n\nconst classes = computed(() => [\n  't-card',\n  `t-card--${props.variant}`,\n  `t-card--${props.size}`,\n]);\n\nconst hasHeader = computed(() => !!props.title);\n</script>\n\n<template>\n  <component\n    :is=\"as\"\n    :class=\"classes\"\n  >\n    <header\n      v-if=\"$slots.header || hasHeader || $slots.actions\"\n      class=\"t-card__header\"\n    >\n      <slot name=\"header\">\n        <span\n          v-if=\"title\"\n          class=\"t-card__title\"\n        >\n          {{ title }}\n        </span>\n        <span\n          v-if=\"$slots.actions\"\n          class=\"t-card__actions\"\n        >\n          <slot name=\"actions\" />\n        </span>\n      </slot>\n    </header>\n    <div class=\"t-card__body\">\n      <slot />\n    </div>\n    <footer\n      v-if=\"$slots.footer\"\n      class=\"t-card__footer\"\n    >\n      <slot name=\"footer\" />\n    </footer>\n  </component>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;EAIA,IAAM,IAAQ,GAeR,IAAU,QAAe;GAC7B;GACA,WAAW,EAAM;GACjB,WAAW,EAAM;EACnB,CAAC,GAEK,IAAY,QAAe,CAAC,CAAC,EAAM,KAAK;yBAI5C,EAgCY,EA/BL,EAAA,EAAE,GAAA,EACN,OAAK,EAAE,EAAA,KAAO,EAAA,GAAA;oBAoBN;IAjBDA,EAAAA,OAAO,UAAU,EAAA,SAAaA,EAAAA,OAAO,WAAA,EAAA,GAD7C,EAkBS,UAlBT,GAkBS,CAdP,EAaO,EAAA,QAAA,UAAA,CAAA,SAAA,CAXG,EAAA,SAAA,EAAA,GADR,EAKO,QALP,GAKO,EADF,EAAA,KAAK,GAAA,CAAA,KAAA,EAAA,IAAA,EAAA,GAGFA,EAAAA,OAAO,WAAA,EAAA,GADf,EAKO,QALP,GAKO,CADL,EAAuB,EAAA,QAAA,SAAA,CAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,CAAA,CAAA,CAAA,KAAA,EAAA,IAAA,EAAA;IAI7B,EAEM,OAFN,GAEM,CADJ,EAAQ,EAAA,QAAA,SAAA,CAAA,CAAA;IAGFA,EAAAA,OAAO,UAAA,EAAA,GADf,EAKS,UALT,GAKS,CADP,EAAsB,EAAA,QAAA,QAAA,CAAA,CAAA,KAAA,EAAA,IAAA,EAAA"}

package/dist/components/TCheckbox.cjs

@@ -0,0 +1,2 @@
+var e=require("./TCheckbox.vue_vue_type_script_setup_true_lang.cjs").default;exports.default=e;
+//# sourceMappingURL=TCheckbox.cjs.map

package/dist/components/TCheckbox.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TCheckbox.cjs","names":[],"sources":["../../src/components/TCheckbox.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, useAttrs, watch } from 'vue';\nimport type { TSize } from '../types/contracts';\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue?: boolean;\n    size?: TSize;\n    disabled?: boolean;\n    indeterminate?: boolean;\n    invalid?: boolean;\n  }>(),\n  {\n    modelValue: false,\n    size: 'md',\n    disabled: false,\n    indeterminate: false,\n    invalid: false,\n  },\n);\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: boolean];\n}>();\n\nconst attrs = useAttrs();\nconst inputRef = ref<HTMLInputElement | null>(null);\n\nwatch(\n  () => props.indeterminate,\n  (val) => {\n    if (inputRef.value) {\n      inputRef.value.indeterminate = val;\n    }\n  },\n);\n\nwatch(inputRef, (el) => {\n  if (el) {\n    el.indeterminate = props.indeterminate;\n  }\n});\n\nconst rootClasses = computed(() => [\n  't-checkbox',\n  `t-checkbox--${props.size}`,\n  {\n    'is-checked': props.modelValue,\n    'is-indeterminate': props.indeterminate,\n    'is-disabled': props.disabled,\n    'is-invalid': props.invalid,\n  },\n  attrs.class,\n]);\n\nconst rootStyle = computed(() => attrs.style);\n\nconst inputAttrs = computed(() => {\n  const { class: _class, style: _style, ...rest } = attrs;\n  return rest;\n});\n\nconst onChange = () => {\n  emit('update:modelValue', !props.modelValue);\n};\n</script>\n\n<template>\n  <label\n    :class=\"rootClasses\"\n    :style=\"rootStyle\"\n  >\n    <input\n      ref=\"inputRef\"\n      v-bind=\"inputAttrs\"\n      type=\"checkbox\"\n      class=\"t-checkbox__input\"\n      :checked=\"modelValue\"\n      :disabled=\"disabled\"\n      :aria-checked=\"indeterminate ? 'mixed' : modelValue\"\n      :aria-invalid=\"invalid || undefined\"\n      @change=\"onChange\"\n    >\n    <span\n      class=\"t-checkbox__control\"\n      aria-hidden=\"true\"\n    >\n      <svg\n        v-if=\"modelValue && !indeterminate\"\n        class=\"t-checkbox__icon\"\n        viewBox=\"0 0 16 16\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n      >\n        <polyline points=\"3.5 8.5 6.5 11.5 12.5 4.5\" />\n      </svg>\n      <svg\n        v-else-if=\"indeterminate\"\n        class=\"t-checkbox__icon\"\n        viewBox=\"0 0 16 16\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n      >\n        <line\n          x1=\"4\"\n          y1=\"8\"\n          x2=\"12\"\n          y2=\"8\"\n        />\n      </svg>\n    </span>\n    <span\n      v-if=\"$slots.default\"\n      class=\"t-checkbox__label\"\n    >\n      <slot />\n    </span>\n  </label>\n</template>\n"],"mappings":""}

package/dist/components/TCheckbox.js

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

package/dist/components/TCheckbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TCheckbox.js","names":[],"sources":["../../src/components/TCheckbox.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, useAttrs, watch } from 'vue';\nimport type { TSize } from '../types/contracts';\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue?: boolean;\n    size?: TSize;\n    disabled?: boolean;\n    indeterminate?: boolean;\n    invalid?: boolean;\n  }>(),\n  {\n    modelValue: false,\n    size: 'md',\n    disabled: false,\n    indeterminate: false,\n    invalid: false,\n  },\n);\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: boolean];\n}>();\n\nconst attrs = useAttrs();\nconst inputRef = ref<HTMLInputElement | null>(null);\n\nwatch(\n  () => props.indeterminate,\n  (val) => {\n    if (inputRef.value) {\n      inputRef.value.indeterminate = val;\n    }\n  },\n);\n\nwatch(inputRef, (el) => {\n  if (el) {\n    el.indeterminate = props.indeterminate;\n  }\n});\n\nconst rootClasses = computed(() => [\n  't-checkbox',\n  `t-checkbox--${props.size}`,\n  {\n    'is-checked': props.modelValue,\n    'is-indeterminate': props.indeterminate,\n    'is-disabled': props.disabled,\n    'is-invalid': props.invalid,\n  },\n  attrs.class,\n]);\n\nconst rootStyle = computed(() => attrs.style);\n\nconst inputAttrs = computed(() => {\n  const { class: _class, style: _style, ...rest } = attrs;\n  return rest;\n});\n\nconst onChange = () => {\n  emit('update:modelValue', !props.modelValue);\n};\n</script>\n\n<template>\n  <label\n    :class=\"rootClasses\"\n    :style=\"rootStyle\"\n  >\n    <input\n      ref=\"inputRef\"\n      v-bind=\"inputAttrs\"\n      type=\"checkbox\"\n      class=\"t-checkbox__input\"\n      :checked=\"modelValue\"\n      :disabled=\"disabled\"\n      :aria-checked=\"indeterminate ? 'mixed' : modelValue\"\n      :aria-invalid=\"invalid || undefined\"\n      @change=\"onChange\"\n    >\n    <span\n      class=\"t-checkbox__control\"\n      aria-hidden=\"true\"\n    >\n      <svg\n        v-if=\"modelValue && !indeterminate\"\n        class=\"t-checkbox__icon\"\n        viewBox=\"0 0 16 16\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n      >\n        <polyline points=\"3.5 8.5 6.5 11.5 12.5 4.5\" />\n      </svg>\n      <svg\n        v-else-if=\"indeterminate\"\n        class=\"t-checkbox__icon\"\n        viewBox=\"0 0 16 16\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n      >\n        <line\n          x1=\"4\"\n          y1=\"8\"\n          x2=\"12\"\n          y2=\"8\"\n        />\n      </svg>\n    </span>\n    <span\n      v-if=\"$slots.default\"\n      class=\"t-checkbox__label\"\n    >\n      <slot />\n    </span>\n  </label>\n</template>\n"],"mappings":""}

package/dist/components/{TreeCheckbox.vue.d.ts → TCheckbox.vue.d.ts}

@@ -1,7 +1,7 @@
-import { TreeSize } from '../types/contracts';
+import { TSize } from '../types/contracts';
 type __VLS_Props = {
     modelValue?: boolean;
-    size?: TreeSize;
+    size?: TSize;
     disabled?: boolean;
     indeterminate?: boolean;
     invalid?: boolean;
@@ -24,7 +24,7 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}
 }>, {
     modelValue: boolean;
     disabled: boolean;
-    size: TreeSize;
+    size: TSize;
     indeterminate: boolean;
     invalid: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
@@ -37,4 +37,4 @@ type __VLS_WithTemplateSlots<T, S> = T & {
         $slots: S;
     };
 };
-//# sourceMappingURL=TreeCheckbox.vue.d.ts.map
+//# sourceMappingURL=TCheckbox.vue.d.ts.map

package/dist/components/TCheckbox.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TCheckbox.vue.d.ts","sourceRoot":"","sources":["../../src/components/TCheckbox.vue"],"names":[],"mappings":"AAmIA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAMhD,KAAK,WAAW,GAAG;IACf,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAmEJ,iBAAS,cAAc;WA8ET,OAAO,IAA6B;;yBAXrB,GAAG;;;;;;EAgB/B;AAeD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;gBA3KJ,OAAO;cAET,OAAO;UADX,KAAK;mBAEI,OAAO;aACb,OAAO;;;OAgLnB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

package/dist/components/TCheckbox.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1,2 @@
+let e=require("vue");var t=[`checked`,`disabled`,`aria-checked`,`aria-invalid`],n={class:`t-checkbox__control`,"aria-hidden":`true`},r={key:0,class:`t-checkbox__icon`,viewBox:`0 0 16 16`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`,"stroke-linejoin":`round`},i={key:1,class:`t-checkbox__icon`,viewBox:`0 0 16 16`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`},a={key:0,class:`t-checkbox__label`},o=(0,e.defineComponent)({inheritAttrs:!1,__name:`TCheckbox`,props:{modelValue:{type:Boolean,default:!1},size:{default:`md`},disabled:{type:Boolean,default:!1},indeterminate:{type:Boolean,default:!1},invalid:{type:Boolean,default:!1}},emits:[`update:modelValue`],setup(o,{emit:s}){let c=o,l=s,u=(0,e.useAttrs)(),d=(0,e.ref)(null);(0,e.watch)(()=>c.indeterminate,e=>{d.value&&(d.value.indeterminate=e)}),(0,e.watch)(d,e=>{e&&(e.indeterminate=c.indeterminate)});let f=(0,e.computed)(()=>[`t-checkbox`,`t-checkbox--${c.size}`,{"is-checked":c.modelValue,"is-indeterminate":c.indeterminate,"is-disabled":c.disabled,"is-invalid":c.invalid},u.class]),p=(0,e.computed)(()=>u.style),m=(0,e.computed)(()=>{let{class:e,style:t,...n}=u;return n}),h=()=>{l(`update:modelValue`,!c.modelValue)};return(s,c)=>((0,e.openBlock)(),(0,e.createElementBlock)(`label`,{class:(0,e.normalizeClass)(f.value),style:(0,e.normalizeStyle)(p.value)},[(0,e.createElementVNode)(`input`,(0,e.mergeProps)({ref_key:`inputRef`,ref:d},m.value,{type:`checkbox`,class:`t-checkbox__input`,checked:o.modelValue,disabled:o.disabled,"aria-checked":o.indeterminate?`mixed`:o.modelValue,"aria-invalid":o.invalid||void 0,onChange:h}),null,16,t),(0,e.createElementVNode)(`span`,n,[o.modelValue&&!o.indeterminate?((0,e.openBlock)(),(0,e.createElementBlock)(`svg`,r,[...c[0]||=[(0,e.createElementVNode)(`polyline`,{points:`3.5 8.5 6.5 11.5 12.5 4.5`},null,-1)]])):o.indeterminate?((0,e.openBlock)(),(0,e.createElementBlock)(`svg`,i,[...c[1]||=[(0,e.createElementVNode)(`line`,{x1:`4`,y1:`8`,x2:`12`,y2:`8`},null,-1)]])):(0,e.createCommentVNode)(``,!0)]),s.$slots.default?((0,e.openBlock)(),(0,e.createElementBlock)(`span`,a,[(0,e.renderSlot)(s.$slots,`default`)])):(0,e.createCommentVNode)(``,!0)],6))}});exports.default=o;
+//# sourceMappingURL=TCheckbox.vue_vue_type_script_setup_true_lang.cjs.map

package/dist/components/TCheckbox.vue_vue_type_script_setup_true_lang.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TCheckbox.vue_vue_type_script_setup_true_lang.cjs","names":["$slots"],"sources":["../../src/components/TCheckbox.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, useAttrs, watch } from 'vue';\nimport type { TSize } from '../types/contracts';\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue?: boolean;\n    size?: TSize;\n    disabled?: boolean;\n    indeterminate?: boolean;\n    invalid?: boolean;\n  }>(),\n  {\n    modelValue: false,\n    size: 'md',\n    disabled: false,\n    indeterminate: false,\n    invalid: false,\n  },\n);\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: boolean];\n}>();\n\nconst attrs = useAttrs();\nconst inputRef = ref<HTMLInputElement | null>(null);\n\nwatch(\n  () => props.indeterminate,\n  (val) => {\n    if (inputRef.value) {\n      inputRef.value.indeterminate = val;\n    }\n  },\n);\n\nwatch(inputRef, (el) => {\n  if (el) {\n    el.indeterminate = props.indeterminate;\n  }\n});\n\nconst rootClasses = computed(() => [\n  't-checkbox',\n  `t-checkbox--${props.size}`,\n  {\n    'is-checked': props.modelValue,\n    'is-indeterminate': props.indeterminate,\n    'is-disabled': props.disabled,\n    'is-invalid': props.invalid,\n  },\n  attrs.class,\n]);\n\nconst rootStyle = computed(() => attrs.style);\n\nconst inputAttrs = computed(() => {\n  const { class: _class, style: _style, ...rest } = attrs;\n  return rest;\n});\n\nconst onChange = () => {\n  emit('update:modelValue', !props.modelValue);\n};\n</script>\n\n<template>\n  <label\n    :class=\"rootClasses\"\n    :style=\"rootStyle\"\n  >\n    <input\n      ref=\"inputRef\"\n      v-bind=\"inputAttrs\"\n      type=\"checkbox\"\n      class=\"t-checkbox__input\"\n      :checked=\"modelValue\"\n      :disabled=\"disabled\"\n      :aria-checked=\"indeterminate ? 'mixed' : modelValue\"\n      :aria-invalid=\"invalid || undefined\"\n      @change=\"onChange\"\n    >\n    <span\n      class=\"t-checkbox__control\"\n      aria-hidden=\"true\"\n    >\n      <svg\n        v-if=\"modelValue && !indeterminate\"\n        class=\"t-checkbox__icon\"\n        viewBox=\"0 0 16 16\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n      >\n        <polyline points=\"3.5 8.5 6.5 11.5 12.5 4.5\" />\n      </svg>\n      <svg\n        v-else-if=\"indeterminate\"\n        class=\"t-checkbox__icon\"\n        viewBox=\"0 0 16 16\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n      >\n        <line\n          x1=\"4\"\n          y1=\"8\"\n          x2=\"12\"\n          y2=\"8\"\n        />\n      </svg>\n    </span>\n    <span\n      v-if=\"$slots.default\"\n      class=\"t-checkbox__label\"\n    >\n      <slot />\n    </span>\n  </label>\n</template>\n"],"mappings":"quBAQA,IAAM,EAAQ,EAiBR,EAAO,EAIP,GAAA,EAAA,EAAA,SAAA,CAAiB,EACjB,GAAA,EAAA,EAAA,IAAA,CAAwC,IAAI,GAElD,EAAA,EAAA,MAAA,KACQ,EAAM,cACX,GAAQ,CACH,EAAS,QACX,EAAS,MAAM,cAAgB,EAEnC,CACF,GAEA,EAAA,EAAA,MAAA,CAAM,EAAW,GAAO,CAClB,IACF,EAAG,cAAgB,EAAM,cAE7B,CAAC,EAED,IAAM,GAAA,EAAA,EAAA,SAAA,KAA6B,CACjC,aACA,eAAe,EAAM,OACrB,CACE,aAAc,EAAM,WACpB,mBAAoB,EAAM,cAC1B,cAAe,EAAM,SACrB,aAAc,EAAM,OACtB,EACA,EAAM,KACR,CAAC,EAEK,GAAA,EAAA,EAAA,SAAA,KAA2B,EAAM,KAAK,EAEtC,GAAA,EAAA,EAAA,SAAA,KAA4B,CAChC,GAAM,CAAE,MAAO,EAAQ,MAAO,EAAQ,GAAG,GAAS,EAClD,OAAO,CACT,CAAC,EAEK,MAAiB,CACrB,EAAK,oBAAqB,CAAC,EAAM,UAAU,CAC7C,2DA0DU,QAAA,CArDL,OAAA,EAAA,EAAA,eAAA,CAAO,EAAA,KAAW,EAClB,OAAA,EAAA,EAAA,eAAA,CAAO,EAAA,KAAS,6BAYhB,SAAA,EAAA,EAAA,WAAA,CAAA,SATK,WAAJ,IAAI,GACI,EAAA,MAAU,CAClB,KAAK,WACL,MAAM,oBACL,QAAS,EAAA,WACT,SAAU,EAAA,SACV,eAAc,EAAA,cAAa,QAAa,EAAA,WACxC,eAAc,EAAA,SAAW,IAAA,GACjB,iDAkCJ,OAhCP,EAgCO,CA3BG,EAAA,YAAU,CAAK,EAAA,gBAAA,EAAA,EAAA,UAAA,CAAA,GAAA,EAAA,EAAA,mBAAA,CAUjB,MAXN,EAWM,CAAA,GAAA,AAAA,EAAA,KAAA,EAAA,EAAA,EAAA,mBAAA,CAD2C,WAAA,CAArC,OAAO,2BAA2B,EAAA,KAAA,EAAA,CAAA,CAAA,CAAA,GAGjC,EAAA,gBAAA,EAAA,EAAA,UAAA,CAAA,GAAA,EAAA,EAAA,mBAAA,CAcP,MAfN,EAeM,CAAA,GAAA,AAAA,EAAA,KAAA,EAAA,EAAA,EAAA,mBAAA,CADF,OAAA,CAJA,GAAG,IACH,GAAG,IACH,GAAG,KACH,GAAG,oDAKDA,EAAAA,OAAO,UAAA,EAAA,EAAA,UAAA,CAAA,GAAA,EAAA,EAAA,mBAAA,CAIR,OALP,EAKO,EAAA,EAAA,EAAA,WAAA,CADG,EAAA,OAAA,SAAA,CAAA,CAAA,IAAA,EAAA,EAAA,mBAAA,CAAA,GAAA,EAAA"}

package/dist/components/TCheckbox.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,106 @@
+import { computed as e, createCommentVNode as t, createElementBlock as n, createElementVNode as r, defineComponent as i, mergeProps as a, normalizeClass as o, normalizeStyle as s, openBlock as c, ref as l, renderSlot as u, useAttrs as d, watch as f } from "vue";
+//#region src/components/TCheckbox.vue?vue&type=script&setup=true&lang.ts
+var p = [
+	"checked",
+	"disabled",
+	"aria-checked",
+	"aria-invalid"
+], m = {
+	class: "t-checkbox__control",
+	"aria-hidden": "true"
+}, h = {
+	key: 0,
+	class: "t-checkbox__icon",
+	viewBox: "0 0 16 16",
+	fill: "none",
+	stroke: "currentColor",
+	"stroke-width": "2",
+	"stroke-linecap": "round",
+	"stroke-linejoin": "round"
+}, g = {
+	key: 1,
+	class: "t-checkbox__icon",
+	viewBox: "0 0 16 16",
+	fill: "none",
+	stroke: "currentColor",
+	"stroke-width": "2",
+	"stroke-linecap": "round"
+}, _ = {
+	key: 0,
+	class: "t-checkbox__label"
+}, v = /*@__PURE__*/ i({
+	inheritAttrs: !1,
+	__name: "TCheckbox",
+	props: {
+		modelValue: {
+			type: Boolean,
+			default: !1
+		},
+		size: { default: "md" },
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		indeterminate: {
+			type: Boolean,
+			default: !1
+		},
+		invalid: {
+			type: Boolean,
+			default: !1
+		}
+	},
+	emits: ["update:modelValue"],
+	setup(i, { emit: v }) {
+		let y = i, b = v, x = d(), S = l(null);
+		f(() => y.indeterminate, (e) => {
+			S.value && (S.value.indeterminate = e);
+		}), f(S, (e) => {
+			e && (e.indeterminate = y.indeterminate);
+		});
+		let C = e(() => [
+			"t-checkbox",
+			`t-checkbox--${y.size}`,
+			{
+				"is-checked": y.modelValue,
+				"is-indeterminate": y.indeterminate,
+				"is-disabled": y.disabled,
+				"is-invalid": y.invalid
+			},
+			x.class
+		]), w = e(() => x.style), T = e(() => {
+			let { class: e, style: t, ...n } = x;
+			return n;
+		}), E = () => {
+			b("update:modelValue", !y.modelValue);
+		};
+		return (e, l) => (c(), n("label", {
+			class: o(C.value),
+			style: s(w.value)
+		}, [
+			r("input", a({
+				ref_key: "inputRef",
+				ref: S
+			}, T.value, {
+				type: "checkbox",
+				class: "t-checkbox__input",
+				checked: i.modelValue,
+				disabled: i.disabled,
+				"aria-checked": i.indeterminate ? "mixed" : i.modelValue,
+				"aria-invalid": i.invalid || void 0,
+				onChange: E
+			}), null, 16, p),
+			r("span", m, [i.modelValue && !i.indeterminate ? (c(), n("svg", h, [...l[0] ||= [r("polyline", { points: "3.5 8.5 6.5 11.5 12.5 4.5" }, null, -1)]])) : i.indeterminate ? (c(), n("svg", g, [...l[1] ||= [r("line", {
+				x1: "4",
+				y1: "8",
+				x2: "12",
+				y2: "8"
+			}, null, -1)]])) : t("", !0)]),
+			e.$slots.default ? (c(), n("span", _, [u(e.$slots, "default")])) : t("", !0)
+		], 6));
+	}
+});
+//#endregion
+export { v as default };
+
+//# sourceMappingURL=TCheckbox.vue_vue_type_script_setup_true_lang.js.map

package/dist/components/TCheckbox.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TCheckbox.vue_vue_type_script_setup_true_lang.js","names":["$slots"],"sources":["../../src/components/TCheckbox.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, useAttrs, watch } from 'vue';\nimport type { TSize } from '../types/contracts';\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue?: boolean;\n    size?: TSize;\n    disabled?: boolean;\n    indeterminate?: boolean;\n    invalid?: boolean;\n  }>(),\n  {\n    modelValue: false,\n    size: 'md',\n    disabled: false,\n    indeterminate: false,\n    invalid: false,\n  },\n);\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: boolean];\n}>();\n\nconst attrs = useAttrs();\nconst inputRef = ref<HTMLInputElement | null>(null);\n\nwatch(\n  () => props.indeterminate,\n  (val) => {\n    if (inputRef.value) {\n      inputRef.value.indeterminate = val;\n    }\n  },\n);\n\nwatch(inputRef, (el) => {\n  if (el) {\n    el.indeterminate = props.indeterminate;\n  }\n});\n\nconst rootClasses = computed(() => [\n  't-checkbox',\n  `t-checkbox--${props.size}`,\n  {\n    'is-checked': props.modelValue,\n    'is-indeterminate': props.indeterminate,\n    'is-disabled': props.disabled,\n    'is-invalid': props.invalid,\n  },\n  attrs.class,\n]);\n\nconst rootStyle = computed(() => attrs.style);\n\nconst inputAttrs = computed(() => {\n  const { class: _class, style: _style, ...rest } = attrs;\n  return rest;\n});\n\nconst onChange = () => {\n  emit('update:modelValue', !props.modelValue);\n};\n</script>\n\n<template>\n  <label\n    :class=\"rootClasses\"\n    :style=\"rootStyle\"\n  >\n    <input\n      ref=\"inputRef\"\n      v-bind=\"inputAttrs\"\n      type=\"checkbox\"\n      class=\"t-checkbox__input\"\n      :checked=\"modelValue\"\n      :disabled=\"disabled\"\n      :aria-checked=\"indeterminate ? 'mixed' : modelValue\"\n      :aria-invalid=\"invalid || undefined\"\n      @change=\"onChange\"\n    >\n    <span\n      class=\"t-checkbox__control\"\n      aria-hidden=\"true\"\n    >\n      <svg\n        v-if=\"modelValue && !indeterminate\"\n        class=\"t-checkbox__icon\"\n        viewBox=\"0 0 16 16\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n      >\n        <polyline points=\"3.5 8.5 6.5 11.5 12.5 4.5\" />\n      </svg>\n      <svg\n        v-else-if=\"indeterminate\"\n        class=\"t-checkbox__icon\"\n        viewBox=\"0 0 16 16\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n      >\n        <line\n          x1=\"4\"\n          y1=\"8\"\n          x2=\"12\"\n          y2=\"8\"\n        />\n      </svg>\n    </span>\n    <span\n      v-if=\"$slots.default\"\n      class=\"t-checkbox__label\"\n    >\n      <slot />\n    </span>\n  </label>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAQA,IAAM,IAAQ,GAiBR,IAAO,GAIP,IAAQ,EAAS,GACjB,IAAW,EAA6B,IAAI;EAWlD,AATA,QACQ,EAAM,gBACX,MAAQ;GACP,AAAI,EAAS,UACX,EAAS,MAAM,gBAAgB;EAEnC,CACF,GAEA,EAAM,IAAW,MAAO;GACtB,AAAI,MACF,EAAG,gBAAgB,EAAM;EAE7B,CAAC;EAED,IAAM,IAAc,QAAe;GACjC;GACA,eAAe,EAAM;GACrB;IACE,cAAc,EAAM;IACpB,oBAAoB,EAAM;IAC1B,eAAe,EAAM;IACrB,cAAc,EAAM;GACtB;GACA,EAAM;EACR,CAAC,GAEK,IAAY,QAAe,EAAM,KAAK,GAEtC,IAAa,QAAe;GAChC,IAAM,EAAE,OAAO,GAAQ,OAAO,GAAQ,GAAG,MAAS;GAClD,OAAO;EACT,CAAC,GAEK,UAAiB;GACrB,EAAK,qBAAqB,CAAC,EAAM,UAAU;EAC7C;yBAIE,EAsDQ,SAAA;GArDL,OAAK,EAAE,EAAA,KAAW;GAClB,OAAK,EAAE,EAAA,KAAS;;GAEjB,EAUC,SAVD,EAUC;aATK;IAAJ,KAAI;MACI,EAAA,OAAU;IAClB,MAAK;IACL,OAAM;IACL,SAAS,EAAA;IACT,UAAU,EAAA;IACV,gBAAc,EAAA,gBAAa,UAAa,EAAA;IACxC,gBAAc,EAAA,WAAW,KAAA;IACjB;;GAEX,EAgCO,QAhCP,GAgCO,CA3BG,EAAA,cAAU,CAAK,EAAA,iBAAA,EAAA,GADvB,EAWM,OAXN,GAWM,CAAA,GAAA,AAAA,EAAA,OAAA,CADJ,EAA+C,YAAA,EAArC,QAAO,4BAA2B,GAAA,MAAA,EAAA,CAAA,CAAA,CAAA,KAGjC,EAAA,iBAAA,EAAA,GADb,EAeM,OAfN,GAeM,CAAA,GAAA,AAAA,EAAA,OAAA,CANJ,EAKE,QAAA;IAJA,IAAG;IACH,IAAG;IACH,IAAG;IACH,IAAG;;GAKDA,EAAAA,OAAO,WAAA,EAAA,GADf,EAKO,QALP,GAKO,CADL,EAAQ,EAAA,QAAA,SAAA,CAAA,CAAA,KAAA,EAAA,IAAA,EAAA"}

package/dist/components/TCombobox.cjs

@@ -0,0 +1,2 @@
+var e=require("./TCombobox.vue_vue_type_script_setup_true_lang.cjs").default;exports.default=e;
+//# sourceMappingURL=TCombobox.cjs.map

package/dist/components/TCombobox.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TCombobox.cjs","names":[],"sources":["../../src/components/TCombobox.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { createId, isEscapeKey } from '@treeui/utils';\nimport { computed, onBeforeUnmount, ref, toRef, useAttrs, watch } from 'vue';\nimport { useControllableOpen } from '../composables/useControllableOpen';\nimport type { TSize } from '../types/contracts';\nimport TSpinner from './TSpinner.vue';\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nexport interface TComboboxOption {\n  label: string;\n  value: string;\n  description?: string;\n  keywords?: string[];\n  disabled?: boolean;\n}\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue?: string;\n    options?: TComboboxOption[];\n    open?: boolean;\n    defaultOpen?: boolean;\n    size?: TSize;\n    disabled?: boolean;\n    loading?: boolean;\n    invalid?: boolean;\n    placeholder?: string;\n    emptyText?: string;\n  }>(),\n  {\n    modelValue: '',\n    options: () => [],\n    open: undefined,\n    defaultOpen: false,\n    size: 'md',\n    disabled: false,\n    loading: false,\n    invalid: false,\n    placeholder: '',\n    emptyText: 'No results found.',\n  },\n);\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string];\n  'update:open': [value: boolean];\n  'open-change': [value: boolean];\n  'input-change': [value: string];\n}>();\n\ndefineSlots<{\n  prefix?: () => unknown;\n  option?: (props: {\n    option: TComboboxOption;\n    selected: boolean;\n    active: boolean;\n  }) => unknown;\n  empty?: (props: { query: string }) => unknown;\n}>();\n\nconst attrs = useAttrs();\nconst listboxId = createId('t-combobox');\nconst rootRef = ref<HTMLElement | null>(null);\nconst activeIndex = ref(-1);\nconst query = ref('');\n\nconst normalize = (value: string) => value.trim().toLowerCase();\nconst getOptionId = (value: string) => `${listboxId}-option-${value}`;\n\nconst selectedOption = computed(() =>\n  props.options.find((option) => option.value === props.modelValue),\n);\n\nconst selectedLabel = computed(() => selectedOption.value?.label ?? '');\n\nconst inputAttrs = computed(() => {\n  const { class: _class, style: _style, autocomplete, ...rest } = attrs;\n  return {\n    autocomplete: typeof autocomplete === 'string' ? autocomplete : 'off',\n    ...rest,\n  };\n});\n\nconst listboxLabel = computed(() =>\n  typeof attrs['aria-label'] === 'string' ? attrs['aria-label'] : undefined,\n);\n\nconst listboxLabelledby = computed(() =>\n  typeof attrs['aria-labelledby'] === 'string' ? attrs['aria-labelledby'] : undefined,\n);\n\nconst { value: isOpen, setValue } = useControllableOpen(\n  toRef(props, 'open'),\n  props.defaultOpen,\n  (value) => {\n    emit('update:open', value);\n    emit('open-change', value);\n  },\n);\n\nconst rootClasses = computed(() => [\n  't-combobox',\n  `t-combobox--${props.size}`,\n  {\n    'is-disabled': props.disabled,\n    'is-invalid': props.invalid,\n    'is-loading': props.loading,\n    'is-open': isOpen.value,\n  },\n  attrs.class,\n]);\n\nconst rootStyle = computed(() => attrs.style);\n\nconst filteredOptions = computed(() => {\n  const normalizedQuery = normalize(query.value);\n\n  if (!normalizedQuery) {\n    return props.options;\n  }\n\n  return props.options.filter((option) => {\n    const fields = [\n      option.label,\n      option.description ?? '',\n      ...(option.keywords ?? []),\n    ];\n\n    return fields.some((field) => field.toLowerCase().includes(normalizedQuery));\n  });\n});\n\nconst enabledFilteredIndexes = computed(() =>\n  filteredOptions.value.reduce<number[]>((indexes, option, index) => {\n    if (!option.disabled) {\n      indexes.push(index);\n    }\n\n    return indexes;\n  }, []),\n);\n\nconst activeOption = computed(() =>\n  activeIndex.value >= 0 ? filteredOptions.value[activeIndex.value] : undefined,\n);\n\nconst activeDescendant = computed(() =>\n  isOpen.value && activeOption.value ? getOptionId(activeOption.value.value) : undefined,\n);\n\nconst syncQueryFromSelection = () => {\n  query.value = selectedLabel.value;\n};\n\nconst setInitialActiveIndex = (fallback: 'first' | 'last' = 'first') => {\n  const selectedIndex = filteredOptions.value.findIndex((option) =>\n    option.value === props.modelValue && !option.disabled,\n  );\n\n  if (selectedIndex >= 0) {\n    activeIndex.value = selectedIndex;\n    return;\n  }\n\n  if (enabledFilteredIndexes.value.length === 0) {\n    activeIndex.value = -1;\n    return;\n  }\n\n  activeIndex.value =\n    fallback === 'last'\n      ? enabledFilteredIndexes.value[enabledFilteredIndexes.value.length - 1]\n      : enabledFilteredIndexes.value[0];\n};\n\nconst moveActive = (direction: 1 | -1) => {\n  if (enabledFilteredIndexes.value.length === 0) {\n    activeIndex.value = -1;\n    return;\n  }\n\n  const currentEnabledIndex = enabledFilteredIndexes.value.indexOf(activeIndex.value);\n\n  if (currentEnabledIndex === -1) {\n    activeIndex.value =\n      direction === 1\n        ? enabledFilteredIndexes.value[0]\n        : enabledFilteredIndexes.value[enabledFilteredIndexes.value.length - 1];\n    return;\n  }\n\n  const nextEnabledIndex = currentEnabledIndex + direction;\n\n  if (nextEnabledIndex < 0 || nextEnabledIndex >= enabledFilteredIndexes.value.length) {\n    return;\n  }\n\n  activeIndex.value = enabledFilteredIndexes.value[nextEnabledIndex];\n};\n\nconst openListbox = (fallback: 'first' | 'last' = 'first') => {\n  if (props.disabled) {\n    return;\n  }\n\n  setValue(true);\n  setInitialActiveIndex(fallback);\n};\n\nconst commitPendingClear = () => {\n  if (query.value.trim() !== '' || !props.modelValue) {\n    return false;\n  }\n\n  emit('update:modelValue', '');\n  return true;\n};\n\nconst closeListbox = (restoreSelection = false) => {\n  setValue(false);\n  activeIndex.value = -1;\n\n  if (!restoreSelection) {\n    return;\n  }\n\n  if (commitPendingClear()) {\n    return;\n  }\n\n  if (selectedLabel.value && query.value !== selectedLabel.value) {\n    query.value = selectedLabel.value;\n  }\n};\n\nconst selectOption = (option: TComboboxOption) => {\n  if (option.disabled) {\n    return;\n  }\n\n  query.value = option.label;\n  emit('update:modelValue', option.value);\n  closeListbox(false);\n};\n\nconst onInput = (event: Event) => {\n  query.value = (event.target as HTMLInputElement).value;\n  emit('input-change', query.value);\n\n  if (props.disabled) {\n    return;\n  }\n\n  if (!isOpen.value) {\n    openListbox('first');\n    return;\n  }\n\n  setInitialActiveIndex('first');\n};\n\nconst onInputFocus = () => {\n  openListbox('first');\n};\n\nconst onInputClick = () => {\n  if (!isOpen.value) {\n    openListbox('first');\n  }\n};\n\nconst onInputKeydown = (event: KeyboardEvent) => {\n  if (props.disabled) {\n    return;\n  }\n\n  if (isEscapeKey(event)) {\n    if (isOpen.value) {\n      event.preventDefault();\n      closeListbox(true);\n    }\n\n    return;\n  }\n\n  switch (event.key) {\n    case 'ArrowDown':\n      event.preventDefault();\n\n      if (!isOpen.value) {\n        openListbox('first');\n      } else {\n        moveActive(1);\n      }\n      break;\n    case 'ArrowUp':\n      event.preventDefault();\n\n      if (!isOpen.value) {\n        openListbox('last');\n      } else {\n        moveActive(-1);\n      }\n      break;\n    case 'Enter':\n      if (isOpen.value && activeOption.value && !activeOption.value.disabled) {\n        event.preventDefault();\n        selectOption(activeOption.value);\n      }\n      break;\n    case 'Home':\n      if (!isOpen.value) return;\n      event.preventDefault();\n      setInitialActiveIndex('first');\n      break;\n    case 'End':\n      if (!isOpen.value) return;\n      event.preventDefault();\n      setInitialActiveIndex('last');\n      break;\n    case 'Tab':\n      closeListbox(true);\n      break;\n    default:\n      break;\n  }\n};\n\nconst onOptionPointerEnter = (index: number) => {\n  const option = filteredOptions.value[index];\n\n  if (option && !option.disabled) {\n    activeIndex.value = index;\n  }\n};\n\nconst onDocumentPointerDown = (event: PointerEvent) => {\n  if (!isOpen.value) return;\n  const target = event.target;\n  if (!(target instanceof Node)) return;\n  if (rootRef.value?.contains(target)) return;\n  closeListbox(true);\n};\n\nwatch(isOpen, (value) => {\n  if (value) {\n    document.addEventListener('pointerdown', onDocumentPointerDown);\n  } else {\n    document.removeEventListener('pointerdown', onDocumentPointerDown);\n  }\n});\n\nwatch(\n  () => props.modelValue,\n  () => {\n    if (!isOpen.value) {\n      syncQueryFromSelection();\n    }\n  },\n  { immediate: true },\n);\n\nwatch(\n  () => props.options,\n  () => {\n    if (!isOpen.value) {\n      syncQueryFromSelection();\n      return;\n    }\n\n    setInitialActiveIndex('first');\n  },\n  { deep: true },\n);\n\nwatch(filteredOptions, () => {\n  if (!isOpen.value) {\n    return;\n  }\n\n  if (filteredOptions.value.length === 0) {\n    activeIndex.value = -1;\n    return;\n  }\n\n  const current = filteredOptions.value[activeIndex.value];\n\n  if (!current || current.disabled) {\n    setInitialActiveIndex('first');\n  }\n});\n\nonBeforeUnmount(() => {\n  document.removeEventListener('pointerdown', onDocumentPointerDown);\n});\n</script>\n\n<template>\n  <div\n    ref=\"rootRef\"\n    :class=\"rootClasses\"\n    :style=\"rootStyle\"\n    :data-state=\"isOpen ? 'open' : 'closed'\"\n  >\n    <div class=\"t-combobox__control\">\n      <span\n        v-if=\"$slots.prefix\"\n        class=\"t-combobox__slot t-combobox__slot--prefix\"\n      >\n        <slot name=\"prefix\" />\n      </span>\n      <input\n        v-bind=\"inputAttrs\"\n        class=\"t-combobox__input\"\n        role=\"combobox\"\n        type=\"text\"\n        :value=\"query\"\n        :placeholder=\"placeholder\"\n        :disabled=\"disabled\"\n        :aria-controls=\"isOpen ? listboxId : undefined\"\n        :aria-expanded=\"isOpen\"\n        :aria-activedescendant=\"activeDescendant\"\n        :aria-invalid=\"invalid || undefined\"\n        :aria-busy=\"loading || undefined\"\n        aria-autocomplete=\"list\"\n        aria-haspopup=\"listbox\"\n        @input=\"onInput\"\n        @focus=\"onInputFocus\"\n        @click=\"onInputClick\"\n        @keydown=\"onInputKeydown\"\n      >\n      <TSpinner\n        v-if=\"loading\"\n        size=\"sm\"\n        label=\"Loading\"\n      />\n      <svg\n        v-else\n        class=\"t-combobox__indicator\"\n        viewBox=\"0 0 16 16\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        aria-hidden=\"true\"\n      >\n        <polyline points=\"4 6 8 10 12 6\" />\n      </svg>\n    </div>\n\n    <transition name=\"t-fade\">\n      <ul\n        v-if=\"isOpen && !disabled\"\n        :id=\"listboxId\"\n        role=\"listbox\"\n        class=\"t-combobox__listbox\"\n        :aria-label=\"listboxLabel\"\n        :aria-labelledby=\"listboxLabelledby\"\n      >\n        <li\n          v-if=\"filteredOptions.length === 0\"\n          class=\"t-combobox__empty\"\n        >\n          <slot\n            name=\"empty\"\n            :query=\"query\"\n          >\n            {{ emptyText }}\n          </slot>\n        </li>\n\n        <template v-else>\n          <li\n            v-for=\"(option, index) in filteredOptions\"\n            :id=\"getOptionId(option.value)\"\n            :key=\"option.value\"\n            role=\"option\"\n            class=\"t-combobox__option\"\n            :class=\"{\n              'is-active': index === activeIndex,\n              'is-disabled': option.disabled,\n              'is-selected': option.value === modelValue,\n            }\"\n            :aria-selected=\"option.value === modelValue\"\n            :aria-disabled=\"option.disabled || undefined\"\n            @mouseenter=\"onOptionPointerEnter(index)\"\n            @click=\"selectOption(option)\"\n          >\n            <slot\n              name=\"option\"\n              :option=\"option\"\n              :selected=\"option.value === modelValue\"\n              :active=\"index === activeIndex\"\n            >\n              <span class=\"t-combobox__option-copy\">\n                <span class=\"t-combobox__option-label\">{{ option.label }}</span>\n                <span\n                  v-if=\"option.description\"\n                  class=\"t-combobox__option-description\"\n                >\n                  {{ option.description }}\n                </span>\n              </span>\n              <svg\n                v-if=\"option.value === modelValue\"\n                class=\"t-combobox__check\"\n                viewBox=\"0 0 16 16\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"2\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n                aria-hidden=\"true\"\n              >\n                <polyline points=\"3.5 8.5 6.5 11.5 12.5 4.5\" />\n              </svg>\n            </slot>\n          </li>\n        </template>\n      </ul>\n    </transition>\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/TCombobox.js

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

package/dist/components/TCombobox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TCombobox.js","names":[],"sources":["../../src/components/TCombobox.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { createId, isEscapeKey } from '@treeui/utils';\nimport { computed, onBeforeUnmount, ref, toRef, useAttrs, watch } from 'vue';\nimport { useControllableOpen } from '../composables/useControllableOpen';\nimport type { TSize } from '../types/contracts';\nimport TSpinner from './TSpinner.vue';\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nexport interface TComboboxOption {\n  label: string;\n  value: string;\n  description?: string;\n  keywords?: string[];\n  disabled?: boolean;\n}\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue?: string;\n    options?: TComboboxOption[];\n    open?: boolean;\n    defaultOpen?: boolean;\n    size?: TSize;\n    disabled?: boolean;\n    loading?: boolean;\n    invalid?: boolean;\n    placeholder?: string;\n    emptyText?: string;\n  }>(),\n  {\n    modelValue: '',\n    options: () => [],\n    open: undefined,\n    defaultOpen: false,\n    size: 'md',\n    disabled: false,\n    loading: false,\n    invalid: false,\n    placeholder: '',\n    emptyText: 'No results found.',\n  },\n);\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string];\n  'update:open': [value: boolean];\n  'open-change': [value: boolean];\n  'input-change': [value: string];\n}>();\n\ndefineSlots<{\n  prefix?: () => unknown;\n  option?: (props: {\n    option: TComboboxOption;\n    selected: boolean;\n    active: boolean;\n  }) => unknown;\n  empty?: (props: { query: string }) => unknown;\n}>();\n\nconst attrs = useAttrs();\nconst listboxId = createId('t-combobox');\nconst rootRef = ref<HTMLElement | null>(null);\nconst activeIndex = ref(-1);\nconst query = ref('');\n\nconst normalize = (value: string) => value.trim().toLowerCase();\nconst getOptionId = (value: string) => `${listboxId}-option-${value}`;\n\nconst selectedOption = computed(() =>\n  props.options.find((option) => option.value === props.modelValue),\n);\n\nconst selectedLabel = computed(() => selectedOption.value?.label ?? '');\n\nconst inputAttrs = computed(() => {\n  const { class: _class, style: _style, autocomplete, ...rest } = attrs;\n  return {\n    autocomplete: typeof autocomplete === 'string' ? autocomplete : 'off',\n    ...rest,\n  };\n});\n\nconst listboxLabel = computed(() =>\n  typeof attrs['aria-label'] === 'string' ? attrs['aria-label'] : undefined,\n);\n\nconst listboxLabelledby = computed(() =>\n  typeof attrs['aria-labelledby'] === 'string' ? attrs['aria-labelledby'] : undefined,\n);\n\nconst { value: isOpen, setValue } = useControllableOpen(\n  toRef(props, 'open'),\n  props.defaultOpen,\n  (value) => {\n    emit('update:open', value);\n    emit('open-change', value);\n  },\n);\n\nconst rootClasses = computed(() => [\n  't-combobox',\n  `t-combobox--${props.size}`,\n  {\n    'is-disabled': props.disabled,\n    'is-invalid': props.invalid,\n    'is-loading': props.loading,\n    'is-open': isOpen.value,\n  },\n  attrs.class,\n]);\n\nconst rootStyle = computed(() => attrs.style);\n\nconst filteredOptions = computed(() => {\n  const normalizedQuery = normalize(query.value);\n\n  if (!normalizedQuery) {\n    return props.options;\n  }\n\n  return props.options.filter((option) => {\n    const fields = [\n      option.label,\n      option.description ?? '',\n      ...(option.keywords ?? []),\n    ];\n\n    return fields.some((field) => field.toLowerCase().includes(normalizedQuery));\n  });\n});\n\nconst enabledFilteredIndexes = computed(() =>\n  filteredOptions.value.reduce<number[]>((indexes, option, index) => {\n    if (!option.disabled) {\n      indexes.push(index);\n    }\n\n    return indexes;\n  }, []),\n);\n\nconst activeOption = computed(() =>\n  activeIndex.value >= 0 ? filteredOptions.value[activeIndex.value] : undefined,\n);\n\nconst activeDescendant = computed(() =>\n  isOpen.value && activeOption.value ? getOptionId(activeOption.value.value) : undefined,\n);\n\nconst syncQueryFromSelection = () => {\n  query.value = selectedLabel.value;\n};\n\nconst setInitialActiveIndex = (fallback: 'first' | 'last' = 'first') => {\n  const selectedIndex = filteredOptions.value.findIndex((option) =>\n    option.value === props.modelValue && !option.disabled,\n  );\n\n  if (selectedIndex >= 0) {\n    activeIndex.value = selectedIndex;\n    return;\n  }\n\n  if (enabledFilteredIndexes.value.length === 0) {\n    activeIndex.value = -1;\n    return;\n  }\n\n  activeIndex.value =\n    fallback === 'last'\n      ? enabledFilteredIndexes.value[enabledFilteredIndexes.value.length - 1]\n      : enabledFilteredIndexes.value[0];\n};\n\nconst moveActive = (direction: 1 | -1) => {\n  if (enabledFilteredIndexes.value.length === 0) {\n    activeIndex.value = -1;\n    return;\n  }\n\n  const currentEnabledIndex = enabledFilteredIndexes.value.indexOf(activeIndex.value);\n\n  if (currentEnabledIndex === -1) {\n    activeIndex.value =\n      direction === 1\n        ? enabledFilteredIndexes.value[0]\n        : enabledFilteredIndexes.value[enabledFilteredIndexes.value.length - 1];\n    return;\n  }\n\n  const nextEnabledIndex = currentEnabledIndex + direction;\n\n  if (nextEnabledIndex < 0 || nextEnabledIndex >= enabledFilteredIndexes.value.length) {\n    return;\n  }\n\n  activeIndex.value = enabledFilteredIndexes.value[nextEnabledIndex];\n};\n\nconst openListbox = (fallback: 'first' | 'last' = 'first') => {\n  if (props.disabled) {\n    return;\n  }\n\n  setValue(true);\n  setInitialActiveIndex(fallback);\n};\n\nconst commitPendingClear = () => {\n  if (query.value.trim() !== '' || !props.modelValue) {\n    return false;\n  }\n\n  emit('update:modelValue', '');\n  return true;\n};\n\nconst closeListbox = (restoreSelection = false) => {\n  setValue(false);\n  activeIndex.value = -1;\n\n  if (!restoreSelection) {\n    return;\n  }\n\n  if (commitPendingClear()) {\n    return;\n  }\n\n  if (selectedLabel.value && query.value !== selectedLabel.value) {\n    query.value = selectedLabel.value;\n  }\n};\n\nconst selectOption = (option: TComboboxOption) => {\n  if (option.disabled) {\n    return;\n  }\n\n  query.value = option.label;\n  emit('update:modelValue', option.value);\n  closeListbox(false);\n};\n\nconst onInput = (event: Event) => {\n  query.value = (event.target as HTMLInputElement).value;\n  emit('input-change', query.value);\n\n  if (props.disabled) {\n    return;\n  }\n\n  if (!isOpen.value) {\n    openListbox('first');\n    return;\n  }\n\n  setInitialActiveIndex('first');\n};\n\nconst onInputFocus = () => {\n  openListbox('first');\n};\n\nconst onInputClick = () => {\n  if (!isOpen.value) {\n    openListbox('first');\n  }\n};\n\nconst onInputKeydown = (event: KeyboardEvent) => {\n  if (props.disabled) {\n    return;\n  }\n\n  if (isEscapeKey(event)) {\n    if (isOpen.value) {\n      event.preventDefault();\n      closeListbox(true);\n    }\n\n    return;\n  }\n\n  switch (event.key) {\n    case 'ArrowDown':\n      event.preventDefault();\n\n      if (!isOpen.value) {\n        openListbox('first');\n      } else {\n        moveActive(1);\n      }\n      break;\n    case 'ArrowUp':\n      event.preventDefault();\n\n      if (!isOpen.value) {\n        openListbox('last');\n      } else {\n        moveActive(-1);\n      }\n      break;\n    case 'Enter':\n      if (isOpen.value && activeOption.value && !activeOption.value.disabled) {\n        event.preventDefault();\n        selectOption(activeOption.value);\n      }\n      break;\n    case 'Home':\n      if (!isOpen.value) return;\n      event.preventDefault();\n      setInitialActiveIndex('first');\n      break;\n    case 'End':\n      if (!isOpen.value) return;\n      event.preventDefault();\n      setInitialActiveIndex('last');\n      break;\n    case 'Tab':\n      closeListbox(true);\n      break;\n    default:\n      break;\n  }\n};\n\nconst onOptionPointerEnter = (index: number) => {\n  const option = filteredOptions.value[index];\n\n  if (option && !option.disabled) {\n    activeIndex.value = index;\n  }\n};\n\nconst onDocumentPointerDown = (event: PointerEvent) => {\n  if (!isOpen.value) return;\n  const target = event.target;\n  if (!(target instanceof Node)) return;\n  if (rootRef.value?.contains(target)) return;\n  closeListbox(true);\n};\n\nwatch(isOpen, (value) => {\n  if (value) {\n    document.addEventListener('pointerdown', onDocumentPointerDown);\n  } else {\n    document.removeEventListener('pointerdown', onDocumentPointerDown);\n  }\n});\n\nwatch(\n  () => props.modelValue,\n  () => {\n    if (!isOpen.value) {\n      syncQueryFromSelection();\n    }\n  },\n  { immediate: true },\n);\n\nwatch(\n  () => props.options,\n  () => {\n    if (!isOpen.value) {\n      syncQueryFromSelection();\n      return;\n    }\n\n    setInitialActiveIndex('first');\n  },\n  { deep: true },\n);\n\nwatch(filteredOptions, () => {\n  if (!isOpen.value) {\n    return;\n  }\n\n  if (filteredOptions.value.length === 0) {\n    activeIndex.value = -1;\n    return;\n  }\n\n  const current = filteredOptions.value[activeIndex.value];\n\n  if (!current || current.disabled) {\n    setInitialActiveIndex('first');\n  }\n});\n\nonBeforeUnmount(() => {\n  document.removeEventListener('pointerdown', onDocumentPointerDown);\n});\n</script>\n\n<template>\n  <div\n    ref=\"rootRef\"\n    :class=\"rootClasses\"\n    :style=\"rootStyle\"\n    :data-state=\"isOpen ? 'open' : 'closed'\"\n  >\n    <div class=\"t-combobox__control\">\n      <span\n        v-if=\"$slots.prefix\"\n        class=\"t-combobox__slot t-combobox__slot--prefix\"\n      >\n        <slot name=\"prefix\" />\n      </span>\n      <input\n        v-bind=\"inputAttrs\"\n        class=\"t-combobox__input\"\n        role=\"combobox\"\n        type=\"text\"\n        :value=\"query\"\n        :placeholder=\"placeholder\"\n        :disabled=\"disabled\"\n        :aria-controls=\"isOpen ? listboxId : undefined\"\n        :aria-expanded=\"isOpen\"\n        :aria-activedescendant=\"activeDescendant\"\n        :aria-invalid=\"invalid || undefined\"\n        :aria-busy=\"loading || undefined\"\n        aria-autocomplete=\"list\"\n        aria-haspopup=\"listbox\"\n        @input=\"onInput\"\n        @focus=\"onInputFocus\"\n        @click=\"onInputClick\"\n        @keydown=\"onInputKeydown\"\n      >\n      <TSpinner\n        v-if=\"loading\"\n        size=\"sm\"\n        label=\"Loading\"\n      />\n      <svg\n        v-else\n        class=\"t-combobox__indicator\"\n        viewBox=\"0 0 16 16\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        aria-hidden=\"true\"\n      >\n        <polyline points=\"4 6 8 10 12 6\" />\n      </svg>\n    </div>\n\n    <transition name=\"t-fade\">\n      <ul\n        v-if=\"isOpen && !disabled\"\n        :id=\"listboxId\"\n        role=\"listbox\"\n        class=\"t-combobox__listbox\"\n        :aria-label=\"listboxLabel\"\n        :aria-labelledby=\"listboxLabelledby\"\n      >\n        <li\n          v-if=\"filteredOptions.length === 0\"\n          class=\"t-combobox__empty\"\n        >\n          <slot\n            name=\"empty\"\n            :query=\"query\"\n          >\n            {{ emptyText }}\n          </slot>\n        </li>\n\n        <template v-else>\n          <li\n            v-for=\"(option, index) in filteredOptions\"\n            :id=\"getOptionId(option.value)\"\n            :key=\"option.value\"\n            role=\"option\"\n            class=\"t-combobox__option\"\n            :class=\"{\n              'is-active': index === activeIndex,\n              'is-disabled': option.disabled,\n              'is-selected': option.value === modelValue,\n            }\"\n            :aria-selected=\"option.value === modelValue\"\n            :aria-disabled=\"option.disabled || undefined\"\n            @mouseenter=\"onOptionPointerEnter(index)\"\n            @click=\"selectOption(option)\"\n          >\n            <slot\n              name=\"option\"\n              :option=\"option\"\n              :selected=\"option.value === modelValue\"\n              :active=\"index === activeIndex\"\n            >\n              <span class=\"t-combobox__option-copy\">\n                <span class=\"t-combobox__option-label\">{{ option.label }}</span>\n                <span\n                  v-if=\"option.description\"\n                  class=\"t-combobox__option-description\"\n                >\n                  {{ option.description }}\n                </span>\n              </span>\n              <svg\n                v-if=\"option.value === modelValue\"\n                class=\"t-combobox__check\"\n                viewBox=\"0 0 16 16\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"2\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n                aria-hidden=\"true\"\n              >\n                <polyline points=\"3.5 8.5 6.5 11.5 12.5 4.5\" />\n              </svg>\n            </slot>\n          </li>\n        </template>\n      </ul>\n    </transition>\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/{TreeCombobox.vue.d.ts → TCombobox.vue.d.ts}

@@ -1,5 +1,5 @@
-import { TreeSize } from '../types/contracts';
-export interface TreeComboboxOption {
+import { TSize } from '../types/contracts';
+export interface TComboboxOption {
     label: string;
     value: string;
     description?: string;
@@ -8,10 +8,10 @@ export interface TreeComboboxOption {
 }
 type __VLS_Props = {
     modelValue?: string;
-    options?: TreeComboboxOption[];
+    options?: TComboboxOption[];
     open?: boolean;
     defaultOpen?: boolean;
-    size?: TreeSize;
+    size?: TSize;
     disabled?: boolean;
     loading?: boolean;
     invalid?: boolean;
@@ -23,7 +23,7 @@ declare function __VLS_template(): {
     slots: Readonly<{
         prefix?: () => unknown;
         option?: (props: {
-            option: TreeComboboxOption;
+            option: TComboboxOption;
             selected: boolean;
             active: boolean;
         }) => unknown;
@@ -33,7 +33,7 @@ declare function __VLS_template(): {
     }> & {
         prefix?: () => unknown;
         option?: (props: {
-            option: TreeComboboxOption;
+            option: TComboboxOption;
             selected: boolean;
             active: boolean;
         }) => unknown;
@@ -60,10 +60,10 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}
 }>, {
     modelValue: string;
     disabled: boolean;
-    size: TreeSize;
+    size: TSize;
     loading: boolean;
     invalid: boolean;
-    options: TreeComboboxOption[];
+    options: TComboboxOption[];
     open: boolean;
     defaultOpen: boolean;
     placeholder: string;
@@ -78,4 +78,4 @@ type __VLS_WithTemplateSlots<T, S> = T & {
         $slots: S;
     };
 };
-//# sourceMappingURL=TreeCombobox.vue.d.ts.map
+//# sourceMappingURL=TCombobox.vue.d.ts.map

package/dist/components/TCombobox.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TCombobox.vue.d.ts","sourceRoot":"","sources":["../../src/components/TCombobox.vue"],"names":[],"mappings":"AAohBA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAOhD,MAAM,WAAW,eAAe;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,KAAK,WAAW,GAAG;IACf,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,OAAO,CAAC,EAAE,eAAe,EAAE,CAAC;IAC5B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAiYJ,iBAAS,cAAc;WA8KT,OAAO,IAA6B;;iBArhBvC,MAAM,OAAO;iBACb,CAAC,KAAK,EAAE;YACf,MAAM,EAAE,eAAe,CAAC;YACxB,QAAQ,EAAE,OAAO,CAAC;YAClB,MAAM,EAAE,OAAO,CAAC;SACjB,KAAK,OAAO;gBACL,CAAC,KAAK,EAAE;YAAE,KAAK,EAAE,MAAM,CAAA;SAAE,KAAK,OAAO;;iBANpC,MAAM,OAAO;iBACb,CAAC,KAAK,EAAE;YACf,MAAM,EAAE,eAAe,CAAC;YACxB,QAAQ,EAAE,OAAO,CAAC;YAClB,MAAM,EAAE,OAAO,CAAC;SACjB,KAAK,OAAO;gBACL,CAAC,KAAK,EAAE;YAAE,KAAK,EAAE,MAAM,CAAA;SAAE,KAAK,OAAO;;;;;;EAohB9C;AA8BD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;;;;;gBA7lBJ,MAAM;cAKR,OAAO;UADX,KAAK;aAEF,OAAO;aACP,OAAO;aANP,eAAe,EAAE;UACpB,OAAO;iBACA,OAAO;iBAKP,MAAM;eACR,MAAM;;;OA6lBpB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

package/dist/components/TCombobox.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1,2 @@
+const e=require("./TSpinner.cjs"),t=require("../composables/useControllableOpen.cjs");let n=require("vue"),r=require("@treeui/utils");var i=[`data-state`],a={class:`t-combobox__control`},o={key:0,class:`t-combobox__slot t-combobox__slot--prefix`},s=[`value`,`placeholder`,`disabled`,`aria-controls`,`aria-expanded`,`aria-activedescendant`,`aria-invalid`,`aria-busy`],c={key:2,class:`t-combobox__indicator`,viewBox:`0 0 16 16`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`,"stroke-linejoin":`round`,"aria-hidden":`true`},l=[`id`,`aria-label`,`aria-labelledby`],u={key:0,class:`t-combobox__empty`},d=[`id`,`aria-selected`,`aria-disabled`,`onMouseenter`,`onClick`],f={class:`t-combobox__option-copy`},p={class:`t-combobox__option-label`},m={key:0,class:`t-combobox__option-description`},h={key:0,class:`t-combobox__check`,viewBox:`0 0 16 16`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`,"stroke-linejoin":`round`,"aria-hidden":`true`},g=(0,n.defineComponent)({inheritAttrs:!1,__name:`TCombobox`,props:{modelValue:{default:``},options:{default:()=>[]},open:{type:Boolean,default:void 0},defaultOpen:{type:Boolean,default:!1},size:{default:`md`},disabled:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},invalid:{type:Boolean,default:!1},placeholder:{default:``},emptyText:{default:`No results found.`}},emits:[`update:modelValue`,`update:open`,`open-change`,`input-change`],setup(g,{emit:_}){let v=g,y=_,b=(0,n.useAttrs)(),x=(0,r.createId)(`t-combobox`),S=(0,n.ref)(null),C=(0,n.ref)(-1),w=(0,n.ref)(``),T=e=>e.trim().toLowerCase(),E=e=>`${x}-option-${e}`,D=(0,n.computed)(()=>v.options.find(e=>e.value===v.modelValue)),O=(0,n.computed)(()=>D.value?.label??``),k=(0,n.computed)(()=>{let{class:e,style:t,autocomplete:n,...r}=b;return{autocomplete:typeof n==`string`?n:`off`,...r}}),A=(0,n.computed)(()=>typeof b[`aria-label`]==`string`?b[`aria-label`]:void 0),j=(0,n.computed)(()=>typeof b[`aria-labelledby`]==`string`?b[`aria-labelledby`]:void 0),{value:M,setValue:N}=t.useControllableOpen((0,n.toRef)(v,`open`),v.defaultOpen,e=>{y(`update:open`,e),y(`open-change`,e)}),P=(0,n.computed)(()=>[`t-combobox`,`t-combobox--${v.size}`,{"is-disabled":v.disabled,"is-invalid":v.invalid,"is-loading":v.loading,"is-open":M.value},b.class]),F=(0,n.computed)(()=>b.style),I=(0,n.computed)(()=>{let e=T(w.value);return e?v.options.filter(t=>[t.label,t.description??``,...t.keywords??[]].some(t=>t.toLowerCase().includes(e))):v.options}),L=(0,n.computed)(()=>I.value.reduce((e,t,n)=>(t.disabled||e.push(n),e),[])),R=(0,n.computed)(()=>C.value>=0?I.value[C.value]:void 0),z=(0,n.computed)(()=>M.value&&R.value?E(R.value.value):void 0),B=()=>{w.value=O.value},V=(e=`first`)=>{let t=I.value.findIndex(e=>e.value===v.modelValue&&!e.disabled);if(t>=0){C.value=t;return}if(L.value.length===0){C.value=-1;return}C.value=e===`last`?L.value[L.value.length-1]:L.value[0]},H=e=>{if(L.value.length===0){C.value=-1;return}let t=L.value.indexOf(C.value);if(t===-1){C.value=e===1?L.value[0]:L.value[L.value.length-1];return}let n=t+e;n<0||n>=L.value.length||(C.value=L.value[n])},U=(e=`first`)=>{v.disabled||(N(!0),V(e))},W=()=>w.value.trim()!==``||!v.modelValue?!1:(y(`update:modelValue`,``),!0),G=(e=!1)=>{N(!1),C.value=-1,e&&(W()||O.value&&w.value!==O.value&&(w.value=O.value))},K=e=>{e.disabled||(w.value=e.label,y(`update:modelValue`,e.value),G(!1))},q=e=>{if(w.value=e.target.value,y(`input-change`,w.value),!v.disabled){if(!M.value){U(`first`);return}V(`first`)}},J=()=>{U(`first`)},Y=()=>{M.value||U(`first`)},X=e=>{if(!v.disabled){if((0,r.isEscapeKey)(e)){M.value&&(e.preventDefault(),G(!0));return}switch(e.key){case`ArrowDown`:e.preventDefault(),M.value?H(1):U(`first`);break;case`ArrowUp`:e.preventDefault(),M.value?H(-1):U(`last`);break;case`Enter`:M.value&&R.value&&!R.value.disabled&&(e.preventDefault(),K(R.value));break;case`Home`:if(!M.value)return;e.preventDefault(),V(`first`);break;case`End`:if(!M.value)return;e.preventDefault(),V(`last`);break;case`Tab`:G(!0);break;default:break}}},Z=e=>{let t=I.value[e];t&&!t.disabled&&(C.value=e)},Q=e=>{if(!M.value)return;let t=e.target;t instanceof Node&&(S.value?.contains(t)||G(!0))};return(0,n.watch)(M,e=>{e?document.addEventListener(`pointerdown`,Q):document.removeEventListener(`pointerdown`,Q)}),(0,n.watch)(()=>v.modelValue,()=>{M.value||B()},{immediate:!0}),(0,n.watch)(()=>v.options,()=>{if(!M.value){B();return}V(`first`)},{deep:!0}),(0,n.watch)(I,()=>{if(!M.value)return;if(I.value.length===0){C.value=-1;return}let e=I.value[C.value];(!e||e.disabled)&&V(`first`)}),(0,n.onBeforeUnmount)(()=>{document.removeEventListener(`pointerdown`,Q)}),(t,r)=>((0,n.openBlock)(),(0,n.createElementBlock)(`div`,{ref_key:`rootRef`,ref:S,class:(0,n.normalizeClass)(P.value),style:(0,n.normalizeStyle)(F.value),"data-state":(0,n.unref)(M)?`open`:`closed`},[(0,n.createElementVNode)(`div`,a,[t.$slots.prefix?((0,n.openBlock)(),(0,n.createElementBlock)(`span`,o,[(0,n.renderSlot)(t.$slots,`prefix`)])):(0,n.createCommentVNode)(``,!0),(0,n.createElementVNode)(`input`,(0,n.mergeProps)(k.value,{class:`t-combobox__input`,role:`combobox`,type:`text`,value:w.value,placeholder:g.placeholder,disabled:g.disabled,"aria-controls":(0,n.unref)(M)?(0,n.unref)(x):void 0,"aria-expanded":(0,n.unref)(M),"aria-activedescendant":z.value,"aria-invalid":g.invalid||void 0,"aria-busy":g.loading||void 0,"aria-autocomplete":`list`,"aria-haspopup":`listbox`,onInput:q,onFocus:J,onClick:Y,onKeydown:X}),null,16,s),g.loading?((0,n.openBlock)(),(0,n.createBlock)(e.default,{key:1,size:`sm`,label:`Loading`})):((0,n.openBlock)(),(0,n.createElementBlock)(`svg`,c,[...r[0]||=[(0,n.createElementVNode)(`polyline`,{points:`4 6 8 10 12 6`},null,-1)]]))]),(0,n.createVNode)(n.Transition,{name:`t-fade`},{default:(0,n.withCtx)(()=>[(0,n.unref)(M)&&!g.disabled?((0,n.openBlock)(),(0,n.createElementBlock)(`ul`,{key:0,id:(0,n.unref)(x),role:`listbox`,class:`t-combobox__listbox`,"aria-label":A.value,"aria-labelledby":j.value},[I.value.length===0?((0,n.openBlock)(),(0,n.createElementBlock)(`li`,u,[(0,n.renderSlot)(t.$slots,`empty`,{query:w.value},()=>[(0,n.createTextVNode)((0,n.toDisplayString)(g.emptyText),1)])])):((0,n.openBlock)(!0),(0,n.createElementBlock)(n.Fragment,{key:1},(0,n.renderList)(I.value,(e,i)=>((0,n.openBlock)(),(0,n.createElementBlock)(`li`,{id:E(e.value),key:e.value,role:`option`,class:(0,n.normalizeClass)([`t-combobox__option`,{"is-active":i===C.value,"is-disabled":e.disabled,"is-selected":e.value===g.modelValue}]),"aria-selected":e.value===g.modelValue,"aria-disabled":e.disabled||void 0,onMouseenter:e=>Z(i),onClick:t=>K(e)},[(0,n.renderSlot)(t.$slots,`option`,{option:e,selected:e.value===g.modelValue,active:i===C.value},()=>[(0,n.createElementVNode)(`span`,f,[(0,n.createElementVNode)(`span`,p,(0,n.toDisplayString)(e.label),1),e.description?((0,n.openBlock)(),(0,n.createElementBlock)(`span`,m,(0,n.toDisplayString)(e.description),1)):(0,n.createCommentVNode)(``,!0)]),e.value===g.modelValue?((0,n.openBlock)(),(0,n.createElementBlock)(`svg`,h,[...r[1]||=[(0,n.createElementVNode)(`polyline`,{points:`3.5 8.5 6.5 11.5 12.5 4.5`},null,-1)]])):(0,n.createCommentVNode)(``,!0)])],42,d))),128))],8,l)):(0,n.createCommentVNode)(``,!0)]),_:3})],14,i))}});exports.default=g;
+//# sourceMappingURL=TCombobox.vue_vue_type_script_setup_true_lang.cjs.map

package/dist/components/TCombobox.vue_vue_type_script_setup_true_lang.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TCombobox.vue_vue_type_script_setup_true_lang.cjs","names":["$slots"],"sources":["../../src/components/TCombobox.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { createId, isEscapeKey } from '@treeui/utils';\nimport { computed, onBeforeUnmount, ref, toRef, useAttrs, watch } from 'vue';\nimport { useControllableOpen } from '../composables/useControllableOpen';\nimport type { TSize } from '../types/contracts';\nimport TSpinner from './TSpinner.vue';\n\ndefineOptions({\n  inheritAttrs: false,\n});\n\nexport interface TComboboxOption {\n  label: string;\n  value: string;\n  description?: string;\n  keywords?: string[];\n  disabled?: boolean;\n}\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue?: string;\n    options?: TComboboxOption[];\n    open?: boolean;\n    defaultOpen?: boolean;\n    size?: TSize;\n    disabled?: boolean;\n    loading?: boolean;\n    invalid?: boolean;\n    placeholder?: string;\n    emptyText?: string;\n  }>(),\n  {\n    modelValue: '',\n    options: () => [],\n    open: undefined,\n    defaultOpen: false,\n    size: 'md',\n    disabled: false,\n    loading: false,\n    invalid: false,\n    placeholder: '',\n    emptyText: 'No results found.',\n  },\n);\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string];\n  'update:open': [value: boolean];\n  'open-change': [value: boolean];\n  'input-change': [value: string];\n}>();\n\ndefineSlots<{\n  prefix?: () => unknown;\n  option?: (props: {\n    option: TComboboxOption;\n    selected: boolean;\n    active: boolean;\n  }) => unknown;\n  empty?: (props: { query: string }) => unknown;\n}>();\n\nconst attrs = useAttrs();\nconst listboxId = createId('t-combobox');\nconst rootRef = ref<HTMLElement | null>(null);\nconst activeIndex = ref(-1);\nconst query = ref('');\n\nconst normalize = (value: string) => value.trim().toLowerCase();\nconst getOptionId = (value: string) => `${listboxId}-option-${value}`;\n\nconst selectedOption = computed(() =>\n  props.options.find((option) => option.value === props.modelValue),\n);\n\nconst selectedLabel = computed(() => selectedOption.value?.label ?? '');\n\nconst inputAttrs = computed(() => {\n  const { class: _class, style: _style, autocomplete, ...rest } = attrs;\n  return {\n    autocomplete: typeof autocomplete === 'string' ? autocomplete : 'off',\n    ...rest,\n  };\n});\n\nconst listboxLabel = computed(() =>\n  typeof attrs['aria-label'] === 'string' ? attrs['aria-label'] : undefined,\n);\n\nconst listboxLabelledby = computed(() =>\n  typeof attrs['aria-labelledby'] === 'string' ? attrs['aria-labelledby'] : undefined,\n);\n\nconst { value: isOpen, setValue } = useControllableOpen(\n  toRef(props, 'open'),\n  props.defaultOpen,\n  (value) => {\n    emit('update:open', value);\n    emit('open-change', value);\n  },\n);\n\nconst rootClasses = computed(() => [\n  't-combobox',\n  `t-combobox--${props.size}`,\n  {\n    'is-disabled': props.disabled,\n    'is-invalid': props.invalid,\n    'is-loading': props.loading,\n    'is-open': isOpen.value,\n  },\n  attrs.class,\n]);\n\nconst rootStyle = computed(() => attrs.style);\n\nconst filteredOptions = computed(() => {\n  const normalizedQuery = normalize(query.value);\n\n  if (!normalizedQuery) {\n    return props.options;\n  }\n\n  return props.options.filter((option) => {\n    const fields = [\n      option.label,\n      option.description ?? '',\n      ...(option.keywords ?? []),\n    ];\n\n    return fields.some((field) => field.toLowerCase().includes(normalizedQuery));\n  });\n});\n\nconst enabledFilteredIndexes = computed(() =>\n  filteredOptions.value.reduce<number[]>((indexes, option, index) => {\n    if (!option.disabled) {\n      indexes.push(index);\n    }\n\n    return indexes;\n  }, []),\n);\n\nconst activeOption = computed(() =>\n  activeIndex.value >= 0 ? filteredOptions.value[activeIndex.value] : undefined,\n);\n\nconst activeDescendant = computed(() =>\n  isOpen.value && activeOption.value ? getOptionId(activeOption.value.value) : undefined,\n);\n\nconst syncQueryFromSelection = () => {\n  query.value = selectedLabel.value;\n};\n\nconst setInitialActiveIndex = (fallback: 'first' | 'last' = 'first') => {\n  const selectedIndex = filteredOptions.value.findIndex((option) =>\n    option.value === props.modelValue && !option.disabled,\n  );\n\n  if (selectedIndex >= 0) {\n    activeIndex.value = selectedIndex;\n    return;\n  }\n\n  if (enabledFilteredIndexes.value.length === 0) {\n    activeIndex.value = -1;\n    return;\n  }\n\n  activeIndex.value =\n    fallback === 'last'\n      ? enabledFilteredIndexes.value[enabledFilteredIndexes.value.length - 1]\n      : enabledFilteredIndexes.value[0];\n};\n\nconst moveActive = (direction: 1 | -1) => {\n  if (enabledFilteredIndexes.value.length === 0) {\n    activeIndex.value = -1;\n    return;\n  }\n\n  const currentEnabledIndex = enabledFilteredIndexes.value.indexOf(activeIndex.value);\n\n  if (currentEnabledIndex === -1) {\n    activeIndex.value =\n      direction === 1\n        ? enabledFilteredIndexes.value[0]\n        : enabledFilteredIndexes.value[enabledFilteredIndexes.value.length - 1];\n    return;\n  }\n\n  const nextEnabledIndex = currentEnabledIndex + direction;\n\n  if (nextEnabledIndex < 0 || nextEnabledIndex >= enabledFilteredIndexes.value.length) {\n    return;\n  }\n\n  activeIndex.value = enabledFilteredIndexes.value[nextEnabledIndex];\n};\n\nconst openListbox = (fallback: 'first' | 'last' = 'first') => {\n  if (props.disabled) {\n    return;\n  }\n\n  setValue(true);\n  setInitialActiveIndex(fallback);\n};\n\nconst commitPendingClear = () => {\n  if (query.value.trim() !== '' || !props.modelValue) {\n    return false;\n  }\n\n  emit('update:modelValue', '');\n  return true;\n};\n\nconst closeListbox = (restoreSelection = false) => {\n  setValue(false);\n  activeIndex.value = -1;\n\n  if (!restoreSelection) {\n    return;\n  }\n\n  if (commitPendingClear()) {\n    return;\n  }\n\n  if (selectedLabel.value && query.value !== selectedLabel.value) {\n    query.value = selectedLabel.value;\n  }\n};\n\nconst selectOption = (option: TComboboxOption) => {\n  if (option.disabled) {\n    return;\n  }\n\n  query.value = option.label;\n  emit('update:modelValue', option.value);\n  closeListbox(false);\n};\n\nconst onInput = (event: Event) => {\n  query.value = (event.target as HTMLInputElement).value;\n  emit('input-change', query.value);\n\n  if (props.disabled) {\n    return;\n  }\n\n  if (!isOpen.value) {\n    openListbox('first');\n    return;\n  }\n\n  setInitialActiveIndex('first');\n};\n\nconst onInputFocus = () => {\n  openListbox('first');\n};\n\nconst onInputClick = () => {\n  if (!isOpen.value) {\n    openListbox('first');\n  }\n};\n\nconst onInputKeydown = (event: KeyboardEvent) => {\n  if (props.disabled) {\n    return;\n  }\n\n  if (isEscapeKey(event)) {\n    if (isOpen.value) {\n      event.preventDefault();\n      closeListbox(true);\n    }\n\n    return;\n  }\n\n  switch (event.key) {\n    case 'ArrowDown':\n      event.preventDefault();\n\n      if (!isOpen.value) {\n        openListbox('first');\n      } else {\n        moveActive(1);\n      }\n      break;\n    case 'ArrowUp':\n      event.preventDefault();\n\n      if (!isOpen.value) {\n        openListbox('last');\n      } else {\n        moveActive(-1);\n      }\n      break;\n    case 'Enter':\n      if (isOpen.value && activeOption.value && !activeOption.value.disabled) {\n        event.preventDefault();\n        selectOption(activeOption.value);\n      }\n      break;\n    case 'Home':\n      if (!isOpen.value) return;\n      event.preventDefault();\n      setInitialActiveIndex('first');\n      break;\n    case 'End':\n      if (!isOpen.value) return;\n      event.preventDefault();\n      setInitialActiveIndex('last');\n      break;\n    case 'Tab':\n      closeListbox(true);\n      break;\n    default:\n      break;\n  }\n};\n\nconst onOptionPointerEnter = (index: number) => {\n  const option = filteredOptions.value[index];\n\n  if (option && !option.disabled) {\n    activeIndex.value = index;\n  }\n};\n\nconst onDocumentPointerDown = (event: PointerEvent) => {\n  if (!isOpen.value) return;\n  const target = event.target;\n  if (!(target instanceof Node)) return;\n  if (rootRef.value?.contains(target)) return;\n  closeListbox(true);\n};\n\nwatch(isOpen, (value) => {\n  if (value) {\n    document.addEventListener('pointerdown', onDocumentPointerDown);\n  } else {\n    document.removeEventListener('pointerdown', onDocumentPointerDown);\n  }\n});\n\nwatch(\n  () => props.modelValue,\n  () => {\n    if (!isOpen.value) {\n      syncQueryFromSelection();\n    }\n  },\n  { immediate: true },\n);\n\nwatch(\n  () => props.options,\n  () => {\n    if (!isOpen.value) {\n      syncQueryFromSelection();\n      return;\n    }\n\n    setInitialActiveIndex('first');\n  },\n  { deep: true },\n);\n\nwatch(filteredOptions, () => {\n  if (!isOpen.value) {\n    return;\n  }\n\n  if (filteredOptions.value.length === 0) {\n    activeIndex.value = -1;\n    return;\n  }\n\n  const current = filteredOptions.value[activeIndex.value];\n\n  if (!current || current.disabled) {\n    setInitialActiveIndex('first');\n  }\n});\n\nonBeforeUnmount(() => {\n  document.removeEventListener('pointerdown', onDocumentPointerDown);\n});\n</script>\n\n<template>\n  <div\n    ref=\"rootRef\"\n    :class=\"rootClasses\"\n    :style=\"rootStyle\"\n    :data-state=\"isOpen ? 'open' : 'closed'\"\n  >\n    <div class=\"t-combobox__control\">\n      <span\n        v-if=\"$slots.prefix\"\n        class=\"t-combobox__slot t-combobox__slot--prefix\"\n      >\n        <slot name=\"prefix\" />\n      </span>\n      <input\n        v-bind=\"inputAttrs\"\n        class=\"t-combobox__input\"\n        role=\"combobox\"\n        type=\"text\"\n        :value=\"query\"\n        :placeholder=\"placeholder\"\n        :disabled=\"disabled\"\n        :aria-controls=\"isOpen ? listboxId : undefined\"\n        :aria-expanded=\"isOpen\"\n        :aria-activedescendant=\"activeDescendant\"\n        :aria-invalid=\"invalid || undefined\"\n        :aria-busy=\"loading || undefined\"\n        aria-autocomplete=\"list\"\n        aria-haspopup=\"listbox\"\n        @input=\"onInput\"\n        @focus=\"onInputFocus\"\n        @click=\"onInputClick\"\n        @keydown=\"onInputKeydown\"\n      >\n      <TSpinner\n        v-if=\"loading\"\n        size=\"sm\"\n        label=\"Loading\"\n      />\n      <svg\n        v-else\n        class=\"t-combobox__indicator\"\n        viewBox=\"0 0 16 16\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        aria-hidden=\"true\"\n      >\n        <polyline points=\"4 6 8 10 12 6\" />\n      </svg>\n    </div>\n\n    <transition name=\"t-fade\">\n      <ul\n        v-if=\"isOpen && !disabled\"\n        :id=\"listboxId\"\n        role=\"listbox\"\n        class=\"t-combobox__listbox\"\n        :aria-label=\"listboxLabel\"\n        :aria-labelledby=\"listboxLabelledby\"\n      >\n        <li\n          v-if=\"filteredOptions.length === 0\"\n          class=\"t-combobox__empty\"\n        >\n          <slot\n            name=\"empty\"\n            :query=\"query\"\n          >\n            {{ emptyText }}\n          </slot>\n        </li>\n\n        <template v-else>\n          <li\n            v-for=\"(option, index) in filteredOptions\"\n            :id=\"getOptionId(option.value)\"\n            :key=\"option.value\"\n            role=\"option\"\n            class=\"t-combobox__option\"\n            :class=\"{\n              'is-active': index === activeIndex,\n              'is-disabled': option.disabled,\n              'is-selected': option.value === modelValue,\n            }\"\n            :aria-selected=\"option.value === modelValue\"\n            :aria-disabled=\"option.disabled || undefined\"\n            @mouseenter=\"onOptionPointerEnter(index)\"\n            @click=\"selectOption(option)\"\n          >\n            <slot\n              name=\"option\"\n              :option=\"option\"\n              :selected=\"option.value === modelValue\"\n              :active=\"index === activeIndex\"\n            >\n              <span class=\"t-combobox__option-copy\">\n                <span class=\"t-combobox__option-label\">{{ option.label }}</span>\n                <span\n                  v-if=\"option.description\"\n                  class=\"t-combobox__option-description\"\n                >\n                  {{ option.description }}\n                </span>\n              </span>\n              <svg\n                v-if=\"option.value === modelValue\"\n                class=\"t-combobox__check\"\n                viewBox=\"0 0 16 16\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"2\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n                aria-hidden=\"true\"\n              >\n                <polyline points=\"3.5 8.5 6.5 11.5 12.5 4.5\" />\n              </svg>\n            </slot>\n          </li>\n        </template>\n      </ul>\n    </transition>\n  </div>\n</template>\n"],"mappings":"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"}