@progress/kendo-angular-grid 16.11.0-develop.1 → 16.11.0-develop.3

package/columns/checkbox-column.component.d.ts

@@ -6,6 +6,8 @@ import { TemplateRef } from '@angular/core';
 import { ColumnBase } from './column-base';
 import { CellTemplateDirective } from '../rendering/cell-template.directive';
 import { IdService } from '../common/id.service';
+import { SelectionService } from '../selection/selection.service';
+import { CellSelectionService } from '../selection/cell-selection.service';
 import * as i0 from "@angular/core";
 /**
  * Represents the checkbox column for selecting rows in the Grid. [See example](slug:grid_row_selection#toc-select-all-checkbox).
@@ -19,15 +21,25 @@ import * as i0 from "@angular/core";
  * ```
  */
 export declare class CheckboxColumnComponent extends ColumnBase {
+    private selectionService;
+    private cellSelectionService;
     parent?: ColumnBase;
     /**
      * Determines whether a select-all `kendoGridSelectAllCheckbox` checkbox will be displayed in the header.
      */
     showSelectAll: boolean;
+    /**
+     * Determines whether checkboxes will be rendered for rows which are marked as non-selectable. By default, such checkboxes are visible and disabled.
+     */
+    showDisabledCheckbox: boolean;
     readonly isCheckboxColumn: boolean;
     template: CellTemplateDirective;
-    constructor(parent?: ColumnBase, idService?: IdService);
+    constructor(selectionService: SelectionService, cellSelectionService: CellSelectionService, parent?: ColumnBase, idService?: IdService);
     get templateRef(): TemplateRef<any>;
-    static ɵfac: i0.ɵɵFactoryDeclaration<CheckboxColumnComponent, [{ optional: true; host: true; skipSelf: true; }, { optional: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<CheckboxColumnComponent, "kendo-grid-checkbox-column", never, { "showSelectAll": "showSelectAll"; }, {}, ["template"], never, true, never>;
+    /**
+     * @hidden
+     */
+    rowSelectable(rowIdx: number): boolean;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CheckboxColumnComponent, [null, null, { optional: true; host: true; skipSelf: true; }, { optional: true; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CheckboxColumnComponent, "kendo-grid-checkbox-column", never, { "showSelectAll": "showSelectAll"; "showDisabledCheckbox": "showDisabledCheckbox"; }, {}, ["template"], never, true, never>;
 }

package/esm2020/columns/checkbox-column.component.mjs

@@ -6,9 +6,13 @@ import { Component, forwardRef, ContentChild, SkipSelf, Host, Optional, Input }
 import { ColumnBase } from './column-base';
 import { CellTemplateDirective } from '../rendering/cell-template.directive';
 import { IdService } from '../common/id.service';
+import { SelectionService } from '../selection/selection.service';
+import { CellSelectionService } from '../selection/cell-selection.service';
 import * as i0 from "@angular/core";
-import * as i1 from "./column-base";
-import * as i2 from "../common/id.service";
+import * as i1 from "../selection/selection.service";
+import * as i2 from "../selection/cell-selection.service";
+import * as i3 from "./column-base";
+import * as i4 from "../common/id.service";
 /**
  * Represents the checkbox column for selecting rows in the Grid. [See example](slug:grid_row_selection#toc-select-all-checkbox).
  *
@@ -21,9 +25,15 @@ import * as i2 from "../common/id.service";
  * ```
  */
 export class CheckboxColumnComponent extends ColumnBase {
-    constructor(parent, idService) {
+    constructor(selectionService, cellSelectionService, parent, idService) {
         super(parent, idService);
+        this.selectionService = selectionService;
+        this.cellSelectionService = cellSelectionService;
         this.parent = parent;
+        /**
+         * Determines whether checkboxes will be rendered for rows which are marked as non-selectable. By default, such checkboxes are visible and disabled.
+         */
+        this.showDisabledCheckbox = true;
         /*
          * @hidden
          */
@@ -32,9 +42,15 @@ export class CheckboxColumnComponent extends ColumnBase {
     get templateRef() {
         return this.template ? this.template.templateRef : undefined;
     }
+    /**
+     * @hidden
+     */
+    rowSelectable(rowIdx) {
+        return !this.selectionService.nonSelectableRows.has(rowIdx) && !this.cellSelectionService.nonSelectableRows.has(rowIdx);
+    }
 }
-CheckboxColumnComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CheckboxColumnComponent, deps: [{ token: i1.ColumnBase, host: true, optional: true, skipSelf: true }, { token: i2.IdService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-CheckboxColumnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CheckboxColumnComponent, isStandalone: true, selector: "kendo-grid-checkbox-column", inputs: { showSelectAll: "showSelectAll" }, providers: [
+CheckboxColumnComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CheckboxColumnComponent, deps: [{ token: i1.SelectionService }, { token: i2.CellSelectionService }, { token: i3.ColumnBase, host: true, optional: true, skipSelf: true }, { token: i4.IdService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
+CheckboxColumnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CheckboxColumnComponent, isStandalone: true, selector: "kendo-grid-checkbox-column", inputs: { showSelectAll: "showSelectAll", showDisabledCheckbox: "showDisabledCheckbox" }, providers: [
         {
             provide: ColumnBase,
             useExisting: forwardRef(() => CheckboxColumnComponent)
@@ -53,16 +69,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                     template: ``,
                     standalone: true
                 }]
-        }], ctorParameters: function () { return [{ type: i1.ColumnBase, decorators: [{
+        }], ctorParameters: function () { return [{ type: i1.SelectionService }, { type: i2.CellSelectionService }, { type: i3.ColumnBase, decorators: [{
                     type: SkipSelf
                 }, {
                     type: Host
                 }, {
                     type: Optional
-                }] }, { type: i2.IdService, decorators: [{
+                }] }, { type: i4.IdService, decorators: [{
                     type: Optional
                 }] }]; }, propDecorators: { showSelectAll: [{
                 type: Input
+            }], showDisabledCheckbox: [{
+                type: Input
             }], template: [{
                 type: ContentChild,
                 args: [CellTemplateDirective, { static: false }]

package/esm2020/databinding.directive.mjs

@@ -167,6 +167,7 @@ export class DataBindingDirective {
     }
     updateGridData() {
         this.grid.data = this.process(this.state);
+        this.grid.updateNavigationMetadata();
         this.dataChanged = false;
     }
 }

package/esm2020/grid.component.mjs

@@ -404,11 +404,16 @@ export class GridComponent {
         this._data = [];
         this.cachedWindowWidth = 0;
         this._rowSelected = null;
+        this._isRowSelectable = null;
         this._cellSelected = null;
         this._rowReorderable = false;
         this._navigable = [];
         this._size = 'medium';
         this._loading = false;
+        /**
+         * @hidden
+         */
+        this.blockArrowSelection = false;
         this.rtl = false;
         this._rowClass = () => null;
         const isValid = validatePackage(packageMetadata);
@@ -455,6 +460,9 @@ export class GridComponent {
      */
     set data(value) {
         this._data = value;
+        if (this.selectable && this.selectableSettings?.enabled && this.isVirtual) {
+            this.blockArrowSelection = false;
+        }
         if (this.notifyTimeout) {
             clearTimeout(this.notifyTimeout);
             this.notifyTimeout = null;
@@ -680,6 +688,19 @@ export class GridComponent {
     get rowSelected() {
         return this._rowSelected;
     }
+    /**
+     * Defines a Boolean function that is executed for each data row in the component.
+     * Determines whether the row will be selectable.
+     */
+    set isRowSelectable(fn) {
+        if (isDevMode() && typeof fn !== 'function') {
+            throw new Error(GridConfigurationErrorMessages.functionType('isRowSelectable', fn));
+        }
+        this._isRowSelectable = fn;
+    }
+    get isRowSelectable() {
+        return this._isRowSelectable;
+    }
     /**
      * Defines a function that determines the selected state of a data cell.
      * Returns an object with `selected` and `item` properties.
@@ -1482,6 +1503,12 @@ export class GridComponent {
     get flatData() {
         return isArray(this.data) ? this.data : this.data.data;
     }
+    /**
+     * @hidden
+     */
+    updateNavigationMetadata() {
+        this.navigationService.metadata = this.navigationMetadata();
+    }
     /**
      * @hidden
      */
@@ -1597,6 +1624,7 @@ export class GridComponent {
         activeService.init({
             cellSelected: cellSelectionMode ? this.cellSelected : undefined,
             rowSelected: cellSelectionMode ? undefined : this.rowSelected,
+            isRowSelectable: this.isRowSelectable,
             selectable: this.selectable,
             view: this.view,
             columns: cellSelectionMode ? this.columnList.toArray() : undefined
@@ -1713,6 +1741,9 @@ export class GridComponent {
                 .subscribe(x => {
                 this.closeCell();
                 this.cancelCell();
+                if (this.selectable && this.selectableSettings?.enabled && this.isVirtual) {
+                    this.blockArrowSelection = true;
+                }
                 this.dataStateChange.emit(x);
             });
     }
@@ -1898,9 +1929,6 @@ export class GridComponent {
         const headerRows = this.totalColumnLevels + 1 + filterRowOffset + addRowOffset;
         return new NavigationMetadata(dataRows, headerRows, isVirtual, this.hasPager, isPresent(this.detailTemplate), this.wrapper, this.virtualColumns, this.columnsContainer);
     }
-    updateNavigationMetadata() {
-        this.navigationService.metadata = this.navigationMetadata();
-    }
     applyAutoSize() {
         const cols = this.columns.filter((c) => this.autoSize ? c.autoSize !== false : c.autoSize);
         if (cols.length > 0) {
@@ -2004,7 +2032,7 @@ export class GridComponent {
     }
 }
 GridComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: GridComponent, deps: [{ token: i1.BrowserSupportService }, { token: i2.SelectionService }, { token: i3.CellSelectionService }, { token: i0.ElementRef }, { token: i4.GroupInfoService }, { token: i5.GroupsService }, { token: i6.ChangeNotificationService }, { token: i7.DetailsService }, { token: i8.EditService }, { token: i9.FilterService }, { token: i10.PDFService }, { token: i11.ResponsiveService }, { token: i0.Renderer2 }, { token: i12.ExcelService }, { token: i0.NgZone }, { token: i13.ScrollSyncService }, { token: i14.DomEventsService }, { token: i15.ColumnResizingService }, { token: i0.ChangeDetectorRef }, { token: i16.ColumnReorderService }, { token: i17.ColumnInfoService }, { token: i18.NavigationService }, { token: i19.SortService }, { token: i20.ScrollRequestService }, { token: i21.LocalizationService }, { token: i22.ContextService }, { token: i23.SizingOptionsService }, { token: i24.RowReorderService }], target: i0.ɵɵFactoryTarget.Component });
-GridComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: GridComponent, isStandalone: true, selector: "kendo-grid", inputs: { data: "data", pageSize: "pageSize", height: "height", rowHeight: "rowHeight", detailRowHeight: "detailRowHeight", skip: "skip", scrollable: "scrollable", selectable: "selectable", sort: "sort", size: "size", trackBy: "trackBy", filter: "filter", group: "group", virtualColumns: "virtualColumns", filterable: "filterable", sortable: "sortable", pageable: "pageable", groupable: "groupable", rowReorderable: "rowReorderable", navigable: "navigable", navigatable: "navigatable", autoSize: "autoSize", rowClass: "rowClass", rowSticky: "rowSticky", rowSelected: "rowSelected", cellSelected: "cellSelected", resizable: "resizable", reorderable: "reorderable", loading: "loading", columnMenu: "columnMenu", hideHeader: "hideHeader", isDetailExpanded: "isDetailExpanded", isGroupExpanded: "isGroupExpanded" }, outputs: { filterChange: "filterChange", pageChange: "pageChange", groupChange: "groupChange", sortChange: "sortChange", selectionChange: "selectionChange", rowReorder: "rowReorder", dataStateChange: "dataStateChange", groupExpand: "groupExpand", groupCollapse: "groupCollapse", detailExpand: "detailExpand", detailCollapse: "detailCollapse", edit: "edit", cancel: "cancel", save: "save", remove: "remove", add: "add", cellClose: "cellClose", cellClick: "cellClick", pdfExport: "pdfExport", excelExport: "excelExport", columnResize: "columnResize", columnReorder: "columnReorder", columnVisibilityChange: "columnVisibilityChange", columnLockedChange: "columnLockedChange", columnStickyChange: "columnStickyChange", scrollBottom: "scrollBottom", contentScroll: "contentScroll" }, host: { properties: { "attr.dir": "this.dir", "class.k-grid": "this.hostClass", "class.k-grid-sm": "this.sizeSmallClass", "class.k-grid-md": "this.sizeMediumClass", "class.k-grid-lockedcolumns": "this.lockedClasses", "class.k-grid-virtual": "this.virtualClasses", "class.k-grid-no-scrollbar": "this.noScrollbarClass" } }, providers: [
+GridComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: GridComponent, isStandalone: true, selector: "kendo-grid", inputs: { data: "data", pageSize: "pageSize", height: "height", rowHeight: "rowHeight", detailRowHeight: "detailRowHeight", skip: "skip", scrollable: "scrollable", selectable: "selectable", sort: "sort", size: "size", trackBy: "trackBy", filter: "filter", group: "group", virtualColumns: "virtualColumns", filterable: "filterable", sortable: "sortable", pageable: "pageable", groupable: "groupable", rowReorderable: "rowReorderable", navigable: "navigable", navigatable: "navigatable", autoSize: "autoSize", rowClass: "rowClass", rowSticky: "rowSticky", rowSelected: "rowSelected", isRowSelectable: "isRowSelectable", cellSelected: "cellSelected", resizable: "resizable", reorderable: "reorderable", loading: "loading", columnMenu: "columnMenu", hideHeader: "hideHeader", isDetailExpanded: "isDetailExpanded", isGroupExpanded: "isGroupExpanded" }, outputs: { filterChange: "filterChange", pageChange: "pageChange", groupChange: "groupChange", sortChange: "sortChange", selectionChange: "selectionChange", rowReorder: "rowReorder", dataStateChange: "dataStateChange", groupExpand: "groupExpand", groupCollapse: "groupCollapse", detailExpand: "detailExpand", detailCollapse: "detailCollapse", edit: "edit", cancel: "cancel", save: "save", remove: "remove", add: "add", cellClose: "cellClose", cellClick: "cellClick", pdfExport: "pdfExport", excelExport: "excelExport", columnResize: "columnResize", columnReorder: "columnReorder", columnVisibilityChange: "columnVisibilityChange", columnLockedChange: "columnLockedChange", columnStickyChange: "columnStickyChange", scrollBottom: "scrollBottom", contentScroll: "contentScroll" }, host: { properties: { "attr.dir": "this.dir", "class.k-grid": "this.hostClass", "class.k-grid-sm": "this.sizeSmallClass", "class.k-grid-md": "this.sizeMediumClass", "class.k-grid-lockedcolumns": "this.lockedClasses", "class.k-grid-virtual": "this.virtualClasses", "class.k-grid-no-scrollbar": "this.noScrollbarClass" } }, providers: [
         BrowserSupportService,
         LocalizationService,
         ColumnInfoService,
@@ -3330,6 +3358,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                 type: Input
             }], rowSelected: [{
                 type: Input
+            }], isRowSelectable: [{
+                type: Input
             }], cellSelected: [{
                 type: Input
             }], resizable: [{

package/esm2020/navigation/navigation-cursor.mjs

@@ -148,6 +148,10 @@ export class NavigationCursor {
         if (cell.colSpan > 1 && cell.colIndex <= virtualCol && virtualCol < cell.colIndex + cell.colSpan) {
             nextColIndex = offset > 0 ? Math.min(cell.colIndex + cell.colSpan, lastIndex) : Math.max(0, cell.colIndex + offset);
             const nextCell = this.model.findCell(nextColIndex, prevRow);
+            if (!nextCell) {
+                this.virtualCol = nextColIndex;
+                return this.activate(cell.rowIndex, nextColIndex);
+            }
             if (cell !== nextCell) {
                 cell = nextCell;
                 this.virtualCol = cell.colIndex;
@@ -155,7 +159,9 @@ export class NavigationCursor {
             else {
                 this.virtualCol = virtualCol;
             }
+            return this.activate(cell.rowIndex, this.virtualCol);
         }
+        this.virtualCol = cell.colIndex;
         return this.activate(cell.rowIndex, cell.colIndex);
     }
     offsetRow(offset) {
@@ -182,6 +188,9 @@ export class NavigationCursor {
                 }
                 if (cell.rowIndex <= this.virtualRow && offset > 0 && cell.rowSpan > 1) {
                     cell = this.model.findCell(this.virtualCol, this.model.findRow(cell.rowIndex + cell.rowSpan - 1 + offset));
+                    if (!cell) {
+                        return;
+                    }
                 }
                 nextIndex = cell.rowIndex;
                 nextColIndex = cell.colIndex;

package/esm2020/navigation/navigation.service.mjs

@@ -11,7 +11,7 @@ import { GridFocusableElement } from './grid-focusable-element';
 import { NavigationCursor } from './navigation-cursor';
 import { NavigationModel } from './navigation-model';
 import { DomEventsService } from '../common/dom-events.service';
-import { isDocumentAvailable, Keys } from '@progress/kendo-angular-common';
+import { isDocumentAvailable, isPresent, Keys } from '@progress/kendo-angular-common';
 import { EditService } from '../editing/edit.service';
 import { GroupsService } from '../grouping/groups.service';
 import { PagerContextService } from '../pager/pager-context.service';
@@ -135,7 +135,7 @@ export class NavigationService {
     get activeRow() {
         if (this.mode !== 0 /* NavigationMode.Standby */) {
             return Object.assign({}, this.cursor.row, {
-                cells: this.cursor.row.cells.toArray()
+                cells: this.cursor.row?.cells.toArray()
             });
         }
     }
@@ -407,16 +407,56 @@ export class NavigationService {
         const row = this.cursor.row;
         switch (args.keyCode) {
             case Keys.ArrowDown:
-                preventDefault = this.cursor.moveDown(step);
+                if (args.shiftKey) {
+                    if (this.ctx.grid.blockArrowSelection) {
+                        return;
+                    }
+                    preventDefault = this.cursor.moveDown(step);
+                    if (this.activeRow?.dataItem) {
+                        this.handleVerticalArrowSelection(step);
+                    }
+                }
+                else {
+                    preventDefault = this.cursor.moveDown(step);
+                }
                 break;
             case Keys.ArrowUp:
-                preventDefault = this.cursor.moveUp(step);
+                if (args.shiftKey) {
+                    if (this.ctx.grid.blockArrowSelection) {
+                        return;
+                    }
+                    preventDefault = this.cursor.moveUp(step);
+                    if (this.activeRow?.dataItem) {
+                        this.handleVerticalArrowSelection(-step);
+                    }
+                }
+                else {
+                    preventDefault = this.cursor.moveUp(step);
+                }
                 break;
             case Keys.ArrowRight:
-                preventDefault = this.moveCursorFwd();
+                if (args.shiftKey) {
+                    if (this.ctx.grid.blockArrowSelection) {
+                        return;
+                    }
+                    preventDefault = this.moveCursorFwd();
+                    this.handleHorizontalArrowSelection(args);
+                }
+                else {
+                    preventDefault = this.moveCursorFwd();
+                }
                 break;
             case Keys.ArrowLeft:
-                preventDefault = this.moveCursorBwd();
+                if (args.shiftKey) {
+                    if (this.ctx.grid.blockArrowSelection) {
+                        return;
+                    }
+                    preventDefault = this.moveCursorBwd();
+                    this.handleHorizontalArrowSelection(args);
+                }
+                else {
+                    preventDefault = this.moveCursorBwd();
+                }
                 break;
             case Keys.PageDown:
                 if (this.metadata.isVirtual && this.viewport) {
@@ -607,6 +647,58 @@ export class NavigationService {
         this.leaveCell();
         this.cursor.reset();
     }
+    handleVerticalArrowSelection(args) {
+        const cellSelectionEnabled = this.ctx.grid.cellSelectionService.active;
+        const rowSelectionEnabled = this.ctx.grid.selectionService.active && !this.ctx.grid.selectableSettings.checkboxOnly;
+        if (cellSelectionEnabled || rowSelectionEnabled) {
+            const selectionService = this.ctx.grid[cellSelectionEnabled ? 'cellSelectionService' : 'selectionService'];
+            const colIdx = this.cursor.cell ? this.cursor.cell.colIndex : 0;
+            const rowIdx = this.activeRow.dataRowIndex - this.ctx.grid.skip;
+            const dataItem = selectionService.settings.view.at(rowIdx);
+            const item = { index: this.activeRow.dataRowIndex, data: dataItem, column: this.ctx.grid.columnsContainer.leafColumnsToRender[colIdx] };
+            if (selectionService.options.mode === 'multiple') {
+                cellSelectionEnabled ? this.handleMultipleArrowCellSelection(item) : this.handleMultipleArrowRowSelection(item);
+            }
+            else {
+                selectionService.handleClick(item, args);
+            }
+        }
+    }
+    handleHorizontalArrowSelection(args) {
+        const cellSelectionEnabled = this.ctx.grid.cellSelectionService.active;
+        if (cellSelectionEnabled) {
+            const selectionService = this.ctx.grid[cellSelectionEnabled ? 'cellSelectionService' : 'selectionService'];
+            const row = this.activeRow;
+            const colIdx = this.cursor.cell ? this.cursor.cell.colIndex : 0;
+            const dataItem = selectionService.settings.view.at(row.dataRowIndex - this.ctx.grid.skip);
+            const item = { index: row.dataRowIndex, data: dataItem, column: this.ctx.grid.columnsContainer.leafColumnsToRender[colIdx] };
+            if (!isPresent(dataItem) || !isPresent(item.column)) {
+                return;
+            }
+            if (selectionService.options.mode === 'multiple') {
+                this.handleMultipleArrowCellSelection(item);
+            }
+            else {
+                selectionService.handleClick(item, args);
+            }
+        }
+    }
+    handleMultipleArrowCellSelection(item) {
+        const cellSelectionService = this.ctx.grid.cellSelectionService;
+        const startRowIndex = Math.min(cellSelectionService.lastSelectionItemRowIndex, item.index);
+        const startColIndex = Math.min(cellSelectionService.lastSelectionItemColIndex, item.column.leafIndex);
+        const endRowIndex = Math.max(cellSelectionService.lastSelectionItemRowIndex, item.index);
+        const endColIndex = Math.max(cellSelectionService.lastSelectionItemColIndex, item.column.leafIndex);
+        const ev = cellSelectionService.selectRange(startRowIndex, startColIndex, endRowIndex, endColIndex);
+        cellSelectionService.changes.emit(ev);
+    }
+    handleMultipleArrowRowSelection(item) {
+        const rowSelectionService = this.ctx.grid.selectionService;
+        const startRowIndex = Math.min(rowSelectionService.lastSelectionStartIndex, item.index);
+        const endRowIndex = Math.max(rowSelectionService.lastSelectionStartIndex, item.index);
+        const ev = rowSelectionService.selectRange(startRowIndex, endRowIndex);
+        rowSelectionService.changes.emit(ev);
+    }
 }
 NavigationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: NavigationService, deps: [{ token: i0.NgZone }, { token: i1.DomEventsService }, { token: i2.PagerContextService }, { token: i3.ScrollRequestService }, { token: i4.GroupsService }, { token: i5.DetailsService }, { token: i6.FocusRoot }, { token: i7.EditService }, { token: i0.ChangeDetectorRef }, { token: i8.ContextService }, { token: i9.FocusableDirective, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
 NavigationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: NavigationService });

package/esm2020/package-metadata.mjs

@@ -9,7 +9,7 @@ export const packageMetadata = {
     name: '@progress/kendo-angular-grid',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1727353679,
-    version: '16.11.0-develop.1',
+    publishDate: 1727428394,
+    version: '16.11.0-develop.3',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };

package/esm2020/rendering/cell.component.mjs

@@ -110,6 +110,9 @@ export class CellComponent {
     get isRowReorderColumn() {
         return isRowReorderColumn(this.column) && !this.column.templateRef;
     }
+    get isRowSelectable() {
+        return this.column.rowSelectable(this._rowIndex);
+    }
     get isColumnEditable() {
         if (!this.column || this.isCommand(this.column)) {
             return false;
@@ -171,13 +174,25 @@ CellComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version:
                     </ng-container>
                     <ng-container *ngIf="isBoundColumn">{{ dataItem | valueOf: column.field: column.format}}</ng-container>
                     <ng-container *ngIf="isCheckboxColumn && !isNew">
-                        <span class="k-checkbox-wrap">
-                            <input
-                                class="k-checkbox k-checkbox-md k-rounded-md"
-                                [kendoGridSelectionCheckbox]="rowIndex"
-                                [attr.id]="selectionCheckboxId"
-                                [attr.aria-label]="selectionCheckboxLabel" />
-                        </span>
+                        <ng-container *ngIf="isRowSelectable; else nonSelectableRow">
+                            <span class="k-checkbox-wrap">
+                                <input
+                                    class="k-checkbox k-checkbox-md k-rounded-md"
+                                    [kendoGridSelectionCheckbox]="rowIndex"
+                                    [attr.id]="selectionCheckboxId"
+                                    [attr.aria-label]="selectionCheckboxLabel" />
+                            </span>
+                        </ng-container>
+                        <ng-template #nonSelectableRow>
+                            <span class="k-checkbox-wrap" *ngIf="column.showDisabledCheckbox">
+                                <input
+                                    class="k-checkbox k-checkbox-md k-rounded-md k-disabled"
+                                    [kendoGridSelectionCheckbox]="rowIndex"
+                                    [attr.id]="selectionCheckboxId"
+                                    [attr.aria-label]="selectionCheckboxLabel"
+                                    [disabled]="true" />
+                            </span>
+                        </ng-template>
                     </ng-container>
                     <ng-container *ngIf="isRowReorderColumn && !isNew">
                         <kendo-icon-wrapper
@@ -256,13 +271,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                     </ng-container>
                     <ng-container *ngIf="isBoundColumn">{{ dataItem | valueOf: column.field: column.format}}</ng-container>
                     <ng-container *ngIf="isCheckboxColumn && !isNew">
-                        <span class="k-checkbox-wrap">
-                            <input
-                                class="k-checkbox k-checkbox-md k-rounded-md"
-                                [kendoGridSelectionCheckbox]="rowIndex"
-                                [attr.id]="selectionCheckboxId"
-                                [attr.aria-label]="selectionCheckboxLabel" />
-                        </span>
+                        <ng-container *ngIf="isRowSelectable; else nonSelectableRow">
+                            <span class="k-checkbox-wrap">
+                                <input
+                                    class="k-checkbox k-checkbox-md k-rounded-md"
+                                    [kendoGridSelectionCheckbox]="rowIndex"
+                                    [attr.id]="selectionCheckboxId"
+                                    [attr.aria-label]="selectionCheckboxLabel" />
+                            </span>
+                        </ng-container>
+                        <ng-template #nonSelectableRow>
+                            <span class="k-checkbox-wrap" *ngIf="column.showDisabledCheckbox">
+                                <input
+                                    class="k-checkbox k-checkbox-md k-rounded-md k-disabled"
+                                    [kendoGridSelectionCheckbox]="rowIndex"
+                                    [attr.id]="selectionCheckboxId"
+                                    [attr.aria-label]="selectionCheckboxLabel"
+                                    [disabled]="true" />
+                            </span>
+                        </ng-template>
                     </ng-container>
                     <ng-container *ngIf="isRowReorderColumn && !isNew">
                         <kendo-icon-wrapper

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

@@ -155,12 +155,17 @@ export class TableBodyComponent {
     isOdd(item) {
         return item.index % 2 !== 0;
     }
-    isSelectable() {
-        return this.selectable && this.selectable.enabled !== false;
+    isSelectable(args) {
+        const rowSelectable = this.isRowSelectable(args);
+        const selectionEnabled = this.selectable && this.selectable.enabled !== false;
+        return selectionEnabled && rowSelectable;
     }
     isRowSelected(item) {
         return this.selectionService.isSelected(item.index);
     }
+    isRowSelectable(args) {
+        return this.selectionService.settings?.isRowSelectable(args) || this.cellSelectionService.settings?.isRowSelectable(args);
+    }
     trackByWrapper(index, item) {
         if (item.type === 'data') {
             item.isEditing = this.editService.hasEdited(item.index);
@@ -318,6 +323,10 @@ export class TableBodyComponent {
             if (!focusable && !matchesNodeName('label')(target) && !hasClasses(target, IGNORE_TARGET_CLASSSES) &&
                 !closestInScope(target, matchesClasses(IGNORE_CONTAINER_CLASSES), cell)) {
                 const args = this.cellClickArgs(cell, row, eventArg);
+                const selectionEnabled = this.selectable && this.selectable.enabled !== false;
+                if (selectionEnabled && !this.isRowSelectable({ index: args.rowIndex, dataItem: args.dataItem })) {
+                    return;
+                }
                 if (eventArg.type === 'mousedown' || eventArg.type === 'touchstart') {
                     this.domEvents.cellMousedown.emit(args);
                 }
@@ -490,9 +499,9 @@ TableBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ver
             [ngClass]="rowClass({ dataItem: item.data, index: $any(item).index })"
             [class.k-master-row]="true"
             [class.k-grid-edit-row]="isEditingRow($any(item).index)"
-            [attr.aria-selected]="lockedColumnsCount < 1 ? isSelectable() && isRowSelected(item) : undefined"
+            [attr.aria-selected]="lockedColumnsCount < 1 ? isSelectable({ dataItem: item.data, index: $any(item).index }) && isRowSelected(item) : undefined"
             [attr.data-kendo-grid-item-index]="$any(item).index"
-            [class.k-selected]="isSelectable() && isRowSelected(item)">
+            [class.k-selected]="isSelectable({ dataItem: item.data, index: $any(item).index }) && isRowSelected(item)">
             <ng-container *ngIf="!skipGroupDecoration">
                 <td class="k-group-cell k-table-td" *ngFor="let g of groups" role="presentation"></td>
             </ng-container>
@@ -535,10 +544,10 @@ TableBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ver
                     [colSpan]="column.colspan"
                     [attr.role]="column.tableCellsRole"
                     class="k-table-td"
-                    [attr.aria-selected]="lockedColumnsCount < 1 && isSelectable() ? isAriaSelected(item, column) : undefined"
+                    [attr.aria-selected]="lockedColumnsCount < 1 && isSelectable({ dataItem: item.data, index: $any(item).index }) ? isAriaSelected(item, column) : undefined"
                     [class.k-grid-content-sticky]="column.sticky"
-                    [class.k-touch-action-none]="isSelectable() && $any(selectable).drag"
-                    [class.k-touch-action-auto]="!(isSelectable() && $any(selectable).drag)"
+                    [class.k-touch-action-none]="isSelectable({ dataItem: item.data, index: $any(item).index }) && $any(selectable).drag"
+                    [class.k-touch-action-auto]="!(isSelectable({ dataItem: item.data, index: $any(item).index }) && $any(selectable).drag)"
                 [ngClass]="column.cssClass"
                 [class.k-grid-edit-cell]="isEditingCell($any(item).index, column)"
                 [ngStyle]="column.sticky ? addStickyColumnStyles(column) : column.style"
@@ -719,9 +728,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
             [ngClass]="rowClass({ dataItem: item.data, index: $any(item).index })"
             [class.k-master-row]="true"
             [class.k-grid-edit-row]="isEditingRow($any(item).index)"
-            [attr.aria-selected]="lockedColumnsCount < 1 ? isSelectable() && isRowSelected(item) : undefined"
+            [attr.aria-selected]="lockedColumnsCount < 1 ? isSelectable({ dataItem: item.data, index: $any(item).index }) && isRowSelected(item) : undefined"
             [attr.data-kendo-grid-item-index]="$any(item).index"
-            [class.k-selected]="isSelectable() && isRowSelected(item)">
+            [class.k-selected]="isSelectable({ dataItem: item.data, index: $any(item).index }) && isRowSelected(item)">
             <ng-container *ngIf="!skipGroupDecoration">
                 <td class="k-group-cell k-table-td" *ngFor="let g of groups" role="presentation"></td>
             </ng-container>
@@ -764,10 +773,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                     [colSpan]="column.colspan"
                     [attr.role]="column.tableCellsRole"
                     class="k-table-td"
-                    [attr.aria-selected]="lockedColumnsCount < 1 && isSelectable() ? isAriaSelected(item, column) : undefined"
+                    [attr.aria-selected]="lockedColumnsCount < 1 && isSelectable({ dataItem: item.data, index: $any(item).index }) ? isAriaSelected(item, column) : undefined"
                     [class.k-grid-content-sticky]="column.sticky"
-                    [class.k-touch-action-none]="isSelectable() && $any(selectable).drag"
-                    [class.k-touch-action-auto]="!(isSelectable() && $any(selectable).drag)"
+                    [class.k-touch-action-none]="isSelectable({ dataItem: item.data, index: $any(item).index }) && $any(selectable).drag"
+                    [class.k-touch-action-auto]="!(isSelectable({ dataItem: item.data, index: $any(item).index }) && $any(selectable).drag)"
                 [ngClass]="column.cssClass"
                 [class.k-grid-edit-cell]="isEditingCell($any(item).index, column)"
                 [ngStyle]="column.sticky ? addStickyColumnStyles(column) : column.style"