@progress/kendo-angular-grid 17.0.0-develop.4 → 17.0.0-develop.40

package/{esm2020 → esm2022}/rendering/details/detail-template.directive.mjs

@@ -24,10 +24,7 @@ import * as i0 from "@angular/core";
  *
  */
 export class DetailTemplateDirective {
-    constructor(templateRef) {
-        this.templateRef = templateRef;
-        this._condition = () => true;
-    }
+    templateRef;
     /**
      * Defines the function that indicates if a given detail row and the associated **Expand** or **Collapse** button will be displayed.
      */
@@ -40,10 +37,14 @@ export class DetailTemplateDirective {
     get showIf() {
         return this._condition;
     }
+    constructor(templateRef) {
+        this.templateRef = templateRef;
+    }
+    _condition = () => true;
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DetailTemplateDirective, deps: [{ token: i0.TemplateRef, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: DetailTemplateDirective, isStandalone: true, selector: "[kendoGridDetailTemplate]", inputs: { showIf: ["kendoGridDetailTemplateShowIf", "showIf"] }, ngImport: i0 });
 }
-DetailTemplateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DetailTemplateDirective, deps: [{ token: i0.TemplateRef, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-DetailTemplateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: DetailTemplateDirective, isStandalone: true, selector: "[kendoGridDetailTemplate]", inputs: { showIf: ["kendoGridDetailTemplateShowIf", "showIf"] }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DetailTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DetailTemplateDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kendoGridDetailTemplate]',

package/{esm2020 → esm2022}/rendering/details/details.service.mjs

@@ -11,10 +11,9 @@ import * as i0 from "@angular/core";
  * @hidden
  */
 export class DetailsService {
-    constructor() {
-        this.changes = new Subject();
-        this.rowState = new Set();
-    }
+    userCallback;
+    changes = new Subject();
+    rowState = new Set();
     ngOnDestroy() {
         this.rowState.clear();
     }
@@ -49,9 +48,9 @@ export class DetailsService {
         this.changes.next(eventArg);
         return eventArg.isDefaultPrevented();
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DetailsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DetailsService });
 }
-DetailsService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DetailsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-DetailsService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DetailsService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DetailsService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DetailsService, decorators: [{
             type: Injectable
         }] });

package/{esm2020 → esm2022}/rendering/details-expand.directive.mjs

