fix(NavigationMenu): subcontent keydown skipping item (#1217)

unovue · Aug 12, 2024 · 12af841 · 12af841
1 parent 5d994ee
commit 12af841
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 0 deletions.
diff --git a/packages/radix-vue/src/NavigationMenu/NavigationMenuContentImpl.vue b/packages/radix-vue/src/NavigationMenu/NavigationMenuContentImpl.vue
@@ -136,6 +136,10 @@ function handleEscapeKeyDown(ev: KeyboardEvent) {
 }
 
 function handleKeydown(ev: KeyboardEvent) {
+  // prevent parent menu triggering keydown event
+  if ((ev.target as HTMLElement).closest('[data-radix-navigation-menu]') !== menuContext.rootNavigationMenu.value)
+    return
+
   const isMetaKey = ev.altKey || ev.ctrlKey || ev.metaKey
   const isTabKey = ev.key === 'Tab' && !isMetaKey
   const candidates = getTabbableCandidates(ev.currentTarget as HTMLElement)

diff --git a/packages/radix-vue/src/NavigationMenu/NavigationMenuRoot.vue b/packages/radix-vue/src/NavigationMenu/NavigationMenuRoot.vue
@@ -188,6 +188,7 @@ provideNavigationMenuContext({
     :as-child="asChild"
     :data-orientation="orientation"
     :dir="dir"
+    data-radix-navigation-menu
   >
     <slot :model-value="modelValue" />
   </Primitive>

diff --git a/packages/radix-vue/src/NavigationMenu/NavigationMenuSub.vue b/packages/radix-vue/src/NavigationMenu/NavigationMenuSub.vue
@@ -101,6 +101,7 @@ provideNavigationMenuContext({
     :data-orientation="orientation"
     :as-child="props.asChild"
     :as="as"
+    data-radix-navigation-menu
   >
     <slot :model-value="modelValue" />
   </Primitive>