@adyen/adyen-platform-experience-web 1.9.0 → 1.10.1

package/dist/es/components/external/PaymentLinkCreation/components/Form/CustomerDetailsForm/Fields/Address/DeliveryAddressSection.js

@@ -0,0 +1,65 @@
+import { jsx as n } from "../../../../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import f from "../../../../../../../../core/Context/useCoreContext.js";
+import t from "../../../../../../../internal/Typography/Typography.js";
+import { TypographyVariant as r, TypographyElement as p } from "../../../../../../../internal/Typography/types.js";
+import { ShippingStreetField as h } from "./ShippingStreetField.js";
+import { ShippingHouseNumberField as g } from "./ShippingHouseNumberField.js";
+import { ShippingCountryField as d } from "./ShippingCountryField.js";
+import { ShippingCityField as s } from "./ShippingCityField.js";
+import { ShippingPostalCodeField as v } from "./ShippingPostalCodeField.js";
+const x = ({
+  isSameAddress: i,
+  isAddressFieldRequired: o,
+  isOptional: a = !1,
+  countriesData: l,
+  isFetchingCountries: m,
+  countryDatasetData: c,
+  isFetchingCountryDataset: y
+}) => {
+  const { i18n: e } = f();
+  return /* @__PURE__ */ n("div", { className: "adyen-pe-payment-link-creation-form__shipping-address-container", children: [
+    /* @__PURE__ */ n("div", { className: "adyen-pe-payment-link-creation-form__shipping-address-title-container", children: [
+      /* @__PURE__ */ n(
+        t,
+        {
+          el: p.SPAN,
+          variant: r.SUBTITLE,
+          stronger: !0,
+          className: "adyen-pe-payment-link-creation-form__billing-address-title",
+          children: e.get("payByLink.creation.sections.deliveryAddress.label")
+        }
+      ),
+      a && /* @__PURE__ */ n(
+        t,
+        {
+          el: p.SPAN,
+          variant: r.BODY,
+          className: "adyen-pe-payment-link-creation-form__field-label-optional",
+          children: `(${e.get("payByLink.common.fields.optional.label")})`
+        }
+      )
+    ] }),
+    /* @__PURE__ */ n("div", { children: [
+      /* @__PURE__ */ n(h, { isSameAddress: i, isAddressFieldRequired: o }),
+      /* @__PURE__ */ n(g, { isSameAddress: i, isAddressFieldRequired: o })
+    ] }),
+    /* @__PURE__ */ n("div", { children: [
+      /* @__PURE__ */ n(
+        d,
+        {
+          countriesData: l,
+          isAddressFieldRequired: o,
+          isFetchingCountries: m,
+          isSameAddress: i,
+          countryDatasetData: c,
+          isFetchingCountryDataset: y
+        }
+      ),
+      /* @__PURE__ */ n(s, { isAddressFieldRequired: o, isSameAddress: i }),
+      /* @__PURE__ */ n(v, { isAddressFieldRequired: o, isSameAddress: i })
+    ] })
+  ] });
+};
+export {
+  x as DeliveryAddressSection
+};

package/dist/es/components/external/PaymentLinkCreation/components/Form/CustomerDetailsForm/Fields/Address/ShippingCityField.js

@@ -0,0 +1,32 @@
+import { jsx as l } from "../../../../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import a from "../../../../../../../../core/Context/useCoreContext.js";
+import { useWizardFormContext as m } from "../../../../../../../../hooks/form/wizard/WizardFormContext.js";
+import { useCallback as p } from "../../../../../../../../external/preact/hooks/dist/hooks.module.js";
+import { FormTextInput as c } from "../../../../../../../internal/FormWrappers/FormTextInput.js";
+import { PAYMENT_LINK_CREATION_FIELD_LENGTHS as y } from "../../../../../constants.js";
+const v = ({
+  isSameAddress: e,
+  isAddressFieldRequired: r
+}) => {
+  const { i18n: t } = a(), { setValue: i, fieldsConfig: o } = m(), s = p(
+    (n) => {
+      e && i("billingAddress.city", n.currentTarget.value);
+    },
+    [e, i]
+  ), d = o["deliveryAddress.city"]?.required || r("deliveryAddress.city");
+  return /* @__PURE__ */ l(
+    c,
+    {
+      maxLength: y.deliveryAddress.city.max,
+      fieldName: "deliveryAddress.city",
+      label: t.get("payByLink.creation.fields.deliveryAddress.city.label"),
+      onInput: s,
+      className: "adyen-pe-payment-link-creation-form__shipping-address-field--medium",
+      hideOptionalLabel: !0,
+      isRequired: d
+    }
+  );
+};
+export {
+  v as ShippingCityField
+};

