@fullcalendar/timeline 5.10.1 → 6.0.0-beta.1

package/main.cjs.js

@@ -1,7 +1,7 @@
 /*!
-FullCalendar Scheduler v5.10.1
+FullCalendar Scheduler v6.0.0-beta.1
 Docs & License: https://fullcalendar.io/scheduler
-(c) 2021 Adam Shaw
+(c) 2022 Adam Shaw
 */
 'use strict';
 
@@ -9,20 +9,18 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var common = require('@fullcalendar/common');
 var premiumCommonPlugin = require('@fullcalendar/premium-common');
-var tslib = require('tslib');
 var scrollgrid = require('@fullcalendar/scrollgrid');
-;
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var premiumCommonPlugin__default = /*#__PURE__*/_interopDefaultLegacy(premiumCommonPlugin);
 
-var MIN_AUTO_LABELS = 18; // more than `12` months but less that `24` hours
-var MAX_AUTO_SLOTS_PER_LABEL = 6; // allows 6 10-min slots in an hour
-var MAX_AUTO_CELLS = 200; // allows 4-days to have a :30 slot duration
+const MIN_AUTO_LABELS = 18; // more than `12` months but less that `24` hours
+const MAX_AUTO_SLOTS_PER_LABEL = 6; // allows 6 10-min slots in an hour
+const MAX_AUTO_CELLS = 200; // allows 4-days to have a :30 slot duration
 common.config.MAX_TIMELINE_SLOTS = 1000;
 // potential nice values for slot-duration and interval-duration
