@adyen/kyc-components 4.0.0-beta.5 → 4.0.0-compact.0

package/dist/PayoutDetailsDropin-BJIqXmPn.js

@@ -0,0 +1,3694 @@
+;
+{
+  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] = "743cc952-87a2-4737-8336-8e437ec1e02e", e._sentryDebugIdIdentifier = "sentry-dbid-743cc952-87a2-4737-8336-8e437ec1e02e");
+  } catch (e) {
+  }
+}
+;
+import { jsx, jsxs, Fragment } from "preact/jsx-runtime";
+import { useState, useEffect, useRef, useMemo, useCallback, useContext } from "preact/hooks";
+import { b as useApiContext, j as useQuery, k as httpPost, o as httpGet, aA as useMutation, aC as useQueryClient, N as createLogger, a8 as CountryCodes, a as useTranslation, c as useLegalEntity, R as ROOT_LE, y as LegalEntityTypes, L as Loader, J as EntityTypes, U as useAnalyticsContext, V as Icon, x as Typography, B as Button, u as useI18nContext, af as objectsDeepEqual, aG as doArraysMatch, a9 as isEmpty, bj as getSdkToken, G as hasOwnEntityAssociationOfType, m as useSettingsContext, bk as EEA_Countries, X as useExperimentsContext, bl as isAccountIdentifierObscured, bm as hasEmptyFields, bn as extractFieldName, bo as concatenateFieldNames, aD as keysOf, g as getLegalEntityCountry, am as getCapabilityProblems, M as TaskTypes, ay as cloneObject, q as skipToken } from "./StoreProvider-BlaJzXSZ.js";
+import { u as useTransferInstrument, m as mapTransferInstrumentToPayoutAccount } from "./mapTransferInstrumentToPayoutAccount-CAoOlPMA.js";
+import { a as useForm, F as Field, c as Select, L as LoaderWrapper } from "./useForm-C1DW3mPC.js";
+import { E as ExperimentNames } from "./types-CAznNNSI.js";
+import { I as InputText, S as SettingNames } from "./InputText-BX5sG9WJ.js";
+import { u as useGlobalDataSlice, a as useGlobalData, b as useResetGlobalData, c as useStateContext, F as FormWrapper } from "./useGlobalData-jb7ua9I6.js";
+import { a as useInvalidateRootLegalEntity, u as useToastContext } from "./useToastContext-DGMeMy5R.js";
+import { D as DropzoneFile, h as bytesToSize, i as defaultFileValidationOptions, j as fileValidationRules, S as StateContextSetter, a as getDocument, c as createDocumentRequest, k as augmentWithCountryConfigs, d as documentApiUtils, b as getPropsFromConfigurations, f as getFileExtention } from "./validate-CvtamBXH.js";
+import { g as getRequiredForms, a as addValidityToForms, u as useFormComposer } from "./dropinUtils-DHp5v5jB.js";
+import { D as DocumentGuidance, A as AdyenKycSdkError, u as uppercase, p as payoutAccountFormat, m as mapExistingFile, g as getPageName, b as useScenarioConfiguration, c as useUnifyLoadingStatus } from "./mapExistingFile-DW5ktJzM.js";
+import { C as Confirm } from "./Confirm-DwutojkY.js";
+import { c as currencyByCountry } from "./types-K58FM7k4.js";
+import { i as isValidationError, p as processValidationErrors, b as isIdDocumentUploadError, c as isBankStatementUploadError, a as isMaintenanceModeError, m as mapCreateOrUpdateTransferInstrumentErrorMessageToTranslatable } from "./validationError-DOCbfk7K.js";
+import { u as useDataset, d as datasetIdentifier, a as datasetUtilities } from "./useDataset-BgvQQEKd.js";
+import { g as getLegalEntityNameBasedOnType, b as getPayoutAccountHolderName } from "./getName-DJlhsDj_.js";
+import { I as IFrameWidget, o as omitObscuredFieldsIfUnchanged } from "./iframeWidget-Bftkd3v_.js";
+import { Show } from "@preact/signals/utils";
+import { c as createFormUtils, F as FormHeader, E as ErrorPanel, m as mergeFieldMetadataIntoProps, g as getFieldProps, C as CountryField, f as getFormProps, d as summaryStep, s as summaryItem } from "./CountryField-D0YZrov9.js";
+import { a as addResourceBundles, _ as __variableDynamicImportRuntimeHelper, T as Trans } from "./translation-DJHWTow9.js";
+import { signal } from "@preact/signals";
+import { u as useAssociatedLegalEntity } from "./useAssociatedLegalEntity-G30FPhOX.js";
+import { b as useCapabilityProblems, g as getProblemsForEntity, T as TextArea, f as validatePatternOnBlur, r as resolveFieldMetadata, a as useAccountHolder, I as Image, R as RadioGroupCard, C as ContextGuidance } from "./fieldConfigurations-B8bDFQ53.js";
+import { c as createFormRules } from "./form-rules-DhbF2mY4.js";
+import { memo, lazy } from "preact/compat";
+import { u as useUnincorporatedPartnershipMembers } from "./useUnincorporatedPartnershipMembers-BCvmGMOX.js";
+import cx from "classnames";
+import { b as bankStatementDescriptionPattern } from "./basePatterns-BwdnMQxI.js";
+import { createContext } from "preact";
+import { a as Alert } from "./Alert-C24s_Ygs.js";
+import { A as ActionBar } from "./FormNavigation-ezxkIqdb.js";
+import OpenBankingSDK from "@adyen/openbankingsdk";
+import { m as makeMask, n as numericInputs, a as nonInputs, s as spacer, c as customInputs, M as MaskedInput, d as alphanumericInputs, b as alphaInputs } from "./MaskedInput-BZ7t98eu.js";
+import { a as isNotEmptyValidator } from "./commonValidators-Bk0SSjsH.js";
+import { C as Currencies } from "./currency-BGwQyxBo.js";
+import { L as Link } from "./Link-BFdxU8qh.js";
+const getCheck = async (legalEntityId, baseUrl, data) => {
+  return httpPost(
+    {
+      baseUrl,
+      path: `legalEntities/${legalEntityId}/checks/bankAccount`
+    },
+    data
+  );
+};
+const useCheck = (data, options) => {
+  const { rootLegalEntityId, baseUrl: url } = useApiContext();
+  return useQuery({
+    queryKey: ["checkAsAService", data],
+    queryFn: () => getCheck(rootLegalEntityId.value, url.value, data),
+    ...options
+  });
+};
+const getBankVerificationProviders = async (legalEntityId, baseUrl, queryParams) => {
+  const { country, locale, configId } = queryParams;
+  const providerParams = new URLSearchParams({
+    country,
+    locale,
+    ...configId && { configId }
+  });
+  return httpGet({
+    baseUrl,
+    path: `legalEntities/${legalEntityId}/transferInstruments/trusted/providers?${providerParams}`
+  });
+};
+const useBankVerificationProviders = (queryParams, options) => {
+  const { rootLegalEntityId, baseUrl } = useApiContext();
+  return useQuery({
+    queryKey: ["bankVerificationProviders", queryParams],
+    queryFn: () => getBankVerificationProviders(rootLegalEntityId.value, baseUrl.value, queryParams),
+    ...options
+  });
+};
+const createTransferInstrument = async (rootLegalEntityId, baseUrl, transferInstrument) => {
+  return httpPost(
+    {
+      baseUrl,
+      path: `legalEntities/${rootLegalEntityId}/transferInstruments`
+    },
+    transferInstrument
+  );
+};
+const createTrustedTransferInstrument = async (legalEntityId, baseUrl, data) => {
+  return httpPost(
+    {
+      baseUrl,
+      path: `legalEntities/${legalEntityId}/transferInstruments/trusted`
+    },
+    data
+  );
+};
+const useCreateTrustedTransferInstrument = (options) => {
+  const { rootLegalEntityId, baseUrl } = useApiContext();
+  return useMutation({
+    mutationFn: (data) => createTrustedTransferInstrument(rootLegalEntityId.value, baseUrl.value, data),
+    ...options
+  });
+};
+const updateTransferInstrument = async (legalEntityId, baseUrl, transferInstrument, transferInstrumentId) => {
+  return httpPost(
+    {
+      baseUrl,
+      path: `legalEntities/${legalEntityId}/transferInstruments/${transferInstrumentId}`
+    },
+    transferInstrument
+  );
+};
+const useUpdateTransferInstrument = (options) => {
+  const { rootLegalEntityId, baseUrl } = useApiContext();
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: ({ transferInstrument, transferInstrumentId }) => updateTransferInstrument(
+      rootLegalEntityId.value,
+      baseUrl.value,
+      transferInstrument,
+      transferInstrumentId
+    ),
+    onSuccess: async (transferInstrument) => {
+      queryClient.setQueryData(["transferInstrument", transferInstrument.id], transferInstrument);
+      await queryClient.invalidateQueries({
+        // Invalidate transfer instruments on root LE
+        queryKey: ["transferInstruments"]
+      });
+    },
+    ...options
+  });
+};
+const accountFormatsImports = /* @__PURE__ */ Object.assign({ "../accountFormats/AD.json": () => import("./AD-CyP5INSp.js"), "../accountFormats/AE.json": () => import("./AE-mIZ12t47.js"), "../accountFormats/AI.json": () => import("./AI-CYOqGKk2.js"), "../accountFormats/AL.json": () => import("./AL-BX1fEo1A.js"), "../accountFormats/AR.json": () => import("./AR-C9kMRnHG.js"), "../accountFormats/AS.json": () => import("./AS-B0TMZQ6o.js"), "../accountFormats/AT.json": () => import("./AT-DJLlevck.js"), "../accountFormats/AU.json": () => import("./AU-B5LSe4bo.js"), "../accountFormats/AX.json": () => import("./AX-Z6f6EnJc.js"), "../accountFormats/AZ.json": () => import("./AZ-BqrKjWMH.js"), "../accountFormats/BA.json": () => import("./BA-BbP72Tn6.js"), "../accountFormats/BE.json": () => import("./BE-B-m_4F41.js"), "../accountFormats/BG.json": () => import("./BG-BVR5ytc-.js"), "../accountFormats/BH.json": () => import("./BH-Ded1Eyrc.js"), "../accountFormats/BM.json": () => import("./BM-CBl-UQUl.js"), "../accountFormats/BR.json": () => import("./BR-DsY9PZVZ.js"), "../accountFormats/BS.json": () => import("./BS-dBfArxRw.js"), "../accountFormats/BV.json": () => import("./BV-D0QBsH7-.js"), "../accountFormats/BY.json": () => import("./BY-BsQUo3fM.js"), "../accountFormats/CA.json": () => import("./CA-DT4cmOOe.js"), "../accountFormats/CH.json": () => import("./CH-CesIKOYy.js"), "../accountFormats/CN.json": () => import("./CN-BV-5PSpq.js"), "../accountFormats/CR.json": () => import("./CR-Dtv-rXg9.js"), "../accountFormats/CY.json": () => import("./CY-BnJ7k_mN.js"), "../accountFormats/CZ.json": () => import("./CZ-BiPeoA9G.js"), "../accountFormats/DE.json": () => import("./DE-DdcbG-CC.js"), "../accountFormats/DK.json": () => import("./DK-DA8qRrzq.js"), "../accountFormats/DO.json": () => import("./DO-B1BWc3Iy.js"), "../accountFormats/EC.json": () => import("./EC-DbNXe71-.js"), "../accountFormats/EE.json": () => import("./EE-CaXoPgZz.js"), "../accountFormats/ES.json": () => import("./ES-Bt_oaIaf.js"), "../accountFormats/FI.json": () => import("./FI-C5V3lLuN.js"), "../accountFormats/FJ.json": () => import("./FJ-CBdbPf5l.js"), "../accountFormats/FO.json": () => import("./FO-1pD1p939.js"), "../accountFormats/FR.json": () => import("./FR-Bc1tLIC4.js"), "../accountFormats/GB.json": () => import("./GB-CCYHTagl.js"), "../accountFormats/GE.json": () => import("./GE-Deog1a3Z.js"), "../accountFormats/GF.json": () => import("./GF-Cda8N7A4.js"), "../accountFormats/GG.json": () => import("./GG-BGuqxplU.js"), "../accountFormats/GI.json": () => import("./GI-CROkpYrU.js"), "../accountFormats/GL.json": () => import("./GL-0vO9Of9c.js"), "../accountFormats/GP.json": () => import("./GP-za-3opp-.js"), "../accountFormats/GR.json": () => import("./GR-B9c2boG8.js"), "../accountFormats/GT.json": () => import("./GT-C1jhs-Dx.js"), "../accountFormats/GU.json": () => import("./GU-CALV5vh1.js"), "../accountFormats/HK.json": () => import("./HK-BB3PIq-Z.js"), "../accountFormats/HR.json": () => import("./HR-p4luVYpu.js"), "../accountFormats/HU.json": () => import("./HU-D8vJYkDH.js"), "../accountFormats/ID.json": () => import("./ID-BcOv4SXj.js"), "../accountFormats/IE.json": () => import("./IE-Cli_j7Al.js"), "../accountFormats/IL.json": () => import("./IL-CQ0yHRRe.js"), "../accountFormats/IM.json": () => import("./IM-mpIyBn16.js"), "../accountFormats/IN.json": () => import("./IN-BhEI9o7G.js"), "../accountFormats/IS.json": () => import("./IS-02zCAdvq.js"), "../accountFormats/IT.json": () => import("./IT-CzURFhrK.js"), "../accountFormats/JE.json": () => import("./JE-MFwIYti7.js"), "../accountFormats/JM.json": () => import("./JM-BMGgBK6y.js"), "../accountFormats/JO.json": () => import("./JO-rY8A8f9C.js"), "../accountFormats/JP.json": () => import("./JP-BQG5dF1Y.js"), "../accountFormats/KR.json": () => import("./KR-74SwXHka.js"), "../accountFormats/KW.json": () => import("./KW-CcVPOJ8B.js"), "../accountFormats/KY.json": () => import("./KY-DXCeltYA.js"), "../accountFormats/KZ.json": () => import("./KZ-CZNjdp22.js"), "../accountFormats/LB.json": () => import("./LB-DZ5YfAsO.js"), "../accountFormats/LI.json": () => import("./LI-DA06W10W.js"), "../accountFormats/LT.json": () => import("./LT-DuU6E2Ct.js"), "../accountFormats/LU.json": () => import("./LU-BQHhNpDy.js"), "../accountFormats/LV.json": () => import("./LV-DN7wckbP.js"), "../accountFormats/MC.json": () => import("./MC-DtSWC4jS.js"), "../accountFormats/MD.json": () => import("./MD-DVc0183a.js"), "../accountFormats/ME.json": () => import("./ME-DiJhSuli.js"), "../accountFormats/MK.json": () => import("./MK-BZxslBTS.js"), "../accountFormats/MP.json": () => import("./MP-7IpnbfCj.js"), "../accountFormats/MQ.json": () => import("./MQ-DusG_no1.js"), "../accountFormats/MR.json": () => import("./MR-DaBVNHqN.js"), "../accountFormats/MT.json": () => import("./MT-DeDMQ1f_.js"), "../accountFormats/MU.json": () => import("./MU-D3gGVu1R.js"), "../accountFormats/MX.json": () => import("./MX-CZVOFg3D.js"), "../accountFormats/MY.json": () => import("./MY-ym71svTa.js"), "../accountFormats/NC.json": () => import("./NC-xzMvjp9-.js"), "../accountFormats/NL.json": () => import("./NL-aVL0NAp-.js"), "../accountFormats/NO.json": () => import("./NO-D7EOiQA1.js"), "../accountFormats/NZ.json": () => import("./NZ-BP7_Q9Om.js"), "../accountFormats/PE.json": () => import("./PE-CdxgPh3v.js"), "../accountFormats/PF.json": () => import("./PF-CstaOd9Z.js"), "../accountFormats/PH.json": () => import("./PH-BYgMDYIH.js"), "../accountFormats/PK.json": () => import("./PK-bLhtgsEk.js"), "../accountFormats/PL.json": () => import("./PL-Bg7axKQA.js"), "../accountFormats/PM.json": () => import("./PM-BWbxAh4u.js"), "../accountFormats/PR.json": () => import("./PR-CFPKXEXp.js"), "../accountFormats/PS.json": () => import("./PS-B8obOOWY.js"), "../accountFormats/PT.json": () => import("./PT-hB1HnBM2.js"), "../accountFormats/QA.json": () => import("./QA-CSfx-mvb.js"), "../accountFormats/RE.json": () => import("./RE-BApq1FJ6.js"), "../accountFormats/RO.json": () => import("./RO-BLlC4CKq.js"), "../accountFormats/RS.json": () => import("./RS-BCenke-W.js"), "../accountFormats/RU.json": () => import("./RU-D27RC7dq.js"), "../accountFormats/SA.json": () => import("./SA-C9VgxCgm.js"), "../accountFormats/SE.json": () => import("./SE-q25Qt85B.js"), "../accountFormats/SG.json": () => import("./SG-DoCqjlFi.js"), "../accountFormats/SI.json": () => import("./SI-BzA-ozn6.js"), "../accountFormats/SJ.json": () => import("./SJ-Z9jwQQlz.js"), "../accountFormats/SK.json": () => import("./SK-DOTdLJPw.js"), "../accountFormats/SM.json": () => import("./SM-B4BIgmhk.js"), "../accountFormats/TF.json": () => import("./TF-BOWng-Dz.js"), "../accountFormats/TH.json": () => import("./TH-CvyXLcZK.js"), "../accountFormats/TL.json": () => import("./TL-BWslydRz.js"), "../accountFormats/TN.json": () => import("./TN-Cjd3bM_V.js"), "../accountFormats/TR.json": () => import("./TR-BBx5CuWS.js"), "../accountFormats/TT.json": () => import("./TT-D4-z5BA-.js"), "../accountFormats/TW.json": () => import("./TW-BC8YpnMr.js"), "../accountFormats/UA.json": () => import("./UA-DrXUnAe6.js"), "../accountFormats/US.json": () => import("./US-D8dI5_i1.js"), "../accountFormats/UY.json": () => import("./UY-DEHqLXhX.js"), "../accountFormats/VA.json": () => import("./VA-bPXdCnwD.js"), "../accountFormats/VG.json": () => import("./VG-DnKAVCsi.js"), "../accountFormats/VI.json": () => import("./VI-CU9MA9ux.js"), "../accountFormats/VN.json": () => import("./VN-CTSqsmB6.js"), "../accountFormats/WF.json": () => import("./WF-CwHbsjtJ.js"), "../accountFormats/YT.json": () => import("./YT-BCyAAbo7.js"), "../accountFormats/ZA.json": () => import("./ZA-NU7slima.js") });
+const getAccountFormatsForCountry = async (country) => {
+  const importForCountry = accountFormatsImports[`../accountFormats/${country}.json`];
+  if (!importForCountry) {
+    throw Error(`No account formats available for ${country}`);
+  }
+  return (await importForCountry()).default;
+};
+const validateAccountIdentification = async (baseUrl, data) => {
+  return httpPost(
+    {
+      baseUrl,
+      path: `validations/accountidentification`
+    },
+    {
+      accountIdentification: {
+        ...data
+      }
+    }
+  );
+};
+const useValidateAccountIdentification = (options) => {
+  const { baseUrl } = useApiContext();
+  return useMutation({
+    mutationFn: (data) => validateAccountIdentification(baseUrl.value, data),
+    ...options
+  });
+};
+const useAsyncAccountDetailsValidationRules = (payload, hasEmptyFields2, isAccountNumberMasked) => {
+  const [timeoutId, setTimeoutId] = useState(null);
+  const [accountValidationData, setAccountValidationData] = useState({
+    invalidFields: [],
+    valid: false
+  });
+  const { mutateAsync } = useValidateAccountIdentification();
+  useEffect(() => {
+    const fetchAccountDetails = async (accountIdentificationPayload) => {
+      try {
+        const accountIdentificationResponse = await mutateAsync(accountIdentificationPayload);
+        setAccountValidationData(accountIdentificationResponse);
+      } catch (error) {
+        console.error("Error fetching account details:", error);
+      }
+    };
+    if (payload && !hasEmptyFields2 && !isAccountNumberMasked) {
+      if (timeoutId !== null) {
+        clearTimeout(timeoutId);
+      }
+      setTimeoutId(
+        setTimeout(() => {
+          fetchAccountDetails(payload);
+          setTimeoutId(null);
+        }, 500)
+      );
+    }
+  }, [mutateAsync, hasEmptyFields2, payload]);
+  return accountValidationData;
+};
+const logger = createLogger();
+const getAccountIdentificationFromPayoutAccountSchema = (payoutAccount, bankCountry) => {
+  if ("iban" in payoutAccount && payoutAccount.iban)
+    return {
+      type: "iban",
+      iban: payoutAccount.iban
+    };
+  switch (bankCountry) {
+    case CountryCodes.Australia:
+      return {
+        type: "auLocal",
+        accountNumber: payoutAccount.bankAccountNumber,
+        bsbCode: payoutAccount.branchCode
+      };
+    case CountryCodes.Brazil:
+      return {
+        type: "brLocal",
+        accountNumber: payoutAccount.bankAccountNumber,
+        ispb: payoutAccount.bankCode,
+        bankCode: payoutAccount.bankName,
+        branchNumber: payoutAccount.branchCode
+      };
+    case CountryCodes.Canada:
+      return {
+        type: "caLocal",
+        accountNumber: payoutAccount.bankAccountNumber,
+        institutionNumber: payoutAccount.bankCode,
+        transitNumber: payoutAccount.branchCode
+      };
+    case CountryCodes.CzechRepublic:
+      return {
+        type: "czLocal",
+        accountNumber: payoutAccount.bankAccountNumber,
+        bankCode: payoutAccount.bankCode
+      };
+    case CountryCodes.Denmark:
+      return {
+        type: "dkLocal",
+        accountNumber: payoutAccount.bankAccountNumber,
+        bankCode: payoutAccount.bankCode
+      };
+    case CountryCodes.HongKong:
+      return {
+        type: "hkLocal",
+        accountNumber: payoutAccount.bankAccountNumber,
+        clearingCode: payoutAccount.bankCode
+      };
+    case CountryCodes.NewZealand:
+      return {
+        type: "nzLocal",
+        accountNumber: payoutAccount.bankAccountNumber?.replaceAll("-", "")
+      };
+    case CountryCodes.Sweden:
+      return {
+        type: "seLocal",
+        accountNumber: payoutAccount.bankAccountNumber,
+        clearingNumber: payoutAccount.branchCode
+      };
+    case CountryCodes.Singapore:
+      return {
+        type: "sgLocal",
+        accountNumber: payoutAccount.bankAccountNumber,
+        bic: payoutAccount.swiftCode
+      };
+    case CountryCodes.IsleOfMan:
+    case CountryCodes.Guernsey:
+    case CountryCodes.Gibraltar:
+    case CountryCodes.Jersey:
+    case CountryCodes.UnitedKingdom:
+      return {
+        type: "ukLocal",
+        // for some reason GB's account identification is called `ukLocalAccountIdentification`
+        accountNumber: payoutAccount.bankAccountNumber,
+        sortCode: payoutAccount.branchCode
+      };
+    case CountryCodes.NorthernMarianaIslands:
+    case CountryCodes.Guam:
+    case CountryCodes.VirginIslandsUS:
+    case CountryCodes.AmericanSamoa:
+    case CountryCodes.PuertoRico:
+    case CountryCodes.UnitedStates:
+      return {
+        type: "usLocal",
+        accountNumber: payoutAccount.bankAccountNumber,
+        routingNumber: payoutAccount.branchCode
+      };
+    default:
+      logger.log(`${bankCountry.toLowerCase()}Local is not a configured region`);
+      return {
+        type: `${bankCountry.toLowerCase()}Local`,
+        accountNumber: payoutAccount.bankAccountNumber
+      };
+  }
+};
+const mapPayoutAccountSchemaToApiBankAccount = (payoutAccount, bankCountry) => ({
+  accountIdentification: getAccountIdentificationFromPayoutAccountSchema(
+    payoutAccount,
+    bankCountry
+  ),
+  countryCode: bankCountry,
+  bankName: payoutAccount.bankName
+});
+const showPayoutVerificationMethodError = signal(false);
+function PayoutDetailsPage({
+  transferInstrumentId,
+  setTransferInstrumentId,
+  taskType,
+  openBankingPartnerConfigId,
+  onSubmit,
+  handleHomeClick
+}) {
+  const { i18n } = useTranslation();
+  const { data: rootLe } = useLegalEntity(ROOT_LE);
+  const { data: associatedLe, isLoading: associatedLeIsLoading } = useAssociatedLegalEntity(
+    rootLe,
+    [
+      LegalEntityTypes.SOLE_PROPRIETORSHIP,
+      LegalEntityTypes.TRUST,
+      LegalEntityTypes.UNINCORPORATED_PARTNERSHIP
+    ]
+  );
+  const capabilityProblems = useCapabilityProblems();
+  addResourceBundles(i18n, i18n.language, [
+    { ns: "banking", importFn: () => __variableDynamicImportRuntimeHelper(/* @__PURE__ */ Object.assign({ "../language/da-DK.json": () => import("./da-DK-q2b_1elr.js"), "../language/de-DE.json": () => import("./de-DE-D2ByeIZs.js"), "../language/en-US.json": () => import("./en-US-BQpgt41j.js"), "../language/es-ES.json": () => import("./es-ES-WWftn3JX.js"), "../language/fi-FI.json": () => import("./fi-FI-D9E_KaJi.js"), "../language/fr-FR.json": () => import("./fr-FR-Cv0k-3Xc.js"), "../language/it-IT.json": () => import("./it-IT-C_fNHhjE.js"), "../language/nl-NL.json": () => import("./nl-NL-DLedC3mO.js"), "../language/no-NO.json": () => import("./no-NO-CpVal4cV.js"), "../language/pt-PT.json": () => import("./pt-PT-BkvMsoK4.js"), "../language/sl-SI.json": () => import("./sl-SI-Cth2Qa5T.js"), "../language/sv-SE.json": () => import("./sv-SE-OPOHtqtP.js") }), `../language/${i18n.language}.json`, 3) }
+  ]);
+  if (!rootLe || associatedLeIsLoading) {
+    return /* @__PURE__ */ jsx(Loader, {});
+  }
+  const problems = capabilityProblems && transferInstrumentId ? getProblemsForEntity(capabilityProblems, EntityTypes.BANK_ACCOUNT, transferInstrumentId) : void 0;
+  return /* @__PURE__ */ jsx(
+    PayoutDetailsDropin,
+    {
+      taskType,
+      currentTransferInstrumentId: transferInstrumentId,
+      setCurrentTransferInstrumentId: setTransferInstrumentId,
+      legalEntityResponse: rootLe,
+      associatedLegalArrangement: associatedLe,
+      problems,
+      onSubmit,
+      handleHomeClick,
+      navigateBackToTaskList: handleHomeClick,
+      openBankingPartnerConfigId
+    }
+  );
+}
+const PayoutDetailsPage$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  PayoutDetailsPage,
+  showPayoutVerificationMethodError
+}, Symbol.toStringTag, { value: "Module" }));
+function FilePicker({
+  files,
+  setFiles,
+  isValid,
+  errorMessage,
+  multiple = false,
+  label,
+  name,
+  iconPrefix = "generic-document",
+  enableTracking = false,
+  id,
+  // file validation options
+  allowedFileTypes,
+  maxSize,
+  isOptional,
+  maxNumberOfFiles,
+  // a11y
+  "aria-describedby": ariaDescribedBy,
+  "aria-labelledby": ariaLabelledBy
+}) {
+  const { t } = useTranslation("common");
+  const userEvents = useAnalyticsContext();
+  const fileInput = useRef(null);
+  const [dragged, setDragged] = useState(false);
+  const hasRequiredError = errorMessage === "fieldIsRequired";
+  const showDropzone = files.length < maxNumberOfFiles;
+  const openFilePicker = () => fileInput.current?.click();
+  const handleFileDelete = (fileToDelete) => setFiles(files.filter((file) => file !== fileToDelete));
+  const handleDragEnter = (e) => {
+    e.preventDefault();
+    e.stopPropagation();
+  };
+  const handleDragLeave = (e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    setDragged(false);
+  };
+  const handleDragOver = (e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    setDragged(true);
+  };
+  const handleDrop = (e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    if (e.dataTransfer) addFiles(e.dataTransfer.files);
+    setDragged(false);
+  };
+  const handleFilesChosen = (e) => {
+    const fileInput2 = e.target;
+    if (fileInput2.files) addFiles(fileInput2.files);
+  };
+  const addFiles = (newFiles) => {
+    if (enableTracking) {
+      userEvents.addFieldEvent("Interacted with form field", {
+        actionType: "change",
+        field: name || "dropzone"
+      });
+    }
+    setFiles([...newFiles, ...files]);
+  };
+  const allowedFileTypesString = allowedFileTypes.join(", ");
+  return /* @__PURE__ */ jsxs("div", { children: [
+    label && /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: cx("adyen-kyc-label__text", {
+          "adyen-kyc-label__text--error": hasRequiredError
+        }),
+        children: label
+      }
+    ),
+    files.map((file) => /* @__PURE__ */ jsx(
+      DropzoneFile,
+      {
+        file,
+        onDelete: () => handleFileDelete(file),
+        errorMessage,
+        iconPrefix
+      },
+      file
+    )),
+    showDropzone && /* @__PURE__ */ jsxs(
+      "div",
+      {
+        role: "region",
+        className: cx("adyen-kyc-dropzone", {
+          "adyen-kyc-dropzone--dragged": dragged,
+          "adyen-kyc-dropzone--error": !dragged && hasRequiredError
+        }),
+        onDrop: handleDrop,
+        onDragOver: handleDragOver,
+        onDragEnter: handleDragEnter,
+        onDragLeave: handleDragLeave,
+        children: [
+          /* @__PURE__ */ jsx("div", { className: "adyen-kyc-dropzone__icon", children: /* @__PURE__ */ jsx(Icon, { name: "upload" }) }),
+          /* @__PURE__ */ jsxs("div", { className: "adyen-kyc-dropzone__labels", children: [
+            /* @__PURE__ */ jsx(Typography, { el: "h4", variant: "body-strongest", children: t(($) => $["dropFileToUpload"]) }),
+            /* @__PURE__ */ jsx(Typography, { color: "secondary", children: t(($) => $["supportedFileTypes"], { fileTypes: allowedFileTypesString }) }),
+            /* @__PURE__ */ jsx(Typography, { color: "secondary", children: t(($) => $["maxFileSize"], { maxSize: bytesToSize(maxSize) }) }),
+            /* @__PURE__ */ jsx(Typography, { color: "secondary", children: t(($) => $["upToFiles"], { maxFiles: maxNumberOfFiles }) })
+          ] }),
+          /* @__PURE__ */ jsx("div", { className: "adyen-kyc-dropzone__button", children: /* @__PURE__ */ jsx(Button, { onClick: openFilePicker, variant: "secondary", children: t(($) => $["browseFiles"]) }) }),
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              id,
+              className: "adyen-kyc-dropzone__input",
+              ref: fileInput,
+              multiple,
+              accept: allowedFileTypesString,
+              onChange: handleFilesChosen,
+              type: "file",
+              "aria-required": !isOptional,
+              "aria-describedby": ariaDescribedBy,
+              "aria-labelledby": ariaLabelledBy,
+              "data-testid": "hidden-file-input",
+              "aria-invalid": !isValid
+            }
+          )
+        ]
+      }
+    ),
+    hasRequiredError && /* @__PURE__ */ jsx("div", { className: "adyen-kyc-error-text", children: t(($) => $["fieldIsRequired"]) })
+  ] });
+}
+const bankDocument = "adyen-kyc-bank-document";
+const styles$2 = {
+  bankDocument
+};
+const documentRequirements = "adyen-kyc-document-requirements";
+const documentRequirementsSubtitle = "adyen-kyc-document-requirements-subtitle";
+const styles$1 = {
+  documentRequirements,
+  documentRequirementsSubtitle
+};
+const BankDocumentTypes = {
+  BANK_STATEMENT: "bankStatement",
+  DEPOSIT_SLIP: "depositSlip",
+  SCREENSHOT_OF_BANK: "screenshotOfOnlineBankingEnviroment",
+  A_LETTER_FROM_YOUR_BANK: "aLetterFromYourBank",
+  CHECK: "check"
+};
+const bankDocumentOptions = [
+  { id: BankDocumentTypes.BANK_STATEMENT, name: "bankStatementDocument" },
+  { id: BankDocumentTypes.DEPOSIT_SLIP, name: "depositSlip" },
+  { id: BankDocumentTypes.SCREENSHOT_OF_BANK, name: "screenshotOfOnlineBankingEnviroment" },
+  { id: BankDocumentTypes.A_LETTER_FROM_YOUR_BANK, name: "aLetterFromYourBank" },
+  { id: BankDocumentTypes.CHECK, name: "check" }
+];
+const BankDocumentRequirement = {
+  ACCOUNT_NAME_INDIVIDUAL: "bankAccountNameIndividual",
+  ACCOUNT_NAME_ORGANIZATION: "bankAccountNameOrganization",
+  ACCOUNT_NAME_WITH_SOLE_PROP: "bankAccountNameWithSoleProprietor",
+  ACCOUNT_NAME_WITH_TRUST: "bankAccountNameWithTrust",
+  ACCOUNT_NAME_WITH_UNINCORPORATED_PARTNERSHIP: "accountMustBeInTheNameOfUnincorporatedPartnership",
+  ACCOUNT_NUMBER_OR_IBAN: "accountNumberOrIbanVisible",
+  ACCOUNT_NUMBER: "accountNumberVisible",
+  ACCOUNT_NUMBER_FULL_OR_PARTIAL: "accountNumberFullOrPartialVisible",
+  DATE_ON_DOCUMENT: "datedInTheLastXMonths",
+  COUNTRY_OF_BANK: "showsCountryOfBankAccount",
+  OFFICIAL_DOCUMENT: "hasToBeOfficialDocumentFromBank",
+  STAMP_OR_SIGNATURE: "hasBankStampOrBankSignature",
+  HIGH_RESOLUTION_CHECK: "highResolutionCheck"
+};
+const accountNameRequirement = {
+  [LegalEntityTypes.INDIVIDUAL]: {
+    default: BankDocumentRequirement.ACCOUNT_NAME_INDIVIDUAL
+  },
+  [LegalEntityTypes.ORGANIZATION]: {
+    default: BankDocumentRequirement.ACCOUNT_NAME_ORGANIZATION
+  }
+};
+const accountNameRequirementWithLegalArrangement = {
+  [LegalEntityTypes.INDIVIDUAL]: {
+    [LegalEntityTypes.SOLE_PROPRIETORSHIP]: {
+      default: BankDocumentRequirement.ACCOUNT_NAME_WITH_SOLE_PROP
+    },
+    [LegalEntityTypes.TRUST]: {
+      [CountryCodes.UnitedStates]: "bankAccountNameWithTrust_US",
+      default: BankDocumentRequirement.ACCOUNT_NAME_WITH_TRUST
+    },
+    [LegalEntityTypes.UNINCORPORATED_PARTNERSHIP]: {
+      default: BankDocumentRequirement.ACCOUNT_NAME_WITH_UNINCORPORATED_PARTNERSHIP
+    }
+  },
+  [LegalEntityTypes.ORGANIZATION]: {
+    [LegalEntityTypes.TRUST]: {
+      [CountryCodes.UnitedStates]: "bankAccountNameWithTrust_US",
+      default: BankDocumentRequirement.ACCOUNT_NAME_WITH_TRUST
+    },
+    [LegalEntityTypes.UNINCORPORATED_PARTNERSHIP]: {
+      default: BankDocumentRequirement.ACCOUNT_NAME_WITH_UNINCORPORATED_PARTNERSHIP
+    }
+  }
+};
+const applyNamedModifiers = (country, documentModifiers) => {
+  if (!documentModifiers.associatedEntityType || !documentModifiers.associatedEntityLegalName) {
+    switch (documentModifiers.rootEntityType) {
+      case LegalEntityTypes.INDIVIDUAL:
+        return {
+          key: accountNameRequirement[LegalEntityTypes.INDIVIDUAL].default,
+          options: { values: { individualLegalName: documentModifiers.rootEntityLegalName } }
+        };
+      case LegalEntityTypes.ORGANIZATION:
+      default:
+        return {
+          key: accountNameRequirement[LegalEntityTypes.ORGANIZATION].default,
+          options: { values: { companyLegalName: documentModifiers.rootEntityLegalName } }
+        };
+    }
+  }
+  switch (documentModifiers.rootEntityType) {
+    case LegalEntityTypes.INDIVIDUAL:
+      switch (documentModifiers.associatedEntityType) {
+        case LegalEntityTypes.TRUST:
+          return {
+            key: accountNameRequirementWithLegalArrangement[LegalEntityTypes.INDIVIDUAL][LegalEntityTypes.TRUST]?.[country] ?? accountNameRequirementWithLegalArrangement[LegalEntityTypes.INDIVIDUAL][LegalEntityTypes.TRUST]?.default,
+            options: {
+              values: {
+                trusteeName: documentModifiers.rootEntityLegalName,
+                trustLegalName: documentModifiers.associatedEntityLegalName,
+                trustTradingName: documentModifiers.associatedEntityTradingName ?? documentModifiers.associatedEntityLegalName
+              }
+            }
+          };
+        case LegalEntityTypes.UNINCORPORATED_PARTNERSHIP:
+          return {
+            key: accountNameRequirementWithLegalArrangement[LegalEntityTypes.INDIVIDUAL][LegalEntityTypes.UNINCORPORATED_PARTNERSHIP]?.[country] ?? accountNameRequirementWithLegalArrangement[LegalEntityTypes.INDIVIDUAL][LegalEntityTypes.UNINCORPORATED_PARTNERSHIP]?.default,
+            options: {
+              values: {
+                partnerNames: documentModifiers.unincorporatedPartnershipMembers || "",
+                partnershipName: documentModifiers.associatedEntityLegalName
+              }
+            }
+          };
+        case LegalEntityTypes.SOLE_PROPRIETORSHIP:
+        default:
+          return {
+            key: accountNameRequirementWithLegalArrangement[LegalEntityTypes.INDIVIDUAL][LegalEntityTypes.SOLE_PROPRIETORSHIP]?.default,
+            options: {
+              values: {
+                individualLegalName: documentModifiers.rootEntityLegalName,
+                soleProprietorshipName: documentModifiers.associatedEntityLegalName
+              }
+            }
+          };
+      }
+    case LegalEntityTypes.ORGANIZATION:
+    default:
+      switch (documentModifiers.associatedEntityType) {
+        case LegalEntityTypes.TRUST:
+          return {
+            key: accountNameRequirementWithLegalArrangement[LegalEntityTypes.ORGANIZATION][LegalEntityTypes.TRUST]?.[country] ?? accountNameRequirementWithLegalArrangement[LegalEntityTypes.ORGANIZATION][LegalEntityTypes.TRUST]?.default,
+            options: {
+              values: {
+                trusteeName: documentModifiers.rootEntityLegalName,
+                trustLegalName: documentModifiers.associatedEntityLegalName,
+                trustTradingName: documentModifiers.associatedEntityTradingName ?? documentModifiers.associatedEntityLegalName
+              }
+            }
+          };
+        case LegalEntityTypes.UNINCORPORATED_PARTNERSHIP:
+          return {
+            key: accountNameRequirementWithLegalArrangement[LegalEntityTypes.ORGANIZATION][LegalEntityTypes.UNINCORPORATED_PARTNERSHIP]?.[country] ?? accountNameRequirementWithLegalArrangement[LegalEntityTypes.ORGANIZATION][LegalEntityTypes.UNINCORPORATED_PARTNERSHIP]?.default,
+            options: {
+              values: {
+                partnerNames: documentModifiers.unincorporatedPartnershipMembers || "",
+                partnershipName: documentModifiers.associatedEntityLegalName
+              }
+            }
+          };
+        default:
+          return { key: accountNameRequirement[LegalEntityTypes.ORGANIZATION].default };
+      }
+  }
+};
+const getBankDocumentRequirements = (country, documentType, documentModifiers) => {
+  const isBasedInUS = country === "US";
+  const baseRequirements = isBasedInUS ? [{ key: BankDocumentRequirement.OFFICIAL_DOCUMENT }] : [
+    { key: BankDocumentRequirement.OFFICIAL_DOCUMENT },
+    { key: BankDocumentRequirement.COUNTRY_OF_BANK }
+  ];
+  const accountNumberRequirement = isBasedInUS ? documentType === BankDocumentTypes.CHECK || documentType === BankDocumentTypes.DEPOSIT_SLIP ? [{ key: BankDocumentRequirement.ACCOUNT_NUMBER }] : [{ key: BankDocumentRequirement.ACCOUNT_NUMBER_FULL_OR_PARTIAL }] : [{ key: BankDocumentRequirement.ACCOUNT_NUMBER_OR_IBAN }];
+  const requireLast12Months = isBasedInUS ? documentType === BankDocumentTypes.A_LETTER_FROM_YOUR_BANK || documentType === BankDocumentTypes.BANK_STATEMENT : documentType !== BankDocumentTypes.SCREENSHOT_OF_BANK;
+  const requireStampOrSignature = !isBasedInUS && (documentType === BankDocumentTypes.DEPOSIT_SLIP || documentType === BankDocumentTypes.A_LETTER_FROM_YOUR_BANK);
+  const requirements = [
+    applyNamedModifiers(country, documentModifiers),
+    ...accountNumberRequirement,
+    ...baseRequirements
+  ];
+  if (requireLast12Months) {
+    requirements.push({
+      key: BankDocumentRequirement.DATE_ON_DOCUMENT,
+      options: { values: { number: 12 } }
+    });
+  }
+  if (requireStampOrSignature) {
+    requirements.push({ key: BankDocumentRequirement.STAMP_OR_SIGNATURE });
+  }
+  if (isBasedInUS && documentType === BankDocumentTypes.CHECK) {
+    requirements.push({ key: BankDocumentRequirement.HIGH_RESOLUTION_CHECK });
+  }
+  return requirements;
+};
+const BankDocumentRequirements = ({
+  country,
+  documentType,
+  documentModifiers
+}) => {
+  const { i18n } = useI18nContext();
+  const documentRequirements2 = getBankDocumentRequirements(
+    country,
+    documentType,
+    documentModifiers
+  );
+  return /* @__PURE__ */ jsxs("div", { className: styles$1.documentRequirements, children: [
+    /* @__PURE__ */ jsx("strong", { className: styles$1.documentRequirementsSubtitle, children: i18n.get("documentRequirements") }),
+    /* @__PURE__ */ jsx("ul", { children: documentRequirements2.map(({ key, options }, i) => /* @__PURE__ */ jsx("li", { "data-testid": key, children: i18n.get(key, options) }, i)) })
+  ] });
+};
+const bankDocumentValidationRules = {
+  description: {
+    modes: ["blur"],
+    validate: (description) => description ? bankStatementDescriptionPattern.test(description) : true,
+    errorMessage: "invalidFormatBankStatementDescription"
+  }
+};
+const CHARACTERS_LIMIT = 200;
+const bankDocumentFields = [
+  "documentType",
+  "bankStatementDocument",
+  "description"
+];
+function BankDocument(props) {
+  const {
+    legalEntity,
+    associatedLegalArrangement,
+    country,
+    optionalFields,
+    validators,
+    data: bankData,
+    id,
+    description,
+    heading,
+    formIsActive,
+    fieldValidationErrors,
+    shouldValidate
+  } = props;
+  const { t } = useTranslation("common");
+  const stateRef = useRef({ setState: null });
+  const isBankStatementOptional = optionalFields?.includes("bankStatementDocument") ?? false;
+  const formUtils = createFormUtils(props, t);
+  const bankStatementValidationOptions = useMemo(
+    () => ({
+      ...defaultFileValidationOptions,
+      isOptional: isBankStatementOptional
+    }),
+    [isBankStatementOptional]
+  );
+  const rules2 = useMemo(
+    () => ({
+      ...validators || bankDocumentValidationRules,
+      bankStatementDocument: fileValidationRules(bankStatementValidationOptions)
+    }),
+    [bankStatementValidationOptions, validators]
+  );
+  const { handleChangeFor, data, setData, valid, fieldProblems, errors, triggerValidation } = useForm({
+    ...props,
+    schema: bankDocumentFields,
+    defaultData: bankData,
+    rules: rules2,
+    fieldProblems: fieldValidationErrors,
+    shouldValidate
+  });
+  useEffect(() => {
+    if (formIsActive) {
+      triggerValidation();
+    }
+  }, [formIsActive, triggerValidation]);
+  const alreadyUploadedDocuments = useMemo(
+    () => bankData?.bankStatementDocument ?? [],
+    [bankData?.bankStatementDocument]
+  );
+  const hasAlreadyUploadedDocuments = alreadyUploadedDocuments.length > 0;
+  const usingExistingUploadedDocuments = data.bankStatementDocument && doArraysMatch(alreadyUploadedDocuments, data.bankStatementDocument);
+  useEffect(() => {
+    if (hasAlreadyUploadedDocuments) {
+      setData("bankStatementDocument", alreadyUploadedDocuments);
+      if (bankData?.description) setData("description", bankData.description);
+      triggerValidation();
+    }
+  }, [
+    alreadyUploadedDocuments,
+    hasAlreadyUploadedDocuments,
+    bankData?.description,
+    setData,
+    triggerValidation
+  ]);
+  useEffect(() => {
+    stateRef.current?.setState?.({
+      type: "addToState",
+      value: {
+        data,
+        valid,
+        errors,
+        fieldProblems,
+        dataStoreId: id,
+        schema: bankDocumentFields
+      }
+    });
+  }, [data, valid, errors, fieldProblems, id]);
+  const getBankDocumentOptions = () => bankDocumentOptions.map(({ id: id2, name }) => ({ id: id2, name: t(($) => $[name]) }));
+  const unincorporatedPartnershipMembers = useUnincorporatedPartnershipMembers();
+  const documentsModifiers = useMemo(
+    () => ({
+      rootEntityType: legalEntity.type,
+      rootEntityLegalName: getLegalEntityNameBasedOnType(legalEntity),
+      associatedEntityType: associatedLegalArrangement?.type,
+      associatedEntityLegalName: associatedLegalArrangement?.[associatedLegalArrangement?.type]?.name,
+      associatedEntityTradingName: associatedLegalArrangement?.[associatedLegalArrangement?.type]?.doingBusinessAs,
+      unincorporatedPartnershipMembers: unincorporatedPartnershipMembers?.map((member) => member?.name)?.join(", ")
+    }),
+    [legalEntity, associatedLegalArrangement, unincorporatedPartnershipMembers]
+  );
+  return /* @__PURE__ */ jsxs("form", { className: styles$2.bankDocument, children: [
+    /* @__PURE__ */ jsx(StateContextSetter, { owner: id, stateRef }),
+    /* @__PURE__ */ jsx(FormHeader, { heading, description }),
+    /* @__PURE__ */ jsx(
+      ErrorPanel,
+      {
+        verificationErrors: props?.formVerificationErrors,
+        validationErrors: props?.fieldValidationErrors,
+        formUtils,
+        id: "ariaErrorField"
+      }
+    ),
+    formUtils.isVisibleField("bankStatementDocument") && /* @__PURE__ */ jsxs(Fragment, { children: [
+      !usingExistingUploadedDocuments && /* @__PURE__ */ jsx(
+        Field,
+        {
+          name: "documentType",
+          label: formUtils.getLabel("bankStatementDocument", "selectDocumentType"),
+          className: "adyen-kyc-bank-document__document-type",
+          children: (childProps) => /* @__PURE__ */ jsx(
+            Select,
+            {
+              ...childProps,
+              onChange: handleChangeFor("documentType"),
+              name: "documentType",
+              placeholder: t(($) => $["selectDocument"]),
+              isInvalid: false,
+              items: getBankDocumentOptions(),
+              selected: data.documentType
+            }
+          )
+        }
+      ),
+      data.documentType ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        country ? /* @__PURE__ */ jsx(
+          BankDocumentRequirements,
+          {
+            country,
+            documentType: data.documentType,
+            documentModifiers: documentsModifiers
+          }
+        ) : void 0,
+        /* @__PURE__ */ jsx(DocumentGuidance, { type: "bankStatement", className: "adyen-kyc-u-margin-y-24" })
+      ] }) : null,
+      data.documentType || usingExistingUploadedDocuments ? /* @__PURE__ */ jsx(
+        Field,
+        {
+          className: "adyen-kyc-bank-document__document-upload adyen-kyc-upload-field",
+          name: "bankStatementDocument",
+          isValid: valid.bankStatementDocument,
+          children: (childProps) => /* @__PURE__ */ jsx(
+            FilePicker,
+            {
+              ...childProps,
+              name: "bankStatementDocument",
+              files: data.bankStatementDocument ?? [],
+              setFiles: handleChangeFor("bankStatementDocument"),
+              isValid: valid.bankStatementDocument ?? isBankStatementOptional,
+              errorMessage: errors.bankStatementDocument?.errorMessage,
+              ...bankStatementValidationOptions
+            }
+          )
+        }
+      ) : null
+    ] }),
+    data.documentType || usingExistingUploadedDocuments ? /* @__PURE__ */ jsx(
+      Field,
+      {
+        className: "adyen-kyc-bank-document__document-description",
+        name: "description",
+        label: formUtils.getLabel("bankDocumentFileDescription"),
+        errorMessage: formUtils.getErrorMessage("description", errors, fieldProblems),
+        isValid: valid.description,
+        children: (childProps) => /* @__PURE__ */ jsx(
+          TextArea,
+          {
+            ...childProps,
+            name: "description",
+            value: data.description,
+            maxLength: CHARACTERS_LIMIT,
+            onInput: handleChangeFor("description"),
+            "aria-invalid": !valid.description
+          }
+        )
+      }
+    ) : null
+  ] });
+}
+const MemoizedBankDocument = memo(
+  BankDocument,
+  (prevProps, nextProps) => objectsDeepEqual(prevProps.requiredFields, nextProps.requiredFields) && objectsDeepEqual(prevProps.optionalFields, nextProps.optionalFields) && objectsDeepEqual(prevProps.data, nextProps.data) && objectsDeepEqual(prevProps.formVerificationErrors, nextProps.formVerificationErrors) && objectsDeepEqual(prevProps.fieldValidationErrors, nextProps.fieldValidationErrors) && prevProps.country === nextProps.country && prevProps.shouldValidate === nextProps.shouldValidate && prevProps.heading === nextProps.heading && prevProps.formIsActive === nextProps.formIsActive
+);
+const bankVerificationValidationRules = {
+  verifiedAccountHolder: {
+    modes: ["blur"],
+    validate: (verifiedAccountHolder) => !isEmpty(verifiedAccountHolder),
+    errorMessage: "fieldIsRequired"
+  },
+  verifiedBankCountry: {
+    modes: ["blur"],
+    validate: (verifiedBankCountry) => !isEmpty(verifiedBankCountry),
+    errorMessage: "fieldIsRequired"
+  },
+  verifiedBankName: {
+    modes: ["blur"],
+    validate: (verifiedBankName) => !isEmpty(verifiedBankName),
+    errorMessage: "fieldIsRequired"
+  },
+  verifiedCurrencyCode: {
+    modes: ["blur"],
+    validate: (verifiedCurrencyCode) => !isEmpty(verifiedCurrencyCode),
+    errorMessage: "fieldIsRequired"
+  },
+  verifiedBankAccountNumber: {
+    modes: ["blur"],
+    validate: (verifiedBankAccountNumber) => !isEmpty(verifiedBankAccountNumber),
+    errorMessage: "fieldIsRequired"
+  }
+};
+const handleBankVerificationError = async (legalEntityId, baseUrl, bankVerificationErrorParams) => {
+  return httpPost(
+    {
+      baseUrl,
+      path: `legalEntities/${legalEntityId}/transferInstruments/trusted/error`
+    },
+    bankVerificationErrorParams
+  );
+};
+const useHandleBankVerificationError = (options) => {
+  const { rootLegalEntityId, baseUrl } = useApiContext();
+  return useMutation({
+    mutationFn: (params) => handleBankVerificationError(rootLegalEntityId.value, baseUrl.value, params),
+    ...options
+  });
+};
+const addAnimationStartListener = (element, listener) => {
+  element.addEventListener("animationstart", listener, false);
+};
+const removeAnimationStartListener = (element, listener) => {
+  element.removeEventListener("animationstart", listener, false);
+};
+const VerificationWidgetCallbackActions = {
+  HANDLE_EXCEPTION: "handle_exception",
+  VERIFICATION_SUCCESS: "verification_success",
+  RETRY_VERIFICATION: "retry_verification",
+  HANDLE_EVENT: "handle_event"
+};
+const WIDGET_IFRAME_CLASS = "adyen-kyc-bank-verification-widget";
+const WIDGET_CONTAINER_CLASS = `${WIDGET_IFRAME_CLASS}-container`;
+const EMPTY_WIDGET_CONTAINER_ANIMATION = "adyen-kyc-empty-bank-verification-widget-container";
+function BankVerificationWidget({
+  url,
+  vendor,
+  setBankVerificationError,
+  setHideVerificationWidget,
+  onBack,
+  retrieveBankAccountInfo,
+  createTrustedTransferInstrument: createTrustedTransferInstrument2,
+  fullscreen
+}) {
+  const { i18n } = useI18nContext();
+  const userEvents = useAnalyticsContext();
+  const widgetContainerRef = useRef(null);
+  const sdkToken = getSdkToken();
+  const { mutateAsync: handleBankVerificationError2 } = useHandleBankVerificationError();
+  const trackVerificationError = (returnValue) => {
+    userEvents.addPageEvent("Encountered error", {
+      actionType: "add",
+      returnType: "sdk error",
+      returnValue
+    });
+  };
+  const DEFAULT_ERROR = {
+    error: "UNKNOWN_ERROR",
+    message: i18n.get("weCouldntCompleteTheAccountCheck")
+  };
+  setBankVerificationError(null);
+  const widgetCallback = useCallback(
+    (payload) => {
+      const errorContent = i18n.get("tryAgainOrManualAccountDetails");
+      switch (payload.action) {
+        case VerificationWidgetCallbackActions.HANDLE_EXCEPTION: {
+          let errorTitle;
+          const { err } = payload;
+          switch (!(err instanceof Error) && err?.error) {
+            case "USER_CANCELLED":
+              errorTitle = "";
+              break;
+            case "CONNECTION_ERROR":
+              errorTitle = i18n.get("couldNotEstablishBankConnection");
+              break;
+            case "GENERIC_ERROR":
+              errorTitle = i18n.get("ranIntoTechnicalError");
+              break;
+            case "UNKNOWN_ERROR":
+            default: {
+              errorTitle = i18n.get("couldNotCompleteAccountCheck");
+              break;
+            }
+          }
+          if (errorTitle) {
+            setBankVerificationError({ title: errorTitle, content: errorContent });
+          }
+          setHideVerificationWidget(true);
+          onBack?.();
+          break;
+        }
+        case VerificationWidgetCallbackActions.RETRY_VERIFICATION:
+          setBankVerificationError({
+            title: i18n.get("failedInitializeInstantVerification"),
+            content: errorContent
+          });
+          setHideVerificationWidget(true);
+          onBack?.();
+          break;
+        case VerificationWidgetCallbackActions.HANDLE_EVENT: {
+          const { name, provider } = payload.event;
+          if (name === "institution_selected" && provider === "plaid") {
+            widgetContainerRef.current?.classList.add(`${WIDGET_CONTAINER_CLASS}--plaid-modal`);
+          }
+          break;
+        }
+        case VerificationWidgetCallbackActions.VERIFICATION_SUCCESS: {
+          const { accounts } = payload.result;
+          if (accounts) retrieveBankAccountInfo(accounts[0]);
+          setHideVerificationWidget(true);
+        }
+      }
+    },
+    [i18n, retrieveBankAccountInfo, onBack, setBankVerificationError, setHideVerificationWidget]
+  );
+  useEffect(
+    () => {
+      const container = widgetContainerRef.current;
+      if (!container) {
+        return;
+      }
+      let iFrame;
+      let iFrameWidget;
+      let openBanking;
+      addAnimationStartListener(container, function refreshWidgetIframe(evt) {
+        if (evt.animationName !== EMPTY_WIDGET_CONTAINER_ANIMATION) return;
+        requestAnimationFrame(async () => {
+          if (createTrustedTransferInstrument2) {
+            openBanking = OpenBankingSDK.create({
+              divElement: container,
+              link: url,
+              successHandler: (code, state) => {
+                createTrustedTransferInstrument2(code, state).then((res) => {
+                  userEvents.addPageEvent("Success", { actionType: "add" });
+                  if (res) {
+                    widgetCallback({
+                      action: VerificationWidgetCallbackActions.VERIFICATION_SUCCESS,
+                      result: res
+                    });
+                  }
+                }).catch(() => {
+                  trackVerificationError(DEFAULT_ERROR.error);
+                  widgetCallback({
+                    action: VerificationWidgetCallbackActions.HANDLE_EXCEPTION,
+                    err: DEFAULT_ERROR
+                  });
+                });
+              },
+              errorHandler: (errorCode, errorMessage, state, metadata) => {
+                trackVerificationError(errorCode);
+                handleBankVerificationError2?.({
+                  errorCode,
+                  errorMessage,
+                  state,
+                  metadata: metadata && Object.fromEntries(metadata)
+                }).then(
+                  (error) => widgetCallback({
+                    action: VerificationWidgetCallbackActions.HANDLE_EXCEPTION,
+                    err: error
+                  })
+                ).catch(
+                  () => widgetCallback({
+                    action: VerificationWidgetCallbackActions.HANDLE_EXCEPTION,
+                    err: DEFAULT_ERROR
+                  })
+                );
+              },
+              eventHandler: (eventName, provider) => {
+                widgetCallback({
+                  action: VerificationWidgetCallbackActions.HANDLE_EVENT,
+                  event: { name: eventName, provider }
+                });
+              }
+            });
+            openBanking.open();
+          } else {
+            removeAnimationStartListener(container, refreshWidgetIframe);
+            iFrame = document.createElement("iframe");
+            iFrame.setAttribute("allowFullscreen", "true");
+            iFrame.classList.add(WIDGET_IFRAME_CLASS);
+            evt.target.appendChild(iFrame);
+            requestAnimationFrame(async () => {
+              try {
+                iFrameWidget = new IFrameWidget(iFrame, url, vendor, sdkToken);
+                const result = await iFrameWidget.mountAndWaitForResponse();
+                widgetCallback({
+                  action: VerificationWidgetCallbackActions.VERIFICATION_SUCCESS,
+                  result
+                });
+                userEvents.addPageEvent("Success", { actionType: "add" });
+              } catch (err) {
+                if (err instanceof AdyenKycSdkError) {
+                  switch (err.message) {
+                    case "WIDGET_ACCOUNT_COMMIT_FAILURE":
+                      return widgetCallback({
+                        action: VerificationWidgetCallbackActions.HANDLE_EXCEPTION,
+                        err: err.sourceError
+                      });
+                    case "WIDGET_LAUNCH_FAILED":
+                    case "WIDGET_URL_MALFORMED":
+                    case "WIDGET_TIMEOUT":
+                      return widgetCallback({
+                        action: VerificationWidgetCallbackActions.RETRY_VERIFICATION
+                      });
+                    default:
+                      return widgetCallback({
+                        action: VerificationWidgetCallbackActions.HANDLE_EXCEPTION,
+                        err: {
+                          error: err?.name ?? VerificationWidgetCallbackActions.HANDLE_EXCEPTION,
+                          message: err.sourceError?.message ?? VerificationWidgetCallbackActions.HANDLE_EXCEPTION
+                        }
+                      });
+                  }
+                }
+                trackVerificationError(err instanceof AdyenKycSdkError ? err.message : "sdk error");
+                return widgetCallback({
+                  action: VerificationWidgetCallbackActions.HANDLE_EXCEPTION,
+                  err
+                });
+              }
+            });
+          }
+        });
+      });
+      container.classList.add(WIDGET_CONTAINER_CLASS);
+      if (fullscreen) {
+        container.classList.add(`${WIDGET_CONTAINER_CLASS}--fullscreen`);
+      }
+      return () => {
+        iFrameWidget?.unmount();
+        iFrame?.remove();
+        openBanking?.destroy();
+      };
+    },
+    // Effect dependencies have been omitted here, which isn't intended. However, there seems to be
+    // some problematic behaviour in the overall flow with the dependencies present, which requires
+    // further debugging and tracing to resolve (totally out of the scope of this component).
+    // [url, vendor, widgetCallback]
+    []
+  );
+  return /* @__PURE__ */ jsx("div", { ref: widgetContainerRef });
+}
+const accountVerificationFields = [
+  "verifiedAccountHolder",
+  "verifiedBankCountry",
+  "verifiedBankName",
+  "verifiedCurrencyCode",
+  "verifiedBankAccountNumber"
+];
+const InstantVerificationErrorContext = createContext(null);
+const useInstantVerificationErrorNotification = (notificationVisibilityDuration) => {
+  const [errorNotification, setErrorNotification] = useState(null);
+  const dismissNotificationTimeoutRef = useRef();
+  const clearNotificationTimeout = useCallback(() => {
+    if (dismissNotificationTimeoutRef.current) {
+      clearTimeout(dismissNotificationTimeoutRef.current);
+      dismissNotificationTimeoutRef.current = void 0;
+    }
+  }, []);
+  useEffect(() => {
+    clearNotificationTimeout();
+    if (errorNotification && notificationVisibilityDuration > 0) {
+      dismissNotificationTimeoutRef.current = setTimeout(() => {
+        setErrorNotification(null);
+        clearNotificationTimeout();
+      }, notificationVisibilityDuration);
+    }
+    return () => clearNotificationTimeout();
+  }, [errorNotification, clearNotificationTimeout, notificationVisibilityDuration]);
+  return [errorNotification, setErrorNotification];
+};
+function BankVerification(props) {
+  const {
+    heading,
+    setBankVerificationError,
+    onBack,
+    hideSidebar,
+    setBankInfoValidated,
+    bankInfoValidated,
+    formIsActive,
+    createTrustedTransferInstrument: createTrustedTransferInstrument2,
+    country,
+    data: propData,
+    provider,
+    id,
+    fieldValidationErrors
+  } = props;
+  const { i18n } = useI18nContext();
+  const invalidateRootLegalEntity = useInvalidateRootLegalEntity();
+  const schema = accountVerificationFields;
+  const stateRef = useRef({ setState: null });
+  const [hideVerificationWidget, setHideVerificationWidget] = useState(false);
+  const { handleChangeFor, data, valid, errors, isValid, triggerValidation, fieldProblems } = useForm({
+    ...props,
+    schema,
+    defaultData: propData,
+    rules: bankVerificationValidationRules,
+    fieldProblems: fieldValidationErrors
+  });
+  const retrieveBankAccountInfo = async ({
+    realLastFour,
+    number,
+    bankName
+  }) => {
+    handleChangeFor("verifiedBankAccountNumber")(realLastFour ? `*******${realLastFour}` : number);
+    handleChangeFor("verifiedBankName")(bankName);
+    handleChangeFor("verifiedBankCountry")(country);
+    handleChangeFor("verifiedAccountHolder")(propData?.verifiedAccountHolder);
+    handleChangeFor("verifiedCurrencyCode")(
+      propData?.verifiedCurrencyCode ?? currencyByCountry[country]?.[0]
+    );
+    setBankInfoValidated?.(true);
+    hideSidebar?.(false);
+    triggerValidation();
+    await invalidateRootLegalEntity();
+  };
+  const handleOnBack = () => {
+    setHideVerificationWidget(false);
+    onBack?.();
+  };
+  useEffect(() => {
+    stateRef.current.setState?.({
+      type: "addToState",
+      value: {
+        data,
+        valid,
+        errors,
+        fieldProblems,
+        dataStoreId: id,
+        schema
+      }
+    });
+  }, [data, valid, errors, isValid]);
+  useEffect(() => {
+    hideSidebar?.(formIsActive && !bankInfoValidated);
+    return () => hideSidebar?.(false);
+  }, [bankInfoValidated, formIsActive]);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(StateContextSetter, { owner: id, stateRef }),
+    bankInfoValidated && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(FormHeader, { heading }),
+      /* @__PURE__ */ jsx(Alert, { title: i18n.get("youSuccessfullyVerifiedAccount"), variant: "success" })
+    ] }),
+    provider && formIsActive && !bankInfoValidated && /* @__PURE__ */ jsx("div", { className: "adyen-kyc-bank-verification-container", children: /* @__PURE__ */ jsx("form", { className: "adyen-kyc-bank-verification", children: !hideVerificationWidget ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(
+        BankVerificationWidget,
+        {
+          url: provider.redirectUrl,
+          vendor: provider.name,
+          setBankVerificationError,
+          setHideVerificationWidget,
+          onBack: handleOnBack,
+          retrieveBankAccountInfo,
+          createTrustedTransferInstrument: createTrustedTransferInstrument2
+        }
+      ),
+      /* @__PURE__ */ jsx(ActionBar, { onBack: handleOnBack, backButtonLabel: i18n.get("goBack") })
+    ] }) : void 0 }) })
+  ] });
+}
+function BankAccountFormat(props) {
+  const { i18n } = useI18nContext();
+  const { bankAccountFormat, handleAccountFormatChange } = props;
+  const bankFormatOptions = [
+    {
+      id: "iban",
+      name: i18n.get("ibanFormat")
+    },
+    {
+      id: "local",
+      name: i18n.get("localFormat")
+    }
+  ];
+  return /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Field, { name: "bankAccountFormat", label: i18n.get("bankAccountFormat"), children: (childProps) => /* @__PURE__ */ jsx(
+    Select,
+    {
+      ...childProps,
+      onChange: (e) => handleAccountFormatChange?.(e?.target?.value),
+      name: "bankAccountFormat",
+      placeholder: i18n.get("localFormat"),
+      selected: bankAccountFormat,
+      items: bankFormatOptions
+    }
+  ) }) });
+}
+const simpleBankAccountNumberMetadata = (example, length, maxLength) => {
+  if (maxLength) {
+    return {
+      label: "bankAccountNumber",
+      validators: validatePatternOnBlur(new RegExp(`^\\d{${length},${maxLength}}$`)),
+      mask: {
+        mask: makeMask(...numericInputs(length), ...numericInputs(maxLength - length, true))
+      },
+      guidanceText: {
+        key: "enterAMaximumOfNDigitsForExample",
+        values: {
+          maxDigits: `${maxLength}`,
+          example
+        }
+      }
+    };
+  }
+  return {
+    label: "bankAccountNumber",
+    validators: validatePatternOnBlur(new RegExp(`^\\d{${length}}$`)),
+    mask: { mask: makeMask(...numericInputs(length)) },
+    guidanceText: {
+      key: "enterNDigitsForExample",
+      values: {
+        numDigits: `${length}`,
+        example
+      }
+    }
+  };
+};
+const defaultFieldMetadata$3 = {
+  label: "bankAccountNumber",
+  validators: isNotEmptyValidator
+};
+const defaultFieldConfig$3 = {
+  [CountryCodes.CzechRepublic]: {
+    // Validators & masks pulled from https://docs.adyen.com/api-explorer/legalentity/4/post/transferInstruments#request-bankAccount-accountIdentification-CZLocalAccountIdentification
+    label: "bankAccountNumber",
+    validators: validatePatternOnBlur(/^((\d{2}|\d{6})-)?\d*\d{2}$/),
+    mask: {
+      mask: makeMask(
+        ...numericInputs(2),
+        ...customInputs(1, /-|\d/),
+        ...numericInputs(3),
+        ...customInputs(1, /-|\d/),
+        ...numericInputs(10)
+      )
+    },
+    guidanceText: {
+      key: "enterXToYDigitsWithOrWithoutPrefixForExample",
+      values: {
+        minDigits: "2",
+        maxDigits: "16",
+        firstExample: "19-123457",
+        secondExample: "123457"
+      }
+    }
+  },
+  [CountryCodes.Denmark]: simpleBankAccountNumberMetadata("2621955959", 10),
+  [CountryCodes.Norway]: simpleBankAccountNumberMetadata("86011117947", 11),
+  [CountryCodes.UnitedKingdom]: simpleBankAccountNumberMetadata("10000003", 8),
+  [CountryCodes.Australia]: simpleBankAccountNumberMetadata("0001234", 5, 10),
+  [CountryCodes.Brazil]: simpleBankAccountNumberMetadata("0009795493", 4, 12),
+  [CountryCodes.Canada]: simpleBankAccountNumberMetadata("10220001111", 5, 12),
+  [CountryCodes.HongKong]: {
+    label: "bankAccountNumber",
+    validators: validatePatternOnBlur(new RegExp(`^\\d{${6},${18}}$`)),
+    mask: {
+      mask: makeMask(...numericInputs(6), ...numericInputs(12, true))
+    },
+    guidanceText: {
+      key: "enterAccountNumberWithBranchCodeForExample",
+      values: {
+        minDigits: "9",
+        maxDigits: "15",
+        example: "790000000"
+      }
+    }
+  },
+  [CountryCodes.Hungary]: simpleBankAccountNumberMetadata("117730161111101800000000", 24),
+  [CountryCodes.Singapore]: simpleBankAccountNumberMetadata("0052312891876", 4, 19),
+  [CountryCodes.Sweden]: simpleBankAccountNumberMetadata("123456789", 7, 10),
+  [CountryCodes.UnitedStates]: simpleBankAccountNumberMetadata("10220001111", 3, 17),
+  [CountryCodes.Poland]: {
+    label: "bankAccountNumber",
+    validators: validatePatternOnBlur(/^\d{26}$/),
+    mask: {
+      mask: makeMask(
+        ...numericInputs(2),
+        spacer,
+        ...numericInputs(4),
+        spacer,
+        ...numericInputs(4),
+        spacer,
+        ...numericInputs(4),
+        spacer,
+        ...numericInputs(4),
+        spacer,
+        ...numericInputs(4),
+        spacer,
+        ...numericInputs(4)
+      )
+    },
+    guidanceText: {
+      key: "enterNDigitsForExample",
+      values: {
+        numDigits: "26",
+        example: "98 1090 2402 7474 4662 2173 1624"
+      }
+    }
+  },
+  [CountryCodes.NewZealand]: {
+    label: "bankAccountNumber",
+    validators: validatePatternOnBlur(/^\d{15,16}$/),
+    mask: {
+      mask: makeMask(
+        ...numericInputs(2),
+        ...nonInputs(" - "),
+        ...numericInputs(4),
+        ...nonInputs(" - "),
+        ...numericInputs(7),
+        ...nonInputs(" - "),
+        ...numericInputs(2),
+        ...numericInputs(1, true)
+      )
+    },
+    guidanceText: {
+      key: "enterXToYDigitsForExample",
+      values: {
+        minDigits: "15",
+        maxDigits: "16",
+        example: "12-8765-9876543-043"
+      }
+    }
+  }
+};
+const bankAccountNumberFields = ["bankAccountNumber"];
+function BankAccountNumber(props) {
+  const { t } = useTranslation("common");
+  const { country, fieldConfig = defaultFieldConfig$3, onFocus, onBlur } = props;
+  const metadata = resolveFieldMetadata(fieldConfig[country], {}, defaultFieldMetadata$3);
+  const mergedProps = mergeFieldMetadataIntoProps("bankAccountNumber", metadata, props);
+  const { handleChangeFor, data, valid, errors, fieldProblems } = useForm({
+    ...mergedProps,
+    schema: bankAccountNumberFields,
+    rules: mergedProps.validators,
+    defaultData: mergedProps.data,
+    fieldProblems: mergedProps?.fieldValidationErrors,
+    obscuredFields: mergedProps.obscuredFields
+  });
+  const handleBlur = () => {
+    onBlur?.();
+    handleChangeFor("bankAccountNumber", "blur");
+  };
+  const { updateStateSlice } = useGlobalDataSlice(
+    "payoutAccountDetails"
+  );
+  useEffect(() => {
+    updateStateSlice({ data, valid, errors, fieldProblems });
+  }, [data, valid, errors]);
+  const formUtils = createFormUtils(mergedProps, t);
+  return /* @__PURE__ */ jsx(
+    MaskedInput,
+    {
+      name: "bankAccountNumber",
+      type: "text",
+      label: formUtils.getLabel("bankAccountNumber"),
+      formatGuidance: formUtils.getGuidanceText("bankAccountNumber"),
+      ...formUtils.getMask("bankAccountNumber"),
+      isValid: valid.bankAccountNumber,
+      errorMessage: formUtils.getErrorMessage("bankAccountNumber", errors, fieldProblems),
+      "aria-required": true,
+      "aria-invalid": !valid.bankAccountNumber,
+      onBlur: handleBlur,
+      onInput: handleChangeFor("bankAccountNumber", "input"),
+      onFocus,
+      readonly: formUtils.isReadOnly("bankAccountNumber"),
+      value: data.bankAccountNumber ?? "",
+      acceptObscuredValue: formUtils.isObscured("bankAccountNumber")
+    }
+  );
+}
+const bankCityFields = ["bankCity"];
+function BankCity(props) {
+  const { t } = useTranslation("common");
+  const { validators, data: bankCityData, fieldValidationErrors } = props;
+  const { handleChangeFor, data, valid, errors, fieldProblems } = useForm({
+    ...props,
+    schema: bankCityFields,
+    rules: validators,
+    defaultData: bankCityData,
+    fieldProblems: fieldValidationErrors
+  });
+  const { updateStateSlice } = useGlobalDataSlice(
+    "payoutAccountDetails"
+  );
+  useEffect(() => {
+    updateStateSlice({ data, valid, errors, fieldProblems });
+  }, [data, valid, errors]);
+  const formUtils = createFormUtils(props, t);
+  return /* @__PURE__ */ jsx(
+    Field,
+    {
+      name: "bankCity",
+      label: formUtils.getLabel("bankCity"),
+      errorMessage: formUtils.getErrorMessage("bankCity", errors, fieldProblems),
+      isValid: valid.bankCity,
+      children: (childProps) => /* @__PURE__ */ jsx(
+        InputText,
+        {
+          ...childProps,
+          name: "bankCity",
+          value: data.bankCity,
+          readonly: formUtils.isReadOnly("bankCity"),
+          onInput: handleChangeFor("bankCity", "input"),
+          onBlur: handleChangeFor("bankCity", "blur"),
+          "aria-required": true,
+          "aria-invalid": !valid.bankCity
+        }
+      )
+    }
+  );
+}
+const defaultFieldMetadata$2 = {
+  label: "bankCode",
+  validators: isNotEmptyValidator
+};
+const simpleBankCodeMetadata = (length, example, label) => ({
+  label: label ?? "bankCode",
+  validators: validatePatternOnBlur(new RegExp(`^\\d{${length}}$`)),
+  mask: {
+    mask: makeMask(...numericInputs(length))
+  },
+  guidanceText: {
+    key: "enterNDigitsForExample",
+    values: {
+      numDigits: `${length}`,
+      example
+    }
+  }
+});
+const defaultFieldConfig$2 = {
+  [CountryCodes.Brazil]: simpleBankCodeMetadata(3, "123"),
+  [CountryCodes.Canada]: simpleBankCodeMetadata(3, "100", "institutionNumber"),
+  [CountryCodes.CzechRepublic]: simpleBankCodeMetadata(4, "0800"),
+  [CountryCodes.Denmark]: simpleBankCodeMetadata(4, "5051"),
+  [CountryCodes.HongKong]: simpleBankCodeMetadata(3, "250", "bankCode"),
+  [CountryCodes.Norway]: simpleBankCodeMetadata(4, "8601"),
+  // Not yet implemented
+  [CountryCodes.Ecuador]: simpleBankCodeMetadata(4, "1234"),
+  [CountryCodes.Japan]: simpleBankCodeMetadata(4, "1234"),
+  [CountryCodes.Taiwan]: simpleBankCodeMetadata(3, "123")
+};
+const bankCodeFields = ["bankCode"];
+function BankCode(props) {
+  const { t } = useTranslation("common");
+  const { country, fieldConfig = defaultFieldConfig$2 } = props;
+  const metadata = resolveFieldMetadata(fieldConfig[country], {}, defaultFieldMetadata$2);
+  const mergedProps = mergeFieldMetadataIntoProps("bankCode", metadata, props);
+  const { handleChangeFor, data, valid, errors, fieldProblems } = useForm({
+    ...mergedProps,
+    schema: bankCodeFields,
+    rules: mergedProps.validators,
+    defaultData: mergedProps.data,
+    fieldProblems: mergedProps.fieldValidationErrors
+  });
+  const { updateStateSlice } = useGlobalDataSlice(
+    "payoutAccountDetails"
+  );
+  useEffect(() => {
+    updateStateSlice({ data, valid, errors, fieldProblems });
+  }, [data, valid, errors]);
+  const formUtils = createFormUtils(mergedProps, t);
+  return /* @__PURE__ */ jsx(
+    MaskedInput,
+    {
+      name: "bankCode",
+      type: "text",
+      label: formUtils.getLabel("bankCode"),
+      errorMessage: formUtils.getErrorMessage("bankCode", errors, fieldProblems),
+      formatGuidance: formUtils.getGuidanceText("bankCode"),
+      ...formUtils.getMask("bankCode"),
+      isValid: valid.bankCode,
+      value: data.bankCode ?? "",
+      readonly: formUtils.isReadOnly("bankCode"),
+      onInput: handleChangeFor("bankCode", "input"),
+      onBlur: handleChangeFor("bankCode", "blur"),
+      "aria-required": true,
+      "aria-invalid": !valid.bankCode
+    }
+  );
+}
+const bankNameFields = ["bankName"];
+function BankName(props) {
+  const { t } = useTranslation("common");
+  const { validators, data: bankNameData, fieldValidationErrors } = props;
+  const { handleChangeFor, data, valid, errors, fieldProblems } = useForm({
+    ...props,
+    schema: bankNameFields,
+    rules: validators,
+    defaultData: bankNameData,
+    fieldProblems: fieldValidationErrors
+  });
+  const { updateStateSlice } = useGlobalDataSlice(
+    "payoutAccountDetails"
+  );
+  useEffect(() => {
+    updateStateSlice({ data, valid, errors, fieldProblems });
+  }, [data, valid, errors]);
+  const formUtils = createFormUtils(props, t);
+  return /* @__PURE__ */ jsx(
+    Field,
+    {
+      name: "bankName",
+      label: formUtils.getLabel("bankName"),
+      errorMessage: formUtils.getErrorMessage("bankName", errors, fieldProblems),
+      isValid: valid.bankName,
+      children: (childProps) => /* @__PURE__ */ jsx(
+        InputText,
+        {
+          ...childProps,
+          name: "bankName",
+          value: data.bankName,
+          readonly: formUtils.isReadOnly("bankName"),
+          onInput: handleChangeFor("bankName", "input"),
+          onBlur: handleChangeFor("bankName", "blur"),
+          "aria-required": true,
+          "aria-invalid": !valid.bankName
+        }
+      )
+    }
+  );
+}
+const defaultFieldMetadata$1 = {
+  label: "branchCode",
+  validators: isNotEmptyValidator
+};
+const defaultFieldConfig$1 = {
+  [CountryCodes.UnitedKingdom]: {
+    label: "sortCode",
+    validators: validatePatternOnBlur(/^\d{6}$/),
+    mask: { mask: makeMask(...numericInputs(6)) },
+    guidanceText: {
+      key: "enterNDigitsForExample",
+      values: {
+        numDigits: "6",
+        example: "401199"
+      }
+    }
+  },
+  [CountryCodes.Australia]: {
+    label: "bsbNumber",
+    validators: validatePatternOnBlur(/^\d{6}$/),
+    mask: { mask: makeMask(...numericInputs(3), ...nonInputs(" - "), ...numericInputs(3)) },
+    guidanceText: {
+      key: "enterNDigitsForExample",
+      values: {
+        numDigits: "6",
+        example: "033-547"
+      }
+    }
+  },
+  [CountryCodes.Brazil]: {
+    label: "branchCode",
+    validators: validatePatternOnBlur(/^\d{1,5}$/),
+    mask: { mask: makeMask(...numericInputs(1), ...numericInputs(4, true)) },
+    guidanceText: {
+      key: "enterAMaximumOfNDigitsForExample",
+      values: {
+        maxDigits: "5",
+        example: "36257"
+      }
+    }
+  },
+  [CountryCodes.Canada]: {
+    label: "transitNumber",
+    validators: validatePatternOnBlur(/^\d{5}$/),
+    mask: { mask: makeMask(...numericInputs(5)) },
+    guidanceText: {
+      key: "enterNDigitsForExample",
+      values: {
+        numDigits: "5",
+        example: "27601"
+      }
+    }
+  },
+  [CountryCodes.UnitedStates]: {
+    label: "routingNumber",
+    validators: validatePatternOnBlur(/^\d{9}$/),
+    mask: { mask: makeMask(...numericInputs(9)) },
+    guidanceText: {
+      key: "enterNDigitsForExample",
+      values: {
+        numDigits: "9",
+        example: "107005432"
+      }
+    }
+  },
+  [CountryCodes.Sweden]: {
+    label: "branchCode",
+    validators: validatePatternOnBlur(/^\d{4,5}$/),
+    mask: {
+      mask: makeMask(
+        ...numericInputs(4),
+        ...nonInputs(" - ", { displayEagerly: false }),
+        ...numericInputs(1, true)
+      )
+    },
+    guidanceText: {
+      key: "enterXToYDigitsForExample",
+      values: {
+        minDigits: "4",
+        maxDigits: "5",
+        example: "5678 or 7635-2"
+      }
+    }
+  },
+  // Not yet implemented
+  [CountryCodes.Indonesia]: {
+    label: "clearingCode",
+    validators: isNotEmptyValidator
+  }
+};
+const branchCodeFields = ["branchCode"];
+function BranchCode(props) {
+  const { t } = useTranslation("common");
+  const { country, fieldConfig = defaultFieldConfig$1, onFocus, onBlur } = props;
+  const metadata = resolveFieldMetadata(fieldConfig[country], {}, defaultFieldMetadata$1);
+  const mergedProps = mergeFieldMetadataIntoProps("branchCode", metadata, props);
+  const { handleChangeFor, data, valid, errors, fieldProblems } = useForm({
+    ...mergedProps,
+    schema: branchCodeFields,
+    rules: mergedProps.validators,
+    defaultData: mergedProps.data,
+    fieldProblems: mergedProps?.fieldValidationErrors
+  });
+  const { updateStateSlice } = useGlobalDataSlice(
+    "payoutAccountDetails"
+  );
+  const handleBlur = () => {
+    onBlur?.();
+    handleChangeFor("branchCode", "blur");
+  };
+  useEffect(() => {
+    updateStateSlice({ data, valid, errors, fieldProblems });
+  }, [data, valid, errors]);
+  const formUtils = createFormUtils(mergedProps, t);
+  return /* @__PURE__ */ jsx(
+    MaskedInput,
+    {
+      name: "branchCode",
+      type: "text",
+      label: formUtils.getLabel("branchCode"),
+      formatGuidance: formUtils.getGuidanceText("branchCode"),
+      ...formUtils.getMask("branchCode"),
+      errorMessage: formUtils.getErrorMessage("branchCode", errors, fieldProblems),
+      isValid: valid.branchCode,
+      value: data.branchCode ?? "",
+      readonly: formUtils.isReadOnly("branchCode"),
+      onInput: handleChangeFor("branchCode", "input"),
+      onBlur: handleBlur,
+      onFocus,
+      "aria-required": true,
+      "aria-invalid": !valid.branchCode
+    }
+  );
+}
+const bbanPatternsByCountry = {
+  [CountryCodes.Albania]: /\d{8}[\dA-Z]{16}/,
+  [CountryCodes.Andorra]: /\d{8}[\dA-Z]{12}/,
+  [CountryCodes.Austria]: /\d{16}/,
+  [CountryCodes.Azerbaijan]: /[\dA-Z]{4}\d{20}/,
+  [CountryCodes.Belgium]: /\d{12}/,
+  [CountryCodes.Bahrain]: /[A-Z]{4}[\dA-Z]{14}/,
+  [CountryCodes.BosniaAndHerzegovina]: /\d{16}/,
+  [CountryCodes.Brazil]: /\d{23}[A-Z][\dA-Z]/,
+  [CountryCodes.Bulgaria]: /[A-Z]{4}\d{6}[\dA-Z]{8}/,
+  [CountryCodes.CostaRica]: /\d{17}/,
+  [CountryCodes.Croatia]: /\d{17}/,
+  [CountryCodes.Cyprus]: /\d{8}[\dA-Z]{16}/,
+  [CountryCodes.CzechRepublic]: /\d{20}/,
+  [CountryCodes.Denmark]: /\d{14}/,
+  [CountryCodes.DominicanRepublic]: /[A-Z]{4}\d{20}/,
+  [CountryCodes.Estonia]: /\d{16}/,
+  [CountryCodes.FaroeIslands]: /\d{14}/,
+  [CountryCodes.Finland]: /\d{14}/,
+  [CountryCodes.France]: /\d{10}[\dA-Z]{11}\d{2}/,
+  [CountryCodes.Georgia]: /[\dA-Z]{2}\d{16}/,
+  [CountryCodes.Germany]: /\d{18}/,
+  [CountryCodes.Gibraltar]: /[A-Z]{4}[\dA-Z]{15}/,
+  [CountryCodes.Greece]: /\d{7}[\dA-Z]{16}/,
+  [CountryCodes.Greenland]: /\d{14}/,
+  [CountryCodes.Guatemala]: /[\dA-Z]{4}[\dA-Z]{20}/,
+  [CountryCodes.Hungary]: /\d{24}/,
+  [CountryCodes.Iceland]: /\d{22}/,
+  [CountryCodes.Ireland]: /[\dA-Z]{4}\d{14}/,
+  [CountryCodes.Israel]: /\d{19}/,
+  [CountryCodes.Italy]: /[A-Z]\d{10}[\dA-Z]{12}/,
+  [CountryCodes.Kazakhstan]: /\d{3}[\dA-Z]{13}/,
+  [CountryCodes.Kuwait]: /[A-Z]{4}[\dA-Z]{22}/,
+  [CountryCodes.Latvia]: /[A-Z]{4}[\dA-Z]{13}/,
+  [CountryCodes.Lebanon]: /\d{4}[\dA-Z]{20}/,
+  [CountryCodes.Liechtenstein]: /\d{5}[\dA-Z]{12}/,
+  [CountryCodes.Lithuania]: /\d{16}/,
+  [CountryCodes.Luxembourg]: /\d{3}[\dA-Z]{13}/,
+  [CountryCodes.Macedonia]: /\d{3}[\dA-Z]{10}\d{2}/,
+  [CountryCodes.Malta]: /[A-Z]{4}\d{5}[\dA-Z]{18}/,
+  [CountryCodes.Mauritania]: /\d{23}/,
+  [CountryCodes.Mauritius]: /[A-Z]{4}\d{19}[A-Z]{3}/,
+  [CountryCodes.Monaco]: /\d{10}[\dA-Z]{11}\d{2}/,
+  [CountryCodes.Moldova]: /[\dA-Z]{2}\d{18}/,
+  [CountryCodes.Montenegro]: /\d{18}/,
+  [CountryCodes.Netherlands]: /[A-Z]{4}\d{10}/,
+  [CountryCodes.Norway]: /\d{11}/,
+  [CountryCodes.Pakistan]: /[\dA-Z]{4}\d{16}/,
+  [CountryCodes.PalestinianTerritory]: /[\dA-Z]{4}\d{21}/,
+  [CountryCodes.Poland]: /\d{24}/,
+  [CountryCodes.Portugal]: /\d{21}/,
+  [CountryCodes.Romania]: /[A-Z]{4}[\dA-Z]{16}/,
+  [CountryCodes.SanMarino]: /[A-Z]\d{10}[\dA-Z]{12}/,
+  [CountryCodes.SaudiArabia]: /\d{2}[\dA-Z]{18}/,
+  [CountryCodes.Serbia]: /\d{18}/,
+  [CountryCodes.Slovakia]: /\d{20}/,
+  [CountryCodes.Slovenia]: /\d{15}/,
+  [CountryCodes.Spain]: /\d{20}/,
+  [CountryCodes.Sweden]: /\d{20}/,
+  [CountryCodes.Switzerland]: /\d{5}[\dA-Z]{12}/,
+  [CountryCodes.Tunisia]: /\d{20}/,
+  [CountryCodes.Turkey]: /\d{5}[\dA-Z]{17}/,
+  [CountryCodes.UnitedArabEmirates]: /\d{3}\d{16}/,
+  [CountryCodes.UnitedKingdom]: /[A-Z]{4}\d{14}/,
+  [CountryCodes.VirginIslandsBritish]: /[\dA-Z]{4}\d{16}/
+};
+const customPrefixByCountry = {
+  [CountryCodes.Guernsey]: "GB",
+  [CountryCodes.Jersey]: "GB",
+  [CountryCodes.IsleOfMan]: "GB"
+};
+function ibanValidator(input, bankCountry) {
+  if (isEmpty(input)) return false;
+  const ibanInput = input.replace(/ /g, "").toUpperCase();
+  if (!/^([a-zA-Z0-9]{4} ){2,8}[a-zA-Z0-9]{1,4}|[a-zA-Z0-9]{12,34}$/.test(ibanInput)) {
+    return false;
+  }
+  const countryCode = ibanInput.substring(0, 2);
+  const allowedPrefix = customPrefixByCountry[bankCountry] ?? bankCountry;
+  if (countryCode !== allowedPrefix) {
+    return {
+      key: "yourIbanShouldBeginWith_",
+      values: {
+        countryCode: allowedPrefix
+      }
+    };
+  }
+  const bbanPattern = bbanPatternsByCountry[countryCode];
+  if (bbanPattern) {
+    const ibanPattern = new RegExp(`^[A-Z]{2}\\d{2}${bbanPattern.source}$`, "");
+    if (!ibanPattern.test(ibanInput)) {
+      return false;
+    }
+  }
+  const ibanCheck = ibanInput.substring(4, ibanInput.length) + ibanInput.substring(0, 4);
+  let leadingZeroes = true;
+  let ibanCheckDigits = "";
+  for (let i = 0; i < ibanCheck.length; i += 1) {
+    const charAt = ibanCheck.charAt(i);
+    if (charAt !== "0") {
+      leadingZeroes = false;
+    }
+    if (!leadingZeroes) {
+      ibanCheckDigits += "0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ".indexOf(charAt);
+    }
+  }
+  let cRest = 0;
+  for (let p = 0; p < ibanCheckDigits.length; p += 1) {
+    const cChar = ibanCheckDigits.charAt(p);
+    const cOperator = +`${cRest}${cChar}`;
+    cRest = cOperator % 97;
+  }
+  return cRest === 1;
+}
+const validateIbanOnBlurAndInput = (country) => ({
+  modes: ["blur", "input"],
+  validate: (iban) => ibanValidator(iban, country) === true,
+  errorMessage: (iban) => {
+    const result = ibanValidator(iban, country);
+    return typeof result === "boolean" ? void 0 : result;
+  }
+});
+const ibanMask = (country, inputLength, allowLettersInBban) => {
+  const tokens = [];
+  tokens.push(...nonInputs(country, { includeInValue: true }), ...numericInputs(2));
+  inputLength -= 2;
+  const inputToken = allowLettersInBban ? alphanumericInputs : numericInputs;
+  const numGroups = Math.floor(inputLength / 4);
+  const remainder = inputLength % 4;
+  for (let i = 0; i < numGroups; i += 1) {
+    tokens.push(spacer, ...inputToken(4));
+  }
+  if (remainder > 0) {
+    tokens.push(spacer, ...inputToken(remainder));
+  }
+  return {
+    mask: makeMask(...tokens),
+    transformOnType: allowLettersInBban ? uppercase : void 0
+  };
+};
+const ibanGuidance = (type, numDigitsOrChars, example) => type === "digits" ? {
+  key: "enterTheRemainingNDigitsForExample",
+  values: {
+    numDigits: `${numDigitsOrChars}`,
+    example
+  }
+} : {
+  key: "enterTheRemainingNCharactersForExample",
+  values: {
+    numChars: `${numDigitsOrChars}`,
+    example
+  }
+};
+const ibanMetadata = (country, inputLength, example, allowLettersInBban) => ({
+  label: "iban",
+  validators: validateIbanOnBlurAndInput(country),
+  mask: ibanMask(country, inputLength, allowLettersInBban),
+  guidanceText: ibanGuidance(allowLettersInBban ? "characters" : "digits", inputLength, example)
+});
+const gbIbanMetadata = ibanMetadata(
+  CountryCodes.UnitedKingdom,
+  20,
+  "GB09 BARC 2003 9554 8297 59",
+  true
+);
+const defaultFieldMetadata = {
+  label: "iban",
+  validators: isNotEmptyValidator
+};
+const defaultFieldConfig = {
+  [CountryCodes.Austria]: ibanMetadata(CountryCodes.Austria, 18, "AT88 5400 0746 7265 9747"),
+  [CountryCodes.Belgium]: ibanMetadata(CountryCodes.Belgium, 14, "BE59 9788 6743 2226"),
+  [CountryCodes.Croatia]: ibanMetadata(CountryCodes.Croatia, 19, "HR51 2484 0083 5929 6973 8"),
+  [CountryCodes.Cyprus]: ibanMetadata(
+    CountryCodes.Cyprus,
+    26,
+    "CY16 5183 1221 8756 5858 5388 7678"
+  ),
+  [CountryCodes.CzechRepublic]: ibanMetadata(
+    CountryCodes.CzechRepublic,
+    22,
+    "CZ23 5051 3674 5924 5233 3465"
+  ),
+  [CountryCodes.Denmark]: ibanMetadata(CountryCodes.Denmark, 16, "DK95 2000 0123 4567 89"),
+  [CountryCodes.Estonia]: ibanMetadata(CountryCodes.Estonia, 18, "EE26 1291 5123 1542 6371"),
+  [CountryCodes.Finland]: ibanMetadata(CountryCodes.Finland, 16, "FI03 9319 8995 3742 51"),
+  [CountryCodes.Germany]: ibanMetadata(CountryCodes.Germany, 20, "DE91 1000 0000 0123 4567 89"),
+  [CountryCodes.Greece]: ibanMetadata(CountryCodes.Greece, 25, "GR57 0107 7142 7681 6687 9575 217"),
+  [CountryCodes.Hungary]: ibanMetadata(
+    CountryCodes.Hungary,
+    26,
+    "HU68 1070 0024 3428 4128 3192 4812"
+  ),
+  [CountryCodes.Lithuania]: ibanMetadata(CountryCodes.Lithuania, 18, "LT59 9244 6228 2176 2762"),
+  [CountryCodes.Luxembourg]: ibanMetadata(CountryCodes.Luxembourg, 18, "LU71 0106 9242 5365 8562"),
+  [CountryCodes.Norway]: ibanMetadata(CountryCodes.Norway, 13, "NO83 3000 1234 567"),
+  [CountryCodes.Poland]: ibanMetadata(
+    CountryCodes.Poland,
+    26,
+    "PL98 1090 2402 7474 4662 2173 1624"
+  ),
+  [CountryCodes.Portugal]: ibanMetadata(
+    CountryCodes.Portugal,
+    23,
+    "PT42 0035 0651 8646 9119 5263 5"
+  ),
+  [CountryCodes.Slovakia]: ibanMetadata(CountryCodes.Slovakia, 22, "SK25 5173 1333 4916 3219 3521"),
+  [CountryCodes.Slovenia]: ibanMetadata(CountryCodes.Slovenia, 17, "SI56 1920 0123 4567 892"),
+  [CountryCodes.Spain]: ibanMetadata(CountryCodes.Spain, 22, "ES76 1465 5599 9226 7623 2635"),
+  [CountryCodes.Sweden]: ibanMetadata(CountryCodes.Sweden, 22, "SE72 8000 0810 3400 0978 3242"),
+  // These include letters in the BBAN (bank account number)
+  [CountryCodes.Bulgaria]: ibanMetadata(
+    CountryCodes.Bulgaria,
+    20,
+    "BG17 BNPA 9440 4432 7749 93",
+    true
+  ),
+  [CountryCodes.France]: ibanMetadata(
+    CountryCodes.France,
+    25,
+    "FR64 1009 6000 4035 3425 9742 Y90",
+    true
+  ),
+  [CountryCodes.Gibraltar]: ibanMetadata(
+    CountryCodes.Gibraltar,
+    21,
+    "GI96 JYJT 9899 9587 8655 898",
+    true
+  ),
+  [CountryCodes.Ireland]: ibanMetadata(
+    CountryCodes.Ireland,
+    20,
+    "IE64 IRCE 9205 0112 3456 78",
+    true
+  ),
+  [CountryCodes.Italy]: ibanMetadata(
+    CountryCodes.Italy,
+    25,
+    "IT06 L030 0203 2809 8485 8934 882",
+    true
+  ),
+  [CountryCodes.Latvia]: ibanMetadata(CountryCodes.Latvia, 19, "LV80 BANK 0000 4351 9500 1", true),
+  [CountryCodes.Liechtenstein]: ibanMetadata(
+    CountryCodes.Liechtenstein,
+    19,
+    "LI21 0881 0000 2324 013A A",
+    true
+  ),
+  [CountryCodes.Malta]: ibanMetadata(
+    CountryCodes.Malta,
+    29,
+    "MT03 VIXW 2487 8926 8575 8586 8929 858",
+    true
+  ),
+  [CountryCodes.Monaco]: ibanMetadata(
+    CountryCodes.Monaco,
+    25,
+    "MC58 1122 2000 0101 2345 6789 030",
+    true
+  ),
+  [CountryCodes.Netherlands]: ibanMetadata(
+    CountryCodes.Netherlands,
+    16,
+    "NL50 ABNA 4452 7591 49",
+    true
+  ),
+  [CountryCodes.Romania]: ibanMetadata(
+    CountryCodes.Romania,
+    22,
+    "RO36 PORL 9596 9966 4965 4284",
+    true
+  ),
+  [CountryCodes.Switzerland]: ibanMetadata(
+    CountryCodes.Switzerland,
+    19,
+    "CH56 0483 5012 3456 7800 9",
+    true
+  ),
+  [CountryCodes.UnitedKingdom]: gbIbanMetadata,
+  // IBANs for Guernsey, Jersey, and Isle of Man also use United Kingdom's format (starting with `GB`)
+  [CountryCodes.Guernsey]: gbIbanMetadata,
+  [CountryCodes.Jersey]: gbIbanMetadata,
+  [CountryCodes.IsleOfMan]: gbIbanMetadata
+};
+const ibanFields = ["iban"];
+function Iban(props) {
+  const { t } = useTranslation("common");
+  const {
+    country,
+    fieldConfig = defaultFieldConfig,
+    data: ibanData,
+    obscuredFields,
+    fieldValidationErrors
+  } = props;
+  const metadata = resolveFieldMetadata(fieldConfig[country], {}, defaultFieldMetadata);
+  const mergedProps = mergeFieldMetadataIntoProps("iban", metadata, props);
+  const { handleChangeFor, data, valid, errors, fieldProblems } = useForm({
+    ...mergedProps,
+    schema: ibanFields,
+    rules: mergedProps.validators,
+    defaultData: ibanData,
+    fieldProblems: fieldValidationErrors,
+    obscuredFields
+  });
+  const { updateStateSlice } = useGlobalDataSlice(
+    "payoutAccountDetails"
+  );
+  useEffect(() => {
+    updateStateSlice({ data, valid, errors, fieldProblems });
+  }, [data, errors, valid]);
+  const formUtils = createFormUtils(mergedProps, t);
+  return /* @__PURE__ */ jsx(
+    MaskedInput,
+    {
+      name: "iban",
+      type: "text",
+      label: formUtils.getLabel("iban"),
+      formatGuidance: formUtils.getGuidanceText("iban"),
+      ...formUtils.getMask("iban"),
+      errorMessage: formUtils.getErrorMessage("iban", errors, fieldProblems),
+      isValid: valid.iban,
+      value: data.iban ?? "",
+      readonly: formUtils.isReadOnly("iban"),
+      onInput: handleChangeFor("iban", "blur"),
+      onBlur: handleChangeFor("iban", "blur"),
+      "aria-required": true,
+      "aria-invalid": !valid.iban,
+      acceptObscuredValue: formUtils.isObscured("iban")
+    }
+  );
+}
+const swiftCodeFieldMetadata = {
+  label: "bicSwift",
+  validators: validatePatternOnBlur(/^([a-zA-Z0-9]{8}|[a-zA-Z0-9]{11})$/),
+  mask: {
+    mask: makeMask(...alphaInputs(6), ...alphanumericInputs(2), ...alphanumericInputs(3, true)),
+    transformOnType: uppercase
+  },
+  guidanceText: {
+    key: "enterXOrYCharactersForExample",
+    values: {
+      xChars: "8",
+      yChars: "11",
+      example: "BANKDE65287"
+    }
+  }
+};
+const swiftCodeFields = ["swiftCode"];
+function SwiftCode(props) {
+  const { t } = useTranslation("common");
+  const mergedProps = mergeFieldMetadataIntoProps("swiftCode", swiftCodeFieldMetadata, props);
+  const { handleChangeFor, data, valid, errors, fieldProblems } = useForm({
+    ...mergedProps,
+    schema: swiftCodeFields,
+    rules: mergedProps.validators,
+    defaultData: mergedProps.data,
+    fieldProblems: mergedProps?.fieldValidationErrors
+  });
+  const { updateStateSlice } = useGlobalDataSlice(
+    "payoutAccountDetails"
+  );
+  useEffect(() => {
+    updateStateSlice({ data, valid, errors, fieldProblems });
+  }, [data, valid, errors]);
+  const formUtils = createFormUtils(mergedProps, t);
+  return /* @__PURE__ */ jsx(
+    MaskedInput,
+    {
+      name: "swiftCode",
+      type: "text",
+      label: formUtils.getLabel("swiftCode"),
+      formatGuidance: formUtils.getGuidanceText("swiftCode"),
+      ...formUtils.getMask("swiftCode"),
+      errorMessage: formUtils.getErrorMessage("swiftCode", errors, fieldProblems),
+      isValid: valid.swiftCode,
+      value: data.swiftCode ?? "",
+      readonly: formUtils.isReadOnly("swiftCode"),
+      onInput: handleChangeFor("swiftCode", "input"),
+      onBlur: handleChangeFor("swiftCode", "blur"),
+      "aria-required": true,
+      "aria-invalid": !valid.swiftCode
+    }
+  );
+}
+const countriesWithMultipleCurrencies = /* @__PURE__ */ new Set([
+  CountryCodes.Bulgaria,
+  CountryCodes.Canada,
+  CountryCodes.Croatia,
+  CountryCodes.CzechRepublic,
+  CountryCodes.Hungary,
+  CountryCodes.Romania,
+  CountryCodes.Switzerland
+]);
+const countriesWithLocalFormat = /* @__PURE__ */ new Set([
+  CountryCodes.CzechRepublic,
+  CountryCodes.Denmark,
+  CountryCodes.Hungary,
+  CountryCodes.Norway,
+  CountryCodes.Poland,
+  CountryCodes.Sweden,
+  CountryCodes.UnitedKingdom
+]);
+const payoutCurrencySupport = {
+  [CountryCodes.Sweden]: {
+    local: [Currencies.SEK],
+    iban: [Currencies.EUR, Currencies.SEK]
+  },
+  [CountryCodes.Canada]: {
+    local: [Currencies.CAD, Currencies.USD],
+    iban: [Currencies.CAD, Currencies.USD]
+  }
+};
+const shouldShowCheckGuidance = (country) => country === "US";
+const shouldShowPayoutAccountFormatSelector = (country) => countriesWithLocalFormat.has(country);
+const shouldShowPayoutAlert = (country) => shouldShowPayoutAccountFormatSelector(country) || countriesWithMultipleCurrencies.has(country);
+const getSupportedCurrencyGuidance = (i18n, country, requiredFields) => {
+  const format = requiredFields.includes("iban") ? "iban" : "local";
+  if (!shouldShowPayoutAlert(country)) {
+    return;
+  }
+  const supportedCurrencies = getSupportedCurrenciesPerFormat(country, format);
+  if (!supportedCurrencies) {
+    return;
+  }
+  return supportedCurrencies.length > 1 ? i18n.get("payoutIn_Or_", {
+    values: { currencyOne: supportedCurrencies[0], currencyTwo: supportedCurrencies[1] }
+  }) : i18n.get("payoutInOnly_", {
+    values: { currency: supportedCurrencies[0] }
+  });
+};
+const getSupportedCurrenciesPerFormat = (country, format) => {
+  const supportedCurrencies = payoutCurrencySupport[country];
+  if (!supportedCurrencies) {
+    const defaultCurrency = currencyByCountry[country]?.[0];
+    if (!defaultCurrency) {
+      return;
+    }
+    return format === "iban" ? [Currencies.EUR, defaultCurrency] : [defaultCurrency];
+  }
+  return supportedCurrencies[format];
+};
+const AccountHolderDescriptionFragment = ({
+  legalEntityResponse
+}) => {
+  const { i18n } = useI18nContext();
+  const hasSolePropEntityAssociations = hasOwnEntityAssociationOfType(
+    LegalEntityTypes.SOLE_PROPRIETORSHIP,
+    legalEntityResponse.entityAssociations,
+    legalEntityResponse.id
+  );
+  const { accountHolder } = useAccountHolder();
+  const unincorporatedPartnershipMembers = useUnincorporatedPartnershipMembers();
+  if (accountHolder === "mySoleProprietorName" || hasSolePropEntityAssociations) {
+    const soleProp = legalEntityResponse.entityAssociations?.find(
+      (ea) => ea.entityType === "soleProprietorship"
+    );
+    const { individual: individual2 } = legalEntityResponse;
+    return /* @__PURE__ */ jsxs(Typography, { children: [
+      `${i18n.get("bankAccountHasToBeInYourName")} `,
+      /* @__PURE__ */ jsx(
+        Typography,
+        {
+          el: "span",
+          variant: "body-stronger",
+          children: `${individual2?.name.firstName} ${individual2?.name.lastName}`
+        }
+      ),
+      ` ${i18n.get("orSoleProprietorshipName")} `,
+      " ",
+      /* @__PURE__ */ jsx(Typography, { el: "span", variant: "body-stronger", children: `${soleProp?.name ?? ""}` })
+    ] });
+  }
+  const hasTrustsEntityAssociations = hasOwnEntityAssociationOfType(
+    LegalEntityTypes.TRUST,
+    legalEntityResponse.entityAssociations,
+    legalEntityResponse.id
+  );
+  if (accountHolder === "aTrust" || hasTrustsEntityAssociations) {
+    const trust = legalEntityResponse.entityAssociations?.find((ea) => ea.entityType === "trust");
+    if (legalEntityResponse.type === LegalEntityTypes.INDIVIDUAL) {
+      return /* @__PURE__ */ jsxs(Typography, { children: [
+        `${i18n.get("bankAccountToHaveSameNameAsTrust")} `,
+        /* @__PURE__ */ jsx(Typography, { el: "span", variant: "body-stronger", children: i18n.get("trusteeAsTrusteeForTrust", {
+          values: {
+            trusteeName: `${legalEntityResponse?.individual?.name.firstName} ${legalEntityResponse?.individual?.name.lastName}`,
+            trustName: trust?.name ?? ""
+          }
+        }) })
+      ] });
+    }
+    const companyTrusteeBankAccountName = legalEntityResponse?.organization?.legalName !== legalEntityResponse?.organization?.doingBusinessAs ? i18n.get("trusteeAsTrusteeForTrustDoingBusinessAs", {
+      values: {
+        trusteeName: legalEntityResponse?.organization?.legalName ?? "",
+        trustName: trust?.name ?? "",
+        tradingName: legalEntityResponse?.organization?.doingBusinessAs
+      }
+    }) : i18n.get("trusteeAsTrusteeForTrust", {
+      values: {
+        trusteeName: legalEntityResponse?.organization?.legalName ?? "",
+        trustName: trust?.name ?? ""
+      }
+    });
+    return /* @__PURE__ */ jsxs(Typography, { children: [
+      `${i18n.get("bankAccountToHaveSameNameAsTrust")} `,
+      /* @__PURE__ */ jsx(Typography, { el: "span", variant: "body-stronger", children: companyTrusteeBankAccountName })
+    ] });
+  }
+  const hasUnincorporatedPartnershipEntityAssociations = hasOwnEntityAssociationOfType(
+    LegalEntityTypes.UNINCORPORATED_PARTNERSHIP,
+    legalEntityResponse.entityAssociations,
+    legalEntityResponse.id
+  );
+  if (accountHolder === "anUnincorporatedPartnership" || hasUnincorporatedPartnershipEntityAssociations) {
+    const unincorporatedPartnership = legalEntityResponse?.entityAssociations?.find(
+      (ea) => ea.entityType === "unincorporatedPartnership"
+    );
+    const partnerNames = unincorporatedPartnershipMembers?.map((member) => member?.name)?.sort();
+    return /* @__PURE__ */ jsx(Typography, { children: `${i18n.get("bankAccountToHaveSameNameAsUnincorporatedPartnership", {
+      values: {
+        partnerNames: `${partnerNames?.join(", ")}`,
+        partnershipName: unincorporatedPartnership?.name ?? ""
+      }
+    })} ` });
+  }
+  if (legalEntityResponse.type === LegalEntityTypes.ORGANIZATION) {
+    return /* @__PURE__ */ jsxs(Typography, { children: [
+      `${i18n.get("bankAccountHasToBeInYourCompanyName")} `,
+      /* @__PURE__ */ jsx(Typography, { el: "span", variant: "body-stronger", children: legalEntityResponse?.organization?.legalName })
+    ] });
+  }
+  const { individual } = legalEntityResponse;
+  return /* @__PURE__ */ jsxs(Typography, { children: [
+    `${i18n.get("bankAccountHasToBeInYourName")} `,
+    /* @__PURE__ */ jsx(
+      Typography,
+      {
+        el: "span",
+        variant: "body-stronger",
+        children: `${individual?.name.firstName} ${individual?.name.lastName}`
+      }
+    )
+  ] });
+};
+const checkGuidance = "adyen-kyc-check-guidance";
+const checkGuidanceImage = "adyen-kyc-check-guidance-image";
+const checkGuidanceAnnotated = "adyen-kyc-check-guidance-annotated";
+const checkGuidanceInactive = "adyen-kyc-check-guidance-inactive";
+const styles = {
+  checkGuidance,
+  checkGuidanceImage,
+  checkGuidanceAnnotated,
+  checkGuidanceInactive
+};
+const usCheckAccount = lazy(() => import("./us-check-account-number-C7KE5YzX.js"));
+const usCheckRouting = lazy(() => import("./us-check-routing-number-DUbhsYAR.js"));
+const usCheck = lazy(() => import("./us-check-CYY6Crhr.js"));
+const CheckGuidance = ({ annotated }) => {
+  return /* @__PURE__ */ jsxs("div", { className: styles.checkGuidance, children: [
+    /* @__PURE__ */ jsx(
+      Image,
+      {
+        lazyLoadedImage: usCheckAccount,
+        className: cx(styles.checkGuidanceImage, styles.checkGuidanceAnnotated, {
+          [styles.checkGuidanceInactive]: annotated !== "account"
+        })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      Image,
+      {
+        lazyLoadedImage: usCheckRouting,
+        className: cx(styles.checkGuidanceImage, styles.checkGuidanceAnnotated, {
+          [styles.checkGuidanceInactive]: annotated !== "routing"
+        })
+      }
+    ),
+    /* @__PURE__ */ jsx(Image, { lazyLoadedImage: usCheck, className: styles.checkGuidanceImage })
+  ] });
+};
+const payoutAccountFields = [
+  "accountHolder",
+  ...ibanFields,
+  ...branchCodeFields,
+  ...swiftCodeFields,
+  ...bankAccountNumberFields,
+  ...bankNameFields,
+  ...bankCodeFields
+];
+const defaultArray = [];
+function PayoutAccount(props) {
+  const accountFormat = payoutAccountFormat.value;
+  const { t } = useTranslation("banking");
+  const { t: commonT } = useTranslation("common");
+  const { i18n } = useI18nContext();
+  const [checkAnnotation, setCheckAnnotation] = useState();
+  const { isSettingEnabled } = useSettingsContext();
+  const bankAccountFormatSelectionAllowed = isSettingEnabled(
+    SettingNames.AllowBankAccountFormatSelection
+  );
+  const {
+    heading,
+    country,
+    id,
+    legalEntityResponse,
+    requiredFields = defaultArray,
+    arePayoutAccountDetailsInvalid,
+    invalidFieldNames,
+    formVerificationErrors,
+    fieldValidationErrors
+  } = props;
+  const showCheckGuidance = shouldShowCheckGuidance(country);
+  const formUtils = createFormUtils({ ...props, requiredFields }, commonT);
+  const bankAccountNumberProps = getFieldProps(props, bankAccountNumberFields);
+  const swiftCodeProps = getFieldProps(props, swiftCodeFields);
+  const ibanProps = getFieldProps(
+    props,
+    ibanFields
+  );
+  const branchCodeProps = getFieldProps(props, branchCodeFields);
+  const bankNameProps = getFieldProps(props, bankNameFields);
+  const bankCodeProps = getFieldProps(props, bankCodeFields);
+  const bankCityProps = getFieldProps(props, bankCityFields);
+  const { clearStateSlice } = useGlobalDataSlice(
+    "payoutAccountDetails"
+  );
+  const handleAccountFormatChange = (accountFormat2) => {
+    clearStateSlice();
+    payoutAccountFormat.value = accountFormat2;
+  };
+  return /* @__PURE__ */ jsxs("form", { className: "adyen-kyc-individual__payout-account", "aria-describedby": "ariaErrorField", children: [
+    /* @__PURE__ */ jsx(FormHeader, { heading, children: /* @__PURE__ */ jsx(
+      AccountHolderDescriptionFragment,
+      {
+        slot: "description",
+        legalEntityResponse
+      }
+    ) }),
+    /* @__PURE__ */ jsx(
+      ErrorPanel,
+      {
+        verificationErrors: formVerificationErrors,
+        validationErrors: fieldValidationErrors,
+        formUtils,
+        id: "ariaErrorField"
+      }
+    ),
+    showCheckGuidance ? /* @__PURE__ */ jsx(CheckGuidance, { annotated: checkAnnotation }) : void 0,
+    bankAccountFormatSelectionAllowed && shouldShowPayoutAccountFormatSelector(country) && accountFormat && /* @__PURE__ */ jsx(
+      BankAccountFormat,
+      {
+        bankAccountFormat: accountFormat,
+        handleAccountFormatChange
+      }
+    ),
+    formUtils.isRequiredField("branchCode") && /* @__PURE__ */ jsx(
+      BranchCode,
+      {
+        ...branchCodeProps,
+        country,
+        dataStoreId: id,
+        onFocus: showCheckGuidance ? () => setCheckAnnotation("routing") : void 0,
+        onBlur: showCheckGuidance ? () => setCheckAnnotation(void 0) : void 0
+      }
+    ),
+    formUtils.isRequiredField("bankAccountNumber") && /* @__PURE__ */ jsx(
+      BankAccountNumber,
+      {
+        ...bankAccountNumberProps,
+        country,
+        dataStoreId: id,
+        onFocus: showCheckGuidance ? () => setCheckAnnotation("account") : void 0,
+        onBlur: showCheckGuidance ? () => setCheckAnnotation(void 0) : void 0
+      }
+    ),
+    formUtils.isRequiredField("iban") && /* @__PURE__ */ jsx(Iban, { ...ibanProps, dataStoreId: id, country }),
+    formUtils.isRequiredField("swiftCode") && /* @__PURE__ */ jsx(SwiftCode, { ...swiftCodeProps, dataStoreId: id }),
+    formUtils.isRequiredField("bankName") && /* @__PURE__ */ jsx(BankName, { ...bankNameProps, dataStoreId: id }),
+    formUtils.isRequiredField("bankCode") && /* @__PURE__ */ jsx(BankCode, { ...bankCodeProps, country, dataStoreId: id }),
+    formUtils.isRequiredField("bankCity") && /* @__PURE__ */ jsx(BankCity, { ...bankCityProps, dataStoreId: id }),
+    shouldShowPayoutAlert(country) && /* @__PURE__ */ jsx(
+      Alert,
+      {
+        title: getSupportedCurrencyGuidance(i18n, country, requiredFields),
+        className: "adyen-kyc-u-margin-bottom-8"
+      }
+    ),
+    /* @__PURE__ */ jsx(Typography, { variant: "caption", color: "tertiary", children: t(($) => $["thisAccountWillBeVerifiedToPrevent"]) }),
+    arePayoutAccountDetailsInvalid && /* @__PURE__ */ jsx(
+      Alert,
+      {
+        className: "adyen-kyc-u-margin-top-16",
+        variant: "error",
+        title: invalidFieldNames ? t(($) => $["pleaseEnterValidField"], {
+          fieldNames: invalidFieldNames
+        }) : t(($) => $["pleaseEnterValidAccountDetails"])
+      }
+    )
+  ] });
+}
+const regions = {
+  europe: [
+    ...EEA_Countries,
+    CountryCodes.Switzerland,
+    CountryCodes.UnitedKingdom,
+    CountryCodes.Gibraltar
+  ],
+  apac: [CountryCodes.NewZealand, CountryCodes.Australia]
+};
+const getAllowedBankCountries = (country) => Object.values(regions).find((countriesInARegion) => countriesInARegion.includes(country)) ?? [
+  country
+];
+const tinkLogo = lazy(() => import("./tink-logo-BcIv93ND.js"));
+const plaidLogo = lazy(() => import("./plaid-logo-CtActXTN.js"));
+const yapilyLogo = lazy(() => import("./yapily-logo-CZ4ywjwA.js"));
+const instantVerificationImage = lazy(
+  () => import("./instant-verification-Dvvkyfmp.js")
+);
+const manualVerificationImage = lazy(
+  () => import("./manual-verification-BvZWqA00.js")
+);
+const getProviderIconName = (providerName) => {
+  switch (providerName?.toLowerCase()) {
+    case "tink":
+      return tinkLogo;
+    case "plaid":
+      return plaidLogo;
+    case "yapily":
+      return yapilyLogo;
+    default:
+      return void 0;
+  }
+};
+const makePayoutVerificationMethodsMetadata = (instantVerificationProviderName) => ({
+  instantVerification: {
+    name: "verifyViaMobileBankingAppOrWebsite",
+    subtitle: "instant",
+    description: "instantVerificationDescription",
+    svgImport: instantVerificationImage,
+    provider: instantVerificationProviderName ? {
+      name: instantVerificationProviderName,
+      svgImport: getProviderIconName(instantVerificationProviderName)
+    } : void 0
+  },
+  manualVerification: {
+    name: "uploadABankStatement",
+    subtitle: "mayTakeAFewDays",
+    description: "manualVerificationDescription",
+    svgImport: manualVerificationImage
+  }
+});
+const payoutVerificationMethods = ["instantVerification", "manualVerification"];
+const PayoutVerificationMethodOptionFooter = ({
+  method,
+  methodsMetadata
+}) => {
+  const { i18n } = useI18nContext();
+  const { provider } = methodsMetadata[method];
+  return provider ? /* @__PURE__ */ jsxs(Typography, { variant: "caption", className: "adyen-kyc-field-verification-methods__footer", children: [
+    i18n.get("poweredBy"),
+    provider.svgImport ? /* @__PURE__ */ jsx(
+      Image,
+      {
+        className: "adyen-kyc-field-verification-methods__logo",
+        lazyLoadedImage: provider.svgImport
+      }
+    ) : ` ${provider.name}`
+  ] }) : null;
+};
+const payoutVerificationMethodFields = ["payoutVerificationMethod", "bankCountry", ...accountVerificationFields];
+const getMustHaveSameAccountHolderNameTransKey = (legalEntityType) => {
+  switch (legalEntityType) {
+    case LegalEntityTypes.INDIVIDUAL:
+    case LegalEntityTypes.SOLE_PROPRIETORSHIP:
+      return "theBankAccountHolderMustBeInYourName";
+    case LegalEntityTypes.ORGANIZATION:
+    case LegalEntityTypes.TRUST:
+    case LegalEntityTypes.UNINCORPORATED_PARTNERSHIP:
+      return "theBankAccountHolderMustHaveTheSameNameAsYourCompany";
+  }
+};
+function PayoutVerificationMethod(props) {
+  const {
+    heading,
+    country,
+    accountHolder,
+    provider,
+    bankVendorsLoadingStatus,
+    instantVerificationAvailable,
+    legalEntityResponse,
+    validators,
+    bankInfoValidated,
+    data: payoutVerificationMethodData,
+    fieldValidationErrors,
+    formVerificationErrors
+  } = props;
+  const { type: legalEntityType } = legalEntityResponse;
+  const { t } = useTranslation("banking");
+  const { t: commonT } = useTranslation("common");
+  const instantVerificationError = useContext(InstantVerificationErrorContext);
+  const { isSettingEnabled } = useSettingsContext();
+  const { isExperimentEnabled } = useExperimentsContext();
+  const canChangeEntityType = isSettingEnabled(SettingNames.AllowLegalEntityTypeChange);
+  const intraRegionCrossBorderPayoutsAllowed = isSettingEnabled(
+    SettingNames.AllowIntraRegionCrossBorderPayout
+  );
+  const enabledUnbiasedVerificationMethod = isExperimentEnabled(
+    "BankVerificationMethodAutonomy_UnbiasedSelection"
+  );
+  const [hasSelectedMethod, setHasSelectedMethod] = useState(false);
+  const { handleChangeFor, data, valid, errors, fieldProblems } = useForm({
+    ...props,
+    schema: payoutVerificationMethodFields,
+    defaultData: {
+      verifiedAccountHolder: accountHolder,
+      verifiedCurrencyCode: currencyByCountry[country]?.[0],
+      bankCountry: country,
+      ...payoutVerificationMethodData
+    },
+    rules: validators || {
+      payoutVerificationMethod: {
+        modes: ["blur"],
+        validate: (payoutVerificationMethod) => !enabledUnbiasedVerificationMethod || !!payoutVerificationMethod
+      }
+    },
+    fieldProblems: fieldValidationErrors
+  });
+  const formUtils = createFormUtils(props, commonT);
+  const { sliceData, updateStateSlice } = useGlobalDataSlice("payoutVerificationMethod");
+  const { clearStateSlice: clearPayoutAccountDetails } = useGlobalDataSlice("payoutAccountDetails");
+  useEffect(
+    () => updateStateSlice({ data: { ...sliceData, ...data }, errors, valid, fieldProblems }),
+    [data, errors, fieldProblems, valid]
+  );
+  const methodsMetadata = makePayoutVerificationMethodsMetadata(provider?.name);
+  const selectVerificationMethod = (method) => {
+    setHasSelectedMethod(true);
+    handleChangeFor("payoutVerificationMethod")(method);
+  };
+  useEffect(() => {
+    if (bankInfoValidated || enabledUnbiasedVerificationMethod) return;
+    if (!hasSelectedMethod && instantVerificationAvailable && data.payoutVerificationMethod !== "instantVerification") {
+      handleChangeFor("payoutVerificationMethod")("instantVerification");
+    }
+    if (!instantVerificationAvailable && data.payoutVerificationMethod !== "manualVerification") {
+      handleChangeFor("payoutVerificationMethod")("manualVerification");
+    }
+  }, [
+    data.payoutVerificationMethod,
+    handleChangeFor,
+    instantVerificationAvailable,
+    hasSelectedMethod,
+    bankInfoValidated
+  ]);
+  const { dataset: countries } = useDataset(datasetIdentifier.country);
+  const bankCountryName = countries.find((country2) => country2.id === data.bankCountry)?.name ?? data.bankCountry;
+  const allowedBankCountries = getAllowedBankCountries(country);
+  const countryField = /* @__PURE__ */ jsx(
+    CountryField,
+    {
+      data: { country: data.bankCountry },
+      valid: { country: valid?.bankCountry },
+      errors: { country: formUtils.getErrorMessage("bankCountry", errors, fieldProblems) },
+      labels: { country: formUtils.getLabel("bankCountry", "bankAccountCountryRegion") },
+      readonly: !intraRegionCrossBorderPayoutsAllowed || allowedBankCountries.length === 1 || bankInfoValidated,
+      allowedCountries: allowedBankCountries,
+      handleChangeFor: () => (e) => {
+        clearPayoutAccountDetails();
+        return handleChangeFor("bankCountry", "input")(e);
+      },
+      helperText: {
+        country: intraRegionCrossBorderPayoutsAllowed ? void 0 : t(
+          ($) => $[legalEntityType === LegalEntityTypes.INDIVIDUAL ? "youCanOnlyUseABankAccountInTheCountryRegionWhereYouLive" : "youCanOnlyUseABankAccountInTheCountryRegionWhereYourCompanyIsRegistered"]
+        )
+      }
+    }
+  );
+  const description = canChangeEntityType ? /* @__PURE__ */ jsx(AccountHolderDescriptionFragment, { legalEntityResponse }) : /* @__PURE__ */ jsxs(Typography, { children: [
+    t(($) => $["forYouToReceiveYourPayouts"]),
+    " ",
+    /* @__PURE__ */ jsx(
+      Trans,
+      {
+        t,
+        ns: "banking",
+        i18nKey: ($) => $[getMustHaveSameAccountHolderNameTransKey(legalEntityType)],
+        values: { name: accountHolder, companyName: accountHolder }
+      }
+    )
+  ] });
+  return /* @__PURE__ */ jsxs("form", { className: "adyen-kyc-payout-verification-method", children: [
+    /* @__PURE__ */ jsx(FormHeader, { heading, children: /* @__PURE__ */ jsx("div", { slot: "description", className: "adyen-kyc-u-margin-bottom-12", children: description }) }),
+    instantVerificationError && /* @__PURE__ */ jsx(
+      Alert,
+      {
+        variant: "error",
+        className: "adyen-kyc-instant-verification-error",
+        title: instantVerificationError.title,
+        children: instantVerificationError.content && /* @__PURE__ */ jsx("p", { className: "adyen-kyc-u-margin-0", children: instantVerificationError.content })
+      }
+    ),
+    countryField,
+    /* @__PURE__ */ jsx(
+      Field,
+      {
+        el: "fieldset",
+        name: "verificationMethods",
+        label: formUtils.getLabel("payoutVerificationMethod", "verificationMethod"),
+        errorMessage: formUtils.getErrorMessage("payoutVerificationMethod", errors, fieldProblems),
+        helper: instantVerificationAvailable ? void 0 : t(($) => $["weDoNotYetSupportInstantVerificationForBankAccountsIn"], {
+          countryName: bankCountryName
+        }),
+        children: (childProps) => /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
+          RadioGroupCard,
+          {
+            ...childProps,
+            name: "verificationMethod",
+            options: payoutVerificationMethods,
+            onSelect: selectVerificationMethod,
+            selected: data.payoutVerificationMethod,
+            optionId: (method) => method,
+            optionName: (method) => methodsMetadata[method].name,
+            optionDescription: (method) => methodsMetadata[method].description,
+            optionSubtitle: (method) => methodsMetadata[method].subtitle,
+            className: "adyen-kyc-field-verification-methods",
+            optionClassNames: () => ({
+              label: "adyen-kyc-field-verification-methods__card"
+            }),
+            isOptionDisabled: (option) => bankInfoValidated || option === "instantVerification" && !instantVerificationAvailable,
+            renderOptionIcon: (method) => /* @__PURE__ */ jsx("div", { className: "adyen-kyc-radio-group-card__illustration", children: methodsMetadata[method]?.svgImport && /* @__PURE__ */ jsx(Image, { lazyLoadedImage: methodsMetadata[method].svgImport }) }),
+            renderOptionFooter: (method) => /* @__PURE__ */ jsx(
+              PayoutVerificationMethodOptionFooter,
+              {
+                method,
+                methodsMetadata
+              }
+            ),
+            floatingRadio: true
+          }
+        ) })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      ErrorPanel,
+      {
+        verificationErrors: formVerificationErrors,
+        validationErrors: fieldValidationErrors,
+        formUtils,
+        id: "ariaErrorField"
+      }
+    ),
+    provider && bankVendorsLoadingStatus === "success" ? /* @__PURE__ */ jsx(
+      ContextGuidance,
+      {
+        titleId: "howDoesVerificationWithOurPartnerWorks",
+        contentId: "bankVerificationWithPartnerSteps",
+        title: t(($) => $["howDoesVerificationWithOurPartnerWork"], {
+          provider: provider.name
+        }),
+        content: /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(Typography, { children: t(($) => $["isOurTrustedPartnerHelpingSpeedUpSetup"], {
+            provider: provider.name
+          }) }),
+          /* @__PURE__ */ jsxs("ul", { children: [
+            /* @__PURE__ */ jsx("li", { children: t(($) => $["selectTheBankToReceivePayouts"]) }),
+            /* @__PURE__ */ jsx("li", { children: t(($) => $["loginIntoYourBankingEnvironment"]) }),
+            /* @__PURE__ */ jsx("li", { children: t(($) => $["yourBankWillConfirmYourAccountDetails"]) })
+          ] }),
+          /* @__PURE__ */ jsx(Typography, { children: t(($) => $["adyenWillOnlyGetTemporaryAccess"]) }),
+          /* @__PURE__ */ jsx(Typography, { variant: "caption", children: /* @__PURE__ */ jsx(Link, { href: "https://www.adyen.com/policies-and-disclaimer/privacy-policy", external: true, children: commonT(($) => $["adyenPrivacyPolicy"]) }) })
+        ] })
+      }
+    ) : void 0
+  ] });
+}
+const payoutSteps = {
+  payoutVerificationMethod: {
+    formId: "payoutVerificationMethod",
+    formName: "verificationMethod",
+    fields: payoutVerificationMethodFields
+  },
+  payoutAccountDetails: {
+    formId: "payoutAccountDetails",
+    formName: "bankAccount",
+    fields: payoutAccountFields
+  },
+  payoutAccountDocuments: {
+    formId: "payoutAccountDocuments",
+    formName: "bankDocument",
+    formHeader: "bankDocumentHeader",
+    formDescription: "bankDocumentDescription",
+    fields: bankDocumentFields
+  },
+  payoutAccountVerification: {
+    formId: "payoutAccountVerification",
+    formName: "instantVerification",
+    fields: accountVerificationFields
+  }
+};
+const PayoutVerificationMethodFormID = payoutSteps.payoutVerificationMethod.formId;
+const PayoutAccountDocumentsFormID = payoutSteps.payoutAccountDocuments.formId;
+const PayoutAccountVerificationFormID = payoutSteps.payoutAccountVerification.formId;
+function PayoutDetails(props) {
+  const { t } = useTranslation("banking");
+  const { t: commonT } = useTranslation("common");
+  const {
+    activeForm,
+    legalEntityResponse,
+    associatedLegalArrangement,
+    provider,
+    bankVendorsLoadingStatus,
+    instantVerificationAvailable,
+    setHideSidebar,
+    setSkipSubmit,
+    createTrustedTransferInstrument: createTrustedTransferInstrument2,
+    accountDetailsFromInput,
+    country,
+    accountHolder,
+    data: propData,
+    onBack,
+    trustedTransferInstrumentId
+  } = props;
+  const [instantVerificationError, setInstantVerificationError] = useInstantVerificationErrorNotification(1e4);
+  const verificationMethodFormProps = getFormProps(props, PayoutVerificationMethodFormID);
+  const accountVerificationFormProps = getFormProps(props, PayoutAccountVerificationFormID);
+  const payoutAccountFormProps = getFormProps(props, payoutSteps.payoutAccountDetails.formId);
+  const bankDocumentFormProps = getFormProps(props, PayoutAccountDocumentsFormID);
+  const taskHeading = t(($) => $["addABankAccountForPayouts"]);
+  const isBankStatementDocumentOptional = createFormUtils(
+    bankDocumentFormProps ?? {},
+    commonT
+  ).isOptionalField("bankStatementDocument");
+  const globalData = useGlobalData();
+  const data = isEmpty(globalData) || propData?.payoutAccountDetails?.transferInstrumentId ? propData : globalData;
+  const resetData = useResetGlobalData();
+  const verifyInstantly = data?.payoutVerificationMethod?.payoutVerificationMethod === "instantVerification";
+  const bankCountry = data?.payoutVerificationMethod?.bankCountry ?? country;
+  const bankDocumentDescription = t(
+    ($) => $[legalEntityResponse.type === "individual" ? "toHelpVerifyYourBankDetailsIndividual" : "toHelpVerifyYourBankDetailsBusiness"]
+  );
+  useEffect(() => resetData(), [resetData]);
+  useEffect(() => {
+    if (activeForm?.formId === summaryStep.formId && verifyInstantly && trustedTransferInstrumentId) {
+      setSkipSubmit?.(true);
+    }
+  }, [activeForm, trustedTransferInstrumentId]);
+  const [bankInfoValidated, setBankInfoValidated] = useState(false);
+  const [arePayoutAccountDetailsInvalid, setArePayoutAccountDetailsInvalid] = useState(false);
+  const [invalidFieldNames, setInvalidFieldNames] = useState("");
+  const payload = useMemo(
+    () => bankCountry && accountDetailsFromInput ? getAccountIdentificationFromPayoutAccountSchema(accountDetailsFromInput, bankCountry) : {},
+    [accountDetailsFromInput, bankCountry]
+  );
+  const validateAccountDetails = useAsyncAccountDetailsValidationRules(
+    payload,
+    hasEmptyFields(payload),
+    isAccountIdentifierObscured(payload)
+  );
+  const resetInvalidFieldState = () => {
+    setInvalidFieldNames("");
+    setArePayoutAccountDetailsInvalid(false);
+  };
+  useEffect(() => {
+    if (validateAccountDetails?.invalidFields && validateAccountDetails.invalidFields.length > 0) {
+      const fieldNames = validateAccountDetails.invalidFields.map((field) => extractFieldName(field.name)).map((key) => commonT(($) => $[key]));
+      const invalidFieldsString = concatenateFieldNames(fieldNames);
+      setInvalidFieldNames(invalidFieldsString);
+      setArePayoutAccountDetailsInvalid(true);
+    } else {
+      resetInvalidFieldState();
+    }
+  }, [t, validateAccountDetails]);
+  return /* @__PURE__ */ jsxs("div", { className: "adyen-kyc-payout", children: [
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: activeForm?.formId !== PayoutVerificationMethodFormID ? "adyen-kyc-form-wrapper adyen-kyc-form-wrapper--hidden" : "adyen-kyc-form-wrapper",
+        children: /* @__PURE__ */ jsx(InstantVerificationErrorContext.Provider, { value: instantVerificationError, children: /* @__PURE__ */ jsx(
+          PayoutVerificationMethod,
+          {
+            ...verificationMethodFormProps,
+            id: PayoutVerificationMethodFormID,
+            heading: taskHeading,
+            country,
+            accountHolder,
+            legalEntityResponse,
+            provider,
+            bankVendorsLoadingStatus,
+            bankInfoValidated,
+            instantVerificationAvailable
+          }
+        ) })
+      }
+    ),
+    verifyInstantly ? /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: activeForm?.formId !== PayoutAccountVerificationFormID ? "adyen-kyc-form-wrapper adyen-kyc-form-wrapper--hidden" : "adyen-kyc-form-wrapper",
+        children: /* @__PURE__ */ jsx(
+          BankVerification,
+          {
+            ...accountVerificationFormProps,
+            heading: t(($) => $["bankAccountVerification"]),
+            id: PayoutAccountVerificationFormID,
+            provider,
+            country: bankCountry,
+            onBack,
+            hideSidebar: setHideSidebar,
+            setBankVerificationError: setInstantVerificationError,
+            bankInfoValidated,
+            setBankInfoValidated,
+            formIsActive: activeForm?.formId === PayoutAccountVerificationFormID,
+            createTrustedTransferInstrument: createTrustedTransferInstrument2
+          }
+        )
+      }
+    ) : /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: activeForm?.formId !== payoutSteps.payoutAccountDetails.formId ? "adyen-kyc-form-wrapper adyen-kyc-form-wrapper--hidden" : "adyen-kyc-form-wrapper",
+          children: /* @__PURE__ */ jsx(
+            PayoutAccount,
+            {
+              ...payoutAccountFormProps,
+              heading: taskHeading,
+              id: payoutSteps.payoutAccountDetails.formId,
+              country: bankCountry,
+              legalEntityResponse,
+              arePayoutAccountDetailsInvalid,
+              invalidFieldNames
+            }
+          )
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: activeForm?.formId !== PayoutAccountDocumentsFormID ? "adyen-kyc-form-wrapper adyen-kyc-form-wrapper--hidden" : "adyen-kyc-form-wrapper",
+          children: /* @__PURE__ */ jsx(
+            MemoizedBankDocument,
+            {
+              ...bankDocumentFormProps,
+              heading: t(
+                ($) => $[isBankStatementDocumentOptional ? "uploadABankDocumentOptional" : "uploadABankDocument"]
+              ),
+              description: bankDocumentDescription,
+              id: PayoutAccountDocumentsFormID,
+              legalEntity: legalEntityResponse,
+              associatedLegalArrangement,
+              country: bankCountry,
+              formIsActive: activeForm?.formId === PayoutAccountDocumentsFormID
+            }
+          )
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx(Show, { when: showPayoutVerificationMethodError, children: /* @__PURE__ */ jsx(
+      Confirm,
+      {
+        analyticsEventLabel: "payoutVerificationMethodError",
+        title: t(($) => $["toContinuePleaseChooseAVerificationMethod"]),
+        confirmText: commonT(($) => $["ok"]),
+        onConfirm: () => {
+          showPayoutVerificationMethodError.value = false;
+        }
+      }
+    ) })
+  ] });
+}
+const rules = ({
+  data,
+  requiredFields,
+  isExperimentEnabled
+}) => createFormRules({
+  whenUsingManualVerification: () => {
+    if (!data.payoutVerificationMethod) return;
+    if (data?.payoutVerificationMethod?.payoutVerificationMethod === "manualVerification") {
+      return "REQUIRED";
+    }
+  },
+  whenUsingInstantVerification: () => {
+    if (!data.payoutVerificationMethod) {
+      return "REQUIRED";
+    }
+    if (data?.payoutVerificationMethod?.payoutVerificationMethod === "instantVerification") {
+      return "REQUIRED";
+    }
+  },
+  verifiedBankAccountNumber: () => {
+    if (data?.payoutVerificationMethod?.payoutVerificationMethod === "instantVerification") {
+      return "REQUIRED";
+    }
+  },
+  bankStatementRequirement: () => {
+    if (data?.payoutVerificationMethod?.payoutVerificationMethod !== "instantVerification" && (isExperimentEnabled?.("EnableCheckOnCreateBankAccount") || isExperimentEnabled?.("BankVerificationFlowOptimization_CAASIntegration"))) {
+      return "REQUIRED";
+    }
+    if (data?.payoutVerificationMethod?.payoutVerificationMethod === "manualVerification") {
+      return requiredFields?.bankStatementRequirement;
+    }
+  },
+  // "bankStatement description" field is always "optional" and it's coupled with bank statement document.
+  bankStatementDescription: () => {
+    if (data?.payoutVerificationMethod?.payoutVerificationMethod === "manualVerification" && !!requiredFields?.bankStatementRequirement) {
+      return "OPTIONAL";
+    }
+  }
+});
+const mapApiDocumentToPayoutDocuments = (entityId) => {
+  const bankStatement = getDocument(entityId, "bankStatement");
+  if (!bankStatement) throw new Error(`bankStatement with id ${entityId} not found`);
+  return {
+    bankStatementDocument: [mapExistingFile(getPageName(bankStatement))],
+    description: bankStatement.description
+  };
+};
+const mapPayoutDetailsToTransferInstrument = ({
+  data,
+  legalEntity
+}) => {
+  if (!data.payoutAccountDetails || !data.payoutVerificationMethod) {
+    throw new Error("Missing payout details data");
+  }
+  return {
+    bankAccount: mapPayoutAccountSchemaToApiBankAccount(
+      data.payoutAccountDetails,
+      data.payoutVerificationMethod.bankCountry
+    ),
+    legalEntityId: legalEntity.id,
+    type: "bankAccount"
+  };
+};
+const mapPayoutDocumentsToApiDocuments = async (data, entityId) => {
+  const { bankStatementDocument, description } = data.payoutAccountDocuments ?? {};
+  if (!bankStatementDocument) {
+    throw new Error("Bank statement document missing");
+  }
+  const page1 = bankStatementDocument[0];
+  if (!page1) {
+    throw new Error("Document needs at least one page");
+  }
+  const existingDocument = getDocument(entityId, "bankStatement");
+  return await createDocumentRequest({
+    entityId,
+    entityType: "bankAccount",
+    documentType: "bankStatement",
+    page1,
+    description,
+    existingDocument
+  });
+};
+const CUSTOM_LABELS = {
+  verifiedAccountHolder: "accountHolder",
+  verifiedBankCountry: "bankCountry",
+  verifiedBankName: "bankName",
+  verifiedCurrencyCode: "currencyCode",
+  verifiedBankAccountNumber: "bankAccountNumber"
+};
+const 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;
+};
+const obscuredPayoutFields = ["bankAccountNumber", "iban"];
+const payoutDetailsCountryConfig = {
+  [CountryCodes.Canada]: {
+    bankStatementDocument: {
+      label: "listitemVoidedChequeBankLetterBankStatementOnline"
+    }
+  },
+  [CountryCodes.UnitedKingdom]: {
+    bankCity: {
+      label: "bankCityTown"
+    },
+    bankStatementDocument: {
+      label: "listitemVoidedChequeBankLetterBankStatementOnline"
+    }
+  }
+};
+const parseConfiguration = ({
+  requiredFields,
+  country,
+  bankVerificationAvailable
+}) => parsePayoutScenarios({
+  requiredFields: requiredFields?.fields,
+  country,
+  bankVerificationAvailable
+});
+function parsePayoutScenarios({
+  requiredFields,
+  country,
+  bankVerificationAvailable
+}) {
+  if (!requiredFields) return {};
+  let formConfig = {
+    payoutVerificationMethod: {
+      rule: "REQUIRED"
+    },
+    bankCountry: {
+      rule: "REQUIRED"
+    },
+    bankStatementDocument: {
+      rule: "bankStatementRequirement"
+    },
+    description: {
+      rule: "bankStatementDescription"
+    }
+  };
+  requiredFields.forEach((fieldName) => {
+    formConfig[fieldName] = {
+      rule: bankVerificationAvailable ? "whenUsingManualVerification" : "REQUIRED",
+      obscured: obscuredPayoutFields.includes(fieldName)
+    };
+  });
+  if (bankVerificationAvailable) {
+    formConfig = {
+      ...formConfig,
+      verifiedAccountHolder: {
+        rule: "whenUsingInstantVerification"
+      },
+      verifiedBankCountry: {
+        rule: "whenUsingInstantVerification"
+      },
+      verifiedBankName: {
+        rule: "whenUsingInstantVerification"
+      },
+      verifiedCurrencyCode: {
+        rule: "whenUsingInstantVerification"
+      },
+      verifiedBankAccountNumber: {
+        rule: "whenUsingInstantVerification"
+      }
+    };
+  }
+  return augmentWithCountryConfigs(payoutDetailsCountryConfig[country], formConfig);
+}
+const getAppropriatePayoutDetailsSteps = (isEditing, instantVerificationAvailable, canChangeCountry) => {
+  const dependentSteps = {
+    payoutAccountDetails: payoutSteps.payoutAccountDetails,
+    payoutAccountDocuments: payoutSteps.payoutAccountDocuments,
+    payoutAccountVerification: payoutSteps.payoutAccountVerification
+  };
+  if (!isEditing && (instantVerificationAvailable || canChangeCountry)) {
+    return {
+      payoutVerificationMethod: payoutSteps.payoutVerificationMethod,
+      ...dependentSteps
+    };
+  }
+  return dependentSteps;
+};
+const getInvalidFieldsErrorHeader = (invalidField) => {
+  switch (invalidField) {
+    case "LEGAL_BUSINESS_NAME":
+    case "FIRST_NAME":
+    case "LAST_NAME":
+      return "caasBankAccountHolderDoesNotMatch";
+    default:
+      return "weCouldntCompleteTheAccountCheck";
+  }
+};
+const getInvalidFieldsErrorContent = (invalidField) => {
+  switch (invalidField) {
+    case "LEGAL_BUSINESS_NAME":
+      return "caasBankAccountMustBeInYourNameYourBusinessLegalNameOrDoingBusinessAs";
+    case "FIRST_NAME":
+    case "LAST_NAME":
+      return "caasBankAccountMustBeInYourName";
+    default:
+      return "weCouldntCompleteTheAccountCheck";
+  }
+};
+const defaultInvalidErrorMessage = {
+  header: "weCouldntCompleteTheAccountCheck",
+  content: "weCouldntCompleteTheAccountCheck"
+};
+const 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)
+  };
+};
+const getPayoutVerificationMethod = (transferInstrument, instantVerificationEnabled, enabledUnbiasedVerificationMethod) => {
+  if (transferInstrument) {
+    return "manualVerification";
+  } else {
+    return enabledUnbiasedVerificationMethod || !instantVerificationEnabled ? void 0 : "instantVerification";
+  }
+};
+function PayoutDetailsDropin({
+  legalEntityResponse,
+  associatedLegalArrangement,
+  problems: propProblems,
+  onSubmit: externalOnSubmit,
+  onChange,
+  asModal = false,
+  handleCloseClick,
+  taskType: propTaskType,
+  handleHomeClick,
+  currentTransferInstrumentId,
+  setCurrentTransferInstrumentId,
+  navigateBackToTaskList,
+  handleBackClick: externalBackClick,
+  hideSidebar,
+  openBankingPartnerConfigId
+}) {
+  const { baseUrl, rootLegalEntityId } = useApiContext();
+  const {
+    data: transferInstrument,
+    refetch: refetchTransferInstrument,
+    isLoading: isTransferInstrumentLoading
+  } = useTransferInstrument(currentTransferInstrumentId ?? skipToken);
+  const { mutateAsync: handleUpdateTransferInstrument } = useUpdateTransferInstrument();
+  const {
+    mutateAsync: handleCreateTrustedTransferInstrument,
+    status: createTrustedTransferInstrumentStatus
+  } = useCreateTrustedTransferInstrument();
+  const [previousTrustedInstrumentStatus, setPreviousTrustedInstrumentStatus] = useState(
+    createTrustedTransferInstrumentStatus
+  );
+  const { t, i18n: i18next } = useTranslation("common");
+  const { i18n } = useI18nContext();
+  const userEvents = useAnalyticsContext();
+  const { showToast, clearToasts } = useToastContext();
+  const { isExperimentEnabled } = useExperimentsContext();
+  const { isSettingEnabled } = useSettingsContext();
+  const defaultPayoutCountry = getLegalEntityCountry(legalEntityResponse);
+  const existingPayoutDetails = useMemo(
+    () => transferInstrument ? mapTransferInstrumentToPayoutAccount(transferInstrument) : void 0,
+    [transferInstrument]
+  );
+  const [documents, setDocuments] = useState();
+  const [isCaasCalled, setIsCaasCalled] = useState(false);
+  const enableCheckOnCreateBankAccount = isExperimentEnabled("EnableCheckOnCreateBankAccount") || isExperimentEnabled("BankVerificationFlowOptimization_CAASIntegration");
+  const enabledUnbiasedVerificationMethod = isExperimentEnabled(
+    "BankVerificationMethodAutonomy_UnbiasedSelection"
+  );
+  const accountHolder = getPayoutAccountHolderName(legalEntityResponse, t);
+  const fallbackCurrency = currencyByCountry[defaultPayoutCountry]?.[0];
+  const accountHolderName = accountHolder || getLegalEntityNameBasedOnType(legalEntityResponse);
+  const instantVerificationEnabled = Boolean(
+    !isTransferInstrumentLoading && !transferInstrument && isSettingEnabled("instantBankVerification")
+  );
+  const taskType = propTaskType ?? TaskTypes.PAYOUT;
+  const [trustedTransferInstrumentId, setTrustedTransferInstrumentId] = useState();
+  const prefilledData = {
+    payoutAccountDetails: {
+      accountHolder: accountHolderName,
+      currency: fallbackCurrency,
+      ...existingPayoutDetails?.payoutAccountDetails
+    },
+    payoutVerificationMethod: {
+      payoutVerificationMethod: getPayoutVerificationMethod(
+        transferInstrument,
+        instantVerificationEnabled,
+        enabledUnbiasedVerificationMethod
+      ),
+      bankCountry: defaultPayoutCountry,
+      ...existingPayoutDetails?.payoutVerificationMethod
+    },
+    payoutAccountVerification: {
+      verifiedAccountHolder: accountHolderName,
+      verifiedBankCountry: defaultPayoutCountry,
+      ...existingPayoutDetails?.payoutAccountVerification
+    }
+  };
+  const documentUtils = documentApiUtils({
+    baseUrl: baseUrl.value,
+    rootLegalEntityId: rootLegalEntityId.value
+  });
+  const {
+    state: { currentState }
+  } = useStateContext();
+  const formValidity = currentState.validityByForm;
+  const bankAccountCountry = currentState?.data?.payoutVerificationMethod?.bankCountry ?? defaultPayoutCountry;
+  const [hideFooterAndSidebar, setHideFooterAndSidebar] = useState(false);
+  const [skipSubmit, setSkipSubmit] = useState(false);
+  const [loadingStatus, setLoadingStatus] = useState("loading");
+  const [isSubmitting, setIsSubmitting] = useState(false);
+  const [configurationLoadingStatus, setConfigurationLoadingStatus] = useState("loading");
+  const [data, setData] = useState(prefilledData);
+  const [problems, setProblems] = useState(
+    propProblems || (transferInstrument?.id ? getCapabilityProblems(legalEntityResponse, bankAccountCountry)?.BankAccount?.[transferInstrument.id] : void 0)
+  );
+  const [accountDetailsFromInput, setAccountDetailsFromInput] = useState(
+    prefilledData.payoutAccountDetails
+  );
+  const isMaskedBankAccountNumber = data.payoutAccountDetails?.bankAccountNumber?.includes("*") || data.payoutAccountDetails?.iban?.includes("*");
+  const existingBankAccountFormat = transferInstrument ? existingPayoutDetails?.payoutAccountDetails?.iban ? "iban" : "local" : void 0;
+  const checkAsAServiceAnalyticsProps = {
+    "Experiment name": ExperimentNames.BankVerificationFlowOptimization_CAASIntegration,
+    "Experiment value": enableCheckOnCreateBankAccount ? "TREATMENT" : "CONTROL"
+  };
+  useEffect(() => {
+    userEvents.updateBaseTrackingPayload({ task: taskType });
+    userEvents.addTaskEvent("Landed on page", {
+      actionType: "start",
+      ...checkAsAServiceAnalyticsProps
+    });
+  }, []);
+  useEffect(() => {
+    setData({
+      ...currentState.data,
+      payoutAccountDetails: {
+        ...currentState.data?.payoutAccountDetails,
+        currency: currencyByCountry[bankAccountCountry]?.[0]
+      }
+    });
+    onChange?.(currentState);
+  }, [bankAccountCountry, currentState, onChange]);
+  const {
+    data: providers,
+    refetch: refetchBankVerificationProviders,
+    status: bankVendorsLoadingStatus
+  } = useBankVerificationProviders(
+    {
+      country: bankAccountCountry,
+      configId: openBankingPartnerConfigId,
+      locale: i18next.language
+    },
+    {
+      enabled: instantVerificationEnabled
+    }
+  );
+  const instantVerificationAvailable = useMemo(
+    () => Boolean(instantVerificationEnabled && providers?.[0]?.redirectUrl),
+    [instantVerificationEnabled, providers]
+  );
+  const getPayoutAccountFormatData = useCallback(
+    async () => getAccountFormatsForCountry(bankAccountCountry),
+    [bankAccountCountry]
+  );
+  const { fieldConfigurations, requiredFields } = useScenarioConfiguration({
+    parseConfiguration,
+    legalEntityType: legalEntityResponse.type,
+    getPayoutAccountFormatData,
+    instantVerificationAvailable,
+    setLoadingStatus: setConfigurationLoadingStatus,
+    country: bankAccountCountry,
+    existingBankAccountFormat
+  });
+  const fieldsFromCustomRules = useMemo(
+    () => rules({
+      data,
+      requiredFields,
+      isExperimentEnabled
+    }),
+    [bankAccountCountry, data, taskType, isExperimentEnabled]
+  );
+  const apiBankAccount = useMemo(() => {
+    const payoutAccountDetails = data.payoutAccountDetails ?? { bankAccountNumber: "" };
+    return mapPayoutAccountSchemaToApiBankAccount(payoutAccountDetails, bankAccountCountry);
+  }, [data, bankAccountCountry]);
+  const {
+    data: checkAsAServiceData,
+    refetch: refetchCheckAsAService,
+    isLoading: isCheckAsAServiceLoading,
+    isError: isCheckAsAServiceError
+  } = useCheck(apiBankAccount.accountIdentification, {
+    enabled: false
+  });
+  const checkAsAServiceResultStatus = checkAsAServiceData?.status;
+  const checkAsAServiceResultErrors = checkAsAServiceData?.errors;
+  const [isModalOpen, setIsModalOpen] = useState(false);
+  const payoutDetailsSteps = useMemo(() => {
+    const appropriatePayoutDetailsSteps = getAppropriatePayoutDetailsSteps(
+      Boolean(prefilledData?.payoutAccountDetails?.transferInstrumentId),
+      instantVerificationAvailable,
+      isSettingEnabled(SettingNames.AllowIntraRegionCrossBorderPayout)
+    );
+    const { payoutAccountDocuments: _, ...restOfAppropriatePayoutDetailsSteps } = appropriatePayoutDetailsSteps;
+    if (enableCheckOnCreateBankAccount && !isCheckAsAServiceError && (checkAsAServiceResultStatus === "VALID" || checkAsAServiceResultStatus === void 0) && !isMaskedBankAccountNumber) {
+      return restOfAppropriatePayoutDetailsSteps;
+    }
+    return appropriatePayoutDetailsSteps;
+  }, [
+    providers,
+    enableCheckOnCreateBankAccount,
+    checkAsAServiceResultStatus,
+    isCheckAsAServiceError,
+    isMaskedBankAccountNumber
+  ]);
+  const derivedProps = useMemo(() => {
+    return getPropsFromConfigurations({
+      scenarioConfiguration: fieldConfigurations,
+      forms: payoutDetailsSteps,
+      remediationActions: problems?.remediationActions ? Object.values(problems?.remediationActions) : [],
+      dataMissingErrors: problems?.missingData ?? [],
+      fieldsWithExistingData: [],
+      customRules: fieldsFromCustomRules,
+      legalEntityType: legalEntityResponse.type
+    });
+  }, [
+    fieldConfigurations,
+    payoutDetailsSteps,
+    problems?.remediationActions,
+    problems?.missingData,
+    fieldsFromCustomRules,
+    legalEntityResponse.type
+  ]);
+  useUnifyLoadingStatus(
+    setLoadingStatus,
+    configurationLoadingStatus,
+    // bank vendor loading status only matters when we fetch bank vendors
+    instantVerificationEnabled ? bankVendorsLoadingStatus : "success",
+    isSubmitting ? "loading" : "success"
+  );
+  const forms = useMemo(() => {
+    const requiredForms = getRequiredForms(
+      payoutDetailsSteps,
+      derivedProps?.requiredFields,
+      derivedProps?.optionalFields
+    );
+    return addValidityToForms(requiredForms, formValidity, problems);
+  }, [derivedProps, formValidity, problems, payoutDetailsSteps]);
+  useEffect(() => {
+    if (!transferInstrument?.documentDetails?.length) return;
+    if (transferInstrument.id) {
+      documentUtils.fetchDocuments(transferInstrument.documentDetails, transferInstrument.id).then(() => {
+        setDocuments(mapApiDocumentToPayoutDocuments(transferInstrument.id));
+      }).catch(() => {
+        showToast({ label: i18n.get("failedToFetchRelevantDocuments"), variant: "error" });
+      });
+    }
+  }, [transferInstrument?.documentDetails]);
+  const submitDocuments = async ({
+    forms: forms2,
+    transferInstrument: transferInstrument2,
+    dataSubmitted
+  }) => {
+    const isRequiredDocuments = isDocumentsRequired(forms2);
+    if (isRequiredDocuments) {
+      const documentToUpload = await mapPayoutDocumentsToApiDocuments(
+        dataSubmitted,
+        transferInstrument2.id
+      );
+      if (documentToUpload) {
+        try {
+          const documents2 = await documentUtils.uploadDocuments(
+            [documentToUpload],
+            transferInstrument2.id
+          );
+          documents2.forEach((document2) => {
+            userEvents.addTaskEvent("Success", {
+              actionType: "upload",
+              documentType: dataSubmitted.payoutAccountDocuments?.documentType ?? document2.type,
+              // tracks BankDocumentTypes
+              fileExtention: document2.attachments?.map((item) => getFileExtention(item.pageName ?? "")).filter((item) => item !== void 0) ?? null
+            });
+          });
+        } catch {
+          setProblems({
+            ...problems,
+            validationErrors: {
+              payoutAccountDocuments: { bankStatementDocument: true }
+            }
+          });
+          throw new Error(i18n.get("remediationMessage_1_704"));
+        } finally {
+          await refetchTransferInstrument?.();
+        }
+      }
+    }
+  };
+  useEffect(() => {
+    const payoutAccountData = cloneObject(data)?.payoutAccountDetails;
+    if (payoutAccountData) setAccountDetailsFromInput(payoutAccountData);
+  }, [data]);
+  const onSubmit = async () => {
+    setIsSubmitting(true);
+    const dataSubmitted = cloneObject(data);
+    const { payoutAccountDetails, payoutVerificationMethod } = dataSubmitted;
+    const baseTracking = {
+      actionType: "submit",
+      documentType: "bankStatement",
+      bankCountry: payoutVerificationMethod?.bankCountry ?? defaultPayoutCountry,
+      bankCurrency: payoutAccountDetails?.currency ?? null
+    };
+    let transferInstrumentFromInput = mapPayoutDetailsToTransferInstrument({
+      data: dataSubmitted,
+      legalEntity: legalEntityResponse
+    });
+    transferInstrumentFromInput = omitObscuredFieldsIfUnchanged(
+      ["bankAccount.accountIdentification.accountNumber", "bankAccount.accountIdentification.iban"],
+      transferInstrumentFromInput,
+      transferInstrument
+    );
+    try {
+      if (!transferInstrumentFromInput) return;
+      const response = await (transferInstrument ? handleUpdateTransferInstrument({
+        transferInstrument: transferInstrumentFromInput,
+        transferInstrumentId: transferInstrument.id
+      }) : createTransferInstrument(
+        rootLegalEntityId.value,
+        baseUrl.value,
+        transferInstrumentFromInput
+      ));
+      setCurrentTransferInstrumentId?.(response?.id);
+      userEvents.addTaskEvent("Success", {
+        ...baseTracking,
+        ...checkAsAServiceAnalyticsProps
+      });
+      try {
+        await submitDocuments({ forms, transferInstrument: response, dataSubmitted });
+        clearToasts();
+        externalOnSubmit?.({ ...dataSubmitted, id: response?.id });
+      } catch (e) {
+        showToast({ label: e.message, variant: "error" });
+      } finally {
+        setIsSubmitting(false);
+      }
+    } catch (e) {
+      if (isValidationError(e)) {
+        const validationErrors = processValidationErrors(e, taskType);
+        setProblems({ ...problems, validationErrors });
+      } else if (isIdDocumentUploadError(e)) {
+        showToast({ label: i18n.get("idDocumentAlreadyUploaded"), variant: "error" });
+      } else if (isBankStatementUploadError(e)) {
+        showToast({ label: i18n.get("bankStatementAlreadyUploaded"), variant: "error" });
+      } else if (isMaintenanceModeError(e)) {
+        showToast({
+          label: i18n.get("maintenanceModeMessage"),
+          variant: "error",
+          duration: "indefinite"
+        });
+      } else {
+        const errorTranslatable = mapCreateOrUpdateTransferInstrumentErrorMessageToTranslatable(e);
+        showToast({ label: i18n.get(errorTranslatable), variant: "error" });
+      }
+      setIsSubmitting(false);
+      userEvents.addTaskEvent("Encountered error", {
+        ...baseTracking,
+        returnType: e?.errorCode || "backend",
+        returnValue: e?.title || e?.message,
+        ...checkAsAServiceAnalyticsProps
+      });
+    }
+  };
+  const isDocumentsRequired = (forms2) => forms2.some((form) => form.formId === payoutSteps.payoutAccountDocuments.formId);
+  const formatFileSummaryData = (bankDocuments) => {
+    const bankStatementDocument = bankDocuments?.bankStatementDocument?.[0];
+    return {
+      ...bankStatementDocument && {
+        fileName: bankStatementDocument.name
+      }
+    };
+  };
+  const canSubmit = () => {
+    if (data.payoutVerificationMethod?.payoutVerificationMethod === "instantVerification") {
+      return false;
+    }
+    const bankDetails = data.payoutAccountDetails;
+    return !isEmpty(bankDetails) && Object.values(bankDetails).every(Boolean);
+  };
+  const datasetUtils = datasetUtilities(i18next.language);
+  const formatDataForSummary = () => {
+    const summaryData = cloneObject(data);
+    summaryData.payoutAccountDetails.accountHolder = accountHolderName;
+    if (summaryData.payoutVerificationMethod?.bankCountry && summaryData.payoutAccountDetails) {
+      summaryData.payoutAccountDetails.bankCountry = datasetUtils.getCountryName(
+        summaryData.payoutVerificationMethod.bankCountry
+      );
+    }
+    if (summaryData.payoutAccountDocuments) {
+      summaryData.payoutAccountDocuments.bankStatementDocument = formatFileSummaryData(
+        data?.payoutAccountDocuments
+      );
+    }
+    summaryData.payoutAccountVerification = formatAccountVerificationSummary(
+      data.payoutAccountVerification
+    );
+    return summaryData;
+  };
+  const createTrustedTransferInstrumentHandler = async (code, state) => {
+    try {
+      const trustedTransferInstrument = await handleCreateTrustedTransferInstrument({
+        code,
+        state
+      });
+      if (trustedTransferInstrument) {
+        setTrustedTransferInstrumentId(trustedTransferInstrument.verificationReference);
+        return trustedTransferInstrument;
+      }
+    } catch (e) {
+      refetchBankVerificationProviders();
+      const errorTranslatable = mapCreateOrUpdateTransferInstrumentErrorMessageToTranslatable(e);
+      if (errorTranslatable === "transferInstrumentLimitHasAlreadyBeenMet") {
+        showToast({ label: i18n.get(errorTranslatable), variant: "error" });
+      }
+      throw e;
+    }
+  };
+  const {
+    handleNextClick,
+    handleBackClick,
+    activeForm,
+    setShouldValidate,
+    gotoFormByFormIndex,
+    steps
+  } = useFormComposer({
+    problems,
+    forms,
+    externalBackClick,
+    navigationTrackingParams: {
+      ...checkAsAServiceAnalyticsProps
+    },
+    onSubmit: skipSubmit ? () => {
+      if (trustedTransferInstrumentId) {
+        externalOnSubmit?.({ ...data, id: trustedTransferInstrumentId });
+      }
+      userEvents.addTaskEvent("Success", {
+        actionType: "submit"
+      });
+      navigateBackToTaskList?.();
+    } : onSubmit
+  });
+  useEffect(() => {
+    if (isCaasCalled && forms) {
+      if (checkAsAServiceResultStatus !== "VALID") {
+        const formIndex = forms.findIndex((f) => f.formId === "payoutAccountDocuments");
+        if (formIndex > -1) {
+          gotoFormByFormIndex(formIndex);
+        }
+      }
+      if (checkAsAServiceResultStatus === "VALID") {
+        handleNextClick();
+      }
+    }
+    setIsCaasCalled(false);
+  }, [forms, checkAsAServiceResultStatus, isCaasCalled]);
+  const handleFormNextClick = async () => {
+    if (!data?.payoutVerificationMethod?.payoutVerificationMethod) {
+      showPayoutVerificationMethodError.value = true;
+      return;
+    }
+    if (enableCheckOnCreateBankAccount && activeForm.formId === "payoutAccountDetails" && activeForm.isValid && data.payoutAccountDetails && !isMaskedBankAccountNumber) {
+      try {
+        const { data: response } = await refetchCheckAsAService();
+        setIsCaasCalled(true);
+        if (response?.status === "INCOMPLETE_INPUT") {
+          setIsModalOpen(true);
+        } else {
+          handleNextClick();
+        }
+      } catch {
+        handleNextClick();
+      }
+    } else {
+      handleNextClick();
+    }
+  };
+  if (previousTrustedInstrumentStatus !== createTrustedTransferInstrumentStatus) {
+    if (activeForm.formId === "payoutAccountVerification" && activeForm.isValid && createTrustedTransferInstrumentStatus === "success" && data.payoutAccountVerification?.verifiedBankAccountNumber) {
+      handleNextClick();
+      setPreviousTrustedInstrumentStatus(createTrustedTransferInstrumentStatus);
+    }
+  }
+  const omittedForms = data?.payoutVerificationMethod?.payoutVerificationMethod === "instantVerification" ? [] : [payoutSteps.payoutVerificationMethod.formId];
+  const { header: invalidFieldHeader, content: invalidFieldContent } = getInvalidFieldsErrorMessage(
+    checkAsAServiceResultErrors ?? []
+  );
+  return /* @__PURE__ */ jsxs(
+    LoaderWrapper,
+    {
+      showSpinner: true,
+      status: isCheckAsAServiceLoading || isModalOpen ? "loading" : "success",
+      formOpacityWhenLoading: 0.3,
+      children: [
+        isModalOpen && /* @__PURE__ */ jsx(
+          Confirm,
+          {
+            title: i18n.get(invalidFieldHeader),
+            description: i18n.get(invalidFieldContent),
+            cancelText: i18n.get("editDetails"),
+            confirmText: i18n.get("continueAnyway"),
+            onConfirm: () => {
+              handleNextClick();
+              setIsModalOpen(false);
+            },
+            onCancel: () => {
+              gotoFormByFormIndex(0);
+              setIsModalOpen(false);
+            }
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          FormWrapper,
+          {
+            taskName: taskType === TaskTypes.PAYIN ? "payinDetails" : "payoutDetails",
+            activeForm,
+            summary: {
+              data: formatDataForSummary(),
+              omitted: {
+                keys: ["transferInstrumentId", "payoutVerificationMethod"],
+                forms: omittedForms,
+                summaryEditButton: ["payoutVerificationMethod"]
+              }
+            },
+            handleBackClick,
+            handleNextClick: handleFormNextClick,
+            handleHomeClick,
+            handleCloseClick,
+            hideSidebar: hideSidebar || hideFooterAndSidebar,
+            hideFooter: hideFooterAndSidebar,
+            loadingStatus: isTransferInstrumentLoading ? "loading" : loadingStatus,
+            asModal,
+            forms,
+            onSubmit,
+            gotoFormByFormIndex,
+            validateForm: () => setShouldValidate(true),
+            canSubmit: canSubmit(),
+            problems,
+            steps,
+            children: (!isTransferInstrumentLoading || isSubmitting) && /* @__PURE__ */ jsx(
+              PayoutDetails,
+              {
+                ...derivedProps,
+                data: { ...prefilledData, payoutAccountDocuments: documents },
+                country: defaultPayoutCountry,
+                activeForm,
+                onBack: handleBackClick,
+                accountHolder: accountHolder ?? getLegalEntityNameBasedOnType(legalEntityResponse),
+                setHideSidebar: setHideFooterAndSidebar,
+                setSkipSubmit,
+                legalEntityResponse,
+                associatedLegalArrangement,
+                provider: providers?.[0],
+                bankVendorsLoadingStatus,
+                instantVerificationAvailable,
+                createTrustedTransferInstrument: createTrustedTransferInstrumentHandler,
+                accountDetailsFromInput,
+                trustedTransferInstrumentId
+              }
+            )
+          }
+        )
+      ]
+    }
+  );
+}
+export {
+  PayoutDetailsDropin as P,
+  PayoutDetailsPage$1 as a
+};