@progress/kendo-angular-scheduler 11.0.0-develop.100 → 11.0.0-develop.102

package/esm2020/editing/edit-dialog.component.mjs

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

package/esm2020/package-metadata.mjs

@@ -9,7 +9,7 @@ export const packageMetadata = {
     name: '@progress/kendo-angular-scheduler',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1673469366,
+    publishDate: 1673519279,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };

package/esm2020/toolbar/navigation.component.mjs

@@ -214,7 +214,7 @@ ToolbarNavigationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0
             <button kendoButton
                 (click)="prevClick()"
                 class="k-nav-prev"
-                icon="arrow-60-left"
+                icon="caret-alt-left"
                 [svgIcon]="svgIcon('caretAltLeftIcon')"
                 [attr.title]="previousText"
                 [attr.aria-label]="previousText"
@@ -225,7 +225,7 @@ ToolbarNavigationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0
                 (click)="nextClick()"
                 type="button"
                 class="k-nav-next"
-                icon="arrow-60-right"
+                icon="caret-alt-right"
                 [svgIcon]="svgIcon('caretAltRightIcon')"
                 [attr.title]="nextText"
                 [attr.aria-label]="nextText"
@@ -285,7 +285,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
             <button kendoButton
                 (click)="prevClick()"
                 class="k-nav-prev"
-                icon="arrow-60-left"
+                icon="caret-alt-left"
                 [svgIcon]="svgIcon('caretAltLeftIcon')"
                 [attr.title]="previousText"
                 [attr.aria-label]="previousText"
@@ -296,7 +296,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                 (click)="nextClick()"
                 type="button"
                 class="k-nav-next"
-                icon="arrow-60-right"
+                icon="caret-alt-right"
                 [svgIcon]="svgIcon('caretAltRightIcon')"
                 [attr.title]="nextText"
                 [attr.aria-label]="nextText"

package/esm2020/views/agenda/agenda-task-item.component.mjs

@@ -5,10 +5,12 @@
 import { Component, Input, ChangeDetectionStrategy, TemplateRef, HostBinding, Inject, LOCALE_ID } from '@angular/core';
 import { LocalizationService } from '@progress/kendo-angular-l10n';
 import { toLocalDate } from '@progress/kendo-date-math';
+import { arrowRotateCwIcon, arrowsNoRepeatIcon, xIcon } from '@progress/kendo-svg-icons';
 import { isRecurrence, isRecurrenceException, formatEventTime } from '../utils';
 import * as i0 from "@angular/core";
 import * as i1 from "@progress/kendo-angular-l10n";
-import * as i2 from "@angular/common";
+import * as i2 from "@progress/kendo-angular-icons";
+import * as i3 from "@angular/common";
 /**
  * @hidden
  */
