Component · Feedback
Toast
a transient, dismissible notification on the status axis.
Example
Playground
variant
closable
Where available
✓ React
✓ Angular
✓ Web Components
✓ Blazor
✓ Tokens
Using it
the same component, named idiomatically per target. one CSS contract underneath, so they render identically.
| Target | Reference | Package |
|---|
| React | <Toast> | @design-foundry/lucent-react |
| Angular | <lucent-toast> | @design-foundry/lucent |
| Web Components | <lucent-toast> | @design-foundry/lucent-wc |
| Blazor | <LucentToast> | DesignFoundry.Lucent |
API
| Prop | Type | Default | Description |
|---|
| title / message | string | — | toast content. |
| variant | informative | success | warning | error | informative | severity. |
| closable | boolean | true | shows the dismiss button. |