@progress/kendo-angular-scheduler 4.1.0-dev.202205110843 → 4.2.0

package/common/dom-queries.d.ts

@@ -21,7 +21,7 @@ export declare const firstElementChild: (node: any) => any;
 /**
  * @hidden
  */
-export declare const closestInScope: (node: any, predicate: any, scope: any) => any;
+export declare const closestInScope: (node: any, predicate: any, scope: any) => HTMLElement;
 /**
  * @hidden
  */

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

@@ -366,7 +366,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", "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", "animation"], 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/localization/messages.js

@@ -11,7 +11,7 @@ import * as i0 from "@angular/core";
 export class Messages extends ComponentMessages {
 }
 Messages.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: Messages, deps: null, target: i0.ɵɵFactoryTarget.Directive });
-Messages.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: Messages, inputs: { allEvents: "allEvents", allDay: "allDay", dateHeader: "dateHeader", timeHeader: "timeHeader", eventHeader: "eventHeader", deleteTitle: "deleteTitle", nextTitle: "nextTitle", previousTitle: "previousTitle", today: "today", calendarToday: "calendarToday", showFullDay: "showFullDay", showWorkDay: "showWorkDay", dayViewTitle: "dayViewTitle", multiDayViewTitle: "multiDayViewTitle", weekViewTitle: "weekViewTitle", workWeekViewTitle: "workWeekViewTitle", monthViewTitle: "monthViewTitle", timelineViewTitle: "timelineViewTitle", timelineWeekViewTitle: "timelineWeekViewTitle", timelineMonthViewTitle: "timelineMonthViewTitle", agendaViewTitle: "agendaViewTitle", cancel: "cancel", save: "save", editorEventTitle: "editorEventTitle", editorEventStart: "editorEventStart", editorEventStartTimeZone: "editorEventStartTimeZone", editorEventEnd: "editorEventEnd", editorEventEndTimeZone: "editorEventEndTimeZone", editorEventAllDay: "editorEventAllDay", editorEventDescription: "editorEventDescription", editorEventSeparateTimeZones: "editorEventSeparateTimeZones", editorEventTimeZone: "editorEventTimeZone", recurrenceEditorRepeat: "recurrenceEditorRepeat", recurrenceEditorDailyInterval: "recurrenceEditorDailyInterval", recurrenceEditorDailyRepeatEvery: "recurrenceEditorDailyRepeatEvery", recurrenceEditorWeeklyInterval: "recurrenceEditorWeeklyInterval", recurrenceEditorWeeklyRepeatEvery: "recurrenceEditorWeeklyRepeatEvery", recurrenceEditorWeeklyRepeatOn: "recurrenceEditorWeeklyRepeatOn", recurrenceEditorMonthlyDay: "recurrenceEditorMonthlyDay", recurrenceEditorMonthlyInterval: "recurrenceEditorMonthlyInterval", recurrenceEditorMonthlyRepeatEvery: "recurrenceEditorMonthlyRepeatEvery", recurrenceEditorMonthlyRepeatOn: "recurrenceEditorMonthlyRepeatOn", recurrenceEditorYearlyOf: "recurrenceEditorYearlyOf", recurrenceEditorYearlyRepeatEvery: "recurrenceEditorYearlyRepeatEvery", recurrenceEditorYearlyRepeatOn: "recurrenceEditorYearlyRepeatOn", recurrenceEditorYearlyInterval: "recurrenceEditorYearlyInterval", recurrenceEditorFrequenciesDaily: "recurrenceEditorFrequenciesDaily", recurrenceEditorFrequenciesMonthly: "recurrenceEditorFrequenciesMonthly", recurrenceEditorFrequenciesNever: "recurrenceEditorFrequenciesNever", recurrenceEditorFrequenciesWeekly: "recurrenceEditorFrequenciesWeekly", recurrenceEditorFrequenciesYearly: "recurrenceEditorFrequenciesYearly", recurrenceEditorOffsetPositionsFirst: "recurrenceEditorOffsetPositionsFirst", recurrenceEditorOffsetPositionsSecond: "recurrenceEditorOffsetPositionsSecond", recurrenceEditorOffsetPositionsThird: "recurrenceEditorOffsetPositionsThird", recurrenceEditorOffsetPositionsFourth: "recurrenceEditorOffsetPositionsFourth", recurrenceEditorOffsetPositionsLast: "recurrenceEditorOffsetPositionsLast", recurrenceEditorWeekdaysDay: "recurrenceEditorWeekdaysDay", recurrenceEditorWeekdaysWeekday: "recurrenceEditorWeekdaysWeekday", recurrenceEditorWeekdaysWeekendday: "recurrenceEditorWeekdaysWeekendday", recurrenceEditorEndAfter: "recurrenceEditorEndAfter", recurrenceEditorEndOccurrence: "recurrenceEditorEndOccurrence", recurrenceEditorEndLabel: "recurrenceEditorEndLabel", recurrenceEditorEndNever: "recurrenceEditorEndNever", recurrenceEditorEndOn: "recurrenceEditorEndOn", editorTitle: "editorTitle", destroy: "destroy", deleteConfirmation: "deleteConfirmation", editRecurringConfirmation: "editRecurringConfirmation", editOccurrence: "editOccurrence", editSeries: "editSeries", deleteRecurringConfirmation: "deleteRecurringConfirmation", deleteOccurrence: "deleteOccurrence", deleteSeries: "deleteSeries", deleteDialogTitle: "deleteDialogTitle", deleteRecurringDialogTitle: "deleteRecurringDialogTitle", editRecurringDialogTitle: "editRecurringDialogTitle" }, usesInheritance: true, ngImport: i0 });
+Messages.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: Messages, inputs: { allEvents: "allEvents", allDay: "allDay", dateHeader: "dateHeader", timeHeader: "timeHeader", eventHeader: "eventHeader", deleteTitle: "deleteTitle", nextTitle: "nextTitle", previousTitle: "previousTitle", today: "today", calendarToday: "calendarToday", showFullDay: "showFullDay", showWorkDay: "showWorkDay", dayViewTitle: "dayViewTitle", multiDayViewTitle: "multiDayViewTitle", weekViewTitle: "weekViewTitle", workWeekViewTitle: "workWeekViewTitle", monthViewTitle: "monthViewTitle", timelineViewTitle: "timelineViewTitle", timelineWeekViewTitle: "timelineWeekViewTitle", timelineMonthViewTitle: "timelineMonthViewTitle", agendaViewTitle: "agendaViewTitle", cancel: "cancel", save: "save", editorEventTitle: "editorEventTitle", editorEventStart: "editorEventStart", editorEventStartTimeZone: "editorEventStartTimeZone", editorEventEnd: "editorEventEnd", editorEventEndTimeZone: "editorEventEndTimeZone", editorEventAllDay: "editorEventAllDay", editorEventDescription: "editorEventDescription", editorEventSeparateTimeZones: "editorEventSeparateTimeZones", editorEventTimeZone: "editorEventTimeZone", recurrenceEditorRepeat: "recurrenceEditorRepeat", recurrenceEditorDailyInterval: "recurrenceEditorDailyInterval", recurrenceEditorDailyRepeatEvery: "recurrenceEditorDailyRepeatEvery", recurrenceEditorWeeklyInterval: "recurrenceEditorWeeklyInterval", recurrenceEditorWeeklyRepeatEvery: "recurrenceEditorWeeklyRepeatEvery", recurrenceEditorWeeklyRepeatOn: "recurrenceEditorWeeklyRepeatOn", recurrenceEditorMonthlyDay: "recurrenceEditorMonthlyDay", recurrenceEditorMonthlyInterval: "recurrenceEditorMonthlyInterval", recurrenceEditorMonthlyRepeatEvery: "recurrenceEditorMonthlyRepeatEvery", recurrenceEditorMonthlyRepeatOn: "recurrenceEditorMonthlyRepeatOn", recurrenceEditorYearlyOf: "recurrenceEditorYearlyOf", recurrenceEditorYearlyRepeatEvery: "recurrenceEditorYearlyRepeatEvery", recurrenceEditorYearlyRepeatOn: "recurrenceEditorYearlyRepeatOn", recurrenceEditorYearlyInterval: "recurrenceEditorYearlyInterval", recurrenceEditorFrequenciesDaily: "recurrenceEditorFrequenciesDaily", recurrenceEditorFrequenciesMonthly: "recurrenceEditorFrequenciesMonthly", recurrenceEditorFrequenciesNever: "recurrenceEditorFrequenciesNever", recurrenceEditorFrequenciesWeekly: "recurrenceEditorFrequenciesWeekly", recurrenceEditorFrequenciesYearly: "recurrenceEditorFrequenciesYearly", recurrenceEditorOffsetPositionsFirst: "recurrenceEditorOffsetPositionsFirst", recurrenceEditorOffsetPositionsSecond: "recurrenceEditorOffsetPositionsSecond", recurrenceEditorOffsetPositionsThird: "recurrenceEditorOffsetPositionsThird", recurrenceEditorOffsetPositionsFourth: "recurrenceEditorOffsetPositionsFourth", recurrenceEditorOffsetPositionsLast: "recurrenceEditorOffsetPositionsLast", recurrenceEditorWeekdaysDay: "recurrenceEditorWeekdaysDay", recurrenceEditorWeekdaysWeekday: "recurrenceEditorWeekdaysWeekday", recurrenceEditorWeekdaysWeekendday: "recurrenceEditorWeekdaysWeekendday", recurrenceEditorEndAfter: "recurrenceEditorEndAfter", recurrenceEditorEndOccurrence: "recurrenceEditorEndOccurrence", recurrenceEditorEndLabel: "recurrenceEditorEndLabel", recurrenceEditorEndNever: "recurrenceEditorEndNever", recurrenceEditorEndOn: "recurrenceEditorEndOn", editorTitle: "editorTitle", destroy: "destroy", deleteConfirmation: "deleteConfirmation", editRecurringConfirmation: "editRecurringConfirmation", editOccurrence: "editOccurrence", editSeries: "editSeries", deleteRecurringConfirmation: "deleteRecurringConfirmation", deleteOccurrence: "deleteOccurrence", deleteSeries: "deleteSeries", deleteDialogTitle: "deleteDialogTitle", deleteRecurringDialogTitle: "deleteRecurringDialogTitle", editRecurringDialogTitle: "editRecurringDialogTitle", selectView: "selectView" }, usesInheritance: true, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: Messages, decorators: [{
             type: Directive
         }], propDecorators: { allEvents: [{
@@ -166,4 +166,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 type: Input
             }], editRecurringDialogTitle: [{
                 type: Input
+            }], selectView: [{
+                type: Input
             }] } });

