@adyen/adyen-platform-experience-web 1.0.0-beta.3 → 1.0.0

package/dist/es/components/external/TransactionsOverview/components/utils.js

@@ -1,29 +1,10 @@
-const a = {
-  id: "paymentId",
-  transactionType: "transactionType",
-  createdAt: "date",
-  balanceAccountId: "balanceAccount",
-  accountHolderId: "account",
-  fee: "txType.Fee",
-  capture: "txType.capture",
-  leftover: "txType.leftover",
-  manualCorrection: "txType.manualCorrection",
-  internalTransfer: "txType.internalTransfer",
-  balanceAdjustment: "txType.balanceAdjustment",
-  amount: "txAmount",
-  description: "description",
-  status: "status",
-  category: "category",
-  paymentMethod: "paymentMethod",
-  currency: "currency"
-}, r = (t) => a[t] || t, n = Object.freeze({
+const i = Object.freeze({
   klarna: "Klarna",
   paypal: "PayPal"
 });
-function c(t, e) {
-  return t.lastFourDigits ? e === "detail" ? "•••• •••• •••• " + t.lastFourDigits : t.lastFourDigits : n[t.type] || t.type;
+function t(r, a) {
+  return r.lastFourDigits ? a === "detail" ? "•••• •••• •••• " + r.lastFourDigits : r.lastFourDigits : i[r.type] || r.type;
 }
 export {
-  r as getLabel,
-  c as parsePaymentMethodType
+  t as parsePaymentMethodType
 };

package/dist/es/components/external/TransactionsOverview/hooks/{useMediaQuery.js → useResponsiveViewport.js}

@@ -1,6 +1,6 @@
-import { useMemo as h, useState as x, useEffect as i } from "../../../../external/preact/hooks/dist/hooks.module.js";
 import { BREAKPOINTS as m } from "../../../../constants.js";
-const w = {
+import { useMediaQuery as i } from "../../../../hooks/useMediaQuery/useMediaQuery.js";
+const p = {
   up: {
     sm: `(min-width: ${m.sm}px)`,
     md: `(min-width: ${m.md}px)`,
@@ -17,16 +17,8 @@ const w = {
     md: `(min-width: ${m.md}px) and (max-width: ${m.lg - 1}px)`,
     lg: `(min-width: ${m.lg}px)`
   }
-}, c = (e) => {
-  const t = h(() => window.matchMedia(e), [e]), [a, s] = x(t.matches);
-  return i(() => {
-    const d = (n) => s(n.matches);
-    return t.addEventListener("change", d), () => t.removeEventListener("change", d);
-  }, [t]), i(() => {
-    s(t.matches);
-  }, [t]), a;
-};
+}, t = i;
 export {
-  w as mediaQueries,
-  c as useMediaQuery
+  p as mediaQueries,
+  t as useResponsiveViewport
 };

package/dist/es/components/external/TransactionsOverview/hooks/useTransactionsOverviewMultiSelectionFilters.js

@@ -1,10 +1,10 @@
-import { TransactionFilterParam as t } from "../types.js";
+import { FilterParam as t } from "../../../types.js";
 import r from "../components/MultiSelectionFilter/useMultiSelectionFilter/useMultiSelectionFilter.js";
-import { TRANSACTION_CATEGORIES as S, DEFAULT_TRANSACTIONS_OVERVIEW_MULTI_SELECTION_FILTER_PARAMS as i, TRANSACTION_STATUSES as o } from "../components/MultiSelectionFilter/useMultiSelectionFilter/constants.js";
+import { TRANSACTION_CATEGORIES as T, DEFAULT_TRANSACTIONS_OVERVIEW_MULTI_SELECTION_FILTER_PARAMS as i, TRANSACTION_STATUSES as o } from "../components/MultiSelectionFilter/useMultiSelectionFilter/constants.js";
 const u = (e, l) => {
   const s = r({
     filterParam: t.CATEGORIES,
-    filterValues: S,
+    filterValues: T,
     defaultFilters: i,
     ...e
   }), a = r({
@@ -12,7 +12,7 @@ const u = (e, l) => {
     filterValues: o,
     defaultFilters: i,
     ...e
-  }), T = r({
+  }), S = r({
     filterParam: t.CURRENCIES,
     filterValues: l,
     defaultFilters: i,
@@ -20,10 +20,10 @@ const u = (e, l) => {
   });
   return {
     categoriesFilter: s,
-    currenciesFilter: T,
+    currenciesFilter: S,
     statusesFilter: a
   };
-}, A = u;
+}, n = u;
 export {
-  A as default
+  n as default
 };

package/dist/es/components/external/UIElement/UIElement.js

@@ -0,0 +1,68 @@
+var p = Object.defineProperty;
+var m = (s, e, t) => e in s ? p(s, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : s[e] = t;
+var n = (s, e, t) => (m(s, typeof e != "symbol" ? e + "" : e, t), t);
+import { jsx as r } from "../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import c from "../../../core/Context/CoreProvider.js";
+import l from "../BaseElement.js";
+import "./UIElement.scss.js";
+import { AuthProvider as h } from "../../../core/Auth/context.js";
+class u extends l {
+  constructor(t) {
+    super(t);
+    n(this, "componentRef", null);
+    n(this, "componentToRender", null);
+    n(this, "elementRef");
+    n(this, "onContactSupport");
+    n(this, "setUIElementStatus");
+    this.setState = this.setState.bind(this), this.onContactSupport = t.onContactSupport, this.elementRef = this.props && this.props.elementRef || this;
+  }
+  get isValid() {
+    return !!this.state.isValid;
+  }
+  /**
+   * Get the element's displayable name
+   */
+  get displayName() {
+    return this.props.name || this.type;
+  }
+  /**
+   * Get the element accessible name, used in the aria-label of the button that controls selected component
+   */
+  get accessibleName() {
+    return this.displayName;
+  }
+  /**
+   * Return the type of an element
+   */
+  get type() {
+    var t;
+    return (t = this.constructor) == null ? void 0 : t.type;
+  }
+  formatProps(t) {
+    return t;
+  }
+  /**
+   * Formats the component data output
+   */
+  formatData() {
+    return {
+      ...this.state
+    };
+  }
+  setState(t) {
+    this.state = { ...this.state, ...t };
+  }
+  setStatus(t, o) {
+    var i, a;
+    return (i = this.componentRef) != null && i.setStatus ? this.componentRef.setStatus(t, o) : (a = this.setUIElementStatus) == null || a.call(this, t), this;
+  }
+  render() {
+    const t = this.props.core, o = t.update.bind(t);
+    return /* @__PURE__ */ r(h, { session: t.session, children: /* @__PURE__ */ r(c, { i18n: t.localization.i18n, loadingContext: t.loadingContext, updateCore: o, children: this.componentToRender && /* @__PURE__ */ r("div", { className: "adyen-pe-component", children: this.componentToRender() }) }) }, performance.now());
+  }
+}
+const y = u;
+export {
+  u as UIElement,
+  y as default
+};

package/dist/es/{core/Localization/translations/de-DE.json.js → components/external/UIElement/UIElement.scss.js}

@@ -1,4 +1,4 @@
-const e = {};
+const e = "";
 export {
   e as default
 };

package/dist/es/components/hooks/useBalanceAccountSelection.js

@@ -0,0 +1,18 @@
+import { useState as f, useCallback as l, useMemo as m } from "../../external/preact/hooks/dist/hooks.module.js";
+import { capitalize as x } from "../../utils/value/string.js";
+const I = (e) => {
+  const [n, t] = f(0), p = l(() => t(0), [t]), r = m(() => e == null ? void 0 : e[n], [e, n]), s = m(
+    () => e && e.length > 1 ? Object.freeze(e.map(({ description: o, id: i }) => ({ id: i, name: x(o) }))) : void 0,
+    [e]
+  ), B = l(
+    ({ target: o }) => {
+      const i = o == null ? void 0 : o.value, d = e == null ? void 0 : e.findIndex(({ id: S }) => S === i);
+      d >= 0 && t(d);
+    },
+    [e, t]
+  );
+  return { activeBalanceAccount: r, balanceAccountSelectionOptions: s, onBalanceAccountSelection: B, resetBalanceAccountSelection: p };
+}, c = I;
+export {
+  c as default
+};

package/dist/es/components/hooks/useBalanceAccounts.js

@@ -0,0 +1,25 @@
+import { useFetch as f } from "../../hooks/useFetch/useFetch.js";
+import { useMemo as o } from "../../external/preact/hooks/dist/hooks.module.js";
+import { useAuthContext as g } from "../../core/Auth/context.js";
+import { EMPTY_OBJECT as p } from "../../utils/value/constants.js";
+const u = (r) => {
+  const { getBalanceAccounts: s } = g().endpoints, { data: e, isFetching: i, error: n } = f(
+    o(
+      () => ({
+        fetchOptions: { enabled: !!s, keepPrevData: !0 },
+        queryFn: async () => s == null ? void 0 : s(p)
+      }),
+      [s]
+    )
+  ), t = o(
+    () => e == null ? void 0 : e.data.filter((h) => r ? h.id === r : !0),
+    [e == null ? void 0 : e.data, r]
+  ), m = o(
+    () => !!r && !!(e != null && e.data.length) && (t == null ? void 0 : t.length) === 0,
+    [t == null ? void 0 : t.length, e == null ? void 0 : e.data.length, r]
+  );
+  return { balanceAccounts: t, isBalanceAccountIdWrong: m, isFetching: i, error: n };
+}, y = u;
+export {
+  y as default
+};

package/dist/es/components/hooks/useDefaultOverviewFilterParams.js

@@ -0,0 +1,24 @@
+import { useState as m, useRef as l, useCallback as f, useEffect as u } from "../../external/preact/hooks/dist/hooks.module.js";
+import { FilterParam as s } from "../types.js";
+import { getTimeRangeSelectionDefaultPresetOptions as T } from "../internal/DatePicker/components/TimeRangeSelector/useTimeRangeSelection.js";
+import { DEFAULT_TRANSACTIONS_OVERVIEW_MULTI_SELECTION_FILTER_PARAMS as c } from "../external/TransactionsOverview/components/MultiSelectionFilter/useMultiSelectionFilter/constants.js";
+const p = (r) => {
+  const t = T(), e = "rangePreset.last30Days", { from: a, to: o } = t[e];
+  return { defaultFilterParams: {
+    ...r === "transactions" && {
+      ...c,
+      [s.MIN_AMOUNT]: void 0,
+      [s.MAX_AMOUNT]: void 0
+    },
+    [s.CREATED_SINCE]: new Date(a).toISOString(),
+    [s.CREATED_UNTIL]: new Date(o).toISOString()
+  }, defaultTimeRange: e, timeRangeOptions: t };
+}, D = (r, t) => {
+  const [e, a] = m(Date.now()), o = p(r), i = l(o), n = f(() => a(Date.now()), [a]);
+  return u(() => {
+    n();
+  }, [t, n]), { defaultParams: i, nowTimestamp: e, refreshNowTimestamp: n };
+}, A = D;
+export {
+  A as default
+};

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

@@ -1,22 +1,22 @@
 import { jsx as B } from "../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import N from "../Button/hooks/useButton.js";
-import { DEFAULT_BASE_BUTTON_CLASSNAME as A } from "./constants.js";
-import { parseClassName as C } from "../../../utils/class-name-utils.js";
-import { parseBoolean as E } from "../../../utils/common/index.js";
-import { forwardRef as S } from "../../../external/preact/compat/dist/compat.module.js";
+import A from "../Button/hooks/useButton.js";
+import { DEFAULT_BASE_BUTTON_CLASSNAME as N } from "./constants.js";
 import { useMemo as r } from "../../../external/preact/hooks/dist/hooks.module.js";
 import "./BaseButton.scss.js";
-function T({ disabled: o = !1, onClick: s, classNameModifiers: a = [], type: m = "button", children: e, className: t, fullWidth: n, ...u }, f) {
-  const i = r(() => C("", t) || "", [t]), l = r(() => E(o), [o]), { classes: p, click: c } = N(
+import { fixedForwardRef as x } from "../../../utils/preact/fixedForwardRef.js";
+import { parseClassName as C } from "../../../utils/preact/className.js";
+import { parseBooleanProp as E } from "../../../utils/preact/props.js";
+function S({ disabled: o = !1, onClick: s, classNameModifiers: e = [], type: m = "button", children: a, className: t, fullWidth: n, ...u }, f) {
+  const i = r(() => C("", t) || "", [t]), p = r(() => E(o), [o]), { classes: l, click: c } = A(
     i,
-    [...a, ...n ? ["full-width"] : []],
-    A,
-    l,
+    [...e, ...n ? ["full-width"] : []],
+    N,
+    p,
     s
   );
-  return /* @__PURE__ */ B("button", { className: p, type: m, disabled: o, onClick: c, ref: f, ...u, children: e });
+  return /* @__PURE__ */ B("button", { className: l, type: m, disabled: o, onClick: c, ref: f, ...u, children: a });
 }
-const b = S(T);
+const U = x(S);
 export {
-  b as default
+  U as default
 };

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

@@ -3,27 +3,27 @@ import C from "./hooks/useButton.js";
 import { ICON_BUTTON_CLASSNAME as S, ICON_BUTTON_CONTENT_CLASSNAME as B, BUTTON_ICON_LEFT_CLASSNAME as O, BUTTON_LABEL_CLASSNAME as E, BUTTON_ICON_RIGHT_CLASSNAME as L, DEFAULT_BUTTON_CLASSNAME as M } from "./constants.js";
 import { TypographyElement as U, TypographyVariant as y } from "../Typography/types.js";
 import I from "../Typography/Typography.js";
-import { parseClassName as h } from "../../../utils/class-name-utils.js";
-import { parseBoolean as d } from "../../../utils/common/index.js";
-import { forwardRef as g } from "../../../external/preact/compat/dist/compat.module.js";
 import { useMemo as p } from "../../../external/preact/hooks/dist/hooks.module.js";
-import { ButtonVariant as V } from "./types.js";
+import { ButtonVariant as d } from "./types.js";
 import "./Button.scss.js";
-import { Fragment as $ } from "../../../external/preact/dist/preact.module.js";
-function F({
-  variant: n = V.PRIMARY,
+import { fixedForwardRef as h } from "../../../utils/preact/fixedForwardRef.js";
+import { parseClassName as g } from "../../../utils/preact/className.js";
+import { parseBooleanProp as F } from "../../../utils/preact/props.js";
+import { Fragment as V } from "../../../external/preact/dist/preact.module.js";
+function $({
+  variant: n = d.PRIMARY,
   disabled: o = !1,
   onClick: T,
   classNameModifiers: l = [],
   iconLeft: a,
   iconRight: t,
   type: i = "button",
-  children: s,
-  className: m,
+  children: m,
+  className: s,
   iconButton: e = !1,
   ...f
 }, A) {
-  const _ = p(() => h("", m) || "", [m]), c = p(() => d(o), [o]), { classes: N, click: u } = C(_, [...l, n], M, c, T);
+  const _ = p(() => g("", s) || "", [s]), c = p(() => F(o), [o]), { classes: N, click: u } = C(_, [...l, n], M, c, T);
   return /* @__PURE__ */ r(
     "button",
     {
@@ -33,15 +33,15 @@ function F({
       onClick: u,
       ref: A,
       ...f,
-      children: e ? /* @__PURE__ */ r("div", { className: `${B}`, children: s }) : /* @__PURE__ */ r($, { children: [
+      children: e ? /* @__PURE__ */ r("div", { className: `${B}`, children: m }) : /* @__PURE__ */ r(V, { children: [
         a && /* @__PURE__ */ r("span", { className: O, children: a }),
-        /* @__PURE__ */ r(I, { className: E, el: U.SPAN, variant: y.BODY, stronger: !0, children: s }),
+        /* @__PURE__ */ r(I, { className: E, el: U.SPAN, variant: y.BODY, stronger: !0, children: m }),
         t && /* @__PURE__ */ r("span", { className: L, children: t })
       ] })
     }
   );
 }
-const H = g(F);
+const H = h($);
 export {
   H as default
 };

package/dist/es/components/internal/Button/hooks/useButton.js

@@ -1,14 +1,14 @@
-import { getModifierClasses as p } from "../../../../utils/class-name-utils.js";
-import { useCallback as n, useMemo as a } from "../../../../external/preact/hooks/dist/hooks.module.js";
+import { useCallback as p, useMemo as n } from "../../../../external/preact/hooks/dist/hooks.module.js";
+import { getModifierClasses as a } from "../../../../utils/preact/className.js";
 const c = (s, e, r, u, t) => {
-  const f = n(
+  const f = p(
     (o) => {
       o.preventDefault(), u || t == null || t(o);
     },
     [u, t]
   );
-  return { classes: a(
-    () => p(r, e, [r, s]),
+  return { classes: n(
+    () => a(r, e, [r, s]),
     [e, s]
   ), click: f };
 }, g = c;