Date Range Tape

ui

Date-range calendar where the selection is a tape measure: clicking anchors the hook, moving extends a mono-ticked strip across the grid with a live night count on its free end, and confirming locks it in place or Escape recoils it to zero.

pnpm dlx shadcn@latest add "https://design.helpmarq.com/r/date-range-tape.json"

Sign In

Date Range Tape

ui

Date-range calendar where the selection is a tape measure: clicking anchors the hook, moving extends a mono-ticked strip across the grid with a live night count on its free end, and confirming locks it in place or Escape recoils it to zero.

pnpm dlx shadcn@latest add "https://design.helpmarq.com/r/date-range-tape.json"

components/ui/date-range-tape.tsx