@@ -16,6 +18,9 @@ export class AgendaTaskItemComponent {
     constructor(localization, localeId) {
         this.localization = localization;
         this.localeId = localeId;
+        this.arrowRotateCWIcon = arrowRotateCwIcon;
+        this.arrowsNoRepeatIcon = arrowsNoRepeatIcon;
+        this.xIcon = xIcon;
     }
     get eventTitle() {
         const start = toLocalDate(this.item.start);
@@ -43,8 +48,9 @@ AgendaTaskItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0",
 AgendaTaskItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", 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>
-            <span class="k-icon k-i-arrow-rotate-cw" *ngIf="isRecurrence"></span>
-            <span class="k-icon k-i-arrows-no-repeat" *ngIf="isRecurrenceException"></span>
+            <kendo-icon-wrapper *ngIf="isRecurrence" name="arrow-rotate-cw" [svgIcon]="arrowRotateCWIcon"></kendo-icon-wrapper>
+
+            <kendo-icon-wrapper *ngIf="isRecurrenceException" name="arrows-no-repeat" [svgIcon]="arrowsNoRepeatIcon"></kendo-icon-wrapper>
             <ng-container *ngIf="!eventTemplate">
                 {{item?.title }}
             </ng-container>
@@ -53,10 +59,10 @@ AgendaTaskItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0"
             </ng-container>
 
             <span *ngIf="removable" class="k-link k-event-delete" aria-hidden="true" [attr.title]="deleteMessage">
-                <span class="k-icon k-i-x"></span>
+                <kendo-icon-wrapper name="x" [svgIcon]="xIcon"></kendo-icon-wrapper>
             </span>
         </div>
-    `, isInline: true, directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    `, isInline: true, components: [{ type: i2.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass"], exportAs: ["kendoIconWrapper"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: AgendaTaskItemComponent, decorators: [{
             type: Component,
             args: [{
@@ -66,8 +72,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                     template: `
         <div class="k-task" [title]="item.title">
             <span class="k-scheduler-mark" *ngIf="eventColor" [style.background-color]="eventColor"></span>
-            <span class="k-icon k-i-arrow-rotate-cw" *ngIf="isRecurrence"></span>
-            <span class="k-icon k-i-arrows-no-repeat" *ngIf="isRecurrenceException"></span>
+            <kendo-icon-wrapper *ngIf="isRecurrence" name="arrow-rotate-cw" [svgIcon]="arrowRotateCWIcon"></kendo-icon-wrapper>
+
+            <kendo-icon-wrapper *ngIf="isRecurrenceException" name="arrows-no-repeat" [svgIcon]="arrowsNoRepeatIcon"></kendo-icon-wrapper>
             <ng-container *ngIf="!eventTemplate">
                 {{item?.title }}
             </ng-container>
@@ -76,7 +83,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
             </ng-container>
 
             <span *ngIf="removable" class="k-link k-event-delete" aria-hidden="true" [attr.title]="deleteMessage">
-                <span class="k-icon k-i-x"></span>
+                <kendo-icon-wrapper name="x" [svgIcon]="xIcon"></kendo-icon-wrapper>
             </span>
         </div>
     `

package/esm2020/views/agenda/agenda-view-list.component.mjs

@@ -6,14 +6,16 @@ import { Component, HostBinding, Input, TemplateRef } from '@angular/core';
 import { IntlService } from '@progress/kendo-angular-intl';
 import { LocalizationService } from '@progress/kendo-angular-l10n';
 import { toLocalDate } from '@progress/kendo-date-math';
+import { caretAltLeftIcon, caretAltRightIcon } from '@progress/kendo-svg-icons';
 import { convertNgClassBindings } from '../utils';
 import * as i0 from "@angular/core";
 import * as i1 from "@progress/kendo-angular-intl";
 import * as i2 from "@progress/kendo-angular-l10n";
 import * as i3 from "./agenda-header-item.component";
-import * as i4 from "./agenda-task-item.component";
-import * as i5 from "@angular/common";
-import * as i6 from "../../navigation/focusable.directive";
+import * as i4 from "@progress/kendo-angular-icons";
+import * as i5 from "./agenda-task-item.component";
+import * as i6 from "@angular/common";
+import * as i7 from "../../navigation/focusable.directive";
 /**
  * @hidden
  */
@@ -21,6 +23,8 @@ export class AgendaListComponent {
     constructor(intlService, localization) {
         this.intlService = intlService;
         this.localization = localization;
+        this.caretAltLeftIcon = caretAltLeftIcon;
+        this.caretAltRightIcon = caretAltRightIcon;
         this.classes = true;
     }
     extractDataItem(item) {
@@ -88,9 +92,20 @@ AgendaListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ve
                         </td>
                         <td class="k-scheduler-timecolumn" role="gridcell">
                             <div *ngIf="!agendaTimeTemplate">
-                                <span class="k-icon k-i-caret-alt-left" *ngIf="extractDataItem(item).tail"></span>
+                                <kendo-icon-wrapper
+                                    *ngIf="extractDataItem(item).tail"
+                                    name="caret-alt-left"
+                                    [svgIcon]="caretAltLeftIcon"
+                                    >
+                                </kendo-icon-wrapper>
+
                                 {{ formatTime(extractDataItem(item)) }}
-                                <span class="k-icon k-i-caret-alt-right" *ngIf="extractDataItem(item).head"></span>
+                                <kendo-icon-wrapper
+                                    *ngIf="extractDataItem(item).head"
+                                    name="caret-alt-right"
+                                    [svgIcon]="caretAltRightIcon"
+                                    >
+                                </kendo-icon-wrapper>
                             </div>
                             <ng-container *ngIf="agendaTimeTemplate" [ngTemplateOutlet]="agendaTimeTemplate"
                                 [ngTemplateOutletContext]="extractDataItem(item)">
@@ -108,7 +123,7 @@ AgendaListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ve
                 </ng-container>
             </tbody>
         </table>
-    `, isInline: true, components: [{ type: i3.AgendaHeaderItemComponent, selector: "[kendoSchedulerAgendaHeaderItem]", inputs: ["kendoSchedulerAgendaHeaderItem", "agendaDateTemplate"] }, { type: i4.AgendaTaskItemComponent, selector: "[kendoSchedulerAgendaTaskItem]", inputs: ["kendoSchedulerAgendaTaskItem", "color", "eventTemplate", "editable"] }], directives: [{ type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i6.FocusableDirective, selector: "[kendoSchedulerFocusIndex]", inputs: ["kendoSchedulerFocusIndex", "containerType"] }] });
+    `, isInline: true, components: [{ type: i3.AgendaHeaderItemComponent, selector: "[kendoSchedulerAgendaHeaderItem]", inputs: ["kendoSchedulerAgendaHeaderItem", "agendaDateTemplate"] }, { type: i4.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass"], exportAs: ["kendoIconWrapper"] }, { type: i5.AgendaTaskItemComponent, selector: "[kendoSchedulerAgendaTaskItem]", inputs: ["kendoSchedulerAgendaTaskItem", "color", "eventTemplate", "editable"] }], directives: [{ type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i6.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i6.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i7.FocusableDirective, selector: "[kendoSchedulerFocusIndex]", inputs: ["kendoSchedulerFocusIndex", "containerType"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: AgendaListComponent, decorators: [{
             type: Component,
             args: [{
@@ -130,9 +145,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                         </td>
                         <td class="k-scheduler-timecolumn" role="gridcell">
                             <div *ngIf="!agendaTimeTemplate">
-                                <span class="k-icon k-i-caret-alt-left" *ngIf="extractDataItem(item).tail"></span>
+                                <kendo-icon-wrapper
+                                    *ngIf="extractDataItem(item).tail"
+                                    name="caret-alt-left"
+                                    [svgIcon]="caretAltLeftIcon"
+                                    >
+                                </kendo-icon-wrapper>
+
                                 {{ formatTime(extractDataItem(item)) }}
-                                <span class="k-icon k-i-caret-alt-right" *ngIf="extractDataItem(item).head"></span>
+                                <kendo-icon-wrapper
+                                    *ngIf="extractDataItem(item).head"
+                                    name="caret-alt-right"
+                                    [svgIcon]="caretAltRightIcon"
+                                    >
+                                </kendo-icon-wrapper>
                             </div>
                             <ng-container *ngIf="agendaTimeTemplate" [ngTemplateOutlet]="agendaTimeTemplate"
                                 [ngTemplateOutletContext]="extractDataItem(item)">

package/esm2020/views/agenda/agenda-view.module.mjs

@@ -12,6 +12,7 @@ import { AgendaListComponent } from './agenda-view-list.component';
 import { AgendaViewComponent } from './agenda-view.component';
 import { AgendaViewInternalComponent } from './agenda-view-internal.component';
 import { SharedModule } from '../../shared.module';
+import { IconsModule } from '@progress/kendo-angular-icons';
 import * as i0 from "@angular/core";
 const COMPONENTS = [
     AgendaHeaderComponent,
@@ -32,12 +33,12 @@ AgendaViewModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", versio
         AgendaListComponent,
         AgendaTaskItemComponent,
         AgendaViewComponent,
-        AgendaViewInternalComponent], imports: [CommonModule, IntlModule, SharedModule], exports: [AgendaViewComponent] });
-AgendaViewModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: AgendaViewModule, imports: [[CommonModule, IntlModule, SharedModule]] });
+        AgendaViewInternalComponent], imports: [CommonModule, IntlModule, SharedModule, IconsModule], exports: [AgendaViewComponent] });
+AgendaViewModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: AgendaViewModule, imports: [[CommonModule, IntlModule, SharedModule, IconsModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: AgendaViewModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [CommonModule, IntlModule, SharedModule],
+                    imports: [CommonModule, IntlModule, SharedModule, IconsModule],
                     exports: [AgendaViewComponent],
                     declarations: [COMPONENTS]
                 }]

package/esm2020/views/common/view-footer.component.mjs

@@ -36,14 +36,15 @@ ViewFooterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", vers
 ViewFooterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: ViewFooterComponent, selector: "[viewFooter]", inputs: { items: "items" }, outputs: { itemClick: "itemClick" }, host: { properties: { "class.k-scheduler-footer": "this.hostClasses", "class.k-toolbar": "this.hostClasses", "style.justify-content": "this.inlineJustifyContentStyle" } }, ngImport: i0, template: `
         <span class="k-scheduler-navigation">
             <button
+                *ngFor="let item of items"
                 type="button"
                 kendoButton
-                *ngFor="let item of items"
+                [icon]="item.fontIcon"
+                [svgIcon]="item.svgIcon"
                 [ngClass]="item.cssClass"
                 (click)="onItemClick($event, item)"
                 [kendoSchedulerFocusIndex]="0"
                 containerType='footer'>
-                <span class="k-button-icon k-icon" [ngClass]="item.iconClass"></span>
                 <span class="k-button-text">{{ item.text }}</span>
             </button>
         </span>
@@ -56,14 +57,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                     template: `
         <span class="k-scheduler-navigation">
             <button
+                *ngFor="let item of items"
                 type="button"
                 kendoButton
-                *ngFor="let item of items"
+                [icon]="item.fontIcon"
+                [svgIcon]="item.svgIcon"
                 [ngClass]="item.cssClass"
                 (click)="onItemClick($event, item)"
                 [kendoSchedulerFocusIndex]="0"
                 containerType='footer'>
-                <span class="k-button-icon k-icon" [ngClass]="item.iconClass"></span>
                 <span class="k-button-text">{{ item.text }}</span>
             </button>
         </span>

package/esm2020/views/common/views-shared.module.mjs

@@ -13,6 +13,7 @@ import { HintContainerComponent } from './hint-container.component';
 import { ResizeHintComponent } from './resize-hint.component';
 import { SharedModule } from '../../shared.module';
 import { ButtonsModule } from '@progress/kendo-angular-buttons';
+import { IconsModule } from '@progress/kendo-angular-icons';
 import * as i0 from "@angular/core";
 const DECLARATIONS = [
     ViewFooterComponent,
@@ -33,26 +34,29 @@ ViewsSharedModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", versi
         RepeatPipe,
         ResourceIteratorPipe,
         HintContainerComponent,
-        ResizeHintComponent], imports: [CommonModule, IntlModule, SharedModule, ButtonsModule], exports: [ViewFooterComponent,
+        ResizeHintComponent], imports: [CommonModule, IntlModule, SharedModule, ButtonsModule, IconsModule], exports: [ViewFooterComponent,
         WorkHoursFooterDirective,
         RepeatPipe,
         ResourceIteratorPipe,
         HintContainerComponent,
         ResizeHintComponent, IntlModule,
         CommonModule,
-        SharedModule] });
-ViewsSharedModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ViewsSharedModule, imports: [[CommonModule, IntlModule, SharedModule, ButtonsModule], IntlModule,
+        SharedModule,
+        IconsModule] });
+ViewsSharedModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ViewsSharedModule, imports: [[CommonModule, IntlModule, SharedModule, ButtonsModule, IconsModule], IntlModule,
         CommonModule,
-        SharedModule] });
+        SharedModule,
+        IconsModule] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ViewsSharedModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [CommonModule, IntlModule, SharedModule, ButtonsModule],
+                    imports: [CommonModule, IntlModule, SharedModule, ButtonsModule, IconsModule],
                     exports: [
                         DECLARATIONS,
                         IntlModule,
                         CommonModule,
-                        SharedModule
+                        SharedModule,
+                        IconsModule
                     ],
                     declarations: [
                         DECLARATIONS

package/esm2020/views/common/work-hours-footer.directive.mjs

@@ -5,6 +5,7 @@
 import { Directive, Input } from '@angular/core';
 import { ViewFooterComponent } from './view-footer.component';
 import { LocalizationService } from '@progress/kendo-angular-l10n';
+import { clockIcon } from '@progress/kendo-svg-icons';
 import * as i0 from "@angular/core";
 import * as i1 from "./view-footer.component";
 import * as i2 from "@progress/kendo-angular-l10n";
@@ -16,7 +17,7 @@ export class WorkHoursFooterDirective {
         this.footer = footer;
         this.localization = localization;
         this.showWorkHours = false;
-        this.footerItems = [{ cssClass: 'k-scheduler-fullday', iconClass: 'k-i-clock', text: '' }];
+        this.footerItems = [{ cssClass: 'k-scheduler-fullday', fontIcon: 'clock', svgIcon: clockIcon, text: '' }];
     }
     ngOnInit() {
         this.toggleWorkHours();

package/esm2020/views/day-time/day-time-view-item.component.mjs

@@ -6,6 +6,7 @@ import { Component, ElementRef, Input, Renderer2, Inject, LOCALE_ID } from '@ang
 import { IntlService } from '@progress/kendo-angular-intl';
 import { LocalizationService } from '@progress/kendo-angular-l10n';
 import { toLocalDate } from '@progress/kendo-date-math';
+import { arrowRotateCwIcon, arrowsNoRepeatIcon, caretAltDownIcon, caretAltLeftIcon, caretAltRightIcon, caretAltUpIcon, xIcon } from '@progress/kendo-svg-icons';
 import { FocusService } from '../../navigation';
 import { DayTimeSlotService } from '../day-time/day-time-slot.service';
 import { BaseViewItem } from '../view-items/base-view-item';
@@ -14,7 +15,8 @@ import * as i1 from "@progress/kendo-angular-intl";
 import * as i2 from "../day-time/day-time-slot.service";
 import * as i3 from "@progress/kendo-angular-l10n";
 import * as i4 from "../../navigation";
-import * as i5 from "@angular/common";
+import * as i5 from "@progress/kendo-angular-icons";
+import * as i6 from "@angular/common";
 /**
  * @hidden
  */
@@ -23,6 +25,13 @@ export class DayTimeViewItemComponent extends BaseViewItem {
         super(slotService, localization, focusService, element, renderer, localeId);
         this.intlService = intlService;
         this.localeId = localeId;
+        this.caretAltLeftIcon = caretAltLeftIcon;
+        this.caretAltRightIcon = caretAltRightIcon;
+        this.caretAltUpIcon = caretAltUpIcon;
+        this.caretAltDownIcon = caretAltDownIcon;
+        this.arrowRotateCwIcon = arrowRotateCwIcon;
+        this.arrowsNoRepeatIcon = arrowsNoRepeatIcon;
+        this.xIcon = xIcon;
     }
     get eventTime() {
         return this.intlService.format('{0:t}–{1:t}', toLocalDate(this.item.startTime), toLocalDate(this.item.endTime));
@@ -31,9 +40,24 @@ export class DayTimeViewItemComponent extends BaseViewItem {
 DayTimeViewItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: DayTimeViewItemComponent, deps: [{ token: i1.IntlService }, { token: i2.DayTimeSlotService }, { token: i3.LocalizationService }, { token: i4.FocusService }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: LOCALE_ID }], target: i0.ɵɵFactoryTarget.Component });
 DayTimeViewItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", 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-caret-alt-left" *ngIf="item.tail && !vertical"></span>
-            <span class="k-icon k-i-arrow-rotate-cw" *ngIf="isRecurrence"></span>
-            <span class="k-icon k-i-arrows-no-repeat" *ngIf="isRecurrenceException"></span>
+            <kendo-icon-wrapper
+                *ngIf="item.tail && !vertical"
+                name="caret-alt-left"
+                [svgIcon]="caretAltLeftIcon"
+                >
+            </kendo-icon-wrapper>
+            <kendo-icon-wrapper
+                *ngIf="isRecurrence"
+                name="arrow-rotate-cw"
+                [svgIcon]="arrowRotateCwIcon"
+                >
+            </kendo-icon-wrapper>
+            <kendo-icon-wrapper
+                *ngIf="isRecurrenceException"
+                name="arrows-no-repeat"
+                [svgIcon]="arrowsNoRepeatIcon"
+                >
+            </kendo-icon-wrapper>
         </span>
         <ng-container *ngIf="eventTemplate" [ngTemplateOutlet]="eventTemplate"
             [ngTemplateOutletContext]="{ $implicit: item.event, event: item.event, resources: resources }">
@@ -45,17 +69,22 @@ DayTimeViewItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0
 
         <span class="k-event-actions">
             <span *ngIf="removable" class="k-link k-event-delete" aria-hidden="true" [attr.title]="deleteMessage">
-                <span class="k-icon k-i-x"></span>
+                <kendo-icon-wrapper name="x" [svgIcon]="xIcon"></kendo-icon-wrapper>
             </span>
-            <span class="k-icon k-i-caret-alt-right" *ngIf="item.head && !vertical"></span>
+            <kendo-icon-wrapper
+                *ngIf="item.head && !vertical"
+                name="caret-alt-right"
+                [svgIcon]="caretAltRightIcon"
+                >
+            </kendo-icon-wrapper>
         </span>
 
         <span class="k-event-top-actions" *ngIf="item.tail && vertical">
-            <span class="k-icon k-i-caret-alt-up"></span>
+            <kendo-icon-wrapper name="caret-alt-up" [svgIcon]="caretAltUpIcon"></kendo-icon-wrapper>
         </span>
 
         <span class="k-event-bottom-actions" *ngIf="item.head && vertical">
-            <span class="k-icon k-i-caret-alt-down"></span>
+            <kendo-icon-wrapper name="caret-alt-down" [svgIcon]="caretAltDownIcon"></kendo-icon-wrapper>
         </span>
 
         <ng-container *ngIf="resizable && vertical">
@@ -67,7 +96,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: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }] });
+    `, isInline: true, components: [{ type: i5.IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass"], exportAs: ["kendoIconWrapper"] }], directives: [{ type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: DayTimeViewItemComponent, decorators: [{
             type: Component,
             args: [{
@@ -75,9 +104,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                     selector: '[dayTimeViewItem]',
                     template: `
         <span class="k-event-actions">
