@adyen/kyc-components 3.49.2 → 3.50.1

package/dist/es/{index-B3fvfRtD.js → index-Cb_V47vX.js}

@@ -218,7 +218,9 @@ const defaultLocaleTranslations = {
   businessIncorporationNumber: "Business incorporation number",
   businessInformation: "Business information",
   businessInvestorDetails: "Business investor details",
+  businessLegalName: "Business legal name",
   businessName: "Business name",
+  businessName__helperText: "The legal name is used to identify a business with the government; enter it exactly as it appears on your government or legal forms.",
   businessNumber: "Business number",
   businessRegistrationDocument__FR: "Business registration document, such as a KBIS extract or situation au répertoire sirene",
   businessRegistryStatement: "Business registry statement",
@@ -228,6 +230,10 @@ const defaultLocaleTranslations = {
   businessSelection__heading: "Select your business",
   businessSelection__invalidTin: "This company's TIN doesn't match yours",
   businessSelection__tinVerificationFailure: "Sorry, something went wrong. Try again or continue by pressing Add details manually",
+  businessSelection__tinVerificationFailureModalContent: "The tax ID didn't match the legal business name. How would you like to continue?",
+  businessSelection__tinVerificationFailureModalHeader: "Business couldn't be identified",
+  businessSelection__tinVerificationFailureModalPrimaryButton: "Continue anyway",
+  businessSelection__tinVerificationFailureModalSecondaryButton: "Edit details",
   businessStructure: "Business structure",
   businessTrust: "Business trust",
   businessTrusteeDetails: "Business trustee details",
@@ -413,6 +419,7 @@ const defaultLocaleTranslations = {
   downloadACopy: "Download a copy",
   downloadAsPdf: "Download as PDF",
   driversLicense: "Driver's license",
+  driving_licence: "Driving license",
   drivinglicenseBack: "Driving license (back)",
   drivinglicenseFront: "Driving license (front)",
   dropFileToUpload: "Drop file to upload",
@@ -1075,6 +1082,8 @@ const defaultLocaleTranslations = {
   nameOfTrustAgreement: "Name of trust agreement",
   namesOfInvolvedParties: "Names of involved parties (if applicable)",
   namesOfLandlordAndTenant: "Names of landlord and tenant",
+  national_identity_card: "National ID Card",
+  nationalIdNumber: "National ID Number",
   nationalInsuranceNumber: "National Insurance Number (NINO)",
   nationality: "Nationality",
   naturalPersonDescription: "He/she doesn't have any business.",
@@ -1224,9 +1233,13 @@ const defaultLocaleTranslations = {
   processing: "Processing",
   professionalServiceProvider: "My settlor is a professional service provider",
   progress: "Progress",
+  proofOfAddress: "Proof of address",
   proofOfAnnualTurnoverAmount: "Proof of annual turnover amount",
   proofOfDirector: "Proof of director",
+  proofOfFundingOrWealthSource: "Proof of funding or wealth source",
   proofOfNationalId: "Proof of national ID",
+  proofOfNationalIdNumber: "Proof of national ID number",
+  proofOfOrganizationTaxInfo: "Proof of organization tax information",
   proofOfOwnership: "Proof of ownership",
   proofOfOwnershipRent: "Proof of ownership",
   proofOfRelationship: "Proof of relationship",
@@ -1361,6 +1374,7 @@ const defaultLocaleTranslations = {
   requirements: "Requirements:",
   requiresDecisionMakers: "Requires decision-makers",
   requiresSignatory: "Requires signatory",
+  residence_permit: "Residence permit",
   residencePermitBack: "Residence permit (back)",
   residencePermitFront: "Residence permit (front)",
   residencyCountry: "Country/region of residence",
@@ -1644,6 +1658,7 @@ const defaultLocaleTranslations = {
   validationPleaseEnterAValidVatNumber: "Please enter a valid Tax id number",
   validationPleaseEnterAValidVatNumberWithFormat: "Please enter a valid VAT number. Expected format: %{format}",
   vatAbsenceReason: "VAT number absence reason",
+  vatDocument: "VAT document",
   vatNumber: "VAT number",
   vatNummerMomsregistreringsnummerOrMomsnummer: "VAT-nummer, Momsregistreringsnummer, or Momsnummer",
   vatRegistrationNumber: "VAT registration number",
@@ -2223,6 +2238,25 @@ function useBusinessData({
     },
     [handleVerifyTin]
   );
+  const verifyManualBusinessData = useCallback(
+    async (name, tin) => {
+      if (!handleVerifyTin) {
+        logger$R.log("Missing handlers for verifyBusinessData");
+        return;
+      }
+      try {
+        setVerifying("loading");
+        const { matched } = await handleVerifyTin({ name, tin });
+        return matched;
+      } catch (e) {
+        setVerifying("error");
+        logger$R.error(e);
+      } finally {
+        setVerifying((prevState) => prevState !== "error" ? "loaded" : prevState);
+      }
+    },
+    [handleVerifyTin]
+  );
   const clearTrustedBusinessData = useCallback(async () => {
     try {
       setResettingTrustedData("loading");
@@ -2246,6 +2280,7 @@ function useBusinessData({
     searchForBusiness,
     fetchBusinessData,
     verifyBusinessData,
+    verifyManualBusinessData,
     clearTrustedBusinessData,
     resetBusinessData,
     resetTinVerification,
@@ -2327,7 +2362,6 @@ const createFormUtils = (props, i18n) => ({
   isReadOnly: (field) => props.readOnly || (props.readOnlyFields ? props.readOnlyFields.includes(field) : false),
   isObscured: (field) => props.obscuredFields ? props.obscuredFields.includes(field) : false,
   isTrusted: (field) => props.trustedFields ? props.trustedFields.includes(field) : false,
-  getVal: (val) => i18n.get(val),
   getErrorMessage: (field, errors, fieldProblems) => {
     var _a2;
     const errorMessage = (_a2 = errors == null ? void 0 : errors[field]) == null ? void 0 : _a2.errorMessage;
@@ -2703,7 +2737,7 @@ const loaderSmall = "adyen-kyc-loader-small";
 const loaderMedium = "adyen-kyc-loader-medium";
 const loaderXsmall = "adyen-kyc-loader-xsmall";
 const loaderDot = "adyen-kyc-loader-dot";
-const styles$l = {
+const styles$o = {
   loaderWrapper,
   loaderWrapperInline,
   loader,
@@ -2714,16 +2748,16 @@ const styles$l = {
   loaderDot
 };
 const sizeMap = {
-  xsmall: styles$l.loaderXsmall,
-  small: styles$l.loaderSmall,
-  medium: styles$l.loaderMedium,
-  large: styles$l.loaderLarge
+  xsmall: styles$o.loaderXsmall,
+  small: styles$o.loaderSmall,
+  medium: styles$o.loaderMedium,
+  large: styles$o.loaderLarge
 };
-const Loader = ({ inline = false, size = "large", dot = false }) => /* @__PURE__ */ jsx("div", { className: cx(styles$l.loaderWrapper, { [styles$l.loaderWrapperInline]: inline }), children: /* @__PURE__ */ jsx(
+const Loader = ({ inline = false, size = "large", dot = false }) => /* @__PURE__ */ jsx("div", { className: cx(styles$o.loaderWrapper, { [styles$o.loaderWrapperInline]: inline }), children: /* @__PURE__ */ jsx(
   "div",
   {
     role: "progressbar",
-    className: cx(styles$l.loader, sizeMap[size], { [styles$l.loaderDot]: dot })
+    className: cx(styles$o.loader, sizeMap[size], { [styles$o.loaderDot]: dot })
   }
 ) });
 const Button = ({
@@ -2740,6 +2774,7 @@ const Button = ({
   label = "",
   icon,
   iconPosition = "left",
+  iconClassName = "",
   title,
   disabled = false,
   type = "button",
@@ -2756,13 +2791,14 @@ const Button = ({
       onClick(event);
     }
   };
+  const iconClassNames = cx("adyen-kyc-link__icon", iconClassName);
   const buttonTextClasses = showAsLink ? "adyen-kyc-link__text" : "adyen-kyc-button__text";
   const buttonText = loading ? /* @__PURE__ */ jsxs(Fragment, { children: [
     label && /* @__PURE__ */ jsx("span", { className: buttonTextClasses, children: label }),
     /* @__PURE__ */ jsx("span", { className: "adyen-kyc-button__loader-container--active", children: /* @__PURE__ */ jsx(Loader, { size: "small" }) })
   ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
     label && /* @__PURE__ */ jsx("span", { className: buttonTextClasses, children: label }),
-    icon && /* @__PURE__ */ jsx(Icon, { name: icon, className: "adyen-kyc-link__icon" })
+    icon && /* @__PURE__ */ jsx(Icon, { name: icon, className: iconClassNames })
   ] });
   const buttonClasses = showAsLink ? cx("adyen-kyc-link", className2, {
     "adyen-kyc-link--icon-left": icon && iconPosition === "left",
@@ -2798,10 +2834,10 @@ const Button = ({
   );
 };
 const divider = "adyen-kyc-divider";
-const styles$k = {
+const styles$n = {
   divider
 };
-const Divider = () => /* @__PURE__ */ jsx("hr", { className: styles$k.divider });
+const Divider = () => /* @__PURE__ */ jsx("hr", { className: styles$n.divider });
 const alert = "adyen-kyc-alert";
 const alertWithoutIcon = "adyen-kyc-alert-without-icon";
 const alertExplanation = "adyen-kyc-alert-explanation";
@@ -2819,7 +2855,7 @@ const alertIconWarning = "adyen-kyc-alert-icon-warning";
 const alertIconSuccess = "adyen-kyc-alert-icon-success";
 const alertCloseButton = "adyen-kyc-alert-close-button";
 const alertTitle = "adyen-kyc-alert-title";
-const styles$j = {
+const styles$m = {
   alert,
   alertWithoutIcon,
   alertExplanation,
@@ -2850,7 +2886,7 @@ const accordionContent = "adyen-kyc-accordion-content";
 const accordionWithIcon = "adyen-kyc-accordion-with-icon";
 const accordionArrow = "adyen-kyc-accordion-arrow";
 const accordionArrowRight = "adyen-kyc-accordion-arrow-right";
-const styles$i = {
+const styles$l = {
   accordion,
   accordionSummary,
   accordionBasic,
@@ -2867,7 +2903,7 @@ const styles$i = {
 const skeleton = "adyen-kyc-skeleton";
 const skeletonCircle = "adyen-kyc-skeleton-circle";
 const skeletonText = "adyen-kyc-skeleton-text";
-const styles$h = {
+const styles$k = {
   skeleton,
   skeletonCircle,
   skeletonText
@@ -2878,9 +2914,9 @@ const Skeleton = ({
   height = "1em",
   width
 }) => {
-  const classNames = cx(styles$h.skeleton, {
-    [styles$h.skeletonCircle]: circle,
-    [styles$h.skeletonText]: text
+  const classNames = cx(styles$k.skeleton, {
+    [styles$k.skeletonCircle]: circle,
+    [styles$k.skeletonText]: text
   });
   return /* @__PURE__ */ jsx("div", { className: classNames, style: { height, width } });
 };
@@ -2898,52 +2934,52 @@ const Accordion = ({
     onToggle(e.newState === "closed" ? "close" : "open");
   };
   const variantMap2 = {
-    basic: styles$i.accordionBasic,
-    info: styles$i.accordionInfo,
-    error: styles$i.accordionError,
-    warning: styles$i.accordionWarning,
-    success: styles$i.accordionSuccess
+    basic: styles$l.accordionBasic,
+    info: styles$l.accordionInfo,
+    error: styles$l.accordionError,
+    warning: styles$l.accordionWarning,
+    success: styles$l.accordionSuccess
   };
   return /* @__PURE__ */ jsxs(
     "details",
     {
       onToggle: handleToggle,
-      className: cx(className2, styles$i.accordion, variantMap2[variant], {
-        [styles$i.accordionWithIcon]: expandOnLeft,
-        [styles$i.accordionNarrow]: narrow
+      className: cx(className2, styles$l.accordion, variantMap2[variant], {
+        [styles$l.accordionWithIcon]: expandOnLeft,
+        [styles$l.accordionNarrow]: narrow
       }),
       children: [
-        /* @__PURE__ */ jsxs("summary", { className: styles$i.accordionSummary, children: [
-          expandOnLeft && /* @__PURE__ */ jsx(Icon, { name: "chevron-down", className: styles$i.accordionArrow }),
+        /* @__PURE__ */ jsxs("summary", { className: styles$l.accordionSummary, children: [
+          expandOnLeft && /* @__PURE__ */ jsx(Icon, { name: "chevron-down", className: styles$l.accordionArrow }),
           /* @__PURE__ */ jsx(Slot, { name: "icon" }),
           /* @__PURE__ */ jsx(Slot, { name: "title", children: /* @__PURE__ */ jsx(Skeleton, {}) }),
           !expandOnLeft && /* @__PURE__ */ jsx(
             Icon,
             {
               name: "chevron-down",
-              className: cx(styles$i.accordionArrow, styles$i.accordionArrowRight)
+              className: cx(styles$l.accordionArrow, styles$l.accordionArrowRight)
             }
           )
         ] }),
-        /* @__PURE__ */ jsx("section", { className: styles$i.accordionContent, children: /* @__PURE__ */ jsx(Slot, { name: "content", children: /* @__PURE__ */ jsx(Skeleton, {}) }) })
+        /* @__PURE__ */ jsx("section", { className: styles$l.accordionContent, children: /* @__PURE__ */ jsx(Slot, { name: "content", children: /* @__PURE__ */ jsx(Skeleton, {}) }) })
       ]
     }
   );
 };
-const variantMap = {
-  basic: styles$j.alertBasic,
-  info: styles$j.alertInfo,
-  error: styles$j.alertError,
-  warning: styles$j.alertWarning,
-  success: styles$j.alertSuccess
+const variantMap$1 = {
+  basic: styles$m.alertBasic,
+  info: styles$m.alertInfo,
+  error: styles$m.alertError,
+  warning: styles$m.alertWarning,
+  success: styles$m.alertSuccess
 };
 const iconVariantMap = {
   basic: "",
   // does not exist
-  info: styles$j.alertIconInfo,
-  error: styles$j.alertIconError,
-  warning: styles$j.alertIconWarning,
-  success: styles$j.alertIconSuccess
+  info: styles$m.alertIconInfo,
+  error: styles$m.alertIconError,
+  warning: styles$m.alertIconWarning,
+  success: styles$m.alertIconSuccess
 };
 const Alert = ({
   title,
@@ -2969,33 +3005,35 @@ const Alert = ({
     if (isValidElement(icon)) {
       return icon;
     }
-    return /* @__PURE__ */ jsx("span", { className: cx(styles$j.alertIcon, iconVariantMap[variant]), children: /* @__PURE__ */ jsx(AlertIcon, { variant }) });
+    return /* @__PURE__ */ jsx("span", { className: cx(styles$m.alertIcon, iconVariantMap[variant]), children: /* @__PURE__ */ jsx(AlertIcon, { variant }) });
   };
   const renderedIcon = renderIcon();
   if (type === "collapsible") {
     return /* @__PURE__ */ jsxs(Accordion, { variant, onToggle: onToggle || void 0, narrow: true, className: className2, children: [
       /* @__PURE__ */ jsx("template", { slot: "title", children: title }),
       /* @__PURE__ */ jsx("template", { slot: "icon", children: renderedIcon }),
-      /* @__PURE__ */ jsx("template", { slot: "content", children: children2 }),
-      /* @__PURE__ */ jsx("div", { slot: "actions", className: styles$j.alertActions, children: actions })
+      /* @__PURE__ */ jsxs("template", { slot: "content", children: [
+        children2,
+        /* @__PURE__ */ jsx("div", { className: styles$m.alertActions, children: actions })
+      ] })
     ] });
   }
   if (type === "callToAction") {
     return /* @__PURE__ */ jsxs(
       "div",
       {
-        className: cx(styles$j.alert, className2, variantMap[variant], {
-          [styles$j.alertWithoutIcon]: !renderedIcon
+        className: cx(styles$m.alert, className2, variantMap$1[variant], {
+          [styles$m.alertWithoutIcon]: !renderedIcon
         }),
         role: "alert",
         "data-testid": testId,
         children: [
-          /* @__PURE__ */ jsxs("div", { className: styles$j.alertHeader, children: [
+          /* @__PURE__ */ jsxs("div", { className: styles$m.alertHeader, children: [
             renderedIcon,
-            title && /* @__PURE__ */ jsx("span", { className: styles$j.alertTitle, children: title }),
-            !!actions && /* @__PURE__ */ jsx("div", { className: styles$j.alertActions, children: actions })
+            title && /* @__PURE__ */ jsx("span", { className: styles$m.alertTitle, children: title }),
+            !!actions && /* @__PURE__ */ jsx("div", { className: styles$m.alertActions, children: actions })
           ] }),
-          !!children2 && /* @__PURE__ */ jsx("div", { className: styles$j.alertExplanation, children: children2 })
+          !!children2 && /* @__PURE__ */ jsx("div", { className: styles$m.alertExplanation, children: children2 })
         ]
       }
     );
@@ -3003,15 +3041,15 @@ const Alert = ({
   return /* @__PURE__ */ jsxs(
     "div",
     {
-      className: cx(styles$j.alert, className2, variantMap[variant], {
-        [styles$j.alertWithoutIcon]: !renderedIcon
+      className: cx(styles$m.alert, className2, variantMap$1[variant], {
+        [styles$m.alertWithoutIcon]: !renderedIcon
       }),
       role: "alert",
       "data-testid": testId,
       children: [
-        /* @__PURE__ */ jsxs("div", { className: styles$j.alertHeader, children: [
+        /* @__PURE__ */ jsxs("div", { className: styles$m.alertHeader, children: [
           renderedIcon,
-          title && /* @__PURE__ */ jsx("span", { className: styles$j.alertTitle, children: title }),
+          title && /* @__PURE__ */ jsx("span", { className: styles$m.alertTitle, children: title }),
           type === "dismissible" && /* @__PURE__ */ jsx(
             Button,
             {
@@ -3019,12 +3057,12 @@ const Alert = ({
               tertiary: true,
               icon: "cross",
               onClick: closeAlert,
-              className: styles$j.alertCloseButton
+              className: styles$m.alertCloseButton
             }
           )
         ] }),
-        !!children2 && /* @__PURE__ */ jsx("div", { className: styles$j.alertExplanation, children: children2 }),
-        !!actions && /* @__PURE__ */ jsx("div", { className: styles$j.alertActions, children: actions })
+        !!children2 && /* @__PURE__ */ jsx("div", { className: styles$m.alertExplanation, children: children2 }),
+        !!actions && /* @__PURE__ */ jsx("div", { className: styles$m.alertActions, children: actions })
       ]
     }
   );
@@ -3111,28 +3149,29 @@ function ServerValidationErrors({
   validationErrors,
   formUtils
 }) {
+  const { i18n } = useI18nContext();
   const validationErrorFieldNames = Object.keys(validationErrors || {});
   const getValidationErrorMessage = useCallback(
-    () => formUtils.getVal({
+    () => i18n.get({
       key: "fieldHasUnsupportedFormats",
       values: { fieldName: formUtils.getLabel(validationErrorFieldNames[0]) }
-    }).toString(),
+    }),
     [formUtils, validationErrorFieldNames]
   );
-  return /* @__PURE__ */ jsx(Alert, { title: formUtils.getVal("informationCouldNotBeSubmitted"), variant: "error", children: (validationErrorFieldNames == null ? void 0 : validationErrorFieldNames.length) === 1 ? /* @__PURE__ */ jsxs("div", { "data-testid": "validation-error--case-1", children: [
+  return /* @__PURE__ */ jsx(Alert, { title: i18n.get("informationCouldNotBeSubmitted"), variant: "error", children: (validationErrorFieldNames == null ? void 0 : validationErrorFieldNames.length) === 1 ? /* @__PURE__ */ jsxs("div", { "data-testid": "validation-error--case-1", children: [
     getValidationErrorMessage(),
     " ",
     /* @__PURE__ */ jsx(
       NavigateToFieldLink,
       {
         fieldName: validationErrorFieldNames[0],
-        label: formUtils.getVal("updateTheInformation")
+        label: i18n.get("updateTheInformation")
       }
     ),
     " ",
-    formUtils.getVal("andResubmit")
+    i18n.get("andResubmit")
   ] }) : /* @__PURE__ */ jsxs("div", { "data-testid": "validation-error--case-2", children: [
-    formUtils.getVal("someFieldsHaveUnsupportedFormatedUpdateInfoAndResubmit"),
+    i18n.get("someFieldsHaveUnsupportedFormatedUpdateInfoAndResubmit"),
     /* @__PURE__ */ jsx("ul", { children: validationErrorFieldNames.map((fieldName) => /* @__PURE__ */ jsx(
       "li",
       {
@@ -3163,23 +3202,23 @@ function StateContextWatcher({
 }
 var DocumentType = /* @__PURE__ */ ((DocumentType2) => {
   DocumentType2["BANK_STATEMENT"] = "bankStatement";
+  DocumentType2["CONSTITUTIONAL_DOCUMENT"] = "constitutionalDocument";
   DocumentType2["DRIVERS_LICENSE"] = "driversLicense";
+  DocumentType2["DRIVING_LICENCE"] = "driving_licence";
   DocumentType2["IDENTITY_CARD"] = "identityCard";
+  DocumentType2["NATIONAL_IDENTITY_CARD"] = "national_identity_card";
   DocumentType2["NATIONAL_ID_NUMBER"] = "nationalIdNumber";
   DocumentType2["PASSPORT"] = "passport";
   DocumentType2["PROOF_OF_ADDRESS"] = "proofOfAddress";
+  DocumentType2["PROOF_OF_DIRECTOR"] = "proofOfDirector";
+  DocumentType2["PROOF_OF_FUNDING"] = "proofOfFundingOrWealthSource";
   DocumentType2["PROOF_OF_NATIONAL_ID_NUMBER"] = "proofOfNationalIdNumber";
+  DocumentType2["PROOF_OF_ORGANIZATION_TAX_INFO"] = "proofOfOrganizationTaxInfo";
+  DocumentType2["PROOF_OF_RELATIONSHIP"] = "proofOfRelationship";
   DocumentType2["PROOF_OF_RESIDENCY"] = "proofOfResidency";
   DocumentType2["REGISTRATION_DOCUMENT"] = "registrationDocument";
-  DocumentType2["VAT_DOCUMENT"] = "vatDocument";
-  DocumentType2["CONSTITUTIONAL_DOCUMENT"] = "constitutionalDocument";
-  DocumentType2["DRIVING_LICENCE"] = "driving_licence";
-  DocumentType2["NATIONAL_IDENTITY_CARD"] = "national_identity_card";
   DocumentType2["RESIDENCE_PERMIT"] = "residence_permit";
-  DocumentType2["PROOF_OF_ORGANIZATION_TAX_INFO"] = "proofOfOrganizationTaxInfo";
-  DocumentType2["PROOF_OF_RELATIONSHIP"] = "proofOfRelationship";
-  DocumentType2["PROOF_OF_DIRECTOR"] = "proofOfDirector";
-  DocumentType2["PROOF_OF_FUNDING"] = "proofOfFundingOrWealthSource";
+  DocumentType2["VAT_DOCUMENT"] = "vatDocument";
   return DocumentType2;
 })(DocumentType || {});
 function getFormProps(props, innerFormId) {
@@ -3344,6 +3383,7 @@ var ExperimentNames = /* @__PURE__ */ ((ExperimentNames2) => {
   ExperimentNames2["ShowCustomerSupportV4"] = "ShowCustomerSupportV4";
   ExperimentNames2["EnableRegistrationAndTaxAbsentStatesV4"] = "EnableRegistrationAndTaxAbsentStatesV4";
   ExperimentNames2["CredentialBankingWeightage_EmphasizeCredentialBankingFlow"] = "CredentialBankingWeightage_EmphasizeCredentialBankingFlow";
+  ExperimentNames2["EnableManualCompanyTinVerification"] = "EnableManualCompanyTinVerification";
   return ExperimentNames2;
 })(ExperimentNames || {});
 const debounce$1 = (func, delay) => {
@@ -4389,7 +4429,6 @@ class UserEvents {
       subCategory: "hosted onboarding",
       countryCode: void 0,
       capabilities: void 0,
-      legalEntityId: void 0,
       task: void 0
     };
     this.sharedEventProperties = {};
@@ -4412,11 +4451,14 @@ class UserEvents {
     this.notifySubscribers();
   }
   /**
-   * Starts a timer for an event to measure the time it takes for an event to occur. Time is ended when `addEvent` is executed with the same key
+   * Adds an event with context specific to page-related events
    */
-  startEvent(eventName) {
-    this.add({ type: "start_event", name: eventName });
-    this.notifySubscribers();
+  addPageEvent(eventName, properties) {
+    this.addEvent(eventName, {
+      actionLevel: "page",
+      page: this.sharedEventProperties.page,
+      ...properties
+    });
   }
   /**
    * Adds an event with context specific to field-related events
@@ -4428,6 +4470,13 @@ class UserEvents {
       ...properties
     });
   }
+  /**
+   * Starts a timer for an event to measure the time it takes for an event to occur. Time is ended when `addEvent` is executed with the same key
+   */
+  startEvent(eventName) {
+    this.add({ type: "start_event", name: eventName });
+    this.notifySubscribers();
+  }
   /**
    * Subscribes a callback to analytics events. It gets called every time
    * one of the above public methods get called, and the event data is passed back as an array.
@@ -5034,7 +5083,7 @@ var hasOwnProperty = objectProto$1.hasOwnProperty;
 var nativeObjectToString$1 = objectProto$1.toString;
 var symToStringTag$1 = Symbol$1 ? Symbol$1.toStringTag : void 0;
 function getRawTag(value) {
-  var isOwn = hasOwnProperty.call(value, symToStringTag$1), tag = value[symToStringTag$1];
+  var isOwn = hasOwnProperty.call(value, symToStringTag$1), tag2 = value[symToStringTag$1];
   try {
     value[symToStringTag$1] = void 0;
     var unmasked = true;
@@ -5043,7 +5092,7 @@ function getRawTag(value) {
   var result = nativeObjectToString$1.call(value);
   if (unmasked) {
     if (isOwn) {
-      value[symToStringTag$1] = tag;
+      value[symToStringTag$1] = tag2;
     } else {
       delete value[symToStringTag$1];
     }
@@ -5191,7 +5240,7 @@ const getAssociatedLeAnalyticsPayload = ({
     associatedLegalEntityOrgType: associatedLegalEntityOrg.type
   } : {}
 });
-const debouncedInputEvent$1 = debounce(
+const debouncedInputEvent = debounce(
   (properties) => userEvents.addFieldEvent("Interacted with form field", properties),
   500
 );
@@ -5343,7 +5392,7 @@ const Select = ({
     (e) => {
       const { value } = e.target;
       if (enableTracking) {
-        debouncedInputEvent$1({ actionType: "input", field: name });
+        debouncedInputEvent({ actionType: "input", field: name });
       }
       if (isSearch) debouncedOnSearch(value);
       if (!onSearchTextChange) {
@@ -5673,7 +5722,7 @@ const InputBase = forwardRef((props, ref) => {
   const handleInput = (e) => {
     var _a2;
     if (enableTracking) {
-      debouncedInputEvent$1({ actionType: "input", field: name });
+      debouncedInputEvent({ actionType: "input", field: name });
     }
     e.target.value = convertFullToHalf(e.target.value);
     (_a2 = props.onInput) == null ? void 0 : _a2.call(props, e);
@@ -11693,7 +11742,8 @@ const businessDetailsBase = {
   registrationNumber: { rule: "countryRequiresRegistrationNumberForCompanies" },
   exemptedFromRegistrationNumber: { rule: "companyRegistrationNumberExemptionAllowed" },
   eInvoicingCode: { rule: "isEInvoicingCodeEnabled" },
-  countryOfGoverningLaw: { rule: "countryOfGoverningLawRequired" }
+  countryOfGoverningLaw: { rule: "countryOfGoverningLawRequired" },
+  taxDocument: { rule: "ifCountryUsAndTinFailed" }
 };
 const taxInformationBase$1 = {
   vatNumber: { rule: "countryUsesVat" },
@@ -12559,10 +12609,6 @@ function Dropzone(props) {
   ] });
 }
 const logger$M = createLogger("TextArea");
-const debouncedInputEvent = debounce(
-  (properties) => userEvents.addFieldEvent("Interacted with form field", properties),
-  500
-);
 function TextArea(props) {
   const { classNameModifiers, uniqueId, ...passedProps } = props;
   const {
@@ -13014,7 +13060,7 @@ const financialInfoValidationRules = {
   }
 };
 const financialInformationReportedValueOptions = "adyen-kyc-financial-information-reported-value-options";
-const styles$g = {
+const styles$j = {
   financialInformationReportedValueOptions
 };
 const logger$L = createLogger("InputCurrency");
@@ -13061,7 +13107,7 @@ const InputCurrency = ({
 };
 const reportedValue = "adyen-kyc-reported-value";
 const reportedValueInput = "adyen-kyc-reported-value-input";
-const styles$f = {
+const styles$i = {
   reportedValue,
   reportedValueInput
 };
@@ -13076,7 +13122,7 @@ const ReportedValue = ({
   isValid
 }) => {
   const { i18n } = useI18nContext();
-  return /* @__PURE__ */ jsx("div", { className: styles$f.reportedValue, children: /* @__PURE__ */ jsx(Field, { name: fieldName, errorMessage, isValid, helper, children: (childProps) => /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx("div", { className: styles$i.reportedValue, children: /* @__PURE__ */ jsx(Field, { name: fieldName, errorMessage, isValid, helper, children: (childProps) => /* @__PURE__ */ jsx(
     InputCurrency,
     {
       ...childProps,
@@ -13084,7 +13130,7 @@ const ReportedValue = ({
       currency,
       amount,
       onAmountChanged,
-      className: styles$f.reportedValueInput,
+      className: styles$i.reportedValueInput,
       "aria-label": label
     }
   ) }) });
@@ -13221,7 +13267,7 @@ function FinancialInformation(props) {
             ],
             onChange: updateReportedValueOption,
             showContentOnlyOnSelected: true,
-            className: styles$g.financialInformationReportedValueOptions
+            className: styles$j.financialInformationReportedValueOptions
           }
         )
       }
@@ -13271,7 +13317,6 @@ const COUNTRIES_WITH_HOUSE_NUMBER_FIRST = [
   CountryCodes.UnitedKingdom,
   CountryCodes.France
 ];
-const COUNTRIES_WITH_COMMA_SEPARATED = [CountryCodes.Spain];
 const ADDRESS_SCHEMAS = {
   [CountryCodes.Australia]: [COUNTRY, ADDRESS, OTHER_ADDRESS_INFORMATION, CITY, STATE, POSTAL_CODE],
   [CountryCodes.Canada]: [COUNTRY, ADDRESS, OTHER_ADDRESS_INFORMATION, CITY, POSTAL_CODE, STATE],
@@ -14173,8 +14218,7 @@ function AddressForm(props) {
     if (!street && line1) return handleChangeFor("address", "input")(line1);
     if (hasHouseNumber) {
       const isHouseNumberFirst = data.country ? COUNTRIES_WITH_HOUSE_NUMBER_FIRST.includes(data.country) : false;
-      const needsComma = data.country ? COUNTRIES_WITH_COMMA_SEPARATED.includes(data.country) : false;
-      const formattedAddress = isHouseNumberFirst ? `${houseNumberOrName}${needsComma ? ", " : " "}${street}` : `${street}${needsComma ? ", " : " "}${houseNumberOrName}`;
+      const formattedAddress = isHouseNumberFirst ? `${houseNumberOrName}${" "}${street}` : `${street}${" "}${houseNumberOrName}`;
       return handleChangeFor("address", "input")(formattedAddress);
     }
     return handleChangeFor("address", "input")(street);
@@ -14376,8 +14420,7 @@ function FieldContainer({
       if (!street && line1) return handleChangeFor("address", "input")(line1);
       if (hasHouseNumber) {
         const isHouseNumberFirst = data.country ? COUNTRIES_WITH_HOUSE_NUMBER_FIRST.includes(data.country) : false;
-        const needsComma = data.country ? COUNTRIES_WITH_COMMA_SEPARATED.includes(data.country) : false;
-        const formattedAddress = isHouseNumberFirst ? `${houseNumberOrName}${needsComma ? ", " : " "}${street}` : `${street}${needsComma ? ", " : " "}${houseNumberOrName}`;
+        const formattedAddress = isHouseNumberFirst ? `${houseNumberOrName}${" "}${street}` : `${street}${" "}${houseNumberOrName}`;
         return handleChangeFor("address", "input")(formattedAddress);
       }
       return handleChangeFor("address", "input")(street);
@@ -14662,17 +14705,13 @@ function Address({
     trustedFields,
     shouldValidate
   });
-  useEffect(
-    () => {
-      if (verifiedAddress) {
-        entriesOf(verifiedAddress).forEach(([key, value]) => {
-          if (formData[key] !== value) handleChangeFor(key, "input")(value);
-        });
-      }
-    },
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [verifiedAddress]
-  );
+  useEffect(() => {
+    if (verifiedAddress) {
+      entriesOf(verifiedAddress).forEach(([key, value]) => {
+        if (formData[key] !== value) handleChangeFor(key, "input")(value);
+      });
+    }
+  }, [verifiedAddress]);
   const formUtils = createFormUtils(
     {
       labels: labels2,
@@ -15761,7 +15800,8 @@ const rules$3 = ({
   taskType,
   isExperimentEnabled = () => false,
   accountHolder,
-  rootLegalEntity
+  rootLegalEntity,
+  tinMatched
 }) => ({
   countryRequiresStateOrProvince: () => {
     if (COUNTRIES_WITH_STATES_DATASET.includes(country)) {
@@ -15933,6 +15973,11 @@ const rules$3 = ({
     if (isExperimentEnabled("EnableEInvoicingCodeField") && COUNTRIES_REQUIRING_E_INVOICING_CODE.includes(country)) {
       return "REQUIRED";
     }
+  },
+  ifCountryUsAndTinFailed: () => {
+    if (isExperimentEnabled("EnableManualCompanyTinVerification") && isExperimentEnabled("EnableNewBusinessDetailsFlow") && tinMatched === false && country === CountryCodes.UnitedStates) {
+      return "REQUIRED";
+    }
   }
 });
 const logger$I = createLogger("mapPayoutAccountSchemaToApiBankAccount");
@@ -16060,6 +16105,11 @@ const getObscuredAccountNumber = ({
   accountIdentifier,
   realLastFour
 }) => realLastFour ? `*******${realLastFour}` : accountIdentifier;
+var EntityType = /* @__PURE__ */ ((EntityType2) => {
+  EntityType2["BANK_ACCOUNT"] = "BankAccount";
+  EntityType2["LEGAL_ENTITY"] = "LegalEntity";
+  return EntityType2;
+})(EntityType || {});
 const mandatoryApiFields = {
   INDIVIDUAL: [
     "personalDetails.firstName",
@@ -16341,7 +16391,7 @@ const remediationIndividualApiKeyMapping = {
   [DocumentType.PROOF_OF_RELATIONSHIP]: "proofOfRelationship.proofOfRelationship"
 };
 const remediationPayoutApiKeyMapping = {
-  bankAccount: "payoutAccountDetails",
+  [EntityType.BANK_ACCOUNT]: "payoutAccountDetails",
   ...payoutComponentKeyMapping,
   [DocumentType.BANK_STATEMENT]: "payoutAccountDocuments.bankStatementDocument"
 };
@@ -17224,7 +17274,7 @@ const useIdVerificationToken = ({
 };
 const loaderWrapperLoader = "adyen-kyc-loader-wrapper-loader";
 const loaderWrapperLoaderActive = "adyen-kyc-loader-wrapper-loader-active";
-const styles$e = {
+const styles$h = {
   loaderWrapperLoader,
   loaderWrapperLoaderActive
 };
@@ -17239,13 +17289,13 @@ const LoaderWrapper = ({
   const opacitySyle = status === "loading" ? {
     opacity: formOpacityWhenLoading
   } : { opacity: 1 };
-  const loaderWrapperClass = cx(styles$e.loaderWrapperLoader, {
-    [styles$e.loaderWrapperLoaderActive]: status === "loading" && showSpinner
+  const loaderWrapperClass = cx(styles$h.loaderWrapperLoader, {
+    [styles$h.loaderWrapperLoaderActive]: status === "loading" && showSpinner
   });
-  const overlayClass = cx(styles$e.loaderWrapper, className2);
+  const overlayClass = cx(styles$h.loaderWrapper, className2);
   return /* @__PURE__ */ jsxs("div", { className: overlayClass, style: { position: "relative" }, children: [
     /* @__PURE__ */ jsx("div", { className: loaderWrapperClass, children: /* @__PURE__ */ jsx(Loader, { size: loaderSize }) }),
-    /* @__PURE__ */ jsx("div", { className: styles$e.loaderWrapperForm, style: opacitySyle, children: children2 })
+    /* @__PURE__ */ jsx("div", { className: styles$h.loaderWrapperForm, style: opacitySyle, children: children2 })
   ] });
 };
 const containerId = "adyen-kyc-id-verification";
@@ -23074,11 +23124,6 @@ const getCountrySpecificTrustTypeOptions = (country) => {
     return countrySpecificTrustTypeOption;
   });
 };
-var EntityType = /* @__PURE__ */ ((EntityType2) => {
-  EntityType2["BANK_ACCOUNT"] = "BankAccount";
-  EntityType2["LEGAL_ENTITY"] = "LegalEntity";
-  return EntityType2;
-})(EntityType || {});
 var VerificationStatus = /* @__PURE__ */ ((VerificationStatus2) => {
   VerificationStatus2["VALID"] = "valid";
   VerificationStatus2["PENDING"] = "pending";
@@ -27719,7 +27764,7 @@ const preferInstantVerificationMethod = "adyen-kyc-prefer-instant-verification-m
 const preferInstantVerificationMethodCard = "adyen-kyc-prefer-instant-verification-method-card";
 const preferInstantVerificationMethodInstantButton = "adyen-kyc-prefer-instant-verification-method-instant-button";
 const preferInstantVerificationMethodModalFooter = "adyen-kyc-prefer-instant-verification-method-modal-footer";
-const styles$d = {
+const styles$g = {
   preferInstantVerificationMethod,
   preferInstantVerificationMethodCard,
   preferInstantVerificationMethodInstantButton,
@@ -27799,7 +27844,7 @@ const modalFooter = "adyen-kyc-modal-footer";
 const modalButton = "adyen-kyc-modal-button";
 const modalLarge = "adyen-kyc-modal-large";
 const modalFullscreen = "adyen-kyc-modal-fullscreen";
-const styles$c = {
+const styles$f = {
   modal,
   modalSmall,
   modalMain,
@@ -27811,7 +27856,12 @@ const styles$c = {
   modalLarge,
   modalFullscreen
 };
-const Modal = ({ children: children2, size = "medium", onClose }) => {
+const Modal = ({
+  children: children2,
+  size = "medium",
+  onClose,
+  showCloseButton = true
+}) => {
   const dialogRef = useRef(null);
   useLayoutEffect(() => {
     const dialogElement = dialogRef.current;
@@ -27832,23 +27882,23 @@ const Modal = ({ children: children2, size = "medium", onClose }) => {
     "dialog",
     {
       ref: dialogRef,
-      className: cx(styles$c.modal, {
-        [styles$c.modalSmall]: size === "small",
-        [styles$c.modalLarge]: size === "large",
-        [styles$c.modalFullscreen]: size === "fullscreen"
+      className: cx(styles$f.modal, {
+        [styles$f.modalSmall]: size === "small",
+        [styles$f.modalLarge]: size === "large",
+        [styles$f.modalFullscreen]: size === "fullscreen"
       }),
       onClose,
       role: "dialog",
-      children: /* @__PURE__ */ jsx("div", { className: styles$c.modalWrapper, children: /* @__PURE__ */ jsxs("div", { className: styles$c.modalMain, children: [
-        /* @__PURE__ */ jsx("div", { className: styles$c.modalButton, children: /* @__PURE__ */ jsx(Button, { tertiary: true, ariaLabel: "close", icon: "cross", onClick: onClose, shaded: true }) }),
+      children: /* @__PURE__ */ jsx("div", { className: styles$f.modalWrapper, children: /* @__PURE__ */ jsxs("div", { className: styles$f.modalMain, children: [
+        showCloseButton && /* @__PURE__ */ jsx("div", { className: styles$f.modalButton, children: /* @__PURE__ */ jsx(Button, { tertiary: true, ariaLabel: "close", icon: "cross", onClick: onClose, shaded: true }) }),
         children2
       ] }) })
     }
   );
 };
-const ModalHeader = ({ children: children2 }) => /* @__PURE__ */ jsx("header", { className: styles$c.modalHeader, children: children2 });
-const ModalContent = ({ children: children2 }) => /* @__PURE__ */ jsx("section", { className: styles$c.modalContent, children: children2 });
-const ModalFooter = ({ children: children2 }) => /* @__PURE__ */ jsx("footer", { className: styles$c.modalFooter, children: children2 });
+const ModalHeader = ({ children: children2 }) => /* @__PURE__ */ jsx("header", { className: styles$f.modalHeader, children: children2 });
+const ModalContent = ({ children: children2 }) => /* @__PURE__ */ jsx("section", { className: styles$f.modalContent, children: children2 });
+const ModalFooter = ({ children: children2 }) => /* @__PURE__ */ jsx("footer", { className: styles$f.modalFooter, children: children2 });
 const PreferInstantVerificationMethod = ({
   loadingStatus,
   provider,
@@ -27917,7 +27967,7 @@ const PreferInstantVerificationMethod = ({
       label: hideVerificationWidget ? i18n.get("addAccountWith", {
         values: { providerName: iconName ? "" : provider.name }
       }) : void 0,
-      className: styles$d.preferInstantVerificationMethodInstantButton,
+      className: styles$g.preferInstantVerificationMethodInstantButton,
       onClick: handleClickInstantButton,
       disabled: bankInfoValidated,
       loading: !hideVerificationWidget,
@@ -27925,8 +27975,8 @@ const PreferInstantVerificationMethod = ({
       iconPosition: "right",
       block: true
     }
-  ) : /* @__PURE__ */ jsx(Card, { background: "secondary", className: styles$d.preferInstantVerificationMethodCard, children: i18n.get("unfortunatelyAnInstantProvider") });
-  return /* @__PURE__ */ jsxs("div", { className: styles$d.preferInstantVerificationMethod, children: [
+  ) : /* @__PURE__ */ jsx(Card, { background: "secondary", className: styles$g.preferInstantVerificationMethodCard, children: i18n.get("unfortunatelyAnInstantProvider") });
+  return /* @__PURE__ */ jsxs("div", { className: styles$g.preferInstantVerificationMethod, children: [
     loadingStatus === "loading" ? /* @__PURE__ */ jsx("div", { className: "adyen-kyc-u-margin-bottom-8", children: /* @__PURE__ */ jsx(Skeleton, { height: "2.5rem" }) }) : InstantButton,
     /* @__PURE__ */ jsx(
       Button,
@@ -27964,7 +28014,7 @@ const PreferInstantVerificationMethod = ({
     isModalOpen ? /* @__PURE__ */ jsxs(Modal, { size: "small", onClose: () => setIsModalOpen(false), children: [
       /* @__PURE__ */ jsx(ModalHeader, { children: i18n.get("manuallyAddAccountQuestion") }),
       /* @__PURE__ */ jsx(ModalContent, { children: i18n.get("addingAndVerifiyingABankAccount") }),
-      /* @__PURE__ */ jsx(ModalFooter, { children: /* @__PURE__ */ jsxs("div", { className: styles$d.preferInstantVerificationMethodModalFooter, children: [
+      /* @__PURE__ */ jsx(ModalFooter, { children: /* @__PURE__ */ jsxs("div", { className: styles$g.preferInstantVerificationMethodModalFooter, children: [
         /* @__PURE__ */ jsx(Button, { label: i18n.get("yesContinue"), onClick: handleClickContinue, secondary: true }),
         /* @__PURE__ */ jsx(Button, { onClick: () => setIsModalOpen(false), label: i18n.get("cancel") })
       ] }) })
@@ -28062,6 +28112,7 @@ function PayoutVerificationMethod(props) {
   });
   const formUtils = createFormUtils(props, i18n);
   const { sliceData, updateStateSlice } = useGlobalDataSlice("payoutVerificationMethod");
+  const { clearStateSlice: clearPayoutAccountDetails } = useGlobalDataSlice("payoutAccountDetails");
   useEffect(
     () => updateStateSlice({ data: { ...sliceData, ...data }, errors, valid, fieldProblems }),
     [data, errors, fieldProblems, valid]
@@ -28126,7 +28177,10 @@ function PayoutVerificationMethod(props) {
       readonly: !intraRegionCrossBorderPayoutsAllowed || allowedBankCountries.length === 1 || bankInfoValidated,
       allowedCountries: allowedBankCountries,
       classNameModifiers: ["country"],
-      handleChangeFor: () => handleChangeFor("bankCountry", "input"),
+      handleChangeFor: () => (e) => {
+        clearPayoutAccountDetails();
+        return handleChangeFor("bankCountry", "input")(e);
+      },
       helperText: {
         country: intraRegionCrossBorderPayoutsAllowed ? void 0 : i18n.get(
           legalEntityType === LegalEntityType.INDIVIDUAL ? "youCanOnlyUseABankAccountInTheCountryRegionWhereYouLive" : "youCanOnlyUseABankAccountInTheCountryRegionWhereYourCompanyIsRegistered"
@@ -29410,22 +29464,16 @@ const getComponentMappingFromLEFieldPath = (context, entityType, isExperimentEna
   }
   switch (entityType) {
     case LegalEntityType.INDIVIDUAL:
-      return remediationIndividualApiKeyMapping[context.key];
+      return context.key in remediationIndividualApiKeyMapping ? remediationIndividualApiKeyMapping[context.key] : void 0;
     case LegalEntityType.ORGANIZATION:
-      return (isExperimentEnabled == null ? void 0 : isExperimentEnabled("EnableNewBusinessDetailsFlow")) ? (
-        // @ts-ignore
-        remediationBusinessDetailsApiKeyMapping[context.key]
-      ) : (
-        // @ts-ignore
-        remediationCompanyApiKeyMapping[context.key]
-      );
+      return (isExperimentEnabled == null ? void 0 : isExperimentEnabled("EnableNewBusinessDetailsFlow")) ? context.key in remediationBusinessDetailsApiKeyMapping ? remediationBusinessDetailsApiKeyMapping[context.key] : void 0 : context.key in remediationCompanyApiKeyMapping ? remediationCompanyApiKeyMapping[context.key] : void 0;
     case EntityType.BANK_ACCOUNT:
-      return remediationPayoutApiKeyMapping[context.key];
+      return context.key in remediationPayoutApiKeyMapping ? remediationPayoutApiKeyMapping[context.key] : void 0;
     case LegalEntityType.SOLE_PROPRIETORSHIP:
-      return remediationSolePropKeyMapping[context.key];
+      return context.key in remediationSolePropKeyMapping ? remediationSolePropKeyMapping[context.key] : void 0;
     case LegalEntityType.TRUST:
     default:
-      return remediationTrustKeyMapping[context.key];
+      return context.key in remediationTrustKeyMapping ? remediationTrustKeyMapping[context.key] : void 0;
   }
 };
 const getRemediationsWithFormsAndFields = (remediatingActions, entityType, isExperimentEnabled) => {
@@ -29679,11 +29727,12 @@ function VerificationErrors({
   formUtils
 }) {
   var _a2, _b2;
-  const getErrorMessage = (errorCode) => formUtils.getVal(`errorMessage_${errorCode}`);
+  const { i18n } = useI18nContext();
+  const getErrorMessage = (errorCode) => i18n.get(`errorMessage_${errorCode}`);
   const getRemediationMessage = (remediationActions, uploadFieldCollection) => {
     var _a3, _b3;
     if ((remediationActions == null ? void 0 : remediationActions.length) === 1) {
-      return formUtils.getVal(`remediationMessage_${remediationActions[0].code}`);
+      return i18n.get(`remediationMessage_${remediationActions[0].code}`);
     }
     const uploadFields = uploadFieldCollection && Object.keys(uploadFieldCollection);
     let uploadFilesCopy;
@@ -29697,7 +29746,7 @@ function VerificationErrors({
               NavigateToFieldLink,
               {
                 fieldName: uploadField,
-                label: formUtils.getVal(
+                label: i18n.get(
                   `remediationMessage_${(_a4 = uploadFieldCollection[uploadField]) == null ? void 0 : _a4.remediation.code}`
                 )
               }
@@ -29710,14 +29759,14 @@ function VerificationErrors({
         ] });
       } else {
         const firstUploadField = uploadFields[0];
-        const label = ` ${(_b3 = formUtils.getVal(`remediationMessage_${(_a3 = uploadFieldCollection[firstUploadField]) == null ? void 0 : _a3.remediation.code}`)) == null ? void 0 : _b3.toLowerCase()}`;
+        const label = ` ${(_b3 = i18n.get(`remediationMessage_${(_a3 = uploadFieldCollection[firstUploadField]) == null ? void 0 : _a3.remediation.code}`)) == null ? void 0 : _b3.toLowerCase()}`;
         uploadFilesCopy = /* @__PURE__ */ jsx(NavigateToFieldLink, { fieldName: firstUploadField, label });
       }
     }
     return /* @__PURE__ */ jsxs(Fragment, { children: [
-      `${formUtils.getVal("reviewTheInformationBelowAndCorrectMistakesOr")} `,
+      i18n.get("reviewTheInformationBelowAndCorrectMistakesOr"),
       uploadFilesCopy,
-      ` ${formUtils.getVal("thenResubmit")}`
+      i18n.get("thenResubmit")
     ] });
   };
   let verificationErrorMsg;
@@ -29758,14 +29807,14 @@ function VerificationErrors({
     );
   } else if (childErrorCodes.length === 2) {
     verificationErrorMsg = /* @__PURE__ */ jsxs("div", { "data-testid": "verification-error--case-2-2", children: [
-      formUtils.getVal("weFoundTheFollowingIssues"),
+      i18n.get("weFoundTheFollowingIssues"),
       /* @__PURE__ */ jsx("ul", { children: childErrorCodes.map((subErrorCode) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx("span", { children: getErrorMessage(subErrorCode) }) }, subErrorCode)) }),
       /* @__PURE__ */ jsx("span", { children: getRemediationMessage(onlyChildRemediationActions, fileUploadRemediationFields) })
     ] });
   } else {
     verificationErrorMsg = /* @__PURE__ */ jsx("div", { "data-testid": "verification-error--case-2-3", children: getRemediationMessage(onlyChildRemediationActions, fileUploadRemediationFields) });
   }
-  const defaultHeading = parentCode ? getErrorMessage(parentCode) : formUtils.getVal("correctErrorsResubmit");
+  const defaultHeading = parentCode ? getErrorMessage(parentCode) : i18n.get("correctErrorsResubmit");
   return /* @__PURE__ */ jsx(Alert, { title: defaultHeading, variant: "error", children: verificationErrorMsg });
 }
 function ErrorPanel({
@@ -29834,9 +29883,9 @@ function Summary({
           icon: "edit",
           onClick: () => {
             trackNavigation2({
-              fromForm: "summary",
+              actionType: "edit",
               toForm: formName,
-              component: "Pencil icon"
+              label: "Pencil icon"
             });
             editForm(formId);
           },
@@ -29876,6 +29925,9 @@ function Summary({
     Object.entries(innerForms).forEach(([innerFormName, innerFormFieldData]) => {
       const formName = i18n.get(labelData == null ? void 0 : labelData[innerFormName]) || i18n.get(innerFormName);
       if (typeof innerFormFieldData === "object" && innerFormFieldData !== null) {
+        if (Object.values(innerFormFieldData).every((value) => isEmpty$1(value))) {
+          return;
+        }
         dataList.push(renderSummarySection(innerFormFieldData, labelData, formName, parentFormId));
       }
     });
@@ -29932,18 +29984,18 @@ function Summary({
   ] });
 }
 const trackNavigation = ({
-  fromForm,
+  actionType,
   toForm,
-  component,
+  label,
+  returnValue,
   baseTrackingPayload
 }) => {
-  userEvents.addEvent("Clicked button", {
-    ...baseTrackingPayload,
-    actionLevel: "page",
-    actionType: "navigate",
-    page: fromForm,
-    label: component,
-    toPage: toForm
+  userEvents.addPageEvent("Clicked button", {
+    actionType,
+    toPage: toForm,
+    label,
+    returnValue,
+    ...baseTrackingPayload
   });
 };
 const getOpeningStep = (forms, remediationActions) => {
@@ -29987,7 +30039,7 @@ const useFormComposer = ({
     );
   }, [forms]);
   useEffect(() => {
-    userEvents.updateSharedEventProperties({ page: activeForm.formHeading || activeForm.formId });
+    userEvents.updateSharedEventProperties({ page: activeForm.formName });
   }, [activeForm]);
   useEffect(() => {
     if (hasAlreadyNavigatedForm) return;
@@ -29996,14 +30048,6 @@ const useFormComposer = ({
       setActiveForm(openingStep);
     }
   }, [activeForm, forms, problems == null ? void 0 : problems.remediationActions, hasAlreadyNavigatedForm]);
-  const trackSectionCompletion = (formName) => {
-    userEvents.addEvent("Success", {
-      ...baseTrackingPayload,
-      actionLevel: "page",
-      actionType: "next",
-      page: formName
-    });
-  };
   const gotoFormByFormIndex = (nextFormIndex) => {
     if (formRef == null ? void 0 : formRef.current.verifyForm) {
       formRef.current.verifyForm(activeForm.formId).then((isVerified) => {
@@ -30027,6 +30071,12 @@ const useFormComposer = ({
     }
     if (!activeForm.isValid) {
       validateCurrentForm();
+      trackNavigation({
+        actionType: "next",
+        label: "next",
+        returnValue: "validation error",
+        baseTrackingPayload
+      });
       return;
     }
     if (isFinalStep) {
@@ -30034,27 +30084,25 @@ const useFormComposer = ({
       return;
     }
     setShouldValidate(false);
-    const toFormIndex = forms.findIndex((form) => form.formId === activeForm.formId) + 1;
+    const toFormIndex = currentStep + 1;
     gotoFormByFormIndex(toFormIndex);
     trackNavigation({
-      fromForm: activeForm.formName,
+      actionType: "next",
       toForm: forms[toFormIndex].formName,
-      component: "ActionBar",
+      label: "next",
+      returnValue: "success",
       baseTrackingPayload
     });
-    trackSectionCompletion(activeForm.formName);
   };
   const handleBackClick = () => {
-    const currentFormIndex = forms.findIndex((form) => form.formId === activeForm.formId);
-    if (currentFormIndex) {
-      const fromForm = forms[currentFormIndex];
-      const toForm = forms[currentFormIndex - 1];
+    if (currentStep > 0) {
+      const toForm = forms[currentStep - 1];
       setActiveForm(toForm);
       setHasAlreadyNavigatedForm(true);
       trackNavigation({
-        fromForm: fromForm.formName,
+        actionType: "back",
         toForm: toForm.formName,
-        component: "ActionBar",
+        label: "back",
         baseTrackingPayload
       });
     }
@@ -30754,19 +30802,13 @@ const addValidityToForms = (forms, formValidity, problems) => forms.map(({ formI
 const convertApiFieldNameToSchemaFieldName = (apiField, legalEntityType, isExperimentEnabled) => {
   switch (legalEntityType) {
     case LegalEntityType.INDIVIDUAL:
-      return individualApiKeyMapping[apiField];
+      return apiField in individualApiKeyMapping ? individualApiKeyMapping[apiField] : void 0;
     case LegalEntityType.ORGANIZATION:
-      return (isExperimentEnabled == null ? void 0 : isExperimentEnabled("EnableNewBusinessDetailsFlow")) ? (
-        // @ts-ignore
-        businessDetailsApiKeyMapping[apiField]
-      ) : (
-        // @ts-ignore
-        companyApiKeyMapping[apiField]
-      );
+      return (isExperimentEnabled == null ? void 0 : isExperimentEnabled("EnableNewBusinessDetailsFlow")) ? apiField in businessDetailsApiKeyMapping ? businessDetailsApiKeyMapping[apiField] : void 0 : apiField in companyApiKeyMapping ? companyApiKeyMapping[apiField] : void 0;
     case LegalEntityType.SOLE_PROPRIETORSHIP:
-      return solePropApiKeyMapping[apiField];
+      return apiField in solePropApiKeyMapping ? solePropApiKeyMapping[apiField] : void 0;
     case LegalEntityType.TRUST:
-      return trustApiKeyMapping[apiField];
+      return apiField in trustApiKeyMapping ? trustApiKeyMapping[apiField] : void 0;
     default:
       throw Error("No valid legal entity type, cannot convert");
   }
@@ -30829,7 +30871,7 @@ const structuredList = "adyen-kyc-structured-list";
 const structuredListListItem = "adyen-kyc-structured-list-list-item";
 const structuredListLabel = "adyen-kyc-structured-list-label";
 const structuredListValue = "adyen-kyc-structured-list-value";
-const styles$b = {
+const styles$e = {
   structuredList,
   structuredListListItem,
   structuredListLabel,
@@ -30837,9 +30879,9 @@ const styles$b = {
 };
 const StructuredList = ({ items }) => {
   const { i18n } = useI18nContext();
-  return /* @__PURE__ */ jsx("dl", { className: styles$b.structuredList, children: items.map((item) => /* @__PURE__ */ jsxs("div", { className: styles$b.structuredListListItem, children: [
-    /* @__PURE__ */ jsx("dt", { className: styles$b.structuredListLabel, children: i18n.get(item.labelKey) }),
-    /* @__PURE__ */ jsx("dd", { className: styles$b.structuredListValue, children: item.value })
+  return /* @__PURE__ */ jsx("dl", { className: styles$e.structuredList, children: items.map((item) => /* @__PURE__ */ jsxs("div", { className: styles$e.structuredListListItem, children: [
+    /* @__PURE__ */ jsx("dt", { className: styles$e.structuredListLabel, children: i18n.get(item.labelKey) }),
+    /* @__PURE__ */ jsx("dd", { className: styles$e.structuredListValue, children: item.value })
   ] }, item.labelKey)) });
 };
 function VerifiedBusinessCard({
@@ -31171,16 +31213,12 @@ function AdditionalInformation({
       }
     };
   }, [verifiedBusiness, basicInformation == null ? void 0 : basicInformation.stateOrProvince, country]);
-  useEffect(
-    () => {
-      applyVerifiedBusinessData(verifiedBusiness, handleChangeFor);
-      if (basicInformation && (verifiedBusiness == null ? void 0 : verifiedBusiness.name)) {
-        basicInformation.legalCompanyName = verifiedBusiness.name;
-      }
-    },
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [verifiedBusiness]
-  );
+  useEffect(() => {
+    applyVerifiedBusinessData(verifiedBusiness, handleChangeFor);
+    if (basicInformation && (verifiedBusiness == null ? void 0 : verifiedBusiness.name)) {
+      basicInformation.legalCompanyName = verifiedBusiness.name;
+    }
+  }, [verifiedBusiness]);
   useEffect(() => {
     if (!verifiedBusiness && !showCompanyStructure) resetToDefaultData();
   }, [verifiedBusiness]);
@@ -31755,7 +31793,7 @@ function BusinessSelection({
   if ((searchResults == null ? void 0 : searchResults.length) && !showCompanyStructure || showLoader) {
     return /* @__PURE__ */ jsxs("div", { className: businessSelectionClasses, children: [
       /* @__PURE__ */ jsx("div", { className: loaderClasses, "data-testId": "business-selection-loader", children: /* @__PURE__ */ jsx(Loader, { size: "large" }) }),
-      (searchResults == null ? void 0 : searchResults.length) && !showCompanyStructure && !showLoader && /* @__PURE__ */ jsxs(Fragment, { children: [
+      !!((searchResults == null ? void 0 : searchResults.length) && !showCompanyStructure && !showLoader) && /* @__PURE__ */ jsxs(Fragment, { children: [
         /* @__PURE__ */ jsx(FormHeader, { heading: i18n.get("businessSelection__heading") }),
         /* @__PURE__ */ jsx(CardGroup, { spaced: true, children: searchResults == null ? void 0 : searchResults.map((result) => /* @__PURE__ */ jsx(
           BusinessInformationCard,
@@ -33363,7 +33401,7 @@ const progressStep = "adyen-kyc-progress-step";
 const progressStepActive = "adyen-kyc-progress-step-active";
 const progressStepLabel = "adyen-kyc-progress-step-label";
 const progressBarCircles = "adyen-kyc-progress-bar-circles";
-const styles$a = {
+const styles$d = {
   progress,
   progressBar,
   progressBarThick,
@@ -33391,14 +33429,14 @@ const StepProgressIndicator = ({
     "div",
     {
       "aria-label": `Step ${activeStepIndex} of ${stepsCount}`,
-      className: styles$a.progress,
+      className: styles$d.progress,
       role: "group",
       children: /* @__PURE__ */ jsx(
         "ol",
         {
-          className: cx(styles$a.progressBar, {
-            [styles$a.progressBarThick]: thick,
-            [styles$a.progressBarCircles]: circles
+          className: cx(styles$d.progressBar, {
+            [styles$d.progressBarThick]: thick,
+            [styles$d.progressBarCircles]: circles
           }),
           children: range(stepsCount).map((stepNumber) => {
             const isHighlighted = shouldHighlight(activeStepIndex, stepNumber, fillBefore);
@@ -33406,10 +33444,10 @@ const StepProgressIndicator = ({
               "li",
               {
                 "aria-current": isHighlighted ? "step" : void 0,
-                className: cx(styles$a.progressStep, {
-                  [styles$a.progressStepActive]: isHighlighted
+                className: cx(styles$d.progressStep, {
+                  [styles$d.progressStepActive]: isHighlighted
                 }),
-                children: /* @__PURE__ */ jsx("span", { className: styles$a.progressStepLabel, children: `Step ${stepNumber}: ${stepNumber < activeStepIndex ? "completed" : "not completed"}` })
+                children: /* @__PURE__ */ jsx("span", { className: styles$d.progressStepLabel, children: `Step ${stepNumber}: ${stepNumber < activeStepIndex ? "completed" : "not completed"}` })
               },
               stepNumber
             );
@@ -33461,9 +33499,10 @@ function FormNavigation({
     if (form.formId === activeForm.formId) return;
     gotoForm(getFormIndex(form));
     trackNavigation2({
-      fromForm: form.formName,
-      toForm: activeForm.formName,
-      component: "FormNavigation"
+      actionType: "navigate",
+      toForm: form.formName,
+      label: form.formName,
+      returnValue: "success"
     });
   };
   const getNavigateHandler = (form, activeForm2) => {
@@ -33472,7 +33511,15 @@ function FormNavigation({
     if (allPriorFormsValid || !validateForm) {
       return goToForm(form);
     }
-    return activeForm2.isValid ? void 0 : validateForm;
+    return activeForm2.isValid ? void 0 : () => {
+      trackNavigation2({
+        actionType: "navigate",
+        toForm: form.formName,
+        label: form.formName,
+        returnValue: "validation error"
+      });
+      validateForm();
+    };
   };
   return /* @__PURE__ */ jsxs("div", { className: cx("adyen-kyc-form-navigation", className2), children: [
     /* @__PURE__ */ jsx("div", { className: "adyen-kyc-form-navigation__header", children: i18n.get(taskName2) }),
@@ -33536,15 +33583,9 @@ const FormWrapper = ({
   );
   const showTaxExemptedLegalCaption = showExtraTaxExemptionReasons && ((_a2 = summaryData == null ? void 0 : summaryData.companyRegistrationDetails) == null ? void 0 : _a2.vatAbsenceReason) && ["companyDetails", "businessDetails"].includes(taskName2);
   const handleTrackNavigation = useCallback(
-    ({
-      fromForm,
-      toForm,
-      component
-    }) => {
+    (props) => {
       trackNavigation({
-        fromForm,
-        toForm,
-        component,
+        ...props,
         baseTrackingPayload
       });
     },
@@ -34117,6 +34158,41 @@ const getCountryOfGoverningLaw = (isCountryOfGoverningLawEnabled, basicData) =>
   }
   return basicData == null ? void 0 : basicData.countryOfGoverningLaw;
 };
+const businessVerificationModalHeader = "adyen-kyc-business-verification-modal-header";
+const businessVerificationModalContent = "adyen-kyc-business-verification-modal-content";
+const businessVerificationModalButton = "adyen-kyc-business-verification-modal-button";
+const styles$c = {
+  businessVerificationModalHeader,
+  businessVerificationModalContent,
+  businessVerificationModalButton
+};
+const BusinessMismatchModal = ({ onContinue, onBackClick }) => {
+  const { i18n } = useI18nContext();
+  return /* @__PURE__ */ jsxs(Modal, { size: "small", onClose: () => {
+  }, showCloseButton: false, children: [
+    /* @__PURE__ */ jsx(ModalHeader, { children: /* @__PURE__ */ jsx(Typography, { variant: "title", el: "h3", className: styles$c.businessVerificationModalHeader, children: i18n.get("businessSelection__tinVerificationFailureModalHeader") }) }),
+    /* @__PURE__ */ jsxs(ModalContent, { children: [
+      /* @__PURE__ */ jsx(Typography, { el: "p", variant: "body", className: styles$c.businessVerificationModalContent, children: i18n.get("businessSelection__tinVerificationFailureModalContent") }),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          className: styles$c.businessVerificationModalButton,
+          secondary: true,
+          label: i18n.get("businessSelection__tinVerificationFailureModalPrimaryButton"),
+          onClick: onContinue
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          className: styles$c.businessVerificationModalButton,
+          label: i18n.get("businessSelection__tinVerificationFailureModalSecondaryButton"),
+          onClick: onBackClick
+        }
+      )
+    ] })
+  ] });
+};
 function BusinessDetailsDropin({
   country,
   problems,
@@ -34145,7 +34221,7 @@ function BusinessDetailsDropin({
   handleVerifyTin,
   handleClearCompanyData
 }) {
-  var _a2, _b2, _c2, _d2, _e2, _f2;
+  var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j2;
   const {
     state: { currentState }
   } = useStateContext();
@@ -34182,6 +34258,9 @@ function BusinessDetailsDropin({
     },
     [(_a2 = currentState.data.basicInformation) == null ? void 0 : _a2.country, country]
   );
+  const [tinMatched, setTinMatched] = useState(void 0);
+  const isManualTinVerificationEnabledAndUS = isExperimentEnabled(ExperimentNames.EnableManualCompanyTinVerification) && country === CountryCodes.UnitedStates;
+  const [businessMismatchModalOpen, setBusinessMismatchModalOpen] = useState(false);
   const [initialData, setInitialData] = useState(
     mapLegalEntityToBusinessDetailsSchema(legalEntityResponse, isExperimentEnabled)
   );
@@ -34230,9 +34309,10 @@ function BusinessDetailsDropin({
       country: currentCountry,
       taskType,
       isExperimentEnabled,
-      accountHolder
+      accountHolder,
+      tinMatched
     }),
-    [currentCountry, currentState.data, isExperimentEnabled, taskType, accountHolder]
+    [currentCountry, currentState.data, isExperimentEnabled, taskType, tinMatched, accountHolder]
   );
   const initialForms = useMemo(() => getForms(currentCountry), [currentCountry]);
   const derivedProps = useMemo(
@@ -34361,6 +34441,7 @@ function BusinessDetailsDropin({
     searchForBusiness,
     fetchBusinessData,
     verifyBusinessData,
+    verifyManualBusinessData,
     clearTrustedBusinessData,
     resetBusinessData,
     resetTinVerification,
@@ -34396,16 +34477,19 @@ function BusinessDetailsDropin({
       if (!(currentData == null ? void 0 : currentData.legalCompanyName) || !(currentData == null ? void 0 : currentData.country) || !(currentData == null ? void 0 : currentData.stateOrProvince)) {
         return;
       }
-      const tin = (_b3 = (_a3 = currentData == null ? void 0 : currentData.taxInformation) == null ? void 0 : _a3.find(
-        (taxId) => currentCountry === taxId.country
-      )) == null ? void 0 : _b3.number;
+      const tin = ((_b3 = (_a3 = currentData == null ? void 0 : currentData.taxInformation) == null ? void 0 : _a3.find((taxId) => currentCountry === taxId.country)) == null ? void 0 : _b3.number) || "";
       const results = await searchForBusiness({
         name: currentData.legalCompanyName,
         country: currentData.country,
         state: currentData.stateOrProvince,
         registrationNumber: currentData.registrationNumber
       });
-      if (results && results.length === 1) {
+      if (!results) {
+        setShowCompanyStructure(true);
+        setTrustedFields([]);
+        return;
+      }
+      if ((results == null ? void 0 : results.length) === 1) {
         const businessData = await fetchBusinessData(
           results[0],
           currentData.stateOrProvince
@@ -34414,14 +34498,31 @@ function BusinessDetailsDropin({
           const tinMatch = await handleVerifyBusinessData(businessData, tin);
           return tinMatch ? handleNextClick() : void 0;
         }
+      } else if (Array.isArray(results) && !(results == null ? void 0 : results.length)) {
+        if (!isManualTinVerificationEnabledAndUS) {
+          setShowCompanyStructure(true);
+          return;
+        }
+        const tinMatch = await verifyManualBusinessData(currentData.legalCompanyName, tin);
+        setTinMatched(tinMatch);
+        if (tinMatch) {
+          setShowCompanyStructure(true);
+        } else {
+          resetBusinessData();
+          setBusinessMismatchModalOpen(true);
+        }
       }
     },
     [
+      searchForBusiness,
       currentCountry,
       fetchBusinessData,
+      setShowCompanyStructure,
+      handleVerifyBusinessData,
       handleNextClick,
-      searchForBusiness,
-      handleVerifyBusinessData
+      isManualTinVerificationEnabledAndUS,
+      verifyManualBusinessData,
+      resetBusinessData
     ]
   );
   const isBusinessSelection = useMemo(
@@ -34489,9 +34590,10 @@ function BusinessDetailsDropin({
       case "basicInformation":
         if (((_b3 = currentState.validityByForm) == null ? void 0 : _b3.basicInformation) && !isBusinessSelection && !verifiedBusiness) {
           trackNavigation({
-            fromForm: activeForm.formName,
+            actionType: "next",
             toForm: toFormName || "home",
-            component: "next"
+            label: "next",
+            returnValue: "success"
           });
           findBusiness(currentState.data.basicInformation);
           setShowBusinessSelection(true);
@@ -34506,7 +34608,6 @@ function BusinessDetailsDropin({
     handleNextClick,
     forms,
     activeForm.formId,
-    activeForm.formName,
     (_e2 = currentState.validityByForm) == null ? void 0 : _e2.basicInformation,
     currentState.data.basicInformation,
     isBusinessSelection,
@@ -34518,9 +34619,9 @@ function BusinessDetailsDropin({
     switch (activeForm.formId) {
       case "basicInformation": {
         trackNavigation({
-          fromForm: activeForm.formName,
+          actionType: "back",
           toForm: "basicDetails",
-          component: "back"
+          label: "back"
         });
         return showBusinessSelection ? setShowBusinessSelection(false) : void 0;
       }
@@ -34548,8 +34649,6 @@ function BusinessDetailsDropin({
     currentCountry,
     handleBackClick,
     activeForm.formId,
-    activeForm.formName,
-    i18n,
     showBusinessSelection,
     searching,
     searchResults,
@@ -34557,35 +34656,63 @@ function BusinessDetailsDropin({
   ]);
   const homeClick = () => {
     trackNavigation({
-      fromForm: activeForm.formName,
+      actionType: "save",
       toForm: "home",
-      component: "home"
+      label: "home"
     });
     handleHomeClick == null ? void 0 : handleHomeClick();
   };
   const proceedToManualDataEntry = useCallback(async () => {
-    await clearTrustedBusinessData().then(() => setShowCompanyStructure(true));
-  }, [clearTrustedBusinessData]);
-  useEffect(() => {
-    if (searchResults && !searchResults.length || searching === "error") {
-      setShowCompanyStructure(true);
-      setTrustedFields([]);
-    }
-  }, [searchResults, searching]);
+    await clearTrustedBusinessData().then(async () => {
+      var _a3, _b3, _c3, _d3, _e3;
+      if (!isManualTinVerificationEnabledAndUS) {
+        setShowCompanyStructure(true);
+        return;
+      }
+      const businessName = ((_b3 = (_a3 = currentState == null ? void 0 : currentState.data) == null ? void 0 : _a3.basicInformation) == null ? void 0 : _b3.legalCompanyName) || "";
+      const taxInformation = (_d3 = (_c3 = currentState == null ? void 0 : currentState.data) == null ? void 0 : _c3.basicInformation) == null ? void 0 : _d3.taxInformation;
+      const tin = ((_e3 = taxInformation == null ? void 0 : taxInformation.find((taxId) => currentCountry === taxId.country)) == null ? void 0 : _e3.number) || "";
+      const tinMatch = await verifyManualBusinessData(businessName, tin);
+      if (tinMatch) {
+        setShowCompanyStructure(true);
+        setBusinessMismatchModalOpen(false);
+      } else {
+        setBusinessMismatchModalOpen(true);
+        setTinMatched(false);
+      }
+    });
+  }, [
+    clearTrustedBusinessData,
+    isManualTinVerificationEnabledAndUS,
+    (_g2 = (_f2 = currentState == null ? void 0 : currentState.data) == null ? void 0 : _f2.basicInformation) == null ? void 0 : _g2.legalCompanyName,
+    (_i2 = (_h2 = currentState == null ? void 0 : currentState.data) == null ? void 0 : _h2.basicInformation) == null ? void 0 : _i2.taxInformation,
+    verifyManualBusinessData,
+    currentCountry
+  ]);
+  const handleBusinessMismatchContinue = useCallback(() => {
+    setShowCompanyStructure(true);
+    setTrustedFields([]);
+    setBusinessMismatchModalOpen(false);
+  }, [setShowCompanyStructure, setTrustedFields, setBusinessMismatchModalOpen]);
+  const handleBusinessMismatchCancel = useCallback(() => {
+    backClick == null ? void 0 : backClick();
+    setBusinessMismatchModalOpen(false);
+    setTinMatched(void 0);
+  }, [backClick, setTinMatched, setBusinessMismatchModalOpen]);
   useEffect(() => {
     var _a3, _b3;
     if (((_a3 = currentState.data.basicInformation) == null ? void 0 : _a3.legalCompanyName) !== currentSearchName && ((_b3 = currentState.data.basicInformation) == null ? void 0 : _b3.legalCompanyName) !== (verifiedBusiness == null ? void 0 : verifiedBusiness.name)) {
       setShowCompanyStructure(false);
       resetBusinessData();
     }
-  }, [currentSearchName, (_f2 = currentState.data.basicInformation) == null ? void 0 : _f2.legalCompanyName, verifiedBusiness]);
+  }, [currentSearchName, (_j2 = currentState.data.basicInformation) == null ? void 0 : _j2.legalCompanyName, verifiedBusiness]);
   useEffect(() => {
     var _a3;
     if ((trustedFields == null ? void 0 : trustedFields.length) && ((_a3 = legalEntityResponse.organization) == null ? void 0 : _a3.registeredAddress.country) !== currentCountry) {
       setTrustedFields(void 0);
     }
   }, [currentCountry]);
-  return /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsxs(
     FormWrapper,
     {
       taskName: taskName2 ?? "businessDetails",
@@ -34607,38 +34734,47 @@ function BusinessDetailsDropin({
       steps,
       showBackButton,
       hideNextButton,
-      children: /* @__PURE__ */ jsx(
-        BusinessDetails,
-        {
-          ...derivedProps,
-          ref: formRef,
-          data: initialData,
-          country: currentCountry,
-          problems: currentProblems,
-          activeForm,
-          shouldValidate,
-          isTopLevelEntity: taskType === TaskTypes.BUSINESS_DETAILS,
-          baseTrackingPayload,
-          showBusinessSelection,
-          setShowBusinessSelection,
-          showCompanyStructure,
-          setShowCompanyStructure,
-          searchResults,
-          invalidTin,
-          resetTinVerification,
-          verifiedBusiness,
-          searching,
-          fetching,
-          verifying,
-          resettingTrustedData,
-          fetchBusinessData,
-          verifyBusinessData,
-          proceedToManualDataEntry,
-          handleNextClick: nextClick,
-          handleAddressSearch,
-          handleFindAddress
-        }
-      )
+      children: [
+        /* @__PURE__ */ jsx(
+          BusinessDetails,
+          {
+            ...derivedProps,
+            ref: formRef,
+            data: initialData,
+            country: currentCountry,
+            problems: currentProblems,
+            activeForm,
+            shouldValidate,
+            isTopLevelEntity: taskType === TaskTypes.BUSINESS_DETAILS,
+            baseTrackingPayload,
+            showBusinessSelection,
+            setShowBusinessSelection,
+            showCompanyStructure,
+            setShowCompanyStructure,
+            searchResults,
+            invalidTin,
+            resetTinVerification,
+            verifiedBusiness,
+            searching,
+            fetching,
+            verifying,
+            resettingTrustedData,
+            fetchBusinessData,
+            verifyBusinessData,
+            proceedToManualDataEntry,
+            handleNextClick: nextClick,
+            handleAddressSearch,
+            handleFindAddress
+          }
+        ),
+        businessMismatchModalOpen && /* @__PURE__ */ jsx(
+          BusinessMismatchModal,
+          {
+            onContinue: handleBusinessMismatchContinue,
+            onBackClick: handleBusinessMismatchCancel
+          }
+        )
+      ]
     }
   );
 }
@@ -35963,6 +36099,10 @@ const BusinessTypeSelection = ({
     if (loadingStatus === "loading") return;
     triggerValidation();
     if (isValid) {
+      userEvents.addEvent("Clicked button", {
+        actionLevel: "task",
+        actionType: "next"
+      });
       if (((_a3 = data.businessType) == null ? void 0 : _a3.id) === "legalArrangement") {
         if (currentStep !== 1) {
           setCurrentStep(
@@ -36239,6 +36379,12 @@ function CustomerSupport({
     // Old phone field data
     email: (_f2 = (_e2 = legalEntityResponse[legalEntityType]) == null ? void 0 : _e2.support) == null ? void 0 : _f2.email
   };
+  useEffect(() => {
+    userEvents.addEvent("Landed on page", {
+      actionLevel: "task",
+      actionType: "start"
+    });
+  }, []);
   const submitForm = async () => {
     if (!currentState.isValid) {
       setShouldValidate(true);
@@ -36252,6 +36398,10 @@ function CustomerSupport({
     try {
       await (handleUpdateLegalEntity == null ? void 0 : handleUpdateLegalEntity(payload, legalEntityResponse == null ? void 0 : legalEntityResponse.id));
       onSubmit();
+      userEvents.addEvent("Success", {
+        actionLevel: "task",
+        actionType: "submit"
+      });
     } catch {
       const label = i18n.get("failedToUpdateDetails");
       logger$t.error(label, payload);
@@ -36450,7 +36600,7 @@ const VerificationErrorAlert = ({
 };
 const actionsMenu = "adyen-kyc-actions-menu";
 const actionsMenuOption = "adyen-kyc-actions-menu-option";
-const styles$9 = {
+const styles$b = {
   actionsMenu,
   actionsMenuOption
 };
@@ -36496,12 +36646,12 @@ const ActionsMenu = ({ options, open, setOpen }) => {
       icon,
       label,
       title: title ?? label,
-      className: styles$9.actionsMenuOption,
+      className: styles$b.actionsMenuOption,
       role: "menuitem"
     },
     label
   ));
-  return open ? /* @__PURE__ */ jsx(ClickAwayWrapper, { onClickAway: () => setOpen(false), className: styles$9.actionsMenu, role: "menu", children: menuItems }) : null;
+  return open ? /* @__PURE__ */ jsx(ClickAwayWrapper, { onClickAway: () => setOpen(false), className: styles$b.actionsMenu, role: "menu", children: menuItems }) : null;
 };
 const Remove = ({
   onRemove,
@@ -36574,9 +36724,32 @@ const Remove = ({
     }
   );
 };
+const tag = "adyen-kyc-tag";
+const tagGrey = "adyen-kyc-tag-grey";
+const tagBlue = "adyen-kyc-tag-blue";
+const tagOrange = "adyen-kyc-tag-orange";
+const tagRed = "adyen-kyc-tag-red";
+const tagTeal = "adyen-kyc-tag-teal";
+const tagGreen = "adyen-kyc-tag-green";
+const styles$a = {
+  tag,
+  tagGrey,
+  tagBlue,
+  tagOrange,
+  tagRed,
+  tagTeal,
+  tagGreen
+};
+const variantMap = {
+  grey: styles$a.tagGrey,
+  teal: styles$a.tagTeal,
+  red: styles$a.tagRed,
+  green: styles$a.tagGreen,
+  orange: styles$a.tagOrange,
+  blue: styles$a.tagBlue
+};
 const Tag = ({ className: className2, variant = "blue", children: children2 }) => {
-  const classNames = cx("adyen-kyc-tag", className2, `adyen-kyc-tag--${variant}`);
-  return /* @__PURE__ */ jsx("span", { className: classNames, children: children2 });
+  return /* @__PURE__ */ jsx("span", { className: cx(styles$a.tag, variantMap[variant], className2), children: children2 });
 };
 const EntityAssociation = ({
   name,
@@ -36772,6 +36945,12 @@ const DecisionMakers = ({
   );
   const uniqueDecisionMakers = mappedDecisionMakers ? Object.values(mappedDecisionMakers) : [];
   const showWarning = Boolean(remediationMessages.DECISION_MAKER && uniqueDecisionMakers.length);
+  useEffect(() => {
+    userEvents.addEvent("Landed on page", {
+      actionLevel: "task",
+      actionType: "start"
+    });
+  }, []);
   useEffect(() => {
     if (showWarning) {
       userEvents.addEvent("Encountered error", {
@@ -37090,15 +37269,16 @@ const Introduction = ({
     page: (introductionScreens == null ? void 0 : introductionScreens.length) ? introductionScreens[activeIndex] : void 0
   };
   useEffect(() => {
-    if (introductionScreens == null ? void 0 : introductionScreens.length) {
-      userEvents.addEvent("Landed on page", {
-        actionLevel: "task",
-        actionType: "start"
-      });
-    } else {
+    userEvents.addEvent("Landed on page", {
+      actionLevel: "task",
+      actionType: "start"
+    });
+  }, []);
+  useEffect(() => {
+    if (!(introductionScreens == null ? void 0 : introductionScreens.length)) {
       onExitIntroduction();
     }
-  }, [introductionScreens]);
+  }, [introductionScreens, onExitIntroduction]);
   const translationKeys = {
     skip: "goToOverviewFromIntroduction",
     back: "back",
@@ -37163,7 +37343,7 @@ const Introduction = ({
           onClick: () => {
             userEvents.addEvent("Success", {
               actionLevel: "task",
-              actionType: "start",
+              actionType: "submit",
               label: translationKeys.start
             });
             onExitIntroduction();
@@ -37276,8 +37456,27 @@ const SingpassLoginButton = ({
     ]
   }
 );
-const SingpassBanner = (props) => {
-  const { isLoading, isSuccess, errorMessage, onClick, onAlertClose, onMessage, legalEntityType } = props;
+const SingpassBanner = ({
+  isLoading,
+  isSuccess,
+  errorMessage,
+  onClick,
+  onAlertClose,
+  onMessage,
+  legalEntityType
+}) => {
+  const authContext = useAuthContext();
+  const singpassEventListener = useCallback(
+    (event) => {
+      if (event.origin !== authContext.loadingContext) return;
+      onMessage({ data: { isSuccessful: event.data.isSuccessful } });
+    },
+    [authContext.loadingContext, onMessage]
+  );
+  useEffect(() => {
+    window.addEventListener("message", singpassEventListener);
+    return () => window.removeEventListener("message", singpassEventListener);
+  }, []);
   const channel = new BroadcastChannel("sgidprovider");
   useEffect(() => {
     channel.onmessage = onMessage;
@@ -37482,6 +37681,7 @@ const useBusinessSetup = (legalEntityResponse) => {
   return businessSetup;
 };
 const TaskListItem = ({
+  titleKey,
   title,
   icon,
   status,
@@ -37498,18 +37698,31 @@ const TaskListItem = ({
   removeEntity,
   isRemoveDisabled = false,
   handleIsRemoveDisabled,
-  testId
+  testId,
+  enableTracking = true
 }) => {
+  const { i18n } = useI18nContext();
   const shouldShowErrorAlert = showErrorAlerts === "always" || showErrorAlerts === "onErrorStatus" && status === TaskStatus.ERROR;
   const [isStatusRemoving, setIsStatusRemoving] = useState(false);
+  const handleNavigateToTask = () => {
+    if (enableTracking) {
+      userEvents.addEvent("Clicked button", {
+        actionLevel: "journey",
+        actionType: "open",
+        task: void 0,
+        label: titleKey
+      });
+    }
+    onNavigateToTask == null ? void 0 : onNavigateToTask();
+  };
   return /* @__PURE__ */ jsx(
     Card,
     {
       stateful: onNavigateToTask && !loading && !disabled,
       warning: showWarningAlert,
       warningMessage,
-      onClick: loading ? void 0 : onNavigateToTask,
-      onKeyDown: handleKeys(["Enter"], onNavigateToTask ?? noop$2),
+      onClick: loading ? void 0 : handleNavigateToTask,
+      onKeyDown: handleKeys(["Enter"], handleNavigateToTask ?? noop$2),
       className: "adyen-task",
       disabled,
       children: /* @__PURE__ */ jsxs(
@@ -37523,7 +37736,7 @@ const TaskListItem = ({
               /* @__PURE__ */ jsxs("div", { className: "adyen-task-item__header", children: [
                 /* @__PURE__ */ jsxs("div", { className: "adyen-task-item__heading", children: [
                   /* @__PURE__ */ jsx("span", { className: "adyen-task-item__icon-wrapper", children: /* @__PURE__ */ jsx(Icon, { name: icon }) }),
-                  /* @__PURE__ */ jsx("div", { className: "adyen-task-item__body", children: /* @__PURE__ */ jsx("span", { className: "adyen-task-item__title", children: title }) })
+                  /* @__PURE__ */ jsx("div", { className: "adyen-task-item__body", children: /* @__PURE__ */ jsx("span", { className: "adyen-task-item__title", children: title || i18n.get(titleKey) }) })
                 ] }),
                 info && /* @__PURE__ */ jsxs("div", { className: "adyen-task-item__info", children: [
                   /* @__PURE__ */ jsx(Icon, { name: "info-circle" }),
@@ -37576,6 +37789,7 @@ const PayoutAccountTaskListItem = ({
       disabled: isInstantVerificationAccount && status === TaskStatus.PROCESSING,
       onNavigateToTask: isInstantVerificationAccount ? void 0 : onNavigateToTask,
       icon: "payout",
+      titleKey: "accountNumber",
       title: obscuredAccountNumber,
       status,
       problems: (_a2 = capabilityProblems == null ? void 0 : capabilityProblems.BankAccount) == null ? void 0 : _a2[account.id],
@@ -37744,7 +37958,7 @@ function TaskList({
               {
                 onNavigateToTask: handleOnNavigateToTaskIndividual,
                 icon: "decision-maker",
-                title: hasTrust ? i18n.get("trusteePersonalDetails") : i18n.get("personalDetails"),
+                titleKey: hasTrust ? "trusteePersonalDetails" : "personalDetails",
                 status: getTaskStatus(TaskTypes.INDIVIDUAL),
                 problems: (_e2 = capabilityProblems == null ? void 0 : capabilityProblems.LegalEntity) == null ? void 0 : _e2[legalEntityResponse.id]
               }
@@ -37754,7 +37968,7 @@ function TaskList({
               {
                 onNavigateToTask: handleOnNavigateToTaskLegalRepresentative,
                 icon: "decision-maker",
-                title: i18n.get("legalRepresentative"),
+                titleKey: "legalRepresentative",
                 status: getTaskStatus(TaskTypes.LEGAL_REPRESENTATIVE_DETAILS)
               }
             ),
@@ -37763,9 +37977,7 @@ function TaskList({
               {
                 onNavigateToTask: handleOnNavigateToSoleProp,
                 icon: "company",
-                title: i18n.get(
-                  canChangeEntityType ? "soleProprietorshipDetails" : "soleProprietorDetails"
-                ),
+                titleKey: canChangeEntityType ? "soleProprietorshipDetails" : "soleProprietorDetails",
                 status: getTaskStatus(TaskTypes.SOLE_PROPRIETOR_COMPANY),
                 problems: getOwnSolePropProblems(legalEntityResponse, capabilityProblems)
               }
@@ -37776,7 +37988,7 @@ function TaskList({
                 testId: TaskTypes.COMPANY,
                 onNavigateToTask: handleOnNavigateToTaskCompany,
                 icon: "company",
-                title: hasTrust ? i18n.get("companyTrusteeDetails") : i18n.get("companyDetails"),
+                titleKey: hasTrust ? "companyTrusteeDetails" : "companyDetails",
                 status: getTaskStatus(TaskTypes.COMPANY),
                 problems: (_f2 = capabilityProblems == null ? void 0 : capabilityProblems.LegalEntity) == null ? void 0 : _f2[legalEntityResponse.id]
               }
@@ -37787,7 +37999,7 @@ function TaskList({
                 testId: TaskTypes.BUSINESS_DETAILS,
                 onNavigateToTask: handleOnNavigateToTaskBusinessDetails,
                 icon: "company",
-                title: hasTrust ? i18n.get("businessTrusteeDetails") : i18n.get("businessDetails"),
+                titleKey: hasTrust ? "businessTrusteeDetails" : "businessDetails",
                 status: getTaskStatus(TaskTypes.BUSINESS_DETAILS),
                 problems: (_g2 = capabilityProblems == null ? void 0 : capabilityProblems.LegalEntity) == null ? void 0 : _g2[legalEntityResponse.id]
               }
@@ -37797,7 +38009,7 @@ function TaskList({
               {
                 onNavigateToTask: handleOnNavigateToTaskDecisionMaker,
                 icon: "decision-maker",
-                title: i18n.get("decisionMakers"),
+                titleKey: "decisionMakers",
                 status: getTaskStatus(TaskTypes.DECISION_MAKER_OVERVIEW),
                 showWarningAlert: showDecisionMakersWarning,
                 warningMessage: remediationMessages[TaskTypes.DECISION_MAKER]
@@ -37808,7 +38020,7 @@ function TaskList({
               {
                 onNavigateToTask: handleOnNavigateToTaskCustomerSupport,
                 icon: "webinar",
-                title: i18n.get("customerSupport"),
+                titleKey: "customerSupport",
                 status: getTaskStatus(TaskTypes.CUSTOMER_SUPPORT)
               }
             )
@@ -37821,7 +38033,7 @@ function TaskList({
           {
             onNavigateToTask: handleOnNavigateToTaskTrust,
             icon: "trust",
-            title: i18n.get("trustDetails"),
+            titleKey: "trustDetails",
             status: getTaskStatus(TaskTypes.TRUST),
             problems: getOwnTrustProblems(legalEntityResponse, capabilityProblems)
           }
@@ -37831,7 +38043,7 @@ function TaskList({
           {
             onNavigateToTask: handleOnNavigateToTaskTrustMember,
             icon: "decision-maker",
-            title: i18n.get("trustMembers"),
+            titleKey: "trustMembers",
             status: getTaskStatus(TaskTypes.TRUST_MEMBER_OVERVIEW)
           }
         )
@@ -37841,7 +38053,7 @@ function TaskList({
         {
           onNavigateToTask: handleOnNavigateToSourceOfFunds,
           icon: "cash-stack",
-          title: i18n.get("fundingSources"),
+          titleKey: "fundingSources",
           status: getTaskStatus(TaskTypes.SOURCE_OF_FUNDS),
           problems: getOwnTrustProblems(legalEntityResponse, capabilityProblems)
         }
@@ -37883,7 +38095,7 @@ function TaskList({
             {
               onNavigateToTask: () => handleOnNavigateToTaskPayout(),
               icon: "payout",
-              title: canChangeEntityType ? i18n.get("bankAccountDetails") : i18n.get(hasPayinTaskNotPayout ? "payinDetails" : "payoutDetails"),
+              titleKey: canChangeEntityType ? "bankAccountDetails" : hasPayinTaskNotPayout ? "payinDetails" : "payoutDetails",
               status: getTaskStatus(hasPayinTaskNotPayout ? TaskTypes.PAYIN : TaskTypes.PAYOUT),
               disabled: !canAddPayoutAccount,
               problems: getEmptyBankAccountProblems()
@@ -37897,7 +38109,7 @@ function TaskList({
           {
             onNavigateToTask: handleOnNavigateToServiceAgreement,
             icon: "contract",
-            title: i18n.get("signServiceAgreement"),
+            titleKey: "signServiceAgreement",
             disabled: areServiceAgreementTasksDisabled,
             status: serviceAgreementTypes.length ? TaskStatus.SIGN : TaskStatus.SIGNED,
             info: areServiceAgreementTasksDisabled ? i18n.get("requiresSignatory") : void 0
@@ -37908,7 +38120,7 @@ function TaskList({
           {
             onNavigateToTask: handleOnNavigateToPci,
             icon: "pci",
-            title: i18n.get("pciDssQuestionnaire"),
+            titleKey: "pciDssQuestionnaire",
             status: canDownloadPci ? TaskStatus.DOWNLOAD : TaskStatus.SIGN,
             statusLabel: canDownloadPci ? i18n.get("downloadACopy") : void 0,
             downloadHandler: onPciDownload,
@@ -37922,7 +38134,7 @@ function TaskList({
         {
           onNavigateToTask: handleOnNavigateToTaskReview,
           icon: "review",
-          title: i18n.get("submitReviewOfYourData"),
+          titleKey: "submitReviewOfYourData",
           status: TaskStatus.SUBMIT,
           problems: (_h2 = capabilityProblems == null ? void 0 : capabilityProblems.LegalEntity) == null ? void 0 : _h2[legalEntityResponse.id],
           showErrorAlerts: "always"
@@ -38294,16 +38506,16 @@ const TrustMembersOverview = ({
     }
   );
 };
-const localizeDateString = (dateString, locale) => {
+const localizeDateString = (dateString, locale, options) => {
   const logger2 = createLogger("localizeDateString");
-  const options = {
+  const formatOptions = {
     timeZone: "UTC",
     year: "numeric",
     month: "long",
     day: "2-digit"
   };
   try {
-    return new Intl.DateTimeFormat(locale, options).format(new Date(dateString));
+    return new Intl.DateTimeFormat(locale, formatOptions).format(new Date(dateString));
   } catch (err) {
     logger2.error(err);
   }
@@ -39476,6 +39688,10 @@ function PayoutDetailsDropin({
       if (trustedTransferInstrumentId) {
         externalOnSubmit == null ? void 0 : externalOnSubmit({ ...data, id: trustedTransferInstrumentId });
       }
+      userEvents.addEvent("Success", {
+        actionLevel: "task",
+        actionType: "submit"
+      });
       navigateBackToTaskList == null ? void 0 : navigateBackToTaskList();
     } : onSubmit
   });
@@ -39541,20 +39757,6 @@ function PayoutDetailsDropin({
     }
   );
 }
-const outlinedIcon = "adyen-kyc-outlined-icon";
-const styles$8 = {
-  outlinedIcon
-};
-const OutlinedIcon = ({ name }) => /* @__PURE__ */ jsx("div", { className: styles$8.outlinedIcon, children: /* @__PURE__ */ jsx(Icon, { name }) });
-const Splashscreen = ({ title, subtitle, icon, buttonText, onClick }) => {
-  const { i18n } = useI18nContext();
-  return /* @__PURE__ */ jsxs("div", { className: "adyen-kyc-splashscreen", children: [
-    icon && /* @__PURE__ */ jsx(OutlinedIcon, { name: icon }),
-    /* @__PURE__ */ jsx(Typography, { el: "h2", variant: "title-l", children: title }),
-    /* @__PURE__ */ jsx(Typography, { el: "p", variant: "body", children: subtitle }),
-    onClick && /* @__PURE__ */ jsx(Button, { onClick, label: buttonText ?? i18n.get("finish") })
-  ] });
-};
 function ContractViewer({ contract, className: className2, onExpandSection }) {
   const classNames = cx("adyen-contract-viewer", className2);
   const container = useRef(null);
@@ -39581,6 +39783,27 @@ const pciValidationRules = {
     errorMessage: "fieldIsRequired"
   }
 };
+const FormEndState = ({ variant = "success", children: children2, className: className2 }) => {
+  const Slot = defineSlots(children2, ["title", "content", "icon", "actions"]);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cx("adyen-form-end-state", `adyen-form-end-state__icon--${variant}`, className2),
+      role: "alert",
+      children: [
+        /* @__PURE__ */ jsx(Slot, { name: "icon", children: variant === "success" ? /* @__PURE__ */ jsx(Icon, { name: "checkmark" }) : /* @__PURE__ */ jsx(AlertIcon, { variant }) }),
+        /* @__PURE__ */ jsx("span", { className: "adyen-form-end-state__title", children: /* @__PURE__ */ jsx(Slot, { name: "title" }) }),
+        /* @__PURE__ */ jsx("div", { className: "adyen-form-end-state__description", children: /* @__PURE__ */ jsx(Slot, { name: "content" }) }),
+        /* @__PURE__ */ jsx("div", { className: "adyen-form-end-state__actions", children: /* @__PURE__ */ jsx(Slot, { name: "actions" }) })
+      ]
+    }
+  );
+};
+const outlinedIcon = "adyen-kyc-outlined-icon";
+const styles$9 = {
+  outlinedIcon
+};
+const OutlinedIcon = ({ name }) => /* @__PURE__ */ jsx("div", { className: styles$9.outlinedIcon, children: /* @__PURE__ */ jsx(Icon, { name }) });
 const PciFields = ["signer", "acceptPci"];
 function PciDropin({
   legalEntityResponse,
@@ -39690,14 +39913,11 @@ function PciDropin({
     ] })
   ] });
   return /* @__PURE__ */ jsxs(MaybeModal, { inline: !asModal, onClose: handleCloseClick, children: [
-    /* @__PURE__ */ jsx(ModalContent, { children: !needsSigning ? /* @__PURE__ */ jsx(
-      Splashscreen,
-      {
-        icon: "check",
-        title: i18n.get("serviceAgreementSignedAndDated"),
-        onClick: handleCloseClick
-      }
-    ) : /* @__PURE__ */ jsxs(LoaderWrapper, { status: loadingStatus, formOpacityWhenLoading: 0.3, showSpinner: false, children: [
+    /* @__PURE__ */ jsx(ModalContent, { children: !needsSigning ? /* @__PURE__ */ jsxs(FormEndState, { children: [
+      /* @__PURE__ */ jsx("template", { slot: "title", children: i18n.get("serviceAgreementSignedAndDated") }),
+      /* @__PURE__ */ jsx(OutlinedIcon, { slot: "icon", name: "check" }),
+      /* @__PURE__ */ jsx("div", { slot: "content", children: /* @__PURE__ */ jsx(Button, { onClick: () => handleCloseClick, label: i18n.get("finish") }) })
+    ] }) : /* @__PURE__ */ jsxs(LoaderWrapper, { status: loadingStatus, formOpacityWhenLoading: 0.3, showSpinner: false, children: [
       hasExpired && /* @__PURE__ */ jsx(ExpiredBanner, {}),
       /* @__PURE__ */ jsx(ContractViewer, { contract: pciQuestionnaire, onExpandSection: handleExpandSection }),
       /* @__PURE__ */ jsx(
@@ -40240,11 +40460,11 @@ const TrustRoleAndEntityType = (props) => {
   ] });
 };
 const settlorExemptionReasonsList = "adyen-kyc-settlor-exemption-reasons-list";
-const styles$7 = {
+const styles$8 = {
   settlorExemptionReasonsList
 };
 const formatRolesForSummary = (roles, i18n) => roles.map((role) => i18n.get(getRoleName(role))).join(", ");
-const formatSettlorExemptionReasonsForSummary = (reasons, i18n) => /* @__PURE__ */ jsx("ul", { className: styles$7.settlorExemptionReasonsList, children: reasons.map((reason) => /* @__PURE__ */ jsx("li", { children: i18n.get(reason) }, reason)) });
+const formatSettlorExemptionReasonsForSummary = (reasons, i18n) => /* @__PURE__ */ jsx("ul", { className: styles$8.settlorExemptionReasonsList, children: reasons.map((reason) => /* @__PURE__ */ jsx("li", { children: i18n.get(reason) }, reason)) });
 const formatRoleAndEntityTypeSummary = (data, i18n, isOrganizationSettlorWithExemptionEnabled) => {
   var _a2, _b2;
   const { trustMemberType, roles } = data;
@@ -40981,14 +41201,11 @@ function ServiceAgreementDropin({
       setHasFinished(true);
     }
   };
-  const endScreen = hasFinished && /* @__PURE__ */ jsx(
-    Splashscreen,
-    {
-      icon: "check",
-      title: i18n.get("serviceAgreementSignedAndDated"),
-      onClick: handleCloseClick
-    }
-  );
+  const endScreen = hasFinished && /* @__PURE__ */ jsxs(FormEndState, { children: [
+    /* @__PURE__ */ jsx("template", { slot: "title", children: i18n.get("serviceAgreementSignedAndDated") }),
+    /* @__PURE__ */ jsx(OutlinedIcon, { slot: "icon", name: "check" }),
+    /* @__PURE__ */ jsx("div", { slot: "content", children: /* @__PURE__ */ jsx(Button, { onClick: () => handleCloseClick, label: i18n.get("finish") }) })
+  ] });
   return /* @__PURE__ */ jsx(MaybeModal, { inline: !asModal, onClose: handleCloseClick, children: /* @__PURE__ */ jsxs(ModalContent, { children: [
     !asEmbedded && sidebar,
     endScreen || content,
@@ -41765,7 +41982,7 @@ const useNavigation = ({
     };
   }, [navigateTo]);
   useEffect(() => {
-    const pushedTask = taskHistory.at(-1);
+    const pushedTask = taskHistory[taskHistory.length - 1];
     if (pushedTask === "default") {
       const defaultTask = getDefaultTask({
         legalEntity: legalEntity2,
@@ -41787,8 +42004,8 @@ const useNavigation = ({
     taskHistory
   ]);
   return {
-    currentTask: actualTasks.at(-1),
-    previousTask: actualTasks.at(-2),
+    currentTask: actualTasks[actualTasks.length - 1],
+    previousTask: actualTasks[actualTasks.length - 2],
     navigateBack,
     navigateTo
   };
@@ -42168,7 +42385,7 @@ const tileTitle = "adyen-kyc-tile-title";
 const tileCheckbox = "adyen-kyc-tile-checkbox";
 const tileContainerHorizontal = "adyen-kyc-tile-container-horizontal";
 const tileLabel = "adyen-kyc-tile-label";
-const styles$6 = {
+const styles$7 = {
   tileContainer,
   tile,
   tileIcon,
@@ -42210,8 +42427,8 @@ function Tile({
   return /* @__PURE__ */ jsxs(
     "label",
     {
-      className: cx(styles$6.tileContainer, {
-        [styles$6.tileContainerHorizontal]: isHorizontal
+      className: cx(styles$7.tileContainer, {
+        [styles$7.tileContainerHorizontal]: isHorizontal
       }),
       tabIndex: disabled ? -1 : 0,
       htmlFor: idUse,
@@ -42221,7 +42438,7 @@ function Tile({
           "input",
           {
             ref: inputNode,
-            className: styles$6.tileCheckbox,
+            className: styles$7.tileCheckbox,
             disabled,
             checked: !!checked,
             value,
@@ -42231,10 +42448,10 @@ function Tile({
             onChange: handleChange
           }
         ),
-        /* @__PURE__ */ jsxs("div", { className: styles$6.tile, children: [
-          icon && /* @__PURE__ */ jsx("div", { className: styles$6.tileIcon, children: /* @__PURE__ */ jsx(Icon, { name: icon, testId: icon }) }),
-          /* @__PURE__ */ jsxs("div", { className: styles$6.tileLabel, children: [
-            /* @__PURE__ */ jsx(Typography, { el: "h4", variant: "body-strongest", className: styles$6.tileTitle, children: label }),
+        /* @__PURE__ */ jsxs("div", { className: styles$7.tile, children: [
+          icon && /* @__PURE__ */ jsx("div", { className: styles$7.tileIcon, children: /* @__PURE__ */ jsx(Icon, { name: icon, testId: icon }) }),
+          /* @__PURE__ */ jsxs("div", { className: styles$7.tileLabel, children: [
+            /* @__PURE__ */ jsx(Typography, { el: "h4", variant: "body-strongest", className: styles$7.tileTitle, children: label }),
             subTitle && /* @__PURE__ */ jsx(Typography, { el: "p", variant: "body", children: subTitle })
           ] })
         ] })
@@ -42246,7 +42463,7 @@ const tileGroup = "adyen-kyc-tile-group";
 const tileGroupError = "adyen-kyc-tile-group-error";
 const tileGroupErrorIcon = "adyen-kyc-tile-group-error-icon";
 const tileGroupHorizontal = "adyen-kyc-tile-group-horizontal";
-const styles$5 = {
+const styles$6 = {
   tileGroup,
   tileGroupError,
   tileGroupErrorIcon,
@@ -42266,15 +42483,15 @@ function TileGroup({
   const name = nameProp ?? uniqName;
   const finalName = allowMultiple ? `${name}[]` : name;
   return /* @__PURE__ */ jsxs(Fragment, { children: [
-    !!errorMessage && /* @__PURE__ */ jsxs("div", { "aria-live": "polite", className: styles$5.tileGroupError, children: [
-      /* @__PURE__ */ jsx("span", { className: styles$5.tileGroupErrorIcon, children: /* @__PURE__ */ jsx(Icon, { name: "field-error" }) }),
+    !!errorMessage && /* @__PURE__ */ jsxs("div", { "aria-live": "polite", className: styles$6.tileGroupError, children: [
+      /* @__PURE__ */ jsx("span", { className: styles$6.tileGroupErrorIcon, children: /* @__PURE__ */ jsx(Icon, { name: "field-error" }) }),
       errorMessage
     ] }),
     /* @__PURE__ */ jsx(
       "div",
       {
-        className: cx(styles$5.tileGroup, {
-          [styles$5.tileGroupHorizontal]: isHorizontal
+        className: cx(styles$6.tileGroup, {
+          [styles$6.tileGroupHorizontal]: isHorizontal
         }),
         children: tiles.map((tile2, index) => {
           const { value, id, icon, subTitle, label, disabled } = tile2;
@@ -43331,7 +43548,7 @@ const sourceOfFundsUploadModalContentFieldRadioGroup = "adyen-kyc-source-of-fund
 const sourceOfFundsUploadModalContentRequirementsContainer = "adyen-kyc-source-of-funds-upload-modal-content-requirements-container";
 const sourceOfFundsUploadListHeading = "adyen-kyc-source-of-funds-upload-list-heading";
 const sourceOfFundsUploadListRemoveButton = "adyen-kyc-source-of-funds-upload-list-remove-button";
-const styles$4 = {
+const styles$5 = {
   sourceOfFunds,
   sourceOfFundsWrapperLoading,
   sourceOfFundsWrapperHeading,
@@ -43375,7 +43592,7 @@ function AdditionalDataForAssetSale(props) {
     handleAmountChange("amount");
   };
   return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsxs("div", { className: styles$4.sourceOfFundsGridContainer, children: [
+    /* @__PURE__ */ jsxs("div", { className: styles$5.sourceOfFundsGridContainer, children: [
       /* @__PURE__ */ jsx(
         Field,
         {
@@ -43598,21 +43815,21 @@ const SOFFinancierModal = (props) => {
         {
           variant: "title-l",
           el: "h3",
-          className: styles$4.sourceOfFundsGettingStartedHelpHeader,
+          className: styles$5.sourceOfFundsGettingStartedHelpHeader,
           children: i18n.get("investorDetails")
         }
       ) }),
-      /* @__PURE__ */ jsx(ModalContent, { children: /* @__PURE__ */ jsxs("div", { className: styles$4.sourceOfFundsSofFinancierForm, children: [
+      /* @__PURE__ */ jsx(ModalContent, { children: /* @__PURE__ */ jsxs("div", { className: styles$5.sourceOfFundsSofFinancierForm, children: [
         errorMessage && /* @__PURE__ */ jsx(
           Alert,
           {
             title: "Error submitting data",
             variant: "error",
-            className: styles$4.sourceOfFundsSofFinancierFormError,
+            className: styles$5.sourceOfFundsSofFinancierFormError,
             children: errorMessage
           }
         ),
-        /* @__PURE__ */ jsxs("div", { className: styles$4.sourceOfFundsSofFinancierFormNameGroup, children: [
+        /* @__PURE__ */ jsxs("div", { className: styles$5.sourceOfFundsSofFinancierFormNameGroup, children: [
           /* @__PURE__ */ jsx(
             Field,
             {
@@ -43725,7 +43942,7 @@ const SOFFinancierModal = (props) => {
           }
         )
       ] }) }),
-      /* @__PURE__ */ jsx(ModalFooter, { children: /* @__PURE__ */ jsxs("div", { className: styles$4.sourceOfFundsFinancierFooter, children: [
+      /* @__PURE__ */ jsx(ModalFooter, { children: /* @__PURE__ */ jsxs("div", { className: styles$5.sourceOfFundsFinancierFooter, children: [
         Number.isFinite(indexNumber) && /* @__PURE__ */ jsx(
           Button,
           {
@@ -43805,19 +44022,19 @@ function AdditionalDataForThirdParty(props) {
         {
           type: "button",
           onClick: () => handleShowUpdateFinancierModal(index),
-          className: styles$4.sourceOfFundsThirdPartyFundingFinancierGroup,
+          className: styles$5.sourceOfFundsThirdPartyFundingFinancierGroup,
           children: [
-            /* @__PURE__ */ jsxs("div", { className: styles$4.sourceOfFundsThirdPartyFundingNameAvatarGroup, children: [
+            /* @__PURE__ */ jsxs("div", { className: styles$5.sourceOfFundsThirdPartyFundingNameAvatarGroup, children: [
               /* @__PURE__ */ jsx(
                 Button,
                 {
                   tertiary: true,
                   icon: "user",
                   onClick: () => handleShowUpdateFinancierModal(index),
-                  className: styles$4.sourceOfFundsThirdPartyFundingAvatar
+                  className: styles$5.sourceOfFundsThirdPartyFundingAvatar
                 }
               ),
-              /* @__PURE__ */ jsxs("div", { className: styles$4.sourceOfFundsThirdPartyFundingNameAddressGroup, children: [
+              /* @__PURE__ */ jsxs("div", { className: styles$5.sourceOfFundsThirdPartyFundingNameAddressGroup, children: [
                 /* @__PURE__ */ jsxs(Typography, { el: "div", variant: "body-strongest", children: [
                   financier.firstName,
                   " ",
@@ -43836,16 +44053,16 @@ function AdditionalDataForThirdParty(props) {
       "button",
       {
         type: "button",
-        className: styles$4.sourceOfFundsThirdPartyFundingFinancierGroup,
+        className: styles$5.sourceOfFundsThirdPartyFundingFinancierGroup,
         onClick: handleToggleFinancierModal,
-        children: /* @__PURE__ */ jsxs("div", { className: styles$4.sourceOfFundsThirdPartyFundingNameAvatarGroup, children: [
+        children: /* @__PURE__ */ jsxs("div", { className: styles$5.sourceOfFundsThirdPartyFundingNameAvatarGroup, children: [
           /* @__PURE__ */ jsx(
             Button,
             {
               tertiary: true,
               icon: "plus",
               onClick: handleToggleFinancierModal,
-              className: styles$4.sourceOfFundsThirdPartyFundingAvatar
+              className: styles$5.sourceOfFundsThirdPartyFundingAvatar
             }
           ),
           /* @__PURE__ */ jsx(Typography, { el: "div", variant: "body-strongest", children: i18n.get("addInvestor") })
@@ -43882,14 +44099,14 @@ function AdditionalDataOriginatorLegalEntity(props) {
       Field,
       {
         name: "originatorType",
-        className: styles$4.sourceOfFundsUploadModalContentField,
+        className: styles$5.sourceOfFundsUploadModalContentField,
         label: i18n.get("originatorType"),
         children: (childProps) => /* @__PURE__ */ jsx(
           RadioGroup,
           {
             ...childProps,
             name: "originatorType",
-            className: styles$4.sourceOfFundsUploadModalContentFieldRadioGroup,
+            className: styles$5.sourceOfFundsUploadModalContentFieldRadioGroup,
             items: radioItems,
             value: data.originatorType,
             disabled: false,
@@ -44037,7 +44254,7 @@ function AdditionalDataForInheritance(props) {
     handleAmountChange("amount");
   };
   return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsxs("div", { className: styles$4.sourceOfFundsGridContainer, children: [
+    /* @__PURE__ */ jsxs("div", { className: styles$5.sourceOfFundsGridContainer, children: [
       /* @__PURE__ */ jsx(
         Field,
         {
@@ -44111,7 +44328,7 @@ function AdditionalDataForInheritance(props) {
         }
       )
     ] }),
-    /* @__PURE__ */ jsxs("div", { className: styles$4.sourceOfFundsSubHeading, children: [
+    /* @__PURE__ */ jsxs("div", { className: styles$5.sourceOfFundsSubHeading, children: [
       /* @__PURE__ */ jsx(Typography, { el: "div", variant: "body-strongest", children: i18n.get("describeTheDecedent") }),
       /* @__PURE__ */ jsx(Typography, { el: "div", variant: "caption", children: i18n.get("weNeedMoreInformationAboutTheIndividual") })
     ] }),
@@ -44168,7 +44385,7 @@ function AdditionalDataForDonation(props) {
         )
       }
     ),
-    /* @__PURE__ */ jsxs("div", { className: styles$4.sourceOfFundsGridContainer, children: [
+    /* @__PURE__ */ jsxs("div", { className: styles$5.sourceOfFundsGridContainer, children: [
       /* @__PURE__ */ jsx(
         Field,
         {
@@ -44217,7 +44434,7 @@ function AdditionalDataForDonation(props) {
         }
       )
     ] }),
-    /* @__PURE__ */ jsx("div", { className: styles$4.sourceOfFundsSubHeading, children: /* @__PURE__ */ jsx(Typography, { el: "div", variant: "body-strongest", children: i18n.get("benefactorDetails") }) }),
+    /* @__PURE__ */ jsx("div", { className: styles$5.sourceOfFundsSubHeading, children: /* @__PURE__ */ jsx(Typography, { el: "div", variant: "body-strongest", children: i18n.get("benefactorDetails") }) }),
     /* @__PURE__ */ jsx(
       AdditionalDataOriginatorLegalEntity,
       {
@@ -44390,7 +44607,7 @@ function SourceOfFundsAdditionalData(props) {
         return null;
     }
   };
-  return /* @__PURE__ */ jsxs("form", { className: styles$4.sourceOfFundsAdditionalDataForm, children: [
+  return /* @__PURE__ */ jsxs("form", { className: styles$5.sourceOfFundsAdditionalDataForm, children: [
     /* @__PURE__ */ jsx(
       ErrorPanel,
       {
@@ -44423,8 +44640,8 @@ function SourceOfFunds(props) {
     () => getPageHeadings(sourceOfFundsType ?? "adyen"),
     [sourceOfFundsType]
   );
-  return loading || !activeBusinessLine ? /* @__PURE__ */ jsx("div", { className: styles$4.sourceOfFundsWrapperLoading, children: /* @__PURE__ */ jsx(Loader, { size: "medium" }) }) : /* @__PURE__ */ jsxs("div", { className: "adyen-kyc-form-wrapper", children: [
-    /* @__PURE__ */ jsxs("div", { className: styles$4.sourceOfFundsWrapperHeading, children: [
+  return loading || !activeBusinessLine ? /* @__PURE__ */ jsx("div", { className: styles$5.sourceOfFundsWrapperLoading, children: /* @__PURE__ */ jsx(Loader, { size: "medium" }) }) : /* @__PURE__ */ jsxs("div", { className: "adyen-kyc-form-wrapper", children: [
+    /* @__PURE__ */ jsxs("div", { className: styles$5.sourceOfFundsWrapperHeading, children: [
       /* @__PURE__ */ jsx(Typography, { el: "h1", variant: "title-l", children: i18n.get(
         (activeForm == null ? void 0 : activeForm.formId) === "additionalData" ? pageHeadings.heading : {
           key: "selectASourceOfFunding",
@@ -44433,7 +44650,7 @@ function SourceOfFunds(props) {
           }
         }
       ) }),
-      /* @__PURE__ */ jsxs(Typography, { className: styles$4.sourceOfFundsWrapperDescription, children: [
+      /* @__PURE__ */ jsxs(Typography, { className: styles$5.sourceOfFundsWrapperDescription, children: [
         (activeForm == null ? void 0 : activeForm.formId) === "additionalData" && pageHeadings.description && i18n.get(pageHeadings.description),
         allSoFTypes.length === 0 && i18n.get("noCategoriesAvailable")
       ] })
@@ -44460,19 +44677,19 @@ const description = "adyen-kyc-description";
 const descriptionSectionField = "adyen-kyc-description-section-field";
 const descriptionSectionLabel = "adyen-kyc-description-section-label";
 const descriptionSectionData = "adyen-kyc-description-section-data";
-const styles$3 = {
+const styles$4 = {
   description,
   descriptionSectionField,
   descriptionSectionLabel,
   descriptionSectionData
 };
 const Description = ({ className: className2, list }) => {
-  const descriptionClassNames = cx(styles$3.description, className2);
-  return /* @__PURE__ */ jsx("dl", { className: descriptionClassNames, children: list.map(({ term, details }, index) => /* @__PURE__ */ jsxs("div", { className: styles$3.descriptionSectionField, children: [
-    /* @__PURE__ */ jsx("dt", { className: styles$3.descriptionSectionLabel, children: term }),
-    Array.isArray(details) ? /* @__PURE__ */ jsx("dd", { className: styles$3.descriptionSectionData, children: details.map((detail, index2) => {
+  const descriptionClassNames = cx(styles$4.description, className2);
+  return /* @__PURE__ */ jsx("dl", { className: descriptionClassNames, children: list.map(({ term, details }, index) => /* @__PURE__ */ jsxs("div", { className: styles$4.descriptionSectionField, children: [
+    /* @__PURE__ */ jsx("dt", { className: styles$4.descriptionSectionLabel, children: term }),
+    Array.isArray(details) ? /* @__PURE__ */ jsx("dd", { className: styles$4.descriptionSectionData, children: details.map((detail, index2) => {
       return /* @__PURE__ */ jsx("div", { children: detail }, index2);
-    }) }) : /* @__PURE__ */ jsx("dd", { className: styles$3.descriptionSectionData, children: details })
+    }) }) : /* @__PURE__ */ jsx("dd", { className: styles$4.descriptionSectionData, children: details })
   ] }, index)) });
 };
 function SourceOfFundsGettingStartedCard(props) {
@@ -44481,9 +44698,9 @@ function SourceOfFundsGettingStartedCard(props) {
   return /* @__PURE__ */ jsx(
     Card,
     {
-      className: styles$4.sourceOfFundsGettingStartedCardsCard,
-      headerClassName: styles$4.sourceOfFundsGettingStartedCardsCardHeader,
-      bodyClassName: styles$4.sourceOfFundsGettingStartedCardsCardBody,
+      className: styles$5.sourceOfFundsGettingStartedCardsCard,
+      headerClassName: styles$5.sourceOfFundsGettingStartedCardsCardHeader,
+      bodyClassName: styles$5.sourceOfFundsGettingStartedCardsCardBody,
       title,
       stateful: true,
       onClick,
@@ -44499,7 +44716,7 @@ function SourceOfFundsGettingStartedCard(props) {
       children: isEdit && (meta == null ? void 0 : meta.length) && /* @__PURE__ */ jsx(
         Description,
         {
-          className: styles$4.sourceOfFundsGettingStartedCardsCardDescription,
+          className: styles$5.sourceOfFundsGettingStartedCardsCardDescription,
           list: meta
         }
       )
@@ -44598,7 +44815,7 @@ const SourceOfFundsGettingStarted = ({
   return /* @__PURE__ */ jsxs(
     "div",
     {
-      className: styles$4.sourceOfFundsGettingStarted,
+      className: styles$5.sourceOfFundsGettingStarted,
       "data-testid": "source-of-funds-getting-started",
       children: [
         !hasSourceOfFunds && /* @__PURE__ */ jsx(
@@ -44607,13 +44824,13 @@ const SourceOfFundsGettingStarted = ({
             type: "image",
             testId: "source-of-funds-getting-started-icon",
             name: "source-of-funds",
-            className: styles$4.sourceOfFundsGettingStartedIcon
+            className: styles$5.sourceOfFundsGettingStartedIcon
           }
         ),
-        /* @__PURE__ */ jsx(Typography, { className: styles$4.sourceOfFundsGettingStartedHeading, el: "h2", variant: "title-l", children: i18n.get("financialProductFundingSources") }),
+        /* @__PURE__ */ jsx(Typography, { className: styles$5.sourceOfFundsGettingStartedHeading, el: "h2", variant: "title-l", children: i18n.get("financialProductFundingSources") }),
         hasSourceOfFunds && /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx(Typography, { className: styles$4.sourceOfFundsGettingStartedBody, children: i18n.get("addAllSourcesOfFundsBeingUsed") }),
-          /* @__PURE__ */ jsx("div", { className: styles$4.sourceOfFundsGettingStartedCards, children: mapBusinessLines(businessLines) }),
+          /* @__PURE__ */ jsx(Typography, { className: styles$5.sourceOfFundsGettingStartedBody, children: i18n.get("addAllSourcesOfFundsBeingUsed") }),
+          /* @__PURE__ */ jsx("div", { className: styles$5.sourceOfFundsGettingStartedCards, children: mapBusinessLines(businessLines) }),
           handleCancelClick && /* @__PURE__ */ jsx(
             Button,
             {
@@ -44621,20 +44838,20 @@ const SourceOfFundsGettingStarted = ({
               block: true,
               large: true,
               testId: "source-of-funds-getting-return-button",
-              className: styles$4.sourceOfFundsGettingStartedCancelButton,
+              className: styles$5.sourceOfFundsGettingStartedCancelButton,
               onClick: handleCancelClick,
               label: i18n.get("returnToTaskList")
             }
           )
         ] }),
         !hasSourceOfFunds && /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx(Typography, { className: styles$4.sourceOfFundsGettingStartedBody, children: i18n.get("inTheNextStepWellCollectInformation") }),
-          /* @__PURE__ */ jsxs("div", { className: styles$4.sourceOfFundsGettingStartedActions, children: [
+          /* @__PURE__ */ jsx(Typography, { className: styles$5.sourceOfFundsGettingStartedBody, children: i18n.get("inTheNextStepWellCollectInformation") }),
+          /* @__PURE__ */ jsxs("div", { className: styles$5.sourceOfFundsGettingStartedActions, children: [
             /* @__PURE__ */ jsx(
               Button,
               {
                 large: true,
-                className: styles$4.sourceOfFundsGettingStartedPrimaryButton,
+                className: styles$5.sourceOfFundsGettingStartedPrimaryButton,
                 label: i18n.get("gettingStarted"),
                 block: true,
                 testId: "source-of-funds-getting-primary-button",
@@ -44736,23 +44953,23 @@ const SOFUploadModal = (props) => {
       {
         variant: "title-l",
         el: "h2",
-        className: styles$4.sourceOfFundsGettingStartedHelpHeader,
+        className: styles$5.sourceOfFundsGettingStartedHelpHeader,
         children: i18n.get("uploadASupportingDocument")
       }
     ) }),
-    /* @__PURE__ */ jsx(ModalContent, { children: /* @__PURE__ */ jsxs("div", { className: styles$4.sourceOfFundsUploadModalContent, children: [
+    /* @__PURE__ */ jsx(ModalContent, { children: /* @__PURE__ */ jsxs("div", { className: styles$5.sourceOfFundsUploadModalContent, children: [
       (businessLines == null ? void 0 : businessLines.length) > 1 ? /* @__PURE__ */ jsx(
         Field,
         {
           name: "service",
-          className: styles$4.sourceOfFundsUploadModalContentField,
+          className: styles$5.sourceOfFundsUploadModalContentField,
           label: i18n.get("whatFinancialProductIsThisFor"),
           children: (childProps) => /* @__PURE__ */ jsx(
             RadioGroup,
             {
               ...childProps,
               name: "service",
-              className: styles$4.sourceOfFundsUploadModalContentFieldRadioGroup,
+              className: styles$5.sourceOfFundsUploadModalContentFieldRadioGroup,
               items: serviceRadioItems,
               value: selectedService,
               disabled: false,
@@ -44769,7 +44986,7 @@ const SOFUploadModal = (props) => {
           name: "documentType",
           label: i18n.get("documentType"),
           "data-testid": "documentType",
-          className: styles$4.sourceOfFundsUploadModalContentField,
+          className: styles$5.sourceOfFundsUploadModalContentField,
           children: (childProps) => /* @__PURE__ */ jsx(
             Select,
             {
@@ -44783,7 +45000,7 @@ const SOFUploadModal = (props) => {
           )
         }
       ),
-      (documentRequirements == null ? void 0 : documentRequirements.length) ? /* @__PURE__ */ jsxs("div", { className: styles$4.sourceOfFundsUploadModalContentRequirementsContainer, children: [
+      (documentRequirements == null ? void 0 : documentRequirements.length) ? /* @__PURE__ */ jsxs("div", { className: styles$5.sourceOfFundsUploadModalContentRequirementsContainer, children: [
         /* @__PURE__ */ jsx(Typography, { variant: "body-strongest", el: "div", children: i18n.get("documentRequirements") }),
         /* @__PURE__ */ jsx("ul", { children: documentRequirements == null ? void 0 : documentRequirements.map((requirement) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(Typography, { variant: "body-stronger", el: "div", children: i18n.get(requirement) }) }, requirement)) })
       ] }) : null,
@@ -44849,10 +45066,10 @@ const SourceOfFundsUpload = ({
       }
     }
   };
-  return /* @__PURE__ */ jsxs("div", { className: styles$4.sourceOfFundsUploadList, children: [
-    /* @__PURE__ */ jsxs("div", { className: styles$4.sourceOfFundsUploadListHeading, children: [
+  return /* @__PURE__ */ jsxs("div", { className: styles$5.sourceOfFundsUploadList, children: [
+    /* @__PURE__ */ jsxs("div", { className: styles$5.sourceOfFundsUploadListHeading, children: [
       /* @__PURE__ */ jsx(Typography, { el: "h1", variant: "title-l", children: i18n.get("supportingDocuments") }),
-      /* @__PURE__ */ jsx(Typography, { className: styles$4.sourceOfFundsWrapperDescription, children: (sourceOfFundsCategories == null ? void 0 : sourceOfFundsCategories.length) ? i18n.get("weNeedProofOfFundingPlural", {
+      /* @__PURE__ */ jsx(Typography, { className: styles$5.sourceOfFundsWrapperDescription, children: (sourceOfFundsCategories == null ? void 0 : sourceOfFundsCategories.length) ? i18n.get("weNeedProofOfFundingPlural", {
         values: {
           category1_name: sourceOfFundsCategories[0] ?? "",
           category2_name: sourceOfFundsCategories[1] ?? ""
@@ -44864,12 +45081,12 @@ const SourceOfFundsUpload = ({
     documents == null ? void 0 : documents.map((document2) => /* @__PURE__ */ jsxs(
       "div",
       {
-        className: styles$4.sourceOfFundsThirdPartyFundingFinancierGroup,
+        className: styles$5.sourceOfFundsThirdPartyFundingFinancierGroup,
         onClick: () => setDocToDelete(document2),
         children: [
-          /* @__PURE__ */ jsxs("div", { className: styles$4.sourceOfFundsThirdPartyFundingNameAvatarGroup, children: [
-            /* @__PURE__ */ jsx("div", { className: styles$4.sourceOfFundsThirdPartyFundingAvatar, children: /* @__PURE__ */ jsx(Icon, { name: "document" }) }),
-            /* @__PURE__ */ jsxs("div", { className: styles$4.sourceOfFundsThirdPartyFundingNameAddressGroup, children: [
+          /* @__PURE__ */ jsxs("div", { className: styles$5.sourceOfFundsThirdPartyFundingNameAvatarGroup, children: [
+            /* @__PURE__ */ jsx("div", { className: styles$5.sourceOfFundsThirdPartyFundingAvatar, children: /* @__PURE__ */ jsx(Icon, { name: "document" }) }),
+            /* @__PURE__ */ jsxs("div", { className: styles$5.sourceOfFundsThirdPartyFundingNameAddressGroup, children: [
               /* @__PURE__ */ jsx(Typography, { el: "div", variant: "body-strongest", children: document2.fileName }),
               /* @__PURE__ */ jsx(Typography, { el: "div", variant: "caption", children: parseSOFDocumentDescription(i18n, document2.description) })
             ] })
@@ -44877,7 +45094,7 @@ const SourceOfFundsUpload = ({
           /* @__PURE__ */ jsx(
             Button,
             {
-              className: styles$4.sourceOfFundsUploadListRemoveButton,
+              className: styles$5.sourceOfFundsUploadListRemoveButton,
               iconOnly: true,
               icon: "cross",
               onClick: () => setDocToDelete(document2),
@@ -44892,16 +45109,16 @@ const SourceOfFundsUpload = ({
       "button",
       {
         type: "button",
-        className: styles$4.sourceOfFundsThirdPartyFundingFinancierGroup,
+        className: styles$5.sourceOfFundsThirdPartyFundingFinancierGroup,
         onClick: openUploadModal,
-        children: /* @__PURE__ */ jsxs("div", { className: styles$4.sourceOfFundsThirdPartyFundingNameAvatarGroup, children: [
+        children: /* @__PURE__ */ jsxs("div", { className: styles$5.sourceOfFundsThirdPartyFundingNameAvatarGroup, children: [
           /* @__PURE__ */ jsx(
             Button,
             {
               tertiary: true,
               icon: "plus",
               onClick: openUploadModal,
-              className: styles$4.sourceOfFundsUploadDocumentCardsIcon,
+              className: styles$5.sourceOfFundsUploadDocumentCardsIcon,
               testId: "source-of-funds-upload-button"
             }
           ),
@@ -44909,7 +45126,7 @@ const SourceOfFundsUpload = ({
         ] })
       }
     ),
-    /* @__PURE__ */ jsx("div", { className: styles$4.sourceOfFundsGettingStartedActions, children: handleNavigateToSummary && /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsx("div", { className: styles$5.sourceOfFundsGettingStartedActions, children: handleNavigateToSummary && /* @__PURE__ */ jsx(
       Button,
       {
         tertiary: true,
@@ -45020,6 +45237,10 @@ function SourceOfFundsDropin({
     }
   };
   useEffect(() => {
+    userEvents.addEvent("Landed on page", {
+      actionLevel: "task",
+      actionType: "start"
+    });
     loadBusinessLines(legalEntityResponse.id);
   }, []);
   const canSubmitForm = useMemo(
@@ -45151,7 +45372,7 @@ function SourceOfFundsDropin({
   const handleNavigateToUploadPage = () => {
     setShowUploadPage(true);
   };
-  return /* @__PURE__ */ jsx("div", { className: styles$4.sourceOfFunds, children: loading ? /* @__PURE__ */ jsx(Loader, { size: "medium" }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+  return /* @__PURE__ */ jsx("div", { className: styles$5.sourceOfFunds, children: loading ? /* @__PURE__ */ jsx(Loader, { size: "medium" }) : /* @__PURE__ */ jsxs(Fragment, { children: [
     gettingStarted && !showUploadPage && /* @__PURE__ */ jsx(
       SourceOfFundsGettingStarted,
       {
@@ -45695,6 +45916,9 @@ function DropinComposer({
       actionType: "start"
     });
   }, []);
+  useEffect(() => {
+    userEvents.updateBaseTrackingPayload({ task: currentTask });
+  }, [currentTask]);
   useEffect(() => {
     const fetchConfiguration = async () => {
       const data = await getConfiguration2({
@@ -47008,7 +47232,6 @@ function AcceptTermsOfServiceComponent({
     await getServiceAgreementAcceptanceInfos2(legalEntityId2).then(({ data }) => setServiceAgreementAcceptanceInfos(data)).catch(logger$l.error);
   }, [getServiceAgreementAcceptanceInfos2, legalEntityId2]);
   const handleSign = useCallback(
-    // @ts-ignore-error:next-line ts does not infer type correctly
     async (...params) => {
       const serviceAgreement = await acceptServiceAgreement2(...params);
       await Promise.all([fetchUnsigned(), fetchSigned()]);
@@ -47271,7 +47494,7 @@ const embeddedStatusAvatar = "adyen-kyc-embedded-status-avatar";
 const embeddedStatusLight = "adyen-kyc-embedded-status-light";
 const embeddedStatusActionIndicator = "adyen-kyc-embedded-status-action-indicator";
 const embeddedStatusInfo = "adyen-kyc-embedded-status-info";
-const styles$2 = {
+const styles$3 = {
   embeddedStatus,
   embeddedStatusLoading,
   embeddedStatusAvatar,
@@ -47321,22 +47544,22 @@ const EmbeddedStatus = ({
     "button",
     {
       type: "button",
-      className: cx(className2, styles$2.embeddedStatus, "adyen-kyc-externalComponent", {
-        [styles$2.embeddedStatusLoading]: loading,
-        [styles$2.embeddedStatusLight]: light
+      className: cx(className2, styles$3.embeddedStatus, "adyen-kyc-externalComponent", {
+        [styles$3.embeddedStatusLoading]: loading,
+        [styles$3.embeddedStatusLight]: light
       }),
       onClick,
       ...props,
       children: [
-        /* @__PURE__ */ jsx("section", { className: styles$2.embeddedStatusAvatar, children: loading ? /* @__PURE__ */ jsx(Skeleton, { height: "100%", width: "100%", circle: true }) : /* @__PURE__ */ jsx(Icon, { className: styles$2.embeddedStatusIcon, name: iconName }) }),
-        /* @__PURE__ */ jsx("section", { className: styles$2.embeddedStatusInfo, children: loading ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx("section", { className: styles$3.embeddedStatusAvatar, children: loading ? /* @__PURE__ */ jsx(Skeleton, { height: "100%", width: "100%", circle: true }) : /* @__PURE__ */ jsx(Icon, { className: styles$3.embeddedStatusIcon, name: iconName }) }),
+        /* @__PURE__ */ jsx("section", { className: styles$3.embeddedStatusInfo, children: loading ? /* @__PURE__ */ jsxs(Fragment, { children: [
           /* @__PURE__ */ jsx(Skeleton, { text: true, width: "20ch", height: "1em" }),
           /* @__PURE__ */ jsx(Skeleton, { text: true, width: "90%", height: "1em" })
         ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
           /* @__PURE__ */ jsx(Typography, { variant: "body-stronger", children: title }),
           /* @__PURE__ */ jsx(Typography, { variant: "caption", color: "secondary", children: subtitle })
         ] }) }),
-        actionIndicator ? /* @__PURE__ */ jsx("section", { className: styles$2.embeddedStatusButton, children: loading ? /* @__PURE__ */ jsx(Skeleton, { width: "5em", height: "2em" }) : /* @__PURE__ */ jsx(Typography, { variant: "body-stronger", className: styles$2.embeddedStatusActionIndicator, children: i18n.get(actionIndicator.labelKey) }) }) : (statusTag == null ? void 0 : statusTag.translationKey) && /* @__PURE__ */ jsx("section", { className: styles$2.embeddedStatusTag, children: loading ? /* @__PURE__ */ jsx(Skeleton, { width: "8ch", height: "1em" }) : /* @__PURE__ */ jsx(Tag, { variant: statusTag.variant, children: i18n.get(statusTag.translationKey) }) })
+        actionIndicator ? /* @__PURE__ */ jsx("section", { className: styles$3.embeddedStatusButton, children: loading ? /* @__PURE__ */ jsx(Skeleton, { width: "5em", height: "2em" }) : /* @__PURE__ */ jsx(Typography, { variant: "body-stronger", className: styles$3.embeddedStatusActionIndicator, children: i18n.get(actionIndicator.labelKey) }) }) : (statusTag == null ? void 0 : statusTag.translationKey) && /* @__PURE__ */ jsx("section", { className: styles$3.embeddedStatusTag, children: loading ? /* @__PURE__ */ jsx(Skeleton, { width: "8ch", height: "1em" }) : /* @__PURE__ */ jsx(Tag, { variant: statusTag.variant, children: i18n.get(statusTag.translationKey) }) })
       ]
     }
   );
@@ -48060,7 +48283,6 @@ function SignPCIComponent({
     });
   }, [fetchLegalEntity, fetchPciTemplate]);
   const handleSign = useCallback(
-    // @ts-ignore-error:next-line ts does not infer type correctly
     async (...params) => {
       await signPci2(...params);
       await Promise.all([fetchLegalEntity(), fetchPciTemplate()]);
@@ -48075,14 +48297,11 @@ function SignPCIComponent({
     return /* @__PURE__ */ jsx(Loader, { size: "medium" });
   }
   if (!hasGenericError) {
-    return /* @__PURE__ */ jsx(MaybeModal, { inline: !modalView, onClose: handleOnClose, children: /* @__PURE__ */ jsx(ModalContent, { children: /* @__PURE__ */ jsx(
-      Splashscreen,
-      {
-        icon: "check",
-        title: i18n.get("pciDoesNotNeedSigningOrHasBeenSigned"),
-        onClick: handleOnClose
-      }
-    ) }) });
+    return /* @__PURE__ */ jsx(MaybeModal, { inline: !modalView, onClose: handleOnClose, children: /* @__PURE__ */ jsx(ModalContent, { children: /* @__PURE__ */ jsxs(FormEndState, { children: [
+      /* @__PURE__ */ jsx("template", { slot: "title", children: i18n.get("pciDoesNotNeedSigningOrHasBeenSigned") }),
+      /* @__PURE__ */ jsx(OutlinedIcon, { slot: "icon", name: "check" }),
+      /* @__PURE__ */ jsx("div", { slot: "content", children: /* @__PURE__ */ jsx(Button, { onClick: handleOnClose, label: i18n.get("finish") }) })
+    ] }) }) });
   }
   return pciTemplate ? /* @__PURE__ */ jsx(
     PciDropin,
@@ -49351,22 +49570,6 @@ function AdditionalFieldsForHighExposureUltimateParentCompany(props) {
     )
   ] });
 }
-const FormEndState = ({ variant = "success", children: children2, className: className2 }) => {
-  const Slot = defineSlots(children2, ["title", "content", "icon", "actions"]);
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      className: cx("adyen-form-end-state", `adyen-form-end-state__icon--${variant}`, className2),
-      role: "alert",
-      children: [
-        /* @__PURE__ */ jsx(Slot, { name: "icon", children: variant === "success" ? /* @__PURE__ */ jsx(Icon, { name: "checkmark" }) : /* @__PURE__ */ jsx(AlertIcon, { variant }) }),
-        /* @__PURE__ */ jsx("span", { className: "adyen-form-end-state__title", children: /* @__PURE__ */ jsx(Slot, { name: "title" }) }),
-        /* @__PURE__ */ jsx("div", { className: "adyen-form-end-state__description", children: /* @__PURE__ */ jsx(Slot, { name: "content" }) }),
-        /* @__PURE__ */ jsx("div", { className: "adyen-form-end-state__actions", children: /* @__PURE__ */ jsx(Slot, { name: "actions" }) })
-      ]
-    }
-  );
-};
 const customLabels = {
   company: {
     legalForm: "businessStructure",
@@ -49916,24 +50119,11 @@ function UpdateLegalEntityForHighExposure({
     }
   );
 }
-const usePolling = ({
-  poller,
-  pollingInterval,
-  onNewValueReceived,
-  skip,
-  immediate = false
-}) => {
-  useEffect(() => {
-    if (skip) return;
-    const pollAndProvideNewValue = () => {
-      poller().then((newValue) => onNewValueReceived(newValue)).catch((err) => console.error(err));
-    };
-    if (immediate) {
-      pollAndProvideNewValue();
-    }
-    const timeoutId = setInterval(pollAndProvideNewValue, pollingInterval);
-    return () => clearInterval(timeoutId);
-  }, [onNewValueReceived, poller, pollingInterval, skip, immediate]);
+const verification = "adyen-kyc-verification";
+const verificationDescription = "adyen-kyc-verification-description";
+const styles$2 = {
+  verification,
+  verificationDescription
 };
 const coerceError = (err) => {
   if (err instanceof Error) return err;
@@ -49980,7 +50170,7 @@ function ViewVerificationStatusComponent({
   onRedirect
 }) {
   const { i18n } = useI18nContext();
-  const { getOnboardingStatus: getOnboardingStatus2, generateOnboardingLink: generateOnboardingLink2 } = useComponentApi(legalEntityId2);
+  const { generateOnboardingLink: generateOnboardingLink2 } = useComponentApi(legalEntityId2);
   const [onboardingStatus, setOnboardingStatus] = useState();
   const [alertContent, setAlertContent] = useState();
   const content = useMemo(() => {
@@ -50001,15 +50191,6 @@ function ViewVerificationStatusComponent({
     },
     [i18n, onError]
   );
-  const fetchOnboardingStatus = useCallback(async () => {
-    try {
-      const { status } = await getOnboardingStatus2();
-      return status;
-    } catch (error) {
-      handleError2(error, "onboardingRedirectLinkError");
-      return void 0;
-    }
-  }, [getOnboardingStatus2, handleError2]);
   const updateOnboardingStatus = useCallback(
     (newStatus) => {
       if (!newStatus) return;
@@ -50018,16 +50199,18 @@ function ViewVerificationStatusComponent({
     },
     [onStatusChange]
   );
-  usePolling({
-    poller: fetchOnboardingStatus,
-    pollingInterval: 1e4,
-    onNewValueReceived: updateOnboardingStatus,
-    skip: onboardingStatus && FINAL_STATUSES.includes(onboardingStatus)
+  const { isLoading, data, isError: isError2 } = useOnboardingStatus({
+    refetchInterval: (res) => {
+      var _a2;
+      const status = (_a2 = res.state.data) == null ? void 0 : _a2.status;
+      setOnboardingStatus(status);
+      return status === void 0 || !FINAL_STATUSES.includes(status) ? 3e3 : false;
+    }
   });
   useEffect(() => {
     setAlertContent(void 0);
-    fetchOnboardingStatus().then(updateOnboardingStatus).catch(logger$a.error);
-  }, [fetchOnboardingStatus, updateOnboardingStatus]);
+    updateOnboardingStatus(data == null ? void 0 : data.status);
+  }, [data, updateOnboardingStatus]);
   const [loadingLinkStatus, setLinkLoadingStatus] = useState("success");
   const redirectToAdyen = async () => {
     setLinkLoadingStatus("loading");
@@ -50070,26 +50253,24 @@ function ViewVerificationStatusComponent({
       {
         label: i18n.get(content.ctaButton),
         onClick: redirectToAdyen,
-        type: "button",
-        className: "adyen-view-verification-status__button",
         role: "link",
         loading: loadingLinkStatus === "loading"
       }
     );
   };
   const renderBody = () => {
-    if (alertContent) {
-      return /* @__PURE__ */ jsx(Alert, { title: i18n.get(alertContent), variant: "error" });
+    if (alertContent || isError2) {
+      return /* @__PURE__ */ jsx(Alert, { title: i18n.get(alertContent ?? "onboardingRedirectLinkError"), variant: "error" });
     }
-    if (content) {
+    if (!isLoading && content) {
       return /* @__PURE__ */ jsxs(Fragment, { children: [
-        hideExplanation ? null : content.description.map((key) => /* @__PURE__ */ jsx("p", { className: "adyen-view-verification-status__description", children: i18n.get(key) }, key)),
-        /* @__PURE__ */ jsx("div", { className: "adyen-view-verification-status__footer", children: renderFooter() })
+        hideExplanation ? null : content.description.map((key) => /* @__PURE__ */ jsx("p", { className: styles$2.verificationDescription, children: i18n.get(key) }, key)),
+        /* @__PURE__ */ jsx("div", { children: renderFooter() })
       ] });
     }
     return /* @__PURE__ */ jsx(Loader, { size: "medium" });
   };
-  return /* @__PURE__ */ jsx("section", { className: "adyen-view-verification-status", children: renderBody() });
+  return /* @__PURE__ */ jsx("section", { className: styles$2.verification, children: renderBody() });
 }
 const componentsMap = {
   individualDropin: IndividualDropin,
@@ -50181,7 +50362,6 @@ const useAnalytics = ({ onUserEvent, sdkVersion, componentName }) => {
   const capabilities = Object.keys(rootLegalEntity.capabilities ?? {});
   const loadingContext = `${base}api/${COMPONENTS_API_VERSION}/`;
   userEvents.updateBaseTrackingPayload({
-    legalEntityId: rootLegalEntity.id,
     entityType: rootLegalEntity.type,
     countryCode,
     capabilities
@@ -50626,7 +50806,7 @@ const ConfigurationApiProvider = ({
 }) => {
   const authContext = useAuthContext();
   const { isEmbeddedDropin, loadingContext } = authContext;
-  const sdkVersion = "3.49.2";
+  const sdkVersion = "3.50.1";
   const rootLegalEntityId = useGlobalStore((store) => store.rootLegalEntity.id);
   useAnalytics({
     onUserEvent,
@@ -50979,7 +51159,7 @@ function StateReducer() {
           },
           valid: {
             ...state.valid,
-            [dataStoreId]: {}
+            [dataStoreId]: false
           },
           fieldProblems: {
             ...state.fieldProblems,
@@ -50988,7 +51168,7 @@ function StateReducer() {
         };
         mergedState.validityByForm = {
           ...mergedState.validityByForm,
-          [dataStoreId]: {}
+          [dataStoreId]: false
         };
         mergedState.allValid = Object.values(mergedState.validityByForm).every(
           (isValid) => isValid
@@ -51401,12 +51581,12 @@ const DebugTable = ({
       "No results found for ",
       /* @__PURE__ */ jsx("strong", { children: searchTerm })
     ] }) : /* @__PURE__ */ jsx("table", { children: /* @__PURE__ */ jsx("tbody", { children: filteredData.map(({ key, value, label, variant }) => /* @__PURE__ */ jsxs("tr", { children: [
-      tagPosition === "before" ? /* @__PURE__ */ jsx("td", { children: /* @__PURE__ */ jsx(Tag, { variant: variant ?? "grey", className: "adyen-kyc-tag--large", children: value }) }) : void 0,
+      tagPosition === "before" ? /* @__PURE__ */ jsx("td", { children: /* @__PURE__ */ jsx(Tag, { variant: variant ?? "grey", children: value }) }) : void 0,
       /* @__PURE__ */ jsxs("td", { children: [
         /* @__PURE__ */ jsx("span", { className: "adyen-kyc-debug-modal__table-key", children: key }),
         label && /* @__PURE__ */ jsx("span", { children: label })
       ] }),
-      tagPosition === "after" ? /* @__PURE__ */ jsx("td", { children: /* @__PURE__ */ jsx(Tag, { variant: variant ?? "grey", className: "adyen-kyc-tag--large", children: value }) }) : void 0
+      tagPosition === "after" ? /* @__PURE__ */ jsx("td", { children: /* @__PURE__ */ jsx(Tag, { variant: variant ?? "grey", children: value }) }) : void 0
     ] }, key)) }) })
   ] });
 };
@@ -51510,7 +51690,7 @@ const DebugModal = ({ onExit }) => {
   const [tab, setTab] = useState("metadata");
   const rootLegalEntity = useGlobalStore((store) => store.rootLegalEntity);
   const metadata = {
-    sdkVersion: "3.49.2",
+    sdkVersion: "3.50.1",
     locale: i18n.locale,
     rootLegalEntityId: rootLegalEntity.id
   };
@@ -54507,7 +54687,7 @@ var TanstackQueryDevtools = (_k = class {
       if (__privateGet(this, _Component)) {
         Devtools = __privateGet(this, _Component);
       } else {
-        Devtools = lazy(() => import("./HO4MOOFI-BPdL391L.js"));
+        Devtools = lazy(() => import("./HO4MOOFI-DkcbvWhF.js"));
         __privateSet(this, _Component, Devtools);
       }
       setupStyleSheet(__privateGet(this, _styleNonce), __privateGet(this, _shadowDOMTarget));
@@ -54629,7 +54809,7 @@ var TanstackQueryDevtoolsPanel = (_l = class {
       if (__privateGet(this, _Component2)) {
         Devtools = __privateGet(this, _Component2);
       } else {
-        Devtools = lazy(() => import("./HUY7CZI3-Cl0-ZtHu.js"));
+        Devtools = lazy(() => import("./HUY7CZI3-BpLsA4ow.js"));
         __privateSet(this, _Component2, Devtools);
       }
       setupStyleSheet(__privateGet(this, _styleNonce2), __privateGet(this, _shadowDOMTarget2));
@@ -54789,7 +54969,7 @@ class UIElement extends BaseElement {
   constructor() {
     super(...arguments);
     this.render = () => {
-      const Component = this.props.component;
+      const UIElement2 = this.props.component;
       return /* @__PURE__ */ jsx(SettingsProvider, { settings: this.props.settings, children: /* @__PURE__ */ jsx(
         ExperimentsContextProvider,
         {
@@ -54821,7 +55001,7 @@ class UIElement extends BaseElement {
                             refreshExpiry: this.props.refreshExpiry,
                             eventEmitter: this.eventEmitter,
                             children: /* @__PURE__ */ jsx(DebugWrapper, { children: /* @__PURE__ */ jsx("div", { className: "adyen-kyc-ui-element-container-wrapper", children: /* @__PURE__ */ jsx(AutoResizer, { children: /* @__PURE__ */ jsx("div", { className: "adyen-kyc-ui-element-container", children: /* @__PURE__ */ jsx(ToastContextProvider, { children: /* @__PURE__ */ jsx(StateProvider, { children: /* @__PURE__ */ jsx(
-                              Component,
+                              UIElement2,
                               {
                                 ...this.props.componentProps,
                                 onUnmount: this.remove