diff --git a/src/TabNavList/OperationNode.tsx b/src/TabNavList/OperationNode.tsx index 4521bccc..d7eb46a2 100644 --- a/src/TabNavList/OperationNode.tsx +++ b/src/TabNavList/OperationNode.tsx @@ -24,6 +24,7 @@ export interface OperationNodeProps { removeAriaLabel?: string; onTabClick: (key: React.Key, e: React.MouseEvent | React.KeyboardEvent) => void; tabMoving?: boolean; + popupClassName?: string; } function OperationNode( @@ -42,6 +43,7 @@ function OperationNode( rtl, removeAriaLabel, onTabClick, + popupClassName, }: OperationNodeProps, ref: React.Ref, ) { @@ -191,7 +193,7 @@ function OperationNode( visible={open} transitionName={moreTransitionName} onVisibleChange={setOpen} - overlayClassName={overlayClassName} + overlayClassName={classNames(overlayClassName, popupClassName)} mouseEnterDelay={0.1} mouseLeaveDelay={0.1} > diff --git a/src/TabNavList/index.tsx b/src/TabNavList/index.tsx index 6e1f82e7..dbd07513 100644 --- a/src/TabNavList/index.tsx +++ b/src/TabNavList/index.tsx @@ -46,6 +46,7 @@ export interface TabNavListProps { onTabClick: (activeKey: string, e: React.MouseEvent | React.KeyboardEvent) => void; onTabScroll?: OnTabScroll; children?: (node: React.ReactElement) => React.ReactElement; + popupClassName?: string; } interface ExtraContentProps { diff --git a/src/Tabs.tsx b/src/Tabs.tsx index a5d134cc..07c73807 100644 --- a/src/Tabs.tsx +++ b/src/Tabs.tsx @@ -65,6 +65,8 @@ export interface TabsProps extends Omit, 'o moreIcon?: React.ReactNode; /** @private Internal usage. Not promise will rename in future */ moreTransitionName?: string; + + popupClassName?: string; } function parseTabList(children: React.ReactNode): Tab[] { @@ -110,6 +112,7 @@ function Tabs( onChange, onTabClick, onTabScroll, + popupClassName, ...restProps }: TabsProps, ref: React.Ref, @@ -214,6 +217,7 @@ function Tabs( extra: tabBarExtraContent, style: tabBarStyle, panes: children, + popupClassName, }; if (renderTabBar) { diff --git a/tests/overflow.test.tsx b/tests/overflow.test.tsx index 7ea64feb..a20a8776 100644 --- a/tests/overflow.test.tsx +++ b/tests/overflow.test.tsx @@ -374,4 +374,24 @@ describe('Tabs.Overflow', () => { }); expect(wrapper.find('.rc-tabs-dropdown-menu').first().text()).not.toContain('miu'); }); + + it('should support popupClassName', () => { + jest.useFakeTimers(); + const wrapper = mount(getTabs({ popupClassName: 'custom-popup' })); + + triggerResize(wrapper); + act(() => { + jest.runAllTimers(); + wrapper.update(); + }); + + wrapper.find('.rc-tabs-nav-more').simulate('mouseenter'); + act(() => { + jest.runAllTimers(); + wrapper.update(); + }); + expect(wrapper.find('.rc-tabs-dropdown').first().getDOMNode().className).toContain( + 'custom-popup', + ); + }); });