Open heswell opened 3 months ago
Hi @heswell! 🙂
Thanks for raising this issue.
I would like to reproduce the error on my laptop (Windows) to confirm the issue, but I'm new to React and JSX.
Could you provide a repo to clone or the code I should include?
1) Why would the options need to be created dynamically? Perhaps you could have separate combo boxes with different sets of options and depending on a condition display a certain one?
Without adding options dynamically, the combo boxes work as expected in the examples they provide, so I presume that the issue is due to the component's state not being updated after the options are added.
Source code for the ComboBox component is here: https://github.com/jpmorganchase/salt-ds/blob/main/packages/core/src/combo-box/ComboBox.tsx
Package name(s)
Core (@salt-ds/core)
Package version(s)
1.27.1
Description
In a ComboBox where options list is initially empty and populated only when user begins to type , DownArrow navigation does not work. Looks like it is because Option registration in ListControlState mutates a structure held in a ref, so registrations after initial render do update the options list but do not trigger a re-render. The options count referenced in ComboBox.tsx remains 0 so ArrowDown fails
Steps to reproduce
create a ComboBox where the options are created dynamically only after the user types into the combo. Then try to navigate with ArrowDown
Expected behavior
The first Item should be highlighted
Operating system
Browser
Are you a JPMorgan Chase & Co. employee?