@adyen/adyen-platform-experience-web 1.7.0 → 1.8.0

package/dist/es/components/external/DisputesOverview/components/DisputesTable/DisputesTable.js

@@ -1,80 +1,99 @@
 import { jsx as t } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import a from "classnames";
-import { useState as I, useMemo as f, useCallback as P, useEffect as w } from "../../../../../external/preact/hooks/dist/hooks.module.js";
-import B from "../../../../../core/Context/useCoreContext.js";
-import Y from "../../../../../hooks/useTimezoneAwareDateFormatting.js";
-import { Alert as K } from "../../../../internal/Alert/Alert.js";
-import { AlertTypeOption as G } from "../../../../internal/Alert/types.js";
-import { isDisputeActionNeededUrgently as V } from "../../../../utils/disputes/actionNeeded.js";
-import { DISPUTE_REASON_CATEGORIES as $ } from "../../../../utils/disputes/constants.js";
-import j from "../../../../internal/DataOverviewError/DataOverviewError.js";
-import { TypographyVariant as i } from "../../../../internal/Typography/types.js";
-import l from "../../../../internal/Typography/Typography.js";
-import { BASE_CLASS as o } from "./constants.js";
-import { useTableColumns as H } from "../../../../../hooks/useTableColumns.js";
-import { useResponsiveContainer as q, containerQueries as z } from "../../../../../hooks/useResponsiveContainer.js";
-import m from "../../../TransactionsOverview/components/TransactionsTable/PaymentMethodCell.js";
-import Q from "./DisputeStatusTag.js";
-import { Tag as W } from "../../../../internal/Tag/Tag.js";
+import l from "classnames";
+import { useState as G, useMemo as S, useCallback as N, useEffect as $ } from "../../../../../external/preact/hooks/dist/hooks.module.js";
+import V from "../../../../../core/Context/useCoreContext.js";
+import H from "../../../../../hooks/useTimezoneAwareDateFormatting.js";
+import { Alert as j } from "../../../../internal/Alert/Alert.js";
+import { AlertTypeOption as q } from "../../../../internal/Alert/types.js";
+import { DAY_MS as z } from "../../../../internal/Calendar/calendar/constants.js";
+import { getDisputeReason as Q } from "../../../../utils/translation/getters.js";
+import { isDisputeActionNeededUrgently as W } from "../../../../utils/disputes/actionNeeded.js";
+import Z from "../../../../internal/DataOverviewError/DataOverviewError.js";
+import { TypographyVariant as v, TypographyElement as y } from "../../../../internal/Typography/types.js";
+import A from "../../../../internal/Typography/Typography.js";
+import { BASE_CLASS as r } from "./constants.js";
+import { useTableColumns as J } from "../../../../../hooks/useTableColumns.js";
+import { useResponsiveContainer as X, containerQueries as ee } from "../../../../../hooks/useResponsiveContainer.js";
+import f from "../../../TransactionsOverview/components/TransactionsTable/PaymentMethodCell.js";
+import te from "./DisputeStatusTag.js";
+import { Tag as oe } from "../../../../internal/Tag/Tag.js";
+import { Tooltip as ne } from "../../../../internal/Tooltip/Tooltip.js";
 /* empty css                   */
