@adyen/kyc-components 4.20.0 → 4.21.0-beta.0

package/dist/{PayoutDetailsDropin-CGuM-jhl.js → PayoutDetailsDropin-CEbLLMkT.js}

@@ -1,54 +1,52 @@
 try {
 	let e = "undefined" != typeof window ? window : "undefined" != typeof global ? global : "undefined" != typeof globalThis ? globalThis : "undefined" != typeof self ? self : {}, n = new e.Error().stack;
-	n && (e._sentryDebugIds = e._sentryDebugIds || {}, e._sentryDebugIds[n] = "ec035f4f-4d56-46d8-ab16-32dcc28bbe6c", e._sentryDebugIdIdentifier = "sentry-dbid-ec035f4f-4d56-46d8-ab16-32dcc28bbe6c");
+	n && (e._sentryDebugIds = e._sentryDebugIds || {}, e._sentryDebugIds[n] = "843055ea-cc7b-4c45-8fcd-2e63634f510f", e._sentryDebugIdIdentifier = "sentry-dbid-843055ea-cc7b-4c45-8fcd-2e63634f510f");
 } catch (e) {}
-import { a as Icon, i as Typography, o as createLogger, r as useTranslation, t as Trans } from "./translation-DH4IlMCP.js";
-import { C as useDataset, J as extractFieldName, M as ExperimentNames, N as FeatureNames, T as datasetUtilities, Z as hasEmptyFields, ft as useAccountHolder, j as useToggleContext, k as Header, nt as isEmpty, q as concatenateFieldNames, tt as isAccountIdentifierObscured, w as datasetIdentifier, x as Alert } from "./resolveEnvironment-I0NAzeCT.js";
-import { t as Button } from "./Button-Cm7cT6BX.js";
-import { n as httpGet, r as httpPost, s as useApiContext } from "./http-D6AdUBhO.js";
+import { r as useTranslation, t as Trans } from "./translation-BOm4lmPx.js";
+import { C as useDataset, J as extractFieldName, M as ExperimentNames, N as FeatureNames, T as datasetUtilities, Z as hasEmptyFields, j as useToggleContext, k as Header, mt as useAccountHolder, nt as isEmpty, pt as useSettingsContext, q as concatenateFieldNames, tt as isAccountIdentifierObscured, w as datasetIdentifier, x as Alert } from "./resolveEnvironment-wbFNXSP-.js";
+import { t as createLogger } from "./logger-Z8AeTE4x.js";
+import { t as Icon } from "./Icon-CurE93CX.js";
+import { t as Typography } from "./Typography-CAc_f5Iq.js";
+import { t as Button } from "./Button-DSD_afG_.js";
+import { n as httpGet, r as httpPost, s as useApiContext } from "./http-DsJtugN1.js";
 import { t as LegalEntityTypes } from "./legal-entity-type-0MfCGzUf.js";
-import { t as getLegalEntityCountry } from "./getLegalEntityCountry-BHh7Ux8v.js";
-import { t as useSettingsContext } from "./useSettingsContext-Bpf4UqRT.js";
-import { c as keysOf, n as cloneObject, o as objectsDeepEqual } from "./AnalyticsContext-BnRQ9H1u.js";
+import { t as getLegalEntityCountry } from "./getLegalEntityCountry-CNE5uei8.js";
+import { a as objectsDeepEqual, s as keysOf, t as cloneObject } from "./genUtils-Ce61IJs8.js";
 import { t as StackLayout } from "./StackLayout-IUdNMDgW.js";
 import { t as CountryCodes } from "./country-code-CJk2hdPu.js";
 import { t as TaskTypes } from "./taskTypes-3vSkMBDm.js";
-import { d as hasOwnEntityAssociationOfType } from "./entityAssociationUtil-DLXInibJ.js";
-import { t as EEA_Countries } from "./countries-CPj8hkLs.js";
-import { i as useAnalyticsContext, t as Modal } from "./Modal-nylR9F4X.js";
-import { n as SettingNames } from "./debugStore-DpSgCNGn.js";
-import { a as LandingLayout, i as getPropsFromConfigurations, n as augmentWithCountryConfigs, t as createFormRules } from "./form-rules-DV3hxYqZ.js";
+import { d as hasOwnEntityAssociationOfType } from "./entityAssociationUtil-CLBR9osP.js";
+import { t as EEA_Countries } from "./countries-BE4iGVAo.js";
+import { i as useAnalyticsContext, t as Modal } from "./Modal-C6gfqa3Z.js";
+import { a as SettingNames, t as InputText } from "./InputText-Co02nT5L.js";
+import { _ as LandingLayout, a as uppercase, c as customInputs, d as numericInputs, f as spacer, g as getPropsFromConfigurations, l as makeMask, m as augmentWithCountryConfigs, n as MaskedInput, o as alphaInputs, s as alphanumericInputs, t as createFormRules, u as nonInputs } from "./form-rules-DCZ-uyGo.js";
 import { t as Card } from "./Card-BCGLpdw7.js";