package/dist/es/components/external/PaymentLinkCreation/components/Form/CustomerDetailsForm/Fields/Address/ShippingCountryField.js

@@ -0,0 +1,41 @@
+import { jsx as y } from "../../../../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import C from "../../../../../../../../core/Context/useCoreContext.js";
+import { useMemo as g, useCallback as h } from "../../../../../../../../external/preact/hooks/dist/hooks.module.js";
+import { FormSelect as b } from "../../../../../../../internal/FormWrappers/FormSelect.js";
+import { useWizardFormContext as v } from "../../../../../../../../hooks/form/wizard/WizardFormContext.js";
+const z = ({
+  countriesData: o,
+  isAddressFieldRequired: s,
+  isFetchingCountries: d,
+  isSameAddress: n,
+  countryDatasetData: t,
+  isFetchingCountryDataset: a
+}) => {
+  const { i18n: m } = C(), { setValue: l, fieldsConfig: u } = v(), c = g(() => {
+    const r = new Set((o?.data ?? []).map(({ countryCode: e }) => e).filter(Boolean));
+    return (t?.length ? t : o?.data?.map(({ countryCode: e, countryName: i }) => ({ id: e, name: i })) ?? []).filter(({ id: e }) => !r.size || r.has(e)).sort((e, i) => e.name.localeCompare(i.name));
+  }, [o?.data, t]), p = h(
+    (r) => {
+      n && l("billingAddress.country", r.target.value);
+    },
+    [n, l]
+  ), f = u["deliveryAddress.country"]?.required || s("deliveryAddress.country");
+  return /* @__PURE__ */ y(
+    b,
+    {
+      clearable: !0,
+      filterable: !0,
+      fieldName: "deliveryAddress.country",
+      label: m.get("payByLink.creation.fields.deliveryAddress.country.label"),
+      items: c,
+      readonly: d || a,
+      className: "adyen-pe-payment-link-creation-form__shipping-address-field--medium",
+      onChange: p,
+      hideOptionalLabel: !0,
+      isRequired: f
+    }
+  );
+};
+export {
+  z as ShippingCountryField
+};

package/dist/es/components/external/PaymentLinkCreation/components/Form/CustomerDetailsForm/Fields/Address/ShippingHouseNumberField.js

@@ -0,0 +1,32 @@
+import { jsx as d } from "../../../../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import u from "../../../../../../../../core/Context/useCoreContext.js";
+import { useWizardFormContext as l } from "../../../../../../../../hooks/form/wizard/WizardFormContext.js";
+import { useCallback as n } from "../../../../../../../../external/preact/hooks/dist/hooks.module.js";
+import { FormTextInput as N } from "../../../../../../../internal/FormWrappers/FormTextInput.js";
+import { PAYMENT_LINK_CREATION_FIELD_LENGTHS as p } from "../../../../../constants.js";
+const g = ({
+  isSameAddress: e,
+  isAddressFieldRequired: s
+}) => {
+  const { i18n: o } = u(), { setValue: r, fieldsConfig: i } = l(), m = n(
+    (a) => {
+      e && r("billingAddress.houseNumberOrName", a.currentTarget.value);
+    },
+    [e, r]
+  ), t = i["deliveryAddress.houseNumberOrName"]?.required || s("deliveryAddress.houseNumberOrName");
+  return /* @__PURE__ */ d(
+    N,
+    {
+      maxLength: p.deliveryAddress.houseNumberOrName.max,
+      fieldName: "deliveryAddress.houseNumberOrName",
+      label: o.get("payByLink.creation.fields.deliveryAddress.houseNumberOrName.label"),
+      onInput: m,
+      className: "adyen-pe-payment-link-creation-form__shipping-address-field--small",
+      hideOptionalLabel: !0,
+      isRequired: t
+    }
+  );
+};
+export {
+  g as ShippingHouseNumberField
+};

