UNPKG

react-error-boundaries

Version:
80 lines (58 loc) 2.66 kB
'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); exports.default = undefined; var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of'); var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf); var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck'); var _classCallCheck3 = _interopRequireDefault(_classCallCheck2); var _createClass2 = require('babel-runtime/helpers/createClass'); var _createClass3 = _interopRequireDefault(_createClass2); var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn'); var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2); var _inherits2 = require('babel-runtime/helpers/inherits'); var _inherits3 = _interopRequireDefault(_inherits2); var _react = require('react'); var _react2 = _interopRequireDefault(_react); var _reactDom = require('react-dom'); var _reactDom2 = _interopRequireDefault(_reactDom); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } var Modal = function (_React$PureComponent) { (0, _inherits3.default)(Modal, _React$PureComponent); function Modal(props) { (0, _classCallCheck3.default)(this, Modal); // Create a div that we'll render the modal into. Because each // Modal component has its own element, we can render multiple // modal components into the modal container. var _this = (0, _possibleConstructorReturn3.default)(this, (Modal.__proto__ || (0, _getPrototypeOf2.default)(Modal)).call(this, props)); _this.el = document.createElement('div'); return _this; } (0, _createClass3.default)(Modal, [{ key: 'componentDidMount', value: function componentDidMount() { // Append the element into the DOM on mount. We'll render // into the modal container element (see the HTML tab). document.body.appendChild(this.el); } }, { key: 'componentWillUnmount', value: function componentWillUnmount() { // Remove the element from the DOM when we unmount document.body.removeChild(this.el); } }, { key: 'render', value: function render() { // Use a portal to render the children into the element return _reactDom2.default.createPortal( // Any valid React child: JSX, strings, arrays, etc. this.props.children, // A DOM element this.el); } }]); return Modal; }(_react2.default.PureComponent); exports.default = Modal;