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

package/fesm2015/kendo-angular-scheduler.js

@@ -4,7 +4,7 @@
 *-------------------------------------------------------------------------------------------*/
 import * as i0 from '@angular/core';
 import { Directive, Optional, Injectable, EventEmitter, Input, Inject, isDevMode, Component, HostBinding, ChangeDetectionStrategy, ViewChild, Output, forwardRef, ViewChildren, NgZone, ViewContainerRef, ViewEncapsulation, ContentChild, ContentChildren, NgModule, LOCALE_ID, ElementRef, TemplateRef, Pipe, HostListener } from '@angular/core';
-import * as i1$1 from '@progress/kendo-angular-l10n';
+import * as i2 from '@progress/kendo-angular-l10n';
 import { LocalizationService, L10N_PREFIX, RTL, ComponentMessages } from '@progress/kendo-angular-l10n';
 import * as i12$1 from '@progress/kendo-angular-common';
 import { hasObservers, isDocumentAvailable, isChanged, Keys, anyChanged, ResizeSensorComponent, EventsModule, guid, ResizeSensorModule } from '@progress/kendo-angular-common';
@@ -14,25 +14,25 @@ import * as i4 from '@progress/kendo-angular-dateinputs';
 import { PreventableEvent as PreventableEvent$1, CalendarModule, DateInputsModule } from '@progress/kendo-angular-dateinputs';
 import { Subject, BehaviorSubject, fromEvent, Subscription, combineLatest, merge } from 'rxjs';
 import { auditTime, buffer, filter, map, debounceTime, take, switchMap, tap, distinctUntilChanged } from 'rxjs/operators';
-import * as i11 from '@angular/forms';
+import * as i11$1 from '@angular/forms';
 import { NG_VALUE_ACCESSOR, FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms';
 import * as i1 from '@progress/kendo-angular-dialog';
 import { DialogCloseResult, DialogModule } from '@progress/kendo-angular-dialog';
-import * as i1$4 from '@progress/kendo-angular-intl';
+import * as i1$3 from '@progress/kendo-angular-intl';
 import { formatDate, IntlModule, IntlService, CldrIntlService, parseDate } from '@progress/kendo-angular-intl';
-import * as i1$2 from '@progress/kendo-angular-popup';
+import * as i1$1 from '@progress/kendo-angular-popup';
 import { PopupService, PopupModule } from '@progress/kendo-angular-popup';
 import * as i3 from '@progress/kendo-angular-buttons';
 import { Button, ButtonsModule } from '@progress/kendo-angular-buttons';
-import * as i10 from '@angular/common';
+import * as i11 from '@angular/common';
 import { CommonModule } from '@angular/common';
-import * as i1$3 from '@progress/kendo-angular-dropdowns';
+import * as i1$2 from '@progress/kendo-angular-dropdowns';
 import { DropDownsModule } from '@progress/kendo-angular-dropdowns';
 import { parseRule, serializeRule, expand } from '@progress/kendo-recurrence';
 import * as i12 from '@progress/kendo-angular-inputs';
 import { CheckBoxModule, TextAreaModule, NumericTextBoxModule, TextBoxModule } from '@progress/kendo-angular-inputs';
 import { orderBy, groupBy } from '@progress/kendo-data-query';
-import Draggable from '@telerik/kendo-draggable';
+import Draggable from '@progress/kendo-draggable';
 import { drawDOM, exportPDF } from '@progress/kendo-drawing';
 import { saveAs } from '@progress/kendo-file-saver';
 
@@ -43,7 +43,7 @@ const packageMetadata = {
     name: '@progress/kendo-angular-scheduler',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1652259001,
+    publishDate: 1655881345,
     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'
 };
@@ -1438,6 +1438,7 @@ 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();
@@ -1485,8 +1486,18 @@ 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) {
@@ -1539,6 +1550,7 @@ 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: DomEventsService }], target: i0.ɵɵFactoryTarget.Injectable });
@@ -1620,11 +1632,11 @@ class DialogsService {
         return this.localization.get(key);
     }
 }
-DialogsService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DialogsService, deps: [{ token: i1.DialogService }, { token: i1$1.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: FocusService }, { token: ViewStateService }], target: i0.ɵɵFactoryTarget.Injectable });
+DialogsService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DialogsService, deps: [{ token: i1.DialogService }, { token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: FocusService }, { token: ViewStateService }], target: i0.ɵɵFactoryTarget.Injectable });
 DialogsService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DialogsService });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DialogsService, decorators: [{
             type: Injectable
-        }], ctorParameters: function () { return [{ type: i1.DialogService }, { type: i1$1.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: FocusService }, { type: ViewStateService }]; } });
+        }], ctorParameters: function () { return [{ type: i1.DialogService }, { type: i2.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: FocusService }, { type: ViewStateService }]; } });
 
 /**
  * @hidden
@@ -1634,14 +1646,14 @@ class SchedulerLocalizationService extends LocalizationService {
         super(prefix, messageService, _rtl);
     }
 }
-SchedulerLocalizationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SchedulerLocalizationService, deps: [{ token: L10N_PREFIX }, { token: i1$1.MessageService, optional: true }, { token: RTL, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
+SchedulerLocalizationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SchedulerLocalizationService, deps: [{ token: L10N_PREFIX }, { token: i2.MessageService, optional: true }, { token: RTL, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
 SchedulerLocalizationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SchedulerLocalizationService });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SchedulerLocalizationService, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [L10N_PREFIX]
-                }] }, { type: i1$1.MessageService, decorators: [{
+                }] }, { type: i2.MessageService, decorators: [{
                     type: Optional
                 }] }, { type: undefined, decorators: [{
                     type: Optional
@@ -2395,7 +2407,7 @@ class ToolbarNavigationComponent {
         }
     }
 }
-ToolbarNavigationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ToolbarNavigationComponent, deps: [{ token: i1$2.PopupService }, { token: ToolbarService }, { token: i1$1.LocalizationService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+ToolbarNavigationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ToolbarNavigationComponent, deps: [{ token: i1$1.PopupService }, { token: ToolbarService }, { token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
 ToolbarNavigationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ToolbarNavigationComponent, selector: "[kendoSchedulerToolbarNavigation]", inputs: { min: "min", max: "max" }, host: { properties: { "style.display": "this.inlineDisplayStyle", "style.flex-flow": "this.inlineFlexFlowStyle", "style.gap": "this.inlineGapStyle" } }, providers: [
         PopupService
     ], viewQueries: [{ propertyName: "calendar", first: true, predicate: ["calendar"], descendants: true }], ngImport: i0, template: `
@@ -2432,6 +2444,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>
@@ -2444,7 +2457,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: 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"] }], pipes: { "async": i10.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: 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"] }], pipes: { "async": i11.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ToolbarNavigationComponent, decorators: [{
             type: Component,
             args: [{
@@ -2488,6 +2501,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>
@@ -2502,7 +2516,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         </ng-template>
     `
                 }]
-        }], ctorParameters: function () { return [{ type: i1$2.PopupService }, { type: ToolbarService }, { type: i1$1.LocalizationService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { calendar: [{
+        }], ctorParameters: function () { return [{ type: i1$1.PopupService }, { type: ToolbarService }, { type: i2.LocalizationService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { calendar: [{
                 type: ViewChild,
                 args: ['calendar', { static: false }]
             }], inlineDisplayStyle: [{
@@ -2536,8 +2550,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
  * {% endmeta %}
  */
 class ToolbarViewSelectorComponent {
-    constructor(service) {
+    constructor(service, localization) {
         this.service = service;
+        this.localization = localization;
         /**
          * @hidden
          */
@@ -2549,6 +2564,12 @@ class ToolbarViewSelectorComponent {
     get ctx() {
         return this.service.context;
     }
+    /**
+     * @hidden
+     */
+    get selectView() {
+        return this.localization.get('selectView');
+    }
     ngOnDestroy() {
         if (this.detachDomEvents) {
             this.detachDomEvents();
@@ -2581,11 +2602,14 @@ 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: ToolbarService }], target: i0.ɵɵFactoryTarget.Component });
+ToolbarViewSelectorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ToolbarViewSelectorComponent, deps: [{ token: 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"
@@ -2606,16 +2630,19 @@ ToolbarViewSelectorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12
                 </span>
             </button>
         </span>
-    `, isInline: true, directives: [{ type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i10.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: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i11.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: [{
                     // 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"
@@ -2638,7 +2665,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         </span>
     `
                 }]
-        }], ctorParameters: function () { return [{ type: ToolbarService }]; }, propDecorators: { hostClasses: [{
+        }], ctorParameters: function () { return [{ type: ToolbarService }, { type: i2.LocalizationService }]; }, propDecorators: { hostClasses: [{
                 type: HostBinding,
                 args: ['class.k-scheduler-views-wrapper']
             }] } });
@@ -2693,7 +2720,7 @@ ToolbarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", versi
             <span class="k-spacer"></span>
             <div kendoSchedulerToolbarViewSelector></div>
         </ng-template>
