@progress/kendo-angular-grid 20.1.0-develop.5 → 20.1.0-develop.6

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.
@@ -58,7 +58,6 @@ export declare class ColumnListComponent implements OnInit, OnDestroy {
58
58
  ngOnInit(): void;
59
59
  ngAfterViewInit(): void;
60
60
  ngOnChanges(changes: SimpleChanges): void;
61
- onSelectAllClick(e: any): void;
62
61
  onSelectAllCheckboxChange(checkedState: any): void;
63
62
  ngOnDestroy(): void;
64
63
  cancelChanges(): void;
@@ -70,7 +69,6 @@ export declare class ColumnListComponent implements OnInit, OnDestroy {
70
69
  private disableFirstUnlockedCheckedCheckbox;
71
70
  private enableLastDisabledColumn;
72
71
  private setDisabledState;
73
- checkBoxClick(e: any): void;
74
72
  onCheckboxChange(checkedState: any, column: any, _index: number): void;
75
73
  private setTabindex;
76
74
  static ɵfac: i0.ɵɵFactoryDeclaration<ColumnListComponent, [null, null, null, null, null, { optional: true; }, { optional: true; }, { optional: true; }]>;
@@ -27,7 +27,7 @@ export class ColumnListKeyboardNavigation {
27
27
  toggle(index, active) {
28
28
  const element = this.items[index]?.hostElement.nativeElement.closest('.k-column-list-item');
29
29
  element && this.renderer.setAttribute(element, 'tabindex', active ? '0' : '-1');
30
- active && element?.focus();
30
+ active && element?.focus({ preventScroll: true });
31
31
  }
32
32
  toggleCheckedState() {
33
33
  this.items[this.activeIndex].hostElement.nativeElement.closest('.k-column-list-item').firstElementChild.click();
@@ -5,7 +5,7 @@
5
5
  import { Component, HostBinding, Input, ElementRef, NgZone, Renderer2, Output, EventEmitter, ViewChildren, QueryList, Optional, ChangeDetectorRef } from '@angular/core';
6
6
  import { ColumnMenuService } from './column-menu.service';
7
7
  import { ColumnListKeyboardNavigation } from './column-list-kb-nav.service';
8
- import { EventsOutsideAngularDirective, Keys, normalizeNumpadKeys } from '@progress/kendo-angular-common';
8
+ import { Keys, normalizeNumpadKeys } from '@progress/kendo-angular-common';
9
9
  import { Subscription } from 'rxjs';
10
10
  import { NgFor, NgIf } from '@angular/common';
11
11
  import { CheckBoxComponent } from '@progress/kendo-angular-inputs';
@@ -136,15 +136,6 @@ export class ColumnListComponent {
136
136
  this.service.menuTabbingService.lastFocusable = this.applyButton.nativeElement;
137
137
  }
138
138
  }
139
- onSelectAllClick(e) {
140
- if (e.target.classList.contains('k-checkbox')) {
141
- return;
142
- }
143
- e.preventDefault();
144
- const label = e.target.closest('.k-column-list-item');
145
- const input = label?.querySelector('input');
146
- input.click();
147
- }
148
139
  onSelectAllCheckboxChange(checkedState) {
149
140
  if (!checkedState && !this.allowHideAll) {
150
141
  const columnsToKeep = [];
@@ -326,25 +317,6 @@ export class ColumnListComponent {
326
317
  });
327
318
  }
328
319
  }
329
- checkBoxClick(e) {
330
- const closestItem = e.target.closest('.k-column-list-item');
331
- if (!closestItem)
332
- return;
333
- const checkboxElement = closestItem.querySelector('.k-checkbox-wrap');
334
- const input = checkboxElement?.querySelector('input');
335
- if (e.target === input) {
336
- return;
337
- }
338
- e.preventDefault();
339
- if (input) {
340
- const index = parseInt(input.getAttribute('data-index'), 10);
341
- const column = this.filteredColumns[index];
342
- const isDisabled = checkboxElement.classList.contains('k-disabled');
343
- if (column && !isDisabled) {
344
- input.click();
345
- }
346
- }
347
- }
348
320
  onCheckboxChange(checkedState, column, _index) {
349
321
  column.currentlyChecked = checkedState;
350
322
  if (this.autoSync) {
@@ -378,9 +350,7 @@ export class ColumnListComponent {
378
350
  <label
379
351
  *ngIf="showSelectAll"
380
352
  class='k-column-list-item'
381
- role="option"
382
- [kendoEventsOutsideAngular]="{click: onSelectAllClick}"
383
- [scope]="this">
353
+ role="option">
384
354
  <kendo-checkbox
385
355
  #checkbox
386
356
  [inputAttributes]="{'data-index': '0'}"
@@ -393,9 +363,7 @@ export class ColumnListComponent {
393
363
  <label
394
364
  *ngFor="let column of filteredColumns; let index = index;"
395
365
  class='k-column-list-item'
396
- role="option"
397
- [kendoEventsOutsideAngular]="{click: checkBoxClick}"
398
- [scope]="this">
366
+ role="option">
399
367
  <kendo-checkbox
400
368
  #checkbox
401
369
  [inputAttributes]="{'data-index': index.toString()}"
@@ -406,7 +374,7 @@ export class ColumnListComponent {
406
374
  <span class="k-checkbox-label">{{ column.displayTitle }}</span>
407
375
  </label>
408
376
  </div>
409
- `, isInline: true, dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CheckBoxComponent, selector: "kendo-checkbox", inputs: ["checkedState", "rounded"], outputs: ["checkedStateChange"], exportAs: ["kendoCheckBox"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }] });
377
+ `, isInline: true, dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CheckBoxComponent, selector: "kendo-checkbox", inputs: ["checkedState", "rounded"], outputs: ["checkedStateChange"], exportAs: ["kendoCheckBox"] }] });
410
378
  }
411
379
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColumnListComponent, decorators: [{
412
380
  type: Component,
@@ -422,9 +390,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
422
390
  <label
423
391
  *ngIf="showSelectAll"
424
392
  class='k-column-list-item'
425
- role="option"
426
- [kendoEventsOutsideAngular]="{click: onSelectAllClick}"
427
- [scope]="this">
393
+ role="option">
428
394
  <kendo-checkbox
429
395
  #checkbox
430
396
  [inputAttributes]="{'data-index': '0'}"
@@ -437,9 +403,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
437
403
  <label
438
404
  *ngFor="let column of filteredColumns; let index = index;"
439
405
  class='k-column-list-item'
440
- role="option"
441
- [kendoEventsOutsideAngular]="{click: checkBoxClick}"
442
- [scope]="this">
406
+ role="option">
443
407
  <kendo-checkbox
444
408
  #checkbox
445
409
  [inputAttributes]="{'data-index': index.toString()}"
@@ -452,7 +416,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
452
416
  </div>
453
417
  `,
454
418
  standalone: true,
455
- imports: [NgFor, NgIf, CheckBoxComponent, EventsOutsideAngularDirective]
419
+ imports: [NgFor, NgIf, CheckBoxComponent]
456
420
  }]
457
421
  }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.NgZone }, { type: i0.Renderer2 }, { type: i1.ColumnListKeyboardNavigation }, { type: i0.ChangeDetectorRef }, { type: i2.ColumnInfoService, decorators: [{
458
422
  type: Optional
@@ -6,6 +6,7 @@ import { ColumnMenuItemDirective } from './column-menu-item.directive';
6
6
  import { Component, ContentChildren, Inject, NgZone, QueryList } from '@angular/core';
7
7
  import { take } from 'rxjs/operators';
8
8
  import { ColumnMenuService } from './column-menu.service';
9
+ import { DropDownListComponent } from '@progress/kendo-angular-dropdowns';
9
10
  import * as i0 from "@angular/core";
10
11
  import * as i1 from "./column-menu.service";
11
12
  /**
@@ -33,7 +34,15 @@ export class ColumnMenuContainerComponent {
33
34
  else {
34
35
  return;
35
36
  }
36
- this.ngZone.onStable.pipe(take(1)).subscribe(() => this.service.menuTabbingService.firstFocusable?.focus());
37
+ this.ngZone.onStable.pipe(take(1)).subscribe(() => {
38
+ const firstFocusable = this.service.menuTabbingService.firstFocusable;
39
+ if (firstFocusable instanceof DropDownListComponent) {
40
+ firstFocusable.wrapper.nativeElement.focus({ preventScroll: true });
41
+ }
42
+ else {
43
+ firstFocusable?.focus({ preventScroll: true });
44
+ }
45
+ });
37
46
  }
38
47
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColumnMenuContainerComponent, deps: [{ token: i1.ColumnMenuService }, { token: NgZone }], target: i0.ɵɵFactoryTarget.Component });
39
48
  static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ColumnMenuContainerComponent, isStandalone: true, selector: "kendo-grid-columnmenu-container", queries: [{ propertyName: "columnMenuItems", predicate: ColumnMenuItemDirective, descendants: true }], ngImport: i0, template: `
@@ -353,7 +353,13 @@ export class ColumnMenuComponent {
353
353
  ariaRoot && this.renderer.setAttribute(ariaRoot, 'aria-expanded', 'false');
354
354
  }
355
355
  focusRoot() {
356
- this.isNavigable ? this.navigationService.focusCell(0, this.column.leafIndex) : this.anchor.nativeElement.focus();
356
+ if (this.isNavigable) {
357
+ this.navigationService.preventScroll = true;
358
+ this.navigationService.focusCell(0, this.column.leafIndex);
359
+ }
360
+ else {
361
+ this.anchor.nativeElement.focus({ preventScroll: true });
362
+ }
357
363
  }
358
364
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColumnMenuComponent, deps: [{ token: i1.NavigationService }, { token: i2.SinglePopupService }, { token: i3.ColumnMenuService }, { token: i4.ContextService }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: i5.ColumnInfoService }, { token: i6.IdService, optional: true }, { token: i7.AdaptiveGridService }], target: i0.ɵɵFactoryTarget.Component });
359
365
  static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ColumnMenuComponent, isStandalone: true, selector: "kendo-grid-column-menu", inputs: { standalone: "standalone", column: "column", settings: "settings", sort: "sort", filter: "filter", sortable: "sortable", columnMenuTemplate: "columnMenuTemplate", tabIndex: "tabIndex" }, host: { properties: { "class.k-grid-column-menu-standalone": "this.standalone" } }, providers: [
@@ -45,11 +45,11 @@ export class FilterMenuInputWrapperComponent extends FilterInputWrapperComponent
45
45
  this.filterService.menuTabbingService.firstFocusable = this.firstOperatorDropDown;
46
46
  if (this.ctx.grid?.isActionSheetExpanded) {
47
47
  this.subs.add(this.adaptiveGridService.animationEnd.subscribe(() => {
48
- this.firstOperatorDropDown.focus();
48
+ this.firstOperatorDropDown.wrapper.nativeElement.focus({ preventScroll: true });
49
49
  }));
50
50
  }
51
51
  else {
52
- this.firstOperatorDropDown.focus();
52
+ this.firstOperatorDropDown.wrapper.nativeElement.focus({ preventScroll: true });
53
53
  }
54
54
  }
55
55
  }
