@majoo-ui/react 1.54.3 → 1.54.4

package/index.esm.js

@@ -14822,6 +14822,7 @@ const ButtonTime = styled('button', {
   cursor: 'pointer',
   transition: '0.2s',
   borderRadius: 2,
+  color: '$textPrimary',
   '&:hover': {
     background: '$bgSuccess',
     color: '$textGreen'
@@ -14896,6 +14897,12 @@ const CalendarBox = ({
         if (pickerState.type < YEAR_RANGE_PICKER) setPickerState(current => Object.assign(Object.assign({}, current), {
           type: current.type + 1
         }));
+
+        if (pickerState.type === TIME_PICKER) {
+          setPickerState(current => Object.assign(Object.assign({}, current), {
+            type: DATE_PICKER
+          }));
+        }
       },
       disabled: disabled || pickerState.type === YEAR_RANGE_PICKER
     }, {
@@ -14905,6 +14912,8 @@ const CalendarBox = ({
         children: [pickerState.selectedYearRange, " - ", pickerState.selectedYearRange + 9]
       }, void 0), pickerState.type === YEAR_RANGE_PICKER && jsxs(Fragment, {
         children: [pickerState.selectedYearRangeStart, " - ", pickerState.selectedYearRangeStart + 99]
+      }, void 0), pickerState.type === TIME_PICKER && jsxs(Fragment, {
+        children: [selected && moment(selected === null || selected === void 0 ? void 0 : selected[0]).format('DD'), " ", monthNamesFull[calendars[0].month], " ", calendars[0].year]
       }, void 0)]
     }), void 0);
   };
