@majoo-ui/react 1.61.8-rc.3 → 1.61.9

package/components/datePicker/components/Calendar.d.ts

@@ -24,6 +24,9 @@ export interface CalendarProps extends RenderProps {
     onSetDateValue?: Dispatch<SetStateAction<Date[]>>;
     maxRange?: number;
     overMaxRange?: boolean;
+    timePickerProps?: {
+        minDate?: Date;
+    };
 }
-declare const CalendarBox: ({ calendars, getDateProps, advanceView, onCalendarDateChange, onIsMultiDateChange, onUpdate, onCancel, onReset, selected, containerStyle, disabled, showTimePicker, renderTimePicker, minDate, maxDate, allowReset, onSetDateValue, maxRange, overMaxRange, }: CalendarProps) => JSX.Element | null;
+declare const CalendarBox: ({ calendars, getDateProps, advanceView, onCalendarDateChange, onIsMultiDateChange, onUpdate, onCancel, onReset, selected, containerStyle, disabled, showTimePicker, renderTimePicker, minDate, maxDate, allowReset, onSetDateValue, maxRange, overMaxRange, timePickerProps, }: CalendarProps) => JSX.Element | null;
 export default CalendarBox;

package/components/datePicker/components/CalendarTimePicker.d.ts

@@ -5,6 +5,7 @@ interface CalendarProps {
     language?: string;
     onSetDateValue?: Dispatch<SetStateAction<Date[]>>;
     isSingle?: boolean;
+    timePickerProps?: object;
 }
-declare const CalendarTimePicker: ({ selected, disabled, language, onSetDateValue, isSingle }: CalendarProps) => JSX.Element;
+declare const CalendarTimePicker: ({ selected, disabled, language, onSetDateValue, isSingle, timePickerProps }: CalendarProps) => JSX.Element;
 export default CalendarTimePicker;

package/index.esm.js

@@ -18395,7 +18395,8 @@ const CalendarTimePicker = ({
   disabled,
   language,
   onSetDateValue,
-  isSingle
+  isSingle,
+  timePickerProps
 }) => {
   const {
     t
@@ -18442,14 +18443,14 @@ const CalendarTimePicker = ({
         color: "primary"
       }, {
         children: isSingle ? t('time', 'Waktu') : t('timeFromLabel', 'Dari Pukul')
-      }), void 0), jsx(InputTimePicker, {
+      }), void 0), jsx(InputTimePicker, Object.assign({
         onChange: val => {
           if (isSingle && selected && selected.length && !!onSetDateValue) onSetDateValue(val.toDate());else if (selected && selected.length > 1 && !!onSetDateValue) onSetDateValue([val.toDate(), selected[1]]);
         },
         size: "sm",
         value: startTime,
         disabled: isSingle ? !(selected && selected.length) : !(selected && selected.length > 1)
-      }, void 0)]
+      }, timePickerProps), void 0)]
     }), void 0), isSingle ? null : jsxs(React__default.Fragment, {
       children: [jsx(Separator$2, {
         orientation: "horizontal"
@@ -18693,7 +18694,8 @@ const CalendarBox = ({
   allowReset,
   onSetDateValue,
   maxRange: _maxRange = 0,
-  overMaxRange: _overMaxRange = false
+  overMaxRange: _overMaxRange = false,
+  timePickerProps
 }) => {
   const {
     t,
@@ -18722,6 +18724,11 @@ const CalendarBox = ({
       onCalendarDateChange(selectedDate);
     }
   }, [`${pickerState.selectedMonth}/${pickerState.selectedYear}`]);
+  const isDisableSaveMinDate = useMemo(() => {
+    if ((selected === null || selected === void 0 ? void 0 : selected.length) && (timePickerProps === null || timePickerProps === void 0 ? void 0 : timePickerProps.minDate) instanceof Date) {
+      return moment(selected[0]).isBefore(timePickerProps === null || timePickerProps === void 0 ? void 0 : timePickerProps.minDate);
+    } else return false;
+  }, [selected, minDate, showTimePicker]);
   const multiDatePicker = calendars.length > 1;
   const renderTitleButton = (index = 0) => {
     return multiDatePicker ? jsxs(TitleButton$1, Object.assign({
@@ -19027,7 +19034,7 @@ const CalendarBox = ({
               fontWeight: 600
             },
             onClick: onUpdate,
-            disabled: disabled || !selected || selected.length <= 1 || _overMaxRange,
+            disabled: disabled || !selected || selected.length <= 1 || _overMaxRange || isDisableSaveMinDate,
             size: "sm",
             type: "button"
           }, {
@@ -19047,7 +19054,8 @@ const CalendarBox = ({
         selected,
         disabled,
         language,
-        onSetDateValue
+        onSetDateValue,
+        timePickerProps
       }, {
         isSingle: !multiDatePicker
       }), void 0)]
@@ -19091,7 +19099,7 @@ const CalendarBox = ({
               fontWeight: 600
             },
             onClick: onUpdate,
-            disabled: disabled || !(selected && selected.length),
+            disabled: disabled || !(selected && selected.length) || isDisableSaveMinDate,
             size: "sm",
             type: "button"
           }, {
@@ -19139,7 +19147,8 @@ const CalendarBox = ({
             selected,
             disabled,
             language,
-            onSetDateValue
+            onSetDateValue,
+            timePickerProps
           }), void 0)]
         }, void 0)]
       }), void 0), !multiDatePicker && showTimePicker && renderFooterSingleTimePicker(), multiDatePicker && renderFooter()]
@@ -19723,7 +19732,7 @@ const CalendarPicker = _a => {
     monthsToDisplay: isMultiDatePicker ? 2 : 1,
     showOutsideDays: true,
     onDateSelected,
-    minDate,
+    minDate: minDate,
     maxDate
   }));
   useMountedLayoutEffect(() => {
@@ -19745,9 +19754,11 @@ const CalendarPicker = _a => {
     onCalendarDateChange: setCalendarDate,
     showTimePicker: showTimePicker,
     minDate: minDate,
-    maxDate: maxDate
+    maxDate: maxDate,
+    timePickerProps: timePickerProps
   }, showTimePicker && {
-    onSetDateValue: setDateValue
+    onSetDateValue: setDateValue,
+    timePickerProps
   }, dayzedData), void 0);
 };
 const CalendarRangePicker = _a => {
@@ -19765,9 +19776,10 @@ const CalendarRangePicker = _a => {
       maxDate: maxDateProps,
       allowReset,
       showTimePicker,
-      maxRange
+      maxRange,
+      timePickerProps
     } = _a,
-    props = __rest(_a, ["isMultiDatePicker", "isRangeControl", "onChange", "onDateSelected", "onClose", "onReset", "advanceView", "selected", "disabled", "minDate", "maxDate", "allowReset", "showTimePicker", "maxRange"]);
+    props = __rest(_a, ["isMultiDatePicker", "isRangeControl", "onChange", "onDateSelected", "onClose", "onReset", "advanceView", "selected", "disabled", "minDate", "maxDate", "allowReset", "showTimePicker", "maxRange", "timePickerProps"]);
   const today = new Date();
   const prevMonth = new Date(today.getFullYear(), today.getMonth() - 1, 1, 0);
   const nowMonth = new Date(today.getFullYear(), today.getMonth(), 1, 0);
@@ -19883,7 +19895,8 @@ const CalendarRangePicker = _a => {
     onReset: isMultiDatePicker ? resetHandler : undefined,
     showTimePicker: showTimePicker,
     maxRange: maxRange,
-    overMaxRange: overMaxRange
+    overMaxRange: overMaxRange,
+    timePickerProps: timePickerProps
   }, {
     onSetDateValue: setDateValue
   }, dayzedData), void 0);
