UNPKG

8.21 kBSource Map (JSON)View Raw
1{"version":3,"file":"Modal.js","sources":["../src/components/Modal/Modal.js"],"sourcesContent":["import React from 'react'\nimport PropTypes from 'prop-types'\nimport { Transition, animated } from 'react-spring'\nimport { cssPx, noop } from '../../utils'\nimport { springs, GU, RADIUS } from '../../style'\nimport { useTheme } from '../../theme'\nimport { useViewport } from '../../providers/Viewport'\nimport { IconCross } from '../../icons'\nimport ButtonIcon from '../Button/ButtonIcon'\nimport EscapeOutside from '../EscapeOutside/EscapeOutside'\nimport RootPortal from '../RootPortal/RootPortal'\n\nconst SPACE_AROUND = 4 * GU\n\nfunction Modal({\n children,\n onClose,\n padding,\n visible,\n width,\n closeButton,\n ...props\n}) {\n const theme = useTheme()\n const viewport = useViewport()\n\n return (\n <RootPortal>\n <Transition\n native\n items={visible}\n from={{ opacity: 0, scale: 0.98 }}\n enter={{ opacity: 1, scale: 1 }}\n leave={{ opacity: 0, scale: 0.98 }}\n config={{ ...springs.smooth, precision: 0.001 }}\n >\n {show =>\n show &&\n /* eslint-disable react/prop-types */\n (({ opacity, scale }) => (\n <animated.div\n css={`\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: ${theme.overlay.alpha(0.9)};\n `}\n style={{ opacity }}\n {...props}\n >\n <animated.div\n css={`\n position: absolute;\n z-index: 1;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n display: grid;\n align-items: center;\n justify-content: center;\n overflow: auto;\n `}\n style={{\n pointerEvents: visible ? 'auto' : 'none',\n transform: scale.interpolate(v => `scale3d(${v}, ${v}, 1)`),\n }}\n >\n <div\n css={`\n padding: ${SPACE_AROUND}px 0;\n `}\n >\n <EscapeOutside\n role=\"alertdialog\"\n background={theme.surface}\n onEscapeOutside={onClose}\n css={`\n position: relative;\n overflow: hidden;\n min-width: ${360 - SPACE_AROUND * 2}px;\n background: ${theme.surface};\n box-shadow: 0 10px 28px rgba(0, 0, 0, 0.15);\n `}\n style={{\n width: cssPx(\n typeof width === 'function' ? width(viewport) : width\n ),\n borderRadius: `${RADIUS}px`,\n }}\n >\n {closeButton && (\n <ButtonIcon\n label=\"Close\"\n onClick={onClose}\n css={`\n position: absolute;\n z-index: 2;\n top: ${2 * GU}px;\n right: ${2 * GU}px;\n `}\n >\n <IconCross />\n </ButtonIcon>\n )}\n <div\n style={{\n padding: cssPx(\n typeof padding === 'function'\n ? padding(viewport)\n : padding\n ),\n }}\n css={`\n position: relative;\n z-index: 1;\n `}\n >\n {children}\n </div>\n </EscapeOutside>\n </div>\n </animated.div>\n </animated.div>\n ))\n /* eslint-enable react/prop-types */\n }\n </Transition>\n </RootPortal>\n )\n}\n\nModal.propTypes = {\n children: PropTypes.node.isRequired,\n closeButton: PropTypes.bool,\n onClose: PropTypes.func,\n padding: PropTypes.oneOfType([\n PropTypes.func,\n PropTypes.number,\n PropTypes.string,\n ]),\n visible: PropTypes.bool.isRequired,\n width: PropTypes.oneOfType([\n PropTypes.func,\n PropTypes.number,\n PropTypes.string,\n ]),\n}\n\nModal.defaultProps = {\n closeButton: true,\n onClose: noop,\n padding: 3 * GU,\n width: viewport => Math.min(viewport.width - SPACE_AROUND * 2, 600),\n}\n\nexport default Modal\n"],"names":["SPACE_AROUND","GU","Modal","children","onClose","padding","visible","width","closeButton","props","theme","useTheme","viewport","useViewport","React","RootPortal","Transition","opacity","scale","springs","smooth","precision","show","overlay","alpha","pointerEvents","transform","interpolate","v","surface","cssPx","borderRadius","RADIUS","IconCross","propTypes","PropTypes","node","isRequired","bool","func","oneOfType","number","string","defaultProps","noop","Math","min"],"mappings":"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"}
\No newline at end of file