Naming convention: Java constant names use the {@code ENTRY_} prefix * where the underlying FullCalendar JS option uses {@code event} * (e.g., {@code ENTRY_CONTRAST_COLOR} → {@code eventContrastColor}). * Constants that provide an explicit string key via their constructor override this rule. * Deprecated constants are aliases of a renamed constant and set the same FullCalendar option. * Note: the {@code ENTRY} → {@code EVENT} substitution is applied to all occurrences of * {@code ENTRY} in the constant name, not only at the prefix. For example, * {@code DISPLAY_ENTRY_TIME} maps to {@code displayEventTime}. * *
Format objects (used by {@link #DAY_HEADER_FORMAT}, {@link #SLOT_HEADER_FORMAT},
* {@link #ENTRY_TIME_FORMAT}, {@link #LIST_DAY_FORMAT}, {@link #LIST_DAY_ALT_FORMAT},
* {@link #WEEK_NUMBER_FORMAT}, {@link #POPOVER_FORMAT}, and similar):
* pass a {@code Map
* When this option is changed for an attached calendar, the new setting only applies to newly rendered elements,
* for example after navigating to another view or period. Existing elements are not updated.
*
* @see allDayHeaderDidMount
*/
ALL_DAY_HEADER_DID_MOUNT("allDayHeaderDidMount"),
/**
* CSS classes for the inner wrapper of the cell in the header area of time grid views that labels the all-day
* section. Useful for adjusting padding.
*
* With {@code true}, the duration stays roughly the same (hourly durations are rounded down to whole days). With
* {@code false}, the duration is reset to the default all-day or timed entry duration of the target section.
*
* A newline in the text is shown as a line break in time grid views. For full control of the cell's content use
* {@link #ALL_DAY_HEADER_CONTENT}.
*
* More precisely, it is the ratio of the calendar's content area.
*
* The general entry hooks do not apply to background entries.
* Accepts a {@link JsCallback}.
*
* The color of an entry or of its entry source takes precedence, see {@link Entry#setColor(String)}. For
* foreground entries use {@link #ENTRY_COLOR}.
*
* If given as callback, it is called every time the entry data changes.
*
* When this option is changed for an attached calendar, the new setting only applies to newly rendered elements,
* for example after navigating to another view or period. Existing elements are not updated.
*
* @see backgroundEventDidMount
*/
BACKGROUND_ENTRY_DID_MOUNT("backgroundEventDidMount"),
/**
* CSS classes for the "inner" wrapper element of background entries.
*
* The general entry hooks do not apply to background entries.
* Accepts a {@link JsCallback}.
*
* The general entry hooks do not apply to background entries.
* Accepts a {@link JsCallback}.
*
* FullCalendar applies this hook in addition to the general entry hook of the same part.
* Accepts a {@link JsCallback}.
*
* FullCalendar applies this hook in addition to the general entry hook of the same part.
* Accepts a {@link JsCallback}.
*
* FullCalendar applies this hook in addition to the general entry hook of the same part.
* Accepts a {@link JsCallback}.
*
* FullCalendar applies this hook in addition to the general entry hook of the same part.
* Accepts a {@link JsCallback}.
*
* FullCalendar applies this hook in addition to the general entry hook of the same part.
* Accepts a {@link JsCallback}.
*
* FullCalendar applies this hook in addition to the general entry hook of the same part.
* Accepts a {@link JsCallback}.
*
* A custom button is only shown when its name is used in {@link #HEADER_TOOLBAR} or {@link #FOOTER_TOOLBAR}.
*
* The built-in names are the constants of {@link NativeToolbarParts}, e.g. {@link NativeToolbarParts#TODAY}. Per
* FullCalendar's types, also {@code year}, {@code month}, {@code week} and {@code day} can be overridden.
*
* Every callback ({@code click}, {@code didMount}, {@code willUnmount}, and a callback for {@code hint} or
* {@code className}) is given as {@link JsCallback} and runs in the browser only. A click handler cannot call
* server code by itself.
*
* Without this option, the FullCalendar Vaadin theme follows the CSS color-scheme of the page, which
* {@code Page#setColorScheme} sets. A stock theme follows only a {@code data-color-scheme="dark"} attribute on
* {@code }, the body or another ancestor of the calendar, not {@code Page#setColorScheme}.
*
* With the FullCalendar Vaadin theme in a Lumo application, the option cannot make a calendar light while the
* application is dark, due to technical limitations.
*
* FullCalendar applies this hook in addition to the general entry hook of the same part.
* Accepts a {@link JsCallback}.
*
* FullCalendar applies this hook in addition to the general entry hook of the same part.
* Accepts a {@link JsCallback}.
*
* FullCalendar applies this hook in addition to the general entry hook of the same part.
* Accepts a {@link JsCallback}.
*
* FullCalendar applies this hook in addition to the general entry hook of the same part.
* Accepts a {@link JsCallback}.
*
* FullCalendar applies this hook in addition to the general entry hook of the same part.
* Accepts a {@link JsCallback}.
*
* FullCalendar applies this hook in addition to the general entry hook of the same part.
* Accepts a {@link JsCallback}.
*
* Themes can change the default.
*
* A column more-link appears in time grid views when too many timed entries overlap within a day column.
* Accepts a {@link JsCallback}.
*
* A column more-link appears in time grid views when too many timed entries overlap within a day column.
* Accepts a {@link JsCallback}.
*
* Unnecessary for standard views. For a custom view with a {@code duration}, that duration is the default.
*
* Time grid day columns use {@link #DAY_LANE_CLASS} instead.
*
* When this option is changed for an attached calendar, the new setting only applies to newly rendered elements,
* for example after navigating to another view or period. Existing elements are not updated.
*
* @see dayCellDidMount
*/
DAY_CELL_DID_MOUNT("dayCellDidMount"),
/**
* Format of the date text shown in each day cell of day grid views. It affects the {@code text} value given to the
* day cell render hooks.
*
* For the first-of-month cells in the year day grid view, {@code monthStartFormat} is used instead.
*
* The generated content is inserted inside the inner-most wrapper of that area. It does not replace the cell.
*
* In a left-to-right locale, start means left and end means right. The theme decides the default.
*
* The generated content is inserted inside the inner-most wrapper of the header cell. It does not replace the cell.
*
* When this option is changed for an attached calendar, the new setting only applies to newly rendered elements,
* for example after navigating to another view or period. Existing elements are not updated.
*
* @see dayHeaderDidMount
*/
DAY_HEADER_DID_MOUNT("dayHeaderDidMount"),
/**
* CSS classes for the divider line beneath the day header cells in day grid and time grid views.
*
* When this option is changed for an attached calendar, the new setting only applies to newly rendered elements,
* for example after navigating to another view or period. Existing elements are not updated.
*
* @see dayLaneDidMount
*/
DAY_LANE_DID_MOUNT("dayLaneDidMount"),
/**
* CSS classes for the inner wrapper of a day lane. In time grid views a day lane is the vertical column of time
* slots of one day.
* Useful for adjusting padding.
*
* For time grid and timeline views use {@link #ENTRY_MAX_STACK}.
*
* For timegrid and timeline views, FullCalendar uses {@code eventMaxStack}.
*
* The option needs FullCalendar's premium {@code scrollgrid} plugin, which only {@code FullCalendarScheduler}
* loads.
*
* The narrow state shows up as {@code isNarrow} in the {@code info} of related render hooks.
*
* Each locale defines this text, see the locale page.
*
* When this option is changed for an attached calendar, the new setting only applies to entries received
* afterwards, for example after navigating to another view or period. Existing entries are not updated.
*
* @see defaultAllDay
*/
DEFAULT_ALL_DAY,
/**
* Fallback duration for all-day entries without an end. The entry is rendered with this duration. Its actual end
* stays unset (unless {@code forceEventDuration} is set).
* Only affects entries with {@code allDay} set to {@code true}, see {@link #DEFAULT_TIMED_ENTRY_DURATION} for timed
* ones.
*
* When this option is changed for an attached calendar, the new setting only applies to entries received
* afterwards, for example after navigating to another view or period. Existing entries are not updated.
*
* @see defaultAllDayEventDuration
* @see Duration Object
*/
DEFAULT_ALL_DAY_ENTRY_DURATION("defaultAllDayEventDuration"),
/**
* Fallback duration for timed entries without an end. The entry is rendered with this duration. Its actual end
* stays unset (unless {@code forceEventDuration} is set).
* Only affects entries with {@code allDay} set to {@code false}, see {@link #DEFAULT_ALL_DAY_ENTRY_DURATION} for
* all-day ones.
*
* When this option is changed for an attached calendar, the new setting only applies to entries received
* afterwards, for example after navigating to another view or period. Existing entries are not updated.
*
* @see defaultTimedEventDuration
* @see Duration Object
*/
@JsonConverter(DurationConverter.class)
DEFAULT_TIMED_ENTRY_DURATION("defaultTimedEventDuration"),
/**
* Text direction of the calendar, useful for right-to-left languages such as Arabic and Hebrew.
*
* When this option is changed for an attached calendar, it takes effect when the view is rendered again, for
* example after a view change.
*
* @see dragScroll
*/
DRAG_SCROLL,
/**
* Determines whether external elements or entries from other calendars can be dropped onto the calendar.
* Has to be enabled to receive drops from external elements.
*
* With a duration of {@code weeks}, the view is aligned to the start of the week by default. With the same time as
* {@code days}, it is not.
*
* Pass a {@code Map} or a {@code String}, not a {@link java.time.Duration}. A {@code Duration} is converted to
* hours, minutes and seconds, so it cannot express whole days or weeks. A {@code Map} such as
* {@code Map.of("days", 4)} keeps them.
*
* Use {@link #ENTRY_START_EDITABLE} and {@link #ENTRY_DURATION_EDITABLE} to change only one of them.
*
* The locale provides the default (English: "Events"). A value set here wins over it.
*
* The callback is called for every new potential drop position while the user is dragging, after
* {@link #ENTRY_OVERLAP} and {@link #ENTRY_CONSTRAINT} have allowed the position.
*
* FullCalendar sets the color on each entry's element as the CSS variable {@code --fc-event-color}. The theme's
* styles read it, so where the color shows depends on the theme. Own styles can read the variable as well.
*
* If given as callback, it is called every time the entry data changes.
*
* Background entries use their own {@code backgroundEvent*} hooks.
*
* FullCalendar sets it on each entry's element as the CSS variable {@code --fc-event-contrast-color}, which the
* theme's styles and own styles can read, like {@code --fc-event-color} of {@link #ENTRY_COLOR}.
*
* Called once per received entry, but not for entries added via the client side API. Accepts a {@link JsCallback}.
*
* When this option is changed for an attached calendar, the new setting only applies to entries received
* afterwards, for example after navigating to another view or period. Existing entries are not updated.
*
* @see eventDataTransform
*/
ENTRY_DATA_TRANSFORM("eventDataTransform"),
/**
* Called right after an entry's DOM element has been added to the DOM. Not called again when the entry data
* changes.
*
* Background entries use their own {@code backgroundEvent*} hooks.
*
* When using this option, any native event listeners registered via
* {@link FullCalendar#addEntryNativeEventListener(String, String)} are automatically
* merged into the callback.
*
* When this option is changed for an attached calendar, the new setting only applies to newly rendered elements,
* for example after navigating to another view or period. Existing elements are not updated.
*
* @see eventDidMount
*/
ENTRY_DID_MOUNT("eventDidMount"),
/**
* Default display mode for entries.
*
* Hidden entries are represented by a more-link, which by default opens a popover with them.
*
* The default puts earlier entries first, then longer ones, then all-day entries, then orders by
* title. Unless {@link #ENTRY_ORDER_STRICT} is set, FullCalendar may deviate from the order to be more compact.
*
* When {@link #DAY_MAX_ENTRIES} (dayMaxEvents) is set and a day cell overflows, a "+more" link replaces the excess
* entries.
*
* With {@code true}, a multi-day entry that spans such a cell is split. The parts before and after the overflowing
* cell are still shown and the cell itself shows the link. With {@code false}, the multi-day entry is treated as a
* unit and is hidden completely, absorbed into the "+more" link, if any cell it occupies overflows.
*
* To transform each single entry, use {@link #ENTRY_DATA_TRANSFORM} instead.
*
* The filler elements fill space in the all-day section to offset the scrollbar width of the timed section, and in
* resource timeline views when the resource rows do not fill the full height.
*
* The values are strings of comma or space separated items. Comma separated items are shown adjacent, space
* separated items with a small gap. Items are {@code title}, {@code prev}, {@code next}, {@code prevYear},
* {@code nextYear}, {@code today} or a view name like {@code dayGridMonth}.
*
* {@link NativeToolbarParts} has constants for the positions and the built-in items.
*
* When this option is changed for an attached calendar, the new setting only applies to entries received
* afterwards, for example after navigating to another view or period. Existing entries are not updated.
*
* @see forceEventDuration
*/
FORCE_ENTRY_DURATION,
/**
* Former name of {@link #FORCE_ENTRY_DURATION}: whether an end is assigned to entries that have none.
*
* @deprecated use {@link #FORCE_ENTRY_DURATION}, which sets the same FullCalendar option
*/
@Deprecated(since = "8.0.0", forRemoval = true)
FORCE_EVENT_DURATION,
/**
* FullCalendar's built-in header toolbar: the buttons and title shown at the top of the calendar. The toolbar
* is not a Vaadin component. The add-on hides it by default, and setting this option shows it.
*
* The values are strings of comma or space separated items. Comma separated items are shown adjacent, space
* separated items with a small gap. Items are {@code title}, {@code prev}, {@code next}, {@code prevYear},
* {@code nextYear}, {@code today} or a view name like {@code dayGridMonth}.
*
* {@link NativeToolbarParts} has constants for the positions and the built-in items.
*
* The title is rendered as a {@code
* Set it to match the page around the calendar so screen readers find the title at the right level.
*
* With {@code "auto"} the view takes its natural height and uses no scrollbars. With {@code "100%"} the calendar
* matches the height of its parent element.
*
* When this option is removed, the calendar gets the height that was last set with
* {@link FullCalendar#setHeight(String)}, {@code setHeightFull()} or {@code setSizeUndefined()}. This way the
* Vaadin dimensions apply again. If none of these methods was called, the calendar gets the height of the initial
* JSON options.
*
* {@code setSizeUndefined()} removes the height. FullCalendar then calculates it from {@link #ASPECT_RATIO}. If the
* initial JSON options contain a height, the calendar gets that height instead.
*
* @see FullCalendar#setHeight(String)
* @see height
*/
HEIGHT,
/**
* Days of the week to exclude from the display (0 = Sunday, 6 = Saturday).
*
* It has no effect when set on an attached calendar. Use {@link FullCalendar#gotoDate(LocalDate)} instead.
*
* @see FullCalendar#gotoDate(LocalDate)
* @see initialDate
*/
@JsonConverter(LocalDateConverter.class)
INITIAL_DATE,
/**
* The view the calendar renders on first attach. Pass a {@link CalendarView}'s
* {@link CalendarView#getClientSideValue() client-side value} (for example
* {@code CalendarViewImpl.TIME_GRID_WEEK.getClientSideValue()}).
*
* Set this before attach to skip the {@code changeView()}-after-attach workaround
* that was necessary in earlier FullCalendar versions.
*
* It has no effect when set on an attached calendar. Use {@link FullCalendar#changeView(CalendarView)} instead.
*
* @see FullCalendar#changeView(CalendarView)
* @see initialView
* @since 7.2.0
*/
INITIAL_VIEW("initialView"),
/**
* CSS classes for the week number shown inline in day grid cells.
*
* When this option is changed for an attached calendar, the new setting only applies to newly rendered elements,
* for example after navigating to another view or period. Existing elements are not updated.
*
* @see inlineWeekNumberDidMount
*/
INLINE_WEEK_NUMBER_DID_MOUNT("inlineWeekNumberDidMount"),
/**
* Called before the week number shown inline in day grid cells is removed from the DOM. Accepts a
* {@link JsCallback}.
*
* With {@code true}, the calendar fetches only when it needs to and reuses entries it
* already has, e.g. when the user switches from month to week view within the same month. With {@code false}, it
* fetches on every view switch and every date change.
*
* Called once per text, {@code level} 0 for {@link #LIST_DAY_FORMAT} and 1 for {@link #LIST_DAY_ALT_FORMAT}.
* Accepts a {@link JsCallback}.
*
* When this option is changed for an attached calendar, the new setting only applies to newly rendered elements,
* for example after navigating to another view or period. Existing elements are not updated.
*
* @see listDayHeaderDidMount
*/
LIST_DAY_HEADER_DID_MOUNT("listDayHeaderDidMount"),
/**
* CSS classes for each side of the day header in list views, the left and the right half.
*
* FullCalendar applies this hook in addition to the general entry hook of the same part.
* Accepts a {@link JsCallback}.
*
* FullCalendar applies this hook in addition to the general entry hook of the same part.
* Accepts a {@link JsCallback}.
*
* FullCalendar applies this hook in addition to the general entry hook of the same part.
* Accepts a {@link JsCallback}.
*
* FullCalendar applies this hook in addition to the general entry hook of the same part.
* Accepts a {@link JsCallback}.
*
* FullCalendar applies this hook in addition to the general entry hook of the same part.
* Accepts a {@link JsCallback}.
*
* FullCalendar applies this hook in addition to the general entry hook of the same part.
* Accepts a {@link JsCallback}.
*
* Often used to show or hide a loading indicator. With the scheduler, the callback is also called when resources
* are fetched.
*
* Each locale defines this text, see the locale page.
*
* When this option is changed for an attached calendar, the new setting only applies to newly rendered elements,
* for example after navigating to another view or period. Existing elements are not updated.
*
* @see moreLinkDidMount
*/
MORE_LINK_DID_MOUNT("moreLinkDidMount"),
/**
* Accessible hint ({@code aria-label}) for the "+N more" link. Describes what happens after the link
* opens the entry popover.
*
* A {@code String} is put after the number, so {@code "more"} shows "+3 more". A callback returns the whole text.
*
* Narrow cells and time grid columns show only the number. FullCalendar documents this option only partly or not at
* all.
*
* Use {@link #MORE_LINK_CONTENT} for full control of the link's content.
*
* The target views are derived from the views in FullCalendar's built-in header toolbar, or set explicitly by
* {@link Option#NAV_LINK_DAY_CLICK} and {@link Option#NAV_LINK_WEEK_CLICK}.
*
* By default, the user is taken to the first day view in FullCalendar's built-in header toolbar. A view name
* {@code String} navigates to that view instead. A custom function replaces the default. The user is not navigated
* automatically then.
*
* The {@code dateClick} handler is not fired for such a click.
*
* By default, the user is taken to the first week view in FullCalendar's built-in header toolbar. A view name
* {@code String} navigates to that view instead. A custom function replaces the default. The user is not navigated
* automatically then.
*
* Affects only timed entries shown on whole days: in day grid, multi-month and list views, and in timeline views
* with day-sized slots. With a threshold of 9am, an entry from 8pm to 2am appears on one day only.
*
* Useful together with a custom {@code timeZone}, where the current date can differ from the browser's.
*
* A {@link LocalDate} is sent as a date string, a {@link LocalDateTime} as UTC, like the start and end of entries.
*
* FullCalendar reads this option only when the calendar is created. So set it before the first attach.
* Changing or removing it later has no effect. This is also true when the calendar is detached and attached again.
*
* There is one exception. The browser can create the calendar again, for example on a refresh of a view with
* {@code @PreserveOnRefresh}. The new calendar starts with the last date that was set while the calendar was not
* attached. If the option was removed later, it starts without a date.
*
* @see now
*/
@JsonConverter(LocalDateConverter.class)
@JsonConverter(LocalDateTimeConverter.class)
NOW("now"),
/**
* Show a marker for the current time. It repositions itself while the calendar is shown.
* Applies to time grid and timeline views.
*
* When this option is changed for an attached calendar, the new setting only applies to newly rendered elements,
* for example after navigating to another view or period. Existing elements are not updated.
*
* @see nowIndicatorHeaderDidMount
*/
NOW_INDICATOR_HEADER_DID_MOUNT("nowIndicatorHeaderDidMount"),
/**
* Called before the now indicator arrow is removed from the DOM. Accepts a {@link JsCallback}.
*
* When this option is changed for an attached calendar, the new setting only applies to newly rendered elements,
* for example after navigating to another view or period. Existing elements are not updated.
*
* @see nowIndicatorLineDidMount
*/
NOW_INDICATOR_LINE_DID_MOUNT("nowIndicatorLineDidMount"),
/**
* Called before the now indicator line is removed from the DOM. Accepts a {@link JsCallback}.
*
* With {@code "auto"}, the indicator snaps when the slot unit is a year, month, week, day or hour. For smaller
* units, its position reflects the exact current time. With {@code false}, its position always reflects the exact
* current time.
*
* When this option is changed for an attached calendar, the new setting only applies to newly rendered elements,
* for example after navigating to another view or period. Existing elements are not updated.
*
* @see noEventsDidMount
*/
NO_ENTRIES_DID_MOUNT("noEventsDidMount"),
/**
* CSS classes for the inner padding element of the "No events to display" message of list views.
*
* There is no default content. The bundled themes supply their own icon.
*
* The button's accessible label comes from the {@code closeHint} option.
*
* With {@code true}, each source is rendered as
* soon as it is received (more renders). With {@code false}, rendering waits until all sources are received (fewer
* renders).
*
* FullCalendar applies this hook in addition to the general entry hook of the same part.
* Accepts a {@link JsCallback}.
*
* FullCalendar applies this hook in addition to the general entry hook of the same part.
* Accepts a {@link JsCallback}.
*
* FullCalendar applies this hook in addition to the general entry hook of the same part.
* Accepts a {@link JsCallback}.
*
* FullCalendar applies this hook in addition to the general entry hook of the same part.
* Accepts a {@link JsCallback}.
*
* FullCalendar applies this hook in addition to the general entry hook of the same part.
* Accepts a {@link JsCallback}.
*
* FullCalendar applies this hook in addition to the general entry hook of the same part.
* Accepts a {@link JsCallback}.
*
* Themes can change the default.
*
* A row more-link appears in row-based layouts such as day grid and timeline rows when too many entries would
* otherwise be shown.
* Accepts a {@link JsCallback}.
*
* A row more-link appears in row-based layouts such as day grid and timeline rows when too many entries would
* otherwise be shown.
* Accepts a {@link JsCallback}.
*
* The user can still scroll back to earlier times. Use {@link #SLOT_MIN_TIME} to prevent that.
*
* When this option is changed for an attached calendar, the calendar does not scroll at once. The new setting
* applies from the next change of the date range.
*
* @see scrollTime
*/
@JsonConverter(DurationConverter.class)
SCROLL_TIME,
/**
* Whether the view scrolls to {@link #SCROLL_TIME} every time the date range changes, via the API or by the user
* navigating.
*
* {@code 0} puts no restriction on the distance. A non-zero value helps to tell a selection from a date click.
* Applies to mouse interaction only.
*
* When this option is changed for an attached calendar, it takes effect when the view is rendered again, for
* example after a view change.
*
* @see selectMinDistance
*/
SELECT_MIN_DISTANCE,
/**
* Whether a placeholder entry is drawn while the user drags a selection, instead of the standard highlighting of
* each cell. Applies to timegrid views only.
*
* With a function, it is called once for every entry the selection intersects.
* Only applies when {@link #SELECTABLE} is {@code true}.
* FullCalendar 7.1.0 never calls this hook: its multi-month view does not wire the month element to it.
*
* When this option is changed for an attached calendar, the new setting only applies to newly rendered elements,
* for example after navigating to another view or period. Existing elements are not updated.
*
* @see singleMonthDidMount
*/
SINGLE_MONTH_DID_MOUNT("singleMonthDidMount"),
/**
* CSS classes for the month header in multi-month views, the title element above each month grid.
* In FullCalendar 7.1.0 {@code info.el} is {@code undefined} and the other fields are missing: its multi-month
* view never records the month element for this hook.
*
* When this option is changed for an attached calendar, the new setting only applies to newly rendered elements,
* for example after navigating to another view or period. Existing elements are not updated.
*
* @see slotHeaderDidMount
*/
SLOT_HEADER_DID_MOUNT("slotHeaderDidMount"),
/**
* CSS classes for the divider line between the time labels and the slot lanes, in time grid and timeline views.
*
* Compare {@link #TABLE_HEADER_STICKY}, which fixes the date headers at the top of the calendar to the viewport.
*
* The accepted types are {@code boolean}, number or string. What a number or string value means is not documented.
*
* When this option is changed for an attached calendar, the new setting only applies to newly rendered elements,
* for example after navigating to another view or period. Existing elements are not updated.
*
* @see slotLaneDidMount
*/
SLOT_LANE_DID_MOUNT("slotLaneDidMount"),
/**
* Called before a time slot lane is removed from the DOM. Accepts a {@link JsCallback}.
*
* List view day headings are always sticky. With {@code "auto"}, the headers are sticky when the calendar height is
* {@code auto}.
*
* The locale provides the default (English: "Timed"). A value set here wins over it.
*
* Use {@link #HEADER_TOOLBAR_CLASS} or {@link #FOOTER_TOOLBAR_CLASS} for one of them.
*
* The map key is the name to put into the toolbar strings, like the name of a custom button.
*
* The callback runs in the browser only.
*
* FullCalendar sets it only when the group contains nothing but view buttons. The locale provides the default
* (English: "Change view"), and a value set here wins over it. FullCalendar documents this option only partly or
* not at all.
*
* When this option is changed for an attached calendar, the new setting applies from the next view change. The
* view already shown is not updated.
*
* @see viewDidMount
*/
VIEW_DID_MOUNT("viewDidMount"),
/**
* Accessible label for view-switcher buttons in FullCalendar's built-in toolbar, used for view buttons that have no
* own entry in the {@code buttonHints}.
*
* When this option is changed for an attached calendar, the new setting only applies to newly rendered elements,
* for example after navigating to another view or period. Existing elements are not updated.
*
* @see weekNumberHeaderDidMount
*/
WEEK_NUMBER_HEADER_DID_MOUNT("weekNumberHeaderDidMount"),
/**
* CSS classes for the inner wrapper of the week number header in time grid views, the top-left cell above the
* time axis. Useful for adjusting padding.
*
* Each locale defines this text, see the locale page.
*
*
* {@code
* calendar.setOption(Option.ALL_DAY_DIVIDER_CLASS, "my-all-day-divider");
* }
*
* @see allDayDividerClass
*/
ALL_DAY_DIVIDER_CLASS("allDayDividerClass"),
/**
* CSS classes for the cell in the header area of time grid views that labels the all-day section.
*
*
* {@code
* calendar.setOption(Option.ALL_DAY_HEADER_CLASS, JsCallback.of("""
* function(info) {
* return info.isNarrow ? 'narrow-all-day' : '';
* }"""));
* }
*
* @see allDayHeaderClass
*/
ALL_DAY_HEADER_CLASS("allDayHeaderClass"),
/**
* Custom content for the cell in the header area of time grid views that labels the all-day section. Accepts a
* {@link JsCallback}.
*
*
* {@code
* calendar.setOption(Option.ALL_DAY_HEADER_CONTENT, JsCallback.of("""
* function(info) {
* return info.isNarrow ? 'All' : info.text;
* }"""));
* }
*
* @see allDayHeaderContent
*/
ALL_DAY_HEADER_CONTENT("allDayHeaderContent"),
/**
* Called after the cell in the header area of time grid views that labels the all-day section is added to the DOM.
* Accepts a {@link JsCallback}.
*
*
{@code
* calendar.setOption(Option.ALL_DAY_HEADER_DID_MOUNT, JsCallback.of("""
* function(info) {
* info.el.title = 'All-day entries';
* }"""));
* }
*
*
* {@code
* calendar.setOption(Option.ALL_DAY_HEADER_INNER_CLASS, JsCallback.of("""
* function(info) {
* return info.isNarrow ? 'narrow-all-day-inner' : '';
* }"""));
* }
*
* @see allDayHeaderInnerClass
*/
ALL_DAY_HEADER_INNER_CLASS("allDayHeaderInnerClass"),
/**
* Called before the cell in the header area of time grid views that labels the all-day section is removed from the
* DOM. Accepts a {@link JsCallback}.
*
*
{@code
* calendar.setOption(Option.ALL_DAY_HEADER_WILL_UNMOUNT, JsCallback.of("""
* function(info) {
* console.log('removing all-day header');
* }"""));
* }
*
* @see allDayHeaderWillUnmount
*/
ALL_DAY_HEADER_WILL_UNMOUNT("allDayHeaderWillUnmount"),
/**
* How the duration of an entry changes when it is dragged between the timed and the all-day section.
*
*
*
* @see allDayMaintainDuration
*/
ALL_DAY_MAINTAIN_DURATION,
/**
* Show or hide the all-day row at the top of the calendar. When hidden, all-day entries are not displayed
* in time grid views.
*
*
*
* @see allDaySlot
*/
ALL_DAY_SLOT,
/**
* Text of the label for the all-day section in time grid views. FullCalendar documents this option only partly or
* not at all.
*
*
* {@code
* calendar.setOption(Option.ALL_DAY_TEXT, "All day");
* }
*
* @see allDayText
*/
ALL_DAY_TEXT("allDayText"),
/**
* Width-to-height ratio of the calendar. The calendar fills the available width. Its height follows from this ratio
* (larger numbers make smaller heights).
*
*
*
* @see aspectRatio
*/
ASPECT_RATIO,
/**
* CSS classes for the outermost element of background entries.
*
*
* {@code
* calendar.setOption(Option.BACKGROUND_ENTRY_CLASS, JsCallback.of("function(info) { return info.isPast ? 'past-entry' : ''; }"));
* }
*
* @see backgroundEventClass
*/
BACKGROUND_ENTRY_CLASS("backgroundEventClass"),
/**
* Default color for all background entries. FullCalendar sets it on each background entry's outermost element as
* the CSS variable {@code --fc-event-color}, so own styles can read it.
*
*
* {@code
* calendar.setOption(Option.BACKGROUND_ENTRY_COLOR, "#ff9f89");
* }
* Own styles can tint the background with the entry color, e.g.:
* {@code
* .my-bg-entry { background-color: color-mix(in oklab, var(--fc-event-color) 20%, transparent); }
* }
*
* @see backgroundEventColor
*/
BACKGROUND_ENTRY_COLOR("backgroundEventColor"),
/**
* Custom content for background entries. The generated content is inserted inside the inner-most wrapper of the
* entry.
*
*
* {@code
* calendar.setOption(Option.BACKGROUND_ENTRY_CONTENT, JsCallback.of("function(info) { return info.event.title; }"));
* }
*
* @see backgroundEventContent
*/
BACKGROUND_ENTRY_CONTENT("backgroundEventContent"),
/**
* Called right after the element of a background entry has been added to the DOM.
* If the entry data changes, this is not called again.
* Accepts a {@link JsCallback}.
*
*
* {@code
* calendar.setOption(Option.BACKGROUND_ENTRY_DID_MOUNT, JsCallback.of("function(info) { info.el.title = info.event.title; }"));
* }
*
*
* {@code
* calendar.setOption(Option.BACKGROUND_ENTRY_INNER_CLASS, "my-entry-inner");
* }
*
* @see backgroundEventInnerClass
*/
BACKGROUND_ENTRY_INNER_CLASS("backgroundEventInnerClass"),
/**
* CSS classes for the title element within the "inner" wrapper of background entries.
*
*
* {@code
* calendar.setOption(Option.BACKGROUND_ENTRY_TITLE_CLASS, JsCallback.of("function(info) { return info.isShort ? 'compact' : ''; }"));
* }
*
* @see backgroundEventTitleClass
*/
BACKGROUND_ENTRY_TITLE_CLASS("backgroundEventTitleClass"),
/**
* Called right before the element of a background entry is removed from the DOM. Accepts a {@link JsCallback}.
*
*
* {@code
* calendar.setOption(Option.BACKGROUND_ENTRY_WILL_UNMOUNT, JsCallback.of("function(info) { info.el.title = info.event.title; }"));
* }
*
* @see backgroundEventWillUnmount
*/
BACKGROUND_ENTRY_WILL_UNMOUNT("backgroundEventWillUnmount"),
/**
* CSS classes for the element after the "inner" wrapper of block entries (rectangular, color-filled entries,
* essentially all entries except list entries).
*
*
* {@code
* calendar.setOption(Option.BLOCK_ENTRY_AFTER_CLASS, JsCallback.of("function(info) { return info.isPast ? 'past-entry' : ''; }"));
* }
*
* @see blockEventAfterClass
*/
BLOCK_ENTRY_AFTER_CLASS("blockEventAfterClass"),
/**
* CSS classes for the element before the "inner" wrapper of block entries (rectangular, color-filled entries,
* essentially all entries except list entries).
*
*
* {@code
* calendar.setOption(Option.BLOCK_ENTRY_BEFORE_CLASS, JsCallback.of("function(info) { return info.isPast ? 'past-entry' : ''; }"));
* }
*
* @see blockEventBeforeClass
*/
BLOCK_ENTRY_BEFORE_CLASS("blockEventBeforeClass"),
/**
* CSS classes for the outermost element of block entries (rectangular, color-filled entries, essentially all
* entries except list entries).
*
*
* {@code
* calendar.setOption(Option.BLOCK_ENTRY_CLASS, JsCallback.of("function(info) { return info.isPast ? 'past-entry' : ''; }"));
* }
*
* @see blockEventClass
*/
BLOCK_ENTRY_CLASS("blockEventClass"),
/**
* CSS classes for the "inner" wrapper element of block entries (rectangular, color-filled entries, essentially all
* entries except list entries).
*
*
* {@code
* calendar.setOption(Option.BLOCK_ENTRY_INNER_CLASS, "my-entry-inner");
* }
*
* @see blockEventInnerClass
*/
BLOCK_ENTRY_INNER_CLASS("blockEventInnerClass"),
/**
* CSS classes for the time element within the "inner" wrapper of block entries (rectangular, color-filled entries,
* essentially all entries except list entries).
*
*
* {@code
* calendar.setOption(Option.BLOCK_ENTRY_TIME_CLASS, JsCallback.of("function(info) { return info.isShort ? 'compact' : ''; }"));
* }
*
* @see blockEventTimeClass
*/
BLOCK_ENTRY_TIME_CLASS("blockEventTimeClass"),
/**
* CSS classes for the title element within the "inner" wrapper of block entries (rectangular, color-filled entries,
* essentially all entries except list entries).
*
*
* {@code
* calendar.setOption(Option.BLOCK_ENTRY_TITLE_CLASS, JsCallback.of("function(info) { return info.isShort ? 'compact' : ''; }"));
* }
*
* @see blockEventTitleClass
*/
BLOCK_ENTRY_TITLE_CLASS("blockEventTitleClass"),
/**
* Removes all outer borders of the calendar. Use {@link #BORDERLESS_TOP}, {@link #BORDERLESS_BOTTOM} or
* {@link #BORDERLESS_X} to remove only some of them.
*
*
* {@code
* calendar.setOption(Option.BORDERLESS, true);
* }
*
* @see borderless
*/
BORDERLESS("borderless"),
/**
* Removes only the bottom outer border of the calendar.
*
*
* {@code
* calendar.setOption(Option.BORDERLESS_BOTTOM, true);
* }
*
* @see borderlessBottom
*/
BORDERLESS_BOTTOM("borderlessBottom"),
/**
* Removes only the top outer border of the calendar.
*
*
* {@code
* calendar.setOption(Option.BORDERLESS_TOP, true);
* }
*
* @see borderlessTop
*/
BORDERLESS_TOP("borderlessTop"),
/**
* Removes the left and right outer borders of the calendar. Also indents FullCalendar's built-in toolbar to align
* with the calendar body.
*
*
* {@code
* calendar.setOption(Option.BORDERLESS_X, true);
* }
*
* @see borderlessX
*/
BORDERLESS_X("borderlessX"),
/**
* Emphasize business hours on the calendar. With {@code true} the default business hours are used
* (Monday to Friday, 9am to 5pm).
*
*
* {@code
* calendar.setOption(Option.BUSINESS_HOURS, BusinessHours.businessWeek().start(10).end(18));
* }
*
* @see businessHours
*/
@JsonConverter(BusinessHoursConverter.class)
BUSINESS_HOURS,
/**
* Defines custom buttons for FullCalendar's built-in toolbars and overrides for its own buttons.
*
*
* {@code
* calendar.setOption(Option.BUTTONS, Map.of(
* NativeToolbarParts.TODAY, Map.
*
* @see buttons
*/
BUTTONS("buttons"),
/**
* CSS classes for each individual button of FullCalendar's built-in toolbars (header and footer toolbar, see
* {@link #HEADER_TOOLBAR}).
*
*
* {@code
* calendar.setOption(Option.BUTTON_CLASS, JsCallback.of("""
* function(info) {
* return info.isSelected ? 'active-button' : '';
* }"""));
* }
*
* @see buttonClass
*/
BUTTON_CLASS("buttonClass"),
/**
* Controls whether all buttons of FullCalendar's built-in toolbars show an icon, text, or both. A single button can
* override it with the {@code display} key of its entry in {@link #BUTTONS}.
*
*
* {@code
* calendar.setOption(Option.BUTTON_DISPLAY, NativeToolbarButtonDisplay.TEXT);
* }
*
* @see buttonDisplay
*/
BUTTON_DISPLAY("buttonDisplay"),
/**
* CSS classes for each group of buttons in a section of FullCalendar's built-in toolbars. A group is a set of
* buttons separated by commas in {@link #HEADER_TOOLBAR} or {@link #FOOTER_TOOLBAR}.
*
*
* {@code
* calendar.setOption(Option.BUTTON_GROUP_CLASS, JsCallback.of("""
* function(info) {
* return info.hasSelection ? 'view-switcher' : '';
* }"""));
* }
*
* @see buttonGroupClass
*/
BUTTON_GROUP_CLASS("buttonGroupClass"),
/**
* CSS classes for the calendar's root element. FullCalendar adds them to the classes the add-on sets there.
*
*
* {@code
* calendar.setOption(Option.CALENDAR_CLASS, "booking-calendar");
* }
*
* @see ClassName Inputs
*/
CALENDAR_CLASS("class"),
/**
* Accessible hint ({@code aria-label}) for the close button of the entry popover.
*
*
*
* @see closeHint
*/
CLOSE_HINT,
/**
* Sets the color scheme of this calendar only.
*
*
* {@code
* calendar.setOption(Option.COLOR_SCHEME, "dark");
* }
*
* @see
* Themes: Color scheme
* @see colorScheme (Color Palettes: Dark Mode)
*/
COLOR_SCHEME("colorScheme"),
/**
* CSS classes for the element after the "inner" wrapper of column entries (rectangular, color-filled entries that
* render vertically: timed entries in time grid views).
*
*
* {@code
* calendar.setOption(Option.COLUMN_ENTRY_AFTER_CLASS, JsCallback.of("function(info) { return info.isPast ? 'past-entry' : ''; }"));
* }
*
* @see columnEventAfterClass
*/
COLUMN_ENTRY_AFTER_CLASS("columnEventAfterClass"),
/**
* CSS classes for the element before the "inner" wrapper of column entries (rectangular, color-filled entries that
* render vertically: timed entries in time grid views).
*
*
* {@code
* calendar.setOption(Option.COLUMN_ENTRY_BEFORE_CLASS, JsCallback.of("function(info) { return info.isPast ? 'past-entry' : ''; }"));
* }
*
* @see columnEventBeforeClass
*/
COLUMN_ENTRY_BEFORE_CLASS("columnEventBeforeClass"),
/**
* CSS classes for the outermost element of column entries (rectangular, color-filled entries that render
* vertically: timed entries in time grid views).
*
*
* {@code
* calendar.setOption(Option.COLUMN_ENTRY_CLASS, JsCallback.of("function(info) { return info.isPast ? 'past-entry' : ''; }"));
* }
*
* @see columnEventClass
*/
COLUMN_ENTRY_CLASS("columnEventClass"),
/**
* CSS classes for the "inner" wrapper element of column entries (rectangular, color-filled entries that render
* vertically: timed entries in time grid views).
*
*
* {@code
* calendar.setOption(Option.COLUMN_ENTRY_INNER_CLASS, "my-entry-inner");
* }
*
* @see columnEventInnerClass
*/
COLUMN_ENTRY_INNER_CLASS("columnEventInnerClass"),
/**
* CSS classes for the time element within the "inner" wrapper of column entries (rectangular, color-filled entries
* that render vertically: timed entries in time grid views).
*
*
* {@code
* calendar.setOption(Option.COLUMN_ENTRY_TIME_CLASS, JsCallback.of("function(info) { return info.isShort ? 'compact' : ''; }"));
* }
*
* @see columnEventTimeClass
*/
COLUMN_ENTRY_TIME_CLASS("columnEventTimeClass"),
/**
* CSS classes for the title element within the "inner" wrapper of column entries (rectangular, color-filled entries
* that render vertically: timed entries in time grid views).
*
*
* {@code
* calendar.setOption(Option.COLUMN_ENTRY_TITLE_CLASS, JsCallback.of("function(info) { return info.isShort ? 'compact' : ''; }"));
* }
*
* @see columnEventTitleClass
*/
COLUMN_ENTRY_TITLE_CLASS("columnEventTitleClass"),
/**
* Whether the title of column entries sticks to the top edge of the visible area while the user scrolls vertically
* past a long timed entry, so the title stays readable. FullCalendar documents this option only partly or not at
* all.
*
*
* {@code
* calendar.setOption(Option.COLUMN_ENTRY_TITLE_STICKY, false);
* }
*
* @see columnEventTitleSticky
*/
COLUMN_ENTRY_TITLE_STICKY("columnEventTitleSticky"),
/**
* CSS classes for the column more-link element.
*
*
* {@code
* calendar.setOption(Option.COLUMN_MORE_LINK_CLASS, "my-more-link");
* }
*
* @see columnMoreLinkClass
*/
COLUMN_MORE_LINK_CLASS("columnMoreLinkClass"),
/**
* CSS classes for the inner wrapper of the column more-link.
* Useful for adjusting padding.
*
*
* {@code
* calendar.setOption(Option.COLUMN_MORE_LINK_INNER_CLASS, "my-more-link-inner");
* }
*
* @see columnMoreLinkInnerClass
*/
COLUMN_MORE_LINK_INNER_CLASS("columnMoreLinkInnerClass"),
/**
* Height of the view area of the calendar (without header and footer). If the contents do not fit,
* scrollbars appear. With {@code "auto"} the view takes its natural height and uses no scrollbars.
*
*
*
* @see contentHeight
*/
CONTENT_HEIGHT,
/**
* Determines the first visible day of a custom view, e.g. to make it start at the start of the week or month.
* Ignored if the view's range is defined by {@code visibleRange}.
*
*
*
* @see dateAlignment
*/
DATE_ALIGNMENT,
/**
* How far the calendar navigates when prev/next is executed (toolbar buttons or the prev/next methods).
*
*
* {@code
* calendar.setOption(Option.DATE_INCREMENT, Map.of("days", 7));
* }
*
* @see dateIncrement
*/
DATE_INCREMENT,
/**
* CSS classes for the bottom area of a day cell in day grid views and in the all-day section of time grid views.
* This is where the more-link appears.
*
*
* {@code
* calendar.setOption(Option.DAY_CELL_BOTTOM_CLASS, JsCallback.of("""
* function(info) {
* return info.isToday ? 'today-bottom' : '';
* }"""));
* }
*
* @see dayCellBottomClass
*/
DAY_CELL_BOTTOM_CLASS("dayCellBottomClass"),
/**
* CSS classes for day cells in day grid views (including the all-day section of time grid views) and the
* body of the "+N more" popover.
*
*
* {@code
* calendar.setOption(Option.DAY_CELL_CLASS, JsCallback.of("function(info) { return info.isToday ? 'today-cell' : ''; }"));
* }
*
* @see dayCellClass
*/
DAY_CELL_CLASS("dayCellClass"),
/**
* Former name of {@link #DAY_CELL_CLASS}: CSS classes for day cells.
*
* @deprecated use {@link #DAY_CELL_CLASS}, which sets the same FullCalendar option. Return a class name string. FullCalendar 7 drops arrays.
* It no longer applies to time grid day columns, see {@link #DAY_LANE_CLASS}.
*/
@Deprecated(since = "8.0.0", forRemoval = true)
DAY_CELL_CLASS_NAMES("dayCellClass"),
/**
* Former name of {@link #DAY_CELL_TOP_CONTENT}: custom content for the day number area of day cells.
*
* @deprecated use {@link #DAY_CELL_TOP_CONTENT}, which sets the same FullCalendar option.
* It no longer applies to time grid day columns, which have no content hook in FullCalendar 7.
*/
@Deprecated(since = "8.0.0", forRemoval = true)
DAY_CELL_CONTENT("dayCellTopContent"),
/**
* Called right after a day cell has been added to the DOM.
*
*
* {@code
* calendar.setOption(Option.DAY_CELL_DID_MOUNT, JsCallback.of("function(info) { info.el.dataset.day = info.dayNumberText; }"));
* }
*
*
* {@code
* calendar.setOption(Option.DAY_CELL_FORMAT, Map.of("day", "2-digit"));
* }
*
* @see dayCellFormat
*/
DAY_CELL_FORMAT("dayCellFormat"),
/**
* CSS classes for the middle area of a day cell in day grid views and in the all-day section of time grid views.
* This is where the entries appear.
*
*
* {@code
* calendar.setOption(Option.DAY_CELL_INNER_CLASS, JsCallback.of("""
* function(info) {
* return info.isOther ? 'other-month-entries' : '';
* }"""));
* }
*
* @see dayCellInnerClass
*/
DAY_CELL_INNER_CLASS("dayCellInnerClass"),
/**
* CSS classes for the top area of a day cell in day grid views and in the all-day section of time grid views.
* This is where the day number appears.
*
*
* {@code
* calendar.setOption(Option.DAY_CELL_TOP_CLASS, JsCallback.of("""
* function(info) {
* return info.isToday ? 'today-top' : '';
* }"""));
* }
*
* @see dayCellTopClass
*/
DAY_CELL_TOP_CLASS("dayCellTopClass"),
/**
* Custom content for the top area of day cells (where the day number appears).
*
*
* {@code
* calendar.setOption(Option.DAY_CELL_TOP_CONTENT, JsCallback.of("function(info) { return info.dayNumberText + (info.isToday ? ' (today)' : ''); }"));
* }
*
* @see dayCellTopContent
*/
DAY_CELL_TOP_CONTENT("dayCellTopContent"),
/**
* CSS classes for the inner wrapper of the top area of a day cell (see {@link #DAY_CELL_TOP_CLASS}). This wrapper
* may be a nav link.
*
*
* {@code
* calendar.setOption(Option.DAY_CELL_TOP_INNER_CLASS, JsCallback.of("""
* function(info) {
* return info.hasNavLink ? 'linked-day-number' : '';
* }"""));
* }
*
* @see dayCellTopInnerClass
*/
DAY_CELL_TOP_INNER_CLASS("dayCellTopInnerClass"),
/**
* Called right before a day cell is removed from the DOM.
*
*
* {@code
* calendar.setOption(Option.DAY_CELL_WILL_UNMOUNT, JsCallback.of("function(info) { delete info.el.dataset.day; }"));
* }
*
* @see dayCellWillUnmount
*/
DAY_CELL_WILL_UNMOUNT("dayCellWillUnmount"),
/**
* Sets the exact number of days a view shows, regardless of {@code weekends} and {@code hiddenDays}.
* With a {@link #DURATION} instead, hidden days are omitted and the view stretches to fill the space.
*
*
* {@code
* calendar.setOption(Option.DAY_COUNT, 4);
* }
*
* @see dayCount
*/
DAY_COUNT("dayCount"),
/**
* Show or hide the day headers (column header cells). Applies to the month, time grid and day grid views.
*
*
*
* @see dayHeaders
*/
DAY_HEADERS,
/**
* Horizontal text alignment of the day header cells in day grid and time grid views, and in the header of the entry
* popover.
*
*
* {@code
* calendar.setOption(Option.DAY_HEADER_ALIGN, HeaderAlign.CENTER);
*
* calendar.setOption(Option.DAY_HEADER_ALIGN, JsCallback.of("""
* function(info) {
* return info.isNarrow ? 'center' : 'start';
* }"""));
* }
*
* @see dayHeaderAlign
*/
DAY_HEADER_ALIGN("dayHeaderAlign"),
/**
* CSS classes for day header cells (above the day cells in day grid and time grid views) and the header of
* the "+N more" popover.
*
*
* {@code
* calendar.setOption(Option.DAY_HEADER_CLASS, JsCallback.of("function(info) { return info.isToday ? 'today-header' : ''; }"));
* }
*
* @see dayHeaderClass
*/
DAY_HEADER_CLASS("dayHeaderClass"),
/**
* Former name of {@link #DAY_HEADER_CLASS}: CSS classes for day header cells.
*
* @deprecated use {@link #DAY_HEADER_CLASS}, which sets the same FullCalendar option. Return a class name string. FullCalendar 7 drops arrays.
*/
@Deprecated(since = "8.0.0", forRemoval = true)
DAY_HEADER_CLASS_NAMES("dayHeaderClass"),
/**
* Custom content for day header cells.
*
*
* {@code
* calendar.setOption(Option.DAY_HEADER_CONTENT, JsCallback.of("function(info) { return info.text.toUpperCase(); }"));
* }
*
* @see dayHeaderContent
*/
DAY_HEADER_CONTENT("dayHeaderContent"),
/**
* Called right after a day header cell has been added to the DOM.
*
*
* {@code
* calendar.setOption(Option.DAY_HEADER_DID_MOUNT, JsCallback.of("function(info) { info.el.title = info.date.toDateString(); }"));
* }
*
*
* {@code
* calendar.setOption(Option.DAY_HEADER_DIVIDER_CLASS, JsCallback.of("""
* function(info) {
* return info.isSticky ? 'sticky-divider' : '';
* }"""));
* }
*
* @see dayHeaderDividerClass
*/
DAY_HEADER_DIVIDER_CLASS("dayHeaderDividerClass"),
/**
* Format of the text in the day headers (column headings).
*
*
* {@code
* calendar.setOption(Option.DAY_HEADER_FORMAT, Map.of("weekday", "long"));
* }
*
* @see dayHeaderFormat
*/
DAY_HEADER_FORMAT,
/**
* CSS classes for the inner wrapper of the day header cells in day grid and time grid views. This wrapper may be
* a nav link.
*
*
* {@code
* calendar.setOption(Option.DAY_HEADER_INNER_CLASS, JsCallback.of("""
* function(info) {
* return info.isToday ? 'today-header' : '';
* }"""));
* }
*
* @see dayHeaderInnerClass
*/
DAY_HEADER_INNER_CLASS("dayHeaderInnerClass"),
/**
* CSS classes for the row that contains the day header cells in day grid and time grid views.
*
*
* {@code
* calendar.setOption(Option.DAY_HEADER_ROW_CLASS, "my-day-header-row");
* }
*
* @see dayHeaderRowClass
*/
DAY_HEADER_ROW_CLASS("dayHeaderRowClass"),
/**
* Called right before a day header cell is removed from the DOM.
*
*
* {@code
* calendar.setOption(Option.DAY_HEADER_WILL_UNMOUNT, JsCallback.of("function(info) { info.el.removeAttribute('title'); }"));
* }
*
* @see dayHeaderWillUnmount
*/
DAY_HEADER_WILL_UNMOUNT("dayHeaderWillUnmount"),
/**
* CSS classes for day lanes, the columns of time slots of a day in time grid views.
*
*
* {@code
* calendar.setOption(Option.DAY_LANE_CLASS, JsCallback.of("function(info) { return info.isToday ? 'today-lane' : ''; }"));
* }
*
* @see dayLaneClass
*/
DAY_LANE_CLASS("dayLaneClass"),
/**
* Called right after a day lane (column of time slots in time grid views) has been added to the DOM.
*
*
* {@code
* calendar.setOption(Option.DAY_LANE_DID_MOUNT, JsCallback.of("function(info) { info.el.dataset.date = info.date.toISOString(); }"));
* }
*
*
* {@code
* calendar.setOption(Option.DAY_LANE_INNER_CLASS, JsCallback.of("""
* function(info) {
* return info.isToday ? 'today-lane' : '';
* }"""));
* }
*
* @see dayLaneInnerClass
*/
DAY_LANE_INNER_CLASS("dayLaneInnerClass"),
/**
* Called right before a day lane (column of time slots in time grid views) is removed from the DOM.
*
*
* {@code
* calendar.setOption(Option.DAY_LANE_WILL_UNMOUNT, JsCallback.of("function(info) { delete info.el.dataset.date; }"));
* }
*
* @see dayLaneWillUnmount
*/
DAY_LANE_WILL_UNMOUNT("dayLaneWillUnmount"),
/**
* Maximum number of entries in a day cell of day grid views, not counting the "+N more" link. The rest is
* shown in a popover.
*
*
* {@code
* calendar.setOption(Option.DAY_MAX_ENTRIES, 3); // "+N more" link after 3 entries
* calendar.setOption(Option.DAY_MAX_ENTRIES, true); // as many as fit into the cell
* }
*
* @see dayMaxEvents
*/
DAY_MAX_ENTRIES("dayMaxEvents"),
/**
* Maximum number of stacked entry rows within a day in daygrid views, including the "+N more" link. The remaining
* entries are shown in a popover.
*
*
*
* @see dayMaxEventRows
*/
DAY_MAX_ENTRY_ROWS,
/**
* Former name of {@link #DAY_MAX_ENTRY_ROWS}: maximum number of stacked entry rows within a day.
*
* @deprecated use {@link #DAY_MAX_ENTRY_ROWS}, which sets the same FullCalendar option
*/
@Deprecated(since = "8.0.0", forRemoval = true)
DAY_MAX_EVENT_ROWS,
/**
* Minimum pixel width of each day cell. When the calendar gets too narrow for it, horizontal scrollbars
* appear. Applies to vertical resource views, day grid views and time grid views.
*
*
*
* @see dayMinWidth
*/
DAY_MIN_WIDTH,
/**
* The pixel width of a day column below which FullCalendar switches to "narrow" date text and layouts. Affects
* views with day columns (day grid, time grid, multi-month).
*
*
* {@code
* calendar.setOption(Option.DAY_NARROW_WIDTH, 120);
* }
*
* @see dayNarrowWidth
*/
DAY_NARROW_WIDTH("dayNarrowWidth"),
/**
* Former name of {@link #POPOVER_FORMAT}: date format of the title of the "+N more" popover.
*
* @deprecated use {@link #POPOVER_FORMAT}, which sets the same FullCalendar option
*/
@Deprecated(since = "8.0.0", forRemoval = true)
DAY_POPOVER_FORMAT("popoverFormat"),
/**
* CSS classes for the horizontal day row in table-based date layouts.
*
*
* {@code
* calendar.setOption(Option.DAY_ROW_CLASS, "my-day-row");
* }
*
* @see dayRowClass
*/
DAY_ROW_CLASS("dayRowClass"),
/**
* Text of the day view button of FullCalendar's built-in toolbar. FullCalendar documents this option only partly or
* not at all.
*
*
* {@code
* calendar.setOption(Option.DAY_TEXT, "Day");
* }
*
* @see dayText (locale object)
*/
DAY_TEXT("dayText"),
/**
* Default value of the all-day flag for entries that do not specify one. If not set, FullCalendar guesses the flag
* from the entry data.
*
*
*
*
* {@code
* calendar.setOption(Option.DEFAULT_ALL_DAY_ENTRY_DURATION, Map.of("days", 2));
* }
*
*
* {@code
* calendar.setOption(Option.DEFAULT_TIMED_ENTRY_DURATION, Duration.ofHours(2));
* }
*
*
*
* @see direction
*/
DIRECTION,
/**
* Whether the end time of an entry is displayed. Entries without an end or with the entry time display turned off
* never show it.
*
*
*
* @see displayEventEnd
*/
DISPLAY_ENTRY_END,
/**
* Show or hide the time text on entries. Applies only to timed entries, all-day entries never show time text.
*
*
*
* @see displayEventTime
*/
DISPLAY_ENTRY_TIME,
/**
* Former name of {@link #DISPLAY_ENTRY_END}: whether the end time of an entry is displayed.
*
* @deprecated use {@link #DISPLAY_ENTRY_END}, which sets the same FullCalendar option
*/
@Deprecated(since = "8.0.0", forRemoval = true)
DISPLAY_EVENT_END,
/**
* Time an entry takes to move back to its original position after an unsuccessful drag.
*
*
*
* @see dragRevertDuration
*/
DRAG_REVERT_DURATION,
/**
* Automatically scroll the scroll containers while dragging entries or selecting dates, once the mouse
* gets close to the edge.
*
*
*
*
*
* @see droppable
*/
DROPPABLE,
/**
* Filters which external elements can be dropped onto the calendar (requires {@link #DROPPABLE}).
*
*
* {@code
* calendar.setOption(Option.DROP_ACCEPT, ".cool-entry");
* // or by function
* calendar.setOption(Option.DROP_ACCEPT, JsCallback.of("function(draggable) { return draggable.classList.contains('acceptable'); }"));
* }
*
* @see dropAccept
*/
DROP_ACCEPT,
/**
* Sets the exact duration of a view, for a custom view with one generic view type, e.g. four days.
*
*
* {@code
* calendar.setOption(Option.DURATION, Map.of("days", 4));
* }
*
* @see duration
* @see Duration Object
*/
DURATION("duration"),
/**
* Master switch for dragging and resizing entries. Enables or disables both at the same time. Background entries
* can not be dragged or resized.
*
*
* Individual entries can override via {@link Entry#setEditable(boolean)}.
*
* @see editable
*/
EDITABLE,
/**
* Accessibility label of the list of entries under each day in list views, read by screen readers. FullCalendar
* documents this option only partly or not at all.
*
*
* {@code
* calendar.setOption(Option.ENTRIES_HINT, "Entries");
* }
*
* @see hints (eventsHint)
*/
ENTRIES_HINT("eventsHint"),
/**
* CSS classes for the element after the inner wrapper of an entry. See {@link #ENTRY_INNER_CLASS}.
*
*
* {@code
* calendar.setOption(Option.ENTRY_AFTER_CLASS, JsCallback.of("""
* function(info) {
* return info.isEnd ? 'entry-after' : '';
* }"""));
* }
*
* @see eventAfterClass
*/
ENTRY_AFTER_CLASS("eventAfterClass"),
/**
* Exact programmatic control over where an entry can be dropped. The callback must return a boolean synchronously.
*
*
* {@code
* // entries must not be dropped on a Sunday
* calendar.setOption(Option.ENTRY_ALLOW, JsCallback.of("function(dropInfo, draggedEvent) { return dropInfo.start.getDay() !== 0; }"));
* }
*
* @see eventAllow
*/
ENTRY_ALLOW,
/**
* CSS classes for the element before the inner wrapper of an entry. See {@link #ENTRY_INNER_CLASS}.
*
*
* {@code
* calendar.setOption(Option.ENTRY_BEFORE_CLASS, JsCallback.of("""
* function(info) {
* return info.isStart ? 'entry-before' : '';
* }"""));
* }
*
* @see eventBeforeClass
*/
ENTRY_BEFORE_CLASS("eventBeforeClass"),
/**
* CSS classes for entries, set on the outermost element of each entry.
* Background entries use their own {@code backgroundEvent*} hooks.
*
*
* {@code
* calendar.setOption(Option.ENTRY_CLASS, JsCallback.of("function(info) { return info.isPast ? 'past-entry' : ''; }"));
* }
*
* @see eventClass
*/
ENTRY_CLASS("eventClass"),
/**
* Former name of {@link #ENTRY_CLASS}: CSS classes for entries.
*
* @deprecated use {@link #ENTRY_CLASS}, which sets the same FullCalendar option. Return a class name string. FullCalendar 7 drops arrays.
*/
@Deprecated(since = "8.0.0", forRemoval = true)
ENTRY_CLASS_NAMES("eventClass"),
/**
* Default color for all foreground entries (not background entries).
*
*
* Can be overridden per-entry via {@link Entry#setColor(String)}. Own styles can read the variable, e.g.:
* {@code
* .fc-event.important { border-left: 4px solid var(--fc-event-color); }
* }
* The class {@code fc-event} marks foreground entries, background entries carry {@code fc-bg-event}.
*
* @see eventColor
* @see Custom themes: event colors
*/
ENTRY_COLOR,
/**
* Limits entry dragging and resizing to certain windows of time.
*
*
* {@code
* calendar.setOption(Option.ENTRY_CONSTRAINT, "businessHours");
* // or a custom time window
* calendar.setOption(Option.ENTRY_CONSTRAINT, BusinessHours.businessWeek().start(10).end(18));
* }
*
* @see eventConstraint
*/
@JsonConverter(BusinessHoursConverter.class)
ENTRY_CONSTRAINT,
/**
* Custom content for entries. The generated content is inserted inside the inner-most wrapper of the entry.
*
*
* {@code
* calendar.setOption(Option.ENTRY_CONTENT, JsCallback.of("function(info) { return info.timeText + ' ' + info.event.title; }"));
* }
*
* @see eventContent
*/
ENTRY_CONTENT("eventContent"),
/**
* Default contrast color for all entries, used for text and other elements drawn on the entry color.
*
*
* Can be overridden per-entry via {@link Entry#setContrastColor(String)}. Own styles can read the variable, e.g.:
* {@code
* .fc-event.important { outline: 2px dashed var(--fc-event-contrast-color); }
* }
*
* @see eventContrastColor
* @see Custom themes: event colors
*/
ENTRY_CONTRAST_COLOR,
/**
* Transforms the raw data of each received entry into a standard entry object before FullCalendar parses it.
*
*
* {@code
* calendar.setOption(Option.ENTRY_DATA_TRANSFORM, JsCallback.of("""
* function(eventData) {
* if (eventData.cancelled) return false;
* return { title: eventData.name, start: eventData.begin, end: eventData.finish };
* }"""));
* }
*
*
* {@code
* calendar.setOption(Option.ENTRY_DID_MOUNT, JsCallback.of("function(info) { info.el.title = info.event.title; }"));
* }
*
*
*
* @see eventDisplay
*/
ENTRY_DISPLAY,
/**
* Number of pixels the mouse or touch must move before an entry drag starts.
*
*
*
* @see eventDragMinDistance
*/
ENTRY_DRAG_MIN_DISTANCE,
/**
* Allow resizing (duration editing) of entries.
*
*
* Can be overridden per-entry.
*
* @see eventDurationEditable
*/
ENTRY_DURATION_EDITABLE,
/**
* CSS classes for the inner wrapper element of an entry. The time and title elements live inside it.
* Applies to foreground entries, not to background entries.
*
*
* {@code
* calendar.setOption(Option.ENTRY_INNER_CLASS, JsCallback.of("""
* function(info) {
* return info.isNarrow ? 'narrow-entry-inner' : '';
* }"""));
* }
*
* @see eventInnerClass
*/
ENTRY_INNER_CLASS("eventInnerClass"),
/**
* Makes all entries focusable / tabbable for keyboard accessibility. By default, only entries with a
* {@code url} are.
*
*
*
* @see eventInteractive
*/
ENTRY_INTERACTIVE,
/**
* Time the user must hold down on a touch device before an entry becomes draggable. Has no effect on non-touch
* devices.
*
*
*
* @see eventLongPressDelay
*/
ENTRY_LONG_PRESS_DELAY,
/**
* Maximum number of entries that stack next to each other. In time grid view they stack left-to-right,
* in timeline view top-to-bottom. For day grid view use {@link #DAY_MAX_ENTRIES} instead.
*
*
*
* @see eventMaxStack
*/
ENTRY_MAX_STACK,
/**
* Minimum height in pixels an entry is allowed to have in time grid views.
*
*
*
* @see eventMinHeight
*/
ENTRY_MIN_HEIGHT,
/**
* Order of entries within the same day. In most views it is the vertical order, in time grid views the
* horizontal order.
*
*
* {@code
* calendar.setOption(Option.ENTRY_ORDER, "title,-start");
* calendar.setOption(Option.ENTRY_ORDER, JsCallback.of("function(a, b) { return a.title.localeCompare(b.title); }"));
* }
*
* @see eventOrder
*/
ENTRY_ORDER,
/**
* Make FullCalendar follow {@link #ENTRY_ORDER} strictly. By default it is not strict, and compactness
* is prioritized over following the order exactly.
*
*
*
* @see eventOrderStrict
*/
ENTRY_ORDER_STRICT,
/**
* Determines whether entries being dragged or resized may overlap other entries. Background entries are
* treated like normal entries.
*
*
* {@code
* // overlap only if both entries are all-day
* calendar.setOption(Option.ENTRY_OVERLAP, JsCallback.of("function(stillEvent, movingEvent) { return stillEvent.allDay && movingEvent.allDay; }"));
* }
*
* @see eventOverlap
*/
ENTRY_OVERLAP,
/**
* Allow the user to resize entries from their start edge.
*
*
*
* @see eventResizableFromStart
*/
ENTRY_RESIZABLE_FROM_START,
/**
* Height threshold in pixels in time grid views, below which an entry gets the "short" style.
*
*
*
* @see eventShortHeight
*/
ENTRY_SHORT_HEIGHT,
/**
* Whether day grid views may visually split a multi-day entry around a "+more" link.
*
*
* {@code
* calendar.setOption(Option.ENTRY_SLICING, false);
* }
*
* @see eventSlicing
*/
ENTRY_SLICING("eventSlicing"),
/**
* Default name of the query parameter that is sent to each JSON feed entry source and describes the
* exclusive end of the fetched interval (value is an ISO 8601 date string).
*
*
* Per-source override: {@link JsonFeedEntrySource#withEndParam(String)}.
*
* @see endParam
*/
ENTRY_SOURCE_END_PARAM("endParam"),
/**
* Global Google Calendar API key used by all {@link GoogleCalendarEntrySource} instances that do not specify their
* own key.
*
*
* Per-source override: {@link GoogleCalendarEntrySource#withApiKey(String)}.
*
* @see googleCalendarApiKey
*/
ENTRY_SOURCE_GOOGLE_CALENDAR_API_KEY("googleCalendarApiKey"),
/**
* Default name of the query parameter that is sent to each JSON feed entry source and describes the start
* of the fetched interval (value is an ISO 8601 date string).
*
*
* Per-source override: {@link JsonFeedEntrySource#withStartParam(String)}.
*
* @see startParam
*/
ENTRY_SOURCE_START_PARAM("startParam"),
/**
* Called when fetching from an entry source succeeds. The callback can transform the response, for example to
* unwrap a wrapper object into the entry array. Accepts a {@link JsCallback}.
*
*
* {@code
* calendar.setOption(Option.ENTRY_SOURCE_SUCCESS, JsCallback.of("""
* function(rawEvents, response) {
* return rawEvents.eventArray;
* }"""));
* }
*
* @see eventSourceSuccess
*/
ENTRY_SOURCE_SUCCESS("eventSourceSuccess"),
/**
* Default name of the query parameter that is sent to each JSON feed entry source and describes the time
* zone of the start and end values as well as the desired time zone of the returned entries
* (value like {@code "America/Chicago"} or {@code "UTC"}, unspecified for {@code local}).
*
*
* Per-source override: {@link JsonFeedEntrySource#withTimeZoneParam(String)}.
*
* @see timeZoneParam
*/
ENTRY_SOURCE_TIME_ZONE_PARAM("timeZoneParam"),
/**
* Allow dragging entries to change their start time.
*
*
* Can be overridden per-entry.
*
* @see eventStartEditable
*/
ENTRY_START_EDITABLE,
/**
* Former name of {@link #ENTRY_CONTRAST_COLOR}: the default text color for all entries
* (FullCalendar option {@code eventTextColor} in earlier versions). It now sets {@code eventContrastColor}.
*
* @deprecated use {@link #ENTRY_CONTRAST_COLOR}, which sets the same FullCalendar option
*/
@Deprecated(since = "8.0.0", forRemoval = true)
ENTRY_TEXT_COLOR("eventContrastColor"),
/**
* CSS classes for the time element inside the inner wrapper of an entry. See {@link #ENTRY_INNER_CLASS}.
*
*
* {@code
* calendar.setOption(Option.ENTRY_TIME_CLASS, JsCallback.of("""
* function(info) {
* return info.isShort ? 'short-entry-time' : '';
* }"""));
* }
*
* @see eventTimeClass
*/
ENTRY_TIME_CLASS("eventTimeClass"),
/**
* Format of the time text shown on entries. Shown only for timed entries.
*
*
* {@code
* calendar.setOption(Option.ENTRY_TIME_FORMAT, Map.of("hour", "2-digit", "minute", "2-digit", "hour12", false));
* }
*
* @see eventTimeFormat
*/
ENTRY_TIME_FORMAT,
/**
* CSS classes for the title element inside the inner wrapper of an entry. See {@link #ENTRY_INNER_CLASS}.
*
*
* {@code
* calendar.setOption(Option.ENTRY_TITLE_CLASS, JsCallback.of("""
* function(info) {
* return info.isShort ? 'short-entry-title' : '';
* }"""));
* }
*
* @see eventTitleClass
*/
ENTRY_TITLE_CLASS("eventTitleClass"),
/**
* Called right before an entry's DOM element is removed from the DOM.
* Background entries use their own {@code backgroundEvent*} hooks.
*
*
* {@code
* calendar.setOption(Option.ENTRY_WILL_UNMOUNT, JsCallback.of("function(info) { console.log('removing ' + info.event.title); }"));
* }
*
* @see eventWillUnmount
*/
ENTRY_WILL_UNMOUNT("eventWillUnmount"),
/**
* Expand the rows of a view to fill its height, if they do not take up the entire height by themselves.
* Applies to time grid and timeline views.
*
*
*
* @see expandRows
*/
EXPAND_ROWS,
/**
* Former name of {@link #ENTRY_SOURCE_END_PARAM}: name of the query parameter that describes the end
* of the interval fetched by JSON feed entry sources.
*
* @deprecated use {@link #ENTRY_SOURCE_END_PARAM}, which sets the same FullCalendar option
*/
@Deprecated(since = "8.0.0", forRemoval = true)
EXTERNAL_EVENT_SOURCE_END_PARAM("endParam"),
/**
* Former name of {@link #ENTRY_SOURCE_GOOGLE_CALENDAR_API_KEY}: global Google Calendar API key used by
* {@link GoogleCalendarEntrySource} instances without their own key.
*
* @deprecated use {@link #ENTRY_SOURCE_GOOGLE_CALENDAR_API_KEY}, which sets the same FullCalendar option
*/
@Deprecated(since = "8.0.0", forRemoval = true)
EXTERNAL_EVENT_SOURCE_GOOGLE_CALENDAR_API_KEY("googleCalendarApiKey"),
/**
* Former name of {@link #ENTRY_SOURCE_START_PARAM}: name of the query parameter that describes the start
* of the interval fetched by JSON feed entry sources.
*
* @deprecated use {@link #ENTRY_SOURCE_START_PARAM}, which sets the same FullCalendar option
*/
@Deprecated(since = "8.0.0", forRemoval = true)
EXTERNAL_EVENT_SOURCE_START_PARAM("startParam"),
/**
* Former name of {@link #ENTRY_SOURCE_TIME_ZONE_PARAM}: name of the query parameter that describes the
* time zone for JSON feed entry sources.
*
* @deprecated use {@link #ENTRY_SOURCE_TIME_ZONE_PARAM}, which sets the same FullCalendar option
*/
@Deprecated(since = "8.0.0", forRemoval = true)
EXTERNAL_EVENT_SOURCE_TIME_ZONE_PARAM("timeZoneParam"),
/**
* CSS classes for the filler elements that keep the calendar layout aligned.
*
*
* {@code
* calendar.setOption(Option.FILLER_CLASS, JsCallback.of("""
* function(info) {
* return info.inTableHeader ? 'header-filler' : '';
* }"""));
* }
*
* @see fillerClass
*/
FILLER_CLASS("fillerClass"),
/**
* First day of the week (0 = Sunday, 1 = Monday, ..., 6 = Saturday).
*
*
*
* @see firstDay
*/
@JsonConverter(DayOfWeekConverter.class)
FIRST_DAY,
/**
* Number of weeks shown in month view. With {@code true} the calendar is always 6 weeks tall, with
* {@code false} it has 4, 5 or 6 weeks, depending on the month.
*
*
*
* @see fixedWeekCount
*/
FIXED_WEEK_COUNT,
/**
* Whether the view's horizontal scrollbar is fixed to the bottom of the viewport while the page is scrolled
* vertically, if the calendar is in view but the scrollbar is below the fold.
* Relevant for views with a horizontal scrollbar, e.g. timeline views.
* With {@code "auto"}, the scrollbar is sticky when the calendar height is {@code auto}.
*
*
*
* @see footerScrollbarSticky
*/
FOOTER_SCROLLBAR_STICKY,
/**
* FullCalendar's built-in footer toolbar: the buttons and title shown at the bottom of the calendar. The toolbar
* is not a Vaadin component. FullCalendar shows no footer toolbar by default, and setting this option shows it.
*
*
* {@code
* calendar.setOption(Option.FOOTER_TOOLBAR, Map.of("start", "prev,next today", "center", "title", "end", "dayGridMonth,timeGridWeek"));
* }
*
* @see footerToolbar
*/
@SuppressWarnings("removal") // the converter goes with the deprecated toolbar model
@JsonConverter(ToolbarConverter.class)
FOOTER_TOOLBAR,
/**
* CSS classes for FullCalendar's built-in footer toolbar only, see {@link #FOOTER_TOOLBAR}. Use
* {@link #TOOLBAR_CLASS} for both toolbars.
*
*
* {@code
* calendar.setOption(Option.FOOTER_TOOLBAR_CLASS, "my-footer");
* }
*
* @see footerToolbarClass
*/
FOOTER_TOOLBAR_CLASS("footerToolbarClass"),
/**
* Whether an end is assigned to entries that have none. The end is calculated from the default timed or all-day
* entry duration.
*
*
*
*
* {@code
* calendar.setOption(Option.HEADER_TOOLBAR, Map.of("start", "prev,next today", "center", "title", "end", "dayGridMonth,timeGridWeek"));
* }
*
* @see headerToolbar
*/
@SuppressWarnings("removal") // the converter goes with the deprecated toolbar model
@JsonConverter(ToolbarConverter.class)
HEADER_TOOLBAR,
/**
* CSS classes for FullCalendar's built-in header toolbar only, see {@link #HEADER_TOOLBAR}. Use
* {@link #TOOLBAR_CLASS} for both toolbars.
*
*
* {@code
* calendar.setOption(Option.HEADER_TOOLBAR_CLASS, "my-header");
* }
*
* @see headerToolbarClass
*/
HEADER_TOOLBAR_CLASS("headerToolbarClass"),
/**
* Heading level of the title of FullCalendar's built-in toolbar in the document outline.
*
*
* {@code
* calendar.setOption(Option.HEADING_LEVEL, 3);
* }
*
* @see headingLevel
*/
HEADING_LEVEL("headingLevel"),
/**
* Height of the entire calendar, including header and footer. If the contents do not fit, scrollbars appear.
*
*
*
*
* {@code
* calendar.setOption(Option.HIDDEN_DAYS, new DayOfWeek[] {DayOfWeek.TUESDAY, DayOfWeek.THURSDAY});
* }
*
* @see hiddenDays
*/
@JsonConverter(DayOfWeekArrayConverter.class)
HIDDEN_DAYS,
/**
* CSS classes for the highlight element that appears while the user selects a date range.
*
*
* {@code
* calendar.setOption(Option.HIGHLIGHT_CLASS, "my-highlight");
* }
*
* @see highlightClass
*/
HIGHLIGHT_CLASS("highlightClass"),
/**
* The date the calendar shows on first attach. Pass a {@link LocalDate}.
*
*
*
*
*
*
* {@code
* calendar.setOption(Option.INLINE_WEEK_NUMBER_CLASS, JsCallback.of("""
* function(info) {
* return info.num % 2 == 0 ? 'even-week' : 'odd-week';
* }"""));
* }
*
* @see inlineWeekNumberClass
*/
INLINE_WEEK_NUMBER_CLASS("inlineWeekNumberClass"),
/**
* Custom content for the week number shown inline in day grid cells. Accepts a {@link JsCallback}.
*
*
* {@code
* calendar.setOption(Option.INLINE_WEEK_NUMBER_CONTENT, JsCallback.of("""
* function(info) {
* return 'W' + info.num;
* }"""));
* }
*
* @see inlineWeekNumberContent
*/
INLINE_WEEK_NUMBER_CONTENT("inlineWeekNumberContent"),
/**
* Called after the week number shown inline in day grid cells is added to the DOM. Accepts a {@link JsCallback}.
*
*
* {@code
* calendar.setOption(Option.INLINE_WEEK_NUMBER_DID_MOUNT, JsCallback.of("""
* function(info) {
* info.el.title = 'Week ' + info.num;
* }"""));
* }
*
*
* {@code
* calendar.setOption(Option.INLINE_WEEK_NUMBER_WILL_UNMOUNT, JsCallback.of("""
* function(info) {
* console.log('removing week number', info.num);
* }"""));
* }
*
* @see inlineWeekNumberWillUnmount
*/
INLINE_WEEK_NUMBER_WILL_UNMOUNT("inlineWeekNumberWillUnmount"),
/**
* When entries are fetched.
*
*
*
* @see lazyFetching
*/
LAZY_FETCHING,
/**
* CSS classes for the element that wraps the day sections of list views.
*
*
* {@code
* calendar.setOption(Option.LIST_DAYS_CLASS, "my-list-days");
* }
*
* @see listDaysClass
*/
LIST_DAYS_CLASS("listDaysClass"),
/**
* Format of the text on the right side of the day headings in list view.
*
*
* {@code
* calendar.setOption(Option.LIST_DAY_ALT_FORMAT, Map.of("year", "numeric", "month", "short", "day", "numeric"));
* }
*
* @see listDayAltFormat
*/
LIST_DAY_ALT_FORMAT,
/**
* CSS classes for the element that wraps the entries of a single day in list views.
*
*
* {@code
* calendar.setOption(Option.LIST_DAY_BODY_CLASS, JsCallback.of("""
* function(info) {
* return info.isToday ? 'today-entries' : '';
* }"""));
* }
*
* @see listDayBodyClass
*/
LIST_DAY_BODY_CLASS("listDayBodyClass"),
/**
* CSS classes for the element that wraps an entire day section in list views, the day header row and the entries.
*
*
* {@code
* calendar.setOption(Option.LIST_DAY_CLASS, JsCallback.of("""
* function(info) {
* return info.isFirst ? 'first-day' : '';
* }"""));
* }
*
* @see listDayClass
*/
LIST_DAY_CLASS("listDayClass"),
/**
* Format of the text on the left side of the day headings in list view.
*
*
* {@code
* calendar.setOption(Option.LIST_DAY_FORMAT, Map.of("weekday", "long", "month", "long", "day", "numeric"));
* }
*
* @see listDayFormat
*/
LIST_DAY_FORMAT,
/**
* CSS classes for list view day headings (the row that shows the date above a group of entries).
*
*
* {@code
* calendar.setOption(Option.LIST_DAY_HEADER_CLASS, JsCallback.of("function(info) { return info.isToday ? 'today-heading' : ''; }"));
* }
*
* @see listDayHeaderClass
*/
LIST_DAY_HEADER_CLASS("listDayHeaderClass"),
/**
* Custom content for the texts of a list view day heading.
*
*
* {@code
* calendar.setOption(Option.LIST_DAY_HEADER_CONTENT, JsCallback.of("""
* function(info) {
* return info.level == 0 ? { html: '' + info.text + '' } : info.text;
* }"""));
* }
*
* @see listDayHeaderContent
*/
LIST_DAY_HEADER_CONTENT("listDayHeaderContent"),
/**
* Called after a list view day heading is added to the DOM. Accepts a {@link JsCallback}.
*
*
* {@code
* calendar.setOption(Option.LIST_DAY_HEADER_DID_MOUNT, JsCallback.of("""
* function(info) {
* if (info.isToday) info.el.classList.add('today-heading');
* }"""));
* }
*
*
* {@code
* calendar.setOption(Option.LIST_DAY_HEADER_INNER_CLASS, JsCallback.of("""
* function(info) {
* return info.level === 0 ? 'primary-side' : 'alt-side';
* }"""));
* }
*
* @see listDayHeaderInnerClass
*/
LIST_DAY_HEADER_INNER_CLASS("listDayHeaderInnerClass"),
/**
* Called before a list view day heading is removed from the DOM. Accepts a {@link JsCallback}.
*
*
* {@code
* calendar.setOption(Option.LIST_DAY_HEADER_WILL_UNMOUNT, JsCallback.of("""
* function(info) {
* console.log('removing heading', info.date);
* }"""));
* }
*
* @see listDayHeaderWillUnmount
*/
LIST_DAY_HEADER_WILL_UNMOUNT("listDayHeaderWillUnmount"),
/**
* Former name of {@link #LIST_DAY_ALT_FORMAT}: the format of the text on the right side of the day
* headings in list view (FullCalendar option {@code listDaySideFormat} in earlier versions).
*
* @deprecated use {@link #LIST_DAY_ALT_FORMAT}, which sets the same FullCalendar option
*/
@Deprecated(since = "8.0.0", forRemoval = true)
LIST_DAY_SIDE_FORMAT("listDayAltFormat"),
/**
* CSS classes for the element after the "inner" wrapper of list item entries (bullet-point style entries: timed
* entries in day grid views and entries in list views).
*
*
* {@code
* calendar.setOption(Option.LIST_ITEM_ENTRY_AFTER_CLASS, JsCallback.of("function(info) { return info.isPast ? 'past-entry' : ''; }"));
* }
*
* @see listItemEventAfterClass
*/
LIST_ITEM_ENTRY_AFTER_CLASS("listItemEventAfterClass"),
/**
* CSS classes for the element before the "inner" wrapper of list item entries (bullet-point style entries: timed
* entries in day grid views and entries in list views).
*
*
* {@code
* calendar.setOption(Option.LIST_ITEM_ENTRY_BEFORE_CLASS, JsCallback.of("function(info) { return info.isPast ? 'past-entry' : ''; }"));
* }
*
* @see listItemEventBeforeClass
*/
LIST_ITEM_ENTRY_BEFORE_CLASS("listItemEventBeforeClass"),
/**
* CSS classes for the outermost element of list item entries (bullet-point style entries: timed entries in day grid
* views and entries in list views).
*
*
* {@code
* calendar.setOption(Option.LIST_ITEM_ENTRY_CLASS, JsCallback.of("function(info) { return info.isPast ? 'past-entry' : ''; }"));
* }
*
* @see listItemEventClass
*/
LIST_ITEM_ENTRY_CLASS("listItemEventClass"),
/**
* CSS classes for the "inner" wrapper element of list item entries (bullet-point style entries: timed entries in
* day grid views and entries in list views).
*
*
* {@code
* calendar.setOption(Option.LIST_ITEM_ENTRY_INNER_CLASS, "my-entry-inner");
* }
*
* @see listItemEventInnerClass
*/
LIST_ITEM_ENTRY_INNER_CLASS("listItemEventInnerClass"),
/**
* CSS classes for the time element within the "inner" wrapper of list item entries (bullet-point style entries:
* timed entries in day grid views and entries in list views).
*
*
* {@code
* calendar.setOption(Option.LIST_ITEM_ENTRY_TIME_CLASS, JsCallback.of("function(info) { return info.isShort ? 'compact' : ''; }"));
* }
*
* @see listItemEventTimeClass
*/
LIST_ITEM_ENTRY_TIME_CLASS("listItemEventTimeClass"),
/**
* CSS classes for the title element within the "inner" wrapper of list item entries (bullet-point style entries:
* timed entries in day grid views and entries in list views).
*
*
* {@code
* calendar.setOption(Option.LIST_ITEM_ENTRY_TITLE_CLASS, JsCallback.of("function(info) { return info.isShort ? 'compact' : ''; }"));
* }
*
* @see listItemEventTitleClass
*/
LIST_ITEM_ENTRY_TITLE_CLASS("listItemEventTitleClass"),
/**
* Text of the list view button of FullCalendar's built-in toolbar, or {@code false} to show duration based buttons
* like "Week" or "Month" instead of a "List" button.
*
*
* {@code
* calendar.setOption(Option.LIST_TEXT, false);
* }
*
* @see listText (List view: Toolbar Buttons)
*/
LIST_TEXT("listText"),
/**
* Called when fetching entries starts or stops. Accepts a {@link JsCallback}.
*
*
* {@code
* calendar.setOption(Option.LOADING, JsCallback.of("""
* function(isLoading) {
* document.body.classList.toggle('loading', isLoading);
* }"""));
* }
*
* @see loading
*/
LOADING("loading"),
/**
* Locale/language code for displaying calendar text.
*
*
* {@link FullCalendar#withAutoUiLocale()} sets the UI locale and follows its changes.
*
* @see locale
*/
@JsonConverter(LocaleConverter.class)
LOCALE,
/**
* Time a touch user must hold down before an entry can be dragged or a date can be selected. Has no effect on
* non-touch devices. See {@link #ENTRY_LONG_PRESS_DELAY} for entry dragging only.
*
*
*
* @see longPressDelay
*/
LONG_PRESS_DELAY,
/**
* Former name of {@link #DAY_MAX_ENTRIES}: the maximum number of entries in a day cell before a
* "+N more" link is shown.
*
* @deprecated use {@link #DAY_MAX_ENTRIES}, which sets the same FullCalendar option
*/
@Deprecated(since = "8.0.0", forRemoval = true)
MAX_ENTRIES_PER_DAY("dayMaxEvents"),
/**
* Format of the first cell of each month, when a day grid view spans several months.
*
*
* {@code
* calendar.setOption(Option.MONTH_START_FORMAT, Map.of("month", "short", "day", "numeric"));
* }
*
* @see monthStartFormat
*/
MONTH_START_FORMAT,
/**
* Text of the month view button of FullCalendar's built-in toolbar. FullCalendar documents this option only partly
* or not at all.
*
*
* {@code
* calendar.setOption(Option.MONTH_TEXT, "Month");
* }
*
* @see monthText (locale object)
*/
MONTH_TEXT("monthText"),
/**
* CSS classes for the "+N more" link.
*
*
* {@code
* calendar.setOption(Option.MORE_LINK_CLASS, JsCallback.of("""
* function(info) {
* return info.num > 5 ? 'busy-day' : '';
* }"""));
* }
*
* @see moreLinkClass
*/
MORE_LINK_CLASS("moreLinkClass"),
/**
* Former name of {@link #MORE_LINK_CLASS}: CSS classes for the "+N more" link.
* @deprecated use {@link #MORE_LINK_CLASS}, which sets the same FullCalendar option. Return a class name string. FullCalendar 7 drops arrays.
*/
@Deprecated(since = "8.0.0", forRemoval = true)
MORE_LINK_CLASS_NAMES("moreLinkClass"),
/**
* Determines what happens when the user clicks a "+N more" link (created by the max entries options).
*
*
* {@code
* calendar.setOption(Option.MORE_LINK_CLICK, FullCalendar.MoreLinkClickAction.DAY);
* calendar.setOption(Option.MORE_LINK_CLICK, JsCallback.of("function(info) { return 'day'; }"));
* }
* {@link FullCalendar#addMoreLinkClickedListener} receives the
* click with every value, also with a callback.
*
* @see moreLinkClick
*/
MORE_LINK_CLICK,
/**
* Custom content for the "+N more" link. Accepts a {@link JsCallback}.
*
*
* {@code
* calendar.setOption(Option.MORE_LINK_CONTENT, JsCallback.of("""
* function(info) {
* return info.isNarrow ? info.numericText : info.longText;
* }"""));
* }
*
* @see moreLinkContent
*/
MORE_LINK_CONTENT("moreLinkContent"),
/**
* Called right after a "+N more" link is added to the DOM. Accepts a {@link JsCallback}.
*
*
* {@code
* calendar.setOption(Option.MORE_LINK_DID_MOUNT, JsCallback.of("""
* function(info) {
* info.el.title = info.longText;
* }"""));
* }
*
*
* {@code
* calendar.setOption(Option.MORE_LINK_HINT, "Click to see $0 more entries");
* }
*
* @see moreLinkHint
*/
MORE_LINK_HINT,
/**
* CSS classes for the inner wrapper of the "+more" link. Useful for adjusting padding.
*
*
* {@code
* calendar.setOption(Option.MORE_LINK_INNER_CLASS, JsCallback.of("""
* function(info) {
* return info.num > 5 ? 'many-hidden' : '';
* }"""));
* }
*
* @see moreLinkInnerClass
*/
MORE_LINK_INNER_CLASS("moreLinkInnerClass"),
/**
* Text of the "more" link that shows when too many entries do not fit in a day.
*
*
* {@code
* calendar.setOption(Option.MORE_LINK_TEXT, JsCallback.of("function(num) { return '+' + num + ' more'; }"));
* }
*
* @see more-link render hooks
*/
MORE_LINK_TEXT("moreLinkText"),
/**
* Called right before a "+N more" link is removed from the DOM. Accepts a {@link JsCallback}.
*
*
* {@code
* calendar.setOption(Option.MORE_LINK_WILL_UNMOUNT, JsCallback.of("""
* function(info) {
* console.log('removing more link', info.num);
* }"""));
* }
*
* @see moreLinkWillUnmount
*/
MORE_LINK_WILL_UNMOUNT("moreLinkWillUnmount"),
/**
* Maximum number of month columns the multi-month grid tries to render. Fewer columns are shown if each
* month would become smaller than {@link #SINGLE_MONTH_MIN_WIDTH}. Use {@code 1} for a single column.
*
*
*
* @see multiMonthMaxColumns
*/
MULTI_MONTH_MAX_COLUMNS,
/**
* Former name of {@link #SINGLE_MONTH_MIN_WIDTH}: the minimum pixel width of each month in the
* multi-month view before months wrap to the next row.
*
* @deprecated use {@link #SINGLE_MONTH_MIN_WIDTH}, which sets the same FullCalendar option
*/
@Deprecated(since = "8.0.0", forRemoval = true)
MULTI_MONTH_MIN_WIDTH("singleMonthMinWidth"),
/**
* Former name of {@link #SINGLE_MONTH_TITLE_FORMAT}: the format of each month's title in the
* multi-month view.
*
* @deprecated use {@link #SINGLE_MONTH_TITLE_FORMAT}, which sets the same FullCalendar option
*/
@Deprecated(since = "8.0.0", forRemoval = true)
MULTI_MONTH_TITLE_FORMAT("singleMonthTitleFormat"),
/**
* Former name of {@link #VIEW_HINT}: accessible label for the view-switcher buttons in FullCalendar's built-in
* toolbar.
*
* @deprecated use {@link #VIEW_HINT}, which sets the same FullCalendar option
*/
@Deprecated(since = "8.0.0", forRemoval = true)
NATIVE_TOOLBAR_VIEW_HINT("viewHint"),
/**
* Make day headings and week numbers clickable. A click opens a view for that day or week.
*
*
*
* @see navLinks
*/
NAV_LINKS,
/**
* CSS classes for each nav link element, the clickable day numbers and weekday names that navigate to another
* view.
*
*
* {@code
* calendar.setOption(Option.NAV_LINK_CLASS, "my-nav-link");
* }
*
* @see navLinkClass
*/
NAV_LINK_CLASS("navLinkClass"),
/**
* Determines what happens upon a click on a day heading nav link (requires {@link #NAV_LINKS}).
*
*
* {@code
* calendar.setOption(Option.NAV_LINK_DAY_CLICK, "timeGridDay");
* calendar.setOption(Option.NAV_LINK_DAY_CLICK, JsCallback.of("function(date, jsEvent) { console.log('day', date.toISOString()); }"));
* }
*
* @see navLinkDayClick
*/
NAV_LINK_DAY_CLICK("navLinkDayClick"),
/**
* Accessible hint ({@code aria-label}) for clickable day/week numbers (nav links). Describes what happens
* after the nav link is clicked.
*
*
* {@code
* calendar.setOption(Option.NAV_LINK_HINT, "Go to $0");
* }
*
* @see navLinkHint
*/
NAV_LINK_HINT,
/**
* Determines what happens upon a click on a week number nav link (requires {@link #NAV_LINKS}).
*
*
* {@code
* calendar.setOption(Option.NAV_LINK_WEEK_CLICK, "timeGridWeek");
* calendar.setOption(Option.NAV_LINK_WEEK_CLICK, JsCallback.of("function(weekStart, jsEvent) { console.log('week', weekStart.toISOString()); }"));
* }
*
* @see navLinkWeekClick
*/
NAV_LINK_WEEK_CLICK("navLinkWeekClick"),
/**
* How far a timed entry must run into the next day before it is rendered on that day.
*
*
* {@code
* calendar.setOption(Option.NEXT_DAY_THRESHOLD, Duration.ofHours(9));
* }
*
* @see nextDayThreshold
*/
@JsonConverter(DurationConverter.class)
NEXT_DAY_THRESHOLD,
/**
* Accessible label ({@code aria-label}) of the "next" button in FullCalendar's built-in toolbar.
*
*
* {@code
* calendar.setOption(Option.NEXT_HINT, "Next $0");
* }
*
* @see nextHint
*/
NEXT_HINT,
/**
* Text of the "next" button of FullCalendar's built-in toolbar. Each locale defines this text, see the locale page.
*
*
* {@code
* calendar.setOption(Option.NEXT_TEXT, "Next");
* }
*
* @see nextText (locale object)
*/
NEXT_TEXT("nextText"),
/**
* Text of the "next year" button of FullCalendar's built-in toolbar, see {@link NativeToolbarParts#NEXT_YEAR}.
* FullCalendar documents this option only partly or not at all.
*
*
* {@code
* calendar.setOption(Option.NEXT_YEAR_TEXT, "Next year");
* }
*
* @see headerToolbar
*/
NEXT_YEAR_TEXT("nextYearText"),
/**
* CSS classes for the elements that shade the non-business hours.
*
*
* {@code
* calendar.setOption(Option.NON_BUSINESS_HOURS_CLASS, "my-non-business");
* }
*
* @see nonBusinessHoursClass
*/
NON_BUSINESS_HOURS_CLASS("nonBusinessHoursClass"),
/**
* Sets the "today" date of the calendar, the day that is highlighted as today. Without it, the current date of the
* browser is used.
*
*
* {@code
* calendar.setOption(Option.NOW, LocalDate.of(2025, 3, 1));
* }
*
*
*
* @see nowIndicator
*/
NOW_INDICATOR,
/**
* CSS classes for the dot of the now indicator. The dot sits alongside the indicator line in the time axis of
* time grid and timeline views.
*
*
* {@code
* calendar.setOption(Option.NOW_INDICATOR_DOT_CLASS, "my-now-dot");
* }
*
* @see nowIndicatorDotClass
*/
NOW_INDICATOR_DOT_CLASS("nowIndicatorDotClass"),
/**
* CSS classes for the arrow of the now indicator in the time axis (time grid and timeline views).
*
*
* {@code
* calendar.setOption(Option.NOW_INDICATOR_HEADER_CLASS, JsCallback.of("""
* function(info) {
* return info.date.getHours() < 12 ? 'now-am' : 'now-pm';
* }"""));
* }
*
* @see nowIndicatorHeaderClass
*/
NOW_INDICATOR_HEADER_CLASS("nowIndicatorHeaderClass"),
/**
* Custom content for the arrow of the now indicator in the time axis (time grid and timeline views). Accepts a
* {@link JsCallback}.
*
*
* {@code
* calendar.setOption(Option.NOW_INDICATOR_HEADER_CONTENT, JsCallback.of("""
* function(info) {
* return { html: 'now' };
* }"""));
* }
*
* @see nowIndicatorHeaderContent
*/
NOW_INDICATOR_HEADER_CONTENT("nowIndicatorHeaderContent"),
/**
* Called after the now indicator arrow is added to the DOM. Accepts a {@link JsCallback}.
*
*
* {@code
* calendar.setOption(Option.NOW_INDICATOR_HEADER_DID_MOUNT, JsCallback.of("""
* function(info) {
* info.el.classList.add('pulse');
* }"""));
* }
*
*
* {@code
* calendar.setOption(Option.NOW_INDICATOR_HEADER_WILL_UNMOUNT, JsCallback.of("""
* function(info) {
* console.log('removing now indicator', info.date);
* }"""));
* }
*
* @see nowIndicatorHeaderWillUnmount
*/
NOW_INDICATOR_HEADER_WILL_UNMOUNT("nowIndicatorHeaderWillUnmount"),
/**
* CSS classes for the line of the now indicator over the day columns (time grid and timeline views).
*
*
* {@code
* calendar.setOption(Option.NOW_INDICATOR_LINE_CLASS, JsCallback.of("""
* function(info) {
* return info.date.getHours() < 12 ? 'now-am' : 'now-pm';
* }"""));
* }
*
* @see nowIndicatorLineClass
*/
NOW_INDICATOR_LINE_CLASS("nowIndicatorLineClass"),
/**
* Custom content for the line of the now indicator over the day columns (time grid and timeline views). Accepts a
* {@link JsCallback}.
*
*
* {@code
* calendar.setOption(Option.NOW_INDICATOR_LINE_CONTENT, JsCallback.of("""
* function(info) {
* return info.date.toLocaleTimeString();
* }"""));
* }
*
* @see nowIndicatorLineContent
*/
NOW_INDICATOR_LINE_CONTENT("nowIndicatorLineContent"),
/**
* Called after the now indicator line is added to the DOM. Accepts a {@link JsCallback}.
*
*
* {@code
* calendar.setOption(Option.NOW_INDICATOR_LINE_DID_MOUNT, JsCallback.of("""
* function(info) {
* info.el.classList.add('pulse');
* }"""));
* }
*
*
* {@code
* calendar.setOption(Option.NOW_INDICATOR_LINE_WILL_UNMOUNT, JsCallback.of("""
* function(info) {
* console.log('removing now indicator', info.date);
* }"""));
* }
*
* @see nowIndicatorLineWillUnmount
*/
NOW_INDICATOR_LINE_WILL_UNMOUNT("nowIndicatorLineWillUnmount"),
/**
* Whether the now indicator aligns with the start of its slot. Relevant for timeline views.
*
*
*
* @see nowIndicatorSnap
*/
NOW_INDICATOR_SNAP,
/**
* CSS classes for the "No events to display" message of list views.
*
*
* {@code
* calendar.setOption(Option.NO_ENTRIES_CLASS, JsCallback.of("""
* function(info) {
* return 'empty-' + info.view.type;
* }"""));
* }
*
* @see noEventsClass
*/
NO_ENTRIES_CLASS("noEventsClass"),
/**
* Former name of {@link #NO_ENTRIES_CLASS}: CSS classes for the "No events to display" message of list views.
* @deprecated use {@link #NO_ENTRIES_CLASS}, which sets the same FullCalendar option. Return a class name string. FullCalendar 7 drops arrays.
*/
@Deprecated(since = "8.0.0", forRemoval = true)
NO_ENTRIES_CLASS_NAMES("noEventsClass"),
/**
* Custom content for the "No events to display" message of list views. Accepts a {@link JsCallback}.
*
*
* {@code
* calendar.setOption(Option.NO_ENTRIES_CONTENT, JsCallback.of("""
* function(info) {
* return { html: '' + info.text + '' };
* }"""));
* }
*
* @see noEventsContent
*/
NO_ENTRIES_CONTENT("noEventsContent"),
/**
* Called after the "No events to display" message of list views is added to the DOM. Accepts a {@link JsCallback}.
*
*
* {@code
* calendar.setOption(Option.NO_ENTRIES_DID_MOUNT, JsCallback.of("""
* function(info) {
* info.el.setAttribute('role', 'status');
* }"""));
* }
*
*
* {@code
* calendar.setOption(Option.NO_ENTRIES_INNER_CLASS, JsCallback.of("""
* function(info) {
* return 'empty-' + info.view.type;
* }"""));
* }
*
* @see noEventsInnerClass
*/
NO_ENTRIES_INNER_CLASS("noEventsInnerClass"),
/**
* Message shown in list views when no entries are in the shown range. It is the {@code text} in the {@code info}
* of the no-entries render hooks.
*
*
* {@code
* calendar.setOption(Option.NO_ENTRIES_TEXT, "Nothing planned");
* }
*
* @see noEventsText
*/
NO_ENTRIES_TEXT("noEventsText"),
/**
* Called before the "No events to display" message of list views is removed from the DOM. Accepts a
* {@link JsCallback}.
*
*
* {@code
* calendar.setOption(Option.NO_ENTRIES_WILL_UNMOUNT, JsCallback.of("""
* function(info) {
* console.log('removing no entries message');
* }"""));
* }
*
* @see noEventsWillUnmount
*/
NO_ENTRIES_WILL_UNMOUNT("noEventsWillUnmount"),
/**
* CSS classes for the outermost element of the popover that opens when the user clicks a more-link. Accepts a
* string only, not a callback.
*
*
* {@code
* calendar.setOption(Option.POPOVER_CLASS, "my-popover");
* }
*
* @see popoverClass
*/
POPOVER_CLASS("popoverClass"),
/**
* CSS classes for the close button of the popover that opens when the user clicks a more-link. Accepts a string
* only, not a callback.
*
*
* {@code
* calendar.setOption(Option.POPOVER_CLOSE_CLASS, "my-popover-close");
* }
*
* @see popoverCloseClass
*/
POPOVER_CLOSE_CLASS("popoverCloseClass"),
/**
* Custom content for the close button of the popover that opens when the user clicks a more-link. The generated
* content is inserted inside the button, typically an icon.
*
*
* {@code
* calendar.setOption(Option.POPOVER_CLOSE_CONTENT, JsCallback.of("function() { return {html: '×'}; }"));
* }
*
* @see popoverCloseContent
*/
POPOVER_CLOSE_CONTENT("popoverCloseContent"),
/**
* Date format of the title of the "+N more" popover.
*
*
* {@code
* calendar.setOption(Option.POPOVER_FORMAT, Map.of("month", "short", "day", "numeric"));
* }
*
* @see popoverFormat
*/
POPOVER_FORMAT,
/**
* Accessible label ({@code aria-label}) of the "prev" button in FullCalendar's built-in toolbar.
*
*
* {@code
* calendar.setOption(Option.PREV_HINT, "Previous $0");
* }
*
* @see prevHint
*/
PREV_HINT,
/**
* Text of the "previous" button of FullCalendar's built-in toolbar. Each locale defines this text, see the locale
* page.
*
*
* {@code
* calendar.setOption(Option.PREV_TEXT, "Previous");
* }
*
* @see prevText (locale object)
*/
PREV_TEXT("prevText"),
/**
* Text of the "previous year" button of FullCalendar's built-in toolbar, see {@link NativeToolbarParts#PREV_YEAR}.
* FullCalendar documents this option only partly or not at all.
*
*
* {@code
* calendar.setOption(Option.PREV_YEAR_TEXT, "Previous year");
* }
*
* @see headerToolbar
*/
PREV_YEAR_TEXT("prevYearText"),
/**
* When entries of multiple asynchronous entry sources are rendered.
*
*
*
* @see progressiveEventRendering
*/
PROGRESSIVE_ENTRY_RENDERING,
/**
* Former name of {@link #PROGRESSIVE_ENTRY_RENDERING}: when entries of multiple asynchronous entry sources are
* rendered.
*
* @deprecated use {@link #PROGRESSIVE_ENTRY_RENDERING}, which sets the same FullCalendar option
*/
@Deprecated(since = "8.0.0", forRemoval = true)
PROGRESSIVE_EVENT_RENDERING,
/**
* Delay (in milliseconds) the calendar waits before rerendering after any operation that might cause a
* rerender (changing the view, adding an entry, ...). The calendar then rerenders what it needs all at once,
* which can reduce the number of rerenders.
*
*
*
* @see rerenderDelay
*/
RERENDER_DELAY,
/**
* CSS classes for the element after the "inner" wrapper of row entries (entries that render as horizontal bars:
* all-day entries in day grid and time grid views, and timeline entries).
*
*
* {@code
* calendar.setOption(Option.ROW_ENTRY_AFTER_CLASS, JsCallback.of("function(info) { return info.isPast ? 'past-entry' : ''; }"));
* }
*
* @see rowEventAfterClass
*/
ROW_ENTRY_AFTER_CLASS("rowEventAfterClass"),
/**
* Custom content for the element after the "inner" wrapper of row entries (entries that render as horizontal bars).
* The generated content is inserted inside that element and is hidden from assistive technology.
* Useful for decorations such as an arrow showing that the entry continues past a later date.
*
*
* {@code
* calendar.setOption(Option.ROW_ENTRY_AFTER_CONTENT, JsCallback.of("function(info) { return info.isEnd ? '' : '→'; }"));
* }
*
* @see rowEventAfterContent
*/
ROW_ENTRY_AFTER_CONTENT("rowEventAfterContent"),
/**
* CSS classes for the element before the "inner" wrapper of row entries (entries that render as horizontal bars:
* all-day entries in day grid and time grid views, and timeline entries).
*
*
* {@code
* calendar.setOption(Option.ROW_ENTRY_BEFORE_CLASS, JsCallback.of("function(info) { return info.isPast ? 'past-entry' : ''; }"));
* }
*
* @see rowEventBeforeClass
*/
ROW_ENTRY_BEFORE_CLASS("rowEventBeforeClass"),
/**
* Custom content for the element before the "inner" wrapper of row entries (entries that render as horizontal
* bars). The generated content is inserted inside that element and is hidden from assistive technology.
* Useful for decorations such as an arrow showing that the entry continues from an earlier date.
*
*
* {@code
* calendar.setOption(Option.ROW_ENTRY_BEFORE_CONTENT, JsCallback.of("function(info) { return info.isStart ? '' : '←'; }"));
* }
*
* @see rowEventBeforeContent
*/
ROW_ENTRY_BEFORE_CONTENT("rowEventBeforeContent"),
/**
* CSS classes for the outermost element of row entries (entries that render as horizontal bars: all-day entries in
* day grid and time grid views, and timeline entries).
*
*
* {@code
* calendar.setOption(Option.ROW_ENTRY_CLASS, JsCallback.of("function(info) { return info.isPast ? 'past-entry' : ''; }"));
* }
*
* @see rowEventClass
*/
ROW_ENTRY_CLASS("rowEventClass"),
/**
* CSS classes for the "inner" wrapper element of row entries (entries that render as horizontal bars: all-day
* entries in day grid and time grid views, and timeline entries).
*
*
* {@code
* calendar.setOption(Option.ROW_ENTRY_INNER_CLASS, "my-entry-inner");
* }
*
* @see rowEventInnerClass
*/
ROW_ENTRY_INNER_CLASS("rowEventInnerClass"),
/**
* CSS classes for the time element within the "inner" wrapper of row entries (entries that render as horizontal
* bars: all-day entries in day grid and time grid views, and timeline entries).
*
*
* {@code
* calendar.setOption(Option.ROW_ENTRY_TIME_CLASS, JsCallback.of("function(info) { return info.isShort ? 'compact' : ''; }"));
* }
*
* @see rowEventTimeClass
*/
ROW_ENTRY_TIME_CLASS("rowEventTimeClass"),
/**
* CSS classes for the title element within the "inner" wrapper of row entries (entries that render as horizontal
* bars: all-day entries in day grid and time grid views, and timeline entries).
*
*
* {@code
* calendar.setOption(Option.ROW_ENTRY_TITLE_CLASS, JsCallback.of("function(info) { return info.isShort ? 'compact' : ''; }"));
* }
*
* @see rowEventTitleClass
*/
ROW_ENTRY_TITLE_CLASS("rowEventTitleClass"),
/**
* Whether the title of row entries sticks to the start edge of the visible area while the user scrolls horizontally
* past a long entry, so the title stays readable. FullCalendar documents this option only partly or not at all.
*
*
* {@code
* calendar.setOption(Option.ROW_ENTRY_TITLE_STICKY, false);
* }
*
* @see rowEventTitleSticky
*/
ROW_ENTRY_TITLE_STICKY("rowEventTitleSticky"),
/**
* CSS classes for the row more-link element.
*
*
* {@code
* calendar.setOption(Option.ROW_MORE_LINK_CLASS, "my-more-link");
* }
*
* @see rowMoreLinkClass
*/
ROW_MORE_LINK_CLASS("rowMoreLinkClass"),
/**
* CSS classes for the inner wrapper of the row more-link.
* Useful for adjusting padding.
*
*
* {@code
* calendar.setOption(Option.ROW_MORE_LINK_INNER_CLASS, "my-more-link-inner");
* }
*
* @see rowMoreLinkInnerClass
*/
ROW_MORE_LINK_INNER_CLASS("rowMoreLinkInnerClass"),
/**
* Initial vertical scroll position of timegrid views, as time of day.
*
*
* The position is applied again whenever the date range changes, unless {@link #SCROLL_TIME_RESET} is
* {@code false}.
*
*
*
* @see scrollTimeReset
*/
SCROLL_TIME_RESET,
/**
* Allow users to select time ranges by clicking and dragging.
*
*
* Fires {@code TimeslotsSelectedEvent} server-side.
*
* @see selectable
*/
SELECTABLE,
/**
* Exact programmatic control over where the user can select. Called for every new potential selection while
* the user is dragging and must return a boolean synchronously.
*
*
* {@code
* // no selections starting on a Sunday
* calendar.setOption(Option.SELECT_ALLOW, JsCallback.of("function(selectInfo) { return selectInfo.start.getDay() !== 0; }"));
* }
*
* @see selectAllow
*/
SELECT_ALLOW,
/**
* Limits where the user can make selections to certain windows of time. Accepts the same values as
* {@code eventConstraint} does for entries.
* Only applies when {@link #SELECTABLE} is {@code true}.
*
*
* To pass a {@link BusinessHours} object, serialize it to JSON via
* {@code setOption(SELECT_CONSTRAINT, businessHours.toJson())}.
* {@code
* calendar.setOption(Option.SELECT_CONSTRAINT, "businessHours");
* }
*
* @see selectConstraint
*/
SELECT_CONSTRAINT,
/**
* Long press delay (in milliseconds) on touch devices before a date becomes selectable. Only applies on
* touch devices.
*
*
*
* @see selectLongPressDelay
*/
SELECT_LONG_PRESS_DELAY,
/**
* Minimum distance in pixels the mouse must travel after a mouse down before a selection starts.
*
*
*
*
*
* @see selectMirror
*/
SELECT_MIRROR,
/**
* Whether the user may select periods of time that are occupied by entries.
*
*
* {@code
* // allow selections over background entries only
* calendar.setOption(Option.SELECT_OVERLAP,
* JsCallback.of("function(event) { return event.display === 'background'; }"));
* }
*
* An all-day entry of a day counts as intersecting in timegrid views, although it does not visually overlap the
* time slots.
*
* @see selectOverlap
*/
SELECT_OVERLAP,
/**
* Whether dates of the previous or next month are rendered in month view. Disabled days do not render entries.
*
*
*
* @see showNonCurrentDates
*/
SHOW_NON_CURRENT_DATES,
/**
* CSS classes for each individual month in multi-month views.
*
*
* {@code
* calendar.setOption(Option.SINGLE_MONTH_CLASS, JsCallback.of("""
* function(info) {
* return info.isFirst ? 'first-month' : '';
* }"""));
* }
*
* @see singleMonthClass
*/
SINGLE_MONTH_CLASS("singleMonthClass"),
/**
* Called after the element of an individual month of multi-month views is added to the DOM. Accepts a
* {@link JsCallback}.
*
*
* {@code
* calendar.setOption(Option.SINGLE_MONTH_DID_MOUNT, JsCallback.of("""
* function(info) {
* info.el.dataset.first = info.isFirst;
* }"""));
* }
*
*
* {@code
* calendar.setOption(Option.SINGLE_MONTH_HEADER_CLASS, JsCallback.of("""
* function(info) {
* return info.isSticky ? 'sticky-month-title' : '';
* }"""));
* }
*
* @see singleMonthHeaderClass
*/
SINGLE_MONTH_HEADER_CLASS("singleMonthHeaderClass"),
/**
* CSS classes for the inner element of the month header in multi-month views. This element may be a nav link.
*
*
* {@code
* calendar.setOption(Option.SINGLE_MONTH_HEADER_INNER_CLASS, JsCallback.of("""
* function(info) {
* return info.hasNavLink ? 'linked-month-title' : '';
* }"""));
* }
*
* @see singleMonthHeaderInnerClass
*/
SINGLE_MONTH_HEADER_INNER_CLASS("singleMonthHeaderInnerClass"),
/**
* Minimum pixel width of each mini-month in the multi-month grid, padding included. If the available
* width would make a month smaller, the months wrap to the next row.
*
*
*
* @see singleMonthMinWidth
*/
SINGLE_MONTH_MIN_WIDTH,
/**
* Format of the text above each month in multi-month views.
*
*
* {@code
* calendar.setOption(Option.SINGLE_MONTH_TITLE_FORMAT, Map.of("month", "short", "year", "numeric"));
* }
*
* @see singleMonthTitleFormat
*/
SINGLE_MONTH_TITLE_FORMAT,
/**
* Called before the element of an individual month of multi-month views is removed from the DOM. Accepts a
* {@link JsCallback}.
*
*
* {@code
* calendar.setOption(Option.SINGLE_MONTH_WILL_UNMOUNT, JsCallback.of("""
* function(info) {
* console.log('month removed', info.el);
* }"""));
* }
*
* @see singleMonthWillUnmount
*/
SINGLE_MONTH_WILL_UNMOUNT("singleMonthWillUnmount"),
/**
* Duration of each time slot in timegrid and timeline views.
*
*
*
* @see slotDuration
*/
@JsonConverter(DurationConverter.class)
SLOT_DURATION,
/**
* Whether timed entries in timegrid views visually overlap. With {@code true}, at most half of each entry is
* obscured. With {@code false}, entries never overlap.
*
*
*
* @see slotEventOverlap
*/
SLOT_ENTRY_OVERLAP,
/**
* Horizontal text alignment of the slot headers, where time grid and timeline views display their date and time
* text. FullCalendar documents this option only partly or not at all. It accepts the same values as
* {@link #DAY_HEADER_ALIGN}.
*
*
* {@code
* calendar.setOption(Option.SLOT_HEADER_ALIGN, HeaderAlign.CENTER);
*
* calendar.setOption(Option.SLOT_HEADER_ALIGN, JsCallback.of("""
* function(info) {
* return info.isTime ? 'end' : 'start';
* }"""));
* }
*
* @see slotHeaderAlign
*/
SLOT_HEADER_ALIGN("slotHeaderAlign"),
/**
* CSS classes for time slot headers, where time grid and timeline views show the date or time text of a slot.
*
*
* {@code
* calendar.setOption(Option.SLOT_HEADER_CLASS, JsCallback.of("""
* function(info) {
* return info.isMajor ? 'major-slot' : '';
* }"""));
* }
*
* @see slotHeaderClass
*/
SLOT_HEADER_CLASS("slotHeaderClass"),
/**
* Custom content for a time slot header. Accepts a {@link JsCallback}.
*
*
* {@code
* calendar.setOption(Option.SLOT_HEADER_CONTENT, JsCallback.of("""
* function(info) {
* return info.isMajor ? { html: '' + info.text + '' } : info.text;
* }"""));
* }
*
* @see slotHeaderContent
*/
SLOT_HEADER_CONTENT("slotHeaderContent"),
/**
* Called after a time slot header is added to the DOM. Accepts a {@link JsCallback}.
*
*
* {@code
* calendar.setOption(Option.SLOT_HEADER_DID_MOUNT, JsCallback.of("""
* function(info) {
* info.el.title = info.date.toISOString();
* }"""));
* }
*
*
* {@code
* calendar.setOption(Option.SLOT_HEADER_DIVIDER_CLASS, JsCallback.of("""
* function(info) {
* return info.inTableHeader ? 'header-divider' : '';
* }"""));
* }
*
* @see slotHeaderDividerClass
*/
SLOT_HEADER_DIVIDER_CLASS("slotHeaderDividerClass"),
/**
* Text format of the time slot headers. In timeline views, a list of formats creates multiple tiers of header rows.
*
*
* {@code
* calendar.setOption(Option.SLOT_HEADER_FORMAT,
* Map.of("hour", "2-digit", "minute", "2-digit", "hour12", false));
* }
*
* @see slotHeaderFormat
*/
SLOT_HEADER_FORMAT,
/**
* CSS classes for the inner wrapper of the slot headers, where time grid and timeline views display their date
* and time text. Useful for adjusting padding.
*
*
* {@code
* calendar.setOption(Option.SLOT_HEADER_INNER_CLASS, JsCallback.of("""
* function(info) {
* return info.isMajor ? 'major-slot' : '';
* }"""));
* }
*
* @see slotHeaderInnerClass
*/
SLOT_HEADER_INNER_CLASS("slotHeaderInnerClass"),
/**
* Interval at which time slots are labeled with a header text, e.g. {@code "01:00"} shows headers on the hour marks
* even if {@link #SLOT_DURATION} is 15 or 30 minutes.
*
*
*
* @see slotHeaderInterval
*/
@JsonConverter(DurationConverter.class)
SLOT_HEADER_INTERVAL,
/**
* CSS classes for the row that contains the slot header cells in time grid and timeline views.
*
*
* {@code
* calendar.setOption(Option.SLOT_HEADER_ROW_CLASS, "my-slot-header-row");
* }
*
* @see slotHeaderRowClass
*/
SLOT_HEADER_ROW_CLASS("slotHeaderRowClass"),
/**
* Sticky positioning of the slot headers. FullCalendar documents this option only partly or not at all.
*
*
* {@code
* calendar.setOption(Option.SLOT_HEADER_STICKY, false);
* }
*
* @see tableHeaderSticky
*/
SLOT_HEADER_STICKY("slotHeaderSticky"),
/**
* Called before a time slot header is removed from the DOM. Accepts a {@link JsCallback}.
*
*
* {@code
* calendar.setOption(Option.SLOT_HEADER_WILL_UNMOUNT, JsCallback.of("""
* function(info) {
* console.log('removing slot header', info.text);
* }"""));
* }
*
* @see slotHeaderWillUnmount
*/
SLOT_HEADER_WILL_UNMOUNT("slotHeaderWillUnmount"),
/**
* Former name of {@link #SLOT_HEADER_CLASS}: CSS classes for time slot headers, where time grid and timeline views
* show the date or time text of a slot.
* @deprecated use {@link #SLOT_HEADER_CLASS}, which sets the same FullCalendar option. Return a class name string. FullCalendar 7 drops arrays.
*/
@Deprecated(since = "8.0.0", forRemoval = true)
SLOT_LABEL_CLASS_NAMES("slotHeaderClass"),
/**
* Former name of {@link #SLOT_HEADER_CONTENT}: Custom content for a time slot header.
* @deprecated use {@link #SLOT_HEADER_CONTENT}, which sets the same FullCalendar option
*/
@Deprecated(since = "8.0.0", forRemoval = true)
SLOT_LABEL_CONTENT("slotHeaderContent"),
/**
* Former name of {@link #SLOT_HEADER_DID_MOUNT}: Called after a time slot header is added to the DOM. Accepts a
* {@link JsCallback}.
* @deprecated use {@link #SLOT_HEADER_DID_MOUNT}, which sets the same FullCalendar option
*/
@Deprecated(since = "8.0.0", forRemoval = true)
SLOT_LABEL_DID_MOUNT("slotHeaderDidMount"),
/**
* Former name of {@link #SLOT_HEADER_FORMAT}: text format of the time slot headers.
*
* @deprecated use {@link #SLOT_HEADER_FORMAT}, which sets the same FullCalendar option
*/
@Deprecated(since = "8.0.0", forRemoval = true)
SLOT_LABEL_FORMAT("slotHeaderFormat"),
/**
* Former name of {@link #SLOT_HEADER_INTERVAL}: interval at which time slots are labeled.
*
* @deprecated use {@link #SLOT_HEADER_INTERVAL}, which sets the same FullCalendar option
*/
@JsonConverter(DurationConverter.class)
@Deprecated(since = "8.0.0", forRemoval = true)
SLOT_LABEL_INTERVAL("slotHeaderInterval"),
/**
* Former name of {@link #SLOT_HEADER_WILL_UNMOUNT}: Called before a time slot header is removed from the DOM.
* Accepts a {@link JsCallback}.
* @deprecated use {@link #SLOT_HEADER_WILL_UNMOUNT}, which sets the same FullCalendar option
*/
@Deprecated(since = "8.0.0", forRemoval = true)
SLOT_LABEL_WILL_UNMOUNT("slotHeaderWillUnmount"),
/**
* CSS classes for the lane of a time slot. In time grid views this is the horizontal space passing under all days,
* in timeline views the vertical space passing through the resources.
*
*
* {@code
* calendar.setOption(Option.SLOT_LANE_CLASS, JsCallback.of("""
* function(info) {
* return info.isMajor ? 'major-lane' : 'minor-lane';
* }"""));
* }
*
* @see slotLaneClass
*/
SLOT_LANE_CLASS("slotLaneClass"),
/**
* Former name of {@link #SLOT_LANE_CLASS}: CSS classes for the lane of a time slot. In time grid views this is the
* horizontal space passing under all days, in timeline views the vertical space passing through the resources.
* @deprecated use {@link #SLOT_LANE_CLASS}, which sets the same FullCalendar option. Return a class name string. FullCalendar 7 drops arrays.
*/
@Deprecated(since = "8.0.0", forRemoval = true)
SLOT_LANE_CLASS_NAMES("slotLaneClass"),
/**
* Called after a time slot lane is added to the DOM. Accepts a {@link JsCallback}.
*
*
* {@code
* calendar.setOption(Option.SLOT_LANE_DID_MOUNT, JsCallback.of("""
* function(info) {
* if (info.isPast) info.el.style.opacity = 0.6;
* }"""));
* }
*
*
* {@code
* calendar.setOption(Option.SLOT_LANE_WILL_UNMOUNT, JsCallback.of("""
* function(info) {
* console.log('removing lane', info.date);
* }"""));
* }
*
* @see slotLaneWillUnmount
*/
SLOT_LANE_WILL_UNMOUNT("slotLaneWillUnmount"),
/**
* Last time slot displayed for each day, as an exclusive end time. {@code "24:00:00"} ends at midnight. The slot
* limit also applies when the view is scrolled back all the way.
*
*
*
* @see slotMaxTime
*/
@JsonConverter(DurationConverter.class)
SLOT_MAX_TIME,
/**
* Height of each slot of the time axis, in pixels. Without it, a value is computed.
*
*
* {@code
* calendar.setOption(Option.SLOT_MIN_HEIGHT, 40);
* }
*
* @see slotMinHeight
*/
SLOT_MIN_HEIGHT("slotMinHeight"),
/**
* First time slot displayed for each day. {@code "00:00:00"} starts at midnight. The slot limit also applies when
* the view is scrolled back all the way.
*
*
*
* @see slotMinTime
*/
@JsonConverter(DurationConverter.class)
SLOT_MIN_TIME,
/**
* Time interval to which a dragged entry snaps on the time axis. Also sets the granularity of selections.
*
*
*
* @see snapDuration
*/
@JsonConverter(DurationConverter.class)
SNAP_DURATION,
/**
* Former name of {@link #FOOTER_SCROLLBAR_STICKY}: whether the view's horizontal scrollbar is fixed to the bottom
* of the viewport.
*
* @deprecated use {@link #FOOTER_SCROLLBAR_STICKY}, which sets the same FullCalendar option
*/
@Deprecated(since = "8.0.0", forRemoval = true)
STICKY_FOOTER_SCROLLBAR("footerScrollbarSticky"),
/**
* Former name of {@link #TABLE_HEADER_STICKY}: whether the date headers are fixed to the top of the viewport.
*
* @deprecated use {@link #TABLE_HEADER_STICKY}, which sets the same FullCalendar option
*/
@Deprecated(since = "8.0.0", forRemoval = true)
STICKY_HEADER_DATES("tableHeaderSticky"),
/**
* CSS classes for the body of the table-structured layout used across views, where the day cells and entries
* appear.
*
*
* {@code
* calendar.setOption(Option.TABLE_BODY_CLASS, JsCallback.of("""
* function(info) {
* return info.borderlessTop ? 'no-top-border' : '';
* }"""));
* }
*
* @see tableBodyClass
*/
TABLE_BODY_CLASS("tableBodyClass"),
/**
* CSS classes for the root element of the table-structured layout used across views.
*
*
* {@code
* calendar.setOption(Option.TABLE_CLASS, JsCallback.of("""
* function(info) {
* return info.borderlessX ? 'no-side-borders' : '';
* }"""));
* }
*
* @see tableClass
*/
TABLE_CLASS("tableClass"),
/**
* CSS classes for the header row of the table-structured layout used across views, where the day names appear.
*
*
* {@code
* calendar.setOption(Option.TABLE_HEADER_CLASS, JsCallback.of("""
* function(info) {
* return info.isSticky ? 'pinned-header' : '';
* }"""));
* }
*
* @see tableHeaderClass
*/
TABLE_HEADER_CLASS("tableHeaderClass"),
/**
* Whether the date headers at the top of the calendar are fixed to the top of the viewport while the page is
* scrolled vertically.
*
*
*
* @see tableHeaderSticky
*/
TABLE_HEADER_STICKY,
/**
* Accessibility label of the time axis next to the timed section of time grid views, read by screen readers.
* FullCalendar documents this option only partly or not at all.
*
*
* {@code
* calendar.setOption(Option.TIMED_TEXT, "Timed");
* }
*
* @see timedText
*/
TIMED_TEXT("timedText"),
/**
* Time zone used for displaying and interpreting dates on the calendar. It affects the displayed times of entries,
* their position on the calendar and the dates the client sends to the server.
*
*
* {@code
* calendar.setOption(Option.TIMEZONE, "Europe/Berlin");
* Optional
*
* @see timeZone
*/
TIMEZONE("timeZone"),
/**
* Format of the title text in FullCalendar's built-in header toolbar.
*
*
* {@code
* calendar.setOption(Option.TITLE_FORMAT, Map.of("year", "numeric", "month", "short"));
* }
*
* @see titleFormat
*/
TITLE_FORMAT("titleFormat"),
/**
* Accessible label ({@code aria-label}) of the "today" button in FullCalendar's built-in toolbar.
*
*
* {@code
* calendar.setOption(Option.TODAY_HINT, JsCallback.of("function(unitText, unitId) { return 'Jump to this ' + unitText; }"));
* }
*
* @see todayHint
*/
TODAY_HINT,
/**
* Text of the "today" button of FullCalendar's built-in toolbar. Each locale defines this text, see the locale
* page.
*
*
* {@code
* calendar.setOption(Option.TODAY_TEXT, "Today");
* }
*
* @see todayText (locale object)
*/
TODAY_TEXT("todayText"),
/**
* CSS classes for the container of FullCalendar's built-in toolbar, see {@link #HEADER_TOOLBAR}.
* Applies to the header and the footer toolbar.
*
*
* {@code
* calendar.setOption(Option.TOOLBAR_CLASS, "my-toolbar");
* }
*
* @see toolbarClass
*/
TOOLBAR_CLASS("toolbarClass"),
/**
* Defines your own content for FullCalendar's built-in toolbars, for use in {@link #HEADER_TOOLBAR} or
* {@link #FOOTER_TOOLBAR}.
*
*
* {@code
* calendar.setOption(Option.TOOLBAR_ELEMENTS, Map.of(
* "hint", JsCallback.of("function() { return { html: 'Drag to move' }; }")));
* calendar.setOption(Option.HEADER_TOOLBAR, Map.of(
* NativeToolbarParts.START, NativeToolbarParts.PREV + "," + NativeToolbarParts.NEXT + " hint",
* NativeToolbarParts.CENTER, NativeToolbarParts.TITLE));
* }
*
* @see toolbarElements
*/
TOOLBAR_ELEMENTS("toolbarElements"),
/**
* CSS classes for each section (start, center, end) of FullCalendar's built-in toolbars.
*
*
* {@code
* calendar.setOption(Option.TOOLBAR_SECTION_CLASS, JsCallback.of("""
* function(info) {
* return 'section-' + info.name;
* }"""));
* }
*
* @see toolbarSectionClass
*/
TOOLBAR_SECTION_CLASS("toolbarSectionClass"),
/**
* CSS classes for the title text element of FullCalendar's built-in toolbars. Unlike the other toolbar class
* options, it takes a class name only, no callback.
*
*
* {@code
* calendar.setOption(Option.TOOLBAR_TITLE_CLASS, "my-title");
* }
*
* @see toolbarTitleClass
*/
TOOLBAR_TITLE_CLASS("toolbarTitleClass"),
/**
* Whether clicking elsewhere on the page clears the current selection. Only applies when {@link #SELECTABLE} is
* {@code true}.
*
*
*
* @see unselectAuto
*/
UNSELECT_AUTO,
/**
* CSS selector for elements that, when clicked, do not clear the current selection (see {@link #UNSELECT_AUTO}).
* Useful for a "create entry" form that opens after a selection.
*
*
*
* @see unselectCancel
*/
UNSELECT_CANCEL,
/**
* Limits the dates the user can navigate to and where entries can go. Dates outside the range are grayed out,
* entries cannot be dragged or resized into them, and the prev/next buttons are disabled when they would leave the
* range.
*
*
* {@code
* // fixed range: March and April 2025
* calendar.setOption(Option.VALID_RANGE, new DateRange(LocalDate.of(2025, 3, 1), LocalDate.of(2025, 5, 1)));
*
* // open-ended range: nothing before today
* calendar.setOption(Option.VALID_RANGE,
* JsCallback.of("function(todayDate) { return { start: todayDate }; }"));
* }
*
* @see validRange
*/
@JsonConverter(DateRangeConverter.class)
VALID_RANGE,
/**
* Accessibility label of the button group in FullCalendar's built-in toolbar that switches the view, read by screen
* readers.
*
*
* {@code
* calendar.setOption(Option.VIEW_CHANGE_HINT, "Change view");
* }
*
* @see hints (viewChangeHint)
*/
VIEW_CHANGE_HINT("viewChangeHint"),
/**
* CSS classes for the root element of the view. Called whenever the view changes.
*
*
* {@code
* calendar.setOption(Option.VIEW_CLASS, JsCallback.of("""
* function(info) {
* return 'view-' + info.view.type;
* }"""));
* }
*
* @see viewClass
*/
VIEW_CLASS("viewClass"),
/**
* Former name of {@link #VIEW_CLASS}: CSS classes for the root element of the view.
* @deprecated use {@link #VIEW_CLASS}, which sets the same FullCalendar option. Return a class name string. FullCalendar 7 drops arrays.
*/
@Deprecated(since = "8.0.0", forRemoval = true)
VIEW_CLASS_NAMES("viewClass"),
/**
* Called right after the root element of the view is added to the DOM. Accepts a {@link JsCallback}.
*
*
* {@code
* calendar.setOption(Option.VIEW_DID_MOUNT, JsCallback.of("""
* function(info) {
* console.log('view mounted', info.view.title);
* }"""));
* }
*
*
* {@code
* calendar.setOption(Option.VIEW_HINT, JsCallback.of("""
* function(buttonText, buttonName) {
* return buttonText + (buttonName.startsWith('list') ? ' list view' : ' view');
* }"""));
* }
*
* @see viewHint
*/
VIEW_HINT("viewHint"),
/**
* Called right before the root element of the view is removed from the DOM. Accepts a {@link JsCallback}.
*
*
* {@code
* calendar.setOption(Option.VIEW_WILL_UNMOUNT, JsCallback.of("""
* function(info) {
* console.log('view unmounting', info.view.type);
* }"""));
* }
*
* @see viewWillUnmount
*/
VIEW_WILL_UNMOUNT("viewWillUnmount"),
/**
* Sets the exact date range a view shows. Unlike {@link #VALID_RANGE}, both {@code start} and {@code end} are
* required, and {@code end} is exclusive.
*
*
* {@code
* // fixed range
* calendar.setOption(Option.VISIBLE_RANGE, new DateRange(LocalDate.of(2025, 3, 22), LocalDate.of(2025, 3, 25)));
*
* // one day before and two days after the current date
* calendar.setOption(Option.VISIBLE_RANGE, JsCallback.of("""
* function(currentDate) {
* const start = new Date(currentDate.valueOf());
* const end = new Date(currentDate.valueOf());
* start.setDate(start.getDate() - 1);
* end.setDate(end.getDate() + 2);
* return { start: start, end: end };
* }"""));
* }
*
* @see visibleRange
*/
@JsonConverter(DateRangeConverter.class)
VISIBLE_RANGE("visibleRange"),
/**
* Whether Saturday and Sunday columns are included in the calendar views.
*
*
*
* @see weekends
*/
WEEKENDS,
/**
* Whether week numbers are displayed: next to each row of days in month and daygrid views, and in the top-left
* corner of timegrid views.
*
*
*
* @see weekNumbers
*/
WEEK_NUMBERS,
/**
* Method used to calculate the week numbers shown by {@link #WEEK_NUMBERS}. {@code "ISO"} also changes the default
* of {@code firstDay} to {@code 1} (Monday).
*
*
* {@code
* calendar.setOption(Option.WEEK_NUMBER_CALCULATION, WeekNumberCalculation.ISO);
* }
*
* @see weekNumberCalculation
*/
WEEK_NUMBER_CALCULATION,
/**
* Text format of the week numbers. The text depends on {@link #WEEK_TEXT_SHORT}: with {@code "W"}, {@code narrow}
* gives {@code "W6"}, {@code short} gives {@code "W 6"}, {@code numeric} gives {@code "6"}.
*
*
* {@code
* calendar.setOption(Option.WEEK_NUMBER_FORMAT, Map.of("week", "numeric"));
* }
*
* @see weekNumberFormat
*/
WEEK_NUMBER_FORMAT,
/**
* CSS classes for the week number in the header above the time axis of time grid views.
*
*
* {@code
* calendar.setOption(Option.WEEK_NUMBER_HEADER_CLASS, JsCallback.of("""
* function(info) {
* return info.isNarrow ? 'narrow-week-number' : '';
* }"""));
* }
*
* @see weekNumberHeaderClass
*/
WEEK_NUMBER_HEADER_CLASS("weekNumberHeaderClass"),
/**
* Custom content for the week number in the header above the time axis of time grid views. Accepts a
* {@link JsCallback}.
*
*
* {@code
* calendar.setOption(Option.WEEK_NUMBER_HEADER_CONTENT, JsCallback.of("""
* function(info) {
* return { html: '' + info.text + '' };
* }"""));
* }
*
* @see weekNumberHeaderContent
*/
WEEK_NUMBER_HEADER_CONTENT("weekNumberHeaderContent"),
/**
* Called after the week number in the header above the time axis of time grid views is added to the DOM. Accepts a
* {@link JsCallback}.
*
*
* {@code
* calendar.setOption(Option.WEEK_NUMBER_HEADER_DID_MOUNT, JsCallback.of("""
* function(info) {
* info.el.title = 'Week ' + info.num;
* }"""));
* }
*
*
* {@code
* calendar.setOption(Option.WEEK_NUMBER_HEADER_INNER_CLASS, JsCallback.of("""
* function(info) {
* return info.isNarrow ? 'narrow-week-number' : '';
* }"""));
* }
*
* @see weekNumberHeaderInnerClass
*/
WEEK_NUMBER_HEADER_INNER_CLASS("weekNumberHeaderInnerClass"),
/**
* Called before the week number in the header above the time axis of time grid views is removed from the DOM.
* Accepts a {@link JsCallback}.
*
*
* {@code
* calendar.setOption(Option.WEEK_NUMBER_HEADER_WILL_UNMOUNT, JsCallback.of("""
* function(info) {
* console.log('removing week number', info.num);
* }"""));
* }
*
* @see weekNumberHeaderWillUnmount
*/
WEEK_NUMBER_HEADER_WILL_UNMOUNT("weekNumberHeaderWillUnmount"),
/**
* Former name of {@link #WEEK_TEXT_SHORT}: short heading text for week numbers.
*
* @deprecated use {@link #WEEK_TEXT_SHORT}, which sets the same FullCalendar option
*/
@Deprecated(since = "8.0.0", forRemoval = true)
WEEK_TEXT("weekTextShort"),
/**
* Like {@link #WEEK_TEXT_SHORT}, but only used when the {@code week} setting of a date format is {@code "long"}.
*
*
*
* @see weekTextLong
*/
WEEK_TEXT_LONG,
/**
* Short heading text for week numbers (e.g., "W" in "W1"). Shown above the week number column in daygrid views and
* next to the week number in the top-left cell of timegrid views. Also used for weeks in date formatting.
*
*
*
* @see weekTextShort
*/
WEEK_TEXT_SHORT,
/**
* Text of the year view button of FullCalendar's built-in toolbar. FullCalendar documents this option only partly
* or not at all.
*
*
* {@code
* calendar.setOption(Option.YEAR_TEXT, "Year");
* }
*
* @see yearText (locale object)
*/
YEAR_TEXT("yearText"),
;
private final String optionKey;
private static final Map