نمای سال

year-viewکامپوننت تقویم

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

سال ۱۴۰۵

۲۶ روز تعطیل رسمی به‌علاوه‌ی جمعه‌ها

فروردین

اردیبهشت

خرداد

تیر

مرداد

شهریور

مهر

آبان

آذر

دی

بهمن

اسفند

نصب

  1. با CLI

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

    $ npx vibefarsi add year-view
  2. نصب دستی

    محتوای تب «کد» را در 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 / defaultYearnumber-سال شمسی.
eventsCalendarEvent[]-روزهایی که رویداد دارن یک نقطه‌ی رنگی می‌گیرن.
columns3 | 4 | 64تعداد ماه در هر ردیف روی صفحه‌ی بزرگ.

نکته‌ها

  • زیر عنوان، تعداد روزهای تعطیل رسمی سال به‌جز جمعه‌ها نوشته میشه.