package/esm2015/navigation/focus.service.js

@@ -2,7 +2,7 @@
 * Copyright © 2021 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
-import { Injectable, Optional } from '@angular/core';
+import { Injectable, Optional, EventEmitter } from '@angular/core';
 import { Subscription } from 'rxjs';
 import * as i0 from "@angular/core";
 import * as i1 from "../views/common/dom-events.service";
@@ -14,6 +14,7 @@ export class FocusService {
         this.renderer = renderer;
         this.wrapper = wrapper;
         this.domEvents = domEvents;
+        this.ariaActiveDescendant = new EventEmitter();
         this.items = new Set();
         this.elementMap = new WeakMap();
         this.subs = new Subscription();
@@ -61,8 +62,18 @@ export class FocusService {
         }
         return this.activeItem !== currentItem;
     }
+    clearActiveDescendant() {
+        this.ariaActiveDescendant.next(null);
+    }
+    ;
     activate(next) {
-        this.items.forEach(item => item.toggle(item === next));
+        this.items.forEach(item => {
+            item.toggle(item === next);
+            if (item === next) {
+                const id = item.element.nativeElement.getAttribute('id');
+                this.ariaActiveDescendant.next(id);
+            }
+        });
         this.activeItem = next;
     }
     activateNext(position) {
@@ -115,6 +126,7 @@ export class FocusService {
         }
         this.focusedItem.toggleFocus(false);
         this.focusedItem = null;
+        this.ariaActiveDescendant.next(null);
     }
 }
 FocusService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FocusService, deps: [{ token: i0.Renderer2, optional: true }, { token: i0.ElementRef, optional: true }, { token: i1.DomEventsService }], target: i0.ɵɵFactoryTarget.Injectable });

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: 1652258515,
+    publishDate: 1655883470,
     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

