diff --git a/components/menu/MenuContext.tsx b/components/menu/MenuContext.tsx index 5719efe131..4426ae47a6 100644 --- a/components/menu/MenuContext.tsx +++ b/components/menu/MenuContext.tsx @@ -1,4 +1,5 @@ import { createContext } from 'react'; +import type { MenuProps } from 'rc-menu'; import type { DirectionType } from '../config-provider'; export type MenuTheme = 'light' | 'dark'; @@ -7,6 +8,7 @@ export interface MenuContextProps { prefixCls: string; inlineCollapsed: boolean; direction?: DirectionType; + mode?: MenuProps['mode']; theme?: MenuTheme; firstLevel: boolean; /** @internal Safe to remove */ diff --git a/components/menu/SubMenu.tsx b/components/menu/SubMenu.tsx index 11df8da27f..972f19e74b 100644 --- a/components/menu/SubMenu.tsx +++ b/components/menu/SubMenu.tsx @@ -30,7 +30,7 @@ export interface SubMenuProps { function SubMenu(props: SubMenuProps) { const { popupClassName, icon, title, theme: customTheme } = props; const context = React.useContext(MenuContext); - const { prefixCls, inlineCollapsed, theme: contextTheme } = context; + const { prefixCls, inlineCollapsed, theme: contextTheme, mode } = context; const parentPath = useFullPath(); @@ -68,10 +68,12 @@ function SubMenu(props: SubMenuProps) { [context], ); + const popupOffset = mode === 'horizontal' ? [0, 8] : [10, 0]; + return ( ((props, ref) => { direction, firstLevel: true, theme, + mode: mergedMode, disableMenuItemTitleTooltip: _internalDisableMenuItemTitleTooltip, }), [prefixCls, mergedInlineCollapsed, direction, _internalDisableMenuItemTitleTooltip, theme],