@@ -29204,7 +29217,7 @@ const Upload = ({
         } else {
           imageCompressionComponent(blob, {
             maxSizeMB,
-            maxWidthOrHeight: 1000,
+            maxWidthOrHeight: 1024,
             maxIteration: 10,
             useWebWorker: true,
             alwaysKeepResolution: true

package/index.umd.js

@@ -18604,7 +18604,8 @@
       disabled = _a.disabled,
       language = _a.language,
       onSetDateValue = _a.onSetDateValue,
-      isSingle = _a.isSingle;
+      isSingle = _a.isSingle,
+      timePickerProps = _a.timePickerProps;
     var t = reactI18next.useTranslation('MajooUI/datePicker').t;
     var startTime = moment__default["default"]('00:00', 'HH:mm').toDate();
     var endTime = moment__default["default"]('00:00', 'HH:mm').toDate();
@@ -18648,14 +18649,14 @@
           color: "primary"
         }, {
           children: isSingle ? t('time', 'Waktu') : t('timeFromLabel', 'Dari Pukul')
-        }), void 0), jsxRuntime.jsx(InputTimePicker, {
+        }), void 0), jsxRuntime.jsx(InputTimePicker, __assign({
           onChange: function (val) {
             if (isSingle && selected && selected.length && !!onSetDateValue) onSetDateValue(val.toDate());else if (selected && selected.length > 1 && !!onSetDateValue) onSetDateValue([val.toDate(), selected[1]]);
           },
           size: "sm",
           value: startTime,
           disabled: isSingle ? !(selected && selected.length) : !(selected && selected.length > 1)
-        }, void 0)]
+        }, timePickerProps), void 0)]
       }), void 0), isSingle ? null : jsxRuntime.jsxs(React__default["default"].Fragment, {
         children: [jsxRuntime.jsx(Separator$2, {
           orientation: "horizontal"
@@ -18900,7 +18901,8 @@
       _b = _a.maxRange,
       maxRange = _b === void 0 ? 0 : _b,
       _c = _a.overMaxRange,
-      overMaxRange = _c === void 0 ? false : _c;
+      overMaxRange = _c === void 0 ? false : _c,
+      timePickerProps = _a.timePickerProps;
     var _d = reactI18next.useTranslation(['MajooUI/datePicker', 'translation']),
       t = _d.t,
       i18n = _d.i18n;
@@ -18931,6 +18933,11 @@
         onCalendarDateChange(selectedDate);
       }
     }, ["".concat(pickerState.selectedMonth, "/").concat(pickerState.selectedYear)]);
+    var isDisableSaveMinDate = React.useMemo(function () {
+      if ((selected === null || selected === void 0 ? void 0 : selected.length) && (timePickerProps === null || timePickerProps === void 0 ? void 0 : timePickerProps.minDate) instanceof Date) {
+        return moment__default["default"](selected[0]).isBefore(timePickerProps === null || timePickerProps === void 0 ? void 0 : timePickerProps.minDate);
+      } else return false;
+    }, [selected, minDate, showTimePicker]);
     var multiDatePicker = calendars.length > 1;
     var renderTitleButton = function renderTitleButton(index) {
       if (index === void 0) {
@@ -19265,7 +19272,7 @@
                 fontWeight: 600
               },
               onClick: onUpdate,
-              disabled: disabled || !selected || selected.length <= 1 || overMaxRange,
+              disabled: disabled || !selected || selected.length <= 1 || overMaxRange || isDisableSaveMinDate,
               size: "sm",
               type: "button"
             }, {
@@ -19285,7 +19292,8 @@
           selected: selected,
           disabled: disabled,
           language: language,
-          onSetDateValue: onSetDateValue
+          onSetDateValue: onSetDateValue,
+          timePickerProps: timePickerProps
         }, {
           isSingle: !multiDatePicker
         }), void 0)]
