@majoo-ui/react 1.46.9 → 1.47.0-rc.1

package/index.esm.js

@@ -8443,14 +8443,17 @@ function InputSelect(_a) {
                 },
                 disabled
               }),
-              onClick: !isOpen ? getToggleButtonProps().onClick : undefined
+              onClick: !isOpen ? getToggleButtonProps({
+                disabled: disabled || readOnly
+              }).onClick : undefined
             }, void 0)
           }), void 0) : jsx(Button$1, Object.assign({}, getToggleButtonProps({
             disabled: disabled || readOnly
           }), {
             disabled: disabled,
             size: size,
-            readOnly: readOnly
+            readOnly: readOnly,
+            type: "button"
           }, {
             children: selectedItem ? selectedItem.render ? selectedItem.render(selectedItem) : jsx(Text$1, Object.assign({
               color: "primary",
@@ -9388,6 +9391,7 @@ function InputSelectCheck(_ref) {
   }), {
     disabled: disabled || readOnly,
     size: size,
+    type: "button",
     __self: this,
     __source: {
       fileName: _jsxFileName$u,
@@ -9402,7 +9406,7 @@ function InputSelectCheck(_ref) {
     __self: this,
     __source: {
       fileName: _jsxFileName$u,
-      lineNumber: 423,
+      lineNumber: 424,
       columnNumber: 9
     }
   }), /*#__PURE__*/React.createElement(IconCaretDown, {
@@ -9410,7 +9414,7 @@ function InputSelectCheck(_ref) {
     __self: this,
     __source: {
       fileName: _jsxFileName$u,
-      lineNumber: 428,
+      lineNumber: 429,
       columnNumber: 11
     }
   }))), showSelectedTag && selectedItems.length !== 0 && /*#__PURE__*/React.createElement(TagWrapper$1, {
@@ -9418,7 +9422,7 @@ function InputSelectCheck(_ref) {
     __self: this,
     __source: {
       fileName: _jsxFileName$u,
-      lineNumber: 432,
+      lineNumber: 433,
       columnNumber: 9
     }
   }, selectedItems.map((selectedItem, index) => /*#__PURE__*/React.createElement(Tag, _extends({
@@ -9442,7 +9446,7 @@ function InputSelectCheck(_ref) {
     __self: this,
     __source: {
       fileName: _jsxFileName$u,
-      lineNumber: 434,
+      lineNumber: 435,
       columnNumber: 13
     }
   }), selectedItem.name))), /*#__PURE__*/React.createElement(OptionWrapper$1, {
@@ -9454,14 +9458,14 @@ function InputSelectCheck(_ref) {
     __self: this,
     __source: {
       fileName: _jsxFileName$u,
-      lineNumber: 455,
+      lineNumber: 456,
       columnNumber: 7
     }
   }, item.length !== 0 ? /*#__PURE__*/React.createElement(Option, _extends({}, getMenuProps(), {
     __self: this,
     __source: {
       fileName: _jsxFileName$u,
-      lineNumber: 460,
+      lineNumber: 461,
       columnNumber: 11
     }
   }), isOpen && item.map((item, index) => /*#__PURE__*/React.createElement(ItemWrapper$1, _extends({
@@ -9479,7 +9483,7 @@ function InputSelectCheck(_ref) {
     __self: this,
     __source: {
       fileName: _jsxFileName$u,
-      lineNumber: 463,
+      lineNumber: 464,
       columnNumber: 17
     }
   }), /*#__PURE__*/React.createElement(IconWrapper, {
@@ -9492,7 +9496,7 @@ function InputSelectCheck(_ref) {
     __self: this,
     __source: {
       fileName: _jsxFileName$u,
-      lineNumber: 476,
+      lineNumber: 477,
       columnNumber: 19
     }
   }, item.isDisabled ? /*#__PURE__*/React.createElement(CheckOutline, {
@@ -9500,7 +9504,7 @@ function InputSelectCheck(_ref) {
     __self: this,
     __source: {
       fileName: _jsxFileName$u,
-      lineNumber: 485,
+      lineNumber: 486,
       columnNumber: 23
     }
   }) : selectedValue.includes(item.id) && (item.isDisabled === false || item.isDisabled === undefined) && /*#__PURE__*/React.createElement(CheckOutline, {
@@ -9508,7 +9512,7 @@ function InputSelectCheck(_ref) {
     __self: this,
     __source: {
       fileName: _jsxFileName$u,
-      lineNumber: 489,
+      lineNumber: 490,
       columnNumber: 25
     }
   })), /*#__PURE__*/React.createElement(Item$2, {
@@ -9518,7 +9522,7 @@ function InputSelectCheck(_ref) {
     __self: this,
     __source: {
       fileName: _jsxFileName$u,
-      lineNumber: 493,
+      lineNumber: 494,
       columnNumber: 19
     }
   }, item.name)))) : /*#__PURE__*/React.createElement(Option, _extends({
@@ -9529,14 +9533,14 @@ function InputSelectCheck(_ref) {
     __self: this,
     __source: {
       fileName: _jsxFileName$u,
-      lineNumber: 498,
+      lineNumber: 499,
       columnNumber: 11
     }
   }), /*#__PURE__*/React.createElement(StyledDiv$1, {
     __self: this,
     __source: {
       fileName: _jsxFileName$u,
-      lineNumber: 499,
+      lineNumber: 500,
       columnNumber: 13
     }
   }, /*#__PURE__*/React.createElement("div", {
@@ -9546,7 +9550,7 @@ function InputSelectCheck(_ref) {
     __self: this,
     __source: {
       fileName: _jsxFileName$u,
-      lineNumber: 500,
+      lineNumber: 501,
       columnNumber: 15
     }
   }, /*#__PURE__*/React.createElement(CircleInfoOutline, {
@@ -9558,7 +9562,7 @@ function InputSelectCheck(_ref) {
     __self: this,
     __source: {
       fileName: _jsxFileName$u,
-      lineNumber: 501,
+      lineNumber: 502,
       columnNumber: 17
     }
   })), textEmptyItem))));
@@ -13517,7 +13521,7 @@ const CalendarBox = ({
     } else {
       onCalendarDateChange(selectedDate);
     }
-  }, [pickerState.selectedMonth]);
+  }, [`${pickerState.selectedMonth}/${pickerState.selectedYear}`]);
   const multiDatePicker = calendars.length > 1;
 
   const renderTitleButton = (index = 0) => {
@@ -13560,7 +13564,8 @@ const CalendarBox = ({
             selectedYearRangeStart: pickerState.type === YEAR_RANGE_PICKER ? current.selectedYearRangeStart - 100 : current.selectedYearRangeStart
           }));
         }
-      }
+      },
+      type: "button"
     }, {
       children: jsx(ChevronLeftOutline, {
         color: "currentColor"
@@ -13580,7 +13585,8 @@ const CalendarBox = ({
             selectedYearRangeStart: pickerState.type === YEAR_RANGE_PICKER && current.selectedYearRangeStart < 2001 ? current.selectedYearRangeStart + 100 : current.selectedYearRangeStart
           }));
         }
-      }
+      },
+      type: "button"
     }, {
       children: jsx(ChevronRightOutline, {
         color: "currentColor"
@@ -13832,7 +13838,8 @@ const CalendarBox = ({
         disabled: disabled,
         onClick: () => setPickerState(current => Object.assign(Object.assign({}, current), {
           type: TIME_PICKER
-        }))
+        })),
+        type: "button"
       }, {
         children: selected && selected[0] ? moment(selected[0]).format('HH:mm') : moment().format('HH:mm')
       }), void 0)]
@@ -13853,7 +13860,8 @@ const CalendarBox = ({
         disabled: disabled,
         onClick: () => setPickerState(current => Object.assign(Object.assign({}, current), {
           type: DATE_PICKER
-        }))
+        })),
+        type: "button"
       }, {
         children: "Done"
       }), void 0)]
