import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { cn } from "../../../utils/cn";
import { Text } from "../../../components/atoms/Text";
const variantStyles = {
    success: "bg-success-50 dark:bg-success-900/20 border-success-200 dark:border-success-800 text-success-800 dark:text-success-200",
    error: "bg-error-50 dark:bg-error-900/20 border-error-200 dark:border-error-800 text-error-800 dark:text-error-200",
    warning: "bg-warning-50 dark:bg-warning-900/20 border-warning-200 dark:border-warning-800 text-warning-800 dark:text-warning-200",
    info: "bg-info-50 dark:bg-info-900/20 border-info-200 dark:border-info-800 text-info-800 dark:text-info-200",
};
export const Alert = ({ variant = "info", title, message, onClose, className, }) => {
    return (_jsx("div", { className: cn("border rounded-lg p-4", variantStyles[variant], className), role: "alert", children: _jsxs("div", { className: "flex items-start justify-between", children: [_jsxs("div", { className: "flex-1", children: [title && (_jsx(Text, { variant: "h6", className: "font-semibold mb-1", children: title })), _jsx(Text, { variant: "body", children: message })] }), onClose && (_jsx("button", { onClick: onClose, className: "ml-4 text-current opacity-70 hover:opacity-100", "aria-label": "Close alert", children: _jsx("svg", { className: "w-5 h-5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) }) }))] }) }));
};
export default Alert;
