bilingo-ui/lib/Modal/index.js

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }

var inherits = require('../inherits-c86d64c1.js');
var React = require('react');
var React__default = _interopDefault(React);
var reactDom = require('react-dom');
var reactDom__default = _interopDefault(reactDom);
var styleInject_es = require('../style-inject.es-dcee06b6.js');

function isBrowser() {
  return !((typeof window === "undefined" ? "undefined" : inherits._typeof(window)) === undefined);
}

var css = ".Modal_wrapper__2hzaC {\n  position: fixed;\n  width: 100vw;\n  height: 100vh;\n  top: 0;\n  left: 0;\n  z-index: 1000;\n}\n.Modal_overlay__3iNdm {\n  width: 100vw;\n  height: 100vh;\n  background: #000;\n  animation: Modal_overlayer__1zSH9 0.3s forwards;\n}\n.Modal_container__2veos {\n  position: absolute;\n  top: 20%;\n  left: 50%;\n  animation: Modal_container__2veos 0.3s forwards;\n}\n@keyframes Modal_overlayer__1zSH9 {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 0.3;\n  }\n}\n@keyframes Modal_container__2veos {\n  from {\n    transform: translateX(-50%) scale(0, 0);\n  }\n  to {\n    transform: translateX(-50%) scale(1, 1);\n  }\n}\n";
var styles = {
  "wrapper": "Modal_wrapper__2hzaC",
  "overlay": "Modal_overlay__3iNdm",
  "overlayer": "Modal_overlayer__1zSH9",
  "container": "Modal_container__2veos"
};
styleInject_es.styleInject(css);

var Modal =
/*#__PURE__*/
function (_React$PureComponent) {
  inherits._inherits(Modal, _React$PureComponent);

  function Modal() {
    inherits._classCallCheck(this, Modal);

    return inherits._possibleConstructorReturn(this, inherits._getPrototypeOf(Modal).apply(this, arguments));
  }

  inherits._createClass(Modal, [{
    key: "render",
    value: function render() {
      if (!isBrowser()) return null;
      var DEFAULT_CONTAINER = document.getElementById("container");
      var _this$props = this.props,
          children = _this$props.children,
          visible = _this$props.visible,
          onCancel = _this$props.onCancel,
          container = _this$props.container;
      var finalMountContainer;

      if (!container) {
        if (!DEFAULT_CONTAINER) {
          if (!Modal.hasShowWarning) {
            Modal.hasShowWarning = true;
          }

          finalMountContainer = document.body;
        } else {
          if (!Modal.hasShowWarning) {
            Modal.hasShowWarning = true;
          }

          finalMountContainer = DEFAULT_CONTAINER;
        }
      } else {
        finalMountContainer = container;
      }

      return visible && reactDom.createPortal(React__default.createElement("div", {
        className: styles.wrapper
      }, React__default.createElement("div", {
        className: styles.overlay,
        onClick: onCancel
      }), React__default.createElement("div", {
        className: styles.container
      }, children)), finalMountContainer);
    }
  }]);

  return Modal;
}(React__default.PureComponent);
Modal.hasShowWarning = false;

exports.Modal = Modal;
exports.default = Modal;
//# sourceMappingURL=index.js.map