@adyen/kyc-components
Version:
This guide assumes that you have already an account with Adyen. A legalEntity needs to be created, and you need to have a `legalEntityId` to instatiate a Component.
170 lines (169 loc) • 7 kB
JavaScript
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] = "ce90fe79-1a28-474d-8672-9dcfb222e813", e._sentryDebugIdIdentifier = "sentry-dbid-ce90fe79-1a28-474d-8672-9dcfb222e813");
} catch (e) {}
import { a as Icon, r as useTranslation } from "./translation-BYvhW5zA.js";
import { x as Alert } from "./resolveEnvironment-DNmu53Rr.js";
import { n as IconButton } from "./Button-i8I2dHP8.js";
import { t as TaskVerificationStatus } from "./TaskVerificationStatus-CKHPTEpH.js";
import { i as TaskStatuses } from "./taskStatus-BtekPA8E.js";
import { t as getCapabilities } from "./processCapabilities-fPuXc9gL.js";
import { t as Card } from "./Card-BCGLpdw7.js";
import { i as useAnalyticsContext } from "./Modal-BLP2aF-u.js";
import { t as VerificationErrorAlert } from "./VerificationErrorAlert-B_RKlfIG.js";
import { t as Avatar } from "./Avatar-CdBNstmD.js";
import { r as LoaderWrapper } from "./utils-C1buyvRw.js";
import { t as Confirm } from "./Confirm-CA-gL38n.js";
import { useState } from "preact/hooks";
import { Fragment, jsx, jsxs } from "preact/jsx-runtime";
//#region src/adaptiveWorkflow/utils/utils.ts
/** Read a value from a nested object using dot-notation path. */
function getNestedValue(obj, path) {
return path.split(".").reduce((acc, key) => acc?.[key], obj);
}
/** Write a value into a nested object at a dot-notation path, creating intermediary objects as needed. */
function setNestedValue(obj, path, value) {
const keys = path.split(".");
keys.reduce((acc, key, index) => {
if (index === keys.length - 1) acc[key] = value;
else {
if (typeof acc[key] !== "object" || acc[key] === null) acc[key] = {};
return acc[key];
}
return acc;
}, obj);
}
/**
* Resolve props for components from awe response, some props are diretly provided with value, other
* which depend on other fields are provided in globals.
* @param globals
* @param componentProps
*/
function resolveComponentProps(globals, componentProps) {
if (!componentProps) return;
const props = {};
for (const propName in componentProps) {
const propData = componentProps[propName];
if (propData.type === "global") {
const [globalName, ...path] = propData.value.split(".");
props[propName] = globals[propData.value]?.value ?? getNestedValue(globals[globalName]?.value, path.join("."));
continue;
}
props[propName] = propData.value;
}
return props;
}
/**
* Check if adaptive POC can be shown
* @param isPocEnabled feature toggle
* @param legalEntityData legal entity data to check the BBA capability
*/
var canShowAdaptivePoc = function(isPocEnabled, legalEntityData) {
return isPocEnabled && getCapabilities(legalEntityData).includes("issueBankAccount");
};
//#endregion
//#region src/components/Apps/tasks/TaskList/TaskListItem.tsx
var TaskListItem = ({ titleKey, title, icon, status, onNavigateToTask, disabled = false, problems, downloadHandler, info, loading = false, showErrorAlerts = "onErrorStatus", warningMessage, deleteEntity, testId, enableTracking = true, fallbackErrorMessage }) => {
const { t } = useTranslation("common");
const userEvents = useAnalyticsContext();
const [isConfirmShown, setIsConfirmShown] = useState(false);
const isDeletable = !!deleteEntity;
const isDownloadable = !!downloadHandler && status === TaskStatuses.DOWNLOAD;
const shouldShowErrorAlert = showErrorAlerts === "always" || showErrorAlerts === "onErrorStatus" && status === TaskStatuses.ERROR || !!problems?.verificationErrors;
const handleNavigateToTask = () => {
if (enableTracking) userEvents.addJourneyEvent("Clicked button", {
actionType: "open",
task: void 0,
label: titleKey
});
onNavigateToTask?.();
};
const avatarVariant = disabled ? "disabled" : "primary";
const handleRemoveIntent = (event) => {
event.stopPropagation();
setIsConfirmShown(true);
};
const dismissConfirm = () => {
setIsConfirmShown(false);
};
const getTaskAccessory = () => {
switch (status) {
case TaskStatuses.SIGN: return t(($) => $["sign"]);
case TaskStatuses.DETAILS_REQUIRED:
case TaskStatuses.EMPTY: return t(($) => $["add"]);
default: return /* @__PURE__ */ jsx(TaskVerificationStatus, { status });
}
};
return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Card, {
onClick: handleNavigateToTask,
disabled: loading || disabled,
children: /* @__PURE__ */ jsxs(LoaderWrapper, {
status: loading ? "loading" : "success",
formOpacityWhenLoading: .3,
loaderSize: "medium",
children: [
/* @__PURE__ */ jsxs("div", {
className: "adyen-task-item",
"data-testid": testId,
children: [/* @__PURE__ */ jsxs("div", {
className: "adyen-task-item__header",
children: [/* @__PURE__ */ jsxs("div", {
className: "adyen-task-item__heading",
children: [/* @__PURE__ */ jsx(Avatar, {
variant: avatarVariant,
iconName: icon
}), /* @__PURE__ */ jsx("div", {
className: "adyen-task-item__body",
children: /* @__PURE__ */ jsx("span", {
className: "adyen-task-item__title",
children: title || t(($) => $[titleKey])
})
})]
}), info && /* @__PURE__ */ jsxs("div", {
className: "adyen-task-item__info",
children: [/* @__PURE__ */ jsx(Icon, { name: "info-circle" }), /* @__PURE__ */ jsx("span", { children: info })]
})]
}), /* @__PURE__ */ jsxs("aside", {
className: "adyen-task-item__status",
children: [
getTaskAccessory(),
isDownloadable && /* @__PURE__ */ jsx(IconButton, {
ariaLabel: t(($) => $["download"]),
icon: "download",
onClick: downloadHandler,
variant: "tertiary"
}),
isDeletable && /* @__PURE__ */ jsx(IconButton, {
ariaLabel: t(($) => $["delete"]),
icon: "bin",
variant: "tertiary",
onClick: handleRemoveIntent,
disabled: isConfirmShown
}),
!isDownloadable && !isDeletable && /* @__PURE__ */ jsx(Icon, { name: "chevron-right" })
]
})]
}),
warningMessage ? /* @__PURE__ */ jsx(Alert, {
variant: "warning",
title: warningMessage,
className: "adyen-task-item__warning-message"
}) : void 0,
shouldShowErrorAlert && /* @__PURE__ */ jsx(VerificationErrorAlert, {
className: "adyen-task-item-alert",
problems,
fallbackErrorMessage
})
]
})
}), isConfirmShown && isDeletable && /* @__PURE__ */ jsx(Confirm, {
title: t(($) => $["deleteItem"], { item: title }),
description: t(($) => $["thisActionIsPermanent"]),
onConfirm: deleteEntity,
confirmText: t(($) => $["delete"]),
onCancel: dismissConfirm,
critical: true
})] });
};
//#endregion
export { setNestedValue as a, resolveComponentProps as i, canShowAdaptivePoc as n, getNestedValue as r, TaskListItem as t };