@progress/kendo-angular-dateinputs 17.0.0-develop.20 → 17.0.0-develop.21

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.
Files changed (8) hide show
  1. package/esm2020/datetimepicker/datetimepicker.component.mjs +36 -26
  2. package/esm2020/package-metadata.mjs +2 -2
  3. package/esm2020/timepicker/timepicker.component.mjs +32 -23
  4. package/esm2020/timepicker/timeselector.component.mjs +1 -1
  5. package/fesm2015/progress-kendo-angular-dateinputs.mjs +74 -55
  6. package/fesm2020/progress-kendo-angular-dateinputs.mjs +71 -52
  7. package/package.json +9 -9
  8. package/timepicker/timepicker.component.d.ts +1 -0
package/esm2020/datetimepicker/datetimepicker.component.mjs CHANGED
@@ -657,10 +657,20 @@ export class DateTimePickerComponent extends MultiTabStop {
657
657
  }
658
658
  }
659
659
  get dateTabButton() {
660
- return this.popupRef?.popup.instance.container.nativeElement.querySelector(DATE_TAB_BUTTON_SELECTOR);
660
+ if (this.isAdaptive) {
661
+ return this.actionSheet.element.nativeElement.querySelector(DATE_TAB_BUTTON_SELECTOR);
662
+ }
663
+ else {
664
+ return this.popupRef?.popup.instance.container.nativeElement.querySelector(DATE_TAB_BUTTON_SELECTOR);
665
+ }
661
666
  }
662
667
  get timeTabButton() {
663
- return this.popupRef?.popup.instance.container.nativeElement.querySelector(TIME_TAB_BUTTON_SELECTOR);
668
+ if (this.isAdaptive) {
669
+ return this.actionSheet.element.nativeElement.querySelector(TIME_TAB_BUTTON_SELECTOR);
670
+ }
671
+ else {
672
+ return this.popupRef?.popup.instance.container.nativeElement.querySelector(TIME_TAB_BUTTON_SELECTOR);
673
+ }
664
674
  }
665
675
  /**
666
676
  * @hidden
@@ -1531,6 +1541,18 @@ DateTimePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0"
1531
1541
  <ng-container *ngTemplateOutlet="dateTimeTemplate"></ng-container>
1532
1542
  </div>
1533
1543
  <div class="k-actions k-actions-stretched k-actions-horizontal k-actionsheet-footer">
1544
+ <button kendoButton
1545
+ *ngIf="cancelButton"
1546
+ class="k-time-cancel"
1547
+ type="button"
1548
+ (click)="handleCancel()"
1549
+ size="large"
1550
+ [attr.title]="localization.get('cancelLabel')"
1551
+ [attr.aria-label]="localization.get('cancelLabel')"
1552
+ >
1553
+ {{localization.get('cancel')}}
1554
+ </button>
1555
+
1534
1556
  <button kendoButton
1535
1557
  type="button"
1536
1558
  class="k-time-accept"
@@ -1543,18 +1565,6 @@ DateTimePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0"
1543
1565
  >
1544
1566
  {{localization.get('accept')}}
1545
1567
  </button>
1546
-
1547
- <button kendoButton
1548
- *ngIf="cancelButton"
1549
- class="k-time-cancel"
1550
- type="button"
1551
- (click)="handleCancel()"
1552
- size="large"
1553
- [attr.title]="localization.get('cancelLabel')"
1554
- [attr.aria-label]="localization.get('cancelLabel')"
1555
- >
1556
- {{localization.get('cancel')}}
1557
- </button>
1558
1568
  </div>
1559
1569
  </ng-template>
1560
1570
  </kendo-actionsheet>
@@ -1934,6 +1944,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
1934
1944
  <ng-container *ngTemplateOutlet="dateTimeTemplate"></ng-container>
1935
1945
  </div>
1936
1946
  <div class="k-actions k-actions-stretched k-actions-horizontal k-actionsheet-footer">
1947
+ <button kendoButton
1948
+ *ngIf="cancelButton"
1949
+ class="k-time-cancel"
1950
+ type="button"
1951
+ (click)="handleCancel()"
1952
+ size="large"
1953
+ [attr.title]="localization.get('cancelLabel')"
1954
+ [attr.aria-label]="localization.get('cancelLabel')"
1955
+ >
1956
+ {{localization.get('cancel')}}
1957
+ </button>
1958
+
1937
1959
  <button kendoButton
1938
1960
  type="button"
1939
1961
  class="k-time-accept"
@@ -1946,18 +1968,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
1946
1968
  >
1947
1969
  {{localization.get('accept')}}
1948
1970
  </button>
1949
-
1950
- <button kendoButton
1951
- *ngIf="cancelButton"
1952
- class="k-time-cancel"
1953
- type="button"
1954
- (click)="handleCancel()"
1955
- size="large"
1956
- [attr.title]="localization.get('cancelLabel')"
1957
- [attr.aria-label]="localization.get('cancelLabel')"
1958
- >
1959
- {{localization.get('cancel')}}
1960
- </button>
1961
1971
  </div>
1962
1972
  </ng-template>
1963
1973
  </kendo-actionsheet>
package/esm2020/package-metadata.mjs CHANGED
@@ -9,7 +9,7 @@ export const packageMetadata = {
9
9
  name: '@progress/kendo-angular-dateinputs',
10
10
  productName: 'Kendo UI for Angular',
11
11
  productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
12
- publishDate: 1729855087,
13
- version: '17.0.0-develop.20',
12
+ publishDate: 1729874227,
13
+ version: '17.0.0-develop.21',
14
14
  licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
15
15
  };
package/esm2020/timepicker/timepicker.component.mjs CHANGED
@@ -42,6 +42,7 @@ const VALUE_DOC_LINK = 'https://www.telerik.com/kendo-angular-ui/components/date
42
42
  const INTL_DATE_FORMAT = 'https://github.com/telerik/kendo-intl/blob/master/docs/date-formatting/index.md';
43
43
  const formatRegExp = new RegExp(`${TIME_PART.hour}|${TIME_PART.minute}|${TIME_PART.second}|${TIME_PART.millisecond}|${TIME_PART.dayperiod}|literal`);
44
44
  const ACCEPT_BUTTON_SELECTOR = '.k-button.k-time-accept';
45
+ const CANCEL_BUTTON_SELECTOR = '.k-button.k-time-cancel';
45
46
  /**
46
47
  * Represents the [Kendo UI TimePicker component for Angular](slug:overview_timepicker).
47
48
  */
