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

package/dist/es/components/external/PaymentLinkCreation/hooks/useInvalidFieldsConfig.js

@@ -0,0 +1,22 @@
+import { useState as e, useCallback as t, useEffect as d } from "../../../../external/preact/hooks/dist/hooks.module.js";
+import c from "../../../../core/Context/useCoreContext.js";
+import f from "../../../../config/payByLink/invalidFieldsConfig.json.js";
+const m = () => {
+  const { getCdnConfig: i } = c(), o = f, [s, a] = e(o), n = t(async () => {
+    const l = await (i == null ? void 0 : i({
+      subFolder: "payByLink",
+      name: "invalidFieldsConfig",
+      fallback: o
+    }));
+    a(l ?? o);
+  }, [i, o]);
+  return d(() => {
+    n();
+  }, [n]), {
+    invalidFieldsConfig: s,
+    getInvalidFieldsConfig: n
+  };
+};
+export {
+  m as useInvalidFieldsConfig
+};

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

@@ -0,0 +1,214 @@
+const x = (u, e) => {
+  const s = u.map((r) => document.querySelector(`[name="${r}"]`)).filter((r) => r !== null).sort((r, d) => {
+    const l = r.getBoundingClientRect(), a = d.getBoundingClientRect();
+    return l.top - a.top;
+  })[0];
+  if (!s) return;
+  const i = s.getBoundingClientRect();
+  if (!(i.top >= e && i.bottom <= window.innerHeight)) {
+    const r = Math.max(0, window.scrollY + i.top - e);
+    window.scrollTo({ top: r, behavior: "smooth" });
+  }
+}, D = ({
+  i18n: u,
+  getFieldConfig: e
+}) => {
+  var m, s, i, y, r, d, l, a, n, p, o, c, t, b, q, v, N, A, k, h, L, B, f, T, V, S, R, w, E, O;
+  return [
+    {
+      id: "store",
+      fields: [
+        {
+          fieldName: "store",
+          required: !0,
+          visible: !0,
+          label: "payByLink.creation.summary.fields.store"
+        }
+      ],
+      isOptional: !1
+    },
+    {
+      id: "payment",
+      fields: [
+        {
+          fieldName: "linkValidity.quantity",
+          required: !!((m = e("linkValidity")) != null && m.required),
+          visible: !!e("linkValidity"),
+          label: "payByLink.creation.summary.fields.linkValidity"
+        },
+        {
+          fieldName: "linkValidity.durationUnit",
+          required: !!((s = e("linkValidity")) != null && s.required),
+          visible: !!e("linkValidity")
+        },
+        {
+          fieldName: "amount.value",
+          required: !!((i = e("amountValue")) != null && i.required),
+          visible: !!e("amountValue"),
+          label: "payByLink.creation.summary.fields.amountValue"
+        },
+        {
+          fieldName: "amount.currency",
+          required: !!((y = e("currency")) != null && y.required),
+          visible: !!e("currency"),
+          label: "payByLink.creation.summary.fields.currency",
+          options: (r = e("currency")) == null ? void 0 : r.options
+        },
+        {
+          fieldName: "reference",
+          required: !!((d = e("merchantReference")) != null && d.required),
+          visible: !!e("merchantReference"),
+          label: "payByLink.creation.summary.fields.merchantReference"
+        },
+        {
+          fieldName: "linkType",
+          required: !!((l = e("linkType")) != null && l.required),
+          visible: !!e("linkType"),
+          label: "payByLink.creation.summary.fields.linkType"
+        },
+        {
+          fieldName: "description",
+          required: !!((a = e("description")) != null && a.required),
+          visible: !!e("description"),
+          label: "payByLink.creation.summary.fields.description"
+        },
+        {
+          fieldName: "deliverAt",
+          required: !!((n = e("deliveryDate")) != null && n.required),
+          visible: !!e("deliveryDate")
+        }
+      ],
+      isOptional: !1
+    },
+    {
+      id: "customer",
+      fields: [
+        {
+          fieldName: "shopperReference",
+          required: !!((p = e("shopperReference")) != null && p.required),
+          visible: !!e("shopperReference"),
+          label: "payByLink.creation.summary.fields.shopperReference"
+        },
+        {
+          fieldName: "shopperName.firstName",
+          required: !!((o = e("shopperName")) != null && o.required),
+          visible: !!e("shopperName"),
+          label: "payByLink.creation.summary.fields.shopperName"
+        },
+        {
+          fieldName: "shopperName.lastName",
+          required: !!((c = e("shopperName")) != null && c.required),
+          visible: !!e("shopperName"),
+          label: "payByLink.creation.summary.fields.shopperLastName"
+        },
+        {
+          fieldName: "shopperEmail",
+          required: !!((t = e("emailAddress")) != null && t.required),
+          visible: !!e("emailAddress"),
+          label: "payByLink.creation.summary.fields.emailAddress"
+        },
+        {
+          fieldName: "sendSuccessEmailToShopper",
+          required: !!((b = e("sendSuccessEmailToShopper")) != null && b.required),
+          visible: !!e("sendSuccessEmailToShopper")
+        },
+        {
+          fieldName: "sendLinkToShopper",
+          required: !!((q = e("sendLinkToShopper")) != null && q.required),
+          visible: !!e("sendLinkToShopper"),
+          label: "payByLink.creation.summary.fields.emailAddress"
+        },
+        {
+          fieldName: "telephoneNumber",
+          required: !!((v = e("phoneNumber")) != null && v.required),
+          visible: !!e("phoneNumber"),
+          label: "payByLink.creation.summary.fields.phoneNumber"
+        },
+        {
+          fieldName: "countryCode",
+          required: !!((N = e("countryCode")) != null && N.required),
+          visible: !!e("countryCode"),
+          label: "payByLink.creation.summary.fields.countryCode",
+          options: (A = e("countryCode")) == null ? void 0 : A.options
+        },
+        {
+          fieldName: "deliveryAddress.street",
+          required: !!((k = e("deliveryAddress")) != null && k.required),
+          visible: !!e("deliveryAddress"),
+          label: "payByLink.creation.summary.fields.deliveryAddress.street"
+        },
+        {
+          fieldName: "deliveryAddress.houseNumberOrName",
+          required: !!((h = e("deliveryAddress")) != null && h.required),
+          visible: !!e("deliveryAddress"),
+          label: "payByLink.creation.summary.fields.deliveryAddress.houseNumberOrName"
+        },
+        {
+          fieldName: "deliveryAddress.postalCode",
+          required: !!((L = e("deliveryAddress")) != null && L.required),
+          visible: !!e("deliveryAddress"),
+          label: "payByLink.creation.summary.fields.deliveryAddress.postalCode"
+        },
+        {
+          fieldName: "deliveryAddress.city",
+          required: !!((B = e("deliveryAddress")) != null && B.required),
+          visible: !!e("deliveryAddress"),
+          label: "payByLink.creation.summary.fields.deliveryAddress.city"
+        },
+        {
+          fieldName: "deliveryAddress.country",
+          required: !!((f = e("deliveryAddress")) != null && f.required),
+          visible: !!e("deliveryAddress"),
+          label: "payByLink.creation.summary.fields.deliveryAddress.country"
+        },
+        {
+          fieldName: "billingAddress.street",
+          required: !!((T = e("billingAddress")) != null && T.required),
+          visible: !!e("billingAddress"),
+          label: "payByLink.creation.summary.fields.billingAddress.street"
+        },
+        {
+          fieldName: "billingAddress.houseNumberOrName",
+          required: !!((V = e("billingAddress")) != null && V.required),
+          visible: !!e("billingAddress"),
+          label: "payByLink.creation.summary.fields.billingAddress.houseNumberOrName"
+        },
+        {
+          fieldName: "billingAddress.postalCode",
+          required: !!((S = e("billingAddress")) != null && S.required),
+          visible: !!e("billingAddress"),
+          label: "payByLink.creation.summary.fields.billingAddress.postalCode"
+        },
+        {
+          fieldName: "billingAddress.city",
+          required: !!((R = e("billingAddress")) != null && R.required),
+          visible: !!e("billingAddress"),
+          label: "payByLink.creation.summary.fields.billingAddress.city"
+        },
+        {
+          fieldName: "billingAddress.country",
+          required: !!((w = e("billingAddress")) != null && w.required),
+          visible: !!e("billingAddress"),
+          label: "payByLink.creation.summary.fields.billingAddress.country"
+        },
+        {
+          fieldName: "shopperLocale",
+          required: !!((E = e("shopperLocale")) != null && E.required),
+          visible: !!e("shopperLocale"),
+          options: (O = e("shopperLocale")) == null ? void 0 : O.options
+        }
+      ],
+      isOptional: !1
+    },
+    {
+      id: "summary",
+      title: u.get("payByLink.creation.form.steps.customer"),
+      fields: [],
+      isOptional: !0
+    }
+  ];
+};
+export {
+  D as getFormSteps,
+  x as scrollToFirstErrorField
+};

