@shakthillc/components/es/ModalBox/ModalBox.js

React generic components for shakthi products

import _slicedToArray from "babel-runtime/helpers/slicedToArray";
import React, { useState, useEffect } from "react";
import style from "./ModalBox.module.css";
import Button from "./../Button/Button";
import Icon from "@material-ui/core/Icon";

var ModalBox = function ModalBox(_ref) {
  var _ref$text = _ref.text,
      text = _ref$text === undefined ? "Modal text" : _ref$text,
      btext1 = _ref.btext1,
      btext2 = _ref.btext2,
      _ref$type = _ref.type1,
      type1 = _ref$type === undefined ? true : _ref$type,
      _ref$type2 = _ref.type2,
      type2 = _ref$type2 === undefined ? false : _ref$type2,
      _ref$show = _ref.show,
      show = _ref$show === undefined ? true : _ref$show,
      bfunction1 = _ref.bfunction1,
      bfunction2 = _ref.bfunction2,
      handleClose = _ref.handleClose;

  var _useState = useState(show),
      _useState2 = _slicedToArray(_useState, 2),
      flag = _useState2[0],
      setFlag = _useState2[1];

  useEffect(function () {
    setFlag(show);
  }, [show]);

  if (type1) {
    return React.createElement(
      "div",
      { className: flag ? style["container"] : style["container--hide"] },
      React.createElement(
        "div",
        { className: style["modal__container"] },
        React.createElement(
          "div",
          { className: style["modal__text"] },
          text
        ),
        React.createElement(
          "div",
          { className: style["modal__button"] },
          React.createElement(Button, {
            text: btext1,
            onClick: function onClick() {
              bfunction1 && bfunction1();
            }
          }),
          " ",
          "\xA0\xA0\xA0\xA0\xA0\xA0",
          React.createElement(Button, {
            text: btext2,
            onClick: function onClick() {
              bfunction2 && bfunction2();
            }
          })
        ),
        React.createElement(
          "div",
          {
            onClick: function onClick() {
              handleClose && handleClose();
            },
            className: style["modal__close"]
          },
          React.createElement(
            Icon,
            null,
            "close"
          )
        )
      )
    );
  }
  if (type2) {
    return React.createElement(
      "div",
      { className: flag ? style["container"] : style["container--hide"] },
      React.createElement(
        "div",
        { className: style["modal__container"] },
        React.createElement(
          "div",
          { className: style["modal__text"] },
          text
        ),
        React.createElement(
          "div",
          { className: style["modal__button"] },
          React.createElement(Button, {
            text: btext1,
            onClick: function onClick() {
              bfunction1 && bfunction1();
            }
          }),
          " ",
          "\xA0\xA0\xA0\xA0\xA0\xA0"
        ),
        React.createElement(
          "div",
          {
            onClick: function onClick() {
              handleClose && handleClose();
            },
            className: style["modal__close"]
          },
          React.createElement(
            Icon,
            null,
            "close"
          )
        )
      )
    );
  }
};

export default ModalBox;