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
I'm trying to use sonner in an app that uses HTML <dialog> elements for modals. Due to the issues described here, in order to make this work with toast notifications, I need to use createPortal() to render the <Toaster/> inside the <dialog>. However, if I do this, any toasts that are already open get reset. The "re-portaling" from one location in the DOM to another makes it lose its component state.
Would it be possible to allow Toaster to be a controlled component? That is, allow toasts and setToasts to be passed in as props. That way, I can maintain this state in the parent component which does not get remounted and therefore the <Toaster/> element can be freely moved around.
The text was updated successfully, but these errors were encountered:
I'm trying to use sonner in an app that uses HTML
<dialog>
elements for modals. Due to the issues described here, in order to make this work with toast notifications, I need to usecreatePortal()
to render the<Toaster/>
inside the<dialog>
. However, if I do this, any toasts that are already open get reset. The "re-portaling" from one location in the DOM to another makes it lose its component state.Would it be possible to allow
Toaster
to be a controlled component? That is, allowtoasts
andsetToasts
to be passed in as props. That way, I can maintain this state in the parent component which does not get remounted and therefore the<Toaster/>
element can be freely moved around.The text was updated successfully, but these errors were encountered: