At the center of any calendar, lie the events that are planned into it. An event can have the following properties:

Event Properties

idstring or numberA unique identifier for the event.Yes
startstringThe start time of the event.Yes
endstringThe end time of the event.Yes
titlestringThe title of the event.No
descriptionstringA description of the event.No
locationstringThe location of the event.No
peoplestring[]Names of the participantsNo
calendarIdstringid of the calendar. See "calendars" sectionNo

Other properties

Since you may want to add additional properties to your events, that carry meaning in the business logic of your application, you are free to do so. The calendar will simply ignore the existence of them and return them back to you upon interacting with the events.

Event time

The calendar internally distinguishes between a few types of events. The most basic distinction between them, is whether they are timed events or full day events.

  1. Timed events - Events that have a start and end time such as:
const timedEvent = {
  id: 1,
  start: '2025-10-01 20:15',
  end: '2025-10-01 21:15',
  1. Full day events - Events that span the entire day such as:
const fullDayEvent = {
  id: 2,
  start: '2025-10-01',
  end: '2025-10-01',

Furthermore, both of these types then have the possibility to be either a single day event or a multi day event.

Though a planned future feature, the calendar does not yet support time zones. All times are assumed to be in the same time zone. If this feature is important to you, feel free to open an issue on the GitHub repository to help prioritize this feature.

Updating events

If you want to get, update or remove events after rendering the calendar, you need to use the events service plugin.


import { createCalendar } from '@schedule-x/calendar'
import '@schedule-x/theme-default/dist/index.css'
const calendar = createCalendar({
  // ... other config
  events: [
      id: 1,
      title: 'Coffee with John',
      start: '2023-11-04 10:05',
      end: '2023-11-04 10:35',
      id: 2,
      title: 'Ski trip',
      start: '2023-12-04',
      end: '2023-12-06',