package/dist/es/components/external/PaymentLinkDetails/PaymentLinkDetailsElement.js

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

package/dist/es/components/external/PaymentLinkDetails/components/PaymentLinkActivity/PaymentLinkActivity.js

@@ -0,0 +1,34 @@
+import { jsx as r } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import { useMemo as p } from "../../../../../external/preact/hooks/dist/hooks.module.js";
+import a from "../../../../../core/Context/useCoreContext.js";
+import { TimelineItem as f } from "../../../../internal/Timeline/components/TimelineItem.js";
+import l from "../../../../internal/Timeline/Timeline.js";
+import { TimelineDateFormat as T } from "../../../../internal/Timeline/types.js";
+import { getStatus as u, getDescriptionKey as d, getTitleKey as g } from "./utils.js";
+const E = ({ activities: t }) => {
+  const { i18n: m } = a(), i = p(
+    () => t.map((e) => ({
+      titleKey: g(e),
+      descriptionKey: d(e),
+      date: e.date,
+      status: u(e)
+    })),
+    [t]
+  );
+  return /* @__PURE__ */ r(l, { children: i.map(({ titleKey: e, date: o, status: n, descriptionKey: s }) => /* @__PURE__ */ r(
+    f,
+    {
+      title: m.get(e),
+      timestamp: {
+        date: new Date(o),
+        format: T.FULL_DATE_EXACT_TIME
+      },
+      status: n,
+      description: m.get(s)
+    },
+    o
+  )) });
+};
+export {
+  E as PaymentLinkActivity
+};

