Type Alias ClndrTemplateData

Type declaration

• date: Date

  Date indicating the current page for convenience; This is exactly the same as interval.start.

• daysOfTheWeek: string[]

  An array of day-of-the-week abbreviations, shifted as configured by the weekStartsOn option, i.e. ['S', 'M', 'T', etc...].

• events: {
      currentPage: ClndrEvent[] | ClndrEvent[][];
      nextPage: ClndrEvent[];
      previousPage: ClndrEvent[];
  }

  The events of the current page as well as the events of the previous and next page. events.currentPage is a multidimensional array if the pagination size of the current view is greater than 1. events.previousPage and events.nextPage may be used to get the events of adjacent pages if the showAdjacent option is turned on. Currently, that option is relevant for the month view only.

  • currentPage: ClndrEvent[] | ClndrEvent[][]

  • nextPage: ClndrEvent[]

  • previousPage: ClndrEvent[]

• extras: unknown | null

  Anything supplied per the extras option.

• format: ((date: Date | string | number, formatStr: string, options?: FormatOptions) => string)

  A proxy for date-fns' format function being equipped with the locale provided to the locale option.

  See

  date-fns' format function

  • • (date, formatStr, options?): string

    • Parameters

      • date: Date | string | number
      • formatStr: string
      • Optionaloptions: FormatOptions

      Returns string

• interval: Interval

  Start and end of the current page's interval.

• items: ClndrItem[] | ClndrItem[][]

  The items of a calendar page. When the calendar is configured to display multiple pages simultaneously per a view's pagination options, items will be a multidimensional array, one array of ClndrItem objects per page.

• pages: Date[]

  When the calendar is configured to display multiple pages simultaneously per a view's pagination option, this will contain a Date object for each page referring to (the start of) each page's interval. For rendering the items of each page, the pages can be looped over and the corresponding items be rendered like this:

  Example

  pages.forEach((page, pageIndex) => {
    /*...*/ items[pageIndex].forEach(item => /*...*/) /*...*/
  })
  Copy