@majoo-ui/react 1.62.5 → 1.62.6

package/index.esm.js

@@ -22080,8 +22080,19 @@ function pickerReducer(state, action) {
   switch (action.type) {
     case UPDATE_PICKER:
       {
+        const current = state.selectedDate;
+        const next = action.payload;
+        // Bail out if the value hasn't changed — prevents infinite re-render loops
+        // caused by the circular: dispatch → selectedDate → DatePicker effect → onChange → dispatch
+        if (current === next) return state;
+        if (current instanceof Date && next instanceof Date && current.getTime() === next.getTime()) {
+          return state;
+        }
+        if (Array.isArray(current) && Array.isArray(next) && current.length === next.length && current.every((d, i) => d instanceof Date && next[i] instanceof Date && d.getTime() === next[i].getTime())) {
+          return state;
+        }
         return Object.assign(Object.assign({}, state), {
-          selectedDate: action.payload
+          selectedDate: next
         });
       }
     case TODAY:
@@ -24522,11 +24533,14 @@ const PaginationButton = ({
   currentPage,
   totalPages,
   onSelect,
-  hideInputPageSection
+  hideInputPageSection,
+  previousButton,
+  nextButton,
+  gotoPageText,
+  goToPagePlaceholder,
+  btnCancelText,
+  btnSubmitText
 }) => {
-  const {
-    t
-  } = useTranslation('MajooUI/pagination');
   const isLg = useMediaQuery('(max-width: 800px)');
   const handleSelectPage = page => {
     if (onSelect && page > 0 && page <= totalPages) {
@@ -24605,7 +24619,7 @@ const PaginationButton = ({
     isDisabled: currentPage === 1,
     color: currentPage === 1 ? 'disable' : 'primary',
     onClick: () => handleSelectPage(currentPage - 1)
-  }, t('previousButton', 'Sebelumnya'))), generatePages().map((page, index) => {
+  }, previousButton || 'Sebelumnya')), generatePages().map((page, index) => {
     return /*#__PURE__*/React__default.createElement(PageButton, {
       key: index.toString(),
       isActive: page === currentPage,
@@ -24622,7 +24636,7 @@ const PaginationButton = ({
     isDisabled: currentPage === totalPages,
     color: currentPage === totalPages ? 'disable' : 'primary',
     onClick: () => handleSelectPage(currentPage + 1)
-  }, t('nextButton', 'Selanjutnya')), !isLg && /*#__PURE__*/React__default.createElement(IconButton, {
+  }, nextButton || 'Selanjutnya'), !isLg && /*#__PURE__*/React__default.createElement(IconButton, {
     type: "button",
     buttonType: "secondary",
     disabled: currentPage === totalPages,
@@ -24657,7 +24671,7 @@ const PaginationButton = ({
       padding: 4,
       borderRadius: 4
     })
-  }, t('gotoPageText', 'Ke Halaman')), isMobilePagination ? /*#__PURE__*/React__default.createElement(GoToPageBox, {
+  }, gotoPageText || 'Ke Halaman'), isMobilePagination ? /*#__PURE__*/React__default.createElement(GoToPageBox, {
     align: "center",
     justify: "center",
     onClick: () => {
@@ -24691,7 +24705,7 @@ const PaginationButton = ({
     }
   }, /*#__PURE__*/React__default.createElement("div", {
     ref: dialogPageRef
-  })), /*#__PURE__*/React__default.createElement(ModalDialogTitle, null, t('gotoPageText', 'Ke Halaman')), /*#__PURE__*/React__default.createElement(ModalDialogContent, null, /*#__PURE__*/React__default.createElement("form", {
+  })), /*#__PURE__*/React__default.createElement(ModalDialogTitle, null, gotoPageText || 'Ke Halaman'), /*#__PURE__*/React__default.createElement(ModalDialogContent, null, /*#__PURE__*/React__default.createElement("form", {
     onSubmit: () => {
       var _dialogPageRef$curren2;
       debouncedGoToPage(Number(goToPage));
@@ -24699,7 +24713,7 @@ const PaginationButton = ({
     }
   }, /*#__PURE__*/React__default.createElement(InputNumber, {
     ref: inputPageRef,
-    placeholder: t('goToPagePlaceholder', 'Contoh: 10'),
+    placeholder: goToPagePlaceholder || 'Contoh: 10',
     isAllowed: ({
       floatValue
     }) => floatValue === undefined || floatValue > 0 && floatValue <= totalPages,
@@ -24722,7 +24736,7 @@ const PaginationButton = ({
       setGoToPage(null);
       (_dialogPageRef$curren3 = dialogPageRef.current) == null || _dialogPageRef$curren3.click();
     }
-  }, t('btnCancelText', 'Batal')), /*#__PURE__*/React__default.createElement(Button$4, {
+  }, btnCancelText || 'Batal'), /*#__PURE__*/React__default.createElement(Button$4, {
     block: true,
     type: "button",
     buttonType: "primary",
@@ -24731,10 +24745,10 @@ const PaginationButton = ({
       debouncedGoToPage(Number(goToPage));
       (_dialogPageRef$curren4 = dialogPageRef.current) == null || _dialogPageRef$curren4.click();
     }
-  }, t('btnSubmitText', 'Lanjutkan'))))));
+  }, btnSubmitText || 'Lanjutkan')))));
 };
 
-const _excluded$4 = ["limits", "selectedLimit", "currentPage", "totalData", "onChange"];
+const _excluded$4 = ["limits", "selectedLimit", "currentPage", "totalData", "onChange", "showingText", "showingCountText", "dialogShowingText"];
 const LimitContainer = styled(Flex$1, {
   cursor: 'pointer'
 });
@@ -24757,12 +24771,14 @@ function PaginationInfo(_ref) {
       selectedLimit,
       currentPage,
       totalData,
-      onChange
+      onChange,
+      showingText,
+      showingCountText,
+      dialogShowingText
     } = _ref;
     _objectWithoutPropertiesLoose(_ref, _excluded$4);
-  const {
-    t
-  } = useTranslation('MajooUI/pagination');
+  const from = (currentPage - 1) * selectedLimit + 1;
+  const to = selectedLimit * currentPage < totalData ? selectedLimit * currentPage : totalData;
   const dialogLimitRef = useRef();
   const isMobilePagination = useMediaQuery('(max-width: 767px)');
   return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Flex$1, {
@@ -24771,7 +24787,7 @@ function PaginationInfo(_ref) {
   }, /*#__PURE__*/React__default.createElement(Text$1, {
     color: "secondary",
     variant: "label"
-  }, t('showingText', 'Tampilkan:')), /*#__PURE__*/React__default.createElement(Popover, null, /*#__PURE__*/React__default.createElement(ConditionalWrapper, {
+  }, showingText || 'Tampilkan:'), /*#__PURE__*/React__default.createElement(Popover, null, /*#__PURE__*/React__default.createElement(ConditionalWrapper, {
     condition: !isMobilePagination,
     wrapper: child => /*#__PURE__*/React__default.createElement(PopoverTrigger, null, child)
   }, /*#__PURE__*/React__default.createElement(LimitContainer, {
@@ -24806,17 +24822,17 @@ function PaginationInfo(_ref) {
   }, limit.toString())))))), /*#__PURE__*/React__default.createElement(Text$1, {
     color: "secondary",
     variant: "label"
-  }, t('showingCountText', `Ditampilkan ${(currentPage - 1) * selectedLimit + 1} - ${selectedLimit * currentPage < totalData ? selectedLimit * currentPage : totalData} dari ${totalData} data`, {
-    start: (currentPage - 1) * selectedLimit + 1,
-    end: selectedLimit * currentPage < totalData ? selectedLimit * currentPage : totalData,
-    totalData
-  }))), /*#__PURE__*/React__default.createElement(ModalDialog, null, /*#__PURE__*/React__default.createElement(ModalDialogTrigger, {
+  }, typeof showingCountText === 'function' ? showingCountText({
+    from,
+    to,
+    total: totalData
+  }) : showingCountText || `Ditampilkan ${from} - ${to} dari ${totalData} data`)), /*#__PURE__*/React__default.createElement(ModalDialog, null, /*#__PURE__*/React__default.createElement(ModalDialogTrigger, {
     style: {
       display: 'none'
     }
   }, /*#__PURE__*/React__default.createElement("div", {
     ref: dialogLimitRef
-  })), /*#__PURE__*/React__default.createElement(ModalDialogTitle, null, t('dialogShowingText', 'Tampilkan Data')), /*#__PURE__*/React__default.createElement(ModalDialogContent, {
+  })), /*#__PURE__*/React__default.createElement(ModalDialogTitle, null, dialogShowingText || 'Tampilkan Data'), /*#__PURE__*/React__default.createElement(ModalDialogContent, {
     style: {
       padding: 0
     }
@@ -24844,7 +24860,7 @@ function PaginationInfo(_ref) {
   }, limit.toString()))))));
 }
 
