نشان

badgeکامپوننت

برچسب وضعیت با متن رنگی، بدون پس‌زمینه و آیکون.

نصب

  1. با CLI

    اگر هنوز init نکردید، اول از راهنمای نصب پروژه را آماده کنید. بعد این دستور کامپوننت و وابستگی‌هاش را می‌نویسه.

    $ npx vibefarsi add badge
  2. نصب دستی

    محتوای تب «کد» را در components/ui/badge.tsx بگذارید.

    $ npm i lucide-react
    کپی کل فایلregistry json

استفاده

usage.tsx
1import { Badge } from "@/components/ui/badge"23<Badge variant="success">فعال</Badge>4<Badge variant="warning">در انتظار</Badge>

پراپ‌ها

پراپنوعپیش‌فرضتوضیح
variant"default" | "secondary" | "outline" | "success" | "warning" | "brand" | "destructive""default"رنگ متن.