-var STOCK_SUB_DURATIONS = [
+const STOCK_SUB_DURATIONS = [
     { years: 1 },
     { months: 1 },
     { days: 1 },
@@ -43,22 +41,22 @@ var STOCK_SUB_DURATIONS = [
     { milliseconds: 1 },
 ];
 function buildTimelineDateProfile(dateProfile, dateEnv, allOptions, dateProfileGenerator) {
-    var tDateProfile = {
+    let tDateProfile = {
         labelInterval: allOptions.slotLabelInterval,
         slotDuration: allOptions.slotDuration,
     };
     validateLabelAndSlot(tDateProfile, dateProfile, dateEnv); // validate after computed grid duration
     ensureLabelInterval(tDateProfile, dateProfile, dateEnv);
     ensureSlotDuration(tDateProfile, dateProfile, dateEnv);
-    var input = allOptions.slotLabelFormat;
-    var rawFormats = Array.isArray(input) ? input :
+    let input = allOptions.slotLabelFormat;
+    let rawFormats = Array.isArray(input) ? input :
         (input != null) ? [input] :
             computeHeaderFormats(tDateProfile, dateProfile, dateEnv, allOptions);
-    tDateProfile.headerFormats = rawFormats.map(function (rawFormat) { return common.createFormatter(rawFormat); });
+    tDateProfile.headerFormats = rawFormats.map((rawFormat) => common.createFormatter(rawFormat));
     tDateProfile.isTimeScale = Boolean(tDateProfile.slotDuration.milliseconds);
-    var largeUnit = null;
+    let largeUnit = null;
     if (!tDateProfile.isTimeScale) {
-        var slotUnit = common.greatestDurationDenominator(tDateProfile.slotDuration).unit;
+        const slotUnit = common.greatestDurationDenominator(tDateProfile.slotDuration).unit;
         if (/year|month|week/.test(slotUnit)) {
             largeUnit = slotUnit;
         }
@@ -75,9 +73,9 @@ function buildTimelineDateProfile(dateProfile, dateEnv, allOptions, dateProfileG
     console.log('isTimeScale', timelineView.isTimeScale)
     console.log('largeUnit', timelineView.largeUnit)
     */
-    var rawSnapDuration = allOptions.snapDuration;
-    var snapDuration;
-    var snapsPerSlot;
+    let rawSnapDuration = allOptions.snapDuration;
+    let snapDuration;
+    let snapsPerSlot;
     if (rawSnapDuration) {
         snapDuration = common.createDuration(rawSnapDuration);
         snapsPerSlot = common.wholeDivideDurations(tDateProfile.slotDuration, snapDuration);
@@ -90,10 +88,10 @@ function buildTimelineDateProfile(dateProfile, dateEnv, allOptions, dateProfileG
     tDateProfile.snapDuration = snapDuration;
     tDateProfile.snapsPerSlot = snapsPerSlot;
     // more...
-    var timeWindowMs = common.asRoughMs(dateProfile.slotMaxTime) - common.asRoughMs(dateProfile.slotMinTime);
+    let timeWindowMs = common.asRoughMs(dateProfile.slotMaxTime) - common.asRoughMs(dateProfile.slotMinTime);
     // TODO: why not use normalizeRange!?
-    var normalizedStart = normalizeDate(dateProfile.renderRange.start, tDateProfile, dateEnv);
-    var normalizedEnd = normalizeDate(dateProfile.renderRange.end, tDateProfile, dateEnv);
+    let normalizedStart = normalizeDate(dateProfile.renderRange.start, tDateProfile, dateEnv);
+    let normalizedEnd = normalizeDate(dateProfile.renderRange.end, tDateProfile, dateEnv);
     // apply slotMinTime/slotMaxTime
     // TODO: View should be responsible.
     if (tDateProfile.isTimeScale) {
@@ -102,8 +100,8 @@ function buildTimelineDateProfile(dateProfile, dateEnv, allOptions, dateProfileG
     }
     tDateProfile.timeWindowMs = timeWindowMs;
     tDateProfile.normalizedRange = { start: normalizedStart, end: normalizedEnd };
-    var slotDates = [];
-    var date = normalizedStart;
+    let slotDates = [];
+    let date = normalizedStart;
     while (date < normalizedEnd) {
         if (isValidDate(date, tDateProfile, dateProfile, dateProfileGenerator)) {
             slotDates.push(date);
@@ -112,10 +110,10 @@ function buildTimelineDateProfile(dateProfile, dateEnv, allOptions, dateProfileG
     }
     tDateProfile.slotDates = slotDates;
     // more...
-    var snapIndex = -1;
-    var snapDiff = 0; // index of the diff :(
-    var snapDiffToIndex = [];
-    var snapIndexToDiff = [];
+    let snapIndex = -1;
+    let snapDiff = 0; // index of the diff :(
+    const snapDiffToIndex = [];
+    const snapIndexToDiff = [];
     date = normalizedStart;
     while (date < normalizedEnd) {
         if (isValidDate(date, tDateProfile, dateProfile, dateProfileGenerator)) {
@@ -143,7 +141,7 @@ function buildTimelineDateProfile(dateProfile, dateEnv, allOptions, dateProfileG
 snaps to appropriate unit
 */
 function normalizeDate(date, tDateProfile, dateEnv) {
-    var normalDate = date;
+    let normalDate = date;
     if (!tDateProfile.isTimeScale) {
         normalDate = common.startOfDay(normalDate);
         if (tDateProfile.largeUnit) {
@@ -159,7 +157,7 @@ function normalizeRange(range, tDateProfile, dateEnv) {
     if (!tDateProfile.isTimeScale) {
         range = common.computeVisibleDayRange(range);
         if (tDateProfile.largeUnit) {
-            var dayRange = range; // preserve original result
+            let dayRange = range; // preserve original result
             range = {
                 start: dateEnv.startOf(range.start, tDateProfile.largeUnit),
                 end: dateEnv.startOf(range.end, tDateProfile.largeUnit),
@@ -182,19 +180,19 @@ function isValidDate(date, tDateProfile, dateProfile, dateProfileGenerator) {
     }
     if (tDateProfile.isTimeScale) {
         // determine if the time is within slotMinTime/slotMaxTime, which may have wacky values
-        var day = common.startOfDay(date);
-        var timeMs = date.valueOf() - day.valueOf();
-        var ms = timeMs - common.asRoughMs(dateProfile.slotMinTime); // milliseconds since slotMinTime
+        let day = common.startOfDay(date);
+        let timeMs = date.valueOf() - day.valueOf();
+        let ms = timeMs - common.asRoughMs(dateProfile.slotMinTime); // milliseconds since slotMinTime
         ms = ((ms % 86400000) + 86400000) % 86400000; // make negative values wrap to 24hr clock
         return ms < tDateProfile.timeWindowMs; // before the slotMaxTime?
     }
     return true;
 }
 function validateLabelAndSlot(tDateProfile, dateProfile, dateEnv) {
-    var currentRange = dateProfile.currentRange;
+    const { currentRange } = dateProfile;
     // make sure labelInterval doesn't exceed the max number of cells
     if (tDateProfile.labelInterval) {
-        var labelCnt = dateEnv.countDurationsBetween(currentRange.start, currentRange.end, tDateProfile.labelInterval);
+        const labelCnt = dateEnv.countDurationsBetween(currentRange.start, currentRange.end, tDateProfile.labelInterval);
         if (labelCnt > common.config.MAX_TIMELINE_SLOTS) {
             console.warn('slotLabelInterval results in too many cells');
             tDateProfile.labelInterval = null;
@@ -202,7 +200,7 @@ function validateLabelAndSlot(tDateProfile, dateProfile, dateEnv) {
     }
     // make sure slotDuration doesn't exceed the maximum number of cells
     if (tDateProfile.slotDuration) {
-        var slotCnt = dateEnv.countDurationsBetween(currentRange.start, currentRange.end, tDateProfile.slotDuration);
+        const slotCnt = dateEnv.countDurationsBetween(currentRange.start, currentRange.end, tDateProfile.slotDuration);
         if (slotCnt > common.config.MAX_TIMELINE_SLOTS) {
             console.warn('slotDuration results in too many cells');
             tDateProfile.slotDuration = null;
@@ -210,7 +208,7 @@ function validateLabelAndSlot(tDateProfile, dateProfile, dateEnv) {
     }
     // make sure labelInterval is a multiple of slotDuration
     if (tDateProfile.labelInterval && tDateProfile.slotDuration) {
-        var slotsPerLabel = common.wholeDivideDurations(tDateProfile.labelInterval, tDateProfile.slotDuration);
+        const slotsPerLabel = common.wholeDivideDurations(tDateProfile.labelInterval, tDateProfile.slotDuration);
         if (slotsPerLabel === null || slotsPerLabel < 1) {
             console.warn('slotLabelInterval must be a multiple of slotDuration');
             tDateProfile.slotDuration = null;
@@ -218,17 +216,16 @@ function validateLabelAndSlot(tDateProfile, dateProfile, dateEnv) {
     }
 }
 function ensureLabelInterval(tDateProfile, dateProfile, dateEnv) {
-    var currentRange = dateProfile.currentRange;
-    var labelInterval = tDateProfile.labelInterval;
+    const { currentRange } = dateProfile;
+    let { labelInterval } = tDateProfile;
     if (!labelInterval) {
         // compute based off the slot duration
         // find the largest label interval with an acceptable slots-per-label
-        var input = void 0;
+        let input;
         if (tDateProfile.slotDuration) {
-            for (var _i = 0, STOCK_SUB_DURATIONS_1 = STOCK_SUB_DURATIONS; _i < STOCK_SUB_DURATIONS_1.length; _i++) {
-                input = STOCK_SUB_DURATIONS_1[_i];
-                var tryLabelInterval = common.createDuration(input);
-                var slotsPerLabel = common.wholeDivideDurations(tryLabelInterval, tDateProfile.slotDuration);
+            for (input of STOCK_SUB_DURATIONS) {
+                const tryLabelInterval = common.createDuration(input);
+                const slotsPerLabel = common.wholeDivideDurations(tryLabelInterval, tDateProfile.slotDuration);
                 if (slotsPerLabel !== null && slotsPerLabel <= MAX_AUTO_SLOTS_PER_LABEL) {
                     labelInterval = tryLabelInterval;
                     break;
@@ -242,10 +239,9 @@ function ensureLabelInterval(tDateProfile, dateProfile, dateEnv) {
             // find the largest label interval that yields the minimum number of labels
         }
         else {
-            for (var _a = 0, STOCK_SUB_DURATIONS_2 = STOCK_SUB_DURATIONS; _a < STOCK_SUB_DURATIONS_2.length; _a++) {
-                input = STOCK_SUB_DURATIONS_2[_a];
+            for (input of STOCK_SUB_DURATIONS) {
                 labelInterval = common.createDuration(input);
-                var labelCnt = dateEnv.countDurationsBetween(currentRange.start, currentRange.end, labelInterval);
+                const labelCnt = dateEnv.countDurationsBetween(currentRange.start, currentRange.end, labelInterval);
                 if (labelCnt >= MIN_AUTO_LABELS) {
                     break;
                 }
@@ -256,16 +252,15 @@ function ensureLabelInterval(tDateProfile, dateProfile, dateEnv) {
     return labelInterval;
 }
 function ensureSlotDuration(tDateProfile, dateProfile, dateEnv) {
-    var currentRange = dateProfile.currentRange;
-    var slotDuration = tDateProfile.slotDuration;
+    const { currentRange } = dateProfile;
+    let { slotDuration } = tDateProfile;
     if (!slotDuration) {
-        var labelInterval = ensureLabelInterval(tDateProfile, dateProfile, dateEnv); // will compute if necessary
+        const labelInterval = ensureLabelInterval(tDateProfile, dateProfile, dateEnv); // will compute if necessary
         // compute based off the label interval
         // find the largest slot duration that is different from labelInterval, but still acceptable
-        for (var _i = 0, STOCK_SUB_DURATIONS_3 = STOCK_SUB_DURATIONS; _i < STOCK_SUB_DURATIONS_3.length; _i++) {
-            var input = STOCK_SUB_DURATIONS_3[_i];
-            var trySlotDuration = common.createDuration(input);
-            var slotsPerLabel = common.wholeDivideDurations(labelInterval, trySlotDuration);
+        for (let input of STOCK_SUB_DURATIONS) {
+            const trySlotDuration = common.createDuration(input);
+            const slotsPerLabel = common.wholeDivideDurations(labelInterval, trySlotDuration);
             if (slotsPerLabel !== null && slotsPerLabel > 1 && slotsPerLabel <= MAX_AUTO_SLOTS_PER_LABEL) {
                 slotDuration = trySlotDuration;
                 break;
@@ -273,7 +268,7 @@ function ensureSlotDuration(tDateProfile, dateProfile, dateEnv) {
         }
         // only allow the value if it won't exceed the view's # of slots limit
         if (slotDuration) {
-            var slotCnt = dateEnv.countDurationsBetween(currentRange.start, currentRange.end, slotDuration);
+            const slotCnt = dateEnv.countDurationsBetween(currentRange.start, currentRange.end, slotDuration);
             if (slotCnt > MAX_AUTO_CELLS) {
                 slotDuration = null;
             }
@@ -287,12 +282,12 @@ function ensureSlotDuration(tDateProfile, dateProfile, dateEnv) {
     return slotDuration;
 }
 function computeHeaderFormats(tDateProfile, dateProfile, dateEnv, allOptions) {
-    var format1;
-    var format2;
-    var labelInterval = tDateProfile.labelInterval;
-    var unit = common.greatestDurationDenominator(labelInterval).unit;
-    var weekNumbersVisible = allOptions.weekNumbers;
-    var format0 = (format1 = (format2 = null));
+    let format1;
+    let format2;
+    const { labelInterval } = tDateProfile;
+    let unit = common.greatestDurationDenominator(labelInterval).unit;
+    const weekNumbersVisible = allOptions.weekNumbers;
+    let format0 = (format1 = (format2 = null));
     // NOTE: weekNumber computation function wont work
     if ((unit === 'week') && !weekNumbersVisible) {
         unit = 'day';
@@ -346,8 +341,8 @@ function computeHeaderFormats(tDateProfile, dateProfile, dateEnv, allOptions) {
                     hour: 'numeric',
                     meridiem: 'short',
                 };
-                format1 = function (params) { return (':' + common.padStart(params.date.minute, 2) // ':30'
-                ); };
+                format1 = (params) => (':' + common.padStart(params.date.minute, 2) // ':30'
+                );
             }
             else {
                 format0 = {
@@ -361,8 +356,8 @@ function computeHeaderFormats(tDateProfile, dateProfile, dateEnv, allOptions) {
             // sufficiently large number of different second cells?
             if ((common.asRoughSeconds(labelInterval) / 60) >= MAX_AUTO_SLOTS_PER_LABEL) {
                 format0 = { hour: 'numeric', minute: '2-digit', meridiem: 'lowercase' }; // '8:30 PM'
-                format1 = function (params) { return (':' + common.padStart(params.date.second, 2) // ':30'
-                ); };
+                format1 = (params) => (':' + common.padStart(params.date.second, 2) // ':30'
+                );
             }
             else {
                 format0 = { hour: 'numeric', minute: '2-digit', second: '2-digit', meridiem: 'lowercase' }; // '8:30:45 PM'
@@ -370,7 +365,7 @@ function computeHeaderFormats(tDateProfile, dateProfile, dateEnv, allOptions) {
             break;
         case 'millisecond':
             format0 = { hour: 'numeric', minute: '2-digit', second: '2-digit', meridiem: 'lowercase' }; // '8:30:45 PM'
-            format1 = function (params) { return ('.' + common.padStart(params.millisecond, 3)); };
+            format1 = (params) => ('.' + common.padStart(params.millisecond, 3));
             break;
     }
     return [].concat(format0 || [], format1 || [], format2 || []);
@@ -379,8 +374,8 @@ function computeHeaderFormats(tDateProfile, dateProfile, dateEnv, allOptions) {
 // Won't go more precise than days.
 // Will return `0` if there's not a clean whole interval.
 function currentRangeAs(unit, dateProfile, dateEnv) {
-    var range = dateProfile.currentRange;
-    var res = null;
+    let range = dateProfile.currentRange;
+    let res = null;
     if (unit === 'years') {
         res = dateEnv.diffWholeYears(range.start, range.end);
     }
@@ -396,42 +391,41 @@ function currentRangeAs(unit, dateProfile, dateEnv) {
     return res || 0;
 }
 function buildIsWeekStarts(tDateProfile, dateEnv) {
-    var slotDates = tDateProfile.slotDates, emphasizeWeeks = tDateProfile.emphasizeWeeks;
-    var prevWeekNumber = null;
-    var isWeekStarts = [];
-    for (var _i = 0, slotDates_1 = slotDates; _i < slotDates_1.length; _i++) {
-        var slotDate = slotDates_1[_i];
-        var weekNumber = dateEnv.computeWeekNumber(slotDate);
-        var isWeekStart = emphasizeWeeks && (prevWeekNumber !== null) && (prevWeekNumber !== weekNumber);
+    let { slotDates, emphasizeWeeks } = tDateProfile;
+    let prevWeekNumber = null;
+    let isWeekStarts = [];
+    for (let slotDate of slotDates) {
+        let weekNumber = dateEnv.computeWeekNumber(slotDate);
+        let isWeekStart = emphasizeWeeks && (prevWeekNumber !== null) && (prevWeekNumber !== weekNumber);
         prevWeekNumber = weekNumber;
         isWeekStarts.push(isWeekStart);
     }
     return isWeekStarts;
 }
 function buildCellRows(tDateProfile, dateEnv) {
-    var slotDates = tDateProfile.slotDates;
-    var formats = tDateProfile.headerFormats;
-    var cellRows = formats.map(function () { return []; }); // indexed by row,col
-    var slotAsDays = common.asCleanDays(tDateProfile.slotDuration);
-    var guessedSlotUnit = slotAsDays === 7 ? 'week' :
+    let slotDates = tDateProfile.slotDates;
+    let formats = tDateProfile.headerFormats;
+    let cellRows = formats.map(() => []); // indexed by row,col
+    let slotAsDays = common.asCleanDays(tDateProfile.slotDuration);
+    let guessedSlotUnit = slotAsDays === 7 ? 'week' :
         slotAsDays === 1 ? 'day' :
             null;
     // specifically for navclicks
-    var rowUnitsFromFormats = formats.map(function (format) { return (format.getLargestUnit ? format.getLargestUnit() : null); });
+    let rowUnitsFromFormats = formats.map((format) => (format.getLargestUnit ? format.getLargestUnit() : null));
     // builds cellRows and slotCells
-    for (var i = 0; i < slotDates.length; i += 1) {
-        var date = slotDates[i];
-        var isWeekStart = tDateProfile.isWeekStarts[i];
-        for (var row = 0; row < formats.length; row += 1) {
-            var format = formats[row];
-            var rowCells = cellRows[row];
-            var leadingCell = rowCells[rowCells.length - 1];
-            var isLastRow = row === formats.length - 1;
-            var isSuperRow = formats.length > 1 && !isLastRow; // more than one row and not the last
-            var newCell = null;
-            var rowUnit = rowUnitsFromFormats[row] || (isLastRow ? guessedSlotUnit : null);
+    for (let i = 0; i < slotDates.length; i += 1) {
+        let date = slotDates[i];
+        let isWeekStart = tDateProfile.isWeekStarts[i];
+        for (let row = 0; row < formats.length; row += 1) {
+            let format = formats[row];
+            let rowCells = cellRows[row];
+            let leadingCell = rowCells[rowCells.length - 1];
+            let isLastRow = row === formats.length - 1;
+            let isSuperRow = formats.length > 1 && !isLastRow; // more than one row and not the last
+            let newCell = null;
+            let rowUnit = rowUnitsFromFormats[row] || (isLastRow ? guessedSlotUnit : null);
             if (isSuperRow) {
-                var text = dateEnv.format(date, format);
+                let text = dateEnv.format(date, format);
                 if (!leadingCell || (leadingCell.text !== text)) {
                     newCell = buildCellObject(date, text, rowUnit);
                 }
@@ -441,7 +435,7 @@ function buildCellRows(tDateProfile, dateEnv) {
             }
             else if (!leadingCell ||
                 common.isInt(dateEnv.countDurationsBetween(tDateProfile.normalizedRange.start, date, tDateProfile.labelInterval))) {
-                var text = dateEnv.format(date, format);
+                let text = dateEnv.format(date, format);
                 newCell = buildCellObject(date, text, rowUnit);
             }
             else {
@@ -456,20 +450,15 @@ function buildCellRows(tDateProfile, dateEnv) {
     return cellRows;
 }
 function buildCellObject(date, text, rowUnit) {
-    return { date: date, text: text, rowUnit: rowUnit, colspan: 1, isWeekStart: false };
+    return { date, text, rowUnit, colspan: 1, isWeekStart: false };
 }
 
-var TimelineHeaderThInner = /** @class */ (function (_super) {
-    tslib.__extends(TimelineHeaderThInner, _super);
-    function TimelineHeaderThInner() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    TimelineHeaderThInner.prototype.render = function () {
-        var _a = this, props = _a.props, context = _a.context;
-        return (common.createElement(common.ContentHook, { hookProps: props.hookProps, content: context.options.slotLabelContent, defaultContent: renderInnerContent }, function (innerElRef, innerContent) { return (common.createElement("a", tslib.__assign({ ref: innerElRef, className: 'fc-timeline-slot-cushion fc-scrollgrid-sync-inner' + (props.isSticky ? ' fc-sticky' : '') }, props.navLinkAttrs), innerContent)); }));
-    };
-    return TimelineHeaderThInner;
-}(common.BaseComponent));
+class TimelineHeaderThInner extends common.BaseComponent {
+    render() {
+        let { props, context } = this;
+        return (common.createElement(common.ContentHook, { hookProps: props.hookProps, content: context.options.slotLabelContent, defaultContent: renderInnerContent }, (innerElRef, innerContent) => (common.createElement("a", Object.assign({ ref: innerElRef, className: 'fc-timeline-slot-cushion fc-scrollgrid-sync-inner' + (props.isSticky ? ' fc-sticky' : '') }, props.navLinkAttrs), innerContent))));
+    }
+}
 function renderInnerContent(props) {
     return props.text;
 }
@@ -482,74 +471,65 @@ function refineHookProps(input) {
     };
 }
 
-var TimelineHeaderTh = /** @class */ (function (_super) {
-    tslib.__extends(TimelineHeaderTh, _super);
-    function TimelineHeaderTh() {
-        var _this = _super !== null && _super.apply(this, arguments) || this;
-        _this.refineHookProps = common.memoizeObjArg(refineHookProps);
-        _this.normalizeClassNames = common.buildClassNameNormalizer();
-        _this.buildCellNavLinkAttrs = common.memoize(buildCellNavLinkAttrs);
-        return _this;
-    }
-    TimelineHeaderTh.prototype.render = function () {
-        var _this = this;
-        var _a = this, props = _a.props, context = _a.context;
-        var dateEnv = context.dateEnv, options = context.options;
-        var cell = props.cell, dateProfile = props.dateProfile, tDateProfile = props.tDateProfile;
+class TimelineHeaderTh extends common.BaseComponent {
+    constructor() {
+        super(...arguments);
+        this.refineHookProps = common.memoizeObjArg(refineHookProps);
+        this.normalizeClassNames = common.buildClassNameNormalizer();
+        this.buildCellNavLinkAttrs = common.memoize(buildCellNavLinkAttrs);
+    }
+    render() {
+        let { props, context } = this;
+        let { dateEnv, options } = context;
+        let { cell, dateProfile, tDateProfile } = props;
         // the cell.rowUnit is f'd
         // giving 'month' for a 3-day view
         // workaround: to infer day, do NOT time
-        var dateMeta = common.getDateMeta(cell.date, props.todayRange, props.nowDate, dateProfile);
-        var classNames = ['fc-timeline-slot', 'fc-timeline-slot-label'].concat(cell.rowUnit === 'time' // TODO: so slot classnames for week/month/bigger. see note above about rowUnit
+        let dateMeta = common.getDateMeta(cell.date, props.todayRange, props.nowDate, dateProfile);
+        let classNames = ['fc-timeline-slot', 'fc-timeline-slot-label'].concat(cell.rowUnit === 'time' // TODO: so slot classnames for week/month/bigger. see note above about rowUnit
             ? common.getSlotClassNames(dateMeta, context.theme)
             : common.getDayClassNames(dateMeta, context.theme));
         if (cell.isWeekStart) {
             classNames.push('fc-timeline-slot-em');
         }
-        var hookProps = this.refineHookProps({
+        let hookProps = this.refineHookProps({
             level: props.rowLevel,
             dateMarker: cell.date,
             text: cell.text,
             dateEnv: context.dateEnv,
             viewApi: context.viewApi,
         });
-        var customClassNames = this.normalizeClassNames(options.slotLabelClassNames, hookProps);
-        return (common.createElement(common.MountHook, { hookProps: hookProps, didMount: options.slotLabelDidMount, willUnmount: options.slotLabelWillUnmount }, function (rootElRef) { return (common.createElement("th", { ref: rootElRef, className: classNames.concat(customClassNames).join(' '), "data-date": dateEnv.formatIso(cell.date, { omitTime: !tDateProfile.isTimeScale, omitTimeZoneOffset: true }), colSpan: cell.colspan },
+        let customClassNames = this.normalizeClassNames(options.slotLabelClassNames, hookProps);
+        return (common.createElement(common.MountHook, { hookProps: hookProps, didMount: options.slotLabelDidMount, willUnmount: options.slotLabelWillUnmount }, (rootElRef) => (common.createElement("th", { ref: rootElRef, className: classNames.concat(customClassNames).join(' '), "data-date": dateEnv.formatIso(cell.date, { omitTime: !tDateProfile.isTimeScale, omitTimeZoneOffset: true }), colSpan: cell.colspan },
             common.createElement("div", { className: "fc-timeline-slot-frame", style: { height: props.rowInnerHeight } },
-                common.createElement(TimelineHeaderThInner, { hookProps: hookProps, isSticky: props.isSticky, navLinkAttrs: _this.buildCellNavLinkAttrs(context, cell.date, cell.rowUnit) })))); }));
-    };
-    return TimelineHeaderTh;
-}(common.BaseComponent));
+                common.createElement(TimelineHeaderThInner, { hookProps: hookProps, isSticky: props.isSticky, navLinkAttrs: this.buildCellNavLinkAttrs(context, cell.date, cell.rowUnit) }))))));
+    }
+}
 function buildCellNavLinkAttrs(context, cellDate, rowUnit) {
     return (rowUnit && rowUnit !== 'time')
         ? common.buildNavLinkAttrs(context, cellDate, rowUnit)
         : {};
 }
 
-var TimelineHeaderRows = /** @class */ (function (_super) {
-    tslib.__extends(TimelineHeaderRows, _super);
-    function TimelineHeaderRows() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    TimelineHeaderRows.prototype.render = function () {
-        var _a = this.props, dateProfile = _a.dateProfile, tDateProfile = _a.tDateProfile, rowInnerHeights = _a.rowInnerHeights, todayRange = _a.todayRange, nowDate = _a.nowDate;
-        var cellRows = tDateProfile.cellRows;
-        return (common.createElement(common.Fragment, null, cellRows.map(function (rowCells, rowLevel) {
-            var isLast = rowLevel === cellRows.length - 1;
-            var isChrono = tDateProfile.isTimeScale && isLast; // the final row, with times?
-            var classNames = [
+class TimelineHeaderRows extends common.BaseComponent {
+    render() {
+        let { dateProfile, tDateProfile, rowInnerHeights, todayRange, nowDate } = this.props;
+        let { cellRows } = tDateProfile;
+        return (common.createElement(common.Fragment, null, cellRows.map((rowCells, rowLevel) => {
+            let isLast = rowLevel === cellRows.length - 1;
+            let isChrono = tDateProfile.isTimeScale && isLast; // the final row, with times?
+            let classNames = [
                 'fc-timeline-header-row',
                 isChrono ? 'fc-timeline-header-row-chrono' : '',
             ];
             return ( // eslint-disable-next-line react/no-array-index-key
-            common.createElement("tr", { key: rowLevel, className: classNames.join(' ') }, rowCells.map(function (cell) { return (common.createElement(TimelineHeaderTh, { key: cell.date.toISOString(), cell: cell, rowLevel: rowLevel, dateProfile: dateProfile, tDateProfile: tDateProfile, todayRange: todayRange, nowDate: nowDate, rowInnerHeight: rowInnerHeights && rowInnerHeights[rowLevel], isSticky: !isLast })); })));
+            common.createElement("tr", { key: rowLevel, className: classNames.join(' ') }, rowCells.map((cell) => (common.createElement(TimelineHeaderTh, { key: cell.date.toISOString(), cell: cell, rowLevel: rowLevel, dateProfile: dateProfile, tDateProfile: tDateProfile, todayRange: todayRange, nowDate: nowDate, rowInnerHeight: rowInnerHeights && rowInnerHeights[rowLevel], isSticky: !isLast })))));
         })));
-    };
-    return TimelineHeaderRows;
-}(common.BaseComponent));
+    }
+}
 
-var TimelineCoords = /** @class */ (function () {
-    function TimelineCoords(slatRootEl, // okay to expose?
+class TimelineCoords {
+    constructor(slatRootEl, // okay to expose?
     slatEls, dateProfile, tDateProfile, dateEnv, isRtl) {
         this.slatRootEl = slatRootEl;
         this.dateProfile = dateProfile;
@@ -563,36 +543,36 @@ var TimelineCoords = /** @class */ (function () {
         this.innerCoordCache = new common.PositionCache(slatRootEl, common.findDirectChildren(slatEls, 'div'), true, // isHorizontal
         false);
     }
-    TimelineCoords.prototype.isDateInRange = function (date) {
+    isDateInRange(date) {
         return common.rangeContainsMarker(this.dateProfile.currentRange, date);
-    };
+    }
     // results range from negative width of area to 0
-    TimelineCoords.prototype.dateToCoord = function (date) {
-        var tDateProfile = this.tDateProfile;
-        var snapCoverage = this.computeDateSnapCoverage(date);
-        var slotCoverage = snapCoverage / tDateProfile.snapsPerSlot;
-        var slotIndex = Math.floor(slotCoverage);
+    dateToCoord(date) {
+        let { tDateProfile } = this;
+        let snapCoverage = this.computeDateSnapCoverage(date);
+        let slotCoverage = snapCoverage / tDateProfile.snapsPerSlot;
+        let slotIndex = Math.floor(slotCoverage);
         slotIndex = Math.min(slotIndex, tDateProfile.slotCnt - 1);
-        var partial = slotCoverage - slotIndex;
-        var _a = this, innerCoordCache = _a.innerCoordCache, outerCoordCache = _a.outerCoordCache;
+        let partial = slotCoverage - slotIndex;
+        let { innerCoordCache, outerCoordCache } = this;
         if (this.isRtl) {
             return outerCoordCache.originClientRect.width - (outerCoordCache.rights[slotIndex] -
                 (innerCoordCache.getWidth(slotIndex) * partial));
         }
         return (outerCoordCache.lefts[slotIndex] +
             (innerCoordCache.getWidth(slotIndex) * partial));
-    };
-    TimelineCoords.prototype.rangeToCoords = function (range) {
+    }
+    rangeToCoords(range) {
         return {
             start: this.dateToCoord(range.start),
             end: this.dateToCoord(range.end),
         };
-    };
-    TimelineCoords.prototype.durationToCoord = function (duration) {
-        var _a = this, dateProfile = _a.dateProfile, tDateProfile = _a.tDateProfile, dateEnv = _a.dateEnv, isRtl = _a.isRtl;
-        var coord = 0;
+    }
+    durationToCoord(duration) {
+        let { dateProfile, tDateProfile, dateEnv, isRtl } = this;
+        let coord = 0;
         if (dateProfile) {
-            var date = dateEnv.add(dateProfile.activeRange.start, duration);
+            let date = dateEnv.add(dateProfile.activeRange.start, duration);
             if (!tDateProfile.isTimeScale) {
                 date = common.startOfDay(date);
             }
@@ -603,30 +583,29 @@ var TimelineCoords = /** @class */ (function () {
             }
         }
         return coord;
-    };
-    TimelineCoords.prototype.coordFromLeft = function (coord) {
+    }
+    coordFromLeft(coord) {
         if (this.isRtl) {
             return this.outerCoordCache.originClientRect.width - coord;
         }
         return coord;
-    };
+    }
     // returned value is between 0 and the number of snaps
-    TimelineCoords.prototype.computeDateSnapCoverage = function (date) {
+    computeDateSnapCoverage(date) {
         return computeDateSnapCoverage(date, this.tDateProfile, this.dateEnv);
-    };
-    return TimelineCoords;
-}());
+    }
+}
 // returned value is between 0 and the number of snaps
 function computeDateSnapCoverage(date, tDateProfile, dateEnv) {
-    var snapDiff = dateEnv.countDurationsBetween(tDateProfile.normalizedRange.start, date, tDateProfile.snapDuration);
+    let snapDiff = dateEnv.countDurationsBetween(tDateProfile.normalizedRange.start, date, tDateProfile.snapDuration);
     if (snapDiff < 0) {
         return 0;
     }
     if (snapDiff >= tDateProfile.snapDiffToIndex.length) {
         return tDateProfile.snapCnt;
     }
-    var snapDiffInt = Math.floor(snapDiff);
-    var snapCoverage = tDateProfile.snapDiffToIndex[snapDiffInt];
+    let snapDiffInt = Math.floor(snapDiff);
+    let snapCoverage = tDateProfile.snapDiffToIndex[snapDiffInt];
     if (common.isInt(snapCoverage)) { // not an in-between value
         snapCoverage += snapDiff - snapDiffInt; // add the remainder
     }
@@ -656,22 +635,19 @@ function coordsToCss(hcoords, isRtl) {
     return { left: hcoords.start, right: -hcoords.end };
 }
 
-var TimelineHeader = /** @class */ (function (_super) {
-    tslib.__extends(TimelineHeader, _super);
-    function TimelineHeader() {
-        var _this = _super !== null && _super.apply(this, arguments) || this;
-        _this.rootElRef = common.createRef();
-        return _this;
-    }
-    TimelineHeader.prototype.render = function () {
-        var _this = this;
-        var _a = this, props = _a.props, context = _a.context;
+class TimelineHeader extends common.BaseComponent {
+    constructor() {
+        super(...arguments);
+        this.rootElRef = common.createRef();
+    }
+    render() {
+        let { props, context } = this;
         // TODO: very repetitive
         // TODO: make part of tDateProfile?
-        var timerUnit = common.greatestDurationDenominator(props.tDateProfile.slotDuration).unit;
+        let timerUnit = common.greatestDurationDenominator(props.tDateProfile.slotDuration).unit;
         // WORKAROUND: make ignore slatCoords when out of sync with dateProfile
-        var slatCoords = props.slatCoords && props.slatCoords.dateProfile === props.dateProfile ? props.slatCoords : null;
-        return (common.createElement(common.NowTimer, { unit: timerUnit }, function (nowDate, todayRange) { return (common.createElement("div", { className: "fc-timeline-header", ref: _this.rootElRef },
+        let slatCoords = props.slatCoords && props.slatCoords.dateProfile === props.dateProfile ? props.slatCoords : null;
+        return (common.createElement(common.NowTimer, { unit: timerUnit }, (nowDate, todayRange) => (common.createElement("div", { className: "fc-timeline-header", ref: this.rootElRef },
             common.createElement("table", { "aria-hidden": true, className: "fc-scrollgrid-sync-table", style: { minWidth: props.tableMinWidth, width: props.clientWidth } },
                 props.tableColGroupNode,
                 common.createElement("tbody", null,
@@ -680,38 +656,33 @@ var TimelineHeader = /** @class */ (function (_super) {
             // need to have a container regardless of whether the current view has a visible now indicator
             // because apparently removal of the element resets the scroll for some reasons (issue #5351).
             // this issue doesn't happen for the timeline body however (
-            common.createElement("div", { className: "fc-timeline-now-indicator-container" }, (slatCoords && slatCoords.isDateInRange(nowDate)) && (common.createElement(common.NowIndicatorRoot, { isAxis: true, date: nowDate }, function (rootElRef, classNames, innerElRef, innerContent) { return (common.createElement("div", { ref: rootElRef, className: ['fc-timeline-now-indicator-arrow'].concat(classNames).join(' '), style: coordToCss(slatCoords.dateToCoord(nowDate), context.isRtl) }, innerContent)); })))))); }));
-    };
-    TimelineHeader.prototype.componentDidMount = function () {
+            common.createElement("div", { className: "fc-timeline-now-indicator-container" }, (slatCoords && slatCoords.isDateInRange(nowDate)) && (common.createElement(common.NowIndicatorRoot, { isAxis: true, date: nowDate }, (rootElRef, classNames, innerElRef, innerContent) => (common.createElement("div", { ref: rootElRef, className: ['fc-timeline-now-indicator-arrow'].concat(classNames).join(' '), style: coordToCss(slatCoords.dateToCoord(nowDate), context.isRtl) }, innerContent))))))))));
+    }
+    componentDidMount() {
         this.updateSize();
-    };
-    TimelineHeader.prototype.componentDidUpdate = function () {
+    }
+    componentDidUpdate() {
         this.updateSize();
-    };
-    TimelineHeader.prototype.updateSize = function () {
+    }
+    updateSize() {
         if (this.props.onMaxCushionWidth) {
             this.props.onMaxCushionWidth(this.computeMaxCushionWidth());
         }
-    };
-    TimelineHeader.prototype.computeMaxCushionWidth = function () {
-        return Math.max.apply(Math, common.findElements(this.rootElRef.current, '.fc-timeline-header-row:last-child .fc-timeline-slot-cushion').map(function (el) { return el.getBoundingClientRect().width; }));
-    };
-    return TimelineHeader;
-}(common.BaseComponent));
+    }
+    computeMaxCushionWidth() {
+        return Math.max(...common.findElements(this.rootElRef.current, '.fc-timeline-header-row:last-child .fc-timeline-slot-cushion').map((el) => el.getBoundingClientRect().width));
+    }
+}
 
-var TimelineSlatCell = /** @class */ (function (_super) {
-    tslib.__extends(TimelineSlatCell, _super);
-    function TimelineSlatCell() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    TimelineSlatCell.prototype.render = function () {
-        var _a = this, props = _a.props, context = _a.context;
-        var dateEnv = context.dateEnv, options = context.options, theme = context.theme;
-        var date = props.date, tDateProfile = props.tDateProfile, isEm = props.isEm;
-        var dateMeta = common.getDateMeta(props.date, props.todayRange, props.nowDate, props.dateProfile);
-        var classNames = ['fc-timeline-slot', 'fc-timeline-slot-lane'];
-        var dataAttrs = { 'data-date': dateEnv.formatIso(date, { omitTimeZoneOffset: true, omitTime: !tDateProfile.isTimeScale }) };
-        var hookProps = tslib.__assign(tslib.__assign({ date: dateEnv.toDate(props.date) }, dateMeta), { view: context.viewApi });
+class TimelineSlatCell extends common.BaseComponent {
+    render() {
+        let { props, context } = this;
+        let { dateEnv, options, theme } = context;
+        let { date, tDateProfile, isEm } = props;
+        let dateMeta = common.getDateMeta(props.date, props.todayRange, props.nowDate, props.dateProfile);
+        let classNames = ['fc-timeline-slot', 'fc-timeline-slot-lane'];
+        let dataAttrs = { 'data-date': dateEnv.formatIso(date, { omitTimeZoneOffset: true, omitTime: !tDateProfile.isTimeScale }) };
+        let hookProps = Object.assign(Object.assign({ date: dateEnv.toDate(props.date) }, dateMeta), { view: context.viewApi });
         if (isEm) {
             classNames.push('fc-timeline-slot-em');
         }
@@ -720,56 +691,48 @@ var TimelineSlatCell = /** @class */ (function (_super) {
                 'fc-timeline-slot-major' :
                 'fc-timeline-slot-minor');
         }
-        classNames.push.apply(classNames, (props.isDay
+        classNames.push(...(props.isDay
             ? common.getDayClassNames(dateMeta, theme)
             : common.getSlotClassNames(dateMeta, theme)));
-        return (common.createElement(common.RenderHook, { hookProps: hookProps, classNames: options.slotLaneClassNames, content: options.slotLaneContent, didMount: options.slotLaneDidMount, willUnmount: options.slotLaneWillUnmount, elRef: props.elRef }, function (rootElRef, customClassNames, innerElRef, innerContent) { return (common.createElement("td", tslib.__assign({ ref: rootElRef, className: classNames.concat(customClassNames).join(' ') }, dataAttrs),
-            common.createElement("div", { ref: innerElRef }, innerContent))); }));
-    };
-    return TimelineSlatCell;
-}(common.BaseComponent));
+        return (common.createElement(common.RenderHook, { hookProps: hookProps, classNames: options.slotLaneClassNames, content: options.slotLaneContent, didMount: options.slotLaneDidMount, willUnmount: options.slotLaneWillUnmount, elRef: props.elRef }, (rootElRef, customClassNames, innerElRef, innerContent) => (common.createElement("td", Object.assign({ ref: rootElRef, className: classNames.concat(customClassNames).join(' ') }, dataAttrs),
+            common.createElement("div", { ref: innerElRef }, innerContent)))));
+    }
+}
 
-var TimelineSlatsBody = /** @class */ (function (_super) {
-    tslib.__extends(TimelineSlatsBody, _super);
-    function TimelineSlatsBody() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    TimelineSlatsBody.prototype.render = function () {
-        var props = this.props;
-        var tDateProfile = props.tDateProfile, cellElRefs = props.cellElRefs;
-        var slotDates = tDateProfile.slotDates, isWeekStarts = tDateProfile.isWeekStarts;
-        var isDay = !tDateProfile.isTimeScale && !tDateProfile.largeUnit;
+class TimelineSlatsBody extends common.BaseComponent {
+    render() {
+        let { props } = this;
+        let { tDateProfile, cellElRefs } = props;
+        let { slotDates, isWeekStarts } = tDateProfile;
+        let isDay = !tDateProfile.isTimeScale && !tDateProfile.largeUnit;
         return (common.createElement("tbody", null,
-            common.createElement("tr", null, slotDates.map(function (slotDate, i) {
-                var key = slotDate.toISOString();
+            common.createElement("tr", null, slotDates.map((slotDate, i) => {
+                let key = slotDate.toISOString();
                 return (common.createElement(TimelineSlatCell, { key: key, elRef: cellElRefs.createRef(key), date: slotDate, dateProfile: props.dateProfile, tDateProfile: tDateProfile, nowDate: props.nowDate, todayRange: props.todayRange, isEm: isWeekStarts[i], isDay: isDay }));
             }))));
-    };
-    return TimelineSlatsBody;
-}(common.BaseComponent));
+    }
+}
 
-var TimelineSlats = /** @class */ (function (_super) {
-    tslib.__extends(TimelineSlats, _super);
-    function TimelineSlats() {
-        var _this = _super !== null && _super.apply(this, arguments) || this;
-        _this.rootElRef = common.createRef();
-        _this.cellElRefs = new common.RefMap();
-        _this.handleScrollRequest = function (request) {
-            var onScrollLeftRequest = _this.props.onScrollLeftRequest;
-            var coords = _this.coords;
+class TimelineSlats extends common.BaseComponent {
+    constructor() {
+        super(...arguments);
+        this.rootElRef = common.createRef();
+        this.cellElRefs = new common.RefMap();
+        this.handleScrollRequest = (request) => {
+            let { onScrollLeftRequest } = this.props;
+            let { coords } = this;
             if (onScrollLeftRequest && coords) {
                 if (request.time) {
-                    var scrollLeft = coords.coordFromLeft(coords.durationToCoord(request.time));
+                    let scrollLeft = coords.coordFromLeft(coords.durationToCoord(request.time));
                     onScrollLeftRequest(scrollLeft);
                 }
                 return true;
             }
             return null; // best?
         };
-        return _this;
     }
-    TimelineSlats.prototype.render = function () {
-        var _a = this, props = _a.props, context = _a.context;
+    render() {
+        let { props, context } = this;
         return (common.createElement("div", { className: "fc-timeline-slots", ref: this.rootElRef },
             common.createElement("table", { "aria-hidden": true, className: context.theme.getClass('table'), style: {
                     minWidth: props.tableMinWidth,
@@ -777,28 +740,28 @@ var TimelineSlats = /** @class */ (function (_super) {
                 } },
                 props.tableColGroupNode,
                 common.createElement(TimelineSlatsBody, { cellElRefs: this.cellElRefs, dateProfile: props.dateProfile, tDateProfile: props.tDateProfile, nowDate: props.nowDate, todayRange: props.todayRange }))));
-    };
-    TimelineSlats.prototype.componentDidMount = function () {
+    }
+    componentDidMount() {
         this.updateSizing();
         this.scrollResponder = this.context.createScrollResponder(this.handleScrollRequest);
-    };
-    TimelineSlats.prototype.componentDidUpdate = function (prevProps) {
+    }
+    componentDidUpdate(prevProps) {
         this.updateSizing();
         this.scrollResponder.update(prevProps.dateProfile !== this.props.dateProfile);
-    };
-    TimelineSlats.prototype.componentWillUnmount = function () {
+    }
+    componentWillUnmount() {
         this.scrollResponder.detach();
         if (this.props.onCoords) {
             this.props.onCoords(null);
         }
-    };
-    TimelineSlats.prototype.updateSizing = function () {
-        var _a = this, props = _a.props, context = _a.context;
+    }
+    updateSizing() {
+        let { props, context } = this;
         if (props.clientWidth !== null && // is sizing stable?
             this.scrollResponder
         // ^it's possible to have clientWidth immediately after mount (when returning from print view), but w/o scrollResponder
         ) {
-            var rootEl = this.rootElRef.current;
+            let rootEl = this.rootElRef.current;
             if (rootEl.offsetWidth) { // not hidden by css
                 this.coords = new TimelineCoords(this.rootElRef.current, collectCellEls(this.cellElRefs.currentMap, props.tDateProfile.slotDates), props.dateProfile, props.tDateProfile, context.dateEnv, context.isRtl);
                 if (props.onCoords) {
@@ -807,24 +770,24 @@ var TimelineSlats = /** @class */ (function (_super) {
                 this.scrollResponder.update(false); // TODO: wouldn't have to do this if coords were in state
             }
         }
-    };
-    TimelineSlats.prototype.positionToHit = function (leftPosition) {
-        var outerCoordCache = this.coords.outerCoordCache;
-        var _a = this.context, dateEnv = _a.dateEnv, isRtl = _a.isRtl;
-        var tDateProfile = this.props.tDateProfile;
-        var slatIndex = outerCoordCache.leftToIndex(leftPosition);
+    }
+    positionToHit(leftPosition) {
+        let { outerCoordCache } = this.coords;
+        let { dateEnv, isRtl } = this.context;
+        let { tDateProfile } = this.props;
+        let slatIndex = outerCoordCache.leftToIndex(leftPosition);
         if (slatIndex != null) {
             // somewhat similar to what TimeGrid does. consolidate?
-            var slatWidth = outerCoordCache.getWidth(slatIndex);
-            var partial = isRtl ?
+            let slatWidth = outerCoordCache.getWidth(slatIndex);
+            let partial = isRtl ?
                 (outerCoordCache.rights[slatIndex] - leftPosition) / slatWidth :
                 (leftPosition - outerCoordCache.lefts[slatIndex]) / slatWidth;
-            var localSnapIndex = Math.floor(partial * tDateProfile.snapsPerSlot);
-            var start = dateEnv.add(tDateProfile.slotDates[slatIndex], common.multiplyDuration(tDateProfile.snapDuration, localSnapIndex));
-            var end = dateEnv.add(start, tDateProfile.snapDuration);
+            let localSnapIndex = Math.floor(partial * tDateProfile.snapsPerSlot);
+            let start = dateEnv.add(tDateProfile.slotDates[slatIndex], common.multiplyDuration(tDateProfile.snapDuration, localSnapIndex));
+            let end = dateEnv.add(start, tDateProfile.snapDuration);
             return {
                 dateSpan: {
-                    range: { start: start, end: end },
+                    range: { start, end },
                     allDay: !this.props.tDateProfile.isTimeScale,
                 },
                 dayEl: this.cellElRefs.currentMap[slatIndex],
@@ -833,28 +796,26 @@ var TimelineSlats = /** @class */ (function (_super) {
             };
         }
         return null;
-    };
-    return TimelineSlats;
-}(common.BaseComponent));
+    }
+}
 function collectCellEls(elMap, slotDates) {
-    return slotDates.map(function (slotDate) {
-        var key = slotDate.toISOString();
+    return slotDates.map((slotDate) => {
+        let key = slotDate.toISOString();
         return elMap[key];
     });
 }
 
 function computeSegHCoords(segs, minWidth, timelineCoords) {
-    var hcoords = [];
+    let hcoords = [];
     if (timelineCoords) {
-        for (var _i = 0, segs_1 = segs; _i < segs_1.length; _i++) {
-            var seg = segs_1[_i];
-            var res = timelineCoords.rangeToCoords(seg);
-            var start = Math.round(res.start); // for barely-overlapping collisions
-            var end = Math.round(res.end); //
+        for (let seg of segs) {
+            let res = timelineCoords.rangeToCoords(seg);
+            let start = Math.round(res.start); // for barely-overlapping collisions
+            let end = Math.round(res.end); //
             if (end - start < minWidth) {
                 end = start + minWidth;
             }
-            hcoords.push({ start: start, end: end });
+            hcoords.push({ start, end });
         }
     }
     return hcoords;
@@ -863,13 +824,13 @@ function computeFgSegPlacements(segs, segHCoords, // might not have for every se
 eventInstanceHeights, // might not have for every seg
 moreLinkHeights, // might not have for every more-link
 strictOrder, maxStackCnt) {
-    var segInputs = [];
-    var crudePlacements = []; // when we don't know dims
-    for (var i = 0; i < segs.length; i += 1) {
-        var seg = segs[i];
-        var instanceId = seg.eventRange.instance.instanceId;
-        var height = eventInstanceHeights[instanceId];
-        var hcoords = segHCoords[i];
+    let segInputs = [];
+    let crudePlacements = []; // when we don't know dims
+    for (let i = 0; i < segs.length; i += 1) {
+        let seg = segs[i];
+        let instanceId = seg.eventRange.instance.instanceId;
+        let height = eventInstanceHeights[instanceId];
+        let hcoords = segHCoords[i];
         if (height && hcoords) {
             segInputs.push({
                 index: i,
@@ -879,33 +840,33 @@ strictOrder, maxStackCnt) {
         }
         else {
             crudePlacements.push({
-                seg: seg,
-                hcoords: hcoords,
+                seg,
+                hcoords,
                 top: null,
             });
         }
     }
-    var hierarchy = new common.SegHierarchy();
+    let hierarchy = new common.SegHierarchy();
     if (strictOrder != null) {
         hierarchy.strictOrder = strictOrder;
     }
     if (maxStackCnt != null) {
         hierarchy.maxStackCnt = maxStackCnt;
     }
-    var hiddenEntries = hierarchy.addSegs(segInputs);
-    var hiddenPlacements = hiddenEntries.map(function (entry) { return ({
+    let hiddenEntries = hierarchy.addSegs(segInputs);
+    let hiddenPlacements = hiddenEntries.map((entry) => ({
         seg: segs[entry.index],
         hcoords: entry.span,
         top: null,
-    }); });
-    var hiddenGroups = common.groupIntersectingEntries(hiddenEntries);
-    var moreLinkInputs = [];
-    var moreLinkCrudePlacements = [];
-    var extractSeg = function (entry) { return segs[entry.index]; };
-    for (var i = 0; i < hiddenGroups.length; i += 1) {
-        var hiddenGroup = hiddenGroups[i];
-        var sortedSegs = hiddenGroup.entries.map(extractSeg);
-        var height = moreLinkHeights[common.buildIsoString(common.computeEarliestSegStart(sortedSegs))]; // not optimal :(
+    }));
+    let hiddenGroups = common.groupIntersectingEntries(hiddenEntries);
+    let moreLinkInputs = [];
+    let moreLinkCrudePlacements = [];
+    const extractSeg = (entry) => segs[entry.index];
+    for (let i = 0; i < hiddenGroups.length; i += 1) {
+        let hiddenGroup = hiddenGroups[i];
+        let sortedSegs = hiddenGroup.entries.map(extractSeg);
+        let height = moreLinkHeights[common.buildIsoString(common.computeEarliestSegStart(sortedSegs))]; // not optimal :(
         if (height != null) {
             // NOTE: the hiddenGroup's spanStart/spanEnd are already computed by rangeToCoords. computed during input.
             moreLinkInputs.push({
@@ -925,12 +886,11 @@ strictOrder, maxStackCnt) {
     // add more-links into the hierarchy, but don't limit
     hierarchy.maxStackCnt = -1;
     hierarchy.addSegs(moreLinkInputs);
-    var visibleRects = hierarchy.toRects();
-    var visiblePlacements = [];
-    var maxHeight = 0;
-    for (var _i = 0, visibleRects_1 = visibleRects; _i < visibleRects_1.length; _i++) {
-        var rect = visibleRects_1[_i];
-        var segIndex = rect.index;
+    let visibleRects = hierarchy.toRects();
+    let visiblePlacements = [];
+    let maxHeight = 0;
+    for (let rect of visibleRects) {
+        let segIndex = rect.index;
         visiblePlacements.push({
             seg: segIndex < segs.length
                 ? segs[segIndex] // a real seg
@@ -946,48 +906,39 @@ strictOrder, maxStackCnt) {
     ];
 }
 
-var TimelineLaneBg = /** @class */ (function (_super) {
-    tslib.__extends(TimelineLaneBg, _super);
-    function TimelineLaneBg() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    TimelineLaneBg.prototype.render = function () {
-        var props = this.props;
-        var highlightSeg = [].concat(props.eventResizeSegs, props.dateSelectionSegs);
+class TimelineLaneBg extends common.BaseComponent {
+    render() {
+        let { props } = this;
+        let highlightSeg = [].concat(props.eventResizeSegs, props.dateSelectionSegs);
         return props.timelineCoords && (common.createElement("div", { className: "fc-timeline-bg" },
             this.renderSegs(props.businessHourSegs || [], props.timelineCoords, 'non-business'),
             this.renderSegs(props.bgEventSegs || [], props.timelineCoords, 'bg-event'),
             this.renderSegs(highlightSeg, props.timelineCoords, 'highlight')));
-    };
-    TimelineLaneBg.prototype.renderSegs = function (segs, timelineCoords, fillType) {
-        var _a = this.props, todayRange = _a.todayRange, nowDate = _a.nowDate;
-        var isRtl = this.context.isRtl;
-        var segHCoords = computeSegHCoords(segs, 0, timelineCoords);
-        var children = segs.map(function (seg, i) {
-            var hcoords = segHCoords[i];
-            var hStyle = coordsToCss(hcoords, isRtl);
+    }
+    renderSegs(segs, timelineCoords, fillType) {
+        let { todayRange, nowDate } = this.props;
+        let { isRtl } = this.context;
+        let segHCoords = computeSegHCoords(segs, 0, timelineCoords);
+        let children = segs.map((seg, i) => {
+            let hcoords = segHCoords[i];
+            let hStyle = coordsToCss(hcoords, isRtl);
             return (common.createElement("div", { key: common.buildEventRangeKey(seg.eventRange), className: "fc-timeline-bg-harness", style: hStyle }, fillType === 'bg-event' ?
-                common.createElement(common.BgEvent, tslib.__assign({ seg: seg }, common.getSegMeta(seg, todayRange, nowDate))) :
+                common.createElement(common.BgEvent, Object.assign({ seg: seg }, common.getSegMeta(seg, todayRange, nowDate))) :
                 common.renderFill(fillType)));
         });
         return common.createElement(common.Fragment, null, children);
-    };
-    return TimelineLaneBg;
-}(common.BaseComponent));
+    }
+}
 
-var TimelineLaneSlicer = /** @class */ (function (_super) {
-    tslib.__extends(TimelineLaneSlicer, _super);
-    function TimelineLaneSlicer() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    TimelineLaneSlicer.prototype.sliceRange = function (origRange, dateProfile, dateProfileGenerator, tDateProfile, dateEnv) {
-        var normalRange = normalizeRange(origRange, tDateProfile, dateEnv);
-        var segs = [];
+class TimelineLaneSlicer extends common.Slicer {
+    sliceRange(origRange, dateProfile, dateProfileGenerator, tDateProfile, dateEnv) {
+        let normalRange = normalizeRange(origRange, tDateProfile, dateEnv);
+        let segs = [];
         // protect against when the span is entirely in an invalid date region
         if (computeDateSnapCoverage(normalRange.start, tDateProfile, dateEnv)
             < computeDateSnapCoverage(normalRange.end, tDateProfile, dateEnv)) {
             // intersect the footprint's range with the grid's range
-            var slicedRange = common.intersectRanges(normalRange, tDateProfile.normalizedRange);
+            let slicedRange = common.intersectRanges(normalRange, tDateProfile.normalizedRange);
             if (slicedRange) {
                 segs.push({
                     start: slicedRange.start,
@@ -1000,86 +951,74 @@ var TimelineLaneSlicer = /** @class */ (function (_super) {
             }
         }
         return segs;
-    };
-    return TimelineLaneSlicer;
-}(common.Slicer));
+    }
+}
 
-var DEFAULT_TIME_FORMAT = common.createFormatter({
+const DEFAULT_TIME_FORMAT = common.createFormatter({
     hour: 'numeric',
     minute: '2-digit',
     omitZeroMinute: true,
     meridiem: 'narrow',
 });
-var TimelineEvent = /** @class */ (function (_super) {
-    tslib.__extends(TimelineEvent, _super);
-    function TimelineEvent() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    TimelineEvent.prototype.render = function () {
-        var props = this.props;
-        return (common.createElement(common.StandardEvent, tslib.__assign({}, props, { extraClassNames: ['fc-timeline-event', 'fc-h-event'], defaultTimeFormat: DEFAULT_TIME_FORMAT, defaultDisplayEventTime: !props.isTimeScale })));
-    };
-    return TimelineEvent;
-}(common.BaseComponent));
+class TimelineEvent extends common.BaseComponent {
+    render() {
+        let { props } = this;
+        return (common.createElement(common.StandardEvent, Object.assign({}, props, { extraClassNames: ['fc-timeline-event', 'fc-h-event'], defaultTimeFormat: DEFAULT_TIME_FORMAT, defaultDisplayEventTime: !props.isTimeScale })));
+    }
+}
 
-var TimelineLaneMoreLink = /** @class */ (function (_super) {
-    tslib.__extends(TimelineLaneMoreLink, _super);
-    function TimelineLaneMoreLink() {
-        var _this = _super !== null && _super.apply(this, arguments) || this;
-        _this.rootElRef = common.createRef();
-        return _this;
-    }
-    TimelineLaneMoreLink.prototype.render = function () {
-        var _this = this;
-        var _a = this, props = _a.props, context = _a.context;
-        var hiddenSegs = props.hiddenSegs, elRef = props.elRef, placement = props.placement, resourceId = props.resourceId;
-        var top = placement.top, hcoords = placement.hcoords;
-        var isVisible = hcoords && top !== null;
-        var hStyle = coordsToCss(hcoords, context.isRtl);
-        var extraDateSpan = resourceId ? { resourceId: resourceId } : {};
-        return (common.createElement(common.MoreLinkRoot, { allDayDate: null, moreCnt: hiddenSegs.length, allSegs: hiddenSegs, hiddenSegs: hiddenSegs, alignmentElRef: this.rootElRef, dateProfile: props.dateProfile, todayRange: props.todayRange, extraDateSpan: extraDateSpan, popoverContent: function () { return (common.createElement(common.Fragment, null, hiddenSegs.map(function (seg) {
-                var instanceId = seg.eventRange.instance.instanceId;
+class TimelineLaneMoreLink extends common.BaseComponent {
+    constructor() {
+        super(...arguments);
+        this.rootElRef = common.createRef();
+    }
+    render() {
+        let { props, context } = this;
+        let { hiddenSegs, elRef, placement, resourceId } = props;
+        let { top, hcoords } = placement;
+        let isVisible = hcoords && top !== null;
+        let hStyle = coordsToCss(hcoords, context.isRtl);
+        let extraDateSpan = resourceId ? { resourceId } : {};
+        return (common.createElement(common.MoreLinkRoot, { allDayDate: null, moreCnt: hiddenSegs.length, allSegs: hiddenSegs, hiddenSegs: hiddenSegs, alignmentElRef: this.rootElRef, dateProfile: props.dateProfile, todayRange: props.todayRange, extraDateSpan: extraDateSpan, popoverContent: () => (common.createElement(common.Fragment, null, hiddenSegs.map((seg) => {
+                let instanceId = seg.eventRange.instance.instanceId;
                 return (common.createElement("div", { key: instanceId, style: { visibility: props.isForcedInvisible[instanceId] ? 'hidden' : '' } },
-                    common.createElement(TimelineEvent, tslib.__assign({ isTimeScale: props.isTimeScale, seg: seg, isDragging: false, isResizing: false, isDateSelecting: false, isSelected: instanceId === props.eventSelection }, common.getSegMeta(seg, props.todayRange, props.nowDate)))));
-            }))); } }, function (rootElRef, classNames, innerElRef, innerContent, handleClick, title, isExpanded, popoverId) { return (common.createElement("a", { ref: function (el) {
+                    common.createElement(TimelineEvent, Object.assign({ isTimeScale: props.isTimeScale, seg: seg, isDragging: false, isResizing: false, isDateSelecting: false, isSelected: instanceId === props.eventSelection }, common.getSegMeta(seg, props.todayRange, props.nowDate)))));
+            }))) }, (rootElRef, classNames, innerElRef, innerContent, handleClick, title, isExpanded, popoverId) => (common.createElement("a", { ref: (el) => {
                 common.setRef(rootElRef, el); // for MoreLinkRoot
                 common.setRef(elRef, el); // for props props
-                common.setRef(_this.rootElRef, el); // for this component
-            }, className: ['fc-timeline-more-link'].concat(classNames).join(' '), style: tslib.__assign({ visibility: isVisible ? '' : 'hidden', top: top || 0 }, hStyle), onClick: handleClick, title: title, "aria-expanded": isExpanded, "aria-controls": popoverId },
-            common.createElement("div", { ref: innerElRef, className: "fc-timeline-more-link-inner fc-sticky" }, innerContent))); }));
-    };
-    return TimelineLaneMoreLink;
-}(common.BaseComponent));
+                common.setRef(this.rootElRef, el); // for this component
+            }, className: ['fc-timeline-more-link'].concat(classNames).join(' '), style: Object.assign({ visibility: isVisible ? '' : 'hidden', top: top || 0 }, hStyle), onClick: handleClick, title: title, "aria-expanded": isExpanded, "aria-controls": popoverId },
+            common.createElement("div", { ref: innerElRef, className: "fc-timeline-more-link-inner fc-sticky" }, innerContent)))));
+    }
+}
 
-var TimelineLane = /** @class */ (function (_super) {
-    tslib.__extends(TimelineLane, _super);
-    function TimelineLane() {
-        var _this = _super !== null && _super.apply(this, arguments) || this;
-        _this.slicer = new TimelineLaneSlicer();
-        _this.sortEventSegs = common.memoize(common.sortEventSegs);
-        _this.harnessElRefs = new common.RefMap();
-        _this.moreElRefs = new common.RefMap();
-        _this.innerElRef = common.createRef();
+class TimelineLane extends common.BaseComponent {
+    constructor() {
+        super(...arguments);
+        this.slicer = new TimelineLaneSlicer();
+        this.sortEventSegs = common.memoize(common.sortEventSegs);
+        this.harnessElRefs = new common.RefMap();
+        this.moreElRefs = new common.RefMap();
+        this.innerElRef = common.createRef();
         // TODO: memoize event positioning
-        _this.state = {
+        this.state = {
             eventInstanceHeights: {},
             moreLinkHeights: {},
         };
-        return _this;
     }
-    TimelineLane.prototype.render = function () {
-        var _a = this, props = _a.props, state = _a.state, context = _a.context;
-        var options = context.options;
-        var dateProfile = props.dateProfile, tDateProfile = props.tDateProfile;
-        var slicedProps = this.slicer.sliceProps(props, dateProfile, tDateProfile.isTimeScale ? null : props.nextDayThreshold, context, // wish we didn't have to pass in the rest of the args...
+    render() {
+        let { props, state, context } = this;
+        let { options } = context;
+        let { dateProfile, tDateProfile } = props;
+        let slicedProps = this.slicer.sliceProps(props, dateProfile, tDateProfile.isTimeScale ? null : props.nextDayThreshold, context, // wish we didn't have to pass in the rest of the args...
         dateProfile, context.dateProfileGenerator, tDateProfile, context.dateEnv);
-        var mirrorSegs = (slicedProps.eventDrag ? slicedProps.eventDrag.segs : null) ||
+        let mirrorSegs = (slicedProps.eventDrag ? slicedProps.eventDrag.segs : null) ||
             (slicedProps.eventResize ? slicedProps.eventResize.segs : null) ||
             [];
-        var fgSegs = this.sortEventSegs(slicedProps.fgEventSegs, options.eventOrder);
-        var fgSegHCoords = computeSegHCoords(fgSegs, options.eventMinWidth, props.timelineCoords);
-        var _b = computeFgSegPlacements(fgSegs, fgSegHCoords, state.eventInstanceHeights, state.moreLinkHeights, options.eventOrderStrict, options.eventMaxStack), fgPlacements = _b[0], fgHeight = _b[1];
-        var isForcedInvisible = // TODO: more convenient
+        let fgSegs = this.sortEventSegs(slicedProps.fgEventSegs, options.eventOrder);
+        let fgSegHCoords = computeSegHCoords(fgSegs, options.eventMinWidth, props.timelineCoords);
+        let [fgPlacements, fgHeight] = computeFgSegPlacements(fgSegs, fgSegHCoords, state.eventInstanceHeights, state.moreLinkHeights, options.eventOrderStrict, options.eventMaxStack);
+        let isForcedInvisible = // TODO: more convenient
          (slicedProps.eventDrag ? slicedProps.eventDrag.affectedInstances : null) ||
             (slicedProps.eventResize ? slicedProps.eventResize.affectedInstances : null) ||
             {};
@@ -1088,54 +1027,52 @@ var TimelineLane = /** @class */ (function (_super) {
             common.createElement("div", { className: "fc-timeline-events fc-scrollgrid-sync-inner", ref: this.innerElRef, style: { height: fgHeight } },
                 this.renderFgSegs(fgPlacements, isForcedInvisible, false, false, false),
                 this.renderFgSegs(buildMirrorPlacements(mirrorSegs, props.timelineCoords, fgPlacements), {}, Boolean(slicedProps.eventDrag), Boolean(slicedProps.eventResize), false))));
-    };
-    TimelineLane.prototype.componentDidMount = function () {
+    }
+    componentDidMount() {
         this.updateSize();
-    };
-    TimelineLane.prototype.componentDidUpdate = function (prevProps, prevState) {
+    }
+    componentDidUpdate(prevProps, prevState) {
         if (prevProps.eventStore !== this.props.eventStore || // external thing changed?
             prevProps.timelineCoords !== this.props.timelineCoords || // external thing changed?
             prevState.moreLinkHeights !== this.state.moreLinkHeights // HACK. see addStateEquality
         ) {
             this.updateSize();
         }
-    };
-    TimelineLane.prototype.updateSize = function () {
-        var _this = this;
-        var props = this.props;
-        var timelineCoords = props.timelineCoords;
+    }
+    updateSize() {
+        let { props } = this;
+        let { timelineCoords } = props;
         if (props.onHeightChange) {
             props.onHeightChange(this.innerElRef.current, false);
         }
         if (timelineCoords) {
             this.setState({
-                eventInstanceHeights: common.mapHash(this.harnessElRefs.currentMap, function (harnessEl) { return (Math.round(harnessEl.getBoundingClientRect().height)); }),
-                moreLinkHeights: common.mapHash(this.moreElRefs.currentMap, function (moreEl) { return (Math.round(moreEl.getBoundingClientRect().height)); }),
-            }, function () {
+                eventInstanceHeights: common.mapHash(this.harnessElRefs.currentMap, (harnessEl) => (Math.round(harnessEl.getBoundingClientRect().height))),
+                moreLinkHeights: common.mapHash(this.moreElRefs.currentMap, (moreEl) => (Math.round(moreEl.getBoundingClientRect().height))),
+            }, () => {
                 if (props.onHeightChange) {
-                    props.onHeightChange(_this.innerElRef.current, true);
+                    props.onHeightChange(this.innerElRef.current, true);
                 }
             });
         }
-    };
-    TimelineLane.prototype.renderFgSegs = function (segPlacements, isForcedInvisible, isDragging, isResizing, isDateSelecting) {
-        var _a = this, harnessElRefs = _a.harnessElRefs, moreElRefs = _a.moreElRefs, props = _a.props, context = _a.context;
-        var isMirror = isDragging || isResizing || isDateSelecting;
-        return (common.createElement(common.Fragment, null, segPlacements.map(function (segPlacement) {
-            var seg = segPlacement.seg, hcoords = segPlacement.hcoords, top = segPlacement.top;
+    }
+    renderFgSegs(segPlacements, isForcedInvisible, isDragging, isResizing, isDateSelecting) {
+        let { harnessElRefs, moreElRefs, props, context } = this;
+        let isMirror = isDragging || isResizing || isDateSelecting;
+        return (common.createElement(common.Fragment, null, segPlacements.map((segPlacement) => {
+            let { seg, hcoords, top } = segPlacement;
             if (Array.isArray(seg)) { // a more-link
-                var isoStr = common.buildIsoString(common.computeEarliestSegStart(seg));
+                let isoStr = common.buildIsoString(common.computeEarliestSegStart(seg));
                 return (common.createElement(TimelineLaneMoreLink, { key: 'm:' + isoStr /* "m" for "more" */, elRef: moreElRefs.createRef(isoStr), hiddenSegs: seg, placement: segPlacement, dateProfile: props.dateProfile, nowDate: props.nowDate, todayRange: props.todayRange, isTimeScale: props.tDateProfile.isTimeScale, eventSelection: props.eventSelection, resourceId: props.resourceId, isForcedInvisible: isForcedInvisible }));
             }
-            var instanceId = seg.eventRange.instance.instanceId;
-            var isVisible = isMirror || Boolean(!isForcedInvisible[instanceId] && hcoords && top !== null);
-            var hStyle = coordsToCss(hcoords, context.isRtl);
-            return (common.createElement("div", { key: 'e:' + instanceId /* "e" for "event" */, ref: isMirror ? null : harnessElRefs.createRef(instanceId), className: "fc-timeline-event-harness", style: tslib.__assign({ visibility: isVisible ? '' : 'hidden', top: top || 0 }, hStyle) },
-                common.createElement(TimelineEvent, tslib.__assign({ isTimeScale: props.tDateProfile.isTimeScale, seg: seg, isDragging: isDragging, isResizing: isResizing, isDateSelecting: isDateSelecting, isSelected: instanceId === props.eventSelection /* TODO: bad for mirror? */ }, common.getSegMeta(seg, props.todayRange, props.nowDate)))));
+            let instanceId = seg.eventRange.instance.instanceId;
+            let isVisible = isMirror || Boolean(!isForcedInvisible[instanceId] && hcoords && top !== null);
+            let hStyle = coordsToCss(hcoords, context.isRtl);
+            return (common.createElement("div", { key: 'e:' + instanceId /* "e" for "event" */, ref: isMirror ? null : harnessElRefs.createRef(instanceId), className: "fc-timeline-event-harness", style: Object.assign({ visibility: isVisible ? '' : 'hidden', top: top || 0 }, hStyle) },
+                common.createElement(TimelineEvent, Object.assign({ isTimeScale: props.tDateProfile.isTimeScale, seg: seg, isDragging: isDragging, isResizing: isResizing, isDateSelecting: isDateSelecting, isSelected: instanceId === props.eventSelection /* TODO: bad for mirror? */ }, common.getSegMeta(seg, props.todayRange, props.nowDate)))));
         })));
-    };
-    return TimelineLane;
-}(common.BaseComponent));
+    }
+}
 TimelineLane.addStateEquality({
     eventInstanceHeights: common.isPropsEqual,
     moreLinkHeights: common.isPropsEqual,
@@ -1144,18 +1081,17 @@ function buildMirrorPlacements(mirrorSegs, timelineCoords, fgPlacements) {
     if (!mirrorSegs.length || !timelineCoords) {
         return [];
     }
-    var topsByInstanceId = buildAbsoluteTopHash(fgPlacements); // TODO: cache this at first render?
-    return mirrorSegs.map(function (seg) { return ({
-        seg: seg,
+    let topsByInstanceId = buildAbsoluteTopHash(fgPlacements); // TODO: cache this at first render?
+    return mirrorSegs.map((seg) => ({
+        seg,
         hcoords: timelineCoords.rangeToCoords(seg),
         top: topsByInstanceId[seg.eventRange.instance.instanceId],
-    }); });
+    }));
 }
 function buildAbsoluteTopHash(placements) {
-    var topsByInstanceId = {};
-    for (var _i = 0, placements_1 = placements; _i < placements_1.length; _i++) {
-        var placement = placements_1[_i];
-        var seg = placement.seg;
+    let topsByInstanceId = {};
+    for (let placement of placements) {
+        let { seg } = placement;
         if (!Array.isArray(seg)) { // doesn't represent a more-link
             topsByInstanceId[seg.eventRange.instance.instanceId] = placement.top;
         }
@@ -1163,52 +1099,49 @@ function buildAbsoluteTopHash(placements) {
     return topsByInstanceId;
 }
 
-var TimelineGrid = /** @class */ (function (_super) {
-    tslib.__extends(TimelineGrid, _super);
-    function TimelineGrid() {
-        var _this = _super !== null && _super.apply(this, arguments) || this;
-        _this.slatsRef = common.createRef();
-        _this.state = {
+class TimelineGrid extends common.DateComponent {
+    constructor() {
+        super(...arguments);
+        this.slatsRef = common.createRef();
+        this.state = {
             coords: null,
         };
-        _this.handeEl = function (el) {
+        this.handeEl = (el) => {
             if (el) {
-                _this.context.registerInteractiveComponent(_this, { el: el });
+                this.context.registerInteractiveComponent(this, { el });
             }
             else {
-                _this.context.unregisterInteractiveComponent(_this);
+                this.context.unregisterInteractiveComponent(this);
             }
         };
-        _this.handleCoords = function (coords) {
-            _this.setState({ coords: coords });
-            if (_this.props.onSlatCoords) {
-                _this.props.onSlatCoords(coords);
+        this.handleCoords = (coords) => {
+            this.setState({ coords });
+            if (this.props.onSlatCoords) {
+                this.props.onSlatCoords(coords);
             }
         };
-        return _this;
-    }
-    TimelineGrid.prototype.render = function () {
-        var _this = this;
-        var _a = this, props = _a.props, state = _a.state, context = _a.context;
-        var options = context.options;
-        var dateProfile = props.dateProfile, tDateProfile = props.tDateProfile;
-        var timerUnit = common.greatestDurationDenominator(tDateProfile.slotDuration).unit;
+    }
+    render() {
+        let { props, state, context } = this;
+        let { options } = context;
+        let { dateProfile, tDateProfile } = props;
+        let timerUnit = common.greatestDurationDenominator(tDateProfile.slotDuration).unit;
         return (common.createElement("div", { className: "fc-timeline-body", ref: this.handeEl, style: {
                 minWidth: props.tableMinWidth,
                 height: props.clientHeight,
                 width: props.clientWidth,
             } },
-            common.createElement(common.NowTimer, { unit: timerUnit }, function (nowDate, todayRange) { return (common.createElement(common.Fragment, null,
-                common.createElement(TimelineSlats, { ref: _this.slatsRef, dateProfile: dateProfile, tDateProfile: tDateProfile, nowDate: nowDate, todayRange: todayRange, clientWidth: props.clientWidth, tableColGroupNode: props.tableColGroupNode, tableMinWidth: props.tableMinWidth, onCoords: _this.handleCoords, onScrollLeftRequest: props.onScrollLeftRequest }),
+            common.createElement(common.NowTimer, { unit: timerUnit }, (nowDate, todayRange) => (common.createElement(common.Fragment, null,
+                common.createElement(TimelineSlats, { ref: this.slatsRef, dateProfile: dateProfile, tDateProfile: tDateProfile, nowDate: nowDate, todayRange: todayRange, clientWidth: props.clientWidth, tableColGroupNode: props.tableColGroupNode, tableMinWidth: props.tableMinWidth, onCoords: this.handleCoords, onScrollLeftRequest: props.onScrollLeftRequest }),
                 common.createElement(TimelineLane, { dateProfile: dateProfile, tDateProfile: props.tDateProfile, nowDate: nowDate, todayRange: todayRange, nextDayThreshold: options.nextDayThreshold, businessHours: props.businessHours, eventStore: props.eventStore, eventUiBases: props.eventUiBases, dateSelection: props.dateSelection, eventSelection: props.eventSelection, eventDrag: props.eventDrag, eventResize: props.eventResize, timelineCoords: state.coords }),
                 (options.nowIndicator && state.coords && state.coords.isDateInRange(nowDate)) && (common.createElement("div", { className: "fc-timeline-now-indicator-container" },
-                    common.createElement(common.NowIndicatorRoot, { isAxis: false, date: nowDate }, function (rootElRef, classNames, innerElRef, innerContent) { return (common.createElement("div", { ref: rootElRef, className: ['fc-timeline-now-indicator-line'].concat(classNames).join(' '), style: coordToCss(state.coords.dateToCoord(nowDate), context.isRtl) }, innerContent)); }))))); })));
-    };
+                    common.createElement(common.NowIndicatorRoot, { isAxis: false, date: nowDate }, (rootElRef, classNames, innerElRef, innerContent) => (common.createElement("div", { ref: rootElRef, className: ['fc-timeline-now-indicator-line'].concat(classNames).join(' '), style: coordToCss(state.coords.dateToCoord(nowDate), context.isRtl) }, innerContent))))))))));
+    }
     // Hit System
     // ------------------------------------------------------------------------------------------
-    TimelineGrid.prototype.queryHit = function (positionLeft, positionTop, elWidth, elHeight) {
-        var slats = this.slatsRef.current;
-        var slatHit = slats.positionToHit(positionLeft);
+    queryHit(positionLeft, positionTop, elWidth, elHeight) {
+        let slats = this.slatsRef.current;
+        let slatHit = slats.positionToHit(positionLeft);
         if (slatHit) {
             return {
                 dateProfile: this.props.dateProfile,
@@ -1224,55 +1157,51 @@ var TimelineGrid = /** @class */ (function (_super) {
             };
         }
         return null;
-    };
-    return TimelineGrid;
-}(common.DateComponent));
+    }
+}
 
-var TimelineView = /** @class */ (function (_super) {
-    tslib.__extends(TimelineView, _super);
-    function TimelineView() {
-        var _this = _super !== null && _super.apply(this, arguments) || this;
-        _this.buildTimelineDateProfile = common.memoize(buildTimelineDateProfile);
-        _this.scrollGridRef = common.createRef();
-        _this.state = {
+class TimelineView extends common.DateComponent {
+    constructor() {
+        super(...arguments);
+        this.buildTimelineDateProfile = common.memoize(buildTimelineDateProfile);
+        this.scrollGridRef = common.createRef();
+        this.state = {
             slatCoords: null,
             slotCushionMaxWidth: null,
         };
-        _this.handleSlatCoords = function (slatCoords) {
-            _this.setState({ slatCoords: slatCoords });
+        this.handleSlatCoords = (slatCoords) => {
+            this.setState({ slatCoords });
         };
-        _this.handleScrollLeftRequest = function (scrollLeft) {
-            var scrollGrid = _this.scrollGridRef.current;
+        this.handleScrollLeftRequest = (scrollLeft) => {
+            let scrollGrid = this.scrollGridRef.current;
             scrollGrid.forceScrollLeft(0, scrollLeft);
         };
-        _this.handleMaxCushionWidth = function (slotCushionMaxWidth) {
-            _this.setState({
+        this.handleMaxCushionWidth = (slotCushionMaxWidth) => {
+            this.setState({
                 slotCushionMaxWidth: Math.ceil(slotCushionMaxWidth), // for less rerendering TODO: DRY
             });
         };
-        return _this;
-    }
-    TimelineView.prototype.render = function () {
-        var _this = this;
-        var _a = this, props = _a.props, state = _a.state, context = _a.context;
-        var options = context.options;
-        var stickyHeaderDates = !props.forPrint && common.getStickyHeaderDates(options);
-        var stickyFooterScrollbar = !props.forPrint && common.getStickyFooterScrollbar(options);
-        var tDateProfile = this.buildTimelineDateProfile(props.dateProfile, context.dateEnv, options, context.dateProfileGenerator);
-        var extraClassNames = [
+    }
+    render() {
+        let { props, state, context } = this;
+        let { options } = context;
+        let stickyHeaderDates = !props.forPrint && common.getStickyHeaderDates(options);
+        let stickyFooterScrollbar = !props.forPrint && common.getStickyFooterScrollbar(options);
+        let tDateProfile = this.buildTimelineDateProfile(props.dateProfile, context.dateEnv, options, context.dateProfileGenerator);
+        let extraClassNames = [
             'fc-timeline',
             options.eventOverlap === false ? 'fc-timeline-overlap-disabled' : '',
         ];
-        var slotMinWidth = options.slotMinWidth;
-        var slatCols = buildSlatCols(tDateProfile, slotMinWidth || this.computeFallbackSlotMinWidth(tDateProfile));
-        var sections = [
+        let { slotMinWidth } = options;
+        let slatCols = buildSlatCols(tDateProfile, slotMinWidth || this.computeFallbackSlotMinWidth(tDateProfile));
+        let sections = [
             {
                 type: 'header',
                 key: 'header',
                 isSticky: stickyHeaderDates,
                 chunks: [{
                         key: 'timeline',
-                        content: function (contentArg) { return (common.createElement(TimelineHeader, { dateProfile: props.dateProfile, clientWidth: contentArg.clientWidth, clientHeight: contentArg.clientHeight, tableMinWidth: contentArg.tableMinWidth, tableColGroupNode: contentArg.tableColGroupNode, tDateProfile: tDateProfile, slatCoords: state.slatCoords, onMaxCushionWidth: slotMinWidth ? null : _this.handleMaxCushionWidth })); },
+                        content: (contentArg) => (common.createElement(TimelineHeader, { dateProfile: props.dateProfile, clientWidth: contentArg.clientWidth, clientHeight: contentArg.clientHeight, tableMinWidth: contentArg.tableMinWidth, tableColGroupNode: contentArg.tableColGroupNode, tDateProfile: tDateProfile, slatCoords: state.slatCoords, onMaxCushionWidth: slotMinWidth ? null : this.handleMaxCushionWidth })),
                     }],
             },
             {
@@ -1281,7 +1210,7 @@ var TimelineView = /** @class */ (function (_super) {
                 liquid: true,
                 chunks: [{
                         key: 'timeline',
-                        content: function (contentArg) { return (common.createElement(TimelineGrid, tslib.__assign({}, props, { clientWidth: contentArg.clientWidth, clientHeight: contentArg.clientHeight, tableMinWidth: contentArg.tableMinWidth, tableColGroupNode: contentArg.tableColGroupNode, tDateProfile: tDateProfile, onSlatCoords: _this.handleSlatCoords, onScrollLeftRequest: _this.handleScrollLeftRequest }))); },
+                        content: (contentArg) => (common.createElement(TimelineGrid, Object.assign({}, props, { clientWidth: contentArg.clientWidth, clientHeight: contentArg.clientHeight, tableMinWidth: contentArg.tableMinWidth, tableColGroupNode: contentArg.tableColGroupNode, tDateProfile: tDateProfile, onSlatCoords: this.handleSlatCoords, onScrollLeftRequest: this.handleScrollLeftRequest }))),
                     }],
             },
         ];
@@ -1296,16 +1225,15 @@ var TimelineView = /** @class */ (function (_super) {
                     }],
             });
         }
-        return (common.createElement(common.ViewRoot, { viewSpec: context.viewSpec }, function (rootElRef, classNames) { return (common.createElement("div", { ref: rootElRef, className: extraClassNames.concat(classNames).join(' ') },
-            common.createElement(scrollgrid.ScrollGrid, { ref: _this.scrollGridRef, liquid: !props.isHeightAuto && !props.forPrint, collapsibleWidth: false, colGroups: [
+        return (common.createElement(common.ViewRoot, { viewSpec: context.viewSpec }, (rootElRef, classNames) => (common.createElement("div", { ref: rootElRef, className: extraClassNames.concat(classNames).join(' ') },
+            common.createElement(scrollgrid.ScrollGrid, { ref: this.scrollGridRef, liquid: !props.isHeightAuto && !props.forPrint, collapsibleWidth: false, colGroups: [
                     { cols: slatCols },
-                ], sections: sections }))); }));
-    };
-    TimelineView.prototype.computeFallbackSlotMinWidth = function (tDateProfile) {
+                ], sections: sections })))));
+    }
+    computeFallbackSlotMinWidth(tDateProfile) {
         return Math.max(30, ((this.state.slotCushionMaxWidth || 0) / tDateProfile.slotsPerLabel));
-    };
-    return TimelineView;
-}(common.DateComponent));
+    }
+}
 function buildSlatCols(tDateProfile, slotMinWidth) {
     return [{
             span: tDateProfile.slotCnt,
@@ -1313,6 +1241,36 @@ function buildSlatCols(tDateProfile, slotMinWidth) {
         }];
 }
 
+function styleInject(css, ref) {
+  if ( ref === void 0 ) ref = {};
+  var insertAt = ref.insertAt;
+
+  if (!css || typeof document === 'undefined') { return; }
+
+  var head = document.head || document.getElementsByTagName('head')[0];
+  var style = document.createElement('style');
+  style.type = 'text/css';
+
+  if (insertAt === 'top') {
+    if (head.firstChild) {
+      head.insertBefore(style, head.firstChild);
+    } else {
+      head.appendChild(style);
+    }
+  } else {
+    head.appendChild(style);
+  }
+
+  if (style.styleSheet) {
+    style.styleSheet.cssText = css;
+  } else {
+    style.appendChild(document.createTextNode(css));
+  }
+}
+
+var css_248z = "\n\n  .fc .fc-timeline-body {\n    min-height: 100%;\n    position: relative;\n    z-index: 1; /* scope slots, bg, etc */\n  }\n/*\nvertical slots in both the header AND the body\n*/\n.fc .fc-timeline-slots {\n    position: absolute;\n    z-index: 1;\n    top: 0;\n    bottom: 0\n  }\n.fc .fc-timeline-slots > table {\n      height: 100%;\n    }\n.fc {\n\n  /* border for both header AND body cells */\n\n}\n.fc .fc-timeline-slot-minor {\n    border-style: dotted;\n  }\n.fc {\n\n  /* header cells (aka \"label\") */\n\n}\n.fc .fc-timeline-slot-frame {\n    display: flex;\n    align-items: center; /* vertical align */\n    justify-content: center; /* horizontal align */\n  }\n.fc .fc-timeline-header-row-chrono { /* a row of times */\n  }\n.fc .fc-timeline-header-row-chrono .fc-timeline-slot-frame {\n      justify-content: flex-start; /* horizontal align left or right */\n    }\n.fc .fc-timeline-header-row:last-child { /* guaranteed NOT to have sticky elements */\n  }\n.fc .fc-timeline-header-row:last-child .fc-timeline-slot-frame {\n      /* so text doesn't bleed out and cause extra scroll */\n      /* (won't work with sticky elements) */\n      overflow: hidden;\n    }\n.fc .fc-timeline-slot-cushion {\n    padding: 4px 5px; /* TODO: unify with fc-col-header? */\n    white-space: nowrap;\n  }\n.fc {\n\n  /* NOTE: how does the top row of cells get horizontally centered? */\n  /* for the non-chrono-row, the fc-sticky system looks for text-align center, */\n  /* and it's a fluke that the default browser stylesheet already does this for <th> */\n  /* TODO: have StickyScrolling look at natural left coord to detect centeredness. */\n\n}\n/* only owns one side, so can do dotted */\n.fc-direction-ltr .fc-timeline-slot { border-right: 0 !important }\n.fc-direction-rtl .fc-timeline-slot { border-left: 0 !important }\n.fc .fc-timeline-now-indicator-container {\n    position: absolute;\n    z-index: 4;\n    top: 0;\n    bottom: 0;\n    left: 0;\n    right: 0;\n    width: 0;\n  }\n.fc .fc-timeline-now-indicator-arrow,\n  .fc .fc-timeline-now-indicator-line {\n    position: absolute;\n    top: 0;\n    border-style: solid;\n    border-color: red;\n    border-color: var(--fc-now-indicator-color, red);\n  }\n.fc .fc-timeline-now-indicator-arrow {\n    margin: 0 -6px; /* 5, then one more to counteract scroller's negative margins */\n\n    /* triangle pointing down. TODO: mixin */\n    border-width: 6px 5px 0 5px;\n    border-left-color: transparent;\n    border-right-color: transparent;\n  }\n.fc .fc-timeline-now-indicator-line {\n    margin: 0 -1px; /* counteract scroller's negative margins */\n    bottom: 0;\n    border-width: 0 0 0 1px;\n  }\n.fc {\n\n  /* container */\n\n}\n.fc .fc-timeline-events {\n    position: relative;\n    z-index: 3;\n    width: 0; /* for event positioning. will end up on correct side based on dir */\n  }\n.fc {\n\n  /* harness */\n\n}\n.fc .fc-timeline-event-harness,\n  .fc .fc-timeline-more-link {\n    position: absolute;\n    top: 0; /* for when when top can't be computed yet */\n    /* JS will set tht left/right */\n  }\n/* z-index, scoped within fc-timeline-events */\n.fc-timeline-event { z-index: 1 }\n.fc-timeline-event.fc-event-mirror { z-index: 2 }\n.fc-timeline-event {\n  position: relative; /* contains things. TODO: make part of fc-h-event and fc-v-event */\n  display: flex; /* for v-aligning start/end arrows and making fc-event-main stretch all the way */\n  align-items: center;\n  border-radius: 0;\n  padding: 2px 1px;\n  margin-bottom: 1px;\n  font-size: .85em;\n  font-size: var(--fc-small-font-size, .85em)\n\n  /* time and title spacing */\n  /* ---------------------------------------------------------------------------------------------------- */\n}\n.fc-timeline-event .fc-event-main {\n    flex-grow: 1;\n    flex-shrink: 1;\n    min-width: 0; /* important for allowing to shrink all the way */\n  }\n.fc-timeline-event .fc-event-time {\n    font-weight: bold;\n  }\n.fc-timeline-event .fc-event-time,\n  .fc-timeline-event .fc-event-title {\n    white-space: nowrap;\n    padding: 0 2px;\n  }\n/* move 1px away from slot line */\n.fc-direction-ltr .fc-timeline-event.fc-event-end,\n  .fc-direction-ltr .fc-timeline-more-link {\n    margin-right: 1px;\n  }\n.fc-direction-rtl .fc-timeline-event.fc-event-end,\n  .fc-direction-rtl .fc-timeline-more-link {\n    margin-left: 1px;\n  }\n/* make event beefier when overlap not allowed */\n.fc-timeline-overlap-disabled .fc-timeline-event {\n  padding-top: 5px;\n  padding-bottom: 5px;\n  margin-bottom: 0;\n}\n/* arrows indicating the event continues into past/future */\n/* ---------------------------------------------------------------------------------------------------- */\n/* part of the flexbox flow */\n.fc-timeline-event:not(.fc-event-start):before,\n.fc-timeline-event:not(.fc-event-end):after {\n  content: \"\";\n  flex-grow: 0;\n  flex-shrink: 0;\n  opacity: .5;\n\n  /* triangle. TODO: mixin */\n  width: 0;\n  height: 0;\n  margin: 0 1px;\n  border: 5px solid #000; /* TODO: var */\n  border-top-color: transparent;\n  border-bottom-color: transparent;\n}\n/* pointing left */\n.fc-direction-ltr .fc-timeline-event:not(.fc-event-start):before,\n.fc-direction-rtl .fc-timeline-event:not(.fc-event-end):after {\n  border-left: 0;\n}\n/* pointing right */\n.fc-direction-ltr .fc-timeline-event:not(.fc-event-end):after,\n.fc-direction-rtl .fc-timeline-event:not(.fc-event-start):before {\n  border-right: 0;\n}\n/* +more events indicator */\n/* ---------------------------------------------------------------------------------------------------- */\n.fc-timeline-more-link {\n  font-size: .85em;\n  font-size: var(--fc-small-font-size, .85em);\n  color: inherit;\n  color: var(--fc-more-link-text-color, inherit);\n  background: #d0d0d0;\n  background: var(--fc-more-link-bg-color, #d0d0d0);\n  padding: 1px;\n  cursor: pointer;\n}\n.fc-timeline-more-link-inner { /* has fc-sticky */\n  display: inline-block;\n  left: 0;\n  right: 0;\n  padding: 2px;\n}\n.fc .fc-timeline-bg { /* a container for bg content */\n    position: absolute;\n    z-index: 2;\n    top: 0;\n    bottom: 0;\n    width: 0;\n    left: 0; /* will take precedence when LTR */\n    right: 0; /* will take precedence when RTL */ /* TODO: kill */\n  }\n.fc .fc-timeline-bg .fc-non-business { z-index: 1 }\n.fc .fc-timeline-bg .fc-bg-event { z-index: 2 }\n.fc .fc-timeline-bg .fc-highlight { z-index: 3 }\n.fc .fc-timeline-bg-harness {\n    position: absolute;\n    top: 0;\n    bottom: 0;\n  }\n\n";
+styleInject(css_248z);
+
 var main = common.createPlugin({
     deps: [
         premiumCommonPlugin__default['default'],