کارت شناور

hover-cardکامپوننت

کارتی که با نگه‌داشتن ماوس یا فوکوس باز میشه، مناسب پیش‌نمایش پروفایل.

نصب

  1. با CLI

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

    $ npx vibefarsi add hover-card
  2. نصب دستی

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

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

استفاده

usage.tsx
1import { HoverCard } from "@/components/ui/hover-card"23<HoverCard trigger={<a href="#" className="underline">@negar</a>}>4  <ProfilePreview />5</HoverCard>

پراپ‌ها

پراپنوعپیش‌فرضتوضیح
openDelay / closeDelaynumber300 / 150تأخیر باز و بسته شدن (میلی‌ثانیه).