package/dist/es/components/external/PaymentLinkCreation/components/Form/CustomerDetailsForm/Fields/Address/ShippingPostalCodeField.js

@@ -0,0 +1,32 @@
+import { jsx as a } from "../../../../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import n from "../../../../../../../../core/Context/useCoreContext.js";
+import { useWizardFormContext as p } from "../../../../../../../../hooks/form/wizard/WizardFormContext.js";
+import { useCallback as m } from "../../../../../../../../external/preact/hooks/dist/hooks.module.js";
+import { FormTextInput as u } from "../../../../../../../internal/FormWrappers/FormTextInput.js";
+import { PAYMENT_LINK_CREATION_FIELD_LENGTHS as C } from "../../../../../constants.js";
+const v = ({
+  isSameAddress: e,
+  isAddressFieldRequired: r
+}) => {
+  const { i18n: s } = n(), { setValue: o, fieldsConfig: t } = p(), d = m(
+    (l) => {
+      e && o("billingAddress.postalCode", l.currentTarget.value);
+    },
+    [e, o]
+  ), i = t["deliveryAddress.postalCode"]?.required || r("deliveryAddress.postalCode");
+  return /* @__PURE__ */ a(
+    u,
+    {
+      maxLength: C.deliveryAddress.postalCode.max,
+      fieldName: "deliveryAddress.postalCode",
+      label: s.get("payByLink.creation.fields.deliveryAddress.postalCode.label"),
+      onInput: d,
+      className: "adyen-pe-payment-link-creation-form__shipping-address-field--small",
+      hideOptionalLabel: !0,
+      isRequired: i
+    }
+  );
+};
+export {
+  v as ShippingPostalCodeField
+};

package/dist/es/components/external/PaymentLinkCreation/components/Form/CustomerDetailsForm/Fields/Address/ShippingStreetField.js

@@ -0,0 +1,32 @@
+import { jsx as n } from "../../../../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import a from "../../../../../../../../core/Context/useCoreContext.js";
+import { useWizardFormContext as m } from "../../../../../../../../hooks/form/wizard/WizardFormContext.js";
+import { useCallback as p } from "../../../../../../../../external/preact/hooks/dist/hooks.module.js";
+import { FormTextInput as u } from "../../../../../../../internal/FormWrappers/FormTextInput.js";
+import { PAYMENT_LINK_CREATION_FIELD_LENGTHS as f } from "../../../../../constants.js";
+const C = ({
+  isSameAddress: e,
+  isAddressFieldRequired: t
+}) => {
+  const { i18n: s } = a(), { setValue: r, fieldsConfig: i } = m(), o = p(
+    (l) => {
+      e && r("billingAddress.street", l.currentTarget.value);
+    },
+    [e, r]
+  ), d = i["deliveryAddress.street"]?.required || t("deliveryAddress.street");
+  return /* @__PURE__ */ n(
+    u,
+    {
+      maxLength: f.deliveryAddress.street.max,
+      fieldName: "deliveryAddress.street",
+      label: s.get("payByLink.creation.fields.deliveryAddress.street.label"),
+      onInput: o,
+      className: "adyen-pe-payment-link-creation-form__shipping-address-field--large",
+      hideOptionalLabel: !0,
+      isRequired: d
+    }
+  );
+};
+export {
+  C as ShippingStreetField
+};

package/dist/es/components/external/PaymentLinkCreation/components/Form/CustomerDetailsForm/Fields/BillingAndShippingCheckboxField.js