-const _excluded$3 = ["limit", "currentPage", "totalData", "totalPage", "hideDataInfo", "onLimitChange", "onPageChange", "rowsPerPageOptions", "hidePagination", "hideInputPageSection"];
+const _excluded$3 = ["limit", "currentPage", "totalData", "totalPage", "hideDataInfo", "onLimitChange", "onPageChange", "rowsPerPageOptions", "hidePagination", "hideInputPageSection", "showingText", "showingCountText", "dialogShowingText", "previousButton", "nextButton", "gotoPageText", "goToPagePlaceholder", "btnCancelText", "btnSubmitText"];
 function Pagination(_ref) {
   let {
       limit,
@@ -24856,7 +24872,16 @@ function Pagination(_ref) {
       onPageChange,
       rowsPerPageOptions,
       hidePagination,
-      hideInputPageSection
+      hideInputPageSection,
+      showingText,
+      showingCountText,
+      dialogShowingText,
+      previousButton,
+      nextButton,
+      gotoPageText,
+      goToPagePlaceholder,
+      btnCancelText,
+      btnSubmitText
     } = _ref,
     props = _objectWithoutPropertiesLoose(_ref, _excluded$3);
   const totalPages = totalPage || Math.ceil(totalData / limit);
@@ -24871,12 +24896,21 @@ function Pagination(_ref) {
     selectedLimit: limit,
     currentPage: currentPage,
     totalData: totalData,
-    onChange: onLimitChange
+    onChange: onLimitChange,
+    showingText: showingText,
+    showingCountText: showingCountText,
+    dialogShowingText: dialogShowingText
   }) : /*#__PURE__*/React__default.createElement(Box, null), !hidePagination && /*#__PURE__*/React__default.createElement(PaginationButton, {
     currentPage: currentPage,
     totalPages: totalPages,
     onSelect: onPageChange,
-    hideInputPageSection: hideInputPageSection
+    hideInputPageSection: hideInputPageSection,
+    previousButton: previousButton,
+    nextButton: nextButton,
+    gotoPageText: gotoPageText,
+    goToPagePlaceholder: goToPagePlaceholder,
+    btnCancelText: btnCancelText,
+    btnSubmitText: btnSubmitText
   }));
 }
 Pagination.propTypes = {
@@ -24888,7 +24922,25 @@ Pagination.propTypes = {
   onLimitChange: PropTypes.func,
   onPageChange: PropTypes.func,
   hidePagination: PropTypes.bool,
-  hideInputPageSection: PropTypes.bool
+  hideInputPageSection: PropTypes.bool,
+  /** Label for "Show:" text in pagination info */
+  showingText: PropTypes.string,
+  /** Label for the "Showing X - Y of Z data" text. Can be a string or a function ({ from, to, total }) => string */
+  showingCountText: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),
+  /** Title for the mobile limit selection dialog */
+  dialogShowingText: PropTypes.string,
+  /** Label for previous page button */
+  previousButton: PropTypes.string,
+  /** Label for next page button */
+  nextButton: PropTypes.string,
+  /** Label for "Go to page" text and dialog title */
+  gotoPageText: PropTypes.string,
+  /** Placeholder for go to page input */
+  goToPagePlaceholder: PropTypes.string,
+  /** Label for cancel button in go-to-page dialog */
+  btnCancelText: PropTypes.string,
+  /** Label for submit button in go-to-page dialog */
+  btnSubmitText: PropTypes.string
 };
 Pagination.displayName = 'Pagination';
 
