@adyen/bento-vue3 1.62.0 → 1.63.0

package/dist/chunks/{use-cached-selected-values.CUi4XfMa.js → use-cached-selected-values.swt0cdsA.js}

@@ -1,90 +1,92 @@
-import { computed as g, ref as k, onMounted as je, onUnmounted as He, watch as fe, defineComponent as Q, resolveComponent as I, createElementBlock as T, openBlock as b, createVNode as P, createElementVNode as H, withCtx as L, createTextVNode as F, toDisplayString as z, renderSlot as Y, mergeProps as U, withKeys as pe, createCommentVNode as j, createBlock as B, withModifiers as ie, normalizeProps as ne, guardReactiveProps as be, withDirectives as ae, vShow as ke, toRef as ee, resolveDirective as Re, toHandlers as te, Fragment as se, renderList as q, createSlots as me, normalizeClass as ye, useSlots as Ve, unref as M, normalizeStyle as Xe } from "vue";
-import { B as G, a as ve } from "./keyboard-navigation.CqgGzfZQ.js";
+import { computed as m, ref as B, onMounted as Ve, onUnmounted as Xe, watch as ge, defineComponent as Z, resolveComponent as L, createElementBlock as _, openBlock as d, createVNode as P, createElementVNode as W, withCtx as T, createTextVNode as Y, toDisplayString as F, renderSlot as q, mergeProps as U, withKeys as Se, createCommentVNode as K, createBlock as $, withModifiers as ie, normalizeProps as ne, guardReactiveProps as be, withDirectives as ae, vShow as Be, toRef as te, resolveDirective as Re, toHandlers as se, Fragment as le, renderList as V, createSlots as me, normalizeClass as ve, unref as R, useSlots as Je, normalizeStyle as Ze } from "vue";
+import { B as z, a as pe } from "./keyboard-navigation.CqgGzfZQ.js";
 import "./events.FNmSWp_P.js";
 import { B as re } from "./typography.DN5eC5ch.js";
-import { B as Je } from "./loading-indicator.DEepb9Wl.js";
-import { B as Ze } from "./empty-state.D7llINgF.js";
-import { u as he } from "./i18n.B6g5VX0q.js";
-import { d as Qe } from "./debounce.DUTu11PS.js";
-import { B as Ee } from "./checkbox.C4dJVYbB.js";
-import { B as et } from "./chip.CneNX2_j.js";
+import { B as Qe } from "./loading-indicator.DEepb9Wl.js";
+import { B as et } from "./empty-state.D7llINgF.js";
+import { u as Ee } from "./i18n.B6g5VX0q.js";
+import { d as tt } from "./debounce.DUTu11PS.js";
+import { B as st } from "./chip.CneNX2_j.js";
 import { _ as X } from "./_plugin-vue_export-helper.CHgC5LLL.js";
-import { C as tt, a as st } from "./chevron-up.MAa3Ksgd.js";
-import { d as lt, e as Le } from "./button-actions.D1pXI1AJ.js";
+import { C as fe, N as lt } from "./minus-small.DYIyF5XW.js";
+import { C as ot } from "./checkmark-small.x-gmK2Dt.js";
+import { C as nt } from "./chevron-down.DCQ6ZLaq.js";
+import { C as it } from "./chevron-up.kfuLRpZb.js";
+import { d as at, e as Le } from "./button-actions.D1pXI1AJ.js";
 /* empty css              */
-import { o as ot } from "./resize.Bqks3WUm.js";
+import { o as rt } from "./resize.Bqks3WUm.js";
 import "../assets/use-cached-selected-values.css";
