@adyen/bento-vue3 1.67.0 → 1.68.1

package/dist/chunks/{use-cached-selected-values.D7dOPJSO.js → use-cached-selected-values.Dyoz6cUK.js}

@@ -1,118 +1,119 @@
-import { computed as m, ref as $, onMounted as rt, onUnmounted as ct, watch as pe, defineComponent as J, resolveComponent as D, createElementBlock as O, openBlock as v, createVNode as x, createElementVNode as U, withCtx as A, createTextVNode as F, toDisplayString as z, renderSlot as K, mergeProps as Y, withKeys as ue, createCommentVNode as X, createBlock as N, withModifiers as ne, normalizeProps as ie, guardReactiveProps as be, withDirectives as ae, vShow as Ge, nextTick as we, toRef as me, resolveDirective as Ye, toHandlers as te, Fragment as se, renderList as j, createSlots as ve, normalizeClass as fe, unref as M, useSlots as dt, useAttrs as ut } from "vue";
-import { B as V, a as he } from "./keyboard-navigation.CqgGzfZQ.js";
+import { computed as m, ref as k, onMounted as ct, onUnmounted as dt, watch as ye, defineComponent as Z, resolveComponent as L, createElementBlock as O, openBlock as v, createVNode as G, createElementVNode as z, withCtx as A, createTextVNode as K, toDisplayString as V, renderSlot as j, mergeProps as Y, withKeys as me, createCommentVNode as J, createBlock as R, withModifiers as re, normalizeProps as ae, guardReactiveProps as ve, withDirectives as ce, vShow as we, nextTick as Ye, toRef as fe, resolveDirective as Ue, toHandlers as se, Fragment as le, renderList as q, createSlots as pe, normalizeClass as ge, unref as x, useSlots as ut, useAttrs as bt } from "vue";
+import { B as F, a as Ce } from "./keyboard-navigation.CqgGzfZQ.js";
 import "./events.FNmSWp_P.js";
-import { B as re } from "./typography.DN5eC5ch.js";
-import { B as bt } from "./loading-indicator.DEepb9Wl.js";
-import { B as mt } from "./empty-state.D7llINgF.js";
+import { B as de } from "./typography.DN5eC5ch.js";
+import { B as mt } from "./loading-indicator.DEepb9Wl.js";
+import { B as vt } from "./empty-state.D7llINgF.js";
 import { u as Ie } from "./i18n.B6g5VX0q.js";
-import { d as vt } from "./debounce.DUTu11PS.js";
-import { B as ft } from "./chip.CneNX2_j.js";
-import { _ as q } from "./_plugin-vue_export-helper.CHgC5LLL.js";
-import { C as Se, N as pt } from "./minus-small.DYIyF5XW.js";
-import { C as gt } from "./checkmark-small.x-gmK2Dt.js";
-import { C as yt } from "./chevron-down.DCQ6ZLaq.js";
-import { C as St } from "./chevron-up.kfuLRpZb.js";
-import { d as ht, e as Ne } from "./button-actions.BwpznQ6c.js";
+import { d as ft } from "./debounce.DUTu11PS.js";
+import { B as pt } from "./chip.CneNX2_j.js";
+import { _ as H } from "./_plugin-vue_export-helper.CHgC5LLL.js";
+import { C as he, N as gt } from "./minus-small.DYIyF5XW.js";
+import { C as yt } from "./checkmark-small.x-gmK2Dt.js";
+import { C as St } from "./chevron-down.DCQ6ZLaq.js";
+import { C as ht } from "./chevron-up.kfuLRpZb.js";
+import { g as Ne } from "./generate-uid.NJ8tVoha.js";
+import { d as Ct, e as Pe } from "./button-actions.CZdO9YOk.js";
 /* empty css              */
-import { o as Ct } from "./resize.Bqks3WUm.js";
+import { o as Et } from "./resize.Bqks3WUm.js";
 import "../assets/use-cached-selected-values.css";
