هشدار

alertکامپوننت

پیام درون‌صفحه‌ای برای اطلاع، موفقیت، توجه و خطا.

پرداخت با موفقیت انجام شد

رسید به شماره‌ی ۰۹۱۲۳۴۵۶۷۸۹ پیامک شد.

موجودی انبار رو به اتمام است

از «هدفون بی‌سیم» فقط ۳ عدد باقی مانده.

نصب

  1. با CLI

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

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

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

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

استفاده

usage.tsx
1import { Alert } from "@/components/ui/alert"23<Alert variant="success" title="پرداخت با موفقیت انجام شد">رسید به شماره‌ی ۰۹۱۲۳۴۵۶۷۸۹ پیامک شد.</Alert>4<Alert variant="destructive" title="پرداخت ناموفق">موجودی کارت کافی نیست.</Alert>

پراپ‌ها

پراپنوعپیش‌فرضتوضیح
variant"info" | "success" | "warning" | "destructive""info"رنگ و آیکون.
iconComponent-آیکون سفارشی به‌جای پیش‌فرض.