Core Features | React Calendar Documentation

📄️ Day View

This guide covers how to set up and tune the day view: which hours to show, how slot size and snap behave, and how to style cells and events for a single-day schedule.

📄️ Week view

How the week view is laid out and how to tune its hours, slot size, week start, and styling

The month view gives you a high-level picture of an entire month at once, so users can spot busy stretches and free days without scrolling through hours. This guide covers how the grid is built, how to surface week numbers, how to paint cells, and how to control which day starts the week.

PRO

📄️ Year View

This guide covers the year view - what it shows, how to turn it on, and how to tune its layout. Use it when users need a wide-angle look at twelve months at once.

PRO

📄️ Agenda View

The agenda view shows a flat, chronological list of events for a single calendar month. This guide covers when to reach for it, how its month-scoped range works, and how to customize the way each row looks.

PRO

📄️ Timeline View

This guide covers how to lay out events along a horizontal time axis with one row per resource, so users can compare schedules across rooms, vehicles, or staff at a glance.

PRO

📄️ Resources View

This guide covers how to schedule events against named resources - rooms, people, equipment - in a single-day grid where each resource gets its own column.

📄️ Navigation Bar

This guide covers the toolbar above the calendar grid - the default layout, how to swap or hide it, how to compose your own from building blocks, and how to wire custom buttons back into the calendar.

📄️ Filtering

This guide covers how to narrow the calendar to a subset of events without changing the source data: apply a predicate, stack independent filters, or wire a sidebar of group toggles.

📄️ Editing events

This guide covers mounting the event editor next to the calendar, choosing which fields users can change, and switching between sidebar and modal layouts. The editor handles the full lifecycle of an event: it opens on selection, saves edits through the calendar action pipeline, and clears the selection on close.