-            <span class="k-icon k-i-caret-alt-left" *ngIf="item.tail && !vertical"></span>
-            <span class="k-icon k-i-arrow-rotate-cw" *ngIf="isRecurrence"></span>
-            <span class="k-icon k-i-arrows-no-repeat" *ngIf="isRecurrenceException"></span>
+            <kendo-icon-wrapper
+                *ngIf="item.tail && !vertical"
+                name="caret-alt-left"
+                [svgIcon]="caretAltLeftIcon"
+                >
+            </kendo-icon-wrapper>
+            <kendo-icon-wrapper
+                *ngIf="isRecurrence"
+                name="arrow-rotate-cw"
+                [svgIcon]="arrowRotateCwIcon"
+                >
+            </kendo-icon-wrapper>
+            <kendo-icon-wrapper
+                *ngIf="isRecurrenceException"
+                name="arrows-no-repeat"
+                [svgIcon]="arrowsNoRepeatIcon"
+                >
+            </kendo-icon-wrapper>
         </span>
         <ng-container *ngIf="eventTemplate" [ngTemplateOutlet]="eventTemplate"
             [ngTemplateOutletContext]="{ $implicit: item.event, event: item.event, resources: resources }">
@@ -89,17 +133,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
 
         <span class="k-event-actions">
             <span *ngIf="removable" class="k-link k-event-delete" aria-hidden="true" [attr.title]="deleteMessage">
