@roo-ui/components
Version:
90 lines (69 loc) • 10.4 kB
JavaScript
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = exports.ModalGlobalStyle = void 0;
var _styledBase = _interopRequireDefault(require("@emotion/styled-base"));
var _react = _interopRequireDefault(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _reactModal = _interopRequireDefault(require("react-modal"));
var _core = require("@emotion/core");
var _styledSystem = require("styled-system");
var _polished = require("polished");
var _ModalHeader = _interopRequireDefault(require("./components/ModalHeader"));
var _ModalBody = _interopRequireDefault(require("./components/ModalBody"));
var _ModalFooter = _interopRequireDefault(require("./components/ModalFooter"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _extends() { _extends = Object.assign || 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); }
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
var _ref = process.env.NODE_ENV === "production" ? {
name: "194uelo-ModalGlobalStyle",
styles: ".ReactModal__Body--open{overflow:hidden;}label:ModalGlobalStyle;"
} : {
name: "194uelo-ModalGlobalStyle",
styles: ".ReactModal__Body--open{overflow:hidden;}label:ModalGlobalStyle;",
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9Nb2RhbC9Nb2RhbC5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFZeUQiLCJmaWxlIjoiLi4vLi4vLi4vc3JjL01vZGFsL01vZGFsLmpzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0JztcbmltcG9ydCBQcm9wVHlwZXMgZnJvbSAncHJvcC10eXBlcyc7XG5pbXBvcnQgUmVhY3RNb2RhbCBmcm9tICdyZWFjdC1tb2RhbCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBHbG9iYWwsIGNzcyB9IGZyb20gJ0BlbW90aW9uL2NvcmUnO1xuaW1wb3J0IHsgdGhlbWVHZXQgfSBmcm9tICdzdHlsZWQtc3lzdGVtJztcbmltcG9ydCB7IHJlbSwgcmdiYSB9IGZyb20gJ3BvbGlzaGVkJztcblxuaW1wb3J0IE1vZGFsSGVhZGVyIGZyb20gJy4vY29tcG9uZW50cy9Nb2RhbEhlYWRlcic7XG5pbXBvcnQgTW9kYWxCb2R5IGZyb20gJy4vY29tcG9uZW50cy9Nb2RhbEJvZHknO1xuaW1wb3J0IE1vZGFsRm9vdGVyIGZyb20gJy4vY29tcG9uZW50cy9Nb2RhbEZvb3Rlcic7XG5cbmV4cG9ydCBjb25zdCBNb2RhbEdsb2JhbFN0eWxlID0gKCkgPT4gPEdsb2JhbCBzdHlsZXM9e2Nzc2AgLlJlYWN0TW9kYWxfX0JvZHktLW9wZW4geyBvdmVyZmxvdzogaGlkZGVuOyB9IGB9IC8+O1xuXG5jb25zdCBNb2RhbCA9IHN0eWxlZCgoeyBjbGFzc05hbWUsIHdpZHRoLCAuLi5wcm9wcyB9KSA9PiAoXG4gIDxSZWFjdE1vZGFsXG4gICAgey4uLnByb3BzfVxuICAgIGNsYXNzTmFtZT1cIk1vZGFsQ29udGVudFwiXG4gICAgb3ZlcmxheUNsYXNzTmFtZT1cIk1vZGFsT3ZlcmxheVwiXG4gICAgcG9ydGFsQ2xhc3NOYW1lPXtjbGFzc05hbWV9XG4gIC8+XG4pKWBcbiAgLk1vZGFsT3ZlcmxheSB7XG4gICAgcG9zaXRpb246IGZpeGVkO1xuICAgIHRvcDogMHB4O1xuICAgIGxlZnQ6IDBweDtcbiAgICByaWdodDogMHB4O1xuICAgIGJvdHRvbTogMHB4O1xuICAgIGJhY2tncm91bmQtY29sb3I6ICR7KHsgdGhlbWUgfSkgPT4gcmdiYSh0aGVtZS5jb2xvcnMuZ3JleXMubWluZVNoYWZ0LCAwLjgpfTtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gIH1cblxuICAuTW9kYWxDb250ZW50IHtcbiAgICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gICAgdG9wOiBhdXRvO1xuICAgIGxlZnQ6IGF1dG87XG4gICAgcmlnaHQ6IGF1dG87XG4gICAgYm90dG9tOiBhdXRvO1xuICAgIGJvcmRlcjogbm9uZTtcbiAgICBiYWNrZ3JvdW5kOiAke3RoZW1lR2V0KCdjb2xvcnMud2hpdGUnKX07XG4gICAgb3ZlcmZsb3c6IGF1dG87XG4gICAgYm9yZGVyLXJhZGl1czogJHt0aGVtZUdldCgncmFkaWkuZGVmYXVsdCcpfTtcbiAgICBvdXRsaW5lOiBub25lO1xuICAgIHBhZGRpbmc6IDBweDtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47XG4gICAgbWF4LWhlaWdodDogOTAlO1xuICAgIHdpZHRoOiBjYWxjKDEwMCUgLSAke3RoZW1lR2V0KCdzcGFjZS41Jyl9KTtcblxuICAgIEBtZWRpYSAobWluLXdpZHRoOiAke3RoZW1lR2V0KCdicmVha3BvaW50cy4wJyl9KSB7XG4gICAgICBmbGV4OiAwIDEgJHsoeyB3aWR0aCB9KSA9PiB3aWR0aH07XG4gICAgfVxuICB9XG5gO1xuXG5Nb2RhbC5wcm9wVHlwZXMgPSB7XG4gIC4uLlJlYWN0TW9kYWwucHJvcFR5cGVzLFxuICB3aWR0aDogUHJvcFR5cGVzLm9uZU9mVHlwZShbUHJvcFR5cGVzLnN0cmluZywgUHJvcFR5cGVzLm51bWJlcl0pLFxufTtcblxuTW9kYWwuZGVmYXVsdFByb3BzID0ge1xuICB3aWR0aDogcmVtKDY2MCksXG4gIHJvbGU6ICdkaWFsb2cnLFxuICBhcmlhSGlkZUFwcDogdHJ1ZSxcbn07XG5cbk1vZGFsLmhlYWRlciA9IE1vZGFsSGVhZGVyO1xuTW9kYWwuYm9keSA9IE1vZGFsQm9keTtcbk1vZGFsLmZvb3RlciA9IE1vZGFsRm9vdGVyO1xuXG5leHBvcnQgZGVmYXVsdCBNb2RhbDtcbiJdfQ== */"
};
var ModalGlobalStyle = function ModalGlobalStyle() {
return _react.default.createElement(_core.Global, {
styles: _ref
});
};
exports.ModalGlobalStyle = ModalGlobalStyle;
var Modal = (
/*#__PURE__*/
0, _styledBase.default)(function (_ref2) {
var className = _ref2.className,
width = _ref2.width,
props = _objectWithoutProperties(_ref2, ["className", "width"]);
return _react.default.createElement(_reactModal.default, _extends({}, props, {
className: "ModalContent",
overlayClassName: "ModalOverlay",
portalClassName: className
}));
}, {
target: "e1qv8dvq0",
label: "Modal"
})(".ModalOverlay{position:fixed;top:0px;left:0px;right:0px;bottom:0px;background-color:", function (_ref3) {
var theme = _ref3.theme;
return (0, _polished.rgba)(theme.colors.greys.mineShaft, 0.8);
}, ";display:flex;justify-content:center;align-items:center;}.ModalContent{position:relative;top:auto;left:auto;right:auto;bottom:auto;border:none;background:", (0, _styledSystem.themeGet)('colors.white'), ";overflow:auto;border-radius:", (0, _styledSystem.themeGet)('radii.default'), ";outline:none;padding:0px;display:flex;flex-direction:column;max-height:90%;width:calc(100% - ", (0, _styledSystem.themeGet)('space.5'), ");@media (min-width:", (0, _styledSystem.themeGet)('breakpoints.0'), "){flex:0 1 ", function (_ref4) {
var width = _ref4.width;
return width;
}, ";}}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9Nb2RhbC9Nb2RhbC5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFxQkUiLCJmaWxlIjoiLi4vLi4vLi4vc3JjL01vZGFsL01vZGFsLmpzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0JztcbmltcG9ydCBQcm9wVHlwZXMgZnJvbSAncHJvcC10eXBlcyc7XG5pbXBvcnQgUmVhY3RNb2RhbCBmcm9tICdyZWFjdC1tb2RhbCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBHbG9iYWwsIGNzcyB9IGZyb20gJ0BlbW90aW9uL2NvcmUnO1xuaW1wb3J0IHsgdGhlbWVHZXQgfSBmcm9tICdzdHlsZWQtc3lzdGVtJztcbmltcG9ydCB7IHJlbSwgcmdiYSB9IGZyb20gJ3BvbGlzaGVkJztcblxuaW1wb3J0IE1vZGFsSGVhZGVyIGZyb20gJy4vY29tcG9uZW50cy9Nb2RhbEhlYWRlcic7XG5pbXBvcnQgTW9kYWxCb2R5IGZyb20gJy4vY29tcG9uZW50cy9Nb2RhbEJvZHknO1xuaW1wb3J0IE1vZGFsRm9vdGVyIGZyb20gJy4vY29tcG9uZW50cy9Nb2RhbEZvb3Rlcic7XG5cbmV4cG9ydCBjb25zdCBNb2RhbEdsb2JhbFN0eWxlID0gKCkgPT4gPEdsb2JhbCBzdHlsZXM9e2Nzc2AgLlJlYWN0TW9kYWxfX0JvZHktLW9wZW4geyBvdmVyZmxvdzogaGlkZGVuOyB9IGB9IC8+O1xuXG5jb25zdCBNb2RhbCA9IHN0eWxlZCgoeyBjbGFzc05hbWUsIHdpZHRoLCAuLi5wcm9wcyB9KSA9PiAoXG4gIDxSZWFjdE1vZGFsXG4gICAgey4uLnByb3BzfVxuICAgIGNsYXNzTmFtZT1cIk1vZGFsQ29udGVudFwiXG4gICAgb3ZlcmxheUNsYXNzTmFtZT1cIk1vZGFsT3ZlcmxheVwiXG4gICAgcG9ydGFsQ2xhc3NOYW1lPXtjbGFzc05hbWV9XG4gIC8+XG4pKWBcbiAgLk1vZGFsT3ZlcmxheSB7XG4gICAgcG9zaXRpb246IGZpeGVkO1xuICAgIHRvcDogMHB4O1xuICAgIGxlZnQ6IDBweDtcbiAgICByaWdodDogMHB4O1xuICAgIGJvdHRvbTogMHB4O1xuICAgIGJhY2tncm91bmQtY29sb3I6ICR7KHsgdGhlbWUgfSkgPT4gcmdiYSh0aGVtZS5jb2xvcnMuZ3JleXMubWluZVNoYWZ0LCAwLjgpfTtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gIH1cblxuICAuTW9kYWxDb250ZW50IHtcbiAgICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gICAgdG9wOiBhdXRvO1xuICAgIGxlZnQ6IGF1dG87XG4gICAgcmlnaHQ6IGF1dG87XG4gICAgYm90dG9tOiBhdXRvO1xuICAgIGJvcmRlcjogbm9uZTtcbiAgICBiYWNrZ3JvdW5kOiAke3RoZW1lR2V0KCdjb2xvcnMud2hpdGUnKX07XG4gICAgb3ZlcmZsb3c6IGF1dG87XG4gICAgYm9yZGVyLXJhZGl1czogJHt0aGVtZUdldCgncmFkaWkuZGVmYXVsdCcpfTtcbiAgICBvdXRsaW5lOiBub25lO1xuICAgIHBhZGRpbmc6IDBweDtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47XG4gICAgbWF4LWhlaWdodDogOTAlO1xuICAgIHdpZHRoOiBjYWxjKDEwMCUgLSAke3RoZW1lR2V0KCdzcGFjZS41Jyl9KTtcblxuICAgIEBtZWRpYSAobWluLXdpZHRoOiAke3RoZW1lR2V0KCdicmVha3BvaW50cy4wJyl9KSB7XG4gICAgICBmbGV4OiAwIDEgJHsoeyB3aWR0aCB9KSA9PiB3aWR0aH07XG4gICAgfVxuICB9XG5gO1xuXG5Nb2RhbC5wcm9wVHlwZXMgPSB7XG4gIC4uLlJlYWN0TW9kYWwucHJvcFR5cGVzLFxuICB3aWR0aDogUHJvcFR5cGVzLm9uZU9mVHlwZShbUHJvcFR5cGVzLnN0cmluZywgUHJvcFR5cGVzLm51bWJlcl0pLFxufTtcblxuTW9kYWwuZGVmYXVsdFByb3BzID0ge1xuICB3aWR0aDogcmVtKDY2MCksXG4gIHJvbGU6ICdkaWFsb2cnLFxuICBhcmlhSGlkZUFwcDogdHJ1ZSxcbn07XG5cbk1vZGFsLmhlYWRlciA9IE1vZGFsSGVhZGVyO1xuTW9kYWwuYm9keSA9IE1vZGFsQm9keTtcbk1vZGFsLmZvb3RlciA9IE1vZGFsRm9vdGVyO1xuXG5leHBvcnQgZGVmYXVsdCBNb2RhbDtcbiJdfQ== */"));
Modal.propTypes = _objectSpread({}, _reactModal.default.propTypes, {
width: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number])
});
Modal.defaultProps = {
width: (0, _polished.rem)(660),
role: 'dialog',
ariaHideApp: true
};
Modal.header = _ModalHeader.default;
Modal.body = _ModalBody.default;
Modal.footer = _ModalFooter.default;
var _default = Modal;
exports.default = _default;
;