@fullcalendar/timeline 7.0.0-beta.0 → 7.0.0-beta.1

package/index.cjs

@@ -7,6 +7,7 @@ var premiumCommonPlugin = require('@fullcalendar/premium-common/index.cjs');
 var internalCommon = require('./internal.cjs');
 require('@fullcalendar/core/internal.cjs');
 require('@fullcalendar/core/preact.cjs');
+require('@fullcalendar/scrollgrid/internal.cjs');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -14,7 +15,7 @@ var premiumCommonPlugin__default = /*#__PURE__*/_interopDefaultLegacy(premiumCom
 
 var index = index_cjs.createPlugin({
     name: '@fullcalendar/timeline',
-    premiumReleaseDate: '2024-10-01',
+    premiumReleaseDate: '2024-10-09',
     deps: [premiumCommonPlugin__default["default"]],
     initialView: 'timelineDay',
     views: {

package/index.global.js

@@ -1,9 +1,9 @@
 /*!
-FullCalendar Timeline Plugin v7.0.0-beta.0
+FullCalendar Timeline Plugin v7.0.0-beta.1
 Docs & License: https://fullcalendar.io/docs/timeline-view-no-resources
 (c) 2024 Adam Shaw
 */
-FullCalendar.Timeline = (function (exports, core, premiumCommonPlugin, internal$1, preact) {
+FullCalendar.Timeline = (function (exports, core, premiumCommonPlugin, internal$1, preact, internal$2) {
     'use strict';
 
     function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
@@ -492,6 +492,7 @@ FullCalendar.Timeline = (function (exports, core, premiumCommonPlugin, internal$
         }
         componentWillUnmount() {
             this.detachWidth();
+            internal$1.setRef(this.props.innerWidthRef, null);
         }
     }
 
@@ -796,8 +797,7 @@ FullCalendar.Timeline = (function (exports, core, premiumCommonPlugin, internal$
                     hStyle = horizontalsToCss(segHorizontal, isRtl);
                 }
                 return (preact.createElement("div", { key: internal$1.buildEventRangeKey(seg.eventRange), className: "fc-timeline-bg-harness", style: hStyle }, fillType === 'bg-event' ?
-                    preact.createElement(internal$1.BgEvent, Object.assign({ seg: seg }, internal$1.getSegMeta(seg, todayRange, nowDate))) :
-                    internal$1.renderFill(fillType)));
+                    preact.createElement(internal$1.BgEvent, Object.assign({ eventRange: seg.eventRange, isStart: seg.isStart, isEnd: seg.isEnd }, internal$1.getEventRangeMeta(seg.eventRange, todayRange, nowDate))) : (internal$1.renderFill(fillType))));
             })));
         }
     }
@@ -852,9 +852,10 @@ FullCalendar.Timeline = (function (exports, core, premiumCommonPlugin, internal$
             let { hiddenSegs, resourceId, forcedInvisibleMap } = props;
             let extraDateSpan = resourceId ? { resourceId } : {};
             return (preact.createElement(internal$1.MoreLinkContainer, { elClasses: ['fc-timeline-more-link'], allDayDate: null, segs: hiddenSegs, hiddenSegs: hiddenSegs, dateProfile: props.dateProfile, todayRange: props.todayRange, extraDateSpan: extraDateSpan, popoverContent: () => (preact.createElement(preact.Fragment, null, hiddenSegs.map((seg) => {
-                    let instanceId = seg.eventRange.instance.instanceId;
+                    let { eventRange } = seg;
+                    let instanceId = eventRange.instance.instanceId;
                     return (preact.createElement("div", { key: instanceId, style: { visibility: forcedInvisibleMap[instanceId] ? 'hidden' : '' } },
-                        preact.createElement(TimelineEvent, Object.assign({ isTimeScale: props.isTimeScale, seg: seg, isDragging: false, isResizing: false, isDateSelecting: false, isSelected: instanceId === props.eventSelection }, internal$1.getSegMeta(seg, props.todayRange, props.nowDate)))));
+                        preact.createElement(TimelineEvent, Object.assign({ isTimeScale: props.isTimeScale, eventRange: eventRange, isStart: seg.isStart, isEnd: seg.isEnd, isDragging: false, isResizing: false, isDateSelecting: false, isSelected: instanceId === props.eventSelection }, internal$1.getEventRangeMeta(eventRange, props.todayRange, props.nowDate)))));
                 }))) }, (InnerContent) => (preact.createElement(InnerContent, { elTag: "div", elClasses: ['fc-timeline-more-link-inner', 'fc-sticky-x'] }))));
         }
     }
@@ -880,6 +881,7 @@ FullCalendar.Timeline = (function (exports, core, premiumCommonPlugin, internal$
         }
         componentWillUnmount() {
             this.detachHeight();
+            internal$1.setRef(this.props.heightRef, null);
         }
     }
 
