Introduction

@thaparoyal/calendar

A comprehensive calendar component library for React, Vue, Svelte, Angular, and Vanilla JS with full support for both AD (Gregorian) and BS (Bikram Sambat) calendars.

Features

• Dual Calendar Support - Seamlessly switch between AD and BS calendars with accurate conversion
• Multi-Framework - First-class support for React, Vue 3, Svelte, Angular, and Vanilla JS
• 12 Beautiful Themes - Pre-built themes with full customization support
• Advanced Selection Modes - Single date, date range, and multi-date selection
• Multi-Calendar View - Display multiple months side-by-side
• Fully Accessible - WAI-ARIA compliant with keyboard navigation
• shadcn-style API - Customize with classNames and components props

Quick Start

# Install the React package
npm install @thaparoyal/calendar-react @thaparoyal/calendar-core

# Or use the CLI
npx @thaparoyal/calendar-cli

import { Calendar } from '@thaparoyal/calendar-react';
import '@thaparoyal/calendar-core/themes/themes.css';

function MyCalendar() {
  const [date, setDate] = useState(null);

  return (
    <Calendar.Root
      config={{ calendarType: 'BS', locale: 'en' }}
      value={date}
      onValueChange={setDate}
    >
      <Calendar.Header>
        <Calendar.PrevButton />
        <Calendar.Title />
        <Calendar.NextButton />
      </Calendar.Header>
      <Calendar.Grid>
        <Calendar.GridHead />
        <Calendar.GridBody />
      </Calendar.Grid>
    </Calendar.Root>
  );
}

Packages

Package	Description
@thaparoyal/calendar-core	Core utilities, converters, and themes
@thaparoyal/calendar-react	React components
@thaparoyal/calendar-vue	Vue 3 components
@thaparoyal/calendar-svelte	Svelte components
@thaparoyal/calendar-angular	Angular services
@thaparoyal/calendar-vanilla	Vanilla JS API
@thaparoyal/calendar-cli	CLI tooling