Nesting of dialogs is sometimes broken #3049
piotrjoniec
started this conversation in
Ideas
Replies: 1 comment
-
Hey! This is currently expected, we only support nested dialogs if they are nested in the React / Vue tree as well. This allows us to keep track of the depth of the dialogs and that way we know which one is on top and which one is behind. We want to improve this behaviour in the future, but we don't have an ETA for this yet. For now, you should use nested |
Beta Was this translation helpful? Give feedback.
0 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
What package within Headless UI are you using?
For example: @headlessui/vue
What version of that package are you using?
For example: 0.0.0-insiders.834dbf4 (Similar problems also occur on 1.7.19)
What browser are you using?
For example: Chrome
Reproduction URL
https://codesandbox.io/p/devbox/practical-fermi-l65msz
Describe your issue
Nesting of dialogs doesn't work if the dialog components aren't nested in the DOM.
So this is fine:
But this breaks:
Example of what happens in the reproduction:
There are no focusable elements inside the <FocusTrap />
- warning in the consoleBeta Was this translation helpful? Give feedback.
All reactions