-                <span class="k-icon k-i-x"></span>
+                <kendo-icon-wrapper name="x" [svgIcon]="xIcon"></kendo-icon-wrapper>
             </span>
-            <span class="k-icon k-i-caret-alt-right" *ngIf="item.head && !vertical"></span>
+            <kendo-icon-wrapper
+                *ngIf="item.head && !vertical"
+                name="caret-alt-right"
+                [svgIcon]="caretAltRightIcon"
+                >
+            </kendo-icon-wrapper>
         </span>
 
         <span class="k-event-top-actions" *ngIf="item.tail && vertical">
-            <span class="k-icon k-i-caret-alt-up"></span>
+            <kendo-icon-wrapper name="caret-alt-up" [svgIcon]="caretAltUpIcon"></kendo-icon-wrapper>
         </span>
 
         <span class="k-event-bottom-actions" *ngIf="item.head && vertical">
-            <span class="k-icon k-i-caret-alt-down"></span>
+            <kendo-icon-wrapper name="caret-alt-down" [svgIcon]="caretAltDownIcon"></kendo-icon-wrapper>
         </span>
 
         <ng-container *ngIf="resizable && vertical">

package/esm2020/views/day-time/day-time.module.mjs

@@ -8,6 +8,7 @@ import { SharedModule } from '../../shared.module';
 import { TimeSlotDirective, DaySlotDirective } from './event-slot.directive';
 import { DayTimeViewItemComponent } from './day-time-view-item.component';
 import { ViewsSharedModule } from '../common/views-shared.module';
