Calendarkit Pro V2
API Reference

TypeScript Types

Complete TypeScript type reference for all exported interfaces and types.

TypeScript Types

All types are exported from calendarkit-prov2:

import type {
  CalendarEvent,
  CalendarProps,
  ProSchedulerProps,
  ViewType,
  Resource,
  EventType,
  EventBadge,
  CustomView,
  SidebarMenuItem,
  CalendarTheme,
  CalendarTranslations,
  LanguageCode,
  EventReminder,
  EventAttachment,
  ThemeColors,
} from 'calendarkit-prov2';

ViewType

type ViewType = 'month' | 'week' | 'day' | 'agenda' | 'resource';

LanguageCode

type LanguageCode =
  | 'tr' | 'en' | 'fr' | 'de' | 'es' | 'it' | 'pt'
  | 'ar' | 'zh' | 'ja' | 'ko' | 'ru' | 'nl' | 'pl' | 'sv';

CalendarEvent

interface CalendarEvent {
  id:           string;
  title:        string;
  start:        Date;
  end:          Date;
  description?: string;
  color?:       string;
  allDay?:      boolean;
  calendarId?:  string;
  resourceId?:  string;
  type?:        string;
  icon?:        string;
  badge?:       EventBadge;            // full badge (client JSX)
  badgeId?:     BuiltInEventBadgeId;   // JSON-safe key from API (recommended)
  attachments?: EventAttachment[];
  guests?:      string[];
  reminders?:   EventReminder[];
  recurrence?: {
    freq:        'DAILY' | 'WEEKLY' | 'MONTHLY' | 'YEARLY';
    interval?:   number;
    count?:      number;
    until?:      Date;
    byweekday?:  number[];
  };
  [key: string]: any; // extensible
}

EventBadge / BuiltInEventBadgeId

Optional badge shown in the top-left corner of Week view event cards. Prefer badgeId for JSON APIs. See Event Badges.

interface EventBadge {
  icon: React.ReactNode; // Lucide icon, SVG, or any JSX
  name: string;          // short label next to the icon
}

type BuiltInEventBadgeId =
  | 'privateLesson' | 'groupLesson' | 'packageLesson'
  | 'online' | 'inPerson' | 'homeVisit'
  | 'trial' | 'makeup' | 'exam' | 'workshop'
  | 'priority' | 'holiday' | 'cancelled' | 'listening';
{ "badgeId": "packageLesson" }

EventAttachment

interface EventAttachment {
  id:    string;
  name:  string;
  url?:  string;
  type:  'file' | 'link' | 'image';
  size?: string;
}

EventReminder

interface EventReminder {
  id:     string;
  type:   'notification' | 'email';
  time:   number;  // minutes before event
  label?: string;
}

Resource

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

EventType

interface EventType {
  id:      string;
  label:   string;
  color?:  string;
  icon?:   React.ReactNode;
}

CustomView

interface CustomView {
  id:         string;
  label:      string;
  icon?:      React.ReactNode;
  component:  React.ReactNode;
}

SidebarMenuItem

interface SidebarMenuItem {
  id:        string;
  label:     string;
  icon?:     React.ReactNode;
  component: React.ReactNode;
}

CalendarTheme

interface CalendarTheme {
  colors?: ThemeColors;
  fontFamily?:   string;
  borderRadius?: string;
}

interface ThemeColors {
  primary?:    string;
  secondary?:  string;
  background?: string;
  foreground?: string;
  border?:     string;
  muted?:      string;
  accent?:     string;
}

CalendarTranslations

Partial type (all fields are strings):

interface CalendarTranslations {
  // Navigation
  today: string;   month: string;   week: string;
  day: string;     agenda: string;  resource: string;

  // Actions
  create: string;         createEvent: string;  editEvent: string;
  newEvent: string;       saveChanges: string;  delete: string;
  save: string;           cancel: string;       edit: string;
  duplicate: string;      close: string;        moreOptions: string;
  addAttachment: string;  addReminder: string;

  // Form fields
  title: string;       addTitle: string;   start: string;
  end: string;         allDay: string;     description: string;
  addDescription: string; location: string; addLocation: string;
  notes: string;

  // Repeat / Recurrence
  repeat: string;      noRepeat: string;   doesNotRepeat: string;
  daily: string;       weekly: string;     monthly: string;
  yearly: string;      repeatFor: string;  times: string;
  until: string;       endRepeat: string;  never: string;
  afterOccurrences: string; onDate: string;

  // Calendar / Type
  selectCalendar: string; selectType: string;
  calendar: string;       calendars: string;
  event: string;          task: string;

  // Guests
  guests: string;       addGuests: string;   guest: string;
  guestCount: string;   guestsCount: string;
  guestAdded: string;   guestsAdded: string;
  whosJoining: string;  suggestedTimes: string;
  viewSuggestions: string; whereWillItBe: string;

  // Reminder labels
  reminderAtTime: string; reminder5min: string;
  reminder10min: string;  reminder15min: string;
  reminder30min: string;  reminder1hour: string;
  reminder2hours: string; reminder1day: string;
  reminder2days: string;  reminder1week: string;

  // Misc
  tomorrow: string;    eventCount: string;  eventsCount: string;
  timezone: string;    localTime: string;   operations: string;
  reverseTimeLabel: string; search: string; allTypes: string;
  noTitle: string;     copy: string;        clickToOpenInMaps: string;
  dateAndTime: string; reminders: string;   dragAndDrop: string;
  attachments: string; descriptionAndAttachments: string;
  locationHelpText: string; new: string;    appointmentSchedule: string;
}

CalendarProps (ProSchedulerProps)

CalendarProps and ProSchedulerProps are the same type — an alias for the <ProScheduler /> component props. See the Props Reference for the full table.

On this page