1
This commit is contained in:
Generated
Vendored
+8
@@ -0,0 +1,8 @@
|
||||
import * as React from 'react';
|
||||
export interface InlineSubMenuListProps {
|
||||
id?: string;
|
||||
open: boolean;
|
||||
keyPath: string[];
|
||||
children: React.ReactNode;
|
||||
}
|
||||
export default function InlineSubMenuList({ id, open, keyPath, children }: InlineSubMenuListProps): React.JSX.Element;
|
||||
+79
@@ -0,0 +1,79 @@
|
||||
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
||||
import * as React from 'react';
|
||||
import CSSMotion from '@rc-component/motion';
|
||||
import { getMotion } from "../utils/motionUtil";
|
||||
import MenuContextProvider, { MenuContext } from "../context/MenuContext";
|
||||
import SubMenuList from "./SubMenuList";
|
||||
export default function InlineSubMenuList({
|
||||
id,
|
||||
open,
|
||||
keyPath,
|
||||
children
|
||||
}) {
|
||||
const fixedMode = 'inline';
|
||||
const {
|
||||
prefixCls,
|
||||
forceSubMenuRender,
|
||||
motion,
|
||||
defaultMotions,
|
||||
mode
|
||||
} = React.useContext(MenuContext);
|
||||
|
||||
// Always use latest mode check
|
||||
const sameModeRef = React.useRef(false);
|
||||
sameModeRef.current = mode === fixedMode;
|
||||
|
||||
// We record `destroy` mark here since when mode change from `inline` to others.
|
||||
// The inline list should remove when motion end.
|
||||
const [destroy, setDestroy] = React.useState(!sameModeRef.current);
|
||||
const mergedOpen = sameModeRef.current ? open : false;
|
||||
|
||||
// ================================= Effect =================================
|
||||
// Reset destroy state when mode change back
|
||||
React.useEffect(() => {
|
||||
if (sameModeRef.current) {
|
||||
setDestroy(false);
|
||||
}
|
||||
}, [mode]);
|
||||
|
||||
// ================================= Render =================================
|
||||
const mergedMotion = {
|
||||
...getMotion(fixedMode, motion, defaultMotions)
|
||||
};
|
||||
|
||||
// No need appear since nest inlineCollapse changed
|
||||
if (keyPath.length > 1) {
|
||||
mergedMotion.motionAppear = false;
|
||||
}
|
||||
|
||||
// Hide inline list when mode changed and motion end
|
||||
const originOnVisibleChanged = mergedMotion.onVisibleChanged;
|
||||
mergedMotion.onVisibleChanged = newVisible => {
|
||||
if (!sameModeRef.current && !newVisible) {
|
||||
setDestroy(true);
|
||||
}
|
||||
return originOnVisibleChanged?.(newVisible);
|
||||
};
|
||||
if (destroy) {
|
||||
return null;
|
||||
}
|
||||
return /*#__PURE__*/React.createElement(MenuContextProvider, {
|
||||
mode: fixedMode,
|
||||
locked: !sameModeRef.current
|
||||
}, /*#__PURE__*/React.createElement(CSSMotion, _extends({
|
||||
visible: mergedOpen
|
||||
}, mergedMotion, {
|
||||
forceRender: forceSubMenuRender,
|
||||
removeOnLeave: false,
|
||||
leavedClassName: `${prefixCls}-hidden`
|
||||
}), ({
|
||||
className: motionClassName,
|
||||
style: motionStyle
|
||||
}) => {
|
||||
return /*#__PURE__*/React.createElement(SubMenuList, {
|
||||
id: id,
|
||||
className: motionClassName,
|
||||
style: motionStyle
|
||||
}, children);
|
||||
}));
|
||||
}
|
||||
+15
@@ -0,0 +1,15 @@
|
||||
import * as React from 'react';
|
||||
import type { MenuMode } from '../interface';
|
||||
export interface PopupTriggerProps {
|
||||
prefixCls: string;
|
||||
mode: MenuMode;
|
||||
visible: boolean;
|
||||
children: React.ReactElement;
|
||||
popup: React.ReactNode;
|
||||
popupStyle?: React.CSSProperties;
|
||||
popupClassName?: string;
|
||||
popupOffset?: number[];
|
||||
disabled: boolean;
|
||||
onVisibleChange: (visible: boolean) => void;
|
||||
}
|
||||
export default function PopupTrigger({ prefixCls, visible, children, popup, popupStyle, popupClassName, popupOffset, disabled, mode, onVisibleChange, }: PopupTriggerProps): React.JSX.Element;
|
||||
+97
@@ -0,0 +1,97 @@
|
||||
import * as React from 'react';
|
||||
import Trigger from '@rc-component/trigger';
|
||||
import { clsx } from 'clsx';
|
||||
import raf from "@rc-component/util/es/raf";
|
||||
import { MenuContext } from "../context/MenuContext";
|
||||
import { placements, placementsRtl } from "../placements";
|
||||
import { getMotion } from "../utils/motionUtil";
|
||||
const popupPlacementMap = {
|
||||
horizontal: 'bottomLeft',
|
||||
vertical: 'rightTop',
|
||||
'vertical-left': 'rightTop',
|
||||
'vertical-right': 'leftTop'
|
||||
};
|
||||
export default function PopupTrigger({
|
||||
prefixCls,
|
||||
visible,
|
||||
children,
|
||||
popup,
|
||||
popupStyle,
|
||||
popupClassName,
|
||||
popupOffset,
|
||||
disabled,
|
||||
mode,
|
||||
onVisibleChange
|
||||
}) {
|
||||
const {
|
||||
getPopupContainer,
|
||||
rtl,
|
||||
subMenuOpenDelay,
|
||||
subMenuCloseDelay,
|
||||
builtinPlacements,
|
||||
triggerSubMenuAction,
|
||||
forceSubMenuRender,
|
||||
rootClassName,
|
||||
// Motion
|
||||
motion,
|
||||
defaultMotions
|
||||
} = React.useContext(MenuContext);
|
||||
const [innerVisible, setInnerVisible] = React.useState(false);
|
||||
const placement = rtl ? {
|
||||
...placementsRtl,
|
||||
...builtinPlacements
|
||||
} : {
|
||||
...placements,
|
||||
...builtinPlacements
|
||||
};
|
||||
const popupPlacement = popupPlacementMap[mode];
|
||||
const targetMotion = getMotion(mode, motion, defaultMotions);
|
||||
const targetMotionRef = React.useRef(targetMotion);
|
||||
if (mode !== 'inline') {
|
||||
/**
|
||||
* PopupTrigger is only used for vertical and horizontal types.
|
||||
* When collapsed is unfolded, the inline animation will destroy the vertical animation.
|
||||
*/
|
||||
targetMotionRef.current = targetMotion;
|
||||
}
|
||||
const mergedMotion = {
|
||||
...targetMotionRef.current,
|
||||
leavedClassName: `${prefixCls}-hidden`,
|
||||
removeOnLeave: false,
|
||||
motionAppear: true
|
||||
};
|
||||
|
||||
// Delay to change visible
|
||||
const visibleRef = React.useRef();
|
||||
React.useEffect(() => {
|
||||
visibleRef.current = raf(() => {
|
||||
setInnerVisible(visible);
|
||||
});
|
||||
return () => {
|
||||
raf.cancel(visibleRef.current);
|
||||
};
|
||||
}, [visible]);
|
||||
return /*#__PURE__*/React.createElement(Trigger, {
|
||||
prefixCls: prefixCls,
|
||||
popupClassName: clsx(`${prefixCls}-popup`, {
|
||||
[`${prefixCls}-rtl`]: rtl
|
||||
}, popupClassName, rootClassName),
|
||||
stretch: mode === 'horizontal' ? 'minWidth' : null,
|
||||
getPopupContainer: getPopupContainer,
|
||||
builtinPlacements: placement,
|
||||
popupPlacement: popupPlacement,
|
||||
popupVisible: innerVisible,
|
||||
popup: popup,
|
||||
popupStyle: popupStyle,
|
||||
popupAlign: popupOffset && {
|
||||
offset: popupOffset
|
||||
},
|
||||
action: disabled ? [] : [triggerSubMenuAction],
|
||||
mouseEnterDelay: subMenuOpenDelay,
|
||||
mouseLeaveDelay: subMenuCloseDelay,
|
||||
onPopupVisibleChange: onVisibleChange,
|
||||
forceRender: forceSubMenuRender,
|
||||
popupMotion: mergedMotion,
|
||||
fresh: true
|
||||
}, children);
|
||||
}
|
||||
+6
@@ -0,0 +1,6 @@
|
||||
import * as React from 'react';
|
||||
export interface SubMenuListProps extends React.HTMLAttributes<HTMLUListElement> {
|
||||
children?: React.ReactNode;
|
||||
}
|
||||
declare const SubMenuList: React.ForwardRefExoticComponent<SubMenuListProps & React.RefAttributes<HTMLUListElement>>;
|
||||
export default SubMenuList;
|
||||
+27
@@ -0,0 +1,27 @@
|
||||
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
||||
import * as React from 'react';
|
||||
import { clsx } from 'clsx';
|
||||
import { MenuContext } from "../context/MenuContext";
|
||||
const InternalSubMenuList = ({
|
||||
className,
|
||||
children,
|
||||
...restProps
|
||||
}, ref) => {
|
||||
const {
|
||||
prefixCls,
|
||||
mode,
|
||||
rtl
|
||||
} = React.useContext(MenuContext);
|
||||
return /*#__PURE__*/React.createElement("ul", _extends({
|
||||
className: clsx(prefixCls, rtl && `${prefixCls}-rtl`, `${prefixCls}-sub`, `${prefixCls}-${mode === 'inline' ? 'inline' : 'vertical'}`, className),
|
||||
role: "menu"
|
||||
}, restProps, {
|
||||
"data-menu-list": true,
|
||||
ref: ref
|
||||
}), children);
|
||||
};
|
||||
const SubMenuList = /*#__PURE__*/React.forwardRef(InternalSubMenuList);
|
||||
if (process.env.NODE_ENV !== 'production') {
|
||||
SubMenuList.displayName = 'SubMenuList';
|
||||
}
|
||||
export default SubMenuList;
|
||||
+18
@@ -0,0 +1,18 @@
|
||||
import * as React from 'react';
|
||||
import type { SubMenuType, PopupRender } from '../interface';
|
||||
export type SemanticName = 'list' | 'listTitle';
|
||||
export interface SubMenuProps extends Omit<SubMenuType, 'key' | 'children' | 'label'> {
|
||||
classNames?: Partial<Record<SemanticName, string>>;
|
||||
styles?: Partial<Record<SemanticName, React.CSSProperties>>;
|
||||
title?: React.ReactNode;
|
||||
children?: React.ReactNode;
|
||||
/** @private Used for rest popup. Do not use in your prod */
|
||||
internalPopupClose?: boolean;
|
||||
/** @private Internal filled key. Do not set it directly */
|
||||
eventKey?: string;
|
||||
/** @private Do not use. Private warning empty usage */
|
||||
warnKey?: boolean;
|
||||
popupRender?: PopupRender;
|
||||
}
|
||||
declare const SubMenu: React.ForwardRefExoticComponent<Omit<SubMenuProps, "ref"> & React.RefAttributes<HTMLLIElement>>;
|
||||
export default SubMenu;
|
||||
+328
@@ -0,0 +1,328 @@
|
||||
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
||||
import * as React from 'react';
|
||||
import { clsx } from 'clsx';
|
||||
import Overflow from '@rc-component/overflow';
|
||||
import warning from "@rc-component/util/es/warning";
|
||||
import SubMenuList from "./SubMenuList";
|
||||
import { parseChildren } from "../utils/commonUtil";
|
||||
import MenuContextProvider, { MenuContext } from "../context/MenuContext";
|
||||
import useMemoCallback from "../hooks/useMemoCallback";
|
||||
import PopupTrigger from "./PopupTrigger";
|
||||
import Icon from "../Icon";
|
||||
import useActive from "../hooks/useActive";
|
||||
import { warnItemProp } from "../utils/warnUtil";
|
||||
import useDirectionStyle from "../hooks/useDirectionStyle";
|
||||
import InlineSubMenuList from "./InlineSubMenuList";
|
||||
import { PathTrackerContext, PathUserContext, useFullPath, useMeasure } from "../context/PathContext";
|
||||
import { useMenuId } from "../context/IdContext";
|
||||
import PrivateContext from "../context/PrivateContext";
|
||||
const InternalSubMenu = /*#__PURE__*/React.forwardRef((props, ref) => {
|
||||
const {
|
||||
style,
|
||||
className,
|
||||
styles,
|
||||
classNames: menuClassNames,
|
||||
title,
|
||||
eventKey,
|
||||
warnKey,
|
||||
disabled,
|
||||
internalPopupClose,
|
||||
children,
|
||||
// Icons
|
||||
itemIcon,
|
||||
expandIcon,
|
||||
// Popup
|
||||
popupClassName,
|
||||
popupOffset,
|
||||
popupStyle,
|
||||
// Events
|
||||
onClick,
|
||||
onMouseEnter,
|
||||
onMouseLeave,
|
||||
onTitleClick,
|
||||
onTitleMouseEnter,
|
||||
onTitleMouseLeave,
|
||||
popupRender: propsPopupRender,
|
||||
...restProps
|
||||
} = props;
|
||||
const domDataId = useMenuId(eventKey);
|
||||
const {
|
||||
prefixCls,
|
||||
mode,
|
||||
openKeys,
|
||||
// Disabled
|
||||
disabled: contextDisabled,
|
||||
overflowDisabled,
|
||||
// ActiveKey
|
||||
activeKey,
|
||||
// SelectKey
|
||||
selectedKeys,
|
||||
// Icon
|
||||
itemIcon: contextItemIcon,
|
||||
expandIcon: contextExpandIcon,
|
||||
// Events
|
||||
onItemClick,
|
||||
onOpenChange,
|
||||
onActive,
|
||||
popupRender: contextPopupRender
|
||||
} = React.useContext(MenuContext);
|
||||
const {
|
||||
_internalRenderSubMenuItem
|
||||
} = React.useContext(PrivateContext);
|
||||
const {
|
||||
isSubPathKey
|
||||
} = React.useContext(PathUserContext);
|
||||
const connectedPath = useFullPath();
|
||||
const subMenuPrefixCls = `${prefixCls}-submenu`;
|
||||
const mergedDisabled = contextDisabled || disabled;
|
||||
const elementRef = React.useRef();
|
||||
const popupRef = React.useRef();
|
||||
|
||||
// ================================ Warn ================================
|
||||
if (process.env.NODE_ENV !== 'production' && warnKey) {
|
||||
warning(false, 'SubMenu should not leave undefined `key`.');
|
||||
}
|
||||
|
||||
// ================================ Icon ================================
|
||||
const mergedItemIcon = itemIcon ?? contextItemIcon;
|
||||
const mergedExpandIcon = expandIcon ?? contextExpandIcon;
|
||||
|
||||
// ================================ Open ================================
|
||||
const originOpen = openKeys.includes(eventKey);
|
||||
const open = !overflowDisabled && originOpen;
|
||||
|
||||
// =============================== Select ===============================
|
||||
const childrenSelected = isSubPathKey(selectedKeys, eventKey);
|
||||
|
||||
// =============================== Active ===============================
|
||||
const {
|
||||
active,
|
||||
...activeProps
|
||||
} = useActive(eventKey, mergedDisabled, onTitleMouseEnter, onTitleMouseLeave);
|
||||
|
||||
// Fallback of active check to avoid hover on menu title or disabled item
|
||||
const [childrenActive, setChildrenActive] = React.useState(false);
|
||||
const triggerChildrenActive = newActive => {
|
||||
if (!mergedDisabled) {
|
||||
setChildrenActive(newActive);
|
||||
}
|
||||
};
|
||||
const onInternalMouseEnter = domEvent => {
|
||||
triggerChildrenActive(true);
|
||||
onMouseEnter?.({
|
||||
key: eventKey,
|
||||
domEvent
|
||||
});
|
||||
};
|
||||
const onInternalMouseLeave = domEvent => {
|
||||
triggerChildrenActive(false);
|
||||
onMouseLeave?.({
|
||||
key: eventKey,
|
||||
domEvent
|
||||
});
|
||||
};
|
||||
const mergedActive = React.useMemo(() => {
|
||||
if (active) {
|
||||
return active;
|
||||
}
|
||||
if (mode !== 'inline') {
|
||||
return childrenActive || isSubPathKey([activeKey], eventKey);
|
||||
}
|
||||
return false;
|
||||
}, [mode, active, activeKey, childrenActive, eventKey, isSubPathKey]);
|
||||
|
||||
// ========================== DirectionStyle ==========================
|
||||
const directionStyle = useDirectionStyle(connectedPath.length);
|
||||
|
||||
// =============================== Events ===============================
|
||||
// >>>> Title click
|
||||
const onInternalTitleClick = e => {
|
||||
// Skip if disabled
|
||||
if (mergedDisabled) {
|
||||
return;
|
||||
}
|
||||
onTitleClick?.({
|
||||
key: eventKey,
|
||||
domEvent: e
|
||||
});
|
||||
|
||||
// Trigger open by click when mode is `inline`
|
||||
if (mode === 'inline') {
|
||||
onOpenChange(eventKey, !originOpen);
|
||||
}
|
||||
};
|
||||
|
||||
// >>>> Context for children click
|
||||
const onMergedItemClick = useMemoCallback(info => {
|
||||
onClick?.(warnItemProp(info));
|
||||
onItemClick(info);
|
||||
});
|
||||
|
||||
// >>>>> Visible change
|
||||
const onPopupVisibleChange = newVisible => {
|
||||
if (mode !== 'inline') {
|
||||
onOpenChange(eventKey, newVisible);
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Used for accessibility. Helper will focus element without key board.
|
||||
* We should manually trigger an active
|
||||
*/
|
||||
const onInternalFocus = () => {
|
||||
onActive(eventKey);
|
||||
};
|
||||
|
||||
// =============================== Render ===============================
|
||||
const popupId = domDataId && `${domDataId}-popup`;
|
||||
const expandIconNode = React.useMemo(() => /*#__PURE__*/React.createElement(Icon, {
|
||||
icon: mode !== 'horizontal' ? mergedExpandIcon : undefined,
|
||||
props: {
|
||||
...props,
|
||||
isOpen: open,
|
||||
// [Legacy] Not sure why need this mark
|
||||
isSubMenu: true
|
||||
}
|
||||
}, /*#__PURE__*/React.createElement("i", {
|
||||
className: `${subMenuPrefixCls}-arrow`
|
||||
})), [mode, mergedExpandIcon, props, open, subMenuPrefixCls]);
|
||||
|
||||
// >>>>> Title
|
||||
let titleNode = /*#__PURE__*/React.createElement("div", _extends({
|
||||
role: "menuitem",
|
||||
style: directionStyle,
|
||||
className: `${subMenuPrefixCls}-title`,
|
||||
tabIndex: mergedDisabled ? null : -1,
|
||||
ref: elementRef,
|
||||
title: typeof title === 'string' ? title : null,
|
||||
"data-menu-id": overflowDisabled && domDataId ? null : domDataId,
|
||||
"aria-expanded": open,
|
||||
"aria-haspopup": true,
|
||||
"aria-controls": popupId,
|
||||
"aria-disabled": mergedDisabled,
|
||||
onClick: onInternalTitleClick,
|
||||
onFocus: onInternalFocus
|
||||
}, activeProps), title, expandIconNode);
|
||||
|
||||
// Cache mode if it change to `inline` which do not have popup motion
|
||||
const triggerModeRef = React.useRef(mode);
|
||||
if (mode !== 'inline' && connectedPath.length > 1) {
|
||||
triggerModeRef.current = 'vertical';
|
||||
} else {
|
||||
triggerModeRef.current = mode;
|
||||
}
|
||||
const popupContentTriggerMode = triggerModeRef.current;
|
||||
const renderPopupContent = React.useMemo(() => {
|
||||
const originNode = /*#__PURE__*/React.createElement(MenuContextProvider, {
|
||||
classNames: menuClassNames,
|
||||
styles: styles,
|
||||
mode: popupContentTriggerMode === 'horizontal' ? 'vertical' : popupContentTriggerMode
|
||||
}, /*#__PURE__*/React.createElement(SubMenuList, {
|
||||
id: popupId,
|
||||
ref: popupRef
|
||||
}, children));
|
||||
const mergedPopupRender = propsPopupRender || contextPopupRender;
|
||||
if (mergedPopupRender) {
|
||||
const node = mergedPopupRender(originNode, {
|
||||
item: props,
|
||||
keys: connectedPath
|
||||
});
|
||||
return node;
|
||||
}
|
||||
return originNode;
|
||||
}, [propsPopupRender, contextPopupRender, connectedPath, popupId, children, props, popupContentTriggerMode]);
|
||||
if (!overflowDisabled) {
|
||||
const triggerMode = triggerModeRef.current;
|
||||
|
||||
// Still wrap with Trigger here since we need avoid react re-mount dom node
|
||||
// Which makes motion failed
|
||||
titleNode = /*#__PURE__*/React.createElement(PopupTrigger, {
|
||||
mode: triggerMode,
|
||||
prefixCls: subMenuPrefixCls,
|
||||
visible: !internalPopupClose && open && mode !== 'inline',
|
||||
popupClassName: popupClassName,
|
||||
popupOffset: popupOffset,
|
||||
popupStyle: popupStyle,
|
||||
popup: renderPopupContent,
|
||||
disabled: mergedDisabled,
|
||||
onVisibleChange: onPopupVisibleChange
|
||||
}, titleNode);
|
||||
}
|
||||
|
||||
// >>>>> List node
|
||||
let listNode = /*#__PURE__*/React.createElement(Overflow.Item, _extends({
|
||||
ref: ref,
|
||||
role: "none"
|
||||
}, restProps, {
|
||||
component: "li",
|
||||
style: style,
|
||||
className: clsx(subMenuPrefixCls, `${subMenuPrefixCls}-${mode}`, className, {
|
||||
[`${subMenuPrefixCls}-open`]: open,
|
||||
[`${subMenuPrefixCls}-active`]: mergedActive,
|
||||
[`${subMenuPrefixCls}-selected`]: childrenSelected,
|
||||
[`${subMenuPrefixCls}-disabled`]: mergedDisabled
|
||||
}),
|
||||
onMouseEnter: onInternalMouseEnter,
|
||||
onMouseLeave: onInternalMouseLeave
|
||||
}), titleNode, !overflowDisabled && /*#__PURE__*/React.createElement(InlineSubMenuList, {
|
||||
id: popupId,
|
||||
open: open,
|
||||
keyPath: connectedPath
|
||||
}, children));
|
||||
if (_internalRenderSubMenuItem) {
|
||||
listNode = _internalRenderSubMenuItem(listNode, props, {
|
||||
selected: childrenSelected,
|
||||
active: mergedActive,
|
||||
open,
|
||||
disabled: mergedDisabled
|
||||
});
|
||||
}
|
||||
|
||||
// >>>>> Render
|
||||
return /*#__PURE__*/React.createElement(MenuContextProvider, {
|
||||
classNames: menuClassNames,
|
||||
styles: styles,
|
||||
onItemClick: onMergedItemClick,
|
||||
mode: mode === 'horizontal' ? 'vertical' : mode,
|
||||
itemIcon: mergedItemIcon,
|
||||
expandIcon: mergedExpandIcon
|
||||
}, listNode);
|
||||
});
|
||||
const SubMenu = /*#__PURE__*/React.forwardRef((props, ref) => {
|
||||
const {
|
||||
eventKey,
|
||||
children
|
||||
} = props;
|
||||
const connectedKeyPath = useFullPath(eventKey);
|
||||
const childList = parseChildren(children, connectedKeyPath);
|
||||
|
||||
// ==================== Record KeyPath ====================
|
||||
const measure = useMeasure();
|
||||
|
||||
// eslint-disable-next-line consistent-return
|
||||
React.useEffect(() => {
|
||||
if (measure) {
|
||||
measure.registerPath(eventKey, connectedKeyPath);
|
||||
return () => {
|
||||
measure.unregisterPath(eventKey, connectedKeyPath);
|
||||
};
|
||||
}
|
||||
}, [connectedKeyPath]);
|
||||
let renderNode;
|
||||
|
||||
// ======================== Render ========================
|
||||
if (measure) {
|
||||
renderNode = childList;
|
||||
} else {
|
||||
renderNode = /*#__PURE__*/React.createElement(InternalSubMenu, _extends({
|
||||
ref: ref
|
||||
}, props), childList);
|
||||
}
|
||||
return /*#__PURE__*/React.createElement(PathTrackerContext.Provider, {
|
||||
value: connectedKeyPath
|
||||
}, renderNode);
|
||||
});
|
||||
if (process.env.NODE_ENV !== 'production') {
|
||||
SubMenu.displayName = 'SubMenu';
|
||||
}
|
||||
export default SubMenu;
|
||||
Reference in New Issue
Block a user