-const Ue = (e, t, i, s) => {
-  const n = m(
+const ze = (e, t, i, s) => {
+  const r = m(
     () => {
-      var p, S;
-      return !!((p = e.value) != null && p.length) && ((S = e.value) == null ? void 0 : S.length) === t.value.length;
+      var p, y;
+      return !!((p = e.value) != null && p.length) && ((y = e.value) == null ? void 0 : y.length) === t.value.length;
     }
   ), o = m(() => {
     var p;
     return e.value == null || e.value.length === 0 ? !1 : ((p = e.value) == null ? void 0 : p.length) !== t.value.length;
   });
   return {
-    isAllSelected: n,
+    isAllSelected: r,
     isIndeterminate: o,
     toggleSelectAll: (p) => {
       p ? i() : s();
     }
   };
 };
-function Et(e, { disabled: t, itemHeight: i, overscan: s = 5, prefixHeight: n }) {
-  const o = $(null), a = $([]), p = $(0), S = $(0), r = $(0);
+function Ot(e, { disabled: t, itemHeight: i, overscan: s = 5, prefixHeight: r }) {
+  const o = k(null), n = k([]), p = k(0), y = k(0), a = k(0);
   let u;
   const l = m(() => {
-    const B = typeof i == "number" ? e.value.length * i : e.value.reduce((k, y, _) => k + i(_), 0), G = typeof i == "number" ? p.value * i : e.value.slice(0, p.value).reduce((k, y, _) => k + i(_), 0);
+    const D = typeof i == "number" ? e.value.length * i : e.value.reduce((I, S, _) => I + i(_), 0), B = typeof i == "number" ? p.value * i : e.value.slice(0, p.value).reduce((I, S, _) => I + i(_), 0);
     return {
       style: {
-        marginTop: `${G}px`,
-        height: `${B - G}px`
+        marginTop: `${B}px`,
+        height: `${D - B}px`
       }
     };
   }), f = () => {
-    const B = (n == null ? void 0 : n.value) ?? 0, G = Math.max(o.value.scrollTop - B, 0);
+    const D = (r == null ? void 0 : r.value) ?? 0, B = Math.max(o.value.scrollTop - D, 0);
     if (typeof i == "number")
-      return Math.floor(G / i);
-    let k = 0, y = 0;
+      return Math.floor(B / i);
+    let I = 0, S = 0;
     for (let _ = 0; _ < e.value.length; _ += 1) {
-      const I = i(_);
-      if (k += I, k >= G) {
-        y = _;
+      const w = i(_);
+      if (I += w, I >= B) {
+        S = _;
         break;
       }
     }
-    return y;
+    return S;
   }, E = () => {
-    if (r.value = o.value.clientHeight, typeof i == "number")
-      return Math.ceil(r.value / i);
-    const B = p.value ?? 0;
-    let G = 0, k = 0;
-    for (let y = B; y < e.value.length; y += 1) {
-      const _ = i(y);
-      if (G += _, k = y, G > r.value)
+    if (a.value = o.value.clientHeight, typeof i == "number")
+      return Math.ceil(a.value / i);
+    const D = p.value ?? 0;
+    let B = 0, I = 0;
+    for (let S = D; S < e.value.length; S += 1) {
+      const _ = i(S);
+      if (B += _, I = S, B > a.value)
         break;
     }
-    return k - B;
+    return I - D;
   }, T = () => {
     if (o.value) {
-      const B = E();
-      p.value = f(), S.value = Math.min(p.value + B + s, e.value.length), a.value = e.value.slice(p.value, S.value);
+      const D = E();
+      p.value = f(), y.value = Math.min(p.value + D + s, e.value.length), n.value = e.value.slice(p.value, y.value);
     }
-  }, R = () => {
+  }, $ = () => {
     T();
   };
-  t || (rt(() => {
-    o.value && (r.value = o.value.clientHeight, u = Ct(o.value, ({ clientHeight: B }) => {
-      r.value = B, T();
+  t || (ct(() => {
+    o.value && (a.value = o.value.clientHeight, u = Et(o.value, ({ clientHeight: D }) => {
+      a.value = D, T();
     }), T());
-  }), ct(() => {
+  }), dt(() => {
     u == null || u.disconnect();
-  }), pe(
+  }), ye(
     () => e.value,
     () => {
       T();
     }
   ));
-  const L = {
+  const P = {
     ref: o,
     style: { overflowY: "auto" }
   };
   return t ? {
     containerRef: o,
-    containerProps: L,
+    containerProps: P,
     // eslint-disable-next-line @typescript-eslint/no-empty-function
     onScroll: () => {
     },
     list: e
   } : {
     containerRef: o,
-    containerProps: L,
-    onScroll: R,
-    list: a,
+    containerProps: P,
+    onScroll: $,
+    list: n,
     wrapperProps: l
   };
 }
-var g = /* @__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))(g || {}), oe = /* @__PURE__ */ ((e) => (e.AUTOMATIC = "automatic", e.BUTTON = "button", e.NONE = "none", e))(oe || {});
-const Ot = J({
+var g = /* @__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))(g || {}), ne = /* @__PURE__ */ ((e) => (e.AUTOMATIC = "automatic", e.BUTTON = "button", e.NONE = "none", e))(ne || {});
+const Tt = Z({
   name: "bento-listbox-static-category",
   components: {
-    BentoTypography: re
+    BentoTypography: de
   },
   props: {
     /**
@@ -123,26 +124,31 @@ const Ot = J({
       required: !0
     }
   }
-}), Tt = { class: "b-listbox-single-select-category" };
-function _t(e, t, i, s, n, o) {
-  const a = D("bento-typography");
-  return v(), O("div", Tt, [
-    x(a, {
+}), _t = ["aria-label"];
+function It(e, t, i, s, r, o) {
+  const n = L("bento-typography");
+  return v(), O("div", {
+    class: "b-listbox-single-select-category",
+    role: "group",
+    "aria-label": e.categoryLabel
+  }, [
+    G(n, {
       variant: "caption",
       el: "span",
-      class: "b-listbox-single-select-category__label-text"
+      class: "b-listbox-single-select-category__label-text",
+      "aria-hidden": "true"
     }, {
       default: A(() => [
-        F(z(e.categoryLabel), 1)
+        K(V(e.categoryLabel), 1)
       ]),
       _: 1
     }),
-    U("div", null, [
-      K(e.$slots, "default", {}, void 0, !0)
+    z("div", null, [
+      j(e.$slots, "default", {}, void 0, !0)
     ])
-  ]);
+  ], 8, _t);
 }
-const It = /* @__PURE__ */ q(Ot, [["render", _t], ["__scopeId", "data-v-a90eff17"]]), At = J({
+const At = /* @__PURE__ */ H(Tt, [["render", It], ["__scopeId", "data-v-27c4e09a"]]), kt = Z({
   name: "bento-listbox-option",
   props: {
     /**
@@ -162,7 +168,7 @@ const It = /* @__PURE__ */ q(Ot, [["render", _t], ["__scopeId", "data-v-a90eff17
     }));
     return {
       // Enums
-      BentoKeyboardNavigationKeyDownEvent: V,
+      BentoKeyboardNavigationKeyDownEvent: F,
       BentoListboxEvent: g,
       // Values
       conditionalClasses: i,
@@ -170,35 +176,35 @@ const It = /* @__PURE__ */ q(Ot, [["render", _t], ["__scopeId", "data-v-a90eff17
       onClick: (o) => {
         t(g.CLICK, o);
       },
-      onOptionSelected: (o, a) => {
-        t(o, a);
+      onOptionSelected: (o, n) => {
+        t(o, n);
       }
     };
   }
 });
-function kt(e, t, i, s, n, o) {
+function Lt(e, t, i, s, r, o) {
   return v(), O("div", Y({
     class: ["b-listbox-option", e.conditionalClasses],
     role: "option"
   }, e.$attrs, {
-    onClick: t[0] || (t[0] = (...a) => e.onClick && e.onClick(...a)),
+    onClick: t[0] || (t[0] = (...n) => e.onClick && e.onClick(...n)),
     onKeydown: [
-      t[1] || (t[1] = ue((a) => e.onOptionSelected(e.BentoListboxEvent.ENTER, a), ["enter"])),
-      t[2] || (t[2] = ue((a) => e.onOptionSelected(e.BentoListboxEvent.SPACE, a), ["space"])),
-      t[3] || (t[3] = ue((a) => e.onOptionSelected(e.BentoListboxEvent.TAB, a), ["tab"]))
+      t[1] || (t[1] = me((n) => e.onOptionSelected(e.BentoListboxEvent.ENTER, n), ["enter"])),
+      t[2] || (t[2] = me((n) => e.onOptionSelected(e.BentoListboxEvent.SPACE, n), ["space"])),
+      t[3] || (t[3] = me((n) => e.onOptionSelected(e.BentoListboxEvent.TAB, n), ["tab"]))
     ]
   }), [
-    K(e.$slots, "default", {}, void 0, !0)
+    j(e.$slots, "default", {}, void 0, !0)
   ], 16);
 }
-const Ce = /* @__PURE__ */ q(At, [["render", kt], ["__scopeId", "data-v-b7af43a6"]]);
-let Pe = 0;
-const Lt = {
+const Ee = /* @__PURE__ */ H(kt, [["render", Lt], ["__scopeId", "data-v-b7af43a6"]]);
+let Me = 0;
+const $t = {
   beforeCreate() {
-    this.uuid = Pe.toString(), Pe += 1;
+    this.uuid = Me.toString(), Me += 1;
   }
-}, $t = { key: 0 };
-function Dt(e, t, i, s, n, o) {
+}, Dt = { key: 0 };
+function Bt(e, t, i, s, r, o) {
   return v(), O("svg", Y({ role: "img" }, e.$attrs, {
     class: "ui-assets-icons-16",
     xmlns: "http://www.w3.org/2000/svg",
@@ -206,19 +212,19 @@ function Dt(e, t, i, s, n, o) {
     height: "16",
     fill: "none"
   }), [
-    e.$attrs["svg-title"] ? (v(), O("title", $t, z(e.$attrs["svg-title"]), 1)) : X("", !0),
-    t[0] || (t[0] = U("path", {
+    e.$attrs["svg-title"] ? (v(), O("title", Dt, V(e.$attrs["svg-title"]), 1)) : J("", !0),
+    t[0] || (t[0] = z("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 Bt = /* @__PURE__ */ q(Lt, [["render", Dt]]), Rt = J({
+const Rt = /* @__PURE__ */ H($t, [["render", Bt]]), Nt = Z({
   name: "bento-listbox-single-select-option",
   components: {
-    BentoListboxOption: Ce,
-    BentoTypography: re,
-    CheckmarkIcon: Bt
+    BentoListboxOption: Ee,
+    BentoTypography: de,
+    CheckmarkIcon: Rt
   },
   props: {
     /**
@@ -240,13 +246,13 @@ const Bt = /* @__PURE__ */ q(Lt, [["render", Dt]]), Rt = J({
   },
   emits: [g.ENTER, g.SELECT, g.SPACE, g.TAB],
   setup(e, { emit: t }) {
-    const i = (a) => {
-      e.disabled || t(a, e.option);
-    }, s = m(() => e.disabled ? !0 : null), n = m(() => e.selected ? !0 : null), o = m(() => e.disabled ? -1 : 0);
+    const i = (n) => {
+      e.disabled || t(n, e.option);
+    }, s = m(() => e.disabled ? !0 : null), r = m(() => e.selected ? !0 : null), o = m(() => e.disabled ? -1 : 0);
     return {
       // Values
       ariaDisabled: s,
-      ariaSelected: n,
+      ariaSelected: r,
       tabIndex: o,
       // Enums
       BentoListboxEvent: g,
@@ -254,53 +260,53 @@ const Bt = /* @__PURE__ */ q(Lt, [["render", Dt]]), Rt = J({
       onOptionSelected: i
     };
   }
-}), Nt = { class: "b-listbox-single-select-option__text" }, Pt = { class: "b-listbox-single-select-option__check-icon" };
-function Mt(e, t, i, s, n, o) {
-  const a = D("bento-typography"), p = D("checkmark-icon"), S = D("bento-listbox-option");
-  return v(), N(S, {
+}), Pt = { class: "b-listbox-single-select-option__text" }, Mt = { class: "b-listbox-single-select-option__check-icon" };
+function xt(e, t, i, s, r, o) {
+  const n = L("bento-typography"), p = L("checkmark-icon"), y = L("bento-listbox-option");
+  return v(), R(y, {
     class: "b-listbox-single-select-option",
     disabled: e.disabled,
     selected: e.selected,
     "aria-selected": e.ariaSelected,
     "aria-disabled": e.ariaDisabled,
     tabindex: e.tabIndex,
-    onClick: t[0] || (t[0] = (r) => e.onOptionSelected(e.BentoListboxEvent.SELECT)),
-    onEnterPressed: t[1] || (t[1] = (r) => e.onOptionSelected(e.BentoListboxEvent.ENTER)),
-    onSpacePressed: t[2] || (t[2] = ne((r) => e.onOptionSelected(e.BentoListboxEvent.SPACE), ["prevent"])),
-    onTabPressed: t[3] || (t[3] = (r) => e.onOptionSelected(e.BentoListboxEvent.TAB))
+    onClick: t[0] || (t[0] = (a) => e.onOptionSelected(e.BentoListboxEvent.SELECT)),
+    onEnterPressed: t[1] || (t[1] = (a) => e.onOptionSelected(e.BentoListboxEvent.ENTER)),
+    onSpacePressed: t[2] || (t[2] = re((a) => e.onOptionSelected(e.BentoListboxEvent.SPACE), ["prevent"])),
+    onTabPressed: t[3] || (t[3] = (a) => e.onOptionSelected(e.BentoListboxEvent.TAB))
   }, {
     default: A(() => [
-      K(e.$slots, "default", ie(be(e.option)), () => [
-        U("span", Nt, [
-          x(a, { el: "span" }, {
+      j(e.$slots, "default", ae(ve(e.option)), () => [
+        z("span", Pt, [
+          G(n, { el: "span" }, {
             default: A(() => [
-              F(z(e.option.label), 1)
+              K(V(e.option.label), 1)
             ]),
             _: 1
           }),
-          e.option.description ? (v(), N(a, {
+          e.option.description ? (v(), R(n, {
             key: 0,
             class: "b-listbox-single-select-option__description",
             el: "span"
           }, {
             default: A(() => [
-              F(z(e.option.description), 1)
+              K(V(e.option.description), 1)
             ]),
             _: 1
-          })) : X("", !0)
+          })) : J("", !0)
         ])
       ], !0),
-      U("span", Pt, [
-        ae(x(p, { "svg-title": "selected" }, null, 512), [
-          [Ge, e.selected]
+      z("span", Mt, [
+        ce(G(p, { "svg-title": "selected" }, null, 512), [
+          [we, e.selected]
         ])
       ])
     ]),
     _: 3
   }, 8, ["disabled", "selected", "aria-selected", "aria-disabled", "tabindex"]);
 }
-const xt = /* @__PURE__ */ q(Rt, [["render", Mt], ["__scopeId", "data-v-226f4c84"]]), ze = ({ items: e }, t) => {
-  const i = m(() => e.value.length - 1), s = $(0), n = (f) => {
+const Gt = /* @__PURE__ */ H(Nt, [["render", xt], ["__scopeId", "data-v-226f4c84"]]), Ve = ({ items: e }, t) => {
+  const i = m(() => e.value.length - 1), s = k(0), r = (f) => {
     switch (f) {
       case "increase":
         s.value += 1;
@@ -310,8 +316,8 @@ const xt = /* @__PURE__ */ q(Rt, [["render", Mt], ["__scopeId", "data-v-226f4c84
         break;
     }
   }, o = ({ edgeCaseItem: f }, E) => {
-    s.value !== f && (n(E), t(s.value));
-  }, a = (f) => {
+    s.value !== f && (r(E), t(s.value));
+  }, n = (f) => {
     l(f), o(
       {
         edgeCaseItem: i.value
@@ -327,9 +333,9 @@ const xt = /* @__PURE__ */ q(Rt, [["render", Mt], ["__scopeId", "data-v-226f4c84
       "decrease"
       /* DECREASE */
     );
-  }, S = () => {
+  }, y = () => {
     s.value = 0, t(s.value);
-  }, r = () => {
+  }, a = () => {
     s.value = i.value, t(s.value);
   }, u = (f) => {
     s.value = f;
@@ -338,40 +344,40 @@ const xt = /* @__PURE__ */ q(Rt, [["render", Mt], ["__scopeId", "data-v-226f4c84
     (E = f == null ? void 0 : f.detail) == null || E.preventDefault();
   };
   return {
-    moveToFirstElement: S,
-    moveToLastElement: r,
-    moveToNextElement: a,
+    moveToFirstElement: y,
+    moveToLastElement: a,
+    moveToNextElement: n,
     moveToPreviousElement: p,
     setListboxFocusedIndex: u,
     preventDefault: l,
     focusedIndex: s
   };
-}, Ve = (e, t, i = $("option"), s = !0) => {
-  const n = $([]), o = async () => {
+}, Fe = (e, t, i = k("option"), s = !0) => {
+  const r = k([]), o = async () => {
     if (!e.value || e.value.nodeType === Node.COMMENT_NODE)
       return;
-    const a = Array.from(e.value.querySelectorAll(`[role="${i.value}"]`));
-    n.value = s ? a.filter((p) => p.checkVisibility()) : a;
+    const n = Array.from(e.value.querySelectorAll(`[role="${i.value}"]`));
+    r.value = s ? n.filter((p) => p.checkVisibility()) : n;
   };
-  return pe(
+  return ye(
     t,
     () => {
-      we(() => {
+      Ye(() => {
         o();
       });
     },
     { immediate: !0 }
   ), {
-    visibleDomOptions: n,
+    visibleDomOptions: r,
     updateVisibleDomOptions: o
   };
-}, Gt = J({
+}, wt = Z({
   name: "bento-listbox-single-select",
   components: {
-    BentoListboxSingleSelectCategory: It,
-    BentoListboxSingleSelectOption: xt
+    BentoListboxSingleSelectCategory: At,
+    BentoListboxSingleSelectOption: Gt
   },
-  directives: { BentoKeyboardNavigationDirective: he },
+  directives: { BentoKeyboardNavigationDirective: Ce },
   inheritAttrs: !1,
   props: {
     /**
@@ -413,42 +419,42 @@ const xt = /* @__PURE__ */ q(Rt, [["render", Mt], ["__scopeId", "data-v-226f4c84
     staticCategories: { type: Boolean, default: !1 }
   },
   emits: [g.SELECT, g.ENTER, g.SPACE, g.TAB],
-  setup(e, { emit: t, expose: i, slots: s, attrs: n }) {
-    const o = $(null), a = $([]), p = m(() => {
-      var y;
-      return !!((y = e.selectedValue) != null && y.length) && e.selectedValue.at(0);
-    }), S = m(
+  setup(e, { emit: t, expose: i, slots: s, attrs: r }) {
+    const o = k(null), n = k([]), p = m(() => {
+      var S;
+      return !!((S = e.selectedValue) != null && S.length) && e.selectedValue.at(0);
+    }), y = m(
       () => {
-        var y, _, I, w;
+        var S, _, w, Q;
         return {
-          "aria-label": (y = n["aria-label"]) == null ? void 0 : y.toString(),
-          "aria-busy": (_ = n["aria-busy"]) == null ? void 0 : _.toString(),
-          "aria-atomic": (I = n["aria-atomic"]) == null ? void 0 : I.toString(),
-          "aria-live": (w = n["aria-live"]) == null ? void 0 : w.toString()
+          "aria-label": (S = r["aria-label"]) == null ? void 0 : S.toString(),
+          "aria-busy": (_ = r["aria-busy"]) == null ? void 0 : _.toString(),
+          "aria-atomic": (w = r["aria-atomic"]) == null ? void 0 : w.toString(),
+          "aria-live": (Q = r["aria-live"]) == null ? void 0 : Q.toString()
         };
       }
-    ), r = m(() => !!e.items.some(({ items: y }) => !!y)), u = (y) => (_) => {
-      t(y, [_]);
-    }, { visibleDomOptions: l } = Ve(o, me(e, "items"), $("option"), !1), f = (y) => {
+    ), a = m(() => !!e.items.some(({ items: S }) => !!S)), u = (S) => (_) => {
+      t(S, [_]);
+    }, { visibleDomOptions: l } = Fe(o, fe(e, "items"), k("option"), !1), f = (S) => {
       var _;
-      (_ = l.value[y]) == null || _.focus();
+      (_ = l.value[S]) == null || _.focus();
     }, {
       moveToNextElement: E,
       moveToPreviousElement: T,
-      moveToFirstElement: R,
-      moveToLastElement: L,
-      setListboxFocusedIndex: B
-    } = ze(
+      moveToFirstElement: $,
+      moveToLastElement: P,
+      setListboxFocusedIndex: D
+    } = Ve(
       {
         items: l
       },
       f
-    ), G = {
-      [V.ARROW_UP]: T,
-      [V.ARROW_DOWN]: E,
-      [V.HOME]: R,
-      [V.END]: L
-    }, k = {
+    ), B = {
+      [F.ARROW_UP]: T,
+      [F.ARROW_DOWN]: E,
+      [F.HOME]: $,
+      [F.END]: P
+    }, I = {
       [g.SELECT]: u(g.SELECT),
       [g.SPACE]: u(g.SPACE),
       [g.TAB]: u(g.TAB),
@@ -459,41 +465,40 @@ const xt = /* @__PURE__ */ q(Rt, [["render", Mt], ["__scopeId", "data-v-226f4c84
        * Reference for a single listbox item.
        * Required for keyboard navigation in dropdown as $children is removed in vue@3
        */
-      listboxItemRef: a,
+      listboxItemRef: n,
       /**
        * 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: B
+      setListboxFocusedIndex: D
     }), {
       // Enums
       BentoListboxEvent: g,
       // Values
       listboxRef: o,
-      listboxItemRef: a,
+      listboxItemRef: n,
       selectedItem: p,
       slots: s,
-      ariaAttributes: S,
+      ariaAttributes: y,
       // Computed
-      hasCategories: r,
+      hasCategories: a,
       // Methods
       onOptionSelected: u,
       // Keyboard navigation
-      listboxListeners: G,
-      listboxOptionListeners: k
+      listboxListeners: B,
+      listboxOptionListeners: I
     };
   }
 });
-function wt(e, t, i, s, n, o) {
-  const a = D("bento-listbox-single-select-option"), p = D("bento-listbox-single-select-category"), S = Ye("bento-keyboard-navigation-directive");
-  return ae((v(), O("div", Y({ ref: "listboxRef" }, e.ariaAttributes, { role: "listbox" }, te(e.listboxListeners, !0)), [
-    e.hasCategories && e.staticCategories ? (v(!0), O(se, { key: 0 }, j(e.items, (r) => (v(), N(p, {
-      key: r.value,
-      "category-label": r.label,
-      role: "group"
+function Yt(e, t, i, s, r, o) {
+  const n = L("bento-listbox-single-select-option"), p = L("bento-listbox-single-select-category"), y = Ue("bento-keyboard-navigation-directive");
+  return ce((v(), O("div", Y({ ref: "listboxRef" }, e.ariaAttributes, { role: "listbox" }, se(e.listboxListeners, !0)), [
+    e.hasCategories && e.staticCategories ? (v(!0), O(le, { key: 0 }, q(e.items, (a) => (v(), R(p, {
+      key: a.value,
+      "category-label": a.label
     }, {
       default: A(() => [
-        (v(!0), O(se, null, j(r.items, (u) => (v(), N(a, Y({
+        (v(!0), O(le, null, q(a.items, (u) => (v(), R(n, Y({
           key: u.value,
           ref_for: !0,
           ref: "listboxItemRef",
@@ -501,38 +506,38 @@ function wt(e, t, i, s, n, o) {
           option: u,
           disabled: e.isOptionDisabled ? e.isOptionDisabled(u) : null,
           selected: u.value === e.selectedItem.value
-        }, te(e.listboxOptionListeners)), ve({ _: 2 }, [
-          j(e.slots, (l, f) => ({
+        }, se(e.listboxOptionListeners)), pe({ _: 2 }, [
+          q(e.slots, (l, f) => ({
             name: f,
             fn: A((E) => [
-              K(e.$slots, f, Y({ ref_for: !0 }, E))
+              j(e.$slots, f, Y({ ref_for: !0 }, E))
             ])
           }))
         ]), 1040, ["option", "disabled", "selected"]))), 128))
       ]),
       _: 2
-    }, 1032, ["category-label"]))), 128)) : (v(!0), O(se, { key: 1 }, j(e.items, (r) => (v(), N(a, Y({
-      key: r.value,
+    }, 1032, ["category-label"]))), 128)) : (v(!0), O(le, { key: 1 }, q(e.items, (a) => (v(), R(n, Y({
+      key: a.value,
       ref_for: !0,
       ref: "listboxItemRef",
       role: "option",
-      option: r,
-      disabled: e.isOptionDisabled ? e.isOptionDisabled(r) : null,
-      selected: r.value === e.selectedItem.value
-    }, te(e.listboxOptionListeners)), ve({ _: 2 }, [
-      j(e.slots, (u, l) => ({
+      option: a,
+      disabled: e.isOptionDisabled ? e.isOptionDisabled(a) : null,
+      selected: a.value === e.selectedItem.value
+    }, se(e.listboxOptionListeners)), pe({ _: 2 }, [
+      q(e.slots, (u, l) => ({
         name: l,
         fn: A((f) => [
-          K(e.$slots, l, Y({ ref_for: !0 }, f))
+          j(e.$slots, l, Y({ ref_for: !0 }, f))
         ])
       }))
     ]), 1040, ["option", "disabled", "selected"]))), 128))
   ], 16)), [
-    [S]
+    [y]
   ]);
 }
-const Yt = /* @__PURE__ */ q(Gt, [["render", wt]]), Ut = {}, zt = /* @__PURE__ */ J({
-  ...Ut,
+const Ut = /* @__PURE__ */ H(wt, [["render", Yt]]), zt = {}, Vt = /* @__PURE__ */ Z({
+  ...zt,
   __name: "listbox-decorative-checkbox",
   props: {
     disabled: { type: Boolean, default: !1 },
@@ -541,47 +546,47 @@ const Yt = /* @__PURE__ */ q(Gt, [["render", wt]]), Ut = {}, zt = /* @__PURE__ *
   },
   setup(e) {
     const t = e, i = m(() => ({
-      [`b-checkbox-input--${Se.DISABLED}`]: t.disabled
+      [`b-checkbox-input--${he.DISABLED}`]: t.disabled
     })), s = m(() => ({
-      [`b-checkbox-input__outline--${Se.UNCHECKED}`]: !t.checked && !t.indeterminate,
-      [`b-checkbox-input__outline--${Se.CHECKED}`]: t.checked && !t.indeterminate,
-      [`b-checkbox-input__outline--${Se.INDETERMINATE}`]: t.indeterminate
+      [`b-checkbox-input__outline--${he.UNCHECKED}`]: !t.checked && !t.indeterminate,
+      [`b-checkbox-input__outline--${he.CHECKED}`]: t.checked && !t.indeterminate,
+      [`b-checkbox-input__outline--${he.INDETERMINATE}`]: t.indeterminate
     }));
-    return (n, o) => (v(), O("div", {
-      class: fe(["b-checkbox-input", i.value]),
+    return (r, o) => (v(), O("div", {
+      class: ge(["b-checkbox-input", i.value]),
       role: "presentation"
     }, [
-      n.indeterminate ? (v(), N(M(pt), {
+      r.indeterminate ? (v(), R(x(gt), {
         key: 0,
         class: "b-checkbox-input__icon",
         "svg-title": "",
         "aria-hidden": "true"
-      })) : n.checked ? (v(), N(M(gt), {
+      })) : r.checked ? (v(), R(x(yt), {
         key: 1,
         class: "b-checkbox-input__icon",
         "svg-title": "",
         "aria-hidden": "true"
-      })) : X("", !0),
-      U("div", {
-        class: fe(["b-checkbox-input__outline", s.value])
+      })) : J("", !0),
+      z("div", {
+        class: ge(["b-checkbox-input__outline", s.value])
       }, null, 2)
     ], 2));
   }
-}), Ae = /* @__PURE__ */ q(zt, [["__scopeId", "data-v-c604b68a"]]);
-var Fe = /* @__PURE__ */ ((e) => (e.DISABLED = "disabled", e.STATIC_CATEGORY = "static-category", e))(Fe || {}), ee = /* @__PURE__ */ ((e) => (e.SELECT_CATEGORY = "select-category", e.UNSELECT_CATEGORY = "unselect-category", e.TOGGLE_CATEGORY_VISIBILITY = "toggle-category-visibility", e))(ee || {});
-const Vt = {
+}), Ae = /* @__PURE__ */ H(Vt, [["__scopeId", "data-v-c604b68a"]]);
+var Ke = /* @__PURE__ */ ((e) => (e.DISABLED = "disabled", e.STATIC_CATEGORY = "static-category", e))(Ke || {}), te = /* @__PURE__ */ ((e) => (e.SELECT_CATEGORY = "select-category", e.UNSELECT_CATEGORY = "unselect-category", e.TOGGLE_CATEGORY_VISIBILITY = "toggle-category-visibility", e))(te || {});
+const Ft = {
   "en-US": {
     categoryClosed: "{category} closed",
     categoryOpened: "{category} opened"
   }
-}, Ft = J({
-  i18n: { messages: Vt },
+}, Kt = Z({
+  i18n: { messages: Ft },
   name: "bento-listbox-multi-select-category",
   components: {
-    BentoTypography: re,
-    BentoListboxOption: Ce,
-    ChevronDownIcon: yt,
-    ChevronUpIcon: St,
+    BentoTypography: de,
+    BentoListboxOption: Ee,
+    ChevronDownIcon: St,
+    ChevronUpIcon: ht,
     ListboxDecorativeCheckbox: Ae
   },
   props: {
@@ -628,133 +633,140 @@ const Vt = {
     tabindex: { type: Number, default: -1 }
   },
   emits: [
-    ee.SELECT_CATEGORY,
-    ee.UNSELECT_CATEGORY,
-    ee.TOGGLE_CATEGORY_VISIBILITY
+    te.SELECT_CATEGORY,
+    te.UNSELECT_CATEGORY,
+    te.TOGGLE_CATEGORY_VISIBILITY
   ],
   setup(e, { emit: t }) {
-    const i = $(!1), { t: s } = Ie(), n = (I) => e.isOptionDisabled ? e.isOptionDisabled(I) : !1, o = m(
-      () => e.category.items.every((I) => n(I))
-    ), a = me(e, "staticCategories"), p = m(() => i.value || e.staticCategories), S = m(() => ({
-      [`b-listbox-multi-select-category--${Fe.DISABLED}`]: o.value
-    })), r = (I, w) => {
-      I.preventDefault(), i.value = w !== void 0 ? w : !i.value, t(ee.TOGGLE_CATEGORY_VISIBILITY, e.category.value);
-    }, u = (I) => {
-      var Q;
-      const w = n(I), W = ((Q = e.selectedItemsList) == null ? void 0 : Q.includes(I.value)) || !1;
-      return { isDisabled: w, isPreSelected: W };
-    }, l = m(
-      () => e.category.items.filter((I) => {
-        const { isDisabled: w, isPreSelected: W } = u(I);
-        return w && W || !w;
+    const i = k(!1), { t: s } = Ie(), r = Ne("category-group"), o = Ne("category-name"), n = (N) => e.isOptionDisabled ? e.isOptionDisabled(N) : !1, p = m(
+      () => e.category.items.every((N) => n(N))
+    ), y = fe(e, "staticCategories"), a = m(() => i.value || e.staticCategories), u = m(() => ({
+      [`b-listbox-multi-select-category--${Ke.DISABLED}`]: p.value
+    })), l = (N, U) => {
+      N.preventDefault(), i.value = U !== void 0 ? U : !i.value, t(te.TOGGLE_CATEGORY_VISIBILITY, e.category.value);
+    }, f = (N) => {
+      var oe;
+      const U = n(N), W = ((oe = e.selectedItemsList) == null ? void 0 : oe.includes(N.value)) || !1;
+      return { isDisabled: U, isPreSelected: W };
+    }, E = m(
+      () => e.category.items.filter((N) => {
+        const { isDisabled: U, isPreSelected: W } = f(N);
+        return U && W || !U;
       })
-    ), f = m(
+    ), T = m(
       () => {
-        var I;
-        return (I = l.value) == null ? void 0 : I.filter(
-          ({ value: w }) => {
+        var N;
+        return (N = E.value) == null ? void 0 : N.filter(
+          ({ value: U }) => {
             var W;
-            return (W = e.selectedItemsList) == null ? void 0 : W.includes(w);
+            return (W = e.selectedItemsList) == null ? void 0 : W.includes(U);
           }
         );
       }
-    ), E = m(() => {
-      const I = i.value ? "categoryOpened" : "categoryClosed";
-      return s(I, { category: e.category.label });
-    }), T = () => {
-      t(ee.SELECT_CATEGORY);
-    }, R = () => {
-      t(ee.UNSELECT_CATEGORY);
-    }, { isAllSelected: L, isIndeterminate: B, toggleSelectAll: G } = Ue(
-      f,
-      l,
+    ), $ = m(() => {
+      const N = i.value ? "categoryOpened" : "categoryClosed";
+      return s(N, { category: e.category.label });
+    }), P = () => {
+      t(te.SELECT_CATEGORY);
+    }, D = () => {
+      t(te.UNSELECT_CATEGORY);
+    }, { isAllSelected: B, isIndeterminate: I, toggleSelectAll: S } = ze(
       T,
-      R
-    ), k = m(() => B.value ? "mixed" : `${L.value}`), y = $(L.value), _ = () => {
-      y.value = !y.value, G(y.value);
+      E,
+      P,
+      D
+    ), _ = m(() => I.value ? "mixed" : `${B.value}`), w = k(B.value), Q = () => {
+      w.value = !w.value, S(w.value);
     };
-    return pe(L, () => {
-      y.value = L.value;
+    return ye(B, () => {
+      w.value = B.value;
     }), {
       // Values
-      chevronTitle: E,
-      conditionalClass: S,
-      hasAllPropsDisabled: o,
+      chevronTitle: $,
+      conditionalClass: u,
+      hasAllPropsDisabled: p,
       isOpen: i,
-      isAllSelected: L,
-      isIndeterminate: B,
-      isStaticCategory: a,
+      isAllSelected: B,
+      isIndeterminate: I,
+      isStaticCategory: y,
+      categoryGroupId: r,
+      categoryNameId: o,
       // Computed
-      showItemChildren: p,
-      ariaCheckedComputed: k,
+      showItemChildren: a,
+      ariaCheckedComputed: _,
       // Methods
-      handleSelectAll: _,
-      toggleOpen: r,
-      toggleSelectAll: G
+      handleSelectAll: Q,
+      toggleOpen: l,
+      toggleSelectAll: S
     };
   }
-}), Kt = { class: "b-listbox-multi-select-category__label" }, Wt = {
+}), Wt = { class: "b-listbox-multi-select-category__label" }, jt = {
   key: 1,
-  class: "b-listbox-multi-select-category b-listbox-multi-select-category--static-category"
-}, jt = { class: "b-listbox-multi-select-category__label" };
-function qt(e, t, i, s, n, o) {
-  const a = D("listbox-decorative-checkbox"), p = D("bento-typography"), S = D("chevron-up-icon"), r = D("chevron-down-icon"), u = D("bento-listbox-option");
+  class: "b-listbox-multi-select-category b-listbox-multi-select-category--static-category",
+  "aria-hidden": "true"
+}, qt = { class: "b-listbox-multi-select-category__label" }, Ht = ["id", "aria-label"];
+function Xt(e, t, i, s, r, o) {
+  const n = L("listbox-decorative-checkbox"), p = L("bento-typography"), y = L("chevron-up-icon"), a = L("chevron-down-icon"), u = L("bento-listbox-option");
   return v(), O("div", null, [
-    e.isStaticCategory ? (v(), O("div", Wt, [
-      U("span", jt, [
-        x(p, {
+    e.isStaticCategory ? (v(), O("div", jt, [
+      z("span", qt, [
+        G(p, {
           el: "span",
           variant: "caption",
           class: "b-listbox-multi-select-category__label-text"
         }, {
           default: A(() => [
-            F(z(e.category.label), 1)
+            K(V(e.category.label), 1)
           ]),
           _: 1
         })
       ])
-    ])) : (v(), N(u, {
+    ])) : (v(), R(u, {
       key: 0,
-      class: fe(["b-listbox-multi-select-category__option", e.conditionalClass]),
+      class: ge(["b-listbox-multi-select-category__option", e.conditionalClass]),
       tabindex: e.tabindex,
       "aria-selected": e.ariaCheckedComputed !== "false",
       "aria-checked": e.ariaCheckedComputed,
       "aria-disabled": e.hasAllPropsDisabled,
-      "aria-expanded": e.isOpen,
+      "aria-expanded": `${e.isOpen}`,
       role: "treeitem",
+      "aria-owns": e.categoryGroupId,
+      "aria-labelledby": e.categoryNameId,
       onClick: e.handleSelectAll,
       onEnterPressed: e.handleSelectAll,
-      onSpacePressed: ne(e.handleSelectAll, ["prevent"]),
+      onSpacePressed: re(e.handleSelectAll, ["prevent"]),
       onKeydown: [
-        t[1] || (t[1] = ue((l) => e.toggleOpen(l, !1), ["arrow-left", "native"])),
-        t[2] || (t[2] = ue((l) => e.toggleOpen(l, !0), ["arrow-right", "native"]))
+        t[1] || (t[1] = me((l) => e.toggleOpen(l, !1), ["arrow-left", "native"])),
+        t[2] || (t[2] = me((l) => e.toggleOpen(l, !0), ["arrow-right", "native"]))
       ]
     }, {
       default: A(() => [
-        x(a, {
+        G(n, {
           indeterminate: e.isIndeterminate,
           disabled: e.hasAllPropsDisabled,
           checked: e.isAllSelected
         }, null, 8, ["indeterminate", "disabled", "checked"]),
-        U("span", Kt, [
-          x(p, {
+        z("span", Wt, [
+          G(p, {
+            id: e.categoryNameId,
             el: "span",
             class: "b-listbox-multi-select-category__label-text"
           }, {
             default: A(() => [
-              F(z(e.category.label), 1)
+              K(V(e.category.label), 1)
             ]),
             _: 1
-          }),
-          U("div", {
+          }, 8, ["id"]),
+          z("div", {
+            "aria-hidden": "true",
             class: "b-listbox-multi-select-category__label-chevron",
             "data-testid": "toggle-listbox",
-            onClickCapture: t[0] || (t[0] = ne((...l) => e.toggleOpen && e.toggleOpen(...l), ["stop"]))
+            onClickCapture: t[0] || (t[0] = re((...l) => e.toggleOpen && e.toggleOpen(...l), ["stop"]))
           }, [
-            e.isOpen ? (v(), N(S, {
+            e.isOpen ? (v(), R(y, {
               key: 0,
               "svg-title": e.chevronTitle
-            }, null, 8, ["svg-title"])) : (v(), N(r, {
+            }, null, 8, ["svg-title"])) : (v(), R(a, {
               key: 1,
               "svg-title": e.chevronTitle
             }, null, 8, ["svg-title"]))
@@ -762,22 +774,26 @@ function qt(e, t, i, s, n, o) {
         ])
       ]),
       _: 1
-    }, 8, ["class", "tabindex", "aria-selected", "aria-checked", "aria-disabled", "aria-expanded", "onClick", "onEnterPressed", "onSpacePressed"])),
-    ae(U("div", null, [
-      K(e.$slots, "default", {}, void 0, !0)
-    ], 512), [
-      [Ge, e.showItemChildren]
+    }, 8, ["class", "tabindex", "aria-selected", "aria-checked", "aria-disabled", "aria-expanded", "aria-owns", "aria-labelledby", "onClick", "onEnterPressed", "onSpacePressed"])),
+    ce(z("div", {
+      id: e.categoryGroupId,
+      role: "group",
+      "aria-label": e.category.label
+    }, [
+      j(e.$slots, "default", {}, void 0, !0)
+    ], 8, Ht), [
+      [we, e.showItemChildren]
     ])
   ]);
 }
-const Ht = /* @__PURE__ */ q(Ft, [["render", qt], ["__scopeId", "data-v-94c9983d"]]);
-var H = /* @__PURE__ */ ((e) => (e.SELECT_CATEGORY = "select-category", e.TOGGLE_CHECKBOX_SELECTION = "toggle-checkbox-selection", e.UNSELECT_CATEGORY = "unselect-category", e.TOGGLE_CATEGORY_VISIBILITY = "toggle-category-visibility", e))(H || {});
-const Xt = J({
+const Jt = /* @__PURE__ */ H(Kt, [["render", Xt], ["__scopeId", "data-v-f331aae2"]]);
+var X = /* @__PURE__ */ ((e) => (e.SELECT_CATEGORY = "select-category", e.TOGGLE_CHECKBOX_SELECTION = "toggle-checkbox-selection", e.UNSELECT_CATEGORY = "unselect-category", e.TOGGLE_CATEGORY_VISIBILITY = "toggle-category-visibility", e))(X || {});
+const Zt = Z({
   name: "listbox-multi-select-options",
   components: {
-    BentoListboxOption: Ce,
-    BentoTypography: re,
-    ListboxMultiSelectCategory: Ht,
+    BentoListboxOption: Ee,
+    BentoTypography: de,
+    ListboxMultiSelectCategory: Jt,
     ListboxDecorativeCheckbox: Ae
   },
   inheritAttrs: !1,
@@ -848,23 +864,23 @@ const Xt = J({
     }
   },
   emits: [
-    H.TOGGLE_CHECKBOX_SELECTION,
-    H.SELECT_CATEGORY,
-    H.UNSELECT_CATEGORY,
-    H.TOGGLE_CATEGORY_VISIBILITY
+    X.TOGGLE_CHECKBOX_SELECTION,
+    X.SELECT_CATEGORY,
+    X.UNSELECT_CATEGORY,
+    X.TOGGLE_CATEGORY_VISIBILITY
   ],
   setup(e, { emit: t }) {
-    const i = (r) => {
-      e.isOptionDisabled(r) || t(H.TOGGLE_CHECKBOX_SELECTION, r);
-    }, s = (r) => !!r.items, n = (r) => {
+    const i = (a) => {
+      e.isOptionDisabled(a) || t(X.TOGGLE_CHECKBOX_SELECTION, a);
+    }, s = (a) => !!a.items, r = (a) => {
       const u = e.isMultiLevel && e.searching;
-      return r.description && (!e.isMultiLevel || u);
-    }, o = (r) => r.items ? !!r.items.find((u) => e.selectedItemsList.includes(u.value)) : e.selectedItemsList.includes(r.value), a = (r) => {
-      if (s(r)) {
-        const u = o(r) ? H.UNSELECT_CATEGORY : H.SELECT_CATEGORY;
-        t(u, r);
+      return a.description && (!e.isMultiLevel || u);
+    }, o = (a) => a.items ? !!a.items.find((u) => e.selectedItemsList.includes(u.value)) : e.selectedItemsList.includes(a.value), n = (a) => {
+      if (s(a)) {
+        const u = o(a) ? X.UNSELECT_CATEGORY : X.SELECT_CATEGORY;
+        t(u, a);
       } else
-        i(r);
+        i(a);
     };
     return {
       // Values
@@ -874,25 +890,25 @@ const Xt = J({
       })),
       // Methods
       isOptionSelected: o,
-      shouldShowDescription: n,
+      shouldShowDescription: r,
       toggleCheckboxSelection: i,
-      toggleSearchOption: a,
-      computedTabindex: (r) => e.itemsIndex[r] === e.focusedIndex ? 0 : -1,
+      toggleSearchOption: n,
+      computedTabindex: (a) => e.itemsIndex[a] === e.focusedIndex ? 0 : -1,
       // Enums
       BentoListboxEvent: g,
-      ListboxMultiSelectOptionsEvent: H
+      ListboxMultiSelectOptionsEvent: X
     };
   }
-}), Jt = { class: "b-listbox-multi-select__option-text" }, Zt = { class: "b-listbox-multi-select__option-text" };
-function Qt(e, t, i, s, n, o) {
-  const a = D("listbox-decorative-checkbox"), p = D("bento-typography"), S = D("bento-listbox-option"), r = D("listbox-multi-select-options", !0), u = D("listbox-multi-select-category");
+}), Qt = { class: "b-listbox-multi-select__option-text" }, es = { class: "b-listbox-multi-select__option-text" };
+function ts(e, t, i, s, r, o) {
+  const n = L("listbox-decorative-checkbox"), p = L("bento-typography"), y = L("bento-listbox-option"), a = L("listbox-multi-select-options", !0), u = L("listbox-multi-select-category");
   return v(), O("div", null, [
-    (v(!0), O(se, null, j(e.items, (l) => (v(), O("div", {
+    (v(!0), O(le, null, q(e.items, (l) => (v(), O("div", {
       key: `selected-${l.value}`
     }, [
-      e.searching && e.isMultiLevel ? (v(), N(S, {
+      e.searching && e.isMultiLevel ? (v(), R(y, {
         key: 0,
-        class: fe(["b-listbox-multi-select-options", e.conditionalClasses]),
+        class: ge(["b-listbox-multi-select-options", e.conditionalClasses]),
         disabled: e.isOptionDisabled ? e.isOptionDisabled(l) : null,
         tabindex: e.computedTabindex(l.value),
         "aria-selected": `${e.isOptionSelected(l)}`,
@@ -901,37 +917,37 @@ function Qt(e, t, i, s, n, o) {
         role: e.$attrs.role,
         onClick: (f) => e.toggleSearchOption(l),
         onEnterPressed: (f) => e.toggleSearchOption(l),
-        onSpacePressed: ne((f) => e.toggleSearchOption(l), ["prevent"])
+        onSpacePressed: re((f) => e.toggleSearchOption(l), ["prevent"])
       }, {
         default: A(() => [
-          x(a, {
+          G(n, {
             disabled: e.isOptionDisabled ? e.isOptionDisabled(l) : null,
             checked: e.isOptionSelected(l)
           }, null, 8, ["disabled", "checked"]),
-          K(e.$slots, "default", Y({ ref_for: !0 }, l), () => [
-            U("span", Jt, [
-              x(p, { el: "span" }, {
+          j(e.$slots, "default", Y({ ref_for: !0 }, l), () => [
+            z("span", Qt, [
+              G(p, { el: "span" }, {
                 default: A(() => [
-                  F(z(l.label), 1)
+                  K(V(l.label), 1)
                 ]),
                 _: 2
               }, 1024),
-              e.shouldShowDescription(l) ? (v(), N(p, {
+              e.shouldShowDescription(l) ? (v(), R(p, {
                 key: 0,
                 class: "b-listbox-multi-select__option-description",
                 el: "span"
               }, {
                 default: A(() => [
-                  F(z(l.description), 1)
+                  K(V(l.description), 1)
                 ]),
                 _: 2
-              }, 1024)) : X("", !0)
+              }, 1024)) : J("", !0)
             ])
           ], !0)
         ]),
         _: 2
-      }, 1032, ["class", "disabled", "tabindex", "aria-selected", "aria-checked", "aria-disabled", "role", "onClick", "onEnterPressed", "onSpacePressed"])) : (v(), O(se, { key: 1 }, [
-        l.items ? (v(), N(u, {
+      }, 1032, ["class", "disabled", "tabindex", "aria-selected", "aria-checked", "aria-disabled", "role", "onClick", "onEnterPressed", "onSpacePressed"])) : (v(), O(le, { key: 1 }, [
+        l.items ? (v(), R(u, {
           key: 0,
           category: l,
           "static-categories": e.staticCategories,
@@ -943,7 +959,7 @@ function Qt(e, t, i, s, n, o) {
           onToggleCategoryVisibility: t[1] || (t[1] = (f) => e.$emit(e.ListboxMultiSelectOptionsEvent.TOGGLE_CATEGORY_VISIBILITY, f))
         }, {
           default: A(() => [
-            x(r, {
+            G(a, {
               "category-items": "",
               items: l.items,
               "is-option-disabled": e.isOptionDisabled,
@@ -958,9 +974,9 @@ function Qt(e, t, i, s, n, o) {
             }, null, 8, ["items", "is-option-disabled", "items-index", "focused-index", "is-multi-level", "static-categories", "selected-items-list", "searching", "role"])
           ]),
           _: 2
-        }, 1032, ["category", "static-categories", "is-option-disabled", "selected-items-list", "tabindex", "onSelectCategory", "onUnselectCategory"])) : (v(), N(S, {
+        }, 1032, ["category", "static-categories", "is-option-disabled", "selected-items-list", "tabindex", "onSelectCategory", "onUnselectCategory"])) : (v(), R(y, {
           key: 1,
-          class: fe(["b-listbox-multi-select-options", e.conditionalClasses]),
+          class: ge(["b-listbox-multi-select-options", e.conditionalClasses]),
           disabled: e.isOptionDisabled ? e.isOptionDisabled(l) : null,
           tabindex: e.computedTabindex(l.value),
           "aria-selected": `${e.isOptionSelected(l)}`,
@@ -969,31 +985,31 @@ function Qt(e, t, i, s, n, o) {
           role: e.$attrs.role,
           onClick: (f) => e.toggleCheckboxSelection(l),
           onEnterPressed: (f) => e.toggleCheckboxSelection(l),
-          onSpacePressed: ne((f) => e.toggleCheckboxSelection(l), ["prevent"])
+          onSpacePressed: re((f) => e.toggleCheckboxSelection(l), ["prevent"])
         }, {
           default: A(() => [
-            x(a, {
+            G(n, {
               disabled: e.isOptionDisabled ? e.isOptionDisabled(l) : null,
               checked: e.isOptionSelected(l)
             }, null, 8, ["disabled", "checked"]),
-            K(e.$slots, "default", Y({ ref_for: !0 }, l), () => [
-              U("span", Zt, [
-                x(p, { el: "span" }, {
+            j(e.$slots, "default", Y({ ref_for: !0 }, l), () => [
+              z("span", es, [
+                G(p, { el: "span" }, {
                   default: A(() => [
-                    F(z(l.label), 1)
+                    K(V(l.label), 1)
                   ]),
                   _: 2
                 }, 1024),
-                e.shouldShowDescription(l) ? (v(), N(p, {
+                e.shouldShowDescription(l) ? (v(), R(p, {
                   key: 0,
                   class: "b-listbox-multi-select__option-description",
                   el: "span"
                 }, {
                   default: A(() => [
-                    F(z(l.description), 1)
+                    K(V(l.description), 1)
                   ]),
                   _: 2
-                }, 1024)) : X("", !0)
+                }, 1024)) : J("", !0)
               ])
             ], !0)
           ]),
@@ -1003,19 +1019,19 @@ function Qt(e, t, i, s, n, o) {
     ]))), 128))
   ]);
 }
-const es = /* @__PURE__ */ q(Xt, [["render", Qt], ["__scopeId", "data-v-fd1a6cbe"]]), ts = (e) => {
+const ss = /* @__PURE__ */ H(Zt, [["render", ts], ["__scopeId", "data-v-fd1a6cbe"]]), ls = (e) => {
   const t = m(() => {
     var s;
-    return !!((s = e.value) != null && s.find(({ items: n }) => !!n));
+    return !!((s = e.value) != null && s.find(({ items: r }) => !!r));
   }), i = m(() => {
     var s;
-    return t.value ? (s = e.value) == null ? void 0 : s.reduce((n, o) => (o.items ? n.push(...o.items.flat()) : n.push(o), n), []) : e.value;
+    return t.value ? (s = e.value) == null ? void 0 : s.reduce((r, o) => (o.items ? r.push(...o.items.flat()) : r.push(o), r), []) : e.value;
   });
   return {
     isMultiLevelSelect: t,
     flattenedItemsList: i
   };
-}, Ke = {
+}, We = {
   "en-US": {
     allSelected: "All selected ({total})",
     numberOfTotalSelected: "{number} of {total} selected",
@@ -1034,12 +1050,12 @@ const es = /* @__PURE__ */ q(Xt, [["render", Qt], ["__scopeId", "data-v-fd1a6cbe
     numbersSelected: "{number} selecionados",
     selectAll: "Selecionar todos ({total})"
   }
-}, ss = { key: 0 }, ls = ["role"], os = {
+}, os = { key: 0 }, is = ["role"], ns = {
   key: 1,
   class: "b-listbox-multi-select__divider",
   "aria-hidden": "true"
-}, is = { i18n: { messages: Ke } }, ns = /* @__PURE__ */ J({
-  ...is,
+}, as = { i18n: { messages: We } }, rs = /* @__PURE__ */ Z({
+  ...as,
   __name: "listbox-multi-select",
   props: {
     hasMoreItems: { type: Boolean, default: !1 },
@@ -1052,136 +1068,136 @@ const es = /* @__PURE__ */ q(Xt, [["render", Qt], ["__scopeId", "data-v-fd1a6cbe
   },
   emits: ["select"],
   setup(e, { expose: t, emit: i }) {
-    const s = e, n = i, { t: o, n: a } = Ie({ messages: Ke }), p = dt(), S = ut(), r = m(
+    const s = e, r = i, { t: o, n } = Ie({ messages: We }), p = ut(), y = bt(), a = m(
       () => {
         var c, b, d, h;
         return {
-          "aria-label": (c = S["aria-label"]) == null ? void 0 : c.toString(),
-          "aria-busy": (b = S["aria-busy"]) == null ? void 0 : b.toString(),
-          "aria-atomic": (d = S["aria-atomic"]) == null ? void 0 : d.toString(),
-          "aria-live": (h = S["aria-live"]) == null ? void 0 : h.toString(),
+          "aria-label": (c = y["aria-label"]) == null ? void 0 : c.toString(),
+          "aria-busy": (b = y["aria-busy"]) == null ? void 0 : b.toString(),
+          "aria-atomic": (d = y["aria-atomic"]) == null ? void 0 : d.toString(),
+          "aria-live": (h = y["aria-live"]) == null ? void 0 : h.toString(),
           "aria-multiselectable": !0
         };
       }
-    ), u = $(null), l = $(null), f = $(null), E = $(null), T = m(() => s.selectedValues.map(({ value: c }) => c)), { isMultiLevelSelect: R, flattenedItemsList: L } = ts(me(s, "items")), B = m(() => R.value && !s.staticCategories), G = m(() => B.value ? "tree" : "listbox"), k = m(() => B.value ? "treeitem" : "option"), y = (c) => {
+    ), u = k(null), l = k(null), f = k(null), E = k(null), T = m(() => s.selectedValues.map(({ value: c }) => c)), { isMultiLevelSelect: $, flattenedItemsList: P } = ls(fe(s, "items")), D = m(() => $.value && !s.staticCategories), B = m(() => D.value ? "tree" : "listbox"), I = m(() => D.value ? "treeitem" : "option"), S = (c) => {
       var h;
       const b = s.isOptionDisabled(c), d = ((h = T.value) == null ? void 0 : h.includes(c.value)) || !1;
       return { isDisabled: b, isPreSelected: d };
     }, _ = m(() => {
-      if (s.searching && R)
+      if (s.searching && $)
         return s.items;
-      const c = L.value.filter((b) => {
-        const { isDisabled: d, isPreSelected: h } = y(b);
+      const c = P.value.filter((b) => {
+        const { isDisabled: d, isPreSelected: h } = S(b);
         return d && h || !d;
       });
       return s.selectedValues.forEach((b) => {
         c.find((d) => d.value === b.value) || c.push(b);
       }), c;
-    }), I = m(
+    }), w = m(
       () => {
         var c;
         return (c = _.value) == null ? void 0 : c.filter((b) => {
           var d;
-          return b.items && R.value && s.searching ? b.items.filter(
+          return b.items && $.value && s.searching ? b.items.filter(
             (C) => (s.selectedValues ?? []).includes(C.value)
           ).length === b.items.length : (d = T.value) == null ? void 0 : d.includes(b.value);
         });
       }
-    ), w = () => R.value && !s.searching ? L.value.length : s.items.length, W = m(() => {
+    ), Q = () => $.value && !s.searching ? P.value.length : s.items.length, N = m(() => {
       var h;
-      const c = _.value.length, b = w(), d = ((h = I.value) == null ? void 0 : h.length) || 0;
-      return d === 0 ? o("selectAll", { total: a(c) }) : d === b ? o("allSelected", { total: a(b) }) : d <= b ? o("numberOfTotalSelected", { number: a(d), total: a(b) }) : o("numbersSelected", { number: a(d) });
-    }), Q = (c) => {
+      const c = _.value.length, b = Q(), d = ((h = w.value) == null ? void 0 : h.length) || 0;
+      return d === 0 ? o("selectAll", { total: n(c) }) : d === b ? o("allSelected", { total: n(b) }) : d <= b ? o("numberOfTotalSelected", { number: n(d), total: n(b) }) : o("numbersSelected", { number: n(d) });
+    }), U = (c) => {
       const b = (h) => {
-        const { isDisabled: C, isPreSelected: Z } = y(h);
-        return C && Z || !C;
+        const { isDisabled: C, isPreSelected: ee } = S(h);
+        return C && ee || !C;
       }, d = c.filter(b).filter((h) => !T.value.includes(h.value));
-      n("select", [...s.selectedValues, ...d]);
-    }, ge = (c) => {
+      r("select", [...s.selectedValues, ...d]);
+    }, W = (c) => {
       const b = (C) => {
-        const { isDisabled: Z, isPreSelected: at } = y(C);
-        return !(Z && at);
+        const { isDisabled: ee, isPreSelected: rt } = S(C);
+        return !(ee && rt);
       }, d = c.filter(b).map(({ value: C }) => C), h = s.selectedValues.filter((C) => !(d != null && d.includes(C.value)));
-      n("select", h);
-    }, Ee = () => {
-      Q(L.value);
+      r("select", h);
+    }, oe = () => {
+      U(P.value);
     }, Oe = () => {
-      ge(L.value);
-    }, { isAllSelected: P, isIndeterminate: le, toggleSelectAll: We } = Ue(
-      I,
+      W(P.value);
+    }, { isAllSelected: M, isIndeterminate: ie, toggleSelectAll: je } = ze(
+      w,
       _,
-      Ee,
+      oe,
       Oe
-    ), ke = m(() => le.value ? "mixed" : `${P.value}`), ye = $(P.value), Te = () => {
-      ye.value = !ye.value, We(ye.value);
+    ), ke = m(() => ie.value ? "mixed" : `${M.value}`), Se = k(M.value), Te = () => {
+      Se.value = !Se.value, je(Se.value);
     };
-    pe(P, () => {
-      ye.value = P.value;
+    ye(M, () => {
+      Se.value = M.value;
     });
-    const je = (c) => {
-      Q(c.items);
+    const qe = (c) => {
+      U(c.items);
     }, Le = (c) => {
-      ge(c.items);
-    }, ce = (c, b) => {
+      W(c.items);
+    }, ue = (c, b) => {
       let d = !1;
       const h = s.selectedValues.filter(({ value: C }) => b.value === C ? (d = !0, !1) : !0);
-      d || h.push(b), n(c, h);
-    }, qe = m(() => {
-      if (!R.value)
+      d || h.push(b), r(c, h);
+    }, He = m(() => {
+      if (!$.value)
         return s.selectedValues;
-      const c = (C) => T.value.includes(C.value), b = (C) => !s.staticCategories && C.every((Z) => c(Z));
+      const c = (C) => T.value.includes(C.value), b = (C) => !s.staticCategories && C.every((ee) => c(ee));
       return s.items.flatMap(
         (C) => C.items && !b(C.items) ? C.items : C
       ).filter((C) => C.items ? !0 : c(C));
-    }), He = m(() => {
-      var d, h, C, Z;
-      const c = ["automatic", "button"].includes(s.lazyLoadType), b = ((d = s.selectedValues) == null ? void 0 : d.length) > 0 && ((h = I.value) == null ? void 0 : h.length) !== ((C = L.value) == null ? void 0 : C.length);
-      return c && s.hasMoreItems ? !!((Z = s.selectedValues) != null && Z.length) : b;
-    }), $e = m(() => ["automatic", "button"].includes(s.lazyLoadType) ? !s.hasMoreItems : !0), de = $([]), { visibleDomOptions: De, updateVisibleDomOptions: Xe } = Ve(
+    }), Xe = m(() => {
+      var d, h, C, ee;
+      const c = ["automatic", "button"].includes(s.lazyLoadType), b = ((d = s.selectedValues) == null ? void 0 : d.length) > 0 && ((h = w.value) == null ? void 0 : h.length) !== ((C = P.value) == null ? void 0 : C.length);
+      return c && s.hasMoreItems ? !!((ee = s.selectedValues) != null && ee.length) : b;
+    }), $e = m(() => ["automatic", "button"].includes(s.lazyLoadType) ? !s.hasMoreItems : !0), be = k([]), { visibleDomOptions: De, updateVisibleDomOptions: Je } = Fe(
       u,
-      me(s, "items"),
-      k
-    ), Je = (c) => {
-      de.value.includes(c) ? de.value = de.value.filter((b) => b !== c) : de.value.push(c), we(() => {
-        Xe();
+      fe(s, "items"),
+      I
+    ), Ze = (c) => {
+      be.value.includes(c) ? be.value = be.value.filter((b) => b !== c) : be.value.push(c), Ye(() => {
+        Je();
       });
-    }, Ze = (c) => {
+    }, Qe = (c) => {
       var b;
       (b = De.value[c]) == null || b.focus();
     }, {
-      moveToNextElement: Qe,
-      moveToPreviousElement: et,
-      moveToFirstElement: tt,
-      moveToLastElement: st,
+      moveToNextElement: et,
+      moveToPreviousElement: tt,
+      moveToFirstElement: st,
+      moveToLastElement: lt,
       preventDefault: Be,
       focusedIndex: Re,
-      setListboxFocusedIndex: lt
-    } = ze(
+      setListboxFocusedIndex: ot
+    } = Ve(
       {
         items: De
       },
-      Ze
-    ), ot = {
-      [V.ARROW_UP]: (c) => et(c),
-      [V.ARROW_DOWN]: (c) => Qe(c),
-      [V.HOME]: tt,
-      [V.END]: st
+      Qe
+    ), it = {
+      [F.ARROW_UP]: (c) => tt(c),
+      [F.ARROW_DOWN]: (c) => et(c),
+      [F.HOME]: st,
+      [F.END]: lt
     };
     t({
       /**
        * 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: lt
+      setListboxFocusedIndex: ot
     });
-    const it = {
-      [V.ARROW_UP]: Be,
-      [V.ARROW_DOWN]: Be
-    }, nt = m(() => {
+    const nt = {
+      [F.ARROW_UP]: Be,
+      [F.ARROW_DOWN]: Be
+    }, at = m(() => {
       let c = 1;
       const b = {};
       return s.items.forEach((d) => {
-        let h = de.value.includes(d.value);
+        let h = be.value.includes(d.value);
         d.items ? (s.staticCategories ? h = !0 : b[d.value] = c++, h && d.items.forEach((C) => b[C.value] = c++)) : b[d.value] = c++;
       }), b;
     });
@@ -1190,91 +1206,91 @@ const es = /* @__PURE__ */ q(Xt, [["render", Qt], ["__scopeId", "data-v-fd1a6cbe
       ref: u,
       class: "b-listbox-multi-select"
     }, [
-      He.value ? (v(), O("div", ss, [
-        ae((v(), O("ul", Y({ class: "b-listbox-multi-select__chips" }, te(it, !0)), [
-          (v(!0), O(se, null, j(qe.value, (d) => (v(), O("li", {
+      Xe.value ? (v(), O("div", os, [
+        ce((v(), O("ul", Y({ class: "b-listbox-multi-select__chips" }, se(nt, !0)), [
+          (v(!0), O(le, null, q(He.value, (d) => (v(), O("li", {
             key: d.value
           }, [
-            x(M(ft), {
+            G(x(pt), {
               ref_for: !0,
               ref_key: "selectedListboxItemsRef",
               ref: f,
               disabled: c.isOptionDisabled(d),
               label: d.label,
               condensed: "",
-              onClick: (h) => d.items ? Le(d) : ce("select", d)
+              onClick: (h) => d.items ? Le(d) : ue("select", d)
             }, null, 8, ["disabled", "label", "onClick"])
           ]))), 128))
         ], 16)), [
-          [M(he)]
+          [x(Ce)]
         ]),
-        b[4] || (b[4] = U("hr", {
+        b[4] || (b[4] = z("hr", {
           class: "b-listbox-multi-select__divider",
           "aria-hidden": "true"
         }, null, -1))
-      ])) : X("", !0),
-      ae((v(), O("div", Y(r.value, { role: G.value }, te(ot, !0)), [
-        $e.value ? (v(), N(M(Ce), {
+      ])) : J("", !0),
+      ce((v(), O("div", Y(a.value, { role: B.value }, se(it, !0)), [
+        $e.value ? (v(), R(x(Ee), {
           key: 0,
           ref_key: "selectAllListboxItemsRef",
           ref: l,
           class: "b-listbox-multi-select__option",
-          tabindex: M(Re) === 0 ? 0 : -1,
+          tabindex: x(Re) === 0 ? 0 : -1,
           "aria-selected": ke.value !== "false",
           "aria-checked": ke.value,
-          role: k.value,
+          role: I.value,
           onClick: Te,
           onEnterPressed: Te,
-          onSpacePressed: ne(Te, ["prevent"])
+          onSpacePressed: re(Te, ["prevent"])
         }, {
           default: A(() => [
-            x(M(Ae), {
-              checked: M(P),
-              indeterminate: M(le)
+            G(x(Ae), {
+              checked: x(M),
+              indeterminate: x(ie)
             }, null, 8, ["checked", "indeterminate"]),
-            x(M(re), { el: "span" }, {
+            G(x(de), { el: "span" }, {
               default: A(() => [
-                F(z(W.value), 1)
+                K(V(N.value), 1)
               ]),
               _: 1
             })
           ]),
           _: 1
-        }, 8, ["tabindex", "aria-selected", "aria-checked", "role"])) : X("", !0),
-        $e.value ? (v(), O("hr", os)) : X("", !0),
-        x(M(es), {
+        }, 8, ["tabindex", "aria-selected", "aria-checked", "role"])) : J("", !0),
+        $e.value ? (v(), O("hr", ns)) : J("", !0),
+        G(x(ss), {
           ref_key: "listboxItemsRef",
           ref: E,
           items: c.items,
           "is-option-disabled": c.isOptionDisabled,
-          "is-multi-level": M(R),
+          "is-multi-level": x($),
           "static-categories": c.staticCategories,
           searching: c.searching,
           "selected-items-list": T.value,
-          "focused-index": M(Re),
-          "items-index": nt.value,
-          role: k.value,
-          onToggleCheckboxSelection: b[0] || (b[0] = (d) => ce("select", d)),
-          onSelectCategory: je,
+          "focused-index": x(Re),
+          "items-index": at.value,
+          role: I.value,
+          onToggleCheckboxSelection: b[0] || (b[0] = (d) => ue("select", d)),
+          onSelectCategory: qe,
           onUnselectCategory: Le,
-          onToggleCategoryVisibility: Je,
-          onSpacePressed: b[1] || (b[1] = (d) => ce(M(g).SPACE, d)),
-          onTabPressed: b[2] || (b[2] = (d) => ce(M(g).TAB, d)),
-          onEnterPressed: b[3] || (b[3] = (d) => ce(M(g).ENTER, d))
-        }, ve({ _: 2 }, [
-          j(M(p), (d, h) => ({
+          onToggleCategoryVisibility: Ze,
+          onSpacePressed: b[1] || (b[1] = (d) => ue(x(g).SPACE, d)),
+          onTabPressed: b[2] || (b[2] = (d) => ue(x(g).TAB, d)),
+          onEnterPressed: b[3] || (b[3] = (d) => ue(x(g).ENTER, d))
+        }, pe({ _: 2 }, [
+          q(x(p), (d, h) => ({
             name: h,
             fn: A((C) => [
-              K(c.$slots, h, ie(be(C)), void 0, !0)
+              j(c.$slots, h, ae(ve(C)), void 0, !0)
             ])
           }))
         ]), 1032, ["items", "is-option-disabled", "is-multi-level", "static-categories", "searching", "selected-items-list", "focused-index", "items-index", "role"])
-      ], 16, ls)), [
-        [M(he)]
+      ], 16, is)), [
+        [x(Ce)]
       ])
     ], 512));
   }
-}), Me = /* @__PURE__ */ q(ns, [["__scopeId", "data-v-dc031d72"]]), xe = {
+}), xe = /* @__PURE__ */ H(rs, [["__scopeId", "data-v-dc031d72"]]), Ge = {
   "en-US": {
     loading: "Loading",
     showMore: "Show more"
@@ -1287,18 +1303,18 @@ const es = /* @__PURE__ */ q(Xt, [["render", Qt], ["__scopeId", "data-v-fd1a6cbe
     loading: "Carregando",
     showMore: "Mostrar mais"
   }
-}, as = 36, rs = J({
+}, cs = 36, ds = Z({
   name: "bento-listbox",
   components: {
-    BentoEmptyState: mt,
-    BentoListboxSingleSelect: Yt,
-    BentoListboxMultiSelect: Me,
-    BentoTypography: re,
-    BentoLoadingIndicator: bt,
-    BentoLoadingButton: ht
+    BentoEmptyState: vt,
+    BentoListboxSingleSelect: Ut,
+    BentoListboxMultiSelect: xe,
+    BentoTypography: de,
+    BentoLoadingIndicator: mt,
+    BentoLoadingButton: Ct
   },
-  directives: { BentoKeyboardNavigationDirective: he },
-  i18n: { messages: xe },
+  directives: { BentoKeyboardNavigationDirective: Ce },
+  i18n: { messages: Ge },
   props: {
     /**
      * Defines a string value that labels an interactive element.
@@ -1354,8 +1370,8 @@ const es = /* @__PURE__ */ q(Xt, [["render", Qt], ["__scopeId", "data-v-fd1a6cbe
      */
     lazyLoadType: {
       type: String,
-      default: oe.NONE,
-      validator: (e) => Object.values(oe).includes(e)
+      default: ne.NONE,
+      validator: (e) => Object.values(ne).includes(e)
     },
     /**
      * Indicates the listbox is loading filtered items.
@@ -1379,7 +1395,7 @@ const es = /* @__PURE__ */ q(Xt, [["render", Qt], ["__scopeId", "data-v-fd1a6cbe
      *
      * If enabled, hides the "Select all" checkbox in "multiple" mode.
      */
-    searching: Me.props.searching,
+    searching: xe.props.searching,
     /**
      * The `input` value.
      * Providing an empty string or empty array will select no options.
@@ -1407,109 +1423,109 @@ const es = /* @__PURE__ */ q(Xt, [["render", Qt], ["__scopeId", "data-v-fd1a6cbe
     g.TAB
   ],
   setup(e, { emit: t, slots: i }) {
-    const s = $([]), n = me(e, "items"), { t: o } = Ie({ messages: xe }), a = m(() => e.lazyLoadType !== oe.AUTOMATIC), p = m(() => e.lazyLoadType === oe.AUTOMATIC), S = () => {
-      var P;
-      return typeof (e == null ? void 0 : e.virtualScroll) == "object" && ((P = e == null ? void 0 : e.virtualScroll) != null && P.itemHeight) ? e.virtualScroll.itemHeight : as;
+    const s = k([]), r = fe(e, "items"), { t: o } = Ie({ messages: Ge }), n = m(() => e.lazyLoadType !== ne.AUTOMATIC), p = m(() => e.lazyLoadType === ne.AUTOMATIC), y = () => {
+      var M;
+      return typeof (e == null ? void 0 : e.virtualScroll) == "object" && ((M = e == null ? void 0 : e.virtualScroll) != null && M.itemHeight) ? e.virtualScroll.itemHeight : cs;
     }, {
-      containerRef: r,
+      containerRef: a,
       containerProps: u,
       onScroll: l,
       list: f,
       wrapperProps: E
-    } = Et(n, {
-      itemHeight: S(),
+    } = Ot(r, {
+      itemHeight: y(),
       // 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"
     }), T = m(
-      () => e.componentLoading !== void 0 || a.value ? "true" : void 0
-    ), R = m(
-      () => a.value && e.loading || e.componentLoading ? "true" : "false"
-    ), L = m(
-      () => a.value || e.componentLoading !== void 0 ? "polite" : void 0
-    ), B = m(
+      () => e.componentLoading !== void 0 || n.value ? "true" : void 0
+    ), $ = m(
+      () => n.value && e.loading || e.componentLoading ? "true" : "false"
+    ), P = m(
+      () => n.value || e.componentLoading !== void 0 ? "polite" : void 0
+    ), D = m(
       () => ({
         "aria-label": e.ariaLabel,
-        "aria-busy": R.value,
+        "aria-busy": $.value,
         "aria-atomic": T.value,
-        "aria-live": L.value
+        "aria-live": P.value
       })
-    ), G = m(
+    ), B = m(
       () => e.componentLoading ? {
-        ...B.value,
+        ...D.value,
         role: "alert"
       } : {}
-    ), k = (P) => (le) => {
-      t(P, le);
-    }, y = () => {
+    ), I = (M) => (ie) => {
+      t(M, ie);
+    }, S = () => {
       t(g.SHOW_MORE);
-    }, _ = vt(() => {
-      const P = r.value;
-      if (!P)
+    }, _ = ft(() => {
+      const M = a.value;
+      if (!M)
         return;
-      const le = Math.round(P.scrollTop) + P.clientHeight >= P.scrollHeight;
-      e.hasMoreItems && le && !e.loading && y();
-    }), I = () => {
+      const ie = Math.round(M.scrollTop) + M.clientHeight >= M.scrollHeight;
+      e.hasMoreItems && ie && !e.loading && S();
+    }), w = () => {
       p.value ? _() : l();
-    }, w = m(() => {
-      var P;
-      return ((P = e.items) == null ? void 0 : P.length) === 0;
-    }), W = m(
-      () => e.lazyLoadType === oe.BUTTON && e.hasMoreItems
-    ), Q = m(
-      () => e.loading ? Ne.LOADING : Ne.START
-    ), ge = m(() => e.loading ? o("loading") : o("showMore")), Ee = m(() => ({
+    }, Q = m(() => {
+      var M;
+      return ((M = e.items) == null ? void 0 : M.length) === 0;
+    }), N = m(
+      () => e.lazyLoadType === ne.BUTTON && e.hasMoreItems
+    ), U = m(
+      () => e.loading ? Pe.LOADING : Pe.START
+    ), W = m(() => e.loading ? o("loading") : o("showMore")), oe = m(() => ({
       ...e.emptyState,
       variant: "condensed"
     })), Oe = {
-      [g.SELECT]: k(g.SELECT),
-      [g.SPACE]: k(g.SPACE),
-      [g.TAB]: k(g.TAB),
-      [g.ENTER]: k(g.ENTER)
+      [g.SELECT]: I(g.SELECT),
+      [g.SPACE]: I(g.SPACE),
+      [g.TAB]: I(g.TAB),
+      [g.ENTER]: I(g.ENTER)
     };
     return {
       // Refs
-      listboxRef: r,
+      listboxRef: a,
       listboxItemRef: s,
       // a11y
-      ariaAttributes: B,
-      listboxContainerAttributes: G,
+      ariaAttributes: D,
+      listboxContainerAttributes: B,
       // Values
       containerProps: u,
-      isSearchResultEmpty: w,
-      limitedEmptyStateProps: Ee,
-      loadingButtonState: Q,
+      isSearchResultEmpty: Q,
+      limitedEmptyStateProps: oe,
+      loadingButtonState: U,
       slots: i,
-      shouldDisplayShowMoreButton: W,
-      showMoreButtonText: ge,
+      shouldDisplayShowMoreButton: N,
+      showMoreButtonText: W,
       virtualisedItems: f,
       wrapperProps: E,
       // Enums
-      BentoKeyboardNavigationKeyDownEvent: V,
+      BentoKeyboardNavigationKeyDownEvent: F,
       BentoListboxEvent: g,
       // Methods
-      onListboxContainerScroll: I,
-      onOptionSelected: k,
-      emitShowMore: y,
+      onListboxContainerScroll: w,
+      onOptionSelected: I,
+      emitShowMore: S,
       listboxListeners: Oe
     };
   }
-}), cs = ["id"], ds = {
+}), us = ["id"], bs = {
   key: 0,
   class: "b-listbox__loading-filtered-items"
-}, us = {
+}, ms = {
   key: 1,
   class: "b-listbox__empty-search-message"
-}, bs = {
+}, vs = {
   key: 2,
   class: "b-listbox__lazy-load"
-}, ms = {
+}, fs = {
   key: 3,
   class: "b-listbox__lazy-load"
 };
-function vs(e, t, i, s, n, o) {
+function ps(e, t, i, s, r, o) {
   var E;
-  const a = D("bento-loading-indicator"), p = D("bento-empty-state"), S = D("bento-typography"), r = D("bento-listbox-multi-select"), u = D("bento-listbox-single-select"), l = D("bento-loading-button"), f = Ye("bento-keyboard-navigation-directive");
-  return ae((v(), O("div", Y({
+  const n = L("bento-loading-indicator"), p = L("bento-empty-state"), y = L("bento-typography"), a = L("bento-listbox-multi-select"), u = L("bento-listbox-single-select"), l = L("bento-loading-button"), f = Ue("bento-keyboard-navigation-directive");
+  return ce((v(), O("div", Y({
     id: e.id,
     ref: "listboxRef",
     class: "b-listbox",
@@ -1519,21 +1535,21 @@ function vs(e, t, i, s, n, o) {
     "data-testid": "listbox-container",
     onScroll: t[0] || (t[0] = (...T) => e.onListboxContainerScroll && e.onListboxContainerScroll(...T))
   }), [
-    U("div", ie(be(e.wrapperProps)), [
-      e.componentLoading ? (v(), O("div", ds, [
-        x(a)
-      ])) : e.isSearchResultEmpty ? (v(), O("div", us, [
-        e.emptyState ? (v(), N(p, ie(Y({ key: 0 }, e.limitedEmptyStateProps)), null, 16)) : (v(), N(S, {
+    z("div", ae(ve(e.wrapperProps)), [
+      e.componentLoading ? (v(), O("div", bs, [
+        G(n)
+      ])) : e.isSearchResultEmpty ? (v(), O("div", ms, [
+        e.emptyState ? (v(), R(p, ae(Y({ key: 0 }, e.limitedEmptyStateProps)), null, 16)) : (v(), R(y, {
           key: 1,
           el: "span"
         }, {
           default: A(() => [
-            F(z(e.noResultsMessage), 1)
+            K(V(e.noResultsMessage), 1)
           ]),
           _: 1
         }))
-      ])) : (v(), O(se, { key: 2 }, [
-        e.multiple ? (v(), N(r, Y({
+      ])) : (v(), O(le, { key: 2 }, [
+        e.multiple ? (v(), R(a, Y({
           key: 0,
           ref: "listboxItemRef",
           "has-more-items": e.hasMoreItems
@@ -1544,14 +1560,14 @@ function vs(e, t, i, s, n, o) {
           "selected-values": e.selectedValue,
           searching: e.searching,
           "is-option-disabled": e.isOptionDisabled
-        }, te(e.listboxListeners)), ve({ _: 2 }, [
-          j(e.slots, (T, R) => ({
-            name: R,
-            fn: A((L) => [
-              K(e.$slots, R, ie(be(L)), void 0, !0)
+        }, se(e.listboxListeners)), pe({ _: 2 }, [
+          q(e.slots, (T, $) => ({
+            name: $,
+            fn: A((P) => [
+              j(e.$slots, $, ae(ve(P)), void 0, !0)
             ])
           }))
-        ]), 1040, ["has-more-items", "items", "lazy-load-type", "static-categories", "selected-values", "searching", "is-option-disabled"])) : (v(), N(u, Y({
+        ]), 1040, ["has-more-items", "items", "lazy-load-type", "static-categories", "selected-values", "searching", "is-option-disabled"])) : (v(), R(u, Y({
           key: 1,
           ref: "listboxItemRef",
           items: e.virtualisedItems
@@ -1559,35 +1575,35 @@ function vs(e, t, i, s, n, o) {
           "selected-value": e.selectedValue,
           "static-categories": e.staticCategories,
           "is-option-disabled": e.isOptionDisabled
-        }, te(e.listboxListeners)), ve({ _: 2 }, [
-          j(e.slots, (T, R) => ({
-            name: R,
-            fn: A((L) => [
-              K(e.$slots, R, ie(be(L)), void 0, !0)
+        }, se(e.listboxListeners)), pe({ _: 2 }, [
+          q(e.slots, (T, $) => ({
+            name: $,
+            fn: A((P) => [
+              j(e.$slots, $, ae(ve(P)), void 0, !0)
             ])
           }))
         ]), 1040, ["items", "selected-value", "static-categories", "is-option-disabled"])),
-        e.shouldDisplayShowMoreButton ? (v(), O("div", bs, [
-          x(l, {
+        e.shouldDisplayShowMoreButton ? (v(), O("div", vs, [
+          G(l, {
             state: e.loadingButtonState,
             variant: "secondary",
             onClickCapture: e.emitShowMore
           }, {
             default: A(() => [
-              F(z(e.showMoreButtonText), 1)
+              K(V(e.showMoreButtonText), 1)
             ]),
             _: 1
           }, 8, ["state", "onClickCapture"])
-        ])) : e.loading ? (v(), O("div", ms, [
-          x(a)
-        ])) : X("", !0)
+        ])) : e.loading ? (v(), O("div", fs, [
+          G(n)
+        ])) : J("", !0)
       ], 64))
     ], 16)
-  ], 16, cs)), [
+  ], 16, us)), [
     [f]
   ]);
 }
-const Rs = /* @__PURE__ */ q(rs, [["render", vs], ["__scopeId", "data-v-c9aaa0e3"]]), _e = (e, t) => {
+const Ms = /* @__PURE__ */ H(ds, [["render", ps], ["__scopeId", "data-v-c9aaa0e3"]]), _e = (e, t) => {
   for (const i of e) {
     if (i.value === t)
       return i;
@@ -1598,56 +1614,56 @@ const Rs = /* @__PURE__ */ q(rs, [["render", vs], ["__scopeId", "data-v-c9aaa0e3
     }
   }
   return null;
-}, fs = (e) => typeof e == "object" && e !== null && "value" in e && "label" in e, Ns = (e, t, i, s) => {
-  const n = $([]), o = $(), a = (u) => {
+}, gs = (e) => typeof e == "object" && e !== null && "value" in e && "label" in e, xs = (e, t, i, s) => {
+  const r = k([]), o = k(), n = (u) => {
     i.value ? o.value = u.map(({ value: l }) => l) : o.value = u.length > 0 ? u[0].value : null;
   }, p = (u) => {
     i.value ? o.value = u.map(({ value: l, label: f }) => ({ value: l, label: f })) : o.value = u.length > 0 ? { value: u[0].value, label: u[0].label } : null;
-  }, S = (u) => {
-    n.value = u, s != null && s.value ? p(u) : a(u);
-  }, r = () => {
-    n.value = [], o.value = null;
+  }, y = (u) => {
+    r.value = u, s != null && s.value ? p(u) : n(u);
+  }, a = () => {
+    r.value = [], o.value = null;
   };
-  return pe(
+  return ye(
     () => t.value,
     () => {
       if (!t.value && t.value !== 0) {
-        r();
+        a();
         return;
       }
-      const u = !Array.isArray(t.value), l = [...n.value];
-      r();
+      const u = !Array.isArray(t.value), l = [...r.value];
+      a();
       const f = (E) => {
-        if (fs(E))
-          n.value.push(E);
+        if (gs(E))
+          r.value.push(E);
         else {
           let T = _e(e.value, E);
-          T || (T = _e(l, E)), T || (T = { value: E, label: E.toString() }), n.value.push(T);
+          T || (T = _e(l, E)), T || (T = { value: E, label: E.toString() }), r.value.push(T);
         }
       };
       if (u) {
         const E = t.value;
-        f(E), s != null && s.value ? p(n.value) : a(n.value);
+        f(E), s != null && s.value ? p(r.value) : n(r.value);
         return;
       }
-      t.value.forEach(f), s != null && s.value ? p(n.value) : a(n.value);
+      t.value.forEach(f), s != null && s.value ? p(r.value) : n(r.value);
     },
     { immediate: !0 }
   ), {
     // Values
-    cachedSelectedListboxOptions: n,
+    cachedSelectedListboxOptions: r,
     cachedListboxSelectedValues: o,
     // Methods
-    resetCache: r,
-    setCachedValues: S
+    resetCache: a,
+    setCachedValues: y
   };
 };
 export {
-  oe as B,
+  ne as B,
   g as a,
-  Rs as b,
-  Ns as c,
-  Ve as d,
-  ts as u
+  Ms as b,
+  xs as c,
+  Fe as d,
+  ls as u
 };
-//# sourceMappingURL=use-cached-selected-values.D7dOPJSO.js.map
+//# sourceMappingURL=use-cached-selected-values.Dyoz6cUK.js.map