@@ -15217,9 +15226,7 @@ const CalendarBox = ({
         }
       }, void 0), jsx(ButtonTime, Object.assign({
         disabled: disabled,
-        onClick: () => setPickerState(current => Object.assign(Object.assign({}, current), {
-          type: DATE_PICKER
-        })),
+        onClick: () => onCancel === null || onCancel === void 0 ? void 0 : onCancel(),
         type: "button"
       }, {
         children: "Done"
@@ -16200,22 +16207,23 @@ function InputTimePicker({
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 42,
+      lineNumber: 43,
       columnNumber: 5
     }
   }, /*#__PURE__*/React__default.createElement(InputLeftElement, {
     children: /*#__PURE__*/React__default.createElement(TimeOutline, {
+      color: disabled ? colors$4.iconDisable : colors$4.iconPrimary,
       __self: this,
       __source: {
         fileName: _jsxFileName$j,
-        lineNumber: 43,
+        lineNumber: 44,
         columnNumber: 35
       }
     }),
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 43,
+      lineNumber: 44,
       columnNumber: 7
     }
   }), /*#__PURE__*/React__default.createElement(InputText, {
@@ -16228,7 +16236,7 @@ function InputTimePicker({
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 44,
+      lineNumber: 45,
       columnNumber: 7
     }
   }));
@@ -16244,7 +16252,7 @@ function InputTimePicker({
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 56,
+      lineNumber: 57,
       columnNumber: 5
     }
   });
@@ -16256,7 +16264,7 @@ function InputTimePicker({
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 68,
+      lineNumber: 69,
       columnNumber: 5
     }
   }, disabled || readOnly ? /*#__PURE__*/React__default.createElement(Box, {
@@ -16264,14 +16272,14 @@ function InputTimePicker({
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 70,
+      lineNumber: 71,
       columnNumber: 9
     }
   }, renderInputGroup()) : /*#__PURE__*/React__default.createElement(PopoverTrigger, {
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 72,
+      lineNumber: 73,
       columnNumber: 9
     }
   }, /*#__PURE__*/React__default.createElement(Box, {
@@ -16279,14 +16287,14 @@ function InputTimePicker({
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 73,
+      lineNumber: 74,
       columnNumber: 11
     }
   }, renderInputGroup())), /*#__PURE__*/React__default.createElement(PopoverContent, {
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 76,
+      lineNumber: 77,
       columnNumber: 7
     }
   }, renderTimePicker())) : /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Box, {
@@ -16294,7 +16302,7 @@ function InputTimePicker({
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 80,
+      lineNumber: 81,
       columnNumber: 7
     }
   }, renderInputGroup()), /*#__PURE__*/React__default.createElement(Drawer, {
@@ -16304,7 +16312,7 @@ function InputTimePicker({
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 81,
+      lineNumber: 82,
       columnNumber: 7
     }
   }, /*#__PURE__*/React__default.createElement(DrawerContent, {
@@ -16315,7 +16323,7 @@ function InputTimePicker({
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 82,
+      lineNumber: 83,
       columnNumber: 9
     }
   }, /*#__PURE__*/React__default.createElement(Flex$1, {
@@ -16327,7 +16335,7 @@ function InputTimePicker({
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 88,
+      lineNumber: 89,
       columnNumber: 11
     }
   }, renderTimePicker()))));
@@ -16454,7 +16462,7 @@ const CalendarPicker = _a => {
   const timePicker = () => {
     return jsx(Box, Object.assign({
       css: {
-        padding: '50px 95px'
+        padding: '40px 60px'
       }
     }, {
       children: jsx(NativeTimePicker, {
@@ -20016,7 +20024,7 @@ const TemplateAlertFunction = props => {
       columnNumber: 15
     }
   }, /*#__PURE__*/React__default.createElement(Button$3, _extends({
-    size: "sm",
+    size: props.btnSize,
     onClick: buttonConfirm,
     buttonType: props.dialogType,
     disabled: props == null ? void 0 : props.disabledButton
@@ -20027,7 +20035,7 @@ const TemplateAlertFunction = props => {
       lineNumber: 158,
       columnNumber: 17
     }
-  }), props.labelConfirm ? props.labelConfirm : 'Confirm')) : /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(ADialog.Cancel, {
+  }), props.labelConfirm ? props.labelConfirm : 'Ya, Lanjutkan')) : /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(ADialog.Cancel, {
     asChild: true,
     __self: undefined,
     __source: {
@@ -20036,7 +20044,7 @@ const TemplateAlertFunction = props => {
       columnNumber: 17
     }
   }, /*#__PURE__*/React__default.createElement(Button$3, _extends({
-    size: "sm",
+    size: props.btnSize,
     onClick: buttonCancel,
     css: {
       color: props.dialogType === 'negative' && !(props != null && props.disabledButton) && '$gray900 !important',
@@ -20051,7 +20059,7 @@ const TemplateAlertFunction = props => {
       lineNumber: 171,
       columnNumber: 19
     }
-  }), props.labelCancel ? props.labelCancel : 'Cancel')), /*#__PURE__*/React__default.createElement(ADialog.Action, {
+  }), props.labelCancel ? props.labelCancel : 'Batal')), /*#__PURE__*/React__default.createElement(ADialog.Action, {
     asChild: true,
     __self: undefined,
     __source: {
@@ -20060,7 +20068,7 @@ const TemplateAlertFunction = props => {
       columnNumber: 17
     }
   }, /*#__PURE__*/React__default.createElement(Button$3, _extends({
-    size: "sm",
+    size: props.btnSize,
     onClick: buttonConfirm,
     buttonType: props.dialogType,
     css: {
@@ -20074,7 +20082,7 @@ const TemplateAlertFunction = props => {
       lineNumber: 186,
       columnNumber: 19
     }
-  }), props.labelConfirm ? props.labelConfirm : 'Confirm')))))));
+  }), props.labelConfirm ? props.labelConfirm : 'Ya, Lanjutkan')))))));
 };
 
 function AlertDialog(props) {
@@ -20221,7 +20229,7 @@ function AlertDialog(props) {
       columnNumber: 15
     }
   }, /*#__PURE__*/React__default.createElement(Button$3, _extends({
-    size: "sm",
+    size: props.btnSize,
     onClick: props.onConfirm,
     buttonType: props.dialogType,
     css: {
@@ -20235,7 +20243,7 @@ function AlertDialog(props) {
       lineNumber: 245,
       columnNumber: 17
     }
-  }), props.labelConfirm ? props.labelConfirm : 'Confirm')) : /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(ADialog.Cancel, {
+  }), props.labelConfirm ? props.labelConfirm : 'Ya, Lanjutkan')) : /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(ADialog.Cancel, {
     asChild: true,
     __self: this,
     __source: {
@@ -20244,7 +20252,7 @@ function AlertDialog(props) {
       columnNumber: 17
     }
   }, /*#__PURE__*/React__default.createElement(Button$3, _extends({
-    size: "sm",
+    size: props.btnSize,
     onClick: props.onCancel,
     css: {
       color: props.dialogType === 'negative' && !(props != null && props.disabledButton) && '$gray900 !important',
@@ -20259,7 +20267,7 @@ function AlertDialog(props) {
       lineNumber: 259,
       columnNumber: 19
     }
-  }), props.labelCancel ? props.labelCancel : 'Cancel')), /*#__PURE__*/React__default.createElement(ADialog.Action, {
+  }), props.labelCancel ? props.labelCancel : 'Batal')), /*#__PURE__*/React__default.createElement(ADialog.Action, {
     asChild: true,
     __self: this,
     __source: {
@@ -20268,7 +20276,7 @@ function AlertDialog(props) {
       columnNumber: 17
     }
   }, /*#__PURE__*/React__default.createElement(Button$3, _extends({
-    size: "sm",
+    size: props.btnSize,
     onClick: props.onConfirm,
     buttonType: props.dialogType,
     css: {
@@ -20282,11 +20290,12 @@ function AlertDialog(props) {
       lineNumber: 274,
       columnNumber: 19
     }
-  }), props.labelConfirm ? props.labelConfirm : 'Confirm')))))));
+  }), props.labelConfirm ? props.labelConfirm : 'Ya, Lanjutkan')))))));
 }
 TemplateAlertFunction.propTypes = {
   title: PropTypes.string.isRequired,
   description: PropTypes.string.isRequired,
+  btnSize: PropTypes.string,
   dialogType: PropTypes.string,
   onCancel: PropTypes.func,
   onConfirm: PropTypes.func,
@@ -20296,6 +20305,7 @@ TemplateAlertFunction.propTypes = {
 };
 TemplateAlertFunction.defaultProps = {
   dialogType: 'primary',
+  btnSize: 'md',
   onCancel: () => {},
   onConfirm: () => {},
   disabledButton: false
@@ -20303,6 +20313,7 @@ TemplateAlertFunction.defaultProps = {
 AlertDialog.propTypes = {
   title: PropTypes.string.isRequired,
   description: PropTypes.string.isRequired,
+  btnSize: PropTypes.string,
   dialogType: PropTypes.string,
   onCancel: PropTypes.func,
   onConfirm: PropTypes.func,
@@ -20312,6 +20323,7 @@ AlertDialog.propTypes = {
 };
 AlertDialog.defaultProps = {
   dialogType: 'primary',
+  btnSize: 'md',
   onCancel: () => {},
   onConfirm: () => {},
   disabledButton: false

package/index.umd.js

@@ -14996,6 +14996,7 @@
     cursor: 'pointer',
     transition: '0.2s',
     borderRadius: 2,
+    color: '$textPrimary',
     '&:hover': {
       background: '$bgSuccess',
       color: '$textGreen'
@@ -15083,6 +15084,14 @@
               type: current.type + 1
             });
           });
+
+          if (pickerState.type === TIME_PICKER) {
+            setPickerState(function (current) {
+              return __assign(__assign({}, current), {
+                type: DATE_PICKER
+              });
+            });
+          }
         },
         disabled: disabled || pickerState.type === YEAR_RANGE_PICKER
       }, {
@@ -15092,6 +15101,8 @@
           children: [pickerState.selectedYearRange, " - ", pickerState.selectedYearRange + 9]
         }, void 0), pickerState.type === YEAR_RANGE_PICKER && jsxRuntime.jsxs(jsxRuntime.Fragment, {
           children: [pickerState.selectedYearRangeStart, " - ", pickerState.selectedYearRangeStart + 99]
+        }, void 0), pickerState.type === TIME_PICKER && jsxRuntime.jsxs(jsxRuntime.Fragment, {
+          children: [selected && moment__default["default"](selected === null || selected === void 0 ? void 0 : selected[0]).format('DD'), " ", monthNamesFull[calendars[0].month], " ", calendars[0].year]
         }, void 0)]
       }), void 0);
     };
