@adyen/adyen-platform-experience-web 1.0.0 → 1.0.2

package/dist/es/components/internal/FilterBar/filters/DateFilter/DateFilterCore.js

@@ -1,126 +1,141 @@
-import { jsx as T } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import { useState as y, useCallback as M, useMemo as R, useEffect as h, useRef as B } from "../../../../../external/preact/hooks/dist/hooks.module.js";
-import k from "../../../../../core/Context/useCoreContext.js";
-import { DateRangeFilterParam as b } from "./types.js";
+import k from "../../../../hooks/useTimezoneAwareDateFormatting.js";
+import { useState as p, useCallback as v, useMemo as R, useEffect as C, useRef as I } from "../../../../../external/preact/hooks/dist/hooks.module.js";
+import x from "../../../../../core/Context/useCoreContext.js";
+import { DateRangeFilterParam as E } from "./types.js";
 import "./DateFilterCore.scss.js";
-import I from "../BaseFilter/BaseFilter.js";
-import V from "../../../DatePicker/DatePicker.js";
-import { EMPTY_OBJECT as A } from "../../../../../utils/value/constants.js";
-import { CommitAction as E } from "../../../../../hooks/useCommitAction/types.js";
-const v = {
+import { jsx as S } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import V from "../BaseFilter/BaseFilter.js";
+import L from "../../../DatePicker/DatePicker.js";
+import { EMPTY_OBJECT as Y } from "../../../../../utils/value/constants.js";
+import { CommitAction as M } from "../../../../../hooks/useCommitAction/types.js";
+const B = {
   month: "short",
   day: "numeric",
   year: "numeric"
-}, L = new Intl.DateTimeFormat("en-US", v), x = (n, t, r) => {
-  const e = t && n.fullDate(t), a = r && n.fullDate(r);
-  if (e && a)
-    return `${e} - ${a}`;
+}, _ = new Intl.DateTimeFormat("en-US", B), A = (s, t, n, o) => {
+  const e = n && t(n), r = o && t(o);
+  if (e && r)
+    return `${e} - ${r}`;
   if (e)
-    return n.get("filter.date.since", { values: { date: e } });
-  if (a)
-    return n.get("filter.date.until", { values: { date: a } });
-}, o = (n) => {
+    return s.get("filter.date.since", {
+      values: {
+        date: e
+      }
+    });
+  if (r)
+    return s.get("filter.date.until", {
+      values: {
+        date: r
+      }
+    });
+}, a = (s) => {
   try {
-    return new Date(n || "").toISOString();
+    return new Date(s || "").toISOString();
   } catch {
     return "";
   }
-}, Y = (() => {
-  const n = ({
+}, $ = (() => {
+  const s = ({
     editAction: t,
-    from: r,
-    to: e,
-    now: a,
-    onChange: s,
-    onValueUpdated: f,
-    showTimezoneInfo: F,
-    selectedPresetOption: i,
-    timeRangePresetOptions: g,
-    timezone: c,
-    sinceDate: w,
-    untilDate: C
+    from: n,
+    to: o,
+    now: e,
+    onChange: r,
+    onValueUpdated: g,
+    showTimezoneInfo: w,
+    selectedPresetOption: f,
+    timeRangePresetOptions: i,
+    timezone: D,
+    sinceDate: c,
+    untilDate: P
   }) => {
-    const { i18n: D } = k(), [d, O] = y(i), u = R(() => [new Date(r), new Date(e)], [r, e]), l = B(), P = M(
-      (m, p) => {
-        f(x(D, o(m), o(p)));
-      },
-      [D, f]
-    );
-    return h(() => {
-      var m, p, S;
+    const {
+      i18n: y
+    } = x(), {
+      fullDateFormat: d
+    } = k(D), [F, O] = p(f), u = R(() => [new Date(n), new Date(o)], [n, o]), m = I(), T = v((l, h) => {
+      g(A(y, d, a(l), a(h)));
+    }, [y, d, g]);
+    return C(() => {
+      var l, h, b;
       switch (t) {
-        case E.APPLY:
-          s({
-            selectedPresetOption: d,
-            [b.FROM]: o((m = l.current) == null ? void 0 : m.from),
-            [b.TO]: o((p = l.current) == null ? void 0 : p.to)
+        case M.APPLY:
+          r({
+            selectedPresetOption: F,
+            [E.FROM]: a((l = m.current) == null ? void 0 : l.from),
+            [E.TO]: a((h = m.current) == null ? void 0 : h.to)
           });
           break;
-        case E.CLEAR:
-          (S = l.current) == null || S.clear(), s();
+        case M.CLEAR:
+          (b = m.current) == null || b.clear(), r();
       }
-    }, [t, s, d]), /* @__PURE__ */ T(
-      V,
-      {
-        ref: l,
-        now: a,
-        originDate: u,
-        onHighlight: P,
-        onPresetOptionSelected: O,
-        selectedPresetOption: i,
-        timeRangePresetOptions: g,
-        timezone: c,
-        showTimezoneInfo: F,
-        sinceDate: o(w),
-        untilDate: o(C)
-      }
-    );
+    }, [t, r, F]), S(L, {
+      ref: m,
+      now: e,
+      originDate: u,
+      onHighlight: T,
+      onPresetOptionSelected: O,
+      selectedPresetOption: f,
+      timeRangePresetOptions: i,
+      timezone: D,
+      showTimezoneInfo: w,
+      sinceDate: a(c),
+      untilDate: a(P)
+    });
   };
-  return (t) => /* @__PURE__ */ T(n, { ...t });
-})(), _ = (n, t, r) => n.formatRange(t, r);
-function Q({
-  title: n,
+  return (t) => S(s, {
+    ...t
+  });
+})(), j = (s, t, n) => s.formatRange(t, n);
+function X({
+  title: s,
   from: t,
-  to: r,
-  selectedPresetOption: e,
-  ...a
+  to: n,
+  selectedPresetOption: o,
+  ...e
 }) {
-  const { i18n: s } = k(), [f, F] = y(), [i, g] = y(), [c, w] = y(), C = M(
-    (u) => {
-      const { from: l, to: P, selectedPresetOption: m } = u ?? A;
-      try {
-        F(f ?? m), g(o(i ?? l)), w(o(c ?? P));
-      } finally {
-        a.onChange({ from: l, to: P, selectedPresetOption: m });
-      }
-    },
-    [f, i, c, a]
-  ), [D, d] = R(() => {
-    let u = L;
+  const {
+    i18n: r
+  } = x(), {
+    fullDateFormat: g
+  } = k(e.timezone), [w, f] = p(), [i, D] = p(), [c, P] = p(), y = v((u) => {
+    const {
+      from: m,
+      to: T,
+      selectedPresetOption: l
+    } = u ?? Y;
     try {
-      u = new Intl.DateTimeFormat(s.locale, v);
-    } catch {
+      f(w ?? l), D(a(i ?? m)), P(a(c ?? T));
+    } finally {
+      e.onChange({
+        from: m,
+        to: T,
+        selectedPresetOption: l
+      });
     }
-    return [s.get("rangePreset.custom"), u];
-  }, [s]);
-  h(() => F(e), [e]), h(() => g(o(t || Date.now())), [t]), h(() => w(o(r || Date.now())), [r]);
-  const O = R(() => e === D && i && c ? _(d, new Date(i), new Date(c)) : e ?? a.label, [D, d, i, c, e, a.label]);
-  return /* @__PURE__ */ T(
-    I,
-    {
-      ...a,
-      from: t,
-      to: r,
-      type: "date",
-      label: O,
-      onChange: C,
-      render: Y,
-      selectedPresetOption: e,
-      value: x(s, t, r),
-      withContentPadding: !1
+  }, [w, i, c, e]), [d, F] = R(() => {
+    let u = _;
+    try {
+      u = new Intl.DateTimeFormat(r.locale, B);
+    } catch {
     }
-  );
+    return [r.get("rangePreset.custom"), u];
+  }, [r]);
+  C(() => f(o), [o]), C(() => D(a(t || Date.now())), [t]), C(() => P(a(n || Date.now())), [n]);
+  const O = R(() => o === d && i && c ? j(F, new Date(i), new Date(c)) : o ?? e.label, [d, F, i, c, o, e.label]);
+  return S(V, {
+    ...e,
+    from: t,
+    to: n,
+    type: "date",
+    label: O,
+    onChange: y,
+    render: $,
+    selectedPresetOption: o,
+    value: A(r, g, t, n),
+    withContentPadding: !1
+  });
 }
 export {
-  Q as default
+  X as default
 };

package/dist/es/components/internal/FormFields/InputBase.js

@@ -1,65 +1,74 @@
-import { jsx as l } from "../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
 import { ARIA_ERROR_SUFFIX as h } from "../../../core/Errors/constants.js";
 import _ from "classnames";
 import { forwardRef as P } from "../../../external/preact/compat/dist/compat.module.js";
 import { useCallback as r } from "../../../external/preact/hooks/dist/hooks.module.js";
 import "./FormFields.scss.js";
+import { jsx as l } from "../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
 import { Fragment as k } from "../../../external/preact/dist/preact.module.js";
 import { hasOwnProperty as q } from "../../../utils/struct/property.js";
-function u({ onInput: i, onKeyUp: d, trimOnBlur: c, onBlurHandler: e, onBlur: t, onFocusHandler: s, errorMessage: f, ...p }, v) {
-  const { autoCorrect: A, classNameModifiers: m, isInvalid: n, isValid: C, readonly: I = !1, spellCheck: O, type: y, uniqueId: o, isCollatingErrors: N, disabled: $ } = p;
+function u({
+  onInput: i,
+  onKeyUp: d,
+  trimOnBlur: c,
+  onBlurHandler: e,
+  onBlur: t,
+  onFocusHandler: s,
+  errorMessage: f,
+  ...p
+}, v) {
+  const {
+    autoCorrect: A,
+    classNameModifiers: m,
+    isInvalid: n,
+    isValid: C,
+    readonly: I = !1,
+    spellCheck: O,
+    type: y,
+    uniqueId: o,
+    isCollatingErrors: N,
+    disabled: $
+  } = p;
   q(p, "onChange") && console.error("Error: Form fields that rely on InputBase may not have an onChange property");
-  const g = r(
-    (a) => {
-      i == null || i(a);
-    },
-    [i]
-  ), R = r(
-    (a) => {
-      d && d(a);
-    },
-    [d]
-  ), b = r(
-    (a) => {
-      e == null || e(a), c && (a.target.value = a.target.value.trim()), t == null || t(a);
-    },
-    [t, e, c]
-  ), w = r(
-    (a) => {
-      s == null || s(a);
-    },
-    [s]
-  ), x = _(
-    "adyen-pe-input",
-    [`adyen-pe-input--${y}`],
-    p.className,
-    {
-      "adyen-pe-input--invalid": n,
-      "adyen-pe-input--valid": C
-    },
-    m == null ? void 0 : m.map((a) => `adyen-pe-input--${a}`)
-  ), { classNameModifiers: V, uniqueId: j, isInvalid: F, isValid: S, isCollatingErrors: U, ...E } = p;
-  return /* @__PURE__ */ l(k, { children: [
-    /* @__PURE__ */ l(
-      "input",
-      {
-        id: o,
-        ...E,
-        type: y,
-        className: x,
-        readOnly: I,
-        "aria-describedby": N ? void 0 : `${o}${h}`,
-        "aria-invalid": n,
-        onInput: g,
-        onBlur: b,
-        onFocus: w,
-        onKeyUp: R,
-        disabled: $,
-        ref: v
-      }
-    ),
-    n && f && /* @__PURE__ */ l("span", { className: "adyen-pe-input__invalid-value", id: `${o}${h}`, children: f })
-  ] });
+  const g = r((a) => {
+    i == null || i(a);
+  }, [i]), R = r((a) => {
+    d && d(a);
+  }, [d]), b = r((a) => {
+    e == null || e(a), c && (a.target.value = a.target.value.trim()), t == null || t(a);
+  }, [t, e, c]), w = r((a) => {
+    s == null || s(a);
+  }, [s]), x = _("adyen-pe-input", [`adyen-pe-input--${y}`], p.className, {
+    "adyen-pe-input--invalid": n,
+    "adyen-pe-input--valid": C
+  }, m == null ? void 0 : m.map((a) => `adyen-pe-input--${a}`)), {
+    classNameModifiers: V,
+    uniqueId: j,
+    isInvalid: F,
+    isValid: S,
+    isCollatingErrors: U,
+    ...E
+  } = p;
+  return l(k, {
+    children: [l("input", {
+      id: o,
+      ...E,
+      type: y,
+      className: x,
+      readOnly: I,
+      "aria-describedby": N ? void 0 : `${o}${h}`,
+      "aria-invalid": n,
+      onInput: g,
+      onBlur: b,
+      onFocus: w,
+      onKeyUp: R,
+      disabled: $,
+      ref: v
+    }), n && f && l("span", {
+      className: "adyen-pe-input__invalid-value",
+      id: `${o}${h}`,
+      children: f
+    })]
+  });
 }
 u.defaultProps = {
   type: "text",

package/dist/es/components/internal/FormFields/InputText.js

@@ -1,8 +1,14 @@
-import { jsx as t } from "../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import a from "./InputBase.js";
-import { forwardRef as i } from "../../../external/preact/compat/dist/compat.module.js";
-const m = i(function(e, r) {
-  return /* @__PURE__ */ t(a, { classNameModifiers: e.classNameModifiers, ...e, ref: r, "aria-required": e.required, type: "text" });
+import t from "./InputBase.js";
+import { forwardRef as a } from "../../../external/preact/compat/dist/compat.module.js";
+import { jsx as i } from "../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+const m = a(function(e, r) {
+  return i(t, {
+    classNameModifiers: e.classNameModifiers,
+    ...e,
+    ref: r,
+    "aria-required": e.required,
+    type: "text"
+  });
 });
 export {
   m as default

package/dist/es/components/internal/FormFields/Select/BalanceAccountSelector/BalanceAccountSelector.js

@@ -1,43 +1,40 @@
-import { jsx as s } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
 import { memo as n } from "../../../../../external/preact/compat/dist/compat.module.js";
 import { useCallback as a } from "../../../../../external/preact/hooks/dist/hooks.module.js";
 import { useResponsiveViewport as p, mediaQueries as C } from "../../../../external/TransactionsOverview/hooks/useResponsiveViewport.js";
 import { renderDefaultSingleSelectionCheckedness as c } from "../components/SelectListItem.js";
 import "./BalanceAccountSelector.scss.js";
+import { jsx as s } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
 import { Fragment as d } from "../../../../../external/preact/dist/preact.module.js";
 import S from "../Select.js";
-const m = "adyen-pe-balance-account-selector", _ = `${m}__account-id`, f = `${m}__account-label`, u = n(
-  ({
-    activeBalanceAccount: r,
-    balanceAccountSelectionOptions: o,
-    onBalanceAccountSelection: t
-  }) => {
-    const l = p(C.down.xs), i = a(
-      (e) => /* @__PURE__ */ s(d, { children: [
-        /* @__PURE__ */ s("div", { className: e.contentClassName, children: [
-          e.item.name && /* @__PURE__ */ s("span", { className: f, children: e.item.name }),
-          /* @__PURE__ */ s("span", { className: _, children: e.item.id })
-        ] }),
-        c(e)
-      ] }),
-      []
-    );
-    return o && o.length > 1 ? /* @__PURE__ */ s(
-      S,
-      {
-        popoverClassNameModifiers: [m],
-        onChange: t,
-        filterable: !1,
-        multiSelect: !1,
-        selected: r == null ? void 0 : r.id,
-        withoutCollapseIndicator: !0,
-        items: o,
-        renderListItem: i,
-        showOverlay: l
-      }
-    ) : null;
-  }
-), x = u;
+const m = "adyen-pe-balance-account-selector", _ = `${m}__account-id`, f = `${m}__account-label`, u = n(({
+  activeBalanceAccount: r,
+  balanceAccountSelectionOptions: o,
+  onBalanceAccountSelection: t
+}) => {
+  const l = p(C.down.xs), i = a((e) => s(d, {
+    children: [s("div", {
+      className: e.contentClassName,
+      children: [e.item.name && s("span", {
+        className: f,
+        children: e.item.name
+      }), s("span", {
+        className: _,
+        children: e.item.id
+      })]
+    }), c(e)]
+  }), []);
+  return o && o.length > 1 ? s(S, {
+    popoverClassNameModifiers: [m],
+    onChange: t,
+    filterable: !1,
+    multiSelect: !1,
+    selected: r == null ? void 0 : r.id,
+    withoutCollapseIndicator: !0,
+    items: o,
+    renderListItem: i,
+    showOverlay: l
+  }) : null;
+}), x = u;
 export {
   x as default
 };