headlessui
headlessui copied to clipboard
Dialog closes when clicking outside options list of Radix UI Select
What package within Headless UI are you using?
@headlessui/react
What version of that package are you using?
v2.2.0
What browser are you using?
Chrome
Reproduction URL
https://stackblitz.com/edit/sb1-n7fwwv?file=src%2Fcomponents%2FDialogForm.tsx
Describe your issue
When using a <Select> from Radix Primitives inside a Headless UI <Dialog>, clicking outside the list of options (but still within the modal content) closes the modal.
To reproduce:
- Click the "Open Form" button.
- Click "Select a Role" to open the options dropdown.
- Do not select an option. Instead, click anywhere inside the modal except inside the options dropdown (e.g., on the description text).
- The Dialog will close despite the click event being triggered from within the dialog.
This is similar to a previous issue, #2533, which has been marked as resolved.