Alert
Displays a callout for user attention.
Your payment of $29.99 has been processed. A receipt has been sent to your email address.
We've added dark mode support. You can enable it in your account settings.
Usage
import {(Alert, AlertAction, AlertDescription, AlertTitle)} from "@tulip-systems/core/components";<Alert>
<InfoIcon />
<AlertTitle>Heads up!</AlertTitle>
<AlertDescription>
You can add components and dependencies to your app using the cli.
</AlertDescription>
<AlertAction>
<Button variant="outline">Enable</Button>
</AlertAction>
</Alert>Examples
Basic
A basic alert with an icon, title and description.
Your profile information has been saved. Changes will be reflected immediately.
Destructive
Use variant="destructive" to create a destructive alert.
Your payment could not be processed. Please check your payment method and try again.
Action
Use AlertAction to add a button or other action element to the alert.
Custom Colors
You can customize the alert colors by adding custom classes such as
bg-amber-50 dark:bg-amber-950 to the Alert component.
Renew now to avoid service interruption or upgrade to a paid plan to continue using the service.