تبهای لغزان
animated-tabsانیمیشنتبهایی که نشانگر زیرشون بهنرمی به تب فعال سُر میخوره.
نصب
با CLI
اگر هنوز init نکردید، اول از راهنمای نصب پروژه را آماده کنید. بعد این دستور کامپوننت و وابستگیهاش را مینویسه.
$ npx vibefarsi add animated-tabsنصب دستی
محتوای تب «کد» را در
components/animations/animated-tabs.tsxبگذارید.$ npm i lucide-reactکپی کل فایلregistry json
استفاده
usage.tsx
1import { AnimatedTabs } from "@/components/animations/animated-tabs"23<AnimatedTabs items={["همه", "فعال", "بایگانی"]} onChange={setTab} />پراپها
| پراپ | نوع | پیشفرض | توضیح |
|---|---|---|---|
| items | string[] | - | برچسب تبها. |
| value / onChange | number | - | شاخص تب فعال. |