diff --git a/packages/vuetify/src/components/VAutocomplete/VAutocomplete.tsx b/packages/vuetify/src/components/VAutocomplete/VAutocomplete.tsx index 59eeccb193d..f2786a5ccd8 100644 --- a/packages/vuetify/src/components/VAutocomplete/VAutocomplete.tsx +++ b/packages/vuetify/src/components/VAutocomplete/VAutocomplete.tsx @@ -140,7 +140,7 @@ export const VAutocomplete = genericComponent _menu.value, set: v => { - if (_menu.value && !v && vMenuRef.value?.ΨopenChildren) return + if (_menu.value && !v && vMenuRef.value?.ΨopenChildren.size) return _menu.value = v }, }) diff --git a/packages/vuetify/src/components/VCombobox/VCombobox.tsx b/packages/vuetify/src/components/VCombobox/VCombobox.tsx index bc1fbe1fe36..62836a211d1 100644 --- a/packages/vuetify/src/components/VCombobox/VCombobox.tsx +++ b/packages/vuetify/src/components/VCombobox/VCombobox.tsx @@ -144,7 +144,7 @@ export const VCombobox = genericComponent _menu.value, set: v => { - if (_menu.value && !v && vMenuRef.value?.ΨopenChildren) return + if (_menu.value && !v && vMenuRef.value?.ΨopenChildren.size) return _menu.value = v }, }) diff --git a/packages/vuetify/src/components/VMenu/VMenu.tsx b/packages/vuetify/src/components/VMenu/VMenu.tsx index b21ae402711..acf1e75e4b5 100644 --- a/packages/vuetify/src/components/VMenu/VMenu.tsx +++ b/packages/vuetify/src/components/VMenu/VMenu.tsx @@ -13,7 +13,18 @@ import { useProxiedModel } from '@/composables/proxiedModel' import { useScopeId } from '@/composables/scopeId' // Utilities -import { computed, inject, mergeProps, nextTick, provide, ref, shallowRef, watch } from 'vue' +import { + computed, + inject, + mergeProps, + nextTick, + onBeforeUnmount, + onDeactivated, + provide, + ref, + shallowRef, + watch, +} from 'vue' import { VMenuSymbol } from './shared' import { focusableChildren, @@ -66,17 +77,17 @@ export const VMenu = genericComponent()({ const overlay = ref() const parent = inject(VMenuSymbol, null) - const openChildren = shallowRef(0) + const openChildren = shallowRef(new Set()) provide(VMenuSymbol, { register () { - ++openChildren.value + openChildren.value.add(uid) }, unregister () { - --openChildren.value + openChildren.value.delete(uid) }, closeParents (e) { setTimeout(() => { - if (!openChildren.value && + if (!openChildren.value.size && !props.persistent && (e == null || (e && !isClickInsideElement(e, overlay.value!.contentEl!))) ) { @@ -87,6 +98,9 @@ export const VMenu = genericComponent()({ }, }) + onBeforeUnmount(() => parent?.unregister()) + onDeactivated(() => isActive.value = false) + async function onFocusIn (e: FocusEvent) { const before = e.relatedTarget as HTMLElement | null const after = e.target as HTMLElement | null diff --git a/packages/vuetify/src/components/VSelect/VSelect.tsx b/packages/vuetify/src/components/VSelect/VSelect.tsx index ef7ce95d8b9..a31744a18f4 100644 --- a/packages/vuetify/src/components/VSelect/VSelect.tsx +++ b/packages/vuetify/src/components/VSelect/VSelect.tsx @@ -146,7 +146,7 @@ export const VSelect = genericComponent _menu.value, set: v => { - if (_menu.value && !v && vMenuRef.value?.ΨopenChildren) return + if (_menu.value && !v && vMenuRef.value?.ΨopenChildren.size) return _menu.value = v }, })