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

package/dist/{DecisionMakers-DHeZux6T.js → DecisionMakers-Bxdj0aIF.js}

@@ -2,20 +2,21 @@
 {
   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] = "6f717881-59fb-4423-a797-b3e5fffb5245", e._sentryDebugIdIdentifier = "sentry-dbid-6f717881-59fb-4423-a797-b3e5fffb5245");
+    n && (e._sentryDebugIds = e._sentryDebugIds || {}, e._sentryDebugIds[n] = "c942cccf-b4aa-46fd-9a20-6a37a6224833", e._sentryDebugIdIdentifier = "sentry-dbid-c942cccf-b4aa-46fd-9a20-6a37a6224833");
   } catch (e) {
   }
 }
 ;
 import { jsxs, jsx, Fragment } from "preact/jsx-runtime";
 import { useState, useEffect } from "preact/hooks";
-import { a7 as Icon, c as useTranslation, d as useLegalEntity, bc as Modal, L as Loader, aO as getRoleName, G as Button, bi as Confirm, u as useI18nContext, N as Typography, K as Alert, a3 as useAnalyticsContext, H as Svg, R as ROOT_LE, ad as useGetTaskStatus, aa as useExperimentsContext, a9 as useToastContext, af as useCapabilityProblems, by as getOwnDecisionMakers, cv as useScenarios, cS as getAvailableDecisionMakerRoleTypes, $ as TaskTypes, cB as getAllowedDecisionMakerRoles, F as FormHeader, aZ as ContextGuidance, aX as Trans, cQ as DecisionMakerTypes, ae as CardGroup, aS as ActionBar, O as LegalEntityTypes } from "./StoreProvider-nqVR_kWS.js";
-import { a as useUpdateLegalEntity } from "./useUpdateLegalEntity-xfJlMkrb.js";
-import { e as useDataMissingRemediations, D as DropinLayout, E as EntityGuidanceStatus, i as iconStatus, f as EntityAssociation } from "./OnboardingDropinComponent-DkkC-O2y.js";
+import { a7 as Icon, c as useTranslation, d as useLegalEntity, G as Button, be as Modal, L as Loader, aO as getRoleName, bg as Confirm, u as useI18nContext, N as Typography, K as Alert, a3 as useAnalyticsContext, H as Svg, R as ROOT_LE, ad as useGetTaskStatus, aa as useExperimentsContext, a9 as useToastContext, af as useCapabilityProblems, bz as getOwnDecisionMakers, cx as useScenarios, cV as getAvailableDecisionMakerRoleTypes, $ as TaskTypes, cD as getAllowedDecisionMakerRoles, F as FormHeader, aZ as ContextGuidance, aX as Trans, b5 as DecisionMakerTypes, ae as CardGroup, aS as ActionBar, O as LegalEntityTypes } from "./StoreProvider-Fbl3I9L7.js";
+import { a as useUpdateLegalEntity } from "./useUpdateLegalEntity-CcUHqJyo.js";
+import { e as useDataMissingRemediations, D as DropinLayout, E as EntityGuidanceStatus, i as iconStatus, f as EntityAssociation } from "./OnboardingDropinComponent-Dvq5Ocum.js";
 import cx from "classnames";
-import { A as Avatar } from "./Avatar-Bsc58neS.js";
-import { T as TaskStatusIndicator } from "./TaskStatusIndicator-6bpYVt4Z.js";
-import { S as StackLayout, L as LandingLayout } from "./LandingLayout-CddoBOJ4.js";
+import { A as Avatar } from "./Avatar-DY9KPxi_.js";
+import { T as TaskStatusIndicator } from "./TaskStatusIndicator-B7G7gqRt.js";
+import { D as DetailViewLayout } from "./DetailViewLayout-Z9cuUp4X.js";
+import { S as StackLayout, L as LandingLayout } from "./isIdNowModalOpen-C3cyeMaK.js";
 const listItem = "adyen-kyc-list-item";
 const listItemInteractive = "adyen-kyc-list-item-interactive";
 const listItemText = "adyen-kyc-list-item-text";
