import { j as jsxRuntimeExports } from '../../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js';
import { InfoCircledIcon } from '../../node_modules/.pnpm/@radix-ui_react-icons@1.3.0_react@18.2.0/node_modules/@radix-ui/react-icons/dist/react-icons.esm.js';
import { cva } from '../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js';
import * as React from 'react';
import styles from './callout.module.css.js';

const callout = cva(styles.callout, {
    variants: {
        type: {
            grey: styles['callout-grey'],
            success: styles['callout-success'],
            alert: styles['callout-alert'],
            gradient: styles['callout-gradient'],
            accent: styles['callout-accent'],
            attention: styles['callout-attention'],
            normal: styles['callout-normal'],
        },
        outline: {
            true: styles['callout-outline'],
        },
        highContrast: {
            true: styles['callout-high-contrast'],
        },
    },
    defaultVariants: {
        type: 'grey',
    },
});
const Callout = React.forwardRef(({ className, type = 'grey', outline, highContrast, children, action, dismissible, onDismiss, width, style, icon, ...props }, ref) => {
    const combinedStyle = {
        ...style,
        ...(width && { width: typeof width === 'number' ? `${width}px` : width }),
    };
    const getRole = () => {
        switch (type) {
            case 'alert':
                return 'alert';
            case 'success':
                return 'status';
            default:
                return 'status';
        }
    };
    return (jsxRuntimeExports.jsx("div", { ref: ref, className: `${callout({ type, outline, highContrast })} ${className || ''}`, style: combinedStyle, role: getRole(), "aria-live": type === 'alert' ? 'assertive' : 'polite', ...props, children: jsxRuntimeExports.jsxs("div", { className: styles.container, children: [jsxRuntimeExports.jsxs("div", { className: styles.messageContainer, children: [icon !== undefined ? (jsxRuntimeExports.jsx("div", { className: styles.icon, "aria-hidden": "true", children: icon })) : (jsxRuntimeExports.jsx(InfoCircledIcon, { className: styles.icon, "aria-hidden": "true" })), jsxRuntimeExports.jsx("div", { className: styles.message, children: children })] }), jsxRuntimeExports.jsxs("div", { className: styles.actionsContainer, children: [action && (jsxRuntimeExports.jsx("div", { className: styles.action, children: action })), dismissible && (jsxRuntimeExports.jsx("button", { className: styles.dismiss, onClick: onDismiss, "aria-label": "Dismiss message", type: "button", children: jsxRuntimeExports.jsx("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", role: "presentation", children: jsxRuntimeExports.jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M9.5066 3.3066C9.73115 3.08205 9.73115 2.71798 9.5066 2.49343C9.28205 2.26887 8.91798 2.26887 8.69343 2.49343L6.00001 5.18684L3.3066 2.49343C3.08205 2.26887 2.71798 2.26887 2.49343 2.49343C2.26887 2.71798 2.26887 3.08205 2.49343 3.3066L5.18684 6.00001L2.49343 8.69343C2.26887 8.91798 2.26887 9.28205 2.49343 9.5066C2.71798 9.73115 3.08205 9.73115 3.3066 9.5066L6.00001 6.81318L8.69343 9.5066C8.91798 9.73115 9.28205 9.73115 9.5066 9.5066C9.73115 9.28205 9.73115 8.91798 9.5066 8.69343L6.81318 6.00001L9.5066 3.3066Z", fill: "currentColor" }) }) }))] })] }) }));
});
Callout.displayName = 'Callout';

export { Callout };
//# sourceMappingURL=callout.js.map