@@ -96,6 +96,7 @@ export class SchedulerComponent {
         this.renderer = renderer;
         this.focusService = focusService;
         this.hostClasses = true;
+        this.ariaRole = 'application';
         this.rtl = false;
         /**
          * Specifies if the Scheduler is editable.
@@ -434,6 +435,10 @@ export class SchedulerComponent {
                 });
             }
         }));
+        this.subs.add(this.focusService.ariaActiveDescendant.subscribe((id) => {
+            const method = id ? 'setAttribute' : 'removeAttribute';
+            this.renderer[method](this.wrapper.nativeElement, 'aria-activedescendant', id);
+        }));
         this.onViewIndexChange();
         this.notifyOptionsChange = this.notifyOptionsChange.bind(this);
         this.subs.add(this.allDayEventTemplate.changes.subscribe(this.notifyOptionsChange));
@@ -511,6 +516,7 @@ export class SchedulerComponent {
         if (args.isDefaultPrevented()) {
             return true;
         }
+        this.focusService.clearActiveDescendant();
         if (action.type === 'view-change') {
             const views = this.views.toArray();
             const index = views.indexOf(action.view);
@@ -865,7 +871,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", 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: [
+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", "attr.role": "this.ariaRole", "class.k-rtl": "this.rtl", "attr.dir": "this.dir" } }, providers: [
         EditService,
         DialogsService,
         DomEventsService,
@@ -1113,6 +1119,9 @@ SchedulerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ver
 
             i18n-editRecurringDialogTitle="kendo.scheduler.editRecurringDialogTitle|The title of the recurring edit confirmation dialog, similar to 'Edit Recurring Item'"
             editRecurringDialogTitle='Edit Recurring Item'
+
+            i18n-selectView="kendo.scheduler.selectView|The value of the aria-label attribute of the <select> element used for switching the Scheduler views."
+            selectView='Select View'
         >
         </ng-container>
 
@@ -1403,6 +1412,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
 
             i18n-editRecurringDialogTitle="kendo.scheduler.editRecurringDialogTitle|The title of the recurring edit confirmation dialog, similar to 'Edit Recurring Item'"
             editRecurringDialogTitle='Edit Recurring Item'
+
+            i18n-selectView="kendo.scheduler.selectView|The value of the aria-label attribute of the <select> element used for switching the Scheduler views."
+            selectView='Select View'
         >
         </ng-container>
 
@@ -1446,6 +1458,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
             }, {
                 type: HostBinding,
                 args: ['class.k-floatwrap']
+            }], ariaRole: [{
+                type: HostBinding,
+                args: ['attr.role']
             }], rtl: [{
                 type: HostBinding,
                 args: ['class.k-rtl']

package/esm2015/toolbar/navigation.component.js

@@ -196,6 +196,7 @@ ToolbarNavigationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0
             href="#"
             class="k-nav-current"
             tabindex="-1"
+            [attr.aria-live]="'polite'"
         >
             <span class="k-icon k-i-calendar"></span>
             <span class="k-sm-date-format">{{ (ctx.dateRange | async)?.shortText }}</span>
@@ -252,6 +253,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
             href="#"
             class="k-nav-current"
             tabindex="-1"
+            [attr.aria-live]="'polite'"
         >
             <span class="k-icon k-i-calendar"></span>
             <span class="k-sm-date-format">{{ (ctx.dateRange | async)?.shortText }}</span>

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

@@ -5,8 +5,9 @@
 import { Component, HostBinding } from '@angular/core';
 import * as i0 from "@angular/core";
 import * as i1 from "./toolbar.service";
-import * as i2 from "@angular/common";
-import * as i3 from "@progress/kendo-angular-buttons";
+import * as i2 from "@progress/kendo-angular-l10n";
+import * as i3 from "@angular/common";
+import * as i4 from "@progress/kendo-angular-buttons";
 /**
  * A toolbar component which contains the controls for switching the views
  * ([see example]({% slug toolbar_scheduler %}#toc-including-the-built-in-components)).
@@ -23,8 +24,9 @@ import * as i3 from "@progress/kendo-angular-buttons";
  * {% endmeta %}
  */
 export class ToolbarViewSelectorComponent {
-    constructor(service) {
+    constructor(service, localization) {
         this.service = service;
+        this.localization = localization;
         /**
          * @hidden
          */
@@ -36,6 +38,12 @@ export class ToolbarViewSelectorComponent {
     get ctx() {
         return this.service.context;
     }
+    /**
+     * @hidden
+     */
+    get selectView() {
+        return this.localization.get('selectView');
+    }
     ngOnDestroy() {
         if (this.detachDomEvents) {
             this.detachDomEvents();
@@ -68,11 +76,14 @@ export class ToolbarViewSelectorComponent {
         return this.ctx.selectedView === view;
     }
 }
-ToolbarViewSelectorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ToolbarViewSelectorComponent, deps: [{ token: i1.ToolbarService }], target: i0.ɵɵFactoryTarget.Component });
+ToolbarViewSelectorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ToolbarViewSelectorComponent, deps: [{ token: i1.ToolbarService }, { token: i2.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
 ToolbarViewSelectorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ToolbarViewSelectorComponent, selector: "[kendoSchedulerToolbarViewSelector]", host: { properties: { "class.k-scheduler-views-wrapper": "this.hostClasses" } }, ngImport: i0, template: `
-        <select *ngIf="ctx.views?.length > 1"
-                (change)="onChange($event)"
-                class="k-views-dropdown k-picker-md k-rounded-md k-picker-solid k-dropdownlist k-picker">
+        <select
+            *ngIf="ctx.views?.length > 1"
+            (change)="onChange($event)"
+            class="k-views-dropdown k-picker-md k-rounded-md k-picker-solid k-dropdownlist k-picker"
+            [attr.aria-label]="selectView"
+        >
             <option *ngFor="let view of ctx.views"
                 [selected]="isSelected(view) === true"
                 [value]="view.name"
@@ -93,16 +104,19 @@ 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", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }] });
+    `, isInline: true, directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4.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: [{
                     // eslint-disable-next-line @angular-eslint/component-selector
                     selector: '[kendoSchedulerToolbarViewSelector]',
                     template: `
-        <select *ngIf="ctx.views?.length > 1"
-                (change)="onChange($event)"
-                class="k-views-dropdown k-picker-md k-rounded-md k-picker-solid k-dropdownlist k-picker">
+        <select
+            *ngIf="ctx.views?.length > 1"
+            (change)="onChange($event)"
+            class="k-views-dropdown k-picker-md k-rounded-md k-picker-solid k-dropdownlist k-picker"
+            [attr.aria-label]="selectView"
+        >
             <option *ngFor="let view of ctx.views"
                 [selected]="isSelected(view) === true"
                 [value]="view.name"
@@ -125,7 +139,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         </span>
     `
                 }]
-        }], ctorParameters: function () { return [{ type: i1.ToolbarService }]; }, propDecorators: { hostClasses: [{
+        }], ctorParameters: function () { return [{ type: i1.ToolbarService }, { type: i2.LocalizationService }]; }, propDecorators: { hostClasses: [{
                 type: HostBinding,
                 args: ['class.k-scheduler-views-wrapper']
             }] } });

package/esm2015/views/agenda/agenda-header-item.component.js

@@ -13,6 +13,7 @@ import * as i2 from "@progress/kendo-angular-intl";
 export class AgendaHeaderItemComponent {
     constructor() {
         this.classes = true;
+        this.roleAttribute = "rowheader";
     }
     get rowSpan() {
         return this.item.rowSpan;
@@ -22,7 +23,7 @@ export class AgendaHeaderItemComponent {
     }
 }
 AgendaHeaderItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: AgendaHeaderItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-AgendaHeaderItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: AgendaHeaderItemComponent, selector: "[kendoSchedulerAgendaHeaderItem]", inputs: { item: ["kendoSchedulerAgendaHeaderItem", "item"], agendaDateTemplate: "agendaDateTemplate" }, host: { properties: { "class.k-scheduler-datecolumn": "this.classes", "attr.rowspan": "this.rowSpan" } }, ngImport: i0, template: `
+AgendaHeaderItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: AgendaHeaderItemComponent, selector: "[kendoSchedulerAgendaHeaderItem]", inputs: { item: ["kendoSchedulerAgendaHeaderItem", "item"], agendaDateTemplate: "agendaDateTemplate" }, host: { properties: { "class.k-scheduler-datecolumn": "this.classes", "attr.role": "this.roleAttribute", "attr.rowspan": "this.rowSpan" } }, ngImport: i0, template: `
         <ng-container *ngIf="!agendaDateTemplate">
             <strong class="k-scheduler-agendaday">{{itemDate | kendoDate: 'dd'}}</strong>
             <em class="k-scheduler-agendaweek">{{itemDate | kendoDate: 'EEEE'}}</em>
@@ -52,6 +53,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         }], propDecorators: { classes: [{
                 type: HostBinding,
                 args: ["class.k-scheduler-datecolumn"]
+            }], roleAttribute: [{
+                type: HostBinding,
+                args: ["attr.role"]
             }], rowSpan: [{
                 type: HostBinding,
                 args: ["attr.rowspan"]

package/esm2015/views/agenda/agenda-header.component.js

@@ -27,13 +27,13 @@ export class AgendaHeaderComponent {
 AgendaHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: AgendaHeaderComponent, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
 AgendaHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: AgendaHeaderComponent, selector: "[kendoSchedulerAgendaHeader]", inputs: { resources: "resources" }, host: { properties: { "class.k-scheduler-header": "this.classes", "class.k-state-default": "this.classes" } }, ngImport: i0, template: `
         <div class="k-scheduler-header-wrap">
-            <table class="k-scheduler-table" role="presentation">
-                <tbody>
-                    <tr>
-                        <th *ngFor="let resource of resources" class="k-scheduler-groupcolumn"></th>
-                        <th class="k-scheduler-datecolumn">{{ dateMessage }}</th>
-                        <th class="k-scheduler-timecolumn">{{ timeMessage }}</th>
-                        <th>{{ eventMessage }}</th>
+            <table class="k-scheduler-table" role="rowgroup">
+                <tbody role="none">
+                    <tr role="row">
+                        <th *ngFor="let resource of resources" class="k-scheduler-groupcolumn" role="columnheader"></th>
+                        <th class="k-scheduler-datecolumn" role="columnheader">{{ dateMessage }}</th>
+                        <th class="k-scheduler-timecolumn" role="columnheader">{{ timeMessage }}</th>
+                        <th role="columnheader">{{ eventMessage }}</th>
                     </tr>
                 </tbody>
             </table>
@@ -47,13 +47,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     selector: '[kendoSchedulerAgendaHeader]',
                     template: `
         <div class="k-scheduler-header-wrap">
-            <table class="k-scheduler-table" role="presentation">
-                <tbody>
-                    <tr>
-                        <th *ngFor="let resource of resources" class="k-scheduler-groupcolumn"></th>
-                        <th class="k-scheduler-datecolumn">{{ dateMessage }}</th>
-                        <th class="k-scheduler-timecolumn">{{ timeMessage }}</th>
-                        <th>{{ eventMessage }}</th>
+            <table class="k-scheduler-table" role="rowgroup">
+                <tbody role="none">
+                    <tr role="row">
+                        <th *ngFor="let resource of resources" class="k-scheduler-groupcolumn" role="columnheader"></th>
+                        <th class="k-scheduler-datecolumn" role="columnheader">{{ dateMessage }}</th>
+                        <th class="k-scheduler-timecolumn" role="columnheader">{{ timeMessage }}</th>
+                        <th role="columnheader">{{ eventMessage }}</th>
                     </tr>
                 </tbody>
             </table>

package/esm2015/views/agenda/agenda-view-internal.component.js

@@ -52,7 +52,10 @@ export class AgendaViewInternalComponent {
         this.subs.add(this.viewContext.action.subscribe(this.onAction.bind(this)));
         this.subs.add(this.viewContext.execute.subscribe(this.execute.bind(this)));
         this.subs.add(this.viewContext.resize.subscribe(this.updateContentHeight));
-        this.subs.add(combineLatest(this.viewContext.items, this.viewState.dateRange).pipe(map(([items, dateRange]) => {
+        this.subs.add(combineLatest([
+            this.viewContext.items,
+            this.viewState.dateRange
+        ]).pipe(map(([items, dateRange]) => {
             this.items = items;
             this.range = dateRange;
             return this.createEventGroups();
@@ -295,8 +298,8 @@ export class AgendaViewInternalComponent {
 }
 AgendaViewInternalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: AgendaViewInternalComponent, deps: [{ token: i1.ViewContextService }, { token: i2.ViewStateService }, { token: i3.IntlService }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.NgZone }, { token: i4.PDFService }, { token: i5.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
 AgendaViewInternalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: AgendaViewInternalComponent, selector: "agenda-view-internal", inputs: { eventTemplate: "eventTemplate", slotClass: "slotClass", eventClass: "eventClass", eventStyles: "eventStyles", agendaTimeTemplate: "agendaTimeTemplate", agendaDateTemplate: "agendaDateTemplate", selectedDateFormat: "selectedDateFormat", selectedShortDateFormat: "selectedShortDateFormat", numberOfDays: "numberOfDays" }, viewQueries: [{ propertyName: "headerWrap", first: true, predicate: ["headerWrap"], descendants: true, read: ElementRef, static: true }, { propertyName: "content", first: true, predicate: ["content"], descendants: true, read: ElementRef, static: true }], usesOnChanges: true, ngImport: i0, template: `
-        <table class="k-scheduler-layout k-scheduler-agendaview k-scheduler-agenda">
-            <tbody>
+        <table class="k-scheduler-layout k-scheduler-agendaview k-scheduler-agenda" role="grid">
+            <tbody role="none">
                 <tr>
                     <td>
                         <div kendoSchedulerAgendaHeader [resources]="groupedResources" #headerWrap></div>
@@ -325,8 +328,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     // eslint-disable-next-line @angular-eslint/component-selector
                     selector: 'agenda-view-internal',
                     template: `
-        <table class="k-scheduler-layout k-scheduler-agendaview k-scheduler-agenda">
-            <tbody>
+        <table class="k-scheduler-layout k-scheduler-agendaview k-scheduler-agenda" role="grid">
+            <tbody role="none">
                 <tr>
                     <td>
                         <div kendoSchedulerAgendaHeader [resources]="groupedResources" #headerWrap></div>

package/esm2015/views/agenda/agenda-view-list.component.js

@@ -71,12 +71,12 @@ export class AgendaListComponent {
 }
 AgendaListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: AgendaListComponent, deps: [{ token: i1.IntlService }, { token: i2.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
 AgendaListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: AgendaListComponent, selector: "[kendoSchedulerAgendaList]", inputs: { tasks: "tasks", eventTemplate: "eventTemplate", slotClass: "slotClass", eventClass: "eventClass", eventStyles: "eventStyles", agendaTimeTemplate: "agendaTimeTemplate", agendaDateTemplate: "agendaDateTemplate", editable: "editable" }, host: { properties: { "class.k-scheduler-content": "this.classes" } }, ngImport: i0, template: `
-        <table class="k-scheduler-table" role="presentation">
-            <tbody>
+        <table class="k-scheduler-table" role="none">
+            <tbody role="rowgroup">
                 <ng-container *ngFor="let group of tasks; let groupIndex = index;">
-                    <tr *ngFor="let item of group.tasks;let index = index; trackBy: trackByFn">
-                        <ng-container *ngFor="let resource of group.resources;let resourceIndex = index">
-                            <td *ngIf="group.spans[resourceIndex] && index === 0" class="k-scheduler-groupcolumn" [attr.rowspan]="group.spans[resourceIndex]">
+                    <tr *ngFor="let item of group.tasks; let index = index; trackBy: trackByFn" role="row">
+                        <ng-container *ngFor="let resource of group.resources; let resourceIndex = index">
+                            <td *ngIf="group.spans[resourceIndex] && index === 0" class="k-scheduler-groupcolumn" [attr.rowspan]="group.spans[resourceIndex]" role="rowheader">
                                 {{ resource }}
                             </td>
                         </ng-container>
@@ -84,19 +84,20 @@ AgendaListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ve
                             [kendoSchedulerAgendaHeaderItem]="item"
                             [agendaDateTemplate]="agendaDateTemplate">
                         </td>
-                        <td class="k-scheduler-timecolumn">
+                        <td class="k-scheduler-timecolumn" role="gridcell">
                             <div *ngIf="!agendaTimeTemplate">
                                 <span class="k-icon k-i-arrow-60-left" *ngIf="extractDataItem(item).tail"></span>
-                                {{formatTime(extractDataItem(item)) }}
+                                {{ formatTime(extractDataItem(item)) }}
                                 <span class="k-icon k-i-arrow-60-right" *ngIf="extractDataItem(item).head"></span>
                             </div>
                             <ng-container *ngIf="agendaTimeTemplate" [ngTemplateOutlet]="agendaTimeTemplate"
                                 [ngTemplateOutletContext]="extractDataItem(item)">
                             </ng-container>
                         </td>
-                        <td [attr.data-group-index]="groupIndex" [attr.data-task-index]="index"
+                        <td [attr.data-group-index]="groupIndex" [attr.data-task-index]="index" role="gridcell"
                             [ngClass]="cellClasses(item)" [ngStyle]="getEventStyles(item)"
                             [kendoSchedulerFocusIndex]="groupIndex"
+                            [id]="item.elementId"
                             [kendoSchedulerAgendaTaskItem]="extractDataItem(item)"
                                 [editable]="editable"
                                 [eventTemplate]="eventTemplate"
@@ -112,12 +113,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     // eslint-disable-next-line @angular-eslint/component-selector
                     selector: '[kendoSchedulerAgendaList]',
                     template: `
-        <table class="k-scheduler-table" role="presentation">
-            <tbody>
+        <table class="k-scheduler-table" role="none">
+            <tbody role="rowgroup">
                 <ng-container *ngFor="let group of tasks; let groupIndex = index;">
-                    <tr *ngFor="let item of group.tasks;let index = index; trackBy: trackByFn">
-                        <ng-container *ngFor="let resource of group.resources;let resourceIndex = index">
-                            <td *ngIf="group.spans[resourceIndex] && index === 0" class="k-scheduler-groupcolumn" [attr.rowspan]="group.spans[resourceIndex]">
+                    <tr *ngFor="let item of group.tasks; let index = index; trackBy: trackByFn" role="row">
+                        <ng-container *ngFor="let resource of group.resources; let resourceIndex = index">
+                            <td *ngIf="group.spans[resourceIndex] && index === 0" class="k-scheduler-groupcolumn" [attr.rowspan]="group.spans[resourceIndex]" role="rowheader">
                                 {{ resource }}
                             </td>
                         </ng-container>
@@ -125,19 +126,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                             [kendoSchedulerAgendaHeaderItem]="item"
                             [agendaDateTemplate]="agendaDateTemplate">
                         </td>
-                        <td class="k-scheduler-timecolumn">
+                        <td class="k-scheduler-timecolumn" role="gridcell">
                             <div *ngIf="!agendaTimeTemplate">
                                 <span class="k-icon k-i-arrow-60-left" *ngIf="extractDataItem(item).tail"></span>
-                                {{formatTime(extractDataItem(item)) }}
+                                {{ formatTime(extractDataItem(item)) }}
                                 <span class="k-icon k-i-arrow-60-right" *ngIf="extractDataItem(item).head"></span>
                             </div>
                             <ng-container *ngIf="agendaTimeTemplate" [ngTemplateOutlet]="agendaTimeTemplate"
                                 [ngTemplateOutletContext]="extractDataItem(item)">
                             </ng-container>
                         </td>
-                        <td [attr.data-group-index]="groupIndex" [attr.data-task-index]="index"
+                        <td [attr.data-group-index]="groupIndex" [attr.data-task-index]="index" role="gridcell"
                             [ngClass]="cellClasses(item)" [ngStyle]="getEventStyles(item)"
                             [kendoSchedulerFocusIndex]="groupIndex"
+                            [id]="item.elementId"
                             [kendoSchedulerAgendaTaskItem]="extractDataItem(item)"
                                 [editable]="editable"
                                 [eventTemplate]="eventTemplate"

package/esm2015/views/agenda/tasks.collection.js

@@ -15,22 +15,26 @@ export const compose = (...args) => (data) => args.reduceRight((acc, curr) => cu
  * @hidden
  */
 export const processEvents = (_start, _end) => compose(group([{ field: "startDate" }]), sort([{ field: "start", dir: "asc" }, { field: "end", dir: "asc" }]));
-function* flattenGroups(groups) {
-    for (let index = 0; index < groups.length; index++) {
-        const groupItem = groups[index];
-        yield {
-            type: "group",
-            dataItem: groupItem,
-            rowSpan: groupItem.items.length
-        };
-        for (let itemIndex = 1; itemIndex < groupItem.items.length; itemIndex++) {
-            const item = groupItem.items[itemIndex];
+function flattenGroupsAndAddIds(scope) {
+    return function* flattenGroups(groups) {
+        for (let index = 0; index < groups.length; index++) {
+            const groupItem = groups[index];
             yield {
-                type: "event",
-                dataItem: item
+                type: "group",
+                dataItem: groupItem,
+                rowSpan: groupItem.items.length,
+                elementId: `k-scheduler-${scope.counter}-${index}`
             };
+            for (let itemIndex = 1; itemIndex < groupItem.items.length; itemIndex++) {
+                const item = groupItem.items[itemIndex];
+                yield {
+                    type: "event",
+                    dataItem: item,
+                    elementId: `k-scheduler-${scope.counter}-${index}-item-${itemIndex}`
+                };
+            }
         }
-    }
+    };
 }
 /** @hidden */
 export class EmptyIterator {
@@ -43,6 +47,7 @@ export class EmptyIterator {
         return "Empty Iterator";
     }
 }
+let seed = 0;
 /**
  * @hidden
  */
@@ -51,7 +56,9 @@ export class TaskCollection {
         this.start = start;
         this.end = end;
         this.events = events;
-        this.createIterator = compose(flattenGroups, processEvents(this.start, this.end));
+        this.createIterator = compose(flattenGroupsAndAddIds(this), processEvents(this.start, this.end));
+        this.counter = seed;
+        seed++;
     }
     static empty() {
         return (new EmptyIterator());

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

@@ -3,7 +3,7 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { ViewChild, Input, Directive } from '@angular/core';
-import { anyChanged } from '@progress/kendo-angular-common';
+import { anyChanged, guid } from '@progress/kendo-angular-common';
 import { ZonedDate } from '@progress/kendo-date-math';
 import { Subscription, BehaviorSubject, combineLatest, fromEvent, merge } from 'rxjs';
 import { switchMap, take, map, filter, tap } from 'rxjs/operators';
@@ -11,7 +11,7 @@ import { closestInScope, hasClasses, preventLockedScroll, scrollbarWidth, wheelD
 import { groupResources, getField, setField, fromClick, fromDoubleClick } from '../../common/util';
 import { assignTasksResources, toPx, elementOffset, pointDistance, ignoreContentChild, resourceItemByValue, convertNgClassBindings, toUTCDateTime, dateWithTime, normaliseRangeStartAndEnd } from '../utils';
 import { BORDER_WIDTH } from '../constants';
-import Draggable from '@telerik/kendo-draggable';
+import Draggable from '@progress/kendo-draggable';
 import { slotDragEventName } from '../../types/slot-selection';
 import { SlotDragStartEvent } from '../../events/slot-drag-start-event';
 import * as i0 from "@angular/core";
@@ -92,7 +92,7 @@ export class BaseView {
         this.subs.add(combineLatest(this.viewContext.items, this.viewState.dateRange, this.viewRangeChange)
             .pipe(map(([items, dateRange]) => this.createTasks(items, dateRange)))
             .subscribe((tasks) => {
-            this.tasks = tasks;
+            this.tasks = tasks.map(t => (Object.assign(Object.assign({}, t), { elementId: guid() })));
             this.assignResources();
             this.onTasksChange();
         }));