-import _ from "../../../../internal/DataGrid/DataGrid.js";
-import Z from "../../../../internal/Pagination/Pagination.js";
-import { DATE_FORMAT_DISPUTES as T } from "../../../../../constants/dateFormats.js";
-import { Translation as J } from "../../../../internal/Translation/Translation.js";
-import { Fragment as X } from "../../../../../external/preact/dist/preact.module.js";
-import { Icon as ee } from "../../../../internal/Icon/Icon.js";
-import { useConfigContext as te } from "../../../../../core/ConfigContext/context.js";
-const F = {
-  status: "disputes.status",
-  respondBy: "disputes.respondBy",
-  createdAt: "disputes.openedOn",
-  paymentMethod: "disputes.paymentMethod",
-  disputeReason: "disputes.disputeReason",
-  reason: "disputes.reason",
-  currency: "disputes.currency",
-  disputedAmount: "disputes.disputedAmount",
-  totalPaymentAmount: "disputes.totalPaymentAmount"
-}, R = {
-  CHARGEBACKS: { title: "disputes.empty.noChargebacksFound", message: "disputes.empty.tryDifferentSearchOrCheckAgainLaterForNewChargebacks" },
-  FRAUD_ALERTS: { title: "disputes.empty.noFraudAlertsFound", message: "disputes.empty.tryDifferentSearchOrCheckAgainLaterForNewFraudAlerts" },
-  ONGOING_AND_CLOSED: { title: "disputes.empty.noDisputesFound", message: "disputes.empty.tryDifferentSearchOrCheckAgainLaterForNewDisputes" }
-}, ne = Object.keys(F), r = {
-  cellContent: `${o}__cell-content`,
-  cellContentVStack: `${o}__cell-content--vstack`,
-  cellTextGrey: `${o}__cell-text--grey`,
-  statusContent: `${o}__status-content`,
-  statusContentUrgent: `${o}__status-content--urgent`
-}, ve = ({
-  error: d,
-  loading: C,
-  balanceAccountId: re,
-  onContactSupport: h,
-  showPagination: M,
-  onRowClick: N,
-  data: b,
-  customColumns: v,
-  activeBalanceAccount: u,
+import { DATE_FORMAT_RESPONSE_DEADLINE as se, DATE_FORMAT_DISPUTES as R } from "../../../../../constants/dateFormats.js";
+import M from "../../../../internal/DataGrid/DataGrid.js";
+import re from "../../../../internal/Pagination/Pagination.js";
+import { Translation as ie } from "../../../../internal/Translation/Translation.js";
+import { Icon as ae } from "../../../../internal/Icon/Icon.js";
+import { useConfigContext as le } from "../../../../../core/ConfigContext/context.js";
+const L = {
+  status: "disputes.overview.common.fields.status",
+  respondBy: "disputes.overview.common.fields.respondBy",
+  createdAt: "disputes.overview.common.fields.openedOn",
+  paymentMethod: "disputes.overview.common.fields.paymentMethod",
+  disputeReason: "disputes.overview.common.fields.disputeReason",
+  reason: "disputes.overview.common.fields.reason",
+  currency: "disputes.overview.common.fields.currency",
+  disputedAmount: "disputes.overview.common.fields.disputedAmount",
+  totalPaymentAmount: "disputes.overview.common.fields.totalPaymentAmount"
+}, O = {
+  CHARGEBACKS: { title: "disputes.overview.chargebacks.errors.listEmpty", message: "disputes.overview.chargebacks.errors.updateFilters" },
+  FRAUD_ALERTS: { title: "disputes.overview.fraudAlerts.errors.listEmpty", message: "disputes.overview.fraudAlerts.errors.updateFilters" },
+  ONGOING_AND_CLOSED: {
+    title: "disputes.overview.ongoingAndClosed.errors.listEmpty",
+    message: "disputes.overview.ongoingAndClosed.errors.updateFilters"
+  }
+}, de = Object.keys(L), n = {
+  cellContent: `${r}__cell-content`,
+  cellContentVStack: `${r}__cell-content--vstack`,
+  cellTextGrey: `${r}__cell-text--grey`,
+  dateContentUrgent: `${r}__date-content--urgent`,
+  statusContent: `${r}__status-content`,
+  statusContentUrgent: `${r}__status-content--urgent`
+}, Ie = ({
+  error: D,
+  loading: E,
+  balanceAccountId: me,
+  onContactSupport: T,
+  showPagination: _,
+  onRowClick: F,
+  data: k,
+  customColumns: U,
+  activeBalanceAccount: g,
   statusGroup: s,
-  ...O
+  ...P
 }) => {
-  const { i18n: c } = B(), { refreshing: D } = te(), { dateFormat: g } = Y(u == null ? void 0 : u.timeZone), [S, L] = I(null), p = f(() => C || D, [C, D]), n = q(z.down.xs), k = H({
-    fields: ne,
-    fieldsKeys: F,
-    customColumns: v,
-    columnConfig: f(
+  const { i18n: i } = V(), { refreshing: b } = le(), { dateFormat: d } = H(g == null ? void 0 : g.timeZone), [w, x] = G(null), C = S(() => E || b, [E, b]), o = X(ee.down.xs);
+  let m;
+  if (_)
+    switch (s) {
+      case "CHARGEBACKS":
+        m = "disputes.overview.chargebacks.limitSelect.a11y.label";
+        break;
+      case "FRAUD_ALERTS":
+        m = "disputes.overview.fraudAlerts.limitSelect.a11y.label";
+        break;
+      case "ONGOING_AND_CLOSED":
+        m = "disputes.overview.ongoingAndClosed.limitSelect.a11y.label";
+        break;
+    }
+  const I = J({
+    fields: de,
+    fieldsKeys: L,
+    customColumns: U,
+    columnConfig: S(
       () => ({
         status: {
           visible: s === "ONGOING_AND_CLOSED"
         },
         reason: {
-          visible: s === "FRAUD_ALERTS" && !n,
+          visible: s === "FRAUD_ALERTS" && !o,
           flex: 2
         },
         respondBy: {
           visible: s === "CHARGEBACKS"
         },
         currency: {
-          visible: !n,
+          visible: !o,
           flex: 0.5
         },
         disputedAmount: {
@@ -82,97 +101,118 @@ const F = {
           position: "right"
         },
         createdAt: {
-          visible: !n || s === "FRAUD_ALERTS"
+          visible: !o || s === "FRAUD_ALERTS"
         },
         paymentMethod: {
-          visible: !n
+          visible: !o
         },
         disputeReason: {
-          visible: s !== "FRAUD_ALERTS" && !n
+          visible: s !== "FRAUD_ALERTS" && !o
         },
         totalPaymentAmount: {
           visible: s === "FRAUD_ALERTS",
           position: "right"
         }
       }),
-      [n, s]
+      [o, s]
     )
-  }), y = P(() => L(null), []), x = {
-    title: R[s].title,
-    message: [R[s].message]
-  }, U = f(
-    () => () => /* @__PURE__ */ t(j, { error: d, errorMessage: "disputes.error.weCouldNotLoadYourDisputes", onContactSupport: h }),
-    [d, h]
+  }), h = N(() => x(null), []), B = N(
+    (e) => {
+      if (!e) return "";
+      const u = new Date(e).getTime() - Date.now(), p = Math.ceil(u / z), a = d(e, { ...se, weekday: void 0 });
+      return p <= 1 ? i.get("disputes.overview.common.actionNeeded.respondToday", { values: { date: a } }) : i.get("disputes.overview.common.actionNeeded.respondDays", { values: { days: p, date: a } });
+    },
+    [d, i]
+  ), K = {
+    title: O[s].title,
+    message: [O[s].message]
+  }, Y = S(
+    () => () => /* @__PURE__ */ t(Z, { error: D, errorMessage: "disputes.overview.common.errors.listUnavailable", onContactSupport: T }),
+    [D, T]
   );
-  return w(() => {
-    p && y();
-  }, [p, y]), /* @__PURE__ */ t("div", { className: o, children: [
-    S && /* @__PURE__ */ t(K, { onClose: y, type: G.WARNING, className: "adyen-pe-disputes-table-alert", ...S }),
+  return $(() => {
+    C && h();
+  }, [C, h]), /* @__PURE__ */ t("div", { className: r, children: [
+    w && /* @__PURE__ */ t(j, { onClose: h, type: q.WARNING, className: "adyen-pe-disputes-table-alert", ...w }),
     /* @__PURE__ */ t(
-      _,
+      M,
       {
-        autoFitColumns: n,
-        errorDisplay: U,
-        error: d,
-        columns: k,
-        data: b,
-        loading: p,
+        autoFitColumns: o,
+        errorDisplay: Y,
+        error: D,
+        columns: I,
+        data: k,
+        loading: C,
         outline: !1,
-        onRowClick: { callback: N },
-        emptyTableMessage: x,
+        onRowClick: { callback: F },
+        emptyTableMessage: K,
         customCells: {
-          status: ({ item: e }) => /* @__PURE__ */ t("div", { className: a(r.cellContent, { [r.cellContentVStack]: n }), children: [
-            /* @__PURE__ */ t(Q, { dispute: e }),
-            n && /* @__PURE__ */ t(m, { paymentMethod: e.paymentMethod })
+          status: ({ item: e }) => /* @__PURE__ */ t("div", { className: l(n.cellContent, { [n.cellContentVStack]: o }), children: [
+            /* @__PURE__ */ t(te, { dispute: e }),
+            o && /* @__PURE__ */ t(f, { paymentMethod: e.paymentMethod })
           ] }),
           reason: ({ item: e }) => e.reason.title,
           respondBy: ({ item: e }) => {
-            const A = V(e), E = () => /* @__PURE__ */ t(X, { children: [
-              g(e.dueDate, T),
-              A && /* @__PURE__ */ t(ee, { name: "warning-filled" })
-            ] });
-            return /* @__PURE__ */ t("div", { className: a(r.cellContent, { [r.cellContentVStack]: n }), children: [
+            const c = W(e), u = d(e.dueDate, R), p = !0, a = () => c && p ? /* @__PURE__ */ t(ne, { content: B(e.dueDate), children: /* @__PURE__ */ t("span", { className: n.dateContentUrgent, children: [
+              /* @__PURE__ */ t("time", { dateTime: e.dueDate, children: u }),
+              /* @__PURE__ */ t(ae, { name: "warning-filled" })
+            ] }) }) : /* @__PURE__ */ t("time", { dateTime: e.dueDate, children: u });
+            return /* @__PURE__ */ t("div", { className: l(n.cellContent, { [n.cellContentVStack]: o }), children: [
               e.dueDate ? /* @__PURE__ */ t(
-                l,
+                A,
                 {
-                  variant: i.BODY,
-                  className: a(r.statusContent, {
-                    [r.cellTextGrey]: n && !A,
-                    [r.statusContentUrgent]: A
+                  el: y.SPAN,
+                  variant: v.BODY,
+                  className: l(n.statusContent, {
+                    [n.cellTextGrey]: o && !c,
+                    [n.statusContentUrgent]: c
                   }),
-                  children: n ? /* @__PURE__ */ t(J, { translationKey: "disputes.gridCell.dueDate", fills: { dueDate: E } }) : E()
+                  children: o ? /* @__PURE__ */ t(
+                    ie,
+                    {
+                      translationKey: "disputes.overview.common.actionNeeded.dueDate",
+                      fills: { dueDate: a }
+                    }
+                  ) : a()
                 }
               ) : null,
-              n && /* @__PURE__ */ t(m, { paymentMethod: e.paymentMethod })
+              o && /* @__PURE__ */ t(f, { paymentMethod: e.paymentMethod })
             ] });
           },
-          currency: ({ item: e }) => /* @__PURE__ */ t(W, { children: e.amount.currency }),
-          disputedAmount: ({ item: e }) => e.amount && /* @__PURE__ */ t(l, { variant: i.BODY, stronger: !0, children: c.amount(e.amount.value, e.amount.currency, { hideCurrency: !1 }) }),
-          createdAt: ({ item: e }) => /* @__PURE__ */ t("div", { className: a(r.cellContent, { [r.cellContentVStack]: n }), children: [
+          currency: ({ item: e }) => /* @__PURE__ */ t(oe, { children: e.amount.currency }),
+          disputedAmount: ({ item: e }) => e.amount && /* @__PURE__ */ t(A, { el: y.SPAN, variant: v.BODY, stronger: !0, children: i.amount(e.amount.value, e.amount.currency, { hideCurrency: !1 }) }),
+          createdAt: ({ item: e }) => /* @__PURE__ */ t("div", { className: l(n.cellContent, { [n.cellContentVStack]: o }), children: [
             /* @__PURE__ */ t(
-              l,
+              "time",
               {
-                variant: i.BODY,
-                className: a(r.statusContent, {
-                  [r.cellTextGrey]: n
+                dateTime: e.createdAt,
+                className: l(n.statusContent, {
+                  [n.cellTextGrey]: o
                 }),
-                children: g(e.createdAt, T)
+                children: /* @__PURE__ */ t(A, { el: y.SPAN, variant: v.BODY, children: d(e.createdAt, R) })
               }
             ),
-            n && /* @__PURE__ */ t(m, { paymentMethod: e.paymentMethod })
+            o && /* @__PURE__ */ t(f, { paymentMethod: e.paymentMethod })
           ] }),
-          paymentMethod: ({ item: e }) => /* @__PURE__ */ t(m, { paymentMethod: e.paymentMethod }),
-          disputeReason: ({ item: e }) => /* @__PURE__ */ t("span", { children: c.get($[e.reason.category]) }),
-          totalPaymentAmount: ({ item: e }) => e && /* @__PURE__ */ t(l, { variant: i.BODY, stronger: !0, children: c.amount(e.amount.value, e.amount.currency, { hideCurrency: !1 }) })
+          paymentMethod: ({ item: e }) => /* @__PURE__ */ t(f, { paymentMethod: e.paymentMethod }),
+          disputeReason: ({ item: e }) => /* @__PURE__ */ t("span", { children: Q(i, e.reason.category) }),
+          totalPaymentAmount: ({ item: e }) => e && /* @__PURE__ */ t(A, { el: y.SPAN, variant: v.BODY, stronger: !0, children: i.amount(e.amount.value, e.amount.currency, { hideCurrency: !1 }) })
         },
-        children: M && /* @__PURE__ */ t(_.Footer, { children: /* @__PURE__ */ t(Z, { ...O }) })
+        children: _ && /* @__PURE__ */ t(M.Footer, { children: /* @__PURE__ */ t(
+          re,
+          {
+            ...P,
+            ariaLabelKey: "disputes.overview.common.pagination.a11y.label",
+            limitSelectAriaLabelKey: m
+          }
+        ) })
       }
     )
   ] });
 };
 export {
-  ve as DisputesTable,
-  R as EMPTY_TABLE_MESSAGE_KEYS,
-  ne as FIELDS,
-  F as FIELD_KEYS
+  Ie as DisputesTable,
+  O as EMPTY_TABLE_MESSAGE_KEYS,
+  de as FIELDS,
+  L as FIELD_KEYS
 };

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

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