first commit

frontend/node_modules/rc-menu/lib/SubMenu/InlineSubMenuList.d.ts

@@ -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;

frontend/node_modules/rc-menu/lib/SubMenu/InlineSubMenuList.js

@@ -0,0 +1,89 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = InlineSubMenuList;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var React = _interopRequireWildcard(require("react"));
+var _rcMotion = _interopRequireDefault(require("rc-motion"));
+var _motionUtil = require("../utils/motionUtil");
+var _MenuContext = _interopRequireWildcard(require("../context/MenuContext"));
+var _SubMenuList = _interopRequireDefault(require("./SubMenuList"));
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function InlineSubMenuList(_ref) {
+  var id = _ref.id,
+    open = _ref.open,
+    keyPath = _ref.keyPath,
+    children = _ref.children;
+  var fixedMode = 'inline';
+  var _React$useContext = React.useContext(_MenuContext.MenuContext),
+    prefixCls = _React$useContext.prefixCls,
+    forceSubMenuRender = _React$useContext.forceSubMenuRender,
+    motion = _React$useContext.motion,
+    defaultMotions = _React$useContext.defaultMotions,
+    mode = _React$useContext.mode;
+
+  // Always use latest mode check
+  var 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.
+  var _React$useState = React.useState(!sameModeRef.current),
+    _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
+    destroy = _React$useState2[0],
+    setDestroy = _React$useState2[1];
+  var mergedOpen = sameModeRef.current ? open : false;
+
+  // ================================= Effect =================================
+  // Reset destroy state when mode change back
+  React.useEffect(function () {
+    if (sameModeRef.current) {
+      setDestroy(false);
+    }
+  }, [mode]);
+
+  // ================================= Render =================================
+  var mergedMotion = (0, _objectSpread2.default)({}, (0, _motionUtil.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
+  var originOnVisibleChanged = mergedMotion.onVisibleChanged;
+  mergedMotion.onVisibleChanged = function (newVisible) {
+    if (!sameModeRef.current && !newVisible) {
+      setDestroy(true);
+    }
+    return originOnVisibleChanged === null || originOnVisibleChanged === void 0 ? void 0 : originOnVisibleChanged(newVisible);
+  };
+  if (destroy) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement(_MenuContext.default, {
+    mode: fixedMode,
+    locked: !sameModeRef.current
+  }, /*#__PURE__*/React.createElement(_rcMotion.default, (0, _extends2.default)({
+    visible: mergedOpen
+  }, mergedMotion, {
+    forceRender: forceSubMenuRender,
+    removeOnLeave: false,
+    leavedClassName: "".concat(prefixCls, "-hidden")
+  }), function (_ref2) {
+    var motionClassName = _ref2.className,
+      motionStyle = _ref2.style;
+    return /*#__PURE__*/React.createElement(_SubMenuList.default, {
+      id: id,
+      className: motionClassName,
+      style: motionStyle
+    }, children);
+  }));
+}

frontend/node_modules/rc-menu/lib/SubMenu/PopupTrigger.d.ts

@@ -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;

frontend/node_modules/rc-menu/lib/SubMenu/PopupTrigger.js

@@ -0,0 +1,101 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = PopupTrigger;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var React = _interopRequireWildcard(require("react"));
+var _trigger = _interopRequireDefault(require("@rc-component/trigger"));
+var _classnames = _interopRequireDefault(require("classnames"));
+var _raf = _interopRequireDefault(require("rc-util/lib/raf"));
+var _MenuContext = require("../context/MenuContext");
+var _placements = require("../placements");
+var _motionUtil = require("../utils/motionUtil");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+var popupPlacementMap = {
+  horizontal: 'bottomLeft',
+  vertical: 'rightTop',
+  'vertical-left': 'rightTop',
+  'vertical-right': 'leftTop'
+};
+function PopupTrigger(_ref) {
+  var prefixCls = _ref.prefixCls,
+    visible = _ref.visible,
+    children = _ref.children,
+    popup = _ref.popup,
+    popupStyle = _ref.popupStyle,
+    popupClassName = _ref.popupClassName,
+    popupOffset = _ref.popupOffset,
+    disabled = _ref.disabled,
+    mode = _ref.mode,
+    onVisibleChange = _ref.onVisibleChange;
+  var _React$useContext = React.useContext(_MenuContext.MenuContext),
+    getPopupContainer = _React$useContext.getPopupContainer,
+    rtl = _React$useContext.rtl,
+    subMenuOpenDelay = _React$useContext.subMenuOpenDelay,
+    subMenuCloseDelay = _React$useContext.subMenuCloseDelay,
+    builtinPlacements = _React$useContext.builtinPlacements,
+    triggerSubMenuAction = _React$useContext.triggerSubMenuAction,
+    forceSubMenuRender = _React$useContext.forceSubMenuRender,
+    rootClassName = _React$useContext.rootClassName,
+    motion = _React$useContext.motion,
+    defaultMotions = _React$useContext.defaultMotions;
+  var _React$useState = React.useState(false),
+    _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
+    innerVisible = _React$useState2[0],
+    setInnerVisible = _React$useState2[1];
+  var placement = rtl ? (0, _objectSpread2.default)((0, _objectSpread2.default)({}, _placements.placementsRtl), builtinPlacements) : (0, _objectSpread2.default)((0, _objectSpread2.default)({}, _placements.placements), builtinPlacements);
+  var popupPlacement = popupPlacementMap[mode];
+  var targetMotion = (0, _motionUtil.getMotion)(mode, motion, defaultMotions);
+  var 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;
+  }
+  var mergedMotion = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, targetMotionRef.current), {}, {
+    leavedClassName: "".concat(prefixCls, "-hidden"),
+    removeOnLeave: false,
+    motionAppear: true
+  });
+
+  // Delay to change visible
+  var visibleRef = React.useRef();
+  React.useEffect(function () {
+    visibleRef.current = (0, _raf.default)(function () {
+      setInnerVisible(visible);
+    });
+    return function () {
+      _raf.default.cancel(visibleRef.current);
+    };
+  }, [visible]);
+  return /*#__PURE__*/React.createElement(_trigger.default, {
+    prefixCls: prefixCls,
+    popupClassName: (0, _classnames.default)("".concat(prefixCls, "-popup"), (0, _defineProperty2.default)({}, "".concat(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);
+}

frontend/node_modules/rc-menu/lib/SubMenu/SubMenuList.d.ts

@@ -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;

frontend/node_modules/rc-menu/lib/SubMenu/SubMenuList.js

@@ -0,0 +1,35 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var React = _interopRequireWildcard(require("react"));
+var _classnames = _interopRequireDefault(require("classnames"));
+var _MenuContext = require("../context/MenuContext");
+var _excluded = ["className", "children"];
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+var InternalSubMenuList = function InternalSubMenuList(_ref, ref) {
+  var className = _ref.className,
+    children = _ref.children,
+    restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  var _React$useContext = React.useContext(_MenuContext.MenuContext),
+    prefixCls = _React$useContext.prefixCls,
+    mode = _React$useContext.mode,
+    rtl = _React$useContext.rtl;
+  return /*#__PURE__*/React.createElement("ul", (0, _extends2.default)({
+    className: (0, _classnames.default)(prefixCls, rtl && "".concat(prefixCls, "-rtl"), "".concat(prefixCls, "-sub"), "".concat(prefixCls, "-").concat(mode === 'inline' ? 'inline' : 'vertical'), className),
+    role: "menu"
+  }, restProps, {
+    "data-menu-list": true,
+    ref: ref
+  }), children);
+};
+var SubMenuList = /*#__PURE__*/React.forwardRef(InternalSubMenuList);
+SubMenuList.displayName = 'SubMenuList';
+var _default = exports.default = SubMenuList;

frontend/node_modules/rc-menu/lib/SubMenu/index.d.ts

@@ -0,0 +1,14 @@
+import * as React from 'react';
+import type { SubMenuType } from '../interface';
+export interface SubMenuProps extends Omit<SubMenuType, 'key' | 'children' | 'label'> {
+    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;
+}
+declare const SubMenu: React.ForwardRefExoticComponent<Omit<SubMenuProps, "ref"> & React.RefAttributes<HTMLLIElement>>;
+export default SubMenu;

frontend/node_modules/rc-menu/lib/SubMenu/index.js

@@ -0,0 +1,308 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var React = _interopRequireWildcard(require("react"));
+var _classnames = _interopRequireDefault(require("classnames"));
+var _rcOverflow = _interopRequireDefault(require("rc-overflow"));
+var _warning = _interopRequireDefault(require("rc-util/lib/warning"));
+var _SubMenuList = _interopRequireDefault(require("./SubMenuList"));
+var _commonUtil = require("../utils/commonUtil");
+var _MenuContext = _interopRequireWildcard(require("../context/MenuContext"));
+var _useMemoCallback = _interopRequireDefault(require("../hooks/useMemoCallback"));
+var _PopupTrigger = _interopRequireDefault(require("./PopupTrigger"));
+var _Icon = _interopRequireDefault(require("../Icon"));
+var _useActive2 = _interopRequireDefault(require("../hooks/useActive"));
+var _warnUtil = require("../utils/warnUtil");
+var _useDirectionStyle = _interopRequireDefault(require("../hooks/useDirectionStyle"));
+var _InlineSubMenuList = _interopRequireDefault(require("./InlineSubMenuList"));
+var _PathContext = require("../context/PathContext");
+var _IdContext = require("../context/IdContext");
+var _PrivateContext = _interopRequireDefault(require("../context/PrivateContext"));
+var _excluded = ["style", "className", "title", "eventKey", "warnKey", "disabled", "internalPopupClose", "children", "itemIcon", "expandIcon", "popupClassName", "popupOffset", "popupStyle", "onClick", "onMouseEnter", "onMouseLeave", "onTitleClick", "onTitleMouseEnter", "onTitleMouseLeave"],
+  _excluded2 = ["active"];
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+var InternalSubMenu = /*#__PURE__*/React.forwardRef(function (props, ref) {
+  var style = props.style,
+    className = props.className,
+    title = props.title,
+    eventKey = props.eventKey,
+    warnKey = props.warnKey,
+    disabled = props.disabled,
+    internalPopupClose = props.internalPopupClose,
+    children = props.children,
+    itemIcon = props.itemIcon,
+    expandIcon = props.expandIcon,
+    popupClassName = props.popupClassName,
+    popupOffset = props.popupOffset,
+    popupStyle = props.popupStyle,
+    onClick = props.onClick,
+    onMouseEnter = props.onMouseEnter,
+    onMouseLeave = props.onMouseLeave,
+    onTitleClick = props.onTitleClick,
+    onTitleMouseEnter = props.onTitleMouseEnter,
+    onTitleMouseLeave = props.onTitleMouseLeave,
+    restProps = (0, _objectWithoutProperties2.default)(props, _excluded);
+  var domDataId = (0, _IdContext.useMenuId)(eventKey);
+  var _React$useContext = React.useContext(_MenuContext.MenuContext),
+    prefixCls = _React$useContext.prefixCls,
+    mode = _React$useContext.mode,
+    openKeys = _React$useContext.openKeys,
+    contextDisabled = _React$useContext.disabled,
+    overflowDisabled = _React$useContext.overflowDisabled,
+    activeKey = _React$useContext.activeKey,
+    selectedKeys = _React$useContext.selectedKeys,
+    contextItemIcon = _React$useContext.itemIcon,
+    contextExpandIcon = _React$useContext.expandIcon,
+    onItemClick = _React$useContext.onItemClick,
+    onOpenChange = _React$useContext.onOpenChange,
+    onActive = _React$useContext.onActive;
+  var _React$useContext2 = React.useContext(_PrivateContext.default),
+    _internalRenderSubMenuItem = _React$useContext2._internalRenderSubMenuItem;
+  var _React$useContext3 = React.useContext(_PathContext.PathUserContext),
+    isSubPathKey = _React$useContext3.isSubPathKey;
+  var connectedPath = (0, _PathContext.useFullPath)();
+  var subMenuPrefixCls = "".concat(prefixCls, "-submenu");
+  var mergedDisabled = contextDisabled || disabled;
+  var elementRef = React.useRef();
+  var popupRef = React.useRef();
+
+  // ================================ Warn ================================
+  if (process.env.NODE_ENV !== 'production' && warnKey) {
+    (0, _warning.default)(false, 'SubMenu should not leave undefined `key`.');
+  }
+
+  // ================================ Icon ================================
+  var mergedItemIcon = itemIcon !== null && itemIcon !== void 0 ? itemIcon : contextItemIcon;
+  var mergedExpandIcon = expandIcon !== null && expandIcon !== void 0 ? expandIcon : contextExpandIcon;
+
+  // ================================ Open ================================
+  var originOpen = openKeys.includes(eventKey);
+  var open = !overflowDisabled && originOpen;
+
+  // =============================== Select ===============================
+  var childrenSelected = isSubPathKey(selectedKeys, eventKey);
+
+  // =============================== Active ===============================
+  var _useActive = (0, _useActive2.default)(eventKey, mergedDisabled, onTitleMouseEnter, onTitleMouseLeave),
+    active = _useActive.active,
+    activeProps = (0, _objectWithoutProperties2.default)(_useActive, _excluded2);
+
+  // Fallback of active check to avoid hover on menu title or disabled item
+  var _React$useState = React.useState(false),
+    _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
+    childrenActive = _React$useState2[0],
+    setChildrenActive = _React$useState2[1];
+  var triggerChildrenActive = function triggerChildrenActive(newActive) {
+    if (!mergedDisabled) {
+      setChildrenActive(newActive);
+    }
+  };
+  var onInternalMouseEnter = function onInternalMouseEnter(domEvent) {
+    triggerChildrenActive(true);
+    onMouseEnter === null || onMouseEnter === void 0 || onMouseEnter({
+      key: eventKey,
+      domEvent: domEvent
+    });
+  };
+  var onInternalMouseLeave = function onInternalMouseLeave(domEvent) {
+    triggerChildrenActive(false);
+    onMouseLeave === null || onMouseLeave === void 0 || onMouseLeave({
+      key: eventKey,
+      domEvent: domEvent
+    });
+  };
+  var mergedActive = React.useMemo(function () {
+    if (active) {
+      return active;
+    }
+    if (mode !== 'inline') {
+      return childrenActive || isSubPathKey([activeKey], eventKey);
+    }
+    return false;
+  }, [mode, active, activeKey, childrenActive, eventKey, isSubPathKey]);
+
+  // ========================== DirectionStyle ==========================
+  var directionStyle = (0, _useDirectionStyle.default)(connectedPath.length);
+
+  // =============================== Events ===============================
+  // >>>> Title click
+  var onInternalTitleClick = function onInternalTitleClick(e) {
+    // Skip if disabled
+    if (mergedDisabled) {
+      return;
+    }
+    onTitleClick === null || onTitleClick === void 0 || onTitleClick({
+      key: eventKey,
+      domEvent: e
+    });
+
+    // Trigger open by click when mode is `inline`
+    if (mode === 'inline') {
+      onOpenChange(eventKey, !originOpen);
+    }
+  };
+
+  // >>>> Context for children click
+  var onMergedItemClick = (0, _useMemoCallback.default)(function (info) {
+    onClick === null || onClick === void 0 || onClick((0, _warnUtil.warnItemProp)(info));
+    onItemClick(info);
+  });
+
+  // >>>>> Visible change
+  var onPopupVisibleChange = function onPopupVisibleChange(newVisible) {
+    if (mode !== 'inline') {
+      onOpenChange(eventKey, newVisible);
+    }
+  };
+
+  /**
+   * Used for accessibility. Helper will focus element without key board.
+   * We should manually trigger an active
+   */
+  var onInternalFocus = function onInternalFocus() {
+    onActive(eventKey);
+  };
+
+  // =============================== Render ===============================
+  var popupId = domDataId && "".concat(domDataId, "-popup");
+  var expandIconNode = React.useMemo(function () {
+    return /*#__PURE__*/React.createElement(_Icon.default, {
+      icon: mode !== 'horizontal' ? mergedExpandIcon : undefined,
+      props: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
+        isOpen: open,
+        // [Legacy] Not sure why need this mark
+        isSubMenu: true
+      })
+    }, /*#__PURE__*/React.createElement("i", {
+      className: "".concat(subMenuPrefixCls, "-arrow")
+    }));
+  }, [mode, mergedExpandIcon, props, open, subMenuPrefixCls]);
+
+  // >>>>> Title
+  var titleNode = /*#__PURE__*/React.createElement("div", (0, _extends2.default)({
+    role: "menuitem",
+    style: directionStyle,
+    className: "".concat(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
+  var triggerModeRef = React.useRef(mode);
+  if (mode !== 'inline' && connectedPath.length > 1) {
+    triggerModeRef.current = 'vertical';
+  } else {
+    triggerModeRef.current = mode;
+  }
+  if (!overflowDisabled) {
+    var 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.default, {
+      mode: triggerMode,
+      prefixCls: subMenuPrefixCls,
+      visible: !internalPopupClose && open && mode !== 'inline',
+      popupClassName: popupClassName,
+      popupOffset: popupOffset,
+      popupStyle: popupStyle,
+      popup: /*#__PURE__*/React.createElement(_MenuContext.default
+      // Special handle of horizontal mode
+      , {
+        mode: triggerMode === 'horizontal' ? 'vertical' : triggerMode
+      }, /*#__PURE__*/React.createElement(_SubMenuList.default, {
+        id: popupId,
+        ref: popupRef
+      }, children)),
+      disabled: mergedDisabled,
+      onVisibleChange: onPopupVisibleChange
+    }, titleNode);
+  }
+
+  // >>>>> List node
+  var listNode = /*#__PURE__*/React.createElement(_rcOverflow.default.Item, (0, _extends2.default)({
+    ref: ref,
+    role: "none"
+  }, restProps, {
+    component: "li",
+    style: style,
+    className: (0, _classnames.default)(subMenuPrefixCls, "".concat(subMenuPrefixCls, "-").concat(mode), className, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, "".concat(subMenuPrefixCls, "-open"), open), "".concat(subMenuPrefixCls, "-active"), mergedActive), "".concat(subMenuPrefixCls, "-selected"), childrenSelected), "".concat(subMenuPrefixCls, "-disabled"), mergedDisabled)),
+    onMouseEnter: onInternalMouseEnter,
+    onMouseLeave: onInternalMouseLeave
+  }), titleNode, !overflowDisabled && /*#__PURE__*/React.createElement(_InlineSubMenuList.default, {
+    id: popupId,
+    open: open,
+    keyPath: connectedPath
+  }, children));
+  if (_internalRenderSubMenuItem) {
+    listNode = _internalRenderSubMenuItem(listNode, props, {
+      selected: childrenSelected,
+      active: mergedActive,
+      open: open,
+      disabled: mergedDisabled
+    });
+  }
+
+  // >>>>> Render
+  return /*#__PURE__*/React.createElement(_MenuContext.default, {
+    onItemClick: onMergedItemClick,
+    mode: mode === 'horizontal' ? 'vertical' : mode,
+    itemIcon: mergedItemIcon,
+    expandIcon: mergedExpandIcon
+  }, listNode);
+});
+var SubMenu = /*#__PURE__*/React.forwardRef(function (props, ref) {
+  var eventKey = props.eventKey,
+    children = props.children;
+  var connectedKeyPath = (0, _PathContext.useFullPath)(eventKey);
+  var childList = (0, _commonUtil.parseChildren)(children, connectedKeyPath);
+
+  // ==================== Record KeyPath ====================
+  var measure = (0, _PathContext.useMeasure)();
+
+  // eslint-disable-next-line consistent-return
+  React.useEffect(function () {
+    if (measure) {
+      measure.registerPath(eventKey, connectedKeyPath);
+      return function () {
+        measure.unregisterPath(eventKey, connectedKeyPath);
+      };
+    }
+  }, [connectedKeyPath]);
+  var renderNode;
+
+  // ======================== Render ========================
+  if (measure) {
+    renderNode = childList;
+  } else {
+    renderNode = /*#__PURE__*/React.createElement(InternalSubMenu, (0, _extends2.default)({
+      ref: ref
+    }, props), childList);
+  }
+  return /*#__PURE__*/React.createElement(_PathContext.PathTrackerContext.Provider, {
+    value: connectedKeyPath
+  }, renderNode);
+});
+if (process.env.NODE_ENV !== 'production') {
+  SubMenu.displayName = 'SubMenu';
+}
+var _default = exports.default = SubMenu;