@adyen/adyen-platform-experience-web 1.7.0 → 1.8.0

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

@@ -1,198 +1,206 @@
-import { jsx as t } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import I from "../../../../../core/Context/useCoreContext.js";
-import { useMemo as u, useCallback as P } from "../../../../../external/preact/hooks/dist/hooks.module.js";
-import { getExpectedRepaymentDate as M, calculateMaximumRepaymentPeriodInMonths as k, getPercentage as v } from "../utils/utils.js";
-import n from "../../../../internal/Typography/Typography.js";
-import { TypographyVariant as l, TypographyElement as m } from "../../../../internal/Typography/types.js";
+import { jsx as a } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import x from "../../../../../core/Context/useCoreContext.js";
+import { useMemo as u, useCallback as A } from "../../../../../external/preact/hooks/dist/hooks.module.js";
+import { getExpectedRepaymentDate as b, calculateMaximumRepaymentPeriodInMonths as k, getPercentage as g } from "../utils/utils.js";
+import i from "../../../../internal/Typography/Typography.js";
+import { TypographyVariant as m, TypographyElement as l } from "../../../../internal/Typography/types.js";
 /* empty css                         */
 import y from "../../../../internal/Button/Button.js";
-import { ButtonVariant as C } from "../../../../internal/Button/types.js";
-import D from "../../../../../hooks/useMutation/useMutation.js";
-import { Tooltip as N } from "../../../../internal/Tooltip/Tooltip.js";
-import { AlertTypeOption as E } from "../../../../internal/Alert/types.js";
-import { Alert as b } from "../../../../internal/Alert/Alert.js";
-import { CapitalErrorMessageDisplay as F } from "../utils/CapitalErrorMessageDisplay.js";
-import L from "classnames";
-import { CAPITAL_REPAYMENT_FREQUENCY as R } from "../../../../constants.js";
-import { CapitalOfferLegalNotice as S } from "../CapitalOfferLegalNotice/CapitalOfferLegalNotice.js";
-import w from "../../../../internal/InfoBox/InfoBox.js";
-import B from "../../../../internal/StructuredList/StructuredList.js";
-import { Icon as W } from "../../../../internal/Icon/Icon.js";
-import { useConfigContext as q } from "../../../../../core/ConfigContext/context.js";
-import { EMPTY_OBJECT as H } from "../../../../../utils/value/constants.js";
-const Y = ["30_013"], ce = ({
-  grantOffer: a,
-  onBack: h,
+import { ButtonVariant as P } from "../../../../internal/Button/types.js";
+import M from "../../../../../hooks/useMutation/useMutation.js";
+import { Tooltip as C } from "../../../../internal/Tooltip/Tooltip.js";
+import { AlertTypeOption as D } from "../../../../internal/Alert/types.js";
+import { Alert as E } from "../../../../internal/Alert/Alert.js";
+import { CapitalErrorMessageDisplay as L } from "../utils/CapitalErrorMessageDisplay.js";
+import S from "classnames";
+import { CAPITAL_REPAYMENT_FREQUENCY as N } from "../../../../constants.js";
+import { CapitalOfferLegalNotice as q } from "../CapitalOfferLegalNotice/CapitalOfferLegalNotice.js";
+import B from "../../../../internal/InfoBox/InfoBox.js";
+import { Translation as F } from "../../../../internal/Translation/Translation.js";
+import Y from "../../../../internal/StructuredList/StructuredList.js";
+import { Icon as H } from "../../../../internal/Icon/Icon.js";
+import { useConfigContext as W } from "../../../../../core/ConfigContext/context.js";
+import { EMPTY_OBJECT as w } from "../../../../../utils/value/constants.js";
+const G = ["30_013"], pe = ({
+  grantOffer: t,
+  onBack: f,
   onFundsRequest: p,
   onContactSupport: d
 }) => {
-  const { i18n: e } = I(), f = u(() => {
-    const r = M(a.expectedRepaymentPeriodDays);
-    return r ? e.date(r, { month: "long" }) : null;
-  }, [a, e]), { requestFunds: T } = q().endpoints, o = D({
-    queryFn: T,
+  const { i18n: e } = x(), R = u(() => {
+    const o = b(t.expectedRepaymentPeriodDays);
+    return o ? e.date(o, { month: "long" }) : null;
+  }, [t, e]), { requestFunds: _ } = W().endpoints, r = M({
+    queryFn: _,
     options: {
-      onSuccess: (r) => p == null ? void 0 : p(r)
+      onSuccess: (o) => p == null ? void 0 : p(o)
     }
-  }), A = P(
-    (r) => {
-      o.mutate(H, { path: { grantOfferId: r } });
+  }), h = A(
+    (o) => {
+      r.mutate(w, { path: { grantOfferId: o } });
     },
-    [o]
-  ), _ = P(() => {
-    a.id && A(a.id);
-  }, [a.id, A]), s = u(
-    () => k(a.maximumRepaymentPeriodDays),
-    [a.maximumRepaymentPeriodDays]
-  ), i = u(() => {
-    const r = o.error ? o.error : null;
-    if (r && Y.includes(r.errorCode))
-      switch (r.errorCode) {
+    [r]
+  ), T = A(() => {
+    t.id && h(t.id);
+  }, [t.id, h]), s = u(
+    () => k(t.maximumRepaymentPeriodDays),
+    [t.maximumRepaymentPeriodDays]
+  ), n = u(() => {
+    const o = r.error ? r.error : null;
+    if (o && G.includes(o.errorCode))
+      switch (o.errorCode) {
         case "30_013":
           return {
-            title: e.get("capital.thereIsNoPrimaryAccountConfigured"),
-            message: e.get("capital.weCouldNotContinueWithTheOfferContactSupportForHelp"),
+            title: e.get("capital.offer.common.errors.noPrimaryAccount"),
+            message: e.get("capital.offer.common.errors.cannotContinueSupport"),
             errorCode: "30_013"
           };
         default:
           return {
-            title: e.get("somethingWentWrong"),
-            message: e.get("capital.weCouldNotLoadFinancialOffers")
+            title: e.get("common.errors.somethingWentWrong"),
+            message: e.get("capital.offer.common.errors.unavailable")
           };
       }
     return null;
-  }, [e, o.error]), x = u(() => {
-    const r = [
+  }, [e, r.error]), I = u(() => {
+    const o = [
       {
-        key: "capital.fees",
-        value: e.amount(a.feesAmount.value, a.feesAmount.currency)
+        key: "capital.common.fields.fees",
+        value: e.amount(t.feesAmount.value, t.feesAmount.currency)
       },
       {
-        key: "capital.totalRepaymentAmount",
-        value: e.amount(a.totalAmount.value, a.totalAmount.currency)
+        key: "capital.common.fields.totalRepaymentAmount",
+        value: e.amount(t.totalAmount.value, t.totalAmount.currency)
       },
       {
-        key: "capital.repaymentThreshold",
-        value: e.amount(a.thresholdAmount.value, a.thresholdAmount.currency)
+        key: "capital.common.fields.repaymentThreshold",
+        value: e.amount(t.thresholdAmount.value, t.thresholdAmount.currency)
       },
       {
-        key: "capital.dailyRepaymentRate",
-        value: e.get("capital.xPercent", { values: { percentage: v(a.repaymentRate) } })
+        key: "capital.common.fields.dailyRepaymentRate",
+        value: e.get("capital.common.values.percentage", { values: { percentage: g(t.repaymentRate) } })
       },
       {
-        key: "capital.expectedRepaymentPeriod",
-        value: e.get("capital.xDays", { values: { days: a.expectedRepaymentPeriodDays } })
+        key: "capital.common.fields.expectedRepaymentPeriod",
+        value: e.get("capital.common.values.numberOfDays", { values: { days: t.expectedRepaymentPeriodDays } })
       },
-      { key: "account", value: e.get("capital.primaryAccount") }
+      { key: "capital.common.fields.account", value: e.get("capital.common.values.primaryAccount") }
     ];
-    return s && r.splice(4, 0, {
-      key: "capital.maximumRepaymentPeriod",
-      value: s === 1 ? e.get("capital.oneMonth") : e.get("capital.xMonths", { values: { months: s } })
-    }), a.aprBasisPoints && r.splice(1, 0, {
-      key: "capital.annualPercentageRate",
-      value: e.get("capital.xPercent", { values: { percentage: v(a.aprBasisPoints) } })
-    }), r;
-  }, [a, e, s]);
-  return !i && o.error ? /* @__PURE__ */ t(F, { error: o.error, onBack: h, onContactSupport: d }) : /* @__PURE__ */ t("div", { className: "adyen-pe-capital-offer-summary", children: [
-    /* @__PURE__ */ t(w, { className: "adyen-pe-capital-offer-summary__grant-summary", children: [
-      /* @__PURE__ */ t(n, { el: m.PARAGRAPH, variant: l.BODY, children: [
-        e.get("capital.youAreRequestingFundingOf"),
-        " ",
-        /* @__PURE__ */ t("strong", { children: `${e.amount(a.grantAmount.value, a.grantAmount.currency, { minimumFractionDigits: 0 })}.` })
-      ] }),
-      /* @__PURE__ */ t(n, { el: m.PARAGRAPH, variant: l.CAPTION, children: e.get("capital.youWillNeedToRepayAMinimumOfXEveryXDaysToPayOffTheFunds", {
+    return s && o.splice(4, 0, {
+      key: "capital.common.fields.maximumRepaymentPeriod",
+      value: s === 1 ? e.get("capital.common.values.oneMonth") : e.get("capital.common.values.numberOfMonths", { values: { months: s } })
+    }), t.aprBasisPoints && o.splice(1, 0, {
+      key: "capital.common.fields.annualPercentageRate",
+      value: e.get("capital.common.values.percentage", { values: { percentage: g(t.aprBasisPoints) } })
+    }), o;
+  }, [t, e, s]);
+  return !n && r.error ? /* @__PURE__ */ a(L, { error: r.error, onBack: f, onContactSupport: d }) : /* @__PURE__ */ a("div", { className: "adyen-pe-capital-offer-summary", children: [
+    /* @__PURE__ */ a(B, { className: "adyen-pe-capital-offer-summary__grant-summary", children: [
+      /* @__PURE__ */ a(i, { el: l.PARAGRAPH, variant: m.BODY, children: /* @__PURE__ */ a(
+        F,
+        {
+          translationKey: "capital.offer.common.fundingRequestInfo",
+          fills: {
+            amount: /* @__PURE__ */ a("strong", { children: `${e.amount(t.grantAmount.value, t.grantAmount.currency, { minimumFractionDigits: 0 })}` })
+          }
+        }
+      ) }),
+      /* @__PURE__ */ a(i, { el: l.PARAGRAPH, variant: m.CAPTION, children: e.get("capital.offer.common.repaymentInfo", {
         values: {
-          amount: e.amount(a.thresholdAmount.value, a.thresholdAmount.currency),
-          days: R,
-          date: f ?? ""
+          amount: e.amount(t.thresholdAmount.value, t.thresholdAmount.currency),
+          days: N,
+          date: R ?? ""
         }
       }) })
     ] }),
-    /* @__PURE__ */ t(
-      B,
+    /* @__PURE__ */ a(
+      Y,
       {
         classNames: "adyen-pe-capital-offer-summary__details",
-        renderLabel: (r, c) => c === "capital.repaymentThreshold" ? /* @__PURE__ */ t(
-          N,
+        renderLabel: (o, c) => c === "capital.common.fields.repaymentThreshold" ? /* @__PURE__ */ a(
+          C,
           {
             isContainerHovered: !0,
-            content: e.get("capital.minimumRepaymentToRepayTheFinancingOnTime", {
-              values: { days: R }
+            content: e.get("capital.common.fields.repaymentThreshold.description", {
+              values: { days: N }
             }),
-            children: /* @__PURE__ */ t("span", { children: /* @__PURE__ */ t(
-              n,
+            children: /* @__PURE__ */ a("span", { children: /* @__PURE__ */ a(
+              i,
               {
                 className: "adyen-pe-capital-offer-summary__list-label",
-                el: m.SPAN,
-                variant: l.CAPTION,
-                children: r
+                el: l.SPAN,
+                variant: m.CAPTION,
+                children: o
               }
             ) })
           }
-        ) : c === "capital.annualPercentageRate" ? /* @__PURE__ */ t(N, { isContainerHovered: !0, content: e.get("capital.annualPercentageRateIsTheCostOfBorrowingForALoan"), children: /* @__PURE__ */ t("span", { children: /* @__PURE__ */ t(
-          n,
+        ) : c === "capital.common.fields.annualPercentageRate" ? /* @__PURE__ */ a(C, { isContainerHovered: !0, content: e.get("capital.common.fields.annualPercentageRate.description"), children: /* @__PURE__ */ a("span", { children: /* @__PURE__ */ a(
+          i,
           {
             className: "adyen-pe-capital-offer-summary__list-label",
-            el: m.SPAN,
-            variant: l.CAPTION,
-            children: r
+            el: l.SPAN,
+            variant: m.CAPTION,
+            children: o
           }
-        ) }) }) : /* @__PURE__ */ t(
-          n,
+        ) }) }) : /* @__PURE__ */ a(
+          i,
           {
             className: "adyen-pe-capital-offer-summary__list-label",
-            el: m.SPAN,
-            variant: l.CAPTION,
-            children: r
+            el: l.SPAN,
+            variant: m.CAPTION,
+            children: o
           }
         ),
-        renderValue: (r, c) => {
-          const g = c === "account" && o.error && i && i.errorCode === "30_013";
-          return /* @__PURE__ */ t(
-            n,
+        renderValue: (o, c) => {
+          const v = c === "capital.common.fields.account" && r.error && n && n.errorCode === "30_013";
+          return /* @__PURE__ */ a(
+            i,
             {
-              className: L({
-                "adyen-pe-capital-offer-summary__details--error": g
+              className: S({
+                "adyen-pe-capital-offer-summary__details--error": v
               }),
-              el: m.SPAN,
-              variant: l.CAPTION,
+              el: l.SPAN,
+              variant: m.CAPTION,
               stronger: !0,
               children: [
-                g ? /* @__PURE__ */ t(W, { name: "warning-filled", "data-testid": "primary-account-warning-icon" }) : null,
-                r
+                v ? /* @__PURE__ */ a(H, { name: "warning-filled", "data-testid": "primary-account-warning-icon" }) : null,
+                o
               ]
             }
           );
         },
-        items: x
+        items: I
       }
     ),
-    i && /* @__PURE__ */ t(
-      b,
+    n && /* @__PURE__ */ a(
+      E,
       {
         className: "adyen-pe-capital-offer-summary__error-alert",
-        type: E.WARNING,
-        title: i.title,
-        description: i.message,
-        children: d ? /* @__PURE__ */ t(y, { className: "adyen-pe-capital-offer-summary__error-alert-button", onClick: d, children: e.get("contactSupport") }) : null
+        type: D.WARNING,
+        title: n.title,
+        description: n.message,
+        children: d ? /* @__PURE__ */ a(y, { className: "adyen-pe-capital-offer-summary__error-alert-button", onClick: d, children: e.get("capital.common.actions.contactSupport") }) : null
       }
     ),
-    /* @__PURE__ */ t(S, {}),
-    /* @__PURE__ */ t("div", { className: "adyen-pe-capital-offer-summary__buttons", children: [
-      o.error && !i ? null : /* @__PURE__ */ t(y, { variant: C.SECONDARY, onClick: h, children: e.get("back") }),
-      /* @__PURE__ */ t(
+    /* @__PURE__ */ a(q, {}),
+    /* @__PURE__ */ a("div", { className: "adyen-pe-capital-offer-summary__buttons", children: [
+      r.error && !n ? null : /* @__PURE__ */ a(y, { variant: P.SECONDARY, onClick: f, children: e.get("capital.common.actions.goBack") }),
+      /* @__PURE__ */ a(
         y,
         {
-          variant: C.PRIMARY,
-          state: o.isLoading ? "loading" : void 0,
-          onClick: _,
-          disabled: o.isLoading || !!o.error || !!o.data,
-          children: e.get(o.isLoading ? "capital.requesting" : "capital.requestFunds")
+          variant: P.PRIMARY,
+          state: r.isLoading ? "loading" : void 0,
+          onClick: T,
+          disabled: r.isLoading || !!r.error || !!r.data,
+          "aria-label": e.get("capital.offer.summary.actions.requestFunds"),
+          children: e.get(
+            r.isLoading ? "capital.offer.summary.actions.requestFunds.states.loading" : "capital.offer.summary.actions.requestFunds"
+          )
         }
       )
     ] })
   ] });
 };
 export {
-  ce as CapitalOfferSummary
+  pe as CapitalOfferSummary
 };

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

@@ -1,24 +1,24 @@
 import { jsx as o } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
 import { getCapitalErrorMessage as l } from "../../../../utils/capital/getCapitalErrorMessage.js";
-import s from "../../../../../core/Errors/AdyenPlatformExperienceError.js";
+import m from "../../../../../core/Errors/AdyenPlatformExperienceError.js";
 import { ErrorMessageDisplay as u } from "../../../../internal/ErrorMessageDisplay/ErrorMessageDisplay.js";
-import { useCallback as E, useMemo as g } from "../../../../../external/preact/hooks/dist/hooks.module.js";
-import C from "../../../../internal/Button/Button.js";
-import { ButtonVariant as R } from "../../../../internal/Button/types.js";
-import c from "../../../../../core/Context/useCoreContext.js";
-import { ErrorTypes as m } from "../../../../../core/Http/utils.js";
+import { useCallback as E, useMemo as c } from "../../../../../external/preact/hooks/dist/hooks.module.js";
+import g from "../../../../internal/Button/Button.js";
+import { ButtonVariant as C } from "../../../../internal/Button/types.js";
+import R from "../../../../../core/Context/useCoreContext.js";
+import { ErrorTypes as s } from "../../../../../core/Http/utils.js";
 import { Fragment as d } from "../../../../../external/preact/dist/preact.module.js";
-const h = ({
+const w = ({
   emptyGrantOffer: t,
   error: e,
   onContactSupport: i,
   onBack: r,
   unsupportedRegion: n
 }) => {
-  const { i18n: a } = c(), p = E(
-    () => /* @__PURE__ */ o(d, { children: r && /* @__PURE__ */ o(C, { variant: R.SECONDARY, onClick: r, children: a.get("back") }) }),
+  const { i18n: a } = R(), p = E(
+    () => /* @__PURE__ */ o(d, { children: r && /* @__PURE__ */ o(g, { variant: C.SECONDARY, onClick: r, children: a.get("capital.common.actions.goBack") }) }),
     [a, r]
-  ), f = g(() => n ? new s(m.ERROR, "UnsupportedRegion", "Unsupported Region Configuration", "UNSUPPORTED_REGION") : t ? new s(m.ERROR, "EmptyConfig", "Empty Configuration", "EMPTY_CONFIG") : e, [t, n, e]);
+  ), f = c(() => n ? new m(s.ERROR, "UnsupportedRegion", "Unsupported Region Configuration", "UNSUPPORTED_REGION") : t ? new m(s.ERROR, "EmptyConfig", "Empty Configuration", "EMPTY_CONFIG") : e, [t, n, e]);
   return /* @__PURE__ */ o(
     u,
     {
@@ -32,5 +32,5 @@ const h = ({
   );
 };
 export {
-  h as CapitalErrorMessageDisplay
+  w as CapitalErrorMessageDisplay
 };

package/dist/es/components/external/CapitalOverview/CapitalOverviewElement.js

@@ -1,29 +1,29 @@
-var u = Object.defineProperty;
-var h = (o, e, t) => e in o ? u(o, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : o[e] = t;
+var f = Object.defineProperty;
+var h = (o, e, t) => e in o ? f(o, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : o[e] = t;
 var r = (o, e, t) => h(o, typeof e != "symbol" ? e + "" : e, t);
 import { jsx as R } from "../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import { isCapitalRegionSupported as v } from "../../internal/CapitalHeader/helpers.js";
-import { UIElement as g } from "../UIElement/UIElement.js";
+import { isCapitalRegionSupported as g } from "../../internal/CapitalHeader/helpers.js";
+import { UIElement as v } from "../UIElement/UIElement.js";
 import { CapitalOverview as x } from "./components/CapitalOverview/CapitalOverview.js";
 import w from "../../../core/ConfigContext/session/utils/sessionReady.js";
 import { EMPTY_OBJECT as l } from "../../../utils/value/constants.js";
 import { noop as d } from "../../../utils/common.js";
-class y extends g {
+class y extends v {
   constructor(t) {
     super(t);
-    r(this, "componentToRender", () => /* @__PURE__ */ R(x, { ...this.props, ref: (t) => void (this.componentRef = t) }));
-    this.customClassNames = "adyen-pe-capital-overview-component", this.componentToRender = this.componentToRender.bind(this);
+    r(this, "componentToRender", () => /* @__PURE__ */ R(x, { ...this.props }));
+    this.componentToRender = this.componentToRender.bind(this), this.customClassNames = "adyen-pe-capital-overview-component";
   }
   async getState() {
     var c, m;
     const { session: t } = this.props.core;
     await w(t);
-    const { getDynamicGrantOffersConfiguration: i, getGrants: s } = t.context.endpoints, f = (c = t.context.extraConfig) == null ? void 0 : c.legalEntity;
-    if (!v(f))
+    const { getDynamicGrantOffersConfiguration: s, getGrants: i } = t.context.endpoints, u = (c = t.context.extraConfig) == null ? void 0 : c.legalEntity;
+    if (!g(u))
       return { state: "isInUnsupportedRegion" };
     const [a, p] = await Promise.all([
-      i == null ? void 0 : i(l).catch(d),
-      s == null ? void 0 : s(l).catch(d)
+      s == null ? void 0 : s(l).catch(d),
+      i == null ? void 0 : i(l).catch(d)
     ]);
     let n = "isUnqualified";
     return p && ((m = p.data) == null ? void 0 : m.length) > 0 ? n = "hasRequestedGrants" : a && a.minAmount && (n = "isPreQualified"), { state: n };

package/dist/es/components/external/CapitalOverview/components/AccountDetails/AccountDetail.js

@@ -1,22 +1,42 @@
-import { jsx as r } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import c from "../../../../internal/CopyText/CopyText.js";
-import d from "../../../../../core/Context/useCoreContext.js";
-import t from "../../../../internal/Typography/Typography.js";
-import { TypographyVariant as a, TypographyElement as i } from "../../../../internal/Typography/types.js";
-const x = ({
-  className: p,
-  content: e,
+import { jsx as e } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import y from "../../../../internal/CopyText/CopyText.js";
+import T from "../../../../../core/Context/useCoreContext.js";
+import i from "../../../../internal/Typography/Typography.js";
+import { TypographyVariant as o, TypographyElement as p } from "../../../../internal/Typography/types.js";
+import h from "classnames";
+const v = ({
+  className: n,
+  content: r,
   contentClassName: l,
-  textToCopy: o,
-  label: n,
-  labelClassName: m
+  copyButtonLabel: c,
+  isPrimary: t,
+  textToCopy: a,
+  label: m,
+  labelClassName: d
 }) => {
-  const { i18n: s } = d();
-  return /* @__PURE__ */ r("div", { className: p, children: [
-    /* @__PURE__ */ r("dt", { className: m, children: /* @__PURE__ */ r(t, { el: i.SPAN, variant: a.CAPTION, children: s.get(n) }) }),
-    /* @__PURE__ */ r("dd", { className: l, children: o ? /* @__PURE__ */ r(c, { buttonLabel: e, textToCopy: o, showCopyTextTooltip: !1, type: "Text" }) : /* @__PURE__ */ r(t, { el: i.SPAN, variant: a.BODY, children: e }) })
+  const { i18n: s } = T();
+  return /* @__PURE__ */ e("div", { className: n, children: [
+    /* @__PURE__ */ e("dt", { className: d, children: /* @__PURE__ */ e(i, { el: p.SPAN, variant: o.CAPTION, children: s.get(m) }) }),
+    /* @__PURE__ */ e("dd", { className: h(l, { "adyen-pe-capital-account-details__detail-content--primary": t }), children: a ? /* @__PURE__ */ e(
+      y,
+      {
+        copyButtonAriaLabelKey: c,
+        visibleText: r,
+        textToCopy: a,
+        showCopyTextTooltip: !1,
+        type: "Text"
+      }
+    ) : /* @__PURE__ */ e(
+      i,
+      {
+        el: p.SPAN,
+        variant: t ? o.SUBTITLE : o.BODY,
+        stronger: t,
+        children: r
+      }
+    ) })
   ] });
 };
 export {
-  x as AccountDetail
+  v as AccountDetail
 };

package/dist/es/components/external/CapitalOverview/components/AccountDetails/AccountDetails.js

@@ -1,34 +1,36 @@
-import { jsx as l } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import { jsx as n } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
 import A from "classnames";
+import { Fragment as F } from "../../../../../external/preact/dist/preact.module.js";
 import { useMemo as C } from "../../../../../external/preact/hooks/dist/hooks.module.js";
-import { AccountDetail as F } from "./AccountDetail.js";
-import { Fragment as _ } from "../../../../../external/preact/dist/preact.module.js";
-import { getAccountFieldTextToCopy as y, getAccountFieldFormattedValue as S, getAccountFieldTranslationKey as b } from "./utils.js";
+import { AccountDetail as b } from "./AccountDetail.js";
+import { getAccountFieldTextToCopy as _, getAccountFieldFormattedValue as S, getAccountFieldCopyButtonLabelKey as g, getAccountFieldTranslationKey as L, isAccountFieldPrimary as N } from "./utils.js";
 /* empty css                    */
-const o = "adyen-pe-capital-account-details", n = {
+const o = "adyen-pe-capital-account-details", r = {
   detail: `${o}__detail`,
   detailContent: `${o}__detail-content`,
   detailLabel: `${o}__detail-label`
-}, $ = ({ bankAccount: a, className: i }) => {
-  const s = C(() => {
-    const { accountNumber: t, iban: e, order: r, region: d, ...m } = a, c = Object.keys({ iban: e, accountNumber: t, ...m, region: d }), u = Array.isArray(r) ? r.filter((p) => c.includes(p)) : c;
-    return [...new Set(u)];
+}, j = ({ bankAccount: a, className: i, ...s }) => {
+  const d = C(() => {
+    const { accountNumber: t, iban: e, order: l, region: m, ...u } = a, c = Object.keys({ iban: e, accountNumber: t, ...u, region: m }), p = Array.isArray(l) ? l.filter((y) => c.includes(y)) : c;
+    return [...new Set(p)];
   }, [a]);
-  return /* @__PURE__ */ l("dl", { className: A(o, i), children: s.map((t) => {
+  return /* @__PURE__ */ n("dl", { className: A(o, i), ...s, children: d.map((t) => {
     const e = a[t];
-    return e ? /* @__PURE__ */ l(_, { children: /* @__PURE__ */ l(
-      F,
+    return e ? /* @__PURE__ */ n(F, { children: /* @__PURE__ */ n(
+      b,
       {
-        className: n.detail,
-        contentClassName: n.detailContent,
-        labelClassName: n.detailLabel,
-        label: b(t),
+        className: r.detail,
+        contentClassName: r.detailContent,
+        isPrimary: N(t),
+        labelClassName: r.detailLabel,
+        label: L(t),
+        copyButtonLabel: g(t),
         content: S(t, e),
-        textToCopy: y(t, e)
+        textToCopy: _(t, e)
       }
     ) }, t) : null;
   }) });
 };
 export {
-  $ as AccountDetails
+  j as AccountDetails
 };

package/dist/es/components/external/CapitalOverview/components/AccountDetails/utils.js

@@ -1,11 +1,12 @@
-const n = (e, t = !0) => {
-  const a = t ? " " : " ";
-  return e.replace(/\s+/g, "").replace(/([A-Z\d]{4}(?!$))/gi, `$1${a}`);
-}, r = (e) => {
+const r = (e, a = !0) => {
+  const t = a ? " " : " ";
+  return e.replace(/\s+/g, "").replace(/([A-Z\d]{4}(?!$))/gi, `$1${t}`);
+}, c = (e) => {
   switch (e) {
     // Explicit list of copyable account fields
-    case "iban":
     case "accountNumber":
+    case "beneficiaryName":
+    case "iban":
     case "routingNumber":
     case "sortCode":
       return !0;
@@ -16,31 +17,61 @@ const n = (e, t = !0) => {
     default:
       return !1;
   }
-}, o = (e, t) => r(e) ? t : void 0, u = (e, t) => {
+}, i = (e, a) => c(e) ? a : void 0, o = (e, a) => {
   switch (e) {
     case "iban":
-      return t && n(t);
+      return a && r(a);
     default:
-      return t;
+      return a;
   }
 }, s = (e) => {
   switch (e) {
-    case "region":
-      return "capital.bankCountryOrRegion";
+    // Explicit list of copyable account fields
+    case "accountNumber":
+      return "capital.overview.repayment.actions.copyAccountNumber";
+    case "beneficiaryName":
+      return "capital.overview.repayment.actions.copyBeneficiaryName";
     case "iban":
-      return "capital.bankAccountIban";
+      return "capital.overview.repayment.actions.copyIban";
+    case "routingNumber":
+      return "capital.overview.repayment.actions.copyRoutingNumber";
+    case "sortCode":
+      return "capital.overview.repayment.actions.copySortCode";
+  }
+}, u = (e) => {
+  switch (e) {
     case "accountNumber":
-      return "capital.bankAccountNumber";
+      return "capital.overview.repayment.accountDetails.fields.accountNumber";
+    case "beneficiaryName":
+      return "capital.overview.repayment.accountDetails.fields.beneficiaryName";
+    case "iban":
+      return "capital.overview.repayment.accountDetails.fields.iban";
+    case "region":
+      return "capital.overview.repayment.accountDetails.fields.countryOrRegion";
     case "routingNumber":
-      return "capital.bankRoutingNumber";
+      return "capital.overview.repayment.accountDetails.fields.routingNumber";
     case "sortCode":
-      return "capital.bankSortCode";
+      return "capital.overview.repayment.accountDetails.fields.sortCode";
     default:
       return e;
   }
+}, l = (e) => {
+  switch (e) {
+    case "accountNumber":
+    case "iban":
+    case "routingNumber":
+    case "sortCode":
+      return !0;
+    case "beneficiaryName":
+    case "region":
+    default:
+      return !1;
+  }
 };
 export {
-  u as getAccountFieldFormattedValue,
-  o as getAccountFieldTextToCopy,
-  s as getAccountFieldTranslationKey
+  s as getAccountFieldCopyButtonLabelKey,
+  o as getAccountFieldFormattedValue,
+  i as getAccountFieldTextToCopy,
+  u as getAccountFieldTranslationKey,
+  l as isAccountFieldPrimary
 };