@@ -15429,11 +15440,7 @@
         }, void 0), jsxRuntime.jsx(ButtonTime, __assign({
           disabled: disabled,
           onClick: function () {
-            return setPickerState(function (current) {
-              return __assign(__assign({}, current), {
-                type: DATE_PICKER
-              });
-            });
+            return onCancel === null || onCancel === void 0 ? void 0 : onCancel();
           },
           type: "button"
         }, {
@@ -16452,22 +16459,23 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$j,
-        lineNumber: 42,
+        lineNumber: 43,
         columnNumber: 5
       }
     }, /*#__PURE__*/React__default["default"].createElement(InputLeftElement, {
       children: /*#__PURE__*/React__default["default"].createElement(icons.TimeOutline, {
+        color: disabled ? colors$4.iconDisable : colors$4.iconPrimary,
         __self: this,
         __source: {
           fileName: _jsxFileName$j,
-          lineNumber: 43,
+          lineNumber: 44,
           columnNumber: 35
         }
       }),
       __self: this,
       __source: {
         fileName: _jsxFileName$j,
-        lineNumber: 43,
+        lineNumber: 44,
         columnNumber: 7
       }
     }), /*#__PURE__*/React__default["default"].createElement(InputText, {
@@ -16480,7 +16488,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$j,
-        lineNumber: 44,
+        lineNumber: 45,
         columnNumber: 7
       }
     }));
