@adyen/bento-vue3 1.97.0 → 1.98.0

package/dist/chunks/{dropdown.C97ShfXZ.js → dropdown.CGUBk0iO.js}

@@ -1,32 +1,32 @@
-import { computed as d, ref as $, onMounted as Ft, onUnmounted as Vt, watch as Se, defineComponent as Z, resolveComponent as K, openBlock as p, createElementBlock as E, createVNode as V, withCtx as _, createTextVNode as oe, toDisplayString as U, createElementVNode as q, renderSlot as Y, mergeProps as R, withKeys as fe, createCommentVNode as J, createBlock as N, withModifiers as Le, normalizeProps as re, guardReactiveProps as he, withDirectives as de, vShow as Re, nextTick as se, toRef as ae, resolveDirective as Et, toHandlers as ne, Fragment as ue, renderList as le, createSlots as me, normalizeClass as be, unref as b, useSlots as Ve, useAttrs as rt, toRefs as Ot, resolveDynamicComponent as Lt, inject as dt } from "vue";
-import { B as Ie, d as st } from "./typography.B3J6_tYk.js";
+import { computed as d, ref as w, onMounted as Vt, onUnmounted as zt, watch as Ce, defineComponent as Z, resolveComponent as K, openBlock as p, createElementBlock as E, createVNode as F, withCtx as k, createTextVNode as oe, toDisplayString as Y, createElementVNode as W, renderSlot as j, mergeProps as M, withKeys as me, createCommentVNode as J, createBlock as N, withModifiers as Le, normalizeProps as ce, guardReactiveProps as Se, withDirectives as ue, vShow as Ne, nextTick as ne, toRef as ae, resolveDirective as Ot, toHandlers as ie, Fragment as pe, renderList as le, createSlots as ve, normalizeClass as fe, unref as b, useSlots as Ge, useAttrs as dt, toRefs as Lt, resolveDynamicComponent as It, inject as ct } from "vue";
+import { B as Ie, d as nt } from "./typography.B3J6_tYk.js";
 import { g as Oe } from "./generate-uid.DBWe4g6T.js";
-import { u as zt } from "./aria-label.CaUURpnB.js";
+import { u as Gt } from "./aria-label.CaUURpnB.js";
 import { u as ke } from "./index.B875RXHM.js";
-import { u as Gt } from "./form-field.D_2g7vaP.js";
-import { u as Kt } from "./use-form-layout-loading.CWbjZiwP.js";
-import { u as It } from "./use-has-slot.CyMiImRQ.js";
-import { B as Ut } from "./directive.D1-d-C2K.js";
-import { B as H, a as Fe } from "./keyboard-navigation.DWmhelVv.js";
-import { B as qt } from "./loading-indicator.BPol9I84.js";
-import { B as Yt } from "./empty-state.DT4sFyjB.js";
-import { o as Wt } from "./resize.Bqks3WUm.js";
-import { C as Ye, N as jt } from "./minus-small.CnYLTuSv.js";
-import { C as Ht } from "./checkmark-small.CRuZauJc.js";
+import { u as Kt } from "./form-field.D_2g7vaP.js";
+import { u as Ut } from "./use-form-layout-loading.CWbjZiwP.js";
+import { u as Tt } from "./use-has-slot.CyMiImRQ.js";
+import { B as qt } from "./directive.D1-d-C2K.js";
+import { B as H, a as ze } from "./keyboard-navigation.DWmhelVv.js";
+import { B as Yt } from "./loading-indicator.BPol9I84.js";
+import { B as Wt } from "./empty-state.DT4sFyjB.js";
+import { o as jt } from "./resize.Bqks3WUm.js";
+import { C as We, N as Ht } from "./minus-small.CnYLTuSv.js";
+import { C as Jt } from "./checkmark-small.CRuZauJc.js";
 /* empty css              */
 import { _ as ee } from "./_plugin-vue_export-helper.CHgC5LLL.js";
-import { B as Jt } from "./chip.DFldnqfz.js";
-import { C as Tt } from "./chevron-down.XeE-LBV_.js";
-import { C as At } from "./chevron-up.Cmgl2a3x.js";
-import { a as Xt, b as bt, h as Zt, e as Qt } from "./button-actions.CWmTl4cF.js";
-import { F as el } from "./field-label.CLV3nSzz.js";
-import { P as ft } from "./popper-container.BH4WxeUj.js";
-import { E as tl } from "./error-message.Dyvrw6ZB.js";
-import { C as ll } from "./cross-circle-fill.BWCKKn0E.js";
-import { C as ol } from "./cross-circle-fill-small.H1wH-vcZ.js";
-import { s as Be } from "./events.BQOQSSb7.js";
+import { B as Xt } from "./chip.DFldnqfz.js";
+import { C as At } from "./chevron-down.XeE-LBV_.js";
+import { C as $t } from "./chevron-up.Cmgl2a3x.js";
+import { a as Zt, b as ft, h as Qt, e as el } from "./button-actions.CgZbPzhi.js";
+import { F as tl } from "./field-label.yQ_2Qg88.js";
+import { P as mt } from "./popper-container.DRt5hgY8.js";
+import { E as ll } from "./error-message.Dyvrw6ZB.js";
+import { C as ol } from "./cross-circle-fill.BWCKKn0E.js";
+import { C as al } from "./cross-circle-fill-small.H1wH-vcZ.js";
+import { s as Re } from "./events.BQOQSSb7.js";
 import "../assets/dropdown.css";
-const $t = (e, l, n, o) => {
+const wt = (e, l, n, o) => {
   const a = d(
     () => !!e.value?.length && e.value?.length === l.value.length
   ), s = d(() => e.value == null || e.value.length === 0 ? !1 : e.value?.length !== l.value.length);
@@ -38,73 +38,73 @@ const $t = (e, l, n, o) => {
     }
   };
 };
