@adyen/bento-vue3 1.27.0 → 1.28.0

package/dist/chunks/{use-cached-selected-values.3c312296.js → use-cached-selected-values.BQBWFTvi.js}

@@ -1,41 +1,41 @@
-import { computed as v, ref as N, onMounted as Ie, onUnmounted as Ye, watch as Ae, defineComponent as j, resolveComponent as E, openBlock as m, createElementBlock as T, createVNode as k, withCtx as L, createTextVNode as V, toDisplayString as P, createElementVNode as q, renderSlot as G, mergeProps as x, withKeys as ge, createCommentVNode as K, createBlock as B, toHandlerKey as se, normalizeProps as F, guardReactiveProps as H, withDirectives as ae, vShow as $e, toRef as ue, resolveDirective as _e, toHandlers as le, Fragment as Q, renderList as z, createSlots as ie, normalizeClass as fe, unref as re, pushScopeId as Ke, popScopeId as qe } from "vue";
-import { B as Y, a as Se } from "./keyboard-navigation.bbc3d15c.js";
-import { B as ee } from "./index.ee15db35.js";
-import { BentoLoadingIndicator as We } from "../loading-indicator.js";
-import { BentoEmptyState as He } from "../empty-state.js";
-import { u as de } from "./i18n.f7e6533e.js";
-import { d as je } from "./debounce.b5ef6acf.js";
-import { _ as W } from "./_plugin-vue_export-helper.dad06003.js";
-import { B as Ce } from "./checkbox.9c30c07b.js";
-import { a as Xe, C as Ze } from "./chevron-up.638a9f34.js";
-import { B as Je } from "./base-button.a0140a4c.js";
-import { C as Qe } from "./cross-small.b85406fe.js";
-import { B as et, a as he } from "./loading-button.6b81b546.js";
-import { o as tt } from "./resize.a041304d.js";
+import { computed as v, ref as N, onMounted as Ie, onUnmounted as xe, watch as Ae, defineComponent as j, resolveComponent as L, openBlock as m, createElementBlock as _, createVNode as k, withCtx as T, createTextVNode as V, toDisplayString as P, createElementVNode as q, renderSlot as z, mergeProps as G, withKeys as ge, createCommentVNode as K, createBlock as B, toHandlerKey as se, normalizeProps as Y, guardReactiveProps as H, withDirectives as ae, vShow as $e, toRef as ue, resolveDirective as Se, toHandlers as le, Fragment as Q, renderList as F, createSlots as ie, normalizeClass as fe, unref as ce, pushScopeId as Ke, popScopeId as qe } from "vue";
+import { B as x, a as Ce } from "./keyboard-navigation.Clz1jOaA.js";
+import { B as ee } from "./typography.D7onlQ9v.js";
+import { B as We } from "./loading-indicator.BFMEf39U.js";
+import { B as He } from "./empty-state.BBxgpI-D.js";
+import { u as de } from "./i18n.DY5YXG5f.js";
+import { d as je } from "./debounce.DUTu11PS.js";
+import { _ as W } from "./_plugin-vue_export-helper.CHgC5LLL.js";
+import { B as Ee } from "./checkbox.xjIFibII.js";
+import { a as Xe, C as Ze } from "./chevron-up.5-KtIp8i.js";
+import { B as Je } from "./base-button.ewkxHD6W.js";
+import { C as Qe } from "./cross-small.48UCoOqB.js";
+import { B as et, a as he } from "./loading-button.BI32pZiW.js";
+import { o as tt } from "./resize.Bqks3WUm.js";
 import "../assets/use-cached-selected-values.css";
 const ke = (e, t, n, u) => {
   const s = v(
     () => {
-      var r, c;
-      return !!((r = e.value) != null && r.length) && ((c = e.value) == null ? void 0 : c.length) === t.value.length;
+      var c, r;
+      return !!((c = e.value) != null && c.length) && ((r = e.value) == null ? void 0 : r.length) === t.value.length;
     }
   ), a = v(() => {
-    var r;
-    return e.value == null || e.value.length === 0 ? !1 : ((r = e.value) == null ? void 0 : r.length) !== t.value.length;
+    var c;
+    return e.value == null || e.value.length === 0 ? !1 : ((c = e.value) == null ? void 0 : c.length) !== t.value.length;
   });
   return {
     isAllSelected: s,
     isIndeterminate: a,
-    toggleSelectAll: (r) => {
-      r ? n() : u();
+    toggleSelectAll: (c) => {
+      c ? n() : u();
     }
   };
 };
 function st(e, { disabled: t, itemHeight: n, overscan: u = 5, prefixHeight: s }) {
-  const a = N(null), l = N([]), r = N(0), c = N(0), o = N(0);
+  const a = N(null), l = N([]), c = N(0), r = N(0), o = N(0);
   let p;
   const i = v(() => {
-    const I = typeof n == "number" ? e.value.length * n : e.value.reduce((R, S, A) => R + n(A), 0), D = typeof n == "number" ? r.value * n : e.value.slice(0, r.value).reduce((R, S, A) => R + n(A), 0);
+    const I = typeof n == "number" ? e.value.length * n : e.value.reduce((R, C, A) => R + n(A), 0), D = typeof n == "number" ? c.value * n : e.value.slice(0, c.value).reduce((R, C, A) => R + n(A), 0);
     return {
       style: {
         marginTop: `${D}px`,
@@ -46,30 +46,30 @@ function st(e, { disabled: t, itemHeight: n, overscan: u = 5, prefixHeight: s })
     const I = (s == null ? void 0 : s.value) ?? 0, D = Math.max(a.value.scrollTop - I, 0);
     if (typeof n == "number")
       return Math.floor(D / n);
-    let R = 0, S = 0;
+    let R = 0, C = 0;
     for (let A = 0; A < e.value.length; A += 1) {
       const U = n(A);
       if (R += U, R >= D) {
-        S = A;
+        C = A;
         break;
       }
     }
-    return S;
+    return C;
   }, f = () => {
     if (o.value = a.value.clientHeight, typeof n == "number")
       return Math.ceil(o.value / n);
-    const I = r.value ?? 0;
+    const I = c.value ?? 0;
     let D = 0, R = 0;
-    for (let S = I; S < e.value.length; S += 1) {
-      const A = n(S);
-      if (D += A, R = S, D > o.value)
+    for (let C = I; C < e.value.length; C += 1) {
+      const A = n(C);
+      if (D += A, R = C, D > o.value)
         break;
     }
     return R - I;
   }, y = () => {
     if (a.value) {
       const I = f();
-      r.value = b(), c.value = Math.min(r.value + I + u, e.value.length), l.value = e.value.slice(r.value, c.value);
+      c.value = b(), r.value = Math.min(c.value + I + u, e.value.length), l.value = e.value.slice(c.value, r.value);
     }
   }, O = () => {
     y();
@@ -78,7 +78,7 @@ function st(e, { disabled: t, itemHeight: n, overscan: u = 5, prefixHeight: s })
     a.value && (o.value = a.value.clientHeight, p = tt(a.value, ({ clientHeight: I }) => {
       o.value = I, y();
     }), y());
-  }), Ye(() => {
+  }), xe(() => {
     p == null || p.disconnect();
   }), Ae(
     () => e.value,
@@ -120,23 +120,22 @@ const lt = j({
       required: !0
     }
   }
-});
-const ot = { class: "b-listbox-single-select-category" };
+}), ot = { class: "b-listbox-single-select-category" };
 function nt(e, t, n, u, s, a) {
-  const l = E("bento-typography");
-  return m(), T("div", ot, [
+  const l = L("bento-typography");
+  return m(), _("div", ot, [
     k(l, {
       variant: "caption",
       el: "span",
       class: "b-listbox-single-select-category__label-text"
     }, {
-      default: L(() => [
+      default: T(() => [
         V(P(e.categoryLabel), 1)
       ]),
       _: 1
     }),
     q("div", null, [
-      G(e.$slots, "default", {}, void 0, !0)
+      z(e.$slots, "default", {}, void 0, !0)
     ])
   ]);
 }
@@ -160,7 +159,7 @@ const it = /* @__PURE__ */ W(lt, [["render", nt], ["__scopeId", "data-v-a90eff17
     }));
     return {
       // Enums
-      BentoKeyboardNavigationKeyDownEvent: Y,
+      BentoKeyboardNavigationKeyDownEvent: x,
       BentoListboxEvent: d,
       // Values
       conditionalClasses: n,
@@ -174,8 +173,8 @@ const it = /* @__PURE__ */ W(lt, [["render", nt], ["__scopeId", "data-v-a90eff17
     };
   }
 });
-function ct(e, t, n, u, s, a) {
-  return m(), T("label", x({
+function rt(e, t, n, u, s, a) {
+  return m(), _("label", G({
     class: ["b-listbox-option", e.conditionalClasses],
     role: "option"
   }, e.$attrs, {
@@ -186,32 +185,32 @@ function ct(e, t, n, u, s, a) {
       t[3] || (t[3] = ge((l) => e.onOptionSelected(e.BentoListboxEvent.TAB, l), ["tab"]))
     ]
   }), [
-    G(e.$slots, "default", {}, void 0, !0)
+    z(e.$slots, "default", {}, void 0, !0)
   ], 16);
 }
-const be = /* @__PURE__ */ W(at, [["render", ct], ["__scopeId", "data-v-18a61f5d"]]);
-let Ee = 0;
-const rt = {
+const be = /* @__PURE__ */ W(at, [["render", rt], ["__scopeId", "data-v-18a61f5d"]]);
+let Le = 0;
+const ct = {
   beforeCreate() {
-    this.uuid = Ee.toString(), Ee += 1;
+    this.uuid = Le.toString(), Le += 1;
   }
 }, ut = { key: 0 }, dt = /* @__PURE__ */ q("path", {
   fill: "#00112C",
   d: "M15.0608 4.00011L14.0001 2.93945L6.00011 10.9395L2.00011 6.93945L0.939453 8.00011L6.00011 13.0608L15.0608 4.00011Z"
 }, null, -1);
 function bt(e, t, n, u, s, a) {
-  return m(), T("svg", x({ role: "img" }, e.$attrs, {
+  return m(), _("svg", G({ role: "img" }, e.$attrs, {
     class: "ui-assets-icons-16",
     xmlns: "http://www.w3.org/2000/svg",
     width: "16",
     height: "16",
     fill: "none"
   }), [
-    e.$attrs["svg-title"] ? (m(), T("title", ut, P(e.$attrs["svg-title"]), 1)) : K("", !0),
+    e.$attrs["svg-title"] ? (m(), _("title", ut, P(e.$attrs["svg-title"]), 1)) : K("", !0),
     dt
   ], 16);
 }
-const mt = /* @__PURE__ */ W(rt, [["render", bt]]), vt = j({
+const mt = /* @__PURE__ */ W(ct, [["render", bt]]), vt = j({
   name: "bento-listbox-single-select-option",
   components: {
     BentoListboxOption: be,
@@ -252,11 +251,10 @@ const mt = /* @__PURE__ */ W(rt, [["render", bt]]), vt = j({
       onOptionSelected: n
     };
   }
-});
-const gt = { class: "b-listbox-single-select-option__text" }, ft = { class: "b-listbox-single-select-option__check-icon" };
+}), gt = { class: "b-listbox-single-select-option__text" }, ft = { class: "b-listbox-single-select-option__check-icon" };
 function pt(e, t, n, u, s, a) {
-  const l = E("bento-typography"), r = E("checkmark-icon"), c = E("bento-listbox-option");
-  return m(), B(c, x({
+  const l = L("bento-typography"), c = L("checkmark-icon"), r = L("bento-listbox-option");
+  return m(), B(r, G({
     class: "b-listbox-single-select-option",
     disabled: e.disabled,
     selected: e.selected,
@@ -271,11 +269,11 @@ function pt(e, t, n, u, s, a) {
   }, {
     [se(e.BentoListboxEvent.TAB)]: t[3] || (t[3] = (o) => e.onOptionSelected(e.BentoListboxEvent.TAB))
   }), {
-    default: L(() => [
-      G(e.$slots, "default", F(H(e.option)), () => [
+    default: T(() => [
+      z(e.$slots, "default", Y(H(e.option)), () => [
         q("span", gt, [
           k(l, { el: "span" }, {
-            default: L(() => [
+            default: T(() => [
               V(P(e.option.label), 1)
             ]),
             _: 1
@@ -285,7 +283,7 @@ function pt(e, t, n, u, s, a) {
             class: "b-listbox-single-select-option__description",
             el: "span"
           }, {
-            default: L(() => [
+            default: T(() => [
               V(P(e.option.description), 1)
             ]),
             _: 1
@@ -293,7 +291,7 @@ function pt(e, t, n, u, s, a) {
         ])
       ], !0),
       q("span", ft, [
-        ae(k(r, { "svg-title": "selected" }, null, 512), [
+        ae(k(c, { "svg-title": "selected" }, null, 512), [
           [$e, e.selected]
         ])
       ])
@@ -306,7 +304,7 @@ const yt = /* @__PURE__ */ W(vt, [["render", pt], ["__scopeId", "data-v-e8cc847b
   Ie(() => {
     t && (s.value = e.value.findIndex((f) => !t(f)));
   });
-  const a = (f) => !t || !!t && t(e.value[f]), l = (f) => !t || !!t && !t(e.value[f]), r = (f) => {
+  const a = (f) => !t || !!t && t(e.value[f]), l = (f) => !t || !!t && !t(e.value[f]), c = (f) => {
     switch (f) {
       case "increase":
         s.value += 1;
@@ -315,13 +313,13 @@ const yt = /* @__PURE__ */ W(vt, [["render", pt], ["__scopeId", "data-v-e8cc847b
         s.value -= 1;
         break;
     }
-  }, c = ({ edgeCaseItem: f, isItemBeforeEdgeCaseItem: y }, O, w) => {
-    s.value !== f && (y ? l(f) && r(w) : (r(w), a(s.value) && O()), n(s.value));
+  }, r = ({ edgeCaseItem: f, isItemBeforeEdgeCaseItem: y }, O, w) => {
+    s.value !== f && (y ? l(f) && c(w) : (c(w), a(s.value) && O()), n(s.value));
   }, o = (f) => {
     var O;
     (O = f == null ? void 0 : f.detail) == null || O.preventDefault();
     const y = s.value === u.value - 2;
-    c(
+    r(
       {
         isItemBeforeEdgeCaseItem: y,
         edgeCaseItem: u.value
@@ -334,7 +332,7 @@ const yt = /* @__PURE__ */ W(vt, [["render", pt], ["__scopeId", "data-v-e8cc847b
     var O;
     (O = f == null ? void 0 : f.detail) == null || O.preventDefault();
     const y = s.value === 1;
-    c(
+    r(
       {
         edgeCaseItem: 0,
         isItemBeforeEdgeCaseItem: y
@@ -354,13 +352,13 @@ const yt = /* @__PURE__ */ W(vt, [["render", pt], ["__scopeId", "data-v-e8cc847b
     moveToNextElement: o,
     moveToPreviousElement: p
   };
-}, _t = j({
+}, St = j({
   name: "bento-listbox-single-select",
   components: {
     BentoListboxSingleSelectCategory: it,
     BentoListboxSingleSelectOption: yt
   },
-  directives: { BentoKeyboardNavigationDirective: Se },
+  directives: { BentoKeyboardNavigationDirective: Ce },
   inheritAttrs: !1,
   props: {
     /**
@@ -408,17 +406,17 @@ const yt = /* @__PURE__ */ W(vt, [["render", pt], ["__scopeId", "data-v-e8cc847b
       return !!((y = e.selectedValue) != null && y.length) && e.selectedValue.at(0);
     }), a = v(() => !!e.items.some(({ items: y }) => !!y)), l = (y) => (O) => {
       t(y, [O]);
-    }, r = (y) => u.value[y].$el.focus(), { moveToNextElement: c, moveToPreviousElement: o, moveToFirstElement: p, moveToLastElement: i } = Be(
+    }, c = (y) => u.value[y].$el.focus(), { moveToNextElement: r, moveToPreviousElement: o, moveToFirstElement: p, moveToLastElement: i } = Be(
       {
         items: ue(e, "items"),
         isOptionDisabled: e.isOptionDisabled
       },
-      r
+      c
     ), b = {
-      [Y.ARROW_UP]: o,
-      [Y.ARROW_DOWN]: c,
-      [Y.HOME]: p,
-      [Y.END]: i
+      [x.ARROW_UP]: o,
+      [x.ARROW_DOWN]: r,
+      [x.HOME]: p,
+      [x.END]: i
     }, f = {
       [d.SELECT]: l(d.SELECT),
       [d.SPACE]: l(d.SPACE),
@@ -442,16 +440,16 @@ const yt = /* @__PURE__ */ W(vt, [["render", pt], ["__scopeId", "data-v-e8cc847b
     };
   }
 });
-function St(e, t, n, u, s, a) {
-  const l = E("bento-listbox-single-select-option"), r = E("bento-listbox-single-select-category"), c = _e("bento-keyboard-navigation-directive");
-  return ae((m(), T("div", le(e.listboxListeners, !0), [
-    e.hasCategories && e.staticCategories ? (m(!0), T(Q, { key: 0 }, z(e.items, (o) => (m(), B(r, {
+function Ct(e, t, n, u, s, a) {
+  const l = L("bento-listbox-single-select-option"), c = L("bento-listbox-single-select-category"), r = Se("bento-keyboard-navigation-directive");
+  return ae((m(), _("div", le(e.listboxListeners, !0), [
+    e.hasCategories && e.staticCategories ? (m(!0), _(Q, { key: 0 }, F(e.items, (o) => (m(), B(c, {
       key: o.value,
       "category-label": o.label,
       role: "group"
     }, {
-      default: L(() => [
-        (m(!0), T(Q, null, z(o.items, (p) => (m(), B(l, x({
+      default: T(() => [
+        (m(!0), _(Q, null, F(o.items, (p) => (m(), B(l, G({
           key: p.value,
           ref_for: !0,
           ref: "listboxItemRef",
@@ -460,16 +458,16 @@ function St(e, t, n, u, s, a) {
           disabled: e.isOptionDisabled ? e.isOptionDisabled(p) : null,
           selected: p.value === e.selectedItem.value
         }, le(e.listboxOptionListeners)), ie({ _: 2 }, [
-          z(e.slots, (i, b) => ({
+          F(e.slots, (i, b) => ({
             name: b,
-            fn: L((f) => [
-              G(e.$slots, b, F(H(f)))
+            fn: T((f) => [
+              z(e.$slots, b, Y(H(f)))
             ])
           }))
         ]), 1040, ["option", "disabled", "selected"]))), 128))
       ]),
       _: 2
-    }, 1032, ["category-label"]))), 128)) : (m(!0), T(Q, { key: 1 }, z(e.items, (o) => (m(), B(l, x({
+    }, 1032, ["category-label"]))), 128)) : (m(!0), _(Q, { key: 1 }, F(e.items, (o) => (m(), B(l, G({
       key: o.value,
       ref_for: !0,
       ref: "listboxItemRef",
@@ -478,29 +476,29 @@ function St(e, t, n, u, s, a) {
       disabled: e.isOptionDisabled ? e.isOptionDisabled(o) : null,
       selected: o.value === e.selectedItem.value
     }, le(e.listboxOptionListeners)), ie({ _: 2 }, [
-      z(e.slots, (p, i) => ({
+      F(e.slots, (p, i) => ({
         name: i,
-        fn: L((b) => [
-          G(e.$slots, i, F(H(b)))
+        fn: T((b) => [
+          z(e.$slots, i, Y(H(b)))
         ])
       }))
     ]), 1040, ["option", "disabled", "selected"]))), 128))
   ], 16)), [
-    [c]
+    [r]
   ]);
 }
-const Ct = /* @__PURE__ */ W(_t, [["render", St]]);
+const Et = /* @__PURE__ */ W(St, [["render", Ct]]);
 var pe = /* @__PURE__ */ ((e) => (e.DISABLED = "disabled", e.STATIC_CATEGORY = "static-category", e))(pe || {}), ne = /* @__PURE__ */ ((e) => (e.SELECT_CATEGORY = "select-category", e.UNSELECT_CATEGORY = "unselect-category", e))(ne || {});
 const ht = {
   "en-US": {
     categoryClosed: "{category} closed",
     categoryOpened: "{category} opened"
   }
-}, Et = j({
+}, Lt = j({
   i18n: { messages: ht },
   name: "bento-listbox-multi-select-category",
   components: {
-    BentoCheckbox: Ce,
+    BentoCheckbox: Ee,
     BentoTypography: ee,
     BentoListboxOption: be,
     ChevronDownIcon: Xe,
@@ -547,26 +545,26 @@ const ht = {
   },
   emits: [ne.SELECT_CATEGORY, ne.UNSELECT_CATEGORY],
   setup(e, { emit: t }) {
-    const n = N(!1), { t: u } = de(), s = (S) => e.isOptionDisabled ? e.isOptionDisabled(S) : !1, a = v(
-      () => e.category.items.every((S) => s(S))
-    ), l = ue(e, "staticCategories"), r = v(() => n.value || e.staticCategories), c = v(() => ({
+    const n = N(!1), { t: u } = de(), s = (C) => e.isOptionDisabled ? e.isOptionDisabled(C) : !1, a = v(
+      () => e.category.items.every((C) => s(C))
+    ), l = ue(e, "staticCategories"), c = v(() => n.value || e.staticCategories), r = v(() => ({
       [`b-listbox-multi-select-category--${pe.DISABLED}`]: a.value,
       [`b-listbox-multi-select-category--${pe.STATIC_CATEGORY}`]: e.staticCategories
-    })), o = (S) => {
-      S.preventDefault(), n.value = !n.value;
-    }, p = (S) => {
+    })), o = (C) => {
+      C.preventDefault(), n.value = !n.value;
+    }, p = (C) => {
       var te;
-      const A = s(S), U = ((te = e.selectedItemsList) == null ? void 0 : te.includes(S.value)) || !1;
+      const A = s(C), U = ((te = e.selectedItemsList) == null ? void 0 : te.includes(C.value)) || !1;
       return { isDisabled: A, isPreSelected: U };
     }, i = v(
-      () => e.category.items.filter((S) => {
-        const { isDisabled: A, isPreSelected: U } = p(S);
+      () => e.category.items.filter((C) => {
+        const { isDisabled: A, isPreSelected: U } = p(C);
         return A && U || !A;
       })
     ), b = v(
       () => {
-        var S;
-        return (S = i.value) == null ? void 0 : S.filter(
+        var C;
+        return (C = i.value) == null ? void 0 : C.filter(
           ({ value: A }) => {
             var U;
             return (U = e.selectedItemsList) == null ? void 0 : U.includes(A);
@@ -574,8 +572,8 @@ const ht = {
         );
       }
     ), f = v(() => {
-      const S = n.value ? "categoryOpened" : "categoryClosed";
-      return u(S, { category: e.category.label });
+      const C = n.value ? "categoryOpened" : "categoryClosed";
+      return u(C, { category: e.category.label });
     }), y = v(
       () => ({
         el: "span",
@@ -594,29 +592,28 @@ const ht = {
     return {
       // Values
       chevronTitle: f,
-      conditionalClass: c,
+      conditionalClass: r,
       hasAllPropsDisabled: a,
       isOpen: n,
       isAllSelected: I,
       isIndeterminate: D,
       isStaticCategory: l,
       // Computed
-      showItemChildren: r,
+      showItemChildren: c,
       categoryLabelProps: y,
       // Methods
       toggleOpen: o,
       toggleSelectAll: R
     };
   }
-});
-const Lt = { class: "b-listbox-multi-select-category__label" };
-function Tt(e, t, n, u, s, a) {
-  const l = E("bento-checkbox"), r = E("bento-typography"), c = E("chevron-up-icon"), o = E("chevron-down-icon"), p = E("bento-listbox-option");
-  return m(), T("div", null, [
+}), Tt = { class: "b-listbox-multi-select-category__label" };
+function _t(e, t, n, u, s, a) {
+  const l = L("bento-checkbox"), c = L("bento-typography"), r = L("chevron-up-icon"), o = L("chevron-down-icon"), p = L("bento-listbox-option");
+  return m(), _("div", null, [
     k(p, {
       class: fe(["b-listbox-multi-select-category__option", e.conditionalClass])
     }, {
-      default: L(() => [
+      default: T(() => [
         e.isStaticCategory ? K("", !0) : (m(), B(l, {
           key: 0,
           "model-value": e.isAllSelected,
@@ -626,20 +623,20 @@ function Tt(e, t, n, u, s, a) {
           value: e.category.value,
           "onUpdate:modelValue": e.toggleSelectAll
         }, null, 8, ["model-value", "indeterminate", "disabled", "aria-label", "value", "onUpdate:modelValue"])),
-        q("span", Lt, [
-          k(r, x(e.categoryLabelProps, { class: "b-listbox-multi-select-category__label-text" }), {
-            default: L(() => [
+        q("span", Tt, [
+          k(c, G(e.categoryLabelProps, { class: "b-listbox-multi-select-category__label-text" }), {
+            default: T(() => [
               V(P(e.category.label), 1)
             ]),
             _: 1
           }, 16),
-          e.isStaticCategory ? K("", !0) : (m(), T("div", {
+          e.isStaticCategory ? K("", !0) : (m(), _("div", {
             key: 0,
             class: "b-listbox-multi-select-category__label-chevron",
             "data-testid": "toggle-listbox",
             onClickCapture: t[0] || (t[0] = (...i) => e.toggleOpen && e.toggleOpen(...i))
           }, [
-            e.isOpen ? (m(), B(c, {
+            e.isOpen ? (m(), B(r, {
               key: 0,
               "svg-title": e.chevronTitle
             }, null, 8, ["svg-title"])) : (m(), B(o, {
@@ -652,18 +649,18 @@ function Tt(e, t, n, u, s, a) {
       _: 1
     }, 8, ["class"]),
     ae(q("div", null, [
-      G(e.$slots, "default", {}, void 0, !0)
+      z(e.$slots, "default", {}, void 0, !0)
     ], 512), [
       [$e, e.showItemChildren]
     ])
   ]);
 }
-const Ot = /* @__PURE__ */ W(Et, [["render", Tt], ["__scopeId", "data-v-9a00de22"]]);
+const Ot = /* @__PURE__ */ W(Lt, [["render", _t], ["__scopeId", "data-v-9a00de22"]]);
 var Z = /* @__PURE__ */ ((e) => (e.SELECT_CATEGORY = "select-category", e.TOGGLE_CHECKBOX_SELECTION = "toggle-checkbox-selection", e.UNSELECT_CATEGORY = "unselect-category", e))(Z || {});
 const It = j({
   name: "listbox-multi-select-options",
   components: {
-    BentoCheckbox: Ce,
+    BentoCheckbox: Ee,
     BentoListboxOption: be,
     BentoTypography: ee,
     ListboxMultiSelectCategory: Ot
@@ -729,14 +726,14 @@ const It = j({
     Z.UNSELECT_CATEGORY
   ],
   setup(e, { emit: t }) {
-    const n = (c) => {
-      t(Z.TOGGLE_CHECKBOX_SELECTION, c);
-    }, u = (c) => !!c.items, s = (c) => {
+    const n = (r) => {
+      t(Z.TOGGLE_CHECKBOX_SELECTION, r);
+    }, u = (r) => !!r.items, s = (r) => {
       const o = e.isMultiLevel && e.searching;
-      return c.description && (!e.isMultiLevel || o);
-    }, a = (c) => c.items ? !!c.items.find((o) => e.selectedItemsList.includes(o.value)) : e.selectedItemsList.includes(c.value), l = (c, o) => {
+      return r.description && (!e.isMultiLevel || o);
+    }, a = (r) => r.items ? !!r.items.find((o) => e.selectedItemsList.includes(o.value)) : e.selectedItemsList.includes(r.value), l = (r, o) => {
       if (u(o))
-        return t(c ? Z.SELECT_CATEGORY : Z.UNSELECT_CATEGORY, o);
+        return t(r ? Z.SELECT_CATEGORY : Z.UNSELECT_CATEGORY, o);
       n(o.value);
     };
     return {
@@ -755,20 +752,19 @@ const It = j({
       ListboxMultiSelectOptionsEvent: Z
     };
   }
-});
-const At = { class: "b-listbox-multi-select__option-text" }, $t = { class: "b-listbox-multi-select__option-text" };
+}), At = { class: "b-listbox-multi-select__option-text" }, $t = { class: "b-listbox-multi-select__option-text" };
 function kt(e, t, n, u, s, a) {
-  const l = E("bento-checkbox"), r = E("bento-typography"), c = E("bento-listbox-option"), o = E("listbox-multi-select-options", !0), p = E("listbox-multi-select-category");
-  return m(), T("div", null, [
-    (m(!0), T(Q, null, z(e.items, (i) => (m(), T("div", {
+  const l = L("bento-checkbox"), c = L("bento-typography"), r = L("bento-listbox-option"), o = L("listbox-multi-select-options", !0), p = L("listbox-multi-select-category");
+  return m(), _("div", null, [
+    (m(!0), _(Q, null, F(e.items, (i) => (m(), _("div", {
       key: `selected-${i.value}`
     }, [
-      e.searching && e.isMultiLevel ? (m(), B(c, {
+      e.searching && e.isMultiLevel ? (m(), B(r, {
         key: 0,
         class: fe(["b-listbox-multi-select-options", e.conditionalClasses]),
         disabled: e.isOptionDisabled ? e.isOptionDisabled(i) : null
       }, {
-        default: L(() => [
+        default: T(() => [
           k(l, {
             "model-value": e.isOptionSelected(i),
             "aria-label": i.label,
@@ -776,20 +772,20 @@ function kt(e, t, n, u, s, a) {
             value: i.value,
             "onUpdate:modelValue": (b) => e.selectSearch(b, i)
           }, null, 8, ["model-value", "aria-label", "disabled", "value", "onUpdate:modelValue"]),
-          G(e.$slots, "default", F(H(i)), () => [
+          z(e.$slots, "default", Y(H(i)), () => [
             q("span", At, [
-              k(r, { el: "span" }, {
-                default: L(() => [
+              k(c, { el: "span" }, {
+                default: T(() => [
                   V(P(i.label), 1)
                 ]),
                 _: 2
               }, 1024),
-              e.shouldShowDescription(i) ? (m(), B(r, {
+              e.shouldShowDescription(i) ? (m(), B(c, {
                 key: 0,
                 class: "b-listbox-multi-select__option-description",
                 el: "span"
               }, {
-                default: L(() => [
+                default: T(() => [
                   V(P(i.description), 1)
                 ]),
                 _: 2
@@ -798,7 +794,7 @@ function kt(e, t, n, u, s, a) {
           ], !0)
         ]),
         _: 2
-      }, 1032, ["class", "disabled"])) : (m(), T(Q, { key: 1 }, [
+      }, 1032, ["class", "disabled"])) : (m(), _(Q, { key: 1 }, [
         i.items ? (m(), B(p, {
           key: 0,
           category: i,
@@ -808,7 +804,7 @@ function kt(e, t, n, u, s, a) {
           onSelectCategory: (b) => e.$emit(e.ListboxMultiSelectOptionsEvent.SELECT_CATEGORY, i),
           onUnselectCategory: (b) => e.$emit(e.ListboxMultiSelectOptionsEvent.UNSELECT_CATEGORY, i)
         }, {
-          default: L(() => [
+          default: T(() => [
             k(o, {
               "category-items": "",
               items: i.items,
@@ -821,12 +817,12 @@ function kt(e, t, n, u, s, a) {
             }, null, 8, ["items", "is-option-disabled", "is-multi-level", "static-categories", "selected-items-list", "searching"])
           ]),
           _: 2
-        }, 1032, ["category", "static-categories", "is-option-disabled", "selected-items-list", "onSelectCategory", "onUnselectCategory"])) : (m(), B(c, {
+        }, 1032, ["category", "static-categories", "is-option-disabled", "selected-items-list", "onSelectCategory", "onUnselectCategory"])) : (m(), B(r, {
           key: 1,
           class: fe(["b-listbox-multi-select-options", e.conditionalClasses]),
           disabled: e.isOptionDisabled ? e.isOptionDisabled(i) : null
         }, {
-          default: L(() => [
+          default: T(() => [
             k(l, {
               "model-value": e.selectedItemsList,
               "aria-label": i.label,
@@ -834,20 +830,20 @@ function kt(e, t, n, u, s, a) {
               value: i.value,
               "onUpdate:modelValue": (b) => e.toggleCheckboxSelection(i)
             }, null, 8, ["model-value", "aria-label", "disabled", "value", "onUpdate:modelValue"]),
-            G(e.$slots, "default", F(H(i)), () => [
+            z(e.$slots, "default", Y(H(i)), () => [
               q("span", $t, [
-                k(r, { el: "span" }, {
-                  default: L(() => [
+                k(c, { el: "span" }, {
+                  default: T(() => [
                     V(P(i.label), 1)
                   ]),
                   _: 2
                 }, 1024),
-                e.shouldShowDescription(i) ? (m(), B(r, {
+                e.shouldShowDescription(i) ? (m(), B(c, {
                   key: 0,
                   class: "b-listbox-multi-select__option-description",
                   el: "span"
                 }, {
-                  default: L(() => [
+                  default: T(() => [
                     V(P(i.description), 1)
                   ]),
                   _: 2
@@ -893,27 +889,27 @@ const Bt = /* @__PURE__ */ W(It, [["render", kt], ["__scopeId", "data-v-25938a72
   emits: ["unselect-item", "unselect-category"],
   setup(e, { emit: t }) {
     const { t: n } = de({ messages: Re }), u = (s) => s.items ? t("unselect-category", s) : t("unselect-item", s);
-    return (s, a) => (m(), T("div", Rt, [
-      (m(!0), T(Q, null, z(e.items, (l) => (m(), T("div", {
+    return (s, a) => (m(), _("div", Rt, [
+      (m(!0), _(Q, null, F(e.items, (l) => (m(), _("div", {
         key: `selected-${l.value}`
       }, [
-        k(re(Je), {
+        k(ce(Je), {
           class: "b-listbox-multi-select-chips__chip",
           disabled: e.isOptionDisabled ? e.isOptionDisabled(l) : null,
-          onClick: (r) => u(l)
+          onClick: (c) => u(l)
         }, {
-          iconRight: L(() => [
-            k(re(Qe), {
-              "svg-title": re(n)("remove")
+          iconRight: T(() => [
+            k(ce(Qe), {
+              "svg-title": ce(n)("remove")
             }, null, 8, ["svg-title"])
           ]),
-          default: L(() => [
-            k(re(ee), {
+          default: T(() => [
+            k(ce(ee), {
               el: "span",
               variant: "caption",
               class: "b-listbox-multi-select-chips__option-text"
             }, {
-              default: L(() => [
+              default: T(() => [
                 V(P(l.label), 1)
               ]),
               _: 2
@@ -924,8 +920,7 @@ const Bt = /* @__PURE__ */ W(It, [["render", kt], ["__scopeId", "data-v-25938a72
       ]))), 128))
     ]));
   }
-});
-const Mt = /* @__PURE__ */ W(Nt, [["__scopeId", "data-v-7c5f8bdb"]]), Le = {
+}), Mt = /* @__PURE__ */ W(Nt, [["__scopeId", "data-v-7c5f8bdb"]]), Te = {
   "en-US": {
     allSelected: "All selected ({total})",
     numberOfTotalSelected: "{number} of {total} selected",
@@ -945,16 +940,16 @@ const Mt = /* @__PURE__ */ W(Nt, [["__scopeId", "data-v-7c5f8bdb"]]), Le = {
     flattenedItemsList: n
   };
 }, wt = j({
-  i18n: { messages: Le },
+  i18n: { messages: Te },
   name: "bento-listbox-multi-select",
   components: {
-    BentoCheckbox: Ce,
+    BentoCheckbox: Ee,
     BentoListboxOption: be,
     BentoTypography: ee,
     ListboxMultiSelectOptions: Bt,
     ListboxMultiSelectChips: Mt
   },
-  directives: { BentoKeyboardNavigationDirective: Se },
+  directives: { BentoKeyboardNavigationDirective: Ce },
   props: {
     /**
      * Indicates whether there are more items to load
@@ -1016,53 +1011,53 @@ const Mt = /* @__PURE__ */ W(Nt, [["__scopeId", "data-v-7c5f8bdb"]]), Le = {
   },
   emits: [d.SELECT],
   setup(e, { emit: t, slots: n }) {
-    const { t: u } = de({ messages: Le }), s = N(null), a = N(null), l = N(null), r = v(
+    const { t: u } = de({ messages: Te }), s = N(null), a = N(null), l = N(null), c = v(
       () => e.selectedValues.map(({ value: g }) => g)
-    ), { isMultiLevelSelect: c, flattenedItemsList: o } = Pt(ue(e, "items")), p = (g) => {
+    ), { isMultiLevelSelect: r, flattenedItemsList: o } = Pt(ue(e, "items")), p = (g) => {
       var $;
-      const _ = e.isOptionDisabled(g), C = (($ = r.value) == null ? void 0 : $.includes(g.value)) || !1;
-      return { isDisabled: _, isPreSelected: C };
+      const S = e.isOptionDisabled(g), E = (($ = c.value) == null ? void 0 : $.includes(g.value)) || !1;
+      return { isDisabled: S, isPreSelected: E };
     }, i = v(() => {
-      if (e.searching && c)
+      if (e.searching && r)
         return e.items;
-      const g = o.value.filter((_) => {
-        const { isDisabled: C, isPreSelected: $ } = p(_);
-        return C && $ || !C;
+      const g = o.value.filter((S) => {
+        const { isDisabled: E, isPreSelected: $ } = p(S);
+        return E && $ || !E;
       });
-      return e.selectedValues.forEach((_) => {
-        g.find((C) => C.value === _.value) || g.push(_);
+      return e.selectedValues.forEach((S) => {
+        g.find((E) => E.value === S.value) || g.push(S);
       }), g;
     }), b = v(
       () => {
         var g;
-        return (g = i.value) == null ? void 0 : g.filter((_) => {
-          var C;
-          return _.items && c.value && e.searching ? _.items.filter(
+        return (g = i.value) == null ? void 0 : g.filter((S) => {
+          var E;
+          return S.items && r.value && e.searching ? S.items.filter(
             (h) => (e.selectedValues ?? []).includes(h.value)
-          ).length === _.items.length : (C = r.value) == null ? void 0 : C.includes(_.value);
+          ).length === S.items.length : (E = c.value) == null ? void 0 : E.includes(S.value);
         });
       }
-    ), f = () => c.value && !e.searching ? o.value.length : e.items.length, y = v(() => {
+    ), f = () => r.value && !e.searching ? o.value.length : e.items.length, y = v(() => {
       var $;
-      const g = i.value.length, _ = f(), C = (($ = b.value) == null ? void 0 : $.length) || 0;
-      return C === 0 ? u("selectAll", { total: g }) : C === _ ? u("allSelected", { total: _ }) : C <= _ ? u("numberOfTotalSelected", { number: C, total: _ }) : u("numbersSelected", { number: C });
+      const g = i.value.length, S = f(), E = (($ = b.value) == null ? void 0 : $.length) || 0;
+      return E === 0 ? u("selectAll", { total: g }) : E === S ? u("allSelected", { total: S }) : E <= S ? u("numberOfTotalSelected", { number: E, total: S }) : u("numbersSelected", { number: E });
     }), O = (g) => {
-      const _ = ($) => {
+      const S = ($) => {
         const { isDisabled: h, isPreSelected: X } = p($);
         return h && X || !h;
-      }, C = g.filter(_).filter(($) => !r.value.includes($.value));
-      t(d.SELECT, [...e.selectedValues, ...C]);
+      }, E = g.filter(S).filter(($) => !c.value.includes($.value));
+      t(d.SELECT, [...e.selectedValues, ...E]);
     }, w = (g) => {
-      const _ = (h) => {
-        const { isDisabled: X, isPreSelected: Fe } = p(h);
-        return !(X && Fe);
-      }, C = g.filter(_).map(({ value: h }) => h), $ = e.selectedValues.filter((h) => !(C != null && C.includes(h.value)));
+      const S = (h) => {
+        const { isDisabled: X, isPreSelected: Ye } = p(h);
+        return !(X && Ye);
+      }, E = g.filter(S).map(({ value: h }) => h), $ = e.selectedValues.filter((h) => !(E != null && E.includes(h.value)));
       t(d.SELECT, $);
     }, I = () => {
       O(o.value);
     }, D = () => {
       w(o.value);
-    }, { isAllSelected: R, isIndeterminate: S, toggleSelectAll: A } = ke(
+    }, { isAllSelected: R, isIndeterminate: C, toggleSelectAll: A } = ke(
       b,
       i,
       I,
@@ -1071,36 +1066,36 @@ const Mt = /* @__PURE__ */ W(Nt, [["__scopeId", "data-v-7c5f8bdb"]]), Le = {
       O(g.items);
     }, te = (g) => {
       w(g.items);
-    }, me = (g, _) => {
-      let C = !1;
-      const $ = e.selectedValues.filter(({ value: h }) => _.value === h ? (C = !0, !1) : !0);
-      C || $.push(_), t(g, $);
-    }, ce = v(() => {
-      if (!c.value)
+    }, me = (g, S) => {
+      let E = !1;
+      const $ = e.selectedValues.filter(({ value: h }) => S.value === h ? (E = !0, !1) : !0);
+      E || $.push(S), t(g, $);
+    }, re = v(() => {
+      if (!r.value)
         return e.selectedValues;
-      const g = (h) => r.value.includes(h.value), _ = (h) => !e.staticCategories && h.every((X) => g(X));
+      const g = (h) => c.value.includes(h.value), S = (h) => !e.staticCategories && h.every((X) => g(X));
       return e.items.flatMap(
-        (h) => h.items && !_(h.items) ? h.items : h
+        (h) => h.items && !S(h.items) ? h.items : h
       ).filter((h) => h.items ? !0 : g(h));
     }), ve = v(() => {
-      var C, $, h, X;
-      const g = ["automatic", "button"].includes(e.lazyLoadType), _ = ((C = e.selectedValues) == null ? void 0 : C.length) > 0 && (($ = b.value) == null ? void 0 : $.length) !== ((h = o.value) == null ? void 0 : h.length);
-      return g && e.hasMoreItems ? !!((X = e.selectedValues) != null && X.length) : _;
+      var E, $, h, X;
+      const g = ["automatic", "button"].includes(e.lazyLoadType), S = ((E = e.selectedValues) == null ? void 0 : E.length) > 0 && (($ = b.value) == null ? void 0 : $.length) !== ((h = o.value) == null ? void 0 : h.length);
+      return g && e.hasMoreItems ? !!((X = e.selectedValues) != null && X.length) : S;
     }), M = v(() => ["automatic", "button"].includes(e.lazyLoadType) ? !e.hasMoreItems : !0), oe = v(
       () => s.value ? [s.value] : []
     ), De = v(
       () => {
-        var g, _;
-        return (_ = (g = a.value) == null ? void 0 : g.$children) != null && _.length ? a.value.$children : [];
+        var g, S;
+        return (S = (g = a.value) == null ? void 0 : g.$children) != null && S.length ? a.value.$children : [];
       }
     ), Ne = v(
       () => {
-        var g, _;
-        return (_ = (g = l.value) == null ? void 0 : g.$children) != null && _.length ? l.value.$children : [];
+        var g, S;
+        return (S = (g = l.value) == null ? void 0 : g.$children) != null && S.length ? l.value.$children : [];
       }
     ), Me = v(() => ({ label: y, value: R })), Pe = v(() => [
       Me,
-      ...ce.value,
+      ...re.value,
       ...o.value
     ]), we = (g) => {
       [
@@ -1108,17 +1103,17 @@ const Mt = /* @__PURE__ */ W(Nt, [["__scopeId", "data-v-7c5f8bdb"]]), Le = {
         ...De.value,
         ...Ne.value
       ][g].$el.focus();
-    }, { moveToNextElement: Ue, moveToPreviousElement: Ve, moveToFirstElement: xe, moveToLastElement: Ge } = Be(
+    }, { moveToNextElement: Ue, moveToPreviousElement: Ve, moveToFirstElement: Ge, moveToLastElement: ze } = Be(
       {
         items: N(Pe),
         isOptionDisabled: e.isOptionDisabled
       },
       we
-    ), ze = {
-      [Y.ARROW_UP]: (g) => Ve(g),
-      [Y.ARROW_DOWN]: (g) => Ue(g),
-      [Y.HOME]: xe,
-      [Y.END]: Ge
+    ), Fe = {
+      [x.ARROW_UP]: (g) => Ve(g),
+      [x.ARROW_DOWN]: (g) => Ue(g),
+      [x.HOME]: Ge,
+      [x.END]: ze
     };
     return {
       // Refs
@@ -1128,12 +1123,12 @@ const Mt = /* @__PURE__ */ W(Nt, [["__scopeId", "data-v-7c5f8bdb"]]), Le = {
       // Values
       isAllSelected: R,
       showSelectedItems: ve,
-      isIndeterminate: S,
-      isMultiLevelSelect: c,
+      isIndeterminate: C,
+      isMultiLevelSelect: r,
       flattenedItemsList: o,
-      selectedItemsList: r,
+      selectedItemsList: c,
       selectAllCheckboxText: y,
-      selectedOptions: ce,
+      selectedOptions: re,
       showSelectAllCheckbox: M,
       slots: n,
       // Enums
@@ -1144,34 +1139,33 @@ const Mt = /* @__PURE__ */ W(Nt, [["__scopeId", "data-v-7c5f8bdb"]]), Le = {
       toggleSelectAll: A,
       unselectAllCategory: te,
       // Events
-      listboxListeners: ze
+      listboxListeners: Fe
     };
   }
-});
-const Ut = (e) => (Ke("data-v-0ca61721"), e = e(), qe(), e), Vt = {
+}), Ut = (e) => (Ke("data-v-0ca61721"), e = e(), qe(), e), Vt = {
   key: 1,
   class: "b-listbox-multi-select__divider"
-}, xt = { key: 2 }, Gt = /* @__PURE__ */ Ut(() => /* @__PURE__ */ q("hr", { class: "b-listbox-multi-select__divider" }, null, -1));
-function zt(e, t, n, u, s, a) {
-  const l = E("bento-checkbox"), r = E("bento-typography"), c = E("bento-listbox-option"), o = E("listbox-multi-select-chips"), p = E("listbox-multi-select-options"), i = _e("bento-keyboard-navigation-directive");
-  return ae((m(), T("div", x({ class: "b-listbox-multi-select" }, le(e.listboxListeners, !0)), [
-    e.showSelectAllCheckbox ? (m(), B(c, {
+}, Gt = { key: 2 }, zt = /* @__PURE__ */ Ut(() => /* @__PURE__ */ q("hr", { class: "b-listbox-multi-select__divider" }, null, -1));
+function Ft(e, t, n, u, s, a) {
+  const l = L("bento-checkbox"), c = L("bento-typography"), r = L("bento-listbox-option"), o = L("listbox-multi-select-chips"), p = L("listbox-multi-select-options"), i = Se("bento-keyboard-navigation-directive");
+  return ae((m(), _("div", G({ class: "b-listbox-multi-select" }, le(e.listboxListeners, !0)), [
+    e.showSelectAllCheckbox ? (m(), B(r, {
       key: 0,
       ref: "selectAllListboxItemsRef",
       class: "b-listbox-multi-select__option"
     }, {
-      default: L(() => [
+      default: T(() => [
         k(l, {
           "aria-label": e.selectAllCheckboxText,
           "model-value": e.isAllSelected,
           indeterminate: e.isIndeterminate,
           "onUpdate:modelValue": e.toggleSelectAll
         }, null, 8, ["aria-label", "model-value", "indeterminate", "onUpdate:modelValue"]),
-        k(r, {
+        k(c, {
           el: "span",
           "aria-hidden": "true"
         }, {
-          default: L(() => [
+          default: T(() => [
             V(P(e.selectAllCheckboxText), 1)
           ]),
           _: 1
@@ -1179,8 +1173,8 @@ function zt(e, t, n, u, s, a) {
       ]),
       _: 1
     }, 512)) : K("", !0),
-    e.showSelectAllCheckbox ? (m(), T("hr", Vt)) : K("", !0),
-    e.showSelectedItems ? (m(), T("div", xt, [
+    e.showSelectAllCheckbox ? (m(), _("hr", Vt)) : K("", !0),
+    e.showSelectedItems ? (m(), _("div", Gt, [
       k(o, {
         ref: "selectedListboxItemsRef",
         items: e.selectedOptions,
@@ -1188,9 +1182,9 @@ function zt(e, t, n, u, s, a) {
         onUnselectCategory: e.unselectAllCategory,
         onUnselectItem: t[0] || (t[0] = (b) => e.toggleCheckboxSelection(e.BentoListboxEvent.SELECT, b))
       }, null, 8, ["items", "is-option-disabled", "onUnselectCategory"]),
-      Gt
+      zt
     ])) : K("", !0),
-    k(p, x({
+    k(p, G({
       ref: "listboxItemsRef",
       items: e.items,
       "is-option-disabled": e.isOptionDisabled,
@@ -1208,10 +1202,10 @@ function zt(e, t, n, u, s, a) {
     }, {
       [se(e.BentoListboxEvent.ENTER)]: t[4] || (t[4] = (b) => e.toggleCheckboxSelection(e.BentoListboxEvent.ENTER, b))
     }), ie({ _: 2 }, [
-      z(e.slots, (b, f) => ({
+      F(e.slots, (b, f) => ({
         name: f,
-        fn: L((y) => [
-          G(e.$slots, f, F(H(y)), void 0, !0)
+        fn: T((y) => [
+          z(e.$slots, f, Y(H(y)), void 0, !0)
         ])
       }))
     ]), 1040, ["items", "is-option-disabled", "is-multi-level", "static-categories", "searching", "selected-items-list", "onSelectCategory", "onUnselectCategory"])
@@ -1219,22 +1213,22 @@ function zt(e, t, n, u, s, a) {
     [i]
   ]);
 }
-const Te = /* @__PURE__ */ W(wt, [["render", zt], ["__scopeId", "data-v-0ca61721"]]), Oe = {
+const _e = /* @__PURE__ */ W(wt, [["render", Ft], ["__scopeId", "data-v-0ca61721"]]), Oe = {
   "en-US": {
     showMore: "Show more",
     loading: "Loading"
   }
-}, Ft = 36, Yt = j({
+}, Yt = 36, xt = j({
   name: "bento-listbox",
   components: {
     BentoEmptyState: He,
-    BentoListboxSingleSelect: Ct,
-    BentoListboxMultiSelect: Te,
+    BentoListboxSingleSelect: Et,
+    BentoListboxMultiSelect: _e,
     BentoTypography: ee,
     BentoLoadingIndicator: We,
     BentoLoadingButton: et
   },
-  directives: { BentoKeyboardNavigationDirective: Se },
+  directives: { BentoKeyboardNavigationDirective: Ce },
   i18n: { messages: Oe },
   props: {
     /**
@@ -1312,7 +1306,7 @@ const Te = /* @__PURE__ */ W(wt, [["render", zt], ["__scopeId", "data-v-0ca61721
      *
      * If enabled, hides the "Select all" checkbox in "multiple" mode.
      */
-    searching: Te.props.searching,
+    searching: _e.props.searching,
     /**
      * The `input` value.
      * Providing an empty string or empty array will select no options.
@@ -1340,9 +1334,9 @@ const Te = /* @__PURE__ */ W(wt, [["render", zt], ["__scopeId", "data-v-0ca61721
     d.TAB
   ],
   setup(e, { emit: t, slots: n }) {
-    const u = N([]), s = ue(e, "items"), { t: a } = de({ messages: Oe }), l = v(() => e.lazyLoadType !== J.AUTOMATIC), r = v(() => e.lazyLoadType === J.AUTOMATIC), c = () => {
+    const u = N([]), s = ue(e, "items"), { t: a } = de({ messages: Oe }), l = v(() => e.lazyLoadType !== J.AUTOMATIC), c = v(() => e.lazyLoadType === J.AUTOMATIC), r = () => {
       var M;
-      return typeof (e == null ? void 0 : e.virtualScroll) == "object" && ((M = e == null ? void 0 : e.virtualScroll) != null && M.itemHeight) ? e.virtualScroll.itemHeight : Ft;
+      return typeof (e == null ? void 0 : e.virtualScroll) == "object" && ((M = e == null ? void 0 : e.virtualScroll) != null && M.itemHeight) ? e.virtualScroll.itemHeight : Yt;
     }, {
       containerRef: o,
       containerProps: p,
@@ -1350,7 +1344,7 @@ const Te = /* @__PURE__ */ W(wt, [["render", zt], ["__scopeId", "data-v-0ca61721
       list: b,
       wrapperProps: f
     } = st(s, {
-      itemHeight: c(),
+      itemHeight: r(),
       // Disable virtual scrolling if not enabled or if lazy loading is enabled or if multi-select
       disabled: (e == null ? void 0 : e.multiple) || (e == null ? void 0 : e.virtualScroll) === !1 || (e == null ? void 0 : e.lazyLoadType) !== "none"
     }), y = v(
@@ -1369,8 +1363,8 @@ const Te = /* @__PURE__ */ W(wt, [["render", zt], ["__scopeId", "data-v-0ca61721
         return;
       const oe = Math.round(M.scrollTop) + M.clientHeight >= M.scrollHeight;
       e.hasMoreItems && oe && !e.loading && D();
-    }), S = () => {
-      r.value ? R() : i();
+    }), C = () => {
+      c.value ? R() : i();
     }, A = v(() => {
       var M;
       return e.searching && ((M = e.items) == null ? void 0 : M.length) === 0;
@@ -1378,7 +1372,7 @@ const Te = /* @__PURE__ */ W(wt, [["render", zt], ["__scopeId", "data-v-0ca61721
       () => e.lazyLoadType === J.BUTTON && e.hasMoreItems
     ), te = v(
       () => e.loading ? he.LOADING : he.START
-    ), me = v(() => e.loading ? a("loading") : a("showMore")), ce = v(() => ({
+    ), me = v(() => e.loading ? a("loading") : a("showMore")), re = v(() => ({
       ...e.emptyState,
       variant: "condensed"
     })), ve = {
@@ -1398,7 +1392,7 @@ const Te = /* @__PURE__ */ W(wt, [["render", zt], ["__scopeId", "data-v-0ca61721
       // Values
       containerProps: p,
       isSearchResultEmpty: A,
-      limitedEmptyStateProps: ce,
+      limitedEmptyStateProps: re,
       loadingButtonState: te,
       slots: n,
       shouldDisplayShowMoreButton: U,
@@ -1406,17 +1400,16 @@ const Te = /* @__PURE__ */ W(wt, [["render", zt], ["__scopeId", "data-v-0ca61721
       virtualisedItems: b,
       wrapperProps: f,
       // Enums
-      BentoKeyboardNavigationKeyDownEvent: Y,
+      BentoKeyboardNavigationKeyDownEvent: x,
       BentoListboxEvent: d,
       // Methods
-      onListboxContainerScroll: S,
+      onListboxContainerScroll: C,
       onOptionSelected: I,
       emitShowMore: D,
       listboxListeners: ve
     };
   }
-});
-const Kt = ["id", "aria-busy", "aria-atomic", "aria-label", "aria-live"], qt = {
+}), Kt = ["id", "aria-busy", "aria-atomic", "aria-label", "aria-live"], qt = {
   key: 0,
   class: "b-listbox__empty-search-message"
 }, Wt = {
@@ -1427,8 +1420,8 @@ const Kt = ["id", "aria-busy", "aria-atomic", "aria-label", "aria-live"], qt = {
   class: "b-listbox__lazy-load"
 };
 function jt(e, t, n, u, s, a) {
-  const l = E("bento-empty-state"), r = E("bento-typography"), c = E("bento-listbox-multi-select"), o = E("bento-listbox-single-select"), p = E("bento-loading-button"), i = E("bento-loading-indicator"), b = _e("bento-keyboard-navigation-directive");
-  return ae((m(), T("div", x({ id: e.id }, e.containerProps, {
+  const l = L("bento-empty-state"), c = L("bento-typography"), r = L("bento-listbox-multi-select"), o = L("bento-listbox-single-select"), p = L("bento-loading-button"), i = L("bento-loading-indicator"), b = Se("bento-keyboard-navigation-directive");
+  return ae((m(), _("div", G({ id: e.id }, e.containerProps, {
     class: "b-listbox",
     role: "listbox",
     tabindex: "-1",
@@ -1438,19 +1431,19 @@ function jt(e, t, n, u, s, a) {
     "aria-live": e.ariaLive,
     onScroll: t[0] || (t[0] = (...f) => e.onListboxContainerScroll && e.onListboxContainerScroll(...f))
   }), [
-    q("div", F(H(e.wrapperProps)), [
-      e.isSearchResultEmpty ? (m(), T("div", qt, [
-        e.emptyState ? (m(), B(l, F(x({ key: 0 }, e.limitedEmptyStateProps)), null, 16)) : (m(), B(r, {
+    q("div", Y(H(e.wrapperProps)), [
+      e.isSearchResultEmpty ? (m(), _("div", qt, [
+        e.emptyState ? (m(), B(l, Y(G({ key: 0 }, e.limitedEmptyStateProps)), null, 16)) : (m(), B(c, {
           key: 1,
           el: "span"
         }, {
-          default: L(() => [
+          default: T(() => [
             V(P(e.noResultsMessage), 1)
           ]),
           _: 1
         }))
-      ])) : (m(), T(Q, { key: 1 }, [
-        e.multiple ? (m(), B(c, x({
+      ])) : (m(), _(Q, { key: 1 }, [
+        e.multiple ? (m(), B(r, G({
           key: 0,
           ref: "listboxItemRef",
           "has-more-items": e.hasMoreItems,
@@ -1461,13 +1454,13 @@ function jt(e, t, n, u, s, a) {
           searching: e.searching,
           "is-option-disabled": e.isOptionDisabled
         }, le(e.listboxListeners)), ie({ _: 2 }, [
-          z(e.slots, (f, y) => ({
+          F(e.slots, (f, y) => ({
             name: y,
-            fn: L((O) => [
-              G(e.$slots, y, F(H(O)), void 0, !0)
+            fn: T((O) => [
+              z(e.$slots, y, Y(H(O)), void 0, !0)
             ])
           }))
-        ]), 1040, ["has-more-items", "items", "lazy-load-type", "static-categories", "selected-values", "searching", "is-option-disabled"])) : (m(), B(o, x({
+        ]), 1040, ["has-more-items", "items", "lazy-load-type", "static-categories", "selected-values", "searching", "is-option-disabled"])) : (m(), B(o, G({
           key: 1,
           ref: "listboxItemRef",
           items: e.virtualisedItems,
@@ -1475,25 +1468,25 @@ function jt(e, t, n, u, s, a) {
           "static-categories": e.staticCategories,
           "is-option-disabled": e.isOptionDisabled
         }, le(e.listboxListeners)), ie({ _: 2 }, [
-          z(e.slots, (f, y) => ({
+          F(e.slots, (f, y) => ({
             name: y,
-            fn: L((O) => [
-              G(e.$slots, y, F(H(O)), void 0, !0)
+            fn: T((O) => [
+              z(e.$slots, y, Y(H(O)), void 0, !0)
             ])
           }))
         ]), 1040, ["items", "selected-value", "static-categories", "is-option-disabled"])),
-        e.shouldDisplayShowMoreButton ? (m(), T("div", Wt, [
+        e.shouldDisplayShowMoreButton ? (m(), _("div", Wt, [
           k(p, {
             state: e.loadingButtonState,
             variant: "secondary",
             onClickCapture: e.emitShowMore
           }, {
-            default: L(() => [
+            default: T(() => [
               V(P(e.showMoreButtonText), 1)
             ]),
             _: 1
           }, 8, ["state", "onClickCapture"])
-        ])) : e.loading ? (m(), T("div", Ht, [
+        ])) : e.loading ? (m(), _("div", Ht, [
           k(i)
         ])) : K("", !0)
       ], 64))
@@ -1502,7 +1495,7 @@ function jt(e, t, n, u, s, a) {
     [b]
   ]);
 }
-const us = /* @__PURE__ */ W(Yt, [["render", jt], ["__scopeId", "data-v-f5e00d2e"]]), ye = (e, t) => {
+const us = /* @__PURE__ */ W(xt, [["render", jt], ["__scopeId", "data-v-f5e00d2e"]]), ye = (e, t) => {
   for (const n of e) {
     if (n.value === t)
       return n.label;
@@ -1511,27 +1504,27 @@ const us = /* @__PURE__ */ W(Yt, [["render", jt], ["__scopeId", "data-v-f5e00d2e
   }
   return null;
 }, ds = (e, t, n) => {
-  const u = N([]), s = N(), a = (c) => {
-    s.value = n.value ? c.map(({ value: o }) => o) : c[0].value;
-  }, l = (c) => {
-    u.value = c, a(c);
-  }, r = () => {
+  const u = N([]), s = N(), a = (r) => {
+    s.value = n.value ? r.map(({ value: o }) => o) : r[0].value;
+  }, l = (r) => {
+    u.value = r, a(r);
+  }, c = () => {
     u.value = [], s.value = null;
   };
   return Ae(
     () => t.value,
     () => {
       if (!t.value) {
-        r();
+        c();
         return;
       }
-      const c = !Array.isArray(t.value), o = [...u.value];
-      r();
+      const r = !Array.isArray(t.value), o = [...u.value];
+      c();
       const p = (i) => {
         let b = ye(e.value, i);
         b || (b = ye(o, i)), b || (b = i.toString()), u.value.push({ value: i, label: b });
       };
-      if (c) {
+      if (r) {
         const i = t.value;
         p(i), a(u.value);
         return;
@@ -1544,15 +1537,15 @@ const us = /* @__PURE__ */ W(Yt, [["render", jt], ["__scopeId", "data-v-f5e00d2e
     cachedSelectedListboxOptions: u,
     cachedListboxSelectedValues: s,
     // Methods
-    resetCache: r,
+    resetCache: c,
     setCachedValues: l
   };
 };
 export {
-  us as B,
-  ds as a,
-  J as b,
-  d as c,
+  J as B,
+  d as a,
+  us as b,
+  ds as c,
   Pt as u
 };
-//# sourceMappingURL=use-cached-selected-values.3c312296.js.map
+//# sourceMappingURL=use-cached-selected-values.BQBWFTvi.js.map