defaultFocusedValue only applies when opening the menu via keyboard, aligning with APG examples
These changes improve accessibility and user experience, especially for keyboard navigation and complex UI interactions.
💥 BREAKING CHANGE:
Menu: new restoreFocus prop (default: true) returns focus to trigger after menu interaction. When menu expansion is controlled to allow multiple item selection, set restoreFocus={false} and manage trigger focus manually on close.
Detail
Bump @zendeskgarden/container-menu to v0.5.0
Update specs to reflect focus behavior when using defaultFocusedValue
Adds breaking change detail to v9 migration doc.
Checklist
[ ] :ok_hand: design updates will be Garden Designer approved (add the designer as a reviewer)
[x] :globe_with_meridians: demo is up-to-date (npm start)
[ ] :arrow_left: renders as expected with reversed (RTL) direction
[ ] :black_circle: renders as expected in dark mode
[ ] :metal: renders as expected with Bedrock CSS (?bedrock)
[x] :guardsman: includes new unit tests. Maintain existing coverage (always >= 96%)
[x] :wheelchair: tested for WCAG 2.1 AA accessibility compliance
[x] :memo: tested in Chrome, Firefox, Safari, and Edge
Description
This PR bumps
@zendeskgarden/container-menutov0.5.0with two key changes:Menunow returns focus to the trigger before callingonChange, improving A11y for implementations that open modals after selection (see https://github.com/zendeskgarden/react-components/pull/1931)defaultFocusedValueonly applies when opening the menu via keyboard, aligning with APG examplesThese changes improve accessibility and user experience, especially for keyboard navigation and complex UI interactions.
💥 BREAKING CHANGE:
Menu: newrestoreFocusprop (default:true) returns focus to trigger after menu interaction. When menu expansion is controlled to allow multiple item selection, setrestoreFocus={false}and manage trigger focus manually on close.Detail
@zendeskgarden/container-menutov0.5.0defaultFocusedValueChecklist
:ok_hand: design updates will be Garden Designer approved (add the designer as a reviewer)npm start):arrow_left: renders as expected with reversed (RTL) direction:black_circle: renders as expected in dark mode:metal: renders as expected with Bedrock CSS (?bedrock)