نمای سال
year-viewکامپوننت تقویمدوازده ماه شمسی در یک نگاه با همهی تعطیلیها، تا برنامهریزی سفر یا انتشار نسخه دور تعطیلات با یک نگاه انجام بشه.
سال ۱۴۰۵
۲۶ روز تعطیل رسمی بهعلاوهی جمعهها
فروردین
اردیبهشت
خرداد
تیر
مرداد
شهریور
مهر
آبان
آذر
دی
بهمن
اسفند
نصب
با CLI
اگر هنوز init نکردید، اول از راهنمای نصب پروژه را آماده کنید. بعد این دستور کامپوننت و وابستگیهاش را مینویسه.
$ npx vibefarsi add year-viewنصب دستی
محتوای تب «کد» را در
components/calendar/year-view.tsxبگذارید. پیشنیاز: calendar-core.$ npm i lucide-reactکپی کل فایلregistry json
استفاده
usage.tsx
1import { YearView } from "@/components/calendar/year-view"23<YearView defaultYear={1405} events={events} onDayClick={(d) => goTo(d)} />پراپها
| پراپ | نوع | پیشفرض | توضیح |
|---|---|---|---|
| year / defaultYear | number | - | سال شمسی. |
| events | CalendarEvent[] | - | روزهایی که رویداد دارن یک نقطهی رنگی میگیرن. |
| columns | 3 | 4 | 6 | 4 | تعداد ماه در هر ردیف روی صفحهی بزرگ. |
نکتهها
- زیر عنوان، تعداد روزهای تعطیل رسمی سال بهجز جمعهها نوشته میشه.