@adyen/adyen-platform-experience-web 1.2.0 → 1.3.1

package/dist/es/components/internal/DatePicker/DatePicker.js

@@ -3,23 +3,23 @@ import _ from "classnames";
 import { forwardRef as y } from "../../../external/preact/compat/dist/compat.module.js";
 import { useState as p, useMemo as r, useCallback as O } from "../../../external/preact/hooks/dist/hooks.module.js";
 import N from "../../../core/Context/useCoreContext.js";
-import P from "../../../hooks/useReflex.js";
-import D from "../Calendar/hooks/useTimezone.js";
-import { DEFAULT_FIRST_WEEK_DAY as I } from "../Calendar/calendar/timerange/presets/shared/offsetWeek.js";
-import M from "../Calendar/hooks/useCalendarControlsRendering.js";
-import "./DatePicker.scss.js";
+import D from "../../../hooks/useReflex.js";
+import I from "../Calendar/hooks/useTimezone.js";
+import { DEFAULT_FIRST_WEEK_DAY as M } from "../Calendar/calendar/timerange/presets/shared/offsetWeek.js";
+import P from "../Calendar/hooks/useCalendarControlsRendering.js";
+/* empty css                */
 import v from "./components/TimeRangeSelector/TimeRangeSelector.js";
 import x from "../Calendar/Calendar.js";
 import u from "../Calendar/calendar/facade/index.js";
 import { boolOrTrue as E } from "../../../utils/value/bool.js";
 import { EMPTY_OBJECT as S } from "../../../utils/value/constants.js";
 import { noop as A } from "../../../utils/common.js";
