@progress/kendo-angular-grid 16.10.0 → 16.10.1-develop.1

package/aggregates/selection-aggregate.service.d.ts

@@ -24,11 +24,12 @@ export declare class CellSelectionAggregateService {
     private ctx;
     private dataChanges;
     private columnInfoService;
-    data: any;
     selectedItems: Array<CellSelectionItem | RowArgs>;
     groupedAggregates: GroupedAggregates;
     aggregates: SelectionAggregates;
+    private sub;
     constructor(ctx: ContextService, dataChanges: LocalDataChangesService, columnInfoService: ColumnInfoService);
+    ngOnDestroy(): void;
     isAggregateIncluded(aggregate: SelectionAggregate): boolean;
     init(): void;
     onSelectionChange(selectionArgs: SelectionEvent): SelectionAggregates;

package/column-menu/column-menu.component.d.ts

@@ -108,6 +108,7 @@ export declare class ColumnMenuComponent implements AfterViewInit, OnChanges, On
     moreVerticalIcon: SVGIcon;
     popupRef: any;
     private closeSubscription;
+    private popupSubs;
     constructor(navigationService: NavigationService, popupService: SinglePopupService, service: ColumnMenuService, ctx: ContextService, renderer: Renderer2, cdr: ChangeDetectorRef, columnInfoService: ColumnInfoService, idService: IdService);
     /**
      * @hidden
@@ -173,6 +174,7 @@ export declare class ColumnMenuComponent implements AfterViewInit, OnChanges, On
      */
     get columnMenuTitle(): string;
     private getExpandedState;
+    private updateAria;
     static ɵfac: i0.ɵɵFactoryDeclaration<ColumnMenuComponent, [null, null, null, null, null, null, null, { optional: true; }]>;
     static ɵcmp: i0.ɵɵComponentDeclaration<ColumnMenuComponent, "kendo-grid-column-menu", never, { "standalone": "standalone"; "column": "column"; "settings": "settings"; "sort": "sort"; "filter": "filter"; "sortable": "sortable"; "columnMenuTemplate": "columnMenuTemplate"; "tabIndex": "tabIndex"; }, {}, never, never, true, never>;
 }

package/esm2020/aggregates/selection-aggregate.service.mjs

@@ -6,6 +6,8 @@ import { Injectable } from '@angular/core';
 import { ContextService } from '../common/provider.service';
 import { ColumnInfoService } from '../common/column-info.service';
 import { LocalDataChangesService } from '../editing/local-data-changes.service';
+import { recursiveFlatMap } from '../utils';
+import { Subscription } from 'rxjs';
 import * as i0 from "@angular/core";
 import * as i1 from "../common/provider.service";
 import * as i2 from "../editing/local-data-changes.service";
@@ -31,6 +33,10 @@ export class CellSelectionAggregateService {
             earliest: null,
             latest: null
         };