@@ -0,0 +1,27 @@
+import { jsx as r } from "../../../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import y from "../../../../../../../core/Context/useCoreContext.js";
+import { useWizardFormContext as c } from "../../../../../../../hooks/form/wizard/WizardFormContext.js";
+import { useCallback as u } from "../../../../../../../external/preact/hooks/dist/hooks.module.js";
+import A from "../../../../../../internal/Typography/Typography.js";
+import { TypographyVariant as g, TypographyElement as p } from "../../../../../../internal/Typography/types.js";
+import { Icon as t } from "../../../../../../internal/Icon/Icon.js";
+import { uuid as b } from "../../../../../../../utils/random/uuid.js";
+const B = ({
+  isSameAddress: n,
+  setIsSameAddress: s,
+  showBillingFirst: l = !1
+}) => {
+  const { i18n: a } = y(), { setValue: e, getValues: d } = c(), o = b(), m = u(() => {
+    s((i) => (l ? (e("deliveryAddress.street", i ? void 0 : d("billingAddress.street")), e("deliveryAddress.houseNumberOrName", i ? void 0 : d("billingAddress.houseNumberOrName")), e("deliveryAddress.postalCode", i ? void 0 : d("billingAddress.postalCode")), e("deliveryAddress.city", i ? void 0 : d("billingAddress.city")), e("deliveryAddress.country", i ? void 0 : d("billingAddress.country"))) : (e("billingAddress.street", i ? void 0 : d("deliveryAddress.street")), e("billingAddress.houseNumberOrName", i ? void 0 : d("deliveryAddress.houseNumberOrName")), e("billingAddress.postalCode", i ? void 0 : d("deliveryAddress.postalCode")), e("billingAddress.city", i ? void 0 : d("deliveryAddress.city")), e("billingAddress.country", i ? void 0 : d("deliveryAddress.country"))), !i));
+  }, [d, s, e, l]);
+  return /* @__PURE__ */ r("div", { children: [
+    /* @__PURE__ */ r("input", { type: "checkbox", className: "adyen-pe-visually-hidden", id: o, onInput: m }),
+    /* @__PURE__ */ r("label", { className: "adyen-pe-payment-link-creation-form__field-checkbox", htmlFor: o, children: [
+      n ? /* @__PURE__ */ r(t, { name: "checkmark-square-fill" }) : /* @__PURE__ */ r(t, { name: "square" }),
+      /* @__PURE__ */ r(A, { el: p.SPAN, variant: g.BODY, children: a.get("payByLink.creation.fields.shippingAndBillingSameAddress.label") })
+    ] })
+  ] });
+};
+export {
+  B as BillingAndShippingCheckboxField
+};

package/dist/es/components/external/PaymentLinkCreation/components/Form/CustomerDetailsForm/Fields/CountryRegionField.js

@@ -0,0 +1,25 @@
+import { jsx as d } from "../../../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import c from "../../../../../../../core/Context/useCoreContext.js";
+import { useMemo as u } from "../../../../../../../external/preact/hooks/dist/hooks.module.js";
+import { FormSelect as f } from "../../../../../../internal/FormWrappers/FormSelect.js";
+import { useWizardFormContext as p } from "../../../../../../../hooks/form/wizard/WizardFormContext.js";
+const h = ({ countriesData: o, isFetchingCountries: l, countryDatasetData: r, isFetchingCountryDataset: s }) => {
+  const { i18n: m } = c(), { fieldsConfig: n } = p(), a = u(() => {
+    const i = new Set(n?.countryCode?.options ?? o?.data?.map(({ countryCode: e }) => e) ?? []);
+    return (r?.length ? r : o?.data?.map(({ countryCode: e, countryName: t }) => ({ id: e, name: t })) ?? []).filter(({ id: e }) => !i.size || i.has(e)).sort((e, t) => e.name.localeCompare(t.name));
+  }, [o?.data, r, n]);
+  return /* @__PURE__ */ d(
+    f,
+    {
+      clearable: !0,
+      filterable: !0,
+      fieldName: "countryCode",
+      label: m.get("payByLink.creation.fields.country.label"),
+      items: a,
+      readonly: l || s
+    }
+  );
+};
+export {
+  h as CountryRegionField
+};

package/dist/es/components/external/PaymentLinkCreation/components/Form/CustomerDetailsForm/Fields/LanguageField.js

