@progress/kendo-angular-scheduler 2.1.6-dev.202111010913 → 2.2.0-dev.202112171600

package/dist/es/views/month/month-view-renderer.component.js

@@ -3,7 +3,7 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import * as tslib_1 from "tslib";
-import { Component, Input, NgZone, ElementRef, Renderer2, TemplateRef } from '@angular/core';
+import { Component, Input, NgZone, ElementRef, Renderer2, TemplateRef, ChangeDetectorRef } from '@angular/core';
 import { IntlService } from '@progress/kendo-angular-intl';
 import { isChanged } from '@progress/kendo-angular-common';
 import { addDays, addMonths, firstDayInWeek, firstDayOfMonth, getDate, toLocalDate } from '@progress/kendo-date-math';
@@ -23,8 +23,8 @@ var WEEKS_COUNT = 6;
  */
 var MonthViewRendererComponent = /** @class */ (function (_super) {
     tslib_1.__extends(MonthViewRendererComponent, _super);
-    function MonthViewRendererComponent(viewContext, viewState, intl, slotService, zone, element, renderer, pdfService, localization) {
-        var _this = _super.call(this, viewContext, viewState, intl, slotService, zone, renderer, element, pdfService, localization) || this;
+    function MonthViewRendererComponent(viewContext, viewState, intl, slotService, zone, element, renderer, pdfService, localization, changeDetector) {
+        var _this = _super.call(this, viewContext, viewState, intl, slotService, zone, renderer, element, pdfService, localization, changeDetector) || this;
         _this.resizeHintFormat = { skeleton: 'Md' };
         _this.weeks = [];
         return _this;
@@ -77,6 +77,12 @@ var MonthViewRendererComponent = /** @class */ (function (_super) {
             });
         }
     };
+    MonthViewRendererComponent.prototype.cellTitle = function (value) {
+        return this.intl.formatDate(value, 'D');
+    };
+    MonthViewRendererComponent.prototype.addDay = function (dayStart) {
+        return addDays(dayStart, 1);
+    };
     MonthViewRendererComponent.prototype.optionsChange = function (changes) {
         this.schedulerMonthDaySlotTemplate = changes.monthDaySlotTemplate;
         _super.prototype.optionsChange.call(this, changes);
@@ -191,7 +197,7 @@ var MonthViewRendererComponent = /** @class */ (function (_super) {
             providers: [
                 MonthSlotService
             ],
-            template: "\n        <div class=\"k-scheduler-layout k-scheduler-monthview k-scheduler-flex-layout\">\n            <div class=\"k-scheduler-pane\">\n                <div class=\"k-scheduler-times\" #timesHeader *ngIf=\"verticalResources.length\">\n                    <table class=\"k-scheduler-table\" aria-hidden=\"true\">\n                        <tr>\n                            <th></th>\n                        </tr>\n                    </table>\n                </div>\n                <div class=\"k-scheduler-header k-state-default\" #header>\n                    <div class=\"k-scheduler-header-wrap\" #headerWrap>\n                       <table class=\"k-scheduler-table\" aria-hidden=\"true\">\n                         <tr *ngFor=\"let resource of horizontalResources; let resourceIndex = index; trackBy: itemIndex\">\n                             <th *ngFor=\"let item of horizontalResources | resourceIterator : resourceIndex; trackBy: itemIndex\"\n                                 class=\"k-slot-cell\" [attr.colspan]=\"horizontalColspan(resourceIndex)\">\n                                <ng-container *ngIf=\"!groupHeaderTemplateRef\">{{ getField(item, resource.textField) }}</ng-container>\n                                <ng-container *ngIf=\"groupHeaderTemplateRef\" [ngTemplateOutlet]=\"groupHeaderTemplateRef\" [ngTemplateOutletContext]=\"{ resource: item }\"></ng-container>\n                             </th>\n                         </tr>\n                         <tr>\n                             <ng-container *ngFor=\"let resource of horizontalResources | resourceIterator; trackBy: itemIndex\">\n                                 <th *ngFor=\"let day of weeks[0]; trackBy: itemIndex\">\n                                     {{ day | kendoDate: 'EEEE' }}\n                                 </th>\n                             </ng-container>\n                         </tr>\n                       </table>\n                    </div>\n                </div>\n            </div>\n            <div class=\"k-scheduler-pane\">\n                <div class=\"k-scheduler-times k-scheduler-resources\" #times *ngIf=\"verticalResources.length\">\n                    <table class=\"k-scheduler-table\" #timesTable aria-hidden=\"true\">\n                        <ng-container *ngFor=\"let resourceItem of verticalResources | resourceIterator; let leafIndex = index; trackBy: itemIndex\">\n                            <tr>\n                                <ng-container *ngFor=\"let resource of verticalResources; let resourceIndex = index; trackBy: itemIndex\">\n                                    <th *ngIf=\"verticalItem(leafIndex, resourceIndex)\" [attr.rowspan]=\"verticalRowspan(resourceIndex)\" class=\"k-slot-cell\" [ngClass]=\"{ 'k-last-resource': resourceIndex === verticalResources.length - 1 }\">\n                                        <ng-container *ngIf=\"!groupHeaderTemplateRef\">{{ getField(verticalItem(leafIndex, resourceIndex), resource.textField) }}</ng-container>\n                                        <ng-container *ngIf=\"groupHeaderTemplateRef\" [ngTemplateOutlet]=\"groupHeaderTemplateRef\"\n                                            [ngTemplateOutletContext]=\"{ resource: verticalItem(leafIndex, resourceIndex) }\"></ng-container>\n                                    </th>\n                                </ng-container>\n                                <th class=\"k-slot-cell k-empty-slot\">\n                                </th>\n                            </tr>\n                            <tr *ngFor=\"let index of 5 | repeat; trackBy: itemIndex\">\n                                <th class=\"k-slot-cell k-empty-slot\"></th>\n                            </tr>\n                        </ng-container>\n                    </table>\n                </div>\n                <div class=\"k-scheduler-content\" #content>\n                     <table class=\"k-scheduler-table\" #contentTable role=\"presentation\">\n                         <ng-container *ngFor=\"let resourceItem of verticalResources | resourceIterator; let verticalIndex = index; trackBy: itemIndex\">\n                             <tr *ngFor=\"let week of weeks;  let rangeIndex = index; trackBy: itemIndex\">\n                                <ng-container *ngFor=\"let resource of horizontalResources | resourceIterator; let horizontalIndex = index; trackBy: itemIndex\">\n                                     <td *ngFor=\"let day of week; let index = index; trackBy: itemIndex\"\n                                         monthSlot\n                                         [ngClass]=\"daySlotClass(day, verticalResources.length ? verticalIndex : horizontalIndex)\"\n                                         [start]=\"day\"\n                                         [id]=\"{ resourceIndex: verticalResources.length ? verticalIndex : horizontalIndex, rangeIndex: rangeIndex, index: index }\"\n                                        >\n                                        <span class=\"k-link k-nav-day\" *ngIf=\"!monthDaySlotTemplateRef\">{{ day | kendoDate: 'dd' }}</span>\n                                        <ng-container *ngIf=\"monthDaySlotTemplateRef\" [ngTemplateOutlet]=\"monthDaySlotTemplateRef\"\n                                            [ngTemplateOutletContext]=\"{ date: day, resources: resourcesByIndex(verticalResources.length ? verticalIndex : horizontalIndex) }\"></ng-container>\n                                     </td>\n                                </ng-container>\n                             </tr>\n                         </ng-container>\n                     </table>\n                     <ng-container *ngFor=\"let item of items | async; trackBy: itemIndex\">\n                         <div *ngFor=\"let itemResource of item.resources; trackBy: itemIndex\"\n                            [ngClass]=\"getEventClasses(item, itemResource.resources)\"\n                            [ngStyle]=\"getEventStyles(item, itemResource)\"\n                            [kendoSchedulerFocusIndex]=\"itemResource.leafIdx\"\n                            monthViewItem\n                                [editable]=\"editable\"\n                                [item]=\"item\"\n                                [index]=\"item.index\"\n                                [rangeIndex]=\"item.rangeIndex\"\n                                [eventTemplate]=\"eventTemplateRef\"\n                                [resources]=\"itemResource.resources\"\n                                [resourceIndex]=\"itemResource.leafIdx\">\n                         </div>\n                     </ng-container>\n                     <kendo-hint-container #hintContainer>\n                        <ng-template>\n                            <div *ngFor=\"let hint of dragHints; trackBy: itemIndex;\"\n                                class=\"k-event-drag-hint\"\n                                monthViewItem\n                                    [ngStyle]=\"hint.style\"\n                                    [ngClass]=\"hint.class\"\n                                    [dragHint]=\"true\"\n                                    [eventTemplate]=\"eventTemplateRef\"\n                                    [item]=\"hint.item\"\n                                    [resources]=\"hint.resources\">\n                            </div>\n\n                            <div *ngFor=\"let hint of resizeHints; trackBy: itemIndex;\"\n                                kendoResizeHint\n                                    [hint]=\"hint\"\n                                    [ngClass]=\"hint.class\"\n                                    [format]=\"resizeHintFormat\">\n                            </div>\n                        </ng-template>\n                     </kendo-hint-container>\n                </div>\n            </div>\n        </div>\n    "
+            template: "\n        <div class=\"k-scheduler-layout k-scheduler-monthview k-scheduler-flex-layout\">\n            <div class=\"k-scheduler-pane\">\n                <div class=\"k-scheduler-times\" #timesHeader *ngIf=\"verticalResources.length\">\n                    <table class=\"k-scheduler-table\" aria-hidden=\"true\">\n                        <tr>\n                            <th></th>\n                        </tr>\n                    </table>\n                </div>\n                <div class=\"k-scheduler-header k-state-default\" #header>\n                    <div class=\"k-scheduler-header-wrap\" #headerWrap>\n                       <table class=\"k-scheduler-table\" aria-hidden=\"true\">\n                         <tr *ngFor=\"let resource of horizontalResources; let resourceIndex = index; trackBy: itemIndex\">\n                             <th *ngFor=\"let item of horizontalResources | resourceIterator : resourceIndex; trackBy: itemIndex\"\n                                 class=\"k-slot-cell\" [attr.colspan]=\"horizontalColspan(resourceIndex)\">\n                                <ng-container *ngIf=\"!groupHeaderTemplateRef\">{{ getField(item, resource.textField) }}</ng-container>\n                                <ng-container *ngIf=\"groupHeaderTemplateRef\" [ngTemplateOutlet]=\"groupHeaderTemplateRef\" [ngTemplateOutletContext]=\"{ resource: item }\"></ng-container>\n                             </th>\n                         </tr>\n                         <tr>\n                             <ng-container *ngFor=\"let resource of horizontalResources | resourceIterator; trackBy: itemIndex\">\n                                 <th *ngFor=\"let day of weeks[0]; trackBy: itemIndex\">\n                                     {{ day | kendoDate: 'EEEE' }}\n                                 </th>\n                             </ng-container>\n                         </tr>\n                       </table>\n                    </div>\n                </div>\n            </div>\n            <div class=\"k-scheduler-pane\">\n                <div class=\"k-scheduler-times k-scheduler-resources\" #times *ngIf=\"verticalResources.length\">\n                    <table class=\"k-scheduler-table\" #timesTable aria-hidden=\"true\">\n                        <ng-container *ngFor=\"let resourceItem of verticalResources | resourceIterator; let leafIndex = index; trackBy: itemIndex\">\n                            <tr>\n                                <ng-container *ngFor=\"let resource of verticalResources; let resourceIndex = index; trackBy: itemIndex\">\n                                    <th *ngIf=\"verticalItem(leafIndex, resourceIndex)\" [attr.rowspan]=\"verticalRowspan(resourceIndex)\" class=\"k-slot-cell\" [ngClass]=\"{ 'k-last-resource': resourceIndex === verticalResources.length - 1 }\">\n                                        <ng-container *ngIf=\"!groupHeaderTemplateRef\">{{ getField(verticalItem(leafIndex, resourceIndex), resource.textField) }}</ng-container>\n                                        <ng-container *ngIf=\"groupHeaderTemplateRef\" [ngTemplateOutlet]=\"groupHeaderTemplateRef\"\n                                            [ngTemplateOutletContext]=\"{ resource: verticalItem(leafIndex, resourceIndex) }\"></ng-container>\n                                    </th>\n                                </ng-container>\n                                <th class=\"k-slot-cell k-empty-slot\">\n                                </th>\n                            </tr>\n                            <tr *ngFor=\"let index of 5 | repeat; trackBy: itemIndex\">\n                                <th class=\"k-slot-cell k-empty-slot\"></th>\n                            </tr>\n                        </ng-container>\n                    </table>\n                </div>\n                <div class=\"k-scheduler-content\" #content>\n                     <table class=\"k-scheduler-table k-user-select-none\" #contentTable role=\"presentation\">\n                         <ng-container *ngFor=\"let resourceItem of verticalResources | resourceIterator; let verticalIndex = index; trackBy: itemIndex\">\n                             <tr *ngFor=\"let week of weeks;  let rangeIndex = index; trackBy: itemIndex\">\n                                <ng-container *ngFor=\"let resource of horizontalResources | resourceIterator; let horizontalIndex = index; trackBy: itemIndex\">\n                                     <td *ngFor=\"let day of week; let index = index; trackBy: itemIndex\"\n                                         monthSlot\n                                         [ngClass]=\"daySlotClass(day, verticalResources.length ? verticalIndex : horizontalIndex)\"\n                                         [start]=\"day\"\n                                         [id]=\"{ resourceIndex: verticalResources.length ? verticalIndex : horizontalIndex, rangeIndex: rangeIndex, index: index }\"\n                                         [title]=\"cellTitle(day)\"\n                                         [class.k-state-selected]=\"isSlotSelected({\n                                             start: toPlainDate(day),\n                                             end: addDay(toPlainDate(day)),\n                                             isAllDay: true,\n                                             resources: resourcesByIndex(verticalResources.length ? verticalIndex : horizontalIndex)\n                                         })\"\n                                        >\n                                        <span aria-hidden=\"true\" class=\"k-link k-nav-day\" *ngIf=\"!monthDaySlotTemplateRef\">{{ day | kendoDate: 'dd' }}</span>\n                                        <ng-container *ngIf=\"monthDaySlotTemplateRef\" [ngTemplateOutlet]=\"monthDaySlotTemplateRef\"\n                                            [ngTemplateOutletContext]=\"{ date: day, resources: resourcesByIndex(verticalResources.length ? verticalIndex : horizontalIndex) }\"></ng-container>\n                                     </td>\n                                </ng-container>\n                             </tr>\n                         </ng-container>\n                     </table>\n                     <ng-container *ngFor=\"let item of items | async; trackBy: itemIndex\">\n                         <div *ngFor=\"let itemResource of item.resources; trackBy: itemIndex\"\n                            [ngClass]=\"getEventClasses(item, itemResource.resources)\"\n                            [ngStyle]=\"getEventStyles(item, itemResource)\"\n                            [kendoSchedulerFocusIndex]=\"itemResource.leafIdx\"\n                            monthViewItem\n                                [editable]=\"editable\"\n                                [item]=\"item\"\n                                [index]=\"item.index\"\n                                [rangeIndex]=\"item.rangeIndex\"\n                                [eventTemplate]=\"eventTemplateRef\"\n                                [resources]=\"itemResource.resources\"\n                                [resourceIndex]=\"itemResource.leafIdx\">\n                         </div>\n                     </ng-container>\n                     <kendo-hint-container #hintContainer>\n                        <ng-template>\n                            <div *ngFor=\"let hint of dragHints; trackBy: itemIndex;\"\n                                class=\"k-event-drag-hint\"\n                                monthViewItem\n                                    [ngStyle]=\"hint.style\"\n                                    [ngClass]=\"hint.class\"\n                                    [dragHint]=\"true\"\n                                    [eventTemplate]=\"eventTemplateRef\"\n                                    [item]=\"hint.item\"\n                                    [resources]=\"hint.resources\">\n                            </div>\n\n                            <div *ngFor=\"let hint of resizeHints; trackBy: itemIndex;\"\n                                kendoResizeHint\n                                    [hint]=\"hint\"\n                                    [ngClass]=\"hint.class\"\n                                    [format]=\"resizeHintFormat\">\n                            </div>\n                        </ng-template>\n                     </kendo-hint-container>\n                </div>\n            </div>\n        </div>\n    "
         }),
         tslib_1.__metadata("design:paramtypes", [ViewContextService,
             ViewStateService,
@@ -201,7 +207,8 @@ var MonthViewRendererComponent = /** @class */ (function (_super) {
             ElementRef,
             Renderer2,
             PDFService,
-            LocalizationService])
+            LocalizationService,
+            ChangeDetectorRef])
     ], MonthViewRendererComponent);
     return MonthViewRendererComponent;
 }(BaseView));