+        this.sub = new Subscription();
+    }
+    ngOnDestroy() {
+        this.sub.unsubscribe();
     }
     isAggregateIncluded(aggregate) {
         const { cellAggregates } = this.ctx.grid.selectable;
@@ -40,8 +46,15 @@ export class CellSelectionAggregateService {
         return true;
     }
     init() {
+        this.sub.add(this.ctx.grid.dataStateChange.subscribe(_ => {
+            // nullifies aggregates and sets default count to avoid mismatching state -
+            // https://github.com/telerik/kendo-angular-private/issues/2964
+            this.nullifyAggregates();
+            if (this.isAggregateIncluded('count')) {
+                this.aggregates['count'] = 0;
+            }
+        }));
         if (this.ctx.grid.selectable.cellAggregates) {
-            this.data = this.dataChanges.data ? this.dataChanges.data : this.ctx.grid.data;
             if (this.isAggregateIncluded('count')) {
                 this.aggregates['count'] = 0;
             }
@@ -80,10 +93,12 @@ export class CellSelectionAggregateService {
                 });
             }
             else if (!this.isRowSelection) {
-                const itemKey = this.data[item.itemKey];
+                // Enables working with the current Grid data regardless of its form (array, GridDataResult, GroupedResult).
+                // Currently gets the item by index only - https://github.com/telerik/kendo-angular-private/issues/2964
+                const selectedItem = this.ctx.grid.flatData.flatMap(recursiveFlatMap)[item.itemKey];
                 const field = fields[item.columnKey];
-                if (itemKey && itemKey.hasOwnProperty(field)) {
-                    const cellValue = itemKey[fields[item.columnKey]];
+                if (selectedItem && selectedItem.hasOwnProperty(field)) {
+                    const cellValue = selectedItem[fields[item.columnKey]];
                     this.groupAggregates(cellValue);
                 }
             }

package/esm2020/column-menu/column-menu.component.mjs

@@ -16,7 +16,6 @@ import { moreVerticalIcon, columnsIcon, filterIcon, slidersIcon } from '@progres
 import { TabContentDirective, TabStripComponent, TabStripTabComponent, TabTitleDirective } from '@progress/kendo-angular-layout';
 import { ColumnInfoService } from '../common/column-info.service';
 import { IdService } from '../common/id.service';
-import { take } from 'rxjs/operators';
 import { ColumnListComponent } from './column-list.component';
 import { FilterMenuContainerComponent } from '../filtering/menu/filter-menu-container.component';
 import { ColumnMenuFilterComponent } from './column-menu-filter.component';
@@ -220,6 +219,8 @@ export class ColumnMenuComponent {
     ngOnDestroy() {
         this.close();
         this.closeSubscription.unsubscribe();
+        this.popupSubs?.unsubscribe();
+        this.closeSubscription = this.popupSubs = null;
     }
     /**
      * @hidden
@@ -227,7 +228,7 @@ export class ColumnMenuComponent {
     toggle(e, anchor, template) {
         if (e) {
             e.preventDefault();
-            e.stopImmediatePropagation();
+            e instanceof KeyboardEvent && e.stopImmediatePropagation();
         }
         this.expandedFilter = this.getExpandedState(this.settings.filter);
         this.expandedColumns = this.getExpandedState(this.settings.columnChooser);
@@ -237,12 +238,18 @@ export class ColumnMenuComponent {
         // automatically when the Popup is closed by clicking outside the anchor
         const ariaRoot = this.isNavigable ? anchor.closest('.k-table-th') : anchor;
         if (this.popupRef) {
-            this.popupRef.popup.instance.close.pipe(take(1)).subscribe(() => {
-                this.popupRef = null;
-                const ariaRoot = this.isNavigable ? anchor.closest('.k-table-th') : anchor;
-                ariaRoot && this.renderer.removeAttribute(ariaRoot, 'aria-controls');
-                ariaRoot && this.renderer.setAttribute(ariaRoot, 'aria-expanded', 'false');
+            this.popupSubs?.unsubscribe();
+            this.popupSubs = this.popupRef.popup.instance.anchorViewportLeave.subscribe(() => {
+                this.popupSubs?.unsubscribe();
+                this.popupSubs = null;
+                this.close(true);
+                this.updateAria(ariaRoot);
             });
+            this.popupSubs.add(this.popupRef.popup.instance.close.subscribe(() => {
+                this.popupSubs?.unsubscribe();
+                this.popupSubs = this.popupRef = null;
+                this.updateAria(ariaRoot);
+            }));
             const popupAriaElement = this.popupRef.popupElement.querySelector('.k-grid-columnmenu-popup');
             if (popupAriaElement) {
                 const popupId = getId(this.idService?.gridId());
@@ -296,6 +303,10 @@ export class ColumnMenuComponent {
     getExpandedState(menuItemSettings) {
         return typeof (menuItemSettings) === 'object' ? menuItemSettings.expanded : false;
     }
+    updateAria(ariaRoot) {
+        ariaRoot && this.renderer.removeAttribute(ariaRoot, 'aria-controls');
+        ariaRoot && this.renderer.setAttribute(ariaRoot, 'aria-expanded', 'false');
+    }
 }
 ColumnMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", 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 }], target: i0.ɵɵFactoryTarget.Component });
 ColumnMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", 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: [

package/esm2020/common/single-popup.service.mjs

@@ -10,6 +10,7 @@ import { Subject, Subscription } from 'rxjs';
 import { ScrollSyncService } from '../scrolling/scroll-sync.service';
 import { isDocumentAvailable } from '@progress/kendo-angular-common';
 import { ContextService } from './provider.service';
+import { skip } from 'rxjs/operators';
 import * as i0 from "@angular/core";
 import * as i1 from "@progress/kendo-angular-popup";
 import * as i2 from "../scrolling/scroll-sync.service";
@@ -52,7 +53,8 @@ export class SinglePopupService {
          */
         this.onClose = new Subject();
         this.pointerEventsSub = new Subscription();
-        this.scrollSubscription = scrollSyncService.changes.subscribe(() => this.destroy());
+        this.canClosePopup = true;
+        this.scrollSubscription = scrollSyncService.changes.pipe(skip(1)).subscribe(() => this.destroy());
     }
     /**
      * @hidden

package/esm2020/filtering/menu/filter-menu.component.mjs

@@ -12,7 +12,6 @@ import { replaceMessagePlaceholder } from '../../utils';
 import { filterIcon } from '@progress/kendo-svg-icons';
 import { ContextService } from '../../common/provider.service';
 import { IdService } from '../../common/id.service';
-import { take } from 'rxjs/operators';
 import { FilterMenuContainerComponent } from './filter-menu-container.component';
 import { IconWrapperComponent } from '@progress/kendo-angular-icons';
 import * as i0 from "@angular/core";
@@ -38,6 +37,9 @@ export class FilterMenuComponent {
         this.filterIcon = filterIcon;
         this.tabIndex = '-1';
     }
+    ngOnDestroy() {
+        this.cleanUp();
+    }
     get hasFilters() {
         return filtersByField(this.filter, (this.column || {}).field).length > 0;
     }
@@ -61,12 +63,15 @@ export class FilterMenuComponent {
         // automatically when the Popup is closed by clicking outside the anchor
         const ariaRoot = this.isNavigable ? anchor.closest('.k-table-th') : anchor;
         if (this.popupRef) {
-            this.popupRef.popup.instance.close.pipe(take(1)).subscribe(() => {
-                this.popupRef = null;
-                const ariaRoot = this.isNavigable ? anchor.closest('.k-table-th') : anchor;
-                ariaRoot && this.renderer.removeAttribute(ariaRoot, 'aria-controls');
-                ariaRoot && this.renderer.setAttribute(ariaRoot, 'aria-expanded', 'false');
+            this.popupSubs?.unsubscribe();
+            this.popupSubs = this.popupRef.popup.instance.anchorViewportLeave.subscribe(() => {
+                this.close();
+                this.updateAria(ariaRoot);
             });
+            this.popupSubs.add(this.popupRef.popup.instance.close.subscribe(() => {
+                this.popupRef = null;
+                this.updateAria(ariaRoot);
+            }));
             const popupAriaElement = this.popupRef.popupElement.querySelector('.k-grid-filter-popup');
             if (popupAriaElement) {
                 const popupId = getId(this.idService?.gridId());
@@ -88,9 +93,7 @@ export class FilterMenuComponent {
         return false;
     }
     close() {
-        this.popupService.destroy();
-        this.popupRef = null;
-        this.cdr.markForCheck();
+        this.cleanUp();
         if (this.navigationService.tableEnabled) {
             this.navigationService.focusCell(0, this.column.leafIndex);
         }
@@ -98,6 +101,17 @@ export class FilterMenuComponent {
             this.anchor.nativeElement.focus();
         }
     }
+    updateAria(ariaRoot) {
+        ariaRoot && this.renderer.removeAttribute(ariaRoot, 'aria-controls');
+        ariaRoot && this.renderer.setAttribute(ariaRoot, 'aria-expanded', 'false');
+    }
+    cleanUp() {
+        this.popupService.destroy();
+        this.popupRef = null;
+        this.popupSubs?.unsubscribe();
+        this.popupSubs = null;
+        this.cdr.markForCheck();
+    }
 }
 FilterMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", 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.IdService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
 FilterMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", 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: `