'use strict';

exports.__esModule = true;

var _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; };

var _class, _temp; /* eslint-disable jsx-a11y/no-noninteractive-tabindex */


var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _reactDom = require('react-dom');

var _reactDom2 = _interopRequireDefault(_reactDom);

var _propTypes = require('prop-types');

var _propTypes2 = _interopRequireDefault(_propTypes);

var _styleModule = require('./style.module.scss');

var _styleModule2 = _interopRequireDefault(_styleModule);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }

function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

var classy = function classy() {
  for (var _len = arguments.length, classlist = Array(_len), _key = 0; _key < _len; _key++) {
    classlist[_key] = arguments[_key];
  }

  return classlist.filter(function (e) {
    return e;
  }).join(' ');
};

var Modal = (_temp = _class = function (_React$Component) {
  _inherits(Modal, _React$Component);

  function Modal(props) {
    _classCallCheck(this, Modal);

    var _this = _possibleConstructorReturn(this, _React$Component.call(this, props));

    _this.handleClickOut = function (_ref) {
      var target = _ref.target;

      if (target === _this.root) _this.toggle(false);
    };

    _this.root = document.querySelector(props.target);
    _this.el = _react2.default.createRef();

    _this.state = {
      open: !!props.open
    };
    return _this;
  }

  Modal.prototype.componentDidMount = function componentDidMount() {
    if (!this.props.noDismiss) {
      this.root.addEventListener('click', this.handleClickOut);
      if (this.state.open) this.root.classList.add(_styleModule2.default.Modal_open);
    }
    if (this.props.noDismiss) this.root.classList.add('ModalWrapper_noDismiss');
    if (this.props.verticalCenter) this.root.classList.add('ModalWrapper_verticalCenter');
  };

  Modal.prototype.componentWillUnmount = function componentWillUnmount() {
    if (!this.props.noDismiss) {
      this.root.removeEventListener('click', this.handleClickOut);
    }
  };

  Modal.prototype.toggle = function toggle(toState) {
    var _this2 = this;

    // eslint-disable-next-line no-param-reassign
    toState = typeof toState === 'boolean' ? toState : !this.state.open;

    this.setState({ open: toState });

    setTimeout(function () {
      var _props = _this2.props,
          onClose = _props.onClose,
          onOpen = _props.onOpen;
      var el = _this2.el.current;

      if (toState) {
        _this2.root.classList.add(_styleModule2.default.Modal_open);
        el.focus(); // focus modal
        if (typeof onOpen === 'function') onOpen();
      } else {
        _this2.root.classList.remove(_styleModule2.default.Modal_open);
        if (typeof onClose === 'function') onClose();
      }
    }, 0);
  };

  Modal.prototype.render = function render() {
    var _this3 = this;

    var open = this.state.open;

    var _props2 = this.props,
        className = _props2.className,
        children = _props2.children,
        noDismiss = _props2.noDismiss,
        scrollable = _props2.scrollable,
        size = _props2.size,
        verticalCenter = _props2.verticalCenter,
        attrs = _objectWithoutProperties(_props2, ['className', 'children', 'noDismiss', 'scrollable', 'size', 'verticalCenter']);

    var modalClasses = ['Box', 'Box_modal', 'Modal', open && 'Modal_open', scrollable && 'Modal_scrollable', size && 'Modal_' + size, verticalCenter && 'Modal_verticalCenter', className].map(function (cn) {
      return cn in _styleModule2.default ? _styleModule2.default[cn] : cn;
    });

    return _reactDom2.default.createPortal(_react2.default.createElement(
      'section',
      _extends({
        ref: this.el,
        'aria-hidden': !open,
        'aria-modal': true,
        className: classy.apply(undefined, modalClasses),
        onKeyDown: function onKeyDown(_ref2) {
          var key = _ref2.key;

          if (!noDismiss && key === 'Escape') _this3.toggle(false);
        },
        role: 'dialog',
        tabIndex: 0
      }, attrs),
      this.props.children
    ), this.root);
  };

  return Modal;
}(_react2.default.Component), _class.defaultProps = {
  open: false,
  target: 'body'
}, _temp);
Modal.propTypes = process.env.NODE_ENV !== "production" ? {
  children: _propTypes2.default.any,
  className: _propTypes2.default.string,
  id: _propTypes2.default.string,
  noDismiss: _propTypes2.default.bool,
  onClose: _propTypes2.default.func,
  onOpen: _propTypes2.default.func,
  /** The modal's initial state.
   */
  open: _propTypes2.default.bool,
  scrollable: _propTypes2.default.bool,
  size: _propTypes2.default.oneOf(['sm', 'md', 'lg']),
  /** DOM element to inject the modal in to.
   */
  target: _propTypes2.default.string,
  verticalCenter: _propTypes2.default.bool
} : {};
exports.default = Modal;
module.exports = exports['default'];