"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.Backdrop = exports.Footer = exports.Body = exports.Content = exports.Dialog = exports.Header = exports.Modal = void 0;

var _react = _interopRequireDefault(require("react"));

var _propTypes = _interopRequireDefault(require("prop-types"));

require("./Modal.css");

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

var backgroundClick = function backgroundClick(event, onBackgroundClick) {
  if (event.target.matches('.modal')) {
    onBackgroundClick();
  }
};

var Modal = function Modal(_ref) {
  var children = _ref.children,
      onBackgroundClick = _ref.onBackgroundClick;
  return _react.default.createElement("div", {
    className: "modal",
    style: {
      display: 'block'
    },
    onClick: function onClick(event) {
      return onBackgroundClick ? backgroundClick(event, onBackgroundClick) : {};
    }
  }, children);
};

exports.Modal = Modal;

var Header = function Header(_ref2) {
  var title = _ref2.title,
      children = _ref2.children;
  return _react.default.createElement("div", {
    className: "modal-header"
  }, title && _react.default.createElement("h1", null, title), children);
};

exports.Header = Header;
Header.propTypes = {
  title: _propTypes.default.string
};

var Dialog = function Dialog(_ref3) {
  var children = _ref3.children;
  return _react.default.createElement("div", {
    className: "modal-dialog"
  }, children);
};

exports.Dialog = Dialog;

var Content = function Content(_ref4) {
  var children = _ref4.children;
  return _react.default.createElement("div", {
    className: "modal-content"
  }, children);
};

exports.Content = Content;

var Body = function Body(_ref5) {
  var children = _ref5.children;
  return _react.default.createElement("div", {
    className: "modal-body"
  }, children);
};

exports.Body = Body;

var Footer = function Footer(_ref6) {
  var children = _ref6.children;
  return _react.default.createElement("div", {
    className: "modal-footer"
  }, children);
};

exports.Footer = Footer;

var Backdrop = function Backdrop() {
  return _react.default.createElement("div", {
    className: "modal-backdrop fade in"
  });
};

exports.Backdrop = Backdrop;