defaultHighlightedIndex will select disabled items
jsvossen opened this issue · comments
downshift
version: 9.0.0node
version: 18.18.2npm
(oryarn
) version: 9.8.1
Relevant code or config
useCombobox({
isItemDisabled: () => true,
defaultHighlightedIndex: 0,
...
})
What you did:
Set defaultHighlightedIndex={0}
with items that are disabled.
What happened:
The disabled item is automatically highlighted, and can be selected by pressing enter.
Reproduction repository:
https://codesandbox.io/p/sandbox/determined-euler-jllv45
Problem description:
defaultHighlightedIndex
should not be able to select items that are disabled.
Suggested solution:
Check isItemDisabled
before applying highlighted styles or returning the selected item.
Thanks for the fix, but we're still seeing issues with disabled items getting selected. #1587 fixed selected items on open, but if you start typing and the list filters, the first item is still getting highlighted and is selectable by pressing enter.
https://codesandbox.io/p/sandbox/determined-euler-jllv45?file=%2Fsrc%2Findex.tsx%3A19%2C58