Feedback alerts with 5 variants: default, destructive, success, warning, and info. Supports title, description, and icon slots.
Alert uses cva for 5 color variants. SVG icons placed as direct children are automatically positioned with absolute left placement. The component sets role="alert" for accessibility.
import {
Alert,
AlertTitle,
AlertDescription,
} from "@/components/ui/shared/alert"<Alert variant="success">
<AlertTitle>Success!</AlertTitle>
<AlertDescription>Your changes have been saved.</AlertDescription>
</Alert>variant"default" | "destructive" | "success" | "warning" | "info""default"Color variant for the alert
classNamestringAdditional CSS classes