package/dist/es/components/external/PaymentLinkDetails/components/PaymentLinkActivity/utils.js

@@ -0,0 +1,39 @@
+const t = (e) => {
+  switch (e.type) {
+    case "createdAction":
+      return "payByLink.details.activity.created";
+    case "expiredAction":
+      return "payByLink.details.activity.expired";
+    case "paymentAttempt":
+      return "payByLink.details.activity.paymentAttempt";
+    default:
+      return;
+  }
+}, a = (e) => {
+  switch (e.expirationReason) {
+    case "maximumAttemptsReached":
+      return "payByLink.details.activity.expirationReason.maximumAttemptsReached";
+    case "manuallyExpired":
+      return "payByLink.details.activity.expirationReason.manuallyExpired";
+    case "expirationDateReached":
+      return "payByLink.details.activity.expirationReason.expirationDateReached";
+    default:
+      return;
+  }
+}, i = (e) => {
+  switch (e.type) {
+    case "createdAction":
+      return "green";
+    case "expiredAction":
+      return "red";
+    case "paymentAttempt":
+      return "blue";
+    default:
+      return "black";
+  }
+};
+export {
+  a as getDescriptionKey,
+  i as getStatus,
+  t as getTitleKey
+};

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

@@ -0,0 +1,196 @@
+import { jsx as t } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import K from "classnames";
+import $ from "../../../../../core/Context/useCoreContext.js";
+import { useMemo as F, useCallback as r, useState as P, useEffect as z } from "../../../../../external/preact/hooks/dist/hooks.module.js";
+import b from "../../../../internal/Button/ButtonActions/ButtonActions.js";
+import { ButtonVariant as p } from "../../../../internal/Button/types.js";
+import { useFetch as _ } from "../../../../../hooks/useFetch.js";
+import { useModalContext as G } from "../../../../internal/Modal/Modal.js";
+import { PaymentLinkSummary as H } from "../PaymentLinkSummary/PaymentLinkSummary.js";
+import { PaymentLinkTabs as Q } from "../PaymentLinkTabs/PaymentLinkTabs.js";
+import { PaymentLinkExpiration as W } from "../PaymentLinkExpiration/PaymentLinkExpiration.js";
+/* empty css                        */
+import { PaymentLinkSkeleton as X } from "../PaymentLinkSkeleton/PaymentLinkSkeleton.js";
+import { PaymentLinkError as Z } from "../PaymentLinkError/PaymentLinkError.js";
+import w from "../../../../internal/Typography/Typography.js";
+import { TypographyVariant as O } from "../../../../internal/Typography/types.js";
+import { Icon as R } from "../../../../internal/Icon/Icon.js";
+import { Fragment as U } from "../../../../../external/preact/dist/preact.module.js";
+import { Header as D } from "../../../../internal/Header/Header.js";
+import { useConfigContext as tt } from "../../../../../core/ConfigContext/context.js";
+import { EMPTY_OBJECT as et } from "../../../../../utils/value/constants.js";
+const d = {
+  root: "adyen-pe-payment-link-details",
+  content: "adyen-pe-payment-link-details__content",
+  expirationSuccessContainer: "adyen-pe-payment-link-details__expiration-success-container",
+  expirationSuccessIcon: "adyen-pe-payment-link-details__expiration-success-icon"
+}, vt = ({ id: u, onUpdate: l, hideTitle: Y, onContactSupport: C, onDismiss: a, isDismissButtonHidden: g }) => {
+  const { i18n: i, getCdnDataset: f } = $(), { getPayByLinkPaymentLinkById: k } = tt().endpoints, {
+    data: n,
+    isFetching: M,
+    error: h,
+    refetch: L
+  } = _(
+    F(
+      () => ({
+        fetchOptions: {
+          enabled: !!u && !!k
+        },
+        queryFn: async () => k(et, {
+          path: {
+            paymentLinkId: u
+          }
+        })
+      }),
+      [k, u]
+    )
+  ), { data: m, isFetching: V } = _({
+    queryFn: r(async () => {
+      const e = `${i.locale ?? "en-US"}`;
+      return f ? await f({
+        name: e,
+        extension: "json",
+        subFolder: "countries",
+        fallback: []
+      }) ?? [] : [];
+    }, [f, i.locale])
+  }), S = r(
+    (e) => {
+      const x = m == null ? void 0 : m.find((J) => J.id === e);
+      return x == null ? void 0 : x.name;
+    },
+    [m]
+  ), v = M || V, o = F(
+    () => {
+      var e;
+      return n && {
+        ...n,
+        shopperInformation: {
+          ...n == null ? void 0 : n.shopperInformation,
+          shopperCountry: ((e = n == null ? void 0 : n.shopperInformation) == null ? void 0 : e.shopperCountry) && S(n == null ? void 0 : n.shopperInformation.shopperCountry)
+        }
+      };
+    },
+    [n, S]
+  ), [c, y] = P("details"), [s, B] = P(!1);
+  z(() => {
+    let e;
+    return s && (e = setTimeout(() => B(!1), 3e3)), () => clearTimeout(e);
+  }, [s]);
+  const E = r(async () => {
+    if (o)
+      try {
+        await navigator.clipboard.writeText(o.linkInformation.paymentLink), B(!0);
+      } catch (e) {
+        console.error("Failed to copy link:", e);
+      }
+  }, [o]), I = r(() => {
+    y("expirationConfirmation");
+  }, []), N = r(() => {
+    y("expirationSuccess"), l == null || l();
+  }, [l]), T = r(() => {
+    y("details"), L();
+  }, [L]), A = r(() => {
+    a == null || a();
+  }, [a]), { withinModal: q } = G(), j = r(() => {
+    if (v)
+      return /* @__PURE__ */ t(X, {});
+    if (!o || h)
+      return /* @__PURE__ */ t(
+        Z,
+        {
+          error: h,
+          onDismiss: a,
+          onContactSupport: C
+        }
+      );
+    if (c === "expirationConfirmation")
+      return /* @__PURE__ */ t(
+        W,
+        {
+          paymentLink: o,
+          onCancel: () => y("details"),
+          onExpirationSuccess: N
+        }
+      );
+    if (c === "expirationSuccess") {
+      const e = [
+        ...a ? [
+          {
+            title: i.get("payByLink.details.expirationSuccess.actions.goBackToList"),
+            event: A,
+            variant: p.SECONDARY
+          }
+        ] : [],
+        {
+          title: i.get("payByLink.details.expirationSuccess.actions.showDetails"),
+          event: T,
+          variant: p.SECONDARY
+        }
+      ];
+      return /* @__PURE__ */ t("div", { className: d.expirationSuccessContainer, children: [
+        /* @__PURE__ */ t(R, { name: "checkmark-circle-fill", className: d.expirationSuccessIcon }),
+        /* @__PURE__ */ t(w, { variant: O.TITLE, children: i.get("payByLink.details.expirationSuccess.title") }),
+        /* @__PURE__ */ t(w, { variant: O.BODY, children: i.get("payByLink.details.expirationSuccess.description") }),
+        /* @__PURE__ */ t(b, { actions: e })
+      ] });
+    }
+    if (c === "details") {
+      const e = [
+        {
+          title: i.get(s ? "payByLink.details.actions.copied" : "payByLink.details.actions.copyLink"),
+          event: E,
+          variant: p.PRIMARY,
+          iconLeft: /* @__PURE__ */ t(
+            R,
+            {
+              className: "adyen-pe-payment-link-creation-form-success__button-icon",
+              name: s ? "checkmark" : "copy"
+            }
+          )
+        },
+        ...o.linkInformation.status !== "expired" && o.linkInformation.status !== "completed" ? [
+          {
+            title: i.get("payByLink.details.actions.expire"),
+            event: I,
+            variant: p.SECONDARY
+          }
+        ] : [],
+        ...!g && a ? [
+          {
+            title: i.get("payByLink.common.actions.goBack"),
+            event: a,
+            variant: p.SECONDARY
+          }
+        ] : []
+      ];
+      return /* @__PURE__ */ t(U, { children: [
+        /* @__PURE__ */ t(H, { paymentLink: o }),
+        /* @__PURE__ */ t(Q, { paymentLink: o }),
+        /* @__PURE__ */ t(b, { actions: e })
+      ] });
+    }
+  }, [
+    v,
+    o,
+    h,
+    c,
+    a,
+    C,
+    N,
+    i,
+    A,
+    T,
+    s,
+    E,
+    I,
+    g
+  ]);
+  return /* @__PURE__ */ t("div", { className: d.root, children: [
+    /* @__PURE__ */ t("div", { className: K({ "adyen-pe-visually-hidden": c !== "details" }), children: /* @__PURE__ */ t(D, { hideTitle: Y, forwardedToRoot: !q, titleKey: "payByLink.details.title" }) }),
+    /* @__PURE__ */ t("div", { className: d.content, children: j() })
+  ] });
+};
+export {
+  vt as PaymentLinkDetails
+};

