@unstoppabledomains/ui-kit
Version:
A set of common Unstoppable Domains components
58 lines • 2.28 kB
JavaScript
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
import SuccessIcon from '@mui/icons-material/CheckCircleOutlined';
import ErrorIcon from '@mui/icons-material/ErrorOutlineOutlined';
import InfoIcon from '@mui/icons-material/InfoOutlined';
import WarningIcon from '@mui/icons-material/WarningAmberOutlined';
import MuiAlert from '@mui/material/Alert';
import MuiAlertTitle from '@mui/material/AlertTitle';
import React from 'react';
import { useStyles } from "./Alert.styles";
const Alert = ({
heading,
severity = 'info',
size = 'small',
variant = 'standard',
children,
...props
}) => {
const {
classes,
cx
} = useStyles({
severity,
size,
variant,
hasAction: !!props.action || !!props.onClose
});
if (!heading && !children) {
throw new Error('Alert must have either heading or children');
}
return /*#__PURE__*/React.createElement(MuiAlert, _extends({}, props, {
classes: {
...props.classes,
icon: cx(classes.icon, props.classes?.icon),
message: cx(classes.message, props.classes?.message),
action: cx(classes.action, props.onClose ? classes.closeAction : '', props.classes?.action),
root: cx(classes.root, props.className || props.classes?.root)
},
iconMapping: {
warning: /*#__PURE__*/React.createElement(WarningIcon, null),
error: /*#__PURE__*/React.createElement(ErrorIcon, null),
success: /*#__PURE__*/React.createElement(SuccessIcon, null),
info: /*#__PURE__*/React.createElement(InfoIcon, null)
},
severity: severity,
variant: variant
}), !!heading && /*#__PURE__*/React.createElement(MuiAlertTitle, {
className: cx(classes.heading, props.classes?.heading)
}, heading), Boolean(children) && /*#__PURE__*/React.createElement("div", _extends({
className: cx(classes.body, props.classes?.body)
}, typeof children === 'string' ? {
dangerouslySetInnerHTML: {
__html: children
}
} : {
children
})));
};
export default Alert;