@progress/kendo-angular-grid 18.4.1-develop.2 → 18.5.0-develop.10

package/esm2022/rendering/footer/footer.component.mjs

@@ -27,6 +27,7 @@ export class FooterComponent {
     lockedColumnsCount = 0;
     logicalRowIndex = 0;
     totalColumns;
+    totalColumnsCount = 0;
     get footerClass() {
         return !this.scrollable;
     }
@@ -38,6 +39,10 @@ export class FooterComponent {
     get columnsToRender() {
         return columnsToRender(this.columns || []);
     }
+    // Number of unlocked columns in the next table, if any
+    get unlockedColumnsCount() {
+        return this.totalColumnsCount - this.lockedColumnsCount - this.columns.length;
+    }
     trackByIndex(index) {
         return index;
     }
@@ -56,15 +61,15 @@ export class FooterComponent {
         return isColumnGroupComponent(column);
     }
     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: `
+    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", totalColumnsCount: "totalColumnsCount" }, 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"
+            class="k-footer-template"
             kendoGridLogicalRow
                 [logicalRowIndex]="logicalRowIndex"
                 [logicalSlaveRow]="lockedColumnsCount > 0"
                 [logicalCellsCount]="columns.length"
-                [logicalSlaveCellsCount]="columns.length - lockedColumnsCount"
+                [logicalSlaveCellsCount]="unlockedColumnsCount"
                 [totalColumns]="totalColumns"
             >
             <td
@@ -109,12 +114,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     template: `
     <ng-container>
         <tr
-            [class.k-footer-template]="true"
+            class="k-footer-template"
             kendoGridLogicalRow
                 [logicalRowIndex]="logicalRowIndex"
                 [logicalSlaveRow]="lockedColumnsCount > 0"
                 [logicalCellsCount]="columns.length"
-                [logicalSlaveCellsCount]="columns.length - lockedColumnsCount"
+                [logicalSlaveCellsCount]="unlockedColumnsCount"
                 [totalColumns]="totalColumns"
             >
             <td
@@ -168,6 +173,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 type: Input
             }], totalColumns: [{
                 type: Input
+            }], totalColumnsCount: [{
+                type: Input
             }], footerClass: [{
                 type: HostBinding,
                 args: ['class.k-grid-footer']

package/esm2022/rendering/table-body.component.mjs

@@ -148,7 +148,7 @@ export class TableBodyComponent {
             }
         });
         const contentColumnsCount = this.totalColumnsCount - this.lockedColumnsCount - allColumnsCount;
-        const headerFooterColumnsCount = this.totalColumnsCount - this.lockedColumnsCount - (this.allColumns || this.columns).length;
+        const headerFooterColumnsCount = this.totalColumnsCount - this.lockedColumnsCount - allColumns.length;
         return item && this.isDataItem(item) ? contentColumnsCount : headerFooterColumnsCount;
     }
     shouldSkipCell(rowIndex, colIndex) {

package/esm2022/selection/cell-selection.service.mjs

@@ -3,7 +3,7 @@
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { Injectable, EventEmitter } from '@angular/core';
-import { iterator } from '../utils';
+import { iterator, isMultipleRangesEnabled } from '../utils';
 import { isPresent } from '../utils';
 import { DomEventsService } from '../common/dom-events.service';
 import { LocalDataChangesService } from '../editing/local-data-changes.service';
@@ -116,7 +116,12 @@ export class CellSelectionService {
                 const startColIndex = Math.min(this.lastSelectionItemColIndex, item.column.leafIndex);
                 const endRowIndex = Math.max(this.lastSelectionItemRowIndex, item.index);
                 const endColIndex = Math.max(this.lastSelectionItemColIndex, item.column.leafIndex);
-                ev = this.selectRange(startRowIndex, startColIndex, endRowIndex, endColIndex);
+                const preserveCurrentSelection = isMultipleRangesEnabled(this.settings);
+                ev = this.selectRange(startRowIndex, startColIndex, endRowIndex, endColIndex, preserveCurrentSelection);
+                if (preserveCurrentSelection) {
+                    this.lastSelectionItemRowIndex = item.index;
+                    this.lastSelectionItemColIndex = item.column.leafIndex;
+                }
             }
         }
         if (!isPresent(ev)) {
@@ -207,7 +212,7 @@ export class CellSelectionService {
             }
         }
     }