package/dist/es/components/external/PaymentLinkDetails/components/PaymentLinkError/PaymentLinkError.js

@@ -0,0 +1,27 @@
+import { jsx as a } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import s from "../../../../../core/Context/useCoreContext.js";
+import { useCallback as m, useMemo as u } from "../../../../../external/preact/hooks/dist/hooks.module.js";
+import { ButtonVariant as l } from "../../../../internal/Button/types.js";
+import { ErrorMessageDisplay as c } from "../../../../internal/ErrorMessageDisplay/ErrorMessageDisplay.js";
+import f from "../../../../internal/Button/Button.js";
+import { getPaymentLinkErrorMessage as p } from "./getPaymentLinkErrorMessage.js";
+const L = ({ error: o, onContactSupport: t, onDismiss: r }) => {
+  const { i18n: e } = s(), n = m(() => /* @__PURE__ */ a(f, { variant: l.SECONDARY, onClick: r, children: e.get("payByLink.common.actions.goBack") }), [e, r]), i = u(
+    () => p(o, "payByLink.details.errors.unavailable", t),
+    [o, t]
+  );
+  return /* @__PURE__ */ a(
+    c,
+    {
+      renderSecondaryButton: r ? n : void 0,
+      withImage: !0,
+      outlined: !1,
+      absolutePosition: !1,
+      withBackground: !1,
+      ...i
+    }
+  );
+};
+export {
+  L as PaymentLinkError
+};

