Calendar
A date-field calendar for selecting single dates or ranges.
Updated
Single date
const [date, setDate] = useState<Date | undefined>(new Date());
<Calendar mode="single" selected={date} onSelect={setDate} class="rounded-md border" />A date-field calendar for selecting single dates or ranges.
Installation
railbase ui add calendar
Note
railbase ui add also copies the button component — they ship alongside this component automatically.
Usage
import { Calendar } from "@/lib/ui/calendar";
const [date, setDate] = useState<Date>();
<Calendar mode="single" selected={date} onSelect={setDate} />