-function al(e, { disabled: l, itemHeight: n, overscan: o = 5, prefixHeight: a }) {
-  const s = $(null), t = $([]), i = $(0), g = $(0), c = $(0);
+function sl(e, { disabled: l, itemHeight: n, overscan: o = 5, prefixHeight: a }) {
+  const s = w(null), t = w([]), i = w(0), h = w(0), c = w(0);
   let u;
   const r = d(() => {
-    const C = typeof n == "number" ? e.value.length * n : e.value.reduce((B, k, w) => B + n(w), 0), T = typeof n == "number" ? i.value * n : e.value.slice(0, i.value).reduce((B, k, w) => B + n(w), 0);
+    const C = typeof n == "number" ? e.value.length * n : e.value.reduce((B, D, A) => B + n(A), 0), I = typeof n == "number" ? i.value * n : e.value.slice(0, i.value).reduce((B, D, A) => B + n(A), 0);
     return {
       style: {
-        marginTop: `${T}px`,
-        height: `${C - T}px`
+        marginTop: `${I}px`,
+        height: `${C - I}px`
       }
     };
-  }), m = () => {
-    const C = a?.value ?? 0, T = Math.max(s.value.scrollTop - C, 0);
+  }), f = () => {
+    const C = a?.value ?? 0, I = Math.max(s.value.scrollTop - C, 0);
     if (typeof n == "number")
-      return Math.floor(T / n);
-    let B = 0, k = 0;
-    for (let w = 0; w < e.value.length; w += 1) {
-      const F = n(w);
-      if (B += F, B >= T) {
-        k = w;
+      return Math.floor(I / n);
+    let B = 0, D = 0;
+    for (let A = 0; A < e.value.length; A += 1) {
+      const P = n(A);
+      if (B += P, B >= I) {
+        D = A;
         break;
       }
     }
-    return k;
+    return D;
   }, v = () => {
     if (c.value = s.value.clientHeight, typeof n == "number")
       return Math.ceil(c.value / n);
     const C = i.value ?? 0;
-    let T = 0, B = 0;
-    for (let k = C; k < e.value.length; k += 1) {
-      const w = n(k);
-      if (T += w, B = k, T > c.value)
+    let I = 0, B = 0;
+    for (let D = C; D < e.value.length; D += 1) {
+      const A = n(D);
+      if (I += A, B = D, I > c.value)
         break;
     }
     return B - C;
-  }, O = () => {
+  }, L = () => {
     if (s.value) {
       const C = v();
-      i.value = m(), g.value = Math.min(i.value + C + o, e.value.length), t.value = e.value.slice(i.value, g.value);
+      i.value = f(), h.value = Math.min(i.value + C + o, e.value.length), t.value = e.value.slice(i.value, h.value);
     }
-  }, D = () => {
-    O();
+  }, _ = () => {
+    L();
   };
-  l || (Ft(() => {
-    s.value && (c.value = s.value.clientHeight, u = Wt(s.value, ({ clientHeight: C }) => {
-      c.value = C, O();
-    }), O());
-  }), Vt(() => {
+  l || (Vt(() => {
+    s.value && (c.value = s.value.clientHeight, u = jt(s.value, ({ clientHeight: C }) => {
+      c.value = C, L();
+    }), L());
+  }), zt(() => {
     u?.disconnect();
-  }), Se(
+  }), Ce(
     () => e.value,
     () => {
-      O();
+      L();
     }
   ));
-  const y = {
+  const g = {
     ref: s,
     style: { overflowY: "auto" }
-  }, z = (C) => {
+  }, V = (C) => {
     if (!s.value)
       return;
-    const T = typeof n == "number" ? C * n : e.value.slice(0, C).reduce((M, W, G) => M + n(G), 0), B = typeof n == "number" ? n : n(C), k = T + B, { scrollTop: w, clientHeight: F } = s.value, I = w + F;
-    k > I ? s.value.scrollTop = F > 0 ? k - F : T : T < w && (s.value.scrollTop = T), O();
+    const I = typeof n == "number" ? C * n : e.value.slice(0, C).reduce(($, z, G) => $ + n(G), 0), B = typeof n == "number" ? n : n(C), D = I + B, { scrollTop: A, clientHeight: P } = s.value, x = A + P;
+    D > x ? s.value.scrollTop = P > 0 ? D - P : I : I < A && (s.value.scrollTop = I), L();
   };
   return l ? {
     containerRef: s,
-    containerProps: y,
+    containerProps: g,
     // eslint-disable-next-line @typescript-eslint/no-empty-function
     onScroll: () => {
     },
@@ -112,19 +112,19 @@ function al(e, { disabled: l, itemHeight: n, overscan: o = 5, prefixHeight: a })
     // eslint-disable-next-line @typescript-eslint/no-empty-function
     scrollToIndex: () => {
     },
-    startIndex: $(0)
+    startIndex: w(0)
   } : {
     containerRef: s,
-    containerProps: y,
-    onScroll: D,
+    containerProps: g,
+    onScroll: _,
     list: t,
     wrapperProps: r,
-    scrollToIndex: z,
+    scrollToIndex: V,
     startIndex: i
   };
 }
-var f = /* @__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))(f || {}), Ee = /* @__PURE__ */ ((e) => (e.AUTOMATIC = "automatic", e.BUTTON = "button", e.NONE = "none", e))(Ee || {});
-const sl = Z({
+var y = /* @__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))(y || {}), Ee = /* @__PURE__ */ ((e) => (e.AUTOMATIC = "automatic", e.BUTTON = "button", e.NONE = "none", e))(Ee || {});
+const nl = Z({
   name: "bento-listbox-static-category",
   components: {
     BentoTypography: Ie
@@ -138,31 +138,31 @@ const sl = Z({
       required: !0
     }
   }
-}), nl = ["aria-label"];
-function il(e, l, n, o, a, s) {
+}), il = ["aria-label"];
+function rl(e, l, n, o, a, s) {
   const t = K("bento-typography");
   return p(), E("div", {
     class: "b-listbox-single-select-category",
     role: "group",
     "aria-label": e.categoryLabel
   }, [
-    V(t, {
+    F(t, {
       variant: "caption",
       el: "span",
       class: "b-listbox-single-select-category__label-text",
       "aria-hidden": "true"
     }, {
-      default: _(() => [
-        oe(U(e.categoryLabel), 1)
+      default: k(() => [
+        oe(Y(e.categoryLabel), 1)
       ]),
       _: 1
     }),
-    q("div", null, [
-      Y(e.$slots, "default", {}, void 0, !0)
+    W("div", null, [
+      j(e.$slots, "default", {}, void 0, !0)
     ])
-  ], 8, nl);
+  ], 8, il);
 }
-const rl = /* @__PURE__ */ ee(sl, [["render", il], ["__scopeId", "data-v-27c4e09a"]]), dl = Z({
+const dl = /* @__PURE__ */ ee(nl, [["render", rl], ["__scopeId", "data-v-27c4e09a"]]), cl = Z({
   name: "bento-listbox-option",
   props: {
     /**
@@ -174,7 +174,7 @@ const rl = /* @__PURE__ */ ee(sl, [["render", il], ["__scopeId", "data-v-27c4e09
      */
     selected: { type: Boolean, default: !1 }
   },
-  emits: [f.CLICK, f.ENTER, f.SPACE, f.TAB],
+  emits: [y.CLICK, y.ENTER, y.SPACE, y.TAB],
   setup(e, { emit: l }) {
     const n = d(() => ({
       "b-listbox-option--disabled": e.disabled,
@@ -183,12 +183,12 @@ const rl = /* @__PURE__ */ ee(sl, [["render", il], ["__scopeId", "data-v-27c4e09
     return {
       // Enums
       BentoKeyboardNavigationKeyDownEvent: H,
-      BentoListboxEvent: f,
+      BentoListboxEvent: y,
       // Values
       conditionalClasses: n,
       // Events
       onClick: (s) => {
-        l(f.CLICK, s);
+        l(y.CLICK, s);
       },
       onOptionSelected: (s, t) => {
         l(s, t);
@@ -196,49 +196,49 @@ const rl = /* @__PURE__ */ ee(sl, [["render", il], ["__scopeId", "data-v-27c4e09
     };
   }
 });
-function cl(e, l, n, o, a, s) {
-  return p(), E("div", R({
+function ul(e, l, n, o, a, s) {
+  return p(), E("div", M({
     class: ["b-listbox-option", e.conditionalClasses],
     role: "option"
   }, e.$attrs, {
     onClick: l[0] || (l[0] = (...t) => e.onClick && e.onClick(...t)),
     onKeydown: [
-      l[1] || (l[1] = fe((t) => e.onOptionSelected(e.BentoListboxEvent.ENTER, t), ["enter"])),
-      l[2] || (l[2] = fe((t) => e.onOptionSelected(e.BentoListboxEvent.SPACE, t), ["space"])),
-      l[3] || (l[3] = fe((t) => e.onOptionSelected(e.BentoListboxEvent.TAB, t), ["tab"]))
+      l[1] || (l[1] = me((t) => e.onOptionSelected(e.BentoListboxEvent.ENTER, t), ["enter"])),
+      l[2] || (l[2] = me((t) => e.onOptionSelected(e.BentoListboxEvent.SPACE, t), ["space"])),
+      l[3] || (l[3] = me((t) => e.onOptionSelected(e.BentoListboxEvent.TAB, t), ["tab"]))
     ]
   }), [
-    Y(e.$slots, "default", {}, void 0, !0)
+    j(e.$slots, "default", {}, void 0, !0)
   ], 16);
 }
-const We = /* @__PURE__ */ ee(dl, [["render", cl], ["__scopeId", "data-v-1495b1db"]]);
-let mt = 0;
-const ul = {
+const je = /* @__PURE__ */ ee(cl, [["render", ul], ["__scopeId", "data-v-1495b1db"]]);
+let vt = 0;
+const pl = {
   beforeCreate() {
-    this.uuid = mt.toString(), mt += 1;
+    this.uuid = vt.toString(), vt += 1;
   }
-}, pl = { key: 0 };
-function bl(e, l, n, o, a, s) {
-  return p(), E("svg", R({ role: "img" }, e.$attrs, {
+}, bl = { key: 0 };
+function fl(e, l, n, o, a, s) {
+  return p(), E("svg", M({ 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"] ? (p(), E("title", pl, U(e.$attrs["svg-title"]), 1)) : J("", !0),
-    l[0] || (l[0] = q("path", {
+    e.$attrs["svg-title"] ? (p(), E("title", bl, Y(e.$attrs["svg-title"]), 1)) : J("", !0),
+    l[0] || (l[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 fl = /* @__PURE__ */ ee(ul, [["render", bl]]), ml = Z({
+const ml = /* @__PURE__ */ ee(pl, [["render", fl]]), vl = Z({
   name: "bento-listbox-single-select-option",
   components: {
-    BentoListboxOption: We,
+    BentoListboxOption: je,
     BentoTypography: Ie,
-    CheckmarkIcon: fl
+    CheckmarkIcon: ml
   },
   props: {
     /**
@@ -258,7 +258,7 @@ const fl = /* @__PURE__ */ ee(ul, [["render", bl]]), ml = Z({
      */
     selected: { type: Boolean, default: !1 }
   },
-  emits: [f.ENTER, f.SELECT, f.SPACE, f.TAB],
+  emits: [y.ENTER, y.SELECT, y.SPACE, y.TAB],
   setup(e, { emit: l }) {
     const n = (t) => {
       e.disabled || l(t, e.option);
@@ -269,15 +269,15 @@ const fl = /* @__PURE__ */ ee(ul, [["render", bl]]), ml = Z({
       ariaSelected: a,
       tabIndex: s,
       // Enums
-      BentoListboxEvent: f,
+      BentoListboxEvent: y,
       // Events
       onOptionSelected: n
     };
   }
-}), vl = { class: "b-listbox-single-select-option__text" }, yl = { class: "b-listbox-single-select-option__check-icon" };
-function gl(e, l, n, o, a, s) {
-  const t = K("bento-typography"), i = K("checkmark-icon"), g = K("bento-listbox-option");
-  return p(), N(g, {
+}), yl = { class: "b-listbox-single-select-option__text" }, gl = { class: "b-listbox-single-select-option__check-icon" };
+function hl(e, l, n, o, a, s) {
+  const t = K("bento-typography"), i = K("checkmark-icon"), h = K("bento-listbox-option");
+  return p(), N(h, {
     class: "b-listbox-single-select-option",
     disabled: e.disabled,
     selected: e.selected,
@@ -289,12 +289,12 @@ function gl(e, l, n, o, a, s) {
     onSpacePressed: l[2] || (l[2] = Le((c) => e.onOptionSelected(e.BentoListboxEvent.SPACE), ["prevent"])),
     onTabPressed: l[3] || (l[3] = (c) => e.onOptionSelected(e.BentoListboxEvent.TAB))
   }, {
-    default: _(() => [
-      Y(e.$slots, "default", re(he(e.option)), () => [
-        q("span", vl, [
-          V(t, { el: "span" }, {
-            default: _(() => [
-              oe(U(e.option.label), 1)
+    default: k(() => [
+      j(e.$slots, "default", ce(Se(e.option)), () => [
+        W("span", yl, [
+          F(t, { el: "span" }, {
+            default: k(() => [
+              oe(Y(e.option.label), 1)
             ]),
             _: 1
           }),
@@ -303,24 +303,24 @@ function gl(e, l, n, o, a, s) {
             class: "b-listbox-single-select-option__description",
             el: "span"
           }, {
-            default: _(() => [
-              oe(U(e.option.description), 1)
+            default: k(() => [
+              oe(Y(e.option.description), 1)
             ]),
             _: 1
           })) : J("", !0)
         ])
       ], !0),
-      q("span", yl, [
-        de(V(i, { "svg-title": "selected" }, null, 512), [
-          [Re, e.selected]
+      W("span", gl, [
+        ue(F(i, { "svg-title": "selected" }, null, 512), [
+          [Ne, e.selected]
         ])
       ])
     ]),
     _: 3
   }, 8, ["disabled", "selected", "aria-selected", "aria-disabled", "tabindex"]);
 }
-const hl = /* @__PURE__ */ ee(ml, [["render", gl], ["__scopeId", "data-v-4f41af07"]]), kt = ({ items: e, totalItemCount: l }, n) => {
-  const o = d(() => l?.value ? l.value - 1 : e.value.length - 1), a = $(0), s = (v) => {
+const Sl = /* @__PURE__ */ ee(vl, [["render", hl], ["__scopeId", "data-v-4f41af07"]]), kt = ({ items: e, totalItemCount: l }, n) => {
+  const o = d(() => l?.value ? l.value - 1 : e.value.length - 1), a = w(0), s = (v) => {
     switch (v) {
       case "increase":
         a.value += 1;
@@ -329,18 +329,18 @@ const hl = /* @__PURE__ */ ee(ml, [["render", gl], ["__scopeId", "data-v-4f41af0
         a.value -= 1;
         break;
     }
-  }, t = ({ edgeCaseItem: v }, O) => {
-    a.value !== v && (s(O), n(a.value));
+  }, t = ({ edgeCaseItem: v }, L) => {
+    a.value !== v && (s(L), n(a.value));
   }, i = (v) => {
-    m(v), t(
+    f(v), t(
       {
         edgeCaseItem: o.value
       },
       "increase"
       /* INCREASE */
     );
-  }, g = (v) => {
-    m(v), t(
+  }, h = (v) => {
+    f(v), t(
       {
         edgeCaseItem: 0
       },
@@ -353,29 +353,29 @@ const hl = /* @__PURE__ */ ee(ml, [["render", gl], ["__scopeId", "data-v-4f41af0
     a.value = o.value, n(a.value);
   }, r = (v) => {
     a.value = v;
-  }, m = (v) => {
+  }, f = (v) => {
     v?.detail?.preventDefault();
   };
   return {
     moveToFirstElement: c,
     moveToLastElement: u,
     moveToNextElement: i,
-    moveToPreviousElement: g,
+    moveToPreviousElement: h,
     setListboxFocusedIndex: r,
-    preventDefault: m,
+    preventDefault: f,
     focusedIndex: a
   };
-}, ct = (e, l, n = $("option"), o = !0) => {
-  const a = $([]), s = async () => {
+}, ut = (e, l, n = w("option"), o = !0) => {
+  const a = w([]), s = async () => {
     if (!e.value || e.value.nodeType === Node.COMMENT_NODE)
       return;
     const t = Array.from(e.value.querySelectorAll(`[role="${n.value}"]`));
     a.value = o ? t.filter((i) => i.checkVisibility()) : t;
   };
-  return Se(
+  return Ce(
     l,
     () => {
-      se(() => {
+      ne(() => {
         s();
       });
     },
@@ -384,13 +384,13 @@ const hl = /* @__PURE__ */ ee(ml, [["render", gl], ["__scopeId", "data-v-4f41af0
     visibleDomOptions: a,
     updateVisibleDomOptions: s
   };
-}, Sl = Z({
+}, Cl = Z({
   name: "bento-listbox-single-select",
   components: {
-    BentoListboxSingleSelectCategory: rl,
-    BentoListboxSingleSelectOption: hl
+    BentoListboxSingleSelectCategory: dl,
+    BentoListboxSingleSelectOption: Sl
   },
-  directives: { BentoKeyboardNavigationDirective: Fe },
+  directives: { BentoKeyboardNavigationDirective: ze },
   inheritAttrs: !1,
   props: {
     /**
@@ -444,64 +444,66 @@ const hl = /* @__PURE__ */ ee(ml, [["render", gl], ["__scopeId", "data-v-4f41af0
      */
     virtualScrollStartIndex: { type: Number, default: 0 }
   },
-  emits: [f.SELECT, f.ENTER, f.SPACE, f.TAB],
+  emits: [y.SELECT, y.ENTER, y.SPACE, y.TAB],
   setup(e, { emit: l, expose: n, slots: o, attrs: a }) {
-    const s = $(null), t = $([]), i = d(() => !!e.selectedValue?.length && e.selectedValue.at(0)), g = d(
+    const s = w(null), t = w([]), i = d(() => !!e.selectedValue?.length && e.selectedValue.at(0)), h = d(
       () => ({
         "aria-label": a["aria-label"]?.toString(),
         "aria-busy": a["aria-busy"]?.toString(),
         "aria-atomic": a["aria-atomic"]?.toString(),
         "aria-live": a["aria-live"]?.toString()
       })
-    ), c = d(() => !!e.items.some(({ items: I }) => !!I)), u = (I) => (M) => {
-      l(I, [M]);
-    }, { visibleDomOptions: r, updateVisibleDomOptions: m } = ct(
+    ), c = d(() => !!e.items.some(({ items: $ }) => !!$)), u = ($) => (z) => {
+      l($, [z]);
+    }, { visibleDomOptions: r, updateVisibleDomOptions: f } = ut(
       s,
       ae(e, "items"),
-      $("option"),
+      w("option"),
       !1
-    ), v = d(() => e.totalItemCount > 0), O = (I) => {
+    ), v = d(() => e.totalItemCount > 0), L = ($) => {
       if (!v.value)
         return;
-      const M = I.target;
-      if (M === s.value || M?.getAttribute("role") !== "option")
+      const z = $.target;
+      if (z === s.value || z?.getAttribute("role") !== "option")
         return;
-      const W = r.value.indexOf(M);
-      if (W !== -1) {
-        const G = W + e.virtualScrollStartIndex;
-        k(G);
+      const G = r.value.indexOf(z);
+      if (G !== -1) {
+        const R = G + e.virtualScrollStartIndex;
+        A(R);
       }
-    }, D = async (I) => {
+    }, _ = async ($) => {
       if (v.value && e.scrollToIndex) {
-        e.scrollToIndex(I), await se(), await m();
-        const M = I - e.virtualScrollStartIndex;
-        r.value[M]?.focus();
+        e.scrollToIndex($), await ne(), await f();
+        const z = $ - e.virtualScrollStartIndex;
+        r.value[z]?.focus();
       } else
-        r.value[I]?.focus();
-    }, y = async (I) => {
-      k(I), await D(I);
+        r.value[$]?.focus();
+    }, g = async ($) => {
+      A($), await _($);
+    }, V = async ($) => {
+      await f(), v.value && e.scrollToIndex ? e.scrollToIndex($) : r.value[$]?.scrollIntoView?.({ block: "nearest" });
     }, {
-      moveToNextElement: z,
-      moveToPreviousElement: C,
-      moveToFirstElement: T,
-      moveToLastElement: B,
-      setListboxFocusedIndex: k
+      moveToNextElement: C,
+      moveToPreviousElement: I,
+      moveToFirstElement: B,
+      moveToLastElement: D,
+      setListboxFocusedIndex: A
     } = kt(
       {
         items: r,
         totalItemCount: ae(e, "totalItemCount")
       },
-      D
-    ), w = {
-      [H.ARROW_UP]: C,
-      [H.ARROW_DOWN]: z,
-      [H.HOME]: T,
-      [H.END]: B
-    }, F = {
-      [f.SELECT]: u(f.SELECT),
-      [f.SPACE]: u(f.SPACE),
-      [f.TAB]: u(f.TAB),
-      [f.ENTER]: u(f.ENTER)
+      _
+    ), P = {
+      [H.ARROW_UP]: I,
+      [H.ARROW_DOWN]: C,
+      [H.HOME]: B,
+      [H.END]: D
+    }, x = {
+      [y.SELECT]: u(y.SELECT),
+      [y.SPACE]: u(y.SPACE),
+      [y.TAB]: u(y.TAB),
+      [y.ENTER]: u(y.ENTER)
     };
     return n({
       /**
@@ -513,45 +515,50 @@ const hl = /* @__PURE__ */ ee(ml, [["render", gl], ["__scopeId", "data-v-4f41af0
        * 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: k,
+      setListboxFocusedIndex: A,
       /**
        * Navigates to an item by global index, handling virtual scroll if enabled.
        * Scrolls the virtual list and focuses the item.
        */
-      navigateToItem: y
+      navigateToItem: g,
+      /**
+       * Scrolls to an item by global index without changing focus.
+       * Used when the dropdown opens via click to bring the selected option into view.
+       */
+      scrollToItem: V
     }), {
       // Enums
-      BentoListboxEvent: f,
+      BentoListboxEvent: y,
       // Values
       listboxRef: s,
       listboxItemRef: t,
       selectedItem: i,
       slots: o,
-      ariaAttributes: g,
+      ariaAttributes: h,
       // Computed
       hasCategories: c,
       // Methods
       onOptionSelected: u,
       // Keyboard navigation
-      listboxListeners: w,
-      listboxOptionListeners: F,
+      listboxListeners: P,
+      listboxOptionListeners: x,
       // Virtual scroll focus management
-      handleVirtualScrollingFocus: O
+      handleVirtualScrollingFocus: L
     };
   }
 });
-function Cl(e, l, n, o, a, s) {
-  const t = K("bento-listbox-single-select-option"), i = K("bento-listbox-single-select-category"), g = Et("bento-keyboard-navigation-directive");
-  return de((p(), E("div", R({ ref: "listboxRef" }, e.ariaAttributes, { role: "listbox" }, ne(e.listboxListeners, !0), {
+function El(e, l, n, o, a, s) {
+  const t = K("bento-listbox-single-select-option"), i = K("bento-listbox-single-select-category"), h = Ot("bento-keyboard-navigation-directive");
+  return ue((p(), E("div", M({ ref: "listboxRef" }, e.ariaAttributes, { role: "listbox" }, ie(e.listboxListeners, !0), {
     onFocusin: l[0] || (l[0] = (...c) => e.handleVirtualScrollingFocus && e.handleVirtualScrollingFocus(...c))
   }), [
-    e.hasCategories && e.staticCategories ? (p(!0), E(ue, { key: 0 }, le(e.items, (c) => (p(), E(ue, null, [
+    e.hasCategories && e.staticCategories ? (p(!0), E(pe, { key: 0 }, le(e.items, (c) => (p(), E(pe, null, [
       c.items && c.items.length > 0 ? (p(), N(i, {
         key: `category-${c.value}`,
         "category-label": c.label
       }, {
-        default: _(() => [
-          (p(!0), E(ue, null, le(c.items, (u) => (p(), N(t, R({
+        default: k(() => [
+          (p(!0), E(pe, null, le(c.items, (u) => (p(), N(t, M({
             key: u.value,
             ref_for: !0,
             ref: "listboxItemRef",
@@ -559,17 +566,17 @@ function Cl(e, l, n, o, a, s) {
             option: u,
             disabled: e.isOptionDisabled ? e.isOptionDisabled(u) : null,
             selected: u.value === e.selectedItem.value
-          }, ne(e.listboxOptionListeners)), me({ _: 2 }, [
-            le(e.slots, (r, m) => ({
-              name: m,
-              fn: _((v) => [
-                Y(e.$slots, m, R({ ref_for: !0 }, v))
+          }, ie(e.listboxOptionListeners)), ve({ _: 2 }, [
+            le(e.slots, (r, f) => ({
+              name: f,
+              fn: k((v) => [
+                j(e.$slots, f, M({ ref_for: !0 }, v))
               ])
             }))
           ]), 1040, ["option", "disabled", "selected"]))), 128))
         ]),
         _: 2
-      }, 1032, ["category-label"])) : (p(), N(t, R({
+      }, 1032, ["category-label"])) : (p(), N(t, M({
         key: `option-${c.value}`,
         ref_for: !0,
         ref: "listboxItemRef",
@@ -577,15 +584,15 @@ function Cl(e, l, n, o, a, s) {
         option: c,
         disabled: e.isOptionDisabled ? e.isOptionDisabled(c) : null,
         selected: c.value === e.selectedItem.value
-      }, ne(e.listboxOptionListeners)), me({ _: 2 }, [
+      }, ie(e.listboxOptionListeners)), ve({ _: 2 }, [
         le(e.slots, (u, r) => ({
           name: r,
-          fn: _((m) => [
-            Y(e.$slots, r, R({ ref_for: !0 }, m))
+          fn: k((f) => [
+            j(e.$slots, r, M({ ref_for: !0 }, f))
           ])
         }))
       ]), 1040, ["option", "disabled", "selected"]))
-    ], 64))), 256)) : (p(!0), E(ue, { key: 1 }, le(e.items, (c) => (p(), N(t, R({
+    ], 64))), 256)) : (p(!0), E(pe, { key: 1 }, le(e.items, (c) => (p(), N(t, M({
       key: c.value,
       ref_for: !0,
       ref: "listboxItemRef",
@@ -593,46 +600,46 @@ function Cl(e, l, n, o, a, s) {
       option: c,
       disabled: e.isOptionDisabled ? e.isOptionDisabled(c) : null,
       selected: c.value === e.selectedItem.value
-    }, ne(e.listboxOptionListeners)), me({ _: 2 }, [
+    }, ie(e.listboxOptionListeners)), ve({ _: 2 }, [
       le(e.slots, (u, r) => ({
         name: r,
-        fn: _((m) => [
-          Y(e.$slots, r, R({ ref_for: !0 }, m))
+        fn: k((f) => [
+          j(e.$slots, r, M({ ref_for: !0 }, f))
         ])
       }))
     ]), 1040, ["option", "disabled", "selected"]))), 128))
   ], 16)), [
-    [g]
+    [h]
   ]);
 }
-const El = /* @__PURE__ */ ee(Sl, [["render", Cl]]);
-let vt = 0;
-const Ol = {
+const Ol = /* @__PURE__ */ ee(Cl, [["render", El]]);
+let yt = 0;
+const Ll = {
   beforeCreate() {
-    this.uuid = vt.toString(), vt += 1;
+    this.uuid = yt.toString(), yt += 1;
   }
-}, Ll = { key: 0 };
-function Il(e, l, n, o, a, s) {
-  return p(), E("svg", R({ role: "img" }, e.$attrs, {
+}, Il = { key: 0 };
+function Tl(e, l, n, o, a, s) {
+  return p(), E("svg", M({ 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"] ? (p(), E("title", Ll, U(e.$attrs["svg-title"]), 1)) : J("", !0),
-    l[0] || (l[0] = q("path", {
+    e.$attrs["svg-title"] ? (p(), E("title", Il, Y(e.$attrs["svg-title"]), 1)) : J("", !0),
+    l[0] || (l[0] = W("path", {
       fill: "#001222",
       d: "M9.69043 5.75L4.62988 10.8105L1.56934 7.75L2.62988 6.68945L4.62988 8.68945L8.62988 4.68945L9.69043 5.75Z"
     }, null, -1)),
-    l[1] || (l[1] = q("path", {
+    l[1] || (l[1] = W("path", {
       fill: "#001222",
       d: "M13.9307 5.75L8.87012 10.8105L7.80957 9.75L12.8701 4.68945L13.9307 5.75Z"
     }, null, -1))
   ], 16);
 }
-const Tl = /* @__PURE__ */ ee(Ol, [["render", Il]]), Al = {}, $l = /* @__PURE__ */ Z({
-  ...Al,
+const Al = /* @__PURE__ */ ee(Ll, [["render", Tl]]), $l = {}, wl = /* @__PURE__ */ Z({
+  ...$l,
   __name: "decorative-checkbox",
   props: {
     disabled: { type: Boolean, default: !1 },
@@ -642,41 +649,41 @@ const Tl = /* @__PURE__ */ ee(Ol, [["render", Il]]), Al = {}, $l = /* @__PURE__
   },
   setup(e) {
     const l = e, n = d(() => ({
-      [`b-checkbox-input--${Ye.DISABLED}`]: l.disabled
+      [`b-checkbox-input--${We.DISABLED}`]: l.disabled
     })), o = d(() => ({
-      [`b-checkbox-input__outline--${Ye.UNCHECKED}`]: !l.checked && !l.indeterminate && !l.allSelected,
-      [`b-checkbox-input__outline--${Ye.CHECKED}`]: (l.checked || l.allSelected) && !l.indeterminate,
-      [`b-checkbox-input__outline--${Ye.INDETERMINATE}`]: l.indeterminate
+      [`b-checkbox-input__outline--${We.UNCHECKED}`]: !l.checked && !l.indeterminate && !l.allSelected,
+      [`b-checkbox-input__outline--${We.CHECKED}`]: (l.checked || l.allSelected) && !l.indeterminate,
+      [`b-checkbox-input__outline--${We.INDETERMINATE}`]: l.indeterminate
     }));
     return (a, s) => (p(), E("div", {
-      class: be(["b-checkbox-input", n.value]),
+      class: fe(["b-checkbox-input", n.value]),
       role: "presentation"
     }, [
-      a.indeterminate ? (p(), N(b(jt), {
+      a.indeterminate ? (p(), N(b(Ht), {
         key: 0,
         class: "b-checkbox-input__icon",
         "svg-title": "",
         "aria-hidden": "true"
-      })) : a.allSelected ? (p(), N(b(Tl), {
+      })) : a.allSelected ? (p(), N(b(Al), {
         key: 1,
         class: "b-checkbox-input__icon",
         "svg-title": "",
         "aria-hidden": "true",
         "data-testid": "decorative-checkbox-double-checkmark-icon"
-      })) : a.checked ? (p(), N(b(Ht), {
+      })) : a.checked ? (p(), N(b(Jt), {
         key: 2,
         class: "b-checkbox-input__icon",
         "svg-title": "",
         "aria-hidden": "true"
       })) : J("", !0),
-      q("div", {
-        class: be(["b-checkbox-input__outline", o.value])
+      W("div", {
+        class: fe(["b-checkbox-input__outline", o.value])
       }, null, 2)
     ], 2));
   }
-}), ut = /* @__PURE__ */ ee($l, [["__scopeId", "data-v-08d3142e"]]);
-var wt = /* @__PURE__ */ ((e) => (e.DISABLED = "disabled", e.STATIC_CATEGORY = "static-category", e))(wt || {}), $e = /* @__PURE__ */ ((e) => (e.SELECT_CATEGORY = "select-category", e.UNSELECT_CATEGORY = "unselect-category", e.TOGGLE_CATEGORY_VISIBILITY = "toggle-category-visibility", e))($e || {});
-const yt = {
+}), pt = /* @__PURE__ */ ee(wl, [["__scopeId", "data-v-08d3142e"]]);
+var _t = /* @__PURE__ */ ((e) => (e.DISABLED = "disabled", e.STATIC_CATEGORY = "static-category", e))(_t || {}), we = /* @__PURE__ */ ((e) => (e.SELECT_CATEGORY = "select-category", e.UNSELECT_CATEGORY = "unselect-category", e.TOGGLE_CATEGORY_VISIBILITY = "toggle-category-visibility", e))(we || {});
+const gt = {
   "de-DE": { categoryClosed: "{category} geschlossen", categoryOpened: "{category} geöffnet" },
   "en-GB": { categoryClosed: "{category} closed", categoryOpened: "{category} opened" },
   "en-US": { categoryClosed: "{category} closed", categoryOpened: "{category} opened" },
@@ -688,14 +695,14 @@ const yt = {
   "pt-BR": { categoryClosed: "{category} fechada", categoryOpened: "{categoria} aberta" },
   "zh-CN": { categoryClosed: "{category} 已关闭", categoryOpened: "{category} 已打开" }
 }, kl = Z({
-  i18n: { messages: yt },
+  i18n: { messages: gt },
   name: "bento-listbox-multi-select-category",
   components: {
     BentoTypography: Ie,
-    BentoListboxOption: We,
-    ChevronDownIcon: Tt,
-    ChevronUpIcon: At,
-    DecorativeCheckbox: ut
+    BentoListboxOption: je,
+    ChevronDownIcon: At,
+    ChevronUpIcon: $t,
+    DecorativeCheckbox: pt
   },
   props: {
     /**
@@ -741,90 +748,90 @@ const yt = {
     tabindex: { type: Number, default: -1 }
   },
   emits: [
-    $e.SELECT_CATEGORY,
-    $e.UNSELECT_CATEGORY,
-    $e.TOGGLE_CATEGORY_VISIBILITY
+    we.SELECT_CATEGORY,
+    we.UNSELECT_CATEGORY,
+    we.TOGGLE_CATEGORY_VISIBILITY
   ],
   setup(e, { emit: l }) {
-    const n = $(!1), { t: o } = ke({ messages: yt }), a = Oe("category-group"), s = Oe("category-name"), t = (I) => e.isOptionDisabled ? e.isOptionDisabled(I) : !1, i = d(
-      () => e.category.items.every((I) => t(I))
-    ), g = ae(e, "staticCategories"), c = d(() => n.value || e.staticCategories), u = d(() => ({
-      [`b-listbox-multi-select-category--${wt.DISABLED}`]: i.value
-    })), r = (I, M) => {
-      I.preventDefault(), n.value = M !== void 0 ? M : !n.value, l($e.TOGGLE_CATEGORY_VISIBILITY, e.category.value);
-    }, m = (I) => {
-      const M = t(I), W = e.selectedItemsList?.includes(I.value) || !1;
-      return { isDisabled: M, isPreSelected: W };
+    const n = w(!1), { t: o } = ke({ messages: gt }), a = Oe("category-group"), s = Oe("category-name"), t = (x) => e.isOptionDisabled ? e.isOptionDisabled(x) : !1, i = d(
+      () => e.category.items.every((x) => t(x))
+    ), h = ae(e, "staticCategories"), c = d(() => n.value || e.staticCategories), u = d(() => ({
+      [`b-listbox-multi-select-category--${_t.DISABLED}`]: i.value
+    })), r = (x, $) => {
+      x.preventDefault(), n.value = $ !== void 0 ? $ : !n.value, l(we.TOGGLE_CATEGORY_VISIBILITY, e.category.value);
+    }, f = (x) => {
+      const $ = t(x), z = e.selectedItemsList?.includes(x.value) || !1;
+      return { isDisabled: $, isPreSelected: z };
     }, v = d(
-      () => e.category.items.filter((I) => {
-        const { isDisabled: M, isPreSelected: W } = m(I);
-        return M && W || !M;
+      () => e.category.items.filter((x) => {
+        const { isDisabled: $, isPreSelected: z } = f(x);
+        return $ && z || !$;
       })
-    ), O = d(
+    ), L = d(
       () => v.value?.filter(
-        ({ value: I }) => e.selectedItemsList?.includes(I)
+        ({ value: x }) => e.selectedItemsList?.includes(x)
       )
-    ), D = d(() => {
-      const I = n.value ? "categoryOpened" : "categoryClosed";
-      return o(I, { category: e.category.label });
-    }), y = () => {
-      l($e.SELECT_CATEGORY);
-    }, z = () => {
-      l($e.UNSELECT_CATEGORY);
-    }, { isAllSelected: C, isIndeterminate: T, toggleSelectAll: B } = $t(
-      O,
+    ), _ = d(() => {
+      const x = n.value ? "categoryOpened" : "categoryClosed";
+      return o(x, { category: e.category.label });
+    }), g = () => {
+      l(we.SELECT_CATEGORY);
+    }, V = () => {
+      l(we.UNSELECT_CATEGORY);
+    }, { isAllSelected: C, isIndeterminate: I, toggleSelectAll: B } = wt(
+      L,
       v,
-      y,
-      z
-    ), k = d(() => T.value ? "mixed" : `${C.value}`), w = $(C.value), F = () => {
-      w.value = !w.value, B(w.value);
+      g,
+      V
+    ), D = d(() => I.value ? "mixed" : `${C.value}`), A = w(C.value), P = () => {
+      A.value = !A.value, B(A.value);
     };
-    return Se(C, () => {
-      w.value = C.value;
+    return Ce(C, () => {
+      A.value = C.value;
     }), {
       // Values
-      chevronTitle: D,
+      chevronTitle: _,
       conditionalClass: u,
       hasAllPropsDisabled: i,
       isOpen: n,
       isAllSelected: C,
-      isIndeterminate: T,
-      isStaticCategory: g,
+      isIndeterminate: I,
+      isStaticCategory: h,
       categoryGroupId: a,
       categoryNameId: s,
       // Computed
       showItemChildren: c,
-      ariaCheckedComputed: k,
+      ariaCheckedComputed: D,
       // Methods
-      handleSelectAll: F,
+      handleSelectAll: P,
       toggleOpen: r,
       toggleSelectAll: B
     };
   }
-}), wl = { class: "b-listbox-multi-select-category__label" }, _l = {
+}), _l = { class: "b-listbox-multi-select-category__label" }, Dl = {
   key: 1,
   class: "b-listbox-multi-select-category b-listbox-multi-select-category--static-category",
   "aria-hidden": "true"
-}, Dl = { class: "b-listbox-multi-select-category__label" }, Bl = ["id", "aria-label"];
-function xl(e, l, n, o, a, s) {
-  const t = K("decorative-checkbox"), i = K("bento-typography"), g = K("chevron-up-icon"), c = K("chevron-down-icon"), u = K("bento-listbox-option");
+}, xl = { class: "b-listbox-multi-select-category__label" }, Bl = ["id", "aria-label"];
+function Rl(e, l, n, o, a, s) {
+  const t = K("decorative-checkbox"), i = K("bento-typography"), h = K("chevron-up-icon"), c = K("chevron-down-icon"), u = K("bento-listbox-option");
   return p(), E("div", null, [
-    e.isStaticCategory ? (p(), E("div", _l, [
-      q("span", Dl, [
-        V(i, {
+    e.isStaticCategory ? (p(), E("div", Dl, [
+      W("span", xl, [
+        F(i, {
           el: "span",
           variant: "caption",
           class: "b-listbox-multi-select-category__label-text"
         }, {
-          default: _(() => [
-            oe(U(e.category.label), 1)
+          default: k(() => [
+            oe(Y(e.category.label), 1)
           ]),
           _: 1
         })
       ])
     ])) : (p(), N(u, {
       key: 0,
-      class: be(["b-listbox-multi-select-category__option", e.conditionalClass]),
+      class: fe(["b-listbox-multi-select-category__option", e.conditionalClass]),
       tabindex: e.tabindex,
       "aria-selected": e.ariaCheckedComputed !== "false",
       "aria-checked": e.ariaCheckedComputed,
@@ -837,34 +844,34 @@ function xl(e, l, n, o, a, s) {
       onEnterPressed: e.handleSelectAll,
       onSpacePressed: Le(e.handleSelectAll, ["prevent"]),
       onKeydown: [
-        l[1] || (l[1] = fe((r) => e.toggleOpen(r, !1), ["arrow-left", "native"])),
-        l[2] || (l[2] = fe((r) => e.toggleOpen(r, !0), ["arrow-right", "native"]))
+        l[1] || (l[1] = me((r) => e.toggleOpen(r, !1), ["arrow-left", "native"])),
+        l[2] || (l[2] = me((r) => e.toggleOpen(r, !0), ["arrow-right", "native"]))
       ]
     }, {
-      default: _(() => [
-        V(t, {
+      default: k(() => [
+        F(t, {
           indeterminate: e.isIndeterminate,
           disabled: e.hasAllPropsDisabled,
           checked: e.isAllSelected
         }, null, 8, ["indeterminate", "disabled", "checked"]),
-        q("span", wl, [
-          V(i, {
+        W("span", _l, [
+          F(i, {
             id: e.categoryNameId,
             el: "span",
             class: "b-listbox-multi-select-category__label-text"
           }, {
-            default: _(() => [
-              oe(U(e.category.label), 1)
+            default: k(() => [
+              oe(Y(e.category.label), 1)
             ]),
             _: 1
           }, 8, ["id"]),
-          q("div", {
+          W("div", {
             "aria-hidden": "true",
             class: "b-listbox-multi-select-category__label-chevron",
             "data-testid": "toggle-listbox",
             onClickCapture: l[0] || (l[0] = Le((...r) => e.toggleOpen && e.toggleOpen(...r), ["stop"]))
           }, [
-            e.isOpen ? (p(), N(g, {
+            e.isOpen ? (p(), N(h, {
               key: 0,
               "svg-title": e.chevronTitle
             }, null, 8, ["svg-title"])) : (p(), N(c, {
@@ -876,26 +883,26 @@ function xl(e, l, n, o, a, s) {
       ]),
       _: 1
     }, 8, ["class", "tabindex", "aria-selected", "aria-checked", "aria-disabled", "aria-expanded", "aria-owns", "aria-labelledby", "onClick", "onEnterPressed", "onSpacePressed"])),
-    de(q("div", {
+    ue(W("div", {
       id: e.categoryGroupId,
       role: "group",
       "aria-label": e.category.label
     }, [
-      Y(e.$slots, "default", {}, void 0, !0)
+      j(e.$slots, "default", {}, void 0, !0)
     ], 8, Bl), [
-      [Re, e.showItemChildren]
+      [Ne, e.showItemChildren]
     ])
   ]);
 }
-const Rl = /* @__PURE__ */ ee(kl, [["render", xl], ["__scopeId", "data-v-60c04867"]]);
-var ge = /* @__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))(ge || {});
-const Ml = Z({
+const Ml = /* @__PURE__ */ ee(kl, [["render", Rl], ["__scopeId", "data-v-60c04867"]]);
+var he = /* @__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))(he || {});
+const Nl = Z({
   name: "listbox-multi-select-options",
   components: {
-    BentoListboxOption: We,
+    BentoListboxOption: je,
     BentoTypography: Ie,
-    ListboxMultiSelectCategory: Rl,
-    DecorativeCheckbox: ut
+    ListboxMultiSelectCategory: Ml,
+    DecorativeCheckbox: pt
   },
   inheritAttrs: !1,
   props: {
@@ -965,20 +972,20 @@ const Ml = Z({
     }
   },
   emits: [
-    ge.TOGGLE_CHECKBOX_SELECTION,
-    ge.SELECT_CATEGORY,
-    ge.UNSELECT_CATEGORY,
-    ge.TOGGLE_CATEGORY_VISIBILITY
+    he.TOGGLE_CHECKBOX_SELECTION,
+    he.SELECT_CATEGORY,
+    he.UNSELECT_CATEGORY,
+    he.TOGGLE_CATEGORY_VISIBILITY
   ],
   setup(e, { emit: l }) {
     const n = (c) => {
-      e.isOptionDisabled(c) || l(ge.TOGGLE_CHECKBOX_SELECTION, c);
+      e.isOptionDisabled(c) || l(he.TOGGLE_CHECKBOX_SELECTION, c);
     }, o = (c) => !!c.items, a = (c) => {
       const u = e.isMultiLevel && e.searching;
       return c.description && (!e.isMultiLevel || u);
     }, s = (c) => c.items ? !!c.items.find((u) => e.selectedItemsList.includes(u.value)) : e.selectedItemsList.includes(c.value), t = (c) => {
       if (o(c)) {
-        const u = s(c) ? ge.UNSELECT_CATEGORY : ge.SELECT_CATEGORY;
+        const u = s(c) ? he.UNSELECT_CATEGORY : he.SELECT_CATEGORY;
         l(u, c);
       } else
         n(c);
@@ -996,40 +1003,40 @@ const Ml = Z({
       toggleSearchOption: t,
       computedTabindex: (c) => e.itemsIndex[c] === e.focusedIndex ? 0 : -1,
       // Enums
-      BentoListboxEvent: f,
-      ListboxMultiSelectOptionsEvent: ge
+      BentoListboxEvent: y,
+      ListboxMultiSelectOptionsEvent: he
     };
   }
-}), Nl = { class: "b-listbox-multi-select__option-text" }, Pl = { class: "b-listbox-multi-select__option-text" };
-function Fl(e, l, n, o, a, s) {
-  const t = K("decorative-checkbox"), i = K("bento-typography"), g = K("bento-listbox-option"), c = K("listbox-multi-select-options", !0), u = K("listbox-multi-select-category");
+}), Pl = { class: "b-listbox-multi-select__option-text" }, Fl = { class: "b-listbox-multi-select__option-text" };
+function Vl(e, l, n, o, a, s) {
+  const t = K("decorative-checkbox"), i = K("bento-typography"), h = K("bento-listbox-option"), c = K("listbox-multi-select-options", !0), u = K("listbox-multi-select-category");
   return p(), E("div", null, [
-    (p(!0), E(ue, null, le(e.items, (r) => (p(), E("div", {
+    (p(!0), E(pe, null, le(e.items, (r) => (p(), E("div", {
       key: `selected-${r.value}`
     }, [
-      e.searching && e.isMultiLevel ? (p(), N(g, {
+      e.searching && e.isMultiLevel ? (p(), N(h, {
         key: 0,
-        class: be(["b-listbox-multi-select-options", e.conditionalClasses]),
+        class: fe(["b-listbox-multi-select-options", e.conditionalClasses]),
         disabled: e.isOptionDisabled ? e.isOptionDisabled(r) : null,
         tabindex: e.computedTabindex(r.value),
         "aria-selected": `${e.isOptionSelected(r)}`,
         "aria-checked": `${e.isOptionSelected(r)}`,
         "aria-disabled": e.isOptionDisabled ? e.isOptionDisabled(r) : null,
         role: e.$attrs.role || "option",
-        onClick: (m) => e.toggleSearchOption(r),
-        onEnterPressed: (m) => e.toggleSearchOption(r),
-        onSpacePressed: Le((m) => e.toggleSearchOption(r), ["prevent"])
+        onClick: (f) => e.toggleSearchOption(r),
+        onEnterPressed: (f) => e.toggleSearchOption(r),
+        onSpacePressed: Le((f) => e.toggleSearchOption(r), ["prevent"])
       }, {
-        default: _(() => [
-          V(t, {
+        default: k(() => [
+          F(t, {
             disabled: e.isOptionDisabled ? e.isOptionDisabled(r) : null,
             checked: e.isOptionSelected(r)
           }, null, 8, ["disabled", "checked"]),
-          Y(e.$slots, "default", R({ ref_for: !0 }, r), () => [
-            q("span", Nl, [
-              V(i, { el: "span" }, {
-                default: _(() => [
-                  oe(U(r.label), 1)
+          j(e.$slots, "default", M({ ref_for: !0 }, r), () => [
+            W("span", Pl, [
+              F(i, { el: "span" }, {
+                default: k(() => [
+                  oe(Y(r.label), 1)
                 ]),
                 _: 2
               }, 1024),
@@ -1038,8 +1045,8 @@ function Fl(e, l, n, o, a, s) {
                 class: "b-listbox-multi-select__option-description",
                 el: "span"
               }, {
-                default: _(() => [
-                  oe(U(r.description), 1)
+                default: k(() => [
+                  oe(Y(r.description), 1)
                 ]),
                 _: 2
               }, 1024)) : J("", !0)
@@ -1047,7 +1054,7 @@ function Fl(e, l, n, o, a, s) {
           ], !0)
         ]),
         _: 2
-      }, 1032, ["class", "disabled", "tabindex", "aria-selected", "aria-checked", "aria-disabled", "role", "onClick", "onEnterPressed", "onSpacePressed"])) : (p(), E(ue, { key: 1 }, [
+      }, 1032, ["class", "disabled", "tabindex", "aria-selected", "aria-checked", "aria-disabled", "role", "onClick", "onEnterPressed", "onSpacePressed"])) : (p(), E(pe, { key: 1 }, [
         r.items ? (p(), N(u, {
           key: 0,
           category: r,
@@ -1055,12 +1062,12 @@ function Fl(e, l, n, o, a, s) {
           "is-option-disabled": e.isOptionDisabled,
           "selected-items-list": e.selectedItemsList,
           tabindex: e.computedTabindex(r.value),
-          onSelectCategory: (m) => e.$emit(e.ListboxMultiSelectOptionsEvent.SELECT_CATEGORY, r),
-          onUnselectCategory: (m) => e.$emit(e.ListboxMultiSelectOptionsEvent.UNSELECT_CATEGORY, r),
-          onToggleCategoryVisibility: l[1] || (l[1] = (m) => e.$emit(e.ListboxMultiSelectOptionsEvent.TOGGLE_CATEGORY_VISIBILITY, m))
+          onSelectCategory: (f) => e.$emit(e.ListboxMultiSelectOptionsEvent.SELECT_CATEGORY, r),
+          onUnselectCategory: (f) => e.$emit(e.ListboxMultiSelectOptionsEvent.UNSELECT_CATEGORY, r),
+          onToggleCategoryVisibility: l[1] || (l[1] = (f) => e.$emit(e.ListboxMultiSelectOptionsEvent.TOGGLE_CATEGORY_VISIBILITY, f))
         }, {
-          default: _(() => [
-            V(c, {
+          default: k(() => [
+            F(c, {
               "category-items": "",
               items: r.items,
               "is-option-disabled": e.isOptionDisabled,
@@ -1071,33 +1078,33 @@ function Fl(e, l, n, o, a, s) {
               "selected-items-list": e.selectedItemsList,
               searching: e.searching,
               role: e.$attrs.role || "option",
-              onToggleCheckboxSelection: l[0] || (l[0] = (m) => e.toggleCheckboxSelection(m))
+              onToggleCheckboxSelection: l[0] || (l[0] = (f) => e.toggleCheckboxSelection(f))
             }, 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"])) : (p(), N(g, {
+        }, 1032, ["category", "static-categories", "is-option-disabled", "selected-items-list", "tabindex", "onSelectCategory", "onUnselectCategory"])) : (p(), N(h, {
           key: 1,
-          class: be(["b-listbox-multi-select-options", e.conditionalClasses]),
+          class: fe(["b-listbox-multi-select-options", e.conditionalClasses]),
           disabled: e.isOptionDisabled ? e.isOptionDisabled(r) : null,
           tabindex: e.computedTabindex(r.value),
           "aria-selected": `${e.isOptionSelected(r)}`,
           "aria-checked": `${e.isOptionSelected(r)}`,
           "aria-disabled": e.isOptionDisabled ? e.isOptionDisabled(r) : null,
           role: e.$attrs.role || "option",
-          onClick: (m) => e.toggleCheckboxSelection(r),
-          onEnterPressed: (m) => e.toggleCheckboxSelection(r),
-          onSpacePressed: Le((m) => e.toggleCheckboxSelection(r), ["prevent"])
+          onClick: (f) => e.toggleCheckboxSelection(r),
+          onEnterPressed: (f) => e.toggleCheckboxSelection(r),
+          onSpacePressed: Le((f) => e.toggleCheckboxSelection(r), ["prevent"])
         }, {
-          default: _(() => [
-            V(t, {
+          default: k(() => [
+            F(t, {
               disabled: e.isOptionDisabled ? e.isOptionDisabled(r) : null,
               checked: e.isOptionSelected(r)
             }, null, 8, ["disabled", "checked"]),
-            Y(e.$slots, "default", R({ ref_for: !0 }, r), () => [
-              q("span", Pl, [
-                V(i, { el: "span" }, {
-                  default: _(() => [
-                    oe(U(r.label), 1)
+            j(e.$slots, "default", M({ ref_for: !0 }, r), () => [
+              W("span", Fl, [
+                F(i, { el: "span" }, {
+                  default: k(() => [
+                    oe(Y(r.label), 1)
                   ]),
                   _: 2
                 }, 1024),
@@ -1106,8 +1113,8 @@ function Fl(e, l, n, o, a, s) {
                   class: "b-listbox-multi-select__option-description",
                   el: "span"
                 }, {
-                  default: _(() => [
-                    oe(U(r.description), 1)
+                  default: k(() => [
+                    oe(Y(r.description), 1)
                   ]),
                   _: 2
                 }, 1024)) : J("", !0)
@@ -1120,13 +1127,13 @@ function Fl(e, l, n, o, a, s) {
     ]))), 128))
   ]);
 }
-const Vl = /* @__PURE__ */ ee(Ml, [["render", Fl], ["__scopeId", "data-v-237dfc58"]]), _t = (e) => {
+const zl = /* @__PURE__ */ ee(Nl, [["render", Vl], ["__scopeId", "data-v-237dfc58"]]), Dt = (e) => {
   const l = d(() => !!e.value?.find(({ items: o }) => !!o)), n = d(() => l.value ? e.value?.reduce((o, a) => (a.items ? o.push(...a.items.flat()) : o.push(a), o), []) : e.value);
   return {
     isMultiLevelSelect: l,
     flattenedItemsList: n
   };
-}, Dt = {
+}, xt = {
   "de-DE": { allSelected: "Alle ausgewählt ({total})", numberOfTotalSelected: "{number} von {total} ausgewählt", numbersSelected: "{number} ausgewählt", selectAll: "Alle auswählen ({total})" },
   "en-GB": { allSelected: "All selected ({total})", numberOfTotalSelected: "{number} of {total} selected", numbersSelected: "{number} selected", selectAll: "Select all ({total})" },
   "en-US": { allSelected: "All selected ({total})", numberOfTotalSelected: "{number} of {total} selected", numbersSelected: "{number} selected", selectAll: "Select all ({total})" },
@@ -1137,12 +1144,12 @@ const Vl = /* @__PURE__ */ ee(Ml, [["render", Fl], ["__scopeId", "data-v-237dfc5
   "ja-JP": { allSelected: "すべて選択 ({total})", numberOfTotalSelected: "{total}件中{number}件を選択済み", numbersSelected: "{number}件選択済み", selectAll: "すべて選択 ({total})" },
   "pt-BR": { allSelected: "Todos os selecionados ({total})", numberOfTotalSelected: "{number} de {total} selecionados", numbersSelected: "{number} selecionados", selectAll: "Selecionar tudo ({total})" },
   "zh-CN": { allSelected: "全部已选 ({total})", numberOfTotalSelected: "已选择 {number} 个，共 {total} 个", numbersSelected: "已选择 {number} 个", selectAll: "选择全部（{total}）个" }
-}, zl = { key: 0 }, Gl = ["role"], Kl = {
+}, Gl = { key: 0 }, Kl = ["role"], Ul = {
   key: 1,
   class: "b-listbox-multi-select__divider",
   "aria-hidden": "true"
-}, Ul = { i18n: { messages: Dt } }, ql = /* @__PURE__ */ Z({
-  ...Ul,
+}, ql = { i18n: { messages: xt } }, Yl = /* @__PURE__ */ Z({
+  ...ql,
   __name: "listbox-multi-select",
   props: {
     hasMoreItems: { type: Boolean, default: !1 },
@@ -1155,221 +1162,225 @@ const Vl = /* @__PURE__ */ ee(Ml, [["render", Fl], ["__scopeId", "data-v-237dfc5
   },
   emits: ["select"],
   setup(e, { expose: l, emit: n }) {
-    const o = e, a = n, { t: s, n: t } = ke({ messages: Dt }), i = Ve(), g = rt(), c = d(
+    const o = e, a = n, { t: s, n: t } = ke({ messages: xt }), i = Ge(), h = dt(), c = d(
       () => ({
-        "aria-label": g["aria-label"]?.toString(),
-        "aria-busy": g["aria-busy"]?.toString(),
-        "aria-atomic": g["aria-atomic"]?.toString(),
-        "aria-live": g["aria-live"]?.toString(),
+        "aria-label": h["aria-label"]?.toString(),
+        "aria-busy": h["aria-busy"]?.toString(),
+        "aria-atomic": h["aria-atomic"]?.toString(),
+        "aria-live": h["aria-live"]?.toString(),
         "aria-multiselectable": !0
       })
-    ), u = $(null), r = $(null), m = $(null), v = $(null), O = d(() => o.selectedValues.map(({ value: h }) => h)), { isMultiLevelSelect: D, flattenedItemsList: y } = _t(ae(o, "items")), z = d(() => D.value && !o.staticCategories), C = d(() => z.value ? "tree" : "listbox"), T = d(() => z.value ? "treeitem" : "option"), B = (h) => {
-      const A = o.isOptionDisabled(h), L = O.value?.includes(h.value) || !1;
-      return { isDisabled: A, isPreSelected: L };
-    }, k = d(() => {
-      if (o.searching && D)
+    ), u = w(null), r = w(null), f = w(null), v = w(null), L = d(() => o.selectedValues.map(({ value: S }) => S)), { isMultiLevelSelect: _, flattenedItemsList: g } = Dt(ae(o, "items")), V = d(() => _.value && !o.staticCategories), C = d(() => V.value ? "tree" : "listbox"), I = d(() => V.value ? "treeitem" : "option"), B = (S) => {
+      const T = o.isOptionDisabled(S), O = L.value?.includes(S.value) || !1;
+      return { isDisabled: T, isPreSelected: O };
+    }, D = d(() => {
+      if (o.searching && _)
         return o.items;
-      const h = y.value.filter((A) => {
-        const { isDisabled: L, isPreSelected: j } = B(A);
-        return L && j || !L;
+      const S = g.value.filter((T) => {
+        const { isDisabled: O, isPreSelected: U } = B(T);
+        return O && U || !O;
       });
-      return o.selectedValues.forEach((A) => {
-        h.find((L) => L.value === A.value) || h.push(A);
-      }), h;
-    }), w = d(
-      () => k.value?.filter((h) => h.items && D.value && o.searching ? h.items.filter(
-        (L) => (o.selectedValues ?? []).includes(L.value)
-      ).length === h.items.length : O.value?.includes(h.value))
-    ), F = () => D.value && !o.searching ? y.value.length : o.items.length, I = d(() => {
-      const h = k.value.length, A = F(), L = w.value?.length || 0;
-      return L === 0 ? s("selectAll", { total: t(h) }) : L === A ? s("allSelected", { total: t(A) }) : L <= A ? s("numberOfTotalSelected", { number: t(L), total: t(A) }) : s("numbersSelected", { number: t(L) });
-    }), M = (h) => {
-      const A = (j) => {
-        const { isDisabled: P, isPreSelected: S } = B(j);
-        return P && S || !P;
-      }, L = h.filter(A).filter((j) => !O.value.includes(j.value));
-      a("select", [...o.selectedValues, ...L]);
-    }, W = (h) => {
-      const A = (P) => {
-        const { isDisabled: S, isPreSelected: ce } = B(P);
-        return !(S && ce);
-      }, L = h.filter(A).map(({ value: P }) => P), j = o.selectedValues.filter((P) => !L?.includes(P.value));
-      a("select", j);
+      return o.selectedValues.forEach((T) => {
+        S.find((O) => O.value === T.value) || S.push(T);
+      }), S;
+    }), A = d(
+      () => D.value?.filter((S) => S.items && _.value && o.searching ? S.items.filter(
+        (O) => (o.selectedValues ?? []).includes(O.value)
+      ).length === S.items.length : L.value?.includes(S.value))
+    ), P = () => _.value && !o.searching ? g.value.length : o.items.length, x = d(() => {
+      const S = D.value.length, T = P(), O = A.value?.length || 0;
+      return O === 0 ? s("selectAll", { total: t(S) }) : O === T ? s("allSelected", { total: t(T) }) : O <= T ? s("numberOfTotalSelected", { number: t(O), total: t(T) }) : s("numbersSelected", { number: t(O) });
+    }), $ = (S) => {
+      const T = (U) => {
+        const { isDisabled: q, isPreSelected: Ae } = B(U);
+        return q && Ae || !q;
+      }, O = S.filter(T).filter((U) => !L.value.includes(U.value));
+      a("select", [...o.selectedValues, ...O]);
+    }, z = (S) => {
+      const T = (q) => {
+        const { isDisabled: Ae, isPreSelected: m } = B(q);
+        return !(Ae && m);
+      }, O = S.filter(T).map(({ value: q }) => q), U = o.selectedValues.filter((q) => !O?.includes(q.value));
+      a("select", U);
     }, G = () => {
-      M(y.value);
-    }, x = () => {
-      W(y.value);
-    }, { isAllSelected: Q, isIndeterminate: we, toggleSelectAll: Me } = $t(
-      w,
-      k,
+      $(g.value);
+    }, R = () => {
+      z(g.value);
+    }, { isAllSelected: Q, isIndeterminate: _e, toggleSelectAll: Pe } = wt(
+      A,
+      D,
       G,
-      x
-    ), _e = d(() => we.value ? "mixed" : `${Q.value}`), X = $(Q.value), ie = () => {
-      X.value = !X.value, Me(X.value);
+      R
+    ), De = d(() => _e.value ? "mixed" : `${Q.value}`), X = w(Q.value), re = () => {
+      X.value = !X.value, Pe(X.value);
     };
-    Se(Q, () => {
+    Ce(Q, () => {
       X.value = Q.value;
     });
-    const ze = (h) => {
-      M(h.items);
-    }, Te = (h) => {
-      W(h.items);
-    }, ve = (h, A) => {
-      let L = !1;
-      const j = o.selectedValues.filter(({ value: P }) => A.value === P ? (L = !0, !1) : !0);
-      L || j.push(A), a(h, j);
-    }, je = d(() => {
-      if (!D.value)
+    const Ke = (S) => {
+      $(S.items);
+    }, Te = (S) => {
+      z(S.items);
+    }, ye = (S, T) => {
+      let O = !1;
+      const U = o.selectedValues.filter(({ value: q }) => T.value === q ? (O = !0, !1) : !0);
+      O || U.push(T), a(S, U);
+    }, He = d(() => {
+      if (!_.value)
         return o.selectedValues;
-      const h = (P) => O.value.includes(P.value), A = (P) => !o.staticCategories && P.every((S) => h(S));
-      return o.items.flatMap(
-        (P) => P.items && !A(P.items) ? P.items : P
-      ).filter((P) => P.items ? !0 : h(P));
-    }), He = d(() => {
-      const h = ["automatic", "button"].includes(o.lazyLoadType), A = o.selectedValues?.length > 0 && w.value?.length !== y.value?.length;
-      return h && o.hasMoreItems ? !!o.selectedValues?.length : A;
-    }), Ne = d(() => ["automatic", "button"].includes(o.lazyLoadType) ? !o.hasMoreItems : !0), Ce = $([]), { visibleDomOptions: Ge, updateVisibleDomOptions: Je } = ct(
+      const S = (m) => L.value.includes(m.value), T = (m) => !o.staticCategories && m.every((se) => S(se)), O = o.items.flatMap(
+        (m) => m.items && !T(m.items) ? m.items : m
+      ), U = O.filter((m) => m.items ? !0 : S(m)), q = /* @__PURE__ */ new Set();
+      O.forEach((m) => {
+        q.add(m.value), m.items?.forEach((se) => q.add(se.value));
+      });
+      const Ae = o.selectedValues.filter((m) => !q.has(m.value));
+      return [...U, ...Ae];
+    }), Je = d(() => {
+      const S = ["automatic", "button"].includes(o.lazyLoadType), T = o.selectedValues?.length > 0 && A.value?.length !== g.value?.length;
+      return S && o.hasMoreItems ? !!o.selectedValues?.length : T;
+    }), xe = d(() => ["automatic", "button"].includes(o.lazyLoadType) ? !o.hasMoreItems : !0), ge = w([]), { visibleDomOptions: Fe, updateVisibleDomOptions: Xe } = ut(
       u,
       ae(o, "items"),
-      T
-    ), Xe = (h) => {
-      Ce.value.includes(h) ? Ce.value = Ce.value.filter((A) => A !== h) : Ce.value.push(h), se(() => {
-        Je();
+      I
+    ), Ze = (S) => {
+      ge.value.includes(S) ? ge.value = ge.value.filter((T) => T !== S) : ge.value.push(S), ne(() => {
+        Xe();
       });
-    }, Ze = (h) => {
-      Ge.value[h]?.focus();
+    }, Qe = (S) => {
+      Fe.value[S]?.focus();
     }, {
-      moveToNextElement: Qe,
-      moveToPreviousElement: Ke,
-      moveToFirstElement: et,
-      moveToLastElement: Ue,
-      preventDefault: qe,
-      focusedIndex: De,
-      setListboxFocusedIndex: Pe
+      moveToNextElement: et,
+      moveToPreviousElement: Ue,
+      moveToFirstElement: tt,
+      moveToLastElement: qe,
+      preventDefault: Ye,
+      focusedIndex: Be,
+      setListboxFocusedIndex: Ve
     } = kt(
       {
-        items: Ge
+        items: Fe
       },
-      Ze
-    ), tt = {
-      [H.ARROW_UP]: (h) => Ke(h),
-      [H.ARROW_DOWN]: (h) => Qe(h),
-      [H.HOME]: et,
-      [H.END]: Ue
+      Qe
+    ), lt = {
+      [H.ARROW_UP]: (S) => Ue(S),
+      [H.ARROW_DOWN]: (S) => et(S),
+      [H.HOME]: tt,
+      [H.END]: qe
     };
     l({
       /**
        * 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: Pe
+      setListboxFocusedIndex: Ve
     });
-    const lt = {
-      [H.ARROW_UP]: qe,
-      [H.ARROW_DOWN]: qe
-    }, ot = d(() => {
-      let h = Ne.value ? 1 : 0;
-      const A = {};
-      return o.items.forEach((L) => {
-        let j = Ce.value.includes(L.value);
-        L.items ? (o.staticCategories ? j = !0 : A[L.value] = h++, j && L.items.forEach((P) => A[P.value] = h++)) : A[L.value] = h++;
-      }), A;
+    const ot = {
+      [H.ARROW_UP]: Ye,
+      [H.ARROW_DOWN]: Ye
+    }, at = d(() => {
+      let S = xe.value ? 1 : 0;
+      const T = {};
+      return o.items.forEach((O) => {
+        let U = ge.value.includes(O.value);
+        O.items ? (o.staticCategories ? U = !0 : T[O.value] = S++, U && O.items.forEach((q) => T[q.value] = S++)) : T[O.value] = S++;
+      }), T;
     });
-    return (h, A) => (p(), E("div", {
+    return (S, T) => (p(), E("div", {
       ref_key: "listboxRef",
       ref: u,
       class: "b-listbox-multi-select"
     }, [
-      He.value ? (p(), E("div", zl, [
-        de((p(), E("ul", R({ class: "b-listbox-multi-select__chips" }, ne(lt, !0)), [
-          (p(!0), E(ue, null, le(je.value, (L) => (p(), E("li", {
-            key: L.value
+      Je.value ? (p(), E("div", Gl, [
+        ue((p(), E("ul", M({ class: "b-listbox-multi-select__chips" }, ie(ot, !0)), [
+          (p(!0), E(pe, null, le(He.value, (O) => (p(), E("li", {
+            key: O.value
           }, [
-            V(b(Jt), {
+            F(b(Xt), {
               ref_for: !0,
               ref_key: "selectedListboxItemsRef",
-              ref: m,
-              disabled: h.isOptionDisabled(L),
-              label: L.label,
+              ref: f,
+              disabled: S.isOptionDisabled(O),
+              label: O.label,
               condensed: "",
-              onClick: (j) => L.items ? Te(L) : ve("select", L)
+              onClick: (U) => O.items ? Te(O) : ye("select", O)
             }, null, 8, ["disabled", "label", "onClick"])
           ]))), 128))
         ], 16)), [
-          [b(Fe)]
+          [b(ze)]
         ]),
-        A[4] || (A[4] = q("hr", {
+        T[4] || (T[4] = W("hr", {
           class: "b-listbox-multi-select__divider",
           "aria-hidden": "true"
         }, null, -1))
       ])) : J("", !0),
-      de((p(), E("div", R(c.value, { role: C.value }, ne(tt, !0)), [
-        Ne.value ? (p(), N(b(We), {
+      ue((p(), E("div", M(c.value, { role: C.value }, ie(lt, !0)), [
+        xe.value ? (p(), N(b(je), {
           key: 0,
           ref_key: "selectAllListboxItemsRef",
           ref: r,
           class: "b-listbox-multi-select__option",
-          tabindex: b(De) === 0 ? 0 : -1,
-          "aria-selected": _e.value !== "false",
-          "aria-checked": _e.value,
-          role: T.value,
-          onClick: ie,
-          onEnterPressed: ie,
-          onSpacePressed: Le(ie, ["prevent"])
+          tabindex: b(Be) === 0 ? 0 : -1,
+          "aria-selected": De.value !== "false",
+          "aria-checked": De.value,
+          role: I.value,
+          onClick: re,
+          onEnterPressed: re,
+          onSpacePressed: Le(re, ["prevent"])
         }, {
-          default: _(() => [
-            V(b(ut), {
+          default: k(() => [
+            F(b(pt), {
               checked: b(Q),
-              indeterminate: b(we)
+              indeterminate: b(_e)
             }, null, 8, ["checked", "indeterminate"]),
-            V(b(Ie), { el: "span" }, {
-              default: _(() => [
-                oe(U(I.value), 1)
+            F(b(Ie), { el: "span" }, {
+              default: k(() => [
+                oe(Y(x.value), 1)
               ]),
               _: 1
             })
           ]),
           _: 1
         }, 8, ["tabindex", "aria-selected", "aria-checked", "role"])) : J("", !0),
-        Ne.value ? (p(), E("hr", Kl)) : J("", !0),
-        V(b(Vl), {
+        xe.value ? (p(), E("hr", Ul)) : J("", !0),
+        F(b(zl), {
           ref_key: "listboxItemsRef",
           ref: v,
-          items: h.items,
-          "is-option-disabled": h.isOptionDisabled,
-          "is-multi-level": b(D),
-          "static-categories": h.staticCategories,
-          searching: h.searching,
-          "selected-items-list": O.value,
-          "focused-index": b(De),
-          "items-index": ot.value,
-          role: T.value,
-          onToggleCheckboxSelection: A[0] || (A[0] = (L) => ve("select", L)),
-          onSelectCategory: ze,
+          items: S.items,
+          "is-option-disabled": S.isOptionDisabled,
+          "is-multi-level": b(_),
+          "static-categories": S.staticCategories,
+          searching: S.searching,
+          "selected-items-list": L.value,
+          "focused-index": b(Be),
+          "items-index": at.value,
+          role: I.value,
+          onToggleCheckboxSelection: T[0] || (T[0] = (O) => ye("select", O)),
+          onSelectCategory: Ke,
           onUnselectCategory: Te,
-          onToggleCategoryVisibility: Xe,
-          onSpacePressed: A[1] || (A[1] = (L) => ve(b(f).SPACE, L)),
-          onTabPressed: A[2] || (A[2] = (L) => ve(b(f).TAB, L)),
-          onEnterPressed: A[3] || (A[3] = (L) => ve(b(f).ENTER, L))
-        }, me({ _: 2 }, [
-          le(b(i), (L, j) => ({
-            name: j,
-            fn: _((P) => [
-              Y(h.$slots, j, re(he(P)), void 0, !0)
+          onToggleCategoryVisibility: Ze,
+          onSpacePressed: T[1] || (T[1] = (O) => ye(b(y).SPACE, O)),
+          onTabPressed: T[2] || (T[2] = (O) => ye(b(y).TAB, O)),
+          onEnterPressed: T[3] || (T[3] = (O) => ye(b(y).ENTER, O))
+        }, ve({ _: 2 }, [
+          le(b(i), (O, U) => ({
+            name: U,
+            fn: k((q) => [
+              j(S.$slots, U, ce(Se(q)), void 0, !0)
             ])
           }))
         ]), 1032, ["items", "is-option-disabled", "is-multi-level", "static-categories", "searching", "selected-items-list", "focused-index", "items-index", "role"])
-      ], 16, Gl)), [
-        [b(Fe)]
+      ], 16, Kl)), [
+        [b(ze)]
       ])
     ], 512));
   }
-}), gt = /* @__PURE__ */ ee(ql, [["__scopeId", "data-v-4abd31b6"]]), Bt = (e, l = 300) => {
+}), ht = /* @__PURE__ */ ee(Yl, [["__scopeId", "data-v-dc9c0984"]]), Bt = (e, l = 300) => {
   let n;
   return (...a) => {
     n && clearTimeout(n), n = setTimeout(() => e(...a), l);
   };
-}, ht = {
+}, St = {
   "de-DE": { loading: "Laden", showMore: "Mehr anzeigen" },
   "en-GB": { loading: "Loading", showMore: "Show more" },
   "en-US": { loading: "Loading", showMore: "Show more" },
@@ -1380,18 +1391,18 @@ const Vl = /* @__PURE__ */ ee(Ml, [["render", Fl], ["__scopeId", "data-v-237dfc5
   "ja-JP": { loading: "読み込み中", showMore: "さらに表示" },
   "pt-BR": { loading: "Carregando", showMore: "Mostrar mais" },
   "zh-CN": { loading: "正在加载", showMore: "显示更多" }
-}, Yl = 36, Wl = Z({
+}, Wl = 36, jl = Z({
   name: "bento-listbox",
   components: {
-    BentoEmptyState: Yt,
-    BentoListboxSingleSelect: El,
-    BentoListboxMultiSelect: gt,
+    BentoEmptyState: Wt,
+    BentoListboxSingleSelect: Ol,
+    BentoListboxMultiSelect: ht,
     BentoTypography: Ie,
-    BentoLoadingIndicator: qt,
-    BentoLoadingButton: Xt
+    BentoLoadingIndicator: Yt,
+    BentoLoadingButton: Zt
   },
-  directives: { BentoKeyboardNavigationDirective: Fe },
-  i18n: { messages: ht },
+  directives: { BentoKeyboardNavigationDirective: ze },
+  i18n: { messages: St },
   props: {
     /**
      * Defines a string value that labels an interactive element.
@@ -1472,7 +1483,7 @@ const Vl = /* @__PURE__ */ ee(Ml, [["render", Fl], ["__scopeId", "data-v-237dfc5
      *
      * If enabled, hides the "Select all" checkbox in "multiple" mode.
      */
-    searching: gt.props.searching,
+    searching: ht.props.searching,
     /**
      * The `input` value.
      * Providing an empty string or empty array will select no options.
@@ -1492,116 +1503,116 @@ const Vl = /* @__PURE__ */ ee(Ml, [["render", Fl], ["__scopeId", "data-v-237dfc5
     }
   },
   emits: [
-    f.SELECT,
-    f.SPACE,
-    f.SHOW_MORE,
-    f.ENTER,
-    f.ESCAPE,
-    f.TAB
+    y.SELECT,
+    y.SPACE,
+    y.SHOW_MORE,
+    y.ENTER,
+    y.ESCAPE,
+    y.TAB
   ],
   setup(e, { emit: l, slots: n }) {
-    const o = $([]), a = ae(e, "items"), { t: s } = ke({ messages: ht }), t = d(() => e.lazyLoadType !== Ee.AUTOMATIC), i = d(() => e.lazyLoadType === Ee.AUTOMATIC), g = () => typeof e?.virtualScroll == "object" && e?.virtualScroll?.itemHeight ? e.virtualScroll.itemHeight : Yl, c = !e?.multiple && e?.virtualScroll !== !1 && e?.lazyLoadType === "none", {
+    const o = w([]), a = ae(e, "items"), { t: s } = ke({ messages: St }), t = d(() => e.lazyLoadType !== Ee.AUTOMATIC), i = d(() => e.lazyLoadType === Ee.AUTOMATIC), h = () => typeof e?.virtualScroll == "object" && e?.virtualScroll?.itemHeight ? e.virtualScroll.itemHeight : Wl, c = !e?.multiple && e?.virtualScroll !== !1 && e?.lazyLoadType === "none", {
       containerRef: u,
       containerProps: r,
-      onScroll: m,
+      onScroll: f,
       list: v,
-      wrapperProps: O,
-      scrollToIndex: D,
-      startIndex: y
-    } = al(a, {
-      itemHeight: g(),
+      wrapperProps: L,
+      scrollToIndex: _,
+      startIndex: g
+    } = sl(a, {
+      itemHeight: h(),
       // Disable virtual scrolling if not enabled or if lazy loading is enabled or if multi-select
       disabled: !c
-    }), z = d(() => c ? a.value.length : 0), C = d(
+    }), V = d(() => c ? a.value.length : 0), C = d(
       () => e.componentLoading !== void 0 || t.value ? "true" : void 0
-    ), T = d(
+    ), I = d(
       () => t.value && e.loading || e.componentLoading ? "true" : "false"
     ), B = d(
       () => t.value || e.componentLoading !== void 0 ? "polite" : void 0
-    ), k = d(
+    ), D = d(
       () => ({
         "aria-label": e.ariaLabel,
-        "aria-busy": T.value,
+        "aria-busy": I.value,
         "aria-atomic": C.value,
         "aria-live": B.value
       })
-    ), w = d(
+    ), A = d(
       () => e.componentLoading ? {
-        ...k.value,
+        ...D.value,
         role: "alert"
       } : {}
-    ), F = (X) => (ie) => {
-      l(X, ie);
-    }, I = () => {
-      l(f.SHOW_MORE);
-    }, M = Bt(() => {
+    ), P = (X) => (re) => {
+      l(X, re);
+    }, x = () => {
+      l(y.SHOW_MORE);
+    }, $ = Bt(() => {
       const X = u.value;
       if (!X)
         return;
-      const ie = Math.round(X.scrollTop) + X.clientHeight >= X.scrollHeight;
-      e.hasMoreItems && ie && !e.loading && I();
-    }), W = () => {
-      i.value ? M() : m();
-    }, G = d(() => e.items?.length === 0), x = d(
+      const re = Math.round(X.scrollTop) + X.clientHeight >= X.scrollHeight;
+      e.hasMoreItems && re && !e.loading && x();
+    }), z = () => {
+      i.value ? $() : f();
+    }, G = d(() => e.items?.length === 0), R = d(
       () => e.lazyLoadType === Ee.BUTTON && e.hasMoreItems
     ), Q = d(
-      () => e.loading ? bt.LOADING : bt.START
-    ), we = d(() => e.loading ? s("loading") : s("showMore")), Me = d(() => ({
+      () => e.loading ? ft.LOADING : ft.START
+    ), _e = d(() => e.loading ? s("loading") : s("showMore")), Pe = d(() => ({
       ...e.emptyState,
       variant: "condensed"
-    })), _e = {
-      [f.SELECT]: F(f.SELECT),
-      [f.SPACE]: F(f.SPACE),
-      [f.TAB]: F(f.TAB),
-      [f.ENTER]: F(f.ENTER)
+    })), De = {
+      [y.SELECT]: P(y.SELECT),
+      [y.SPACE]: P(y.SPACE),
+      [y.TAB]: P(y.TAB),
+      [y.ENTER]: P(y.ENTER)
     };
     return {
       // Refs
       listboxRef: u,
       listboxItemRef: o,
       // a11y
-      ariaAttributes: k,
-      listboxContainerAttributes: w,
+      ariaAttributes: D,
+      listboxContainerAttributes: A,
       // Values
       containerProps: r,
       isSearchResultEmpty: G,
-      limitedEmptyStateProps: Me,
+      limitedEmptyStateProps: Pe,
       loadingButtonState: Q,
       slots: n,
-      shouldDisplayShowMoreButton: x,
-      showMoreButtonText: we,
+      shouldDisplayShowMoreButton: R,
+      showMoreButtonText: _e,
       virtualisedItems: v,
-      wrapperProps: O,
+      wrapperProps: L,
       // Virtual scroll
-      totalItemCount: z,
-      scrollToIndex: D,
-      virtualScrollStartIndex: y,
+      totalItemCount: V,
+      scrollToIndex: _,
+      virtualScrollStartIndex: g,
       // Enums
       BentoKeyboardNavigationKeyDownEvent: H,
-      BentoListboxEvent: f,
+      BentoListboxEvent: y,
       // Methods
-      onListboxContainerScroll: W,
-      onOptionSelected: F,
-      emitShowMore: I,
-      listboxListeners: _e
+      onListboxContainerScroll: z,
+      onOptionSelected: P,
+      emitShowMore: x,
+      listboxListeners: De
     };
   }
-}), jl = ["id"], Hl = {
+}), Hl = ["id"], Jl = {
   key: 0,
   class: "b-listbox__loading-filtered-items"
-}, Jl = {
+}, Xl = {
   key: 1,
   class: "b-listbox__empty-search-message"
-}, Xl = {
+}, Zl = {
   key: 2,
   class: "b-listbox__lazy-load"
-}, Zl = {
+}, Ql = {
   key: 3,
   class: "b-listbox__lazy-load"
 };
-function Ql(e, l, n, o, a, s) {
-  const t = K("bento-loading-indicator"), i = K("bento-empty-state"), g = K("bento-typography"), c = K("bento-listbox-multi-select"), u = K("bento-listbox-single-select"), r = K("bento-loading-button"), m = Et("bento-keyboard-navigation-directive");
-  return de((p(), E("div", R({
+function eo(e, l, n, o, a, s) {
+  const t = K("bento-loading-indicator"), i = K("bento-empty-state"), h = K("bento-typography"), c = K("bento-listbox-multi-select"), u = K("bento-listbox-single-select"), r = K("bento-loading-button"), f = Ot("bento-keyboard-navigation-directive");
+  return ue((p(), E("div", M({
     id: e.id,
     ref: "listboxRef",
     class: "b-listbox",
@@ -1611,21 +1622,21 @@ function Ql(e, l, n, o, a, s) {
     "data-testid": "listbox-container",
     onScroll: l[0] || (l[0] = (...v) => e.onListboxContainerScroll && e.onListboxContainerScroll(...v))
   }), [
-    q("div", re(he(e.wrapperProps)), [
-      e.componentLoading ? (p(), E("div", Hl, [
-        V(t)
-      ])) : e.isSearchResultEmpty ? (p(), E("div", Jl, [
-        e.emptyState ? (p(), N(i, re(R({ key: 0 }, e.limitedEmptyStateProps)), null, 16)) : (p(), N(g, {
+    W("div", ce(Se(e.wrapperProps)), [
+      e.componentLoading ? (p(), E("div", Jl, [
+        F(t)
+      ])) : e.isSearchResultEmpty ? (p(), E("div", Xl, [
+        e.emptyState ? (p(), N(i, ce(M({ key: 0 }, e.limitedEmptyStateProps)), null, 16)) : (p(), N(h, {
           key: 1,
           el: "span"
         }, {
-          default: _(() => [
-            oe(U(e.noResultsMessage), 1)
+          default: k(() => [
+            oe(Y(e.noResultsMessage), 1)
           ]),
           _: 1
         }))
-      ])) : (p(), E(ue, { key: 2 }, [
-        e.multiple ? (p(), N(c, R({
+      ])) : (p(), E(pe, { key: 2 }, [
+        e.multiple ? (p(), N(c, M({
           key: 0,
           ref: "listboxItemRef",
           "has-more-items": e.hasMoreItems
@@ -1636,14 +1647,14 @@ function Ql(e, l, n, o, a, s) {
           "selected-values": e.selectedValue,
           searching: e.searching,
           "is-option-disabled": e.isOptionDisabled
-        }, ne(e.listboxListeners)), me({ _: 2 }, [
-          le(e.slots, (v, O) => ({
-            name: O,
-            fn: _((D) => [
-              Y(e.$slots, O, re(he(D)), void 0, !0)
+        }, ie(e.listboxListeners)), ve({ _: 2 }, [
+          le(e.slots, (v, L) => ({
+            name: L,
+            fn: k((_) => [
+              j(e.$slots, L, ce(Se(_)), void 0, !0)
             ])
           }))
-        ]), 1040, ["has-more-items", "items", "lazy-load-type", "static-categories", "selected-values", "searching", "is-option-disabled"])) : (p(), N(u, R({
+        ]), 1040, ["has-more-items", "items", "lazy-load-type", "static-categories", "selected-values", "searching", "is-option-disabled"])) : (p(), N(u, M({
           key: 1,
           ref: "listboxItemRef",
           items: e.virtualisedItems,
@@ -1654,56 +1665,56 @@ function Ql(e, l, n, o, a, s) {
           "selected-value": e.selectedValue,
           "static-categories": e.staticCategories,
           "is-option-disabled": e.isOptionDisabled
-        }, ne(e.listboxListeners)), me({ _: 2 }, [
-          le(e.slots, (v, O) => ({
-            name: O,
-            fn: _((D) => [
-              Y(e.$slots, O, re(he(D)), void 0, !0)
+        }, ie(e.listboxListeners)), ve({ _: 2 }, [
+          le(e.slots, (v, L) => ({
+            name: L,
+            fn: k((_) => [
+              j(e.$slots, L, ce(Se(_)), void 0, !0)
             ])
           }))
         ]), 1040, ["items", "total-item-count", "scroll-to-index", "virtual-scroll-start-index", "selected-value", "static-categories", "is-option-disabled"])),
-        e.shouldDisplayShowMoreButton ? (p(), E("div", Xl, [
-          V(r, {
+        e.shouldDisplayShowMoreButton ? (p(), E("div", Zl, [
+          F(r, {
             state: e.loadingButtonState,
             variant: "secondary",
             onClickCapture: e.emitShowMore
           }, {
-            default: _(() => [
-              oe(U(e.showMoreButtonText), 1)
+            default: k(() => [
+              oe(Y(e.showMoreButtonText), 1)
             ]),
             _: 1
           }, 8, ["state", "onClickCapture"])
-        ])) : e.loading ? (p(), E("div", Zl, [
-          V(t)
+        ])) : e.loading ? (p(), E("div", Ql, [
+          F(t)
         ])) : J("", !0)
       ], 64))
     ], 16)
-  ], 16, jl)), [
-    [m]
+  ], 16, Hl)), [
+    [f]
   ]);
 }
-const nt = /* @__PURE__ */ ee(Wl, [["render", Ql], ["__scopeId", "data-v-7026ea79"]]), it = (e, l) => {
+const it = /* @__PURE__ */ ee(jl, [["render", eo], ["__scopeId", "data-v-7026ea79"]]), rt = (e, l) => {
   for (const n of e) {
     if (n.value === l)
       return n;
     if (n.items) {
-      const o = it(n.items, l);
+      const o = rt(n.items, l);
       if (o)
         return o;
     }
   }
   return null;
-}, eo = (e) => typeof e == "object" && e !== null && "value" in e && "label" in e, to = (e, l, n, o) => {
-  const a = $([]), s = $(), t = (u) => {
+}, to = (e) => typeof e == "object" && e !== null && "value" in e && "label" in e, lo = (e, l, n, o) => {
+  const a = w([]), s = w(), t = (u) => {
     n.value ? s.value = u.map(({ value: r }) => r) : s.value = u.length > 0 ? u[0].value : null;
   }, i = (u) => {
-    n.value ? s.value = u.map(({ value: r, label: m }) => ({ value: r, label: m })) : s.value = u.length > 0 ? { value: u[0].value, label: u[0].label } : null;
-  }, g = (u) => {
+    n.value ? s.value = u.map(({ value: r, label: f }) => ({ value: r, label: f })) : s.value = u.length > 0 ? { value: u[0].value, label: u[0].label } : null;
+  }, h = (u) => {
     a.value = u, o?.value ? i(u) : t(u);
   }, c = () => {
     a.value = [], s.value = null;
   };
-  return Se(
+  return Ce(
     () => l.value,
     () => {
       if (!l.value && l.value !== 0) {
@@ -1712,20 +1723,20 @@ const nt = /* @__PURE__ */ ee(Wl, [["render", Ql], ["__scopeId", "data-v-7026ea7
       }
       const u = !Array.isArray(l.value), r = [...a.value];
       c();
-      const m = (v) => {
-        if (eo(v))
+      const f = (v) => {
+        if (to(v))
           a.value.push(v);
         else {
-          let O = it(e.value, v);
-          O || (O = it(r, v)), O || (O = { value: v, label: v.toString() }), a.value.push(O);
+          let L = rt(e.value, v);
+          L || (L = rt(r, v)), L || (L = { value: v, label: v.toString() }), a.value.push(L);
         }
       };
       if (u) {
         const v = l.value;
-        m(v), o?.value ? i(a.value) : t(a.value);
+        f(v), o?.value ? i(a.value) : t(a.value);
         return;
       }
-      l.value.forEach(m), o?.value ? i(a.value) : t(a.value);
+      l.value.forEach(f), o?.value ? i(a.value) : t(a.value);
     },
     { immediate: !0 }
   ), {
@@ -1734,11 +1745,11 @@ const nt = /* @__PURE__ */ ee(Wl, [["render", Ql], ["__scopeId", "data-v-7026ea7
     cachedListboxSelectedValues: s,
     // Methods
     resetCache: c,
-    setCachedValues: g
+    setCachedValues: h
   };
 };
-var xe = /* @__PURE__ */ ((e) => (e.DEFAULT = "DropdownInputDefault", e.SMALL = "DropdownInputSmall", e))(xe || {});
-const pt = {
+var Me = /* @__PURE__ */ ((e) => (e.DEFAULT = "DropdownInputDefault", e.SMALL = "DropdownInputSmall", e))(Me || {});
+const bt = {
   "de-DE": { apply: "Anwenden", cancel: "Abbrechen", noOptionsMatchThisSearch: "Für diese Suche wurden keine Ergebnisse gefunden." },
   "en-GB": { apply: "Apply", cancel: "Cancel", noOptionsMatchThisSearch: "No options match this search" },
   "en-US": { apply: "Apply", cancel: "Cancel", noOptionsMatchThisSearch: "No options match this search" },
@@ -1749,17 +1760,17 @@ const pt = {
   "ja-JP": { apply: "適用", cancel: "キャンセル", noOptionsMatchThisSearch: "この検索に一致するオプションはありません" },
   "pt-BR": { apply: "Aplicar", cancel: "Cancelar", noOptionsMatchThisSearch: "Nenhuma opção corresponde a esta busca" },
   "zh-CN": { apply: "应用", cancel: "取消", noOptionsMatchThisSearch: "没有符合此搜索条件的选项" }
-}, lo = (e, l, n, o) => {
-  const a = $(e.value), { t: s } = ke({ messages: pt });
-  Se(e, () => {
+}, oo = (e, l, n, o) => {
+  const a = w(e.value), { t: s } = ke({ messages: bt });
+  Ce(e, () => {
     a.value = e.value;
   });
   const t = d(
     () => JSON.stringify(a.value) === JSON.stringify(e.value)
   ), i = () => {
-    o(f.SELECT, a.value), o(f.CLOSE_DROPDOWN);
-  }, g = () => {
-    a.value = e.value, o(f.CLOSE_DROPDOWN);
+    o(y.SELECT, a.value), o(y.CLOSE_DROPDOWN);
+  }, h = () => {
+    a.value = e.value, o(y.CLOSE_DROPDOWN);
   }, c = () => {
     n.value && l.value && (a.value = e.value);
   }, u = d(() => [
@@ -1770,41 +1781,41 @@ const pt = {
     },
     {
       title: s("cancel"),
-      event: g
+      event: h
     }
   ]), r = (C) => {
-    a.value = C, l.value || o(f.SELECT, C);
-  }, m = (C) => {
-    r(C), o(f.TAB);
+    a.value = C, l.value || o(y.SELECT, C);
+  }, f = (C) => {
+    r(C), o(y.TAB);
   }, v = (C) => {
-    r(C), o(f.ENTER);
-  }, O = (C) => {
-    r(C), o(f.SPACE);
-  }, D = () => {
-    g(), o(f.ESCAPE);
-  }, y = () => {
-    o(f.SHOW_MORE);
-  }, z = {
-    [f.SELECT]: r,
-    [f.SHOW_MORE]: y,
-    [f.TAB]: m,
-    [f.SPACE]: O,
-    [f.ENTER]: v
+    r(C), o(y.ENTER);
+  }, L = (C) => {
+    r(C), o(y.SPACE);
+  }, _ = () => {
+    h(), o(y.ESCAPE);
+  }, g = () => {
+    o(y.SHOW_MORE);
+  }, V = {
+    [y.SELECT]: r,
+    [y.SHOW_MORE]: g,
+    [y.TAB]: f,
+    [y.SPACE]: L,
+    [y.ENTER]: v
   };
   return {
     // Values
     actions: u,
     internalSelectedValue: a,
     // Methods
-    listeners: z,
-    onEscapeKey: D,
+    listeners: V,
+    onEscapeKey: _,
     onOutsideDropdownClick: c
   };
-}, oo = Z({
-  i18n: { messages: pt },
+}, ao = Z({
+  i18n: { messages: bt },
   name: "bento-dropdown-options-container"
-}), ao = /* @__PURE__ */ Z({
-  ...oo,
+}), so = /* @__PURE__ */ Z({
+  ...ao,
   props: {
     /**
      * Defines a string value that labels an interactive element.
@@ -1894,7 +1905,7 @@ const pt = {
      *
      * If enabled, hides the "Select all" checkbox in "multiple" mode.
      */
-    searching: nt.props.searching,
+    searching: it.props.searching,
     /**
      * If enabled, dropdown will display non-selectable, static categories
      */
@@ -1903,7 +1914,7 @@ const pt = {
      * Reference to the DOM element or Vue component for positioning
      * the Dropdown container.
      */
-    targetElement: { type: ft.props.targetElement.type, required: !0 },
+    targetElement: { type: mt.props.targetElement.type, required: !0 },
     /**
      * Enables virtual scrolling if set to true or by providing an object with itemHeight function.
      * The itemHeight function is used to calculate the height of rendered item given it's index.
@@ -1914,19 +1925,19 @@ const pt = {
     }
   },
   setup(e, { expose: l, emit: n }) {
-    const o = Ve(), a = n, s = e, { selectedValue: t, multiple: i } = Ot(s), g = $(null), { t: c } = ke({ messages: pt }), u = d(() => s.open && !s.disabled), r = d(() => c("noOptionsMatchThisSearch")), m = d(() => ({
+    const o = Ge(), a = n, s = e, { selectedValue: t, multiple: i } = Lt(s), h = w(null), { t: c } = ke({ messages: bt }), u = d(() => s.open && !s.disabled), r = d(() => c("noOptionsMatchThisSearch")), f = d(() => ({
       "b-dropdown-options-container--single": !s?.multiple
     })), v = d(() => ({
       "b-dropdown-options-container__listbox--single": !s?.multiple
-    })), { actions: O, internalSelectedValue: D, listeners: y, onEscapeKey: z, onOutsideDropdownClick: C } = lo(t, i, u, a), T = d(() => s?.multiple ? Zt : ft), B = d(() => {
-      const k = {
+    })), { actions: L, internalSelectedValue: _, listeners: g, onEscapeKey: V, onOutsideDropdownClick: C } = oo(t, i, u, a), I = d(() => s?.multiple ? Qt : mt), B = d(() => {
+      const D = {
         "min-width": `${s?.targetElement?.clientWidth}px`,
         "max-width": "min(500px, 95%)"
       };
       return s?.multiple ? {
         actionsLayout: "space-between",
         ariaLabel: s.ariaLabel,
-        actions: O.value,
+        actions: L.value,
         divider: !0,
         fallbackPosition: ["top-start"],
         id: Oe(`dropdown-options-${s.id}`),
@@ -1934,7 +1945,7 @@ const pt = {
         position: "bottom-start",
         style: {
           width: "auto",
-          ...k
+          ...D
         },
         targetElement: s.targetElement
       } : {
@@ -1943,36 +1954,36 @@ const pt = {
         position: "bottom-start",
         style: {
           display: u.value ? "block" : "none",
-          ...k
+          ...D
         },
         targetElement: s.targetElement
       };
     });
     return l({
       onOutsideDropdownClick: C
-    }), (k, w) => u.value ? (p(), N(Lt(T.value), R({
+    }), (D, A) => u.value ? (p(), N(It(I.value), M({
       key: 0,
-      class: ["b-dropdown-options-container", m.value]
+      class: ["b-dropdown-options-container", f.value]
     }, B.value), {
-      default: _(() => [
-        q("div", {
-          onKeydown: w[0] || (w[0] = fe(
+      default: k(() => [
+        W("div", {
+          onKeydown: A[0] || (A[0] = me(
             //@ts-ignore
-            (...F) => b(z) && b(z)(...F),
+            (...P) => b(V) && b(V)(...P),
             ["esc"]
           ))
         }, [
-          V(b(nt), R({
+          F(b(it), M({
             id: e.id,
             ref_key: "dropdownOptionsListboxRef",
-            ref: g,
+            ref: h,
             "aria-label": e.ariaLabel,
             class: ["b-dropdown-options-container__listbox", v.value],
             "component-loading": e.componentLoading,
             "empty-state": e.emptyState,
             "is-option-disabled": e.isOptionDisabled,
             items: e.items,
-            "selected-value": b(D),
+            "selected-value": b(_),
             multiple: b(i),
             "static-categories": e.staticCategories,
             "no-results-message": r.value,
@@ -1981,11 +1992,11 @@ const pt = {
             "lazy-load-type": e.lazyLoadType,
             "has-more-items": e.hasMoreItems,
             "virtual-scroll": e.virtualScroll
-          }, ne(b(y))), me({ _: 2 }, [
-            le(b(o), (F, I) => ({
-              name: I,
-              fn: _((M) => [
-                Y(k.$slots, I, re(he(M)), void 0, !0)
+          }, ie(b(g))), ve({ _: 2 }, [
+            le(b(o), (P, x) => ({
+              name: x,
+              fn: k(($) => [
+                j(D.$slots, x, ce(Se($)), void 0, !0)
               ])
             }))
           ]), 1040, ["id", "aria-label", "class", "component-loading", "empty-state", "is-option-disabled", "items", "selected-value", "multiple", "static-categories", "no-results-message", "searching", "loading", "lazy-load-type", "has-more-items", "virtual-scroll"])
@@ -1994,9 +2005,9 @@ const pt = {
       _: 3
     }, 16, ["class"])) : J("", !0);
   }
-}), so = /* @__PURE__ */ ee(ao, [["__scopeId", "data-v-f5790908"]]);
-var pe = /* @__PURE__ */ ((e) => (e.DISABLED = "disabled", e.READONLY = "readonly", e.HAS_ITEMS = "has-items", e.OPENED = "opened", e.ERROR = "error", e))(pe || {}), te = /* @__PURE__ */ ((e) => (e.OPEN = "dropdown-base-open", e.KEYDOWN = "dropdown-base-keydown", e.CLOSE = "dropdown-base-close", e.INPUT = "dropdown-base-input", e.CLEAR = "dropdown-base-clear", e))(te || {});
-const no = /* @__PURE__ */ Symbol("dropdown small size injection key"), xt = /* @__PURE__ */ Symbol("dropdown underline style injection key"), Rt = {
+}), no = /* @__PURE__ */ ee(so, [["__scopeId", "data-v-f5790908"]]);
+var be = /* @__PURE__ */ ((e) => (e.DISABLED = "disabled", e.READONLY = "readonly", e.HAS_ITEMS = "has-items", e.OPENED = "opened", e.ERROR = "error", e))(be || {}), te = /* @__PURE__ */ ((e) => (e.OPEN = "dropdown-base-open", e.KEYDOWN = "dropdown-base-keydown", e.CLOSE = "dropdown-base-close", e.INPUT = "dropdown-base-input", e.CLEAR = "dropdown-base-clear", e))(te || {});
+const io = /* @__PURE__ */ Symbol("dropdown small size injection key"), Rt = /* @__PURE__ */ Symbol("dropdown underline style injection key"), Mt = {
   "de-DE": { clearSearch: "Suche löschen" },
   "en-GB": { clearSearch: "Clear search" },
   "en-US": { clearSearch: "Clear search" },
@@ -2007,22 +2018,22 @@ const no = /* @__PURE__ */ Symbol("dropdown small size injection key"), xt = /*
   "ja-JP": { clearSearch: "検索をクリア" },
   "pt-BR": { clearSearch: "Limpar busca" },
   "zh-CN": { clearSearch: "清除搜索" }
-}, io = ["id", "value", "disabled", "readonly", "required"], ro = ["id", "aria-readonly", "tabindex"], co = {
+}, ro = ["id", "value", "disabled", "readonly", "required"], co = ["id", "aria-readonly", "tabindex"], uo = {
   key: 1,
   class: "b-dropdown-base-textbox__input-multiple-selected"
-}, uo = { class: "b-dropdown-base-textbox__input-selected-element" }, po = {
+}, po = { class: "b-dropdown-base-textbox__input-selected-element" }, bo = {
   key: 2,
   class: "b-dropdown-base-textbox__additional-items"
-}, bo = {
+}, fo = {
   key: 3,
   class: "b-dropdown-base-textbox__icon",
   "aria-hidden": "true"
-}, fo = ["tabindex", "onKeydown"], mo = Z({
-  i18n: { messages: Rt },
+}, mo = ["tabindex", "onKeydown"], vo = Z({
+  i18n: { messages: Mt },
   name: "dropdown-base-textbox",
   inheritAttrs: !1
-}), vo = /* @__PURE__ */ Z({
-  ...mo,
+}), yo = /* @__PURE__ */ Z({
+  ...vo,
   props: {
     /**
      * The number of additional items that have been selected in the dropdown.
@@ -2107,16 +2118,16 @@ const no = /* @__PURE__ */ Symbol("dropdown small size injection key"), xt = /*
     }
   },
   setup(e, { expose: l, emit: n }) {
-    const { t: o } = ke({ messages: Rt }), a = rt(), s = Ve(), t = It(s), i = e, g = n, c = $(null), u = Oe("textbox"), r = dt(xt, !1), m = d(() => ({
-      [`b-dropdown-base-textbox--${pe.DISABLED}`]: i.disabled,
-      [`b-dropdown-base-textbox--${pe.READONLY}`]: i.readonly,
-      [`b-dropdown-base-textbox--${pe.HAS_ITEMS}`]: !!i.additionalItemsSelected,
+    const { t: o } = ke({ messages: Mt }), a = dt(), s = Ge(), t = Tt(s), i = e, h = n, c = w(null), u = Oe("textbox"), r = ct(Rt, !1), f = d(() => ({
+      [`b-dropdown-base-textbox--${be.DISABLED}`]: i.disabled,
+      [`b-dropdown-base-textbox--${be.READONLY}`]: i.readonly,
+      [`b-dropdown-base-textbox--${be.HAS_ITEMS}`]: !!i.additionalItemsSelected,
       "b-dropdown-base-textbox--underline": r
     })), v = d(
       () => C.value && a["aria-required"] ? "true" : null
-    ), O = d(() => ({
+    ), L = d(() => ({
       "b-dropdown-base-textbox__input--dynamic-filtering": i.dynamicFiltering
-    })), D = d(() => i.dynamicFiltering && !!i.value && i.open), y = d(
+    })), _ = d(() => i.dynamicFiltering && !!i.value && i.open), g = d(
       () => ({
         "aria-haspopup": "listbox",
         "aria-controls": i.ariaControls,
@@ -2128,46 +2139,46 @@ const no = /* @__PURE__ */ Symbol("dropdown small size injection key"), xt = /*
         "aria-disabled": i.disabled ? !0 : null,
         "aria-required": a["aria-required"]
       })
-    ), z = d(
+    ), V = d(
       () => i.multiple ? i.selectedValueItem : []
-    ), C = d(() => i.dynamicFiltering && (i.open || i.alwaysComboboxIsInput)), T = d(() => i.selectedValueItem && !i.multiple), B = d(
-      () => i.multiple && i.selectedValueItem && z.value.length > 0 && i.showSlotContentInMultiple
+    ), C = d(() => i.dynamicFiltering && (i.open || i.alwaysComboboxIsInput)), I = d(() => i.selectedValueItem && !i.multiple), B = d(
+      () => i.multiple && i.selectedValueItem && V.value.length > 0 && i.showSlotContentInMultiple
     );
-    Se(
+    Ce(
       () => C.value,
       () => {
-        C.value && !i.alwaysComboboxIsInput && se(() => {
+        C.value && !i.alwaysComboboxIsInput && ne(() => {
           c.value.focus();
         });
       }
     );
-    const k = async () => {
-      !i.disabled && !i.readonly && (g(te.OPEN), await se(), c.value.focus());
-    }, w = () => {
-      i.open && (c.value.focus(), g(te.CLOSE));
-    }, F = (G) => i.open && G.target.tagName === "INPUT" ? null : i.open ? w() : k(), I = () => {
-      g(te.CLEAR), g(te.INPUT, ""), c.value.focus();
-    }, M = (G) => {
-      !i.readonly && !i.disabled ? g(te.INPUT, G.target.value) : (G.preventDefault(), G.stopPropagation());
+    const D = async () => {
+      !i.disabled && !i.readonly && (h(te.OPEN), await ne(), c.value.focus());
+    }, A = () => {
+      i.open && (c.value.focus(), h(te.CLOSE));
+    }, P = (G) => i.open && G.target.tagName === "INPUT" ? null : i.open ? A() : D(), x = () => {
+      h(te.CLEAR), h(te.INPUT, ""), c.value.focus();
+    }, $ = (G) => {
+      !i.readonly && !i.disabled ? h(te.INPUT, G.target.value) : (G.preventDefault(), G.stopPropagation());
     };
     return l({
       focus: () => {
         c.value.focus();
       }
-    }), (G, x) => (p(), E("div", {
-      class: be(G.$attrs.class),
+    }), (G, R) => (p(), E("div", {
+      class: fe(G.$attrs.class),
       "data-testid": "textbox-wrapper",
-      onClick: F,
-      onKeydown: fe(w, ["escape"])
+      onClick: P,
+      onKeydown: me(A, ["escape"])
     }, [
-      V(b(Ie), {
-        class: be(["b-dropdown-base-textbox", m.value]),
+      F(b(Ie), {
+        class: fe(["b-dropdown-base-textbox", f.value]),
         variant: b(r) ? "title" : "body",
         el: "div",
         "data-testid": "base-textbox"
       }, {
-        default: _(() => [
-          C.value ? (p(), E("input", R({ key: 0 }, y.value, {
+        default: k(() => [
+          C.value ? (p(), E("input", M({ key: 0 }, g.value, {
             id: b(u),
             ref_key: "textbox",
             ref: c,
@@ -2181,70 +2192,70 @@ const no = /* @__PURE__ */ Symbol("dropdown small size injection key"), xt = /*
             readonly: e.readonly,
             required: v.value,
             onKeydown: [
-              x[0] || (x[0] = (Q) => G.$emit(b(te).KEYDOWN, Q)),
-              fe(F, ["enter"])
+              R[0] || (R[0] = (Q) => G.$emit(b(te).KEYDOWN, Q)),
+              me(P, ["enter"])
             ],
-            onInput: M
-          }), null, 16, io)) : (p(), E("div", R({
+            onInput: $
+          }), null, 16, ro)) : (p(), E("div", M({
             key: 1,
             id: b(u)
-          }, y.value, {
+          }, g.value, {
             ref_key: "textbox",
             ref: c,
-            class: ["b-dropdown-base-textbox__input", O.value],
+            class: ["b-dropdown-base-textbox__input", L.value],
             "aria-readonly": e.readonly ? "true" : null,
             role: "combobox",
             tabindex: e.disabled ? -1 : 0
           }), [
-            T.value ? (p(), E(ue, { key: 0 }, [
-              b(t)("display-value") ? Y(G.$slots, "display-value", re(R({ key: 0 }, e.selectedValueItem)), void 0, !0) : Y(G.$slots, "default", re(R({ key: 1 }, e.selectedValueItem)), () => [
-                oe(U(e.displayValue), 1)
+            I.value ? (p(), E(pe, { key: 0 }, [
+              b(t)("display-value") ? j(G.$slots, "display-value", ce(M({ key: 0 }, e.selectedValueItem)), void 0, !0) : j(G.$slots, "default", ce(M({ key: 1 }, e.selectedValueItem)), () => [
+                oe(Y(e.displayValue), 1)
               ], !0)
-            ], 64)) : B.value ? (p(), E("div", co, [
-              (p(!0), E(ue, null, le(z.value, (Q) => (p(), E("div", {
+            ], 64)) : B.value ? (p(), E("div", uo, [
+              (p(!0), E(pe, null, le(V.value, (Q) => (p(), E("div", {
                 key: Q.value
               }, [
-                q("div", uo, [
-                  Y(G.$slots, "default", R({ ref_for: !0 }, Q), () => [
-                    oe(U(e.displayValue), 1)
+                W("div", po, [
+                  j(G.$slots, "default", M({ ref_for: !0 }, Q), () => [
+                    oe(Y(e.displayValue), 1)
                   ], !0)
                 ])
               ]))), 128))
-            ])) : (p(), E(ue, { key: 2 }, [
-              oe(U(e.displayValue), 1)
+            ])) : (p(), E(pe, { key: 2 }, [
+              oe(Y(e.displayValue), 1)
             ], 64))
-          ], 16, ro)),
-          e.additionalItemsSelected ? (p(), E("span", po, U(e.additionalItemsSelected), 1)) : J("", !0),
-          b(t)("icon") && !D.value ? (p(), E("span", bo, [
-            Y(G.$slots, "icon", {}, void 0, !0)
+          ], 16, co)),
+          e.additionalItemsSelected ? (p(), E("span", bo, Y(e.additionalItemsSelected), 1)) : J("", !0),
+          b(t)("icon") && !_.value ? (p(), E("span", fo, [
+            j(G.$slots, "icon", {}, void 0, !0)
           ])) : J("", !0),
-          D.value ? (p(), E("span", {
+          _.value ? (p(), E("span", {
             key: 4,
             class: "b-dropdown-base-textbox__clear-search",
             tabindex: e.disabled ? -1 : 0,
             "data-testid": "clear-search-button",
-            onClick: Le(I, ["stop"]),
-            onKeydown: fe(Le(I, ["stop"]), ["enter"]),
-            onKeyup: fe(I, ["space"])
+            onClick: Le(x, ["stop"]),
+            onKeydown: me(Le(x, ["stop"]), ["enter"]),
+            onKeyup: me(x, ["space"])
           }, [
-            e.size === b(xe).SMALL ? (p(), N(b(ol), {
+            e.size === b(Me).SMALL ? (p(), N(b(al), {
               key: 0,
               "svg-title": b(o)("clearSearch")
-            }, null, 8, ["svg-title"])) : (p(), N(b(ll), {
+            }, null, 8, ["svg-title"])) : (p(), N(b(ol), {
               key: 1,
               "svg-title": b(o)("clearSearch")
             }, null, 8, ["svg-title"]))
-          ], 40, fo)) : J("", !0)
+          ], 40, mo)) : J("", !0)
         ]),
         _: 3
       }, 8, ["class", "variant"])
     ], 34));
   }
-}), Mt = /* @__PURE__ */ ee(vo, [["__scopeId", "data-v-d9e852a4"]]), yo = { class: "b-dropdown-default-textbox__chevron" }, go = Z({
+}), Nt = /* @__PURE__ */ ee(yo, [["__scopeId", "data-v-d9e852a4"]]), go = { class: "b-dropdown-default-textbox__chevron" }, ho = Z({
   name: "dropdown-default-textbox",
   inheritAttrs: !1
-}), ho = /* @__PURE__ */ Z({
-  ...go,
+}), So = /* @__PURE__ */ Z({
+  ...ho,
   props: {
     /**
      * The number of additional items that have been selected in the dropdown.
@@ -2332,26 +2343,26 @@ const no = /* @__PURE__ */ Symbol("dropdown small size injection key"), xt = /*
   },
   emits: ["clear", "close", "input", "keydown", "open"],
   setup(e, { expose: l, emit: n }) {
-    const o = n, a = Ve(), s = e, t = $(null), i = d(() => ({
-      [`b-dropdown-default-textbox--${pe.ERROR}`]: !s.disabled && !s.readonly && s.isInvalid,
-      [`b-dropdown-default-textbox--${pe.DISABLED}`]: s.disabled,
-      [`b-dropdown-default-textbox--${pe.READONLY}`]: s.readonly,
-      [`b-dropdown-default-textbox--${pe.OPENED}`]: s.open,
+    const o = n, a = Ge(), s = e, t = w(null), i = d(() => ({
+      [`b-dropdown-default-textbox--${be.ERROR}`]: !s.disabled && !s.readonly && s.isInvalid,
+      [`b-dropdown-default-textbox--${be.DISABLED}`]: s.disabled,
+      [`b-dropdown-default-textbox--${be.READONLY}`]: s.readonly,
+      [`b-dropdown-default-textbox--${be.OPENED}`]: s.open,
       "b-dropdown-default-textbox--condensed": s.condensed
-    })), g = d(() => s.open && !s.disabled && !s.readonly), c = (y) => {
-      o("input", y);
-    }, u = (y) => {
-      o("keydown", y);
-    }, r = (y) => {
-      Be(y), o("open");
-    }, m = (y) => {
-      Be(y), o("close");
-    }, v = (y) => {
-      Be(y), o("clear");
-    }, O = {
+    })), h = d(() => s.open && !s.disabled && !s.readonly), c = (g) => {
+      o("input", g);
+    }, u = (g) => {
+      o("keydown", g);
+    }, r = (g) => {
+      Re(g), o("open");
+    }, f = (g) => {
+      Re(g), o("close");
+    }, v = (g) => {
+      Re(g), o("clear");
+    }, L = {
       [te.INPUT]: c,
       [te.OPEN]: r,
-      [te.CLOSE]: m,
+      [te.CLOSE]: f,
       [te.CLEAR]: v,
       [te.KEYDOWN]: u
     };
@@ -2359,87 +2370,87 @@ const no = /* @__PURE__ */ Symbol("dropdown small size injection key"), xt = /*
       focus: () => {
         t.value.focus();
       }
-    }), (y, z) => (p(), E("div", {
-      class: be(["b-dropdown-default-textbox", i.value]),
+    }), (g, V) => (p(), E("div", {
+      class: fe(["b-dropdown-default-textbox", i.value]),
       "data-testid": "default-textbox"
     }, [
-      V(Mt, R({
+      F(Nt, M({
         ref_key: "baseTextbox",
         ref: t
-      }, { ...y.$attrs, ...y.$props }, {
+      }, { ...g.$attrs, ...g.$props }, {
         class: "b-dropdown-default-textbox__textbox",
         value: e.value
-      }, ne(O)), me({
-        icon: _(() => [
-          q("div", yo, [
-            de(V(b(At), { "svg-title": "opened" }, null, 512), [
-              [Re, g.value]
+      }, ie(L)), ve({
+        icon: k(() => [
+          W("div", go, [
+            ue(F(b($t), { "svg-title": "opened" }, null, 512), [
+              [Ne, h.value]
             ]),
-            de(V(b(Tt), { "svg-title": "closed" }, null, 512), [
-              [Re, !g.value]
+            ue(F(b(At), { "svg-title": "closed" }, null, 512), [
+              [Ne, !h.value]
             ])
           ])
         ]),
         _: 2
       }, [
-        le(b(a), (C, T) => ({
-          name: T,
-          fn: _((B) => [
-            Y(y.$slots, T, re(he(B ?? {})), void 0, !0)
+        le(b(a), (C, I) => ({
+          name: I,
+          fn: k((B) => [
+            j(g.$slots, I, ce(Se(B ?? {})), void 0, !0)
           ])
         }))
       ]), 1040, ["value"])
     ], 2));
   }
-}), So = /* @__PURE__ */ ee(ho, [["__scopeId", "data-v-c3e3ce21"]]);
-let St = 0;
-const Co = {
+}), Co = /* @__PURE__ */ ee(So, [["__scopeId", "data-v-c3e3ce21"]]);
+let Ct = 0;
+const Eo = {
   beforeCreate() {
-    this.uuid = St.toString(), St += 1;
+    this.uuid = Ct.toString(), Ct += 1;
   }
-}, Eo = { key: 0 };
-function Oo(e, l, n, o, a, s) {
-  return p(), E("svg", R({ role: "img" }, e.$attrs, {
+}, Oo = { key: 0 };
+function Lo(e, l, n, o, a, s) {
+  return p(), E("svg", M({ 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"] ? (p(), E("title", Eo, U(e.$attrs["svg-title"]), 1)) : J("", !0),
-    l[0] || (l[0] = q("path", {
+    e.$attrs["svg-title"] ? (p(), E("title", Oo, Y(e.$attrs["svg-title"]), 1)) : J("", !0),
+    l[0] || (l[0] = W("path", {
       fill: "#001222",
       d: "M5.00011 5.43922L8.00011 8.43922L11.0001 5.43922L12.0608 6.49988L8.00011 10.5605L3.93945 6.49988L5.00011 5.43922Z"
     }, null, -1))
   ], 16);
 }
-const Lo = /* @__PURE__ */ ee(Co, [["render", Oo]]);
-let Ct = 0;
-const Io = {
+const Io = /* @__PURE__ */ ee(Eo, [["render", Lo]]);
+let Et = 0;
+const To = {
   beforeCreate() {
-    this.uuid = Ct.toString(), Ct += 1;
+    this.uuid = Et.toString(), Et += 1;
   }
-}, To = { key: 0 };
-function Ao(e, l, n, o, a, s) {
-  return p(), E("svg", R({ role: "img" }, e.$attrs, {
+}, Ao = { key: 0 };
+function $o(e, l, n, o, a, s) {
+  return p(), E("svg", M({ 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"] ? (p(), E("title", To, U(e.$attrs["svg-title"]), 1)) : J("", !0),
-    l[0] || (l[0] = q("path", {
+    e.$attrs["svg-title"] ? (p(), E("title", Ao, Y(e.$attrs["svg-title"]), 1)) : J("", !0),
+    l[0] || (l[0] = W("path", {
       fill: "#001222",
       d: "M10.9999 10.5608L7.9999 7.56077L4.9999 10.5608L3.93924 9.50011L7.9999 5.43945L12.0606 9.50011L10.9999 10.5608Z"
     }, null, -1))
   ], 16);
 }
-const $o = /* @__PURE__ */ ee(Io, [["render", Ao]]), ko = { class: "b-dropdown-small-textbox__chevron" }, wo = Z({
+const wo = /* @__PURE__ */ ee(To, [["render", $o]]), ko = { class: "b-dropdown-small-textbox__chevron" }, _o = Z({
   name: "dropdown-small-textbox",
   inheritAttrs: !1
-}), _o = /* @__PURE__ */ Z({
-  ...wo,
+}), Do = /* @__PURE__ */ Z({
+  ..._o,
   props: {
     /**
      * The number of additional items that have been selected in the dropdown.
@@ -2496,25 +2507,25 @@ const $o = /* @__PURE__ */ ee(Io, [["render", Ao]]), ko = { class: "b-dropdown-s
   },
   emits: ["clear", "close", "input", "keydown", "open"],
   setup(e, { expose: l, emit: n }) {
-    const o = n, a = e, s = $(null), t = dt(xt, !1), i = d(() => ({
-      [`b-dropdown-small-textbox--${pe.DISABLED}`]: a.disabled,
-      [`b-dropdown-small-textbox--${pe.READONLY}`]: a.readonly,
-      [`b-dropdown-small-textbox--${pe.OPENED}`]: a.open,
+    const o = n, a = e, s = w(null), t = ct(Rt, !1), i = d(() => ({
+      [`b-dropdown-small-textbox--${be.DISABLED}`]: a.disabled,
+      [`b-dropdown-small-textbox--${be.READONLY}`]: a.readonly,
+      [`b-dropdown-small-textbox--${be.OPENED}`]: a.open,
       "b-dropdown-small-textbox--underline": t
-    })), g = d(() => a.open && !a.disabled && !a.readonly), c = (y) => {
-      o("input", y);
-    }, u = (y) => {
-      o("keydown", y);
-    }, r = (y) => {
-      Be(y), o("open");
-    }, m = (y) => {
-      Be(y), o("close");
-    }, v = (y) => {
-      Be(y), o("clear");
-    }, O = {
+    })), h = d(() => a.open && !a.disabled && !a.readonly), c = (g) => {
+      o("input", g);
+    }, u = (g) => {
+      o("keydown", g);
+    }, r = (g) => {
+      Re(g), o("open");
+    }, f = (g) => {
+      Re(g), o("close");
+    }, v = (g) => {
+      Re(g), o("clear");
+    }, L = {
       [te.INPUT]: c,
       [te.OPEN]: r,
-      [te.CLOSE]: m,
+      [te.CLOSE]: f,
       [te.CLEAR]: v,
       [te.KEYDOWN]: u
     };
@@ -2522,23 +2533,23 @@ const $o = /* @__PURE__ */ ee(Io, [["render", Ao]]), ko = { class: "b-dropdown-s
       focus: () => {
         s.value.focus();
       }
-    }), (y, z) => (p(), E("div", {
-      class: be(["b-dropdown-small-textbox", i.value])
+    }), (g, V) => (p(), E("div", {
+      class: fe(["b-dropdown-small-textbox", i.value])
     }, [
-      V(Mt, R({
+      F(Nt, M({
         ref_key: "baseTextbox",
         ref: s
-      }, { ...y.$attrs, ...y.$props }, {
+      }, { ...g.$attrs, ...g.$props }, {
         class: "b-dropdown-small-textbox__textbox",
-        size: b(xe).SMALL
-      }, ne(O)), {
-        icon: _(() => [
-          q("div", ko, [
-            de(V(b($o), { "svg-title": "opened" }, null, 512), [
-              [Re, g.value]
+        size: b(Me).SMALL
+      }, ie(L)), {
+        icon: k(() => [
+          W("div", ko, [
+            ue(F(b(wo), { "svg-title": "opened" }, null, 512), [
+              [Ne, h.value]
             ]),
-            de(V(b(Lo), { "svg-title": "closed" }, null, 512), [
-              [Re, !g.value]
+            ue(F(b(Io), { "svg-title": "closed" }, null, 512), [
+              [Ne, !h.value]
             ])
           ])
         ]),
@@ -2546,7 +2557,7 @@ const $o = /* @__PURE__ */ ee(Io, [["render", Ao]]), ko = { class: "b-dropdown-s
       }, 16, ["size"])
     ], 2));
   }
-}), Do = /* @__PURE__ */ ee(_o, [["__scopeId", "data-v-5fe55c74"]]), Bo = (e, l) => l.value.reduce((n, o) => {
+}), xo = /* @__PURE__ */ ee(Do, [["__scopeId", "data-v-5fe55c74"]]), Bo = (e, l) => l.value.reduce((n, o) => {
   if (o.items) {
     const a = o.items.filter(
       (t) => e.value.find((i) => i.value === t.value)
@@ -2554,14 +2565,14 @@ const $o = /* @__PURE__ */ ee(Io, [["render", Ao]]), ko = { class: "b-dropdown-s
     a.length === o.items.length ? n.push(o.displayValue ?? o.label) : a.forEach(({ label: t, displayValue: i }) => n.push(i ?? t));
   }
   return e.value.find((a) => a.value === o.value) && n.push(o.displayValue ?? o.label), n;
-}, []).join(", "), xo = ({ items: e, placeholder: l, selectedValues: n, isMultiSelect: o }) => {
+}, []).join(", "), Ro = ({ items: e, placeholder: l, selectedValues: n, isMultiSelect: o }) => {
   const a = d(
     () => o.value && e.value.find((t) => t.items?.length)
   );
   return d(() => n.value.length ? a.value ? Bo(n, e) : n.value.map(({ label: t, displayValue: i }) => i ?? t).join(", ") : l.value || null);
-}, Nt = (e) => {
+}, Pt = (e) => {
   e.value.$children?.[0].$refs.textbox.focus();
-}, Ro = ({
+}, Mo = ({
   inputContainerRef: e,
   optionsContainerRef: l,
   selectedValueIndex: n,
@@ -2570,74 +2581,74 @@ const $o = /* @__PURE__ */ ee(Io, [["render", Ao]]), ko = { class: "b-dropdown-s
   items: s,
   isMultiple: t,
   totalItemCount: i,
-  isVirtualScroll: g
+  isVirtualScroll: h
 }, c, u, r) => {
-  const m = async (x) => {
-    a.value && await se(), s.value[x]?.focus();
-  }, v = async (x) => {
-    a.value && await se();
+  const f = async (R) => {
+    a.value && await ne(), s.value[R]?.focus();
+  }, v = async (R) => {
+    a.value && await ne();
     const Q = l.value.$refs.dropdownOptionsListboxRef.$refs.listboxItemRef?.$el.querySelectorAll(
       "button"
     );
-    Q?.length ? Q[x]?.focus() : m(x);
-  }, O = (x) => l.value.$refs.dropdownOptionsListboxRef.$refs.listboxItemRef?.setListboxFocusedIndex(
-    x
-  ), D = async (x) => {
-    await l.value.$refs.dropdownOptionsListboxRef.$refs.listboxItemRef?.navigateToItem(x);
-  }, y = (x) => {
-    se(() => {
-      g ? D(x) : (O(x), m(x));
+    Q?.length ? Q[R]?.focus() : f(R);
+  }, L = (R) => l.value.$refs.dropdownOptionsListboxRef.$refs.listboxItemRef?.setListboxFocusedIndex(
+    R
+  ), _ = async (R) => {
+    await l.value.$refs.dropdownOptionsListboxRef.$refs.listboxItemRef?.navigateToItem(R);
+  }, g = (R) => {
+    ne(() => {
+      h ? _(R) : (L(R), f(R));
     });
-  }, z = () => {
-    o.value || u(), y(0);
+  }, V = () => {
+    o.value || u(), g(0);
   }, C = () => {
-    o.value || u(), se(() => {
-      y(g ? i.value - 1 : s.value.length - 1);
+    o.value || u(), ne(() => {
+      g(h ? i.value - 1 : s.value.length - 1);
     });
-  }, T = ({ detail: x }) => {
-    x.preventDefault(), z();
-  }, B = ({ detail: x }) => {
-    x.preventDefault(), C();
-  }, k = () => {
-    z();
-  }, w = () => {
+  }, I = ({ detail: R }) => {
+    R.preventDefault(), V();
+  }, B = ({ detail: R }) => {
+    R.preventDefault(), C();
+  }, D = () => {
+    V();
+  }, A = () => {
     C();
-  }, F = ({ detail: x }) => {
-    x.preventDefault(), c(), o.value && (t ? v(0) : y(n.value));
-  }, I = ({ detail: x }) => {
-    x.preventDefault(), c(), o.value && (t ? v(0) : y(n.value));
-  }, M = () => {
+  }, P = ({ detail: R }) => {
+    R.preventDefault(), c(), o.value && (t ? v(0) : g(n.value));
+  }, x = ({ detail: R }) => {
+    R.preventDefault(), c(), o.value && (t ? v(0) : g(n.value));
+  }, $ = () => {
     o.value && r();
-  }, W = () => {
-    o.value && (r(), Nt(e));
+  }, z = () => {
+    o.value && (r(), Pt(e));
   };
   return d(() => ({
-    [H.ARROW_DOWN]: T,
+    [H.ARROW_DOWN]: I,
     [H.ARROW_UP]: B,
-    [H.HOME]: k,
-    [H.END]: w,
-    ...a.value ? {} : { [H.SPACE]: F },
-    [H.ENTER]: I,
-    ...a.value ? {} : { [H.TAB]: M },
-    [H.ESCAPE]: W
+    [H.HOME]: D,
+    [H.END]: A,
+    ...a.value ? {} : { [H.SPACE]: P },
+    [H.ENTER]: x,
+    ...a.value ? {} : { [H.TAB]: $ },
+    [H.ESCAPE]: z
   }));
-}, Mo = ({ inputContainerRef: e, isDropdownOpen: l }, n) => {
+}, No = ({ inputContainerRef: e, isDropdownOpen: l }, n) => {
   const o = () => {
-    l.value && n(), se(() => {
-      Nt(e);
+    l.value && n(), ne(() => {
+      Pt(e);
     });
   };
   return {
-    [f.ENTER]: o,
-    [f.ESCAPE]: o,
-    [f.TAB]: o,
-    [f.SPACE]: o
+    [y.ENTER]: o,
+    [y.ESCAPE]: o,
+    [y.TAB]: o,
+    [y.SPACE]: o
   };
 };
-function No(e, l, n, o, a) {
-  const s = $(e), t = $(l), i = (u, r = []) => r.flatMap((m) => m.label.toLocaleLowerCase().includes(u) ? o?.value && m.items ? [...i(u, m.items)] : [m, ...i(u, m.items)] : m.items ? [...i(u, m.items)] : []), g = n !== void 0 ? Bt(() => n(s.value), a ?? 300) : void 0;
-  return Se(s, () => {
-    g !== void 0 && g();
+function Po(e, l, n, o, a) {
+  const s = w(e), t = w(l), i = (u, r = []) => r.flatMap((f) => f.label.toLocaleLowerCase().includes(u) ? o?.value && f.items ? [...i(u, f.items)] : [f, ...i(u, f.items)] : f.items ? [...i(u, f.items)] : []), h = n !== void 0 ? Bt(() => n(s.value), a ?? 300) : void 0;
+  return Ce(s, () => {
+    h !== void 0 && h();
   }), d(() => {
     if (!s.value || n !== void 0)
       return t.value;
@@ -2645,7 +2656,7 @@ function No(e, l, n, o, a) {
     return i(u, t.value);
   });
 }
-const Pt = {
+const Ft = {
   "de-DE": { all: "Alle", ariaLabelFallback: "Dropdown", clearSearch: "Filter löschen" },
   "en-GB": { all: "All", ariaLabelFallback: "Dropdown", clearSearch: "Clear filter" },
   "en-US": { all: "All", ariaLabelFallback: "Dropdown", clearSearch: "Clear filter" },
@@ -2656,16 +2667,16 @@ const Pt = {
   "ja-JP": { all: "すべて", ariaLabelFallback: "ドロップダウン", clearSearch: "フィルターをクリア" },
   "pt-BR": { all: "Todos", ariaLabelFallback: "Menu suspenso", clearSearch: "Limpar filtro" },
   "zh-CN": { all: "全部", ariaLabelFallback: "下拉菜单", clearSearch: "清除筛选器" }
-}, Po = Z({
-  i18n: { messages: Pt },
+}, Fo = Z({
+  i18n: { messages: Ft },
   name: "b-dropdown",
   components: {
-    DropdownInputDefault: So,
-    DropdownInputSmall: Do
+    DropdownInputDefault: Co,
+    DropdownInputSmall: xo
   },
   model: { prop: "modelValue" }
-}), Fo = /* @__PURE__ */ Z({
-  ...Po,
+}), Vo = /* @__PURE__ */ Z({
+  ...Fo,
   props: {
     ariaLabel: { default: null },
     condensed: { type: Boolean, default: !1 },
@@ -2677,7 +2688,7 @@ const Pt = {
     items: { default: () => [] },
     loading: { type: Boolean, default: !1 },
     componentLoading: { type: Boolean, default: !1 },
-    lazyLoadType: { default: nt.props.lazyLoadType.default },
+    lazyLoadType: { default: it.props.lazyLoadType.default },
     multiple: { type: Boolean, default: !1 },
     search: { default: void 0 },
     showSlotContentInMultiple: { type: Boolean, default: !1 },
@@ -2700,259 +2711,266 @@ const Pt = {
   },
   emits: ["input", "update:model-value", "show-more", "open"],
   setup(e, { expose: l, emit: n }) {
-    const o = rt(), a = Ve(), s = It(a), t = e, i = n, { t: g } = ke({ messages: Pt }), { emitValue: c } = Gt(i), u = $(null), r = $(null), m = $(null), v = $(!1), O = Oe("bento-dropdown-options-container"), D = Oe("dropdown-label"), y = Oe("dropdown-description"), z = Oe("dropdown-error"), { isReadOnly: C } = Kt(ae(t, "readonly")), T = d(() => t.modelValue ?? t.value), { cachedSelectedListboxOptions: B, cachedListboxSelectedValues: k, setCachedValues: w } = to(
+    const o = dt(), a = Ge(), s = Tt(a), t = e, i = n, { t: h } = ke({ messages: Ft }), { emitValue: c } = Kt(i), u = w(null), r = w(null), f = w(null), v = w(!1), L = Oe("bento-dropdown-options-container"), _ = Oe("dropdown-label"), g = Oe("dropdown-description"), V = Oe("dropdown-error"), { isReadOnly: C } = Ut(ae(t, "readonly")), I = d(() => t.modelValue ?? t.value), { cachedSelectedListboxOptions: B, cachedListboxSelectedValues: D, setCachedValues: A } = lo(
       ae(t, "items"),
-      T,
+      I,
       ae(t, "multiple"),
       ae(t, "enableValueLabelPair")
-    ), F = $(o["aria-label"]), I = $(o["aria-describedby"]), { ariaLabel: M, label: W } = Ot(t), G = d(() => g("ariaLabelFallback")), x = zt({
+    ), P = w(o["aria-label"]), x = w(o["aria-describedby"]), { ariaLabel: $, label: z } = Lt(t), G = d(() => h("ariaLabelFallback")), R = Gt({
       // TODO: take ariaLabel ref away when aria-label prop is removed
-      ariaLabel: M.value || F,
-      label: W,
+      ariaLabel: $.value || P,
+      label: z,
       defaultFallback: G
-    }), Q = t.size === xe.SMALL || dt(no, !1), we = d(() => Q ? xe.SMALL : xe.DEFAULT), Me = d(() => ({
+    }), Q = t.size === Me.SMALL || ct(io, !1), _e = d(() => Q ? Me.SMALL : Me.DEFAULT), Pe = d(() => ({
       "b-dropdown--condensed": t.condensed
-    })), _e = d(() => ({
+    })), De = d(() => ({
       "b-dropdown__description--error": !!t.errorMessage
-    })), X = $(""), ie = ae(t, "items"), ze = ae(t, "staticCategories"), Te = No(
+    })), X = w(""), re = ae(t, "items"), Ke = ae(t, "staticCategories"), Te = Po(
       X,
-      ie,
+      re,
       t?.search?.searchEvent,
-      ze,
+      Ke,
       t?.search?.debounceTime
-    ), ve = d(() => t.dynamicFiltering && !!X.value), je = xo({
-      items: ie,
+    ), ye = d(() => t.dynamicFiltering && !!X.value), He = Ro({
+      items: re,
       placeholder: ae(t, "placeholder"),
       isMultiSelect: ae(t, "multiple"),
       selectedValues: B
-    }), He = d(() => {
-      if (t?.multiple && Array.isArray(T.value))
+    }), Je = d(() => {
+      if (t?.multiple && Array.isArray(I.value))
         return t.items.filter(
-          ({ value: S }) => t?.value && (t?.value).includes(S)
+          ({ value: m }) => t?.value && (t?.value).includes(m)
         );
       if (!t.multiple && t.staticCategories) {
-        const S = t.items.find(
-          (ye) => ye.items?.some((Ae) => Ae.value === T.value)
+        const m = t.items.find(
+          (de) => de.items?.some(($e) => $e.value === I.value)
         );
-        return (S ? S.items.find((ye) => ye.value === T.value) : t.items.find(({ value: ye }) => ye === T.value)) ?? null;
+        return (m ? m.items.find((de) => de.value === I.value) : t.items.find(({ value: de }) => de === I.value)) ?? null;
       }
-      return t.items.find(({ value: S }) => S === T.value);
-    }), Ne = d(() => {
-      const S = Te.value.findIndex(({ value: ce }) => t.enableValueLabelPair ? T.value.value === ce : T.value === ce);
-      return S > -1 ? S : 0;
-    }), { isMultiLevelSelect: Ce, flattenedItemsList: Ge } = _t(ie), Je = d(() => Ce.value && !t.staticCategories), Xe = d(() => Je.value ? "treeitem" : "option"), Ze = d(() => {
+      return t.items.find(({ value: m }) => m === I.value);
+    }), xe = d(() => {
+      const se = (ge.value ? Fe.value : Te.value).findIndex(({ value: de }) => t.enableValueLabelPair ? I.value?.value === de : I.value === de);
+      return se > -1 ? se : 0;
+    }), { isMultiLevelSelect: ge, flattenedItemsList: Fe } = Dt(re), Xe = d(() => ge.value && !t.staticCategories), Ze = d(() => Xe.value ? "treeitem" : "option"), Qe = d(() => {
       if (t.multiple) {
-        const S = Array.isArray(T.value) ? T.value.length : 0, ce = Ce.value ? Ge.value.length : ie.value.length;
-        return S === 0 ? null : !t.hasMoreItems && ce > 0 && ce === S ? g("all") : S;
+        const m = Array.isArray(I.value) ? I.value.length : 0, se = ge.value ? Fe.value.length : re.value.length;
+        return m === 0 ? null : !t.hasMoreItems && se > 0 && se === m ? h("all") : m;
       }
       return null;
-    }), Qe = d(
+    }), et = d(
       () => [
-        t.description ? y : null,
-        I.value,
-        t.errorMessage ? z : null
+        t.description ? g : null,
+        x.value,
+        t.errorMessage ? V : null
       ].filter(Boolean).join(" ") || null
-    ), Ke = d(() => m.value?.$el), { visibleDomOptions: et, updateVisibleDomOptions: Ue } = ct(
-      Ke,
+    ), Ue = d(() => f.value?.$el), { visibleDomOptions: tt, updateVisibleDomOptions: qe } = ut(
+      Ue,
       Te,
-      Xe
-    ), qe = () => {
-      C.value || (v.value = !0, se(() => {
-        Ue();
+      Ze
+    ), Ye = () => {
+      C.value || (v.value = !0, ne(() => {
+        qe();
       }));
-    }, De = () => {
+    }, Be = () => {
       v.value = !1;
-    }, Pe = () => {
-      C.value || (v.value = !v.value, se(() => {
-        Ue();
-      }), ve.value && (X.value = ""));
-    }, tt = () => {
-      ve.value && (X.value = ""), v.value && (v.value = !1, m.value.onOutsideDropdownClick());
-    }, lt = d(() => [
-      tt,
+    }, Ve = () => {
+      C.value || (v.value = !v.value, ne(() => {
+        qe();
+      }), ye.value && (X.value = ""));
+    }, lt = () => {
+      ye.value && (X.value = ""), v.value && (v.value = !1, f.value.onOutsideDropdownClick());
+    }, ot = d(() => [
+      lt,
       {
-        ignore: [Ke]
+        ignore: [Ue]
       }
-    ]), ot = async (S) => {
-      t.multiple || (X.value = "", v.value = !1), w(S), c(k.value), t.multiple || (await se(), P());
-    }, h = () => {
-      i(f.SHOW_MORE);
-    }, A = Ro(
+    ]), at = async (m) => {
+      t.multiple || (X.value = "", v.value = !1), A(m), c(D.value), t.multiple || (await ne(), q());
+    }, S = () => {
+      i(y.SHOW_MORE);
+    }, T = Mo(
       {
         inputContainerRef: u,
-        optionsContainerRef: m,
-        selectedValueIndex: Ne,
+        optionsContainerRef: f,
+        selectedValueIndex: xe,
         isDropdownOpen: v,
         isDynamicFltering: ae(t, "dynamicFiltering"),
-        items: et,
+        items: tt,
         isMultiple: t.multiple,
         totalItemCount: d(() => Te.value.length),
         isVirtualScroll: !t?.multiple && t?.virtualScroll !== !1 && t?.lazyLoadType === "none"
       },
-      Pe,
-      qe,
-      De
-    ), L = Mo(
+      Ve,
+      Ye,
+      Be
+    ), O = No(
       {
         inputContainerRef: u,
         isDropdownOpen: v
       },
-      De
-    ), j = {
-      [f.CLOSE_DROPDOWN]: De,
-      [f.SELECT]: ot,
-      [f.SHOW_MORE]: h,
-      ...L
+      Be
+    ), U = {
+      [y.CLOSE_DROPDOWN]: Be,
+      [y.SELECT]: at,
+      [y.SHOW_MORE]: S,
+      ...O
     };
-    t.error && st(
+    t.error && nt(
       'BentoDropdown "error" property',
       `Use the BentoDropdown "errorMessage" property instead to indicate that there is a modifier error.
                             Having the field as "undefined" will hide/remove the error.
                             <bento-dropdown errorMessage="Error message text" />`,
       "2.0.0"
-    ), t.size && st('BentoDropdown "size" property', "Do not use. Only 'default' size should be used.", "2.0.0"), t.value && st(
+    ), t.size && nt('BentoDropdown "size" property', "Do not use. Only 'default' size should be used.", "2.0.0"), t.value && nt(
       'BentoDropdown "value" property',
       `The use of "value" prop in "BentoDropdown" is no longer supported.
                 Use the "v-model" or "model-value" property instead.`,
       "2.0.0"
     );
-    const P = () => {
+    const q = () => {
       u.value.focus();
+    }, Ae = async () => {
+      if (await ne(), !v.value || t.multiple || !f.value)
+        return;
+      const m = xe.value;
+      if (m <= 0)
+        return;
+      f.value?.$refs?.dropdownOptionsListboxRef?.$refs?.listboxItemRef?.scrollToItem?.(m);
     };
-    return Se(
+    return Ce(
       () => v.value,
-      (S) => {
-        S && i("open");
+      (m) => {
+        m && (i("open"), Ae());
       }
     ), l({
-      focus: P
-    }), (S, ce) => de((p(), E("div", {
-      class: be(["b-dropdown", Me.value])
+      focus: q
+    }), (m, se) => ue((p(), E("div", {
+      class: fe(["b-dropdown", Pe.value])
     }, [
-      b(W) ? (p(), N(b(el), {
+      b(z) ? (p(), N(b(tl), {
         key: 0,
-        id: b(D),
-        condensed: S.condensed,
-        label: b(W),
-        "tooltip-text": S.tooltipText,
-        optional: S.optional,
-        required: S.required
+        id: b(_),
+        condensed: m.condensed,
+        label: b(z),
+        "tooltip-text": m.tooltipText,
+        optional: m.optional,
+        required: m.required
       }, null, 8, ["id", "condensed", "label", "tooltip-text", "optional", "required"])) : J("", !0),
-      de((p(), E("div", R({
+      ue((p(), E("div", M({
         ref_key: "inputContainerRefWrapper",
         ref: r
-      }, ne(b(A), !0)), [
-        (p(), N(Lt(we.value), {
+      }, ie(b(T), !0)), [
+        (p(), N(It(_e.value), {
           ref_key: "inputContainerRef",
           ref: u,
-          condensed: S.condensed,
+          condensed: m.condensed,
           value: X.value,
-          "additional-items-selected": Ze.value,
-          "aria-controls": b(O),
+          "additional-items-selected": Qe.value,
+          "aria-controls": b(L),
           ariaExpanded: v.value,
-          "aria-labelledby": b(W) ? b(D) : null,
-          "aria-describedby": Qe.value,
-          "aria-label": b(x),
+          "aria-labelledby": b(z) ? b(_) : null,
+          "aria-describedby": et.value,
+          "aria-label": b(R),
           "aria-readonly": b(C),
-          "aria-required": S.required,
+          "aria-required": m.required,
           readonly: b(C),
-          disabled: S.disabled,
-          "display-value": b(je),
-          "dynamic-filtering": S.dynamicFiltering,
-          "is-invalid": !!S.errorMessage || S.error,
-          multiple: S.multiple,
+          disabled: m.disabled,
+          "display-value": b(He),
+          "dynamic-filtering": m.dynamicFiltering,
+          "is-invalid": !!m.errorMessage || m.error,
+          multiple: m.multiple,
           open: v.value,
-          "selected-value-item": b(Q) ? void 0 : He.value,
-          "show-slot-content-in-multiple": S.showSlotContentInMultiple,
-          onInput: ce[0] || (ce[0] = (ye) => X.value = ye),
-          onOpen: Pe,
-          onClose: Pe
-        }, me({ _: 2 }, [
-          le(b(a), (ye, Ae) => ({
-            name: Ae,
-            fn: _((at) => [
-              Y(S.$slots, Ae, re(he(at)), void 0, !0)
+          "selected-value-item": b(Q) ? void 0 : Je.value,
+          "show-slot-content-in-multiple": m.showSlotContentInMultiple,
+          onInput: se[0] || (se[0] = (de) => X.value = de),
+          onOpen: Ve,
+          onClose: Ve
+        }, ve({ _: 2 }, [
+          le(b(a), (de, $e) => ({
+            name: $e,
+            fn: k((st) => [
+              j(m.$slots, $e, ce(Se(st)), void 0, !0)
             ])
           }))
         ]), 1064, ["condensed", "value", "additional-items-selected", "aria-controls", "ariaExpanded", "aria-labelledby", "aria-describedby", "aria-label", "aria-readonly", "aria-required", "readonly", "disabled", "display-value", "dynamic-filtering", "is-invalid", "multiple", "open", "selected-value-item", "show-slot-content-in-multiple"]))
       ], 16)), [
-        [b(Fe)]
+        [b(ze)]
       ]),
-      u.value ? (p(), N(b(Qt), {
+      u.value ? (p(), N(b(el), {
         key: 1,
-        disabled: S.teleport?.disabled,
-        to: S.teleport?.to
+        disabled: m.teleport?.disabled,
+        to: m.teleport?.to
       }, {
-        default: _(() => [
-          V(b(so), R({
-            id: b(O),
+        default: k(() => [
+          F(b(no), M({
+            id: b(L),
             ref_key: "optionsContainerRef",
-            ref: m,
-            "aria-label": b(x),
-            "component-loading": S.componentLoading,
-            "empty-state": S.emptyState,
-            disabled: S.disabled,
-            "is-option-disabled": S.isOptionDisabled,
+            ref: f,
+            "aria-label": b(R),
+            "component-loading": m.componentLoading,
+            "empty-state": m.emptyState,
+            disabled: m.disabled,
+            "is-option-disabled": m.isOptionDisabled,
             items: b(Te),
-            multiple: S.multiple,
-            "static-categories": ze.value,
+            multiple: m.multiple,
+            "static-categories": Ke.value,
             open: v.value,
             "selected-value": b(B),
-            searching: ve.value,
+            searching: ye.value,
             "target-element": r.value,
-            loading: S.loading,
-            "has-more-items": S.hasMoreItems,
-            "lazy-load-type": S.lazyLoadType,
-            "virtual-scroll": S.virtualScroll
-          }, ne(j)), me({ _: 2 }, [
-            le(b(a), (ye, Ae) => ({
-              name: Ae,
-              fn: _((at) => [
-                Y(S.$slots, Ae, re(he(at)), void 0, !0)
+            loading: m.loading,
+            "has-more-items": m.hasMoreItems,
+            "lazy-load-type": m.lazyLoadType,
+            "virtual-scroll": m.virtualScroll
+          }, ie(U)), ve({ _: 2 }, [
+            le(b(a), (de, $e) => ({
+              name: $e,
+              fn: k((st) => [
+                j(m.$slots, $e, ce(Se(st)), void 0, !0)
               ])
             }))
           ]), 1040, ["id", "aria-label", "component-loading", "empty-state", "disabled", "is-option-disabled", "items", "multiple", "static-categories", "open", "selected-value", "searching", "target-element", "loading", "has-more-items", "lazy-load-type", "virtual-scroll"])
         ]),
         _: 3
       }, 8, ["disabled", "to"])) : J("", !0),
-      S.errorMessage ? (p(), N(b(tl), {
+      m.errorMessage ? (p(), N(b(ll), {
         key: 2,
-        id: b(z),
-        "error-message": S.errorMessage,
+        id: b(V),
+        "error-message": m.errorMessage,
         class: "b-dropdown__error-message"
       }, null, 8, ["id", "error-message"])) : J("", !0),
-      S.description || b(s)("description") ? (p(), N(b(Ie), {
+      m.description || b(s)("description") ? (p(), N(b(Ie), {
         key: 3,
-        id: b(y),
-        class: be(["b-dropdown__description", _e.value]),
+        id: b(g),
+        class: fe(["b-dropdown__description", De.value]),
         el: "span"
       }, {
-        default: _(() => [
-          Y(S.$slots, "description", {}, () => [
-            oe(U(S.description), 1)
+        default: k(() => [
+          j(m.$slots, "description", {}, () => [
+            oe(Y(m.description), 1)
           ], !0)
         ]),
         _: 3
       }, 8, ["id", "class"])) : J("", !0)
     ], 2)), [
-      [b(Ut), lt.value]
+      [b(qt), ot.value]
     ]);
   }
-}), ba = /* @__PURE__ */ ee(Fo, [["__scopeId", "data-v-57256e26"]]);
+}), fa = /* @__PURE__ */ ee(Vo, [["__scopeId", "data-v-66790b9d"]]);
 export {
-  ba as B,
-  fl as C,
-  So as D,
-  f as a,
+  fa as B,
+  ml as C,
+  Co as D,
+  y as a,
   Ee as b,
-  xe as c,
-  nt as d,
-  _t as e,
-  No as f,
+  Me as c,
+  it as d,
+  Dt as e,
+  Po as f,
   Bt as g,
-  no as h,
-  xt as i,
-  ut as j,
-  to as u
+  io as h,
+  Rt as i,
+  pt as j,
+  lo as u
 };
-//# sourceMappingURL=dropdown.C97ShfXZ.js.map
+//# sourceMappingURL=dropdown.CGUBk0iO.js.map