@adyen/kyc-components 2.8.0 → 2.8.1

package/dist/es/adyen-kyc-components.es.js

@@ -181,6 +181,7 @@ const validationPleaseEnterAValidRegistrationNumberWithFormat = "Please enter a
 const validationPleaseEnterAValidVatNumber = "Please enter a valid Tax id number";
 const validationPleaseEnterAValidVatNumberWithFormat = "Please enter a valid Tax id number. Expected format: %{format}";
 const validationPleaseEnterAValidTaxIdNumberWithFormat = "Please enter a valid Tax id number. Expected format: %{format}";
+const validationPleaseEnterAValidIRDNumber = "Please enter a valid IRD number. Expected format: 8 - 9 digits";
 const aValidAbnShouldBe11Digits = "A valid ABN should be 11 digits.";
 const aValidUenOrGstShouldBe9To10Characters = "A valid UEN/GST should be 9 to 10 characters.";
 const aValidBrnShouldBe8Digits = "A valid BRN should be 8 digits.";
@@ -426,6 +427,7 @@ const irdDocument = "IRD document";
 const irdNumber = "IRD number";
 const australianBusinessNumberAbn = "Australian business number (ABN)";
 const australianBusinessNumberAcn = "Australian company number (ACN)";
+const companyNumber__NZ = "New Zealand Business Number (NZBN) / Company Number (NCN)";
 const enterpriseNumber = "Enterprise Number";
 const NIP = "NIP (Numer identyfikacji podatkowej)";
 const NIPC = "NIPC (Número de Identificação de Pessoa Colectiva)";
@@ -710,6 +712,7 @@ const businessRegistrationNumber = "Business registration number";
 const businessRegistrationNumber__HK = "Business Registration number (BRN)";
 const doNotHaveBusinessNumber = "I do not have a Business number";
 const UEN = "Unique Entity Number (UEN)/Goods and Services Tax (GST)";
+const IRD = "Inland Revenue Department Number (IRD No)";
 const enterNameExactlyAsAppearInID = "Enter your first name(s) exactly as it appears on your identity document";
 const enterLastNameExactlyAsAppearInID = "Enter your last name(s) exactly as it appears on your identity document";
 const takePhotoOriginalDocumentWithPhone = "Take a photo of the original ID document with your phone";
@@ -1222,6 +1225,7 @@ const defaultTrans = {
   validationPleaseEnterAValidVatNumber,
   validationPleaseEnterAValidVatNumberWithFormat,
   validationPleaseEnterAValidTaxIdNumberWithFormat,
+  validationPleaseEnterAValidIRDNumber,
   aValidAbnShouldBe11Digits,
   aValidUenOrGstShouldBe9To10Characters,
   aValidBrnShouldBe8Digits,
@@ -1467,6 +1471,7 @@ const defaultTrans = {
   irdNumber,
   australianBusinessNumberAbn,
   australianBusinessNumberAcn,
+  companyNumber__NZ,
   enterpriseNumber,
   NIP,
   NIPC,
@@ -1767,6 +1772,7 @@ const defaultTrans = {
   "UEN/GST": "Unique Entity Number (UEN)/Goods and Services Tax (GST)",
   UEN,
   "IRD/GST": "Inland Revenue Department Number (IRD No)/Goods and Services Tax (GST)",
+  IRD,
   enterNameExactlyAsAppearInID,
   enterLastNameExactlyAsAppearInID,
   takePhotoOriginalDocumentWithPhone,
@@ -4419,10 +4425,11 @@ const businessRegistrationNumberPatterns = {
   },
   [CountryCodes.NewZealand]: {
     default: {
-      regex: /^\d{13}$/,
-      format: "Xdigits",
+      regex: /^\d{9,13}$/,
+      format: "XtoYdigits",
       values: {
-        digits: 13
+        x: 9,
+        y: 13
       }
     }
   },
@@ -5377,6 +5384,13 @@ const countryBasedValidatorRules$1 = {
       validate: (taxId2) => validateTaxId(taxId2, "HK"),
       errorMessage: "aValidBrnShouldBe8Digits"
     }]
+  },
+  NZ: {
+    taxId: [{
+      modes: ["blur"],
+      validate: (taxId2) => validateTaxId(taxId2, "NZ"),
+      errorMessage: "validationPleaseEnterAValidIRDNumber"
+    }]
   }
 };
 const taxIdFields = ["taxId", "exemptedFromTax"];
