@adyen/adyen-platform-experience-web 1.10.2 → 1.11.0

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

@@ -1,16 +1,16 @@
 import { jsx as n } from "../../../../../../../external/.pnpm/preact@10.28.2/node_modules/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import o from "../../../../../../../core/Context/useCoreContext.js";
-import { useMemo as m, useCallback as p } from "../../../../../../../external/.pnpm/preact@10.28.2/node_modules/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";
+import { useMemo as o, useCallback as m } from "../../../../../../../external/.pnpm/preact@10.28.2/node_modules/preact/hooks/dist/hooks.module.js";
+import { FormTextInput as p } from "../../../../../../internal/FormWrappers/FormTextInput.js";
+import { PAYMENT_LINK_CREATION_FIELD_LENGTHS as d } from "../../../../constants.js";
+import u from "../../../../../../../core/Context/preact/useCoreContext.js";
 const x = () => {
-  const { i18n: i } = o(), e = m(
+  const { i18n: i } = u(), e = o(
     () => ({
       valid: !1,
       message: i.get("payByLink.creation.fields.shopperEmail.error.validEmail")
     }),
     [i]
-  ), l = p(
+  ), l = m(
     (r) => {
       r = String(r).toLowerCase().trim();
       const s = r.split("@");
@@ -23,12 +23,12 @@ const x = () => {
     [e]
   );
   return /* @__PURE__ */ n(
-    d,
+    p,
     {
       fieldName: "shopperEmail",
       label: i.get("payByLink.creation.fields.shopperEmail.label"),
       validate: l,
-      maxLength: u.emailAddress.max
+      maxLength: d.emailAddress.max
     }
   );
 };

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

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

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

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

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

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

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

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

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

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