@one-grid-core/angular 0.5.2 → 0.5.4

package/fesm2022/one-grid-core-angular.mjs

@@ -2,7 +2,7 @@ import { v4 } from 'uuid';
 import * as i0 from '@angular/core';
 import { Injectable, inject, NgZone, Pipe, Input, Component, EventEmitter, HostListener, ViewChildren, Output, ViewChild, ChangeDetectionStrategy, Directive, NgModule } from '@angular/core';
 import { BehaviorSubject, Subject, Subscription } from 'rxjs';
-import _ from 'lodash';
+import lodash from 'lodash';
 import { filter, map, debounceTime, take } from 'rxjs/operators';
 import { NgClass, NgStyle, NgTemplateOutlet, DecimalPipe } from '@angular/common';
 import * as i2 from 'lucide-angular';
@@ -148,10 +148,20 @@ const ONE_GROUP_VALUE_FIELD = '__oneGroupValue';
 const ONE_GROUP_CHILDREN_FIELD = '__oneGroupChildren';
 /** What a group of rows with no value in the grouped field is labelled. */
 const ONE_GROUP_BLANK_LABEL = '(Blank)';
-/** The `rowGroup` fields of a column set, in definition order. */
+/**
+ * The `rowGroup` fields of a column set, in definition order.
+ *
+ * Grouping keys on a row's own field, so a column that asks to group without
+ * one has nothing to group by — it is dropped, but not silently: that is a
+ * definition that reads as if it works.
+ */
 function rowGroupFields(columns) {
-    return (columns ?? [])
-        .filter(column => column.rowGroup && column.field)
+    const grouping = (columns ?? []).filter(column => column.rowGroup);
+    for (const column of grouping.filter(column => !column.field)) {
+        console.warn(`[one-grid] the column "${column.headerName ?? column.id ?? '(unnamed)'}" declares rowGroup but has no field — grouping reads the row's own value, so a valueGetter is not enough. The column was left ungrouped.`);
+    }
+    return grouping
+        .filter(column => column.field)
         .map(column => column.field);
 }
 /** The `aggFunc` columns of a column set. */
@@ -714,6 +724,16 @@ class OgColumnService {
         this.setGroupColumnDefs(groupColumnDefs);
         this.setColumnDefs(columnDefs);
     }
+    /**
+     * Every registered column, hidden ones included, in display order.
+     *
+     * `getColumnState` answers what is on screen; this answers what the grid
+     * knows about — which is what anything reading a column's *configuration*
+     * (an `aggFunc`, say) needs, since hiding a column does not unconfigure it.
+     */
+    getAllColumnDefs() {
+        return this.allColumnDefs;
+    }
     getColumnState() {
         const columns = this.columnDefs$.getValue();
         const groups = this.groupColumnDefs$.getValue();
@@ -728,7 +748,7 @@ class OgColumnService {
             const column = {
                 ...this.defaultColumnDef,
                 ...col,
-                id: col?.field ? col.field : _.uniqueId('col_'),
+                id: col?.field ? col.field : lodash.uniqueId('col_'),
             };
             return this.resolveHeaderPresentation(column);
         });
