[pull] latest from ag-grid:latest

.vscode/settings.json

@@ -79,9 +79,10 @@
   "cSpell.files": ["**/*", "!**/{package,settings,project,tsconfig}.json"],
   "git.detectSubmodulesLimit": 20,
   "files.exclude": {
-    "**/vitest.config.*.timestamp*": true,
+    "**/.angular/": true,
+    "**/.DS_Store": true,
     "**/.git": true,
-    "**/.DS_Store": true
+    "**/vitest.config.*.timestamp*": true
   },
   "[scss]": {
     "editor.detectIndentation": false,

documentation/ag-grid-docs/src/content/api-documentation/grid-options/properties.json

@@ -1406,6 +1406,12 @@
                 "url": "./grouping-multiple-group-columns/#hiding-expanded-parent-rows"
             }
         },
+        "groupHideColumnsUntilExpanded": {
+            "more": {
+                "name": "Hiding Group Columns Until Expanded",
+                "url": "./grouping-multiple-group-columns/#hiding-group-columns-until-expanded"
+            }
+        },
         "groupHideParentOfSingleChild": {
             "more": {
                 "name": "Remove Single Children",

documentation/ag-grid-docs/src/content/docs/grouping-multiple-group-columns/_examples/hide-columns-until-expanded/example.spec.ts

@@ -0,0 +1,34 @@
+import { expect, test, waitForGridContent } from '@utils/grid/test-utils';
+
+import { GROUP_AUTO_COLUMN_ID } from 'ag-grid-community';
+
+test.agExample(import.meta, () => {
+    test.eachFramework('Example', async ({ page, agIdFor }) => {
+        const countryColId = `${GROUP_AUTO_COLUMN_ID}-country`;
+        const yearColId = `${GROUP_AUTO_COLUMN_ID}-year`;
+        const sportColId = `${GROUP_AUTO_COLUMN_ID}-sport`;
+        await waitForGridContent(page);
+
+        // Initially only the country group column is visible
+        await expect(agIdFor.headerCell(countryColId)).toBeVisible();
+        await expect(agIdFor.headerCell(yearColId)).not.toBeVisible();
+        await expect(agIdFor.headerCell(sportColId)).not.toBeVisible();
+
+        // Expand a country group - reveals the year group column
+        await agIdFor.groupContracted('row-group-country-Canada', countryColId).first().click();
+        await expect(agIdFor.headerCell(yearColId)).toBeVisible();
+        await expect(agIdFor.headerCell(sportColId)).not.toBeVisible();
+
+        // Expand a year group - reveals the sport group column
+        await agIdFor.groupContracted('row-group-country-Canada-year-2006', yearColId).first().click();
+        await expect(agIdFor.headerCell(sportColId)).toBeVisible();
+
+        // Collapse the year group - sport column hides again
+        await agIdFor.groupExpanded('row-group-country-Canada-year-2006', yearColId).first().click();
+        await expect(agIdFor.headerCell(sportColId)).not.toBeVisible();
+
+        // Collapse the country group - year column hides again
+        await agIdFor.groupExpanded('row-group-country-Canada', countryColId).first().click();
+        await expect(agIdFor.headerCell(yearColId)).not.toBeVisible();
+    });
+});

documentation/ag-grid-docs/src/content/docs/grouping-multiple-group-columns/_examples/hide-columns-until-expanded/index.html

@@ -0,0 +1 @@
+<div id="myGrid" style="height: 100%"></div>

documentation/ag-grid-docs/src/content/docs/grouping-multiple-group-columns/_examples/hide-columns-until-expanded/main.ts

@@ -0,0 +1,40 @@
+import type { GridApi, GridOptions } from 'ag-grid-community';
+import { ClientSideRowModelModule, ModuleRegistry, ValidationModule, createGrid } from 'ag-grid-community';
+import { RowGroupingModule } from 'ag-grid-enterprise';
+
+ModuleRegistry.registerModules([
+    ClientSideRowModelModule,
+    RowGroupingModule,
+    ...(process.env.NODE_ENV !== 'production' ? [ValidationModule] : []),
+]);
+
+let gridApi: GridApi<IOlympicData>;
+
+const gridOptions: GridOptions<IOlympicData> = {
+    columnDefs: [
+        { field: 'country', rowGroup: true, hide: true },
+        { field: 'year', rowGroup: true, hide: true },
+        { field: 'sport', rowGroup: true, hide: true },
+        { field: 'athlete', minWidth: 200, aggFunc: 'count' },
+        { field: 'total', aggFunc: 'sum' },
+    ],
+    defaultColDef: {
+        minWidth: 150,
+    },
+    autoGroupColumnDef: {
+        minWidth: 200,
+    },
+    groupDisplayType: 'multipleColumns',
+    groupHideColumnsUntilExpanded: true,
+    groupDefaultExpanded: 0,
+};
+
+// setup the grid after the page has finished loading
+document.addEventListener('DOMContentLoaded', function () {
+    const gridDiv = document.querySelector<HTMLElement>('#myGrid')!;
+    gridApi = createGrid(gridDiv, gridOptions);
+
+    fetch('https://www.ag-grid.com/example-assets/olympic-winners.json')
+        .then((response) => response.json())
+        .then((data: IOlympicData[]) => gridApi!.setGridOption('rowData', data));
+});

documentation/ag-grid-docs/src/content/docs/grouping-multiple-group-columns/_examples/hide-open-parents/main.ts

@@ -1,4 +1,4 @@
-import type { GridApi, GridOptions, ValueGetterParams } from 'ag-grid-community';
+import type { GridApi, GridOptions } from 'ag-grid-community';
 import { ClientSideRowModelModule, ModuleRegistry, ValidationModule, createGrid } from 'ag-grid-community';
 import {
     ColumnMenuModule,

documentation/ag-grid-docs/src/content/docs/grouping-multiple-group-columns/index.mdoc

@@ -188,3 +188,23 @@ const gridOptions = {
     groupHideOpenParents: true,
 }
 ```
+
+## Hiding Group Columns Until Expanded
+
+By default all group columns are visible at all times. Setting `groupHideColumnsUntilExpanded` to `true` hides group columns
+for levels that have not yet been reached through expansion. Only the top-level group column is initially visible; each
+subsequent level's column becomes visible when at least one group at the preceding level is expanded.
+
+Try expanding a Country row to reveal the Year group column, then expand a Year row to reveal the Sport group column.
+Collapsing all rows at a given level will hide the corresponding group column again.
+
+{% gridExampleRunner title="Hide Group Columns Until Expanded" name="hide-columns-until-expanded" /%}
+
+The example above demonstrates the following configuration:
+
+```{% frameworkTransform=true %}
+const gridOptions = {
+    groupDisplayType: 'multipleColumns',
+    groupHideColumnsUntilExpanded: true,
+}
+```

packages/ag-grid-angular/projects/ag-grid-angular/src/lib/ag-grid-angular.component.ts

@@ -1421,6 +1421,14 @@ export class AgGridAngular<TData = any, TColDef extends ColDef<TData> = ColDef<a
      * @agModule `RowGroupingModule`
      */
     @Input({ transform: booleanAttribute }) public groupHideOpenParents: boolean | undefined = undefined;
+    /** When using `groupDisplayType='multipleColumns'` or `groupHideOpenParents=true`, hides group columns for levels
+     * that have not yet been expanded. Only the top-level group column is initially
+     * visible; each subsequent level becomes visible when at least one group at the
+     * preceding level is expanded.
+     * @default false
+     * @agModule `RowGroupingModule`
+     */
+    @Input({ transform: booleanAttribute }) public groupHideColumnsUntilExpanded: boolean | undefined = undefined;
     /** Set to `true` to prevent the grid from creating a '(Blanks)' group for nodes which do not belong to a group, and display the unbalanced nodes alongside group nodes.
      * @default false
      * @agModule `RowGroupingModule`

packages/ag-grid-community/src/columns/columnModel.ts

@@ -8,7 +8,7 @@ import type { ColDef, ColGroupDef, ColKey } from '../entities/colDef';
 import type { GridOptions } from '../entities/gridOptions';
 import type { ColumnEventType } from '../events';
 import type { PropertyChangedEvent, PropertyValueChangedEvent } from '../gridOptionsService';
-import { _isRowNumbers, _shouldMaintainColumnOrder } from '../gridOptionsUtils';
+import { _isGroupHideColumnsUntilExpanded, _isRowNumbers, _shouldMaintainColumnOrder } from '../gridOptionsUtils';
 import type { IColumnCollectionService } from '../interfaces/iColumnCollectionService';
 import type { IPivotResultColsService } from '../interfaces/iPivotResultColsService';
 import { _createColumnTree } from './columnFactoryUtils';
@@ -74,6 +74,7 @@ export class ColumnModel extends BeanStub implements NamedBean {
                 'treeData',
                 'treeDataDisplayType',
                 'groupHideOpenParents',
+                'groupHideColumnsUntilExpanded',
                 'rowNumbers',
                 'hidePaddedHeaderRows',
             ],
@@ -285,25 +286,26 @@ export class ColumnModel extends BeanStub implements NamedBean {
         // show columns we are aggregating on and possibly the selection/row numbers column
         const { beans, showingPivotResult, cols } = this;
 
-        const { valueColsSvc, selectionColSvc } = beans;
+        const { valueColsSvc, selectionColSvc, gos } = beans;
         const showAutoGroupAndValuesOnly = this.isPivotMode() && !showingPivotResult;
         const showSelectionColumn = selectionColSvc?.isSelectionColumnEnabled();
         const showRowNumbers = _isRowNumbers(beans);
         const valueColumns = valueColsSvc?.columns;
+        const hideEmptyAutoColGroups = _isGroupHideColumnsUntilExpanded(gos);
 
         const res = cols.list.filter((col) => {
             const isAutoGroupCol = isColumnGroupAutoCol(col);
             if (showAutoGroupAndValuesOnly) {
                 const isValueCol = valueColumns?.includes(col);
                 return (
-                    isAutoGroupCol ||
                     isValueCol ||
+                    (isAutoGroupCol && (!hideEmptyAutoColGroups || col.isVisible())) ||
                     (showSelectionColumn && isColumnSelectionCol(col)) ||
                     (showRowNumbers && isRowNumberCol(col))
                 );
             } else {
-                // keep col if a) it's auto-group or b) it's visible
-                return isAutoGroupCol || col.isVisible();
+                // keep col if a) it's auto-group (and feature not managing visibility) or b) it's visible
+                return (isAutoGroupCol && !hideEmptyAutoColGroups) || col.isVisible();
             }
         });
 

packages/ag-grid-community/src/entities/gridOptions.ts

@@ -1495,6 +1495,15 @@ export interface GridOptions<TData = any> {
      * @agModule `RowGroupingModule`
      */
     groupHideOpenParents?: boolean;
+    /**
+     * When using `groupDisplayType='multipleColumns'` or `groupHideOpenParents=true`, hides group columns for levels
+     * that have not yet been expanded. Only the top-level group column is initially
+     * visible; each subsequent level becomes visible when at least one group at the
+     * preceding level is expanded.
+     * @default false
+     * @agModule `RowGroupingModule`
+     */
+    groupHideColumnsUntilExpanded?: boolean;
     /**
      * Set to `true` to prevent the grid from creating a '(Blanks)' group for nodes which do not belong to a group, and display the unbalanced nodes alongside group nodes.
      * @default false

packages/ag-grid-community/src/gridOptionsDefault.ts

@@ -117,6 +117,7 @@ export const GRID_OPTION_DEFAULTS = {
     groupRemoveSingleChildren: false,
     groupRemoveLowestSingleChildren: false,
     groupHideOpenParents: false,
+    groupHideColumnsUntilExpanded: false,
     groupAllowUnbalanced: false,
     rowGroupPanelShow: 'never',
     suppressMakeColumnVisibleAfterUnGroup: false,

packages/ag-grid-community/src/gridOptionsUtils.ts

@@ -236,6 +236,10 @@ export function _isGroupMultiAutoColumn(gos: GridOptionsService) {
     return gos.get('groupDisplayType') === 'multipleColumns';
 }
 
+export function _isGroupHideColumnsUntilExpanded(gos: GridOptionsService) {
+    return _isGroupMultiAutoColumn(gos) && gos.get('groupHideColumnsUntilExpanded');
+}
+
 export function _isGroupUseEntireRow(gos: GridOptionsService, pivotMode: boolean): boolean {
     // we never allow groupDisplayType = 'groupRows' if in pivot mode, otherwise we won't see the pivot values.
     if (pivotMode) {

packages/ag-grid-community/src/main-internal.ts

@@ -370,6 +370,7 @@ export {
     _isFullWidthGroupRow,
     _isGetRowHeightFunction,
     _isGroupMultiAutoColumn,
+    _isGroupHideColumnsUntilExpanded,
     _isGroupRowsSticky,
     _isGroupUseEntireRow,
     _isLegacyMenuEnabled,

packages/ag-grid-community/src/propertyKeys.ts

@@ -253,6 +253,7 @@ export const _BOOLEAN_GRID_OPTIONS: KeysWithType<boolean>[] = [
     'embedFullWidthRows',
     'suppressPaginationPanel',
     'groupHideOpenParents',
+    'groupHideColumnsUntilExpanded',
     'groupAllowUnbalanced',
     'pagination',
     'paginationAutoPageSize',

packages/ag-grid-community/src/validation/rules/gridOptionsValidations.ts

@@ -246,6 +246,15 @@ const GRID_OPTION_VALIDATIONS: () => Validations<GridOptions> = () => {
         groupDefaultExpanded: {
             supportedRowModels: ['clientSide'],
         },
+        groupHideColumnsUntilExpanded: {
+            supportedRowModels: ['clientSide'],
+            validate({ groupHideColumnsUntilExpanded, groupHideOpenParents, groupDisplayType }) {
+                if (groupHideColumnsUntilExpanded && !groupHideOpenParents && groupDisplayType !== 'multipleColumns') {
+                    return "`groupHideColumnsUntilExpanded = true` requires either `groupDisplayType = 'multipleColumns'` or `groupHideOpenParents = true`";
+                }
+                return null;
+            },
+        },
         groupHideOpenParents: {
             supportedRowModels: ['clientSide', 'serverSide'],
             dependencies: {