display contract
Toast
Transient feedback message. Slides in from the bottom-right (desktop) or top (mobile).
Variants
- default
- fill.primary background
- success
- semantic.success accent
- destructive
- semantic.destructive accent
- with-action
- Includes an undo / retry button
Sizes
- md
- 320pt wide
- lg
- 420pt wide
Slots
- icon
- Optional leading icon
- message
- Body text
- action
- Optional inline button
Example
toast.success('Project created', { action: { label: 'Open', onClick: open } })Usage rule
Default duration: 5s for info/success, 8s with action, sticky for destructive.
The full Toast contract has 4 more rules, plus the do-not patterns. Get the full recipe.