# antuikit / Calendar

> Calendar. Adds nothing beyond `className` merging through `cn()`.

Docs: https://antuikit.com/docs/components/calendar

## Install

npx antuikit@latest init
npx antuikit@latest add calendar

## Import

import { Calendar } from "@/components/ui/calendar";

## Demos

- [Basic](https://ui.antuikit.com/embed/calendar/basic.md): The default full-size calendar, with year and month selects in the header and room in each cell for content, here each release next to its owner's avatar.
- [Card mode](https://ui.antuikit.com/embed/calendar/card.md): Set `fullscreen` to `false` for a compact calendar that fits inside a card or a sidebar.
- [Week numbers](https://ui.antuikit.com/embed/calendar/week.md): Set `showWeek` to add a week-number column, on the full-size or the compact calendar.
- [Cell content](https://ui.antuikit.com/embed/calendar/cell-render.md): Return content from `cellRender` to add it below the date in each cell, like a list of events.
- [Custom header](https://ui.antuikit.com/embed/calendar/header-render.md): Pass `headerRender` to build your own toolbar, here year and month selects and a switch between month and year grids.
- [Disabled dates](https://ui.antuikit.com/embed/calendar/disabled-date.md): Pass `disabledDate` a function that returns `true` for days that cannot be picked, like weekends.

## Rules

- antuikit components are COPIED into a project from a registry. There is no
  `antuikit` package to import components from at runtime.
- Import from `@/components/ui/calendar`, never from `antd`. antd stays for
  `theme`, `App`, the `message` / `notification` statics and type-only imports.
- Do not nest a bare `<ConfigProvider theme>` to re-theme a region. Use
  `<ThemeScope theme={...}>`, which also carries the cssVar key class that
  non-antd descendants inherit their tokens from.
- Colors, radii and spacing come from the token contract, not from hardcoded
  values: write `rounded-lg`, `px-xxs`, `bg-warning`, not the raw `var(--ant-*)`.
- `Calendar` takes every Ant Design v6 prop of the same component. The
  wrapper never narrows that surface, so anything antd documents also works here.