-const b = y((e, g) => {
-  const { i18n: i } = N(), [T, k] = M(e.renderControl), [C, a] = p(performance.now()), t = r(() => E(e.showTimezoneInfo), [e.showTimezoneInfo]), { clockTime: m, GMTOffset: c } = D({ timezone: e.timezone, withClock: t }), w = r(() => _([{ "adyen-pe-datepicker--with-timezone": t }, "adyen-pe-datepicker"]), [t]), z = r(() => t ? { values: { offset: c, time: m } } : S, [c, m, t]), o = P(A, g), R = O(() => {
+const Z = y((e, g) => {
+  const { i18n: i } = N(), [T, C] = P(e.renderControl), [k, a] = p(performance.now()), t = r(() => E(e.showTimezoneInfo), [e.showTimezoneInfo]), { clockTime: m, GMTOffset: c } = I({ timezone: e.timezone, withClock: t }), z = r(() => _([{ "adyen-pe-datepicker--with-timezone": t }, "adyen-pe-datepicker"]), [t]), w = r(() => t ? { values: { offset: c, time: m } } : S, [c, m, t]), o = D(A, g), R = O(() => {
     var l, s, d, f, h;
     a(performance.now()), (l = o.current) != null && l.from && ((s = o.current) != null && s.to) && ((h = e.onHighlight) == null || h.call(e, +((d = o.current) == null ? void 0 : d.from), +((f = o.current) == null ? void 0 : f.to)));
   }, [a, e.onHighlight]);
-  return /* @__PURE__ */ n("div", { className: w, children: [
+  return /* @__PURE__ */ n("div", { className: z, children: [
     /* @__PURE__ */ n("div", { className: "adyen-pe-datepicker__selector-container", children: /* @__PURE__ */ n(
       v,
       {
@@ -28,17 +28,17 @@ const b = y((e, g) => {
         onTimeRangeSelected: e.onPresetOptionSelected,
         options: e.timeRangePresetOptions,
         selectedOption: e.selectedPresetOption,
-        timestamp: C,
+        timestamp: k,
         timezone: e.timezone
       }
     ) }),
-    /* @__PURE__ */ n("div", { ref: k, role: "group", className: "adyen-pe-datepicker__controls", "aria-label": i.get("calendar.controls") }),
+    /* @__PURE__ */ n("div", { ref: C, role: "group", className: "adyen-pe-datepicker__controls", "aria-label": i.get("calendar.controls") }),
     /* @__PURE__ */ n(
       x,
       {
         ...e,
         ref: o,
-        firstWeekDay: I,
+        firstWeekDay: M,
         dynamicBlockRows: !0,
         onlyCellsWithin: !0,
         controls: e.controls ?? u.controls.MINIMAL,
@@ -48,9 +48,9 @@ const b = y((e, g) => {
         trackCurrentDay: !0
       }
     ),
-    t && /* @__PURE__ */ n("div", { className: "adyen-pe-datepicker__timezone", children: i.get("calendar.timezone", z) })
+    t && /* @__PURE__ */ n("div", { className: "adyen-pe-datepicker__timezone", children: i.get("calendar.timezone", w) })
   ] });
-}), Z = b;
+});
 export {
   Z as default
 };

package/dist/es/components/internal/DatePicker/components/TimeRangeSelector/TimeRangeSelector.js

@@ -1,32 +1,32 @@
-import { jsx as C } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import { jsx as S } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
 import { useMemo as j, useCallback as w, useRef as h, useEffect as i } from "../../../../../external/preact/hooks/dist/hooks.module.js";
 import { useTimeRangeSelection as x } from "./useTimeRangeSelection.js";
 import D from "../../../FormFields/Select/Select.js";
-const T = ({
+const z = ({
   calendarRef: t,
   onTimeRangeSelected: o,
   timestamp: s,
   ...O
 }) => {
-  const { customSelection: f, from: u, onSelection: l, options: m, selectedOption: r, to: c } = x(O), S = j(() => Object.freeze(m.map((e) => ({ id: e, name: e }))), [m]), b = w(({ target: e }) => l(e == null ? void 0 : e.value), [l]), n = h(!0), p = h(s);
+  const { customSelection: f, from: u, onSelection: l, options: m, selectedOption: r, to: c } = x(O), b = j(() => Object.freeze(m.map((e) => ({ id: e, name: e }))), [m]), C = w(({ target: e }) => l(e == null ? void 0 : e.value), [l]), n = h(!0), p = h(s);
   return i(() => {
     t != null && t.current && u && c && (n.current = !0, t.current.from = new Date(u), t.current.to = new Date(c));
   }, [t, u, c]), i(() => {
     p.current !== s && (p.current = s, n.current ? n.current = !1 : f());
   }, [f, s]), i(() => {
     r && (o == null || o(r));
-  }, [r, o]), /* @__PURE__ */ C(
+  }, [r, o]), /* @__PURE__ */ S(
     D,
     {
       setToTargetWidth: !0,
-      items: S,
+      items: b,
       filterable: !1,
       multiSelect: !1,
-      onChange: b,
+      onChange: C,
       selected: r
     }
   );
-}, y = T;
+};
 export {
-  y as default
+  z as default
 };

package/dist/es/components/internal/DatePicker/components/TimeRangeSelector/useTimeRangeSelection.js

@@ -1,59 +1,59 @@
 import { useState as i, useRef as k, useMemo as c, useCallback as C } from "../../../../../external/preact/hooks/dist/hooks.module.js";
-import I from "../../../../../core/Context/useCoreContext.js";
+import N from "../../../../../core/Context/useCoreContext.js";
 import R from "../../../Calendar/calendar/timerange/presets/lastNDays.js";
-import N from "../../../Calendar/calendar/timerange/presets/thisWeek.js";
-import q from "../../../Calendar/calendar/timerange/presets/lastWeek.js";
+import q from "../../../Calendar/calendar/timerange/presets/thisWeek.js";
+import v from "../../../Calendar/calendar/timerange/presets/lastWeek.js";
 import A from "../../../Calendar/calendar/timerange/presets/thisMonth.js";
 import E from "../../../Calendar/calendar/timerange/presets/lastMonth.js";
 import K from "../../../Calendar/calendar/timerange/presets/yearToDate.js";
 const X = () => Object.freeze({
   "rangePreset.last7Days": R(7),
   "rangePreset.last30Days": R(30),
-  "rangePreset.thisWeek": N(),
-  "rangePreset.lastWeek": q(),
+  "rangePreset.thisWeek": q(),
+  "rangePreset.lastWeek": v(),
   "rangePreset.thisMonth": A(),
   "rangePreset.lastMonth": E(),
   "rangePreset.yearToDate": K()
 }), Y = ({
   now: a = Date.now(),
-  options: n,
+  options: s,
   selectedOption: m,
   timezone: u
 }) => {
-  const { i18n: l } = I(), [W, h] = i(), [j, S] = i(), [f, g] = i(), d = k(), y = k(), [e, D, s] = c(() => {
-    const o = l.get("rangePreset.custom"), t = Object.keys(n), r = Object.freeze(t.map((O) => l.get(O)));
+  const { i18n: f } = N(), [W, h] = i(), [j, d] = i(), [l, g] = i(), S = k(), y = k(), [t, D, n] = c(() => {
+    const o = f.get("rangePreset.custom"), e = Object.keys(s), r = Object.freeze(e.map((O) => f.get(O)));
     return [o, (O, F = r) => {
-      const v = F.findIndex((z) => z === O);
-      return n[t[v]];
+      const z = F.findIndex((I) => I === O);
+      return s[e[z]];
     }, r];
-  }, [l, n]), [P, T] = i(m === e), b = c(() => Object.freeze([...s, e]), [e, s]), M = c(
-    () => P ? b : s,
-    [P, s, b]
+  }, [f, s]), [P, T] = i(m === t), b = c(() => Object.freeze([...n, t]), [t, n]), M = c(
+    () => P ? b : n,
+    [P, n, b]
   ), p = C(
     (o) => {
-      const t = D(o, s);
-      t && (h(t.from), S(t.to), T(!1), g(o));
+      const e = D(o, n);
+      e && (h(e.from), d(e.to), T(!1), g(o));
     },
-    [e, D, f, s]
+    [t, D, l, n]
   ), x = C(() => {
-    h(void 0), S(void 0), T(!0), g(e);
-  }, [e]);
+    h(void 0), d(void 0), T(!0), g(t);
+  }, [t]);
   return c(() => {
-    m === e ? g(e) : p(m);
+    m === t ? g(t) : p(m);
   }, []), c(() => {
     var o;
-    if (d.current !== a || y.current !== u) {
-      const t = Object.values(n);
-      t.forEach((r) => {
+    if (S.current !== a || y.current !== u) {
+      const e = Object.values(s);
+      e.forEach((r) => {
         r.now = a, r.timezone = u;
-      }), d.current = a, y.current = (o = t[0]) == null ? void 0 : o.timezone, p(f);
+      }), S.current = a, y.current = (o = e[0]) == null ? void 0 : o.timezone, p(l);
     }
-  }, [a, u, n]), {
+  }, [a, u, s]), {
     customSelection: x,
     from: W,
     onSelection: p,
     options: M,
-    selectedOption: f,
+    selectedOption: l,
     to: j
   };
 };

package/dist/es/components/internal/Divider/Divider.js

@@ -1,6 +1,6 @@
 import { jsx as o } from "../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
 import m from "classnames";
-import "./Divider.scss.js";
+/* empty css             */
 import { DIVIDER_CLASS_NAMES as t } from "./constants.js";
 const a = ({ className: r }) => /* @__PURE__ */ o("hr", { className: m(t.base, r) });
 export {

package/dist/es/components/internal/ErrorMessageDisplay/ErrorMessageDisplay.js

@@ -1,11 +1,11 @@
 import { jsx as r } from "../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
 import n from "../Typography/Typography.js";
 import { TypographyVariant as h } from "../Typography/types.js";
-import { useCallback as T } from "../../../external/preact/hooks/dist/hooks.module.js";
+import { useCallback as b } from "../../../external/preact/hooks/dist/hooks.module.js";
 import I from "../../../core/Context/useCoreContext.js";
-import "./ErrorMessageDisplay.scss.js";
+/* empty css                         */
 import N from "../../../images/no-results.svg.js";
-import w from "classnames";
+import k from "classnames";
 import g from "../Button/Button.js";
 import { Fragment as p } from "../../../external/preact/dist/preact.module.js";
 const f = {
@@ -25,9 +25,9 @@ const f = {
   outlined: y = !0,
   renderSecondaryButton: c
 }) => {
-  const { i18n: e, updateCore: _ } = I(), b = T(
+  const { i18n: e, updateCore: _ } = I(), A = b(
     (o) => Array.isArray(o) ? o.map(
-      (d, A) => A === 0 ? /* @__PURE__ */ r(p, { children: [
+      (d, T) => T === 0 ? /* @__PURE__ */ r(p, { children: [
         e.get(d),
         i && i[d] && /* @__PURE__ */ r(p, { children: i[d] })
       ] }) : /* @__PURE__ */ r(p, { children: [
@@ -41,7 +41,7 @@ const f = {
   return /* @__PURE__ */ r(
     "div",
     {
-      className: w(["adyen-pe-error-message-display"], {
+      className: k(["adyen-pe-error-message-display"], {
         "adyen-pe-error-message-display--absolute-position": E,
         "adyen-pe-error-message-display--outlined": y,
         "adyen-pe-error-message-display--with-background": !y,
@@ -54,7 +54,7 @@ const f = {
           /* @__PURE__ */ r("img", { srcSet: t ?? N, alt: e.get("thereWasAnUnexpectedError") })
         ] }) }),
         /* @__PURE__ */ r(n, { variant: h.TITLE, children: e.get(x) }),
-        s && /* @__PURE__ */ r(n, { variant: h.BODY, children: b(s) }),
+        s && /* @__PURE__ */ r(n, { variant: h.BODY, children: A(s) }),
         (m || l || c) && /* @__PURE__ */ r("div", { className: "adyen-pe-error-message-display__button", children: [
           c && c(),
           m && /* @__PURE__ */ r(g, { onClick: m, children: e.get("contactSupport") }),

package/dist/es/components/internal/ExpandableCard/ExpandableCard.js

@@ -1,74 +1,78 @@
-import { jsx as e } from "../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import s from "classnames";
-import { useState as v, useCallback as h, useRef as l, useEffect as I } from "../../../external/preact/hooks/dist/hooks.module.js";
-import "./ExpandableCard.scss.js";
-import b from "../SVGIcons/ChevronUp.js";
-import B from "../SVGIcons/ChevronDown.js";
-import { BASE_CLASS as D, CONTAINER_CLASS as m, CONTAINER_BUTTON_CLASS as L, CONTAINER_FILLED_CLASS as p, CONTAINER_OVERLAY_ID as C, CONTENT_CLASS as N, CONTENT_EXPANDABLE_CLASS as x, CHEVRON_CLASS as R, CONTAINER_OVERLAY_CLASS as g, CONTAINER_HIDDEN_CLASS as k } from "./constants.js";
-import y from "../../../core/Context/useCoreContext.js";
+import { jsx as r } from "../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import n from "classnames";
+import { useState as g, useMemo as k, useCallback as T, useRef as i, useEffect as B } from "../../../external/preact/hooks/dist/hooks.module.js";
 import { useClickOutside as F } from "../../../hooks/element/useClickOutside.js";
-import { Fragment as V } from "../../../external/preact/dist/preact.module.js";
-import T from "../BaseButton/BaseButton.js";
-const U = ({ renderHeader: t, children: u, filled: o, fullWidth: f, ...i }) => {
-  const { i18n: A } = y(), [a, S] = v(!1), r = h(() => S((n) => !n), [S]), E = l(null), c = l(!1), O = l(a), d = F(
+import P from "../../../core/Context/useCoreContext.js";
+import H from "../SVGIcons/ChevronUp.js";
+import V from "../SVGIcons/ChevronDown.js";
+/* empty css                    */
+import { BASE_CLASS as Y, CONTAINER_CLASS as f, CONTAINER_BUTTON_CLASS as x, CONTAINER_FILLED_CLASS as C, CONTAINER_OVERLAY_ID as u, CONTENT_CLASS as A, CONTENT_EXPANDABLE_CLASS as I, CHEVRON_CLASS as v, CONTAINER_OVERLAY_CLASS as w, CONTAINER_HIDDEN_CLASS as U, CONTAINER_IN_FLOW_CLASS as j, CARD_HEIGHT_PROPERTY as b } from "./constants.js";
+import { Fragment as q } from "../../../external/preact/dist/preact.module.js";
+import y from "../BaseButton/BaseButton.js";
+const re = ({ renderHeader: c, children: O, filled: l, fullWidth: S, inFlow: _, ...d }) => {
+  const { i18n: E } = P(), [e, R] = g(!1), a = k(() => _ === !0, [_]), o = T(() => R((s) => !s), [R]), p = i(null), h = i(a), m = i(!1), L = i(e), N = F(
     void 0,
-    h(() => {
-      a && (r(), c.current = !0);
-    }, [a, r])
-  );
-  return I(() => {
-    var n, _;
-    a ? (n = d.current) == null || n.focus() : (O.current !== a && !c.current && ((_ = E.current) == null || _.focus()), c.current = !1), O.current = a;
-  }, [a, d]), /* @__PURE__ */ e("div", { className: D, children: u ? /* @__PURE__ */ e(V, { children: [
-    /* @__PURE__ */ e(
-      T,
+    T(() => {
+      e && (o(), m.current = !0);
+    }, [e, o])
+  ), D = (s) => {
+    var t;
+    s && (a ? (!e || h.current !== a) && s.style.setProperty(b, `${((t = p.current) == null ? void 0 : t.offsetHeight) || 0}px`) : e || s.style.removeProperty(b), h.current = a);
+  };
+  return B(() => {
+    var s, t;
+    e ? (s = N.current) == null || s.focus() : (L.current !== e && !m.current && ((t = p.current) == null || t.focus()), m.current = !1), L.current = e;
+  }, [e, N]), /* @__PURE__ */ r("div", { ref: D, className: Y, children: O ? /* @__PURE__ */ r(q, { children: [
+    /* @__PURE__ */ r(
+      y,
       {
-        className: s(m, L, { [p]: o }),
-        disabled: a,
-        fullWidth: f,
-        "aria-controls": C,
-        "aria-expanded": a,
-        "aria-hidden": a,
-        onClick: r,
-        ref: E,
+        className: n(f, x, { [C]: l }),
+        disabled: e,
+        fullWidth: S,
+        "aria-controls": u,
+        "aria-expanded": e,
+        "aria-hidden": e,
+        onClick: o,
+        ref: p,
         "data-testid": "expand-button",
-        ...i,
+        ...d,
         children: [
-          /* @__PURE__ */ e("span", { className: "adyen-pe-sr-only", children: A.get("expandableCard.expand") }),
-          /* @__PURE__ */ e("div", { className: s(N, x), children: t }),
-          /* @__PURE__ */ e("div", { className: R, children: /* @__PURE__ */ e(B, { role: "presentation" }) })
+          /* @__PURE__ */ r("span", { className: "adyen-pe-sr-only", children: E.get("expandableCard.expand") }),
+          /* @__PURE__ */ r("div", { className: n(A, I), children: c }),
+          /* @__PURE__ */ r("div", { className: v, children: /* @__PURE__ */ r(V, { role: "presentation" }) })
         ]
       }
     ),
-    /* @__PURE__ */ e(
-      T,
+    /* @__PURE__ */ r(
+      y,
       {
-        id: C,
-        className: s(m, L, g, {
-          [p]: o,
-          [k]: !a
+        id: u,
+        className: n(f, x, w, {
+          [C]: l,
+          [U]: !e,
+          [j]: a
         }),
-        disabled: !a,
-        fullWidth: f,
-        "aria-controls": C,
-        "aria-expanded": a,
-        "aria-hidden": !a,
-        onClick: r,
-        ref: d,
+        disabled: !e,
+        fullWidth: S,
+        "aria-controls": u,
+        "aria-expanded": e,
+        "aria-hidden": !e,
+        onClick: o,
+        ref: N,
         "data-testid": "collapse-button",
-        ...i,
+        ...d,
         children: [
-          /* @__PURE__ */ e("span", { className: "adyen-pe-sr-only", children: A.get("expandableCard.collapse") }),
-          /* @__PURE__ */ e("div", { className: s(N, x), children: [
-            t,
-            /* @__PURE__ */ e("div", { children: u })
+          /* @__PURE__ */ r("span", { className: "adyen-pe-sr-only", children: E.get("expandableCard.collapse") }),
+          /* @__PURE__ */ r("div", { className: n(A, I), children: [
+            c,
+            /* @__PURE__ */ r("div", { children: O })
           ] }),
-          /* @__PURE__ */ e("div", { className: R, children: /* @__PURE__ */ e(b, { role: "presentation" }) })
+          /* @__PURE__ */ r("div", { className: v, children: /* @__PURE__ */ r(H, { role: "presentation" }) })
         ]
       }
     )
-  ] }) : /* @__PURE__ */ e("div", { className: s(m, { [p]: o }), ...i, children: /* @__PURE__ */ e("div", { className: N, children: t }) }) });
-}, K = U;
+  ] }) : /* @__PURE__ */ r("div", { className: n(f, { [C]: l }), ...d, children: /* @__PURE__ */ r("div", { className: A, children: c }) }) });
+};
 export {
-  K as default
+  re as default
 };

package/dist/es/components/internal/ExpandableCard/constants.js

@@ -1,13 +1,15 @@
-const n = "adyen-pe-expandable-card", _ = n + "__container", S = _ + "--button", C = _ + "--filled", o = _ + "--hidden", A = _ + "--overlay", t = A, N = n + "__content", E = N + "--expandable", c = n + "__chevron";
+const n = "adyen-pe-expandable-card", A = n, _ = A + "__container", N = A + "__content", S = A + "__chevron", E = _ + "--button", o = _ + "--filled", t = _ + "--hidden", c = _ + "--in-flow", C = _ + "--overlay", L = N + "--expandable", O = `--${n}-height`, T = C;
 export {
-  n as BASE_CLASS,
-  c as CHEVRON_CLASS,
-  S as CONTAINER_BUTTON_CLASS,
+  A as BASE_CLASS,
+  O as CARD_HEIGHT_PROPERTY,
+  S as CHEVRON_CLASS,
+  E as CONTAINER_BUTTON_CLASS,
   _ as CONTAINER_CLASS,
-  C as CONTAINER_FILLED_CLASS,
-  o as CONTAINER_HIDDEN_CLASS,
-  A as CONTAINER_OVERLAY_CLASS,
-  t as CONTAINER_OVERLAY_ID,
+  o as CONTAINER_FILLED_CLASS,
+  t as CONTAINER_HIDDEN_CLASS,
+  c as CONTAINER_IN_FLOW_CLASS,
+  C as CONTAINER_OVERLAY_CLASS,
+  T as CONTAINER_OVERLAY_ID,
   N as CONTENT_CLASS,
-  E as CONTENT_EXPANDABLE_CLASS
+  L as CONTENT_EXPANDABLE_CLASS
 };

package/dist/es/components/internal/FilterBar/FilterBar.js

@@ -4,42 +4,42 @@ import { ButtonVariant as n } from "../Button/types.js";
 import { useState as s, useEffect as c } from "../../../external/preact/hooks/dist/hooks.module.js";
 import m from "../../../core/Context/useCoreContext.js";
 import { useResponsiveViewport as u, mediaQueries as f } from "../../../hooks/useResponsiveViewport.js";
-import "./FilterBar.scss.js";
+/* empty css               */
 import a from "../Button/Button.js";
-import d from "../Icon/Icon.js";
+import { Icon as d } from "../Icon/Icon.js";
 import { isFunction as b } from "../../../utils/value/is.js";
 const o = "adyen-pe-filter-bar-mobile-switch", E = () => {
-  const t = u(f.down.xs), [e, r] = s(!t);
+  const e = u(f.down.xs), [t, r] = s(!e);
   return c(() => {
-    r(!t);
-  }, [t]), { isMobileViewport: t, showingFilters: e, setShowingFilters: r };
-}, I = ({ isMobileViewport: t, showingFilters: e, setShowingFilters: r }) => t ? /* @__PURE__ */ i("div", { className: o, children: /* @__PURE__ */ i(
+    r(!e);
+  }, [e]), { isMobileViewport: e, showingFilters: t, setShowingFilters: r };
+}, F = ({ isMobileViewport: e, showingFilters: t, setShowingFilters: r }) => e ? /* @__PURE__ */ i("div", { className: o, children: /* @__PURE__ */ i(
   a,
   {
     iconButton: !0,
     className: `${o}__button`,
     disabled: !b(r),
-    onClick: () => r == null ? void 0 : r(!e),
+    onClick: () => r == null ? void 0 : r(!t),
     variant: n.SECONDARY,
-    children: /* @__PURE__ */ i(d, { name: e ? "cross" : "filter" })
+    children: /* @__PURE__ */ i(d, { name: t ? "cross" : "filter" })
   }
-) }) : null, B = (t) => {
-  const { i18n: e } = m();
-  return t.showingFilters ? /* @__PURE__ */ i(
+) }) : null, I = (e) => {
+  const { i18n: t } = m();
+  return e.showingFilters ? /* @__PURE__ */ i(
     "div",
     {
-      "aria-label": e.get("filterBar"),
-      className: l("adyen-pe-filter-bar", { "adyen-pe-filter-bar__content--mobile": t.isMobileViewport }),
+      "aria-label": t.get("filterBar"),
+      className: l("adyen-pe-filter-bar", { "adyen-pe-filter-bar__content--mobile": e.isMobileViewport }),
       children: [
-        t.children,
-        t.canResetFilters && !!t.resetFilters && /* @__PURE__ */ i(a, { variant: n.TERTIARY, onClick: t.resetFilters, children: e.get("button.clearAll") })
+        e.children,
+        e.canResetFilters && !!e.resetFilters && /* @__PURE__ */ i(a, { variant: n.TERTIARY, onClick: e.resetFilters, children: t.get("button.clearAll") })
       ]
     }
   ) : null;
-}, M = B;
+};
 export {
-  B as FilterBar,
-  I as FilterBarMobileSwitch,
-  M as default,
+  I as FilterBar,
+  F as FilterBarMobileSwitch,
+  I as default,
   E as useFilterBarState
 };

package/dist/es/components/internal/FilterBar/components/FilterButton/FilterButton.js

@@ -1,18 +1,18 @@
-import { jsx as t } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import c from "../../../Button/hooks/useButton.js";
+import { jsx as e } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import d from "../../../Button/hooks/useButton.js";
 import { TypographyElement as T, TypographyVariant as y } from "../../../Typography/types.js";
-import B from "../../../Typography/Typography.js";
-import { useMemo as e } from "../../../../../external/preact/hooks/dist/hooks.module.js";
-import "./FilterButton.scss.js";
-import { fixedForwardRef as d } from "../../../../../utils/preact/fixedForwardRef.js";
-import { parseClassName as F } from "../../../../../utils/preact/className.js";
-import { parseBooleanProp as g } from "../../../../../utils/preact/props.js";
-const h = "adyen-pe-filter-button";
-function E({ className: o, classNameModifiers: a = [], children: m, disabled: r, onClick: n, ...s }, p) {
-  const i = e(() => F("", o) || "", [o]), l = e(() => g(r), [r]), { classes: u, click: f } = c(i, a, h, l, n);
-  return /* @__PURE__ */ t("button", { className: u, ref: p, onClick: f, ...s, children: /* @__PURE__ */ t(B, { el: T.DIV, variant: y.BODY, stronger: !0, children: m }) });
+import N from "../../../Typography/Typography.js";
+import { useMemo as s } from "../../../../../external/preact/hooks/dist/hooks.module.js";
+/* empty css                  */
+import { fixedForwardRef as B } from "../../../../../utils/preact/fixedForwardRef.js";
+import { parseClassName as b } from "../../../../../utils/preact/className.js";
+import { parseBooleanProp as h } from "../../../../../utils/preact/props.js";
+const F = "adyen-pe-filter-button";
+function g(o, a) {
+  const { className: t, classNameModifiers: i = [], children: m, disabled: r, onClick: n, ...l } = o, c = s(() => b("", t) || "", [t]), p = s(() => h(r), [r]), { classes: u, click: f } = d(c, i, F, p, o, n);
+  return /* @__PURE__ */ e("button", { className: u, ref: a, onClick: f, ...l, children: /* @__PURE__ */ e(N, { el: T.DIV, variant: y.BODY, stronger: !0, children: m }) });
 }
-const k = d(E);
+const _ = B(g);
 export {
-  k as default
+  _ as default
 };

package/dist/es/components/internal/FilterBar/filters/AmountFilter/AmountFilter.js

@@ -1,29 +1,29 @@
-import { jsx as P } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import { RangeSelection as w } from "./RangeSelection.js";
-import { useState as T, useMemo as z, useCallback as E } from "../../../../../external/preact/hooks/dist/hooks.module.js";
-import { PopoverContainerSize as B } from "../../../Popover/types.js";
-import D from "../../../../../core/Context/useCoreContext.js";
-import { AMOUNT_MULTIPLIER as L } from "./constants.js";
-import F from "../BaseFilter/BaseFilter.js";
+import { jsx as I } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import { RangeSelection as P } from "./RangeSelection.js";
+import { useState as u, useMemo as w, useCallback as T } from "../../../../../external/preact/hooks/dist/hooks.module.js";
+import { PopoverContainerSize as z } from "../../../Popover/types.js";
+import B from "../../../../../core/Context/useCoreContext.js";
+import { AMOUNT_MULTIPLIER as E } from "./constants.js";
+import D from "../BaseFilter/BaseFilter.js";
 import { isUndefined as f } from "../../../../../utils/value/is.js";
-import { EMPTY_OBJECT as O } from "../../../../../utils/value/constants.js";
-const G = ({ updateFilters: $, selectedCurrencies: t, availableCurrencies: m, ...x }) => {
-  const { i18n: g } = D(), [y, U] = T(), [p, h] = T(), M = z(() => (t == null ? void 0 : t.length) === 1 || (m == null ? void 0 : m.length) === 1, [m == null ? void 0 : m.length, t == null ? void 0 : t.length]), S = E(
+import { EMPTY_OBJECT as F } from "../../../../../utils/value/constants.js";
+const d = ({ updateFilters: $, selectedCurrencies: t, availableCurrencies: m, ...x }) => {
+  const { i18n: g } = B(), [y, L] = u(), [p, h] = u(), M = w(() => (t == null ? void 0 : t.length) === 1 || (m == null ? void 0 : m.length) === 1, [m == null ? void 0 : m.length, t == null ? void 0 : t.length]), S = T(
     (n, o) => {
-      const A = (t == null ? void 0 : t[0]) || (m == null ? void 0 : m[0]), I = o && A ? {
+      const A = (t == null ? void 0 : t[0]) || (m == null ? void 0 : m[0]), V = o && A ? {
         style: "currency",
         currency: A,
         currencyDisplay: "symbol"
       } : void 0;
-      return n.toLocaleString(g.locale, I);
+      return n.toLocaleString(g.locale, V);
     },
     [m, g, t]
-  ), V = E(
+  ), U = T(
     (n) => {
-      const { minAmount: o, maxAmount: A } = n ?? O;
-      U({ minAmount: o, maxAmount: A }), f(o) && f(A) && h(void 0), $({
-        minAmount: f(o) ? void 0 : String(Math.round(o * L)),
-        maxAmount: f(A) ? void 0 : String(Math.round(A * L))
+      const { minAmount: o, maxAmount: A } = n ?? F;
+      L({ minAmount: o, maxAmount: A }), f(o) && f(A) && h(void 0), $({
+        minAmount: f(o) ? void 0 : String(Math.round(o * E)),
+        maxAmount: f(A) ? void 0 : String(Math.round(A * E))
       });
     },
     [$]
@@ -34,24 +34,24 @@ const G = ({ updateFilters: $, selectedCurrencies: t, availableCurrencies: m, ..
       `${S(n, M)} ${g.get("to").toLowerCase()} ${S(o, M)}`
     ) : !f(n) && f(o) && n >= 0 ? h(`${g.get("from")} ${S(n, M)}`) : f(n) && !f(o) ? h(`${g.get("to")} ${S(o, M)}`) : h(void 0);
   }
-  return /* @__PURE__ */ P(
-    F,
+  return /* @__PURE__ */ I(
+    D,
     {
       ...x,
       updateFilters: $,
       minAmount: x.minAmount,
       maxAmount: x.maxAmount,
-      onChange: V,
+      onChange: U,
       value: p,
       label: p || x.label,
       type: "text",
-      containerSize: B.MEDIUM,
+      containerSize: z.MEDIUM,
       selectedCurrencies: t,
       availableCurrencies: m,
-      render: w
+      render: P
     }
   );
 };
 export {
-  G as AmountFilter
+  d as AmountFilter
 };