@leaflink/stash 50.0.5 → 50.0.7

package/dist/Select.js

@@ -1,42 +1,39 @@
-import { defineComponent as xe, useAttrs as Ce, useSlots as Ie, ref as c, computed as v, watch as U, nextTick as Y, onMounted as Oe, onUnmounted as Me, openBlock as o, createBlock as K, normalizeClass as k, unref as y, createSlots as Fe, withCtx as M, createElementVNode as h, createElementBlock as d, Fragment as V, renderList as G, toDisplayString as B, withDirectives as F, withKeys as oe, createCommentVNode as R, renderSlot as j, createTextVNode as $, withModifiers as P, createVNode as S, Teleport as Re, Transition as $e, normalizeStyle as Pe, vModelText as ze, vShow as J } from "vue";
-import { u as He, a as Ne, f as Ae, o as Le, s as De } from "./floating-ui.vue-BmfQDqE-.js";
-import Ue from "@leaflink/snitch";
-import Ke from "lodash-es/debounce";
-import Ve from "lodash-es/isEmpty";
+import { defineComponent as Ce, useAttrs as Oe, useSlots as Ie, ref as c, computed as h, watch as U, nextTick as Y, onMounted as Me, onUnmounted as Fe, openBlock as r, createBlock as V, mergeProps as Re, unref as y, createSlots as $e, withCtx as k, createElementVNode as d, toDisplayString as g, createElementBlock as f, Fragment as K, renderList as G, withDirectives as M, normalizeClass as F, withKeys as oe, createCommentVNode as R, renderSlot as j, createTextVNode as $, withModifiers as P, createVNode as S, Teleport as Pe, Transition as ze, normalizeStyle as He, vModelText as Ne, vShow as J } from "vue";
+import { u as Ae, a as De, f as Le, o as Ue, s as Ve } from "./floating-ui.vue-BmfQDqE-.js";
+import Ke from "@leaflink/snitch";
+import Ge from "lodash-es/debounce";
+import je from "lodash-es/isEmpty";
 import re from "lodash-es/isEqual";
-import Ge from "lodash-es/isPlainObject";
-import je from "lodash-es/uniqueId";
-import qe from "./useSearch.js";
-import { DEBOUNCE as We, KEY_CODES as E } from "./constants.js";
-import Xe from "./directives/clickoutside.js";
-import { D as Ye } from "./MenusPlugin-Bk6UW6o9.js";
+import qe from "lodash-es/isPlainObject";
+import We from "lodash-es/uniqueId";
+import Xe from "./useSearch.js";
+import { DEBOUNCE as Ye, KEY_CODES as E } from "./constants.js";
+import Je from "./directives/clickoutside.js";
+import { D as Qe } from "./MenusPlugin-Bk6UW6o9.js";
 import ie from "./Chip.js";
-import { _ as Je } from "./Field.vue_vue_type_script_setup_true_lang-DjxUvSRF.js";
 import z from "./Icon.js";
