Add support for including hidden columns when autosizing (#3424)

* New `GridAutosizeOptions.includeHiddenColumns` config controls whether hidden columns should also be included during the autosize process. Default of `false`. Useful when applications provide quick toggles between different column sets and would prefer to take the up-front cost of autosizing rather than doing it after the user loads a column set. --------- Co-authored-by: Anselm McClain <[email protected]>
xh · Aug 2, 2023 · eca2075 · eca2075
1 parent 10eb91d
commit eca2075
Show file tree

Hide file tree

Showing 3 changed files with 31 additions and 4 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -13,6 +13,10 @@
 
 ### 🎁 New Features
 
+* New `GridAutosizeOptions.includeHiddenColumns` config controls whether hidden columns should
+  also be included during the autosize process. Default of `false`. Useful when applications
+  provide quick toggles between different column sets and would prefer to take the up-front cost of
+  autosizing rather than doing it after the user loads a column set.
 * New `DashModel.refreshContextModel` allows apps to programmatically refresh all widgets within
   a `DashCanvas` or `DashContainer`.
 

diff --git a/cmp/grid/GridAutosizeOptions.ts b/cmp/grid/GridAutosizeOptions.ts
@@ -39,6 +39,12 @@ export interface GridAutosizeOptions {
      */
     includeCollapsedChildren?: boolean;
 
+    /**
+     * True to also autosize hidden columns.
+     * Note that setting this to true can have performance impacts for grids with many columns hidden by default.
+     */
+    includeHiddenColumns?: boolean;
+
     /**
      * Columns ids to autosize, or a function for testing if the given column should be
      * autosized. Typically used when calling autosizeAsync() manually. To generally exclude

diff --git a/cmp/grid/GridModel.ts b/cmp/grid/GridModel.ts
@@ -870,79 +870,95 @@ export class GridModel extends HoistModel {
     get isReady(): boolean {
         return this.agGridModel.isReady;
     }
+
     get agApi() {
         return this.agGridModel.agApi;
     }
+
     get agColumnApi() {
         return this.agGridModel.agColumnApi;
     }
 
     get sizingMode(): SizingMode {
         return this.agGridModel.sizingMode;
     }
+
     set sizingMode(v: SizingMode) {
         this.agGridModel.sizingMode = v;
     }
+
     setSizingMode(v: SizingMode) {
         this.agGridModel.sizingMode = v;
     }
 
     get showHover(): boolean {
         return this.agGridModel.showHover;
     }
+
     set showHover(v: boolean) {
         this.agGridModel.showHover = v;
     }
+
     setShowHover(v: boolean) {
         this.agGridModel.showHover = v;
     }
 
     get rowBorders(): boolean {
         return this.agGridModel.rowBorders;
     }
+
     set rowBorders(v: boolean) {
         this.agGridModel.rowBorders = v;
     }
+
     setRowBorders(v: boolean) {
         this.agGridModel.rowBorders = v;
     }
 
     get stripeRows(): boolean {
         return this.agGridModel.stripeRows;
     }
+
     set stripeRows(v: boolean) {
         this.agGridModel.stripeRows = v;
     }
+
     setStripeRows(v: boolean) {
         this.agGridModel.stripeRows = v;
     }
 
     get cellBorders(): boolean {
         return this.agGridModel.cellBorders;
     }
+
     set cellBorders(v: boolean) {
         this.agGridModel.cellBorders = v;
     }
+
     setCellBorders(v: boolean) {
         this.agGridModel.cellBorders = v;
     }
 
     get showCellFocus(): boolean {
         return this.agGridModel.showCellFocus;
     }
+
     set showCellFocus(v: boolean) {
         this.agGridModel.showCellFocus = v;
     }
+
     setShowCellFocus(v: boolean) {
         this.agGridModel.showCellFocus = v;
     }
 
     get hideHeaders(): boolean {
         return this.agGridModel.hideHeaders;
     }
+
     set hideHeaders(v: boolean) {
         this.agGridModel.hideHeaders = v;
     }
+
     setHideHeaders(v: boolean) {
         this.agGridModel.hideHeaders = v;
     }
@@ -1263,10 +1279,11 @@ export class GridModel extends HoistModel {
     /**
      * Autosize columns to fit their contents.
      *
-     * @param options - overrides of default autosize options to use for this action.
+     * This method will ignore columns with a flex value or with `autosizable: false`. Hidden
+     * columns are also ignored unless {@link GridAutosizeOptions.includeHiddenColumns} has been
+     * set to true.
      *
-     * This method will ignore hidden columns, columns with a flex value, and columns with
-     * autosizable = false.
+     * @param options - optional overrides of this model's configured {@link autosizeOptions}.
      */
     @logWithDebug
     async autosizeAsync(options: GridAutosizeOptions = {}) {
@@ -1290,7 +1307,7 @@ export class GridModel extends HoistModel {
         }
 
         colIds = castArray(colIds).filter(id => {
-            if (!this.isColumnVisible(id)) return false;
+            if (!options.includeHiddenColumns && !this.isColumnVisible(id)) return false;
             const col = this.getColumn(id);
             return col && col.autosizable && !col.flex && includeColFn(col);
         });