@@ -14107,7 +14115,7 @@ const MobileCalendarBox = ({
     } else {
       onCalendarDateChange(selectedDate);
     }
-  }, [pickerState.selectedMonth]);
+  }, [`${pickerState.selectedMonth}/${pickerState.selectedYear}`]);
   const multiDatePicker = calendars.length > 1;
 
   const renderTitleButton = index => {
@@ -14152,7 +14160,8 @@ const MobileCalendarBox = ({
             selectedYearRangeStart: pickerState.type === YEAR_RANGE_PICKER ? current.selectedYearRangeStart - 100 : current.selectedYearRangeStart
           }));
         }
-      }
+      },
+      type: "button"
     }, {
       children: jsx(ChevronLeftOutline, {
         color: "currentColor"
@@ -14172,7 +14181,8 @@ const MobileCalendarBox = ({
             selectedYearRangeStart: pickerState.type === YEAR_RANGE_PICKER && current.selectedYearRangeStart < 2001 ? current.selectedYearRangeStart + 100 : current.selectedYearRangeStart
           }));
         }
-      }
+      },
+      type: "button"
     }, {
       children: jsx(ChevronRightOutline, {
         color: "currentColor"
@@ -15279,14 +15289,22 @@ function InputDatePicker({
   minDate,
   maxDate
 }) {
-  const [value, setValue] = useState(date || dateValue);
-  const [defaultValue, setDefaultValue] = useState(defaultDate || defaultDateValue);
+  const [value, setValue] = useState();
+  const [defaultValue, setDefaultValue] = useState(defaultDate && !(defaultDate instanceof Date) || defaultDateValue && !(defaultDateValue instanceof Date) ? undefined : defaultDate || defaultDateValue);
   useEffect(() => {
-    setValue(date || dateValue);
-  }, [date, dateValue]);
-  useEffect(() => {
-    setDefaultValue(defaultDate || defaultDateValue);
-  }, [defaultDate, defaultDateValue]);
+    if (dateValue && !(dateValue instanceof Date) || date && !(date instanceof Date)) {
+      setValue(undefined);
+    } else {
+      setValue(date || dateValue);
+    }
+  }, [date, dateValue]); // useEffect(() => {
+  //   if ((defaultDate && !(defaultDate instanceof Date)) || (defaultDateValue && !(defaultDateValue instanceof Date))) {
+  //     setDefaultValue(undefined);
+  //   } else {
+  //     setDefaultValue(defaultDate || defaultDateValue);
+  //   }
+  // }, [defaultDate, defaultDateValue]);
+
   const [{
     selectedDate
   }, dispatch] = useReducer(pickerReducer, {

package/index.umd.js

@@ -8579,14 +8579,17 @@
                   },
                   disabled: disabled
                 }),
-                onClick: !isOpen ? getToggleButtonProps().onClick : undefined
+                onClick: !isOpen ? getToggleButtonProps({
+                  disabled: disabled || readOnly
+                }).onClick : undefined
               }, void 0)
             }), void 0) : jsxRuntime.jsx(Button$1, __assign({}, getToggleButtonProps({
               disabled: disabled || readOnly
             }), {
               disabled: disabled,
               size: size,
-              readOnly: readOnly
+              readOnly: readOnly,
+              type: "button"
             }, {
               children: selectedItem ? selectedItem.render ? selectedItem.render(selectedItem) : jsxRuntime.jsx(Text$1, __assign({
                 color: "primary",
@@ -9526,6 +9529,7 @@
     }), {
       disabled: disabled || readOnly,
       size: size,
+      type: "button",
       __self: this,
       __source: {
         fileName: _jsxFileName$u,
@@ -9540,7 +9544,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$u,
-        lineNumber: 423,
+        lineNumber: 424,
         columnNumber: 9
       }
     }), /*#__PURE__*/React__namespace.createElement(IconCaretDown, {
@@ -9548,7 +9552,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$u,
-        lineNumber: 428,
+        lineNumber: 429,
         columnNumber: 11
       }
     }))), showSelectedTag && selectedItems.length !== 0 && /*#__PURE__*/React__namespace.createElement(TagWrapper$1, {
@@ -9556,7 +9560,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$u,
-        lineNumber: 432,
+        lineNumber: 433,
         columnNumber: 9
       }
     }, selectedItems.map((selectedItem, index) => /*#__PURE__*/React__namespace.createElement(Tag, _extends({
@@ -9580,7 +9584,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$u,
-        lineNumber: 434,
+        lineNumber: 435,
         columnNumber: 13
       }
     }), selectedItem.name))), /*#__PURE__*/React__namespace.createElement(OptionWrapper$1, {
@@ -9592,14 +9596,14 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$u,
-        lineNumber: 455,
+        lineNumber: 456,
         columnNumber: 7
       }
     }, item.length !== 0 ? /*#__PURE__*/React__namespace.createElement(Option, _extends({}, getMenuProps(), {
       __self: this,
       __source: {
         fileName: _jsxFileName$u,
-        lineNumber: 460,
+        lineNumber: 461,
         columnNumber: 11
       }
     }), isOpen && item.map((item, index) => /*#__PURE__*/React__namespace.createElement(ItemWrapper$1, _extends({
@@ -9617,7 +9621,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$u,
-        lineNumber: 463,
+        lineNumber: 464,
         columnNumber: 17
       }
     }), /*#__PURE__*/React__namespace.createElement(IconWrapper, {
@@ -9630,7 +9634,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$u,
-        lineNumber: 476,
+        lineNumber: 477,
         columnNumber: 19
       }
     }, item.isDisabled ? /*#__PURE__*/React__namespace.createElement(CheckOutline, {
@@ -9638,7 +9642,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$u,
-        lineNumber: 485,
+        lineNumber: 486,
         columnNumber: 23
       }
     }) : selectedValue.includes(item.id) && (item.isDisabled === false || item.isDisabled === undefined) && /*#__PURE__*/React__namespace.createElement(CheckOutline, {
@@ -9646,7 +9650,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$u,
-        lineNumber: 489,
+        lineNumber: 490,
         columnNumber: 25
       }
     })), /*#__PURE__*/React__namespace.createElement(Item$2, {
@@ -9656,7 +9660,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$u,
-        lineNumber: 493,
+        lineNumber: 494,
         columnNumber: 19
       }
     }, item.name)))) : /*#__PURE__*/React__namespace.createElement(Option, _extends({
@@ -9667,14 +9671,14 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$u,
-        lineNumber: 498,
+        lineNumber: 499,
         columnNumber: 11
       }
     }), /*#__PURE__*/React__namespace.createElement(StyledDiv$1, {
       __self: this,
       __source: {
         fileName: _jsxFileName$u,
-        lineNumber: 499,
+        lineNumber: 500,
         columnNumber: 13
       }
     }, /*#__PURE__*/React__namespace.createElement("div", {
@@ -9684,7 +9688,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$u,
-        lineNumber: 500,
+        lineNumber: 501,
         columnNumber: 15
       }
     }, /*#__PURE__*/React__namespace.createElement(icons.CircleInfoOutline, {
@@ -9696,7 +9700,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$u,
-        lineNumber: 501,
+        lineNumber: 502,
         columnNumber: 17
       }
     })), textEmptyItem))));
