Button

import { Button } from "@/components/ui";

1<div className="flex gap-2">
2  <Button variant="primary">Primary</Button>
3  <Button variant="secondary">Secondary</Button>
4  <Button variant="outline">Outline</Button>
5  <Button variant="ghost">Ghost</Button>
6  <Button variant="destructive">Destructive</Button>
7  <Button variant="link">Link</Button>
8</div>

1<div className="flex items-center gap-2">
2  <Button size="xs">Extra Small</Button>
3  <Button size="sm">Small</Button>
4  <Button size="md">Medium</Button>
5  <Button size="lg">Large</Button>
6  <Button size="xl">Extra Large</Button>
7</div>

1<div className="flex gap-2">
2  <Button>
3    <Mail className="mr-2 h-4 w-4" />
4    Send Email
5  </Button>
6  <Button variant="outline">
7    Download
8    <Download className="ml-2 h-4 w-4" />
9  </Button>
10</div>

1<Button loading>Processing...</Button>

1<Button asChild>
2  <Link href="/dashboard">Go to Dashboard</Link>
3</Button>