rsuite 6.1.2 → 6.2.0

package/cjs/Tree/hooks/useVirtualizedTreeData.js

@@ -40,14 +40,14 @@ function useVirtualizedTreeData(nodes, data, options) {
     } = options;
     return (0, _flattenTree.UNSAFE_flattenTree)(data, childrenKey, node => {
       let formatted = {};
-      const curNode = nodes === null || nodes === void 0 ? void 0 : nodes[node.refKey];
+      const curNode = nodes?.[node.refKey];
       const parentKeys = (0, _getNodeParentKeys.getNodeParentKeys)(nodes, curNode, valueKey);
       /**
        * When using virtualized,
        * if the parent node is collapsed, the child nodes should be hidden
        * avoid component height calculation errors
        */
-      let visible = curNode !== null && curNode !== void 0 && curNode.parent ? shouldShowNodeByParentExpanded(expandItemValues, parentKeys) : true;
+      let visible = curNode?.parent ? shouldShowNodeByParentExpanded(expandItemValues, parentKeys) : true;
 
       /**
        * when searching, every node default expand

package/cjs/Tree/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseBoxProps } from '../internals/Box';
 import type { ListProps } from '../internals/Windowing';
 import type { TreeNode } from '../internals/Tree/types';
@@ -6,8 +5,8 @@ import type { TreeNode } from '../internals/Tree/types';
  * Tree Node Drag Type
  */
 export declare enum TREE_NODE_DROP_POSITION {
-    DRAG_OVER = 0,
-    DRAG_OVER_TOP = 1,
+    DRAG_OVER = 0,// drag node in tree node
+    DRAG_OVER_TOP = 1,// drag node on tree node
     DRAG_OVER_BOTTOM = 2
 }
 export interface DropData<T> {

package/cjs/Tree/utils/flattenTree.d.ts

@@ -2,7 +2,7 @@
  * Strategy for walking the tree.
  */
 export declare enum WalkTreeStrategy {
-    DFS = 0,
+    DFS = 0,// Depth-first search
     BFS = 1
 }
 /**

package/cjs/Tree/utils/focusableTree.js

@@ -70,9 +70,8 @@ const getActiveItem = (focusItemValue, flattenedNodes, valueKey) => {
  */
 exports.getActiveItem = getActiveItem;
 const focusTreeNode = (refKey, treeNodeRefs) => {
-  var _treeItem$focus;
   const treeItem = treeNodeRefs[refKey];
-  treeItem === null || treeItem === void 0 || (_treeItem$focus = treeItem.focus) === null || _treeItem$focus === void 0 || _treeItem$focus.call(treeItem);
+  treeItem?.focus?.();
 };
 exports.focusTreeNode = focusTreeNode;
 /**
@@ -176,9 +175,8 @@ function scrollToActiveTreeNode(props) {
     formattedNodes
   } = props;
   if (virtualized && value) {
-    var _list$scrollToItem;
     const scrollIndex = getScrollToIndex(formattedNodes, value, valueKey);
-    list === null || list === void 0 || (_list$scrollToItem = list.scrollToItem) === null || _list$scrollToItem === void 0 || _list$scrollToItem.call(list, scrollIndex);
+    list?.scrollToItem?.(scrollIndex);
   }
 }
 const focusCurrentItem = props => {
@@ -186,11 +184,10 @@ const focusCurrentItem = props => {
     selector = SELECTED_TREEITEM_SELECTOR,
     container
   } = props;
-  const activeItem = container === null || container === void 0 ? void 0 : container.querySelector(selector);
+  const activeItem = container?.querySelector(selector);
   if (activeItem) {
-    var _activeItem$focus, _activeItem$dataset;
-    activeItem === null || activeItem === void 0 || (_activeItem$focus = activeItem.focus) === null || _activeItem$focus === void 0 || _activeItem$focus.call(activeItem);
-    return (_activeItem$dataset = activeItem.dataset) === null || _activeItem$dataset === void 0 ? void 0 : _activeItem$dataset.key;
+    activeItem?.focus?.();
+    return activeItem.dataset?.key;
   }
 };
 exports.focusCurrentItem = focusCurrentItem;

package/cjs/Tree/utils/getNodeParentKeys.js

@@ -9,11 +9,9 @@ exports.getNodeParentKeys = getNodeParentKeys;
 function getNodeParentKeys(nodes, node, valueKey) {
   const parentKeys = [];
   const traverse = node => {
-    var _node$parent;
-    if (node !== null && node !== void 0 && (_node$parent = node.parent) !== null && _node$parent !== void 0 && _node$parent.refKey) {
-      var _node$parent2;
+    if (node?.parent?.refKey) {
       traverse(nodes[node.parent.refKey]);
-      parentKeys.push(node === null || node === void 0 || (_node$parent2 = node.parent) === null || _node$parent2 === void 0 ? void 0 : _node$parent2[valueKey]);
+      parentKeys.push(node?.parent?.[valueKey]);
     }
   };
   traverse(node);

package/cjs/Tree/utils/hasVisibleChildren.d.ts

@@ -2,4 +2,4 @@ import type { TreeNode } from '../../internals/Tree/types';
 /**
  * Checks if a node has visible children.
  */
-export declare function hasVisibleChildren(node: TreeNode, childrenKey: string): any;
+export declare function hasVisibleChildren(node: TreeNode, childrenKey: string): boolean;

package/cjs/Tree/utils/treeKeyboardInteractions.js

@@ -22,8 +22,8 @@ function handleLeftArrow(props) {
     return;
   }
   if (expand) {
-    onExpand === null || onExpand === void 0 || onExpand(focusItem, expand);
-  } else if (focusItem !== null && focusItem !== void 0 && focusItem.parent) {
+    onExpand?.(focusItem, expand);
+  } else if (focusItem?.parent) {
     onFocusItem();
   }
 }
@@ -46,7 +46,7 @@ function handleRightArrow(props) {
     return;
   }
   if (!expand) {
-    onExpand === null || onExpand === void 0 || onExpand(focusItem, expand);
+    onExpand?.(focusItem, expand);
   } else {
     onFocusItem();
   }

package/cjs/TreePicker/TreePicker.js

@@ -141,8 +141,7 @@ const TreePicker = (0, _utils.forwardRef)((props, ref) => {
     onEntered
   });
   const handleSelect = (0, _hooks.useEventCallback)((treeNode, value, event) => {
-    var _target$current, _trigger$current, _trigger$current$clos;
-    onSelect === null || onSelect === void 0 || onSelect(treeNode, value, event);
+    onSelect?.(treeNode, value, event);
 
     // Only leaf nodes can update the value and close the picker.
     if (onlyLeafSelectable && !(0, _utils3.isLeafNode)(treeNode)) {
@@ -150,8 +149,8 @@ const TreePicker = (0, _utils.forwardRef)((props, ref) => {
     }
     setFocusItemValue(value);
     handleChange(value, event);
-    (_target$current = target.current) === null || _target$current === void 0 || _target$current.focus();
-    (_trigger$current = trigger.current) === null || _trigger$current === void 0 || (_trigger$current$clos = _trigger$current.close) === null || _trigger$current$clos === void 0 || _trigger$current$clos.call(_trigger$current);
+    target.current?.focus();
+    trigger.current?.close?.();
   });
   const handleClean = (0, _hooks.useEventCallback)(event => {
     const target = event.target;
@@ -160,7 +159,7 @@ const TreePicker = (0, _utils.forwardRef)((props, ref) => {
       return;
     }
     setValue(null);
-    onChange === null || onChange === void 0 || onChange(null, event);
+    onChange?.(null, event);
   });
   const handleTreePressEnter = (0, _hooks.useEventCallback)(event => {
     if ((0, _isNil.default)(focusItemValue)) {
@@ -189,7 +188,7 @@ const TreePicker = (0, _utils.forwardRef)((props, ref) => {
   });
   const handleChange = (0, _hooks.useEventCallback)((nextValue, event) => {
     setValue(nextValue);
-    onChange === null || onChange === void 0 || onChange(nextValue, event);
+    onChange?.(nextValue, event);
   });
   const treeContext = (0, _react.useMemo)(() => ({
     register,
@@ -239,7 +238,7 @@ const TreePicker = (0, _utils.forwardRef)((props, ref) => {
       ref: (0, _utils.mergeRefs)(overlay, speakerRef),
       onKeyDown: onPickerKeydown,
       target: trigger
-    }, renderTree ? renderTree(tree) : tree, renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter());
+    }, renderTree ? renderTree(tree) : tree, renderExtraFooter?.());
   };
 
   /**
@@ -249,7 +248,7 @@ const TreePicker = (0, _utils.forwardRef)((props, ref) => {
   let hasValidValue = !(0, _isNil.default)(activeNode) || !(0, _isNil.default)(value) && (0, _isFunction.default)(renderValue);
   let selectedElement = placeholder;
   if (hasValidValue) {
-    const node = activeNode !== null && activeNode !== void 0 ? activeNode : {};
+    const node = activeNode ?? {};
     selectedElement = node[labelKey];
     if ((0, _isFunction.default)(renderValue) && value) {
       selectedElement = renderValue(value, node, selectedElement);
@@ -290,7 +289,7 @@ const TreePicker = (0, _utils.forwardRef)((props, ref) => {
     placement: placement,
     inputValue: value,
     focusItemValue: focusItemValue
-  }, rest), selectedElement || (locale === null || locale === void 0 ? void 0 : locale.placeholder)));
+  }, rest), selectedElement || locale?.placeholder));
 });
 TreePicker.displayName = 'TreePicker';
 var _default = exports.default = TreePicker;

package/cjs/TreePicker/hooks/useFocusState.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 interface FocusStateProps {
     target: React.RefObject<HTMLElement | null>;
     value?: number | string | null | undefined;

package/cjs/TreePicker/hooks/useFocusState.js

@@ -14,27 +14,23 @@ function useFocusState(props) {
   const [active, setActive] = (0, _react.useState)(false);
   const [focusItemValue, setFocusItemValue] = (0, _react.useState)(null);
   const focusTarget = (0, _hooks.useEventCallback)(() => {
-    var _target$current;
-    (_target$current = target.current) === null || _target$current === void 0 || _target$current.focus();
+    target.current?.focus();
   });
   const onEnter = (0, _hooks.useEventCallback)(node => {
-    var _props$onEnter;
     setActive(true);
-    (_props$onEnter = props.onEnter) === null || _props$onEnter === void 0 || _props$onEnter.call(props, node);
+    props.onEnter?.(node);
   });
   const onExit = (0, _hooks.useEventCallback)(node => {
-    var _props$onExit;
     setActive(false);
     focusTarget();
-    (_props$onExit = props.onExit) === null || _props$onExit === void 0 || _props$onExit.call(props, node);
+    props.onExit?.(node);
   });
   const onEntered = (0, _hooks.useEventCallback)(node => {
-    var _props$onEntered;
     if (value) {
       setFocusItemValue(value);
       focusActiveNode();
     }
-    (_props$onEntered = props.onEntered) === null || _props$onEntered === void 0 || _props$onEntered.call(props, node);
+    props.onEntered?.(node);
   });
   return {
     active,

package/cjs/Uploader/UploadFileItem.js

@@ -70,13 +70,12 @@ const UploadFileItem = (0, _utils.forwardRef)((props, ref) => {
    * Get thumbnail of image file
    */
   const getThumbnail = (0, _react.useCallback)(callback => {
-    var _file$blobFile;
     if (!~['picture-text', 'picture'].indexOf(listType)) {
       return;
     }
 
     // The thumbnail file size cannot be larger than the preset value.
-    if (!file.blobFile || (file === null || file === void 0 || (_file$blobFile = file.blobFile) === null || _file$blobFile === void 0 ? void 0 : _file$blobFile.size) > maxPreviewFileSize) {
+    if (!file.blobFile || file?.blobFile?.size > maxPreviewFileSize) {
       return;
     }
     (0, _previewFile.previewFile)(file.blobFile, callback);
@@ -92,19 +91,19 @@ const UploadFileItem = (0, _utils.forwardRef)((props, ref) => {
     if (disabled) {
       return;
     }
-    onPreview === null || onPreview === void 0 || onPreview(file, event);
+    onPreview?.(file, event);
   }, [disabled, file, onPreview]);
   const handleRemove = (0, _react.useCallback)(event => {
     if (disabled) {
       return;
     }
-    onCancel === null || onCancel === void 0 || onCancel(file.fileKey, event);
+    onCancel?.(file.fileKey, event);
   }, [disabled, file.fileKey, onCancel]);
   const handleReupload = (0, _react.useCallback)(event => {
     if (disabled) {
       return;
     }
-    onReupload === null || onReupload === void 0 || onReupload(file, event);
+    onReupload?.(file, event);
   }, [disabled, file, onReupload]);
 
   /**
@@ -180,8 +179,8 @@ const UploadFileItem = (0, _utils.forwardRef)((props, ref) => {
       return null;
     }
     let closeLabel = 'Remove file';
-    if (locale !== null && locale !== void 0 && locale.removeFile) {
-      closeLabel = (locale === null || locale === void 0 ? void 0 : locale.removeFile) + (file !== null && file !== void 0 && file.name ? `: ${file === null || file === void 0 ? void 0 : file.name}` : '');
+    if (locale?.removeFile) {
+      closeLabel = locale?.removeFile + (file?.name ? `: ${file?.name}` : '');
     }
     return /*#__PURE__*/_react.default.createElement(_CloseButton.default, {
       className: prefix('btn-remove'),
@@ -201,7 +200,7 @@ const UploadFileItem = (0, _utils.forwardRef)((props, ref) => {
     if (file.status === 'error') {
       return /*#__PURE__*/_react.default.createElement("div", {
         className: prefix('status')
-      }, /*#__PURE__*/_react.default.createElement("span", null, locale === null || locale === void 0 ? void 0 : locale.error), allowReupload && /*#__PURE__*/_react.default.createElement("a", {
+      }, /*#__PURE__*/_react.default.createElement("span", null, locale?.error), allowReupload && /*#__PURE__*/_react.default.createElement("a", {
         role: "button",
         tabIndex: -1,
         onClick: handleReupload,
@@ -218,10 +217,9 @@ const UploadFileItem = (0, _utils.forwardRef)((props, ref) => {
    */
   const renderFileSize = () => {
     if (file.status !== 'error' && file.blobFile) {
-      var _file$blobFile2;
       return /*#__PURE__*/_react.default.createElement("span", {
         className: prefix('size')
-      }, formatSize(file === null || file === void 0 || (_file$blobFile2 = file.blobFile) === null || _file$blobFile2 === void 0 ? void 0 : _file$blobFile2.size));
+      }, formatSize(file?.blobFile?.size));
     }
     return null;
   };

package/cjs/Uploader/UploadTrigger.js

@@ -11,7 +11,6 @@ var _utils = require("../internals/utils");
 var _classnames = _interopRequireDefault(require("classnames"));
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 const UploadTrigger = (0, _utils.forwardRef)((props, ref) => {
-  var _children$props;
   const {
     as: Component = _Button.default,
     name,
@@ -43,8 +42,7 @@ const UploadTrigger = (0, _utils.forwardRef)((props, ref) => {
     'drag-over': dragOver
   }));
   const handleClick = (0, _hooks.useEventCallback)(() => {
-    var _inputRef$current;
-    (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 || _inputRef$current.click();
+    inputRef.current?.click();
   });
   const handleClearInput = (0, _hooks.useEventCallback)(() => {
     if (inputRef.current) {
@@ -56,26 +54,26 @@ const UploadTrigger = (0, _utils.forwardRef)((props, ref) => {
       event.preventDefault();
       setDragOver(true);
     }
-    onDragEnter === null || onDragEnter === void 0 || onDragEnter(event);
+    onDragEnter?.(event);
   });
   const handleDragLeave = (0, _hooks.useEventCallback)(event => {
     if (draggable) {
       event.preventDefault();
       setDragOver(false);
     }
-    onDragLeave === null || onDragLeave === void 0 || onDragLeave(event);
+    onDragLeave?.(event);
   });
   const handleDragOver = (0, _hooks.useEventCallback)(event => {
     draggable && event.preventDefault();
-    onDragOver === null || onDragOver === void 0 || onDragOver(event);
+    onDragOver?.(event);
   });
   const handleDrop = (0, _hooks.useEventCallback)(event => {
     if (draggable) {
       event.preventDefault();
       setDragOver(false);
-      onChange === null || onChange === void 0 || onChange(event);
+      onChange?.(event);
     }
-    onDrop === null || onDrop === void 0 || onDrop(event);
+    onDrop?.(event);
   });
   (0, _react.useImperativeHandle)(ref, () => ({
     root: rootRef.current,
@@ -98,8 +96,8 @@ const UploadTrigger = (0, _utils.forwardRef)((props, ref) => {
   };
   const trigger = children ? (/*#__PURE__*/_react.default.cloneElement(children, {
     ...buttonProps,
-    className: (0, _classnames.default)((_children$props = children.props) === null || _children$props === void 0 ? void 0 : _children$props.className, prefix('btn'))
-  })) : /*#__PURE__*/_react.default.createElement(Component, buttonProps, locale === null || locale === void 0 ? void 0 : locale.upload);
+    className: (0, _classnames.default)(children.props?.className, prefix('btn'))
+  })) : /*#__PURE__*/_react.default.createElement(Component, buttonProps, locale?.upload);
   return /*#__PURE__*/_react.default.createElement("div", {
     ref: rootRef,
     className: classes,

package/cjs/Uploader/Uploader.d.ts

@@ -99,6 +99,8 @@ export interface UploaderProps extends BaseBoxProps, Omit<UploadTriggerProps, 'o
     onProgress?: (percent: number, file: FileType, event: ProgressEvent, xhr: XMLHttpRequest) => void;
     /** In the file list, click the callback function to delete a file */
     onRemove?: (file: FileType) => void;
+    /** Callback function called when all files in the current upload batch have finished (succeeded or failed) */
+    onCompletion?: (completedFiles: FileType[], failedFiles: FileType[]) => void;
     /** Custom render file information */
     renderFileInfo?: (file: FileType, fileElement: React.ReactNode) => React.ReactNode;
     /** Custom render thumbnail */

package/cjs/Uploader/Uploader.js

@@ -18,9 +18,8 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
 // Define several states of the file during the upload process.
 
 const getFiles = event => {
-  if (typeof (event === null || event === void 0 ? void 0 : event['dataTransfer']) === 'object') {
-    var _event$dataTransfer;
-    return event === null || event === void 0 || (_event$dataTransfer = event['dataTransfer']) === null || _event$dataTransfer === void 0 ? void 0 : _event$dataTransfer.files;
+  if (typeof event?.['dataTransfer'] === 'object') {
+    return event?.['dataTransfer']?.files;
   }
   if (event.target) {
     return event.target['files'];
@@ -38,7 +37,6 @@ const createFile = file => {
   };
 };
 function fileListReducer(files, action) {
-  var _action$files;
   switch (action.type) {
     // Add one or more files
     case 'push':
@@ -56,10 +54,10 @@ function fileListReducer(files, action) {
 
     // Initialization file list
     case 'init':
-      return ((_action$files = action.files) === null || _action$files === void 0 ? void 0 : _action$files.map(file => {
+      return action.files?.map(file => {
         // The state of the file needs to be preserved when the `fileList` is controlled.
         return files.find(f => f.fileKey === file.fileKey) || createFile(file);
-      })) || [];
+      }) || [];
     default:
       throw new Error();
   }
@@ -70,8 +68,7 @@ const useFileList = (defaultFileList = []) => {
   const [fileList, dispatch] = (0, _react.useReducer)(fileListReducer, fileListRef.current);
   fileListRef.current = fileList;
   (0, _react.useEffect)(() => {
-    var _fileListUpdateCallba;
-    (_fileListUpdateCallba = fileListUpdateCallback.current) === null || _fileListUpdateCallba === void 0 || _fileListUpdateCallba.call(fileListUpdateCallback, fileList);
+    fileListUpdateCallback.current?.(fileList);
     fileListUpdateCallback.current = null;
   }, [fileList]);
   (0, _hooks.useWillUnmount)(() => {
@@ -135,6 +132,7 @@ const Uploader = (0, _utils.forwardRef)((props, ref) => {
     onError,
     onProgress,
     onReupload,
+    onCompletion,
     ...rest
   } = propsWithDefaults;
   const {
@@ -146,6 +144,11 @@ const Uploader = (0, _utils.forwardRef)((props, ref) => {
   const rootRef = (0, _react.useRef)(null);
   const xhrs = (0, _react.useRef)({});
   const trigger = (0, _react.useRef)(null);
+  const uploadingCount = (0, _react.useRef)(0);
+  const uploadResults = (0, _react.useRef)({
+    completed: [],
+    failed: []
+  });
   const [fileList, dispatch] = useFileList(fileListProp || defaultFileList);
   (0, _react.useEffect)(() => {
     if (typeof fileListProp !== 'undefined') {
@@ -167,8 +170,7 @@ const Uploader = (0, _utils.forwardRef)((props, ref) => {
    * Clear the value in input.
    */
   const cleanInputValue = (0, _react.useCallback)(() => {
-    var _trigger$current;
-    (_trigger$current = trigger.current) === null || _trigger$current === void 0 || _trigger$current.clearInput();
+    trigger.current?.clearInput();
   }, []);
 
   /**
@@ -185,8 +187,17 @@ const Uploader = (0, _utils.forwardRef)((props, ref) => {
       progress: 100
     };
     updateFileStatus(nextFile);
-    onSuccess === null || onSuccess === void 0 || onSuccess(response, nextFile, event, xhr);
-  }, [onSuccess, updateFileStatus]);
+    onSuccess?.(response, nextFile, event, xhr);
+    uploadingCount.current--;
+    uploadResults.current.completed.push(nextFile);
+    if (uploadingCount.current === 0) {
+      onCompletion?.(uploadResults.current.completed, uploadResults.current.failed);
+      uploadResults.current = {
+        completed: [],
+        failed: []
+      };
+    }
+  }, [onCompletion, onSuccess, updateFileStatus]);
 
   /**
    * Callback for file upload error.
@@ -201,8 +212,17 @@ const Uploader = (0, _utils.forwardRef)((props, ref) => {
       status: 'error'
     };
     updateFileStatus(nextFile);
-    onError === null || onError === void 0 || onError(status, nextFile, event, xhr);
-  }, [onError, updateFileStatus]);
+    onError?.(status, nextFile, event, xhr);
+    uploadingCount.current--;
+    uploadResults.current.failed.push(nextFile);
+    if (uploadingCount.current === 0) {
+      onCompletion?.(uploadResults.current.completed, uploadResults.current.failed);
+      uploadResults.current = {
+        completed: [],
+        failed: []
+      };
+    }
+  }, [onCompletion, onError, updateFileStatus]);
 
   /**
    * Callback for file upload progress update.
@@ -218,7 +238,7 @@ const Uploader = (0, _utils.forwardRef)((props, ref) => {
       progress: percent
     };
     updateFileStatus(nextFile);
-    onProgress === null || onProgress === void 0 || onProgress(percent, nextFile, event, xhr);
+    onProgress?.(percent, nextFile, event, xhr);
   }, [onProgress, updateFileStatus]);
 
   /**
@@ -250,15 +270,25 @@ const Uploader = (0, _utils.forwardRef)((props, ref) => {
     if (file.fileKey) {
       xhrs.current[file.fileKey] = xhr;
     }
-    onUpload === null || onUpload === void 0 || onUpload(file, uploadData, xhr);
+    onUpload?.(file, uploadData, xhr);
   });
   const handleAjaxUpload = (0, _hooks.useEventCallback)(() => {
     fileList.current.forEach(file => {
-      const checkState = shouldUpload === null || shouldUpload === void 0 ? void 0 : shouldUpload(file);
+      const checkState = shouldUpload?.(file);
       if (checkState instanceof Promise) {
+        uploadingCount.current++;
         checkState.then(res => {
           if (res) {
             handleUploadFile(file);
+          } else {
+            uploadingCount.current--;
+            if (uploadingCount.current === 0) {
+              onCompletion?.(uploadResults.current.completed, uploadResults.current.failed);
+              uploadResults.current = {
+                completed: [],
+                failed: []
+              };
+            }
           }
         });
         return;
@@ -266,6 +296,7 @@ const Uploader = (0, _utils.forwardRef)((props, ref) => {
         return;
       }
       if (file.status === 'inited') {
+        uploadingCount.current++;
         handleUploadFile(file);
       }
     });
@@ -283,13 +314,13 @@ const Uploader = (0, _utils.forwardRef)((props, ref) => {
       });
     });
     const nextFileList = [...fileList.current, ...newFileList];
-    const checkState = shouldQueueUpdate === null || shouldQueueUpdate === void 0 ? void 0 : shouldQueueUpdate(nextFileList, newFileList);
+    const checkState = shouldQueueUpdate?.(nextFileList, newFileList);
     if (checkState === false) {
       cleanInputValue();
       return;
     }
     const upload = () => {
-      onChange === null || onChange === void 0 || onChange(nextFileList, event);
+      onChange?.(nextFileList, event);
       if (rootRef.current) {
         dispatch({
           type: 'push',
@@ -308,29 +339,38 @@ const Uploader = (0, _utils.forwardRef)((props, ref) => {
     upload();
   });
   const handleRemoveFile = (0, _hooks.useEventCallback)((fileKey, event) => {
-    var _xhrs$current;
     const file = (0, _find.default)(fileList.current, f => f.fileKey === fileKey);
     const nextFileList = fileList.current.filter(f => f.fileKey !== fileKey);
-    if (((_xhrs$current = xhrs.current) === null || _xhrs$current === void 0 || (_xhrs$current = _xhrs$current[file.fileKey]) === null || _xhrs$current === void 0 ? void 0 : _xhrs$current.readyState) !== 4) {
-      var _xhrs$current$file$fi;
-      (_xhrs$current$file$fi = xhrs.current[file.fileKey]) === null || _xhrs$current$file$fi === void 0 || _xhrs$current$file$fi.abort();
+    if (xhrs.current?.[file.fileKey]?.readyState !== 4) {
+      xhrs.current[file.fileKey]?.abort();
+      uploadingCount.current--;
+      uploadResults.current.failed.push(file);
+      if (uploadingCount.current === 0) {
+        onCompletion?.(uploadResults.current.completed, uploadResults.current.failed);
+        uploadResults.current = {
+          completed: [],
+          failed: []
+        };
+      }
     }
     dispatch({
       type: 'remove',
       fileKey
     });
-    onRemove === null || onRemove === void 0 || onRemove(file);
-    onChange === null || onChange === void 0 || onChange(nextFileList, event);
+    onRemove?.(file);
+    onChange?.(nextFileList, event);
     cleanInputValue();
   });
   const handleReupload = (0, _hooks.useEventCallback)(file => {
+    uploadingCount.current++;
     autoUpload && handleUploadFile(file);
-    onReupload === null || onReupload === void 0 || onReupload(file);
+    onReupload?.(file);
   });
 
   // public API
   const start = (0, _react.useCallback)(file => {
     if (file) {
+      uploadingCount.current++;
       handleUploadFile(file);
       return;
     }

package/cjs/Uploader/utils/ajaxUpload.js

@@ -52,7 +52,7 @@ function ajaxUpload(options) {
   if (timeout) {
     xhr.timeout = timeout;
     xhr.ontimeout = event => {
-      onError === null || onError === void 0 || onError({
+      onError?.({
         type: 'timeout'
       }, event, xhr);
     };
@@ -63,13 +63,13 @@ function ajaxUpload(options) {
   xhr.onload = event => {
     const resp = getResponse(xhr);
     if (xhr.status < 200 || xhr.status >= 300) {
-      onError === null || onError === void 0 || onError({
+      onError?.({
         type: 'server_error',
         response: resp
       }, event, xhr);
       return;
     }
-    onSuccess === null || onSuccess === void 0 || onSuccess(resp, event, xhr);
+    onSuccess?.(resp, event, xhr);
   };
   if (xhr.upload) {
     xhr.upload.onprogress = event => {
@@ -77,11 +77,11 @@ function ajaxUpload(options) {
       if (event.lengthComputable) {
         percent = event.loaded / event.total * 100;
       }
-      onProgress === null || onProgress === void 0 || onProgress(percent, event, xhr);
+      onProgress?.(percent, event, xhr);
     };
   }
   xhr.onerror = event => {
-    onError === null || onError === void 0 || onError({
+    onError?.({
       type: 'xhr_error'
     }, event, xhr);
   };

package/cjs/Uploader/utils/previewFile.js

@@ -8,7 +8,7 @@ exports.previewFile = previewFile;
 // https://developer.mozilla.org/en-US/docs/Web/Media/Formats/Image_types
 const MIME = ['image/apng', 'image/avif', 'image/gif', 'image/jpeg', 'image/png', 'image/svg+xml', 'image/webp'];
 function isImage(file) {
-  return MIME.includes(file === null || file === void 0 ? void 0 : file.type);
+  return MIME.includes(file?.type);
 }
 function previewFile(file, callback) {
   if (!isImage(file)) {