@adyen/bento-vue2 1.90.0 → 1.91.0

package/dist/chunks/{use-cached-selected-values.Bn3Y8Iuq.js → use-cached-selected-values.BJbWbkEQ.js}

@@ -1,45 +1,44 @@
-import { computed as n, ref as x, onMounted as Ne, onUnmounted as we, watch as X, defineComponent as G, nextTick as _e, toRef as H, useSlots as Ge, useAttrs as Pe } from "vue";
+import { computed as n, ref as x, onMounted as Ne, onUnmounted as we, watch as X, defineComponent as G, nextTick as pe, toRef as H, useSlots as Ge, useAttrs as Pe } from "vue";
 import { B as M, a as se } from "./keyboard-navigation.DWmhelVv.js";
 import { B as j } from "./typography.C8lPlsbD.js";
 import { B as Fe } from "./loading-indicator.PxbRzshH.js";
 import { B as Ye } from "./empty-state.DMV23IZy.js";
 import { u as le } from "./index.B6WW_F-J.js";
-import { d as ze } from "./debounce.DUTu11PS.js";
-import { o as Ue } from "./resize.Bqks3WUm.js";
+import { o as ze } from "./resize.Bqks3WUm.js";
 import "./index.Cl4_42j5.js";
-import { C as J, N as Ve } from "./minus-small.DJacLGTw.js";
-import { C as We } from "./checkmark-small.DVDtD4HQ.js";
+import { C as J, N as Ue } from "./minus-small.DJacLGTw.js";
+import { C as Ve } from "./checkmark-small.DVDtD4HQ.js";
 /* empty css              */
 import { n as N } from "./_plugin-vue2_normalizer.CeySl7Fu.js";
-import { B as Ke } from "./chip.BFY_-VCz.js";
-import { C as je } from "./chevron-down.eYtgv5ly.js";
-import { C as qe } from "./chevron-up.d8cwIlA_.js";
-import { g as be } from "./generate-uid.NJ8tVoha.js";
-import { a as He, b as fe } from "./button-actions.BmU1DngD.js";
+import { B as We } from "./chip.BFY_-VCz.js";
+import { C as Ke } from "./chevron-down.eYtgv5ly.js";
+import { C as je } from "./chevron-up.d8cwIlA_.js";
+import { g as me } from "./generate-uid.NJ8tVoha.js";
+import { a as qe, b as fe } from "./button-actions.Bdbu0bvt.js";
 import "../assets/use-cached-selected-values.css";
