"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.ModalView = void 0;

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

var _Modal = require("../../../components/Modal");

var _jsxRuntime = require("react/jsx-runtime");

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

var ModalView = function ModalView(_ref) {
  var text = _ref.text,
      toggleText = _ref.toggleText,
      isOpenSmallModal = _ref.isOpenSmallModal,
      isOpenMediumModal = _ref.isOpenMediumModal,
      isOpenFullModal = _ref.isOpenFullModal,
      toggleSmallModal = _ref.toggleSmallModal,
      toggleMediumModal = _ref.toggleMediumModal,
      toggleFullModal = _ref.toggleFullModal;
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
      className: "form-check mb-5",
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
        className: "form-check-input appearance-none h-4 w-4 border border-gray-300 rounded-sm bg-white focus:outline-none transition duration-200 mt-1 align-top bg-no-repeat bg-center bg-contain float-left mr-2 cursor-pointer",
        type: "checkbox",
        id: "flexCheckDefault",
        onClick: toggleText
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("label", {
        className: "form-check-label inline-block text-gray-800",
        htmlFor: "flexCheckDefault",
        children: "Long text"
      })]
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
      type: "button",
      className: "btn-primary mr-3",
      onClick: toggleSmallModal,
      children: "Small modal"
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
      type: "button",
      className: "btn-primary mr-3",
      onClick: toggleMediumModal,
      children: "Medium modal"
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
      type: "button",
      className: "btn-primary mr-3",
      onClick: toggleFullModal,
      children: "Full modal"
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Modal.Modal, {
      onClose: toggleSmallModal,
      open: isOpenSmallModal,
      size: "small",
      title: "Small Modal",
      children: text
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Modal.Modal, {
      onClose: toggleMediumModal,
      open: isOpenMediumModal,
      size: "medium",
      title: "Medium Modal",
      children: text
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Modal.Modal, {
      onClose: toggleFullModal,
      open: isOpenFullModal,
      size: "full",
      title: "Full Modal",
      children: text
    })]
  });
};

exports.ModalView = ModalView;