package/dist/es/components/external/PaymentLinkDetails/components/PaymentLinkError/getPaymentLinkErrorMessage.js

@@ -0,0 +1,30 @@
+import { jsx as n } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import { UNDEFINED_ERROR as s } from "../../../../utils/getCommonErrorCode.js";
+import m from "../../../../internal/CopyText/CopyText.js";
+const u = (e, r, o) => {
+  if (!e) return s;
+  switch (e.errorCode) {
+    case void 0:
+      return {
+        title: "common.errors.somethingWentWrong",
+        message: [r, "common.errors.retry"],
+        refreshComponent: !0
+      };
+    case "500": {
+      const t = o ? "common.errors.errorCode" : "common.errors.errorCodeSupport";
+      return {
+        title: "common.errors.somethingWentWrong",
+        message: [r, t],
+        translationValues: {
+          [t]: e.requestId ? /* @__PURE__ */ n(m, { isUnderlineVisible: !0, copyButtonAriaLabelKey: "common.actions.copy.labels.errorCode", textToCopy: e.requestId }) : null
+        },
+        onContactSupport: o
+      };
+    }
+    default:
+      return s;
+  }
+};
+export {
+  u as getPaymentLinkErrorMessage
+};

package/dist/es/components/external/PaymentLinkDetails/components/PaymentLinkExpiration/PaymentLinkExpiration.js

