import { _ as _slicedToArray } from './slicedToArray-6ebcbfea.js';
import React__default, { useState } from 'react';
import Modal from 'react-bootstrap/Modal';
import './_commonjsHelpers-0c4b6f40.js';
import './web.dom.iterable-ab4dea5c.js';
import './core.get-iterator-method-ea258bb1.js';

var PopUpModal = function PopUpModal(props) {
  var _ref = props.ModalImage ? useState(true) : useState(false),
      _ref2 = _slicedToArray(_ref, 2),
      show = _ref2[0],
      setShow = _ref2[1];

  var launchModalButton = function launchModalButton(e) {
    window.open(props.landingURL, '_blank');
    setShow(false);
  };

  return React__default.createElement(
    Modal,
    { show: show, onHide: function onHide() {
        return setShow(false);
      }, 'aria-labelledby': 'Popup-Modal' },
    React__default.createElement(Modal.Title, null),
    React__default.createElement(
      Modal.Body,
      null,
      React__default.createElement(
        'div',
        { className: 'modalImageHolder' },
        React__default.createElement('img', { className: 'modalImage', src: props.ModalImage, onClick: function onClick() {
            return launchModalButton();
          } }),
        React__default.createElement(
          'div',
          { className: 'modalClose', onClick: function onClick() {
              return setShow(false);
            } },
          'X'
        )
      )
    ),
    React__default.createElement(
      'style',
      { jsx: 'true' },
      '\n          .modalImageHolder {\n            display: flex;\n            justify-content: center;\n          }\n          .modalClose {\n            display: flex;\n            justify-content: center;\n            width: 25px;\n            height: 25px;\n            font-size: 1.25rem;\n            color: #fff;\n            cursor: pointer;\n          }\n          .modalImage {\n            cursor: pointer;\n          }\n        '
    )
  );
};

export default PopUpModal;
