API reference

Everything the <Scheduler> accepts and the types it exports. For how the pieces work together, see the guide.

Props

Types

CalendarEvent

interface CalendarEvent {
  id: string;                 // unique
  title: string;
  start: Date;                // Date, ISO string or timestamp
  end: Date;                  // all-day events: exclusive (midnight after the last day)
  allDay?: boolean;
  description?: string;
  color?: string;             // else the calendar's, else the resource's, else the theme's
  calendarId?: string;
  resourceId?: string;
  type?: string;              // one of `eventTypes`
  location?: string;          // free text, shown in the event card with a maps link
  place?: Place;              // chosen with `placeSearch`: { name, address?, lat, lon }
  guests?: string[];          // email addresses
  reminders?: EventReminder[];
  attachments?: EventAttachment[];
  draggable?: boolean;        // false: cannot be moved (default true)
  resizable?: boolean;        // false: cannot be stretched (defaults to `draggable`)
  recurrence?: {
    freq: 'DAILY' | 'WEEKLY' | 'MONTHLY' | 'YEARLY';
    interval?: number;
    count?: number;
    until?: Date;
    byweekday?: number[];     // 0 = Monday … 6 = Sunday
    exdates?: Date[];         // occurrence starts excluded from the series
  };
}

Resource

interface Resource {
  id: string;
  label: string;
  color?: string;
  avatar?: string;
}

CalendarTheme

interface CalendarTheme {
  preset?: 'calm' | 'vivid' | 'editorial'; // default 'calm'
  colors?: {
    primary?: string;
    primaryForeground?: string;
    secondary?: string;
    background?: string;
    foreground?: string;
    border?: string;
    muted?: string;
    mutedForeground?: string;
    accent?: string;
    destructive?: string;
    ring?: string;
  };
  fontFamily?: string;
  borderRadius?: string; // base radius, the others scale from it
}

Exports

// Components and helpers
export { Scheduler, photonPlaces } from 'calendarkit-pro';

// Types
export type {
  CalendarEvent,
  CalendarProps,
  CalendarTheme,
  CalendarTranslations,
  ViewType,
  EventType,
  Resource,
  EventReminder,
  EventAttachment,
  ThemeColors,
  ThemePreset,
  ColorMode,
} from 'calendarkit-pro';

// Stylesheet, for `injectStyles={false}`
import 'calendarkit-pro/styles.css';