function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
import { useEffect, useState, createRef } from 'react';
import ignoreEvent from '@filerobot/utils/lib/ignoreEvent';
import { useModal, useModalData } from '@filerobot/core/lib/hooks';
import { useExplorerI18n } from '../../hooks';
import Styled from './Modals.styled';
import { jsx as _jsx } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
import { Fragment as _Fragment } from "react/jsx-runtime";
var transitionTimeout = 100; // 100ms = 0.1s (max. transition of modal's styles).

var _isMounted = false;
var initialHigherLvlModalProps = {
  isOpen: false
};
var Modals = function Modals(_ref) {
  var _ref$upperLvlModal = _ref.upperLvlModal,
    upperLvlModal = _ref$upperLvlModal === void 0 ? initialHigherLvlModalProps : _ref$upperLvlModal;
  var toggleModal = useModal();
  var toggleSubModal = useModal({
    isGlobalHigherLvlModal: true
  });
  var firstLevelModal = useModalData();
  var currentModalData = upperLvlModal !== null && upperLvlModal !== void 0 && upperLvlModal.isOpen ? upperLvlModal : firstLevelModal;
  var isOpen = currentModalData.isOpen,
    content = currentModalData.content,
    buttonPrimaryLabel = currentModalData.buttonPrimaryLabel,
    buttonSecondaryLabel = currentModalData.buttonSecondaryLabel,
    onCancel = currentModalData.onCancel,
    onButtonSecondaryClick = currentModalData.onButtonSecondaryClick,
    onButtonPrimaryClick = currentModalData.onButtonPrimaryClick,
    icon = currentModalData.icon,
    title = currentModalData.title,
    inputIdToFocus = currentModalData.inputIdToFocus,
    _currentModalData$ent = currentModalData.enterKeySubmits,
    enterKeySubmits = _currentModalData$ent === void 0 ? false : _currentModalData$ent,
    hideSecondaryButton = currentModalData.hideSecondaryButton,
    buttonPrimaryIcon = currentModalData.buttonPrimaryIcon,
    buttonSecondaryIcon = currentModalData.buttonSecondaryIcon,
    modalStyle = currentModalData.modalStyle,
    modalCrossButtonStyle = currentModalData.modalCrossButtonStyle,
    modalHeaderStyle = currentModalData.modalHeaderStyle,
    modalHeaderBottomBorder = currentModalData.modalHeaderBottomBorder,
    modalBodyStyle = currentModalData.modalBodyStyle,
    modalFooterStyle = currentModalData.modalFooterStyle,
    modalFooterTopBorder = currentModalData.modalFooterTopBorder,
    modalPrimaryButton = currentModalData.modalPrimaryButton,
    modalSecondaryButton = currentModalData.modalSecondaryButton,
    _currentModalData$mod = currentModalData.modalSecondaryButtonColor,
    modalSecondaryButtonColor = _currentModalData$mod === void 0 ? 'secondary' : _currentModalData$mod,
    _currentModalData$con = currentModalData.contentStyle,
    contentStyle = _currentModalData$con === void 0 ? {} : _currentModalData$con,
    _currentModalData$mod2 = currentModalData.modalPrimaryButtonColor,
    modalPrimaryButtonColor = _currentModalData$mod2 === void 0 ? 'primary' : _currentModalData$mod2,
    modalIconStyle = currentModalData.modalIconStyle,
    secondaryTitle = currentModalData.secondaryTitle,
    primaryTitleStyle = currentModalData.primaryTitleStyle,
    warningPrimaryButton = currentModalData.warningPrimaryButton,
    fullWidthButtons = currentModalData.fullWidthButtons,
    inlineActionButtons = currentModalData.inlineActionButtons,
    disableAutoClose = currentModalData.disableAutoClose,
    hidePrimaryButton = currentModalData.hidePrimaryButton,
    disablePrimaryButton = currentModalData.disablePrimaryButton,
    _currentModalData$ful = currentModalData.fullWidth,
    fullWidth = _currentModalData$ful === void 0 ? false : _currentModalData$ful,
    higherLevelModalData = currentModalData.higherLevelModalData;
  var higherLvlModal = higherLevelModalData || upperLvlModal;
  var i18n = useExplorerI18n();
  // [data, updateData] Will be passed to the content of the modal's body and used as data prop there (e.g. for passing the folder name...etc).
  // And the data will be passed in both buttons callbacks (primary and secondary).
  var _useState = useState({}),
    _useState2 = _slicedToArray(_useState, 2),
    data = _useState2[0],
    updateData = _useState2[1];
  // Used in-case we would need to open another modal, from the current opened one without closing it.
  var _useState3 = useState(initialHigherLvlModalProps),
    _useState4 = _slicedToArray(_useState3, 2),
    higherLvlModalProps = _useState4[0],
    setHigherLvlModalProps = _useState4[1];
  var _useState5 = useState({
      "default": null,
      contentChanged: null
    }),
    _useState6 = _slicedToArray(_useState5, 2),
    transition = _useState6[0],
    updateTransition = _useState6[1];
  var _useState7 = useState(false),
    _useState8 = _slicedToArray(_useState7, 2),
    isModalLoading = _useState8[0],
    setIsModalLoading = _useState8[1];
  var _useState9 = useState(disablePrimaryButton),
    _useState10 = _slicedToArray(_useState9, 2),
    isPrimaryButtonDisabled = _useState10[0],
    setPrimaryButtonDisabled = _useState10[1];
  var _useState11 = useState(false),
    _useState12 = _slicedToArray(_useState11, 2),
    isSecondaryButtonDisabled = _useState12[0],
    setSecondaryButtonDisabled = _useState12[1];
  var _useState13 = useState(false),
    _useState14 = _slicedToArray(_useState13, 2),
    isModalHidden = _useState14[0],
    setIsModalHidden = _useState14[1]; // Could be used for tmp hide modal (for ex. when we need to open child modal, so we can hide main modal and show it again when child modal closed)
  var _useState15 = useState(false),
    _useState16 = _slicedToArray(_useState15, 2),
    stopEnterKeySubmits = _useState16[0],
    setStopEnterKeySubmits = _useState16[1]; // Could be used to temporary skip enter press handler (for ex. when child modal is opened)
  var onDoneBtnRef = /*#__PURE__*/createRef();
  var isPrimaryBtnDisabled = isPrimaryButtonDisabled || isModalLoading;
  var handleCancellation = function handleCancellation() {
    if (isModalLoading) {
      return;
    }
    if (transition["default"] && transition.contentChanged === false) {
      updateTransition({
        "default": true,
        contentChanged: null
      });
    } else {
      _isMounted = false;
      updateTransition({
        "default": null,
        contentChanged: null
      });
    }
    if (higherLvlModal.isOpen && typeof higherLvlModal.cancelSubModal === 'function') {
      higherLvlModal.cancelSubModal();
    } else {
      toggleModal(null);
    }
    setTimeout(onCancel, transitionTimeout);
  };
  var commonDataPassed = {
    setIsModalLoading: setIsModalLoading,
    setIsModalHidden: setIsModalHidden,
    isModalLoading: isModalLoading,
    setPrimaryButtonDisabled: setPrimaryButtonDisabled,
    setSecondaryButtonDisabled: setSecondaryButtonDisabled,
    setStopEnterKeySubmits: setStopEnterKeySubmits,
    updateData: updateData,
    data: data,
    setHigherLvlModal: setHigherLvlModalProps,
    closeModal: handleCancellation
  };
  var handleButtonPrimaryClick = function handleButtonPrimaryClick() {
    if (isPrimaryBtnDisabled) {
      return;
    }
    // OLD => onButtonPrimaryClick(handleCancellation, setIsLoading, folderName)
    onButtonPrimaryClick(commonDataPassed);
    if (!disableAutoClose) {
      handleCancellation();
    }
  };
  var handleKeyUp = function handleKeyUp(e) {
    if (enterKeySubmits && !stopEnterKeySubmits && e.keyCode === 13 && !isModalLoading) {
      ignoreEvent(e);
      handleButtonPrimaryClick();
    } else if (e.keyCode === 27) {
      ignoreEvent(e);
      handleCancellation();
    }
  };
  var cancelSubModal = function cancelSubModal() {
    if (higherLevelModalData !== null && higherLevelModalData !== void 0 && higherLevelModalData.isOpen) {
      toggleSubModal();
    }
    if (upperLvlModal !== null && upperLvlModal !== void 0 && upperLvlModal.isOpen) {
      setHigherLvlModalProps(initialHigherLvlModalProps);
    }
  };
  useEffect(function () {
    _isMounted = true;
    return function () {
      _isMounted = false;
    };
  }, []);
  var handleButtonSecondaryClick = function handleButtonSecondaryClick() {
    if (isModalLoading || isSecondaryButtonDisabled) {
      return;
    }
    if (typeof onButtonSecondaryClick === 'function') {
      // old => onButtonSecondaryClick(handleCancellation, setPrimaryButtonDisabled)
      onButtonSecondaryClick(commonDataPassed);
      return;
    }
    handleCancellation();
  };
  useEffect(function () {
    var inputToFocus = document.querySelector("#".concat(inputIdToFocus));
    if (inputToFocus) {
      inputToFocus.focus();
    } else if (onDoneBtnRef !== null && onDoneBtnRef !== void 0 && onDoneBtnRef.current) {
      onDoneBtnRef.current.focus();
    }
  }, [onDoneBtnRef, inputIdToFocus]);

  // Reset the state of the modal once isOpen changes as it will be changed only on opening/closing.
  useEffect(function () {
    updateData({});
    setHigherLvlModalProps(initialHigherLvlModalProps);
    updateTransition({
      "default": null,
      contentChanged: null
    });
    setIsModalLoading(false);
    setIsModalHidden(false);
    setPrimaryButtonDisabled(disablePrimaryButton);
    setSecondaryButtonDisabled(false);
  }, [isOpen]);
  useEffect(function () {
    if (_isMounted && transition["default"] && !transition.contentChanged) {
      updateTransition({
        "default": true,
        contentChanged: true
      });
    }
  }, [content]);
  useEffect(function () {
    if (_isMounted) {
      if (!transition["default"]) {
        updateTransition({
          "default": true,
          contentChanged: null
        });
      } else if (transition.contentChanged) {
        setTimeout(function () {
          updateTransition({
            "default": true,
            contentChanged: false
          });
        }, transitionTimeout);
      }
    }
  }, [transition]);
  var nextHigherLvlModal = higherLvlModalProps !== null && higherLvlModalProps !== void 0 && higherLvlModalProps.isOpen ? higherLvlModalProps : higherLevelModalData;
  return /*#__PURE__*/_jsxs(_Fragment, {
    children: [/*#__PURE__*/_jsx(Styled.ExplorerModal, {
      tabIndex: -1,
      fullWidth: fullWidth
      // TODO: If `isOpen` works, then we should drop the transition code.
      ,
      showModal: transition["default"]
      // open={transition.default}
      ,
      open: isOpen && !isModalHidden,
      onKeyUp: handleKeyUp,
      onClose: handleCancellation,
      style: modalStyle,
      children: isOpen ? /*#__PURE__*/_jsxs(_Fragment, {
        children: [/*#__PURE__*/_jsx(Styled.ExplorerModalHeader, {
          icon: icon,
          iconShadow: true,
          primary: title,
          secondary: secondaryTitle,
          variant: "with-icon",
          modalIconStyle: modalIconStyle,
          modalCrossButtonStyle: modalCrossButtonStyle,
          primaryTitleStyle: primaryTitleStyle,
          onClose: handleCancellation,
          style: modalHeaderStyle,
          bottomBorder: modalHeaderBottomBorder
        }), /*#__PURE__*/_jsx(Styled.ModalBody, {
          showModal: transition["default"],
          isTransitionChanged: transition.contentChanged,
          style: modalBodyStyle,
          children: content && /*#__PURE__*/_jsx("div", {
            style: contentStyle,
            children: typeof content === 'function' ? content(commonDataPassed) : content
          })
        }), /*#__PURE__*/_jsxs(Styled.ModalFooter, {
          $inlineActionButtons: inlineActionButtons,
          style: modalFooterStyle,
          borderTop: modalFooterTopBorder,
          children: [!hideSecondaryButton && /*#__PURE__*/_jsx(Styled.ModalButtons, {
            style: modalSecondaryButton,
            color: modalSecondaryButtonColor,
            onClick: handleButtonSecondaryClick,
            $fullWidth: fullWidthButtons,
            startIcon: buttonSecondaryIcon,
            disabled: isSecondaryButtonDisabled || isModalLoading,
            children: buttonSecondaryLabel || i18n('mutualizedCancelButtonLabel')
          }), !hidePrimaryButton && /*#__PURE__*/_jsx(Styled.ModalButtons, {
            color: modalPrimaryButtonColor,
            style: modalPrimaryButton,
            onClick: handleButtonPrimaryClick,
            loading: isModalLoading,
            $warningPrimaryButton: warningPrimaryButton,
            $fullWidth: fullWidthButtons,
            disabled: isPrimaryBtnDisabled,
            startIcon: buttonPrimaryIcon,
            children: buttonPrimaryLabel || i18n('mutualizedConfirmButtonLabel')
          })]
        })]
      })
      // : '' for avoiding issue in console that children of the lib's modal is required.
      : ''
    }), (nextHigherLvlModal === null || nextHigherLvlModal === void 0 ? void 0 : nextHigherLvlModal.isOpen) && /*#__PURE__*/_jsx(Modals, {
      upperLvlModal: _objectSpread({
        cancelSubModal: cancelSubModal
      }, nextHigherLvlModal)
    })]
  });
};
export default Modals;