DEV Community

Cover image for shadcn/ui Calendar Component with Admin Timezone Support
jQueryScript
jQueryScript

Posted on

shadcn/ui Calendar Component with Admin Timezone Support

Calendar Scheduler: a React scheduling component built on shadcn/ui and date-fns that handles timezone-aware slot booking out of the box.

Key features:

  • Month, Week, Day, and Agenda view modes
  • Admin availability converts automatically to each viewer's local timezone
  • Configurable slot durations at 15, 30, or 60 minutes
  • Booked slot tracking in the rendered grid

Install it in one command via the shadcn registry, or copy the component folder manually. Works with any TypeScript-first React project that has Tailwind CSS configured.

👉 Blog Post

👉 GitHub Repo

👉 Live Demo

Top comments (0)