@progress/kendo-angular-grid 21.4.1 → 22.0.0

package/esm2022/grouping/group-header.component.mjs

@@ -1,351 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2026 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-import { Component, HostBinding, Input } from '@angular/core';
-import { GroupInfoService } from './group-info.service';
-import { GroupsService } from './groups.service';
-import { columnsSpan } from '../columns/column-common';
-import { getGroupRowArgs } from './utils';
-import { ContextService } from '../common/provider.service';
-import { caretAltDownIcon, caretAltRightIcon, caretAltLeftIcon } from '@progress/kendo-svg-icons';
-import { FieldAccessorPipe } from '../rendering/common/field-accessor.pipe';
-import { IconWrapperComponent } from '@progress/kendo-angular-icons';
-import { LogicalCellDirective } from '../navigation/logical-cell.directive';
-import { NgTemplateOutlet } from '@angular/common';
-import { TemplateContextDirective } from '@progress/kendo-angular-common';
-import * as i0 from "@angular/core";
-import * as i1 from "./groups.service";
-import * as i2 from "./group-info.service";
-import * as i3 from "../common/provider.service";
-/**
- * @hidden
- */
-export class GroupHeaderComponent {
-    groupsService;
-    groupInfoService;
-    ctx;
-    rowIndex;
-    logicalRowIndex;
-    item;
-    skipGroupDecoration = false;
-    hasDetails = false;
-    totalColumnsCount = 0;
-    hasGroupHeaderColumn;
-    groupHeaderColumns;
-    columns;
-    groups = [];
-    groupItemClass = true;
-    tableGroupRowClass = true;
-    isExpanded = false;
-    caretAltDownIcon = caretAltDownIcon;
-    caretAltRightIcon = caretAltRightIcon;
-    caretAltLeftIcon = caretAltLeftIcon;
-    constructor(groupsService, groupInfoService, ctx) {
-        this.groupsService = groupsService;
-        this.groupInfoService = groupInfoService;
-        this.ctx = ctx;
-    }
-    ngDoCheck() {
-        const groupArgs = {
-            group: this.item.data,
-            groupIndex: this.item.index,
-            parentGroup: getGroupRowArgs(this.item.parentGroup)
-        };
-        this.isExpanded = this.groupsService.isExpanded(groupArgs);
-    }
-    prefixGroupCell(item) {
-        return new Array(item.level);
-    }
-    toggleGroup(item, event) {
-        this.groupsService.toggleRow(item);
-        if (this.ctx.navigable) {
-            this.ctx.grid.navigationService.focusCellByElement(event.target.closest('td'));
-        }
-        return false;
-    }
-    groupSpan(item) {
-        const groupCount = (this.groups || []).length;
-        const detailOffset = this.hasDetails ? 1 : 0;
-        if (this.hasGroupHeaderColumn) {
-            return groupCount + 1 + detailOffset - item.level;
-        }
-        const columnCount = columnsSpan(this.columns);
-        if (this.skipGroupDecoration) {
-            return columnCount;
-        }
-        return groupCount + columnCount + detailOffset - item.level;
-    }
-    logicalColSpan() {
-        return this.skipGroupDecoration ? 1 : this.totalColumnsCount;
-    }
-    ariaRole() {
-        if (this.skipGroupDecoration) {
-            return 'presentation';
-        }
-        return 'gridcell';
-    }
-    formatForGroup(item) {
-        return this.groupInfoService.formatForGroup(item);
-    }
-    groupTitle(item) {
-        return this.groupInfoService.groupTitle(item);
-    }
-    groupHeaderTemplate(item) {
-        return this.groupInfoService.groupHeaderTemplate(item);
-    }
-    get groupButtonTitle() {
-        const messageKey = this.isExpanded ? 'groupCollapse' : 'groupExpand';
-        return this.ctx.localization.get(messageKey);
-    }
-    get arrowIcon() {
-        const icon = !this.isExpanded ?
-            !this.ctx.localization.rtl ?
-                'caret-alt-right' :
-                'caret-alt-left' :
-            'caret-alt-down';
-        return icon;
-    }
-    get arrowSVGIcon() {
-        const icon = !this.isExpanded ?
-            !this.ctx.localization.rtl ?
-                this.caretAltRightIcon :
-                this.caretAltLeftIcon :
-            this.caretAltDownIcon;
-        return icon;
-    }
-    get isStacked() {
-        return this.ctx.grid?.isStacked;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: GroupHeaderComponent, deps: [{ token: i1.GroupsService }, { token: i2.GroupInfoService }, { token: i3.ContextService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: GroupHeaderComponent, isStandalone: true, selector: "[kendoGridGroupHeader]", inputs: { rowIndex: "rowIndex", logicalRowIndex: "logicalRowIndex", item: "item", skipGroupDecoration: "skipGroupDecoration", hasDetails: "hasDetails", totalColumnsCount: "totalColumnsCount", hasGroupHeaderColumn: "hasGroupHeaderColumn", groupHeaderColumns: "groupHeaderColumns", columns: "columns", groups: "groups" }, host: { properties: { "class.k-grouping-row": "this.groupItemClass", "class.k-table-group-row": "this.tableGroupRowClass" } }, ngImport: i0, template: `
-        @if (!skipGroupDecoration) {
-          @for (g of prefixGroupCell(item); track $index) {
-            <td class="k-group-cell k-table-td k-table-group-td"
-              role="presentation"
-            ></td>
-          }
-        }
-        @if (!(skipGroupDecoration && hasGroupHeaderColumn)) {
-          <td [attr.colspan]="groupSpan(item)"
-            [attr.role]="ariaRole()"
-            aria-selected="false"
-            class="k-table-td"
-            [attr.aria-expanded]="isExpanded"
-            kendoGridLogicalCell
-            [logicalRowIndex]="logicalRowIndex"
-            [logicalColIndex]="0"
-            [logicalSlaveCell]="skipGroupDecoration"
-            [groupItem]="item"
-            [colSpan]="logicalColSpan()">
-            <p class="k-reset">
-              @if (!skipGroupDecoration) {
-                <a href="#" tabindex="-1" (click)="toggleGroup(item, $event)"
-                  role="presentation"
-                  [attr.title]="groupButtonTitle"
-                  [attr.aria-label]="groupButtonTitle">
-                  <kendo-icon-wrapper
-                    [name]="arrowIcon"
-                  [svgIcon]="arrowSVGIcon"></kendo-icon-wrapper>
-                </a>
-                @if (!groupHeaderTemplate(item)) {
-                  {{groupTitle(item)}}: {{item.data | valueOf:"value": formatForGroup(item)}}
-                }
-                <ng-template
-                        [templateContext]="{
-                            templateRef: groupHeaderTemplate(item),
-                            group: item.data,
-                            aggregates: item.data?.aggregates,
-                            value: item.data?.value,
-                            field: item.data?.field,
-                            index: item.index,
-                            expanded: isExpanded,
-                            $implicit: item.data
-                            }">
-                </ng-template>
-              }
-            </p>
-            @if (isStacked) {
-              <div class="k-grid-column-template">
-                @for (column of groupHeaderColumns; track column; let index = $index) {
-                  @if (column.groupHeaderColumnTemplateRef) {
-                    <div class="k-column-template-item">
-                      <ng-template [ngTemplateOutlet]="column.groupHeaderColumnTemplateRef"
-                            [ngTemplateOutletContext]="{
-                                group: item.data,
-                                aggregates: item.data?.aggregates,
-                                value: item.data?.value,
-                                field: item.data?.field,
-                                index: item.index,
-                                $implicit: item.data
-                                }">
-                      </ng-template>
-                    </div>
-                  }
-                }
-              </div>
-            }
-          </td>
-        }
-        @if (hasGroupHeaderColumn && !isStacked) {
-          @for (column of groupHeaderColumns; track column; let index = $index) {
-            <td
-              role="gridcell"
-              class="k-table-td"
-              aria-selected="false"
-              kendoGridLogicalCell
-              [logicalRowIndex]="logicalRowIndex"
-              [logicalColIndex]="index + 1"
-              [logicalSlaveCell]="false"
-              [groupItem]="item"
-              [colSpan]="1"
-              >
-              @if (column.groupHeaderColumnTemplateRef) {
-                <ng-template [ngTemplateOutlet]="column.groupHeaderColumnTemplateRef"
-                    [ngTemplateOutletContext]="{
-                        group: item.data,
-                        aggregates: item.data?.aggregates,
-                        value: item.data?.value,
-                        field: item.data?.field,
-                        index: item.index,
-                        $implicit: item.data
-                        }">
-                </ng-template>
-              }
-            </td>
-          }
-        }
-        `, isInline: true, dependencies: [{ kind: "directive", type: LogicalCellDirective, selector: "[kendoGridLogicalCell]", inputs: ["logicalColIndex", "logicalRowIndex", "logicalSlaveCell", "colIndex", "colSpan", "rowSpan", "groupItem", "dataRowIndex", "dataItem", "detailExpandCell", "headerLabelText"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: FieldAccessorPipe, name: "valueOf" }] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: GroupHeaderComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: '[kendoGridGroupHeader]',
-                    template: `
-        @if (!skipGroupDecoration) {
-          @for (g of prefixGroupCell(item); track $index) {
-            <td class="k-group-cell k-table-td k-table-group-td"
-              role="presentation"
-            ></td>
-          }
-        }
-        @if (!(skipGroupDecoration && hasGroupHeaderColumn)) {
-          <td [attr.colspan]="groupSpan(item)"
-            [attr.role]="ariaRole()"
-            aria-selected="false"
-            class="k-table-td"
-            [attr.aria-expanded]="isExpanded"
-            kendoGridLogicalCell
-            [logicalRowIndex]="logicalRowIndex"
-            [logicalColIndex]="0"
-            [logicalSlaveCell]="skipGroupDecoration"
-            [groupItem]="item"
-            [colSpan]="logicalColSpan()">
-            <p class="k-reset">
-              @if (!skipGroupDecoration) {
-                <a href="#" tabindex="-1" (click)="toggleGroup(item, $event)"
-                  role="presentation"
-                  [attr.title]="groupButtonTitle"
-                  [attr.aria-label]="groupButtonTitle">
-                  <kendo-icon-wrapper
-                    [name]="arrowIcon"
-                  [svgIcon]="arrowSVGIcon"></kendo-icon-wrapper>
-                </a>
-                @if (!groupHeaderTemplate(item)) {
-                  {{groupTitle(item)}}: {{item.data | valueOf:"value": formatForGroup(item)}}
-                }
-                <ng-template
-                        [templateContext]="{
-                            templateRef: groupHeaderTemplate(item),
-                            group: item.data,
-                            aggregates: item.data?.aggregates,
-                            value: item.data?.value,
-                            field: item.data?.field,
-                            index: item.index,
-                            expanded: isExpanded,
-                            $implicit: item.data
-                            }">
-                </ng-template>
-              }
-            </p>
-            @if (isStacked) {
-              <div class="k-grid-column-template">
-                @for (column of groupHeaderColumns; track column; let index = $index) {
-                  @if (column.groupHeaderColumnTemplateRef) {
-                    <div class="k-column-template-item">
-                      <ng-template [ngTemplateOutlet]="column.groupHeaderColumnTemplateRef"
-                            [ngTemplateOutletContext]="{
-                                group: item.data,
-                                aggregates: item.data?.aggregates,
-                                value: item.data?.value,
-                                field: item.data?.field,
-                                index: item.index,
-                                $implicit: item.data
-                                }">
-                      </ng-template>
-                    </div>
-                  }
-                }
-              </div>
-            }
-          </td>
-        }
-        @if (hasGroupHeaderColumn && !isStacked) {
-          @for (column of groupHeaderColumns; track column; let index = $index) {
-            <td
-              role="gridcell"
-              class="k-table-td"
-              aria-selected="false"
-              kendoGridLogicalCell
-              [logicalRowIndex]="logicalRowIndex"
-              [logicalColIndex]="index + 1"
-              [logicalSlaveCell]="false"
-              [groupItem]="item"
-              [colSpan]="1"
-              >
-              @if (column.groupHeaderColumnTemplateRef) {
-                <ng-template [ngTemplateOutlet]="column.groupHeaderColumnTemplateRef"
-                    [ngTemplateOutletContext]="{
-                        group: item.data,
-                        aggregates: item.data?.aggregates,
-                        value: item.data?.value,
-                        field: item.data?.field,
-                        index: item.index,
-                        $implicit: item.data
-                        }">
-                </ng-template>
-              }
-            </td>
-          }
-        }
-        `,
-                    standalone: true,
-                    imports: [LogicalCellDirective, IconWrapperComponent, TemplateContextDirective, NgTemplateOutlet, FieldAccessorPipe]
-                }]
-        }], ctorParameters: () => [{ type: i1.GroupsService }, { type: i2.GroupInfoService }, { type: i3.ContextService }], propDecorators: { rowIndex: [{
-                type: Input
-            }], logicalRowIndex: [{
-                type: Input
-            }], item: [{
-                type: Input
-            }], skipGroupDecoration: [{
-                type: Input
-            }], hasDetails: [{
-                type: Input
-            }], totalColumnsCount: [{
-                type: Input
-            }], hasGroupHeaderColumn: [{
-                type: Input
-            }], groupHeaderColumns: [{
-                type: Input
-            }], columns: [{
-                type: Input
-            }], groups: [{
-                type: Input
-            }], groupItemClass: [{
-                type: HostBinding,
-                args: ['class.k-grouping-row']
-            }], tableGroupRowClass: [{
-                type: HostBinding,
-                args: ['class.k-table-group-row']
-            }] } });