@@ -823,7 +843,7 @@ class OgColumnService {
      * place relative to its neighbours.
      */
     reorderColumnDefs(fromIndex, toIndex) {
-        const columns = _.clone(this.allColumnDefs);
+        const columns = lodash.clone(this.allColumnDefs);
         const visible = columns.filter(column => !column.hide);
         const moved = visible[fromIndex];
         if (!moved)
@@ -1425,12 +1445,26 @@ class OneGridApi {
         this._quickFilterValue = null;
         this._activeFilters = [];
         this._visibleRowNodes = [];
+        /**
+         * The rows as the host last handed them over — before grouping folded
+         * them. Grouping is a transform on the way in, so this is what a change of
+         * grouping re-folds, and it is why regrouping keeps the host's row order
+         * instead of inheriting the order the previous grouping happened to leave.
+         */
+        this._sourceRows = [];
         this._pinnedRowNodes = { top: [], bottom: [] };
         this._originalRowNodes = new Map();
         this._nodeCleanupMap = new Map(); // Cleanup registry (prevents memory leaks)
         this._destroyed = false;
         // Advanced Features
         this.treeData = false;
+        /**
+         * Whether the *host* declared tree data, as opposed to grouping having
+         * turned tree mode on. `treeData` above answers "is this a tree right now",
+         * which grouping flips; this answers "whose tree is it", which decides
+         * whether grouping may touch it at all.
+         */
+        this._hostTreeData = false;
         this.treeDataChildrenField = null;
         this.groupDefaultExpanded = 0;
         this.masterDetail = false;
@@ -1472,6 +1506,7 @@ class OneGridApi {
         this.detailCellRendererParams = detailCellRendererParams;
         this.detailRendererComponent = detailRendererComponent;
         this.treeData = treeData;
+        this._hostTreeData = treeData;
         this.selectionService.setSelectionMode(rowSelection);
         // Synthetic group rows carry their own stable id — the path of group
         // values — which no host getRowId knows how to derive. The wrapper reads
@@ -1555,6 +1590,9 @@ class OneGridApi {
             }
             return next;
         });
+        // Grouped roots are synthetic, so the data is on the leaves; otherwise the
+        // roots are the data. Read from the nodes rather than from `_sourceRows`
+        // so a reorder the user dragged into place survives the transaction.
         const currentRows = grouping
             ? this._rowNodes.filter(node => node.leaf).map(node => node.data)
             : this._rowNodes.filter(node => !node.parent).map(node => node.data);
@@ -1576,6 +1614,7 @@ class OneGridApi {
             this.selectionService.deselectAll();
             this.expansionService.clear();
         }
+        this._sourceRows = rowData ?? [];
         // Row grouping is a transform on the way in: the host keeps handing the
         // grid flat rows, and the tree pipeline below sees synthetic group rows
         // with children — the same shape tree data arrives in.
@@ -1627,6 +1666,14 @@ class OneGridApi {
             if (node) {
                 node.data = data;
                 node.setRowIndex(this._currentIndex);
+                // Where a row sits is rebuilt, not remembered. A reused node used to
+                // keep the level and parent it had when it was first built, so a row
+                // that changed place in the hierarchy — a leaf moved to another
+                // parent, or lifted to the root when the grouping changed — kept
+                // pointing at its old parent, and the visibility walk (which climbs
+                // parents) hid it behind a node that was no longer above it.
+                node.level = level;
+                node.parent = parent;
             }
             else {
                 node = new OneRowNode(rowId, data, this._currentIndex);
@@ -2256,14 +2303,56 @@ class OneGridApi {
         return this._rowGroupFields;
     }
     /**
-     * Turn row grouping on. Called by `OneGridComponent` when column
-     * definitions declare `rowGroup`; the grid then behaves as a tree over
-     * synthetic group rows, and `setRowData` / `updateRowData` keep taking the
-     * flat rows they always took.
+     * Group the rows by these fields, in nesting order — or ungroup by passing
+     * an empty array.
+     *
+     * `OneGridComponent` calls this once for the column definitions that
+     * declare `rowGroup`; hosts call it to regroup afterwards. Either way the
+     * grid re-plumbs itself around the new grouping — tree mode, the auto group
+     * column, the visibility of the grouped-by columns — and folds the rows it
+     * already holds again, so nothing has to be rebound and no grid has to be
+     * torn down and re-created to group by a different column.
+     *
+     * `aggregations` defaults to the `aggFunc` columns currently registered, so
+     * `setRowGrouping(['country'])` keeps the totals the column definitions
+     * already describe.
      */
-    setRowGrouping(groupFields, aggregations = []) {
-        this._rowGroupFields = groupFields ?? [];
-        this._aggColumns = aggregations ?? [];
+    setRowGrouping(groupFields, aggregations) {
+        if (this._destroyed)
+            return;
+        const previous = this._rowGroupFields;
+        // Empty fields buy nothing and a repeated one would nest a level under
+        // itself, where every child group holds the whole parent.
+        const next = (groupFields ?? [])
+            .filter(field => !!field)
+            .filter((field, index, fields) => fields.indexOf(field) === index);
+        // Grouping *is* the tree. A host that brought its own tree data, or a
+        // master/detail grid, already has a hierarchy, and folding a second one
+        // over it would throw the first away.
+        if (next.length && (this._hostTreeData || this.masterDetail)) {
+            console.warn('[one-grid] setRowGrouping does not apply to tree data or master/detail grids — they carry their own hierarchy. Nothing was changed.');
+            return;
+        }
+        const unchanged = next.length === previous.length && next.every((field, index) => field === previous[index]);
+        if (unchanged && !aggregations)
+            return;
+        this._rowGroupFields = next;
+        this._aggColumns = aggregations ?? aggColumns(this.columnService.getAllColumnDefs());
+        // The row model's half of the switch: grouped rows carry their children
+        // under the grouping helper's own field, and the tree pipeline walks them
+        // from there. Ungrouping puts both back — which is safe because the guard
+        // above means tree mode can only have come from grouping.
+        this.treeData = next.length > 0;
+        this.treeDataChildrenField = next.length ? ONE_GROUP_CHILDREN_FIELD : null;
+        // Everything grouping implies outside the row model — the auto group
+        // column, which of the host's columns are hidden, the grid type the body
+        // renders — belongs to the component that owns the template. It re-plumbs
+        // on this event, synchronously, so the rebuild below already sees the
+        // columns the new grouping needs.
+        this.eventService.dispatchEvent('rowGroupingChanged', { groupFields: next, previousGroupFields: previous });
+        // Nothing to fold before the first load: `setRowData` will do it.
+        if (this._rowNodes.length)
+            this.rebuildRows(this._sourceRows, false);
     }
     /**
      * Start recording committed cell edits for undo/redo. Called by
@@ -4016,6 +4105,7 @@ class OneGridRowActionComponent {
         this.detailActiveExcludeLevels = new Set(this.column.cellRendererParams?.detailActiveExcludeLevels ?? []);
         this.gotoDetailExcludeLevels = new Set(this.column.cellRendererParams?.gotoDetailExcludeLevels ?? []);
         this.addNewExcludeLevels = new Set(this.column.cellRendererParams?.addNewExcludeLevels ?? []);
+        this.gotoListExcludeLevels = new Set(this.column.cellRendererParams?.gotoListExcludeLevels ?? []);
     }
     /**
      * Trigger Invoke Click Event
@@ -4122,11 +4212,11 @@ class OneGridRowActionComponent {
         this.onRowCellOption.emit(data);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: OneGridRowActionComponent, deps: [{ token: OneGridCellService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: OneGridRowActionComponent, isStandalone: true, selector: "one-grid-row-action", inputs: { column: "column", node: "node", allowedEdit: "allowedEdit", masterDetail: "masterDetail", masterNode: "masterNode", cellRendererParams: "cellRendererParams", gridType: "gridType", context: "context" }, outputs: { onRowGotoDetail: "onRowGotoDetail", onRowAddNew: "onRowAddNew", onRowView: "onRowView", onRowLocation: "onRowLocation", onRowDocument: "onRowDocument", onRowCopy: "onRowCopy", onRowDelete: "onRowDelete", onRowGotoList: "onRowGotoList", onRowEdit: "onRowEdit", onRowPrint: "onRowPrint", onRowHistory: "onRowHistory", onRowOption: "onRowOption", onRowLanguage: "onRowLanguage", onRowCellOption: "onRowCellOption" }, ngImport: i0, template: "@if ((cellRendererParams && node?.leaf && !column?.autoGroupField && !(node.group && node.leafGroup)) || (column?.rowActionLevels?.includes(node.level) && column?.autoGroupField)) {\n    <div class=\"btn-action-container\">\n\n        <!-- Expansion Button Status -->\n         @if ((cellRendererParams?.detailActiveButtonStatus == 1 && !(detailActiveExcludeLevels?.has(node.level)))) {\n            <!-- A button, not an <a> with a click handler: it has no href, so\n                 it was neither focusable nor operable from the keyboard. -->\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-plain me-2\"\n                [attr.aria-expanded]=\"node.detailActive\"\n                [attr.aria-label]=\"node.detailActive ? 'Collapse row' : 'Expand row'\"\n                [title]=\"node.detailActive ? 'Collapse' : 'Expand'\"\n                (click)=\"invokeRowToggleDetailActiveExpand(node)\">\n\n                <i class=\"bi\" [ngClass]=\"{ 'bi-chevron-down': node.detailActive, 'bi-chevron-right': !node.detailActive }\"></i>\n            </button>\n        }\n\n        <!-- Goto Detail Button Status -->\n        @if ((cellRendererParams?.gotoDetailButtonStatus == 1 && !(gotoDetailExcludeLevels?.has(node.level))) && (!hideActionButton || allowedEdit)) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [attr.aria-label]=\"labels.gotoDetail\"\n                [title]=\"labels.gotoDetail\"\n                (click)=\"invokeRowActionGotoDetail(node, column)\">\n\n                <i class=\"bi bi-list-task\"></i>\n            </button>\n        }\n\n        <!-- Add New Button Status -->\n        @if ((cellRendererParams?.addNewButtonStatus == 1 && !(addNewExcludeLevels?.has(node.level))) && (!hideActionButton || allowedEdit)) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.addNew\"\n                [title]=\"labels.addNew\"\n                (click)=\"invokeRowActionAddNew(node, column)\">\n\n                <i class=\"bi bi-plus\"></i>\n            </button>\n        }\n\n        <!-- View Button Status -->\n        @if (cellRendererParams?.viewButtonStatus == 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [attr.aria-label]=\"labels.view\"\n                [title]=\"labels.view\"\n                (click)=\"invokeRowActionView(node, column)\">\n\n                <i class=\"bi bi-eye\"></i>\n            </button>\n        }\n        @if (cellRendererParams?.locationButtonStatus == 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [attr.aria-label]=\"labels.location\"\n                [title]=\"labels.location\"\n                (click)=\"invokeRowActionLocation(node, column)\">\n\n                <i class=\"bi bi-geo-alt\"></i>\n            </button>\n        }\n\n        <!-- Document Button Status -->\n        @if (cellRendererParams?.documentButtonStatus == 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [attr.aria-label]=\"labels.document\"\n                [title]=\"labels.document\"\n                (click)=\"invokeRowActionDocument(node, column)\">\n\n                <i class=\"bi bi-file-earmark-text\"></i>\n            </button>\n        }\n\n        <!-- Copy Button Status -->\n        @if (cellRendererParams?.copyButtonStatus == 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [attr.aria-label]=\"labels.copy\"\n                [title]=\"labels.copy\"\n                (click)=\"invokeRowActionCopy(node, column)\">\n\n                <i class=\"bi bi-files\"></i>\n            </button>\n        }\n\n\n        <!-- Delete Button Status -->\n         @if (cellRendererParams?.deleteButtonStatus == 1 && (!hideActionButton || allowedEdit)) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-danger\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.delete\"\n                [title]=\"labels.delete\"\n                (click)=\"invokeRowActionDelete(node, column)\">\n\n                <i class=\"bi bi-trash3\"></i>\n            </button>\n        }\n\n        <!-- Goto List Button Status -->\n        @if (cellRendererParams?.gotoListButtonStatus === 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-success\"\n                [attr.aria-label]=\"labels.gotoList\"\n                [title]=\"labels.gotoList\"\n                (click)=\"invokeRowActionGotoList(node, column)\">\n\n                <i class=\"bi bi-list-ul\"></i>\n            </button>\n        }\n\n        <!-- Edit Button Status -->\n        @if (cellRendererParams?.editButtonStatus === 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.edit\"\n                [title]=\"labels.edit\"\n                (click)=\"invokeRowActionEdit(node, column)\">\n\n                <i class=\"bi bi-pencil\"></i>\n            </button>\n        }\n\n        <!-- Print Button Status -->\n        @if (cellRendererParams?.printButtonStatus === 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.print\"\n                [title]=\"labels.print\"\n                (click)=\"invokeRowActionPrint(node, column)\">\n\n                <i class=\"bi bi-printer\"></i>\n            </button>\n        }\n\n        <!-- History Button Status -->\n        @if (cellRendererParams?.historyButtonStatus === 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.history\"\n                [title]=\"labels.history\"\n                (click)=\"invokeRowActionHistory(node, column)\">\n\n                <i class=\"bi bi-clock-history\"></i>\n            </button>\n        }\n\n        <!-- Option Button Status -->\n        @if (cellRendererParams?.optionButtonStatus === 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.option\"\n                [title]=\"labels.option\"\n                (click)=\"invokeRowActionOption(node, column)\">\n\n                <i class=\"bi bi-three-dots-vertical\"></i>\n            </button>\n        }\n\n        <!-- Language Button Status -->\n        @if (cellRendererParams?.languageButtonStatus === 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.language\"\n                [title]=\"labels.language\"\n                (click)=\"invokeRowActionLanguage(node, column)\">\n\n                <i class=\"bi bi-translate\"></i>\n            </button>\n        }\n\n        <!-- Cell Optoion Button Status (Context Menu) -->\n        @if (cellRendererParams?.cellOptionButtonStatus === 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary border-0 text-body\"\n                [style.background]=\"'transparent'\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.cellOption\"\n                [title]=\"labels.cellOption\"\n                (click)=\"invokeRowActionCellOption(node, column)\">\n\n                <i class=\"bi bi-three-dots-vertical\"></i>\n            </button>\n        }\n    </div>\n}", styles: [""], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: OneGridRowActionComponent, isStandalone: true, selector: "one-grid-row-action", inputs: { column: "column", node: "node", allowedEdit: "allowedEdit", masterDetail: "masterDetail", masterNode: "masterNode", cellRendererParams: "cellRendererParams", gridType: "gridType", context: "context" }, outputs: { onRowGotoDetail: "onRowGotoDetail", onRowAddNew: "onRowAddNew", onRowView: "onRowView", onRowLocation: "onRowLocation", onRowDocument: "onRowDocument", onRowCopy: "onRowCopy", onRowDelete: "onRowDelete", onRowGotoList: "onRowGotoList", onRowEdit: "onRowEdit", onRowPrint: "onRowPrint", onRowHistory: "onRowHistory", onRowOption: "onRowOption", onRowLanguage: "onRowLanguage", onRowCellOption: "onRowCellOption" }, ngImport: i0, template: "@if ((cellRendererParams && node?.leaf && !column?.autoGroupField && !(node.group && node.leafGroup)) || (column?.rowActionLevels?.includes(node.level) && column?.autoGroupField)) {\n    <div class=\"btn-action-container\">\n\n        <!-- Expansion Button Status -->\n         @if ((cellRendererParams?.detailActiveButtonStatus == 1 && !(detailActiveExcludeLevels?.has(node.level)))) {\n            <!-- A button, not an <a> with a click handler: it has no href, so\n                 it was neither focusable nor operable from the keyboard. -->\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-plain me-2\"\n                [attr.aria-expanded]=\"node.detailActive\"\n                [attr.aria-label]=\"node.detailActive ? 'Collapse row' : 'Expand row'\"\n                [title]=\"node.detailActive ? 'Collapse' : 'Expand'\"\n                (click)=\"invokeRowToggleDetailActiveExpand(node)\">\n\n                <i class=\"bi\" [ngClass]=\"{ 'bi-chevron-down': node.detailActive, 'bi-chevron-right': !node.detailActive }\"></i>\n            </button>\n        }\n\n        <!-- Goto Detail Button Status -->\n        @if ((cellRendererParams?.gotoDetailButtonStatus == 1 && !(gotoDetailExcludeLevels?.has(node.level))) && (!hideActionButton || allowedEdit)) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [attr.aria-label]=\"labels.gotoDetail\"\n                [title]=\"labels.gotoDetail\"\n                (click)=\"invokeRowActionGotoDetail(node, column)\">\n\n                <i class=\"bi bi-list-task\"></i>\n            </button>\n        }\n\n        <!-- Add New Button Status -->\n        @if ((cellRendererParams?.addNewButtonStatus == 1 && !(addNewExcludeLevels?.has(node.level))) && (!hideActionButton || allowedEdit)) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.addNew\"\n                [title]=\"labels.addNew\"\n                (click)=\"invokeRowActionAddNew(node, column)\">\n\n                <i class=\"bi bi-plus\"></i>\n            </button>\n        }\n\n        <!-- View Button Status -->\n        @if (cellRendererParams?.viewButtonStatus == 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [attr.aria-label]=\"labels.view\"\n                [title]=\"labels.view\"\n                (click)=\"invokeRowActionView(node, column)\">\n\n                <i class=\"bi bi-eye\"></i>\n            </button>\n        }\n        @if (cellRendererParams?.locationButtonStatus == 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [attr.aria-label]=\"labels.location\"\n                [title]=\"labels.location\"\n                (click)=\"invokeRowActionLocation(node, column)\">\n\n                <i class=\"bi bi-geo-alt\"></i>\n            </button>\n        }\n\n        <!-- Document Button Status -->\n        @if (cellRendererParams?.documentButtonStatus == 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [attr.aria-label]=\"labels.document\"\n                [title]=\"labels.document\"\n                (click)=\"invokeRowActionDocument(node, column)\">\n\n                <i class=\"bi bi-file-earmark-text\"></i>\n            </button>\n        }\n\n        <!-- Copy Button Status -->\n        @if (cellRendererParams?.copyButtonStatus == 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [attr.aria-label]=\"labels.copy\"\n                [title]=\"labels.copy\"\n                (click)=\"invokeRowActionCopy(node, column)\">\n\n                <i class=\"bi bi-files\"></i>\n            </button>\n        }\n\n\n        <!-- Delete Button Status -->\n         @if (cellRendererParams?.deleteButtonStatus == 1 && (!hideActionButton || allowedEdit)) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-danger\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.delete\"\n                [title]=\"labels.delete\"\n                (click)=\"invokeRowActionDelete(node, column)\">\n\n                <i class=\"bi bi-trash3\"></i>\n            </button>\n        }\n\n        <!-- Goto List Button Status -->\n        @if ((cellRendererParams?.gotoListButtonStatus === 1 && !(gotoListExcludeLevels?.has(node.level))) && (!hideActionButton || allowedEdit)) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-success\"\n                [attr.aria-label]=\"labels.gotoList\"\n                [title]=\"labels.gotoList\"\n                (click)=\"invokeRowActionGotoList(node, column)\">\n\n                <i class=\"bi bi-list-ul\"></i>\n            </button>\n        }\n\n        <!-- Edit Button Status -->\n        @if (cellRendererParams?.editButtonStatus === 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.edit\"\n                [title]=\"labels.edit\"\n                (click)=\"invokeRowActionEdit(node, column)\">\n\n                <i class=\"bi bi-pencil\"></i>\n            </button>\n        }\n\n        <!-- Print Button Status -->\n        @if (cellRendererParams?.printButtonStatus === 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.print\"\n                [title]=\"labels.print\"\n                (click)=\"invokeRowActionPrint(node, column)\">\n\n                <i class=\"bi bi-printer\"></i>\n            </button>\n        }\n\n        <!-- History Button Status -->\n        @if (cellRendererParams?.historyButtonStatus === 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.history\"\n                [title]=\"labels.history\"\n                (click)=\"invokeRowActionHistory(node, column)\">\n\n                <i class=\"bi bi-clock-history\"></i>\n            </button>\n        }\n\n        <!-- Option Button Status -->\n        @if (cellRendererParams?.optionButtonStatus === 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.option\"\n                [title]=\"labels.option\"\n                (click)=\"invokeRowActionOption(node, column)\">\n\n                <i class=\"bi bi-three-dots-vertical\"></i>\n            </button>\n        }\n\n        <!-- Language Button Status -->\n        @if (cellRendererParams?.languageButtonStatus === 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.language\"\n                [title]=\"labels.language\"\n                (click)=\"invokeRowActionLanguage(node, column)\">\n\n                <i class=\"bi bi-translate\"></i>\n            </button>\n        }\n\n        <!-- Cell Option Button Status (Context Menu) -->\n        @if (cellRendererParams?.cellOptionButtonStatus === 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary border-0 text-body\"\n                [style.background]=\"'transparent'\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.cellOption\"\n                [title]=\"labels.cellOption\"\n                (click)=\"invokeRowActionCellOption(node, column)\">\n\n                <i class=\"bi bi-three-dots-vertical\"></i>\n            </button>\n        }\n    </div>\n}", styles: [""], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: OneGridRowActionComponent, decorators: [{
             type: Component,
-            args: [{ standalone: true, imports: [NgClass], selector: 'one-grid-row-action', template: "@if ((cellRendererParams && node?.leaf && !column?.autoGroupField && !(node.group && node.leafGroup)) || (column?.rowActionLevels?.includes(node.level) && column?.autoGroupField)) {\n    <div class=\"btn-action-container\">\n\n        <!-- Expansion Button Status -->\n         @if ((cellRendererParams?.detailActiveButtonStatus == 1 && !(detailActiveExcludeLevels?.has(node.level)))) {\n            <!-- A button, not an <a> with a click handler: it has no href, so\n                 it was neither focusable nor operable from the keyboard. -->\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-plain me-2\"\n                [attr.aria-expanded]=\"node.detailActive\"\n                [attr.aria-label]=\"node.detailActive ? 'Collapse row' : 'Expand row'\"\n                [title]=\"node.detailActive ? 'Collapse' : 'Expand'\"\n                (click)=\"invokeRowToggleDetailActiveExpand(node)\">\n\n                <i class=\"bi\" [ngClass]=\"{ 'bi-chevron-down': node.detailActive, 'bi-chevron-right': !node.detailActive }\"></i>\n            </button>\n        }\n\n        <!-- Goto Detail Button Status -->\n        @if ((cellRendererParams?.gotoDetailButtonStatus == 1 && !(gotoDetailExcludeLevels?.has(node.level))) && (!hideActionButton || allowedEdit)) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [attr.aria-label]=\"labels.gotoDetail\"\n                [title]=\"labels.gotoDetail\"\n                (click)=\"invokeRowActionGotoDetail(node, column)\">\n\n                <i class=\"bi bi-list-task\"></i>\n            </button>\n        }\n\n        <!-- Add New Button Status -->\n        @if ((cellRendererParams?.addNewButtonStatus == 1 && !(addNewExcludeLevels?.has(node.level))) && (!hideActionButton || allowedEdit)) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.addNew\"\n                [title]=\"labels.addNew\"\n                (click)=\"invokeRowActionAddNew(node, column)\">\n\n                <i class=\"bi bi-plus\"></i>\n            </button>\n        }\n\n        <!-- View Button Status -->\n        @if (cellRendererParams?.viewButtonStatus == 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [attr.aria-label]=\"labels.view\"\n                [title]=\"labels.view\"\n                (click)=\"invokeRowActionView(node, column)\">\n\n                <i class=\"bi bi-eye\"></i>\n            </button>\n        }\n        @if (cellRendererParams?.locationButtonStatus == 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [attr.aria-label]=\"labels.location\"\n                [title]=\"labels.location\"\n                (click)=\"invokeRowActionLocation(node, column)\">\n\n                <i class=\"bi bi-geo-alt\"></i>\n            </button>\n        }\n\n        <!-- Document Button Status -->\n        @if (cellRendererParams?.documentButtonStatus == 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [attr.aria-label]=\"labels.document\"\n                [title]=\"labels.document\"\n                (click)=\"invokeRowActionDocument(node, column)\">\n\n                <i class=\"bi bi-file-earmark-text\"></i>\n            </button>\n        }\n\n        <!-- Copy Button Status -->\n        @if (cellRendererParams?.copyButtonStatus == 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [attr.aria-label]=\"labels.copy\"\n                [title]=\"labels.copy\"\n                (click)=\"invokeRowActionCopy(node, column)\">\n\n                <i class=\"bi bi-files\"></i>\n            </button>\n        }\n\n\n        <!-- Delete Button Status -->\n         @if (cellRendererParams?.deleteButtonStatus == 1 && (!hideActionButton || allowedEdit)) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-danger\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.delete\"\n                [title]=\"labels.delete\"\n                (click)=\"invokeRowActionDelete(node, column)\">\n\n                <i class=\"bi bi-trash3\"></i>\n            </button>\n        }\n\n        <!-- Goto List Button Status -->\n        @if (cellRendererParams?.gotoListButtonStatus === 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-success\"\n                [attr.aria-label]=\"labels.gotoList\"\n                [title]=\"labels.gotoList\"\n                (click)=\"invokeRowActionGotoList(node, column)\">\n\n                <i class=\"bi bi-list-ul\"></i>\n            </button>\n        }\n\n        <!-- Edit Button Status -->\n        @if (cellRendererParams?.editButtonStatus === 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.edit\"\n                [title]=\"labels.edit\"\n                (click)=\"invokeRowActionEdit(node, column)\">\n\n                <i class=\"bi bi-pencil\"></i>\n            </button>\n        }\n\n        <!-- Print Button Status -->\n        @if (cellRendererParams?.printButtonStatus === 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.print\"\n                [title]=\"labels.print\"\n                (click)=\"invokeRowActionPrint(node, column)\">\n\n                <i class=\"bi bi-printer\"></i>\n            </button>\n        }\n\n        <!-- History Button Status -->\n        @if (cellRendererParams?.historyButtonStatus === 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.history\"\n                [title]=\"labels.history\"\n                (click)=\"invokeRowActionHistory(node, column)\">\n\n                <i class=\"bi bi-clock-history\"></i>\n            </button>\n        }\n\n        <!-- Option Button Status -->\n        @if (cellRendererParams?.optionButtonStatus === 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.option\"\n                [title]=\"labels.option\"\n                (click)=\"invokeRowActionOption(node, column)\">\n\n                <i class=\"bi bi-three-dots-vertical\"></i>\n            </button>\n        }\n\n        <!-- Language Button Status -->\n        @if (cellRendererParams?.languageButtonStatus === 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.language\"\n                [title]=\"labels.language\"\n                (click)=\"invokeRowActionLanguage(node, column)\">\n\n                <i class=\"bi bi-translate\"></i>\n            </button>\n        }\n\n        <!-- Cell Optoion Button Status (Context Menu) -->\n        @if (cellRendererParams?.cellOptionButtonStatus === 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary border-0 text-body\"\n                [style.background]=\"'transparent'\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.cellOption\"\n                [title]=\"labels.cellOption\"\n                (click)=\"invokeRowActionCellOption(node, column)\">\n\n                <i class=\"bi bi-three-dots-vertical\"></i>\n            </button>\n        }\n    </div>\n}" }]
+            args: [{ standalone: true, imports: [NgClass], selector: 'one-grid-row-action', template: "@if ((cellRendererParams && node?.leaf && !column?.autoGroupField && !(node.group && node.leafGroup)) || (column?.rowActionLevels?.includes(node.level) && column?.autoGroupField)) {\n    <div class=\"btn-action-container\">\n\n        <!-- Expansion Button Status -->\n         @if ((cellRendererParams?.detailActiveButtonStatus == 1 && !(detailActiveExcludeLevels?.has(node.level)))) {\n            <!-- A button, not an <a> with a click handler: it has no href, so\n                 it was neither focusable nor operable from the keyboard. -->\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-plain me-2\"\n                [attr.aria-expanded]=\"node.detailActive\"\n                [attr.aria-label]=\"node.detailActive ? 'Collapse row' : 'Expand row'\"\n                [title]=\"node.detailActive ? 'Collapse' : 'Expand'\"\n                (click)=\"invokeRowToggleDetailActiveExpand(node)\">\n\n                <i class=\"bi\" [ngClass]=\"{ 'bi-chevron-down': node.detailActive, 'bi-chevron-right': !node.detailActive }\"></i>\n            </button>\n        }\n\n        <!-- Goto Detail Button Status -->\n        @if ((cellRendererParams?.gotoDetailButtonStatus == 1 && !(gotoDetailExcludeLevels?.has(node.level))) && (!hideActionButton || allowedEdit)) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [attr.aria-label]=\"labels.gotoDetail\"\n                [title]=\"labels.gotoDetail\"\n                (click)=\"invokeRowActionGotoDetail(node, column)\">\n\n                <i class=\"bi bi-list-task\"></i>\n            </button>\n        }\n\n        <!-- Add New Button Status -->\n        @if ((cellRendererParams?.addNewButtonStatus == 1 && !(addNewExcludeLevels?.has(node.level))) && (!hideActionButton || allowedEdit)) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.addNew\"\n                [title]=\"labels.addNew\"\n                (click)=\"invokeRowActionAddNew(node, column)\">\n\n                <i class=\"bi bi-plus\"></i>\n            </button>\n        }\n\n        <!-- View Button Status -->\n        @if (cellRendererParams?.viewButtonStatus == 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [attr.aria-label]=\"labels.view\"\n                [title]=\"labels.view\"\n                (click)=\"invokeRowActionView(node, column)\">\n\n                <i class=\"bi bi-eye\"></i>\n            </button>\n        }\n        @if (cellRendererParams?.locationButtonStatus == 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [attr.aria-label]=\"labels.location\"\n                [title]=\"labels.location\"\n                (click)=\"invokeRowActionLocation(node, column)\">\n\n                <i class=\"bi bi-geo-alt\"></i>\n            </button>\n        }\n\n        <!-- Document Button Status -->\n        @if (cellRendererParams?.documentButtonStatus == 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [attr.aria-label]=\"labels.document\"\n                [title]=\"labels.document\"\n                (click)=\"invokeRowActionDocument(node, column)\">\n\n                <i class=\"bi bi-file-earmark-text\"></i>\n            </button>\n        }\n\n        <!-- Copy Button Status -->\n        @if (cellRendererParams?.copyButtonStatus == 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [attr.aria-label]=\"labels.copy\"\n                [title]=\"labels.copy\"\n                (click)=\"invokeRowActionCopy(node, column)\">\n\n                <i class=\"bi bi-files\"></i>\n            </button>\n        }\n\n\n        <!-- Delete Button Status -->\n         @if (cellRendererParams?.deleteButtonStatus == 1 && (!hideActionButton || allowedEdit)) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-danger\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.delete\"\n                [title]=\"labels.delete\"\n                (click)=\"invokeRowActionDelete(node, column)\">\n\n                <i class=\"bi bi-trash3\"></i>\n            </button>\n        }\n\n        <!-- Goto List Button Status -->\n        @if ((cellRendererParams?.gotoListButtonStatus === 1 && !(gotoListExcludeLevels?.has(node.level))) && (!hideActionButton || allowedEdit)) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-success\"\n                [attr.aria-label]=\"labels.gotoList\"\n                [title]=\"labels.gotoList\"\n                (click)=\"invokeRowActionGotoList(node, column)\">\n\n                <i class=\"bi bi-list-ul\"></i>\n            </button>\n        }\n\n        <!-- Edit Button Status -->\n        @if (cellRendererParams?.editButtonStatus === 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.edit\"\n                [title]=\"labels.edit\"\n                (click)=\"invokeRowActionEdit(node, column)\">\n\n                <i class=\"bi bi-pencil\"></i>\n            </button>\n        }\n\n        <!-- Print Button Status -->\n        @if (cellRendererParams?.printButtonStatus === 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.print\"\n                [title]=\"labels.print\"\n                (click)=\"invokeRowActionPrint(node, column)\">\n\n                <i class=\"bi bi-printer\"></i>\n            </button>\n        }\n\n        <!-- History Button Status -->\n        @if (cellRendererParams?.historyButtonStatus === 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.history\"\n                [title]=\"labels.history\"\n                (click)=\"invokeRowActionHistory(node, column)\">\n\n                <i class=\"bi bi-clock-history\"></i>\n            </button>\n        }\n\n        <!-- Option Button Status -->\n        @if (cellRendererParams?.optionButtonStatus === 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.option\"\n                [title]=\"labels.option\"\n                (click)=\"invokeRowActionOption(node, column)\">\n\n                <i class=\"bi bi-three-dots-vertical\"></i>\n            </button>\n        }\n\n        <!-- Language Button Status -->\n        @if (cellRendererParams?.languageButtonStatus === 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.language\"\n                [title]=\"labels.language\"\n                (click)=\"invokeRowActionLanguage(node, column)\">\n\n                <i class=\"bi bi-translate\"></i>\n            </button>\n        }\n\n        <!-- Cell Option Button Status (Context Menu) -->\n        @if (cellRendererParams?.cellOptionButtonStatus === 1) {\n            <button\n                type=\"button\"\n                class=\"btn-action btn-action-primary border-0 text-body\"\n                [style.background]=\"'transparent'\"\n                [class.disabled]=\"actionDisabled\"\n                [disabled]=\"actionDisabled\"\n                [attr.aria-label]=\"labels.cellOption\"\n                [title]=\"labels.cellOption\"\n                (click)=\"invokeRowActionCellOption(node, column)\">\n\n                <i class=\"bi bi-three-dots-vertical\"></i>\n            </button>\n        }\n    </div>\n}" }]
         }], ctorParameters: () => [{ type: OneGridCellService }], propDecorators: { column: [{
                 type: Input,
                 args: [{ required: true }]
@@ -4137,15 +4227,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
                 type: Input,
                 args: [{ required: true }]
             }], masterDetail: [{
-                type: Input
+                type: Input,
+                args: [{ required: false }]
             }], masterNode: [{
-                type: Input
+                type: Input,
+                args: [{ required: false }]
             }], cellRendererParams: [{
-                type: Input
+                type: Input,
+                args: [{ required: false }]
             }], gridType: [{
-                type: Input
+                type: Input,
+                args: [{ required: false }]
             }], context: [{
-                type: Input
+                type: Input,
+                args: [{ required: false }]
             }], onRowGotoDetail: [{
                 type: Output
             }], onRowAddNew: [{
@@ -6106,6 +6201,20 @@ class OneGridComponent {
         this.bodyScrollLeft = 0;
         this._oneRowNumberColumnDef = null;
         this.subscriptions = new Subscription();
+        /**
+         * Row grouping, as the grid sees it.
+         *
+         * The three `_host*` fields hold what was bound before grouping touched
+         * anything, because grouping is reversible: turn it off and the columns,
+         * the group column and the grid type all have to go back to what the host
+         * asked for. `_appliedGroupFields` is the grouping the registered columns
+         * currently reflect — the row model's copy lives in `api.rowGroupFields`.
+         */
+        this._hostColumnDefs = [];
+        this._hostAutoGroupColumnDef = null;
+        this._hostGridType = 'master';
+        this._hostTreeData = false;
+        this._appliedGroupFields = [];
         /**
          * Totals for `aria-rowcount` / `aria-colcount`.
          *
@@ -6164,29 +6273,25 @@ class OneGridComponent {
          * tree over synthetic group rows. Configured before `api.init` because
          * everything downstream — the treeData flag the API captures, the group
          * column the tree block below prepends — has to see the tree shape.
+         *
+         * What the host declared is kept as it was given: regrouping at runtime
+         * re-derives the registered columns from it, so a column hidden because
+         * it was grouped comes back when it stops being, and one the host hid
+         * itself stays hidden.
          */
+        this._hostColumnDefs = this.columnDefs ?? [];
+        this._hostAutoGroupColumnDef = this.autoGroupColumnDef;
+        this._hostGridType = this.gridType;
+        this._hostTreeData = this.treeData;
         const rowGroupColumnFields = this.treeData || this.masterDetail
             ? []
             : rowGroupFields(this.columnDefs);
         if (rowGroupColumnFields.length) {
+            this._appliedGroupFields = rowGroupColumnFields;
             this.treeData = true;
             this.treeDataChildrenField = ONE_GROUP_CHILDREN_FIELD;
-            // The group column: host-tuned through autoGroupColumnDef, but its
-            // field is always the synthetic label — that is where a group row
-            // carries its display value.
-            this.autoGroupColumnDef = {
-                headerName: 'Group',
-                minWidth: 200,
-                ...this.autoGroupColumnDef,
-                field: ONE_GROUP_VALUE_FIELD,
-                // The marker the tree machinery keys on: the expander renders on this
-                // column and group rows print their label here.
-                autoGroupField: true,
-            };
-            // A grouped-by column's value is on the group row; showing the flat
-            // column too repeats it down every leaf. Hidden, not removed — the
-            // host can bring it back with api.setColumnVisible.
-            this.columnDefs = this.columnDefs.map(column => column.rowGroup ? { ...column, hide: true } : column);
+            this.autoGroupColumnDef = this.buildAutoGroupColumnDef();
+            this.columnDefs = this.groupedColumnDefs(rowGroupColumnFields);
         }
         /**
          * Initialize One Grid API
@@ -6201,11 +6306,21 @@ class OneGridComponent {
             masterDetail: this.masterDetail,
             detailCellRendererParams: this.detailCellRendererParams,
             detailRendererComponent: this.detailRendererComponent,
-            treeData: this.treeData,
+            // The host's own tree data, not the tree grouping builds: `setRowGrouping`
+            // turns that on below, and the API has to be able to tell whose tree it
+            // is before it may replace one.
+            treeData: this._hostTreeData,
         });
         if (rowGroupColumnFields.length) {
             this.api.setRowGrouping(rowGroupColumnFields, aggColumns(this.columnDefs));
         }
+        // Regrouping at runtime. `api.setRowGrouping` owns the row model half of
+        // the switch; this is the other half — the columns the grid registers and
+        // the shape the body renders. Subscribed after the initial call above,
+        // which `ngOnInit` has already applied.
+        this.subscriptions.add(this.eventService.addEventListener('rowGroupingChanged', (payload) => {
+            this.applyRowGroupingColumns(payload.groupFields);
+        }));
         if (this.undoRedoCellEditing) {
             this.api.enableUndoRedoCellEditing(this.undoRedoCellEditingLimit);
         }
@@ -6219,7 +6334,7 @@ class OneGridComponent {
             this.api.setGroupDefaultExpanded(this.groupDefaultExpanded);
             this.api.setGetDetailRowData(this.detailCellRendererParams?.getDetailRowData ?? null);
             if (this.rowNumber) {
-                const columnDefs = _.concat(this._oneRowNumberColumnDef, this.columnDefs);
+                const columnDefs = lodash.concat(this._oneRowNumberColumnDef, this.columnDefs);
                 setTimeout(() => this.api.setColumnDefs(columnDefs));
             }
         }
@@ -6228,10 +6343,9 @@ class OneGridComponent {
          */
         if (this.treeData) {
             this.gridType = 'tree';
-            const columnDefs = this.rowNumber ? _.concat(this._oneRowNumberColumnDef, this.autoGroupColumnDef, this.columnDefs) : _.concat(this.autoGroupColumnDef, this.columnDefs);
             this.api.setTreeDataChildrenField(this.treeDataChildrenField);
             this.api.setGroupDefaultExpanded(this.groupDefaultExpanded);
-            setTimeout(() => this.api.setColumnDefs(columnDefs));
+            setTimeout(() => this.api.setColumnDefs(this.columnStack()));
         }
         // Listen Selection Changed Event
         // Columns can be replaced at runtime through `api.setColumnDefs`, and
@@ -6257,6 +6371,69 @@ class OneGridComponent {
             this.columnResized.emit(payload);
         }));
     }
+    /**
+     * The group column: host-tuned through `autoGroupColumnDef`, but its field
+     * is always the synthetic label — that is where a group row carries its
+     * display value — and it always carries the marker the tree machinery keys
+     * on, which is what puts the expander on this column.
+     */
+    buildAutoGroupColumnDef() {
+        return {
+            headerName: 'Group',
+            minWidth: 200,
+            ...this._hostAutoGroupColumnDef,
+            field: ONE_GROUP_VALUE_FIELD,
+            autoGroupField: true,
+        };
+    }
+    /**
+     * The host's columns with the grouped-by ones hidden.
+     *
+     * A grouped-by column's value is on the group row; showing the flat column
+     * too repeats it down every leaf. Hidden, not removed — the host can bring
+     * one back with `api.setColumnVisible`, and ungrouping restores whatever
+     * visibility the host itself declared.
+     */
+    groupedColumnDefs(groupFields) {
+        return this._hostColumnDefs.map(column => column.field && groupFields.includes(column.field) ? { ...column, hide: true } : column);
+    }
+    /** The columns the grid registers: row numbers, the group column, the host's. */
+    columnStack() {
+        return lodash.compact([
+            this.rowNumber ? this._oneRowNumberColumnDef : null,
+            this.treeData ? this.autoGroupColumnDef : null,
+            ...this.columnDefs,
+        ]);
+    }
+    /**
+     * Re-plumb everything grouping owns outside the row model: tree mode, the
+     * children field, the group column, and which of the host's columns are
+     * hidden because their value now shows on a group row.
+     *
+     * Driven by `rowGroupingChanged`, so a host regroups through one call —
+     * `api.setRowGrouping(['country', 'city'])` — instead of re-creating the
+     * grid. Grouping and host tree data are mutually exclusive, which the API
+     * enforces, so this only ever switches a tree that grouping itself built.
+     */
+    applyRowGroupingColumns(groupFields) {
+        const unchanged = groupFields.length === this._appliedGroupFields.length
+            && groupFields.every((field, index) => field === this._appliedGroupFields[index]);
+        if (unchanged)
+            return;
+        const grouping = groupFields.length > 0;
+        this._appliedGroupFields = [...groupFields];
+        this.treeData = grouping;
+        this.treeDataChildrenField = grouping ? ONE_GROUP_CHILDREN_FIELD : null;
+        this.gridType = grouping ? 'tree' : this._hostGridType;
+        this.autoGroupColumnDef = grouping ? this.buildAutoGroupColumnDef() : this._hostAutoGroupColumnDef;
+        this.columnDefs = this.groupedColumnDefs(groupFields);
+        this.api.setGroupDefaultExpanded(this.groupDefaultExpanded);
+        this.api.setColumnDefs(this.columnStack());
+        // The grid type, the tree flag and the group column are all rendered
+        // through bindings, and this runs from an event rather than from a
+        // template callback.
+        this.cdr.markForCheck();
+    }
     ngAfterViewInit() {
         // The header follows the body through (bodyScroll) -> [scrollLeft]. A second
         // subscription used to live here that queried '.one-grid-header-column' — a