@@ -23,7 +24,7 @@ const listItemTitle = "adyen-kyc-list-item-title";
 const listItemDescription = "adyen-kyc-list-item-description";
 const listItemDisclosure = "adyen-kyc-list-item-disclosure";
 const listItemAccessory = "adyen-kyc-list-item-accessory";
-const styles$2 = {
+const styles$1 = {
   listItem,
   listItemInteractive,
   listItemText,
@@ -39,16 +40,16 @@ const ListItem = ({ accessory, action, avatar, description, title }) => {
     ...avatar,
     ...isDisabled && { variant: "disabled" }
   };
-  const rootClassname = cx(styles$2.listItem, {
-    [styles$2.listItemInteractive]: isInteractive
+  const rootClassname = cx(styles$1.listItem, {
+    [styles$1.listItemInteractive]: isInteractive
   });
   const content = /* @__PURE__ */ jsxs(Fragment, { children: [
     avatar && /* @__PURE__ */ jsx(Avatar, { ...listItemAvatar }),
-    /* @__PURE__ */ jsxs("div", { className: styles$2.listItemText, children: [
-      /* @__PURE__ */ jsx("h3", { className: styles$2.listItemTitle, children: title }),
-      description && /* @__PURE__ */ jsx("span", { className: styles$2.listItemDescription, children: description })
+    /* @__PURE__ */ jsxs("div", { className: styles$1.listItemText, children: [
+      /* @__PURE__ */ jsx("h3", { className: styles$1.listItemTitle, children: title }),
+      description && /* @__PURE__ */ jsx("span", { className: styles$1.listItemDescription, children: description })
     ] }),
-    accessory && /* @__PURE__ */ jsx("div", { className: styles$2.listItemAccessory, children: accessory })
+    accessory && /* @__PURE__ */ jsx("div", { className: styles$1.listItemAccessory, children: accessory })
   ] });
   if (isInteractive) {
     return /* @__PURE__ */ jsxs(
@@ -61,7 +62,7 @@ const ListItem = ({ accessory, action, avatar, description, title }) => {
         type: "button",
         children: [
           content,
-          action?.disclosure && !isDisabled && /* @__PURE__ */ jsx("div", { className: styles$2.listItemDisclosure, "data-testid": "disclosure-indicator", children: /* @__PURE__ */ jsx(Icon, { name: "chevron-right" }) })
+          action?.disclosure && !isDisabled && /* @__PURE__ */ jsx("div", { className: styles$1.listItemDisclosure, "data-testid": "disclosure-indicator", children: /* @__PURE__ */ jsx(Icon, { name: "chevron-right" }) })
         ]
       }
     );
@@ -69,10 +70,6 @@ const ListItem = ({ accessory, action, avatar, description, title }) => {
     return /* @__PURE__ */ jsx("div", { className: rootClassname, children: content });
   }
 };
-const decisionMakerDetailsActions = "adyen-kyc-decision-maker-details-actions";
-const styles$1 = {
-  decisionMakerDetailsActions
-};
 const DecisionMakerDetails = ({
   decisionMaker,
   handleClose,
@@ -84,27 +81,20 @@ const DecisionMakerDetails = ({
   const { data: legalEntity, isLoading: isLegalEntityLoading } = useLegalEntity(
     decisionMaker.reference
   );
+  const actions = /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(Button, { onClick: handleEdit, variant: "primary", fullWidth: true, children: t(($) => $["editDetails"]) }),
+    /* @__PURE__ */ jsx(Button, { onClick: () => setConfirmOpen(true), variant: "secondary", fullWidth: true, children: t(($) => $["delete"]) })
+  ] });
   return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsxs(Modal, { onClose: handleClose, ariaLabel: t(($) => $["individualDetails"]), inset: true, children: [
-      /* @__PURE__ */ jsxs("h2", { children: [
-        " ",
-        t(($) => $["individualDetails"]),
-        " "
-      ] }),
-      isLegalEntityLoading || !legalEntity ? /* @__PURE__ */ jsx(Loader, {}) : /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(StackLayout, { gap: "medium", children: /* @__PURE__ */ jsx(
-        ListItem,
-        {
-          accessory: /* @__PURE__ */ jsx(TaskStatusIndicator, { taskStatus: decisionMaker.status }),
-          avatar: { iconName: "user", circle: true },
-          title: decisionMaker.name,
-          description: decisionMaker.types.map((type) => t(($) => $[getRoleName(type)])).filter(Boolean).join(",")
-        }
-      ) }) }),
-      /* @__PURE__ */ jsx("div", { className: styles$1.decisionMakerDetailsActions, children: /* @__PURE__ */ jsxs(StackLayout, { gap: "small", children: [
-        /* @__PURE__ */ jsx(Button, { onClick: handleEdit, variant: "primary", fullWidth: true, children: t(($) => $["editDetails"]) }),
-        /* @__PURE__ */ jsx(Button, { onClick: () => setConfirmOpen(true), variant: "secondary", fullWidth: true, children: t(($) => $["delete"]) })
-      ] }) })
-    ] }),
+    /* @__PURE__ */ jsx(Modal, { onClose: handleClose, ariaLabel: t(($) => $["individualDetails"]), inset: true, children: /* @__PURE__ */ jsx(DetailViewLayout, { title: t(($) => $["individualDetails"]), actions, children: isLegalEntityLoading || !legalEntity ? /* @__PURE__ */ jsx(Loader, {}) : /* @__PURE__ */ jsx(StackLayout, { gap: "medium", children: /* @__PURE__ */ jsx(
+      ListItem,
+      {
+        accessory: /* @__PURE__ */ jsx(TaskStatusIndicator, { taskStatus: decisionMaker.status }),
+        avatar: { iconName: "user", circle: true },
+        title: decisionMaker.name,
+        description: decisionMaker.types.map((type) => t(($) => $[getRoleName(type)])).filter(Boolean).join(",")
+      }
+    ) }) }) }),
     confirmOpen && /* @__PURE__ */ jsx(
       Confirm,
       {

package/dist/DetailViewLayout-Z9cuUp4X.js

@@ -0,0 +1,65 @@
+;
+{
+  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] = "d66306a0-d595-4a70-a516-465959ceff9f", e._sentryDebugIdIdentifier = "sentry-dbid-d66306a0-d595-4a70-a516-465959ceff9f");
+  } catch (e) {
+  }
+}
+;
+import { jsxs, jsx } from "preact/jsx-runtime";
+import cx from "classnames";
+const detailViewLayout = "adyen-kyc-detail-view-layout";
+const detailViewLayoutDefault = "adyen-kyc-detail-view-layout-default";
+const detailViewLayoutCompact = "adyen-kyc-detail-view-layout-compact";
+const detailViewLayoutHeader = "adyen-kyc-detail-view-layout-header";
+const detailViewLayoutTitle = "adyen-kyc-detail-view-layout-title";
+const detailViewLayoutDescription = "adyen-kyc-detail-view-layout-description";
+const detailViewLayoutAlignLeft = "adyen-kyc-detail-view-layout-align-left";
+const detailViewLayoutAlignCenter = "adyen-kyc-detail-view-layout-align-center";
+const detailViewLayoutAlignRight = "adyen-kyc-detail-view-layout-align-right";
+const detailViewLayoutContent = "adyen-kyc-detail-view-layout-content";
+const detailViewLayoutActions = "adyen-kyc-detail-view-layout-actions";
+const styles = {
+  detailViewLayout,
+  detailViewLayoutDefault,
+  detailViewLayoutCompact,
+  detailViewLayoutHeader,
+  detailViewLayoutTitle,
+  detailViewLayoutDescription,
+  detailViewLayoutAlignLeft,
+  detailViewLayoutAlignCenter,
+  detailViewLayoutAlignRight,
+  detailViewLayoutContent,
+  detailViewLayoutActions
+};
+const DetailViewLayout = ({
+  actions,
+  align = "left",
+  children,
+  compact,
+  description,
+  title
+}) => {
+  const headerAlignment = {
+    left: styles.detailViewLayoutAlignLeft,
+    center: styles.detailViewLayoutAlignCenter,
+    right: styles.detailViewLayoutAlignRight
+  };
+  const rootClassname = cx(styles.detailViewLayout, {
+    [styles.detailViewLayoutCompact]: compact,
+    [styles.detailViewLayoutDefault]: !compact
+  });
+  const headerClassname = cx(styles.detailViewLayoutHeader, headerAlignment[align]);
+  return /* @__PURE__ */ jsxs("article", { className: rootClassname, children: [
+    /* @__PURE__ */ jsxs("header", { className: headerClassname, children: [
+      /* @__PURE__ */ jsx("h1", { className: styles.detailViewLayoutTitle, children: title }),
+      description && /* @__PURE__ */ jsx("div", { className: styles.detailViewLayoutDescription, children: description })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: styles.detailViewLayoutContent, children }),
+    actions && /* @__PURE__ */ jsx("div", { className: styles.detailViewLayoutActions, role: "toolbar", children: actions })
+  ] });
+};
+export {
+  DetailViewLayout as D
+};

package/dist/{EmbeddedStatus-BXBTxeW1.js → EmbeddedStatus-CDIMc5D0.js}

@@ -9,8 +9,8 @@
 ;
 import { jsxs, jsx, Fragment } from "preact/jsx-runtime";
 import cx from "classnames";
-import { A as Avatar } from "./Avatar-Bsc58neS.js";
-import { a1 as TaskStatuses, c as useTranslation, J as Skeleton, N as Typography } from "./StoreProvider-nqVR_kWS.js";
+import { A as Avatar } from "./Avatar-DY9KPxi_.js";
+import { a1 as TaskStatuses, c as useTranslation, J as Skeleton, N as Typography } from "./StoreProvider-Fbl3I9L7.js";
 import { T as Tag } from "./Tag-DdkVScyr.js";
 import { O as OnboardingStatuses } from "./view-verification-status-VFcBydkR.js";
 const embeddedStatus = "adyen-kyc-embedded-status";

package/dist/EndStateLayout-ChS903yq.js

@@ -0,0 +1,71 @@
+;
+{
+  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] = "28d0a0af-3c72-4f37-821f-890e17b3096c", e._sentryDebugIdIdentifier = "sentry-dbid-28d0a0af-3c72-4f37-821f-890e17b3096c");
+  } catch (e) {
+  }
+}
+;
+import { jsxs, jsx } from "preact/jsx-runtime";
+import cx from "classnames";
+import { isValidElement, cloneElement } from "preact";
+import { G as Button, L as Loader, a7 as Icon } from "./StoreProvider-Fbl3I9L7.js";
+const endStateLayout = "adyen-kyc-end-state-layout";
+const endStateLayoutHeader = "adyen-kyc-end-state-layout-header";
+const endStateLayoutIcon = "adyen-kyc-end-state-layout-icon";
+const endStateLayoutIconSuccess = "adyen-kyc-end-state-layout-icon-success";
+const endStateLayoutIconError = "adyen-kyc-end-state-layout-icon-error";
+const endStateLayoutIconInfo = "adyen-kyc-end-state-layout-icon-info";
+const endStateLayoutIconWarning = "adyen-kyc-end-state-layout-icon-warning";
+const endStateLayoutTitle = "adyen-kyc-end-state-layout-title";
+const endStateLayoutDescription = "adyen-kyc-end-state-layout-description";
+const endStateLayoutAction = "adyen-kyc-end-state-layout-action";
+const styles = {
+  endStateLayout,
+  endStateLayoutHeader,
+  endStateLayoutIcon,
+  endStateLayoutIconSuccess,
+  endStateLayoutIconError,
+  endStateLayoutIconInfo,
+  endStateLayoutIconWarning,
+  endStateLayoutTitle,
+  endStateLayoutDescription,
+  endStateLayoutAction
+};
+const EndStateLayout = ({
+  action,
+  description,
+  loading = false,
+  title,
+  variant = "success"
+}) => {
+  if (action && (!isValidElement(action) || action.type !== Button)) {
+    throw new Error('EndStateLayout component only accepts Button component as "action".');
+  }
+  const iconClassname = cx(styles.endStateLayoutIcon, {
+    [styles.endStateLayoutIconSuccess]: variant === "success",
+    [styles.endStateLayoutIconError]: variant === "error",
+    [styles.endStateLayoutIconWarning]: variant === "warning",
+    [styles.endStateLayoutIconInfo]: variant === "info" || variant === "basic"
+  });
+  const iconName = {
+    basic: "info-circle",
+    error: "cross",
+    info: "info-circle",
+    success: "check",
+    warning: "warning"
+  };
+  const actionButton = action ? cloneElement(action, { disabled: loading }) : null;
+  return /* @__PURE__ */ jsxs("article", { className: styles.endStateLayout, children: [
+    /* @__PURE__ */ jsxs("header", { className: styles.endStateLayoutHeader, children: [
+      loading ? /* @__PURE__ */ jsx("div", { className: styles.endStateLayoutIcon, role: "progressbar", children: /* @__PURE__ */ jsx(Loader, {}) }) : /* @__PURE__ */ jsx("div", { className: iconClassname, role: "img", "aria-label": variant, children: /* @__PURE__ */ jsx(Icon, { name: iconName[variant] }) }),
+      /* @__PURE__ */ jsx("h1", { className: styles.endStateLayoutTitle, children: title }),
+      description && /* @__PURE__ */ jsx("div", { className: styles.endStateLayoutDescription, children: description })
+    ] }),
+    actionButton && /* @__PURE__ */ jsx("div", { className: styles.endStateLayoutAction, role: "toolbar", children: actionButton })
+  ] });
+};
+export {
+  EndStateLayout as E
+};

package/dist/{FormFlow-Urrg9vMm.js → FormFlow-gcCKgNQt.js}

@@ -2,14 +2,14 @@
 {
   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] = "252b306a-b541-4c7e-86a2-807aa8eec85f", e._sentryDebugIdIdentifier = "sentry-dbid-252b306a-b541-4c7e-86a2-807aa8eec85f");
+    n && (e._sentryDebugIds = e._sentryDebugIds || {}, e._sentryDebugIds[n] = "857a3874-9e23-4f1b-8f52-386d1de07dea", e._sentryDebugIdIdentifier = "sentry-dbid-857a3874-9e23-4f1b-8f52-386d1de07dea");
   } catch (e) {
   }
 }
 ;
 import { jsx, jsxs } from "preact/jsx-runtime";
 import { useMemo, useRef, useState } from "preact/hooks";
-import { dE as FormContext, a3 as useAnalyticsContext, c as useTranslation, bw as MaybeModal, a6 as LoaderWrapper, dF as FormRouterContextProvider, aR as Summary, G as Button, a2 as IconButton, bi as Confirm } from "./StoreProvider-nqVR_kWS.js";
+import { dE as FormContext, a3 as useAnalyticsContext, c as useTranslation, bu as MaybeModal, a6 as LoaderWrapper, dF as FormRouterContextProvider, aR as Summary, G as Button, a2 as IconButton, bg as Confirm } from "./StoreProvider-Fbl3I9L7.js";
 import cx from "classnames";
 function FormContextProvider({
   children,