@adyen/bento-vue3 1.83.0 → 1.84.0

package/dist/chunks/filter-bar.D0BEt7ia.js

@@ -0,0 +1,3363 @@
+import { ref as j, onMounted as je, watch as ie, computed as c, defineComponent as Q, useSlots as Me, useAttrs as Wt, createBlock as R, openBlock as F, unref as v, mergeProps as se, withCtx as D, createElementVNode as Y, renderSlot as ye, createCommentVNode as Z, createVNode as L, createTextVNode as X, toDisplayString as x, createElementBlock as W, normalizeClass as de, withDirectives as Ye, withKeys as ge, nextTick as bt, toRef as ee, onBeforeUpdate as He, provide as ft, resolveComponent as G, Fragment as Ue, reactive as Zt, isRef as Qt, createSlots as Ee, renderList as Be, normalizeProps as Ve, guardReactiveProps as we, vShow as Xt, resolveDynamicComponent as ke } from "vue";
+import { B as Ne, b as Ie } from "./search-bar.BF8M5OSY.js";
+import { u as xt } from "./use-bento-toast-controller.V61h7XzI.js";
+import { u as ve } from "./index.pdBj0KQU.js";
+import { k as el } from "./index.E60QniEu.js";
+import { F as vt } from "./fixed-scroller.e56yJp7Q.js";
+import { _ as tl } from "./modal.vue_vue_type_script_setup_true_lang.CRovU08l.js";
+import { B as ll } from "./button.CSp48LJt.js";
+import { B as mt } from "./radio-group.BqsQRDjs.js";
+import { t as Fe } from "./truncate.BfIl_-71.js";
+import { B as me, d as Ge, p as al } from "./typography.6Oo5TOMP.js";
+import { u as ol, d as yt, h as nl, I as il, k as sl, B as rl } from "./button-actions.Crj4QFAd.js";
+import { b as ht } from "./tooltip.Nn3o8_vO.js";
+import { _ as le } from "./_plugin-vue_export-helper.CHgC5LLL.js";
+import { g as Le } from "./generate-uid.NJ8tVoha.js";
+import { C as gt } from "./cross-small.n1UO5wNB.js";
+import { B as Ft, a as xe } from "./base-button.CUd03aA2.js";
+import { u as St } from "./use-has-slot.B7eQSabc.js";
+import { u as Bt } from "./aria-label.CaUURpnB.js";
+import { g as Ct } from "./get-slot-text.CQRAP2_q.js";
+import { B as We } from "./input-field.C2SQq0V1.js";
+import { B as ul } from "./checkbox-group.DZrhxIHp.js";
+import { u as Ze, B as dl } from "./dropdown.D0_8f9Mz.js";
+import { g as cl } from "./focus-trap.BaHvK7aT.js";
+import { C as pl } from "./chevron-up.kfuLRpZb.js";
+import { C as bl } from "./chevron-down.DCQ6ZLaq.js";
+/* empty css              */
+import { C as fl } from "./checkbox-input.Dk9iFQQe.js";
+import { c as et, b as vl, C as ml } from "./use-cached-selected-values.BZIa5TRx.js";
+import { B as Qe } from "./divider.Dho4_hQ7.js";
+import { L as Dt } from "./listbox-option-tag.BQZJF00q.js";
+import { B as yl } from "./payment-method.BGEBaa4w.js";
+import { u as hl } from "./use-country-items.JZCYNoW7.js";
+import { B as gl } from "./avatar.CNGMjwg3.js";
+import { a as Fl, B as Sl, f as _e, g as Bl, D as tt, i as Je, b as Cl } from "./date-range-picker.TsUvRvGy.js";
+import { b as Dl, g as Al, i as Tl } from "./calendar.DKPx_cQU.js";
+import { B as Il } from "./date-picker.dyp0YK9_.js";
+import { R as lt } from "./refresh.BB4ouvz_.js";
+import "../assets/filter-bar.css";
+const At = (e) => e === null || typeof e != "object" ? !1 : Object.prototype.toString.call(e) === "[object Object]", Tt = (e) => Array.isArray(e), at = (e) => Tt(e) ? e.length === 0 || e.every((n) => n === "") : !e, qe = (e, n) => JSON.stringify(e) === JSON.stringify(n), $e = (e) => At(e) ? e instanceof Date ? new Date(e.getTime()) : Tt(e) ? e.map((n) => $e(n)) : Object.keys(e).reduce((n, t) => (n[t] = $e(e[t]), n), {}) : e, _l = (e) => At(e) ? Object.fromEntries(Object.keys(e).map((n) => [n, void 0])) : void 0;
+function It(e, n) {
+  const t = j(), i = j();
+  je(() => {
+    e.value != null && (i.value = _l(e.value));
+  }), ie(
+    () => e.value,
+    (d) => {
+      t.value = $e(d);
+    },
+    { immediate: !0 }
+  );
+  const l = c(
+    () => at(e.value) || qe(e.value, i.value)
+  ), o = c(
+    () => n.value != null ? qe(n.value, e.value) : l.value
+  ), u = c(() => qe(t.value, e.value) || at(t.value) && l.value);
+  function a(d) {
+    t.value = $e(i.value), d && d(t.value);
+  }
+  function r(d) {
+    t.value = $e(n.value), d && d(t.value);
+  }
+  function f(d) {
+    t.value = $e(e.value), d && d(t.value);
+  }
+  return {
+    // Values
+    internalFilterValue: t,
+    isSecondaryButtonDisabled: o,
+    isApplyButtonDisabled: u,
+    // Methods
+    clearFilter: a,
+    resetFilter: r,
+    openFilter: f
+  };
+}
+const $l = { class: "b-filter-bar-button__container" }, Ol = { class: "b-filter-bar-button__label-container" }, Pl = {}, Ul = /* @__PURE__ */ Q({
+  ...Pl,
+  __name: "filter-bar-button",
+  props: {
+    /**
+     * Allows to set the button as active without setting a "secondaryLabel"
+     */
+    active: { type: Boolean, default: !1 },
+    /**
+     * The number of applied values within the filter.
+     * Text can also be applied here such as 'All'.
+     * e.g. if 2 items in a dropdown filter have been applied, the number 2 will be shown here.
+     */
+    appliedFiltersCount: { type: [String, Number], default: null },
+    /**
+     * Disables button functionality.
+     */
+    disabled: { type: Boolean, default: !1 },
+    /**
+     * Signifies if the filter is open or closed.
+     */
+    isFilterOpen: { type: Boolean, default: !1 },
+    /**
+     * Signifies if the filter is a persistent filter
+     */
+    isPersistentFilter: { type: Boolean, default: !1 },
+    /**
+     * Renders the button without the applied state styles
+     */
+    noAppliedStateStyles: { type: Boolean, default: !1 },
+    /**
+     * A secondary label to be added next to the primary for additional filtering information.
+     * i.e. Can be used to show the set value for said filter.
+     */
+    secondaryLabel: { type: String, default: null }
+  },
+  emits: ["click"],
+  setup(e, { emit: n }) {
+    const t = e, i = n, l = Me(), o = Wt(), u = St(l), a = c(() => l.default ? Ct(l)("default") : null), r = c(() => !u("default") && u("iconLeft")), f = Bt({ ariaLabel: a }), d = j(null), S = c(() => {
+      var y;
+      return {
+        "aria-controls": (y = o["aria-controls"]) == null ? void 0 : y.toString()
+      };
+    }), O = c(
+      () => (t.appliedFiltersCount || t.secondaryLabel || t.isPersistentFilter) && !t.noAppliedStateStyles
+    ), s = c(() => ({
+      "b-filter-bar-button--applied": O.value || t.active,
+      "b-filter-bar-button--filter-open": t.isFilterOpen && !O.value,
+      "b-filter-bar-button--filter-open-applied": t.isFilterOpen && O.value,
+      "b-filter-bar-button--with-secondary-label": t.secondaryLabel,
+      "b-filter-bar-button--with-counter": t.appliedFiltersCount,
+      "b-filter-bar-button--icon-only": r.value
+    })), m = (y) => {
+      y.preventDefault(), t.disabled || i("click", y);
+    };
+    return (y, I) => (F(), R(v(Ft), se({
+      ref_key: "filterBarButtonRef",
+      ref: d
+    }, y.$attrs, {
+      class: ["b-filter-bar-button", s.value],
+      disabled: e.disabled,
+      "aria-label": v(f),
+      "aria-controls": S.value["aria-controls"],
+      type: "button",
+      onClick: m
+    }), {
+      iconRight: D(() => [
+        e.appliedFiltersCount && !r.value ? (F(), R(v(me), {
+          key: 0,
+          class: "b-filter-bar-button__counter",
+          el: "span",
+          variant: "body",
+          stronger: ""
+        }, {
+          default: D(() => [
+            X(x(e.appliedFiltersCount), 1)
+          ]),
+          _: 1
+        })) : Z("", !0)
+      ]),
+      default: D(() => [
+        Y("div", $l, [
+          v(u)("iconLeft") ? ye(y.$slots, "iconLeft", { key: 0 }, void 0, !0) : Z("", !0),
+          Y("div", Ol, [
+            L(v(me), {
+              el: "span",
+              variant: "body",
+              stronger: "",
+              class: "b-filter-bar-button__label"
+            }, {
+              default: D(() => [
+                Y("span", null, [
+                  ye(y.$slots, "default", {}, void 0, !0)
+                ]),
+                e.secondaryLabel && !r.value ? (F(), R(v(me), {
+                  key: 0,
+                  el: "span",
+                  variant: "body",
+                  stronger: "",
+                  class: "b-filter-bar-button__label"
+                }, {
+                  default: D(() => I[0] || (I[0] = [
+                    X(":")
+                  ])),
+                  _: 1
+                })) : Z("", !0)
+              ]),
+              _: 3
+            }),
+            e.secondaryLabel && !r.value ? (F(), R(v(me), {
+              key: 0,
+              el: "span",
+              variant: "body",
+              stronger: "",
+              class: "b-filter-bar-button__secondary-label"
+            }, {
+              default: D(() => [
+                X(x(e.secondaryLabel), 1)
+              ]),
+              _: 1
+            })) : Z("", !0)
+          ])
+        ])
+      ]),
+      _: 3
+    }, 16, ["class", "disabled", "aria-label", "aria-controls"]));
+  }
+}), Ae = /* @__PURE__ */ le(Ul, [["__scopeId", "data-v-e8fc31f4"]]);
+var $ = /* @__PURE__ */ ((e) => (e.INPUT = "input", e.UPDATE = "update", e))($ || {}), De = /* @__PURE__ */ ((e) => (e.INPUT = "input", e.UPDATE_FILTER_VALUES_OBJECT = "update:filter-values-object", e.UPDATE_FILTER_VALUES_ARRAY = "update:filter-values", e))(De || {}), ne = /* @__PURE__ */ ((e) => (e.BOOLEAN = "BentoBooleanFilter", e.RANGE = "BentoRangeFilter", e.INPUT = "BentoInputFilter", e.INPUT_DROPDOWN = "BentoInputWithDropdownFilter", e.SELECT = "BentoSelectFilter", e.SELECT_AVATAR = "BentoSelectAvatarFilter", e.SELECT_COUNTRY = "BentoSelectCountryFilter", e.SELECT_CURRENCY = "BentoSelectCurrencyFilter", e.SELECT_PAYMENT_METHOD = "BentoSelectPaymentMethodFilter", e.SELECT_TAG = "BentoSelectTagFilter", e.DATE = "BentoDateFilter", e.DATE_RANGE = "BentoDateRangeFilter", e.RADIO_GROUP = "BentoRadioGroupFilter", e.CHECKBOX_GROUP = "BentoCheckboxGroupFilter", e.TOGGLE = "BentoToggleFilter", e))(ne || {});
+const ot = 430, nt = 700;
+function El(e, n) {
+  const t = j("div"), i = j(!1), l = j(0), o = c(() => !(l.value < ot && n.value.small === "multi-line"));
+  function u() {
+    i.value = !1, t.value = "div";
+  }
+  function a() {
+    i.value = !0, t.value = vt;
+  }
+  function r() {
+    l.value > nt || l.value < nt && l.value >= ot && n.value.medium === "multi-line" ? u() : a();
+  }
+  return ie(() => n.value, r), el(e, (f) => {
+    l.value = f[0].contentRect.width, r();
+  }), {
+    screenLayoutComponent: t,
+    showSearchbarInsideContainer: o,
+    isOneLineLayout: i
+  };
+}
+const Ll = {}, Rl = /* @__PURE__ */ Q({
+  ...Ll,
+  __name: "filter-bar-button-group",
+  props: {
+    isActive: { type: Boolean, default: !1 },
+    skipGrouping: { type: Boolean, default: !1 }
+  },
+  setup(e) {
+    const n = e, t = c(() => ({
+      "b-filter-bar-button-group--active": n.isActive,
+      "b-filter-bar-button-group--grouped": !n.skipGrouping
+    }));
+    return (i, l) => (F(), W("div", {
+      class: de(["b-filter-bar-button-group", t.value])
+    }, [
+      ye(i.$slots, "default", {}, void 0, !0)
+    ], 2));
+  }
+}), _t = /* @__PURE__ */ le(Rl, [["__scopeId", "data-v-9ce16194"]]);
+var ue = /* @__PURE__ */ ((e) => (e.APPLY = "apply", e.CLEAR = "clear", e.OPEN = "open", e.CLOSE = "close", e.RESET = "reset", e.CANCEL = "cancel", e))(ue || {});
+const $t = {
+  "en-US": {
+    apply: "Apply",
+    clear: "Clear",
+    clearFilter: "Clear filter {function}",
+    filtersHaveBeenCleared: "Filters have been cleared",
+    numberSelected: "{numberOfItemsSelected} selected",
+    reset: "Reset",
+    resetFilter: "Reset filter {function}"
+  },
+  "ja-JP": {
+    apply: "適用",
+    clear: "クリア",
+    clearFilter: "フィルターをクリア{function}",
+    filtersHaveBeenCleared: "フィルターをクリアしました",
+    numberSelected: "{numberOfItemsSelected}件選択済み",
+    reset: "リセット",
+    resetFilter: "フィルターをリセット{function}"
+  },
+  "pt-BR": {
+    apply: "Aplicar",
+    clear: "Limpar",
+    clearFilter: "Limpar filtro {function}",
+    filtersHaveBeenCleared: "Os filtros foram apagados",
+    numberSelected: "{numberOfItemsSelected} selecionados",
+    reset: "Reiniciar",
+    resetFilter: "Redefinir filtro {function}"
+  }
+}, kl = { key: 0 }, Vl = {
+  key: 1,
+  class: "b-base-filter"
+}, wl = {
+  i18n: { messages: $t },
+  name: "bento-base-filter"
+}, Nl = /* @__PURE__ */ Q({
+  ...wl,
+  props: {
+    appliedFiltersCount: { default: null },
+    buttonLabel: { default: void 0 },
+    buttonSecondaryLabel: { default: void 0 },
+    disabled: { type: Boolean, default: !1 },
+    defaultValue: { type: [String, null, Object, Number, Array, Date, Boolean], default: null },
+    onlySlot: { type: Boolean, default: !1 },
+    controlled: { type: Boolean, default: !1 },
+    disableApplyButton: { type: Boolean, default: !1 },
+    disableSecondaryButton: { type: Boolean, default: !1 },
+    field: {},
+    label: {},
+    fitContent: { type: Boolean, default: void 0 },
+    tooltipText: { default: void 0 },
+    tooltipPosition: { default: void 0 },
+    value: { type: [String, null, Object, Number, Array, Date, Boolean], default: void 0 }
+  },
+  emits: [
+    ue.APPLY,
+    ue.CLEAR,
+    ue.OPEN,
+    ue.CLOSE,
+    ue.RESET,
+    ue.CANCEL
+  ],
+  setup(e, { expose: n, emit: t }) {
+    const i = t, l = e, { t: o } = ve({ messages: $t }), u = Le("base-filter-popover"), a = j(!1), r = j(null), f = j(null), d = c(() => l.defaultValue !== null), S = c(() => d.value ? JSON.stringify(l.value) !== JSON.stringify(l.defaultValue) : l.appliedFiltersCount || l.buttonSecondaryLabel), O = c(() => {
+      let U = l.buttonSecondaryLabel ? `: ${l.buttonSecondaryLabel}` : "";
+      return l.appliedFiltersCount && (U = `: ${o("numberSelected", { numberOfItemsSelected: l.appliedFiltersCount })}`), (d.value ? l.label : m.value) + U;
+    }), s = c(
+      () => d.value ? o("resetFilter", {
+        function: m.value
+      }) : o("clearFilter", {
+        function: m.value
+      })
+    ), m = c(() => l.buttonLabel || l.label), y = async () => {
+      var U, A;
+      await bt(), (A = (U = r.value) == null ? void 0 : U.$el) == null || A.focus();
+    }, I = () => {
+      a.value && (a.value = !1, y(), i(ue.CLOSE));
+    }, E = () => {
+      d.value ? i(ue.RESET) : i(ue.CLEAR), y();
+    }, P = () => {
+      I(), E();
+    }, _ = () => {
+      a.value ? I() : (a.value = !0, i(ue.OPEN));
+    }, M = () => {
+      I(), i(ue.APPLY);
+    }, B = () => {
+      I(), i(ue.CANCEL);
+    }, N = () => B(), H = c(() => [
+      {
+        title: o("apply"),
+        event: M,
+        disabled: l.disableApplyButton
+      },
+      {
+        title: d.value ? o("reset") : o("clear"),
+        event: P,
+        disabled: l.disableSecondaryButton
+      }
+    ]);
+    return ie(
+      () => a.value,
+      (U, A) => {
+        var J, z;
+        !U && A && (z = (J = r.value) == null ? void 0 : J.filterBarButtonRef) != null && z.bentoBaseButtonRef && r.value.filterBarButtonRef.bentoBaseButtonRef.focus();
+      }
+    ), ol(f, N, { ignore: [r] }), n({
+      closePopover: I
+    }), (U, A) => U.onlySlot ? (F(), W("div", kl, [
+      ye(U.$slots, "default", {}, void 0, !0)
+    ])) : (F(), W("div", Vl, [
+      Ye((F(), R(_t, {
+        "is-active": a.value,
+        "skip-grouping": !S.value
+      }, {
+        default: D(() => [
+          L(v(Ae), {
+            ref_key: "filterButtonRef",
+            ref: r,
+            "aria-label": O.value,
+            "aria-controls": a.value ? v(u) : null,
+            "applied-filters-count": U.appliedFiltersCount,
+            disabled: U.disabled,
+            "is-persistent-filter": d.value,
+            "is-filter-open": a.value,
+            "secondary-label": U.buttonSecondaryLabel,
+            onClick: _,
+            onKeydown: ge(I, ["esc"])
+          }, {
+            default: D(() => [
+              X(x(m.value), 1)
+            ]),
+            _: 1
+          }, 8, ["aria-label", "aria-controls", "applied-filters-count", "disabled", "is-persistent-filter", "is-filter-open", "secondary-label"]),
+          S.value ? (F(), R(v(Ae), {
+            key: 0,
+            "applied-filters-count": U.appliedFiltersCount,
+            disabled: U.disabled,
+            "is-persistent-filter": d.value,
+            "is-filter-open": a.value,
+            "secondary-label": U.buttonSecondaryLabel,
+            onClick: E
+          }, {
+            iconLeft: D(() => [
+              L(v(gt), { "svg-title": s.value }, null, 8, ["svg-title"])
+            ]),
+            _: 1
+          }, 8, ["applied-filters-count", "disabled", "is-persistent-filter", "is-filter-open", "secondary-label"])) : Z("", !0)
+        ]),
+        _: 1
+      }, 8, ["is-active", "skip-grouping"])), [
+        [v(ht), U.tooltipText, U.tooltipPosition]
+      ]),
+      r.value ? (F(), R(yt, { key: 0 }, {
+        default: D(() => [
+          r.value ? (F(), R(nl, {
+            key: 0,
+            id: v(u),
+            ref_key: "popoverRef",
+            ref: f,
+            class: "b-base-filter__popover",
+            divider: "",
+            "aria-label": U.label,
+            open: a.value,
+            actions: U.controlled ? null : H.value,
+            "actions-layout": "space-between",
+            "target-element": r.value,
+            title: U.controlled ? null : U.label,
+            "fit-content": U.fitContent,
+            position: "bottom-start",
+            "without-space": U.controlled,
+            "fallback-position": ["bottom-end"],
+            "overflow-visible": ""
+          }, {
+            default: D(() => [
+              Y("div", {
+                onKeydown: ge(B, ["esc"])
+              }, [
+                ye(U.$slots, "default", {}, void 0, !0)
+              ], 32)
+            ]),
+            _: 3
+          }, 8, ["id", "aria-label", "open", "actions", "target-element", "title", "fit-content", "without-space"])) : Z("", !0)
+        ]),
+        _: 3
+      })) : Z("", !0)
+    ]));
+  }
+}), Se = /* @__PURE__ */ le(Nl, [["__scopeId", "data-v-79ccf445"]]), jl = (e) => e instanceof Array, it = (e) => jl(e) ? e.length === 0 || e.every((n) => n === "") : !e, st = (e, n) => JSON.stringify(e) === JSON.stringify(n), Ce = (e, n) => {
+  const t = j(e.value);
+  ie(
+    () => e.value,
+    () => {
+      t.value = e.value;
+    }
+  );
+  const i = c(() => it(e.value)), l = c(
+    () => n.value !== null ? st(n.value, e.value) : i.value
+  ), o = c(() => st(t.value, e.value) || it(t.value) && i.value);
+  return {
+    internalFilterValue: t,
+    isSecondaryButtonDisabled: l,
+    isApplyButtonDisabled: o
+  };
+}, Ml = {
+  name: "bento-input-filter"
+}, Hl = /* @__PURE__ */ Q({
+  ...Ml,
+  props: {
+    defaultValue: { default: null },
+    disabled: { type: Boolean, default: !1 },
+    field: {},
+    label: {},
+    onlySlot: { type: Boolean, default: !1 },
+    options: { default: void 0 },
+    value: { default: null }
+  },
+  emits: ["input", "update"],
+  setup(e, { emit: n }) {
+    var H, U;
+    const t = e, i = n, l = j(null), o = j((U = (H = t == null ? void 0 : t.options) == null ? void 0 : H.dropdown) == null ? void 0 : U.value), u = c(
+      () => {
+        var A, J;
+        return ((A = t == null ? void 0 : t.options) == null ? void 0 : A.variant) === "dropdown" && ((J = t == null ? void 0 : t.options) == null ? void 0 : J.dropdown) !== void 0;
+      }
+    ), a = c(
+      () => {
+        var A;
+        return u.value ? { ...(A = t == null ? void 0 : t.options) == null ? void 0 : A.dropdown, value: o.value } : void 0;
+      }
+    ), r = c(() => {
+      var A;
+      return ((A = t == null ? void 0 : t.options) == null ? void 0 : A.variant) === "dropdown" ? "dropdown" : "default";
+    }), f = c(
+      () => {
+        var A;
+        return u.value ? (A = t.value) == null ? void 0 : A.inputValue : t == null ? void 0 : t.value;
+      }
+    ), { internalFilterValue: d, isSecondaryButtonDisabled: S, isApplyButtonDisabled: O } = Ce(
+      f,
+      ee(t, "defaultValue")
+    ), s = c(() => t.label), m = c(() => Fe(f.value, 12)), y = c(() => ({
+      "b-input-filter--only-slot": t.onlySlot
+    }));
+    He(() => {
+      d.value === "" && (d.value = null);
+    }), ie(l, () => {
+      var A;
+      (A = l.value) == null || A.focusInput();
+    });
+    const I = () => {
+      d.value = f.value;
+    }, E = () => {
+      !d.value && t.defaultValue !== null && (d.value = t.defaultValue), i("update", {
+        ...t,
+        value: u.value ? {
+          inputValue: d.value,
+          dropdownValue: o.value
+        } : d.value
+      });
+    }, P = () => i("update", { ...t, value: t.defaultValue }), _ = () => {
+      d.value = null, E();
+    }, M = () => {
+      i("input", { ...t, value: d.value });
+    }, B = (A) => {
+      d.value = A;
+    }, N = (A) => {
+      o.value = A;
+    };
+    return ft(il, u.value), ie(
+      () => t.options,
+      () => {
+        var A, J, z;
+        ((A = t.options) != null && A.dropdown || (J = t.options) != null && J.dropdownPosition || (z = t.options) != null && z.variant) && Ge(
+          'BentoInputFilter "options" property',
+          `BentoInputFilter "options" no longer supports "dropdown", "dropdownPosition" or "variant" attributes.
+                            Use the "BentoFilterItemType.INPUT_DROPDOWN" instead of "BentoFilterItemType.INPUT"
+                            <bento-filter-bar
+                               :config="[{
+                                    field: 'name',
+                                    label: 'Name',
+                                    type: BentoFilterItemType.INPUT_DROPDOWN,
+                                    options: [...],
+                                }]"
+                            />`,
+          "2.0.0"
+        );
+      },
+      { immediate: !0 }
+    ), (A, J) => {
+      var z, ae;
+      return F(), R(v(Se), se(A.$props, {
+        "button-label": s.value,
+        "button-secondary-label": m.value,
+        "disable-apply-button": v(O),
+        "disable-secondary-button": v(S),
+        "only-slot": A.onlySlot,
+        "popover-overflow-visible": u.value,
+        "tooltip-position": (z = A.options) == null ? void 0 : z.tooltipPosition,
+        "tooltip-text": (ae = A.options) == null ? void 0 : ae.tooltipText,
+        onApply: E,
+        onClear: _,
+        onOpen: I,
+        onReset: P
+      }), {
+        default: D(() => {
+          var T, h;
+          return [
+            Y("div", {
+              class: de(["b-input-filter", y.value]),
+              onKeydown: ge(E, ["enter"]),
+              onInput: M
+            }, [
+              L(v(We), {
+                ref_key: "inputTextRef",
+                ref: l,
+                dropdown: a.value,
+                "dropdown-position": (T = A.options) == null ? void 0 : T.dropdownPosition,
+                placeholder: (h = A.options) == null ? void 0 : h.placeholder,
+                variant: r.value,
+                "model-value": v(d),
+                disabled: A.disabled,
+                "onUpdate:modelValue": B,
+                onDropdownInput: N
+              }, null, 8, ["dropdown", "dropdown-position", "placeholder", "variant", "model-value", "disabled"])
+            ], 34)
+          ];
+        }),
+        _: 1
+      }, 16, ["button-label", "button-secondary-label", "disable-apply-button", "disable-secondary-button", "only-slot", "popover-overflow-visible", "tooltip-position", "tooltip-text"]);
+    };
+  }
+}), Ot = /* @__PURE__ */ le(Hl, [["__scopeId", "data-v-57f2a128"]]), Gl = {
+  name: "bento-input-with-dropdown-filter"
+}, Kl = /* @__PURE__ */ Q({
+  ...Gl,
+  props: {
+    disabled: { type: Boolean },
+    defaultValue: { default: void 0 },
+    field: {},
+    label: {},
+    onlySlot: { type: Boolean, default: !1 },
+    options: { default: void 0 },
+    value: { default: void 0 }
+  },
+  emits: [$.INPUT, $.UPDATE],
+  setup(e, { emit: n }) {
+    const t = e, i = n, l = j(null), { internalFilterValue: o, isSecondaryButtonDisabled: u, isApplyButtonDisabled: a } = Ce(ee(t, "value"), ee(t, "defaultValue")), r = c(() => t.label), f = c(() => {
+      var B;
+      return Fe((B = t.value) == null ? void 0 : B.inputValue, 12);
+    }), d = c(
+      () => {
+        var B, N, H, U, A;
+        return ((B = o.value) == null ? void 0 : B.dropdownValue) ?? ((H = (N = t.options) == null ? void 0 : N.dropdown) == null ? void 0 : H.modelValue) ?? ((A = (U = t.options) == null ? void 0 : U.dropdown) == null ? void 0 : A.value);
+      }
+    ), S = c(() => {
+      var B;
+      return {
+        ...((B = t.options) == null ? void 0 : B.dropdown) || {},
+        modelValue: d.value
+      };
+    }), O = c(() => ({
+      "b-input-with-dropdown-filter--only-slot": t.onlySlot
+    })), s = c(() => {
+      var N;
+      return !(!!((N = o.value) != null && N.inputValue) && !!d.value) || a.value;
+    });
+    He(() => {
+      var B;
+      ((B = o.value) == null ? void 0 : B.inputValue) === "" && (o.value = { ...o.value, inputValue: void 0 });
+    }), ie(l, () => {
+      var B;
+      (B = l.value) == null || B.focusInput();
+    });
+    const m = () => {
+      o.value = t.value;
+    }, y = () => {
+      var B;
+      !((B = o.value) != null && B.inputValue) && t.defaultValue !== null && (o.value = { ...t.defaultValue }), i($.UPDATE, {
+        ...t,
+        value: o.value
+      });
+    }, I = () => i($.UPDATE, { ...t, value: t.defaultValue }), E = () => {
+      o.value = null, y();
+    }, P = () => {
+      i($.INPUT, { ...t, value: o.value });
+    }, _ = (B) => {
+      o.value = { dropdownValue: d.value, inputValue: B };
+    }, M = (B) => {
+      o.value = { ...o.value, dropdownValue: B };
+    };
+    return ft(sl, !0), (B, N) => {
+      var H, U;
+      return F(), R(v(Se), se(B.$props, {
+        "button-label": r.value,
+        "button-secondary-label": f.value,
+        "disable-apply-button": s.value,
+        "disable-secondary-button": v(u),
+        "only-slot": B.onlySlot,
+        "tooltip-position": (H = B.options) == null ? void 0 : H.tooltipPosition,
+        "tooltip-text": (U = B.options) == null ? void 0 : U.tooltipText,
+        onApply: y,
+        onClear: E,
+        onOpen: m,
+        onReset: I
+      }), {
+        default: D(() => {
+          var A, J;
+          return [
+            Y("div", {
+              class: de(["b-input-with-dropdown-filter", O.value]),
+              onKeydown: ge(y, ["enter"]),
+              onInput: P
+            }, [
+              L(v(We), {
+                ref_key: "inputTextRef",
+                ref: l,
+                dropdown: S.value,
+                "dropdown-position": (A = B.options) == null ? void 0 : A.dropdownPosition,
+                variant: "dropdown",
+                "model-value": (J = v(o)) == null ? void 0 : J.inputValue,
+                disabled: B.disabled,
+                "onUpdate:modelValue": _,
+                onDropdownInput: M
+              }, null, 8, ["dropdown", "dropdown-position", "model-value", "disabled"])
+            ], 34)
+          ];
+        }),
+        _: 1
+      }, 16, ["button-label", "button-secondary-label", "disable-apply-button", "disable-secondary-button", "only-slot", "tooltip-position", "tooltip-text"]);
+    };
+  }
+}), Pt = /* @__PURE__ */ le(Kl, [["__scopeId", "data-v-db04529c"]]), Jl = Q({
+  name: "bento-date-filter",
+  components: {
+    BentoBaseFilter: Se,
+    BentoDatePicker: Il,
+    BentoDivider: Qe,
+    Calendar: Dl
+  },
+  props: {
+    /**
+     * Disables the filter from being interacted with.
+     */
+    disabled: { type: Boolean, default: !1 },
+    isDateInput: { type: Boolean, default: !0 },
+    /**
+     * Default value of the filter to reset to.
+     */
+    defaultValue: { type: Date, default: null },
+    /**
+     * Filter name/key referencing the actual property name in the data set.
+     * Should be unique per filter bar.
+     */
+    field: { type: String, required: !0 },
+    /**
+     * Label text to be displayed
+     */
+    label: { type: String, required: !0 },
+    /**
+     * Renders the base filter's slot content only - leaving out the button and the popover.
+     * Used for the allFiltersModal component.
+     */
+    onlySlot: { type: Boolean, default: !1 },
+    /**
+     * List of options that are needed to setup the filter
+     * Available options:
+     *   - firstDayOfWeek: Allows you to set the first day of the week. 0 is sunday, 1 is monday, 6 is saturday
+     *   - isDateDisabled: Indicate if a date should be disabled or not
+     *   - tooltipPosition: The position of the tooltip attached to the filter button
+     *   - tooltipText: The content of the tooltip attached to the filter button
+     */
+    options: {
+      type: Object,
+      default: void 0
+    },
+    /**
+     * Current value of the filter
+     */
+    value: { type: Date, default: void 0 }
+  },
+  emits: [$.INPUT, $.UPDATE],
+  setup(e, { emit: n }) {
+    const { locale: t } = ve(void 0), { internalFilterValue: i, isSecondaryButtonDisabled: l, isApplyButtonDisabled: o } = Ce(
+      ee(e, "value"),
+      ee(e, "defaultValue")
+    ), u = c(() => {
+      var I;
+      const y = ((I = e == null ? void 0 : e.options) == null ? void 0 : I.variant) === "month" ? { month: "long", year: "numeric" } : { day: "numeric", month: "short", year: "numeric" };
+      return e.value ? Al(t.value, y).format(e.value) : null;
+    }), a = c(() => e.label), r = c(() => u.value), f = () => {
+      n($.UPDATE, { ...e, value: i.value });
+    }, d = () => {
+      i.value = null, f();
+    }, S = () => {
+      i.value = e.defaultValue, f();
+    }, O = () => {
+      i.value = e.value;
+    }, s = (y) => {
+      i.value = y, n($.INPUT, { ...e, value: i.value });
+    };
+    return {
+      // Values
+      internalFilterValue: i,
+      isApplyButtonDisabled: o,
+      isSecondaryButtonDisabled: l,
+      buttonLabel: a,
+      buttonSecondaryLabel: r,
+      // Events
+      clearFilter: d,
+      onDateSelected: s,
+      openFilter: O,
+      updateFilter: f,
+      resetFilter: S,
+      onDateInputSelected: (y) => {
+        i.value = y, s(y), f();
+      }
+    };
+  }
+}), ql = { class: "b-date-filter" };
+function Yl(e, n, t, i, l, o) {
+  var d, S;
+  const u = G("bento-date-picker"), a = G("bento-divider"), r = G("calendar"), f = G("bento-base-filter");
+  return F(), R(f, {
+    "button-label": e.buttonLabel,
+    "button-secondary-label": e.buttonSecondaryLabel,
+    disabled: e.disabled,
+    "default-value": e.defaultValue,
+    "disable-apply-button": e.isApplyButtonDisabled,
+    "disable-secondary-button": e.isSecondaryButtonDisabled,
+    field: e.field,
+    label: e.label,
+    "only-slot": e.onlySlot,
+    "tooltip-position": (d = e.options) == null ? void 0 : d.tooltipPosition,
+    "tooltip-text": (S = e.options) == null ? void 0 : S.tooltipText,
+    "fit-content": "",
+    onApply: e.updateFilter,
+    onClear: e.clearFilter,
+    onOpen: e.openFilter,
+    onReset: e.resetFilter
+  }, {
+    default: D(() => {
+      var O, s, m, y, I, E;
+      return [
+        e.onlySlot ? (F(), R(u, {
+          key: 0,
+          value: e.internalFilterValue,
+          "first-day-of-week": (O = e.options) == null ? void 0 : O.firstDayOfWeek,
+          "is-date-disabled": (s = e.options) == null ? void 0 : s.isDateDisabled,
+          variant: (m = e.options) == null ? void 0 : m.variant,
+          disabled: e.disabled,
+          onInput: e.onDateInputSelected
+        }, null, 8, ["value", "first-day-of-week", "is-date-disabled", "variant", "disabled", "onInput"])) : (F(), W(Ue, { key: 1 }, [
+          L(a, { class: "b-date-filter__divider" }),
+          Y("div", ql, [
+            L(r, {
+              "first-day-of-week": (y = e.options) == null ? void 0 : y.firstDayOfWeek,
+              "is-date-disabled": (I = e.options) == null ? void 0 : I.isDateDisabled,
+              "number-of-months": 1,
+              value: e.internalFilterValue,
+              variant: (E = e.options) == null ? void 0 : E.variant,
+              onInput: e.onDateSelected
+            }, null, 8, ["first-day-of-week", "is-date-disabled", "value", "variant", "onInput"])
+          ])
+        ], 64))
+      ];
+    }),
+    _: 1
+  }, 8, ["button-label", "button-secondary-label", "disabled", "default-value", "disable-apply-button", "disable-secondary-button", "field", "label", "only-slot", "tooltip-position", "tooltip-text", "onApply", "onClear", "onOpen", "onReset"]);
+}
+const Ut = /* @__PURE__ */ le(Jl, [["render", Yl], ["__scopeId", "data-v-b572be46"]]), rt = {
+  "en-US": {
+    apply: "Apply",
+    clear: "Clear",
+    reset: "Reset"
+  },
+  "ja-JP": {
+    apply: "適用",
+    clear: "クリア",
+    reset: "リセット"
+  },
+  "pt-BR": {
+    apply: "Aplicar",
+    clear: "Limpar",
+    reset: "Reiniciar"
+  }
+}, zl = Q({
+  i18n: { messages: rt },
+  name: "bento-date-range-filter",
+  components: {
+    BentoBaseFilter: Se,
+    BentoButtonActions: rl,
+    BentoDateRangePicker: Sl,
+    BentoTypography: me,
+    BentoDivider: Qe,
+    DateRangePickerCalendar: Fl
+  },
+  props: {
+    /**
+     * Disables the filter from being interacted with.
+     */
+    disabled: { type: Boolean, default: !1 },
+    /**
+     * Default value of the filter to reset to.
+     */
+    defaultValue: { type: Object, default: null },
+    /**
+     * Filter name/key referencing the actual property name in the data set.
+     * Should be unique per filter bar.
+     */
+    field: { type: String, required: !0 },
+    /**
+     * Label text to be displayed
+     */
+    label: { type: String, required: !0 },
+    /**
+     * Renders the base filter's slot content only - leaving out the button and the popover.
+     * Used for the allFiltersModal component.
+     */
+    onlySlot: { type: Boolean, default: !1 },
+    /**
+     * List of options that are needed to setup the filter
+     * Available options:
+     *   - allowTimeInput: Allows user to enter time values in the form
+     *   - firstDayOfWeek: Allows user to set the first day of the week. 0 is sunday, 1 is monday, 6 is saturday
+     *   - isDateDisabled: Indicate if a date should be disabled or not
+     *   - maxRange: Set a maximum number of dates to be selectable by the range
+     *   - numberOfMonths: Number of months rendered on pane
+     *   - quickSelectRanges: An array that sets the custom range dropdown items. @see BentoDateRangePicker
+     *   - showEndDateOnOpen: Upon opening date range picker, end date's month will be pre-selected.
+     *   - granularities: A list of available granularities.
+     *   - variant: The type of calendar to display. Defaults to showing days.
+     *   - tooltipPosition: The position of the tooltip attached to the filter button
+     *   - tooltipText: The content of the tooltip attached to the filter button
+     */
+    options: {
+      type: Object,
+      default: void 0
+    },
+    /**
+     * Current value of the filter
+     */
+    value: {
+      type: Object,
+      default: () => ({ startDate: void 0, endDate: void 0 })
+    }
+  },
+  emits: [$.INPUT, $.UPDATE],
+  setup(e, { emit: n }) {
+    var h, b, w, K;
+    const { locale: t, t: i } = ve({ messages: rt }), l = Bl(), { internalFilterValue: o, isSecondaryButtonDisabled: u, isApplyButtonDisabled: a } = Ce(
+      ee(e, "value"),
+      ee(e, "defaultValue")
+    ), r = j(!1), f = c(() => {
+      var p;
+      return ((p = e == null ? void 0 : e.options) == null ? void 0 : p.quickSelectRanges) && e.options.quickSelectRanges.map((V) => {
+        const q = V.data.endDate ? void 0 : new Date(Date.now()).getTime() - V.data.startDate.getTime();
+        return {
+          ...V,
+          data: {
+            ...V.data,
+            // Adding timeDifference to calculate an up-to-date endDate on range selection
+            timeDifference: q
+          }
+        };
+      });
+    }), d = (p) => {
+      var V;
+      return p ? _e(p, tt.NUMERIC_DATE_YEAR_FIRST, {
+        locale: l[(V = t.value) == null ? void 0 : V.substring(0, 2)] || l.enUS
+      }) : void 0;
+    }, S = (p) => {
+      var V;
+      return p ? _e(p, tt.HOUR_MINUTE_SECONDS, {
+        locale: l[(V = t.value) == null ? void 0 : V.substring(0, 2)] || l.enUS
+      }) : "";
+    }, O = j(null), s = j(!1), m = Zt({
+      startDate: d((h = e.value) == null ? void 0 : h.startDate),
+      endDate: d((b = e.value) == null ? void 0 : b.endDate),
+      startTime: S((w = e.value) == null ? void 0 : w.startDate),
+      endTime: S((K = e.value) == null ? void 0 : K.endDate)
+    });
+    ie(
+      () => e.value,
+      () => {
+        var p, V, q, C;
+        m.startDate = d((p = e.value) == null ? void 0 : p.startDate), m.endDate = d((V = e.value) == null ? void 0 : V.endDate), m.startTime = S((q = e.value) == null ? void 0 : q.startDate), m.endTime = S((C = e.value) == null ? void 0 : C.endDate);
+      }
+    );
+    function y(p) {
+      return (p == null ? void 0 : p.length) !== void 0;
+    }
+    const I = (p) => {
+      var V, q, C, g, k, te, re, ce, pe, be;
+      if (!p || !(p != null && p.startDate) && !p.endDate)
+        return null;
+      if (y((V = e.options) == null ? void 0 : V.quickSelectRanges) && ((C = (q = e.options) == null ? void 0 : q.quickSelectRanges) == null ? void 0 : C.length) > 0) {
+        const fe = (k = (g = e.options) == null ? void 0 : g.quickSelectRanges) == null ? void 0 : k.find(({ value: he, data: oe }) => p ? p.range ? he === p.range : !p.startDate || !p.endDate ? !1 : oe != null && oe.endDate ? Je(oe == null ? void 0 : oe.startDate, p.startDate) && Je(oe == null ? void 0 : oe.endDate, p.endDate) : Je(oe == null ? void 0 : oe.startDate, p.startDate) && Cl(p.endDate) : !1);
+        if (fe)
+          return fe.label;
+      }
+      return !p.startDate || !p.endDate ? null : Tl(p.startDate, p.endDate) && ((te = e == null ? void 0 : e.options) != null && te.allowTimeInput) ? `${_e(p.startDate, "dd MMM, yyyy HH:mm:ss", {
+        locale: l[(re = t.value) == null ? void 0 : re.substring(0, 2)] || l.enUS
+      })} - ${_e(p.endDate, "HH:mm:ss", {
+        locale: l[(ce = t.value) == null ? void 0 : ce.substring(0, 2)] || l.enUS
+      })}` : `${_e(p.startDate, "dd MMM, yyyy", {
+        locale: l[(pe = t.value) == null ? void 0 : pe.substring(0, 2)] || l.enUS
+      })} - ${_e(p.endDate, "dd MMM, yyyy", {
+        locale: l[(be = t.value) == null ? void 0 : be.substring(0, 2)] || l.enUS
+      })}`;
+    }, E = j(I(e.value)), P = c(() => e.label), _ = () => {
+      O.value.closePopover();
+      const { onlySlot: p, ...V } = e;
+      n($.UPDATE, { ...V, value: o.value });
+    }, M = () => {
+      o.value = void 0, _();
+    }, B = () => {
+      o.value = e.defaultValue, _();
+    }, N = () => {
+      o.value = e.value;
+    }, H = () => {
+      var p, V, q, C;
+      o.value = e.value, r.value = !1, m.startDate = d((p = e.value) == null ? void 0 : p.startDate), m.endDate = d((V = e.value) == null ? void 0 : V.endDate), m.startTime = S((q = e.value) == null ? void 0 : q.startDate), m.endTime = S((C = e.value) == null ? void 0 : C.endDate);
+    }, U = (p) => {
+      r.value = !1, o.value = p, m.startDate = d(p.startDate), m.endDate = d(p.endDate), n($.INPUT, { ...e, value: o.value });
+    }, A = (p) => {
+      p != null && p.startDate && (p != null && p.endDate) && (o.value = p, m.startDate = d(p.startDate), m.endDate = d(p.endDate), n($.INPUT, { ...e, value: o.value }));
+    }, J = (p) => {
+      U(p), n($.INPUT, { ...e, value: o.value });
+    }, z = c(
+      () => [
+        {
+          title: i("apply"),
+          event: _,
+          disabled: r.value || s.value || a.value
+        },
+        {
+          title: e.defaultValue ? i("reset") : i("clear"),
+          event: e.defaultValue ? B : M,
+          disabled: s.value && u.value
+        }
+      ]
+    ), ae = () => {
+      s.value = !0, o.value = { startDate: void 0, endDate: void 0 }, n($.INPUT, { ...e, value: o.value });
+    }, T = (p) => {
+      s.value = !1, p.startTime && (m.startTime = p.startTime), p.endTime && (m.endTime = p.endTime);
+    };
+    return ie(
+      () => e.value,
+      (p) => {
+        E.value = I(p);
+      },
+      { deep: !0 }
+    ), {
+      // Refs
+      baseFilter: O,
+      // Values
+      actions: z,
+      formData: m,
+      internalFilterValue: o,
+      isApplyButtonDisabled: a,
+      isSecondaryButtonDisabled: u,
+      isSelectingDate: r,
+      buttonLabel: P,
+      buttonSecondaryLabel: E,
+      adjustedQuickSelectRanges: f,
+      // Events
+      onCancel: H,
+      onDateSelected: U,
+      openFilter: N,
+      clearFilter: M,
+      resetFilter: B,
+      updateFilter: _,
+      onDatePickerRangeError: ae,
+      onDatePickerRangeFormDateInputUpdate: T,
+      onDateInputSelected: J,
+      onRangeSelectorInput: A
+    };
+  }
+}), Wl = {
+  key: 1,
+  class: "b-date-range-filter"
+};
+function Zl(e, n, t, i, l, o) {
+  var O, s;
+  const u = G("bento-date-range-picker"), a = G("bento-typography"), r = G("bento-divider"), f = G("bento-button-actions"), d = G("date-range-picker-calendar"), S = G("bento-base-filter");
+  return F(), R(S, {
+    ref: "baseFilter",
+    class: "b-base-filter-date-range-filter",
+    "button-label": e.buttonLabel,
+    "button-secondary-label": e.buttonSecondaryLabel,
+    controlled: !e.onlySlot,
+    disabled: e.disabled,
+    "disable-apply-button": e.isApplyButtonDisabled,
+    "disable-secondary-button": e.isSecondaryButtonDisabled,
+    "default-value": e.defaultValue,
+    field: e.field,
+    label: e.label,
+    "only-slot": e.onlySlot,
+    "tooltip-position": (O = e.options) == null ? void 0 : O.tooltipPosition,
+    "tooltip-text": (s = e.options) == null ? void 0 : s.tooltipText,
+    "fit-content": "",
+    onOpen: e.openFilter,
+    onClear: e.clearFilter,
+    onReset: e.resetFilter,
+    onCancel: e.onCancel
+  }, {
+    default: D(() => {
+      var m, y, I, E, P, _, M, B, N, H, U, A, J, z, ae, T, h, b, w, K, p;
+      return [
+        e.onlySlot ? (F(), R(u, {
+          key: 0,
+          "allow-time-input": (m = e.options) == null ? void 0 : m.allowTimeInput,
+          "model-value": e.internalFilterValue,
+          "first-day-of-week": (y = e.options) == null ? void 0 : y.firstDayOfWeek,
+          "is-date-disabled": (I = e.options) == null ? void 0 : I.isDateDisabled,
+          "number-of-months": (E = e.options) == null ? void 0 : E.numberOfMonths,
+          "quick-select-ranges": (P = e.options) == null ? void 0 : P.quickSelectRanges,
+          variant: (_ = e.options) == null ? void 0 : _.variant,
+          disabled: e.disabled,
+          granularities: (M = e.options) == null ? void 0 : M.granularities,
+          "max-range": (B = e.options) == null ? void 0 : B.maxRange,
+          min: (N = e.options) == null ? void 0 : N.min,
+          max: (H = e.options) == null ? void 0 : H.max,
+          "date-form-data": e.formData,
+          "show-end-date-on-open": (U = e.options) == null ? void 0 : U.showEndDateOnOpen,
+          "onUpdate:modelValue": e.onDateInputSelected
+        }, null, 8, ["allow-time-input", "model-value", "first-day-of-week", "is-date-disabled", "number-of-months", "quick-select-ranges", "variant", "disabled", "granularities", "max-range", "min", "max", "date-form-data", "show-end-date-on-open", "onUpdate:modelValue"])) : (F(), W("div", Wl, [
+          L(d, {
+            "allow-time-input": (A = e.options) == null ? void 0 : A.allowTimeInput,
+            "first-day-of-week": (J = e.options) == null ? void 0 : J.firstDayOfWeek,
+            "is-date-disabled": (z = e.options) == null ? void 0 : z.isDateDisabled,
+            granularities: (ae = e.options) == null ? void 0 : ae.granularities,
+            "max-range": (T = e.options) == null ? void 0 : T.maxRange,
+            min: (h = e.options) == null ? void 0 : h.min,
+            max: (b = e.options) == null ? void 0 : b.max,
+            "number-of-months": (w = e.options) == null ? void 0 : w.numberOfMonths,
+            "quick-select-ranges": e.adjustedQuickSelectRanges,
+            value: e.internalFilterValue,
+            "date-form-data": e.formData,
+            "show-end-date-on-open": (K = e.options) == null ? void 0 : K.showEndDateOnOpen,
+            variant: (p = e.options) == null ? void 0 : p.variant,
+            onInput: e.onDateSelected,
+            onCustomRange: e.onRangeSelectorInput,
+            onError: e.onDatePickerRangeError,
+            onFormDate: e.onDatePickerRangeFormDateInputUpdate,
+            onStartDateSelected: n[0] || (n[0] = (V) => e.isSelectingDate = !0)
+          }, {
+            title: D(() => [
+              L(a, {
+                strongest: "",
+                variant: "body",
+                el: "span"
+              }, {
+                default: D(() => [
+                  X(x(e.label), 1)
+                ]),
+                _: 1
+              })
+            ]),
+            actions: D(() => [
+              L(r, { class: "b-date-range-filter__divider" }),
+              L(f, {
+                class: "b-date-range-filter__actions",
+                actions: e.actions,
+                layout: "space-between"
+              }, null, 8, ["actions"])
+            ]),
+            _: 1
+          }, 8, ["allow-time-input", "first-day-of-week", "is-date-disabled", "granularities", "max-range", "min", "max", "number-of-months", "quick-select-ranges", "value", "date-form-data", "show-end-date-on-open", "variant", "onInput", "onCustomRange", "onError", "onFormDate"])
+        ]))
+      ];
+    }),
+    _: 1
+  }, 8, ["button-label", "button-secondary-label", "controlled", "disabled", "disable-apply-button", "disable-secondary-button", "default-value", "field", "label", "only-slot", "tooltip-position", "tooltip-text", "onOpen", "onClear", "onReset", "onCancel"]);
+}
+const Et = /* @__PURE__ */ le(zl, [["render", Zl], ["__scopeId", "data-v-e3901321"]]), Ql = {
+  name: "bento-radio-group-filter"
+}, Xl = /* @__PURE__ */ Q({
+  ...Ql,
+  props: {
+    disabled: { type: Boolean },
+    defaultValue: { default: void 0 },
+    field: {},
+    label: {},
+    options: { default: () => ({
+      items: []
+    }) },
+    onlySlot: { type: Boolean },
+    value: { default: void 0 }
+  },
+  emits: ["input", "update"],
+  setup(e, { emit: n }) {
+    const t = e, i = n, {
+      // Fields
+      internalFilterValue: l,
+      isSecondaryButtonDisabled: o,
+      isApplyButtonDisabled: u,
+      // Methods
+      clearFilter: a,
+      openFilter: r,
+      resetFilter: f
+    } = It(ee(t, "value"), ee(t, "defaultValue")), d = c(() => {
+      var y;
+      const m = ((y = t.options.items.find((I) => I.value === t.value)) == null ? void 0 : y.label) || "";
+      return Fe(m, 12);
+    }), S = c(() => ({
+      "b-radio-group-filter--only-slot": t.onlySlot
+    }));
+    function O(m) {
+      l.value = m, i("input", { ...t, value: l.value });
+    }
+    function s() {
+      i("update", { ...t, value: l.value });
+    }
+    return (m, y) => (F(), R(v(Se), se(m.$props, {
+      "button-label": m.label,
+      "button-secondary-label": d.value,
+      "disable-apply-button": v(u),
+      "disable-secondary-button": v(o),
+      "only-slot": m.onlySlot,
+      onApply: s,
+      onClear: y[1] || (y[1] = (I) => v(a)(s)),
+      onOpen: v(r),
+      onReset: y[2] || (y[2] = (I) => v(f)(s))
+    }), {
+      default: D(() => {
+        var I;
+        return [
+          Y("div", {
+            class: de(["b-radio-group-filter", S.value])
+          }, [
+            L(v(mt), {
+              modelValue: v(l),
+              "onUpdate:modelValue": [
+                y[0] || (y[0] = (E) => Qt(l) ? l.value = E : null),
+                O
+              ],
+              items: (I = m.options) == null ? void 0 : I.items,
+              label: m.label,
+              disabled: m.disabled,
+              "hide-label": "",
+              variant: "vertical"
+            }, null, 8, ["modelValue", "items", "label", "disabled"])
+          ], 2)
+        ];
+      }),
+      _: 1
+    }, 16, ["button-label", "button-secondary-label", "disable-apply-button", "disable-secondary-button", "only-slot", "onOpen"]));
+  }
+}), Lt = /* @__PURE__ */ le(Xl, [["__scopeId", "data-v-b1a70e21"]]), Rt = {
+  "en-US": {
+    all: "All",
+    noFiltersMatchThisSearch: "No filters match this search",
+    searchFilter: "Search {filter}"
+  },
+  "ja-JP": {
+    all: "すべて",
+    noFiltersMatchThisSearch: "この検索に一致するフィルターはありません",
+    searchFilter: "{filter}を検索"
+  },
+  "pt-BR": {
+    all: "Todos",
+    noFiltersMatchThisSearch: "Nenhum filtro corresponde a esta busca",
+    searchFilter: "Procurar {filter}"
+  }
+}, xl = { class: "b-select-filter-button__search-bar-wrapper" }, ea = {
+  key: 0,
+  class: "b-select-filter-button__search-bar"
+}, ta = { class: "b-select-filter-button__divider" }, la = {
+  i18n: { messages: Rt }
+}, aa = /* @__PURE__ */ Q({
+  ...la,
+  __name: "select-filter-button",
+  props: {
+    /**
+     * Disables the filter from being interacted with.
+     */
+    disabled: { type: Boolean, default: !1 },
+    /**
+     * Default value of the filter to reset to.
+     *
+     */
+    defaultValue: {
+      type: [String, Number, Array],
+      default: null
+    },
+    /**
+     * Filter name/key referencing the actual property name in the data set.
+     * Should be unique per filter bar.
+     */
+    field: { type: String, required: !0 },
+    /**
+     * Label text to be displayed
+     */
+    label: { type: String, required: !0 },
+    /**
+     * Renders the base filter's slot content only - leaving out the button and the popover.
+     * Used for the allFiltersModal component.
+     */
+    onlySlot: { type: Boolean, default: !1 },
+    /**
+     * List of options that are needed to setup the filter
+     * Available options:
+     *   - multiple: If "true", the user will be able to select multiple items.
+     *   - listboxItems: The option elements to populate the filter with.
+     *
+     * @default undefined
+     */
+    options: {
+      type: Object,
+      default: void 0
+    },
+    /**
+     * Current value of the filter
+     *
+     * @default undefined
+     */
+    value: {
+      type: [String, Number, Array, Object],
+      default: void 0
+    }
+  },
+  emits: ["input", "update"],
+  setup(e, { emit: n }) {
+    var ae, T;
+    const t = Me(), i = n, l = e, { t: o } = ve({ messages: Rt }), u = j(""), a = ee(l, "options"), r = j(l.options.listboxItems ?? []), { cachedSelectedListboxOptions: f, setCachedValues: d, resetCache: S } = et(
+      r,
+      ee(l, "value"),
+      ee(a.value, "multiple")
+    ), { cachedSelectedListboxOptions: O } = et(
+      r,
+      ee(l, "defaultValue"),
+      ee(a.value, "multiple")
+    ), { internalFilterValue: s, isSecondaryButtonDisabled: m, isApplyButtonDisabled: y } = Ce(f, O);
+    ie(a, () => {
+      r.value = a.value.listboxItems ?? [];
+    });
+    const I = Ze(
+      u,
+      r,
+      (T = (ae = l.options) == null ? void 0 : ae.search) == null ? void 0 : T.searchEvent
+    ), E = c(() => o("noFiltersMatchThisSearch")), P = c(() => l.label), _ = c(() => {
+      var w, K, p, V, q;
+      const h = !((w = l == null ? void 0 : l.options) != null && w.multiple) && l.value != null, b = ((K = l == null ? void 0 : l.options) == null ? void 0 : K.multiple) && Array.isArray(l.value) && l.value.length === 1;
+      if (h || b) {
+        if ((p = l.options) != null && p.enableValueLabelPair) {
+          let k = ((V = l.value) == null ? void 0 : V.length) > 0 ? l.value[0].label : l.value.label;
+          return k || (k = l.value, al(
+            'BentoFilterBar Select filter (single & multi): The "value" provided is incorrect. The "value" must be of type "BentoListboxSelectedValueLabelPair" or "Array<BentoListboxSelectedValueLabelPair>" when "enableValueLabelPair" is set to true'
+          )), Fe(k, 12);
+        }
+        let g = (q = l.options.listboxItems.flatMap((k) => k.items ? k.items : k).find(
+          ({ value: k }) => {
+            var te;
+            return Array.isArray(l.value) ? (te = l == null ? void 0 : l.value) == null ? void 0 : te.includes(k) : k === l.value;
+          }
+        )) == null ? void 0 : q.label;
+        return !g && l.value && (g = l.value[0]), Fe(g, 12);
+      }
+      return null;
+    }), M = c(() => Le(`filter-listbox-${l.field}`)), B = (h) => {
+      var p, V, q;
+      s.value = h;
+      const { onlySlot: b, ...w } = l;
+      if ((p = l.options) != null && p.multiple) {
+        let C;
+        (V = l.options) != null && V.enableValueLabelPair ? C = h.length ? s.value : null : C = h.length ? s.value.map(({ value: g }) => g) : null, i($.INPUT, { ...w, value: C });
+        return;
+      }
+      let K;
+      (q = l.options) != null && q.enableValueLabelPair ? K = h.length ? h[0] : null : K = h.length ? h[0].value : null, i($.INPUT, { ...w, value: K });
+    }, N = () => {
+      var K, p, V, q, C, g;
+      const { onlySlot: h, ...b } = l;
+      if (l.options.multiple) {
+        s.value && ((K = s.value) == null ? void 0 : K.length) === 0 && (s.value = l.defaultValue !== null ? O.value : void 0);
+        let k;
+        (p = l.options) != null && p.enableValueLabelPair ? k = (V = s.value) != null && V.length ? s.value : null : k = (q = s.value) != null && q.length ? (C = s.value) == null ? void 0 : C.map(({ value: te }) => te) : null, i($.UPDATE, {
+          ...b,
+          value: k
+        });
+        return;
+      }
+      let w;
+      (g = l.options) != null && g.enableValueLabelPair ? w = s.value.length ? s.value[0] : void 0 : w = s.value.length ? s.value[0].value : void 0, i($.UPDATE, { ...b, value: w });
+    }, H = () => {
+      var h, b;
+      s.value = f.value, (b = (h = l.options) == null ? void 0 : h.onOpen) == null || b.call(h);
+    }, U = () => {
+      u.value && (u.value = "");
+    }, A = () => {
+      d(O.value), s.value = O.value, N();
+    }, J = () => {
+      S(), s.value = [], N();
+    }, z = c(() => {
+      var w, K;
+      if (l.value == null || !l.options.multiple)
+        return null;
+      const h = (w = l.options.listboxItems) == null ? void 0 : w.reduce((p, V) => {
+        var q;
+        return p += (q = V == null ? void 0 : V.items) != null && q.length ? V.items.length : 1, p;
+      }, 0), b = (K = l.value) == null ? void 0 : K.length;
+      return b === 1 ? null : b === h ? o("all") : b;
+    });
+    return (h, b) => {
+      var w, K;
+      return F(), R(v(Se), {
+        "applied-filters-count": z.value,
+        "button-label": P.value,
+        "button-secondary-label": _.value,
+        disabled: e.disabled,
+        "disable-apply-button": v(y),
+        "disable-secondary-button": v(m),
+        "default-value": e.defaultValue,
+        label: e.label,
+        field: e.field,
+        "only-slot": !1,
+        "tooltip-position": (w = e.options) == null ? void 0 : w.tooltipPosition,
+        "tooltip-text": (K = e.options) == null ? void 0 : K.tooltipText,
+        value: e.value,
+        onApply: N,
+        onClear: J,
+        onReset: A,
+        onOpen: H,
+        onClose: U
+      }, {
+        default: D(() => {
+          var p, V, q, C, g, k, te, re, ce, pe, be, fe, he, oe, Xe;
+          return [
+            Y("div", xl, [
+              ((p = e.options) == null ? void 0 : p.dynamicFiltering) ?? !0 ? (F(), W("div", ea, [
+                L(Ne, {
+                  "debounce-time": (q = (V = e.options) == null ? void 0 : V.search) == null ? void 0 : q.debounceTime,
+                  value: u.value,
+                  "input-field-aria-label": v(o)("searchFilter", { filter: e.label.toLocaleLowerCase() }),
+                  onInput: b[0] || (b[0] = (Ke) => u.value = Ke)
+                }, null, 8, ["debounce-time", "value", "input-field-aria-label"])
+              ])) : Z("", !0),
+              Y("div", ta, [
+                L(v(Qe))
+              ])
+            ]),
+            L(v(vl), {
+              id: M.value,
+              "aria-label": e.label,
+              class: "b-select-filter-button__wrapper",
+              "component-loading": (C = e.options) == null ? void 0 : C.loading,
+              "empty-state": (g = e.options) == null ? void 0 : g.emptyState,
+              "has-more-items": (te = (k = e.options) == null ? void 0 : k.lazy) == null ? void 0 : te.hasMoreItems,
+              items: v(I),
+              "is-option-disabled": (re = e.options) == null ? void 0 : re.isOptionDisabled,
+              "lazy-load-type": (pe = (ce = e.options) == null ? void 0 : ce.lazy) == null ? void 0 : pe.lazyLoadType,
+              loading: (fe = (be = e.options) == null ? void 0 : be.lazy) == null ? void 0 : fe.loading,
+              multiple: (he = e.options) == null ? void 0 : he.multiple,
+              "static-categories": (oe = e.options) == null ? void 0 : oe.staticCategories,
+              "no-results-message": E.value,
+              searching: !!u.value,
+              "selected-value": v(s),
+              "virtual-scroll": (Xe = e.options) == null ? void 0 : Xe.virtualScroll,
+              onSelect: B,
+              onSpacePressed: B,
+              onEnterPressed: B,
+              onShowMore: b[1] || (b[1] = (Ke) => {
+                var Pe, Re;
+                return (Re = (Pe = e.options) == null ? void 0 : Pe.lazy) == null ? void 0 : Re.showMoreEvent();
+              })
+            }, Ee({ _: 2 }, [
+              Be(v(t), (Ke, Pe) => ({
+                name: Pe,
+                fn: D((Re) => [
+                  ye(h.$slots, Pe, Ve(we(Re)), void 0, !0)
+                ])
+              }))
+            ]), 1032, ["id", "aria-label", "component-loading", "empty-state", "has-more-items", "items", "is-option-disabled", "lazy-load-type", "loading", "multiple", "static-categories", "no-results-message", "searching", "selected-value", "virtual-scroll"])
+          ];
+        }),
+        _: 3
+      }, 8, ["applied-filters-count", "button-label", "button-secondary-label", "disabled", "disable-apply-button", "disable-secondary-button", "default-value", "label", "field", "tooltip-position", "tooltip-text", "value"]);
+    };
+  }
+}), oa = /* @__PURE__ */ le(aa, [["__scopeId", "data-v-a5f40d81"]]), kt = {
+  "en-US": {
+    noFiltersMatchThisSearch: "No filters match this search"
+  },
+  "ja-JP": {
+    noFiltersMatchThisSearch: "この検索に一致するフィルターはありません"
+  },
+  "pt-BR": {
+    noFiltersMatchThisSearch: "Nenhum filtro corresponde a esta pesquisa"
+  }
+}, na = {
+  i18n: { messages: kt },
+  name: "select-filter-dropdown"
+}, ia = /* @__PURE__ */ Q({
+  ...na,
+  props: {
+    /**
+     * Disables the filter from being interacted with.
+     */
+    disabled: { type: Boolean, default: !1 },
+    /**
+     * Default value of the filter to reset to.
+     *
+     */
+    defaultValue: {
+      type: [String, Number, Array],
+      default: null
+    },
+    /**
+     * Filter name/key referencing the actual property name in the data set.
+     * Should be unique per filter bar.
+     */
+    field: { type: String, required: !0 },
+    /**
+     * Label text to be displayed
+     */
+    label: { type: String, required: !0 },
+    /**
+     * Renders the base filter's slot content only - leaving out the button and the popover.
+     * Used for the allFiltersModal component.
+     *
+     */
+    onlySlot: { type: Boolean, default: !1 },
+    /**
+     * List of options that are needed to setup the filter
+     * Available options:
+     *   - multiple: If "true", the user will be able to select multiple items.
+     *   - listboxItems: The option elements to populate the filter with.
+     *
+     * @default undefined
+     */
+    options: {
+      type: Object,
+      default: void 0
+    },
+    /**
+     * Current value of the filter
+     *
+     * @default undefined
+     */
+    value: {
+      type: [String, Number, Array],
+      default: void 0
+    }
+  },
+  emits: ["input", "update"],
+  setup(e, { emit: n }) {
+    const { t } = ve({ messages: kt }), i = Me(), l = n, o = e, { internalFilterValue: u } = Ce(ee(o, "value"), ee(o, "defaultValue")), a = ee(o, "options"), r = j(o.options.listboxItems);
+    ie(a, () => {
+      r.value = a.value.listboxItems;
+    });
+    const f = c(() => t("noFiltersMatchThisSearch")), d = (S) => {
+      u.value = S;
+      const { onlySlot: O, ...s } = o;
+      l($.INPUT, { ...s, value: u.value });
+    };
+    return (S, O) => {
+      var s, m, y, I, E, P, _;
+      return F(), R(v(dl), {
+        "model-value": v(u),
+        items: e.options.listboxItems,
+        search: (s = e.options) == null ? void 0 : s.search,
+        multiple: (m = e.options) == null ? void 0 : m.multiple,
+        "static-categories": (y = e.options) == null ? void 0 : y.staticCategories,
+        "no-results-message": f.value,
+        "is-option-disabled": e.options.isOptionDisabled,
+        "dynamic-filtering": ((I = e.options) == null ? void 0 : I.dynamicFiltering) ?? !0,
+        "component-loading": (E = e.options) == null ? void 0 : E.loading,
+        "empty-state": (P = e.options) == null ? void 0 : P.emptyState,
+        disabled: e.disabled,
+        "enable-value-label-pair": (_ = e.options) == null ? void 0 : _.enableValueLabelPair,
+        "onUpdate:modelValue": d,
+        onOpen: O[0] || (O[0] = () => {
+          var M, B;
+          return (B = (M = e.options) == null ? void 0 : M.onOpen) == null ? void 0 : B.call(M);
+        })
+      }, Ee({ _: 2 }, [
+        Be(v(i), (M, B) => ({
+          name: B,
+          fn: D((N) => [
+            ye(S.$slots, B, Ve(we(N)))
+          ])
+        }))
+      ]), 1032, ["model-value", "items", "search", "multiple", "static-categories", "no-results-message", "is-option-disabled", "dynamic-filtering", "component-loading", "empty-state", "disabled", "enable-value-label-pair"]);
+    };
+  }
+}), Oe = {
+  /**
+   * Disables the filter from being interacted with.
+   */
+  disabled: { type: Boolean, default: !1 },
+  /**
+   * Default value of the filter to reset to.
+   *
+   */
+  defaultValue: {
+    type: [String, Number, Array, Object],
+    default: null
+  },
+  /**
+   * Filter name/key referencing the actual property name in the data set.
+   * Should be unique per filter bar.
+   */
+  field: { type: String, required: !0 },
+  /**
+   * Label text to be displayed
+   */
+  label: { type: String, required: !0 },
+  /**
+   * Renders the base filter's slot content only - leaving out the button and the popover.
+   * Used for the allFiltersModal component.
+   *
+   */
+  onlySlot: { type: Boolean, default: !1 },
+  /**
+   * List of options that are needed to setup the filter
+   * Available options:
+   *   - multiple: If "true", the user will be able to select multiple items.
+   *   - listboxItems: The option elements to populate the filter with.
+   *   - tooltipPosition: The position of the tooltip attached to the filter button
+   *   - tooltipText: The content of the tooltip attached to the filter button
+   *
+   * @default undefined
+   */
+  options: {
+    type: Object,
+    default: void 0
+  },
+  /**
+   * Current value of the filter
+   *
+   * @default undefined
+   */
+  value: {
+    type: [String, Number, Array, Object],
+    default: void 0
+  }
+}, sa = {}, Te = /* @__PURE__ */ Q({
+  ...sa,
+  __name: "select-filter",
+  props: Oe,
+  emits: ["input", "update"],
+  setup(e, { emit: n }) {
+    const t = Me(), i = n, l = e, o = (a) => i("input", a), u = (a) => i("update", a);
+    return je(() => {
+      var a;
+      (a = l == null ? void 0 : l.options) != null && a.messages && Ge(
+        'BentoFilterBar filter of type "BentoFilterItemType.SELECT" options message property',
+        `Please remove the "options.messages" property from this filter, it is not required any more for persistent filters.
+                        This will be the default behavior in the v2 and "options.messages" will be removed.`,
+        "2.0.0"
+      );
+    }), (a, r) => a.onlySlot ? (F(), R(v(ia), {
+      key: 0,
+      disabled: a.disabled,
+      "default-value": a.defaultValue,
+      field: a.field,
+      label: a.label,
+      options: a.options,
+      value: a.value,
+      onInput: o,
+      onUpdate: u
+    }, Ee({ _: 2 }, [
+      Be(v(t), (f, d) => ({
+        name: d,
+        fn: D((S) => [
+          ye(a.$slots, d, Ve(we(S)))
+        ])
+      }))
+    ]), 1032, ["disabled", "default-value", "field", "label", "options", "value"])) : (F(), R(v(oa), {
+      key: 1,
+      disabled: a.disabled,
+      "default-value": a.defaultValue,
+      field: a.field,
+      label: a.label,
+      options: a.options,
+      value: a.value,
+      onInput: o,
+      onUpdate: u
+    }, Ee({ _: 2 }, [
+      Be(v(t), (f, d) => ({
+        name: d,
+        fn: D((S) => [
+          ye(a.$slots, d, Ve(we(S)))
+        ])
+      }))
+    ]), 1032, ["disabled", "default-value", "field", "label", "options", "value"]));
+  }
+}), ra = Q({
+  name: "bento-select-avatar-filter",
+  components: {
+    BentoSelectFilter: Te,
+    BentoAvatar: gl
+  },
+  props: {
+    ...Oe,
+    /**
+     * List of options that are needed to setup the country filter
+     * Available options:
+     *   - multiple: If "true", the user will be able to select multiple items.
+     *   - listboxItems: The option elements to populate the filter with {@see BentoSelectCountryFilterOptions}
+     */
+    options: {
+      type: Object,
+      default: void 0
+    }
+  },
+  emits: [$.INPUT, $.UPDATE],
+  setup(e, { emit: n }) {
+    return {
+      // Enums
+      BentoFilterEvent: $,
+      // Methods
+      onUpdate: (i) => n($.UPDATE, i)
+    };
+  }
+});
+function ua(e, n, t, i, l, o) {
+  const u = G("bento-avatar"), a = G("bento-select-filter");
+  return F(), R(a, se(e.$props, {
+    field: e.field,
+    label: e.label,
+    onUpdate: e.onUpdate,
+    onInput: n[0] || (n[0] = (r) => e.$emit(e.BentoFilterEvent.INPUT, r))
+  }), {
+    default: D(({ label: r, data: f }) => [
+      L(u, {
+        username: r,
+        src: f
+      }, null, 8, ["username", "src"])
+    ]),
+    _: 1
+  }, 16, ["field", "label", "onUpdate"]);
+}
+const Vt = /* @__PURE__ */ le(ra, [["render", ua]]), da = Q({
+  name: "bento-select-currency-filter",
+  components: {
+    BentoSelectFilter: Te,
+    ListboxOptionTag: Dt
+  },
+  props: {
+    ...Oe,
+    /**
+     * List of options that are needed to setup the country filter
+     * Available options:
+     *   - multiple: If "true", the user will be able to select multiple items.
+     *   - listboxItems: The option elements to populate the filter with {@see BentoSelectCurrencyFilterOptions}
+     */
+    options: {
+      type: Object,
+      default: void 0
+    }
+  },
+  emits: [$.INPUT, $.UPDATE],
+  setup(e, { emit: n }) {
+    var u;
+    const t = (a) => {
+      n($.UPDATE, a);
+    }, i = j([]);
+    ie(
+      () => {
+        var a;
+        return (a = e.options) == null ? void 0 : a.listboxItems;
+      },
+      (a) => {
+        i.value = a || [];
+      },
+      { immediate: !0 }
+    );
+    const l = (u = e.options) != null && u.search ? e.options.search : {
+      debounceTime: 500,
+      searchEvent: async (a) => {
+        var S, O, s, m;
+        if (!a) {
+          i.value = ((S = e.options) == null ? void 0 : S.listboxItems) || [];
+          return;
+        }
+        const r = (((O = e.options) == null ? void 0 : O.listboxItems) || []).map((y) => ({
+          ...y,
+          label: `${y.value} ${y.label}`
+        })), f = Ze(
+          j(a),
+          j(r),
+          (m = (s = e.options) == null ? void 0 : s.search) == null ? void 0 : m.searchEvent,
+          j(!1)
+        ).value, d = f == null ? void 0 : f.map((y) => ({
+          ...y,
+          label: y.label.substring(y.value.length + 1)
+        }));
+        i.value = d;
+      }
+    }, o = c(() => ({
+      ...e.options,
+      search: l,
+      listboxItems: i.value
+    }));
+    return {
+      // Enums
+      BentoFilterEvent: $,
+      // Methods
+      onUpdate: t,
+      internalOptions: o
+    };
+  }
+});
+function ca(e, n, t, i, l, o) {
+  const u = G("listbox-option-tag"), a = G("bento-select-filter");
+  return F(), R(a, se(e.$props, {
+    field: e.field,
+    label: e.label,
+    options: e.internalOptions,
+    onUpdate: e.onUpdate,
+    onInput: n[0] || (n[0] = (r) => e.$emit(e.BentoFilterEvent.INPUT, r))
+  }), {
+    default: D((r) => [
+      L(u, { option: r }, null, 8, ["option"])
+    ]),
+    _: 1
+  }, 16, ["field", "label", "options", "onUpdate"]);
+}
+const wt = /* @__PURE__ */ le(da, [["render", ca]]), pa = {
+  name: "bento-select-country-filter"
+}, Nt = /* @__PURE__ */ Q({
+  ...pa,
+  props: {
+    ...Oe,
+    /**
+     * List of options that are needed to setup the country filter
+     * Available options:
+     *   - multiple: If "true", the user will be able to select multiple items.
+     *   - listboxItems: The option elements to populate the filter with {@see BentoSelectCountryFilterOptions}
+     *   - variant: Which label variant to display for the option item.
+     */
+    options: {
+      type: Object,
+      default: void 0
+    }
+  },
+  emits: [$.INPUT, $.UPDATE],
+  setup(e, { emit: n }) {
+    const t = e, i = n, l = j(t.options.variant), o = j(t.options.listboxItems);
+    ie([() => t.options.variant, () => t.options.listboxItems], () => {
+      l.value = t.options.variant, o.value = t.options.listboxItems;
+    });
+    const u = (f) => i($.UPDATE, f), a = hl(l, o), r = c(() => ({
+      ...t != null && t.options ? t.options : {},
+      listboxItems: a.value
+    }));
+    return (!l.value || l.value === "custom") && Ge(
+      'BentoSelectCountryFilter type with `options.variant==="custom"`',
+      "Use any of the other BentoSelectCountryFilter variants instead OR use BentoSelectFilter type for custom labels",
+      "2.0.0"
+    ), (f, d) => (F(), R(Te, se(t, {
+      field: f.field,
+      label: f.label,
+      options: r.value,
+      onUpdate: u,
+      onInput: d[0] || (d[0] = (S) => f.$emit(v($).INPUT, S))
+    }), {
+      default: D(({ label: S }) => [
+        L(v(me), { el: "span" }, {
+          default: D(() => [
+            X(x(S), 1)
+          ]),
+          _: 2
+        }, 1024)
+      ]),
+      _: 1
+    }, 16, ["field", "label", "options"]));
+  }
+}), ba = Q({
+  name: "bento-select-payment-method-filter",
+  components: {
+    BentoSelectFilter: Te,
+    BentoPaymentMethod: yl
+  },
+  props: {
+    ...Oe,
+    /**
+     * List of options that are needed to setup the payment method filter
+     * Available options:
+     *   - multiple: If "true", the user will be able to select multiple items.
+     *   - listboxItems: The option elements to populate the filter with {@see BentoSelectPaymentMethodFilterOptions}
+     */
+    options: {
+      type: Object,
+      default: void 0
+    }
+  },
+  emits: [$.INPUT, $.UPDATE],
+  setup(e, { emit: n }) {
+    return {
+      // Enums
+      BentoFilterEvent: $,
+      // Methods
+      onUpdate: (i) => n($.UPDATE, i)
+    };
+  }
+});
+function fa(e, n, t, i, l, o) {
+  const u = G("bento-payment-method"), a = G("bento-select-filter");
+  return F(), R(a, se(e.$props, {
+    field: e.field,
+    label: e.label,
+    onUpdate: e.onUpdate,
+    onInput: n[0] || (n[0] = (r) => e.$emit(e.BentoFilterEvent.INPUT, r))
+  }), {
+    default: D(({ value: r, label: f }) => [
+      L(u, {
+        type: r,
+        label: f
+      }, null, 8, ["type", "label"])
+    ]),
+    _: 1
+  }, 16, ["field", "label", "onUpdate"]);
+}
+const jt = /* @__PURE__ */ le(ba, [["render", fa]]), va = Q({
+  name: "bento-select-country-filter",
+  components: {
+    BentoSelectFilter: Te,
+    ListboxOptionTag: Dt
+  },
+  props: {
+    ...Oe,
+    /**
+     * List of options that are needed to setup the tag filter
+     * Available options:
+     *   - multiple: If "true", the user will be able to select multiple items.
+     *   - listboxItems: The option elements to populate the filter with {@see BentoSelectTagFilterOptions}
+     */
+    options: {
+      type: Object,
+      default: void 0
+    }
+  },
+  emits: [$.INPUT, $.UPDATE],
+  setup(e, { emit: n }) {
+    const t = (o) => n($.UPDATE, o), i = c(
+      () => {
+        var o, u;
+        return (u = (o = e == null ? void 0 : e.options) == null ? void 0 : o.listboxItems) == null ? void 0 : u.map(({ label: a, value: r, variant: f }) => ({ label: a, value: r, data: f }));
+      }
+    );
+    return {
+      // Values
+      countryOptions: c(() => ({
+        ...e.options,
+        listboxItems: i.value
+      })),
+      // Methods
+      onUpdate: t,
+      // Enums
+      BentoFilterEvent: $
+    };
+  }
+});
+function ma(e, n, t, i, l, o) {
+  const u = G("listbox-option-tag"), a = G("bento-select-filter");
+  return F(), R(a, se(e.$props, {
+    field: e.field,
+    label: e.label,
+    options: e.countryOptions,
+    onUpdate: e.onUpdate,
+    onInput: n[0] || (n[0] = (r) => e.$emit(e.BentoFilterEvent.INPUT, r))
+  }), {
+    default: D(({ label: r, data: f }) => [
+      L(u, {
+        option: { value: r, data: f, label: "" }
+      }, null, 8, ["option"])
+    ]),
+    _: 1
+  }, 16, ["field", "label", "options", "onUpdate"]);
+}
+const Mt = /* @__PURE__ */ le(va, [["render", ma]]), Ht = {
+  "en-US": {
+    filter: "My filter",
+    resetFilter: "Reset filter {filterName}"
+  }
+}, ya = { class: "b-toggle-filter" }, ha = { class: "b-toggle-filter__content" }, ga = {
+  i18n: { messages: Ht },
+  name: "bento-toggle-filter"
+}, Fa = /* @__PURE__ */ Q({
+  ...ga,
+  props: {
+    description: {},
+    disabled: { type: Boolean, default: !1 },
+    field: {},
+    label: {},
+    onlySlot: { type: Boolean, default: !1 },
+    options: { default: void 0 },
+    value: { type: Boolean, default: !1 }
+  },
+  emits: ["input", "update"],
+  setup(e, { emit: n }) {
+    const { t } = ve({ messages: Ht }), i = Le("toggle-filter-checkbox-label"), l = Le("toggle-filter-checkbox-description"), o = e, u = n, a = j(o.value);
+    ie(
+      () => o.value,
+      (s) => {
+        a.value = s;
+      }
+    );
+    const r = c(() => ({
+      "b-toggle-filter__only-slot--disabled": o.disabled
+    })), f = (s) => {
+      a.value = s, u("input", { ...o, value: s });
+    }, d = () => {
+      u("update", { ...o, value: a.value });
+    }, S = () => {
+      a.value = !a.value, d();
+    }, O = () => {
+      a.value = !1, d();
+    };
+    return (s, m) => {
+      var y, I;
+      return s.onlySlot ? (F(), W("label", {
+        key: 1,
+        class: de(["b-toggle-filter__only-slot", r.value])
+      }, [
+        L(v(fl), {
+          "aria-labelledby": v(i),
+          "aria-describedby": v(l),
+          disabled: s.disabled,
+          class: "b-toggle-filter__checkbox",
+          "model-value": a.value,
+          "onUpdate:modelValue": f
+        }, null, 8, ["aria-labelledby", "aria-describedby", "disabled", "model-value"]),
+        Y("div", ha, [
+          L(v(me), {
+            id: v(i),
+            variant: "title",
+            medium: ""
+          }, {
+            default: D(() => [
+              X(x(s.label), 1)
+            ]),
+            _: 1
+          }, 8, ["id"]),
+          s.description ? (F(), R(v(me), {
+            key: 0,
+            id: v(l)
+          }, {
+            default: D(() => [
+              X(x(s.description), 1)
+            ]),
+            _: 1
+          }, 8, ["id"])) : Z("", !0)
+        ])
+      ], 2)) : Ye((F(), R(v(_t), {
+        key: 0,
+        "skip-grouping": !a.value
+      }, {
+        default: D(() => [
+          L(v(Ae), {
+            "aria-pressed": a.value ? "true" : "false",
+            active: a.value,
+            disabled: s.disabled,
+            onClick: S
+          }, {
+            default: D(() => [
+              Y("div", ya, [
+                X(x(s.label) + " ", 1),
+                Ye(L(v(ml), {
+                  "aria-hidden": "true",
+                  class: "b-toggle-filter__checkmark"
+                }, null, 512), [
+                  [Xt, a.value]
+                ])
+              ])
+            ]),
+            _: 1
+          }, 8, ["aria-pressed", "active", "disabled"]),
+          a.value ? (F(), R(v(Ae), {
+            key: 0,
+            "aria-label": v(t)("resetFilter", { filterName: s.label }),
+            disabled: s.disabled,
+            active: a.value,
+            onClick: O
+          }, {
+            iconLeft: D(() => [
+              L(v(gt), { "aria-hidden": "true" })
+            ]),
+            _: 1
+          }, 8, ["aria-label", "disabled", "active"])) : Z("", !0)
+        ]),
+        _: 1
+      }, 8, ["skip-grouping"])), [
+        [v(ht), (y = s.options) == null ? void 0 : y.tooltipText, (I = s.options) == null ? void 0 : I.tooltipPosition]
+      ]);
+    };
+  }
+}), Gt = /* @__PURE__ */ le(Fa, [["__scopeId", "data-v-5cedf9b6"]]), ut = {
+  "en-US": {
+    no: "No",
+    yes: "Yes"
+  },
+  "ja-JP": {
+    no: "いいえ",
+    yes: "はい"
+  },
+  "pt-BR": {
+    no: "Não",
+    yes: "Sim"
+  }
+}, Sa = Q({
+  name: "bento-boolean-filter",
+  i18n: { messages: ut },
+  components: { BentoBaseFilter: Se, BentoRadioGroup: mt },
+  props: {
+    /**
+     * Disables the filter from being interacted with.
+     */
+    disabled: { type: Boolean, default: !1 },
+    /**
+     * Default value of the filter to reset to.
+     */
+    defaultValue: { type: [String, Boolean], default: null },
+    /**
+     * Filter name/key referencing the actual property name in the data set.
+     * Should be unique per filter bar.
+     */
+    field: { type: String, required: !0 },
+    /**
+     * Label text to be displayed
+     */
+    label: { type: String, required: !0 },
+    /**
+     * Current value of the filter
+     */
+    value: { type: [String, Boolean], default: null },
+    /**
+     * Renders the base filter's slot content only - leaving out the button and the popover.
+     * Used for the allFiltersModal component.
+     */
+    onlySlot: { type: Boolean, default: !1 },
+    /**
+     * List of options that are needed to setup the filter
+     * Available options:
+     *   - positiveOption: The positive option label/value
+     *   - negativeOption: The positive option label/value
+     *   - tooltipPosition: The position of the tooltip attached to the filter button
+     *   - tooltipText: The content of the tooltip attached to the filter button
+     */
+    options: {
+      type: Object,
+      default: void 0
+    }
+  },
+  emits: [$.INPUT, $.UPDATE],
+  setup(e, { emit: n }) {
+    const { t } = ve({ messages: ut }), i = (_) => typeof _ == "boolean" ? _ == null ? void 0 : _.toString() : _, l = (_) => {
+      var M, B, N, H;
+      return ((B = (M = e == null ? void 0 : e.options) == null ? void 0 : M.positiveOption) == null ? void 0 : B.value) !== void 0 && ((H = (N = e == null ? void 0 : e.options) == null ? void 0 : N.negativeOption) == null ? void 0 : H.value) !== void 0 && typeof e.options.positiveOption.value == "boolean" && typeof e.options.negativeOption.value == "boolean" && typeof _ == "string" ? _ === "true" : _;
+    }, o = c(() => i(e.defaultValue)), u = c(() => i(e.value)), a = c(() => e.options && e.options.positiveOption && e.options.negativeOption ? [
+      {
+        ...e.options.positiveOption,
+        value: i(e.options.positiveOption.value)
+      },
+      {
+        ...e.options.negativeOption,
+        value: i(e.options.negativeOption.value)
+      }
+    ] : [
+      { value: "yes", label: t("yes") },
+      { value: "no", label: t("no") }
+    ]), { internalFilterValue: r, isSecondaryButtonDisabled: f, isApplyButtonDisabled: d } = Ce(
+      u,
+      o
+    ), S = c(() => e.label), O = c(
+      () => {
+        var _;
+        return Fe((_ = a.value.find(({ value: M }) => M === u.value)) == null ? void 0 : _.label, 12);
+      }
+    ), s = c(() => ({
+      "b-boolean-filter--only-slot": e.onlySlot
+    }));
+    He(() => {
+      r.value || (r.value = null);
+    });
+    const m = (_) => {
+      r.value = _, n($.INPUT, {
+        ...e,
+        value: l(r.value)
+      });
+    }, y = () => {
+      r.value = u.value;
+    }, I = () => {
+      n($.UPDATE, {
+        ...e,
+        value: l(r.value)
+      });
+    }, E = () => n($.UPDATE, { ...e, value: e.defaultValue }), P = () => {
+      r.value = null, I();
+    };
+    return je(() => {
+      Ge(
+        'Boolean filter "BentoFilterItemType.BOOLEAN"',
+        'Use the Radio group filter type "BentoFilterItemType.RADIO_GROUP" instead.',
+        "2.0.0"
+      );
+    }), {
+      // Values
+      items: a,
+      conditionalClasses: s,
+      buttonLabel: S,
+      buttonSecondaryLabel: O,
+      internalFilterValue: r,
+      isApplyButtonDisabled: d,
+      isSecondaryButtonDisabled: f,
+      translatedValue: u,
+      translatedDefaultValue: o,
+      // Events
+      onInput: m,
+      updateFilter: I,
+      clearFilter: P,
+      openFilter: y,
+      resetFilter: E
+    };
+  }
+});
+function Ba(e, n, t, i, l, o) {
+  var r, f;
+  const u = G("bento-radio-group"), a = G("bento-base-filter");
+  return F(), R(a, se(e.$props, {
+    value: e.translatedValue,
+    "default-value": e.translatedDefaultValue,
+    "button-label": e.buttonLabel,
+    "button-secondary-label": e.buttonSecondaryLabel,
+    "disable-apply-button": e.isApplyButtonDisabled,
+    "disable-secondary-button": e.isSecondaryButtonDisabled,
+    "only-slot": e.onlySlot,
+    "tooltip-position": (r = e.options) == null ? void 0 : r.tooltipPosition,
+    "tooltip-text": (f = e.options) == null ? void 0 : f.tooltipText,
+    onApply: e.updateFilter,
+    onClear: e.clearFilter,
+    onOpen: e.openFilter,
+    onReset: e.resetFilter
+  }), {
+    default: D(() => [
+      Y("div", {
+        class: de(["b-boolean-filter", e.conditionalClasses]),
+        onKeydown: n[0] || (n[0] = ge((...d) => e.updateFilter && e.updateFilter(...d), ["enter"]))
+      }, [
+        L(u, {
+          items: e.items,
+          label: e.label,
+          "model-value": e.internalFilterValue,
+          disabled: e.disabled,
+          "hide-label": "",
+          "onUpdate:modelValue": e.onInput
+        }, null, 8, ["items", "label", "model-value", "disabled", "onUpdate:modelValue"])
+      ], 34)
+    ]),
+    _: 1
+  }, 16, ["value", "default-value", "button-label", "button-secondary-label", "disable-apply-button", "disable-secondary-button", "only-slot", "tooltip-position", "tooltip-text", "onApply", "onClear", "onOpen", "onReset"]);
+}
+const Kt = /* @__PURE__ */ le(Sa, [["render", Ba], ["__scopeId", "data-v-4f4270be"]]), dt = {
+  "en-US": {
+    from: "From",
+    to: "To"
+  },
+  "ja-JP": {
+    from: "開始",
+    to: "終了"
+  },
+  "pt-BR": {
+    from: "De",
+    to: "Até"
+  }
+}, Ca = Q({
+  name: "bento-range-filter",
+  i18n: { messages: dt },
+  components: { BentoBaseFilter: Se, BentoInputField: We },
+  props: {
+    /**
+     * Disables the filter from being interacted with.
+     */
+    disabled: { type: Boolean, default: !1 },
+    /**
+     * Default value of the filter to reset to.
+     */
+    defaultValue: { type: Array, default: null },
+    /**
+     * Filter name/key referencing the actual property name in the data set.
+     * Should be unique per filter bar.
+     */
+    field: { type: String, required: !0 },
+    /**
+     * Label text to be displayed
+     */
+    label: { type: String, required: !0 },
+    /**
+     * Current value of the filter
+     */
+    value: { type: Array, default: () => ["", ""] },
+    /**
+     * Renders the base filter's slot content only - leaving out the button and the popover.
+     * Used for the allFiltersModal component.
+     */
+    onlySlot: { type: Boolean, default: !1 },
+    /**
+     * List of options that are needed to setup the filter
+     * Available options:
+     *   - tooltipPosition: The position of the tooltip attached to the filter button
+     *   - tooltipText: The content of the tooltip attached to the filter button
+     */
+    options: { type: Object, default: void 0 }
+  },
+  emits: [$.INPUT, $.UPDATE],
+  setup(e, { emit: n }) {
+    const { t } = ve({ messages: dt }), i = j(null), { internalFilterValue: l, isSecondaryButtonDisabled: o, isApplyButtonDisabled: u } = Ce(
+      ee(e, "value"),
+      ee(e, "defaultValue")
+    ), a = c(() => {
+      var N, H, U, A, J, z, ae, T;
+      if (!((N = e.value) != null && N[0]) && !((H = e.value) != null && H[1]))
+        return null;
+      let P = "";
+      (U = e.value) != null && U[0] ? (A = e.value) != null && A[1] || (P = "≥") : P = "≤";
+      const _ = (J = e.value) != null && J[0] ? `${Fe(e.value[0], 5)}` : "", M = (z = e.value) != null && z[0] && ((ae = e.value) != null && ae[1]) ? " - " : "", B = (T = e.value) != null && T[1] ? `${Fe(e.value[1], 5)}` : "";
+      return `${P}${_}${M}${B}`;
+    }), r = c(() => e.label), f = c(() => a.value), d = c(() => ({
+      "b-range-filter--only-slot": e.onlySlot
+    })), S = () => {
+      l.value = e.value, bt(() => i.value.focusInput());
+    }, O = () => {
+      n($.INPUT, { ...e, value: l.value });
+    }, s = (P) => {
+      l.value = [P, l.value[1]], O();
+    }, m = (P) => {
+      l.value = [l.value[0], P], O();
+    }, y = () => {
+      l.value.some((P) => P) || (l.value = e.defaultValue !== null ? e.defaultValue : void 0), n($.UPDATE, {
+        ...e,
+        value: l.value
+      });
+    };
+    return {
+      // Values
+      inputTextRef: i,
+      conditionalClasses: d,
+      internalFilterValue: l,
+      isApplyButtonDisabled: u,
+      isSecondaryButtonDisabled: o,
+      buttonLabel: r,
+      buttonSecondaryLabel: f,
+      // Events
+      updateFrom: s,
+      updateTo: m,
+      updateFilter: y,
+      clearFilter: () => {
+        l.value = ["", ""], y();
+      },
+      openFilter: S,
+      resetFilter: () => n($.UPDATE, { ...e, value: e.defaultValue }),
+      // Translations
+      t
+    };
+  }
+});
+function Da(e, n, t, i, l, o) {
+  var r, f;
+  const u = G("bento-input-field"), a = G("bento-base-filter");
+  return F(), R(a, se(e.$props, {
+    "disable-apply-button": e.isApplyButtonDisabled,
+    "disable-secondary-button": e.isSecondaryButtonDisabled,
+    "button-label": e.buttonLabel,
+    "button-secondary-label": e.buttonSecondaryLabel,
+    "only-slot": e.onlySlot,
+    "tooltip-position": (r = e.options) == null ? void 0 : r.tooltipPosition,
+    "tooltip-text": (f = e.options) == null ? void 0 : f.tooltipText,
+    onApply: e.updateFilter,
+    onClear: e.clearFilter,
+    onOpen: e.openFilter,
+    onReset: e.resetFilter
+  }), {
+    default: D(() => [
+      Y("div", {
+        class: de(["b-range-filter", e.conditionalClasses]),
+        onKeydown: n[0] || (n[0] = ge((...d) => e.updateFilter && e.updateFilter(...d), ["enter"]))
+      }, [
+        L(u, {
+          ref: "inputTextRef",
+          "model-value": e.internalFilterValue ? e.internalFilterValue[0] : "",
+          type: "number",
+          "aria-label": e.t("from").toString(),
+          disabled: e.disabled,
+          "onUpdate:modelValue": e.updateFrom
+        }, {
+          default: D(() => [
+            X(x(e.t("from")), 1)
+          ]),
+          _: 1
+        }, 8, ["model-value", "aria-label", "disabled", "onUpdate:modelValue"]),
+        L(u, {
+          class: "b-range-filter__input-field",
+          "model-value": e.internalFilterValue ? e.internalFilterValue[1] : "",
+          type: "number",
+          "aria-label": e.t("to"),
+          disabled: e.disabled,
+          "onUpdate:modelValue": e.updateTo
+        }, {
+          default: D(() => [
+            X(x(e.t("to")), 1)
+          ]),
+          _: 1
+        }, 8, ["model-value", "aria-label", "disabled", "onUpdate:modelValue"])
+      ], 34)
+    ]),
+    _: 1
+  }, 16, ["disable-apply-button", "disable-secondary-button", "button-label", "button-secondary-label", "only-slot", "tooltip-position", "tooltip-text", "onApply", "onClear", "onOpen", "onReset"]);
+}
+const Jt = /* @__PURE__ */ le(Ca, [["render", Da], ["__scopeId", "data-v-c71c8dbd"]]), qt = {
+  "en-US": {
+    all: "All"
+  },
+  "ja-JP": {
+    all: "すべて"
+  },
+  "pt-BR": {
+    all: "Todos"
+  }
+}, Aa = {
+  name: "bento-checkbox-group-filter",
+  i18n: { messages: qt }
+}, Ta = /* @__PURE__ */ Q({
+  ...Aa,
+  props: {
+    disabled: { type: Boolean, default: !1 },
+    defaultValue: { default: void 0 },
+    field: {},
+    label: {},
+    onlySlot: { type: Boolean, default: !1 },
+    options: { default: void 0 },
+    value: { default: void 0 }
+  },
+  emits: ["input", "update"],
+  setup(e, { emit: n }) {
+    const t = e, i = n, { t: l } = ve({ messages: qt }), {
+      internalFilterValue: o,
+      isSecondaryButtonDisabled: u,
+      isApplyButtonDisabled: a,
+      clearFilter: r,
+      resetFilter: f,
+      openFilter: d
+    } = It(ee(t, "value"), ee(t, "defaultValue")), S = j(o.value ?? []), O = c(() => ({
+      "b-checkbox-group-filter--only-slot": t.onlySlot
+    })), s = c(() => t.label), m = c(
+      () => {
+        var P, _;
+        return S.value.length === 1 ? Fe(
+          ((_ = (P = t.options) == null ? void 0 : P.checkboxItems.find((M) => S.value[0] === M.value)) == null ? void 0 : _.label) ?? "",
+          12
+        ) : null;
+      }
+    ), y = c(() => {
+      var P;
+      return !S.value.length || m.value ? null : S.value.length === ((P = t.options) == null ? void 0 : P.checkboxItems.length) ? l("all") : S.value.length;
+    }), I = (P) => {
+      S.value = P ?? [], i("update", { ...t, value: P });
+    }, E = (P) => {
+      o.value = P, i("input", { ...t, value: o.value });
+    };
+    return (P, _) => {
+      var M, B;
+      return F(), R(v(Se), se(P.$props, {
+        "applied-filters-count": y.value,
+        "button-label": s.value,
+        "button-secondary-label": m.value,
+        "disable-apply-button": v(a),
+        "disable-secondary-button": v(u),
+        "tooltip-position": (M = P.options) == null ? void 0 : M.tooltipPosition,
+        "tooltip-text": (B = P.options) == null ? void 0 : B.tooltipText,
+        onApply: _[1] || (_[1] = (N) => I(v(o))),
+        onClear: _[2] || (_[2] = (N) => v(r)(I)),
+        onOpen: v(d),
+        onReset: _[3] || (_[3] = (N) => v(f)(I))
+      }), {
+        default: D(() => {
+          var N;
+          return [
+            Y("div", {
+              class: de(["b-checkbox-group-filter", O.value]),
+              onKeydown: _[0] || (_[0] = ge((H) => I(v(o)), ["enter"]))
+            }, [
+              L(ul, {
+                "model-value": v(o),
+                items: (N = P.options) == null ? void 0 : N.checkboxItems,
+                label: P.label,
+                disabled: P.disabled,
+                "hide-label": "",
+                "onUpdate:modelValue": E
+              }, null, 8, ["model-value", "items", "label", "disabled"])
+            ], 34)
+          ];
+        }),
+        _: 1
+      }, 16, ["applied-filters-count", "button-label", "button-secondary-label", "disable-apply-button", "disable-secondary-button", "tooltip-position", "tooltip-text", "onOpen"]);
+    };
+  }
+}), Yt = /* @__PURE__ */ le(Ta, [["__scopeId", "data-v-a691cbf8"]]);
+var ze = /* @__PURE__ */ ((e) => (e.INPUT = "input", e))(ze || {});
+const Ia = Q({
+  name: "base-filter-button",
+  components: { BaseButton: Ft, BentoTypography: me, ChevronUpIcon: pl, ChevronDownIcon: bl },
+  props: {
+    /**
+     * The number of applies values within the filter.
+     * e.g. if 2 items in a dropdown filter have been applied, the number 2 will be shown here.
+     */
+    amountAppliedValues: { type: [Number, String], default: null },
+    /**
+     * Disables button functionality.
+     */
+    disabled: { type: Boolean, default: !1 },
+    /**
+     * Signifies if the filter is open or closed.
+     */
+    isFilterOpen: { type: Boolean, default: !1 },
+    /**
+     * Toggles if a chevron icon should be displayed in the button.
+     * The chevron will change depending on the open state of the filter.
+     */
+    hasChevron: { type: Boolean, default: !1 },
+    /**
+     * Renders the text in a stronger variant.
+     */
+    bold: { type: Boolean, default: !1 }
+  },
+  emits: [xe.CLICK],
+  setup(e, { slots: n, emit: t, attrs: i }) {
+    const l = c(() => n.default ? Ct(n)("default") : null), o = Bt({ ariaLabel: l }), u = j(null), a = c(() => {
+      var d;
+      return {
+        "aria-controls": (d = i["aria-controls"]) == null ? void 0 : d.toString()
+      };
+    }), r = c(() => ({
+      "b-base-filter-button--with-chevron": e.hasChevron,
+      "b-base-filter-button--filter-open": e.isFilterOpen
+    }));
+    return {
+      // Values
+      ariaAttributes: a,
+      computedAriaLabel: o,
+      conditionalClasses: r,
+      // Methods
+      onClickButton: () => {
+        e.disabled || t(xe.CLICK);
+      },
+      hasSlot: St(n),
+      // Refs
+      baseFilterButtonRef: u
+    };
+  }
+}), _a = { class: "b-base-filter-button__default-container" }, $a = { class: "b-base-filter-button__label-container" }, Oa = {
+  key: 0,
+  class: "b-base-filter-button__counter-wrapper"
+};
+function Pa(e, n, t, i, l, o) {
+  const u = G("bento-typography"), a = G("chevron-up-icon"), r = G("chevron-down-icon"), f = G("base-button");
+  return F(), R(f, {
+    ref: "baseFilterButtonRef",
+    class: de(["b-base-filter-button", e.conditionalClasses]),
+    disabled: e.disabled,
+    "aria-label": e.computedAriaLabel,
+    "aria-controls": e.ariaAttributes["aria-controls"],
+    type: "button",
+    onClick: e.onClickButton
+  }, Ee({
+    default: D(() => [
+      Y("div", _a, [
+        Y("div", $a, [
+          L(u, {
+            el: "span",
+            variant: "body",
+            stronger: e.bold,
+            class: "b-base-filter-button__label"
+          }, {
+            default: D(() => [
+              ye(e.$slots, "default", {}, void 0, !0)
+            ]),
+            _: 3
+          }, 8, ["stronger"])
+        ]),
+        e.amountAppliedValues && !e.hasChevron ? (F(), W("div", Oa, [
+          L(u, {
+            class: "b-base-filter-button__counter",
+            el: "span",
+            variant: "body",
+            stronger: ""
+          }, {
+            default: D(() => [
+              X(x(e.amountAppliedValues), 1)
+            ]),
+            _: 1
+          })
+        ])) : Z("", !0)
+      ])
+    ]),
+    _: 2
+  }, [
+    e.hasChevron ? {
+      name: "iconRight",
+      fn: D(() => [
+        e.isFilterOpen ? (F(), R(a, {
+          key: 0,
+          "aria-hidden": "true"
+        })) : (F(), R(r, {
+          key: 1,
+          "aria-hidden": "true"
+        }))
+      ]),
+      key: "0"
+    } : void 0
+  ]), 1032, ["class", "disabled", "aria-label", "aria-controls", "onClick"]);
+}
+const Ua = /* @__PURE__ */ le(Ia, [["render", Pa], ["__scopeId", "data-v-af9efc73"]]), Ea = Q({
+  name: "all-filters-modal-button",
+  components: { BaseFilterButton: Ua },
+  props: {
+    /**
+     * Button label to be displayed
+     */
+    label: { type: String, required: !0 },
+    /**
+     * Total count of applied filters
+     */
+    appliedFiltersCount: { type: [Number, String], default: null },
+    /**
+     * Indicates whether the filter popover tied to this button is showing
+     */
+    isFilterOpen: { type: Boolean, default: !1 },
+    /**
+     * Disables button functionality.
+     */
+    disabled: { type: Boolean, default: !1 }
+  },
+  emits: ["click"],
+  setup(e, { emit: n }) {
+    return {
+      conditionalClasses: c(() => ({
+        "b-all-filters-modal-button--with-counter": e.appliedFiltersCount,
+        "b-all-filters-modal-button--filter-open": e.isFilterOpen
+      })),
+      onClick: () => {
+        n("click");
+      }
+    };
+  }
+});
+function La(e, n, t, i, l, o) {
+  const u = G("base-filter-button");
+  return F(), R(u, {
+    class: de(["b-all-filters-modal-button", e.conditionalClasses]),
+    "amount-applied-values": e.appliedFiltersCount,
+    "is-filter-open": e.isFilterOpen,
+    disabled: e.disabled,
+    onClick: e.onClick
+  }, {
+    default: D(() => [
+      X(x(e.label), 1)
+    ]),
+    _: 1
+  }, 8, ["class", "amount-applied-values", "is-filter-open", "disabled", "onClick"]);
+}
+const Ra = /* @__PURE__ */ le(Ea, [["render", La], ["__scopeId", "data-v-b96a672f"]]);
+let ct = 0;
+const ka = {
+  beforeCreate() {
+    this.uuid = ct.toString(), ct += 1;
+  }
+}, Va = { key: 0 };
+function wa(e, n, t, i, l, o) {
+  return F(), W("svg", se({ 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"] ? (F(), W("title", Va, x(e.$attrs["svg-title"]), 1)) : Z("", !0),
+    n[0] || (n[0] = Y("path", {
+      fill: "#001222",
+      d: "M12.6465 4.58337C12.32 3.42912 11.2588 2.58337 10 2.58337C8.74122 2.58337 7.67998 3.42912 7.35352 4.58337H1.25V6.08337H7.35352C7.67998 7.23763 8.74122 8.08337 10 8.08337C11.2588 8.08337 12.32 7.23763 12.6465 6.08337H14.75V4.58337H12.6465ZM11.25 5.33337C11.25 6.02373 10.6904 6.58337 10 6.58337C9.30964 6.58337 8.75 6.02373 8.75 5.33337C8.75 4.64302 9.30964 4.08337 10 4.08337C10.6904 4.08337 11.25 4.64302 11.25 5.33337Z"
+    }, null, -1)),
+    n[1] || (n[1] = Y("path", {
+      fill: "#001222",
+      d: "M4 7.91687C5.25878 7.91687 6.32002 8.76262 6.64648 9.91687H14.75V11.4169H6.64648C6.32002 12.5711 5.25878 13.4169 4 13.4169C2.48122 13.4169 1.25 12.1857 1.25 10.6669C1.25 9.14809 2.48122 7.91687 4 7.91687ZM5.25 10.6669C5.25 9.97651 4.69036 9.41687 4 9.41687C3.30964 9.41687 2.75 9.97651 2.75 10.6669C2.75 11.3572 3.30964 11.9169 4 11.9169C4.69036 11.9169 5.25 11.3572 5.25 10.6669Z"
+    }, null, -1))
+  ], 16);
+}
+const Na = /* @__PURE__ */ le(ka, [["render", wa]]), pt = {
+  "en-US": {
+    activeFilters: "Active filters",
+    all: "All",
+    allFilters: "All filters",
+    applyAll: "Apply all",
+    cancel: "Cancel",
+    clear: "Clear",
+    clearAll: "Clear all",
+    noFiltersMatchThisSearch: "No filters match this search",
+    otherFilters: "Other filters",
+    searchBar: "Search bar"
+  },
+  "ja-JP": {
+    activeFilters: "アクティブなフィルター",
+    all: "すべて",
+    allFilters: "すべてのフィルター",
+    applyAll: "すべて適用",
+    cancel: "キャンセル",
+    clear: "クリア",
+    clearAll: "すべてクリア",
+    noFiltersMatchThisSearch: "この検索に一致するフィルターはありません",
+    otherFilters: "他のフィルター",
+    searchBar: "検索バー"
+  },
+  "pt-BR": {
+    activeFilters: "Filtros ativos",
+    all: "Todos",
+    allFilters: "Todos os filtros",
+    applyAll: "Aplicar tudo",
+    cancel: "Cancelar",
+    clear: "Limpar",
+    clearAll: "Limpar tudo",
+    noFiltersMatchThisSearch: "Nenhum filtro corresponde a esta busca",
+    otherFilters: "Outros filtros",
+    searchBar: "Barra de pesquisa"
+  }
+}, ja = Q({
+  i18n: { messages: pt },
+  name: "all-filters-modal",
+  components: {
+    AllFiltersModalButton: Ra,
+    BentoBooleanFilter: Kt,
+    BentoButton: ll,
+    BentoCheckboxGroupFilter: Yt,
+    BentoDateFilter: Ut,
+    BentoDateRangeFilter: Et,
+    BentoInputFilter: Ot,
+    BentoInputWithDropdownFilter: Pt,
+    BentoModal: tl,
+    BentoRadioGroupFilter: Lt,
+    BentoRangeFilter: Jt,
+    BentoSearchBar: Ne,
+    BentoSelectAvatarFilter: Vt,
+    BentoSelectCurrencyFilter: wt,
+    BentoSelectCountryFilter: Nt,
+    BentoSelectFilter: Te,
+    BentoSelectPaymentMethodFilter: jt,
+    BentoSelectTagFilter: Mt,
+    BentoToggleFilter: Gt,
+    BentoTypography: me,
+    FilterBarButton: Ae,
+    SlidersIcon: Na
+  },
+  props: {
+    /**
+     * Array of filters based on {@see FilterBarModel}.
+     * Each one of the elements in the array correspond to a filter that will
+     * be created and rendered in the AllFiltersModal.
+     *
+     * Can be used with v-model or independently with the @input event.
+     *
+     * @example
+     * [{
+     *   field: 'company',
+     *   label: 'Company',
+     *   value: '200',
+     *   type: FilterType.TEXT,
+     * }, {
+     *   field: 'name',
+     *   label: 'Name',
+     *   value: null,
+     *   type: FilterType.TEXT,
+     * }]
+     */
+    value: {
+      type: Array,
+      default: () => []
+    }
+  },
+  emits: [ze.INPUT],
+  setup(e, { emit: n }) {
+    const t = j(e.value), i = Le("all-filters-modal"), l = j([]), o = j(!1), u = j(0), a = j(null), r = j(""), { t: f, n: d } = ve({ messages: pt }), S = Ze(r, ee(t, "value")), O = j({});
+    He(() => {
+      O.value = [];
+    }), ie(
+      () => e.value,
+      () => {
+        o.value ? t.value = e.value.map((C, g) => ({ ...C, value: t.value[g].value })) : t.value = e.value;
+      }
+    );
+    const s = (C) => C.sort((g, k) => g.label > k.label ? 1 : k.label > g.label ? -1 : 0), m = c(
+      () => s(
+        S.value.filter(
+          (C) => {
+            var g, k;
+            return Array.isArray(C.value) ? ((g = C.value) == null ? void 0 : g.length) && ((k = C.value) == null ? void 0 : k.find((te) => te !== "")) : C.value;
+          }
+        )
+      )
+    ), y = c(
+      () => s(
+        S.value.filter(
+          (C) => {
+            var g, k;
+            return Array.isArray(C.value) ? ((g = C.value) == null ? void 0 : g.length) === 0 || ((k = C.value) == null ? void 0 : k.every((te) => te === "")) : !C.value;
+          }
+        )
+      )
+    ), I = c(() => {
+      var C;
+      return r.value && ((C = S.value) == null ? void 0 : C.length) === 0;
+    }), E = c(() => t.value[u.value]), P = () => {
+      const C = m.value.length ? m.value[0] : y.value[0], g = t.value.findIndex(
+        (k) => k.label === C.label && k.field === C.field
+      );
+      u.value = g;
+    };
+    je(() => {
+      P();
+    });
+    const _ = (C) => C.map((g) => {
+      var k, te, re, ce, pe, be, fe, he;
+      switch (g.type) {
+        case ne.SELECT:
+        case ne.SELECT_AVATAR:
+        case ne.SELECT_COUNTRY:
+        case ne.SELECT_CURRENCY:
+        case ne.SELECT_PAYMENT_METHOD:
+        case ne.SELECT_TAG:
+          return ((k = g.options) == null ? void 0 : k.multiple) === !0 ? {
+            label: g.label,
+            field: g.field,
+            count: (te = g.value) != null && te.length ? (re = g.value) == null ? void 0 : re.length : null
+          } : {
+            label: g.label,
+            field: g.field,
+            count: g.value == null ? null : 1
+          };
+        case ne.DATE_RANGE:
+          return {
+            label: g.label,
+            field: g.field,
+            count: ((ce = g.value) == null ? void 0 : ce.startDate) != null && ((pe = g.value) == null ? void 0 : pe.endDate) != null ? 1 : null
+          };
+        case ne.RANGE:
+          return {
+            label: g.label,
+            field: g.field,
+            count: (be = g.value) != null && be.find((oe) => oe !== "") ? 1 : null
+          };
+        case ne.CHECKBOX_GROUP:
+          return {
+            label: g.label,
+            field: g.field,
+            count: (fe = g.value) != null && fe.length ? (he = g.value) == null ? void 0 : he.length : null
+          };
+        case ne.TOGGLE:
+          return {
+            label: g.label,
+            field: g.field,
+            count: g.value ? 1 : null
+          };
+        case ne.INPUT:
+        case ne.BOOLEAN:
+        case ne.DATE:
+        case ne.RADIO_GROUP:
+        default:
+          return {
+            label: g.label,
+            field: g.field,
+            count: g.value != null ? 1 : null
+          };
+      }
+    }), M = c(
+      () => {
+        var C;
+        return Array.isArray(E.value.value) ? ((C = E.value) == null ? void 0 : C.value.length) && E.value.value.find((g) => g !== "") : !!t.value[u.value].value;
+      }
+    ), B = c(() => E.value.type !== ne.TOGGLE), N = c(() => !M.value || E.value.disabled), H = c(
+      () => {
+        var C;
+        return (C = _(e.value)) == null ? void 0 : C.filter(({ count: g }) => !!g).length;
+      }
+    ), U = () => {
+      o.value ? o.value = !1 : o.value = !0;
+    }, A = (C) => {
+      var re, ce, pe, be, fe;
+      const g = _(t.value).find((he) => he.field === C.field).count, k = typeof C.type == "string" && // Type guard to avoid casting
+      C.type.includes("BentoSelect") && ((re = C.options) == null ? void 0 : re.multiple) && g === ((pe = (ce = C.options) == null ? void 0 : ce.listboxItems) == null ? void 0 : pe.length), te = typeof C.type == "string" && C.type === ne.CHECKBOX_GROUP && g === ((fe = (be = C.options) == null ? void 0 : be.checkboxItems) == null ? void 0 : fe.length);
+      return k || te ? f("all") : g === null ? null : d(g);
+    }, J = (C, g) => {
+      u.value = t.value.findIndex(
+        (k) => k.label === C && k.field === g
+      );
+    }, z = () => {
+      r.value = "";
+    }, ae = () => {
+      o.value = !1, t.value = e.value, z(), P();
+    }, T = (C) => {
+      const g = t.value.map(({ value: k, ...te }, re) => re === u.value ? { value: C.value, ...te } : { value: k, ...te });
+      t.value = g;
+    }, h = () => {
+      T({
+        field: E.value.field,
+        label: E.value.label,
+        type: E.value.type,
+        value: void 0
+      });
+    }, b = () => {
+      t.value = e.value.map(({ value: C, ...g }) => ({
+        ...g,
+        value: void 0
+      }));
+    }, w = () => {
+      n(ze.INPUT, t.value), o.value = !1;
+    }, K = c(
+      () => JSON.stringify(t.value) === JSON.stringify(e.value)
+    ), p = c(() => [
+      {
+        title: f("applyAll"),
+        disabled: K.value,
+        event: w
+      },
+      {
+        title: f("cancel"),
+        event: ae
+      },
+      {
+        title: f("clearAll"),
+        disabled: !H.value,
+        event: b
+      }
+    ]);
+    return {
+      // Values
+      allFiltersModalUniqueId: i,
+      allFiltersModalFiltersSection: l,
+      allFiltersModalFilterButtons: O,
+      numberOfActiveFilters: H,
+      isEmptyResultForSearchFilter: I,
+      isModalOpen: o,
+      isClearButtonDisabled: N,
+      activeFilters: m,
+      otherFilters: y,
+      modalActions: p,
+      selectedFilter: E,
+      selectedFilterRef: a,
+      searchTerm: r,
+      shouldShowFilterTitle: B,
+      // Methods
+      onClickAllFiltersModal: U,
+      getFilterCount: A,
+      cancel: ae,
+      selectFilter: J,
+      clearFilter: h,
+      updateFilter: T,
+      onSearchbarClear: z,
+      onKeydownRight: () => {
+        cl(1, a.value.$el).focus();
+      },
+      onKeydownLeft: () => {
+        O.value[E.value.label].$el.focus();
+      },
+      // Translations
+      t: f
+    };
+  }
+}), Ma = { class: "b-all-filters-modal" }, Ha = {
+  key: 0,
+  class: "b-all-filters-modal__empty-search-message"
+}, Ga = {
+  key: 1,
+  class: "b-all-filters-modal__filters-section"
+}, Ka = ["aria-labelledby"], Ja = {
+  key: 2,
+  class: "b-all-filters-modal__filters-section"
+}, qa = ["aria-labelledby"], Ya = {
+  key: 0,
+  class: "b-all-filters-modal__selected-filter-text"
+}, za = { class: "b-all-filters-modal__selected-filter-component" }, Wa = { class: "b-all-filters-modal__clear-button" };
+function Za(e, n, t, i, l, o) {
+  const u = G("sliders-icon"), a = G("filter-bar-button"), r = G("bento-search-bar"), f = G("bento-typography"), d = G("all-filters-modal-button"), S = G("bento-button"), O = G("bento-modal");
+  return F(), W("div", Ma, [
+    L(a, {
+      "is-filter-open": e.isModalOpen,
+      "applied-filters-count": e.numberOfActiveFilters,
+      "no-applied-state-styles": "",
+      onClick: e.onClickAllFiltersModal
+    }, {
+      iconLeft: D(() => [
+        L(u, { "aria-hidden": "true" })
+      ]),
+      default: D(() => [
+        X(x(e.t("allFilters")) + " ", 1)
+      ]),
+      _: 1
+    }, 8, ["is-filter-open", "applied-filters-count", "onClick"]),
+    L(O, {
+      class: "'b-all-filters-modal__modal'",
+      "is-open": e.isModalOpen,
+      "with-column-layout": !0,
+      size: "large",
+      actions: e.modalActions,
+      "is-dismissible": !1,
+      "hide-close-button": "",
+      onCloseModal: e.cancel
+    }, {
+      default: D(() => [
+        X(x(e.t("allFilters")), 1)
+      ]),
+      "content-col-1": D(() => [
+        Y("div", {
+          ref: "allFiltersModalFiltersSection",
+          class: "b-all-filters-modal__filters",
+          onKeydown: n[1] || (n[1] = ge((...s) => e.onKeydownRight && e.onKeydownRight(...s), ["right"]))
+        }, [
+          L(r, {
+            class: "b-all-filters-modal__search-bar",
+            value: e.searchTerm,
+            "input-field-aria-label": e.t("searchBar").toString(),
+            onInput: n[0] || (n[0] = (s) => e.searchTerm = s),
+            onClear: e.onSearchbarClear
+          }, null, 8, ["value", "input-field-aria-label", "onClear"]),
+          e.isEmptyResultForSearchFilter ? (F(), W("div", Ha, [
+            L(f, { el: "span" }, {
+              default: D(() => [
+                X(x(e.t("noFiltersMatchThisSearch")), 1)
+              ]),
+              _: 1
+            })
+          ])) : Z("", !0),
+          e.activeFilters.length ? (F(), W("div", Ga, [
+            L(f, {
+              id: `active-filters-${e.allFiltersModalUniqueId}`,
+              class: "b-all-filters-modal__filters-section-title",
+              el: "span",
+              variant: "caption"
+            }, {
+              default: D(() => [
+                X(x(e.t("activeFilters")), 1)
+              ]),
+              _: 1
+            }, 8, ["id"]),
+            Y("ul", {
+              class: "b-all-filters-modal__filters-list",
+              "aria-labelledby": `active-filters-${e.allFiltersModalUniqueId}`
+            }, [
+              (F(!0), W(Ue, null, Be(e.activeFilters, (s) => (F(), W("li", {
+                key: `${s.label}-${s.field}`
+              }, [
+                L(d, {
+                  ref_for: !0,
+                  ref: (m) => e.allFiltersModalFilterButtons[s.label] = m,
+                  label: s.label,
+                  "applied-filters-count": e.getFilterCount(s),
+                  "is-filter-open": e.selectedFilter.label === s.label,
+                  disabled: s.disabled,
+                  onClick: (m) => e.selectFilter(s.label, s.field)
+                }, null, 8, ["label", "applied-filters-count", "is-filter-open", "disabled", "onClick"])
+              ]))), 128))
+            ], 8, Ka)
+          ])) : Z("", !0),
+          e.otherFilters.length ? (F(), W("div", Ja, [
+            e.activeFilters.length ? (F(), R(f, {
+              key: 0,
+              id: `other-filters-${e.allFiltersModalUniqueId}`,
+              class: "b-all-filters-modal__filters-section-title",
+              el: "span",
+              variant: "caption"
+            }, {
+              default: D(() => [
+                X(x(e.t("otherFilters")), 1)
+              ]),
+              _: 1
+            }, 8, ["id"])) : Z("", !0),
+            Y("ul", {
+              class: "b-all-filters-modal__filters-list",
+              "aria-labelledby": `other-filters-${e.allFiltersModalUniqueId}`
+            }, [
+              (F(!0), W(Ue, null, Be(e.otherFilters, (s) => (F(), W("li", {
+                key: `${s.label}-${s.field}`
+              }, [
+                L(d, {
+                  ref_for: !0,
+                  ref: (m) => e.allFiltersModalFilterButtons[s.label] = m,
+                  label: s.label,
+                  disabled: s.disabled,
+                  "applied-filters-count": e.getFilterCount(s),
+                  "is-filter-open": e.selectedFilter.label === s.label,
+                  onClick: (m) => e.selectFilter(s.label, s.field)
+                }, null, 8, ["label", "disabled", "applied-filters-count", "is-filter-open", "onClick"])
+              ]))), 128))
+            ], 8, qa)
+          ])) : Z("", !0)
+        ], 544)
+      ]),
+      "content-col-2": D(() => [
+        Y("div", {
+          class: "b-all-filters-modal__selected-filter-content",
+          onKeydown: n[2] || (n[2] = ge((...s) => e.onKeydownLeft && e.onKeydownLeft(...s), ["left"]))
+        }, [
+          e.shouldShowFilterTitle ? (F(), W("div", Ya, [
+            L(f, {
+              el: "div",
+              variant: "title",
+              medium: ""
+            }, {
+              default: D(() => [
+                X(x(e.selectedFilter.label), 1)
+              ]),
+              _: 1
+            }),
+            e.selectedFilter.description ? (F(), R(f, {
+              key: 0,
+              el: "div",
+              variant: "body",
+              wide: ""
+            }, {
+              default: D(() => [
+                X(x(e.selectedFilter.description), 1)
+              ]),
+              _: 1
+            })) : Z("", !0)
+          ])) : Z("", !0),
+          Y("div", za, [
+            (F(), R(ke(e.selectedFilter.type), {
+              ref: "selectedFilterRef",
+              key: e.selectedFilter.field,
+              description: e.selectedFilter.description,
+              field: e.selectedFilter.field,
+              label: e.selectedFilter.label,
+              options: e.selectedFilter.options,
+              value: e.selectedFilter.value,
+              "default-value": e.selectedFilter.defaultValue,
+              "only-slot": !0,
+              disabled: e.selectedFilter.disabled,
+              onInput: e.updateFilter
+            }, null, 40, ["description", "field", "label", "options", "value", "default-value", "disabled", "onInput"]))
+          ]),
+          Y("div", Wa, [
+            L(S, {
+              variant: "secondary",
+              disabled: e.isClearButtonDisabled,
+              onClick: e.clearFilter
+            }, {
+              default: D(() => [
+                X(x(e.t("clear")), 1)
+              ]),
+              _: 1
+            }, 8, ["disabled", "onClick"])
+          ])
+        ], 32)
+      ]),
+      _: 1
+    }, 8, ["is-open", "actions", "onCloseModal"])
+  ]);
+}
+const Qa = /* @__PURE__ */ le(ja, [["render", Za], ["__scopeId", "data-v-22ddbff2"]]), zt = {
+  "en-US": {
+    clearFilters: "Clear filters",
+    filtersHaveBeenCleared: "Filters have been cleared.",
+    filtersHaveBeenReset: "Filters have been reset.",
+    resetFilters: "Reset filters",
+    searchBar: "Search bar",
+    undo: "Undo"
+  },
+  "ja-JP": {
+    clearFilters: "フィルターをクリア",
+    filtersHaveBeenCleared: "フィルターをクリアしました。",
+    filtersHaveBeenReset: "フィルターがリセットされました。",
+    resetFilters: "フィルターのリセット",
+    searchBar: "検索バー",
+    undo: "元に戻す"
+  },
+  "pt-BR": {
+    clearFilters: "Limpar filtros",
+    filtersHaveBeenCleared: "Os filtros foram apagados.",
+    filtersHaveBeenReset: "Os filtros foram limpos.",
+    resetFilters: "Redefinir filtros",
+    searchBar: "Barra de busca",
+    undo: "Desfazer"
+  }
+}, Xa = {
+  key: 0,
+  class: "b-filter-bar__search-external-container"
+}, xa = { key: 0 }, eo = {
+  i18n: { messages: zt },
+  name: "bento-filter-bar",
+  components: {
+    BentoBooleanFilter: Kt,
+    BentoCheckboxGroupFilter: Yt,
+    BentoDateFilter: Ut,
+    BentoDateRangeFilter: Et,
+    BentoInputFilter: Ot,
+    BentoInputWithDropdownFilter: Pt,
+    BentoRadioGroupFilter: Lt,
+    BentoRangeFilter: Jt,
+    BentoSelectAvatarFilter: Vt,
+    BentoSelectCountryFilter: Nt,
+    BentoSelectCurrencyFilter: wt,
+    BentoSelectFilter: Te,
+    BentoSelectPaymentMethodFilter: jt,
+    BentoSelectTagFilter: Mt,
+    BentoTeleport: yt,
+    BentoToggleFilter: Gt,
+    FixedScroller: vt
+  }
+}, to = /* @__PURE__ */ Q({
+  ...eo,
+  props: {
+    config: { default: () => [] },
+    filterValues: { default: () => [] },
+    containerSizeLayout: { default: () => ({
+      medium: "one-line",
+      small: "multi-line"
+    }) },
+    search: { default: void 0 },
+    searchTerm: { default: void 0 },
+    showAppliedHiddenFilters: { type: Boolean, default: !1 },
+    value: { default: () => [] },
+    filterValuesObject: { default: void 0 }
+  },
+  emits: [
+    De.INPUT,
+    De.UPDATE_FILTER_VALUES_OBJECT,
+    De.UPDATE_FILTER_VALUES_ARRAY,
+    Ie.CLEAR,
+    Ie.INPUT,
+    Ie.UPDATE
+  ],
+  setup(e, { expose: n, emit: t }) {
+    const i = e, l = t, { t: o } = ve({ messages: zt }), u = j(null), a = c(
+      () => {
+        var T, h;
+        return (h = ((T = i.config) == null ? void 0 : T.length) > 0 ? i.config : i.value) == null ? void 0 : h.map((b) => {
+          var K;
+          let w = (K = i.filterValues.find(({ field: p }) => p === b.field)) == null ? void 0 : K.value;
+          return i.filterValuesObject && b.field in i.filterValuesObject && (w = i.filterValuesObject[b.field]), w === void 0 && (w = (b == null ? void 0 : b.value) === void 0 && (b == null ? void 0 : b.defaultValue) !== void 0 ? b == null ? void 0 : b.defaultValue : b == null ? void 0 : b.value), { ...b, value: w !== void 0 ? w : b == null ? void 0 : b.value };
+        });
+      }
+    ), { addToast: r } = xt(), { screenLayoutComponent: f, showSearchbarInsideContainer: d, isOneLineLayout: S } = El(
+      u,
+      ee(i, "containerSizeLayout")
+    ), O = c(() => ({
+      "b-filter-bar__fixed-scroller": S.value,
+      "b-filter-bar__container": !S.value
+      // Multi-line
+    })), s = c(() => ({
+      "b-filter-bar__scroller-content": S.value,
+      "b-filter-bar__filters": !S.value
+      // Multi-line
+    })), m = c(() => {
+      var T;
+      return ((T = i.search) == null ? void 0 : T.inputFieldAriaLabel) || o("searchBar");
+    }), y = c(() => {
+      if (!i.search)
+        return;
+      const { debounceTime: T, disabled: h, inputFieldAriaLabel: b, hint: w, placeholder: K } = i.search;
+      return { debounceTime: T, disabled: h, inputFieldAriaLabel: b, hint: w, placeholder: K };
+    }), I = c(() => a.value.some(
+      ({ visible: h }) => h != null
+    ) ? a.value.some(({ visible: h }) => !h) : !1), E = c(
+      () => a.value.filter(({ defaultValue: T }) => T !== void 0)
+    ), P = c(() => a.value.some(
+      ({ visible: h }) => h != null
+    ) ? a.value.filter(
+      ({ defaultValue: h, visible: b, value: w }) => (
+        // eslint-disable-next-line eqeqeq
+        h === void 0 && b || i.showAppliedHiddenFilters && w != null
+      )
+    ) : a.value.filter(
+      ({ defaultValue: h, value: b }) => (
+        // eslint-disable-next-line eqeqeq
+        h === void 0 || i.showAppliedHiddenFilters && b != null
+      )
+    )), _ = c(() => i.searchTerm != null), M = c(
+      () => a.value.filter(({ defaultValue: T }) => T == null).some(({ value: T }) => T != null)
+    ), B = c(() => E.value.length === 0 && M.value), N = c(() => E.value.length === 0 ? !1 : !a.value.filter(({ defaultValue: h }) => h !== void 0 || h !== null).every(({ value: h, defaultValue: b }) => JSON.stringify(h) === JSON.stringify(b)) || M.value), H = (T) => {
+      l(De.INPUT, T), l(
+        De.UPDATE_FILTER_VALUES_ARRAY,
+        T == null ? void 0 : T.filter(({ value: h }) => h !== null || h !== void 0).map(({ field: h, value: b }) => ({ field: h, value: b }))
+      ), l(
+        De.UPDATE_FILTER_VALUES_OBJECT,
+        T == null ? void 0 : T.filter(({ value: h }) => h !== null || h !== void 0).reduce((h, b) => (h[b.field] = b.value, h), {})
+      );
+    }, U = (T) => {
+      const h = a.value.findIndex(
+        (w) => w.field === T.field
+      ), b = a.value.slice();
+      b[h].value = T.value, H(b);
+    }, A = () => {
+      const T = a.value.slice(), h = a.value.map(({ value: b, ...w }) => ({
+        ...w,
+        value: void 0
+      }));
+      r({
+        text: o("filtersHaveBeenCleared"),
+        action: {
+          handler: () => H(T),
+          text: o("undo")
+        }
+      }), H(h);
+    }, J = () => {
+      const T = a.value.slice(), h = a.value.map(({ defaultValue: b, ...w }) => ({
+        ...w,
+        defaultValue: b,
+        value: b
+      }));
+      r({
+        text: o("filtersHaveBeenReset"),
+        action: {
+          handler: () => H(T),
+          text: o("undo")
+        }
+      }), H(h);
+    }, z = (T) => {
+      l(Ie.INPUT, T), l(Ie.UPDATE, T);
+    }, ae = () => {
+      l(Ie.CLEAR);
+    };
+    return n({ isClearAllVisible: B, clearAllFilters: A, isResetAllVisible: N, resetAllFilters: J }), (T, h) => (F(), W("div", {
+      ref_key: "filterBarRef",
+      ref: u,
+      class: "b-filter-bar"
+    }, [
+      !v(d) && _.value ? (F(), W("div", Xa, [
+        L(Ne, se({ class: "b-filter-bar__search-bar" }, y.value, {
+          "input-field-aria-label": m.value,
+          value: T.searchTerm,
+          condensed: "",
+          onInput: z,
+          onClear: ae
+        }), null, 16, ["input-field-aria-label", "value"])
+      ])) : Z("", !0),
+      (F(), R(ke(v(f)), {
+        class: de(O.value),
+        condensed: ""
+      }, {
+        default: D(() => [
+          Y("div", {
+            class: de(s.value)
+          }, [
+            v(d) && _.value ? (F(), W("div", xa, [
+              L(Ne, se({ class: "b-filter-bar__search-bar" }, y.value, {
+                "input-field-aria-label": m.value,
+                value: T.searchTerm,
+                condensed: "",
+                onInput: z,
+                onClear: ae
+              }), null, 16, ["input-field-aria-label", "value"])
+            ])) : Z("", !0),
+            E.value.length ? (F(!0), W(Ue, { key: 1 }, Be(E.value, (b) => (F(), R(ke(b.type), {
+              key: b.field,
+              field: b.field,
+              label: b.label,
+              disabled: b == null ? void 0 : b.disabled,
+              options: b.options,
+              value: b.value,
+              "default-value": b.defaultValue,
+              onUpdate: U
+            }, null, 40, ["field", "label", "disabled", "options", "value", "default-value"]))), 128)) : Z("", !0),
+            (F(!0), W(Ue, null, Be(P.value, (b) => (F(), R(ke(b.type), {
+              key: b.field,
+              field: b.field,
+              label: b.label,
+              disabled: b == null ? void 0 : b.disabled,
+              options: b.options,
+              value: b.value,
+              onUpdate: U
+            }, null, 40, ["field", "label", "disabled", "options", "value"]))), 128)),
+            I.value ? (F(), R(Qa, {
+              key: 2,
+              class: "b-filter-bar__all-filters-modal",
+              value: a.value,
+              onInput: H
+            }, null, 8, ["value"])) : Z("", !0),
+            B.value ? (F(), R(v(Ae), {
+              key: 3,
+              class: "b-filter-bar__clear-all",
+              onClick: A
+            }, {
+              iconLeft: D(() => [
+                L(v(lt), { "aria-hidden": "true" })
+              ]),
+              default: D(() => [
+                X(x(v(o)("clearFilters")) + " ", 1)
+              ]),
+              _: 1
+            })) : Z("", !0),
+            N.value ? (F(), R(v(Ae), {
+              key: 4,
+              class: "b-filter-bar__reset-all",
+              onClick: J
+            }, {
+              iconLeft: D(() => [
+                L(v(lt), { "aria-hidden": "true" })
+              ]),
+              default: D(() => [
+                X(x(v(o)("resetFilters")) + " ", 1)
+              ]),
+              _: 1
+            })) : Z("", !0)
+          ], 2)
+        ]),
+        _: 1
+      }, 8, ["class"]))
+    ], 512));
+  }
+}), Mo = /* @__PURE__ */ le(to, [["__scopeId", "data-v-ae476a4a"]]);
+export {
+  Mo as B,
+  Se as a,
+  $ as b,
+  De as c,
+  ne as d,
+  It as u
+};
+//# sourceMappingURL=filter-bar.D0BEt7ia.js.map