refactor: reorganize Notification props and simplify CSS structure

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Author: zombieJ

assets/geek.less

@@ -4,19 +4,17 @@
 @notificationMotionOffset: 64px;
 
 .@{notificationPrefixCls} {
-  &-list {
-    position: fixed;
-    top: 0;
-    right: 0;
-    z-index: 1000;
-    width: 360px;
-    height: 100vh;
-    padding: 24px;
-    box-sizing: border-box;
-    pointer-events: none;
-    overflow: hidden;
-    overscroll-behavior: contain;
-  }
+  position: fixed;
+  top: 0;
+  right: 0;
+  z-index: 1000;
+  width: 360px;
+  height: 100vh;
+  padding: 24px;
+  box-sizing: border-box;
+  pointer-events: none;
+  overflow: hidden;
+  overscroll-behavior: contain;
 
   &-list-content {
     position: relative;

src/Notification.tsx

@@ -21,49 +21,61 @@ export interface NotificationStyles {
 }
 
 export interface NotificationProps {
+  // Style
   prefixCls?: string;
+  className?: string;
+  style?: React.CSSProperties;
+  classNames?: NotificationClassNames;
+  styles?: NotificationStyles;
+
+  // UI
   content?: React.ReactNode;
   actions?: React.ReactNode;
   close?: React.ReactNode;
   closable?:
     | boolean
     | ({ closeIcon?: React.ReactNode; onClose?: VoidFunction } & React.AriaAttributes);
-  duration?: number | false | null;
-  showProgress?: boolean;
-  times?: number;
-  hovering?: boolean;
   offset?: {
     x: number;
     y: number;
   };
+
+  // Behavior
+  duration?: number | false | null;
+  showProgress?: boolean;
+  times?: number;
+  hovering?: boolean;
   pauseOnHover?: boolean;
-  className?: string;
-  style?: React.CSSProperties;
-  classNames?: NotificationClassNames;
-  styles?: NotificationStyles;
-  props?: React.HTMLAttributes<HTMLDivElement> & Record<string, any>;
+
+  // Function
   onClick?: React.MouseEventHandler<HTMLDivElement>;
   onClose?: () => void;
   onCloseInternal?: VoidFunction;
 }
 
 const Notification = React.forwardRef<HTMLDivElement, NotificationProps>((props, ref) => {
   const {
+    // Style
     prefixCls = 'rc-notification',
+    className,
+    style,
+    classNames,
+    styles,
+
+    // UI
     content,
     actions,
     close,
     closable,
+    offset,
+
+    // Behavior
     duration = 4.5,
     showProgress,
     hovering: forcedHovering,
-    offset,
     pauseOnHover = true,
-    className,
-    style,
-    classNames,
-    styles,
-    props: divProps,
+
+    // Function
     onClick,
     onClose,
     onCloseInternal,
@@ -121,8 +133,9 @@ const Notification = React.forwardRef<HTMLDivElement, NotificationProps>((props,
   // ========================= Render =========================
   return (
     <div
-      {...divProps}
+      {...rootProps}
       ref={ref}
+      // Styles
       className={clsx(noticePrefixCls, className, classNames?.root, {
         [`${noticePrefixCls}-closable`]: mergedClosable,
       })}
@@ -136,20 +149,21 @@ const Notification = React.forwardRef<HTMLDivElement, NotificationProps>((props,
           : null),
         ...style,
       }}
+      // Events
       onClick={onClick}
       onMouseEnter={(event) => {
         setHovering(true);
         if (pauseOnHover) {
           onPause();
         }
-        divProps?.onMouseEnter?.(event);
+        rootProps?.onMouseEnter?.(event);
       }}
       onMouseLeave={(event) => {
         setHovering(false);
         if (pauseOnHover && !forcedHovering) {
           onResume();
         }
-        divProps?.onMouseLeave?.(event);
+        rootProps?.onMouseLeave?.(event);
       }}
     >
       <div

src/NotificationList.tsx

@@ -119,18 +119,10 @@ const NotificationList: React.FC<NotificationListProps> = (props) => {
 
   return (
     <div
-      className={clsx(
-        prefixCls,
-        `${prefixCls}-${placement}`,
-        listPrefixCls,
-        `${listPrefixCls}-${placement}`,
-        contextClassNames?.list,
-        className,
-        {
-          [`${prefixCls}-stack`]: stackEnabled,
-          [`${prefixCls}-stack-expanded`]: expanded,
-        },
-      )}
+      className={clsx(prefixCls, `${prefixCls}-${placement}`, contextClassNames?.list, className, {
+        [`${prefixCls}-stack`]: stackEnabled,
+        [`${prefixCls}-stack-expanded`]: expanded,
+      })}
       onWheel={onWheel}
       onMouseEnter={() => {
         setListHovering(true);