Alert
An inline message about the surface it sits on, not about the whole app.
An inline message about the surface it sits on. It stays until the underlying condition changes, so it is the right shape for a validation summary or a warning about state — not for transient confirmation of something that just happened.
Variants
Pass icon explicitly — the component does not choose one from the variant, so the icon can match the specific message rather than the severity alone.
Draft not published
Changes are saved but not live yet.
Publish failed
The domain is not verified.
Props
Alert
| Prop | Type | Default | Description |
|---|---|---|---|
variant | "default" | "destructive" | "default" | Severity. |
icon | ReactNode | — | Leading icon. Not derived from the variant — pass one that fits the message. |