intelicoreact 1.2.29 → 1.2.30

package/dist/Atomic/UI/Modal/Modal.js

@@ -96,7 +96,8 @@ var Modal = function Modal(_ref2) {
 
   var _useMobileModal = (0, _useMobileModal2.default)({
     modalRef: modalRef,
-    noMobileModalLogic: noMobileModalLogic
+    noMobileModalLogic: noMobileModalLogic,
+    isOpen: isOpen
   }),
       modalMobileHeaderRef = _useMobileModal.modalMobileHeaderRef,
       modalMobileBodyRef = _useMobileModal.modalMobileBodyRef,
@@ -131,7 +132,7 @@ var Modal = function Modal(_ref2) {
   }, [submitOnEnter, closeOnEsc]);
 
   var render = function render() {
-    return /*#__PURE__*/_react.default.createElement("div", {
+    return !isOpen ? null : /*#__PURE__*/_react.default.createElement("div", {
       style: {
         zIndex: zIndex
       },
@@ -205,7 +206,6 @@ var Modal = function Modal(_ref2) {
     })))))));
   };
 
-  if (!isOpen) return null;
   return render();
 };
 

package/dist/Atomic/UI/Modal/partials/useMobileModal.js

@@ -23,12 +23,13 @@ var SCROLL_DIRECTION = {
 };
 
 function useMobileModal(_ref) {
-  var _modalMobileContainer, _modalMobileContainer2, _modalMobileHeaderRef, _modalMobileHeaderRef2, _modalMobileFooterRef, _modalMobileFooterRef2, _modalMobileFooterRef3, _modalMobileFooterRef4, _modalMobileBodyRef$c, _modalMobileBodyRef$c2, _modal$getBoundingCli;
+  var _modalMobileContainer, _modalMobileContainer2, _modalMobileHeaderRef, _modalMobileHeaderRef2, _modalMobileFooterRef, _modalMobileFooterRef2, _modalMobileFooterRef3, _modalMobileFooterRef4, _modalMobileBodyRef$c, _modalMobileBodyRef$c2;
 
   var _ref$modalRef = _ref.modalRef,
       modalRef = _ref$modalRef === void 0 ? null : _ref$modalRef,
       _ref$noMobileModalLog = _ref.noMobileModalLogic,
-      noMobileModalLogic = _ref$noMobileModalLog === void 0 ? false : _ref$noMobileModalLog;
+      noMobileModalLogic = _ref$noMobileModalLog === void 0 ? false : _ref$noMobileModalLog,
+      isOpen = _ref.isOpen;
 
   var _useState = (0, _react.useState)(false),
       _useState2 = (0, _slicedToArray2.default)(_useState, 2),
@@ -60,11 +61,6 @@ function useMobileModal(_ref) {
   var footerBottom = modalMobileContainerHeight - (modalMobileFooterRef === null || modalMobileFooterRef === void 0 ? void 0 : (_modalMobileFooterRef = modalMobileFooterRef.current) === null || _modalMobileFooterRef === void 0 ? void 0 : (_modalMobileFooterRef2 = _modalMobileFooterRef.getBoundingClientRect()) === null || _modalMobileFooterRef2 === void 0 ? void 0 : _modalMobileFooterRef2.bottom);
   var footerHeight = modalMobileFooterRef === null || modalMobileFooterRef === void 0 ? void 0 : (_modalMobileFooterRef3 = modalMobileFooterRef.current) === null || _modalMobileFooterRef3 === void 0 ? void 0 : (_modalMobileFooterRef4 = _modalMobileFooterRef3.getBoundingClientRect()) === null || _modalMobileFooterRef4 === void 0 ? void 0 : _modalMobileFooterRef4.height;
   var bodyTop = modalMobileBodyRef === null || modalMobileBodyRef === void 0 ? void 0 : (_modalMobileBodyRef$c = modalMobileBodyRef.current) === null || _modalMobileBodyRef$c === void 0 ? void 0 : (_modalMobileBodyRef$c2 = _modalMobileBodyRef$c.getBoundingClientRect()) === null || _modalMobileBodyRef$c2 === void 0 ? void 0 : _modalMobileBodyRef$c2.top;
-  var modal = modalRef === null || modalRef === void 0 ? void 0 : modalRef.current;
-  var modalStyle = modal ? modal.currentStyle || window.getComputedStyle(modal) : {};
-  var modalHeight = modal ? (modal === null || modal === void 0 ? void 0 : (_modal$getBoundingCli = modal.getBoundingClientRect()) === null || _modal$getBoundingCli === void 0 ? void 0 : _modal$getBoundingCli.height) + parseFloat((modalStyle === null || modalStyle === void 0 ? void 0 : modalStyle.marginTop) || 0) : 0;
-  var windowHeight = document.documentElement.clientHeight || window.screen.availHeight || window.screen.height;
-  var modalContainer = modalMobileContainerRef === null || modalMobileContainerRef === void 0 ? void 0 : modalMobileContainerRef.current;
   /* MODALS LOGIC | BEGIN */
   // Detect Mobile
 
@@ -90,18 +86,26 @@ function useMobileModal(_ref) {
   }, [scrollTop, scrollTopPrev]); // Dynamic Modal Positioning
 
   (0, _react.useEffect)(function () {
-    if (modalHeight && modalMobileContainerRef !== null && modalMobileContainerRef !== void 0 && modalMobileContainerRef.current) {
-      if (modalHeight <= windowHeight) {
-        modalMobileContainerRef.current.style.display = 'flex';
-        modalMobileContainerRef.current.style.alignItems = 'flex-end';
-      } else {
-        var _modalContainer$style, _modalContainer$style2;
-
-        modalContainer === null || modalContainer === void 0 ? void 0 : (_modalContainer$style = modalContainer.style) === null || _modalContainer$style === void 0 ? void 0 : _modalContainer$style.removeProperty('display');
-        modalContainer === null || modalContainer === void 0 ? void 0 : (_modalContainer$style2 = modalContainer.style) === null || _modalContainer$style2 === void 0 ? void 0 : _modalContainer$style2.removeProperty('align-items');
+    if (isOpen) {
+      var _modalRef$current, _modalRef$current$get;
+
+      var modalStyle = modalRef !== null && modalRef !== void 0 && modalRef.current ? (modalRef === null || modalRef === void 0 ? void 0 : modalRef.current.currentStyle) || window.getComputedStyle(modalRef === null || modalRef === void 0 ? void 0 : modalRef.current) : {};
+      var modalHeight = modalRef !== null && modalRef !== void 0 && modalRef.current ? (modalRef === null || modalRef === void 0 ? void 0 : (_modalRef$current = modalRef.current) === null || _modalRef$current === void 0 ? void 0 : (_modalRef$current$get = _modalRef$current.getBoundingClientRect()) === null || _modalRef$current$get === void 0 ? void 0 : _modalRef$current$get.height) + parseFloat((modalStyle === null || modalStyle === void 0 ? void 0 : modalStyle.marginTop) || 0) : 0;
+      var windowHeight = document.documentElement.clientHeight || window.screen.availHeight || window.screen.height;
+
+      if (modalHeight && modalMobileContainerRef !== null && modalMobileContainerRef !== void 0 && modalMobileContainerRef.current) {
+        if (modalHeight <= windowHeight) {
+          modalMobileContainerRef.current.style.display = 'flex';
+          modalMobileContainerRef.current.style.alignItems = 'flex-end';
+        } else {
+          var _modalMobileContainer3, _modalMobileContainer4, _modalMobileContainer5, _modalMobileContainer6;
+
+          (_modalMobileContainer3 = modalMobileContainerRef.current) === null || _modalMobileContainer3 === void 0 ? void 0 : (_modalMobileContainer4 = _modalMobileContainer3.style) === null || _modalMobileContainer4 === void 0 ? void 0 : _modalMobileContainer4.removeProperty('display');
+          (_modalMobileContainer5 = modalMobileContainerRef.current) === null || _modalMobileContainer5 === void 0 ? void 0 : (_modalMobileContainer6 = _modalMobileContainer5.style) === null || _modalMobileContainer6 === void 0 ? void 0 : _modalMobileContainer6.removeProperty('align-items');
+        }
       }
     }
-  }, [modalHeight, windowHeight, modalMobileContainerRef === null || modalMobileContainerRef === void 0 ? void 0 : modalMobileContainerRef.current]);
+  }, [modalRef, modalMobileContainerRef, isOpen]);
   var MODALS_LOGIC = {
     IS_HEADER_HIDDEN: !isMobile || noMobileModalLogic ? false : footerBottom * -1 <= footerHeight || scrollDirection === SCROLL_DIRECTION.DOWN,
     IS_HEADER_STICKY: !isMobile || noMobileModalLogic ? false : headerTop <= 0,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "intelicoreact",
-  "version": "1.2.29",
+  "version": "1.2.30",
   "description": "",
   "main": "dist/index.js",
   "files": [