@progress/kendo-angular-dateinputs 19.3.0-develop.32 → 19.3.0-develop.33
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/calendar/multiview-calendar.component.d.ts +4 -5
- package/calendar/services/navigation.service.d.ts +1 -2
- package/common/utils.d.ts +1 -11
- package/daterange/date-range-popup.component.d.ts +3 -4
- package/esm2022/calendar/calendar.component.mjs +7 -6
- package/esm2022/calendar/multiview-calendar.component.mjs +10 -9
- package/esm2022/calendar/services/navigation.service.mjs +14 -11
- package/esm2022/common/utils.mjs +5 -12
- package/esm2022/dateinput/dateinput.component.mjs +1 -1
- package/esm2022/datepicker/datepicker.component.mjs +7 -6
- package/esm2022/daterange/date-range-input.mjs +7 -5
- package/esm2022/daterange/date-range-popup.component.mjs +4 -3
- package/esm2022/daterange/date-range.component.mjs +4 -3
- package/esm2022/datetimepicker/datetimepicker.component.mjs +6 -5
- package/esm2022/package-metadata.mjs +2 -2
- package/esm2022/timepicker/timelist.component.mjs +9 -8
- package/esm2022/timepicker/timepicker.component.mjs +6 -5
- package/esm2022/timepicker/timeselector.component.mjs +10 -9
- package/fesm2022/progress-kendo-angular-dateinputs.mjs +87 -82
- package/package.json +11 -11
- package/calendar/models/keydown.interface.d.ts +0 -37
- package/esm2022/calendar/models/keydown.interface.mjs +0 -5
|
@@ -17,7 +17,6 @@ import { CenturyCellTemplateDirective } from './templates/century-cell-template.
|
|
|
17
17
|
import { WeekNumberCellTemplateDirective } from './templates/weeknumber-cell-template.directive';
|
|
18
18
|
import { HeaderTitleTemplateDirective } from './templates/header-title-template.directive';
|
|
19
19
|
import { Action } from './models/navigation-action.enum';
|
|
20
|
-
import { KeyDown } from './models/keydown.interface';
|
|
21
20
|
import { CalendarView } from './models/view.type';
|
|
22
21
|
import { CalendarViewEnum } from './models/view.enum';
|
|
23
22
|
import { SelectionRangeEnd } from './models/selection-range-end.type';
|
|
@@ -326,15 +325,15 @@ export declare class MultiViewCalendarComponent implements AfterViewInit, Contro
|
|
|
326
325
|
/**
|
|
327
326
|
* @hidden
|
|
328
327
|
*/
|
|
329
|
-
onClosePopup: EventEmitter<
|
|
328
|
+
onClosePopup: EventEmitter<any>;
|
|
330
329
|
/**
|
|
331
330
|
* @hidden
|
|
332
331
|
*/
|
|
333
|
-
onTabPress: EventEmitter<
|
|
332
|
+
onTabPress: EventEmitter<any>;
|
|
334
333
|
/**
|
|
335
334
|
* @hidden
|
|
336
335
|
*/
|
|
337
|
-
onShiftTabPress: EventEmitter<
|
|
336
|
+
onShiftTabPress: EventEmitter<any>;
|
|
338
337
|
/**
|
|
339
338
|
* @hidden
|
|
340
339
|
*
|
|
@@ -543,7 +542,7 @@ export declare class MultiViewCalendarComponent implements AfterViewInit, Contro
|
|
|
543
542
|
/**
|
|
544
543
|
* @hidden
|
|
545
544
|
*/
|
|
546
|
-
keydown(event:
|
|
545
|
+
keydown(event: KeyboardEvent): void;
|
|
547
546
|
constructor(bus: BusViewService, element: ElementRef, navigator: NavigationService, renderer: Renderer2, cdr: ChangeDetectorRef, zone: NgZone, disabledDatesService: DisabledDatesService, selectionService: SelectionService);
|
|
548
547
|
ngOnInit(): void;
|
|
549
548
|
ngOnChanges(changes: any): void;
|
|
@@ -3,7 +3,6 @@
|
|
|
3
3
|
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
4
|
*-------------------------------------------------------------------------------------------*/
|
|
5
5
|
import { Action } from '../models/navigation-action.enum';
|
|
6
|
-
import { KeyDown } from '../models/keydown.interface';
|
|
7
6
|
import { CalendarViewEnum } from '../models/view.enum';
|
|
8
7
|
import { BusViewService } from '../services/bus-view.service';
|
|
9
8
|
import * as i0 from "@angular/core";
|
|
@@ -13,7 +12,7 @@ import * as i0 from "@angular/core";
|
|
|
13
12
|
export declare class NavigationService {
|
|
14
13
|
private bus;
|
|
15
14
|
constructor(bus: BusViewService);
|
|
16
|
-
action(event:
|
|
15
|
+
action(event: KeyboardEvent): Action;
|
|
17
16
|
move(value: Date, action: Action, activeView: CalendarViewEnum): Date;
|
|
18
17
|
static ɵfac: i0.ɵɵFactoryDeclaration<NavigationService, never>;
|
|
19
18
|
static ɵprov: i0.ɵɵInjectableDeclaration<NavigationService>;
|
package/common/utils.d.ts
CHANGED
|
@@ -43,17 +43,7 @@ export declare const isDateArray: (value: any) => boolean;
|
|
|
43
43
|
/**
|
|
44
44
|
* @hidden
|
|
45
45
|
*/
|
|
46
|
-
export declare const isArrowWithShiftPressed: (args:
|
|
47
|
-
/**
|
|
48
|
-
* @hidden
|
|
49
|
-
* Enum with key codes.
|
|
50
|
-
*/
|
|
51
|
-
export declare enum Keys {
|
|
52
|
-
ArrowDown = 40,
|
|
53
|
-
ArrowLeft = 37,
|
|
54
|
-
ArrowRight = 39,
|
|
55
|
-
ArrowUp = 38
|
|
56
|
-
}
|
|
46
|
+
export declare const isArrowWithShiftPressed: (args: KeyboardEvent) => boolean;
|
|
57
47
|
/**
|
|
58
48
|
* @hidden
|
|
59
49
|
*/
|
|
@@ -14,7 +14,6 @@ import { AdaptiveMode } from '../util';
|
|
|
14
14
|
import { SVGIcon } from '@progress/kendo-svg-icons';
|
|
15
15
|
import { DateRangeSelectionDirective } from './date-range-selection.directive';
|
|
16
16
|
import { ActionSheetComponent } from '@progress/kendo-angular-navigation';
|
|
17
|
-
import { KeyDown } from '../calendar/models/keydown.interface';
|
|
18
17
|
import { DateInputSize } from '../common/models/size';
|
|
19
18
|
import { CalendarView } from '../calendar/models/view.type';
|
|
20
19
|
import { Day } from '@progress/kendo-date-math';
|
|
@@ -348,15 +347,15 @@ export declare class DateRangePopupComponent implements OnInit, OnDestroy {
|
|
|
348
347
|
/**
|
|
349
348
|
* @hidden
|
|
350
349
|
*/
|
|
351
|
-
closePopup(event:
|
|
350
|
+
closePopup(event: KeyboardEvent): void;
|
|
352
351
|
/**
|
|
353
352
|
* @hidden
|
|
354
353
|
*/
|
|
355
|
-
handleTab(event:
|
|
354
|
+
handleTab(event: KeyboardEvent): void;
|
|
356
355
|
/**
|
|
357
356
|
* @hidden
|
|
358
357
|
*/
|
|
359
|
-
handleShiftTab(event:
|
|
358
|
+
handleShiftTab(event: KeyboardEvent): void;
|
|
360
359
|
private handleWindowBlur;
|
|
361
360
|
private handleMouseLeave;
|
|
362
361
|
private handleKeydown;
|
|
@@ -6,7 +6,7 @@ import { Component, ChangeDetectorRef, ChangeDetectionStrategy, ContentChild, Ev
|
|
|
6
6
|
import { NG_VALUE_ACCESSOR, NG_VALIDATORS, NgControl } from '@angular/forms';
|
|
7
7
|
import { L10N_PREFIX, LocalizationService } from '@progress/kendo-angular-l10n';
|
|
8
8
|
import { cloneDate, isEqual } from '@progress/kendo-date-math';
|
|
9
|
-
import { hasObservers, KendoInput, guid, Keys, isObject, ResizeSensorComponent } from '@progress/kendo-angular-common';
|
|
9
|
+
import { hasObservers, KendoInput, guid, Keys, isObject, ResizeSensorComponent, normalizeNumpadKeys } from '@progress/kendo-angular-common';
|
|
10
10
|
import { validatePackage } from '@progress/kendo-licensing';
|
|
11
11
|
import { packageMetadata } from '../package-metadata';
|
|
12
12
|
import { MultiViewCalendarComponent } from './multiview-calendar.component';
|
|
@@ -1048,7 +1048,7 @@ export class CalendarComponent {
|
|
|
1048
1048
|
*/
|
|
1049
1049
|
handleMultiViewCalendarKeydown(args) {
|
|
1050
1050
|
// Prevent form from submitting on enter if used in datepicker (classic view)
|
|
1051
|
-
if (isPresent(this.pickerService) && args.
|
|
1051
|
+
if (isPresent(this.pickerService) && (args.code === Keys.Enter || args.code === Keys.NumpadEnter)) {
|
|
1052
1052
|
args.preventDefault();
|
|
1053
1053
|
}
|
|
1054
1054
|
}
|
|
@@ -1129,7 +1129,8 @@ export class CalendarComponent {
|
|
|
1129
1129
|
if (this.type === 'infinite') {
|
|
1130
1130
|
// reserve the alt + arrow key commands for the picker
|
|
1131
1131
|
const ctrlKey = args.ctrlKey || args.metaKey;
|
|
1132
|
-
const
|
|
1132
|
+
const code = normalizeNumpadKeys(args);
|
|
1133
|
+
const arrowKeyPressed = [Keys.ArrowUp, Keys.ArrowRight, Keys.ArrowDown, Keys.ArrowLeft].indexOf(code) !== -1;
|
|
1133
1134
|
const reserveKeyCommandsForPicker = isPresent(this.pickerService) && arrowKeyPressed && args.altKey;
|
|
1134
1135
|
if (reserveKeyCommandsForPicker) {
|
|
1135
1136
|
return;
|
|
@@ -1138,7 +1139,7 @@ export class CalendarComponent {
|
|
|
1138
1139
|
args.preventDefault();
|
|
1139
1140
|
}
|
|
1140
1141
|
// Prevent form from submitting on enter if used in datepicker (infinite view)
|
|
1141
|
-
const preventSubmitInDatePicker = isPresent(this.pickerService) &&
|
|
1142
|
+
const preventSubmitInDatePicker = isPresent(this.pickerService) && code === Keys.Enter;
|
|
1142
1143
|
if (preventSubmitInDatePicker) {
|
|
1143
1144
|
args.preventDefault();
|
|
1144
1145
|
}
|
|
@@ -1148,7 +1149,7 @@ export class CalendarComponent {
|
|
|
1148
1149
|
this.detectChanges();
|
|
1149
1150
|
args.preventDefault();
|
|
1150
1151
|
}
|
|
1151
|
-
if (
|
|
1152
|
+
if (code === Keys.Enter) {
|
|
1152
1153
|
this.selectionService.lastClicked = this.focusedDate;
|
|
1153
1154
|
if (this.selection !== 'range') {
|
|
1154
1155
|
this.performSelection(this.focusedDate, args);
|
|
@@ -1157,7 +1158,7 @@ export class CalendarComponent {
|
|
|
1157
1158
|
this.performRangeSelection(this.focusedDate);
|
|
1158
1159
|
}
|
|
1159
1160
|
}
|
|
1160
|
-
if (
|
|
1161
|
+
if (code === Keys.KeyT) {
|
|
1161
1162
|
this.focusToday();
|
|
1162
1163
|
}
|
|
1163
1164
|
if (isArrowWithShiftPressed(args) && this.selection !== 'range') {
|
|
@@ -6,7 +6,7 @@ import { Component, ChangeDetectorRef, ChangeDetectionStrategy, ContentChild, Ev
|
|
|
6
6
|
import { NG_VALUE_ACCESSOR, NG_VALIDATORS } from '@angular/forms';
|
|
7
7
|
import { L10N_PREFIX, LocalizationService } from '@progress/kendo-angular-l10n';
|
|
8
8
|
import { cloneDate, isEqual } from '@progress/kendo-date-math';
|
|
9
|
-
import { hasObservers, guid, Keys, isObject } from '@progress/kendo-angular-common';
|
|
9
|
+
import { hasObservers, guid, Keys, isObject, normalizeNumpadKeys } from '@progress/kendo-angular-common';
|
|
10
10
|
import { HorizontalViewListComponent } from './horizontal-view-list.component';
|
|
11
11
|
import { HeaderComponent } from './header.component';
|
|
12
12
|
import { BusViewService } from './services/bus-view.service';
|
|
@@ -693,16 +693,17 @@ export class MultiViewCalendarComponent {
|
|
|
693
693
|
* @hidden
|
|
694
694
|
*/
|
|
695
695
|
keydown(event) {
|
|
696
|
-
const
|
|
696
|
+
const code = normalizeNumpadKeys(event);
|
|
697
|
+
const arrowUpOrDownKeyPressed = [Keys.ArrowUp, Keys.ArrowDown].indexOf(code) !== -1;
|
|
697
698
|
const ctrlKey = event.ctrlKey || event.metaKey;
|
|
698
|
-
const onArrowRightAndControl =
|
|
699
|
-
const onArrowLeftAndControl =
|
|
700
|
-
const onTKeyPress =
|
|
701
|
-
const onEnterKeyPress =
|
|
702
|
-
const onArrowUpPress =
|
|
699
|
+
const onArrowRightAndControl = code === Keys.ArrowRight && ctrlKey;
|
|
700
|
+
const onArrowLeftAndControl = code === Keys.ArrowLeft && ctrlKey;
|
|
701
|
+
const onTKeyPress = code === Keys.KeyT;
|
|
702
|
+
const onEnterKeyPress = code === Keys.Enter;
|
|
703
|
+
const onArrowUpPress = code === Keys.ArrowUp;
|
|
703
704
|
const altKey = event.altKey;
|
|
704
|
-
const escKey =
|
|
705
|
-
const tabKeyPress =
|
|
705
|
+
const escKey = code === Keys.Escape;
|
|
706
|
+
const tabKeyPress = code === Keys.Tab;
|
|
706
707
|
const shiftKeyPress = event.shiftKey;
|
|
707
708
|
if (onArrowRightAndControl) {
|
|
708
709
|
event.preventDefault();
|
|
@@ -5,19 +5,20 @@
|
|
|
5
5
|
import { Injectable } from '@angular/core';
|
|
6
6
|
import { Action } from '../models/navigation-action.enum';
|
|
7
7
|
import { BusViewService } from '../services/bus-view.service';
|
|
8
|
+
import { normalizeNumpadKeys } from '@progress/kendo-angular-common';
|
|
8
9
|
import * as i0 from "@angular/core";
|
|
9
10
|
import * as i1 from "../services/bus-view.service";
|
|
10
11
|
const KEY_TO_ACTION = {
|
|
11
|
-
'
|
|
12
|
-
'
|
|
13
|
-
'
|
|
14
|
-
'
|
|
15
|
-
'
|
|
16
|
-
'
|
|
17
|
-
'
|
|
18
|
-
'
|
|
19
|
-
'meta+
|
|
20
|
-
'meta+
|
|
12
|
+
'PageUp': Action.PrevView,
|
|
13
|
+
'PageDown': Action.NextView,
|
|
14
|
+
'End': Action.LastInView,
|
|
15
|
+
'Home': Action.FirstInView,
|
|
16
|
+
'ArrowLeft': Action.Left,
|
|
17
|
+
'ArrowUp': Action.Up,
|
|
18
|
+
'ArrowRight': Action.Right,
|
|
19
|
+
'ArrowDown': Action.Down,
|
|
20
|
+
'meta+ArrowUp': Action.UpperView,
|
|
21
|
+
'meta+ArrowDown': Action.LowerView
|
|
21
22
|
};
|
|
22
23
|
/**
|
|
23
24
|
* @hidden
|
|
@@ -28,7 +29,9 @@ export class NavigationService {
|
|
|
28
29
|
this.bus = bus;
|
|
29
30
|
}
|
|
30
31
|
action(event) {
|
|
31
|
-
|
|
32
|
+
// on some keyboards arrow keys, PageUp/Down, and Home/End are mapped to Numpad keys
|
|
33
|
+
const code = normalizeNumpadKeys(event);
|
|
34
|
+
const action = `${event.ctrlKey || event.metaKey ? 'meta+' : ''}${code}`;
|
|
32
35
|
return KEY_TO_ACTION[action];
|
|
33
36
|
}
|
|
34
37
|
move(value, action, activeView) {
|
package/esm2022/common/utils.mjs
CHANGED
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
3
3
|
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
4
|
*-------------------------------------------------------------------------------------------*/
|
|
5
|
+
import { Keys, normalizeNumpadKeys } from "@progress/kendo-angular-common";
|
|
5
6
|
/**
|
|
6
7
|
* @hidden
|
|
7
8
|
*/
|
|
@@ -44,18 +45,10 @@ export const isDateArray = (value) => Array.isArray(value) && value.length > 0 &
|
|
|
44
45
|
/**
|
|
45
46
|
* @hidden
|
|
46
47
|
*/
|
|
47
|
-
export const isArrowWithShiftPressed = (args) =>
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
*/
|
|
52
|
-
export var Keys;
|
|
53
|
-
(function (Keys) {
|
|
54
|
-
Keys[Keys["ArrowDown"] = 40] = "ArrowDown";
|
|
55
|
-
Keys[Keys["ArrowLeft"] = 37] = "ArrowLeft";
|
|
56
|
-
Keys[Keys["ArrowRight"] = 39] = "ArrowRight";
|
|
57
|
-
Keys[Keys["ArrowUp"] = 38] = "ArrowUp";
|
|
58
|
-
})(Keys || (Keys = {}));
|
|
48
|
+
export const isArrowWithShiftPressed = (args) => {
|
|
49
|
+
const code = normalizeNumpadKeys(args);
|
|
50
|
+
return args.shiftKey && (code === Keys.ArrowRight || code === Keys.ArrowLeft || code === Keys.ArrowDown || code === Keys.ArrowUp);
|
|
51
|
+
};
|
|
59
52
|
/**
|
|
60
53
|
* @hidden
|
|
61
54
|
*/
|
|
@@ -644,7 +644,7 @@ export class DateInputComponent {
|
|
|
644
644
|
this.control = formControl;
|
|
645
645
|
this.subs.add(this.formControl?.statusChanges.subscribe(() => this.setAriaInvalid()));
|
|
646
646
|
this.setAriaInvalid();
|
|
647
|
-
this.subs.add(this.dateInput?.nativeElement
|
|
647
|
+
this.subs.add(this.renderer.listen(this.dateInput?.nativeElement, 'keydown', this.handleKeyDown));
|
|
648
648
|
}
|
|
649
649
|
ngOnDestroy() {
|
|
650
650
|
this.subs.unsubscribe();
|
|
@@ -7,7 +7,7 @@ import { NG_VALUE_ACCESSOR, NG_VALIDATORS, NgControl } from '@angular/forms';
|
|
|
7
7
|
import { L10N_PREFIX, LocalizationService } from '@progress/kendo-angular-l10n';
|
|
8
8
|
import { PopupService } from '@progress/kendo-angular-popup';
|
|
9
9
|
import { cloneDate } from '@progress/kendo-date-math';
|
|
10
|
-
import { hasObservers, isControlRequired, KendoInput, Keys, MultiTabStop, ResizeSensorComponent, EventsOutsideAngularDirective } from '@progress/kendo-angular-common';
|
|
10
|
+
import { hasObservers, isControlRequired, KendoInput, Keys, MultiTabStop, ResizeSensorComponent, EventsOutsideAngularDirective, normalizeNumpadKeys } from '@progress/kendo-angular-common';
|
|
11
11
|
import { validatePackage } from '@progress/kendo-licensing';
|
|
12
12
|
import { packageMetadata } from '../package-metadata';
|
|
13
13
|
import { MIN_DATE, MAX_DATE } from '../defaults';
|
|
@@ -923,22 +923,23 @@ export class DatePickerComponent extends MultiTabStop {
|
|
|
923
923
|
* @hidden
|
|
924
924
|
*/
|
|
925
925
|
handleKeydown(e) {
|
|
926
|
-
const { altKey, shiftKey,
|
|
927
|
-
|
|
926
|
+
const { altKey, shiftKey, target } = e;
|
|
927
|
+
const code = normalizeNumpadKeys(e);
|
|
928
|
+
if (code === Keys.Escape) {
|
|
928
929
|
this.dateInput.focus();
|
|
929
930
|
this.show = false;
|
|
930
931
|
hasObservers(this.escape) && this.escape.emit();
|
|
931
932
|
}
|
|
932
933
|
if (altKey) {
|
|
933
|
-
if (
|
|
934
|
+
if (code === Keys.ArrowDown && !this.show) {
|
|
934
935
|
this.show = true;
|
|
935
936
|
}
|
|
936
|
-
if (
|
|
937
|
+
if (code === Keys.ArrowUp) {
|
|
937
938
|
this.dateInput.focus();
|
|
938
939
|
this.show = false;
|
|
939
940
|
}
|
|
940
941
|
}
|
|
941
|
-
if (
|
|
942
|
+
if (code === Keys.Tab && this.show && this.calendar.isActive && isTabExitingCalendar(this.calendarType, target, shiftKey)) {
|
|
942
943
|
this.dateInput.focus();
|
|
943
944
|
this.show = false;
|
|
944
945
|
}
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
*-------------------------------------------------------------------------------------------*/
|
|
5
5
|
import { ElementRef, Renderer2, NgZone, Directive } from '@angular/core';
|
|
6
6
|
import { cloneDate } from '@progress/kendo-date-math';
|
|
7
|
-
import { Keys } from '@progress/kendo-angular-common';
|
|
7
|
+
import { Keys, normalizeNumpadKeys } from '@progress/kendo-angular-common';
|
|
8
8
|
import { Subscription, fromEvent } from 'rxjs';
|
|
9
9
|
import { DateInputComponent } from '../dateinput/dateinput.component';
|
|
10
10
|
import { DateRangeService } from './date-range.service';
|
|
@@ -59,7 +59,7 @@ export class DateRangeInput {
|
|
|
59
59
|
this.dateRangeService.range$.subscribe(range => this.updateInputValue(range)),
|
|
60
60
|
fromEvent(this.element.nativeElement, 'click').subscribe(() => this.activate()),
|
|
61
61
|
fromEvent(this.element.nativeElement, 'keydown').subscribe((event) => this.togglePopup(event || {}))
|
|
62
|
-
].
|
|
62
|
+
].forEach(s => this.subscriptions.add(s));
|
|
63
63
|
}
|
|
64
64
|
destroy() {
|
|
65
65
|
this.subscriptions.unsubscribe();
|
|
@@ -107,11 +107,13 @@ export class DateRangeInput {
|
|
|
107
107
|
this.dateRangeService.setRange(range);
|
|
108
108
|
}
|
|
109
109
|
}
|
|
110
|
-
togglePopup(
|
|
111
|
-
|
|
110
|
+
togglePopup(e) {
|
|
111
|
+
const code = normalizeNumpadKeys(e);
|
|
112
|
+
const altKey = e.altKey;
|
|
113
|
+
if (code === Keys.Escape) {
|
|
112
114
|
this.dateRangeService.cancelPopup();
|
|
113
115
|
}
|
|
114
|
-
else if (altKey &&
|
|
116
|
+
else if (altKey && code === Keys.ArrowDown) {
|
|
115
117
|
this.dateRangeService.activatePopup();
|
|
116
118
|
}
|
|
117
119
|
}
|
|
@@ -9,7 +9,7 @@ import { DateRangePopupTemplateDirective } from './date-range-popup-template.dir
|
|
|
9
9
|
import { DateRangeService } from './date-range.service';
|
|
10
10
|
import { MultiViewCalendarComponent } from '../calendar/multiview-calendar.component';
|
|
11
11
|
import { PreventableEvent } from '../preventable-event';
|
|
12
|
-
import { isDocumentAvailable, guid, Keys, hasObservers, ResizeSensorComponent } from '@progress/kendo-angular-common';
|
|
12
|
+
import { isDocumentAvailable, guid, Keys, hasObservers, ResizeSensorComponent, normalizeNumpadKeys } from '@progress/kendo-angular-common';
|
|
13
13
|
import { AdaptiveService } from '@progress/kendo-angular-utils';
|
|
14
14
|
import { Subscription, fromEvent, merge } from 'rxjs';
|
|
15
15
|
import { filter, map } from 'rxjs/operators';
|
|
@@ -547,8 +547,9 @@ export class DateRangePopupComponent {
|
|
|
547
547
|
this.dateRangeService.setRange(this.dateRangeService.selectionRange);
|
|
548
548
|
}
|
|
549
549
|
handleKeydown(event) {
|
|
550
|
-
const { altKey
|
|
551
|
-
|
|
550
|
+
const { altKey } = event;
|
|
551
|
+
const code = normalizeNumpadKeys(event);
|
|
552
|
+
if (code === Keys.Escape || (altKey && code === Keys.ArrowUp)) {
|
|
552
553
|
this.zone.run(() => this.cancelPopup());
|
|
553
554
|
}
|
|
554
555
|
}
|
|
@@ -7,7 +7,7 @@ import { validatePackage } from '@progress/kendo-licensing';
|
|
|
7
7
|
import { packageMetadata } from '../package-metadata';
|
|
8
8
|
import { DateRangePopupComponent } from './date-range-popup.component';
|
|
9
9
|
import { DateRangeService } from './date-range.service';
|
|
10
|
-
import { Keys } from '@progress/kendo-angular-common';
|
|
10
|
+
import { Keys, normalizeNumpadKeys } from '@progress/kendo-angular-common';
|
|
11
11
|
import { NgIf } from '@angular/common';
|
|
12
12
|
import * as i0 from "@angular/core";
|
|
13
13
|
import * as i1 from "./date-range.service";
|
|
@@ -48,11 +48,12 @@ export class DateRangeComponent {
|
|
|
48
48
|
* @hidden
|
|
49
49
|
*/
|
|
50
50
|
keydown(event) {
|
|
51
|
-
const
|
|
51
|
+
const code = normalizeNumpadKeys(event);
|
|
52
|
+
const shouldOpenPopup = code === Keys.ArrowDown && event.altKey;
|
|
52
53
|
if (shouldOpenPopup) {
|
|
53
54
|
this.dateRangeService.activatePopup();
|
|
54
55
|
}
|
|
55
|
-
const shouldClosePopup = (
|
|
56
|
+
const shouldClosePopup = (code === Keys.ArrowUp && event.altKey) || code === Keys.Escape;
|
|
56
57
|
if (shouldClosePopup) {
|
|
57
58
|
this.dateRangeService.deactivatePopup();
|
|
58
59
|
}
|
|
@@ -9,7 +9,7 @@ import { tap } from 'rxjs/operators';
|
|
|
9
9
|
import { cloneDate, isEqual, getDate } from '@progress/kendo-date-math';
|
|
10
10
|
import { PopupService } from '@progress/kendo-angular-popup';
|
|
11
11
|
import { IntlService } from '@progress/kendo-angular-intl';
|
|
12
|
-
import { hasObservers, isControlRequired, KendoInput, Keys, MultiTabStop, ResizeSensorComponent, EventsOutsideAngularDirective } from '@progress/kendo-angular-common';
|
|
12
|
+
import { hasObservers, isControlRequired, KendoInput, Keys, MultiTabStop, ResizeSensorComponent, EventsOutsideAngularDirective, normalizeNumpadKeys } from '@progress/kendo-angular-common';
|
|
13
13
|
import { AdaptiveService } from '@progress/kendo-angular-utils';
|
|
14
14
|
import { LocalizationService, L10N_PREFIX } from '@progress/kendo-angular-l10n';
|
|
15
15
|
import { validatePackage } from '@progress/kendo-licensing';
|
|
@@ -1114,8 +1114,9 @@ export class DateTimePickerComponent extends MultiTabStop {
|
|
|
1114
1114
|
if (this.disabled || this.readonly) {
|
|
1115
1115
|
return;
|
|
1116
1116
|
}
|
|
1117
|
-
const {
|
|
1118
|
-
|
|
1117
|
+
const { altKey } = event;
|
|
1118
|
+
const code = normalizeNumpadKeys(event);
|
|
1119
|
+
switch (code) {
|
|
1119
1120
|
case altKey && Keys.ArrowUp:
|
|
1120
1121
|
case Keys.Escape:
|
|
1121
1122
|
this.handleCancel();
|
|
@@ -1370,8 +1371,8 @@ export class DateTimePickerComponent extends MultiTabStop {
|
|
|
1370
1371
|
this.popupRef.popupAnchorViewportLeave.subscribe(() => this.handleCancel());
|
|
1371
1372
|
if (this.calendar.type === 'infinite') {
|
|
1372
1373
|
this.subscriptions.add(fromEvent(this.calendar.monthView.list.nativeElement, 'keydown').subscribe((event) => {
|
|
1373
|
-
const {
|
|
1374
|
-
if (
|
|
1374
|
+
const { code, shiftKey } = event;
|
|
1375
|
+
if (code === Keys.Tab && !shiftKey) {
|
|
1375
1376
|
event.preventDefault();
|
|
1376
1377
|
if (!this.calendarValue && !this.cancelButton) {
|
|
1377
1378
|
this.dateTabButton.focus();
|
|
@@ -10,7 +10,7 @@ export const packageMetadata = {
|
|
|
10
10
|
productName: 'Kendo UI for Angular',
|
|
11
11
|
productCode: 'KENDOUIANGULAR',
|
|
12
12
|
productCodes: ['KENDOUIANGULAR'],
|
|
13
|
-
publishDate:
|
|
14
|
-
version: '19.3.0-develop.
|
|
13
|
+
publishDate: 1754589744,
|
|
14
|
+
version: '19.3.0-develop.33',
|
|
15
15
|
licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
|
|
16
16
|
};
|
|
@@ -17,7 +17,7 @@ import { MillisecondsService } from './services/milliseconds.service';
|
|
|
17
17
|
import { DayPeriodService } from './services/dayperiod.service';
|
|
18
18
|
import { closestInScope } from '../common/dom-queries';
|
|
19
19
|
import { LocalizationService } from '@progress/kendo-angular-l10n';
|
|
20
|
-
import { Keys, EventsOutsideAngularDirective } from '@progress/kendo-angular-common';
|
|
20
|
+
import { Keys, EventsOutsideAngularDirective, normalizeNumpadKeys } from '@progress/kendo-angular-common';
|
|
21
21
|
import { NgStyle, NgFor } from '@angular/common';
|
|
22
22
|
import * as i0 from "@angular/core";
|
|
23
23
|
import * as i1 from "./services/dom.service";
|
|
@@ -26,10 +26,10 @@ const SNAP_THRESHOLD = 0.05; //% of the item height
|
|
|
26
26
|
const SCROLL_THRESHOLD = 2; //< 2px threshold
|
|
27
27
|
const nil = () => (null);
|
|
28
28
|
const getters = {
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
29
|
+
[Keys.End]: (data, _) => data[data.length - 1],
|
|
30
|
+
[Keys.Home]: (data, _) => data[0],
|
|
31
|
+
[Keys.ArrowUp]: (data, index) => data[index - 1],
|
|
32
|
+
[Keys.ArrowDown]: (data, index) => data[index + 1]
|
|
33
33
|
};
|
|
34
34
|
const services = {
|
|
35
35
|
[TIME_PART.dayperiod]: DayPeriodService,
|
|
@@ -252,15 +252,16 @@ export class TimeListComponent {
|
|
|
252
252
|
return oldData && newData && oldData.text !== newData.text;
|
|
253
253
|
}
|
|
254
254
|
handleKeyDown(e) {
|
|
255
|
-
|
|
255
|
+
const code = normalizeNumpadKeys(e);
|
|
256
|
+
if (code === Keys.Tab && !e.shiftKey && this.isLast) {
|
|
256
257
|
e.preventDefault();
|
|
257
258
|
this.tabOutLastPart.emit();
|
|
258
259
|
}
|
|
259
|
-
if (
|
|
260
|
+
if (code === Keys.Tab && e.shiftKey && this.isFirst) {
|
|
260
261
|
e.preventDefault();
|
|
261
262
|
this.tabOutFirstPart.emit();
|
|
262
263
|
}
|
|
263
|
-
const getter = getters[
|
|
264
|
+
const getter = getters[code] || nil;
|
|
264
265
|
const dataItem = getter(this.data, this.service.selectedIndex(this.value));
|
|
265
266
|
if (dataItem) {
|
|
266
267
|
this.handleChange(dataItem);
|
|
@@ -7,7 +7,7 @@ import { NG_VALUE_ACCESSOR, NG_VALIDATORS, NgControl } from '@angular/forms';
|
|
|
7
7
|
import { L10N_PREFIX, LocalizationService } from '@progress/kendo-angular-l10n';
|
|
8
8
|
import { PopupService } from '@progress/kendo-angular-popup';
|
|
9
9
|
import { cloneDate, isEqual } from '@progress/kendo-date-math';
|
|
10
|
-
import { hasObservers, isControlRequired, KendoInput, Keys, MultiTabStop, ResizeSensorComponent, EventsOutsideAngularDirective } from '@progress/kendo-angular-common';
|
|
10
|
+
import { hasObservers, isControlRequired, KendoInput, Keys, MultiTabStop, ResizeSensorComponent, EventsOutsideAngularDirective, normalizeNumpadKeys } from '@progress/kendo-angular-common';
|
|
11
11
|
import { AdaptiveService } from '@progress/kendo-angular-utils';
|
|
12
12
|
import { validatePackage } from '@progress/kendo-licensing';
|
|
13
13
|
import { packageMetadata } from '../package-metadata';
|
|
@@ -551,8 +551,9 @@ export class TimePickerComponent extends MultiTabStop {
|
|
|
551
551
|
* @hidden
|
|
552
552
|
*/
|
|
553
553
|
handleKeydown(event) {
|
|
554
|
-
const { altKey
|
|
555
|
-
|
|
554
|
+
const { altKey } = event;
|
|
555
|
+
const code = normalizeNumpadKeys(event);
|
|
556
|
+
if (code === Keys.Escape) {
|
|
556
557
|
this.focusInput();
|
|
557
558
|
this.show = false;
|
|
558
559
|
hasObservers(this.escape) && this.escape.emit();
|
|
@@ -560,13 +561,13 @@ export class TimePickerComponent extends MultiTabStop {
|
|
|
560
561
|
return;
|
|
561
562
|
}
|
|
562
563
|
if (altKey) {
|
|
563
|
-
if (
|
|
564
|
+
if (code === Keys.ArrowUp) {
|
|
564
565
|
event.preventDefault();
|
|
565
566
|
this.focusInput();
|
|
566
567
|
this.show = false;
|
|
567
568
|
this.cdr.detectChanges();
|
|
568
569
|
}
|
|
569
|
-
if (
|
|
570
|
+
if (code === Keys.ArrowDown && !this.show) {
|
|
570
571
|
event.preventDefault();
|
|
571
572
|
this.show = true;
|
|
572
573
|
}
|
|
@@ -6,7 +6,7 @@ import { Component, ChangeDetectorRef, ChangeDetectionStrategy, ElementRef, Even
|
|
|
6
6
|
import { L10N_PREFIX, LocalizationService } from '@progress/kendo-angular-l10n';
|
|
7
7
|
import { IntlService } from '@progress/kendo-angular-intl';
|
|
8
8
|
import { cloneDate, getDate } from '@progress/kendo-date-math';
|
|
9
|
-
import { Keys, EventsOutsideAngularDirective } from '@progress/kendo-angular-common';
|
|
9
|
+
import { Keys, EventsOutsideAngularDirective, normalizeNumpadKeys } from '@progress/kendo-angular-common';
|
|
10
10
|
import { MIDNIGHT_DATE, MIN_TIME, MAX_TIME } from '../defaults';
|
|
11
11
|
import { TimeListComponent } from './timelist.component';
|
|
12
12
|
import { TimePickerDOMService } from './services/dom.service';
|
|
@@ -300,8 +300,8 @@ export class TimeSelectorComponent {
|
|
|
300
300
|
* @hidden
|
|
301
301
|
*/
|
|
302
302
|
handleTabOut(event) {
|
|
303
|
-
const {
|
|
304
|
-
if (event.target === this.now?.nativeElement &&
|
|
303
|
+
const { code, shiftKey } = event;
|
|
304
|
+
if (event.target === this.now?.nativeElement && code === Keys.Tab && shiftKey) {
|
|
305
305
|
event.preventDefault();
|
|
306
306
|
if (this.isDateTimePicker) {
|
|
307
307
|
this.tabOutNow.emit();
|
|
@@ -311,7 +311,7 @@ export class TimeSelectorComponent {
|
|
|
311
311
|
}
|
|
312
312
|
return;
|
|
313
313
|
}
|
|
314
|
-
if (
|
|
314
|
+
if (code === Keys.Tab && !shiftKey && event.target !== this.now?.nativeElement) {
|
|
315
315
|
event.preventDefault();
|
|
316
316
|
if (document.activeElement === this.accept.nativeElement) {
|
|
317
317
|
if (this.cancel) {
|
|
@@ -377,17 +377,18 @@ export class TimeSelectorComponent {
|
|
|
377
377
|
}
|
|
378
378
|
}
|
|
379
379
|
handleKeydown(args) {
|
|
380
|
-
const {
|
|
380
|
+
const { altKey } = args;
|
|
381
|
+
const code = normalizeNumpadKeys(args);
|
|
381
382
|
// reserve the alt + arrow key commands for the picker
|
|
382
|
-
const arrowKeyPressed = [Keys.ArrowLeft, Keys.ArrowRight].indexOf(
|
|
383
|
+
const arrowKeyPressed = [Keys.ArrowLeft, Keys.ArrowRight].indexOf(code) !== -1;
|
|
383
384
|
if (isPresent(this.pickerService) && arrowKeyPressed && altKey) {
|
|
384
385
|
return;
|
|
385
386
|
}
|
|
386
|
-
if (
|
|
387
|
+
if (code === Keys.Enter && !this.hasActiveButton()) {
|
|
387
388
|
this.handleAccept();
|
|
388
389
|
}
|
|
389
|
-
else if (
|
|
390
|
-
this.focusList(
|
|
390
|
+
else if (code === Keys.ArrowLeft || code === Keys.ArrowRight) {
|
|
391
|
+
this.focusList(code === Keys.ArrowLeft ? Direction.Left : Direction.Right);
|
|
391
392
|
}
|
|
392
393
|
}
|
|
393
394
|
emitBlur(args) {
|
|
@@ -9,7 +9,7 @@ import * as i1$1 from '@progress/kendo-angular-l10n';
|
|
|
9
9
|
import { ComponentMessages, LocalizationService, L10N_PREFIX, RTL } from '@progress/kendo-angular-l10n';
|
|
10
10
|
import { cloneDate, MS_PER_HOUR, MS_PER_MINUTE, addDays, getDate, isEqual, addDecades, addCenturies, firstDecadeOfCentury, lastDecadeOfCentury, lastYearOfDecade, firstYearOfDecade, createDate, lastMonthOfYear, lastDayOfMonth, durationInCenturies, addYears, durationInDecades, addWeeks, addMonths, firstDayOfMonth, dayOfWeek, durationInMonths, firstMonthOfYear, durationInYears, weekInYear } from '@progress/kendo-date-math';
|
|
11
11
|
import * as i19 from '@progress/kendo-angular-common';
|
|
12
|
-
import { isDocumentAvailable, EventsOutsideAngularDirective, guid,
|
|
12
|
+
import { normalizeNumpadKeys, Keys, isDocumentAvailable, EventsOutsideAngularDirective, guid, hasObservers, isObject, KendoInput, ResizeSensorComponent, isObjectPresent, removeHTMLAttributes, parseAttributes, anyChanged, isControlRequired, setHTMLAttributes, MultiTabStop, ToggleButtonTabStopDirective, ResizeBatchService, KENDO_TOGGLEBUTTONTABSTOP } from '@progress/kendo-angular-common';
|
|
13
13
|
export { ToggleButtonTabStopDirective } from '@progress/kendo-angular-common';
|
|
14
14
|
import { validatePackage } from '@progress/kendo-licensing';
|
|
15
15
|
import * as i1 from '@progress/kendo-angular-intl';
|
|
@@ -36,8 +36,8 @@ const packageMetadata = {
|
|
|
36
36
|
productName: 'Kendo UI for Angular',
|
|
37
37
|
productCode: 'KENDOUIANGULAR',
|
|
38
38
|
productCodes: ['KENDOUIANGULAR'],
|
|
39
|
-
publishDate:
|
|
40
|
-
version: '19.3.0-develop.
|
|
39
|
+
publishDate: 1754589744,
|
|
40
|
+
version: '19.3.0-develop.33',
|
|
41
41
|
licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
|
|
42
42
|
};
|
|
43
43
|
|
|
@@ -128,18 +128,10 @@ const isDateArray = (value) => Array.isArray(value) && value.length > 0 && value
|
|
|
128
128
|
/**
|
|
129
129
|
* @hidden
|
|
130
130
|
*/
|
|
131
|
-
const isArrowWithShiftPressed = (args) =>
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
*/
|
|
136
|
-
var Keys;
|
|
137
|
-
(function (Keys) {
|
|
138
|
-
Keys[Keys["ArrowDown"] = 40] = "ArrowDown";
|
|
139
|
-
Keys[Keys["ArrowLeft"] = 37] = "ArrowLeft";
|
|
140
|
-
Keys[Keys["ArrowRight"] = 39] = "ArrowRight";
|
|
141
|
-
Keys[Keys["ArrowUp"] = 38] = "ArrowUp";
|
|
142
|
-
})(Keys || (Keys = {}));
|
|
131
|
+
const isArrowWithShiftPressed = (args) => {
|
|
132
|
+
const code = normalizeNumpadKeys(args);
|
|
133
|
+
return args.shiftKey && (code === Keys.ArrowRight || code === Keys.ArrowLeft || code === Keys.ArrowDown || code === Keys.ArrowUp);
|
|
134
|
+
};
|
|
143
135
|
/**
|
|
144
136
|
* @hidden
|
|
145
137
|
*/
|
|
@@ -3352,16 +3344,16 @@ const disabledDatesRangeValidator = (isDateDisabled) => {
|
|
|
3352
3344
|
};
|
|
3353
3345
|
|
|
3354
3346
|
const KEY_TO_ACTION = {
|
|
3355
|
-
'
|
|
3356
|
-
'
|
|
3357
|
-
'
|
|
3358
|
-
'
|
|
3359
|
-
'
|
|
3360
|
-
'
|
|
3361
|
-
'
|
|
3362
|
-
'
|
|
3363
|
-
'meta+
|
|
3364
|
-
'meta+
|
|
3347
|
+
'PageUp': Action.PrevView,
|
|
3348
|
+
'PageDown': Action.NextView,
|
|
3349
|
+
'End': Action.LastInView,
|
|
3350
|
+
'Home': Action.FirstInView,
|
|
3351
|
+
'ArrowLeft': Action.Left,
|
|
3352
|
+
'ArrowUp': Action.Up,
|
|
3353
|
+
'ArrowRight': Action.Right,
|
|
3354
|
+
'ArrowDown': Action.Down,
|
|
3355
|
+
'meta+ArrowUp': Action.UpperView,
|
|
3356
|
+
'meta+ArrowDown': Action.LowerView
|
|
3365
3357
|
};
|
|
3366
3358
|
/**
|
|
3367
3359
|
* @hidden
|
|
@@ -3372,7 +3364,9 @@ class NavigationService {
|
|
|
3372
3364
|
this.bus = bus;
|
|
3373
3365
|
}
|
|
3374
3366
|
action(event) {
|
|
3375
|
-
|
|
3367
|
+
// on some keyboards arrow keys, PageUp/Down, and Home/End are mapped to Numpad keys
|
|
3368
|
+
const code = normalizeNumpadKeys(event);
|
|
3369
|
+
const action = `${event.ctrlKey || event.metaKey ? 'meta+' : ''}${code}`;
|
|
3376
3370
|
return KEY_TO_ACTION[action];
|
|
3377
3371
|
}
|
|
3378
3372
|
move(value, action, activeView) {
|
|
@@ -4269,16 +4263,17 @@ class MultiViewCalendarComponent {
|
|
|
4269
4263
|
* @hidden
|
|
4270
4264
|
*/
|
|
4271
4265
|
keydown(event) {
|
|
4272
|
-
const
|
|
4266
|
+
const code = normalizeNumpadKeys(event);
|
|
4267
|
+
const arrowUpOrDownKeyPressed = [Keys.ArrowUp, Keys.ArrowDown].indexOf(code) !== -1;
|
|
4273
4268
|
const ctrlKey = event.ctrlKey || event.metaKey;
|
|
4274
|
-
const onArrowRightAndControl =
|
|
4275
|
-
const onArrowLeftAndControl =
|
|
4276
|
-
const onTKeyPress =
|
|
4277
|
-
const onEnterKeyPress =
|
|
4278
|
-
const onArrowUpPress =
|
|
4269
|
+
const onArrowRightAndControl = code === Keys.ArrowRight && ctrlKey;
|
|
4270
|
+
const onArrowLeftAndControl = code === Keys.ArrowLeft && ctrlKey;
|
|
4271
|
+
const onTKeyPress = code === Keys.KeyT;
|
|
4272
|
+
const onEnterKeyPress = code === Keys.Enter;
|
|
4273
|
+
const onArrowUpPress = code === Keys.ArrowUp;
|
|
4279
4274
|
const altKey = event.altKey;
|
|
4280
|
-
const escKey =
|
|
4281
|
-
const tabKeyPress =
|
|
4275
|
+
const escKey = code === Keys.Escape;
|
|
4276
|
+
const tabKeyPress = code === Keys.Tab;
|
|
4282
4277
|
const shiftKeyPress = event.shiftKey;
|
|
4283
4278
|
if (onArrowRightAndControl) {
|
|
4284
4279
|
event.preventDefault();
|
|
@@ -7714,7 +7709,7 @@ class CalendarComponent {
|
|
|
7714
7709
|
*/
|
|
7715
7710
|
handleMultiViewCalendarKeydown(args) {
|
|
7716
7711
|
// Prevent form from submitting on enter if used in datepicker (classic view)
|
|
7717
|
-
if (isPresent(this.pickerService) && args.
|
|
7712
|
+
if (isPresent(this.pickerService) && (args.code === Keys.Enter || args.code === Keys.NumpadEnter)) {
|
|
7718
7713
|
args.preventDefault();
|
|
7719
7714
|
}
|
|
7720
7715
|
}
|
|
@@ -7795,7 +7790,8 @@ class CalendarComponent {
|
|
|
7795
7790
|
if (this.type === 'infinite') {
|
|
7796
7791
|
// reserve the alt + arrow key commands for the picker
|
|
7797
7792
|
const ctrlKey = args.ctrlKey || args.metaKey;
|
|
7798
|
-
const
|
|
7793
|
+
const code = normalizeNumpadKeys(args);
|
|
7794
|
+
const arrowKeyPressed = [Keys.ArrowUp, Keys.ArrowRight, Keys.ArrowDown, Keys.ArrowLeft].indexOf(code) !== -1;
|
|
7799
7795
|
const reserveKeyCommandsForPicker = isPresent(this.pickerService) && arrowKeyPressed && args.altKey;
|
|
7800
7796
|
if (reserveKeyCommandsForPicker) {
|
|
7801
7797
|
return;
|
|
@@ -7804,7 +7800,7 @@ class CalendarComponent {
|
|
|
7804
7800
|
args.preventDefault();
|
|
7805
7801
|
}
|
|
7806
7802
|
// Prevent form from submitting on enter if used in datepicker (infinite view)
|
|
7807
|
-
const preventSubmitInDatePicker = isPresent(this.pickerService) &&
|
|
7803
|
+
const preventSubmitInDatePicker = isPresent(this.pickerService) && code === Keys.Enter;
|
|
7808
7804
|
if (preventSubmitInDatePicker) {
|
|
7809
7805
|
args.preventDefault();
|
|
7810
7806
|
}
|
|
@@ -7814,7 +7810,7 @@ class CalendarComponent {
|
|
|
7814
7810
|
this.detectChanges();
|
|
7815
7811
|
args.preventDefault();
|
|
7816
7812
|
}
|
|
7817
|
-
if (
|
|
7813
|
+
if (code === Keys.Enter) {
|
|
7818
7814
|
this.selectionService.lastClicked = this.focusedDate;
|
|
7819
7815
|
if (this.selection !== 'range') {
|
|
7820
7816
|
this.performSelection(this.focusedDate, args);
|
|
@@ -7823,7 +7819,7 @@ class CalendarComponent {
|
|
|
7823
7819
|
this.performRangeSelection(this.focusedDate);
|
|
7824
7820
|
}
|
|
7825
7821
|
}
|
|
7826
|
-
if (
|
|
7822
|
+
if (code === Keys.KeyT) {
|
|
7827
7823
|
this.focusToday();
|
|
7828
7824
|
}
|
|
7829
7825
|
if (isArrowWithShiftPressed(args) && this.selection !== 'range') {
|
|
@@ -9077,7 +9073,7 @@ class DateInputComponent {
|
|
|
9077
9073
|
this.control = formControl;
|
|
9078
9074
|
this.subs.add(this.formControl?.statusChanges.subscribe(() => this.setAriaInvalid()));
|
|
9079
9075
|
this.setAriaInvalid();
|
|
9080
|
-
this.subs.add(this.dateInput?.nativeElement
|
|
9076
|
+
this.subs.add(this.renderer.listen(this.dateInput?.nativeElement, 'keydown', this.handleKeyDown));
|
|
9081
9077
|
}
|
|
9082
9078
|
ngOnDestroy() {
|
|
9083
9079
|
this.subs.unsubscribe();
|
|
@@ -10718,22 +10714,23 @@ class DatePickerComponent extends MultiTabStop {
|
|
|
10718
10714
|
* @hidden
|
|
10719
10715
|
*/
|
|
10720
10716
|
handleKeydown(e) {
|
|
10721
|
-
const { altKey, shiftKey,
|
|
10722
|
-
|
|
10717
|
+
const { altKey, shiftKey, target } = e;
|
|
10718
|
+
const code = normalizeNumpadKeys(e);
|
|
10719
|
+
if (code === Keys.Escape) {
|
|
10723
10720
|
this.dateInput.focus();
|
|
10724
10721
|
this.show = false;
|
|
10725
10722
|
hasObservers(this.escape) && this.escape.emit();
|
|
10726
10723
|
}
|
|
10727
10724
|
if (altKey) {
|
|
10728
|
-
if (
|
|
10725
|
+
if (code === Keys.ArrowDown && !this.show) {
|
|
10729
10726
|
this.show = true;
|
|
10730
10727
|
}
|
|
10731
|
-
if (
|
|
10728
|
+
if (code === Keys.ArrowUp) {
|
|
10732
10729
|
this.dateInput.focus();
|
|
10733
10730
|
this.show = false;
|
|
10734
10731
|
}
|
|
10735
10732
|
}
|
|
10736
|
-
if (
|
|
10733
|
+
if (code === Keys.Tab && this.show && this.calendar.isActive && isTabExitingCalendar(this.calendarType, target, shiftKey)) {
|
|
10737
10734
|
this.dateInput.focus();
|
|
10738
10735
|
this.show = false;
|
|
10739
10736
|
}
|
|
@@ -12261,10 +12258,10 @@ const SNAP_THRESHOLD = 0.05; //% of the item height
|
|
|
12261
12258
|
const SCROLL_THRESHOLD = 2; //< 2px threshold
|
|
12262
12259
|
const nil = () => (null);
|
|
12263
12260
|
const getters = {
|
|
12264
|
-
|
|
12265
|
-
|
|
12266
|
-
|
|
12267
|
-
|
|
12261
|
+
[Keys.End]: (data, _) => data[data.length - 1],
|
|
12262
|
+
[Keys.Home]: (data, _) => data[0],
|
|
12263
|
+
[Keys.ArrowUp]: (data, index) => data[index - 1],
|
|
12264
|
+
[Keys.ArrowDown]: (data, index) => data[index + 1]
|
|
12268
12265
|
};
|
|
12269
12266
|
const services = {
|
|
12270
12267
|
[TIME_PART.dayperiod]: DayPeriodService,
|
|
@@ -12487,15 +12484,16 @@ class TimeListComponent {
|
|
|
12487
12484
|
return oldData && newData && oldData.text !== newData.text;
|
|
12488
12485
|
}
|
|
12489
12486
|
handleKeyDown(e) {
|
|
12490
|
-
|
|
12487
|
+
const code = normalizeNumpadKeys(e);
|
|
12488
|
+
if (code === Keys.Tab && !e.shiftKey && this.isLast) {
|
|
12491
12489
|
e.preventDefault();
|
|
12492
12490
|
this.tabOutLastPart.emit();
|
|
12493
12491
|
}
|
|
12494
|
-
if (
|
|
12492
|
+
if (code === Keys.Tab && e.shiftKey && this.isFirst) {
|
|
12495
12493
|
e.preventDefault();
|
|
12496
12494
|
this.tabOutFirstPart.emit();
|
|
12497
12495
|
}
|
|
12498
|
-
const getter = getters[
|
|
12496
|
+
const getter = getters[code] || nil;
|
|
12499
12497
|
const dataItem = getter(this.data, this.service.selectedIndex(this.value));
|
|
12500
12498
|
if (dataItem) {
|
|
12501
12499
|
this.handleChange(dataItem);
|
|
@@ -13090,8 +13088,8 @@ class TimeSelectorComponent {
|
|
|
13090
13088
|
* @hidden
|
|
13091
13089
|
*/
|
|
13092
13090
|
handleTabOut(event) {
|
|
13093
|
-
const {
|
|
13094
|
-
if (event.target === this.now?.nativeElement &&
|
|
13091
|
+
const { code, shiftKey } = event;
|
|
13092
|
+
if (event.target === this.now?.nativeElement && code === Keys.Tab && shiftKey) {
|
|
13095
13093
|
event.preventDefault();
|
|
13096
13094
|
if (this.isDateTimePicker) {
|
|
13097
13095
|
this.tabOutNow.emit();
|
|
@@ -13101,7 +13099,7 @@ class TimeSelectorComponent {
|
|
|
13101
13099
|
}
|
|
13102
13100
|
return;
|
|
13103
13101
|
}
|
|
13104
|
-
if (
|
|
13102
|
+
if (code === Keys.Tab && !shiftKey && event.target !== this.now?.nativeElement) {
|
|
13105
13103
|
event.preventDefault();
|
|
13106
13104
|
if (document.activeElement === this.accept.nativeElement) {
|
|
13107
13105
|
if (this.cancel) {
|
|
@@ -13167,17 +13165,18 @@ class TimeSelectorComponent {
|
|
|
13167
13165
|
}
|
|
13168
13166
|
}
|
|
13169
13167
|
handleKeydown(args) {
|
|
13170
|
-
const {
|
|
13168
|
+
const { altKey } = args;
|
|
13169
|
+
const code = normalizeNumpadKeys(args);
|
|
13171
13170
|
// reserve the alt + arrow key commands for the picker
|
|
13172
|
-
const arrowKeyPressed = [Keys
|
|
13171
|
+
const arrowKeyPressed = [Keys.ArrowLeft, Keys.ArrowRight].indexOf(code) !== -1;
|
|
13173
13172
|
if (isPresent(this.pickerService) && arrowKeyPressed && altKey) {
|
|
13174
13173
|
return;
|
|
13175
13174
|
}
|
|
13176
|
-
if (
|
|
13175
|
+
if (code === Keys.Enter && !this.hasActiveButton()) {
|
|
13177
13176
|
this.handleAccept();
|
|
13178
13177
|
}
|
|
13179
|
-
else if (
|
|
13180
|
-
this.focusList(
|
|
13178
|
+
else if (code === Keys.ArrowLeft || code === Keys.ArrowRight) {
|
|
13179
|
+
this.focusList(code === Keys.ArrowLeft ? Direction.Left : Direction.Right);
|
|
13181
13180
|
}
|
|
13182
13181
|
}
|
|
13183
13182
|
emitBlur(args) {
|
|
@@ -14099,8 +14098,9 @@ class TimePickerComponent extends MultiTabStop {
|
|
|
14099
14098
|
* @hidden
|
|
14100
14099
|
*/
|
|
14101
14100
|
handleKeydown(event) {
|
|
14102
|
-
const { altKey
|
|
14103
|
-
|
|
14101
|
+
const { altKey } = event;
|
|
14102
|
+
const code = normalizeNumpadKeys(event);
|
|
14103
|
+
if (code === Keys.Escape) {
|
|
14104
14104
|
this.focusInput();
|
|
14105
14105
|
this.show = false;
|
|
14106
14106
|
hasObservers(this.escape) && this.escape.emit();
|
|
@@ -14108,13 +14108,13 @@ class TimePickerComponent extends MultiTabStop {
|
|
|
14108
14108
|
return;
|
|
14109
14109
|
}
|
|
14110
14110
|
if (altKey) {
|
|
14111
|
-
if (
|
|
14111
|
+
if (code === Keys.ArrowUp) {
|
|
14112
14112
|
event.preventDefault();
|
|
14113
14113
|
this.focusInput();
|
|
14114
14114
|
this.show = false;
|
|
14115
14115
|
this.cdr.detectChanges();
|
|
14116
14116
|
}
|
|
14117
|
-
if (
|
|
14117
|
+
if (code === Keys.ArrowDown && !this.show) {
|
|
14118
14118
|
event.preventDefault();
|
|
14119
14119
|
this.show = true;
|
|
14120
14120
|
}
|
|
@@ -16363,22 +16363,23 @@ class DateTimePickerComponent extends MultiTabStop {
|
|
|
16363
16363
|
if (this.disabled || this.readonly) {
|
|
16364
16364
|
return;
|
|
16365
16365
|
}
|
|
16366
|
-
const {
|
|
16367
|
-
|
|
16368
|
-
|
|
16369
|
-
case Keys
|
|
16366
|
+
const { altKey } = event;
|
|
16367
|
+
const code = normalizeNumpadKeys(event);
|
|
16368
|
+
switch (code) {
|
|
16369
|
+
case altKey && Keys.ArrowUp:
|
|
16370
|
+
case Keys.Escape:
|
|
16370
16371
|
this.handleCancel();
|
|
16371
16372
|
break;
|
|
16372
|
-
case !this.isOpen && altKey && Keys
|
|
16373
|
+
case !this.isOpen && altKey && Keys.ArrowDown:
|
|
16373
16374
|
this.ngZone.run(() => this.toggleDateTime(true));
|
|
16374
16375
|
break;
|
|
16375
|
-
case altKey && Keys
|
|
16376
|
+
case altKey && Keys.ArrowRight:
|
|
16376
16377
|
this.changeActiveTab('time');
|
|
16377
16378
|
break;
|
|
16378
|
-
case altKey && Keys
|
|
16379
|
+
case altKey && Keys.ArrowLeft:
|
|
16379
16380
|
this.changeActiveTab('date');
|
|
16380
16381
|
break;
|
|
16381
|
-
case this.isOpen && this.timeSelector.isActive && isPresent(this.calendarValue) && Keys
|
|
16382
|
+
case this.isOpen && this.timeSelector.isActive && isPresent(this.calendarValue) && Keys.Enter:
|
|
16382
16383
|
this.handleAccept();
|
|
16383
16384
|
break;
|
|
16384
16385
|
default: return;
|
|
@@ -16619,8 +16620,8 @@ class DateTimePickerComponent extends MultiTabStop {
|
|
|
16619
16620
|
this.popupRef.popupAnchorViewportLeave.subscribe(() => this.handleCancel());
|
|
16620
16621
|
if (this.calendar.type === 'infinite') {
|
|
16621
16622
|
this.subscriptions.add(fromEvent(this.calendar.monthView.list.nativeElement, 'keydown').subscribe((event) => {
|
|
16622
|
-
const {
|
|
16623
|
-
if (
|
|
16623
|
+
const { code, shiftKey } = event;
|
|
16624
|
+
if (code === Keys.Tab && !shiftKey) {
|
|
16624
16625
|
event.preventDefault();
|
|
16625
16626
|
if (!this.calendarValue && !this.cancelButton) {
|
|
16626
16627
|
this.dateTabButton.focus();
|
|
@@ -18798,8 +18799,9 @@ class DateRangePopupComponent {
|
|
|
18798
18799
|
this.dateRangeService.setRange(this.dateRangeService.selectionRange);
|
|
18799
18800
|
}
|
|
18800
18801
|
handleKeydown(event) {
|
|
18801
|
-
const { altKey
|
|
18802
|
-
|
|
18802
|
+
const { altKey } = event;
|
|
18803
|
+
const code = normalizeNumpadKeys(event);
|
|
18804
|
+
if (code === Keys.Escape || (altKey && code === Keys.ArrowUp)) {
|
|
18803
18805
|
this.zone.run(() => this.cancelPopup());
|
|
18804
18806
|
}
|
|
18805
18807
|
}
|
|
@@ -19328,11 +19330,12 @@ class DateRangeComponent {
|
|
|
19328
19330
|
* @hidden
|
|
19329
19331
|
*/
|
|
19330
19332
|
keydown(event) {
|
|
19331
|
-
const
|
|
19333
|
+
const code = normalizeNumpadKeys(event);
|
|
19334
|
+
const shouldOpenPopup = code === Keys.ArrowDown && event.altKey;
|
|
19332
19335
|
if (shouldOpenPopup) {
|
|
19333
19336
|
this.dateRangeService.activatePopup();
|
|
19334
19337
|
}
|
|
19335
|
-
const shouldClosePopup = (
|
|
19338
|
+
const shouldClosePopup = (code === Keys.ArrowUp && event.altKey) || code === Keys.Escape;
|
|
19336
19339
|
if (shouldClosePopup) {
|
|
19337
19340
|
this.dateRangeService.deactivatePopup();
|
|
19338
19341
|
}
|
|
@@ -19438,7 +19441,7 @@ class DateRangeInput {
|
|
|
19438
19441
|
this.dateRangeService.range$.subscribe(range => this.updateInputValue(range)),
|
|
19439
19442
|
fromEvent(this.element.nativeElement, 'click').subscribe(() => this.activate()),
|
|
19440
19443
|
fromEvent(this.element.nativeElement, 'keydown').subscribe((event) => this.togglePopup(event || {}))
|
|
19441
|
-
].
|
|
19444
|
+
].forEach(s => this.subscriptions.add(s));
|
|
19442
19445
|
}
|
|
19443
19446
|
destroy() {
|
|
19444
19447
|
this.subscriptions.unsubscribe();
|
|
@@ -19486,11 +19489,13 @@ class DateRangeInput {
|
|
|
19486
19489
|
this.dateRangeService.setRange(range);
|
|
19487
19490
|
}
|
|
19488
19491
|
}
|
|
19489
|
-
togglePopup(
|
|
19490
|
-
|
|
19492
|
+
togglePopup(e) {
|
|
19493
|
+
const code = normalizeNumpadKeys(e);
|
|
19494
|
+
const altKey = e.altKey;
|
|
19495
|
+
if (code === Keys.Escape) {
|
|
19491
19496
|
this.dateRangeService.cancelPopup();
|
|
19492
19497
|
}
|
|
19493
|
-
else if (altKey &&
|
|
19498
|
+
else if (altKey && code === Keys.ArrowDown) {
|
|
19494
19499
|
this.dateRangeService.activatePopup();
|
|
19495
19500
|
}
|
|
19496
19501
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@progress/kendo-angular-dateinputs",
|
|
3
|
-
"version": "19.3.0-develop.
|
|
3
|
+
"version": "19.3.0-develop.33",
|
|
4
4
|
"description": "Kendo UI for Angular Date Inputs Package - Everything you need to add date selection functionality to apps (DatePicker, TimePicker, DateInput, DateRangePicker, DateTimePicker, Calendar, and MultiViewCalendar).",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE.md",
|
|
6
6
|
"author": "Progress",
|
|
@@ -79,7 +79,7 @@
|
|
|
79
79
|
"package": {
|
|
80
80
|
"productName": "Kendo UI for Angular",
|
|
81
81
|
"productCode": "KENDOUIANGULAR",
|
|
82
|
-
"publishDate":
|
|
82
|
+
"publishDate": 1754589744,
|
|
83
83
|
"licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/"
|
|
84
84
|
}
|
|
85
85
|
},
|
|
@@ -90,19 +90,19 @@
|
|
|
90
90
|
"@angular/forms": "16 - 20",
|
|
91
91
|
"@angular/platform-browser": "16 - 20",
|
|
92
92
|
"@progress/kendo-licensing": "^1.7.0",
|
|
93
|
-
"@progress/kendo-angular-buttons": "19.3.0-develop.
|
|
94
|
-
"@progress/kendo-angular-common": "19.3.0-develop.
|
|
95
|
-
"@progress/kendo-angular-utils": "19.3.0-develop.
|
|
96
|
-
"@progress/kendo-angular-intl": "19.3.0-develop.
|
|
97
|
-
"@progress/kendo-angular-l10n": "19.3.0-develop.
|
|
98
|
-
"@progress/kendo-angular-icons": "19.3.0-develop.
|
|
99
|
-
"@progress/kendo-angular-popup": "19.3.0-develop.
|
|
100
|
-
"@progress/kendo-angular-navigation": "19.3.0-develop.
|
|
93
|
+
"@progress/kendo-angular-buttons": "19.3.0-develop.33",
|
|
94
|
+
"@progress/kendo-angular-common": "19.3.0-develop.33",
|
|
95
|
+
"@progress/kendo-angular-utils": "19.3.0-develop.33",
|
|
96
|
+
"@progress/kendo-angular-intl": "19.3.0-develop.33",
|
|
97
|
+
"@progress/kendo-angular-l10n": "19.3.0-develop.33",
|
|
98
|
+
"@progress/kendo-angular-icons": "19.3.0-develop.33",
|
|
99
|
+
"@progress/kendo-angular-popup": "19.3.0-develop.33",
|
|
100
|
+
"@progress/kendo-angular-navigation": "19.3.0-develop.33",
|
|
101
101
|
"rxjs": "^6.5.3 || ^7.0.0"
|
|
102
102
|
},
|
|
103
103
|
"dependencies": {
|
|
104
104
|
"tslib": "^2.3.1",
|
|
105
|
-
"@progress/kendo-angular-schematics": "19.3.0-develop.
|
|
105
|
+
"@progress/kendo-angular-schematics": "19.3.0-develop.33",
|
|
106
106
|
"@progress/kendo-common": "^1.0.1",
|
|
107
107
|
"@progress/kendo-date-math": "^1.1.0",
|
|
108
108
|
"@progress/kendo-dateinputs-common": "^0.4.4",
|
|
@@ -1,37 +0,0 @@
|
|
|
1
|
-
/**-----------------------------------------------------------------------------------------
|
|
2
|
-
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
3
|
-
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
-
*-------------------------------------------------------------------------------------------*/
|
|
5
|
-
/**
|
|
6
|
-
* @hidden
|
|
7
|
-
*/
|
|
8
|
-
export interface KeyDown {
|
|
9
|
-
/**
|
|
10
|
-
* @hidden
|
|
11
|
-
*/
|
|
12
|
-
keyCode: number;
|
|
13
|
-
/**
|
|
14
|
-
* @hidden
|
|
15
|
-
*/
|
|
16
|
-
ctrlKey?: boolean;
|
|
17
|
-
/**
|
|
18
|
-
* @hidden
|
|
19
|
-
*/
|
|
20
|
-
metaKey?: boolean;
|
|
21
|
-
/**
|
|
22
|
-
* @hidden
|
|
23
|
-
*/
|
|
24
|
-
shiftKey?: boolean;
|
|
25
|
-
/**
|
|
26
|
-
* @hidden
|
|
27
|
-
*/
|
|
28
|
-
preventDefault?: Function;
|
|
29
|
-
/**
|
|
30
|
-
* @hidden
|
|
31
|
-
*/
|
|
32
|
-
stopPropagation?: Function;
|
|
33
|
-
/**
|
|
34
|
-
* @hidden
|
|
35
|
-
*/
|
|
36
|
-
altKey: boolean;
|
|
37
|
-
}
|
|
@@ -1,5 +0,0 @@
|
|
|
1
|
-
/**-----------------------------------------------------------------------------------------
|
|
2
|
-
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
3
|
-
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
-
*-------------------------------------------------------------------------------------------*/
|
|
5
|
-
export {};
|