@adyen/kyc-components 2.50.4 → 2.51.0

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

@@ -8,8 +8,8 @@ import debounce from "lodash-es/debounce";
 import isEmpty$1 from "lodash-es/isEmpty";
 import isISIN from "validator/es/lib/isISIN.js";
 import OpenBankingSDK from "@adyen/openbankingsdk";
-import noop$1 from "lodash-es/noop";
 import range from "lodash-es/range";
+import noop$1 from "lodash-es/noop";
 import { jsxs as jsxs$1, jsx as jsx$1 } from "preact/compat/jsx-runtime";
 import "@adyen/adyen-document-viewer/dist/adyen-document-viewer.min.css";
 import AdyenDocumentViewer from "@adyen/adyen-document-viewer";
@@ -78,6 +78,7 @@ const defaultTrans = {
   invalidFormat: "Invalid format",
   formatIsCorrect: "Format is correct",
   checkForTypos: "Check for typos and try again",
+  fieldMustContainAtLeast: "%{fieldName} must contain at least %{minLength} characters",
   nameMustContainLetters: "Name must contain letters. Check for typos and try again.",
   fieldIsRequired: "Field is required",
   optional: "(optional)",
@@ -128,9 +129,11 @@ const defaultTrans = {
   invalidFormatBankStatementDescription: "Please ensure your input contains solely letters, digits, currency codes, and the specified special characters: -._,:;'*!@#%()+?¿/「」",
   residencyCountry: "Country/region of residence",
   basicInformation: "Basic information",
-  dragYourFilesHereOr: "Drag your files here, or",
-  browse: "Browse",
-  supports: "Supports: %{fileTypes}. Size up to %{maxSize}. Maximum %{maxFiles} page.",
+  dropFileToUpload: "Drop file to upload",
+  browseFiles: "Browse files",
+  supportedFileTypes: "Supported file types: %{fileTypes}",
+  maxFileSize: "Max file size: %{maxSize}. Maximal 1 page.",
+  upToFiles: "Up to %{maxFiles} file(s).",
   complete: "Complete",
   summary: "Summary",
   summaryLegalCaption: "By submitting this summary you are confirming the following; I confirm (on behalf of the company that I am authorized to represent), that the information and supporting documentation provided during this KYC process is accurate and up-to-date, and therefore correctly represents the current state of affairs.",
@@ -540,6 +543,7 @@ const defaultTrans = {
   vatNumber: "VAT number",
   vatRegistrationNumber: "VAT registration number",
   regonKrsNumber: "REGON / KRS number",
+  rejected: "Rejected",
   identificationNumber: "Identification number",
   whichTypeOfRegistrationNumberDoYouHave: "Which type of registration number do you have?",
   whichTypeOfIdNumberDoYouHave: "Which type of identification number do you have?",
@@ -936,7 +940,7 @@ const defaultTrans = {
   legalCompanyName__helperText__AU: "Enter the name exactly as it is on your Australian Securities and Investment Commission's (ASIC).",
   legalCompanyName__helperText__NL: "Enter the name exactly as it is on your Chamber of Commerce registration.",
   legalCompanyName__helperText__US: "Enter the name exactly as it appears on your Secretary of State Registration.",
-  legalCompanyName__helperText__US__business: "The legal name is used to identify a business with the government. This information came from a trusted data source and can not be edited.",
+  legalCompanyName__helperText__US__business: "The legal name is used to identify a business with the government; enter it exactly as it appears on your government or legal forms.",
   legalCompanyName__helperText__PR: "Enter the name exactly as it appears on your Department of State Registration.",
   legalCompanyName__helperText__SG: "Enter the name exactly as it is on your Accounting and Corporate Regulatory Authority (ACRA) BizFile.",
   legalCompanyName__helperText__HK: "Enter the name exactly as it is on your Hong Kong Companies Registry's Certificate of Incorporation.",
@@ -945,10 +949,10 @@ const defaultTrans = {
   dbaName: "Doing Business As (DBA) name",
   country: "Country/region",
   countryRegionOfEstablishment: "Country/region of establishment",
-  country__US__business: "Where is your business located?",
+  country__US__business: "Where is your business registered?",
   businessName: "Business name",
   stateOrProvince: "State or province",
-  stateOrProvince__US__business: "In which state is your business headquartered?",
+  stateOrProvince__US__business: "In which state is your business registered?",
   stateOrProvince__placeHolder: "Select a state or province",
   stateOrProvince__placeHolder__US: "Select one...",
   registrationNumber: "Registration number",
@@ -988,8 +992,6 @@ const defaultTrans = {
   companyTaxDocumentFormHeading: "Upload a tax document",
   companyTaxDocumentFormDescription: "We need an official document to verify your organization’s tax details.",
   businessSelection__heading: "Select your business",
-  businessSelection__searching: "We're searching for your business - this can take a few moments",
-  businessSelection__verifying: "We're processing your business details",
   businessSelection__footer: "Can't find your business?",
   businessSelection__footerButton: "Add details manually",
   businessSelection__invalidTin: "This company's TIN doesn't match yours",
@@ -998,9 +1000,10 @@ const defaultTrans = {
   thisIsMyBusiness: "This is my business",
   basicInformationFormName: "Basic details",
   basicInformationFormHeading: "Basic details about your business",
+  basicInformationFormDescription: "In the next steps, we'll collect and verify details about your business in compliance with financial regulations. Learn about how your data is managed in our",
+  basicInformationFormDescriptionLink: "Privacy Statement.",
   additionalInformationFormName: "Additional details",
   additionalInformationFormHeading: "Additional business details",
-  additionalInformationFormDescription: "To continue, we need to know a little bit more about your business and it's operations. ",
   showDetails: "Show details",
   hideDetails: "Hide details",
   showOnMap: "Show on map",
@@ -1860,12 +1863,13 @@ const getFormattingRegEx = (specChars, flags = "g") => new RegExp(`[${specChars}
 const trimValWithOneSpace = (val) => val.trimStart().replace(/\s+/g, " ");
 const EMOJI_REGEX = new RegExp("(\\p{Emoji}\\uFE0F|\\p{Emoji_Presentation}|\\p{Extended_Pictographic})", "gu");
 const NO_ALPHABET_REGEX = /^[^a-zA-Z]*$/;
-const ALLOWED_CHARS_REGEX = /^[\w\s\-—./']*$/;
+const INDIVIDUAL_VALID_CHAR_REGEX = /^[\w\s\-—./']*$/;
+const OTHER_ENTITIES_VALID_CHAR_REGEX = /^[\w\s,.;:\-—&!?@()"'/\\+]+$/;
 const matchesRegex = (regex, input) => isString(input) && regex.test(input ?? "");
 const hasRepeatedCharacters = (input) => !isEmpty(input) && new Set(input).size === 1;
-const isValidInputLength = (input) => !isEmpty(input) && input.length > 1;
+const isValidMinLength = (input, minLength = 1) => !isEmpty(input) && input.length >= minLength;
 const isInvalidName = (input) => {
-  const invalidNames = /* @__PURE__ */ new Set(["ABCD", "ABCDE", "ABCDEF", "ABCDEFG", "My Customer", "An other", "not applicable", "not app", "null"]);
+  const invalidNames = /* @__PURE__ */ new Set(["John Doe", "Jane Doe", "ABCD", "ABCDE", "ABCDEF", "ABCDEFG", "My Customer", "An other", "n/a", "not applicable", "n/A", "N/A", "N/a", "N\\ /A", "not app", "null"]);
   return invalidNames.has(input || "");
 };
 let suppressed = false;
@@ -1887,71 +1891,111 @@ const createLogger = (namespace) => {
   });
   return methods;
 };
-const icons = {
-  "arrow-left": lazy(() => import("./arrow-left-CCxYxfCP.js")),
-  "arrow-right": lazy(() => import("./arrow-right-C4o8oS1C.js")),
-  bin: lazy(() => import("./bin-CGwewvcn.js")),
-  check: lazy(() => import("./check-CeSLN4_9.js")),
-  checkmark: lazy(() => import("./checkmark-DEh9MPYR.js")),
-  "checkmark-small": lazy(() => import("./checkmark-small-D_9HLctx.js")),
-  "chevron-down": lazy(() => import("./chevron-down-C8-1xmDI.js")),
-  "chevron-right": lazy(() => import("./chevron-right-BDZzxAre.js")),
-  "chevron-left": lazy(() => import("./chevron-left-DSyI3arz.js")),
-  "chevron-up": lazy(() => import("./chevron-up-BLtnROd5.js")),
-  company: lazy(() => import("./company-D5_F_6SW.js")),
-  "company-2": lazy(() => import("./company-2-JG34IScE.js")),
-  contract: lazy(() => import("./contract-C6wDy9zU.js")),
-  "controlling-person": lazy(() => import("./controlling-person-C4KoSyi2.js")),
-  cross: lazy(() => import("./cross-D-SQig6J.js")),
-  "decision-maker": lazy(() => import("./decision-maker-Cef3-OzY.js")),
-  document: lazy(() => import("./document-Cg4kZHpA.js")),
-  download: lazy(() => import("./download-COfxdarq.js")),
-  edit: lazy(() => import("./edit--fDhojib.js")),
-  "field-error": lazy(() => import("./field-error-WElEN1mN.js")),
-  "info-circle": lazy(() => import("./info-circle-DkHN1ugA.js")),
-  "light-bulb": lazy(() => import("./light-bulb-DEUhbRWP.js")),
-  location: lazy(() => import("./location-B1Til-7Q.js")),
-  "more-horiz": lazy(() => import("./more-horiz-BieZKfy3.js")),
-  "new-document": lazy(() => import("./new-document-BEAJnXCG.js")),
-  owners: lazy(() => import("./owners-D1pksb86.js")),
-  payout: lazy(() => import("./payout-BFiI--HY.js")),
-  pci: lazy(() => import("./pci-DMQLRoAn.js")),
-  plus: lazy(() => import("./plus-DAnbeoyS.js")),
-  remove: lazy(() => import("./remove-CEmd9YX7.js")),
-  review: lazy(() => import("./review-CeQeKHXH.js")),
-  save: lazy(() => import("./save-vVXwP4OB.js")),
-  search: lazy(() => import("./search-hf3HRVbu.js")),
-  signatory: lazy(() => import("./signatory-BVoLPYPu.js")),
-  store: lazy(() => import("./store-D2z639xh.js")),
-  trust: lazy(() => import("./trust-CpcaQaV7.js")),
-  user: lazy(() => import("./user-D6swzlYs.js")),
-  "user-business": lazy(() => import("./user-business-CwS5j1qX.js")),
-  "users-3": lazy(() => import("./users-3-BdjQ9rEA.js")),
-  warning: lazy(() => import("./warning-99uFf1WU.js")),
-  wrong: lazy(() => import("./wrong-1wvh7nZe.js"))
-};
-const logger$D = createLogger("Icon");
-const Icon = ({
+const svgs = {
+  // icons
+  "arrow-left": lazy(() => import("./arrow-left-BLTu7dpi.js")),
+  "arrow-right": lazy(() => import("./arrow-right-BntH-Qlw.js")),
+  bin: lazy(() => import("./bin-Bj6qtSTy.js")),
+  check: lazy(() => import("./check-ZYTuehgv.js")),
+  checkmark: lazy(() => import("./checkmark-DxCwXAIK.js")),
+  "checkmark-small": lazy(() => import("./checkmark-small-BsdIbd2G.js")),
+  "chevron-down": lazy(() => import("./chevron-down-BIOZPblQ.js")),
+  "chevron-right": lazy(() => import("./chevron-right-DTyHLnb5.js")),
+  "chevron-left": lazy(() => import("./chevron-left-B_GtBez_.js")),
+  "chevron-up": lazy(() => import("./chevron-up-0etcs99k.js")),
+  company: lazy(() => import("./company-CYi9zTX1.js")),
+  "company-2": lazy(() => import("./company-2-B3NuVpZ7.js")),
+  contract: lazy(() => import("./contract-Ca5T1p29.js")),
+  "controlling-person": lazy(() => import("./controlling-person-BQledQz3.js")),
+  cross: lazy(() => import("./cross-_WDtYXwH.js")),
+  "decision-maker": lazy(() => import("./decision-maker-IOjBp4Cn.js")),
+  document: lazy(() => import("./document-Daivbade.js")),
+  download: lazy(() => import("./download-6WUrs5fL.js")),
+  edit: lazy(() => import("./edit-vu4T5TEr.js")),
+  "field-error": lazy(() => import("./field-error-Dc-vt_Ng.js")),
+  "info-circle": lazy(() => import("./info-circle-DvvWfz1E.js")),
+  image: lazy(() => import("./image-C5KqhIDJ.js")),
+  "light-bulb": lazy(() => import("./light-bulb-B9fSxkAk.js")),
+  location: lazy(() => import("./location-6Th9xn5O.js")),
+  "more-horiz": lazy(() => import("./more-horiz-BW6d91R8.js")),
+  "new-document": lazy(() => import("./new-document-Cpqmj9Kl.js")),
+  owners: lazy(() => import("./owners-DT55tjrZ.js")),
+  payout: lazy(() => import("./payout-W95Oslv1.js")),
+  pci: lazy(() => import("./pci-5RzbfIJy.js")),
+  plus: lazy(() => import("./plus-DUFyqbPe.js")),
+  remove: lazy(() => import("./remove-CR7nAYBO.js")),
+  review: lazy(() => import("./review-C4CnZ2XP.js")),
+  save: lazy(() => import("./save-DsoIf4Q0.js")),
+  search: lazy(() => import("./search-3G14C_IW.js")),
+  signatory: lazy(() => import("./signatory-BUpU_luQ.js")),
+  store: lazy(() => import("./store-CNHDWfwi.js")),
+  trust: lazy(() => import("./trust-PKlVgWsv.js")),
+  user: lazy(() => import("./user-Dt1-0v-v.js")),
+  upload: lazy(() => import("./upload-CA264b-V.js")),
+  "user-business": lazy(() => import("./user-business-BZ3Ko-Oi.js")),
+  "users-3": lazy(() => import("./users-3-Dshq7JI-.js")),
+  warning: lazy(() => import("./warning-vQPFTjLC.js")),
+  wrong: lazy(() => import("./wrong-BFDOMiyi.js")),
+  // images
+  "document-blurred": lazy(() => import("./document-blurred-gtj03M4x.js")),
+  "document-cutoff": lazy(() => import("./document-cut-off-D2vCeeIS.js")),
+  "document-expired": lazy(() => import("./document-expired-_4Syh1xW.js")),
+  "document-front": lazy(() => import("./document-front-9Glzn7ZR.js")),
+  "id-blurred": lazy(() => import("./id-blurred-A45CVnPk.js")),
+  "id-cutoff": lazy(() => import("./id-cut-off-DMoJYcGr.js")),
+  "id-front": lazy(() => import("./id-front-CTIDY7Nu.js")),
+  "id-glare": lazy(() => import("./id-glare-DRN1UgPb.js")),
+  "passport-blurred": lazy(() => import("./passport-blurred-Cw3cn4-0.js")),
+  "passport-cutoff": lazy(() => import("./passport-cut-off-B0WAEH9S.js")),
+  "passport-front": lazy(() => import("./passport-front-DOkc7OdE.js")),
+  "passport-glare": lazy(() => import("./passport-glare-DZiLpHLG.js")),
+  "id-verification-instant": lazy(() => import("./id-verification-instant-JpZYE7gU.js")),
+  "id-verification-manual": lazy(() => import("./id-verification-manual-CnkUMBXD.js")),
+  "payout-verification-instant": lazy(() => import("./payout-verification-instant-D9r3JgYA.js")),
+  "payout-verification-manual": lazy(() => import("./payout-verification-manual-BVzHrwSY.js")),
+  "singpass-verification-instant": lazy(() => Promise.resolve().then(() => singpassVerificationInstant)),
+  "singpass-verification-manual": lazy(() => Promise.resolve().then(() => singpassVerificationManual)),
+  // id verification
+  "onfido-logo": lazy(() => import("./onfido-logo-DWX1GbUz.js")),
+  "tink-logo": lazy(() => import("./tink-logo-CPPNzyT1.js")),
+  "singpass-logo": lazy(() => Promise.resolve().then(() => singpassLogo)),
+  // payout verification
+  "plaid-logo": lazy(() => import("./plaid-logo-CldAG-6v.js")),
+  "trustly-logo": lazy(() => import("./trustly-logo-QZ7eqdLL.js"))
+};
+const logger$E = createLogger("Icon");
+const Svg = ({
   className,
   name,
-  testId
+  testId,
+  alt,
+  type
 }) => {
-  const LazyLoadedIcon = icons[name];
-  if (!LazyLoadedIcon) {
-    logger$D.error(`No such icon: "${name}"`);
+  const LazyLoadedSvg = svgs[name];
+  if (!LazyLoadedSvg) {
+    logger$E.error(`No such svg: "${name}"`);
     return null;
   }
   return jsx("span", {
-    className: cx("adyen-kyc-icon", `adyen-kyc-icon-${name}`, className),
-    role: "img",
-    "aria-hidden": true,
+    className: cx(`adyen-kyc-${type} adyen-kyc-${type}-${name}`, className),
     "data-testid": testId,
     children: jsx(Suspense, {
       fallback: null,
-      children: jsx(LazyLoadedIcon, {})
+      children: jsx(LazyLoadedSvg, {
+        alt,
+        "aria-hidden": type === "icon"
+      })
     })
   });
 };
+const Icon = ({
+  name,
+  ...props
+}) => jsx(Svg, {
+  type: "icon",
+  name,
+  ...props
+});
 const Loader = ({
   inline = false,
   size = "large",
@@ -2044,7 +2088,7 @@ const Button = ({
 const Divider = () => jsx("hr", {
   className: "adyen-kyc-divider"
 });
-const ChevronDownIcon = "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20viewBox='0%200%2015%2015'%3e%3cdefs%3e%3cpath%20fill='currentColor'%20id='chevron-down_svg__a'%20d='M2%205a1%201%200%200%201%201.74-.67L7.5%208.51l3.76-4.18a1%201%200%200%201%201.48%201.34l-4.5%205a1%201%200%200%201-1.48%200l-4.5-5A1%201%200%200%201%202%205'/%3e%3c/defs%3e%3cuse%20xlink:href='%23chevron-down_svg__a'%20fill-rule='evenodd'/%3e%3c/svg%3e";
+const ChevronDownIcon = "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20viewBox='0%200%2015%2015'%3e%3cdefs%3e%3cpath%20id='chevron-down_svg__a'%20fill='currentColor'%20d='M2%205a1%201%200%200%201%201.74-.67L7.5%208.51l3.76-4.18a1%201%200%200%201%201.48%201.34l-4.5%205a1%201%200%200%201-1.48%200l-4.5-5A1%201%200%200%201%202%205'/%3e%3c/defs%3e%3cuse%20xlink:href='%23chevron-down_svg__a'%20fill-rule='evenodd'/%3e%3c/svg%3e";
 const Accordion = ({
   title,
   children,
@@ -2130,6 +2174,28 @@ const Alert = ({
       })]
     });
   }
+  if (type === "callToAction") {
+    return jsxs("div", {
+      className: cx("adyen-kyc-alert", className, `adyen-kyc-alert--${variant}`, {
+        "adyen-kyc-alert--without-icon": !renderedIcon
+      }),
+      role: "alert",
+      "data-testid": testId,
+      children: [jsxs("div", {
+        className: "adyen-kyc-alert__header",
+        children: [renderedIcon, title && jsx("span", {
+          className: "adyen-kyc-alert__title",
+          children: title
+        }), !!actions && jsx("div", {
+          className: "adyen-kyc-alert__actions",
+          children: actions
+        })]
+      }), !!children && jsx("div", {
+        className: "adyen-kyc-alert__explanation",
+        children
+      })]
+    });
+  }
   return jsxs("div", {
     className: cx("adyen-kyc-alert", className, `adyen-kyc-alert--${variant}`, {
       "adyen-kyc-alert--without-icon": !renderedIcon
@@ -2194,7 +2260,7 @@ function useFormRouterContext() {
   }
   return context;
 }
-const logger$C = createLogger("Link");
+const logger$D = createLogger("Link");
 const getIconClass = (icon, external) => {
   if (external) {
     return "adyen-kyc-link__icon adyen-kyc-icon-external-link";
@@ -2206,7 +2272,7 @@ const getIconClass = (icon, external) => {
 };
 const isValidLink = (href) => {
   if (href === "#") {
-    logger$C.error('Links must include a valid href. If your href is "#", consider using a Button instead');
+    logger$D.error('Links must include a valid href. If your href is "#", consider using a Button instead');
     return false;
   }
   return true;
@@ -2480,6 +2546,24 @@ function getFieldProps(props, innerFormFields) {
   }
   return null;
 }
+var ExperimentNames = /* @__PURE__ */ ((ExperimentNames2) => {
+  ExperimentNames2["EnableCompanySearchFlow"] = "EnableCompanySearchFlow";
+  ExperimentNames2["EnableNewBusinessDetailsFlow"] = "EnableNewBusinessDetailsFlow";
+  ExperimentNames2["EnableNewEntryFlow"] = "EnableNewEntryFlow";
+  ExperimentNames2["AllowOrganizationSettlorWithExemptionReason"] = "AllowOrganizationSettlorWithExemptionReason";
+  ExperimentNames2["AllowMoreRolesForMainRootTrustee"] = "AllowMoreRolesForMainRootTrustee";
+  ExperimentNames2["ShowUnsupportedEntityType"] = "ShowUnsupportedEntityType";
+  ExperimentNames2["ShowSingPassButtonForCompanies"] = "ShowSingPassButtonForCompanies";
+  ExperimentNames2["ShowSingPassButtonForIndividuals"] = "ShowSingPassButtonForIndividuals";
+  ExperimentNames2["ShowExtraTaxExemptionReasons"] = "ShowExtraTaxExemptionReasons";
+  ExperimentNames2["EnableCountryOfGoverningLawForUKCompanies"] = "EnableCountryOfGoverningLawForUKCompanies";
+  ExperimentNames2["HidePayoutAccountTask"] = "HidePayoutAccountTask";
+  ExperimentNames2["HidePciTask"] = "HidePciTask";
+  ExperimentNames2["EnableAgeVerification"] = "EnableAgeVerification";
+  ExperimentNames2["PreserveMismatchedInitialValues"] = "PreserveMismatchedInitialValues";
+  ExperimentNames2["HOStrictNameAndAddressValidationV4"] = "HOStrictNameAndAddressValidationV4";
+  return ExperimentNames2;
+})(ExperimentNames || {});
 const ON_CHANGE_DEBOUNCE_DURATION = 200;
 const KEYBOARD_KEYS = {
   arrowDown: "ArrowDown",
@@ -2538,7 +2622,7 @@ const useSetting = (settingName) => {
   } = context;
   return getSetting(settingName);
 };
-const logger$B = createLogger("useAllowedCountries");
+const logger$C = createLogger("useAllowedCountries");
 const useAllowedCountries = () => {
   const acceptedCountries = useSetting("acceptedCountries");
   const {
@@ -2547,7 +2631,7 @@ const useAllowedCountries = () => {
   const [allowedCountries, setAllowedCountries] = useState(acceptedCountries);
   useEffect(() => {
     if (acceptedCountries !== void 0) return;
-    getAllowedCountries2().then((response) => setAllowedCountries(response.countries)).catch(logger$B.error);
+    getAllowedCountries2().then((response) => setAllowedCountries(response.countries)).catch(logger$C.error);
   }, [acceptedCountries]);
   return allowedCountries;
 };
@@ -2906,7 +2990,7 @@ function reducer({
     }
   };
 }
-const logger$A = createLogger("useAsyncValidator");
+const logger$B = createLogger("useAsyncValidator");
 const useAsyncValidator = (asyncRules) => {
   const [asyncValidationResults, setAsyncValidationResults] = useState({});
   const clearAsyncValidationResults = useCallback(() => setAsyncValidationResults({}), []);
@@ -2927,7 +3011,7 @@ const useAsyncValidator = (asyncRules) => {
           hasError: !isValid
         }])
       });
-    }).catch(logger$A.error);
+    }).catch(logger$B.error);
   }, [asyncRules, clearAsyncValidationResults]);
   return {
     asyncValidationResults,
@@ -3372,7 +3456,7 @@ const Tag = ({
     children
   });
 };
-const styles$2 = {
+const styles$3 = {
   "adyen-kyc-dropdown": "adyen-kyc-dropdown",
   "adyen-kyc-dropdown-button": "adyen-kyc-dropdown-button",
   "adyen-kyc-dropdown-button--active": "adyen-kyc-dropdown-button--active",
@@ -3428,10 +3512,10 @@ function SelectButton({
     "aria-haspopup": "listbox",
     className: cx({
       "adyen-kyc-dropdown-button": true,
-      [styles$2["adyen-kyc-dropdown-button"]]: true,
+      [styles$3["adyen-kyc-dropdown-button"]]: true,
       "adyen-kyc-dropdown-button--readonly": readonly,
       "adyen-kyc-dropdown-button--active": showList,
-      [styles$2["adyen-kyc-dropdown-button--active"]]: showList,
+      [styles$3["adyen-kyc-dropdown-button--active"]]: showList,
       "adyen-kyc-dropdown-button--invalid": isInvalid,
       "adyen-kyc-dropdown-field--valid": isValid,
       "adyen-kyc-dropdown-button-search": isSearch
@@ -3501,7 +3585,7 @@ const SelectButtonContentSingle = ({
       "aria-expanded": showList,
       "aria-owns": selectListId,
       autoComplete: "off",
-      className: cx("adyen-kyc-filter-input", [styles$2["adyen-kyc-filter-input"]]),
+      className: cx("adyen-kyc-filter-input", [styles$3["adyen-kyc-filter-input"]]),
       onInput,
       placeholder,
       ref: filterInputRef,
@@ -3589,7 +3673,7 @@ const SelectListItem = ({
 }) => jsx("li", {
   "aria-disabled": !!item.disabled,
   "aria-selected": selected,
-  className: cx(["adyen-kyc-dropdown-element", styles$2["adyen-kyc-dropdown-element"], {
+  className: cx(["adyen-kyc-dropdown-element", styles$3["adyen-kyc-dropdown-element"], {
     "adyen-kyc-dropdown-element--active": selected,
     "adyen-kyc-dropdown-element--disabled": !!item.disabled,
     "adyen-kyc-dropdown-multi-element": isMulti,
@@ -3637,6 +3721,8 @@ const SelectListItem = ({
     })]
   })
 });
+const ITEM_HEIGHT = 35;
+const VISIBLE_ITEMS = 10;
 function SelectList({
   active,
   items,
@@ -3652,6 +3738,37 @@ function SelectList({
   const {
     i18n
   } = useI18nContext();
+  const listRef = useRef(null);
+  const [startIndex, setStartIndex] = useState(0);
+  const [endIndex, setEndIndex] = useState(VISIBLE_ITEMS);
+  const [listHeight, setListHeight] = useState(0);
+  const filteredItems = items.filter((item) => {
+    var _a;
+    if (isSearch) {
+      return item;
+    }
+    return !textFilter || ((_a = item.name) == null ? void 0 : _a.toLowerCase().includes(textFilter));
+  });
+  const totalItems = filteredItems.length;
+  const visibleItems = filteredItems.slice(startIndex, endIndex);
+  const handleScroll = useCallback(() => {
+    if (listRef.current) {
+      const {
+        scrollTop
+      } = listRef.current;
+      const maxStartIndex = totalItems - VISIBLE_ITEMS;
+      const newStartIndex = Math.min(Math.max(0, Math.floor(scrollTop / ITEM_HEIGHT)), maxStartIndex);
+      const newEndIndex = Math.min(newStartIndex + VISIBLE_ITEMS, totalItems);
+      setStartIndex(newStartIndex);
+      setEndIndex(newEndIndex);
+    }
+  }, [totalItems]);
+  useEffect(() => {
+    if (listRef.current) {
+      const newHeight = totalItems ? Math.min(totalItems, VISIBLE_ITEMS) * ITEM_HEIGHT : ITEM_HEIGHT;
+      setListHeight(newHeight);
+    }
+  }, [totalItems]);
   const getItems = () => {
     if (loading) {
       return jsx("div", {
@@ -3659,46 +3776,58 @@ function SelectList({
         children: i18n.get("loading")
       });
     }
+    if (!filteredItems.length) {
+      return jsx("div", {
+        className: "adyen-kyc-dropdown-element adyen-kyc-dropdown-element--no-options",
+        children: i18n.get("noOptionsFound")
+      });
+    }
     if (isSearch && (!textFilter || textFilter.length < 3)) {
       return null;
     }
-    if (mappedFilteredItems.length) {
-      return mappedFilteredItems;
+    if (visibleItems.length) {
+      return visibleItems.map((item) => jsx(SelectListItem, {
+        item,
+        onKeyDown: (event) => props.onKeyDown(event, item),
+        onSelect: () => props.onSelect(item),
+        selected: !!active.find((activeItem) => activeItem.id === item.id),
+        isMulti,
+        isSearch,
+        children: getSearchItem && getSearchItem(item)
+      }, item.id));
     }
-    return jsx("div", {
-      className: "adyen-kyc-dropdown-element adyen-kyc-dropdown-element--no-options",
-      children: i18n.get("noOptionsFound")
-    });
+    return null;
   };
-  const filteredItems = items.filter((item) => {
-    var _a;
-    if (isSearch) {
-      return item;
-    }
-    return !textFilter || ((_a = item.name) == null ? void 0 : _a.toLowerCase().includes(textFilter));
-  });
-  const mappedFilteredItems = filteredItems.map((item) => jsx(SelectListItem, {
-    item,
-    onKeyDown: (event) => props.onKeyDown(event, item),
-    onSelect: () => props.onSelect(item),
-    selected: !!active.find((activeItem) => activeItem.id === item.id),
-    isMulti,
-    isSearch,
-    children: getSearchItem && getSearchItem(item)
-  }, item.id));
   return jsx("ul", {
     className: cx({
       test: true,
       "adyen-kyc-dropdown-list--above": showAbove,
       "adyen-kyc-dropdown-list": true,
-      [styles$2["adyen-kyc-dropdown-list"]]: true,
+      [styles$3["adyen-kyc-dropdown-list"]]: true,
       "adyen-kyc-dropdown-list--active": showList,
-      [styles$2["adyen-kyc-dropdown-list--active"]]: showList
+      [styles$3["adyen-kyc-dropdown-list--active"]]: showList
     }),
     id: props.selectListId,
-    ref: props.selectListRef,
+    ref: listRef,
     role: "listbox",
-    children: getItems()
+    onScroll: handleScroll,
+    style: {
+      height: `${listHeight}px`,
+      overflowY: totalItems > VISIBLE_ITEMS ? "auto" : "hidden",
+      position: "relative"
+    },
+    children: jsx("div", {
+      style: {
+        height: `${totalItems * ITEM_HEIGHT}px`,
+        position: "relative"
+      },
+      children: jsx("div", {
+        style: {
+          transform: `translateY(${startIndex * ITEM_HEIGHT}px)`
+        },
+        children: getItems()
+      })
+    })
   });
 }
 const SELECTLIST_MAX_HEIGHT = 145;
@@ -3884,7 +4013,7 @@ const Select = ({
     };
   }, []);
   return jsxs("div", {
-    className: cx(["adyen-kyc-dropdown", styles$2["adyen-kyc-dropdown"], className, ...classNameModifiers.map((m) => `adyen-kyc-dropdown--${m}`)]),
+    className: cx(["adyen-kyc-dropdown", styles$3["adyen-kyc-dropdown"], className, ...classNameModifiers.map((m) => `adyen-kyc-dropdown--${m}`)]),
     ref: selectContainerRef,
     onClick: (e) => {
       e.stopPropagation();
@@ -3942,7 +4071,7 @@ function CountryField({
   handleChangeFor,
   helperText,
   allowedCountries,
-  classNameModifiers = []
+  classNameModifiers = ["country"]
 }) {
   const {
     i18n
@@ -3958,6 +4087,7 @@ function CountryField({
     classNameModifiers,
     isValid: valid.country,
     helper: helperText == null ? void 0 : helperText.country,
+    "data-testid": "country",
     children: (childProps) => jsx(Select, {
       ...childProps,
       name,
@@ -4468,6 +4598,19 @@ const validateNotEmptyOnBlur = {
   validate: (val) => !isEmpty(val),
   errorMessage: "fieldIsRequired"
 };
+const validateLegalCompanyName = [{
+  modes: ["blur"],
+  validate: hasText,
+  errorMessage: "fieldIsRequired"
+}, {
+  modes: ["blur"],
+  validate: (input) => !matchesRegex(NO_ALPHABET_REGEX, input),
+  errorMessage: "nameMustContainLetters"
+}, {
+  modes: ["blur"],
+  validate: (input) => !matchesRegex(EMOJI_REGEX, input) && !hasRepeatedCharacters(input) && isValidMinLength(input, 3) && !isInvalidName(input) && matchesRegex(OTHER_ENTITIES_VALID_CHAR_REGEX, input),
+  errorMessage: "checkForTypos"
+}];
 const validatePatternOnBlur = (pattern) => ({
   modes: ["blur"],
   validate: (val) => !!val && pattern.test(val)
@@ -4506,6 +4649,40 @@ const defaultFieldConfig$a = {
     validators: validateNotEmptyOnBlur
   })
 };
+const defaultFieldMetadataV4 = {
+  label: "legalCompanyName",
+  helperText: "legalCompanyName__helperText",
+  validators: validateLegalCompanyName
+};
+const defaultFieldConfigV4 = {
+  [CountryCodes.Australia]: {
+    label: "legalCompanyName",
+    helperText: "legalCompanyName__helperText__AU",
+    validators: validateLegalCompanyName
+  },
+  [CountryCodes.HongKong]: {
+    label: "legalCompanyName",
+    helperText: "legalCompanyName__helperText__HK",
+    validators: validateLegalCompanyName
+  },
+  [CountryCodes.Netherlands]: {
+    label: "legalCompanyName",
+    helperText: "legalCompanyName__helperText__NL",
+    validators: validateLegalCompanyName
+  },
+  [CountryCodes.Singapore]: {
+    label: "legalCompanyName",
+    helperText: "legalCompanyName__helperText__SG",
+    validators: validateLegalCompanyName
+  },
+  [CountryCodes.UnitedStates]: ({
+    isBusiness
+  }) => ({
+    label: "legalCompanyName__US",
+    helperText: isBusiness ? "legalCompanyName__helperText__US__business" : "legalCompanyName__helperText__US",
+    validators: validateLegalCompanyName
+  })
+};
 const PatriotActDisclosure = () => {
   const {
     i18n
@@ -4532,11 +4709,19 @@ const companyCountryValidationRules = {
     validate: (companyCountry) => !isEmpty(companyCountry),
     errorMessage: "fieldIsRequired"
   },
-  legalCompanyName: {
+  legalCompanyName: [{
     modes: ["blur"],
-    validate: (legalCompanyName) => !isEmpty(legalCompanyName),
+    validate: hasText,
     errorMessage: "fieldIsRequired"
-  },
+  }, {
+    modes: ["blur"],
+    validate: (input) => !matchesRegex(NO_ALPHABET_REGEX, input),
+    errorMessage: "nameMustContainLetters"
+  }, {
+    modes: ["blur"],
+    validate: (input) => !matchesRegex(EMOJI_REGEX, input) && !hasRepeatedCharacters(input) && isValidMinLength(input, 3) && !isInvalidName(input) && matchesRegex(OTHER_ENTITIES_VALID_CHAR_REGEX, input),
+    errorMessage: "checkForTypos"
+  }],
   countryOfGoverningLaw: {
     modes: ["blur"],
     validate: (countryOfGoverningLaw) => !isEmpty(countryOfGoverningLaw),
@@ -4556,14 +4741,17 @@ function CompanyNameAndCountry(props) {
   const {
     isExperimentEnabled
   } = useExperimentsContext();
+  const isStrictNameAndAddressValidationEnabled = isExperimentEnabled(ExperimentNames.HOStrictNameAndAddressValidationV4);
   const {
     sliceData,
     updateStateSlice
   } = useGlobalDataSlice(props.id);
+  const LegalCompanyNameDefaultFieldConfig = isStrictNameAndAddressValidationEnabled ? defaultFieldConfigV4 : defaultFieldConfig$a;
+  const LegalCompanyNameDefaultFieldMetadata = isStrictNameAndAddressValidationEnabled ? defaultFieldMetadataV4 : defaultFieldMetadata$a;
   let mergedProps = props;
-  mergedProps = mergeFieldMetadataIntoProps("legalCompanyName", resolveFieldMetadata(defaultFieldConfig$a[sliceData == null ? void 0 : sliceData.country], {
+  mergedProps = mergeFieldMetadataIntoProps("legalCompanyName", resolveFieldMetadata(LegalCompanyNameDefaultFieldConfig[sliceData == null ? void 0 : sliceData.country], {
     isBusiness: false
-  }, defaultFieldMetadata$a), mergedProps);
+  }, LegalCompanyNameDefaultFieldMetadata), mergedProps);
   const schemaWithGoverningLaw = (sliceData == null ? void 0 : sliceData.country) === "GB" && (sliceData == null ? void 0 : sliceData.differentCountryOfGoverningLaw) ? countryWithGoverningLawFields : companyNameAndCountryFields;
   const {
     data: formData,
@@ -5114,7 +5302,7 @@ const businessRegistrationNumberMasks = {
   },
   [CountryCodes.Spain]: {
     default: {
-      mask: makeMask(...alphaInputs(1), ...numericInputs(8)),
+      mask: makeMask(...alphaInputs(1), ...alphanumericInputs(8)),
       transformOnType: uppercase
     }
   },
@@ -6804,7 +6992,7 @@ const deriveInputState = (isValid, isFocused, isDisabled, isOptional, hasNullish
   };
 };
 const MISMATCH_ANIMATION_NAME = "mismatchShake";
-const logger$z = createLogger("MaskedInputText");
+const logger$A = createLogger("MaskedInputText");
 const MaskedInputText = ({
   value,
   onInput,
@@ -6850,7 +7038,7 @@ const MaskedInputText = ({
   };
   useEffect(() => {
     if (!mask) {
-      logger$z.warn("`mask` is undefined. No masking of input will take place.");
+      logger$A.warn("`mask` is undefined. No masking of input will take place.");
     }
   }, [mask]);
   const getMaskResult = useCallback((pureValue) => {
@@ -6875,13 +7063,13 @@ const MaskedInputText = ({
         return;
       }
       if (preserveMismatchingInitialValue) {
-        logger$z.warn(`Value received "${value}" does not match mask`, maskResult, `
+        logger$A.warn(`Value received "${value}" does not match mask`, maskResult, `
 Preserving mismatched initial value until user input.`);
         setPreservingMismatchedValue(true);
         return;
       }
       const fallback = displayValueToPure(maskResult.partialDisplayValue);
-      logger$z.warn(`Value received "${value}" does not match mask`, maskResult, `
+      logger$A.warn(`Value received "${value}" does not match mask`, maskResult, `
 Falling back to partially valid value "${fallback}"`);
       onInput(fallback);
     }
@@ -7045,7 +7233,7 @@ function RadioGroup({
           type: "radio",
           checked: value === item.id,
           "aria-checked": value === item.id,
-          name,
+          name: name ?? item.name,
           onChange,
           onClick: onChange,
           value: item.id,
@@ -9015,24 +9203,6 @@ const tradingNameFieldMetadata = {
   label: "tradingName",
   validators: [validateNotEmptyOnBlur]
 };
-var ExperimentNames = /* @__PURE__ */ ((ExperimentNames2) => {
-  ExperimentNames2["EnableCompanySearchFlow"] = "EnableCompanySearchFlow";
-  ExperimentNames2["EnableNewBusinessDetailsFlow"] = "EnableNewBusinessDetailsFlow";
-  ExperimentNames2["EnableNewEntryFlow"] = "EnableNewEntryFlow";
-  ExperimentNames2["AllowOrganizationSettlorWithExemptionReason"] = "AllowOrganizationSettlorWithExemptionReason";
-  ExperimentNames2["AllowMoreRolesForMainRootTrustee"] = "AllowMoreRolesForMainRootTrustee";
-  ExperimentNames2["ShowUnsupportedEntityType"] = "ShowUnsupportedEntityType";
-  ExperimentNames2["ShowSingPassButtonForCompanies"] = "ShowSingPassButtonForCompanies";
-  ExperimentNames2["ShowSingPassButtonForIndividuals"] = "ShowSingPassButtonForIndividuals";
-  ExperimentNames2["ShowExtraTaxExemptionReasons"] = "ShowExtraTaxExemptionReasons";
-  ExperimentNames2["EnableCountryOfGoverningLawForUKCompanies"] = "EnableCountryOfGoverningLawForUKCompanies";
-  ExperimentNames2["HidePayoutAccountTask"] = "HidePayoutAccountTask";
-  ExperimentNames2["HidePciTask"] = "HidePciTask";
-  ExperimentNames2["EnableAgeVerification"] = "EnableAgeVerification";
-  ExperimentNames2["PreserveMismatchedInitialValues"] = "PreserveMismatchedInitialValues";
-  ExperimentNames2["StrictNameAndAddressValidation"] = "StrictNameAndAddressValidation";
-  return ExperimentNames2;
-})(ExperimentNames || {});
 var VatAbsenceReason = /* @__PURE__ */ ((VatAbsenceReason2) => {
   VatAbsenceReason2["IndustryExemption"] = "industryExemption";
   VatAbsenceReason2["BelowTaxThreshold"] = "belowTaxThreshold";
@@ -10529,7 +10699,7 @@ const accountHolderValidationRules = {
   }
 };
 const accountHolderFields = ["accountHolder"];
-const logger$y = createLogger("AccountHolder");
+const logger$z = createLogger("AccountHolder");
 function getAvailableAccountHolderOptions(legalEntityType, isChangeOfLegalEntityTypeAllowed, isTrustFlowEnabled, isSoleProprietorshipAllowed, isChangeToMyNameAllowed) {
   switch (legalEntityType) {
     case LegalEntityType.ORGANIZATION: {
@@ -10539,7 +10709,7 @@ function getAvailableAccountHolderOptions(legalEntityType, isChangeOfLegalEntity
       return [...isChangeToMyNameAllowed ? ["myName"] : [], ...isChangeOfLegalEntityTypeAllowed ? ["theCompanyIWorkFor"] : [], ...isTrustFlowEnabled ? ["aTrust"] : [], ...isSoleProprietorshipAllowed ? ["mySoleProprietorName"] : []];
     }
     default:
-      logger$y.error(`No available account holder options for legal entity type '${legalEntityType}'`);
+      logger$z.error(`No available account holder options for legal entity type '${legalEntityType}'`);
       return [];
   }
 }
@@ -10722,20 +10892,20 @@ function CompanyTypeComponent(props) {
     })]
   });
 }
-const getDocumentGuidancePrefix = (documentType, isIcon = false, isFront = true) => {
+const getDocumentGuidancePrefix = (documentType) => {
   switch (documentType) {
     case DocumentType.PASSPORT:
       return "passport";
     case DocumentType.DRIVERS_LICENSE:
     case DocumentType.IDENTITY_CARD:
-      return isIcon ? isFront ? "id-front" : "id-back" : "id";
+      return "id";
     case DocumentType.BANK_STATEMENT:
     case DocumentType.VAT_DOCUMENT:
     case DocumentType.REGISTRATION_DOCUMENT:
     case DocumentType.PROOF_OF_ADDRESS:
     case DocumentType.PROOF_OF_RESIDENCY:
     default:
-      return "generic-document";
+      return "document";
   }
 };
 function DocumentGuidance({
@@ -10745,50 +10915,48 @@ function DocumentGuidance({
   const {
     i18n
   } = useI18nContext();
-  const {
-    loadDocumentGuidance: loadDocumentGuidance2
-  } = useConfigurationApi();
-  const [guidancePrefix, setGuidancePrefix] = useState(null);
-  useEffect(() => {
-    loadDocumentGuidance2();
-  }, []);
-  useEffect(() => {
-    setGuidancePrefix(getDocumentGuidancePrefix(type));
+  const documentGuidanceItems = useMemo(() => {
+    const guidancePrefix = getDocumentGuidancePrefix(type);
+    return [{
+      svgName: `${guidancePrefix}-front`,
+      translationKey: "good",
+      valid: true
+    }, {
+      svgName: `${guidancePrefix}-cutoff`,
+      translationKey: "notCutOff"
+    }, {
+      svgName: `${guidancePrefix}-blurred`,
+      translationKey: "notBlurry"
+    }, guidancePrefix === "document" ? {
+      svgName: `document-expired`,
+      translationKey: "notExpired"
+    } : {
+      svgName: `${guidancePrefix}-glare`,
+      translationKey: "noGlare"
+    }];
   }, [type]);
-  const documentGuidanceItems = useMemo(() => [{
-    type: "valid",
-    translationKey: "good"
-  }, {
-    type: "invalid-cut",
-    translationKey: "notCutOff"
-  }, {
-    type: "invalid-blur",
-    translationKey: "notBlurry"
-  }, guidancePrefix === "generic-document" ? {
-    type: "invalid-expired",
-    translationKey: "notExpired"
-  } : {
-    type: "invalid-glare",
-    translationKey: "noGlare"
-  }], [guidancePrefix]);
   return jsx("div", {
     className: cx("adyen-kyc-document-guidance", className),
     children: jsx("div", {
       className: "adyen-kyc-document-guidance__container",
       children: documentGuidanceItems.map((item) => jsxs("figure", {
         className: "adyen-kyc-document-guidance__item",
-        children: [jsx("svg", {
-          width: "100%",
-          height: "100%",
-          role: "img",
-          children: jsx("use", {
-            href: `#adyen-kyc-${guidancePrefix}-${item.type}`
-          })
-        }), jsx("figcaption", {
+        children: [jsx(Svg, {
+          type: "image",
+          name: item.svgName
+        }), jsxs("figcaption", {
           className: "adyen-kyc-document-guidance__description",
-          children: i18n.get(item.translationKey)
+          children: [item.valid ? jsx(Svg, {
+            type: "icon",
+            name: "check",
+            className: cx("adyen-kyc-document-guidance__icon", "adyen-kyc-document-guidance__icon--valid")
+          }) : jsx(Svg, {
+            type: "icon",
+            name: "cross",
+            className: cx("adyen-kyc-document-guidance__icon", "adyen-kyc-document-guidance__icon--invalid")
+          }), i18n.get(item.translationKey)]
         })]
-      }, item.type))
+      }, item.translationKey))
     })
   });
 }
@@ -10802,15 +10970,16 @@ function bytesToSize(bytes) {
 const isExistingFile = (file) => "existing" in file && file.existing;
 const isNewlyUploadedFile = (file) => !isExistingFile(file);
 function DropzoneFile(props) {
+  var _a;
   const {
     file,
     errorMessage,
-    onDelete,
-    iconPrefix
+    onDelete
   } = props;
   const {
     i18n
   } = useI18nContext();
+  let documentIcon;
   const formatSize = (bytes) => {
     const sizes = ["Bytes", "KB", "MB", "GB", "TB"];
     if (!bytes || bytes === 0) return "n/a";
@@ -10818,40 +10987,46 @@ function DropzoneFile(props) {
     if (i === 0) return `${bytes} ${sizes[i]}`;
     return `${(bytes / 1024 ** i).toFixed(1)} ${sizes[i]}`;
   };
+  switch ((_a = file.type) == null ? void 0 : _a.split("/")[0]) {
+    case "image":
+      documentIcon = "image";
+      break;
+    default:
+      documentIcon = "document";
+  }
   return jsxs("div", {
-    className: "adyen-kyc-dropzone-file",
-    children: [jsx("div", {
-      className: "adyen-kyc-dropzone-file__icon",
-      children: jsx("svg", {
-        height: "100%",
-        width: "100%",
-        children: errorMessage ? jsx("use", {
-          "data-testid": "document-invalid",
-          href: `#adyen-kyc-${iconPrefix}-icon-invalid`
-        }) : jsx("use", {
-          "data-testid": "document-valid",
-          href: `#adyen-kyc-${iconPrefix}-icon-valid`
-        })
-      })
-    }), jsxs("div", {
-      className: "adyen-kyc-dropzone-file__labels",
-      children: [jsx("div", {
-        className: "adyen-kyc-dropzone-file__name",
-        children: file.name
-      }), errorMessage ? jsx("div", {
+    className: cx("adyen-kyc-dropzone-file", {
+      "adyen-kyc-dropzone-file--error": errorMessage
+    }),
+    children: [jsxs("div", {
+      className: "adyen-kyc-dropzone-file__details",
+      children: [jsxs("div", {
+        className: "adyen-kyc-dropzone-file__labels",
+        children: [errorMessage ? jsx(Icon, {
+          testId: "document-invalid",
+          name: "warning",
+          className: "adyen-kyc-dropzone-file__icon"
+        }) : jsx(Icon, {
+          testId: "document-valid",
+          name: documentIcon,
+          className: "adyen-kyc-dropzone-file__icon"
+        }), jsx(Typography, {
+          variant: "body-stronger",
+          className: "adyen-kyc-dropzone-file__name",
+          children: file.name
+        }), jsx(Typography, {
+          className: "adyen-kyc-dropzone-file__size",
+          children: isNewlyUploadedFile(file) && formatSize(file.size)
+        })]
+      }), errorMessage && jsx("div", {
         className: "adyen-kyc-dropzone-file__error",
         children: i18n.get(errorMessage)
-      }) : jsx("div", {
-        className: "adyen-kyc-dropzone-file__size",
-        children: isNewlyUploadedFile(file) ? formatSize(file.size) : void 0
       })]
-    }), jsx("button", {
-      type: "button",
+    }), jsx(Button, {
+      icon: errorMessage ? "cross" : "bin",
       className: "adyen-kyc-dropzone-file__button",
-      onClick: onDelete,
-      children: jsx(Icon, {
-        name: "remove"
-      })
+      tertiary: true,
+      onClick: onDelete
     })]
   });
 }
@@ -10909,7 +11084,6 @@ function Dropzone(props) {
   var _a, _b;
   const {
     name,
-    iconPrefix = "generic-document",
     label = "",
     multiple = false,
     required = true,
@@ -11032,8 +11206,7 @@ function Dropzone(props) {
       return jsx(DropzoneFile, {
         file,
         onDelete: () => handleFileDelete(file),
-        errorMessage: (_a2 = errors == null ? void 0 : errors[name]) == null ? void 0 : _a2.errorMessage,
-        iconPrefix
+        errorMessage: (_a2 = errors == null ? void 0 : errors[name]) == null ? void 0 : _a2.errorMessage
       }, file);
     }), showDropzone && jsxs("div", {
       role: "region",
@@ -11047,35 +11220,45 @@ function Dropzone(props) {
       onDragLeave: (e) => handleDragLeave(e),
       children: [jsx("div", {
         className: "adyen-kyc-dropzone__icon",
-        children: jsx("svg", {
-          height: "100%",
-          width: "100%",
-          children: jsx("use", {
-            href: `#adyen-kyc-${iconPrefix}-icon`
-          })
+        children: jsx(Icon, {
+          name: "upload"
         })
       }), jsxs("div", {
         className: "adyen-kyc-dropzone__labels",
-        children: [jsxs("div", {
-          className: "adyen-kyc-dropzone__drag-text",
-          children: [jsxs("span", {
-            children: [i18n.get("dragYourFilesHereOr"), " "]
-          }), jsx("button", {
-            className: "adyen-kyc-dropzone__button",
-            type: "button",
-            onClick: selectFile,
-            children: i18n.get("browse")
-          })]
-        }), jsx("div", {
-          className: "adyen-kyc-dropzone__supports-text",
-          children: i18n.get("supports", {
+        children: [jsx(Typography, {
+          el: "h4",
+          variant: "body-strongest",
+          children: i18n.get("dropFileToUpload")
+        }), jsx(Typography, {
+          color: "secondary",
+          children: i18n.get("supportedFileTypes", {
+            values: {
+              fileTypes: allowedFiletypes
+            }
+          })
+        }), jsx(Typography, {
+          color: "secondary",
+          children: i18n.get("maxFileSize", {
+            values: {
+              maxSize: bytesToSize(maxSize)
+            }
+          })
+        }), jsx(Typography, {
+          color: "secondary",
+          children: i18n.get("upToFiles", {
             values: {
-              fileTypes: allowedFiletypes,
-              maxSize: bytesToSize(maxSize),
               maxFiles: maxNumberOfFiles
             }
           })
         })]
+      }), jsx("div", {
+        className: "adyen-kyc-dropzone__button",
+        children: jsx(Button, {
+          label: i18n.get("browseFiles"),
+          onClick: selectFile,
+          secondary: true,
+          small: true
+        })
       }), jsx("input", {
         className: "adyen-kyc-dropzone__input",
         ref: fileInput,
@@ -11093,7 +11276,7 @@ function Dropzone(props) {
     })]
   });
 }
-const logger$x = createLogger("TextArea");
+const logger$y = createLogger("TextArea");
 function TextArea(props) {
   const {
     classNameModifiers,
@@ -11114,7 +11297,7 @@ function TextArea(props) {
   } = useI18nContext();
   const [value, setValue] = useState("");
   if (Object.prototype.hasOwnProperty.call(props, "onChange")) {
-    logger$x.error("Error: Form fields that rely on InputBase may not have an onChange property");
+    logger$y.error("Error: Form fields that rely on InputBase may not have an onChange property");
   }
   const handleInput = (e) => {
     var _a;
@@ -11266,7 +11449,6 @@ function DocumentUploadComponent({
       }), jsx(Dropzone, {
         defaultData: document2,
         id: props.id,
-        iconPrefix: getDocumentGuidancePrefix(documentType, true),
         isOptional: isOptional || formUtils.isOptionalField(documentField),
         maxSize: documentType === DocumentType.CONSTITUTIONAL_DOCUMENT ? 31457280 : void 0,
         name: documentField,
@@ -11419,7 +11601,7 @@ function StateField({
   readonly,
   handleChangeFor,
   selectedCountry,
-  classNameModifiers = []
+  classNameModifiers = ["stateOrProvince"]
 }) {
   const {
     i18n
@@ -11560,7 +11742,7 @@ function useIsElementVisible(ref, fallback = true) {
   }, [ref]);
   return isOnScreen;
 }
-const logger$w = createLogger("SearchAddress");
+const logger$x = createLogger("SearchAddress");
 const SearchAddress = ({
   data,
   legalEntityId,
@@ -11604,7 +11786,7 @@ const SearchAddress = ({
       const response = await handleFindAddress(selectedAddressId);
       autocompleteAddressForm(response);
     } catch (e) {
-      logger$w.error(e);
+      logger$x.error(e);
     }
   };
   const onDrilldown = async (selectedAddress) => {
@@ -11616,7 +11798,7 @@ const SearchAddress = ({
       }, legalEntityId);
       setItems((response == null ? void 0 : response.results) || []);
     } catch (e) {
-      logger$w.error(e);
+      logger$x.error(e);
     }
   };
   const onChange = (e) => {
@@ -11671,7 +11853,7 @@ const SearchAddress = ({
           setItems([]);
         }
       } catch (e) {
-        logger$w.error(e);
+        logger$x.error(e);
       }
       setLoading(false);
     }
@@ -12051,15 +12233,11 @@ const addressValidationRules = (country) => {
   var _a, _b;
   const postalCodeFormat = (_b = (_a = countrySpecificFormatters[country]) == null ? void 0 : _a.postalCode) == null ? void 0 : _b.format;
   return {
-    address: [{
+    address: {
       modes: ["blur"],
       validate: (val) => hasText(val),
       errorMessage: "fieldIsRequired"
-    }, {
-      modes: ["blur"],
-      validate: (val) => !matchesRegex(EMOJI_REGEX, val),
-      errorMessage: "checkForTypos"
-    }],
+    },
     postalCode: {
       modes: ["blur"],
       validate: (val) => {
@@ -12090,6 +12268,82 @@ const addressValidationRules = (country) => {
     }
   };
 };
+const addressValidationRulesV4 = (country, i18n) => {
+  var _a, _b;
+  const postalCodeFormat = (_b = (_a = countrySpecificFormatters[country]) == null ? void 0 : _a.postalCode) == null ? void 0 : _b.format;
+  const MIN_LENGTH_3 = 3;
+  return {
+    address: [{
+      modes: ["blur"],
+      validate: (val) => hasText(val),
+      errorMessage: "fieldIsRequired"
+    }, {
+      modes: ["blur"],
+      validate: (val) => !matchesRegex(EMOJI_REGEX, val) && !hasRepeatedCharacters(val) && !isInvalidName(val),
+      errorMessage: "checkForTypos"
+    }, {
+      modes: ["blur"],
+      validate: (val) => isValidMinLength(val, MIN_LENGTH_3),
+      errorMessage: {
+        key: "fieldMustContainAtLeast",
+        values: {
+          fieldName: i18n.get("address"),
+          minLength: String(MIN_LENGTH_3)
+        }
+      }
+    }],
+    postalCode: {
+      modes: ["blur"],
+      validate: (val) => {
+        const pattern = postalCodePatterns[country];
+        return pattern ? !!val && pattern.test(val) : !!val;
+      },
+      errorMessage: postalCodeFormat ? {
+        key: "invalidFormatExpects",
+        values: {
+          format: postalCodeFormat
+        }
+      } : "invalidFormat"
+    },
+    city: [{
+      modes: ["blur"],
+      validate: hasText,
+      errorMessage: "fieldIsRequired"
+    }, {
+      modes: ["blur"],
+      validate: (val) => !hasRepeatedCharacters(val) && !isInvalidName(val),
+      errorMessage: "checkForTypos"
+    }, {
+      modes: ["blur"],
+      validate: (val) => isValidMinLength(val, MIN_LENGTH_3),
+      errorMessage: {
+        key: "fieldMustContainAtLeast",
+        values: {
+          fieldName: i18n.get("city"),
+          minLength: String(MIN_LENGTH_3)
+        }
+      }
+    }],
+    stateOrProvince: [{
+      modes: ["blur"],
+      validate: (val) => !!val,
+      errorMessage: "fieldIsRequired"
+    }, {
+      modes: ["blur"],
+      validate: (val) => !hasRepeatedCharacters(val) && !isInvalidName(val),
+      errorMessage: "checkForTypos"
+    }],
+    country: [{
+      modes: ["blur"],
+      validate: (val) => !!val,
+      errorMessage: "fieldIsRequired"
+    }, {
+      modes: ["blur"],
+      validate: (val) => !hasRepeatedCharacters(val) && !isInvalidName(val),
+      errorMessage: "checkForTypos"
+    }]
+  };
+};
 function Address(props) {
   const {
     data: dataProp,
@@ -12114,6 +12368,7 @@ function Address(props) {
   const {
     isExperimentEnabled
   } = useExperimentsContext();
+  const isStrictNameAndAddressValidationEnabled = isExperimentEnabled(ExperimentNames.HOStrictNameAndAddressValidationV4);
   const [showAutocompletedAddressFields, setShowAutocompletedAddressFields] = useState(false);
   const [showAddAddressButton, setShowAddAddressButton] = useState(true);
   const [isHandlerPresent, setIsHandlerPresent] = useState(false);
@@ -12124,6 +12379,7 @@ function Address(props) {
   const datasetUtils = datasetUtilities(i18n.locale);
   const requiredFields = (requiredFieldsProp == null ? void 0 : requiredFieldsProp.includes("stateOrProvince")) || dataProp.country && COUNTRIES_WITH_STATES_DATASET.includes(dataProp.country) ? addressFields : addressFields.filter((ad) => ad !== "stateOrProvince");
   const rules2 = useMemo(() => addressValidationRules(dataProp.country), [dataProp.country]);
+  const rulesV4 = useMemo(() => addressValidationRulesV4(dataProp.country, i18n), [dataProp.country, i18n]);
   const {
     data,
     errors,
@@ -12140,7 +12396,7 @@ function Address(props) {
     schema: requiredFields,
     defaultData: dataProp,
     formatters: addressFormatters,
-    rules: rules2,
+    rules: isStrictNameAndAddressValidationEnabled ? rulesV4 : rules2,
     fieldProblems: fieldValidationErrorsProp,
     obscuredFields: []
   });
@@ -14251,7 +14507,6 @@ function IdDocumentManualUploadComponent(props) {
         defaultData: idFrontPage,
         id: props.id,
         isOptional,
-        iconPrefix: getDocumentGuidancePrefix(data.idDocumentType, true, true),
         shouldValidate: props.shouldValidate
       })]
     }), data.idDocumentType && hasBack && jsx("div", {
@@ -14262,7 +14517,6 @@ function IdDocumentManualUploadComponent(props) {
         defaultData: idBackPage,
         id: props.id,
         isOptional,
-        iconPrefix: getDocumentGuidancePrefix(data.idDocumentType, true, false),
         shouldValidate: props.shouldValidate
       })
     })]
@@ -14320,7 +14574,7 @@ const useIdVerificationToken = ({
     loadingStatus
   };
 };
-const styles$1 = {
+const styles$2 = {
   "adyen-kyc-loading-input__form": "adyen-kyc-loading-input__form",
   "adyen-kyc-loading-input__form--loading-opacity0": "adyen-kyc-loading-input__form--loading-opacity0",
   "adyen-kyc-loading-input__form--loading-opacity0-1": "adyen-kyc-loading-input__form--loading-opacity0-1",
@@ -14348,12 +14602,12 @@ const LoaderWrapper = ({
   const digit = formOpacityStrArr[0];
   const decimal = formOpacityStrArr[1];
   const opacity = decimal ? `${digit}-${decimal}` : `${digit}`;
-  const wrapperClass = cx("adyen-kyc-loading-input__form", styles$1["adyen-kyc-loading-input__form"], {
-    [styles$1[`adyen-kyc-loading-input__form--loading-opacity${opacity}`]]: status === "loading"
+  const wrapperClass = cx("adyen-kyc-loading-input__form", styles$2["adyen-kyc-loading-input__form"], {
+    [styles$2[`adyen-kyc-loading-input__form--loading-opacity${opacity}`]]: status === "loading"
   });
   const loaderWrapperClass = cx({
-    [styles$1["adyen-kyc-loading-input__loader"]]: true,
-    [styles$1["adyen-kyc-loading-input__loader--active"]]: status === "loading" && showSpinner
+    [styles$2["adyen-kyc-loading-input__loader"]]: true,
+    [styles$2["adyen-kyc-loading-input__loader--active"]]: status === "loading" && showSpinner
   });
   const overlayClass = cx("adyen-kyc-loading-input", className);
   return jsxs("div", {
@@ -14422,7 +14676,7 @@ const initOnfido = async ({
     language: getOnfidoLocaleConfig(i18n)
   });
 };
-const logger$v = createLogger("IdVerificationComponent");
+const logger$w = createLogger("IdVerificationComponent");
 function IdVerificationComponent({
   userDetails,
   legalEntityId,
@@ -14454,7 +14708,7 @@ function IdVerificationComponent({
         onIdVerificationError,
         onIdVerificationComplete
       });
-    })().catch(logger$v.error);
+    })().catch(logger$w.error);
     return () => {
       if (onfidoSdk.current) onfidoSdk.current.tearDown();
     };
@@ -14504,7 +14758,7 @@ function IdDocumentAlreadyUpload(props) {
     })]
   });
 }
-const logger$u = createLogger("IdDocumentInstantVerificationComponent");
+const logger$v = createLogger("IdDocumentInstantVerificationComponent");
 const idVerificationSchema = ["instantIdVerificationData", "idDocumentType"];
 const documentTypeValidationRules = {
   instantIdVerificationData: {
@@ -14586,7 +14840,7 @@ function IdDocumentInstantVerificationComponent(props) {
         userDetails: props.userDetails,
         legalEntityId: props.legalEntityId,
         onIdVerificationComplete: handleIdVerificationComplete,
-        onIdVerificationError: logger$u.error
+        onIdVerificationError: logger$v.error
       }), jsxs("div", {
         className: "adyen-kyc-document-upload__manual-upload",
         children: [i18n.get("canNotCompleteInstantVerification"), " ", jsx("button", {
@@ -14614,116 +14868,56 @@ function IdDocumentUploadComponent(props) {
     ...props
   });
 }
-const layoutBreakpointClassnames = {
-  xsOnly: "adyen-layout-xs-only",
-  md: "adyen-layout-md",
-  lg: "adyen-layout-lg"
-};
-const layoutBreakpointSizes = {
-  md: 680,
-  lg: 1024
-};
-const getBreakpointClassNames = (containerSize) => {
-  const breakPoints = Object.entries(layoutBreakpointSizes);
-  const classes = breakPoints.reduce((acc, [bp, size]) => {
-    if (size <= containerSize) acc.push(layoutBreakpointClassnames[bp]);
-    return acc;
-  }, []);
-  return classes.length > 0 ? classes : ["adyen-layout-xs-only"];
-};
-function assignLayoutClasses(entries, container) {
-  let newClasses = [];
-  entries.forEach((entry) => {
-    var _a;
-    const parentWidth = (_a = entry.contentBoxSize) == null ? void 0 : _a[0].inlineSize;
-    if (parentWidth) {
-      newClasses = getBreakpointClassNames(parentWidth);
-    } else {
-      newClasses.push(layoutBreakpointClassnames.lg);
-    }
-    container.classList.remove(...Object.values(layoutBreakpointClassnames));
-    container.classList.add(...newClasses);
-  });
-}
-const AutoResizer = ({
-  children
-}) => {
-  const containerRef = useRef(null);
-  useEffect(() => {
-    const container = containerRef.current;
-    if (!container) return;
-    const resizeObserver = new ResizeObserver((entries) => assignLayoutClasses(entries, container));
-    resizeObserver.observe(container);
-    return () => resizeObserver.unobserve(container);
-  });
-  return jsx("div", {
-    ref: containerRef,
-    children
-  });
-};
-const makeIdVerificationMethodsMetadata = (svgPath) => ({
+const idVerificationMethodsMetadata = {
   instantVerification: {
     name: "instantVerification",
     description: "instantIDVerificationDescription",
-    iconComponentDesktop: `${svgPath}/instant-verification-desktop.svg`,
-    iconComponentMobile: `${svgPath}/instant-verification-mobile.svg`,
+    svgName: "id-verification-instant",
     provider: {
       name: "Onfido",
-      icon: `${svgPath}/provider-logo-onfido.svg`
+      svgName: `onfido-logo`
     }
   },
   manualVerification: {
     name: "manualUpload",
     description: "manualIDVerificationDescription",
-    iconComponentDesktop: `${svgPath}/manual-verification-desktop.svg`,
-    iconComponentMobile: `${svgPath}/manual-verification-mobile.svg`
+    svgName: "id-verification-manual"
   }
-});
+};
 const idVerificationMethods = ["instantVerification", "manualVerification"];
 const IdVerificationMethodOptionIcon = ({
-  method,
-  methodsMetadata
+  method
 }) => {
   const {
     i18n
   } = useI18nContext();
   const {
     description,
-    iconComponentDesktop,
-    iconComponentMobile
-  } = methodsMetadata[method];
+    svgName
+  } = idVerificationMethodsMetadata[method];
   return jsx("div", {
     className: "adyen-kyc-radio-group-card__illustration",
-    children: jsxs("picture", {
-      children: [jsx("source", {
-        type: "image/svg+xml",
-        media: `(min-width: ${layoutBreakpointSizes.md}px)`,
-        srcSet: methodsMetadata[method].iconComponentDesktop
-      }), jsx("source", {
-        type: "image/svg+xml",
-        media: `(max-width: ${layoutBreakpointSizes.md}px)`,
-        srcSet: iconComponentMobile
-      }), jsx("img", {
-        srcSet: iconComponentDesktop,
-        alt: i18n.get(description)
-      })]
+    children: jsx(Svg, {
+      type: "image",
+      name: svgName,
+      alt: i18n.get(description)
     })
   });
 };
 const IdVerificationMethodOptionFooter = ({
-  method,
-  methodsMetadata
+  method
 }) => {
   const {
     i18n
   } = useI18nContext();
   const {
     provider
-  } = methodsMetadata[method];
+  } = idVerificationMethodsMetadata[method];
   return provider ? jsxs("div", {
     className: "adyen-kyc-field-verification-methods__footer",
-    children: [i18n.get("poweredBy"), jsx("img", {
-      src: provider.icon,
+    children: [i18n.get("poweredBy"), jsx(Svg, {
+      type: "image",
+      name: provider.svgName,
       alt: provider.name
     })]
   }) : null;
@@ -14742,16 +14936,11 @@ function IdVerificationMethodComponent(props) {
   const {
     i18n
   } = useI18nContext();
-  const {
-    getImageUrl
-  } = useConfigurationApi();
   const verificationMethodFormId = id;
   const schema = idVerificationMethodFields;
   const stateRef = useRef({
     setState: null
   });
-  const svgPath = `${getImageUrl()}id-verification-method`;
-  const methodsMetadata = makeIdVerificationMethodsMetadata(svgPath);
   const {
     handleChangeFor,
     data,
@@ -14812,30 +15001,28 @@ function IdVerificationMethodComponent(props) {
           onSelect: handleChangeFor("idVerificationMethod"),
           selected: data.idVerificationMethod,
           optionId: (method) => method,
-          optionName: (method) => methodsMetadata[method].name,
-          optionDescription: (method) => methodsMetadata[method].description,
+          optionName: (method) => idVerificationMethodsMetadata[method].name,
+          optionDescription: (method) => idVerificationMethodsMetadata[method].description,
           className: "adyen-kyc-field-verification-methods",
           optionClassNames: () => ({
             label: "adyen-kyc-field-verification-methods__card adyen-kyc-radio-group-card--floating-radio"
           }),
           renderOptionIcon: (method) => jsx(IdVerificationMethodOptionIcon, {
-            method,
-            methodsMetadata
+            method
           }),
           renderOptionFooter: (method) => jsx(IdVerificationMethodOptionFooter, {
-            method,
-            methodsMetadata
+            method
           })
         })
       }), jsx(ContextGuidance, {
         page: "Instant verification with Onfido",
         title: i18n.get("howVerificationWithOnfidoWork"),
         content: jsxs(Fragment, {
-          children: [jsx("div", {
+          children: [jsx(Typography, {
             className: "adyen-kyc-u-margin-bottom-8",
             children: i18n.get("onfidoIsOurTrustedPartner")
           }), jsxs(List, {
-            className: "adyen-kyc-id-verification-method__guidance adyen-kyc-u-margin-bottom-8",
+            className: "adyen-kyc-id-verification-method__guidance",
             children: [jsx(ListItem, {
               children: i18n.get("usePhoneToScanId")
             }), jsx(ListItem, {
@@ -14843,7 +15030,7 @@ function IdVerificationMethodComponent(props) {
             }), jsx(ListItem, {
               children: i18n.get("theIdCheckWillBeAutomaticallyValidated")
             })]
-          }), jsx("div", {
+          }), jsx(Typography, {
             className: "adyen-kyc-u-margin-bottom-8",
             children: i18n.get("adyenKeepsDataAsLongAsLegallyRequired")
           }), jsx(Link, {
@@ -15078,7 +15265,7 @@ const phoneFormatters = {
 };
 const phoneFields = ["phoneNumber"];
 const DEFAULT_PHONE_PREFIX = "+1";
-const logger$t = createLogger("PhoneInput");
+const logger$u = createLogger("PhoneInput");
 const usePhonePrefixes = () => {
   const [phonePrefixes, setPhonePrefixes] = useState();
   useEffect(() => {
@@ -15086,7 +15273,7 @@ const usePhonePrefixes = () => {
       const loaded = (await import("./phonePrefixes-zV4hciyK.js")).default;
       setPhonePrefixes(loaded);
     };
-    loadPhonePrefixes().catch(logger$t.error);
+    loadPhonePrefixes().catch(logger$u.error);
   }, []);
   return phonePrefixes;
 };
@@ -15930,7 +16117,7 @@ const handleKeys = (keys, callback, propagationMode = "stopIfMatches") => (event
     callback();
   }
 };
-const styles = {
+const styles$1 = {
   "adyen-kyc-multi-select-list": "adyen-kyc-multi-select-list",
   "adyen-kyc-multi-select-list-item": "adyen-kyc-multi-select-list-item",
   "adyen-kyc-multi-select-list-item--with-description": "adyen-kyc-multi-select-list-item--with-description",
@@ -15942,7 +16129,7 @@ const MultiSelectList = ({
   onSelect,
   mapToSelectItem
 }) => jsx("ul", {
-  className: styles["adyen-kyc-multi-select-list"],
+  className: styles$1["adyen-kyc-multi-select-list"],
   children: options.map((option) => {
     const item = mapToSelectItem(option);
     const isSelected = selected.includes(option);
@@ -15956,8 +16143,8 @@ const MultiSelectList = ({
       onKeyDown: handleKeys(["Enter", " "], handleSelect),
       onSelect: handleSelect,
       isMulti: true,
-      className: cx([styles["adyen-kyc-multi-select-list-item"], {
-        [styles["adyen-kyc-multi-select-list-item--with-description"]]: !!item.description
+      className: cx([styles$1["adyen-kyc-multi-select-list-item"], {
+        [styles$1["adyen-kyc-multi-select-list-item--with-description"]]: !!item.description
       }])
     }, item.id);
   })
@@ -16088,27 +16275,27 @@ const nameValidationRulesV4 = {
     modes: ["blur"],
     validate: hasText,
     errorMessage: "fieldIsRequired"
-  }, {
-    modes: ["blur"],
-    validate: (input) => !matchesRegex(EMOJI_REGEX, input) && !hasRepeatedCharacters(input) && isValidInputLength(input) && !isInvalidName(input) && matchesRegex(ALLOWED_CHARS_REGEX, input),
-    errorMessage: "checkForTypos"
   }, {
     modes: ["blur"],
     validate: (input) => !matchesRegex(NO_ALPHABET_REGEX, input),
     errorMessage: "nameMustContainLetters"
+  }, {
+    modes: ["blur"],
+    validate: (input) => !matchesRegex(EMOJI_REGEX, input) && !hasRepeatedCharacters(input) && isValidMinLength(input, 2) && !isInvalidName(input) && matchesRegex(INDIVIDUAL_VALID_CHAR_REGEX, input),
+    errorMessage: "checkForTypos"
   }],
   lastName: [{
     modes: ["blur"],
     validate: hasText,
     errorMessage: "fieldIsRequired"
-  }, {
-    modes: ["blur"],
-    validate: (input) => !matchesRegex(EMOJI_REGEX, input) && !hasRepeatedCharacters(input) && isValidInputLength(input) && !isInvalidName(input) && matchesRegex(ALLOWED_CHARS_REGEX, input),
-    errorMessage: "checkForTypos"
   }, {
     modes: ["blur"],
     validate: (input) => !matchesRegex(NO_ALPHABET_REGEX, input),
     errorMessage: "nameMustContainLetters"
+  }, {
+    modes: ["blur"],
+    validate: (input) => !matchesRegex(EMOJI_REGEX, input) && !hasRepeatedCharacters(input) && isValidMinLength(input, 1) && !isInvalidName(input) && matchesRegex(INDIVIDUAL_VALID_CHAR_REGEX, input),
+    errorMessage: "checkForTypos"
   }]
 };
 const specialCharsRegEx = getFormattingRegEx(SPECIAL_CHARS.replace("-", ""));
@@ -16131,7 +16318,7 @@ function NameComponent(props) {
   const {
     isExperimentEnabled
   } = useExperimentsContext();
-  const isStrictNameAndAddressValidationEnabled = isExperimentEnabled(ExperimentNames.StrictNameAndAddressValidation);
+  const isStrictNameAndAddressValidationEnabled = isExperimentEnabled(ExperimentNames.HOStrictNameAndAddressValidationV4);
   const schema = props.requiredFields || ["firstName", "lastName"];
   const {
     handleChangeFor,
@@ -16386,10 +16573,8 @@ const DriversLicense$1 = ({
       page: "Personal details",
       title: i18n.get("whereCanIFindTheseNumbersOnMyDriversLicense"),
       content: jsxs(Fragment, {
-        children: [i18n.get("whereToFindNumbersOnDriversLicense"), " ", jsx("a", {
+        children: [i18n.get("whereToFindNumbersOnDriversLicense"), " ", jsx(Link, {
           href: "https://www.usi.gov.au/about/forms-id/drivers-licence",
-          target: "_blank",
-          rel: "noreferrer",
           children: i18n.get("iStillCantFindIt")
         })]
       }),
@@ -16693,10 +16878,8 @@ const DriversLicense = ({
       page: "Personal details",
       title: i18n.get("whereCanIFindTheseNumbersOnMyDriversLicense"),
       content: jsxs(Fragment, {
-        children: [i18n.get("whereToFindNumbersOnDriversLicense__NZ"), " ", jsx("a", {
+        children: [i18n.get("whereToFindNumbersOnDriversLicense__NZ"), " ", jsx(Link, {
           href: "https://www.nzta.govt.nz/driver-licences/getting-a-licence/your-driver-licence-explained/",
-          target: "_blank",
-          rel: "noreferrer",
           children: i18n.get("iStillCantFindIt")
         })]
       }),
@@ -17750,35 +17933,45 @@ function FilePicker({
       onDragLeave: handleDragLeave,
       children: [jsx("div", {
         className: "adyen-kyc-dropzone__icon",
-        children: jsx("svg", {
-          height: "100%",
-          width: "100%",
-          children: jsx("use", {
-            href: `#adyen-kyc-${iconPrefix}-icon`
-          })
+        children: jsx(Icon, {
+          name: "upload"
         })
       }), jsxs("div", {
         className: "adyen-kyc-dropzone__labels",
-        children: [jsxs("div", {
-          className: "adyen-kyc-dropzone__drag-text",
-          children: [jsxs("span", {
-            children: [i18n.get("dragYourFilesHereOr"), " "]
-          }), jsx("button", {
-            className: "adyen-kyc-dropzone__button",
-            type: "button",
-            onClick: openFilePicker,
-            children: i18n.get("browse")
-          })]
-        }), jsx("div", {
-          className: "adyen-kyc-dropzone__supports-text",
-          children: i18n.get("supports", {
+        children: [jsx(Typography, {
+          el: "h4",
+          variant: "body-strongest",
+          children: i18n.get("dropFileToUpload")
+        }), jsx(Typography, {
+          color: "secondary",
+          children: i18n.get("supportedFileTypes", {
+            values: {
+              fileTypes: allowedFileTypesString
+            }
+          })
+        }), jsx(Typography, {
+          color: "secondary",
+          children: i18n.get("maxFileSize", {
+            values: {
+              maxSize: bytesToSize(maxSize)
+            }
+          })
+        }), jsx(Typography, {
+          color: "secondary",
+          children: i18n.get("upToFiles", {
             values: {
-              fileTypes: allowedFileTypesString,
-              maxSize: bytesToSize(maxSize),
               maxFiles: maxNumberOfFiles
             }
           })
         })]
+      }), jsx("div", {
+        className: "adyen-kyc-dropzone__button",
+        children: jsx(Button, {
+          label: i18n.get("browseFiles"),
+          onClick: openFilePicker,
+          secondary: true,
+          small: true
+        })
       }), jsx("input", {
         className: "adyen-kyc-dropzone__input",
         ref: fileInput,
@@ -18134,7 +18327,6 @@ function BankDocument(props) {
             setFiles: handleChangeFor("bankStatementDocument"),
             isValid: valid.bankStatementDocument ?? isBankStatementOptional,
             errorMessage: (_a2 = errors.bankStatementDocument) == null ? void 0 : _a2.errorMessage,
-            iconPrefix: getDocumentGuidancePrefix(DocumentType.BANK_STATEMENT, true),
             ...bankStatementValidationOptions
           });
         }
@@ -18327,7 +18519,7 @@ class AdyenKycSdkError extends Error {
 }
 let sdkToken;
 let fetchSdkToken;
-const logger$s = createLogger("Session");
+const logger$t = createLogger("Session");
 const setSdkToken = (token) => {
   sdkToken = token;
 };
@@ -18350,7 +18542,7 @@ const refreshSession = async () => {
     setSdkToken(token);
     isSessionRefreshed = true;
   } catch (e) {
-    logger$s.error("Failed to fetch sdk token", e);
+    logger$t.error("Failed to fetch sdk token", e);
   }
   return isSessionRefreshed;
 };
@@ -18360,7 +18552,7 @@ const addAnimationStartListener = (element, listener) => {
 const removeAnimationStartListener = (element, listener) => {
   element.removeEventListener("animationstart", listener, false);
 };
-const logger$r = createLogger("Fetch");
+const logger$s = createLogger("Fetch");
 const getRequestObject = (options, data) => {
   const {
     headers = [],
@@ -18407,10 +18599,10 @@ const logFetchError = (message, level) => {
     case "info":
     case "warn":
     case "error":
-      logger$r[level](message);
+      logger$s[level](message);
       break;
     default:
-      logger$r.error(message);
+      logger$s.error(message);
   }
 };
 const handleFetchResponse = async (response, responseType) => {
@@ -18501,7 +18693,7 @@ const RELEVANT_MESSAGE_TYPES = ["account_verification_report_id", "error"];
 const TERMINAL_DATA_PROPS = ["accounts", "error", "reference"];
 const MOUNT_TIMEOUT = 10 * 1e3;
 const TINK_VENDOR = "Tink";
-const logger$q = createLogger("iframeWidget");
+const logger$r = createLogger("iframeWidget");
 const isObjectData = (data) => typeof data === "object" && !Array.isArray(data) && data !== null;
 const isTerminalMessageData = (data) => isObjectData(data) && Object.entries(data).some(([prop]) => TERMINAL_DATA_PROPS.includes(prop));
 const parseMessageJson = (message) => {
@@ -18519,7 +18711,7 @@ const callbackErrorHandler = async (response) => {
   try {
     await response;
   } catch (ex) {
-    logger$q.error(ex);
+    logger$r.error(ex);
   }
   return {
     error: "UNKNOWN_ERROR",
@@ -18622,7 +18814,7 @@ class IFrameWidget {
             message = responseData.errorMessage;
           }
         } catch (ex) {
-          logger$q.error(ex);
+          logger$r.error(ex);
         }
         throw new AdyenKycSdkError(reason, jsonData.error);
       }
@@ -18809,7 +19001,7 @@ function BankVerificationWidget({
     ref: widgetContainerRef
   });
 }
-const logger$p = createLogger("BankVerification");
+const logger$q = createLogger("BankVerification");
 const accountVerificationFields = ["verifiedAccountHolder", "verifiedBankCountry", "verifiedBankName", "verifiedCurrencyCode", "verifiedBankAccountNumber"];
 const InstantVerificationErrorContext = createContext(null);
 const useInstantVerificationErrorNotification = (notificationVisibilityDuration) => {
@@ -18841,7 +19033,7 @@ const usePreferredVendorForCountry = (country, getBankVerificationVendors) => {
       const vendor = vendors[0];
       setPreferredVendor(vendor.name ? vendor : void 0);
     };
-    getPreferredVendor().catch(logger$p.error);
+    getPreferredVendor().catch(logger$q.error);
   }, [country, getBankVerificationVendors]);
   return preferredVendor;
 };
@@ -20082,24 +20274,22 @@ const regions = {
   apac: [CountryCodes.NewZealand, CountryCodes.Australia]
 };
 const getAllowedBankCountries = (country) => Object.values(regions).find((countriesInARegion) => countriesInARegion.includes(country)) ?? [country];
-const makePayoutVerificationMethodsMetadata = (svgPath, instantVerificationProvider) => ({
+const makePayoutVerificationMethodsMetadata = (instantVerificationProvider) => ({
   instantVerification: {
     name: "verifyViaMobileBankingAppOrWebsite",
     subtitle: "instant",
     description: "instantVerificationDescription",
-    iconComponentDesktop: `${svgPath}/instant-verification-desktop.svg`,
-    iconComponentMobile: `${svgPath}/instant-verification-mobile.svg`,
+    svgName: "payout-verification-instant",
     provider: instantVerificationProvider ? {
       name: instantVerificationProvider,
-      icon: `${svgPath}/provider-logo-${instantVerificationProvider}.svg`
+      svgName: `${instantVerificationProvider}-logo`
     } : void 0
   },
   manualVerification: {
     name: "uploadABankStatement",
     subtitle: "mayTakeAFewDays",
     description: "manualVerificationDescription",
-    iconComponentDesktop: `${svgPath}/manual-verification-desktop.svg`,
-    iconComponentMobile: `${svgPath}/manual-verification-mobile.svg`
+    svgName: "payout-verification-manual"
   }
 });
 const payoutVerificationMethods = ["instantVerification", "manualVerification"];
@@ -20187,24 +20377,14 @@ const PayoutVerificationMethodOptionIcon = ({
   } = useI18nContext();
   const {
     description,
-    iconComponentDesktop,
-    iconComponentMobile
+    svgName
   } = methodsMetadata[method];
   return jsx("div", {
     className: "adyen-kyc-radio-group-card__illustration",
-    children: jsxs("picture", {
-      children: [jsx("source", {
-        type: "image/svg+xml",
-        media: `(min-width: ${layoutBreakpointSizes.md}px)`,
-        srcSet: iconComponentDesktop
-      }), jsx("source", {
-        type: "image/svg+xml",
-        media: `(max-width: ${layoutBreakpointSizes.md}px)`,
-        srcSet: iconComponentMobile
-      }), jsx("img", {
-        srcSet: iconComponentDesktop,
-        alt: i18n.get(description)
-      })]
+    children: jsx(Svg, {
+      type: "image",
+      name: svgName,
+      alt: i18n.get(description)
     })
   });
 };
@@ -20220,9 +20400,9 @@ const PayoutVerificationMethodOptionFooter = ({
   } = methodsMetadata[method];
   return provider ? jsxs("div", {
     className: "adyen-kyc-field-verification-methods__footer",
-    children: [i18n.get("poweredBy"), jsx("img", {
-      className: "adyen-kyc-field-verification-methods__icon",
-      src: provider.icon,
+    children: [i18n.get("poweredBy"), jsx(Svg, {
+      type: "image",
+      name: provider.svgName,
       alt: provider.name
     })]
   }) : null;
@@ -20263,9 +20443,6 @@ function PayoutVerificationMethod(props) {
   const {
     i18n
   } = useI18nContext();
-  const {
-    getImageUrl
-  } = useConfigurationApi();
   const instantVerificationError = useContext(InstantVerificationErrorContext);
   const {
     isSettingEnabled
@@ -20305,8 +20482,7 @@ function PayoutVerificationMethod(props) {
   }), [data, errors, fieldProblems, valid]);
   const providerName = getInstantVerificationProvider(props.bankVerificationVendors, data.bankCountry);
   const instantVerificationAvailable = Boolean(props.instantVerificationAllowed && providerName && providerName !== "loading");
-  const svgPath = `${getImageUrl()}payout-verification-method`;
-  const methodsMetadata = makePayoutVerificationMethodsMetadata(svgPath, providerName === "loading" ? void 0 : providerName);
+  const methodsMetadata = makePayoutVerificationMethodsMetadata(providerName === "loading" ? void 0 : providerName);
   useEffect(() => {
     if (!hasSelectedMethod && instantVerificationAvailable && data.payoutVerificationMethod !== "instantVerification") {
       handleChangeFor("payoutVerificationMethod")("instantVerification");
@@ -20418,31 +20594,29 @@ function PayoutVerificationMethod(props) {
         }
       }),
       content: jsxs(Fragment, {
-        children: [jsxs("p", {
-          children: [" ", i18n.get("isOurTrustedPartnerHelpingSpeedUpSetup", {
+        children: [jsx(Typography, {
+          children: i18n.get("isOurTrustedPartnerHelpingSpeedUpSetup", {
             values: {
               provider: getProviderDisplayName(providerName)
             }
-          }), " "]
-        }), jsxs("ul", {
-          className: "adyen-kyc-guidance-list",
-          children: [jsx("li", {
-            className: "adyen-kyc-guidance-list__item",
+          })
+        }), jsxs(List, {
+          children: [jsx(ListItem, {
             children: i18n.get("selectTheBankToReceivePayouts")
-          }), jsx("li", {
-            className: "adyen-kyc-guidance-list__item",
+          }), jsx(ListItem, {
             children: i18n.get("loginIntoYourBankingEnvironment")
-          }), jsx("li", {
-            className: "adyen-kyc-guidance-list__item",
+          }), jsx(ListItem, {
             children: i18n.get("yourBankWillConfirmYourAccountDetails")
           })]
-        }), jsx("p", {
+        }), jsx(Typography, {
           children: i18n.get("adyenWillOnlyGetTemporaryAccess")
         }), jsx(Link, {
-          className: "adyen-kyc-guidance-external-link",
           href: "https://www.adyen.com/policies-and-disclaimer/privacy-policy",
           external: true,
-          children: i18n.get("learnMore")
+          children: jsx(Typography, {
+            variant: "caption",
+            children: i18n.get("learnMore")
+          })
         })]
       })
     }) : void 0]
@@ -20515,7 +20689,7 @@ function PayoutDetailsComponent(props) {
     data: propData
   } = props;
   const [instantVerificationError, setInstantVerificationError] = useInstantVerificationErrorNotification(1e4);
-  const verificationMethodFormProps = getFormProps(props, payoutSteps.payoutVerificationMethod.formId);
+  const verificationMethodFormProps = getFormProps(props, PayoutVerificationMethodFormID);
   const accountVerificationFormProps = getFormProps(props, PayoutAccountVerificationFormID);
   const payoutAccountFormProps = getFormProps(props, payoutSteps.payoutAccountDetails(taskType, isExperimentEnabled("EnableNewEntryFlow")).formId);
   const bankDocumentFormProps = getFormProps(props, PayoutAccountDocumentsFormID);
@@ -21406,6 +21580,36 @@ const trustRegistrationDetailsValidations = {
     errorMessage: "fieldIsRequired"
   }
 };
+const trustRegistrationDetailsValidationsV4 = {
+  trustType: {
+    modes: ["blur"],
+    validate: (trustType) => !!trustType,
+    errorMessage: "fieldIsRequired"
+  },
+  country: {
+    modes: ["blur"],
+    validate: (country) => !!country,
+    errorMessage: "fieldIsRequired"
+  },
+  legalName: [{
+    modes: ["blur"],
+    validate: hasText,
+    errorMessage: "fieldIsRequired"
+  }, {
+    modes: ["blur"],
+    validate: (input) => !matchesRegex(NO_ALPHABET_REGEX, input),
+    errorMessage: "nameMustContainLetters"
+  }, {
+    modes: ["blur"],
+    validate: (input) => !matchesRegex(EMOJI_REGEX, input) && !hasRepeatedCharacters(input) && isValidMinLength(input, 3) && !isInvalidName(input) && matchesRegex(OTHER_ENTITIES_VALID_CHAR_REGEX, input),
+    errorMessage: "checkForTypos"
+  }],
+  objectOfTrust: {
+    modes: ["blur"],
+    validate: (objectOfTrust) => !!objectOfTrust,
+    errorMessage: "fieldIsRequired"
+  }
+};
 const trustRegistrationDetailsFields = ["legalName", "country", "trustType", "objectOfTrust", "taxId", "registrationNumber"];
 const ALLOWED_TRUST_COUNTRIES = [CountryCodes.Australia, CountryCodes.NewZealand];
 function TrustRegistrationDetailsComponent(props) {
@@ -21416,6 +21620,10 @@ function TrustRegistrationDetailsComponent(props) {
   const {
     i18n
   } = useI18nContext();
+  const {
+    isExperimentEnabled
+  } = useExperimentsContext();
+  const isStrictNameAndAddressValidationEnabled = isExperimentEnabled(ExperimentNames.HOStrictNameAndAddressValidationV4);
   const TRUST_REGISTRATION_DETAILS = props.id || trustForms.trustRegistrationDetails.formId;
   const stateRef = useRef({
     setState: null
@@ -21437,7 +21645,7 @@ function TrustRegistrationDetailsComponent(props) {
       ...props.data,
       country
     },
-    rules: props.validators || trustRegistrationDetailsValidations,
+    rules: props.validators || (isStrictNameAndAddressValidationEnabled ? trustRegistrationDetailsValidationsV4 : trustRegistrationDetailsValidations),
     fieldProblems: props == null ? void 0 : props.fieldValidationErrors
   });
   const formUtils = formUtilities(props, i18n);
@@ -22481,8 +22689,9 @@ const useFormComposer = ({
   const isFormSummaryStep = (form) => form.formId === summaryStep.formId;
   const [hasAlreadyNavigatedForm, setHasAlreadyNavigatedForm] = useState(false);
   const getFormIndex = (formId) => forms2.findIndex((form) => form.formId === formId);
-  const isFinalStep = getFormIndex(activeForm.formId) === forms2.length - 1;
-  const isFirstStep = getFormIndex(activeForm.formId) === 0;
+  const currentStep = getFormIndex(activeForm.formId);
+  const isFinalStep = currentStep === forms2.length - 1;
+  const isFirstStep = currentStep === 0;
   const [hideHomeButton, setHideHomeButton] = useState(false);
   const [hideBackButton, setHideBackButton] = useState(false);
   useHideButton(isFirstStep, setHideBackButton);
@@ -22585,7 +22794,8 @@ const useFormComposer = ({
     gotoFormByFormIndex,
     activeForm,
     shouldValidate,
-    setShouldValidate
+    setShouldValidate,
+    currentStep
   };
 };
 const obscuredPayoutFields = ["bankAccountNumber", "iban"];
@@ -22648,7 +22858,7 @@ const useUnifyLoadingStatus = (setParentLoadingStatus, ...childLoadingStatuses)
     setParentLoadingStatus(loadingStatus);
   }, [...childLoadingStatuses]);
 };
-const logger$o = createLogger("useScenarioConfiguration");
+const logger$p = createLogger("useScenarioConfiguration");
 const useScenarioConfiguration = ({
   getConfigurationData,
   getPayoutAccountFormatData,
@@ -22674,12 +22884,12 @@ const useScenarioConfiguration = ({
         const response = await getConfigurationData();
         setConfigurationResponse(response);
       } catch (err) {
-        logger$o.warn("WARNING: Configuration request failed - error:", err);
+        logger$p.warn("WARNING: Configuration request failed - error:", err);
       } finally {
         setConfigurationLoadingStatus("success");
       }
     };
-    makeConfigCallAndSave().catch(logger$o.error);
+    makeConfigCallAndSave().catch(logger$p.error);
   }, [getConfigurationData, setConfigurationLoadingStatus]);
   useEffect(() => {
     if (!getPayoutAccountFormatData) return;
@@ -22696,12 +22906,12 @@ const useScenarioConfiguration = ({
         const defaultAccountFormat = defaultPayoutAccountFormat[country] ?? allowedBankAccountFormats[0];
         setAccountFormat(existingBankAccountFormat ?? defaultAccountFormat);
       } catch (err) {
-        logger$o.warn("WARNING: Payout format request failed - error:", err);
+        logger$p.warn("WARNING: Payout format request failed - error:", err);
       } finally {
         setpayoutFormatLoadingStatus("success");
       }
     };
-    makePayoutFormatCallAndSave().catch(logger$o.error);
+    makePayoutFormatCallAndSave().catch(logger$p.error);
   }, [country, setAccountFormat, getPayoutAccountFormatData, setpayoutFormatLoadingStatus, existingBankAccountFormat]);
   const {
     fieldConfigurations,
@@ -22910,7 +23120,6 @@ const taxInformationBase = {
   vatAbsenceReason: {
     rule: "countryUsesVat"
   },
-  // it still needs support from the BE: https://youtrack.is.adyen.com/issue/UO-2290
   taxInformation: {
     rule: "countryUsesTaxId"
   },
@@ -23457,10 +23666,8 @@ function VerifiedBusinessCard({
             }), jsx(Typography, {
               children: jsxs("div", {
                 className: "adyen-kyc-verified-business-card__address",
-                children: [address, jsx("a", {
+                children: [address, addressLink && jsx(Link, {
                   href: addressLink,
-                  target: "_blank",
-                  rel: "noreferrer",
                   children: i18n.get("showOnMap")
                 })]
               })
@@ -23479,7 +23686,7 @@ function VerifiedBusinessCard({
   });
 }
 const ADDITIONAL_INFORMATION_FORM_ID = "additionalInformation";
-const additionalInformationFields = [...LEGAL_COMPANY_NAME_FIELD, ...DBA_NAME_FIELD, ...BUSINESS_REGISTRATION_NUMBER_FIELD, ...TAX_INFORMATION_FIELD, ...VAT_NUMBER_FIELD, ...DATE_OF_INCORPORATION_FIELD, ...STOCK_EXCHANGE_MIC_FIELD, ...STOCK_ISIN_FIELD, ...STOCK_TICKER_SYMBOL_FIELD, "legalFormDescription"];
+const ADDITIONAL_INFORMATION_FIELDS = [...LEGAL_COMPANY_NAME_FIELD, ...DBA_NAME_FIELD, ...BUSINESS_REGISTRATION_NUMBER_FIELD, ...TAX_INFORMATION_FIELD, ...VAT_NUMBER_FIELD, ...DATE_OF_INCORPORATION_FIELD, ...STOCK_EXCHANGE_MIC_FIELD, ...STOCK_ISIN_FIELD, ...STOCK_TICKER_SYMBOL_FIELD, "legalFormDescription"];
 function AdditionalInformationComponent({
   data,
   labels: labels2,
@@ -23630,10 +23837,12 @@ function AdditionalInformationComponent({
   }, [formSchema, formData, formErrors, formFieldProblems, formValid, updateStateSlice]);
   useEffect(() => {
     if (verifiedBusiness && verifiedBusiness.name !== formData.legalCompanyName) return handleChangeFor("legalCompanyName")(verifiedBusiness.name);
+  }, [formData.legalCompanyName, verifiedBusiness, showCompanyStructure]);
+  useEffect(() => {
     if (!verifiedBusiness && !showCompanyStructure) {
       return resetToDefaultData();
     }
-  }, [formData.legalCompanyName, verifiedBusiness, showCompanyStructure]);
+  }, [verifiedBusiness]);
   const showField = (fieldKeys) => fieldKeys.some((field) => {
     switch (field) {
       case "legalCompanyName": {
@@ -23644,6 +23853,8 @@ function AdditionalInformationComponent({
     }
   });
   return jsxs("form", {
+    id: ADDITIONAL_INFORMATION_FORM_ID,
+    className: "adyen-kyc-additional-information",
     children: [jsx(FormHeader, {
       heading,
       description
@@ -23652,167 +23863,164 @@ function AdditionalInformationComponent({
       verificationErrors: formVerificationErrors,
       validationErrors: fieldValidationErrors,
       formUtils
-    }), jsxs("div", {
-      className: "adyen-kyc-additional-information",
-      children: [showVerified && jsx(VerifiedBusinessCard, {
-        verifiedBusiness
-      }), jsxs("section", {
-        children: [showVerified && jsx(Typography, {
-          el: "h3",
-          children: i18n.get("otherBusinessInformation")
-        }), showField(LEGAL_COMPANY_NAME_FIELD) && jsx("div", {
-          className: "adyen-kyc-field-wrapper",
-          children: jsx(LegalCompanyNameField, {
-            data: formUtils.getFieldData(formData, LEGAL_COMPANY_NAME_FIELD),
-            valid: formUtils.getFieldValid(formValid, LEGAL_COMPANY_NAME_FIELD),
-            errors: formUtils.getFieldErrors(formErrors, formFieldProblems, LEGAL_COMPANY_NAME_FIELD),
-            labels: formUtils.getFieldLabels(LEGAL_COMPANY_NAME_FIELD),
-            helperText: formUtils.getFieldHelperText(LEGAL_COMPANY_NAME_FIELD, {
-              legalCompanyName: "legalCompanyName__helperText"
-            }),
-            readonly: formUtils.isReadOnly("legalCompanyName"),
-            handleChangeFor
-          })
-        }), showField(DBA_NAME_FIELD) && jsx("div", {
-          className: "adyen-kyc-field-wrapper",
-          children: jsx(DBANameField, {
-            data: formUtils.getFieldData(formData, DBA_NAME_FIELD),
-            valid: formUtils.getFieldValid(formValid, DBA_NAME_FIELD),
-            errors: formUtils.getFieldErrors(formErrors, formFieldProblems, DBA_NAME_FIELD),
-            labels: formUtils.getFieldLabels(DBA_NAME_FIELD, {
-              hasDba: "hasDba"
-            }),
-            readonly: formUtils.isReadOnly("dbaName"),
-            handleChangeFor,
-            setErrors
-          })
-        }), showField(BUSINESS_REGISTRATION_NUMBER_FIELD) && jsx("div", {
-          className: "adyen-kyc-field-wrapper",
-          children: jsx(BusinessRegistrationNumberField, {
-            data: formUtils.getFieldData(formData, BUSINESS_REGISTRATION_NUMBER_FIELD),
-            valid: formUtils.getFieldValid(formValid, BUSINESS_REGISTRATION_NUMBER_FIELD),
-            errors: formUtils.getFieldErrors(formErrors, formFieldProblems, BUSINESS_REGISTRATION_NUMBER_FIELD),
-            labels: formUtils.getFieldLabels(BUSINESS_REGISTRATION_NUMBER_FIELD, {
-              exemptedFromRegistrationNumber: "iDontHaveARegistrationNumber"
-            }),
-            mask: formUtils.getMask("registrationNumber"),
-            guidanceText: formUtils.getFieldGuidanceText(BUSINESS_REGISTRATION_NUMBER_FIELD),
-            placeholders: formUtils.getFieldPlaceholders(BUSINESS_REGISTRATION_NUMBER_FIELD),
-            helperText: formUtils.getFieldHelperText(BUSINESS_REGISTRATION_NUMBER_FIELD),
-            readonly: formUtils.isReadOnly("registrationNumber"),
-            optional: formUtils.isOptionalField("registrationNumber"),
-            shouldValidate,
-            handleChangeFor,
-            country,
-            canExempt: formUtils.isRequiredField("exemptedFromRegistrationNumber"),
-            companyType,
-            registrationNumberOptions,
-            registrationNumberType,
-            setRegistrationNumberType
-          })
-        }), showField(TAX_INFORMATION_FIELD) && jsx("div", {
-          className: "adyen-kyc-field-wrapper",
-          children: jsx(TaxInformationField, {
-            data: formUtils.getFieldData(formData, TAX_INFORMATION_FIELD),
-            valid: formUtils.getFieldValid(formValid, TAX_INFORMATION_FIELD),
-            errors: formUtils.getFieldErrors(formErrors, formFieldProblems, TAX_INFORMATION_FIELD),
-            labels: formUtils.getFieldLabels(TAX_INFORMATION_FIELD, {
-              exemptedFromTax: "iDontHaveATaxId"
-            }),
-            mask: formUtils.getMask("taxInformation"),
-            helperText: formUtils.getFieldHelperText(TAX_INFORMATION_FIELD),
-            guidanceText: formUtils.getFieldGuidanceText(TAX_INFORMATION_FIELD),
-            readonly: formUtils.isReadOnly("taxInformation"),
-            shouldValidate,
-            handleChangeFor,
-            canExempt: formUtils.isRequiredField("exemptedFromTax"),
-            isUen: formUtils.isRequiredField("isUen"),
-            country,
-            companyType,
-            taxIdNumberType,
-            setTaxIdNumberType,
-            defaultData: data == null ? void 0 : data.taxInformation
-          })
-        }), showField(VAT_NUMBER_FIELD) && jsx("div", {
-          className: "adyen-kyc-field-wrapper",
-          children: jsx(VatNumberField, {
-            data: formUtils.getFieldData(formData, VAT_NUMBER_FIELD),
-            valid: formUtils.getFieldValid(formValid, VAT_NUMBER_FIELD),
-            errors: formUtils.getFieldErrors(formErrors, formFieldProblems, VAT_NUMBER_FIELD),
-            labels: formUtils.getFieldLabels(VAT_NUMBER_FIELD, {
-              exemptedFromVat: "iDontHaveAVatNumber"
-            }),
-            mask: formUtils.getMask("vatNumber"),
-            guidanceText: formUtils.getFieldGuidanceText(VAT_NUMBER_FIELD),
-            placeholders: formUtils.getFieldPlaceholders(VAT_NUMBER_FIELD),
-            readonly: formUtils.isReadOnly("vatNumber"),
-            handleChangeFor,
-            country,
-            canExempt: formUtils.isRequiredField("exemptedFromVat"),
-            vatNumberType,
-            setVatNumberType
-          })
-        }), showField(DATE_OF_INCORPORATION_FIELD) && jsx("div", {
-          className: "adyen-kyc-field-wrapper",
-          children: jsx(DateOfIncorporationField, {
-            data: formUtils.getFieldData(formData, DATE_OF_INCORPORATION_FIELD),
-            valid: formUtils.getFieldValid(formValid, DATE_OF_INCORPORATION_FIELD),
-            errors: formUtils.getFieldErrors(formErrors, formFieldProblems, DATE_OF_INCORPORATION_FIELD),
-            labels: formUtils.getFieldLabels(DATE_OF_INCORPORATION_FIELD),
-            placeholders: formUtils.getFieldPlaceholders(DATE_OF_INCORPORATION_FIELD, {
-              dateOfIncorporation: "datePlaceholder"
-            }),
-            readonly: formUtils.isReadOnly("dateOfIncorporation"),
-            handleChangeFor
-          })
-        })]
-      }), showStockData && jsxs("section", {
-        children: [jsx(Typography, {
-          el: "h3",
-          children: i18n.get("stockExchangeInformation")
-        }), showField(STOCK_EXCHANGE_MIC_FIELD) && jsx("div", {
-          className: "adyen-kyc-field-wrapper",
-          children: jsx(StockExchangeMICField, {
-            data: formUtils.getFieldData(formData, STOCK_EXCHANGE_MIC_FIELD),
-            valid: formUtils.getFieldValid(formValid, STOCK_EXCHANGE_MIC_FIELD),
-            errors: formUtils.getFieldErrors(formErrors, formFieldProblems, STOCK_EXCHANGE_MIC_FIELD),
-            labels: formUtils.getFieldLabels(STOCK_EXCHANGE_MIC_FIELD),
-            placeholders: formUtils.getFieldPlaceholders(STOCK_EXCHANGE_MIC_FIELD),
-            mask: formUtils.getMask("stockExchangeMIC"),
-            guidanceText: formUtils.getFieldGuidanceText(STOCK_EXCHANGE_MIC_FIELD),
-            readonly: formUtils.isReadOnly("stockExchangeMIC"),
-            shouldValidate,
-            handleChangeFor
-          })
-        }), showField(STOCK_ISIN_FIELD) && jsx("div", {
-          className: "adyen-kyc-field-wrapper",
-          children: jsx(StockISINField, {
-            data: formUtils.getFieldData(formData, STOCK_ISIN_FIELD),
-            valid: formUtils.getFieldValid(formValid, STOCK_ISIN_FIELD),
-            errors: formUtils.getFieldErrors(formErrors, formFieldProblems, STOCK_ISIN_FIELD),
-            labels: formUtils.getFieldLabels(STOCK_ISIN_FIELD),
-            placeholders: formUtils.getFieldPlaceholders(STOCK_ISIN_FIELD),
-            mask: formUtils.getMask("stockISIN"),
-            guidanceText: formUtils.getFieldGuidanceText(STOCK_ISIN_FIELD),
-            readonly: formUtils.isReadOnly("stockISIN"),
-            shouldValidate,
-            handleChangeFor
-          })
-        }), showField(STOCK_TICKER_SYMBOL_FIELD) && jsx("div", {
-          className: "adyen-kyc-field-wrapper",
-          children: jsx(StockTickerSymbolField, {
-            data: formUtils.getFieldData(formData, STOCK_TICKER_SYMBOL_FIELD),
-            valid: formUtils.getFieldValid(formValid, STOCK_TICKER_SYMBOL_FIELD),
-            errors: formUtils.getFieldErrors(formErrors, formFieldProblems, STOCK_TICKER_SYMBOL_FIELD),
-            labels: formUtils.getFieldLabels(STOCK_TICKER_SYMBOL_FIELD),
-            placeholders: formUtils.getFieldPlaceholders(STOCK_TICKER_SYMBOL_FIELD),
-            mask: formUtils.getMask("stockTickerSymbol"),
-            guidanceText: formUtils.getFieldGuidanceText(STOCK_TICKER_SYMBOL_FIELD),
-            readonly: formUtils.isReadOnly("stockTickerSymbol"),
-            shouldValidate,
-            handleChangeFor
-          })
-        })]
+    }), showVerified && jsx(VerifiedBusinessCard, {
+      verifiedBusiness
+    }), jsxs("fieldset", {
+      children: [showVerified && jsx(Typography, {
+        el: "h3",
+        children: i18n.get("otherBusinessInformation")
+      }), showField(LEGAL_COMPANY_NAME_FIELD) && jsx("div", {
+        className: "adyen-kyc-field-wrapper",
+        children: jsx(LegalCompanyNameField, {
+          data: formUtils.getFieldData(formData, LEGAL_COMPANY_NAME_FIELD),
+          valid: formUtils.getFieldValid(formValid, LEGAL_COMPANY_NAME_FIELD),
+          errors: formUtils.getFieldErrors(formErrors, formFieldProblems, LEGAL_COMPANY_NAME_FIELD),
+          labels: formUtils.getFieldLabels(LEGAL_COMPANY_NAME_FIELD),
+          helperText: formUtils.getFieldHelperText(LEGAL_COMPANY_NAME_FIELD, {
+            legalCompanyName: "legalCompanyName__helperText"
+          }),
+          readonly: formUtils.isReadOnly("legalCompanyName"),
+          handleChangeFor
+        })
+      }), showField(DBA_NAME_FIELD) && jsx("div", {
+        className: "adyen-kyc-field-wrapper",
+        children: jsx(DBANameField, {
+          data: formUtils.getFieldData(formData, DBA_NAME_FIELD),
+          valid: formUtils.getFieldValid(formValid, DBA_NAME_FIELD),
+          errors: formUtils.getFieldErrors(formErrors, formFieldProblems, DBA_NAME_FIELD),
+          labels: formUtils.getFieldLabels(DBA_NAME_FIELD, {
+            hasDba: "hasDba"
+          }),
+          readonly: formUtils.isReadOnly("dbaName"),
+          handleChangeFor,
+          setErrors
+        })
+      }), showField(BUSINESS_REGISTRATION_NUMBER_FIELD) && jsx("div", {
+        className: "adyen-kyc-field-wrapper",
+        children: jsx(BusinessRegistrationNumberField, {
+          data: formUtils.getFieldData(formData, BUSINESS_REGISTRATION_NUMBER_FIELD),
+          valid: formUtils.getFieldValid(formValid, BUSINESS_REGISTRATION_NUMBER_FIELD),
+          errors: formUtils.getFieldErrors(formErrors, formFieldProblems, BUSINESS_REGISTRATION_NUMBER_FIELD),
+          labels: formUtils.getFieldLabels(BUSINESS_REGISTRATION_NUMBER_FIELD, {
+            exemptedFromRegistrationNumber: "iDontHaveARegistrationNumber"
+          }),
+          mask: formUtils.getMask("registrationNumber"),
+          guidanceText: formUtils.getFieldGuidanceText(BUSINESS_REGISTRATION_NUMBER_FIELD),
+          placeholders: formUtils.getFieldPlaceholders(BUSINESS_REGISTRATION_NUMBER_FIELD),
+          helperText: formUtils.getFieldHelperText(BUSINESS_REGISTRATION_NUMBER_FIELD),
+          readonly: formUtils.isReadOnly("registrationNumber"),
+          optional: formUtils.isOptionalField("registrationNumber"),
+          shouldValidate,
+          handleChangeFor,
+          country,
+          canExempt: formUtils.isRequiredField("exemptedFromRegistrationNumber"),
+          companyType,
+          registrationNumberOptions,
+          registrationNumberType,
+          setRegistrationNumberType
+        })
+      }), showField(TAX_INFORMATION_FIELD) && jsx("div", {
+        className: "adyen-kyc-field-wrapper",
+        children: jsx(TaxInformationField, {
+          data: formUtils.getFieldData(formData, TAX_INFORMATION_FIELD),
+          valid: formUtils.getFieldValid(formValid, TAX_INFORMATION_FIELD),
+          errors: formUtils.getFieldErrors(formErrors, formFieldProblems, TAX_INFORMATION_FIELD),
+          labels: formUtils.getFieldLabels(TAX_INFORMATION_FIELD, {
+            exemptedFromTax: "iDontHaveATaxId"
+          }),
+          mask: formUtils.getMask("taxInformation"),
+          helperText: formUtils.getFieldHelperText(TAX_INFORMATION_FIELD),
+          guidanceText: formUtils.getFieldGuidanceText(TAX_INFORMATION_FIELD),
+          readonly: formUtils.isReadOnly("taxInformation"),
+          shouldValidate,
+          handleChangeFor,
+          canExempt: formUtils.isRequiredField("exemptedFromTax"),
+          isUen: formUtils.isRequiredField("isUen"),
+          country,
+          companyType,
+          taxIdNumberType,
+          setTaxIdNumberType,
+          defaultData: data == null ? void 0 : data.taxInformation
+        })
+      }), showField(VAT_NUMBER_FIELD) && jsx("div", {
+        className: "adyen-kyc-field-wrapper",
+        children: jsx(VatNumberField, {
+          data: formUtils.getFieldData(formData, VAT_NUMBER_FIELD),
+          valid: formUtils.getFieldValid(formValid, VAT_NUMBER_FIELD),
+          errors: formUtils.getFieldErrors(formErrors, formFieldProblems, VAT_NUMBER_FIELD),
+          labels: formUtils.getFieldLabels(VAT_NUMBER_FIELD, {
+            exemptedFromVat: "iDontHaveAVatNumber"
+          }),
+          mask: formUtils.getMask("vatNumber"),
+          guidanceText: formUtils.getFieldGuidanceText(VAT_NUMBER_FIELD),
+          placeholders: formUtils.getFieldPlaceholders(VAT_NUMBER_FIELD),
+          readonly: formUtils.isReadOnly("vatNumber"),
+          handleChangeFor,
+          country,
+          canExempt: formUtils.isRequiredField("exemptedFromVat"),
+          vatNumberType,
+          setVatNumberType
+        })
+      }), showField(DATE_OF_INCORPORATION_FIELD) && jsx("div", {
+        className: "adyen-kyc-field-wrapper",
+        children: jsx(DateOfIncorporationField, {
+          data: formUtils.getFieldData(formData, DATE_OF_INCORPORATION_FIELD),
+          valid: formUtils.getFieldValid(formValid, DATE_OF_INCORPORATION_FIELD),
+          errors: formUtils.getFieldErrors(formErrors, formFieldProblems, DATE_OF_INCORPORATION_FIELD),
+          labels: formUtils.getFieldLabels(DATE_OF_INCORPORATION_FIELD),
+          placeholders: formUtils.getFieldPlaceholders(DATE_OF_INCORPORATION_FIELD, {
+            dateOfIncorporation: "datePlaceholder"
+          }),
+          readonly: formUtils.isReadOnly("dateOfIncorporation"),
+          handleChangeFor
+        })
+      })]
+    }), showStockData && jsxs("fieldset", {
+      children: [jsx(Typography, {
+        el: "h3",
+        children: i18n.get("stockExchangeInformation")
+      }), showField(STOCK_EXCHANGE_MIC_FIELD) && jsx("div", {
+        className: "adyen-kyc-field-wrapper",
+        children: jsx(StockExchangeMICField, {
+          data: formUtils.getFieldData(formData, STOCK_EXCHANGE_MIC_FIELD),
+          valid: formUtils.getFieldValid(formValid, STOCK_EXCHANGE_MIC_FIELD),
+          errors: formUtils.getFieldErrors(formErrors, formFieldProblems, STOCK_EXCHANGE_MIC_FIELD),
+          labels: formUtils.getFieldLabels(STOCK_EXCHANGE_MIC_FIELD),
+          placeholders: formUtils.getFieldPlaceholders(STOCK_EXCHANGE_MIC_FIELD),
+          mask: formUtils.getMask("stockExchangeMIC"),
+          guidanceText: formUtils.getFieldGuidanceText(STOCK_EXCHANGE_MIC_FIELD),
+          readonly: formUtils.isReadOnly("stockExchangeMIC"),
+          shouldValidate,
+          handleChangeFor
+        })
+      }), showField(STOCK_ISIN_FIELD) && jsx("div", {
+        className: "adyen-kyc-field-wrapper",
+        children: jsx(StockISINField, {
+          data: formUtils.getFieldData(formData, STOCK_ISIN_FIELD),
+          valid: formUtils.getFieldValid(formValid, STOCK_ISIN_FIELD),
+          errors: formUtils.getFieldErrors(formErrors, formFieldProblems, STOCK_ISIN_FIELD),
+          labels: formUtils.getFieldLabels(STOCK_ISIN_FIELD),
+          placeholders: formUtils.getFieldPlaceholders(STOCK_ISIN_FIELD),
+          mask: formUtils.getMask("stockISIN"),
+          guidanceText: formUtils.getFieldGuidanceText(STOCK_ISIN_FIELD),
+          readonly: formUtils.isReadOnly("stockISIN"),
+          shouldValidate,
+          handleChangeFor
+        })
+      }), showField(STOCK_TICKER_SYMBOL_FIELD) && jsx("div", {
+        className: "adyen-kyc-field-wrapper",
+        children: jsx(StockTickerSymbolField, {
+          data: formUtils.getFieldData(formData, STOCK_TICKER_SYMBOL_FIELD),
+          valid: formUtils.getFieldValid(formValid, STOCK_TICKER_SYMBOL_FIELD),
+          errors: formUtils.getFieldErrors(formErrors, formFieldProblems, STOCK_TICKER_SYMBOL_FIELD),
+          labels: formUtils.getFieldLabels(STOCK_TICKER_SYMBOL_FIELD),
+          placeholders: formUtils.getFieldPlaceholders(STOCK_TICKER_SYMBOL_FIELD),
+          mask: formUtils.getMask("stockTickerSymbol"),
+          guidanceText: formUtils.getFieldGuidanceText(STOCK_TICKER_SYMBOL_FIELD),
+          readonly: formUtils.isReadOnly("stockTickerSymbol"),
+          shouldValidate,
+          handleChangeFor
+        })
       })]
     })]
   });
@@ -23891,7 +24099,7 @@ const defaultFieldConfig = {
   })
 };
 const BASIC_INFORMATION_FORM_ID = "basicInformation";
-const basicInformationFields = [...COUNTRY_FIELD, ...BUSINESS_NAME_FIELD, ...TAX_INFORMATION_FIELD, ...STATE_FIELD, ...BUSINESS_REGISTRATION_NUMBER_FIELD];
+const BASIC_INFORMATION_FIELDS = [...COUNTRY_FIELD, ...BUSINESS_NAME_FIELD, ...TAX_INFORMATION_FIELD, ...STATE_FIELD, ...BUSINESS_REGISTRATION_NUMBER_FIELD];
 function BasicInformationComponent({
   data,
   labels: labels2,
@@ -23912,9 +24120,9 @@ function BasicInformationComponent({
   country,
   companyType = CompanyTypesValue.PRIVATE_COMPANY,
   isTopLevelEntity,
-  isBusinessSelection,
   setVerifiedBusiness,
-  searchName
+  searchName,
+  className
 }) {
   var _a, _b, _c, _d, _e;
   const {
@@ -23929,6 +24137,14 @@ function BasicInformationComponent({
   } = useSettingsContext();
   const allowedCountries = useAllowedCountries();
   const isAllowedEditPrefilledCountry = isSettingEnabled(SettingNames.AllowPrefilledCountryEdit);
+  const formDescription = jsxs("div", {
+    className: "adyen-kyc-form-header__description",
+    children: [description, " ", jsx(Link, {
+      href: "https://www.adyen.com/privacy-policy",
+      external: true,
+      children: i18n.get("basicInformationFormDescriptionLink")
+    })]
+  });
   const initialFormUtilsProps = useMemo(() => ({
     labels: labels2,
     placeholders,
@@ -23966,16 +24182,16 @@ function BasicInformationComponent({
           return mergeFieldMetadataIntoProps(field, resolveFieldMetadata(defaultFieldConfig[country], {
             isBusiness: true
           }, defaultFieldMetadata), acc);
+        case "taxInformation":
+          return mergeFieldMetadataIntoProps(field, resolveFieldMetadata(defaultFieldConfig$6[country], {
+            taxIdNumberType
+          }, defaultFieldMetadata$6), acc);
         case "registrationNumber":
           return mergeFieldMetadataIntoProps(field, resolveFieldMetadata(defaultFieldConfig$9[country], {
             companyType,
             registrationNumberType,
             state: sliceData == null ? void 0 : sliceData.stateOrProvince
           }, defaultFieldMetadata$9), acc);
-        case "taxInformation":
-          return mergeFieldMetadataIntoProps(field, resolveFieldMetadata(defaultFieldConfig$6[country], {
-            taxIdNumberType
-          }, defaultFieldMetadata$6), acc);
         default:
           return acc;
       }
@@ -24013,106 +24229,105 @@ function BasicInformationComponent({
       setVerifiedBusiness(void 0);
     }
   }, [formData.businessName, searchName, setVerifiedBusiness]);
+  const classNames = cx("adyen-kyc-basic-information", className);
   return jsxs("form", {
-    className: isBusinessSelection ? "adyen-kyc-hide-form" : void 0,
+    id: BASIC_INFORMATION_FORM_ID,
+    className: classNames,
     children: [jsx(FormHeader, {
       heading,
-      description
+      descriptionComponent: formDescription
     }), jsx(ErrorPanel, {
       id: "ariaErrorField",
       verificationErrors: formVerificationErrors,
       validationErrors: fieldValidationErrors,
       formUtils
-    }), jsxs("div", {
-      className: "adyen-kyc-basic-information",
-      children: [jsx("fieldset", {
-        children: jsx("div", {
-          className: "adyen-kyc-field-wrapper",
-          children: jsx(CountryField, {
-            data: formUtils.getFieldData(formData, COUNTRY_FIELD),
-            valid: formUtils.getFieldValid(formValid, COUNTRY_FIELD),
-            errors: formUtils.getFieldErrors(formErrors, formFieldProblems, COUNTRY_FIELD),
-            labels: formUtils.getFieldLabels(COUNTRY_FIELD, {
-              country: "countryRegionOfEstablishment"
-            }),
-            readonly: formUtils.isReadOnly("country") || !isAllowedEditPrefilledCountry,
-            handleChangeFor,
-            allowedCountries: isTopLevelEntity ? allowedCountries : void 0
-          })
+    }), jsx("fieldset", {
+      children: jsx("div", {
+        className: "adyen-kyc-field-wrapper",
+        children: jsx(CountryField, {
+          data: formUtils.getFieldData(formData, COUNTRY_FIELD),
+          valid: formUtils.getFieldValid(formValid, COUNTRY_FIELD),
+          errors: formUtils.getFieldErrors(formErrors, formFieldProblems, COUNTRY_FIELD),
+          labels: formUtils.getFieldLabels(COUNTRY_FIELD, {
+            country: "countryRegionOfEstablishment"
+          }),
+          readonly: formUtils.isReadOnly("country") || !isAllowedEditPrefilledCountry,
+          handleChangeFor,
+          allowedCountries: isTopLevelEntity ? allowedCountries : void 0
+        })
+      })
+    }), COUNTRIES_USING_COMPANY_SEARCH.includes(formData.country ?? country) && jsxs("fieldset", {
+      children: [formUtils.isRequiredField("businessName") && jsx("div", {
+        className: "adyen-kyc-field-wrapper",
+        children: jsx(BusinessNameField, {
+          data: formUtils.getFieldData(formData, BUSINESS_NAME_FIELD),
+          valid: formUtils.getFieldValid(formValid, BUSINESS_NAME_FIELD),
+          errors: formUtils.getFieldErrors(formErrors, formFieldProblems, BUSINESS_NAME_FIELD),
+          labels: formUtils.getFieldLabels(BUSINESS_NAME_FIELD),
+          readonly: formUtils.isReadOnly("businessName"),
+          handleChangeFor
+        })
+      }), formUtils.isRequiredField("taxInformation") && jsx("div", {
+        className: "adyen-kyc-field-wrapper",
+        children: jsx(TaxInformationField, {
+          data: formUtils.getFieldData(formData, TAX_INFORMATION_FIELD),
+          valid: formUtils.getFieldValid(formValid, TAX_INFORMATION_FIELD),
+          errors: formUtils.getFieldErrors(formErrors, formFieldProblems, TAX_INFORMATION_FIELD),
+          labels: formUtils.getFieldLabels(TAX_INFORMATION_FIELD, {
+            exemptedFromTax: "iDontHaveATaxId"
+          }),
+          mask: formUtils.getMask("taxInformation"),
+          helperText: formUtils.getFieldHelperText(TAX_INFORMATION_FIELD),
+          placeholders: formUtils.getFieldPlaceholders(TAX_INFORMATION_FIELD),
+          guidanceText: formUtils.getFieldGuidanceText(TAX_INFORMATION_FIELD),
+          readonly: formUtils.isReadOnly("taxInformation"),
+          shouldValidate,
+          handleChangeFor,
+          canExempt: formUtils.isRequiredField("exemptedFromTax"),
+          registrationNumber: formData.registrationNumber,
+          isUen: formUtils.isRequiredField("isUen"),
+          country: formData.country ?? country,
+          companyType,
+          taxIdNumberType,
+          setTaxIdNumberType,
+          defaultData: data == null ? void 0 : data.taxInformation
+        })
+      }), formUtils.isRequiredField("stateOrProvince") && jsx("div", {
+        className: "adyen-kyc-field-wrapper",
+        children: jsx(StateField, {
+          data: formUtils.getFieldData(formData, STATE_FIELD),
+          valid: formUtils.getFieldValid(formValid, STATE_FIELD),
+          errors: formUtils.getFieldErrors(formErrors, formFieldProblems, STATE_FIELD),
+          labels: formUtils.getFieldLabels(STATE_FIELD),
+          placeholders: formUtils.getFieldPlaceholders(STATE_FIELD),
+          readonly: formUtils.isReadOnly("stateOrProvince"),
+          handleChangeFor,
+          selectedCountry: formData.country
+        })
+      }), (formUtils.isRequiredField("registrationNumber") || formUtils.isOptionalField("registrationNumber")) && jsx("div", {
+        className: "adyen-kyc-field-wrapper",
+        children: jsx(BusinessRegistrationNumberField, {
+          data: formUtils.getFieldData(formData, BUSINESS_REGISTRATION_NUMBER_FIELD),
+          valid: formUtils.getFieldValid(formValid, BUSINESS_REGISTRATION_NUMBER_FIELD),
+          errors: formUtils.getFieldErrors(formErrors, formFieldProblems, BUSINESS_REGISTRATION_NUMBER_FIELD),
+          labels: formUtils.getFieldLabels(BUSINESS_REGISTRATION_NUMBER_FIELD, {
+            exemptedFromRegistrationNumber: "iDontHaveARegistrationNumber"
+          }),
+          mask: formUtils.getMask("registrationNumber"),
+          guidanceText: formUtils.getFieldGuidanceText(BUSINESS_REGISTRATION_NUMBER_FIELD),
+          placeholders: formUtils.getFieldPlaceholders(BUSINESS_REGISTRATION_NUMBER_FIELD),
+          helperText: formUtils.getFieldHelperText(BUSINESS_REGISTRATION_NUMBER_FIELD),
+          readonly: formUtils.isReadOnly("registrationNumber"),
+          optional: formUtils.isOptionalField("registrationNumber"),
+          shouldValidate,
+          handleChangeFor,
+          country: formData.country ?? country,
+          canExempt: formUtils.isRequiredField("exemptedFromRegistrationNumber"),
+          companyType,
+          registrationNumberOptions,
+          registrationNumberType,
+          setRegistrationNumberType
         })
-      }), COUNTRIES_USING_COMPANY_SEARCH.includes(formData.country ?? country) && jsxs("fieldset", {
-        children: [formUtils.isRequiredField("businessName") && jsx("div", {
-          className: "adyen-kyc-field-wrapper",
-          children: jsx(BusinessNameField, {
-            data: formUtils.getFieldData(formData, BUSINESS_NAME_FIELD),
-            valid: formUtils.getFieldValid(formValid, BUSINESS_NAME_FIELD),
-            errors: formUtils.getFieldErrors(formErrors, formFieldProblems, BUSINESS_NAME_FIELD),
-            labels: formUtils.getFieldLabels(BUSINESS_NAME_FIELD),
-            readonly: formUtils.isReadOnly("businessName"),
-            handleChangeFor
-          })
-        }), formUtils.isRequiredField("taxInformation") && jsx("div", {
-          className: "adyen-kyc-field-wrapper",
-          children: jsx(TaxInformationField, {
-            data: formUtils.getFieldData(formData, TAX_INFORMATION_FIELD),
-            valid: formUtils.getFieldValid(formValid, TAX_INFORMATION_FIELD),
-            errors: formUtils.getFieldErrors(formErrors, formFieldProblems, TAX_INFORMATION_FIELD),
-            labels: formUtils.getFieldLabels(TAX_INFORMATION_FIELD, {
-              exemptedFromTax: "iDontHaveATaxId"
-            }),
-            mask: formUtils.getMask("taxInformation"),
-            helperText: formUtils.getFieldHelperText(TAX_INFORMATION_FIELD),
-            placeholders: formUtils.getFieldPlaceholders(TAX_INFORMATION_FIELD),
-            guidanceText: formUtils.getFieldGuidanceText(TAX_INFORMATION_FIELD),
-            readonly: formUtils.isReadOnly("taxInformation"),
-            shouldValidate,
-            handleChangeFor,
-            canExempt: formUtils.isRequiredField("exemptedFromTax"),
-            registrationNumber: formData.registrationNumber,
-            isUen: formUtils.isRequiredField("isUen"),
-            country: formData.country ?? country,
-            companyType,
-            taxIdNumberType,
-            setTaxIdNumberType,
-            defaultData: data == null ? void 0 : data.taxInformation
-          })
-        }), formUtils.isRequiredField("stateOrProvince") && jsx("div", {
-          className: "adyen-kyc-field-wrapper",
-          children: jsx(StateField, {
-            data: formUtils.getFieldData(formData, STATE_FIELD),
-            valid: formUtils.getFieldValid(formValid, STATE_FIELD),
-            errors: formUtils.getFieldErrors(formErrors, formFieldProblems, STATE_FIELD),
-            labels: formUtils.getFieldLabels(STATE_FIELD),
-            placeholders: formUtils.getFieldPlaceholders(STATE_FIELD),
-            readonly: formUtils.isReadOnly("stateOrProvince"),
-            handleChangeFor,
-            selectedCountry: formData.country
-          })
-        }), (formUtils.isRequiredField("registrationNumber") || formUtils.isOptionalField("registrationNumber")) && jsx("div", {
-          className: "adyen-kyc-field-wrapper",
-          children: jsx(BusinessRegistrationNumberField, {
-            data: formUtils.getFieldData(formData, BUSINESS_REGISTRATION_NUMBER_FIELD),
-            valid: formUtils.getFieldValid(formValid, BUSINESS_REGISTRATION_NUMBER_FIELD),
-            errors: formUtils.getFieldErrors(formErrors, formFieldProblems, BUSINESS_REGISTRATION_NUMBER_FIELD),
-            labels: formUtils.getFieldLabels(BUSINESS_REGISTRATION_NUMBER_FIELD, {
-              exemptedFromRegistrationNumber: "iDontHaveARegistrationNumber"
-            }),
-            mask: formUtils.getMask("registrationNumber"),
-            guidanceText: formUtils.getFieldGuidanceText(BUSINESS_REGISTRATION_NUMBER_FIELD),
-            placeholders: formUtils.getFieldPlaceholders(BUSINESS_REGISTRATION_NUMBER_FIELD),
-            helperText: formUtils.getFieldHelperText(BUSINESS_REGISTRATION_NUMBER_FIELD),
-            readonly: formUtils.isReadOnly("registrationNumber"),
-            optional: formUtils.isOptionalField("registrationNumber"),
-            shouldValidate,
-            handleChangeFor,
-            country: formData.country ?? country,
-            canExempt: formUtils.isRequiredField("exemptedFromRegistrationNumber"),
-            companyType,
-            registrationNumberOptions,
-            registrationNumberType,
-            setRegistrationNumberType
-          })
-        })]
       })]
     })]
   });
@@ -24437,7 +24652,8 @@ const getForms = (country) => ({
     formId: "basicInformation",
     formName: "basicInformationFormName",
     formHeading: "basicInformationFormHeading",
-    fields: COUNTRIES_USING_COMPANY_SEARCH.includes(country) ? basicInformationFields : basicInformationFields.filter((field) => !FIELDS_NEEDED_FOR_COMPANY_SEARCH.includes(field))
+    formDescription: "basicInformationFormDescription",
+    fields: COUNTRIES_USING_COMPANY_SEARCH.includes(country) ? BASIC_INFORMATION_FIELDS : BASIC_INFORMATION_FIELDS.filter((field) => !FIELDS_NEEDED_FOR_COMPANY_SEARCH.includes(field))
   },
   companyStructure: {
     formId: "companyStructure",
@@ -24450,8 +24666,7 @@ const getForms = (country) => ({
     formId: "additionalInformation",
     formName: "additionalInformationFormName",
     formHeading: "additionalInformationFormHeading",
-    formDescription: "additionalInformationFormDescription",
-    fields: COUNTRIES_USING_COMPANY_SEARCH.includes(country) ? additionalInformationFields.filter((field) => !FIELDS_NEEDED_FOR_COMPANY_SEARCH.includes(field)) : additionalInformationFields
+    fields: COUNTRIES_USING_COMPANY_SEARCH.includes(country) ? ADDITIONAL_INFORMATION_FIELDS.filter((field) => !FIELDS_NEEDED_FOR_COMPANY_SEARCH.includes(field)) : ADDITIONAL_INFORMATION_FIELDS
   },
   companyRegistrationAddress: {
     formId: "companyRegistrationAddress",
@@ -24600,7 +24815,7 @@ var CompanySearchEvents = /* @__PURE__ */ ((CompanySearchEvents2) => {
   CompanySearchEvents2["SELECTION_ERROR"] = "CompanySearch_CompanySelectionError";
   return CompanySearchEvents2;
 })(CompanySearchEvents || {});
-const logger$n = createLogger("useCompanySearch");
+const logger$o = createLogger("useCompanySearch");
 const LOW_RISK_COMPANY_DATA_COMPLIANCE_WINDOW = 1577664e5;
 function useCompanySearch({
   defaultData,
@@ -24724,7 +24939,7 @@ function useCompanySearch({
         state: companyData.state ?? stateOrProvince
       });
     } catch (e) {
-      logger$n.error(e);
+      logger$o.error(e);
       setError(e);
       setStatus("error");
     } finally {
@@ -24757,7 +24972,7 @@ function useCompanySearch({
         indexSearch: handleCompanyIndexSearch,
         deepSearch: handleCompanyDeepSearch,
         resultsLimit: limit
-      })) == null ? void 0 : _a.catch((e) => logger$n.error(e));
+      })) == null ? void 0 : _a.catch((e) => logger$o.error(e));
     }
   }, [legalCompanyName, country, stateOrProvince, taxIdentificationNumber, verifiedCompany, searchCompanies, handleCompanyIndexSearch, handleCompanyDeepSearch, limit, canVerify, baseTrackingPayload]);
   useEffect(() => {
@@ -24864,38 +25079,47 @@ function BusinessInformation({
   const {
     i18n
   } = useI18nContext();
-  const businessInformationClass = cx("adyen-kyc-business-information", {
-    "adyen-kyc-business-information--loading": fetching
+  const businessInformationClasses = cx("adyen-kyc-business-information", {
+    "adyen-kyc-business-information--fetching": fetching
   });
+  if (fetching) {
+    return jsx("div", {
+      className: businessInformationClasses,
+      children: jsx(Loader, {
+        size: "large"
+      })
+    });
+  }
   return jsx("div", {
-    className: businessInformationClass,
-    children: fetching ? jsx(Loader, {
-      size: "large"
-    }) : jsxs("ul", {
+    className: businessInformationClasses,
+    children: jsxs("ul", {
       className: "adyen-kyc-business-information__business-data",
-      children: [(selectedBusiness == null ? void 0 : selectedBusiness.legalForm) && jsxs("li", {
+      children: [!!(selectedBusiness == null ? void 0 : selectedBusiness.legalForm) && jsxs("li", {
+        name: "legalForm",
         children: [jsx(Typography, {
           className: "adyen-kyc-business-data__key",
           color: "secondary",
           children: i18n.get("legalForm")
         }), jsx(Typography, {
-          children: selectedBusiness == null ? void 0 : selectedBusiness.legalForm
+          children: selectedBusiness.legalForm
         })]
-      }), jsxs("li", {
+      }), !!(selectedBusiness == null ? void 0 : selectedBusiness.name) && jsxs("li", {
+        name: "name",
         children: [jsx(Typography, {
           className: "adyen-kyc-business-data__key",
           color: "secondary",
           children: i18n.get("legalCompanyName__US")
         }), jsx(Typography, {
-          children: selectedBusiness == null ? void 0 : selectedBusiness.name
+          children: selectedBusiness.name
         })]
-      }), (selectedBusiness == null ? void 0 : selectedBusiness.address) && jsxs("li", {
+      }), !!(selectedBusiness == null ? void 0 : selectedBusiness.address) && jsxs("li", {
+        name: "address",
         children: [jsx(Typography, {
           className: "adyen-kyc-business-data__key",
           color: "secondary",
           children: i18n.get("address")
         }), jsx(Typography, {
-          children: selectedBusiness == null ? void 0 : selectedBusiness.address
+          children: selectedBusiness.address
         })]
       })]
     })
@@ -24933,7 +25157,7 @@ function BusinessInformationCard({
     children: selectedBusinessId === result.id && jsxs(Fragment, {
       children: [jsx(Divider, {}), invalidTin && jsx(Alert, {
         variant: "warning",
-        type: "dismissible",
+        type: "callToAction",
         title: i18n.get("businessSelection__invalidTin"),
         actions: jsx(Button, {
           label: "Go back",
@@ -24944,7 +25168,7 @@ function BusinessInformationCard({
         testId: "invalidTin"
       }), failedToLoad && jsx(Alert, {
         variant: "info",
-        type: "dismissible",
+        type: "callToAction",
         title: i18n.get("businessSelection__failedToLoad"),
         actions: jsx(Button, {
           label: "Try again",
@@ -24960,7 +25184,7 @@ function BusinessInformationCard({
     })
   });
 }
-const logger$m = createLogger("BusinessSelection");
+const logger$n = createLogger("BusinessSelection");
 function BusinessSelectionComponent({
   country,
   state,
@@ -25027,7 +25251,7 @@ function BusinessSelectionComponent({
       setCurrentBusinessSelection(businessData);
     } catch (e) {
       setFailedToLoad(true);
-      logger$m.error(e);
+      logger$n.error(e);
     } finally {
       setFetching(false);
     }
@@ -25049,7 +25273,7 @@ function BusinessSelectionComponent({
         setInvalidTin(true);
       }
     } catch (e) {
-      logger$m.error(e);
+      logger$n.error(e);
     } finally {
       setIsLoading(false);
     }
@@ -25082,7 +25306,7 @@ function BusinessSelectionComponent({
         }
       }
     } catch (e) {
-      logger$m.error(e);
+      logger$n.error(e);
     } finally {
       setIsLoading(false);
     }
@@ -25092,23 +25316,26 @@ function BusinessSelectionComponent({
       setIsLoading(true);
       await (handleClearCompanyData == null ? void 0 : handleClearCompanyData());
     } catch (e) {
-      logger$m.error(e);
+      logger$n.error(e);
     } finally {
       setShowCompanyStructure(true);
       setIsLoading(false);
     }
   }, [handleClearCompanyData, setIsLoading, setShowCompanyStructure]);
-  return jsxs("div", {
-    className: "adyen-kyc-business-selection",
-    children: [isLoading && jsxs("div", {
-      className: "adyen-kyc-business-selection__loader",
-      children: [jsx(Loader, {
+  const businessSelectionClasses = cx("adyen-kyc-business-selection", {
+    "adyen-kyc-business-selection--loading": isLoading
+  });
+  if (isLoading) {
+    return jsx("div", {
+      className: businessSelectionClasses,
+      children: jsx(Loader, {
         size: "large"
-      }), jsx(Typography, {
-        el: "span",
-        children: !currentBusinessSelection && (!searchResults || shouldSearch) ? i18n.get("businessSelection__searching") : i18n.get("businessSelection__verifying")
-      })]
-    }), !isLoading && searchResults && jsxs(Fragment, {
+      })
+    });
+  }
+  return jsx("div", {
+    className: businessSelectionClasses,
+    children: searchResults && jsxs(Fragment, {
       children: [jsx(FormHeader, {
         heading: i18n.get("businessSelection__heading")
       }), jsxs(CardGroup, {
@@ -25135,7 +25362,7 @@ function BusinessSelectionComponent({
           })]
         })]
       })]
-    })]
+    })
   });
 }
 function BusinessDetailsComponent(props) {
@@ -25230,6 +25457,7 @@ function BusinessDetailsComponent(props) {
         handleClearCompanyData
       }), jsx(BasicInformationComponent, {
         ...getFormProps(props, forms2.basicInformation.formId),
+        className: isBusinessSelection ? "adyen-kyc-basic-information--hide" : "",
         id: forms2.basicInformation.formId,
         heading: i18n.get((activeForm == null ? void 0 : activeForm.formHeading) ?? forms2.basicInformation.formHeading),
         description: (activeForm == null ? void 0 : activeForm.formDescription) ? i18n.get(activeForm == null ? void 0 : activeForm.formDescription) : void 0,
@@ -25237,7 +25465,6 @@ function BusinessDetailsComponent(props) {
         companyType: companyStructure == null ? void 0 : companyStructure.entityType,
         isTopLevelEntity,
         baseTrackingPayload,
-        isBusinessSelection,
         setVerifiedBusiness,
         searchName
       })]
@@ -25258,7 +25485,6 @@ function BusinessDetailsComponent(props) {
         ...getFormProps(props, forms2.additionalInformation.formId),
         id: forms2.additionalInformation.formId,
         heading: i18n.get((activeForm == null ? void 0 : activeForm.formHeading) ?? forms2.additionalInformation.formHeading),
-        description: i18n.get((activeForm == null ? void 0 : activeForm.formDescription) ?? forms2.additionalInformation.formDescription),
         country,
         companyType: companyStructure == null ? void 0 : companyStructure.entityType,
         verifiedBusiness,
@@ -25503,7 +25729,7 @@ const ExpiredBanner = () => {
     children: i18n.get("startANewSessionFromTheSamePlaceYouOriginallyAccessed")
   });
 };
-const Modal = ({
+const Modal$1 = ({
   content,
   footer,
   header,
@@ -25635,7 +25861,7 @@ const ExpiryModal = ({
     leftoverSeconds
   } = getDurationInMinutesAndSeconds(secondsUntilExpiry);
   const hasExpired = secondsUntilExpiry <= 0;
-  return jsx(Modal, {
+  return jsx(Modal$1, {
     size: "small",
     header: i18n.get("sessionTimeout"),
     content: hasExpired ? i18n.get("toProtectYourInformationThisSessionHasExpired") : i18n.get({
@@ -25708,7 +25934,7 @@ const useExpiryThreshold = (expiry) => {
   };
 };
 const ExpiryContext = createContext(false);
-const logger$l = createLogger("ExpiryProvider");
+const logger$m = createLogger("ExpiryProvider");
 const ExpiryProvider = ({
   expiry: initialExpiry,
   eventEmitter,
@@ -25742,7 +25968,7 @@ const ExpiryProvider = ({
           refreshExpiry().then((newExpiry) => {
             setExpiry(newExpiry);
             setModalDismissed(false);
-          }).catch(logger$l.error);
+          }).catch(logger$m.error);
         }
       }), children]
     });
@@ -25762,7 +25988,7 @@ const ExpiryProvider = ({
   });
 };
 const useHasExpired = () => useContext(ExpiryContext);
-const logger$k = createLogger("FormRouterContextProvider");
+const logger$l = createLogger("FormRouterContextProvider");
 function FormRouterContextProvider({
   children,
   forms: forms2,
@@ -25782,7 +26008,7 @@ function FormRouterContextProvider({
       if (formIndex > -1) {
         setFormIndex(formIndex);
       } else {
-        logger$k.error("No form was found to have that field so form navigation failed.");
+        logger$l.error("No form was found to have that field so form navigation failed.");
       }
     }
   }), [forms2, handleGetIdVerificationToken, setFormIndex]);
@@ -25791,25 +26017,151 @@ function FormRouterContextProvider({
     children
   });
 }
-const DropinLayout = (props) => {
-  const {
-    content,
-    footer
-  } = props;
-  return jsxs("div", {
-    className: "adyen-kyc-dropin",
-    children: [jsx("div", {
-      className: "adyen-kyc-dropin__content",
+const shouldHighlight = (active, current, fillBefore) => !fillBefore ? active === current : active >= current;
+const StepProgressIndicator = ({
+  activeStepIndex,
+  stepsCount,
+  fillBefore,
+  thick
+}) => stepsCount > 0 ? jsx("div", {
+  "aria-label": `Step ${activeStepIndex + 1} of ${stepsCount}`,
+  className: "adyen-kyc-progress",
+  role: "group",
+  children: jsx("ol", {
+    className: cx("adyen-kyc-progress__bar", {
+      "adyen-kyc-progress__bar--thick": thick
+    }),
+    children: range(stepsCount).map((stepNumber) => {
+      const isHighlighted = shouldHighlight(activeStepIndex, stepNumber, fillBefore);
+      return jsx("li", {
+        "aria-current": isHighlighted ? "step" : void 0,
+        className: cx("adyen-kyc-progress__step", {
+          "adyen-kyc-progress__step--active": isHighlighted
+        }),
+        children: jsx("span", {
+          className: "adyen-kyc-progress__step-label",
+          children: `Step ${stepNumber + 1}: ${stepNumber < activeStepIndex ? "completed" : "not completed"}`
+        })
+      }, stepNumber);
+    })
+  })
+}) : null;
+const Modal = ({
+  title,
+  children,
+  footer,
+  fullscreen = false,
+  onBack,
+  onClose
+}) => {
+  const modalRef = useRef(null);
+  useLayoutEffect(() => {
+    const modalElement = modalRef.current;
+    if (!modalElement) return;
+    modalElement.showModal();
+    modalElement.focus();
+    modalElement.blur();
+    return () => modalElement.close();
+  }, []);
+  return jsx("dialog", {
+    ref: modalRef,
+    className: cx("adyen-kyc-modal2", {
+      "adyen-kyc-modal2__fullscreen": fullscreen
+    }),
+    onClose,
+    children: jsxs("div", {
+      className: "adyen-kyc-modal2-wrapper",
+      children: [title && jsx("header", {
+        children: jsx(Typography, {
+          el: "h2",
+          variant: "title-l",
+          children: title
+        })
+      }), jsx("section", {
+        className: "adyen-kyc-modal2-content",
+        children
+      }), jsx("div", {
+        children: footer && jsx("footer", {
+          className: "adyen-kyc-modal2-footer",
+          children: footer
+        })
+      }), jsxs("section", {
+        className: "adyen-kyc-modal2-top-bar",
+        children: [onBack ? jsx(Button, {
+          tertiary: true,
+          "aria-label": "back",
+          icon: "arrow-left",
+          onClick: onBack,
+          shaded: true
+        }) : jsx("div", {}), jsx(Button, {
+          tertiary: true,
+          "aria-label": "close",
+          icon: "cross",
+          onClick: onClose,
+          shaded: true
+        })]
+      })]
+    })
+  });
+};
+const DropinLayout = ({
+  content,
+  footer,
+  showAsModal,
+  onBack,
+  onClose
+}) => {
+  const [modalOpen, setModalOpen] = useState(true);
+  const handleClose = () => {
+    setModalOpen(false);
+    onClose == null ? void 0 : onClose();
+  };
+  if (!showAsModal) {
+    return jsxs("div", {
+      className: "adyen-kyc-dropin",
+      children: [jsx("div", {
+        className: "adyen-kyc-dropin__content",
+        children: jsx("div", {
+          className: "adyen-kyc-dropin__content-main",
+          children: content
+        })
+      }), footer && jsx("div", {
+        className: "adyen-kyc-dropin__footer-container",
+        children: footer
+      })]
+    });
+  }
+  if (modalOpen) {
+    return jsx(Modal, {
+      footer,
+      onClose: handleClose,
+      onBack,
       children: jsx("div", {
-        className: "adyen-kyc-dropin__content-main",
-        children: content
+        className: "adyen-kyc-dropin",
+        children: jsx("div", {
+          className: "adyen-kyc-dropin__content",
+          children: jsx("div", {
+            className: "adyen-kyc-dropin__content-main",
+            children: content
+          })
+        })
       })
-    }), footer && jsx("div", {
-      className: "adyen-kyc-dropin__footer-container",
-      children: footer
-    })]
-  });
+    });
+  }
+  return null;
 };
+const EmbeddedActionBar = ({
+  left,
+  right
+}) => jsxs("footer", {
+  className: "adyen-kyc-embedded-action-bar",
+  children: [jsx("section", {
+    children: left
+  }), jsx("section", {
+    className: "adyen-kyc-embedded-action-bar-right",
+    children: right
+  })]
+});
 const FormNavigationItem = ({
   form,
   isActive,
@@ -25906,6 +26258,7 @@ const FormWrapper = ({
   handleNextClick,
   handleBackClick,
   handleHomeClick,
+  handleCloseClick,
   nextButtonLabel,
   backButtonLabel,
   homeButtonLabel,
@@ -25922,9 +26275,11 @@ const FormWrapper = ({
   hideBackButton,
   hideNextButton,
   hideNavigation,
+  asModal,
   canSubmit: canSubmit2,
   onSubmit,
-  problems
+  problems,
+  currentStep
 }) => {
   var _a;
   const {
@@ -25969,6 +26324,8 @@ const FormWrapper = ({
       showTaxExemptedLegalCaption
     })
   });
+  const handleFinishLater = () => {
+  };
   const formFooter = !hideDropinLayout && !hideFooter && jsx(ActionBar, {
     onNext: handleNextClick,
     onBack: handleBackClick,
@@ -25980,6 +26337,25 @@ const FormWrapper = ({
     hideBackButton,
     hideNextButton
   });
+  const embeddedFooter = jsx(EmbeddedActionBar, {
+    left: jsx(StepProgressIndicator, {
+      activeStepIndex: currentStep ?? 0,
+      stepsCount: 3,
+      fillBefore: true,
+      thick: true
+    }),
+    right: jsxs(Fragment, {
+      children: [!hideBackButton && jsx(Button, {
+        label: "Finish Later",
+        secondary: true,
+        icon: "save",
+        onClick: handleFinishLater
+      }), jsx(Button, {
+        label: nextButtonLabel,
+        onClick: handleNextClick
+      })]
+    })
+  });
   const multiStepForm = jsxs("div", {
     className: "adyen-kyc-form-container",
     children: [hasExpired && jsx(ExpiredBanner, {}), jsx(LoaderWrapper, {
@@ -25990,7 +26366,7 @@ const FormWrapper = ({
         setFormIndex: gotoFormByFormIndex,
         forms: forms2,
         handleGetIdVerificationToken,
-        children: [children, activeForm.formId === summaryStep.formId && summaryContent, formFooter]
+        children: [children, activeForm.formId === summaryStep.formId && summaryContent]
       })
     })]
   });
@@ -26019,11 +26395,19 @@ const FormWrapper = ({
       verificationErrors: problems == null ? void 0 : problems.verificationErrors
     })
   });
-  return jsx(DropinLayout, {
-    content: jsxs(Fragment, {
-      children: [sidebar, multiStepForm]
-    })
-  });
+  const footer = hideNavigation ? embeddedFooter : formFooter;
+  return jsx(
+    DropinLayout,
+    {
+      showAsModal: asModal,
+      onBack: !hideBackButton ? handleBackClick : void 0,
+      onClose: handleCloseClick,
+      content: jsxs(Fragment, {
+        children: [sidebar, multiStepForm]
+      }),
+      footer: footer || void 0
+    }
+  );
 };
 var BusinessDetailsEvents = /* @__PURE__ */ ((BusinessDetailsEvents2) => {
   BusinessDetailsEvents2["TASK_START"] = "BusinessDetails_TaskStarted";
@@ -26152,7 +26536,7 @@ const removeConditionalForms = (forms2, problems, isSkippingCompanyStructure, is
   }
 };
 const formatBasicInformation = (data, labels2, datasetUtils, companyType) => {
-  var _a, _b, _c, _d;
+  var _a, _b, _c;
   const country = data == null ? void 0 : data.country;
   const registrationNumberLabel = resolveFieldMetadata(defaultFieldConfig$9[country], {
     companyType,
@@ -26164,9 +26548,9 @@ const formatBasicInformation = (data, labels2, datasetUtils, companyType) => {
     companyType: void 0
   }, defaultFieldMetadata$6).label;
   return {
-    [((_b = labels2 == null ? void 0 : labels2.basicInformation) == null ? void 0 : _b.country) ?? "country"]: datasetUtils.getCountryName(data.country),
+    country: datasetUtils.getCountryName(data.country),
     [getKeyForField("stateOrProvince", data.country)]: datasetUtils.getStateName(data.stateOrProvince, data.country),
-    [taxIdLabel]: (_d = (_c = data.taxInformation) == null ? void 0 : _c.find((taxId) => data.country === taxId.country)) == null ? void 0 : _d.number,
+    [taxIdLabel]: (_c = (_b = data.taxInformation) == null ? void 0 : _b.find((taxId) => data.country === taxId.country)) == null ? void 0 : _c.number,
     [registrationNumberLabel]: data.registrationNumber
   };
 };
@@ -26414,7 +26798,7 @@ function BusinessDetailsDropinComponent({
   handleClearCompanyData,
   onTypeSwitch
 }) {
-  var _a, _b, _c, _d, _e, _f, _g;
+  var _a, _b, _c, _d, _e, _f, _g, _h;
   const {
     state: {
       currentState
@@ -26506,7 +26890,7 @@ function BusinessDetailsDropinComponent({
   const forms2 = useMemo(() => {
     const requiredForms = getRequiredForms(initialForms, derivedProps == null ? void 0 : derivedProps.requiredFields, derivedProps == null ? void 0 : derivedProps.optionalFields);
     const validityAddedForms = addValidityToForms(requiredForms, currentState.validityByForm, currentProblems);
-    return removeConditionalForms(validityAddedForms, currentProblems, currentCountry !== "US" && isSkippingCompanyStructure || !showCompanyStructure, isSkippingCompanyRegistrationDocument);
+    return removeConditionalForms(validityAddedForms, currentProblems, currentCountry !== "US" ? isSkippingCompanyStructure : !showCompanyStructure, isSkippingCompanyRegistrationDocument);
   }, [initialForms, derivedProps == null ? void 0 : derivedProps.requiredFields, derivedProps == null ? void 0 : derivedProps.optionalFields, currentState.validityByForm, currentProblems, currentCountry, isSkippingCompanyStructure, showCompanyStructure, isSkippingCompanyRegistrationDocument]);
   const canSubmitForm = useMemo(() => canSubmit$3(currentState.data) && hasDataChanged(initialData, currentState.data), [initialData, currentState.data]);
   const summaryData = useMemo(() => ({
@@ -26582,17 +26966,21 @@ function BusinessDetailsDropinComponent({
     }
   }, [canSubmitForm, currentCountry, forms2, gotoFormByFormIndex, isBusinessSelection, searchResults, showCompanyStructure, verifiedBusiness]);
   const nextClick = useCallback(() => {
+    var _a2;
     if (!COUNTRIES_USING_COMPANY_SEARCH.includes(currentCountry)) return handleNextClick();
     switch (activeForm.formId) {
       case "basicInformation":
         if (showCompanyStructure || verifiedBusiness) {
           return handleNextClick();
         }
-        return isBusinessSelection ? handleNextClick() : setIsBusinessSelection(true);
+        if (!isBusinessSelection && ((_a2 = currentState.validityByForm) == null ? void 0 : _a2.basicInformation)) {
+          return setIsBusinessSelection(true);
+        }
+        return handleNextClick();
       default:
         return handleNextClick();
     }
-  }, [activeForm.formId, currentCountry, handleNextClick, isBusinessSelection, showCompanyStructure, verifiedBusiness]);
+  }, [activeForm.formId, currentCountry, handleNextClick, isBusinessSelection, showCompanyStructure, verifiedBusiness, (_h = currentState.validityByForm) == null ? void 0 : _h.basicInformation]);
   const backClick = useCallback(() => {
     if (!COUNTRIES_USING_COMPANY_SEARCH.includes(country)) return handleNextClick();
     switch (activeForm.formId) {
@@ -27337,7 +27725,7 @@ const CompanyLookupResultsList = ({
     }, option.id))
   });
 };
-const Skeleton = ({
+const Skeleton$1 = ({
   quantity
 }) => {
   const renderBones = () => {
@@ -27461,7 +27849,7 @@ function CompanyLookup({
       verifiedCompany,
       reset: resetSelection,
       retrySearch
-    }), displaySkeleton && jsx(Skeleton, {
+    }), displaySkeleton && jsx(Skeleton$1, {
       quantity: 3
     }), displaySearchResults && jsx(CompanyLookupResultsList, {
       results,
@@ -28102,7 +28490,7 @@ const formatDataForSummary = (data, forms2, labels2, i18n) => {
     }
   }, {});
 };
-const logger$j = createLogger("useFormTaskSubmit");
+const logger$k = createLogger("useFormTaskSubmit");
 function useCompanySearchTaskSubmit({
   task,
   forms: forms2,
@@ -28145,7 +28533,7 @@ function useCompanySearchTaskSubmit({
         });
       }
     } catch (e) {
-      logger$j.error(e);
+      logger$k.error(e);
       userEvents.addEvent(CompanySearchEvents.DOCUMENTS_ERROR, {
         segmentation: {
           ...baseTrackingPayload,
@@ -28197,7 +28585,7 @@ function useCompanySearchTaskSubmit({
           ...trackingPayload
         }
       });
-      logger$j.log(submittedLegalEntity);
+      logger$k.log(submittedLegalEntity);
       clearToasts();
       onExternalSubmit == null ? void 0 : onExternalSubmit(data);
     } catch (e) {
@@ -28221,7 +28609,7 @@ function useCompanySearchTaskSubmit({
           type: "error"
         });
       }
-      logger$j.error(e);
+      logger$k.error(e);
       userEvents.addEvent(CompanySearchEvents.TASK_ERROR, {
         segmentation: {
           ...baseTrackingPayload,
@@ -28582,7 +28970,7 @@ function CompanySearchDropinComponent({
 }
 const IgnoreLocalStorageContext = createContext(false);
 const useIgnoreLocalStorage = () => useContext(IgnoreLocalStorageContext);
-const logger$i = createLogger("useLocalStorage");
+const logger$j = createLogger("useLocalStorage");
 const useLocalStorage = (key, defaultValue, options) => {
   const {
     serializer,
@@ -28603,7 +28991,7 @@ const useLocalStorage = (key, defaultValue, options) => {
       const res = rawValueRef.current ? parser(rawValueRef.current) : defaultValue;
       return res;
     } catch (err) {
-      logger$i.error(err);
+      logger$j.error(err);
       return defaultValue;
     }
   });
@@ -28634,7 +29022,7 @@ const useLocalStorage = (key, defaultValue, options) => {
     try {
       updateLocalStorage();
     } catch (err) {
-      logger$i.error(err);
+      logger$j.error(err);
     }
   }, [value, ignoreLocalStorage]);
   useEffect(() => {
@@ -28647,7 +29035,7 @@ const useLocalStorage = (key, defaultValue, options) => {
           setValue(event.newValue ? parser(event.newValue) : void 0);
         }
       } catch (err) {
-        logger$i.error(err);
+        logger$j.error(err);
       }
     };
     if (ignoreLocalStorage) return;
@@ -28794,7 +29182,7 @@ const useSingpassMyInfoLogin = ({
     trustedFields: trustedFields$1
   };
 };
-const logger$h = createLogger("useAssociatedLegalArrangement");
+const logger$i = createLogger("useAssociatedLegalArrangement");
 function useAssociatedLegalArrangement({
   rootLegalEntity,
   getLegalEntity: getLegalEntity2
@@ -28805,7 +29193,7 @@ function useAssociatedLegalArrangement({
     var _a;
     const foundEntity = (_a = rootLegalEntity == null ? void 0 : rootLegalEntity.entityAssociations) == null ? void 0 : _a.find((entity) => entity.type === LegalEntityType.SOLE_PROPRIETORSHIP || entity.type === LegalEntityType.TRUST);
     if (foundEntity == null ? void 0 : foundEntity.legalEntityId) {
-      getAssociatedEntity(foundEntity == null ? void 0 : foundEntity.legalEntityId).then((res) => setAssociatedLegalArrangement(res)).catch(logger$h.error);
+      getAssociatedEntity(foundEntity == null ? void 0 : foundEntity.legalEntityId).then((res) => setAssociatedLegalArrangement(res)).catch(logger$i.error);
     }
   }, [getAssociatedEntity, rootLegalEntity == null ? void 0 : rootLegalEntity.entityAssociations]);
   useEffect(() => {
@@ -28862,7 +29250,7 @@ const useCanSeeEntitySelection = (legalEntityId) => {
     setCanSeeEntitySelection: setCanSeeEntitySelectionIntoLocalStorage
   };
 };
-const logger$g = createLogger("useExemptSettlor");
+const logger$h = createLogger("useExemptSettlor");
 const useExemptSettlor = ({
   trust,
   handleGetLegalEntity
@@ -28875,10 +29263,29 @@ const useExemptSettlor = ({
   }, [handleGetLegalEntity]);
   useEffect(() => {
     if (!(trust == null ? void 0 : trust.trust)) return;
-    updateExemptSettlor(trust).catch(logger$g.error);
+    updateExemptSettlor(trust).catch(logger$h.error);
   }, [trust, updateExemptSettlor]);
   return exemptSettlor;
 };
+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]);
+};
 function useSalesChannelsSettings() {
   const {
     isSettingEnabled
@@ -30351,35 +30758,6 @@ const useIntroductionScreens = ({
   }) : [], [legalEntityType, tasks]);
   return canSeeIntroduction && (introductionScreens == null ? void 0 : introductionScreens.length) > 0 ? [IntroductionScreens.PROLOGUE, ...introductionScreens, IntroductionScreens.EPILOGUE] : void 0;
 };
-const shouldHighlight = (active, current, fillBefore) => !fillBefore ? active === current : active >= current;
-const StepProgressIndicator = ({
-  activeStepIndex,
-  stepsCount,
-  fillBefore,
-  thick
-}) => stepsCount > 0 ? jsx("div", {
-  "aria-label": `Step ${activeStepIndex + 1} of ${stepsCount}`,
-  className: "adyen-kyc-progress",
-  role: "group",
-  children: jsx("ol", {
-    className: cx("adyen-kyc-progress__bar", {
-      "adyen-kyc-progress__bar--thick": thick
-    }),
-    children: range(stepsCount).map((stepNumber) => {
-      const isHighlighted = shouldHighlight(activeStepIndex, stepNumber, fillBefore);
-      return jsx("li", {
-        "aria-current": isHighlighted ? "step" : void 0,
-        className: cx("adyen-kyc-progress__step", {
-          "adyen-kyc-progress__step--active": isHighlighted
-        }),
-        children: jsx("span", {
-          className: "adyen-kyc-progress__step-label",
-          children: `Step ${stepNumber + 1}: ${stepNumber < activeStepIndex ? "completed" : "not completed"}`
-        })
-      }, stepNumber);
-    })
-  })
-}) : null;
 const toCapitalized = (s) => `${s[0].toUpperCase()}${s.slice(1).toLowerCase()}`;
 const toPascalCase = (s) => s.split(/[^A-Za-z]/).map((word) => toCapitalized(word)).join("");
 var IntroductionScreenTranslationKeyElements = /* @__PURE__ */ ((IntroductionScreenTranslationKeyElements2) => {
@@ -30677,10 +31055,14 @@ function ReviewComponent({
     footer
   });
 }
-const SvgSingpassLogo = (props) => /* @__PURE__ */ jsxs$1("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 93 16", ...props, children: [
+const SvgSingpassLogo = (props) => /* @__PURE__ */ jsxs$1("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 93 16", role: "img", ...props, children: [
   /* @__PURE__ */ jsx$1("path", { fill: "#F4333D", d: "M5.88 11.8c-2.54 0-4.34-.85-5.13-1.57l1.69-2.48a5.5 5.5 0 0 0 3.44 1.36c.92 0 1.33-.27 1.33-.77 0-.38-.32-.68-1.3-.9l-2-.47c-1.96-.46-2.89-1.65-2.89-3.3C1.02 1.42 2.82.1 5.5.1c2.07 0 3.73.63 4.54 1.35L8.35 3.92A4.5 4.5 0 0 0 5.5 2.75c-.86 0-1.24.3-1.24.74 0 .45.4.7 1.17.88l2 .45c2.05.45 3.04 1.56 3.04 3.18 0 2.32-1.73 3.81-4.59 3.81m12-.22h3.38V5.52c0-1.48.72-2.4 2.12-2.4 1.32 0 2.02.76 2.02 2.4v6.06h3.37V4.67c0-3.02-1.5-4.58-4.09-4.58q-2.2 0-3.42 1.74V1.1c0-.5-.29-.8-.78-.8h-2.59v11.27M42.46.32v9.75c0 4.24-2.75 5.93-6.12 5.93-2.25 0-4.12-.59-5.24-1.6l1.75-2.61a5 5 0 0 0 3.49 1.37c1.73 0 2.74-1.1 2.74-2.64V9.8c-.8 1.02-1.98 1.47-3.41 1.47-2.73 0-5.09-2.39-5.09-5.59S32.93.09 35.66.09a3.9 3.9 0 0 1 3.41 1.7V1.1c0-.5.3-.8.8-.8zM39.2 5.68c0-1.46-1.1-2.61-2.63-2.61A2.57 2.57 0 0 0 34 5.68a2.6 2.6 0 0 0 2.57 2.61 2.56 2.56 0 0 0 2.63-2.61m18 .27c0 3.47-2.35 5.86-5.28 5.86-1.53 0-2.74-.45-3.62-1.46v5.38h-3.37V.32h2.59c.5 0 .78.29.78.79v.67A4.2 4.2 0 0 1 51.91.1c2.93 0 5.29 2.39 5.29 5.86m-3.4 0c0-1.69-1.2-2.88-2.78-2.88a2.77 2.77 0 0 0-2.83 2.88 2.8 2.8 0 0 0 2.83 2.89c1.58 0 2.77-1.2 2.77-2.89M70.91.32v11.26h-3.38v-1.46a4.2 4.2 0 0 1-3.62 1.69c-2.92 0-5.28-2.39-5.28-5.86S61 .09 63.92.09c1.53 0 2.8.54 3.62 1.7V1.1c0-.5.3-.8.79-.8zm-3.26 5.63a2.8 2.8 0 0 0-2.84-2.88c-1.57 0-2.76 1.19-2.76 2.88 0 1.7 1.19 2.89 2.76 2.89 1.6 0 2.84-1.2 2.84-2.89m10.1 5.86c2.85 0 4.58-1.49 4.58-3.8 0-1.63-.99-2.73-3.03-3.19l-2-.45c-.77-.18-1.18-.43-1.18-.88s.39-.74 1.24-.74c1.04 0 2.11.5 2.86 1.17l1.68-2.48C81.11.72 79.44.1 77.37.1 74.7.1 72.9 1.42 72.9 3.68c0 1.64.92 2.83 2.88 3.29l2 .47c.99.22 1.3.52 1.3.9 0 .5-.4.77-1.33.77a5.5 5.5 0 0 1-3.44-1.36l-1.68 2.48c.78.72 2.58 1.58 5.12 1.58m10.65 0C91.27 11.8 93 10.32 93 8c0-1.63-.99-2.73-3.04-3.19l-2-.45c-.76-.18-1.17-.43-1.17-.88s.38-.74 1.24-.74c1.03 0 2.11.5 2.86 1.17l1.68-2.48C91.77.72 90.1.1 88.03.1c-2.68 0-4.47 1.33-4.47 3.59 0 1.64.92 2.83 2.87 3.29l2 .47c1 .22 1.3.52 1.3.9 0 .5-.4.77-1.32.77a5.5 5.5 0 0 1-3.44-1.36l-1.69 2.48c.8.72 2.6 1.58 5.13 1.58" }),
   /* @__PURE__ */ jsx$1("path", { fill: "#000", d: "M13.8 3.92c1.1 0 1.95-.86 1.95-1.96S14.9 0 13.8 0s-1.96.86-1.96 1.96.85 1.96 1.96 1.96m-2.12 7.66h4.23l-.9-7a5 5 0 0 1-2.43 0z" })
 ] });
+const singpassLogo = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  default: SvgSingpassLogo
+}, Symbol.toStringTag, { value: "Module" }));
 const legalEntityTypeToSubtitleTranslationKey = {
   [LegalEntityType.INDIVIDUAL]: "myInfoYouCanGetVerifiedDetails",
   [LegalEntityType.ORGANIZATION]: "myInfoBusinessYouCanGetVerifiedDetails"
@@ -30756,28 +31138,7 @@ const SingpassBanner = (props) => {
     })]
   });
 };
-const SvgSetupManual = (props) => /* @__PURE__ */ jsxs$1("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 102 100", ...props, children: [
-  /* @__PURE__ */ jsx$1("path", { fill: "#EEF0F3", stroke: "#00112C", strokeLinecap: "round", strokeLinejoin: "round", d: "M66.82 10.09H2.9c-1.19 0-2.15.96-2.15 2.15v84.05c0 1.19.96 2.15 2.15 2.15h63.9c1.2 0 2.15-.96 2.15-2.15V12.24c0-1.19-.96-2.15-2.14-2.15" }),
-  /* @__PURE__ */ jsx$1("path", { fill: "#A0BEE6", stroke: "#A0BEE6", strokeLinecap: "round", strokeLinejoin: "round", d: "M25.44 35.7H9.02v3.94h16.42z" }),
-  /* @__PURE__ */ jsx$1("path", { fill: "#6F7988", stroke: "#6F7988", strokeLinecap: "round", strokeLinejoin: "round", d: "M24.44 55.91H9.02v1.97h15.42z" }),
-  /* @__PURE__ */ jsx$1("path", { fill: "#A0BEE6", stroke: "#A0BEE6", strokeLinecap: "round", strokeLinejoin: "round", d: "M55.77 35.7H29.16v3.94h26.61z" }),
-  /* @__PURE__ */ jsx$1("path", { stroke: "#6F7988", strokeLinecap: "round", strokeLinejoin: "round", d: "M9.02 29.58H20.4m-11.38-3.4h20.14" }),
-  /* @__PURE__ */ jsx$1("path", { stroke: "#A0BEE6", strokeLinecap: "round", strokeLinejoin: "round", d: "M9.02 51.75h18.9" }),
-  /* @__PURE__ */ jsx$1("path", { fill: "#6F7988", stroke: "#6F7988", strokeLinecap: "round", strokeLinejoin: "round", d: "M24.44 69.35H9.02v1.97h15.42z" }),
-  /* @__PURE__ */ jsx$1("path", { stroke: "#A0BEE6", strokeLinecap: "round", strokeLinejoin: "round", d: "M9.02 65.19h18.9" }),
-  /* @__PURE__ */ jsx$1("path", { fill: "#6F7988", stroke: "#6F7988", strokeLinecap: "round", strokeLinejoin: "round", d: "M48 55.91H32.57v1.97h15.41z" }),
-  /* @__PURE__ */ jsx$1("path", { stroke: "#A0BEE6", strokeLinecap: "round", strokeLinejoin: "round", d: "M32.58 51.75h18.9" }),
-  /* @__PURE__ */ jsx$1("path", { fill: "#6F7988", stroke: "#6F7988", strokeLinecap: "round", strokeLinejoin: "round", d: "M48 69.35H32.57v1.97h15.41z" }),
-  /* @__PURE__ */ jsx$1("path", { stroke: "#A0BEE6", strokeLinecap: "round", strokeLinejoin: "round", d: "M32.58 65.19h18.9" }),
-  /* @__PURE__ */ jsx$1("path", { stroke: "#6F7988", strokeLinecap: "round", strokeLinejoin: "round", d: "M9.02 82.5h9.46M9.02 86h25.8" }),
-  /* @__PURE__ */ jsx$1("path", { fill: "#fff", stroke: "#00112C", strokeLinecap: "round", strokeLinejoin: "round", d: "M83.1.79H19.17c-1.18 0-2.14.96-2.14 2.15v84.05c0 1.19.96 2.15 2.14 2.15H83.1c1.19 0 2.15-.96 2.15-2.15V2.94c0-1.19-.96-2.15-2.15-2.15" }),
-  /* @__PURE__ */ jsx$1("path", { fill: "#A0BEE6", stroke: "#A0BEE6", strokeLinecap: "round", strokeLinejoin: "round", d: "M64.64 16.78h-39.1v6.01h39.1zm0 11.71h-39.1v6.01h39.1zm0 11.71h-39.1v6.01h39.1z" }),
-  /* @__PURE__ */ jsx$1("path", { stroke: "#00112C", strokeLinecap: "round", strokeLinejoin: "round", d: "M25.44 10.14h22.54" }),
-  /* @__PURE__ */ jsx$1("path", { stroke: "#6F7988", strokeLinecap: "round", strokeLinejoin: "round", d: "M25.44 51.9h22.54m-22.54 5.7h32.82M25.44 68.99h26.54m-26.54 5.69H37.4" }),
-  /* @__PURE__ */ jsx$1("path", { stroke: "#00112C", strokeLinecap: "round", strokeLinejoin: "round", d: "M54.4 10.14h17.28M27.93 41.7v2.84m-.4-2.94h.8m-.8 3.2h.8m-.8-25.02h7.83m3.49 0h9.75M27.7 31.5h14.32m9.96-11.72h2.85" }),
-  /* @__PURE__ */ jsx$1("path", { fill: "#00112C", stroke: "#00112C", strokeLinecap: "round", strokeLinejoin: "round", d: "m79.81 76.03 1.96 21.5a1.12 1.12 0 0 0 1.93.68l6.59-6.82q.2-.2.46-.28l9.01-2.96c.9-.3 1.05-1.52.23-2.02L81.51 74.96a1.12 1.12 0 0 0-1.69 1.06z" })
-] });
-const SvgSetupSingpass = (props) => /* @__PURE__ */ jsxs$1("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 146 95", ...props, children: [
+const SvgSingpassVerificationInstant = (props) => /* @__PURE__ */ jsxs$1("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 146 95", role: "img", ...props, children: [
   /* @__PURE__ */ jsx$1("path", { fill: "#fff", stroke: "#00112C", strokeLinecap: "round", strokeLinejoin: "round", d: "M55.82 76.52a6.1 6.1 0 0 0 6.11 6.11h76.67a6.1 6.1 0 0 0 6.11-6.11V21.46H55.83z" }),
   /* @__PURE__ */ jsx$1("path", { fill: "#A0BEE6", stroke: "#00112C", strokeLinecap: "round", strokeLinejoin: "round", d: "M138.6 13.88H61.93a6.1 6.1 0 0 0-6.11 6.11v1.47h88.88V20a6.1 6.1 0 0 0-6.11-6.11z" }),
   /* @__PURE__ */ jsx$1("path", { fill: "#fff", d: "m30.16 94.33 3.47-2.6a41 41 0 0 0 8.1-8.1l2.6-3.48 6.07-2.02 13.53-1.69a3.04 3.04 0 0 0-.71-6.03l-8.6.96.7-3.47 12.66-1.58a3.04 3.04 0 0 0-.71-6.03L56.6 61.48l.8-3.96 10.58-1.32a3.04 3.04 0 0 0-.71-6.03l-8.6.95.8-3.98 8.5-1.06a3.04 3.04 0 0 0-.7-6.03L52.42 41.7l-22.26 2.47V41a4.86 4.86 0 0 0-4.86-4.86c-.68 0-1.22.55-1.22 1.22v2.7c0 1.42-.36 2.8-1.07 4.02L17.2 54.25c-.8 1.4-1.4 2.93-1.75 4.51L11.93 74.6" }),
@@ -30804,6 +31165,35 @@ const SvgSetupSingpass = (props) => /* @__PURE__ */ jsxs$1("svg", { xmlns: "http
   /* @__PURE__ */ jsx$1("path", { stroke: "#00112C", strokeLinecap: "round", strokeLinejoin: "round", d: "M86.73 53.7v3.13m1.1-2.68-2.2 2.21m2.2 0-2.2-2.2m2.67 1.1h-3.13m19.61-1.56v3.13m1.1-2.68-2.21 2.21m2.21 0-2.21-2.2m2.67 1.1h-3.13m10.59-1.56v3.13m1.1-2.68-2.2 2.21m2.2 0-2.2-2.2m2.66 1.1h-3.12M95.75 53.7v3.13m1.1-2.68-2.2 2.21m2.2 0-2.2-2.2m2.66 1.1H94.2" }),
   /* @__PURE__ */ jsx$1("path", { stroke: "#6F7988", strokeLinecap: "round", strokeLinejoin: "round", d: "M80.65 34.88h30.2m-30.2 3.21h13.47" })
 ] });
+const singpassVerificationInstant = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  default: SvgSingpassVerificationInstant
+}, Symbol.toStringTag, { value: "Module" }));
+const SvgSingpassVerificationManual = (props) => /* @__PURE__ */ jsxs$1("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 102 100", role: "img", ...props, children: [
+  /* @__PURE__ */ jsx$1("path", { fill: "#EEF0F3", stroke: "#00112C", strokeLinecap: "round", strokeLinejoin: "round", d: "M66.82 10.09H2.9c-1.19 0-2.15.96-2.15 2.15v84.05c0 1.19.96 2.15 2.15 2.15h63.9c1.2 0 2.15-.96 2.15-2.15V12.24c0-1.19-.96-2.15-2.14-2.15" }),
+  /* @__PURE__ */ jsx$1("path", { fill: "#A0BEE6", stroke: "#A0BEE6", strokeLinecap: "round", strokeLinejoin: "round", d: "M25.44 35.7H9.02v3.94h16.42z" }),
+  /* @__PURE__ */ jsx$1("path", { fill: "#6F7988", stroke: "#6F7988", strokeLinecap: "round", strokeLinejoin: "round", d: "M24.44 55.91H9.02v1.97h15.42z" }),
+  /* @__PURE__ */ jsx$1("path", { fill: "#A0BEE6", stroke: "#A0BEE6", strokeLinecap: "round", strokeLinejoin: "round", d: "M55.77 35.7H29.16v3.94h26.61z" }),
+  /* @__PURE__ */ jsx$1("path", { stroke: "#6F7988", strokeLinecap: "round", strokeLinejoin: "round", d: "M9.02 29.58H20.4m-11.38-3.4h20.14" }),
+  /* @__PURE__ */ jsx$1("path", { stroke: "#A0BEE6", strokeLinecap: "round", strokeLinejoin: "round", d: "M9.02 51.75h18.9" }),
+  /* @__PURE__ */ jsx$1("path", { fill: "#6F7988", stroke: "#6F7988", strokeLinecap: "round", strokeLinejoin: "round", d: "M24.44 69.35H9.02v1.97h15.42z" }),
+  /* @__PURE__ */ jsx$1("path", { stroke: "#A0BEE6", strokeLinecap: "round", strokeLinejoin: "round", d: "M9.02 65.19h18.9" }),
+  /* @__PURE__ */ jsx$1("path", { fill: "#6F7988", stroke: "#6F7988", strokeLinecap: "round", strokeLinejoin: "round", d: "M48 55.91H32.57v1.97h15.41z" }),
+  /* @__PURE__ */ jsx$1("path", { stroke: "#A0BEE6", strokeLinecap: "round", strokeLinejoin: "round", d: "M32.58 51.75h18.9" }),
+  /* @__PURE__ */ jsx$1("path", { fill: "#6F7988", stroke: "#6F7988", strokeLinecap: "round", strokeLinejoin: "round", d: "M48 69.35H32.57v1.97h15.41z" }),
+  /* @__PURE__ */ jsx$1("path", { stroke: "#A0BEE6", strokeLinecap: "round", strokeLinejoin: "round", d: "M32.58 65.19h18.9" }),
+  /* @__PURE__ */ jsx$1("path", { stroke: "#6F7988", strokeLinecap: "round", strokeLinejoin: "round", d: "M9.02 82.5h9.46M9.02 86h25.8" }),
+  /* @__PURE__ */ jsx$1("path", { fill: "#fff", stroke: "#00112C", strokeLinecap: "round", strokeLinejoin: "round", d: "M83.1.79H19.17c-1.18 0-2.14.96-2.14 2.15v84.05c0 1.19.96 2.15 2.14 2.15H83.1c1.19 0 2.15-.96 2.15-2.15V2.94c0-1.19-.96-2.15-2.15-2.15" }),
+  /* @__PURE__ */ jsx$1("path", { fill: "#A0BEE6", stroke: "#A0BEE6", strokeLinecap: "round", strokeLinejoin: "round", d: "M64.64 16.78h-39.1v6.01h39.1zm0 11.71h-39.1v6.01h39.1zm0 11.71h-39.1v6.01h39.1z" }),
+  /* @__PURE__ */ jsx$1("path", { stroke: "#00112C", strokeLinecap: "round", strokeLinejoin: "round", d: "M25.44 10.14h22.54" }),
+  /* @__PURE__ */ jsx$1("path", { stroke: "#6F7988", strokeLinecap: "round", strokeLinejoin: "round", d: "M25.44 51.9h22.54m-22.54 5.7h32.82M25.44 68.99h26.54m-26.54 5.69H37.4" }),
+  /* @__PURE__ */ jsx$1("path", { stroke: "#00112C", strokeLinecap: "round", strokeLinejoin: "round", d: "M54.4 10.14h17.28M27.93 41.7v2.84m-.4-2.94h.8m-.8 3.2h.8m-.8-25.02h7.83m3.49 0h9.75M27.7 31.5h14.32m9.96-11.72h2.85" }),
+  /* @__PURE__ */ jsx$1("path", { fill: "#00112C", stroke: "#00112C", strokeLinecap: "round", strokeLinejoin: "round", d: "m79.81 76.03 1.96 21.5a1.12 1.12 0 0 0 1.93.68l6.59-6.82q.2-.2.46-.28l9.01-2.96c.9-.3 1.05-1.52.23-2.02L81.51 74.96a1.12 1.12 0 0 0-1.69 1.06z" })
+] });
+const singpassVerificationManual = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  default: SvgSingpassVerificationManual
+}, Symbol.toStringTag, { value: "Module" }));
 const setupAccountMethods = ["singpass", "manual"];
 const setupAccountMethodFields = ["setupAccountMethod"];
 const getSingpassSelectionDisabled = (legalEntityType) => {
@@ -30833,7 +31223,7 @@ const getSetupAccountMethodMetadata = (legalEntityType) => {
       description: translationSingpassDescriptionKey,
       icon: jsx("span", {
         className: "adyen-kyc-setup-singpass-container",
-        children: jsx(SvgSetupSingpass, {})
+        children: jsx(SvgSingpassVerificationInstant, {})
       }),
       provider: {
         name: "singpass",
@@ -30849,7 +31239,7 @@ const getSetupAccountMethodMetadata = (legalEntityType) => {
       description: "youAlsoHaveToUploadSomeSupportingDocuments",
       icon: jsx("span", {
         className: "adyen-kyc-setup-manual-container",
-        children: jsx(SvgSetupManual, {})
+        children: jsx(SvgSingpassVerificationManual, {})
       })
     }
   };
@@ -31796,6 +32186,7 @@ function IndividualDropinComponent({
   legalEntityResponse,
   taskName,
   handleHomeClick,
+  handleCloseClick,
   homeButtonLabel,
   isTargetLegalEntityType,
   country: parentCountry,
@@ -31808,6 +32199,7 @@ function IndividualDropinComponent({
   onSubmit: externalOnSubmit,
   onTypeSwitch,
   hideNavigation = false,
+  asModal = false,
   handleBackClick: externalBackClick,
   trustedFields: trustedFields2,
   trustedFieldsProvider
@@ -32237,7 +32629,8 @@ function IndividualDropinComponent({
     shouldValidate,
     setShouldValidate,
     gotoFormByFormIndex,
-    nextButtonLabel
+    nextButtonLabel,
+    currentStep
   } = useFormComposer({
     problems,
     baseTrackingPayload,
@@ -32256,6 +32649,7 @@ function IndividualDropinComponent({
     handleBackClick,
     handleNextClick,
     handleHomeClick,
+    handleCloseClick,
     hideHomeButton,
     hideBackButton,
     hideFooter,
@@ -32271,6 +32665,8 @@ function IndividualDropinComponent({
     canSubmit: canSubmit2() && hasDataChanged(dataFromResponse, data),
     problems,
     hideNavigation,
+    asModal,
+    currentStep,
     children: jsx(IndividualComponent, {
       ...derivedProps,
       capabilities: getCapabilities(legalEntityResponse),
@@ -32302,7 +32698,7 @@ function IndividualDropinComponent({
     })
   });
 }
-const logger$f = createLogger("useBankConfigurationHandler");
+const logger$g = createLogger("useBankConfigurationHandler");
 const useBankConfigurationHandlers = ({
   isEmbeddedDropin,
   handleGetBankVerificationVendors,
@@ -32319,7 +32715,7 @@ const useBankConfigurationHandlers = ({
     (async () => {
       const bankVerificationVendorsResponse2 = callBankVerificationVendorsUpfront ? await handleGetBankVerificationVendors(bankAccountCountry) : [];
       setBankVerificationVendorsResponse(bankVerificationVendorsResponse2);
-    })().catch(logger$f.error).finally(() => {
+    })().catch(logger$g.error).finally(() => {
       setLoadingStatus("success");
     });
   }, [bankAccountCountry]);
@@ -33720,8 +34116,8 @@ const serviceAgreementValidationRules = {
     errorMessage: "fieldIsRequired"
   }
 };
-const logger$e = createLogger("useServiceAgreement");
-const FALLBACK_LANGUAGE_CODE = "en";
+const logger$f = createLogger("useServiceAgreement");
+const FALLBACK_LANGUAGE_CODE$1 = "en";
 const useServiceAgreement = ({
   handleGetServiceAgreement,
   handleServiceAgreementIsNotAvailableInThatLanguage,
@@ -33753,7 +34149,7 @@ const useServiceAgreement = ({
         contract
       });
     };
-    requestAcceptedServiceAgreement().catch(logger$e.error).finally(() => setLoading("success"));
+    requestAcceptedServiceAgreement().catch(logger$f.error).finally(() => setLoading("success"));
   }, [acceptanceId, handleViewAcceptedTermsOfServiceDocument]);
   useEffect(() => {
     const requestServiceAgreement = async () => {
@@ -33768,7 +34164,7 @@ const useServiceAgreement = ({
           language: agreementLanguage
         });
         if (!document2) {
-          logger$e.log('"document" field was missing in response');
+          logger$f.log('"document" field was missing in response');
           return;
         }
         const contract = JSON.parse(decodeURIComponent(escape(window.atob(document2))));
@@ -33778,15 +34174,15 @@ const useServiceAgreement = ({
         });
         setLoading("success");
       } catch (err) {
-        if (agreementLanguage !== FALLBACK_LANGUAGE_CODE) {
+        if (agreementLanguage !== FALLBACK_LANGUAGE_CODE$1) {
           handleServiceAgreementIsNotAvailableInThatLanguage();
-          setAgreementLanguage(FALLBACK_LANGUAGE_CODE);
+          setAgreementLanguage(FALLBACK_LANGUAGE_CODE$1);
           return;
         }
         throw err;
       }
     };
-    requestServiceAgreement().catch(logger$e.error);
+    requestServiceAgreement().catch(logger$f.error);
   }, [handleGetServiceAgreement, handleServiceAgreementIsNotAvailableInThatLanguage, agreementLanguage, legalEntityId, serviceAgreementType]);
   return {
     loading,
@@ -33803,6 +34199,8 @@ const serviceAgreementTypesTranslationMapping = {
   adyenFranchisee: "franchiseesTAndCs",
   adyenPccr: "pccr"
 };
+const logger$e = createLogger("ServiceAgreementDropinComponent");
+const FALLBACK_LANGUAGE_CODE = "en";
 function ServiceAgreementDropinComponent({
   legalEntityResponse,
   handleGetServiceAgreement,
@@ -33999,16 +34397,23 @@ function ServiceAgreementDropinComponent({
     }
   };
   const onDownloadUnacceptedTermsOfServiceDocument = async () => {
-    try {
-      if (!handleDownloadUnacceptedTermsOfServiceDocument) return;
-      const response = await handleDownloadUnacceptedTermsOfServiceDocument(legalEntityResponse.id, {
+    const requestAndDownload = async (languageCode) => {
+      const response = await (handleDownloadUnacceptedTermsOfServiceDocument == null ? void 0 : handleDownloadUnacceptedTermsOfServiceDocument(legalEntityResponse.id, {
         type: activeForm.serviceAgreementType,
-        language: i18n.languageCode,
+        language: languageCode,
         termsOfServiceDocumentFormat: "PDF"
-      });
-      if (!response.document) throw new Error();
+      }));
+      if (!(response == null ? void 0 : response.document)) throw new Error();
       await downloadFile(response.document, `${i18n.get(activeForm.formName)}.pdf`);
+    };
+    try {
+      if (!handleDownloadUnacceptedTermsOfServiceDocument) return;
+      await requestAndDownload(i18n.languageCode);
     } catch (e) {
+      if (i18n.languageCode !== FALLBACK_LANGUAGE_CODE) {
+        await requestAndDownload(FALLBACK_LANGUAGE_CODE).catch(logger$e.error);
+        return;
+      }
       showToast({
         label: i18n.get("failedToDownloadServiceAgreementDocument"),
         type: "error"
@@ -34853,7 +35258,6 @@ const hasProgressedBeyondEntitySelection = (legalEntity) => {
   return hasOwnEntityAssocation || !!hasOrganizationType;
 };
 const PAGES_WITH_POLLING = [TaskTypes.DECISION_MAKER_OVERVIEW, TaskTypes.TASKS_OVERVIEW];
-const POLLING_INTERVAL = 3e3;
 const logger$d = createLogger("DropinComposerComponent");
 const isOrganizationSettlorWithExemptionReasonEnabled = (enabled, country) => country === CountryCodes.Australia && enabled;
 function DropinComposerComponent({
@@ -35073,19 +35477,26 @@ function DropinComposerComponent({
       }
     }
   };
-  const refreshLegalEntity = useCallback(async () => {
+  const retrieveLegalEntity = useCallback(async () => {
     if (rootLegalEntity.id && (args == null ? void 0 : args.handleGetLegalEntity)) {
       try {
-        const response = await (args == null ? void 0 : args.handleGetLegalEntity(rootLegalEntity.id));
-        setRootLegalEntity(response);
-        setCapabilityProblems(getCapabilityProblems(response, rootLegalEntityCountry, isExperimentEnabled));
-        return response;
+        return await args.handleGetLegalEntity(rootLegalEntity.id);
       } catch (e) {
-        logger$d.warn(i18n.get("failedToFetchLegalEntityDetails"));
+        logger$d.warn("Failed to fetch legal entity details", e);
       }
     }
     return void 0;
-  }, [i18n, rootLegalEntity.id]);
+  }, [rootLegalEntity.id, args == null ? void 0 : args.handleGetLegalEntity, i18n]);
+  const updateLegalEntityAndCapabilityProblems = useCallback((legalEntity) => {
+    if (!legalEntity) return;
+    setRootLegalEntity(legalEntity);
+    setCapabilityProblems(getCapabilityProblems(legalEntity, getLegalEntityCountry(legalEntity), isExperimentEnabled));
+  }, [isExperimentEnabled]);
+  const refreshLegalEntity = useCallback(async () => {
+    const legalEntity = await retrieveLegalEntity();
+    updateLegalEntityAndCapabilityProblems(legalEntity);
+    return legalEntity;
+  }, [retrieveLegalEntity, updateLegalEntityAndCapabilityProblems]);
   const deleteTransferInstrument = async (id) => {
     if (id && (args == null ? void 0 : args.handleDeleteTransferInstrument)) {
       try {
@@ -35437,20 +35848,16 @@ function DropinComposerComponent({
       navigateTo(TaskTypes.CAPABILITY_REJECTED, true);
     }
   }, [rootLegalEntity]);
-  useEffect(() => {
-    if (!PAGES_WITH_POLLING.includes(currentTask) || hasResolvedCapabilities(rootLegalEntity)) {
-      return;
-    }
-    if (hasRejectedCapabilities(rootLegalEntity)) {
-      return;
-    }
-    const timeoutId = setTimeout(() => {
-      refreshLegalEntity().catch(logger$d.error);
-    }, POLLING_INTERVAL);
-    return () => {
-      clearInterval(timeoutId);
-    };
-  }, [refreshLegalEntity, rootLegalEntity]);
+  usePolling({
+    poller: retrieveLegalEntity,
+    pollingInterval: 3e3,
+    onNewValueReceived: updateLegalEntityAndCapabilityProblems,
+    skip: (
+      // Stop polling when not on an applicable page
+      // or the LE has fully resolved capabilities
+      !PAGES_WITH_POLLING.includes(currentTask) || hasResolvedCapabilities(rootLegalEntity) || hasRejectedCapabilities(rootLegalEntity)
+    )
+  });
   useEffect(() => {
     const newAccountHolder = getDefaultAccountHolderType(rootLegalEntity, false, accountHolder);
     if (newAccountHolder !== accountHolder) setAccountHolder(newAccountHolder);
@@ -35469,13 +35876,14 @@ function DropinComposerComponent({
         handleSingpassMyInfoLoginFailure(e);
       }
     },
-    onMessage: ({
+    onMessage: async ({
       data: {
         isSuccessful
       }
     }) => {
       if (isSuccessful) {
         handleSingpassMyInfoLoginSuccess();
+        await refreshLegalEntity();
       } else {
         handleSingpassMyInfoLoginFailure(legalEntityResponse.type === LegalEntityType.INDIVIDUAL ? "weCouldntConnectToMyinfo" : "weCouldntConnectToMyinfoBusiness");
       }
@@ -36348,11 +36756,16 @@ function CreateIndividualComponent({
   legalEntityId,
   taskType,
   onSubmitSuccess,
-  handleBackClick
+  handleBackClick,
+  modalView,
+  open,
+  onClose
 }) {
   var _a;
   const {
-    contextCountry
+    contextCountry,
+    isModalView,
+    setIsModalView
   } = useCoreContext();
   if (!legalEntityId && !parentLegalEntityId) {
     throw new Error("Must provide at-least one of parentLegalEntityId or legalEntityId");
@@ -36369,9 +36782,13 @@ function CreateIndividualComponent({
     getIdVerificationToken,
     idVerificationStartCheck
   } = useComponentApi(legalEntityId ?? parentLegalEntityId);
+  const [showForm, setShowForm] = useState(false);
   const [legalEntity, setLegalEntity] = useState();
   const [parentLegalEntity, setParentLegalEntity] = useState();
-  const [loadingStatus, setLoadingStatus] = useState("loading");
+  setShowForm(open ?? false);
+  if (modalView) {
+    setIsModalView(true);
+  }
   const fetchLegalEntity = useCallback(async () => {
     try {
       const [parentEntity, entity] = await Promise.all([parentLegalEntityId ? getLegalEntity2(parentLegalEntityId) : Promise.resolve(void 0), legalEntityId ? getLegalEntity2(legalEntityId) : Promise.resolve(void 0)]);
@@ -36379,17 +36796,19 @@ function CreateIndividualComponent({
       setLegalEntity(entity);
     } catch (error) {
       logger$c.error(error);
-    } finally {
-      setLoadingStatus("success");
     }
   }, [parentLegalEntityId, legalEntityId, getLegalEntity2]);
   useEffect(() => {
     fetchLegalEntity().catch(logger$c.error);
   }, [fetchLegalEntity]);
   const country = ((_a = legalEntity == null ? void 0 : legalEntity.individual) == null ? void 0 : _a.residentialAddress.country) ?? contextCountry;
-  return loadingStatus === "loading" ? jsx(Loader, {
-    size: "medium"
-  }) : jsx(IndividualDropinComponent, {
+  const onSubmit = (d) => {
+    setShowForm(false);
+    if (onSubmitSuccess) {
+      onSubmitSuccess(d);
+    }
+  };
+  return showForm ? jsx(IndividualDropinComponent, {
     parentLegalEntity,
     legalEntityResponse: legalEntity,
     country,
@@ -36404,9 +36823,11 @@ function CreateIndividualComponent({
     handleGetIdVerificationStartCheck: idVerificationStartCheck,
     handleBackClick,
     hideNavigation: true,
-    onSubmit: onSubmitSuccess,
+    asModal: isModalView,
+    onSubmit,
+    handleCloseClick: onClose,
     taskType
-  });
+  }) : null;
 }
 const logger$b = createLogger("CreateTransferInstrumentComponent");
 function CreateTransferInstrumentComponent({
@@ -36469,6 +36890,183 @@ function CreateTransferInstrumentComponent({
     taskType: TaskTypes.PAYOUT
   }) : null;
 }
+var OnboardingStatus = /* @__PURE__ */ ((OnboardingStatus2) => {
+  OnboardingStatus2["AWAITING_DATA"] = "AWAITING_DATA";
+  OnboardingStatus2["IN_REVIEW"] = "IN_REVIEW";
+  OnboardingStatus2["UNSUCCESSFUL"] = "UNSUCCESSFUL";
+  OnboardingStatus2["REJECTED"] = "REJECTED";
+  OnboardingStatus2["VERIFIED"] = "VERIFIED";
+  return OnboardingStatus2;
+})(OnboardingStatus || {});
+const Skeleton = ({
+  circle = false,
+  text = false,
+  height = "1em",
+  width
+}) => {
+  const classNames = cx("adyen-kyc-skeleton", {
+    "adyen-kyc-skeleton__circle": circle,
+    "adyen-kyc-skeleton__text": text
+  });
+  return jsx("div", {
+    className: classNames,
+    style: {
+      height,
+      width
+    }
+  });
+};
+const styles = {
+  "adyen-kyc-embedded-status": "adyen-kyc-embedded-status",
+  "adyen-kyc-embedded-status__avatar": "adyen-kyc-embedded-status__avatar",
+  "adyen-kyc-embedded-status__loading": "adyen-kyc-embedded-status__loading",
+  "adyen-kyc-embedded-status__info": "adyen-kyc-embedded-status__info",
+  "adyen-kyc-embedded-status__title": "adyen-kyc-embedded-status__title"
+};
+const statusToTag = (status) => {
+  switch (status) {
+    case OnboardingStatus.IN_REVIEW:
+      return {
+        translationKey: "inReview",
+        variant: "grey"
+      };
+    case OnboardingStatus.VERIFIED:
+      return {
+        translationKey: "verified",
+        variant: "green"
+      };
+    case OnboardingStatus.REJECTED:
+      return {
+        translationKey: "rejected",
+        variant: "red"
+      };
+    case OnboardingStatus.AWAITING_DATA:
+      return {
+        translationKey: "inReview",
+        variant: "grey"
+      };
+    case OnboardingStatus.UNSUCCESSFUL:
+      return {
+        translationKey: "unsuccessful",
+        variant: "red"
+      };
+    default:
+      return {
+        variant: "grey"
+      };
+  }
+};
+const EmbeddedStatus = ({
+  title,
+  subtitle,
+  status,
+  loading = false,
+  tagLabel,
+  tagVariant = "green",
+  onClick
+}) => {
+  const {
+    i18n
+  } = useI18nContext();
+  const statusTag = status ? statusToTag(status) : {
+    translationKey: tagLabel,
+    variant: tagVariant
+  };
+  return jsxs("button", {
+    type: "button",
+    className: styles["adyen-kyc-embedded-status"],
+    onClick,
+    children: [jsx("section", {
+      className: cx(styles["adyen-kyc-embedded-status__avatar"], {
+        "adyen-kyc-embedded-status__loading": loading
+      }),
+      children: loading ? jsx(Skeleton, {
+        height: "100%",
+        width: "100%",
+        circle: true
+      }) : jsx(Icon, {
+        className: styles["adyen-kyc-embedded-status__icon"],
+        name: "user"
+      })
+    }), jsxs("section", {
+      className: styles["adyen-kyc-embedded-status__info"],
+      children: [loading ? jsx(Skeleton, {
+        text: true,
+        width: "20ch",
+        height: "1em"
+      }) : jsx(Typography, {
+        variant: "title",
+        children: title
+      }), loading ? jsx(Skeleton, {
+        text: true,
+        width: "90%",
+        height: "1em"
+      }) : jsx(Typography, {
+        variant: "caption",
+        children: subtitle
+      })]
+    }), jsx("section", {
+      className: styles["adyen-kyc-embedded-status__tag"],
+      children: loading ? jsx(Skeleton, {
+        width: "8ch",
+        height: "1em"
+      }) : jsx(Tag, {
+        variant: statusTag.variant,
+        children: !statusTag.translationKey ? "---" : i18n.get(statusTag.translationKey)
+      })
+    })]
+  });
+};
+function LegalEntityStatus({
+  legalEntityId,
+  onClick
+}) {
+  var _a, _b, _c;
+  const {
+    getLegalEntity: getLegalEntity2,
+    getOnboardingStatus: getOnboardingStatus2
+  } = useComponentApi(legalEntityId);
+  const [legalEntity, setLegalEntity] = useState();
+  const [isLoading, setIsLoading] = useState(!legalEntity);
+  const [onboardingStatus, setOnboardingStatus] = useState();
+  const fetchLegalEntity = useCallback(async () => getLegalEntity2(legalEntityId), [getLegalEntity2, legalEntityId]);
+  const checkStatus = useCallback(async () => getOnboardingStatus2(), [getOnboardingStatus2]);
+  const onNewValueReceived = useCallback(({
+    status
+  }) => {
+    setOnboardingStatus(status);
+    if (status === OnboardingStatus.VERIFIED) {
+      fetchLegalEntity().then((newLegalEntity) => {
+        setLegalEntity(newLegalEntity);
+        setIsLoading(false);
+      }).catch((e) => {
+        console.log(e);
+      });
+    }
+  }, [fetchLegalEntity]);
+  usePolling({
+    poller: checkStatus,
+    pollingInterval: 3e3,
+    onNewValueReceived,
+    immediate: true
+  });
+  return jsx(EmbeddedStatus, {
+    onClick,
+    title: ((_b = (_a = legalEntity == null ? void 0 : legalEntity.individual) == null ? void 0 : _a.name) == null ? void 0 : _b.firstName) ?? "",
+    subtitle: ((_c = legalEntity == null ? void 0 : legalEntity.individual) == null ? void 0 : _c.email) ?? "",
+    status: onboardingStatus,
+    loading: isLoading
+  });
+}
+function ManageIndividualComponent({
+  legalEntityId,
+  onClick
+}) {
+  return jsx(LegalEntityStatus, {
+    legalEntityId,
+    onClick
+  });
+}
 const setDefaultCurrencies = (dataObject, country) => {
   const countryCurrencies = currencyByCountry[country] || [];
   if (dataObject.totalAssetsCurrency && dataObject.annualTurnoverCurrency) return;
@@ -38083,19 +38681,15 @@ function UpdateLegalEntityForHighExposure({
     })
   });
 }
-var OnboardingUrlTarget = /* @__PURE__ */ ((OnboardingUrlTarget2) => {
-  OnboardingUrlTarget2["BLANK"] = "_blank";
-  OnboardingUrlTarget2["SELF"] = "_self";
-  return OnboardingUrlTarget2;
-})(OnboardingUrlTarget || {});
-var OnboardingStatus = /* @__PURE__ */ ((OnboardingStatus2) => {
-  OnboardingStatus2["AWAITING_DATA"] = "AWAITING_DATA";
-  OnboardingStatus2["IN_REVIEW"] = "IN_REVIEW";
-  OnboardingStatus2["UNSUCCESSFUL"] = "UNSUCCESSFUL";
-  OnboardingStatus2["REJECTED"] = "REJECTED";
-  OnboardingStatus2["VERIFIED"] = "VERIFIED";
-  return OnboardingStatus2;
-})(OnboardingStatus || {});
+const coerceError = (err) => {
+  if (err instanceof Error) return err;
+  if (typeof err === "object") {
+    if (err !== null && "message" in err && typeof err.message === "string") {
+      return new Error(err.message);
+    }
+  }
+  return new Error("Unknown error");
+};
 const contentMap = {
   [OnboardingStatus.AWAITING_DATA]: {
     description: ["onboardingRedirectAwaitingDescriptionP1"],
@@ -38119,20 +38713,18 @@ const contentMap = {
 function getContentByStatus(status) {
   return contentMap[status];
 }
+const FINAL_STATUSES = [OnboardingStatus.VERIFIED, OnboardingStatus.REJECTED];
 const logger$7 = createLogger("ViewVerificationStatusComponent");
 function ViewVerificationStatusComponent({
   legalEntityId,
   hideExplanation = false,
   returnUrl,
-  redirectTarget,
+  redirectTarget = "_blank",
   themeId,
   onStatusChange,
   onError,
   onRedirect
 }) {
-  if (!legalEntityId) {
-    throw new Error("legalEntityId argument is required!");
-  }
   const {
     i18n
   } = useI18nContext();
@@ -38148,45 +38740,41 @@ function ViewVerificationStatusComponent({
     if (statusContent) return statusContent;
     logger$7.error(`there is no content for status "${onboardingStatus}"`);
   }, [onboardingStatus]);
-  const handleError = ({
-    trKey,
-    error
-  }) => {
-    if (trKey) {
-      setAlertContent(trKey);
-    }
-    if (error) {
-      logger$7.error(error);
-    }
-    if (typeof onError === "function") {
-      const userMessage = trKey ? i18n.get(trKey) : "";
-      onError({
-        error: error || {
-          message: userMessage
-        },
-        userMessage
-      });
+  const handleError = useCallback((rawError, userMessage) => {
+    const error = coerceError(rawError);
+    logger$7.error(error);
+    setAlertContent(userMessage);
+    onError == null ? void 0 : onError({
+      error,
+      userMessage: i18n.get(userMessage)
+    });
+  }, [i18n, onError]);
+  const fetchOnboardingStatus = useCallback(async () => {
+    try {
+      const {
+        status
+      } = await getOnboardingStatus2();
+      return status;
+    } catch (error) {
+      handleError(error, "onboardingRedirectLinkError");
+      return void 0;
     }
-  };
+  }, [getOnboardingStatus2, handleError]);
+  const updateOnboardingStatus = useCallback((newStatus) => {
+    if (!newStatus) return;
+    setOnboardingStatus(newStatus);
+    if (newStatus !== onboardingStatus) onStatusChange == null ? void 0 : onStatusChange(newStatus);
+  }, [onStatusChange]);
+  usePolling({
+    poller: fetchOnboardingStatus,
+    pollingInterval: 1e4,
+    onNewValueReceived: updateOnboardingStatus,
+    skip: onboardingStatus && FINAL_STATUSES.includes(onboardingStatus)
+  });
   useEffect(() => {
-    setAlertContent("");
-    (async () => {
-      try {
-        const {
-          status
-        } = await getOnboardingStatus2();
-        setOnboardingStatus(status);
-        if (typeof onStatusChange === "function") {
-          onStatusChange(status);
-        }
-      } catch (error) {
-        handleError({
-          trKey: "onboardingRedirectLinkError",
-          error
-        });
-      }
-    })().catch(logger$7.error);
-  }, [legalEntityId, getOnboardingStatus2]);
+    setAlertContent(void 0);
+    fetchOnboardingStatus().then(updateOnboardingStatus).catch(logger$7.error);
+  }, [fetchOnboardingStatus, updateOnboardingStatus]);
   const [loadingLinkStatus, setLinkLoadingStatus] = useState("success");
   const redirectToAdyen = async () => {
     setLinkLoadingStatus("loading");
@@ -38200,41 +38788,30 @@ function ViewVerificationStatusComponent({
         redirectUrl
       } = await generateOnboardingLink2(config);
       if (!redirectUrl) {
-        handleError({
-          trKey: "onboardingRedirectLinkError"
-        });
+        handleError(new Error("No redirectUrl returned"), "onboardingRedirectLinkError");
         return;
       }
       openUrl(redirectUrl, config);
     } catch (error) {
-      handleError({
-        trKey: "onboardingRedirectLinkError",
-        error
-      });
+      handleError(error, "onboardingRedirectLinkError");
     } finally {
       setLinkLoadingStatus("success");
     }
   };
   const openUrl = (url, config) => {
-    const target = redirectTarget && Object.values(OnboardingUrlTarget).includes(redirectTarget) ? redirectTarget : OnboardingUrlTarget.BLANK;
-    const newTab = window.open("", target);
-    if (newTab) {
-      newTab.location.href = url;
-      if (typeof onRedirect === "function") {
-        onRedirect({
-          ...config,
-          onboardingLink: url
-        });
-      }
-    } else {
-      handleError({
-        trKey: "onboardingRedirectOpenError"
-      });
+    const newTab = window.open(url, redirectTarget);
+    if (!newTab) {
+      handleError(new Error("Could not open redirect in new tab"), "onboardingRedirectOpenError");
+      return;
     }
+    onRedirect == null ? void 0 : onRedirect({
+      ...config,
+      onboardingLink: url
+    });
   };
   const renderFooter = () => {
     const statusesWithoutActions = [OnboardingStatus.REJECTED, OnboardingStatus.VERIFIED];
-    if (statusesWithoutActions.includes(onboardingStatus) || !(content == null ? void 0 : content.ctaButton)) {
+    if (onboardingStatus && statusesWithoutActions.includes(onboardingStatus) || !(content == null ? void 0 : content.ctaButton)) {
       return;
     }
     return jsx(Button, {
@@ -38285,6 +38862,7 @@ const componentsMap = {
   pci: PciDropinComponent,
   createTransferInstrumentComponent: CreateTransferInstrumentComponent,
   createIndividualComponent: CreateIndividualComponent,
+  manageIndividualComponent: ManageIndividualComponent,
   viewVerificationStatusComponent: ViewVerificationStatusComponent,
   updateLegalEntityForHighExposureComponent: UpdateLegalEntityForHighExposure
 };
@@ -38386,28 +38964,6 @@ const useAnalytics = async ({
     userEvents.subscribe(onUserEvent);
   }
 };
-let isDocumentGuidanceLoaded = false;
-const getIconContainer = () => {
-  const container = document.createElement("div");
-  container.setAttribute("aria-hidden", "true");
-  container.setAttribute("id", "adyen-kyc-icon-container");
-  container.style.height = "0";
-  return container;
-};
-const buildSpriteDOMFromResponse = (responseData) => {
-  const iconContainer = getIconContainer();
-  iconContainer.innerHTML = responseData;
-  return iconContainer;
-};
-const loadDocumentGuidance = async (loadingContext) => {
-  if (isDocumentGuidanceLoaded) return;
-  isDocumentGuidanceLoaded = true;
-  const responseData = await http({
-    loadingContext,
-    path: "static/images/document-guidance.svg"
-  }, null, "text");
-  document.body.insertBefore(buildSpriteDOMFromResponse(responseData), document.body.firstChild);
-};
 const logger$6 = createLogger("loadCountries");
 const countriesImports = /* @__PURE__ */ Object.assign({ "./de-DE.json": () => import("./de-DE-Cx8Uim1K.js"), "./el-GR.json": () => import("./el-GR-B7_JR3z5.js"), "./en-US.json": () => import("./en-US-CkdCbOCX.js"), "./es-ES.json": () => import("./es-ES-NBv3HHhn.js"), "./fr-FR.json": () => import("./fr-FR-DdSVMVsp.js"), "./it-IT.json": () => import("./it-IT-Bwdk3zuj.js"), "./ja-JP.json": () => import("./ja-JP-Bsvzm8zu.js"), "./nl-NL.json": () => import("./nl-NL-DofKaNkk.js"), "./pt-PT.json": () => import("./pt-PT-DFEvMD1M.js"), "./ru-RU.json": () => import("./ru-RU-PiM0ZI5h.js"), "./sv-SE.json": () => import("./sv-SE-C0GoLwTg.js"), "./zh-CN.json": () => import("./zh-CN-DJs6Hct-.js"), "./zh-TW.json": () => import("./zh-TW-BWhLbns8.js") });
 const loadCountriesDataset = async (locale) => {
@@ -38580,7 +39136,6 @@ const getEmbeddedApi = ({
       };
     },
     getDataset,
-    loadDocumentGuidance: async () => loadDocumentGuidance(base),
     getImageUrl: () => `${base}static/images/`,
     getAllowedCountries: async () => getSupportedCountries(baseRequestContext),
     getAllowedLocales: async () => getAllowedLocales$1(baseRequestContext),
@@ -38697,7 +39252,6 @@ const getKycExternalApi = ({
     clientKey
   }),
   getDataset,
-  loadDocumentGuidance: async () => loadDocumentGuidance(loadingContext),
   verifyIdNumber: async (request) => verifyIdNumber({
     loadingContext,
     clientKey
@@ -38725,7 +39279,7 @@ const ConfigurationApiProvider = ({
     isEmbeddedDropin,
     loadingContext
   } = authContext;
-  const sdkVersion = "2.50.4";
+  const sdkVersion = "2.51.0";
   useAnalytics({
     onUserEvent,
     legalEntityId: rootLegalEntityId,
@@ -38768,6 +39322,7 @@ const CoreProvider = ({
     setAccountHolder
   } = useAccountHolder(rootLegalEntityId);
   const [accountFormat, setAccountFormat] = useState("local");
+  const [isModalView, setIsModalView] = useState(false);
   const allowedCountries = useAllowedCountries();
   const isCountryAllowed = (allowedCountries == null ? void 0 : allowedCountries.includes(contextCountry)) ?? true;
   useEffect(() => {
@@ -38785,8 +39340,10 @@ const CoreProvider = ({
     setAccountHolder,
     accountHolder,
     setAccountFormat,
-    accountFormat
-  }), [contextCountry, accountHolder, accountFormat]);
+    accountFormat,
+    setIsModalView,
+    isModalView
+  }), [contextCountry, accountHolder, accountFormat, isModalView]);
   return jsx(CoreContext.Provider, {
     value: contextValue,
     children
@@ -39210,6 +39767,53 @@ function ToastContextProvider({
     }), children]
   });
 }
+const layoutBreakpointClassnames = {
+  xsOnly: "adyen-layout-xs-only",
+  md: "adyen-layout-md",
+  lg: "adyen-layout-lg"
+};
+const layoutBreakpointSizes = {
+  md: 680,
+  lg: 1024
+};
+const getBreakpointClassNames = (containerSize) => {
+  const breakPoints = Object.entries(layoutBreakpointSizes);
+  const classes = breakPoints.reduce((acc, [bp, size]) => {
+    if (size <= containerSize) acc.push(layoutBreakpointClassnames[bp]);
+    return acc;
+  }, []);
+  return classes.length > 0 ? classes : ["adyen-layout-xs-only"];
+};
+function assignLayoutClasses(entries, container) {
+  let newClasses = [];
+  entries.forEach((entry) => {
+    var _a;
+    const parentWidth = (_a = entry.contentBoxSize) == null ? void 0 : _a[0].inlineSize;
+    if (parentWidth) {
+      newClasses = getBreakpointClassNames(parentWidth);
+    } else {
+      newClasses.push(layoutBreakpointClassnames.lg);
+    }
+    container.classList.remove(...Object.values(layoutBreakpointClassnames));
+    container.classList.add(...newClasses);
+  });
+}
+const AutoResizer = ({
+  children
+}) => {
+  const containerRef = useRef(null);
+  useEffect(() => {
+    const container = containerRef.current;
+    if (!container) return;
+    const resizeObserver = new ResizeObserver((entries) => assignLayoutClasses(entries, container));
+    resizeObserver.observe(container);
+    return () => resizeObserver.unobserve(container);
+  });
+  return jsx("div", {
+    ref: containerRef,
+    children
+  });
+};
 class EventEmitter {
   constructor() {
     this.listeners = {
@@ -39353,7 +39957,7 @@ const DebugModal = ({
   };
   const copyToClipboard = async () => {
     const toCopy = {
-      sdkVersion: "2.50.4",
+      sdkVersion: "2.51.0",
       experiments: Object.fromEntries(allExperimentsWithValues),
       settings: Object.fromEntries(allSettingsWithValues)
     };
@@ -39366,7 +39970,7 @@ const DebugModal = ({
       setDebugInfoCopied(false);
     }, 5e3);
   };
-  return jsx(Modal, {
+  return jsx(Modal$1, {
     size: "large",
     header: jsxs(Fragment, {
       children: ["Debug ", jsx(Button, {
@@ -39383,7 +39987,7 @@ const DebugModal = ({
       children: [jsxs("div", {
         className: "adyen-kyc-debug-modal__meta",
         children: [jsxs("span", {
-          children: ["SDK version: ", "2.50.4"]
+          children: ["SDK version: ", "2.51.0"]
         }), jsxs("span", {
           children: ["rootLegalEntityId: ", rootLegalEntityId]
         })]
@@ -40292,6 +40896,11 @@ const createIndividualComponentSchema = {
     type: "function"
   }
 };
+const manageIndividualComponentSchema = {
+  legalEntityId: {
+    type: "string"
+  }
+};
 const viewVerificationStatusComponentSchema = {
   legalEntityId: {
     type: "string",
@@ -40301,7 +40910,8 @@ const viewVerificationStatusComponentSchema = {
     type: "boolean"
   },
   redirectTarget: {
-    type: "string"
+    type: "string",
+    exactValue: ["_self", "_blank"]
   },
   themeId: {
     type: "string"
@@ -40339,6 +40949,7 @@ const componentsSchemaMap = {
   trustDropin: trustDropinSchema,
   taskList: taskListSchema,
   createIndividualComponent: createIndividualComponentSchema,
+  manageIndividualComponent: manageIndividualComponentSchema,
   createTransferInstrumentComponent: createTransferInstrumentComponentSchema,
   viewVerificationStatusComponent: viewVerificationStatusComponentSchema,
   updateLegalEntityForHighExposureComponent: updateLegalEntityForHighExposureComponentSchema