@@ -8191,10 +8205,10 @@ const countryConfig$4 = {
       label: "irdDocument"
     },
     registrationNumber: {
-      label: "companyNumber"
+      label: "companyNumber__NZ"
     },
     taxId: {
-      label: "IRD/GST"
+      label: "IRD"
     },
     exemptedFromVat: {
       label: "vatNumberExempted"
@@ -11563,7 +11577,8 @@ const getDefaultAccountHolderType = (legalEntityResponse, isTypeChanging = false
 };
 const countryToTaxInfoTypeMap = {
   US: "EIN",
-  AU: "ABN"
+  AU: "ABN",
+  NZ: "IRD"
 };
 const updateTaxInformation = ({
   taxId: taxId2,
@@ -23189,6 +23204,45 @@ function IndividualDropinComponent({
     })
   });
 }
+const useBankConfigurationHandlers = ({
+  isEmbeddedDropin,
+  handleGetBankVerificationVendors,
+  bankAccountCountry: bankAccountCountry2,
+  getConfiguration: getConfiguration2,
+  legalEntityType,
+  capabilities
+}) => {
+  const [bankVerificationVendorsResponse, setBankVerificationVendorsResponse] = useState();
+  const callBankVerificationVendorsUpfront = isEmbeddedDropin && handleGetBankVerificationVendors;
+  useEffect(() => {
+    (async () => {
+      const bankVerificationVendorsResponse2 = callBankVerificationVendorsUpfront ? await handleGetBankVerificationVendors(bankAccountCountry2) : [];
+      setBankVerificationVendorsResponse(bankVerificationVendorsResponse2);
+    })();
+  }, [bankAccountCountry2]);
+  const getConfigurationData = useCallback(async () => {
+    var _a;
+    const configuration = await getConfiguration2({
+      legalEntityType,
+      capabilities,
+      country: bankAccountCountry2
+    });
+    if (!callBankVerificationVendorsUpfront || !((_a = bankVerificationVendorsResponse == null ? void 0 : bankVerificationVendorsResponse[0]) == null ? void 0 : _a.name)) {
+      return configuration;
+    }
+    return {
+      ...configuration,
+      bankVerificationProviders: {
+        [bankAccountCountry2]: bankVerificationVendorsResponse[0].name
+      }
+    };
+  }, [bankAccountCountry2, capabilities, bankVerificationVendorsResponse]);
+  const getBankVerificationVendorsHandler = useMemo(() => callBankVerificationVendorsUpfront ? (data) => data && Promise.resolve(bankVerificationVendorsResponse) : handleGetBankVerificationVendors, [bankVerificationVendorsResponse, callBankVerificationVendorsUpfront]);
+  return {
+    getConfigurationData,
+    getBankVerificationVendorsHandler
+  };
+};
 const isInstantVerificationAvailable = ({
   country: country2,
   verificationVendorsCallback,
@@ -23288,6 +23342,9 @@ function PayoutDetailsDropinComponent({
   handleBankVerificationError: handleBankVerificationError2
 }) {
   var _a, _b, _c;
+  const {
+    isEmbeddedDropin
+  } = useAuthContext();
   const {
     i18n,
     setLocale
@@ -23349,11 +23406,17 @@ function PayoutDetailsDropinComponent({
       }
     });
   }, []);
-  const getConfigurationData = useCallback(() => getConfiguration2({
+  const {
+    getConfigurationData,
+    getBankVerificationVendorsHandler
+  } = useBankConfigurationHandlers({
+    isEmbeddedDropin,
+    handleGetBankVerificationVendors,
+    bankAccountCountry: bankAccountCountry2 ?? defaultPayoutCountry,
+    getConfiguration: getConfiguration2,
     legalEntityType: legalEntityResponse.type,
-    capabilities,
-    country: bankAccountCountry2 ?? defaultPayoutCountry
-  }), [bankAccountCountry2, capabilities]);
+    capabilities
+  });
   const getPayoutAccountFormatData = useCallback(async () => getPayoutAccountFormat2(bankAccountCountry2 ?? defaultPayoutCountry), [bankAccountCountry2]);
   const {
     fieldConfigurations,
@@ -23633,7 +23696,7 @@ function PayoutDetailsDropinComponent({
       setSkipSubmit,
       onChange,
       legalEntityResponse,
-      handleGetBankVerificationVendors,
+      handleGetBankVerificationVendors: getBankVerificationVendorsHandler,
       instantVerificationEnabled,
       refreshLegalEntity,
       shouldValidate,
@@ -23948,7 +24011,7 @@ const pciValidationRules = {
 };
 const PciFields = ["signer", "acceptPci"];
 function PciDropinComponent({
-  legalEntity,
+  legalEntityResponse,
   pciTemplateResponse,
   handleHomeClick,
   handleLanguageChange,
@@ -23965,7 +24028,7 @@ function PciDropinComponent({
   } = useToastContext();
   const baseTrackingPayload = getBaseTrackingPayload({
     trackingConfig,
-    legalEntity,
+    legalEntity: legalEntityResponse,
     task: taskType
   });
   const [loadingStatus, setLoadingStatus] = useState(null);
@@ -23984,16 +24047,16 @@ function PciDropinComponent({
     pciTemplateReferences
   } = pciTemplateResponse;
   const pciQuestionnaire = JSON.parse(decodeURIComponent(escape(window.atob(pciTemplateResponse.content))));
-  const uniqueEntityAssociations = [...new Map(getOwnDecisionMakers(legalEntity).map((entityAssociation) => [entityAssociation.legalEntityId, entityAssociation])).values()];
-  const signers = legalEntity.type === LegalEntityType.ORGANIZATION ? uniqueEntityAssociations.map(({
+  const uniqueEntityAssociations = [...new Map(getOwnDecisionMakers(legalEntityResponse).map((entityAssociation) => [entityAssociation.legalEntityId, entityAssociation])).values()];
+  const signers = legalEntityResponse.type === LegalEntityType.ORGANIZATION ? uniqueEntityAssociations.map(({
     legalEntityId: id2,
     name
   }) => ({
     id: id2,
     name
   })) : [{
-    id: legalEntity == null ? void 0 : legalEntity.id,
-    name: `${(_a = legalEntity == null ? void 0 : legalEntity.individual) == null ? void 0 : _a.name.firstName} ${(_b = legalEntity == null ? void 0 : legalEntity.individual) == null ? void 0 : _b.name.lastName}`
+    id: legalEntityResponse == null ? void 0 : legalEntityResponse.id,
+    name: `${(_a = legalEntityResponse == null ? void 0 : legalEntityResponse.individual) == null ? void 0 : _a.name.firstName} ${(_b = legalEntityResponse == null ? void 0 : legalEntityResponse.individual) == null ? void 0 : _b.name.lastName}`
   }];
   const handleSignClick = async () => {
     if (loadingStatus === "loading")
@@ -24007,7 +24070,7 @@ function PciDropinComponent({
     if (isValid) {
       try {
         setLoadingStatus("loading");
-        await handleSign(legalEntity.id, {
+        await handleSign(legalEntityResponse.id, {
           signedBy: data.signer,
           pciTemplateReferences
         });
@@ -24679,7 +24742,7 @@ const serviceAgreementTypesTranslationMapping = {
   adyenFranchisee: "franchiseesTAndCs"
 };
 function ServiceAgreementDropinComponent({
-  legalEntity,
+  legalEntityResponse,
   handleGetServiceAgreement,
   handleHomeClick,
   handleSign,
@@ -24697,7 +24760,7 @@ function ServiceAgreementDropinComponent({
   } = useToastContext();
   const baseTrackingPayload = getBaseTrackingPayload({
     trackingConfig,
-    legalEntity,
+    legalEntity: legalEntityResponse,
     task: taskType
   });
   const [loadingStatus, setLoadingStatus] = useState();
@@ -24726,7 +24789,7 @@ function ServiceAgreementDropinComponent({
   } = useServiceAgreement({
     handleGetServiceAgreement,
     handleServiceAgreementIsNotAvailableInThatLanguage,
-    legalEntityId: legalEntity.id,
+    legalEntityId: legalEntityResponse.id,
     serviceAgreementType: activeForm.formId,
     language: i18n.languageCode
   });
@@ -24741,15 +24804,15 @@ function ServiceAgreementDropinComponent({
     schema: ["signer", "acceptServiceAgreement"],
     rules: serviceAgreementValidationRules
   });
-  const signers = legalEntity.type === LegalEntityType.ORGANIZATION ? getOwnSignatories(legalEntity).map(({
+  const signers = legalEntityResponse.type === LegalEntityType.ORGANIZATION ? getOwnSignatories(legalEntityResponse).map(({
     legalEntityId: id2,
     name
   }) => ({
     id: id2 ?? "",
     name: name ?? ""
   })) : [{
-    id: legalEntity == null ? void 0 : legalEntity.id,
-    name: `${(_a = legalEntity == null ? void 0 : legalEntity.individual) == null ? void 0 : _a.name.firstName} ${(_b = legalEntity == null ? void 0 : legalEntity.individual) == null ? void 0 : _b.name.lastName}`
+    id: legalEntityResponse == null ? void 0 : legalEntityResponse.id,
+    name: `${(_a = legalEntityResponse == null ? void 0 : legalEntityResponse.individual) == null ? void 0 : _a.name.firstName} ${(_b = legalEntityResponse == null ? void 0 : legalEntityResponse.individual) == null ? void 0 : _b.name.lastName}`
   }];
   const handleSignClick = async () => {
     userEvents.addEvent("Clicked ToS signing", {
@@ -24763,7 +24826,7 @@ function ServiceAgreementDropinComponent({
     if (isValid) {
       try {
         setLoadingStatus("loading");
-        await handleSign(legalEntity.id, serviceAgreement.id, {
+        await handleSign(legalEntityResponse.id, serviceAgreement.id, {
           acceptedBy: data.signer
         });
         setLoadingStatus("success");
@@ -25119,16 +25182,16 @@ const getFontFaceRule = (fontFamily, fontStyle, fontWeight, fontSrc, additionalF
   }
   return `@font-face {${ruleLines.join(";")}}`;
 };
-const loadFont = (fontFamily, fontStyle, fontWeight, fontSrc, additionalFormats) => {
+const addStyleTagForFont = (fontFamily, fontStyle, fontWeight, fontSrc, additionalFormats) => {
   const style = document.createElement("style");
   style.setAttribute("type", "text/css");
   style.innerText = getFontFaceRule(fontFamily, fontStyle, fontWeight, fontSrc, additionalFormats);
   document.body.insertBefore(style, document.body.firstChild);
 };
-const loadADLIconFont = (loadingContext) => {
+const addStyleTagForADLIconFont = (loadingContext) => {
   const fontPath = `${loadingContext}static/fonts`;
   const iconFontPath = `${fontPath}/adyen-kyc-icons`;
-  loadFont("adyen-kyc-icons", "normal", "normal", `${iconFontPath}.eot`, {
+  addStyleTagForFont("adyen-kyc-icons", "normal", "normal", `${iconFontPath}.eot`, {
     eot: `${iconFontPath}.eot`,
     woff: `${iconFontPath}.woff`,
     woff2: `${iconFontPath}.woff2`,
@@ -25198,7 +25261,7 @@ function withFormComposer(WrappedComponent, {
   getConfigFor = "contextCountry"
 }) {
   const WithFormComposer = (props) => {
-    var _a, _b, _c;
+    var _a, _b, _c, _d;
     const {
       i18n
     } = useI18nContext();
@@ -25502,7 +25565,7 @@ function withFormComposer(WrappedComponent, {
             evaluateConfiguration: (data) => evaluateConfiguration(fieldConfigurations, configCountry, data, isSettingEnabled, requiredFields),
             country: contextCountry,
             onCountryChange,
-            legalEntityId: props.legalEntityId,
+            legalEntityId: (_c = props.legalEntityResponse) == null ? void 0 : _c.id,
             problems: props == null ? void 0 : props.problems,
             shouldValidate,
             onNext: handleNextClick,
@@ -25545,7 +25608,7 @@ function withFormComposer(WrappedComponent, {
         validateForm: validateCurrentForm,
         taskName,
         trackNavigation: trackNavigation2,
-        verificationErrors: (_c = props == null ? void 0 : props.problems) == null ? void 0 : _c.verificationErrors
+        verificationErrors: (_d = props == null ? void 0 : props.problems) == null ? void 0 : _d.verificationErrors
       })
     });
     const content = jsxs(Fragment, {
@@ -26771,7 +26834,7 @@ function DropinComposerComponent({
       });
     case TaskTypes.PCI_DSS:
       return jsx(PciDropinComponent, {
-        legalEntity,
+        legalEntityResponse: legalEntity,
         pciTemplateResponse,
         trackingConfig: {
           topLevelLegalEntity: legalEntityResponse
@@ -26804,7 +26867,7 @@ function DropinComposerComponent({
       });
     case TaskTypes.SERVICE_AGREEMENT:
       return jsx(ServiceAgreementDropinComponent, {
-        legalEntity,
+        legalEntityResponse: legalEntity,
         trackingConfig: {
           topLevelLegalEntity: legalEntityResponse
         },
@@ -27146,6 +27209,184 @@ const useComponentApi = (rootLegalEntityId) => {
     };
   }, [base, rootLegalEntityId, sdkToken]);
 };
+class EventEmitter {
+  constructor() {
+    this.listeners = {
+      next: [],
+      back: [],
+      validate: [],
+      updateLocale: []
+    };
+    this.on = (eventName, listener) => {
+      this.listeners[eventName].push(listener);
+    };
+    this.off = (eventName, toRemove) => {
+      this.listeners[eventName] = this.listeners[eventName].filter((listener) => listener !== toRemove);
+    };
+    this.emit = (eventName, ...data) => {
+      this.listeners[eventName].forEach((listener) => listener(data[0]));
+    };
+  }
+}
+function PayoutEmbeddedDropin({
+  legalEntityId,
+  transferInstrumentId,
+  onChange,
+  onSubmit,
+  eventEmitter
+}) {
+  const {
+    getLegalEntity: getLegalEntity2,
+    getTransferInstrument: getTransferInstrument2,
+    getBankVerificationVendor: getBankVerificationVendor2,
+    getDocument: getDocument2,
+    createDocument: createDocument2,
+    updateDocument: updateDocument2,
+    createTransferInstrument: createTransferInstrument2,
+    updateTransferInstrument: updateTransferInstrument2,
+    createTrustedTransferInstrument: createTrustedTransferInstrument2,
+    handleBankVerificationError: handleBankVerificationError2
+  } = useComponentApi(legalEntityId);
+  const [legalEntity, setLegalEntity] = useState();
+  const [transferInstrument, setTransferInstrument] = useState();
+  const fetchLegalEntity = useCallback(async () => {
+    const le = await getLegalEntity2(legalEntityId);
+    setLegalEntity(le);
+    return le;
+  }, [getLegalEntity2, legalEntityId]);
+  useEffect(() => {
+    (async () => {
+      await fetchLegalEntity();
+      if (transferInstrumentId) {
+        const ti = await getTransferInstrument2(transferInstrumentId);
+        setTransferInstrument(ti);
+      }
+    })();
+  }, [fetchLegalEntity, getTransferInstrument2, transferInstrumentId]);
+  return legalEntity ? jsx(PayoutDetailsDropinComponent, {
+    eventEmitter: eventEmitter ?? new EventEmitter(),
+    transferInstrument,
+    legalEntityResponse: legalEntity,
+    handleGetTransferInstrument: getTransferInstrument2,
+    handleGetBankVerificationVendors: getBankVerificationVendor2,
+    handleGetDocument: getDocument2,
+    handleCreateDocument: createDocument2,
+    handleUpdateDocument: updateDocument2,
+    handleCreateTransferInstrument: createTransferInstrument2,
+    handleUpdateTransferInstrument: updateTransferInstrument2,
+    refreshLegalEntity: fetchLegalEntity,
+    onChange,
+    onSubmit,
+    createTrustedTransferInstrument: createTrustedTransferInstrument2,
+    handleBankVerificationError: handleBankVerificationError2
+  }) : null;
+}
+const componentsMap = {
+  individualDropin: IndividualDropinComponent,
+  companyDropin: CompanyDropinComponent,
+  taskList: DropinComposerComponent,
+  payoutAccount: PayoutDetailsDropinComponent,
+  trustDropin: TrustDropinComponent,
+  soleProprietorDropin: SolePropDropinComponent,
+  pci: PciDropinComponent,
+  payoutEmbeddedDropin: PayoutEmbeddedDropin
+};
+const refreshSdkToken = async (context, refreshToken) => {
+  const {
+    loadingContext,
+    sdkToken
+  } = context;
+  return httpPost({
+    loadingContext,
+    errorLevel: "warn",
+    errorMessage: `Failed to refresh token`,
+    path: `sessions/refresh`,
+    sdkToken,
+    headers: {
+      "Content-Type": "application/json"
+    }
+  }, {
+    refreshToken
+  });
+};
+const SDK_TOKEN_TTL = 6e4;
+const REFRESH_INTERVAL = SDK_TOKEN_TTL - 5e3;
+const RETRY_LIMIT = 2;
+const logger$4 = createLogger("useSdkToken");
+const useSdkToken = ({
+  initialSdkToken,
+  refreshToken,
+  autheBase
+}) => {
+  const [sdkToken, setSdkToken] = useState(initialSdkToken);
+  const doRefresh = async (sdkToken2, refreshToken2, retries) => {
+    try {
+      const {
+        token: newSdkToken
+      } = await refreshSdkToken({
+        loadingContext: autheBase,
+        sdkToken: sdkToken2
+      }, refreshToken2);
+      setSdkToken(newSdkToken);
+    } catch (e) {
+      if (!retries) {
+        throw new Error("Unable to refresh token after retries", e);
+      }
+      logger$4.warn("Failed to refresh token. Retrying..", e);
+      await doRefresh(sdkToken2, refreshToken2, retries - 1);
+    }
+  };
+  useEffect(() => {
+    if (!sdkToken || !refreshToken) {
+      return;
+    }
+    const refreshHandler = setInterval(() => {
+      doRefresh(sdkToken, refreshToken, RETRY_LIMIT).catch(() => {
+        clearInterval(refreshHandler);
+      });
+    }, REFRESH_INTERVAL);
+    return () => {
+      clearInterval(refreshHandler);
+    };
+  }, [sdkToken]);
+  return sdkToken;
+};
+const AUTHE_API_VERSION = "v1";
+const AuthProvider = ({
+  children,
+  sdkToken: initialSdkToken,
+  refreshToken,
+  clientKey,
+  loadingContext
+}) => {
+  const autheBase = `${loadingContext}authe/api/${AUTHE_API_VERSION}/`;
+  const sdkToken = useSdkToken({
+    initialSdkToken,
+    refreshToken,
+    autheBase
+  });
+  const contextValue = useMemo(() => {
+    if (sdkToken && refreshToken) {
+      return {
+        isEmbeddedDropin: true,
+        sdkToken,
+        loadingContext: `${loadingContext}onboardingcomponents/`
+      };
+    }
+    if (clientKey) {
+      return {
+        isEmbeddedDropin: false,
+        clientKey,
+        loadingContext
+      };
+    }
+    throw new Error("Must provide either `sdkToken` and `refreshToken` or `clientKey`");
+  }, [sdkToken, clientKey]);
+  return jsx(AuthContext.Provider, {
+    value: contextValue,
+    children
+  });
+};
 const getEmbeddedApi = ({
   base,
   sdkToken,
@@ -27363,7 +27604,7 @@ const validatePhoneNumber = async (context, phoneNumber2) => {
     number: phoneNumber2
   });
 };
-const logger$4 = createLogger("verify-id-number");
+const logger$3 = createLogger("verify-id-number");
 const verifyIdNumber = async (context, request) => {
   const {
     loadingContext,
@@ -27390,13 +27631,13 @@ const verifyIdNumber = async (context, request) => {
             message: "Service did not respond, do not block verification"
           };
         }
-        return logger$4.warn(`Unexpected response status ${responseData.status}`);
+        return logger$3.warn(`Unexpected response status ${responseData.status}`);
       },
       path: "v1/verification/idNumber",
       clientKey
     }, request);
   } catch (e) {
-    logger$4.warn("WARNING: idNumber verification failed - error:", e);
+    logger$3.warn("WARNING: idNumber verification failed - error:", e);
   }
 };
 const verifyTin = async (context, data) => {
@@ -27476,7 +27717,7 @@ const ConfigurationApiProvider = ({
   rootLegalEntityId
 }) => {
   const authContext = useAuthContext();
-  const contextValue = useMemo(() => authContext.isEmbeddedDropin && rootLegalEntityId ? getEmbeddedApi({
+  const contextValue = useMemo(() => authContext.isEmbeddedDropin ? getEmbeddedApi({
     base: authContext.loadingContext,
     sdkToken: authContext.sdkToken,
     rootLegalEntityId
@@ -27489,187 +27730,6 @@ const ConfigurationApiProvider = ({
     children
   });
 };
-class EventEmitter {
-  constructor() {
-    this.listeners = {
-      next: [],
-      back: [],
-      validate: [],
-      updateLocale: []
-    };
-    this.on = (eventName, listener) => {
-      this.listeners[eventName].push(listener);
-    };
-    this.off = (eventName, toRemove) => {
-      this.listeners[eventName] = this.listeners[eventName].filter((listener) => listener !== toRemove);
-    };
-    this.emit = (eventName, ...data) => {
-      this.listeners[eventName].forEach((listener) => listener(data[0]));
-    };
-  }
-}
-function PayoutEmbeddedDropin({
-  legalEntityId,
-  transferInstrumentId,
-  onChange,
-  onSubmit,
-  eventEmitter
-}) {
-  const {
-    getLegalEntity: getLegalEntity2,
-    getTransferInstrument: getTransferInstrument2,
-    getBankVerificationVendor: getBankVerificationVendor2,
-    getDocument: getDocument2,
-    createDocument: createDocument2,
-    updateDocument: updateDocument2,
-    createTransferInstrument: createTransferInstrument2,
-    updateTransferInstrument: updateTransferInstrument2,
-    createTrustedTransferInstrument: createTrustedTransferInstrument2,
-    handleBankVerificationError: handleBankVerificationError2
-  } = useComponentApi(legalEntityId);
-  const [legalEntity, setLegalEntity] = useState();
-  const [transferInstrument, setTransferInstrument] = useState();
-  const fetchLegalEntity = useCallback(async () => {
-    const le = await getLegalEntity2(legalEntityId);
-    setLegalEntity(le);
-    return le;
-  }, [getLegalEntity2, legalEntityId]);
-  useEffect(() => {
-    (async () => {
-      await fetchLegalEntity();
-      if (transferInstrumentId) {
-        const ti = await getTransferInstrument2(transferInstrumentId);
-        setTransferInstrument(ti);
-      }
-    })();
-  }, [fetchLegalEntity, getTransferInstrument2, transferInstrumentId]);
-  return legalEntity ? jsx(ConfigurationApiProvider, {
-    rootLegalEntityId: legalEntityId,
-    children: jsx(PayoutDetailsDropinComponent, {
-      eventEmitter: eventEmitter ?? new EventEmitter(),
-      transferInstrument,
-      legalEntityResponse: legalEntity,
-      handleGetTransferInstrument: getTransferInstrument2,
-      handleGetBankVerificationVendors: getBankVerificationVendor2,
-      handleGetDocument: getDocument2,
-      handleCreateDocument: createDocument2,
-      handleUpdateDocument: updateDocument2,
-      handleCreateTransferInstrument: createTransferInstrument2,
-      handleUpdateTransferInstrument: updateTransferInstrument2,
-      refreshLegalEntity: fetchLegalEntity,
-      onChange,
-      onSubmit,
-      createTrustedTransferInstrument: createTrustedTransferInstrument2,
-      handleBankVerificationError: handleBankVerificationError2
-    })
-  }) : null;
-}
-const componentsMap = {
-  individualDropin: IndividualDropinComponent,
-  companyDropin: CompanyDropinComponent,
-  taskList: DropinComposerComponent,
-  payoutAccount: PayoutDetailsDropinComponent,
-  trustDropin: TrustDropinComponent,
-  soleProprietorDropin: SolePropDropinComponent,
-  pci: PciDropinComponent,
-  payoutEmbeddedDropin: PayoutEmbeddedDropin
-};
-const refreshSdkToken = async (context, refreshToken) => {
-  const {
-    loadingContext,
-    sdkToken
-  } = context;
-  return httpPost({
-    loadingContext,
-    errorLevel: "warn",
-    errorMessage: `Failed to refresh token`,
-    path: `sessions/refresh`,
-    sdkToken,
-    headers: {
-      "Content-Type": "application/json"
-    }
-  }, {
-    refreshToken
-  });
-};
-const SDK_TOKEN_TTL = 6e4;
-const REFRESH_INTERVAL = SDK_TOKEN_TTL - 5e3;
-const RETRY_LIMIT = 2;
-const logger$3 = createLogger("useSdkToken");
-const useSdkToken = ({
-  initialSdkToken,
-  refreshToken,
-  autheBase
-}) => {
-  const [sdkToken, setSdkToken] = useState(initialSdkToken);
-  const doRefresh = async (sdkToken2, refreshToken2, retries) => {
-    try {
-      const {
-        token: newSdkToken
-      } = await refreshSdkToken({
-        loadingContext: autheBase,
-        sdkToken: sdkToken2
-      }, refreshToken2);
-      setSdkToken(newSdkToken);
-    } catch (e) {
-      if (!retries) {
-        throw new Error("Unable to refresh token after retries", e);
-      }
-      logger$3.warn("Failed to refresh token. Retrying..", e);
-      await doRefresh(sdkToken2, refreshToken2, retries - 1);
-    }
-  };
-  useEffect(() => {
-    if (!sdkToken || !refreshToken) {
-      return;
-    }
-    const refreshHandler = setInterval(() => {
-      doRefresh(sdkToken, refreshToken, RETRY_LIMIT).catch(() => {
-        clearInterval(refreshHandler);
-      });
-    }, REFRESH_INTERVAL);
-    return () => {
-      clearInterval(refreshHandler);
-    };
-  }, [sdkToken]);
-  return sdkToken;
-};
-const AUTHE_API_VERSION = "v1";
-const AuthProvider = ({
-  children,
-  sdkToken: initialSdkToken,
-  refreshToken,
-  clientKey,
-  loadingContext
-}) => {
-  const autheBase = `${loadingContext}authe/api/${AUTHE_API_VERSION}/`;
-  const sdkToken = useSdkToken({
-    initialSdkToken,
-    refreshToken,
-    autheBase
-  });
-  const contextValue = useMemo(() => {
-    if (sdkToken && refreshToken) {
-      return {
-        isEmbeddedDropin: true,
-        sdkToken,
-        loadingContext: `${loadingContext}onboardingcomponents/`
-      };
-    }
-    if (clientKey) {
-      return {
-        isEmbeddedDropin: false,
-        clientKey,
-        loadingContext
-      };
-    }
-    throw new Error("Must provide either `sdkToken` and `refreshToken` or `clientKey`");
-  }, [sdkToken, clientKey]);
-  return jsx(AuthContext.Provider, {
-    value: contextValue,
-    children
-  });
-};
 const logger$2 = createLogger("CoreProvider");
 const CoreProvider = ({
   contextCountry: initialContextCountry,
@@ -27687,7 +27747,7 @@ const CoreProvider = ({
   const [accountHolder2, setAccountHolder] = useState(null);
   const [accountFormat, setAccountFormat] = useState("local");
   const init2 = async () => {
-    loadADLIconFont(loadingContext);
+    addStyleTagForADLIconFont(loadingContext);
     try {
       const allowedCountries = (await getAllowedCountries2()).countries;
       if (!allowedCountries.includes(contextCountry)) {
@@ -27697,9 +27757,10 @@ const CoreProvider = ({
 - ${listify(allowedCountries)}.
                    `);
       }
-      setLoaded(true);
     } catch (e) {
-      logger$2.log(e);
+      logger$2.warn(e);
+    } finally {
+      setLoaded(true);
     }
   };
   useEffect(() => {
@@ -27938,6 +27999,13 @@ class BaseElement {
     }
   }
 }
+const getRootLegalEntityId = (componentProps) => {
+  if ("legalEntityId" in componentProps)
+    return componentProps.legalEntityId;
+  if ("legalEntityResponse" in componentProps)
+    return componentProps.legalEntityResponse.id;
+  throw new Error("You must provide either `legalEntityId` or `legalEntityResponse`");
+};
 class UIElement extends BaseElement {
   constructor(props) {
     super(props);
@@ -27949,6 +28017,7 @@ class UIElement extends BaseElement {
         clientKey: this.props.clientKey,
         loadingContext: this.props.loadingContext,
         children: jsx(ConfigurationApiProvider, {
+          rootLegalEntityId: getRootLegalEntityId(this.props.componentProps),
           children: jsx(CoreProvider, {
             contextCountry: this.props.contextCountry,
             isReview: this.props.isReview,
@@ -28447,7 +28516,7 @@ const pciDropinSchema = {
   taskType: {
     type: "string"
   },
-  legalEntity: {
+  legalEntityResponse: {
     type: "object",
     required: true,
     propertiesSchema: {
@@ -28480,7 +28549,8 @@ const payoutEmbeddedDropinSchema = {
     type: "function"
   },
   legalEntityId: {
-    type: "string"
+    type: "string",
+    required: true
   }
 };
 const componentsSchemaMap = {