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
What package within Headless UI are you using? @headlessui/react
What version of that package are you using? 2.1.2
What browser are you using?
Chrome, Firefox, Safari, etc (shouldn't be browser specific)
Reproduction URL
We are using the ComboBox component, with options, and with a div inside the combobox but not in an option.
<ComboBox>
<ComboBoxInput />
<div>text and button here</div>
<ComboBoxOption>OPTION 1</ComboBoxOption>
</ComboBox>
Describe your issue
We have a combo box with an input inside of it, then we have a title bar that contains a button and helpful text describe how to use the combo box, then options may show under the title box. Our title box is just a DIV element, but looking at the useInertOther code and other references of inert. Some reason the div inside the combo box becomes a target to receive the inert data attribute. This is undesirable because we should be able to add an arbitrary div to the combo box that we may style/use in whatever way. Right now it receives a side effect from the rogue useInertOther hook. Unfortunately, I cannot share the code base and I don't have enough time to replicate the issue currently. If this issue gains traction, I'd be happy to collaborate & produce a working example of the bug. Thank you so much for taking the time to read this bug description and considering a fix. Much love <3
The text was updated successfully, but these errors were encountered:
Adding a use case that justifies removing this, or at least allowing us to not have inert added on some elements:
This Combobox allows users to remove selected options by clicking on the × button, or clear the input clicking on the rightmost × button. The inert attribute prevents those use cases.
What package within Headless UI are you using?
@headlessui/react
What version of that package are you using?
2.1.2
What browser are you using?
Chrome, Firefox, Safari, etc (shouldn't be browser specific)
Reproduction URL
We are using the ComboBox component, with options, and with a div inside the combobox but not in an option.
Describe your issue
We have a combo box with an input inside of it, then we have a title bar that contains a button and helpful text describe how to use the combo box, then options may show under the title box. Our title box is just a DIV element, but looking at the useInertOther code and other references of inert. Some reason the div inside the combo box becomes a target to receive the inert data attribute. This is undesirable because we should be able to add an arbitrary div to the combo box that we may style/use in whatever way. Right now it receives a side effect from the rogue useInertOther hook. Unfortunately, I cannot share the code base and I don't have enough time to replicate the issue currently. If this issue gains traction, I'd be happy to collaborate & produce a working example of the bug. Thank you so much for taking the time to read this bug description and considering a fix. Much love <3
The text was updated successfully, but these errors were encountered: