@leaflink/stash 52.0.3 → 53.1.0

package/dist/Select.js

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