@adyen/bento-vue2 1.27.0 → 1.28.0

package/dist/chunks/{use-cached-selected-values.98a9ed01.js → use-cached-selected-values.CVLzxvTi.js}

@@ -1,18 +1,18 @@
-import { computed as i, ref as A, onMounted as te, onUnmounted as fe, watch as se, defineComponent as $, toRef as V } from "vue";
-import { B as w } from "./index.e29a6907.js";
-import { BentoLoadingIndicator as ge } from "../loading-indicator.js";
-import { BentoEmptyState as ye } from "../empty-state.js";
-import { u as Y } from "./i18n.eb5b985b.js";
-import { d as pe } from "./debounce.b5ef6acf.js";
-import { n as D } from "./_plugin-vue2_normalizer.71e2aa87.js";
-import { B as k, a as X } from "./keyboard-navigation.bbc3d15c.js";
-import { B as Z } from "./checkbox.9f9c978a.js";
-import "./index.4c062058.js";
-import { C as Se, a as xe } from "./chevron-up.81185563.js";
-import { B as Ce } from "./base-button.852204dc.js";
-import { C as he } from "./cross-small.e851e0de.js";
-import { B as Ee, a as J } from "./loading-button.692dbdc8.js";
-import { o as Le } from "./resize.a041304d.js";
+import { computed as i, ref as A, onMounted as te, onUnmounted as _e, watch as se, defineComponent as $, toRef as V } from "vue";
+import { B as M } from "./typography.Bjtu3Gca.js";
+import { B as ge } from "./loading-indicator.DXc7I1Lm.js";
+import { B as ye } from "./empty-state.BqVOj4v1.js";
+import { u as Y } from "./i18n.BQkEbtPM.js";
+import { d as Se } from "./debounce.DUTu11PS.js";
+import { n as D } from "./_plugin-vue2_normalizer.CeySl7Fu.js";
+import { B as k, a as X } from "./keyboard-navigation.Clz1jOaA.js";
+import { B as Z } from "./checkbox.Bi2RDBEZ.js";
+import "./index.Cl4_42j5.js";
+import { C as pe, a as Ce } from "./chevron-up.B2uWhZf7.js";
+import { B as he } from "./base-button.DER7_IsF.js";
+import { C as xe } from "./cross-small.BLUwtRB-.js";
+import { B as Ee, a as J } from "./loading-button.CoF1IhEU.js";
+import { o as Le } from "./resize.Bqks3WUm.js";
 import "../assets/use-cached-selected-values.css";
 const le = (t, e, s, l) => {
   const n = i(
@@ -33,54 +33,54 @@ const le = (t, e, s, l) => {
   };
 };
 function Te(t, { disabled: e, itemHeight: s, overscan: l = 5, prefixHeight: n }) {
-  const o = A(null), _ = A([]), d = A(0), r = A(0), u = A(0);
-  let p;
-  const h = i(() => {
-    const S = typeof s == "number" ? t.value.length * s : t.value.reduce((T, v, x) => T + s(x), 0), O = typeof s == "number" ? d.value * s : t.value.slice(0, d.value).reduce((T, v, x) => T + s(x), 0);
+  const o = A(null), b = A([]), d = A(0), r = A(0), u = A(0);
+  let S;
+  const x = i(() => {
+    const p = typeof s == "number" ? t.value.length * s : t.value.reduce((T, v, C) => T + s(C), 0), O = typeof s == "number" ? d.value * s : t.value.slice(0, d.value).reduce((T, v, C) => T + s(C), 0);
     return {
       style: {
         marginTop: `${O}px`,
-        height: `${S - O}px`
+        height: `${p - O}px`
       }
     };
   }), E = () => {
-    const S = (n == null ? void 0 : n.value) ?? 0, O = Math.max(o.value.scrollTop - S, 0);
+    const p = (n == null ? void 0 : n.value) ?? 0, O = Math.max(o.value.scrollTop - p, 0);
     if (typeof s == "number")
       return Math.floor(O / s);
     let T = 0, v = 0;
-    for (let x = 0; x < t.value.length; x += 1) {
-      const R = s(x);
+    for (let C = 0; C < t.value.length; C += 1) {
+      const R = s(C);
       if (T += R, T >= O) {
-        v = x;
+        v = C;
         break;
       }
     }
     return v;
-  }, m = () => {
+  }, f = () => {
     if (u.value = o.value.clientHeight, typeof s == "number")
       return Math.ceil(u.value / s);
-    const S = d.value ?? 0;
+    const p = d.value ?? 0;
     let O = 0, T = 0;
-    for (let v = S; v < t.value.length; v += 1) {
-      const x = s(v);
-      if (O += x, T = v, O > u.value)
+    for (let v = p; v < t.value.length; v += 1) {
+      const C = s(v);
+      if (O += C, T = v, O > u.value)
         break;
     }
-    return T - S;
+    return T - p;
   }, y = () => {
     if (o.value) {
-      const S = m();
-      d.value = E(), r.value = Math.min(d.value + S + l, t.value.length), _.value = t.value.slice(d.value, r.value);
+      const p = f();
+      d.value = E(), r.value = Math.min(d.value + p + l, t.value.length), b.value = t.value.slice(d.value, r.value);
     }
   }, L = () => {
     y();
   };
   e || (te(() => {
-    o.value && (u.value = o.value.clientHeight, p = Le(o.value, ({ clientHeight: S }) => {
-      u.value = S, y();
+    o.value && (u.value = o.value.clientHeight, S = Le(o.value, ({ clientHeight: p }) => {
+      u.value = p, y();
     }), y());
-  }), fe(() => {
-    p == null || p.disconnect();
+  }), _e(() => {
+    S == null || S.disconnect();
   }), se(
     () => t.value,
     () => {
@@ -102,15 +102,15 @@ function Te(t, { disabled: e, itemHeight: s, overscan: l = 5, prefixHeight: n })
     containerRef: o,
     containerProps: B,
     onScroll: L,
-    list: _,
-    wrapperProps: h
+    list: b,
+    wrapperProps: x
   };
 }
-var a = /* @__PURE__ */ ((t) => (t.SELECT = "select", t.SHOW_MORE = "show-more", t.ESCAPE = "escape-pressed", t.CLICK = "click", t.ENTER = "enter-pressed", t.SPACE = "space-pressed", t.TAB = "tab-pressed", t.CLOSE_DROPDOWN = "close-dropdown", t))(a || {}), P = /* @__PURE__ */ ((t) => (t.AUTOMATIC = "automatic", t.BUTTON = "button", t.NONE = "none", t))(P || {});
+var a = /* @__PURE__ */ ((t) => (t.SELECT = "select", t.SHOW_MORE = "show-more", t.ESCAPE = "escape-pressed", t.CLICK = "click", t.ENTER = "enter-pressed", t.SPACE = "space-pressed", t.TAB = "tab-pressed", t.CLOSE_DROPDOWN = "close-dropdown", t))(a || {}), w = /* @__PURE__ */ ((t) => (t.AUTOMATIC = "automatic", t.BUTTON = "button", t.NONE = "none", t))(w || {});
 const Oe = $({
   name: "bento-listbox-static-category",
   components: {
-    BentoTypography: w
+    BentoTypography: M
   },
   props: {
     /**
@@ -131,9 +131,7 @@ var Ae = function() {
   Ie,
   !1,
   null,
-  "4aa8cc6e",
-  null,
-  null
+  "4aa8cc6e"
 );
 const Re = Be.exports, ke = $({
   name: "bento-listbox-option",
@@ -163,8 +161,8 @@ const Re = Be.exports, ke = $({
       onClick: (o) => {
         e(a.CLICK, o);
       },
-      onOptionSelected: (o, _) => {
-        e(o, _);
+      onOptionSelected: (o, b) => {
+        e(o, b);
       }
     };
   }
@@ -184,35 +182,31 @@ var De = function() {
   $e,
   !1,
   null,
-  "d7fb415c",
-  null,
-  null
+  "d7fb415c"
 );
 const q = Ne.exports;
 let Q = 0;
-const Me = {
+const Pe = {
   beforeCreate() {
     this.uuid = Q.toString(), Q += 1;
   }
 };
-var Pe = function() {
+var we = function() {
   var e = this, s = e._self._c;
   return s("svg", e._b({ staticClass: "ui-assets-icons-16", attrs: { role: "img", xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", fill: "none" } }, "svg", e.$attrs, !1), [e.$attrs["svg-title"] ? s("title", [e._v(e._s(e.$attrs["svg-title"]))]) : e._e(), s("path", { attrs: { 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" } })]);
-}, we = [], Fe = /* @__PURE__ */ D(
-  Me,
+}, Me = [], Fe = /* @__PURE__ */ D(
   Pe,
   we,
+  Me,
   !1,
   null,
-  null,
-  null,
   null
 );
 const Ge = Fe.exports, Ue = $({
   name: "bento-listbox-single-select-option",
   components: {
     BentoListboxOption: q,
-    BentoTypography: w,
+    BentoTypography: M,
     CheckmarkIcon: Ge
   },
   props: {
@@ -235,8 +229,8 @@ const Ge = Fe.exports, Ue = $({
   },
   emits: [a.ENTER, a.SELECT, a.SPACE, a.TAB],
   setup(t, { emit: e }) {
-    const s = (_) => {
-      t.disabled || e(_, t.option);
+    const s = (b) => {
+      t.disabled || e(b, t.option);
     }, l = i(() => t.disabled ? !0 : null), n = i(() => t.selected ? !0 : null), o = i(() => t.disabled ? -1 : 0);
     return {
       // Values
@@ -269,17 +263,15 @@ var ze = function() {
   Ve,
   !1,
   null,
-  "3ba7da5b",
-  null,
-  null
+  "3ba7da5b"
 );
 const qe = Ye.exports, ne = ({ items: t, isOptionDisabled: e }, s) => {
   const l = i(() => t.value.length - 1), n = A(0);
   te(() => {
-    e && (n.value = t.value.findIndex((m) => !e(m)));
+    e && (n.value = t.value.findIndex((f) => !e(f)));
   });
-  const o = (m) => !e || !!e && e(t.value[m]), _ = (m) => !e || !!e && !e(t.value[m]), d = (m) => {
-    switch (m) {
+  const o = (f) => !e || !!e && e(t.value[f]), b = (f) => !e || !!e && !e(t.value[f]), d = (f) => {
+    switch (f) {
       case "increase":
         n.value += 1;
         break;
@@ -287,11 +279,11 @@ const qe = Ye.exports, ne = ({ items: t, isOptionDisabled: e }, s) => {
         n.value -= 1;
         break;
     }
-  }, r = ({ edgeCaseItem: m, isItemBeforeEdgeCaseItem: y }, L, B) => {
-    n.value !== m && (y ? _(m) && d(B) : (d(B), o(n.value) && L()), s(n.value));
-  }, u = (m) => {
+  }, r = ({ edgeCaseItem: f, isItemBeforeEdgeCaseItem: y }, L, B) => {
+    n.value !== f && (y ? b(f) && d(B) : (d(B), o(n.value) && L()), s(n.value));
+  }, u = (f) => {
     var L;
-    (L = m == null ? void 0 : m.detail) == null || L.preventDefault();
+    (L = f == null ? void 0 : f.detail) == null || L.preventDefault();
     const y = n.value === l.value - 2;
     r(
       {
@@ -302,16 +294,16 @@ const qe = Ye.exports, ne = ({ items: t, isOptionDisabled: e }, s) => {
       "increase"
       /* INCREASE */
     );
-  }, p = (m) => {
+  }, S = (f) => {
     var L;
-    (L = m == null ? void 0 : m.detail) == null || L.preventDefault();
+    (L = f == null ? void 0 : f.detail) == null || L.preventDefault();
     const y = n.value === 1;
     r(
       {
         edgeCaseItem: 0,
         isItemBeforeEdgeCaseItem: y
       },
-      p,
+      S,
       "decrease"
       /* DECREASE */
     );
@@ -321,10 +313,10 @@ const qe = Ye.exports, ne = ({ items: t, isOptionDisabled: e }, s) => {
       n.value = 0, o(n.value) ? u() : s(n.value);
     },
     moveToLastElement: () => {
-      n.value = l.value, o(n.value) ? p() : s(n.value);
+      n.value = l.value, o(n.value) ? S() : s(n.value);
     },
     moveToNextElement: u,
-    moveToPreviousElement: p
+    moveToPreviousElement: S
   };
 }, We = $({
   name: "bento-listbox-single-select",
@@ -378,9 +370,9 @@ const qe = Ye.exports, ne = ({ items: t, isOptionDisabled: e }, s) => {
     const l = A([]), n = i(() => {
       var y;
       return !!((y = t.selectedValue) != null && y.length) && t.selectedValue.at(0);
-    }), o = i(() => !!t.items.some(({ items: y }) => !!y)), _ = (y) => (L) => {
+    }), o = i(() => !!t.items.some(({ items: y }) => !!y)), b = (y) => (L) => {
       e(y, [L]);
-    }, d = (y) => l.value[y].$el.focus(), { moveToNextElement: r, moveToPreviousElement: u, moveToFirstElement: p, moveToLastElement: h } = ne(
+    }, d = (y) => l.value[y].$el.focus(), { moveToNextElement: r, moveToPreviousElement: u, moveToFirstElement: S, moveToLastElement: x } = ne(
       {
         items: V(t, "items"),
         isOptionDisabled: t.isOptionDisabled
@@ -389,13 +381,13 @@ const qe = Ye.exports, ne = ({ items: t, isOptionDisabled: e }, s) => {
     ), E = {
       [k.ARROW_UP]: u,
       [k.ARROW_DOWN]: r,
-      [k.HOME]: p,
-      [k.END]: h
-    }, m = {
-      [a.SELECT]: _(a.SELECT),
-      [a.SPACE]: _(a.SPACE),
-      [a.TAB]: _(a.TAB),
-      [a.ENTER]: _(a.ENTER)
+      [k.HOME]: S,
+      [k.END]: x
+    }, f = {
+      [a.SELECT]: b(a.SELECT),
+      [a.SPACE]: b(a.SPACE),
+      [a.TAB]: b(a.TAB),
+      [a.ENTER]: b(a.ENTER)
     };
     return {
       // Enums
@@ -407,10 +399,10 @@ const qe = Ye.exports, ne = ({ items: t, isOptionDisabled: e }, s) => {
       // Computed
       hasCategories: o,
       // Methods
-      onOptionSelected: _,
+      onOptionSelected: b,
       // Keyboard navigation
       listboxListeners: E,
-      listboxOptionListeners: m
+      listboxOptionListeners: f
     };
   }
 });
@@ -418,16 +410,16 @@ var Ke = function() {
   var e = this, s = e._self._c;
   return e._self._setupProxy, s("div", e._g({ directives: [{ name: "bento-keyboard-navigation-directive", rawName: "v-bento-keyboard-navigation-directive" }] }, e.listboxListeners), [e.hasCategories && e.staticCategories ? e._l(e.items, function(l) {
     return s("bento-listbox-single-select-category", { key: l.value, attrs: { "category-label": l.label, role: "group" } }, e._l(l.items, function(n) {
-      return s("bento-listbox-single-select-option", e._g({ key: n.value, ref: "listboxItemRef", refInFor: !0, attrs: { role: "option", option: n, disabled: e.isOptionDisabled ? e.isOptionDisabled(n) : null, selected: n.value === e.selectedItem.value }, scopedSlots: e._u([e._l(e.slots, function(o, _) {
-        return { key: _, fn: function(d) {
-          return [e._t(_, null, null, d)];
+      return s("bento-listbox-single-select-option", e._g({ key: n.value, ref: "listboxItemRef", refInFor: !0, attrs: { role: "option", option: n, disabled: e.isOptionDisabled ? e.isOptionDisabled(n) : null, selected: n.value === e.selectedItem.value }, scopedSlots: e._u([e._l(e.slots, function(o, b) {
+        return { key: b, fn: function(d) {
+          return [e._t(b, null, null, d)];
         } };
       })], null, !0) }, e.listboxOptionListeners));
     }), 1);
   }) : e._l(e.items, function(l) {
     return s("bento-listbox-single-select-option", e._g({ key: l.value, ref: "listboxItemRef", refInFor: !0, attrs: { role: "option", option: l, disabled: e.isOptionDisabled ? e.isOptionDisabled(l) : null, selected: l.value === e.selectedItem.value }, scopedSlots: e._u([e._l(e.slots, function(n, o) {
-      return { key: o, fn: function(_) {
-        return [e._t(o, null, null, _)];
+      return { key: o, fn: function(b) {
+        return [e._t(o, null, null, b)];
       } };
     })], null, !0) }, e.listboxOptionListeners));
   })], 2);
@@ -437,8 +429,6 @@ var Ke = function() {
   je,
   !1,
   null,
-  null,
-  null,
   null
 );
 const Xe = He.exports;
@@ -453,10 +443,10 @@ const Ze = {
   name: "bento-listbox-multi-select-category",
   components: {
     BentoCheckbox: Z,
-    BentoTypography: w,
+    BentoTypography: M,
     BentoListboxOption: q,
-    ChevronDownIcon: Se,
-    ChevronUpIcon: xe
+    ChevronDownIcon: pe,
+    ChevronUpIcon: Ce
   },
   props: {
     /**
@@ -501,31 +491,31 @@ const Ze = {
   setup(t, { emit: e }) {
     const s = A(!1), { t: l } = Y(), n = (v) => t.isOptionDisabled ? t.isOptionDisabled(v) : !1, o = i(
       () => t.category.items.every((v) => n(v))
-    ), _ = V(t, "staticCategories"), d = i(() => s.value || t.staticCategories), r = i(() => ({
+    ), b = V(t, "staticCategories"), d = i(() => s.value || t.staticCategories), r = i(() => ({
       [`b-listbox-multi-select-category--${j.DISABLED}`]: o.value,
       [`b-listbox-multi-select-category--${j.STATIC_CATEGORY}`]: t.staticCategories
     })), u = (v) => {
       v.preventDefault(), s.value = !s.value;
-    }, p = (v) => {
+    }, S = (v) => {
       var F;
-      const x = n(v), R = ((F = t.selectedItemsList) == null ? void 0 : F.includes(v.value)) || !1;
-      return { isDisabled: x, isPreSelected: R };
-    }, h = i(
+      const C = n(v), R = ((F = t.selectedItemsList) == null ? void 0 : F.includes(v.value)) || !1;
+      return { isDisabled: C, isPreSelected: R };
+    }, x = i(
       () => t.category.items.filter((v) => {
-        const { isDisabled: x, isPreSelected: R } = p(v);
-        return x && R || !x;
+        const { isDisabled: C, isPreSelected: R } = S(v);
+        return C && R || !C;
       })
     ), E = i(
       () => {
         var v;
-        return (v = h.value) == null ? void 0 : v.filter(
-          ({ value: x }) => {
+        return (v = x.value) == null ? void 0 : v.filter(
+          ({ value: C }) => {
             var R;
-            return (R = t.selectedItemsList) == null ? void 0 : R.includes(x);
+            return (R = t.selectedItemsList) == null ? void 0 : R.includes(C);
           }
         );
       }
-    ), m = i(() => {
+    ), f = i(() => {
       const v = s.value ? "categoryOpened" : "categoryClosed";
       return l(v, { category: t.category.label });
     }), y = i(
@@ -537,21 +527,21 @@ const Ze = {
       e(U.SELECT_CATEGORY);
     }, B = () => {
       e(U.UNSELECT_CATEGORY);
-    }, { isAllSelected: S, isIndeterminate: O, toggleSelectAll: T } = le(
+    }, { isAllSelected: p, isIndeterminate: O, toggleSelectAll: T } = le(
       E,
-      h,
+      x,
       L,
       B
     );
     return {
       // Values
-      chevronTitle: m,
+      chevronTitle: f,
       conditionalClass: r,
       hasAllPropsDisabled: o,
       isOpen: s,
-      isAllSelected: S,
+      isAllSelected: p,
       isIndeterminate: O,
-      isStaticCategory: _,
+      isStaticCategory: b,
       // Computed
       showItemChildren: d,
       categoryLabelProps: y,
@@ -572,18 +562,16 @@ var Qe = function() {
   et,
   !1,
   null,
-  "f360ac3d",
-  null,
-  null
+  "f360ac3d"
 );
 const st = tt.exports;
-var M = /* @__PURE__ */ ((t) => (t.SELECT_CATEGORY = "select-category", t.TOGGLE_CHECKBOX_SELECTION = "toggle-checkbox-selection", t.UNSELECT_CATEGORY = "unselect-category", t))(M || {});
+var P = /* @__PURE__ */ ((t) => (t.SELECT_CATEGORY = "select-category", t.TOGGLE_CHECKBOX_SELECTION = "toggle-checkbox-selection", t.UNSELECT_CATEGORY = "unselect-category", t))(P || {});
 const lt = $({
   name: "listbox-multi-select-options",
   components: {
     BentoCheckbox: Z,
     BentoListboxOption: q,
-    BentoTypography: w,
+    BentoTypography: M,
     ListboxMultiSelectCategory: st
   },
   props: {
@@ -642,19 +630,19 @@ const lt = $({
     staticCategories: { type: Boolean, default: !1 }
   },
   emits: [
-    M.TOGGLE_CHECKBOX_SELECTION,
-    M.SELECT_CATEGORY,
-    M.UNSELECT_CATEGORY
+    P.TOGGLE_CHECKBOX_SELECTION,
+    P.SELECT_CATEGORY,
+    P.UNSELECT_CATEGORY
   ],
   setup(t, { emit: e }) {
     const s = (r) => {
-      e(M.TOGGLE_CHECKBOX_SELECTION, r);
+      e(P.TOGGLE_CHECKBOX_SELECTION, r);
     }, l = (r) => !!r.items, n = (r) => {
       const u = t.isMultiLevel && t.searching;
       return r.description && (!t.isMultiLevel || u);
-    }, o = (r) => r.items ? !!r.items.find((u) => t.selectedItemsList.includes(u.value)) : t.selectedItemsList.includes(r.value), _ = (r, u) => {
+    }, o = (r) => r.items ? !!r.items.find((u) => t.selectedItemsList.includes(u.value)) : t.selectedItemsList.includes(r.value), b = (r, u) => {
       if (l(u))
-        return e(r ? M.SELECT_CATEGORY : M.UNSELECT_CATEGORY, u);
+        return e(r ? P.SELECT_CATEGORY : P.UNSELECT_CATEGORY, u);
       s(u.value);
     };
     return {
@@ -667,10 +655,10 @@ const lt = $({
       isOptionSelected: o,
       shouldShowDescription: n,
       toggleCheckboxSelection: s,
-      selectSearch: _,
+      selectSearch: b,
       // Enums
       BentoListboxEvent: a,
-      ListboxMultiSelectOptionsEvent: M
+      ListboxMultiSelectOptionsEvent: P
     };
   }
 });
@@ -695,9 +683,7 @@ var nt = function() {
   ot,
   !1,
   null,
-  "b2db9f50",
-  null,
-  null
+  "b2db9f50"
 );
 const it = at.exports, ct = {
   "en-US": {
@@ -731,7 +717,7 @@ const it = at.exports, ct = {
   emits: ["unselect-item", "unselect-category"],
   setup(t, { emit: e }) {
     const { t: s } = Y();
-    return { __sfc: !0, emit: e, t: s, unselectOption: (n) => n.items ? e("unselect-category", n) : e("unselect-item", n), BentoTypography: w, BaseButton: Ce, CrossSmallIcon: he };
+    return { __sfc: !0, emit: e, t: s, unselectOption: (n) => n.items ? e("unselect-category", n) : e("unselect-item", n), BentoTypography: M, BaseButton: he, CrossSmallIcon: xe };
   }
 });
 var dt = function() {
@@ -743,24 +729,22 @@ var dt = function() {
       return [s(l.CrossSmallIcon, { attrs: { "svg-title": l.t("remove") } })];
     }, proxy: !0 }], null, !0) }, [s(l.BentoTypography, { staticClass: "b-listbox-multi-select-chips__option-text", attrs: { el: "span", variant: "caption" } }, [e._v(e._s(n.label))])], 1)], 1);
   }), 0);
-}, _t = [], bt = /* @__PURE__ */ D(
+}, bt = [], mt = /* @__PURE__ */ D(
   ut,
   dt,
-  _t,
+  bt,
   !1,
   null,
-  "931e5246",
-  null,
-  null
+  "931e5246"
 );
-const vt = bt.exports, mt = {
+const vt = mt.exports, ft = {
   "en-US": {
     allSelected: "All selected ({total})",
     numberOfTotalSelected: "{number} of {total} selected",
     numbersSelected: "{number} selected",
     selectAll: "Select all ({total})"
   }
-}, ft = (t) => {
+}, _t = (t) => {
   const e = i(() => {
     var l;
     return !!((l = t.value) != null && l.find(({ items: n }) => !!n));
@@ -773,12 +757,12 @@ const vt = bt.exports, mt = {
     flattenedItemsList: s
   };
 }, gt = $({
-  i18n: { messages: mt },
+  i18n: { messages: ft },
   name: "bento-listbox-multi-select",
   components: {
     BentoCheckbox: Z,
     BentoListboxOption: q,
-    BentoTypography: w,
+    BentoTypography: M,
     ListboxMultiSelectOptions: it,
     ListboxMultiSelectChips: vt
   },
@@ -819,8 +803,8 @@ const vt = bt.exports, mt = {
      */
     lazyLoadType: {
       type: String,
-      default: P.NONE,
-      validator: (t) => Object.values(P).includes(t)
+      default: w.NONE,
+      validator: (t) => Object.values(w).includes(t)
     },
     /**
      * Flag that indicates that an external search it's being made
@@ -844,87 +828,87 @@ const vt = bt.exports, mt = {
   },
   emits: [a.SELECT],
   setup(t, { emit: e, slots: s }) {
-    const { t: l } = Y(), n = A(null), o = A(null), _ = A(null), d = i(
+    const { t: l } = Y(), n = A(null), o = A(null), b = A(null), d = i(
       () => t.selectedValues.map(({ value: c }) => c)
-    ), { isMultiLevelSelect: r, flattenedItemsList: u } = ft(V(t, "items")), p = (c) => {
-      var C;
-      const b = t.isOptionDisabled(c), f = ((C = d.value) == null ? void 0 : C.includes(c.value)) || !1;
-      return { isDisabled: b, isPreSelected: f };
-    }, h = i(() => {
+    ), { isMultiLevelSelect: r, flattenedItemsList: u } = _t(V(t, "items")), S = (c) => {
+      var h;
+      const m = t.isOptionDisabled(c), _ = ((h = d.value) == null ? void 0 : h.includes(c.value)) || !1;
+      return { isDisabled: m, isPreSelected: _ };
+    }, x = i(() => {
       if (t.searching && r)
         return t.items;
-      const c = u.value.filter((b) => {
-        const { isDisabled: f, isPreSelected: C } = p(b);
-        return f && C || !f;
+      const c = u.value.filter((m) => {
+        const { isDisabled: _, isPreSelected: h } = S(m);
+        return _ && h || !_;
       });
-      return t.selectedValues.forEach((b) => {
-        c.find((f) => f.value === b.value) || c.push(b);
+      return t.selectedValues.forEach((m) => {
+        c.find((_) => _.value === m.value) || c.push(m);
       }), c;
     }), E = i(
       () => {
         var c;
-        return (c = h.value) == null ? void 0 : c.filter((b) => {
-          var f;
-          return b.items && r.value && t.searching ? b.items.filter(
+        return (c = x.value) == null ? void 0 : c.filter((m) => {
+          var _;
+          return m.items && r.value && t.searching ? m.items.filter(
             (g) => (t.selectedValues ?? []).includes(g.value)
-          ).length === b.items.length : (f = d.value) == null ? void 0 : f.includes(b.value);
+          ).length === m.items.length : (_ = d.value) == null ? void 0 : _.includes(m.value);
         });
       }
-    ), m = () => r.value && !t.searching ? u.value.length : t.items.length, y = i(() => {
-      var C;
-      const c = h.value.length, b = m(), f = ((C = E.value) == null ? void 0 : C.length) || 0;
-      return f === 0 ? l("selectAll", { total: c }) : f === b ? l("allSelected", { total: b }) : f <= b ? l("numberOfTotalSelected", { number: f, total: b }) : l("numbersSelected", { number: f });
+    ), f = () => r.value && !t.searching ? u.value.length : t.items.length, y = i(() => {
+      var h;
+      const c = x.value.length, m = f(), _ = ((h = E.value) == null ? void 0 : h.length) || 0;
+      return _ === 0 ? l("selectAll", { total: c }) : _ === m ? l("allSelected", { total: m }) : _ <= m ? l("numberOfTotalSelected", { number: _, total: m }) : l("numbersSelected", { number: _ });
     }), L = (c) => {
-      const b = (C) => {
-        const { isDisabled: g, isPreSelected: N } = p(C);
+      const m = (h) => {
+        const { isDisabled: g, isPreSelected: N } = S(h);
         return g && N || !g;
-      }, f = c.filter(b).filter((C) => !d.value.includes(C.value));
-      e(a.SELECT, [...t.selectedValues, ...f]);
+      }, _ = c.filter(m).filter((h) => !d.value.includes(h.value));
+      e(a.SELECT, [...t.selectedValues, ..._]);
     }, B = (c) => {
-      const b = (g) => {
-        const { isDisabled: N, isPreSelected: me } = p(g);
-        return !(N && me);
-      }, f = c.filter(b).map(({ value: g }) => g), C = t.selectedValues.filter((g) => !(f != null && f.includes(g.value)));
-      e(a.SELECT, C);
-    }, S = () => {
+      const m = (g) => {
+        const { isDisabled: N, isPreSelected: fe } = S(g);
+        return !(N && fe);
+      }, _ = c.filter(m).map(({ value: g }) => g), h = t.selectedValues.filter((g) => !(_ != null && _.includes(g.value)));
+      e(a.SELECT, h);
+    }, p = () => {
       L(u.value);
     }, O = () => {
       B(u.value);
-    }, { isAllSelected: T, isIndeterminate: v, toggleSelectAll: x } = le(
+    }, { isAllSelected: T, isIndeterminate: v, toggleSelectAll: C } = le(
       E,
-      h,
-      S,
+      x,
+      p,
       O
     ), R = (c) => {
       L(c.items);
     }, F = (c) => {
       B(c.items);
-    }, W = (c, b) => {
-      let f = !1;
-      const C = t.selectedValues.filter(({ value: g }) => b.value === g ? (f = !0, !1) : !0);
-      f || C.push(b), e(c, C);
+    }, W = (c, m) => {
+      let _ = !1;
+      const h = t.selectedValues.filter(({ value: g }) => m.value === g ? (_ = !0, !1) : !0);
+      _ || h.push(m), e(c, h);
     }, z = i(() => {
       if (!r.value)
         return t.selectedValues;
-      const c = (g) => d.value.includes(g.value), b = (g) => !t.staticCategories && g.every((N) => c(N));
+      const c = (g) => d.value.includes(g.value), m = (g) => !t.staticCategories && g.every((N) => c(N));
       return t.items.flatMap(
-        (g) => g.items && !b(g.items) ? g.items : g
+        (g) => g.items && !m(g.items) ? g.items : g
       ).filter((g) => g.items ? !0 : c(g));
     }), K = i(() => {
-      var f, C, g, N;
-      const c = ["automatic", "button"].includes(t.lazyLoadType), b = ((f = t.selectedValues) == null ? void 0 : f.length) > 0 && ((C = E.value) == null ? void 0 : C.length) !== ((g = u.value) == null ? void 0 : g.length);
-      return c && t.hasMoreItems ? !!((N = t.selectedValues) != null && N.length) : b;
+      var _, h, g, N;
+      const c = ["automatic", "button"].includes(t.lazyLoadType), m = ((_ = t.selectedValues) == null ? void 0 : _.length) > 0 && ((h = E.value) == null ? void 0 : h.length) !== ((g = u.value) == null ? void 0 : g.length);
+      return c && t.hasMoreItems ? !!((N = t.selectedValues) != null && N.length) : m;
     }), I = i(() => ["automatic", "button"].includes(t.lazyLoadType) ? !t.hasMoreItems : !0), G = i(
       () => n.value ? [n.value] : []
     ), oe = i(
       () => {
-        var c, b;
-        return (b = (c = o.value) == null ? void 0 : c.$children) != null && b.length ? o.value.$children : [];
+        var c, m;
+        return (m = (c = o.value) == null ? void 0 : c.$children) != null && m.length ? o.value.$children : [];
       }
     ), ae = i(
       () => {
-        var c, b;
-        return (b = (c = _.value) == null ? void 0 : c.$children) != null && b.length ? _.value.$children : [];
+        var c, m;
+        return (m = (c = b.value) == null ? void 0 : c.$children) != null && m.length ? b.value.$children : [];
       }
     ), ie = i(() => ({ label: y, value: T })), ce = i(() => [
       ie,
@@ -936,7 +920,7 @@ const vt = bt.exports, mt = {
         ...oe.value,
         ...ae.value
       ][c].$el.focus();
-    }, { moveToNextElement: ue, moveToPreviousElement: de, moveToFirstElement: _e, moveToLastElement: be } = ne(
+    }, { moveToNextElement: ue, moveToPreviousElement: de, moveToFirstElement: be, moveToLastElement: me } = ne(
       {
         items: A(ce),
         isOptionDisabled: t.isOptionDisabled
@@ -945,14 +929,14 @@ const vt = bt.exports, mt = {
     ), ve = {
       [k.ARROW_UP]: (c) => de(c),
       [k.ARROW_DOWN]: (c) => ue(c),
-      [k.HOME]: _e,
-      [k.END]: be
+      [k.HOME]: be,
+      [k.END]: me
     };
     return {
       // Refs
       selectAllListboxItemsRef: n,
       selectedListboxItemsRef: o,
-      listboxItemsRef: _,
+      listboxItemsRef: b,
       // Values
       isAllSelected: T,
       showSelectedItems: K,
@@ -969,7 +953,7 @@ const vt = bt.exports, mt = {
       // Methods
       selectAllCategory: R,
       toggleCheckboxSelection: W,
-      toggleSelectAll: x,
+      toggleSelectAll: C,
       unselectAllCategory: F,
       // Events
       listboxListeners: ve
@@ -993,33 +977,31 @@ var yt = function() {
       return [e._t(n, null, null, o)];
     } };
   })], null, !0) })], 1);
-}, pt = [], St = /* @__PURE__ */ D(
+}, St = [], pt = /* @__PURE__ */ D(
   gt,
   yt,
-  pt,
+  St,
   !1,
   null,
-  "8e21add2",
-  null,
-  null
+  "8e21add2"
 );
-const ee = St.exports, xt = {
+const ee = pt.exports, Ct = {
   "en-US": {
     showMore: "Show more",
     loading: "Loading"
   }
-}, Ct = 36, ht = $({
+}, ht = 36, xt = $({
   name: "bento-listbox",
   components: {
     BentoEmptyState: ye,
     BentoListboxSingleSelect: Xe,
     BentoListboxMultiSelect: ee,
-    BentoTypography: w,
+    BentoTypography: M,
     BentoLoadingIndicator: ge,
     BentoLoadingButton: Ee
   },
   directives: { BentoKeyboardNavigationDirective: X },
-  i18n: { messages: xt },
+  i18n: { messages: Ct },
   props: {
     /**
      * Defines a string value that labels an interactive element.
@@ -1075,8 +1057,8 @@ const ee = St.exports, xt = {
      */
     lazyLoadType: {
       type: String,
-      default: P.NONE,
-      validator: (t) => Object.values(P).includes(t)
+      default: w.NONE,
+      validator: (t) => Object.values(w).includes(t)
     },
     /**
      * If enabled, the user will be able to select multiple items.
@@ -1124,52 +1106,52 @@ const ee = St.exports, xt = {
     a.TAB
   ],
   setup(t, { emit: e, slots: s }) {
-    const l = A([]), n = V(t, "items"), { t: o } = Y(), _ = i(() => t.lazyLoadType !== P.AUTOMATIC), d = i(() => t.lazyLoadType === P.AUTOMATIC), r = () => {
+    const l = A([]), n = V(t, "items"), { t: o } = Y(), b = i(() => t.lazyLoadType !== w.AUTOMATIC), d = i(() => t.lazyLoadType === w.AUTOMATIC), r = () => {
       var I;
-      return typeof (t == null ? void 0 : t.virtualScroll) == "object" && ((I = t == null ? void 0 : t.virtualScroll) != null && I.itemHeight) ? t.virtualScroll.itemHeight : Ct;
+      return typeof (t == null ? void 0 : t.virtualScroll) == "object" && ((I = t == null ? void 0 : t.virtualScroll) != null && I.itemHeight) ? t.virtualScroll.itemHeight : ht;
     }, {
       containerRef: u,
-      containerProps: p,
-      onScroll: h,
+      containerProps: S,
+      onScroll: x,
       list: E,
-      wrapperProps: m
+      wrapperProps: f
     } = Te(n, {
       itemHeight: r(),
       // Disable virtual scrolling if not enabled or if lazy loading is enabled or if multi-select
       disabled: (t == null ? void 0 : t.multiple) || (t == null ? void 0 : t.virtualScroll) === !1 || (t == null ? void 0 : t.lazyLoadType) !== "none"
     }), y = i(
-      () => _.value ? "true" : void 0
+      () => b.value ? "true" : void 0
     ), L = i(
-      () => _.value && t.loading ? "true" : "false"
+      () => b.value && t.loading ? "true" : "false"
     ), B = i(
-      () => _.value ? "polite" : void 0
-    ), S = (I) => (G) => {
+      () => b.value ? "polite" : void 0
+    ), p = (I) => (G) => {
       e(I, G);
     }, O = () => {
       e(a.SHOW_MORE);
-    }, T = pe(() => {
+    }, T = Se(() => {
       const I = u.value;
       if (!I)
         return;
       const G = Math.round(I.scrollTop) + I.clientHeight >= I.scrollHeight;
       t.hasMoreItems && G && !t.loading && O();
     }), v = () => {
-      d.value ? T() : h();
-    }, x = i(() => {
+      d.value ? T() : x();
+    }, C = i(() => {
       var I;
       return t.searching && ((I = t.items) == null ? void 0 : I.length) === 0;
     }), R = i(
-      () => t.lazyLoadType === P.BUTTON && t.hasMoreItems
+      () => t.lazyLoadType === w.BUTTON && t.hasMoreItems
     ), F = i(
       () => t.loading ? J.LOADING : J.START
     ), W = i(() => t.loading ? o("loading") : o("showMore")), z = i(() => ({
       ...t.emptyState,
       variant: "condensed"
     })), K = {
-      [a.SELECT]: S(a.SELECT),
-      [a.SPACE]: S(a.SPACE),
-      [a.TAB]: S(a.TAB),
-      [a.ENTER]: S(a.ENTER)
+      [a.SELECT]: p(a.SELECT),
+      [a.SPACE]: p(a.SPACE),
+      [a.TAB]: p(a.TAB),
+      [a.ENTER]: p(a.ENTER)
     };
     return {
       // Refs
@@ -1180,21 +1162,21 @@ const ee = St.exports, xt = {
       ariaBusy: L,
       ariaLive: B,
       // Values
-      containerProps: p,
-      isSearchResultEmpty: x,
+      containerProps: S,
+      isSearchResultEmpty: C,
       limitedEmptyStateProps: z,
       loadingButtonState: F,
       slots: s,
       shouldDisplayShowMoreButton: R,
       showMoreButtonText: W,
       virtualisedItems: E,
-      wrapperProps: m,
+      wrapperProps: f,
       // Enums
       BentoKeyboardNavigationKeyDownEvent: k,
       BentoListboxEvent: a,
       // Methods
       onListboxContainerScroll: v,
-      onOptionSelected: S,
+      onOptionSelected: p,
       emitShowMore: O,
       listboxListeners: K
     };
@@ -1214,14 +1196,12 @@ var Et = function() {
     return e.emitShowMore.apply(null, arguments);
   } } }, [e._v(" " + e._s(e.showMoreButtonText) + " ")])], 1) : e.loading ? s("div", { staticClass: "b-listbox__lazy-load" }, [s("bento-loading-indicator")], 1) : e._e()]], 2)]);
 }, Lt = [], Tt = /* @__PURE__ */ D(
-  ht,
+  xt,
   Et,
   Lt,
   !1,
   null,
-  "28929030",
-  null,
-  null
+  "28929030"
 );
 const zt = Tt.exports, H = (t, e) => {
   for (const s of t) {
@@ -1234,7 +1214,7 @@ const zt = Tt.exports, H = (t, e) => {
 }, Vt = (t, e, s) => {
   const l = A([]), n = A(), o = (r) => {
     n.value = s.value ? r.map(({ value: u }) => u) : r[0].value;
-  }, _ = (r) => {
+  }, b = (r) => {
     l.value = r, o(r);
   }, d = () => {
     l.value = [], n.value = null;
@@ -1248,16 +1228,16 @@ const zt = Tt.exports, H = (t, e) => {
       }
       const r = !Array.isArray(e.value), u = [...l.value];
       d();
-      const p = (h) => {
-        let E = H(t.value, h);
-        E || (E = H(u, h)), E || (E = h.toString()), l.value.push({ value: h, label: E });
+      const S = (x) => {
+        let E = H(t.value, x);
+        E || (E = H(u, x)), E || (E = x.toString()), l.value.push({ value: x, label: E });
       };
       if (r) {
-        const h = e.value;
-        p(h), o(l.value);
+        const x = e.value;
+        S(x), o(l.value);
         return;
       }
-      e.value.forEach(p), o(l.value);
+      e.value.forEach(S), o(l.value);
     },
     { immediate: !0 }
   ), {
@@ -1266,14 +1246,14 @@ const zt = Tt.exports, H = (t, e) => {
     cachedListboxSelectedValues: n,
     // Methods
     resetCache: d,
-    setCachedValues: _
+    setCachedValues: b
   };
 };
 export {
-  zt as B,
-  Vt as a,
-  P as b,
-  a as c,
-  ft as u
+  w as B,
+  a,
+  zt as b,
+  Vt as c,
+  _t as u
 };
-//# sourceMappingURL=use-cached-selected-values.98a9ed01.js.map
+//# sourceMappingURL=use-cached-selected-values.CVLzxvTi.js.map