@@ -0,0 +1,36 @@
+import { jsx as m } from "../../../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import d from "../../../../../../../core/Context/useCoreContext.js";
+import { useMemo as o, useCallback as g } from "../../../../../../../external/preact/hooks/dist/hooks.module.js";
+import { useFetch as p } from "../../../../../../../hooks/useFetch.js";
+import { FormSelect as f } from "../../../../../../internal/FormWrappers/FormSelect.js";
+import { useWizardFormContext as h } from "../../../../../../../hooks/form/wizard/WizardFormContext.js";
+const k = () => {
+  const { i18n: c, getCdnDataset: s } = d(), { fieldsConfig: n } = h(), a = o(() => n?.shopperLocale?.options, [n]), e = p({
+    fetchOptions: { enabled: !0 },
+    queryFn: g(async () => s ? await s({
+      name: "languages",
+      extension: "json",
+      fallback: []
+    }) ?? [] : [], [s])
+  }), i = o(() => (e.data ?? []).filter(({ value: t }) => a?.length ? a?.includes(t) : !0).map(({ text: t, value: r }) => ({
+    // TODO - Handle 'auto detect' option when submitting information to the BE
+    id: r === null ? "auto" : r,
+    name: t
+  })).sort(({ name: t }, { name: r }) => t.localeCompare(r)), [e.data, a]), l = o(() => n.shopperLocale?.required, [n]);
+  return o(() => {
+    const u = i.length > 0;
+    return !e.isFetching && !u && !l;
+  }, [e.isFetching, i.length, l]) ? null : /* @__PURE__ */ m(
+    f,
+    {
+      filterable: !0,
+      fieldName: "shopperLocale",
+      label: c.get("payByLink.creation.fields.language.label"),
+      items: i,
+      readonly: e.isFetching
+    }
+  );
+};
+export {
+  k as LanguageField
+};

package/dist/es/components/external/PaymentLinkCreation/components/Form/CustomerDetailsForm/Fields/ShopperEmailField.js

@@ -0,0 +1,37 @@
+import { jsx as n } from "../../../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import o from "../../../../../../../core/Context/useCoreContext.js";
+import { useMemo as m, useCallback as p } from "../../../../../../../external/preact/hooks/dist/hooks.module.js";
+import { FormTextInput as d } from "../../../../../../internal/FormWrappers/FormTextInput.js";
+import { PAYMENT_LINK_CREATION_FIELD_LENGTHS as u } from "../../../../constants.js";
+const x = () => {
+  const { i18n: i } = o(), e = m(
+    () => ({
+      valid: !1,
+      message: i.get("payByLink.creation.fields.shopperEmail.error.validEmail")
+    }),
+    [i]
+  ), l = p(
+    (r) => {
+      r = String(r).toLowerCase().trim();
+      const s = r.split("@");
+      if (s.length !== 2)
+        return e;
+      const [a, t] = s;
+      return !a || !t || a.length === 0 || a.startsWith(".") || a.endsWith(".") || a.includes("..") || t.length === 0 || t.startsWith(".") || t.endsWith(".") || t.includes("..") || !t.includes(".") || !// eslint-disable-next-line max-len
+      /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/.test(r) ? e : { valid: !0 };
+    },
+    [e]
+  );
+  return /* @__PURE__ */ n(
+    d,
+    {
+      fieldName: "shopperEmail",
+      label: i.get("payByLink.creation.fields.shopperEmail.label"),
+      validate: l,
+      maxLength: u.emailAddress.max
+    }
+  );
+};
+export {
+  x as ShopperEmailField
+};

package/dist/es/components/external/PaymentLinkCreation/components/Form/CustomerDetailsForm/Fields/ShopperPhoneField.js

