Installation

Installation

Choose your preferred package manager and framework.

React

npm install @thaparoyal/calendar-react @thaparoyal/calendar-core

pnpm add @thaparoyal/calendar-react @thaparoyal/calendar-core

yarn add @thaparoyal/calendar-react @thaparoyal/calendar-core

Vue

npm install @thaparoyal/calendar-vue @thaparoyal/calendar-core

Svelte

npm install @thaparoyal/calendar-svelte @thaparoyal/calendar-core

Angular

npm install @thaparoyal/calendar-angular @thaparoyal/calendar-core

Vanilla JS

npm install @thaparoyal/calendar-vanilla @thaparoyal/calendar-core

Core Only

If you only need the date conversion utilities and don’t need UI components:

npm install @thaparoyal/calendar-core

Importing Styles

Don’t forget to import the CSS for themes:

import '@thaparoyal/calendar-core/themes/themes.css';

Or include in your CSS:

@import '@thaparoyal/calendar-core/themes/themes.css';

Using Themes

Apply a theme using the data-theme attribute:

<div data-theme="ocean">
  <Calendar.Root ... />
</div>

Available themes: default, ocean, forest, sunset, lavender, midnight, rose, mint, amber, slate, coral, indigo