@@ -957,13 +959,14 @@ FullCalendar.Timeline = (function (exports, core, premiumCommonPlugin, internal$
             let isMirror = isDragging || isResizing || isDateSelecting;
             return (preact.createElement(preact.Fragment, null,
                 segs.map((seg) => {
-                    const { instanceId } = seg.eventRange.instance;
+                    const { eventRange } = seg;
+                    const { instanceId } = eventRange.instance;
                     const segTop = segTops[instanceId];
                     const segHorizontal = segHorizontals[instanceId];
                     const isVisible = isMirror ||
                         (segHorizontal && segTop != null && !forcedInvisibleMap[instanceId]);
                     return (preact.createElement(TimelineEventHarness, { key: instanceId, style: Object.assign({ visibility: isVisible ? '' : 'hidden', top: segTop || 0 }, horizontalsToCss(segHorizontal, context.isRtl)), heightRef: isMirror ? undefined : segHeightRefMap.createRef(instanceId) },
-                        preact.createElement(TimelineEvent, Object.assign({ isTimeScale: props.tDateProfile.isTimeScale, seg: seg, isDragging: isDragging, isResizing: isResizing, isDateSelecting: isDateSelecting, isSelected: instanceId === props.eventSelection /* TODO: bad for mirror? */ }, internal$1.getSegMeta(seg, props.todayRange, props.nowDate)))));
+                        preact.createElement(TimelineEvent, Object.assign({ isTimeScale: props.tDateProfile.isTimeScale, eventRange: eventRange, isStart: seg.isStart, isEnd: seg.isEnd, isDragging: isDragging, isResizing: isResizing, isDateSelecting: isDateSelecting, isSelected: instanceId === props.eventSelection /* TODO: bad for mirror? */ }, internal$1.getEventRangeMeta(eventRange, props.todayRange, props.nowDate)))));
                 }),
                 hiddenGroups.map((hiddenGroup) => (preact.createElement(TimelineEventHarness, { key: hiddenGroup.key, style: Object.assign({ top: hiddenGroupTops[hiddenGroup.key] || 0 }, horizontalsToCss({
                         start: hiddenGroup.span.start,
@@ -981,7 +984,6 @@ FullCalendar.Timeline = (function (exports, core, premiumCommonPlugin, internal$
             this.buildCellNavLinkAttrs = internal$1.memoize(buildCellNavLinkAttrs);
             // ref
             this.innerElRef = preact.createRef();
-            // TODO: unset width/height ref on unmount?
         }
         render() {
             let { props, context } = this;
@@ -1043,7 +1045,10 @@ FullCalendar.Timeline = (function (exports, core, premiumCommonPlugin, internal$
             });
         }
         componentWillUnmount() {
+            const { props } = this;
             this.detachSize();
+            internal$1.setRef(props.innerWidthRef, null);
+            internal$1.setRef(props.innerHeightRef, null);
         }
     }
     // Utils
@@ -1102,6 +1107,7 @@ FullCalendar.Timeline = (function (exports, core, premiumCommonPlugin, internal$
                 // TODO: make this part of the cell obj?
                 // TODO: rowUnit seems wrong sometimes. says 'month' when it should be day
                 // TODO: rowUnit is relevant to whole row. put it on a row object, not the cells
+                // TODO: use rowUnit to key the Row itself?
                 const key = cell.rowUnit + ':' + cell.date.toISOString();
                 return (preact.createElement(TimelineHeaderCell, { key: key, cell: cell, rowLevel: props.rowLevel, dateProfile: props.dateProfile, tDateProfile: props.tDateProfile, todayRange: props.todayRange, nowDate: props.nowDate, isCentered: isCentered, isSticky: isSticky, 
                     // refs
@@ -1110,6 +1116,10 @@ FullCalendar.Timeline = (function (exports, core, premiumCommonPlugin, internal$
                     slotWidth: props.slotWidth }));
             })));
         }
+        componentWillUnmount() {
+            internal$1.setRef(this.props.innerWidthRef, null);
+            internal$1.setRef(this.props.innerHeighRef, null);
+        }
     }
 
     class TimelineNowIndicatorLine extends internal$1.BaseComponent {
@@ -1143,19 +1153,19 @@ FullCalendar.Timeline = (function (exports, core, premiumCommonPlugin, internal$
             this.headerScrollerRef = preact.createRef();
             this.bodyScrollerRef = preact.createRef();
             this.footerScrollerRef = preact.createRef();
+            this.headerRowInnerWidthMap = new internal$1.RefMap(() => {
+                internal$1.afterSize(this.handleSlotInnerWidths);
+            });
+            this.scrollTime = null;
             // Sizing
             // -----------------------------------------------------------------------------------------------
-            this.handleHeaderSlotInnerWidth = (innerWidth) => {
-                this.headerSlotInnerWidth = innerWidth;
-                internal$1.afterSize(this.handleSlotInnerWidths);
-            };
             this.handleBodySlotInnerWidth = (innerWidth) => {
                 this.bodySlotInnerWidth = innerWidth;
                 internal$1.afterSize(this.handleSlotInnerWidths);
             };
             this.handleSlotInnerWidths = () => {
                 const { state } = this;
-                const slotInnerWidth = Math.max(this.headerSlotInnerWidth, this.bodySlotInnerWidth);
+                const slotInnerWidth = Math.max(this.headerRowInnerWidthMap.current.get(this.tDateProfile.cellRows.length - 1) || 0, this.bodySlotInnerWidth);
                 if (state.slotInnerWidth !== slotInnerWidth) {
                     this.setState({ slotInnerWidth });
                 }
@@ -1175,16 +1185,23 @@ FullCalendar.Timeline = (function (exports, core, premiumCommonPlugin, internal$
                     rightScrollbarWidth
                 });
             };
-            this.timeScrollResponder = new internal$1.ScrollResponder((time) => {
-                const { props, context, tDateProfile, slotWidth } = this;
-                if (slotWidth != null) {
-                    const x = timeToCoord(time, context.dateEnv, props.dateProfile, tDateProfile, slotWidth) +
-                        (context.isRtl ? -1 : 1); // overcome border. TODO: DRY this up
+            this.handleTimeScroll = (scrollTime) => {
+                this.scrollTime = scrollTime;
+                this.updateScroll();
+            };
+            this.updateScroll = () => {
+                const { props, context, tDateProfile, scrollTime, slotWidth } = this;
+                if (scrollTime != null && slotWidth != null) {
+                    let x = timeToCoord(scrollTime, context.dateEnv, props.dateProfile, tDateProfile, slotWidth);
+                    if (x) {
+                        x += context.isRtl ? -1 : 1; // overcome border. TODO: DRY this up
+                    }
                     this.syncedScroller.scrollTo({ x });
-                    return true;
                 }
-                return false;
-            });
+            };
+            this.clearScroll = () => {
+                this.scrollTime = null;
+            };
             // Hit System
             // -----------------------------------------------------------------------------------------------
             this.handeBodyEl = (el) => {
@@ -1235,7 +1252,7 @@ FullCalendar.Timeline = (function (exports, core, premiumCommonPlugin, internal$
                             } },
                             preact.createElement("div", null, cellRows.map((cells, rowLevel) => {
                                 const isLast = rowLevel === cellRows.length - 1;
-                                return (preact.createElement(TimelineHeaderRow, { key: rowLevel, dateProfile: props.dateProfile, tDateProfile: tDateProfile, nowDate: nowDate, todayRange: todayRange, rowLevel: rowLevel, isLastRow: isLast, cells: cells, slotWidth: slotWidth, innerWidthRef: isLast ? this.handleHeaderSlotInnerWidth : undefined }));
+                                return (preact.createElement(TimelineHeaderRow, { key: rowLevel, dateProfile: props.dateProfile, tDateProfile: tDateProfile, nowDate: nowDate, todayRange: todayRange, rowLevel: rowLevel, isLastRow: isLast, cells: cells, slotWidth: slotWidth, innerWidthRef: this.headerRowInnerWidthMap.createRef(rowLevel) }));
                             })),
                             enableNowIndicator && (
                             // TODO: make this positioned WITHIN padding?
@@ -1262,27 +1279,26 @@ FullCalendar.Timeline = (function (exports, core, premiumCommonPlugin, internal$
         // Lifecycle
         // -----------------------------------------------------------------------------------------------
         componentDidMount() {
-            const { context } = this;
-            const { options } = context;
-            const ScrollerSyncer = internal$1.getScrollerSyncerClass(this.context.pluginHooks);
-            this.syncedScroller = new ScrollerSyncer(true); // horizontal=true
+            this.syncedScroller = new internal$2.ScrollerSyncer(true); // horizontal=true
             this.updateSyncedScroller();
-            context.emitter.on('_timeScrollRequest', this.timeScrollResponder.handleScroll);
-            this.timeScrollResponder.handleScroll(options.scrollTime);
+            this.resetScroll();
+            this.context.emitter.on('_timeScrollRequest', this.handleTimeScroll);
+            this.syncedScroller.addScrollEndListener(this.clearScroll);
         }
         componentDidUpdate(prevProps) {
-            const { options } = this.context;
             this.updateSyncedScroller();
-            if (prevProps.dateProfile !== this.props.dateProfile && options.scrollTimeReset) {
-                this.timeScrollResponder.handleScroll(options.scrollTime);
+            if (prevProps.dateProfile !== this.props.dateProfile && this.context.options.scrollTimeReset) {
+                this.resetScroll();
             }
             else {
-                this.timeScrollResponder.drain();
+                // TODO: inefficient to update so often
+                this.updateScroll();
             }
         }
         componentWillUnmount() {
             this.syncedScroller.destroy();
-            this.context.emitter.off('_timeScrollRequest', this.timeScrollResponder.handleScroll);
+            this.context.emitter.off('_timeScrollRequest', this.handleTimeScroll);
+            this.syncedScroller.removeScrollEndListener(this.clearScroll);
         }
         // Scrolling
         // -----------------------------------------------------------------------------------------------
@@ -1291,7 +1307,10 @@ FullCalendar.Timeline = (function (exports, core, premiumCommonPlugin, internal$
                 this.headerScrollerRef.current,
                 this.bodyScrollerRef.current,
                 this.footerScrollerRef.current
-            ], this.context.isRtl);
+            ]);
+        }
+        resetScroll() {
+            this.handleTimeScroll(this.context.options.scrollTime);
         }
         queryHit(positionLeft, positionTop, elWidth, elHeight) {
             const { props, context, tDateProfile, slotWidth } = this;
@@ -1343,7 +1362,7 @@ FullCalendar.Timeline = (function (exports, core, premiumCommonPlugin, internal$
 
     var plugin = core.createPlugin({
         name: '@fullcalendar/timeline',
-        premiumReleaseDate: '2024-10-01',
+        premiumReleaseDate: '2024-10-09',
         deps: [premiumCommonPlugin__default["default"]],
         initialView: 'timelineDay',
         views: {
@@ -1399,4 +1418,4 @@ FullCalendar.Timeline = (function (exports, core, premiumCommonPlugin, internal$
 
     return exports;
 
-})({}, FullCalendar, FullCalendar.PremiumCommon, FullCalendar.Internal, FullCalendar.Preact);
+})({}, FullCalendar, FullCalendar.PremiumCommon, FullCalendar.Internal, FullCalendar.Preact, FullCalendar.ScrollGrid.Internal);

package/index.global.min.js

@@ -1,6 +1,6 @@
 /*!
-FullCalendar Timeline Plugin v7.0.0-beta.0
+FullCalendar Timeline Plugin v7.0.0-beta.1
 Docs & License: https://fullcalendar.io/docs/timeline-view-no-resources
 (c) 2024 Adam Shaw
 */
-FullCalendar.Timeline=function(e,t,n,i,r){"use strict";function l(e){return e&&e.__esModule?e:{default:e}}var s=l(n);i.config.MAX_TIMELINE_SLOTS=1e3;const a=[{years:1},{months:1},{days:1},{hours:1},{minutes:30},{minutes:15},{minutes:10},{minutes:5},{minutes:1},{seconds:30},{seconds:15},{seconds:10},{seconds:5},{seconds:1},{milliseconds:500},{milliseconds:100},{milliseconds:10},{milliseconds:1}];function o(e,t,n,r){let l={labelInterval:n.slotLabelInterval,slotDuration:n.slotDuration};!function(e,t,n){const{currentRange:r}=t;if(e.labelInterval){n.countDurationsBetween(r.start,r.end,e.labelInterval)>i.config.MAX_TIMELINE_SLOTS&&(console.warn("slotLabelInterval results in too many cells"),e.labelInterval=null)}if(e.slotDuration){n.countDurationsBetween(r.start,r.end,e.slotDuration)>i.config.MAX_TIMELINE_SLOTS&&(console.warn("slotDuration results in too many cells"),e.slotDuration=null)}if(e.labelInterval&&e.slotDuration){const t=i.wholeDivideDurations(e.labelInterval,e.slotDuration);(null===t||t<1)&&(console.warn("slotLabelInterval must be a multiple of slotDuration"),e.slotDuration=null)}}(l,e,t),f(l,e,t),function(e,t,n){const{currentRange:r}=t;let{slotDuration:l}=e;if(!l){const s=f(e,t,n);for(let e of a){const t=i.createDuration(e),n=i.wholeDivideDurations(s,t);if(null!==n&&n>1&&n<=6){l=t;break}}if(l){n.countDurationsBetween(r.start,r.end,l)>200&&(l=null)}l||(l=s),e.slotDuration=l}}(l,e,t);let s=n.slotLabelFormat,o=Array.isArray(s)?s:null!=s?[s]:function(e,t,n,r){let l,s;const{labelInterval:a}=e;let o=i.greatestDurationDenominator(a).unit;const c=r.weekNumbers;let d=l=s=null;"week"!==o||c||(o="day");switch(o){case"year":d={year:"numeric"};break;case"month":h("years",t,n)>1&&(d={year:"numeric"}),l={month:"short"};break;case"week":h("years",t,n)>1&&(d={year:"numeric"}),l={week:"narrow"};break;case"day":h("years",t,n)>1?d={year:"numeric",month:"long"}:h("months",t,n)>1&&(d={month:"long"}),c&&(l={week:"short"}),s={weekday:"narrow",day:"numeric"};break;case"hour":c&&(d={week:"short"}),h("days",t,n)>1&&(l={weekday:"short",day:"numeric",month:"numeric",omitCommas:!0}),s={hour:"numeric",minute:"2-digit",omitZeroMinute:!0,meridiem:"short"};break;case"minute":i.asRoughMinutes(a)/60>=6?(d={hour:"numeric",meridiem:"short"},l=e=>":"+i.padStart(e.date.minute,2)):d={hour:"numeric",minute:"numeric",meridiem:"short"};break;case"second":i.asRoughSeconds(a)/60>=6?(d={hour:"numeric",minute:"2-digit",meridiem:"lowercase"},l=e=>":"+i.padStart(e.date.second,2)):d={hour:"numeric",minute:"2-digit",second:"2-digit",meridiem:"lowercase"};break;case"millisecond":d={hour:"numeric",minute:"2-digit",second:"2-digit",meridiem:"lowercase"},l=e=>"."+i.padStart(e.millisecond,3)}return[].concat(d||[],l||[],s||[])}(l,e,t,n);l.headerFormats=o.map(e=>i.createFormatter(e)),l.isTimeScale=Boolean(l.slotDuration.milliseconds);let u=null;if(!l.isTimeScale){const e=i.greatestDurationDenominator(l.slotDuration).unit;/year|month|week/.test(e)&&(u=e)}l.largeUnit=u,l.emphasizeWeeks=1===i.asCleanDays(l.slotDuration)&&h("weeks",e,t)>=2&&!n.businessHours;let g,p,v=n.snapDuration;v&&(g=i.createDuration(v),p=i.wholeDivideDurations(l.slotDuration,g)),null==p&&(g=l.slotDuration,p=1),l.snapDuration=g,l.snapsPerSlot=p;let S=i.asRoughMs(e.slotMaxTime)-i.asRoughMs(e.slotMinTime),R=c(e.renderRange.start,l,t),D=c(e.renderRange.end,l,t);l.isTimeScale&&(R=t.add(R,e.slotMinTime),D=t.add(i.addDays(D,-1),e.slotMaxTime)),l.timeWindowMs=S,l.normalizedRange={start:R,end:D};let y=[],w=R;for(;w<D;)d(w,l,e,r)&&y.push(w),w=t.add(w,l.slotDuration);l.slotDates=y;let b=-1,x=0;const W=[],E=[];for(w=R;w<D;)d(w,l,e,r)?(b+=1,W.push(b),E.push(x)):W.push(b+.5),w=t.add(w,l.snapDuration),x+=1;return l.snapDiffToIndex=W,l.snapIndexToDiff=E,l.snapCnt=b+1,l.slotCnt=l.snapCnt/l.snapsPerSlot,l.isWeekStarts=function(e,t){let{slotDates:n,emphasizeWeeks:i}=e,r=null,l=[];for(let e of n){let n=t.computeWeekNumber(e),s=i&&null!==r&&r!==n;r=n,l.push(s)}return l}(l,t),l.cellRows=function(e,t){let n=e.slotDates,r=e.headerFormats,l=r.map(()=>[]),s=i.asCleanDays(e.slotDuration),a=7===s?"week":1===s?"day":null,o=r.map(e=>e.getLargestUnit?e.getLargestUnit():null);for(let s=0;s<n.length;s+=1){let c=n[s],d=e.isWeekStarts[s];for(let n=0;n<r.length;n+=1){let s=r[n],f=l[n],h=f[f.length-1],u=n===r.length-1,g=r.length>1&&!u,p=null,v=o[n]||(u?a:null);if(g){let e=t.format(c,s);h&&h.text===e?h.colspan+=1:p=m(c,e,v)}else if(!h||i.isInt(t.countDurationsBetween(e.normalizedRange.start,c,e.labelInterval))){let e=t.format(c,s);p=m(c,e,v)}else h.colspan+=1;p&&(p.weekStart=d,f.push(p))}}return l}(l,t),l.slotsPerLabel=i.wholeDivideDurations(l.labelInterval,l.slotDuration),l}function c(e,t,n){let r=e;return t.isTimeScale||(r=i.startOfDay(r),t.largeUnit&&(r=n.startOf(r,t.largeUnit))),r}function d(e,t,n,r){if(r.isHiddenDay(e))return!1;if(t.isTimeScale){let r=i.startOfDay(e),l=e.valueOf()-r.valueOf()-i.asRoughMs(n.slotMinTime);return l=(l%864e5+864e5)%864e5,l<t.timeWindowMs}return!0}function f(e,t,n){const{currentRange:r}=t;let{labelInterval:l}=e;if(!l){let t;if(e.slotDuration){for(t of a){const n=i.createDuration(t),r=i.wholeDivideDurations(n,e.slotDuration);if(null!==r&&r<=6){l=n;break}}l||(l=e.slotDuration)}else for(t of a){l=i.createDuration(t);if(n.countDurationsBetween(r.start,r.end,l)>=18)break}e.labelInterval=l}return l}function h(e,t,n){let r=t.currentRange,l=null;return"years"===e?l=n.diffWholeYears(r.start,r.end):"months"===e||"weeks"===e?l=n.diffWholeMonths(r.start,r.end):"days"===e&&(l=i.diffWholeDays(r.start,r.end)),l||0}function m(e,t,n){return{date:e,text:t,rowUnit:n,colspan:1,isWeekStart:!1}}class u extends i.BaseComponent{constructor(){super(...arguments),this.innerElRef=r.createRef()}render(){let{props:e,context:t}=this,{dateEnv:n,options:l,theme:s}=t,{date:a,tDateProfile:o,isEm:c}=e,d=i.getDateMeta(e.date,e.todayRange,e.nowDate,e.dateProfile),f=Object.assign(Object.assign({date:n.toDate(e.date)},d),{view:t.viewApi});return r.createElement(i.ContentContainer,{elTag:"div",elClasses:["fc-flex-column","fc-align-start","fc-cell","fc-timeline-slot","fc-timeline-slot-lane",c?"fc-timeline-slot-em":"",o.isTimeScale?i.isInt(n.countDurationsBetween(o.normalizedRange.start,e.date,o.labelInterval))?"fc-timeline-slot-major":"fc-timeline-slot-minor":"",...e.isDay?i.getDayClassNames(d,s):i.getSlotClassNames(d,s)],elAttrs:{"data-date":n.formatIso(a,{omitTimeZoneOffset:!0,omitTime:!o.isTimeScale})},elStyle:{width:e.width},renderProps:f,generatorName:"slotLaneContent",customGenerator:l.slotLaneContent,classNameGenerator:l.slotLaneClassNames,didMount:l.slotLaneDidMount,willUnmount:l.slotLaneWillUnmount},e=>r.createElement("div",{ref:this.innerElRef,className:"fc-flex-column"},r.createElement(e,{elTag:"div",elClasses:["fc-cell-inner"]})))}componentDidMount(){const e=this.innerElRef.current;this.detachWidth=i.watchWidth(e,e=>{i.setRef(this.props.innerWidthRef,e)})}componentWillUnmount(){this.detachWidth()}}class g extends i.BaseComponent{constructor(){super(...arguments),this.innerWidthRefMap=new i.RefMap(()=>{i.afterSize(this.handleInnerWidths)}),this.handleInnerWidths=()=>{const e=this.innerWidthRefMap.current;let t=0;for(const n of e.values())t=Math.max(t,n);i.setRef(this.props.innerWidthRef,t)}}render(){let{props:e,innerWidthRefMap:t}=this,{tDateProfile:n,slotWidth:i}=e,{slotDates:l,isWeekStarts:s}=n,a=!n.isTimeScale&&!n.largeUnit;return r.createElement("div",{className:"fc-timeline-slots fc-fill fc-flex-row"},l.map((l,o)=>{let c=l.toISOString();return r.createElement(u,{key:c,date:l,dateProfile:e.dateProfile,tDateProfile:n,nowDate:e.nowDate,todayRange:e.todayRange,isEm:s[o],isDay:a,innerWidthRef:t.createRef(c),width:i})}))}}function p(e,t,n){let r=n.countDurationsBetween(t.normalizedRange.start,e,t.snapDuration);if(r<0)return 0;if(r>=t.snapDiffToIndex.length)return t.snapCnt;let l=Math.floor(r),s=t.snapDiffToIndex[l];return i.isInt(s)?s+=r-l:s=Math.ceil(s),s}function v(e,t){return e?t?{right:e.start,width:e.size}:{left:e.start,width:e.size}:{}}function S(e,t){return t?{right:e}:{left:e}}function R(e,t,n,i,r){if(null==i||null==r)return[void 0,void 0,!1];const l=r/e;let s,a;return l>=(n=Math.max(n||0,(i+1)/t,30))?(s=!0,a=l):(s=!1,a=Math.max(n,l)),[a*e,a,s]}function D(e,t,n,r,l){let s=t.add(n.activeRange.start,e);return r.isTimeScale||(s=i.startOfDay(s)),y(s,t,r,l)}function y(e,t,n,r){return function(e,t,n){let r=n.countDurationsBetween(t.normalizedRange.start,e,t.snapDuration);if(r<0)return 0;if(r>=t.snapDiffToIndex.length)return t.snapCnt;let l=Math.floor(r),s=t.snapDiffToIndex[l];i.isInt(s)?s+=r-l:s=Math.ceil(s);return s}(e,n,t)/n.snapsPerSlot*r}function w(e,t,n,i,r){const l={};for(const s of e)l[s.eventRange.instance.instanceId]=b(s,t,n,i,r);return l}function b(e,t,n,i,r){const l=y(e.start,n,i,r);let s=y(e.end,n,i,r)-l;return t&&(s=Math.max(s,t)),{start:l,size:s}}function x(e,t,n){let i=0;for(const r of e){const{instanceId:e}=r.eventRange.instance,l=t[e],s=n.get(e);null!=l&&null!=s&&(i=Math.max(i,l+s))}return i}class W extends i.BaseComponent{render(){let{props:e}=this,t=[].concat(e.eventResizeSegs,e.dateSelectionSegs);return r.createElement("div",{className:"fc-timeline-bg"},this.renderSegs(e.businessHourSegs||[],"non-business"),this.renderSegs(e.bgEventSegs||[],"bg-event"),this.renderSegs(t,"highlight"))}renderSegs(e,t){let{tDateProfile:n,todayRange:l,nowDate:s,slotWidth:a}=this.props,{dateEnv:o,isRtl:c}=this.context;return r.createElement(r.Fragment,null,e.map(e=>{let d;if(null!=a){d=v(b(e,void 0,o,n,a),c)}return r.createElement("div",{key:i.buildEventRangeKey(e.eventRange),className:"fc-timeline-bg-harness",style:d},"bg-event"===t?r.createElement(i.BgEvent,Object.assign({seg:e},i.getSegMeta(e,l,s))):i.renderFill(t))}))}}class E extends i.Slicer{sliceRange(e,t,n,r,l){let s=function(e,t,n){if(!t.isTimeScale&&(e=i.computeVisibleDayRange(e),t.largeUnit)){let i=e;((e={start:n.startOf(e.start,t.largeUnit),end:n.startOf(e.end,t.largeUnit)}).end.valueOf()!==i.end.valueOf()||e.end<=e.start)&&(e={start:e.start,end:n.add(e.end,t.slotDuration)})}return e}(e,r,l),a=[];if(p(s.start,r,l)<p(s.end,r,l)){let e=i.intersectRanges(s,r.normalizedRange);e&&a.push({start:e.start,end:e.end,isStart:e.start.valueOf()===s.start.valueOf()&&d(e.start,r,t,n),isEnd:e.end.valueOf()===s.end.valueOf()&&d(i.addMs(e.end,-1),r,t,n)})}return a}}const M=i.createFormatter({hour:"numeric",minute:"2-digit",omitZeroMinute:!0,meridiem:"narrow"});class k extends i.BaseComponent{render(){let{props:e,context:t}=this,{options:n}=t;return r.createElement(i.StandardEvent,Object.assign({},e,{elClasses:["fc-timeline-event","fc-h-event",!1===n.eventOverlap?"fc-timeline-event-spacious":""],defaultTimeFormat:M,defaultDisplayEventTime:!e.isTimeScale}))}}class I extends i.BaseComponent{render(){let{props:e}=this,{hiddenSegs:t,resourceId:n,forcedInvisibleMap:l}=e,s=n?{resourceId:n}:{};return r.createElement(i.MoreLinkContainer,{elClasses:["fc-timeline-more-link"],allDayDate:null,segs:t,hiddenSegs:t,dateProfile:e.dateProfile,todayRange:e.todayRange,extraDateSpan:s,popoverContent:()=>r.createElement(r.Fragment,null,t.map(t=>{let n=t.eventRange.instance.instanceId;return r.createElement("div",{key:n,style:{visibility:l[n]?"hidden":""}},r.createElement(k,Object.assign({isTimeScale:e.isTimeScale,seg:t,isDragging:!1,isResizing:!1,isDateSelecting:!1,isSelected:n===e.eventSelection},i.getSegMeta(t,e.todayRange,e.nowDate))))}))},e=>r.createElement(e,{elTag:"div",elClasses:["fc-timeline-more-link-inner","fc-sticky-x"]}))}}class C extends r.Component{constructor(){super(...arguments),this.rootElRef=r.createRef()}render(){const{props:e}=this;return r.createElement("div",{className:"fc-abs",style:e.style,ref:this.rootElRef},e.children)}componentDidMount(){const e=this.rootElRef.current;this.detachHeight=i.watchHeight(e,e=>{i.setRef(this.props.heightRef,e)})}componentWillUnmount(){this.detachHeight()}}class T extends i.BaseComponent{constructor(){super(...arguments),this.sortEventSegs=i.memoize(i.sortEventSegs),this.segHeightRefMap=new i.RefMap(()=>{i.afterSize(this.handleSegHeights)}),this.moreLinkHeightRefMap=new i.RefMap(()=>{i.afterSize(this.handleMoreLinkHeights)}),this.slicer=new E,this.handleMoreLinkHeights=()=>{this.setState({moreLinkHeightRev:this.moreLinkHeightRefMap.rev})},this.handleSegHeights=()=>{this.setState({segHeightRev:this.segHeightRefMap.rev})}}render(){let{props:e,context:t,segHeightRefMap:n}=this,{options:l}=t,{dateProfile:s,tDateProfile:a}=e,o=this.slicer.sliceProps(e,s,a.isTimeScale?null:e.nextDayThreshold,t,s,t.dateProfileGenerator,a,t.dateEnv),c=(o.eventDrag?o.eventDrag.segs:null)||(o.eventResize?o.eventResize.segs:null)||[],d=this.sortEventSegs(o.fgEventSegs,l.eventOrder),f=null!=e.slotWidth?w(d,l.eventMinWidth,t.dateEnv,a,e.slotWidth):{},[h,m,u,g]=function(e,t,n,r,l){let s=[];for(let i=0;i<e.length;i+=1){let r=e[i],l=r.eventRange.instance.instanceId,a=n.get(l),o=t[l];null!=a&&null!=o&&s.push({index:i,seg:r,span:{start:o.start,end:o.start+o.size},thickness:a})}let a=new i.SegHierarchy;null!=r&&(a.strictOrder=r),null!=l&&(a.maxStackCnt=l);let o=a.addSegs(s),c=i.groupIntersectingEntries(o),d=c.map((t,n)=>({index:e.length+n,segGroup:t,span:t.span,thickness:1}));a.maxStackCnt=-1,a.addSegs(d);let f=a.toRects(),h={},m={};for(let e of f){const{seg:t,segGroup:n}=e;t?h[t.eventRange.instance.instanceId]=e.levelCoord:m[n.key]=e.levelCoord}return[h,x(e,h,n),c,m]}(d,f,n.current,l.eventOrderStrict,l.eventMaxStack),p=function(e,t,n){let i=0;for(const r of e){const e=t[r.key],l=n.get(r.key);null!=e&&null!=l&&(i=Math.max(i,e+l))}return i}(u,g,this.moreLinkHeightRefMap.current),v=Math.max(p,m),S=(o.eventDrag?o.eventDrag.affectedInstances:null)||(o.eventResize?o.eventResize.affectedInstances:null)||{};return r.createElement(r.Fragment,null,r.createElement(W,{tDateProfile:a,nowDate:e.nowDate,todayRange:e.todayRange,bgEventSegs:o.bgEventSegs,businessHourSegs:o.businessHourSegs,dateSelectionSegs:o.dateSelectionSegs,eventResizeSegs:o.eventResize?o.eventResize.segs:[],slotWidth:e.slotWidth}),r.createElement("div",{className:["fc-timeline-events","fc-content-box",!1===l.eventOverlap?"fc-timeline-events-overlap-disabled":"fc-timeline-events-overlap-enabled"].join(" "),style:{height:v}},this.renderFgSegs(d,f,h,S,u,g,!1,!1,!1),this.renderFgSegs(c,e.slotWidth?w(c,l.eventMinWidth,t.dateEnv,a,e.slotWidth):{},h,{},[],{},Boolean(o.eventDrag),Boolean(o.eventResize),!1)))}renderFgSegs(e,t,n,l,s,a,o,c,d){let{props:f,context:h,segHeightRefMap:m,moreLinkHeightRefMap:u}=this,g=o||c||d;return r.createElement(r.Fragment,null,e.map(e=>{const{instanceId:s}=e.eventRange.instance,a=n[s],u=t[s],p=g||u&&null!=a&&!l[s];return r.createElement(C,{key:s,style:Object.assign({visibility:p?"":"hidden",top:a||0},v(u,h.isRtl)),heightRef:g?void 0:m.createRef(s)},r.createElement(k,Object.assign({isTimeScale:f.tDateProfile.isTimeScale,seg:e,isDragging:o,isResizing:c,isDateSelecting:d,isSelected:s===f.eventSelection},i.getSegMeta(e,f.todayRange,f.nowDate))))}),s.map(e=>r.createElement(C,{key:e.key,style:Object.assign({top:a[e.key]||0},v({start:e.span.start,size:e.span.end-e.span.start},h.isRtl)),heightRef:u.createRef(e.key)},r.createElement(I,{hiddenSegs:e.segs,dateProfile:f.dateProfile,nowDate:f.nowDate,todayRange:f.todayRange,isTimeScale:f.tDateProfile.isTimeScale,eventSelection:f.eventSelection,resourceId:f.resourceId,forcedInvisibleMap:l}))))}}class P extends i.BaseComponent{constructor(){super(...arguments),this.refineRenderProps=i.memoizeObjArg(H),this.buildCellNavLinkAttrs=i.memoize(z),this.innerElRef=r.createRef()}render(){let{props:e,context:t}=this,{dateEnv:n,options:l}=t,{cell:s,dateProfile:a,tDateProfile:o}=e,c=i.getDateMeta(s.date,e.todayRange,e.nowDate,a),d=this.refineRenderProps({level:e.rowLevel,dateMarker:s.date,text:s.text,dateEnv:t.dateEnv,viewApi:t.viewApi});return r.createElement(i.ContentContainer,{elTag:"div",elClasses:["fc-timeline-slot-label","fc-timeline-slot",s.isWeekStart?"fc-timeline-slot-em":"","fc-header-cell","fc-cell","fc-flex-column","fc-justify-center",e.isCentered?"fc-align-center":"fc-align-start",..."time"===s.rowUnit?i.getSlotClassNames(c,t.theme):i.getDayClassNames(c,t.theme)],elAttrs:{"data-date":n.formatIso(s.date,{omitTime:!o.isTimeScale,omitTimeZoneOffset:!0})},elStyle:{width:null!=e.slotWidth?e.slotWidth*s.colspan:void 0},renderProps:d,generatorName:"slotLabelContent",customGenerator:l.slotLabelContent,defaultGenerator:L,classNameGenerator:l.slotLabelClassNames,didMount:l.slotLabelDidMount,willUnmount:l.slotLabelWillUnmount},n=>r.createElement("div",{ref:this.innerElRef,className:["fc-flex-column",e.isSticky?"fc-sticky-x":""].join(" ")},r.createElement(n,{elTag:"a",elClasses:["fc-cell-inner","fc-padding-md"],elAttrs:this.buildCellNavLinkAttrs(t,s.date,s.rowUnit)})))}componentDidMount(){const{props:e}=this,t=this.innerElRef.current;this.detachSize=i.watchSize(t,(n,r)=>{i.setRef(e.innerWidthRef,n),i.setRef(e.innerHeightRef,r),t.style.left=t.style.right=e.isCentered&&e.isSticky?`calc(50% - ${n/2}px)`:""})}componentWillUnmount(){this.detachSize()}}function z(e,t,n){return n&&"time"!==n?i.buildNavLinkAttrs(e,t,n):{}}function L(e){return e.text}function H(e){return{level:e.level,date:e.dateEnv.toDate(e.dateMarker),view:e.viewApi,text:e.text}}class N extends i.BaseComponent{constructor(){super(...arguments),this.innerWidthRefMap=new i.RefMap(()=>{i.afterSize(this.handleInnerWidths)}),this.innerHeightRefMap=new i.RefMap(()=>{i.afterSize(this.handleInnerHeights)}),this.handleInnerWidths=()=>{const e=this.innerWidthRefMap.current;let t=0;for(const n of e.values())t=Math.max(t,n);i.setRef(this.props.innerWidthRef,t)},this.handleInnerHeights=()=>{const e=this.innerHeightRefMap.current;let t=0;for(const n of e.values())t=Math.max(t,n);i.setRef(this.props.innerHeighRef,t)}}render(){const{props:e,innerWidthRefMap:t,innerHeightRefMap:n}=this,i=!(e.tDateProfile.isTimeScale&&e.isLastRow),l=!e.isLastRow;return r.createElement("div",{className:"fc-row",style:{height:e.height}},e.cells.map(s=>{const a=s.rowUnit+":"+s.date.toISOString();return r.createElement(P,{key:a,cell:s,rowLevel:e.rowLevel,dateProfile:e.dateProfile,tDateProfile:e.tDateProfile,todayRange:e.todayRange,nowDate:e.nowDate,isCentered:i,isSticky:l,innerWidthRef:t.createRef(a),innerHeightRef:n.createRef(a),slotWidth:e.slotWidth})}))}}class O extends i.BaseComponent{render(){const{props:e,context:t}=this;return r.createElement("div",{className:"fc-timeline-now-indicator-container"},r.createElement(i.NowIndicatorContainer,{elClasses:["fc-timeline-now-indicator-line"],elStyle:null!=e.slotWidth?S(y(e.nowDate,t.dateEnv,e.tDateProfile,e.slotWidth),t.isRtl):{},isAxis:!1,date:e.nowDate}))}}class B extends i.BaseComponent{render(){const{props:e,context:t}=this;return r.createElement("div",{className:"fc-timeline-now-indicator-container"},r.createElement(i.NowIndicatorContainer,{elClasses:["fc-timeline-now-indicator-arrow"],elStyle:null!=e.slotWidth?S(y(e.nowDate,t.dateEnv,e.tDateProfile,e.slotWidth),t.isRtl):{},isAxis:!0,date:e.nowDate}))}}class U extends i.DateComponent{constructor(){super(...arguments),this.buildTimelineDateProfile=i.memoize(o),this.computeSlotWidth=i.memoize(R),this.headerScrollerRef=r.createRef(),this.bodyScrollerRef=r.createRef(),this.footerScrollerRef=r.createRef(),this.handleHeaderSlotInnerWidth=e=>{this.headerSlotInnerWidth=e,i.afterSize(this.handleSlotInnerWidths)},this.handleBodySlotInnerWidth=e=>{this.bodySlotInnerWidth=e,i.afterSize(this.handleSlotInnerWidths)},this.handleSlotInnerWidths=()=>{const{state:e}=this,t=Math.max(this.headerSlotInnerWidth,this.bodySlotInnerWidth);e.slotInnerWidth!==t&&this.setState({slotInnerWidth:t})},this.handleScrollerWidth=e=>{this.setState({scrollerWidth:e})},this.handleLeftScrollbarWidth=e=>{this.setState({leftScrollbarWidth:e})},this.handleRightScrollbarWidth=e=>{this.setState({rightScrollbarWidth:e})},this.timeScrollResponder=new i.ScrollResponder(e=>{const{props:t,context:n,tDateProfile:i,slotWidth:r}=this;if(null!=r){const l=D(e,n.dateEnv,t.dateProfile,i,r)+(n.isRtl?-1:1);return this.syncedScroller.scrollTo({x:l}),!0}return!1}),this.handeBodyEl=e=>{this.bodyEl=e,e?this.context.registerInteractiveComponent(this,{el:e}):this.context.unregisterInteractiveComponent(this)}}render(){const{props:e,state:t,context:n}=this,{options:l}=n,s=this.tDateProfile=this.buildTimelineDateProfile(e.dateProfile,n.dateEnv,l,n.dateProfileGenerator),{cellRows:a}=s,o=i.greatestDurationDenominator(s.slotDuration).unit,c=!e.forPrint&&!i.getIsHeightAuto(l),d=!e.forPrint&&i.getStickyHeaderDates(l),f=!e.forPrint&&i.getStickyFooterScrollbar(l),[h,m]=this.computeSlotWidth(s.slotCnt,s.slotsPerLabel,l.slotMinWidth,t.slotInnerWidth,t.scrollerWidth);return this.slotWidth=m,r.createElement(i.NowTimer,{unit:o},(o,u)=>{const p=l.nowIndicator&&null!=m&&i.rangeContainsMarker(e.dateProfile.currentRange,o);return r.createElement(i.ViewContainer,{viewSpec:n.viewSpec,elClasses:["fc-timeline-view","fc-flex-column","fc-border"]},r.createElement(i.Scroller,{horizontal:!0,hideScrollbars:!0,elClassNames:["fc-timeline-header","fc-rowgroup",d?"fc-sticky-header":""],ref:this.headerScrollerRef},r.createElement("div",{className:"fc-rel fc-content-box",style:{width:h,paddingLeft:t.leftScrollbarWidth,paddingRight:t.rightScrollbarWidth}},r.createElement("div",null,a.map((t,n)=>{const i=n===a.length-1;return r.createElement(N,{key:n,dateProfile:e.dateProfile,tDateProfile:s,nowDate:o,todayRange:u,rowLevel:n,isLastRow:i,cells:t,slotWidth:m,innerWidthRef:i?this.handleHeaderSlotInnerWidth:void 0})})),p&&r.createElement(B,{tDateProfile:s,nowDate:o,slotWidth:m}))),r.createElement(i.Scroller,{vertical:c,horizontal:!0,elClassNames:["fc-timeline-body","fc-rowgroup",c?"fc-liquid":""],ref:this.bodyScrollerRef,widthRef:this.handleScrollerWidth,leftScrollbarWidthRef:this.handleLeftScrollbarWidth,rightScrollbarWidthRef:this.handleRightScrollbarWidth},r.createElement("div",{className:"fc-rel fc-grow",style:{width:h},ref:this.handeBodyEl},r.createElement(g,{dateProfile:e.dateProfile,tDateProfile:s,nowDate:o,todayRange:u,innerWidthRef:this.handleBodySlotInnerWidth,slotWidth:m}),r.createElement(T,{dateProfile:e.dateProfile,tDateProfile:s,nowDate:o,todayRange:u,nextDayThreshold:l.nextDayThreshold,eventStore:e.eventStore,eventUiBases:e.eventUiBases,businessHours:e.businessHours,dateSelection:e.dateSelection,eventDrag:e.eventDrag,eventResize:e.eventResize,eventSelection:e.eventSelection,slotWidth:m}),p&&r.createElement(O,{tDateProfile:s,nowDate:o,slotWidth:m}))),f&&r.createElement(i.Scroller,{ref:this.footerScrollerRef,horizontal:!0},r.createElement("div",{style:{width:h}})))})}componentDidMount(){const{context:e}=this,{options:t}=e,n=i.getScrollerSyncerClass(this.context.pluginHooks);this.syncedScroller=new n(!0),this.updateSyncedScroller(),e.emitter.on("_timeScrollRequest",this.timeScrollResponder.handleScroll),this.timeScrollResponder.handleScroll(t.scrollTime)}componentDidUpdate(e){const{options:t}=this.context;this.updateSyncedScroller(),e.dateProfile!==this.props.dateProfile&&t.scrollTimeReset?this.timeScrollResponder.handleScroll(t.scrollTime):this.timeScrollResponder.drain()}componentWillUnmount(){this.syncedScroller.destroy(),this.context.emitter.off("_timeScrollRequest",this.timeScrollResponder.handleScroll)}updateSyncedScroller(){this.syncedScroller.handleChildren([this.headerScrollerRef.current,this.bodyScrollerRef.current,this.footerScrollerRef.current],this.context.isRtl)}queryHit(e,t,n,r){const{props:l,context:s,tDateProfile:a,slotWidth:o}=this,{dateEnv:c}=s;if(o){const t=s.isRtl?n-e:e,d=Math.floor(t/o),f=(t-d*o)/o,h=Math.floor(f*a.snapsPerSlot);let m,u,g=c.add(a.slotDates[d],i.multiplyDuration(a.snapDuration,h)),p=c.add(g,a.snapDuration),v=o/a.snapsPerSlot,S=d*o+v*h,R=S+v;return s.isRtl?(m=n-R,u=n-S):(m=S,u=R),{dateProfile:l.dateProfile,dateSpan:{range:{start:g,end:p},allDay:!a.isTimeScale},rect:{left:m,right:u,top:0,bottom:r},dayEl:this.bodyEl.querySelectorAll(".fc-timeline-slot")[d],layer:0}}return null}}i.injectStyles('.fc-timeline-slots{z-index:1}.fc-timeline-slot-minor{border-style:dotted}.fc-timeline-now-indicator-container{bottom:0;left:0;overflow:hidden;position:absolute;right:0;top:0;z-index:4}.fc-timeline-now-indicator-arrow,.fc-timeline-now-indicator-line{border-color:var(--fc-now-indicator-color);border-style:solid;pointer-events:none;position:absolute;top:0}.fc-timeline-now-indicator-arrow{border-left-color:transparent;border-right-color:transparent;border-width:6px 5px 0;margin:0 -5px}.fc-timeline-now-indicator-line{border-width:0 0 0 1px;bottom:0}.fc-timeline-events{z-index:3}.fc-timeline-events-overlap-enabled{padding-bottom:10px}.fc-timeline-event{border-radius:0;font-size:var(--fc-small-font-size);margin-bottom:1px;z-index:1}.fc-timeline-event.fc-event-mirror{z-index:2}.fc-direction-ltr .fc-timeline-event.fc-event-end{margin-right:1px}.fc-direction-rtl .fc-timeline-event.fc-event-end{margin-left:1px}.fc-timeline-event-spacious{margin-bottom:0;padding-bottom:5px;padding-top:5px}.fc-timeline-event .fc-event-inner{align-items:center;display:flex;flex-direction:row;padding:2px 1px}.fc-timeline-event:not(.fc-event-end) .fc-event-inner:after,.fc-timeline-event:not(.fc-event-start) .fc-event-inner:before{border-color:transparent #000;border-style:solid;border-width:5px;content:"";flex-grow:0;flex-shrink:0;height:0;margin:0 1px;opacity:.5;width:0}.fc-direction-ltr .fc-timeline-event:not(.fc-event-start) .fc-event-inner:before,.fc-direction-rtl .fc-timeline-event:not(.fc-event-end) .fc-event-inner:after{border-left:0}.fc-direction-ltr .fc-timeline-event:not(.fc-event-end) .fc-event-inner:after,.fc-direction-rtl .fc-timeline-event:not(.fc-event-start) .fc-event-inner:before{border-right:0}.fc-timeline-event .fc-event-time{font-weight:700}.fc-timeline-event .fc-event-time,.fc-timeline-event .fc-event-title{padding:0 2px}.fc-timeline-more-link{align-items:flex-start;background:var(--fc-more-link-bg-color);color:var(--fc-more-link-text-color);cursor:pointer;display:flex;flex-direction:column;font-size:var(--fc-small-font-size);padding:1px}.fc-direction-ltr .fc-timeline-more-link{margin-right:1px}.fc-direction-rtl .fc-timeline-more-link{margin-left:1px}.fc-timeline-more-link-inner{padding:2px}.fc-timeline-bg{bottom:0;left:0;position:absolute;right:0;top:0;z-index:2}.fc-timeline-bg .fc-non-business{z-index:1}.fc-timeline-bg .fc-bg-event{z-index:2}.fc-timeline-bg .fc-highlight{z-index:3}.fc-timeline-bg-harness{bottom:0;position:absolute;top:0}');var A=t.createPlugin({name:"@fullcalendar/timeline",premiumReleaseDate:"2024-10-01",deps:[s.default],initialView:"timelineDay",views:{timeline:{component:U,usesMinMaxTime:!0,eventResizableFromStart:!0},timelineDay:{type:"timeline",duration:{days:1}},timelineWeek:{type:"timeline",duration:{weeks:1}},timelineMonth:{type:"timeline",duration:{months:1}},timelineYear:{type:"timeline",duration:{years:1}}}}),F={__proto__:null,TimelineView:U,TimelineLane:T,TimelineLaneBg:W,TimelineSlats:g,buildTimelineDateProfile:o,createVerticalStyle:function(e){if(e)return{top:e.start,height:e.size}},createHorizontalStyle:function(e,t){if(e)return{[t?"right":"left"]:e.start,width:e.size}},computeSlotWidth:R,timeToCoord:D,coordToCss:function(e,t){return null===e?{left:"",right:""}:t?{right:e,left:""}:{left:e,right:""}},coordsToCss:function(e,t){return e?t?{right:e.start,left:-e.end}:{left:e.start,right:-e.end}:{left:"",right:""}},TimelineLaneSlicer:E,TimelineHeaderRow:N,TimelineNowIndicatorArrow:B,TimelineNowIndicatorLine:O};return t.globalPlugins.push(A),e.Internal=F,e.default=A,Object.defineProperty(e,"__esModule",{value:!0}),e}({},FullCalendar,FullCalendar.PremiumCommon,FullCalendar.Internal,FullCalendar.Preact);
+FullCalendar.Timeline=function(e,t,n,i,r,l){"use strict";function s(e){return e&&e.__esModule?e:{default:e}}var a=s(n);i.config.MAX_TIMELINE_SLOTS=1e3;const o=[{years:1},{months:1},{days:1},{hours:1},{minutes:30},{minutes:15},{minutes:10},{minutes:5},{minutes:1},{seconds:30},{seconds:15},{seconds:10},{seconds:5},{seconds:1},{milliseconds:500},{milliseconds:100},{milliseconds:10},{milliseconds:1}];function c(e,t,n,r){let l={labelInterval:n.slotLabelInterval,slotDuration:n.slotDuration};!function(e,t,n){const{currentRange:r}=t;if(e.labelInterval){n.countDurationsBetween(r.start,r.end,e.labelInterval)>i.config.MAX_TIMELINE_SLOTS&&(console.warn("slotLabelInterval results in too many cells"),e.labelInterval=null)}if(e.slotDuration){n.countDurationsBetween(r.start,r.end,e.slotDuration)>i.config.MAX_TIMELINE_SLOTS&&(console.warn("slotDuration results in too many cells"),e.slotDuration=null)}if(e.labelInterval&&e.slotDuration){const t=i.wholeDivideDurations(e.labelInterval,e.slotDuration);(null===t||t<1)&&(console.warn("slotLabelInterval must be a multiple of slotDuration"),e.slotDuration=null)}}(l,e,t),h(l,e,t),function(e,t,n){const{currentRange:r}=t;let{slotDuration:l}=e;if(!l){const s=h(e,t,n);for(let e of o){const t=i.createDuration(e),n=i.wholeDivideDurations(s,t);if(null!==n&&n>1&&n<=6){l=t;break}}if(l){n.countDurationsBetween(r.start,r.end,l)>200&&(l=null)}l||(l=s),e.slotDuration=l}}(l,e,t);let s=n.slotLabelFormat,a=Array.isArray(s)?s:null!=s?[s]:function(e,t,n,r){let l,s;const{labelInterval:a}=e;let o=i.greatestDurationDenominator(a).unit;const c=r.weekNumbers;let d=l=s=null;"week"!==o||c||(o="day");switch(o){case"year":d={year:"numeric"};break;case"month":m("years",t,n)>1&&(d={year:"numeric"}),l={month:"short"};break;case"week":m("years",t,n)>1&&(d={year:"numeric"}),l={week:"narrow"};break;case"day":m("years",t,n)>1?d={year:"numeric",month:"long"}:m("months",t,n)>1&&(d={month:"long"}),c&&(l={week:"short"}),s={weekday:"narrow",day:"numeric"};break;case"hour":c&&(d={week:"short"}),m("days",t,n)>1&&(l={weekday:"short",day:"numeric",month:"numeric",omitCommas:!0}),s={hour:"numeric",minute:"2-digit",omitZeroMinute:!0,meridiem:"short"};break;case"minute":i.asRoughMinutes(a)/60>=6?(d={hour:"numeric",meridiem:"short"},l=e=>":"+i.padStart(e.date.minute,2)):d={hour:"numeric",minute:"numeric",meridiem:"short"};break;case"second":i.asRoughSeconds(a)/60>=6?(d={hour:"numeric",minute:"2-digit",meridiem:"lowercase"},l=e=>":"+i.padStart(e.date.second,2)):d={hour:"numeric",minute:"2-digit",second:"2-digit",meridiem:"lowercase"};break;case"millisecond":d={hour:"numeric",minute:"2-digit",second:"2-digit",meridiem:"lowercase"},l=e=>"."+i.padStart(e.millisecond,3)}return[].concat(d||[],l||[],s||[])}(l,e,t,n);l.headerFormats=a.map(e=>i.createFormatter(e)),l.isTimeScale=Boolean(l.slotDuration.milliseconds);let c=null;if(!l.isTimeScale){const e=i.greatestDurationDenominator(l.slotDuration).unit;/year|month|week/.test(e)&&(c=e)}l.largeUnit=c,l.emphasizeWeeks=1===i.asCleanDays(l.slotDuration)&&m("weeks",e,t)>=2&&!n.businessHours;let g,p,v=n.snapDuration;v&&(g=i.createDuration(v),p=i.wholeDivideDurations(l.slotDuration,g)),null==p&&(g=l.slotDuration,p=1),l.snapDuration=g,l.snapsPerSlot=p;let S=i.asRoughMs(e.slotMaxTime)-i.asRoughMs(e.slotMinTime),R=d(e.renderRange.start,l,t),D=d(e.renderRange.end,l,t);l.isTimeScale&&(R=t.add(R,e.slotMinTime),D=t.add(i.addDays(D,-1),e.slotMaxTime)),l.timeWindowMs=S,l.normalizedRange={start:R,end:D};let y=[],w=R;for(;w<D;)f(w,l,e,r)&&y.push(w),w=t.add(w,l.slotDuration);l.slotDates=y;let b=-1,x=0;const E=[],W=[];for(w=R;w<D;)f(w,l,e,r)?(b+=1,E.push(b),W.push(x)):E.push(b+.5),w=t.add(w,l.snapDuration),x+=1;return l.snapDiffToIndex=E,l.snapIndexToDiff=W,l.snapCnt=b+1,l.slotCnt=l.snapCnt/l.snapsPerSlot,l.isWeekStarts=function(e,t){let{slotDates:n,emphasizeWeeks:i}=e,r=null,l=[];for(let e of n){let n=t.computeWeekNumber(e),s=i&&null!==r&&r!==n;r=n,l.push(s)}return l}(l,t),l.cellRows=function(e,t){let n=e.slotDates,r=e.headerFormats,l=r.map(()=>[]),s=i.asCleanDays(e.slotDuration),a=7===s?"week":1===s?"day":null,o=r.map(e=>e.getLargestUnit?e.getLargestUnit():null);for(let s=0;s<n.length;s+=1){let c=n[s],d=e.isWeekStarts[s];for(let n=0;n<r.length;n+=1){let s=r[n],f=l[n],h=f[f.length-1],m=n===r.length-1,g=r.length>1&&!m,p=null,v=o[n]||(m?a:null);if(g){let e=t.format(c,s);h&&h.text===e?h.colspan+=1:p=u(c,e,v)}else if(!h||i.isInt(t.countDurationsBetween(e.normalizedRange.start,c,e.labelInterval))){let e=t.format(c,s);p=u(c,e,v)}else h.colspan+=1;p&&(p.weekStart=d,f.push(p))}}return l}(l,t),l.slotsPerLabel=i.wholeDivideDurations(l.labelInterval,l.slotDuration),l}function d(e,t,n){let r=e;return t.isTimeScale||(r=i.startOfDay(r),t.largeUnit&&(r=n.startOf(r,t.largeUnit))),r}function f(e,t,n,r){if(r.isHiddenDay(e))return!1;if(t.isTimeScale){let r=i.startOfDay(e),l=e.valueOf()-r.valueOf()-i.asRoughMs(n.slotMinTime);return l=(l%864e5+864e5)%864e5,l<t.timeWindowMs}return!0}function h(e,t,n){const{currentRange:r}=t;let{labelInterval:l}=e;if(!l){let t;if(e.slotDuration){for(t of o){const n=i.createDuration(t),r=i.wholeDivideDurations(n,e.slotDuration);if(null!==r&&r<=6){l=n;break}}l||(l=e.slotDuration)}else for(t of o){l=i.createDuration(t);if(n.countDurationsBetween(r.start,r.end,l)>=18)break}e.labelInterval=l}return l}function m(e,t,n){let r=t.currentRange,l=null;return"years"===e?l=n.diffWholeYears(r.start,r.end):"months"===e||"weeks"===e?l=n.diffWholeMonths(r.start,r.end):"days"===e&&(l=i.diffWholeDays(r.start,r.end)),l||0}function u(e,t,n){return{date:e,text:t,rowUnit:n,colspan:1,isWeekStart:!1}}class g extends i.BaseComponent{constructor(){super(...arguments),this.innerElRef=r.createRef()}render(){let{props:e,context:t}=this,{dateEnv:n,options:l,theme:s}=t,{date:a,tDateProfile:o,isEm:c}=e,d=i.getDateMeta(e.date,e.todayRange,e.nowDate,e.dateProfile),f=Object.assign(Object.assign({date:n.toDate(e.date)},d),{view:t.viewApi});return r.createElement(i.ContentContainer,{elTag:"div",elClasses:["fc-flex-column","fc-align-start","fc-cell","fc-timeline-slot","fc-timeline-slot-lane",c?"fc-timeline-slot-em":"",o.isTimeScale?i.isInt(n.countDurationsBetween(o.normalizedRange.start,e.date,o.labelInterval))?"fc-timeline-slot-major":"fc-timeline-slot-minor":"",...e.isDay?i.getDayClassNames(d,s):i.getSlotClassNames(d,s)],elAttrs:{"data-date":n.formatIso(a,{omitTimeZoneOffset:!0,omitTime:!o.isTimeScale})},elStyle:{width:e.width},renderProps:f,generatorName:"slotLaneContent",customGenerator:l.slotLaneContent,classNameGenerator:l.slotLaneClassNames,didMount:l.slotLaneDidMount,willUnmount:l.slotLaneWillUnmount},e=>r.createElement("div",{ref:this.innerElRef,className:"fc-flex-column"},r.createElement(e,{elTag:"div",elClasses:["fc-cell-inner"]})))}componentDidMount(){const e=this.innerElRef.current;this.detachWidth=i.watchWidth(e,e=>{i.setRef(this.props.innerWidthRef,e)})}componentWillUnmount(){this.detachWidth(),i.setRef(this.props.innerWidthRef,null)}}class p extends i.BaseComponent{constructor(){super(...arguments),this.innerWidthRefMap=new i.RefMap(()=>{i.afterSize(this.handleInnerWidths)}),this.handleInnerWidths=()=>{const e=this.innerWidthRefMap.current;let t=0;for(const n of e.values())t=Math.max(t,n);i.setRef(this.props.innerWidthRef,t)}}render(){let{props:e,innerWidthRefMap:t}=this,{tDateProfile:n,slotWidth:i}=e,{slotDates:l,isWeekStarts:s}=n,a=!n.isTimeScale&&!n.largeUnit;return r.createElement("div",{className:"fc-timeline-slots fc-fill fc-flex-row"},l.map((l,o)=>{let c=l.toISOString();return r.createElement(g,{key:c,date:l,dateProfile:e.dateProfile,tDateProfile:n,nowDate:e.nowDate,todayRange:e.todayRange,isEm:s[o],isDay:a,innerWidthRef:t.createRef(c),width:i})}))}}function v(e,t,n){let r=n.countDurationsBetween(t.normalizedRange.start,e,t.snapDuration);if(r<0)return 0;if(r>=t.snapDiffToIndex.length)return t.snapCnt;let l=Math.floor(r),s=t.snapDiffToIndex[l];return i.isInt(s)?s+=r-l:s=Math.ceil(s),s}function S(e,t){return e?t?{right:e.start,width:e.size}:{left:e.start,width:e.size}:{}}function R(e,t){return t?{right:e}:{left:e}}function D(e,t,n,i,r){if(null==i||null==r)return[void 0,void 0,!1];const l=r/e;let s,a;return l>=(n=Math.max(n||0,(i+1)/t,30))?(s=!0,a=l):(s=!1,a=Math.max(n,l)),[a*e,a,s]}function y(e,t,n,r,l){let s=t.add(n.activeRange.start,e);return r.isTimeScale||(s=i.startOfDay(s)),w(s,t,r,l)}function w(e,t,n,r){return function(e,t,n){let r=n.countDurationsBetween(t.normalizedRange.start,e,t.snapDuration);if(r<0)return 0;if(r>=t.snapDiffToIndex.length)return t.snapCnt;let l=Math.floor(r),s=t.snapDiffToIndex[l];i.isInt(s)?s+=r-l:s=Math.ceil(s);return s}(e,n,t)/n.snapsPerSlot*r}function b(e,t,n,i,r){const l={};for(const s of e)l[s.eventRange.instance.instanceId]=x(s,t,n,i,r);return l}function x(e,t,n,i,r){const l=w(e.start,n,i,r);let s=w(e.end,n,i,r)-l;return t&&(s=Math.max(s,t)),{start:l,size:s}}function E(e,t,n){let i=0;for(const r of e){const{instanceId:e}=r.eventRange.instance,l=t[e],s=n.get(e);null!=l&&null!=s&&(i=Math.max(i,l+s))}return i}class W extends i.BaseComponent{render(){let{props:e}=this,t=[].concat(e.eventResizeSegs,e.dateSelectionSegs);return r.createElement("div",{className:"fc-timeline-bg"},this.renderSegs(e.businessHourSegs||[],"non-business"),this.renderSegs(e.bgEventSegs||[],"bg-event"),this.renderSegs(t,"highlight"))}renderSegs(e,t){let{tDateProfile:n,todayRange:l,nowDate:s,slotWidth:a}=this.props,{dateEnv:o,isRtl:c}=this.context;return r.createElement(r.Fragment,null,e.map(e=>{let d;if(null!=a){d=S(x(e,void 0,o,n,a),c)}return r.createElement("div",{key:i.buildEventRangeKey(e.eventRange),className:"fc-timeline-bg-harness",style:d},"bg-event"===t?r.createElement(i.BgEvent,Object.assign({eventRange:e.eventRange,isStart:e.isStart,isEnd:e.isEnd},i.getEventRangeMeta(e.eventRange,l,s))):i.renderFill(t))}))}}class M extends i.Slicer{sliceRange(e,t,n,r,l){let s=function(e,t,n){if(!t.isTimeScale&&(e=i.computeVisibleDayRange(e),t.largeUnit)){let i=e;((e={start:n.startOf(e.start,t.largeUnit),end:n.startOf(e.end,t.largeUnit)}).end.valueOf()!==i.end.valueOf()||e.end<=e.start)&&(e={start:e.start,end:n.add(e.end,t.slotDuration)})}return e}(e,r,l),a=[];if(v(s.start,r,l)<v(s.end,r,l)){let e=i.intersectRanges(s,r.normalizedRange);e&&a.push({start:e.start,end:e.end,isStart:e.start.valueOf()===s.start.valueOf()&&f(e.start,r,t,n),isEnd:e.end.valueOf()===s.end.valueOf()&&f(i.addMs(e.end,-1),r,t,n)})}return a}}const k=i.createFormatter({hour:"numeric",minute:"2-digit",omitZeroMinute:!0,meridiem:"narrow"});class I extends i.BaseComponent{render(){let{props:e,context:t}=this,{options:n}=t;return r.createElement(i.StandardEvent,Object.assign({},e,{elClasses:["fc-timeline-event","fc-h-event",!1===n.eventOverlap?"fc-timeline-event-spacious":""],defaultTimeFormat:k,defaultDisplayEventTime:!e.isTimeScale}))}}class T extends i.BaseComponent{render(){let{props:e}=this,{hiddenSegs:t,resourceId:n,forcedInvisibleMap:l}=e,s=n?{resourceId:n}:{};return r.createElement(i.MoreLinkContainer,{elClasses:["fc-timeline-more-link"],allDayDate:null,segs:t,hiddenSegs:t,dateProfile:e.dateProfile,todayRange:e.todayRange,extraDateSpan:s,popoverContent:()=>r.createElement(r.Fragment,null,t.map(t=>{let{eventRange:n}=t,s=n.instance.instanceId;return r.createElement("div",{key:s,style:{visibility:l[s]?"hidden":""}},r.createElement(I,Object.assign({isTimeScale:e.isTimeScale,eventRange:n,isStart:t.isStart,isEnd:t.isEnd,isDragging:!1,isResizing:!1,isDateSelecting:!1,isSelected:s===e.eventSelection},i.getEventRangeMeta(n,e.todayRange,e.nowDate))))}))},e=>r.createElement(e,{elTag:"div",elClasses:["fc-timeline-more-link-inner","fc-sticky-x"]}))}}class C extends r.Component{constructor(){super(...arguments),this.rootElRef=r.createRef()}render(){const{props:e}=this;return r.createElement("div",{className:"fc-abs",style:e.style,ref:this.rootElRef},e.children)}componentDidMount(){const e=this.rootElRef.current;this.detachHeight=i.watchHeight(e,e=>{i.setRef(this.props.heightRef,e)})}componentWillUnmount(){this.detachHeight(),i.setRef(this.props.heightRef,null)}}class P extends i.BaseComponent{constructor(){super(...arguments),this.sortEventSegs=i.memoize(i.sortEventSegs),this.segHeightRefMap=new i.RefMap(()=>{i.afterSize(this.handleSegHeights)}),this.moreLinkHeightRefMap=new i.RefMap(()=>{i.afterSize(this.handleMoreLinkHeights)}),this.slicer=new M,this.handleMoreLinkHeights=()=>{this.setState({moreLinkHeightRev:this.moreLinkHeightRefMap.rev})},this.handleSegHeights=()=>{this.setState({segHeightRev:this.segHeightRefMap.rev})}}render(){let{props:e,context:t,segHeightRefMap:n}=this,{options:l}=t,{dateProfile:s,tDateProfile:a}=e,o=this.slicer.sliceProps(e,s,a.isTimeScale?null:e.nextDayThreshold,t,s,t.dateProfileGenerator,a,t.dateEnv),c=(o.eventDrag?o.eventDrag.segs:null)||(o.eventResize?o.eventResize.segs:null)||[],d=this.sortEventSegs(o.fgEventSegs,l.eventOrder),f=null!=e.slotWidth?b(d,l.eventMinWidth,t.dateEnv,a,e.slotWidth):{},[h,m,u,g]=function(e,t,n,r,l){let s=[];for(let i=0;i<e.length;i+=1){let r=e[i],l=r.eventRange.instance.instanceId,a=n.get(l),o=t[l];null!=a&&null!=o&&s.push({index:i,seg:r,span:{start:o.start,end:o.start+o.size},thickness:a})}let a=new i.SegHierarchy;null!=r&&(a.strictOrder=r),null!=l&&(a.maxStackCnt=l);let o=a.addSegs(s),c=i.groupIntersectingEntries(o),d=c.map((t,n)=>({index:e.length+n,segGroup:t,span:t.span,thickness:1}));a.maxStackCnt=-1,a.addSegs(d);let f=a.toRects(),h={},m={};for(let e of f){const{seg:t,segGroup:n}=e;t?h[t.eventRange.instance.instanceId]=e.levelCoord:m[n.key]=e.levelCoord}return[h,E(e,h,n),c,m]}(d,f,n.current,l.eventOrderStrict,l.eventMaxStack),p=function(e,t,n){let i=0;for(const r of e){const e=t[r.key],l=n.get(r.key);null!=e&&null!=l&&(i=Math.max(i,e+l))}return i}(u,g,this.moreLinkHeightRefMap.current),v=Math.max(p,m),S=(o.eventDrag?o.eventDrag.affectedInstances:null)||(o.eventResize?o.eventResize.affectedInstances:null)||{};return r.createElement(r.Fragment,null,r.createElement(W,{tDateProfile:a,nowDate:e.nowDate,todayRange:e.todayRange,bgEventSegs:o.bgEventSegs,businessHourSegs:o.businessHourSegs,dateSelectionSegs:o.dateSelectionSegs,eventResizeSegs:o.eventResize?o.eventResize.segs:[],slotWidth:e.slotWidth}),r.createElement("div",{className:["fc-timeline-events","fc-content-box",!1===l.eventOverlap?"fc-timeline-events-overlap-disabled":"fc-timeline-events-overlap-enabled"].join(" "),style:{height:v}},this.renderFgSegs(d,f,h,S,u,g,!1,!1,!1),this.renderFgSegs(c,e.slotWidth?b(c,l.eventMinWidth,t.dateEnv,a,e.slotWidth):{},h,{},[],{},Boolean(o.eventDrag),Boolean(o.eventResize),!1)))}renderFgSegs(e,t,n,l,s,a,o,c,d){let{props:f,context:h,segHeightRefMap:m,moreLinkHeightRefMap:u}=this,g=o||c||d;return r.createElement(r.Fragment,null,e.map(e=>{const{eventRange:s}=e,{instanceId:a}=s.instance,u=n[a],p=t[a],v=g||p&&null!=u&&!l[a];return r.createElement(C,{key:a,style:Object.assign({visibility:v?"":"hidden",top:u||0},S(p,h.isRtl)),heightRef:g?void 0:m.createRef(a)},r.createElement(I,Object.assign({isTimeScale:f.tDateProfile.isTimeScale,eventRange:s,isStart:e.isStart,isEnd:e.isEnd,isDragging:o,isResizing:c,isDateSelecting:d,isSelected:a===f.eventSelection},i.getEventRangeMeta(s,f.todayRange,f.nowDate))))}),s.map(e=>r.createElement(C,{key:e.key,style:Object.assign({top:a[e.key]||0},S({start:e.span.start,size:e.span.end-e.span.start},h.isRtl)),heightRef:u.createRef(e.key)},r.createElement(T,{hiddenSegs:e.segs,dateProfile:f.dateProfile,nowDate:f.nowDate,todayRange:f.todayRange,isTimeScale:f.tDateProfile.isTimeScale,eventSelection:f.eventSelection,resourceId:f.resourceId,forcedInvisibleMap:l}))))}}class z extends i.BaseComponent{constructor(){super(...arguments),this.refineRenderProps=i.memoizeObjArg(N),this.buildCellNavLinkAttrs=i.memoize(L),this.innerElRef=r.createRef()}render(){let{props:e,context:t}=this,{dateEnv:n,options:l}=t,{cell:s,dateProfile:a,tDateProfile:o}=e,c=i.getDateMeta(s.date,e.todayRange,e.nowDate,a),d=this.refineRenderProps({level:e.rowLevel,dateMarker:s.date,text:s.text,dateEnv:t.dateEnv,viewApi:t.viewApi});return r.createElement(i.ContentContainer,{elTag:"div",elClasses:["fc-timeline-slot-label","fc-timeline-slot",s.isWeekStart?"fc-timeline-slot-em":"","fc-header-cell","fc-cell","fc-flex-column","fc-justify-center",e.isCentered?"fc-align-center":"fc-align-start",..."time"===s.rowUnit?i.getSlotClassNames(c,t.theme):i.getDayClassNames(c,t.theme)],elAttrs:{"data-date":n.formatIso(s.date,{omitTime:!o.isTimeScale,omitTimeZoneOffset:!0})},elStyle:{width:null!=e.slotWidth?e.slotWidth*s.colspan:void 0},renderProps:d,generatorName:"slotLabelContent",customGenerator:l.slotLabelContent,defaultGenerator:H,classNameGenerator:l.slotLabelClassNames,didMount:l.slotLabelDidMount,willUnmount:l.slotLabelWillUnmount},n=>r.createElement("div",{ref:this.innerElRef,className:["fc-flex-column",e.isSticky?"fc-sticky-x":""].join(" ")},r.createElement(n,{elTag:"a",elClasses:["fc-cell-inner","fc-padding-md"],elAttrs:this.buildCellNavLinkAttrs(t,s.date,s.rowUnit)})))}componentDidMount(){const{props:e}=this,t=this.innerElRef.current;this.detachSize=i.watchSize(t,(n,r)=>{i.setRef(e.innerWidthRef,n),i.setRef(e.innerHeightRef,r),t.style.left=t.style.right=e.isCentered&&e.isSticky?`calc(50% - ${n/2}px)`:""})}componentWillUnmount(){const{props:e}=this;this.detachSize(),i.setRef(e.innerWidthRef,null),i.setRef(e.innerHeightRef,null)}}function L(e,t,n){return n&&"time"!==n?i.buildNavLinkAttrs(e,t,n):{}}function H(e){return e.text}function N(e){return{level:e.level,date:e.dateEnv.toDate(e.dateMarker),view:e.viewApi,text:e.text}}class O extends i.BaseComponent{constructor(){super(...arguments),this.innerWidthRefMap=new i.RefMap(()=>{i.afterSize(this.handleInnerWidths)}),this.innerHeightRefMap=new i.RefMap(()=>{i.afterSize(this.handleInnerHeights)}),this.handleInnerWidths=()=>{const e=this.innerWidthRefMap.current;let t=0;for(const n of e.values())t=Math.max(t,n);i.setRef(this.props.innerWidthRef,t)},this.handleInnerHeights=()=>{const e=this.innerHeightRefMap.current;let t=0;for(const n of e.values())t=Math.max(t,n);i.setRef(this.props.innerHeighRef,t)}}render(){const{props:e,innerWidthRefMap:t,innerHeightRefMap:n}=this,i=!(e.tDateProfile.isTimeScale&&e.isLastRow),l=!e.isLastRow;return r.createElement("div",{className:"fc-row",style:{height:e.height}},e.cells.map(s=>{const a=s.rowUnit+":"+s.date.toISOString();return r.createElement(z,{key:a,cell:s,rowLevel:e.rowLevel,dateProfile:e.dateProfile,tDateProfile:e.tDateProfile,todayRange:e.todayRange,nowDate:e.nowDate,isCentered:i,isSticky:l,innerWidthRef:t.createRef(a),innerHeightRef:n.createRef(a),slotWidth:e.slotWidth})}))}componentWillUnmount(){i.setRef(this.props.innerWidthRef,null),i.setRef(this.props.innerHeighRef,null)}}class B extends i.BaseComponent{render(){const{props:e,context:t}=this;return r.createElement("div",{className:"fc-timeline-now-indicator-container"},r.createElement(i.NowIndicatorContainer,{elClasses:["fc-timeline-now-indicator-line"],elStyle:null!=e.slotWidth?R(w(e.nowDate,t.dateEnv,e.tDateProfile,e.slotWidth),t.isRtl):{},isAxis:!1,date:e.nowDate}))}}class U extends i.BaseComponent{render(){const{props:e,context:t}=this;return r.createElement("div",{className:"fc-timeline-now-indicator-container"},r.createElement(i.NowIndicatorContainer,{elClasses:["fc-timeline-now-indicator-arrow"],elStyle:null!=e.slotWidth?R(w(e.nowDate,t.dateEnv,e.tDateProfile,e.slotWidth),t.isRtl):{},isAxis:!0,date:e.nowDate}))}}class F extends i.DateComponent{constructor(){super(...arguments),this.buildTimelineDateProfile=i.memoize(c),this.computeSlotWidth=i.memoize(D),this.headerScrollerRef=r.createRef(),this.bodyScrollerRef=r.createRef(),this.footerScrollerRef=r.createRef(),this.headerRowInnerWidthMap=new i.RefMap(()=>{i.afterSize(this.handleSlotInnerWidths)}),this.scrollTime=null,this.handleBodySlotInnerWidth=e=>{this.bodySlotInnerWidth=e,i.afterSize(this.handleSlotInnerWidths)},this.handleSlotInnerWidths=()=>{const{state:e}=this,t=Math.max(this.headerRowInnerWidthMap.current.get(this.tDateProfile.cellRows.length-1)||0,this.bodySlotInnerWidth);e.slotInnerWidth!==t&&this.setState({slotInnerWidth:t})},this.handleScrollerWidth=e=>{this.setState({scrollerWidth:e})},this.handleLeftScrollbarWidth=e=>{this.setState({leftScrollbarWidth:e})},this.handleRightScrollbarWidth=e=>{this.setState({rightScrollbarWidth:e})},this.handleTimeScroll=e=>{this.scrollTime=e,this.updateScroll()},this.updateScroll=()=>{const{props:e,context:t,tDateProfile:n,scrollTime:i,slotWidth:r}=this;if(null!=i&&null!=r){let l=y(i,t.dateEnv,e.dateProfile,n,r);l&&(l+=t.isRtl?-1:1),this.syncedScroller.scrollTo({x:l})}},this.clearScroll=()=>{this.scrollTime=null},this.handeBodyEl=e=>{this.bodyEl=e,e?this.context.registerInteractiveComponent(this,{el:e}):this.context.unregisterInteractiveComponent(this)}}render(){const{props:e,state:t,context:n}=this,{options:l}=n,s=this.tDateProfile=this.buildTimelineDateProfile(e.dateProfile,n.dateEnv,l,n.dateProfileGenerator),{cellRows:a}=s,o=i.greatestDurationDenominator(s.slotDuration).unit,c=!e.forPrint&&!i.getIsHeightAuto(l),d=!e.forPrint&&i.getStickyHeaderDates(l),f=!e.forPrint&&i.getStickyFooterScrollbar(l),[h,m]=this.computeSlotWidth(s.slotCnt,s.slotsPerLabel,l.slotMinWidth,t.slotInnerWidth,t.scrollerWidth);return this.slotWidth=m,r.createElement(i.NowTimer,{unit:o},(o,u)=>{const g=l.nowIndicator&&null!=m&&i.rangeContainsMarker(e.dateProfile.currentRange,o);return r.createElement(i.ViewContainer,{viewSpec:n.viewSpec,elClasses:["fc-timeline-view","fc-flex-column","fc-border"]},r.createElement(i.Scroller,{horizontal:!0,hideScrollbars:!0,elClassNames:["fc-timeline-header","fc-rowgroup",d?"fc-sticky-header":""],ref:this.headerScrollerRef},r.createElement("div",{className:"fc-rel fc-content-box",style:{width:h,paddingLeft:t.leftScrollbarWidth,paddingRight:t.rightScrollbarWidth}},r.createElement("div",null,a.map((t,n)=>{const i=n===a.length-1;return r.createElement(O,{key:n,dateProfile:e.dateProfile,tDateProfile:s,nowDate:o,todayRange:u,rowLevel:n,isLastRow:i,cells:t,slotWidth:m,innerWidthRef:this.headerRowInnerWidthMap.createRef(n)})})),g&&r.createElement(U,{tDateProfile:s,nowDate:o,slotWidth:m}))),r.createElement(i.Scroller,{vertical:c,horizontal:!0,elClassNames:["fc-timeline-body","fc-rowgroup",c?"fc-liquid":""],ref:this.bodyScrollerRef,widthRef:this.handleScrollerWidth,leftScrollbarWidthRef:this.handleLeftScrollbarWidth,rightScrollbarWidthRef:this.handleRightScrollbarWidth},r.createElement("div",{className:"fc-rel fc-grow",style:{width:h},ref:this.handeBodyEl},r.createElement(p,{dateProfile:e.dateProfile,tDateProfile:s,nowDate:o,todayRange:u,innerWidthRef:this.handleBodySlotInnerWidth,slotWidth:m}),r.createElement(P,{dateProfile:e.dateProfile,tDateProfile:s,nowDate:o,todayRange:u,nextDayThreshold:l.nextDayThreshold,eventStore:e.eventStore,eventUiBases:e.eventUiBases,businessHours:e.businessHours,dateSelection:e.dateSelection,eventDrag:e.eventDrag,eventResize:e.eventResize,eventSelection:e.eventSelection,slotWidth:m}),g&&r.createElement(B,{tDateProfile:s,nowDate:o,slotWidth:m}))),f&&r.createElement(i.Scroller,{ref:this.footerScrollerRef,horizontal:!0},r.createElement("div",{style:{width:h}})))})}componentDidMount(){this.syncedScroller=new l.ScrollerSyncer(!0),this.updateSyncedScroller(),this.resetScroll(),this.context.emitter.on("_timeScrollRequest",this.handleTimeScroll),this.syncedScroller.addScrollEndListener(this.clearScroll)}componentDidUpdate(e){this.updateSyncedScroller(),e.dateProfile!==this.props.dateProfile&&this.context.options.scrollTimeReset?this.resetScroll():this.updateScroll()}componentWillUnmount(){this.syncedScroller.destroy(),this.context.emitter.off("_timeScrollRequest",this.handleTimeScroll),this.syncedScroller.removeScrollEndListener(this.clearScroll)}updateSyncedScroller(){this.syncedScroller.handleChildren([this.headerScrollerRef.current,this.bodyScrollerRef.current,this.footerScrollerRef.current])}resetScroll(){this.handleTimeScroll(this.context.options.scrollTime)}queryHit(e,t,n,r){const{props:l,context:s,tDateProfile:a,slotWidth:o}=this,{dateEnv:c}=s;if(o){const t=s.isRtl?n-e:e,d=Math.floor(t/o),f=(t-d*o)/o,h=Math.floor(f*a.snapsPerSlot);let m,u,g=c.add(a.slotDates[d],i.multiplyDuration(a.snapDuration,h)),p=c.add(g,a.snapDuration),v=o/a.snapsPerSlot,S=d*o+v*h,R=S+v;return s.isRtl?(m=n-R,u=n-S):(m=S,u=R),{dateProfile:l.dateProfile,dateSpan:{range:{start:g,end:p},allDay:!a.isTimeScale},rect:{left:m,right:u,top:0,bottom:r},dayEl:this.bodyEl.querySelectorAll(".fc-timeline-slot")[d],layer:0}}return null}}i.injectStyles('.fc-timeline-slots{z-index:1}.fc-timeline-slot-minor{border-style:dotted}.fc-timeline-now-indicator-container{bottom:0;left:0;overflow:hidden;position:absolute;right:0;top:0;z-index:4}.fc-timeline-now-indicator-arrow,.fc-timeline-now-indicator-line{border-color:var(--fc-now-indicator-color);border-style:solid;pointer-events:none;position:absolute;top:0}.fc-timeline-now-indicator-arrow{border-left-color:transparent;border-right-color:transparent;border-width:6px 5px 0;margin:0 -5px}.fc-timeline-now-indicator-line{border-width:0 0 0 1px;bottom:0}.fc-timeline-events{z-index:3}.fc-timeline-events-overlap-enabled{padding-bottom:10px}.fc-timeline-event{border-radius:0;font-size:var(--fc-small-font-size);margin-bottom:1px;z-index:1}.fc-timeline-event.fc-event-mirror{z-index:2}.fc-direction-ltr .fc-timeline-event.fc-event-end{margin-right:1px}.fc-direction-rtl .fc-timeline-event.fc-event-end{margin-left:1px}.fc-timeline-event-spacious{margin-bottom:0;padding-bottom:5px;padding-top:5px}.fc-timeline-event .fc-event-inner{align-items:center;display:flex;flex-direction:row;padding:2px 1px}.fc-timeline-event:not(.fc-event-end) .fc-event-inner:after,.fc-timeline-event:not(.fc-event-start) .fc-event-inner:before{border-color:transparent #000;border-style:solid;border-width:5px;content:"";flex-grow:0;flex-shrink:0;height:0;margin:0 1px;opacity:.5;width:0}.fc-direction-ltr .fc-timeline-event:not(.fc-event-start) .fc-event-inner:before,.fc-direction-rtl .fc-timeline-event:not(.fc-event-end) .fc-event-inner:after{border-left:0}.fc-direction-ltr .fc-timeline-event:not(.fc-event-end) .fc-event-inner:after,.fc-direction-rtl .fc-timeline-event:not(.fc-event-start) .fc-event-inner:before{border-right:0}.fc-timeline-event .fc-event-time{font-weight:700}.fc-timeline-event .fc-event-time,.fc-timeline-event .fc-event-title{padding:0 2px}.fc-timeline-more-link{align-items:flex-start;background:var(--fc-more-link-bg-color);color:var(--fc-more-link-text-color);cursor:pointer;display:flex;flex-direction:column;font-size:var(--fc-small-font-size);padding:1px}.fc-direction-ltr .fc-timeline-more-link{margin-right:1px}.fc-direction-rtl .fc-timeline-more-link{margin-left:1px}.fc-timeline-more-link-inner{padding:2px}.fc-timeline-bg{bottom:0;left:0;position:absolute;right:0;top:0;z-index:2}.fc-timeline-bg .fc-non-business{z-index:1}.fc-timeline-bg .fc-bg-event{z-index:2}.fc-timeline-bg .fc-highlight{z-index:3}.fc-timeline-bg-harness{bottom:0;position:absolute;top:0}');var A=t.createPlugin({name:"@fullcalendar/timeline",premiumReleaseDate:"2024-10-09",deps:[a.default],initialView:"timelineDay",views:{timeline:{component:F,usesMinMaxTime:!0,eventResizableFromStart:!0},timelineDay:{type:"timeline",duration:{days:1}},timelineWeek:{type:"timeline",duration:{weeks:1}},timelineMonth:{type:"timeline",duration:{months:1}},timelineYear:{type:"timeline",duration:{years:1}}}}),_={__proto__:null,TimelineView:F,TimelineLane:P,TimelineLaneBg:W,TimelineSlats:p,buildTimelineDateProfile:c,createVerticalStyle:function(e){if(e)return{top:e.start,height:e.size}},createHorizontalStyle:function(e,t){if(e)return{[t?"right":"left"]:e.start,width:e.size}},computeSlotWidth:D,timeToCoord:y,coordToCss:function(e,t){return null===e?{left:"",right:""}:t?{right:e,left:""}:{left:e,right:""}},coordsToCss:function(e,t){return e?t?{right:e.start,left:-e.end}:{left:e.start,right:-e.end}:{left:"",right:""}},TimelineLaneSlicer:M,TimelineHeaderRow:O,TimelineNowIndicatorArrow:U,TimelineNowIndicatorLine:B};return t.globalPlugins.push(A),e.Internal=_,e.default=A,Object.defineProperty(e,"__esModule",{value:!0}),e}({},FullCalendar,FullCalendar.PremiumCommon,FullCalendar.Internal,FullCalendar.Preact,FullCalendar.ScrollGrid.Internal);

package/index.js

@@ -3,10 +3,11 @@ import premiumCommonPlugin from '@fullcalendar/premium-common/index.js';
 import { TimelineView } from './internal.js';
 import '@fullcalendar/core/internal.js';
 import '@fullcalendar/core/preact.js';
+import '@fullcalendar/scrollgrid/internal.js';
 
 var index = createPlugin({
     name: '@fullcalendar/timeline',
-    premiumReleaseDate: '2024-10-01',
+    premiumReleaseDate: '2024-10-09',
     deps: [premiumCommonPlugin],
     initialView: 'timelineDay',
     views: {

package/internal.cjs

@@ -4,9 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var internal_cjs = require('@fullcalendar/core/internal.cjs');
 var preact_cjs = require('@fullcalendar/core/preact.cjs');
-
-var css_248z = ".fc-timeline-slots{z-index:1}.fc-timeline-slot-minor{border-style:dotted}.fc-timeline-now-indicator-container{bottom:0;left:0;overflow:hidden;position:absolute;right:0;top:0;z-index:4}.fc-timeline-now-indicator-arrow,.fc-timeline-now-indicator-line{border-color:var(--fc-now-indicator-color);border-style:solid;pointer-events:none;position:absolute;top:0}.fc-timeline-now-indicator-arrow{border-left-color:transparent;border-right-color:transparent;border-width:6px 5px 0;margin:0 -5px}.fc-timeline-now-indicator-line{border-width:0 0 0 1px;bottom:0}.fc-timeline-events{z-index:3}.fc-timeline-events-overlap-enabled{padding-bottom:10px}.fc-timeline-event{border-radius:0;font-size:var(--fc-small-font-size);margin-bottom:1px;z-index:1}.fc-timeline-event.fc-event-mirror{z-index:2}.fc-direction-ltr .fc-timeline-event.fc-event-end{margin-right:1px}.fc-direction-rtl .fc-timeline-event.fc-event-end{margin-left:1px}.fc-timeline-event-spacious{margin-bottom:0;padding-bottom:5px;padding-top:5px}.fc-timeline-event .fc-event-inner{align-items:center;display:flex;flex-direction:row;padding:2px 1px}.fc-timeline-event:not(.fc-event-end) .fc-event-inner:after,.fc-timeline-event:not(.fc-event-start) .fc-event-inner:before{border-color:transparent #000;border-style:solid;border-width:5px;content:\"\";flex-grow:0;flex-shrink:0;height:0;margin:0 1px;opacity:.5;width:0}.fc-direction-ltr .fc-timeline-event:not(.fc-event-start) .fc-event-inner:before,.fc-direction-rtl .fc-timeline-event:not(.fc-event-end) .fc-event-inner:after{border-left:0}.fc-direction-ltr .fc-timeline-event:not(.fc-event-end) .fc-event-inner:after,.fc-direction-rtl .fc-timeline-event:not(.fc-event-start) .fc-event-inner:before{border-right:0}.fc-timeline-event .fc-event-time{font-weight:700}.fc-timeline-event .fc-event-time,.fc-timeline-event .fc-event-title{padding:0 2px}.fc-timeline-more-link{align-items:flex-start;background:var(--fc-more-link-bg-color);color:var(--fc-more-link-text-color);cursor:pointer;display:flex;flex-direction:column;font-size:var(--fc-small-font-size);padding:1px}.fc-direction-ltr .fc-timeline-more-link{margin-right:1px}.fc-direction-rtl .fc-timeline-more-link{margin-left:1px}.fc-timeline-more-link-inner{padding:2px}.fc-timeline-bg{bottom:0;left:0;position:absolute;right:0;top:0;z-index:2}.fc-timeline-bg .fc-non-business{z-index:1}.fc-timeline-bg .fc-bg-event{z-index:2}.fc-timeline-bg .fc-highlight{z-index:3}.fc-timeline-bg-harness{bottom:0;position:absolute;top:0}";
-internal_cjs.injectStyles(css_248z);
+var internal_cjs$1 = require('@fullcalendar/scrollgrid/internal.cjs');
 
 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
@@ -490,6 +488,7 @@ class TimelineSlatCell extends internal_cjs.BaseComponent {
     }
     componentWillUnmount() {
         this.detachWidth();
+        internal_cjs.setRef(this.props.innerWidthRef, null);
     }
 }
 
@@ -794,8 +793,7 @@ class TimelineLaneBg extends internal_cjs.BaseComponent {
                 hStyle = horizontalsToCss(segHorizontal, isRtl);
             }
             return (preact_cjs.createElement("div", { key: internal_cjs.buildEventRangeKey(seg.eventRange), className: "fc-timeline-bg-harness", style: hStyle }, fillType === 'bg-event' ?
-                preact_cjs.createElement(internal_cjs.BgEvent, Object.assign({ seg: seg }, internal_cjs.getSegMeta(seg, todayRange, nowDate))) :
-                internal_cjs.renderFill(fillType)));
+                preact_cjs.createElement(internal_cjs.BgEvent, Object.assign({ eventRange: seg.eventRange, isStart: seg.isStart, isEnd: seg.isEnd }, internal_cjs.getEventRangeMeta(seg.eventRange, todayRange, nowDate))) : (internal_cjs.renderFill(fillType))));
         })));
     }
 }
@@ -850,9 +848,10 @@ class TimelineLaneMoreLink extends internal_cjs.BaseComponent {
         let { hiddenSegs, resourceId, forcedInvisibleMap } = props;
         let extraDateSpan = resourceId ? { resourceId } : {};
         return (preact_cjs.createElement(internal_cjs.MoreLinkContainer, { elClasses: ['fc-timeline-more-link'], allDayDate: null, segs: hiddenSegs, hiddenSegs: hiddenSegs, dateProfile: props.dateProfile, todayRange: props.todayRange, extraDateSpan: extraDateSpan, popoverContent: () => (preact_cjs.createElement(preact_cjs.Fragment, null, hiddenSegs.map((seg) => {
-                let instanceId = seg.eventRange.instance.instanceId;
+                let { eventRange } = seg;
+                let instanceId = eventRange.instance.instanceId;
                 return (preact_cjs.createElement("div", { key: instanceId, style: { visibility: forcedInvisibleMap[instanceId] ? 'hidden' : '' } },
-                    preact_cjs.createElement(TimelineEvent, Object.assign({ isTimeScale: props.isTimeScale, seg: seg, isDragging: false, isResizing: false, isDateSelecting: false, isSelected: instanceId === props.eventSelection }, internal_cjs.getSegMeta(seg, props.todayRange, props.nowDate)))));
+                    preact_cjs.createElement(TimelineEvent, Object.assign({ isTimeScale: props.isTimeScale, eventRange: eventRange, isStart: seg.isStart, isEnd: seg.isEnd, isDragging: false, isResizing: false, isDateSelecting: false, isSelected: instanceId === props.eventSelection }, internal_cjs.getEventRangeMeta(eventRange, props.todayRange, props.nowDate)))));
             }))) }, (InnerContent) => (preact_cjs.createElement(InnerContent, { elTag: "div", elClasses: ['fc-timeline-more-link-inner', 'fc-sticky-x'] }))));
     }
 }
@@ -878,6 +877,7 @@ class TimelineEventHarness extends preact_cjs.Component {
     }
     componentWillUnmount() {
         this.detachHeight();
+        internal_cjs.setRef(this.props.heightRef, null);
     }
 }
 
@@ -955,13 +955,14 @@ class TimelineLane extends internal_cjs.BaseComponent {
         let isMirror = isDragging || isResizing || isDateSelecting;
         return (preact_cjs.createElement(preact_cjs.Fragment, null,
             segs.map((seg) => {
-                const { instanceId } = seg.eventRange.instance;
+                const { eventRange } = seg;
+                const { instanceId } = eventRange.instance;
                 const segTop = segTops[instanceId];
                 const segHorizontal = segHorizontals[instanceId];
                 const isVisible = isMirror ||
                     (segHorizontal && segTop != null && !forcedInvisibleMap[instanceId]);
                 return (preact_cjs.createElement(TimelineEventHarness, { key: instanceId, style: Object.assign({ visibility: isVisible ? '' : 'hidden', top: segTop || 0 }, horizontalsToCss(segHorizontal, context.isRtl)), heightRef: isMirror ? undefined : segHeightRefMap.createRef(instanceId) },
-                    preact_cjs.createElement(TimelineEvent, Object.assign({ isTimeScale: props.tDateProfile.isTimeScale, seg: seg, isDragging: isDragging, isResizing: isResizing, isDateSelecting: isDateSelecting, isSelected: instanceId === props.eventSelection /* TODO: bad for mirror? */ }, internal_cjs.getSegMeta(seg, props.todayRange, props.nowDate)))));
+                    preact_cjs.createElement(TimelineEvent, Object.assign({ isTimeScale: props.tDateProfile.isTimeScale, eventRange: eventRange, isStart: seg.isStart, isEnd: seg.isEnd, isDragging: isDragging, isResizing: isResizing, isDateSelecting: isDateSelecting, isSelected: instanceId === props.eventSelection /* TODO: bad for mirror? */ }, internal_cjs.getEventRangeMeta(eventRange, props.todayRange, props.nowDate)))));
             }),
             hiddenGroups.map((hiddenGroup) => (preact_cjs.createElement(TimelineEventHarness, { key: hiddenGroup.key, style: Object.assign({ top: hiddenGroupTops[hiddenGroup.key] || 0 }, horizontalsToCss({
                     start: hiddenGroup.span.start,
@@ -979,7 +980,6 @@ class TimelineHeaderCell extends internal_cjs.BaseComponent {
         this.buildCellNavLinkAttrs = internal_cjs.memoize(buildCellNavLinkAttrs);
         // ref
         this.innerElRef = preact_cjs.createRef();
-        // TODO: unset width/height ref on unmount?
     }
     render() {
         let { props, context } = this;
@@ -1041,7 +1041,10 @@ class TimelineHeaderCell extends internal_cjs.BaseComponent {
         });
     }
     componentWillUnmount() {
+        const { props } = this;
         this.detachSize();
+        internal_cjs.setRef(props.innerWidthRef, null);
+        internal_cjs.setRef(props.innerHeightRef, null);
     }
 }
 // Utils
@@ -1100,6 +1103,7 @@ class TimelineHeaderRow extends internal_cjs.BaseComponent {
             // TODO: make this part of the cell obj?
             // TODO: rowUnit seems wrong sometimes. says 'month' when it should be day
             // TODO: rowUnit is relevant to whole row. put it on a row object, not the cells
+            // TODO: use rowUnit to key the Row itself?
             const key = cell.rowUnit + ':' + cell.date.toISOString();
             return (preact_cjs.createElement(TimelineHeaderCell, { key: key, cell: cell, rowLevel: props.rowLevel, dateProfile: props.dateProfile, tDateProfile: props.tDateProfile, todayRange: props.todayRange, nowDate: props.nowDate, isCentered: isCentered, isSticky: isSticky, 
                 // refs
@@ -1108,6 +1112,10 @@ class TimelineHeaderRow extends internal_cjs.BaseComponent {
                 slotWidth: props.slotWidth }));
         })));
     }
+    componentWillUnmount() {
+        internal_cjs.setRef(this.props.innerWidthRef, null);
+        internal_cjs.setRef(this.props.innerHeighRef, null);
+    }
 }
 
 class TimelineNowIndicatorLine extends internal_cjs.BaseComponent {
@@ -1141,19 +1149,19 @@ class TimelineView extends internal_cjs.DateComponent {
         this.headerScrollerRef = preact_cjs.createRef();
         this.bodyScrollerRef = preact_cjs.createRef();
         this.footerScrollerRef = preact_cjs.createRef();
+        this.headerRowInnerWidthMap = new internal_cjs.RefMap(() => {
+            internal_cjs.afterSize(this.handleSlotInnerWidths);
+        });
+        this.scrollTime = null;
         // Sizing
         // -----------------------------------------------------------------------------------------------
-        this.handleHeaderSlotInnerWidth = (innerWidth) => {
-            this.headerSlotInnerWidth = innerWidth;
-            internal_cjs.afterSize(this.handleSlotInnerWidths);
-        };
         this.handleBodySlotInnerWidth = (innerWidth) => {
             this.bodySlotInnerWidth = innerWidth;
             internal_cjs.afterSize(this.handleSlotInnerWidths);
         };
         this.handleSlotInnerWidths = () => {
             const { state } = this;
-            const slotInnerWidth = Math.max(this.headerSlotInnerWidth, this.bodySlotInnerWidth);
+            const slotInnerWidth = Math.max(this.headerRowInnerWidthMap.current.get(this.tDateProfile.cellRows.length - 1) || 0, this.bodySlotInnerWidth);
             if (state.slotInnerWidth !== slotInnerWidth) {
                 this.setState({ slotInnerWidth });
             }
@@ -1173,16 +1181,23 @@ class TimelineView extends internal_cjs.DateComponent {
                 rightScrollbarWidth
             });
         };
-        this.timeScrollResponder = new internal_cjs.ScrollResponder((time) => {
-            const { props, context, tDateProfile, slotWidth } = this;
-            if (slotWidth != null) {
-                const x = timeToCoord(time, context.dateEnv, props.dateProfile, tDateProfile, slotWidth) +
-                    (context.isRtl ? -1 : 1); // overcome border. TODO: DRY this up
+        this.handleTimeScroll = (scrollTime) => {
+            this.scrollTime = scrollTime;
+            this.updateScroll();
+        };
+        this.updateScroll = () => {
+            const { props, context, tDateProfile, scrollTime, slotWidth } = this;
+            if (scrollTime != null && slotWidth != null) {
+                let x = timeToCoord(scrollTime, context.dateEnv, props.dateProfile, tDateProfile, slotWidth);
+                if (x) {
+                    x += context.isRtl ? -1 : 1; // overcome border. TODO: DRY this up
+                }
                 this.syncedScroller.scrollTo({ x });
-                return true;
             }
-            return false;
-        });
+        };
+        this.clearScroll = () => {
+            this.scrollTime = null;
+        };
         // Hit System
         // -----------------------------------------------------------------------------------------------
         this.handeBodyEl = (el) => {
@@ -1233,7 +1248,7 @@ class TimelineView extends internal_cjs.DateComponent {
                         } },
                         preact_cjs.createElement("div", null, cellRows.map((cells, rowLevel) => {
                             const isLast = rowLevel === cellRows.length - 1;
-                            return (preact_cjs.createElement(TimelineHeaderRow, { key: rowLevel, dateProfile: props.dateProfile, tDateProfile: tDateProfile, nowDate: nowDate, todayRange: todayRange, rowLevel: rowLevel, isLastRow: isLast, cells: cells, slotWidth: slotWidth, innerWidthRef: isLast ? this.handleHeaderSlotInnerWidth : undefined }));
+                            return (preact_cjs.createElement(TimelineHeaderRow, { key: rowLevel, dateProfile: props.dateProfile, tDateProfile: tDateProfile, nowDate: nowDate, todayRange: todayRange, rowLevel: rowLevel, isLastRow: isLast, cells: cells, slotWidth: slotWidth, innerWidthRef: this.headerRowInnerWidthMap.createRef(rowLevel) }));
                         })),
                         enableNowIndicator && (
                         // TODO: make this positioned WITHIN padding?
@@ -1260,27 +1275,26 @@ class TimelineView extends internal_cjs.DateComponent {
     // Lifecycle
     // -----------------------------------------------------------------------------------------------
     componentDidMount() {
-        const { context } = this;
-        const { options } = context;
-        const ScrollerSyncer = internal_cjs.getScrollerSyncerClass(this.context.pluginHooks);
-        this.syncedScroller = new ScrollerSyncer(true); // horizontal=true
+        this.syncedScroller = new internal_cjs$1.ScrollerSyncer(true); // horizontal=true
         this.updateSyncedScroller();
-        context.emitter.on('_timeScrollRequest', this.timeScrollResponder.handleScroll);
-        this.timeScrollResponder.handleScroll(options.scrollTime);
+        this.resetScroll();
+        this.context.emitter.on('_timeScrollRequest', this.handleTimeScroll);
+        this.syncedScroller.addScrollEndListener(this.clearScroll);
     }
     componentDidUpdate(prevProps) {
-        const { options } = this.context;
         this.updateSyncedScroller();
-        if (prevProps.dateProfile !== this.props.dateProfile && options.scrollTimeReset) {
-            this.timeScrollResponder.handleScroll(options.scrollTime);
+        if (prevProps.dateProfile !== this.props.dateProfile && this.context.options.scrollTimeReset) {
+            this.resetScroll();
         }
         else {
-            this.timeScrollResponder.drain();
+            // TODO: inefficient to update so often
+            this.updateScroll();
         }
     }
     componentWillUnmount() {
         this.syncedScroller.destroy();
-        this.context.emitter.off('_timeScrollRequest', this.timeScrollResponder.handleScroll);
+        this.context.emitter.off('_timeScrollRequest', this.handleTimeScroll);
+        this.syncedScroller.removeScrollEndListener(this.clearScroll);
     }
     // Scrolling
     // -----------------------------------------------------------------------------------------------
@@ -1289,7 +1303,10 @@ class TimelineView extends internal_cjs.DateComponent {
             this.headerScrollerRef.current,
             this.bodyScrollerRef.current,
             this.footerScrollerRef.current
-        ], this.context.isRtl);
+        ]);
+    }
+    resetScroll() {
+        this.handleTimeScroll(this.context.options.scrollTime);
     }
     queryHit(positionLeft, positionTop, elWidth, elHeight) {
         const { props, context, tDateProfile, slotWidth } = this;
@@ -1336,6 +1353,9 @@ class TimelineView extends internal_cjs.DateComponent {
     }
 }
 
+var css_248z = ".fc-timeline-slots{z-index:1}.fc-timeline-slot-minor{border-style:dotted}.fc-timeline-now-indicator-container{bottom:0;left:0;overflow:hidden;position:absolute;right:0;top:0;z-index:4}.fc-timeline-now-indicator-arrow,.fc-timeline-now-indicator-line{border-color:var(--fc-now-indicator-color);border-style:solid;pointer-events:none;position:absolute;top:0}.fc-timeline-now-indicator-arrow{border-left-color:transparent;border-right-color:transparent;border-width:6px 5px 0;margin:0 -5px}.fc-timeline-now-indicator-line{border-width:0 0 0 1px;bottom:0}.fc-timeline-events{z-index:3}.fc-timeline-events-overlap-enabled{padding-bottom:10px}.fc-timeline-event{border-radius:0;font-size:var(--fc-small-font-size);margin-bottom:1px;z-index:1}.fc-timeline-event.fc-event-mirror{z-index:2}.fc-direction-ltr .fc-timeline-event.fc-event-end{margin-right:1px}.fc-direction-rtl .fc-timeline-event.fc-event-end{margin-left:1px}.fc-timeline-event-spacious{margin-bottom:0;padding-bottom:5px;padding-top:5px}.fc-timeline-event .fc-event-inner{align-items:center;display:flex;flex-direction:row;padding:2px 1px}.fc-timeline-event:not(.fc-event-end) .fc-event-inner:after,.fc-timeline-event:not(.fc-event-start) .fc-event-inner:before{border-color:transparent #000;border-style:solid;border-width:5px;content:\"\";flex-grow:0;flex-shrink:0;height:0;margin:0 1px;opacity:.5;width:0}.fc-direction-ltr .fc-timeline-event:not(.fc-event-start) .fc-event-inner:before,.fc-direction-rtl .fc-timeline-event:not(.fc-event-end) .fc-event-inner:after{border-left:0}.fc-direction-ltr .fc-timeline-event:not(.fc-event-end) .fc-event-inner:after,.fc-direction-rtl .fc-timeline-event:not(.fc-event-start) .fc-event-inner:before{border-right:0}.fc-timeline-event .fc-event-time{font-weight:700}.fc-timeline-event .fc-event-time,.fc-timeline-event .fc-event-title{padding:0 2px}.fc-timeline-more-link{align-items:flex-start;background:var(--fc-more-link-bg-color);color:var(--fc-more-link-text-color);cursor:pointer;display:flex;flex-direction:column;font-size:var(--fc-small-font-size);padding:1px}.fc-direction-ltr .fc-timeline-more-link{margin-right:1px}.fc-direction-rtl .fc-timeline-more-link{margin-left:1px}.fc-timeline-more-link-inner{padding:2px}.fc-timeline-bg{bottom:0;left:0;position:absolute;right:0;top:0;z-index:2}.fc-timeline-bg .fc-non-business{z-index:1}.fc-timeline-bg .fc-bg-event{z-index:2}.fc-timeline-bg .fc-highlight{z-index:3}.fc-timeline-bg-harness{bottom:0;position:absolute;top:0}";
+internal_cjs.injectStyles(css_248z);
+
 exports.TimelineHeaderRow = TimelineHeaderRow;
 exports.TimelineLane = TimelineLane;
 exports.TimelineLaneBg = TimelineLaneBg;

package/internal.d.ts

@@ -17,21 +17,24 @@ declare class TimelineView extends DateComponent<ViewProps, TimelineViewState> {
     private tDateProfile?;
     private bodyEl?;
     private slotWidth?;
-    private headerSlotInnerWidth?;
+    private headerRowInnerWidthMap;
     private bodySlotInnerWidth?;
     private syncedScroller;
+    private scrollTime;
     render(): createElement.JSX.Element;
     componentDidMount(): void;
     componentDidUpdate(prevProps: ViewProps): void;
     componentWillUnmount(): void;
-    handleHeaderSlotInnerWidth: (innerWidth: number) => void;
     handleBodySlotInnerWidth: (innerWidth: number) => void;
     handleSlotInnerWidths: () => void;
     handleScrollerWidth: (scrollerWidth: number) => void;
     handleLeftScrollbarWidth: (leftScrollbarWidth: number) => void;
     handleRightScrollbarWidth: (rightScrollbarWidth: number) => void;
-    updateSyncedScroller(): void;
-    private timeScrollResponder;
+    private updateSyncedScroller;
+    private resetScroll;
+    private handleTimeScroll;
+    private updateScroll;
+    private clearScroll;
     handeBodyEl: (el: HTMLElement | null) => void;
     queryHit(positionLeft: number, positionTop: number, elWidth: number, elHeight: number): Hit;
 }
@@ -208,6 +211,7 @@ declare class TimelineHeaderRow extends BaseComponent<TimelineHeaderRowProps> {
     render(): createElement.JSX.Element;
     handleInnerWidths: () => void;
     handleInnerHeights: () => void;
+    componentWillUnmount(): void;
 }
 
 interface TimelineNowIndicatorArrowProps {

package/internal.js

@@ -1,8 +1,6 @@
-import { injectStyles, config, createFormatter, greatestDurationDenominator, asCleanDays, createDuration, wholeDivideDurations, asRoughMs, addDays, startOfDay, asRoughSeconds, asRoughMinutes, diffWholeDays, isInt, computeVisibleDayRange, padStart, BaseComponent, getDateMeta, ContentContainer, getDayClassNames, getSlotClassNames, watchWidth, setRef, RefMap, afterSize, SegHierarchy, groupIntersectingEntries, buildEventRangeKey, BgEvent, getSegMeta, renderFill, Slicer, intersectRanges, addMs, StandardEvent, MoreLinkContainer, watchHeight, memoize, sortEventSegs, memoizeObjArg, watchSize, buildNavLinkAttrs, NowIndicatorContainer, DateComponent, ScrollResponder, getIsHeightAuto, getStickyHeaderDates, getStickyFooterScrollbar, NowTimer, rangeContainsMarker, ViewContainer, Scroller, getScrollerSyncerClass, multiplyDuration } from '@fullcalendar/core/internal.js';
+import { config, createFormatter, greatestDurationDenominator, asCleanDays, createDuration, wholeDivideDurations, asRoughMs, addDays, startOfDay, asRoughSeconds, asRoughMinutes, diffWholeDays, isInt, computeVisibleDayRange, padStart, BaseComponent, getDateMeta, ContentContainer, getDayClassNames, getSlotClassNames, watchWidth, setRef, RefMap, afterSize, SegHierarchy, groupIntersectingEntries, buildEventRangeKey, BgEvent, getEventRangeMeta, renderFill, Slicer, intersectRanges, addMs, StandardEvent, MoreLinkContainer, watchHeight, memoize, sortEventSegs, memoizeObjArg, watchSize, buildNavLinkAttrs, NowIndicatorContainer, DateComponent, getIsHeightAuto, getStickyHeaderDates, getStickyFooterScrollbar, NowTimer, rangeContainsMarker, ViewContainer, Scroller, multiplyDuration, injectStyles } from '@fullcalendar/core/internal.js';
 import { createRef, createElement, Fragment, Component } from '@fullcalendar/core/preact.js';
-
-var css_248z = ".fc-timeline-slots{z-index:1}.fc-timeline-slot-minor{border-style:dotted}.fc-timeline-now-indicator-container{bottom:0;left:0;overflow:hidden;position:absolute;right:0;top:0;z-index:4}.fc-timeline-now-indicator-arrow,.fc-timeline-now-indicator-line{border-color:var(--fc-now-indicator-color);border-style:solid;pointer-events:none;position:absolute;top:0}.fc-timeline-now-indicator-arrow{border-left-color:transparent;border-right-color:transparent;border-width:6px 5px 0;margin:0 -5px}.fc-timeline-now-indicator-line{border-width:0 0 0 1px;bottom:0}.fc-timeline-events{z-index:3}.fc-timeline-events-overlap-enabled{padding-bottom:10px}.fc-timeline-event{border-radius:0;font-size:var(--fc-small-font-size);margin-bottom:1px;z-index:1}.fc-timeline-event.fc-event-mirror{z-index:2}.fc-direction-ltr .fc-timeline-event.fc-event-end{margin-right:1px}.fc-direction-rtl .fc-timeline-event.fc-event-end{margin-left:1px}.fc-timeline-event-spacious{margin-bottom:0;padding-bottom:5px;padding-top:5px}.fc-timeline-event .fc-event-inner{align-items:center;display:flex;flex-direction:row;padding:2px 1px}.fc-timeline-event:not(.fc-event-end) .fc-event-inner:after,.fc-timeline-event:not(.fc-event-start) .fc-event-inner:before{border-color:transparent #000;border-style:solid;border-width:5px;content:\"\";flex-grow:0;flex-shrink:0;height:0;margin:0 1px;opacity:.5;width:0}.fc-direction-ltr .fc-timeline-event:not(.fc-event-start) .fc-event-inner:before,.fc-direction-rtl .fc-timeline-event:not(.fc-event-end) .fc-event-inner:after{border-left:0}.fc-direction-ltr .fc-timeline-event:not(.fc-event-end) .fc-event-inner:after,.fc-direction-rtl .fc-timeline-event:not(.fc-event-start) .fc-event-inner:before{border-right:0}.fc-timeline-event .fc-event-time{font-weight:700}.fc-timeline-event .fc-event-time,.fc-timeline-event .fc-event-title{padding:0 2px}.fc-timeline-more-link{align-items:flex-start;background:var(--fc-more-link-bg-color);color:var(--fc-more-link-text-color);cursor:pointer;display:flex;flex-direction:column;font-size:var(--fc-small-font-size);padding:1px}.fc-direction-ltr .fc-timeline-more-link{margin-right:1px}.fc-direction-rtl .fc-timeline-more-link{margin-left:1px}.fc-timeline-more-link-inner{padding:2px}.fc-timeline-bg{bottom:0;left:0;position:absolute;right:0;top:0;z-index:2}.fc-timeline-bg .fc-non-business{z-index:1}.fc-timeline-bg .fc-bg-event{z-index:2}.fc-timeline-bg .fc-highlight{z-index:3}.fc-timeline-bg-harness{bottom:0;position:absolute;top:0}";
-injectStyles(css_248z);
+import { ScrollerSyncer } from '@fullcalendar/scrollgrid/internal.js';
 
 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
@@ -486,6 +484,7 @@ class TimelineSlatCell extends BaseComponent {
     }
     componentWillUnmount() {
         this.detachWidth();
+        setRef(this.props.innerWidthRef, null);
     }
 }
 
@@ -790,8 +789,7 @@ class TimelineLaneBg extends BaseComponent {
                 hStyle = horizontalsToCss(segHorizontal, isRtl);
             }
             return (createElement("div", { key: buildEventRangeKey(seg.eventRange), className: "fc-timeline-bg-harness", style: hStyle }, fillType === 'bg-event' ?
-                createElement(BgEvent, Object.assign({ seg: seg }, getSegMeta(seg, todayRange, nowDate))) :
-                renderFill(fillType)));
+                createElement(BgEvent, Object.assign({ eventRange: seg.eventRange, isStart: seg.isStart, isEnd: seg.isEnd }, getEventRangeMeta(seg.eventRange, todayRange, nowDate))) : (renderFill(fillType))));
         })));
     }
 }
@@ -846,9 +844,10 @@ class TimelineLaneMoreLink extends BaseComponent {
         let { hiddenSegs, resourceId, forcedInvisibleMap } = props;
         let extraDateSpan = resourceId ? { resourceId } : {};
         return (createElement(MoreLinkContainer, { elClasses: ['fc-timeline-more-link'], allDayDate: null, segs: hiddenSegs, hiddenSegs: hiddenSegs, dateProfile: props.dateProfile, todayRange: props.todayRange, extraDateSpan: extraDateSpan, popoverContent: () => (createElement(Fragment, null, hiddenSegs.map((seg) => {
-                let instanceId = seg.eventRange.instance.instanceId;
+                let { eventRange } = seg;
+                let instanceId = eventRange.instance.instanceId;
                 return (createElement("div", { key: instanceId, style: { visibility: forcedInvisibleMap[instanceId] ? 'hidden' : '' } },
-                    createElement(TimelineEvent, Object.assign({ isTimeScale: props.isTimeScale, seg: seg, isDragging: false, isResizing: false, isDateSelecting: false, isSelected: instanceId === props.eventSelection }, getSegMeta(seg, props.todayRange, props.nowDate)))));
+                    createElement(TimelineEvent, Object.assign({ isTimeScale: props.isTimeScale, eventRange: eventRange, isStart: seg.isStart, isEnd: seg.isEnd, isDragging: false, isResizing: false, isDateSelecting: false, isSelected: instanceId === props.eventSelection }, getEventRangeMeta(eventRange, props.todayRange, props.nowDate)))));
             }))) }, (InnerContent) => (createElement(InnerContent, { elTag: "div", elClasses: ['fc-timeline-more-link-inner', 'fc-sticky-x'] }))));
     }
 }
