Toast
v0.5.0StableA toast viewport to mount once, anywhere in the app; `showToast()` from anywhere then renders a dismissible, auto-expiring Radix toast in it.
A toast viewport to mount once, anywhere in the app; showToast() from anywhere then renders a dismissible, auto-expiring Radix toast in it.
Usage
Examples
Open all 1 →Properties
Toast props
| Prop | Type | Default | Description |
|---|---|---|---|
duration | number | 5000 | How long a toast stays visible before auto-dismissing, in ms. Defaults to 5000. |
Functions
showToast function
Queues a toast on any mounted `Toast` component. Dispatches a plain `window` event under the hood, so it's callable from anywhere with no React context required — including directly from the browser console, e.g. `showToast({ title: "Saved", variant: "success" })`.
showToast(message: Omit<ToastMessage, "id">): string| Parameter | Type | Default | Description |
|---|---|---|---|
message | Omit<ToastMessage, "id"> | — | — |
Returns string — the toast's id, which `dismissToast` takes to remove it early
dismissToast function
Removes a toast before it expires, for a message that stopped being true (an error toast after the retry succeeded). Does nothing for an id that has already expired.
dismissToast(id: string): void| Parameter | Type | Default | Description |
|---|---|---|---|
id | string | — | The id `showToast` returned |
Returns void