fix: Missing props (#8)

* fix: Missing props

* test: Update test case

Author: zombieJ

src/Item.tsx

@@ -32,6 +32,7 @@ export default function Item<ItemType>(props: ItemProps<ItemType>) {
     display,
     order,
     component: Component,
+    ...restProps
   } = props;
 
   const mergedHidden = responsive && !display;
@@ -62,6 +63,7 @@ export default function Item<ItemType>(props: ItemProps<ItemType>) {
         pointerEvents: mergedHidden ? 'none' : undefined,
         ...style,
       }}
+      {...restProps}
     >
       {childNode}
     </Component>

src/Overflow.tsx

@@ -13,7 +13,7 @@ export type ComponentType =
   | React.FC<any>
   | keyof React.ReactHTML;
 
-export interface OverflowProps<ItemType> {
+export interface OverflowProps<ItemType> extends React.HTMLAttributes<any> {
   prefixCls?: string;
   className?: string;
   style?: React.CSSProperties;
@@ -22,6 +22,7 @@ export interface OverflowProps<ItemType> {
   /** Used for `responsive`. It will limit render node to avoid perf issue */
   itemWidth?: number;
   renderItem?: (item: ItemType) => React.ReactNode;
+  renderItemProps?: (item: ItemType) => React.HTMLAttributes<any>;
   maxCount?: number | typeof RESPONSIVE;
   renderRest?:
     | React.ReactNode
@@ -49,9 +50,11 @@ function Overflow<ItemType = any>(
     className,
     maxCount,
     renderRest = defaultRenderRest,
+    renderItemProps,
     suffix,
     component: Component = 'div',
-    itemComponent = 'div'
+    itemComponent = 'div',
+    ...restProps
   } = props;
 
   const createUseState = useBatchFrameState();
@@ -236,6 +239,7 @@ function Overflow<ItemType = any>(
       className={classNames(prefixCls, className)}
       style={style}
       ref={ref}
+      {...restProps}
     >
       {mergedData.map((item, index) => {
         const key = getKey(item, index);
@@ -250,6 +254,7 @@ function Overflow<ItemType = any>(
             itemKey={key}
             registerSize={registerSize}
             display={index <= displayCount}
+            {...renderItemProps?.(item)}
           />
         );
       })}

tests/__snapshots__/index.spec.tsx.snap

@@ -1,5 +1,20 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`Overflow aria props 1`] = `
+<div
+  class="rc-overflow"
+  role="menu"
+>
+  <div
+    class="rc-overflow-item"
+    role="menuitem"
+    style="opacity: 1;"
+  >
+    Label 0
+  </div>
+</div>
+`;
+
 exports[`Overflow customize component 1`] = `
 <ul
   class="rc-overflow"

tests/index.spec.tsx

@@ -113,4 +113,18 @@ describe('Overflow', () => {
 
     expect(wrapper.render()).toMatchSnapshot();
   });
+
+  it('aria props', () => {
+    const wrapper = mount(
+      <Overflow
+        data={getData(1)}
+        renderItem={renderItem}
+        renderItemProps={() => ({ role: 'menuitem' })}
+        itemKey={(item) => `bamboo-${item.key}`}
+        role="menu"
+      />,
+    );
+
+    expect(wrapper.render()).toMatchSnapshot();
+  });
 });