@gp-grid/angular 0.17.0 → 0.18.0

package/fesm2022/gp-grid-angular.mjs

@@ -1,7 +1,7 @@
 import * as i0 from '@angular/core';
 import { input, output, computed, TemplateRef, ChangeDetectionStrategy, Component, ViewChild, signal, effect, HostListener, inject, PLATFORM_ID, InjectionToken, Injectable } from '@angular/core';
 import { NgTemplateOutlet, isPlatformBrowser } from '@angular/common';
-import { getFieldValue, isCellSelected, isCellActive, formatCellValue, isCellInFillPreview, buildCellClasses, isCellEditing, calculateFilterPopupPosition, bindPeekSelectAll, calculateScaledColumnPositions, getTotalWidth, calculateFillHandlePosition, DataSourceOwner, AutoScrollDriver, PendingRowDragController, InputEventAdapter, applyBatchInstructions, scrollCellIntoView, GridCore, createMutableClientDataSource } from '@gp-grid/core';
+import { getFieldValue, isCellSelected, isCellActive, formatCellValue, isCellInFillPreview, buildCellClasses, isCellEditing, calculateFilterPopupPosition, bindPeekSelectAll, calculateScaledColumnPositions, getTotalWidth, calculateFillHandlePosition, DataSourceOwner, AutoScrollDriver, PendingRowDragController, PendingCellTapController, TouchScrollController, InputEventAdapter, applyBatchInstructions, scrollCellIntoView, GridCore, createMutableClientDataSource } from '@gp-grid/core';
 export { GridCore, createClientDataSource, createDataSourceFromArray, createMutableClientDataSource, createServerDataSource } from '@gp-grid/core';
 
 const TEMPLATE$2 = `
@@ -1470,6 +1470,8 @@ class GpGridBindings {
     dataSourceOwner = new DataSourceOwner();
     autoScroll;
     pendingRowDrag;
+    pendingCellTap;
+    touchScroll;
     input;
     coreRef = null;
     unsubscribe = null;
@@ -1483,11 +1485,22 @@ class GpGridBindings {
             isBrowser: this.deps.isBrowser,
             onDragConfirmed: (state) => this.deps.vm.dragState.set(state),
         });
+        this.pendingCellTap = new PendingCellTapController({
+            getCore: () => this.coreRef,
+            isBrowser: this.deps.isBrowser,
+            onTapConfirmed: () => this.deps.getContainer()?.focus(),
+        });
+        this.touchScroll = new TouchScrollController({
+            getCore: () => this.coreRef,
+            getScrollEl: this.deps.getBody,
+            isBrowser: this.deps.isBrowser,
+        });
         this.input = new InputEventAdapter({
             getCore: () => this.coreRef,
             getBodyEl: this.deps.getBody,
             autoScroll: this.autoScroll,
             pendingRowDrag: this.pendingRowDrag,
+            pendingCellTap: this.pendingCellTap,
             onDragStateChange: (state) => this.deps.vm.dragState.set(state),
         });
     }
@@ -1517,11 +1530,16 @@ class GpGridBindings {
         });
         this.resizeObserver.observe(container);
         this.coreRef?.setViewport(0, 0, container.clientWidth, bodyEl.clientHeight);
+        // Synthetic touch scrolling: takes over touch gestures only when scroll
+        // virtualization compresses the DOM scroll space; inert otherwise.
+        this.touchScroll.attach();
     }
     destroy() {
         this.autoScroll.stop();
         this.pendingRowDrag.cancel();
         this.pendingRowDrag.releaseLocks();
+        this.pendingCellTap.cancel();
+        this.touchScroll.detach();
         this.unsubscribe?.();
         this.resizeObserver?.disconnect();
         this.coreRef?.destroy();
@@ -1553,16 +1571,22 @@ class GpGridBindings {
         const top = this.deps.vm.pendingScrollTop();
         const body = this.deps.getBody();
         if (top !== null && body) {
+            this.touchScroll.stop();
             body.scrollTop = top;
             this.deps.vm.pendingScrollTop.set(null);
         }
     }
-    scrollToRow(row) {
+    scrollToCell(cell) {
         const core = this.coreRef;
         const body = this.deps.getBody();
         if (core === null || body === null)
             return;
-        scrollCellIntoView(core, body, row, this.deps.getRowHeight(), this.deps.vm.slots(), this.deps.vm.rowsWrapperOffset());
+        scrollCellIntoView(core, body, cell.row, this.deps.getRowHeight(), this.deps.vm.slots(), this.deps.vm.rowsWrapperOffset(), {
+            colIndex: cell.col,
+            visibleColumns: this.deps.vm.visibleColumnWithIndices(),
+            columnPositions: this.deps.vm.columnPositions(),
+            columnWidths: this.deps.vm.columnWidths(),
+        });
     }
 }
 
@@ -1762,7 +1786,7 @@ class GpGridComponent {
         if (result.preventDefault)
             event.preventDefault();
         if (result.scrollToCell)
-            this.bindings.scrollToRow(result.scrollToCell.row);
+            this.bindings.scrollToCell(result.scrollToCell);
     }
     onPaste(event) {
         const editing = this.vm.editingCell();

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@gp-grid/angular",
   "description": "A high-performance Angular data grid component with virtual scrolling, cell selection, sorting, filtering, and Excel-like editing",
-  "version": "0.17.0",
+  "version": "0.18.0",
   "license": "Apache-2.0",
   "module": "fesm2022/gp-grid-angular.mjs",
   "typings": "types/gp-grid-angular.d.ts",
@@ -51,7 +51,7 @@
     "@angular/core": ">=18.0.0"
   },
   "dependencies": {
-    "@gp-grid/core": "0.17.0",
+    "@gp-grid/core": "0.18.0",
     "tslib": "^2.8.1"
   },
   "sideEffects": false,