Date Picker

Ready

Calendar in a popover.

Installation

$ npx @oratiq-js/ui add date-picker

Copies the component and everything it depends on into your project, then lists the npm packages to install. The code is yours after this.

Usage

import

import { DatePicker, DateRangePicker } from "@/components/ui/date-picker";

Single and range

The formatted range is wrapped in <bdi>. Without it, the bidi algorithm reorders the two dates around the dash in an RTL layout, and the range reads backwards.

View source on GitHub → components/ui/date-picker.tsx