Skip to content

[docs] Fix the keyboard navigation in GroupedMenu example#47842

Merged
silviuaavram merged 3 commits intomui:masterfrom
silviuaavram:docs/improve-grouped-menu-a11y
Feb 24, 2026
Merged

[docs] Fix the keyboard navigation in GroupedMenu example#47842
silviuaavram merged 3 commits intomui:masterfrom
silviuaavram:docs/improve-grouped-menu-a11y

Conversation

@silviuaavram
Copy link
Copy Markdown
Member

@silviuaavram silviuaavram commented Feb 23, 2026

Adding this property will fix the keyboard navigation for the example, by intentionally skipping non-focusable items. Also added a comment explaining why.

Preview: https://deploy-preview-47842--material-ui.netlify.app/material-ui/react-menu/#grouped-menu

Copilot AI review requested due to automatic review settings February 23, 2026 15:33
@silviuaavram silviuaavram added docs Improvements or additions to the documentation. scope: menu Changes related to the menu. needs cherry-pick The PR should be cherry-picked to master after merge. labels Feb 23, 2026
@mui-bot
Copy link
Copy Markdown

mui-bot commented Feb 23, 2026

Netlify deploy preview

https://deploy-preview-47842--material-ui.netlify.app/

Bundle size report

Bundle Parsed size Gzip size
@mui/material 0B(0.00%) 0B(0.00%)
@mui/lab 0B(0.00%) 0B(0.00%)
@mui/system 0B(0.00%) 0B(0.00%)
@mui/utils 0B(0.00%) 0B(0.00%)

Details of bundle changes

Generated by 🚫 dangerJS against be61668

Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Updates the Material UI docs “GroupedMenu” example to ensure correct keyboard navigation by preventing non-selectable list headers from being treated as highlightable menu items.

Changes:

  • Adds muiSkipListHighlight: true to the styled ListSubheader wrapper so MenuList skips it during keyboard navigation.
  • Adds an inline comment explaining why the skip flag is required.
  • Applies the same update to both the TS and JS versions of the example.

Reviewed changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated 2 comments.

File Description
docs/data/material/components/menus/GroupedMenu.tsx Attaches muiSkipListHighlight to the styled ListSubheader wrapper and documents the intent.
docs/data/material/components/menus/GroupedMenu.js Mirrors the TS change for the JS docs example.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment thread docs/data/material/components/menus/GroupedMenu.tsx Outdated
Comment thread docs/data/material/components/menus/GroupedMenu.js Outdated
@silviuaavram silviuaavram merged commit 6e9f2ab into mui:master Feb 24, 2026
19 checks passed
@silviuaavram silviuaavram deleted the docs/improve-grouped-menu-a11y branch February 24, 2026 06:49
@github-actions
Copy link
Copy Markdown

Cherry-pick PRs will be created targeting branches: v7.x

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

docs Improvements or additions to the documentation. needs cherry-pick The PR should be cherry-picked to master after merge. scope: menu Changes related to the menu. v7.x

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants