@adyen/adyen-platform-experience-web 1.0.1 → 1.0.3

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

@@ -13,7 +13,10 @@ class i {
     e(this, "defaultProps", {});
     e(this, "props");
     e(this, "state", {});
-    this.props = this.formatProps({ ...this == null ? void 0 : this.defaultProps, ...t }), this.props.core.registerComponent(this);
+    this.props = this.formatProps({
+      ...this == null ? void 0 : this.defaultProps,
+      ...t
+    }), this.props.core.registerComponent(this);
   }
   /**
    * Executed during creation of any element.
@@ -30,7 +33,10 @@ class i {
     return {};
   }
   setState(t) {
-    this.state = { ...this.state, ...t };
+    this.state = {
+      ...this.state,
+      ...t
+    };
   }
   /**
    * Returns the component data ready to submit to the Checkout API
@@ -57,7 +63,10 @@ class i {
    * @returns this - the element instance
    */
   update(t) {
-    return this.props = this.formatProps({ ...this.props, ...t }), this._component = this.render(), this._node && n(this._component, this._node), this;
+    return this.props = this.formatProps({
+      ...this.props,
+      ...t
+    }), this._component = this.render(), this._node && n(this._component, this._node), this;
   }
   /**
    * Unmounts an element and mounts it again on the same node i.e. allows mount w/o having to pass a node.

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

@@ -1,19 +1,23 @@
-var r = Object.defineProperty;
-var i = (o, t, e) => t in o ? r(o, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : o[t] = e;
-var n = (o, t, e) => (i(o, typeof t != "symbol" ? t + "" : t, e), e);
+var s = Object.defineProperty;
+var p = (o, e, t) => e in o ? s(o, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : o[e] = t;
+var n = (o, e, t) => (p(o, typeof e != "symbol" ? e + "" : e, t), t);
+import i from "../UIElement/UIElement.js";
+import a from "../../internal/DataOverviewDetails/DataOverviewDetails.js";
 import { jsx as m } from "../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import a from "../UIElement/UIElement.js";
-import p from "../../internal/DataOverviewDetails/DataOverviewDetails.js";
-class s extends a {
-  constructor(e) {
-    super(e);
-    n(this, "componentToRender", () => /* @__PURE__ */ m(p, { ...this.props, type: "payout" }));
-    this.elementRef = e && e.elementRef || this, this.componentToRender = this.componentToRender.bind(this);
+class r extends i {
+  constructor(t) {
+    super(t);
+    n(this, "componentToRender", () => m(a, {
+      ...this.props,
+      type: "payout",
+      ref: (t) => void (this.componentRef = t)
+    }));
+    this.componentToRender = this.componentToRender.bind(this);
   }
 }
-n(s, "type", "payoutDetails");
-const f = s;
+n(r, "type", "payoutDetails");
+const l = r;
 export {
-  s as PayoutElement,
-  f as default
+  r as PayoutElement,
+  l as default
 };

package/dist/es/components/external/PayoutDetails/components/PayoutData.js

@@ -1,90 +1,205 @@
-import { jsx as o } from "../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import S from "classnames";
-import { useMemo as O } from "../../../../external/preact/hooks/dist/hooks.module.js";
-import F from "../../../../core/Context/useCoreContext.js";
-import _ from "../../../internal/Card/Card.js";
-import { DATE_FORMAT as H } from "../../../internal/DataOverviewDisplay/constants.js";
-import { TypographyVariant as d } from "../../../internal/Typography/types.js";
-import c from "../../../internal/Typography/Typography.js";
-import q from "../../TransactionDetails/components/TransactionDataSkeleton.js";
+import O from "classnames";
+import { useMemo as N } from "../../../../external/preact/hooks/dist/hooks.module.js";
+import u from "../../../../core/Context/useCoreContext.js";
+import R from "../../../internal/Accordion/Accordion.js";
+import S from "../../../internal/Card/Card.js";
+import { DATE_FORMAT_PAYOUTS_DETAILS as z } from "../../../internal/DataOverviewDisplay/constants.js";
+import { TypographyVariant as e } from "../../../internal/Typography/types.js";
+import s from "../../../internal/Typography/Typography.js";
+import G from "../../TransactionDetails/components/TransactionDataSkeleton.js";
+import J from "../../../hooks/useTimezoneAwareDateFormatting.js";
 import "./PayoutData.scss.js";
