@adyen/kyc-components 3.81.0 → 3.82.0-beta.0

package/dist/{bafinUtils-T6TnU7m4.js → bafinUtils-BmLu7dPk.js}

@@ -2,14 +2,18 @@
 {
   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] = "9d231bb1-fd43-4a1c-9eba-f76a42d3ee06", e._sentryDebugIdIdentifier = "sentry-dbid-9d231bb1-fd43-4a1c-9eba-f76a42d3ee06");
+    n && (e._sentryDebugIds = e._sentryDebugIds || {}, e._sentryDebugIds[n] = "97cb2b4e-0484-4747-90d5-3a0d58dabf1d", e._sentryDebugIdIdentifier = "sentry-dbid-97cb2b4e-0484-4747-90d5-3a0d58dabf1d");
   } catch (e) {
   }
 }
 ;
-import { useReducer, useMemo } from "preact/hooks";
-import { a as useApiContext, r as useQuery, t as httpPost, aa as useExperimentsContext, g as getLegalEntityCountry, at as CountryCodes, P as isPartOfTrustFromLegalEntity, O as LegalEntityTypes, U as hasSolePropInLegalEntity, b5 as TrustedFieldsProviders, b8 as individualComponentsKeyMapping, b9 as businessDetailsComponentsKeyMapping, N as Typography, ba as DecisionMakerTypes, $ as TaskTypes, bb as Scenarios } from "./StoreProvider-pdSV8sgb.js";
-import { jsx, jsxs } from "preact/jsx-runtime";
+import { useReducer, useMemo, useContext } from "preact/hooks";
+import { b as useApiContext, j as useQuery, k as httpPost, X as useExperimentsContext, g as getLegalEntityCountry, a8 as CountryCodes, z as isPartOfTrustFromLegalEntity, y as LegalEntityTypes, C as hasSolePropInLegalEntity, ah as individualComponentsKeyMapping, ai as businessDetailsComponentsKeyMapping, aj as SettingsContext, a as useTranslation, x as Typography, ak as DecisionMakerTypes, M as TaskTypes, al as Scenarios } from "./StoreProvider-B_tFiIdr.js";
+import { e as TrustedFieldsProviders } from "./fieldConfigurations-Yf8yD64w.js";
+import { jsxs, jsx } from "preact/jsx-runtime";
+import { F as Field, S as SelectListItem } from "./useForm-Dah8AZ3S.js";
+import { I as InputText } from "./InputText-Ds8RrvJq.js";
+import { c as createFormUtils, r as roleMetadata } from "./CountryField-B2dh1VXh.js";
 import cx from "classnames";
 import { signal, computed } from "@preact/signals";
 async function convertToSingpassLinkResponse(openIdInitiateResponse) {
@@ -170,6 +174,141 @@ const useSingpassMyInfoLogin = ({
     trustedEntityAssociations
   };
 };
+const useSetting = (settingName) => {
+  const context = useContext(SettingsContext);
+  if (process.env.NODE_ENV === "development" && context === void 0) {
+    throw new Error("useSetting must be used within a SettingsProvider");
+  }
+  const { getSetting } = context;
+  return getSetting(settingName);
+};
+const CompanyTypesValues = {
+  PRIVATE_COMPANY: "privateCompany",
+  PUBLIC_COMPANY: "listedPublicCompany",
+  UNLISTED_PUBLIC_COMPANY: "unlistedPublicCompany",
+  UNINCORPORATED_PARTNERSHIP: "unincorporatedPartnership",
+  INCORPORATED_PARTNERSHIP: "partnershipIncorporated",
+  INCORPORATED_ASSOCIATION: "associationIncorporated",
+  GOVERNMENTAL_ORGANIZATION: "governmentalOrganization",
+  NON_PROFIT_OR_CHARITABLE: "nonProfit",
+  SOLE_PROPRIETORSHIP: "soleProprietorship"
+};
+const nameFields = ["firstName", "lastName"];
+function Name(props) {
+  const { data, handleFieldChange, errors, valid, fieldValidationErrors } = props;
+  const { t } = useTranslation("common");
+  if (!handleFieldChange) {
+    return;
+  }
+  const formUtils = createFormUtils(props, t);
+  return /* @__PURE__ */ jsxs("div", { className: "adyen-kyc-field-wrapper", children: [
+    formUtils.isRequiredField("firstName") && /* @__PURE__ */ jsx(
+      Field,
+      {
+        name: "firstName",
+        label: formUtils.getLabel("firstName"),
+        className: "adyen-kyc-u-width-half",
+        errorMessage: formUtils.getErrorMessage("firstName", errors, fieldValidationErrors),
+        isValid: valid?.firstName,
+        helper: formUtils.getLabel("enterNameExactlyAsAppearInID"),
+        children: (childProps) => /* @__PURE__ */ jsx(
+          InputText,
+          {
+            ...childProps,
+            name: "firstName",
+            value: data?.firstName,
+            readonly: formUtils.isReadOnly("firstName"),
+            onInput: handleFieldChange("firstName", "input"),
+            onBlur: handleFieldChange("firstName", "blur"),
+            trimOnBlur: true,
+            spellCheck: false,
+            "aria-required": true,
+            "aria-invalid": !valid?.firstName
+          }
+        )
+      }
+    ),
+    formUtils.isRequiredField("lastName") && /* @__PURE__ */ jsx(
+      Field,
+      {
+        name: "lastName",
+        label: formUtils.getLabel("lastName"),
+        className: "adyen-kyc-u-width-half",
+        errorMessage: formUtils.getErrorMessage("lastName", errors, fieldValidationErrors),
+        isValid: valid?.lastName,
+        helper: formUtils.getLabel("enterLastNameExactlyAsAppearInID"),
+        children: (childProps) => /* @__PURE__ */ jsx(
+          InputText,
+          {
+            ...childProps,
+            name: "lastName",
+            value: data?.lastName,
+            readonly: formUtils.isReadOnly("lastName"),
+            onInput: handleFieldChange("lastName", "input"),
+            onBlur: handleFieldChange("lastName", "blur"),
+            trimOnBlur: true,
+            spellCheck: false,
+            "aria-required": true,
+            "aria-invalid": !valid?.lastName
+          }
+        )
+      }
+    )
+  ] });
+}
+const handleKeys = (keys, callback, propagationMode = "stopIfMatches") => (event) => {
+  if (propagationMode === "stop") event.stopPropagation();
+  if (keys.includes(event.key)) {
+    if (propagationMode === "stopIfMatches") event.stopPropagation();
+    callback();
+  }
+};
+const MultiSelectList = ({
+  options,
+  selected,
+  onSelect,
+  mapToSelectItem
+}) => /* @__PURE__ */ jsx("ul", { className: "adyen-kyc-multi-select-list", children: options.map((option) => {
+  const item = mapToSelectItem(option);
+  const isSelected = selected.includes(option);
+  const handleSelect = () => {
+    const newSelection = isSelected ? selected.filter((selectedOption) => selectedOption !== option) : [...selected, option];
+    onSelect(newSelection);
+  };
+  return /* @__PURE__ */ jsx(
+    SelectListItem,
+    {
+      id: item.id,
+      item,
+      selected: isSelected,
+      onKeyDown: handleKeys(["Enter", " "], handleSelect),
+      onSelect: handleSelect,
+      isMulti: true,
+      className: cx([
+        "adyen-kyc-multi-select-list-item",
+        {
+          "adyen-kyc-multi-select-list-item--with-description": !!item.description
+        }
+      ])
+    },
+    item.id
+  );
+}) });
+const makeSelectItemForRole = (role, t) => {
+  const metadata = roleMetadata[role];
+  if (!metadata)
+    throw Error(
+      `Cannot make select item for role "${role}"; no metadata found. Valid roles include: ${Object.keys(
+        roleMetadata
+      ).join("\n")}`
+    );
+  const { name, description } = metadata;
+  return {
+    id: role,
+    name: t(($) => $[name]),
+    description: description ? t(($) => $[description]) : void 0
+  };
+};
 const stackLayout = "adyen-kyc-stack-layout";
 const stackLayoutGapXs = "adyen-kyc-stack-layout-gap-xs";
 const stackLayoutGapS = "adyen-kyc-stack-layout-gap-s";
@@ -177,6 +316,7 @@ 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 stackLayoutHorizontal = "adyen-kyc-stack-layout-horizontal";
+const stackLayoutCentered = "adyen-kyc-stack-layout-centered";
 const styles$1 = {
   stackLayout,
   stackLayoutGapXs,
@@ -184,9 +324,15 @@ const styles$1 = {
   stackLayoutGapM,
   stackLayoutGapL,
   stackLayoutGapXl,
-  stackLayoutHorizontal
+  stackLayoutHorizontal,
+  stackLayoutCentered
 };
-const StackLayout = ({ children, gap = "medium", horizontal = false }) => {
+const StackLayout = ({
+  children,
+  gap = "medium",
+  horizontal = false,
+  centered = false
+}) => {
   const gapStyles = {
     xSmall: styles$1.stackLayoutGapXs,
     small: styles$1.stackLayoutGapS,
@@ -196,7 +342,8 @@ const StackLayout = ({ children, gap = "medium", horizontal = false }) => {
     none: null
   };
   const rootClassname = cx(styles$1.stackLayout, gapStyles[gap], {
-    [styles$1.stackLayoutHorizontal]: horizontal
+    [styles$1.stackLayoutHorizontal]: horizontal,
+    [styles$1.stackLayoutCentered]: centered
   });
   return /* @__PURE__ */ jsx("div", { className: rootClassname, children });
 };
@@ -292,12 +439,19 @@ const isBafinSignatoryFlow = ({
   return false;
 };
 export {
+  CompanyTypesValues as C,
   LandingLayout as L,
+  MultiSelectList as M,
+  Name as N,
   StackLayout as S,
-  idNowModalChildEntityId as a,
-  shouldShowIdNowModal as b,
+  useSingpassMyInfoLogin as a,
+  idNowModalChildEntityId as b,
+  shouldShowIdNowModal as c,
+  handleKeys as h,
   isBafinSignatoryFlow as i,
+  makeSelectItemForRole as m,
+  nameFields as n,
   removeIdVerificationProblemsForBafinSignatory as r,
   showIdNowModal as s,
-  useSingpassMyInfoLogin as u
+  useSetting as u
 };

package/dist/basePatterns-BwdnMQxI.js

@@ -0,0 +1,15 @@
+;
+{
+  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] = "86567ca3-b6c6-46cf-b0e7-32efe6bbec16", e._sentryDebugIdIdentifier = "sentry-dbid-86567ca3-b6c6-46cf-b0e7-32efe6bbec16");
+  } catch (e) {
+  }
+}
+;
+const emailPattern = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/;
+const bankStatementDescriptionPattern = /^[\s+$\xA2-\xA5\u058F\u060B\u09F2\u09F3\u09FB\u0AF1\u0BF9\u0E3F\u17DB\u20A0-\u20BD\uA838\uFDFC\uFE69\uFF04\uFFE0\uFFE1\uFFE5\uFFE6a-zA-Z0-9-."_,:;'*!@#%()+?¿/&「」]*$/;
+export {
+  bankStatementDescriptionPattern as b,
+  emailPattern as e
+};