@@ -14,28 +14,11 @@ import * as i1 from "../grid.component";
  * A directive which controls the expanded state of the master detail rows. ([see example](slug:master_detail_expanded_state_grid#toc-built-in-directive))
  */
 export class ExpandDetailsDirective {
-    constructor(grid) {
-        this.grid = grid;
-        /**
-         * Fires when the expandedDetailKeys are changed.
-         */
-        this.expandedDetailKeysChange = new EventEmitter();
-        /**
-         * Defines the collection that will store the expanded keys.
-         */
-        this.expandedDetailKeys = [];
-        /**
-         * Specifies if the items should be initially expanded.
-         * When set to `true` items added to the `expandedDetailKeys` collection will be collapsed, and items that are not present in it will be expanded.
-         *
-         * @default false
-         */
-        this.initiallyExpanded = false;
-        this.expandedState = new Set();
-        this.subscriptions = new Subscription();
-        this.grid.isDetailExpanded = this.isExpanded.bind(this);
-        this.subscriptions.add(merge(this.grid.detailExpand.pipe(map(e => ({ expand: true, ...e }))), this.grid.detailCollapse.pipe(map(e => ({ expand: false, ...e })))).subscribe(this.toggleState.bind(this)));
-    }
+    grid;
+    /**
+     * Fires when the expandedDetailKeys are changed.
+     */
+    expandedDetailKeysChange = new EventEmitter();
     /**
      * Defines the item key that will be stored in the `expandedDetailKeys` collection ([see example]({% slug master_detail_expanded_state_grid %}#toc-built-in-directive)).
      */
@@ -61,6 +44,26 @@ export class ExpandDetailsDirective {
     set expandDetailBy(key) {
         this.expandDetailsKey = key;
     }
+    /**
+     * Defines the collection that will store the expanded keys.
+     */
+    expandedDetailKeys = [];
+    /**
+     * Specifies if the items should be initially expanded.
+     * When set to `true` items added to the `expandedDetailKeys` collection will be collapsed, and items that are not present in it will be expanded.
+     *
+     * @default false
+     */
+    initiallyExpanded = false;
+    expandedState = new Set();
+    lastExpandedState;
+    _expandBy;
+    subscriptions = new Subscription();
+    constructor(grid) {
+        this.grid = grid;
+        this.grid.isDetailExpanded = this.isExpanded.bind(this);
+        this.subscriptions.add(merge(this.grid.detailExpand.pipe(map(e => ({ expand: true, ...e }))), this.grid.detailCollapse.pipe(map(e => ({ expand: false, ...e })))).subscribe(this.toggleState.bind(this)));
+    }
     ngOnChanges(changes) {
         // skip reinitialization if the user data is the same as the last state change
         if (isPresent(changes['expandedDetailKeys']) && this.lastExpandedState !== this.expandedDetailKeys) {
@@ -96,10 +99,10 @@ export class ExpandDetailsDirective {
         this.lastExpandedState = Array.from(this.expandedState);
         this.expandedDetailKeysChange.emit(this.lastExpandedState);
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ExpandDetailsDirective, deps: [{ token: i1.GridComponent }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: ExpandDetailsDirective, isStandalone: true, selector: "[kendoGridExpandDetailsBy]", inputs: { expandDetailsKey: ["kendoGridExpandDetailsBy", "expandDetailsKey"], expandDetailBy: "expandDetailBy", expandedDetailKeys: "expandedDetailKeys", initiallyExpanded: "initiallyExpanded" }, outputs: { expandedDetailKeysChange: "expandedDetailKeysChange" }, exportAs: ["kendoGridExpandDetailsBy"], usesOnChanges: true, ngImport: i0 });
 }
-ExpandDetailsDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ExpandDetailsDirective, deps: [{ token: i1.GridComponent }], target: i0.ɵɵFactoryTarget.Directive });
-ExpandDetailsDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: ExpandDetailsDirective, isStandalone: true, selector: "[kendoGridExpandDetailsBy]", inputs: { expandDetailsKey: ["kendoGridExpandDetailsBy", "expandDetailsKey"], expandDetailBy: "expandDetailBy", expandedDetailKeys: "expandedDetailKeys", initiallyExpanded: "initiallyExpanded" }, outputs: { expandedDetailKeysChange: "expandedDetailKeysChange" }, exportAs: ["kendoGridExpandDetailsBy"], usesOnChanges: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ExpandDetailsDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ExpandDetailsDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kendoGridExpandDetailsBy]',

package/{esm2020 → esm2022}/rendering/footer/footer-template.directive.mjs

@@ -30,13 +30,14 @@ import * as i0 from "@angular/core";
  * ```
  */
 export class FooterTemplateDirective {
+    templateRef;
     constructor(templateRef) {
         this.templateRef = templateRef;
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FooterTemplateDirective, deps: [{ token: i0.TemplateRef, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: FooterTemplateDirective, isStandalone: true, selector: "[kendoGridFooterTemplate]", ngImport: i0 });
 }
-FooterTemplateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FooterTemplateDirective, deps: [{ token: i0.TemplateRef, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-FooterTemplateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: FooterTemplateDirective, isStandalone: true, selector: "[kendoGridFooterTemplate]", ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FooterTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FooterTemplateDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kendoGridFooterTemplate]',

package/{esm2020 → esm2022}/rendering/footer/footer.component.mjs

@@ -19,18 +19,22 @@ import * as i1 from "./../../common/column-info.service";
  * @hidden
  */
 export class FooterComponent {
-    constructor(columnInfoService) {
-        this.columnInfoService = columnInfoService;
-        this.columns = [];
-        this.groups = [];
-        this.lockedColumnsCount = 0;
-        this.logicalRowIndex = 0;
-        this.hostClass = true;
-        this.hostRole = 'rowgroup';
-    }
+    columnInfoService;
+    columns = [];
+    groups = [];
+    detailTemplate;
+    scrollable;
+    lockedColumnsCount = 0;
+    logicalRowIndex = 0;
+    totalColumns;
     get footerClass() {
         return !this.scrollable;
     }
+    hostClass = true;
+    hostRole = 'rowgroup';
+    constructor(columnInfoService) {
+        this.columnInfoService = columnInfoService;
+    }
     get columnsToRender() {
         return columnsToRender(this.columns || []);
     }
@@ -51,9 +55,8 @@ export class FooterComponent {
     isColumnGroupComponent(column) {
         return isColumnGroupComponent(column);
     }
-}
-FooterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FooterComponent, deps: [{ token: i1.ColumnInfoService }], target: i0.ɵɵFactoryTarget.Component });
-FooterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: FooterComponent, isStandalone: true, selector: "[kendoGridFooter]", inputs: { columns: "columns", groups: "groups", detailTemplate: "detailTemplate", scrollable: "scrollable", lockedColumnsCount: "lockedColumnsCount", logicalRowIndex: "logicalRowIndex", totalColumns: "totalColumns" }, host: { properties: { "class.k-grid-footer": "this.footerClass", "class.k-table-tfoot": "this.hostClass", "attr.role": "this.hostRole" } }, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FooterComponent, deps: [{ token: i1.ColumnInfoService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FooterComponent, isStandalone: true, selector: "[kendoGridFooter]", inputs: { columns: "columns", groups: "groups", detailTemplate: "detailTemplate", scrollable: "scrollable", lockedColumnsCount: "lockedColumnsCount", logicalRowIndex: "logicalRowIndex", totalColumns: "totalColumns" }, host: { properties: { "class.k-grid-footer": "this.footerClass", "class.k-table-tfoot": "this.hostClass", "attr.role": "this.hostRole" } }, ngImport: i0, template: `
     <ng-container>
         <tr
             [class.k-footer-template]="true"
@@ -65,7 +68,7 @@ FooterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", versio
                 [totalColumns]="totalColumns"
             >
             <td
-                class="k-table-td k-group-cell"
+                class="k-table-td k-group-cell k-table-group-td"
                 role="presentation"
                 *ngFor="let g of groups">
             </td>
@@ -98,7 +101,8 @@ FooterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", versio
         </tr>
     </ng-container>
     `, isInline: true, dependencies: [{ kind: "directive", type: LogicalRowDirective, selector: "[kendoGridLogicalRow]", inputs: ["logicalRowIndex", "logicalSlaveRow", "logicalCellsCount", "logicalSlaveCellsCount", "dataRowIndex", "dataItem", "totalColumns"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: LogicalCellDirective, selector: "[kendoGridLogicalCell]", inputs: ["logicalColIndex", "logicalRowIndex", "logicalSlaveCell", "colIndex", "colSpan", "rowSpan", "groupItem", "dataRowIndex", "dataItem", "detailExpandCell", "headerLabelText"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: FooterComponent, decorators: [{
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FooterComponent, decorators: [{
             type: Component,
             args: [{
                     selector: '[kendoGridFooter]',
@@ -114,7 +118,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                 [totalColumns]="totalColumns"
             >
             <td
-                class="k-table-td k-group-cell"
+                class="k-table-td k-group-cell k-table-group-td"
                 role="presentation"
                 *ngFor="let g of groups">
             </td>

package/{esm2020 → esm2022}/rendering/grid-table.directive.mjs

@@ -8,11 +8,8 @@ import * as i0 from "@angular/core";
  * @hidden
  */
 export class GridTableDirective {
-    constructor(wrapper) {
-        this.wrapper = wrapper;
-        this.hostClass = true;
-        this._size = 'medium';
-    }
+    wrapper;
+    hostClass = true;
     get sizeSmallClass() {
         return this.size === 'small';
     }
@@ -28,10 +25,14 @@ export class GridTableDirective {
     get size() {
         return this._size;
     }
+    _size = 'medium';
+    constructor(wrapper) {
+        this.wrapper = wrapper;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GridTableDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: GridTableDirective, isStandalone: true, selector: "[kendoGridTable]", inputs: { size: "size" }, host: { properties: { "class.k-table": "this.hostClass", "class.k-table-sm": "this.sizeSmallClass", "class.k-table-md": "this.sizeMediumClass" } }, ngImport: i0 });
 }
-GridTableDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: GridTableDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-GridTableDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: GridTableDirective, isStandalone: true, selector: "[kendoGridTable]", inputs: { size: "size" }, host: { properties: { "class.k-table": "this.hostClass", "class.k-table-sm": "this.sizeSmallClass", "class.k-table-md": "this.sizeMediumClass" } }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: GridTableDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GridTableDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kendoGridTable]',

package/{esm2020 → esm2022}/rendering/groups-expand.directive.mjs

@@ -27,21 +27,11 @@ const DEFAULT_KEY_GETTER = (groupRowArgs) => ({
  * ([see example]({% slug groups_expanded_state_grid %}#toc-built-in-directive)).
  */
 export class ExpandGroupDirective {
-    constructor(grid) {
-        this.grid = grid;
-        /**
-         * Fires when the expandedGroupKeys are changed.
-         */
-        this.expandedGroupKeysChange = new EventEmitter();
-        /**
-         * Specifies if the group items should be initially expanded.
-         * @default false
-         */
-        this.groupsInitiallyExpanded = false;
-        this.subscriptions = new Subscription();
-        this.grid.isGroupExpanded = this.isExpanded.bind(this);
-        this.subscriptions.add(merge(this.grid.groupExpand.pipe(map(e => ({ expand: true, ...e }))), this.grid.groupCollapse.pipe(map(e => ({ expand: false, ...e })))).subscribe(this.toggleState.bind(this)));
-    }
+    grid;
+    /**
+     * Fires when the expandedGroupKeys are changed.
+     */
+    expandedGroupKeysChange = new EventEmitter();
     /**
      * Defines the item format that will be stored in the `expandedGroupKeys`
      * ([see example]({% slug groups_expanded_state_grid %}#toc-custom-group-key-format)).
@@ -63,6 +53,19 @@ export class ExpandGroupDirective {
     set expandedGroupKeys(expandedGroups) {
         this._expandedGroupKeys = (expandedGroups || []).slice();
     }
+    /**
+     * Specifies if the group items should be initially expanded.
+     * @default false
+     */
+    groupsInitiallyExpanded = false;
+    _expandGroupBy;
+    _expandedGroupKeys;
+    subscriptions = new Subscription();
+    constructor(grid) {
+        this.grid = grid;
+        this.grid.isGroupExpanded = this.isExpanded.bind(this);
+        this.subscriptions.add(merge(this.grid.groupExpand.pipe(map(e => ({ expand: true, ...e }))), this.grid.groupCollapse.pipe(map(e => ({ expand: false, ...e })))).subscribe(this.toggleState.bind(this)));
+    }
     ngOnDestroy() {
         this.subscriptions.unsubscribe();
     }
@@ -114,10 +117,10 @@ export class ExpandGroupDirective {
         }
         this.expandedGroupKeysChange.emit(this.expandedGroupKeys.slice());
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ExpandGroupDirective, deps: [{ token: i1.GridComponent }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: ExpandGroupDirective, isStandalone: true, selector: "[kendoGridExpandGroupBy]", inputs: { expandGroupBy: ["kendoGridExpandGroupBy", "expandGroupBy"], expandedGroupKeys: "expandedGroupKeys", groupsInitiallyExpanded: "groupsInitiallyExpanded" }, outputs: { expandedGroupKeysChange: "expandedGroupKeysChange" }, exportAs: ["kendoGridExpandGroupBy"], ngImport: i0 });
 }
-ExpandGroupDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ExpandGroupDirective, deps: [{ token: i1.GridComponent }], target: i0.ɵɵFactoryTarget.Directive });
-ExpandGroupDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: ExpandGroupDirective, isStandalone: true, selector: "[kendoGridExpandGroupBy]", inputs: { expandGroupBy: ["kendoGridExpandGroupBy", "expandGroupBy"], expandedGroupKeys: "expandedGroupKeys", groupsInitiallyExpanded: "groupsInitiallyExpanded" }, outputs: { expandedGroupKeysChange: "expandedGroupKeysChange" }, exportAs: ["kendoGridExpandGroupBy"], ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ExpandGroupDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ExpandGroupDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kendoGridExpandGroupBy]',

package/{esm2020 → esm2022}/rendering/header/header-template.directive.mjs

@@ -27,13 +27,14 @@ import * as i0 from "@angular/core";
  * ```
  */
 export class HeaderTemplateDirective {
+    templateRef;
     constructor(templateRef) {
         this.templateRef = templateRef;
     }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HeaderTemplateDirective, deps: [{ token: i0.TemplateRef, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: HeaderTemplateDirective, isStandalone: true, selector: "[kendoGridHeaderTemplate]", ngImport: i0 });
 }
-HeaderTemplateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: HeaderTemplateDirective, deps: [{ token: i0.TemplateRef, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
-HeaderTemplateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: HeaderTemplateDirective, isStandalone: true, selector: "[kendoGridHeaderTemplate]", ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: HeaderTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HeaderTemplateDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[kendoGridHeaderTemplate]',

package/{esm2020 → esm2022}/rendering/header/header.component.mjs

@@ -41,6 +41,7 @@ import { LogicalCellDirective } from '../../navigation/logical-cell.directive';
 import { LogicalRowDirective } from '../../navigation/logical-row.directive';
 import { NgFor, NgIf, NgClass, NgStyle } from '@angular/common';
 import { IconWrapperComponent } from '@progress/kendo-angular-icons';
+import { CheckBoxComponent } from '@progress/kendo-angular-inputs';
 import * as i0 from "@angular/core";
 import * as i1 from "../../common/single-popup.service";
 import * as i2 from "../../dragdrop/drag-hint.service";
@@ -76,50 +77,76 @@ const modifierKeys = ['alt', 'ctrl', 'shift', 'meta'];
  * @hidden
  */
 export class HeaderComponent {
-    constructor(popupService, hint, cue, reorderService, idService, sortService, columnInfoService, cd, contextService, navigationService, zone) {
-        this.popupService = popupService;
-        this.hint = hint;
-        this.cue = cue;
-        this.reorderService = reorderService;
-        this.idService = idService;
-        this.sortService = sortService;
-        this.columnInfoService = columnInfoService;
-        this.cd = cd;
-        this.contextService = contextService;
-        this.navigationService = navigationService;
-        this.zone = zone;
-        this.columns = [];
-        this.groups = [];
-        this.sort = new Array();
-        this.sortable = false;
-        this.groupable = false;
-        this.lockedColumnsCount = 0;
-        this.resizable = false;
-        this.reorderable = false;
-        this.columnMenu = false;
-        this.totalColumnsCount = 0;
-        this.size = 'medium';
-        this.sortedFields = {};
-        this.hostClass = true;
-        this.dropTargets = new QueryList();
-        this.sortAscSmallIcon = sortAscSmallIcon;
-        this.sortDescSmallIcon = sortDescSmallIcon;
-        this.subscription = new Subscription();
-        this.stopSorting = false;
-    }
+    popupService;
+    hint;
+    cue;
+    reorderService;
+    idService;
+    sortService;
+    columnInfoService;
+    cd;
+    contextService;
+    navigationService;
+    zone;
+    /**
+     * @hidden
+     */
+    totalColumnLevels;
+    columns = [];
+    groups = [];
+    detailTemplate;
+    scrollable;
+    filterable;
+    sort = new Array();
+    filter;
+    sortable = false;
+    groupable = false;
+    lockedColumnsCount = 0;
+    resizable = false;
+    reorderable = false;
+    columnMenu = false;
+    columnMenuTemplate;
+    totalColumnsCount = 0;
+    totalColumns;
+    tabIndex;
+    size = 'medium';
+    sortedFields = {};
     get headerClass() {
         return !this.scrollable;
     }
+    hostClass = true;
     get sortableLabel() {
         return this.contextService.localization.get('sortable');
     }
     get columnMenuSettings() {
         return this.columnMenu;
     }
+    dropTargets = new QueryList();
+    filterMenus;
+    columnMenus;
     // Number of unlocked columns in the next table, if any
     get unlockedColumnsCount() {
         return this.totalColumnsCount - this.lockedColumnsCount - this.columns.length;
     }
+    sortAscSmallIcon = sortAscSmallIcon;
+    sortDescSmallIcon = sortDescSmallIcon;
+    subscription = new Subscription();
+    targetSubscription;
+    stopSorting = false;
+    _leafColumns;
+    constructor(popupService, hint, cue, reorderService, idService, sortService, columnInfoService, cd, contextService, navigationService, zone) {
+        this.popupService = popupService;
+        this.hint = hint;
+        this.cue = cue;
+        this.reorderService = reorderService;
+        this.idService = idService;
+        this.sortService = sortService;
+        this.columnInfoService = columnInfoService;
+        this.cd = cd;
+        this.contextService = contextService;
+        this.navigationService = navigationService;
+        this.zone = zone;
+    }
     sortColumn(descriptor) {
         this.sortService.sort(descriptor);
     }
@@ -465,9 +492,8 @@ export class HeaderComponent {
             target: target.context.column
         });
     }
-}
-HeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: HeaderComponent, deps: [{ token: i1.SinglePopupService }, { token: i2.DragHintService }, { token: i3.DropCueService }, { token: i4.ColumnReorderService }, { token: i5.IdService }, { token: i6.SortService }, { token: i7.ColumnInfoService }, { token: i0.ChangeDetectorRef }, { token: i8.ContextService }, { token: i9.NavigationService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
-HeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: HeaderComponent, isStandalone: true, selector: "[kendoGridHeader]", inputs: { totalColumnLevels: "totalColumnLevels", columns: "columns", groups: "groups", detailTemplate: "detailTemplate", scrollable: "scrollable", filterable: "filterable", sort: "sort", filter: "filter", sortable: "sortable", groupable: "groupable", lockedColumnsCount: "lockedColumnsCount", resizable: "resizable", reorderable: "reorderable", columnMenu: "columnMenu", columnMenuTemplate: "columnMenuTemplate", totalColumnsCount: "totalColumnsCount", totalColumns: "totalColumns", tabIndex: "tabIndex", size: "size" }, host: { properties: { "class.k-grid-header": "this.headerClass", "class.k-table-thead": "this.hostClass" } }, viewQueries: [{ propertyName: "dropTargets", predicate: DropTargetDirective, descendants: true }, { propertyName: "filterMenus", predicate: FilterMenuComponent, descendants: true }, { propertyName: "columnMenus", predicate: ColumnMenuComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HeaderComponent, deps: [{ token: i1.SinglePopupService }, { token: i2.DragHintService }, { token: i3.DropCueService }, { token: i4.ColumnReorderService }, { token: i5.IdService }, { token: i6.SortService }, { token: i7.ColumnInfoService }, { token: i0.ChangeDetectorRef }, { token: i8.ContextService }, { token: i9.NavigationService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: HeaderComponent, isStandalone: true, selector: "[kendoGridHeader]", inputs: { totalColumnLevels: "totalColumnLevels", columns: "columns", groups: "groups", detailTemplate: "detailTemplate", scrollable: "scrollable", filterable: "filterable", sort: "sort", filter: "filter", sortable: "sortable", groupable: "groupable", lockedColumnsCount: "lockedColumnsCount", resizable: "resizable", reorderable: "reorderable", columnMenu: "columnMenu", columnMenuTemplate: "columnMenuTemplate", totalColumnsCount: "totalColumnsCount", totalColumns: "totalColumns", tabIndex: "tabIndex", size: "size" }, host: { properties: { "class.k-grid-header": "this.headerClass", "class.k-table-thead": "this.hostClass" } }, viewQueries: [{ propertyName: "dropTargets", predicate: DropTargetDirective, descendants: true }, { propertyName: "filterMenus", predicate: FilterMenuComponent, descendants: true }, { propertyName: "columnMenus", predicate: ColumnMenuComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: `
     <ng-container>
         <tr *ngFor="let i of columnLevels; let levelIndex = index"
             kendoGridLogicalRow
@@ -570,7 +596,7 @@ HeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", versio
                                 <ng-container *ngIf="!column.headerTemplateRef">
                                     <span class="k-column-title">{{column.displayTitle}}</span>
                                 </ng-container>
-                                <span class="k-sort-icon">
+                                <span [class.k-sort-icon]="sortDescriptor(getColumnComponent(column).field).dir">
                                     <kendo-icon-wrapper
                                         *ngIf="sortDescriptor(getColumnComponent(column).field).dir"
                                         role="note" [attr.aria-label]="sortableLabel"
@@ -600,14 +626,12 @@ HeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", versio
                     </ng-container>
 
                     <ng-container *ngIf="isCheckboxColumn(column) && !column.headerTemplateRef && $any(column).showSelectAll">
-                        <span class="k-checkbox-wrap">
-                            <input
-                                class="k-checkbox k-checkbox-md k-rounded-md"
-                                [attr.id]="selectAllCheckboxId()"
-                                [attr.aria-label]="selectAllCheckboxLabel"
-                                kendoGridSelectAllCheckbox
-                                kendoGridFocusable>
-                        </span>
+                        <kendo-checkbox
+                            [attr.id]="selectAllCheckboxId()"
+                            [inputAttributes]="{'aria-label': selectAllCheckboxLabel}"
+                            kendoGridSelectAllCheckbox
+                            kendoGridFocusable
+                        ></kendo-checkbox>
                     </ng-container>
                     <span kendoGridColumnHandle
                         kendoDraggable
@@ -688,8 +712,9 @@ HeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", versio
                 [totalColumns]="totalColumns"
         ></tr>
     </ng-container>
-    `, isInline: true, dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: LogicalRowDirective, selector: "[kendoGridLogicalRow]", inputs: ["logicalRowIndex", "logicalSlaveRow", "logicalCellsCount", "logicalSlaveCellsCount", "dataRowIndex", "dataItem", "totalColumns"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: LogicalCellDirective, selector: "[kendoGridLogicalCell]", inputs: ["logicalColIndex", "logicalRowIndex", "logicalSlaveCell", "colIndex", "colSpan", "rowSpan", "groupItem", "dataRowIndex", "dataItem", "detailExpandCell", "headerLabelText"] }, { kind: "directive", type: DropTargetDirective, selector: "[kendoDropTarget]", inputs: ["context"], outputs: ["enter", "leave", "drop"] }, { kind: "directive", type: DraggableDirective, selector: "[kendoDraggable]", inputs: ["enableDrag"], outputs: ["kendoPress", "kendoDrag", "kendoRelease"] }, { kind: "directive", type: DraggableColumnDirective, selector: "[kendoDraggableColumn]", inputs: ["context", "enableDrag"], outputs: ["drag"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }, { kind: "component", type: FilterMenuComponent, selector: "kendo-grid-filter-menu", inputs: ["column", "filter", "tabIndex"] }, { kind: "component", type: ColumnMenuComponent, selector: "kendo-grid-column-menu", inputs: ["standalone", "column", "settings", "sort", "filter", "sortable", "columnMenuTemplate", "tabIndex"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: SelectAllCheckboxDirective, selector: "[kendoGridSelectAllCheckbox]", inputs: ["state"], outputs: ["selectAllChange"] }, { kind: "directive", type: FocusableDirective, selector: "[kendoGridFocusable],\n        [kendoGridEditCommand],\n        [kendoGridRemoveCommand],\n        [kendoGridSaveCommand],\n        [kendoGridCancelCommand],\n        [kendoGridSelectionCheckbox]\n    ", inputs: ["kendoGridFocusable"] }, { kind: "directive", type: ColumnHandleDirective, selector: "[kendoGridColumnHandle]", inputs: ["columns", "column"] }, { kind: "component", type: FilterRowComponent, selector: "[kendoGridFilterRow]", inputs: ["columns", "filter", "groups", "detailTemplate", "logicalRowIndex", "lockedColumnsCount"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: HeaderComponent, decorators: [{
+    `, isInline: true, dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: LogicalRowDirective, selector: "[kendoGridLogicalRow]", inputs: ["logicalRowIndex", "logicalSlaveRow", "logicalCellsCount", "logicalSlaveCellsCount", "dataRowIndex", "dataItem", "totalColumns"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: LogicalCellDirective, selector: "[kendoGridLogicalCell]", inputs: ["logicalColIndex", "logicalRowIndex", "logicalSlaveCell", "colIndex", "colSpan", "rowSpan", "groupItem", "dataRowIndex", "dataItem", "detailExpandCell", "headerLabelText"] }, { kind: "directive", type: DropTargetDirective, selector: "[kendoDropTarget]", inputs: ["context"], outputs: ["enter", "leave", "drop"] }, { kind: "directive", type: DraggableDirective, selector: "[kendoDraggable]", inputs: ["enableDrag"], outputs: ["kendoPress", "kendoDrag", "kendoRelease"] }, { kind: "directive", type: DraggableColumnDirective, selector: "[kendoDraggableColumn]", inputs: ["context", "enableDrag"], outputs: ["drag"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }, { kind: "component", type: FilterMenuComponent, selector: "kendo-grid-filter-menu", inputs: ["column", "filter", "tabIndex"] }, { kind: "component", type: ColumnMenuComponent, selector: "kendo-grid-column-menu", inputs: ["standalone", "column", "settings", "sort", "filter", "sortable", "columnMenuTemplate", "tabIndex"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: SelectAllCheckboxDirective, selector: "[kendoGridSelectAllCheckbox]", inputs: ["state"], outputs: ["selectAllChange"] }, { kind: "directive", type: FocusableDirective, selector: "[kendoGridFocusable],\n        [kendoGridEditCommand],\n        [kendoGridRemoveCommand],\n        [kendoGridSaveCommand],\n        [kendoGridCancelCommand],\n        [kendoGridSelectionCheckbox]\n    ", inputs: ["kendoGridFocusable"] }, { kind: "directive", type: ColumnHandleDirective, selector: "[kendoGridColumnHandle]", inputs: ["columns", "column"] }, { kind: "component", type: FilterRowComponent, selector: "[kendoGridFilterRow]", inputs: ["columns", "filter", "groups", "detailTemplate", "logicalRowIndex", "lockedColumnsCount"] }, { kind: "component", type: CheckBoxComponent, selector: "kendo-checkbox", inputs: ["checkedState", "rounded"], outputs: ["checkedStateChange"], exportAs: ["kendoCheckBox"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HeaderComponent, decorators: [{
             type: Component,
             args: [{
                     selector: '[kendoGridHeader]',
@@ -796,7 +821,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                                 <ng-container *ngIf="!column.headerTemplateRef">
                                     <span class="k-column-title">{{column.displayTitle}}</span>
                                 </ng-container>
-                                <span class="k-sort-icon">
+                                <span [class.k-sort-icon]="sortDescriptor(getColumnComponent(column).field).dir">
                                     <kendo-icon-wrapper
                                         *ngIf="sortDescriptor(getColumnComponent(column).field).dir"
                                         role="note" [attr.aria-label]="sortableLabel"
@@ -826,14 +851,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                     </ng-container>
 
                     <ng-container *ngIf="isCheckboxColumn(column) && !column.headerTemplateRef && $any(column).showSelectAll">
-                        <span class="k-checkbox-wrap">
-                            <input
-                                class="k-checkbox k-checkbox-md k-rounded-md"
-                                [attr.id]="selectAllCheckboxId()"
-                                [attr.aria-label]="selectAllCheckboxLabel"
-                                kendoGridSelectAllCheckbox
-                                kendoGridFocusable>
-                        </span>
+                        <kendo-checkbox
+                            [attr.id]="selectAllCheckboxId()"
+                            [inputAttributes]="{'aria-label': selectAllCheckboxLabel}"
+                            kendoGridSelectAllCheckbox
+                            kendoGridFocusable
+                        ></kendo-checkbox>
                     </ng-container>
                     <span kendoGridColumnHandle
                         kendoDraggable
@@ -919,7 +942,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                     imports: [
                         NgFor, LogicalRowDirective, NgIf, LogicalCellDirective, DropTargetDirective, DraggableDirective, DraggableColumnDirective,
                         NgClass, NgStyle, TemplateContextDirective, FilterMenuComponent, ColumnMenuComponent, IconWrapperComponent, SelectAllCheckboxDirective,
-                        FocusableDirective, ColumnHandleDirective, FilterRowComponent
+                        FocusableDirective, ColumnHandleDirective, FilterRowComponent, CheckBoxComponent
                     ]
                 }]
         }], ctorParameters: function () { return [{ type: i1.SinglePopupService }, { type: i2.DragHintService }, { type: i3.DropCueService }, { type: i4.ColumnReorderService }, { type: i5.IdService }, { type: i6.SortService }, { type: i7.ColumnInfoService }, { type: i0.ChangeDetectorRef }, { type: i8.ContextService }, { type: i9.NavigationService }, { type: i0.NgZone }]; }, propDecorators: { totalColumnLevels: [{