@progress/kendo-angular-grid 20.0.0-develop.5 → 20.0.0-develop.7

package/esm2022/grid.component.mjs

@@ -2178,6 +2178,9 @@ export class GridComponent {
     }
     attachDomEventHandlers() {
         this.cellClickSubscription = this.domEvents.cellClick.subscribe((args) => {
+            if (this.isStacked && !isPresent(args.column)) {
+                return;
+            }
             this.cellClick.emit(Object.assign({ sender: this }, args));
         });
     }

package/esm2022/navigation/focusable.directive.mjs

@@ -25,7 +25,7 @@ import * as i1 from "../common/provider.service";
  * </kendo-grid>
  * ```
  * @remarks
- * Applied to: {@link ButtonComponent}, {@link TextBoxComponent}, {@link DateInputComponent}, {@link DatePickerComponent}, {@link DateTimePicker}, {@link TextAreaComponent}, {@link ColorPickerComponent}, {@link DropDownListComponent}, {@link ComboBoxComponent}, {@link AutoCompleteComponent}.
+ * Applied to: {@link ButtonComponent}, {@link TextBoxComponent}, {@link NumericTextBoxComponent}, {@link DateInputComponent}, {@link DatePickerComponent}, {@link DateTimePicker}, {@link TextAreaComponent}, {@link ColorPickerComponent}, {@link DropDownListComponent}, {@link ComboBoxComponent}, {@link AutoCompleteComponent}.
  */
 export class FocusableDirective {
     cellContext;

package/esm2022/navigation/navigation.service.mjs

@@ -333,7 +333,11 @@ export class NavigationService {
                 this.deactivateElements();
                 this.enterCell();
             }
-            focusable.focus();
+            this.zone.runOutsideAngular(() => {
+                setTimeout(() => {
+                    focusable.focus();
+                });
+            });
         }
         else {
             this.deactivateElements();
@@ -907,7 +911,7 @@ export class NavigationService {
     tableCellEntered = false;
     stackedCellEntered = false;
     handleStackedTabNavigation(args) {
-        if (!isPresent(this.activeCell.focusGroup)) {
+        if (!isPresent(this.activeCell?.focusGroup)) {
             return;
         }
         if (this.stackedFocusedCellIndex === -1) {

package/esm2022/package-metadata.mjs

@@ -10,7 +10,7 @@ export const packageMetadata = {
     productName: 'Kendo UI for Angular',
     productCode: 'KENDOUIANGULAR',
     productCodes: ['KENDOUIANGULAR'],
-    publishDate: 1755869037,
-    version: '20.0.0-develop.5',
+    publishDate: 1756185156,
+    version: '20.0.0-develop.7',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };

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

@@ -321,8 +321,8 @@ export class TableBodyComponent {
             if (!selectionEnabled) {
                 return;
             }
-            const cellComparer = this.isStackedMode ? closest(target, matchesNodeName('td')) : closest(target, (el) => { matchesNodeName('td') && hasClasses(el, 'k-grid-stack-content'); });
-            const isCellFocused = cellComparer?.classList.contains('k-focus');
+            const cellComparer = this.isStackedMode ? closest(target, (el) => hasClasses(el, 'k-grid-stack-cell')) || closest(target, matchesNodeName('td')) : closest(target, matchesNodeName('td'));
+            const isCellFocused = cellComparer?.classList.contains('k-focus') || cellComparer === document.activeElement;
             const isShiftOrCtrlPressed = eventArg.shiftKey || eventArg.ctrlKey || eventArg.metaKey;
             if (isCellFocused && !isShiftOrCtrlPressed) {
                 eventArg.preventDefault();
@@ -367,6 +367,26 @@ export class TableBodyComponent {
                 if (cell) {
                     row = cell.parentElement.parentElement;
                 }
+                else {
+                    cell = closest(currentTarget, (el) => {
+                        if (!matchesNodeName('td')(el)) {
+                            return false;
+                        }
+                        const parentRow = el.parentElement;
+                        if (!parentRow || !matchesNodeName('tr')(parentRow)) {
+                            return false;
+                        }
+                        return parentRow.parentElement === element;
+                    });
+                    if (cell) {
+                        row = cell.parentElement;
+                        body = element;
+                        gridElement = null;
+                    }
+                }
+            }
+            if (!cell) {
+                return;
             }
             this.editService.preventCellClose();
             const focusable = (!isCellTarget && target !== cell) && isFocusableWithTabKey(target, false);
@@ -412,20 +432,27 @@ export class TableBodyComponent {
     }
     cellClickArgs(cell, row, eventArg) {
         const cells = this.isStackedMode ? row.querySelectorAll('.k-grid-stack-cell') : row.cells;
-        const index = columnCellIndex(cell, cells, this.isStackedMode);
+        let index = columnCellIndex(cell, cells, this.isStackedMode);
+        // In stacked mode, clicks on the outer cell should not trigger Grid's cellClick event
+        let isOuterCellClicked = false;
+        if (this.isStackedMode && !isPresent(index)) {
+            const cells = row.cells;
+            index = columnCellIndex(cell, cells, this.isStackedMode);
+            isOuterCellClicked = true;
+        }
         if (!isPresent(index)) {
             return;
         }
         const column = this.columns.toArray()[index];
         const columnIndex = (this.isStackedMode ? 0 : this.lockedColumnsCount) + index;
-        let rowIndex = (this.isStackedMode ? row.parentElement.parentElement : row).getAttribute('data-kendo-grid-item-index');
+        let rowIndex = (this.isStackedMode && !isOuterCellClicked ? row.parentElement.parentElement : row).getAttribute('data-kendo-grid-item-index');
         rowIndex = rowIndex ? parseInt(rowIndex, 10) : -1;
         const dataItem = rowIndex === -1 ? this.editService.newDataItem : this.rowsToRender.find(item => +item.index === rowIndex && item.type === 'data')?.data;
         const isEditedColumn = this.editService.isEditedColumn(rowIndex, column);
         const isEditedRow = this.editService.isEdited(rowIndex);
         const type = eventArg.type === 'keydown' ? 'click' : eventArg.type;
         return {
-            column: column,
+            column: isOuterCellClicked ? null : column,
             columnIndex: columnIndex,
             dataItem: dataItem,
             isEditedColumn: isEditedColumn,

package/fesm2022/progress-kendo-angular-grid.mjs

@@ -901,7 +901,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
  * </kendo-grid>
  * ```
  * @remarks