@@ -13695,7 +13699,7 @@
       } else {
         onCalendarDateChange(selectedDate);
       }
-    }, [pickerState.selectedMonth]);
+    }, ["".concat(pickerState.selectedMonth, "/").concat(pickerState.selectedYear)]);
     var multiDatePicker = calendars.length > 1;
 
     var renderTitleButton = function renderTitleButton(index) {
@@ -13748,7 +13752,8 @@
               });
             });
           }
-        }
+        },
+        type: "button"
       }, {
         children: jsxRuntime.jsx(icons.ChevronLeftOutline, {
           color: "currentColor"
@@ -13770,7 +13775,8 @@
               });
             });
           }
-        }
+        },
+        type: "button"
       }, {
         children: jsxRuntime.jsx(icons.ChevronRightOutline, {
           color: "currentColor"
@@ -14042,7 +14048,8 @@
                 type: TIME_PICKER
               });
             });
-          }
+          },
+          type: "button"
         }, {
           children: selected && selected[0] ? moment__default["default"](selected[0]).format('HH:mm') : moment__default["default"]().format('HH:mm')
         }), void 0)]
@@ -14067,7 +14074,8 @@
                 type: DATE_PICKER
               });
             });
-          }
+          },
+          type: "button"
         }, {
           children: "Done"
         }), void 0)]
