diff --git a/components/menu/src/SubMenu.tsx b/components/menu/src/SubMenu.tsx
index 09ac845f2..84ee6e242 100644
--- a/components/menu/src/SubMenu.tsx
+++ b/components/menu/src/SubMenu.tsx
@@ -1,5 +1,5 @@
import PropTypes from '../../_util/vue-types';
-import { computed, defineComponent } from 'vue';
+import { computed, defineComponent, getCurrentInstance, ref } from 'vue';
import useProvideKeyPath, { useInjectKeyPath } from './hooks/useKeyPath';
import { useInjectMenu, useProvideFirstLevel } from './hooks/useMenuContext';
import { getPropsSlot, isValidElement } from 'ant-design-vue/es/_util/props-util';
@@ -20,18 +20,35 @@ export default defineComponent({
setup(props, { slots, attrs }) {
useProvideKeyPath();
useProvideFirstLevel(false);
+ const instance = getCurrentInstance();
+ const key = instance.vnode.key;
const keyPath = useInjectKeyPath();
const {
prefixCls,
activeKeys,
- disabled,
+ disabled: contextDisabled,
changeActiveKeys,
rtl,
mode,
inlineCollapsed,
antdMenuTheme,
+ openKeys,
+ overflowDisabled,
} = useInjectMenu();
+ const subMenuPrefixCls = computed(() => `${prefixCls}-submenu`);
+ const mergedDisabled = computed(() => contextDisabled.value || props.disabled);
+ const elementRef = ref();
+ const popupRef = ref();
+
+ // // ================================ Icon ================================
+ // const mergedItemIcon = itemIcon || contextItemIcon;
+ // const mergedExpandIcon = expandIcon || contextExpandIcon;
+
+ // ================================ Open ================================
+ const originOpen = computed(() => openKeys.value.includes(key));
+ const open = computed(() => !overflowDisabled.value && originOpen.value);
+
const popupClassName = computed(() =>
classNames(prefixCls, `${prefixCls.value}-${antdMenuTheme.value}`, props.popupClassName),
);
diff --git a/components/vc-overflow/Item.tsx b/components/vc-overflow/Item.tsx
new file mode 100644
index 000000000..e8045ccb8
--- /dev/null
+++ b/components/vc-overflow/Item.tsx
@@ -0,0 +1,105 @@
+import {
+ computed,
+ CSSProperties,
+ defineComponent,
+ HTMLAttributes,
+ onUnmounted,
+ PropType,
+ ref,
+} from 'vue';
+import ResizeObserver from '../vc-resize-observer';
+import classNames from '../_util/classNames';
+import { Key, VueNode } from '../_util/type';
+import PropTypes from '../_util/vue-types';
+
+export default defineComponent({
+ name: 'InternalItem',
+ props: {
+ prefixCls: String,
+ item: PropTypes.any,
+ renderItem: Function as PropType<(item: any) => VueNode>,
+ responsive: Boolean,
+ itemKey: [String, Number],
+ registerSize: Function as PropType<(key: Key, width: number | null) => void>,
+ display: Boolean,
+ order: Number,
+ component: PropTypes.any,
+ invalidate: Boolean,
+ },
+ setup(props, { slots, expose }) {
+ const mergedHidden = computed(() => props.responsive && !props.display);
+ const itemNodeRef = ref();
+
+ expose({ itemNodeRef });
+
+ // ================================ Effect ================================
+ function internalRegisterSize(width: number | null) {
+ props.registerSize(props.itemKey!, width);
+ }
+
+ onUnmounted(() => {
+ internalRegisterSize(null);
+ });
+
+ return () => {
+ const {
+ prefixCls,
+ invalidate,
+ item,
+ renderItem,
+ responsive,
+ registerSize,
+ itemKey,
+ display,
+ order,
+ component: Component = 'div',
+ ...restProps
+ } = props;
+ const children = slots.default?.();
+ // ================================ Render ================================
+ const childNode = renderItem && item !== undefined ? renderItem(item) : children;
+
+ let overflowStyle: CSSProperties | undefined;
+ if (!invalidate) {
+ overflowStyle = {
+ opacity: mergedHidden.value ? 0 : 1,
+ height: mergedHidden.value ? 0 : undefined,
+ overflowY: mergedHidden.value ? 'hidden' : undefined,
+ order: responsive ? order : undefined,
+ pointerEvents: mergedHidden.value ? 'none' : undefined,
+ };
+ }
+
+ const overflowProps: HTMLAttributes = {};
+ if (mergedHidden.value) {
+ overflowProps['aria-hidden'] = true;
+ }
+
+ let itemNode = (
+
+ {childNode}
+
+ );
+
+ if (responsive) {
+ itemNode = (
+ {
+ internalRegisterSize(offsetWidth);
+ }}
+ >
+ {itemNode}
+
+ );
+ }
+
+ return itemNode;
+ };
+ },
+});
diff --git a/components/vc-overflow/index.ts b/components/vc-overflow/index.ts
new file mode 100644
index 000000000..0d3724978
--- /dev/null
+++ b/components/vc-overflow/index.ts
@@ -0,0 +1,5 @@
+// import Overflow, { OverflowProps } from './Overflow';
+
+// export { OverflowProps };
+
+// export default Overflow;
diff --git a/v2-doc b/v2-doc
index d19705328..a7013ae87 160000
--- a/v2-doc
+++ b/v2-doc
@@ -1 +1 @@
-Subproject commit d197053285b81e77718621c0b5b94cb3b21831a2
+Subproject commit a7013ae87f69dcbcf547f4b023255b8a7a775557