Skip to content

[navigation menu] Keep focus on trigger when opening - #5479

Open
atomiks wants to merge 1 commit into
mui:masterfrom
atomiks:codex/fix-navigation-menu-trigger-focus
Open

[navigation menu] Keep focus on trigger when opening#5479
atomiks wants to merge 1 commit into
mui:masterfrom
atomiks:codex/fix-navigation-menu-trigger-focus

Conversation

@atomiks

@atomiks atomiks commented Aug 13, 2026

Copy link
Copy Markdown
Contributor

Related to #5413

Opening Navigation Menu with the keyboard currently schedules focus into the first content link on the next animation frame. This makes Enter, Space, and ArrowDown behave like menu entry instead of a disclosure trigger.

Context

The APG disclosure navigation example treats arrow-key navigation as optional and keeps normal Tab navigation through the controls and links. We can therefore retain the composite arrow behavior familiar from Radix Navigation Menu without coupling keyboard opening to an automatic focus move.

As real-world precedents, Apple keeps focus on its disclosure control when opening the global navigation, while Stripe combines composite arrows with the behavior in this PR: ArrowDown opens the focused disclosure, focus remains on its trigger, and Tab enters the links.

Changes

  • Keep focus on the trigger when a keyboard interaction opens the content; Tab moves into the first link.
  • Preserve existing composite arrow navigation.
  • Remove the unused animation-frame focus machinery and add browser regression coverage.

@atomiks atomiks added type: bug It doesn't behave as expected. component: navigation menu Changes related to the navigation menu component. labels Aug 13, 2026
@pkg-pr-new

pkg-pr-new Bot commented Aug 13, 2026

Copy link
Copy Markdown

commit: a831b94

@code-infra-dashboard

code-infra-dashboard Bot commented Aug 13, 2026

Copy link
Copy Markdown

Bundle size

Bundle Parsed size Gzip size
@base-ui/react ▼-199B(-0.04%) ▼-60B(-0.04%)

Details of bundle changes

Performance

Total duration: 1,462.15 ms -6.54 ms(-0.4%) | Renders: 76 (+0) | Paint: 2,267.70 ms -65.45 ms(-2.8%)

No significant changes — details


Check out the code infra dashboard for more information about this PR.

@netlify

netlify Bot commented Aug 13, 2026

Copy link
Copy Markdown

Deploy Preview for base-ui ready!

Name Link
🔨 Latest commit a831b94
🔍 Latest deploy log https://app.netlify.com/projects/base-ui/deploys/6a7d39974c2ec5000808c7c2
😎 Deploy Preview https://deploy-preview-5479--base-ui.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
🤖 Make changes Run an agent on this branch

To edit notification comments on pull requests, go to your Netlify project configuration.

@atomiks
atomiks marked this pull request as ready for review August 13, 2026 03:44
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

component: navigation menu Changes related to the navigation menu component. type: bug It doesn't behave as expected.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant