@xh/hoist 79.0.0-SNAPSHOT.1767027974015 → 79.0.0-SNAPSHOT.1767028297274

package/build/types/cmp/grid/GridModel.d.ts

@@ -201,12 +201,27 @@ export interface GridConfig {
      * Flags for experimental features. These features are designed for early client-access and
      * testing, but are not yet part of the Hoist API.
      */
-    experimental?: PlainObject;
+    experimental?: GridExperimentalFlags;
     /** Extra app-specific data for the GridModel. */
     appData?: PlainObject;
     /** @internal */
     xhImpl?: boolean;
 }
+interface GridExperimentalFlags {
+    /**
+     * Set to true to enable more optimal row sorting in cases where only small subsets of rows are
+     * updated in configurations where rows have many siblings.
+     * See https://www.ag-grid.com/javascript-data-grid/grid-options/#reference-sort-deltaSort for
+     * more details on where this option may improve (or degrade) performance.
+     */
+    deltaSort?: boolean;
+    /**
+     * Set to true to disable scroll optimization for large grids, where we proactively update the
+     * row heights in ag-grid whenever the data changes to avoid hitching while quickly scrolling
+     * through large grids.
+     */
+    disableScrollOptimization?: boolean;
+}
 /**
  * Core Model for a Grid, specifying the grid's data store, column definitions,
  * sorting/grouping/selection state, and context menu configuration.
@@ -253,7 +268,7 @@ export declare class GridModel extends HoistModel {
     lockColumnGroups: boolean;
     headerMenuDisplay: 'always' | 'hover';
     colDefaults: Partial<ColumnSpec>;
-    experimental: PlainObject;
+    experimental: GridExperimentalFlags;
     onKeyDown: (e: KeyboardEvent) => void;
     onRowClicked: (e: RowClickedEvent) => void;
     onRowDoubleClicked: (e: RowDoubleClickedEvent) => void;
@@ -576,6 +591,10 @@ export declare class GridModel extends HoistModel {
      * Sorts ungrouped items to the bottom.
      */
     defaultGroupSortFn: (a: string, b: string) => number;
+    /** @internal */
+    get deltaSort(): boolean;
+    /** @internal */
+    get disableScrollOptimization(): boolean;
     private buildColumn;
     private autosizeColsInternalAsync;
     private gatherLeaves;
@@ -601,3 +620,4 @@ export declare class GridModel extends HoistModel {
     private createGroupBorderFn;
     private getDefaultStateForColumn;
 }
+export {};

package/cmp/grid/Grid.ts

@@ -196,9 +196,10 @@ export class GridLocalModel extends HoistModel {
 
     private createDefaultAgOptions(): GridOptions {
         const {model} = this,
-            {clicksToEdit, selModel} = model;
+            {clicksToEdit, selModel, deltaSort} = model;
 
         let ret: GridOptions = {
+            deltaSort,
             animateRows: false,
             suppressColumnVirtualisation: !model.useVirtualColumns,
             getRowId: ({data}) => data.agId,
@@ -442,6 +443,7 @@ export class GridLocalModel extends HoistModel {
         // when node is rendered in viewport.
         const {model, agOptions} = this;
         return (
+            !model.disableScrollOptimization &&
             agOptions.getRowHeight &&
             !agOptions.rowHeight &&
             !model.getVisibleLeafColumns().some(c => c.autoHeight)
@@ -450,6 +452,7 @@ export class GridLocalModel extends HoistModel {
 
     applyScrollOptimization() {
         if (!this.useScrollOptimization) return;
+
         const {agApi} = this.model,
             {getRowHeight} = this.agOptions,
             params = {api: agApi, context: null} as any;
@@ -605,6 +608,14 @@ export class GridLocalModel extends HoistModel {
             }
         }
 
+        // Early out if the data hasn't actually changed
+        if (
+            isEqual(pinnedTopRowData, agGridModel.getPinnedTopRowData()) &&
+            isEqual(pinnedBottomRowData, agGridModel.getPinnedBottomRowData())
+        ) {
+            return;
+        }
+
         agApi.updateGridOptions({
             pinnedTopRowData,
             pinnedBottomRowData
@@ -690,7 +701,9 @@ export class GridLocalModel extends HoistModel {
             model.autosizeAsync({columns});
         }
 
-        model.noteAgExpandStateChange();
+        if (model.treeMode || !isEmpty(model.groupBy)) {
+            model.noteAgExpandStateChange();
+        }
 
         this.prevRs = newRs;
         this.applyScrollOptimization();

package/cmp/grid/GridModel.ts

@@ -357,7 +357,7 @@ export interface GridConfig {
      * Flags for experimental features. These features are designed for early client-access and
      * testing, but are not yet part of the Hoist API.
      */
-    experimental?: PlainObject;
+    experimental?: GridExperimentalFlags;
 
     /** Extra app-specific data for the GridModel. */
     appData?: PlainObject;
@@ -366,6 +366,23 @@ export interface GridConfig {
     xhImpl?: boolean;
 }
 
+interface GridExperimentalFlags {
+    /**
+     * Set to true to enable more optimal row sorting in cases where only small subsets of rows are
+     * updated in configurations where rows have many siblings.
+     * See https://www.ag-grid.com/javascript-data-grid/grid-options/#reference-sort-deltaSort for
+     * more details on where this option may improve (or degrade) performance.
+     */
+    deltaSort?: boolean;
+
+    /**
+     * Set to true to disable scroll optimization for large grids, where we proactively update the
+     * row heights in ag-grid whenever the data changes to avoid hitching while quickly scrolling
+     * through large grids.
+     */
+    disableScrollOptimization?: boolean;
+}
+
 /**
  * Core Model for a Grid, specifying the grid's data store, column definitions,
  * sorting/grouping/selection state, and context menu configuration.
@@ -420,7 +437,7 @@ export class GridModel extends HoistModel {
     lockColumnGroups: boolean;
     headerMenuDisplay: 'always' | 'hover';
     colDefaults: Partial<ColumnSpec>;
-    experimental: PlainObject;
+    experimental: GridExperimentalFlags;
     onKeyDown: (e: KeyboardEvent) => void;
     onRowClicked: (e: RowClickedEvent) => void;
     onRowDoubleClicked: (e: RowDoubleClickedEvent) => void;
@@ -1565,6 +1582,16 @@ export class GridModel extends HoistModel {
         return a.localeCompare(b);
     };
 
+    /** @internal */
+    get deltaSort() {
+        return !!this.experimental.deltaSort;
+    }
+
+    /** @internal */
+    get disableScrollOptimization() {
+        return !!this.experimental.disableScrollOptimization;
+    }
+
     //-----------------------
     // Implementation
     //-----------------------
@@ -1887,7 +1914,7 @@ export class GridModel extends HoistModel {
         return new GridFilterModel({bind: this.store, ...filterModel}, this);
     }
 
-    private parseExperimental(experimental) {
+    private parseExperimental(experimental: GridExperimentalFlags) {
         return {
             ...XH.getConf('xhGridExperimental', {}),
             ...experimental

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xh/hoist",
-  "version": "79.0.0-SNAPSHOT.1767027974015",
+  "version": "79.0.0-SNAPSHOT.1767028297274",
   "description": "Hoist add-on for building and deploying React Applications.",
   "repository": "github:xh/hoist-react",
   "homepage": "https://xh.io",