Toast auto-dismiss causes opened modal/dialog to flicker and briefly close Body

[skan7575]

Hi! I found a possible interaction issue between Toast.Provider and Modal / AlertDialog.
When a toast is visible and then auto-dismisses while a modal/dialog is already open, the modal briefly disappears or flickers. After the toast finishes closing, the modal appears again.
Expected behavior:
•
Toast auto-dismiss should not affect an already opened modal/dialog.
•
The modal/dialog should stay visible and stable while the toast is closing.
Actual behavior:
•
A toast is shown.
•
While the toast is still visible, I open a modal/dialog.
•
When the toast auto-dismisses, the modal/dialog briefly closes/disappears.
•
After the toast is removed, the modal/dialog appears again.
Setup:
•
Next.js App Router
•
@heroui/react
•
Global Toast.Provider is rendered in root layout:

[skan7575]

[

2026-07-07.14.36.12.mov

](url)

[wingkwong]

please share a minimal reproducible sandbox for us to investigate. thanks

[Dannynafide]

I had the same issue in Chrome, while everything worked correctly in Safari. The problem occurs further down the page, so you'll need to scroll down to reproduce it.

I created a minimal reproduction and attached the GitHub link here: https://github.com/Dannynafide/heroui-toast-and-modal-repro.

In my case, the issue was resolved by adding the following global style:

.modal__backdrop {
view-transition-name: heroui-modal-overlay;
}