-import { PD_BASE_CLASS as G, PD_TITLE_CLASS as J, PD_CONTENT_CLASS as K, PD_SECTION_CLASS as N, PD_SECTION_AMOUNT_CLASS as C, PD_SECTION_GROSS_AMOUNT_CLASS as D, PD_CARD_CLASS as l, PD_CARD_TITLE_CLASS as M, PD_SECTION_NET_AMOUNT_CLASS as z, PD_UNPAID_AMOUNT as Q } from "./constants.js";
-import f from "../../../internal/StructuredList/StructuredList.js";
-import { Fragment as W } from "../../../../external/preact/dist/preact.module.js";
-import { EMPTY_OBJECT as X } from "../../../../utils/value/constants.js";
-const ci = ({
-  balanceAccountId: U,
-  payout: t,
-  isFetching: R
+import { PD_BASE_CLASS as K, PD_TITLE_CLASS as k, PD_SECTION_CLASS as l, PD_TITLE_BA_CLASS as Q, PD_CONTENT_CLASS as W, PD_CARD_CLASS as _, PD_SECTION_AMOUNT_CLASS as f, PD_SECTION_GROSS_AMOUNT_CLASS as $, PD_CARD_TITLE_CLASS as F, PD_SECTION_NET_AMOUNT_CLASS as X, PD_UNPAID_AMOUNT as Z } from "./constants.js";
+import { jsx as n } from "../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import y from "../../../internal/StructuredList/StructuredList.js";
+import { Fragment as j } from "../../../../external/preact/dist/preact.module.js";
+import { EMPTY_OBJECT as b } from "../../../../utils/value/constants.js";
+const gi = ({
+  balanceAccountId: x,
+  balanceAccountDescription: p,
+  payout: m,
+  isFetching: H
 }) => {
-  var B;
-  const { payout: m } = t ?? X, { i18n: n } = F(), s = O(() => {
-    var v, h;
-    return (h = (v = t == null ? void 0 : t.amountBreakdowns) == null ? void 0 : v.adjustmentBreakdown) == null ? void 0 : h.reduce(
-      (r, i) => {
-        var P, L, p, E, y, I, Y;
-        const e = (P = i == null ? void 0 : i.amount) != null && P.value && ((L = i == null ? void 0 : i.amount) != null && L.currency) ? n.amount((p = i == null ? void 0 : i.amount) == null ? void 0 : p.value, (E = i == null ? void 0 : i.amount) == null ? void 0 : E.currency) : (((y = i == null ? void 0 : i.amount) == null ? void 0 : y.value) ?? "").toString(), A = `${i == null ? void 0 : i.category}`, a = n.get(A), g = i != null && i.category && a !== A ? a : i == null ? void 0 : i.category;
-        if (i != null && i.category && e && g) {
-          const $ = r[(I = i == null ? void 0 : i.amount) != null && I.value && ((Y = i == null ? void 0 : i.amount) == null ? void 0 : Y.value) < 0 ? "subtractions" : "additions"];
-          $[g] = e;
-        }
-        return r;
-      },
-      { subtractions: {}, additions: {} }
-    );
-  }, [n, t]), T = O(() => {
-    var v, h;
-    return (h = (v = t == null ? void 0 : t.amountBreakdowns) == null ? void 0 : v.fundsCapturedBreakdown) == null ? void 0 : h.reduce((r, i) => {
-      var e, A, a, g;
-      return ((e = i == null ? void 0 : i.amount) == null ? void 0 : e.value) === 0 || (A = i == null ? void 0 : i.amount) != null && A.value && (r[i.category] = n.amount((a = i == null ? void 0 : i.amount) == null ? void 0 : a.value, (g = i == null ? void 0 : i.amount) == null ? void 0 : g.currency)), r;
-    }, {});
-  }, [t, n]), x = O(() => m != null && m.createdAt ? n.date(new Date(m == null ? void 0 : m.createdAt), H).toString() : "", [m, n]);
-  return /* @__PURE__ */ o(W, { children: m ? /* @__PURE__ */ o("div", { className: G, children: [
-    /* @__PURE__ */ o("div", { className: J, children: [
-      /* @__PURE__ */ o(c, { variant: d.SUBTITLE, stronger: !0, children: n.get("netPayout") }),
-      /* @__PURE__ */ o(c, { variant: d.TITLE, large: !0, children: n.amount(m.payoutAmount.value, m.payoutAmount.currency) }),
-      /* @__PURE__ */ o(c, { variant: d.BODY, children: x }),
-      /* @__PURE__ */ o(c, { variant: d.BODY, stronger: !0, children: `${n.get("balanceAccountId")}: ${U}` })
-    ] }),
-    /* @__PURE__ */ o("div", { className: K, children: [
-      /* @__PURE__ */ o("div", { className: N, children: [
-        /* @__PURE__ */ o("div", { className: S(C, D), children: [
-          /* @__PURE__ */ o(c, { variant: d.BODY, children: n.get("fundsCaptured") }),
-          /* @__PURE__ */ o(c, { variant: d.BODY, children: n.amount(m.fundsCapturedAmount.value, m.fundsCapturedAmount.currency) })
-        ] }),
-        /* @__PURE__ */ o("div", { className: N, children: T && !!Object.keys(T).length && /* @__PURE__ */ o("div", { className: l, children: /* @__PURE__ */ o(_, { children: /* @__PURE__ */ o(f, { items: T }) }) }) })
-      ] }),
-      /* @__PURE__ */ o("div", { className: N, children: /* @__PURE__ */ o("div", { className: S(C, D), children: [
-        /* @__PURE__ */ o(c, { variant: d.BODY, children: n.get("adjustments") }),
-        /* @__PURE__ */ o(c, { variant: d.BODY, children: n.amount(m.adjustmentAmount.value, m.adjustmentAmount.currency) })
-      ] }) }),
-      /* @__PURE__ */ o("div", { className: N, children: [
-        (s == null ? void 0 : s.subtractions) && !!Object.keys(s == null ? void 0 : s.subtractions).length && /* @__PURE__ */ o("div", { className: l, children: /* @__PURE__ */ o(
-          _,
-          {
-            renderHeader: /* @__PURE__ */ o(c, { className: M, variant: d.CAPTION, stronger: !0, children: n.get("subtractions") }),
-            children: /* @__PURE__ */ o(f, { items: s == null ? void 0 : s.subtractions })
-          }
-        ) }),
-        (s == null ? void 0 : s.additions) && !!Object.keys(s == null ? void 0 : s.additions).length && /* @__PURE__ */ o("div", { className: l, children: /* @__PURE__ */ o(
-          _,
-          {
-            renderHeader: /* @__PURE__ */ o(c, { className: M, variant: d.CAPTION, stronger: !0, children: n.get("additions") }),
-            children: /* @__PURE__ */ o(f, { items: s == null ? void 0 : s.additions })
-          }
-        ) })
-      ] }),
-      /* @__PURE__ */ o("div", { className: S(N), children: /* @__PURE__ */ o("div", { className: S(C, z), children: [
-        /* @__PURE__ */ o(c, { variant: d.BODY, stronger: !0, children: n.get("netPayout") }),
-        /* @__PURE__ */ o(c, { variant: d.BODY, stronger: !0, children: n.amount(m.payoutAmount.value, m.payoutAmount.currency) })
-      ] }) })
-    ] }),
-    ((B = t == null ? void 0 : t.payout) == null ? void 0 : B.unpaidAmount) && /* @__PURE__ */ o("div", { className: Q, children: [
-      /* @__PURE__ */ o(c, { variant: d.BODY, children: n.get("remainingAmount") }),
-      /* @__PURE__ */ o(c, { variant: d.BODY, children: n.amount(t.payout.unpaidAmount.value, t.payout.unpaidAmount.currency) })
-    ] })
-  ] }) : /* @__PURE__ */ o(q, { isLoading: R, skeletonRowNumber: 6 }) });
+  var P;
+  const {
+    payout: t
+  } = m ?? b, {
+    i18n: r
+  } = u(), {
+    dateFormat: B
+  } = J("UTC"), o = N(() => {
+    var a, h;
+    const c = (h = (a = m == null ? void 0 : m.amountBreakdowns) == null ? void 0 : a.adjustmentBreakdown) == null ? void 0 : h.reduce((d, i) => {
+      var L, I, E, Y, D, U, M;
+      const v = (L = i == null ? void 0 : i.amount) != null && L.value && ((I = i == null ? void 0 : i.amount) != null && I.currency) ? r.amount((E = i == null ? void 0 : i.amount) == null ? void 0 : E.value, (Y = i == null ? void 0 : i.amount) == null ? void 0 : Y.currency, {
+        hideCurrency: !0
+      }) : (((D = i == null ? void 0 : i.amount) == null ? void 0 : D.value) ?? "").toString(), A = `${i == null ? void 0 : i.category}`, C = r.get(A), g = i != null && i.category && C !== A ? C : i == null ? void 0 : i.category;
+      return i != null && i.category && v && g && d[(U = i == null ? void 0 : i.amount) != null && U.value && ((M = i == null ? void 0 : i.amount) == null ? void 0 : M.value) < 0 ? "subtractions" : "additions"].push({
+        key: g,
+        value: v
+      }), d;
+    }, {
+      subtractions: [],
+      additions: []
+    });
+    return c == null || c.subtractions.sort((d, i) => d.key.localeCompare(i.key)), c == null || c.additions.sort((d, i) => d.key.localeCompare(i.key)), c;
+  }, [r, m]), T = N(() => {
+    var a, h;
+    const c = (h = (a = m == null ? void 0 : m.amountBreakdowns) == null ? void 0 : a.fundsCapturedBreakdown) == null ? void 0 : h.reduce((d, i) => {
+      var v, A, C, g;
+      return ((v = i == null ? void 0 : i.amount) == null ? void 0 : v.value) === 0 || (A = i == null ? void 0 : i.amount) != null && A.value && i.category && d.push({
+        key: i.category,
+        value: r.amount((C = i == null ? void 0 : i.amount) == null ? void 0 : C.value, (g = i == null ? void 0 : i.amount) == null ? void 0 : g.currency, {
+          hideCurrency: !0
+        })
+      }), d;
+    }, []);
+    return c == null || c.sort((d, i) => d.key === "capture" ? -1 : i.key === "capture" ? 1 : d.key.localeCompare(i.key)), c;
+  }, [m, r]), q = N(() => t != null && t.createdAt ? B(new Date(t == null ? void 0 : t.createdAt), z) : "", [t, B]);
+  return n(j, {
+    children: t ? n("div", {
+      className: K,
+      children: [n("div", {
+        className: k,
+        children: [n(s, {
+          variant: e.SUBTITLE,
+          stronger: !0,
+          children: r.get("netPayout")
+        }), n(s, {
+          variant: e.TITLE,
+          large: !0,
+          children: `${r.amount(t.payoutAmount.value, t.payoutAmount.currency, {
+            hideCurrency: !0
+          })} ${t.payoutAmount.currency}`
+        }), n(s, {
+          variant: e.BODY,
+          children: q
+        }), n("div", {
+          className: l,
+          children: [p && n(s, {
+            variant: e.CAPTION,
+            stronger: !0,
+            wide: !0,
+            children: `${p}`
+          }), n(s, {
+            variant: e.CAPTION,
+            className: Q,
+            children: `${x}`
+          })]
+        })]
+      }), n("div", {
+        className: W,
+        children: [n("div", {
+          className: l,
+          children: (t == null ? void 0 : t.fundsCapturedAmount) && (T && Object.keys(T).length > 0 ? n(R, {
+            header: n(s, {
+              variant: e.BODY,
+              children: r.get("fundsCaptured")
+            }),
+            headerInformation: n(s, {
+              variant: e.BODY,
+              children: r.amount(t.fundsCapturedAmount.value, t.fundsCapturedAmount.currency)
+            }),
+            children: n("div", {
+              className: l,
+              children: n("div", {
+                className: _,
+                children: n(S, {
+                  children: n(y, {
+                    items: T
+                  })
+                })
+              })
+            })
+          }) : n("div", {
+            className: O(f, $),
+            children: [n(s, {
+              variant: e.BODY,
+              children: r.get("fundsCaptured")
+            }), n(s, {
+              variant: e.BODY,
+              children: r.amount(t.fundsCapturedAmount.value, t.fundsCapturedAmount.currency)
+            })]
+          }))
+        }), n("div", {
+          className: l,
+          children: o != null && o.subtractions && Object.keys(o == null ? void 0 : o.subtractions).length > 0 || o != null && o.additions && Object.keys(o == null ? void 0 : o.additions).length > 0 ? n(R, {
+            header: n(s, {
+              variant: e.BODY,
+              children: r.get("adjustments")
+            }),
+            headerInformation: n(s, {
+              variant: e.BODY,
+              children: r.amount(t.adjustmentAmount.value, t.adjustmentAmount.currency)
+            }),
+            children: [(o == null ? void 0 : o.additions) && Object.keys(o == null ? void 0 : o.additions).length > 0 && n("div", {
+              className: _,
+              children: n(S, {
+                renderHeader: n(s, {
+                  className: F,
+                  variant: e.CAPTION,
+                  stronger: !0,
+                  children: r.get("additions")
+                }),
+                children: n(y, {
+                  items: o == null ? void 0 : o.additions
+                })
+              })
+            }), (o == null ? void 0 : o.subtractions) && Object.keys(o == null ? void 0 : o.subtractions).length > 0 && n("div", {
+              className: _,
+              children: n(S, {
+                renderHeader: n(s, {
+                  className: F,
+                  variant: e.CAPTION,
+                  stronger: !0,
+                  children: r.get("subtractions")
+                }),
+                children: n(y, {
+                  items: o == null ? void 0 : o.subtractions
+                })
+              })
+            })]
+          }) : n("div", {
+            className: O(f, $),
+            children: [n(s, {
+              variant: e.BODY,
+              children: r.get("adjustments")
+            }), n(s, {
+              variant: e.BODY,
+              children: r.amount(t.adjustmentAmount.value, t.adjustmentAmount.currency)
+            })]
+          })
+        }), n("div", {
+          className: O(l),
+          children: n("div", {
+            className: O(f, X),
+            children: [n(s, {
+              variant: e.BODY,
+              stronger: !0,
+              children: r.get("netPayout")
+            }), n(s, {
+              variant: e.BODY,
+              stronger: !0,
+              children: r.amount(t.payoutAmount.value, t.payoutAmount.currency)
+            })]
+          })
+        })]
+      }), ((P = m == null ? void 0 : m.payout) == null ? void 0 : P.unpaidAmount) && n("div", {
+        className: Z,
+        children: [n(s, {
+          variant: e.BODY,
+          children: r.get("remainingAmount")
+        }), n(s, {
+          variant: e.BODY,
+          children: r.amount(m.payout.unpaidAmount.value, m.payout.unpaidAmount.currency)
+        })]
+      })]
+    }) : n(G, {
+      isLoading: H,
+      skeletonRowNumber: 6
+    })
+  });
 };
 export {
-  ci as PayoutData
+  gi as PayoutData
 };

package/dist/es/components/external/PayoutDetails/components/constants.js

@@ -1,13 +1,14 @@
-const _ = "adyen-pe-payout-data", A = `${_}__title`, S = `${_}__content`, n = `${S}--section`, o = `${S}--card`, C = `${o}-title`, t = `${n}-amount`, T = `${t}-gross`, c = `${t}-net`, s = `${_}--unpaid-amount`;
+const _ = "adyen-pe-payout-data", o = `${_}__title`, C = `${_}__title--ba-id`, S = `${_}__content`, n = `${S}--section`, A = `${S}--card`, T = `${A}-title`, t = `${n}-amount`, c = `${t}-gross`, s = `${t}-net`, D = `${_}--unpaid-amount`;
 export {
   _ as PD_BASE_CLASS,
-  o as PD_CARD_CLASS,
-  C as PD_CARD_TITLE_CLASS,
+  A as PD_CARD_CLASS,
+  T as PD_CARD_TITLE_CLASS,
   S as PD_CONTENT_CLASS,
   t as PD_SECTION_AMOUNT_CLASS,
   n as PD_SECTION_CLASS,
-  T as PD_SECTION_GROSS_AMOUNT_CLASS,
-  c as PD_SECTION_NET_AMOUNT_CLASS,
-  A as PD_TITLE_CLASS,
-  s as PD_UNPAID_AMOUNT
+  c as PD_SECTION_GROSS_AMOUNT_CLASS,
+  s as PD_SECTION_NET_AMOUNT_CLASS,
+  C as PD_TITLE_BA_CLASS,
+  o as PD_TITLE_CLASS,
+  D as PD_UNPAID_AMOUNT
 };

package/dist/es/components/external/PayoutsOverview/PayoutsOverviewElement.js

@@ -1,24 +1,18 @@
 var r = Object.defineProperty;
-var i = (o, t, e) => t in o ? r(o, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : o[t] = e;
-var n = (o, t, e) => (i(o, typeof t != "symbol" ? t + "" : t, e), e);
-import { jsx as c } from "../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import m from "./components/PayoutsOverviewContainer/PayoutsOverviewContainer.js";
-import a from "../UIElement/UIElement.js";
-class s extends a {
-  constructor(e) {
-    super(e);
-    n(this, "componentToRender", () => /* @__PURE__ */ c(
-      m,
-      {
-        ...this.props,
-        balanceAccountId: this.props.core.options.balanceAccountId,
-        ref: (e) => {
-          this.componentRef = e;
-        },
-        elementRef: this.elementRef
-      }
-    ));
-    this.elementRef = e && e.elementRef || this, this.componentToRender = this.componentToRender.bind(this);
+var c = (e, o, t) => o in e ? r(e, o, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[o] = t;
+var n = (e, o, t) => (c(e, typeof o != "symbol" ? o + "" : o, t), t);
+import p from "./components/PayoutsOverviewContainer/PayoutsOverviewContainer.js";
+import i from "../UIElement/UIElement.js";
+import { jsx as a } from "../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+class s extends i {
+  constructor(t) {
+    super(t);
+    n(this, "componentToRender", () => a(p, {
+      ...this.props,
+      balanceAccountId: this.props.balanceAccountId,
+      ref: (t) => void (this.componentRef = t)
+    }));
+    this.componentToRender = this.componentToRender.bind(this);
   }
 }
 n(s, "type", "payouts");