@@ -19329,7 +19337,7 @@
                 fontWeight: 600
               },
               onClick: onUpdate,
-              disabled: disabled || !(selected && selected.length),
+              disabled: disabled || !(selected && selected.length) || isDisableSaveMinDate,
               size: "sm",
               type: "button"
             }, {
@@ -19379,7 +19387,8 @@
               selected: selected,
               disabled: disabled,
               language: language,
-              onSetDateValue: onSetDateValue
+              onSetDateValue: onSetDateValue,
+              timePickerProps: timePickerProps
             }), void 0)]
           }, void 0)]
         }), void 0), !multiDatePicker && showTimePicker && renderFooterSingleTimePicker(), multiDatePicker && renderFooter()]
@@ -20020,9 +20029,11 @@
       onCalendarDateChange: setCalendarDate,
       showTimePicker: showTimePicker,
       minDate: minDate,
-      maxDate: maxDate
+      maxDate: maxDate,
+      timePickerProps: timePickerProps
     }, showTimePicker && {
-      onSetDateValue: setDateValue
+      onSetDateValue: setDateValue,
+      timePickerProps: timePickerProps
     }, dayzedData), void 0);
   };
   var CalendarRangePicker = function CalendarRangePicker(_a) {
@@ -20040,7 +20051,8 @@
       allowReset = _a.allowReset,
       showTimePicker = _a.showTimePicker,
       maxRange = _a.maxRange,
-      props = __rest(_a, ["isMultiDatePicker", "isRangeControl", "onChange", "onDateSelected", "onClose", "onReset", "advanceView", "selected", "disabled", "minDate", "maxDate", "allowReset", "showTimePicker", "maxRange"]);
+      timePickerProps = _a.timePickerProps,
+      props = __rest(_a, ["isMultiDatePicker", "isRangeControl", "onChange", "onDateSelected", "onClose", "onReset", "advanceView", "selected", "disabled", "minDate", "maxDate", "allowReset", "showTimePicker", "maxRange", "timePickerProps"]);
     var today = new Date();
     var prevMonth = new Date(today.getFullYear(), today.getMonth() - 1, 1, 0);
     var nowMonth = new Date(today.getFullYear(), today.getMonth(), 1, 0);
@@ -20161,7 +20173,8 @@
       onReset: isMultiDatePicker ? resetHandler : undefined,
       showTimePicker: showTimePicker,
       maxRange: maxRange,
-      overMaxRange: overMaxRange
+      overMaxRange: overMaxRange,
+      timePickerProps: timePickerProps
     }, {
       onSetDateValue: setDateValue
     }, dayzedData), void 0);
@@ -29719,7 +29732,7 @@
           } else {
             imageCompressionComponent__default["default"](blob, {
               maxSizeMB,
-              maxWidthOrHeight: 1000,
+              maxWidthOrHeight: 1024,
               maxIteration: 10,
               useWebWorker: true,
               alwaysKeepResolution: true

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@majoo-ui/react",
-  "version": "1.61.8-rc.3",
+  "version": "1.61.9",
   "dependencies": {
     "@majoo-ui/core": "^1.31.3",
     "@majoo-ui/helpers": "^1.30.5",