diff --git a/README.md b/README.md
index 4004fcd0..16b5278f 100644
--- a/README.md
+++ b/README.md
@@ -300,6 +300,12 @@ ReactDOM.render(
|
additional css class of root dom node |
+
+ popupStyle |
+ CSSProperties |
+ |
+ additional css style of root dom node |
+
title |
String/ReactElement |
diff --git a/src/SubMenu/PopupTrigger.tsx b/src/SubMenu/PopupTrigger.tsx
index 05b6f9e3..e7ec45af 100644
--- a/src/SubMenu/PopupTrigger.tsx
+++ b/src/SubMenu/PopupTrigger.tsx
@@ -21,6 +21,7 @@ export interface PopupTriggerProps {
visible: boolean;
children: React.ReactElement;
popup: React.ReactNode;
+ popupStyle?: React.CSSProperties;
popupClassName?: string;
popupOffset?: number[];
disabled: boolean;
@@ -32,6 +33,7 @@ export default function PopupTrigger({
visible,
children,
popup,
+ popupStyle,
popupClassName,
popupOffset,
disabled,
@@ -108,6 +110,7 @@ export default function PopupTrigger({
popupPlacement={popupPlacement}
popupVisible={innerVisible}
popup={popup}
+ popupStyle={popupStyle}
popupAlign={popupOffset && { offset: popupOffset }}
action={disabled ? [] : [triggerSubMenuAction]}
mouseEnterDelay={subMenuOpenDelay}
diff --git a/src/SubMenu/index.tsx b/src/SubMenu/index.tsx
index 231e6ac1..907b0496 100644
--- a/src/SubMenu/index.tsx
+++ b/src/SubMenu/index.tsx
@@ -62,6 +62,7 @@ const InternalSubMenu = (props: SubMenuProps) => {
// Popup
popupClassName,
popupOffset,
+ popupStyle,
// Events
onClick,
@@ -280,6 +281,7 @@ const InternalSubMenu = (props: SubMenuProps) => {
visible={!internalPopupClose && open && mode !== 'inline'}
popupClassName={popupClassName}
popupOffset={popupOffset}
+ popupStyle={popupStyle}
popup={
>>>> Popup
popupClassName?: string;
popupOffset?: number[];
+ popupStyle?: React.CSSProperties;
// >>>>> Events
onClick?: MenuClickEventHandler;
diff --git a/tests/SubMenu.spec.tsx b/tests/SubMenu.spec.tsx
index 03463e7b..f33f2426 100644
--- a/tests/SubMenu.spec.tsx
+++ b/tests/SubMenu.spec.tsx
@@ -6,7 +6,7 @@ import Menu, { MenuItem, SubMenu } from '../src';
import { isActive, last } from './util';
jest.mock('@rc-component/trigger', () => {
- const react = require('react');
+ const react = require('react');
let Trigger = jest.requireActual('@rc-component/trigger/lib/mock');
Trigger = Trigger.default || Trigger;
@@ -17,7 +17,7 @@ jest.mock('@rc-component/trigger', () => {
});
jest.mock('../src/SubMenu/PopupTrigger', () => {
- const react = require('react');
+ const react = require('react');
let PopupTrigger = jest.requireActual('../src/SubMenu/PopupTrigger');
PopupTrigger = PopupTrigger.default || PopupTrigger;
@@ -480,5 +480,24 @@ describe('SubMenu', () => {
expect(container.children).toMatchSnapshot();
});
+
+ it('submenu should support popupStyle', () => {
+ const { container } = render(
+ ,
+ );
+
+ fireEvent.mouseEnter(container.querySelector('.rc-menu-submenu-title'));
+ runAllTimer();
+ expect((container.querySelector('.rc-menu-submenu-popup') as HTMLElement).style.zIndex).toEqual('100');
+ expect((container.querySelector('.rc-menu-submenu-popup') as HTMLElement).style.width).toEqual('150px');
+ });
});
/* eslint-enable */