Calendar

<Calendar mode="single" />

function CalendarWithSelection() {
const [date, setDate] = React.useState<Date | undefined>(new Date());

return (
  <Calendar
    mode="single"
    selected={date}
    onSelect={setDate}
  />
);
}

function CalendarRange() {
const [range, setRange] = React.useState<DateRange | undefined>({
  from: new Date(2026, 2, 10),
  to: new Date(2026, 2, 18),
});

return (
  <Calendar
    mode="range"
    selected={range}
    onSelect={setRange}
    numberOfMonths={2}
  />
);
}

<Calendar
mode="single"
disabled={{ before: new Date() }}
/>

<Calendar
mode="single"
numberOfMonths={2}
/>