@adyen/bento-vue2 1.62.1 → 1.63.0

package/dist/chunks/{use-cached-selected-values.DzIppuhI.js → use-cached-selected-values.CDBmVxYM.js}

@@ -1,26 +1,28 @@
-import { computed as c, ref as A, onMounted as ye, onUnmounted as he, watch as K, defineComponent as P, toRef as F, useSlots as Se } from "vue";
-import { B as z } from "./typography.J1v_SPG3.js";
-import { B as xe } from "./loading-indicator.z8COalOc.js";
-import { B as Ce } from "./empty-state.mtXfb1BB.js";
-import { u as J } from "./i18n.BQkEbtPM.js";
-import { d as Ee } from "./debounce.DUTu11PS.js";
+import { computed as i, ref as T, onMounted as Ce, onUnmounted as xe, watch as j, defineComponent as M, toRef as G, useSlots as Se } from "vue";
+import { B as Y } from "./typography.J1v_SPG3.js";
+import { B as Ee } from "./loading-indicator.z8COalOc.js";
+import { B as Oe } from "./empty-state.mtXfb1BB.js";
+import { u as Z } from "./i18n.BQkEbtPM.js";
+import { d as Te } from "./debounce.DUTu11PS.js";
 import "./index.Cl4_42j5.js";
-import { B as Z } from "./checkbox.DkCukYh0.js";
-import { B as Oe } from "./chip.OV0EWIP3.js";
-import { C as Te, a as Ae } from "./chevron-up.CHK1E4p9.js";
-import { B as D, a as Q } from "./keyboard-navigation.pB8weElW.js";
-import { n as M } from "./_plugin-vue2_normalizer.CeySl7Fu.js";
-import { d as Le, e as ie } from "./button-actions._OIvTdKt.js";
+import { B as Ae } from "./chip.OV0EWIP3.js";
+import { C as q, N as Le } from "./minus-small.DJacLGTw.js";
+import { C as Ie } from "./checkmark-small.DVDtD4HQ.js";
+import { n as N } from "./_plugin-vue2_normalizer.CeySl7Fu.js";
+import { C as ke } from "./chevron-down.eYtgv5ly.js";
+import { C as Re } from "./chevron-up.d8cwIlA_.js";
+import { B, a as Q } from "./keyboard-navigation.pB8weElW.js";
+import { d as De, e as ce } from "./button-actions._OIvTdKt.js";
 /* empty css              */
-import { o as Ie } from "./resize.Bqks3WUm.js";
+import { o as Be } from "./resize.Bqks3WUm.js";
 import "../assets/use-cached-selected-values.css";