-    `, isInline: true, components: [{ type: ToolbarNavigationComponent, selector: "[kendoSchedulerToolbarNavigation]", inputs: ["min", "max"] }, { type: ToolbarViewSelectorComponent, selector: "[kendoSchedulerToolbarViewSelector]" }], directives: [{ type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i10.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }] });
+    `, isInline: true, components: [{ type: ToolbarNavigationComponent, selector: "[kendoSchedulerToolbarNavigation]", inputs: ["min", "max"] }, { type: ToolbarViewSelectorComponent, selector: "[kendoSchedulerToolbarViewSelector]" }], directives: [{ type: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i11.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ToolbarComponent, decorators: [{
             type: Component,
             args: [{
@@ -2835,7 +2862,7 @@ MultipleResourceEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion:
                 {{ getField(dataItem, resource.textField) }}
             </ng-template>
         </kendo-multiselect>
-    `, isInline: true, components: [{ type: i1$3.MultiSelectComponent, selector: "kendo-multiselect", inputs: ["focusableId", "autoClose", "loading", "data", "value", "valueField", "textField", "tabindex", "tabIndex", "size", "rounded", "fillMode", "placeholder", "disabled", "itemDisabled", "checkboxes", "readonly", "filterable", "virtual", "popupSettings", "listHeight", "valuePrimitive", "clearButton", "tagMapper", "allowCustom", "valueNormalizer"], outputs: ["filterChange", "valueChange", "open", "opened", "close", "closed", "focus", "blur", "removeTag"], exportAs: ["kendoMultiSelect"] }], directives: [{ type: i1$3.ItemTemplateDirective, selector: "[kendoDropDownListItemTemplate],[kendoComboBoxItemTemplate],[kendoAutoCompleteItemTemplate],[kendoMultiSelectItemTemplate]" }, { type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i10.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i1$3.TagTemplateDirective, selector: "[kendoMultiSelectTagTemplate],[kendoMultiSelectTreeTagTemplate]" }] });
+    `, isInline: true, components: [{ type: i1$2.MultiSelectComponent, selector: "kendo-multiselect", inputs: ["focusableId", "autoClose", "loading", "data", "value", "valueField", "textField", "tabindex", "tabIndex", "size", "rounded", "fillMode", "placeholder", "disabled", "itemDisabled", "checkboxes", "readonly", "filterable", "virtual", "popupSettings", "listHeight", "valuePrimitive", "clearButton", "tagMapper", "allowCustom", "valueNormalizer"], outputs: ["filterChange", "valueChange", "open", "opened", "close", "closed", "focus", "blur", "removeTag"], exportAs: ["kendoMultiSelect"] }], directives: [{ type: i1$2.ItemTemplateDirective, selector: "[kendoDropDownListItemTemplate],[kendoComboBoxItemTemplate],[kendoAutoCompleteItemTemplate],[kendoMultiSelectItemTemplate]" }, { type: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i11.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i1$2.TagTemplateDirective, selector: "[kendoMultiSelectTagTemplate],[kendoMultiSelectTreeTagTemplate]" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: MultipleResourceEditorComponent, decorators: [{
             type: Component,
             args: [{
@@ -2906,7 +2933,7 @@ SingleResourceEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "1
                 {{ getField(dataItem, resource.textField) }}
             </ng-template>
         </kendo-dropdownlist>
-    `, isInline: true, components: [{ type: i1$3.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["iconClass", "loading", "data", "value", "textField", "valueField", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }], directives: [{ type: i1$3.ItemTemplateDirective, selector: "[kendoDropDownListItemTemplate],[kendoComboBoxItemTemplate],[kendoAutoCompleteItemTemplate],[kendoMultiSelectItemTemplate]" }, { type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i10.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
+    `, isInline: true, components: [{ type: i1$2.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["iconClass", "loading", "data", "value", "textField", "valueField", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }], directives: [{ type: i1$2.ItemTemplateDirective, selector: "[kendoDropDownListItemTemplate],[kendoComboBoxItemTemplate],[kendoAutoCompleteItemTemplate],[kendoMultiSelectItemTemplate]" }, { type: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i11.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SingleResourceEditorComponent, decorators: [{
             type: Component,
             args: [{
@@ -3023,7 +3050,7 @@ SchedulerDateTimePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion:
         [(value)]='date'
         (valueChange)='onValueChange($event)'
     ></kendo-timepicker>
-    `, isInline: true, styles: ["\n        kendo-datepicker,\n        kendo-timepicker {\n            width: 170px;\n        }\n    "], components: [{ type: i4.DatePickerComponent, selector: "kendo-datepicker", inputs: ["cellTemplate", "monthCellTemplate", "yearCellTemplate", "decadeCellTemplate", "centuryCellTemplate", "weekNumberTemplate", "headerTitleTemplate", "navigationItemTemplate", "focusableId", "activeView", "bottomView", "topView", "calendarType", "animateCalendarNavigation", "disabled", "readonly", "readOnlyInput", "popupSettings", "navigation", "min", "max", "incompleteDateValidation", "focusedDate", "value", "format", "twoDigitYearMax", "formatPlaceholder", "placeholder", "tabindex", "tabIndex", "disabledDates", "title", "rangeValidation", "disabledDatesValidation", "weekNumber", "size", "rounded", "fillMode"], outputs: ["valueChange", "focus", "blur", "open", "close"], exportAs: ["kendo-datepicker"] }, { type: i4.TimePickerComponent, selector: "kendo-timepicker", inputs: ["focusableId", "disabled", "readonly", "readOnlyInput", "format", "formatPlaceholder", "placeholder", "min", "max", "incompleteDateValidation", "cancelButton", "nowButton", "steps", "popupSettings", "tabindex", "tabIndex", "title", "rangeValidation", "value", "size", "rounded", "fillMode"], outputs: ["valueChange", "focus", "blur", "open", "close"], exportAs: ["kendo-timepicker"] }], directives: [{ type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    `, isInline: true, styles: ["\n        kendo-datepicker,\n        kendo-timepicker {\n            width: 170px;\n        }\n    "], components: [{ type: i4.DatePickerComponent, selector: "kendo-datepicker", inputs: ["cellTemplate", "monthCellTemplate", "yearCellTemplate", "decadeCellTemplate", "centuryCellTemplate", "weekNumberTemplate", "headerTitleTemplate", "navigationItemTemplate", "focusableId", "activeView", "bottomView", "topView", "calendarType", "animateCalendarNavigation", "disabled", "readonly", "readOnlyInput", "popupSettings", "navigation", "min", "max", "incompleteDateValidation", "focusedDate", "value", "format", "twoDigitYearMax", "formatPlaceholder", "placeholder", "tabindex", "tabIndex", "disabledDates", "title", "rangeValidation", "disabledDatesValidation", "weekNumber", "size", "rounded", "fillMode"], outputs: ["valueChange", "focus", "blur", "open", "close"], exportAs: ["kendo-datepicker"] }, { type: i4.TimePickerComponent, selector: "kendo-timepicker", inputs: ["focusableId", "disabled", "readonly", "readOnlyInput", "format", "formatPlaceholder", "placeholder", "min", "max", "incompleteDateValidation", "cancelButton", "nowButton", "steps", "popupSettings", "tabindex", "tabIndex", "title", "rangeValidation", "value", "size", "rounded", "fillMode"], outputs: ["valueChange", "focus", "blur", "open", "close"], exportAs: ["kendo-timepicker"] }], directives: [{ type: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SchedulerDateTimePickerComponent, decorators: [{
             type: Component,
             args: [{
@@ -3142,7 +3169,7 @@ TimeZoneEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0"
             (filterChange)="onTimeZoneFilterChange($event)"
             (valueChange)="onTimeZoneChange($event)">
         </kendo-combobox>
-    `, isInline: true, components: [{ type: i1$3.ComboBoxComponent, selector: "kendo-combobox", inputs: ["focusableId", "allowCustom", "data", "value", "textField", "valueField", "valuePrimitive", "valueNormalizer", "placeholder", "popupSettings", "listHeight", "iconClass", "loading", "suggest", "clearButton", "disabled", "itemDisabled", "readonly", "tabindex", "tabIndex", "filterable", "virtual", "size", "rounded", "fillMode"], outputs: ["valueChange", "selectionChange", "filterChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoComboBox"] }] });
+    `, isInline: true, components: [{ type: i1$2.ComboBoxComponent, selector: "kendo-combobox", inputs: ["focusableId", "allowCustom", "data", "value", "textField", "valueField", "valuePrimitive", "valueNormalizer", "placeholder", "popupSettings", "listHeight", "iconClass", "loading", "suggest", "clearButton", "disabled", "itemDisabled", "readonly", "tabindex", "tabIndex", "filterable", "virtual", "size", "rounded", "fillMode"], outputs: ["valueChange", "selectionChange", "filterChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoComboBox"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TimeZoneEditorComponent, decorators: [{
             type: Component,
             args: [{
@@ -3402,11 +3429,11 @@ class RecurrenceService {
         }
     }
 }
-RecurrenceService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: RecurrenceService, deps: [{ token: i1$4.IntlService }, { token: i1$1.LocalizationService }], target: i0.ɵɵFactoryTarget.Injectable });
+RecurrenceService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: RecurrenceService, deps: [{ token: i1$3.IntlService }, { token: i2.LocalizationService }], target: i0.ɵɵFactoryTarget.Injectable });
 RecurrenceService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: RecurrenceService });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: RecurrenceService, decorators: [{
             type: Injectable
-        }], ctorParameters: function () { return [{ type: i1$4.IntlService }, { type: i1$1.LocalizationService }]; } });
+        }], ctorParameters: function () { return [{ type: i1$3.IntlService }, { type: i2.LocalizationService }]; } });
 
 /**
  * @hidden
@@ -3423,14 +3450,14 @@ class RecurrenceLocalizationService extends LocalizationService {
         return super.get(shortKey);
     }
 }
-RecurrenceLocalizationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: RecurrenceLocalizationService, deps: [{ token: L10N_PREFIX }, { token: i1$1.MessageService, optional: true }, { token: RTL, optional: true }, { token: SchedulerLocalizationService, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
+RecurrenceLocalizationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: RecurrenceLocalizationService, deps: [{ token: L10N_PREFIX }, { token: i2.MessageService, optional: true }, { token: RTL, optional: true }, { token: SchedulerLocalizationService, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
 RecurrenceLocalizationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: RecurrenceLocalizationService });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: RecurrenceLocalizationService, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [L10N_PREFIX]
-                }] }, { type: i1$1.MessageService, decorators: [{
+                }] }, { type: i2.MessageService, decorators: [{
                     type: Optional
                 }] }, { type: undefined, decorators: [{
                     type: Optional
@@ -3473,7 +3500,7 @@ class RecurrenceFrequencyEditorComponent {
         }
     }
 }
-RecurrenceFrequencyEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: RecurrenceFrequencyEditorComponent, deps: [{ token: RecurrenceService }, { token: i1$1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
+RecurrenceFrequencyEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: RecurrenceFrequencyEditorComponent, deps: [{ token: RecurrenceService }, { token: i2.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
 RecurrenceFrequencyEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: RecurrenceFrequencyEditorComponent, selector: "kendo-recurrence-frequency-editor", viewQueries: [{ propertyName: "weekDayButtons", predicate: Button, descendants: true }], ngImport: i0, template: `
         <div class='k-form-field'>
             <label class="k-form-label" (click)="onFrequencyClick()">{{ textFor('repeat') }}</label>
@@ -3489,7 +3516,7 @@ RecurrenceFrequencyEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersio
                 </kendo-buttongroup>
             </div>
         </div>
-    `, isInline: true, components: [{ type: i3.ButtonGroupComponent, selector: "kendo-buttongroup", inputs: ["disabled", "selection", "width", "tabIndex"], outputs: ["navigate"], exportAs: ["kendoButtonGroup"] }], directives: [{ type: i10.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, components: [{ type: i3.ButtonGroupComponent, selector: "kendo-buttongroup", inputs: ["disabled", "selection", "width", "tabIndex"], outputs: ["navigate"], exportAs: ["kendoButtonGroup"] }], directives: [{ type: i11.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: [{
@@ -3511,7 +3538,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         </div>
     `
                 }]
-        }], ctorParameters: function () { return [{ type: RecurrenceService }, { type: i1$1.LocalizationService }]; }, propDecorators: { weekDayButtons: [{
+        }], ctorParameters: function () { return [{ type: RecurrenceService }, { type: i2.LocalizationService }]; }, propDecorators: { weekDayButtons: [{
                 type: ViewChildren,
                 args: [Button]
             }] } });
@@ -3582,7 +3609,7 @@ class RecurrenceIntervalEditorComponent {
         return this.localization.get(key);
     }
 }
-RecurrenceIntervalEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: RecurrenceIntervalEditorComponent, deps: [{ token: RecurrenceService }, { token: i1$1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
+RecurrenceIntervalEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: RecurrenceIntervalEditorComponent, deps: [{ token: RecurrenceService }, { token: i2.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
 RecurrenceIntervalEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: RecurrenceIntervalEditorComponent, selector: "kendo-recurrence-interval-editor", inputs: { userNumericOptions: "userNumericOptions" }, ngImport: i0, template: `
         <div class='k-form-field'>
             <label class="k-form-label" (click)="intervalNumeric.focus()">{{ textForRepeatEvery() }}</label>
@@ -3642,7 +3669,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         </div>
     `
                 }]
-        }], ctorParameters: function () { return [{ type: RecurrenceService }, { type: i1$1.LocalizationService }]; }, propDecorators: { userNumericOptions: [{
+        }], ctorParameters: function () { return [{ type: RecurrenceService }, { type: i2.LocalizationService }]; }, propDecorators: { userNumericOptions: [{
                 type: Input
             }] } });
 
@@ -3699,7 +3726,7 @@ class RecurrenceWeekdayRuleEditorComponent {
         }
     }
 }
-RecurrenceWeekdayRuleEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: RecurrenceWeekdayRuleEditorComponent, deps: [{ token: RecurrenceService }, { token: i1$1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
+RecurrenceWeekdayRuleEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: RecurrenceWeekdayRuleEditorComponent, deps: [{ token: RecurrenceService }, { token: i2.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
 RecurrenceWeekdayRuleEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: RecurrenceWeekdayRuleEditorComponent, selector: "kendo-recurrence-weekday-rule-editor", viewQueries: [{ propertyName: "weekDayButtons", predicate: Button, descendants: true }], ngImport: i0, template: `
         <div class='k-form-field'>
             <label class='k-form-label' (click)="onWeeklyRepeatOnClick()">{{ textFor('weeklyRepeatOn') }}</label>
@@ -3715,7 +3742,7 @@ RecurrenceWeekdayRuleEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVers
                 </kendo-buttongroup>
             </div>
         </div>
-    `, isInline: true, components: [{ type: i3.ButtonGroupComponent, selector: "kendo-buttongroup", inputs: ["disabled", "selection", "width", "tabIndex"], outputs: ["navigate"], exportAs: ["kendoButtonGroup"] }], directives: [{ type: i10.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, components: [{ type: i3.ButtonGroupComponent, selector: "kendo-buttongroup", inputs: ["disabled", "selection", "width", "tabIndex"], outputs: ["navigate"], exportAs: ["kendoButtonGroup"] }], directives: [{ type: i11.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: [{
@@ -3737,7 +3764,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         </div>
     `
                 }]
-        }], ctorParameters: function () { return [{ type: RecurrenceService }, { type: i1$1.LocalizationService }]; }, propDecorators: { weekDayButtons: [{
+        }], ctorParameters: function () { return [{ type: RecurrenceService }, { type: i2.LocalizationService }]; }, propDecorators: { weekDayButtons: [{
                 type: ViewChildren,
                 args: [Button]
             }] } });
@@ -4027,7 +4054,7 @@ class RecurrenceMonthlyYearlyEditorComponent {
         }
     }
 }
-RecurrenceMonthlyYearlyEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: RecurrenceMonthlyYearlyEditorComponent, deps: [{ token: RecurrenceService }, { token: i1$1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
+RecurrenceMonthlyYearlyEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: RecurrenceMonthlyYearlyEditorComponent, deps: [{ token: RecurrenceService }, { token: i2.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
 RecurrenceMonthlyYearlyEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: RecurrenceMonthlyYearlyEditorComponent, selector: "kendo-recurrence-monthly-yearly-editor", inputs: { userNumericOptions: "userNumericOptions" }, viewQueries: [{ propertyName: "repeatOnRadioButtons", predicate: RepeatOnRadioButtonDirective, descendants: true }], ngImport: i0, template: `
         <div class='k-form-field'>
             <label class='k-form-label' (click)="onRepeatOnLabelClick()">{{ textForRepeatOn() }}</label>
@@ -4120,7 +4147,7 @@ RecurrenceMonthlyYearlyEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVe
                 </li>
             </ul>
         </div>
-    `, isInline: true, components: [{ type: i1$3.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["iconClass", "loading", "data", "value", "textField", "valueField", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { type: i12.NumericTextBoxComponent, selector: "kendo-numerictextbox", inputs: ["focusableId", "disabled", "readonly", "title", "autoCorrect", "format", "max", "min", "decimals", "placeholder", "step", "spinners", "rangeValidation", "tabindex", "tabIndex", "changeValueOnScroll", "selectOnFocus", "value", "maxlength", "size", "rounded", "fillMode"], outputs: ["valueChange", "focus", "blur"], exportAs: ["kendoNumericTextBox"] }], directives: [{ type: RepeatOnRadioButtonDirective, selector: "[kendoRecurrenceRepeatOnRadioButton]", inputs: ["kendoRecurrenceRepeatOnRadioButton"] }, { type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    `, isInline: true, components: [{ type: i1$2.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["iconClass", "loading", "data", "value", "textField", "valueField", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { type: i12.NumericTextBoxComponent, selector: "kendo-numerictextbox", inputs: ["focusableId", "disabled", "readonly", "title", "autoCorrect", "format", "max", "min", "decimals", "placeholder", "step", "spinners", "rangeValidation", "tabindex", "tabIndex", "changeValueOnScroll", "selectOnFocus", "value", "maxlength", "size", "rounded", "fillMode"], outputs: ["valueChange", "focus", "blur"], exportAs: ["kendoNumericTextBox"] }], directives: [{ type: RepeatOnRadioButtonDirective, selector: "[kendoRecurrenceRepeatOnRadioButton]", inputs: ["kendoRecurrenceRepeatOnRadioButton"] }, { type: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: RecurrenceMonthlyYearlyEditorComponent, decorators: [{
             type: Component,
             args: [{
@@ -4219,7 +4246,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         </div>
     `
                 }]
-        }], ctorParameters: function () { return [{ type: RecurrenceService }, { type: i1$1.LocalizationService }]; }, propDecorators: { userNumericOptions: [{
+        }], ctorParameters: function () { return [{ type: RecurrenceService }, { type: i2.LocalizationService }]; }, propDecorators: { userNumericOptions: [{
                 type: Input
             }], repeatOnRadioButtons: [{
                 type: ViewChildren,
@@ -4393,7 +4420,7 @@ class RecurrenceEndRuleEditorComponent {
         return ZonedDate.fromUTCDate(untilDate, this.recurrence.timezone).toLocalDate();
     }
 }
-RecurrenceEndRuleEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: RecurrenceEndRuleEditorComponent, deps: [{ token: RecurrenceService }, { token: i1$1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
+RecurrenceEndRuleEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: RecurrenceEndRuleEditorComponent, deps: [{ token: RecurrenceService }, { token: i2.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
 RecurrenceEndRuleEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: RecurrenceEndRuleEditorComponent, selector: "kendo-recurrence-end-rule-editor", inputs: { userNumericOptions: "userNumericOptions", userDatePickerOptions: "userDatePickerOptions" }, viewQueries: [{ propertyName: "endRuleRadioButtons", predicate: EndRuleRadioButtonDirective, descendants: true }], ngImport: i0, template: `
         <div class='k-form-field'>
             <label class='k-form-label' (click)="onEndLabelClick()">{{ textFor('endLabel') }}</label>
@@ -4527,7 +4554,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         </div>
     `
                 }]
-        }], ctorParameters: function () { return [{ type: RecurrenceService }, { type: i1$1.LocalizationService }]; }, propDecorators: { userNumericOptions: [{
+        }], ctorParameters: function () { return [{ type: RecurrenceService }, { type: i2.LocalizationService }]; }, propDecorators: { userNumericOptions: [{
                 type: Input
             }], userDatePickerOptions: [{
                 type: Input
@@ -4620,7 +4647,7 @@ class RecurrenceEditorLocalizedMessagesDirective extends Messages$1 {
         this.service = service;
     }
 }
-RecurrenceEditorLocalizedMessagesDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: RecurrenceEditorLocalizedMessagesDirective, deps: [{ token: i1$1.LocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
+RecurrenceEditorLocalizedMessagesDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: RecurrenceEditorLocalizedMessagesDirective, deps: [{ token: i2.LocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
 RecurrenceEditorLocalizedMessagesDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: RecurrenceEditorLocalizedMessagesDirective, selector: "[kendoRecurrenceEditorLocalizedMessages]", providers: [
         {
             provide: Messages$1,
@@ -4638,7 +4665,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     ],
                     selector: '[kendoRecurrenceEditorLocalizedMessages]'
                 }]
-        }], ctorParameters: function () { return [{ type: i1$1.LocalizationService }]; } });
+        }], ctorParameters: function () { return [{ type: i2.LocalizationService }]; } });
 
 /**
  * @hidden
@@ -4728,7 +4755,7 @@ class RecurrenceEditorComponent {
         this.valueChange.emit(rrule);
     }
 }
-RecurrenceEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: RecurrenceEditorComponent, deps: [{ token: RecurrenceService }, { token: i1$4.IntlService }], target: i0.ɵɵFactoryTarget.Component });
+RecurrenceEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: RecurrenceEditorComponent, deps: [{ token: RecurrenceService }, { token: i1$3.IntlService }], target: i0.ɵɵFactoryTarget.Component });
 RecurrenceEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: RecurrenceEditorComponent, selector: "kendo-recurrence-editor", inputs: { start: "start", timezone: "timezone", weekStart: "weekStart", repeatEveryOptions: "repeatEveryOptions", endAfterOptions: "endAfterOptions", repeatOnOptions: "repeatOnOptions", endOnOptions: "endOnOptions" }, outputs: { valueChange: "valueChange" }, host: { properties: { "class.k-recurrence-editor": "this.cssClass" } }, providers: [
         RecurrenceLocalizationService,
         {
@@ -4862,7 +4889,7 @@ RecurrenceEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
             [userNumericOptions]="endAfterOptions"
             [userDatePickerOptions]="endOnOptions">
         </kendo-recurrence-end-rule-editor>
-    `, isInline: true, components: [{ type: RecurrenceFrequencyEditorComponent, selector: "kendo-recurrence-frequency-editor" }, { type: RecurrenceIntervalEditorComponent, selector: "kendo-recurrence-interval-editor", inputs: ["userNumericOptions"] }, { type: RecurrenceWeekdayRuleEditorComponent, selector: "kendo-recurrence-weekday-rule-editor" }, { type: RecurrenceMonthlyYearlyEditorComponent, selector: "kendo-recurrence-monthly-yearly-editor", inputs: ["userNumericOptions"] }, { type: RecurrenceEndRuleEditorComponent, selector: "kendo-recurrence-end-rule-editor", inputs: ["userNumericOptions", "userDatePickerOptions"] }], directives: [{ type: RecurrenceEditorLocalizedMessagesDirective, selector: "[kendoRecurrenceEditorLocalizedMessages]" }, { type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    `, isInline: true, components: [{ type: RecurrenceFrequencyEditorComponent, selector: "kendo-recurrence-frequency-editor" }, { type: RecurrenceIntervalEditorComponent, selector: "kendo-recurrence-interval-editor", inputs: ["userNumericOptions"] }, { type: RecurrenceWeekdayRuleEditorComponent, selector: "kendo-recurrence-weekday-rule-editor" }, { type: RecurrenceMonthlyYearlyEditorComponent, selector: "kendo-recurrence-monthly-yearly-editor", inputs: ["userNumericOptions"] }, { type: RecurrenceEndRuleEditorComponent, selector: "kendo-recurrence-end-rule-editor", inputs: ["userNumericOptions", "userDatePickerOptions"] }], directives: [{ type: RecurrenceEditorLocalizedMessagesDirective, selector: "[kendoRecurrenceEditorLocalizedMessages]" }, { type: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: RecurrenceEditorComponent, decorators: [{
             type: Component,
             args: [{
@@ -5004,7 +5031,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         </kendo-recurrence-end-rule-editor>
     `
                 }]
-        }], ctorParameters: function () { return [{ type: RecurrenceService }, { type: i1$4.IntlService }]; }, propDecorators: { cssClass: [{
+        }], ctorParameters: function () { return [{ type: RecurrenceService }, { type: i1$3.IntlService }]; }, propDecorators: { cssClass: [{
                 type: HostBinding,
                 args: ['class.k-recurrence-editor']
             }], start: [{
@@ -5226,7 +5253,7 @@ class EditDialogComponent {
         return toLocalDate(ZonedDate.fromLocalDate(value, timezone).toUTCDate());
     }
 }
-EditDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: EditDialogComponent, deps: [{ token: i0.NgZone }, { token: EditService }, { token: i1$1.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: FocusService }], target: i0.ɵɵFactoryTarget.Component });
+EditDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: EditDialogComponent, deps: [{ token: i0.NgZone }, { token: EditService }, { token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: FocusService }], target: i0.ɵɵFactoryTarget.Component });
 EditDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: EditDialogComponent, selector: "kendo-scheduler-edit-dialog", inputs: { resources: "resources", timezone: "timezone", weekStart: "weekStart", fields: "fields", editTemplate: "editTemplate" }, viewQueries: [{ propertyName: "multipleResourceEditors", predicate: MultipleResourceEditorComponent, descendants: true }, { propertyName: "singleResourceEditors", predicate: SingleResourceEditorComponent, descendants: true }], ngImport: i0, template: `
         <kendo-dialog (close)='onClose()' [minWidth]='750' *ngIf='isActive' title='{{ textFor("editorTitle") }}' class='k-scheduler-edit-dialog' [autoFocusedElement]="autoFocusedElement">
             <ng-container *ngIf='!editTemplate'>
@@ -5364,7 +5391,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: i1.DialogComponent, selector: "kendo-dialog", inputs: ["actions", "actionsLayout", "autoFocusedElement", "title", "width", "minWidth", "maxWidth", "height", "minHeight", "maxHeight"], outputs: ["action", "close"], exportAs: ["kendoDialog"] }, { type: SchedulerDateTimePickerComponent, selector: "kendo-scheduler-datetime-picker", inputs: ["isAllDay"], outputs: ["valueChange"] }, { type: TimeZoneEditorComponent, selector: "kendo-timezone-editor", inputs: ["width"], outputs: ["valueChange"] }, { type: RecurrenceEditorComponent, selector: "kendo-recurrence-editor", inputs: ["start", "timezone", "weekStart", "repeatEveryOptions", "endAfterOptions", "repeatOnOptions", "endOnOptions"], outputs: ["valueChange"], exportAs: ["kendoRecurrenceEditor"] }, { type: MultipleResourceEditorComponent, selector: "kendo-multiple-resource-editor" }, { type: SingleResourceEditorComponent, selector: "kendo-single-resource-editor" }, { type: i1.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: 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, components: [{ type: i1.DialogComponent, selector: "kendo-dialog", inputs: ["actions", "actionsLayout", "autoFocusedElement", "title", "width", "minWidth", "maxWidth", "height", "minHeight", "maxHeight", "animation"], outputs: ["action", "close"], exportAs: ["kendoDialog"] }, { type: SchedulerDateTimePickerComponent, selector: "kendo-scheduler-datetime-picker", inputs: ["isAllDay"], outputs: ["valueChange"] }, { type: TimeZoneEditorComponent, selector: "kendo-timezone-editor", inputs: ["width"], outputs: ["valueChange"] }, { type: RecurrenceEditorComponent, selector: "kendo-recurrence-editor", inputs: ["start", "timezone", "weekStart", "repeatEveryOptions", "endAfterOptions", "repeatOnOptions", "endOnOptions"], outputs: ["valueChange"], exportAs: ["kendoRecurrenceEditor"] }, { type: MultipleResourceEditorComponent, selector: "kendo-multiple-resource-editor" }, { type: SingleResourceEditorComponent, selector: "kendo-single-resource-editor" }, { type: i1.DialogActionsComponent, selector: "kendo-dialog-actions", inputs: ["actions", "layout"], outputs: ["action"] }], directives: [{ type: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i11$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i11$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i11$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i12.TextBoxDirective, selector: "input[kendoTextBox]", inputs: ["value"] }, { type: i11$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i11$1.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i11$1.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$1.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i12.TextAreaDirective, selector: "textarea[kendoTextArea]", inputs: ["autoSize", "value"], outputs: ["valueChange"] }, { type: i11.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i11.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { 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: EditDialogComponent, decorators: [{
             type: Component,
             args: [{
@@ -5508,7 +5535,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         </kendo-dialog>
     `
                 }]
-        }], ctorParameters: function () { return [{ type: i0.NgZone }, { type: EditService }, { type: i1$1.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: FocusService }]; }, propDecorators: { multipleResourceEditors: [{
+        }], ctorParameters: function () { return [{ type: i0.NgZone }, { type: EditService }, { type: i2.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: FocusService }]; }, propDecorators: { multipleResourceEditors: [{
                 type: ViewChildren,
                 args: [MultipleResourceEditorComponent]
             }], singleResourceEditors: [{
@@ -5532,7 +5559,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
 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: [{
@@ -5687,6 +5714,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 type: Input
             }], editRecurringDialogTitle: [{
                 type: Input
+            }], selectView: [{
+                type: Input
             }] } });
 
 /**
@@ -5698,7 +5727,7 @@ class LocalizedMessagesDirective extends Messages {
         this.service = service;
     }
 }
-LocalizedMessagesDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: LocalizedMessagesDirective, deps: [{ token: i1$1.LocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
+LocalizedMessagesDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: LocalizedMessagesDirective, deps: [{ token: i2.LocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
 LocalizedMessagesDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: LocalizedMessagesDirective, selector: "[kendoSchedulerLocalizedMessages]", providers: [
         {
             provide: Messages,
@@ -5716,7 +5745,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     ],
                     selector: '[kendoSchedulerLocalizedMessages]'
                 }]
-        }], ctorParameters: function () { return [{ type: i1$1.LocalizationService }]; } });
+        }], ctorParameters: function () { return [{ type: i2.LocalizationService }]; } });
 
 const todayDate = () => getDate(new Date());
 const DAYS_IN_WEEK$1 = 7;
@@ -5755,6 +5784,7 @@ class SchedulerComponent {
         this.renderer = renderer;
         this.focusService = focusService;
         this.hostClasses = true;
+        this.ariaRole = 'application';
         this.rtl = false;
         /**
          * Specifies if the Scheduler is editable.
@@ -6093,6 +6123,10 @@ 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));
@@ -6170,6 +6204,7 @@ 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);
@@ -6523,8 +6558,8 @@ class SchedulerComponent {
         });
     }
 }
-SchedulerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SchedulerComponent, deps: [{ token: i0.ElementRef }, { token: ViewContextService }, { token: ViewStateService }, { token: EditService }, { token: DialogsService }, { token: i1$4.IntlService }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: PDFService }, { token: i1$1.LocalizationService }, { token: DomEventsService }, { token: i0.Renderer2 }, { token: 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.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SchedulerComponent, deps: [{ token: i0.ElementRef }, { token: ViewContextService }, { token: ViewStateService }, { token: EditService }, { token: DialogsService }, { token: i1$3.IntlService }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: PDFService }, { token: i2.LocalizationService }, { token: DomEventsService }, { token: i0.Renderer2 }, { token: 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", "attr.role": "this.ariaRole", "class.k-rtl": "this.rtl", "attr.dir": "this.dir" } }, providers: [
         EditService,
         DialogsService,
         DomEventsService,
@@ -6772,6 +6807,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>
 
@@ -6804,7 +6842,7 @@ SchedulerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ver
 
         <div [loading]="loading" kendoSchedulerLoading>
         </div>
-    `, isInline: true, styles: [".k-scheduler.k-state-focused { box-shadow: 0 0.5px 0.5px 0.5px rgba(0, 0, 0, .12); }"], components: [{ type: ToolbarComponent, selector: "kendo-scheduler-toolbar", inputs: ["selectedView", "views", "dateRange", "selectedDate", "template", "min", "max"], outputs: ["navigate"] }, { type: EditDialogComponent, selector: "kendo-scheduler-edit-dialog", inputs: ["resources", "timezone", "weekStart", "fields", "editTemplate"] }, { type: i12$1.ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { type: LoadingComponent, selector: "[kendoSchedulerLoading]", inputs: ["loading"] }], directives: [{ type: LocalizedMessagesDirective, selector: "[kendoSchedulerLocalizedMessages]" }, { type: i10.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    `, isInline: true, styles: [".k-scheduler.k-state-focused { box-shadow: 0 0.5px 0.5px 0.5px rgba(0, 0, 0, .12); }"], components: [{ type: ToolbarComponent, selector: "kendo-scheduler-toolbar", inputs: ["selectedView", "views", "dateRange", "selectedDate", "template", "min", "max"], outputs: ["navigate"] }, { type: EditDialogComponent, selector: "kendo-scheduler-edit-dialog", inputs: ["resources", "timezone", "weekStart", "fields", "editTemplate"] }, { type: i12$1.ResizeSensorComponent, selector: "kendo-resize-sensor", inputs: ["rateLimit"], outputs: ["resize"] }, { type: LoadingComponent, selector: "[kendoSchedulerLoading]", inputs: ["loading"] }], directives: [{ type: LocalizedMessagesDirective, selector: "[kendoSchedulerLocalizedMessages]" }, { type: i11.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SchedulerComponent, decorators: [{
             type: Component,
             args: [{
@@ -7062,6 +7100,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>
 
@@ -7096,7 +7137,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         </div>
     `
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: ViewContextService }, { type: ViewStateService }, { type: EditService }, { type: DialogsService }, { type: i1$4.IntlService }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: PDFService }, { type: i1$1.LocalizationService }, { type: DomEventsService }, { type: i0.Renderer2 }, { type: FocusService }]; }, propDecorators: { hostClasses: [{
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: ViewContextService }, { type: ViewStateService }, { type: EditService }, { type: DialogsService }, { type: i1$3.IntlService }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: PDFService }, { type: i2.LocalizationService }, { type: DomEventsService }, { type: i0.Renderer2 }, { type: FocusService }]; }, propDecorators: { hostClasses: [{
                 type: HostBinding,
                 args: ['class.k-widget']
             }, {
@@ -7105,6 +7146,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']
@@ -7396,14 +7440,14 @@ class DataBindingDirective {
         this.rebind();
     }
 }
-DataBindingDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DataBindingDirective, deps: [{ token: SchedulerComponent }, { token: i0.ChangeDetectorRef }, { token: i1$4.IntlService }, { token: LocalDataChangesService }], target: i0.ɵɵFactoryTarget.Directive });
+DataBindingDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DataBindingDirective, deps: [{ token: SchedulerComponent }, { token: i0.ChangeDetectorRef }, { token: i1$3.IntlService }, { token: LocalDataChangesService }], target: i0.ɵɵFactoryTarget.Directive });
 DataBindingDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: DataBindingDirective, selector: "[kendoSchedulerBinding]", inputs: { data: ["kendoSchedulerBinding", "data"] }, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DataBindingDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kendoSchedulerBinding]'
                 }]
-        }], ctorParameters: function () { return [{ type: SchedulerComponent }, { type: i0.ChangeDetectorRef }, { type: i1$4.IntlService }, { type: LocalDataChangesService }]; }, propDecorators: { data: [{
+        }], ctorParameters: function () { return [{ type: SchedulerComponent }, { type: i0.ChangeDetectorRef }, { type: i1$3.IntlService }, { type: LocalDataChangesService }]; }, propDecorators: { data: [{
                 type: Input,
                 args: ['kendoSchedulerBinding']
             }] } });
@@ -7420,7 +7464,7 @@ class SchedulerCustomMessagesComponent extends Messages {
         return true;
     }
 }
-SchedulerCustomMessagesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SchedulerCustomMessagesComponent, deps: [{ token: i1$1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
+SchedulerCustomMessagesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SchedulerCustomMessagesComponent, deps: [{ token: i2.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
 SchedulerCustomMessagesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SchedulerCustomMessagesComponent, selector: "kendo-scheduler-messages", providers: [
         {
             provide: Messages,
@@ -7439,7 +7483,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     selector: 'kendo-scheduler-messages',
                     template: ``
                 }]
-        }], ctorParameters: function () { return [{ type: i1$1.LocalizationService }]; } });
+        }], ctorParameters: function () { return [{ type: i2.LocalizationService }]; } });
 
 /**
  * @hidden
@@ -7549,11 +7593,11 @@ class ConfigurationViewBase extends SchedulerView {
         this.schedulerOptions = options;
     }
 }
-ConfigurationViewBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ConfigurationViewBase, deps: [{ token: i1$1.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: ViewContextService }, { token: ViewStateService }], target: i0.ɵɵFactoryTarget.Directive });
+ConfigurationViewBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ConfigurationViewBase, deps: [{ token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: ViewContextService }, { token: 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", 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$1.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: ViewContextService }, { type: ViewStateService }]; }, propDecorators: { slotClass: [{
+        }], ctorParameters: function () { return [{ type: i2.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: ViewContextService }, { type: ViewStateService }]; }, propDecorators: { slotClass: [{
                 type: Input
             }], eventClass: [{
                 type: Input
@@ -7583,22 +7627,26 @@ const compose = (...args) => (data) => args.reduceRight((acc, curr) => curr(acc)
  * @hidden
  */
 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 */
 class EmptyIterator {
@@ -7611,6 +7659,7 @@ class EmptyIterator {
         return "Empty Iterator";
     }
 }
+let seed = 0;
 /**
  * @hidden
  */
@@ -7619,7 +7668,9 @@ 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());
@@ -7823,21 +7874,21 @@ class AgendaHeaderComponent {
         return this.localization.get('eventHeader');
     }
 }
-AgendaHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: AgendaHeaderComponent, deps: [{ token: i1$1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
+AgendaHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: AgendaHeaderComponent, deps: [{ token: i2.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>
         </div>
-    `, isInline: true, directives: [{ type: i10.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    `, isInline: true, directives: [{ type: i11.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: AgendaHeaderComponent, decorators: [{
             type: Component,
             args: [{
@@ -7846,20 +7897,20 @@ 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>
         </div>
     `
                 }]
-        }], ctorParameters: function () { return [{ type: i1$1.LocalizationService }]; }, propDecorators: { classes: [{
+        }], ctorParameters: function () { return [{ type: i2.LocalizationService }]; }, propDecorators: { classes: [{
                 type: HostBinding,
                 args: ["class.k-scheduler-header"]
             }, {
@@ -7875,6 +7926,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
 class AgendaHeaderItemComponent {
     constructor() {
         this.classes = true;
+        this.roleAttribute = "rowheader";
     }
     get rowSpan() {
         return this.item.rowSpan;
@@ -7884,7 +7936,7 @@ 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>
@@ -7893,7 +7945,7 @@ AgendaHeaderItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
         <ng-container *ngIf="agendaDateTemplate" [ngTemplateOutlet]="agendaDateTemplate"
             [ngTemplateOutletContext]="{ date: itemDate }">
         </ng-container>
-    `, isInline: true, directives: [{ type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i10.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "kendoDate": i1$4.DatePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    `, isInline: true, directives: [{ type: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i11.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "kendoDate": i1$3.DatePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: AgendaHeaderItemComponent, decorators: [{
             type: Component,
             args: [{
@@ -7914,6 +7966,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"]
@@ -7954,7 +8009,7 @@ class AgendaTaskItemComponent {
         return this.editable && this.editable.remove !== false;
     }
 }
-AgendaTaskItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: AgendaTaskItemComponent, deps: [{ token: i1$1.LocalizationService }, { token: LOCALE_ID }], target: i0.ɵɵFactoryTarget.Component });
+AgendaTaskItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: AgendaTaskItemComponent, deps: [{ token: i2.LocalizationService }, { token: LOCALE_ID }], target: i0.ɵɵFactoryTarget.Component });
 AgendaTaskItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: AgendaTaskItemComponent, selector: "[kendoSchedulerAgendaTaskItem]", inputs: { item: ["kendoSchedulerAgendaTaskItem", "item"], color: "color", eventTemplate: "eventTemplate", editable: "editable" }, host: { properties: { "attr.aria-label": "this.eventTitle" } }, ngImport: i0, template: `
         <div class="k-task" [title]="item.title">
             <span class="k-scheduler-mark" *ngIf="eventColor" [style.background-color]="eventColor"></span>
@@ -7971,7 +8026,7 @@ AgendaTaskItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0"
                 <span class="k-icon k-i-close"></span>
             </span>
         </div>
-    `, isInline: true, directives: [{ type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i10.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    `, isInline: true, directives: [{ type: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i11.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: AgendaTaskItemComponent, decorators: [{
             type: Component,
             args: [{
@@ -7996,7 +8051,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         </div>
     `
                 }]
-        }], ctorParameters: function () { return [{ type: i1$1.LocalizationService }, { type: undefined, decorators: [{
+        }], ctorParameters: function () { return [{ type: i2.LocalizationService }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [LOCALE_ID]
                 }] }]; }, propDecorators: { item: [{
@@ -8070,14 +8125,14 @@ class AgendaListComponent {
         }
     }
 }
-AgendaListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: AgendaListComponent, deps: [{ token: i1$4.IntlService }, { token: i1$1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
+AgendaListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: AgendaListComponent, deps: [{ token: i1$3.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>
@@ -8085,19 +8140,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"
@@ -8106,19 +8162,19 @@ AgendaListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ve
                 </ng-container>
             </tbody>
         </table>
-    `, isInline: true, components: [{ type: AgendaHeaderItemComponent, selector: "[kendoSchedulerAgendaHeaderItem]", inputs: ["kendoSchedulerAgendaHeaderItem", "agendaDateTemplate"] }, { type: AgendaTaskItemComponent, selector: "[kendoSchedulerAgendaTaskItem]", inputs: ["kendoSchedulerAgendaTaskItem", "color", "eventTemplate", "editable"] }], directives: [{ type: i10.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i10.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i10.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i10.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: FocusableDirective, selector: "[kendoSchedulerFocusIndex]", inputs: ["kendoSchedulerFocusIndex"] }] });
+    `, isInline: true, components: [{ type: AgendaHeaderItemComponent, selector: "[kendoSchedulerAgendaHeaderItem]", inputs: ["kendoSchedulerAgendaHeaderItem", "agendaDateTemplate"] }, { type: AgendaTaskItemComponent, selector: "[kendoSchedulerAgendaTaskItem]", inputs: ["kendoSchedulerAgendaTaskItem", "color", "eventTemplate", "editable"] }], directives: [{ type: i11.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i11.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i11.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i11.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: FocusableDirective, selector: "[kendoSchedulerFocusIndex]", inputs: ["kendoSchedulerFocusIndex"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: AgendaListComponent, decorators: [{
             type: Component,
             args: [{
                     // 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>
@@ -8126,19 +8182,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"
@@ -8149,7 +8206,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         </table>
     `
                 }]
-        }], ctorParameters: function () { return [{ type: i1$4.IntlService }, { type: i1$1.LocalizationService }]; }, propDecorators: { classes: [{
+        }], ctorParameters: function () { return [{ type: i1$3.IntlService }, { type: i2.LocalizationService }]; }, propDecorators: { classes: [{
                 type: HostBinding,
                 args: ['class.k-scheduler-content']
             }], tasks: [{
@@ -8203,7 +8260,10 @@ 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();
@@ -8444,10 +8504,10 @@ class AgendaViewInternalComponent {
         }
     }
 }
-AgendaViewInternalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: AgendaViewInternalComponent, deps: [{ token: ViewContextService }, { token: ViewStateService }, { token: i1$4.IntlService }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.NgZone }, { token: PDFService }, { token: i1$1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
+AgendaViewInternalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: AgendaViewInternalComponent, deps: [{ token: ViewContextService }, { token: ViewStateService }, { token: i1$3.IntlService }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.NgZone }, { token: PDFService }, { token: i2.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>
@@ -8469,15 +8529,15 @@ AgendaViewInternalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.
                 </tr>
             </tbody>
         </table>
-    `, isInline: true, components: [{ type: AgendaHeaderComponent, selector: "[kendoSchedulerAgendaHeader]", inputs: ["resources"] }, { type: AgendaListComponent, selector: "[kendoSchedulerAgendaList]", inputs: ["tasks", "eventTemplate", "slotClass", "eventClass", "eventStyles", "agendaTimeTemplate", "agendaDateTemplate", "editable"] }], pipes: { "async": i10.AsyncPipe } });
+    `, isInline: true, components: [{ type: AgendaHeaderComponent, selector: "[kendoSchedulerAgendaHeader]", inputs: ["resources"] }, { type: AgendaListComponent, selector: "[kendoSchedulerAgendaList]", inputs: ["tasks", "eventTemplate", "slotClass", "eventClass", "eventStyles", "agendaTimeTemplate", "agendaDateTemplate", "editable"] }], pipes: { "async": i11.AsyncPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: AgendaViewInternalComponent, decorators: [{
             type: Component,
             args: [{
                     // 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>
@@ -8501,7 +8561,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         </table>
     `
                 }]
-        }], ctorParameters: function () { return [{ type: ViewContextService }, { type: ViewStateService }, { type: i1$4.IntlService }, { type: i0.Renderer2 }, { type: i0.ElementRef }, { type: i0.NgZone }, { type: PDFService }, { type: i1$1.LocalizationService }]; }, propDecorators: { eventTemplate: [{
+        }], ctorParameters: function () { return [{ type: ViewContextService }, { type: ViewStateService }, { type: i1$3.IntlService }, { type: i0.Renderer2 }, { type: i0.ElementRef }, { type: i0.NgZone }, { type: PDFService }, { type: i2.LocalizationService }]; }, propDecorators: { eventTemplate: [{
                 type: Input
             }], slotClass: [{
                 type: Input
@@ -8566,7 +8626,7 @@ class AgendaViewComponent extends ConfigurationViewBase {
         return this.localization.get('agendaViewTitle');
     }
 }
-AgendaViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: AgendaViewComponent, deps: [{ token: i1$1.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: ViewContextService }, { token: ViewStateService }], target: i0.ɵɵFactoryTarget.Component });
+AgendaViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: AgendaViewComponent, deps: [{ token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: ViewContextService }, { token: ViewStateService }], target: i0.ɵɵFactoryTarget.Component });
 AgendaViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: AgendaViewComponent, selector: "kendo-scheduler-agenda-view", inputs: { selectedDateFormat: "selectedDateFormat", selectedShortDateFormat: "selectedShortDateFormat", numberOfDays: "numberOfDays" }, providers: [{
             provide: SchedulerView,
             useExisting: forwardRef(() => AgendaViewComponent)
@@ -8610,7 +8670,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         </ng-template>
     `
                 }]
-        }], ctorParameters: function () { return [{ type: i1$1.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: ViewContextService }, { type: ViewStateService }]; }, propDecorators: { selectedDateFormat: [{
+        }], ctorParameters: function () { return [{ type: i2.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: ViewContextService }, { type: ViewStateService }]; }, propDecorators: { selectedDateFormat: [{
                 type: Input
             }], selectedShortDateFormat: [{
                 type: Input
@@ -8879,7 +8939,7 @@ BaseViewItem.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "1
 BaseViewItem.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: BaseViewItem, inputs: { item: "item", resourceIndex: "resourceIndex", rangeIndex: "rangeIndex", index: "index", eventTemplate: "eventTemplate", editable: "editable", dragHint: "dragHint", resources: "resources" }, host: { properties: { "class.k-event": "this.className", "attr.data-task-index": "this.taskIndex", "style.touch-action": "this.touchAction", "attr.aria-label": "this.eventTitle" } }, usesOnChanges: true, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: BaseViewItem, decorators: [{
             type: Directive
-        }], ctorParameters: function () { return [{ type: BaseSlotService }, { type: i1$1.LocalizationService }, { type: FocusService }, { type: i0.ElementRef }, { type: i0.Renderer2 }, { type: undefined }]; }, propDecorators: { item: [{
+        }], ctorParameters: function () { return [{ type: BaseSlotService }, { type: i2.LocalizationService }, { type: FocusService }, { type: i0.ElementRef }, { type: i0.Renderer2 }, { type: undefined }]; }, propDecorators: { item: [{
                 type: Input
             }], resourceIndex: [{
                 type: Input
@@ -9245,7 +9305,7 @@ class MonthViewItemComponent extends BaseViewItem {
         super.reflow();
     }
 }
-MonthViewItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: MonthViewItemComponent, deps: [{ token: MonthSlotService }, { token: i1$1.LocalizationService }, { token: FocusService }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: LOCALE_ID }], target: i0.ɵɵFactoryTarget.Component });
+MonthViewItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: MonthViewItemComponent, deps: [{ token: MonthSlotService }, { token: i2.LocalizationService }, { token: FocusService }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: LOCALE_ID }], target: i0.ɵɵFactoryTarget.Component });
 MonthViewItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: MonthViewItemComponent, selector: "[monthViewItem]", usesInheritance: true, ngImport: i0, template: `
         <span class="k-event-actions">
             <span class="k-icon k-i-arrow-60-left" *ngIf="item.tail"></span>
@@ -9270,7 +9330,7 @@ MonthViewItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0",
             <span class="k-resize-handle k-resize-w"></span>
             <span class="k-resize-handle k-resize-e"></span>
         </ng-container>
-    `, isInline: true, directives: [{ type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i10.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }] });
+    `, isInline: true, directives: [{ type: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i11.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: MonthViewItemComponent, decorators: [{
             type: Component,
             args: [{
@@ -9302,7 +9362,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         </ng-container>
     `
                 }]
-        }], ctorParameters: function () { return [{ type: MonthSlotService }, { type: i1$1.LocalizationService }, { type: FocusService }, { type: i0.ElementRef }, { type: i0.Renderer2 }, { type: undefined, decorators: [{
+        }], ctorParameters: function () { return [{ type: MonthSlotService }, { type: i2.LocalizationService }, { type: FocusService }, { type: i0.ElementRef }, { type: i0.Renderer2 }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [LOCALE_ID]
                 }] }]; } });
@@ -9440,7 +9500,7 @@ 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();
         }));
@@ -10308,11 +10368,11 @@ class BaseView {
         };
     }
 }
-BaseView.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: BaseView, deps: [{ token: ViewContextService }, { token: ViewStateService }, { token: i1$4.IntlService }, { token: BaseSlotService }, { token: i0.NgZone }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: PDFService }, { token: i1$1.LocalizationService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive });
+BaseView.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: BaseView, deps: [{ token: ViewContextService }, { token: ViewStateService }, { token: i1$3.IntlService }, { token: BaseSlotService }, { token: i0.NgZone }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: PDFService }, { token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive });
 BaseView.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: BaseView, inputs: { еventTemplate: "\u0435ventTemplate", groupHeaderTemplate: "groupHeaderTemplate", selectedDateFormat: "selectedDateFormat", selectedShortDateFormat: "selectedShortDateFormat", eventHeight: "eventHeight", slotClass: "slotClass", eventClass: "eventClass", eventStyles: "eventStyles", weekStart: "weekStart" }, viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true }, { propertyName: "header", first: true, predicate: ["header"], descendants: true }, { propertyName: "contentTable", first: true, predicate: ["contentTable"], descendants: true }, { propertyName: "times", first: true, predicate: ["times"], descendants: true }, { propertyName: "timesHeader", first: true, predicate: ["timesHeader"], descendants: true }, { propertyName: "timesTable", first: true, predicate: ["timesTable"], descendants: true }, { propertyName: "headerWrap", first: true, predicate: ["headerWrap"], descendants: true }, { propertyName: "hintContainer", first: true, predicate: ["hintContainer"], descendants: true }], usesOnChanges: true, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: BaseView, decorators: [{
             type: Directive
-        }], ctorParameters: function () { return [{ type: ViewContextService }, { type: ViewStateService }, { type: i1$4.IntlService }, { type: BaseSlotService }, { type: i0.NgZone }, { type: i0.Renderer2 }, { type: i0.ElementRef }, { type: PDFService }, { type: i1$1.LocalizationService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { еventTemplate: [{
+        }], ctorParameters: function () { return [{ type: ViewContextService }, { type: ViewStateService }, { type: i1$3.IntlService }, { type: BaseSlotService }, { type: i0.NgZone }, { type: i0.Renderer2 }, { type: i0.ElementRef }, { type: PDFService }, { type: i2.LocalizationService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { еventTemplate: [{
                 type: Input
             }], groupHeaderTemplate: [{
                 type: Input
@@ -10372,7 +10432,7 @@ HintContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", v
 HintContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: HintContainerComponent, selector: "kendo-hint-container", queries: [{ propertyName: "hintTemplate", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0, template: `
         <ng-container [ngTemplateOutlet]="hintTemplate">
         </ng-container>
-    `, isInline: true, directives: [{ type: i10.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }] });
+    `, isInline: true, directives: [{ type: i11.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: HintContainerComponent, decorators: [{
             type: Component,
             args: [{
@@ -10420,7 +10480,7 @@ ResizeHintComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ve
             <div class="k-label-top" *ngIf="hint.first">{{ start | kendoDate : format }}</div>
             <div class="k-label-bottom" *ngIf="hint.last">{{ end | kendoDate : format }}</div>
         </div>
-    `, isInline: true, directives: [{ type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "kendoDate": i1$4.DatePipe } });
+    `, isInline: true, directives: [{ type: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "kendoDate": i1$3.DatePipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ResizeHintComponent, decorators: [{
             type: Component,
             args: [{
@@ -10544,11 +10604,11 @@ class BaseSlotDirective {
         this._rect = null;
     }
 }
-BaseSlotDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: BaseSlotDirective, deps: [{ token: i0.ElementRef }, { token: BaseSlotService }, { token: i1$1.LocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
+BaseSlotDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: BaseSlotDirective, deps: [{ token: i0.ElementRef }, { token: BaseSlotService }, { token: i2.LocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
 BaseSlotDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: BaseSlotDirective, inputs: { id: "id" }, host: { properties: { "attr.data-slot-index": "this.slotIndex" } }, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: BaseSlotDirective, decorators: [{
             type: Directive
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: BaseSlotService }, { type: i1$1.LocalizationService }]; }, propDecorators: { id: [{
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: BaseSlotService }, { type: i2.LocalizationService }]; }, propDecorators: { id: [{
                 type: Input
             }], slotIndex: [{
                 type: HostBinding,
@@ -10610,7 +10670,7 @@ class MonthSlotDirective extends BaseSlotDirective {
         }
     }
 }
-MonthSlotDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: MonthSlotDirective, deps: [{ token: i0.ElementRef }, { token: MonthSlotService }, { token: i1$1.LocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
+MonthSlotDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: MonthSlotDirective, deps: [{ token: i0.ElementRef }, { token: MonthSlotService }, { token: i2.LocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
 MonthSlotDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: MonthSlotDirective, selector: "[monthSlot]", inputs: { start: "start" }, usesInheritance: true, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: MonthSlotDirective, decorators: [{
             type: Directive,
@@ -10618,7 +10678,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     // eslint-disable-next-line @angular-eslint/directive-selector
                     selector: '[monthSlot]'
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: MonthSlotService }, { type: i1$1.LocalizationService }]; }, propDecorators: { start: [{
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: MonthSlotService }, { type: i2.LocalizationService }]; }, propDecorators: { start: [{
                 type: Input
             }] } });
 
@@ -10694,8 +10754,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
  * @hidden
  */
 class MonthViewRendererComponent extends BaseView {
-    constructor(viewContext, viewState, intl, slotService, zone, element, renderer, pdfService, localization, changeDetector) {
+    constructor(viewContext, viewState, intl, slotService, zone, element, renderer, pdfService, localization, changeDetector, focusService) {
         super(viewContext, viewState, intl, slotService, zone, renderer, element, pdfService, localization, changeDetector);
+        this.focusService = focusService;
         this.resizeHintFormat = { skeleton: 'Md' };
         this.weeks = [];
         this.updateOngoingEvents = this.updateOngoingEvents.bind(this);
@@ -10794,6 +10855,7 @@ class MonthViewRendererComponent extends BaseView {
                 const slot = this.slotService.slotByIndex(index);
                 this.zone.run(() => {
                     this.viewState.navigateTo({ viewName: 'day', date: toLocalDate(slot.start) });
+                    this.focusService.clearActiveDescendant();
                 });
                 return;
             }
@@ -10880,7 +10942,7 @@ class MonthViewRendererComponent extends BaseView {
         return weeks;
     }
 }
-MonthViewRendererComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: MonthViewRendererComponent, deps: [{ token: ViewContextService }, { token: ViewStateService }, { token: i1$4.IntlService }, { token: MonthSlotService }, { token: i0.NgZone }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: PDFService }, { token: i1$1.LocalizationService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+MonthViewRendererComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: MonthViewRendererComponent, deps: [{ token: ViewContextService }, { token: ViewStateService }, { token: i1$3.IntlService }, { token: MonthSlotService }, { token: i0.NgZone }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: PDFService }, { token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: FocusService }], target: i0.ɵɵFactoryTarget.Component });
 MonthViewRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: MonthViewRendererComponent, selector: "month-view", inputs: { monthDaySlotTemplate: "monthDaySlotTemplate", highlightOngoingEvents: "highlightOngoingEvents" }, providers: [
         MonthSlotService
     ], viewQueries: [{ propertyName: "eventElements", predicate: MonthViewItemComponent, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: `
@@ -10965,7 +11027,9 @@ MonthViewRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0
                          <div *ngFor="let itemResource of item.resources; trackBy: itemIndex"
                             [ngClass]="getEventClasses(item, itemResource.resources)"
                             [ngStyle]="getEventStyles(item, itemResource)"
+                            role="button"
                             [kendoSchedulerFocusIndex]="itemResource.leafIdx"
+                            [id]="item.elementId + '_' + itemResource.leafIdx"
                             monthViewItem
                                 [editable]="editable"
                                 [item]="item"
@@ -11000,7 +11064,7 @@ MonthViewRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0
                 </div>
             </div>
         </div>
-    `, isInline: true, components: [{ type: MonthViewItemComponent, selector: "[monthViewItem]" }, { type: HintContainerComponent, selector: "kendo-hint-container" }, { type: ResizeHintComponent, selector: "[kendoResizeHint]", inputs: ["hint", "format"] }], directives: [{ type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i10.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i10.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: MonthSlotDirective, selector: "[monthSlot]", inputs: ["start"] }, { type: i10.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: FocusableDirective, selector: "[kendoSchedulerFocusIndex]", inputs: ["kendoSchedulerFocusIndex"] }], pipes: { "resourceIterator": ResourceIteratorPipe, "kendoDate": i1$4.DatePipe, "repeat": RepeatPipe, "async": i10.AsyncPipe } });
+    `, isInline: true, components: [{ type: MonthViewItemComponent, selector: "[monthViewItem]" }, { type: HintContainerComponent, selector: "kendo-hint-container" }, { type: ResizeHintComponent, selector: "[kendoResizeHint]", inputs: ["hint", "format"] }], directives: [{ type: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i11.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i11.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i11.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: MonthSlotDirective, selector: "[monthSlot]", inputs: ["start"] }, { type: i11.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: FocusableDirective, selector: "[kendoSchedulerFocusIndex]", inputs: ["kendoSchedulerFocusIndex"] }], pipes: { "resourceIterator": ResourceIteratorPipe, "kendoDate": i1$3.DatePipe, "repeat": RepeatPipe, "async": i11.AsyncPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: MonthViewRendererComponent, decorators: [{
             type: Component,
             args: [{
@@ -11091,7 +11155,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                          <div *ngFor="let itemResource of item.resources; trackBy: itemIndex"
                             [ngClass]="getEventClasses(item, itemResource.resources)"
                             [ngStyle]="getEventStyles(item, itemResource)"
+                            role="button"
                             [kendoSchedulerFocusIndex]="itemResource.leafIdx"
+                            [id]="item.elementId + '_' + itemResource.leafIdx"
                             monthViewItem
                                 [editable]="editable"
                                 [item]="item"
@@ -11128,7 +11194,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         </div>
     `
                 }]
-        }], ctorParameters: function () { return [{ type: ViewContextService }, { type: ViewStateService }, { type: i1$4.IntlService }, { type: MonthSlotService }, { type: i0.NgZone }, { type: i0.ElementRef }, { type: i0.Renderer2 }, { type: PDFService }, { type: i1$1.LocalizationService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { monthDaySlotTemplate: [{
+        }], ctorParameters: function () { return [{ type: ViewContextService }, { type: ViewStateService }, { type: i1$3.IntlService }, { type: MonthSlotService }, { type: i0.NgZone }, { type: i0.ElementRef }, { type: i0.Renderer2 }, { type: PDFService }, { type: i2.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: FocusService }]; }, propDecorators: { monthDaySlotTemplate: [{
                 type: Input
             }], highlightOngoingEvents: [{
                 type: Input
@@ -11172,7 +11238,7 @@ class MonthViewComponent extends ConfigurationViewBase {
         return isPresent(this.eventHeight) ? this.eventHeight : (this.schedulerOptions.eventHeight || DEFAULT_EVENT_HEIGHT);
     }
 }
-MonthViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: MonthViewComponent, deps: [{ token: i1$1.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: ViewContextService }, { token: ViewStateService }], target: i0.ɵɵFactoryTarget.Component });
+MonthViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: MonthViewComponent, deps: [{ token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: ViewContextService }, { token: ViewStateService }], target: i0.ɵɵFactoryTarget.Component });
 MonthViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: MonthViewComponent, selector: "kendo-scheduler-month-view", inputs: { eventHeight: "eventHeight", selectedDateFormat: "selectedDateFormat", selectedShortDateFormat: "selectedShortDateFormat" }, providers: [{
             provide: SchedulerView,
             useExisting: forwardRef(() => MonthViewComponent)
@@ -11220,7 +11286,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         </ng-template>
     `
                 }]
-        }], ctorParameters: function () { return [{ type: i1$1.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: ViewContextService }, { type: ViewStateService }]; }, propDecorators: { eventHeight: [{
+        }], ctorParameters: function () { return [{ type: i2.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: ViewContextService }, { type: ViewStateService }]; }, propDecorators: { eventHeight: [{
                 type: Input
             }], selectedDateFormat: [{
                 type: Input
@@ -11255,7 +11321,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: i10.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"] }, { type: i10.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
+    `, isInline: true, directives: [{ type: i11.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"] }, { type: i11.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ViewFooterComponent, decorators: [{
             type: Component,
             args: [{
@@ -11304,14 +11370,14 @@ class WorkHoursFooterDirective {
         this.footerItems[0].text = this.showWorkHours ? this.localization.get('showFullDay') : this.localization.get('showWorkDay');
     }
 }
-WorkHoursFooterDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: WorkHoursFooterDirective, deps: [{ token: ViewFooterComponent }, { token: i1$1.LocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
+WorkHoursFooterDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: WorkHoursFooterDirective, deps: [{ token: ViewFooterComponent }, { token: i2.LocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
 WorkHoursFooterDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: WorkHoursFooterDirective, selector: "[kendoWorkHoursFooter]", inputs: { showWorkHours: "showWorkHours" }, usesOnChanges: true, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: WorkHoursFooterDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kendoWorkHoursFooter]'
                 }]
-        }], ctorParameters: function () { return [{ type: ViewFooterComponent }, { type: i1$1.LocalizationService }]; }, propDecorators: { showWorkHours: [{
+        }], ctorParameters: function () { return [{ type: ViewFooterComponent }, { type: i2.LocalizationService }]; }, propDecorators: { showWorkHours: [{
                 type: Input
             }] } });
 
@@ -11493,11 +11559,11 @@ class DayTimeViewBase extends ConfigurationViewBase {
         return isPresent(this[name]) ? this[name] : this.schedulerOptions[name];
     }
 }
-DayTimeViewBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DayTimeViewBase, deps: [{ token: i1$1.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: ViewContextService }, { token: ViewStateService }], target: i0.ɵɵFactoryTarget.Directive });
+DayTimeViewBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DayTimeViewBase, deps: [{ token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: ViewContextService }, { token: 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", 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$1.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: ViewContextService }, { type: ViewStateService }]; }, propDecorators: { timeSlotTemplate: [{
+        }], ctorParameters: function () { return [{ type: i2.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: ViewContextService }, { type: ViewStateService }]; }, propDecorators: { timeSlotTemplate: [{
                 type: ContentChild,
                 args: [TimeSlotTemplateDirective, { static: false }]
             }], dateHeaderTemplate: [{
@@ -11546,11 +11612,11 @@ class MultiDayViewBase extends DayTimeViewBase {
         return this.optionValue(SLOT_FILL);
     }
 }
-MultiDayViewBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: MultiDayViewBase, deps: [{ token: i1$1.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: ViewContextService }, { token: ViewStateService }], target: i0.ɵɵFactoryTarget.Directive });
+MultiDayViewBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: MultiDayViewBase, deps: [{ token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: ViewContextService }, { token: ViewStateService }], target: i0.ɵɵFactoryTarget.Directive });
 MultiDayViewBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: MultiDayViewBase, inputs: { slotFill: "slotFill" }, usesInheritance: true, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: MultiDayViewBase, decorators: [{
             type: Directive
-        }], ctorParameters: function () { return [{ type: i1$1.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: ViewContextService }, { type: ViewStateService }]; }, propDecorators: { slotFill: [{
+        }], ctorParameters: function () { return [{ type: i2.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: ViewContextService }, { type: ViewStateService }]; }, propDecorators: { slotFill: [{
                 type: Input
             }] } });
 
@@ -12242,7 +12308,7 @@ class DayTimeViewItemComponent extends BaseViewItem {
         return this.intlService.format('{0:t}–{1:t}', toLocalDate(this.item.startTime), toLocalDate(this.item.endTime));
     }
 }
-DayTimeViewItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DayTimeViewItemComponent, deps: [{ token: i1$4.IntlService }, { token: DayTimeSlotService }, { token: i1$1.LocalizationService }, { token: FocusService }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: LOCALE_ID }], target: i0.ɵɵFactoryTarget.Component });
+DayTimeViewItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DayTimeViewItemComponent, deps: [{ token: i1$3.IntlService }, { token: DayTimeSlotService }, { token: i2.LocalizationService }, { token: FocusService }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: LOCALE_ID }], target: i0.ɵɵFactoryTarget.Component });
 DayTimeViewItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: DayTimeViewItemComponent, selector: "[dayTimeViewItem]", inputs: { vertical: "vertical", isAllDay: "isAllDay" }, usesInheritance: true, ngImport: i0, template: `
         <span class="k-event-actions">
             <span class="k-icon k-i-arrow-60-left" *ngIf="item.tail && !vertical"></span>
@@ -12281,7 +12347,7 @@ DayTimeViewItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0
             <span class="k-resize-handle k-resize-w"></span>
             <span class="k-resize-handle k-resize-e"></span>
         </ng-container>
-    `, isInline: true, directives: [{ type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i10.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }] });
+    `, isInline: true, directives: [{ type: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i11.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DayTimeViewItemComponent, decorators: [{
             type: Component,
             args: [{
@@ -12327,7 +12393,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         </ng-container>
     `
                 }]
-        }], ctorParameters: function () { return [{ type: i1$4.IntlService }, { type: DayTimeSlotService }, { type: i1$1.LocalizationService }, { type: FocusService }, { type: i0.ElementRef }, { type: i0.Renderer2 }, { type: undefined, decorators: [{
+        }], ctorParameters: function () { return [{ type: i1$3.IntlService }, { type: DayTimeSlotService }, { type: i2.LocalizationService }, { type: FocusService }, { type: i0.ElementRef }, { type: i0.Renderer2 }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [LOCALE_ID]
                 }] }]; }, propDecorators: { vertical: [{
@@ -12343,9 +12409,10 @@ const getNextDate = (date, count, numberOfDays) => getDate(addDays(date, numberO
  * @hidden
  */
 class DayTimeViewComponent extends BaseView {
-    constructor(changeDetector, viewContext, viewState, intl, slotService, zone, renderer, element, pdfService, localization) {
+    constructor(changeDetector, viewContext, viewState, intl, slotService, zone, renderer, element, pdfService, localization, focusService) {
         super(viewContext, viewState, intl, slotService, zone, renderer, element, pdfService, localization, changeDetector);
         this.changeDetector = changeDetector;
+        this.focusService = focusService;
         this.numberOfDays = 1;
         this.startTime = '00:00';
         this.endTime = '00:00';
@@ -12557,6 +12624,7 @@ class DayTimeViewComponent extends BaseView {
             const slot = this.daySlots[parseInt(daySlotIndex, 10)];
             this.zone.run(() => {
                 this.viewState.navigateTo({ viewName: 'day', date: slot.start });
+                this.focusService.clearActiveDescendant();
             });
         }
     }
@@ -12647,12 +12715,12 @@ class DayTimeViewComponent extends BaseView {
         return fields;
     }
 }
-DayTimeViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DayTimeViewComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: ViewContextService }, { token: ViewStateService }, { token: i1$4.IntlService }, { token: DayTimeSlotService }, { token: i0.NgZone }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: PDFService }, { token: i1$1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
+DayTimeViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DayTimeViewComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: ViewContextService }, { token: ViewStateService }, { token: i1$3.IntlService }, { token: DayTimeSlotService }, { token: i0.NgZone }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: PDFService }, { token: i2.LocalizationService }, { token: FocusService }], 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", 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: '' }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: ViewContextService }, { type: ViewStateService }, { type: i1$4.IntlService }, { type: DayTimeSlotService }, { type: i0.NgZone }, { type: i0.Renderer2 }, { type: i0.ElementRef }, { type: PDFService }, { type: i1$1.LocalizationService }]; }, propDecorators: { timeSlotTemplate: [{
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: ViewContextService }, { type: ViewStateService }, { type: i1$3.IntlService }, { type: DayTimeSlotService }, { type: i0.NgZone }, { type: i0.Renderer2 }, { type: i0.ElementRef }, { type: PDFService }, { type: i2.LocalizationService }, { type: FocusService }]; }, propDecorators: { timeSlotTemplate: [{
                 type: Input
             }], dateHeaderTemplate: [{
                 type: Input
@@ -12740,7 +12808,7 @@ class TimeSlotDirective extends BaseSlotDirective {
         return localEnd;
     }
 }
-TimeSlotDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TimeSlotDirective, deps: [{ token: i0.ElementRef }, { token: DayTimeSlotService }, { token: i1$1.LocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
+TimeSlotDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TimeSlotDirective, deps: [{ token: i0.ElementRef }, { token: DayTimeSlotService }, { token: i2.LocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
 TimeSlotDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: TimeSlotDirective, selector: "[timeSlot]", inputs: { invariantStart: "invariantStart", invariantEnd: "invariantEnd", workDayStart: "workDayStart", workDayEnd: "workDayEnd", workWeekStart: "workWeekStart", workWeekEnd: "workWeekEnd", date: "date" }, host: { properties: { "class.k-nonwork-hour": "this.nonWorkHour" } }, exportAs: ["timeSlot"], usesInheritance: true, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TimeSlotDirective, decorators: [{
             type: Directive,
@@ -12749,7 +12817,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     selector: '[timeSlot]',
                     exportAs: 'timeSlot'
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: DayTimeSlotService }, { type: i1$1.LocalizationService }]; }, propDecorators: { invariantStart: [{
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: DayTimeSlotService }, { type: i2.LocalizationService }]; }, propDecorators: { invariantStart: [{
                 type: Input
             }], invariantEnd: [{
                 type: Input
@@ -12797,7 +12865,7 @@ class DaySlotDirective extends BaseSlotDirective {
         return true;
     }
 }
-DaySlotDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DaySlotDirective, deps: [{ token: i0.ElementRef }, { token: DayTimeSlotService }, { token: i1$1.LocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
+DaySlotDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DaySlotDirective, deps: [{ token: i0.ElementRef }, { token: DayTimeSlotService }, { token: i2.LocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
 DaySlotDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: DaySlotDirective, selector: "[daySlot]", inputs: { start: "start", end: "end" }, host: { properties: { "attr.data-day-slot": "this.daySlot" } }, usesInheritance: true, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DaySlotDirective, decorators: [{
             type: Directive,
@@ -12805,7 +12873,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     // eslint-disable-next-line @angular-eslint/directive-selector
                     selector: '[daySlot]'
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: DayTimeSlotService }, { type: i1$1.LocalizationService }]; }, propDecorators: { start: [{
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: DayTimeSlotService }, { type: i2.LocalizationService }]; }, propDecorators: { start: [{
                 type: Input
             }], end: [{
                 type: Input
@@ -12818,8 +12886,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
  * @hidden
  */
 class MultiDayViewRendererComponent extends DayTimeViewComponent {
-    constructor(localization, viewContext, viewState, intl, slotService, zone, renderer, element, changeDetector, pdfService) {
-        super(changeDetector, viewContext, viewState, intl, slotService, zone, renderer, element, pdfService, localization);
+    constructor(localization, viewContext, viewState, intl, slotService, zone, renderer, element, changeDetector, pdfService, focusService) {
+        super(changeDetector, viewContext, viewState, intl, slotService, zone, renderer, element, pdfService, localization, focusService);
         this.name = 'day';
         this.dateFormat = { skeleton: 'MEd' };
         this.allDayResizeHintFormat = { skeleton: 'Md' };
@@ -13030,7 +13098,7 @@ class MultiDayViewRendererComponent extends DayTimeViewComponent {
         return 0;
     }
 }
-MultiDayViewRendererComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: MultiDayViewRendererComponent, deps: [{ token: i1$1.LocalizationService }, { token: ViewContextService }, { token: ViewStateService }, { token: i1$4.IntlService }, { token: DayTimeSlotService }, { token: i0.NgZone }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: PDFService }], target: i0.ɵɵFactoryTarget.Component });
+MultiDayViewRendererComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: MultiDayViewRendererComponent, deps: [{ token: i2.LocalizationService }, { token: ViewContextService }, { token: ViewStateService }, { token: i1$3.IntlService }, { token: DayTimeSlotService }, { token: i0.NgZone }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: PDFService }, { token: FocusService }], target: i0.ɵɵFactoryTarget.Component });
 MultiDayViewRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: MultiDayViewRendererComponent, selector: "multi-day-view", inputs: { name: "name", slotFill: "slotFill", allDaySlotTemplate: "allDaySlotTemplate", allDayEventTemplate: "allDayEventTemplate", minorTimeHeaderTemplate: "minorTimeHeaderTemplate", majorTimeHeaderTemplate: "majorTimeHeaderTemplate" }, providers: [
         DayTimeSlotService
     ], viewQueries: [{ propertyName: "headerHintContainer", first: true, predicate: ["headerHintContainer"], descendants: true }, { propertyName: "dayCells", predicate: ["allDayCell"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: `
@@ -13094,7 +13162,9 @@ MultiDayViewRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "1
                                 <div *ngFor="let itemResource of item.resources; trackBy: itemIndex;"
                                     [ngClass]="getEventClasses(item, itemResource.resources, true)"
                                     [ngStyle]="getEventStyles(item, itemResource, true)"
+                                    role="button"
                                     [kendoSchedulerFocusIndex]="itemResource.leafIdx"
+                                    [id]="item.elementId + '_' + itemResource.leafIdx"
                                      dayTimeViewItem
                                         [isAllDay]="true"
                                         [editable]="editable"
@@ -13220,7 +13290,9 @@ MultiDayViewRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "1
                         <div *ngFor="let itemResource of item.resources; trackBy: itemIndex;"
                             [ngClass]="getEventClasses(item, itemResource.resources)"
                             [ngStyle]="getEventStyles(item, itemResource)"
+                            role="button"
                             [kendoSchedulerFocusIndex]="itemResource.leafIdx"
+                            [id]="item.elementId + '_' + itemResource.leafIdx"
                             dayTimeViewItem
                                 [editable]="editable"
                                 [vertical]="true"
@@ -13237,7 +13309,9 @@ MultiDayViewRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "1
                             <div *ngFor="let itemResource of item.resources; trackBy: itemIndex;"
                                 [ngClass]="getEventClasses(item, itemResource.resources, true)"
                                 [ngStyle]="getEventStyles(item, itemResource, true)"
+                                role="button"
                                 [kendoSchedulerFocusIndex]="itemResource.leafIdx"
+                                [id]="item.elementId + '_' + itemResource.leafIdx"
                                 dayTimeViewItem
                                     [isAllDay]="true"
                                     [editable]="editable"
@@ -13254,6 +13328,7 @@ MultiDayViewRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "1
                         <ng-template>
                             <div *ngIf="dragHints.length && (!allDayDragHint || verticalResources.length)"
                                 class="k-event-drag-hint"
+                                role="button"
                                 dayTimeViewItem
                                     [isAllDay]="allDayDragHint"
                                     [ngStyle]="dragHints[0].style"
@@ -13277,7 +13352,7 @@ MultiDayViewRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "1
                 </div>
             </div>
         </div>
-    `, isInline: true, components: [{ type: DayTimeViewItemComponent, selector: "[dayTimeViewItem]", inputs: ["vertical", "isAllDay"] }, { type: HintContainerComponent, selector: "kendo-hint-container" }, { type: ResizeHintComponent, selector: "[kendoResizeHint]", inputs: ["hint", "format"] }], directives: [{ type: i10.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i10.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i10.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: DaySlotDirective, selector: "[daySlot]", inputs: ["start", "end"] }, { type: i10.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: FocusableDirective, selector: "[kendoSchedulerFocusIndex]", inputs: ["kendoSchedulerFocusIndex"] }, { type: TimeSlotDirective, selector: "[timeSlot]", inputs: ["invariantStart", "invariantEnd", "workDayStart", "workDayEnd", "workWeekStart", "workWeekEnd", "date"], exportAs: ["timeSlot"] }], pipes: { "resourceIterator": ResourceIteratorPipe, "kendoDate": i1$4.DatePipe, "async": i10.AsyncPipe } });
+    `, isInline: true, components: [{ type: DayTimeViewItemComponent, selector: "[dayTimeViewItem]", inputs: ["vertical", "isAllDay"] }, { type: HintContainerComponent, selector: "kendo-hint-container" }, { type: ResizeHintComponent, selector: "[kendoResizeHint]", inputs: ["hint", "format"] }], directives: [{ type: i11.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i11.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i11.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: DaySlotDirective, selector: "[daySlot]", inputs: ["start", "end"] }, { type: i11.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: FocusableDirective, selector: "[kendoSchedulerFocusIndex]", inputs: ["kendoSchedulerFocusIndex"] }, { type: TimeSlotDirective, selector: "[timeSlot]", inputs: ["invariantStart", "invariantEnd", "workDayStart", "workDayEnd", "workWeekStart", "workWeekEnd", "date"], exportAs: ["timeSlot"] }], pipes: { "resourceIterator": ResourceIteratorPipe, "kendoDate": i1$3.DatePipe, "async": i11.AsyncPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: MultiDayViewRendererComponent, decorators: [{
             type: Component,
             args: [{
@@ -13347,7 +13422,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                                 <div *ngFor="let itemResource of item.resources; trackBy: itemIndex;"
                                     [ngClass]="getEventClasses(item, itemResource.resources, true)"
                                     [ngStyle]="getEventStyles(item, itemResource, true)"
+                                    role="button"
                                     [kendoSchedulerFocusIndex]="itemResource.leafIdx"
+                                    [id]="item.elementId + '_' + itemResource.leafIdx"
                                      dayTimeViewItem
                                         [isAllDay]="true"
                                         [editable]="editable"
@@ -13473,7 +13550,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                         <div *ngFor="let itemResource of item.resources; trackBy: itemIndex;"
                             [ngClass]="getEventClasses(item, itemResource.resources)"
                             [ngStyle]="getEventStyles(item, itemResource)"
+                            role="button"
                             [kendoSchedulerFocusIndex]="itemResource.leafIdx"
+                            [id]="item.elementId + '_' + itemResource.leafIdx"
                             dayTimeViewItem
                                 [editable]="editable"
                                 [vertical]="true"
@@ -13490,7 +13569,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                             <div *ngFor="let itemResource of item.resources; trackBy: itemIndex;"
                                 [ngClass]="getEventClasses(item, itemResource.resources, true)"
                                 [ngStyle]="getEventStyles(item, itemResource, true)"
+                                role="button"
                                 [kendoSchedulerFocusIndex]="itemResource.leafIdx"
+                                [id]="item.elementId + '_' + itemResource.leafIdx"
                                 dayTimeViewItem
                                     [isAllDay]="true"
                                     [editable]="editable"
@@ -13507,6 +13588,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                         <ng-template>
                             <div *ngIf="dragHints.length && (!allDayDragHint || verticalResources.length)"
                                 class="k-event-drag-hint"
+                                role="button"
                                 dayTimeViewItem
                                     [isAllDay]="allDayDragHint"
                                     [ngStyle]="dragHints[0].style"
@@ -13532,7 +13614,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         </div>
     `
                 }]
-        }], ctorParameters: function () { return [{ type: i1$1.LocalizationService }, { type: ViewContextService }, { type: ViewStateService }, { type: i1$4.IntlService }, { type: DayTimeSlotService }, { type: i0.NgZone }, { type: i0.Renderer2 }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: PDFService }]; }, propDecorators: { name: [{
+        }], ctorParameters: function () { return [{ type: i2.LocalizationService }, { type: ViewContextService }, { type: ViewStateService }, { type: i1$3.IntlService }, { type: DayTimeSlotService }, { type: i0.NgZone }, { type: i0.Renderer2 }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: PDFService }, { type: FocusService }]; }, propDecorators: { name: [{
                 type: Input
             }], slotFill: [{
                 type: Input
@@ -13598,7 +13680,7 @@ class DayViewComponent extends MultiDayViewBase {
         return this._selectedShortDateFormat;
     }
 }
-DayViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DayViewComponent, deps: [{ token: i1$1.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: ViewContextService }, { token: ViewStateService }], target: i0.ɵɵFactoryTarget.Component });
+DayViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DayViewComponent, deps: [{ token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: ViewContextService }, { token: ViewStateService }], target: i0.ɵɵFactoryTarget.Component });
 DayViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: DayViewComponent, selector: "kendo-scheduler-day-view", inputs: { selectedDateFormat: "selectedDateFormat", selectedShortDateFormat: "selectedShortDateFormat" }, providers: [{
             provide: SchedulerView,
             useExisting: forwardRef(() => DayViewComponent)
@@ -13682,7 +13764,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         </ng-template>
     `
                 }]
-        }], ctorParameters: function () { return [{ type: i1$1.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: ViewContextService }, { type: ViewStateService }]; }, propDecorators: { selectedDateFormat: [{
+        }], ctorParameters: function () { return [{ type: i2.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: ViewContextService }, { type: ViewStateService }]; }, propDecorators: { selectedDateFormat: [{
                 type: Input
             }], selectedShortDateFormat: [{
                 type: Input
@@ -13753,7 +13835,7 @@ class MultiDayViewComponent extends DayViewComponent {
         return this.numberOfDays === 1 ? '{0:d}' : '{0:d} - {1:d}';
     }
 }
-MultiDayViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: MultiDayViewComponent, deps: [{ token: i1$1.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: ViewContextService }, { token: ViewStateService }], target: i0.ɵɵFactoryTarget.Component });
+MultiDayViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: MultiDayViewComponent, deps: [{ token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: ViewContextService }, { token: ViewStateService }], target: i0.ɵɵFactoryTarget.Component });
 MultiDayViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: MultiDayViewComponent, selector: "kendo-scheduler-multi-day-view", inputs: { selectedDateFormat: "selectedDateFormat", selectedShortDateFormat: "selectedShortDateFormat", numberOfDays: "numberOfDays" }, providers: [{
             provide: SchedulerView,
             useExisting: forwardRef(() => MultiDayViewComponent)
@@ -13841,7 +13923,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         </ng-template>
     `
                 }]
-        }], ctorParameters: function () { return [{ type: i1$1.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: ViewContextService }, { type: ViewStateService }]; }, propDecorators: { selectedDateFormat: [{
+        }], ctorParameters: function () { return [{ type: i2.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: ViewContextService }, { type: ViewStateService }]; }, propDecorators: { selectedDateFormat: [{
                 type: Input
             }], selectedShortDateFormat: [{
                 type: Input
@@ -13891,7 +13973,7 @@ class WeekViewComponent extends MultiDayViewBase {
         return firstDayInWeek(getDate(selectedDate), this.viewWeekStart);
     }
 }
-WeekViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: WeekViewComponent, deps: [{ token: i1$4.IntlService }, { token: i1$1.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: ViewContextService }, { token: ViewStateService }], target: i0.ɵɵFactoryTarget.Component });
+WeekViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: WeekViewComponent, deps: [{ token: i1$3.IntlService }, { token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: ViewContextService }, { token: ViewStateService }], target: i0.ɵɵFactoryTarget.Component });
 WeekViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: WeekViewComponent, selector: "kendo-scheduler-week-view", inputs: { selectedDateFormat: "selectedDateFormat", selectedShortDateFormat: "selectedShortDateFormat" }, providers: [{
             provide: SchedulerView,
             useExisting: forwardRef(() => WeekViewComponent)
@@ -13981,7 +14063,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         </ng-template>
     `
                 }]
-        }], ctorParameters: function () { return [{ type: i1$4.IntlService }, { type: i1$1.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: ViewContextService }, { type: ViewStateService }]; }, propDecorators: { selectedDateFormat: [{
+        }], ctorParameters: function () { return [{ type: i1$3.IntlService }, { type: i2.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: ViewContextService }, { type: ViewStateService }]; }, propDecorators: { selectedDateFormat: [{
                 type: Input
             }], selectedShortDateFormat: [{
                 type: Input
@@ -14040,7 +14122,7 @@ class WorkWeekViewComponent extends WeekViewComponent {
         return getDate(addDays(date, DAYS_IN_WEEK * count));
     }
 }
-WorkWeekViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: WorkWeekViewComponent, deps: [{ token: i1$4.IntlService }, { token: i1$1.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: ViewContextService }, { token: ViewStateService }], target: i0.ɵɵFactoryTarget.Component });
+WorkWeekViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: WorkWeekViewComponent, deps: [{ token: i1$3.IntlService }, { token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: ViewContextService }, { token: ViewStateService }], target: i0.ɵɵFactoryTarget.Component });
 WorkWeekViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: WorkWeekViewComponent, selector: "kendo-scheduler-work-week-view", providers: [{
             provide: SchedulerView,
             useExisting: forwardRef(() => WorkWeekViewComponent)
@@ -14132,7 +14214,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         </ng-template>
     `
                 }]
-        }], ctorParameters: function () { return [{ type: i1$4.IntlService }, { type: i1$1.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: ViewContextService }, { type: ViewStateService }]; } });
+        }], ctorParameters: function () { return [{ type: i1$3.IntlService }, { type: i2.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: ViewContextService }, { type: ViewStateService }]; } });
 
 const DIRECTIVES = [TimeSlotDirective, DaySlotDirective, DayTimeViewItemComponent];
 /**
@@ -14273,8 +14355,8 @@ const createTasks = (periodStart, periodEnd, items) => {
  * @hidden
  */
 class TimelineMultiDayViewComponent extends DayTimeViewComponent {
-    constructor(localization, changeDetector, viewContext, viewState, intl, slotService, zone, renderer, element, pdfService) {
-        super(changeDetector, viewContext, viewState, intl, slotService, zone, renderer, element, pdfService, localization);
+    constructor(localization, changeDetector, viewContext, viewState, intl, slotService, zone, renderer, element, pdfService, focusService) {
+        super(changeDetector, viewContext, viewState, intl, slotService, zone, renderer, element, pdfService, localization, focusService);
         this.name = 'timeline';
         this.columnWidth = 100;
         this.viewName = 'timeline';
@@ -14362,7 +14444,7 @@ class TimelineMultiDayViewComponent extends DayTimeViewComponent {
         return this.headerWrap.nativeElement.querySelector('tr:last-child').offsetTop;
     }
 }
-TimelineMultiDayViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TimelineMultiDayViewComponent, deps: [{ token: i1$1.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: ViewContextService }, { token: ViewStateService }, { token: i1$4.IntlService }, { token: DayTimeSlotService }, { token: i0.NgZone }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: PDFService }], target: i0.ɵɵFactoryTarget.Component });
+TimelineMultiDayViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TimelineMultiDayViewComponent, deps: [{ token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: ViewContextService }, { token: ViewStateService }, { token: i1$3.IntlService }, { token: DayTimeSlotService }, { token: i0.NgZone }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: PDFService }, { token: FocusService }], target: i0.ɵɵFactoryTarget.Component });
 TimelineMultiDayViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: TimelineMultiDayViewComponent, selector: "timeline-multi-day-view", inputs: { name: "name", columnWidth: "columnWidth", viewName: "viewName" }, providers: [
         DayTimeSlotService
     ], viewQueries: [{ propertyName: "verticalResourceRows", predicate: ["verticalResourceRows"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: `
@@ -14488,7 +14570,9 @@ TimelineMultiDayViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "1
                         <div *ngFor="let itemResource of item.resources; trackBy: itemIndex;"
                             [ngClass]="getEventClasses(item, itemResource.resources)"
                             [ngStyle]="getEventStyles(item, itemResource)"
+                            role="button"
                             [kendoSchedulerFocusIndex]="itemResource.leafIdx"
+                            [id]="item.elementId + '_' + itemResource.leafIdx"
                             dayTimeViewItem
                                 [editable]="editable"
                                 [item]="item"
@@ -14522,7 +14606,7 @@ TimelineMultiDayViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "1
                 </div>
             </div>
         </div>
-    `, isInline: true, components: [{ type: DayTimeViewItemComponent, selector: "[dayTimeViewItem]", inputs: ["vertical", "isAllDay"] }, { type: HintContainerComponent, selector: "kendo-hint-container" }, { type: ResizeHintComponent, selector: "[kendoResizeHint]", inputs: ["hint", "format"] }], directives: [{ type: i10.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i10.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i10.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i10.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: TimeSlotDirective, selector: "[timeSlot]", inputs: ["invariantStart", "invariantEnd", "workDayStart", "workDayEnd", "workWeekStart", "workWeekEnd", "date"], exportAs: ["timeSlot"] }, { type: FocusableDirective, selector: "[kendoSchedulerFocusIndex]", inputs: ["kendoSchedulerFocusIndex"] }], pipes: { "resourceIterator": ResourceIteratorPipe, "repeat": RepeatPipe, "kendoDate": i1$4.DatePipe, "async": i10.AsyncPipe } });
+    `, isInline: true, components: [{ type: DayTimeViewItemComponent, selector: "[dayTimeViewItem]", inputs: ["vertical", "isAllDay"] }, { type: HintContainerComponent, selector: "kendo-hint-container" }, { type: ResizeHintComponent, selector: "[kendoResizeHint]", inputs: ["hint", "format"] }], directives: [{ type: i11.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i11.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i11.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i11.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: TimeSlotDirective, selector: "[timeSlot]", inputs: ["invariantStart", "invariantEnd", "workDayStart", "workDayEnd", "workWeekStart", "workWeekEnd", "date"], exportAs: ["timeSlot"] }, { type: FocusableDirective, selector: "[kendoSchedulerFocusIndex]", inputs: ["kendoSchedulerFocusIndex"] }], pipes: { "resourceIterator": ResourceIteratorPipe, "repeat": RepeatPipe, "kendoDate": i1$3.DatePipe, "async": i11.AsyncPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TimelineMultiDayViewComponent, decorators: [{
             type: Component,
             args: [{
@@ -14654,7 +14738,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                         <div *ngFor="let itemResource of item.resources; trackBy: itemIndex;"
                             [ngClass]="getEventClasses(item, itemResource.resources)"
                             [ngStyle]="getEventStyles(item, itemResource)"
+                            role="button"
                             [kendoSchedulerFocusIndex]="itemResource.leafIdx"
+                            [id]="item.elementId + '_' + itemResource.leafIdx"
                             dayTimeViewItem
                                 [editable]="editable"
                                 [item]="item"
@@ -14690,7 +14776,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         </div>
     `
                 }]
-        }], ctorParameters: function () { return [{ type: i1$1.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: ViewContextService }, { type: ViewStateService }, { type: i1$4.IntlService }, { type: DayTimeSlotService }, { type: i0.NgZone }, { type: i0.Renderer2 }, { type: i0.ElementRef }, { type: PDFService }]; }, propDecorators: { name: [{
+        }], ctorParameters: function () { return [{ type: i2.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: ViewContextService }, { type: ViewStateService }, { type: i1$3.IntlService }, { type: DayTimeSlotService }, { type: i0.NgZone }, { type: i0.Renderer2 }, { type: i0.ElementRef }, { type: PDFService }, { type: FocusService }]; }, propDecorators: { name: [{
                 type: Input
             }], columnWidth: [{
                 type: Input
@@ -14716,11 +14802,11 @@ class TimelineBase extends DayTimeViewBase {
         return this.optionValue(COLUMN_WIDTH);
     }
 }
-TimelineBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TimelineBase, deps: [{ token: i1$1.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: ViewContextService }, { token: ViewStateService }], target: i0.ɵɵFactoryTarget.Directive });
+TimelineBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TimelineBase, deps: [{ token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: ViewContextService }, { token: ViewStateService }], target: i0.ɵɵFactoryTarget.Directive });
 TimelineBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: TimelineBase, inputs: { columnWidth: "columnWidth" }, usesInheritance: true, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TimelineBase, decorators: [{
             type: Directive
-        }], ctorParameters: function () { return [{ type: i1$1.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: ViewContextService }, { type: ViewStateService }]; }, propDecorators: { columnWidth: [{
+        }], ctorParameters: function () { return [{ type: i2.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: ViewContextService }, { type: ViewStateService }]; }, propDecorators: { columnWidth: [{
                 type: Input
             }] } });
 
@@ -14756,7 +14842,7 @@ class TimelineViewComponent extends TimelineBase {
         return this.localization.get('timelineViewTitle');
     }
 }
-TimelineViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TimelineViewComponent, deps: [{ token: i1$1.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: ViewContextService }, { token: ViewStateService }], target: i0.ɵɵFactoryTarget.Component });
+TimelineViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TimelineViewComponent, deps: [{ token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: ViewContextService }, { token: ViewStateService }], target: i0.ɵɵFactoryTarget.Component });
 TimelineViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: TimelineViewComponent, selector: "kendo-scheduler-timeline-view", inputs: { selectedDateFormat: "selectedDateFormat", selectedShortDateFormat: "selectedShortDateFormat" }, providers: [{
             provide: SchedulerView,
             useExisting: forwardRef(() => TimelineViewComponent)
@@ -14832,7 +14918,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         </ng-template>
     `
                 }]
-        }], ctorParameters: function () { return [{ type: i1$1.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: ViewContextService }, { type: ViewStateService }]; }, propDecorators: { selectedDateFormat: [{
+        }], ctorParameters: function () { return [{ type: i2.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: ViewContextService }, { type: ViewStateService }]; }, propDecorators: { selectedDateFormat: [{
                 type: Input
             }], selectedShortDateFormat: [{
                 type: Input
@@ -14878,7 +14964,7 @@ class TimelineWeekViewComponent extends TimelineBase {
         return this.localization.get('timelineWeekViewTitle');
     }
 }
-TimelineWeekViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TimelineWeekViewComponent, deps: [{ token: i1$4.IntlService }, { token: i1$1.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: ViewContextService }, { token: ViewStateService }], target: i0.ɵɵFactoryTarget.Component });
+TimelineWeekViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TimelineWeekViewComponent, deps: [{ token: i1$3.IntlService }, { token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: ViewContextService }, { token: ViewStateService }], target: i0.ɵɵFactoryTarget.Component });
 TimelineWeekViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: TimelineWeekViewComponent, selector: "kendo-scheduler-timeline-week-view", inputs: { selectedDateFormat: "selectedDateFormat", selectedShortDateFormat: "selectedShortDateFormat" }, providers: [{
             provide: SchedulerView,
             useExisting: forwardRef(() => TimelineWeekViewComponent)
@@ -14962,7 +15048,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         </ng-template>
     `
                 }]
-        }], ctorParameters: function () { return [{ type: i1$4.IntlService }, { type: i1$1.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: ViewContextService }, { type: ViewStateService }]; }, propDecorators: { selectedDateFormat: [{
+        }], ctorParameters: function () { return [{ type: i1$3.IntlService }, { type: i2.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: ViewContextService }, { type: ViewStateService }]; }, propDecorators: { selectedDateFormat: [{
                 type: Input
             }], selectedShortDateFormat: [{
                 type: Input
@@ -15018,7 +15104,7 @@ class TimelineMonthViewComponent extends TimelineBase {
         return this.localization.get('timelineMonthViewTitle');
     }
 }
-TimelineMonthViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TimelineMonthViewComponent, deps: [{ token: i1$1.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: ViewContextService }, { token: ViewStateService }], target: i0.ɵɵFactoryTarget.Component });
+TimelineMonthViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TimelineMonthViewComponent, deps: [{ token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: ViewContextService }, { token: ViewStateService }], target: i0.ɵɵFactoryTarget.Component });
 TimelineMonthViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: TimelineMonthViewComponent, selector: "kendo-scheduler-timeline-month-view", inputs: { selectedDateFormat: "selectedDateFormat", selectedShortDateFormat: "selectedShortDateFormat" }, providers: [{
             provide: SchedulerView,
             useExisting: forwardRef(() => TimelineMonthViewComponent)
@@ -15102,7 +15188,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         </ng-template>
     `
                 }]
-        }], ctorParameters: function () { return [{ type: i1$1.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: ViewContextService }, { type: ViewStateService }]; }, propDecorators: { selectedDateFormat: [{
+        }], ctorParameters: function () { return [{ type: i2.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: ViewContextService }, { type: ViewStateService }]; }, propDecorators: { selectedDateFormat: [{
                 type: Input
             }], selectedShortDateFormat: [{
                 type: Input
@@ -15631,7 +15717,7 @@ class RecurrenceEditorCustomMessagesComponent extends Messages$1 {
         return true;
     }
 }
-RecurrenceEditorCustomMessagesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: RecurrenceEditorCustomMessagesComponent, deps: [{ token: i1$1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
+RecurrenceEditorCustomMessagesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: RecurrenceEditorCustomMessagesComponent, deps: [{ token: i2.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
 RecurrenceEditorCustomMessagesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: RecurrenceEditorCustomMessagesComponent, selector: "kendo-recurrence-editor-messages", providers: [
         {
             provide: Messages$1,
@@ -15650,7 +15736,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                     selector: 'kendo-recurrence-editor-messages',
                     template: ``
                 }]
-        }], ctorParameters: function () { return [{ type: i1$1.LocalizationService }]; } });
+        }], ctorParameters: function () { return [{ type: i2.LocalizationService }]; } });
 
 const isContentWrapper = element => hasClasses(element, 'k-scheduler-content');
 /**
@@ -16578,14 +16664,14 @@ class PDFCommandDirective extends Button {
         this.icon = 'pdf';
     }
 }
-PDFCommandDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: PDFCommandDirective, deps: [{ token: PDFService }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1$1.LocalizationService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive });
+PDFCommandDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: PDFCommandDirective, deps: [{ token: PDFService }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i2.LocalizationService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive });
 PDFCommandDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: PDFCommandDirective, selector: "[kendoSchedulerPDFCommand]", host: { listeners: { "click": "onClick($event)" } }, usesInheritance: true, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: PDFCommandDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kendoSchedulerPDFCommand]'
                 }]
-        }], ctorParameters: function () { return [{ type: PDFService }, { type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i1$1.LocalizationService }, { type: i0.NgZone }]; }, propDecorators: { onClick: [{
+        }], ctorParameters: function () { return [{ type: PDFService }, { type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i2.LocalizationService }, { type: i0.NgZone }]; }, propDecorators: { onClick: [{
                 type: HostListener,
                 args: ['click', ['$event']]
             }] } });