-import { n as useInvalidateRootLegalEntity, r as useToastContext } from "./useId-InBEunao.js";
-import { f as translateTranslatable, p as LoaderWrapper, r as Field, t as Select } from "./Select-Dmn4bMEK.js";
-import { n as Confirm } from "./StructuredList-DpzDjXNV.js";
-import { C as FormContextProvider, S as trackNavigation, a as getRequiredForms, b as createFormUtils, c as useMultiForm, d as useFormComposer, h as summaryItem, i as addValidityToForms, l as isNotEmptyValidator, n as CountryField, o as FormFlow, p as summaryStep, r as useFormContext, x as mergeFieldMetadataIntoProps } from "./CountryField-BC0wDSlI.js";
-import { t as Image } from "./Image-8SOcICah.js";
-import { t as ErrorPanel } from "./ErrorPanel-Be6eGO6I.js";
+import { n as useInvalidateRootLegalEntity, r as useToastContext } from "./useId-zuKUQ8ly.js";
+import { f as translateTranslatable, p as LoaderWrapper, r as Field, t as Select } from "./Select-PqhoL_oQ.js";
+import { n as Confirm, t as StructuredList } from "./StructuredList-BKWmLAYe.js";
+import { A as createFormUtils, C as isSummaryItem, M as trackNavigation, N as FormContextProvider, S as summaryStep, T as summaryItem, _ as useMultiForm, b as useFormComposer, c as validatePatternOnBlur, d as CountryField, f as useFormContext, h as FormFlow, j as mergeFieldMetadataIntoProps, l as resolveFieldMetadata, m as getRequiredForms, p as addValidityToForms, t as RadioGroup, v as isNotEmptyValidator } from "./RadioGroup-B_lHSMq9.js";
+import { t as Image } from "./Image-D82terx4.js";
+import { t as List } from "./List-ywoRPg-q.js";
+import { n as useFormRouterContext, t as ErrorPanel } from "./ErrorPanel-CMHH1nTS.js";
 import { t as getFormSlice } from "./getFormSlice-C1ma6Xd4.js";
-import { n as getLegalEntityNameBasedOnType, r as getPayoutAccountHolderName } from "./getName-C5jqdkJg.js";
-import { a as useUnifyLoadingStatus, i as useScenarioConfiguration, r as getPageName, t as mapExistingFile } from "./mapExistingFile-LvvzPjnk.js";
-import { t as useTaskLandedEvent } from "./useTaskLandedEvent-C7fcguXK.js";
-import { a as alphanumericInputs, c as nonInputs, i as alphaInputs, l as numericInputs, o as customInputs, s as makeMask, t as MaskedInput, u as spacer } from "./MaskedInput-DhHmuLSN.js";
-import { n as isMaintenanceModeError, t as processValidationErrors } from "./processValidationErrors-DgBZ7oLn.js";
-import { a as createDocumentRequest, i as bytesToSize, l as getFileExtention, n as fileValidationRules, o as documentApiUtils, r as DropzoneFile, s as getDocument, t as defaultFileValidationOptions } from "./validate-BNu91k9j.js";
-import { n as omitObscuredFieldsIfUnchanged, t as AdyenKycSdkError } from "./error-Dw40w6WM.js";
-import { a as isValidationError, i as isIdDocumentUploadError, n as isBankStatementUploadError, o as mapCreateOrUpdateTransferInstrumentErrorMessageToTranslatable } from "./validationError-D5iB4HOa.js";
-import { t as uppercase } from "./uppercase-DvjwUM0n.js";
-import { o as validatePatternOnBlur } from "./patternValidators-C8cRrD-t.js";
+import { n as getLegalEntityNameBasedOnType, r as getPayoutAccountHolderName } from "./getName-s7qmFean.js";
+import { a as useUnifyLoadingStatus, i as useScenarioConfiguration, r as getPageName, t as mapExistingFile } from "./mapExistingFile-R6-FnjjY.js";
+import { t as useTaskLandedEvent } from "./useTaskLandedEvent-BCvoFRym.js";
+import { n as isMaintenanceModeError, t as processValidationErrors } from "./processValidationErrors-Cm3cBtN7.js";
+import { a as createDocumentRequest, i as bytesToSize, l as getFileExtention, n as fileValidationRules, o as documentApiUtils, r as DropzoneFile, s as getDocument, t as defaultFileValidationOptions } from "./validate-D3UP_q_2.js";
+import { n as omitObscuredFieldsIfUnchanged, t as AdyenKycSdkError } from "./error-DIUYkZG-.js";
+import { a as isValidationError, i as isIdDocumentUploadError, n as isBankStatementUploadError, o as mapCreateOrUpdateTransferInstrumentErrorMessageToTranslatable } from "./validationError-BgIcYxoa.js";
 import { t as bankStatementDescriptionPattern } from "./basePatterns-plHFNzgJ.js";
