Registry Index

Search the catalog

Type to search items across every indexed registry, or pick a page.

ComponentReactregistry:ui1 dependency

Toast

toast

Floating notification pill fixed below the header, for app-level messages and background work.

Live, loading

Starting the live preview…

Runs in a sandboxed frame on a separate origin, in its registry's own theme. Mounted with no props — an item that paints an empty box is given its name as text, and some items need input to show anything.

Notes from the author

Toast is for app-level notifications that float above the page: an armed-state hint, an update-available message with an action, or background work still running. For a message bound to a specific surface, use Notice. The caller owns `open` and any auto-dismiss timing. Keep messages to one short sentence. For work that resolves on its own, pass `busy` (draws the spinner, sets aria-busy) with a `detail` readout and no action or dismiss -- `detail` is hidden from assistive tech because the pill is a live region and a fast-changing count would otherwise be announced on every tick. `assertive` upgrades the announcement to role=alert for a message whose moment passes.
4 other registries

Similar components

Other registries' take on toast.

@whiskeyjack

More from @whiskeyjack