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

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

@@ -1,70 +1,70 @@
 import { jsx as r } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import { useMemo as d, useState as s, useCallback as f } from "../../../../../external/preact/hooks/dist/hooks.module.js";
+import { useMemo as d, useState as s, useCallback as n } from "../../../../../external/preact/hooks/dist/hooks.module.js";
 import { isCapitalRegionSupported as N } from "../../../../internal/CapitalHeader/helpers.js";
 import { CapitalErrorMessageDisplay as T } from "../utils/CapitalErrorMessageDisplay.js";
-import { CAPITAL_OFFER_CLASS_NAMES as g } from "./constants.js";
+import { CAPITAL_OFFER_CLASS_NAMES as C } from "./constants.js";
 import { CapitalOfferSelection as k } from "../CapitalOfferSelection/CapitalOfferSelection.js";
 import { useFetch as B } from "../../../../../hooks/useFetch.js";
 import { CapitalOfferSummary as H } from "../CapitalOfferSummary/CapitalOfferSummary.js";
 /* empty css                  */
-import { CapitalHeader as C } from "../../../../internal/CapitalHeader/CapitalHeader.js";
+import { CapitalHeader as g } from "../../../../internal/CapitalHeader/CapitalHeader.js";
 import { useConfigContext as E } from "../../../../../core/ConfigContext/context.js";
 import { EMPTY_OBJECT as K } from "../../../../../utils/value/constants.js";
 const V = ({
   externalDynamicOffersConfig: a,
   hideTitle: m,
-  onContactSupport: c,
+  onContactSupport: l,
   onFundsRequest: A,
-  onOfferDismiss: F,
-  onOfferSelect: i
+  onOfferDismiss: v,
+  onOfferSelect: o
 }) => {
-  var S, y;
-  const { getDynamicGrantOffersConfiguration: t } = E().endpoints, l = (y = (S = E()) == null ? void 0 : S.extraConfig) == null ? void 0 : y.legalEntity, p = d(() => N(l), [l]), [b, u] = s(!1), v = f((e) => {
+  var y, S;
+  const { getDynamicGrantOffersConfiguration: t } = E().endpoints, c = (S = (y = E()) == null ? void 0 : y.extraConfig) == null ? void 0 : S.legalEntity, p = d(() => N(c), [c]), [R, u] = s(!1), h = n((e) => {
     u(!e);
-  }, []), { data: R, error: h } = B({
+  }, []), { data: q, error: F } = B({
     fetchOptions: {
       enabled: !a && !!t && p,
-      onSuccess: v
+      onSuccess: h
     },
-    queryFn: f(async () => t == null ? void 0 : t(K), [t])
-  }), q = a || R, [n, O] = s(), [M, _] = s(), x = f(
+    queryFn: n(async () => t == null ? void 0 : t(K), [t])
+  }), M = a || q, [f, O] = s(), [_, b] = s(), x = n(
     (e) => {
-      i ? i(e) : (_(e == null ? void 0 : e.grantAmount.value), O(e));
+      o ? o(e) : (b(e == null ? void 0 : e.grantAmount.value), O(e));
     },
-    [i]
-  ), o = d(() => n ? "OfferSummary" : "OfferSelection", [n]);
-  return p ? /* @__PURE__ */ r("div", { className: g.base, children: [
+    [o]
+  ), i = d(() => f ? "OfferSummary" : "OfferSelection", [f]);
+  return p ? /* @__PURE__ */ r("div", { className: C.base, children: [
     /* @__PURE__ */ r(
-      C,
+      g,
       {
         hasDivider: !0,
         hideTitle: m,
-        titleKey: o === "OfferSummary" ? "capital.businessFinancingSummary" : "capital.businessFinancingOffer"
+        titleKey: i === "OfferSummary" ? "capital.offer.summary.title" : "capital.offer.selection.title"
       }
     ),
-    o === "OfferSelection" && /* @__PURE__ */ r(
+    i === "OfferSelection" && /* @__PURE__ */ r(
       k,
       {
-        requestedAmount: M,
-        dynamicOffersConfig: q,
-        dynamicOffersConfigError: h,
-        onOfferDismiss: F,
+        requestedAmount: _,
+        dynamicOffersConfig: M,
+        dynamicOffersConfigError: F,
+        onOfferDismiss: v,
         onOfferSelect: x,
-        emptyGrantOffer: b,
-        onContactSupport: c
+        emptyGrantOffer: R,
+        onContactSupport: l
       }
     ),
-    o === "OfferSummary" && /* @__PURE__ */ r(
+    i === "OfferSummary" && /* @__PURE__ */ r(
       H,
       {
-        grantOffer: n,
+        grantOffer: f,
         onBack: () => O(void 0),
         onFundsRequest: A,
-        onContactSupport: c
+        onContactSupport: l
       }
     )
-  ] }) : /* @__PURE__ */ r("div", { className: g.errorContainer, children: [
-    /* @__PURE__ */ r(C, { hideTitle: m, titleKey: "capital.businessFinancing" }),
+  ] }) : /* @__PURE__ */ r("div", { className: C.errorContainer, children: [
+    /* @__PURE__ */ r(g, { hideTitle: m, titleKey: "capital.common.title" }),
     /* @__PURE__ */ r(T, { unsupportedRegion: !0 })
   ] });
 };

package/dist/es/components/external/CapitalOffer/components/CapitalOfferLegalNotice/CapitalOfferLegalNotice.js

@@ -5,28 +5,28 @@ import { SupportedLocation as p } from "../../../../internal/CapitalHeader/const
 import c from "../../../../internal/Card/Card.js";
 import { TypographyVariant as e } from "../../../../internal/Typography/types.js";
 import i from "../../../../internal/Typography/Typography.js";
-import { SUMMARY_TEXT_EMAIL as n } from "../CapitalOfferSummary/constants.js";
+import { SUMMARY_TEXT_EMAIL as l } from "../CapitalOfferSummary/constants.js";
 /* empty css                             */
-import { Translation as l } from "../../../../internal/Translation/Translation.js";
+import { Translation as n } from "../../../../internal/Translation/Translation.js";
 import { Fragment as s } from "../../../../../external/preact/dist/preact.module.js";
-import { useConfigContext as d } from "../../../../../core/ConfigContext/context.js";
-const I = () => {
-  var o, t, a;
-  return ((a = (t = (o = d()) == null ? void 0 : o.extraConfig) == null ? void 0 : t.legalEntity) == null ? void 0 : a.countryCode) === p.US ? /* @__PURE__ */ r(c, { filled: !0, noOutline: !0, children: [
-    /* @__PURE__ */ r(i, { variant: e.CAPTION, className: "adyen-pe-capital-offer-legal-notice--title", children: /* @__PURE__ */ r(l, { translationKey: "capital.offerLegalNoticeTitleUS", fills: { break: /* @__PURE__ */ r("br", {}) } }) }),
+import { useConfigContext as u } from "../../../../../core/ConfigContext/context.js";
+const O = () => {
+  var t, o, a;
+  return ((a = (o = (t = u()) == null ? void 0 : t.extraConfig) == null ? void 0 : o.legalEntity) == null ? void 0 : a.countryCode) === p.US ? /* @__PURE__ */ r(c, { filled: !0, noOutline: !0, children: [
+    /* @__PURE__ */ r(i, { variant: e.CAPTION, className: "adyen-pe-capital-offer-legal-notice--title", children: /* @__PURE__ */ r(n, { translationKey: "capital.offer.summary.legalNotice.US.title", fills: { break: /* @__PURE__ */ r("br", {}) } }) }),
     /* @__PURE__ */ r("br", {}),
     /* @__PURE__ */ r(i, { variant: e.CAPTION, className: "adyen-pe-capital-offer-legal-notice--description", children: /* @__PURE__ */ r(
-      l,
+      n,
       {
-        translationKey: "capital.offerLegalNoticeDescriptionUS",
+        translationKey: "capital.offer.summary.legalNotice.US.note",
         fills: {
           email: /* @__PURE__ */ r(
             m,
             {
-              href: `mailto:${n}`,
+              href: `mailto:${l}`,
               variant: f.TERTIARY,
               className: "adyen-pe-capital-offer-summary__info--email",
-              children: n
+              children: l
             }
           ),
           break: /* @__PURE__ */ r(s, { children: [
@@ -39,5 +39,5 @@ const I = () => {
   ] }) : null;
 };
 export {
-  I as CapitalOfferLegalNotice
+  O as CapitalOfferLegalNotice
 };

package/dist/es/components/external/CapitalOffer/components/CapitalOfferSelection/CapitalOfferSelection.js

@@ -1,51 +1,51 @@
 import { jsx as t } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import R from "../../../../internal/Typography/Typography.js";
-import { TypographyVariant as N, TypographyElement as P } from "../../../../internal/Typography/types.js";
-import T from "../../../../internal/Button/Button.js";
-import { ButtonVariant as k } from "../../../../internal/Button/types.js";
+import g from "../../../../internal/Typography/Typography.js";
+import { TypographyVariant as N, TypographyElement as S } from "../../../../internal/Typography/types.js";
+import k from "../../../../internal/Button/Button.js";
+import { ButtonVariant as b } from "../../../../internal/Button/types.js";
 import E from "../../../../../core/Context/useCoreContext.js";
-import { useMemo as p, useState as D, useCallback as c, useEffect as q } from "../../../../../external/preact/hooks/dist/hooks.module.js";
+import { useMemo as p, useState as D, useCallback as u, useEffect as q } from "../../../../../external/preact/hooks/dist/hooks.module.js";
 import "../../../../../external/preact/compat/dist/compat.module.js";
-import b from "../../../../../hooks/useMutation/useMutation.js";
+import T from "../../../../../hooks/useMutation/useMutation.js";
 /* empty css                           */
-import { debounce as w, getExpectedRepaymentDate as j, getPercentage as G } from "../utils/utils.js";
-import { CapitalErrorMessageDisplay as X } from "../utils/CapitalErrorMessageDisplay.js";
-import { calculateSliderAdjustedMidValue as H } from "../../../../internal/Slider/Slider.js";
-import { CAPITAL_REPAYMENT_FREQUENCY as Q } from "../../../../constants.js";
-import { Fragment as U } from "../../../../../external/preact/dist/preact.module.js";
-import W from "../../../../internal/CapitalSlider/CapitalSlider.js";
-import $ from "../../../../internal/InfoBox/InfoBox.js";
-import z from "../../../../internal/StructuredList/StructuredList.js";
-import { useConfigContext as J } from "../../../../../core/ConfigContext/context.js";
-const K = () => /* @__PURE__ */ t("div", { className: "adyen-pe-capital-offer-selection__loading-container", children: [...Array(4)].map((e, r) => /* @__PURE__ */ t("div", { className: "adyen-pe-capital-offer-selection__loading-skeleton" }, r)) }), Z = ({ data: e }) => {
-  const { i18n: r } = E(), u = p(() => {
+import { debounce as F, getExpectedRepaymentDate as j, getPercentage as G } from "../utils/utils.js";
+import { CapitalErrorMessageDisplay as H } from "../utils/CapitalErrorMessageDisplay.js";
+import { calculateSliderAdjustedMidValue as Q } from "../../../../internal/Slider/Slider.js";
+import { CAPITAL_REPAYMENT_FREQUENCY as U } from "../../../../constants.js";
+import { Fragment as $ } from "../../../../../external/preact/dist/preact.module.js";
+import z from "../../../../internal/CapitalSlider/CapitalSlider.js";
+import J from "../../../../internal/InfoBox/InfoBox.js";
+import K from "../../../../internal/StructuredList/StructuredList.js";
+import { useConfigContext as W } from "../../../../../core/ConfigContext/context.js";
+const X = () => /* @__PURE__ */ t("div", { className: "adyen-pe-capital-offer-selection__loading-container", children: [...Array(4)].map((e, r) => /* @__PURE__ */ t("div", { className: "adyen-pe-capital-offer-selection__loading-skeleton" }, r)) }), Z = ({ data: e }) => {
+  const { i18n: r } = E(), c = p(() => {
     const n = e.expectedRepaymentPeriodDays && j(e.expectedRepaymentPeriodDays);
     return n ? r.date(n, { month: "long" }) : null;
   }, [e, r]);
   return /* @__PURE__ */ t("div", { className: "adyen-pe-capital-offer-selection__information", children: [
-    /* @__PURE__ */ t(R, { el: P.SPAN, variant: N.BODY, wide: !0, children: u && r.get("capital.youWillNeedToRepayAMinimumOfXEveryXDaysToPayOffTheFunds", {
+    /* @__PURE__ */ t(g, { el: S.SPAN, variant: N.BODY, wide: !0, children: c && r.get("capital.offer.common.repaymentInfo", {
       values: {
         amount: r.amount(e.thresholdAmount.value, e.thresholdAmount.currency),
-        days: Q,
-        date: u
+        days: U,
+        date: c
       }
     }) }),
     /* @__PURE__ */ t(
-      z,
+      K,
       {
-        renderValue: (n) => /* @__PURE__ */ t(R, { el: P.SPAN, stronger: !0, variant: N.CAPTION, children: n }),
-        renderLabel: (n) => /* @__PURE__ */ t(R, { el: P.SPAN, variant: N.CAPTION, children: n }),
+        renderValue: (n) => /* @__PURE__ */ t(g, { el: S.SPAN, stronger: !0, variant: N.CAPTION, children: n }),
+        renderLabel: (n) => /* @__PURE__ */ t(g, { el: S.SPAN, variant: N.CAPTION, children: n }),
         items: [
-          { key: "capital.fees", value: r.amount(e.feesAmount.value, e.feesAmount.currency) },
+          { key: "capital.common.fields.fees", value: r.amount(e.feesAmount.value, e.feesAmount.currency) },
           {
-            key: "capital.dailyRepaymentRate",
-            value: `${r.get("capital.xPercent", {
+            key: "capital.common.fields.dailyRepaymentRate",
+            value: `${r.get("capital.common.values.percentage", {
               values: { percentage: G(e.repaymentRate) }
             })}`
           },
           {
-            key: "capital.expectedRepaymentPeriod",
-            value: r.get("capital.xDays", { values: { days: e.expectedRepaymentPeriodDays } })
+            key: "capital.common.fields.expectedRepaymentPeriod",
+            value: r.get("capital.common.values.numberOfDays", { values: { days: e.expectedRepaymentPeriodDays } })
           }
         ]
       }
@@ -54,34 +54,34 @@ const K = () => /* @__PURE__ */ t("div", { className: "adyen-pe-capital-offer-se
 }, he = ({
   dynamicOffersConfig: e,
   dynamicOffersConfigError: r,
-  emptyGrantOffer: u,
+  emptyGrantOffer: c,
   onContactSupport: n,
-  onOfferDismiss: d,
-  onOfferSelect: M,
-  requestedAmount: m
+  onOfferDismiss: m,
+  onOfferSelect: I,
+  requestedAmount: d
 }) => {
-  const { i18n: x } = E(), v = p(() => {
+  const { i18n: v } = E(), y = p(() => {
     if (e)
-      return H(
+      return Q(
         e.minAmount.value,
         e.maxAmount.value,
         e.step
       );
-  }, [e]), [i, S] = D(void 0), s = p(() => e == null ? void 0 : e.minAmount.currency, [e == null ? void 0 : e.minAmount.currency]), { createGrantOffer: V, getDynamicGrantOffer: I } = J().endpoints, a = b({
-    queryFn: I,
+  }, [e]), [i, P] = D(void 0), s = p(() => e == null ? void 0 : e.minAmount.currency, [e == null ? void 0 : e.minAmount.currency]), { createGrantOffer: M, getDynamicGrantOffer: V } = W().endpoints, a = T({
+    queryFn: V,
     options: {
       retry: 1,
-      shouldRetry: c((o) => o.status === 500, []),
-      onSettled: c(() => {
+      shouldRetry: u((o) => o.status === 500, []),
+      onSettled: u(() => {
         _(!1);
       }, [])
     }
-  }), l = b({
-    queryFn: V,
+  }), l = T({
+    queryFn: M,
     options: {
-      onSuccess: (o) => M(o)
+      onSuccess: (o) => I(o)
     }
-  }), B = c(() => {
+  }), B = u(() => {
     var o, L;
     l.mutate({
       body: {
@@ -90,53 +90,56 @@ const K = () => /* @__PURE__ */ t("div", { className: "adyen-pe-capital-offer-se
       },
       contentType: "application/json"
     });
-  }, [s, a.data, i, l]), y = c(
+  }, [s, a.data, i, l]), h = u(
     (o) => a.mutate({}, { query: { amount: o, currency: s } }),
     [s, a]
-  ), [h, _] = D(!1), A = w(y, 300), F = c(
+  ), [A, _] = D(!1), R = F(h, 300), w = u(
     (o) => {
-      A.cancel(), _(!0), S(o);
+      R.cancel(), _(!0), P(o);
     },
-    [A]
-  ), Y = (o) => A(o);
+    [R]
+  ), Y = (o) => R(o);
   q(() => {
-    e && !a.data && !i && (S(
-      (o) => o || (m ? Number(m) : v || e.minAmount.value)
-    ), y(i || v || e.minAmount.value));
-  }, [e, a.data, y, v, m, i]);
-  const g = p(
-    () => l.isLoading || a.isLoading || h,
-    [a.isLoading, h, l.isLoading]
+    e && !a.data && !i && (P(
+      (o) => o || (d ? Number(d) : y || e.minAmount.value)
+    ), h(i || y || e.minAmount.value));
+  }, [e, a.data, h, y, d, i]);
+  const x = p(
+    () => l.isLoading || a.isLoading || A,
+    [a.isLoading, A, l.isLoading]
   );
-  return /* @__PURE__ */ t("div", { className: "adyen-pe-capital-offer-selection", children: l.error || a.error || u || r ? /* @__PURE__ */ t(
-    X,
+  return /* @__PURE__ */ t("div", { className: "adyen-pe-capital-offer-selection", children: l.error || a.error || c || r ? /* @__PURE__ */ t(
+    H,
     {
       error: l.error || a.error || r,
-      onBack: d,
+      onBack: m,
       onContactSupport: n,
-      emptyGrantOffer: u
+      emptyGrantOffer: c
     }
-  ) : /* @__PURE__ */ t(U, { children: [
+  ) : /* @__PURE__ */ t($, { children: [
     e && /* @__PURE__ */ t(
-      W,
+      z,
       {
         value: i,
         dynamicOffersConfig: e,
-        onValueChange: F,
+        onValueChange: w,
         onRelease: Y
       }
     ),
-    /* @__PURE__ */ t($, { className: "adyen-pe-capital-offer-selection__details", children: !a.data || a.isLoading || h ? /* @__PURE__ */ t(K, {}) : a.data ? /* @__PURE__ */ t(Z, { data: a.data }) : null }),
+    /* @__PURE__ */ t(J, { className: "adyen-pe-capital-offer-selection__details", children: !a.data || a.isLoading || A ? /* @__PURE__ */ t(X, {}) : a.data ? /* @__PURE__ */ t(Z, { data: a.data }) : null }),
     /* @__PURE__ */ t("div", { className: "adyen-pe-capital-offer-selection__buttons", children: [
-      d && /* @__PURE__ */ t(T, { variant: k.SECONDARY, onClick: d, children: x.get("back") }),
+      m && /* @__PURE__ */ t(k, { variant: b.SECONDARY, onClick: m, children: v.get("capital.common.actions.goBack") }),
       /* @__PURE__ */ t(
-        T,
+        k,
         {
-          variant: k.PRIMARY,
-          state: g ? "loading" : void 0,
+          variant: b.PRIMARY,
+          state: x ? "loading" : void 0,
           onClick: B,
           disabled: l.isLoading || !(e != null && e.minAmount),
-          children: x.get(g ? "loading" : "capital.reviewOffer")
+          "aria-label": v.get("capital.offer.selection.actions.reviewOffer"),
+          children: v.get(
+            x ? "capital.offer.selection.actions.reviewOffer.states.loading" : "capital.offer.selection.actions.reviewOffer"
+          )
         }
       )
     ] })