@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.
85 lines (84 loc) • 4.23 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] = "9119e31f-2f6e-4df6-a777-f64b17648a53", e._sentryDebugIdIdentifier = "sentry-dbid-9119e31f-2f6e-4df6-a777-f64b17648a53");
} catch (e) {}
import { a as Icon } from "./translation-BFxyJ1c5.js";
import { r as Loader, t as Button } from "./Button-oj6H8OrC.js";
import cx from "classnames";
import { jsx, jsxs } from "preact/jsx-runtime";
import { cloneElement, isValidElement } from "preact";
var EndStateLayout_module_default = {
"end-state-layout": "adyen-kyc-end-state-layout",
endStateLayout: "adyen-kyc-end-state-layout",
"end-state-layout-header": "adyen-kyc-end-state-layout-header",
endStateLayoutHeader: "adyen-kyc-end-state-layout-header",
"end-state-layout-icon": "adyen-kyc-end-state-layout-icon",
endStateLayoutIcon: "adyen-kyc-end-state-layout-icon",
"end-state-layout-icon-success": "adyen-kyc-end-state-layout-icon-success",
endStateLayoutIconSuccess: "adyen-kyc-end-state-layout-icon-success",
"end-state-layout-icon-error": "adyen-kyc-end-state-layout-icon-error",
endStateLayoutIconError: "adyen-kyc-end-state-layout-icon-error",
"end-state-layout-icon-info": "adyen-kyc-end-state-layout-icon-info",
endStateLayoutIconInfo: "adyen-kyc-end-state-layout-icon-info",
"end-state-layout-icon-warning": "adyen-kyc-end-state-layout-icon-warning",
endStateLayoutIconWarning: "adyen-kyc-end-state-layout-icon-warning",
"end-state-layout-text": "adyen-kyc-end-state-layout-text",
endStateLayoutText: "adyen-kyc-end-state-layout-text",
"end-state-layout-title": "adyen-kyc-end-state-layout-title",
endStateLayoutTitle: "adyen-kyc-end-state-layout-title",
"end-state-layout-description": "adyen-kyc-end-state-layout-description",
endStateLayoutDescription: "adyen-kyc-end-state-layout-description",
"end-state-layout-action": "adyen-kyc-end-state-layout-action",
endStateLayoutAction: "adyen-kyc-end-state-layout-action"
};
//#endregion
//#region src/components/ui/layout/EndStateLayout/EndStateLayout.tsx
var 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(EndStateLayout_module_default.endStateLayoutIcon, {
[EndStateLayout_module_default.endStateLayoutIconSuccess]: variant === "success",
[EndStateLayout_module_default.endStateLayoutIconError]: variant === "error",
[EndStateLayout_module_default.endStateLayoutIconWarning]: variant === "warning",
[EndStateLayout_module_default.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: EndStateLayout_module_default.endStateLayout,
children: [/* @__PURE__ */ jsxs("header", {
className: EndStateLayout_module_default.endStateLayoutHeader,
children: [
loading ? /* @__PURE__ */ jsx("div", {
className: EndStateLayout_module_default.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: EndStateLayout_module_default.endStateLayoutTitle,
children: title
}),
description && /* @__PURE__ */ jsx("div", {
className: EndStateLayout_module_default.endStateLayoutDescription,
children: description
})
]
}), actionButton && /* @__PURE__ */ jsx("div", {
className: EndStateLayout_module_default.endStateLayoutAction,
role: "toolbar",
children: actionButton
})]
});
};
//#endregion
export { EndStateLayout as t };