@fullcalendar/luxon

FullCalendar Luxon 1 Plugin

Enhanced date formatting, conversion, and named time zone functionality with Luxon 1

Installation

First, ensure Luxon is installed:

npm install luxon@1

Then, install the FullCalendar core package, the Luxon plugin, and any other plugins (like daygrid):

npm install @fullcalendar/core @fullcalendar/luxon @fullcalendar/daygrid

Usage

Instantiate a Calendar with the necessary plugin:

import { Calendar } from '@fullcalendar/core'
import luxonPlugin from '@fullcalendar/luxon'
import dayGridPlugin from '@fullcalendar/daygrid'

const calendarEl = document.getElementById('calendar')
const calendar = new Calendar(calendarEl, {
  plugins: [
    luxonPlugin,
    dayGridPlugin
  ],
  initialView: 'dayGridMonth',
  titleFormat: 'LLLL d, yyyy', // use Luxon format strings
  timeZone: 'America/New_York' // enhance named time zones
})

calendar.render()

Changelog

6.1.11 (2024-02-19)

General

• fix: fc-event-past className not attached to events that end midnight before today (#6120, #6486)
• fix: aria-labelledby on view container should not exist when headerToolbar:false (#6884)

DayGrid and MultiMonth

• fix: possible infinite recursion with dayGrid, dayMaxEventRows, and many hidden event rows (#7462)
• fix: incorrectly put events under +more link (#7002, #6608, #6900)

React

• fix: possible +more link numbers incorrect (#7573, #6608, #6900)

Angular

• fix: Angular 17 SRR error with el.getRootNode (#7550)