@adyen/bento-vue3 1.50.0 → 1.52.0

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

@@ -0,0 +1,2754 @@
+import { defineComponent as Y, useSlots as Ee, useAttrs as $t, computed as c, ref as N, createBlock as E, openBlock as y, unref as A, normalizeClass as ye, withCtx as F, createElementVNode as H, renderSlot as re, createCommentVNode as x, createVNode as $, createTextVNode as q, toDisplayString as J, watch as ue, nextTick as ot, resolveComponent as P, createElementBlock as z, withKeys as pe, toRef as G, onBeforeUpdate as Oe, provide as st, mergeProps as oe, Fragment as De, reactive as it, createSlots as Ae, renderList as be, normalizeProps as $e, guardReactiveProps as Pe, onMounted as rt, resolveDynamicComponent as Le, withDirectives as qe, vShow as Je } from "vue";
+import { B as ke, b as ge } from "./search-bar.DlihXfPt.js";
+import { u as Pt } from "./use-bento-toast-controller.D3LA1FCd.js";
+import { u as de } from "./i18n.D9azDLPe.js";
+import { _ as Ut } from "./modal.vue_vue_type_script_setup_true_lang.BAuxqA66.js";
+import { g as Et } from "./base-modal.BlC6TZNz.js";
+import { B as Ot } from "./button.6HMG0xEY.js";
+import { B as Ye, I as wt, b as Rt } from "./popover.COzLcAET.js";
+import { B as Lt } from "./directive.O3yEdalv.js";
+import { B as Vt } from "./events.FNmSWp_P.js";
+import { g as Ne } from "./generate-uid.NJ8tVoha.js";
+import { B as kt, u as Nt } from "./teleport.B1NhF5-O.js";
+import { B as ce, d as Me } from "./typography.DN5eC5ch.js";
+import { u as ut } from "./aria-label.CaUURpnB.js";
+import { B as dt, a as ze } from "./base-button.DdNFlbgH.js";
+import { g as ct } from "./get-slot-text.DQlZEsId.js";
+import { u as pt } from "./use-has-slot.B7eQSabc.js";
+import { _ as Z } from "./_plugin-vue_export-helper.CHgC5LLL.js";
+import { B as Mt } from "./radio-group.rxg-4rF_.js";
+import { t as Se } from "./chip.3T0x6FuI.js";
+import { B as He } from "./input-field.DqMdqM2u.js";
+import { u as bt, B as Ht } from "./dropdown.qw5oXFYs.js";
+import { g as Kt } from "./focus-trap.DMgm-9f7.js";
+import { a as jt, C as qt } from "./chevron-up.-0oLlHmh.js";
+/* empty css              */
+import { B as Ke } from "./divider.qUOSAbU6.js";
+import { c as We, b as Jt } from "./use-cached-selected-values.DDP7LJoI.js";
+import { L as ft } from "./listbox-option-tag.YSvtcy4P.js";
+import { B as Yt } from "./payment-method.CLUppDo_.js";
+import { u as zt } from "./use-country-items.BMhCqIWd.js";
+import { B as Wt } from "./avatar.B0-9jC6H.js";
+import { D as Gt, B as Zt, i as Re, b as Qt } from "./date-range-picker.1Vbf9Zk8.js";
+import { g as vt } from "./get-date-locale.BN8xEjY0.js";
+import { D as Ge } from "./date-input.BqBdAO1E.js";
+import { a as Xt, i as xt } from "./calendar.D2X834TU.js";
+import { f as me } from "./date.DoJuTLhO.js";
+import { B as el } from "./button-actions.BvGAE7sw.js";
+import { B as tl } from "./date-picker.BWJYkSmo.js";
+import { R as Ze } from "./refresh.C20ROVDS.js";
+import { F as ll } from "./fixed-scroller.Bfk75Nei.js";
+import "../assets/filter-bar.css";
+var h = /* @__PURE__ */ ((e) => (e.INPUT = "input", e.UPDATE = "update", e))(h || {}), Ce = /* @__PURE__ */ ((e) => (e.INPUT = "input", e.UPDATE_FILTER_VALUES = "update:filter-values", e))(Ce || {}), ae = /* @__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))(ae || {});
+const al = { class: "b-filter-bar-button__container" }, nl = { class: "b-filter-bar-button__label-container" }, ol = {}, sl = /* @__PURE__ */ Y({
+  ...ol,
+  __name: "filter-bar-button",
+  props: {
+    /**
+     * 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 },
+    /**
+     * 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 = Ee(), a = $t(), o = pt(l), r = c(() => l.default ? ct(l)("default") : null), d = ut({ ariaLabel: r }), p = N(null), b = c(() => {
+      var u;
+      return {
+        "aria-controls": (u = a["aria-controls"]) == null ? void 0 : u.toString()
+      };
+    }), B = c(() => ({
+      "b-filter-bar-button--attention": t.appliedFiltersCount || t.secondaryLabel || t.isPersistentFilter,
+      "b-filter-bar-button--filter-open": t.isFilterOpen,
+      "b-filter-bar-button--with-secondary-label": t.secondaryLabel,
+      "b-filter-bar-button--with-counter": t.appliedFiltersCount
+    })), C = (u) => {
+      u.preventDefault(), t.disabled || i("click", u);
+    };
+    return (u, D) => (y(), E(A(dt), {
+      ref_key: "filterBarButtonRef",
+      ref: p,
+      class: ye(["b-filter-bar-button", B.value]),
+      disabled: e.disabled,
+      "aria-label": A(d),
+      "aria-controls": b.value["aria-controls"],
+      type: "button",
+      onClick: C
+    }, {
+      iconRight: F(() => [
+        e.appliedFiltersCount ? (y(), E(A(ce), {
+          key: 0,
+          class: "b-filter-bar-button__counter",
+          el: "span",
+          variant: "body",
+          stronger: ""
+        }, {
+          default: F(() => [
+            q(J(e.appliedFiltersCount), 1)
+          ]),
+          _: 1
+        })) : x("", !0)
+      ]),
+      default: F(() => [
+        H("div", al, [
+          A(o)("iconLeft") ? re(u.$slots, "iconLeft", { key: 0 }, void 0, !0) : x("", !0),
+          H("div", nl, [
+            $(A(ce), {
+              el: "span",
+              variant: "body",
+              stronger: "",
+              class: "b-filter-bar-button__label"
+            }, {
+              default: F(() => [
+                H("span", null, [
+                  re(u.$slots, "default", {}, void 0, !0)
+                ]),
+                e.secondaryLabel ? (y(), E(A(ce), {
+                  key: 0,
+                  el: "span",
+                  variant: "body",
+                  stronger: "",
+                  class: "b-filter-bar-button__label"
+                }, {
+                  default: F(() => D[0] || (D[0] = [
+                    q(":")
+                  ])),
+                  _: 1
+                })) : x("", !0)
+              ]),
+              _: 3
+            }),
+            e.secondaryLabel ? (y(), E(A(ce), {
+              key: 0,
+              el: "span",
+              variant: "body",
+              stronger: "",
+              class: "b-filter-bar-button__secondary-label"
+            }, {
+              default: F(() => [
+                q(J(e.secondaryLabel), 1)
+              ]),
+              _: 1
+            })) : x("", !0)
+          ])
+        ])
+      ]),
+      _: 3
+    }, 8, ["class", "disabled", "aria-label", "aria-controls"]));
+  }
+}), Ue = /* @__PURE__ */ Z(sl, [["__scopeId", "data-v-fc0dbb83"]]);
+var ne = /* @__PURE__ */ ((e) => (e.APPLY = "apply", e.CLEAR = "clear", e.OPEN = "open", e.CLOSE = "close", e.RESET = "reset", e))(ne || {});
+const Qe = {
+  "en-US": {
+    apply: "Apply",
+    clear: "Clear",
+    filterButton: "Filter by {function}",
+    reset: "Reset"
+  },
+  "ja-JP": {
+    apply: "適用",
+    clear: "クリア",
+    reset: "リセット"
+  },
+  "pt-BR": {
+    apply: "Aplicar",
+    clear: "Limpar",
+    reset: "Reiniciar"
+  }
+}, il = Y({
+  i18n: { messages: Qe },
+  name: "bento-base-filter",
+  components: {
+    BentoPopover: Ye,
+    BentoTeleport: kt,
+    FilterBarButton: Ue
+  },
+  directives: { BentoClickOutsideDirective: Lt },
+  props: {
+    /**
+     * Total count of applied filters
+     */
+    appliedFiltersCount: { type: [String, Number], default: null },
+    /**
+     * Overrides the label of the popover visibility toggle button text.
+     */
+    buttonLabel: { type: String, default: void 0 },
+    /**
+     * Sets the secondary label text of the popover visibility toggle button text.
+     */
+    buttonSecondaryLabel: { type: String, default: void 0 },
+    /**
+     * Disables the filter from being interacted with.
+     */
+    disabled: { type: Boolean, default: !1 },
+    /**
+     * Default value of the filter to reset to.
+     */
+    defaultValue: {
+      type: [Object, Number, Boolean, Array, String, Date],
+      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 },
+    /**
+     * Allows to handle the controls (apply/clear) from outside
+     * of the component
+     */
+    controlled: { type: Boolean, default: !1 },
+    /**
+     * Disable the "apply" button
+     */
+    disableApplyButton: { type: Boolean, default: !1 },
+    /**
+     * Disable the secondary button action.
+     */
+    disableSecondaryButton: { type: Boolean, default: !1 },
+    /**
+     * 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 },
+    /**
+     * Sets the size of the container to fit its content
+     */
+    fitContent: Ye.props.fitContent
+  },
+  emits: [
+    ne.APPLY,
+    ne.CLEAR,
+    ne.OPEN,
+    ne.CLOSE,
+    ne.RESET
+  ],
+  setup(e, { emit: n }) {
+    const { t } = de({ messages: Qe }), i = Ne("base-filter-popover"), l = N(!1), a = N(null), o = N(null), r = c(() => e.defaultValue !== null), d = c(
+      () => r.value ? t("filterButton", {
+        function: e.label
+      }) : p.value
+    ), p = c(() => e.buttonLabel || e.label), b = () => {
+      l.value && (l.value = !1, ot(() => {
+        var O, I;
+        (I = (O = a.value) == null ? void 0 : O.$el) == null || I.focus();
+      }), n(ne.CLOSE));
+    }, B = () => {
+      b(), r.value ? n(ne.RESET) : n(ne.CLEAR);
+    }, C = () => b(), u = () => {
+      l.value ? b() : (l.value = !0, n(ne.OPEN));
+    }, D = () => {
+      b(), n(ne.APPLY);
+    }, L = c(() => [
+      {
+        title: t("apply"),
+        event: D,
+        disabled: e.disableApplyButton
+      },
+      {
+        title: r.value ? t("reset") : t("clear"),
+        event: B,
+        disabled: e.disableSecondaryButton
+      }
+    ]);
+    return ue(
+      () => l.value,
+      (O, I) => {
+        var w, T;
+        !O && I && (T = (w = a.value) == null ? void 0 : w.filterBarButtonRef) != null && T.bentoBaseButtonRef && a.value.filterBarButtonRef.bentoBaseButtonRef.focus();
+      }
+    ), Nt(o, C, { ignore: [a] }), {
+      // Values
+      actions: L,
+      popoverId: i,
+      isFilterOpen: l,
+      isPersistentFilter: r,
+      computedAriaLabel: d,
+      computedButtonText: p,
+      // Enums
+      BentoTooltipPosition: Vt,
+      // Events
+      onClickFilter: u,
+      onClickApply: D,
+      onClickSecondaryAction: B,
+      onClickOutside: C,
+      closePopover: b,
+      // Refs
+      filterButtonRef: a,
+      popoverRef: o
+    };
+  }
+}), rl = { key: 0 }, ul = {
+  key: 1,
+  class: "b-base-filter"
+};
+function dl(e, n, t, i, l, a) {
+  const o = P("filter-bar-button"), r = P("bento-popover"), d = P("bento-teleport");
+  return e.onlySlot ? (y(), z("div", rl, [
+    re(e.$slots, "default", {}, void 0, !0)
+  ])) : (y(), z("div", ul, [
+    $(o, {
+      ref: "filterButtonRef",
+      "aria-label": e.computedAriaLabel,
+      "aria-controls": e.isFilterOpen ? e.popoverId : null,
+      "applied-filters-count": e.appliedFiltersCount,
+      disabled: e.disabled,
+      "is-persistent-filter": e.isPersistentFilter,
+      "is-filter-open": e.isFilterOpen,
+      "secondary-label": e.buttonSecondaryLabel,
+      onClick: e.onClickFilter,
+      onKeydown: pe(e.closePopover, ["esc"])
+    }, {
+      default: F(() => [
+        q(J(e.computedButtonText), 1)
+      ]),
+      _: 1
+    }, 8, ["aria-label", "aria-controls", "applied-filters-count", "disabled", "is-persistent-filter", "is-filter-open", "secondary-label", "onClick", "onKeydown"]),
+    e.filterButtonRef ? (y(), E(d, { key: 0 }, {
+      default: F(() => [
+        e.filterButtonRef ? (y(), E(r, {
+          key: 0,
+          id: e.popoverId,
+          ref: "popoverRef",
+          class: "b-base-filter__popover",
+          divider: "",
+          open: e.isFilterOpen,
+          actions: e.controlled ? null : e.actions,
+          "actions-layout": "space-between",
+          "target-element": e.filterButtonRef,
+          title: e.controlled ? null : e.label,
+          "fit-content": e.fitContent,
+          position: "bottom-start",
+          "without-space": e.controlled,
+          "fallback-position": ["bottom-end"]
+        }, {
+          default: F(() => [
+            H("div", {
+              onKeydown: n[0] || (n[0] = pe((...p) => e.closePopover && e.closePopover(...p), ["esc"]))
+            }, [
+              re(e.$slots, "default", {}, void 0, !0)
+            ], 32)
+          ]),
+          _: 3
+        }, 8, ["id", "open", "actions", "target-element", "title", "fit-content", "without-space"])) : x("", !0)
+      ]),
+      _: 3
+    })) : x("", !0)
+  ]));
+}
+const Fe = /* @__PURE__ */ Z(il, [["render", dl], ["__scopeId", "data-v-5245899a"]]), cl = (e) => e instanceof Array, Xe = (e) => cl(e) ? e.length === 0 || e.every((n) => n === "") : !e, xe = (e, n) => JSON.stringify(e) === JSON.stringify(n), fe = (e, n) => {
+  const t = N(e.value);
+  ue(
+    () => e.value,
+    () => {
+      t.value = e.value;
+    }
+  );
+  const i = c(() => Xe(e.value)), l = c(
+    () => n.value !== null ? xe(n.value, e.value) : i.value
+  ), a = c(() => xe(t.value, e.value) || Xe(t.value) && i.value);
+  return {
+    internalFilterValue: t,
+    isSecondaryButtonDisabled: l,
+    isApplyButtonDisabled: a
+  };
+}, pl = {
+  name: "bento-input-filter"
+}, bl = /* @__PURE__ */ Y({
+  ...pl,
+  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 f, S;
+    const t = e, i = n, l = N(null), a = N((S = (f = t == null ? void 0 : t.options) == null ? void 0 : f.dropdown) == null ? void 0 : S.value), o = c(
+      () => {
+        var s, R;
+        return ((s = t == null ? void 0 : t.options) == null ? void 0 : s.variant) === "dropdown" && ((R = t == null ? void 0 : t.options) == null ? void 0 : R.dropdown) !== void 0;
+      }
+    ), r = c(
+      () => {
+        var s;
+        return o.value ? { ...(s = t == null ? void 0 : t.options) == null ? void 0 : s.dropdown, value: a.value } : void 0;
+      }
+    ), d = c(() => {
+      var s;
+      return ((s = t == null ? void 0 : t.options) == null ? void 0 : s.variant) === "dropdown" ? "dropdown" : "default";
+    }), p = c(
+      () => {
+        var s;
+        return o.value ? (s = t.value) == null ? void 0 : s.inputValue : t == null ? void 0 : t.value;
+      }
+    ), { internalFilterValue: b, isSecondaryButtonDisabled: B, isApplyButtonDisabled: C } = fe(
+      p,
+      G(t, "defaultValue")
+    ), u = c(() => t.label), D = c(() => Se(p.value, 12)), L = c(() => ({
+      "b-input-filter--only-slot": t.onlySlot
+    }));
+    Oe(() => {
+      b.value === "" && (b.value = null);
+    }), ue(l, () => {
+      var s;
+      (s = l.value) == null || s.focusInput();
+    });
+    const O = () => {
+      b.value = p.value;
+    }, I = () => {
+      !b.value && t.defaultValue !== null && (b.value = t.defaultValue), i("update", {
+        ...t,
+        value: o.value ? {
+          inputValue: b.value,
+          dropdownValue: a.value
+        } : b.value
+      });
+    }, w = () => i("update", { ...t, value: t.defaultValue }), T = () => {
+      b.value = null, I();
+    }, _ = () => {
+      i("input", { ...t, value: b.value });
+    }, V = (s) => {
+      b.value = s;
+    }, k = (s) => {
+      a.value = s;
+    };
+    return st(wt, o.value), ue(
+      () => t.options,
+      () => {
+        var s, R, K;
+        ((s = t.options) != null && s.dropdown || (R = t.options) != null && R.dropdownPosition || (K = t.options) != null && K.variant) && Me(
+          '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 }
+    ), (s, R) => (y(), E(A(Fe), oe(s.$props, {
+      "button-label": u.value,
+      "button-secondary-label": D.value,
+      "disable-apply-button": A(C),
+      "disable-secondary-button": A(B),
+      "only-slot": s.onlySlot,
+      "popover-overflow-visible": o.value,
+      onApply: I,
+      onClear: T,
+      onOpen: O,
+      onReset: w
+    }), {
+      default: F(() => {
+        var K, le;
+        return [
+          H("div", {
+            class: ye(["b-input-filter", L.value]),
+            onKeydown: pe(I, ["enter"]),
+            onInput: _
+          }, [
+            $(A(He), {
+              ref_key: "inputTextRef",
+              ref: l,
+              dropdown: r.value,
+              "dropdown-position": (K = s.options) == null ? void 0 : K.dropdownPosition,
+              placeholder: (le = s.options) == null ? void 0 : le.placeholder,
+              variant: d.value,
+              value: A(b),
+              onInput: V,
+              onDropdownInput: k
+            }, null, 8, ["dropdown", "dropdown-position", "placeholder", "variant", "value"])
+          ], 34)
+        ];
+      }),
+      _: 1
+    }, 16, ["button-label", "button-secondary-label", "disable-apply-button", "disable-secondary-button", "only-slot", "popover-overflow-visible"]));
+  }
+}), mt = /* @__PURE__ */ Z(bl, [["__scopeId", "data-v-3323f252"]]), fl = {
+  name: "bento-input-with-dropdown-filter"
+}, vl = /* @__PURE__ */ Y({
+  ...fl,
+  props: {
+    disabled: { type: Boolean },
+    defaultValue: { default: void 0 },
+    field: {},
+    label: {},
+    onlySlot: { type: Boolean, default: !1 },
+    options: { default: void 0 },
+    value: { default: void 0 }
+  },
+  emits: [h.INPUT, h.UPDATE],
+  setup(e, { emit: n }) {
+    const t = e, i = n, l = N(null), { internalFilterValue: a, isSecondaryButtonDisabled: o, isApplyButtonDisabled: r } = fe(G(t, "value"), G(t, "defaultValue")), d = c(() => t.label), p = c(() => {
+      var _;
+      return Se((_ = t.value) == null ? void 0 : _.inputValue, 12);
+    }), b = c(() => {
+      var _, V;
+      return {
+        ...((_ = t.options) == null ? void 0 : _.dropdown) || {},
+        value: (V = a.value) == null ? void 0 : V.dropdownValue
+      };
+    }), B = c(() => ({
+      "b-input-with-dropdown-filter--only-slot": t.onlySlot
+    })), C = c(() => {
+      var V, k;
+      return !(!!((V = a.value) != null && V.inputValue) && !!((k = a.value) != null && k.dropdownValue)) || r.value;
+    });
+    Oe(() => {
+      var _;
+      ((_ = a.value) == null ? void 0 : _.inputValue) === "" && (a.value = { ...a.value, inputValue: void 0 });
+    }), ue(l, () => {
+      var _;
+      (_ = l.value) == null || _.focusInput();
+    });
+    const u = () => {
+      a.value = t.value;
+    }, D = () => {
+      var _;
+      !((_ = a.value) != null && _.inputValue) && t.defaultValue !== null && (a.value = { ...t.defaultValue }), i(h.UPDATE, {
+        ...t,
+        value: a.value
+      });
+    }, L = () => i(h.UPDATE, { ...t, value: t.defaultValue }), O = () => {
+      a.value = null, D();
+    }, I = () => {
+      i(h.INPUT, { ...t, value: a.value });
+    }, w = (_) => {
+      a.value = { ...a.value, inputValue: _ };
+    }, T = (_) => {
+      a.value = { ...a.value, dropdownValue: _ };
+    };
+    return st(Rt, !0), (_, V) => (y(), E(A(Fe), oe(_.$props, {
+      "button-label": d.value,
+      "button-secondary-label": p.value,
+      "disable-apply-button": C.value,
+      "disable-secondary-button": A(o),
+      "only-slot": _.onlySlot,
+      onApply: D,
+      onClear: O,
+      onOpen: u,
+      onReset: L
+    }), {
+      default: F(() => {
+        var k, f;
+        return [
+          H("div", {
+            class: ye(["b-input-with-dropdown-filter", B.value]),
+            onKeydown: pe(D, ["enter"]),
+            onInput: I
+          }, [
+            $(A(He), {
+              ref_key: "inputTextRef",
+              ref: l,
+              dropdown: b.value,
+              "dropdown-position": (k = _.options) == null ? void 0 : k.dropdownPosition,
+              variant: "dropdown",
+              value: (f = A(a)) == null ? void 0 : f.inputValue,
+              onInput: w,
+              onDropdownInput: T
+            }, null, 8, ["dropdown", "dropdown-position", "value"])
+          ], 34)
+        ];
+      }),
+      _: 1
+    }, 16, ["button-label", "button-secondary-label", "disable-apply-button", "disable-secondary-button", "only-slot"]));
+  }
+}), ml = /* @__PURE__ */ Z(vl, [["__scopeId", "data-v-f096c58d"]]), yl = Y({
+  name: "bento-date-filter",
+  components: {
+    BentoBaseFilter: Fe,
+    BentoDatePicker: tl,
+    BentoDivider: Ke,
+    Calendar: Xt
+  },
+  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
+     */
+    options: {
+      type: Object,
+      default: void 0
+    },
+    /**
+     * Current value of the filter
+     */
+    value: { type: Date, default: void 0 }
+  },
+  emits: [h.INPUT, h.UPDATE],
+  setup(e, { emit: n }) {
+    const { locale: t } = de(void 0, !0), i = vt(), { internalFilterValue: l, isSecondaryButtonDisabled: a, isApplyButtonDisabled: o } = fe(
+      G(e, "value"),
+      G(e, "defaultValue")
+    ), r = c(
+      () => e.value ? me(e.value, "dd MMM, yyyy", {
+        locale: i[t.value.substring(0, 2)] || i.enUS
+      }) : null
+    ), d = c(() => e.label), p = c(() => r.value), b = () => {
+      n(h.UPDATE, { ...e, value: l.value });
+    }, B = () => {
+      l.value = null, b();
+    }, C = () => {
+      l.value = e.defaultValue, b();
+    }, u = () => {
+      l.value = e.value;
+    }, D = (O) => {
+      l.value = O, n(h.INPUT, { ...e, value: l.value });
+    };
+    return {
+      // Values
+      internalFilterValue: l,
+      isApplyButtonDisabled: o,
+      isSecondaryButtonDisabled: a,
+      buttonLabel: d,
+      buttonSecondaryLabel: p,
+      // Events
+      clearFilter: B,
+      onDateSelected: D,
+      openFilter: u,
+      updateFilter: b,
+      resetFilter: C,
+      onDateInputSelected: (O) => {
+        l.value = O, D(O), b();
+      }
+    };
+  }
+}), Fl = { class: "b-date-filter" };
+function hl(e, n, t, i, l, a) {
+  const o = P("bento-date-picker"), r = P("bento-divider"), d = P("calendar"), p = P("bento-base-filter");
+  return y(), E(p, {
+    "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,
+    "fit-content": "",
+    onApply: e.updateFilter,
+    onClear: e.clearFilter,
+    onOpen: e.openFilter,
+    onReset: e.resetFilter
+  }, {
+    default: F(() => {
+      var b, B, C, u;
+      return [
+        e.onlySlot ? (y(), E(o, {
+          key: 0,
+          value: e.internalFilterValue,
+          "first-day-of-week": (b = e.options) == null ? void 0 : b.firstDayOfWeek,
+          "is-date-disabled": (B = e.options) == null ? void 0 : B.isDateDisabled,
+          onInput: e.onDateInputSelected
+        }, null, 8, ["value", "first-day-of-week", "is-date-disabled", "onInput"])) : (y(), z(De, { key: 1 }, [
+          $(r, { class: "b-date-filter__divider" }),
+          H("div", Fl, [
+            $(d, {
+              "first-day-of-week": (C = e.options) == null ? void 0 : C.firstDayOfWeek,
+              "is-date-disabled": (u = e.options) == null ? void 0 : u.isDateDisabled,
+              "number-of-months": 1,
+              value: e.internalFilterValue,
+              onInput: e.onDateSelected
+            }, null, 8, ["first-day-of-week", "is-date-disabled", "value", "onInput"])
+          ])
+        ], 64))
+      ];
+    }),
+    _: 1
+  }, 8, ["button-label", "button-secondary-label", "disabled", "default-value", "disable-apply-button", "disable-secondary-button", "field", "label", "only-slot", "onApply", "onClear", "onOpen", "onReset"]);
+}
+const yt = /* @__PURE__ */ Z(yl, [["render", hl], ["__scopeId", "data-v-389ccc27"]]), et = {
+  "en-US": {
+    apply: "Apply",
+    clear: "Clear",
+    reset: "Reset"
+  },
+  "ja-JP": {
+    apply: "適用",
+    clear: "クリア",
+    reset: "リセット"
+  },
+  "pt-BR": {
+    apply: "Aplicar",
+    clear: "Limpar",
+    reset: "Reiniciar"
+  }
+}, gl = Y({
+  i18n: { messages: et },
+  name: "bento-date-range-filter",
+  components: {
+    BentoBaseFilter: Fe,
+    BentoButtonActions: el,
+    BentoDateRangePicker: Zt,
+    BentoTypography: ce,
+    BentoDivider: Ke,
+    DateRangePickerCalendar: Gt
+  },
+  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.
+     */
+    options: {
+      type: Object,
+      default: void 0
+    },
+    /**
+     * Current value of the filter
+     */
+    value: {
+      type: Object,
+      default: () => ({ startDate: void 0, endDate: void 0 })
+    }
+  },
+  emits: [h.INPUT, h.UPDATE],
+  setup(e, { emit: n }) {
+    var K, le, se, ee;
+    const { locale: t, t: i } = de({ messages: et }), l = vt(), { internalFilterValue: a, isSecondaryButtonDisabled: o, isApplyButtonDisabled: r } = fe(
+      G(e, "value"),
+      G(e, "defaultValue")
+    ), d = N(!1), p = (g) => g ? me(g, Ge.NUMERIC_DATE_YEAR_FIRST, {
+      locale: l[t.value.substring(0, 2)] || l.enUS
+    }) : void 0, b = (g) => g ? me(g, Ge.HOUR_MINUTE_SECONDS, {
+      locale: l[t.value.substring(0, 2)] || l.enUS
+    }) : "", B = N(null), C = N(!1), u = it({
+      startDate: p((K = e.value) == null ? void 0 : K.startDate),
+      endDate: p((le = e.value) == null ? void 0 : le.endDate),
+      startTime: b((se = e.value) == null ? void 0 : se.startDate),
+      endTime: b((ee = e.value) == null ? void 0 : ee.endDate)
+    });
+    function D(g) {
+      return (g == null ? void 0 : g.length) !== void 0;
+    }
+    const L = c(() => {
+      var g, j, Q, X, v, m, U, M, te;
+      if (!((g = e.value) != null && g.startDate) && !e.value.endDate)
+        return null;
+      if (D((j = e.options) == null ? void 0 : j.quickSelectRanges) && ((X = (Q = e.options) == null ? void 0 : Q.quickSelectRanges) == null ? void 0 : X.length) > 0) {
+        const ie = (m = (v = e.options) == null ? void 0 : v.quickSelectRanges) == null ? void 0 : m.find(({ value: ve, data: W }) => {
+          if (a.value.range)
+            return ve === a.value.range;
+          if (!(W != null && W.endDate))
+            Re(W == null ? void 0 : W.startDate, a.value.startDate) && Qt(a.value.endDate);
+          else
+            return Re(W == null ? void 0 : W.startDate, a.value.startDate) && Re(W == null ? void 0 : W.endDate, a.value.endDate);
+        });
+        if (ie)
+          return ie.label;
+      }
+      return xt((U = e.value) == null ? void 0 : U.startDate, (M = e.value) == null ? void 0 : M.endDate) && ((te = e == null ? void 0 : e.options) != null && te.allowTimeInput) ? `${me(e.value.startDate, "dd MMM, yyyy HH:mm:ss", {
+        locale: l[t.value.substring(0, 2)] || l.enUS
+      })} - ${me(e.value.endDate, "HH:mm:ss", {
+        locale: l[t.value.substring(0, 2)] || l.enUS
+      })}` : `${me(e.value.startDate, "dd MMM, yyyy", {
+        locale: l[t.value.substring(0, 2)] || l.enUS
+      })} - ${me(e.value.endDate, "dd MMM, yyyy", {
+        locale: l[t.value.substring(0, 2)] || l.enUS
+      })}`;
+    }), O = c(() => e.label), I = () => {
+      B.value.closePopover();
+      const { onlySlot: g, ...j } = e;
+      n(h.UPDATE, { ...j, value: a.value });
+    }, w = () => {
+      a.value = void 0, I();
+    }, T = () => {
+      a.value = e.defaultValue, I();
+    }, _ = () => {
+      a.value = e.value;
+    }, V = (g) => {
+      d.value = !1, a.value = g, u.startDate = p(g.startDate), u.endDate = p(g.endDate), n(h.INPUT, { ...e, value: a.value });
+    }, k = (g) => {
+      g != null && g.startDate && (g != null && g.endDate) && (a.value = g, u.startDate = p(g.startDate), u.endDate = p(g.endDate), n(h.INPUT, { ...e, value: a.value }));
+    }, f = (g) => {
+      V(g), n(h.INPUT, { ...e, value: a.value });
+    }, S = c(
+      () => [
+        {
+          title: i("apply"),
+          event: I,
+          disabled: d.value || C.value || r.value
+        },
+        {
+          title: e.defaultValue ? i("reset") : i("clear"),
+          event: e.defaultValue ? T : w,
+          disabled: C.value && o.value
+        }
+      ]
+    );
+    return {
+      // Refs
+      baseFilter: B,
+      // Values
+      actions: S,
+      formData: u,
+      internalFilterValue: a,
+      isApplyButtonDisabled: r,
+      isSecondaryButtonDisabled: o,
+      isSelectingDate: d,
+      buttonLabel: O,
+      buttonSecondaryLabel: L,
+      // Events
+      onDateSelected: V,
+      openFilter: _,
+      updateFilter: I,
+      onDatePickerRangeError: () => {
+        C.value = !0, a.value = { startDate: void 0, endDate: void 0 }, n(h.INPUT, { ...e, value: a.value });
+      },
+      onDatePickerRangeFormDateInputUpdate: (g) => {
+        C.value = !1, g.startTime && (u.startTime = g.startTime), g.endTime && (u.endTime = g.endTime);
+      },
+      onDateInputSelected: f,
+      onRangeSelectorInput: k
+    };
+  }
+}), Sl = {
+  key: 1,
+  class: "b-date-range-filter"
+};
+function Bl(e, n, t, i, l, a) {
+  const o = P("bento-date-range-picker"), r = P("bento-typography"), d = P("bento-divider"), p = P("bento-button-actions"), b = P("date-range-picker-calendar"), B = P("bento-base-filter");
+  return y(), E(B, {
+    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,
+    "fit-content": "",
+    onOpen: e.openFilter
+  }, {
+    default: F(() => {
+      var C, u, D, L, O, I, w, T, _, V, k, f, S, s, R;
+      return [
+        e.onlySlot ? (y(), E(o, {
+          key: 0,
+          "allow-time-input": (C = e.options) == null ? void 0 : C.allowTimeInput,
+          value: e.internalFilterValue,
+          "first-day-of-week": (u = e.options) == null ? void 0 : u.firstDayOfWeek,
+          "is-date-disabled": (D = e.options) == null ? void 0 : D.isDateDisabled,
+          "number-of-months": (L = e.options) == null ? void 0 : L.numberOfMonths,
+          "quick-select-ranges": (O = e.options) == null ? void 0 : O.quickSelectRanges,
+          onInput: e.onDateInputSelected
+        }, null, 8, ["allow-time-input", "value", "first-day-of-week", "is-date-disabled", "number-of-months", "quick-select-ranges", "onInput"])) : (y(), z("div", Sl, [
+          $(b, {
+            "allow-time-input": (I = e.options) == null ? void 0 : I.allowTimeInput,
+            "first-day-of-week": (w = e.options) == null ? void 0 : w.firstDayOfWeek,
+            "is-date-disabled": (T = e.options) == null ? void 0 : T.isDateDisabled,
+            granularities: (_ = e.options) == null ? void 0 : _.granularities,
+            "max-range": (V = e.options) == null ? void 0 : V.maxRange,
+            min: (k = e.options) == null ? void 0 : k.min,
+            max: (f = e.options) == null ? void 0 : f.max,
+            "number-of-months": (S = e.options) == null ? void 0 : S.numberOfMonths,
+            "quick-select-ranges": (s = e.options) == null ? void 0 : s.quickSelectRanges,
+            value: e.internalFilterValue,
+            "date-form-data": e.formData,
+            "show-end-date-on-open": (R = e.options) == null ? void 0 : R.showEndDateOnOpen,
+            onInput: e.onDateSelected,
+            onCustomRange: e.onRangeSelectorInput,
+            onError: e.onDatePickerRangeError,
+            onFormDate: e.onDatePickerRangeFormDateInputUpdate,
+            onStartDateSelected: n[0] || (n[0] = (K) => e.isSelectingDate = !0)
+          }, {
+            title: F(() => [
+              $(r, {
+                strongest: "",
+                variant: "body",
+                el: "span"
+              }, {
+                default: F(() => [
+                  q(J(e.label), 1)
+                ]),
+                _: 1
+              })
+            ]),
+            actions: F(() => [
+              $(d, { class: "b-date-range-filter__divider" }),
+              $(p, {
+                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", "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", "onOpen"]);
+}
+const Ft = /* @__PURE__ */ Z(gl, [["render", Bl], ["__scopeId", "data-v-6d3c49e6"]]), ht = {
+  "en-US": {
+    all: "All",
+    noFiltersMatchThisSearch: "No filters match this search",
+    searchFilter: "Search {filter}"
+  },
+  "ja-JP": {
+    all: "すべて"
+  },
+  "pt-BR": {
+    all: "Todos"
+  }
+}, _l = { class: "b-select-filter-button__search-bar" }, Cl = { class: "b-select-filter-button__divider" }, Dl = {
+  i18n: { messages: ht }
+}, Al = /* @__PURE__ */ Y({
+  ...Dl,
+  __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],
+      default: void 0
+    }
+  },
+  emits: ["input", "update"],
+  setup(e, { emit: n }) {
+    var le, se;
+    const t = Ee(), i = n, l = e, { t: a } = de({ messages: ht }), o = N(""), r = G(l, "options"), d = N(l.options.listboxItems ?? []), { cachedSelectedListboxOptions: p, setCachedValues: b, resetCache: B } = We(
+      d,
+      G(l, "value"),
+      G(r.value, "multiple")
+    ), { cachedSelectedListboxOptions: C } = We(
+      d,
+      G(l, "defaultValue"),
+      G(r.value, "multiple")
+    ), { internalFilterValue: u, isSecondaryButtonDisabled: D, isApplyButtonDisabled: L } = fe(p, C);
+    ue(r, () => {
+      d.value = r.value.listboxItems ?? [];
+    });
+    const O = bt(
+      o,
+      d,
+      (se = (le = l.options) == null ? void 0 : le.search) == null ? void 0 : se.searchEvent
+    ), I = c(() => a("noFiltersMatchThisSearch")), w = c(() => l.label), T = c(() => {
+      var j, Q, X, v;
+      const ee = !((j = l == null ? void 0 : l.options) != null && j.multiple) && (l == null ? void 0 : l.value), g = ((X = ((Q = l == null ? void 0 : l.options) == null ? void 0 : Q.multiple) && l.value) == null ? void 0 : X.length) === 1;
+      if (ee || g) {
+        let U = (v = l.options.listboxItems.flatMap((M) => M.items ? M.items : M).find(
+          ({ value: M }) => {
+            var te;
+            return Array.isArray(l.value) ? (te = l == null ? void 0 : l.value) == null ? void 0 : te.includes(M) : M === l.value;
+          }
+        )) == null ? void 0 : v.label;
+        return !U && l.value && (U = l.value[0]), Se(U, 12);
+      }
+      return null;
+    }), _ = c(() => Ne(`filter-listbox-${l.field}`)), V = (ee) => {
+      u.value = ee;
+      const { onlySlot: g, ...j } = l;
+      if (l.options.multiple) {
+        const X = ee.length ? u.value.map(({ value: v }) => v) : null;
+        i(h.INPUT, { ...j, value: X });
+        return;
+      }
+      const Q = ee.length ? ee[0].value : null;
+      i(h.INPUT, { ...j, value: Q });
+    }, k = () => {
+      var Q, X, v;
+      const { onlySlot: ee, ...g } = l;
+      if (l.options.multiple) {
+        u.value && ((Q = u.value) == null ? void 0 : Q.length) === 0 && (u.value = l.defaultValue !== null ? C.value : void 0);
+        const m = (X = u.value) != null && X.length ? (v = u.value) == null ? void 0 : v.map(({ value: U }) => U) : null;
+        i(h.UPDATE, {
+          ...g,
+          value: m
+        });
+        return;
+      }
+      const j = u.value.length ? u.value[0].value : void 0;
+      i(h.UPDATE, { ...g, value: j });
+    }, f = () => {
+      u.value = p.value;
+    }, S = () => {
+      o.value && (o.value = "");
+    }, s = () => {
+      b(C.value), u.value = C.value, k();
+    }, R = () => {
+      B(), u.value = [], k();
+    }, K = c(() => {
+      var j, Q;
+      if (l.value == null || !l.options.multiple)
+        return null;
+      const ee = (j = l.options.listboxItems) == null ? void 0 : j.reduce((X, v) => {
+        var m;
+        return X += (m = v == null ? void 0 : v.items) != null && m.length ? v.items.length : 1, X;
+      }, 0), g = (Q = l.value) == null ? void 0 : Q.length;
+      return g === 1 ? null : g === ee ? a("all") : g;
+    });
+    return (ee, g) => (y(), E(A(Fe), {
+      "applied-filters-count": K.value,
+      "button-label": w.value,
+      "button-secondary-label": T.value,
+      disabled: e.disabled,
+      "disable-apply-button": A(L),
+      "disable-secondary-button": A(D),
+      "default-value": e.defaultValue,
+      label: e.label,
+      field: e.field,
+      "only-slot": !1,
+      onApply: k,
+      onClear: R,
+      onReset: s,
+      onOpen: f,
+      onClose: S
+    }, {
+      default: F(() => {
+        var j, Q, X, v, m, U, M, te, ie, ve, W, Ie, je;
+        return [
+          H("div", _l, [
+            $(A(ke), {
+              "debounce-time": (Q = (j = e.options) == null ? void 0 : j.search) == null ? void 0 : Q.debounceTime,
+              value: o.value,
+              "input-field-aria-label": A(a)("searchFilter", { filter: e.label.toLocaleLowerCase() }),
+              onInput: g[0] || (g[0] = (we) => o.value = we)
+            }, null, 8, ["debounce-time", "value", "input-field-aria-label"])
+          ]),
+          H("div", Cl, [
+            $(A(Ke))
+          ]),
+          $(A(Jt), {
+            id: _.value,
+            "aria-label": e.label,
+            class: "b-select-filter-button__wrapper",
+            "empty-state": (X = e.options) == null ? void 0 : X.emptyState,
+            "has-more-items": (m = (v = e.options) == null ? void 0 : v.lazy) == null ? void 0 : m.hasMoreItems,
+            items: A(O),
+            "is-option-disabled": (U = e.options) == null ? void 0 : U.isOptionDisabled,
+            "lazy-load-type": (te = (M = e.options) == null ? void 0 : M.lazy) == null ? void 0 : te.lazyLoadType,
+            loading: (ve = (ie = e.options) == null ? void 0 : ie.lazy) == null ? void 0 : ve.loading,
+            multiple: (W = e.options) == null ? void 0 : W.multiple,
+            "static-categories": (Ie = e.options) == null ? void 0 : Ie.staticCategories,
+            "no-results-message": I.value,
+            searching: !!o.value,
+            "selected-value": A(u),
+            "virtual-scroll": (je = e.options) == null ? void 0 : je.virtualScroll,
+            onSelect: V,
+            onSpacePressed: V,
+            onEnterPressed: V,
+            onShowMore: g[1] || (g[1] = (we) => {
+              var _e, Te;
+              return (Te = (_e = e.options) == null ? void 0 : _e.lazy) == null ? void 0 : Te.showMoreEvent();
+            })
+          }, Ae({ _: 2 }, [
+            be(A(t), (we, _e) => ({
+              name: _e,
+              fn: F((Te) => [
+                re(ee.$slots, _e, $e(Pe(Te)), void 0, !0)
+              ])
+            }))
+          ]), 1032, ["id", "aria-label", "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"]));
+  }
+}), Il = /* @__PURE__ */ Z(Al, [["__scopeId", "data-v-3cbbd712"]]), gt = {
+  "en-US": {
+    noFiltersMatchThisSearch: "No filters match this search"
+  }
+}, Tl = {
+  i18n: { messages: gt },
+  name: "select-filter-dropdown"
+}, $l = /* @__PURE__ */ Y({
+  ...Tl,
+  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 } = de({ messages: gt }), i = Ee(), l = n, a = e, { internalFilterValue: o } = fe(G(a, "value"), G(a, "defaultValue")), r = N(""), d = G(a, "options"), p = N(a.options.listboxItems);
+    ue(d, () => {
+      p.value = d.value.listboxItems;
+    });
+    const b = c(() => t("noFiltersMatchThisSearch")), B = (C) => {
+      o.value = C;
+      const { onlySlot: u, ...D } = a;
+      l(h.INPUT, { ...D, value: o.value });
+    };
+    return (C, u) => {
+      var D, L, O;
+      return y(), E(A(Ht), {
+        value: A(o),
+        items: e.options.listboxItems,
+        multiple: (D = e.options) == null ? void 0 : D.multiple,
+        "static-categories": (L = e.options) == null ? void 0 : L.staticCategories,
+        "no-results-message": b.value,
+        searching: !!r.value,
+        "is-option-disabled": e.options.isOptionDisabled,
+        "dynamic-filtering": !0,
+        "empty-state": (O = e.options) == null ? void 0 : O.emptyState,
+        disabled: e.disabled,
+        onInput: B
+      }, Ae({ _: 2 }, [
+        be(A(i), (I, w) => ({
+          name: w,
+          fn: F((T) => [
+            re(C.$slots, w, $e(Pe(T)))
+          ])
+        }))
+      ]), 1032, ["value", "items", "multiple", "static-categories", "no-results-message", "searching", "is-option-disabled", "empty-state", "disabled"]);
+    };
+  }
+}), Be = {
+  /**
+   * 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
+  }
+}, Pl = {}, he = /* @__PURE__ */ Y({
+  ...Pl,
+  __name: "select-filter",
+  props: Be,
+  emits: ["input", "update"],
+  setup(e, { emit: n }) {
+    const t = Ee(), i = n, l = e, a = (r) => i("input", r), o = (r) => i("update", r);
+    return rt(() => {
+      var r;
+      (r = l == null ? void 0 : l.options) != null && r.messages && Me(
+        '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"
+      );
+    }), (r, d) => r.onlySlot ? (y(), E(A($l), {
+      key: 0,
+      disabled: r.disabled,
+      "default-value": r.defaultValue,
+      field: r.field,
+      label: r.label,
+      options: r.options,
+      value: r.value,
+      onInput: a,
+      onUpdate: o
+    }, Ae({ _: 2 }, [
+      be(A(t), (p, b) => ({
+        name: b,
+        fn: F((B) => [
+          re(r.$slots, b, $e(Pe(B)))
+        ])
+      }))
+    ]), 1032, ["disabled", "default-value", "field", "label", "options", "value"])) : (y(), E(A(Il), {
+      key: 1,
+      disabled: r.disabled,
+      "default-value": r.defaultValue,
+      field: r.field,
+      label: r.label,
+      options: r.options,
+      value: r.value,
+      onInput: a,
+      onUpdate: o
+    }, Ae({ _: 2 }, [
+      be(A(t), (p, b) => ({
+        name: b,
+        fn: F((B) => [
+          re(r.$slots, b, $e(Pe(B)))
+        ])
+      }))
+    ]), 1032, ["disabled", "default-value", "field", "label", "options", "value"]));
+  }
+}), Ul = Y({
+  name: "bento-select-avatar-filter",
+  components: {
+    BentoSelectFilter: he,
+    BentoAvatar: Wt
+  },
+  props: {
+    ...Be,
+    /**
+     * 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: [h.INPUT, h.UPDATE],
+  setup(e, { emit: n }) {
+    return {
+      // Enums
+      BentoFilterEvent: h,
+      // Methods
+      onUpdate: (i) => n(h.UPDATE, i)
+    };
+  }
+});
+function El(e, n, t, i, l, a) {
+  const o = P("bento-avatar"), r = P("bento-select-filter");
+  return y(), E(r, oe(e.$props, {
+    field: e.field,
+    label: e.label,
+    onUpdate: e.onUpdate,
+    onInput: n[0] || (n[0] = (d) => e.$emit(e.BentoFilterEvent.INPUT, d))
+  }), {
+    default: F(({ label: d, data: p }) => [
+      $(o, {
+        username: d,
+        src: p
+      }, null, 8, ["username", "src"])
+    ]),
+    _: 1
+  }, 16, ["field", "label", "onUpdate"]);
+}
+const St = /* @__PURE__ */ Z(Ul, [["render", El]]), Ol = Y({
+  name: "bento-select-country-filter",
+  components: {
+    BentoSelectFilter: he,
+    ListboxOptionTag: ft
+  },
+  props: {
+    ...Be,
+    /**
+     * 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: [h.INPUT, h.UPDATE],
+  setup(e, { emit: n }) {
+    return {
+      // Enums
+      BentoFilterEvent: h,
+      // Methods
+      onUpdate: (i) => {
+        n(h.UPDATE, i);
+      }
+    };
+  }
+});
+function wl(e, n, t, i, l, a) {
+  const o = P("listbox-option-tag"), r = P("bento-select-filter");
+  return y(), E(r, oe(e.$props, {
+    field: e.field,
+    label: e.label,
+    onUpdate: e.onUpdate,
+    onInput: n[0] || (n[0] = (d) => e.$emit(e.BentoFilterEvent.INPUT, d))
+  }), {
+    default: F((d) => [
+      $(o, { option: d }, null, 8, ["option"])
+    ]),
+    _: 1
+  }, 16, ["field", "label", "onUpdate"]);
+}
+const Bt = /* @__PURE__ */ Z(Ol, [["render", wl]]), Rl = {
+  name: "bento-select-country-filter"
+}, _t = /* @__PURE__ */ Y({
+  ...Rl,
+  props: {
+    ...Be,
+    /**
+     * 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: [h.INPUT, h.UPDATE],
+  setup(e, { emit: n }) {
+    const t = e, i = n, l = N(t.options.variant), a = N(t.options.listboxItems);
+    ue([() => t.options.variant, () => t.options.listboxItems], () => {
+      l.value = t.options.variant, a.value = t.options.listboxItems;
+    });
+    const o = (p) => i(h.UPDATE, p), r = zt(l, a), d = c(() => ({
+      ...t != null && t.options ? t.options : {},
+      listboxItems: r.value
+    }));
+    return (!l.value || l.value === "custom") && Me(
+      'BentoSelectCountryFilter type with `options.variant==="custom"`',
+      "Use any of the other BentoSelectCountryFilter variants instead OR use BentoSelectFilter type for custom labels",
+      "2.0.0"
+    ), (p, b) => (y(), E(he, oe(t, {
+      field: p.field,
+      label: p.label,
+      options: d.value,
+      onUpdate: o,
+      onInput: b[0] || (b[0] = (B) => p.$emit(A(h).INPUT, B))
+    }), {
+      default: F(({ label: B }) => [
+        $(A(ce), { el: "span" }, {
+          default: F(() => [
+            q(J(B), 1)
+          ]),
+          _: 2
+        }, 1024)
+      ]),
+      _: 1
+    }, 16, ["field", "label", "options"]));
+  }
+}), Ll = Y({
+  name: "bento-select-payment-method-filter",
+  components: {
+    BentoSelectFilter: he,
+    BentoPaymentMethod: Yt
+  },
+  props: {
+    ...Be,
+    /**
+     * 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: [h.INPUT, h.UPDATE],
+  setup(e, { emit: n }) {
+    return {
+      // Enums
+      BentoFilterEvent: h,
+      // Methods
+      onUpdate: (i) => n(h.UPDATE, i)
+    };
+  }
+});
+function Vl(e, n, t, i, l, a) {
+  const o = P("bento-payment-method"), r = P("bento-select-filter");
+  return y(), E(r, oe(e.$props, {
+    field: e.field,
+    label: e.label,
+    onUpdate: e.onUpdate,
+    onInput: n[0] || (n[0] = (d) => e.$emit(e.BentoFilterEvent.INPUT, d))
+  }), {
+    default: F(({ value: d, label: p }) => [
+      $(o, {
+        type: d,
+        label: p
+      }, null, 8, ["type", "label"])
+    ]),
+    _: 1
+  }, 16, ["field", "label", "onUpdate"]);
+}
+const Ct = /* @__PURE__ */ Z(Ll, [["render", Vl]]), kl = Y({
+  name: "bento-select-country-filter",
+  components: {
+    BentoSelectFilter: he,
+    ListboxOptionTag: ft
+  },
+  props: {
+    ...Be,
+    /**
+     * 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: [h.INPUT, h.UPDATE],
+  setup(e, { emit: n }) {
+    const t = (a) => n(h.UPDATE, a), i = c(
+      () => {
+        var a, o;
+        return (o = (a = e == null ? void 0 : e.options) == null ? void 0 : a.listboxItems) == null ? void 0 : o.map(({ label: r, value: d, variant: p }) => ({ label: r, value: d, data: p }));
+      }
+    );
+    return {
+      // Values
+      countryOptions: c(() => ({
+        ...e.options,
+        listboxItems: i.value
+      })),
+      // Methods
+      onUpdate: t,
+      // Enums
+      BentoFilterEvent: h
+    };
+  }
+});
+function Nl(e, n, t, i, l, a) {
+  const o = P("listbox-option-tag"), r = P("bento-select-filter");
+  return y(), E(r, oe(e.$props, {
+    field: e.field,
+    label: e.label,
+    options: e.countryOptions,
+    onUpdate: e.onUpdate,
+    onInput: n[0] || (n[0] = (d) => e.$emit(e.BentoFilterEvent.INPUT, d))
+  }), {
+    default: F(({ label: d, data: p }) => [
+      $(o, {
+        option: { value: d, data: p, label: "" }
+      }, null, 8, ["option"])
+    ]),
+    _: 1
+  }, 16, ["field", "label", "options", "onUpdate"]);
+}
+const Dt = /* @__PURE__ */ Z(kl, [["render", Nl]]), tt = {
+  "en-US": {
+    no: "No",
+    yes: "Yes"
+  },
+  "ja-JP": {
+    no: "いいえ",
+    yes: "はい"
+  },
+  "pt-BR": {
+    no: "Não",
+    yes: "Sim"
+  }
+}, Ml = Y({
+  name: "bento-boolean-filter",
+  i18n: { messages: tt },
+  components: { BentoBaseFilter: Fe, 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:
+     *   - listboxItems: The option elements to populate the filter with.
+     */
+    options: {
+      type: Object,
+      default: void 0
+    }
+  },
+  emits: [h.INPUT, h.UPDATE],
+  setup(e, { emit: n }) {
+    const { t } = de({ messages: tt }), i = (T) => typeof T == "boolean" ? T == null ? void 0 : T.toString() : T, l = (T) => {
+      var _, V, k, f;
+      return ((V = (_ = e == null ? void 0 : e.options) == null ? void 0 : _.positiveOption) == null ? void 0 : V.value) !== void 0 && ((f = (k = e == null ? void 0 : e.options) == null ? void 0 : k.negativeOption) == null ? void 0 : f.value) !== void 0 && typeof e.options.positiveOption.value == "boolean" && typeof e.options.negativeOption.value == "boolean" && typeof T == "string" ? T === "true" : T;
+    }, a = c(() => i(e.defaultValue)), o = c(() => i(e.value)), r = 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: d, isSecondaryButtonDisabled: p, isApplyButtonDisabled: b } = fe(
+      o,
+      a
+    ), B = c(() => e.label), C = c(
+      () => {
+        var T;
+        return Se((T = r.value.find(({ value: _ }) => _ === o.value)) == null ? void 0 : T.label, 12);
+      }
+    ), u = c(() => ({
+      "b-boolean-filter--only-slot": e.onlySlot
+    }));
+    Oe(() => {
+      d.value || (d.value = null);
+    });
+    const D = (T) => {
+      d.value = T, n(h.INPUT, {
+        ...e,
+        value: l(d.value)
+      });
+    }, L = () => {
+      d.value = o.value;
+    }, O = () => {
+      n(h.UPDATE, {
+        ...e,
+        value: l(d.value)
+      });
+    };
+    return {
+      // Values
+      items: r,
+      conditionalClasses: u,
+      buttonLabel: B,
+      buttonSecondaryLabel: C,
+      internalFilterValue: d,
+      isApplyButtonDisabled: b,
+      isSecondaryButtonDisabled: p,
+      translatedValue: o,
+      translatedDefaultValue: a,
+      // Events
+      onInput: D,
+      updateFilter: O,
+      clearFilter: () => {
+        d.value = null, O();
+      },
+      openFilter: L,
+      resetFilter: () => n(h.UPDATE, { ...e, value: e.defaultValue })
+    };
+  }
+});
+function Hl(e, n, t, i, l, a) {
+  const o = P("bento-radio-group"), r = P("bento-base-filter");
+  return y(), E(r, oe(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,
+    onApply: e.updateFilter,
+    onClear: e.clearFilter,
+    onOpen: e.openFilter,
+    onReset: e.resetFilter
+  }), {
+    default: F(() => [
+      H("div", {
+        class: ye(["b-boolean-filter", e.conditionalClasses]),
+        onKeydown: n[0] || (n[0] = pe((...d) => e.updateFilter && e.updateFilter(...d), ["enter"]))
+      }, [
+        $(o, {
+          items: e.items,
+          label: e.label,
+          "model-value": e.internalFilterValue,
+          "hide-label": "",
+          "onUpdate:modelValue": e.onInput
+        }, null, 8, ["items", "label", "model-value", "onUpdate:modelValue"])
+      ], 34)
+    ]),
+    _: 1
+  }, 16, ["value", "default-value", "button-label", "button-secondary-label", "disable-apply-button", "disable-secondary-button", "only-slot", "onApply", "onClear", "onOpen", "onReset"]);
+}
+const At = /* @__PURE__ */ Z(Ml, [["render", Hl], ["__scopeId", "data-v-4619720e"]]), lt = {
+  "en-US": {
+    from: "From",
+    to: "To"
+  }
+}, Kl = Y({
+  name: "bento-range-filter",
+  i18n: { messages: lt },
+  components: { BentoBaseFilter: Fe, BentoInputField: He },
+  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 }
+  },
+  emits: [h.INPUT, h.UPDATE],
+  setup(e, { emit: n }) {
+    const { t } = de({ messages: lt }), i = N(null), { internalFilterValue: l, isSecondaryButtonDisabled: a, isApplyButtonDisabled: o } = fe(
+      G(e, "value"),
+      G(e, "defaultValue")
+    ), r = c(() => {
+      var k, f, S, s, R, K, le, se;
+      if (!((k = e.value) != null && k[0]) && !((f = e.value) != null && f[1]))
+        return null;
+      let w = "";
+      (S = e.value) != null && S[0] ? (s = e.value) != null && s[1] || (w = "≥") : w = "≤";
+      const T = (R = e.value) != null && R[0] ? `${Se(e.value[0], 5)}` : "", _ = (K = e.value) != null && K[0] && ((le = e.value) != null && le[1]) ? " - " : "", V = (se = e.value) != null && se[1] ? `${Se(e.value[1], 5)}` : "";
+      return `${w}${T}${_}${V}`;
+    }), d = c(() => e.label), p = c(() => r.value), b = c(() => ({
+      "b-range-filter--only-slot": e.onlySlot
+    })), B = () => {
+      l.value = e.value, ot(() => i.value.focusInput());
+    }, C = () => {
+      n(h.INPUT, { ...e, value: l.value });
+    }, u = (w) => {
+      l.value = [w, l.value[1]], C();
+    }, D = (w) => {
+      l.value = [l.value[0], w], C();
+    }, L = () => {
+      l.value.some((w) => w) || (l.value = e.defaultValue !== null ? e.defaultValue : void 0), n(h.UPDATE, {
+        ...e,
+        value: l.value
+      });
+    };
+    return {
+      // Values
+      inputTextRef: i,
+      conditionalClasses: b,
+      internalFilterValue: l,
+      isApplyButtonDisabled: o,
+      isSecondaryButtonDisabled: a,
+      buttonLabel: d,
+      buttonSecondaryLabel: p,
+      // Events
+      updateFrom: u,
+      updateTo: D,
+      updateFilter: L,
+      clearFilter: () => {
+        l.value = ["", ""], L();
+      },
+      openFilter: B,
+      resetFilter: () => n(h.UPDATE, { ...e, value: e.defaultValue }),
+      // Translations
+      t
+    };
+  }
+});
+function jl(e, n, t, i, l, a) {
+  const o = P("bento-input-field"), r = P("bento-base-filter");
+  return y(), E(r, oe(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,
+    onApply: e.updateFilter,
+    onClear: e.clearFilter,
+    onOpen: e.openFilter,
+    onReset: e.resetFilter
+  }), {
+    default: F(() => [
+      H("div", {
+        class: ye(["b-range-filter", e.conditionalClasses]),
+        onKeydown: n[0] || (n[0] = pe((...d) => e.updateFilter && e.updateFilter(...d), ["enter"]))
+      }, [
+        $(o, {
+          ref: "inputTextRef",
+          value: e.internalFilterValue ? e.internalFilterValue[0] : "",
+          type: "number",
+          "aria-label": e.t("from").toString(),
+          onInput: e.updateFrom
+        }, {
+          default: F(() => [
+            q(J(e.t("from")), 1)
+          ]),
+          _: 1
+        }, 8, ["value", "aria-label", "onInput"]),
+        $(o, {
+          class: "b-range-filter__input-field",
+          value: e.internalFilterValue ? e.internalFilterValue[1] : "",
+          type: "number",
+          "aria-label": e.t("to"),
+          onInput: e.updateTo
+        }, {
+          default: F(() => [
+            q(J(e.t("to")), 1)
+          ]),
+          _: 1
+        }, 8, ["value", "aria-label", "onInput"])
+      ], 34)
+    ]),
+    _: 1
+  }, 16, ["disable-apply-button", "disable-secondary-button", "button-label", "button-secondary-label", "only-slot", "onApply", "onClear", "onOpen", "onReset"]);
+}
+const It = /* @__PURE__ */ Z(Kl, [["render", jl], ["__scopeId", "data-v-e7e81bac"]]);
+var Ve = /* @__PURE__ */ ((e) => (e.INPUT = "input", e))(Ve || {});
+const ql = Y({
+  name: "base-filter-button",
+  components: { BaseButton: dt, BentoTypography: ce, ChevronUpIcon: qt, ChevronDownIcon: jt },
+  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: [ze.CLICK],
+  setup(e, { slots: n, emit: t, attrs: i }) {
+    const l = c(() => n.default ? ct(n)("default") : null), a = ut({ ariaLabel: l }), o = N(null), r = c(() => {
+      var b;
+      return {
+        "aria-controls": (b = i["aria-controls"]) == null ? void 0 : b.toString()
+      };
+    }), d = c(() => ({
+      "b-base-filter-button--with-chevron": e.hasChevron,
+      "b-base-filter-button--filter-open": e.isFilterOpen
+    }));
+    return {
+      // Values
+      ariaAttributes: r,
+      computedAriaLabel: a,
+      conditionalClasses: d,
+      // Methods
+      onClickButton: () => {
+        e.disabled || t(ze.CLICK);
+      },
+      hasSlot: pt(n),
+      // Refs
+      baseFilterButtonRef: o
+    };
+  }
+}), Jl = { class: "b-base-filter-button__default-container" }, Yl = { class: "b-base-filter-button__label-container" }, zl = {
+  key: 0,
+  class: "b-base-filter-button__counter-wrapper"
+};
+function Wl(e, n, t, i, l, a) {
+  const o = P("bento-typography"), r = P("chevron-up-icon"), d = P("chevron-down-icon"), p = P("base-button");
+  return y(), E(p, {
+    ref: "baseFilterButtonRef",
+    class: ye(["b-base-filter-button", e.conditionalClasses]),
+    disabled: e.disabled,
+    "aria-label": e.computedAriaLabel,
+    "aria-controls": e.ariaAttributes["aria-controls"],
+    type: "button",
+    onClick: e.onClickButton
+  }, Ae({
+    default: F(() => [
+      H("div", Jl, [
+        H("div", Yl, [
+          $(o, {
+            el: "span",
+            variant: "body",
+            stronger: e.bold,
+            class: "b-base-filter-button__label"
+          }, {
+            default: F(() => [
+              re(e.$slots, "default", {}, void 0, !0)
+            ]),
+            _: 3
+          }, 8, ["stronger"])
+        ]),
+        e.amountAppliedValues && !e.hasChevron ? (y(), z("div", zl, [
+          $(o, {
+            class: "b-base-filter-button__counter",
+            el: "span",
+            variant: "body",
+            stronger: ""
+          }, {
+            default: F(() => [
+              q(J(e.amountAppliedValues), 1)
+            ]),
+            _: 1
+          })
+        ])) : x("", !0)
+      ])
+    ]),
+    _: 2
+  }, [
+    e.hasChevron ? {
+      name: "iconRight",
+      fn: F(() => [
+        e.isFilterOpen ? (y(), E(r, {
+          key: 0,
+          "aria-hidden": "true"
+        })) : (y(), E(d, {
+          key: 1,
+          "aria-hidden": "true"
+        }))
+      ]),
+      key: "0"
+    } : void 0
+  ]), 1032, ["class", "disabled", "aria-label", "aria-controls", "onClick"]);
+}
+const Gl = /* @__PURE__ */ Z(ql, [["render", Wl], ["__scopeId", "data-v-af9efc73"]]), Zl = Y({
+  name: "all-filters-modal-button",
+  components: { BaseFilterButton: Gl },
+  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 Ql(e, n, t, i, l, a) {
+  const o = P("base-filter-button");
+  return y(), E(o, {
+    class: ye(["b-all-filters-modal-button", e.conditionalClasses]),
+    "amount-applied-values": e.appliedFiltersCount,
+    "is-filter-open": e.isFilterOpen,
+    disabled: e.disabled,
+    onClick: e.onClick
+  }, {
+    default: F(() => [
+      q(J(e.label), 1)
+    ]),
+    _: 1
+  }, 8, ["class", "amount-applied-values", "is-filter-open", "disabled", "onClick"]);
+}
+const Xl = /* @__PURE__ */ Z(Zl, [["render", Ql], ["__scopeId", "data-v-b96a672f"]]);
+let at = 0;
+const xl = {
+  beforeCreate() {
+    this.uuid = at.toString(), at += 1;
+  }
+}, ea = { key: 0 };
+function ta(e, n, t, i, l, a) {
+  return y(), z("svg", oe({ 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"] ? (y(), z("title", ea, J(e.$attrs["svg-title"]), 1)) : x("", !0),
+    n[0] || (n[0] = H("path", {
+      fill: "#00112C",
+      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] = H("path", {
+      fill: "#00112C",
+      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 la = /* @__PURE__ */ Z(xl, [["render", ta]]), nt = {
+  "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": {
+    all: "すべて",
+    cancel: "キャンセル",
+    clear: "クリア",
+    clearAll: "すべてクリア"
+  },
+  "pt-BR": {
+    all: "Todos",
+    cancel: "Cancelar",
+    clear: "Limpar",
+    clearAll: "Limpar tudo"
+  }
+}, aa = Y({
+  i18n: { messages: nt },
+  name: "all-filters-modal",
+  components: {
+    AllFiltersModalButton: Xl,
+    BentoBooleanFilter: At,
+    BentoButton: Ot,
+    BentoDateFilter: yt,
+    BentoDateRangeFilter: Ft,
+    BentoInputFilter: mt,
+    BentoModal: Ut,
+    BentoRangeFilter: It,
+    BentoSearchBar: ke,
+    BentoSelectAvatarFilter: St,
+    BentoSelectCurrencyFilter: Bt,
+    BentoSelectCountryFilter: _t,
+    BentoSelectFilter: he,
+    BentoSelectPaymentMethodFilter: Ct,
+    BentoSelectTagFilter: Dt,
+    BentoTypography: ce,
+    FilterBarButton: Ue,
+    SlidersIcon: la
+  },
+  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: [Ve.INPUT],
+  setup(e, { emit: n }) {
+    const t = it({ value: e.value }), i = N(t.value), l = Ne("all-filters-modal"), a = N([]), o = N(!1), r = N(0), d = N(null), p = N(""), { t: b } = de({ messages: nt }), B = bt(p, G(i, "value")), C = N({});
+    Oe(() => {
+      C.value = [];
+    }), ue(
+      () => e.value,
+      () => {
+        t.value = e.value, i.value = e.value;
+      }
+    );
+    const u = (v) => (
+      /* eslint-disable-next-line no-nested-ternary */
+      v.sort((m, U) => m.label > U.label ? 1 : U.label > m.label ? -1 : 0)
+    ), D = c(
+      () => u(
+        B.value.filter(
+          (v) => {
+            var m, U;
+            return Array.isArray(v.value) ? ((m = v.value) == null ? void 0 : m.length) && ((U = v.value) == null ? void 0 : U.find((M) => M !== "")) : v.value;
+          }
+        )
+      )
+    ), L = c(
+      () => u(
+        B.value.filter(
+          (v) => {
+            var m, U;
+            return Array.isArray(v.value) ? ((m = v.value) == null ? void 0 : m.length) === 0 || ((U = v.value) == null ? void 0 : U.every((M) => M === "")) : !v.value;
+          }
+        )
+      )
+    ), O = c(() => {
+      var v;
+      return p.value && ((v = B.value) == null ? void 0 : v.length) === 0;
+    }), I = c(() => i.value[r.value]), w = () => {
+      const v = D.value.length ? D.value[0] : L.value[0], m = i.value.findIndex(
+        (U) => U.label === v.label && U.field === v.field
+      );
+      r.value = m;
+    };
+    rt(() => {
+      w();
+    });
+    const T = (v) => v.map((m) => {
+      var U, M, te, ie, ve, W;
+      switch (m.type) {
+        case ae.SELECT:
+        case ae.SELECT_AVATAR:
+        case ae.SELECT_COUNTRY:
+        case ae.SELECT_CURRENCY:
+        case ae.SELECT_PAYMENT_METHOD:
+        case ae.SELECT_TAG:
+          switch ((U = m.options) == null ? void 0 : U.multiple) {
+            case !0:
+              return {
+                label: m.label,
+                field: m.field,
+                count: (M = m.value) != null && M.length ? (te = m.value) == null ? void 0 : te.length : null
+              };
+            default:
+              return {
+                label: m.label,
+                field: m.field,
+                count: m.value == null ? null : 1
+              };
+          }
+        case ae.DATE_RANGE:
+          return {
+            label: m.label,
+            field: m.field,
+            count: ((ie = m.value) == null ? void 0 : ie.startDate) != null && ((ve = m.value) == null ? void 0 : ve.endDate) != null ? 1 : null
+          };
+        case ae.RANGE:
+          return {
+            label: m.label,
+            field: m.field,
+            count: (W = m.value) != null && W.find((Ie) => Ie !== "") ? 1 : null
+          };
+        case ae.INPUT:
+        case ae.BOOLEAN:
+        case ae.DATE:
+        default:
+          return {
+            label: m.label,
+            field: m.field,
+            count: m.value != null ? 1 : null
+          };
+      }
+    }), _ = c(
+      () => {
+        var v;
+        return Array.isArray(I.value.value) ? ((v = I.value) == null ? void 0 : v.value.length) && I.value.value.find((m) => m !== "") : !!i.value[r.value].value;
+      }
+    ), V = c(
+      () => {
+        var v;
+        return (v = T(t.value)) == null ? void 0 : v.filter(({ count: m }) => !!m).length;
+      }
+    ), k = () => {
+      o.value ? o.value = !1 : o.value = !0;
+    }, f = (v) => {
+      var U, M, te;
+      const m = T(i.value).find((ie) => ie.field === v.field).count;
+      return v.type.includes("BentoSelect") && ((U = v.options) != null && U.multiple) && m === ((te = (M = v.options) == null ? void 0 : M.listboxItems) == null ? void 0 : te.length) ? b("all") : m;
+    }, S = (v, m) => {
+      r.value = i.value.findIndex(
+        (U) => U.label === v && U.field === m
+      );
+    }, s = () => {
+      p.value = "";
+    }, R = () => {
+      o.value = !1, t.value = e.value, i.value = e.value, s(), w();
+    }, K = (v) => {
+      const m = i.value.map(({ value: U, ...M }, te) => te === r.value ? { value: v.value, ...M } : { value: U, ...M });
+      i.value = m;
+    }, le = () => {
+      K({
+        field: I.value.field,
+        label: I.value.label,
+        type: I.value.type,
+        value: void 0
+      });
+    }, se = () => {
+      i.value = t.value.map(({ value: v, ...m }) => ({
+        ...m,
+        value: void 0
+      }));
+    }, ee = () => {
+      n(Ve.INPUT, i.value), o.value = !1;
+    }, g = c(
+      () => JSON.stringify(i.value) === JSON.stringify(e.value)
+    ), j = c(() => [
+      {
+        title: b("applyAll"),
+        disabled: g.value,
+        event: ee
+      },
+      {
+        title: b("cancel"),
+        event: R
+      },
+      {
+        title: b("clearAll"),
+        disabled: !V.value,
+        event: se
+      }
+    ]);
+    return {
+      // Enums
+      BentoModalEvent: Et,
+      // Values
+      allFiltersModalUniqueId: l,
+      allFiltersModalFiltersSection: a,
+      allFiltersModalFilterButtons: C,
+      numberOfActiveFilters: V,
+      isEmptyResultForSearchFilter: O,
+      isModalOpen: o,
+      isClearButtonEnabled: _,
+      activeFilters: D,
+      otherFilters: L,
+      modalActions: j,
+      selectedFilter: I,
+      selectedFilterRef: d,
+      filters: t,
+      searchTerm: p,
+      // Methods
+      onClickAllFiltersModal: k,
+      getFilterCount: f,
+      cancel: R,
+      selectFilter: S,
+      clearFilter: le,
+      updateFilter: K,
+      onSearchbarClear: s,
+      onKeydownRight: () => {
+        Kt(1, d.value.$el).focus();
+      },
+      onKeydownLeft: () => {
+        C.value[I.value.label].$el.focus();
+      },
+      // Translations
+      t: b
+    };
+  }
+}), na = { class: "b-all-filters-modal" }, oa = {
+  key: 0,
+  class: "b-all-filters-modal__empty-search-message"
+}, sa = {
+  key: 1,
+  class: "b-all-filters-modal__filters-section"
+}, ia = ["aria-labelledby"], ra = {
+  key: 2,
+  class: "b-all-filters-modal__filters-section"
+}, ua = ["aria-labelledby"], da = { class: "b-all-filters-modal__selected-filter-text" }, ca = { class: "b-all-filters-modal__selected-filter-component" }, pa = { class: "b-all-filters-modal__clear-button" };
+function ba(e, n, t, i, l, a) {
+  const o = P("sliders-icon"), r = P("filter-bar-button"), d = P("bento-search-bar"), p = P("bento-typography"), b = P("all-filters-modal-button"), B = P("bento-button"), C = P("bento-modal");
+  return y(), z("div", na, [
+    $(r, {
+      "is-filter-open": e.isModalOpen,
+      "applied-filters-count": e.numberOfActiveFilters,
+      onClick: e.onClickAllFiltersModal
+    }, {
+      iconLeft: F(() => [
+        $(o, { "aria-hidden": "true" })
+      ]),
+      default: F(() => [
+        q(J(e.t("allFilters")) + " ", 1)
+      ]),
+      _: 1
+    }, 8, ["is-filter-open", "applied-filters-count", "onClick"]),
+    $(C, {
+      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: F(() => [
+        q(J(e.t("allFilters")), 1)
+      ]),
+      "content-col-1": F(() => [
+        H("div", {
+          ref: "allFiltersModalFiltersSection",
+          class: "b-all-filters-modal__filters",
+          onKeydown: n[1] || (n[1] = pe((...u) => e.onKeydownRight && e.onKeydownRight(...u), ["right"]))
+        }, [
+          $(d, {
+            class: "b-all-filters-modal__search-bar",
+            value: e.searchTerm,
+            "input-field-aria-label": e.t("searchBar").toString(),
+            onInput: n[0] || (n[0] = (u) => e.searchTerm = u),
+            onClear: e.onSearchbarClear
+          }, null, 8, ["value", "input-field-aria-label", "onClear"]),
+          e.isEmptyResultForSearchFilter ? (y(), z("div", oa, [
+            $(p, { el: "span" }, {
+              default: F(() => [
+                q(J(e.t("noFiltersMatchThisSearch")), 1)
+              ]),
+              _: 1
+            })
+          ])) : x("", !0),
+          e.activeFilters.length ? (y(), z("div", sa, [
+            $(p, {
+              id: `active-filters-${e.allFiltersModalUniqueId}`,
+              class: "b-all-filters-modal__filters-section-title",
+              el: "span",
+              variant: "caption"
+            }, {
+              default: F(() => [
+                q(J(e.t("activeFilters")), 1)
+              ]),
+              _: 1
+            }, 8, ["id"]),
+            H("ul", {
+              class: "b-all-filters-modal__filters-list",
+              "aria-labelledby": `active-filters-${e.allFiltersModalUniqueId}`
+            }, [
+              (y(!0), z(De, null, be(e.activeFilters, (u) => (y(), z("li", {
+                key: `${u.label}-${u.field}`
+              }, [
+                $(b, {
+                  ref_for: !0,
+                  ref: (D) => e.allFiltersModalFilterButtons[u.label] = D,
+                  label: u.label,
+                  "applied-filters-count": e.getFilterCount(u),
+                  "is-filter-open": e.selectedFilter.label === u.label,
+                  onClick: (D) => e.selectFilter(u.label, u.field)
+                }, null, 8, ["label", "applied-filters-count", "is-filter-open", "onClick"])
+              ]))), 128))
+            ], 8, ia)
+          ])) : x("", !0),
+          e.otherFilters.length ? (y(), z("div", ra, [
+            e.activeFilters.length ? (y(), E(p, {
+              key: 0,
+              id: `other-filters-${e.allFiltersModalUniqueId}`,
+              class: "b-all-filters-modal__filters-section-title",
+              el: "span",
+              variant: "caption"
+            }, {
+              default: F(() => [
+                q(J(e.t("otherFilters")), 1)
+              ]),
+              _: 1
+            }, 8, ["id"])) : x("", !0),
+            H("ul", {
+              class: "b-all-filters-modal__filters-list",
+              "aria-labelledby": `other-filters-${e.allFiltersModalUniqueId}`
+            }, [
+              (y(!0), z(De, null, be(e.otherFilters, (u) => (y(), z("li", {
+                key: `${u.label}-${u.field}`
+              }, [
+                $(b, {
+                  ref_for: !0,
+                  ref: (D) => e.allFiltersModalFilterButtons[u.label] = D,
+                  label: u.label,
+                  "applied-filters-count": e.getFilterCount(u),
+                  "is-filter-open": e.selectedFilter.label === u.label,
+                  onClick: (D) => e.selectFilter(u.label, u.field)
+                }, null, 8, ["label", "applied-filters-count", "is-filter-open", "onClick"])
+              ]))), 128))
+            ], 8, ua)
+          ])) : x("", !0)
+        ], 544)
+      ]),
+      "content-col-2": F(() => [
+        H("div", {
+          class: "b-all-filters-modal__selected-filter-content",
+          onKeydown: n[2] || (n[2] = pe((...u) => e.onKeydownLeft && e.onKeydownLeft(...u), ["left"]))
+        }, [
+          H("div", da, [
+            $(p, {
+              el: "div",
+              variant: "title",
+              medium: ""
+            }, {
+              default: F(() => [
+                q(J(e.selectedFilter.label), 1)
+              ]),
+              _: 1
+            }),
+            e.selectedFilter.description ? (y(), E(p, {
+              key: 0,
+              el: "div",
+              variant: "body",
+              wide: ""
+            }, {
+              default: F(() => [
+                q(J(e.selectedFilter.description), 1)
+              ]),
+              _: 1
+            })) : x("", !0)
+          ]),
+          H("div", ca, [
+            (y(), E(Le(e.selectedFilter.type), {
+              ref: "selectedFilterRef",
+              key: e.selectedFilter.field,
+              field: e.selectedFilter.field,
+              label: e.selectedFilter.label,
+              options: e.selectedFilter.options,
+              value: e.selectedFilter.value,
+              "default-value": e.selectedFilter.defaultValue,
+              "only-slot": !0,
+              onInput: e.updateFilter
+            }, null, 40, ["field", "label", "options", "value", "default-value", "onInput"]))
+          ]),
+          H("div", pa, [
+            $(B, {
+              variant: "secondary",
+              disabled: !e.isClearButtonEnabled,
+              onClick: e.clearFilter
+            }, {
+              default: F(() => [
+                q(J(e.t("clear")), 1)
+              ]),
+              _: 1
+            }, 8, ["disabled", "onClick"])
+          ])
+        ], 32)
+      ]),
+      _: 1
+    }, 8, ["is-open", "actions", "onCloseModal"])
+  ]);
+}
+const fa = /* @__PURE__ */ Z(aa, [["render", ba], ["__scopeId", "data-v-eb3ae500"]]), Tt = {
+  "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: "フィルターをクリアしました",
+    resetFilters: "フィルターのリセット",
+    undo: "元に戻す"
+  },
+  "pt-BR": {
+    clearFilters: "Limpar filtros",
+    filtersHaveBeenCleared: "Os filtros foram apagados",
+    resetFilters: "Redefinir filtros",
+    undo: "Desfazer"
+  }
+}, va = { class: "b-filter-bar" }, ma = { class: "b-filter-bar__container" }, ya = { class: "b-filter-bar__filters" }, Fa = { class: "b-filter-bar__scroller-content" }, ha = {
+  key: 0,
+  class: "b-filter-bar__actions"
+}, ga = {
+  i18n: { messages: Tt },
+  name: "bento-filter-bar",
+  components: {
+    BentoBooleanFilter: At,
+    BentoDateFilter: yt,
+    BentoDateRangeFilter: Ft,
+    BentoInputFilter: mt,
+    BentoInputWithDropdownFilter: ml,
+    BentoRangeFilter: It,
+    BentoSelectAvatarFilter: St,
+    BentoSelectCountryFilter: _t,
+    BentoSelectCurrencyFilter: Bt,
+    BentoSelectFilter: he,
+    BentoSelectPaymentMethodFilter: Ct,
+    BentoSelectTagFilter: Dt
+  }
+}, Sa = /* @__PURE__ */ Y({
+  ...ga,
+  props: {
+    config: { default: () => [] },
+    filterValues: { default: () => [] },
+    search: { default: void 0 },
+    searchTerm: { default: void 0 },
+    showAppliedHiddenFilters: { type: Boolean, default: !1 },
+    value: { default: () => [] }
+  },
+  emits: [
+    Ce.INPUT,
+    Ce.UPDATE_FILTER_VALUES,
+    ge.CLEAR,
+    ge.INPUT,
+    ge.UPDATE
+  ],
+  setup(e, { expose: n, emit: t }) {
+    const i = e, l = t, { t: a } = de({ messages: Tt }), o = c(
+      () => {
+        var f, S;
+        return (S = ((f = i.config) == null ? void 0 : f.length) > 0 ? i.config : i.value) == null ? void 0 : S.map((s) => {
+          var K;
+          let R = (K = i.filterValues.find(({ field: le }) => le === s.field)) == null ? void 0 : K.value;
+          return R === void 0 && (R = (s == null ? void 0 : s.value) === void 0 && (s == null ? void 0 : s.defaultValue) !== void 0 ? s == null ? void 0 : s.defaultValue : s == null ? void 0 : s.value), { ...s, value: R !== void 0 ? R : s == null ? void 0 : s.value };
+        });
+      }
+    ), { addToast: r } = Pt(), d = c(() => {
+      var f;
+      return ((f = i.search) == null ? void 0 : f.inputFieldAriaLabel) || a("searchBar");
+    }), p = c(() => {
+      if (!i.search)
+        return;
+      const { hint: f, inputFieldAriaLabel: S, debounceTime: s, placeholder: R } = i.search;
+      return { hint: f, inputFieldAriaLabel: S, debounceTime: s, placeholder: R };
+    }), b = c(() => o.value.some(
+      ({ visible: S }) => S != null
+    ) ? o.value.some(({ visible: S }) => !S) : !1), B = c(
+      () => o.value.filter(({ defaultValue: f }) => f !== void 0)
+    ), C = c(() => o.value.some(
+      ({ visible: S }) => S != null
+    ) ? o.value.filter(
+      ({ defaultValue: S, visible: s, value: R }) => S === void 0 && s || i.showAppliedHiddenFilters && R != null
+    ) : o.value.filter(
+      ({ defaultValue: S, value: s }) => S === void 0 || i.showAppliedHiddenFilters && s != null
+    )), u = c(() => i.searchTerm != null), D = c(
+      () => o.value.filter(({ defaultValue: f }) => f == null).some(({ value: f }) => f != null)
+    ), L = c(() => B.value.length === 0 && D.value), O = c(() => B.value.length === 0 ? !1 : !o.value.filter(({ defaultValue: S }) => S !== void 0 || S !== null).every(({ value: S, defaultValue: s }) => JSON.stringify(S) === JSON.stringify(s)) || D.value), I = (f) => {
+      l(Ce.INPUT, f), l(
+        Ce.UPDATE_FILTER_VALUES,
+        f == null ? void 0 : f.filter(({ value: S }) => S !== null || S !== void 0).map(({ field: S, value: s }) => ({ field: S, value: s }))
+      );
+    }, w = (f) => {
+      const S = o.value.findIndex(
+        (R) => R.field === f.field
+      ), s = o.value.slice();
+      s[S].value = f.value, I(s);
+    }, T = () => {
+      const f = o.value.slice(), S = o.value.map(({ value: s, ...R }) => ({
+        ...R,
+        value: void 0
+      }));
+      r({
+        text: a("filtersHaveBeenCleared"),
+        action: {
+          handler: () => I(f),
+          text: a("undo")
+        }
+      }), I(S);
+    }, _ = () => {
+      const f = o.value.slice(), S = o.value.map(({ defaultValue: s, ...R }) => ({
+        ...R,
+        defaultValue: s,
+        value: s
+      }));
+      r({
+        text: a("filtersHaveBeenReset"),
+        action: {
+          handler: () => I(f),
+          text: a("undo")
+        }
+      }), I(S);
+    }, V = (f) => {
+      l(ge.INPUT, f), l(ge.UPDATE, f);
+    }, k = () => {
+      l(ge.CLEAR);
+    };
+    return n({ isClearAllVisible: L, clearAllFilters: T, isResetAllVisible: O, resetAllFilters: _ }), (f, S) => (y(), z("div", va, [
+      H("div", ma, [
+        H("div", ya, [
+          $(A(ll), {
+            class: "b-filter-bar__fixed-scroller",
+            condensed: ""
+          }, {
+            default: F(() => [
+              H("div", Fa, [
+                u.value ? (y(), E(A(ke), oe({
+                  key: 0,
+                  class: "b-filter-bar__search-bar"
+                }, p.value, {
+                  "input-field-aria-label": d.value,
+                  value: f.searchTerm,
+                  condensed: "",
+                  onInput: V,
+                  onClear: k
+                }), null, 16, ["input-field-aria-label", "value"])) : x("", !0),
+                B.value.length ? (y(!0), z(De, { key: 1 }, be(B.value, (s) => (y(), E(Le(s.type), {
+                  key: s.field,
+                  field: s.field,
+                  label: s.label,
+                  disabled: s == null ? void 0 : s.disabled,
+                  options: s.options,
+                  value: s.value,
+                  "default-value": s.defaultValue,
+                  onUpdate: w
+                }, null, 40, ["field", "label", "disabled", "options", "value", "default-value"]))), 128)) : x("", !0),
+                (y(!0), z(De, null, be(C.value, (s) => (y(), E(Le(s.type), {
+                  key: s.field,
+                  field: s.field,
+                  label: s.label,
+                  disabled: s == null ? void 0 : s.disabled,
+                  options: s.options,
+                  value: s.value,
+                  onUpdate: w
+                }, null, 40, ["field", "label", "disabled", "options", "value"]))), 128))
+              ])
+            ]),
+            _: 1
+          })
+        ]),
+        b.value || L.value || O.value ? (y(), z("div", ha, [
+          b.value ? (y(), E(fa, {
+            key: 0,
+            class: "b-filter-bar__all-filters-modal",
+            value: o.value,
+            onInput: I
+          }, null, 8, ["value"])) : x("", !0),
+          qe($(A(Ue), {
+            class: "b-filter-bar__clear-all",
+            onClick: T
+          }, {
+            iconLeft: F(() => [
+              $(A(Ze), { "aria-hidden": "true" })
+            ]),
+            default: F(() => [
+              q(J(A(a)("clearFilters")) + " ", 1)
+            ]),
+            _: 1
+          }, 512), [
+            [Je, L.value]
+          ]),
+          qe($(A(Ue), {
+            class: "b-filter-bar__reset-all",
+            onClick: _
+          }, {
+            iconLeft: F(() => [
+              $(A(Ze), { "aria-hidden": "true" })
+            ]),
+            default: F(() => [
+              q(J(A(a)("resetFilters")) + " ", 1)
+            ]),
+            _: 1
+          }, 512), [
+            [Je, O.value]
+          ])
+        ])) : x("", !0)
+      ])
+    ]));
+  }
+}), un = /* @__PURE__ */ Z(Sa, [["__scopeId", "data-v-969edd1e"]]);
+export {
+  un as B,
+  h as a,
+  Ce as b,
+  ae as c
+};
+//# sourceMappingURL=filter-bar.DYrXBQDF.js.map