@@ -27853,7 +27905,7 @@ const StyledTitle = styled(ADialog.Title, {
   fontSize: 17,
   fontWeight: 500
 });
-const StyledDescription$1 = styled(ADialog.Description, {
+const StyledDescription$1 = styled('div', {
   mx: 24,
   my: 20,
   color: colors$7.gray900,
@@ -30586,7 +30638,6 @@ const IconStateFull = _ref => {
   })));
 };
 const Upload = ({
-  placeholder,
   listType,
   multiple,
   fileList,
@@ -30626,11 +30677,12 @@ const Upload = ({
   customPreviewIcon,
   onPreviewIconClick,
   maxWidthOrHeight,
-  theme
+  theme,
+  uploadingLabel,
+  placeholder,
+  cancelLabel,
+  saveLabel
 }) => {
-  const {
-    t
-  } = useTranslation(['MajooUI/upload', 'translation']);
   const isFile = listType === 'file';
   const imgRef = useRef(null);
   const indexReplace = useRef(null);
@@ -31076,7 +31128,7 @@ const Upload = ({
       type: "button",
       onClick: () => handleReplace(index),
       buttonType: "ghost"
-    }, replaceLabel && replaceLabel.length > 0 ? replaceLabel : t('replaceLabel', 'Ubah Berkas')));
+    }, replaceLabel || 'Ubah Berkas'));
   }
   const renderPicture = () => {
     return fileList == null ? void 0 : fileList.map((item, index) => {
@@ -31219,7 +31271,7 @@ const Upload = ({
       onCompleted: () => setTimeout(() => setIsLoading(false), 1000)
     }), /*#__PURE__*/React__default.createElement(Text, {
       hidden: !progress
-    }, `${progress <= 100 ? progress : 100}%`), /*#__PURE__*/React__default.createElement(Text, null, t('uploadingLabel', 'Berkas sedang diunggah'))));
+    }, `${progress <= 100 ? progress : 100}%`), /*#__PURE__*/React__default.createElement(Text, null, uploadingLabel || 'Berkas sedang diunggah')));
   }
   function renderUpload() {
     return /*#__PURE__*/React__default.createElement(FocusArea, {
@@ -31244,7 +31296,7 @@ const Upload = ({
       css: {
         margin: '$spacing-04 $spacing-05 0 $spacing-05'
       }
-    }, placeholder != null ? placeholder : t('uploadPlaceholder', 'Pilih atau letakkan berkas di sini'))))), error && /*#__PURE__*/React__default.createElement(ErrorMessage, {
+    }, placeholder || 'Pilih atau letakkan berkas di sini')))), error && /*#__PURE__*/React__default.createElement(ErrorMessage, {
       css: {
         width: width - 5
       }
@@ -31271,7 +31323,7 @@ const Upload = ({
         width: 300,
         whiteSpace: 'nowrap'
       }
-    }, cropperTitle || t('cropperTitle', 'Potong Gambar')), /*#__PURE__*/React__default.createElement(ModalDialogContent, {
+    }, cropperTitle || 'Potong Gambar'), /*#__PURE__*/React__default.createElement(ModalDialogContent, {
       css: {
         padding: '$spacing-03 $spacing-07',
         overflowY: 'auto',
@@ -31310,13 +31362,9 @@ const Upload = ({
     }, /*#__PURE__*/React__default.createElement(Button$4, {
       buttonType: "secondary",
       onClick: toggleModal
-    }, t('label.cancel', 'Batal', {
-      ns: 'translation'
-    })), /*#__PURE__*/React__default.createElement(Button$4, {
+    }, cancelLabel || 'Batal'), /*#__PURE__*/React__default.createElement(Button$4, {
       onClick: handleCrop
-    }, t('save', 'Simpan', {
-      ns: 'translation'
-    }))))));
+    }, saveLabel || 'Simpan')))));
   }
   return /*#__PURE__*/React__default.createElement(Flex$1, {
     direction: "row",
@@ -31351,10 +31399,6 @@ Upload.defaultProps = {
   maxWidthOrHeight: 1024
 };
 Upload.propTypes = {
-  /**
-   Placeholder label of upload.
-  */
-  placeholder: PropTypes.string,
   /**
    Disabled state of upload.
   */
@@ -31505,7 +31549,23 @@ Upload.propTypes = {
   /**
    Set max width or height of image
    */
-  maxWidthOrHeight: PropTypes.number
+  maxWidthOrHeight: PropTypes.number,
+  /**
+   Label for the uploading state text.
+   */
+  uploadingLabel: PropTypes.string,
+  /**
+   Label for the upload area placeholder.
+   */
+  placeholder: PropTypes.string,
+  /**
+   Label for the cancel button in the cropper dialog.
+   */
+  cancelLabel: PropTypes.string,
+  /**
+   Label for the save button in the cropper dialog.
+   */
+  saveLabel: PropTypes.string
 };
 Upload.displayName = 'Upload';
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@majoo-ui/react",
-  "version": "1.62.5",
+  "version": "1.62.6",
   "main": "./index.esm.js",
   "exports": {
     ".": {