ariakit / ariakit

Toolkit for building accessible web apps with React
https://ariakit.org
MIT License
7.91k stars 372 forks source link

Animated nested dialog not opening #2309

Closed Jackardios closed 1 year ago

Jackardios commented 1 year ago

Current behavior

I have two animated dialogs. When I try to open a nested dialog it doesn't open but instead the current dialog closes. I use @ariakit/react@0.1.4

Steps to reproduce the bug

  1. Open sandbox: https://stackblitz.com/edit/angular-p9nhel-bd7myu
  2. Click on the "show modal" button
  3. In the dialog, click on the "show nested modal" button.
  4. Instead of opening a nested dialog, the current one was closed

Expected behavior

Animated nested dialog should open

Workaround

This seems to be due to the fact that I am using the mounted state value. If the dialog is always mounted, no bug occurs: https://stackblitz.com/edit/angular-p9nhel-8dtrae

Possible solutions

No response

diegohaz commented 1 year ago

Thanks for reporting.

It does seem to be related to the mounted state. I can reproduce it even without animated.

Jackardios commented 1 year ago

@diegohaz Maybe this is related too: using open state to mount/unmount the dialog doesn't work either https://stackblitz.com/edit/angular-p9nhel-lfu41p

diegohaz commented 1 year ago

@diegohaz Maybe this is related too: using open state to mount/unmount the dialog doesn't work either https://stackblitz.com/edit/angular-p9nhel-lfu41p

Yeah, open and mounted are the same when animated is false.