You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Hey! Thank you for your bug report!
Much appreciated! 🙏
I'm missing a lot of information here so I'm going to make some guesses.
I'm assuming that you are having an issue where you are using this component in development and use something like Fast Refresh / hmr to swap out the old with the new code.
This has a potential issue where adding an item to a list changes the list and each item in it (new object reference) therefore the object equality is not guaranteed and the currently selected one is not selected anymore.
If this is your scenario, then there are 2 solutions you can use:
Instead of using the full person object as a value, you can use a primitive value like an id as the value. This will work because even if the object changes, an id of type number or string will always have the same reference 1 === 1 // true.
The other solution might be a bit nicer, but is not released yet. You can install the insiders version of Headless UI and provide a by prop to the Listbox where you basically tell the component that you are using objects, but you are compare by a certain property. This can also be a function where you can provide a custom comparator function. More info on this prop: Add by prop for Listbox, Combobox and RadioGroup #1482
If this is not your scenario, then please open a new issue with an actual minimal reproduction repo attached and some steps on reproducing the problem so that we can take a look.
What package within Headless UI are you using?
@headlessui/react
What version of that package are you using?
For example: v1.6.5
What browser are you using?
Chrome
Reproduction URL
https://tailwindui.com/components/application-ui/forms/select-menus
Describe your issue
Add an entry to the people array, refocus browser tab => no entry is selected.
The text was updated successfully, but these errors were encountered: