@progress/kendo-angular-dateinputs 21.1.1-develop.2 → 21.2.0-develop.10

package/esm2022/calendar/multiview-calendar.component.mjs

@@ -6,7 +6,7 @@ import { Component, ChangeDetectorRef, ChangeDetectionStrategy, ContentChild, Ev
 import { NG_VALUE_ACCESSOR, NG_VALIDATORS } from '@angular/forms';
 import { L10N_PREFIX, LocalizationService } from '@progress/kendo-angular-l10n';
 import { cloneDate, isEqual } from '@progress/kendo-date-math';
-import { hasObservers, guid, Keys, isObject, normalizeNumpadKeys } from '@progress/kendo-angular-common';
+import { hasObservers, guid, Keys, isObject, normalizeKeys } from '@progress/kendo-angular-common';
 import { HorizontalViewListComponent } from './horizontal-view-list.component';
 import { HeaderComponent } from './header.component';
 import { BusViewService } from './services/bus-view.service';
@@ -33,7 +33,6 @@ import { NavigationService } from './services/navigation.service';
 import { HeaderTemplateDirective } from './templates/header-template.directive';
 import { FooterTemplateDirective } from './templates/footer-template.directive';
 import { FooterComponent } from './footer.component';
-import { NgIf } from '@angular/common';
 import { MultiViewCalendarLocalizedMessagesDirective } from './localization/multiview-calendar-localized-messages.directive';
 import * as i0 from "@angular/core";
 import * as i1 from "./services/bus-view.service";
@@ -693,7 +692,7 @@ export class MultiViewCalendarComponent {
      * @hidden
      */
     keydown(event) {
-        const code = normalizeNumpadKeys(event);
+        const code = normalizeKeys(event);
         const arrowUpOrDownKeyPressed = [Keys.ArrowUp, Keys.ArrowDown].indexOf(code) !== -1;
         const ctrlKey = event.ctrlKey || event.metaKey;
         const onArrowRightAndControl = code === Keys.ArrowRight && ctrlKey;
@@ -1203,7 +1202,7 @@ export class MultiViewCalendarComponent {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: MultiViewCalendarComponent, deps: [{ token: i1.BusViewService }, { token: i0.ElementRef }, { token: i2.NavigationService }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: i3.DisabledDatesService }, { token: i4.SelectionService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: MultiViewCalendarComponent, isStandalone: true, selector: "kendo-multiviewcalendar", inputs: { showOtherMonthDays: "showOtherMonthDays", showCalendarHeader: "showCalendarHeader", size: "size", id: "id", focusedDate: "focusedDate", footer: "footer", min: "min", max: "max", rangeValidation: "rangeValidation", disabledDatesRangeValidation: "disabledDatesRangeValidation", selection: "selection", allowReverse: "allowReverse", value: "value", disabled: "disabled", tabindex: "tabindex", tabIndex: "tabIndex", weekDaysFormat: "weekDaysFormat", isActive: "isActive", disabledDates: "disabledDates", activeView: "activeView", bottomView: "bottomView", topView: "topView", showViewHeader: "showViewHeader", animateNavigation: "animateNavigation", weekNumber: "weekNumber", activeRangeEnd: "activeRangeEnd", selectionRange: "selectionRange", views: "views", orientation: "orientation", cellTemplateRef: ["cellTemplate", "cellTemplateRef"], monthCellTemplateRef: ["monthCellTemplate", "monthCellTemplateRef"], yearCellTemplateRef: ["yearCellTemplate", "yearCellTemplateRef"], decadeCellTemplateRef: ["decadeCellTemplate", "decadeCellTemplateRef"], centuryCellTemplateRef: ["centuryCellTemplate", "centuryCellTemplateRef"], weekNumberTemplateRef: ["weekNumberTemplate", "weekNumberTemplateRef"], footerTemplateRef: ["footerTemplate", "footerTemplateRef"], headerTitleTemplateRef: ["headerTitleTemplate", "headerTitleTemplateRef"], headerTemplateRef: ["headerTemplate", "headerTemplateRef"] }, outputs: { activeViewChange: "activeViewChange", navigate: "navigate", cellEnter: "cellEnter", cellLeave: "cellLeave", valueChange: "valueChange", rangeSelectionChange: "rangeSelectionChange", blurEvent: "blur", focusEvent: "focus", focusCalendar: "focusCalendar", onClosePopup: "onClosePopup", onTabPress: "onTabPress", onShiftTabPress: "onShiftTabPress" }, host: { listeners: { "mouseenter": "handleMouseEnter()", "mouseleave": "handleMouseLeave()", "mousedown": "handleMousedown($event)", "click": "handleClick()", "keydown": "keydown($event)" }, properties: { "attr.id": "this.widgetId", "attr.aria-disabled": "this.ariaDisabled", "class.k-disabled": "this.ariaDisabled" } }, providers: [
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: MultiViewCalendarComponent, isStandalone: true, selector: "kendo-multiviewcalendar", inputs: { showOtherMonthDays: "showOtherMonthDays", showCalendarHeader: "showCalendarHeader", size: "size", id: "id", focusedDate: "focusedDate", footer: "footer", min: "min", max: "max", rangeValidation: "rangeValidation", disabledDatesRangeValidation: "disabledDatesRangeValidation", selection: "selection", allowReverse: "allowReverse", value: "value", disabled: "disabled", tabindex: "tabindex", tabIndex: "tabIndex", weekDaysFormat: "weekDaysFormat", isActive: "isActive", disabledDates: "disabledDates", activeView: "activeView", bottomView: "bottomView", topView: "topView", showViewHeader: "showViewHeader", animateNavigation: "animateNavigation", weekNumber: "weekNumber", activeRangeEnd: "activeRangeEnd", selectionRange: "selectionRange", views: "views", orientation: "orientation", cellTemplateRef: ["cellTemplate", "cellTemplateRef"], monthCellTemplateRef: ["monthCellTemplate", "monthCellTemplateRef"], yearCellTemplateRef: ["yearCellTemplate", "yearCellTemplateRef"], decadeCellTemplateRef: ["decadeCellTemplate", "decadeCellTemplateRef"], centuryCellTemplateRef: ["centuryCellTemplate", "centuryCellTemplateRef"], weekNumberTemplateRef: ["weekNumberTemplate", "weekNumberTemplateRef"], footerTemplateRef: ["footerTemplate", "footerTemplateRef"], headerTitleTemplateRef: ["headerTitleTemplate", "headerTitleTemplateRef"], headerTemplateRef: ["headerTemplate", "headerTemplateRef"] }, outputs: { activeViewChange: "activeViewChange", navigate: "navigate", cellEnter: "cellEnter", cellLeave: "cellLeave", valueChange: "valueChange", rangeSelectionChange: "rangeSelectionChange", blurEvent: "blur", focusEvent: "focus", focusCalendar: "focusCalendar", onClosePopup: "onClosePopup", onTabPress: "onTabPress", onShiftTabPress: "onShiftTabPress" }, host: { listeners: { "mouseenter": "handleMouseEnter()", "mouseleave": "handleMouseLeave()", "mousedown": "handleMousedown($event)", "click": "handleClick()", "keydown": "keydown($event)" }, properties: { "attr.id": "this.widgetId", "attr.aria-disabled": "this.ariaDisabled", "class.k-disabled": "this.ariaDisabled" } }, providers: [
             BusViewService,
             RANGE_CALENDAR_VALUE_ACCESSOR,
             RANGE_CALENDAR_RANGE_VALIDATORS,
@@ -1217,21 +1216,21 @@ export class MultiViewCalendarComponent {
             SelectionService
         ], queries: [{ propertyName: "cellTemplate", first: true, predicate: CellTemplateDirective, descendants: true }, { propertyName: "monthCellTemplate", first: true, predicate: MonthCellTemplateDirective, descendants: true }, { propertyName: "yearCellTemplate", first: true, predicate: YearCellTemplateDirective, descendants: true }, { propertyName: "decadeCellTemplate", first: true, predicate: DecadeCellTemplateDirective, descendants: true }, { propertyName: "centuryCellTemplate", first: true, predicate: CenturyCellTemplateDirective, descendants: true }, { propertyName: "weekNumberTemplate", first: true, predicate: WeekNumberCellTemplateDirective, descendants: true }, { propertyName: "headerTitleTemplate", first: true, predicate: HeaderTitleTemplateDirective, descendants: true }, { propertyName: "headerTemplate", first: true, predicate: HeaderTemplateDirective, descendants: true }, { propertyName: "footerTemplate", first: true, predicate: FooterTemplateDirective, descendants: true }], viewQueries: [{ propertyName: "headerElement", first: true, predicate: HeaderComponent, descendants: true, read: ElementRef }, { propertyName: "viewList", first: true, predicate: HorizontalViewListComponent, descendants: true }], exportAs: ["kendo-multiviewcalendar"], usesOnChanges: true, ngImport: i0, template: `
     <ng-container kendoMultiViewCalendarLocalizedMessages
-        i18n-today="kendo.multiviewcalendar.today|The label for the today button in the calendar header"
-        today="Today"
-
-        i18n-prevButtonTitle="kendo.multiviewcalendar.prevButtonTitle|The label for the previous button in the Multiview calendar"
-        prevButtonTitle="Navigate to previous view"
-
-        i18n-nextButtonTitle="kendo.multiviewcalendar.nextButtonTitle|The label for the next button in the Multiview calendar"
-        nextButtonTitle="Navigate to next view"
-
-        i18n-parentViewButtonTitle="kendo.multiviewcalendar.parentViewButtonTitle|The title of the parent view button in the Multiview calendar header"
-        parentViewButtonTitle="Navigate to parent view"
-    >
+      i18n-today="kendo.multiviewcalendar.today|The label for the today button in the calendar header"
+      today="Today"
+    
+      i18n-prevButtonTitle="kendo.multiviewcalendar.prevButtonTitle|The label for the previous button in the Multiview calendar"
+      prevButtonTitle="Navigate to previous view"
+    
+      i18n-nextButtonTitle="kendo.multiviewcalendar.nextButtonTitle|The label for the next button in the Multiview calendar"
+      nextButtonTitle="Navigate to next view"
+    
+      i18n-parentViewButtonTitle="kendo.multiviewcalendar.parentViewButtonTitle|The title of the parent view button in the Multiview calendar header"
+      parentViewButtonTitle="Navigate to parent view"
+      >
     </ng-container>
-    <kendo-calendar-header
-        *ngIf="showCalendarHeader"
+    @if (showCalendarHeader) {
+      <kendo-calendar-header
         [activeView]="activeViewEnum"
         [currentDate]="activeDate"
         [size]="size"
@@ -1248,49 +1247,51 @@ export class MultiViewCalendarComponent {
         (todayButtonClick)="handleTodayButtonClick({ selectedDates: [$event], focusedDate: $event })"
         (prevButtonClick)="navigateView(prevView)"
         (nextButtonClick)="navigateView(nextView)"
-    >
-    </kendo-calendar-header>
+        >
+      </kendo-calendar-header>
+    }
     <kendo-calendar-horizontal
-        [showOtherMonthDays]="showOtherMonthDays"
-        [allowReverse]="allowReverse"
-        [id]="calendarHeaderIdLabel"
-        [attr.aria-labelledby]="multiViewCalendarHeaderIdLabel"
-        [activeView]="activeViewEnum"
-        [activeDescendant]="ariaActivedescendant"
-        [isActive]="isActive || isHovered"
-        [cellTemplateRef]="activeCellTemplate()?.templateRef"
-        [weekNumberTemplateRef]="weekNumberTemplateRef?.templateRef"
-        [cellUID]="cellUID"
-        [weekDaysFormat]="weekDaysFormat"
-        [views]="views"
-        [min]="min"
-        [max]="max"
-        [focusedDate]="focusedDate"
-        [animateNavigation]="animateNavigation"
-        [showViewHeader]="showViewHeader"
-        [weekNumber]="weekNumber"
-        [activeRangeEnd]="activeRangeEnd"
-        [selectionRange]="selectionRange"
-        [selectedDates]="selectedDates"
-        [orientation]="orientation"
-        [tabIndex]="tabIndex"
-        [disabled]="disabled"
-        (cellClick)="handleCellClick($event)"
-        (weekNumberCellClick)="handleWeekNumberClick($event)"
-        (cellEnter)="onCellEnter(cellEnter, $event)"
-        (cellLeave)="emitCellEvent(cellLeave, $event)"
-        (activeDateChange)="setActiveDate($event)"
-        (focusCalendar)="handleFocus()"
-        (blurCalendar)="handleFocusout($event)"
-    >
+      [showOtherMonthDays]="showOtherMonthDays"
+      [allowReverse]="allowReverse"
+      [id]="calendarHeaderIdLabel"
+      [attr.aria-labelledby]="multiViewCalendarHeaderIdLabel"
+      [activeView]="activeViewEnum"
+      [activeDescendant]="ariaActivedescendant"
+      [isActive]="isActive || isHovered"
+      [cellTemplateRef]="activeCellTemplate()?.templateRef"
+      [weekNumberTemplateRef]="weekNumberTemplateRef?.templateRef"
+      [cellUID]="cellUID"
+      [weekDaysFormat]="weekDaysFormat"
+      [views]="views"
+      [min]="min"
+      [max]="max"
+      [focusedDate]="focusedDate"
+      [animateNavigation]="animateNavigation"
+      [showViewHeader]="showViewHeader"
+      [weekNumber]="weekNumber"
+      [activeRangeEnd]="activeRangeEnd"
+      [selectionRange]="selectionRange"
+      [selectedDates]="selectedDates"
+      [orientation]="orientation"
+      [tabIndex]="tabIndex"
+      [disabled]="disabled"
+      (cellClick)="handleCellClick($event)"
+      (weekNumberCellClick)="handleWeekNumberClick($event)"
+      (cellEnter)="onCellEnter(cellEnter, $event)"
+      (cellLeave)="emitCellEvent(cellLeave, $event)"
+      (activeDateChange)="setActiveDate($event)"
+      (focusCalendar)="handleFocus()"
+      (blurCalendar)="handleFocusout($event)"
+      >
     </kendo-calendar-horizontal>
-    <kendo-calendar-footer
-        *ngIf="footer"
+    @if (footer) {
+      <kendo-calendar-footer
         [footerTemplateRef]="footerTemplateRef?.templateRef"
         [activeViewValue]="activeView"
         [currentDate]="activeDate">
-    </kendo-calendar-footer>
-  `, isInline: true, dependencies: [{ kind: "directive", type: MultiViewCalendarLocalizedMessagesDirective, selector: "[kendoMultiViewCalendarLocalizedMessages]" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: HeaderComponent, selector: "kendo-calendar-header", inputs: ["activeView", "currentDate", "min", "max", "rangeLength", "titleTemplateRef", "headerTemplateRef", "isPrevDisabled", "isNextDisabled", "showNavigationButtons", "orientation", "id", "size"], outputs: ["todayButtonClick", "prevButtonClick", "nextButtonClick"] }, { kind: "component", type: HorizontalViewListComponent, selector: "kendo-calendar-horizontal", inputs: ["showOtherMonthDays", "cellTemplateRef", "weekNumberTemplateRef", "allowReverse", "activeRangeEnd", "activeView", "cellUID", "focusedDate", "isActive", "min", "max", "selectionRange", "selectedDates", "views", "showViewHeader", "animateNavigation", "orientation", "activeDescendant", "tabIndex", "disabled", "id", "weekDaysFormat", "weekNumber"], outputs: ["cellClick", "weekNumberCellClick", "cellEnter", "cellLeave", "activeDateChange", "focusCalendar", "blurCalendar", "focusedCellChange"] }, { kind: "component", type: FooterComponent, selector: "kendo-calendar-footer", inputs: ["footerTemplateRef", "activeViewValue", "currentDate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+      </kendo-calendar-footer>
+    }
+    `, isInline: true, dependencies: [{ kind: "directive", type: MultiViewCalendarLocalizedMessagesDirective, selector: "[kendoMultiViewCalendarLocalizedMessages]" }, { kind: "component", type: HeaderComponent, selector: "kendo-calendar-header", inputs: ["activeView", "currentDate", "min", "max", "rangeLength", "titleTemplateRef", "headerTemplateRef", "isPrevDisabled", "isNextDisabled", "showNavigationButtons", "orientation", "id", "size"], outputs: ["todayButtonClick", "prevButtonClick", "nextButtonClick"] }, { kind: "component", type: HorizontalViewListComponent, selector: "kendo-calendar-horizontal", inputs: ["showOtherMonthDays", "cellTemplateRef", "weekNumberTemplateRef", "allowReverse", "activeRangeEnd", "activeView", "cellUID", "focusedDate", "isActive", "min", "max", "selectionRange", "selectedDates", "views", "showViewHeader", "animateNavigation", "orientation", "activeDescendant", "tabIndex", "disabled", "id", "weekDaysFormat", "weekNumber"], outputs: ["cellClick", "weekNumberCellClick", "cellEnter", "cellLeave", "activeDateChange", "focusCalendar", "blurCalendar", "focusedCellChange"] }, { kind: "component", type: FooterComponent, selector: "kendo-calendar-footer", inputs: ["footerTemplateRef", "activeViewValue", "currentDate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: MultiViewCalendarComponent, decorators: [{
             type: Component,
@@ -1313,21 +1314,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
                     selector: 'kendo-multiviewcalendar',
                     template: `
     <ng-container kendoMultiViewCalendarLocalizedMessages
-        i18n-today="kendo.multiviewcalendar.today|The label for the today button in the calendar header"
-        today="Today"
-
-        i18n-prevButtonTitle="kendo.multiviewcalendar.prevButtonTitle|The label for the previous button in the Multiview calendar"
-        prevButtonTitle="Navigate to previous view"
-
-        i18n-nextButtonTitle="kendo.multiviewcalendar.nextButtonTitle|The label for the next button in the Multiview calendar"
-        nextButtonTitle="Navigate to next view"
-
-        i18n-parentViewButtonTitle="kendo.multiviewcalendar.parentViewButtonTitle|The title of the parent view button in the Multiview calendar header"
-        parentViewButtonTitle="Navigate to parent view"
-    >
+      i18n-today="kendo.multiviewcalendar.today|The label for the today button in the calendar header"
+      today="Today"
+    
+      i18n-prevButtonTitle="kendo.multiviewcalendar.prevButtonTitle|The label for the previous button in the Multiview calendar"
+      prevButtonTitle="Navigate to previous view"
+    
+      i18n-nextButtonTitle="kendo.multiviewcalendar.nextButtonTitle|The label for the next button in the Multiview calendar"
+      nextButtonTitle="Navigate to next view"
+    
+      i18n-parentViewButtonTitle="kendo.multiviewcalendar.parentViewButtonTitle|The title of the parent view button in the Multiview calendar header"
+      parentViewButtonTitle="Navigate to parent view"
+      >
     </ng-container>
-    <kendo-calendar-header
-        *ngIf="showCalendarHeader"
+    @if (showCalendarHeader) {
+      <kendo-calendar-header
         [activeView]="activeViewEnum"
         [currentDate]="activeDate"
         [size]="size"
@@ -1344,51 +1345,53 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
         (todayButtonClick)="handleTodayButtonClick({ selectedDates: [$event], focusedDate: $event })"
         (prevButtonClick)="navigateView(prevView)"
         (nextButtonClick)="navigateView(nextView)"
-    >
-    </kendo-calendar-header>
+        >
+      </kendo-calendar-header>
+    }
     <kendo-calendar-horizontal
-        [showOtherMonthDays]="showOtherMonthDays"
-        [allowReverse]="allowReverse"
-        [id]="calendarHeaderIdLabel"
-        [attr.aria-labelledby]="multiViewCalendarHeaderIdLabel"
-        [activeView]="activeViewEnum"
-        [activeDescendant]="ariaActivedescendant"
-        [isActive]="isActive || isHovered"
-        [cellTemplateRef]="activeCellTemplate()?.templateRef"
-        [weekNumberTemplateRef]="weekNumberTemplateRef?.templateRef"
-        [cellUID]="cellUID"
-        [weekDaysFormat]="weekDaysFormat"
-        [views]="views"
-        [min]="min"
-        [max]="max"
-        [focusedDate]="focusedDate"
-        [animateNavigation]="animateNavigation"
-        [showViewHeader]="showViewHeader"
-        [weekNumber]="weekNumber"
-        [activeRangeEnd]="activeRangeEnd"
-        [selectionRange]="selectionRange"
-        [selectedDates]="selectedDates"
-        [orientation]="orientation"
-        [tabIndex]="tabIndex"
-        [disabled]="disabled"
-        (cellClick)="handleCellClick($event)"
-        (weekNumberCellClick)="handleWeekNumberClick($event)"
-        (cellEnter)="onCellEnter(cellEnter, $event)"
-        (cellLeave)="emitCellEvent(cellLeave, $event)"
-        (activeDateChange)="setActiveDate($event)"
-        (focusCalendar)="handleFocus()"
-        (blurCalendar)="handleFocusout($event)"
-    >
+      [showOtherMonthDays]="showOtherMonthDays"
+      [allowReverse]="allowReverse"
+      [id]="calendarHeaderIdLabel"
+      [attr.aria-labelledby]="multiViewCalendarHeaderIdLabel"
+      [activeView]="activeViewEnum"
+      [activeDescendant]="ariaActivedescendant"
+      [isActive]="isActive || isHovered"
+      [cellTemplateRef]="activeCellTemplate()?.templateRef"
+      [weekNumberTemplateRef]="weekNumberTemplateRef?.templateRef"
+      [cellUID]="cellUID"
+      [weekDaysFormat]="weekDaysFormat"
+      [views]="views"
+      [min]="min"
+      [max]="max"
+      [focusedDate]="focusedDate"
+      [animateNavigation]="animateNavigation"
+      [showViewHeader]="showViewHeader"
+      [weekNumber]="weekNumber"
+      [activeRangeEnd]="activeRangeEnd"
+      [selectionRange]="selectionRange"
+      [selectedDates]="selectedDates"
+      [orientation]="orientation"
+      [tabIndex]="tabIndex"
+      [disabled]="disabled"
+      (cellClick)="handleCellClick($event)"
+      (weekNumberCellClick)="handleWeekNumberClick($event)"
+      (cellEnter)="onCellEnter(cellEnter, $event)"
+      (cellLeave)="emitCellEvent(cellLeave, $event)"
+      (activeDateChange)="setActiveDate($event)"
+      (focusCalendar)="handleFocus()"
+      (blurCalendar)="handleFocusout($event)"
+      >
     </kendo-calendar-horizontal>
-    <kendo-calendar-footer
-        *ngIf="footer"
+    @if (footer) {
+      <kendo-calendar-footer
         [footerTemplateRef]="footerTemplateRef?.templateRef"
         [activeViewValue]="activeView"
         [currentDate]="activeDate">
-    </kendo-calendar-footer>
-  `,
+      </kendo-calendar-footer>
+    }
+    `,
                     standalone: true,
-                    imports: [MultiViewCalendarLocalizedMessagesDirective, NgIf, HeaderComponent, HorizontalViewListComponent, FooterComponent]
+                    imports: [MultiViewCalendarLocalizedMessagesDirective, HeaderComponent, HorizontalViewListComponent, FooterComponent]
                 }]
         }], ctorParameters: () => [{ type: i1.BusViewService }, { type: i0.ElementRef }, { type: i2.NavigationService }, { type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: i3.DisabledDatesService }, { type: i4.SelectionService }], propDecorators: { showOtherMonthDays: [{
                 type: Input

package/esm2022/calendar/navigation.component.mjs

@@ -13,7 +13,7 @@ import { MIN_DATE, MAX_DATE } from '../defaults';
 import { cloneDate } from '@progress/kendo-date-math';
 import { dateInRange } from '../util';
 import { closestInScope } from '../common/dom-queries';
-import { NgIf, NgTemplateOutlet } from '@angular/common';
+import { NgTemplateOutlet } from '@angular/common';
 import { KForOf } from './for.directive';
 import { EventsOutsideAngularDirective } from '@progress/kendo-angular-common';
 import * as i0 from "@angular/core";
@@ -135,33 +135,36 @@ export class NavigationComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: NavigationComponent, deps: [{ token: i1.BusViewService }, { token: i2.CalendarDOMService }, { token: i3.IntlService }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: NavigationComponent, isStandalone: true, selector: "kendo-calendar-navigation", inputs: { activeView: "activeView", min: "min", max: "max", focusedDate: "focusedDate", templateRef: "templateRef" }, outputs: { valueChange: "valueChange", pageChange: "pageChange" }, host: { properties: { "class.k-calendar-navigation": "this.getComponentClass" } }, viewQueries: [{ propertyName: "virtualization", first: true, predicate: VirtualizationComponent, descendants: true }, { propertyName: "list", first: true, predicate: ["list"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: NavigationComponent, isStandalone: true, selector: "kendo-calendar-navigation", inputs: { activeView: "activeView", min: "min", max: "max", focusedDate: "focusedDate", templateRef: "templateRef" }, outputs: { valueChange: "valueChange", pageChange: "pageChange" }, host: { properties: { "class.k-calendar-navigation": "this.getComponentClass" } }, viewQueries: [{ propertyName: "virtualization", first: true, predicate: VirtualizationComponent, descendants: true }, { propertyName: "list", first: true, predicate: ["list"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: `
     <span class="k-calendar-navigation-highlight"></span>
     <kendo-virtualization
-        [skip]="skip"
-        [take]="take"
-        [total]="total"
-        [itemHeight]="itemHeight"
-        [topOffset]="topOffset"
-        [bottomOffset]="bottomOffset"
-        [maxScrollDifference]="maxViewHeight"
-        (pageChange)="onPageChange($event)"
-        (scrollChange)="scrollChange($event)"
-    >
-        <ul #list class="k-reset" [kendoEventsOutsideAngular]="{ click: handleDateChange }" [scope]="this">
-            <li *kFor="let date of dates; let index=index" [attr.data-date-index]="index">
-                <span [class.k-calendar-navigation-marker]="service.isRangeStart(date)">
-                    <ng-template [ngIf]="!templateRef">{{service.navigationTitle(date)}}</ng-template>
-                    <ng-template
-                        [ngIf]="templateRef"
-                        [ngTemplateOutlet]="templateRef"
-                        [ngTemplateOutletContext]="{ $implicit: service.navigationTitle(date), activeView: activeViewValue, date: date }"
-                    ></ng-template>
-                </span>
-            </li>
-        </ul>
+      [skip]="skip"
+      [take]="take"
+      [total]="total"
+      [itemHeight]="itemHeight"
+      [topOffset]="topOffset"
+      [bottomOffset]="bottomOffset"
+      [maxScrollDifference]="maxViewHeight"
+      (pageChange)="onPageChange($event)"
+      (scrollChange)="scrollChange($event)"
+      >
+      <ul #list class="k-reset" [kendoEventsOutsideAngular]="{ click: handleDateChange }" [scope]="this">
+        <li *kFor="let date of dates; let index=index" [attr.data-date-index]="index">
+          <span [class.k-calendar-navigation-marker]="service.isRangeStart(date)">
+            @if (!templateRef) {
+              {{service.navigationTitle(date)}}
+            }
+            @if (templateRef) {
+              <ng-template
+                [ngTemplateOutlet]="templateRef"
+                [ngTemplateOutletContext]="{ $implicit: service.navigationTitle(date), activeView: activeViewValue, date: date }"
+              ></ng-template>
+            }
+          </span>
+        </li>
+      </ul>
     </kendo-virtualization>
-  `, isInline: true, dependencies: [{ kind: "component", type: VirtualizationComponent, selector: "kendo-virtualization", inputs: ["direction", "itemHeight", "itemWidth", "topOffset", "bottomOffset", "maxScrollDifference", "scrollOffsetSize", "scrollDuration", "skip", "take", "total"], outputs: ["activeIndexChange", "pageChange", "scrollChange"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { kind: "directive", type: KForOf, selector: "[kFor][kForOf]", inputs: ["kForOf", "kForTrackBy", "kForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    `, isInline: true, dependencies: [{ kind: "component", type: VirtualizationComponent, selector: "kendo-virtualization", inputs: ["direction", "itemHeight", "itemWidth", "topOffset", "bottomOffset", "maxScrollDifference", "scrollOffsetSize", "scrollDuration", "skip", "take", "total"], outputs: ["activeIndexChange", "pageChange", "scrollChange"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { kind: "directive", type: KForOf, selector: "[kFor][kForOf]", inputs: ["kForOf", "kForTrackBy", "kForTemplate"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: NavigationComponent, decorators: [{
             type: Component,
@@ -171,32 +174,35 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
                     template: `
     <span class="k-calendar-navigation-highlight"></span>
     <kendo-virtualization
-        [skip]="skip"
-        [take]="take"
-        [total]="total"
-        [itemHeight]="itemHeight"
-        [topOffset]="topOffset"
-        [bottomOffset]="bottomOffset"
-        [maxScrollDifference]="maxViewHeight"
-        (pageChange)="onPageChange($event)"
-        (scrollChange)="scrollChange($event)"
-    >
-        <ul #list class="k-reset" [kendoEventsOutsideAngular]="{ click: handleDateChange }" [scope]="this">
-            <li *kFor="let date of dates; let index=index" [attr.data-date-index]="index">
-                <span [class.k-calendar-navigation-marker]="service.isRangeStart(date)">
-                    <ng-template [ngIf]="!templateRef">{{service.navigationTitle(date)}}</ng-template>
-                    <ng-template
-                        [ngIf]="templateRef"
-                        [ngTemplateOutlet]="templateRef"
-                        [ngTemplateOutletContext]="{ $implicit: service.navigationTitle(date), activeView: activeViewValue, date: date }"
-                    ></ng-template>
-                </span>
-            </li>
-        </ul>
+      [skip]="skip"
+      [take]="take"
+      [total]="total"
+      [itemHeight]="itemHeight"
+      [topOffset]="topOffset"
+      [bottomOffset]="bottomOffset"
+      [maxScrollDifference]="maxViewHeight"
+      (pageChange)="onPageChange($event)"
+      (scrollChange)="scrollChange($event)"
+      >
+      <ul #list class="k-reset" [kendoEventsOutsideAngular]="{ click: handleDateChange }" [scope]="this">
+        <li *kFor="let date of dates; let index=index" [attr.data-date-index]="index">
+          <span [class.k-calendar-navigation-marker]="service.isRangeStart(date)">
+            @if (!templateRef) {
+              {{service.navigationTitle(date)}}
+            }
+            @if (templateRef) {
+              <ng-template
+                [ngTemplateOutlet]="templateRef"
+                [ngTemplateOutletContext]="{ $implicit: service.navigationTitle(date), activeView: activeViewValue, date: date }"
+              ></ng-template>
+            }
+          </span>
+        </li>
+      </ul>
     </kendo-virtualization>
-  `,
+    `,
                     standalone: true,
-                    imports: [VirtualizationComponent, EventsOutsideAngularDirective, KForOf, NgIf, NgTemplateOutlet]
+                    imports: [VirtualizationComponent, EventsOutsideAngularDirective, KForOf, NgTemplateOutlet]
                 }]
         }], ctorParameters: () => [{ type: i1.BusViewService }, { type: i2.CalendarDOMService }, { type: i3.IntlService }, { type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }], propDecorators: { activeView: [{
                 type: Input

package/esm2022/calendar/services/navigation.service.mjs

@@ -5,7 +5,7 @@
 import { Injectable } from '@angular/core';
 import { Action } from '../models/navigation-action.enum';
 import { BusViewService } from '../services/bus-view.service';
-import { normalizeNumpadKeys } from '@progress/kendo-angular-common';
+import { normalizeKeys } from '@progress/kendo-angular-common';
 import * as i0 from "@angular/core";
 import * as i1 from "../services/bus-view.service";
 const KEY_TO_ACTION = {
@@ -30,7 +30,7 @@ export class NavigationService {
     }
     action(event) {
         // on some keyboards arrow keys, PageUp/Down, and Home/End are mapped to Numpad keys
-        const code = normalizeNumpadKeys(event);
+        const code = normalizeKeys(event);
         const action = `${event.ctrlKey || event.metaKey ? 'meta+' : ''}${code}`;
         return KEY_TO_ACTION[action];
     }