@fullcalendar/list - npm Package Compare versions

Comparing version 4.4.0 to 5.0.0-beta

main.d.ts

@@ -7,2 +7,3 @@ // Generated by dts-bundle v0.7.3-fork.1
     import ListView from '@fullcalendar/list/ListView';
+    
     export { ListView };
@@ -14,25 +15,14 @@ const _default: import("@fullcalendar/core").PluginDef;
 declare module '@fullcalendar/list/ListView' {
-    import { View, ViewProps, ScrollComponent, DateMarker, DateRange, ComponentContext, EventUiHash, EventRenderRange, EventStore, Seg, ViewSpec } from '@fullcalendar/core';
+    import { h, ViewProps, DateMarker, DateRange, ComponentContext, EventUiHash, EventRenderRange, EventStore, Seg, DateComponent } from '@fullcalendar/core';
     export { ListView as default, ListView };
-    class ListView extends View {
-        scroller: ScrollComponent;
-        contentEl: HTMLElement;
-        dayDates: DateMarker[];
-        constructor(viewSpec: ViewSpec, parentEl: HTMLElement);
-        firstContext(context: ComponentContext): void;
-        render(props: ViewProps, context: ComponentContext): void;
-        destroy(): void;
-        _renderSkeleton(context: ComponentContext): void;
-        _unrenderSkeleton(): void;
-        updateSize(isResize: any, viewHeight: any, isAuto: any): void;
-        computeScrollerHeight(viewHeight: any): number;
+    class ListView extends DateComponent<ViewProps> {
+        render(props: ViewProps, state: {}, context: ComponentContext): h.JSX.Element;
+        setRootEl: (rootEl: HTMLDivElement) => void;
+        renderEmptyMessage(): h.JSX.Element;
+        renderSegList(allSegs: Seg[], dayDates: DateMarker[]): h.JSX.Element;
         _eventStoreToSegs(eventStore: EventStore, eventUiBases: EventUiHash, dayRanges: DateRange[]): Seg[];
         eventRangesToSegs(eventRanges: EventRenderRange[], dayRanges: DateRange[]): any[];
         eventRangeToSegs(eventRange: EventRenderRange, dayRanges: DateRange[]): any[];
-        renderEmptyMessage(): void;
-        renderSegList(allSegs: any): void;
-        groupSegsByDay(segs: any): any[];
-        buildDayHeaderRow(dayDate: any): HTMLTableRowElement;
     }
 }
 

main.js

 /*!
-FullCalendar List View Plugin v4.4.0
+FullCalendar List View Plugin v5.0.0-beta
 Docs & License: https://fullcalendar.io/
@@ -7,351 +7,289 @@ (c) 2019 Adam Shaw
 
-(function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@fullcalendar/core')) :
-    typeof define === 'function' && define.amd ? define(['exports', '@fullcalendar/core'], factory) :
-    (global = global || self, factory(global.FullCalendarList = {}, global.FullCalendar));
-}(this, function (exports, core) { 'use strict';
+import { getDateMeta, createFormatter, buildNavLinkData, getDayClassNames, h, RenderHook, formatDayString, BaseComponent, EventRoot, isMultiDayRange, buildSegTimeText, memoize, ViewRoot, Scroller, NowTimer, sortEventSegs, getSegMeta, sliceEventStore, intersectRanges, DateComponent, startOfDay, addDays, createPlugin } from '@fullcalendar/core';
+import { __extends, __assign } from 'tslib';
+import './main.css';
 
-    /*! *****************************************************************************
-    Copyright (c) Microsoft Corporation. All rights reserved.
-    Licensed under the Apache License, Version 2.0 (the "License"); you may not use
-    this file except in compliance with the License. You may obtain a copy of the
-    License at http://www.apache.org/licenses/LICENSE-2.0
-
-    THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
-    KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
-    WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,
-    MERCHANTABLITY OR NON-INFRINGEMENT.
-
-    See the Apache Version 2.0 License for specific language governing permissions
-    and limitations under the License.
-    ***************************************************************************** */
-    /* global Reflect, Promise */
-
-    var extendStatics = function(d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
+var ListViewHeaderRow = /** @class */ (function (_super) {
+    __extends(ListViewHeaderRow, _super);
+    function ListViewHeaderRow() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    ListViewHeaderRow.prototype.render = function (props, state, context) {
+        var theme = context.theme, dateEnv = context.dateEnv, options = context.options;
+        var dayDate = props.dayDate;
+        var dayMeta = getDateMeta(dayDate, props.todayRange);
+        var mainFormat = createFormatter(options.listDayFormat); // TODO: cache
+        var sideFormat = createFormatter(options.listDaySideFormat); // TODO: cache
+        var text = mainFormat ? dateEnv.format(dayDate, mainFormat) : ''; // will ever be falsy?
+        var sideText = sideFormat ? dateEnv.format(dayDate, sideFormat) : ''; // will ever be falsy? also, BAD NAME "alt"
+        var navLinkData = options.navLinks
+            ? buildNavLinkData(dayDate)
+            : null;
+        var hookProps = __assign({ date: dateEnv.toDate(dayDate), view: context.view, text: text,
+            sideText: sideText,
+            navLinkData: navLinkData }, dayMeta);
+        var classNames = ['fc-list-day'].concat(getDayClassNames(dayMeta, context.theme));
+        // TODO: make a reusable HOC for dayHeader (used in daygrid/timegrid too)
+        return (h(RenderHook, { name: 'dayHeader', hookProps: hookProps, defaultContent: renderInnerContent }, function (rootElRef, customClassNames, innerElRef, innerContent) { return (h("tr", { ref: rootElRef, className: classNames.concat(customClassNames).join(' '), "data-date": formatDayString(dayDate) },
+            h("th", { colSpan: 3, className: theme.getClass('tableCellShaded'), ref: innerElRef }, innerContent))); }));
     };
+    return ListViewHeaderRow;
+}(BaseComponent));
+function renderInnerContent(props) {
+    return [
+        props.text &&
+            h("a", { className: 'fc-list-day-text', "data-navlink": props.navLinkData }, props.text),
+        props.sideText &&
+            h("a", { className: 'fc-list-day-side-text', "data-navlink": props.navLinkData }, props.sideText)
+    ];
+}
 
-    function __extends(d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+var DEFAULT_TIME_FORMAT = {
+    hour: 'numeric',
+    minute: '2-digit',
+    meridiem: 'short'
+};
+var ListViewEventRow = /** @class */ (function (_super) {
+    __extends(ListViewEventRow, _super);
+    function ListViewEventRow() {
+        return _super !== null && _super.apply(this, arguments) || this;
     }
-
-    var ListEventRenderer = /** @class */ (function (_super) {
-        __extends(ListEventRenderer, _super);
-        function ListEventRenderer(listView) {
-            var _this = _super.call(this) || this;
-            _this.listView = listView;
-            return _this;
+    ListViewEventRow.prototype.render = function (props, state, context) {
+        var options = context.options;
+        var seg = props.seg;
+        // TODO: avoid createFormatter, cache!!! see TODO in StandardEvent
+        var timeFormat = createFormatter(options.eventTimeFormat || DEFAULT_TIME_FORMAT, options.defaultRangeSeparator);
+        return (h(EventRoot, { seg: seg, timeText: '' /* BAD. because of all-day content */, disableDragging: true, disableResizing: true, defaultContent: renderEventInnerContent, isPast: props.isPast, isFuture: props.isFuture, isToday: props.isToday, isSelected: props.isSelected, isDragging: props.isDragging, isResizing: props.isResizing, isDateSelecting: props.isDateSelecting }, function (rootElRef, classNames, style, innerElRef, innerContent, hookProps) { return (h("tr", { className: ['fc-list-event', hookProps.event.url ? 'fc-event-forced-url' : ''].concat(classNames).join(' '), ref: rootElRef },
+            buildTimeContent(seg, timeFormat, context),
+            h("td", { class: 'fc-list-event-graphic' },
+                h("span", { class: 'fc-list-event-dot fc-dot', style: {
+                        backgroundColor: hookProps.event.backgroundColor
+                    } })),
+            h("td", { class: 'fc-list-event-title', ref: innerElRef }, innerContent))); }));
+    };
+    return ListViewEventRow;
+}(BaseComponent));
+function renderEventInnerContent(props) {
+    var event = props.event;
+    var url = event.url;
+    var anchorAttrs = url ? { href: url } : {};
+    return (h("a", __assign({}, anchorAttrs), event.title));
+}
+function buildTimeContent(seg, timeFormat, context) {
+    var displayEventTime = context.options.displayEventTime;
+    if (displayEventTime !== false) {
+        var eventDef = seg.eventRange.def;
+        var eventInstance = seg.eventRange.instance;
+        var doAllDay = false;
+        var timeText = void 0;
+        if (eventDef.allDay) {
+            doAllDay = true;
         }
-        ListEventRenderer.prototype.attachSegs = function (segs) {
-            if (!segs.length) {
-                this.listView.renderEmptyMessage();
+        else if (isMultiDayRange(seg.eventRange.range)) { // TODO: use (!isStart || !isEnd) instead?
+            if (seg.isStart) {
+                timeText = buildSegTimeText(seg, timeFormat, context, null, null, eventInstance.range.start, seg.end);
             }
-            else {
-                this.listView.renderSegList(segs);
+            else if (seg.isEnd) {
+                timeText = buildSegTimeText(seg, timeFormat, context, null, null, seg.start, eventInstance.range.end);
             }
-        };
-        ListEventRenderer.prototype.detachSegs = function () {
-        };
-        // generates the HTML for a single event row
-        ListEventRenderer.prototype.renderSegHtml = function (seg) {
-            var _a = this.context, theme = _a.theme, options = _a.options;
-            var eventRange = seg.eventRange;
-            var eventDef = eventRange.def;
-            var eventInstance = eventRange.instance;
-            var eventUi = eventRange.ui;
-            var url = eventDef.url;
-            var classes = ['fc-list-item'].concat(eventUi.classNames);
-            var bgColor = eventUi.backgroundColor;
-            var timeHtml;
-            if (eventDef.allDay) {
-                timeHtml = core.getAllDayHtml(options);
-            }
-            else if (core.isMultiDayRange(eventRange.range)) {
-                if (seg.isStart) {
-                    timeHtml = core.htmlEscape(this._getTimeText(eventInstance.range.start, seg.end, false // allDay
-                    ));
-                }
-                else if (seg.isEnd) {
-                    timeHtml = core.htmlEscape(this._getTimeText(seg.start, eventInstance.range.end, false // allDay
-                    ));
-                }
-                else { // inner segment that lasts the whole day
-                    timeHtml = core.getAllDayHtml(options);
-                }
-            }
             else {
-                // Display the normal time text for the *event's* times
-                timeHtml = core.htmlEscape(this.getTimeText(eventRange));
+                doAllDay = true;
             }
-            if (url) {
-                classes.push('fc-has-url');
-            }
-            return '<tr class="' + classes.join(' ') + '">' +
-                (this.displayEventTime ?
-                    '<td class="fc-list-item-time ' + theme.getClass('widgetContent') + '">' +
-                        (timeHtml || '') +
-                        '</td>' :
-                    '') +
-                '<td class="fc-list-item-marker ' + theme.getClass('widgetContent') + '">' +
-                '<span class="fc-event-dot"' +
-                (bgColor ?
-                    ' style="background-color:' + bgColor + '"' :
-                    '') +
-                '></span>' +
-                '</td>' +
-                '<td class="fc-list-item-title ' + theme.getClass('widgetContent') + '">' +
-                '<a' + (url ? ' href="' + core.htmlEscape(url) + '"' : '') + '>' +
-                core.htmlEscape(eventDef.title || '') +
-                '</a>' +
-                '</td>' +
-                '</tr>';
-        };
-        // like "4:00am"
-        ListEventRenderer.prototype.computeEventTimeFormat = function () {
-            return {
-                hour: 'numeric',
-                minute: '2-digit',
-                meridiem: 'short'
+        }
+        else {
+            timeText = buildSegTimeText(seg, timeFormat, context);
+        }
+        if (doAllDay) {
+            var hookProps = {
+                text: context.options.allDayText,
+                view: context.view
             };
-        };
-        return ListEventRenderer;
-    }(core.FgEventRenderer));
+            return (h(RenderHook, { name: 'allDay', hookProps: hookProps, defaultContent: renderAllDayInner }, function (rootElRef, classNames, innerElRef, innerContent) { return (h("td", { class: ['fc-list-event-time'].concat(classNames).join(' '), ref: rootElRef }, innerContent)); }));
+        }
+        else {
+            return (h("td", { class: 'fc-list-event-time' }, timeText));
+        }
+    }
+    return null;
+}
+function renderAllDayInner(hookProps) {
+    return hookProps.text;
+}
 
-    /*
-    Responsible for the scroller, and forwarding event-related actions into the "grid".
-    */
-    var ListView = /** @class */ (function (_super) {
-        __extends(ListView, _super);
-        function ListView(viewSpec, parentEl) {
-            var _this = _super.call(this, viewSpec, parentEl) || this;
-            _this.computeDateVars = core.memoize(computeDateVars);
-            _this.eventStoreToSegs = core.memoize(_this._eventStoreToSegs);
-            _this.renderSkeleton = core.memoizeRendering(_this._renderSkeleton, _this._unrenderSkeleton);
-            var eventRenderer = _this.eventRenderer = new ListEventRenderer(_this);
-            _this.renderContent = core.memoizeRendering(eventRenderer.renderSegs.bind(eventRenderer), eventRenderer.unrender.bind(eventRenderer), [_this.renderSkeleton]);
-            return _this;
-        }
-        ListView.prototype.firstContext = function (context) {
-            context.calendar.registerInteractiveComponent(this, {
-                el: this.el
-                // TODO: make aware that it doesn't do Hits
-            });
-        };
-        ListView.prototype.render = function (props, context) {
-            _super.prototype.render.call(this, props, context);
-            var _a = this.computeDateVars(props.dateProfile), dayDates = _a.dayDates, dayRanges = _a.dayRanges;
-            this.dayDates = dayDates;
-            this.renderSkeleton(context);
-            this.renderContent(context, this.eventStoreToSegs(props.eventStore, props.eventUiBases, dayRanges));
-        };
-        ListView.prototype.destroy = function () {
-            _super.prototype.destroy.call(this);
-            this.renderSkeleton.unrender();
-            this.renderContent.unrender();
-            this.context.calendar.unregisterInteractiveComponent(this);
-        };
-        ListView.prototype._renderSkeleton = function (context) {
-            var theme = context.theme;
-            this.el.classList.add('fc-list-view');
-            var listViewClassNames = (theme.getClass('listView') || '').split(' '); // wish we didn't have to do this
-            for (var _i = 0, listViewClassNames_1 = listViewClassNames; _i < listViewClassNames_1.length; _i++) {
-                var listViewClassName = listViewClassNames_1[_i];
-                if (listViewClassName) { // in case input was empty string
-                    this.el.classList.add(listViewClassName);
-                }
+/*
+Responsible for the scroller, and forwarding event-related actions into the "grid".
+*/
+var ListView = /** @class */ (function (_super) {
+    __extends(ListView, _super);
+    function ListView() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.computeDateVars = memoize(computeDateVars);
+        _this.eventStoreToSegs = memoize(_this._eventStoreToSegs);
+        _this.setRootEl = function (rootEl) {
+            if (rootEl) {
+                _this.context.calendar.registerInteractiveComponent(_this, {
+                    el: rootEl
+                });
             }
-            this.scroller = new core.ScrollComponent('hidden', // overflow x
-            'auto' // overflow y
-            );
-            this.el.appendChild(this.scroller.el);
-            this.contentEl = this.scroller.el; // shortcut
-        };
-        ListView.prototype._unrenderSkeleton = function () {
-            // TODO: remove classNames
-            this.scroller.destroy(); // will remove the Grid too
-        };
-        ListView.prototype.updateSize = function (isResize, viewHeight, isAuto) {
-            _super.prototype.updateSize.call(this, isResize, viewHeight, isAuto);
-            this.eventRenderer.computeSizes(isResize);
-            this.eventRenderer.assignSizes(isResize);
-            this.scroller.clear(); // sets height to 'auto' and clears overflow
-            if (!isAuto) {
-                this.scroller.setHeight(this.computeScrollerHeight(viewHeight));
+            else {
+                _this.context.calendar.unregisterInteractiveComponent(_this);
             }
         };
-        ListView.prototype.computeScrollerHeight = function (viewHeight) {
-            return viewHeight -
-                core.subtractInnerElHeight(this.el, this.scroller.el); // everything that's NOT the scroller
+        return _this;
+    }
+    ListView.prototype.render = function (props, state, context) {
+        var _this = this;
+        var extraClassNames = ['fc-list'];
+        var themeClassName = context.theme.getClass('bordered');
+        if (themeClassName) {
+            extraClassNames.push(themeClassName);
+        }
+        var _a = this.computeDateVars(props.dateProfile), dayDates = _a.dayDates, dayRanges = _a.dayRanges;
+        var eventSegs = this.eventStoreToSegs(props.eventStore, props.eventUiBases, dayRanges);
+        return (h(ViewRoot, { viewSpec: props.viewSpec, elRef: this.setRootEl }, function (rootElRef, classNames) { return (h("div", { ref: rootElRef, class: extraClassNames.concat(classNames).join(' ') },
+            h(Scroller, { liquid: !props.isHeightAuto, overflowX: 'hidden', overflowY: 'auto' }, eventSegs.length > 0 ?
+                _this.renderSegList(eventSegs, dayDates) :
+                _this.renderEmptyMessage()))); }));
+    };
+    ListView.prototype.renderEmptyMessage = function () {
+        var context = this.context;
+        var hookProps = {
+            text: context.options.noEventsText,
+            view: context.view
         };
-        ListView.prototype._eventStoreToSegs = function (eventStore, eventUiBases, dayRanges) {
-            return this.eventRangesToSegs(core.sliceEventStore(eventStore, eventUiBases, this.props.dateProfile.activeRange, this.context.nextDayThreshold).fg, dayRanges);
-        };
-        ListView.prototype.eventRangesToSegs = function (eventRanges, dayRanges) {
-            var segs = [];
-            for (var _i = 0, eventRanges_1 = eventRanges; _i < eventRanges_1.length; _i++) {
-                var eventRange = eventRanges_1[_i];
-                segs.push.apply(segs, this.eventRangeToSegs(eventRange, dayRanges));
-            }
-            return segs;
-        };
-        ListView.prototype.eventRangeToSegs = function (eventRange, dayRanges) {
-            var _a = this.context, dateEnv = _a.dateEnv, nextDayThreshold = _a.nextDayThreshold;
-            var range = eventRange.range;
-            var allDay = eventRange.def.allDay;
-            var dayIndex;
-            var segRange;
-            var seg;
-            var segs = [];
-            for (dayIndex = 0; dayIndex < dayRanges.length; dayIndex++) {
-                segRange = core.intersectRanges(range, dayRanges[dayIndex]);
-                if (segRange) {
-                    seg = {
-                        component: this,
-                        eventRange: 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(),
-                        dayIndex: 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 (h(RenderHook, { name: 'noEvents', hookProps: hookProps, defaultContent: renderNoEventsInner }, function (rootElRef, classNames, innerElRef, innerContent) { return (h("div", { className: ['fc-list-empty'].concat(classNames).join(' '), ref: rootElRef },
+            h("div", { className: 'fc-list-empty-inner', ref: innerElRef }, innerContent))); }));
+    };
+    ListView.prototype.renderSegList = function (allSegs, dayDates) {
+        var _a = this.context, theme = _a.theme, eventOrderSpecs = _a.eventOrderSpecs;
+        var segsByDay = groupSegsByDay(allSegs); // sparse array
+        return (h(NowTimer, { unit: 'day', content: function (nowDate, todayRange) {
+                var innerNodes = [];
+                for (var dayIndex = 0; dayIndex < segsByDay.length; dayIndex++) {
+                    var daySegs = segsByDay[dayIndex];
+                    if (daySegs) { // sparse array, so might be undefined
+                        // append a day header
+                        innerNodes.push(h(ListViewHeaderRow, { dayDate: dayDates[dayIndex], todayRange: todayRange }));
+                        daySegs = sortEventSegs(daySegs, eventOrderSpecs);
+                        for (var _i = 0, daySegs_1 = daySegs; _i < daySegs_1.length; _i++) {
+                            var seg = daySegs_1[_i];
+                            innerNodes.push(h(ListViewEventRow, __assign({ seg: seg, isDragging: false, isResizing: false, isDateSelecting: false, isSelected: false }, getSegMeta(seg, todayRange, nowDate))));
+                        }
                     }
                 }
-            }
-            return segs;
-        };
-        ListView.prototype.renderEmptyMessage = function () {
-            this.contentEl.innerHTML =
-                '<div class="fc-list-empty-wrap2">' + // TODO: try less wraps
-                    '<div class="fc-list-empty-wrap1">' +
-                    '<div class="fc-list-empty">' +
-                    core.htmlEscape(this.context.options.noEventsMessage) +
-                    '</div>' +
-                    '</div>' +
-                    '</div>';
-        };
-        // called by ListEventRenderer
-        ListView.prototype.renderSegList = function (allSegs) {
-            var theme = this.context.theme;
-            var segsByDay = this.groupSegsByDay(allSegs); // sparse array
-            var dayIndex;
-            var daySegs;
-            var i;
-            var tableEl = core.htmlToElement('<table class="fc-list-table ' + theme.getClass('tableList') + '"><tbody></tbody></table>');
-            var tbodyEl = tableEl.querySelector('tbody');
-            for (dayIndex = 0; dayIndex < segsByDay.length; dayIndex++) {
-                daySegs = segsByDay[dayIndex];
-                if (daySegs) { // sparse array, so might be undefined
-                    // append a day header
-                    tbodyEl.appendChild(this.buildDayHeaderRow(this.dayDates[dayIndex]));
-                    daySegs = this.eventRenderer.sortEventSegs(daySegs);
-                    for (i = 0; i < daySegs.length; i++) {
-                        tbodyEl.appendChild(daySegs[i].el); // append event row
-                    }
+                return (h("table", { class: 'fc-list-table ' + theme.getClass('table') },
+                    h("tbody", null, innerNodes)));
+            } }));
+    };
+    ListView.prototype._eventStoreToSegs = function (eventStore, eventUiBases, dayRanges) {
+        return this.eventRangesToSegs(sliceEventStore(eventStore, eventUiBases, this.props.dateProfile.activeRange, this.context.nextDayThreshold).fg, dayRanges);
+    };
+    ListView.prototype.eventRangesToSegs = function (eventRanges, dayRanges) {
+        var segs = [];
+        for (var _i = 0, eventRanges_1 = eventRanges; _i < eventRanges_1.length; _i++) {
+            var eventRange = eventRanges_1[_i];
+            segs.push.apply(segs, this.eventRangeToSegs(eventRange, dayRanges));
+        }
+        return segs;
+    };
+    ListView.prototype.eventRangeToSegs = function (eventRange, dayRanges) {
+        var _a = this.context, dateEnv = _a.dateEnv, nextDayThreshold = _a.nextDayThreshold;
+        var range = eventRange.range;
+        var allDay = eventRange.def.allDay;
+        var dayIndex;
+        var segRange;
+        var seg;
+        var segs = [];
+        for (dayIndex = 0; dayIndex < dayRanges.length; dayIndex++) {
+            segRange = intersectRanges(range, dayRanges[dayIndex]);
+            if (segRange) {
+                seg = {
+                    component: this,
+                    eventRange: 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(),
+                    dayIndex: 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;
                 }
             }
-            this.contentEl.innerHTML = '';
-            this.contentEl.appendChild(tableEl);
-        };
-        // Returns a sparse array of arrays, segs grouped by their dayIndex
-        ListView.prototype.groupSegsByDay = function (segs) {
-            var segsByDay = []; // sparse array
-            var i;
-            var seg;
-            for (i = 0; i < segs.length; i++) {
-                seg = segs[i];
-                (segsByDay[seg.dayIndex] || (segsByDay[seg.dayIndex] = []))
-                    .push(seg);
-            }
-            return segsByDay;
-        };
-        // generates the HTML for the day headers that live amongst the event rows
-        ListView.prototype.buildDayHeaderRow = function (dayDate) {
-            var _a = this.context, theme = _a.theme, dateEnv = _a.dateEnv, options = _a.options;
-            var mainFormat = core.createFormatter(options.listDayFormat); // TODO: cache
-            var altFormat = core.createFormatter(options.listDayAltFormat); // TODO: cache
-            return core.createElement('tr', {
-                className: 'fc-list-heading',
-                'data-date': dateEnv.formatIso(dayDate, { omitTime: true })
-            }, '<td class="' + (theme.getClass('tableListHeading') ||
-                theme.getClass('widgetHeader')) + '" colspan="3">' +
-                (mainFormat ?
-                    core.buildGotoAnchorHtml(options, dateEnv, dayDate, { 'class': 'fc-list-heading-main' }, core.htmlEscape(dateEnv.format(dayDate, mainFormat)) // inner HTML
-                    ) :
-                    '') +
-                (altFormat ?
-                    core.buildGotoAnchorHtml(options, dateEnv, dayDate, { 'class': 'fc-list-heading-alt' }, core.htmlEscape(dateEnv.format(dayDate, altFormat)) // inner HTML
-                    ) :
-                    '') +
-                '</td>');
-        };
-        return ListView;
-    }(core.View));
-    ListView.prototype.fgSegSelector = '.fc-list-item'; // which elements accept event actions
-    function computeDateVars(dateProfile) {
-        var dayStart = core.startOfDay(dateProfile.renderRange.start);
-        var viewEnd = dateProfile.renderRange.end;
-        var dayDates = [];
-        var dayRanges = [];
-        while (dayStart < viewEnd) {
-            dayDates.push(dayStart);
-            dayRanges.push({
-                start: dayStart,
-                end: core.addDays(dayStart, 1)
-            });
-            dayStart = core.addDays(dayStart, 1);
         }
-        return { dayDates: dayDates, dayRanges: dayRanges };
+        return segs;
+    };
+    return ListView;
+}(DateComponent));
+function renderNoEventsInner(hookProps) {
+    return hookProps.text;
+}
+function computeDateVars(dateProfile) {
+    var dayStart = startOfDay(dateProfile.renderRange.start);
+    var viewEnd = dateProfile.renderRange.end;
+    var dayDates = [];
+    var dayRanges = [];
+    while (dayStart < viewEnd) {
+        dayDates.push(dayStart);
+        dayRanges.push({
+            start: dayStart,
+            end: addDays(dayStart, 1)
+        });
+        dayStart = addDays(dayStart, 1);
     }
+    return { dayDates: dayDates, dayRanges: dayRanges };
+}
+// Returns a sparse array of arrays, segs grouped by their dayIndex
+function groupSegsByDay(segs) {
+    var segsByDay = []; // sparse array
+    var i;
+    var seg;
+    for (i = 0; i < segs.length; i++) {
+        seg = segs[i];
+        (segsByDay[seg.dayIndex] || (segsByDay[seg.dayIndex] = []))
+            .push(seg);
+    }
+    return segsByDay;
+}
 
-    var main = core.createPlugin({
-        views: {
-            list: {
-                class: ListView,
-                buttonTextKey: 'list',
-                listDayFormat: { month: 'long', day: 'numeric', year: 'numeric' } // like "January 1, 2016"
-            },
-            listDay: {
-                type: 'list',
-                duration: { days: 1 },
-                listDayFormat: { weekday: 'long' } // day-of-week is all we need. full date is probably in header
-            },
-            listWeek: {
-                type: 'list',
-                duration: { weeks: 1 },
-                listDayFormat: { weekday: 'long' },
-                listDayAltFormat: { month: 'long', day: 'numeric', year: 'numeric' }
-            },
-            listMonth: {
-                type: 'list',
-                duration: { month: 1 },
-                listDayAltFormat: { weekday: 'long' } // day-of-week is nice-to-have
-            },
-            listYear: {
-                type: 'list',
-                duration: { year: 1 },
-                listDayAltFormat: { weekday: 'long' } // day-of-week is nice-to-have
-            }
+var main = createPlugin({
+    views: {
+        list: {
+            component: ListView,
+            buttonTextKey: 'list',
+            listDayFormat: { month: 'long', day: 'numeric', year: 'numeric' } // like "January 1, 2016"
+        },
+        listDay: {
+            type: 'list',
+            duration: { days: 1 },
+            listDayFormat: { weekday: 'long' } // day-of-week is all we need. full date is probably in header
+        },
+        listWeek: {
+            type: 'list',
+            duration: { weeks: 1 },
+            listDayFormat: { weekday: 'long' },
+            listDaySideFormat: { month: 'long', day: 'numeric', year: 'numeric' }
+        },
+        listMonth: {
+            type: 'list',
+            duration: { month: 1 },
+            listDaySideFormat: { weekday: 'long' } // day-of-week is nice-to-have
+        },
+        listYear: {
+            type: 'list',
+            duration: { year: 1 },
+            listDaySideFormat: { weekday: 'long' } // day-of-week is nice-to-have
         }
-    });
+    }
+});
 
-    exports.ListView = ListView;
-    exports.default = main;
-
-    Object.defineProperty(exports, '__esModule', { value: true });
-
-}));
+export default main;
+export { ListView };

package.json

 {
   "name": "@fullcalendar/list",
-  "version": "4.4.0",
+  "version": "5.0.0-beta",
   "title": "FullCalendar List View Plugin",
@@ -26,9 +26,10 @@ "description": "View your events as a bulleted list",
   "copyright": "2019 Adam Shaw",
+  "dependencies": {
+    "tslib": "^1.9.3"
+  },
   "peerDependencies": {
-    "@fullcalendar/core": "~4.4.0"
+    "@fullcalendar/core": "5.0.0-beta"
   },
   "main": "main.js",
-  "module": "main.esm.js",
-  "unpkg": "main.min.js",
   "types": "main.d.ts"
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Deprecated

Maintenance

The maintainer of the package marked it as deprecated. This could indicate that a single version should not be used, or that the package is no longer maintained and any new vulnerabilities will not be fixed.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 1 instance in 1 package

Mixed license

License

(Experimental) Package contains multiple licenses.

Found 1 instance in 1 package

Improved metrics

Number of low license alerts

0

decreased by-100%

Worsened metrics

Total package byte prevSize

18593

decreased by-74.16%

Dependency count

2

increased by100%

Number of package files

6

decreased by-40%

Lines of code

372

decreased by-54.47%

Number of medium maintenance alerts

1

increased byInfinity%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Addedtslib@^1.9.3

• + Added@fullcalendar/core@5.0.0-beta(transitive)

• + Addedtslib@1.14.1(transitive)

• - Removed@fullcalendar/core@4.4.2(transitive)