useToastState
Provides state management for a toast queue. Toasts display brief, temporary notifications
of actions, errors, or other events in an application.
useToastState<T>(
(props: ToastStateProps
)): ToastState<T>
Properties
| Name | Type | Description |
visibleToasts | QueuedToast<T>[] | The visible toasts. |
Methods
| Method | Description |
add(
(content: T,
, options?: ToastOptions
)): string | Adds a new toast to the queue. |
close(
(key: string
)): void | Closes a toast. |
pauseAll(): void | Pauses the timers for all visible toasts. |
resumeAll(): void | Resumes the timers for all visible toasts. |
useToastState uses a ToastQueue under the hood, which means the queue is owned by the component that calls it. If you want to have a global toast queue outside the React tree, you can use the ToastQueue class directly. The useToastQueue hook can be used to to subscribe to a ToastQueue within a React component, and returns the same interface as described above.
Properties
| Name | Type | Description |
visibleToasts | QueuedToast<T>[] | The currently visible toasts. |
Methods
| Method | Description |
constructor(
(options?: ToastStateProps
)): void | |
subscribe(
(fn: () => void
)): () => void | Subscribes to updates to the visible toasts. |
add(
(content: T,
, options: ToastOptions
)): string | Adds a new toast to the queue. |
close(
(key: string
)): void | Closes a toast. |
pauseAll(): void | Pauses the timers for all visible toasts. |
resumeAll(): void | Resumes the timers for all visible toasts. |
clear(): void | |
See the docs for useToast in react-aria for an example of useToastState.