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

package/dist/CountryField-9w8wRZMW.js

@@ -0,0 +1,843 @@
+;
+{
+  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] = "343b6d29-8314-4477-a7f2-bca35e7b8770", e._sentryDebugIdIdentifier = "sentry-dbid-343b6d29-8314-4477-a7f2-bca35e7b8770");
+  } catch (e) {
+  }
+}
+;
+import { jsx, jsxs, Fragment as Fragment$1 } from "preact/jsx-runtime";
+import cx from "classnames";
+import { defineSlots } from "named-slots";
+import { toChildArray, Fragment, createContext } from "preact";
+import { T as TaskVerificationStatus } from "./InputText-Dsw9kiwL.js";
+import { useContext, useCallback, useMemo } from "preact/hooks";
+import { a as Alert } from "./Alert-DEiOX0nw.js";
+import { B as Button, u as useTranslation, ap as keysOf, aS as remediationHasFileUploadField, $ as entriesOf, G as translateStringOrObject, aT as TrustMemberGuidanceLabels, ag as TrustMemberTypes, am as DecisionMakerTypes, X as isEmpty, a3 as Icon } from "./StoreProvider-BFN15Go9.js";
+import { g as getDataByFields, F as Field, S as Select } from "./useForm-wQyeWa1b.js";
+import { u as useDataset, d as datasetIdentifier } from "./useDataset-BtfHQp4w.js";
+const stackLayout = "adyen-kyc-stack-layout";
+const stackLayoutGapXs = "adyen-kyc-stack-layout-gap-xs";
+const stackLayoutGapS = "adyen-kyc-stack-layout-gap-s";
+const stackLayoutGapM = "adyen-kyc-stack-layout-gap-m";
+const stackLayoutGapL = "adyen-kyc-stack-layout-gap-l";
+const stackLayoutGapXl = "adyen-kyc-stack-layout-gap-xl";
+const stackLayoutLeft = "adyen-kyc-stack-layout-left";
+const stackLayoutCenter = "adyen-kyc-stack-layout-center";
+const stackLayoutRight = "adyen-kyc-stack-layout-right";
+const stackLayoutItem = "adyen-kyc-stack-layout-item";
+const stackLayoutHorizontal = "adyen-kyc-stack-layout-horizontal";
+const stackLayoutLeftHorizontal = "adyen-kyc-stack-layout-left-horizontal";
+const stackLayoutCenterHorizontal = "adyen-kyc-stack-layout-center-horizontal";
+const stackLayoutRightHorizontal = "adyen-kyc-stack-layout-right-horizontal";
+const styles$3 = {
+  stackLayout,
+  stackLayoutGapXs,
+  stackLayoutGapS,
+  stackLayoutGapM,
+  stackLayoutGapL,
+  stackLayoutGapXl,
+  stackLayoutLeft,
+  stackLayoutCenter,
+  stackLayoutRight,
+  stackLayoutItem,
+  stackLayoutHorizontal,
+  stackLayoutLeftHorizontal,
+  stackLayoutCenterHorizontal,
+  stackLayoutRightHorizontal
+};
+const gapStyles = {
+  xSmall: styles$3.stackLayoutGapXs,
+  small: styles$3.stackLayoutGapS,
+  medium: styles$3.stackLayoutGapM,
+  large: styles$3.stackLayoutGapL,
+  xLarge: styles$3.stackLayoutGapXl,
+  none: null
+};
+const alignStyles = {
+  left: styles$3.stackLayoutLeft,
+  center: styles$3.stackLayoutCenter,
+  right: styles$3.stackLayoutRight,
+  auto: null
+};
+const horizontalAlignStyles = {
+  left: styles$3.stackLayoutLeftHorizontal,
+  center: styles$3.stackLayoutCenterHorizontal,
+  right: styles$3.stackLayoutRightHorizontal,
+  auto: null
+};
+const flattenChildren = (children) => {
+  return toChildArray(children).flatMap((child) => {
+    if (typeof child === "object" && child.type === Fragment) {
+      return flattenChildren(child.props.children);
+    }
+    return child;
+  });
+};
+const StackLayout = ({
+  align = "auto",
+  children,
+  gap = "medium",
+  horizontal = false
+}) => {
+  const flattenedChildren = flattenChildren(children);
+  const rootClassname = cx(styles$3.stackLayout, gapStyles[gap], alignStyles[align], {
+    [horizontalAlignStyles[align]]: horizontal,
+    [styles$3.stackLayoutHorizontal]: horizontal
+  });
+  return /* @__PURE__ */ jsx("div", { className: rootClassname, children: flattenedChildren.map((item, i) => {
+    if (align === "auto") {
+      return /* @__PURE__ */ jsx("div", { className: styles$3.stackLayoutItem, children: item }, item.key ?? i);
+    }
+    return item;
+  }) });
+};
+const header = "adyen-kyc-header";
+const headerMargin = "adyen-kyc-header-margin";
+const headerMarginSecondary = "adyen-kyc-header-margin-secondary";
+const headerLeft = "adyen-kyc-header-left";
+const headerCenter = "adyen-kyc-header-center";
+const headerRight = "adyen-kyc-header-right";
+const headerContent = "adyen-kyc-header-content";
+const headerActions = "adyen-kyc-header-actions";
+const headerTitle = "adyen-kyc-header-title";
+const headerTitlePrimary = "adyen-kyc-header-title-primary";
+const headerTitleSecondary = "adyen-kyc-header-title-secondary";
+const headerDescription = "adyen-kyc-header-description";
+const headerDescriptionPrimary = "adyen-kyc-header-description-primary";
+const headerDescriptionSecondary = "adyen-kyc-header-description-secondary";
+const styles$2 = {
+  header,
+  headerMargin,
+  headerMarginSecondary,
+  headerLeft,
+  headerCenter,
+  headerRight,
+  headerContent,
+  headerActions,
+  headerTitle,
+  headerTitlePrimary,
+  headerTitleSecondary,
+  headerDescription,
+  headerDescriptionPrimary,
+  headerDescriptionSecondary
+};
+const alignmentStyles = {
+  left: styles$2.headerLeft,
+  center: styles$2.headerCenter,
+  right: styles$2.headerRight
+};
+const Header = ({
+  align = "left",
+  children,
+  description,
+  secondary = false,
+  status,
+  title
+}) => {
+  const { Slot, hasSlot } = defineSlots(children ?? [], ["actions", "description"]);
+  const HeadingElement = secondary ? "h2" : "h1";
+  const rootClassname = cx(styles$2.header, alignmentStyles[align], {
+    [styles$2.headerMargin]: !secondary,
+    [styles$2.headerMarginSecondary]: secondary
+  });
+  const titleClassname = cx(styles$2.headerTitle, {
+    [styles$2.headerTitlePrimary]: !secondary,
+    [styles$2.headerTitleSecondary]: secondary
+  });
+  const descriptionClassname = cx(styles$2.headerDescription, {
+    [styles$2.headerDescriptionPrimary]: !secondary,
+    [styles$2.headerDescriptionSecondary]: secondary
+  });
+  return /* @__PURE__ */ jsxs("header", { className: rootClassname, children: [
+    status && /* @__PURE__ */ jsx(TaskVerificationStatus, { status, responsive: false }),
+    /* @__PURE__ */ jsxs("div", { className: styles$2.headerContent, children: [
+      /* @__PURE__ */ jsx(HeadingElement, { className: titleClassname, children: title }),
+      (hasSlot("description") || description) && /* @__PURE__ */ jsx("div", { className: descriptionClassname, children: /* @__PURE__ */ jsx(Slot, { name: "description", children: description }) })
+    ] }),
+    hasSlot("actions") && /* @__PURE__ */ jsx("div", { className: styles$2.headerActions, children: /* @__PURE__ */ jsx(StackLayout, { gap: "small", horizontal: true, children: /* @__PURE__ */ jsx(Slot, { name: "actions" }) }) })
+  ] });
+};
+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: header2,
+  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: [
+    header2 && /* @__PURE__ */ jsx("div", { className: styles$1.listHeader, children: header2 }),
+    /* @__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);
+  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("ui");
+  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$1, { 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$1, { 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 isSummaryItem = (val) => typeof val === "object" && val !== null && "summaryLabel" in val && "summaryValue" in val;
+const summaryItem = (summaryLabel, summaryValue) => ({
+  summaryLabel,
+  summaryValue
+});
+const isTruthyValidator = {
+  validate: (value) => !!value,
+  modes: ["blur"],
+  errorMessage: "fieldIsRequired"
+};
+const isNotEmptyValidator = {
+  validate: (value) => !isEmpty(value),
+  modes: ["blur"],
+  errorMessage: "fieldIsRequired"
+};
+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 link = "adyen-kyc-link";
+const linkDefault = "adyen-kyc-link-default";
+const linkInline = "adyen-kyc-link-inline";
+const styles = {
+  link,
+  linkDefault,
+  linkInline
+};
+const Link = ({ children, external = false, href, inline = false }) => {
+  const rel = external ? "external noopener noreferrer" : void 0;
+  const target = external ? "_blank" : "_self";
+  const className = cx(styles.link, {
+    [styles.linkInline]: inline,
+    [styles.linkDefault]: !inline
+  });
+  return /* @__PURE__ */ jsxs("a", { className, href, rel, target, children: [
+    children,
+    external && !inline && /* @__PURE__ */ jsx(Icon, { name: "external-link" })
+  ] });
+};
+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,
+  FormRouterContext as F,
+  Header as H,
+  List as L,
+  Radio as R,
+  StackLayout as S,
+  UnincorporatedPartnershipMemberTypes as U,
+  Link as a,
+  COUNTRY_FIELD as b,
+  createFormUtils as c,
+  getFieldProps as d,
+  isNotEmptyValidator as e,
+  getRoleName as f,
+  getFormProps as g,
+  isSummaryItem as h,
+  isTruthyValidator as i,
+  getRoleTagVariant as j,
+  getNestedOuterFormPropsFromOuterFormProps as k,
+  mergeFieldMetadataIntoProps as m,
+  roleMetadata as r,
+  summaryItem as s,
+  useFormRouterContext as u
+};