@@ -139,7 +139,13 @@ export class FilterMenuComponent {
139
139
  this.cdr.markForCheck();
140
140
  }
141
141
  focusRoot() {
142
- this.isNavigable ? this.navigationService.focusCell(0, this.column.leafIndex) : this.anchor.nativeElement.focus();
142
+ if (this.isNavigable) {
143
+ this.navigationService.preventScroll = true;
144
+ this.navigationService.focusCell(0, this.column.leafIndex);
145
+ }
146
+ else {
147
+ this.anchor.nativeElement.focus({ preventScroll: true });
148
+ }
143
149
  }
144
150
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FilterMenuComponent, deps: [{ token: i1.FilterService }, { token: i2.SinglePopupService }, { token: i3.ContextService }, { token: i4.NavigationService }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: i5.AdaptiveGridService }, { token: i0.NgZone }, { token: i6.IdService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
145
151
  static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FilterMenuComponent, isStandalone: true, selector: "kendo-grid-filter-menu", inputs: { column: "column", filter: "filter", tabIndex: "tabIndex" }, viewQueries: [{ propertyName: "anchor", first: true, predicate: ["anchor"], descendants: true, static: true }, { propertyName: "template", first: true, predicate: ["template"], descendants: true, read: TemplateRef, static: true }], ngImport: i0, template: `
@@ -123,8 +123,14 @@ export class LogicalCellDirective {
123
123
  this.focusGroup.focus();
124
124
  }
125
125
  else {
126
- if (!this.logicalSlaveCell && this.navigationService.autoFocusCell(this.logicalColIndex, this.logicalColIndex + this.colSpan - 1)) {
127
- this.microtask(() => this.isFocused() && el.focus());
126
+ if (!this.logicalSlaveCell &&
127
+ this.navigationService.autoFocusCell(this.logicalColIndex, this.logicalColIndex + this.colSpan - 1)) {
128
+ this.microtask(() => {
129
+ if (this.isFocused()) {
130
+ el.focus({ preventScroll: this.navigationService.preventScroll });
131
+ this.navigationService.preventScroll = false;
132
+ }
133
+ });
128
134
  }
129
135
  this.renderer.addClass(el, 'k-focus');
130
136
  }
@@ -155,6 +155,7 @@ export class NavigationService {
155
155
  return columnIndexInsideGroup !== columnGroupChildren.length - 1;
156
156
  }
157
157
  }
158
+ preventScroll = false;
158
159
  viewport;
159
160
  columnViewport;
160
161
  activeRowIndex = 0;
@@ -10,7 +10,7 @@ export const packageMetadata = {
10
10
  productName: 'Kendo UI for Angular',
11
11
  productCode: 'KENDOUIANGULAR',
12
12
  productCodes: ['KENDOUIANGULAR'],
13
- publishDate: 1759307158,
14
- version: '20.1.0-develop.5',
13
+ publishDate: 1759321337,
14
+ version: '20.1.0-develop.6',
15
15
  licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
16
16
  };
@@ -216,7 +216,7 @@ export class ColumnChooserToolbarDirective extends ToolbarToolBase {
216
216
  this.buttonElement?.setAttribute('aria-expanded', 'false');
217
217
  this.buttonElement?.removeAttribute('aria-controls');
218
218
  this.host.selected = false;
219
- focusAnchor && this.buttonElement?.focus();
219
+ focusAnchor && this.buttonElement?.focus({ preventScroll: true });
220
220
  }
221
221
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColumnChooserToolbarDirective, deps: [{ token: i0.Renderer2 }, { token: i1.PopupService }, { token: i2.ToolBarButtonComponent }, { token: i3.ContextService }, { token: i0.NgZone }, { token: i2.RefreshService }, { token: i4.AdaptiveGridService }, { token: i5.ColumnInfoService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive });
222
222
  static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: ColumnChooserToolbarDirective, isStandalone: true, selector: "[kendoGridColumnChooserTool]", inputs: { autoSync: "autoSync", allowHideAll: "allowHideAll", filterable: "filterable", showSelectAll: "showSelectAll" }, usesInheritance: true, ngImport: i0 });
@@ -91,7 +91,7 @@ export class FilterToolbarToolComponent {
91
91
  }
92
92
  ngAfterViewInit() {
93
93
  this.ngZone.onStable.pipe(take(1)).subscribe(() => {
94
- this.filterItems?.get(0)?.nativeElement.focus();
94
+ this.filterItems?.get(0)?.nativeElement.focus({ preventScroll: true });
95
95
  });
96
96
  }
97
97
  ngOnDestroy() {
@@ -34,12 +34,12 @@ export class GroupToolbarToolComponent {
34
34
  if (items?.first && (!isPresent(this.currentFocusedItemIndex) || this.currentFocusedItemIndex >= items.length || this.currentFocusedItemIndex < 0)) {
35
35
  this.ngZone.onStable.pipe(take(1)).subscribe(() => {
36
36
  this.currentFocusedItemIndex = 0;
37
- this.groupItems.first.nativeElement.focus();
37
+ this.groupItems.first.nativeElement.focus({ preventScroll: true });
38
38
  });
39
39
  return;
40
40
  }
41
41
  if (items?.first) {
42
- items.get(this.currentFocusedItemIndex).nativeElement.focus();
42
+ items.get(this.currentFocusedItemIndex).nativeElement.focus({ preventScroll: true });
43
43
  }
44
44
  }
45
45
  get groupItems() {
@@ -70,7 +70,7 @@ export class SortToolbarToolComponent {
70
70
  }
71
71
  ngAfterViewInit() {
72
72
  this.ngZone.onStable.pipe(take(1)).subscribe(() => {
73
- this.sortItems?.get(0)?.nativeElement.focus();
73
+ this.sortItems?.get(0)?.nativeElement.focus({ preventScroll: true });
74
74
  });
75
75
  }
76
76
  ngOnDestroy() {
@@ -3507,6 +3507,7 @@ class NavigationService {
3507
3507
  return columnIndexInsideGroup !== columnGroupChildren.length - 1;
3508
3508
  }
3509
3509
  }
3510
+ preventScroll = false;
3510
3511
  viewport;
3511
3512
  columnViewport;
3512
3513
  activeRowIndex = 0;
@@ -5264,8 +5265,14 @@ class LogicalCellDirective {
5264
5265
  this.focusGroup.focus();
5265
5266
  }
5266
5267
  else {
5267
- if (!this.logicalSlaveCell && this.navigationService.autoFocusCell(this.logicalColIndex, this.logicalColIndex + this.colSpan - 1)) {
5268
- this.microtask(() => this.isFocused() && el.focus());
5268
+ if (!this.logicalSlaveCell &&
5269
+ this.navigationService.autoFocusCell(this.logicalColIndex, this.logicalColIndex + this.colSpan - 1)) {
5270
+ this.microtask(() => {
5271
+ if (this.isFocused()) {
5272
+ el.focus({ preventScroll: this.navigationService.preventScroll });
5273
+ this.navigationService.preventScroll = false;
5274
+ }
5275
+ });
5269
5276
  }
5270
5277
  this.renderer.addClass(el, 'k-focus');
5271
5278
  }
@@ -8964,11 +8971,11 @@ class FilterMenuInputWrapperComponent extends FilterInputWrapperComponent {
8964
8971
  this.filterService.menuTabbingService.firstFocusable = this.firstOperatorDropDown;
8965
8972
  if (this.ctx.grid?.isActionSheetExpanded) {
8966
8973
  this.subs.add(this.adaptiveGridService.animationEnd.subscribe(() => {
8967
- this.firstOperatorDropDown.focus();
8974
+ this.firstOperatorDropDown.wrapper.nativeElement.focus({ preventScroll: true });
8968
8975
  }));
8969
8976
  }
8970
8977
  else {
8971
- this.firstOperatorDropDown.focus();
8978
+ this.firstOperatorDropDown.wrapper.nativeElement.focus({ preventScroll: true });
8972
8979
  }
8973
8980
  }
8974
8981
  }
@@ -11072,7 +11079,13 @@ class FilterMenuComponent {
11072
11079
  this.cdr.markForCheck();
11073
11080
  }
11074
11081
  focusRoot() {
11075
- this.isNavigable ? this.navigationService.focusCell(0, this.column.leafIndex) : this.anchor.nativeElement.focus();
11082
+ if (this.isNavigable) {
11083
+ this.navigationService.preventScroll = true;
11084
+ this.navigationService.focusCell(0, this.column.leafIndex);
11085
+ }
11086
+ else {
11087
+ this.anchor.nativeElement.focus({ preventScroll: true });
11088
+ }
11076
11089
  }
11077
11090
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FilterMenuComponent, deps: [{ token: FilterService }, { token: SinglePopupService }, { token: ContextService }, { token: NavigationService }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: AdaptiveGridService }, { token: i0.NgZone }, { token: IdService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
11078
11091
  static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FilterMenuComponent, isStandalone: true, selector: "kendo-grid-filter-menu", inputs: { column: "column", filter: "filter", tabIndex: "tabIndex" }, viewQueries: [{ propertyName: "anchor", first: true, predicate: ["anchor"], descendants: true, static: true }, { propertyName: "template", first: true, predicate: ["template"], descendants: true, read: TemplateRef, static: true }], ngImport: i0, template: `
@@ -12087,7 +12100,7 @@ class ColumnListKeyboardNavigation {
12087
12100
  toggle(index, active) {
12088
12101
  const element = this.items[index]?.hostElement.nativeElement.closest('.k-column-list-item');
12089
12102
  element && this.renderer.setAttribute(element, 'tabindex', active ? '0' : '-1');
12090
- active && element?.focus();
12103
+ active && element?.focus({ preventScroll: true });
12091
12104
  }
12092
12105
  toggleCheckedState() {
12093
12106
  this.items[this.activeIndex].hostElement.nativeElement.closest('.k-column-list-item').firstElementChild.click();
@@ -12217,15 +12230,6 @@ class ColumnListComponent {
12217
12230
  this.service.menuTabbingService.lastFocusable = this.applyButton.nativeElement;
12218
12231
  }
12219
12232
  }
12220
- onSelectAllClick(e) {
12221
- if (e.target.classList.contains('k-checkbox')) {
12222
- return;
12223
- }
12224
- e.preventDefault();
12225
- const label = e.target.closest('.k-column-list-item');
12226
- const input = label?.querySelector('input');
12227
- input.click();
12228
- }
12229
12233
  onSelectAllCheckboxChange(checkedState) {
12230
12234
  if (!checkedState && !this.allowHideAll) {
12231
12235
  const columnsToKeep = [];
@@ -12407,25 +12411,6 @@ class ColumnListComponent {
12407
12411
  });
12408
12412
  }
12409
12413
  }
12410
- checkBoxClick(e) {
12411
- const closestItem = e.target.closest('.k-column-list-item');
12412
- if (!closestItem)
12413
- return;
12414
- const checkboxElement = closestItem.querySelector('.k-checkbox-wrap');
12415
- const input = checkboxElement?.querySelector('input');
12416
- if (e.target === input) {
12417
- return;
12418
- }
12419
- e.preventDefault();
12420
- if (input) {
12421
- const index = parseInt(input.getAttribute('data-index'), 10);
12422
- const column = this.filteredColumns[index];
12423
- const isDisabled = checkboxElement.classList.contains('k-disabled');
12424
- if (column && !isDisabled) {
12425
- input.click();
12426
- }
12427
- }
12428
- }
12429
12414
  onCheckboxChange(checkedState, column, _index) {
12430
12415
  column.currentlyChecked = checkedState;
12431
12416
  if (this.autoSync) {
@@ -12459,9 +12444,7 @@ class ColumnListComponent {
12459
12444
  <label
12460
12445
  *ngIf="showSelectAll"
12461
12446
  class='k-column-list-item'
12462
- role="option"
12463
- [kendoEventsOutsideAngular]="{click: onSelectAllClick}"
12464
- [scope]="this">
12447
+ role="option">
12465
12448
  <kendo-checkbox
12466
12449
  #checkbox
12467
12450
  [inputAttributes]="{'data-index': '0'}"
@@ -12474,9 +12457,7 @@ class ColumnListComponent {
12474
12457
  <label
12475
12458
  *ngFor="let column of filteredColumns; let index = index;"
12476
12459
  class='k-column-list-item'
12477
- role="option"
12478
- [kendoEventsOutsideAngular]="{click: checkBoxClick}"
12479
- [scope]="this">
12460
+ role="option">
12480
12461
  <kendo-checkbox
12481
12462
  #checkbox
12482
12463
  [inputAttributes]="{'data-index': index.toString()}"
@@ -12487,7 +12468,7 @@ class ColumnListComponent {
12487
12468
  <span class="k-checkbox-label">{{ column.displayTitle }}</span>
12488
12469
  </label>
12489
12470
  </div>
12490
- `, isInline: true, dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CheckBoxComponent, selector: "kendo-checkbox", inputs: ["checkedState", "rounded"], outputs: ["checkedStateChange"], exportAs: ["kendoCheckBox"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }] });
12471
+ `, isInline: true, dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CheckBoxComponent, selector: "kendo-checkbox", inputs: ["checkedState", "rounded"], outputs: ["checkedStateChange"], exportAs: ["kendoCheckBox"] }] });
12491
12472
  }
12492
12473
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColumnListComponent, decorators: [{
12493
12474
  type: Component,
@@ -12503,9 +12484,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
12503
12484
  <label
12504
12485
  *ngIf="showSelectAll"
12505
12486
  class='k-column-list-item'
12506
- role="option"
12507
- [kendoEventsOutsideAngular]="{click: onSelectAllClick}"
12508
- [scope]="this">
12487
+ role="option">
12509
12488
  <kendo-checkbox
12510
12489
  #checkbox
12511
12490
  [inputAttributes]="{'data-index': '0'}"
@@ -12518,9 +12497,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
12518
12497
  <label
12519
12498
  *ngFor="let column of filteredColumns; let index = index;"
12520
12499
  class='k-column-list-item'
12521
- role="option"
12522
- [kendoEventsOutsideAngular]="{click: checkBoxClick}"
12523
- [scope]="this">
12500
+ role="option">
12524
12501
  <kendo-checkbox
12525
12502
  #checkbox
12526
12503
  [inputAttributes]="{'data-index': index.toString()}"
@@ -12533,7 +12510,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
12533
12510
  </div>
12534
12511
  `,
12535
12512
  standalone: true,
12536
- imports: [NgFor, NgIf, CheckBoxComponent, EventsOutsideAngularDirective]
12513
+ imports: [NgFor, NgIf, CheckBoxComponent]
12537
12514
  }]
12538
12515
  }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.NgZone }, { type: i0.Renderer2 }, { type: ColumnListKeyboardNavigation }, { type: i0.ChangeDetectorRef }, { type: ColumnInfoService, decorators: [{
12539
12516
  type: Optional
@@ -13375,7 +13352,7 @@ class ColumnChooserToolbarDirective extends ToolbarToolBase {
13375
13352
  this.buttonElement?.setAttribute('aria-expanded', 'false');
13376
13353
  this.buttonElement?.removeAttribute('aria-controls');
13377
13354
  this.host.selected = false;
13378
- focusAnchor && this.buttonElement?.focus();
13355
+ focusAnchor && this.buttonElement?.focus({ preventScroll: true });
13379
13356
  }
13380
13357
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColumnChooserToolbarDirective, deps: [{ token: i0.Renderer2 }, { token: i2.PopupService }, { token: i54.ToolBarButtonComponent }, { token: ContextService }, { token: i0.NgZone }, { token: i54.RefreshService }, { token: AdaptiveGridService }, { token: ColumnInfoService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive });
13381
13358
  static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: ColumnChooserToolbarDirective, isStandalone: true, selector: "[kendoGridColumnChooserTool]", inputs: { autoSync: "autoSync", allowHideAll: "allowHideAll", filterable: "filterable", showSelectAll: "showSelectAll" }, usesInheritance: true, ngImport: i0 });
@@ -14899,7 +14876,15 @@ class ColumnMenuContainerComponent {
14899
14876
  else {
14900
14877
  return;
14901
14878
  }
14902
- this.ngZone.onStable.pipe(take(1)).subscribe(() => this.service.menuTabbingService.firstFocusable?.focus());
14879
+ this.ngZone.onStable.pipe(take(1)).subscribe(() => {
14880
+ const firstFocusable = this.service.menuTabbingService.firstFocusable;
14881
+ if (firstFocusable instanceof DropDownListComponent) {
14882
+ firstFocusable.wrapper.nativeElement.focus({ preventScroll: true });
14883
+ }
14884
+ else {
14885
+ firstFocusable?.focus({ preventScroll: true });
14886
+ }
14887
+ });
14903
14888
  }
14904
14889
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColumnMenuContainerComponent, deps: [{ token: ColumnMenuService }, { token: NgZone }], target: i0.ɵɵFactoryTarget.Component });
14905
14890
  static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ColumnMenuContainerComponent, isStandalone: true, selector: "kendo-grid-columnmenu-container", queries: [{ propertyName: "columnMenuItems", predicate: ColumnMenuItemDirective, descendants: true }], ngImport: i0, template: `
@@ -15354,7 +15339,13 @@ class ColumnMenuComponent {
15354
15339
  ariaRoot && this.renderer.setAttribute(ariaRoot, 'aria-expanded', 'false');
15355
15340
  }
15356
15341
  focusRoot() {
15357
- this.isNavigable ? this.navigationService.focusCell(0, this.column.leafIndex) : this.anchor.nativeElement.focus();
15342
+ if (this.isNavigable) {
15343
+ this.navigationService.preventScroll = true;
15344
+ this.navigationService.focusCell(0, this.column.leafIndex);
15345
+ }
15346
+ else {
15347
+ this.anchor.nativeElement.focus({ preventScroll: true });
15348
+ }
15358
15349
  }
15359
15350
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColumnMenuComponent, deps: [{ token: NavigationService }, { token: SinglePopupService }, { token: ColumnMenuService }, { token: ContextService }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: ColumnInfoService }, { token: IdService, optional: true }, { token: AdaptiveGridService }], target: i0.ɵɵFactoryTarget.Component });
15360
15351
  static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ColumnMenuComponent, isStandalone: true, selector: "kendo-grid-column-menu", inputs: { standalone: "standalone", column: "column", settings: "settings", sort: "sort", filter: "filter", sortable: "sortable", columnMenuTemplate: "columnMenuTemplate", tabIndex: "tabIndex" }, host: { properties: { "class.k-grid-column-menu-standalone": "this.standalone" } }, providers: [
@@ -22427,8 +22418,8 @@ const packageMetadata = {
22427
22418
  productName: 'Kendo UI for Angular',
22428
22419
  productCode: 'KENDOUIANGULAR',
22429
22420
  productCodes: ['KENDOUIANGULAR'],
22430
- publishDate: 1759307158,
22431
- version: '20.1.0-develop.5',
22421
+ publishDate: 1759321337,
22422
+ version: '20.1.0-develop.6',
22432
22423
  licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
22433
22424
  };
22434
22425
 
@@ -26941,7 +26932,7 @@ class FilterToolbarToolComponent {
26941
26932
  }
26942
26933
  ngAfterViewInit() {
26943
26934
  this.ngZone.onStable.pipe(take(1)).subscribe(() => {
26944
- this.filterItems?.get(0)?.nativeElement.focus();
26935
+ this.filterItems?.get(0)?.nativeElement.focus({ preventScroll: true });
26945
26936
  });
26946
26937
  }
26947
26938
  ngOnDestroy() {
@@ -27127,7 +27118,7 @@ class SortToolbarToolComponent {
27127
27118
  }
27128
27119
  ngAfterViewInit() {
27129
27120
  this.ngZone.onStable.pipe(take(1)).subscribe(() => {
27130
- this.sortItems?.get(0)?.nativeElement.focus();
27121
+ this.sortItems?.get(0)?.nativeElement.focus({ preventScroll: true });
27131
27122
  });
27132
27123
  }
27133
27124
  ngOnDestroy() {
@@ -27689,12 +27680,12 @@ class GroupToolbarToolComponent {
27689
27680
  if (items?.first && (!isPresent$1(this.currentFocusedItemIndex) || this.currentFocusedItemIndex >= items.length || this.currentFocusedItemIndex < 0)) {
27690
27681
  this.ngZone.onStable.pipe(take(1)).subscribe(() => {
27691
27682
  this.currentFocusedItemIndex = 0;
27692
- this.groupItems.first.nativeElement.focus();
27683
+ this.groupItems.first.nativeElement.focus({ preventScroll: true });
27693
27684
  });
27694
27685
  return;
27695
27686
  }
27696
27687
  if (items?.first) {
27697
- items.get(this.currentFocusedItemIndex).nativeElement.focus();
27688
+ items.get(this.currentFocusedItemIndex).nativeElement.focus({ preventScroll: true });
27698
27689
  }
27699
27690
  }
27700
27691
  get groupItems() {
@@ -59,6 +59,7 @@ export declare class NavigationService implements OnDestroy {
59
59
  get activeCell(): NavigationCell;
60
60
  get activeRow(): NavigationRow;
61
61
  get isColumnResizable(): boolean;
62
+ preventScroll: boolean;
62
63
  viewport: NavigationViewport;
63
64
  columnViewport: NavigationViewport;
64
65
  private activeRowIndex;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@progress/kendo-angular-grid",
3
- "version": "20.1.0-develop.5",
3
+ "version": "20.1.0-develop.6",
4
4
  "description": "Kendo UI Grid for Angular - high performance data grid with paging, filtering, virtualization, CRUD, and more.",
5
5
  "license": "SEE LICENSE IN LICENSE.md",
6
6
  "author": "Progress",
@@ -41,7 +41,7 @@
41
41
  "package": {
42
42
  "productName": "Kendo UI for Angular",
43
43
  "productCode": "KENDOUIANGULAR",
44
- "publishDate": 1759307158,
44
+ "publishDate": 1759321337,
45
45
  "licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/"
46
46
  }
47
47
  },
@@ -54,29 +54,29 @@
54
54
  "@progress/kendo-data-query": "^1.0.0",
55
55
  "@progress/kendo-drawing": "^1.21.0",
56
56
  "@progress/kendo-licensing": "^1.7.0",
57
- "@progress/kendo-angular-buttons": "20.1.0-develop.5",
58
- "@progress/kendo-angular-common": "20.1.0-develop.5",
59
- "@progress/kendo-angular-dateinputs": "20.1.0-develop.5",
60
- "@progress/kendo-angular-layout": "20.1.0-develop.5",
61
- "@progress/kendo-angular-navigation": "20.1.0-develop.5",
62
- "@progress/kendo-angular-dropdowns": "20.1.0-develop.5",
63
- "@progress/kendo-angular-excel-export": "20.1.0-develop.5",
64
- "@progress/kendo-angular-icons": "20.1.0-develop.5",
65
- "@progress/kendo-angular-inputs": "20.1.0-develop.5",
66
- "@progress/kendo-angular-conversational-ui": "20.1.0-develop.5",
67
- "@progress/kendo-angular-intl": "20.1.0-develop.5",
68
- "@progress/kendo-angular-l10n": "20.1.0-develop.5",
69
- "@progress/kendo-angular-label": "20.1.0-develop.5",
70
- "@progress/kendo-angular-pager": "20.1.0-develop.5",
71
- "@progress/kendo-angular-pdf-export": "20.1.0-develop.5",
72
- "@progress/kendo-angular-popup": "20.1.0-develop.5",
73
- "@progress/kendo-angular-toolbar": "20.1.0-develop.5",
74
- "@progress/kendo-angular-utils": "20.1.0-develop.5",
57
+ "@progress/kendo-angular-buttons": "20.1.0-develop.6",
58
+ "@progress/kendo-angular-common": "20.1.0-develop.6",
59
+ "@progress/kendo-angular-dateinputs": "20.1.0-develop.6",
60
+ "@progress/kendo-angular-layout": "20.1.0-develop.6",
61
+ "@progress/kendo-angular-navigation": "20.1.0-develop.6",
62
+ "@progress/kendo-angular-dropdowns": "20.1.0-develop.6",
63
+ "@progress/kendo-angular-excel-export": "20.1.0-develop.6",
64
+ "@progress/kendo-angular-icons": "20.1.0-develop.6",
65
+ "@progress/kendo-angular-inputs": "20.1.0-develop.6",
66
+ "@progress/kendo-angular-conversational-ui": "20.1.0-develop.6",
67
+ "@progress/kendo-angular-intl": "20.1.0-develop.6",
68
+ "@progress/kendo-angular-l10n": "20.1.0-develop.6",
69
+ "@progress/kendo-angular-label": "20.1.0-develop.6",
70
+ "@progress/kendo-angular-pager": "20.1.0-develop.6",
71
+ "@progress/kendo-angular-pdf-export": "20.1.0-develop.6",
72
+ "@progress/kendo-angular-popup": "20.1.0-develop.6",
73
+ "@progress/kendo-angular-toolbar": "20.1.0-develop.6",
74
+ "@progress/kendo-angular-utils": "20.1.0-develop.6",
75
75
  "rxjs": "^6.5.3 || ^7.0.0"
76
76
  },
77
77
  "dependencies": {
78
78
  "tslib": "^2.3.1",
79
- "@progress/kendo-angular-schematics": "20.1.0-develop.5",
79
+ "@progress/kendo-angular-schematics": "20.1.0-develop.6",
80
80
  "@progress/kendo-common": "^1.0.1",
81
81
  "@progress/kendo-file-saver": "^1.0.0"
82
82
  },
@@ -4,14 +4,14 @@ const schematics_1 = require("@angular-devkit/schematics");
4
4
  function default_1(options) {
5
5
  const finalOptions = Object.assign(Object.assign({}, options), { mainNgModule: 'GridModule', package: 'grid', peerDependencies: {
6
6
  // peer deps of the dropdowns
7
- '@progress/kendo-angular-treeview': '20.1.0-develop.5',
8
- '@progress/kendo-angular-navigation': '20.1.0-develop.5',
7
+ '@progress/kendo-angular-treeview': '20.1.0-develop.6',
8
+ '@progress/kendo-angular-navigation': '20.1.0-develop.6',
9
9
  // peer dependency of kendo-angular-inputs
10
- '@progress/kendo-angular-dialog': '20.1.0-develop.5',
10
+ '@progress/kendo-angular-dialog': '20.1.0-develop.6',
11
11
  // peer dependency of kendo-angular-icons
12
12
  '@progress/kendo-svg-icons': '^4.0.0',
13
13
  // peer dependency of kendo-angular-layout
14
- '@progress/kendo-angular-progressbar': '20.1.0-develop.5'
14
+ '@progress/kendo-angular-progressbar': '20.1.0-develop.6'
15
15
  } });
16
16
  return (0, schematics_1.externalSchematic)('@progress/kendo-angular-schematics', 'ng-add', finalOptions);
17
17
  }