@adyen/adyen-platform-experience-web 1.9.0 → 1.10.1

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

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

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

@@ -1,65 +1,83 @@
-import { useState as a, useRef as R, useMemo as i, useCallback as W } from "../../../../../external/preact/hooks/dist/hooks.module.js";
-import N from "../../../../../core/Context/useCoreContext.js";
-import q from "../../../Calendar/calendar/timerange/presets/yearToDate.js";
-import A from "../../../Calendar/calendar/timerange/presets/lastMonth.js";
-import E from "../../../Calendar/calendar/timerange/presets/thisMonth.js";
-import K from "../../../Calendar/calendar/timerange/presets/lastWeek.js";
-import Z from "../../../Calendar/calendar/timerange/presets/thisWeek.js";
-import y from "../../../Calendar/calendar/timerange/presets/lastNDays.js";
-const Y = () => Object.freeze({
-  "common.filters.types.date.rangeSelect.options.last7Days": y(7),
-  "common.filters.types.date.rangeSelect.options.last30Days": y(30),
-  "common.filters.types.date.rangeSelect.options.last90Days": y(90),
-  "common.filters.types.date.rangeSelect.options.thisWeek": Z(),
-  "common.filters.types.date.rangeSelect.options.lastWeek": K(),
-  "common.filters.types.date.rangeSelect.options.thisMonth": E(),
-  "common.filters.types.date.rangeSelect.options.lastMonth": A(),
-  "common.filters.types.date.rangeSelect.options.yearToDate": q()
-}), _ = ({
-  now: r = Date.now(),
-  options: n,
-  selectedOption: m,
-  timezone: l
+import { useState as l, useRef as b, useMemo as m, useCallback as I } from "../../../../../external/preact/hooks/dist/hooks.module.js";
+import C from "../../../../../core/Context/useCoreContext.js";
+import k from "../../../Calendar/calendar/timerange/presets/yearToDate.js";
+import K from "../../../Calendar/calendar/timerange/presets/lastMonth.js";
+import z from "../../../Calendar/calendar/timerange/presets/thisMonth.js";
+import x from "../../../Calendar/calendar/timerange/presets/lastWeek.js";
+import F from "../../../Calendar/calendar/timerange/presets/thisWeek.js";
+import u from "../../../Calendar/calendar/timerange/presets/lastNDays.js";
+const s = Object.freeze({
+  LAST_7_DAYS: "common.filters.types.date.rangeSelect.options.last7Days",
+  LAST_30_DAYS: "common.filters.types.date.rangeSelect.options.last30Days",
+  LAST_90_DAYS: "common.filters.types.date.rangeSelect.options.last90Days",
+  THIS_WEEK: "common.filters.types.date.rangeSelect.options.thisWeek",
+  LAST_WEEK: "common.filters.types.date.rangeSelect.options.lastWeek",
+  THIS_MONTH: "common.filters.types.date.rangeSelect.options.thisMonth",
+  LAST_MONTH: "common.filters.types.date.rangeSelect.options.lastMonth",
+  YEAR_TO_DATE: "common.filters.types.date.rangeSelect.options.yearToDate"
+}), U = ({
+  exclude: n = []
+} = {}) => {
+  const e = {
+    [s.LAST_7_DAYS]: u(7),
+    [s.LAST_30_DAYS]: u(30),
+    [s.LAST_90_DAYS]: u(90),
+    [s.THIS_WEEK]: F(),
+    [s.LAST_WEEK]: x(),
+    [s.THIS_MONTH]: z(),
+    [s.LAST_MONTH]: K(),
+    [s.YEAR_TO_DATE]: k()
+  };
+  if (!n?.length) return Object.freeze(e);
+  const i = new Set(n);
+  return Object.freeze(
+    Object.fromEntries(Object.entries(e).filter(([a]) => !i.has(a)))
+  );
+}, V = ({
+  now: n = Date.now(),
+  options: e,
+  selectedOption: i,
+  timezone: a
 }) => {
-  const { i18n: p } = N(), [j, S] = a(), [M, O] = a(), [f, u] = a(), h = R(), D = R(), [e, T, s] = i(() => {
-    const o = p.get("common.filters.types.date.rangeSelect.options.custom"), t = Object.keys(n), c = Object.freeze(t.map((d) => p.get(d)));
-    return [o, (d, v = c) => {
-      const z = v.findIndex((I) => I === d);
-      return n[t[z]];
-    }, c];
-  }, [p, n]), [b, k] = a(m === e), C = i(() => Object.freeze([...s, e]), [e, s]), x = i(
-    () => b ? C : s,
-    [b, s, C]
-  ), g = W(
-    (o) => {
-      const t = T(o, s);
-      t && (S(t.from), O(t.to), k(!1), u(o));
+  const { i18n: S } = C(), [M, O] = l(), [R, A] = l(), [p, f] = l(), g = b(), E = b(), [o, d, r] = m(() => {
+    const c = S.get("common.filters.types.date.rangeSelect.options.custom"), t = Object.keys(e), L = Object.freeze(t.map((_) => S.get(_)));
+    return [c, (_, N = L) => {
+      const Y = N.findIndex((H) => H === _);
+      return e[t[Y]];
+    }, L];
+  }, [S, e]), [y, D] = l(i === o), h = m(() => Object.freeze([...r, o]), [o, r]), W = m(
+    () => y ? h : r,
+    [y, r, h]
+  ), T = I(
+    (c) => {
+      const t = d(c, r);
+      t && (O(t.from), A(t.to), D(!1), f(c));
     },
-    [e, T, f, s]
-  ), F = W(() => {
-    S(void 0), O(void 0), k(!0), u(e);
-  }, [e]);
-  return i(() => {
-    m === e ? u(e) : g(m);
-  }, []), i(() => {
-    var o;
-    if (h.current !== r || D.current !== l) {
-      const t = Object.values(n);
-      t.forEach((c) => {
-        c.now = r, c.timezone = l;
-      }), h.current = r, D.current = (o = t[0]) == null ? void 0 : o.timezone, g(f);
+    [o, d, p, r]
+  ), j = I(() => {
+    O(void 0), A(void 0), D(!0), f(o);
+  }, [o]);
+  return m(() => {
+    i === o ? f(o) : T(i);
+  }, []), m(() => {
+    if (g.current !== n || E.current !== a) {
+      const c = Object.values(e);
+      c.forEach((t) => {
+        t.now = n, t.timezone = a;
+      }), g.current = n, E.current = c[0]?.timezone, T(p);
     }
-  }, [r, l, n]), {
-    customSelection: F,
-    from: j,
-    onSelection: g,
-    options: x,
-    selectedOption: f,
-    to: M
+  }, [n, a, e]), {
+    customSelection: j,
+    from: M,
+    onSelection: T,
+    options: W,
+    selectedOption: p,
+    to: R
   };
 };
 export {
-  _ as default,
-  Y as getTimeRangeSelectionDefaultPresetOptions,
-  _ as useTimeRangeSelection
+  s as TIME_RANGE_SELECTION_PRESET_OPTION_KEYS,
+  V as default,
+  U as getTimeRangeSelectionDefaultPresetOptions,
+  V as useTimeRangeSelection
 };

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

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

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

@@ -1,5 +1,6 @@
 const e = {
-  base: "adyen-pe-divider"
+  base: "adyen-pe-divider",
+  vertical: "adyen-pe-divider--vertical"
 };
 export {
   e as DIVIDER_CLASS_NAMES

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

@@ -1,74 +1,88 @@
 import { jsx as e } from "../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import I from "classnames";
-import u from "../Typography/Typography.js";
-import N from "../../../core/Context/useCoreContext.js";
-import { TypographyVariant as _, TypographyElement as P } from "../Typography/types.js";
-import { useCallback as C } from "../../../external/preact/hooks/dist/hooks.module.js";
+import P from "classnames";
+import p from "../Typography/Typography.js";
+import C from "../../../core/Context/useCoreContext.js";
+import { TypographyVariant as _, TypographyElement as M } from "../Typography/types.js";
+import { useCallback as S } from "../../../external/preact/hooks/dist/hooks.module.js";
 /* empty css                         */
-import { Fragment as f } from "../../../external/preact/dist/preact.module.js";
+import { Fragment as y } from "../../../external/preact/dist/preact.module.js";
 import g from "../Button/Button.js";
-const r = "adyen-pe-error-message-display", y = 680, t = {
-  base: r,
-  base_absolutePosition: r + "--absolute-position",
-  base_centered: r + "--centered",
-  base_outlined: r + "--outlined",
-  base_withBackground: r + "--with-background",
-  button: r + "__button",
-  illustration: r + "__illustration"
-}, M = () => /* @__PURE__ */ e(f, { children: [
+const t = "adyen-pe-error-message-display", f = 680, r = {
+  base: t,
+  base_absolutePosition: t + "--absolute-position",
+  base_centered: t + "--centered",
+  base_outlined: t + "--outlined",
+  base_withBackground: t + "--with-background",
+  base_withHeaderOffset: t + "--with-header-offset",
+  base_condensed: t + "--condensed",
+  button: t + "__button",
+  illustration: t + "__illustration"
+}, D = () => /* @__PURE__ */ e(y, { children: [
   " ",
   /* @__PURE__ */ e("br", {}),
   " "
-] }), K = ({
-  title: x,
-  message: n,
-  imageDesktop: a,
-  imageMobile: d,
-  withImage: E,
-  centered: v,
-  refreshComponent: p,
-  onContactSupport: o,
-  translationValues: s,
-  absolutePosition: T = !0,
+] }), U = ({
+  title: w,
+  message: c,
+  imageDesktop: i,
+  imageMobile: l,
+  withImage: v,
+  centered: x,
+  refreshComponent: m,
+  onRefreshComponent: E,
+  onContactSupport: a,
+  translationValues: d,
+  absolutePosition: A = !0,
   outlined: b = !0,
-  renderSecondaryButton: c,
-  withBackground: k
+  renderSecondaryButton: o,
+  withBackground: I,
+  withHeaderOffset: T,
+  condensed: k
 }) => {
-  const { i18n: i, updateCore: w, getImageAsset: l } = N(), A = C(
-    (m) => Array.isArray(m) ? m.map((h, B) => /* @__PURE__ */ e(f, { children: [
-      B > 0 && /* @__PURE__ */ e(M, {}),
-      i.get(h),
-      s == null ? void 0 : s[h]
-    ] })) : i.get(m),
-    [i, s]
+  const { i18n: s, updateCore: O, getImageAsset: h } = C(), B = S(
+    (n) => Array.isArray(n) ? n.map((u, N) => /* @__PURE__ */ e(y, { children: [
+      N > 0 && /* @__PURE__ */ e(D, {}),
+      s.get(u),
+      d?.[u]
+    ] })) : s.get(n),
+    [s, d]
   );
   return /* @__PURE__ */ e(
     "div",
     {
-      className: I(t.base, {
-        [t.base_absolutePosition]: T,
-        [t.base_centered]: v,
-        [t.base_outlined]: b,
-        [t.base_withBackground]: k !== !1 && !b
+      className: P(r.base, {
+        [r.base_absolutePosition]: A,
+        [r.base_centered]: x,
+        [r.base_outlined]: b,
+        [r.base_withBackground]: I !== !1 && !b,
+        [r.base_withHeaderOffset]: T,
+        [r.base_condensed]: k
       }),
       children: [
-        (a || d || E) && /* @__PURE__ */ e("div", { className: t.illustration, children: /* @__PURE__ */ e("picture", { children: [
-          /* @__PURE__ */ e("source", { type: "image/svg+xml", media: `(min-width: ${y}px)`, srcSet: a }),
-          /* @__PURE__ */ e("source", { type: "image/svg+xml", media: `(max-width: ${y}px)`, srcSet: d }),
-          /* @__PURE__ */ e("img", { srcSet: a ?? (l == null ? void 0 : l({ name: "no-results" })), alt: "" })
+        (i || l || v) && /* @__PURE__ */ e("div", { className: r.illustration, children: /* @__PURE__ */ e("picture", { children: [
+          /* @__PURE__ */ e("source", { type: "image/svg+xml", media: `(min-width: ${f}px)`, srcSet: i }),
+          /* @__PURE__ */ e(
+            "source",
+            {
+              type: "image/svg+xml",
+              media: `(max-width: ${f}px)`,
+              srcSet: l ?? h?.({ name: "wrong-environment", subFolder: "images/small" })
+            }
+          ),
+          /* @__PURE__ */ e("img", { srcSet: i ?? h?.({ name: "wrong-environment" }), alt: "" })
         ] }) }),
-        /* @__PURE__ */ e(u, { el: P.DIV, variant: _.TITLE, children: i.get(x) }),
-        n && /* @__PURE__ */ e(u, { variant: _.BODY, children: A(n) }),
-        (o || p || c) && /* @__PURE__ */ e("div", { className: t.button, children: [
-          c && c(),
-          o && /* @__PURE__ */ e(g, { onClick: o, children: i.get("common.actions.contactSupport.labels.reachOut") }),
-          !o && p && /* @__PURE__ */ e(g, { onClick: w, children: i.get("common.actions.refresh.labels.default") })
+        /* @__PURE__ */ e(p, { el: M.DIV, variant: _.TITLE, children: s.get(w) }),
+        c && /* @__PURE__ */ e(p, { variant: _.BODY, children: B(c) }),
+        (a || m || o) && /* @__PURE__ */ e("div", { className: r.button, children: [
+          o && o(),
+          a && /* @__PURE__ */ e(g, { onClick: a, children: s.get("common.actions.contactSupport.labels.reachOut") }),
+          !a && m && /* @__PURE__ */ e(g, { onClick: E ?? O, children: s.get("common.actions.refresh.labels.default") })
         ] })
       ]
     }
   );
 };
 export {
-  K as ErrorMessageDisplay,
-  y as IMAGE_BREAKPOINT_MEDIUM_PX
+  U as ErrorMessageDisplay,
+  f as IMAGE_BREAKPOINT_MEDIUM_PX
 };

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

@@ -1,6 +1,6 @@
 import { jsx as s } from "../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import a from "classnames";
-import { useState as T, useMemo as x, useCallback as b, useRef as c, useLayoutEffect as z, useEffect as g } from "../../../external/preact/hooks/dist/hooks.module.js";
+import n from "classnames";
+import { useState as T, useMemo as x, useCallback as b, useRef as i, useLayoutEffect as z, useEffect as g } from "../../../external/preact/hooks/dist/hooks.module.js";
 import { useClickOutside as U } from "../../../hooks/element/useClickOutside.js";
 import { useUniqueId as V } from "../../../hooks/useUniqueId.js";
 /* empty css                    */
@@ -9,50 +9,49 @@ import { Fragment as D } from "../../../external/preact/dist/preact.module.js";
 import F from "../BaseButton/BaseButton.js";
 import { Icon as P } from "../Icon/Icon.js";
 import { isFunction as M } from "../../../utils/value/is.js";
-const ae = ({ renderContent: o, children: O, filled: d, fullWidth: S, inFlow: _, ...l }) => {
-  const [r, v] = T(!1), [R, h] = T(0), n = x(() => _ === !0, [_]), i = b(() => v((e) => !e), [v]), L = c(null), u = c(null), f = `elem-${V()}`, m = c(!1), I = c(r), p = U(
+const ae = ({ renderContent: a, children: O, filled: c, fullWidth: S, inFlow: _, ...d }) => {
+  const [e, v] = T(!1), [R, h] = T(0), t = x(() => _ === !0, [_]), o = b(() => v((r) => !r), [v]), L = i(null), l = i(null), u = `elem-${V()}`, f = i(!1), I = i(e), m = U(
     void 0,
     b(() => {
-      r && (i(), m.current = !0);
-    }, [r, i])
-  ), N = x(
-    () => M(o) ? o : ({ collapsibleContent: e }) => /* @__PURE__ */ s(D, { children: [
-      o,
-      e && /* @__PURE__ */ s("div", { children: e })
+      e && (o(), f.current = !0);
+    }, [e, o])
+  ), p = x(
+    () => M(a) ? a : ({ collapsibleContent: r }) => /* @__PURE__ */ s(D, { children: [
+      a,
+      r && /* @__PURE__ */ s("div", { children: r })
     ] }),
-    [o]
+    [a]
   );
   return z(() => {
-    const e = L.current;
-    e && (n ? e.style.setProperty(y, `${R}px`) : r || e.style.removeProperty(y));
-  }, [R, n, r]), g(() => {
-    if (!n) return void h(0);
-    const e = u.current;
-    if (!e) return;
-    const t = new ResizeObserver((q) => {
+    const r = L.current;
+    r && (t ? r.style.setProperty(y, `${R}px`) : e || r.style.removeProperty(y));
+  }, [R, t, e]), g(() => {
+    if (!t) return void h(0);
+    const r = l.current;
+    if (!r) return;
+    const N = new ResizeObserver((q) => {
       for (const w of q)
-        w.target === e && h(e.offsetHeight || 0);
+        w.target === r && h(r.offsetHeight || 0);
     });
-    return t.observe(e), () => {
-      t.unobserve(e), t.disconnect();
+    return N.observe(r), () => {
+      N.unobserve(r), N.disconnect();
     };
-  }, [n]), g(() => {
-    var e, t;
-    r ? (e = p.current) == null || e.focus() : (I.current !== r && !m.current && ((t = u.current) == null || t.focus()), m.current = !1), I.current = r;
-  }, [r, p]), /* @__PURE__ */ s("div", { ref: L, className: Y, children: O ? /* @__PURE__ */ s(D, { children: [
+  }, [t]), g(() => {
+    e ? m.current?.focus() : (I.current !== e && !f.current && l.current?.focus(), f.current = !1), I.current = e;
+  }, [e, m]), /* @__PURE__ */ s("div", { ref: L, className: Y, children: O ? /* @__PURE__ */ s(D, { children: [
     /* @__PURE__ */ s(
       F,
       {
-        className: a(E, B, { [A]: d }),
-        disabled: r,
+        className: n(E, B, { [A]: c }),
+        disabled: e,
         fullWidth: S,
-        onClick: i,
-        ref: u,
+        onClick: o,
+        ref: l,
         "data-testid": "expand-button",
-        ...r ? { "aria-hidden": !0 } : { "aria-controls": f, "aria-expanded": !1 },
-        ...l,
+        ...e ? { "aria-hidden": !0 } : { "aria-controls": u, "aria-expanded": !1 },
+        ...d,
         children: [
-          /* @__PURE__ */ s("div", { className: a(C, H), children: N({ isExpanded: r }) }),
+          /* @__PURE__ */ s("div", { className: n(C, H), children: p({ isExpanded: e }) }),
           /* @__PURE__ */ s("div", { className: k, children: /* @__PURE__ */ s(P, { name: "chevron-down" }) })
         ]
       }
@@ -60,26 +59,26 @@ const ae = ({ renderContent: o, children: O, filled: d, fullWidth: S, inFlow: _,
     /* @__PURE__ */ s(
       F,
       {
-        id: f,
-        className: a(E, B, $, {
-          [A]: d,
-          [G]: !r,
-          [j]: n
+        id: u,
+        className: n(E, B, $, {
+          [A]: c,
+          [G]: !e,
+          [j]: t
         }),
-        disabled: !r,
+        disabled: !e,
         fullWidth: S,
-        onClick: i,
-        ref: p,
+        onClick: o,
+        ref: m,
         "data-testid": "collapse-button",
-        ...r ? { "aria-controls": f, "aria-expanded": !0 } : { role: "presentation" },
-        ...l,
+        ...e ? { "aria-controls": u, "aria-expanded": !0 } : { role: "presentation" },
+        ...d,
         children: [
-          /* @__PURE__ */ s("div", { className: a(C, H), children: N({ isExpanded: r, collapsibleContent: O }) }),
+          /* @__PURE__ */ s("div", { className: n(C, H), children: p({ isExpanded: e, collapsibleContent: O }) }),
           /* @__PURE__ */ s("div", { className: k, children: /* @__PURE__ */ s(P, { name: "chevron-up" }) })
         ]
       }
     )
-  ] }) : /* @__PURE__ */ s("div", { className: a(E, { [A]: d }), ...l, children: /* @__PURE__ */ s("div", { className: C, children: N({ isExpanded: !1 }) }) }) });
+  ] }) : /* @__PURE__ */ s("div", { className: n(E, { [A]: c }), ...d, children: /* @__PURE__ */ s("div", { className: C, children: p({ isExpanded: !1 }) }) }) });
 };
 export {
   ae as default

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

@@ -1,28 +1,28 @@
-import { jsx as a } from "../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import { jsx as i } from "../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
 import b from "classnames";
 import { ButtonVariant as c } from "../Button/types.js";
 import { useState as C, useEffect as B, useMemo as I } from "../../../external/preact/hooks/dist/hooks.module.js";
 import m from "../../../core/Context/useCoreContext.js";
-import { useResponsiveContainer as x, containerQueries as E } from "../../../hooks/useResponsiveContainer.js";
+import { useResponsiveContainer as h, containerQueries as x } from "../../../hooks/useResponsiveContainer.js";
 /* empty css               */
-import { useUniqueId as p } from "../../../hooks/useUniqueId.js";
+import { useUniqueId as F } from "../../../hooks/useUniqueId.js";
 import d from "../Button/Button.js";
-import { Icon as v } from "../Icon/Icon.js";
-import { isFunction as y } from "../../../utils/value/is.js";
-const s = "adyen-pe-filter-bar-mobile-switch", O = () => {
-  const e = x(E.down.xs), [t, i] = C(!e), r = `filters-${p()}`;
+import { Icon as S } from "../Icon/Icon.js";
+import { isFunction as E } from "../../../utils/value/is.js";
+const s = "adyen-pe-filter-bar-mobile-switch", w = () => {
+  const e = h(x.down.xs), [t, o] = C(!e), r = `filters-${F()}`;
   return B(() => {
-    i(!e);
-  }, [e]), { filterBarElementId: r, isMobileContainer: e, showingFilters: t, setShowingFilters: i };
-}, Y = ({
+    o(!e);
+  }, [e]), { filterBarElementId: r, isMobileContainer: e, showingFilters: t, setShowingFilters: o };
+}, k = ({
   ariaLabelKey: e,
   filterBarElementId: t,
-  isMobileContainer: i,
+  isMobileContainer: o,
   showingFilters: r,
-  setShowingFilters: o
+  setShowingFilters: n
 }) => {
-  const { i18n: n } = m(), f = I(() => n.get(e ?? "common.filters.mobile.label"), [n]), l = !y(o), u = !l && !!r;
-  return i ? /* @__PURE__ */ a("div", { className: s, children: /* @__PURE__ */ a(
+  const { i18n: a } = m(), f = I(() => a.get(e ?? "common.filters.mobile.label"), [a]), l = !E(n), u = !l && !!r;
+  return o ? /* @__PURE__ */ i("div", { className: s, children: /* @__PURE__ */ i(
     d,
     {
       iconButton: !0,
@@ -31,14 +31,14 @@ const s = "adyen-pe-filter-bar-mobile-switch", O = () => {
       "aria-label": f,
       "aria-expanded": u,
       "aria-controls": t,
-      onClick: () => o == null ? void 0 : o(!r),
+      onClick: () => n?.(!r),
       variant: c.SECONDARY,
-      children: /* @__PURE__ */ a(v, { name: r ? "cross" : "filter" })
+      children: /* @__PURE__ */ i(S, { name: r ? "cross" : "filter" })
     }
   ) }) : null;
-}, $ = (e) => {
+}, O = (e) => {
   const { i18n: t } = m();
-  return e.showingFilters ? /* @__PURE__ */ a(
+  return e.showingFilters ? /* @__PURE__ */ i(
     "div",
     {
       role: "group",
@@ -48,14 +48,14 @@ const s = "adyen-pe-filter-bar-mobile-switch", O = () => {
       id: e.filterBarElementId,
       children: [
         e.children,
-        e.canResetFilters && !!e.resetFilters && /* @__PURE__ */ a(d, { variant: c.TERTIARY, onClick: e.resetFilters, children: t.get("common.filters.controls.resetAll.label") })
+        e.canResetFilters && !!e.resetFilters && /* @__PURE__ */ i(d, { variant: c.TERTIARY, onClick: e.resetFilters, children: t.get("common.filters.controls.resetAll.label") })
       ]
     }
   ) : null;
 };
 export {
-  $ as FilterBar,
-  Y as FilterBarMobileSwitch,
-  $ as default,
-  O as useFilterBarState
+  O as FilterBar,
+  k as FilterBarMobileSwitch,
+  O as default,
+  w as useFilterBarState
 };

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

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