MonthViewProps
Defines the properties for MonthView of the React Scheduler component
Props
The following table outlines the props for the MonthViewProps:
| Name | Type | Default | Description |
|---|---|---|---|
| cell | (props: SchedulerCellProps) => node | null | Accepts a custom React component to render individual scheduler cells. Can be configured at both the root scheduler level and individual view level. |
| cellHeader | (props: SchedulerCellHeaderProps) => node | null | Accepts a custom React component to render the content of month view date cells. Useful for adding event counts, holiday indicators, or other custom cell decorations. |
| dateFormat | string | - | Applies a specific date format to all date displays in the scheduler. If not provided, the format defaults to the current culture's standard. |
| dateHeader | (props: SchedulerDateHeaderProps) => node | null | Accepts a custom React component to render the header cells displaying dates. Can be configured at both the root scheduler level and individual view level. |
| displayDate | Date | null | Sets the starting week for month view rendering. If not specified, the view begins with the first week of the month. Useful for aligning the calendar display with custom fiscal or organizational calendars. |
| displayName | string | - | A user-friendly label for the view displayed in the view switcher. Useful when the same view type is configured with different intervals or custom settings. |
| eventTemplate | (props: EventModel) => node | null | Accepts a custom React component to render events in this specific view. View-level templates override the root-level event template when both are provided. |
| firstDayOfWeek | number | 0 | Sets which day appears first in scheduler(0 = Sunday, 1 = Monday, etc.). Respects the locale's default unless explicitly overridden. |
| interval | number | 1 | Multiplies the view's time range by this number (e.g., interval: 2 shows 2 weeks in Week view). Useful for displaying extended periods in a single view. |
| maxEventsPerRow | number | null | Limits the number of events displayed per row in month view cells. Excess events are collapsed into a "+n more" indicator to conserve space. |
| name | string | - | A unique identifier for the view used in programmatic view switching. Custom names allow flexible view management without relying on standard view names. |
| numberOfWeeks | number | null | Restricts the number of weeks displayed in month view, allowing partial month display. Combine with displayDate to show custom date ranges like a 2-week preview. |
| readOnly | boolean | false | Renders the scheduler in a non-editable state, preventing all add, edit, and delete operations. Event viewing and navigation remain fully functional. |
| showTrailingAndLeadingDates | boolean | true | Controls whether grayed-out dates from the previous and next months appear in month view. Set to false to show only the current month's dates for a cleaner appearance. |
| showWeekNumber | boolean | false | Displays the ISO week number in the scheduler's header or date labels. Useful for tracking weeks across multiple months or years. |
| showWeekend | boolean | true | When set to |
| timeFormat | string | - | Applies a specific time format to all time displays in the scheduler. If not provided, the format defaults to the current culture's standard. |
| weekDay | (props: SchedulerWeekDayProps) => node | null | Accepts a custom React component to render weekday headers (Monday, Tuesday, etc.) in month view. Enables custom styling or localization of day names. |
| workDays | number[] | [1, 2, 3, 4, 5] | Specifies which days of the week are considered working days. Only these days appear in the work week view; other views highlight them with a distinct style. |