@@ -0,0 +1,95 @@
+import { jsx as f } from "../../../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import { useMemo as u, useEffect as $, useCallback as v } from "../../../../../../../external/preact/hooks/dist/hooks.module.js";
+import { useWizardFormContext as P } from "../../../../../../../hooks/form/wizard/WizardFormContext.js";
+import { useFetch as q } from "../../../../../../../hooks/useFetch.js";
+import { VisibleField as I } from "../../../../../../internal/FormWrappers/VisibleField.js";
+import k from "../../../../../../internal/FormFields/InputBase.js";
+import w from "../../../../../../internal/FormWrappers/FormField.js";
+import T from "../../../../../../../core/Context/useCoreContext.js";
+import { PAYMENT_LINK_CREATION_FIELD_LENGTHS as j } from "../../../../constants.js";
+import { filterDisallowedCharacters as B } from "../../../../../../internal/FormFields/utils.js";
+import { Controller as E } from "../../../../../../../hooks/form/Controller.js";
+const Y = () => {
+  const { i18n: d, getCdnDataset: N } = T(), { control: D, fieldsConfig: g, getValues: y, setValue: h, setFieldDisplayValue: c, getDisplayValue: F, trigger: C, formState: b } = P(), s = u(() => F("telephoneNumber"), [F]), t = u(() => y("telephoneNumber"), [y]), [n, a] = u(() => {
+    if (s) {
+      const [r, ...e] = s.split(" ");
+      return [r, e.join(" ")];
+    }
+    if (t) {
+      const [r, ...e] = t.split(" ");
+      return [r, e.join(" ")];
+    }
+    return [void 0, void 0];
+  }, [s, t]);
+  $(() => {
+    if (!s && t) {
+      const [r, ...e] = t.split(" "), o = e.join(" ");
+      h("telephoneNumber", `${r}${o}`), c("telephoneNumber", `${r} ${o}`);
+    }
+  }, [s, t, h, c]);
+  const i = q({
+    fetchOptions: { enabled: !0 },
+    queryFn: v(async () => N ? await N({
+      name: "phonenumbers",
+      extension: "json",
+      fallback: []
+    }) ?? [] : [], [N])
+  }), V = u(() => (i.data ?? []).map(({ id: e, prefix: o }) => ({ id: o, name: `${e} (${o})` })).sort(({ name: e }, { name: o }) => e.localeCompare(o)), [i.data]);
+  $(() => {
+    n && b.touchedFields.telephoneNumber && b.errors.telephoneNumber && C("telephoneNumber");
+  }, [n, a, C, b.errors, b.touchedFields]);
+  const p = u(() => g.telephoneNumber?.required, [g]), x = u(() => {
+    const r = (i.data?.length ?? 0) > 0, e = !!s || !!t;
+    return !i.isFetching && !r && !p && !e;
+  }, [i.data?.length, i.isFetching, p, s, t]), L = v(() => !p && !n && !a ? { valid: !0 } : n ? a ? { valid: !0 } : { valid: !1, message: d.get("payByLink.creation.fields.phoneNumber.errors.requiredPhoneNumber") } : { valid: !1, message: d.get("payByLink.creation.fields.phoneNumber.errors.requiredPhoneCode") }, [n, a]);
+  return x ? null : /* @__PURE__ */ f(I, { name: "telephoneNumber", children: /* @__PURE__ */ f(w, { label: d.get("payByLink.creation.fields.shopperPhone.label"), optional: !p, children: /* @__PURE__ */ f(
+    E,
+    {
+      name: "telephoneNumber",
+      control: D,
+      rules: {
+        required: p,
+        validate: L
+      },
+      render: ({ field: r, fieldState: e }) => {
+        const o = !!e.error && e.isTouched;
+        return /* @__PURE__ */ f(
+          k,
+          {
+            ...r,
+            onKeyDown: (l) => {
+              B({
+                event: l,
+                inputType: "number"
+              });
+            },
+            onInput: (l) => {
+              const m = l.target.value;
+              h("telephoneNumber", `${n ?? ""}${m}`), c("telephoneNumber", `${n ?? ""} ${m}`);
+            },
+            value: a,
+            type: "text",
+            dropdown: {
+              filterable: !0,
+              items: V,
+              value: n,
+              placeholder: d.get("payByLink.creation.fields.shopperPhone.phonePrefix.placeholder"),
+              readonly: i.isFetching
+            },
+            onDropdownInput: (l) => {
+              const m = a || "";
+              h("telephoneNumber", `${l}${m}`), c("telephoneNumber", `${l} ${m}`);
+            },
+            isValid: !e.error && !!r.value,
+            isInvalid: o,
+            errorMessage: e.error?.message,
+            maxLength: j.telephoneNumber.max
+          }
+        );
+      }
+    }
+  ) }) });
+};
+export {
+  Y as ShopperPhoneField
+};

package/dist/es/components/external/PaymentLinkCreation/components/Form/CustomerDetailsForm/useAddressChecker.js