-const Be = (e, s, t, c) => {
-  const i = g(
+const Ne = (e, s, t, c) => {
+  const i = m(
     () => {
-      var m, C;
-      return !!((m = e.value) != null && m.length) && ((C = e.value) == null ? void 0 : C.length) === s.value.length;
+      var v, h;
+      return !!((v = e.value) != null && v.length) && ((h = e.value) == null ? void 0 : h.length) === s.value.length;
     }
-  ), l = g(() => {
-    var m;
-    return e.value == null || e.value.length === 0 ? !1 : ((m = e.value) == null ? void 0 : m.length) !== s.value.length;
+  ), l = m(() => {
+    var v;
+    return e.value == null || e.value.length === 0 ? !1 : ((v = e.value) == null ? void 0 : v.length) !== s.value.length;
   });
   return {
     isAllSelected: i,
     isIndeterminate: l,
-    toggleSelectAll: (m) => {
-      m ? t() : c();
+    toggleSelectAll: (v) => {
+      v ? t() : c();
     }
   };
 };
-function nt(e, { disabled: s, itemHeight: t, overscan: c = 5, prefixHeight: i }) {
-  const l = k(null), r = k([]), m = k(0), C = k(0), n = k(0);
+function ct(e, { disabled: s, itemHeight: t, overscan: c = 5, prefixHeight: i }) {
+  const l = B(null), r = B([]), v = B(0), h = B(0), n = B(0);
   let a;
-  const o = g(() => {
-    const S = typeof t == "number" ? e.value.length * t : e.value.reduce((D, R, N) => D + t(N), 0), $ = typeof t == "number" ? m.value * t : e.value.slice(0, m.value).reduce((D, R, N) => D + t(N), 0);
+  const o = m(() => {
+    const S = typeof t == "number" ? e.value.length * t : e.value.reduce((N, x, D) => N + t(D), 0), A = typeof t == "number" ? v.value * t : e.value.slice(0, v.value).reduce((N, x, D) => N + t(D), 0);
     return {
       style: {
-        marginTop: `${$}px`,
-        height: `${S - $}px`
+        marginTop: `${A}px`,
+        height: `${S - A}px`
       }
     };
-  }), h = () => {
-    const S = (i == null ? void 0 : i.value) ?? 0, $ = Math.max(l.value.scrollTop - S, 0);
+  }), C = () => {
+    const S = (i == null ? void 0 : i.value) ?? 0, A = Math.max(l.value.scrollTop - S, 0);
     if (typeof t == "number")
-      return Math.floor($ / t);
-    let D = 0, R = 0;
-    for (let N = 0; N < e.value.length; N += 1) {
-      const _ = t(N);
-      if (D += _, D >= $) {
-        R = N;
+      return Math.floor(A / t);
+    let N = 0, x = 0;
+    for (let D = 0; D < e.value.length; D += 1) {
+      const G = t(D);
+      if (N += G, N >= A) {
+        x = D;
         break;
       }
     }
-    return R;
-  }, p = () => {
+    return x;
+  }, g = () => {
     if (n.value = l.value.clientHeight, typeof t == "number")
       return Math.ceil(n.value / t);
-    const S = m.value ?? 0;
-    let $ = 0, D = 0;
-    for (let R = S; R < e.value.length; R += 1) {
-      const N = t(R);
-      if ($ += N, D = R, $ > n.value)
+    const S = v.value ?? 0;
+    let A = 0, N = 0;
+    for (let x = S; x < e.value.length; x += 1) {
+      const D = t(x);
+      if (A += D, N = x, A > n.value)
         break;
     }
-    return D - S;
-  }, f = () => {
+    return N - S;
+  }, p = () => {
     if (l.value) {
-      const S = p();
-      m.value = h(), C.value = Math.min(m.value + S + c, e.value.length), r.value = e.value.slice(m.value, C.value);
+      const S = g();
+      v.value = C(), h.value = Math.min(v.value + S + c, e.value.length), r.value = e.value.slice(v.value, h.value);
     }
-  }, A = () => {
-    f();
+  }, k = () => {
+    p();
   };
-  s || (je(() => {
-    l.value && (n.value = l.value.clientHeight, a = ot(l.value, ({ clientHeight: S }) => {
-      n.value = S, f();
-    }), f());
-  }), He(() => {
+  s || (Ve(() => {
+    l.value && (n.value = l.value.clientHeight, a = rt(l.value, ({ clientHeight: S }) => {
+      n.value = S, p();
+    }), p());
+  }), Xe(() => {
     a == null || a.disconnect();
-  }), fe(
+  }), ge(
     () => e.value,
     () => {
-      f();
+      p();
     }
   ));
   const w = {
@@ -101,13 +103,13 @@ function nt(e, { disabled: s, itemHeight: t, overscan: c = 5, prefixHeight: i })
   } : {
     containerRef: l,
     containerProps: w,
-    onScroll: A,
+    onScroll: k,
     list: r,
     wrapperProps: o
   };
 }
-var u = /* @__PURE__ */ ((e) => (e.SELECT = "select", e.SHOW_MORE = "show-more", e.ESCAPE = "escape-pressed", e.CLICK = "click", e.ENTER = "enter-pressed", e.SPACE = "space-pressed", e.TAB = "tab-pressed", e.CLOSE_DROPDOWN = "close-dropdown", e))(u || {}), oe = /* @__PURE__ */ ((e) => (e.AUTOMATIC = "automatic", e.BUTTON = "button", e.NONE = "none", e))(oe || {});
-const it = Q({
+var b = /* @__PURE__ */ ((e) => (e.SELECT = "select", e.SHOW_MORE = "show-more", e.ESCAPE = "escape-pressed", e.CLICK = "click", e.ENTER = "enter-pressed", e.SPACE = "space-pressed", e.TAB = "tab-pressed", e.CLOSE_DROPDOWN = "close-dropdown", e))(b || {}), oe = /* @__PURE__ */ ((e) => (e.AUTOMATIC = "automatic", e.BUTTON = "button", e.NONE = "none", e))(oe || {});
+const dt = Z({
   name: "bento-listbox-static-category",
   components: {
     BentoTypography: re
@@ -121,26 +123,26 @@ const it = Q({
       required: !0
     }
   }
-}), at = { class: "b-listbox-single-select-category" };
-function rt(e, s, t, c, i, l) {
-  const r = I("bento-typography");
-  return b(), T("div", at, [
+}), ut = { class: "b-listbox-single-select-category" };
+function bt(e, s, t, c, i, l) {
+  const r = L("bento-typography");
+  return d(), _("div", ut, [
     P(r, {
       variant: "caption",
       el: "span",
       class: "b-listbox-single-select-category__label-text"
     }, {
-      default: L(() => [
-        F(z(e.categoryLabel), 1)
+      default: T(() => [
+        Y(F(e.categoryLabel), 1)
       ]),
       _: 1
     }),
-    H("div", null, [
-      Y(e.$slots, "default", {}, void 0, !0)
+    W("div", null, [
+      q(e.$slots, "default", {}, void 0, !0)
     ])
   ]);
 }
-const ct = /* @__PURE__ */ X(it, [["render", rt], ["__scopeId", "data-v-a90eff17"]]), dt = Q({
+const mt = /* @__PURE__ */ X(dt, [["render", bt], ["__scopeId", "data-v-a90eff17"]]), vt = Z({
   name: "bento-listbox-option",
   props: {
     /**
@@ -152,21 +154,21 @@ const ct = /* @__PURE__ */ X(it, [["render", rt], ["__scopeId", "data-v-a90eff17
      */
     selected: { type: Boolean, default: !1 }
   },
-  emits: [u.CLICK, u.ENTER, u.SPACE, u.TAB],
+  emits: [b.CLICK, b.ENTER, b.SPACE, b.TAB],
   setup(e, { emit: s }) {
-    const t = g(() => ({
+    const t = m(() => ({
       "b-listbox-option--disabled": e.disabled,
       "b-listbox-option--selected": e.selected
     }));
     return {
       // Enums
-      BentoKeyboardNavigationKeyDownEvent: G,
-      BentoListboxEvent: u,
+      BentoKeyboardNavigationKeyDownEvent: z,
+      BentoListboxEvent: b,
       // Values
       conditionalClasses: t,
       // Events
       onClick: (l) => {
-        s(u.CLICK, l);
+        s(b.CLICK, l);
       },
       onOptionSelected: (l, r) => {
         s(l, r);
@@ -174,49 +176,49 @@ const ct = /* @__PURE__ */ X(it, [["render", rt], ["__scopeId", "data-v-a90eff17
     };
   }
 });
-function ut(e, s, t, c, i, l) {
-  return b(), T("div", U({
+function ft(e, s, t, c, i, l) {
+  return d(), _("div", U({
     class: ["b-listbox-option", e.conditionalClasses],
     role: "option"
   }, e.$attrs, {
     onClick: s[0] || (s[0] = (...r) => e.onClick && e.onClick(...r)),
     onKeydown: [
-      s[1] || (s[1] = pe((r) => e.onOptionSelected(e.BentoListboxEvent.ENTER, r), ["enter"])),
-      s[2] || (s[2] = pe((r) => e.onOptionSelected(e.BentoListboxEvent.SPACE, r), ["space"])),
-      s[3] || (s[3] = pe((r) => e.onOptionSelected(e.BentoListboxEvent.TAB, r), ["tab"]))
+      s[1] || (s[1] = Se((r) => e.onOptionSelected(e.BentoListboxEvent.ENTER, r), ["enter"])),
+      s[2] || (s[2] = Se((r) => e.onOptionSelected(e.BentoListboxEvent.SPACE, r), ["space"])),
+      s[3] || (s[3] = Se((r) => e.onOptionSelected(e.BentoListboxEvent.TAB, r), ["tab"]))
     ]
   }), [
-    Y(e.$slots, "default", {}, void 0, !0)
+    q(e.$slots, "default", {}, void 0, !0)
   ], 16);
 }
-const ge = /* @__PURE__ */ X(dt, [["render", ut], ["__scopeId", "data-v-b7af43a6"]]);
-let Ae = 0;
-const bt = {
+const ye = /* @__PURE__ */ X(vt, [["render", ft], ["__scopeId", "data-v-b7af43a6"]]);
+let Ie = 0;
+const pt = {
   beforeCreate() {
-    this.uuid = Ae.toString(), Ae += 1;
+    this.uuid = Ie.toString(), Ie += 1;
   }
-}, mt = { key: 0 };
-function vt(e, s, t, c, i, l) {
-  return b(), T("svg", U({ role: "img" }, e.$attrs, {
+}, gt = { key: 0 };
+function yt(e, s, t, c, i, l) {
+  return d(), _("svg", U({ role: "img" }, e.$attrs, {
     class: "ui-assets-icons-16",
     xmlns: "http://www.w3.org/2000/svg",
     width: "16",
     height: "16",
     fill: "none"
   }), [
-    e.$attrs["svg-title"] ? (b(), T("title", mt, z(e.$attrs["svg-title"]), 1)) : j("", !0),
-    s[0] || (s[0] = H("path", {
+    e.$attrs["svg-title"] ? (d(), _("title", gt, F(e.$attrs["svg-title"]), 1)) : K("", !0),
+    s[0] || (s[0] = W("path", {
       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"
     }, null, -1))
   ], 16);
 }
-const ft = /* @__PURE__ */ X(bt, [["render", vt]]), gt = Q({
+const St = /* @__PURE__ */ X(pt, [["render", yt]]), ht = Z({
   name: "bento-listbox-single-select-option",
   components: {
-    BentoListboxOption: ge,
+    BentoListboxOption: ye,
     BentoTypography: re,
-    CheckmarkIcon: ft
+    CheckmarkIcon: St
   },
   props: {
     /**
@@ -236,26 +238,26 @@ const ft = /* @__PURE__ */ X(bt, [["render", vt]]), gt = Q({
      */
     selected: { type: Boolean, default: !1 }
   },
-  emits: [u.ENTER, u.SELECT, u.SPACE, u.TAB],
+  emits: [b.ENTER, b.SELECT, b.SPACE, b.TAB],
   setup(e, { emit: s }) {
     const t = (r) => {
       e.disabled || s(r, e.option);
-    }, c = g(() => e.disabled ? !0 : null), i = g(() => e.selected ? !0 : null), l = g(() => e.disabled ? -1 : 0);
+    }, c = m(() => e.disabled ? !0 : null), i = m(() => e.selected ? !0 : null), l = m(() => e.disabled ? -1 : 0);
     return {
       // Values
       ariaDisabled: c,
       ariaSelected: i,
       tabIndex: l,
       // Enums
-      BentoListboxEvent: u,
+      BentoListboxEvent: b,
       // Events
       onOptionSelected: t
     };
   }
-}), pt = { class: "b-listbox-single-select-option__text" }, yt = { class: "b-listbox-single-select-option__check-icon" };
-function St(e, s, t, c, i, l) {
-  const r = I("bento-typography"), m = I("checkmark-icon"), C = I("bento-listbox-option");
-  return b(), B(C, {
+}), Ct = { class: "b-listbox-single-select-option__text" }, Et = { class: "b-listbox-single-select-option__check-icon" };
+function _t(e, s, t, c, i, l) {
+  const r = L("bento-typography"), v = L("checkmark-icon"), h = L("bento-listbox-option");
+  return d(), $(h, {
     class: "b-listbox-single-select-option",
     disabled: e.disabled,
     selected: e.selected,
@@ -267,41 +269,41 @@ function St(e, s, t, c, i, l) {
     onSpacePressed: s[2] || (s[2] = ie((n) => e.onOptionSelected(e.BentoListboxEvent.SPACE), ["prevent"])),
     onTabPressed: s[3] || (s[3] = (n) => e.onOptionSelected(e.BentoListboxEvent.TAB))
   }, {
-    default: L(() => [
-      Y(e.$slots, "default", ne(be(e.option)), () => [
-        H("span", pt, [
+    default: T(() => [
+      q(e.$slots, "default", ne(be(e.option)), () => [
+        W("span", Ct, [
           P(r, { el: "span" }, {
-            default: L(() => [
-              F(z(e.option.label), 1)
+            default: T(() => [
+              Y(F(e.option.label), 1)
             ]),
             _: 1
           }),
-          e.option.description ? (b(), B(r, {
+          e.option.description ? (d(), $(r, {
             key: 0,
             class: "b-listbox-single-select-option__description",
             el: "span"
           }, {
-            default: L(() => [
-              F(z(e.option.description), 1)
+            default: T(() => [
+              Y(F(e.option.description), 1)
             ]),
             _: 1
-          })) : j("", !0)
+          })) : K("", !0)
         ])
       ], !0),
-      H("span", yt, [
-        ae(P(m, { "svg-title": "selected" }, null, 512), [
-          [ke, e.selected]
+      W("span", Et, [
+        ae(P(v, { "svg-title": "selected" }, null, 512), [
+          [Be, e.selected]
         ])
       ])
     ]),
     _: 3
   }, 8, ["disabled", "selected", "aria-selected", "aria-disabled", "tabindex"]);
 }
-const Ct = /* @__PURE__ */ X(gt, [["render", St], ["__scopeId", "data-v-226f4c84"]]), De = ({ items: e, hasStaticCategories: s }, t) => {
-  const c = g(
-    () => s.value ? e.value.flatMap((f) => f.items) : e.value
-  ), i = g(() => c.value.length - 1), l = k(0), r = (f) => {
-    switch (f) {
+const Ot = /* @__PURE__ */ X(ht, [["render", _t], ["__scopeId", "data-v-226f4c84"]]), Pe = ({ items: e, hasStaticCategories: s }, t) => {
+  const c = m(
+    () => s.value ? e.value.flatMap((p) => p.items) : e.value
+  ), i = m(() => c.value.length - 1), l = B(0), r = (p) => {
+    switch (p) {
       case "increase":
         l.value += 1;
         break;
@@ -309,18 +311,18 @@ const Ct = /* @__PURE__ */ X(gt, [["render", St], ["__scopeId", "data-v-226f4c84
         l.value -= 1;
         break;
     }
-  }, m = ({ edgeCaseItem: f }, A) => {
-    l.value !== f && (r(A), t(l.value));
-  }, C = (f) => {
-    p(f), m(
+  }, v = ({ edgeCaseItem: p }, k) => {
+    l.value !== p && (r(k), t(l.value));
+  }, h = (p) => {
+    g(p), v(
       {
         edgeCaseItem: i.value
       },
       "increase"
       /* INCREASE */
     );
-  }, n = (f) => {
-    p(f), m(
+  }, n = (p) => {
+    g(p), v(
       {
         edgeCaseItem: 0
       },
@@ -331,28 +333,28 @@ const Ct = /* @__PURE__ */ X(gt, [["render", St], ["__scopeId", "data-v-226f4c84
     l.value = 0, t(l.value);
   }, o = () => {
     l.value = i.value, t(l.value);
-  }, h = (f) => {
-    l.value = f;
-  }, p = (f) => {
-    var A;
-    (A = f == null ? void 0 : f.detail) == null || A.preventDefault();
+  }, C = (p) => {
+    l.value = p;
+  }, g = (p) => {
+    var k;
+    (k = p == null ? void 0 : p.detail) == null || k.preventDefault();
   };
   return {
     moveToFirstElement: a,
     moveToLastElement: o,
-    moveToNextElement: C,
+    moveToNextElement: h,
     moveToPreviousElement: n,
-    setListboxFocusedIndex: h,
-    preventDefault: p,
+    setListboxFocusedIndex: C,
+    preventDefault: g,
     focusedIndex: l
   };
-}, ht = Q({
+}, Tt = Z({
   name: "bento-listbox-single-select",
   components: {
-    BentoListboxSingleSelectCategory: ct,
-    BentoListboxSingleSelectOption: Ct
+    BentoListboxSingleSelectCategory: mt,
+    BentoListboxSingleSelectOption: Ot
   },
-  directives: { BentoKeyboardNavigationDirective: ve },
+  directives: { BentoKeyboardNavigationDirective: pe },
   inheritAttrs: !1,
   props: {
     /**
@@ -393,38 +395,38 @@ const Ct = /* @__PURE__ */ X(gt, [["render", St], ["__scopeId", "data-v-226f4c84
      */
     staticCategories: { type: Boolean, default: !1 }
   },
-  emits: [u.SELECT, u.ENTER, u.SPACE, u.TAB],
+  emits: [b.SELECT, b.ENTER, b.SPACE, b.TAB],
   setup(e, { emit: s, expose: t, slots: c }) {
-    const i = k(null), l = k([]), r = g(() => {
+    const i = B(null), l = B([]), r = m(() => {
       var S;
       return !!((S = e.selectedValue) != null && S.length) && e.selectedValue.at(0);
-    }), m = g(() => !!e.items.some(({ items: S }) => !!S)), C = (S) => ($) => {
-      s(S, [$]);
+    }), v = m(() => !!e.items.some(({ items: S }) => !!S)), h = (S) => (A) => {
+      s(S, [A]);
     }, n = (S) => {
-      var $;
-      ($ = i.value.querySelectorAll('[role="option"]')[S]) == null || $.focus();
+      var A;
+      (A = i.value.querySelectorAll('[role="option"]')[S]) == null || A.focus();
     }, {
       moveToNextElement: a,
       moveToPreviousElement: o,
-      moveToFirstElement: h,
-      moveToLastElement: p,
-      setListboxFocusedIndex: f
-    } = De(
+      moveToFirstElement: C,
+      moveToLastElement: g,
+      setListboxFocusedIndex: p
+    } = Pe(
       {
-        items: ee(e, "items"),
-        hasStaticCategories: ee(e, "staticCategories")
+        items: te(e, "items"),
+        hasStaticCategories: te(e, "staticCategories")
       },
       n
-    ), A = {
-      [G.ARROW_UP]: o,
-      [G.ARROW_DOWN]: a,
-      [G.HOME]: h,
-      [G.END]: p
+    ), k = {
+      [z.ARROW_UP]: o,
+      [z.ARROW_DOWN]: a,
+      [z.HOME]: C,
+      [z.END]: g
     }, w = {
-      [u.SELECT]: C(u.SELECT),
-      [u.SPACE]: C(u.SPACE),
-      [u.TAB]: C(u.TAB),
-      [u.ENTER]: C(u.ENTER)
+      [b.SELECT]: h(b.SELECT),
+      [b.SPACE]: h(b.SPACE),
+      [b.TAB]: h(b.TAB),
+      [b.ENTER]: h(b.ENTER)
     };
     return t({
       /**
@@ -436,35 +438,35 @@ const Ct = /* @__PURE__ */ X(gt, [["render", St], ["__scopeId", "data-v-226f4c84
        * 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: f
+      setListboxFocusedIndex: p
     }), {
       // Enums
-      BentoListboxEvent: u,
+      BentoListboxEvent: b,
       // Values
       listboxRef: i,
       listboxItemRef: l,
       selectedItem: r,
       slots: c,
       // Computed
-      hasCategories: m,
+      hasCategories: v,
       // Methods
-      onOptionSelected: C,
+      onOptionSelected: h,
       // Keyboard navigation
-      listboxListeners: A,
+      listboxListeners: k,
       listboxOptionListeners: w
     };
   }
 });
-function Et(e, s, t, c, i, l) {
-  const r = I("bento-listbox-single-select-option"), m = I("bento-listbox-single-select-category"), C = Re("bento-keyboard-navigation-directive");
-  return ae((b(), T("div", U({ ref: "listboxRef" }, te(e.listboxListeners, !0)), [
-    e.hasCategories && e.staticCategories ? (b(!0), T(se, { key: 0 }, q(e.items, (n) => (b(), B(m, {
+function kt(e, s, t, c, i, l) {
+  const r = L("bento-listbox-single-select-option"), v = L("bento-listbox-single-select-category"), h = Re("bento-keyboard-navigation-directive");
+  return ae((d(), _("div", U({ ref: "listboxRef" }, se(e.listboxListeners, !0)), [
+    e.hasCategories && e.staticCategories ? (d(!0), _(le, { key: 0 }, V(e.items, (n) => (d(), $(v, {
       key: n.value,
       "category-label": n.label,
       role: "group"
     }, {
-      default: L(() => [
-        (b(!0), T(se, null, q(n.items, (a) => (b(), B(r, U({
+      default: T(() => [
+        (d(!0), _(le, null, V(n.items, (a) => (d(), $(r, U({
           key: a.value,
           ref_for: !0,
           ref: "listboxItemRef",
@@ -472,17 +474,17 @@ function Et(e, s, t, c, i, l) {
           option: a,
           disabled: e.isOptionDisabled ? e.isOptionDisabled(a) : null,
           selected: a.value === e.selectedItem.value
-        }, te(e.listboxOptionListeners)), me({ _: 2 }, [
-          q(e.slots, (o, h) => ({
-            name: h,
-            fn: L((p) => [
-              Y(e.$slots, h, U({ ref_for: !0 }, p))
+        }, se(e.listboxOptionListeners)), me({ _: 2 }, [
+          V(e.slots, (o, C) => ({
+            name: C,
+            fn: T((g) => [
+              q(e.$slots, C, U({ ref_for: !0 }, g))
             ])
           }))
         ]), 1040, ["option", "disabled", "selected"]))), 128))
       ]),
       _: 2
-    }, 1032, ["category-label"]))), 128)) : (b(!0), T(se, { key: 1 }, q(e.items, (n) => (b(), B(r, U({
+    }, 1032, ["category-label"]))), 128)) : (d(!0), _(le, { key: 1 }, V(e.items, (n) => (d(), $(r, U({
       key: n.value,
       ref_for: !0,
       ref: "listboxItemRef",
@@ -490,34 +492,70 @@ function Et(e, s, t, c, i, l) {
       option: n,
       disabled: e.isOptionDisabled ? e.isOptionDisabled(n) : null,
       selected: n.value === e.selectedItem.value
-    }, te(e.listboxOptionListeners)), me({ _: 2 }, [
-      q(e.slots, (a, o) => ({
+    }, se(e.listboxOptionListeners)), me({ _: 2 }, [
+      V(e.slots, (a, o) => ({
         name: o,
-        fn: L((h) => [
-          Y(e.$slots, o, U({ ref_for: !0 }, h))
+        fn: T((C) => [
+          q(e.$slots, o, U({ ref_for: !0 }, C))
         ])
       }))
     ]), 1040, ["option", "disabled", "selected"]))), 128))
   ], 16)), [
-    [C]
+    [h]
   ]);
 }
-const Ot = /* @__PURE__ */ X(ht, [["render", Et]]);
-var Se = /* @__PURE__ */ ((e) => (e.DISABLED = "disabled", e.STATIC_CATEGORY = "static-category", e))(Se || {}), ue = /* @__PURE__ */ ((e) => (e.SELECT_CATEGORY = "select-category", e.UNSELECT_CATEGORY = "unselect-category", e))(ue || {});
-const Tt = {
+const At = /* @__PURE__ */ X(Tt, [["render", kt]]), Lt = {}, It = /* @__PURE__ */ Z({
+  ...Lt,
+  __name: "listbox-decorative-checkbox",
+  props: {
+    disabled: { type: Boolean, default: !1 },
+    indeterminate: { type: Boolean, default: !1 },
+    checked: { type: Boolean, default: !1 }
+  },
+  setup(e) {
+    const s = e, t = m(() => ({
+      [`b-checkbox-input--${fe.DISABLED}`]: s.disabled
+    })), c = m(() => ({
+      [`b-checkbox-input__outline--${fe.UNCHECKED}`]: !s.checked && !s.indeterminate,
+      [`b-checkbox-input__outline--${fe.CHECKED}`]: s.checked && !s.indeterminate,
+      [`b-checkbox-input__outline--${fe.INDETERMINATE}`]: s.indeterminate
+    }));
+    return (i, l) => (d(), _("div", {
+      class: ve(["b-checkbox-input", t.value]),
+      role: "presentation"
+    }, [
+      i.indeterminate ? (d(), $(R(lt), {
+        key: 0,
+        class: "b-checkbox-input__icon",
+        "svg-title": "",
+        "aria-hidden": "true"
+      })) : i.checked ? (d(), $(R(ot), {
+        key: 1,
+        class: "b-checkbox-input__icon",
+        "svg-title": "",
+        "aria-hidden": "true"
+      })) : K("", !0),
+      W("div", {
+        class: ve(["b-checkbox-input__outline", c.value])
+      }, null, 2)
+    ], 2));
+  }
+}), _e = /* @__PURE__ */ X(It, [["__scopeId", "data-v-c604b68a"]]);
+var he = /* @__PURE__ */ ((e) => (e.DISABLED = "disabled", e.STATIC_CATEGORY = "static-category", e))(he || {}), ue = /* @__PURE__ */ ((e) => (e.SELECT_CATEGORY = "select-category", e.UNSELECT_CATEGORY = "unselect-category", e))(ue || {});
+const $t = {
   "en-US": {
     categoryClosed: "{category} closed",
     categoryOpened: "{category} opened"
   }
-}, _t = Q({
-  i18n: { messages: Tt },
+}, Dt = Z({
+  i18n: { messages: $t },
   name: "bento-listbox-multi-select-category",
   components: {
-    BentoCheckbox: Ee,
     BentoTypography: re,
-    BentoListboxOption: ge,
-    ChevronDownIcon: st,
-    ChevronUpIcon: tt
+    BentoListboxOption: ye,
+    ChevronDownIcon: nt,
+    ChevronUpIcon: it,
+    ListboxDecorativeCheckbox: _e
   },
   props: {
     /**
@@ -564,110 +602,110 @@ const Tt = {
   },
   emits: [ue.SELECT_CATEGORY, ue.UNSELECT_CATEGORY],
   setup(e, { emit: s }) {
-    const t = k(!1), { t: c } = he(), i = (_) => e.isOptionDisabled ? e.isOptionDisabled(_) : !1, l = g(
-      () => e.category.items.every((_) => i(_))
-    ), r = ee(e, "staticCategories"), m = g(() => t.value || e.staticCategories), C = g(() => ({
-      [`b-listbox-multi-select-category--${Se.DISABLED}`]: l.value,
-      [`b-listbox-multi-select-category--${Se.STATIC_CATEGORY}`]: e.staticCategories
-    })), n = (_) => {
-      _.preventDefault(), t.value = !t.value;
-    }, a = (_) => {
-      var V;
-      const W = i(_), K = ((V = e.selectedItemsList) == null ? void 0 : V.includes(_.value)) || !1;
-      return { isDisabled: W, isPreSelected: K };
-    }, o = g(
-      () => e.category.items.filter((_) => {
-        const { isDisabled: W, isPreSelected: K } = a(_);
-        return W && K || !W;
+    const t = B(!1), { t: c } = Ee(), i = (I) => e.isOptionDisabled ? e.isOptionDisabled(I) : !1, l = m(
+      () => e.category.items.every((I) => i(I))
+    ), r = te(e, "staticCategories"), v = m(() => t.value || e.staticCategories), h = m(() => ({
+      [`b-listbox-multi-select-category--${he.DISABLED}`]: l.value,
+      [`b-listbox-multi-select-category--${he.STATIC_CATEGORY}`]: e.staticCategories
+    })), n = (I) => {
+      I.preventDefault(), t.value = !t.value;
+    }, a = (I) => {
+      var J;
+      const H = i(I), j = ((J = e.selectedItemsList) == null ? void 0 : J.includes(I.value)) || !1;
+      return { isDisabled: H, isPreSelected: j };
+    }, o = m(
+      () => e.category.items.filter((I) => {
+        const { isDisabled: H, isPreSelected: j } = a(I);
+        return H && j || !H;
       })
-    ), h = g(
+    ), C = m(
       () => {
-        var _;
-        return (_ = o.value) == null ? void 0 : _.filter(
-          ({ value: W }) => {
-            var K;
-            return (K = e.selectedItemsList) == null ? void 0 : K.includes(W);
+        var I;
+        return (I = o.value) == null ? void 0 : I.filter(
+          ({ value: H }) => {
+            var j;
+            return (j = e.selectedItemsList) == null ? void 0 : j.includes(H);
           }
         );
       }
-    ), p = g(() => {
-      const _ = t.value ? "categoryOpened" : "categoryClosed";
-      return c(_, { category: e.category.label });
-    }), f = g(
+    ), g = m(() => {
+      const I = t.value ? "categoryOpened" : "categoryClosed";
+      return c(I, { category: e.category.label });
+    }), p = m(
       () => ({
         el: "span",
         variant: e.staticCategories ? "caption" : "body"
       })
-    ), A = () => {
+    ), k = () => {
       s(ue.SELECT_CATEGORY);
     }, w = () => {
       s(ue.UNSELECT_CATEGORY);
-    }, { isAllSelected: S, isIndeterminate: $, toggleSelectAll: D } = Be(
-      h,
+    }, { isAllSelected: S, isIndeterminate: A, toggleSelectAll: N } = Ne(
+      C,
       o,
-      A,
+      k,
       w
-    ), R = k(S.value), N = () => {
-      R.value = !R.value, D(R.value);
+    ), x = m(() => A.value ? "mixed" : `${S.value}`), D = B(S.value), G = () => {
+      D.value = !D.value, N(D.value);
     };
-    return fe(S, () => {
-      R.value = S.value;
+    return ge(S, () => {
+      D.value = S.value;
     }), {
       // Values
-      chevronTitle: p,
-      conditionalClass: C,
+      chevronTitle: g,
+      conditionalClass: h,
       hasAllPropsDisabled: l,
       isOpen: t,
       isAllSelected: S,
-      isIndeterminate: $,
+      isIndeterminate: A,
       isStaticCategory: r,
       // Computed
-      showItemChildren: m,
-      categoryLabelProps: f,
+      showItemChildren: v,
+      categoryLabelProps: p,
+      ariaCheckedComputed: x,
       // Methods
-      handleSelectAll: N,
+      handleSelectAll: G,
       toggleOpen: n,
-      toggleSelectAll: D
+      toggleSelectAll: N
     };
   }
-}), Lt = { class: "b-listbox-multi-select-category__label" };
-function At(e, s, t, c, i, l) {
-  const r = I("bento-checkbox"), m = I("bento-typography"), C = I("chevron-up-icon"), n = I("chevron-down-icon"), a = I("bento-listbox-option");
-  return b(), T("div", null, [
+}), Bt = { class: "b-listbox-multi-select-category__label" };
+function Rt(e, s, t, c, i, l) {
+  const r = L("listbox-decorative-checkbox"), v = L("bento-typography"), h = L("chevron-up-icon"), n = L("chevron-down-icon"), a = L("bento-listbox-option");
+  return d(), _("div", null, [
     P(a, {
-      class: ye(["b-listbox-multi-select-category__option", e.conditionalClass]),
+      class: ve(["b-listbox-multi-select-category__option", e.conditionalClass]),
       tabindex: e.tabindex,
+      "aria-checked": e.ariaCheckedComputed,
+      "aria-disabled": e.hasAllPropsDisabled,
       onClick: e.handleSelectAll,
       onEnterPressed: e.handleSelectAll,
       onSpacePressed: ie(e.handleSelectAll, ["prevent"])
     }, {
-      default: L(() => [
-        e.isStaticCategory ? j("", !0) : (b(), B(r, {
+      default: T(() => [
+        e.isStaticCategory ? K("", !0) : (d(), $(r, {
           key: 0,
-          "model-value": e.isAllSelected,
           indeterminate: e.isIndeterminate,
           disabled: e.hasAllPropsDisabled,
-          "aria-label": e.category.label,
-          value: e.category.value,
-          tabindex: -1
-        }, null, 8, ["model-value", "indeterminate", "disabled", "aria-label", "value"])),
-        H("span", Lt, [
-          P(m, U(e.categoryLabelProps, { class: "b-listbox-multi-select-category__label-text" }), {
-            default: L(() => [
-              F(z(e.category.label), 1)
+          checked: e.isAllSelected
+        }, null, 8, ["indeterminate", "disabled", "checked"])),
+        W("span", Bt, [
+          P(v, U(e.categoryLabelProps, { class: "b-listbox-multi-select-category__label-text" }), {
+            default: T(() => [
+              Y(F(e.category.label), 1)
             ]),
             _: 1
           }, 16),
-          e.isStaticCategory ? j("", !0) : (b(), T("div", {
+          e.isStaticCategory ? K("", !0) : (d(), _("div", {
             key: 0,
             class: "b-listbox-multi-select-category__label-chevron",
             "data-testid": "toggle-listbox",
             onClickCapture: s[0] || (s[0] = ie((...o) => e.toggleOpen && e.toggleOpen(...o), ["stop"]))
           }, [
-            e.isOpen ? (b(), B(C, {
+            e.isOpen ? (d(), $(h, {
               key: 0,
               "svg-title": e.chevronTitle
-            }, null, 8, ["svg-title"])) : (b(), B(n, {
+            }, null, 8, ["svg-title"])) : (d(), $(n, {
               key: 1,
               "svg-title": e.chevronTitle
             }, null, 8, ["svg-title"]))
@@ -675,23 +713,23 @@ function At(e, s, t, c, i, l) {
         ])
       ]),
       _: 1
-    }, 8, ["class", "tabindex", "onClick", "onEnterPressed", "onSpacePressed"]),
-    ae(H("div", null, [
-      Y(e.$slots, "default", {}, void 0, !0)
+    }, 8, ["class", "tabindex", "aria-checked", "aria-disabled", "onClick", "onEnterPressed", "onSpacePressed"]),
+    ae(W("div", null, [
+      q(e.$slots, "default", {}, void 0, !0)
     ], 512), [
-      [ke, e.showItemChildren]
+      [Be, e.showItemChildren]
     ])
   ]);
 }
-const It = /* @__PURE__ */ X(_t, [["render", At], ["__scopeId", "data-v-92af4c61"]]);
-var Z = /* @__PURE__ */ ((e) => (e.SELECT_CATEGORY = "select-category", e.TOGGLE_CHECKBOX_SELECTION = "toggle-checkbox-selection", e.UNSELECT_CATEGORY = "unselect-category", e))(Z || {});
-const $t = Q({
+const Nt = /* @__PURE__ */ X(Dt, [["render", Rt], ["__scopeId", "data-v-c59132dd"]]);
+var ee = /* @__PURE__ */ ((e) => (e.SELECT_CATEGORY = "select-category", e.TOGGLE_CHECKBOX_SELECTION = "toggle-checkbox-selection", e.UNSELECT_CATEGORY = "unselect-category", e))(ee || {});
+const Pt = Z({
   name: "listbox-multi-select-options",
   components: {
-    BentoCheckbox: Ee,
-    BentoListboxOption: ge,
+    BentoListboxOption: ye,
     BentoTypography: re,
-    ListboxMultiSelectCategory: It
+    ListboxMultiSelectCategory: Nt,
+    ListboxDecorativeCheckbox: _e
   },
   props: {
     /**
@@ -753,26 +791,26 @@ const $t = Q({
     staticCategories: { type: Boolean, default: !1 }
   },
   emits: [
-    Z.TOGGLE_CHECKBOX_SELECTION,
-    Z.SELECT_CATEGORY,
-    Z.UNSELECT_CATEGORY
+    ee.TOGGLE_CHECKBOX_SELECTION,
+    ee.SELECT_CATEGORY,
+    ee.UNSELECT_CATEGORY
   ],
   setup(e, { emit: s }) {
     const t = (n) => {
-      e.isOptionDisabled(n) || s(Z.TOGGLE_CHECKBOX_SELECTION, n);
+      e.isOptionDisabled(n) || s(ee.TOGGLE_CHECKBOX_SELECTION, n);
     }, c = (n) => !!n.items, i = (n) => {
       const a = e.isMultiLevel && e.searching;
       return n.description && (!e.isMultiLevel || a);
     }, l = (n) => n.items ? !!n.items.find((a) => e.selectedItemsList.includes(a.value)) : e.selectedItemsList.includes(n.value), r = (n) => {
       if (c(n)) {
-        const a = l(n) ? Z.UNSELECT_CATEGORY : Z.SELECT_CATEGORY;
+        const a = l(n) ? ee.UNSELECT_CATEGORY : ee.SELECT_CATEGORY;
         s(a, n);
       } else
         t(n);
     };
     return {
       // Values
-      conditionalClasses: g(() => ({
+      conditionalClasses: m(() => ({
         "b-listbox-multi-select-options__static-category-option": e.staticCategories,
         "b-listbox-multi-select-options__category-option": e.categoryItems
       })),
@@ -783,68 +821,67 @@ const $t = Q({
       toggleSearchOption: r,
       computedTabindex: (n) => n + 1 === e.focusedIndex ? 0 : -1,
       // Enums
-      BentoListboxEvent: u,
-      ListboxMultiSelectOptionsEvent: Z
+      BentoListboxEvent: b,
+      ListboxMultiSelectOptionsEvent: ee
     };
   }
-}), kt = { class: "b-listbox-multi-select__option-text" }, Rt = { class: "b-listbox-multi-select__option-text" };
-function Bt(e, s, t, c, i, l) {
-  const r = I("bento-checkbox"), m = I("bento-typography"), C = I("bento-listbox-option"), n = I("listbox-multi-select-options", !0), a = I("listbox-multi-select-category");
-  return b(), T("div", null, [
-    (b(!0), T(se, null, q(e.items, (o, h) => (b(), T("div", {
+}), Mt = { class: "b-listbox-multi-select__option-text" }, wt = { class: "b-listbox-multi-select__option-text" };
+function xt(e, s, t, c, i, l) {
+  const r = L("listbox-decorative-checkbox"), v = L("bento-typography"), h = L("bento-listbox-option"), n = L("listbox-multi-select-options", !0), a = L("listbox-multi-select-category");
+  return d(), _("div", null, [
+    (d(!0), _(le, null, V(e.items, (o, C) => (d(), _("div", {
       key: `selected-${o.value}`
     }, [
-      e.searching && e.isMultiLevel ? (b(), B(C, {
+      e.searching && e.isMultiLevel ? (d(), $(h, {
         key: 0,
-        class: ye(["b-listbox-multi-select-options", e.conditionalClasses]),
+        class: ve(["b-listbox-multi-select-options", e.conditionalClasses]),
         disabled: e.isOptionDisabled ? e.isOptionDisabled(o) : null,
-        tabindex: e.computedTabindex(h),
-        onClick: (p) => e.toggleSearchOption(o),
-        onEnterPressed: (p) => e.toggleSearchOption(o),
-        onSpacePressed: ie((p) => e.toggleSearchOption(o), ["prevent"])
+        tabindex: e.computedTabindex(C),
+        "aria-checked": `${e.isOptionSelected(o)}`,
+        "aria-disabled": e.isOptionDisabled ? e.isOptionDisabled(o) : null,
+        onClick: (g) => e.toggleSearchOption(o),
+        onEnterPressed: (g) => e.toggleSearchOption(o),
+        onSpacePressed: ie((g) => e.toggleSearchOption(o), ["prevent"])
       }, {
-        default: L(() => [
+        default: T(() => [
           P(r, {
-            "model-value": e.isOptionSelected(o),
-            "aria-label": o.label,
             disabled: e.isOptionDisabled ? e.isOptionDisabled(o) : null,
-            value: o.value,
-            tabindex: "-1"
-          }, null, 8, ["model-value", "aria-label", "disabled", "value"]),
-          Y(e.$slots, "default", U({ ref_for: !0 }, o), () => [
-            H("span", kt, [
-              P(m, { el: "span" }, {
-                default: L(() => [
-                  F(z(o.label), 1)
+            checked: e.isOptionSelected(o)
+          }, null, 8, ["disabled", "checked"]),
+          q(e.$slots, "default", U({ ref_for: !0 }, o), () => [
+            W("span", Mt, [
+              P(v, { el: "span" }, {
+                default: T(() => [
+                  Y(F(o.label), 1)
                 ]),
                 _: 2
               }, 1024),
-              e.shouldShowDescription(o) ? (b(), B(m, {
+              e.shouldShowDescription(o) ? (d(), $(v, {
                 key: 0,
                 class: "b-listbox-multi-select__option-description",
                 el: "span"
               }, {
-                default: L(() => [
-                  F(z(o.description), 1)
+                default: T(() => [
+                  Y(F(o.description), 1)
                 ]),
                 _: 2
-              }, 1024)) : j("", !0)
+              }, 1024)) : K("", !0)
             ])
           ], !0)
         ]),
         _: 2
-      }, 1032, ["class", "disabled", "tabindex", "onClick", "onEnterPressed", "onSpacePressed"])) : (b(), T(se, { key: 1 }, [
-        o.items ? (b(), B(a, {
+      }, 1032, ["class", "disabled", "tabindex", "aria-checked", "aria-disabled", "onClick", "onEnterPressed", "onSpacePressed"])) : (d(), _(le, { key: 1 }, [
+        o.items ? (d(), $(a, {
           key: 0,
           category: o,
           "static-categories": e.staticCategories,
           "is-option-disabled": e.isOptionDisabled,
           "selected-items-list": e.selectedItemsList,
-          tabindex: e.computedTabindex(h),
-          onSelectCategory: (p) => e.$emit(e.ListboxMultiSelectOptionsEvent.SELECT_CATEGORY, o),
-          onUnselectCategory: (p) => e.$emit(e.ListboxMultiSelectOptionsEvent.UNSELECT_CATEGORY, o)
+          tabindex: e.computedTabindex(C),
+          onSelectCategory: (g) => e.$emit(e.ListboxMultiSelectOptionsEvent.SELECT_CATEGORY, o),
+          onUnselectCategory: (g) => e.$emit(e.ListboxMultiSelectOptionsEvent.UNSELECT_CATEGORY, o)
         }, {
-          default: L(() => [
+          default: T(() => [
             P(n, {
               "category-items": "",
               items: o.items,
@@ -854,59 +891,58 @@ function Bt(e, s, t, c, i, l) {
               "static-categories": e.staticCategories,
               "selected-items-list": e.selectedItemsList,
               searching: e.searching,
-              onToggleCheckboxSelection: s[0] || (s[0] = (p) => e.toggleCheckboxSelection(p))
+              onToggleCheckboxSelection: s[0] || (s[0] = (g) => e.toggleCheckboxSelection(g))
             }, null, 8, ["items", "is-option-disabled", "focused-index", "is-multi-level", "static-categories", "selected-items-list", "searching"])
           ]),
           _: 2
-        }, 1032, ["category", "static-categories", "is-option-disabled", "selected-items-list", "tabindex", "onSelectCategory", "onUnselectCategory"])) : (b(), B(C, {
+        }, 1032, ["category", "static-categories", "is-option-disabled", "selected-items-list", "tabindex", "onSelectCategory", "onUnselectCategory"])) : (d(), $(h, {
           key: 1,
-          class: ye(["b-listbox-multi-select-options", e.conditionalClasses]),
+          class: ve(["b-listbox-multi-select-options", e.conditionalClasses]),
           disabled: e.isOptionDisabled ? e.isOptionDisabled(o) : null,
-          tabindex: e.computedTabindex(h),
-          onClick: (p) => e.toggleCheckboxSelection(o),
-          onEnterPressed: (p) => e.toggleCheckboxSelection(o),
-          onSpacePressed: ie((p) => e.toggleCheckboxSelection(o), ["prevent"])
+          tabindex: e.computedTabindex(C),
+          "aria-checked": `${e.isOptionSelected(o)}`,
+          "aria-disabled": e.isOptionDisabled ? e.isOptionDisabled(o) : null,
+          onClick: (g) => e.toggleCheckboxSelection(o),
+          onEnterPressed: (g) => e.toggleCheckboxSelection(o),
+          onSpacePressed: ie((g) => e.toggleCheckboxSelection(o), ["prevent"])
         }, {
-          default: L(() => [
+          default: T(() => [
             P(r, {
-              "model-value": e.selectedItemsList,
-              "aria-label": o.label,
               disabled: e.isOptionDisabled ? e.isOptionDisabled(o) : null,
-              value: o.value,
-              tabindex: -1
-            }, null, 8, ["model-value", "aria-label", "disabled", "value"]),
-            Y(e.$slots, "default", U({ ref_for: !0 }, o), () => [
-              H("span", Rt, [
-                P(m, { el: "span" }, {
-                  default: L(() => [
-                    F(z(o.label), 1)
+              checked: e.isOptionSelected(o)
+            }, null, 8, ["disabled", "checked"]),
+            q(e.$slots, "default", U({ ref_for: !0 }, o), () => [
+              W("span", wt, [
+                P(v, { el: "span" }, {
+                  default: T(() => [
+                    Y(F(o.label), 1)
                   ]),
                   _: 2
                 }, 1024),
-                e.shouldShowDescription(o) ? (b(), B(m, {
+                e.shouldShowDescription(o) ? (d(), $(v, {
                   key: 0,
                   class: "b-listbox-multi-select__option-description",
                   el: "span"
                 }, {
-                  default: L(() => [
-                    F(z(o.description), 1)
+                  default: T(() => [
+                    Y(F(o.description), 1)
                   ]),
                   _: 2
-                }, 1024)) : j("", !0)
+                }, 1024)) : K("", !0)
               ])
             ], !0)
           ]),
           _: 2
-        }, 1032, ["class", "disabled", "tabindex", "onClick", "onEnterPressed", "onSpacePressed"]))
+        }, 1032, ["class", "disabled", "tabindex", "aria-checked", "aria-disabled", "onClick", "onEnterPressed", "onSpacePressed"]))
       ], 64))
     ]))), 128))
   ]);
 }
-const Dt = /* @__PURE__ */ X($t, [["render", Bt], ["__scopeId", "data-v-c9ae45d6"]]), Pt = (e) => {
-  const s = g(() => {
+const Ut = /* @__PURE__ */ X(Pt, [["render", xt], ["__scopeId", "data-v-5778456e"]]), Gt = (e) => {
+  const s = m(() => {
     var c;
     return !!((c = e.value) != null && c.find(({ items: i }) => !!i));
-  }), t = g(() => {
+  }), t = m(() => {
     var c;
     return s.value ? (c = e.value) == null ? void 0 : c.reduce((i, l) => (l.items ? i.push(...l.items.flat()) : i.push(l), i), []) : e.value;
   });
@@ -914,18 +950,18 @@ const Dt = /* @__PURE__ */ X($t, [["render", Bt], ["__scopeId", "data-v-c9ae45d6
     isMultiLevelSelect: s,
     flattenedItemsList: t
   };
-}, Pe = {
+}, Me = {
   "en-US": {
     allSelected: "All selected ({total})",
     numberOfTotalSelected: "{number} of {total} selected",
     numbersSelected: "{number} selected",
     selectAll: "Select all ({total})"
   }
-}, Nt = { key: 0 }, Mt = {
+}, zt = { key: 0 }, Ft = {
   key: 1,
   class: "b-listbox-multi-select__divider"
-}, wt = { i18n: { messages: Pe } }, xt = /* @__PURE__ */ Q({
-  ...wt,
+}, Yt = { i18n: { messages: Me } }, Kt = /* @__PURE__ */ Z({
+  ...Yt,
   __name: "listbox-multi-select",
   props: {
     hasMoreItems: { type: Boolean, default: !1 },
@@ -938,193 +974,189 @@ const Dt = /* @__PURE__ */ X($t, [["render", Bt], ["__scopeId", "data-v-c9ae45d6
   },
   emits: ["select"],
   setup(e, { emit: s }) {
-    const t = e, c = s, { t: i } = he({ messages: Pe }), l = Ve(), r = k(null), m = k(null), C = k(null), n = k(null), a = g(() => t.selectedValues.map(({ value: v }) => v)), { isMultiLevelSelect: o, flattenedItemsList: h } = Pt(ee(t, "items")), p = (v) => {
+    const t = e, c = s, { t: i } = Ee({ messages: Me }), l = Je(), r = B(null), v = B(null), h = B(null), n = B(null), a = m(() => t.selectedValues.map(({ value: f }) => f)), { isMultiLevelSelect: o, flattenedItemsList: C } = Gt(te(t, "items")), g = (f) => {
       var O;
-      const y = t.isOptionDisabled(v), d = ((O = a.value) == null ? void 0 : O.includes(v.value)) || !1;
-      return { isDisabled: y, isPreSelected: d };
-    }, f = g(() => {
+      const y = t.isOptionDisabled(f), u = ((O = a.value) == null ? void 0 : O.includes(f.value)) || !1;
+      return { isDisabled: y, isPreSelected: u };
+    }, p = m(() => {
       if (t.searching && o)
         return t.items;
-      const v = h.value.filter((y) => {
-        const { isDisabled: d, isPreSelected: O } = p(y);
-        return d && O || !d;
+      const f = C.value.filter((y) => {
+        const { isDisabled: u, isPreSelected: O } = g(y);
+        return u && O || !u;
       });
       return t.selectedValues.forEach((y) => {
-        v.find((d) => d.value === y.value) || v.push(y);
-      }), v;
-    }), A = g(
+        f.find((u) => u.value === y.value) || f.push(y);
+      }), f;
+    }), k = m(
       () => {
-        var v;
-        return (v = f.value) == null ? void 0 : v.filter((y) => {
-          var d;
+        var f;
+        return (f = p.value) == null ? void 0 : f.filter((y) => {
+          var u;
           return y.items && o.value && t.searching ? y.items.filter(
             (E) => (t.selectedValues ?? []).includes(E.value)
-          ).length === y.items.length : (d = a.value) == null ? void 0 : d.includes(y.value);
+          ).length === y.items.length : (u = a.value) == null ? void 0 : u.includes(y.value);
         });
       }
-    ), w = () => o.value && !t.searching ? h.value.length : t.items.length, S = g(() => {
+    ), w = () => o.value && !t.searching ? C.value.length : t.items.length, S = m(() => {
       var O;
-      const v = f.value.length, y = w(), d = ((O = A.value) == null ? void 0 : O.length) || 0;
-      return d === 0 ? i("selectAll", { total: v }) : d === y ? i("allSelected", { total: y }) : d <= y ? i("numberOfTotalSelected", { number: d, total: y }) : i("numbersSelected", { number: d });
-    }), $ = (v) => {
+      const f = p.value.length, y = w(), u = ((O = k.value) == null ? void 0 : O.length) || 0;
+      return u === 0 ? i("selectAll", { total: f }) : u === y ? i("allSelected", { total: y }) : u <= y ? i("numberOfTotalSelected", { number: u, total: y }) : i("numbersSelected", { number: u });
+    }), A = (f) => {
       const y = (O) => {
-        const { isDisabled: E, isPreSelected: J } = p(O);
-        return E && J || !E;
-      }, d = v.filter(y).filter((O) => !a.value.includes(O.value));
-      c("select", [...t.selectedValues, ...d]);
-    }, D = (v) => {
+        const { isDisabled: E, isPreSelected: Q } = g(O);
+        return E && Q || !E;
+      }, u = f.filter(y).filter((O) => !a.value.includes(O.value));
+      c("select", [...t.selectedValues, ...u]);
+    }, N = (f) => {
       const y = (E) => {
-        const { isDisabled: J, isPreSelected: qe } = p(E);
-        return !(J && qe);
-      }, d = v.filter(y).map(({ value: E }) => E), O = t.selectedValues.filter((E) => !(d != null && d.includes(E.value)));
+        const { isDisabled: Q, isPreSelected: je } = g(E);
+        return !(Q && je);
+      }, u = f.filter(y).map(({ value: E }) => E), O = t.selectedValues.filter((E) => !(u != null && u.includes(E.value)));
       c("select", O);
-    }, R = () => {
-      $(h.value);
-    }, N = () => {
-      D(h.value);
-    }, { isAllSelected: _, isIndeterminate: W, toggleSelectAll: K } = Be(
-      A,
-      f,
-      R,
-      N
-    ), V = k(_.value), ce = () => {
-      V.value = !V.value, K(V.value);
+    }, x = () => {
+      A(C.value);
+    }, D = () => {
+      N(C.value);
+    }, { isAllSelected: G, isIndeterminate: I, toggleSelectAll: H } = Ne(
+      k,
+      p,
+      x,
+      D
+    ), j = m(() => I.value ? "mixed" : `${G.value}`), J = B(G.value), M = () => {
+      J.value = !J.value, H(J.value);
     };
-    fe(_, () => {
-      V.value = _.value;
+    ge(G, () => {
+      J.value = G.value;
     });
-    const x = (v) => {
-      $(v.items);
-    }, le = (v) => {
-      D(v.items);
-    }, de = (v, y) => {
-      let d = !1;
-      const O = t.selectedValues.filter(({ value: E }) => y.value === E ? (d = !0, !1) : !0);
-      d || O.push(y), c(v, O);
-    }, Ne = g(() => {
+    const ce = (f) => {
+      A(f.items);
+    }, Oe = (f) => {
+      N(f.items);
+    }, de = (f, y) => {
+      let u = !1;
+      const O = t.selectedValues.filter(({ value: E }) => y.value === E ? (u = !0, !1) : !0);
+      u || O.push(y), c(f, O);
+    }, we = m(() => {
       if (!o.value)
         return t.selectedValues;
-      const v = (E) => a.value.includes(E.value), y = (E) => !t.staticCategories && E.every((J) => v(J));
+      const f = (E) => a.value.includes(E.value), y = (E) => !t.staticCategories && E.every((Q) => f(Q));
       return t.items.flatMap(
         (E) => E.items && !y(E.items) ? E.items : E
-      ).filter((E) => E.items ? !0 : v(E));
-    }), Me = g(() => {
-      var d, O, E, J;
-      const v = ["automatic", "button"].includes(t.lazyLoadType), y = ((d = t.selectedValues) == null ? void 0 : d.length) > 0 && ((O = A.value) == null ? void 0 : O.length) !== ((E = h.value) == null ? void 0 : E.length);
-      return v && t.hasMoreItems ? !!((J = t.selectedValues) != null && J.length) : y;
-    }), Oe = g(() => ["automatic", "button"].includes(t.lazyLoadType) ? !t.hasMoreItems : !0), we = g(() => ({ label: S, value: _ })), xe = g(() => [we, ...ee(t, "items").value]), Ue = (v) => {
-      var d;
-      (d = Array.from(
+      ).filter((E) => E.items ? !0 : f(E));
+    }), xe = m(() => {
+      var u, O, E, Q;
+      const f = ["automatic", "button"].includes(t.lazyLoadType), y = ((u = t.selectedValues) == null ? void 0 : u.length) > 0 && ((O = k.value) == null ? void 0 : O.length) !== ((E = C.value) == null ? void 0 : E.length);
+      return f && t.hasMoreItems ? !!((Q = t.selectedValues) != null && Q.length) : y;
+    }), Te = m(() => ["automatic", "button"].includes(t.lazyLoadType) ? !t.hasMoreItems : !0), Ue = m(() => ({ label: S, value: G })), Ge = m(() => [Ue, ...te(t, "items").value]), ze = (f) => {
+      var u;
+      (u = Array.from(
         r.value.querySelectorAll('[role="option"]')
-      ).filter((O) => O.checkVisibility())[v]) == null || d.focus();
+      ).filter((O) => O.checkVisibility())[f]) == null || u.focus();
     }, {
-      moveToNextElement: Ge,
-      moveToPreviousElement: ze,
-      moveToFirstElement: Fe,
-      moveToLastElement: Ye,
-      preventDefault: Te,
-      focusedIndex: _e
-    } = De(
+      moveToNextElement: Fe,
+      moveToPreviousElement: Ye,
+      moveToFirstElement: Ke,
+      moveToLastElement: We,
+      preventDefault: ke,
+      focusedIndex: Ae
+    } = Pe(
       {
-        items: k(xe),
-        hasStaticCategories: ee(t, "staticCategories")
+        items: B(Ge),
+        hasStaticCategories: te(t, "staticCategories")
       },
-      Ue
-    ), We = {
-      [G.ARROW_UP]: (v) => ze(v),
-      [G.ARROW_DOWN]: (v) => Ge(v),
-      [G.HOME]: Fe,
-      [G.END]: Ye
-    }, Ke = {
-      [G.ARROW_UP]: Te,
-      [G.ARROW_DOWN]: Te
+      ze
+    ), qe = {
+      [z.ARROW_UP]: (f) => Ye(f),
+      [z.ARROW_DOWN]: (f) => Fe(f),
+      [z.HOME]: Ke,
+      [z.END]: We
+    }, He = {
+      [z.ARROW_UP]: ke,
+      [z.ARROW_DOWN]: ke
     };
-    return (v, y) => (b(), T("div", {
+    return (f, y) => (d(), _("div", {
       ref_key: "listboxRef",
       ref: r,
       class: "b-listbox-multi-select"
     }, [
-      Me.value ? (b(), T("div", Nt, [
-        ae((b(), T("ul", U({ class: "b-listbox-multi-select__chips" }, te(Ke, !0)), [
-          (b(!0), T(se, null, q(Ne.value, (d) => (b(), T("li", {
-            key: d.value
+      xe.value ? (d(), _("div", zt, [
+        ae((d(), _("ul", U({ class: "b-listbox-multi-select__chips" }, se(He, !0)), [
+          (d(!0), _(le, null, V(we.value, (u) => (d(), _("li", {
+            key: u.value
           }, [
-            P(M(et), {
+            P(R(st), {
               ref_for: !0,
               ref_key: "selectedListboxItemsRef",
-              ref: C,
-              disabled: v.isOptionDisabled(d),
-              label: d.label,
+              ref: h,
+              disabled: f.isOptionDisabled(u),
+              label: u.label,
               condensed: "",
-              onClick: (O) => d.items ? le(d) : de("select", d)
+              onClick: (O) => u.items ? Oe(u) : de("select", u)
             }, null, 8, ["disabled", "label", "onClick"])
           ]))), 128))
         ], 16)), [
-          [M(ve)]
+          [R(pe)]
         ]),
-        y[4] || (y[4] = H("hr", { class: "b-listbox-multi-select__divider" }, null, -1))
-      ])) : j("", !0),
-      ae((b(), T("div", te(We, !0), [
-        Oe.value ? (b(), B(M(ge), {
+        y[4] || (y[4] = W("hr", { class: "b-listbox-multi-select__divider" }, null, -1))
+      ])) : K("", !0),
+      ae((d(), _("div", se(qe, !0), [
+        Te.value ? (d(), $(R(ye), {
           key: 0,
           ref_key: "selectAllListboxItemsRef",
-          ref: m,
+          ref: v,
           class: "b-listbox-multi-select__option",
-          tabindex: M(_e) === 0 ? 0 : -1,
-          onClick: ce,
-          onEnterPressed: ce,
-          onSpacePressed: ie(ce, ["prevent"])
+          tabindex: R(Ae) === 0 ? 0 : -1,
+          "aria-checked": j.value,
+          onClick: M,
+          onEnterPressed: M,
+          onSpacePressed: ie(M, ["prevent"])
         }, {
-          default: L(() => [
-            P(M(Ee), {
-              "aria-label": S.value,
-              "model-value": M(_),
-              indeterminate: M(W),
-              tabindex: -1
-            }, null, 8, ["aria-label", "model-value", "indeterminate"]),
-            P(M(re), {
-              el: "span",
-              "aria-hidden": "true"
-            }, {
-              default: L(() => [
-                F(z(S.value), 1)
+          default: T(() => [
+            P(R(_e), {
+              checked: R(G),
+              indeterminate: R(I)
+            }, null, 8, ["checked", "indeterminate"]),
+            P(R(re), { el: "span" }, {
+              default: T(() => [
+                Y(F(S.value), 1)
               ]),
               _: 1
             })
           ]),
           _: 1
-        }, 8, ["tabindex"])) : j("", !0),
-        Oe.value ? (b(), T("hr", Mt)) : j("", !0),
-        P(M(Dt), {
+        }, 8, ["tabindex", "aria-checked"])) : K("", !0),
+        Te.value ? (d(), _("hr", Ft)) : K("", !0),
+        P(R(Ut), {
           ref_key: "listboxItemsRef",
           ref: n,
-          items: v.items,
-          "is-option-disabled": v.isOptionDisabled,
-          "is-multi-level": M(o),
-          "static-categories": v.staticCategories,
-          searching: v.searching,
+          items: f.items,
+          "is-option-disabled": f.isOptionDisabled,
+          "is-multi-level": R(o),
+          "static-categories": f.staticCategories,
+          searching: f.searching,
           "selected-items-list": a.value,
-          "focused-index": M(_e),
-          onToggleCheckboxSelection: y[0] || (y[0] = (d) => de("select", d)),
-          onSelectCategory: x,
-          onUnselectCategory: le,
-          onSpacePressed: y[1] || (y[1] = (d) => de(M(u).SPACE, d)),
-          onTabPressed: y[2] || (y[2] = (d) => de(M(u).TAB, d)),
-          onEnterPressed: y[3] || (y[3] = (d) => de(M(u).ENTER, d))
+          "focused-index": R(Ae),
+          onToggleCheckboxSelection: y[0] || (y[0] = (u) => de("select", u)),
+          onSelectCategory: ce,
+          onUnselectCategory: Oe,
+          onSpacePressed: y[1] || (y[1] = (u) => de(R(b).SPACE, u)),
+          onTabPressed: y[2] || (y[2] = (u) => de(R(b).TAB, u)),
+          onEnterPressed: y[3] || (y[3] = (u) => de(R(b).ENTER, u))
         }, me({ _: 2 }, [
-          q(M(l), (d, O) => ({
+          V(R(l), (u, O) => ({
             name: O,
-            fn: L((E) => [
-              Y(v.$slots, O, ne(be(E)), void 0, !0)
+            fn: T((E) => [
+              q(f.$slots, O, ne(be(E)), void 0, !0)
             ])
           }))
         ]), 1032, ["items", "is-option-disabled", "is-multi-level", "static-categories", "searching", "selected-items-list", "focused-index"])
       ], 16)), [
-        [M(ve)]
+        [R(pe)]
       ])
     ], 512));
   }
-}), Ie = /* @__PURE__ */ X(xt, [["__scopeId", "data-v-36c6ac8d"]]), $e = {
+}), $e = /* @__PURE__ */ X(Kt, [["__scopeId", "data-v-1997b63d"]]), De = {
   "en-US": {
     loading: "Loading",
     showMore: "Show more"
@@ -1137,18 +1169,18 @@ const Dt = /* @__PURE__ */ X($t, [["render", Bt], ["__scopeId", "data-v-c9ae45d6
     loading: "Carregando",
     showMore: "Mostrar mais"
   }
-}, Ut = 36, Gt = Q({
+}, Wt = 36, qt = Z({
   name: "bento-listbox",
   components: {
-    BentoEmptyState: Ze,
-    BentoListboxSingleSelect: Ot,
-    BentoListboxMultiSelect: Ie,
+    BentoEmptyState: et,
+    BentoListboxSingleSelect: At,
+    BentoListboxMultiSelect: $e,
     BentoTypography: re,
-    BentoLoadingIndicator: Je,
-    BentoLoadingButton: lt
+    BentoLoadingIndicator: Qe,
+    BentoLoadingButton: at
   },
-  directives: { BentoKeyboardNavigationDirective: ve },
-  i18n: { messages: $e },
+  directives: { BentoKeyboardNavigationDirective: pe },
+  i18n: { messages: De },
   props: {
     /**
      * Defines a string value that labels an interactive element.
@@ -1229,7 +1261,7 @@ const Dt = /* @__PURE__ */ X($t, [["render", Bt], ["__scopeId", "data-v-c9ae45d6
      *
      * If enabled, hides the "Select all" checkbox in "multiple" mode.
      */
-    searching: Ie.props.searching,
+    searching: $e.props.searching,
     /**
      * The `input` value.
      * Providing an empty string or empty array will select no options.
@@ -1249,106 +1281,106 @@ const Dt = /* @__PURE__ */ X($t, [["render", Bt], ["__scopeId", "data-v-c9ae45d6
     }
   },
   emits: [
-    u.SELECT,
-    u.SPACE,
-    u.SHOW_MORE,
-    u.ENTER,
-    u.ESCAPE,
-    u.TAB
+    b.SELECT,
+    b.SPACE,
+    b.SHOW_MORE,
+    b.ENTER,
+    b.ESCAPE,
+    b.TAB
   ],
   setup(e, { emit: s, slots: t }) {
-    const c = k([]), i = ee(e, "items"), { t: l } = he({ messages: $e }), r = g(() => e.lazyLoadType !== oe.AUTOMATIC), m = g(() => e.lazyLoadType === oe.AUTOMATIC), C = () => {
-      var x;
-      return typeof (e == null ? void 0 : e.virtualScroll) == "object" && ((x = e == null ? void 0 : e.virtualScroll) != null && x.itemHeight) ? e.virtualScroll.itemHeight : Ut;
+    const c = B([]), i = te(e, "items"), { t: l } = Ee({ messages: De }), r = m(() => e.lazyLoadType !== oe.AUTOMATIC), v = m(() => e.lazyLoadType === oe.AUTOMATIC), h = () => {
+      var M;
+      return typeof (e == null ? void 0 : e.virtualScroll) == "object" && ((M = e == null ? void 0 : e.virtualScroll) != null && M.itemHeight) ? e.virtualScroll.itemHeight : Wt;
     }, {
       containerRef: n,
       containerProps: a,
       onScroll: o,
-      list: h,
-      wrapperProps: p
-    } = nt(i, {
-      itemHeight: C(),
+      list: C,
+      wrapperProps: g
+    } = ct(i, {
+      itemHeight: h(),
       // Disable virtual scrolling if not enabled or if lazy loading is enabled or if multi-select
       disabled: (e == null ? void 0 : e.multiple) || (e == null ? void 0 : e.virtualScroll) === !1 || (e == null ? void 0 : e.lazyLoadType) !== "none"
-    }), f = g(
+    }), p = m(
       () => e.componentLoading !== void 0 || r.value ? "true" : void 0
-    ), A = g(
+    ), k = m(
       () => r.value && e.loading || e.componentLoading ? "true" : "false"
-    ), w = g(
+    ), w = m(
       () => r.value || e.componentLoading !== void 0 ? "polite" : void 0
-    ), S = (x) => (le) => {
-      s(x, le);
-    }, $ = () => {
-      s(u.SHOW_MORE);
-    }, D = Qe(() => {
-      const x = n.value;
-      if (!x)
+    ), S = (M) => (ce) => {
+      s(M, ce);
+    }, A = () => {
+      s(b.SHOW_MORE);
+    }, N = tt(() => {
+      const M = n.value;
+      if (!M)
         return;
-      const le = Math.round(x.scrollTop) + x.clientHeight >= x.scrollHeight;
-      e.hasMoreItems && le && !e.loading && $();
-    }), R = () => {
-      m.value ? D() : o();
-    }, N = g(() => {
-      var x;
-      return ((x = e.items) == null ? void 0 : x.length) === 0;
-    }), _ = g(
+      const ce = Math.round(M.scrollTop) + M.clientHeight >= M.scrollHeight;
+      e.hasMoreItems && ce && !e.loading && A();
+    }), x = () => {
+      v.value ? N() : o();
+    }, D = m(() => {
+      var M;
+      return ((M = e.items) == null ? void 0 : M.length) === 0;
+    }), G = m(
       () => e.lazyLoadType === oe.BUTTON && e.hasMoreItems
-    ), W = g(
+    ), I = m(
       () => e.loading ? Le.LOADING : Le.START
-    ), K = g(() => e.loading ? l("loading") : l("showMore")), V = g(() => ({
+    ), H = m(() => e.loading ? l("loading") : l("showMore")), j = m(() => ({
       ...e.emptyState,
       variant: "condensed"
-    })), ce = {
-      [u.SELECT]: S(u.SELECT),
-      [u.SPACE]: S(u.SPACE),
-      [u.TAB]: S(u.TAB),
-      [u.ENTER]: S(u.ENTER)
+    })), J = {
+      [b.SELECT]: S(b.SELECT),
+      [b.SPACE]: S(b.SPACE),
+      [b.TAB]: S(b.TAB),
+      [b.ENTER]: S(b.ENTER)
     };
     return {
       // Refs
       listboxRef: n,
       listboxItemRef: c,
       // a11y
-      ariaAtomic: f,
-      ariaBusy: A,
+      ariaAtomic: p,
+      ariaBusy: k,
       ariaLive: w,
       // Values
       containerProps: a,
-      isSearchResultEmpty: N,
-      limitedEmptyStateProps: V,
-      loadingButtonState: W,
+      isSearchResultEmpty: D,
+      limitedEmptyStateProps: j,
+      loadingButtonState: I,
       slots: t,
-      shouldDisplayShowMoreButton: _,
-      showMoreButtonText: K,
-      virtualisedItems: h,
-      wrapperProps: p,
+      shouldDisplayShowMoreButton: G,
+      showMoreButtonText: H,
+      virtualisedItems: C,
+      wrapperProps: g,
       // Enums
-      BentoKeyboardNavigationKeyDownEvent: G,
-      BentoListboxEvent: u,
+      BentoKeyboardNavigationKeyDownEvent: z,
+      BentoListboxEvent: b,
       // Methods
-      onListboxContainerScroll: R,
+      onListboxContainerScroll: x,
       onOptionSelected: S,
-      emitShowMore: $,
-      listboxListeners: ce
+      emitShowMore: A,
+      listboxListeners: J
     };
   }
-}), zt = ["id", "aria-busy", "aria-atomic", "aria-label", "aria-live"], Ft = {
+}), Ht = ["id", "aria-busy", "aria-atomic", "aria-label", "aria-live"], jt = {
   key: 0,
   class: "b-listbox__loading-filtered-items"
-}, Yt = {
+}, Vt = {
   key: 1,
   class: "b-listbox__empty-search-message"
-}, Wt = {
+}, Xt = {
   key: 2,
   class: "b-listbox__lazy-load"
-}, Kt = {
+}, Jt = {
   key: 3,
   class: "b-listbox__lazy-load"
 };
-function qt(e, s, t, c, i, l) {
-  var p;
-  const r = I("bento-loading-indicator"), m = I("bento-empty-state"), C = I("bento-typography"), n = I("bento-listbox-multi-select"), a = I("bento-listbox-single-select"), o = I("bento-loading-button"), h = Re("bento-keyboard-navigation-directive");
-  return ae((b(), T("div", {
+function Zt(e, s, t, c, i, l) {
+  var g;
+  const r = L("bento-loading-indicator"), v = L("bento-empty-state"), h = L("bento-typography"), n = L("bento-listbox-multi-select"), a = L("bento-listbox-single-select"), o = L("bento-loading-button"), C = Re("bento-keyboard-navigation-directive");
+  return ae((d(), _("div", {
     id: e.id,
     ref: "listboxRef",
     class: "b-listbox",
@@ -1358,24 +1390,24 @@ function qt(e, s, t, c, i, l) {
     "aria-atomic": e.ariaAtomic,
     "aria-label": e.ariaLabel,
     "aria-live": e.ariaLive,
-    style: Xe((p = e.containerProps) == null ? void 0 : p.style),
-    onScroll: s[0] || (s[0] = (...f) => e.onListboxContainerScroll && e.onListboxContainerScroll(...f))
+    style: Ze((g = e.containerProps) == null ? void 0 : g.style),
+    onScroll: s[0] || (s[0] = (...p) => e.onListboxContainerScroll && e.onListboxContainerScroll(...p))
   }, [
-    H("div", ne(be(e.wrapperProps)), [
-      e.componentLoading ? (b(), T("div", Ft, [
+    W("div", ne(be(e.wrapperProps)), [
+      e.componentLoading ? (d(), _("div", jt, [
         P(r)
-      ])) : e.isSearchResultEmpty ? (b(), T("div", Yt, [
-        e.emptyState ? (b(), B(m, ne(U({ key: 0 }, e.limitedEmptyStateProps)), null, 16)) : (b(), B(C, {
+      ])) : e.isSearchResultEmpty ? (d(), _("div", Vt, [
+        e.emptyState ? (d(), $(v, ne(U({ key: 0 }, e.limitedEmptyStateProps)), null, 16)) : (d(), $(h, {
           key: 1,
           el: "span"
         }, {
-          default: L(() => [
-            F(z(e.noResultsMessage), 1)
+          default: T(() => [
+            Y(F(e.noResultsMessage), 1)
           ]),
           _: 1
         }))
-      ])) : (b(), T(se, { key: 2 }, [
-        e.multiple ? (b(), B(n, U({
+      ])) : (d(), _(le, { key: 2 }, [
+        e.multiple ? (d(), $(n, U({
           key: 0,
           ref: "listboxItemRef",
           "has-more-items": e.hasMoreItems,
@@ -1385,49 +1417,49 @@ function qt(e, s, t, c, i, l) {
           "selected-values": e.selectedValue,
           searching: e.searching,
           "is-option-disabled": e.isOptionDisabled
-        }, te(e.listboxListeners)), me({ _: 2 }, [
-          q(e.slots, (f, A) => ({
-            name: A,
-            fn: L((w) => [
-              Y(e.$slots, A, ne(be(w)), void 0, !0)
+        }, se(e.listboxListeners)), me({ _: 2 }, [
+          V(e.slots, (p, k) => ({
+            name: k,
+            fn: T((w) => [
+              q(e.$slots, k, ne(be(w)), void 0, !0)
             ])
           }))
-        ]), 1040, ["has-more-items", "items", "lazy-load-type", "static-categories", "selected-values", "searching", "is-option-disabled"])) : (b(), B(a, U({
+        ]), 1040, ["has-more-items", "items", "lazy-load-type", "static-categories", "selected-values", "searching", "is-option-disabled"])) : (d(), $(a, U({
           key: 1,
           ref: "listboxItemRef",
           items: e.virtualisedItems,
           "selected-value": e.selectedValue,
           "static-categories": e.staticCategories,
           "is-option-disabled": e.isOptionDisabled
-        }, te(e.listboxListeners)), me({ _: 2 }, [
-          q(e.slots, (f, A) => ({
-            name: A,
-            fn: L((w) => [
-              Y(e.$slots, A, ne(be(w)), void 0, !0)
+        }, se(e.listboxListeners)), me({ _: 2 }, [
+          V(e.slots, (p, k) => ({
+            name: k,
+            fn: T((w) => [
+              q(e.$slots, k, ne(be(w)), void 0, !0)
             ])
           }))
         ]), 1040, ["items", "selected-value", "static-categories", "is-option-disabled"])),
-        e.shouldDisplayShowMoreButton ? (b(), T("div", Wt, [
+        e.shouldDisplayShowMoreButton ? (d(), _("div", Xt, [
           P(o, {
             state: e.loadingButtonState,
             variant: "secondary",
             onClickCapture: e.emitShowMore
           }, {
-            default: L(() => [
-              F(z(e.showMoreButtonText), 1)
+            default: T(() => [
+              Y(F(e.showMoreButtonText), 1)
             ]),
             _: 1
           }, 8, ["state", "onClickCapture"])
-        ])) : e.loading ? (b(), T("div", Kt, [
+        ])) : e.loading ? (d(), _("div", Jt, [
           P(r)
-        ])) : j("", !0)
+        ])) : K("", !0)
       ], 64))
     ], 16)
-  ], 44, zt)), [
-    [h]
+  ], 44, Ht)), [
+    [C]
   ]);
 }
-const cs = /* @__PURE__ */ X(Gt, [["render", qt], ["__scopeId", "data-v-7b74fe4e"]]), Ce = (e, s) => {
+const gs = /* @__PURE__ */ X(qt, [["render", Zt], ["__scopeId", "data-v-7b74fe4e"]]), Ce = (e, s) => {
   for (const t of e) {
     if (t.value === s)
       return t;
@@ -1438,18 +1470,18 @@ const cs = /* @__PURE__ */ X(Gt, [["render", qt], ["__scopeId", "data-v-7b74fe4e
     }
   }
   return null;
-}, jt = (e) => typeof e == "object" && e !== null && "value" in e && "label" in e, ds = (e, s, t, c) => {
-  const i = k([]), l = k(), r = (a) => {
+}, Qt = (e) => typeof e == "object" && e !== null && "value" in e && "label" in e, ys = (e, s, t, c) => {
+  const i = B([]), l = B(), r = (a) => {
     t.value ? l.value = a.map(({ value: o }) => o) : l.value = a.length > 0 ? a[0].value : null;
-  }, m = (a) => {
-    t.value ? l.value = a.map(({ value: o, label: h }) => ({ value: o, label: h })) : l.value = a.length > 0 ? { value: a[0].value, label: a[0].label } : null;
-  }, C = (a) => {
-    i.value = a, c != null && c.value ? m(a) : r(a);
+  }, v = (a) => {
+    t.value ? l.value = a.map(({ value: o, label: C }) => ({ value: o, label: C })) : l.value = a.length > 0 ? { value: a[0].value, label: a[0].label } : null;
+  }, h = (a) => {
+    i.value = a, c != null && c.value ? v(a) : r(a);
   }, n = () => {
     i.value = [], l.value = null;
   };
-  return fe(
-    [() => e.value, () => s.value],
+  return ge(
+    () => s.value,
     () => {
       if (!s.value && s.value !== 0) {
         n();
@@ -1457,20 +1489,20 @@ const cs = /* @__PURE__ */ X(Gt, [["render", qt], ["__scopeId", "data-v-7b74fe4e
       }
       const a = !Array.isArray(s.value), o = [...i.value];
       n();
-      const h = (p) => {
-        if (jt(p))
-          i.value.push(p);
+      const C = (g) => {
+        if (Qt(g))
+          i.value.push(g);
         else {
-          let f = Ce(e.value, p);
-          f || (f = Ce(o, p)), f || (f = { value: p, label: p.toString() }), i.value.push(f);
+          let p = Ce(e.value, g);
+          p || (p = Ce(o, g)), p || (p = { value: g, label: g.toString() }), i.value.push(p);
         }
       };
       if (a) {
-        const p = s.value;
-        h(p), c != null && c.value ? m(i.value) : r(i.value);
+        const g = s.value;
+        C(g), c != null && c.value ? v(i.value) : r(i.value);
         return;
       }
-      s.value.forEach(h), c != null && c.value ? m(i.value) : r(i.value);
+      s.value.forEach(C), c != null && c.value ? v(i.value) : r(i.value);
     },
     { immediate: !0 }
   ), {
@@ -1479,14 +1511,14 @@ const cs = /* @__PURE__ */ X(Gt, [["render", qt], ["__scopeId", "data-v-7b74fe4e
     cachedListboxSelectedValues: l,
     // Methods
     resetCache: n,
-    setCachedValues: C
+    setCachedValues: h
   };
 };
 export {
   oe as B,
-  u as a,
-  cs as b,
-  ds as c,
-  Pt as u
+  b as a,
+  gs as b,
+  ys as c,
+  Gt as u
 };
-//# sourceMappingURL=use-cached-selected-values.CUi4XfMa.js.map
+//# sourceMappingURL=use-cached-selected-values.swt0cdsA.js.map