دکمهی آهنربایی
magnetic-buttonانیمیشندکمهای که وقتی ماوس نزدیک میشه، کمی به سمتش کشیده میشه.
نصب
با CLI
اگر هنوز init نکردید، اول از راهنمای نصب پروژه را آماده کنید. بعد این دستور کامپوننت و وابستگیهاش را مینویسه.
$ npx vibefarsi add magnetic-buttonنصب دستی
محتوای تب «کد» را در
components/animations/magnetic-button.tsxبگذارید. پیشنیاز: button.$ npm i lucide-reactکپی کل فایلregistry json
استفاده
usage.tsx
1import { MagneticButton } from "@/components/animations/magnetic-button"23<MagneticButton strength={10}>شروع کنید</MagneticButton>پراپها
| پراپ | نوع | پیشفرض | توضیح |
|---|---|---|---|
| strength | number | 10 | حداکثر جابهجایی به پیکسل. |