Props Reference

The <Calendar> component accepts all fields from CalendarConfig, plus className.

All props

Prop	Type	Default	Description
events	CalendarEvent[]	required	Events to display
defaultView	CalendarView	"month"	Initial view (uncontrolled)
defaultDate	DateString	today	Initial date (uncontrolled)
view	CalendarView	—	Controlled view
date	DateString	—	Controlled date
locale	Partial<CalendarLocale>	{ locale: "en-US", weekStartsOn: 0 }	Locale settings
slots	Partial<CalendarSlots>	—	Custom component overrides
enableDnD	boolean	false	Enable drag and drop
dayStartHour	number	0	Hour the time grid starts (0-23)
dayEndHour	number	24	Hour the time grid ends (0-24)
className	string	—	Additional CSS classes

Callbacks

Callback	Signature	Description
onEventClick	(event: CalendarEvent) => void	Fired when an event is clicked
onSlotClick	(dateTime: DateTimeString) => void	Fired when an empty time slot is clicked
onEventDrop	(event: CalendarEvent, newStart: DateTimeString, newEnd: DateTimeString) => void	Fired when an event is dropped after dragging
onEventResize	(event: CalendarEvent, newStart: DateTimeString, newEnd: DateTimeString) => void	Fired when an event is resized (week/day view)
onSlotSelect	(start: DateTimeString, end: DateTimeString) => void	Fired when a time range is selected by dragging across empty slots
onDateChange	(date: DateString) => void	Fired when the visible date changes (navigation)
onViewChange	(view: CalendarView) => void	Fired when the view changes

Type definitions

CalendarEvent

interface CalendarEvent {
  id: string;
  title: string;
  start: DateTimeString;   // "2026-03-13T09:00:00"
  end: DateTimeString;     // "2026-03-13T10:00:00"
  allDay?: boolean;
  color?: string;
  recurrence?: RecurrenceRule;   // Recurring event rule
  exDates?: DateString[];        // Dates to exclude from recurrence
  recurringEventId?: string;     // Set on expanded instances (points to parent)
  originalDate?: DateString;     // Original date of this recurring instance
  [key: string]: unknown;        // Custom metadata
}

RecurrenceRule

See Recurrence for full documentation.

interface RecurrenceRule {
  freq: "daily" | "weekly" | "monthly" | "yearly";
  interval?: number;
  byDay?: RecurrenceDay[];    // "MO" | "TU" | "WE" | "TH" | "FR" | "SA" | "SU"
  byMonthDay?: number[];
  bySetPos?: number[];
  count?: number;
  until?: string;
}

CalendarView

type CalendarView = "month" | "week" | "day" | "agenda";

CalendarLocale

interface CalendarLocale {
  locale: string;          // BCP 47: "en-US", "es-ES", "ja-JP"
  weekStartsOn: 0 | 1 | 2 | 3 | 4 | 5 | 6;
  labels?: Partial<CalendarLabels>;
}

CalendarLabels

interface CalendarLabels {
  today: string;
  month: string;
  week: string;
  day: string;
  agenda: string;
  allDay: string;
  noEvents: string;
  more: (count: number) => string;
}

DateString / DateTimeString

type DateString = string;      // "2026-03-13" (YYYY-MM-DD)
type DateTimeString = string;  // "2026-03-13T09:00:00" (YYYY-MM-DDTHH:mm:ss)

CalendarSlots

See the Slots API page for detailed prop types.

interface CalendarSlots {
  toolbar?: ComponentType<ToolbarSlotProps>;
  event?: ComponentType<EventSlotProps>;
  dayCell?: ComponentType<DayCellSlotProps>;
  timeEvent?: ComponentType<TimeEventSlotProps>;
  allDayEvent?: ComponentType<AllDayEventSlotProps>;
  popover?: ComponentType<PopoverSlotProps>;
  agendaEvent?: ComponentType<AgendaEventSlotProps>;
}