@@ -16496,7 +16504,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$j,
-        lineNumber: 56,
+        lineNumber: 57,
         columnNumber: 5
       }
     });
@@ -16508,7 +16516,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$j,
-        lineNumber: 68,
+        lineNumber: 69,
         columnNumber: 5
       }
     }, disabled || readOnly ? /*#__PURE__*/React__default["default"].createElement(Box, {
@@ -16516,14 +16524,14 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$j,
-        lineNumber: 70,
+        lineNumber: 71,
         columnNumber: 9
       }
     }, renderInputGroup()) : /*#__PURE__*/React__default["default"].createElement(PopoverTrigger, {
       __self: this,
       __source: {
         fileName: _jsxFileName$j,
-        lineNumber: 72,
+        lineNumber: 73,
         columnNumber: 9
       }
     }, /*#__PURE__*/React__default["default"].createElement(Box, {
@@ -16531,14 +16539,14 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$j,
-        lineNumber: 73,
+        lineNumber: 74,
         columnNumber: 11
       }
     }, renderInputGroup())), /*#__PURE__*/React__default["default"].createElement(PopoverContent, {
       __self: this,
       __source: {
         fileName: _jsxFileName$j,
-        lineNumber: 76,
+        lineNumber: 77,
         columnNumber: 7
       }
     }, renderTimePicker())) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(Box, {
@@ -16546,7 +16554,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$j,
-        lineNumber: 80,
+        lineNumber: 81,
         columnNumber: 7
       }
     }, renderInputGroup()), /*#__PURE__*/React__default["default"].createElement(Drawer, {
@@ -16556,7 +16564,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$j,
-        lineNumber: 81,
+        lineNumber: 82,
         columnNumber: 7
       }
     }, /*#__PURE__*/React__default["default"].createElement(DrawerContent, {
@@ -16567,7 +16575,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$j,
-        lineNumber: 82,
+        lineNumber: 83,
         columnNumber: 9
       }
     }, /*#__PURE__*/React__default["default"].createElement(Flex$1, {
@@ -16579,7 +16587,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$j,
-        lineNumber: 88,
+        lineNumber: 89,
         columnNumber: 11
       }
     }, renderTimePicker()))));