- * Applied to: {@link ButtonComponent}, {@link TextBoxComponent}, {@link DateInputComponent}, {@link DatePickerComponent}, {@link DateTimePicker}, {@link TextAreaComponent}, {@link ColorPickerComponent}, {@link DropDownListComponent}, {@link ComboBoxComponent}, {@link AutoCompleteComponent}.
+ * Applied to: {@link ButtonComponent}, {@link TextBoxComponent}, {@link NumericTextBoxComponent}, {@link DateInputComponent}, {@link DatePickerComponent}, {@link DateTimePicker}, {@link TextAreaComponent}, {@link ColorPickerComponent}, {@link DropDownListComponent}, {@link ComboBoxComponent}, {@link AutoCompleteComponent}.
  */
 class FocusableDirective {
     cellContext;
@@ -3677,7 +3677,11 @@ class NavigationService {
                 this.deactivateElements();
                 this.enterCell();
             }
-            focusable.focus();
+            this.zone.runOutsideAngular(() => {
+                setTimeout(() => {
+                    focusable.focus();
+                });
+            });
         }
         else {
             this.deactivateElements();
@@ -4251,7 +4255,7 @@ class NavigationService {
     tableCellEntered = false;
     stackedCellEntered = false;
     handleStackedTabNavigation(args) {
-        if (!isPresent$1(this.activeCell.focusGroup)) {
+        if (!isPresent$1(this.activeCell?.focusGroup)) {
             return;
         }
         if (this.stackedFocusedCellIndex === -1) {
@@ -20483,8 +20487,8 @@ class TableBodyComponent {
             if (!selectionEnabled) {
                 return;
             }
-            const cellComparer = this.isStackedMode ? closest(target, matchesNodeName('td')) : closest(target, (el) => { matchesNodeName('td') && hasClasses(el, 'k-grid-stack-content'); });
-            const isCellFocused = cellComparer?.classList.contains('k-focus');
+            const cellComparer = this.isStackedMode ? closest(target, (el) => hasClasses(el, 'k-grid-stack-cell')) || closest(target, matchesNodeName('td')) : closest(target, matchesNodeName('td'));
+            const isCellFocused = cellComparer?.classList.contains('k-focus') || cellComparer === document.activeElement;
             const isShiftOrCtrlPressed = eventArg.shiftKey || eventArg.ctrlKey || eventArg.metaKey;
             if (isCellFocused && !isShiftOrCtrlPressed) {
                 eventArg.preventDefault();
@@ -20529,6 +20533,26 @@ class TableBodyComponent {
                 if (cell) {
                     row = cell.parentElement.parentElement;
                 }
+                else {
+                    cell = closest(currentTarget, (el) => {
+                        if (!matchesNodeName('td')(el)) {
+                            return false;
+                        }
+                        const parentRow = el.parentElement;
+                        if (!parentRow || !matchesNodeName('tr')(parentRow)) {
+                            return false;
+                        }
+                        return parentRow.parentElement === element;
+                    });
+                    if (cell) {
+                        row = cell.parentElement;
+                        body = element;
+                        gridElement = null;
+                    }
+                }
+            }
+            if (!cell) {
+                return;
             }
             this.editService.preventCellClose();
             const focusable = (!isCellTarget && target !== cell) && isFocusableWithTabKey(target, false);
@@ -20574,20 +20598,27 @@ class TableBodyComponent {
     }
     cellClickArgs(cell, row, eventArg) {
         const cells = this.isStackedMode ? row.querySelectorAll('.k-grid-stack-cell') : row.cells;
-        const index = columnCellIndex(cell, cells, this.isStackedMode);
+        let index = columnCellIndex(cell, cells, this.isStackedMode);
+        // In stacked mode, clicks on the outer cell should not trigger Grid's cellClick event
+        let isOuterCellClicked = false;
+        if (this.isStackedMode && !isPresent(index)) {
+            const cells = row.cells;
+            index = columnCellIndex(cell, cells, this.isStackedMode);
+            isOuterCellClicked = true;
+        }
         if (!isPresent(index)) {
             return;
         }
         const column = this.columns.toArray()[index];
         const columnIndex = (this.isStackedMode ? 0 : this.lockedColumnsCount) + index;
-        let rowIndex = (this.isStackedMode ? row.parentElement.parentElement : row).getAttribute('data-kendo-grid-item-index');
+        let rowIndex = (this.isStackedMode && !isOuterCellClicked ? row.parentElement.parentElement : row).getAttribute('data-kendo-grid-item-index');
         rowIndex = rowIndex ? parseInt(rowIndex, 10) : -1;
         const dataItem = rowIndex === -1 ? this.editService.newDataItem : this.rowsToRender.find(item => +item.index === rowIndex && item.type === 'data')?.data;
         const isEditedColumn = this.editService.isEditedColumn(rowIndex, column);
         const isEditedRow = this.editService.isEdited(rowIndex);
         const type = eventArg.type === 'keydown' ? 'click' : eventArg.type;
         return {
-            column: column,
+            column: isOuterCellClicked ? null : column,
             columnIndex: columnIndex,
             dataItem: dataItem,
             isEditedColumn: isEditedColumn,
@@ -22057,8 +22088,8 @@ const packageMetadata = {
     productName: 'Kendo UI for Angular',
     productCode: 'KENDOUIANGULAR',
     productCodes: ['KENDOUIANGULAR'],
-    publishDate: 1755869037,
-    version: '20.0.0-develop.5',
+    publishDate: 1756185156,
+    version: '20.0.0-develop.7',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };
 
@@ -31557,6 +31588,9 @@ class GridComponent {
     }
     attachDomEventHandlers() {
         this.cellClickSubscription = this.domEvents.cellClick.subscribe((args) => {
+            if (this.isStacked && !isPresent(args.column)) {
+                return;
+            }
             this.cellClick.emit(Object.assign({ sender: this }, args));
         });
     }

package/navigation/focusable.directive.d.ts

@@ -24,7 +24,7 @@ import * as i0 from "@angular/core";
  * </kendo-grid>
  * ```
  * @remarks
- * Applied to: {@link ButtonComponent}, {@link TextBoxComponent}, {@link DateInputComponent}, {@link DatePickerComponent}, {@link DateTimePicker}, {@link TextAreaComponent}, {@link ColorPickerComponent}, {@link DropDownListComponent}, {@link ComboBoxComponent}, {@link AutoCompleteComponent}.
+ * Applied to: {@link ButtonComponent}, {@link TextBoxComponent}, {@link NumericTextBoxComponent}, {@link DateInputComponent}, {@link DatePickerComponent}, {@link DateTimePicker}, {@link TextAreaComponent}, {@link ColorPickerComponent}, {@link DropDownListComponent}, {@link ComboBoxComponent}, {@link AutoCompleteComponent}.
  */
 export declare class FocusableDirective implements FocusableElement, AfterViewInit, OnDestroy {
     private cellContext;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-angular-grid",
-  "version": "20.0.0-develop.5",
+  "version": "20.0.0-develop.7",
   "description": "Kendo UI Grid for Angular - high performance data grid with paging, filtering, virtualization, CRUD, and more.",
   "license": "SEE LICENSE IN LICENSE.md",
   "author": "Progress",
@@ -41,7 +41,7 @@
     "package": {
       "productName": "Kendo UI for Angular",
       "productCode": "KENDOUIANGULAR",
-      "publishDate": 1755869037,
+      "publishDate": 1756185156,
       "licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/"
     }
   },
@@ -54,29 +54,29 @@
     "@progress/kendo-data-query": "^1.0.0",
     "@progress/kendo-drawing": "^1.21.0",
     "@progress/kendo-licensing": "^1.7.0",
-    "@progress/kendo-angular-buttons": "20.0.0-develop.5",
-    "@progress/kendo-angular-common": "20.0.0-develop.5",
-    "@progress/kendo-angular-dateinputs": "20.0.0-develop.5",
-    "@progress/kendo-angular-layout": "20.0.0-develop.5",
-    "@progress/kendo-angular-navigation": "20.0.0-develop.5",
-    "@progress/kendo-angular-dropdowns": "20.0.0-develop.5",
-    "@progress/kendo-angular-excel-export": "20.0.0-develop.5",
-    "@progress/kendo-angular-icons": "20.0.0-develop.5",
-    "@progress/kendo-angular-inputs": "20.0.0-develop.5",
-    "@progress/kendo-angular-conversational-ui": "20.0.0-develop.5",
-    "@progress/kendo-angular-intl": "20.0.0-develop.5",
-    "@progress/kendo-angular-l10n": "20.0.0-develop.5",
-    "@progress/kendo-angular-label": "20.0.0-develop.5",
-    "@progress/kendo-angular-pager": "20.0.0-develop.5",
-    "@progress/kendo-angular-pdf-export": "20.0.0-develop.5",
-    "@progress/kendo-angular-popup": "20.0.0-develop.5",
-    "@progress/kendo-angular-toolbar": "20.0.0-develop.5",
-    "@progress/kendo-angular-utils": "20.0.0-develop.5",
+    "@progress/kendo-angular-buttons": "20.0.0-develop.7",
+    "@progress/kendo-angular-common": "20.0.0-develop.7",
+    "@progress/kendo-angular-dateinputs": "20.0.0-develop.7",
+    "@progress/kendo-angular-layout": "20.0.0-develop.7",
+    "@progress/kendo-angular-navigation": "20.0.0-develop.7",
+    "@progress/kendo-angular-dropdowns": "20.0.0-develop.7",
+    "@progress/kendo-angular-excel-export": "20.0.0-develop.7",
+    "@progress/kendo-angular-icons": "20.0.0-develop.7",
+    "@progress/kendo-angular-inputs": "20.0.0-develop.7",
+    "@progress/kendo-angular-conversational-ui": "20.0.0-develop.7",
+    "@progress/kendo-angular-intl": "20.0.0-develop.7",
+    "@progress/kendo-angular-l10n": "20.0.0-develop.7",
+    "@progress/kendo-angular-label": "20.0.0-develop.7",
+    "@progress/kendo-angular-pager": "20.0.0-develop.7",
+    "@progress/kendo-angular-pdf-export": "20.0.0-develop.7",
+    "@progress/kendo-angular-popup": "20.0.0-develop.7",
+    "@progress/kendo-angular-toolbar": "20.0.0-develop.7",
+    "@progress/kendo-angular-utils": "20.0.0-develop.7",
     "rxjs": "^6.5.3 || ^7.0.0"
   },
   "dependencies": {
     "tslib": "^2.3.1",
-    "@progress/kendo-angular-schematics": "20.0.0-develop.5",
+    "@progress/kendo-angular-schematics": "20.0.0-develop.7",
     "@progress/kendo-common": "^1.0.1",
     "@progress/kendo-file-saver": "^1.0.0"
   },

package/schematics/ngAdd/index.js

@@ -4,14 +4,14 @@ const schematics_1 = require("@angular-devkit/schematics");
 function default_1(options) {
     const finalOptions = Object.assign(Object.assign({}, options), { mainNgModule: 'GridModule', package: 'grid', peerDependencies: {
             // peer deps of the dropdowns
-            '@progress/kendo-angular-treeview': '20.0.0-develop.5',
-            '@progress/kendo-angular-navigation': '20.0.0-develop.5',
+            '@progress/kendo-angular-treeview': '20.0.0-develop.7',
+            '@progress/kendo-angular-navigation': '20.0.0-develop.7',
             // peer dependency of kendo-angular-inputs
-            '@progress/kendo-angular-dialog': '20.0.0-develop.5',
+            '@progress/kendo-angular-dialog': '20.0.0-develop.7',
             // peer dependency of kendo-angular-icons
             '@progress/kendo-svg-icons': '^4.0.0',
             // peer dependency of kendo-angular-layout
-            '@progress/kendo-angular-progressbar': '20.0.0-develop.5'
+            '@progress/kendo-angular-progressbar': '20.0.0-develop.7'
         } });
     return (0, schematics_1.externalSchematic)('@progress/kendo-angular-schematics', 'ng-add', finalOptions);
 }