+import { IconsModule } from '@progress/kendo-angular-icons';
 import * as i0 from "@angular/core";
 const DIRECTIVES = [TimeSlotDirective, DaySlotDirective, DayTimeViewItemComponent];
 /**
@@ -16,12 +17,12 @@ const DIRECTIVES = [TimeSlotDirective, DaySlotDirective, DayTimeViewItemComponen
 export class DayTimeModule {
 }
 DayTimeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: DayTimeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DayTimeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: DayTimeModule, declarations: [TimeSlotDirective, DaySlotDirective, DayTimeViewItemComponent], imports: [CommonModule, SharedModule, ViewsSharedModule], exports: [TimeSlotDirective, DaySlotDirective, DayTimeViewItemComponent] });
-DayTimeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: DayTimeModule, imports: [[CommonModule, SharedModule, ViewsSharedModule]] });
+DayTimeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: DayTimeModule, declarations: [TimeSlotDirective, DaySlotDirective, DayTimeViewItemComponent], imports: [CommonModule, SharedModule, ViewsSharedModule, IconsModule], exports: [TimeSlotDirective, DaySlotDirective, DayTimeViewItemComponent] });
+DayTimeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: DayTimeModule, imports: [[CommonModule, SharedModule, ViewsSharedModule, IconsModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: DayTimeModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [CommonModule, SharedModule, ViewsSharedModule],
+                    imports: [CommonModule, SharedModule, ViewsSharedModule, IconsModule],
                     exports: [
                         DIRECTIVES
                     ],