AlertInline messages for feedback and status.

Alert
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
import Alert, { AlertDescription } from '@/components/Alert';
export function Example() {  return (    <Alert>      <AlertDescription>        Lorem ipsum dolor sit amet, consectetur adipiscing elit.      </AlertDescription>    </Alert>  );}

Alert (with title and icon)
Lorem Information
Important information about lorem ipsum generation and usage. Please review the following details carefully.
import Alert, { AlertTitle, AlertDescription } from '@/components/Alert';import { Info } from 'lucide-react';
export function Example() {  return (    <Alert>      <Info />      <AlertTitle>Lorem Information</AlertTitle>      <AlertDescription>        Important information about lorem ipsum generation and usage.        Please review the following details carefully.      </AlertDescription>    </Alert>  );}

Alert ($type="destructive")
Lorem Error
An error occurred while processing your lorem ipsum request. Please check your input and try again.
import Alert, { AlertTitle, AlertDescription } from '@/components/Alert';import Button from '@/components/Button';import { AlertCircle } from 'lucide-react';
export function Example() {  return (    <Alert $type="destructive">      <AlertCircle />      <AlertTitle>Lorem Error</AlertTitle>      <AlertDescription>        An error occurred while processing your lorem ipsum request.        Please check your input and try again.      </AlertDescription>    </Alert>  );}

Alert ($type="warning")
Lorem Warning
Your lorem ipsum quota is running low. Consider upgrading your plan to continue generating unlimited text.
import Alert, { AlertTitle, AlertDescription } from '@/components/Alert';import { TriangleAlert } from 'lucide-react';
export function Example() {  return (    <Alert $type="warning">      <TriangleAlert />      <AlertTitle>Lorem Warning</AlertTitle>      <AlertDescription>        Your lorem ipsum quota is running low. Consider upgrading        your plan to continue generating unlimited text.      </AlertDescription>    </Alert>  );}

Alert (success example)
Lorem Success
Your lorem ipsum text has been generated successfully! You can now copy and use it in your projects.
import Alert, { AlertTitle, AlertDescription } from '@/components/Alert';import { CheckCircle } from 'lucide-react';
export function Example() {  return (    <Alert>      <CheckCircle style={{ color: 'var(--color-green-light)' }} />      <AlertTitle>Lorem Success</AlertTitle>      <AlertDescription>        Your lorem ipsum text has been generated successfully!        You can now copy and use it in your projects.      </AlertDescription>    </Alert>  );}