-import { t as resolveFieldMetadata } from "./fieldConfigurations-CZCFghnK.js";
-import { t as TextArea } from "./TextArea-CoS-i-FF.js";
-import { t as Link } from "./Link-B7RA2gSt.js";
-import { t as InputText } from "./InputText-Cf9ccCaj.js";
-import { t as RadioGroup } from "./RadioGroup-C4csROhR.js";
-import { t as ContextGuidance } from "./ContextGuidance-M7lR8QJv.js";
+import { t as TextArea } from "./TextArea-E1LIeudB.js";
+import { t as Link } from "./Link-B-gN0d8l.js";
+import { t as ContextGuidance } from "./ContextGuidance-Digds0A2.js";
 import { t as Tag } from "./Tag-CNeDHqKp.js";
-import { n as useTransferInstrument, t as mapTransferInstrumentToPayoutAccount } from "./mapTransferInstrumentToPayoutAccount-cKBtK0Qx.js";
+import { n as useTransferInstrument, t as mapTransferInstrumentToPayoutAccount } from "./mapTransferInstrumentToPayoutAccount-D-RdVquH.js";
 import { t as Currencies } from "./currency-DQwXq9Mc.js";
-import { t as currencyByCountry } from "./types-BLWT7WnU.js";
-import { t as useUnincorporatedPartnershipMembers } from "./useUnincorporatedPartnershipMembers-C5CNWe_U.js";
+import { t as currencyByCountry } from "./types-Ai_80DXu.js";
+import { t as useUnincorporatedPartnershipMembers } from "./useUnincorporatedPartnershipMembers-00l8eNLk.js";
 import { t as Divider } from "./Divider-BENvVRnz.js";
+import { t as NewSummary } from "./NewSummary-BKUTkBAU.js";
 import { lazy, memo, useMemo, useRef, useState } from "preact/compat";
 import { useCallback as useCallback$1, useContext as useContext$1, useEffect as useEffect$1, useMemo as useMemo$1, useRef as useRef$1, useState as useState$1 } from "preact/hooks";
 import cx from "classnames";
@@ -2491,22 +2489,26 @@ var regions = {
 };
 var getAllowedBankCountries = (country) => Object.values(regions).find((countriesInARegion) => countriesInARegion.includes(country)) ?? [country];
 var VerificationMethod_module_default = {
-	"instant-verification-error": "_instant-verification-error_ta7db_1",
-	instantVerificationError: "_instant-verification-error_ta7db_1",
-	"payout-verification-method-card": "_payout-verification-method-card_ta7db_5",
-	payoutVerificationMethodCard: "_payout-verification-method-card_ta7db_5",
-	"payout-verification-method-card-image": "_payout-verification-method-card-image_ta7db_13",
-	payoutVerificationMethodCardImage: "_payout-verification-method-card-image_ta7db_13",
-	"payout-verification-method-card-body": "_payout-verification-method-card-body_ta7db_17",
-	payoutVerificationMethodCardBody: "_payout-verification-method-card-body_ta7db_17",
-	"payout-verification-method-card-image-container": "_payout-verification-method-card-image-container_ta7db_30",
-	payoutVerificationMethodCardImageContainer: "_payout-verification-method-card-image-container_ta7db_30",
-	"payout-verification-method-card-content": "_payout-verification-method-card-content_ta7db_42",
-	payoutVerificationMethodCardContent: "_payout-verification-method-card-content_ta7db_42",
-	"payout-verification-method-card-title": "_payout-verification-method-card-title_ta7db_56",
-	payoutVerificationMethodCardTitle: "_payout-verification-method-card-title_ta7db_56",
-	"payout-verification-method-card-subtitle": "_payout-verification-method-card-subtitle_ta7db_67",
-	payoutVerificationMethodCardSubtitle: "_payout-verification-method-card-subtitle_ta7db_67"
+	"instant-verification-error": "_instant-verification-error_1maus_1",
+	instantVerificationError: "_instant-verification-error_1maus_1",
+	"payout-verification-method-card": "_payout-verification-method-card_1maus_5",
+	payoutVerificationMethodCard: "_payout-verification-method-card_1maus_5",
+	"payout-verification-method-card-disabled": "_payout-verification-method-card-disabled_1maus_9",
+	payoutVerificationMethodCardDisabled: "_payout-verification-method-card-disabled_1maus_9",
+	"payout-verification-method-card-image": "_payout-verification-method-card-image_1maus_14",
+	payoutVerificationMethodCardImage: "_payout-verification-method-card-image_1maus_14",
+	"payout-verification-method-card-body": "_payout-verification-method-card-body_1maus_18",
+	payoutVerificationMethodCardBody: "_payout-verification-method-card-body_1maus_18",
+	"payout-verification-method-card-image-container": "_payout-verification-method-card-image-container_1maus_31",
+	payoutVerificationMethodCardImageContainer: "_payout-verification-method-card-image-container_1maus_31",
+	"payout-verification-method-card-tag": "_payout-verification-method-card-tag_1maus_48",
+	payoutVerificationMethodCardTag: "_payout-verification-method-card-tag_1maus_48",
+	"payout-verification-method-card-content": "_payout-verification-method-card-content_1maus_53",
+	payoutVerificationMethodCardContent: "_payout-verification-method-card-content_1maus_53",
+	"payout-verification-method-card-title": "_payout-verification-method-card-title_1maus_67",
+	payoutVerificationMethodCardTitle: "_payout-verification-method-card-title_1maus_67",
+	"payout-verification-method-card-subtitle": "_payout-verification-method-card-subtitle_1maus_78",
+	payoutVerificationMethodCardSubtitle: "_payout-verification-method-card-subtitle_1maus_78"
 };
 //#endregion
 //#region src/components/BankAccount/forms/PayoutVerificationMethod/PayoutVerificationMethod.tsx