@@ -0,0 +1,43 @@
+import { useCallback as N } from "../../../../../../external/preact/hooks/dist/hooks.module.js";
+import { useWizardFormContext as p } from "../../../../../../hooks/form/wizard/WizardFormContext.js";
+import { useWatch as s } from "../../../../../../hooks/form/useWatch.js";
+const o = [
+  "deliveryAddress.street",
+  "deliveryAddress.houseNumberOrName",
+  "deliveryAddress.country",
+  "deliveryAddress.city",
+  "deliveryAddress.postalCode"
+], n = [
+  "billingAddress.street",
+  "billingAddress.houseNumberOrName",
+  "billingAddress.country",
+  "billingAddress.city",
+  "billingAddress.postalCode"
+], f = () => {
+  const { control: e } = p(), u = s(e, "deliveryAddress.street"), c = s(e, "deliveryAddress.houseNumberOrName"), y = s(e, "deliveryAddress.country"), A = s(e, "deliveryAddress.city"), b = s(e, "deliveryAddress.postalCode"), v = s(e, "billingAddress.street"), a = s(e, "billingAddress.houseNumberOrName"), g = s(e, "billingAddress.country"), m = s(e, "billingAddress.city"), C = s(e, "billingAddress.postalCode"), i = {
+    "deliveryAddress.street": u,
+    "deliveryAddress.houseNumberOrName": c,
+    "deliveryAddress.country": y,
+    "deliveryAddress.city": A,
+    "deliveryAddress.postalCode": b
+  }, l = {
+    "billingAddress.street": v,
+    "billingAddress.houseNumberOrName": a,
+    "billingAddress.country": g,
+    "billingAddress.city": m,
+    "billingAddress.postalCode": C
+  };
+  return { isAddressFieldRequired: N(
+    (t) => o.includes(t) ? o.some((d) => {
+      const r = i[d];
+      return r !== void 0 && r !== "";
+    }) : n.includes(t) ? n.some((d) => {
+      const r = l[d];
+      return r !== void 0 && r !== "";
+    }) : !1,
+    [i, l]
+  ) };
+};
+export {
+  f as useAddressChecker
+};

package/dist/es/components/external/PaymentLinkCreation/components/Form/FormSuccess/FormSuccess.js

@@ -0,0 +1,47 @@
+import { jsx as e } from "../../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import y from "classnames";
+import f from "../../../../../../core/Context/useCoreContext.js";
+import i from "../../../../../internal/Typography/Typography.js";
+import { TypographyVariant as o } from "../../../../../internal/Typography/types.js";
+import { Icon as s } from "../../../../../internal/Icon/Icon.js";
+import m from "../../../../../internal/Button/Button.js";
+import { ButtonVariant as p } from "../../../../../internal/Button/types.js";
+/* empty css                 */
+import { useState as d, useRef as k, useEffect as h, useCallback as _ } from "../../../../../../external/preact/hooks/dist/hooks.module.js";
+const A = ({ onGoToDetails: l, paymentLinkUrl: n }) => {
+  const { i18n: t } = f(), [r, a] = d(!1), c = k(null);
+  h(() => () => {
+    c.current && clearTimeout(c.current);
+  }, []);
+  const u = _(async () => {
+    if (n)
+      try {
+        await navigator.clipboard.writeText(n), a(!0), c.current && clearTimeout(c.current), c.current = setTimeout(() => {
+          a(!1), c.current = null;
+        }, 3e3);
+      } catch {
+      }
+  }, [n]);
+  return /* @__PURE__ */ e("section", { className: y("adyen-pe-payment-link-creation-form-success"), children: [
+    /* @__PURE__ */ e("div", { className: "adyen-pe-payment-link-creation-form-success__content", children: [
+      /* @__PURE__ */ e(s, { name: "checkmark-circle-fill", className: "adyen-pe-payment-link-creation-form-success__icon" }),
+      /* @__PURE__ */ e(i, { variant: o.TITLE, className: "adyen-pe-payment-link-creation-form-success__title", children: t.get("payByLink.creation.success.title") }),
+      /* @__PURE__ */ e(i, { variant: o.BODY, className: "adyen-pe-payment-link-creation-form-success__description", children: t.get("payByLink.creation.success.description") })
+    ] }),
+    /* @__PURE__ */ e("div", { className: "adyen-pe-payment-link-creation-form-success__actions", children: [
+      /* @__PURE__ */ e(m, { variant: p.SECONDARY, onClick: l, children: t.get("payByLink.creation.success.showDetails") }),
+      /* @__PURE__ */ e(
+        m,
+        {
+          variant: p.PRIMARY,
+          onClick: u,
+          iconLeft: /* @__PURE__ */ e(s, { className: "adyen-pe-payment-link-creation-form-success__button-icon", name: r ? "checkmark" : "copy" }),
+          children: r ? t.get("payByLink.creation.success.copiedToClipboard") : t.get("payByLink.creation.success.copyLink")
+        }
+      )
+    ] })
+  ] });
+};
+export {
+  A as FormSuccess
+};

package/dist/es/components/external/PaymentLinkCreation/components/Form/PaymentDetailsForm/Fields/AmountField.js

