@adyen/kyc-components 4.0.1 → 4.2.0-beta.0

package/dist/StructuredList-BNLhk_zV.js

@@ -0,0 +1,61 @@
+;
+{
+  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] = "20744d5f-ef85-41af-9e58-255d052c50a8", e._sentryDebugIdIdentifier = "sentry-dbid-20744d5f-ef85-41af-9e58-255d052c50a8");
+  } catch (e) {
+  }
+}
+;
+import { jsx, jsxs } from "preact/jsx-runtime";
+import cx from "classnames";
+import { a as useId } from "./useId-BZ0PA7jP.js";
+const structuredList = "adyen-kyc-structured-list";
+const structuredListSectionField = "adyen-kyc-structured-list-section-field";
+const structuredListSectionLabel = "adyen-kyc-structured-list-section-label";
+const structuredListSectionData = "adyen-kyc-structured-list-section-data";
+const structuredListSectionDetail = "adyen-kyc-structured-list-section-detail";
+const styles = {
+  structuredList,
+  structuredListSectionField,
+  structuredListSectionLabel,
+  structuredListSectionData,
+  structuredListSectionDetail
+};
+const StructuredList = ({
+  className,
+  detailsGroupClassName,
+  items
+}) => {
+  const structuredListClassNames = cx(styles.structuredList, className);
+  const detailsGroupClassNames = cx(styles.structuredListSectionData, detailsGroupClassName);
+  return /* @__PURE__ */ jsx("dl", { className: structuredListClassNames, children: items.map((item, index) => /* @__PURE__ */ jsx(
+    StructuredListItemEl,
+    {
+      item,
+      detailsGroupClassNames
+    },
+    index
+  )) });
+};
+const StructuredListItemEl = ({
+  item: { term, details },
+  detailsGroupClassNames
+}) => {
+  const uniqueId = useId("structured-list-item");
+  return /* @__PURE__ */ jsxs("div", { className: styles.structuredListSectionField, children: [
+    /* @__PURE__ */ jsx("dt", { id: uniqueId, className: styles.structuredListSectionLabel, children: term }),
+    Array.isArray(details) ? /* @__PURE__ */ jsx("div", { className: detailsGroupClassNames, children: details.map((detail, index) => /* @__PURE__ */ jsx(
+      "dd",
+      {
+        "aria-labelledby": uniqueId,
+        className: styles.structuredListSectionDetail,
+        children: detail
+      },
+      index
+    )) }) : /* @__PURE__ */ jsx("dd", { "aria-labelledby": uniqueId, className: detailsGroupClassNames, children: details })
+  ] });
+};
+export {
+  StructuredList as S
+};

package/dist/Summary-Bgq_Kcjg.js

@@ -0,0 +1,220 @@
+;
+{
+  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] = "8249739f-fda1-4730-b44f-0481dcdee919", e._sentryDebugIdIdentifier = "sentry-dbid-8249739f-fda1-4730-b44f-0481dcdee919");
+  } catch (e) {
+  }
+}
+;
+import { jsxs, jsx } from "preact/jsx-runtime";
+import { p as useAnalyticsContext, aa as useI18nContext, u as useTranslation, ai as isEmpty, t as IconButton, a2 as translateStringOrObject, bk as Svg } from "./StoreProvider-qjyWZhxu.js";
+import { H as Header } from "./Header-hKHJmYRN.js";
+import { L as List } from "./List-BAzyC6sw.js";
+import { S as StructuredList } from "./StructuredList-BNLhk_zV.js";
+import { useEffect } from "preact/hooks";
+import { E as ErrorPanel } from "./ErrorPanel-Doqj6bY8.js";
+import { t as trackNavigation } from "./trackNavigation-db_h46BT.js";
+import { c as createFormUtils } from "./formUtils-BYIcPMjp.js";
+import { g as getRoleName } from "./roleMetadata-45H_XXPF.js";
+import { i as isSummaryItem } from "./summaryItem-CAQCQSkt.js";
+const usePageLandedEvent = () => {
+  const userEvents = useAnalyticsContext();
+  useEffect(() => {
+    userEvents.addPageEvent("Landed on page", {
+      actionType: "navigate"
+    });
+  }, []);
+};
+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 summaryStep = {
+  formId: "summary",
+  formName: "summary"
+};
+function Summary({
+  data,
+  forms,
+  gotoForm,
+  labels,
+  problems,
+  omitted = {},
+  showFormHeader = true,
+  showSectionHeader = true,
+  showLegalCaption = false,
+  showTaxExemptedLegalCaption = false,
+  useStructuredList = false
+}) {
+  const { i18n } = useI18nContext();
+  const { t } = useTranslation("common");
+  const userEvents = useAnalyticsContext();
+  usePageLandedEvent();
+  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.summaryEditButton?.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, useStructuredList2) => {
+    const structuredListItems = Object.entries(fieldData).map(([key, value]) => {
+      return {
+        term: t(($) => $[labelData[key] || key]),
+        details: value
+      };
+    });
+    return !useStructuredList2 ? /* @__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) })
+    ] }) : /* @__PURE__ */ jsxs(List, { variant: "grouped-secondary", children: [
+      showSectionHeader && summarySectionHeader(formName, formId),
+      /* @__PURE__ */ jsx(StructuredList, { items: structuredListItems })
+    ] });
+  };
+  const renderSummaryContent = (summaryData, useStructuredList2) => {
+    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,
+        useStructuredList2
+      );
+      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(Header, { title: t(($) => $["summary"]), description: t(($) => $["summaryDescription"]) }),
+    /* @__PURE__ */ jsxs("div", { className: styles.summaryContent, children: [
+      /* @__PURE__ */ jsx(
+        ErrorPanel,
+        {
+          validationErrors: allValidationErrors,
+          verificationErrors: allVerificationErrors,
+          formUtils,
+          id: "ariaErrorField"
+        }
+      ),
+      renderSummaryContent(data, useStructuredList),
+      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"]) })
+        ] })
+      ] })
+    ] })
+  ] });
+}
+export {
+  Summary as S,
+  summaryStep as s,
+  usePageLandedEvent as u
+};