@@ -455,6 +456,9 @@ export class TimePickerComponent extends MultiTabStop {
455
456
  get adaptiveAcceptButton() {
456
457
  return this.actionSheet.element.nativeElement.querySelector(ACCEPT_BUTTON_SELECTOR);
457
458
  }
459
+ get adaptiveCancelButton() {
460
+ return this.actionSheet.element.nativeElement.querySelector(CANCEL_BUTTON_SELECTOR);
461
+ }
458
462
  get inputElement() {
459
463
  return this.wrapper.nativeElement.querySelector('input');
460
464
  }
@@ -775,7 +779,12 @@ export class TimePickerComponent extends MultiTabStop {
775
779
  * @hidden
776
780
  */
777
781
  onTabOutLastPart() {
778
- this.isAdaptive ? this.adaptiveAcceptButton.focus() : this.timeSelector.accept.nativeElement.focus();
782
+ if (this.isAdaptive) {
783
+ this.cancelButton ? this.adaptiveCancelButton.focus() : this.adaptiveAcceptButton.focus();
784
+ }
785
+ else {
786
+ this.timeSelector.accept.nativeElement.focus();
787
+ }
779
788
  }
780
789
  toggleTimeSelector(show) {
781
790
  this.windowSize = windowSize();
@@ -1119,6 +1128,17 @@ TimePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ve
1119
1128
  <ng-container *ngTemplateOutlet="timeSelectorTemplate"></ng-container>
1120
1129
  </div>
1121
1130
  <div class="k-actions k-actions-stretched k-actions-horizontal k-actionsheet-footer">
1131
+ <button kendoButton
1132
+ type="button"
1133
+ (click)="handleReject()"
1134
+ size="large"
1135
+ class="k-time-cancel"
1136
+ [attr.title]="localization.get('cancelLabel')"
1137
+ [attr.aria-label]="localization.get('cancelLabel')"
1138
+ >
1139
+ {{localization.get('cancel')}}
1140
+ </button>
1141
+
1122
1142
  <button kendoButton
1123
1143
  type="button"
1124
1144
  (click)="handleActionSheetAccept()"
@@ -1130,17 +1150,6 @@ TimePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ve
1130
1150
  >
1131
1151
  {{localization.get('accept')}}
1132
1152
  </button>
1133
-
1134
- <button kendoButton
1135
- type="button"
1136
- (click)="handleReject()"
1137
- size="large"
1138
- class="k-time-cancel"
1139
- [attr.title]="localization.get('cancelLabel')"
1140
- [attr.aria-label]="localization.get('cancelLabel')"
1141
- >
1142
- {{localization.get('cancel')}}
1143
- </button>
1144
1153
  </div>
1145
1154
  </ng-template>
1146
1155
  </kendo-actionsheet>
@@ -1343,6 +1352,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
1343
1352
  <ng-container *ngTemplateOutlet="timeSelectorTemplate"></ng-container>
1344
1353
  </div>
1345
1354
  <div class="k-actions k-actions-stretched k-actions-horizontal k-actionsheet-footer">
1355
+ <button kendoButton
1356
+ type="button"
1357
+ (click)="handleReject()"
1358
+ size="large"
1359
+ class="k-time-cancel"
1360
+ [attr.title]="localization.get('cancelLabel')"
1361
+ [attr.aria-label]="localization.get('cancelLabel')"
1362
+ >
1363
+ {{localization.get('cancel')}}
1364
+ </button>
1365
+
1346
1366
  <button kendoButton
1347
1367
  type="button"
1348
1368
  (click)="handleActionSheetAccept()"
@@ -1354,17 +1374,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
1354
1374
  >
1355
1375
  {{localization.get('accept')}}
1356
1376
  </button>
1357
-
1358
- <button kendoButton
1359
- type="button"
1360
- (click)="handleReject()"
1361
- size="large"
1362
- class="k-time-cancel"
1363
- [attr.title]="localization.get('cancelLabel')"
1364
- [attr.aria-label]="localization.get('cancelLabel')"
1365
- >
1366
- {{localization.get('cancel')}}
1367
- </button>
1368
1377
  </div>
1369
1378
  </ng-template>
1370
1379
  </kendo-actionsheet>
package/esm2020/timepicker/timeselector.component.mjs CHANGED
@@ -316,7 +316,7 @@ export class TimeSelectorComponent {
316
316
  this.tabOutNow.emit();
317
317
  }
318
318
  else {
319
- this.cancel ? this.cancel.nativeElement.focus() : this.accept.nativeElement.focus();
319
+ this.cancel ? this.cancel.nativeElement.focus() : this.accept?.nativeElement.focus();
320
320
  }
321
321
  return;
322
322
  }
package/fesm2015/progress-kendo-angular-dateinputs.mjs CHANGED
@@ -35,8 +35,8 @@ const packageMetadata = {
35
35
  name: '@progress/kendo-angular-dateinputs',
36
36
  productName: 'Kendo UI for Angular',
37
37
  productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
38
- publishDate: 1729855087,
39
- version: '17.0.0-develop.20',
38
+ publishDate: 1729874227,
39
+ version: '17.0.0-develop.21',
40
40
  licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
41
41
  };
42
42
 
@@ -12417,7 +12417,7 @@ class TimeSelectorComponent {
12417
12417
  * @hidden
12418
12418
  */
12419
12419
  handleTabOut(event) {
12420
- var _a, _b, _c;
12420
+ var _a, _b, _c, _d;
12421
12421
  const { keyCode, shiftKey } = event;
12422
12422
  if (event.target === ((_a = this.now) === null || _a === void 0 ? void 0 : _a.nativeElement) && keyCode === Keys$1.Tab && shiftKey) {
12423
12423
  event.preventDefault();
@@ -12425,14 +12425,14 @@ class TimeSelectorComponent {
12425
12425
  this.tabOutNow.emit();
12426
12426
  }
12427
12427
  else {
12428
- this.cancel ? this.cancel.nativeElement.focus() : this.accept.nativeElement.focus();
12428
+ this.cancel ? this.cancel.nativeElement.focus() : (_b = this.accept) === null || _b === void 0 ? void 0 : _b.nativeElement.focus();
12429
12429
  }
12430
12430
  return;
12431
12431
  }
12432
- if (keyCode === Keys$1.Tab && !shiftKey && event.target !== ((_b = this.now) === null || _b === void 0 ? void 0 : _b.nativeElement)) {
12432
+ if (keyCode === Keys$1.Tab && !shiftKey && event.target !== ((_c = this.now) === null || _c === void 0 ? void 0 : _c.nativeElement)) {
12433
12433
  event.preventDefault();
12434
12434
  if (document.activeElement === this.accept.nativeElement) {
12435
- this.cancel ? this.cancel.nativeElement.focus() : (_c = this.now) === null || _c === void 0 ? void 0 : _c.nativeElement.focus();
12435
+ this.cancel ? this.cancel.nativeElement.focus() : (_d = this.now) === null || _d === void 0 ? void 0 : _d.nativeElement.focus();
12436
12436
  }
12437
12437
  else {
12438
12438
  this.now ? this.now.nativeElement.focus() : this.timeLists.first.focus();
@@ -12909,6 +12909,7 @@ const VALUE_DOC_LINK$1 = 'https://www.telerik.com/kendo-angular-ui/components/da
12909
12909
  const INTL_DATE_FORMAT = 'https://github.com/telerik/kendo-intl/blob/master/docs/date-formatting/index.md';
12910
12910
  const formatRegExp = new RegExp(`${TIME_PART.hour}|${TIME_PART.minute}|${TIME_PART.second}|${TIME_PART.millisecond}|${TIME_PART.dayperiod}|literal`);
12911
12911
  const ACCEPT_BUTTON_SELECTOR$1 = '.k-button.k-time-accept';
12912
+ const CANCEL_BUTTON_SELECTOR = '.k-button.k-time-cancel';
12912
12913
  /**
12913
12914
  * Represents the [Kendo UI TimePicker component for Angular](slug:overview_timepicker).
12914
12915
  */
@@ -13322,6 +13323,9 @@ class TimePickerComponent extends MultiTabStop {
13322
13323
  get adaptiveAcceptButton() {
13323
13324
  return this.actionSheet.element.nativeElement.querySelector(ACCEPT_BUTTON_SELECTOR$1);
13324
13325
  }
13326
+ get adaptiveCancelButton() {
13327
+ return this.actionSheet.element.nativeElement.querySelector(CANCEL_BUTTON_SELECTOR);
13328
+ }
13325
13329
  get inputElement() {
13326
13330
  return this.wrapper.nativeElement.querySelector('input');
13327
13331
  }
@@ -13644,7 +13648,12 @@ class TimePickerComponent extends MultiTabStop {
13644
13648
  * @hidden
13645
13649
  */
13646
13650
  onTabOutLastPart() {
13647
- this.isAdaptive ? this.adaptiveAcceptButton.focus() : this.timeSelector.accept.nativeElement.focus();
13651
+ if (this.isAdaptive) {
13652
+ this.cancelButton ? this.adaptiveCancelButton.focus() : this.adaptiveAcceptButton.focus();
13653
+ }
13654
+ else {
13655
+ this.timeSelector.accept.nativeElement.focus();
13656
+ }
13648
13657
  }
13649
13658
  toggleTimeSelector(show) {
13650
13659
  this.windowSize = windowSize();
@@ -13990,6 +13999,17 @@ TimePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ve
13990
13999
  <ng-container *ngTemplateOutlet="timeSelectorTemplate"></ng-container>
13991
14000
  </div>
13992
14001
  <div class="k-actions k-actions-stretched k-actions-horizontal k-actionsheet-footer">
14002
+ <button kendoButton
14003
+ type="button"
14004
+ (click)="handleReject()"
14005
+ size="large"
14006
+ class="k-time-cancel"
14007
+ [attr.title]="localization.get('cancelLabel')"
14008
+ [attr.aria-label]="localization.get('cancelLabel')"
14009
+ >
14010
+ {{localization.get('cancel')}}
14011
+ </button>
14012
+
13993
14013
  <button kendoButton
13994
14014
  type="button"
13995
14015
  (click)="handleActionSheetAccept()"
@@ -14001,17 +14021,6 @@ TimePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ve
14001
14021
  >
14002
14022
  {{localization.get('accept')}}
14003
14023
  </button>
14004
-
14005
- <button kendoButton
14006
- type="button"
14007
- (click)="handleReject()"
14008
- size="large"
14009
- class="k-time-cancel"
14010
- [attr.title]="localization.get('cancelLabel')"
14011
- [attr.aria-label]="localization.get('cancelLabel')"
14012
- >
14013
- {{localization.get('cancel')}}
14014
- </button>
14015
14024
  </div>
14016
14025
  </ng-template>
14017
14026
  </kendo-actionsheet>
@@ -14214,6 +14223,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
14214
14223
  <ng-container *ngTemplateOutlet="timeSelectorTemplate"></ng-container>
14215
14224
  </div>
14216
14225
  <div class="k-actions k-actions-stretched k-actions-horizontal k-actionsheet-footer">
14226
+ <button kendoButton
14227
+ type="button"
14228
+ (click)="handleReject()"
14229
+ size="large"
14230
+ class="k-time-cancel"
14231
+ [attr.title]="localization.get('cancelLabel')"
14232
+ [attr.aria-label]="localization.get('cancelLabel')"
14233
+ >
14234
+ {{localization.get('cancel')}}
14235
+ </button>
14236
+
14217
14237
  <button kendoButton
14218
14238
  type="button"
14219
14239
  (click)="handleActionSheetAccept()"
@@ -14225,17 +14245,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
14225
14245
  >
14226
14246
  {{localization.get('accept')}}
14227
14247
  </button>
14228
-
14229
- <button kendoButton
14230
- type="button"
14231
- (click)="handleReject()"
14232
- size="large"
14233
- class="k-time-cancel"
14234
- [attr.title]="localization.get('cancelLabel')"
14235
- [attr.aria-label]="localization.get('cancelLabel')"
14236
- >
14237
- {{localization.get('cancel')}}
14238
- </button>
14239
14248
  </div>
14240
14249
  </ng-template>
14241
14250
  </kendo-actionsheet>
@@ -15079,11 +15088,21 @@ class DateTimePickerComponent extends MultiTabStop {
15079
15088
  }
15080
15089
  get dateTabButton() {
15081
15090
  var _a;
15082
- return (_a = this.popupRef) === null || _a === void 0 ? void 0 : _a.popup.instance.container.nativeElement.querySelector(DATE_TAB_BUTTON_SELECTOR);
15091
+ if (this.isAdaptive) {
15092
+ return this.actionSheet.element.nativeElement.querySelector(DATE_TAB_BUTTON_SELECTOR);
15093
+ }
15094
+ else {
15095
+ return (_a = this.popupRef) === null || _a === void 0 ? void 0 : _a.popup.instance.container.nativeElement.querySelector(DATE_TAB_BUTTON_SELECTOR);
15096
+ }
15083
15097
  }
15084
15098
  get timeTabButton() {
15085
15099
  var _a;
15086
- return (_a = this.popupRef) === null || _a === void 0 ? void 0 : _a.popup.instance.container.nativeElement.querySelector(TIME_TAB_BUTTON_SELECTOR);
15100
+ if (this.isAdaptive) {
15101
+ return this.actionSheet.element.nativeElement.querySelector(TIME_TAB_BUTTON_SELECTOR);
15102
+ }
15103
+ else {
15104
+ return (_a = this.popupRef) === null || _a === void 0 ? void 0 : _a.popup.instance.container.nativeElement.querySelector(TIME_TAB_BUTTON_SELECTOR);
15105
+ }
15087
15106
  }
15088
15107
  /**
15089
15108
  * @hidden
@@ -15960,6 +15979,18 @@ DateTimePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0"
15960
15979
  <ng-container *ngTemplateOutlet="dateTimeTemplate"></ng-container>
15961
15980
  </div>
15962
15981
  <div class="k-actions k-actions-stretched k-actions-horizontal k-actionsheet-footer">
15982
+ <button kendoButton
15983
+ *ngIf="cancelButton"
15984
+ class="k-time-cancel"
15985
+ type="button"
15986
+ (click)="handleCancel()"
15987
+ size="large"
15988
+ [attr.title]="localization.get('cancelLabel')"
15989
+ [attr.aria-label]="localization.get('cancelLabel')"
15990
+ >
15991
+ {{localization.get('cancel')}}
15992
+ </button>
15993
+
15963
15994
  <button kendoButton
15964
15995
  type="button"
15965
15996
  class="k-time-accept"
@@ -15972,18 +16003,6 @@ DateTimePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0"
15972
16003
  >
15973
16004
  {{localization.get('accept')}}
15974
16005
  </button>
15975
-
15976
- <button kendoButton
15977
- *ngIf="cancelButton"
15978
- class="k-time-cancel"
15979
- type="button"
15980
- (click)="handleCancel()"
15981
- size="large"
15982
- [attr.title]="localization.get('cancelLabel')"
15983
- [attr.aria-label]="localization.get('cancelLabel')"
15984
- >
15985
- {{localization.get('cancel')}}
15986
- </button>
15987
16006
  </div>
15988
16007
  </ng-template>
15989
16008
  </kendo-actionsheet>
@@ -16363,6 +16382,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
16363
16382
  <ng-container *ngTemplateOutlet="dateTimeTemplate"></ng-container>
16364
16383
  </div>
16365
16384
  <div class="k-actions k-actions-stretched k-actions-horizontal k-actionsheet-footer">
16385
+ <button kendoButton
16386
+ *ngIf="cancelButton"
16387
+ class="k-time-cancel"
16388
+ type="button"
16389
+ (click)="handleCancel()"
16390
+ size="large"
16391
+ [attr.title]="localization.get('cancelLabel')"
16392
+ [attr.aria-label]="localization.get('cancelLabel')"
16393
+ >
16394
+ {{localization.get('cancel')}}
16395
+ </button>
16396
+
16366
16397
  <button kendoButton
16367
16398
  type="button"
16368
16399
  class="k-time-accept"
@@ -16375,18 +16406,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
16375
16406
  >
16376
16407
  {{localization.get('accept')}}
16377
16408
  </button>
16378
-
16379
- <button kendoButton
16380
- *ngIf="cancelButton"
16381
- class="k-time-cancel"
16382
- type="button"
16383
- (click)="handleCancel()"
16384
- size="large"
16385
- [attr.title]="localization.get('cancelLabel')"
16386
- [attr.aria-label]="localization.get('cancelLabel')"
16387
- >
16388
- {{localization.get('cancel')}}
16389
- </button>
16390
16409
  </div>
16391
16410
  </ng-template>
16392
16411
  </kendo-actionsheet>
package/fesm2020/progress-kendo-angular-dateinputs.mjs CHANGED
@@ -35,8 +35,8 @@ const packageMetadata = {
35
35
  name: '@progress/kendo-angular-dateinputs',
36
36
  productName: 'Kendo UI for Angular',
37
37
  productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
38
- publishDate: 1729855087,
39
- version: '17.0.0-develop.20',
38
+ publishDate: 1729874227,
39
+ version: '17.0.0-develop.21',
40
40
  licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
41
41
  };
42
42
 
@@ -12397,7 +12397,7 @@ class TimeSelectorComponent {
12397
12397
  this.tabOutNow.emit();
12398
12398
  }
12399
12399
  else {
12400
- this.cancel ? this.cancel.nativeElement.focus() : this.accept.nativeElement.focus();
12400
+ this.cancel ? this.cancel.nativeElement.focus() : this.accept?.nativeElement.focus();
12401
12401
  }
12402
12402
  return;
12403
12403
  }
@@ -12879,6 +12879,7 @@ const VALUE_DOC_LINK$1 = 'https://www.telerik.com/kendo-angular-ui/components/da
12879
12879
  const INTL_DATE_FORMAT = 'https://github.com/telerik/kendo-intl/blob/master/docs/date-formatting/index.md';
12880
12880
  const formatRegExp = new RegExp(`${TIME_PART.hour}|${TIME_PART.minute}|${TIME_PART.second}|${TIME_PART.millisecond}|${TIME_PART.dayperiod}|literal`);
12881
12881
  const ACCEPT_BUTTON_SELECTOR$1 = '.k-button.k-time-accept';
12882
+ const CANCEL_BUTTON_SELECTOR = '.k-button.k-time-cancel';
12882
12883
  /**
12883
12884
  * Represents the [Kendo UI TimePicker component for Angular](slug:overview_timepicker).
12884
12885
  */
@@ -13292,6 +13293,9 @@ class TimePickerComponent extends MultiTabStop {
13292
13293
  get adaptiveAcceptButton() {
13293
13294
  return this.actionSheet.element.nativeElement.querySelector(ACCEPT_BUTTON_SELECTOR$1);
13294
13295
  }
13296
+ get adaptiveCancelButton() {
13297
+ return this.actionSheet.element.nativeElement.querySelector(CANCEL_BUTTON_SELECTOR);
13298
+ }
13295
13299
  get inputElement() {
13296
13300
  return this.wrapper.nativeElement.querySelector('input');
13297
13301
  }
@@ -13612,7 +13616,12 @@ class TimePickerComponent extends MultiTabStop {
13612
13616
  * @hidden
13613
13617
  */
13614
13618
  onTabOutLastPart() {
13615
- this.isAdaptive ? this.adaptiveAcceptButton.focus() : this.timeSelector.accept.nativeElement.focus();
13619
+ if (this.isAdaptive) {
13620
+ this.cancelButton ? this.adaptiveCancelButton.focus() : this.adaptiveAcceptButton.focus();
13621
+ }
13622
+ else {
13623
+ this.timeSelector.accept.nativeElement.focus();
13624
+ }
13616
13625
  }
13617
13626
  toggleTimeSelector(show) {
13618
13627
  this.windowSize = windowSize();
@@ -13956,6 +13965,17 @@ TimePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ve
13956
13965
  <ng-container *ngTemplateOutlet="timeSelectorTemplate"></ng-container>
13957
13966
  </div>
13958
13967
  <div class="k-actions k-actions-stretched k-actions-horizontal k-actionsheet-footer">
13968
+ <button kendoButton
13969
+ type="button"
13970
+ (click)="handleReject()"
13971
+ size="large"
13972
+ class="k-time-cancel"
13973
+ [attr.title]="localization.get('cancelLabel')"
13974
+ [attr.aria-label]="localization.get('cancelLabel')"
13975
+ >
13976
+ {{localization.get('cancel')}}
13977
+ </button>
13978
+
13959
13979
  <button kendoButton
13960
13980
  type="button"
13961
13981
  (click)="handleActionSheetAccept()"
@@ -13967,17 +13987,6 @@ TimePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ve
13967
13987
  >
13968
13988
  {{localization.get('accept')}}
13969
13989
  </button>
13970
-
13971
- <button kendoButton
13972
- type="button"
13973
- (click)="handleReject()"
13974
- size="large"
13975
- class="k-time-cancel"
13976
- [attr.title]="localization.get('cancelLabel')"
13977
- [attr.aria-label]="localization.get('cancelLabel')"
13978
- >
13979
- {{localization.get('cancel')}}
13980
- </button>
13981
13990
  </div>
13982
13991
  </ng-template>
13983
13992
  </kendo-actionsheet>
@@ -14180,6 +14189,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
14180
14189
  <ng-container *ngTemplateOutlet="timeSelectorTemplate"></ng-container>
14181
14190
  </div>
14182
14191
  <div class="k-actions k-actions-stretched k-actions-horizontal k-actionsheet-footer">
14192
+ <button kendoButton
14193
+ type="button"
14194
+ (click)="handleReject()"
14195
+ size="large"
14196
+ class="k-time-cancel"
14197
+ [attr.title]="localization.get('cancelLabel')"
14198
+ [attr.aria-label]="localization.get('cancelLabel')"
14199
+ >
14200
+ {{localization.get('cancel')}}
14201
+ </button>
14202
+
14183
14203
  <button kendoButton
14184
14204
  type="button"
14185
14205
  (click)="handleActionSheetAccept()"
@@ -14191,17 +14211,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
14191
14211
  >
14192
14212
  {{localization.get('accept')}}
14193
14213
  </button>
14194
-
14195
- <button kendoButton
14196
- type="button"
14197
- (click)="handleReject()"
14198
- size="large"
14199
- class="k-time-cancel"
14200
- [attr.title]="localization.get('cancelLabel')"
14201
- [attr.aria-label]="localization.get('cancelLabel')"
14202
- >
14203
- {{localization.get('cancel')}}
14204
- </button>
14205
14214
  </div>
14206
14215
  </ng-template>
14207
14216
  </kendo-actionsheet>
@@ -15040,10 +15049,20 @@ class DateTimePickerComponent extends MultiTabStop {
15040
15049
  }
15041
15050
  }
15042
15051
  get dateTabButton() {
15043
- return this.popupRef?.popup.instance.container.nativeElement.querySelector(DATE_TAB_BUTTON_SELECTOR);
15052
+ if (this.isAdaptive) {
15053
+ return this.actionSheet.element.nativeElement.querySelector(DATE_TAB_BUTTON_SELECTOR);
15054
+ }
15055
+ else {
15056
+ return this.popupRef?.popup.instance.container.nativeElement.querySelector(DATE_TAB_BUTTON_SELECTOR);
15057
+ }
15044
15058
  }
15045
15059
  get timeTabButton() {
15046
- return this.popupRef?.popup.instance.container.nativeElement.querySelector(TIME_TAB_BUTTON_SELECTOR);
15060
+ if (this.isAdaptive) {
15061
+ return this.actionSheet.element.nativeElement.querySelector(TIME_TAB_BUTTON_SELECTOR);
15062
+ }
15063
+ else {
15064
+ return this.popupRef?.popup.instance.container.nativeElement.querySelector(TIME_TAB_BUTTON_SELECTOR);
15065
+ }
15047
15066
  }
15048
15067
  /**
15049
15068
  * @hidden
@@ -15914,6 +15933,18 @@ DateTimePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0"
15914
15933
  <ng-container *ngTemplateOutlet="dateTimeTemplate"></ng-container>
15915
15934
  </div>
15916
15935
  <div class="k-actions k-actions-stretched k-actions-horizontal k-actionsheet-footer">
15936
+ <button kendoButton
15937
+ *ngIf="cancelButton"
15938
+ class="k-time-cancel"
15939
+ type="button"
15940
+ (click)="handleCancel()"
15941
+ size="large"
15942
+ [attr.title]="localization.get('cancelLabel')"
15943
+ [attr.aria-label]="localization.get('cancelLabel')"
15944
+ >
15945
+ {{localization.get('cancel')}}
15946
+ </button>
15947
+
15917
15948
  <button kendoButton
15918
15949
  type="button"
15919
15950
  class="k-time-accept"
@@ -15926,18 +15957,6 @@ DateTimePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0"
15926
15957
  >
15927
15958
  {{localization.get('accept')}}
15928
15959
  </button>
15929
-
15930
- <button kendoButton
15931
- *ngIf="cancelButton"
15932
- class="k-time-cancel"
15933
- type="button"
15934
- (click)="handleCancel()"
15935
- size="large"
15936
- [attr.title]="localization.get('cancelLabel')"
15937
- [attr.aria-label]="localization.get('cancelLabel')"
15938
- >
15939
- {{localization.get('cancel')}}
15940
- </button>
15941
15960
  </div>
15942
15961
  </ng-template>
15943
15962
  </kendo-actionsheet>
@@ -16317,6 +16336,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
16317
16336
  <ng-container *ngTemplateOutlet="dateTimeTemplate"></ng-container>
16318
16337
  </div>
16319
16338
  <div class="k-actions k-actions-stretched k-actions-horizontal k-actionsheet-footer">
16339
+ <button kendoButton
16340
+ *ngIf="cancelButton"
16341
+ class="k-time-cancel"
16342
+ type="button"
16343
+ (click)="handleCancel()"
16344
+ size="large"
16345
+ [attr.title]="localization.get('cancelLabel')"
16346
+ [attr.aria-label]="localization.get('cancelLabel')"
16347
+ >
16348
+ {{localization.get('cancel')}}
16349
+ </button>
16350
+
16320
16351
  <button kendoButton
16321
16352
  type="button"
16322
16353
  class="k-time-accept"
@@ -16329,18 +16360,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
16329
16360
  >
16330
16361
  {{localization.get('accept')}}
16331
16362
  </button>
16332
-
16333
- <button kendoButton
16334
- *ngIf="cancelButton"
16335
- class="k-time-cancel"
16336
- type="button"
16337
- (click)="handleCancel()"
16338
- size="large"
16339
- [attr.title]="localization.get('cancelLabel')"
16340
- [attr.aria-label]="localization.get('cancelLabel')"
16341
- >
16342
- {{localization.get('cancel')}}
16343
- </button>
16344
16363
  </div>
16345
16364
  </ng-template>
16346
16365
  </kendo-actionsheet>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@progress/kendo-angular-dateinputs",
3
- "version": "17.0.0-develop.20",
3
+ "version": "17.0.0-develop.21",
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",
@@ -34,18 +34,18 @@
34
34
  "@angular/forms": "15 - 18",
35
35
  "@angular/platform-browser": "15 - 18",
36
36
  "@progress/kendo-licensing": "^1.0.2",
37
- "@progress/kendo-angular-buttons": "17.0.0-develop.20",
38
- "@progress/kendo-angular-common": "17.0.0-develop.20",
39
- "@progress/kendo-angular-intl": "17.0.0-develop.20",
40
- "@progress/kendo-angular-l10n": "17.0.0-develop.20",
41
- "@progress/kendo-angular-icons": "17.0.0-develop.20",
42
- "@progress/kendo-angular-popup": "17.0.0-develop.20",
43
- "@progress/kendo-angular-navigation": "17.0.0-develop.20",
37
+ "@progress/kendo-angular-buttons": "17.0.0-develop.21",
38
+ "@progress/kendo-angular-common": "17.0.0-develop.21",
39
+ "@progress/kendo-angular-intl": "17.0.0-develop.21",
40
+ "@progress/kendo-angular-l10n": "17.0.0-develop.21",
41
+ "@progress/kendo-angular-icons": "17.0.0-develop.21",
42
+ "@progress/kendo-angular-popup": "17.0.0-develop.21",
43
+ "@progress/kendo-angular-navigation": "17.0.0-develop.21",
44
44
  "rxjs": "^6.5.3 || ^7.0.0"
45
45
  },
46
46
  "dependencies": {
47
47
  "tslib": "^2.3.1",
48
- "@progress/kendo-angular-schematics": "17.0.0-develop.20",
48
+ "@progress/kendo-angular-schematics": "17.0.0-develop.21",
49
49
  "@progress/kendo-common": "^0.2.0",
50
50
  "@progress/kendo-date-math": "^1.1.0",
51
51
  "@progress/kendo-dateinputs-common": "^0.3.5"
package/timepicker/timepicker.component.d.ts CHANGED
@@ -359,6 +359,7 @@ export declare class TimePickerComponent extends MultiTabStop implements Control
359
359
  */
360
360
  get isControlRequired(): boolean;
361
361
  private get adaptiveAcceptButton();
362
+ private get adaptiveCancelButton();
362
363
  private get inputElement();
363
364
  private onControlChange;
364
365
  private onControlTouched;