A range of days, chosen in two presses
A date range picker sets a billing period, a report’s window, a booking or a leave request. The first press sets the start and the second the end, the days between preview as the pointer moves, and presets set a range in one press.
Two months
November 2026
December 2026
One month
November 2026
// From the npm package
import { DateRangePicker } from 'rift-ds/components/DateRangePicker/DateRangePicker';
// Or as source you own, via the shadcn CLI
npx shadcn@latest add https://rift-ds.com/r/date-range-picker.json