support list semantic styles

Author: zombieJ

src/NotificationList/index.tsx

@@ -24,10 +24,12 @@ export interface NotificationListConfig extends Omit<NotificationProps, 'prefixC
 }
 
 export interface NotificationClassNames extends NoticeClassNames {
+  list?: string;
   listContent?: string;
 }
 
 export interface NotificationStyles extends NoticeStyles {
+  list?: React.CSSProperties;
   listContent?: React.CSSProperties;
 }
 
@@ -239,6 +241,7 @@ const NotificationList: React.FC<NotificationListProps> = (props) => {
         `${prefixCls}-${placement}`,
         contextClassNames?.list,
         className,
+        classNames?.list,
         {
           [`${prefixCls}-stack`]: stackEnabled,
           [`${prefixCls}-stack-expanded`]: expanded,
@@ -251,7 +254,7 @@ const NotificationList: React.FC<NotificationListProps> = (props) => {
       onMouseLeave={() => {
         setListHovering(false);
       }}
-      style={style}
+      style={{ ...styles?.list, ...style }}
     >
       <Content
         listPrefixCls={listPrefixCls}

tests/index.test.tsx

@@ -844,12 +844,16 @@ describe('Notification.Basic', () => {
     expect(document.querySelector('.bamboo-topRight')).toBeTruthy();
   });
 
-  it('should listContent styles and classNames work', () => {
+  it('should list and listContent styles and classNames work', () => {
     const { instance } = renderDemo({
       classNames: {
+        list: 'root-list',
         listContent: 'bamboo',
       },
       styles: {
+        list: {
+          content: 'root-list',
+        },
         listContent: {
           content: 'little',
         },
@@ -860,6 +864,10 @@ describe('Notification.Basic', () => {
       instance.open({});
     });
 
+    expect(document.querySelector('.rc-notification-list')).toHaveStyle({
+      content: 'root-list',
+    });
+    expect(document.querySelector('.rc-notification-list')).toHaveClass('root-list');
     expect(document.querySelector('.rc-notification-list-content')).toHaveStyle({
       content: 'little',
     });