@@ -0,0 +1,60 @@
+import { jsx as o } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import { useCallback as L, useMemo as u } from "../../../../../external/preact/hooks/dist/hooks.module.js";
+import g from "../../../../../core/Context/useCoreContext.js";
+import { TypographyVariant as a, TypographyElement as p } from "../../../../internal/Typography/types.js";
+import s from "../../../../internal/Typography/Typography.js";
+import k from "../../../../internal/Button/ButtonActions/ButtonActions.js";
+import x from "../../../../../hooks/useMutation/useMutation.js";
+import { ButtonVariant as m } from "../../../../internal/Button/types.js";
+import { useModalContext as B } from "../../../../internal/Modal/Modal.js";
+/* empty css                           */
+import { Alert as C } from "../../../../internal/Alert/Alert.js";
+import { AlertTypeOption as T } from "../../../../internal/Alert/types.js";
+import { useConfigContext as E } from "../../../../../core/ConfigContext/context.js";
+import { EMPTY_OBJECT as I } from "../../../../../utils/value/constants.js";
+const h = {
+  root: "adyen-pe-payment-link-expiration"
+}, w = ({ paymentLink: n, onCancel: e, onExpirationSuccess: l }) => {
+  const { i18n: t } = g(), { withinModal: d } = B(), y = d ? p.H2 : p.DIV, { expirePayByLinkPaymentLink: c } = E().endpoints, i = x({
+    queryFn: c,
+    options: {
+      onSuccess: l
+    }
+  }), r = L(
+    () => i.mutate(I, { path: { paymentLinkId: n.linkInformation.paymentLinkId } }),
+    [i, n.linkInformation.paymentLinkId]
+  ), f = u(
+    () => [
+      {
+        title: t.get("payByLink.details.expiration.actions.confirmExpiration"),
+        event: r,
+        variant: m.PRIMARY,
+        disabled: i.isLoading,
+        state: i.isLoading ? "loading" : "default"
+      },
+      {
+        title: t.get("payByLink.details.expiration.actions.goBack"),
+        event: e,
+        variant: m.SECONDARY,
+        disabled: i.isLoading
+      }
+    ],
+    [i.isLoading, r, t, e]
+  );
+  return /* @__PURE__ */ o("div", { className: h.root, children: [
+    /* @__PURE__ */ o(s, { el: y, variant: a.SUBTITLE, stronger: !0, children: t.get("payByLink.details.expiration.title") }),
+    /* @__PURE__ */ o(s, { variant: a.BODY, children: t.get("payByLink.details.expiration.description") }),
+    i.error && /* @__PURE__ */ o(
+      C,
+      {
+        type: T.CRITICAL,
+        title: t.get("payByLink.details.expiration.errorTitle"),
+        description: t.get("payByLink.details.expiration.errorDescription")
+      }
+    ),
+    /* @__PURE__ */ o(k, { actions: f })
+  ] });
+};
+export {
+  w as PaymentLinkExpiration
+};

