@jblehm/super-list 1.0.30 → 1.0.32

package/dist/super-list.js

@@ -1,5 +1,5 @@
-import { defineComponent as Y, ref as p, computed as O, createElementBlock as M, openBlock as T, normalizeClass as R, withKeys as b, createElementVNode as N, useTemplateRef as Ee, watch as A, Fragment as ce, createCommentVNode as $, renderList as Se, withModifiers as oe, createBlock as fe, toDisplayString as me, useCssVars as Ae, onMounted as Le, onUnmounted as Fe, renderSlot as xe, createVNode as Z, nextTick as Ne, resolveDynamicComponent as Be, withCtx as be } from "vue";
-import './index.css';class He {
+import { defineComponent as G, ref as f, computed as O, createElementBlock as M, openBlock as T, withModifiers as Z, createElementVNode as F, normalizeClass as P, withKeys as h, useTemplateRef as ke, watch as A, Fragment as ce, createCommentVNode as $, renderList as Ee, createBlock as fe, toDisplayString as ve, useCssVars as Se, onMounted as we, onUnmounted as Ae, renderSlot as Le, createVNode as Y, nextTick as Fe, resolveDynamicComponent as Ne, withCtx as me } from "vue";
+import './index.css';class Be {
   eventsTypes = ["resize", "load", "scroll", "wheel", "touchmove"];
   config = {
     attributes: !0,
@@ -46,13 +46,13 @@ import './index.css';class He {
     window.removeEventListener("resize", this.callbackFunction);
   }
 }
-function Re(e, s, a, v) {
-  return s != null ? s(e) : e == null ? "" : typeof e == "object" ? e[a] : v ? Pe(e, v) : "" + e;
+function He(e, s, a, v) {
+  return s != null ? s(e) : e == null ? "" : typeof e == "object" ? e[a] : v ? Re(e, v) : "" + e;
 }
-function Pe(e, s) {
+function Re(e, s) {
   return s.find((a) => a.type === e)?.label ?? "";
 }
-class qe {
+class Pe {
   constructor() {
     this.abortController = new AbortController(), this.func = () => {
     }, this.then = () => {
@@ -79,7 +79,7 @@ class qe {
     return this.abort("New Request From Controller."), this.setFunc(s), this.setThen(a), this.execute();
   }
 }
-const je = ["tabindex", "placeholder", "size"], $e = /* @__PURE__ */ Y({
+const qe = ["tabindex", "placeholder", "size"], je = /* @__PURE__ */ G({
   __name: "ListTextInput",
   props: {
     enableTextFilter: {
@@ -109,76 +109,81 @@ const je = ["tabindex", "placeholder", "size"], $e = /* @__PURE__ */ Y({
     "update:press": null
   },
   setup(e, { expose: s, emit: a }) {
-    const v = a, o = e, d = p(null);
-    function w(h) {
-      "sourceCapabilities" in h && h.sourceCapabilities == null ? o.parentMethods.closeList() : o.parentMethods.openList();
+    const v = a, o = e, p = f(null);
+    function w(g) {
+      "sourceCapabilities" in g && g.sourceCapabilities == null ? o.parentMethods.closeList() : o.parentMethods.openList();
     }
-    function t(h) {
-      o.parentMethods.unfocus(h);
+    function t(g) {
+      o.parentMethods.unfocus(g);
     }
-    function i(h) {
-      h?.target?.value != null && v("update:query", h.target.value);
+    function i(g) {
+      g?.target?.value != null && v("update:query", g.target.value);
     }
-    const c = O(() => {
-      const h = d?.value ? d.value.length : 0, g = o.placeholder?.length || 0;
-      return h > 0 ? h : g > 0 ? g : 5;
+    const d = O(() => {
+      const g = p?.value ? p.value.length : 0, m = o.placeholder?.length || 0;
+      return g > 0 ? g : m > 0 ? m : 5;
     }), r = O(() => o.enableButtonClick === !0 && o.enableTextFilter === !0 ? "" : "click-through"), y = O(() => o.showDropDown && !o.enableTextFilter || !o.showDropDown ? "dark-placeholder-text" : "light-placeholder-text");
     function k() {
-      if (d?.value) {
-        const h = d.value;
-        h.blur(), h.value = "";
+      if (p?.value) {
+        const g = p.value;
+        g.blur(), g.value = "";
       }
     }
     function I() {
-      d?.value && d.value.focus();
+      p?.value && p.value.focus();
     }
-    return s({ blurInput: k, focusInput: I, textInputRef: d }), (h, g) => (T(), M("input", {
-      ref_key: "textInputRef",
-      ref: d,
-      tabindex: e.enableTextFilter ? 0 : -1,
-      onKeydown: [
-        g[0] || (g[0] = b((m) => e.parentMethods.press(m), ["enter"])),
-        g[1] || (g[1] = b((m) => e.parentMethods.press(), ["space"])),
-        g[2] || (g[2] = b((m) => e.parentMethods.press(m), ["esc"])),
-        g[3] || (g[3] = b((m) => e.parentMethods.press(m), ["up"])),
-        g[4] || (g[4] = b((m) => e.parentMethods.press(m), ["down"]))
-      ],
-      onFocusin: g[5] || (g[5] = (m) => w(m)),
-      onFocusout: g[6] || (g[6] = (m) => t(m)),
-      onInput: g[7] || (g[7] = (m) => i(m)),
-      type: "text",
-      "aria-autocomplete": "none",
-      autocomplete: "off",
-      placeholder: e.placeholder,
-      size: c.value,
-      class: R([[
-        r.value,
-        y.value,
-        { "text-filter-disabled": !e.enableTextFilter }
-      ], "list-filter-text-input"])
-    }, null, 42, je));
+    return s({ blurInput: k, focusInput: I, textInputRef: p }), (g, m) => (T(), M("form", {
+      onSubmit: m[8] || (m[8] = Z(() => {
+      }, ["prevent"]))
+    }, [
+      F("input", {
+        ref_key: "textInputRef",
+        ref: p,
+        tabindex: e.enableTextFilter ? 0 : -1,
+        onKeydown: [
+          m[0] || (m[0] = h((b) => e.parentMethods.press(b), ["enter"])),
+          m[1] || (m[1] = h((b) => e.parentMethods.press(), ["space"])),
+          m[2] || (m[2] = h((b) => e.parentMethods.press(b), ["esc"])),
+          m[3] || (m[3] = h((b) => e.parentMethods.press(b), ["up"])),
+          m[4] || (m[4] = h((b) => e.parentMethods.press(b), ["down"]))
+        ],
+        onFocusin: m[5] || (m[5] = (b) => w(b)),
+        onFocusout: m[6] || (m[6] = (b) => t(b)),
+        onInput: m[7] || (m[7] = (b) => i(b)),
+        type: "text",
+        "aria-autocomplete": "none",
+        autocomplete: "off",
+        placeholder: e.placeholder,
+        size: d.value,
+        class: P([[
+          r.value,
+          y.value,
+          { "text-filter-disabled": !e.enableTextFilter }
+        ], "list-filter-text-input"])
+      }, null, 42, qe)
+    ], 32));
   }
 }), K = (e, s) => {
   const a = e.__vccOpts || e;
   for (const [v, o] of s)
     a[v] = o;
   return a;
-}, he = /* @__PURE__ */ K($e, [["__scopeId", "data-v-acc7ac24"]]), Ke = {}, Ve = {
+}, be = /* @__PURE__ */ K(je, [["__scopeId", "data-v-97ab9870"]]), $e = {}, Ke = {
   xmlns: "http://www.w3.org/2000/svg",
   fill: "currentColor",
   "aria-hidden": "true",
   "data-slot": "icon",
   viewBox: "0 -16 16 17"
 };
-function ze(e, s) {
-  return T(), M("svg", Ve, s[0] || (s[0] = [
-    N("path", {
+function Ve(e, s) {
+  return T(), M("svg", Ke, s[0] || (s[0] = [
+    F("path", {
       "shape-rendering": "geometricPrecision",
       d: "M 6 -2.25 L 13.75 -14 A 0.5 0.5 90 0 1 15 -13 L 6.5 -0.5 A 2 1 90 0 1 5.5 -0.5 L 1 -6 A 0.5 0.5 90 0 1 2.25 -7 Z"
     }, null, -1)
   ]));
 }
-const Xe = /* @__PURE__ */ K(Ke, [["render", ze]]), Ue = ["onMousedown"], Je = { class: "list-item-span" }, We = { class: "list-item-span" }, Qe = /* @__PURE__ */ Y({
+const ze = /* @__PURE__ */ K($e, [["render", Ve]]), Xe = ["onMousedown"], Ue = { class: "list-item-span" }, Je = { class: "list-item-span" }, We = /* @__PURE__ */ G({
   __name: "ListItem",
   props: {
     mouseHoveringOnList: {
@@ -215,7 +220,7 @@ const Xe = /* @__PURE__ */ K(Ke, [["render", ze]]), Ue = ["onMousedown"], Je = {
     }
   },
   setup(e) {
-    const s = e, a = Ee("items"), v = O(() => {
+    const s = e, a = ke("items"), v = O(() => {
       if (!a?.value) return null;
       const t = (Array.isArray(a.value) ? a.value : [a.value])[s.focusedIndex];
       return t && typeof t == "object" && "scrollIntoView" in t && typeof t.scrollIntoView == "function" ? t : null;
@@ -225,91 +230,91 @@ const Xe = /* @__PURE__ */ K(Ke, [["render", ze]]), Ue = ["onMousedown"], Je = {
       () => o()
     ), A(
       () => s.listElementOpenAndVisible,
-      () => d()
+      () => p()
     ), A(
       () => v.value,
-      () => d()
+      () => p()
     );
     function o() {
       !s.showDropDown || !v?.value?.parentElement?.parentElement || (v.value.parentElement.parentElement.scrollTop = v.value.offsetTop);
     }
-    function d() {
+    function p() {
       const w = v.value, t = w?.parentElement?.parentElement;
       if (!s.showDropDown || !w || !t) return;
-      const i = w.offsetTop - t.scrollTop < 0, c = w.offsetTop + w.offsetHeight - t.scrollTop > t.clientHeight;
-      i && (t.scrollTop = w.offsetTop), c && (t.scrollTop = w.offsetTop + w.clientHeight - t.clientHeight);
+      const i = w.offsetTop - t.scrollTop < 0, d = w.offsetTop + w.offsetHeight - t.scrollTop > t.clientHeight;
+      i && (t.scrollTop = w.offsetTop), d && (t.scrollTop = w.offsetTop + w.clientHeight - t.clientHeight);
     }
     return (w, t) => (T(), M(ce, null, [
-      (T(!0), M(ce, null, Se(e.filteredListItems, (i, c) => (T(), M("li", {
-        key: c,
+      (T(!0), M(ce, null, Ee(e.filteredListItems, (i, d) => (T(), M("li", {
+        key: d,
         ref_for: !0,
         ref: "items",
         onKeyup: [
-          t[0] || (t[0] = b((r) => e.parentMethods.press(r), ["enter"])),
-          t[1] || (t[1] = b((r) => e.parentMethods.press(r), ["space"])),
-          t[2] || (t[2] = b((r) => e.parentMethods.press(r), ["esc"]))
+          t[0] || (t[0] = h((r) => e.parentMethods.press(r), ["enter"])),
+          t[1] || (t[1] = h((r) => e.parentMethods.press(r), ["space"])),
+          t[2] || (t[2] = h((r) => e.parentMethods.press(r), ["esc"]))
         ],
         onKeydown: [
-          t[3] || (t[3] = b((r) => e.parentMethods.press(r), ["up"])),
-          t[4] || (t[4] = b((r) => e.parentMethods.press(r), ["down"]))
+          t[3] || (t[3] = h((r) => e.parentMethods.press(r), ["up"])),
+          t[4] || (t[4] = h((r) => e.parentMethods.press(r), ["down"]))
         ],
         onFocusout: t[5] || (t[5] = (r) => e.parentMethods.unfocus(r)),
         tabindex: "-1",
-        onMousedown: oe((r) => e.parentMethods.updatedSelected(i), ["left"]),
-        class: R([
-          { "list-option-selected": e.selectedIndex === c },
+        onMousedown: Z((r) => e.parentMethods.updatedSelected(i), ["left"]),
+        class: P([
+          { "list-option-selected": e.selectedIndex === d },
           {
-            "list-option-active": e.filteredListItems.length === 1 || e.focusedIndex === c && !e.mouseHoveringOnList
+            "list-option-active": e.filteredListItems.length === 1 || e.focusedIndex === d && !e.mouseHoveringOnList
           },
           "list-option"
         ])
       }, [
-        N("span", Je, me(e.parentMethods.getLabel(i)), 1),
-        e.selectedIndex === c ? (T(), fe(Xe, {
+        F("span", Ue, ve(e.parentMethods.getLabel(i)), 1),
+        e.selectedIndex === d ? (T(), fe(ze, {
           key: 0,
           class: "list-item-icon",
           "aria-hidden": "true"
         })) : $("", !0)
-      ], 42, Ue))), 128)),
+      ], 42, Xe))), 128)),
       e.filteredListItems.length === 0 ? (T(), M("li", {
         key: 0,
         onKeyup: [
-          t[6] || (t[6] = b((i) => e.parentMethods.press(i), ["enter"])),
-          t[7] || (t[7] = b((i) => e.parentMethods.press(i), ["space"])),
-          t[8] || (t[8] = b((i) => e.parentMethods.press(i), ["esc"]))
+          t[6] || (t[6] = h((i) => e.parentMethods.press(i), ["enter"])),
+          t[7] || (t[7] = h((i) => e.parentMethods.press(i), ["space"])),
+          t[8] || (t[8] = h((i) => e.parentMethods.press(i), ["esc"]))
         ],
         onKeydown: [
-          t[9] || (t[9] = b((i) => e.parentMethods.press(i), ["up"])),
-          t[10] || (t[10] = b((i) => e.parentMethods.press(i), ["down"]))
+          t[9] || (t[9] = h((i) => e.parentMethods.press(i), ["up"])),
+          t[10] || (t[10] = h((i) => e.parentMethods.press(i), ["down"]))
         ],
         onFocusout: t[11] || (t[11] = (i) => e.parentMethods.unfocus(i)),
-        onMousedown: t[12] || (t[12] = oe((i) => e.parentMethods.closeList(i), ["left"])),
+        onMousedown: t[12] || (t[12] = Z((i) => e.parentMethods.closeList(i), ["left"])),
         tabindex: "-1",
         class: "list-option-message"
       }, t[20] || (t[20] = [
-        N("span", { class: "list-item-span" }, "No Items To Display.", -1)
+        F("span", { class: "list-item-span" }, "No Items To Display.", -1)
       ]), 32)) : $("", !0),
       e.totalOptionsCount && e.totalOptionsCount > (e.filteredListItems?.length || 0) ? (T(), M("li", {
         key: 1,
         onKeyup: [
-          t[13] || (t[13] = b((i) => e.parentMethods.press(i), ["enter"])),
-          t[14] || (t[14] = b((i) => e.parentMethods.press(i), ["space"])),
-          t[15] || (t[15] = b((i) => e.parentMethods.press(i), ["esc"]))
+          t[13] || (t[13] = h((i) => e.parentMethods.press(i), ["enter"])),
+          t[14] || (t[14] = h((i) => e.parentMethods.press(i), ["space"])),
+          t[15] || (t[15] = h((i) => e.parentMethods.press(i), ["esc"]))
         ],
         onKeydown: [
-          t[16] || (t[16] = b((i) => e.parentMethods.press(i), ["up"])),
-          t[17] || (t[17] = b((i) => e.parentMethods.press(i), ["down"]))
+          t[16] || (t[16] = h((i) => e.parentMethods.press(i), ["up"])),
+          t[17] || (t[17] = h((i) => e.parentMethods.press(i), ["down"]))
         ],
         onFocusout: t[18] || (t[18] = (i) => e.parentMethods.unfocus(i)),
-        onMousedown: t[19] || (t[19] = oe((i) => e.parentMethods.closeList(i), ["left"])),
+        onMousedown: t[19] || (t[19] = Z((i) => e.parentMethods.closeList(i), ["left"])),
         tabindex: "-1",
         class: "list-option-message"
       }, [
-        N("span", We, " +" + me(e.totalOptionsCount - e.filteredListItems?.length || 0) + " More Items...", 1)
+        F("span", Je, " +" + ve(e.totalOptionsCount - e.filteredListItems?.length || 0) + " More Items...", 1)
       ], 32)) : $("", !0)
     ], 64));
   }
-}), Ze = /* @__PURE__ */ K(Qe, [["__scopeId", "data-v-e4eeb2f7"]]), Ye = /* @__PURE__ */ Y({
+}), Qe = /* @__PURE__ */ K(We, [["__scopeId", "data-v-e4eeb2f7"]]), Ze = /* @__PURE__ */ G({
   __name: "ItemList",
   props: {
     mouseHoveringOnList: {
@@ -359,53 +364,53 @@ const Xe = /* @__PURE__ */ K(Ke, [["render", ze]]), Ue = ["onMousedown"], Je = {
   },
   emits: ["reverseDropDownList"],
   setup(e, { expose: s, emit: a }) {
-    Ae((u) => ({
+    Se((u) => ({
       "8d801350": k.value,
-      "2724698a": F.value,
+      "2724698a": N.value,
       "27246d4b": se.value,
-      ffcaa9a8: q.value,
-      "414dd276": G.value
+      ffcaa9a8: j.value,
+      "414dd276": _.value
     }));
-    const v = a, o = e, d = p(null), w = p(null), t = p(null), i = p(0), c = p(0), r = p(0), y = p(0), k = p("0px"), I = p(!1), h = p([]), g = p(0), m = O(() => !I.value || window?.innerHeight == null ? !1 : X() && le()), V = O(() => o.maxListHeightPX >= g.value);
+    const v = a, o = e, p = f(null), w = f(null), t = f(null), i = f(0), d = f(0), r = f(0), y = f(0), k = f("0px"), I = f(!1), g = f([]), m = f(0), b = O(() => !I.value || window?.innerHeight == null ? !1 : U() && le()), V = O(() => o.maxListHeightPX >= m.value);
     A(
-      () => m.value,
+      () => b.value,
       (u) => v("reverseDropDownList", u),
       { immediate: !0 }
     );
-    const F = O(() => i.value + "px"), se = O(() => y.value + "px");
+    const N = O(() => i.value + "px"), se = O(() => y.value + "px");
     s({ listContainerRef: t });
-    const P = (u) => {
+    const q = (u) => {
       u?.key && u.key === " " && u.preventDefault();
     }, ie = (u) => {
       const L = t?.value, x = u.target;
       (!(L && x && L.contains(x)) || L.isEqualNode(x)) && o.parentMethods.focusInput();
     };
-    function B() {
+    function H() {
       return w?.value ? (w?.value).clientHeight : 0;
     }
     function E() {
-      if (!I.value || B() === 0) return o.maxListHeightPX;
-      const u = B() === 0 ? o.maxListHeightPX : +B();
+      if (!I.value || H() === 0) return o.maxListHeightPX;
+      const u = H() === 0 ? o.maxListHeightPX : +H();
       return o.maxListHeightPX && o.maxListHeightPX > u ? u : o.maxListHeightPX;
     }
-    function X() {
-      return c.value > E();
+    function U() {
+      return d.value > E();
     }
     function le() {
       return r.value < E();
     }
-    const G = O(() => (o.maxListHeightPX || 0) + "px"), q = O(() => (o.listAnimationDurationMs || 0) + "ms"), _ = O(() => o.blockListChange ? h.value : o.filteredListItems);
+    const _ = O(() => (o.maxListHeightPX || 0) + "px"), j = O(() => (o.listAnimationDurationMs || 0) + "ms"), ee = O(() => o.blockListChange ? g.value : o.filteredListItems);
     A(
-      () => _,
+      () => ee,
       (u) => {
-        u && (h.value = u.value);
+        u && (g.value = u.value);
       },
       { immediate: !1, deep: !0 }
     );
     let C = setTimeout(() => {
     }, 0), S = null;
-    function j() {
-      g.value = B(), clearTimeout(C), S && S.observe(), I.value = !0, z(void 0);
+    function B() {
+      m.value = H(), clearTimeout(C), S && S.observe(), I.value = !0, z(void 0);
     }
     function re() {
       clearTimeout(C), C = setTimeout(() => {
@@ -415,78 +420,78 @@ const Xe = /* @__PURE__ */ K(Ke, [["render", ze]]), Ue = ["onMousedown"], Je = {
     A(
       () => o.showDropDown,
       (u, L) => {
-        u !== L && (U(), u ? j() : re());
+        u !== L && (J(), u ? B() : re());
       },
       { immediate: !0 }
     );
     function z(u) {
-      U(), Ne(() => U()), ee(u);
+      J(), Fe(() => J()), te(u);
     }
-    function ee(u) {
-      if (!o.enableScrollClose || !o.showDropDown || typeof t?.value?.contains != "function" || u?.target?.nodeType == null || te(u)) return;
+    function te(u) {
+      if (!o.enableScrollClose || !o.showDropDown || typeof t?.value?.contains != "function" || u?.target?.nodeType == null || ne(u)) return;
       const x = ["scroll", "wheel", "touchmove"].includes(u?.type);
       o.showDropDown && x && o.parentMethods.closeList();
     }
-    function te(u) {
-      const L = !!d.value?.contains(u?.target), x = !!t.value?.contains(u.target), Q = [u?.srcElement?.id, u?.target?.id].includes("super-list-select-list");
-      return L || x || Q;
-    }
-    function U() {
-      J(), W();
+    function ne(u) {
+      const L = !!p.value?.contains(u?.target), x = !!t.value?.contains(u.target), X = [u?.srcElement?.id, u?.target?.id].includes("super-list-select-list");
+      return L || x || X;
     }
     function J() {
-      if (d?.value == null) return;
-      const u = d.value.getBoundingClientRect();
-      c.value = u.top, r.value = window.innerHeight - u.bottom, k.value = u.width + "px";
+      W(), Q();
     }
     function W() {
-      if (d?.value == null || t?.value == null) return;
-      const u = ne().getBoundingClientRect(), L = t.value.getBoundingClientRect(), x = y.value, Q = i.value;
-      m.value ? y.value = x - (u.top - L.bottom) : y.value = x - (L.top - u.bottom), i.value = Q - (L.left - u.left);
+      if (p?.value == null) return;
+      const u = p.value.getBoundingClientRect();
+      d.value = u.top, r.value = window.innerHeight - u.bottom, k.value = u.width + "px";
+    }
+    function Q() {
+      if (p?.value == null || t?.value == null) return;
+      const u = oe().getBoundingClientRect(), L = t.value.getBoundingClientRect(), x = y.value, X = i.value;
+      b.value ? y.value = x - (u.top - L.bottom) : y.value = x - (L.top - u.bottom), i.value = X - (L.left - u.left);
     }
     function ue() {
-      return (d?.value).getElementsByTagName("button")[0];
+      return (p?.value).getElementsByTagName("button")[0];
     }
-    function ne() {
-      return d?.value;
+    function oe() {
+      return p?.value;
     }
-    return Le(() => {
-      S = new He(z, ue()), setTimeout(() => z(void 0), 250);
-    }), Fe(() => {
+    return we(() => {
+      S = new Be(z, ue()), setTimeout(() => z(void 0), 250);
+    }), Ae(() => {
       S?.unobserve();
     }), (u, L) => (T(), M(ce, null, [
-      N("div", {
+      F("div", {
         ref_key: "dropDownButtonContainer",
-        ref: d,
+        ref: p,
         class: "super-list-button-container"
       }, [
-        xe(u.$slots, "default", {}, void 0, !0)
+        Le(u.$slots, "default", {}, void 0, !0)
       ], 512),
-      N("div", {
+      F("div", {
         id: "super-list-select-list",
         ref_key: "listContainerRef",
         ref: t,
         onMouseenter: L[0] || (L[0] = (x) => e.parentMethods.mouseOverList()),
         tabindex: "-1",
-        class: R([
+        class: P([
           "select-list",
-          m.value ? "list-reverse" : "list-normal",
+          b.value ? "list-reverse" : "list-normal",
           { "select-list-open": e.showDropDown },
           { "no-scroll": V.value && I.value },
           { "select-list-fixed": I.value },
           { "select-list-scrollable": !V.value }
         ]),
-        onKeydown: L[1] || (L[1] = b((x) => P(x), ["space"])),
-        onMouseup: L[2] || (L[2] = oe((x) => ie(x), ["left"]))
+        onKeydown: L[1] || (L[1] = h((x) => q(x), ["space"])),
+        onMouseup: L[2] || (L[2] = Z((x) => ie(x), ["left"]))
       }, [
-        N("ul", {
+        F("ul", {
           tabindex: "-1",
           ref_key: "dropDownListUL",
           ref: w,
           class: "list-content"
         }, [
-          Z(Ze, {
-            filteredListItems: h.value,
+          Y(Qe, {
+            filteredListItems: g.value,
             mouseHoveringOnList: e.mouseHoveringOnList,
             focusedIndex: e.focusedIndex,
             selectedIndex: e.selectedIndex,
@@ -499,25 +504,25 @@ const Xe = /* @__PURE__ */ K(Ke, [["render", ze]]), Ue = ["onMousedown"], Je = {
       ], 34)
     ], 64));
   }
-}), ge = /* @__PURE__ */ K(Ye, [["__scopeId", "data-v-e58cd48c"]]), Ge = {}, _e = {
+}), he = /* @__PURE__ */ K(Ze, [["__scopeId", "data-v-e58cd48c"]]), Ye = {}, Ge = {
   xmlns: "http://www.w3.org/2000/svg",
   fill: "currentColor",
   "aria-hidden": "true",
   "data-slot": "icon",
   viewBox: "0 0 12 6"
 };
-function et(e, s) {
-  return T(), M("svg", _e, s[0] || (s[0] = [
-    N("path", {
+function _e(e, s) {
+  return T(), M("svg", Ge, s[0] || (s[0] = [
+    F("path", {
       "shape-rendering": "geometricPrecision",
       d: "M 6 4 L 10 0.25 A 0.5 0.5 90 0 1 11 1.25 L 6.5 5.75 A 15 3 90 0 1 5.5 5.75 L 1 1.25 A 0.5 0.5 90 0 1 2 0.25 Z"
     }, null, -1)
   ]));
 }
-const ye = /* @__PURE__ */ K(Ge, [["render", et]]), tt = ["tabindex"], nt = {
+const ge = /* @__PURE__ */ K(Ye, [["render", _e]]), et = ["tabindex"], tt = {
   key: 2,
   class: "list-button-icon custom-icon"
-}, ot = /* @__PURE__ */ Y({
+}, nt = /* @__PURE__ */ G({
   __name: "ListButton",
   props: {
     // eslint-disable-line
@@ -543,15 +548,15 @@ const ye = /* @__PURE__ */ K(Ge, [["render", et]]), tt = ["tabindex"], nt = {
     }
   },
   setup(e, { expose: s }) {
-    const a = e, v = p(null);
+    const a = e, v = f(null);
     function o() {
       a.enableTextFilter || a.parentMethods.openList();
     }
-    function d(c) {
-      a.enableTextFilter ? (a.parentMethods.focusInput(), c.stopPropagation(), c.preventDefault()) : a.parentMethods.press(c);
+    function p(d) {
+      a.enableTextFilter ? (a.parentMethods.focusInput(), d.stopPropagation(), d.preventDefault()) : a.parentMethods.press(d);
     }
-    function w(c) {
-      a.enableTextFilter || a.parentMethods.press(c);
+    function w(d) {
+      a.enableTextFilter || a.parentMethods.press(d);
     }
     function t() {
       v?.value && v.value.blur();
@@ -559,48 +564,48 @@ const ye = /* @__PURE__ */ K(Ge, [["render", et]]), tt = ["tabindex"], nt = {
     function i() {
       v?.value && v.value.focus();
     }
-    return s({ blurInput: t, focusInput: i, buttonRef: v }), (c, r) => (T(), M("button", {
+    return s({ blurInput: t, focusInput: i, buttonRef: v }), (d, r) => (T(), M("button", {
       ref_key: "buttonRef",
       ref: v,
       tabindex: e.enableTextFilter ? -1 : 0,
       onKeydown: [
-        r[0] || (r[0] = b((y) => d(y), ["enter"])),
-        r[1] || (r[1] = b((y) => w(y), ["space"])),
-        r[2] || (r[2] = b((y) => e.parentMethods.press(y), ["esc"])),
-        r[3] || (r[3] = b((y) => e.parentMethods.press(y), ["up"])),
-        r[4] || (r[4] = b((y) => e.parentMethods.press(y), ["down"]))
+        r[0] || (r[0] = h((y) => p(y), ["enter"])),
+        r[1] || (r[1] = h((y) => w(y), ["space"])),
+        r[2] || (r[2] = h((y) => e.parentMethods.press(y), ["esc"])),
+        r[3] || (r[3] = h((y) => e.parentMethods.press(y), ["up"])),
+        r[4] || (r[4] = h((y) => e.parentMethods.press(y), ["down"]))
       ],
       onFocusout: r[5] || (r[5] = (y) => e.parentMethods.unfocus(y)),
       onClick: r[6] || (r[6] = (y) => o()),
       type: "button",
-      class: R([[{ "click-through": a.enableTextFilter || a.showDropDown }], "list-button"])
+      class: P([[{ "click-through": a.enableTextFilter || a.showDropDown }], "list-button"])
     }, [
-      xe(c.$slots, "default", {}, void 0, !0),
-      N("span", {
-        class: R(["list-button-icon-div", { "bigger-gap": a.showDropDown }])
+      Le(d.$slots, "default", {}, void 0, !0),
+      F("span", {
+        class: P(["list-button-icon-div", { "bigger-gap": a.showDropDown }])
       }, [
         e.customIcon ? $("", !0) : (T(), M("span", {
           key: 0,
-          class: R(["list-button-icon", [{ "rotate-180": !a.showDropDown }]])
+          class: P(["list-button-icon", [{ "rotate-180": !a.showDropDown }]])
         }, [
-          Z(ye, { "aria-hidden": "true" })
+          Y(ge, { "aria-hidden": "true" })
         ], 2)),
         e.customIcon ? $("", !0) : (T(), M("span", {
           key: 1,
-          class: R(["list-button-icon", [{ "rotate-180": a.showDropDown }]])
+          class: P(["list-button-icon", [{ "rotate-180": a.showDropDown }]])
         }, [
-          e.customIcon == null ? (T(), fe(ye, {
+          e.customIcon == null ? (T(), fe(ge, {
             key: 0,
             "aria-hidden": "true"
           })) : $("", !0)
         ], 2)),
-        e.customIcon ? (T(), M("span", nt, [
-          (T(), fe(Be(e.customIcon), { "aria-hidden": "true" }))
+        e.customIcon ? (T(), M("span", tt, [
+          (T(), fe(Ne(e.customIcon), { "aria-hidden": "true" }))
         ])) : $("", !0)
       ], 2)
-    ], 42, tt));
+    ], 42, et));
   }
-}), we = /* @__PURE__ */ K(ot, [["__scopeId", "data-v-01ef8e37"]]), st = /* @__PURE__ */ Y({
+}), ye = /* @__PURE__ */ K(nt, [["__scopeId", "data-v-01ef8e37"]]), ot = /* @__PURE__ */ G({
   __name: "super-list",
   props: {
     selected: {
@@ -657,38 +662,38 @@ const ye = /* @__PURE__ */ K(Ge, [["render", et]]), tt = ["tabindex"], nt = {
   },
   emits: { "update:selected": null },
   setup(e, { expose: s, emit: a }) {
-    const v = a, o = e, d = p([]), w = new qe(), t = p(0), i = O(() => o.forceTextFilterVisibilityTo != null ? o.forceTextFilterVisibilityTo : t.value > o.maxListOptions), c = p(!1), r = p(!1), y = p(!1), k = p(!0), I = p(!1), h = p(!1), g = p(ge), m = p(he), V = p(we), F = p("");
+    const v = a, o = e, p = f([]), w = new Pe(), t = f(0), i = O(() => o.forceTextFilterVisibilityTo != null ? o.forceTextFilterVisibilityTo : t.value > o.maxListOptions), d = f(!1), r = f(!1), y = f(!1), k = f(!0), I = f(!1), g = f(!1), m = f(he), b = f(be), V = f(ye), N = f("");
     A(
-      () => F.value,
+      () => N.value,
       (n, l) => {
         n !== l && typeof o.options == "function" && x(n);
       }
     );
     const se = () => {
-      i.value && m?.value?.blurInput();
-    }, P = () => {
-      clearTimeout(W), se(), F.value = "", c.value = !1, k.value = !0;
-    }, ie = O(() => h?.value === !0 ? "Error loading data" : I?.value === !0 ? "Loading..." : E(o.selected)), B = (n) => {
-      n && v("update:selected", n), P();
-    }, E = (n) => Re(
+      i.value && b?.value?.blurInput();
+    }, q = () => {
+      clearTimeout(Q), se(), N.value = "", d.value = !1, k.value = !0;
+    }, ie = O(() => g?.value === !0 ? "Error loading data" : I?.value === !0 ? "Loading..." : E(o.selected)), H = (n) => {
+      n && v("update:selected", n), q();
+    }, E = (n) => He(
       n,
       o.customPlaceHolderFunction,
       o.objectLabelKeyName,
       o.enumKeyToLabelObjectArray
     );
-    function X() {
-      throw I.value = !0, h.value = !0, new Error("Invalid options argument provided to ListInputComponent");
+    function U() {
+      throw I.value = !0, g.value = !0, new Error("Invalid options argument provided to ListInputComponent");
     }
     function le() {
-      throw I.value = !0, h.value = !0, new Error("Invalid response provided to ListInputComponent, no total count key found");
+      throw I.value = !0, g.value = !0, new Error("Invalid response provided to ListInputComponent, no total count key found");
     }
-    function G() {
-      throw I.value = !0, h.value = !0, new Error("Invalid objectLabelKeyName for provided Dropdown list value.");
+    function _() {
+      throw I.value = !0, g.value = !0, new Error("Invalid objectLabelKeyName for provided Dropdown list value.");
     }
-    Le(() => {
-      typeof o.options != "function" && !Array.isArray(o.options) ? X() : u();
+    we(() => {
+      typeof o.options != "function" && !Array.isArray(o.options) ? U() : u();
     });
-    const q = p(!1), _ = p(0), C = p(0), S = p(0);
+    const j = f(!1), ee = f(0), C = f(0), S = f(0);
     A(
       () => C.value,
       (n, l) => {
@@ -702,167 +707,168 @@ const ye = /* @__PURE__ */ K(Ge, [["render", et]]), tt = ["tabindex"], nt = {
       },
       { immediate: !0 }
     );
-    const j = O(() => {
-      if (typeof o.options == "function" && !Array.isArray(o.options)) return d.value;
-      const n = F.value, l = d.value;
-      return n === "" ? l : l.filter((f) => E(f).toLowerCase().includes(n.toLowerCase()));
+    const B = O(() => {
+      if (typeof o.options == "function" && !Array.isArray(o.options)) return p.value;
+      const n = N.value, l = p.value;
+      return n === "" ? l : l.filter((c) => E(c).toLowerCase().includes(n.toLowerCase()));
     });
     A(
-      () => j.value,
+      () => B.value,
       (n, l) => {
         JSON.stringify(n) !== JSON.stringify(l) && z();
       },
       { immediate: !1, deep: !0 }
     );
     const re = () => {
-      q.value = !0;
+      j.value = !0;
     }, z = () => {
-      const n = ee();
-      _.value = n, C.value = n > -1 ? n : 0;
+      const n = te();
+      ee.value = n, C.value = n > -1 ? n : 0;
     };
-    function ee() {
+    function te() {
       if (o.selected == null) return -1;
-      const n = d.value.map((f) => E(f)), l = n.filter((f) => f === E(o.selected));
+      const n = B.value.map((c) => E(c)), l = n.filter((c) => c === E(o.selected));
       if (l.length > 1) {
-        const f = l.map((D) => n.indexOf(D));
-        for (let D = 0; D < f.length; D++) {
-          const H = JSON.stringify(d.value[f[D]]), de = JSON.stringify(o.selected);
-          if (H === de) return f[D];
+        const c = l.map((D) => n.indexOf(D));
+        for (let D = 0; D < c.length; D++) {
+          const R = JSON.stringify(
+            B.value[c[D]]
+          ), de = JSON.stringify(o.selected);
+          if (R === de) return c[D];
         }
         return -1;
       }
       return n.indexOf(E(o.selected));
     }
-    const te = () => {
-      I.value || (c.value || (r.value = !1, z(), U(), c.value = !0), q.value = !1, k.value = !1);
-    }, U = () => {
-      const n = window?.innerWidth != null && window.innerWidth < 640, l = screen?.width != null && screen.width < 640, f = m.value.textInputRef;
-      (n || l) && i.value && (ue(), o.scrollTextInputToTopOnMobile && f?.scrollIntoView({ block: "start", inline: "center" }));
-    }, J = p(!0);
-    let W = setTimeout(() => {
+    const ne = () => {
+      I.value || (d.value || (r.value = !1, z(), J(), d.value = !0), j.value = !1, k.value = !1);
+    }, J = () => {
+      const n = window?.innerWidth != null && window.innerWidth < 640, l = screen?.width != null && screen.width < 640, c = b.value.textInputRef;
+      (n || l) && i.value && (ue(), o.scrollTextInputToTopOnMobile && c?.scrollIntoView({ block: "start", inline: "center" }));
+    }, W = f(!0);
+    let Q = setTimeout(() => {
     }, 0);
     function ue() {
-      const n = m.value.textInputRef;
+      const n = b.value.textInputRef;
       if (!n) return;
-      J.value = !1;
+      W.value = !1;
       let l = null;
-      const f = () => {
-        l && clearInterval(l), clearTimeout(W), setTimeout(() => {
-          J.value = !0;
+      const c = () => {
+        l && clearInterval(l), clearTimeout(Q), setTimeout(() => {
+          W.value = !0;
         }, 100);
       };
-      W = setTimeout(f, 5e3), l = setInterval(() => {
-        (c.value === !1 || n?.scrollTop === 0 && document.readyState === "complete") && f();
+      Q = setTimeout(c, 5e3), l = setInterval(() => {
+        (d.value === !1 || n?.scrollTop === 0 && document.readyState === "complete") && c();
       }, 100);
     }
-    const ne = () => {
-      i?.value == !0 ? m.value.focusInput() : V?.value?.focusInput && V?.value?.focusInput();
+    const oe = () => {
+      i?.value == !0 ? b.value.focusInput() : V?.value?.focusInput && V?.value?.focusInput();
     };
     async function u() {
-      typeof o.options == "function" ? await x(F.value ? F.value : void 0, !0) : (ve(o.options), t.value = d.value.length), L();
+      typeof o.options == "function" ? await x(N.value ? N.value : void 0, !0) : (X(o.options), t.value = p.value.length), L();
     }
     s({ initializeOptions: u, getLabel: E });
     function L() {
-      ee() == -1 && d.value && !!d.value[0] && B(d.value[0]);
+      te() == -1 && p.value && !!p.value[0] && H(p.value[0]);
     }
     async function x(n, l = !0) {
       I.value = l;
-      const f = async () => o.options(o.maxListOptions, n || ""), D = (H) => {
-        (!H || !("data" in H)) && X(), ve(H.data), Q(H?.data?.length ?? 0).then(() => {
+      const c = async () => o.options(o.maxListOptions, n || ""), D = (R) => {
+        (!R || !("data" in R)) && U(), X(R.data), Ie(R?.data?.length ?? 0).then(() => {
           I.value = !1;
         });
       };
-      await w.resetAndExecute(f, D);
+      await w.resetAndExecute(c, D);
+    }
+    function X(n) {
+      Array.isArray(n) || U(), n.length > 0 && typeof n[0] == "object" && xe(n), p.value = n;
+    }
+    function xe(n) {
+      (!o.objectLabelKeyName || o.objectLabelKeyName.length === 0) && _();
+      const l = o.objectLabelKeyName;
+      for (let c = 0; c < n.length; c++)
+        (typeof n[c] != "object" || !(l in n[c])) && _();
     }
-    async function Q(n) {
-      const l = async () => o.options(1, ""), f = (D) => {
+    async function Ie(n) {
+      const l = async () => o.options(1, ""), c = (D) => {
         (!D || !("totalNum" in D)) && le(), t.value = D.totalNum ?? n;
       };
-      await w.resetAndExecute(l, f);
+      await w.resetAndExecute(l, c);
     }
-    const pe = () => m?.value?.textInputRef?.getElementsByTagName("li")[C.value] ?? null, Ie = (n) => {
-      c.value == !1 ? te() : n && Te(n);
-    }, Te = (n) => {
+    const pe = () => b?.value?.textInputRef?.getElementsByTagName("li")[C.value] ?? null, Te = (n) => {
+      d.value == !1 ? ne() : n && De(n);
+    }, De = (n) => {
       const l = n.key || n.code;
-      (l === "Tab" || l === "Escape") && P(), l === "ArrowDown" && Oe(n), l === "ArrowUp" && Me(n), (l === "Enter" || l === " ") && De(), n.preventDefault(), n.stopPropagation();
-    }, De = () => {
-      j.value.length > 0 ? (r.value = !0, B(j.value[C.value])) : P();
-    }, Oe = (n) => {
-      k.value = !0, C.value < j.value.length - 1 && (n.preventDefault(), q.value = !1, C.value++, pe()?.focus());
+      (l === "Tab" || l === "Escape") && q(), l === "ArrowDown" && Me(n), l === "ArrowUp" && Ce(n), (l === "Enter" || l === " ") && Oe(), n.preventDefault(), n.stopPropagation();
+    }, Oe = () => {
+      B.value.length > 0 ? (r.value = !0, H(B.value[C.value])) : q();
     }, Me = (n) => {
-      k.value = !0, C.value > 0 && (n.preventDefault(), q.value = !1, C.value--, pe()?.focus());
+      k.value = !0, C.value < B.value.length - 1 && (n.preventDefault(), j.value = !1, C.value++, pe()?.focus());
     }, Ce = (n) => {
-      if (c?.value === !1) return;
-      F.value.length > 0 && (r.value = !0);
-      const l = g?.value?.listContainerRef, f = m?.value?.textInputRef, D = n?.relatedTarget && f?.isEqualNode(n?.relatedTarget), H = n?.relatedTarget && l && l.contains(n?.relatedTarget), de = n?.relatedTarget && l && l.isEqualNode(n?.relatedTarget);
-      if (!(H || D)) {
-        if (de) {
-          ne();
-          return;
+      k.value = !0, C.value > 0 && (n.preventDefault(), j.value = !1, C.value--, pe()?.focus());
+    }, ae = {
+      openList: ne,
+      unfocus: (n) => {
+        if (d?.value === !1) return;
+        N.value.length > 0 && (r.value = !0);
+        const l = m?.value?.listContainerRef, c = b?.value?.textInputRef, D = n?.relatedTarget && c?.isEqualNode(n?.relatedTarget), R = n?.relatedTarget && l && l.contains(n?.relatedTarget), de = n?.relatedTarget && l && l.isEqualNode(n?.relatedTarget);
+        if (!(R || D)) {
+          if (de) {
+            oe();
+            return;
+          }
+          q();
         }
-        P();
-      }
-    };
-    function ve(n) {
-      Array.isArray(n) || X(), n.length > 0 && typeof n[0] == "object" && ke(n), d.value = n;
-    }
-    function ke(n) {
-      (!o.objectLabelKeyName || o.objectLabelKeyName.length === 0) && G();
-      const l = o.objectLabelKeyName;
-      for (let f = 0; f < n.length; f++)
-        (typeof n[f] != "object" || !(l in n[f])) && G();
-    }
-    const ae = {
-      openList: te,
-      unfocus: Ce,
-      press: Ie,
+      },
+      press: Te,
       mouseOverList: re,
       getLabel: E,
-      updatedSelected: B,
-      focusInput: ne,
-      closeList: P
+      updatedSelected: H,
+      focusInput: oe,
+      closeList: q
     };
     return (n, l) => (T(), M("div", {
       style: { position: "relative" },
-      class: R(n.$attrs.class)
+      class: P(n.$attrs.class)
     }, [
-      Z(ge, {
+      Y(he, {
         ref_key: "itemListRef",
-        ref: g,
-        "show-drop-down": c.value,
-        filteredListItems: j.value,
-        mouseHoveringOnList: q.value,
+        ref: m,
+        "show-drop-down": d.value,
+        filteredListItems: B.value,
+        mouseHoveringOnList: j.value,
         focusedIndex: S.value,
-        selectedIndex: _.value,
+        selectedIndex: ee.value,
         "max-list-height-p-x": e.maxListHeightPX,
         "list-animation-duration-ms": e.listAnimationDurationMs,
         "parent-methods": ae,
         blockListChange: r.value,
-        "onUpdate:blockListChange": l[1] || (l[1] = (f) => r.value = f),
+        "onUpdate:blockListChange": l[1] || (l[1] = (c) => r.value = c),
         "total-options-count": t.value,
-        onReverseDropDownList: l[2] || (l[2] = (f) => y.value = f),
-        enableScrollClose: J.value
+        onReverseDropDownList: l[2] || (l[2] = (c) => y.value = c),
+        enableScrollClose: W.value
       }, {
-        default: be(() => [
-          Z(we, {
+        default: me(() => [
+          Y(ye, {
             ref_key: "dropDownButtonInput",
             ref: V,
             "parent-methods": ae,
-            "show-drop-down": c.value,
+            "show-drop-down": d.value,
             "enable-text-filter": i.value,
             "custom-icon": e.customIcon,
             "reverse-drop-down-list": y.value
           }, {
-            default: be(() => [
-              Z(he, {
+            default: me(() => [
+              Y(be, {
                 ref_key: "dropDownTextInput",
-                ref: m,
+                ref: b,
                 "enable-text-filter": i.value,
-                "show-drop-down": c.value,
+                "show-drop-down": d.value,
                 placeholder: ie.value,
                 "enable-button-click": k.value,
                 "parent-methods": ae,
-                "onUpdate:query": l[0] || (l[0] = (f) => F.value = f)
+                "onUpdate:query": l[0] || (l[0] = (c) => N.value = c)
               }, null, 8, ["enable-text-filter", "show-drop-down", "placeholder", "enable-button-click"])
             ]),
             _: 1
@@ -872,7 +878,7 @@ const ye = /* @__PURE__ */ K(Ge, [["render", et]]), tt = ["tabindex"], nt = {
       }, 8, ["show-drop-down", "filteredListItems", "mouseHoveringOnList", "focusedIndex", "selectedIndex", "max-list-height-p-x", "list-animation-duration-ms", "blockListChange", "total-options-count", "enableScrollClose"])
     ], 2));
   }
-}), lt = /* @__PURE__ */ K(st, [["__scopeId", "data-v-6c6e7e6a"]]);
+}), lt = /* @__PURE__ */ K(ot, [["__scopeId", "data-v-cc38ced5"]]);
 export {
   lt as default
 };