@adyen/adyen-platform-experience-web
Version:
70 lines (69 loc) • 2.72 kB
JavaScript
import { jsx as r } from "../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
import n from "../Typography/Typography.js";
import { TypographyVariant as h } from "../Typography/types.js";
import { useCallback as b } from "../../../external/preact/hooks/dist/hooks.module.js";
import I from "../../../core/Context/useCoreContext.js";
/* empty css */
import N from "../../../images/no-results.svg.js";
import k from "classnames";
import { Fragment as p } from "../../../external/preact/dist/preact.module.js";
import g from "../Button/Button.js";
const f = {
md: 680
}, K = ({
title: x,
message: s,
imageDesktop: t,
imageMobile: a,
withImage: u,
centered: v,
refreshComponent: l,
onContactSupport: m,
translationValues: i,
absolutePosition: E = !0,
outlined: y = !0,
renderSecondaryButton: c
}) => {
const { i18n: e, updateCore: _ } = I(), A = b(
(o) => Array.isArray(o) ? o.map(
(d, T) => T === 0 ? /* @__PURE__ */ r(p, { children: [
e.get(d),
i && i[d] && /* @__PURE__ */ r(p, { children: i[d] })
] }) : /* @__PURE__ */ r(p, { children: [
/* @__PURE__ */ r("br", {}),
e.get(d),
i && i[d] && /* @__PURE__ */ r(p, { children: i[d] })
] })
) : e.get(o),
[e, i]
);
return /* @__PURE__ */ r(
"div",
{
className: k(["adyen-pe-error-message-display"], {
"adyen-pe-error-message-display--absolute-position": E,
"adyen-pe-error-message-display--outlined": y,
"adyen-pe-error-message-display--with-background": !y,
"adyen-pe-error-message-display--centered": v
}),
children: [
(t || a || u) && /* @__PURE__ */ r("div", { className: "adyen-pe-error-message-display__illustration", children: /* @__PURE__ */ r("picture", { children: [
/* @__PURE__ */ r("source", { type: "image/svg+xml", media: `(min-width: ${f.md}px)`, srcSet: t }),
/* @__PURE__ */ r("source", { type: "image/svg+xml", media: `(max-width: ${f.md}px)`, srcSet: a }),
/* @__PURE__ */ r("img", { srcSet: t ?? N, alt: e.get("thereWasAnUnexpectedError") })
] }) }),
/* @__PURE__ */ r(n, { variant: h.TITLE, children: e.get(x) }),
s && /* @__PURE__ */ r(n, { variant: h.BODY, children: A(s) }),
(m || l || c) && /* @__PURE__ */ r("div", { className: "adyen-pe-error-message-display__button", children: [
c && c(),
m && /* @__PURE__ */ r(g, { onClick: m, children: e.get("contactSupport") }),
!m && l && /* @__PURE__ */ r(g, { onClick: _, children: e.get("refresh") })
] })
]
}
);
};
export {
K as ErrorMessageDisplay,
f as IMAGE_BREAKPOINT_SIZES
};