@@ -874,6 +873,7 @@ class TimelineEventHarness extends Component {
     }
     componentWillUnmount() {
         this.detachHeight();
+        setRef(this.props.heightRef, null);
     }
 }
 
@@ -951,13 +951,14 @@ class TimelineLane extends BaseComponent {
         let isMirror = isDragging || isResizing || isDateSelecting;
         return (createElement(Fragment, null,
             segs.map((seg) => {
-                const { instanceId } = seg.eventRange.instance;
+                const { eventRange } = seg;
+                const { instanceId } = eventRange.instance;
                 const segTop = segTops[instanceId];
                 const segHorizontal = segHorizontals[instanceId];
                 const isVisible = isMirror ||
                     (segHorizontal && segTop != null && !forcedInvisibleMap[instanceId]);
                 return (createElement(TimelineEventHarness, { key: instanceId, style: Object.assign({ visibility: isVisible ? '' : 'hidden', top: segTop || 0 }, horizontalsToCss(segHorizontal, context.isRtl)), heightRef: isMirror ? undefined : segHeightRefMap.createRef(instanceId) },
-                    createElement(TimelineEvent, Object.assign({ isTimeScale: props.tDateProfile.isTimeScale, seg: seg, isDragging: isDragging, isResizing: isResizing, isDateSelecting: isDateSelecting, isSelected: instanceId === props.eventSelection /* TODO: bad for mirror? */ }, getSegMeta(seg, props.todayRange, props.nowDate)))));
+                    createElement(TimelineEvent, Object.assign({ isTimeScale: props.tDateProfile.isTimeScale, eventRange: eventRange, isStart: seg.isStart, isEnd: seg.isEnd, isDragging: isDragging, isResizing: isResizing, isDateSelecting: isDateSelecting, isSelected: instanceId === props.eventSelection /* TODO: bad for mirror? */ }, getEventRangeMeta(eventRange, props.todayRange, props.nowDate)))));
             }),
             hiddenGroups.map((hiddenGroup) => (createElement(TimelineEventHarness, { key: hiddenGroup.key, style: Object.assign({ top: hiddenGroupTops[hiddenGroup.key] || 0 }, horizontalsToCss({
                     start: hiddenGroup.span.start,
@@ -975,7 +976,6 @@ class TimelineHeaderCell extends BaseComponent {
         this.buildCellNavLinkAttrs = memoize(buildCellNavLinkAttrs);
         // ref
         this.innerElRef = createRef();
-        // TODO: unset width/height ref on unmount?
     }
     render() {
         let { props, context } = this;
@@ -1037,7 +1037,10 @@ class TimelineHeaderCell extends BaseComponent {
         });
     }
     componentWillUnmount() {
+        const { props } = this;
         this.detachSize();
+        setRef(props.innerWidthRef, null);
+        setRef(props.innerHeightRef, null);
     }
 }
 // Utils
@@ -1096,6 +1099,7 @@ class TimelineHeaderRow extends BaseComponent {
             // TODO: make this part of the cell obj?
             // TODO: rowUnit seems wrong sometimes. says 'month' when it should be day
             // TODO: rowUnit is relevant to whole row. put it on a row object, not the cells
+            // TODO: use rowUnit to key the Row itself?
             const key = cell.rowUnit + ':' + cell.date.toISOString();
             return (createElement(TimelineHeaderCell, { key: key, cell: cell, rowLevel: props.rowLevel, dateProfile: props.dateProfile, tDateProfile: props.tDateProfile, todayRange: props.todayRange, nowDate: props.nowDate, isCentered: isCentered, isSticky: isSticky, 
                 // refs
@@ -1104,6 +1108,10 @@ class TimelineHeaderRow extends BaseComponent {
                 slotWidth: props.slotWidth }));
         })));
     }
+    componentWillUnmount() {
+        setRef(this.props.innerWidthRef, null);
+        setRef(this.props.innerHeighRef, null);
+    }
 }
 
 class TimelineNowIndicatorLine extends BaseComponent {
@@ -1137,19 +1145,19 @@ class TimelineView extends DateComponent {
         this.headerScrollerRef = createRef();
         this.bodyScrollerRef = createRef();
         this.footerScrollerRef = createRef();
+        this.headerRowInnerWidthMap = new RefMap(() => {
+            afterSize(this.handleSlotInnerWidths);
+        });
+        this.scrollTime = null;
         // Sizing
         // -----------------------------------------------------------------------------------------------
-        this.handleHeaderSlotInnerWidth = (innerWidth) => {
-            this.headerSlotInnerWidth = innerWidth;
-            afterSize(this.handleSlotInnerWidths);
-        };
         this.handleBodySlotInnerWidth = (innerWidth) => {
             this.bodySlotInnerWidth = innerWidth;
             afterSize(this.handleSlotInnerWidths);
         };
         this.handleSlotInnerWidths = () => {
             const { state } = this;
-            const slotInnerWidth = Math.max(this.headerSlotInnerWidth, this.bodySlotInnerWidth);
+            const slotInnerWidth = Math.max(this.headerRowInnerWidthMap.current.get(this.tDateProfile.cellRows.length - 1) || 0, this.bodySlotInnerWidth);
             if (state.slotInnerWidth !== slotInnerWidth) {
                 this.setState({ slotInnerWidth });
             }
@@ -1169,16 +1177,23 @@ class TimelineView extends DateComponent {
                 rightScrollbarWidth
             });
         };
-        this.timeScrollResponder = new ScrollResponder((time) => {
-            const { props, context, tDateProfile, slotWidth } = this;
-            if (slotWidth != null) {
-                const x = timeToCoord(time, context.dateEnv, props.dateProfile, tDateProfile, slotWidth) +
-                    (context.isRtl ? -1 : 1); // overcome border. TODO: DRY this up
+        this.handleTimeScroll = (scrollTime) => {
+            this.scrollTime = scrollTime;
+            this.updateScroll();
+        };
+        this.updateScroll = () => {
+            const { props, context, tDateProfile, scrollTime, slotWidth } = this;
+            if (scrollTime != null && slotWidth != null) {
+                let x = timeToCoord(scrollTime, context.dateEnv, props.dateProfile, tDateProfile, slotWidth);
+                if (x) {
+                    x += context.isRtl ? -1 : 1; // overcome border. TODO: DRY this up
+                }
                 this.syncedScroller.scrollTo({ x });
-                return true;
             }
-            return false;
-        });
+        };
+        this.clearScroll = () => {
+            this.scrollTime = null;
+        };
         // Hit System
         // -----------------------------------------------------------------------------------------------
         this.handeBodyEl = (el) => {
@@ -1229,7 +1244,7 @@ class TimelineView extends DateComponent {
                         } },
                         createElement("div", null, cellRows.map((cells, rowLevel) => {
                             const isLast = rowLevel === cellRows.length - 1;
-                            return (createElement(TimelineHeaderRow, { key: rowLevel, dateProfile: props.dateProfile, tDateProfile: tDateProfile, nowDate: nowDate, todayRange: todayRange, rowLevel: rowLevel, isLastRow: isLast, cells: cells, slotWidth: slotWidth, innerWidthRef: isLast ? this.handleHeaderSlotInnerWidth : undefined }));
+                            return (createElement(TimelineHeaderRow, { key: rowLevel, dateProfile: props.dateProfile, tDateProfile: tDateProfile, nowDate: nowDate, todayRange: todayRange, rowLevel: rowLevel, isLastRow: isLast, cells: cells, slotWidth: slotWidth, innerWidthRef: this.headerRowInnerWidthMap.createRef(rowLevel) }));
                         })),
                         enableNowIndicator && (
                         // TODO: make this positioned WITHIN padding?
@@ -1256,27 +1271,26 @@ class TimelineView extends DateComponent {
     // Lifecycle
     // -----------------------------------------------------------------------------------------------
     componentDidMount() {
-        const { context } = this;
-        const { options } = context;
-        const ScrollerSyncer = getScrollerSyncerClass(this.context.pluginHooks);
         this.syncedScroller = new ScrollerSyncer(true); // horizontal=true
         this.updateSyncedScroller();
-        context.emitter.on('_timeScrollRequest', this.timeScrollResponder.handleScroll);
-        this.timeScrollResponder.handleScroll(options.scrollTime);
+        this.resetScroll();
+        this.context.emitter.on('_timeScrollRequest', this.handleTimeScroll);
+        this.syncedScroller.addScrollEndListener(this.clearScroll);
     }
     componentDidUpdate(prevProps) {
-        const { options } = this.context;
         this.updateSyncedScroller();
-        if (prevProps.dateProfile !== this.props.dateProfile && options.scrollTimeReset) {
-            this.timeScrollResponder.handleScroll(options.scrollTime);
+        if (prevProps.dateProfile !== this.props.dateProfile && this.context.options.scrollTimeReset) {
+            this.resetScroll();
         }
         else {
-            this.timeScrollResponder.drain();
+            // TODO: inefficient to update so often
+            this.updateScroll();
         }
     }
     componentWillUnmount() {
         this.syncedScroller.destroy();
-        this.context.emitter.off('_timeScrollRequest', this.timeScrollResponder.handleScroll);
+        this.context.emitter.off('_timeScrollRequest', this.handleTimeScroll);
+        this.syncedScroller.removeScrollEndListener(this.clearScroll);
     }
     // Scrolling
     // -----------------------------------------------------------------------------------------------
@@ -1285,7 +1299,10 @@ class TimelineView extends DateComponent {
             this.headerScrollerRef.current,
             this.bodyScrollerRef.current,
             this.footerScrollerRef.current
-        ], this.context.isRtl);
+        ]);
+    }
+    resetScroll() {
+        this.handleTimeScroll(this.context.options.scrollTime);
     }
     queryHit(positionLeft, positionTop, elWidth, elHeight) {
         const { props, context, tDateProfile, slotWidth } = this;
@@ -1332,4 +1349,7 @@ class TimelineView extends DateComponent {
     }
 }
 
+var css_248z = ".fc-timeline-slots{z-index:1}.fc-timeline-slot-minor{border-style:dotted}.fc-timeline-now-indicator-container{bottom:0;left:0;overflow:hidden;position:absolute;right:0;top:0;z-index:4}.fc-timeline-now-indicator-arrow,.fc-timeline-now-indicator-line{border-color:var(--fc-now-indicator-color);border-style:solid;pointer-events:none;position:absolute;top:0}.fc-timeline-now-indicator-arrow{border-left-color:transparent;border-right-color:transparent;border-width:6px 5px 0;margin:0 -5px}.fc-timeline-now-indicator-line{border-width:0 0 0 1px;bottom:0}.fc-timeline-events{z-index:3}.fc-timeline-events-overlap-enabled{padding-bottom:10px}.fc-timeline-event{border-radius:0;font-size:var(--fc-small-font-size);margin-bottom:1px;z-index:1}.fc-timeline-event.fc-event-mirror{z-index:2}.fc-direction-ltr .fc-timeline-event.fc-event-end{margin-right:1px}.fc-direction-rtl .fc-timeline-event.fc-event-end{margin-left:1px}.fc-timeline-event-spacious{margin-bottom:0;padding-bottom:5px;padding-top:5px}.fc-timeline-event .fc-event-inner{align-items:center;display:flex;flex-direction:row;padding:2px 1px}.fc-timeline-event:not(.fc-event-end) .fc-event-inner:after,.fc-timeline-event:not(.fc-event-start) .fc-event-inner:before{border-color:transparent #000;border-style:solid;border-width:5px;content:\"\";flex-grow:0;flex-shrink:0;height:0;margin:0 1px;opacity:.5;width:0}.fc-direction-ltr .fc-timeline-event:not(.fc-event-start) .fc-event-inner:before,.fc-direction-rtl .fc-timeline-event:not(.fc-event-end) .fc-event-inner:after{border-left:0}.fc-direction-ltr .fc-timeline-event:not(.fc-event-end) .fc-event-inner:after,.fc-direction-rtl .fc-timeline-event:not(.fc-event-start) .fc-event-inner:before{border-right:0}.fc-timeline-event .fc-event-time{font-weight:700}.fc-timeline-event .fc-event-time,.fc-timeline-event .fc-event-title{padding:0 2px}.fc-timeline-more-link{align-items:flex-start;background:var(--fc-more-link-bg-color);color:var(--fc-more-link-text-color);cursor:pointer;display:flex;flex-direction:column;font-size:var(--fc-small-font-size);padding:1px}.fc-direction-ltr .fc-timeline-more-link{margin-right:1px}.fc-direction-rtl .fc-timeline-more-link{margin-left:1px}.fc-timeline-more-link-inner{padding:2px}.fc-timeline-bg{bottom:0;left:0;position:absolute;right:0;top:0;z-index:2}.fc-timeline-bg .fc-non-business{z-index:1}.fc-timeline-bg .fc-bg-event{z-index:2}.fc-timeline-bg .fc-highlight{z-index:3}.fc-timeline-bg-harness{bottom:0;position:absolute;top:0}";
+injectStyles(css_248z);
+
 export { TimelineHeaderRow, TimelineLane, TimelineLaneBg, TimelineLaneSlicer, TimelineNowIndicatorArrow, TimelineNowIndicatorLine, TimelineSlats, TimelineView, buildTimelineDateProfile, computeSlotWidth, coordToCss, coordsToCss, createHorizontalStyle, createVerticalStyle, timeToCoord };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fullcalendar/timeline",
-  "version": "7.0.0-beta.0",
+  "version": "7.0.0-beta.1",
   "title": "FullCalendar Timeline Plugin",
   "description": "Display events on a horizontal time axis (without resources)",
   "keywords": [
@@ -15,11 +15,11 @@
   ],
   "homepage": "https://fullcalendar.io/docs/timeline-view-no-resources",
   "dependencies": {
-    "@fullcalendar/premium-common": "7.0.0-beta.0",
-    "@fullcalendar/scrollgrid": "7.0.0-beta.0"
+    "@fullcalendar/premium-common": "7.0.0-beta.1",
+    "@fullcalendar/scrollgrid": "7.0.0-beta.1"
   },
   "peerDependencies": {
-    "@fullcalendar/core": "7.0.0-beta.0"
+    "@fullcalendar/core": "7.0.0-beta.1"
   },
   "type": "module",
   "bugs": "https://fullcalendar.io/reporting-bugs",