@adyen/bento-vue3 1.72.0 → 1.74.0

package/dist/chunks/{dropdown.GyDAswAO.js → dropdown.bLsoTZbw.js}

@@ -1,22 +1,22 @@
-import { ref as C, watch as xe, computed as d, defineComponent as z, useSlots as Ne, toRefs as $e, createBlock as _, openBlock as S, resolveDynamicComponent as Ae, mergeProps as R, withCtx as F, createElementVNode as oe, withKeys as tt, unref as s, createVNode as X, toHandlers as te, createSlots as ce, renderList as pe, renderSlot as G, normalizeProps as fe, guardReactiveProps as me, createElementBlock as P, createCommentVNode as K, toDisplayString as be, normalizeClass as ve, withDirectives as ae, vShow as Ce, nextTick as x, useAttrs as at, toRef as B, inject as ot, createTextVNode as lt } from "vue";
-import { d as Oe, B as nt } from "./typography.yBEME_Gu.js";
-import { a as de, b as H, c as st, B as ee, D as it } from "./dropdown-default-textbox.CGsOngY1.js";
+import { ref as w, watch as be, computed as d, defineComponent as F, useSlots as Ne, toRefs as Ae, createBlock as k, openBlock as L, resolveDynamicComponent as $e, mergeProps as M, withCtx as K, createElementVNode as oe, withKeys as ot, unref as s, createVNode as X, toHandlers as te, createSlots as ce, renderList as pe, renderSlot as G, normalizeProps as fe, guardReactiveProps as me, createElementBlock as R, createCommentVNode as _, toDisplayString as ge, normalizeClass as ve, withDirectives as ae, vShow as Oe, nextTick as x, useAttrs as lt, toRef as B, inject as nt, createTextVNode as st } from "vue";
+import { d as Be, B as it } from "./typography.yBEME_Gu.js";
+import { a as de, b as J, c as rt, B as ee, D as dt } from "./dropdown-default-textbox.MkU0tMf1.js";
 /* empty css              */
-import { _ as Y } from "./_plugin-vue_export-helper.CHgC5LLL.js";
+import { _ as Z } from "./_plugin-vue_export-helper.CHgC5LLL.js";
 import { s as ue } from "./events.CMzGybJJ.js";
-import { g as J } from "./generate-uid.NJ8tVoha.js";
-import { u as rt } from "./aria-label.CaUURpnB.js";
-import { u as ge } from "./i18n.B6g5VX0q.js";
-import { a as f, b as ye, B as Be, c as dt, u as ut, d as ct } from "./use-cached-selected-values.CBOWMI4O.js";
-import { u as pt } from "./use-form-layout-loading.D3lALhtC.js";
-import { B as ft } from "./directive.Cbdox5VL.js";
-import { B as A, a as mt } from "./keyboard-navigation.pB8weElW.js";
-import { u as vt } from "./use-has-slot.B7eQSabc.js";
-import { F as yt, E as bt } from "./field-label.DSeawpYh.js";
-import { P as De } from "./popper-container.5cq-eu41.js";
-import { h as gt } from "./button-actions.D1eBtYgZ.js";
+import { g as Y } from "./generate-uid.NJ8tVoha.js";
+import { u as ut } from "./aria-label.CaUURpnB.js";
+import { u as he } from "./index.pdBj0KQU.js";
+import { a as m, b as ye, B as De, c as ct, u as pt, d as ft } from "./use-cached-selected-values.C32tjNKy.js";
+import { u as mt } from "./use-form-layout-loading.D3lALhtC.js";
+import { B as vt } from "./directive.Cbdox5VL.js";
+import { B as A, a as yt } from "./keyboard-navigation.pB8weElW.js";
+import { u as bt } from "./use-has-slot.B7eQSabc.js";
+import { F as gt, E as ht } from "./field-label.C97CrBI_.js";
+import { P as Te } from "./popper-container.Uod3yjsR.js";
+import { h as Lt } from "./button-actions.BQ3AFQqt.js";
 import "../assets/dropdown.css";
