@progress/kendo-angular-scheduler 4.0.0-next.202204011528 → 4.0.0

package/editing-directives/base-edit.service.d.ts

@@ -69,8 +69,26 @@ export declare abstract class BaseEditService<TEvent> implements EditService<TEv
     remove(event: TEvent): void;
     removeSeries(event: TEvent): void;
     removeOccurrence(event: TEvent): void;
+    /**
+     * Returns the master recurring event for a specified recurring event.
+     *
+     * @param event - An event from the recurrence series.
+     * @returns the master recurring event for the series.
+     */
     findRecurrenceMaster(event: TEvent): any;
+    /**
+     * Checks if the event is part of the recurrence series.
+     *
+     * @param event - The event that will be checked.
+     * @returns `true` if the event is an occurrence, an exception, or a master event. Otherwise, returns `false`.
+     */
     isRecurring(event: any): boolean;
+    /**
+     * Checks if the event is a recurrence exception.
+     *
+     * @param event - The event that will be checked.
+     * @returns `true` if the event is a unique event which belongs to a recurrence series. Otherwise, returns `false`.
+     */
     isException(event: any): boolean;
     /**
      * Returns a Boolean value which indicates if the event is new.

package/esm2015/editing/edit-dialog.component.js

@@ -359,7 +359,7 @@ EditDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ve
                 <button kendoButton themeColor="primary" (click)="onSave($event)" [disabled]="!formGroup.valid">{{ textFor('save') }}</button>
             </kendo-dialog-actions>
         </kendo-dialog>
-    `, isInline: true, components: [{ type: i4.DialogComponent, selector: "kendo-dialog", inputs: ["actions", "actionsLayout", "autoFocusedElement", "title", "width", "minWidth", "maxWidth", "height", "minHeight", "maxHeight"], outputs: ["action", "close"], exportAs: ["kendoDialog"] }, { type: i5.SchedulerDateTimePickerComponent, selector: "kendo-scheduler-datetime-picker", inputs: ["isAllDay"], outputs: ["valueChange"] }, { type: i6.TimeZoneEditorComponent, selector: "kendo-timezone-editor", inputs: ["width"], outputs: ["valueChange"] }, { type: i7.RecurrenceEditorComponent, selector: "kendo-recurrence-editor", inputs: ["start", "timezone", "weekStart", "repeatEveryOptions", "endAfterOptions", "repeatOnOptions", "endOnOptions"], outputs: ["valueChange"], exportAs: ["kendoRecurrenceEditor"] }, { type: i8.MultipleResourceEditorComponent, selector: "kendo-multiple-resource-editor" }, { type: i9.SingleResourceEditorComponent, selector: "kendo-single-resource-editor" }, { type: i4.DialogActionsComponent, selector: "kendo-dialog-actions", inputs: ["actions", "layout"], outputs: ["action"] }], directives: [{ type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i11.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i11.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i11.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i12.TextBoxDirective, selector: "input[kendoTextBox]", inputs: ["value"] }, { type: i11.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i11.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i11.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i11.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i12.CheckBoxDirective, selector: "input[kendoCheckBox]", inputs: ["size", "rounded"] }, { type: i11.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i12.TextAreaDirective, selector: "textarea[kendoTextArea]", inputs: ["autoSize", "value"], outputs: ["valueChange"] }, { type: i10.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i13.ButtonDirective, selector: "button[kendoButton], span[kendoButton]", inputs: ["toggleable", "togglable", "selected", "tabIndex", "icon", "iconClass", "imageUrl", "disabled", "size", "rounded", "fillMode", "themeColor", "shape", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }] });
+    `, isInline: true, components: [{ type: i4.DialogComponent, selector: "kendo-dialog", inputs: ["actions", "actionsLayout", "autoFocusedElement", "title", "width", "minWidth", "maxWidth", "height", "minHeight", "maxHeight"], outputs: ["action", "close"], exportAs: ["kendoDialog"] }, { type: i5.SchedulerDateTimePickerComponent, selector: "kendo-scheduler-datetime-picker", inputs: ["isAllDay"], outputs: ["valueChange"] }, { type: i6.TimeZoneEditorComponent, selector: "kendo-timezone-editor", inputs: ["width"], outputs: ["valueChange"] }, { type: i7.RecurrenceEditorComponent, selector: "kendo-recurrence-editor", inputs: ["start", "timezone", "weekStart", "repeatEveryOptions", "endAfterOptions", "repeatOnOptions", "endOnOptions"], outputs: ["valueChange"], exportAs: ["kendoRecurrenceEditor"] }, { type: i8.MultipleResourceEditorComponent, selector: "kendo-multiple-resource-editor" }, { type: i9.SingleResourceEditorComponent, selector: "kendo-single-resource-editor" }, { type: i4.DialogActionsComponent, selector: "kendo-dialog-actions", inputs: ["actions", "layout"], outputs: ["action"] }], directives: [{ type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i11.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i11.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i11.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i12.TextBoxDirective, selector: "input[kendoTextBox]", inputs: ["value"] }, { type: i11.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i11.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i11.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i11.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i12.CheckBoxDirective, selector: "input[kendoCheckBox]", inputs: ["size", "rounded"] }, { type: i11.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i12.TextAreaDirective, selector: "textarea[kendoTextArea]", inputs: ["autoSize", "value"], outputs: ["valueChange"] }, { type: i10.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i13.ButtonDirective, selector: "button[kendoButton], span[kendoButton]", inputs: ["toggleable", "togglable", "selected", "tabIndex", "icon", "iconClass", "imageUrl", "disabled", "size", "rounded", "fillMode", "themeColor", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: EditDialogComponent, decorators: [{
             type: Component,
             args: [{

package/esm2015/editing/recurrence/recurrence-frequency-editor.component.js

@@ -53,7 +53,7 @@ RecurrenceFrequencyEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersio
                 >{{ freq.text }}</button>
             </kendo-buttongroup>
         </div>
-    `, isInline: true, components: [{ type: i3.ButtonGroupComponent, selector: "kendo-buttongroup", inputs: ["disabled", "selection", "width", "tabIndex"], outputs: ["navigate"], exportAs: ["kendoButtonGroup"] }], directives: [{ type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.ButtonDirective, selector: "button[kendoButton], span[kendoButton]", inputs: ["toggleable", "togglable", "selected", "tabIndex", "icon", "iconClass", "imageUrl", "disabled", "size", "rounded", "fillMode", "themeColor", "shape", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }] });
+    `, isInline: true, components: [{ type: i3.ButtonGroupComponent, selector: "kendo-buttongroup", inputs: ["disabled", "selection", "width", "tabIndex"], outputs: ["navigate"], exportAs: ["kendoButtonGroup"] }], directives: [{ type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.ButtonDirective, selector: "button[kendoButton], span[kendoButton]", inputs: ["toggleable", "togglable", "selected", "tabIndex", "icon", "iconClass", "imageUrl", "disabled", "size", "rounded", "fillMode", "themeColor", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: RecurrenceFrequencyEditorComponent, decorators: [{
             type: Component,
             args: [{

package/esm2015/editing/recurrence/recurrence-weekday-rule-editor.component.js

@@ -78,7 +78,7 @@ RecurrenceWeekdayRuleEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVers
                 >{{ capitalize(day.text) }}</button>
             </kendo-buttongroup>
         </div>
-    `, isInline: true, components: [{ type: i3.ButtonGroupComponent, selector: "kendo-buttongroup", inputs: ["disabled", "selection", "width", "tabIndex"], outputs: ["navigate"], exportAs: ["kendoButtonGroup"] }], directives: [{ type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.ButtonDirective, selector: "button[kendoButton], span[kendoButton]", inputs: ["toggleable", "togglable", "selected", "tabIndex", "icon", "iconClass", "imageUrl", "disabled", "size", "rounded", "fillMode", "themeColor", "shape", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }] });
+    `, isInline: true, components: [{ type: i3.ButtonGroupComponent, selector: "kendo-buttongroup", inputs: ["disabled", "selection", "width", "tabIndex"], outputs: ["navigate"], exportAs: ["kendoButtonGroup"] }], directives: [{ type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.ButtonDirective, selector: "button[kendoButton], span[kendoButton]", inputs: ["toggleable", "togglable", "selected", "tabIndex", "icon", "iconClass", "imageUrl", "disabled", "size", "rounded", "fillMode", "themeColor", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: RecurrenceWeekdayRuleEditorComponent, decorators: [{
             type: Component,
             args: [{

package/esm2015/editing-directives/base-edit.service.js

@@ -99,6 +99,12 @@ export class BaseEditService {
         this.logRemoveOccurrence(event);
         this.saveChanges();
     }
+    /**
+     * Returns the master recurring event for a specified recurring event.
+     *
+     * @param event - An event from the recurrence series.
+     * @returns the master recurring event for the series.
+     */
     findRecurrenceMaster(event) {
         const id = this.getId(event);
         const recurrenceId = this.getRecurrenceId(event);
@@ -106,9 +112,21 @@ export class BaseEditService {
         const index = this.itemIndex(headId, this.data);
         return this.data[index];
     }
+    /**
+     * Checks if the event is part of the recurrence series.
+     *
+     * @param event - The event that will be checked.
+     * @returns `true` if the event is an occurrence, an exception, or a master event. Otherwise, returns `false`.
+     */
     isRecurring(event) {
         return isRecurring(event, this.fields);
     }
+    /**
+     * Checks if the event is a recurrence exception.
+     *
+     * @param event - The event that will be checked.
+     * @returns `true` if the event is a unique event which belongs to a recurrence series. Otherwise, returns `false`.
+     */
     isException(event) {
         return isException(event, this.fields);
     }

package/esm2015/package-metadata.js

@@ -9,7 +9,7 @@ export const packageMetadata = {
     name: '@progress/kendo-angular-scheduler',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1648826436,
+    publishDate: 1650441034,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning'
 };

package/esm2015/scheduler.component.js

@@ -158,6 +158,10 @@ export class SchedulerComponent {
          * Specifies the Scheduler current time marker settings.
          */
         this.currentTimeMarker = true;
+        /**
+         * Specifies the settings for the ongoing events highlight of the Scheduler.
+         */
+        this.highlightOngoingEvents = true;
         /**
          * A callback that executes for each slot of the Scheduler view.
          * If it returns `true`, the `k-state-selected` CSS class will be added to the cell, making it visibly selected.
@@ -729,6 +733,7 @@ export class SchedulerComponent {
             selectable: this.selectable,
             timezone: this.timezone,
             currentTimeMarker: this.currentTimeMarker,
+            highlightOngoingEvents: this.highlightOngoingEvents,
             slotClass: this.slotClass,
             slotFill: this.slotFill,
             columnWidth: this.columnWidth,
@@ -860,7 +865,7 @@ export class SchedulerComponent {
     }
 }
 SchedulerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SchedulerComponent, deps: [{ token: i0.ElementRef }, { token: i1.ViewContextService }, { token: i2.ViewStateService }, { token: i3.EditService }, { token: i4.DialogsService }, { token: i5.IntlService }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: i6.PDFService }, { token: i7.LocalizationService }, { token: i8.DomEventsService }, { token: i0.Renderer2 }, { token: i9.FocusService }], target: i0.ɵɵFactoryTarget.Component });
-SchedulerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SchedulerComponent, selector: "kendo-scheduler", inputs: { selectedViewIndex: "selectedViewIndex", editable: "editable", selectable: "selectable", min: "min", max: "max", eventHeight: "eventHeight", columnWidth: "columnWidth", showWorkHours: "showWorkHours", startTime: "startTime", endTime: "endTime", workDayStart: "workDayStart", workDayEnd: "workDayEnd", workWeekStart: "workWeekStart", workWeekEnd: "workWeekEnd", weekStart: "weekStart", slotDuration: "slotDuration", slotDivisions: "slotDivisions", slotFill: "slotFill", scrollTime: "scrollTime", group: "group", resources: "resources", loading: "loading", timezone: "timezone", events: "events", selectedDate: "selectedDate", modelFields: "modelFields", currentTimeMarker: "currentTimeMarker", slotClass: "slotClass", eventClass: "eventClass", eventStyles: "eventStyles", isSlotSelected: "isSlotSelected" }, outputs: { selectedViewIndexChange: "selectedViewIndexChange", navigate: "navigate", dateChange: "dateChange", slotClick: "slotClick", slotDblClick: "slotDblClick", create: "create", eventClick: "eventClick", eventDblClick: "eventDblClick", eventKeydown: "eventKeydown", cancel: "cancel", save: "save", remove: "remove", resizeStart: "resizeStart", resize: "resize", resizeEnd: "resizeEnd", dragStart: "dragStart", drag: "drag", dragEnd: "dragEnd", slotDragStart: "slotDragStart", slotDrag: "slotDrag", slotDragEnd: "slotDragEnd", pdfExport: "pdfExport" }, host: { properties: { "class.k-widget": "this.hostClasses", "class.k-scheduler": "this.hostClasses", "class.k-floatwrap": "this.hostClasses", "class.k-rtl": "this.rtl", "attr.dir": "this.dir" } }, providers: [
+SchedulerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SchedulerComponent, selector: "kendo-scheduler", inputs: { selectedViewIndex: "selectedViewIndex", editable: "editable", selectable: "selectable", min: "min", max: "max", eventHeight: "eventHeight", columnWidth: "columnWidth", showWorkHours: "showWorkHours", startTime: "startTime", endTime: "endTime", workDayStart: "workDayStart", workDayEnd: "workDayEnd", workWeekStart: "workWeekStart", workWeekEnd: "workWeekEnd", weekStart: "weekStart", slotDuration: "slotDuration", slotDivisions: "slotDivisions", slotFill: "slotFill", scrollTime: "scrollTime", group: "group", resources: "resources", loading: "loading", timezone: "timezone", events: "events", selectedDate: "selectedDate", modelFields: "modelFields", currentTimeMarker: "currentTimeMarker", highlightOngoingEvents: "highlightOngoingEvents", slotClass: "slotClass", eventClass: "eventClass", eventStyles: "eventStyles", isSlotSelected: "isSlotSelected" }, outputs: { selectedViewIndexChange: "selectedViewIndexChange", navigate: "navigate", dateChange: "dateChange", slotClick: "slotClick", slotDblClick: "slotDblClick", create: "create", eventClick: "eventClick", eventDblClick: "eventDblClick", eventKeydown: "eventKeydown", cancel: "cancel", save: "save", remove: "remove", resizeStart: "resizeStart", resize: "resize", resizeEnd: "resizeEnd", dragStart: "dragStart", drag: "drag", dragEnd: "dragEnd", slotDragStart: "slotDragStart", slotDrag: "slotDrag", slotDragEnd: "slotDragEnd", pdfExport: "pdfExport" }, host: { properties: { "class.k-widget": "this.hostClasses", "class.k-scheduler": "this.hostClasses", "class.k-floatwrap": "this.hostClasses", "class.k-rtl": "this.rtl", "attr.dir": "this.dir" } }, providers: [
         EditService,
         DialogsService,
         DomEventsService,
@@ -1501,6 +1506,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 type: Input
             }], currentTimeMarker: [{
                 type: Input
+            }], highlightOngoingEvents: [{
+                type: Input
             }], slotClass: [{
                 type: Input
             }], eventClass: [{

package/esm2015/toolbar/navigation.component.js

@@ -208,7 +208,7 @@ ToolbarNavigationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0
                 </kendo-calendar-messages>
             </kendo-calendar>
         </ng-template>
-    `, isInline: true, components: [{ type: i4.CalendarComponent, selector: "kendo-calendar", inputs: ["id", "focusedDate", "min", "max", "rangeValidation", "selection", "value", "disabled", "tabindex", "tabIndex", "disabledDates", "navigation", "activeView", "bottomView", "topView", "type", "animateNavigation", "weekNumber", "cellTemplate", "monthCellTemplate", "yearCellTemplate", "decadeCellTemplate", "centuryCellTemplate", "weekNumberTemplate", "headerTitleTemplate", "navigationItemTemplate"], outputs: ["activeViewChange", "navigate", "activeViewDateChange", "valueChange"], exportAs: ["kendo-calendar"] }, { type: i4.CalendarCustomMessagesComponent, selector: "kendo-calendar-messages" }], directives: [{ type: i5.ButtonDirective, selector: "button[kendoButton], span[kendoButton]", inputs: ["toggleable", "togglable", "selected", "tabIndex", "icon", "iconClass", "imageUrl", "disabled", "size", "rounded", "fillMode", "themeColor", "shape", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }], pipes: { "async": i6.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    `, isInline: true, components: [{ type: i4.CalendarComponent, selector: "kendo-calendar", inputs: ["id", "focusedDate", "min", "max", "rangeValidation", "selection", "value", "disabled", "tabindex", "tabIndex", "disabledDates", "navigation", "activeView", "bottomView", "topView", "type", "animateNavigation", "weekNumber", "cellTemplate", "monthCellTemplate", "yearCellTemplate", "decadeCellTemplate", "centuryCellTemplate", "weekNumberTemplate", "headerTitleTemplate", "navigationItemTemplate"], outputs: ["activeViewChange", "navigate", "activeViewDateChange", "valueChange"], exportAs: ["kendo-calendar"] }, { type: i4.CalendarCustomMessagesComponent, selector: "kendo-calendar-messages" }], directives: [{ type: i5.ButtonDirective, selector: "button[kendoButton], span[kendoButton]", inputs: ["toggleable", "togglable", "selected", "tabIndex", "icon", "iconClass", "imageUrl", "disabled", "size", "rounded", "fillMode", "themeColor", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }], pipes: { "async": i6.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ToolbarNavigationComponent, decorators: [{
             type: Component,
             args: [{

package/esm2015/toolbar/view-selector.component.js

@@ -93,7 +93,7 @@ ToolbarViewSelectorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12
                 </span>
             </button>
         </span>
-    `, isInline: true, directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.ButtonDirective, selector: "button[kendoButton], span[kendoButton]", inputs: ["toggleable", "togglable", "selected", "tabIndex", "icon", "iconClass", "imageUrl", "disabled", "size", "rounded", "fillMode", "themeColor", "shape", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }] });
+    `, isInline: true, directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.ButtonDirective, selector: "button[kendoButton], span[kendoButton]", inputs: ["toggleable", "togglable", "selected", "tabIndex", "icon", "iconClass", "imageUrl", "disabled", "size", "rounded", "fillMode", "themeColor", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ToolbarViewSelectorComponent, decorators: [{
             type: Component,
             args: [{

package/esm2015/types/ongoing-events-settings.interface.js

@@ -0,0 +1,5 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+export {};

package/esm2015/views/common/base-view.js

@@ -38,6 +38,9 @@ export class BaseView {
         this.pdfService = pdfService;
         this.localization = localization;
         this.cdr = cdr;
+        /**
+         * The non-all-day events.
+         */
         this.items = new BehaviorSubject(null);
         this.horizontalResources = [];
         this.verticalResources = [];

package/esm2015/views/common/configuration-view-base.js

@@ -45,6 +45,12 @@ export class ConfigurationViewBase extends SchedulerView {
     get viewEventStyles() {
         return isPresent(this.eventStyles) ? this.eventStyles : this.schedulerOptions.eventStyles;
     }
+    /**
+     * @hidden
+     */
+    get viewHighlightOngoingEvents() {
+        return isPresent(this.highlightOngoingEvents) ? this.highlightOngoingEvents : this.schedulerOptions.highlightOngoingEvents;
+    }
     /**
      * @hidden
      */
@@ -62,7 +68,7 @@ export class ConfigurationViewBase extends SchedulerView {
     }
 }
 ConfigurationViewBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ConfigurationViewBase, deps: [{ token: i1.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: i2.ViewContextService }, { token: i3.ViewStateService }], target: i0.ɵɵFactoryTarget.Directive });
-ConfigurationViewBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: ConfigurationViewBase, inputs: { slotClass: "slotClass", eventClass: "eventClass", eventStyles: "eventStyles" }, queries: [{ propertyName: "eventTemplate", first: true, predicate: EventTemplateDirective, descendants: true }, { propertyName: "groupHeaderTemplate", first: true, predicate: GroupHeaderTemplateDirective, descendants: true }], viewQueries: [{ propertyName: "template", first: true, predicate: ["content"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0 });
+ConfigurationViewBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: ConfigurationViewBase, inputs: { slotClass: "slotClass", eventClass: "eventClass", eventStyles: "eventStyles", highlightOngoingEvents: "highlightOngoingEvents" }, queries: [{ propertyName: "eventTemplate", first: true, predicate: EventTemplateDirective, descendants: true }, { propertyName: "groupHeaderTemplate", first: true, predicate: GroupHeaderTemplateDirective, descendants: true }], viewQueries: [{ propertyName: "template", first: true, predicate: ["content"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ConfigurationViewBase, decorators: [{
             type: Directive
         }], ctorParameters: function () { return [{ type: i1.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: i2.ViewContextService }, { type: i3.ViewStateService }]; }, propDecorators: { slotClass: [{
@@ -71,6 +77,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 type: Input
             }], eventStyles: [{
                 type: Input
+            }], highlightOngoingEvents: [{
+                type: Input
             }], template: [{
                 type: ViewChild,
                 args: ['content', { static: true }]

package/esm2015/views/common/view-footer.component.js

@@ -30,7 +30,7 @@ ViewFooterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ve
             <span class="k-button-icon k-icon" [ngClass]="item.iconClass"></span>
             <span class="k-button-text">{{ item.text }}</span>
         </button>
-    `, isInline: true, directives: [{ type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.ButtonDirective, selector: "button[kendoButton], span[kendoButton]", inputs: ["toggleable", "togglable", "selected", "tabIndex", "icon", "iconClass", "imageUrl", "disabled", "size", "rounded", "fillMode", "themeColor", "shape", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
+    `, isInline: true, directives: [{ type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.ButtonDirective, selector: "button[kendoButton], span[kendoButton]", inputs: ["toggleable", "togglable", "selected", "tabIndex", "icon", "iconClass", "imageUrl", "disabled", "size", "rounded", "fillMode", "themeColor", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ViewFooterComponent, decorators: [{
             type: Component,
             args: [{

package/esm2015/views/constants.js

@@ -21,3 +21,9 @@ export { MS_PER_DAY } from '@progress/kendo-date-math';
 export const BORDER_WIDTH = 1;
 /** @hidden */
 export const DEFAULT_EVENT_HEIGHT = 25;
+/** @hidden */
+export const ONGOING_EVENT_CSS_CLASS = 'k-event-ongoing';
+/** @hidden */
+export const DAYS_IN_WEEK_COUNT = 7;
+/** @hidden */
+export const WEEKS_COUNT = 6;

package/esm2015/views/day-time/day-time-view-base.js

@@ -22,6 +22,7 @@ const WORK_WEEK_END = 'workWeekEnd';
 const SLOT_DURATION = 'slotDuration';
 const SLOT_DIVISIONS = 'slotDivisions';
 const CURRENT_TIME_MARKER = 'currentTimeMarker';
+const HIGHLIGHT_ONGOING_EVENTS = 'highlightOngoingEvents';
 /**
  * @hidden
  */
@@ -95,6 +96,12 @@ export class DayTimeViewBase extends ConfigurationViewBase {
     get viewCurrentTimeMarker() {
         return this.optionValue(CURRENT_TIME_MARKER);
     }
+    /**
+     * @hidden
+     */
+    get viewHighlightOngoingEvents() {
+        return this.optionValue(HIGHLIGHT_ONGOING_EVENTS);
+    }
     /**
      * @hidden
      */
@@ -106,7 +113,7 @@ export class DayTimeViewBase extends ConfigurationViewBase {
     }
 }
 DayTimeViewBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DayTimeViewBase, deps: [{ token: i1.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: i2.ViewContextService }, { token: i3.ViewStateService }], target: i0.ɵɵFactoryTarget.Directive });
-DayTimeViewBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: DayTimeViewBase, inputs: { showWorkHours: "showWorkHours", eventHeight: "eventHeight", startTime: "startTime", scrollTime: "scrollTime", endTime: "endTime", workDayStart: "workDayStart", workDayEnd: "workDayEnd", workWeekStart: "workWeekStart", workWeekEnd: "workWeekEnd", slotDuration: "slotDuration", slotDivisions: "slotDivisions", currentTimeMarker: "currentTimeMarker" }, queries: [{ propertyName: "timeSlotTemplate", first: true, predicate: TimeSlotTemplateDirective, descendants: true }, { propertyName: "dateHeaderTemplate", first: true, predicate: DateHeaderTemplateDirective, descendants: true }], usesInheritance: true, ngImport: i0 });
+DayTimeViewBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: DayTimeViewBase, inputs: { showWorkHours: "showWorkHours", eventHeight: "eventHeight", startTime: "startTime", scrollTime: "scrollTime", endTime: "endTime", workDayStart: "workDayStart", workDayEnd: "workDayEnd", workWeekStart: "workWeekStart", workWeekEnd: "workWeekEnd", slotDuration: "slotDuration", slotDivisions: "slotDivisions", currentTimeMarker: "currentTimeMarker", highlightOngoingEvents: "highlightOngoingEvents" }, queries: [{ propertyName: "timeSlotTemplate", first: true, predicate: TimeSlotTemplateDirective, descendants: true }, { propertyName: "dateHeaderTemplate", first: true, predicate: DateHeaderTemplateDirective, descendants: true }], usesInheritance: true, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DayTimeViewBase, decorators: [{
             type: Directive
         }], ctorParameters: function () { return [{ type: i1.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: i2.ViewContextService }, { type: i3.ViewStateService }]; }, propDecorators: { timeSlotTemplate: [{
@@ -139,4 +146,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 type: Input
             }], currentTimeMarker: [{
                 type: Input
+            }], highlightOngoingEvents: [{
+                type: Input
             }] } });

package/esm2015/views/day-time/day-time-view.component.js

@@ -9,9 +9,10 @@ import { fromEvent } from 'rxjs';
 import { toInvariantTime, dateInRange, setCoordinates, dateWithTime, toUTCTime, toUTCDateTime } from '../utils';
 import { createTimeSlots } from './utils';
 import { BaseView } from '../common/base-view';
-import { MIDNIGHT_INVARIANT, MS_PER_MINUTE } from '../constants';
-import { fromClick, fromDoubleClick, isNumber } from '../../common/util';
+import { MIDNIGHT_INVARIANT, MS_PER_MINUTE, ONGOING_EVENT_CSS_CLASS } from '../constants';
+import { fromClick, fromDoubleClick, isNumber, isPresent } from '../../common/util';
 import { rtlScrollPosition, hasClasses } from '../../common/dom-queries';
+import { DayTimeViewItemComponent } from './day-time-view-item.component';
 import * as i0 from "@angular/core";
 import * as i1 from "../view-context.service";
 import * as i2 from "../view-state.service";
@@ -49,6 +50,8 @@ export class DayTimeViewComponent extends BaseView {
         this.verticalTime = true;
         this.initialUpdate = true;
         this.updateCurrentTime = this.updateCurrentTime.bind(this);
+        this.toggleOngoingClass = this.toggleOngoingClass.bind(this);
+        this.updateOngoingEvents = this.updateOngoingEvents.bind(this);
     }
     get classNames() {
         return `k-scheduler-${this.name}view`;
@@ -77,6 +80,7 @@ export class DayTimeViewComponent extends BaseView {
     ngOnDestroy() {
         super.ngOnDestroy();
         clearTimeout(this.currentTimeTimeout);
+        clearTimeout(this.ongoingEventsTimeout);
     }
     verticalItem(leafIndex, resourceIndex) {
         const data = this.verticalResources[resourceIndex].data || [];
@@ -97,6 +101,14 @@ export class DayTimeViewComponent extends BaseView {
             });
         }
     }
+    toggleOngoingClass() {
+        const now = this.currentTime();
+        const cssClass = isPresent(this.highlightOngoingEvents.cssClass) ? this.highlightOngoingEvents.cssClass : ONGOING_EVENT_CSS_CLASS;
+        this.eventElements.forEach((event) => {
+            const isOngoing = dateInRange(now, event.item.start, event.item.end);
+            this.renderer[isOngoing ? 'addClass' : 'removeClass'](event.nativeElement, cssClass);
+        });
+    }
     scrollToTime(time = this.scrollTime) {
         let date;
         if (typeof time === 'string') {
@@ -124,6 +136,7 @@ export class DayTimeViewComponent extends BaseView {
     updateView() {
         super.updateView();
         this.updateCurrentTime();
+        this.updateOngoingEvents();
         if (this.initialUpdate) {
             this.scrollToTime();
             this.initialUpdate = false;
@@ -162,6 +175,17 @@ export class DayTimeViewComponent extends BaseView {
             this.positionCurrentTime();
         }
     }
+    updateOngoingEvents() {
+        const disabled = !this.highlightOngoingEvents || this.highlightOngoingEvents.enabled === false;
+        if (!isDocumentAvailable() || disabled) {
+            return;
+        }
+        clearTimeout(this.ongoingEventsTimeout);
+        this.zone.runOutsideAngular(() => {
+            this.ongoingEventsTimeout = setTimeout(this.updateOngoingEvents, this.highlightOngoingEvents.updateInterval || MS_PER_MINUTE);
+        });
+        this.toggleOngoingClass();
+    }
     positionCurrentTime() {
         if (this.currentTimeElements && this.currentTimeElements.length) {
             const date = this.currentDate.toUTCDate();
@@ -308,7 +332,7 @@ export class DayTimeViewComponent extends BaseView {
     }
 }
 DayTimeViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DayTimeViewComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.ViewContextService }, { token: i2.ViewStateService }, { token: i3.IntlService }, { token: i4.DayTimeSlotService }, { token: i0.NgZone }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i5.PDFService }, { token: i6.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
-DayTimeViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: DayTimeViewComponent, selector: "kendo-day-time-view", inputs: { timeSlotTemplate: "timeSlotTemplate", dateHeaderTemplate: "dateHeaderTemplate", numberOfDays: "numberOfDays", scrollTime: "scrollTime", startTime: "startTime", endTime: "endTime", workDayStart: "workDayStart", workDayEnd: "workDayEnd", workWeekStart: "workWeekStart", workWeekEnd: "workWeekEnd", slotDuration: "slotDuration", slotDivisions: "slotDivisions", showWorkHours: "showWorkHours", getStartDate: "getStartDate", getEndDate: "getEndDate", getNextDate: "getNextDate", currentTimeMarker: "currentTimeMarker" }, viewQueries: [{ propertyName: "currentTimeElements", predicate: ["currentTimeMarker"], descendants: true }, { propertyName: "currentTimeArrows", predicate: ["currentTimeArrow"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: '', isInline: true });
+DayTimeViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: DayTimeViewComponent, selector: "kendo-day-time-view", inputs: { timeSlotTemplate: "timeSlotTemplate", dateHeaderTemplate: "dateHeaderTemplate", numberOfDays: "numberOfDays", scrollTime: "scrollTime", startTime: "startTime", endTime: "endTime", workDayStart: "workDayStart", workDayEnd: "workDayEnd", workWeekStart: "workWeekStart", workWeekEnd: "workWeekEnd", slotDuration: "slotDuration", slotDivisions: "slotDivisions", showWorkHours: "showWorkHours", getStartDate: "getStartDate", getEndDate: "getEndDate", getNextDate: "getNextDate", currentTimeMarker: "currentTimeMarker", highlightOngoingEvents: "highlightOngoingEvents" }, viewQueries: [{ propertyName: "currentTimeElements", predicate: ["currentTimeMarker"], descendants: true }, { propertyName: "eventElements", predicate: DayTimeViewItemComponent, descendants: true }, { propertyName: "currentTimeArrows", predicate: ["currentTimeArrow"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: '', isInline: true });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DayTimeViewComponent, decorators: [{
             type: Component,
             args: [{ selector: 'kendo-day-time-view', template: '' }]
@@ -346,9 +370,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 type: Input
             }], currentTimeMarker: [{
                 type: Input
+            }], highlightOngoingEvents: [{
+                type: Input
             }], currentTimeElements: [{
                 type: ViewChildren,
                 args: ['currentTimeMarker']
+            }], eventElements: [{
+                type: ViewChildren,
+                args: [DayTimeViewItemComponent]
             }], currentTimeArrows: [{
                 type: ViewChildren,
                 args: ['currentTimeArrow']

package/esm2015/views/month/month-view-renderer.component.js

@@ -2,14 +2,17 @@
 * Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-import { Component, Input } from '@angular/core';
-import { isChanged } from '@progress/kendo-angular-common';
+import { Component, Input, ViewChildren } from '@angular/core';
+import { isChanged, isDocumentAvailable } from '@progress/kendo-angular-common';
 import { addDays, addMonths, firstDayInWeek, firstDayOfMonth, getDate, toLocalDate } from '@progress/kendo-date-math';
 import { closestInScope, hasClasses } from '../../common/dom-queries';
 import { MonthSlotService } from './month-slot.service';
 import { updateTaskData, createTasks } from './utils';
-import { toPx } from '../utils';
+import { toPx, dateInRange } from '../utils';
 import { BaseView } from '../common/base-view';
+import { MonthViewItemComponent } from './month-view-item.component';
+import { isPresent } from '../../common/util';
+import { DAYS_IN_WEEK_COUNT, WEEKS_COUNT, MS_PER_MINUTE, ONGOING_EVENT_CSS_CLASS } from '../constants';
 import * as i0 from "@angular/core";
 import * as i1 from "../view-context.service";
 import * as i2 from "../view-state.service";
@@ -25,8 +28,6 @@ import * as i11 from "./month-slot.directive";
 import * as i12 from "../../navigation/focusable.directive";
 import * as i13 from "../common/resource-iterator.pipe";
 import * as i14 from "../common/repeat.pipe";
-const DAYS_IN_WEEK_COUNT = 7;
-const WEEKS_COUNT = 6;
 /**
  * @hidden
  */
@@ -35,6 +36,7 @@ export class MonthViewRendererComponent extends BaseView {
         super(viewContext, viewState, intl, slotService, zone, renderer, element, pdfService, localization, changeDetector);
         this.resizeHintFormat = { skeleton: 'Md' };
         this.weeks = [];
+        this.updateOngoingEvents = this.updateOngoingEvents.bind(this);
     }
     get monthDaySlotTemplateRef() {
         return this.monthDaySlotTemplate || (this.schedulerMonthDaySlotTemplate || {}).templateRef;
@@ -45,6 +47,14 @@ export class MonthViewRendererComponent extends BaseView {
         }
         super.ngOnChanges(changes);
     }
+    ngAfterViewInit() {
+        this.updateOngoingEvents();
+        super.ngAfterViewInit();
+    }
+    ngOnDestroy() {
+        clearTimeout(this.ongoingEventsTimeout);
+        super.ngOnDestroy();
+    }
     horizontalColspan(resourceIndex) {
         const resources = this.horizontalResources;
         let result = DAYS_IN_WEEK_COUNT;
@@ -172,6 +182,28 @@ export class MonthViewRendererComponent extends BaseView {
     slotByPosition(x, y) {
         return this.slotService.slotByPosition(x, y);
     }
+    updateOngoingEvents() {
+        const disabled = !this.highlightOngoingEvents || this.highlightOngoingEvents.enabled === false;
+        if (!isDocumentAvailable() || disabled) {
+            return;
+        }
+        clearTimeout(this.ongoingEventsTimeout);
+        this.zone.runOutsideAngular(() => {
+            this.ongoingEventsTimeout = setTimeout(this.updateOngoingEvents, this.highlightOngoingEvents.updateInterval || MS_PER_MINUTE);
+        });
+        this.toggleOngoingClass();
+    }
+    currentTime() {
+        return new Date();
+    }
+    toggleOngoingClass() {
+        const now = this.currentTime();
+        const cssClass = isPresent(this.highlightOngoingEvents.cssClass) ? this.highlightOngoingEvents.cssClass : ONGOING_EVENT_CSS_CLASS;
+        this.eventElements.forEach((event) => {
+            const isOngoing = dateInRange(now, event.item.start, event.item.end);
+            this.renderer[isOngoing ? 'addClass' : 'removeClass'](event.nativeElement, cssClass);
+        });
+    }
     createDaySlots({ start }) {
         const weeks = [];
         let date = start;
@@ -187,9 +219,9 @@ export class MonthViewRendererComponent extends BaseView {
     }
 }
 MonthViewRendererComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: MonthViewRendererComponent, deps: [{ token: i1.ViewContextService }, { token: i2.ViewStateService }, { token: i3.IntlService }, { token: i4.MonthSlotService }, { token: i0.NgZone }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i5.PDFService }, { token: i6.LocalizationService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-MonthViewRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: MonthViewRendererComponent, selector: "month-view", inputs: { monthDaySlotTemplate: "monthDaySlotTemplate" }, providers: [
+MonthViewRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: MonthViewRendererComponent, selector: "month-view", inputs: { monthDaySlotTemplate: "monthDaySlotTemplate", highlightOngoingEvents: "highlightOngoingEvents" }, providers: [
         MonthSlotService
-    ], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: `
+    ], viewQueries: [{ propertyName: "eventElements", predicate: MonthViewItemComponent, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: `
         <div class="k-scheduler-layout k-scheduler-monthview k-scheduler-flex-layout">
             <div class="k-scheduler-pane">
                 <div class="k-scheduler-times" #timesHeader *ngIf="verticalResources.length">
@@ -436,4 +468,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 }]
         }], ctorParameters: function () { return [{ type: i1.ViewContextService }, { type: i2.ViewStateService }, { type: i3.IntlService }, { type: i4.MonthSlotService }, { type: i0.NgZone }, { type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i5.PDFService }, { type: i6.LocalizationService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { monthDaySlotTemplate: [{
                 type: Input
+            }], highlightOngoingEvents: [{
+                type: Input
+            }], eventElements: [{
+                type: ViewChildren,
+                args: [MonthViewItemComponent]
             }] } });

package/esm2015/views/month/month-view.component.js

@@ -64,10 +64,11 @@ MonthViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ver
                 [monthDaySlotTemplate]="monthDaySlotTemplate?.templateRef"
                 [selectedDateFormat]="selectedDateFormat"
                 [selectedShortDateFormat]="selectedShortDateFormat"
+                [highlightOngoingEvents]="viewHighlightOngoingEvents"
                 [weekStart]="viewWeekStart">
             </month-view>
         </ng-template>
-    `, isInline: true, components: [{ type: i4.MonthViewRendererComponent, selector: "month-view", inputs: ["monthDaySlotTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    `, isInline: true, components: [{ type: i4.MonthViewRendererComponent, selector: "month-view", inputs: ["monthDaySlotTemplate", "highlightOngoingEvents"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: MonthViewComponent, decorators: [{
             type: Component,
             args: [{
@@ -89,6 +90,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 [monthDaySlotTemplate]="monthDaySlotTemplate?.templateRef"
                 [selectedDateFormat]="selectedDateFormat"
                 [selectedShortDateFormat]="selectedShortDateFormat"
+                [highlightOngoingEvents]="viewHighlightOngoingEvents"
                 [weekStart]="viewWeekStart">
             </month-view>
         </ng-template>

package/esm2015/views/multi-day/day-view.component.js

@@ -69,6 +69,7 @@ DayViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", versi
                 [name]="name"
                 [eventHeight]="viewEventHeight"
                 [currentTimeMarker]="viewCurrentTimeMarker"
+                [highlightOngoingEvents]="viewHighlightOngoingEvents"
                 [showWorkHours]="shouldShowWorkHours"
                 [scrollTime]="viewScrollTime"
                 [startTime]="viewStartTime"
@@ -112,6 +113,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 [name]="name"
                 [eventHeight]="viewEventHeight"
                 [currentTimeMarker]="viewCurrentTimeMarker"
+                [highlightOngoingEvents]="viewHighlightOngoingEvents"
                 [showWorkHours]="shouldShowWorkHours"
                 [scrollTime]="viewScrollTime"
                 [startTime]="viewStartTime"

package/esm2015/views/multi-day/multi-day-view.component.js

@@ -77,6 +77,7 @@ MultiDayViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0",
                 [numberOfDays]="numberOfDays"
                 [eventHeight]="viewEventHeight"
                 [currentTimeMarker]="viewCurrentTimeMarker"
+                [highlightOngoingEvents]="viewHighlightOngoingEvents"
                 [showWorkHours]="shouldShowWorkHours"
                 [scrollTime]="viewScrollTime"
                 [startTime]="viewStartTime"
@@ -122,6 +123,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 [numberOfDays]="numberOfDays"
                 [eventHeight]="viewEventHeight"
                 [currentTimeMarker]="viewCurrentTimeMarker"
+                [highlightOngoingEvents]="viewHighlightOngoingEvents"
                 [showWorkHours]="shouldShowWorkHours"
                 [scrollTime]="viewScrollTime"
                 [startTime]="viewStartTime"

package/esm2015/views/multi-day/week-view.component.js

@@ -69,6 +69,7 @@ WeekViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", vers
                 [getStartDate]="getStartDate"
                 [eventHeight]="viewEventHeight"
                 [currentTimeMarker]="viewCurrentTimeMarker"
+                [highlightOngoingEvents]="viewHighlightOngoingEvents"
                 [showWorkHours]="shouldShowWorkHours"
                 [scrollTime]="viewScrollTime"
                 [startTime]="viewStartTime"
@@ -115,6 +116,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 [getStartDate]="getStartDate"
                 [eventHeight]="viewEventHeight"
                 [currentTimeMarker]="viewCurrentTimeMarker"
+                [highlightOngoingEvents]="viewHighlightOngoingEvents"
                 [showWorkHours]="shouldShowWorkHours"
                 [scrollTime]="viewScrollTime"
                 [startTime]="viewStartTime"

package/esm2015/views/multi-day/work-week-view.component.js

@@ -69,6 +69,7 @@ WorkWeekViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0",
                 [getNextDate]="getNextDate"
                 [eventHeight]="viewEventHeight"
                 [currentTimeMarker]="viewCurrentTimeMarker"
+                [highlightOngoingEvents]="viewHighlightOngoingEvents"
                 [showWorkHours]="shouldShowWorkHours"
                 [scrollTime]="viewScrollTime"
                 [startTime]="viewStartTime"
@@ -116,6 +117,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 [getNextDate]="getNextDate"
                 [eventHeight]="viewEventHeight"
                 [currentTimeMarker]="viewCurrentTimeMarker"
+                [highlightOngoingEvents]="viewHighlightOngoingEvents"
                 [showWorkHours]="shouldShowWorkHours"
                 [scrollTime]="viewScrollTime"
                 [startTime]="viewStartTime"

package/esm2015/views/timeline/timeline-month-view.component.js

@@ -78,6 +78,7 @@ TimelineMonthViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0
                 [eventHeight]="viewEventHeight"
                 [columnWidth]="viewColumnWidth"
                 [currentTimeMarker]="viewCurrentTimeMarker"
+                [highlightOngoingEvents]="viewHighlightOngoingEvents"
                 [showWorkHours]="shouldShowWorkHours"
                 [scrollTime]="viewScrollTime"
                 [startTime]="viewStartTime"
@@ -121,6 +122,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 [eventHeight]="viewEventHeight"
                 [columnWidth]="viewColumnWidth"
                 [currentTimeMarker]="viewCurrentTimeMarker"
+                [highlightOngoingEvents]="viewHighlightOngoingEvents"
                 [showWorkHours]="shouldShowWorkHours"
                 [scrollTime]="viewScrollTime"
                 [startTime]="viewStartTime"