-import { _ as Qe } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const Ze = ["id", "aria-errormessage", "aria-invalid", "disabled", "multiple", "name"], et = ["selected", "value"], tt = ["aria-controls", "aria-expanded", "aria-label", "aria-disabled"], lt = ["id"], at = ["onKeypress", "onMousedown"], st = {
+import { _ as Ze } from "./Field.vue_vue_type_script_setup_true_lang-DEizIcDo.js";
+import { _ as et } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const tt = { class: "tw-flex tw-h-input tw-items-center tw-text-sm" }, lt = ["id", "aria-labelledby"], at = ["id", "aria-errormessage", "aria-invalid", "disabled", "multiple", "name"], st = ["selected", "value"], nt = ["aria-controls", "aria-expanded", "aria-label", "aria-disabled"], ot = ["id"], rt = ["onKeypress", "onMousedown"], it = {
   key: 0,
   class: "stash-select__total"
-}, nt = {
+}, ct = {
   key: 0,
   class: "tw-flex tw-items-center tw-border-b tw-border-blue-500 tw-pr-1.5"
-}, ot = ["data-test", "placeholder"], rt = { class: "stash-select__options options tw-my-1.5 tw-w-full tw-border-white tw-bg-white" }, it = ["data-test", "onClick", "onMouseenter"], ct = { class: "tw-m-1.5 tw-cursor-default tw-p-1.5" }, ut = {
+}, ut = ["data-test", "placeholder"], dt = { class: "stash-select__options options tw-my-1.5 tw-w-full tw-border-white tw-bg-white" }, ft = ["data-test", "onClick", "onMouseenter"], vt = { class: "tw-m-1.5 tw-cursor-default tw-p-1.5" }, ht = {
   class: "tw-m-1.5 tw-cursor-default tw-p-1.5",
   "data-test": "stash-select|no-options"
-}, dt = /* @__PURE__ */ xe({
+}, pt = /* @__PURE__ */ Ce({
   name: "ll-select",
   __name: "Select",
   props: {
     preventEmpty: { type: Boolean, default: !1 },
     allowEmpty: { type: [String, Boolean, null], default: null },
-    label: { default: "" },
     displayBy: { default: "name" },
     searchBy: { default: () => [] },
     trackBy: { default: "id" },
     placeholder: { default: "Select option" },
-    errorText: { default: "" },
     error: { default: "" },
-    hintText: { default: "" },
     hint: { default: "" },
     icon: { type: [String, Boolean], default: "caret-down" },
     name: { default: void 0 },
@@ -48,419 +45,436 @@ const Ze = ["id", "aria-errormessage", "aria-invalid", "disabled", "multiple", "
     searchable: { type: [String, Boolean, null], default: null },
     preserveSearchTerm: { type: Boolean, default: !1 },
     disableFiltering: { type: Boolean, default: !1 },
-    disabled: { type: Boolean, default: !1 },
     single: { type: Boolean, default: !1 },
     noTruncate: { type: Boolean, default: !1 },
     loading: { type: Boolean, default: !1 },
     searchLoading: { type: Boolean, default: !1 },
     selectItemType: { default: "" },
-    id: { default: "" },
     hideCheck: { type: Boolean, default: !1 },
-    showOptionalInLabel: { type: Boolean, default: !1 },
     searchPlaceholder: { default: "Search" },
     onSearch: { type: Function, default: void 0 },
-    addBottomSpace: { type: Boolean, default: !1 },
     useFuzzySearch: { type: Boolean, default: !1 },
     menuPlacement: { default: "bottom-start" },
     enableTeleport: { type: Boolean, default: !1 },
-    teleportTo: { default: `#${Ye}` }
+    teleportTo: { default: `#${Qe}` },
+    addBottomSpace: { type: Boolean },
+    errorText: {},
+    hintText: {},
+    id: {},
+    errorId: {},
+    isReadOnly: { type: Boolean },
+    isRequired: { type: Boolean },
+    label: {},
+    showOptionalInLabel: { type: Boolean },
+    fieldset: { type: Boolean },
+    isDisabled: { type: Boolean },
+    disabled: { type: Boolean }
   },
   emits: ["update:model-value", "clear", "add", "remove", "opened", "closed"],
   setup(ce, { emit: ue }) {
-    const e = ce, p = ue, H = Ce(), de = Ie(), Q = c(null), m = c(null), T = c(null), q = c(null), Z = c(null), N = c(0), x = c(0), n = c([]), ee = c(() => []), b = c(""), f = c(-1), u = c(!1), W = c({}), te = c(!1), { floatingStyles: fe } = He(Q, T, {
-      whileElementsMounted: Ne,
-      placement: e.menuPlacement,
+    const t = ce, p = ue, H = Oe(), de = Ie(), Q = c(null), m = c(null), x = c(null), q = c(null), Z = c(null), N = c(0), T = c(0), n = c([]), ee = c(() => []), w = c(""), v = c(-1), u = c(!1), W = c({}), te = c(!1), { floatingStyles: fe } = Ae(Q, x, {
+      whileElementsMounted: De,
+      placement: t.menuPlacement,
       middleware: [
-        Ae(),
-        Le(({ rects: t }) => e.menuPlacement.includes("bottom") && N.value > x.value ? N.value - t.reference.height + 6 : 6),
-        De({
-          apply({ availableHeight: t, elements: l, rects: s }) {
-            e.enableTeleport && Object.assign(l.floating.style, {
+        Le(),
+        Ue(({ rects: e }) => t.menuPlacement.includes("bottom") && N.value > T.value ? N.value - e.reference.height + 6 : 6),
+        Ve({
+          apply({ availableHeight: e, elements: l, rects: s }) {
+            t.enableTeleport && Object.assign(l.floating.style, {
               maxWidth: `${s.reference.width}px`,
-              maxHeight: `${Math.min(t, 300)}px`
+              maxHeight: `${Math.min(e, 300)}px`
             });
           }
         })
       ]
-    }), X = v(() => !e.hideSearch && e.searchable !== "false" && e.searchable !== !1), A = v(() => {
-      let t = (te.value && e.lazy ? e.lazy() : e.options).filter(Boolean);
-      return Ge(t[0]) || (t = t.map((l, s) => ({ name: l, id: s }))), t;
-    }), le = v(() => e.searchLoading || Object.keys(W.value).length > 0), C = v(() => e.disableFiltering || !(b.value || "").trim() ? A.value : ee.value(b.value)), he = v(() => N.value <= x.value), ve = v(
-      () => !u.value && !e.single && !he.value && n.value.length
-    ), pe = v(() => [n.value.length, e.selectItemType, "selected"].filter(Boolean).join(" ")), me = v(() => e.preventEmpty || e.allowEmpty === "false" || e.allowEmpty === !1);
-    U(b, (t, l) => l !== t && D(-1)), U(n, () => O(), { deep: !0 }), U(
-      () => e.modelValue,
-      (t) => {
-        if (Array.isArray(t)) {
-          const l = t.filter(Boolean);
+    }), X = h(() => !t.hideSearch && t.searchable !== "false" && t.searchable !== !1), A = h(() => {
+      let e = (te.value && t.lazy ? t.lazy() : t.options).filter(Boolean);
+      return qe(e[0]) || (e = e.map((l, s) => ({ name: l, id: s }))), e;
+    }), ve = h(() => n.value.length ? n.value.map((e) => e[t.displayBy] || e).join(", ") : ""), le = h(() => t.searchLoading || Object.keys(W.value).length > 0), C = h(() => t.disableFiltering || !(w.value || "").trim() ? A.value : ee.value(w.value)), he = h(() => N.value <= T.value), pe = h(
+      () => !u.value && !t.single && !he.value && n.value.length
+    ), me = h(() => [n.value.length, t.selectItemType, "selected"].filter(Boolean).join(" ")), ye = h(() => t.preventEmpty || t.allowEmpty === "false" || t.allowEmpty === !1);
+    U(w, (e, l) => l !== e && L(-1)), U(n, () => I(), { deep: !0 }), U(
+      () => t.modelValue,
+      (e) => {
+        if (Array.isArray(e)) {
+          const l = e.filter(Boolean);
           re(l, n.value) || (n.value = l);
           return;
         }
-        if (!Ve(t)) {
-          re(t, n.value[0]) || (n.value[0] = t);
+        if (!je(e)) {
+          re(e, n.value[0]) || (n.value[0] = e);
           return;
         }
         n.value = [];
       },
       { immediate: !0 }
     ), U(
-      () => e.options,
+      () => t.options,
       () => {
-        const { searchFor: t } = qe({
-          items: v(() => A.value),
-          fieldNames: e.searchBy.length ? e.searchBy : [e.displayBy],
-          trackBy: e.trackBy
+        const { searchFor: e } = Xe({
+          items: h(() => A.value),
+          fieldNames: t.searchBy.length ? t.searchBy : [t.displayBy],
+          trackBy: t.trackBy
         });
-        ee.value = (l) => t(l, { fuzzy: e.useFuzzySearch });
+        ee.value = (l) => e(l, { fuzzy: t.useFuzzySearch });
       },
       { immediate: !0 }
     );
-    const ye = () => {
-      n.value = [], p("update:model-value", e.single ? void 0 : n.value), p("clear");
-    }, L = (t) => {
-      e.disabled || !t || typeof t == "object" && "disabled" in t && (t != null && t.disabled) || (_(t) ? I(t) : (e.single && (n.value = []), n.value.push(t), p("update:model-value", e.single ? n.value[0] : n.value), p("add", t)), e.single && g());
-    }, be = (t) => {
-      if (e.single) {
-        const s = A.value.find((r) => {
+    const we = () => {
+      n.value = [], p("update:model-value", t.single ? void 0 : n.value), p("clear");
+    }, D = (e) => {
+      t.disabled || !e || typeof e == "object" && "disabled" in e && (e != null && e.disabled) || (B(e) ? O(e) : (t.single && (n.value = []), n.value.push(e), p("update:model-value", t.single ? n.value[0] : n.value), p("add", e)), t.single && b());
+    }, _e = (e) => {
+      if (t.single) {
+        const s = A.value.find((o) => {
           var i;
-          return ((i = r[e.trackBy]) == null ? void 0 : i.toString()) === t.target.value;
+          return ((i = o[t.trackBy]) == null ? void 0 : i.toString()) === e.target.value;
         });
-        L(s);
+        D(s);
         return;
       }
-      const l = [...t.target.selectedOptions];
+      const l = [...e.target.selectedOptions];
       for (const s of [...n.value])
         l.find((i) => {
           var a;
-          return i.value === ((a = s[e.trackBy]) == null ? void 0 : a.toString());
-        }) || I(s);
+          return i.value === ((a = s[t.trackBy]) == null ? void 0 : a.toString());
+        }) || O(s);
       for (const s of l) {
-        const r = A.value.find(
+        const o = A.value.find(
           (i) => {
             var a;
-            return ((a = i[e.trackBy]) == null ? void 0 : a.toString()) === s.value;
+            return ((a = i[t.trackBy]) == null ? void 0 : a.toString()) === s.value;
           }
         );
-        _(r) || L(r);
+        B(o) || D(o);
       }
-    }, I = (t) => {
-      if (e.disabled || me.value && n.value.length === 1)
+    }, O = (e) => {
+      if (t.disabled || ye.value && n.value.length === 1)
         return;
-      const l = n.value.findIndex((s) => s[e.trackBy] === t[e.trackBy]);
+      const l = n.value.findIndex((s) => s[t.trackBy] === e[t.trackBy]);
       if (l === -1) {
-        Ue.warn("ll-select: could not find option to remove", t);
+        Ke.warn("ll-select: could not find option to remove", e);
         return;
       }
-      n.value.splice(l, 1), p("update:model-value", e.single ? n.value[0] : n.value), p("remove", t, l);
+      n.value.splice(l, 1), p("update:model-value", t.single ? n.value[0] : n.value), p("remove", e, l);
     }, ae = () => {
-      u.value || (O(), u.value = !0, p("opened"), X.value && Y(() => {
-        var t;
-        (t = Z.value) == null || t.focus({ preventScroll: !0 });
+      u.value || (I(), u.value = !0, p("opened"), X.value && Y(() => {
+        var e;
+        (e = Z.value) == null || e.focus({ preventScroll: !0 });
       }));
-    }, g = () => {
-      var t;
-      u.value && p("closed", n.value), D(-1), u.value = !1, e.preserveSearchTerm || (b.value = ""), (t = m.value) == null || t.blur();
-    }, we = async (t) => {
+    }, b = () => {
+      var e;
+      u.value && p("closed", n.value), L(-1), u.value = !1, t.preserveSearchTerm || (w.value = ""), (e = m.value) == null || e.blur();
+    }, ge = async (e) => {
       if (await Y(), !m.value)
         return;
-      if (![E.ENTER, E.ESCAPE].includes(t.keyCode)) {
-        const s = m.value.querySelector(".stash-select__option--highlighted"), r = s == null ? void 0 : s.getBoundingClientRect(), i = m.value.getBoundingClientRect();
-        if (!r || !i)
+      if (![E.ENTER, E.ESCAPE].includes(e.keyCode)) {
+        const s = m.value.querySelector(".stash-select__option--highlighted"), o = s == null ? void 0 : s.getBoundingClientRect(), i = m.value.getBoundingClientRect();
+        if (!o || !i)
           return;
-        (r.bottom >= i.bottom || r.top <= i.top + r.height) && (s == null || s.scrollIntoView({ block: "nearest", inline: "nearest" }));
+        (o.bottom >= i.bottom || o.top <= i.top + o.height) && (s == null || s.scrollIntoView({ block: "nearest", inline: "nearest" }));
       }
-    }, D = (t) => {
-      f.value = t;
-    }, ge = (t) => {
-      if (t.keyCode === E.ESCAPE)
-        g();
-      else if (t.keyCode === E.DOWN && f.value < C.value.length - 1)
-        u.value && f.value++;
-      else if (t.keyCode === E.UP && f.value > 0)
-        u.value && f.value--, T.value && X.value && f.value === 0 && (T.value.scrollTop -= 100);
-      else if (t.keyCode === E.ENTER && f.value !== -1)
-        u.value && L(C.value[f.value]);
+    }, L = (e) => {
+      v.value = e;
+    }, be = (e) => {
+      if (e.keyCode === E.ESCAPE)
+        b();
+      else if (e.keyCode === E.DOWN && v.value < C.value.length - 1)
+        u.value && v.value++;
+      else if (e.keyCode === E.UP && v.value > 0)
+        u.value && v.value--, x.value && X.value && v.value === 0 && (x.value.scrollTop -= 100);
+      else if (e.keyCode === E.ENTER && v.value !== -1)
+        u.value && D(C.value[v.value]);
       else
         return;
-      t.preventDefault(), we(t);
-    }, se = Ke(function() {
-      _e();
-    }, We.FAST), _e = async function() {
-      if (!e.onSearch)
+      e.preventDefault(), ge(e);
+    }, se = Ge(function() {
+      Be();
+    }, Ye.FAST), Be = async function() {
+      if (!t.onSearch)
         return;
-      const t = je("search-request-");
+      const e = We("search-request-");
       try {
-        W.value[t] = !0, await e.onSearch(b.value);
+        W.value[e] = !0, await t.onSearch(w.value);
       } finally {
-        delete W.value[t];
+        delete W.value[e];
       }
-    }, ke = (t, l) => [
+    }, ke = (e, l) => [
       {
         "stash-select__option": !0,
-        "stash-select__option--disabled": t && typeof t == "object" && "disabled" in t && (t == null ? void 0 : t.disabled),
-        "stash-select__option--highlighted": f.value === l,
-        "stash-select__option--selected": _(t)
+        "stash-select__option--disabled": e && typeof e == "object" && "disabled" in e && (e == null ? void 0 : e.disabled),
+        "stash-select__option--highlighted": v.value === l,
+        "stash-select__option--selected": B(e)
       },
       // @deprecated
       {
-        "tw-bg-ice-200": f.value === l,
-        "tw-bg-blue-100 tw-text-ice-700": _(t)
+        "tw-bg-ice-200": v.value === l,
+        "tw-bg-blue-100 tw-text-ice-700": B(e)
       }
-    ], _ = (t) => t == null ? !1 : n.value.some((l) => (l == null ? void 0 : l[e.trackBy]) === t[e.trackBy]);
-    function ne(t) {
-      var r, i;
-      if (!t)
+    ], B = (e) => e == null ? !1 : n.value.some((l) => (l == null ? void 0 : l[t.trackBy]) === e[t.trackBy]);
+    function ne(e) {
+      var o, i;
+      if (!e)
         return !1;
-      const l = (r = m.value) == null ? void 0 : r.contains(t), s = (i = T.value) == null ? void 0 : i.contains(t);
+      const l = (o = m.value) == null ? void 0 : o.contains(e), s = (i = x.value) == null ? void 0 : i.contains(e);
       return l || s;
     }
-    function Be(t) {
-      const l = t.relatedTarget;
-      !ne(l) && l && g();
+    function Se(e) {
+      const l = e.relatedTarget;
+      !ne(l) && l && b();
     }
-    function Se(t) {
-      const l = t.target;
-      ne(l) || g();
+    function Ee(e) {
+      const l = e.target;
+      ne(l) || b();
     }
-    const Ee = () => {
-      D(-1);
-    }, O = async () => {
-      await Y(), q.value && m.value && (x.value = x.value === 0 ? m.value.clientHeight : x.value, N.value = q.value.clientHeight);
+    const xe = () => {
+      L(-1);
+    }, I = async () => {
+      await Y(), q.value && m.value && (T.value = T.value === 0 ? m.value.clientHeight : T.value, N.value = q.value.clientHeight);
     };
-    return Oe(() => {
+    return Me(() => {
       if (H.onInput)
         throw new Error("ll-select: use the @update:model-value event instead of @input.");
-      window.addEventListener("resize", O), O();
-    }), Me(() => {
-      window.removeEventListener("resize", O);
-    }), (t, l) => (o(), K(Je, {
-      id: e.id,
-      class: k(["input ll-select stash-select", y(H).class]),
+      window.addEventListener("resize", I), I();
+    }), Fe(() => {
+      window.removeEventListener("resize", I);
+    }), (e, l) => (r(), V(Ze, Re(t, {
+      class: ["input ll-select stash-select", y(H).class],
       "data-test": "stash-select",
-      "add-bottom-space": e.addBottomSpace,
-      "error-text": e.errorText || e.error,
-      "hint-text": e.hintText || e.hint,
-      label: e.label,
-      "show-optional-in-label": e.showOptionalInLabel,
-      disabled: e.disabled
-    }, Fe({
-      default: M(({ fieldId: s, fieldErrorId: r, hasError: i }) => [
-        h("select", {
-          id: s,
-          "aria-errormessage": r,
-          "aria-invalid": i,
-          class: "tw-sr-only",
-          disabled: e.disabled,
-          multiple: !e.single,
-          name: e.name,
-          onChange: be
-        }, [
-          (o(!0), d(V, null, G(C.value, (a, w) => (o(), d("option", {
-            key: `srOnlyOption-${w}`,
-            selected: _(a),
-            value: a[e.trackBy]
-          }, B(a[e.displayBy] || ""), 9, et))), 128)),
-          l[5] || (l[5] = h("option", { value: "" }, null, -1))
-        ], 40, Ze),
-        F((o(), d("div", {
-          ref_key: "selectRef",
-          ref: Q,
-          role: "listbox",
-          "aria-hidden": "true",
-          class: k(["stash-select__content-wrapper", [
-            {
-              "stash-select--disabled": !!e.disabled,
-              "stash-select--error": !!(e.errorText || e.error),
-              "stash-select--active": u.value,
-              "stash-select--single": e.single
-            },
-            // @deprecated
-            {
-              "is-active": u.value,
-              "is-single": e.single,
-              "is-disabled": e.disabled
-            }
-          ]]),
-          "aria-controls": "listbox-" + s,
-          "aria-expanded": u.value,
-          "aria-label": e.placeholder,
-          "aria-disabled": e.disabled || void 0,
-          onKeydown: ge,
-          onKeyup: oe(g, ["esc"])
-        }, [
-          h("div", {
-            id: "listbox-" + s,
-            ref_key: "contentRef",
-            ref: m,
-            class: "input-field stash-select__content",
-            tabindex: "0",
-            onFocusin: ae,
-            onFocusinOnce: l[4] || (l[4] = (a) => te.value = !0),
-            onFocusout: Be,
-            onKeydown: ae,
-            onMouseleave: Ee
+      "error-text": t.errorText || t.error,
+      "hint-text": t.hintText || t.hint
+    }), $e({ _: 2 }, [
+      t.isReadOnly ? {
+        name: "default",
+        fn: k(({ fieldId: s, labelId: o }) => [
+          d("div", tt, [
+            d("span", {
+              id: s,
+              "aria-labelledby": o,
+              class: "show-empty tw-h-min"
+            }, g(ve.value), 9, lt)
+          ])
+        ]),
+        key: "0"
+      } : {
+        name: "default",
+        fn: k(({ fieldId: s, fieldErrorId: o, hasError: i }) => [
+          d("select", {
+            id: s,
+            "aria-errormessage": o,
+            "aria-invalid": i,
+            class: "tw-sr-only",
+            disabled: t.disabled,
+            multiple: !t.single,
+            name: t.name,
+            onChange: _e
           }, [
-            h("ul", {
-              ref_key: "chipsRef",
-              ref: q,
-              class: "stash-select__chips"
+            (r(!0), f(K, null, G(C.value, (a, _) => (r(), f("option", {
+              key: `srOnlyOption-${_}`,
+              selected: B(a),
+              value: a[t.trackBy]
+            }, g(a[t.displayBy] || ""), 9, st))), 128)),
+            l[5] || (l[5] = d("option", { value: "" }, null, -1))
+          ], 40, at),
+          M((r(), f("div", {
+            ref_key: "selectRef",
+            ref: Q,
+            role: "listbox",
+            "aria-hidden": "true",
+            class: F(["stash-select__content-wrapper", [
+              {
+                "stash-select--disabled": !!t.disabled,
+                "stash-select--error": !!(t.errorText || t.error),
+                "stash-select--active": u.value,
+                "stash-select--single": t.single
+              },
+              // @deprecated
+              {
+                "is-active": u.value,
+                "is-single": t.single,
+                "is-disabled": t.disabled
+              }
+            ]]),
+            "aria-controls": "listbox-" + s,
+            "aria-expanded": u.value,
+            "aria-label": t.placeholder,
+            "aria-disabled": t.disabled || void 0,
+            onKeydown: be,
+            onKeyup: oe(b, ["esc"])
+          }, [
+            d("div", {
+              id: "listbox-" + s,
+              ref_key: "contentRef",
+              ref: m,
+              class: "input-field stash-select__content",
+              tabindex: "0",
+              onFocusin: ae,
+              onFocusinOnce: l[4] || (l[4] = (a) => te.value = !0),
+              onFocusout: Se,
+              onKeydown: ae,
+              onMouseleave: xe
             }, [
-              n.value.length ? R("", !0) : (o(), d("li", {
-                key: 0,
-                class: k(["stash-select__placeholder tw-mr-0 tw-pl-1.5", { "tw-truncate": !e.noTruncate }])
-              }, B(e.placeholder), 3)),
-              e.single ? (o(!0), d(V, { key: 1 }, G(n.value, (a) => (o(), d("li", {
-                key: `chip-${a[e.trackBy]}`,
-                class: k(["stash-select__selected tw-mr-0 tw-pl-1.5", { "tw-truncate": !e.noTruncate }])
-              }, [
-                j(t.$slots, "selected", { option: a }, () => [
-                  $(B(a[e.displayBy] || a) + " ", 1),
-                  h("button", {
-                    tabindex: "-1",
-                    class: "stash-select__remove",
-                    onKeypress: oe(P((w) => I(a), ["prevent"]), ["enter"]),
-                    onMousedown: P((w) => I(a), ["prevent", "stop"])
-                  }, [
-                    S(z, {
-                      icon: "close",
-                      name: "close",
-                      size: "small"
-                    })
-                  ], 40, at)
-                ], !0)
-              ], 2))), 128)) : (o(!0), d(V, { key: 2 }, G(n.value, (a) => (o(), d("li", {
-                key: `chip-${a[e.trackBy]}`,
-                class: "tw-inline-block"
+              d("ul", {
+                ref_key: "chipsRef",
+                ref: q,
+                class: "stash-select__chips"
               }, [
+                n.value.length ? R("", !0) : (r(), f("li", {
+                  key: 0,
+                  class: F(["stash-select__placeholder tw-mr-0 tw-pl-1.5", { "tw-truncate": !t.noTruncate }])
+                }, g(t.placeholder), 3)),
+                t.single ? (r(!0), f(K, { key: 1 }, G(n.value, (a) => (r(), f("li", {
+                  key: `chip-${a[t.trackBy]}`,
+                  class: F(["stash-select__selected tw-mr-0 tw-pl-1.5", { "tw-truncate": !t.noTruncate }])
+                }, [
+                  j(e.$slots, "selected", { option: a }, () => [
+                    $(g(a[t.displayBy] || a) + " ", 1),
+                    d("button", {
+                      tabindex: "-1",
+                      class: "stash-select__remove",
+                      onKeypress: oe(P((_) => O(a), ["prevent"]), ["enter"]),
+                      onMousedown: P((_) => O(a), ["prevent", "stop"])
+                    }, [
+                      S(z, {
+                        icon: "close",
+                        name: "close",
+                        size: "small"
+                      })
+                    ], 40, rt)
+                  ], !0)
+                ], 2))), 128)) : (r(!0), f(K, { key: 2 }, G(n.value, (a) => (r(), f("li", {
+                  key: `chip-${a[t.trackBy]}`,
+                  class: "tw-inline-block"
+                }, [
+                  S(ie, {
+                    "bg-color": "blue-500",
+                    "is-removable": "",
+                    "text-color": "white",
+                    class: "stash-select__chip",
+                    onRemove: (_) => O(a)
+                  }, {
+                    default: k(() => [
+                      $(g(a[t.displayBy] || a), 1)
+                    ]),
+                    _: 2
+                  }, 1032, ["onRemove"])
+                ]))), 128))
+              ], 512),
+              pe.value ? (r(), f("div", it, [
                 S(ie, {
                   "bg-color": "blue-500",
                   "is-removable": "",
                   "text-color": "white",
                   class: "stash-select__chip",
-                  onRemove: (w) => I(a)
+                  onRemove: we
                 }, {
-                  default: M(() => [
-                    $(B(a[e.displayBy] || a), 1)
+                  default: k(() => [
+                    $(g(me.value), 1)
                   ]),
-                  _: 2
-                }, 1032, ["onRemove"])
-              ]))), 128))
-            ], 512),
-            ve.value ? (o(), d("div", st, [
-              S(ie, {
-                "bg-color": "blue-500",
-                "is-removable": "",
-                "text-color": "white",
-                class: "stash-select__chip",
-                onRemove: ye
-              }, {
-                default: M(() => [
-                  $(B(pe.value), 1)
-                ]),
-                _: 1
-              })
-            ])) : R("", !0),
-            e.icon ? (o(), K(z, {
-              key: 1,
-              class: k(["stash-select__icon", { "tw-text-ice-500": e.disabled }]),
-              "data-test": "stash-select|toggle-icon",
-              name: e.icon,
-              onMousedown: l[0] || (l[0] = P((a) => u.value && g(), ["prevent"]))
-            }, null, 8, ["name", "class"])) : R("", !0),
-            (o(), K(Re, {
-              to: e.teleportTo,
-              disabled: !e.enableTeleport
-            }, [
-              S($e, { name: "fade" }, {
-                default: M(() => [
-                  F(h("div", {
-                    ref_key: "optionsWrapperRef",
-                    ref: T,
-                    class: "stash-select__border-selector tw-w-full tw-shadow-2xl",
-                    style: Pe(y(fe)),
-                    onClick: l[3] || (l[3] = P(() => {
-                    }, ["stop"]))
-                  }, [
-                    X.value ? (o(), d("div", nt, [
-                      F(h("input", {
-                        ref_key: "searchRef",
-                        ref: Z,
-                        "onUpdate:modelValue": l[1] || (l[1] = (a) => b.value = a),
-                        type: "text",
-                        autocomplete: "off",
-                        class: "stash-select__search",
-                        "data-test": y(H)["data-test"] ? y(H)["data-test"] + "-search" : "stash-select|search",
-                        placeholder: e.searchPlaceholder,
-                        spellcheck: !1,
-                        onInput: l[2] || (l[2] = //@ts-ignore
-                        (...a) => y(se) && y(se)(...a))
-                      }, null, 40, ot), [
-                        [ze, b.value]
-                      ]),
-                      S(z, {
-                        name: "search",
-                        class: "tw-text-ice-500"
-                      })
-                    ])) : R("", !0),
-                    h("ul", rt, [
-                      (o(!0), d(V, null, G(C.value, (a, w) => (o(), d("li", {
-                        key: `option-${a[e.trackBy]}`,
-                        "data-test": a[e.trackBy],
-                        class: k(ke(a, w)),
-                        onClick: (Te) => L(a),
-                        onMouseenter: P((Te) => D(w), ["self"])
-                      }, [
-                        j(t.$slots, "option", { option: a }, () => [
-                          $(B(a[e.displayBy] || a), 1)
-                        ], !0),
-                        _(a) && !e.hideCheck ? (o(), K(z, {
-                          key: 0,
-                          class: "tw-ml-auto tw-text-blue-500",
-                          name: "check"
-                        })) : R("", !0)
-                      ], 42, it))), 128)),
-                      F(h("li", ct, [
+                  _: 1
+                })
+              ])) : R("", !0),
+              t.icon ? (r(), V(z, {
+                key: 1,
+                class: F(["stash-select__icon", { "tw-text-ice-500": t.disabled }]),
+                "data-test": "stash-select|toggle-icon",
+                name: t.icon,
+                onMousedown: l[0] || (l[0] = P((a) => u.value && b(), ["prevent"]))
+              }, null, 8, ["name", "class"])) : R("", !0),
+              (r(), V(Pe, {
+                to: t.teleportTo,
+                disabled: !t.enableTeleport
+              }, [
+                S(ze, { name: "fade" }, {
+                  default: k(() => [
+                    M(d("div", {
+                      ref_key: "optionsWrapperRef",
+                      ref: x,
+                      class: "stash-select__border-selector tw-w-full tw-shadow-2xl",
+                      style: He(y(fe)),
+                      onClick: l[3] || (l[3] = P(() => {
+                      }, ["stop"]))
+                    }, [
+                      X.value ? (r(), f("div", ct, [
+                        M(d("input", {
+                          ref_key: "searchRef",
+                          ref: Z,
+                          "onUpdate:modelValue": l[1] || (l[1] = (a) => w.value = a),
+                          type: "text",
+                          autocomplete: "off",
+                          class: "stash-select__search",
+                          "data-test": y(H)["data-test"] ? y(H)["data-test"] + "-search" : "stash-select|search",
+                          placeholder: t.searchPlaceholder,
+                          spellcheck: !1,
+                          onInput: l[2] || (l[2] = //@ts-ignore
+                          (...a) => y(se) && y(se)(...a))
+                        }, null, 40, ut), [
+                          [Ne, w.value]
+                        ]),
                         S(z, {
-                          "data-test": "stash-select|options-loading",
-                          name: "working",
-                          class: "tw-animate-spin tw-text-ice-500"
+                          name: "search",
+                          class: "tw-text-ice-500"
                         })
-                      ], 512), [
-                        [J, e.loading || le.value]
-                      ]),
-                      F(h("li", ut, [
-                        j(t.$slots, "no-options", {}, () => [
-                          l[6] || (l[6] = $(" No options "))
-                        ], !0)
-                      ], 512), [
-                        [J, !e.loading && !le.value && !C.value.length]
+                      ])) : R("", !0),
+                      d("ul", dt, [
+                        (r(!0), f(K, null, G(C.value, (a, _) => (r(), f("li", {
+                          key: `option-${a[t.trackBy]}`,
+                          "data-test": a[t.trackBy],
+                          class: F(ke(a, _)),
+                          onClick: (Te) => D(a),
+                          onMouseenter: P((Te) => L(_), ["self"])
+                        }, [
+                          j(e.$slots, "option", { option: a }, () => [
+                            $(g(a[t.displayBy] || a), 1)
+                          ], !0),
+                          B(a) && !t.hideCheck ? (r(), V(z, {
+                            key: 0,
+                            class: "tw-ml-auto tw-text-blue-500",
+                            name: "check"
+                          })) : R("", !0)
+                        ], 42, ft))), 128)),
+                        M(d("li", vt, [
+                          S(z, {
+                            "data-test": "stash-select|options-loading",
+                            name: "working",
+                            class: "tw-animate-spin tw-text-ice-500"
+                          })
+                        ], 512), [
+                          [J, t.loading || le.value]
+                        ]),
+                        M(d("li", ht, [
+                          j(e.$slots, "no-options", {}, () => [
+                            l[6] || (l[6] = $(" No options "))
+                          ], !0)
+                        ], 512), [
+                          [J, !t.loading && !le.value && !C.value.length]
+                        ])
                       ])
+                    ], 4), [
+                      [J, u.value && !t.disabled]
                     ])
-                  ], 4), [
-                    [J, u.value && !e.disabled]
-                  ])
-                ]),
-                _: 3
-              })
-            ], 8, ["to", "disabled"]))
-          ], 40, lt)
-        ], 42, tt)), [
-          [y(Xe), Se]
-        ])
-      ]),
-      _: 2
-    }, [
+                  ]),
+                  _: 3
+                })
+              ], 8, ["to", "disabled"]))
+            ], 40, ot)
+          ], 42, nt)), [
+            [y(Je), Ee]
+          ])
+        ]),
+        key: "1"
+      },
       y(de).hint ? {
         name: "hint",
-        fn: M(() => [
-          j(t.$slots, "hint", {}, void 0, !0)
+        fn: k(() => [
+          j(e.$slots, "hint", {}, void 0, !0)
         ]),
-        key: "0"
+        key: "2"
       } : void 0
-    ]), 1032, ["id", "add-bottom-space", "class", "error-text", "hint-text", "label", "show-optional-in-label", "disabled"]));
+    ]), 1040, ["class", "error-text", "hint-text"]));
   }
-}), Ot = /* @__PURE__ */ Qe(dt, [["__scopeId", "data-v-173b2aea"]]);
+}), $t = /* @__PURE__ */ et(pt, [["__scopeId", "data-v-c1887a6c"]]);
 export {
-  Ot as default
+  $t as default
 };
 //# sourceMappingURL=Select.js.map