package/dist/es/views/multi-day/multi-day-view-renderer.component.js

@@ -175,8 +175,8 @@ var MultiDayViewRendererComponent = /** @class */ (function (_super) {
         }
         _super.prototype.updateHintContainer.call(this);
     };
-    MultiDayViewRendererComponent.prototype.onRelease = function () {
-        _super.prototype.onRelease.call(this);
+    MultiDayViewRendererComponent.prototype.onRelease = function (args) {
+        _super.prototype.onRelease.call(this, args);
         this.dragContainers = null;
     };
     MultiDayViewRendererComponent.prototype.updateDragContainer = function (args) {
@@ -305,7 +305,7 @@ var MultiDayViewRendererComponent = /** @class */ (function (_super) {
             providers: [
                 DayTimeSlotService
             ],
-            template: "\n        <div class=\"k-scheduler-layout k-scheduler-flex-layout\" [ngClass]=\"classNames\">\n            <div class=\"k-scheduler-pane\">\n                <div class=\"k-scheduler-times\" #timesHeader>\n                    <table class=\"k-scheduler-table\" aria-hidden=\"true\">\n                        <tr *ngFor=\"let resource of horizontalResources; trackBy: itemIndex;\">\n                            <th></th>\n                        </tr>\n                        <tr>\n                            <th>\u200B</th>\n                        </tr>\n                        <tr *ngIf=\"!verticalResources.length\">\n                            <th class=\"k-scheduler-times-all-day\" #allDayCell>{{ allDayMessage }}</th>\n                        </tr>\n                    </table>\n                </div>\n                <div class=\"k-scheduler-header k-state-default\" #header>\n                    <div class=\"k-scheduler-header-wrap\" #headerWrap>\n                        <table class=\"k-scheduler-table\" aria-hidden=\"true\">\n                            <tr *ngFor=\"let resource of horizontalResources; let resourceIndex = index; trackBy: itemIndex;\">\n                                <th *ngFor=\"let item of horizontalResources | resourceIterator : resourceIndex; trackBy: itemIndex;\"\n                                    class=\"k-slot-cell\" [attr.colspan]=\"horizontalColspan(resourceIndex)\">\n                                    <ng-container *ngIf=\"!groupHeaderTemplateRef\">{{ getField(item, resource.textField) }}</ng-container>\n                                    <ng-container *ngIf=\"groupHeaderTemplateRef\" [ngTemplateOutlet]=\"groupHeaderTemplateRef\" [ngTemplateOutletContext]=\"{ resource: item }\"></ng-container>\n                                </th>\n                            </tr>\n                            <tr>\n                                <ng-container *ngFor=\"let resource of horizontalResources | resourceIterator; trackBy: itemIndex;\">\n                                    <th *ngFor=\"let slot of daySlots; let index = index; trackBy: itemIndex\">\n                                        <span *ngIf=\"!dateHeaderTemplateRef\" class=\"k-link k-nav-day\" [attr.data-dayslot-index]=\"index\">{{ slot.start | kendoDate: dateFormat }}</span>\n                                        <ng-container *ngIf=\"dateHeaderTemplateRef\" [ngTemplateOutlet]=\"dateHeaderTemplateRef\" [ngTemplateOutletContext]=\"{ date: slot.start }\"></ng-container>\n                                    </th>\n                                </ng-container>\n                            </tr>\n                        </table>\n                        <div style=\"position: relative;\" *ngIf=\"!verticalResources.length\">\n                            <table class=\"k-scheduler-table k-scheduler-header-all-day\" aria-hidden=\"true\">\n                                <tr>\n                                    <ng-container *ngFor=\"let resource of horizontalResources | resourceIterator; let resourceIndex = index; trackBy: itemIndex;\">\n                                        <td *ngFor=\"let slot of daySlots; let index = index; trackBy: itemIndex\"\n                                            daySlot\n                                            [start]=\"slot.start\"\n                                            [end]=\"slot.end\"\n                                            [id]=\"{ resourceIndex: resourceIndex, rangeIndex: 0, index: index }\"\n                                            [ngClass]=\"allDaySlotClass(slot, resourceIndex)\">\n                                            <ng-container *ngIf=\"allDaySlotTemplateRef\" [ngTemplateOutlet]=\"allDaySlotTemplateRef\"\n                                                [ngTemplateOutletContext]=\"{ date: slot.start, resources: resourcesByIndex(resourceIndex) }\"></ng-container>\n                                        </td>\n                                    </ng-container>\n                                </tr>\n                            </table>\n                            <ng-container *ngFor=\"let item of allDayItems | async; trackBy: itemIndex;\">\n                                <div *ngFor=\"let itemResource of item.resources; trackBy: itemIndex;\"\n                                    [ngClass]=\"getEventClasses(item, itemResource.resources, true)\"\n                                    [ngStyle]=\"getEventStyles(item, itemResource, true)\"\n                                    [kendoSchedulerFocusIndex]=\"itemResource.leafIdx\"\n                                     dayTimeViewItem\n                                        [isAllDay]=\"true\"\n                                        [editable]=\"editable\"\n                                        [eventTemplate]=\"allDayEventTemplateRef\"\n                                        [item]=\"item\"\n                                        [index]=\"item.index\"\n                                        [rangeIndex]=\"item.rangeIndex\"\n                                        [resources]=\"itemResource.resources\"\n                                        [resourceIndex]=\"itemResource.leafIdx\">\n                                </div>\n                            </ng-container>\n                            <kendo-hint-container #headerHintContainer>\n                                <ng-template>\n                                    <div *ngIf=\"dragHints.length && allDayDragHint\"\n                                        class=\"k-event-drag-hint\"\n                                        dayTimeViewItem\n                                            [isAllDay]=\"true\"\n                                            [ngStyle]=\"dragHints[0].style\"\n                                            [ngClass]=\"dragHints[0].class\"\n                                            [dragHint]=\"true\"\n                                            [eventTemplate]=\"eventTemplateRef\"\n                                            [item]=\"dragHints[0].item\"\n                                            [resources]=\"dragHints[0].resources\">\n                                    </div>\n\n                                    <div *ngIf=\"resizeHints.length && allDayResizeHint\"\n                                        kendoResizeHint\n                                            [hint]=\"resizeHints[0]\"\n                                            [ngClass]=\"resizeHints[0].class\"\n                                            [format]=\"allDayResizeHintFormat\">\n                                    </div>\n                                </ng-template>\n                            </kendo-hint-container>\n                        </div>\n                    </div>\n                </div>\n            </div>\n            <div class=\"k-scheduler-pane\">\n                <div class=\"k-scheduler-times\" #times>\n                    <ng-container *ngIf=\"showCurrentTime\">\n                        <div *ngFor=\"let resource of verticalResources | resourceIterator; trackBy: itemIndex;\"\n                            #currentTimeArrow class=\"k-current-time k-current-time-arrow-right\">\n                        </div>\n                    </ng-container>\n                    <table class=\"k-scheduler-table\" #timesTable aria-hidden=\"true\">\n                        <ng-container *ngFor=\"let resourceItem of verticalResources | resourceIterator; let leafIndex = index; trackBy: itemIndex;\">\n                            <tr *ngIf=\"verticalResources.length\">\n                                <ng-container *ngFor=\"let resource of verticalResources; let resourceIndex = index; trackBy: itemIndex;\">\n                                    <th *ngIf=\"verticalItem(leafIndex, resourceIndex)\" [attr.rowspan]=\"verticalRowspan(resourceIndex)\" class=\"k-slot-cell\">\n                                        <ng-container *ngIf=\"!groupHeaderTemplateRef\">{{ getField(verticalItem(leafIndex, resourceIndex), resource.textField) }}</ng-container>\n                                        <ng-container *ngIf=\"groupHeaderTemplateRef\" [ngTemplateOutlet]=\"groupHeaderTemplateRef\"\n                                            [ngTemplateOutletContext]=\"{ resource: verticalItem(leafIndex, resourceIndex) }\"></ng-container>\n                                    </th>\n                                </ng-container>\n                                <th class=\"k-scheduler-times-all-day\" #allDayCell>{{ allDayMessage }}</th>\n                            </tr>\n                            <tr *ngFor=\"let slot of timeSlots; let timeSlotIndex = index;trackBy: itemIndex\">\n                                <th *ngIf=\"slot.isMajor\" [ngClass]=\"{ 'k-slot-cell': slotDivisions === 1 }\">\n                                    <ng-container *ngIf=\"!majorTimeHeaderTemplateRef\">{{ slot.start | kendoDate: 't' }}</ng-container>\n                                    <ng-container *ngIf=\"majorTimeHeaderTemplateRef\" [ngTemplateOutlet]=\"majorTimeHeaderTemplateRef\" [ngTemplateOutletContext]=\"{ date: slot.start }\"></ng-container>\n                                </th>\n                                <th *ngIf=\"!slot.isMajor\" [ngClass]=\"{ 'k-slot-cell': timeSlotIndex % slotDivisions === slotDivisions - 1 }\">\n                                    <ng-container *ngIf=\"minorTimeHeaderTemplateRef\" [ngTemplateOutlet]=\"minorTimeHeaderTemplateRef\" [ngTemplateOutletContext]=\"{ date: slot.start }\">\n                                    </ng-container>\n                                </th>\n                            </tr>\n                        </ng-container>\n                    </table>\n                </div>\n                <div class=\"k-scheduler-content\" #content>\n                    <ng-container *ngIf=\"showCurrentTime\">\n                        <div *ngFor=\"let resource of verticalResources | resourceIterator; trackBy: itemIndex;\"\n                            #currentTimeMarker class=\"k-current-time\">\n                        </div>\n                    </ng-container>\n                    <table class=\"k-scheduler-table\" #contentTable role=\"presentation\">\n                        <ng-container *ngFor=\"let resourceItem of verticalResources | resourceIterator; let verticalIndex = index; trackBy: itemIndex;\">\n                            <tr class=\"k-scheduler-header-all-day\" *ngIf=\"verticalResources.length\">\n                                <td *ngFor=\"let slot of daySlots; let index = index; trackBy: itemIndex\"\n                                    daySlot\n                                    [start]=\"slot.start\"\n                                    [end]=\"slot.end\"\n                                    [id]=\"{ resourceIndex: verticalIndex, rangeIndex: 0, index: index }\">\n                                    <ng-container *ngIf=\"allDaySlotTemplateRef\" [ngTemplateOutlet]=\"allDaySlotTemplateRef\"\n                                        [ngTemplateOutletContext]=\"{ date: slot.start, resources: resourcesByIndex(verticalIndex) }\"></ng-container>\n                                </td>\n                            </tr>\n                            <tr *ngFor=\"let slot of timeSlots; index as index; trackBy: itemIndex\" [class.k-middle-row]=\"slot.isMajor\">\n                                <ng-container *ngFor=\"let resource of horizontalResources | resourceIterator; let horizontalIndex = index; trackBy: itemIndex;\">\n                                    <td *ngFor=\"let daySlot of daySlots; index as rangeIndex; trackBy: itemIndex\"\n                                        [ngClass]=\"timeSlotClass(slot, daySlot.start, verticalResources.length ? verticalIndex : horizontalIndex)\"\n                                        timeSlot #timeSlot=\"timeSlot\"\n                                            [date]=\"daySlot.start\"\n                                            [invariantStart]=\"slot.start\"\n                                            [invariantEnd]=\"slot.end\"\n                                            [workDayStart]=\"workDayStartTime\"\n                                            [workDayEnd]=\"workDayEndTime\"\n                                            [workWeekStart]=\"workWeekStart\"\n                                            [workWeekEnd]=\"workWeekEnd\"\n                                            [id]=\"{ resourceIndex: verticalResources.length ? verticalIndex : horizontalIndex, rangeIndex: rangeIndex, index: index }\"\n                                    >\n                                        <ng-container *ngIf=\"timeSlotTemplateRef\" [ngTemplateOutlet]=\"timeSlotTemplateRef\"\n                                            [ngTemplateOutletContext]=\"{ date: timeSlot.startLocalTime, resources: resourcesByIndex(timeSlot.id.resourceIndex) }\">\n                                        </ng-container>\n                                    </td>\n                                </ng-container>\n                            </tr>\n                        </ng-container>\n                    </table>\n                    <ng-container *ngFor=\"let item of items | async; trackBy: itemIndex;\">\n                        <div *ngFor=\"let itemResource of item.resources; trackBy: itemIndex;\"\n                            [ngClass]=\"getEventClasses(item, itemResource.resources)\"\n                            [ngStyle]=\"getEventStyles(item, itemResource)\"\n                            [kendoSchedulerFocusIndex]=\"itemResource.leafIdx\"\n                            dayTimeViewItem\n                                [editable]=\"editable\"\n                                [vertical]=\"true\"\n                                [eventTemplate]=\"eventTemplateRef\"\n                                [item]=\"item\"\n                                [index]=\"item.index\"\n                                [rangeIndex]=\"item.rangeIndex\"\n                                [resources]=\"itemResource.resources\"\n                                [resourceIndex]=\"itemResource.leafIdx\">\n                        </div>\n                    </ng-container>\n                    <ng-container *ngIf=\"verticalResources.length\">\n                        <ng-container *ngFor=\"let item of allDayItems | async; trackBy: itemIndex;\">\n                            <div *ngFor=\"let itemResource of item.resources; trackBy: itemIndex;\"\n                                [ngClass]=\"getEventClasses(item, itemResource.resources, true)\"\n                                [ngStyle]=\"getEventStyles(item, itemResource, true)\"\n                                [kendoSchedulerFocusIndex]=\"itemResource.leafIdx\"\n                                dayTimeViewItem\n                                    [isAllDay]=\"true\"\n                                    [editable]=\"editable\"\n                                    [eventTemplate]=\"allDayEventTemplateRef\"\n                                    [item]=\"item\"\n                                    [index]=\"item.index\"\n                                    [rangeIndex]=\"item.rangeIndex\"\n                                    [resources]=\"itemResource.resources\"\n                                    [resourceIndex]=\"itemResource.leafIdx\">\n                            </div>\n                        </ng-container>\n                    </ng-container>\n                    <kendo-hint-container #hintContainer>\n                        <ng-template>\n                            <div *ngIf=\"dragHints.length && (!allDayDragHint || verticalResources.length)\"\n                                class=\"k-event-drag-hint\"\n                                dayTimeViewItem\n                                    [isAllDay]=\"allDayDragHint\"\n                                    [ngStyle]=\"dragHints[0].style\"\n                                    [ngClass]=\"dragHints[0].class\"\n                                    [dragHint]=\"true\"\n                                    [eventTemplate]=\"eventTemplateRef\"\n                                    [resources]=\"dragHints[0].resources\"\n                                    [item]=\"dragHints[0].item\">\n                            </div>\n\n                            <ng-container *ngIf=\"resizeHints.length && (!allDayResizeHint || verticalResources.length)\">\n                                <div *ngFor=\"let hint of resizeHints; trackBy: itemIndex;\"\n                                    kendoResizeHint\n                                        [hint]=\"hint\"\n                                        [ngClass]=\"hint.class\"\n                                        [format]=\"allDayResizeHint ? allDayResizeHintFormat : resizeHintFormat\">\n                                </div>\n                            </ng-container>\n                        </ng-template>\n                    </kendo-hint-container>\n                </div>\n            </div>\n        </div>\n    "
+            template: "\n        <div class=\"k-scheduler-layout k-scheduler-flex-layout\" [ngClass]=\"classNames\">\n            <div class=\"k-scheduler-pane\">\n                <div class=\"k-scheduler-times\" #timesHeader>\n                    <table class=\"k-scheduler-table\" aria-hidden=\"true\">\n                        <tr *ngFor=\"let resource of horizontalResources; trackBy: itemIndex;\">\n                            <th></th>\n                        </tr>\n                        <tr>\n                            <th>\u200B</th>\n                        </tr>\n                        <tr *ngIf=\"!verticalResources.length\">\n                            <th class=\"k-scheduler-times-all-day\" #allDayCell>{{ allDayMessage }}</th>\n                        </tr>\n                    </table>\n                </div>\n                <div class=\"k-scheduler-header k-state-default\" #header>\n                    <div class=\"k-scheduler-header-wrap\" #headerWrap>\n                        <table class=\"k-scheduler-table\" aria-hidden=\"true\">\n                            <tr *ngFor=\"let resource of horizontalResources; let resourceIndex = index; trackBy: itemIndex;\">\n                                <th *ngFor=\"let item of horizontalResources | resourceIterator : resourceIndex; trackBy: itemIndex;\"\n                                    class=\"k-slot-cell\" [attr.colspan]=\"horizontalColspan(resourceIndex)\">\n                                    <ng-container *ngIf=\"!groupHeaderTemplateRef\">{{ getField(item, resource.textField) }}</ng-container>\n                                    <ng-container *ngIf=\"groupHeaderTemplateRef\" [ngTemplateOutlet]=\"groupHeaderTemplateRef\" [ngTemplateOutletContext]=\"{ resource: item }\"></ng-container>\n                                </th>\n                            </tr>\n                            <tr>\n                                <ng-container *ngFor=\"let resource of horizontalResources | resourceIterator; trackBy: itemIndex;\">\n                                    <th *ngFor=\"let slot of daySlots; let index = index; trackBy: itemIndex\">\n                                        <span *ngIf=\"!dateHeaderTemplateRef\" class=\"k-link k-nav-day\" [attr.data-dayslot-index]=\"index\">{{ slot.start | kendoDate: dateFormat }}</span>\n                                        <ng-container *ngIf=\"dateHeaderTemplateRef\" [ngTemplateOutlet]=\"dateHeaderTemplateRef\" [ngTemplateOutletContext]=\"{ date: slot.start }\"></ng-container>\n                                    </th>\n                                </ng-container>\n                            </tr>\n                        </table>\n                        <div style=\"position: relative;\" *ngIf=\"!verticalResources.length\">\n                            <table class=\"k-scheduler-table k-scheduler-header-all-day k-user-select-none\" aria-hidden=\"true\">\n                                <tr>\n                                    <ng-container *ngFor=\"let resource of horizontalResources | resourceIterator; let resourceIndex = index; trackBy: itemIndex;\">\n                                        <td *ngFor=\"let slot of daySlots; let index = index; trackBy: itemIndex\"\n                                            daySlot\n                                            [start]=\"slot.start\"\n                                            [end]=\"slot.end\"\n                                            [id]=\"{ resourceIndex: resourceIndex, rangeIndex: 0, index: index }\"\n                                            [class.k-state-selected]=\"isSlotSelected({\n                                                start: toPlainDate(slot.start),\n                                                end: toPlainDate(slot.end),\n                                                isAllDay: true,\n                                                resources: resourcesByIndex(resourceIndex)\n                                            })\"\n                                            [ngClass]=\"allDaySlotClass(slot, resourceIndex)\">\n                                            <ng-container *ngIf=\"allDaySlotTemplateRef\" [ngTemplateOutlet]=\"allDaySlotTemplateRef\"\n                                                [ngTemplateOutletContext]=\"{ date: slot.start, resources: resourcesByIndex(resourceIndex) }\"></ng-container>\n                                        </td>\n                                    </ng-container>\n                                </tr>\n                            </table>\n                            <ng-container *ngFor=\"let item of allDayItems | async; trackBy: itemIndex;\">\n                                <div *ngFor=\"let itemResource of item.resources; trackBy: itemIndex;\"\n                                    [ngClass]=\"getEventClasses(item, itemResource.resources, true)\"\n                                    [ngStyle]=\"getEventStyles(item, itemResource, true)\"\n                                    [kendoSchedulerFocusIndex]=\"itemResource.leafIdx\"\n                                     dayTimeViewItem\n                                        [isAllDay]=\"true\"\n                                        [editable]=\"editable\"\n                                        [eventTemplate]=\"allDayEventTemplateRef\"\n                                        [item]=\"item\"\n                                        [index]=\"item.index\"\n                                        [rangeIndex]=\"item.rangeIndex\"\n                                        [resources]=\"itemResource.resources\"\n                                        [resourceIndex]=\"itemResource.leafIdx\">\n                                </div>\n                            </ng-container>\n                            <kendo-hint-container #headerHintContainer>\n                                <ng-template>\n                                    <div *ngIf=\"dragHints.length && allDayDragHint\"\n                                        class=\"k-event-drag-hint\"\n                                        dayTimeViewItem\n                                            [isAllDay]=\"true\"\n                                            [ngStyle]=\"dragHints[0].style\"\n                                            [ngClass]=\"dragHints[0].class\"\n                                            [dragHint]=\"true\"\n                                            [eventTemplate]=\"eventTemplateRef\"\n                                            [item]=\"dragHints[0].item\"\n                                            [resources]=\"dragHints[0].resources\">\n                                    </div>\n\n                                    <div *ngIf=\"resizeHints.length && allDayResizeHint\"\n                                        kendoResizeHint\n                                            [hint]=\"resizeHints[0]\"\n                                            [ngClass]=\"resizeHints[0].class\"\n                                            [format]=\"allDayResizeHintFormat\">\n                                    </div>\n                                </ng-template>\n                            </kendo-hint-container>\n                        </div>\n                    </div>\n                </div>\n            </div>\n            <div class=\"k-scheduler-pane\">\n                <div class=\"k-scheduler-times\" #times>\n                    <ng-container *ngIf=\"showCurrentTime\">\n                        <div *ngFor=\"let resource of verticalResources | resourceIterator; trackBy: itemIndex;\"\n                            #currentTimeArrow class=\"k-current-time k-current-time-arrow-right\">\n                        </div>\n                    </ng-container>\n                    <table class=\"k-scheduler-table\" #timesTable aria-hidden=\"true\">\n                        <ng-container *ngFor=\"let resourceItem of verticalResources | resourceIterator; let leafIndex = index; trackBy: itemIndex;\">\n                            <tr *ngIf=\"verticalResources.length\">\n                                <ng-container *ngFor=\"let resource of verticalResources; let resourceIndex = index; trackBy: itemIndex;\">\n                                    <th *ngIf=\"verticalItem(leafIndex, resourceIndex)\" [attr.rowspan]=\"verticalRowspan(resourceIndex)\" class=\"k-slot-cell\">\n                                        <ng-container *ngIf=\"!groupHeaderTemplateRef\">{{ getField(verticalItem(leafIndex, resourceIndex), resource.textField) }}</ng-container>\n                                        <ng-container *ngIf=\"groupHeaderTemplateRef\" [ngTemplateOutlet]=\"groupHeaderTemplateRef\"\n                                            [ngTemplateOutletContext]=\"{ resource: verticalItem(leafIndex, resourceIndex) }\"></ng-container>\n                                    </th>\n                                </ng-container>\n                                <th class=\"k-scheduler-times-all-day\" #allDayCell>{{ allDayMessage }}</th>\n                            </tr>\n                            <tr *ngFor=\"let slot of timeSlots; let timeSlotIndex = index;trackBy: itemIndex\">\n                                <th *ngIf=\"slot.isMajor\" [ngClass]=\"{ 'k-slot-cell': slotDivisions === 1 }\">\n                                    <ng-container *ngIf=\"!majorTimeHeaderTemplateRef\">{{ slot.start | kendoDate: 't' }}</ng-container>\n                                    <ng-container *ngIf=\"majorTimeHeaderTemplateRef\" [ngTemplateOutlet]=\"majorTimeHeaderTemplateRef\" [ngTemplateOutletContext]=\"{ date: slot.start }\"></ng-container>\n                                </th>\n                                <th *ngIf=\"!slot.isMajor\" [ngClass]=\"{ 'k-slot-cell': timeSlotIndex % slotDivisions === slotDivisions - 1 }\">\n                                    <ng-container *ngIf=\"minorTimeHeaderTemplateRef\" [ngTemplateOutlet]=\"minorTimeHeaderTemplateRef\" [ngTemplateOutletContext]=\"{ date: slot.start }\">\n                                    </ng-container>\n                                </th>\n                            </tr>\n                        </ng-container>\n                    </table>\n                </div>\n                <div class=\"k-scheduler-content k-user-select-none\" #content>\n                    <ng-container *ngIf=\"showCurrentTime\">\n                        <div *ngFor=\"let resource of verticalResources | resourceIterator; trackBy: itemIndex;\"\n                            #currentTimeMarker class=\"k-current-time\">\n                        </div>\n                    </ng-container>\n                    <table class=\"k-scheduler-table\" #contentTable role=\"presentation\">\n                        <ng-container *ngFor=\"let resourceItem of verticalResources | resourceIterator; let verticalIndex = index; trackBy: itemIndex;\">\n                            <tr class=\"k-scheduler-header-all-day\" *ngIf=\"verticalResources.length\">\n                                <td *ngFor=\"let slot of daySlots; let index = index; trackBy: itemIndex\"\n                                    daySlot\n                                    [start]=\"slot.start\"\n                                    [end]=\"slot.end\"\n                                    [class.k-state-selected]=\"isSlotSelected({\n                                        start: toPlainDate(slot.start),\n                                        end: toPlainDate(slot.end),\n                                        isAllDay: true,\n                                        resources: resourcesByIndex(verticalIndex)\n                                    })\"\n                                    [id]=\"{ resourceIndex: verticalIndex, rangeIndex: 0, index: index }\">\n                                    <ng-container *ngIf=\"allDaySlotTemplateRef\" [ngTemplateOutlet]=\"allDaySlotTemplateRef\"\n                                        [ngTemplateOutletContext]=\"{ date: slot.start, resources: resourcesByIndex(verticalIndex) }\"></ng-container>\n                                </td>\n                            </tr>\n                            <tr *ngFor=\"let slot of timeSlots; index as index; trackBy: itemIndex\" [class.k-middle-row]=\"slot.isMajor\">\n                                <ng-container *ngFor=\"let resource of horizontalResources | resourceIterator; let horizontalIndex = index; trackBy: itemIndex;\">\n                                    <td *ngFor=\"let daySlot of daySlots; index as rangeIndex; trackBy: itemIndex\"\n                                        [ngClass]=\"timeSlotClass(slot, daySlot.start, verticalResources.length ? verticalIndex : horizontalIndex)\"\n                                        timeSlot #timeSlot=\"timeSlot\"\n                                            [date]=\"daySlot.start\"\n                                            [invariantStart]=\"slot.start\"\n                                            [invariantEnd]=\"slot.end\"\n                                            [workDayStart]=\"workDayStartTime\"\n                                            [workDayEnd]=\"workDayEndTime\"\n                                            [workWeekStart]=\"workWeekStart\"\n                                            [workWeekEnd]=\"workWeekEnd\"\n                                            [id]=\"{ resourceIndex: verticalResources.length ? verticalIndex : horizontalIndex, rangeIndex: rangeIndex, index: index }\"\n                                            [class.k-state-selected]=\"isSlotSelected({\n                                                start: toPlainDateTime(daySlot.start, slot.start),\n                                                end: toPlainDateTime(daySlot.start, slot.end),\n                                                isAllDay: false,\n                                                resources: resourcesByIndex(verticalResources.length ? verticalIndex : horizontalIndex)\n                                            })\"\n                                    >\n                                        <ng-container *ngIf=\"timeSlotTemplateRef\" [ngTemplateOutlet]=\"timeSlotTemplateRef\"\n                                            [ngTemplateOutletContext]=\"{ date: timeSlot.startLocalTime, resources: resourcesByIndex(timeSlot.id.resourceIndex) }\">\n                                        </ng-container>\n                                    </td>\n                                </ng-container>\n                            </tr>\n                        </ng-container>\n                    </table>\n                    <ng-container *ngFor=\"let item of items | async; trackBy: itemIndex;\">\n                        <div *ngFor=\"let itemResource of item.resources; trackBy: itemIndex;\"\n                            [ngClass]=\"getEventClasses(item, itemResource.resources)\"\n                            [ngStyle]=\"getEventStyles(item, itemResource)\"\n                            [kendoSchedulerFocusIndex]=\"itemResource.leafIdx\"\n                            dayTimeViewItem\n                                [editable]=\"editable\"\n                                [vertical]=\"true\"\n                                [eventTemplate]=\"eventTemplateRef\"\n                                [item]=\"item\"\n                                [index]=\"item.index\"\n                                [rangeIndex]=\"item.rangeIndex\"\n                                [resources]=\"itemResource.resources\"\n                                [resourceIndex]=\"itemResource.leafIdx\">\n                        </div>\n                    </ng-container>\n                    <ng-container *ngIf=\"verticalResources.length\">\n                        <ng-container *ngFor=\"let item of allDayItems | async; trackBy: itemIndex;\">\n                            <div *ngFor=\"let itemResource of item.resources; trackBy: itemIndex;\"\n                                [ngClass]=\"getEventClasses(item, itemResource.resources, true)\"\n                                [ngStyle]=\"getEventStyles(item, itemResource, true)\"\n                                [kendoSchedulerFocusIndex]=\"itemResource.leafIdx\"\n                                dayTimeViewItem\n                                    [isAllDay]=\"true\"\n                                    [editable]=\"editable\"\n                                    [eventTemplate]=\"allDayEventTemplateRef\"\n                                    [item]=\"item\"\n                                    [index]=\"item.index\"\n                                    [rangeIndex]=\"item.rangeIndex\"\n                                    [resources]=\"itemResource.resources\"\n                                    [resourceIndex]=\"itemResource.leafIdx\">\n                            </div>\n                        </ng-container>\n                    </ng-container>\n                    <kendo-hint-container #hintContainer>\n                        <ng-template>\n                            <div *ngIf=\"dragHints.length && (!allDayDragHint || verticalResources.length)\"\n                                class=\"k-event-drag-hint\"\n                                dayTimeViewItem\n                                    [isAllDay]=\"allDayDragHint\"\n                                    [ngStyle]=\"dragHints[0].style\"\n                                    [ngClass]=\"dragHints[0].class\"\n                                    [dragHint]=\"true\"\n                                    [eventTemplate]=\"eventTemplateRef\"\n                                    [resources]=\"dragHints[0].resources\"\n                                    [item]=\"dragHints[0].item\">\n                            </div>\n\n                            <ng-container *ngIf=\"resizeHints.length && (!allDayResizeHint || verticalResources.length)\">\n                                <div *ngFor=\"let hint of resizeHints; trackBy: itemIndex;\"\n                                    kendoResizeHint\n                                        [hint]=\"hint\"\n                                        [ngClass]=\"hint.class\"\n                                        [format]=\"allDayResizeHint ? allDayResizeHintFormat : resizeHintFormat\">\n                                </div>\n                            </ng-container>\n                        </ng-template>\n                    </kendo-hint-container>\n                </div>\n            </div>\n        </div>\n    "
         }),
         tslib_1.__metadata("design:paramtypes", [LocalizationService,
             ViewContextService,

package/dist/es/views/timeline/timeline-multi-day-view.component.js

@@ -142,7 +142,7 @@ var TimelineMultiDayViewComponent = /** @class */ (function (_super) {
             providers: [
                 DayTimeSlotService
             ],
-            template: "\n        <div class=\"k-scheduler-layout k-scheduler-flex-layout\" [ngClass]=\"classNames\">\n            <div class=\"k-scheduler-pane\">\n                <div class=\"k-scheduler-times\" #timesHeader>\n                    <table class=\"k-scheduler-table\" aria-hidden=\"true\">\n                        <tr><th></th></tr>\n                        <tr><th class=\"k-slot-cell\"></th></tr>\n                        <tr *ngFor=\"let resource of horizontalResources; trackBy: itemIndex;\">\n                            <th></th>\n                        </tr>\n                    </table>\n                </div>\n                <div class=\"k-scheduler-header k-state-default\" #header >\n                    <div class=\"k-scheduler-header-wrap\" #headerWrap>\n                        <ng-container *ngIf=\"showCurrentTime\">\n                            <div *ngFor=\"let resource of horizontalResources | resourceIterator; trackBy: itemIndex;\"\n                                #currentTimeArrow class=\"k-current-time k-current-time-arrow-down\">\n                            </div>\n                        </ng-container>\n                        <table class=\"k-scheduler-table\" aria-hidden=\"true\">\n                            <colgroup>\n                                <col *ngFor=\"let slotIndex of slotsCount | repeat; trackBy: itemIndex;\" [ngStyle]=\"{ 'width.px': columnWidth }\" />\n                            </colgroup>\n                            <tr *ngFor=\"let resource of horizontalResources; let resourceIndex = index; trackBy: itemIndex;\">\n                                <th *ngFor=\"let item of horizontalResources | resourceIterator : resourceIndex; trackBy: itemIndex;\"\n                                    class=\"k-slot-cell\" [attr.colspan]=\"horizontalColspan(resourceIndex)\">\n                                    <ng-container *ngIf=\"!groupHeaderTemplateRef\">{{ getField(item, resource.textField) }}</ng-container>\n                                    <ng-container *ngIf=\"groupHeaderTemplateRef\" [ngTemplateOutlet]=\"groupHeaderTemplateRef\"\n                                        [ngTemplateOutletContext]=\"{ resource: item }\"></ng-container>\n                                </th>\n                            </tr>\n                             <tr>\n                                 <ng-container *ngFor=\"let resource of horizontalResources | resourceIterator; trackBy: itemIndex;\">\n                                     <ng-container *ngFor=\"let daySlot of daySlots; let index = index; trackBy: itemIndex;\">\n                                         <th [attr.colspan]=\"timeSlots.length\" class=\"k-slot-cell\">\n                                             <span *ngIf=\"!dateHeaderTemplateRef\" class=\"k-link\" [ngClass]=\"{ 'k-nav-day': numberOfDays > 1 }\" [attr.data-dayslot-index]=\"index\">{{ daySlot.start | kendoDate: 'm'}}</span>\n                                             <ng-container *ngIf=\"dateHeaderTemplateRef\" [ngTemplateOutlet]=\"dateHeaderTemplateRef\" [ngTemplateOutletContext]=\"{ date: daySlot.start }\"></ng-container>\n                                         </th>\n                                     </ng-container>\n                                 </ng-container>\n                             </tr>\n                             <tr>\n                                 <ng-container *ngFor=\"let resource of horizontalResources | resourceIterator; let resourceIndex = index; trackBy: itemIndex;\">\n                                    <ng-container *ngFor=\"let daySlot of daySlots; let rangeIndex = index; trackBy: itemIndex;\">\n                                        <ng-container *ngFor=\"let timeSlot of timeSlots; let index = index; trackBy: itemIndex;\">\n                                            <th *ngIf=\"timeSlot.isMajor\" [attr.colspan]=\"timeColspan(index)\" >{{ timeSlot.start | kendoDate: 't' }}</th>\n                                        </ng-container>\n                                    </ng-container>\n                                 </ng-container>\n                             </tr>\n                        </table>\n                    </div>\n                </div>\n            </div>\n            <div class=\"k-scheduler-pane\">\n                <div class=\"k-scheduler-times\" #times>\n                    <table class=\"k-scheduler-table\" #timesTable aria-hidden=\"true\">\n                        <tr *ngIf=\"!verticalResources.length\">\n                            <th rowspan=\"1\" #titleCell>\n                                {{ allEventsMessage }}\n                            </th>\n                        </tr>\n                        <ng-container *ngIf=\"verticalResources.length\">\n                            <ng-container *ngFor=\"let resourceItem of verticalResources | resourceIterator; let leafIndex = index; trackBy: itemIndex;\">\n                                <tr #verticalResourceRows>\n                                    <ng-container *ngFor=\"let resource of verticalResources; let resourceIndex = index; trackBy: itemIndex;\">\n                                        <th *ngIf=\"verticalItem(leafIndex, resourceIndex)\" [attr.rowspan]=\"verticalRowspan(resourceIndex)\" class=\"k-slot-cell\">\n                                            <div>\n                                                <ng-container *ngIf=\"!groupHeaderTemplateRef\">{{ getField(verticalItem(leafIndex, resourceIndex), resource.textField) }}</ng-container>\n                                                <ng-container *ngIf=\"groupHeaderTemplateRef\" [ngTemplateOutlet]=\"groupHeaderTemplateRef\"\n                                                    [ngTemplateOutletContext]=\"{ resource: verticalItem(leafIndex, resourceIndex) }\"></ng-container>\n                                            </div>\n                                        </th>\n                                    </ng-container>\n                                </tr>\n                            </ng-container>\n                        </ng-container>\n                    </table>\n                </div>\n                <div class=\"k-scheduler-content\" #content>\n                    <ng-container *ngIf=\"showCurrentTime\">\n                        <div *ngFor=\"let resource of horizontalResources | resourceIterator; trackBy: itemIndex;\"\n                            class=\"k-current-time\" #currentTimeMarker>\n                        </div>\n                    </ng-container>\n                    <table class=\"k-scheduler-table\" #contentTable role=\"presentation\">\n                        <colgroup>\n                            <col *ngFor=\"let slotIndex of slotsCount | repeat; trackBy: itemIndex;\" [ngStyle]=\"{ 'width.px': columnWidth }\" />\n                        </colgroup>\n                        <tr *ngFor=\"let resourceItem of verticalResources | resourceIterator; let verticalIndex = index; trackBy: itemIndex;\">\n                            <ng-container *ngFor=\"let resource of horizontalResources | resourceIterator; let horizontalIndex = index; trackBy: itemIndex;\">\n                                <ng-container *ngFor=\"let daySlot of daySlots; let rangeIndex = index; trackBy: itemIndex;\">\n                                    <td *ngFor=\"let slot of timeSlots; let index = index; trackBy: itemIndex;\"\n                                            [ngClass]=\"timeSlotClass(slot, daySlot.start, verticalResources.length ? verticalIndex : horizontalIndex)\"\n                                            timeSlot #timeSlot=\"timeSlot\"\n                                            [date]=\"daySlot.start\"\n                                            [invariantStart]=\"slot.start\"\n                                            [invariantEnd]=\"slot.end\"\n                                            [workDayStart]=\"workDayStartTime\"\n                                            [workDayEnd]=\"workDayEndTime\"\n                                            [workWeekStart]=\"workWeekStart\"\n                                            [workWeekEnd]=\"workWeekEnd\"\n                                            [id]=\"{ resourceIndex: verticalResources.length ? verticalIndex : horizontalIndex, rangeIndex: rangeIndex, index: index }\"\n                                    >\n                                        <ng-container *ngIf=\"timeSlotTemplateRef\" [ngTemplateOutlet]=\"timeSlotTemplateRef\"\n                                            [ngTemplateOutletContext]=\"{ date: timeSlot.start, resources: resourcesByIndex(timeSlot.id.resourceIndex ) }\">\n                                        </ng-container>\n                                    </td>\n                                </ng-container>\n                            </ng-container>\n                        </tr>\n                    </table>\n                    <ng-container *ngFor=\"let item of items | async; trackBy: itemIndex;\">\n                        <div *ngFor=\"let itemResource of item.resources; trackBy: itemIndex;\"\n                            [ngClass]=\"getEventClasses(item, itemResource.resources)\"\n                            [ngStyle]=\"getEventStyles(item, itemResource)\"\n                            [kendoSchedulerFocusIndex]=\"itemResource.leafIdx\"\n                            dayTimeViewItem\n                                [editable]=\"editable\"\n                                [item]=\"item\"\n                                [index]=\"item.index\"\n                                [rangeIndex]=\"item.rangeIndex\"\n                                [eventTemplate]=\"eventTemplateRef\"\n                                [resources]=\"itemResource.resources\"\n                                [resourceIndex]=\"itemResource.leafIdx\">\n                        </div>\n                    </ng-container>\n                    <kendo-hint-container #hintContainer>\n                        <ng-template>\n                            <div *ngFor=\"let hint of dragHints; trackBy: itemIndex;\"\n                                class=\"k-event-drag-hint\"\n                                dayTimeViewItem\n                                    [ngStyle]=\"hint.style\"\n                                    [ngClass]=\"hint.class\"\n                                    [dragHint]=\"true\"\n                                    [eventTemplate]=\"eventTemplateRef\"\n                                    [item]=\"hint.item\"\n                                    [resources]=\"hint.resources\">\n                            </div>\n                            <div *ngIf=\"resizeHints && resizeHints.length\"\n                                kendoResizeHint\n                                [hint]=\"resizeHints[0]\"\n                                [ngClass]=\"resizeHints[0].class\"\n                                [format]=\"resizeHintFormat\">\n                            </div>\n                        </ng-template>\n                    </kendo-hint-container>\n                </div>\n            </div>\n        </div>\n    "
+            template: "\n        <div class=\"k-scheduler-layout k-scheduler-flex-layout\" [ngClass]=\"classNames\">\n            <div class=\"k-scheduler-pane\">\n                <div class=\"k-scheduler-times\" #timesHeader>\n                    <table class=\"k-scheduler-table\" aria-hidden=\"true\">\n                        <tr><th></th></tr>\n                        <tr><th class=\"k-slot-cell\"></th></tr>\n                        <tr *ngFor=\"let resource of horizontalResources; trackBy: itemIndex;\">\n                            <th></th>\n                        </tr>\n                    </table>\n                </div>\n                <div class=\"k-scheduler-header k-state-default\" #header >\n                    <div class=\"k-scheduler-header-wrap\" #headerWrap>\n                        <ng-container *ngIf=\"showCurrentTime\">\n                            <div *ngFor=\"let resource of horizontalResources | resourceIterator; trackBy: itemIndex;\"\n                                #currentTimeArrow class=\"k-current-time k-current-time-arrow-down\">\n                            </div>\n                        </ng-container>\n                        <table class=\"k-scheduler-table\" aria-hidden=\"true\">\n                            <colgroup>\n                                <col *ngFor=\"let slotIndex of slotsCount | repeat; trackBy: itemIndex;\" [ngStyle]=\"{ 'width.px': columnWidth }\" />\n                            </colgroup>\n                            <tr *ngFor=\"let resource of horizontalResources; let resourceIndex = index; trackBy: itemIndex;\">\n                                <th *ngFor=\"let item of horizontalResources | resourceIterator : resourceIndex; trackBy: itemIndex;\"\n                                    class=\"k-slot-cell\" [attr.colspan]=\"horizontalColspan(resourceIndex)\">\n                                    <ng-container *ngIf=\"!groupHeaderTemplateRef\">{{ getField(item, resource.textField) }}</ng-container>\n                                    <ng-container *ngIf=\"groupHeaderTemplateRef\" [ngTemplateOutlet]=\"groupHeaderTemplateRef\"\n                                        [ngTemplateOutletContext]=\"{ resource: item }\"></ng-container>\n                                </th>\n                            </tr>\n                             <tr>\n                                 <ng-container *ngFor=\"let resource of horizontalResources | resourceIterator; trackBy: itemIndex;\">\n                                     <ng-container *ngFor=\"let daySlot of daySlots; let index = index; trackBy: itemIndex;\">\n                                         <th [attr.colspan]=\"timeSlots.length\" class=\"k-slot-cell\">\n                                             <span *ngIf=\"!dateHeaderTemplateRef\" class=\"k-link\" [ngClass]=\"{ 'k-nav-day': numberOfDays > 1 }\" [attr.data-dayslot-index]=\"index\">{{ daySlot.start | kendoDate: 'm'}}</span>\n                                             <ng-container *ngIf=\"dateHeaderTemplateRef\" [ngTemplateOutlet]=\"dateHeaderTemplateRef\" [ngTemplateOutletContext]=\"{ date: daySlot.start }\"></ng-container>\n                                         </th>\n                                     </ng-container>\n                                 </ng-container>\n                             </tr>\n                             <tr>\n                                 <ng-container *ngFor=\"let resource of horizontalResources | resourceIterator; let resourceIndex = index; trackBy: itemIndex;\">\n                                    <ng-container *ngFor=\"let daySlot of daySlots; let rangeIndex = index; trackBy: itemIndex;\">\n                                        <ng-container *ngFor=\"let timeSlot of timeSlots; let index = index; trackBy: itemIndex;\">\n                                            <th *ngIf=\"timeSlot.isMajor\" [attr.colspan]=\"timeColspan(index)\" >{{ timeSlot.start | kendoDate: 't' }}</th>\n                                        </ng-container>\n                                    </ng-container>\n                                 </ng-container>\n                             </tr>\n                        </table>\n                    </div>\n                </div>\n            </div>\n            <div class=\"k-scheduler-pane\">\n                <div class=\"k-scheduler-times\" #times>\n                    <table class=\"k-scheduler-table\" #timesTable aria-hidden=\"true\">\n                        <tr *ngIf=\"!verticalResources.length\">\n                            <th rowspan=\"1\" #titleCell>\n                                {{ allEventsMessage }}\n                            </th>\n                        </tr>\n                        <ng-container *ngIf=\"verticalResources.length\">\n                            <ng-container *ngFor=\"let resourceItem of verticalResources | resourceIterator; let leafIndex = index; trackBy: itemIndex;\">\n                                <tr #verticalResourceRows>\n                                    <ng-container *ngFor=\"let resource of verticalResources; let resourceIndex = index; trackBy: itemIndex;\">\n                                        <th *ngIf=\"verticalItem(leafIndex, resourceIndex)\" [attr.rowspan]=\"verticalRowspan(resourceIndex)\" class=\"k-slot-cell\">\n                                            <div>\n                                                <ng-container *ngIf=\"!groupHeaderTemplateRef\">{{ getField(verticalItem(leafIndex, resourceIndex), resource.textField) }}</ng-container>\n                                                <ng-container *ngIf=\"groupHeaderTemplateRef\" [ngTemplateOutlet]=\"groupHeaderTemplateRef\"\n                                                    [ngTemplateOutletContext]=\"{ resource: verticalItem(leafIndex, resourceIndex) }\"></ng-container>\n                                            </div>\n                                        </th>\n                                    </ng-container>\n                                </tr>\n                            </ng-container>\n                        </ng-container>\n                    </table>\n                </div>\n                <div class=\"k-scheduler-content\" #content>\n                    <ng-container *ngIf=\"showCurrentTime\">\n                        <div *ngFor=\"let resource of horizontalResources | resourceIterator; trackBy: itemIndex;\"\n                            class=\"k-current-time\" #currentTimeMarker>\n                        </div>\n                    </ng-container>\n                    <table class=\"k-scheduler-table k-user-select-none\" #contentTable role=\"presentation\">\n                        <colgroup>\n                            <col *ngFor=\"let slotIndex of slotsCount | repeat; trackBy: itemIndex;\" [ngStyle]=\"{ 'width.px': columnWidth }\" />\n                        </colgroup>\n                        <tr *ngFor=\"let resourceItem of verticalResources | resourceIterator; let verticalIndex = index; trackBy: itemIndex;\">\n                            <ng-container *ngFor=\"let resource of horizontalResources | resourceIterator; let horizontalIndex = index; trackBy: itemIndex;\">\n                                <ng-container *ngFor=\"let daySlot of daySlots; let rangeIndex = index; trackBy: itemIndex;\">\n                                    <td *ngFor=\"let slot of timeSlots; let index = index; trackBy: itemIndex;\"\n                                            [ngClass]=\"timeSlotClass(slot, daySlot.start, verticalResources.length ? verticalIndex : horizontalIndex)\"\n                                            timeSlot #timeSlot=\"timeSlot\"\n                                            [date]=\"daySlot.start\"\n                                            [invariantStart]=\"slot.start\"\n                                            [invariantEnd]=\"slot.end\"\n                                            [workDayStart]=\"workDayStartTime\"\n                                            [workDayEnd]=\"workDayEndTime\"\n                                            [workWeekStart]=\"workWeekStart\"\n                                            [workWeekEnd]=\"workWeekEnd\"\n                                            selectableSlot\n                                            [id]=\"{ resourceIndex: verticalResources.length ? verticalIndex : horizontalIndex, rangeIndex: rangeIndex, index: index }\"\n                                            [class.k-state-selected]=\"isSlotSelected({\n                                                start: toPlainDateTime(daySlot.start, slot.start),\n                                                end: toPlainDateTime(daySlot.start, slot.end),\n                                                isAllDay: false,\n                                                resources: resourcesByIndex(verticalResources.length ? verticalIndex : horizontalIndex)\n                                            })\"\n                                    >\n                                        <ng-container *ngIf=\"timeSlotTemplateRef\" [ngTemplateOutlet]=\"timeSlotTemplateRef\"\n                                            [ngTemplateOutletContext]=\"{ date: timeSlot.start, resources: resourcesByIndex(timeSlot.id.resourceIndex ) }\">\n                                        </ng-container>\n                                    </td>\n                                </ng-container>\n                            </ng-container>\n                        </tr>\n                    </table>\n                    <ng-container *ngFor=\"let item of items | async; trackBy: itemIndex;\">\n                        <div *ngFor=\"let itemResource of item.resources; trackBy: itemIndex;\"\n                            [ngClass]=\"getEventClasses(item, itemResource.resources)\"\n                            [ngStyle]=\"getEventStyles(item, itemResource)\"\n                            [kendoSchedulerFocusIndex]=\"itemResource.leafIdx\"\n                            dayTimeViewItem\n                                [editable]=\"editable\"\n                                [item]=\"item\"\n                                [index]=\"item.index\"\n                                [rangeIndex]=\"item.rangeIndex\"\n                                [eventTemplate]=\"eventTemplateRef\"\n                                [resources]=\"itemResource.resources\"\n                                [resourceIndex]=\"itemResource.leafIdx\">\n                        </div>\n                    </ng-container>\n                    <kendo-hint-container #hintContainer>\n                        <ng-template>\n                            <div *ngFor=\"let hint of dragHints; trackBy: itemIndex;\"\n                                class=\"k-event-drag-hint\"\n                                dayTimeViewItem\n                                    [ngStyle]=\"hint.style\"\n                                    [ngClass]=\"hint.class\"\n                                    [dragHint]=\"true\"\n                                    [eventTemplate]=\"eventTemplateRef\"\n                                    [item]=\"hint.item\"\n                                    [resources]=\"hint.resources\">\n                            </div>\n                            <div *ngIf=\"resizeHints && resizeHints.length\"\n                                kendoResizeHint\n                                [hint]=\"resizeHints[0]\"\n                                [ngClass]=\"resizeHints[0].class\"\n                                [format]=\"resizeHintFormat\">\n                            </div>\n                        </ng-template>\n                    </kendo-hint-container>\n                </div>\n            </div>\n        </div>\n    "
         }),
         tslib_1.__metadata("design:paramtypes", [LocalizationService,
             ChangeDetectorRef,

package/dist/es/views/utils.js

@@ -72,6 +72,24 @@ export function toUTCDateTime(localDate) {
 export function dateWithTime(target, time) {
     return new Date(target.getFullYear(), target.getMonth(), target.getDate(), time.getHours(), time.getMinutes());
 }
+/**
+ * @hidden
+ * Flips the start and end values of a slot selection based on whether
+ * the last dragged-over slot is before or after the slot where the selection began.
+ */
+export function normaliseRangeStartAndEnd(selectionOrigin, currentSlot) {
+    var start;
+    var end;
+    if (currentSlot.end <= selectionOrigin.end) {
+        end = selectionOrigin.end;
+        start = currentSlot.start;
+    }
+    else {
+        start = selectionOrigin.start;
+        end = currentSlot.end;
+    }
+    return { start: start, end: end };
+}
 function getDataIdx(value, resource) {
     var data = resource.data;
     for (var dataIdx = 0; dataIdx < data.length; dataIdx++) {
@@ -180,6 +198,33 @@ export function assignTasksResources(tasks, options) {
         task.resources = eventResources(task.event, options);
     }
 }
+/**
+ * @hidden
+ */
+export function areValidResources(resources) {
+    return Array.isArray(resources) && resources.length > 0 && resources[0] !== undefined;
+}
+/**
+ * @hidden
+ */
+export function resourcesMatch(res1, res2, strict) {
+    if (res1.length !== res2.length) {
+        return false;
+    }
+    if (!strict && !areValidResources(res1) || !areValidResources(res2)) {
+        return true;
+    }
+    return res1.every(function (r1) { return res2.some(function (r2) { return r2.value === r1.value; }); });
+}
+/**
+ * @hidden
+ */
+export function isSameRange(range1, range2) {
+    return (range1.start.getTime() === range2.start.getTime() &&
+        range1.end.getTime() === range2.end.getTime() &&
+        range1.isAllDay === range2.isAllDay &&
+        resourcesMatch(range1.resources, range2.resources, true));
+}
 /** @hidden */
 export function findRowIndex(events, data) {
     if (data.rowIndex !== undefined) {
@@ -284,3 +329,7 @@ export var isWorkWeekDay = function (day, start, end) {
     }
     return start <= day && day <= end;
 };
+/**
+ * @hidden
+ */
+export var alwaysFalse = function () { return false; };

package/dist/es/views/view-state.service.js

@@ -23,12 +23,18 @@ var ViewStateService = /** @class */ (function () {
         this.viewEventSource = new Subject();
         this.layoutEndSource = new Subject();
         this.optionsChangeSource = new Subject();
+        this.slotSelectionStartSource = new Subject();
+        this.slotSelectionStartDragSource = new Subject();
+        this.slotSelectionStartEndSource = new Subject();
         this.dateRange = this.dateRangeSource.asObservable();
         this.nextDate = this.nextDateSource.asObservable();
         this.navigate = this.navigateSource.asObservable();
         this.viewEvent = this.viewEventSource.asObservable();
         this.layoutEnd = this.layoutEndSource.asObservable();
         this.optionsChange = this.optionsChangeSource.asObservable();
+        this.slotSelectionStart = this.slotSelectionStartSource.asObservable();
+        this.slotSelectionDrag = this.slotSelectionStartDragSource.asObservable();
+        this.slotSelectionEnd = this.slotSelectionStartEndSource.asObservable();
     }
     /**
      * Publishes the date that will be displayed by the Scheduler
@@ -72,6 +78,18 @@ var ViewStateService = /** @class */ (function () {
             args: args
         });
     };
+    /** @hidden */
+    ViewStateService.prototype.notifySlotSelectionStart = function (selection) {
+        this.slotSelectionStartSource.next(selection);
+    };
+    /** @hidden */
+    ViewStateService.prototype.notifySlotSelectionDrag = function (selection) {
+        this.slotSelectionStartDragSource.next(selection);
+    };
+    /** @hidden */
+    ViewStateService.prototype.notifySlotSelectionEnd = function (selection) {
+        this.slotSelectionStartEndSource.next(selection);
+    };
     ViewStateService = tslib_1.__decorate([
         Injectable(),
         tslib_1.__metadata("design:paramtypes", [])

package/dist/es2015/events/slot-drag-end-event.d.ts

@@ -0,0 +1,10 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { SlotDragEvent } from './slot-drag-event';
+/**
+ * Arguments for the `slotDragEnd` event.
+ */
+export declare class SlotDragEndEvent extends SlotDragEvent {
+}

package/dist/es2015/events/slot-drag-end-event.js

@@ -0,0 +1,10 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { SlotDragEvent } from './slot-drag-event';
+/**
+ * Arguments for the `slotDragEnd` event.
+ */
+export class SlotDragEndEvent extends SlotDragEvent {
+}

package/dist/es2015/events/slot-drag-event.d.ts

@@ -0,0 +1,39 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { SchedulerComponent } from '../scheduler.component';
+import { ExtendedSlotRange } from '../types/slot-selection';
+/**
+ * Arguments for the `slotDrag` event.
+ */
+export declare class SlotDragEvent implements ExtendedSlotRange {
+    /**
+     * The start date of the slot selection.
+     */
+    start: Date;
+    /**
+     * The end date of the slot selection.
+     */
+    end: Date;
+    /**
+     * Indicates if the slot selection consists of all-day slots, or of time slots.
+     */
+    isAllDay: boolean;
+    /**
+     * The resources for the slot, if grouping by resource; otherwise all Scheduler resources.
+     */
+    resources: any[];
+    /**
+     * The original DOM event.
+     */
+    originalEvent: PointerEvent;
+    /**
+     * A reference to the Scheduler instance that triggered the event.
+     */
+    sender: SchedulerComponent;
+    /**
+     * @hidden
+     */
+    constructor(sender: SchedulerComponent, args: ExtendedSlotRange);
+}

package/dist/es2015/events/slot-drag-event.js

@@ -0,0 +1,16 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+/**
+ * Arguments for the `slotDrag` event.
+ */
+export class SlotDragEvent {
+    /**
+     * @hidden
+     */
+    constructor(sender, args) {
+        this.sender = sender;
+        Object.assign(this, args);
+    }
+}

package/dist/es2015/events/slot-drag-start-event.d.ts

@@ -0,0 +1,41 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { SchedulerComponent } from '../scheduler.component';
+import { ExtendedSlotRange } from '../types/slot-selection';
+import { PreventableEvent } from './preventable-event';
+/**
+ * Arguments for the `slotDragStart` event.
+ * The event is preventable and if prevented, subsequent `slotDrag`, `slotDragEnd`, and `slotSelectionChange` will not be fired.
+ */
+export declare class SlotDragStartEvent extends PreventableEvent implements ExtendedSlotRange {
+    /**
+     * The start date of the slot selection.
+     */
+    start: Date;
+    /**
+     * The end date of the slot selection.
+     */
+    end: Date;
+    /**
+     * Indicates if the slot selection consists of all-day slots, or of time slots.
+     */
+    isAllDay: boolean;
+    /**
+     * The resources for the slot, if grouping by resource; otherwise all Scheduler resources.
+     */
+    resources: any[];
+    /**
+     * The original DOM event.
+     */
+    originalEvent: PointerEvent;
+    /**
+     * A reference to the Scheduler instance that triggered the event.
+     */
+    sender: SchedulerComponent;
+    /**
+     * @hidden
+     */
+    constructor(sender: SchedulerComponent, args: ExtendedSlotRange);
+}

package/dist/es2015/events/slot-drag-start-event.js

@@ -0,0 +1,19 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { PreventableEvent } from './preventable-event';
+/**
+ * Arguments for the `slotDragStart` event.
+ * The event is preventable and if prevented, subsequent `slotDrag`, `slotDragEnd`, and `slotSelectionChange` will not be fired.
+ */
+export class SlotDragStartEvent extends PreventableEvent {
+    /**
+     * @hidden
+     */
+    constructor(sender, args) {
+        super();
+        this.sender = sender;
+        Object.assign(this, args);
+    }
+}

package/dist/es2015/events.d.ts

@@ -20,3 +20,6 @@ export { DragEvent } from './events/drag-event';
 export { DragEndEvent } from './events/drag-end-event';
 export { EditEvent } from './events/edit-event';
 export { AddEvent } from './events/add-event';
+export { SlotDragStartEvent } from './events/slot-drag-start-event';
+export { SlotDragEvent } from './events/slot-drag-event';
+export { SlotDragEndEvent } from './events/slot-drag-end-event';

package/dist/es2015/events.js

@@ -20,3 +20,6 @@ export { DragEvent } from './events/drag-event';
 export { DragEndEvent } from './events/drag-end-event';
 export { EditEvent } from './events/edit-event';
 export { AddEvent } from './events/add-event';
+export { SlotDragStartEvent } from './events/slot-drag-start-event';
+export { SlotDragEvent } from './events/slot-drag-event';
+export { SlotDragEndEvent } from './events/slot-drag-end-event';

package/dist/es2015/index.d.ts

@@ -46,6 +46,7 @@ export { ToolbarTemplateDirective } from './toolbar/toolbar-template.directive';
 export { ToolbarComponent } from './toolbar/toolbar.component';
 export { ToolbarModule, publicDirectives } from './toolbar/toolbar.module';
 export { ToolbarViewSelectorComponent } from './toolbar/view-selector.component';
+export { ExtendedSlotRange } from './types/slot-selection';
 export { AgendaHeaderItemComponent } from './views/agenda/agenda-header-item.component';
 export { AgendaHeaderComponent } from './views/agenda/agenda-header.component';
 export { AgendaTaskItemComponent } from './views/agenda/agenda-task-item.component';
@@ -59,6 +60,7 @@ export { HintContainerComponent } from './views/common/hint-container.component'
 export { RepeatPipe } from './views/common/repeat.pipe';
 export { ResizeHintComponent } from './views/common/resize-hint.component';
 export { ResourceIteratorPipe } from './views/common/resource-iterator.pipe';
+export { SlotSelectableDirective } from './views/common/slot-selectable.directive';
 export { ViewFooterComponent } from './views/common/view-footer.component';
 export { ViewsSharedModule } from './views/common/views-shared.module';
 export { WorkHoursFooterDirective } from './views/common/work-hours-footer.directive';

package/dist/es2015/index.js

@@ -59,6 +59,7 @@ export { HintContainerComponent } from './views/common/hint-container.component'
 export { RepeatPipe } from './views/common/repeat.pipe';
 export { ResizeHintComponent } from './views/common/resize-hint.component';
 export { ResourceIteratorPipe } from './views/common/resource-iterator.pipe';
+export { SlotSelectableDirective } from './views/common/slot-selectable.directive';
 export { ViewFooterComponent } from './views/common/view-footer.component';
 export { ViewsSharedModule } from './views/common/views-shared.module';
 export { WorkHoursFooterDirective } from './views/common/work-hours-footer.directive';