-const ue = (l, e, t, s) => {
-  const o = c(
+const de = (l, e, t, s) => {
+  const o = i(
     () => {
       var v, S;
       return !!((v = l.value) != null && v.length) && ((S = l.value) == null ? void 0 : S.length) === e.value.length;
     }
-  ), n = c(() => {
+  ), n = i(() => {
     var v;
     return l.value == null || l.value.length === 0 ? !1 : ((v = l.value) == null ? void 0 : v.length) !== e.value.length;
   });
@@ -32,85 +34,85 @@ const ue = (l, e, t, s) => {
     }
   };
 };
-function Re(l, { disabled: e, itemHeight: t, overscan: s = 5, prefixHeight: o }) {
-  const n = A(null), d = A([]), v = A(0), S = A(0), i = A(0);
+function $e(l, { disabled: e, itemHeight: t, overscan: s = 5, prefixHeight: o }) {
+  const n = T(null), d = T([]), v = T(0), S = T(0), c = T(0);
   let r;
-  const y = c(() => {
-    const b = typeof t == "number" ? l.value.length * t : l.value.reduce((L, T, E) => L + t(E), 0), x = typeof t == "number" ? v.value * t : l.value.slice(0, v.value).reduce((L, T, E) => L + t(E), 0);
+  const h = i(() => {
+    const f = typeof t == "number" ? l.value.length * t : l.value.reduce((A, L, y) => A + t(y), 0), C = typeof t == "number" ? v.value * t : l.value.slice(0, v.value).reduce((A, L, y) => A + t(y), 0);
     return {
       style: {
-        marginTop: `${x}px`,
-        height: `${b - x}px`
+        marginTop: `${C}px`,
+        height: `${f - C}px`
       }
     };
   }), O = () => {
-    const b = (o == null ? void 0 : o.value) ?? 0, x = Math.max(n.value.scrollTop - b, 0);
+    const f = (o == null ? void 0 : o.value) ?? 0, C = Math.max(n.value.scrollTop - f, 0);
     if (typeof t == "number")
-      return Math.floor(x / t);
-    let L = 0, T = 0;
-    for (let E = 0; E < l.value.length; E += 1) {
-      const C = t(E);
-      if (L += C, L >= x) {
-        T = E;
+      return Math.floor(C / t);
+    let A = 0, L = 0;
+    for (let y = 0; y < l.value.length; y += 1) {
+      const w = t(y);
+      if (A += w, A >= C) {
+        L = y;
         break;
       }
     }
-    return T;
-  }, p = () => {
-    if (i.value = n.value.clientHeight, typeof t == "number")
-      return Math.ceil(i.value / t);
-    const b = v.value ?? 0;
-    let x = 0, L = 0;
-    for (let T = b; T < l.value.length; T += 1) {
-      const E = t(T);
-      if (x += E, L = T, x > i.value)
+    return L;
+  }, g = () => {
+    if (c.value = n.value.clientHeight, typeof t == "number")
+      return Math.ceil(c.value / t);
+    const f = v.value ?? 0;
+    let C = 0, A = 0;
+    for (let L = f; L < l.value.length; L += 1) {
+      const y = t(L);
+      if (C += y, A = L, C > c.value)
         break;
     }
-    return L - b;
+    return A - f;
   }, u = () => {
     if (n.value) {
-      const b = p();
-      v.value = O(), S.value = Math.min(v.value + b + s, l.value.length), d.value = l.value.slice(v.value, S.value);
+      const f = g();
+      v.value = O(), S.value = Math.min(v.value + f + s, l.value.length), d.value = l.value.slice(v.value, S.value);
     }
   }, I = () => {
     u();
   };
-  e || (ye(() => {
-    n.value && (i.value = n.value.clientHeight, r = Ie(n.value, ({ clientHeight: b }) => {
-      i.value = b, u();
+  e || (Ce(() => {
+    n.value && (c.value = n.value.clientHeight, r = Be(n.value, ({ clientHeight: f }) => {
+      c.value = f, u();
     }), u());
-  }), he(() => {
+  }), xe(() => {
     r == null || r.disconnect();
-  }), K(
+  }), j(
     () => l.value,
     () => {
       u();
     }
   ));
-  const B = {
+  const D = {
     ref: n,
     style: { overflowY: "auto" }
   };
   return e ? {
     containerRef: n,
-    containerProps: B,
+    containerProps: D,
     // eslint-disable-next-line @typescript-eslint/no-empty-function
     onScroll: () => {
     },
     list: l
   } : {
     containerRef: n,
-    containerProps: B,
+    containerProps: D,
     onScroll: I,
     list: d,
-    wrapperProps: y
+    wrapperProps: h
   };
 }
-var a = /* @__PURE__ */ ((l) => (l.SELECT = "select", l.SHOW_MORE = "show-more", l.ESCAPE = "escape-pressed", l.CLICK = "click", l.ENTER = "enter-pressed", l.SPACE = "space-pressed", l.TAB = "tab-pressed", l.CLOSE_DROPDOWN = "close-dropdown", l))(a || {}), U = /* @__PURE__ */ ((l) => (l.AUTOMATIC = "automatic", l.BUTTON = "button", l.NONE = "none", l))(U || {});
-const ke = P({
+var a = /* @__PURE__ */ ((l) => (l.SELECT = "select", l.SHOW_MORE = "show-more", l.ESCAPE = "escape-pressed", l.CLICK = "click", l.ENTER = "enter-pressed", l.SPACE = "space-pressed", l.TAB = "tab-pressed", l.CLOSE_DROPDOWN = "close-dropdown", l))(a || {}), z = /* @__PURE__ */ ((l) => (l.AUTOMATIC = "automatic", l.BUTTON = "button", l.NONE = "none", l))(z || {});
+const Ne = M({
   name: "bento-listbox-static-category",
   components: {
-    BentoTypography: z
+    BentoTypography: Y
   },
   props: {
     /**
@@ -122,18 +124,18 @@ const ke = P({
     }
   }
 });
-var Be = function() {
+var Me = function() {
   var e = this, t = e._self._c;
   return e._self._setupProxy, t("div", { staticClass: "b-listbox-single-select-category" }, [t("bento-typography", { staticClass: "b-listbox-single-select-category__label-text", attrs: { variant: "caption", el: "span" } }, [e._v(" " + e._s(e.categoryLabel) + " ")]), t("div", [e._t("default")], 2)], 1);
-}, De = [], Ne = /* @__PURE__ */ M(
-  ke,
-  Be,
-  De,
+}, we = [], Pe = /* @__PURE__ */ N(
+  Ne,
+  Me,
+  we,
   !1,
   null,
   "4aa8cc6e"
 );
-const Me = Ne.exports, $e = P({
+const Fe = Pe.exports, Ge = M({
   name: "bento-listbox-option",
   props: {
     /**
@@ -147,13 +149,13 @@ const Me = Ne.exports, $e = P({
   },
   emits: [a.CLICK, a.ENTER, a.SPACE, a.TAB],
   setup(l, { emit: e }) {
-    const t = c(() => ({
+    const t = i(() => ({
       "b-listbox-option--disabled": l.disabled,
       "b-listbox-option--selected": l.selected
     }));
     return {
       // Enums
-      BentoKeyboardNavigationKeyDownEvent: D,
+      BentoKeyboardNavigationKeyDownEvent: B,
       BentoListboxEvent: a,
       // Values
       conditionalClasses: t,
@@ -167,7 +169,7 @@ const Me = Ne.exports, $e = P({
     };
   }
 });
-var we = function() {
+var Ue = function() {
   var e = this, t = e._self._c;
   return e._self._setupProxy, t("div", e._b({ staticClass: "b-listbox-option", class: e.conditionalClasses, attrs: { role: "option" }, on: { click: e.onClick, keydown: [function(s) {
     return !s.type.indexOf("key") && e._k(s.keyCode, "enter", 13, s.key, "Enter") ? null : e.onOptionSelected(e.BentoListboxEvent.ENTER, s);
@@ -176,38 +178,38 @@ var we = function() {
   }, function(s) {
     return !s.type.indexOf("key") && e._k(s.keyCode, "tab", 9, s.key, "Tab") ? null : e.onOptionSelected(e.BentoListboxEvent.TAB, s);
   }] } }, "div", e.$attrs, !1), [e._t("default")], 2);
-}, Pe = [], Fe = /* @__PURE__ */ M(
-  $e,
-  we,
-  Pe,
+}, ze = [], Ye = /* @__PURE__ */ N(
+  Ge,
+  Ue,
+  ze,
   !1,
   null,
   "a1e9ebff"
 );
-const q = Fe.exports;
-let ce = 0;
-const Ge = {
+const H = Ye.exports;
+let re = 0;
+const We = {
   beforeCreate() {
-    this.uuid = ce.toString(), ce += 1;
+    this.uuid = re.toString(), re += 1;
   }
 };
-var Ue = function() {
+var Ke = function() {
   var e = this, t = e._self._c;
   return t("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"] ? t("title", [e._v(e._s(e.$attrs["svg-title"]))]) : e._e(), t("path", { attrs: { fill: "#001222", d: "M15.0608 4.00011L14.0001 2.93945L6.00011 10.9395L2.00011 6.93945L0.939453 8.00011L6.00011 13.0608L15.0608 4.00011Z" } })]);
-}, ze = [], Ye = /* @__PURE__ */ M(
-  Ge,
-  Ue,
-  ze,
+}, qe = [], je = /* @__PURE__ */ N(
+  We,
+  Ke,
+  qe,
   !1,
   null,
   null
 );
-const We = Ye.exports, Ke = P({
+const He = je.exports, Ve = M({
   name: "bento-listbox-single-select-option",
   components: {
-    BentoListboxOption: q,
-    BentoTypography: z,
-    CheckmarkIcon: We
+    BentoListboxOption: H,
+    BentoTypography: Y,
+    CheckmarkIcon: He
   },
   props: {
     /**
@@ -231,7 +233,7 @@ const We = Ye.exports, Ke = P({
   setup(l, { emit: e }) {
     const t = (d) => {
       l.disabled || e(d, l.option);
-    }, s = c(() => l.disabled ? !0 : null), o = c(() => l.selected ? !0 : null), n = c(() => l.disabled ? -1 : 0);
+    }, s = i(() => l.disabled ? !0 : null), o = i(() => l.selected ? !0 : null), n = i(() => l.disabled ? -1 : 0);
     return {
       // Values
       ariaDisabled: s,
@@ -244,7 +246,7 @@ const We = Ye.exports, Ke = P({
     };
   }
 });
-var qe = function() {
+var Xe = function() {
   var e = this, t = e._self._c;
   return e._self._setupProxy, t("bento-listbox-option", { staticClass: "b-listbox-single-select-option", attrs: { disabled: e.disabled, selected: e.selected, "aria-selected": e.ariaSelected, "aria-disabled": e.ariaDisabled, tabindex: e.tabIndex }, on: { click: function(s) {
     return e.onOptionSelected(e.BentoListboxEvent.SELECT);
@@ -257,18 +259,18 @@ var qe = function() {
   } } }, [e._t("default", function() {
     return [t("span", { staticClass: "b-listbox-single-select-option__text" }, [t("bento-typography", { attrs: { el: "span" } }, [e._v(e._s(e.option.label))]), e.option.description ? t("bento-typography", { staticClass: "b-listbox-single-select-option__description", attrs: { el: "span" } }, [e._v(" " + e._s(e.option.description) + " ")]) : e._e()], 1)];
   }, null, e.option), t("span", { staticClass: "b-listbox-single-select-option__check-icon" }, [t("checkmark-icon", { directives: [{ name: "show", rawName: "v-show", value: e.selected, expression: "selected" }], attrs: { "svg-title": "selected" } })], 1)], 2);
-}, je = [], He = /* @__PURE__ */ M(
-  Ke,
-  qe,
-  je,
+}, Je = [], Ze = /* @__PURE__ */ N(
+  Ve,
+  Xe,
+  Je,
   !1,
   null,
   "5a5ff36a"
 );
-const Xe = He.exports, de = ({ items: l, hasStaticCategories: e }, t) => {
-  const s = c(
+const Qe = Ze.exports, fe = ({ items: l, hasStaticCategories: e }, t) => {
+  const s = i(
     () => e.value ? l.value.flatMap((u) => u.items) : l.value
-  ), o = c(() => s.value.length - 1), n = A(0), d = (u) => {
+  ), o = i(() => s.value.length - 1), n = T(0), d = (u) => {
     switch (u) {
       case "increase":
         n.value += 1;
@@ -280,15 +282,15 @@ const Xe = He.exports, de = ({ items: l, hasStaticCategories: e }, t) => {
   }, v = ({ edgeCaseItem: u }, I) => {
     n.value !== u && (d(I), t(n.value));
   }, S = (u) => {
-    p(u), v(
+    g(u), v(
       {
         edgeCaseItem: o.value
       },
       "increase"
       /* INCREASE */
     );
-  }, i = (u) => {
-    p(u), v(
+  }, c = (u) => {
+    g(u), v(
       {
         edgeCaseItem: 0
       },
@@ -297,28 +299,28 @@ const Xe = He.exports, de = ({ items: l, hasStaticCategories: e }, t) => {
     );
   }, r = () => {
     n.value = 0, t(n.value);
-  }, y = () => {
+  }, h = () => {
     n.value = o.value, t(n.value);
   }, O = (u) => {
     n.value = u;
-  }, p = (u) => {
+  }, g = (u) => {
     var I;
     (I = u == null ? void 0 : u.detail) == null || I.preventDefault();
   };
   return {
     moveToFirstElement: r,
-    moveToLastElement: y,
+    moveToLastElement: h,
     moveToNextElement: S,
-    moveToPreviousElement: i,
+    moveToPreviousElement: c,
     setListboxFocusedIndex: O,
-    preventDefault: p,
+    preventDefault: g,
     focusedIndex: n
   };
-}, Ve = P({
+}, et = M({
   name: "bento-listbox-single-select",
   components: {
-    BentoListboxSingleSelectCategory: Me,
-    BentoListboxSingleSelectOption: Xe
+    BentoListboxSingleSelectCategory: Fe,
+    BentoListboxSingleSelectOption: Qe
   },
   directives: { BentoKeyboardNavigationDirective: Q },
   inheritAttrs: !1,
@@ -363,32 +365,32 @@ const Xe = He.exports, de = ({ items: l, hasStaticCategories: e }, t) => {
   },
   emits: [a.SELECT, a.ENTER, a.SPACE, a.TAB],
   setup(l, { emit: e, expose: t, slots: s }) {
-    const o = A(null), n = A([]), d = c(() => {
-      var b;
-      return !!((b = l.selectedValue) != null && b.length) && l.selectedValue.at(0);
-    }), v = c(() => !!l.items.some(({ items: b }) => !!b)), S = (b) => (x) => {
-      e(b, [x]);
-    }, i = (b) => {
-      var x;
-      (x = o.value.querySelectorAll('[role="option"]')[b]) == null || x.focus();
+    const o = T(null), n = T([]), d = i(() => {
+      var f;
+      return !!((f = l.selectedValue) != null && f.length) && l.selectedValue.at(0);
+    }), v = i(() => !!l.items.some(({ items: f }) => !!f)), S = (f) => (C) => {
+      e(f, [C]);
+    }, c = (f) => {
+      var C;
+      (C = o.value.querySelectorAll('[role="option"]')[f]) == null || C.focus();
     }, {
       moveToNextElement: r,
-      moveToPreviousElement: y,
+      moveToPreviousElement: h,
       moveToFirstElement: O,
-      moveToLastElement: p,
+      moveToLastElement: g,
       setListboxFocusedIndex: u
-    } = de(
+    } = fe(
       {
-        items: F(l, "items"),
-        hasStaticCategories: F(l, "staticCategories")
+        items: G(l, "items"),
+        hasStaticCategories: G(l, "staticCategories")
       },
-      i
+      c
     ), I = {
-      [D.ARROW_UP]: y,
-      [D.ARROW_DOWN]: r,
-      [D.HOME]: O,
-      [D.END]: p
-    }, B = {
+      [B.ARROW_UP]: h,
+      [B.ARROW_DOWN]: r,
+      [B.HOME]: O,
+      [B.END]: g
+    }, D = {
       [a.SELECT]: S(a.SELECT),
       [a.SPACE]: S(a.SPACE),
       [a.TAB]: S(a.TAB),
@@ -419,11 +421,11 @@ const Xe = He.exports, de = ({ items: l, hasStaticCategories: e }, t) => {
       onOptionSelected: S,
       // Keyboard navigation
       listboxListeners: I,
-      listboxOptionListeners: B
+      listboxOptionListeners: D
     };
   }
 });
-var Je = function() {
+var tt = function() {
   var e = this, t = e._self._c;
   return e._self._setupProxy, t("div", e._g({ directives: [{ name: "bento-keyboard-navigation-directive", rawName: "v-bento-keyboard-navigation-directive" }], ref: "listboxRef" }, e.listboxListeners), [e.hasCategories && e.staticCategories ? e._l(e.items, function(s) {
     return t("bento-listbox-single-select-category", { key: s.value, attrs: { "category-label": s.label, role: "group" } }, e._l(s.items, function(o) {
@@ -440,30 +442,60 @@ var Je = function() {
       } };
     })], null, !0) }, e.listboxOptionListeners));
   })], 2);
-}, Ze = [], Qe = /* @__PURE__ */ M(
-  Ve,
-  Je,
-  Ze,
+}, st = [], lt = /* @__PURE__ */ N(
+  et,
+  tt,
+  st,
   !1,
   null,
   null
 );
-const et = Qe.exports;
-var X = /* @__PURE__ */ ((l) => (l.DISABLED = "disabled", l.STATIC_CATEGORY = "static-category", l))(X || {}), W = /* @__PURE__ */ ((l) => (l.SELECT_CATEGORY = "select-category", l.UNSELECT_CATEGORY = "unselect-category", l))(W || {});
-const tt = {
+const nt = lt.exports, ot = {}, it = /* @__PURE__ */ M({
+  ...ot,
+  __name: "listbox-decorative-checkbox",
+  props: {
+    disabled: { type: Boolean, default: !1 },
+    indeterminate: { type: Boolean, default: !1 },
+    checked: { type: Boolean, default: !1 }
+  },
+  setup(l) {
+    const e = l, t = i(() => ({
+      [`b-checkbox-input--${q.DISABLED}`]: e.disabled
+    })), s = i(() => ({
+      [`b-checkbox-input__outline--${q.UNCHECKED}`]: !e.checked && !e.indeterminate,
+      [`b-checkbox-input__outline--${q.CHECKED}`]: e.checked && !e.indeterminate,
+      [`b-checkbox-input__outline--${q.INDETERMINATE}`]: e.indeterminate
+    }));
+    return { __sfc: !0, props: e, conditionalClasses: t, outlineConditionalClasses: s, CheckmarkSmallIcon: Ie, MinusSmallIcon: Le };
+  }
+});
+var at = function() {
+  var e = this, t = e._self._c, s = e._self._setupProxy;
+  return t("div", { staticClass: "b-checkbox-input", class: s.conditionalClasses, attrs: { role: "presentation" } }, [e.indeterminate ? t(s.MinusSmallIcon, { staticClass: "b-checkbox-input__icon", attrs: { "svg-title": "", "aria-hidden": "true" } }) : e.checked ? t(s.CheckmarkSmallIcon, { staticClass: "b-checkbox-input__icon", attrs: { "svg-title": "", "aria-hidden": "true" } }) : e._e(), t("div", { staticClass: "b-checkbox-input__outline", class: s.outlineConditionalClasses })], 1);
+}, ct = [], rt = /* @__PURE__ */ N(
+  it,
+  at,
+  ct,
+  !1,
+  null,
+  "5dc60f05"
+);
+const ee = rt.exports;
+var X = /* @__PURE__ */ ((l) => (l.DISABLED = "disabled", l.STATIC_CATEGORY = "static-category", l))(X || {}), K = /* @__PURE__ */ ((l) => (l.SELECT_CATEGORY = "select-category", l.UNSELECT_CATEGORY = "unselect-category", l))(K || {});
+const ut = {
   "en-US": {
     categoryClosed: "{category} closed",
     categoryOpened: "{category} opened"
   }
-}, st = P({
-  i18n: { messages: tt },
+}, dt = M({
+  i18n: { messages: ut },
   name: "bento-listbox-multi-select-category",
   components: {
-    BentoCheckbox: Z,
-    BentoTypography: z,
-    BentoListboxOption: q,
-    ChevronDownIcon: Ae,
-    ChevronUpIcon: Te
+    BentoTypography: Y,
+    BentoListboxOption: H,
+    ChevronDownIcon: ke,
+    ChevronUpIcon: Re,
+    ListboxDecorativeCheckbox: ee
   },
   props: {
     /**
@@ -508,99 +540,100 @@ const tt = {
      */
     tabindex: { type: Number, default: -1 }
   },
-  emits: [W.SELECT_CATEGORY, W.UNSELECT_CATEGORY],
+  emits: [K.SELECT_CATEGORY, K.UNSELECT_CATEGORY],
   setup(l, { emit: e }) {
-    const t = A(!1), { t: s } = J(), o = (C) => l.isOptionDisabled ? l.isOptionDisabled(C) : !1, n = c(
-      () => l.category.items.every((C) => o(C))
-    ), d = F(l, "staticCategories"), v = c(() => t.value || l.staticCategories), S = c(() => ({
+    const t = T(!1), { t: s } = Z(), o = (E) => l.isOptionDisabled ? l.isOptionDisabled(E) : !1, n = i(
+      () => l.category.items.every((E) => o(E))
+    ), d = G(l, "staticCategories"), v = i(() => t.value || l.staticCategories), S = i(() => ({
       [`b-listbox-multi-select-category--${X.DISABLED}`]: n.value,
       [`b-listbox-multi-select-category--${X.STATIC_CATEGORY}`]: l.staticCategories
-    })), i = (C) => {
-      C.preventDefault(), t.value = !t.value;
-    }, r = (C) => {
-      var G;
-      const N = o(C), R = ((G = l.selectedItemsList) == null ? void 0 : G.includes(C.value)) || !1;
-      return { isDisabled: N, isPreSelected: R };
-    }, y = c(
-      () => l.category.items.filter((C) => {
-        const { isDisabled: N, isPreSelected: R } = r(C);
-        return N && R || !N;
+    })), c = (E) => {
+      E.preventDefault(), t.value = !t.value;
+    }, r = (E) => {
+      var U;
+      const $ = o(E), k = ((U = l.selectedItemsList) == null ? void 0 : U.includes(E.value)) || !1;
+      return { isDisabled: $, isPreSelected: k };
+    }, h = i(
+      () => l.category.items.filter((E) => {
+        const { isDisabled: $, isPreSelected: k } = r(E);
+        return $ && k || !$;
       })
-    ), O = c(
+    ), O = i(
       () => {
-        var C;
-        return (C = y.value) == null ? void 0 : C.filter(
-          ({ value: N }) => {
-            var R;
-            return (R = l.selectedItemsList) == null ? void 0 : R.includes(N);
+        var E;
+        return (E = h.value) == null ? void 0 : E.filter(
+          ({ value: $ }) => {
+            var k;
+            return (k = l.selectedItemsList) == null ? void 0 : k.includes($);
           }
         );
       }
-    ), p = c(() => {
-      const C = t.value ? "categoryOpened" : "categoryClosed";
-      return s(C, { category: l.category.label });
-    }), u = c(
+    ), g = i(() => {
+      const E = t.value ? "categoryOpened" : "categoryClosed";
+      return s(E, { category: l.category.label });
+    }), u = i(
       () => ({
         el: "span",
         variant: l.staticCategories ? "caption" : "body"
       })
     ), I = () => {
-      e(W.SELECT_CATEGORY);
-    }, B = () => {
-      e(W.UNSELECT_CATEGORY);
-    }, { isAllSelected: b, isIndeterminate: x, toggleSelectAll: L } = ue(
+      e(K.SELECT_CATEGORY);
+    }, D = () => {
+      e(K.UNSELECT_CATEGORY);
+    }, { isAllSelected: f, isIndeterminate: C, toggleSelectAll: A } = de(
       O,
-      y,
+      h,
       I,
-      B
-    ), T = A(b.value), E = () => {
-      T.value = !T.value, L(T.value);
+      D
+    ), L = i(() => C.value ? "mixed" : `${f.value}`), y = T(f.value), w = () => {
+      y.value = !y.value, A(y.value);
     };
-    return K(b, () => {
-      T.value = b.value;
+    return j(f, () => {
+      y.value = f.value;
     }), {
       // Values
-      chevronTitle: p,
+      chevronTitle: g,
       conditionalClass: S,
       hasAllPropsDisabled: n,
       isOpen: t,
-      isAllSelected: b,
-      isIndeterminate: x,
+      isAllSelected: f,
+      isIndeterminate: C,
       isStaticCategory: d,
       // Computed
       showItemChildren: v,
       categoryLabelProps: u,
+      ariaCheckedComputed: L,
       // Methods
-      handleSelectAll: E,
-      toggleOpen: i,
-      toggleSelectAll: L
+      handleSelectAll: w,
+      toggleOpen: c,
+      toggleSelectAll: A
     };
   }
 });
-var lt = function() {
+var ft = function() {
   var e = this, t = e._self._c;
-  return e._self._setupProxy, t("div", [t("bento-listbox-option", { staticClass: "b-listbox-multi-select-category__option", class: e.conditionalClass, attrs: { tabindex: e.tabindex }, on: { click: e.handleSelectAll, "enter-pressed": e.handleSelectAll, "space-pressed": function(s) {
+  return e._self._setupProxy, t("div", [t("bento-listbox-option", { staticClass: "b-listbox-multi-select-category__option", class: e.conditionalClass, attrs: { tabindex: e.tabindex, "aria-checked": e.ariaCheckedComputed, "aria-disabled": e.hasAllPropsDisabled }, on: { click: e.handleSelectAll, "enter-pressed": e.handleSelectAll, "space-pressed": function(s) {
     return s.preventDefault(), e.handleSelectAll.apply(null, arguments);
-  } } }, [e.isStaticCategory ? e._e() : t("bento-checkbox", { attrs: { "model-value": e.isAllSelected, indeterminate: e.isIndeterminate, disabled: e.hasAllPropsDisabled, "aria-label": e.category.label, value: e.category.value, tabindex: -1 } }), t("span", { staticClass: "b-listbox-multi-select-category__label" }, [t("bento-typography", e._b({ staticClass: "b-listbox-multi-select-category__label-text" }, "bento-typography", e.categoryLabelProps, !1), [e._v(" " + e._s(e.category.label) + " ")]), e.isStaticCategory ? e._e() : t("div", { staticClass: "b-listbox-multi-select-category__label-chevron", attrs: { "data-testid": "toggle-listbox" }, on: { "!click": function(s) {
+  } } }, [e.isStaticCategory ? e._e() : t("listbox-decorative-checkbox", { attrs: { indeterminate: e.isIndeterminate, disabled: e.hasAllPropsDisabled, checked: e.isAllSelected } }), t("span", { staticClass: "b-listbox-multi-select-category__label" }, [t("bento-typography", e._b({ staticClass: "b-listbox-multi-select-category__label-text" }, "bento-typography", e.categoryLabelProps, !1), [e._v(" " + e._s(e.category.label) + " ")]), e.isStaticCategory ? e._e() : t("div", { staticClass: "b-listbox-multi-select-category__label-chevron", attrs: { "data-testid": "toggle-listbox" }, on: { "!click": function(s) {
     return s.stopPropagation(), e.toggleOpen.apply(null, arguments);
   } } }, [e.isOpen ? t("chevron-up-icon", { attrs: { "svg-title": e.chevronTitle } }) : t("chevron-down-icon", { attrs: { "svg-title": e.chevronTitle } })], 1)], 1)], 1), t("div", { directives: [{ name: "show", rawName: "v-show", value: e.showItemChildren, expression: "showItemChildren" }] }, [e._t("default")], 2)], 1);
-}, nt = [], ot = /* @__PURE__ */ M(
-  st,
-  lt,
-  nt,
+}, bt = [], vt = /* @__PURE__ */ N(
+  dt,
+  ft,
+  bt,
   !1,
   null,
-  "5e190a4d"
+  "8586f887"
 );
-const at = ot.exports;
-var w = /* @__PURE__ */ ((l) => (l.SELECT_CATEGORY = "select-category", l.TOGGLE_CHECKBOX_SELECTION = "toggle-checkbox-selection", l.UNSELECT_CATEGORY = "unselect-category", l))(w || {});
-const it = P({
+const mt = vt.exports;
+var F = /* @__PURE__ */ ((l) => (l.SELECT_CATEGORY = "select-category", l.TOGGLE_CHECKBOX_SELECTION = "toggle-checkbox-selection", l.UNSELECT_CATEGORY = "unselect-category", l))(F || {});
+const _t = M({
   name: "listbox-multi-select-options",
   components: {
-    BentoCheckbox: Z,
-    BentoListboxOption: q,
-    BentoTypography: z,
-    ListboxMultiSelectCategory: at
+    BentoListboxOption: H,
+    BentoTypography: Y,
+    ListboxMultiSelectCategory: mt,
+    ListboxDecorativeCheckbox: ee
   },
   props: {
     /**
@@ -662,26 +695,26 @@ const it = P({
     staticCategories: { type: Boolean, default: !1 }
   },
   emits: [
-    w.TOGGLE_CHECKBOX_SELECTION,
-    w.SELECT_CATEGORY,
-    w.UNSELECT_CATEGORY
+    F.TOGGLE_CHECKBOX_SELECTION,
+    F.SELECT_CATEGORY,
+    F.UNSELECT_CATEGORY
   ],
   setup(l, { emit: e }) {
-    const t = (i) => {
-      l.isOptionDisabled(i) || e(w.TOGGLE_CHECKBOX_SELECTION, i);
-    }, s = (i) => !!i.items, o = (i) => {
+    const t = (c) => {
+      l.isOptionDisabled(c) || e(F.TOGGLE_CHECKBOX_SELECTION, c);
+    }, s = (c) => !!c.items, o = (c) => {
       const r = l.isMultiLevel && l.searching;
-      return i.description && (!l.isMultiLevel || r);
-    }, n = (i) => i.items ? !!i.items.find((r) => l.selectedItemsList.includes(r.value)) : l.selectedItemsList.includes(i.value), d = (i) => {
-      if (s(i)) {
-        const r = n(i) ? w.UNSELECT_CATEGORY : w.SELECT_CATEGORY;
-        e(r, i);
+      return c.description && (!l.isMultiLevel || r);
+    }, n = (c) => c.items ? !!c.items.find((r) => l.selectedItemsList.includes(r.value)) : l.selectedItemsList.includes(c.value), d = (c) => {
+      if (s(c)) {
+        const r = n(c) ? F.UNSELECT_CATEGORY : F.SELECT_CATEGORY;
+        e(r, c);
       } else
-        t(i);
+        t(c);
     };
     return {
       // Values
-      conditionalClasses: c(() => ({
+      conditionalClasses: i(() => ({
         "b-listbox-multi-select-options__static-category-option": l.staticCategories,
         "b-listbox-multi-select-options__category-option": l.categoryItems
       })),
@@ -690,51 +723,51 @@ const it = P({
       shouldShowDescription: o,
       toggleCheckboxSelection: t,
       toggleSearchOption: d,
-      computedTabindex: (i) => i + 1 === l.focusedIndex ? 0 : -1,
+      computedTabindex: (c) => c + 1 === l.focusedIndex ? 0 : -1,
       // Enums
       BentoListboxEvent: a,
-      ListboxMultiSelectOptionsEvent: w
+      ListboxMultiSelectOptionsEvent: F
     };
   }
 });
-var ct = function() {
+var pt = function() {
   var e = this, t = e._self._c;
   return e._self._setupProxy, t("div", e._l(e.items, function(s, o) {
-    return t("div", { key: `selected-${s.value}` }, [e.searching && e.isMultiLevel ? [t("bento-listbox-option", { staticClass: "b-listbox-multi-select-options", class: e.conditionalClasses, attrs: { disabled: e.isOptionDisabled ? e.isOptionDisabled(s) : null, tabindex: e.computedTabindex(o) }, on: { click: function(n) {
+    return t("div", { key: `selected-${s.value}` }, [e.searching && e.isMultiLevel ? [t("bento-listbox-option", { staticClass: "b-listbox-multi-select-options", class: e.conditionalClasses, attrs: { disabled: e.isOptionDisabled ? e.isOptionDisabled(s) : null, tabindex: e.computedTabindex(o), "aria-checked": `${e.isOptionSelected(s)}`, "aria-disabled": e.isOptionDisabled ? e.isOptionDisabled(s) : null }, on: { click: function(n) {
       return e.toggleSearchOption(s);
     }, "enter-pressed": function(n) {
       return e.toggleSearchOption(s);
     }, "space-pressed": function(n) {
       return n.preventDefault(), e.toggleSearchOption(s);
-    } } }, [t("bento-checkbox", { attrs: { "model-value": e.isOptionSelected(s), "aria-label": s.label, disabled: e.isOptionDisabled ? e.isOptionDisabled(s) : null, value: s.value, tabindex: "-1" } }), e._t("default", function() {
+    } } }, [t("listbox-decorative-checkbox", { attrs: { disabled: e.isOptionDisabled ? e.isOptionDisabled(s) : null, checked: e.isOptionSelected(s) } }), e._t("default", function() {
       return [t("span", { staticClass: "b-listbox-multi-select__option-text" }, [t("bento-typography", { attrs: { el: "span" } }, [e._v(e._s(s.label))]), e.shouldShowDescription(s) ? t("bento-typography", { staticClass: "b-listbox-multi-select__option-description", attrs: { el: "span" } }, [e._v(" " + e._s(s.description) + " ")]) : e._e()], 1)];
     }, null, s)], 2)] : [s.items ? [t("listbox-multi-select-category", { attrs: { category: s, "static-categories": e.staticCategories, "is-option-disabled": e.isOptionDisabled, "selected-items-list": e.selectedItemsList, tabindex: e.computedTabindex(o) }, on: { "select-category": function(n) {
       return e.$emit(e.ListboxMultiSelectOptionsEvent.SELECT_CATEGORY, s);
     }, "unselect-category": function(n) {
       return e.$emit(e.ListboxMultiSelectOptionsEvent.UNSELECT_CATEGORY, s);
-    } } }, [t("listbox-multi-select-options", { attrs: { "category-items": "", items: s.items, "is-option-disabled": e.isOptionDisabled, "focused-index": e.focusedIndex, "is-multi-level": e.isMultiLevel, "static-categories": e.staticCategories, "selected-items-list": e.selectedItemsList, searching: e.searching }, on: { "toggle-checkbox-selection": (n) => e.toggleCheckboxSelection(n) } })], 1)] : t("bento-listbox-option", { staticClass: "b-listbox-multi-select-options", class: e.conditionalClasses, attrs: { disabled: e.isOptionDisabled ? e.isOptionDisabled(s) : null, tabindex: e.computedTabindex(o) }, on: { click: function(n) {
+    } } }, [t("listbox-multi-select-options", { attrs: { "category-items": "", items: s.items, "is-option-disabled": e.isOptionDisabled, "focused-index": e.focusedIndex, "is-multi-level": e.isMultiLevel, "static-categories": e.staticCategories, "selected-items-list": e.selectedItemsList, searching: e.searching }, on: { "toggle-checkbox-selection": (n) => e.toggleCheckboxSelection(n) } })], 1)] : t("bento-listbox-option", { staticClass: "b-listbox-multi-select-options", class: e.conditionalClasses, attrs: { disabled: e.isOptionDisabled ? e.isOptionDisabled(s) : null, tabindex: e.computedTabindex(o), "aria-checked": `${e.isOptionSelected(s)}`, "aria-disabled": e.isOptionDisabled ? e.isOptionDisabled(s) : null }, on: { click: function(n) {
       return e.toggleCheckboxSelection(s);
     }, "enter-pressed": function(n) {
       return e.toggleCheckboxSelection(s);
     }, "space-pressed": function(n) {
       return n.preventDefault(), e.toggleCheckboxSelection(s);
-    } } }, [t("bento-checkbox", { attrs: { "model-value": e.selectedItemsList, "aria-label": s.label, disabled: e.isOptionDisabled ? e.isOptionDisabled(s) : null, value: s.value, tabindex: -1 } }), e._t("default", function() {
+    } } }, [t("listbox-decorative-checkbox", { attrs: { disabled: e.isOptionDisabled ? e.isOptionDisabled(s) : null, checked: e.isOptionSelected(s) } }), e._t("default", function() {
       return [t("span", { staticClass: "b-listbox-multi-select__option-text" }, [t("bento-typography", { attrs: { el: "span" } }, [e._v(e._s(s.label))]), e.shouldShowDescription(s) ? t("bento-typography", { staticClass: "b-listbox-multi-select__option-description", attrs: { el: "span" } }, [e._v(" " + e._s(s.description) + " ")]) : e._e()], 1)];
     }, null, s)], 2)]], 2);
   }), 0);
-}, rt = [], ut = /* @__PURE__ */ M(
-  it,
-  ct,
-  rt,
+}, gt = [], yt = /* @__PURE__ */ N(
+  _t,
+  pt,
+  gt,
   !1,
   null,
-  "e99d836e"
+  "0f830765"
 );
-const dt = ut.exports, ft = (l) => {
-  const e = c(() => {
+const ht = yt.exports, Ct = (l) => {
+  const e = i(() => {
     var s;
     return !!((s = l.value) != null && s.find(({ items: o }) => !!o));
-  }), t = c(() => {
+  }), t = i(() => {
     var s;
     return e.value ? (s = l.value) == null ? void 0 : s.reduce((o, n) => (n.items ? o.push(...n.items.flat()) : o.push(n), o), []) : l.value;
   });
@@ -742,15 +775,15 @@ const dt = ut.exports, ft = (l) => {
     isMultiLevelSelect: e,
     flattenedItemsList: t
   };
-}, bt = {
+}, xt = {
   "en-US": {
     allSelected: "All selected ({total})",
     numberOfTotalSelected: "{number} of {total} selected",
     numbersSelected: "{number} selected",
     selectAll: "Select all ({total})"
   }
-}, vt = { i18n: { messages: bt } }, mt = /* @__PURE__ */ P({
-  ...vt,
+}, St = { i18n: { messages: xt } }, Et = /* @__PURE__ */ M({
+  ...St,
   __name: "listbox-multi-select",
   props: {
     hasMoreItems: { type: Boolean, default: !1 },
@@ -763,119 +796,119 @@ const dt = ut.exports, ft = (l) => {
   },
   emits: ["select"],
   setup(l, { emit: e }) {
-    const t = l, { t: s } = J(), o = Se(), n = A(null), d = A(null), v = A(null), S = A(null), i = c(() => t.selectedValues.map(({ value: f }) => f)), { isMultiLevelSelect: r, flattenedItemsList: y } = ft(F(t, "items")), O = (f) => {
-      var h;
-      const _ = t.isOptionDisabled(f), m = ((h = i.value) == null ? void 0 : h.includes(f.value)) || !1;
+    const t = l, { t: s } = Z(), o = Se(), n = T(null), d = T(null), v = T(null), S = T(null), c = i(() => t.selectedValues.map(({ value: b }) => b)), { isMultiLevelSelect: r, flattenedItemsList: h } = Ct(G(t, "items")), O = (b) => {
+      var x;
+      const _ = t.isOptionDisabled(b), m = ((x = c.value) == null ? void 0 : x.includes(b.value)) || !1;
       return { isDisabled: _, isPreSelected: m };
-    }, p = c(() => {
+    }, g = i(() => {
       if (t.searching && r)
         return t.items;
-      const f = y.value.filter((_) => {
-        const { isDisabled: m, isPreSelected: h } = O(_);
-        return m && h || !m;
+      const b = h.value.filter((_) => {
+        const { isDisabled: m, isPreSelected: x } = O(_);
+        return m && x || !m;
       });
       return t.selectedValues.forEach((_) => {
-        f.find((m) => m.value === _.value) || f.push(_);
-      }), f;
-    }), u = c(
+        b.find((m) => m.value === _.value) || b.push(_);
+      }), b;
+    }), u = i(
       () => {
-        var f;
-        return (f = p.value) == null ? void 0 : f.filter((_) => {
+        var b;
+        return (b = g.value) == null ? void 0 : b.filter((_) => {
           var m;
           return _.items && r.value && t.searching ? _.items.filter(
-            (g) => (t.selectedValues ?? []).includes(g.value)
-          ).length === _.items.length : (m = i.value) == null ? void 0 : m.includes(_.value);
+            (p) => (t.selectedValues ?? []).includes(p.value)
+          ).length === _.items.length : (m = c.value) == null ? void 0 : m.includes(_.value);
         });
       }
-    ), I = () => r.value && !t.searching ? y.value.length : t.items.length, B = c(() => {
-      var h;
-      const f = p.value.length, _ = I(), m = ((h = u.value) == null ? void 0 : h.length) || 0;
-      return m === 0 ? s("selectAll", { total: f }) : m === _ ? s("allSelected", { total: _ }) : m <= _ ? s("numberOfTotalSelected", { number: m, total: _ }) : s("numbersSelected", { number: m });
-    }), b = (f) => {
-      const _ = (h) => {
-        const { isDisabled: g, isPreSelected: $ } = O(h);
-        return g && $ || !g;
-      }, m = f.filter(_).filter((h) => !i.value.includes(h.value));
+    ), I = () => r.value && !t.searching ? h.value.length : t.items.length, D = i(() => {
+      var x;
+      const b = g.value.length, _ = I(), m = ((x = u.value) == null ? void 0 : x.length) || 0;
+      return m === 0 ? s("selectAll", { total: b }) : m === _ ? s("allSelected", { total: _ }) : m <= _ ? s("numberOfTotalSelected", { number: m, total: _ }) : s("numbersSelected", { number: m });
+    }), f = (b) => {
+      const _ = (x) => {
+        const { isDisabled: p, isPreSelected: P } = O(x);
+        return p && P || !p;
+      }, m = b.filter(_).filter((x) => !c.value.includes(x.value));
       e("select", [...t.selectedValues, ...m]);
-    }, x = (f) => {
-      const _ = (g) => {
-        const { isDisabled: $, isPreSelected: pe } = O(g);
-        return !($ && pe);
-      }, m = f.filter(_).map(({ value: g }) => g), h = t.selectedValues.filter((g) => !(m != null && m.includes(g.value)));
-      e("select", h);
+    }, C = (b) => {
+      const _ = (p) => {
+        const { isDisabled: P, isPreSelected: he } = O(p);
+        return !(P && he);
+      }, m = b.filter(_).map(({ value: p }) => p), x = t.selectedValues.filter((p) => !(m != null && m.includes(p.value)));
+      e("select", x);
+    }, A = () => {
+      f(h.value);
     }, L = () => {
-      b(y.value);
-    }, T = () => {
-      x(y.value);
-    }, { isAllSelected: E, isIndeterminate: C, toggleSelectAll: N } = ue(
+      C(h.value);
+    }, { isAllSelected: y, isIndeterminate: w, toggleSelectAll: E } = de(
       u,
-      p,
-      L,
-      T
-    ), R = A(E.value), G = () => {
-      R.value = !R.value, N(R.value);
+      g,
+      A,
+      L
+    ), $ = i(() => w.value ? "mixed" : `${y.value}`), k = T(y.value), U = () => {
+      k.value = !k.value, E(k.value);
     };
-    K(E, () => {
-      R.value = E.value;
+    j(y, () => {
+      k.value = y.value;
     });
-    const j = (f) => {
-      b(f.items);
-    }, k = (f) => {
-      x(f.items);
-    }, Y = (f, _) => {
+    const R = (b) => {
+      f(b.items);
+    }, W = (b) => {
+      C(b.items);
+    }, be = (b, _) => {
       let m = !1;
-      const h = t.selectedValues.filter(({ value: g }) => _.value === g ? (m = !0, !1) : !0);
-      m || h.push(_), e(f, h);
-    }, fe = c(() => {
+      const x = t.selectedValues.filter(({ value: p }) => _.value === p ? (m = !0, !1) : !0);
+      m || x.push(_), e(b, x);
+    }, ve = i(() => {
       if (!r.value)
         return t.selectedValues;
-      const f = (g) => i.value.includes(g.value), _ = (g) => !t.staticCategories && g.every(($) => f($));
+      const b = (p) => c.value.includes(p.value), _ = (p) => !t.staticCategories && p.every((P) => b(P));
       return t.items.flatMap(
-        (g) => g.items && !_(g.items) ? g.items : g
-      ).filter((g) => g.items ? !0 : f(g));
-    }), be = c(() => {
-      var m, h, g, $;
-      const f = ["automatic", "button"].includes(t.lazyLoadType), _ = ((m = t.selectedValues) == null ? void 0 : m.length) > 0 && ((h = u.value) == null ? void 0 : h.length) !== ((g = y.value) == null ? void 0 : g.length);
-      return f && t.hasMoreItems ? !!(($ = t.selectedValues) != null && $.length) : _;
-    }), ve = c(() => ["automatic", "button"].includes(t.lazyLoadType) ? !t.hasMoreItems : !0), ee = c(() => ({ label: B, value: E })), te = c(() => [ee, ...F(t, "items").value]), se = (f) => {
+        (p) => p.items && !_(p.items) ? p.items : p
+      ).filter((p) => p.items ? !0 : b(p));
+    }), me = i(() => {
+      var m, x, p, P;
+      const b = ["automatic", "button"].includes(t.lazyLoadType), _ = ((m = t.selectedValues) == null ? void 0 : m.length) > 0 && ((x = u.value) == null ? void 0 : x.length) !== ((p = h.value) == null ? void 0 : p.length);
+      return b && t.hasMoreItems ? !!((P = t.selectedValues) != null && P.length) : _;
+    }), _e = i(() => ["automatic", "button"].includes(t.lazyLoadType) ? !t.hasMoreItems : !0), te = i(() => ({ label: D, value: y })), se = i(() => [te, ...G(t, "items").value]), le = (b) => {
       var m;
       (m = Array.from(
         n.value.querySelectorAll('[role="option"]')
-      ).filter((h) => h.checkVisibility())[f]) == null || m.focus();
+      ).filter((x) => x.checkVisibility())[b]) == null || m.focus();
     }, {
-      moveToNextElement: le,
-      moveToPreviousElement: ne,
-      moveToFirstElement: oe,
+      moveToNextElement: ne,
+      moveToPreviousElement: oe,
+      moveToFirstElement: ie,
       moveToLastElement: ae,
-      preventDefault: H,
-      focusedIndex: me
-    } = de(
+      preventDefault: V,
+      focusedIndex: pe
+    } = fe(
       {
-        items: A(te),
-        hasStaticCategories: F(t, "staticCategories")
+        items: T(se),
+        hasStaticCategories: G(t, "staticCategories")
       },
-      se
-    ), _e = {
-      [D.ARROW_UP]: (f) => ne(f),
-      [D.ARROW_DOWN]: (f) => le(f),
-      [D.HOME]: oe,
-      [D.END]: ae
-    }, ge = {
-      [D.ARROW_UP]: H,
-      [D.ARROW_DOWN]: H
+      le
+    ), ge = {
+      [B.ARROW_UP]: (b) => oe(b),
+      [B.ARROW_DOWN]: (b) => ne(b),
+      [B.HOME]: ie,
+      [B.END]: ae
+    }, ye = {
+      [B.ARROW_UP]: V,
+      [B.ARROW_DOWN]: V
     };
-    return { __sfc: !0, props: t, emit: e, t: s, slots: o, listboxRef: n, selectAllListboxItemsRef: d, selectedListboxItemsRef: v, listboxItemsRef: S, selectedItemsList: i, isMultiLevelSelect: r, flattenedItemsList: y, optionStates: O, enabledItems: p, visibleSelectedList: u, calculateTotalItems: I, selectAllCheckboxText: B, selectAll: b, unselectAll: x, selectAllItems: L, unselectAllItems: T, isAllSelected: E, isIndeterminate: C, toggleSelectAll: N, isSelectAllOn: R, handleSelectAll: G, selectAllCategory: j, unselectAllCategory: k, toggleCheckboxSelection: Y, selectedOptions: fe, showSelectedItems: be, showSelectAllCheckbox: ve, computedselectAllItemRefs: ee, computedItems: te, focusItem: se, moveToNextElement: le, moveToPreviousElement: ne, moveToFirstElement: oe, moveToLastElement: ae, preventDefault: H, focusedIndex: me, listboxListeners: _e, chipsSectionListeners: ge, BentoCheckbox: Z, BentoTypography: z, BentoChip: Oe, BentoListboxOption: q, ListboxMultiSelectOptions: dt, vBentoKeyboardNavigationDirective: Q, BentoListboxEvent: a };
+    return { __sfc: !0, props: t, emit: e, t: s, slots: o, listboxRef: n, selectAllListboxItemsRef: d, selectedListboxItemsRef: v, listboxItemsRef: S, selectedItemsList: c, isMultiLevelSelect: r, flattenedItemsList: h, optionStates: O, enabledItems: g, visibleSelectedList: u, calculateTotalItems: I, selectAllCheckboxText: D, selectAll: f, unselectAll: C, selectAllItems: A, unselectAllItems: L, isAllSelected: y, isIndeterminate: w, toggleSelectAll: E, ariaCheckedComputed: $, isSelectAllOn: k, handleSelectAll: U, selectAllCategory: R, unselectAllCategory: W, toggleCheckboxSelection: be, selectedOptions: ve, showSelectedItems: me, showSelectAllCheckbox: _e, computedselectAllItemRefs: te, computedItems: se, focusItem: le, moveToNextElement: ne, moveToPreviousElement: oe, moveToFirstElement: ie, moveToLastElement: ae, preventDefault: V, focusedIndex: pe, listboxListeners: ge, chipsSectionListeners: ye, ListboxDecorativeCheckbox: ee, BentoTypography: Y, BentoChip: Ae, BentoListboxOption: H, ListboxMultiSelectOptions: ht, vBentoKeyboardNavigationDirective: Q, BentoListboxEvent: a };
   }
 });
-var _t = function() {
+var Ot = function() {
   var e = this, t = e._self._c, s = e._self._setupProxy;
   return t("div", { ref: "listboxRef", staticClass: "b-listbox-multi-select" }, [s.showSelectedItems ? t("div", [t("ul", e._g({ directives: [{ name: "bento-keyboard-navigation-directive", rawName: "v-bento-keyboard-navigation-directive" }], staticClass: "b-listbox-multi-select__chips" }, s.chipsSectionListeners), e._l(s.selectedOptions, function(o) {
     return t("li", { key: o.value }, [t(s.BentoChip, { ref: "selectedListboxItemsRef", refInFor: !0, attrs: { disabled: e.isOptionDisabled(o), label: o.label, condensed: "" }, on: { click: function(n) {
       o.items ? s.unselectAllCategory(o) : s.toggleCheckboxSelection("select", o);
     } } })], 1);
-  }), 0), t("hr", { staticClass: "b-listbox-multi-select__divider" })]) : e._e(), t("div", e._g({ directives: [{ name: "bento-keyboard-navigation-directive", rawName: "v-bento-keyboard-navigation-directive" }] }, s.listboxListeners), [s.showSelectAllCheckbox ? t(s.BentoListboxOption, { ref: "selectAllListboxItemsRef", staticClass: "b-listbox-multi-select__option", attrs: { tabindex: s.focusedIndex === 0 ? 0 : -1 }, on: { click: s.handleSelectAll, "enter-pressed": s.handleSelectAll, "space-pressed": function(o) {
+  }), 0), t("hr", { staticClass: "b-listbox-multi-select__divider" })]) : e._e(), t("div", e._g({ directives: [{ name: "bento-keyboard-navigation-directive", rawName: "v-bento-keyboard-navigation-directive" }] }, s.listboxListeners), [s.showSelectAllCheckbox ? t(s.BentoListboxOption, { ref: "selectAllListboxItemsRef", staticClass: "b-listbox-multi-select__option", attrs: { tabindex: s.focusedIndex === 0 ? 0 : -1, "aria-checked": s.ariaCheckedComputed }, on: { click: s.handleSelectAll, "enter-pressed": s.handleSelectAll, "space-pressed": function(o) {
     return o.preventDefault(), s.handleSelectAll.apply(null, arguments);
-  } } }, [t(s.BentoCheckbox, { attrs: { "aria-label": s.selectAllCheckboxText, "model-value": s.isAllSelected, indeterminate: s.isIndeterminate, tabindex: -1 } }), t(s.BentoTypography, { attrs: { el: "span", "aria-hidden": "true" } }, [e._v(" " + e._s(s.selectAllCheckboxText) + " ")])], 1) : e._e(), s.showSelectAllCheckbox ? t("hr", { staticClass: "b-listbox-multi-select__divider" }) : e._e(), t(s.ListboxMultiSelectOptions, { ref: "listboxItemsRef", attrs: { items: e.items, "is-option-disabled": e.isOptionDisabled, "is-multi-level": s.isMultiLevelSelect, "static-categories": e.staticCategories, searching: e.searching, "selected-items-list": s.selectedItemsList, "focused-index": s.focusedIndex }, on: { "toggle-checkbox-selection": function(o) {
+  } } }, [t(s.ListboxDecorativeCheckbox, { attrs: { checked: s.isAllSelected, indeterminate: s.isIndeterminate } }), t(s.BentoTypography, { attrs: { el: "span" } }, [e._v(" " + e._s(s.selectAllCheckboxText) + " ")])], 1) : e._e(), s.showSelectAllCheckbox ? t("hr", { staticClass: "b-listbox-multi-select__divider" }) : e._e(), t(s.ListboxMultiSelectOptions, { ref: "listboxItemsRef", attrs: { items: e.items, "is-option-disabled": e.isOptionDisabled, "is-multi-level": s.isMultiLevelSelect, "static-categories": e.staticCategories, searching: e.searching, "selected-items-list": s.selectedItemsList, "focused-index": s.focusedIndex }, on: { "toggle-checkbox-selection": function(o) {
     return s.toggleCheckboxSelection("select", o);
   }, "select-category": s.selectAllCategory, "unselect-category": s.unselectAllCategory, "space-pressed": function(o) {
     return s.toggleCheckboxSelection(s.BentoListboxEvent.SPACE, o);
@@ -888,15 +921,15 @@ var _t = function() {
       return [e._t(n, null, null, d)];
     } };
   })], null, !0) })], 1)]);
-}, gt = [], pt = /* @__PURE__ */ M(
-  mt,
-  _t,
-  gt,
+}, Tt = [], At = /* @__PURE__ */ N(
+  Et,
+  Ot,
+  Tt,
   !1,
   null,
-  "a1c682be"
+  "9645b94f"
 );
-const re = pt.exports, yt = {
+const ue = At.exports, Lt = {
   "en-US": {
     loading: "Loading",
     showMore: "Show more"
@@ -909,18 +942,18 @@ const re = pt.exports, yt = {
     loading: "Carregando",
     showMore: "Mostrar mais"
   }
-}, ht = 36, St = P({
+}, It = 36, kt = M({
   name: "bento-listbox",
   components: {
-    BentoEmptyState: Ce,
-    BentoListboxSingleSelect: et,
-    BentoListboxMultiSelect: re,
-    BentoTypography: z,
-    BentoLoadingIndicator: xe,
-    BentoLoadingButton: Le
+    BentoEmptyState: Oe,
+    BentoListboxSingleSelect: nt,
+    BentoListboxMultiSelect: ue,
+    BentoTypography: Y,
+    BentoLoadingIndicator: Ee,
+    BentoLoadingButton: De
   },
   directives: { BentoKeyboardNavigationDirective: Q },
-  i18n: { messages: yt },
+  i18n: { messages: Lt },
   props: {
     /**
      * Defines a string value that labels an interactive element.
@@ -976,8 +1009,8 @@ const re = pt.exports, yt = {
      */
     lazyLoadType: {
       type: String,
-      default: U.NONE,
-      validator: (l) => Object.values(U).includes(l)
+      default: z.NONE,
+      validator: (l) => Object.values(z).includes(l)
     },
     /**
      * Indicates the listbox is loading filtered items.
@@ -1001,7 +1034,7 @@ const re = pt.exports, yt = {
      *
      * If enabled, hides the "Select all" checkbox in "multiple" mode.
      */
-    searching: re.props.searching,
+    searching: ue.props.searching,
     /**
      * The `input` value.
      * Providing an empty string or empty array will select no options.
@@ -1029,83 +1062,83 @@ const re = pt.exports, yt = {
     a.TAB
   ],
   setup(l, { emit: e, slots: t }) {
-    const s = A([]), o = F(l, "items"), { t: n } = J(), d = c(() => l.lazyLoadType !== U.AUTOMATIC), v = c(() => l.lazyLoadType === U.AUTOMATIC), S = () => {
-      var k;
-      return typeof (l == null ? void 0 : l.virtualScroll) == "object" && ((k = l == null ? void 0 : l.virtualScroll) != null && k.itemHeight) ? l.virtualScroll.itemHeight : ht;
+    const s = T([]), o = G(l, "items"), { t: n } = Z(), d = i(() => l.lazyLoadType !== z.AUTOMATIC), v = i(() => l.lazyLoadType === z.AUTOMATIC), S = () => {
+      var R;
+      return typeof (l == null ? void 0 : l.virtualScroll) == "object" && ((R = l == null ? void 0 : l.virtualScroll) != null && R.itemHeight) ? l.virtualScroll.itemHeight : It;
     }, {
-      containerRef: i,
+      containerRef: c,
       containerProps: r,
-      onScroll: y,
+      onScroll: h,
       list: O,
-      wrapperProps: p
-    } = Re(o, {
+      wrapperProps: g
+    } = $e(o, {
       itemHeight: S(),
       // Disable virtual scrolling if not enabled or if lazy loading is enabled or if multi-select
       disabled: (l == null ? void 0 : l.multiple) || (l == null ? void 0 : l.virtualScroll) === !1 || (l == null ? void 0 : l.lazyLoadType) !== "none"
-    }), u = c(
+    }), u = i(
       () => l.componentLoading !== void 0 || d.value ? "true" : void 0
-    ), I = c(
+    ), I = i(
       () => d.value && l.loading || l.componentLoading ? "true" : "false"
-    ), B = c(
+    ), D = i(
       () => d.value || l.componentLoading !== void 0 ? "polite" : void 0
-    ), b = (k) => (Y) => {
-      e(k, Y);
-    }, x = () => {
+    ), f = (R) => (W) => {
+      e(R, W);
+    }, C = () => {
       e(a.SHOW_MORE);
-    }, L = Ee(() => {
-      const k = i.value;
-      if (!k)
+    }, A = Te(() => {
+      const R = c.value;
+      if (!R)
         return;
-      const Y = Math.round(k.scrollTop) + k.clientHeight >= k.scrollHeight;
-      l.hasMoreItems && Y && !l.loading && x();
-    }), T = () => {
-      v.value ? L() : y();
-    }, E = c(() => {
-      var k;
-      return ((k = l.items) == null ? void 0 : k.length) === 0;
-    }), C = c(
-      () => l.lazyLoadType === U.BUTTON && l.hasMoreItems
-    ), N = c(
-      () => l.loading ? ie.LOADING : ie.START
-    ), R = c(() => l.loading ? n("loading") : n("showMore")), G = c(() => ({
+      const W = Math.round(R.scrollTop) + R.clientHeight >= R.scrollHeight;
+      l.hasMoreItems && W && !l.loading && C();
+    }), L = () => {
+      v.value ? A() : h();
+    }, y = i(() => {
+      var R;
+      return ((R = l.items) == null ? void 0 : R.length) === 0;
+    }), w = i(
+      () => l.lazyLoadType === z.BUTTON && l.hasMoreItems
+    ), E = i(
+      () => l.loading ? ce.LOADING : ce.START
+    ), $ = i(() => l.loading ? n("loading") : n("showMore")), k = i(() => ({
       ...l.emptyState,
       variant: "condensed"
-    })), j = {
-      [a.SELECT]: b(a.SELECT),
-      [a.SPACE]: b(a.SPACE),
-      [a.TAB]: b(a.TAB),
-      [a.ENTER]: b(a.ENTER)
+    })), U = {
+      [a.SELECT]: f(a.SELECT),
+      [a.SPACE]: f(a.SPACE),
+      [a.TAB]: f(a.TAB),
+      [a.ENTER]: f(a.ENTER)
     };
     return {
       // Refs
-      listboxRef: i,
+      listboxRef: c,
       listboxItemRef: s,
       // a11y
       ariaAtomic: u,
       ariaBusy: I,
-      ariaLive: B,
+      ariaLive: D,
       // Values
       containerProps: r,
-      isSearchResultEmpty: E,
-      limitedEmptyStateProps: G,
-      loadingButtonState: N,
+      isSearchResultEmpty: y,
+      limitedEmptyStateProps: k,
+      loadingButtonState: E,
       slots: t,
-      shouldDisplayShowMoreButton: C,
-      showMoreButtonText: R,
+      shouldDisplayShowMoreButton: w,
+      showMoreButtonText: $,
       virtualisedItems: O,
-      wrapperProps: p,
+      wrapperProps: g,
       // Enums
-      BentoKeyboardNavigationKeyDownEvent: D,
+      BentoKeyboardNavigationKeyDownEvent: B,
       BentoListboxEvent: a,
       // Methods
-      onListboxContainerScroll: T,
-      onOptionSelected: b,
-      emitShowMore: x,
-      listboxListeners: j
+      onListboxContainerScroll: L,
+      onOptionSelected: f,
+      emitShowMore: C,
+      listboxListeners: U
     };
   }
 });
-var xt = function() {
+var Rt = function() {
   var s;
   var e = this, t = e._self._c;
   return e._self._setupProxy, t("div", { directives: [{ name: "bento-keyboard-navigation-directive", rawName: "v-bento-keyboard-navigation-directive" }], ref: "listboxRef", staticClass: "b-listbox", style: (s = e.containerProps) == null ? void 0 : s.style, attrs: { id: e.id, role: "listbox", tabindex: "-1", "aria-busy": e.ariaBusy, "aria-atomic": e.ariaAtomic, "aria-label": e.ariaLabel, "aria-live": e.ariaLive }, on: { scroll: e.onListboxContainerScroll } }, [t("div", e._b({}, "div", e.wrapperProps, !1), [e.componentLoading ? t("div", { staticClass: "b-listbox__loading-filtered-items" }, [t("bento-loading-indicator")], 1) : e.isSearchResultEmpty ? t("div", { staticClass: "b-listbox__empty-search-message" }, [e.emptyState ? t("bento-empty-state", e._b({}, "bento-empty-state", e.limitedEmptyStateProps, !1)) : t("bento-typography", { attrs: { el: "span" } }, [e._v(e._s(e.noResultsMessage))])], 1) : [e.multiple ? [t("bento-listbox-multi-select", e._g({ ref: "listboxItemRef", attrs: { "has-more-items": e.hasMoreItems, items: e.items, "lazy-load-type": e.lazyLoadType, "static-categories": e.staticCategories, "selected-values": e.selectedValue, searching: e.searching, "is-option-disabled": e.isOptionDisabled }, scopedSlots: e._u([e._l(e.slots, function(o, n) {
@@ -1119,55 +1152,55 @@ var xt = function() {
   })], null, !0) }, e.listboxListeners))], e.shouldDisplayShowMoreButton ? t("div", { staticClass: "b-listbox__lazy-load" }, [t("bento-loading-button", { attrs: { state: e.loadingButtonState, variant: "secondary" }, on: { "!click": function(o) {
     return e.emitShowMore.apply(null, arguments);
   } } }, [e._v(" " + e._s(e.showMoreButtonText) + " ")])], 1) : e.loading ? t("div", { staticClass: "b-listbox__lazy-load" }, [t("bento-loading-indicator")], 1) : e._e()]], 2)]);
-}, Ct = [], Et = /* @__PURE__ */ M(
-  St,
-  xt,
-  Ct,
+}, Dt = [], Bt = /* @__PURE__ */ N(
+  kt,
+  Rt,
+  Dt,
   !1,
   null,
   "37a9ab16"
 );
-const Ut = Et.exports, V = (l, e) => {
+const Zt = Bt.exports, J = (l, e) => {
   for (const t of l) {
     if (t.value === e)
       return t;
     if (t.items) {
-      const s = V(t.items, e);
+      const s = J(t.items, e);
       if (s)
         return s;
     }
   }
   return null;
-}, Ot = (l) => typeof l == "object" && l !== null && "value" in l && "label" in l, zt = (l, e, t, s) => {
-  const o = A([]), n = A(), d = (r) => {
-    t.value ? n.value = r.map(({ value: y }) => y) : n.value = r.length > 0 ? r[0].value : null;
+}, $t = (l) => typeof l == "object" && l !== null && "value" in l && "label" in l, Qt = (l, e, t, s) => {
+  const o = T([]), n = T(), d = (r) => {
+    t.value ? n.value = r.map(({ value: h }) => h) : n.value = r.length > 0 ? r[0].value : null;
   }, v = (r) => {
-    t.value ? n.value = r.map(({ value: y, label: O }) => ({ value: y, label: O })) : n.value = r.length > 0 ? { value: r[0].value, label: r[0].label } : null;
+    t.value ? n.value = r.map(({ value: h, label: O }) => ({ value: h, label: O })) : n.value = r.length > 0 ? { value: r[0].value, label: r[0].label } : null;
   }, S = (r) => {
     o.value = r, s != null && s.value ? v(r) : d(r);
-  }, i = () => {
+  }, c = () => {
     o.value = [], n.value = null;
   };
-  return K(
+  return j(
     () => e.value,
     () => {
       if (!e.value && e.value !== 0) {
-        i();
+        c();
         return;
       }
-      const r = !Array.isArray(e.value), y = [...o.value];
-      i();
-      const O = (p) => {
-        if (Ot(p))
-          o.value.push(p);
+      const r = !Array.isArray(e.value), h = [...o.value];
+      c();
+      const O = (g) => {
+        if ($t(g))
+          o.value.push(g);
         else {
-          let u = V(l.value, p);
-          u || (u = V(y, p)), u || (u = { value: p, label: p.toString() }), o.value.push(u);
+          let u = J(l.value, g);
+          u || (u = J(h, g)), u || (u = { value: g, label: g.toString() }), o.value.push(u);
         }
       };
       if (r) {
-        const p = e.value;
-        O(p), s != null && s.value ? v(o.value) : d(o.value);
+        const g = e.value;
+        O(g), s != null && s.value ? v(o.value) : d(o.value);
         return;
       }
       e.value.forEach(O), s != null && s.value ? v(o.value) : d(o.value);
@@ -1178,15 +1211,15 @@ const Ut = Et.exports, V = (l, e) => {
     cachedSelectedListboxOptions: o,
     cachedListboxSelectedValues: n,
     // Methods
-    resetCache: i,
+    resetCache: c,
     setCachedValues: S
   };
 };
 export {
-  U as B,
+  z as B,
   a,
-  Ut as b,
-  zt as c,
-  ft as u
+  Zt as b,
+  Qt as c,
+  Ct as u
 };
-//# sourceMappingURL=use-cached-selected-values.DzIppuhI.js.map
+//# sourceMappingURL=use-cached-selected-values.CDBmVxYM.js.map