package/dist/es/components/external/PaymentLinkDetails/components/PaymentLinkSkeleton/PaymentLinkSkeleton.js

@@ -0,0 +1,32 @@
+import { jsx as e } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+/* empty css                         */
+const a = {
+  root: "adyen-pe-payment-link-skeleton",
+  summaryContainer: "adyen-pe-payment-link-skeleton__summary-container",
+  status: "adyen-pe-payment-link-skeleton__status",
+  amount: "adyen-pe-payment-link-skeleton__amount",
+  expirationDate: "adyen-pe-payment-link-skeleton__expiration-date",
+  tabsContainer: "adyen-pe-payment-link-skeleton__tabs-container",
+  tabLabelsContainer: "adyen-pe-payment-link-skeleton__tab-labels-container",
+  tabLabel: "adyen-pe-payment-link-skeleton__tab-label",
+  fieldsContainer: "adyen-pe-payment-link-skeleton__fields-container",
+  fieldContainer: "adyen-pe-payment-link-skeleton__field-container",
+  fieldLabel: "adyen-pe-payment-link-skeleton__field-label",
+  fieldValue: "adyen-pe-payment-link-skeleton__field-value"
+}, s = () => /* @__PURE__ */ e("div", { className: a.root, children: [
+  /* @__PURE__ */ e("div", { className: a.summaryContainer, children: [
+    /* @__PURE__ */ e("div", { className: a.status }),
+    /* @__PURE__ */ e("div", { className: a.amount }),
+    /* @__PURE__ */ e("div", { className: a.expirationDate })
+  ] }),
+  /* @__PURE__ */ e("div", { className: a.tabsContainer, children: [
+    /* @__PURE__ */ e("div", { className: a.tabLabelsContainer, children: [...Array(3)].map((t, n) => /* @__PURE__ */ e("div", { className: a.tabLabel }, n)) }),
+    /* @__PURE__ */ e("div", { className: a.fieldsContainer, children: [...Array(6)].map((t, n) => /* @__PURE__ */ e("div", { className: a.fieldContainer, children: [
+      /* @__PURE__ */ e("div", { className: a.fieldLabel }),
+      /* @__PURE__ */ e("div", { className: a.fieldValue })
+    ] }, n)) })
+  ] })
+] });
+export {
+  s as PaymentLinkSkeleton
+};