Add closeTypes('manual', 'auto') for onClose to distinguish between manual-close by click and auto-close by duration timer.

package.json

@@ -53,7 +53,7 @@
     "@types/enzyme": "^3.10.7",
     "@types/jest": "^26.0.4",
     "@types/react": "^16.9.34",
-    "@types/react-dom": "^16.9.7",
+    "@types/react-dom": "^17.0.2",
     "cross-env": "^7.0.0",
     "dumi": "^1.1.7",
     "enzyme": "^3.3.0",

src/Notice.tsx

@@ -8,6 +8,8 @@ interface DivProps extends React.HTMLProps<HTMLDivElement> {
   'data-testid'?: string;
 }
 
+export type CloseTypes = 'manual' | 'auto'
+
 export interface NoticeProps {
   prefixCls: string;
   style?: React.CSSProperties;
@@ -21,7 +23,7 @@ export interface NoticeProps {
   closable?: boolean;
   props?: DivProps;
   onClick?: React.MouseEventHandler<HTMLDivElement>;
-  onClose?: (key: React.Key) => void;
+  onClose?: (key: React.Key, closeType: CloseTypes) => void;
 
   /** @private Only for internal usage. We don't promise that we will refactor this */
   holder?: HTMLDivElement;
@@ -52,21 +54,30 @@ export default class Notice extends Component<NoticeProps> {
     this.clearCloseTimer();
   }
 
+  onCloseHandler = (closeType: CloseTypes) => {
+    const { onClose, noticeKey } = this.props;
+    if (onClose) {
+      onClose(noticeKey, closeType);
+    }
+  }
+
   close = (e?: React.MouseEvent<HTMLAnchorElement>) => {
     if (e) {
       e.stopPropagation();
     }
     this.clearCloseTimer();
-    const { onClose, noticeKey } = this.props;
-    if (onClose) {
-      onClose(noticeKey);
-    }
+    this.onCloseHandler('manual');
   };
 
+  autoClose = () => {
+    this.clearCloseTimer();
+    this.onCloseHandler('auto');
+  }
+
   startCloseTimer = () => {
     if (this.props.duration) {
       this.closeTimer = window.setTimeout(() => {
-        this.close();
+        this.autoClose();
       }, this.props.duration * 1000);
     }
   };

src/Notification.tsx

@@ -4,7 +4,7 @@ import type { ReactText } from 'react';
 import ReactDOM from 'react-dom';
 import classNames from 'classnames';
 import { CSSMotionList } from 'rc-motion';
-import type { NoticeProps } from './Notice';
+import type { NoticeProps, CloseTypes } from './Notice';
 import Notice from './Notice';
 import useNotification from './useNotification';
 
@@ -23,7 +23,7 @@ export interface NoticeContent
   key?: React.Key;
   updateMark?: string;
   content?: React.ReactNode;
-  onClose?: () => void;
+  onClose?: (closeType: CloseTypes) => void;
 }
 
 export type NoticeFunc = (noticeProps: NoticeContent) => void;
@@ -168,9 +168,9 @@ class Notification extends Component<NotificationProps, NotificationState> {
         key,
         noticeKey: userPassKey || key,
         updateMark,
-        onClose: (noticeKey: React.Key) => {
+        onClose: (noticeKey: React.Key, closeType: CloseTypes) => {
           this.remove(noticeKey);
-          notice.onClose?.();
+          notice.onClose?.(closeType);
         },
         onClick: notice.onClick,
         children: notice.content,