Alert
An inline status banner. Warnings and errors announce with role=alert; info and success are passive status.
Examples
Tones
info
Something you should know about.
success
Something you should know about.
warning
Something you should know about.
danger
Something you should know about.
Show code
<Alert tone="success" title="Saved">Your changes have been saved.</Alert>Props
| Prop | Type | Default | Description |
|---|---|---|---|
tone | "info" | "success" | "warning" | "danger" | "info" | Tone of the banner. Warnings and errors announce with role=alert; info and success use role=status. |
title | string | — | Optional bold heading above the message. |
Any other attribute is spread onto the container. Override the role by
passing role.