@adyen/adyen-platform-experience-web 1.8.1 → 1.10.0

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

@@ -0,0 +1,366 @@
+import { jsx as n } from "../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import { DEFAULT_PAYMENT_LINK_STATUS_GROUP as re, PAYMENT_LINK_STATUS_GROUPS_FILTER_MAPPING as lt, PAYMENT_LINK_STATUSES as Le, PAYMENT_LINK_TYPES as rt, TABS_CONTAINER_CLASS as ct, PAYMENT_LINK_STATUS_GROUPS_TABS as x, FILTERS_CONTAINER_CLASS as pt, ACTION_BUTTONS_CONTAINER_CLASS as Tt, ACTION_BUTTON_CLASS as ce, FILTERS_ALERT_CONTAINER_CLASS as pe, BASE_CLASS as mt, BASE_XS_CLASS as ut, EARLIEST_PAYMENT_LINK_DATE as dt } from "./constants.js";
+import { FilterParam as i } from "../../../types.js";
+import St from "../../../../hooks/useDefaultOverviewFilterParams.js";
+import { useState as S, useCallback as c, useMemo as m, useEffect as C, useRef as Et } from "../../../../external/preact/hooks/dist/hooks.module.js";
+import Ne from "../../../../core/Context/useCoreContext.js";
+import { LIMIT_OPTIONS as _t, DEFAULT_PAGE_LIMIT as At } from "../../../internal/Pagination/constants.js";
+import { PaymentLinksTable as yt } from "./PaymentLinksTable.js";
+import Lt from "../../../internal/Tabs/Tabs.js";
+/* empty css                          */
+import P from "classnames";
+import { useResponsiveContainer as Nt, containerQueries as vt } from "../../../../hooks/useResponsiveContainer.js";
+import { PopoverContainerSize as Te } from "../../../internal/Popover/types.js";
+import { PaymentLinkDetailsModal as It } from "./PaymentLinkDetailsModal/PaymentLinkDetailsModal.js";
+import { ButtonVariant as me } from "../../../internal/Button/types.js";
+import { PaymentLinksOverviewModal as Ct } from "./PaymentLinksOverviewModal.js";
+import { Alert as ue } from "../../../internal/Alert/Alert.js";
+import { AlertVariantOption as de, AlertTypeOption as Se } from "../../../internal/Alert/types.js";
+import Rt from "../../../internal/Pagination/hooks/useCursorPaginatedRecords.js";
+import { useMultiSelectionFilter as U } from "../../TransactionsOverview/components/MultiSelectionFilter/useMultiSelectionFilter/useMultiSelectionFilter.js";
+import Ft from "../../../../hooks/useModalDetails/useModalDetails.js";
+import kt from "../../../internal/Calendar/calendar/timerange/presets/lastNDays.js";
+import { Fragment as Mt } from "../../../../external/preact/dist/preact.module.js";
+import Y from "../../TransactionsOverview/components/MultiSelectionFilter/MultiSelectionFilter.js";
+import ft from "../../../internal/FilterBar/filters/DateFilter/DateFilter.js";
+import Ee from "../../../internal/FilterBar/filters/TextFilter/TextFilter.js";
+import _e from "../../../internal/Button/Button.js";
+import { Icon as gt } from "../../../internal/Icon/Icon.js";
+import ht from "../../../internal/FormFields/Select/Select.js";
+import { useConfigContext as Dt } from "../../../../core/ConfigContext/context.js";
+import { getTimeRangeSelectionDefaultPresetOptions as Ot, TIME_RANGE_SELECTION_PRESET_OPTION_KEYS as wt } from "../../../internal/DatePicker/components/TimeRangeSelector/useTimeRangeSelection.js";
+import { listFrom as g } from "../../../../utils/collection/main.js";
+import { useFilterBarState as bt, FilterBarMobileSwitch as Bt, FilterBar as Pt } from "../../../internal/FilterBar/FilterBar.js";
+import { isFunction as Ut } from "../../../../utils/value/is.js";
+import { Header as Yt } from "../../../internal/Header/Header.js";
+const Ae = "linkTypes", K = "statuses", ye = "storeIds", G = "_t", Kt = Object.keys(Le), Gt = ({
+  ["aria-label"]: L,
+  activeTab: E,
+  onChange: R
+}) => {
+  const { i18n: N } = Ne(), [_, A] = S(E), h = m(() => x.map(({ id: p, label: t }) => ({ id: p, name: N.get(t) })), [N]);
+  return C(() => {
+    const p = x.find((t) => t.id === _);
+    p && R(p);
+  }, [R, _]), C(() => A(E), [E]), /* @__PURE__ */ n(
+    ht,
+    {
+      "aria-label": L,
+      items: h,
+      selected: _,
+      onChange: ({ target: p }) => A(p.value),
+      showOverlay: !0,
+      multiSelect: !1,
+      filterable: !1
+    }
+  );
+}, Rn = ({
+  onFiltersChanged: L,
+  allowLimitSelection: E = !0,
+  preferredLimit: R = At,
+  onRecordSelection: N,
+  showDetails: _,
+  onContactSupport: A,
+  hideTitle: h,
+  isFiltersLoading: p,
+  filterParams: t,
+  stores: r,
+  allStores: ve,
+  paymentLinkCreation: Ie,
+  paymentLinkSettings: Ce,
+  storeIds: v,
+  filterError: u,
+  storeError: y
+}) => {
+  var ie, oe, ae, se, le;
+  const { i18n: o } = Ne(), { getPaymentLinks: D, createPBLPaymentLink: V, getPayByLinkSettings: H } = Dt().endpoints, Re = Ot({ exclude: [wt.YEAR_TO_DATE] }), { defaultParams: d, nowTimestamp: Fe, refreshNowTimestamp: O } = St(
+    "paymentLinks",
+    void 0,
+    void 0,
+    Re
+  ), [I, ke] = S(re), [z, Me] = S(I), [fe, j] = S(!1), F = Nt(vt.down.xs), [Q, w] = S(!1), ge = c(
+    async ({ [G]: e, ...s }, T) => {
+      const B = { signal: T, errorLevel: "error" }, f = g(s[i.STORE_IDS]), st = v ? g(v) : void 0;
+      return D(B, {
+        query: {
+          ...s,
+          storeIds: f != null && f.length ? f : st,
+          statuses: g(s[i.STATUSES]),
+          linkTypes: g(s[i.LINK_TYPES]),
+          createdSince: s[i.CREATED_SINCE] ?? d.current.defaultFilterParams[i.CREATED_SINCE],
+          createdUntil: s[i.CREATED_UNTIL] ?? d.current.defaultFilterParams[i.CREATED_UNTIL],
+          merchantReference: s[i.MERCHANT_REFERENCE] ?? d.current.defaultFilterParams[i.MERCHANT_REFERENCE],
+          paymentLinkId: s[i.PAYMENT_LINK_ID] ?? d.current.defaultFilterParams[i.PAYMENT_LINK_ID]
+        }
+      });
+    },
+    [d, D, v]
+  ), X = bt(), he = m(() => Ut(L) ? L : void 0, [L]), De = m(() => E ? _t : void 0, [E]), k = Object.assign(d.current.defaultFilterParams, {
+    [Ae]: void 0,
+    [K]: void 0,
+    statusGroup: re,
+    [ye]: void 0,
+    [G]: performance.now()
+  }), { canResetFilters: Oe, error: we, fetching: be, filters: a, limit: Be, limitOptions: Pe, records: Ue, resetFilters: xt, updateFilters: l, updateLimit: Ye, ...Ke } = Rt({
+    fetchRecords: ge,
+    dataField: "data",
+    filterParams: k,
+    initialFiltersSameAsDefault: !0,
+    onFiltersChanged: he,
+    preferredLimit: R,
+    preferredLimitOptions: De,
+    enabled: !!D
+  }), Ge = U({
+    mapFilterOptionName: c((e) => o.get(Le[e]), [o]),
+    filterParam: K,
+    filterValues: ((ie = t == null ? void 0 : t.statuses) == null ? void 0 : ie[lt[I]]) ?? Kt,
+    defaultFilters: k,
+    updateFilters: l,
+    filters: a
+  }), xe = U({
+    mapFilterOptionName: c((e) => o.get(rt[e]), [o]),
+    filterParam: Ae,
+    filterValues: t == null ? void 0 : t.linkTypes,
+    defaultFilters: k,
+    updateFilters: l,
+    filters: a
+  }), Ve = U({
+    mapFilterOptionName: c((e) => {
+      var s;
+      return ((s = r == null ? void 0 : r.find((T) => T.id === e)) == null ? void 0 : s.storeCode) ?? e;
+    }, [r]),
+    filterParam: ye,
+    filterValues: m(() => r && r.length > 0 ? r.filter((e) => e.id).map((e) => e.id) : void 0, [r]),
+    defaultFilters: k,
+    updateFilters: l,
+    filters: a
+  });
+  C(() => {
+    l({
+      [i.CURRENCIES]: void 0
+    });
+  }, [l]), C(() => {
+    O();
+  }, [a, O]);
+  const J = m(
+    () => ({
+      showDetails: _ ?? !0,
+      callback: N
+    }),
+    [_, N]
+  ), He = m(() => ({ paymentLink: J }), [J]), { updateDetails: W, resetDetails: ze, selectedDetail: je } = Ft(He), Qe = c(
+    ({ paymentLinkId: e }) => {
+      W({
+        selection: {
+          type: "paymentLink",
+          data: e
+        },
+        modalSize: "small"
+      }).callback({ id: e });
+    },
+    [W]
+  ), Xe = c(
+    (e) => {
+      e || (e = void 0), l({ merchantReference: e });
+    },
+    [l]
+  ), Je = c(
+    (e) => {
+      e || (e = void 0), l({ paymentLinkId: e });
+    },
+    [l]
+  ), M = Et(null), Z = c(
+    ({ id: e }) => {
+      M.current && clearTimeout(M.current), M.current = setTimeout(() => {
+        requestAnimationFrame(() => j(!1));
+        const T = { statusGroup: e, [K]: void 0 };
+        l(T), M.current = null;
+      }, 500), ke(e), j(!0), Me(void 0);
+    },
+    [l]
+  ), $ = m(() => o.get("payByLink.overview.list.filters.types.statusGroup"), [o]), We = (t == null ? void 0 : t.linkTypes) && ((oe = t == null ? void 0 : t.linkTypes) == null ? void 0 : oe.length) > 0 || !!u, Ze = (t == null ? void 0 : t.statuses) && ((ae = t == null ? void 0 : t.statuses) == null ? void 0 : ae[I]) && ((le = (se = t == null ? void 0 : t.statuses) == null ? void 0 : se[I]) == null ? void 0 : le.length) > 0 || !!u, $e = r && (r == null ? void 0 : r.length) > 1 || !!y, qe = m(() => new Date(kt(dt).from).toString(), []), [et, b] = S(!1), [tt, q] = S(void 0), nt = c(() => {
+    q("Creation"), b(!0);
+  }, []), it = c(() => {
+    q("Settings"), b(!0);
+  }, []), ot = c(() => {
+    b(!1);
+  }, []), ee = c(() => {
+    const e = /* @__PURE__ */ new Date(), s = a == null ? void 0 : a[i.CREATED_UNTIL], T = s ? new Date(s) : null, B = (T == null ? void 0 : T.toDateString()) === e.toDateString();
+    l({
+      ...B && { [i.CREATED_UNTIL]: e.toISOString() },
+      [G]: performance.now()
+    });
+  }, [a, l]), te = m(() => ({
+    onContactSupport: A,
+    storeIds: v
+  }), [A, v]);
+  C(() => {
+    w(!!y || !!u);
+  }, [y, u]);
+  const ne = c(() => {
+    w(!1);
+  }, [w]), at = !!(H || V);
+  return /* @__PURE__ */ n("div", { className: P(mt, { [ut]: F }), children: [
+    /* @__PURE__ */ n(Yt, { hideTitle: h, titleKey: "payByLink.overview.title", children: /* @__PURE__ */ n(Bt, { ...X }) }),
+    /* @__PURE__ */ n("div", { className: ct, children: F ? /* @__PURE__ */ n(
+      Gt,
+      {
+        "aria-label": $,
+        activeTab: z ?? I,
+        onChange: Z
+      }
+    ) : /* @__PURE__ */ n(
+      Lt,
+      {
+        "aria-label": $,
+        tabs: x,
+        activeTab: z,
+        onChange: Z
+      }
+    ) }),
+    /* @__PURE__ */ n(Mt, { children: [
+      !p && /* @__PURE__ */ n("div", { className: pt, children: [
+        /* @__PURE__ */ n(Pt, { ...X, ariaLabelKey: "payByLink.overview.filters.label", children: [
+          $e && /* @__PURE__ */ n(
+            Y,
+            {
+              ...Ve,
+              isInvalid: !!y,
+              readonly: !!y,
+              placeholder: o.get("payByLink.overview.filters.types.stores.label")
+            }
+          ),
+          /* @__PURE__ */ n(
+            ft,
+            {
+              canResetFilters: Oe,
+              defaultParams: d,
+              filters: a,
+              sinceDate: qe,
+              nowTimestamp: Fe,
+              refreshNowTimestamp: O,
+              updateFilters: l
+            }
+          ),
+          We && /* @__PURE__ */ n(
+            Y,
+            {
+              ...xe,
+              isInvalid: !!u,
+              readonly: !!u,
+              placeholder: o.get("payByLink.overview.filters.types.linkTypes.label")
+            }
+          ),
+          Ze && /* @__PURE__ */ n(
+            Y,
+            {
+              ...Ge,
+              isInvalid: !!u,
+              readonly: !!u,
+              placeholder: o.get("payByLink.overview.filters.types.status.label")
+            }
+          ),
+          /* @__PURE__ */ n(
+            Ee,
+            {
+              name: o.get("payByLink.overview.filters.types.merchantReference.label"),
+              label: a[i.MERCHANT_REFERENCE] ? a[i.MERCHANT_REFERENCE] : o.get("payByLink.overview.filters.types.merchantReference.label"),
+              value: a[i.MERCHANT_REFERENCE],
+              onChange: Xe,
+              type: "text",
+              containerSize: Te.MEDIUM
+            }
+          ),
+          /* @__PURE__ */ n(
+            Ee,
+            {
+              name: o.get("payByLink.overview.filters.types.paymentLinkID.label"),
+              label: a[i.PAYMENT_LINK_ID] ? a[i.PAYMENT_LINK_ID] : o.get("payByLink.overview.filters.types.paymentLinkID.label"),
+              value: a[i.PAYMENT_LINK_ID],
+              onChange: Je,
+              type: "text",
+              containerSize: Te.MEDIUM
+            }
+          ),
+          F && Q && /* @__PURE__ */ n(
+            ue,
+            {
+              className: P(pe),
+              type: Se.CRITICAL,
+              variant: de.TIP,
+              closeButton: !0,
+              onClose: ne,
+              description: o.get("payByLink.overview.filters.errors.networkError")
+            }
+          )
+        ] }),
+        at && /* @__PURE__ */ n("div", { className: Tt, children: [
+          V && /* @__PURE__ */ n(_e, { variant: me.PRIMARY, className: ce, onClick: nt, children: o.get("payByLink.overview.list.actions.createPaymentLink") }),
+          H && /* @__PURE__ */ n(
+            _e,
+            {
+              "aria-label": o.get("payByLink.overview.actions.settings.a11y.label"),
+              variant: me.SECONDARY,
+              className: ce,
+              onClick: it,
+              children: /* @__PURE__ */ n(gt, { name: "cog" })
+            }
+          )
+        ] })
+      ] }),
+      !F && Q && /* @__PURE__ */ n(
+        ue,
+        {
+          className: P(pe),
+          type: Se.CRITICAL,
+          variant: de.TIP,
+          closeButton: !0,
+          onClose: ne,
+          description: o.get("payByLink.overview.filters.errors.networkError")
+        }
+      )
+    ] }),
+    /* @__PURE__ */ n(
+      It,
+      {
+        selectedDetail: je,
+        resetDetails: ze,
+        onUpdate: ee,
+        children: /* @__PURE__ */ n(
+          yt,
+          {
+            stores: r,
+            storeError: y,
+            error: we,
+            limit: Be,
+            allStores: ve,
+            limitOptions: Pe,
+            loading: fe || be || p,
+            onContactSupport: A,
+            onLimitSelection: Ye,
+            onRowClick: Qe,
+            showPagination: !0,
+            paymentLinks: Ue,
+            ...Ke
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ n(
+      Ct,
+      {
+        modalType: tt,
+        isModalVisible: et,
+        onCloseModal: ot,
+        paymentLinkSettings: Ce,
+        paymentLinkCreation: Ie,
+        storeIds: te.storeIds,
+        onContactSupport: te.onContactSupport,
+        refreshPaymentLinkList: ee
+      }
+    )
+  ] });
+};
+export {
+  Rn as PaymentLinksOverview
+};

package/dist/es/components/external/PaymentLinksOverview/components/PaymentLinksOverviewContainer.js

@@ -0,0 +1,22 @@
+import { jsx as a } from "../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import { PaymentLinksOverview as m } from "./PaymentLinksOverview.js";
+import f from "../../../../hooks/usePaymentLinkFilters.js";
+/* empty css                          */
+function P({ ...r }) {
+  const { filters: t, isFetching: e, stores: i, filterError: n, allStores: s, storeError: o } = f(r == null ? void 0 : r.storeIds);
+  return /* @__PURE__ */ a(
+    m,
+    {
+      ...r,
+      filterParams: t,
+      stores: i,
+      allStores: s,
+      isFiltersLoading: e,
+      filterError: n,
+      storeError: o
+    }
+  );
+}
+export {
+  P as default
+};

package/dist/es/components/external/PaymentLinksOverview/components/PaymentLinksOverviewModal.js

@@ -0,0 +1,66 @@
+import { jsx as l } from "../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import h from "../../../../core/Context/useCoreContext.js";
+import { useState as B, useCallback as m, useEffect as R } from "../../../../external/preact/hooks/dist/hooks.module.js";
+import { popoverUtil as S } from "../../../internal/Popover/utils/popoverUtil.js";
+import a from "../../PaymentLinkCreation/components/PaymentLinkCreationContainer/PaymentLinkCreationContainer.js";
+import i from "../../PaymentLinkSettings/components/PaymentLinkSettingsContainer/PaymentLinkSettingsContainer.js";
+import j from "../../../internal/Modal/Modal.js";
+const U = ({
+  isModalVisible: r,
+  onCloseModal: u,
+  modalType: s,
+  paymentLinkCreation: e,
+  paymentLinkSettings: g,
+  storeIds: f,
+  onContactSupport: t,
+  refreshPaymentLinkList: o
+}) => {
+  const { i18n: w } = h(), [c, v] = B(!1), O = m(() => {
+    u(), c && (o == null || o(), v(!1));
+  }, [u, c, o]);
+  R(() => {
+    r && S.closeAll();
+  }, [r]);
+  const b = m(
+    (x) => {
+      var d;
+      (d = e == null ? void 0 : e.onPaymentLinkCreated) == null || d.call(e, x), v(!0);
+    },
+    [e]
+  );
+  return !r || !s ? null : /* @__PURE__ */ l("div", { children: /* @__PURE__ */ l(
+    j,
+    {
+      isOpen: r,
+      "aria-label": w.get("payByLink.overview.title"),
+      onClose: O,
+      isDismissible: !0,
+      headerWithBorder: !1,
+      size: "large",
+      children: [
+        s === "Creation" ? /* @__PURE__ */ l(
+          a,
+          {
+            ...e,
+            onPaymentLinkCreated: b,
+            storeIds: f,
+            onContactSupport: t,
+            embeddedInOverview: !0
+          }
+        ) : null,
+        s === "Settings" ? /* @__PURE__ */ l(
+          i,
+          {
+            ...g,
+            storeIds: f,
+            onContactSupport: t,
+            embeddedInOverview: !0
+          }
+        ) : null
+      ]
+    }
+  ) });
+};
+export {
+  U as PaymentLinksOverviewModal
+};

package/dist/es/components/external/PaymentLinksOverview/components/PaymentLinksTable.js

@@ -0,0 +1,209 @@
+import { jsx as r } from "../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import { useCallback as G, useMemo as T } from "../../../../external/preact/hooks/dist/hooks.module.js";
+import V from "../../../../core/Context/useCoreContext.js";
+import W from "../../../../hooks/useTimezoneAwareDateFormatting.js";
+import { useResponsiveContainer as g, containerQueries as k } from "../../../../hooks/useResponsiveContainer.js";
+import { useTableColumns as q } from "../../../../hooks/useTableColumns.js";
+import { BASE_TABLE_GRID_CLASS as X, MOBILE_TABLE_CELL_CLASS as N, MOBILE_EXPIRE_DATE_CELL_CLASS as $, PAYMENT_LINK_STATUSES as B, MOBILE_AMOUNT_CELL_CLASS as j } from "./constants.js";
+import { Tag as v } from "../../../internal/Tag/Tag.js";
+import { TagVariant as m } from "../../../internal/Tag/types.js";
+import s from "../../../internal/Typography/Typography.js";
+import { TypographyVariant as c, TypographyElement as l } from "../../../internal/Typography/types.js";
+import { DAY_MS as z } from "../../../internal/Calendar/calendar/constants.js";
+import { Tooltip as Q } from "../../../internal/Tooltip/Tooltip.js";
+import { isActionNeededUrgently as H } from "../../../utils/payByLink/actionLevel.js";
+import J from "classnames";
+import { PaymentLinksErrors as Z } from "./PaymentLinksErrors.js";
+import { FRONTEND_REDACTED_DATA_MARKER as ee, BACKEND_REDACTED_DATA_MARKER as re } from "../../../constants.js";
+import { ACCOUNT_MISCONFIGURATION as ie, WRONG_STORE_IDS as ne } from "../utils/getPaymentLinksErrorMessage.js";
+import C from "../../../internal/DataGrid/DataGrid.js";
+import te from "../../../internal/Pagination/Pagination.js";
+import { Fragment as I } from "../../../../external/preact/dist/preact.module.js";
+import { DATE_FORMAT_RESPONSE_DEADLINE as ae, DATE_FORMAT_PAYMENT_LINKS_OVERVIEW_EXPIRATION_DATE as A, DATE_FORMAT_PAYMENT_LINKS_OVERVIEW as oe } from "../../../../constants/dateFormats.js";
+const S = (d) => {
+  switch (d) {
+    case "completed":
+      return m.SUCCESS;
+    case "expired":
+      return m.DEFAULT;
+    case "paymentPending":
+      return m.WARNING;
+    case "active":
+      return m.BLUE;
+    default:
+      return m.DEFAULT;
+  }
+}, se = [
+  "paymentLinkId",
+  "merchantReference",
+  "storeCode",
+  "currency",
+  "amount",
+  "status",
+  "expirationDate",
+  "creationDate",
+  "linkType",
+  "shopperEmail"
+], R = {
+  paymentLinkId: "payByLink.overview.list.fields.id",
+  amount: "payByLink.overview.list.fields.amount",
+  currency: "payByLink.overview.list.fields.currency",
+  status: "payByLink.overview.list.fields.status",
+  expirationDate: "payByLink.overview.list.fields.expirationDate",
+  creationDate: "payByLink.overview.list.fields.createdAt",
+  linkType: "payByLink.overview.list.fields.linkType",
+  merchantReference: "payByLink.overview.list.fields.merchantReference",
+  shopperEmail: "payByLink.overview.list.fields.shopperEmail",
+  storeCode: "payByLink.overview.list.fields.store"
+}, ce = "payByLink.overview.errors.couldNotLoadLinks", we = ({
+  error: d,
+  loading: w,
+  onContactSupport: L,
+  onRowClick: O,
+  showDetails: le,
+  showPagination: M,
+  paymentLinks: b,
+  stores: o,
+  allStores: t,
+  storeError: f,
+  ...P
+}) => {
+  const { i18n: a, getImageAsset: D } = V(), { dateFormat: p } = W(), x = g(k.up.sm), F = G(
+    (e) => {
+      if (!e) return "";
+      const y = new Date(e).getTime() - Date.now(), _ = Math.ceil(y / z), h = p(e, { ...ae, weekday: void 0 });
+      return _ <= 1 ? a.get("payByLink.overview.common.actionNeeded.expiresToday", { values: { date: h } }) : a.get("payByLink.overview.common.actionNeeded.expiresDays", { values: { days: _, date: h } });
+    },
+    [p, a]
+  ), i = g(k.down.xs), U = q({
+    fields: se,
+    fieldsKeys: R,
+    columnConfig: {
+      amount: {
+        position: "right",
+        flex: x ? 1.5 : void 0
+      },
+      linkType: {
+        label: a.get(R.linkType),
+        visible: !i
+      },
+      storeCode: {
+        visible: o && (o == null ? void 0 : o.length) > 1 && !i
+      },
+      merchantReference: {
+        visible: !i
+      },
+      currency: {
+        visible: !i
+      },
+      status: {
+        visible: !i
+      },
+      expirationDate: {
+        visible: !i
+      },
+      creationDate: {
+        visible: !i
+      },
+      shopperEmail: {
+        visible: !i
+      }
+    }
+  }), Y = {
+    title: "payByLink.overview.errors.listEmpty",
+    message: ["payByLink.overview.errors.listEmpty.message"]
+  }, u = T(() => {
+    if (!((t == null ? void 0 : t.length) !== 0 || f))
+      return {
+        message: "No stores configured",
+        name: "Account misconfiguration",
+        errorCode: ie,
+        type: "error",
+        requestId: ""
+      };
+  }, [t, f]), E = T(() => {
+    if (!(t && (t == null ? void 0 : t.length) > 0 && (o == null ? void 0 : o.length) !== 0))
+      return {
+        errorCode: ne,
+        type: "error",
+        requestId: ""
+      };
+  }, [t, o]), K = T(
+    () => () => /* @__PURE__ */ r(
+      Z,
+      {
+        getImageAsset: D,
+        error: u || d || E,
+        onContactSupport: L,
+        errorMessage: ce
+      }
+    ),
+    [d, D, L, u, E]
+  );
+  return /* @__PURE__ */ r("div", { className: X, children: /* @__PURE__ */ r(
+    C,
+    {
+      narrowColumns: i,
+      errorDisplay: K,
+      error: u || d || E,
+      columns: U,
+      data: b,
+      loading: w,
+      outline: !1,
+      onRowClick: { callback: O },
+      emptyTableMessage: Y,
+      customCells: {
+        currency: ({ item: e }) => {
+          var n;
+          if ((n = e == null ? void 0 : e.amount) != null && n.currency)
+            return /* @__PURE__ */ r(v, { label: `${e.amount.currency}`, variant: m.DEFAULT });
+        },
+        amount: ({ value: e, item: n }) => {
+          const y = a.amount(e.value, e.currency, { hideCurrency: !0 });
+          return i ? /* @__PURE__ */ r("div", { className: J(N, j), children: [
+            /* @__PURE__ */ r(s, { el: l.SPAN, variant: c.BODY, strongest: !0, children: y }),
+            /* @__PURE__ */ r("span", { children: n.status && /* @__PURE__ */ r(v, { label: a.get(B[n.status]), variant: S(n.status) }) })
+          ] }) : /* @__PURE__ */ r(s, { el: l.SPAN, variant: c.BODY, children: y });
+        },
+        status: ({ value: e }) => {
+          if (e)
+            return /* @__PURE__ */ r(v, { label: a.get(`${B[e]}`), variant: S(e) });
+        },
+        linkType: ({ item: e }) => {
+          if (!(e != null && e.linkType)) return null;
+          const n = (e == null ? void 0 : e.linkType) === "open" ? "payByLink.common.linkType.open" : "payByLink.common.linkType.singleUse";
+          return /* @__PURE__ */ r(s, { el: l.SPAN, variant: c.BODY, children: a.get(n) });
+        },
+        creationDate: ({ value: e }) => /* @__PURE__ */ r("time", { dateTime: e, children: /* @__PURE__ */ r(s, { el: l.SPAN, variant: c.BODY, children: p(e, oe) }) }),
+        expirationDate: ({ value: e }) => H(e) ? /* @__PURE__ */ r(Q, { content: F(e), children: /* @__PURE__ */ r("span", { children: /* @__PURE__ */ r("time", { dateTime: e, children: p(e, A) }) }) }) : /* @__PURE__ */ r("time", { dateTime: e, children: /* @__PURE__ */ r(s, { el: l.SPAN, variant: c.BODY, children: p(e, A) }) }),
+        paymentLinkId: ({ item: e }) => i ? /* @__PURE__ */ r("div", { className: N, children: [
+          /* @__PURE__ */ r(s, { strongest: !0, el: l.SPAN, variant: c.BODY, children: e.paymentLinkId }),
+          /* @__PURE__ */ r("time", { dateTime: e.expirationDate, children: /* @__PURE__ */ r(
+            s,
+            {
+              className: $,
+              el: l.SPAN,
+              variant: c.CAPTION,
+              children: a.get("payByLink.overview.common.actionNeeded.expiresAt", {
+                values: { date: p(e.expirationDate, A) }
+              })
+            }
+          ) })
+        ] }) : /* @__PURE__ */ r(I, { children: e.paymentLinkId }),
+        shopperEmail: ({ item: e }) => /* @__PURE__ */ r(I, { children: e.shopperEmail === re ? ee : e.shopperEmail })
+      },
+      children: M && /* @__PURE__ */ r(C.Footer, { children: /* @__PURE__ */ r(
+        te,
+        {
+          ...P,
+          ariaLabelKey: "payByLink.overview.pagination.label",
+          limitSelectAriaLabelKey: "payByLink.overview.pagination.controls.limitSelect.label"
+        }
+      ) })
+    }
+  ) });
+};
+export {
+  se as PAYMENT_LINKS_TABLE_FIELDS,
+  we as PaymentLinksTable
+};