@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.
77 lines (76 loc) • 2.81 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] = "3bcea0e5-c4f4-4573-9996-ce67bcd800bc", e._sentryDebugIdIdentifier = "sentry-dbid-3bcea0e5-c4f4-4573-9996-ce67bcd800bc");
} catch (e) {}
import { i as Typography, r as useTranslation } from "./translation-BFxyJ1c5.js";
import { t as Button } from "./Button-oj6H8OrC.js";
import { t as useAnalyticsContext } from "./useAnalyticsContext-BVFDMrVE.js";
import { t as Modal } from "./Modal-CioQJ7Q7.js";
import { useEffect, useState } from "preact/hooks";
import { jsx, jsxs } from "preact/jsx-runtime";
var Confirm_module_default = {
confirm: "adyen-kyc-confirm",
"confirm-message": "adyen-kyc-confirm-message",
confirmMessage: "adyen-kyc-confirm-message",
"confirm-actions": "adyen-kyc-confirm-actions",
confirmActions: "adyen-kyc-confirm-actions"
};
//#endregion
//#region src/components/ui/molecules/Confirm/Confirm.tsx
var Confirm = ({ description, cancelText, confirmText, critical = false, onCancel, onConfirm, title, analyticsEventLabel }) => {
const { t } = useTranslation("ui");
const userEvents = useAnalyticsContext();
const [isInFlight, setIsInFlight] = useState(false);
const showCancelButton = onCancel !== void 0;
const buttonVariant = critical ? "critical" : "primary";
useEffect(() => {
userEvents.addTaskEvent("Opened modal", {
actionType: "open",
label: analyticsEventLabel
});
}, []);
const handleConfirm = async () => {
setIsInFlight(true);
try {
await onConfirm();
} finally {
setIsInFlight(false);
}
};
return /* @__PURE__ */ jsx(Modal, {
size: "small",
transition: "dropIn",
showCloseButton: false,
ariaLabel: title,
children: /* @__PURE__ */ jsxs("div", {
className: Confirm_module_default.confirm,
children: [/* @__PURE__ */ jsxs("div", {
className: Confirm_module_default.confirmMessage,
children: [/* @__PURE__ */ jsx(Typography, {
variant: "title",
el: "h3",
children: title
}), description && /* @__PURE__ */ jsx(Typography, {
variant: "body",
el: "p",
children: description
})]
}), /* @__PURE__ */ jsxs("div", {
className: Confirm_module_default.confirmActions,
children: [showCancelButton && /* @__PURE__ */ jsx(Button, {
onClick: onCancel,
variant: "secondary",
disabled: isInFlight,
children: cancelText ?? t(($) => $["cancel"])
}), /* @__PURE__ */ jsx(Button, {
onClick: handleConfirm,
variant: buttonVariant,
loading: isInFlight,
children: confirmText ?? t(($) => $["confirm"])
})]
})]
})
});
};
//#endregion
export { Confirm as t };