-const pe = (s, e, l, t) => {
+const ye = (s, e, l, t) => {
   const o = n(
     () => {
-      var f, A;
-      return !!((f = s.value) != null && f.length) && ((A = s.value) == null ? void 0 : A.length) === e.value.length;
+      var m, A;
+      return !!((m = s.value) != null && m.length) && ((A = s.value) == null ? void 0 : A.length) === e.value.length;
     }
   ), a = n(() => {
-    var f;
-    return s.value == null || s.value.length === 0 ? !1 : ((f = s.value) == null ? void 0 : f.length) !== e.value.length;
+    var m;
+    return s.value == null || s.value.length === 0 ? !1 : ((m = s.value) == null ? void 0 : m.length) !== e.value.length;
   });
   return {
     isAllSelected: o,
     isIndeterminate: a,
-    toggleSelectAll: (f) => {
-      f ? l() : t();
+    toggleSelectAll: (m) => {
+      m ? l() : t();
     }
   };
 };
-function Xe(s, { disabled: e, itemHeight: l, overscan: t = 5, prefixHeight: o }) {
-  const a = x(null), r = x([]), f = x(0), A = x(0), d = x(0);
+function He(s, { disabled: e, itemHeight: l, overscan: t = 5, prefixHeight: o }) {
+  const a = x(null), r = x([]), m = x(0), A = x(0), d = x(0);
   let b;
   const T = n(() => {
-    const I = typeof l == "number" ? s.value.length * l : s.value.reduce((S, v, y) => S + l(y), 0), O = typeof l == "number" ? f.value * l : s.value.slice(0, f.value).reduce((S, v, y) => S + l(y), 0);
+    const I = typeof l == "number" ? s.value.length * l : s.value.reduce((S, v, y) => S + l(y), 0), O = typeof l == "number" ? m.value * l : s.value.slice(0, m.value).reduce((S, v, y) => S + l(y), 0);
     return {
       style: {
         marginTop: `${O}px`,
@@ -62,7 +61,7 @@ function Xe(s, { disabled: e, itemHeight: l, overscan: t = 5, prefixHeight: o })
   }, p = () => {
     if (d.value = a.value.clientHeight, typeof l == "number")
       return Math.ceil(d.value / l);
-    const I = f.value ?? 0;
+    const I = m.value ?? 0;
     let O = 0, S = 0;
     for (let v = I; v < s.value.length; v += 1) {
       const y = l(v);
@@ -73,13 +72,13 @@ function Xe(s, { disabled: e, itemHeight: l, overscan: t = 5, prefixHeight: o })
   }, C = () => {
     if (a.value) {
       const I = p();
-      f.value = _(), A.value = Math.min(f.value + I + t, s.value.length), r.value = s.value.slice(f.value, A.value);
+      m.value = _(), A.value = Math.min(m.value + I + t, s.value.length), r.value = s.value.slice(m.value, A.value);
     }
   }, R = () => {
     C();
   };
   e || (Ne(() => {
-    a.value && (d.value = a.value.clientHeight, b = Ue(a.value, ({ clientHeight: I }) => {
+    a.value && (d.value = a.value.clientHeight, b = ze(a.value, ({ clientHeight: I }) => {
       d.value = I, C();
     }), C());
   }), we(() => {
@@ -110,7 +109,7 @@ function Xe(s, { disabled: e, itemHeight: l, overscan: t = 5, prefixHeight: o })
   };
 }
 var c = /* @__PURE__ */ ((s) => (s.SELECT = "select", s.SHOW_MORE = "show-more", s.ESCAPE = "escape-pressed", s.CLICK = "click", s.ENTER = "enter-pressed", s.SPACE = "space-pressed", s.TAB = "tab-pressed", s.CLOSE_DROPDOWN = "close-dropdown", s))(c || {}), K = /* @__PURE__ */ ((s) => (s.AUTOMATIC = "automatic", s.BUTTON = "button", s.NONE = "none", s))(K || {});
-const Je = G({
+const Xe = G({
   name: "bento-listbox-static-category",
   components: {
     BentoTypography: j
@@ -125,18 +124,18 @@ const Je = G({
     }
   }
 });
-var Ze = function() {
+var Je = function() {
   var e = this, l = e._self._c;
   return e._self._setupProxy, l("div", { staticClass: "b-listbox-single-select-category", attrs: { role: "group", "aria-label": e.categoryLabel } }, [l("bento-typography", { staticClass: "b-listbox-single-select-category__label-text", attrs: { variant: "caption", el: "span", "aria-hidden": "true" } }, [e._v(" " + e._s(e.categoryLabel) + " ")]), l("div", [e._t("default")], 2)], 1);
-}, Qe = [], et = /* @__PURE__ */ N(
+}, Ze = [], Qe = /* @__PURE__ */ N(
+  Xe,
   Je,
   Ze,
-  Qe,
   !1,
   null,
   "bfbc1649"
 );
-const tt = et.exports, st = G({
+const et = Qe.exports, tt = G({
   name: "bento-listbox-option",
   props: {
     /**
@@ -170,7 +169,7 @@ const tt = et.exports, st = G({
     };
   }
 });
-var lt = function() {
+var st = function() {
   var e = this, l = e._self._c;
   return e._self._setupProxy, l("div", e._b({ staticClass: "b-listbox-option", class: e.conditionalClasses, attrs: { role: "option" }, on: { click: e.onClick, keydown: [function(t) {
     return !t.type.indexOf("key") && e._k(t.keyCode, "enter", 13, t.key, "Enter") ? null : e.onOptionSelected(e.BentoListboxEvent.ENTER, t);
@@ -179,38 +178,38 @@ var lt = function() {
   }, function(t) {
     return !t.type.indexOf("key") && e._k(t.keyCode, "tab", 9, t.key, "Tab") ? null : e.onOptionSelected(e.BentoListboxEvent.TAB, t);
   }] } }, "div", e.$attrs, !1), [e._t("default")], 2);
-}, ot = [], at = /* @__PURE__ */ N(
+}, lt = [], ot = /* @__PURE__ */ N(
+  tt,
   st,
   lt,
-  ot,
   !1,
   null,
   "c345b6c0"
 );
-const Z = at.exports;
-let me = 0;
-const nt = {
+const Z = ot.exports;
+let ve = 0;
+const at = {
   beforeCreate() {
-    this.uuid = me.toString(), me += 1;
+    this.uuid = ve.toString(), ve += 1;
   }
 };
-var it = function() {
+var nt = function() {
   var e = this, l = e._self._c;
   return l("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"] ? l("title", [e._v(e._s(e.$attrs["svg-title"]))]) : e._e(), l("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" } })]);
-}, ct = [], rt = /* @__PURE__ */ N(
+}, it = [], ct = /* @__PURE__ */ N(
+  at,
   nt,
   it,
-  ct,
   !1,
   null,
   null
 );
-const ut = rt.exports, dt = G({
+const rt = ct.exports, ut = G({
   name: "bento-listbox-single-select-option",
   components: {
     BentoListboxOption: Z,
     BentoTypography: j,
-    CheckmarkIcon: ut
+    CheckmarkIcon: rt
   },
   props: {
     /**
@@ -247,7 +246,7 @@ const ut = rt.exports, dt = G({
     };
   }
 });
-var bt = function() {
+var dt = function() {
   var e = this, l = e._self._c;
   return e._self._setupProxy, l("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(t) {
     return e.onOptionSelected(e.BentoListboxEvent.SELECT);
@@ -260,15 +259,15 @@ var bt = function() {
   } } }, [e._t("default", function() {
     return [l("span", { staticClass: "b-listbox-single-select-option__text" }, [l("bento-typography", { attrs: { el: "span" } }, [e._v(e._s(e.option.label))]), e.option.description ? l("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), l("span", { staticClass: "b-listbox-single-select-option__check-icon" }, [l("checkmark-icon", { directives: [{ name: "show", rawName: "v-show", value: e.selected, expression: "selected" }], attrs: { "svg-title": "selected" } })], 1)], 2);
-}, ft = [], mt = /* @__PURE__ */ N(
+}, bt = [], mt = /* @__PURE__ */ N(
+  ut,
   dt,
   bt,
-  ft,
   !1,
   null,
   "bb14d75a"
 );
-const vt = mt.exports, ye = ({ items: s }, e) => {
+const ft = mt.exports, he = ({ items: s }, e) => {
   const l = n(() => s.value.length - 1), t = x(0), o = (_) => {
     switch (_) {
       case "increase":
@@ -288,7 +287,7 @@ const vt = mt.exports, ye = ({ items: s }, e) => {
       "increase"
       /* INCREASE */
     );
-  }, f = (_) => {
+  }, m = (_) => {
     T(_), a(
       {
         edgeCaseItem: 0
@@ -310,22 +309,22 @@ const vt = mt.exports, ye = ({ items: s }, e) => {
     moveToFirstElement: A,
     moveToLastElement: d,
     moveToNextElement: r,
-    moveToPreviousElement: f,
+    moveToPreviousElement: m,
     setListboxFocusedIndex: b,
     preventDefault: T,
     focusedIndex: t
   };
-}, he = (s, e, l = x("option"), t = !0) => {
+}, Se = (s, e, l = x("option"), t = !0) => {
   const o = x([]), a = async () => {
     if (!s.value || s.value.nodeType === Node.COMMENT_NODE)
       return;
     const r = Array.from(s.value.querySelectorAll(`[role="${l.value}"]`));
-    o.value = t ? r.filter((f) => f.checkVisibility()) : r;
+    o.value = t ? r.filter((m) => m.checkVisibility()) : r;
   };
   return X(
     e,
     () => {
-      _e(() => {
+      pe(() => {
         a();
       });
     },
@@ -334,11 +333,11 @@ const vt = mt.exports, ye = ({ items: s }, e) => {
     visibleDomOptions: o,
     updateVisibleDomOptions: a
   };
-}, gt = G({
+}, vt = G({
   name: "bento-listbox-single-select",
   components: {
-    BentoListboxSingleSelectCategory: tt,
-    BentoListboxSingleSelectOption: vt
+    BentoListboxSingleSelectCategory: et,
+    BentoListboxSingleSelectOption: ft
   },
   directives: { BentoKeyboardNavigationDirective: se },
   inheritAttrs: !1,
@@ -383,7 +382,7 @@ const vt = mt.exports, ye = ({ items: s }, e) => {
   },
   emits: [c.SELECT, c.ENTER, c.SPACE, c.TAB],
   setup(s, { emit: e, expose: l, slots: t, attrs: o }) {
-    const a = x(null), r = x([]), f = n(() => {
+    const a = x(null), r = x([]), m = n(() => {
       var v;
       return !!((v = s.selectedValue) != null && v.length) && s.selectedValue.at(0);
     }), A = n(
@@ -398,7 +397,7 @@ const vt = mt.exports, ye = ({ items: s }, e) => {
       }
     ), d = n(() => !!s.items.some(({ items: v }) => !!v)), b = (v) => (y) => {
       e(v, [y]);
-    }, { visibleDomOptions: T } = he(a, H(s, "items"), x("option"), !1), _ = (v) => {
+    }, { visibleDomOptions: T } = Se(a, H(s, "items"), x("option"), !1), _ = (v) => {
       var y;
       (y = T.value[v]) == null || y.focus();
     }, {
@@ -407,7 +406,7 @@ const vt = mt.exports, ye = ({ items: s }, e) => {
       moveToFirstElement: R,
       moveToLastElement: B,
       setListboxFocusedIndex: I
-    } = ye(
+    } = he(
       {
         items: T
       },
@@ -440,7 +439,7 @@ const vt = mt.exports, ye = ({ items: s }, e) => {
       // Values
       listboxRef: a,
       listboxItemRef: r,
-      selectedItem: f,
+      selectedItem: m,
       slots: t,
       ariaAttributes: A,
       // Computed
@@ -453,13 +452,13 @@ const vt = mt.exports, ye = ({ items: s }, e) => {
     };
   }
 });
-var _t = function() {
+var gt = function() {
   var e = this, l = e._self._c;
   return e._self._setupProxy, l("div", e._g(e._b({ directives: [{ name: "bento-keyboard-navigation-directive", rawName: "v-bento-keyboard-navigation-directive" }], ref: "listboxRef", attrs: { role: "listbox" } }, "div", e.ariaAttributes, !1), e.listboxListeners), [e.hasCategories && e.staticCategories ? e._l(e.items, function(t) {
     return l("bento-listbox-single-select-category", { key: t.value, attrs: { "category-label": t.label } }, e._l(t.items, function(o) {
       return l("bento-listbox-single-select-option", e._g({ key: o.value, ref: "listboxItemRef", refInFor: !0, attrs: { role: "option", option: o, disabled: e.isOptionDisabled ? e.isOptionDisabled(o) : null, selected: o.value === e.selectedItem.value }, scopedSlots: e._u([e._l(e.slots, function(a, r) {
-        return { key: r, fn: function(f) {
-          return [e._t(r, null, null, f)];
+        return { key: r, fn: function(m) {
+          return [e._t(r, null, null, m)];
         } };
       })], null, !0) }, e.listboxOptionListeners));
     }), 1);
@@ -470,34 +469,34 @@ var _t = function() {
       } };
     })], null, !0) }, e.listboxOptionListeners));
   })], 2);
-}, pt = [], yt = /* @__PURE__ */ N(
+}, _t = [], pt = /* @__PURE__ */ N(
+  vt,
   gt,
   _t,
-  pt,
   !1,
   null,
   null
 );
-const ht = yt.exports;
-let ve = 0;
-const St = {
+const yt = pt.exports;
+let ge = 0;
+const ht = {
   beforeCreate() {
-    this.uuid = ve.toString(), ve += 1;
+    this.uuid = ge.toString(), ge += 1;
   }
 };
-var Ct = function() {
+var St = function() {
   var e = this, l = e._self._c;
   return l("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"] ? l("title", [e._v(e._s(e.$attrs["svg-title"]))]) : e._e(), l("path", { attrs: { fill: "#001222", d: "M9.69043 5.75L4.62988 10.8105L1.56934 7.75L2.62988 6.68945L4.62988 8.68945L8.62988 4.68945L9.69043 5.75Z" } }), l("path", { attrs: { fill: "#001222", d: "M13.9307 5.75L8.87012 10.8105L7.80957 9.75L12.8701 4.68945L13.9307 5.75Z" } })]);
-}, xt = [], Ot = /* @__PURE__ */ N(
+}, Ct = [], xt = /* @__PURE__ */ N(
+  ht,
   St,
   Ct,
-  xt,
   !1,
   null,
   null
 );
-const Et = Ot.exports, Tt = {}, It = /* @__PURE__ */ G({
-  ...Tt,
+const Ot = xt.exports, Et = {}, Tt = /* @__PURE__ */ G({
+  ...Et,
   __name: "decorative-checkbox",
   props: {
     disabled: { type: Boolean, default: !1 },
@@ -513,23 +512,23 @@ const Et = Ot.exports, Tt = {}, It = /* @__PURE__ */ G({
       [`b-checkbox-input__outline--${J.CHECKED}`]: (e.checked || e.allSelected) && !e.indeterminate,
       [`b-checkbox-input__outline--${J.INDETERMINATE}`]: e.indeterminate
     }));
-    return { __sfc: !0, props: e, conditionalClasses: l, outlineConditionalClasses: t, CheckmarkSmallIcon: We, MinusSmallIcon: Ve, DoubleCheckmarkSmallIcon: Et };
+    return { __sfc: !0, props: e, conditionalClasses: l, outlineConditionalClasses: t, CheckmarkSmallIcon: Ve, MinusSmallIcon: Ue, DoubleCheckmarkSmallIcon: Ot };
   }
 });
-var At = function() {
+var It = function() {
   var e = this, l = e._self._c, t = e._self._setupProxy;
   return l("div", { staticClass: "b-checkbox-input", class: t.conditionalClasses, attrs: { role: "presentation" } }, [e.indeterminate ? l(t.MinusSmallIcon, { staticClass: "b-checkbox-input__icon", attrs: { "svg-title": "", "aria-hidden": "true" } }) : e.allSelected ? l(t.DoubleCheckmarkSmallIcon, { staticClass: "b-checkbox-input__icon", attrs: { "svg-title": "", "aria-hidden": "true", "data-testid": "decorative-checkbox-double-checkmark-icon" } }) : e.checked ? l(t.CheckmarkSmallIcon, { staticClass: "b-checkbox-input__icon", attrs: { "svg-title": "", "aria-hidden": "true" } }) : e._e(), l("div", { staticClass: "b-checkbox-input__outline", class: t.outlineConditionalClasses })], 1);
-}, Lt = [], kt = /* @__PURE__ */ N(
+}, At = [], Lt = /* @__PURE__ */ N(
+  Tt,
   It,
   At,
-  Lt,
   !1,
   null,
   "b87bbaf9"
 );
-const oe = kt.exports;
-var Se = /* @__PURE__ */ ((s) => (s.DISABLED = "disabled", s.STATIC_CATEGORY = "static-category", s))(Se || {}), U = /* @__PURE__ */ ((s) => (s.SELECT_CATEGORY = "select-category", s.UNSELECT_CATEGORY = "unselect-category", s.TOGGLE_CATEGORY_VISIBILITY = "toggle-category-visibility", s))(U || {});
-const Rt = {
+const oe = Lt.exports;
+var Ce = /* @__PURE__ */ ((s) => (s.DISABLED = "disabled", s.STATIC_CATEGORY = "static-category", s))(Ce || {}), U = /* @__PURE__ */ ((s) => (s.SELECT_CATEGORY = "select-category", s.UNSELECT_CATEGORY = "unselect-category", s.TOGGLE_CATEGORY_VISIBILITY = "toggle-category-visibility", s))(U || {});
+const kt = {
   "de-DE": {
     categoryClosed: "{category} geschlossen",
     categoryOpened: "{category} geöffnet"
@@ -570,14 +569,14 @@ const Rt = {
     categoryClosed: "{category} 已关闭",
     categoryOpened: "{category} 已打开"
   }
-}, Dt = G({
-  i18n: { messages: Rt },
+}, Rt = G({
+  i18n: { messages: kt },
   name: "bento-listbox-multi-select-category",
   components: {
     BentoTypography: j,
     BentoListboxOption: Z,
-    ChevronDownIcon: je,
-    ChevronUpIcon: qe,
+    ChevronDownIcon: Ke,
+    ChevronUpIcon: je,
     DecorativeCheckbox: oe
   },
   props: {
@@ -629,10 +628,10 @@ const Rt = {
     U.TOGGLE_CATEGORY_VISIBILITY
   ],
   setup(s, { emit: e }) {
-    const l = x(!1), { t } = le(), o = be("category-group"), a = be("category-name"), r = (E) => s.isOptionDisabled ? s.isOptionDisabled(E) : !1, f = n(
+    const l = x(!1), { t } = le(), o = me("category-group"), a = me("category-name"), r = (E) => s.isOptionDisabled ? s.isOptionDisabled(E) : !1, m = n(
       () => s.category.items.every((E) => r(E))
     ), A = H(s, "staticCategories"), d = n(() => l.value || s.staticCategories), b = n(() => ({
-      [`b-listbox-multi-select-category--${Se.DISABLED}`]: f.value
+      [`b-listbox-multi-select-category--${Ce.DISABLED}`]: m.value
     })), T = (E, L) => {
       E.preventDefault(), l.value = L !== void 0 ? L : !l.value, e(U.TOGGLE_CATEGORY_VISIBILITY, s.category.value);
     }, _ = (E) => {
@@ -661,7 +660,7 @@ const Rt = {
       e(U.SELECT_CATEGORY);
     }, I = () => {
       e(U.UNSELECT_CATEGORY);
-    }, { isAllSelected: O, isIndeterminate: S, toggleSelectAll: v } = pe(
+    }, { isAllSelected: O, isIndeterminate: S, toggleSelectAll: v } = ye(
       C,
       p,
       B,
@@ -675,7 +674,7 @@ const Rt = {
       // Values
       chevronTitle: R,
       conditionalClass: b,
-      hasAllPropsDisabled: f,
+      hasAllPropsDisabled: m,
       isOpen: l,
       isAllSelected: O,
       isIndeterminate: S,
@@ -692,7 +691,7 @@ const Rt = {
     };
   }
 });
-var Bt = function() {
+var Dt = function() {
   var e = this, l = e._self._c;
   return e._self._setupProxy, l("div", [e.isStaticCategory ? l("div", { staticClass: "b-listbox-multi-select-category b-listbox-multi-select-category--static-category", attrs: { "aria-hidden": "true" } }, [l("span", { staticClass: "b-listbox-multi-select-category__label" }, [l("bento-typography", { staticClass: "b-listbox-multi-select-category__label-text", attrs: { el: "span", variant: "caption" } }, [e._v(" " + e._s(e.category.label) + " ")])], 1)]) : l("bento-listbox-option", { staticClass: "b-listbox-multi-select-category__option", class: e.conditionalClass, attrs: { tabindex: e.tabindex, "aria-selected": e.ariaCheckedComputed !== "false", "aria-checked": e.ariaCheckedComputed, "aria-disabled": e.hasAllPropsDisabled, "aria-expanded": `${e.isOpen}`, role: "treeitem", "aria-owns": e.categoryGroupId, "aria-labelledby": e.categoryNameId }, on: { click: e.handleSelectAll, "enter-pressed": e.handleSelectAll, "space-pressed": function(t) {
     return t.preventDefault(), e.handleSelectAll.apply(null, arguments);
@@ -703,22 +702,22 @@ var Bt = function() {
   }] } }, [l("decorative-checkbox", { attrs: { indeterminate: e.isIndeterminate, disabled: e.hasAllPropsDisabled, checked: e.isAllSelected } }), l("span", { staticClass: "b-listbox-multi-select-category__label" }, [l("bento-typography", { staticClass: "b-listbox-multi-select-category__label-text", attrs: { id: e.categoryNameId, el: "span" } }, [e._v(" " + e._s(e.category.label) + " ")]), l("div", { staticClass: "b-listbox-multi-select-category__label-chevron", attrs: { "aria-hidden": "true", "data-testid": "toggle-listbox" }, on: { "!click": function(t) {
     return t.stopPropagation(), e.toggleOpen.apply(null, arguments);
   } } }, [e.isOpen ? l("chevron-up-icon", { attrs: { "svg-title": e.chevronTitle } }) : l("chevron-down-icon", { attrs: { "svg-title": e.chevronTitle } })], 1)], 1)], 1), l("div", { directives: [{ name: "show", rawName: "v-show", value: e.showItemChildren, expression: "showItemChildren" }], attrs: { id: e.categoryGroupId, role: "group", "aria-label": e.category.label } }, [e._t("default")], 2)], 1);
-}, Mt = [], $t = /* @__PURE__ */ N(
+}, Bt = [], Mt = /* @__PURE__ */ N(
+  Rt,
   Dt,
   Bt,
-  Mt,
   !1,
   null,
   "00ccd708"
 );
-const Nt = $t.exports;
+const $t = Mt.exports;
 var w = /* @__PURE__ */ ((s) => (s.SELECT_CATEGORY = "select-category", s.TOGGLE_CHECKBOX_SELECTION = "toggle-checkbox-selection", s.UNSELECT_CATEGORY = "unselect-category", s.TOGGLE_CATEGORY_VISIBILITY = "toggle-category-visibility", s))(w || {});
-const wt = G({
+const Nt = G({
   name: "listbox-multi-select-options",
   components: {
     BentoListboxOption: Z,
     BentoTypography: j,
-    ListboxMultiSelectCategory: Nt,
+    ListboxMultiSelectCategory: $t,
     DecorativeCheckbox: oe
   },
   inheritAttrs: !1,
@@ -825,7 +824,7 @@ const wt = G({
     };
   }
 });
-var Gt = function() {
+var wt = function() {
   var e = this, l = e._self._c;
   return e._self._setupProxy, l("div", e._l(e.items, function(t) {
     return l("div", { key: `selected-${t.value}` }, [e.searching && e.isMultiLevel ? [l("bento-listbox-option", { staticClass: "b-listbox-multi-select-options", class: e.conditionalClasses, attrs: { disabled: e.isOptionDisabled ? e.isOptionDisabled(t) : null, tabindex: e.computedTabindex(t.value), "aria-selected": `${e.isOptionSelected(t)}`, "aria-checked": `${e.isOptionSelected(t)}`, "aria-disabled": e.isOptionDisabled ? e.isOptionDisabled(t) : null, role: e.$attrs.role || "option" }, on: { click: function(o) {
@@ -852,15 +851,15 @@ var Gt = function() {
       return [l("span", { staticClass: "b-listbox-multi-select__option-text" }, [l("bento-typography", { attrs: { el: "span" } }, [e._v(e._s(t.label))]), e.shouldShowDescription(t) ? l("bento-typography", { staticClass: "b-listbox-multi-select__option-description", attrs: { el: "span" } }, [e._v(" " + e._s(t.description) + " ")]) : e._e()], 1)];
     }, null, t)], 2)]], 2);
   }), 0);
-}, Pt = [], Ft = /* @__PURE__ */ N(
+}, Gt = [], Pt = /* @__PURE__ */ N(
+  Nt,
   wt,
   Gt,
-  Pt,
   !1,
   null,
   "0985e0a4"
 );
-const Yt = Ft.exports, zt = (s) => {
+const Ft = Pt.exports, Yt = (s) => {
   const e = n(() => {
     var t;
     return !!((t = s.value) != null && t.find(({ items: o }) => !!o));
@@ -872,7 +871,7 @@ const Yt = Ft.exports, zt = (s) => {
     isMultiLevelSelect: e,
     flattenedItemsList: l
   };
-}, Ut = {
+}, zt = {
   "de-DE": {
     allSelected: "Alle ausgewählt ({total})",
     numberOfTotalSelected: "{number} von {total} ausgewählt",
@@ -933,8 +932,8 @@ const Yt = Ft.exports, zt = (s) => {
     numbersSelected: "已选择 {number} 个",
     selectAll: "选择全部（{total}）个"
   }
-}, Vt = { i18n: { messages: Ut } }, Wt = /* @__PURE__ */ G({
-  ...Vt,
+}, Ut = { i18n: { messages: zt } }, Vt = /* @__PURE__ */ G({
+  ...Ut,
   __name: "listbox-multi-select",
   props: {
     hasMoreItems: { type: Boolean, default: !1 },
@@ -947,143 +946,143 @@ const Yt = Ft.exports, zt = (s) => {
   },
   emits: ["select"],
   setup(s, { expose: e, emit: l }) {
-    const t = s, { t: o, n: a } = le(), r = Ge(), f = Pe(), A = n(
+    const t = s, { t: o, n: a } = le(), r = Ge(), m = Pe(), A = n(
       () => {
-        var i, u, m, h;
+        var i, u, f, h;
         return {
-          "aria-label": (i = f["aria-label"]) == null ? void 0 : i.toString(),
-          "aria-busy": (u = f["aria-busy"]) == null ? void 0 : u.toString(),
-          "aria-atomic": (m = f["aria-atomic"]) == null ? void 0 : m.toString(),
-          "aria-live": (h = f["aria-live"]) == null ? void 0 : h.toString(),
+          "aria-label": (i = m["aria-label"]) == null ? void 0 : i.toString(),
+          "aria-busy": (u = m["aria-busy"]) == null ? void 0 : u.toString(),
+          "aria-atomic": (f = m["aria-atomic"]) == null ? void 0 : f.toString(),
+          "aria-live": (h = m["aria-live"]) == null ? void 0 : h.toString(),
           "aria-multiselectable": !0
         };
       }
-    ), d = x(null), b = x(null), T = x(null), _ = x(null), p = n(() => t.selectedValues.map(({ value: i }) => i)), { isMultiLevelSelect: C, flattenedItemsList: R } = zt(H(t, "items")), B = n(() => C.value && !t.staticCategories), I = n(() => B.value ? "tree" : "listbox"), O = n(() => B.value ? "treeitem" : "option"), S = (i) => {
+    ), d = x(null), b = x(null), T = x(null), _ = x(null), p = n(() => t.selectedValues.map(({ value: i }) => i)), { isMultiLevelSelect: C, flattenedItemsList: R } = Yt(H(t, "items")), B = n(() => C.value && !t.staticCategories), I = n(() => B.value ? "tree" : "listbox"), O = n(() => B.value ? "treeitem" : "option"), S = (i) => {
       var h;
-      const u = t.isOptionDisabled(i), m = ((h = p.value) == null ? void 0 : h.includes(i.value)) || !1;
-      return { isDisabled: u, isPreSelected: m };
+      const u = t.isOptionDisabled(i), f = ((h = p.value) == null ? void 0 : h.includes(i.value)) || !1;
+      return { isDisabled: u, isPreSelected: f };
     }, v = n(() => {
       if (t.searching && C)
         return t.items;
       const i = R.value.filter((u) => {
-        const { isDisabled: m, isPreSelected: h } = S(u);
-        return m && h || !m;
+        const { isDisabled: f, isPreSelected: h } = S(u);
+        return f && h || !f;
       });
       return t.selectedValues.forEach((u) => {
-        i.find((m) => m.value === u.value) || i.push(u);
+        i.find((f) => f.value === u.value) || i.push(u);
       }), i;
     }), y = n(
       () => {
         var i;
         return (i = v.value) == null ? void 0 : i.filter((u) => {
-          var m;
+          var f;
           return u.items && C.value && t.searching ? u.items.filter(
             (g) => (t.selectedValues ?? []).includes(g.value)
-          ).length === u.items.length : (m = p.value) == null ? void 0 : m.includes(u.value);
+          ).length === u.items.length : (f = p.value) == null ? void 0 : f.includes(u.value);
         });
       }
     ), D = () => C.value && !t.searching ? R.value.length : t.items.length, P = n(() => {
       var h;
-      const i = v.value.length, u = D(), m = ((h = y.value) == null ? void 0 : h.length) || 0;
-      return m === 0 ? o("selectAll", { total: a(i) }) : m === u ? o("allSelected", { total: a(u) }) : m <= u ? o("numberOfTotalSelected", { number: a(m), total: a(u) }) : o("numbersSelected", { number: a(m) });
+      const i = v.value.length, u = D(), f = ((h = y.value) == null ? void 0 : h.length) || 0;
+      return f === 0 ? o("selectAll", { total: a(i) }) : f === u ? o("allSelected", { total: a(u) }) : f <= u ? o("numberOfTotalSelected", { number: a(f), total: a(u) }) : o("numbersSelected", { number: a(f) });
     }), E = (i) => {
       const u = (h) => {
         const { isDisabled: g, isPreSelected: F } = S(h);
         return g && F || !g;
-      }, m = i.filter(u).filter((h) => !p.value.includes(h.value));
-      l("select", [...t.selectedValues, ...m]);
+      }, f = i.filter(u).filter((h) => !p.value.includes(h.value));
+      l("select", [...t.selectedValues, ...f]);
     }, L = (i) => {
       const u = (g) => {
         const { isDisabled: F, isPreSelected: $e } = S(g);
         return !(F && $e);
-      }, m = i.filter(u).map(({ value: g }) => g), h = t.selectedValues.filter((g) => !(m != null && m.includes(g.value)));
+      }, f = i.filter(u).map(({ value: g }) => g), h = t.selectedValues.filter((g) => !(f != null && f.includes(g.value)));
       l("select", h);
     }, $ = () => {
       E(R.value);
     }, Y = () => {
       L(R.value);
-    }, { isAllSelected: z, isIndeterminate: k, toggleSelectAll: V } = pe(
+    }, { isAllSelected: z, isIndeterminate: k, toggleSelectAll: V } = ye(
       y,
       v,
       $,
       Y
-    ), Ce = n(() => k.value ? "mixed" : `${z.value}`), q = x(z.value), xe = () => {
+    ), xe = n(() => k.value ? "mixed" : `${z.value}`), q = x(z.value), Oe = () => {
       q.value = !q.value, V(q.value);
     };
     X(z, () => {
       q.value = z.value;
     });
-    const Oe = (i) => {
+    const Ee = (i) => {
       E(i.items);
-    }, Ee = (i) => {
+    }, Te = (i) => {
       L(i.items);
-    }, Te = (i, u) => {
-      let m = !1;
-      const h = t.selectedValues.filter(({ value: g }) => u.value === g ? (m = !0, !1) : !0);
-      m || h.push(u), l(i, h);
-    }, Ie = n(() => {
+    }, Ie = (i, u) => {
+      let f = !1;
+      const h = t.selectedValues.filter(({ value: g }) => u.value === g ? (f = !0, !1) : !0);
+      f || h.push(u), l(i, h);
+    }, Ae = n(() => {
       if (!C.value)
         return t.selectedValues;
       const i = (g) => p.value.includes(g.value), u = (g) => !t.staticCategories && g.every((F) => i(F));
       return t.items.flatMap(
         (g) => g.items && !u(g.items) ? g.items : g
       ).filter((g) => g.items ? !0 : i(g));
-    }), Ae = n(() => {
-      var m, h, g, F;
-      const i = ["automatic", "button"].includes(t.lazyLoadType), u = ((m = t.selectedValues) == null ? void 0 : m.length) > 0 && ((h = y.value) == null ? void 0 : h.length) !== ((g = R.value) == null ? void 0 : g.length);
+    }), Le = n(() => {
+      var f, h, g, F;
+      const i = ["automatic", "button"].includes(t.lazyLoadType), u = ((f = t.selectedValues) == null ? void 0 : f.length) > 0 && ((h = y.value) == null ? void 0 : h.length) !== ((g = R.value) == null ? void 0 : g.length);
       return i && t.hasMoreItems ? !!((F = t.selectedValues) != null && F.length) : u;
-    }), Le = n(() => ["automatic", "button"].includes(t.lazyLoadType) ? !t.hasMoreItems : !0), W = x([]), { visibleDomOptions: Q, updateVisibleDomOptions: ae } = he(
+    }), ae = n(() => ["automatic", "button"].includes(t.lazyLoadType) ? !t.hasMoreItems : !0), W = x([]), { visibleDomOptions: Q, updateVisibleDomOptions: ne } = Se(
       d,
       H(t, "items"),
       O
     ), ke = (i) => {
-      W.value.includes(i) ? W.value = W.value.filter((u) => u !== i) : W.value.push(i), _e(() => {
-        ae();
+      W.value.includes(i) ? W.value = W.value.filter((u) => u !== i) : W.value.push(i), pe(() => {
+        ne();
       });
-    }, ne = (i) => {
+    }, ie = (i) => {
       var u;
       (u = Q.value[i]) == null || u.focus();
     }, {
-      moveToNextElement: ie,
-      moveToPreviousElement: ce,
-      moveToFirstElement: re,
-      moveToLastElement: ue,
+      moveToNextElement: ce,
+      moveToPreviousElement: re,
+      moveToFirstElement: ue,
+      moveToLastElement: de,
       preventDefault: ee,
       focusedIndex: Re,
-      setListboxFocusedIndex: de
-    } = ye(
+      setListboxFocusedIndex: be
+    } = he(
       {
         items: Q
       },
-      ne
+      ie
     ), De = {
-      [M.ARROW_UP]: (i) => ce(i),
-      [M.ARROW_DOWN]: (i) => ie(i),
-      [M.HOME]: re,
-      [M.END]: ue
+      [M.ARROW_UP]: (i) => re(i),
+      [M.ARROW_DOWN]: (i) => ce(i),
+      [M.HOME]: ue,
+      [M.END]: de
     };
     e({
       /**
        * Method to set the index of the item to be focused on
        * Used for focus management to be kept in-sync with parent e.g. dropdowns
        */
-      setListboxFocusedIndex: de
+      setListboxFocusedIndex: be
     });
     const Be = {
       [M.ARROW_UP]: ee,
       [M.ARROW_DOWN]: ee
     }, Me = n(() => {
-      let i = 1;
+      let i = ae.value ? 1 : 0;
       const u = {};
-      return t.items.forEach((m) => {
-        let h = W.value.includes(m.value);
-        m.items ? (t.staticCategories ? h = !0 : u[m.value] = i++, h && m.items.forEach((g) => u[g.value] = i++)) : u[m.value] = i++;
+      return t.items.forEach((f) => {
+        let h = W.value.includes(f.value);
+        f.items ? (t.staticCategories ? h = !0 : u[f.value] = i++, h && f.items.forEach((g) => u[g.value] = i++)) : u[f.value] = i++;
       }), u;
     });
-    return { __sfc: !0, props: t, emit: l, t: o, n: a, slots: r, attrs: f, ariaAttributes: A, listboxRef: d, selectAllListboxItemsRef: b, selectedListboxItemsRef: T, listboxItemsRef: _, selectedItemsList: p, isMultiLevelSelect: C, flattenedItemsList: R, isTreePattern: B, computedRole: I, computedOptionRole: O, optionStates: S, enabledItems: v, visibleSelectedList: y, calculateTotalItems: D, selectAllCheckboxText: P, selectAll: E, unselectAll: L, selectAllItems: $, unselectAllItems: Y, isAllSelected: z, isIndeterminate: k, toggleSelectAll: V, ariaCheckedComputed: Ce, isSelectAllOn: q, handleSelectAll: xe, selectAllCategory: Oe, unselectAllCategory: Ee, toggleCheckboxSelection: Te, selectedOptions: Ie, showSelectedItems: Ae, showSelectAllCheckbox: Le, expandedCategories: W, visibleDomOptions: Q, updateVisibleDomOptions: ae, toggleCategoryVisibility: ke, focusItem: ne, moveToNextElement: ie, moveToPreviousElement: ce, moveToFirstElement: re, moveToLastElement: ue, preventDefault: ee, focusedIndex: Re, setListboxFocusedIndex: de, listboxListeners: De, chipsSectionListeners: Be, computedItemsIndex: Me, DecorativeCheckbox: oe, BentoTypography: j, BentoChip: Ke, BentoListboxOption: Z, ListboxMultiSelectOptions: Yt, vBentoKeyboardNavigationDirective: se, BentoListboxEvent: c };
+    return { __sfc: !0, props: t, emit: l, t: o, n: a, slots: r, attrs: m, ariaAttributes: A, listboxRef: d, selectAllListboxItemsRef: b, selectedListboxItemsRef: T, listboxItemsRef: _, selectedItemsList: p, isMultiLevelSelect: C, flattenedItemsList: R, isTreePattern: B, computedRole: I, computedOptionRole: O, optionStates: S, enabledItems: v, visibleSelectedList: y, calculateTotalItems: D, selectAllCheckboxText: P, selectAll: E, unselectAll: L, selectAllItems: $, unselectAllItems: Y, isAllSelected: z, isIndeterminate: k, toggleSelectAll: V, ariaCheckedComputed: xe, isSelectAllOn: q, handleSelectAll: Oe, selectAllCategory: Ee, unselectAllCategory: Te, toggleCheckboxSelection: Ie, selectedOptions: Ae, showSelectedItems: Le, showSelectAllCheckbox: ae, expandedCategories: W, visibleDomOptions: Q, updateVisibleDomOptions: ne, toggleCategoryVisibility: ke, focusItem: ie, moveToNextElement: ce, moveToPreviousElement: re, moveToFirstElement: ue, moveToLastElement: de, preventDefault: ee, focusedIndex: Re, setListboxFocusedIndex: be, listboxListeners: De, chipsSectionListeners: Be, computedItemsIndex: Me, DecorativeCheckbox: oe, BentoTypography: j, BentoChip: We, BentoListboxOption: Z, ListboxMultiSelectOptions: Ft, vBentoKeyboardNavigationDirective: se, BentoListboxEvent: c };
   }
 });
-var Kt = function() {
+var Wt = function() {
   var e = this, l = e._self._c, t = e._self._setupProxy;
   return l("div", { ref: "listboxRef", staticClass: "b-listbox-multi-select" }, [t.showSelectedItems ? l("div", [l("ul", e._g({ directives: [{ name: "bento-keyboard-navigation-directive", rawName: "v-bento-keyboard-navigation-directive" }], staticClass: "b-listbox-multi-select__chips" }, t.chipsSectionListeners), e._l(t.selectedOptions, function(o) {
     return l("li", { key: o.value }, [l(t.BentoChip, { ref: "selectedListboxItemsRef", refInFor: !0, attrs: { disabled: e.isOptionDisabled(o), label: o.label, condensed: "" }, on: { click: function(a) {
@@ -1104,15 +1103,20 @@ var Kt = function() {
       return [e._t(a, null, null, r)];
     } };
   })], null, !0) })], 1)]);
-}, jt = [], qt = /* @__PURE__ */ N(
+}, Kt = [], jt = /* @__PURE__ */ N(
+  Vt,
   Wt,
   Kt,
-  jt,
   !1,
   null,
-  "efcc8ad5"
+  "b81d7402"
 );
-const ge = qt.exports, Ht = {
+const _e = jt.exports, qt = (s, e = 300) => {
+  let l;
+  return (...o) => {
+    l && clearTimeout(l), l = setTimeout(() => s(...o), e);
+  };
+}, Ht = {
   "de-DE": {
     loading: "Laden",
     showMore: "Mehr anzeigen"
@@ -1157,11 +1161,11 @@ const ge = qt.exports, Ht = {
   name: "bento-listbox",
   components: {
     BentoEmptyState: Ye,
-    BentoListboxSingleSelect: ht,
-    BentoListboxMultiSelect: ge,
+    BentoListboxSingleSelect: yt,
+    BentoListboxMultiSelect: _e,
     BentoTypography: j,
     BentoLoadingIndicator: Fe,
-    BentoLoadingButton: He
+    BentoLoadingButton: qe
   },
   directives: { BentoKeyboardNavigationDirective: se },
   i18n: { messages: Ht },
@@ -1245,7 +1249,7 @@ const ge = qt.exports, Ht = {
      *
      * If enabled, hides the "Select all" checkbox in "multiple" mode.
      */
-    searching: ge.props.searching,
+    searching: _e.props.searching,
     /**
      * The `input` value.
      * Providing an empty string or empty array will select no options.
@@ -1273,7 +1277,7 @@ const ge = qt.exports, Ht = {
     c.TAB
   ],
   setup(s, { emit: e, slots: l }) {
-    const t = x([]), o = H(s, "items"), { t: a } = le(), r = n(() => s.lazyLoadType !== K.AUTOMATIC), f = n(() => s.lazyLoadType === K.AUTOMATIC), A = () => {
+    const t = x([]), o = H(s, "items"), { t: a } = le(), r = n(() => s.lazyLoadType !== K.AUTOMATIC), m = n(() => s.lazyLoadType === K.AUTOMATIC), A = () => {
       var k;
       return typeof (s == null ? void 0 : s.virtualScroll) == "object" && ((k = s == null ? void 0 : s.virtualScroll) != null && k.itemHeight) ? s.virtualScroll.itemHeight : Xt;
     }, {
@@ -1282,7 +1286,7 @@ const ge = qt.exports, Ht = {
       onScroll: T,
       list: _,
       wrapperProps: p
-    } = Xe(o, {
+    } = He(o, {
       itemHeight: A(),
       // Disable virtual scrolling if not enabled or if lazy loading is enabled or if multi-select
       disabled: (s == null ? void 0 : s.multiple) || (s == null ? void 0 : s.virtualScroll) === !1 || (s == null ? void 0 : s.lazyLoadType) !== "none"
@@ -1308,14 +1312,14 @@ const ge = qt.exports, Ht = {
       e(k, V);
     }, v = () => {
       e(c.SHOW_MORE);
-    }, y = ze(() => {
+    }, y = qt(() => {
       const k = d.value;
       if (!k)
         return;
       const V = Math.round(k.scrollTop) + k.clientHeight >= k.scrollHeight;
       s.hasMoreItems && V && !s.loading && v();
     }), D = () => {
-      f.value ? y() : T();
+      m.value ? y() : T();
     }, P = n(() => {
       var k;
       return ((k = s.items) == null ? void 0 : k.length) === 0;
@@ -1382,7 +1386,7 @@ var Zt = function() {
   null,
   "35cb3605"
 );
-const hs = es.exports, te = (s, e) => {
+const ys = es.exports, te = (s, e) => {
   for (const l of s) {
     if (l.value === e)
       return l;
@@ -1393,13 +1397,13 @@ const hs = es.exports, te = (s, e) => {
     }
   }
   return null;
-}, ts = (s) => typeof s == "object" && s !== null && "value" in s && "label" in s, Ss = (s, e, l, t) => {
+}, ts = (s) => typeof s == "object" && s !== null && "value" in s && "label" in s, hs = (s, e, l, t) => {
   const o = x([]), a = x(), r = (b) => {
     l.value ? a.value = b.map(({ value: T }) => T) : a.value = b.length > 0 ? b[0].value : null;
-  }, f = (b) => {
+  }, m = (b) => {
     l.value ? a.value = b.map(({ value: T, label: _ }) => ({ value: T, label: _ })) : a.value = b.length > 0 ? { value: b[0].value, label: b[0].label } : null;
   }, A = (b) => {
-    o.value = b, t != null && t.value ? f(b) : r(b);
+    o.value = b, t != null && t.value ? m(b) : r(b);
   }, d = () => {
     o.value = [], a.value = null;
   };
@@ -1422,10 +1426,10 @@ const hs = es.exports, te = (s, e) => {
       };
       if (b) {
         const p = e.value;
-        _(p), t != null && t.value ? f(o.value) : r(o.value);
+        _(p), t != null && t.value ? m(o.value) : r(o.value);
         return;
       }
-      e.value.forEach(_), t != null && t.value ? f(o.value) : r(o.value);
+      e.value.forEach(_), t != null && t.value ? m(o.value) : r(o.value);
     },
     { immediate: !0 }
   ), {
@@ -1439,12 +1443,13 @@ const hs = es.exports, te = (s, e) => {
 };
 export {
   c as B,
-  ut as C,
+  rt as C,
   oe as D,
   K as a,
-  hs as b,
-  zt as c,
-  he as d,
-  Ss as u
+  ys as b,
+  Yt as c,
+  qt as d,
+  Se as e,
+  hs as u
 };
-//# sourceMappingURL=use-cached-selected-values.Bn3Y8Iuq.js.map
+//# sourceMappingURL=use-cached-selected-values.BJbWbkEQ.js.map