import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
var _class, _MobilePopup;
import React from 'react';
import { Transition } from 'react-transition-group';
import { ThemeContext } from "../../../lib/theming/ThemeContext";
import { RenderContainer } from "../../RenderContainer";
import { HideBodyVerticalScroll } from "../../HideBodyVerticalScroll";
import { ZIndex } from "../../ZIndex";
import { RenderLayer } from "../../RenderLayer";
import { rootNode } from "../../../lib/rootNode";
import { jsStyles } from "../MobilePopup.styles";
import { MobilePopupHeader } from "../MobilePopupHeader";
import { MobilePopupFooter } from "../MobilePopupFooter";
export var MobilePopupDataTids = {
  root: 'MobilePopup__root',
  container: 'MobilePopup__container'
};
export var MobilePopup = rootNode(_class = (_MobilePopup = /*#__PURE__*/function (_React$Component) {
  function MobilePopup() {
    var _this;
    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }
    _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
    _this.close = function () {
      if (_this.props.onCloseRequest) {
        _this.props.onCloseRequest();
      }
    };
    return _this;
  }
  _inheritsLoose(MobilePopup, _React$Component);
  var _proto = MobilePopup.prototype;
  _proto.render = function render() {
    var _this2 = this;
    return /*#__PURE__*/React.createElement(ThemeContext.Consumer, null, function (theme) {
      _this2.theme = theme;
      return _this2.renderMain();
    });
  };
  _proto.renderMain = function renderMain() {
    var content = /*#__PURE__*/React.createElement(ZIndex, {
      id: this.props.id,
      className: jsStyles.zIndex(),
      priority: 'MobilePopup'
    }, /*#__PURE__*/React.createElement(Transition, {
      "in": this.props.opened,
      onExited: this.props.onClose,
      mountOnEnter: true,
      unmountOnExit: true,
      timeout: 0
    }, /*#__PURE__*/React.createElement("div", {
      className: jsStyles.wrapper()
    }, /*#__PURE__*/React.createElement(RenderLayer, {
      onClickOutside: this.close
    }, /*#__PURE__*/React.createElement("div", {
      ref: this.setRootNode,
      "data-tid": MobilePopupDataTids.container,
      className: jsStyles.container(this.theme)
    }, /*#__PURE__*/React.createElement("div", {
      "data-tid": MobilePopupDataTids.root,
      className: jsStyles.root(this.theme)
    }, /*#__PURE__*/React.createElement(MobilePopupHeader, {
      caption: this.props.caption
    }, this.props.headerChildComponent), /*#__PURE__*/React.createElement("div", {
      className: jsStyles.content(this.theme)
    }, this.props.children), /*#__PURE__*/React.createElement(MobilePopupFooter, null, this.props.footerChildComponent)), /*#__PURE__*/React.createElement("div", {
      onClick: this.close,
      className: jsStyles.bottomIndent()
    }))), /*#__PURE__*/React.createElement("div", {
      className: jsStyles.bg()
    }), /*#__PURE__*/React.createElement(HideBodyVerticalScroll, null))));
    if (this.props.withoutRenderContainer) {
      return content;
    }
    return /*#__PURE__*/React.createElement(RenderContainer, null, content);
  };
  return MobilePopup;
}(React.Component), _MobilePopup.__KONTUR_REACT_UI__ = 'MobileMenuHeader', _MobilePopup.displayName = 'MobileMenuHeader', _MobilePopup.defaultRootNode = null, _MobilePopup)) || _class;