تقویم شمسی

calendarکامپوننت

تقویم شمسی با ماه و روز فارسی، جمعه‌های خاکستری و حلقه‌ی امروز، که خروجی‌اش یک Date معمولیه.

نصب

  1. با CLI

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

    $ npx vibefarsi add calendar
  2. نصب دستی

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

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

استفاده

usage.tsx
1import { Calendar } from "@/components/ui/calendar"23<Calendar defaultValue={new Date()} onChange={(d) => console.log(formatJalali(d))} />

پراپ‌ها

پراپنوعپیش‌فرضتوضیح
value / defaultValueDate | null-تاریخ انتخاب‌شده (Date میلادی معمولی).
min / maxDate-روزهای خارج از بازه غیرفعال میشن.
markWeekendbooleantrueجمعه‌ها کم‌رنگ.
compactboolean-نسخه‌ی کوچک برای پاپ‌آور.

نکته‌های راست‌چین

  • تبدیل تاریخ با الگوریتم جلالی و بدون وابستگی در lib/jalali.ts انجام میشه و سال‌های کبیسه (مثل ۱۴۰۳) درست حساب میشن.
  • هفته از شنبه شروع میشه و ستون آخر جمعه‌ست.