'use strict';

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

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

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

var _propTypes2 = _interopRequireDefault(_propTypes);

var _styledComponents = require('styled-components');

var _styledComponents2 = _interopRequireDefault(_styledComponents);

var _Loaders = require('../Loaders');

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

var BaseModalBody = _styledComponents2.default.div.withConfig({
  displayName: 'ModalBody__BaseModalBody'
})(['position:relative;width:100%;padding:', ';box-sizing:border-box;@media (max-width:425px){padding-top:20px;padding-bottom:20px;}'], function (props) {
  return props.tray ? '60px 15%' : '25px 30px';
});
var SplashScreen = _styledComponents2.default.div.withConfig({
  displayName: 'ModalBody__SplashScreen'
})(['position:absolute;top:0;left:0;display:', ';flex-direction:row;justify-content:center;align-items:center;width:100%;height:100%;background-color:', ';z-index:5;'], function (props) {
  return props.displayed ? 'flex' : 'none';
}, function (props) {
  return props.theme['white'];
});

var ModalBody = function ModalBody(props) {
  var children = props.children,
      loading = props.loading;


  return _react2.default.createElement(
    BaseModalBody,
    null,
    _react2.default.createElement(
      SplashScreen,
      { displayed: loading },
      _react2.default.createElement(_Loaders.BlockchainLoader, null)
    ),
    children
  );
};

ModalBody.propTypes = {
  loading: _propTypes2.default.bool
};

ModalBody.defaultProps = {
  loading: false
};

exports.default = ModalBody;