import { a as __rest, _ as __assign } from '../tslib.es6-faad35dc.js';
import { jsx } from 'react/jsx-runtime';
import { forwardRef } from 'react';
import { styled } from '@mui/material/styles';
import MuiAlert from '@mui/material/Alert';
import colors from '../theme/colors.js';

var backgroundMap = {
    warning: colors.yellow.light,
    success: colors.green.light,
    error: colors.red.light,
    info: colors.blue.light
};
var colorMap = {
    warning: colors.yellow.main,
    success: colors.text.positive,
    error: colors.text.negative,
    info: colors.blue.main
};
var StyledAlert = styled(MuiAlert)(function (_a) {
    var _b;
    var color = _a.color, icon = _a.icon, rounded = _a.rounded, align = _a.align, theme = _a.theme;
    return (_b = {
            fontSize: theme.typography.fontSizeXs2,
            lineHeight: theme.typography.lineHeightS,
            fontWeight: theme.typography.fontWeightBold,
            padding: theme.spacing(1.5, 2),
            alignItems: "flex-start",
            justifyContent: align !== null && align !== void 0 ? align : "flex-start",
            backgroundColor: backgroundMap[color !== null && color !== void 0 ? color : "info"],
            borderRadius: rounded ? theme.borders.radius.sm : 0,
            opacity: 1,
            "& *": {
                color: colorMap[color !== null && color !== void 0 ? color : "info"]
            },
            "&.MuiAlert-filled": {
                backgroundColor: colorMap[color !== null && color !== void 0 ? color : "info"],
                color: theme.palette.text.inversePrimary,
                "& *": {
                    color: theme.palette.text.inversePrimary
                },
                "& .MuiAlert-icon": {
                    color: theme.palette.text.inversePrimary
                }
            },
            "& .MuiAlert-message": {
                padding: 0
            },
            "& .MuiAlert-icon": {
                display: icon ? "flex" : "none",
                alignItems: "center",
                padding: 0,
                marginRight: theme.spacing(1),
                height: theme.typography.lineHeightS,
                color: colorMap[color !== null && color !== void 0 ? color : "info"],
                opacity: 1,
                "& path": {
                    fill: "currentColor"
                }
            }
        },
        _b[theme.breakpoints.down("sm")] = {
            fontSize: "12px",
            lineHeight: "15px",
            borderRadius: rounded ? theme.borders.radius.xs1 : 0
        },
        _b);
});
var Alert = forwardRef(function (_a, ref) {
    var icon = _a.icon, _b = _a.filled, filled = _b === void 0 ? false : _b, _c = _a.rounded, rounded = _c === void 0 ? true : _c, align = _a.align, color = _a.color, props = __rest(_a, ["icon", "filled", "rounded", "align", "color"]);
    var className = filled ? "MuiAlert-filled" : undefined;
    return (jsx(StyledAlert, __assign({ ref: ref, className: className, color: color, icon: icon, rounded: rounded, align: align }, props, { elevation: 0 }), void 0));
});

export { backgroundMap, colorMap, Alert as default };
