@fullcalendar/list 7.0.0-beta.1 → 7.0.0-beta.3

package/internal.cjs

@@ -5,49 +5,29 @@ 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 = ":root{--fc-list-event-dot-width:10px;--fc-list-event-hover-bg-color:#f5f5f5}.fc-table{border-spacing:0;width:100%}.fc-table>*>*>*{border-color:var(--fc-border-color);border-style:solid;border-width:0 0 1px;padding:0}.fc-table>:last-child>:last-child>*{border-bottom-width:0}.fc-list-day-inner,.fc-list-event-dot-cell,.fc-list-event-time,.fc-list-event-title{padding:8px 14px}.fc-direction-ltr .fc-list-event-dot-cell{padding-right:0}.fc-direction-rtl .fc-list-event-dot-cell{padding-left:0}.fc-list-empty{align-items:center;background-color:var(--fc-neutral-bg-color);display:flex;height:100%;justify-content:center}.fc-list-empty-inner{margin:5em 0}.fc-list-day-cell-sticky{background:var(--fc-page-bg-color);position:sticky;top:0}.fc-list-day-inner{background:var(--fc-neutral-bg-color);display:flex;justify-content:space-between}.fc-list-event.fc-event-forced-url{cursor:pointer}.fc-list-event:hover td{background-color:var(--fc-list-event-hover-bg-color)}.fc-list-event-dot-cell,.fc-list-event-time{white-space:nowrap;width:1px}.fc-list-event-dot{border:calc(var(--fc-list-event-dot-width)/2) solid var(--fc-event-border-color);border-radius:calc(var(--fc-list-event-dot-width)/2);box-sizing:content-box;display:inline-block;height:0;width:0}.fc-list-event-title a{color:inherit;text-decoration:none}.fc-list-event.fc-event-forced-url:hover a{text-decoration:underline}";
-internal_cjs.injectStyles(css_248z);
-
-class ListViewHeaderRow extends internal_cjs.BaseComponent {
-    constructor() {
-        super(...arguments);
-        this.state = {
-            textId: internal_cjs.getUniqueDomId(),
-        };
-    }
+class ListDayHeader extends internal_cjs.BaseComponent {
     render() {
-        let { theme, dateEnv, options, viewApi } = this.context;
-        let { cellId, dayDate, todayRange } = this.props;
-        let { textId } = this.state;
+        let { dateEnv, options, viewApi } = this.context;
+        let { dayDate, todayRange } = this.props;
         let stickyHeaderDates = !this.props.forPrint && internal_cjs.getStickyHeaderDates(options);
         let dayMeta = internal_cjs.getDateMeta(dayDate, todayRange);
         // will ever be falsy?
         let text = options.listDayFormat ? dateEnv.format(dayDate, options.listDayFormat) : '';
         // will ever be falsy? also, BAD NAME "alt"
         let sideText = options.listDaySideFormat ? dateEnv.format(dayDate, options.listDaySideFormat) : '';
-        let renderProps = Object.assign({ date: dateEnv.toDate(dayDate), view: viewApi, textId,
-            text,
+        let renderProps = Object.assign({ date: dateEnv.toDate(dayDate), view: viewApi, text,
             sideText, navLinkAttrs: internal_cjs.buildNavLinkAttrs(this.context, dayDate), sideNavLinkAttrs: internal_cjs.buildNavLinkAttrs(this.context, dayDate, 'day', false) }, dayMeta);
         // TODO: make a reusable HOC for dayHeader (used in daygrid/timegrid too)
-        return (preact_cjs.createElement(internal_cjs.ContentContainer, { elTag: "tr", elClasses: [
-                'fc-list-day',
-                ...internal_cjs.getDayClassNames(dayMeta, theme),
-            ], elAttrs: {
-                'data-date': internal_cjs.formatDayString(dayDate),
-            }, renderProps: renderProps, generatorName: "dayHeaderContent", customGenerator: options.dayHeaderContent, defaultGenerator: renderInnerContent, classNameGenerator: options.dayHeaderClassNames, didMount: options.dayHeaderDidMount, willUnmount: options.dayHeaderWillUnmount }, (InnerContent) => (preact_cjs.createElement(InnerContent, { elTag: "th", elAttrs: {
-                id: cellId,
-                colSpan: 3,
-                'aria-labelledby': textId,
-            }, elClasses: [
-                'fc-list-day-cell',
-                stickyHeaderDates ? 'fc-list-day-cell-sticky' : '',
-            ] }))));
+        return (preact_cjs.createElement("div", { className: internal_cjs.joinClassNames('fc-list-day-outer', stickyHeaderDates && 'fc-list-day-outer-sticky') },
+            preact_cjs.createElement(internal_cjs.ContentContainer, { tag: "div", className: internal_cjs.joinClassNames('fc-list-day', internal_cjs.getDayClassName(dayMeta)), attrs: {
+                    'data-date': internal_cjs.formatDayString(dayDate),
+                }, renderProps: renderProps, generatorName: "dayHeaderContent", customGenerator: options.dayHeaderContent, defaultGenerator: renderInnerContent, classNameGenerator: options.dayHeaderClassNames, didMount: options.dayHeaderDidMount, willUnmount: options.dayHeaderWillUnmount })));
     }
 }
 function renderInnerContent(props) {
-    return (preact_cjs.createElement("div", { className: 'fc-list-day-inner' },
+    return (preact_cjs.createElement(preact_cjs.Fragment, null,
         props.text && (preact_cjs.createElement("a", Object.assign({ id: props.textId, className: "fc-list-day-text" }, props.navLinkAttrs), props.text)),
-        props.sideText && ( /* not keyboard tabbable */preact_cjs.createElement("a", Object.assign({ "aria-hidden": true, className: "fc-list-day-side-text" }, props.sideNavLinkAttrs), props.sideText))));
+        props.sideText && ( /* not keyboard tabbable */preact_cjs.createElement("a", Object.assign({ className: "fc-list-day-side-text" }, props.sideNavLinkAttrs), props.sideText))));
 }
 
 const DEFAULT_TIME_FORMAT = internal_cjs.createFormatter({
@@ -55,92 +35,131 @@ const DEFAULT_TIME_FORMAT = internal_cjs.createFormatter({
     minute: '2-digit',
     meridiem: 'short',
 });
-class ListViewEventRow extends internal_cjs.BaseComponent {
+class ListEvent extends internal_cjs.BaseComponent {
+    constructor() {
+        super(...arguments);
+        this.handleTitleEl = (titleEl) => {
+            if (this.disconnectTitleWidth) {
+                this.disconnectTitleWidth();
+            }
+            if (titleEl) {
+                this.disconnectTitleWidth = internal_cjs.watchWidth(titleEl, (titleWidth) => {
+                    internal_cjs.setRef(this.props.timeWidthRef, titleWidth);
+                });
+            }
+        };
+    }
     render() {
         let { props, context } = this;
+        let { eventRange } = props;
         let { options } = context;
-        let { eventRange, timeHeaderId, eventHeaderId, dateHeaderId } = props;
         let timeFormat = options.eventTimeFormat || DEFAULT_TIME_FORMAT;
-        return (preact_cjs.createElement(internal_cjs.EventContainer, Object.assign({}, props, { elTag: "tr", elClasses: [
-                'fc-list-event',
-                eventRange.def.url && 'fc-event-forced-url',
-            ], defaultGenerator: () => renderEventInnerContent(eventRange, context) /* weird */, eventRange: eventRange, timeText: "", disableDragging: true, disableResizing: true }), (InnerContent, eventContentArg) => (preact_cjs.createElement(preact_cjs.Fragment, null,
-            buildTimeContent(eventRange, props.isStart, props.isEnd, props.segStart, props.segEnd, timeFormat, context, timeHeaderId, dateHeaderId),
-            preact_cjs.createElement("td", { "aria-hidden": true, className: "fc-list-event-dot-cell" },
+        let anchorAttrs = internal_cjs.getEventRangeAnchorAttrs(eventRange, context);
+        return (preact_cjs.createElement(internal_cjs.EventContainer, Object.assign({}, props, { tag: anchorAttrs ? 'a' : 'div', attrs: anchorAttrs, className: 'fc-list-event', defaultGenerator: renderEventTitleOnly, eventRange: eventRange, timeText: "", disableDragging: true, disableResizing: true }), (InnerContent, eventContentArg) => (preact_cjs.createElement(preact_cjs.Fragment, null,
+            preact_cjs.createElement("div", { className: 'fc-list-event-time-outer', style: { width: props.timeOuterWidth } }, this.buildTimeContent(eventRange, props.slicedStart, props.slicedEnd, props.isStart, props.isEnd, timeFormat, context)),
+            preact_cjs.createElement("div", { className: "fc-list-event-dot-outer" },
                 preact_cjs.createElement("span", { className: "fc-list-event-dot", style: {
                         borderColor: eventContentArg.borderColor || eventContentArg.backgroundColor,
                     } })),
-            preact_cjs.createElement(InnerContent, { elTag: "td", elClasses: ['fc-list-event-title'], elAttrs: { headers: `${eventHeaderId} ${dateHeaderId}` } })))));
+            preact_cjs.createElement(InnerContent, { tag: "div", className: 'fc-list-event-title' })))));
     }
-}
-function renderEventInnerContent(eventRange, context) {
-    let interactiveAttrs = internal_cjs.getEventRangeAnchorAttrs(eventRange, context);
-    return (preact_cjs.createElement("a", Object.assign({}, interactiveAttrs), eventRange.def.title));
-}
-function buildTimeContent(eventRange, isStart, isEnd, segStart, segEnd, timeFormat, context, timeHeaderId, dateHeaderId) {
-    let { options } = context;
-    if (options.displayEventTime !== false) {
-        let eventDef = eventRange.def;
-        let eventInstance = eventRange.instance;
-        let doAllDay = false;
-        let timeText;
-        if (eventDef.allDay) {
-            doAllDay = true;
-        }
-        else if (internal_cjs.isMultiDayRange(eventRange.range)) { // TODO: use (!isStart || !isEnd) instead?
-            if (isStart) {
-                timeText = internal_cjs.buildEventRangeTimeText(eventRange, timeFormat, context, null, null, eventInstance.range.start, segEnd);
-            }
-            else if (isEnd) {
-                timeText = internal_cjs.buildEventRangeTimeText(eventRange, timeFormat, context, null, null, segStart, eventInstance.range.end);
+    buildTimeContent(eventRange, // whole-day span
+    slicedStart, // view-sliced whole-day span
+    slicedEnd, // view-sliced whole-day span
+    isStart, isEnd, timeFormat, context) {
+        let { options } = context;
+        if (options.displayEventTime !== false) {
+            if (eventRange.def.allDay || (!isStart && !isEnd)) {
+                let renderProps = {
+                    text: context.options.allDayText,
+                    view: context.viewApi,
+                };
+                return (preact_cjs.createElement(internal_cjs.ContentContainer, { tag: "div", className: 'fc-list-event-time', renderProps: renderProps, elRef: this.handleTitleEl, generatorName: "allDayContent", customGenerator: options.allDayContent, defaultGenerator: renderAllDayInner, classNameGenerator: options.allDayClassNames, didMount: options.allDayDidMount, willUnmount: options.allDayWillUnmount }));
             }
             else {
-                doAllDay = true;
+                return (preact_cjs.createElement("div", { className: "fc-list-event-time", ref: this.handleTitleEl }, internal_cjs.buildEventRangeTimeText(timeFormat, eventRange, slicedStart, slicedEnd, isStart, isEnd, context)));
             }
         }
-        else {
-            timeText = internal_cjs.buildEventRangeTimeText(eventRange, timeFormat, context, null, null, segStart, segEnd);
-        }
-        if (doAllDay) {
-            let renderProps = {
-                text: context.options.allDayText,
-                view: context.viewApi,
-            };
-            return (preact_cjs.createElement(internal_cjs.ContentContainer, { elTag: "td", elClasses: ['fc-list-event-time'], elAttrs: {
-                    headers: `${timeHeaderId} ${dateHeaderId}`,
-                }, renderProps: renderProps, generatorName: "allDayContent", customGenerator: options.allDayContent, defaultGenerator: renderAllDayInner, classNameGenerator: options.allDayClassNames, didMount: options.allDayDidMount, willUnmount: options.allDayWillUnmount }));
-        }
-        return (preact_cjs.createElement("td", { className: "fc-list-event-time" }, timeText));
+        return null;
+    }
+    componentWillUnmount() {
+        internal_cjs.setRef(this.props.timeWidthRef, null);
     }
-    return null;
+}
+function renderEventTitleOnly(renderProps) {
+    return renderProps.event.title;
 }
 function renderAllDayInner(renderProps) {
     return renderProps.text;
 }
 
+class ListDay extends internal_cjs.BaseComponent {
+    constructor() {
+        super(...arguments);
+        // memo
+        this.sortEventSegs = internal_cjs.memoize(internal_cjs.sortEventSegs);
+        // ref
+        this.timeWidthRefMap = new internal_cjs.RefMap(() => {
+            internal_cjs.afterSize(this.handleTimeWidths);
+        });
+        this.handleTimeWidths = () => {
+            const timeWidthMap = this.timeWidthRefMap.current;
+            let max = 0;
+            for (const timeWidth of timeWidthMap.values()) {
+                max = Math.max(max, timeWidth);
+            }
+            internal_cjs.setRef(this.props.timeWidthRef, max);
+        };
+    }
+    render() {
+        const { props, context, timeWidthRefMap } = this;
+        const { nowDate, todayRange } = props;
+        const { options } = context;
+        const segs = this.sortEventSegs(props.segs, options.eventOrder);
+        return (preact_cjs.createElement("div", { className: 'fc-list-day-and-events' },
+            preact_cjs.createElement(ListDayHeader, { dayDate: props.dayDate, todayRange: todayRange, forPrint: props.forPrint }),
+            segs.map((seg) => {
+                const key = internal_cjs.getEventKey(seg);
+                return (preact_cjs.createElement(ListEvent, Object.assign({ key: key, eventRange: seg.eventRange, slicedStart: seg.slicedStart, slicedEnd: seg.slicedEnd, isStart: seg.isStart, isEnd: seg.isEnd, timeWidthRef: timeWidthRefMap.createRef(key), timeOuterWidth: props.timeOuterWidth, isDragging: false, isResizing: false, isDateSelecting: false, isSelected: false }, internal_cjs.getEventRangeMeta(seg.eventRange, todayRange, nowDate))));
+            })));
+    }
+    componentWillUnmount() {
+        internal_cjs.setRef(this.props.timeWidthRef, null);
+    }
+}
+
 /*
 Responsible for the scroller, and forwarding event-related actions into the "grid".
 */
 class ListView extends internal_cjs.DateComponent {
     constructor() {
         super(...arguments);
+        // memo
         this.computeDateVars = internal_cjs.memoize(computeDateVars);
         this.eventStoreToSegs = internal_cjs.memoize(this._eventStoreToSegs);
-        this.state = {
-            timeHeaderId: internal_cjs.getUniqueDomId(),
-            eventHeaderId: internal_cjs.getUniqueDomId(),
-            dateHeaderIdRoot: internal_cjs.getUniqueDomId(),
-        };
+        // ref
+        this.timeWidthRefMap = new internal_cjs.RefMap(() => {
+            internal_cjs.afterSize(this.handleTimeWidths);
+        });
         this.setRootEl = (rootEl) => {
             if (rootEl) {
                 this.context.registerInteractiveComponent(this, {
                     el: rootEl,
+                    disableHits: true, // HACK to not do date-clicking/selecting
                 });
             }
             else {
                 this.context.unregisterInteractiveComponent(this);
             }
         };
+        this.handleTimeWidths = () => {
+            const timeWidthMap = this.timeWidthRefMap.current;
+            let max = 0;
+            for (const timeWidth of timeWidthMap.values()) {
+                max = Math.max(max, timeWidth);
+            }
+            this.setState({ timeOuterWidth: max });
+        };
     }
     render() {
         let { props, context } = this;
@@ -148,13 +167,9 @@ class ListView extends internal_cjs.DateComponent {
         let { dayDates, dayRanges } = this.computeDateVars(props.dateProfile);
         let eventSegs = this.eventStoreToSegs(props.eventStore, props.eventUiBases, dayRanges);
         let verticalScrolling = !props.forPrint && !internal_cjs.getIsHeightAuto(options);
-        return (preact_cjs.createElement(internal_cjs.ViewContainer, { elRef: this.setRootEl, elClasses: [
-                'fc-list-view',
-                'fc-flex-column',
-                'fc-border',
-            ], viewSpec: context.viewSpec },
+        return (preact_cjs.createElement(internal_cjs.ViewContainer, { elRef: this.setRootEl, className: 'fc-list fc-flex-col fc-border', viewSpec: context.viewSpec },
             preact_cjs.createElement(internal_cjs.Scroller // TODO: don't need heavyweight component
-            , { vertical: verticalScrolling, elClassNames: [verticalScrolling ? 'fc-liquid' : ''] }, eventSegs.length > 0 ?
+            , { vertical: verticalScrolling, className: verticalScrolling ? 'fc-liquid' : '' }, eventSegs.length > 0 ?
                 this.renderSegList(eventSegs, dayDates) :
                 this.renderEmptyMessage())));
     }
@@ -164,77 +179,50 @@ class ListView extends internal_cjs.DateComponent {
             text: options.noEventsText,
             view: viewApi,
         };
-        return (preact_cjs.createElement(internal_cjs.ContentContainer, { elTag: "div", elClasses: ['fc-list-empty'], renderProps: renderProps, generatorName: "noEventsContent", customGenerator: options.noEventsContent, defaultGenerator: renderNoEventsInner, classNameGenerator: options.noEventsClassNames, didMount: options.noEventsDidMount, willUnmount: options.noEventsWillUnmount }, (InnerContent) => (preact_cjs.createElement(InnerContent, { elTag: "div", elClasses: ['fc-list-empty-inner'] }))));
+        return (preact_cjs.createElement(internal_cjs.ContentContainer, { tag: "div", className: 'fc-list-empty', renderProps: renderProps, generatorName: "noEventsContent", customGenerator: options.noEventsContent, defaultGenerator: renderNoEventsInner, classNameGenerator: options.noEventsClassNames, didMount: options.noEventsDidMount, willUnmount: options.noEventsWillUnmount }, (InnerContent) => (preact_cjs.createElement(InnerContent, { tag: "div", className: 'fc-list-empty-inner' }))));
     }
     renderSegList(allSegs, dayDates) {
-        let { options } = this.context;
-        let { timeHeaderId, eventHeaderId, dateHeaderIdRoot } = this.state;
         let segsByDay = groupSegsByDay(allSegs); // sparse array
         return (preact_cjs.createElement(internal_cjs.NowTimer, { unit: "day" }, (nowDate, todayRange) => {
-            let innerNodes = [];
+            const dayNodes = [];
             for (let dayIndex = 0; dayIndex < segsByDay.length; dayIndex += 1) {
                 let daySegs = segsByDay[dayIndex];
                 if (daySegs) { // sparse array, so might be undefined
-                    let dayStr = internal_cjs.formatDayString(dayDates[dayIndex]);
-                    let dateHeaderId = dateHeaderIdRoot + '-' + dayStr;
-                    // append a day header
-                    innerNodes.push(preact_cjs.createElement(ListViewHeaderRow, { key: dayStr, forPrint: this.props.forPrint, cellId: dateHeaderId, dayDate: dayDates[dayIndex], todayRange: todayRange }));
-                    daySegs = internal_cjs.sortEventSegs(daySegs, options.eventOrder);
-                    for (let seg of daySegs) {
-                        innerNodes.push(preact_cjs.createElement(ListViewEventRow, Object.assign({ key: dayStr + ':' + seg.eventRange.instance.instanceId /* are multiple segs for an instanceId */, eventRange: seg.eventRange, isStart: seg.isStart, isEnd: seg.isEnd, segStart: seg.start, segEnd: seg.end, isDragging: false, isResizing: false, isDateSelecting: false, isSelected: false, timeHeaderId: timeHeaderId, eventHeaderId: eventHeaderId, dateHeaderId: dateHeaderId }, internal_cjs.getEventRangeMeta(seg.eventRange, todayRange, nowDate))));
-                    }
+                    const dayDate = dayDates[dayIndex];
+                    const key = internal_cjs.formatDayString(dayDate);
+                    dayNodes.push(preact_cjs.createElement(ListDay, { key: key, dayDate: dayDate, nowDate: nowDate, todayRange: todayRange, segs: daySegs, forPrint: this.props.forPrint, timeWidthRef: this.timeWidthRefMap.createRef(key), timeOuterWidth: this.state.timeOuterWidth }));
                 }
             }
-            return (preact_cjs.createElement("table", { className: 'fc-table' },
-                preact_cjs.createElement("thead", { className: 'fc-offscreen' },
-                    preact_cjs.createElement("tr", null,
-                        preact_cjs.createElement("th", { scope: "col", id: timeHeaderId }, options.timeHint),
-                        preact_cjs.createElement("th", { scope: "col", "aria-hidden": true }),
-                        preact_cjs.createElement("th", { scope: "col", id: eventHeaderId }, options.eventHint))),
-                preact_cjs.createElement("tbody", null, innerNodes)));
+            return (preact_cjs.createElement(preact_cjs.Fragment, null, dayNodes));
         }));
     }
     _eventStoreToSegs(eventStore, eventUiBases, dayRanges) {
-        return this.eventRangesToSegs(internal_cjs.sliceEventStore(eventStore, eventUiBases, this.props.dateProfile.activeRange, this.context.options.nextDayThreshold).fg, dayRanges);
+        return this.eventRangesToSegs(internal_cjs.sliceEventStore(eventStore, eventUiBases, 
+        // HACKY to reference internal state...
+        this.props.dateProfile.activeRange, this.context.options.nextDayThreshold).fg, dayRanges);
     }
-    eventRangesToSegs(eventRanges, dayRanges) {
+    eventRangesToSegs(fullDayEventRanges, dayRanges) {
         let segs = [];
-        for (let eventRange of eventRanges) {
-            segs.push(...this.eventRangeToSegs(eventRange, dayRanges));
+        for (let fullDayEventRange of fullDayEventRanges) {
+            segs.push(...this.eventRangeToSegs(fullDayEventRange, dayRanges));
         }
         return segs;
     }
-    eventRangeToSegs(eventRange, dayRanges) {
-        let { dateEnv } = this.context;
-        let { nextDayThreshold } = this.context.options;
-        let range = eventRange.range;
-        let allDay = eventRange.def.allDay;
+    eventRangeToSegs(fullDayEventRange, dayRanges) {
+        let fullDayRange = fullDayEventRange.range;
         let dayIndex;
-        let segRange;
-        let seg;
         let segs = [];
         for (dayIndex = 0; dayIndex < dayRanges.length; dayIndex += 1) {
-            segRange = internal_cjs.intersectRanges(range, dayRanges[dayIndex]);
-            if (segRange) {
-                seg = {
-                    eventRange,
-                    start: segRange.start,
-                    end: segRange.end,
-                    isStart: eventRange.isStart && segRange.start.valueOf() === range.start.valueOf(),
-                    isEnd: eventRange.isEnd && segRange.end.valueOf() === range.end.valueOf(),
+            const slicedFullDayRange = internal_cjs.intersectRanges(fullDayRange, dayRanges[dayIndex]);
+            if (slicedFullDayRange) {
+                segs.push({
+                    eventRange: fullDayEventRange,
+                    slicedStart: slicedFullDayRange.start,
+                    slicedEnd: slicedFullDayRange.end,
+                    isStart: fullDayEventRange.isStart && fullDayRange.start.valueOf() === slicedFullDayRange.start.valueOf(),
+                    isEnd: fullDayEventRange.isEnd && fullDayRange.end.valueOf() === slicedFullDayRange.end.valueOf(),
                     dayIndex,
-                };
-                segs.push(seg);
-                // detect when range won't go fully into the next day,
-                // and mutate the latest seg to the be the end.
-                if (!seg.isEnd && !allDay &&
-                    dayIndex + 1 < dayRanges.length &&
-                    range.end <
-                        dateEnv.add(dayRanges[dayIndex + 1].start, nextDayThreshold)) {
-                    seg.end = range.end;
-                    seg.isEnd = true;
-                    break;
-                }
+                });
             }
         }
         return segs;
@@ -271,4 +259,7 @@ function groupSegsByDay(segs) {
     return segsByDay;
 }
 
+var css_248z = ":root{--fc-list-event-dot-width:10px;--fc-list-event-hover-bg-color:#f5f5f5}.fc-list-day,.fc-list-event-dot-outer,.fc-list-event-time,.fc-list-event-title{padding:8px 14px}.fc-direction-ltr .fc-list-event-dot-outer{padding-right:0}.fc-direction-rtl .fc-list-event-dot-outer{padding-left:0}.fc-list-empty{align-items:center;background-color:var(--fc-neutral-bg-color);display:flex;height:100%;justify-content:center}.fc-list-empty-inner{margin:5em 0}.fc-list-day,.fc-list-event:not(.fc-list-day-and-events:last-child .fc-list-event:last-child){border-bottom:1px solid var(--fc-border-color)}.fc-list-day-outer-sticky{background:var(--fc-page-bg-color);position:sticky;top:0}.fc-list-day{background:var(--fc-neutral-bg-color);display:flex;font-weight:700;justify-content:space-between}.fc-list-event{display:flex;flex-direction:row}a.fc-list-event{color:inherit;text-decoration:none}.fc-list-event:hover{background-color:var(--fc-list-event-hover-bg-color)}.fc-list-event-time-outer{display:flex;flex-direction:row}.fc-list-event-dot-outer,.fc-list-event-time{white-space:nowrap}.fc-list-event-dot{border:calc(var(--fc-list-event-dot-width)/2) solid var(--fc-event-border-color);border-radius:calc(var(--fc-list-event-dot-width)/2);box-sizing:content-box;display:inline-block;height:0;width:0}a.fc-list-event:hover .fc-list-event-title{text-decoration:underline}";
+internal_cjs.injectStyles(css_248z);
+
 exports.ListView = ListView;