Add optional shouldFocusOnHover prop to aria combobox
No issue to close, but solves this discussion! https://github.com/adobe/react-spectrum/discussions/7045
โ Pull Request Checklist:
- [x] Included link to corresponding React Spectrum GitHub Issue.
- [ ] Added/updated unit tests and storybook for this change (for new code or code which already has tests).
- [ ] Filled out test instructions.
- [x] Updated documentation (if it already exists for this component).
- [x] Looked at the Accessibility Practices for this feature - Aria Practices
๐ Test Instructions:
๐งข Your Project:
Wouldn't this result in there being multiple highlighted items at once? e.g. one that you focused with the keyboard and one that you hovered over. By focusing the item on hover we ensure that there is only ever one highlighted item at a time. That matches the behavior of native <select>, menus, etc. Is the behavior you're looking to disable actually the selecting of an item on Tab rather than focusing on hover?
@devongovett I'm looking to stop a use case where the user opens the menu, hovers over a item and then they decide tab out. Some of our users have found it confusing that if they are just hovering over something it's automatically selecting it for them :/. With the two highlighted items question, I think we would approach that with two different color shades (one to indicate keyboard selection and one to show mouse hover). This optional prop fixes all our woes our users were having with the mouse hover ๐คญ! Please let me know what you think
@devongovett Something like this :) https://ariakit.org/components/combobox
Any chance this could be considered/merged into next release ๐ ?
I still feel like the better option would be to add a prop to prevent selecting the focused item on Tab, instead of tying this to hover only. As it is, this only prevents committing on tab if you previously hovered an item instead of using the keyboard. Seems like whether or not to commit on tab shouldn't depend on how you got to the item (hover or keyboard).
I hear you, but that is the exact thing I want haha "only preventing committing on tab if you previously hovered an item instead of using the keyboard.". With the approach of committing vs. not committing on tab, would one just pass the current focused element and detect whether it's focused/hovered via data attributes?