-    selectRange(startRowIndex, startColIndex, endRowIndex, endColIndex) {
+    selectRange(startRowIndex, startColIndex, endRowIndex, endColIndex, preserveSelection = false, existingSelections = []) {
         const selectedCells = [];
         const deselectedCells = [];
         const selectionStartRow = Math.min(startRowIndex, endRowIndex);
@@ -231,7 +236,10 @@ export class CellSelectionService {
                     const isInColRange = selectionStartCol <= col.leafIndex && col.leafIndex <= selectionEndCol;
                     const isInSelectionRect = isInRowRange && isInColRange;
                     if (!isInSelectionRect && selected) {
-                        deselectedCells.push(item);
+                        const deselectCell = !(preserveSelection || existingSelections.find((value) => value && value.itemKey === item.itemKey && value.columnKey === item.columnKey));
+                        if (deselectCell) {
+                            deselectedCells.push(item);
+                        }
                     }
                     if (isInSelectionRect && !selected && !this.nonSelectableRows.has(idx)) {
                         selectedCells.push(item);

package/esm2022/selection/marquee.directive.mjs

@@ -9,6 +9,7 @@ import { SelectionService } from './selection.service';
 import { CellSelectionService } from './cell-selection.service';
 import { take, delay } from 'rxjs/operators';
 import { merge } from 'rxjs';
+import { isMultipleRangesEnabled } from '../utils';
 import * as i0 from "@angular/core";
 import * as i1 from "@progress/kendo-angular-common";
 import * as i2 from "./selection.service";
@@ -115,13 +116,17 @@ export class GridMarqueeDirective {
     }
     endSelection(args) {
         if (args.type === 'mouseup' || args.type === 'touchend') {
+            const modifier = args.originalEvent.ctrlKey || args.originalEvent.metaKey;
+            const preserveCurrentSelection = modifier &&
+                (isMultipleRangesEnabled(this.selection.settings) ||
+                    isMultipleRangesEnabled(this.cellSelection.settings));
             if (this.cellSelection.active) {
                 this.cellSelection.dragging = true;
-                this.cellSelection.changes.emit(this.cellSelection.selectRange(this.pressTarget.rowIndex, this.pressTarget.column.leafIndex, args.rowIndex, args.column.leafIndex));
+                this.cellSelection.changes.emit(this.cellSelection.selectRange(this.pressTarget.rowIndex, this.pressTarget.column.leafIndex, args.rowIndex, args.column.leafIndex, preserveCurrentSelection));
             }
             else if (this.selection.active) {
                 this.selection.dragging = true;
-                this.selection.changes.emit(this.selection.selectRange(this.pressTarget.rowIndex, args.rowIndex));
+                this.selection.changes.emit(this.selection.selectRange(this.pressTarget.rowIndex, args.rowIndex, preserveCurrentSelection));
             }
         }
         this.clean();

package/esm2022/selection/selection.service.mjs

@@ -4,7 +4,7 @@
 *-------------------------------------------------------------------------------------------*/
 import { Injectable, EventEmitter } from '@angular/core';
 import { iterator } from '../utils';
-import { isPresent } from '../utils';
+import { isPresent, isMultipleRangesEnabled } from '../utils';
 import { DomEventsService } from '../common/dom-events.service';
 import { LocalDataChangesService } from '../editing/local-data-changes.service';
 import { NavigationService } from '../navigation/navigation.service';
@@ -121,7 +121,8 @@ export class SelectionService {
                 ev = this.toggle(item);
             }
             else if (event.shiftKey) {
-                ev = this.addAllTo(item, ctrlKey);
+                const preserveCurrentSelection = isMultipleRangesEnabled(this.settings);
+                ev = this.addAllTo(item, ctrlKey, preserveCurrentSelection);
             }
         }
         if (!isPresent(ev)) {
@@ -228,7 +229,7 @@ export class SelectionService {
             item = iterator.next();
         }
     }
-    addAllTo(item, ctrlKey) {
+    addAllTo(item, ctrlKey, preserveSelection = false) {
         const selectedRows = [];
         const deselectedRows = [];
         const start = Math.min(this.lastSelectionStartIndex, item.index);
@@ -239,7 +240,7 @@ export class SelectionService {
             if (next.value && next.value.type === "data") {
                 const idx = next.value.index;
                 const rowArgs = { dataItem: next.value.data, index: idx };
-                if ((idx < start || idx > end) && this.isSelected(idx) && !ctrlKey) {
+                if ((idx < start || idx > end) && this.isSelected(idx) && !ctrlKey && !preserveSelection) {
                     deselectedRows.push(rowArgs);
                 }
                 if ((idx >= start && idx <= end) && !this.isSelected(idx) && !this.nonSelectableRows.has(idx)) {
@@ -296,7 +297,7 @@ export class SelectionService {
         }
         this.changes.emit(ev);
     }
-    selectRange(startIndex, endIndex) {
+    selectRange(startIndex, endIndex, preserveSelection, existingSelections = []) {
         const selectedRows = [];
         const deselectedRows = [];
         const start = Math.min(startIndex, endIndex);
@@ -308,7 +309,10 @@ export class SelectionService {
                 const idx = next.value.index;
                 const rowArgs = { dataItem: next.value.data, index: idx };
                 if ((idx < start || idx > end) && this.isSelected(idx)) {
-                    deselectedRows.push(rowArgs);
+                    const deselectRow = !(preserveSelection || existingSelections.find((value) => value && value.dataItem === rowArgs.dataItem && value.index === rowArgs.index));
+                    if (deselectRow) {
+                        deselectedRows.push(rowArgs);
+                    }
                 }
                 if ((idx >= start && idx <= end) && !this.isSelected(idx) && !this.nonSelectableRows.has(idx)) {
                     selectedRows.push(rowArgs);

package/esm2022/utils.mjs

@@ -128,7 +128,7 @@ export const nodesToArray = (nodes) => [].slice.call(nodes);
 /**
  * @hidden
  */
-export const replaceMessagePlaceholder = (message, name, value) => message.replace(new RegExp(`\{\\s*${name}\\s*\}`, 'g'), value);
+export const replaceMessagePlaceholder = (message, name, value) => (message ?? '').replace(new RegExp(`{\\s*${name}\\s*}`, 'g'), value);
 /**
  * @hidden
  */
@@ -190,3 +190,12 @@ const findRowSpan = (data, index, field) => {
     }
     return rowspan;
 };
+/**
+ * @hidden
+ * Determines whether selection of multiple ranges is enabled in the selectable settings.
+ */
+export const isMultipleRangesEnabled = (selectableSettings) => {
+    return selectableSettings &&
+        typeof selectableSettings === 'object' &&
+        selectableSettings.selectable.multipleRanges;
+};