@majoo-ui/react 1.54.8 → 1.54.9

package/index.esm.js

@@ -17114,7 +17114,6 @@ function InputDatePicker({
 }) {
   const [value, setValue] = useState(date || dateValue);
   const [defaultValue, setDefaultValue] = useState(defaultDate || defaultDateValue);
-  console.log(placement);
   useEffect(() => {
     setValue(date || dateValue);
   }, [date, dateValue]);
@@ -18045,8 +18044,6 @@ const MobileTable = /*#__PURE__*/React__default.forwardRef(({
 
           if (customRowsStyle && customRowsStyle(row.values).length) {
             for (let i = 0; i < customRowsStyle(row.values).length; i++) {
-              console.log(customRowsStyle(row.values)[i]);
-
               if (customRowsStyle(row.values)[i].predicate) {
                 customStyle = customRowsStyle(row.values)[i].css;
               }
@@ -19923,16 +19920,18 @@ const ContentWrapper = styled(Box, {
   variants: {
     wrapperSize: {
       md: {
-        padding: '40px 24px 0px',
+        padding: '40px 24px',
         marginLeft: 'auto',
         marginRight: 'auto',
-        maxWidth: 982
+        //982 + padding horizontal
+        maxWidth: 1030
       },
       lg: {
-        padding: '40px 24px 0px',
+        padding: '40px 24px',
         marginLeft: 'auto',
         marginRight: 'auto',
-        maxWidth: 1400
+        //1318 + padding horizontal
+        maxWidth: 1366
       }
     }
   }
@@ -23383,7 +23382,7 @@ const Upload = ({
         } else {
           imageCompressionComponent(blob, {
             maxSizeMB,
-            maxWidthOrHeight: 1920,
+            maxWidthOrHeight: 1000,
             maxIteration: 10,
             useWebWorker: true,
             alwaysKeepResolution: true
@@ -27844,7 +27843,7 @@ const Navigation = props => {
     const isComplete = props.isComplete[i - 1]; // eslint-disable-next-line no-lone-blocks
 
     {
-      var _data$title, _data, _data2, _data3, _data4, _data5, _data6, _data$title2, _data7, _data8, _data9, _data10, _data11;
+      var _data$title, _data2, _data3, _data4, _data5, _data6, _data7, _data$title2, _data8, _data9, _data10, _data11, _data12;
 
       !isMobile ? stepItems.push( /*#__PURE__*/React__default.createElement(StepperItem, {
         css: {
@@ -27855,7 +27854,9 @@ const Navigation = props => {
         align: "center",
         key: `step-${i}`,
         onClick: () => {
-          if (props.onNavClicked) props.onNavClicked(i);
+          var _data;
+
+          if (props.onNavClicked && !((_data = data[i - 1]) != null && _data.disabled)) props.onNavClicked(i);
 
           if (!forbidClickNav && isComplete && !isHide) {
             props.goToStep(i);
@@ -27889,9 +27890,9 @@ const Navigation = props => {
           lineNumber: 123,
           columnNumber: 17
         }
-      }), typeof data[i - 1].title === 'string' ? data[i - 1].title : (_data$title = (_data = data[i - 1]).title) == null ? void 0 : _data$title.call(_data), ((_data2 = data[i - 1]) == null ? void 0 : _data2.withTolltip) && /*#__PURE__*/React__default.createElement(Tooltip$1, {
+      }), typeof data[i - 1].title === 'string' ? data[i - 1].title : (_data$title = (_data2 = data[i - 1]).title) == null ? void 0 : _data$title.call(_data2), ((_data3 = data[i - 1]) == null ? void 0 : _data3.withTolltip) && /*#__PURE__*/React__default.createElement(Tooltip$1, {
         align: "center",
-        label: (_data3 = data[i - 1]) == null ? void 0 : _data3.tooltipsContents,
+        label: (_data4 = data[i - 1]) == null ? void 0 : _data4.tooltipsContents,
         __self: undefined,
         __source: {
           fileName: _jsxFileName$4,
@@ -27910,9 +27911,9 @@ const Navigation = props => {
           lineNumber: 128,
           columnNumber: 19
         }
-      })), ((_data4 = data[i - 1]) == null ? void 0 : _data4.comingSoon) && /*#__PURE__*/React__default.createElement(Flex$1, {
+      })), ((_data5 = data[i - 1]) == null ? void 0 : _data5.comingSoon) && /*#__PURE__*/React__default.createElement(Flex$1, {
         css: {
-          marginLeft: (_data5 = data[i - 1]) != null && _data5.withTolltip ? 0 : '$spacing-03'
+          marginLeft: (_data6 = data[i - 1]) != null && _data6.withTolltip ? 0 : '$spacing-03'
         },
         align: "center",
         __self: undefined,
@@ -27971,7 +27972,7 @@ const Navigation = props => {
           height: 24,
           borderRadius: '$round',
           border: `4px solid ${isActive ? '$bgGreen' : '$bgInactive'}`,
-          backgroundColor: (_data6 = data[i - 1]) != null && _data6.disabled ? '$gray200' : '$white'
+          backgroundColor: (_data7 = data[i - 1]) != null && _data7.disabled ? '$gray200' : '$white'
         },
         __self: undefined,
         __source: {
@@ -27989,10 +27990,10 @@ const Navigation = props => {
           lineNumber: 173,
           columnNumber: 15
         }
-      }, isActive ? typeof data[i - 1].title === 'string' ? data[i - 1].title : (_data$title2 = (_data7 = data[i - 1]).title) == null ? void 0 : _data$title2.call(_data7) : ''), isActive && ((_data8 = data[i - 1]) == null ? void 0 : _data8.withTolltip) && /*#__PURE__*/React__default.createElement(Tooltip$1, {
+      }, isActive ? typeof data[i - 1].title === 'string' ? data[i - 1].title : (_data$title2 = (_data8 = data[i - 1]).title) == null ? void 0 : _data$title2.call(_data8) : ''), isActive && ((_data9 = data[i - 1]) == null ? void 0 : _data9.withTolltip) && /*#__PURE__*/React__default.createElement(Tooltip$1, {
         align: "center",
         withClick: true,
-        label: (_data9 = data[i - 1]) == null ? void 0 : _data9.tooltipsContents,
+        label: (_data10 = data[i - 1]) == null ? void 0 : _data10.tooltipsContents,
         __self: undefined,
         __source: {
           fileName: _jsxFileName$4,
@@ -28008,11 +28009,11 @@ const Navigation = props => {
           lineNumber: 178,
           columnNumber: 19
         }
-      })), isActive && ((_data10 = data[i - 1]) == null ? void 0 : _data10.comingSoon) && /*#__PURE__*/React__default.createElement(Flex$1, {
+      })), isActive && ((_data11 = data[i - 1]) == null ? void 0 : _data11.comingSoon) && /*#__PURE__*/React__default.createElement(Flex$1, {
         align: "center",
         justify: "center",
         css: {
-          marginTop: (_data11 = data[i - 1]) != null && _data11.withTolltip ? 0 : '$spacing-03'
+          marginTop: (_data12 = data[i - 1]) != null && _data12.withTolltip ? 0 : '$spacing-03'
         },
         __self: undefined,
         __source: {
@@ -28402,7 +28403,8 @@ function Content({
   content,
   activeId,
   isCollapse,
-  isDialog
+  isDialog,
+  onNavClick
 }) {
   var _getDatasets;
 
@@ -28485,8 +28487,11 @@ function Content({
       active: (item == null ? void 0 : item.id) === activeId,
       href: `#${item == null ? void 0 : item.id}`,
       onClick: e => {
+        var _e$currentTarget, _e$currentTarget$href, _e$currentTarget$href2, _e$currentTarget2, _e$currentTarget2$hre, _e$currentTarget2$hre2;
+
         e.preventDefault();
-        const target = window.document.getElementById(e.currentTarget.href.split('#')[1]);
+        onNavClick == null ? void 0 : onNavClick(e == null ? void 0 : (_e$currentTarget = e.currentTarget) == null ? void 0 : (_e$currentTarget$href = _e$currentTarget.href) == null ? void 0 : (_e$currentTarget$href2 = _e$currentTarget$href.split('#')) == null ? void 0 : _e$currentTarget$href2[1]);
+        const target = window.document.getElementById(e == null ? void 0 : (_e$currentTarget2 = e.currentTarget) == null ? void 0 : (_e$currentTarget2$hre = _e$currentTarget2.href) == null ? void 0 : (_e$currentTarget2$hre2 = _e$currentTarget2$hre.split('#')) == null ? void 0 : _e$currentTarget2$hre2[1]);
 
         if (target) {
           var headerOffset = 20;
@@ -28521,7 +28526,8 @@ function TableOfContent({
   css,
   isMobile,
   isDialog,
-  activeId
+  activeId,
+  onNavClick
 }) {
   const [mobileCollapse, setMobileCollapse] = useState(false);
 
@@ -28538,7 +28544,7 @@ function TableOfContent({
     __self: this,
     __source: {
       fileName: _jsxFileName$2,
-      lineNumber: 159,
+      lineNumber: 160,
       columnNumber: 5
     }
   }, /*#__PURE__*/React__default.createElement(Content, {
@@ -28546,10 +28552,11 @@ function TableOfContent({
     isCollapse: mobileCollapse,
     isDialog: isDialog,
     content: content,
+    onNavClick: onNavClick,
     __self: this,
     __source: {
       fileName: _jsxFileName$2,
-      lineNumber: 160,
+      lineNumber: 161,
       columnNumber: 7
     }
   }), /*#__PURE__*/React__default.createElement(Box, {
@@ -28561,7 +28568,7 @@ function TableOfContent({
     __self: this,
     __source: {
       fileName: _jsxFileName$2,
-      lineNumber: 161,
+      lineNumber: 168,
       columnNumber: 7
     }
   }, mobileCollapse ? /*#__PURE__*/React__default.createElement(ChevronUpOutline, {
@@ -28571,7 +28578,7 @@ function TableOfContent({
     __self: this,
     __source: {
       fileName: _jsxFileName$2,
-      lineNumber: 163,
+      lineNumber: 170,
       columnNumber: 11
     }
   }) : /*#__PURE__*/React__default.createElement(ChevronDownOutline, {
@@ -28581,7 +28588,7 @@ function TableOfContent({
     __self: this,
     __source: {
       fileName: _jsxFileName$2,
-      lineNumber: 165,
+      lineNumber: 172,
       columnNumber: 11
     }
   }))) : /*#__PURE__*/React__default.createElement(DesktopContainer, {
@@ -28590,17 +28597,18 @@ function TableOfContent({
     __self: this,
     __source: {
       fileName: _jsxFileName$2,
-      lineNumber: 170,
+      lineNumber: 177,
       columnNumber: 5
     }
   }, /*#__PURE__*/React__default.createElement(Content, {
     isCollapse: true,
     isDialog: isDialog,
     content: content,
+    onNavClick: onNavClick,
     __self: this,
     __source: {
       fileName: _jsxFileName$2,
-      lineNumber: 171,
+      lineNumber: 178,
       columnNumber: 7
     }
   }));
@@ -28632,7 +28640,12 @@ TableOfContent.propTypes = {
   /**
    The active ID to reference the active content on the mobile view obtained from onUpdateCallback.
    */
-  activeId: PropTypes.string
+  activeId: PropTypes.string,
+
+  /**
+   Event Callback on navigation click.
+   */
+  onNavClick: PropTypes.func
 };
 
 const TableOfContentPage = props => {

package/index.umd.js

@@ -17388,7 +17388,6 @@
         defaultValue = _h[0],
         setDefaultValue = _h[1];
 
-    console.log(placement);
     React.useEffect(function () {
       setValue(date || dateValue);
     }, [date, dateValue]);
@@ -18333,8 +18332,6 @@
 
             if (customRowsStyle && customRowsStyle(row.values).length) {
               for (var i = 0; i < customRowsStyle(row.values).length; i++) {
-                console.log(customRowsStyle(row.values)[i]);
-
                 if (customRowsStyle(row.values)[i].predicate) {
                   customStyle = customRowsStyle(row.values)[i].css;
                 }
@@ -20283,16 +20280,18 @@
     variants: {
       wrapperSize: {
         md: {
-          padding: '40px 24px 0px',
+          padding: '40px 24px',
           marginLeft: 'auto',
           marginRight: 'auto',
-          maxWidth: 982
+          //982 + padding horizontal
+          maxWidth: 1030
         },
         lg: {
-          padding: '40px 24px 0px',
+          padding: '40px 24px',
           marginLeft: 'auto',
           marginRight: 'auto',
-          maxWidth: 1400
+          //1318 + padding horizontal
+          maxWidth: 1366
         }
       }
     }
@@ -23779,7 +23778,7 @@
           } else {
             imageCompressionComponent__default["default"](blob, {
               maxSizeMB,
-              maxWidthOrHeight: 1920,
+              maxWidthOrHeight: 1000,
               maxIteration: 10,
               useWebWorker: true,
               alwaysKeepResolution: true
@@ -28253,7 +28252,7 @@
       const isComplete = props.isComplete[i - 1]; // eslint-disable-next-line no-lone-blocks
 
       {
-        var _data$title, _data, _data2, _data3, _data4, _data5, _data6, _data$title2, _data7, _data8, _data9, _data10, _data11;
+        var _data$title, _data2, _data3, _data4, _data5, _data6, _data7, _data$title2, _data8, _data9, _data10, _data11, _data12;
 
         !isMobile ? stepItems.push( /*#__PURE__*/React__default["default"].createElement(StepperItem, {
           css: {
@@ -28264,7 +28263,9 @@
           align: "center",
           key: `step-${i}`,
           onClick: () => {
-            if (props.onNavClicked) props.onNavClicked(i);
+            var _data;
+
+            if (props.onNavClicked && !((_data = data[i - 1]) != null && _data.disabled)) props.onNavClicked(i);
 
             if (!forbidClickNav && isComplete && !isHide) {
               props.goToStep(i);
@@ -28298,9 +28299,9 @@
             lineNumber: 123,
             columnNumber: 17
           }
-        }), typeof data[i - 1].title === 'string' ? data[i - 1].title : (_data$title = (_data = data[i - 1]).title) == null ? void 0 : _data$title.call(_data), ((_data2 = data[i - 1]) == null ? void 0 : _data2.withTolltip) && /*#__PURE__*/React__default["default"].createElement(Tooltip$1, {
+        }), typeof data[i - 1].title === 'string' ? data[i - 1].title : (_data$title = (_data2 = data[i - 1]).title) == null ? void 0 : _data$title.call(_data2), ((_data3 = data[i - 1]) == null ? void 0 : _data3.withTolltip) && /*#__PURE__*/React__default["default"].createElement(Tooltip$1, {
           align: "center",
-          label: (_data3 = data[i - 1]) == null ? void 0 : _data3.tooltipsContents,
+          label: (_data4 = data[i - 1]) == null ? void 0 : _data4.tooltipsContents,
           __self: undefined,
           __source: {
             fileName: _jsxFileName$4,
@@ -28319,9 +28320,9 @@
             lineNumber: 128,
             columnNumber: 19
           }
-        })), ((_data4 = data[i - 1]) == null ? void 0 : _data4.comingSoon) && /*#__PURE__*/React__default["default"].createElement(Flex$1, {
+        })), ((_data5 = data[i - 1]) == null ? void 0 : _data5.comingSoon) && /*#__PURE__*/React__default["default"].createElement(Flex$1, {
           css: {
-            marginLeft: (_data5 = data[i - 1]) != null && _data5.withTolltip ? 0 : '$spacing-03'
+            marginLeft: (_data6 = data[i - 1]) != null && _data6.withTolltip ? 0 : '$spacing-03'
           },
           align: "center",
           __self: undefined,
@@ -28380,7 +28381,7 @@
             height: 24,
             borderRadius: '$round',
             border: `4px solid ${isActive ? '$bgGreen' : '$bgInactive'}`,
-            backgroundColor: (_data6 = data[i - 1]) != null && _data6.disabled ? '$gray200' : '$white'
+            backgroundColor: (_data7 = data[i - 1]) != null && _data7.disabled ? '$gray200' : '$white'
           },
           __self: undefined,
           __source: {
@@ -28398,10 +28399,10 @@
             lineNumber: 173,
             columnNumber: 15
           }
-        }, isActive ? typeof data[i - 1].title === 'string' ? data[i - 1].title : (_data$title2 = (_data7 = data[i - 1]).title) == null ? void 0 : _data$title2.call(_data7) : ''), isActive && ((_data8 = data[i - 1]) == null ? void 0 : _data8.withTolltip) && /*#__PURE__*/React__default["default"].createElement(Tooltip$1, {
+        }, isActive ? typeof data[i - 1].title === 'string' ? data[i - 1].title : (_data$title2 = (_data8 = data[i - 1]).title) == null ? void 0 : _data$title2.call(_data8) : ''), isActive && ((_data9 = data[i - 1]) == null ? void 0 : _data9.withTolltip) && /*#__PURE__*/React__default["default"].createElement(Tooltip$1, {
           align: "center",
           withClick: true,
-          label: (_data9 = data[i - 1]) == null ? void 0 : _data9.tooltipsContents,
+          label: (_data10 = data[i - 1]) == null ? void 0 : _data10.tooltipsContents,
           __self: undefined,
           __source: {
             fileName: _jsxFileName$4,
@@ -28417,11 +28418,11 @@
             lineNumber: 178,
             columnNumber: 19
           }
-        })), isActive && ((_data10 = data[i - 1]) == null ? void 0 : _data10.comingSoon) && /*#__PURE__*/React__default["default"].createElement(Flex$1, {
+        })), isActive && ((_data11 = data[i - 1]) == null ? void 0 : _data11.comingSoon) && /*#__PURE__*/React__default["default"].createElement(Flex$1, {
           align: "center",
           justify: "center",
           css: {
-            marginTop: (_data11 = data[i - 1]) != null && _data11.withTolltip ? 0 : '$spacing-03'
+            marginTop: (_data12 = data[i - 1]) != null && _data12.withTolltip ? 0 : '$spacing-03'
           },
           __self: undefined,
           __source: {
@@ -28811,7 +28812,8 @@
     content,
     activeId,
     isCollapse,
-    isDialog
+    isDialog,
+    onNavClick
   }) {
     var _getDatasets;
 
@@ -28894,8 +28896,11 @@
         active: (item == null ? void 0 : item.id) === activeId,
         href: `#${item == null ? void 0 : item.id}`,
         onClick: e => {
+          var _e$currentTarget, _e$currentTarget$href, _e$currentTarget$href2, _e$currentTarget2, _e$currentTarget2$hre, _e$currentTarget2$hre2;
+
           e.preventDefault();
-          const target = window.document.getElementById(e.currentTarget.href.split('#')[1]);
+          onNavClick == null ? void 0 : onNavClick(e == null ? void 0 : (_e$currentTarget = e.currentTarget) == null ? void 0 : (_e$currentTarget$href = _e$currentTarget.href) == null ? void 0 : (_e$currentTarget$href2 = _e$currentTarget$href.split('#')) == null ? void 0 : _e$currentTarget$href2[1]);
+          const target = window.document.getElementById(e == null ? void 0 : (_e$currentTarget2 = e.currentTarget) == null ? void 0 : (_e$currentTarget2$hre = _e$currentTarget2.href) == null ? void 0 : (_e$currentTarget2$hre2 = _e$currentTarget2$hre.split('#')) == null ? void 0 : _e$currentTarget2$hre2[1]);
 
           if (target) {
             var headerOffset = 20;
@@ -28930,7 +28935,8 @@
     css,
     isMobile,
     isDialog,
-    activeId
+    activeId,
+    onNavClick
   }) {
     const [mobileCollapse, setMobileCollapse] = React.useState(false);
 
@@ -28947,7 +28953,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 159,
+        lineNumber: 160,
         columnNumber: 5
       }
     }, /*#__PURE__*/React__default["default"].createElement(Content, {
@@ -28955,10 +28961,11 @@
       isCollapse: mobileCollapse,
       isDialog: isDialog,
       content: content,
+      onNavClick: onNavClick,
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 160,
+        lineNumber: 161,
         columnNumber: 7
       }
     }), /*#__PURE__*/React__default["default"].createElement(Box, {
@@ -28970,7 +28977,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 161,
+        lineNumber: 168,
         columnNumber: 7
       }
     }, mobileCollapse ? /*#__PURE__*/React__default["default"].createElement(icons.ChevronUpOutline, {
@@ -28980,7 +28987,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 163,
+        lineNumber: 170,
         columnNumber: 11
       }
     }) : /*#__PURE__*/React__default["default"].createElement(icons.ChevronDownOutline, {
@@ -28990,7 +28997,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 165,
+        lineNumber: 172,
         columnNumber: 11
       }
     }))) : /*#__PURE__*/React__default["default"].createElement(DesktopContainer, {
@@ -28999,17 +29006,18 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 170,
+        lineNumber: 177,
         columnNumber: 5
       }
     }, /*#__PURE__*/React__default["default"].createElement(Content, {
       isCollapse: true,
       isDialog: isDialog,
       content: content,
+      onNavClick: onNavClick,
       __self: this,
       __source: {
         fileName: _jsxFileName$2,
-        lineNumber: 171,
+        lineNumber: 178,
         columnNumber: 7
       }
     }));
@@ -29041,7 +29049,12 @@
     /**
      The active ID to reference the active content on the mobile view obtained from onUpdateCallback.
      */
-    activeId: PropTypes__default["default"].string
+    activeId: PropTypes__default["default"].string,
+
+    /**
+     Event Callback on navigation click.
+     */
+    onNavClick: PropTypes__default["default"].func
   };
 
   var TableOfContentPage = function TableOfContentPage(props) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@majoo-ui/react",
-  "version": "1.54.8",
+  "version": "1.54.9",
   "dependencies": {
     "@majoo-ui/core": "^1.31.1",
     "@majoo-ui/helpers": "^1.30.5",