pacocoursey / cmdk

Fast, unstyled command menu React component.
https://cmdk.paco.me
MIT License
9.03k stars 258 forks source link

[Accessibility] Use id instead of children #254

Open UltimateGG opened 2 months ago

UltimateGG commented 2 months ago

Closes #253

Values were not being read aloud when selected with mouse, arrow keys, etc. This is because:

  1. The aria-activedescendant was not being updated
  2. The element with the aria-activedescendant must be focused to read the value it references aloud

Finding the selected item was previously done using a querySelector and encodeUri which is bad because if children are used instead of a string, this will not serialize well (As well as spaces, special characters, etc.). The new approach is more robust and uses the actual ID in the dom.

The focus issue is solved by changing the focus back to the command input, or outer list container when the value is updated.

vercel[bot] commented 2 months ago

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
cmdk-website ✅ Ready (Inspect) Visit Preview 💬 Add feedback May 5, 2024 5:27am