@drivy/cobalt/components/Callout/index.js

Opinionated design system for Drivy's projects.

import { jsxs, jsx } from 'react/jsx-runtime';
import cx from 'classnames';
import { isValidElement, cloneElement } from 'react';

function enforceCTA(cta, variant) {
    if (!cta || !isValidElement(cta)) {
        return cta;
    }
    return variant === "error"
        ? cloneElement(cta, {
            size: "small",
            primary: true,
            destructive: true,
        })
        : cloneElement(cta, {
            size: "small",
            variant,
        });
}
const Callout = ({ title, children, cta, variant = "neutral", illustrationUrl, className, }) => {
    // force CTA to match Callout variant
    const enforcedCTA = enforceCTA(cta, variant);
    return (jsxs("div", { className: cx("cobalt-callout", {
            "cobalt-callout--warning": variant === "warning",
            "cobalt-callout--neutral": variant === "neutral",
            "cobalt-callout--error": variant === "error",
        }, className), children: [jsxs("div", { className: "cobalt-callout__content", children: [title && jsx("div", { className: "cobalt-callout__title", children: title }), jsx("div", { className: "cobalt-callout__body", children: children }), enforcedCTA] }), illustrationUrl && (jsx("img", { alt: title !== null && title !== void 0 ? title : "", className: "cobalt-callout__illustration", src: illustrationUrl }))] }));
};

export { Callout, Callout as default };
//# sourceMappingURL=index.js.map