package/esm2022/grouping/group-info.service.mjs

@@ -1,43 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2026 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-import { expandColumns } from '../columns/column-common';
-import { ColumnList } from '../columns/column-list';
-import { isColumnComponent } from '../columns/column.component';
-/**
- * @hidden
- */
-export class GroupInfoService {
-    _columnList = ColumnList.empty;
-    get columns() {
-        return expandColumns(this._columnList().toArray()).filter(isColumnComponent);
-    }
-    registerColumnsContainer(columns) {
-        this._columnList = columns;
-    }
-    formatForGroup(item) {
-        const column = this.columnForGroup(item);
-        return column ? column.format : "";
-    }
-    isGroupable(groupField) {
-        const [column] = this.columns.filter(x => x.field === groupField);
-        return column ? column.groupable : true;
-    }
-    groupTitle(item) {
-        const column = this.columnForGroup(item);
-        return column ? (column.title || column.field) : this.groupField(item);
-    }
-    groupHeaderTemplate(item) {
-        const column = this.columnForGroup(item);
-        return column ? column.groupHeaderTemplateRef || column.groupHeaderColumnTemplateRef : undefined;
-    }
-    groupField(group) {
-        return group.data ? group.data.field : group.field;
-    }
-    columnForGroup(group) {
-        const field = this.groupField(group);
-        const [column] = this.columns.filter(x => x.field === field);
-        return column;
-    }
-}

package/esm2022/grouping/group-key.interface.mjs

@@ -1,5 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2026 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-export {};