-const he = {
+const Le = {
   "en-US": {
     apply: "Apply",
     cancel: "Cancel",
@@ -30,20 +30,20 @@ const he = {
     apply: "Aplicar",
     cancel: "Cancelar"
   }
-}, ht = (t, r, i, a) => {
-  const n = C(t.value), { t: l } = ge({ messages: he });
-  xe(t, () => {
-    n.value = t.value;
+}, St = (o, r, i, a) => {
+  const n = w(o.value), { t: l } = he({ messages: Le });
+  be(o, () => {
+    n.value = o.value;
   });
   const e = d(
-    () => JSON.stringify(n.value) === JSON.stringify(t.value)
+    () => JSON.stringify(n.value) === JSON.stringify(o.value)
   ), u = () => {
-    a(f.SELECT, n.value), a(f.CLOSE_DROPDOWN);
-  }, v = () => {
-    n.value = t.value, a(f.CLOSE_DROPDOWN);
+    a(m.SELECT, n.value), a(m.CLOSE_DROPDOWN);
+  }, y = () => {
+    n.value = o.value, a(m.CLOSE_DROPDOWN);
   }, b = () => {
-    i.value && r.value && (n.value = t.value);
-  }, c = d(() => [
+    i.value && r.value && (n.value = o.value);
+  }, p = d(() => [
     {
       title: l("apply"),
       event: u,
@@ -51,41 +51,41 @@ const he = {
     },
     {
       title: l("cancel"),
-      event: v
+      event: y
     }
   ]), g = (h) => {
-    n.value = h, r.value || a(f.SELECT, h);
-  }, p = (h) => {
-    g(h), a(f.TAB);
-  }, w = (h) => {
-    g(h), a(f.ENTER);
+    n.value = h, r.value || a(m.SELECT, h);
+  }, c = (h) => {
+    g(h), a(m.TAB);
+  }, E = (h) => {
+    g(h), a(m.ENTER);
   }, O = (h) => {
-    g(h), a(f.SPACE);
-  }, m = () => {
-    v(), a(f.ESCAPE);
+    g(h), a(m.SPACE);
+  }, v = () => {
+    y(), a(m.ESCAPE);
   }, D = () => {
-    a(f.SHOW_MORE);
-  }, E = {
-    [f.SELECT]: g,
-    [f.SHOW_MORE]: D,
-    [f.TAB]: p,
-    [f.SPACE]: O,
-    [f.ENTER]: w
+    a(m.SHOW_MORE);
+  }, C = {
+    [m.SELECT]: g,
+    [m.SHOW_MORE]: D,
+    [m.TAB]: c,
+    [m.SPACE]: O,
+    [m.ENTER]: E
   };
   return {
     // Values
-    actions: c,
+    actions: p,
     internalSelectedValue: n,
     // Methods
-    listeners: E,
-    onEscapeKey: m,
+    listeners: C,
+    onEscapeKey: v,
     onOutsideDropdownClick: b
   };
-}, Lt = z({
-  i18n: { messages: he },
+}, wt = F({
+  i18n: { messages: Le },
   name: "bento-dropdown-options-container"
-}), St = /* @__PURE__ */ z({
-  ...Lt,
+}), Et = /* @__PURE__ */ F({
+  ...wt,
   props: {
     /**
      * Defines a string value that labels an interactive element.
@@ -144,8 +144,8 @@ const he = {
      */
     lazyLoadType: {
       type: String,
-      default: Be.AUTOMATIC,
-      validator: (t) => Object.values(Be).includes(t)
+      default: De.AUTOMATIC,
+      validator: (o) => Object.values(De).includes(o)
     },
     /**
      * Indicates if new options are lazy loading.
@@ -184,7 +184,7 @@ const he = {
      * Reference to the DOM element or Vue component for positioning
      * the Dropdown container.
      */
-    targetElement: { type: De.props.targetElement.type, required: !0 },
+    targetElement: { type: Te.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.
@@ -194,12 +194,12 @@ const he = {
       default: !1
     }
   },
-  setup(t, { expose: r, emit: i }) {
-    const a = Ne(), n = i, l = t, { selectedValue: e, multiple: u } = $e(l), v = C(null), { t: b } = ge({ messages: he }), c = d(() => l.open && !l.disabled), g = d(() => b("noOptionsMatchThisSearch")), p = d(() => ({
+  setup(o, { expose: r, emit: i }) {
+    const a = Ne(), n = i, l = o, { selectedValue: e, multiple: u } = Ae(l), y = w(null), { t: b } = he({ messages: Le }), p = d(() => l.open && !l.disabled), g = d(() => b("noOptionsMatchThisSearch")), c = d(() => ({
       "b-dropdown-options-container--single": !(l != null && l.multiple)
-    })), w = d(() => ({
+    })), E = d(() => ({
       "b-dropdown-options-container__listbox--single": !(l != null && l.multiple)
-    })), { actions: O, internalSelectedValue: m, listeners: D, onEscapeKey: E, onOutsideDropdownClick: h } = ht(e, u, c, n), V = d(() => l != null && l.multiple ? gt : De), W = d(() => {
+    })), { actions: O, internalSelectedValue: v, listeners: D, onEscapeKey: C, onOutsideDropdownClick: h } = St(e, u, p, n), z = d(() => l != null && l.multiple ? Lt : Te), V = d(() => {
       var T;
       const N = {
         "min-width": `${(T = l == null ? void 0 : l.targetElement) == null ? void 0 : T.clientWidth}px`,
@@ -211,7 +211,7 @@ const he = {
         actions: O.value,
         divider: !0,
         fallbackPosition: ["top-start"],
-        id: J(`dropdown-options-${l.id}`),
+        id: Y(`dropdown-options-${l.id}`),
         open: l.open,
         position: "bottom-start",
         style: {
@@ -224,7 +224,7 @@ const he = {
         offset: [0, 8],
         position: "bottom-start",
         style: {
-          display: c.value ? "block" : "none",
+          display: p.value ? "block" : "none",
           ...N
         },
         targetElement: l.targetElement
@@ -232,41 +232,41 @@ const he = {
     });
     return r({
       onOutsideDropdownClick: h
-    }), (N, T) => (S(), _(Ae(V.value), R({
-      class: ["b-dropdown-options-container", p.value]
-    }, W.value), {
-      default: F(() => [
+    }), (N, T) => (L(), k($e(z.value), M({
+      class: ["b-dropdown-options-container", c.value]
+    }, V.value), {
+      default: K(() => [
         oe("div", {
-          onKeydown: T[0] || (T[0] = tt(
+          onKeydown: T[0] || (T[0] = ot(
             //@ts-ignore
-            (...$) => s(E) && s(E)(...$),
+            (...W) => s(C) && s(C)(...W),
             ["esc"]
           ))
         }, [
-          X(s(ye), R({
-            id: t.id,
+          X(s(ye), M({
+            id: o.id,
             ref_key: "dropdownOptionsListboxRef",
-            ref: v,
-            "aria-label": t.ariaLabel,
-            class: ["b-dropdown-options-container__listbox", w.value],
-            "component-loading": t.componentLoading,
-            "empty-state": t.emptyState,
-            "is-option-disabled": t.isOptionDisabled,
-            items: t.items,
-            "selected-value": s(m),
+            ref: y,
+            "aria-label": o.ariaLabel,
+            class: ["b-dropdown-options-container__listbox", E.value],
+            "component-loading": o.componentLoading,
+            "empty-state": o.emptyState,
+            "is-option-disabled": o.isOptionDisabled,
+            items: o.items,
+            "selected-value": s(v),
             multiple: s(u),
-            "static-categories": t.staticCategories,
+            "static-categories": o.staticCategories,
             "no-results-message": g.value,
-            searching: t.searching,
-            loading: t.loading,
-            "lazy-load-type": t.lazyLoadType,
-            "has-more-items": t.hasMoreItems,
-            "virtual-scroll": t.virtualScroll
+            searching: o.searching,
+            loading: o.loading,
+            "lazy-load-type": o.lazyLoadType,
+            "has-more-items": o.hasMoreItems,
+            "virtual-scroll": o.virtualScroll
           }, te(s(D))), ce({ _: 2 }, [
-            pe(s(a), ($, y) => ({
-              name: y,
-              fn: F((L) => [
-                G(N.$slots, y, fe(me(L)), void 0, !0)
+            pe(s(a), (W, f) => ({
+              name: f,
+              fn: K((S) => [
+                G(N.$slots, f, fe(me(S)), 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"])
@@ -275,55 +275,55 @@ const he = {
       _: 3
     }, 16, ["class"]));
   }
-}), wt = /* @__PURE__ */ Y(St, [["__scopeId", "data-v-83c3a61b"]]);
-let Te = 0;
-const Et = {
+}), Ct = /* @__PURE__ */ Z(Et, [["__scopeId", "data-v-d87d28cd"]]);
+let Ie = 0;
+const Ot = {
   beforeCreate() {
-    this.uuid = Te.toString(), Te += 1;
+    this.uuid = Ie.toString(), Ie += 1;
   }
-}, Ct = { key: 0 };
-function Ot(t, r, i, a, n, l) {
-  return S(), P("svg", R({ role: "img" }, t.$attrs, {
+}, Bt = { key: 0 };
+function Dt(o, r, i, a, n, l) {
+  return L(), R("svg", M({ role: "img" }, o.$attrs, {
     class: "ui-assets-icons-16",
     xmlns: "http://www.w3.org/2000/svg",
     width: "16",
     height: "16",
     fill: "none"
   }), [
-    t.$attrs["svg-title"] ? (S(), P("title", Ct, be(t.$attrs["svg-title"]), 1)) : K("", !0),
+    o.$attrs["svg-title"] ? (L(), R("title", Bt, ge(o.$attrs["svg-title"]), 1)) : _("", !0),
     r[0] || (r[0] = oe("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 Bt = /* @__PURE__ */ Y(Et, [["render", Ot]]);
-let Ie = 0;
-const Dt = {
+const Tt = /* @__PURE__ */ Z(Ot, [["render", Dt]]);
+let xe = 0;
+const It = {
   beforeCreate() {
-    this.uuid = Ie.toString(), Ie += 1;
+    this.uuid = xe.toString(), xe += 1;
   }
-}, Tt = { key: 0 };
-function It(t, r, i, a, n, l) {
-  return S(), P("svg", R({ role: "img" }, t.$attrs, {
+}, xt = { key: 0 };
+function Nt(o, r, i, a, n, l) {
+  return L(), R("svg", M({ role: "img" }, o.$attrs, {
     class: "ui-assets-icons-16",
     xmlns: "http://www.w3.org/2000/svg",
     width: "16",
     height: "16",
     fill: "none"
   }), [
-    t.$attrs["svg-title"] ? (S(), P("title", Tt, be(t.$attrs["svg-title"]), 1)) : K("", !0),
+    o.$attrs["svg-title"] ? (L(), R("title", xt, ge(o.$attrs["svg-title"]), 1)) : _("", !0),
     r[0] || (r[0] = oe("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 xt = /* @__PURE__ */ Y(Dt, [["render", It]]), Nt = { class: "b-dropdown-small-textbox__chevron" }, $t = z({
+const At = /* @__PURE__ */ Z(It, [["render", Nt]]), $t = { class: "b-dropdown-small-textbox__chevron" }, Mt = F({
   name: "dropdown-small-textbox",
   inheritAttrs: !1
-}), At = /* @__PURE__ */ z({
-  ...$t,
+}), Rt = /* @__PURE__ */ F({
+  ...Mt,
   props: {
     /**
      * The number of additional items that have been selected in the dropdown.
@@ -383,49 +383,49 @@ const xt = /* @__PURE__ */ Y(Dt, [["render", It]]), Nt = { class: "b-dropdown-sm
     value: { type: String, default: "" }
   },
   emits: ["clear", "close", "input", "keydown", "open"],
-  setup(t, { expose: r, emit: i }) {
-    const a = i, n = t, l = C(null), e = d(() => ({
+  setup(o, { expose: r, emit: i }) {
+    const a = i, n = o, l = w(null), e = d(() => ({
       [`b-dropdown-small-textbox--${de.DISABLED}`]: n.disabled,
       [`b-dropdown-small-textbox--${de.READONLY}`]: n.readonly,
       [`b-dropdown-small-textbox--${de.OPENED}`]: n.open
-    })), u = d(() => n.open && !n.disabled && !n.readonly), v = (m) => {
-      a("input", m);
-    }, b = (m) => {
-      a("keydown", m);
-    }, c = (m) => {
-      ue(m), a("open");
-    }, g = (m) => {
-      ue(m), a("close");
-    }, p = (m) => {
-      ue(m), a("clear");
-    }, w = {
-      [H.INPUT]: v,
-      [H.OPEN]: c,
-      [H.CLOSE]: g,
-      [H.CLEAR]: p,
-      [H.KEYDOWN]: b
+    })), u = d(() => n.open && !n.disabled && !n.readonly), y = (v) => {
+      a("input", v);
+    }, b = (v) => {
+      a("keydown", v);
+    }, p = (v) => {
+      ue(v), a("open");
+    }, g = (v) => {
+      ue(v), a("close");
+    }, c = (v) => {
+      ue(v), a("clear");
+    }, E = {
+      [J.INPUT]: y,
+      [J.OPEN]: p,
+      [J.CLOSE]: g,
+      [J.CLEAR]: c,
+      [J.KEYDOWN]: b
     };
     return r({
       focus: () => {
         l.value.focus();
       }
-    }), (m, D) => (S(), P("div", {
+    }), (v, D) => (L(), R("div", {
       class: ve(["b-dropdown-small-textbox", e.value])
     }, [
-      X(st, R({
+      X(rt, M({
         ref_key: "baseTextbox",
         ref: l
-      }, { ...m.$attrs, ...m.$props }, {
+      }, { ...v.$attrs, ...v.$props }, {
         class: "b-dropdown-small-textbox__textbox",
         size: s(ee).SMALL
-      }, te(w)), {
-        icon: F(() => [
-          oe("div", Nt, [
-            ae(X(s(xt), { "svg-title": "opened" }, null, 512), [
-              [Ce, u.value]
+      }, te(E)), {
+        icon: K(() => [
+          oe("div", $t, [
+            ae(X(s(At), { "svg-title": "opened" }, null, 512), [
+              [Oe, u.value]
             ]),
-            ae(X(s(Bt), { "svg-title": "closed" }, null, 512), [
-              [Ce, !u.value]
+            ae(X(s(Tt), { "svg-title": "closed" }, null, 512), [
+              [Oe, !u.value]
             ])
           ])
         ]),
@@ -433,110 +433,110 @@ const xt = /* @__PURE__ */ Y(Dt, [["render", It]]), Nt = { class: "b-dropdown-sm
       }, 16, ["size"])
     ], 2));
   }
-}), Mt = /* @__PURE__ */ Y(At, [["__scopeId", "data-v-7702d745"]]), Rt = (t, r) => r.value.reduce((i, a) => {
+}), Pt = /* @__PURE__ */ Z(Rt, [["__scopeId", "data-v-890ca00e"]]), kt = (o, r) => r.value.reduce((i, a) => {
   if (a.items) {
     const n = a.items.filter(
-      (e) => t.value.find((u) => u.value === e.value)
+      (e) => o.value.find((u) => u.value === e.value)
     );
     n.length === a.items.length ? i.push(a.displayValue ?? a.label) : n.forEach(({ label: e, displayValue: u }) => i.push(u ?? e));
   }
-  return t.value.find((n) => n.value === a.value) && i.push(a.displayValue ?? a.label), i;
-}, []).join(", "), Pt = ({ items: t, placeholder: r, selectedValues: i, isMultiSelect: a }) => {
+  return o.value.find((n) => n.value === a.value) && i.push(a.displayValue ?? a.label), i;
+}, []).join(", "), _t = ({ items: o, placeholder: r, selectedValues: i, isMultiSelect: a }) => {
   const n = d(
-    () => a.value && t.value.find((e) => {
+    () => a.value && o.value.find((e) => {
       var u;
       return (u = e.items) == null ? void 0 : u.length;
     })
   );
-  return d(() => i.value.length ? n.value ? Rt(i, t) : i.value.map(({ label: e, displayValue: u }) => u ?? e).join(", ") : r.value || null);
-}, Me = (t) => {
+  return d(() => i.value.length ? n.value ? kt(i, o) : i.value.map(({ label: e, displayValue: u }) => u ?? e).join(", ") : r.value || null);
+}, Me = (o) => {
   var r;
-  (r = t.value.$children) == null || r[0].$refs.textbox.focus();
-}, kt = ({
-  inputContainerRef: t,
+  (r = o.value.$children) == null || r[0].$refs.textbox.focus();
+}, Kt = ({
+  inputContainerRef: o,
   optionsContainerRef: r,
   selectedValueIndex: i,
   isDropdownOpen: a,
   isDynamicFltering: n,
   items: l,
   isMultiple: e
-}, u, v, b) => {
-  const c = async (y) => {
-    var L;
-    n.value && await x(), (L = l.value[y]) == null || L.focus();
-  }, g = async (y) => {
-    var q, Z;
+}, u, y, b) => {
+  const p = async (f) => {
+    var S;
+    n.value && await x(), (S = l.value[f]) == null || S.focus();
+  }, g = async (f) => {
+    var q, j;
     n.value && await x();
-    const L = (q = r.value.$refs.dropdownOptionsListboxRef.$refs.listboxItemRef) == null ? void 0 : q.$el.querySelectorAll(
+    const S = (q = r.value.$refs.dropdownOptionsListboxRef.$refs.listboxItemRef) == null ? void 0 : q.$el.querySelectorAll(
       "button"
     );
-    L.length ? (Z = L[y]) == null || Z.focus() : c(y);
-  }, p = (y) => {
-    var L;
-    return (L = r.value.$refs.dropdownOptionsListboxRef.$refs.listboxItemRef) == null ? void 0 : L.setListboxFocusedIndex(
-      y
+    S.length ? (j = S[f]) == null || j.focus() : p(f);
+  }, c = (f) => {
+    var S;
+    return (S = r.value.$refs.dropdownOptionsListboxRef.$refs.listboxItemRef) == null ? void 0 : S.setListboxFocusedIndex(
+      f
     );
-  }, w = () => {
-    a.value || v(), x(() => {
-      p(0), c(0);
+  }, E = () => {
+    a.value || y(), x(() => {
+      c(0), p(0);
     });
   }, O = () => {
-    a.value || v(), x(() => {
-      p(l.value.length - 1), c(l.value.length - 1);
+    a.value || y(), x(() => {
+      c(l.value.length - 1), p(l.value.length - 1);
     });
-  }, m = ({ detail: y }) => {
-    y.preventDefault(), w();
-  }, D = ({ detail: y }) => {
-    y.preventDefault(), O();
-  }, E = () => {
-    w();
+  }, v = ({ detail: f }) => {
+    f.preventDefault(), E();
+  }, D = ({ detail: f }) => {
+    f.preventDefault(), O();
+  }, C = () => {
+    E();
   }, h = () => {
     O();
-  }, V = ({ detail: y }) => {
-    y.preventDefault(), u(), a.value && x(() => {
-      e ? g(0) : (p(i.value), c(i.value));
+  }, z = ({ detail: f }) => {
+    f.preventDefault(), u(), a.value && x(() => {
+      e ? g(0) : (c(i.value), p(i.value));
     });
-  }, W = ({ detail: y }) => {
-    y.preventDefault(), u(), a.value && x(() => {
-      e ? g(0) : (p(i.value), c(i.value));
+  }, V = ({ detail: f }) => {
+    f.preventDefault(), u(), a.value && x(() => {
+      e ? g(0) : (c(i.value), p(i.value));
     });
   }, N = () => {
     a.value && b();
   }, T = () => {
-    a.value && (b(), Me(t));
+    a.value && (b(), Me(o));
   };
   return d(() => ({
-    [A.ARROW_DOWN]: m,
+    [A.ARROW_DOWN]: v,
     [A.ARROW_UP]: D,
-    [A.HOME]: E,
+    [A.HOME]: C,
     [A.END]: h,
-    ...n.value ? {} : { [A.SPACE]: V },
-    [A.ENTER]: W,
+    ...n.value ? {} : { [A.SPACE]: z },
+    [A.ENTER]: V,
     [A.TAB]: N,
     [A.ESCAPE]: T
   }));
-}, _t = ({ inputContainerRef: t, isDropdownOpen: r }, i) => {
+}, Ft = ({ inputContainerRef: o, isDropdownOpen: r }, i) => {
   const a = () => {
     r.value && i(), x(() => {
-      Me(t);
+      Me(o);
     });
   };
   return {
-    [f.ENTER]: a,
-    [f.ESCAPE]: a,
-    [f.TAB]: a,
-    [f.SPACE]: a
+    [m.ENTER]: a,
+    [m.ESCAPE]: a,
+    [m.TAB]: a,
+    [m.SPACE]: a
   };
 };
-function Kt(t, r, i, a) {
-  const n = C(t), l = C(r), e = (v, b = []) => b.flatMap((c) => c.label.toLocaleLowerCase().includes(v) ? a != null && a.value && c.items ? [...e(v, c.items)] : [c, ...e(v, c.items)] : c.items ? [...e(v, c.items)] : []);
-  return xe(n, () => {
+function zt(o, r, i, a) {
+  const n = w(o), l = w(r), e = (y, b = []) => b.flatMap((p) => p.label.toLocaleLowerCase().includes(y) ? a != null && a.value && p.items ? [...e(y, p.items)] : [p, ...e(y, p.items)] : p.items ? [...e(y, p.items)] : []);
+  return be(n, () => {
     i !== void 0 && i(n.value);
   }), d(() => {
     if (!n.value || i !== void 0)
       return l.value;
-    const v = n.value.toLocaleLowerCase();
-    return e(v, l.value);
+    const y = n.value.toLocaleLowerCase();
+    return e(y, l.value);
   });
 }
 const Re = {
@@ -553,262 +553,273 @@ const Re = {
     all: "Todos",
     clearFilter: "Limpar filtro"
   }
-}, Ft = Symbol("input field component injection key"), ia = Symbol("input field hint injection key"), ra = Symbol("input field parent component injection key"), zt = z({
+}, Vt = Symbol("input field component injection key"), ra = Symbol("input field hint injection key"), da = Symbol("input field parent component injection key"), Wt = F({
   i18n: { messages: Re },
   name: "b-dropdown",
   components: {
-    DropdownInputDefault: it,
-    DropdownInputSmall: Mt
+    DropdownInputDefault: dt,
+    DropdownInputSmall: Pt
   }
-}), Vt = /* @__PURE__ */ z({
-  ...zt,
+}), qt = /* @__PURE__ */ F({
+  ...Wt,
   props: {
     ariaLabel: { default: null },
     condensed: { type: Boolean, default: !1 },
     emptyState: { default: void 0 },
-    disabled: { type: Boolean, default: !1 },
     dynamicFiltering: { type: Boolean, default: !1 },
     error: { type: Boolean, default: !1 },
-    errorMessage: { default: null },
-    description: { default: null },
     hasMoreItems: { type: Boolean, default: !1 },
     isOptionDisabled: { type: Function, default: void 0 },
     items: { default: () => [] },
-    label: { default: null },
     loading: { type: Boolean, default: !1 },
     componentLoading: { type: Boolean, default: !1 },
     lazyLoadType: { default: ye.props.lazyLoadType.default },
     multiple: { type: Boolean, default: !1 },
-    optional: { type: Boolean, default: !1 },
-    placeholder: { default: null },
-    readonly: { type: Boolean, default: !1 },
-    required: { type: Boolean, default: !1 },
     search: { default: void 0 },
     showSlotContentInMultiple: { type: Boolean, default: !1 },
     size: { default: null },
     staticCategories: { type: Boolean, default: !1 },
-    tooltipText: { default: null },
     value: { default: null },
     virtualScroll: { type: [Boolean, Object], default: !1 },
-    enableValueLabelPair: { type: Boolean, default: !1 }
+    enableValueLabelPair: { type: Boolean, default: !1 },
+    description: { default: null },
+    disabled: { type: Boolean, default: !1 },
+    errorMessage: { default: null },
+    label: { default: null },
+    optional: { type: Boolean, default: !1 },
+    placeholder: { default: null },
+    readonly: { type: Boolean, default: !1 },
+    required: { type: Boolean, default: !1 },
+    tooltipText: { default: null }
   },
-  emits: ["input", "show-more"],
-  setup(t, { expose: r, emit: i }) {
-    var Ee;
-    const a = at(), n = Ne(), l = vt(n), e = t, u = i, { t: v } = ge({ messages: Re }), b = C(null), c = C(null), g = C(null), p = C(!1), w = J("bento-dropdown-options-container"), O = J("dropdown-label"), m = J("dropdown-description"), D = J("dropdown-error"), { isReadOnly: E } = pt(B(e, "readonly")), { cachedSelectedListboxOptions: h, cachedListboxSelectedValues: V, setCachedValues: W } = dt(
+  emits: ["input", "show-more", "open"],
+  setup(o, { expose: r, emit: i }) {
+    var Ce;
+    const a = lt(), n = Ne(), l = bt(n), e = o, u = i, { t: y } = he({ messages: Re }), b = w(null), p = w(null), g = w(null), c = w(!1), E = Y("bento-dropdown-options-container"), O = Y("dropdown-label"), v = Y("dropdown-description"), D = Y("dropdown-error"), { isReadOnly: C } = mt(B(e, "readonly")), { cachedSelectedListboxOptions: h, cachedListboxSelectedValues: z, setCachedValues: V } = ct(
       B(e, "items"),
       B(e, "value"),
       B(e, "multiple"),
       B(e, "enableValueLabelPair")
-    ), N = C(a["aria-label"]), { ariaLabel: T, label: $ } = $e(e), y = d(() => v("ariaLabelFallback")), L = rt({
+    ), N = w(a["aria-label"]), T = w(a["aria-describedby"]), { ariaLabel: W, label: f } = Ae(e), S = d(() => y("ariaLabelFallback")), q = ut({
       // TODO: take ariaLabel ref away when aria-label prop is removed
-      ariaLabel: T.value || N,
-      label: $,
-      defaultFallback: y
-    }), q = e.size === ee.SMALL || ot(Ft, !1), Z = d(() => q ? ee.SMALL : ee.DEFAULT), Pe = d(() => ({
+      ariaLabel: W.value || N,
+      label: f,
+      defaultFallback: S
+    }), j = e.size === ee.SMALL || nt(Vt, !1), Pe = d(() => j ? ee.SMALL : ee.DEFAULT), ke = d(() => ({
       "b-dropdown--condensed": e.condensed
-    })), ke = d(() => ({
+    })), _e = d(() => ({
       "b-dropdown__description--error": !!e.errorMessage
-    })), M = C(""), Q = B(e, "items"), Le = B(e, "staticCategories"), le = Kt(M, Q, (Ee = e == null ? void 0 : e.search) == null ? void 0 : Ee.searchEvent, Le), ne = d(() => e.dynamicFiltering && !!M.value), _e = Pt({
+    })), $ = w(""), Q = B(e, "items"), Se = B(e, "staticCategories"), le = zt($, Q, (Ce = e == null ? void 0 : e.search) == null ? void 0 : Ce.searchEvent, Se), ne = d(() => e.dynamicFiltering && !!$.value), Ke = _t({
       items: Q,
       placeholder: B(e, "placeholder"),
       isMultiSelect: B(e, "multiple"),
       selectedValues: h
-    }), Ke = d(() => {
+    }), Fe = d(() => {
       if (e != null && e.multiple && Array.isArray(e.value))
         return e.items.filter(
-          ({ value: o }) => (e == null ? void 0 : e.value) && (e == null ? void 0 : e.value).includes(o)
+          ({ value: t }) => (e == null ? void 0 : e.value) && (e == null ? void 0 : e.value).includes(t)
         );
       if (!e.multiple && e.staticCategories) {
-        const o = e.items.find(
-          (k) => k.items.some((U) => U.value === e.value)
+        const t = e.items.find(
+          (P) => P.items.some((U) => U.value === e.value)
         );
-        return o ? o.items.find((k) => k.value === e.value) : null;
+        return t ? t.items.find((P) => P.value === e.value) : null;
       }
-      return e.items.find(({ value: o }) => o === (e == null ? void 0 : e.value));
-    }), Fe = d(() => {
-      const o = le.value.findIndex(({ value: I }) => e.enableValueLabelPair ? e.value.value === I : e.value === I);
-      return o > -1 ? o : 0;
-    }), { isMultiLevelSelect: Se, flattenedItemsList: ze } = ut(Q), Ve = d(() => Se.value && !e.staticCategories), We = d(() => Ve.value ? "treeitem" : "option"), qe = d(() => {
+      return e.items.find(({ value: t }) => t === (e == null ? void 0 : e.value));
+    }), ze = d(() => {
+      const t = le.value.findIndex(({ value: I }) => e.enableValueLabelPair ? e.value.value === I : e.value === I);
+      return t > -1 ? t : 0;
+    }), { isMultiLevelSelect: we, flattenedItemsList: Ve } = pt(Q), We = d(() => we.value && !e.staticCategories), qe = d(() => We.value ? "treeitem" : "option"), je = d(() => {
       if (e.multiple) {
-        const o = Array.isArray(e.value) ? e.value.length : 0, I = Se.value ? ze.value.length : Q.value.length;
-        return o === 0 ? null : !e.hasMoreItems && I > 0 && I === o ? v("all") : o;
+        const t = Array.isArray(e.value) ? e.value.length : 0, I = we.value ? Ve.value.length : Q.value.length;
+        return t === 0 ? null : !e.hasMoreItems && I > 0 && I === t ? y("all") : t;
       }
       return null;
     }), Ue = d(
-      () => `${e.description ? m : ""} ${e.errorMessage ? D : ""}`.trim() || null
-    ), je = d(() => {
-      var o;
-      return (o = g.value) == null ? void 0 : o.$el;
-    }), { visibleDomOptions: He, updateVisibleDomOptions: we } = ct(
-      je,
+      () => [
+        e.description ? v : null,
+        T.value,
+        e.errorMessage ? D : null
+      ].filter(Boolean).join(" ") || null
+    ), He = d(() => {
+      var t;
+      return (t = g.value) == null ? void 0 : t.$el;
+    }), { visibleDomOptions: Je, updateVisibleDomOptions: Ee } = ft(
+      He,
       le,
-      We
-    ), Je = () => {
-      E.value || (p.value = !0, x(() => {
-        we();
+      qe
+    ), Ye = () => {
+      C.value || (c.value = !0, x(() => {
+        Ee();
       }));
     }, se = () => {
-      p.value = !1;
+      c.value = !1;
     }, ie = () => {
-      E.value || (p.value = !p.value, x(() => {
-        we();
-      }), ne.value && (M.value = ""));
-    }, Ye = () => {
-      ne.value && (M.value = ""), p.value && (p.value = !1, g.value.onOutsideDropdownClick());
-    }, Ze = (o) => {
-      e.multiple || (M.value = "", p.value = !1), W(o), u("input", V.value);
-    }, Qe = () => {
-      u(f.SHOW_MORE);
-    }, Xe = kt(
+      C.value || (c.value = !c.value, x(() => {
+        Ee();
+      }), ne.value && ($.value = ""));
+    }, Ze = () => {
+      ne.value && ($.value = ""), c.value && (c.value = !1, g.value.onOutsideDropdownClick());
+    }, Qe = (t) => {
+      e.multiple || ($.value = "", c.value = !1), V(t), u("input", z.value);
+    }, Xe = () => {
+      u(m.SHOW_MORE);
+    }, Ge = Kt(
       {
         inputContainerRef: b,
         optionsContainerRef: g,
-        selectedValueIndex: Fe,
-        isDropdownOpen: p,
+        selectedValueIndex: ze,
+        isDropdownOpen: c,
         isDynamicFltering: B(e, "dynamicFiltering"),
-        items: He,
+        items: Je,
         isMultiple: e.multiple
       },
       ie,
-      Je,
+      Ye,
       se
-    ), Ge = _t(
+    ), et = Ft(
       {
         inputContainerRef: b,
-        isDropdownOpen: p
+        isDropdownOpen: c
       },
       se
-    ), et = {
-      [f.CLOSE_DROPDOWN]: se,
-      [f.SELECT]: Ze,
-      [f.SHOW_MORE]: Qe,
-      ...Ge
+    ), tt = {
+      [m.CLOSE_DROPDOWN]: se,
+      [m.SELECT]: Qe,
+      [m.SHOW_MORE]: Xe,
+      ...et
     };
-    return e.error && Oe(
+    e.error && Be(
       '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"
-    ), e.size && Oe('BentoDropdown "size" property', "Do not use. Only 'default' size should be used.", "2.0.0"), r({
-      focus: () => {
-        b.value.focus();
+    ), e.size && Be('BentoDropdown "size" property', "Do not use. Only 'default' size should be used.", "2.0.0");
+    const at = () => {
+      b.value.focus();
+    };
+    return be(
+      () => c.value,
+      (t) => {
+        t && u("open");
       }
-    }), (o, I) => {
-      var k;
-      return ae((S(), P("div", {
-        class: ve(["b-dropdown", Pe.value])
+    ), r({
+      focus: at
+    }), (t, I) => {
+      var P;
+      return ae((L(), R("div", {
+        class: ve(["b-dropdown", ke.value])
       }, [
-        s($) ? (S(), _(s(yt), {
+        s(f) ? (L(), k(s(gt), {
           key: 0,
           id: s(O),
-          condensed: o.condensed,
-          label: s($),
-          "tooltip-text": o.tooltipText,
-          optional: o.optional,
-          required: o.required
-        }, null, 8, ["id", "condensed", "label", "tooltip-text", "optional", "required"])) : K("", !0),
-        ae((S(), P("div", R({
+          condensed: t.condensed,
+          label: s(f),
+          "tooltip-text": t.tooltipText,
+          optional: t.optional,
+          required: t.required
+        }, null, 8, ["id", "condensed", "label", "tooltip-text", "optional", "required"])) : _("", !0),
+        ae((L(), R("div", M({
           ref_key: "inputContainerRefWrapper",
-          ref: c
-        }, te(s(Xe), !0)), [
-          (S(), _(Ae(Z.value), {
+          ref: p
+        }, te(s(Ge), !0)), [
+          (L(), k($e(Pe.value), {
             ref_key: "inputContainerRef",
             ref: b,
-            condensed: o.condensed,
-            value: M.value,
-            "additional-items-selected": qe.value,
-            "aria-controls": s(w),
-            ariaExpanded: p.value,
-            "aria-labelledby": s($) ? s(O) : null,
+            condensed: t.condensed,
+            value: $.value,
+            "additional-items-selected": je.value,
+            "aria-controls": s(E),
+            ariaExpanded: c.value,
+            "aria-labelledby": s(f) ? s(O) : null,
             "aria-describedby": Ue.value,
-            "aria-label": s(L),
-            "aria-readonly": s(E),
-            readonly: s(E),
-            required: o.required,
-            disabled: o.disabled,
-            "display-value": s(_e),
-            "dynamic-filtering": o.dynamicFiltering,
-            "is-invalid": !!o.errorMessage || o.error,
-            multiple: o.multiple,
-            open: p.value,
-            "selected-value-item": s(q) ? void 0 : Ke.value,
-            "show-slot-content-in-multiple": o.showSlotContentInMultiple,
-            onInput: I[0] || (I[0] = (U) => M.value = U),
+            "aria-label": s(q),
+            "aria-readonly": s(C),
+            readonly: s(C),
+            required: t.required,
+            disabled: t.disabled,
+            "display-value": s(Ke),
+            "dynamic-filtering": t.dynamicFiltering,
+            "is-invalid": !!t.errorMessage || t.error,
+            multiple: t.multiple,
+            open: c.value,
+            "selected-value-item": s(j) ? void 0 : Fe.value,
+            "show-slot-content-in-multiple": t.showSlotContentInMultiple,
+            onInput: I[0] || (I[0] = (U) => $.value = U),
             onOpen: ie,
             onClose: ie
           }, ce({ _: 2 }, [
-            pe(s(n), (U, j) => ({
-              name: j,
-              fn: F((re) => [
-                G(o.$slots, j, fe(me(re)), void 0, !0)
+            pe(s(n), (U, H) => ({
+              name: H,
+              fn: K((re) => [
+                G(t.$slots, H, fe(me(re)), void 0, !0)
               ])
             }))
           ]), 1064, ["condensed", "value", "additional-items-selected", "aria-controls", "ariaExpanded", "aria-labelledby", "aria-describedby", "aria-label", "aria-readonly", "readonly", "required", "disabled", "display-value", "dynamic-filtering", "is-invalid", "multiple", "open", "selected-value-item", "show-slot-content-in-multiple"]))
         ], 16)), [
-          [s(mt)]
+          [s(yt)]
         ]),
-        b.value ? (S(), _(s(wt), R({
+        b.value ? (L(), k(s(Ct), M({
           key: 1,
-          id: s(w),
+          id: s(E),
           ref_key: "optionsContainerRef",
           ref: g,
-          "aria-label": s(L),
-          "component-loading": o.componentLoading,
-          "empty-state": o.emptyState,
-          "debounce-time": (k = o.search) == null ? void 0 : k.debounceTime,
-          disabled: o.disabled,
-          "is-option-disabled": o.isOptionDisabled,
+          "aria-label": s(q),
+          "component-loading": t.componentLoading,
+          "empty-state": t.emptyState,
+          "debounce-time": (P = t.search) == null ? void 0 : P.debounceTime,
+          disabled: t.disabled,
+          "is-option-disabled": t.isOptionDisabled,
           items: s(le),
-          multiple: o.multiple,
-          "static-categories": Le.value,
-          open: p.value,
+          multiple: t.multiple,
+          "static-categories": Se.value,
+          open: c.value,
           "selected-value": s(h),
           searching: ne.value,
-          "target-element": c.value,
-          loading: o.loading,
-          "has-more-items": o.hasMoreItems,
-          "lazy-load-type": o.lazyLoadType,
-          "virtual-scroll": o.virtualScroll
-        }, te(et)), ce({ _: 2 }, [
-          pe(s(n), (U, j) => ({
-            name: j,
-            fn: F((re) => [
-              G(o.$slots, j, fe(me(re)), void 0, !0)
+          "target-element": p.value,
+          loading: t.loading,
+          "has-more-items": t.hasMoreItems,
+          "lazy-load-type": t.lazyLoadType,
+          "virtual-scroll": t.virtualScroll
+        }, te(tt)), ce({ _: 2 }, [
+          pe(s(n), (U, H) => ({
+            name: H,
+            fn: K((re) => [
+              G(t.$slots, H, fe(me(re)), void 0, !0)
             ])
           }))
-        ]), 1040, ["id", "aria-label", "component-loading", "empty-state", "debounce-time", "disabled", "is-option-disabled", "items", "multiple", "static-categories", "open", "selected-value", "searching", "target-element", "loading", "has-more-items", "lazy-load-type", "virtual-scroll"])) : K("", !0),
-        o.errorMessage ? (S(), _(s(bt), {
+        ]), 1040, ["id", "aria-label", "component-loading", "empty-state", "debounce-time", "disabled", "is-option-disabled", "items", "multiple", "static-categories", "open", "selected-value", "searching", "target-element", "loading", "has-more-items", "lazy-load-type", "virtual-scroll"])) : _("", !0),
+        t.errorMessage ? (L(), k(s(ht), {
           key: 2,
           id: s(D),
-          "error-message": o.errorMessage,
+          "error-message": t.errorMessage,
           class: "b-dropdown__error-message"
-        }, null, 8, ["id", "error-message"])) : K("", !0),
-        o.description || s(l)("description") ? (S(), _(s(nt), {
+        }, null, 8, ["id", "error-message"])) : _("", !0),
+        t.description || s(l)("description") ? (L(), k(s(it), {
           key: 3,
-          id: s(m),
-          class: ve(["b-dropdown__description", ke.value]),
+          id: s(v),
+          class: ve(["b-dropdown__description", _e.value]),
           el: "span"
         }, {
-          default: F(() => [
-            G(o.$slots, "description", {}, () => [
-              lt(be(o.description), 1)
+          default: K(() => [
+            G(t.$slots, "description", {}, () => [
+              st(ge(t.description), 1)
             ], !0)
           ]),
           _: 3
-        }, 8, ["id", "class"])) : K("", !0)
+        }, 8, ["id", "class"])) : _("", !0)
       ], 2)), [
-        [s(ft), Ye]
+        [s(vt), Ze]
       ]);
     };
   }
-}), da = /* @__PURE__ */ Y(Vt, [["__scopeId", "data-v-d801c4da"]]);
+}), ua = /* @__PURE__ */ Z(qt, [["__scopeId", "data-v-3532dd72"]]);
 export {
-  da as B,
-  ia as I,
-  Ft as a,
-  ra as b,
-  Kt as u
+  ua as B,
+  ra as I,
+  Vt as a,
+  da as b,
+  zt as u
 };
-//# sourceMappingURL=dropdown.GyDAswAO.js.map
+//# sourceMappingURL=dropdown.bLsoTZbw.js.map