Views
Views Overview
CalendarKit Pro ships with five built-in calendar views.
Views
CalendarKit Pro provides five built-in views and allows you to add unlimited custom views.
| View | Key | Best for |
|---|---|---|
| Month | 'month' | High-level monthly overview |
| Week | 'week' | Most common — shows 7 days with hourly grid |
| Day | 'day' | Detailed single-day schedule |
| Agenda | 'agenda' | List of upcoming events (next 30 days) |
| Resource | 'resource' | Side-by-side columns per resource/room |
Controlled view
Pass view and onViewChange to control the active view from outside:
const [view, setView] = useState<ViewType>('week');
<ProScheduler
view={view}
onViewChange={setView}
...
/>Hide the view switcher
If you want to control the view programmatically without showing the built-in buttons:
<ProScheduler
view={view}
onViewChange={setView}
hideViewSwitcher
...
/>Custom views
You can extend the view switcher with completely custom views. See Custom Views.