Fix ListboxOptions being incorrectly marked as inert

[RobinMalfait]

This PR fixes an issue where the ListboxOptions component was incorrectly marked as inert.

We only mark the other elements on the page as inert once the Listbox is in a visible state. The issue is that the data.optionsElement (a reference to the DOM node) was not populated with the actual DOM node yet at the time the useInertOthers(…) hook was applied.

Due to the usage of useEvent(…), instead of useCallback(…) the internal useEffect(…) hook didn't re-run because the allowed function was already stable.

With this fix, the allowed function will change whenever its dependencies change.

Fixes: #3464

[vercel]

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

Name	Status	Preview	Comments	Updated (UTC)
headlessui-react	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Sep 9, 2024 4:41pm
headlessui-vue	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Sep 9, 2024 4:41pm