@adyen/kyc-components 4.0.0-beta.5 → 4.0.0-beta.7

package/dist/CountryField-ziRVRc5r.js

@@ -0,0 +1,864 @@
+;
+{
+  try {
+    let e = "undefined" != typeof window ? window : "undefined" != typeof global ? global : "undefined" != typeof globalThis ? globalThis : "undefined" != typeof self ? self : {}, n = new e.Error().stack;
+    n && (e._sentryDebugIds = e._sentryDebugIds || {}, e._sentryDebugIds[n] = "55050852-2ff9-498b-b683-e5f98dac203f", e._sentryDebugIdIdentifier = "sentry-dbid-55050852-2ff9-498b-b683-e5f98dac203f");
+  } catch (e) {
+  }
+}
+;
+import { jsxs, jsx, Fragment } from "preact/jsx-runtime";
+import { B as Button, a as useTranslation, aD as keysOf, aE as remediationHasFileUploadField, az as entriesOf, w as translateStringOrObject, aF as TrustMemberGuidanceLabels, a7 as TrustMemberTypes, ak as DecisionMakerTypes, u as useI18nContext, U as useAnalyticsContext, W as noop, a9 as isEmpty, P as IconButton, t as Svg } from "./StoreProvider-_YW7glEh.js";
+import cx from "classnames";
+import { defineSlots } from "named-slots";
+import { toChildArray, createContext } from "preact";
+import { useContext, useCallback, useMemo } from "preact/hooks";
+import { a as Alert } from "./Alert-JxANwoOi.js";
+import { g as getDataByFields, F as Field, c as Select } from "./useForm-C66YXYZG.js";
+import { u as useDataset, d as datasetIdentifier } from "./useDataset-DgGo4v2J.js";
+const formHeader = "adyen-kyc-form-header";
+const heading = "adyen-kyc-heading";
+const description = "adyen-kyc-description";
+const styles$2 = {
+  formHeader,
+  heading,
+  description
+};
+function FormHeader({ heading: heading2, description: description2, className, children }) {
+  const { Slot, hasSlot } = defineSlots(children ?? [], ["heading", "description"]);
+  return /* @__PURE__ */ jsxs("header", { className: cx(styles$2.formHeader, className), children: [
+    /* @__PURE__ */ jsx(Slot, { name: "heading", children: heading2 && /* @__PURE__ */ jsx("h2", { className: styles$2.heading, children: heading2 }) }),
+    (hasSlot("description") || description2) && /* @__PURE__ */ jsx("div", { className: styles$2.description, children: /* @__PURE__ */ jsx(Slot, { name: "description", children: /* @__PURE__ */ jsx("template", { children: description2 }) }) })
+  ] });
+}
+const list = "adyen-kyc-list";
+const listHeader = "adyen-kyc-list-header";
+const listFooter = "adyen-kyc-list-footer";
+const listItems = "adyen-kyc-list-items";
+const listItemsPlain = "adyen-kyc-list-items-plain";
+const listItemsGroupedPrimary = "adyen-kyc-list-items-grouped-primary";
+const listItemsGroupedSecondary = "adyen-kyc-list-items-grouped-secondary";
+const listItemsPaddingNone = "adyen-kyc-list-items-padding-none";
+const listItemsPaddingSmall = "adyen-kyc-list-items-padding-small";
+const listItemsPaddingMedium = "adyen-kyc-list-items-padding-medium";
+const listItemsPaddingLarge = "adyen-kyc-list-items-padding-large";
+const listItemRowSeparator = "adyen-kyc-list-item-row-separator";
+const styles$1 = {
+  list,
+  listHeader,
+  listFooter,
+  listItems,
+  listItemsPlain,
+  listItemsGroupedPrimary,
+  listItemsGroupedSecondary,
+  listItemsPaddingNone,
+  listItemsPaddingSmall,
+  listItemsPaddingMedium,
+  listItemsPaddingLarge,
+  listItemRowSeparator
+};
+const List = ({
+  children,
+  dividers = true,
+  footer,
+  header,
+  padding = "medium",
+  variant = "plain"
+}) => {
+  const childrenArray = toChildArray(children);
+  const listVariantStyles = {
+    plain: styles$1.listItemsPlain,
+    "grouped-primary": styles$1.listItemsGroupedPrimary,
+    "grouped-secondary": styles$1.listItemsGroupedSecondary
+  };
+  const listClassName = cx(
+    styles$1.listItems,
+    listVariantStyles[variant],
+    variant !== "plain" && {
+      [styles$1.listItemsPaddingSmall]: padding === "small",
+      [styles$1.listItemsPaddingMedium]: padding === "medium",
+      [styles$1.listItemsPaddingLarge]: padding === "large"
+    },
+    {
+      [styles$1.listItemsPaddingNone]: padding === "none"
+    }
+  );
+  return /* @__PURE__ */ jsxs("div", { className: styles$1.list, children: [
+    header && /* @__PURE__ */ jsx("div", { className: styles$1.listHeader, children: header }),
+    /* @__PURE__ */ jsx("ul", { className: listClassName, children: childrenArray.map((item) => {
+      const itemClassname = cx(styles$1.listItem, {
+        [styles$1.listItemRowSeparator]: dividers
+      });
+      return (
+        // Content of <li /> will be unknown. Not including a key is preferred over
+        // using something else, such as index, which may cause problems.
+        // eslint-disable-next-line react/jsx-key
+        /* @__PURE__ */ jsx("li", { className: itemClassname, children: item })
+      );
+    }) }),
+    footer && /* @__PURE__ */ jsx("div", { className: styles$1.listFooter, children: footer })
+  ] });
+};
+const FormRouterContext = createContext(null);
+function useFormRouterContext() {
+  const context = useContext(FormRouterContext);
+  if (process.env.NODE_ENV === "development" && !context) {
+    throw new Error("useFormRouterContext must be used within a FormRouterProvider");
+  }
+  return context;
+}
+const NavigateToFieldLink = ({ fieldName, label }) => {
+  const { goToFormByFieldName } = useFormRouterContext();
+  return /* @__PURE__ */ jsx(
+    Button,
+    {
+      onClick: () => {
+        goToFormByFieldName(fieldName);
+      },
+      variant: "link",
+      children: label
+    }
+  );
+};
+function ServerValidationErrors({
+  validationErrors,
+  formUtils
+}) {
+  const { t } = useTranslation("common");
+  const validationErrorFieldNames = Object.keys(validationErrors || {});
+  const getValidationErrorMessage = useCallback(
+    () => t(($) => $["fieldHasUnsupportedFormats"], {
+      fieldName: formUtils.getLabel(validationErrorFieldNames[0])
+    }),
+    [t, formUtils, validationErrorFieldNames]
+  );
+  return /* @__PURE__ */ jsx(Alert, { title: t(($) => $["informationCouldNotBeSubmitted"]), variant: "error", children: validationErrorFieldNames?.length === 1 ? /* @__PURE__ */ jsxs("div", { "data-testid": "validation-error--case-1", children: [
+    getValidationErrorMessage(),
+    " ",
+    /* @__PURE__ */ jsx(
+      NavigateToFieldLink,
+      {
+        fieldName: validationErrorFieldNames[0],
+        label: t(($) => $["updateTheInformation"])
+      }
+    ),
+    " ",
+    t(($) => $["andResubmit"])
+  ] }) : /* @__PURE__ */ jsxs("div", { "data-testid": "validation-error--case-2", children: [
+    t(($) => $["someFieldsHaveUnsupportedFormatedUpdateInfoAndResubmit"]),
+    /* @__PURE__ */ jsx("ul", { children: validationErrorFieldNames.map((fieldName) => /* @__PURE__ */ jsx(
+      "li",
+      {
+        className: "adyen-kyc-error-panel__validation-error",
+        "data-testid": "adyen-kyc-error-panel__validation-error",
+        children: /* @__PURE__ */ jsx(NavigateToFieldLink, { fieldName, label: formUtils.getLabel(fieldName) })
+      },
+      fieldName
+    )) })
+  ] }) });
+}
+function VerificationErrors({
+  verificationErrors,
+  formUtils
+}) {
+  const { t } = useTranslation("common");
+  const getErrorMessage = (errorCode) => t(($) => $[`errorMessage_${errorCode}`]);
+  const getRemediationMessage = (remediationActions, uploadFieldCollection) => {
+    if (remediationActions?.length === 1) {
+      return t(($) => $[`remediationMessage_${remediationActions[0].code}`]);
+    }
+    const uploadFields = uploadFieldCollection ? Object.keys(uploadFieldCollection) : [];
+    let uploadFilesCopy;
+    if (uploadFields.length > 0) {
+      if (uploadFields.length > 1) {
+        const uploadFieldListItems = uploadFields.map((uploadField) => /* @__PURE__ */ jsx(
+          NavigateToFieldLink,
+          {
+            fieldName: uploadField,
+            label: t(
+              ($) => $[`remediationMessage_${uploadFieldCollection[uploadField]?.remediation.code}`]
+            )
+          },
+          uploadField
+        ));
+        uploadFilesCopy = /* @__PURE__ */ jsxs(Fragment, { children: [
+          formUtils.getLabel("uploadTheFollowingDocuments"),
+          /* @__PURE__ */ jsx("ul", { children: uploadFieldListItems.map((item, i) => /* @__PURE__ */ jsx("li", { children: item }, i)) })
+        ] });
+      } else {
+        const firstUploadField = uploadFields[0];
+        const label = ` ${t(
+          ($) => $[`remediationMessage_${uploadFieldCollection[firstUploadField]?.remediation.code}`]
+        )?.toLowerCase()}`;
+        uploadFilesCopy = /* @__PURE__ */ jsx(NavigateToFieldLink, { fieldName: firstUploadField, label });
+      }
+    }
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      t(($) => $["reviewTheInformationBelowAndCorrectMistakesOr"]),
+      " ",
+      uploadFilesCopy,
+      " ",
+      t(($) => $["thenResubmit"])
+    ] });
+  };
+  let verificationErrorMsg;
+  let parentCode = void 0;
+  const parentCodes = keysOf(verificationErrors);
+  if (parentCodes.length === 1) {
+    parentCode = parentCodes[0];
+  }
+  const childErrors = Object.values(verificationErrors).reduce(
+    (acc, parentChildErrors) => ({
+      ...acc,
+      ...parentChildErrors
+    }),
+    {}
+  );
+  const childErrorCodes = Object.keys(childErrors);
+  const fileUploadRemediationFields = Object.values(childErrors).flat().reduce((acc, rem) => {
+    const isRemUploadOne = remediationHasFileUploadField(rem);
+    const firstRemediationField = rem.fields?.[0];
+    if (isRemUploadOne && firstRemediationField) {
+      acc[firstRemediationField] = {
+        formName: rem?.forms[0],
+        remediation: rem
+      };
+    }
+    return acc;
+  }, {});
+  const onlyChildRemediationActions = Object.values(childErrors).flat();
+  if (childErrorCodes.length === 1) {
+    verificationErrorMsg = /* @__PURE__ */ jsxs(
+      "div",
+      {
+        "data-testid": `verification-error--case-${onlyChildRemediationActions.length === 1 ? "1" : "2-1"}`,
+        children: [
+          /* @__PURE__ */ jsx("span", { children: `${getErrorMessage(childErrorCodes[0])} ` }),
+          /* @__PURE__ */ jsx("span", { children: getRemediationMessage(onlyChildRemediationActions, fileUploadRemediationFields) })
+        ]
+      }
+    );
+  } else if (childErrorCodes.length === 2) {
+    verificationErrorMsg = /* @__PURE__ */ jsxs("div", { "data-testid": "verification-error--case-2-2", children: [
+      t(($) => $["weFoundTheFollowingIssues"]),
+      /* @__PURE__ */ jsx("ul", { children: childErrorCodes.map((subErrorCode) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx("span", { children: getErrorMessage(subErrorCode) }) }, subErrorCode)) }),
+      /* @__PURE__ */ jsx("span", { children: getRemediationMessage(onlyChildRemediationActions, fileUploadRemediationFields) })
+    ] });
+  } else {
+    verificationErrorMsg = /* @__PURE__ */ jsx("div", { "data-testid": "verification-error--case-2-3", children: getRemediationMessage(onlyChildRemediationActions, fileUploadRemediationFields) });
+  }
+  const defaultHeading = parentCode ? getErrorMessage(parentCode) : t(($) => $["correctErrorsResubmit"]);
+  return /* @__PURE__ */ jsx(Alert, { title: defaultHeading, variant: "error", children: verificationErrorMsg });
+}
+function ErrorPanel({
+  id = "ariaErrorField",
+  verificationErrors,
+  validationErrors,
+  formUtils
+}) {
+  const isVerificationError = verificationErrors && Object.keys(verificationErrors).length > 0;
+  const isValidationError = validationErrors && Object.keys(validationErrors).length > 0;
+  if (!isVerificationError && !isValidationError) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "adyen-kyc-error-panel", id, "aria-live": "polite", children: [
+    isVerificationError && !isValidationError && /* @__PURE__ */ jsx(VerificationErrors, { formUtils, verificationErrors }),
+    isValidationError && /* @__PURE__ */ jsx(ServerValidationErrors, { formUtils, validationErrors })
+  ] });
+}
+const createFormUtils = (props, t) => ({
+  getLabel: (field, fallbackLabelKey) => {
+    let translationKey = props.labels?.[field] ?? fallbackLabelKey ?? field;
+    if (props.labels && !props.labels?.[field] && Object.keys(props.labels).length) {
+      const parentKey = Object.keys(props.labels).find(
+        (fieldKey) => typeof props.labels?.[fieldKey] === "object"
+      );
+      if (parentKey) {
+        const nestedLabel = props.labels[parentKey][field];
+        translationKey = nestedLabel ?? translationKey;
+      }
+    }
+    return t(($) => $[translationKey]);
+  },
+  getPlaceholder: (field, fallbackPlaceholderKey) => {
+    const translationKey = fallbackPlaceholderKey ? props.placeholders?.[field] ?? fallbackPlaceholderKey : props.placeholders?.[field];
+    return translationKey ? t(($) => $[translationKey]) : "";
+  },
+  getHelperText: (field, fallbackHelperTextKey) => {
+    const translatable = fallbackHelperTextKey ? props.helperText?.[field] ?? fallbackHelperTextKey : props.helperText?.[field];
+    return translatable ? translateStringOrObject(t, translatable) : "";
+  },
+  getGuidanceText: (field, fallbackGuidanceTextKey) => {
+    const translatable = fallbackGuidanceTextKey ? props.guidanceText?.[field] ?? fallbackGuidanceTextKey : props.guidanceText?.[field];
+    return translatable ? translateStringOrObject(t, translatable) : void 0;
+  },
+  getMask: (field) => props.masks?.[field],
+  isRequiredField: (field, showIfNotInRequiredFields = true) => props.requiredFields ? props.requiredFields.includes(field) && (field !== "role" || field === "role" && props.taskType !== "individual") : showIfNotInRequiredFields,
+  isOptionalField: (field) => props.optionalFields?.includes(field) ?? false,
+  isVisibleField(field, showIfNotInRequiredFields = true) {
+    return this.isRequiredField(field, showIfNotInRequiredFields) || this.isOptionalField(field);
+  },
+  isReadOnly: (field) => props.readOnly || (props.readOnlyFields ? props.readOnlyFields.includes(field) : false),
+  isObscured: (field) => props.obscuredFields ? props.obscuredFields.includes(field) : false,
+  isTrusted: (field) => props.trustedFields ? props.trustedFields.includes(field) : false,
+  getErrorMessage: (field, errors, fieldProblems) => {
+    const errorMessage = errors?.[field]?.errorMessage;
+    return errorMessage || Boolean(fieldProblems?.[field]);
+  },
+  getFieldData: (formData, fieldKeys) => getDataByFields(formData, fieldKeys),
+  getFieldValid: (formValid, fieldKeys) => entriesOf(formValid).reduce(
+    (acc, [key, val]) => fieldKeys.includes(key) ? { ...acc, [key]: val } : acc,
+    {}
+  ),
+  getFieldErrors: (formErrors, fieldProblems, fieldKeys) => Object.keys(formErrors).reduce(
+    (acc, key) => {
+      if (fieldKeys.includes(key)) {
+        const error = formErrors?.[key]?.errorMessage;
+        return error ? { ...acc, [key]: error } : { ...acc, [key]: Boolean(fieldProblems?.[key]) };
+      }
+      return acc;
+    },
+    {}
+  ),
+  getFieldLabels: (fieldKeys, fallbackLabelKeys) => fieldKeys.reduce(
+    (acc, field) => {
+      let translationKey = props.labels?.[field] ?? fallbackLabelKeys?.[field] ?? field;
+      if (props.labels && !props.labels?.[field] && Object.keys(props.labels).length) {
+        const parentKey = Object.keys(props.labels).find(
+          (fieldKey) => typeof props.labels?.[fieldKey] === "object"
+        );
+        if (parentKey) {
+          const nestedLabel = props.labels[parentKey][field];
+          translationKey = nestedLabel ?? translationKey;
+        }
+      }
+      return { ...acc, [field]: t(($) => $[translationKey]) };
+    },
+    {}
+  ),
+  getFieldPlaceholders: (fieldKeys, fallbackPlaceholderKeys) => fieldKeys.reduce(
+    (acc, field) => {
+      const translationKey = fallbackPlaceholderKeys?.[field] ? props.placeholders?.[field] ?? fallbackPlaceholderKeys?.[field] : props.placeholders?.[field];
+      return translationKey ? { ...acc, [field]: t(($) => $[translationKey]) } : acc;
+    },
+    {}
+  ),
+  getFieldHelperText: (fieldKeys, fallbackHelperTextKeys) => fieldKeys.reduce(
+    (acc, field) => {
+      const translatable = fallbackHelperTextKeys?.[field] ? props.helperText?.[field] ?? fallbackHelperTextKeys?.[field] : props.helperText?.[field];
+      return translatable ? { ...acc, field: translateStringOrObject(t, translatable) } : acc;
+    },
+    {}
+  ),
+  getFieldGuidanceText: (fieldKeys, fallbackGuidanceTextKeys) => fieldKeys.reduce(
+    (acc, field) => {
+      const translatable = fallbackGuidanceTextKeys?.[field] ? props.guidanceText?.[field] ?? fallbackGuidanceTextKeys?.[field] : props.guidanceText?.[field];
+      return translatable ? { ...acc, [field]: translateStringOrObject(t, translatable) } : acc;
+    },
+    {}
+  )
+});
+const mergeFieldMetadataIntoProps = (fieldName, metadata, otherProps) => {
+  const existingProps = otherProps ?? {};
+  return {
+    ...existingProps,
+    labels: {
+      ...existingProps.labels,
+      [fieldName]: metadata.label
+    },
+    placeholders: {
+      ...existingProps.placeholders,
+      [fieldName]: metadata.placeholder
+    },
+    helperText: {
+      ...existingProps.helperText,
+      [fieldName]: metadata.helperText
+    },
+    guidanceText: {
+      ...existingProps.guidanceText,
+      [fieldName]: metadata.guidanceText
+    },
+    masks: {
+      ...existingProps.masks,
+      [fieldName]: metadata.mask
+    },
+    validators: {
+      ...existingProps.validators,
+      [fieldName]: metadata.validators
+    }
+  };
+};
+const UnincorporatedPartnershipMemberTypes = {
+  SECONDARY_PARTNER: "secondaryPartner",
+  OWNER: "uboThroughOwnership",
+  CONTROLLING_PERSON: "uboThroughControl"
+};
+const roleMetadata = {
+  [DecisionMakerTypes.CONTROLLING_PERSON]: {
+    name: "controllingPerson",
+    description: "controllingPersonDescription"
+  },
+  [DecisionMakerTypes.OWNER]: {
+    name: "owner",
+    description: "ownerDescription"
+  },
+  [DecisionMakerTypes.SIGNATORY]: {
+    name: "signatory",
+    description: "signatoryDescription"
+  },
+  [DecisionMakerTypes.DIRECTOR]: {
+    name: "director",
+    description: "directorDescription"
+  },
+  [TrustMemberTypes.DEFINED_BENEFICIARY]: {
+    name: "definedBeneficiary",
+    description: "definedBeneficiaryDescription"
+  },
+  [TrustMemberTypes.UNDEFINED_BENEFICIARY]: {
+    name: "undefinedBeneficiary",
+    description: "undefinedBeneficiaryDescription"
+  },
+  [TrustMemberTypes.PROTECTOR]: {
+    name: "protector",
+    description: "personAppointmentUnderTrustInstrument"
+  },
+  [TrustMemberTypes.TRUSTEE]: {
+    name: "trustee",
+    description: "legalOwnerOfProperty"
+  },
+  [TrustMemberTypes.SETTLOR]: {
+    name: "settlor",
+    description: "entityEstablishingTrust"
+  },
+  [TrustMemberGuidanceLabels.BENEFICIARY]: {
+    name: TrustMemberGuidanceLabels.BENEFICIARY
+  },
+  [TrustMemberGuidanceLabels.TRUSTEE]: {
+    name: TrustMemberGuidanceLabels.TRUSTEE
+  },
+  [UnincorporatedPartnershipMemberTypes.SECONDARY_PARTNER]: {
+    name: UnincorporatedPartnershipMemberTypes.SECONDARY_PARTNER,
+    description: "secondaryPartnerGuideDescription"
+  }
+};
+const getRoleTagVariant = (role) => roleMetadata[role]?.variant ?? "blue";
+const getRoleName = (role) => roleMetadata[role]?.name ?? role;
+const summary = "adyen-kyc-summary";
+const summaryContent = "adyen-kyc-summary-content";
+const summaryList = "adyen-kyc-summary-list";
+const summaryListHeader = "adyen-kyc-summary-list-header";
+const summaryListHeaderTitle = "adyen-kyc-summary-list-header-title";
+const summaryListItem = "adyen-kyc-summary-list-item";
+const summaryListItemKey = "adyen-kyc-summary-list-item-key";
+const summaryListItemValue = "adyen-kyc-summary-list-item-value";
+const summaryContentLegalCaption = "adyen-kyc-summary-content-legal-caption";
+const summaryContentList = "adyen-kyc-summary-content-list";
+const summaryContentLogo = "adyen-kyc-summary-content-logo";
+const styles = {
+  summary,
+  summaryContent,
+  summaryList,
+  summaryListHeader,
+  summaryListHeaderTitle,
+  summaryListItem,
+  summaryListItemKey,
+  summaryListItemValue,
+  summaryContentLegalCaption,
+  summaryContentList,
+  summaryContentLogo
+};
+const isSummaryItem = (val) => typeof val === "object" && val !== null && "summaryLabel" in val && "summaryValue" in val;
+const summaryItem = (summaryLabel, summaryValue) => ({
+  summaryLabel,
+  summaryValue
+});
+const summaryStep = {
+  formId: "summary",
+  formName: "summary"
+};
+function Summary({
+  data,
+  forms,
+  gotoForm,
+  labels,
+  problems,
+  trackNavigation = noop,
+  omitted = {},
+  showFormHeader = true,
+  showSectionHeader = true,
+  showLegalCaption = false,
+  showTaxExemptedLegalCaption = false
+}) {
+  const { i18n } = useI18nContext();
+  const { t } = useTranslation("common");
+  const userEvents = useAnalyticsContext();
+  const editForm = (formId) => {
+    const formIndex = forms.findIndex((form) => form.formId === formId);
+    if (formIndex >= 0) {
+      gotoForm(formIndex);
+    }
+  };
+  const allValidationErrors = problems?.validationErrors && Object.values(problems.validationErrors)?.reduce(
+    (acc, validError) => ({ ...acc, ...validError }),
+    {}
+  );
+  const allVerificationErrors = problems?.verificationErrors && Object.values(problems.verificationErrors)?.reduce(
+    (acc, verifError) => ({ ...acc, ...verifError }),
+    {}
+  );
+  const formUtils = createFormUtils({ labels }, t);
+  const summarySectionHeader = (formName, formId) => /* @__PURE__ */ jsxs("header", { className: styles.summaryListHeader, children: [
+    /* @__PURE__ */ jsx("h2", { className: styles.summaryListHeaderTitle, children: formName }),
+    !omitted.keys?.includes(formId) && /* @__PURE__ */ jsx(
+      IconButton,
+      {
+        variant: "tertiary",
+        icon: "edit",
+        onClick: () => {
+          trackNavigation({
+            userEvents,
+            actionType: "edit",
+            toForm: formName,
+            label: "Pencil icon"
+          });
+          editForm(formId);
+        },
+        ariaLabel: t(($) => $["editForm"], { formName })
+      }
+    )
+  ] });
+  const renderSummarySection = (fieldData, labelData = {}, formName, formId) => /* @__PURE__ */ jsxs(List, { variant: "grouped-secondary", children: [
+    showSectionHeader && summarySectionHeader(formName, formId),
+    /* @__PURE__ */ jsx("dl", { className: styles.summaryList, children: Array.isArray(fieldData) ? fieldData.map((item) => renderBulletedListField(item)) : renderSummaryItems(fieldData, labelData) })
+  ] });
+  const renderSummaryContent = (summaryData) => {
+    const summaryList2 = [];
+    forms.forEach(({ formId, formName }) => {
+      const currentFormData = summaryData[formId];
+      const isFormEmpty = !currentFormData || Object.values(currentFormData).every((value) => isEmpty(value));
+      if (isFormEmpty || formId === summaryStep.formId || omitted.forms?.includes(formId)) return;
+      const summaryItems = currentFormData.hasInnerForms ? renderInnerForms(labels?.[formId], formId, currentFormData) : renderSummarySection(
+        currentFormData,
+        labels?.[formId],
+        t(
+          ($) => $[typeof labels?.[formId] === "string" ? labels[formId] : formName]
+        ),
+        formId
+      );
+      summaryList2.push(summaryItems);
+    });
+    return summaryList2;
+  };
+  const renderInnerForms = (labelData, parentFormId, innerForms = {}) => {
+    if (!innerForms) return [];
+    const dataList = [];
+    Object.entries(innerForms).forEach(([innerFormName, innerFormFieldData]) => {
+      const formName = t(($) => $[labelData?.[innerFormName] || innerFormName]);
+      if (typeof innerFormFieldData === "object" && innerFormFieldData !== null) {
+        if (Object.values(innerFormFieldData).every((value) => isEmpty(value))) {
+          return;
+        }
+        dataList.push(renderSummarySection(innerFormFieldData, labelData, formName, parentFormId));
+      }
+    });
+    return dataList;
+  };
+  const renderField = (label, value) => /* @__PURE__ */ jsxs("div", { className: styles.summaryListItem, children: [
+    /* @__PURE__ */ jsx("dt", { className: styles.summaryListItemKey, children: label }),
+    /* @__PURE__ */ jsx("dd", { className: styles.summaryListItemValue, children: value })
+  ] });
+  const renderBulletedListField = (item) => /* @__PURE__ */ jsx("ul", { className: styles.summaryContentList, children: /* @__PURE__ */ jsx("li", { children: item }) });
+  const renderSummaryItems = (formData = {}, labelData = {}) => {
+    if (!formData) return [];
+    if (formData?.idVerificationMethod === "instantVerification") {
+      return [
+        renderField(
+          i18n.get("verificationMethod"),
+          /* @__PURE__ */ jsx(Svg, { name: "onfido-logo", type: "image", className: styles.summaryContentLogo })
+        )
+      ];
+    }
+    const dataList = [];
+    Object.entries(formData).forEach(([field, fieldData]) => {
+      if (omitted.keys?.includes(field) || !fieldData) return;
+      const fieldName = t(($) => $[labelData[field] || field]);
+      if (field === "role" && Array.isArray(fieldData)) {
+        const label = fieldData.length > 1 ? t(($) => $["roles"]) : fieldName;
+        const roles = fieldData.map((role) => t(($) => $[getRoleName(role)])).join(", ");
+        dataList.push(renderField(label, roles));
+      } else if (isSummaryItem(fieldData)) {
+        const { summaryLabel, summaryValue } = fieldData;
+        dataList.push(renderField(translateStringOrObject(t, summaryLabel), summaryValue));
+      } else if (typeof fieldData === "object") {
+        dataList.push(renderSummaryItems(fieldData, labelData));
+      } else if (["string", "number"].includes(typeof fieldData)) {
+        dataList.push(renderField(fieldName, fieldData));
+      }
+    });
+    return dataList;
+  };
+  return /* @__PURE__ */ jsxs("div", { role: "region", className: styles.summary, children: [
+    showFormHeader && /* @__PURE__ */ jsx(
+      FormHeader,
+      {
+        heading: t(($) => $["summary"]),
+        description: t(($) => $["summaryDescription"])
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { className: styles.summaryContent, children: [
+      /* @__PURE__ */ jsx(
+        ErrorPanel,
+        {
+          validationErrors: allValidationErrors,
+          verificationErrors: allVerificationErrors,
+          formUtils,
+          id: "ariaErrorField"
+        }
+      ),
+      renderSummaryContent(data),
+      showLegalCaption && /* @__PURE__ */ jsx("div", { className: styles.summaryContentLegalCaption, children: t(($) => $["summaryLegalCaption"]) }),
+      showTaxExemptedLegalCaption && /* @__PURE__ */ jsxs("div", { className: styles.summaryContentLegalCaption, children: [
+        /* @__PURE__ */ jsx("p", { children: t(($) => $["summaryTaxExemptionLegalCaptionTitle"]) }),
+        /* @__PURE__ */ jsxs("ul", { children: [
+          /* @__PURE__ */ jsx("li", { children: t(($) => $["summaryTaxExemptionLegalCaption_1"]) }),
+          /* @__PURE__ */ jsx("li", { children: t(($) => $["summaryTaxExemptionLegalCaption_2"]) }),
+          /* @__PURE__ */ jsx("li", { children: t(($) => $["summaryTaxExemptionLegalCaption_3"]) })
+        ] })
+      ] })
+    ] })
+  ] });
+}
+function getFormProps(props, innerFormId) {
+  if (!innerFormId) {
+    return null;
+  }
+  const activeFormId = props.activeForm?.formId;
+  const trustedFields = props.trustedFields?.[innerFormId] ?? [];
+  const readOnlyFields = props.readOnlyFields?.[innerFormId] ?? [];
+  return {
+    placeholders: props.placeholders?.[innerFormId] ?? {},
+    labels: props.labels?.[innerFormId] ?? {},
+    helperText: props.helperText?.[innerFormId] ?? {},
+    masks: props.masks?.[innerFormId] ?? {},
+    data: props.data?.[innerFormId] ?? {},
+    allFields: props.allFields?.[innerFormId] ?? [],
+    readOnlyFields: [...readOnlyFields, ...trustedFields],
+    requiredFields: props.requiredFields?.[innerFormId] ?? [],
+    optionalFields: props.optionalFields?.[innerFormId] ?? [],
+    obscuredFields: props.obscuredFields?.[innerFormId] ?? [],
+    verifyFields: props.verifyFields?.[innerFormId] ?? [],
+    trustedFields,
+    trustedFieldsProvider: props.trustedFields,
+    formVerificationErrors: props.problems?.verificationErrors?.[innerFormId] ?? {},
+    fieldValidationErrors: props.problems?.validationErrors?.[innerFormId] ?? {},
+    /*
+        Validators should be `null` and not `{}` by default to make it easier to short circuit it with predetermined validators.
+        For example `rules: props.validators || personalDetailsValidationRules`.
+       */
+    validators: props.validators?.[innerFormId] ? { ...props.validators?.[innerFormId] } : null,
+    /*
+        activeForm check is required for shouldValidate because we render all forms in a multistep form.
+        Should be changed once stateManagement is fixed and this is no longer the case
+      */
+    shouldValidate: (activeFormId ? activeFormId === innerFormId : true) && props.shouldValidate
+  };
+}
+function getNestedOuterFormPropsFromOuterFormProps(props, innerFormId) {
+  const newProps = getFormProps(
+    props,
+    innerFormId
+  );
+  if (newProps === null) {
+    return null;
+  }
+  const { placeholders, labels, data, helperText, masks } = newProps;
+  const {
+    readOnlyFields,
+    requiredFields,
+    optionalFields,
+    obscuredFields,
+    verifyFields,
+    trustedFields,
+    problems,
+    validators,
+    shouldValidate
+  } = props;
+  return {
+    placeholders,
+    labels,
+    data,
+    helperText,
+    masks,
+    // maintain the structure of the special fields
+    readOnlyFields,
+    requiredFields,
+    optionalFields,
+    obscuredFields,
+    verifyFields,
+    trustedFields,
+    // the rest we just pass along for now, as they will be eventually be processed by getFormProps
+    problems,
+    validators,
+    shouldValidate
+  };
+}
+function getFieldProps(props, innerFormFields) {
+  if (innerFormFields) {
+    const nestedFormProps = {
+      placeholders: {},
+      labels: {},
+      helperText: {},
+      masks: {},
+      data: {},
+      allFields: [],
+      requiredFields: [],
+      obscuredFields: [],
+      optionalFields: [],
+      readOnlyFields: [],
+      verifyFields: [],
+      trustedFields: [],
+      fieldValidationErrors: {},
+      errors: {},
+      valid: {}
+    };
+    innerFormFields.forEach((field) => {
+      nestedFormProps.placeholders[field] = props.placeholders?.[field];
+      nestedFormProps.labels[field] = props.labels?.[field];
+      nestedFormProps.helperText[field] = props.helperText?.[field];
+      nestedFormProps.masks[field] = props.masks?.[field];
+      nestedFormProps.data[field] = props.data?.[field];
+      if (props.allFields?.includes(field)) {
+        nestedFormProps.allFields.push(field);
+      }
+      if (props.readOnlyFields?.includes(field)) {
+        nestedFormProps.readOnlyFields.push(field);
+      }
+      if (props.requiredFields?.includes(field)) {
+        nestedFormProps.requiredFields.push(field);
+      }
+      if (props.optionalFields?.includes(field)) {
+        nestedFormProps.optionalFields.push(field);
+      }
+      if (props.verifyFields?.includes(field)) {
+        nestedFormProps.verifyFields.push(field);
+      }
+      if (props.fieldValidationErrors?.[field]) {
+        nestedFormProps.fieldValidationErrors[field] = props.fieldValidationErrors[field];
+      }
+      if (props.obscuredFields?.includes(field)) {
+        nestedFormProps.obscuredFields.push(field);
+      }
+      if (props.trustedFields?.includes(field)) {
+        nestedFormProps.trustedFields.push(field);
+      }
+      if (props.validators?.[field]) {
+        if (!nestedFormProps?.validators) {
+          nestedFormProps.validators = {};
+        }
+        nestedFormProps.validators[field] = props.validators?.[field];
+      }
+      if (props.errors?.[field]) {
+        nestedFormProps.errors[field] = props.errors?.[field];
+      }
+      if (props.valid?.[field]) {
+        nestedFormProps.valid[field] = props.valid?.[field];
+      }
+    });
+    nestedFormProps.shouldValidate = props.shouldValidate;
+    nestedFormProps.handleFieldChange = props.handleFieldChange;
+    return nestedFormProps;
+  }
+  return null;
+}
+const Radio = ({
+  id,
+  value,
+  groupName,
+  checked = false,
+  disabled = false,
+  onClick,
+  className,
+  "aria-labelledby": ariaLabelledBy,
+  "aria-describedby": ariaDescribedBy
+}) => /* @__PURE__ */ jsx(
+  "input",
+  {
+    "aria-labelledby": ariaLabelledBy,
+    "aria-describedby": ariaDescribedBy,
+    className: cx(["adyen-kyc-input-radio__input", className]),
+    id,
+    type: "radio",
+    checked,
+    name: groupName,
+    onClick,
+    value,
+    disabled
+  }
+);
+const COUNTRY_FIELD = ["country"];
+function CountryField({
+  name = "country",
+  data,
+  valid,
+  errors,
+  labels,
+  readonly,
+  handleChangeFor,
+  helperText,
+  allowedCountries,
+  handleBlur
+}) {
+  const { t } = useTranslation("common");
+  const { dataset: countriesFromApi } = useDataset(datasetIdentifier.country);
+  const countries = useMemo(
+    () => countriesFromApi.filter(
+      (country) => allowedCountries ? allowedCountries.includes(country.id) : true
+    ),
+    [allowedCountries, countriesFromApi]
+  );
+  return /* @__PURE__ */ jsx(
+    Field,
+    {
+      name,
+      label: labels?.country || t(($) => $["country"]),
+      errorMessage: errors.country,
+      isValid: valid.country,
+      helper: helperText?.country,
+      dataTestId: "country",
+      children: (childProps) => /* @__PURE__ */ jsx(
+        Select,
+        {
+          ...childProps,
+          name,
+          placeholder: t(($) => $["selectCountryRegion"]),
+          selected: data.country,
+          items: countries,
+          readonly: (countries.length === 1 || readonly) && !!data,
+          onChange: handleChangeFor("country"),
+          onBlur: handleBlur
+        }
+      )
+    }
+  );
+}
+export {
+  CountryField as C,
+  ErrorPanel as E,
+  FormHeader as F,
+  Radio as R,
+  Summary as S,
+  UnincorporatedPartnershipMemberTypes as U,
+  COUNTRY_FIELD as a,
+  getRoleName as b,
+  createFormUtils as c,
+  summaryStep as d,
+  getRoleTagVariant as e,
+  getFormProps as f,
+  getFieldProps as g,
+  FormRouterContext as h,
+  getNestedOuterFormPropsFromOuterFormProps as i,
+  mergeFieldMetadataIntoProps as m,
+  roleMetadata as r,
+  summaryItem as s,
+  useFormRouterContext as u
+};