saturation/ui
DocsComponentsBlocksPages

Sections

IntroductionComponentsInstallationTheming

Components

ComponentsAccordionAI Chat InputAlertAnimated GroupAnimated NumberAvatarBadgeBorder TrailBreadcrumbButtonButton GroupCalendar PickerCardChartCheckboxCollapsibleComboboxCommandContext MenuCredit CardData TableDate PickerDialogDropdown MenuEmptyFieldFiltersFull CalendarGlow EffectInputInput GroupInput OTPItemKanbanKbdMenubarNovel EditorPaginationProgressProgressive BlurRadio GroupSelectSeparatorSheetSkeletonSliderSonnerSpinnerSpotlightSwitchTableTabsText EffectText ShimmerTextareaToggleToggle GroupTreeTypography
Docs/Components/Calendar Picker

Calendar Picker

A calendar component for date selection.

Loading...

Installation

pnpm dlx shadcn@latest add @saturation/calendar-picker

Usage

import { CalendarPicker } from "@/components/ui/calendar-picker"
<CalendarPicker selected={date} onSelect={setDate} />

Examples

Date Range

Loading...
Range mode selection.

Multi Month

Loading...
Multiple months displayed.

Multi Month Range

Loading...
Multi month with range.

Disabled Dates

Loading...
Disabled specific dates.

Disabled Weekends

Loading...
Disabled weekends.

Month & Year

Loading...
Month/year dropdown.

With Events

Loading...
Calendar with event list.

With Time

Loading...
Calendar with time input.

API Reference

PropTypeDefaultDescription
selectedDate | Date[]—Selected date(s).
onSelect(date: Date) => void—Selection handler.
mode"single" | "range" | "multiple""single"Selection mode.

On This Page

  • Installation
  • Usage
  • Examples
  • Date Range
  • Multi Month
  • Multi Month Range
  • Disabled Dates
  • Disabled Weekends
  • Month & Year
  • With Events
  • With Time
  • API Reference
February 2026
SuMoTuWeThFrSa
February 2026
SuMoTuWeThFrSa
February 2026
SuMoTuWeThFrSa
March 2026
SuMoTuWeThFrSa
February 2026
SuMoTuWeThFrSa
March 2026
SuMoTuWeThFrSa
February 2026
SuMoTuWeThFrSa

Dates on Feb 10-12, 20, and 25 are disabled.

February 2026
SuMoTuWeThFrSa

Weekends (Saturday and Sunday) are disabled.

Feb2026February 2026
SuMoTuWeThFrSa
February 2026
SuMoTuWeThFrSa

Thursday, February 5

Script lock deadline

deadline
February 2026
SuMoTuWeThFrSa

Selected: February 5, 2026 at 10:00