import ReportProblemOutlinedIcon from '../../../../../node_modules/@mui/icons-material/esm/ReportProblemOutlined.mjs';
import React__default from 'react';
import { Typography } from './Typography.mjs';
import styled from '../../../../../node_modules/@mui/material/styles/styled.mjs';

const StyledAlert = styled('div')(({ theme })=>({
        color: theme.styleConfig.colors.primary,
        padding: theme.spacing(1.5, 3),
        backgroundColor: theme.styleConfig.colors.accent,
        display: 'flex',
        alignItems: 'center',
        gap: theme.spacing(1)
    }));
const Alert = ({ children })=>{
    return /*#__PURE__*/ React__default.createElement(StyledAlert, null, /*#__PURE__*/ React__default.createElement(ReportProblemOutlinedIcon, {
        style: {
            fontSize: 16
        }
    }), /*#__PURE__*/ React__default.createElement(Typography, {
        variant: "body2"
    }, children));
};

export { Alert };
//# sourceMappingURL=Alert.mjs.map
