Alert

import { Alert } from "@/registry/ui/default/core/alert";

export default function AlertDemo() {
  return <Alert>You can add components to your app using the cli.</Alert>;
}

<Alert variant={variant} fill={fill}>
  You can add components to your app using the cli.
</Alert>

<Alert variant="warning" fill title="Your account has been suspended." />

<Alert title="Payment Information">
  Enter your payment method to complete your purchase.
</Alert>

<Alert icon={<GlobeIcon />}>Hello world!</Alert>

<Alert
  action={<Button>Upgrade</Button>}
>
  You are currently on the free plan. Upgrade to unlock more features.
</Alert>

<AlertRoot>
  <WalletIcon />
  <div className="flex-1">
    <AlertTitle>Payment Information</AlertTitle>
    <AlertContent>
      Enter your payment method to complete your purchase.
    </AlertContent>
  </div>
  <Button variant="primary" size="sm">
    Upgrade
  </Button>
</AlertRoot>