(Uncontrolled) Menu defaultSelectedKeys does not handle state internally
- Dominant language
- TypeScript
- Stars
- 15.9k
- Forks
- 1.6k
- Avg merge
- 3d 9m
- Merged PRs (30d)
- 59
Description
### Provide a general summary of the issue here
When using the `Menu` component and setting `defaultSelectedKeys`, the specified key(s) are selected, but further interaction changes nothing.
### 🤔 Expected Behavior?
Just like other UI, using `default...` props should set the initial state(s) and handle interaction states.
### 😯 Current Behavior
https://stackblitz.com/edit/vitejs-vite-lpzaptkr?file=src%2FApp.tsx
In the link above, I've created a simple "Text Align" menu:
```tsx
Text align
Left
Center
Right
```
I also tested `react-aria-components` [as far back as 1.3.0](https://stackblitz.com/edit/vitejs-vite-k9oryptr?file=src%2FApp.tsx) and had the same experience.
### 💁 Possible Solution
When using `defaultSelectedKeys`, the component should know to handle state internally.
### 🔦 Context
_No response_
### 🖥️ Steps to Reproduce
1. On initial load, press the trigger to open the menu
2. Inspect the "center" item, and notice `aria-checked="true" data-selected="true"`
3. Select either of the other items, which _should_ select that item and close the menu.
4. Press the trigger again.
5. Inspect the items, and notice that only "center" is selected.
### Version
react-aria-components 1.3.0-1.7.1
### What browsers are you seeing the problem on?
Chrome
### If other, please specify.
Also tested on Firefox and Safari
### What operating system are you using?
MacOS Sequoia 15.3.1
### 🧢 Your Company/Team
_No response_
### 🕷 Tracking Issue
_No response_
Contributor guide
Assessment
This issue has not been assessed yet.