Full Calendar(Salesforce) 📅📆

FullCalendar V4

Provides a <isExposed>false</isExposed> that loads the FullCalendar static resources and displays a calendar. This component is capable of rendering events on any custom object along with standard objects like event.

Public Methods

setEvents is a public method that takes in formatted events, and renders them to the calendar. By default the function will remove the current events and render the new ones.

 @api setEvents(events)

For event info, see the Event Object

Views

The calendar provides multiple views in order to display the events.

The initial view is dayGridMonth; views provided are ['listWeek', 'dayGridMonth', 'timeGridWeek', 'timeGridDay'] .

Examples of each view are provided below:

listWeek

dayGridMonth

timeGridWeek

timeGridDay

Events

Date Change

As you navigate between dates (months, weeks, days; based on the current view) an event is dispatched everytime the viewed dates change with the start and end of the viewable calender. 'datechange'

this.event('datechange', { startDate, endDate })

Event Click

When clicking an event on the calendar from any view, an event is dispatched with an info object with data about the event. 'fceventclick'

this.event('fceventclick', info)

Date Click

When a date is clicked on the calendar, an event is dispatched with an info object with data about the date. 'fcdateclick'

this.event('fcdateclick', info)

Mouse Enter

Triggered when the user mouses over an event. An event is dispatched with an info object with data about the event. 'eventmouseenter'

this.event('eventmouseenter', info)

GitHub

View Github