@@ -16709,7 +16717,7 @@
     var timePicker = function timePicker() {
       return jsxRuntime.jsx(Box, __assign({
         css: {
-          padding: '50px 95px'
+          padding: '40px 60px'
         }
       }, {
         children: jsxRuntime.jsx(NativeTimePicker, {
@@ -20375,7 +20383,7 @@
         columnNumber: 15
       }
     }, /*#__PURE__*/React__default["default"].createElement(Button$3, _extends({
-      size: "sm",
+      size: props.btnSize,
       onClick: buttonConfirm,
       buttonType: props.dialogType,
       disabled: props == null ? void 0 : props.disabledButton
@@ -20386,7 +20394,7 @@
         lineNumber: 158,
         columnNumber: 17
       }
-    }), props.labelConfirm ? props.labelConfirm : 'Confirm')) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(ADialog__namespace.Cancel, {
+    }), props.labelConfirm ? props.labelConfirm : 'Ya, Lanjutkan')) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(ADialog__namespace.Cancel, {
       asChild: true,
       __self: undefined,
       __source: {
@@ -20395,7 +20403,7 @@
         columnNumber: 17
       }
     }, /*#__PURE__*/React__default["default"].createElement(Button$3, _extends({
-      size: "sm",
+      size: props.btnSize,
       onClick: buttonCancel,
       css: {
         color: props.dialogType === 'negative' && !(props != null && props.disabledButton) && '$gray900 !important',
@@ -20410,7 +20418,7 @@
         lineNumber: 171,
         columnNumber: 19
       }
-    }), props.labelCancel ? props.labelCancel : 'Cancel')), /*#__PURE__*/React__default["default"].createElement(ADialog__namespace.Action, {
+    }), props.labelCancel ? props.labelCancel : 'Batal')), /*#__PURE__*/React__default["default"].createElement(ADialog__namespace.Action, {
       asChild: true,
       __self: undefined,
       __source: {
@@ -20419,7 +20427,7 @@
         columnNumber: 17
       }
     }, /*#__PURE__*/React__default["default"].createElement(Button$3, _extends({
-      size: "sm",
+      size: props.btnSize,
       onClick: buttonConfirm,
       buttonType: props.dialogType,
       css: {
@@ -20433,7 +20441,7 @@
         lineNumber: 186,
         columnNumber: 19
       }
-    }), props.labelConfirm ? props.labelConfirm : 'Confirm')))))));
+    }), props.labelConfirm ? props.labelConfirm : 'Ya, Lanjutkan')))))));
   };
 
   function AlertDialog(props) {
@@ -20580,7 +20588,7 @@
         columnNumber: 15
       }
     }, /*#__PURE__*/React__default["default"].createElement(Button$3, _extends({
-      size: "sm",
+      size: props.btnSize,
       onClick: props.onConfirm,
       buttonType: props.dialogType,
       css: {
@@ -20594,7 +20602,7 @@
         lineNumber: 245,
         columnNumber: 17
       }
-    }), props.labelConfirm ? props.labelConfirm : 'Confirm')) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(ADialog__namespace.Cancel, {
+    }), props.labelConfirm ? props.labelConfirm : 'Ya, Lanjutkan')) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(ADialog__namespace.Cancel, {
       asChild: true,
       __self: this,
       __source: {
@@ -20603,7 +20611,7 @@
         columnNumber: 17
       }
     }, /*#__PURE__*/React__default["default"].createElement(Button$3, _extends({
-      size: "sm",
+      size: props.btnSize,
       onClick: props.onCancel,
       css: {
         color: props.dialogType === 'negative' && !(props != null && props.disabledButton) && '$gray900 !important',
@@ -20618,7 +20626,7 @@
         lineNumber: 259,
         columnNumber: 19
       }
-    }), props.labelCancel ? props.labelCancel : 'Cancel')), /*#__PURE__*/React__default["default"].createElement(ADialog__namespace.Action, {
+    }), props.labelCancel ? props.labelCancel : 'Batal')), /*#__PURE__*/React__default["default"].createElement(ADialog__namespace.Action, {
       asChild: true,
       __self: this,
       __source: {
@@ -20627,7 +20635,7 @@
         columnNumber: 17
       }
     }, /*#__PURE__*/React__default["default"].createElement(Button$3, _extends({
-      size: "sm",
+      size: props.btnSize,
       onClick: props.onConfirm,
       buttonType: props.dialogType,
       css: {
@@ -20641,11 +20649,12 @@
         lineNumber: 274,
         columnNumber: 19
       }
-    }), props.labelConfirm ? props.labelConfirm : 'Confirm')))))));
+    }), props.labelConfirm ? props.labelConfirm : 'Ya, Lanjutkan')))))));
   }
   TemplateAlertFunction.propTypes = {
     title: PropTypes__default["default"].string.isRequired,
     description: PropTypes__default["default"].string.isRequired,
+    btnSize: PropTypes__default["default"].string,
     dialogType: PropTypes__default["default"].string,
     onCancel: PropTypes__default["default"].func,
     onConfirm: PropTypes__default["default"].func,
@@ -20655,6 +20664,7 @@
   };
   TemplateAlertFunction.defaultProps = {
     dialogType: 'primary',
+    btnSize: 'md',
     onCancel: () => {},
     onConfirm: () => {},
     disabledButton: false
@@ -20662,6 +20672,7 @@
   AlertDialog.propTypes = {
     title: PropTypes__default["default"].string.isRequired,
     description: PropTypes__default["default"].string.isRequired,
+    btnSize: PropTypes__default["default"].string,
     dialogType: PropTypes__default["default"].string,
     onCancel: PropTypes__default["default"].func,
     onConfirm: PropTypes__default["default"].func,
@@ -20671,6 +20682,7 @@
   };
   AlertDialog.defaultProps = {
     dialogType: 'primary',
+    btnSize: 'md',
     onCancel: () => {},
     onConfirm: () => {},
     disabledButton: false

package/package.json

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