Options
All
  • Public
  • Public/Protected
  • All
Menu

Interface CalendarOptions<T>

Options used for calendar customization.

Type parameters

Hierarchy

  • CalendarOptions

Index

Properties

Properties

Optional allowOverlap

allowOverlap: boolean

Specifies whether the user can select a range which overlapping an other element present in the datasource.

Optional alwaysHalfDay

alwaysHalfDay: boolean

Specifies whether the beginning and the end of each range should be displayed as half selected day.

Optional clickDay

clickDay: (e: CalendarDayEventObject<T>) => void

Function fired when a day is clicked.

Type declaration

Optional contextMenuItems

contextMenuItems: CalendarContextMenuItem<T>[]

Specifies the items of the default context menu.

Optional customDataSourceRenderer

customDataSourceRenderer: (element: HTMLElement, currentDate: Date, events: T[]) => void

Specify a custom renderer for data source. Works only with the style set to "custom".

The HTML Element passed in parameter represent a sub element of the "day" div. If you need to access the "day" div, use element.parentElement.

This function is called during render for each day containing at least one event.

Type declaration

    • (element: HTMLElement, currentDate: Date, events: T[]): void

    • Parameters

      • element: HTMLElement
      • currentDate: Date
      • events: T[]

      Returns void

Optional customDayRenderer

customDayRenderer: (element: HTMLElement, currentDate: Date) => void

Specify a custom renderer for days.

The HTML Element passed in parameter represent a sub element of the "day" div. If you need to access the "day" div, use element.parentElement.

This function is called during render for each day.

Type declaration

    • (element: HTMLElement, currentDate: Date): void

    • Parameters

      • element: HTMLElement
      • currentDate: Date

      Returns void

Optional dataSource

dataSource: T[] | ((currentYear: number) => T[] | Promise<T[]>) | ((currentYear: number, done: (result: T[]) => void) => void)

The elements that must be displayed on the calendar.

Could be:

  • The datasource
  • A function that returns the datasource
  • An async function that will call the callback function with the datasource
  • An async function that returns a Promise to get the datasource

Optional dayContextMenu

dayContextMenu: (e: CalendarDayEventObject<T>) => void

Function fired when a day is right clicked.

Type declaration

Optional disabledDays

disabledDays: Date[]

The days that must be displayed as disabled.

Optional disabledWeekDays

disabledWeekDays: number[]

The days of the week that must be displayed as disabled (0 for Sunday, 1 for Monday, etc.).

Optional displayDisabledDataSource

displayDisabledDataSource: boolean

Specifies whether the data source must be rendered on disabled days.

Optional displayHeader

displayHeader: boolean

Specifies whether the calendar header is displayed.

Optional displayWeekNumber

displayWeekNumber: boolean

Specifies whether the weeks number are displayed.

Optional enableContextMenu

enableContextMenu: boolean

Specifies whether the default context menu must be displayed when right clicking on a day.

Optional enableRangeSelection

enableRangeSelection: boolean

Specifies whether the range selection is enabled.

Optional hiddenWeekDays

hiddenWeekDays: number[]

The days of the week that must not be displayed (0 for Sunday, 1 for Monday, etc.).

Optional language

language: string

The language/culture used for calendar rendering. Don't forget to import the corresponding language file. For more information, check the language section of the readme.

loadingTemplate

loadingTemplate: string | HTMLElement

The HTML used to render the loading component.

Optional maxDate

maxDate: Date

The date until which days are enabled.

Optional minDate

minDate: Date

The date from which days are enabled.

Optional mouseOnDay

mouseOnDay: (e: CalendarDayEventObject<T>) => void

Function fired when the mouse enter on a day.

Type declaration

Optional mouseOutDay

mouseOutDay: (e: CalendarDayEventObject<T>) => void

Function fired when the mouse leaves a day.

Type declaration

Optional numberMonthsDisplayed

numberMonthsDisplayed: number

The number of months displayed by the calendar.

Optional periodChanged

periodChanged: (e: CalendarPeriodChangedEventObject) => void

Function fired when the visible period of the calendar is changed.

Type declaration

Optional renderEnd

renderEnd: (e: CalendarRenderEndEventObject) => void

Function fired when the calendar rendering is ended.

Type declaration

Optional roundRangeLimits

roundRangeLimits: boolean

Specifies whether the beginning and the end of each range should be displayed as rounded cells.

Optional selectRange

selectRange: (e: CalendarRangeEventObject) => void

Function fired when a date range is selected.

Type declaration

Optional startDate

startDate: Date

The date on which the calendar should be opened. The day is not considered (only the month and the year).

Optional startYear

startYear: number

The year on which the calendar should be opened. If startDate is provided, this option will be ignored.

Optional style

style: string

Specifies the style used for displaying datasource ("background", "border" or "custom").

Optional weekStart

weekStart: number

The starting day of the week. This option overrides the parameter define in the language file.

Optional yearChanged

yearChanged: (e: CalendarYearChangedEventObject) => void

Function fired when the visible year of the calendar is changed. This function will be fired only if the calendar is used in a full year mode. Otherwise, use periodChanged event.

Type declaration

Generated using TypeDoc