@@ -14330,7 +14338,7 @@
       } else {
         onCalendarDateChange(selectedDate);
       }
-    }, [pickerState.selectedMonth]);
+    }, ["".concat(pickerState.selectedMonth, "/").concat(pickerState.selectedYear)]);
     var multiDatePicker = calendars.length > 1;
 
     var renderTitleButton = function renderTitleButton(index) {
@@ -14381,7 +14389,8 @@
               });
             });
           }
-        }
+        },
+        type: "button"
       }, {
         children: jsxRuntime.jsx(icons.ChevronLeftOutline, {
           color: "currentColor"
@@ -14403,7 +14412,8 @@
               });
             });
           }
-        }
+        },
+        type: "button"
       }, {
         children: jsxRuntime.jsx(icons.ChevronRightOutline, {
           color: "currentColor"
@@ -15543,20 +15553,27 @@
         minDate = _a.minDate,
         maxDate = _a.maxDate;
 
-    var _f = React.useState(date || dateValue),
+    var _f = React.useState(),
         value = _f[0],
         setValue = _f[1];
 
-    var _g = React.useState(defaultDate || defaultDateValue),
-        defaultValue = _g[0],
-        setDefaultValue = _g[1];
+    var _g = React.useState(defaultDate && !(defaultDate instanceof Date) || defaultDateValue && !(defaultDateValue instanceof Date) ? undefined : defaultDate || defaultDateValue),
+        defaultValue = _g[0];
+        _g[1];
 
     React.useEffect(function () {
-      setValue(date || dateValue);
-    }, [date, dateValue]);
-    React.useEffect(function () {
-      setDefaultValue(defaultDate || defaultDateValue);
-    }, [defaultDate, defaultDateValue]);
+      if (dateValue && !(dateValue instanceof Date) || date && !(date instanceof Date)) {
+        setValue(undefined);
+      } else {
+        setValue(date || dateValue);
+      }
+    }, [date, dateValue]); // useEffect(() => {
+    //   if ((defaultDate && !(defaultDate instanceof Date)) || (defaultDateValue && !(defaultDateValue instanceof Date))) {
+    //     setDefaultValue(undefined);
+    //   } else {
+    //     setDefaultValue(defaultDate || defaultDateValue);
+    //   }
+    // }, [defaultDate, defaultDateValue]);
 
     var _h = React.useReducer(pickerReducer, {
       selectedDate: defaultValue !== null && defaultValue !== void 0 ? defaultValue : value

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@majoo-ui/react",
-  "version": "1.46.9",
+  "version": "1.47.0-rc.1",
   "dependencies": {
     "@majoo-ui/core": "^1.31.1",
     "@majoo-ui/helpers": "^1.30.4",