Components / Alert

Alert

Inline callouts that stay in the flow of a page or panel: notices, warnings, degraded states. Not for confirmations (AlertDialog) or transient feedback.

import { Alert, AlertTitle, AlertDescription } from '@layers/ui/alert'

Rendered stock

House rules

• The icon is a direct child of Alert, before AlertTitle; the built-in grid aligns it. No wrapper divs.
• Degraded states are shown honestly ("data unavailable"), never faked or silently swallowed.
• Two variants only: default and destructive. No custom color styling on top.