package/dist/TaskVerificationStatus-DOZKjK09.js

@@ -0,0 +1,129 @@
+;
+{
+  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] = "d164bd8d-487e-4787-8827-1656f488f6ec", e._sentryDebugIdIdentifier = "sentry-dbid-d164bd8d-487e-4787-8827-1656f488f6ec");
+  } catch (e) {
+  }
+}
+;
+import { jsxs, jsx } from "preact/jsx-runtime";
+import cx from "classnames";
+import { r as Icon, u as useTranslation, q as TaskStatuses } from "./StoreProvider-qjyWZhxu.js";
+const SettingNames = {
+  AcceptedCountries: "acceptedCountries",
+  AllowBankAccountFormatSelection: "allowBankAccountFormatSelection",
+  AllowDebugUi: "allowDebugUi",
+  AllowIntraRegionCrossBorderPayout: "allowIntraRegionCrossBorderPayout",
+  AllowLegalEntityTypeChange: "changeLegalEntityType",
+  AllowPrefilledCountryEdit: "editPrefilledCountry",
+  RequirePciSignEcommerce: "requirePciSignEcommerce",
+  RequirePciSignPos: "requirePciSignPos",
+  RequirePciSignEcomMoto: "requirePciSignEcomMoto",
+  RequirePciSignPosMoto: "requirePciSignPosMoto",
+  HideOnboardingIntroductionIndividual: "hideOnboardingIntroductionIndividual",
+  HideOnboardingIntroductionOrganization: "hideOnboardingIntroductionOrganization",
+  HideOnboardingIntroductionTrust: "hideOnboardingIntroductionTrust",
+  HideOnboardingIntroductionSoleProprietor: "hideOnboardingIntroductionSoleProprietor",
+  TransferInstrumentLimit: "transferInstrumentLimit",
+  ViewOnboardingGuidance: "viewOnboardingGuidance",
+  InstantBankVerification: "instantBankVerification",
+  ShowServiceAgreementsFirst: "showServiceAgreementsFirst",
+  ShowBusinessFinancingFirst: "showBusinessFinancingFirst",
+  EnforceLegalAge: "enforceLegalAge",
+  MerchantType: "merchantType",
+  AllowBusinessLines: "allowBusinessLines"
+};
+const status = "adyen-kyc-status";
+const statusIcon = "adyen-kyc-status-icon";
+const statusText = "adyen-kyc-status-text";
+const statusTextResponsive = "adyen-kyc-status-text-responsive";
+const statusNeutral = "adyen-kyc-status-neutral";
+const statusError = "adyen-kyc-status-error";
+const statusWarning = "adyen-kyc-status-warning";
+const statusSuccess = "adyen-kyc-status-success";
+const styles = {
+  status,
+  statusIcon,
+  statusText,
+  statusTextResponsive,
+  statusNeutral,
+  statusError,
+  statusWarning,
+  statusSuccess
+};
+const variantStyles = {
+  success: styles.statusSuccess,
+  error: styles.statusError,
+  neutral: styles.statusNeutral,
+  warning: styles.statusWarning
+};
+const Status = ({
+  text,
+  icon = "circle-small-filled",
+  variant = "neutral",
+  responsive = true
+}) => {
+  const rootClassname = cx(styles.status, variantStyles[variant]);
+  const textClassname = cx(styles.statusText, {
+    [styles.statusTextResponsive]: responsive
+  });
+  return /* @__PURE__ */ jsxs("div", { role: "status", className: rootClassname, children: [
+    /* @__PURE__ */ jsx("div", { className: styles.statusIcon, children: /* @__PURE__ */ jsx(Icon, { name: icon }) }),
+    /* @__PURE__ */ jsx("div", { className: textClassname, children: text })
+  ] });
+};
+const TaskVerificationStatus = ({ status: status2, responsive }) => {
+  const { t } = useTranslation("ui");
+  switch (status2) {
+    case TaskStatuses.DETAILS_REQUIRED:
+      return /* @__PURE__ */ jsx(
+        Status,
+        {
+          icon: "warning",
+          text: t(($) => $["incomplete"]),
+          variant: "warning",
+          responsive
+        }
+      );
+    case TaskStatuses.ERROR:
+      return /* @__PURE__ */ jsx(
+        Status,
+        {
+          icon: "field-error",
+          text: t(($) => $["actionNeeded"]),
+          variant: "error",
+          responsive
+        }
+      );
+    case TaskStatuses.FINISHED:
+      return /* @__PURE__ */ jsx(
+        Status,
+        {
+          icon: "checkmark",
+          text: t(($) => $["verified"]),
+          variant: "success",
+          responsive
+        }
+      );
+    case TaskStatuses.PROCESSING:
+      return /* @__PURE__ */ jsx(Status, { icon: "clock", text: t(($) => $["inReview"]), responsive });
+    case TaskStatuses.DOWNLOAD:
+    case TaskStatuses.SIGNED:
+      return /* @__PURE__ */ jsx(
+        Status,
+        {
+          icon: "checkmark",
+          text: t(($) => $["signed"]),
+          variant: "success",
+          responsive
+        }
+      );
+    default:
+      return null;
+  }
+};
+export {
+  SettingNames as S,
+  TaskVerificationStatus as T
+};