@@ -0,0 +1,58 @@
+import { jsx as t } from "../../../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import h from "../../../../../../../core/Context/useCoreContext.js";
+import { useMemo as c, useCallback as g, useEffect as N } from "../../../../../../../external/preact/hooks/dist/hooks.module.js";
+import { useWizardFormContext as E } from "../../../../../../../hooks/form/wizard/WizardFormContext.js";
+import { CurrencyInput as V } from "../../../../../../internal/FormFields/CurrencyInput/CurrencyInput.js";
+import { VisibleField as A } from "../../../../../../internal/FormWrappers/VisibleField.js";
+import x from "../../../../../../internal/FormWrappers/FormField.js";
+import { FieldError as I } from "../../../../../../internal/FormFields/FieldError/FieldError.js";
+import { Controller as L } from "../../../../../../../hooks/form/Controller.js";
+import { Fragment as M } from "../../../../../../../external/preact/dist/preact.module.js";
+const m = "amount.value", o = "amount.currency", k = 1e13, W = () => {
+  const { i18n: s } = h(), { control: C, setValue: u, getValues: i, fieldsConfig: n, trigger: d } = E(), f = c(() => n?.[o]?.visible ?? !1, [n]), y = g(
+    (e) => Number(e) < 0 ? { valid: !1, message: s.get("payByLink.creation.fields.amountValue.error.negativeNumber") } : f && !i(o) ? { valid: !1, message: s.get("payByLink.creation.fields.amountValue.error.currency") } : !e || Number(e) === 0 ? { valid: !1, message: s.get("common.errors.fieldRequired") } : { valid: !0 },
+    [s, i, f]
+  ), v = g(
+    (e, r) => {
+      u(o, e), r && d(m);
+    },
+    [u, d, i]
+  ), b = c(() => n?.amount?.required, [n]), a = c(() => n?.[o]?.options?.map((r) => ({ id: r, name: r })), [n]);
+  return N(() => {
+    a?.length === 1 && u(o, a[0]?.id);
+  }, [a]), /* @__PURE__ */ t(A, { name: m, children: /* @__PURE__ */ t(x, { label: s.get("payByLink.creation.fields.amount.label"), optional: !1, supportText: void 0, className: void 0, children: /* @__PURE__ */ t(
+    L,
+    {
+      name: m,
+      control: C,
+      rules: {
+        validate: y,
+        required: b
+      },
+      render: ({ field: e, fieldState: r }) => {
+        const l = !!r.error && r.isTouched, p = r.error?.message;
+        return /* @__PURE__ */ t(M, { children: [
+          /* @__PURE__ */ t(
+            V,
+            {
+              ...e,
+              selectedCurrencyCode: i(o),
+              onCurrencyChange: (F) => v(F, l),
+              currency: i(o),
+              currencyItems: a,
+              isInvalid: l,
+              name: m,
+              amount: e.value ? Number(e.value) : void 0,
+              onAmountChange: e.onInput,
+              maxValue: k
+            }
+          ),
+          l && p && /* @__PURE__ */ t(I, { errorMessage: p })
+        ] });
+      }
+    }
+  ) }) });
+};
+export {
+  W as AmountField
+};

package/dist/es/components/external/PaymentLinkCreation/components/Form/PaymentDetailsForm/Fields/LinkTypeField.js

@@ -0,0 +1,24 @@
+import { jsx as s } from "../../../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import p from "../../../../../../../core/Context/useCoreContext.js";
+import { useMemo as r } from "../../../../../../../external/preact/hooks/dist/hooks.module.js";
+import { FormSelect as l } from "../../../../../../internal/FormWrappers/FormSelect.js";
+const m = ["open", "singleUse"], L = ({ configuration: e }) => {
+  const { i18n: o } = p(), t = r(() => (e?.linkType?.options?.length ? e?.linkType?.options : m).map((n) => {
+    const i = `payByLink.creation.form.linkTypes.${n}`;
+    return {
+      id: n,
+      name: o.get(i)
+    };
+  }), [e, o]);
+  return /* @__PURE__ */ s(
+    l,
+    {
+      fieldName: "linkType",
+      label: o.get("payByLink.creation.fields.linkType.label"),
+      items: t
+    }
+  );
+};
+export {
+  L as LinkTypeField
+};