@unicity/design-system
Version:
A comprehensive React component library built on Material-UI with advanced theming capabilities including neumorphism design support
13 lines • 1.13 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { IconButton, Typography } from '@mui/material';
import { Close } from '@mui/icons-material';
import { StyledModal, ModalContent, ModalHeader, ModalBody } from './Modal.style';
export const Modal = ({ open, onClose, title, children, size = 'medium', showCloseButton = true, closeOnBackdropClick = true, maxWidth, centered = true, ...props }) => {
const handleBackdropClick = (event) => {
if (closeOnBackdropClick && event.target === event.currentTarget) {
onClose();
}
};
return (_jsx(StyledModal, { open: open, onClose: onClose, onClick: handleBackdropClick, centered: centered, ...props, children: _jsxs(ModalContent, { size: size, maxWidth: maxWidth, children: [(title || showCloseButton) && (_jsxs(ModalHeader, { children: [title && (_jsx(Typography, { variant: "h6", component: "h2", children: title })), showCloseButton && (_jsx(IconButton, { onClick: onClose, size: "small", sx: { ml: 'auto' }, children: _jsx(Close, {}) }))] })), _jsx(ModalBody, { children: children })] }) }));
};
//# sourceMappingURL=Modal.js.map