@@ -2518,13 +2520,14 @@ var PayoutVerificationMethodOptionIcon = ({ method, methodsMetadata }) => {
 	});
 };
 var PayoutVerificationMethodOptionCard = ({ payoutMethod, title, subtitle, tag, selectVerificationMethod, payoutVerificationMethod, methodsMetadata, bankInfoValidated, instantVerificationAvailable }) => {
+	const isCardDisabled = bankInfoValidated || payoutMethod === "instantVerification" && !instantVerificationAvailable;
 	return /* @__PURE__ */ jsx(Card, {
 		onClick: () => selectVerificationMethod(payoutMethod),
-		disabled: bankInfoValidated || payoutMethod === "instantVerification" && !instantVerificationAvailable,
+		disabled: isCardDisabled,
 		selected: payoutMethod === payoutVerificationMethod,
 		padding: "none",
 		children: /* @__PURE__ */ jsxs("div", {
-			className: cx(VerificationMethod_module_default.payoutVerificationMethodCardBody, VerificationMethod_module_default.payoutVerificationMethodCard),
+			className: cx(VerificationMethod_module_default.payoutVerificationMethodCardBody, VerificationMethod_module_default.payoutVerificationMethodCard, { [VerificationMethod_module_default.payoutVerificationMethodCardDisabled]: isCardDisabled }),
 			children: [/* @__PURE__ */ jsx("div", {
 				className: VerificationMethod_module_default.payoutVerificationMethodCardImageContainer,
 				children: /* @__PURE__ */ jsx(PayoutVerificationMethodOptionIcon, {
@@ -2538,13 +2541,14 @@ var PayoutVerificationMethodOptionCard = ({ payoutMethod, title, subtitle, tag,
 					/* @__PURE__ */ jsx(Typography, {
 						el: "h4",
 						variant: "body-strongest",
+						color: isCardDisabled ? "disabled" : "primary",
 						className: VerificationMethod_module_default.payoutVerificationMethodCardTitle,
 						children: title
 					}),
 					/* @__PURE__ */ jsx(Typography, {
 						el: "p",
 						variant: "body",
-						color: "secondary",
+						color: isCardDisabled ? "disabled" : "secondary",
 						className: VerificationMethod_module_default.payoutVerificationMethodCardSubtitle,
 						children: subtitle
 					})
@@ -2654,7 +2658,7 @@ function PayoutVerificationMethod(props) {
 						subtitle: t(($) => $["theFastestWayToVerifyYourAccount"]),
 						tag: /* @__PURE__ */ jsx(Tag, {
 							variant: "blue",
-							className: "u-margin-bottom-8",
+							className: cx("u-margin-bottom-8", VerificationMethod_module_default.payoutVerificationMethodCardTag),
 							children: t(($) => $["recommended"])
 						}),
 						selectVerificationMethod,
@@ -3018,6 +3022,178 @@ var getAppropriatePayoutDetailsSteps = (isEditing, instantVerificationAvailable,
 	if (isEditing || !instantVerificationAvailable && !canChangeCountry || isForcedManualPayoutFlowEnabled) delete dependentSteps["payoutVerificationMethod"];
 	return dependentSteps;
 };
+var VerifiedWith_module_default = {
+	"verified-with": "_verified-with_j7pcm_1",
+	verifiedWith: "_verified-with_j7pcm_1",
+	logo: "_logo_j7pcm_5"
+};
+//#endregion
+//#region src/components/Shared/VerifiedWith/VerifiedWith.tsx
+var VerifiedWith = ({ name, logo }) => {
+	const { t } = useTranslation("common");
+	return /* @__PURE__ */ jsx(List, {
+		variant: "grouped-secondary",
+		children: /* @__PURE__ */ jsx(StructuredList, {
+			className: VerifiedWith_module_default.verifiedWith,
+			items: [{
+				term: t(($) => $["verifiedWith"]),
+				details: logo ? /* @__PURE__ */ jsx(Image, {
+					className: VerifiedWith_module_default.logo,
+					lazyLoadedImage: logo,
+					alt: name
+				}) : name
+			}]
+		})
+	});
+};
+//#endregion
+//#region src/components/BankAccount/tasks/PayoutDetailsDropin/utils.ts
+var CUSTOM_LABELS = {
+	verifiedAccountHolder: "accountHolder",
+	verifiedBankCountry: "bankCountry",
+	verifiedBankName: "bankName",
+	verifiedCurrencyCode: "currencyCode",
+	verifiedBankAccountNumber: "bankAccountNumber"
+};
+/**
+* we are determining the header of the modal from the first error. to be refined in later iterations
+*
+* @param errors
+*/
+var getInvalidFieldsErrorHeader = (invalidField) => {
+	switch (invalidField) {
+		case "LEGAL_BUSINESS_NAME":
+		case "FIRST_NAME":
+		case "LAST_NAME": return "caasBankAccountHolderDoesNotMatch";
+		default: return "weCouldntCompleteTheAccountCheck";
+	}
+};
+/**
+* we are determining the content of the modal from the first error. to be refined in later iterations
+*
+* @param errors
+*/
+var getInvalidFieldsErrorContent = (invalidField) => {
+	switch (invalidField) {
+		case "LEGAL_BUSINESS_NAME": return "caasBankAccountMustBeInYourNameYourBusinessLegalNameOrDoingBusinessAs";
+		case "FIRST_NAME":
+		case "LAST_NAME": return "caasBankAccountMustBeInYourName";
+		default: return "weCouldntCompleteTheAccountCheck";
+	}
+};
+var defaultInvalidErrorMessage = {
+	header: "weCouldntCompleteTheAccountCheck",
+	content: "weCouldntCompleteTheAccountCheck"
+};
+var getInvalidFieldsErrorMessage = (errors) => {
+	if (!errors || errors.length === 0) return defaultInvalidErrorMessage;
+	const [firstError] = errors;
+	const { invalidFields } = firstError;
+	if (!invalidFields || invalidFields.length === 0) return defaultInvalidErrorMessage;
+	const [firstInvalidField] = invalidFields;
+	return {
+		header: getInvalidFieldsErrorHeader(firstInvalidField),
+		content: getInvalidFieldsErrorContent(firstInvalidField)
+	};
+};
+var getPayoutVerificationMethod = (transferInstrument, instantVerificationEnabled) => {
+	if (transferInstrument) return "manualVerification";
+	else return instantVerificationEnabled ? "instantVerification" : "manualVerification";
+};
+/**
+* Ensures that all the "verified" fields have the corresponding regular field's label in the summary.
+* Same as if they were manually entered.
+*/
+var formatAccountVerificationSummary = (data, getCountryName) => {
+	if (!data) return {};
+	const summary = {};
+	keysOf(CUSTOM_LABELS).forEach((key) => {
+		const value = data[key];
+		if (!value) return;
+		summary[key] = summaryItem(CUSTOM_LABELS[key], key === "verifiedBankCountry" ? getCountryName(value) ?? value : value);
+	});
+	return summary;
+};
+//#endregion
+//#region src/components/BankAccount/tasks/PayoutDetailsDropin/PayoutSummary.tsx
+var omittedKeys = ["transferInstrumentId", "payoutVerificationMethod"];
+var formsWithoutEditButton = ["payoutVerificationMethod", "payoutAccountVerification"];
+var labelOverrides = { payoutAccountVerification: "bankAccount" };
+var PayoutSummary = ({ data, forms, omittedForms, problems, provider, shouldUseBankAccountType }) => {
+	const { t, i18n } = useTranslation("common");
+	const { t: bankingT } = useTranslation("banking");
+	const { goToFormByFormId } = useFormRouterContext();
+	const { getCountryName } = datasetUtilities(i18n.language);
+	const formatFileSummaryData = (bankDocuments) => {
+		const bankStatementDocument = bankDocuments?.bankStatementDocument?.[0];
+		return {
+			documentType: bankDocuments?.documentType && t(($) => $[bankDocuments?.documentType]),
+			fileName: bankStatementDocument?.name,
+			description: bankDocuments?.description
+		};
+	};
+	/**
+	* Display copy of the form data. Inputs are read from the typed `data` and only the widened
+	* clone is written to, so form state is never mutated.
+	*/
+	const formatDataForSummary = () => {
+		const summaryData = cloneObject(data);
+		const { bankCountry } = data.payoutVerificationMethod ?? {};
+		const { accountType } = data.payoutAccountDetails ?? {};
+		if (summaryData.payoutAccountDetails) {
+			if (bankCountry) summaryData.payoutAccountDetails.bankCountry = getCountryName(bankCountry) ?? void 0;
+			if (shouldUseBankAccountType && accountType) summaryData.payoutAccountDetails.accountType = bankingT(($) => $[accountType]);
+		}
+		if (data.payoutAccountDocuments) summaryData.payoutAccountDocuments = formatFileSummaryData(data.payoutAccountDocuments);
+		summaryData.payoutAccountVerification = formatAccountVerificationSummary(data.payoutAccountVerification, getCountryName);
+		return summaryData;
+	};
+	const summaryData = formatDataForSummary();
+	const formatItemsForStructuredList = (formData) => Object.entries(formData).flatMap(([key, value]) => {
+		if (omittedKeys.includes(key) || !value) return [];
+		if (isSummaryItem(value)) {
+			const { summaryLabel, summaryValue, preTranslated } = value;
+			return [{
+				term: preTranslated ? summaryLabel : translateTranslatable(t, summaryLabel) ?? "",
+				details: summaryValue
+			}];
+		}
+		return [{
+			term: t(($) => $[key]),
+			details: value
+		}];
+	});
+	return /* @__PURE__ */ jsx(NewSummary, {
+		handleEditForm: goToFormByFormId,
+		sections: forms.flatMap(({ formId, formName }) => {
+			const formData = summaryData[formId];
+			if (!formData || Object.values(formData).every((value) => isEmpty(value)) || formId === summaryStep.formId || omittedForms.includes(formId)) return [];
+			return [{
+				formId,
+				label: t(($) => $[labelOverrides[formId] ?? formName]),
+				items: formatItemsForStructuredList(formData),
+				hideEditButton: formsWithoutEditButton.includes(formId)
+			}];
+		}),
+		children: [/* @__PURE__ */ jsx(ErrorPanel, {
+			validationErrors: problems?.validationErrors && Object.values(problems.validationErrors)?.reduce((acc, validError) => ({
+				...acc,
+				...validError
+			}), {}),
+			verificationErrors: problems?.verificationErrors && Object.values(problems.verificationErrors)?.reduce((acc, verifError) => ({
+				...acc,
+				...verifError
+			}), {}),
+			formUtils: createFormUtils({ labels: {} }, t),
+			id: "ariaErrorField",
+			slot: "errorPanel"
+		}, "errorPanel"), ...provider ? [/* @__PURE__ */ jsx(VerifiedWith, {
+			name: provider.name,
+			logo: getProviderIconName(provider.name),
+			slot: "extraContent"
+		}, "extraContent")] : []]
+	});
+};
 //#endregion
 //#region src/components/BankAccount/utils/defaultPayoutAccountFormat.ts
 var defaultPayoutAccountFormat = {
@@ -3336,73 +3512,6 @@ var usePayoutAccountFormat = (country, existingBankAccountFormat) => {
 	return accountFormats?.[activeFormat];
 };
 //#endregion
-//#region src/components/BankAccount/tasks/PayoutDetailsDropin/utils.ts
-var CUSTOM_LABELS = {
-	verifiedAccountHolder: "accountHolder",
-	verifiedBankCountry: "bankCountry",
-	verifiedBankName: "bankName",
-	verifiedCurrencyCode: "currencyCode",
-	verifiedBankAccountNumber: "bankAccountNumber"
-};
-/**
-* we are determining the header of the modal from the first error. to be refined in later iterations
-*
-* @param errors
-*/
-var getInvalidFieldsErrorHeader = (invalidField) => {
-	switch (invalidField) {
-		case "LEGAL_BUSINESS_NAME":
-		case "FIRST_NAME":
-		case "LAST_NAME": return "caasBankAccountHolderDoesNotMatch";
-		default: return "weCouldntCompleteTheAccountCheck";
-	}
-};
-/**
-* we are determining the content of the modal from the first error. to be refined in later iterations
-*
-* @param errors
-*/
-var getInvalidFieldsErrorContent = (invalidField) => {
-	switch (invalidField) {
-		case "LEGAL_BUSINESS_NAME": return "caasBankAccountMustBeInYourNameYourBusinessLegalNameOrDoingBusinessAs";
-		case "FIRST_NAME":
-		case "LAST_NAME": return "caasBankAccountMustBeInYourName";
-		default: return "weCouldntCompleteTheAccountCheck";
-	}
-};
-var defaultInvalidErrorMessage = {
-	header: "weCouldntCompleteTheAccountCheck",
-	content: "weCouldntCompleteTheAccountCheck"
-};
-var getInvalidFieldsErrorMessage = (errors) => {
-	if (!errors || errors.length === 0) return defaultInvalidErrorMessage;
-	const [firstError] = errors;
-	const { invalidFields } = firstError;
-	if (!invalidFields || invalidFields.length === 0) return defaultInvalidErrorMessage;
-	const [firstInvalidField] = invalidFields;
-	return {
-		header: getInvalidFieldsErrorHeader(firstInvalidField),
-		content: getInvalidFieldsErrorContent(firstInvalidField)
-	};
-};
-var getPayoutVerificationMethod = (transferInstrument, instantVerificationEnabled) => {
-	if (transferInstrument) return "manualVerification";
-	else return instantVerificationEnabled ? "instantVerification" : "manualVerification";
-};
-/**
-* Ensures that all the "verified" fields have the corresponding regular field's label in the summary.
-* Same as if they were manually entered.
-*/
-var formatAccountVerificationSummary = (data) => {
-	if (!data) return {};
-	const summary = {};
-	keysOf(CUSTOM_LABELS).forEach((key) => {
-		if (!data[key]) return;
-		summary[key] = summaryItem(CUSTOM_LABELS[key], data[key]);
-	});
-	return summary;
-};
-//#endregion
 //#region src/components/BankAccount/tasks/PayoutDetailsDropin/PayoutDetailsDropin.tsx
 function PayoutDetailsDropin({ legalEntityResponse, problems: propProblems, onSubmit: externalOnSubmit, asModal = false, handleCloseClick, taskType: propTaskType, handleHomeClick, currentTransferInstrumentId, navigateBackToTaskList, handleBackClick: externalBackClick, openBankingPartnerConfigId }) {
 	const { baseUrl, rootLegalEntityId } = useApiContext();
@@ -3755,27 +3864,6 @@ function PayoutDetailsDropin({ legalEntityResponse, problems: propProblems, onSu
 			});
 		}
 	};
-	const formatFileSummaryData = (bankDocuments) => {
-		const bankStatementDocument = bankDocuments?.bankStatementDocument?.[0];
-		return {
-			documentType: bankDocuments?.documentType && commonT(($) => $[bankDocuments?.documentType]),
-			fileName: bankStatementDocument?.name,
-			description: bankDocuments?.description
-		};
-	};
-	const datasetUtils = datasetUtilities(i18next.language);
-	const formatDataForSummary = () => {
-		const summaryData = cloneObject(multiForm.data);
-		if (summaryData.payoutAccountDetails) summaryData.payoutAccountDetails.accountHolder = accountHolderName;
-		if (summaryData.payoutVerificationMethod?.bankCountry && summaryData.payoutAccountDetails) summaryData.payoutAccountDetails.bankCountry = datasetUtils.getCountryName(summaryData.payoutVerificationMethod.bankCountry);
-		if (shouldUseBankAccountType && summaryData.payoutAccountDetails?.accountType) {
-			const accountTypeKey = summaryData.payoutAccountDetails.accountType;
-			summaryData.payoutAccountDetails.accountType = t(($) => $[accountTypeKey]);
-		}
-		if (summaryData.payoutAccountDocuments) summaryData.payoutAccountDocuments = formatFileSummaryData(multiForm.data?.payoutAccountDocuments);
-		summaryData.payoutAccountVerification = formatAccountVerificationSummary(multiForm.data.payoutAccountVerification);
-		return summaryData;
-	};
 	const createTrustedTransferInstrumentHandler = async (code, state) => {
 		try {
 			const trustedTransferInstrument = await handleCreateTrustedTransferInstrument({
@@ -3900,7 +3988,7 @@ function PayoutDetailsDropin({ legalEntityResponse, problems: propProblems, onSu
 			setPreviousTrustedInstrumentStatus(createTrustedTransferInstrumentStatus);
 		}
 	}
-	const omittedForms = multiForm.data?.payoutVerificationMethod?.payoutVerificationMethod === "instantVerification" ? [] : [payoutSteps.payoutVerificationMethod.formId];
+	const omittedForms = [payoutSteps.payoutVerificationMethod.formId, ...isInstantVerificationFlow ? [payoutSteps.payoutAccountDetails.formId] : []];
 	const { header: invalidFieldHeader, content: invalidFieldContent } = getInvalidFieldsErrorMessage(checkAsAServiceData?.errors ?? []);
 	if (isFeatureEnabled(FeatureNames.EnableBankAccountDetailsLandingPage) && !hasStarted && !legalEntityResponse.transferInstruments?.length) return /* @__PURE__ */ jsx(PayoutDetailsGettingStarted, {
 		onGetStarted: () => setHasStarted(true),
@@ -3927,15 +4015,14 @@ function PayoutDetailsDropin({ legalEntityResponse, problems: propProblems, onSu
 		}), /* @__PURE__ */ jsx(FormContextProvider, {
 			form: multiForm,
 			children: /* @__PURE__ */ jsx(FormFlow, {
-				summary: {
-					data: formatDataForSummary(),
-					omitted: {
-						keys: ["transferInstrumentId", "payoutVerificationMethod"],
-						forms: omittedForms,
-						summaryEditButton: ["payoutVerificationMethod", "payoutAccountVerification"]
-					},
-					problems
-				},
+				summaryComponent: /* @__PURE__ */ jsx(PayoutSummary, {
+					data: multiForm.data,
+					forms,
+					omittedForms,
+					problems,
+					provider: isInstantVerificationFlow ? provider : void 0,
+					shouldUseBankAccountType
+				}),
 				asModal,
 				currentStep: steps.current,
 				totalSteps: steps.total,

package/dist/{PayoutDetailsPage-B-iD21gT.js → PayoutDetailsPage-z-U987Uw.js}

@@ -1,15 +1,15 @@
 try {
 	let e = "undefined" != typeof window ? window : "undefined" != typeof global ? global : "undefined" != typeof globalThis ? globalThis : "undefined" != typeof self ? self : {}, n = new e.Error().stack;
-	n && (e._sentryDebugIds = e._sentryDebugIds || {}, e._sentryDebugIds[n] = "7e95df3f-ff48-4615-89f5-aa478de6f279", e._sentryDebugIdIdentifier = "sentry-dbid-7e95df3f-ff48-4615-89f5-aa478de6f279");
+	n && (e._sentryDebugIds = e._sentryDebugIds || {}, e._sentryDebugIds[n] = "9ca015ed-c199-40f9-8f4e-adac1dcfe7cc", e._sentryDebugIdIdentifier = "sentry-dbid-9ca015ed-c199-40f9-8f4e-adac1dcfe7cc");
 } catch (e) {}
-import { n as addResourceBundles, r as useTranslation } from "./translation-DH4IlMCP.js";
-import { A as _rolldown_dynamic_import_helper_default } from "./resolveEnvironment-I0NAzeCT.js";
-import { r as Loader } from "./Button-Cm7cT6BX.js";
-import { r as useLegalEntity, t as ROOT_LE } from "./useLegalEntity-DR51Q4mE.js";
-import { C as EntityTypes } from "./processCapabilities-BSpmJOEd.js";
-import { n as useCapabilityProblems, t as getProblemsForEntity } from "./getProblemsForEntity-DStlTvE-.js";
-import { t as useNavigate } from "./useNavigate-BT8Z1amQ.js";
-import { t as PayoutDetailsDropin } from "./PayoutDetailsDropin-CGuM-jhl.js";
+import { n as addResourceBundles, r as useTranslation } from "./translation-BOm4lmPx.js";
+import { A as _rolldown_dynamic_import_helper_default } from "./resolveEnvironment-wbFNXSP-.js";
+import { t as Loader } from "./Loader-BEpMlKm2.js";
+import { r as useLegalEntity, t as ROOT_LE } from "./useLegalEntity-QQXN6YOm.js";
+import { C as EntityTypes } from "./processCapabilities-uXoRmB5x.js";
+import { n as useCapabilityProblems, t as getProblemsForEntity } from "./getProblemsForEntity-CTxd78-9.js";
+import { t as useNavigate } from "./useNavigate-BPlIHbOr.js";
+import { t as PayoutDetailsDropin } from "./PayoutDetailsDropin-CEbLLMkT.js";
 import { jsx } from "preact/jsx-runtime";
 import { useParams } from "wouter-preact";
 //#region src/components/BankAccount/pages/PayoutDetailsPage.tsx