@procore/data-table 14.37.0 → 14.38.0

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # Change Log
 
+## 14.38.0
+
+### Minor Changes
+
+- 7576619: Allowing parent row to be editable when using grouping with `DataTable.Table enableGroupHeaderEdit`
+
+### Patch Changes
+
+- 5be31e3: AutoGroupCell fix - adds flex-shrink: 0 to account for default svg behavior
+
 ## 14.37.0
 
 ### Minor Changes

package/dist/legacy/index.cjs

@@ -54660,6 +54660,33 @@ function SingleSelectFilterRenderer({
   );
 }
 
+// src/utils/columnEditableHelpers.ts
+function createColumnEditableUtils(options) {
+  return {
+    overrideEditable: (columnEditable) => {
+      return (params) => {
+        var _a;
+        const isGroupNodeExpanded = params.node.group && params.node.expanded;
+        if (((_a = params.node) == null ? void 0 : _a.rowPinned) || !options.enableGroupHeaderEdit && isGroupNodeExpanded && !params.node.footer) {
+          return false;
+        }
+        if (typeof columnEditable === "boolean") {
+          return columnEditable;
+        }
+        return (columnEditable == null ? void 0 : columnEditable(params)) ?? false;
+      };
+    }
+  };
+}
+function isColumnEditable(columnEditable) {
+  return (params) => {
+    if (typeof columnEditable === "boolean") {
+      return columnEditable;
+    }
+    return (columnEditable == null ? void 0 : columnEditable(params)) ?? false;
+  };
+}
+
 // src/utils/transformers.ts
 var emptyObject = {};
 var DEFAULT_AUTO_GROUP_COLUMN_DEFINITION = {
@@ -54743,24 +54770,12 @@ function transformToColumnDefinition(colDef = emptyObject) {
     valueSetter: colDef.valueSetter
   };
 }
-function isEditable(columnEditable) {
-  return (params) => {
-    var _a;
-    if (((_a = params.node) == null ? void 0 : _a.rowPinned) || params.node.group && params.node.expanded && !params.node.footer) {
-      return false;
-    }
-    if (typeof columnEditable === "boolean") {
-      return columnEditable;
-    }
-    return (columnEditable == null ? void 0 : columnEditable(params)) ?? false;
-  };
-}
 function shouldHaveEditStyles(params) {
   var _a;
   if (!((_a = params.colDef) == null ? void 0 : _a.cellEditor)) {
     return false;
   }
-  return isEditable(params.colDef.editable);
+  return isColumnEditable(params.colDef.editable);
 }
 var toExcelCellClass = (className) => `excel-export--${className}`;
 function transformToExcelStyles(excelDataFormats) {
@@ -54885,11 +54900,11 @@ function transformColumnDefinitionToColDef(dataTableColumnDefinition, enableGrou
       parentData: context == null ? void 0 : context.parentData,
       parentId: context == null ? void 0 : context.parentId
     }) : aggFunc,
-    bulkEditable: isEditable(bulkEditable),
+    bulkEditable: isColumnEditable(bulkEditable),
     cellClass: cellExcelDataType ? toExcelCellClass(cellExcelDataType) : void 0,
     cellClassRules,
     comparator,
-    editable: isEditable(_editable),
+    editable: isColumnEditable(_editable),
     filter: getFilter(dataTableColumnDefinition),
     // set filter by default
     filterParams: {
@@ -55214,12 +55229,12 @@ function getDecoratedAutoGroupColDef(columnDefinition, enableGroupEditAndValidat
 }
 
 // src/CellRenderers/AutoGroupCell.scss
-var css5 = `._autoGroupCell_pq41h_1 {
+var css5 = `._autoGroupCell_1qx8z_1 {
   height: 100%;
   width: 100%;
 }
 
-._indent_pq41h_6 {
+._indent_1qx8z_6 {
   border-right: 1px solid #d6dadc;
   background: #f4f5f6;
   position: absolute;
@@ -55227,44 +55242,45 @@ var css5 = `._autoGroupCell_pq41h_1 {
   bottom: -1px;
   width: 12px;
 }
-._indent_pq41h_6._innermostLastIndent_pq41h_14 {
+._indent_1qx8z_6._innermostLastIndent_1qx8z_14 {
   bottom: 0px;
 }
 
-._expandableCaret_pq41h_18 {
+._expandableCaret_1qx8z_18 {
   margin-left: -8px;
   margin-right: 4px;
   width: 24px;
+  flex-shrink: 0;
 }
 
-._expandCaret_pq41h_24 {
+._expandCaret_1qx8z_25 {
   color: #2066df;
   cursor: pointer;
 }
 
-._collapseCaret_pq41h_29 {
+._collapseCaret_1qx8z_30 {
   color: #75838a;
   cursor: pointer;
 }
 
-._value_pq41h_34 {
+._value_1qx8z_35 {
   overflow: hidden;
   text-overflow: ellipsis;
   font-size: 12px;
 }
-._value_pq41h_34._footer_pq41h_39 {
+._value_1qx8z_35._footer_1qx8z_40 {
   color: #6a767c;
 }`;
 document.head.appendChild(document.createElement("style")).appendChild(document.createTextNode(css5));
 var AutoGroupCell_default = {
-  "autoGroupCell": "_autoGroupCell_pq41h_1",
-  "indent": "_indent_pq41h_6",
-  "innermostLastIndent": "_innermostLastIndent_pq41h_14",
-  "expandableCaret": "_expandableCaret_pq41h_18",
-  "expandCaret": "_expandCaret_pq41h_24",
-  "collapseCaret": "_collapseCaret_pq41h_29",
-  "value": "_value_pq41h_34",
-  "footer": "_footer_pq41h_39"
+  "autoGroupCell": "_autoGroupCell_1qx8z_1",
+  "indent": "_indent_1qx8z_6",
+  "innermostLastIndent": "_innermostLastIndent_1qx8z_14",
+  "expandableCaret": "_expandableCaret_1qx8z_18",
+  "expandCaret": "_expandCaret_1qx8z_25",
+  "collapseCaret": "_collapseCaret_1qx8z_30",
+  "value": "_value_1qx8z_35",
+  "footer": "_footer_1qx8z_40"
 };
 
 // src/utils/rowSelectionHelpers.ts
@@ -76375,12 +76391,12 @@ var MenuItemMapper = class MenuItemMapper2 extends BeanStub {
         if (ModuleRegistry.__assertRegistered(ModuleNames.ClipboardModule, "Cut from Menu", this.context.getGridId())) {
           const focusedCell = this.focusService.getFocusedCell();
           const rowNode = focusedCell ? this.rowPositionUtils.getRowNode(focusedCell) : null;
-          const isEditable2 = rowNode ? focusedCell === null || focusedCell === void 0 ? void 0 : focusedCell.column.isCellEditable(rowNode) : false;
+          const isEditable = rowNode ? focusedCell === null || focusedCell === void 0 ? void 0 : focusedCell.column.isCellEditable(rowNode) : false;
           return {
             name: localeTextFunc("cut", "Cut"),
             shortcut: localeTextFunc("ctrlX", "Ctrl+X"),
             icon: _.createIconNoSpan("clipboardCut", this.gridOptionsService, null),
-            disabled: !isEditable2 || this.gridOptionsService.is("suppressCutToClipboard"),
+            disabled: !isEditable || this.gridOptionsService.is("suppressCutToClipboard"),
             action: () => this.clipboardService.cutToClipboard(void 0, "contextMenu")
           };
         } else {
@@ -109308,6 +109324,20 @@ function getServerSideDatasource(onServerSideDataRequestCallbackRef, onEmptyResp
   };
 }
 var minimumColumnWidth = 140;
+function useComputeAgGridProps(props) {
+  const internalTableContext = useInternalTableContext();
+  const onSSDR = internalTableContext.onServerSideDataRequest;
+  return {
+    groupIncludeFooter: !onSSDR && props.groupIncludeFooter === void 0 ? true : props.groupIncludeFooter,
+    rowDragManaged: onSSDR ? false : props.rowDragManaged ?? true,
+    rowModelType: onSSDR ? "serverSide" : void 0,
+    groupSelectsChildren: (
+      // Always true for client side, defaults to true for server side
+      internalTableContext.totalRowCount > 0 && props.groupSelectsChildren !== false || !onSSDR
+    ),
+    groupDefaultExpanded: props.groupsAlwaysExpanded ? -1 : props.groupDefaultExpanded
+  };
+}
 var Table = (props) => {
   var _a, _b, _c;
   const { suppressColumnVirtualisation = true, rowActionsConfig = {} } = props;
@@ -109358,16 +109388,30 @@ var Table = (props) => {
   React80__default.default.useImperativeHandle(internalTableContext.tableRef, () => tableApi, [
     tableApi
   ]);
+  const {
+    groupIncludeFooter,
+    rowDragManaged,
+    rowModelType,
+    groupSelectsChildren,
+    groupDefaultExpanded
+  } = useComputeAgGridProps(props);
+  const { overrideEditable } = createColumnEditableUtils({
+    enableGroupHeaderEdit: props.enableGroupHeaderEdit
+  });
   const decoratedColDefs = React80__default.default.useMemo(
     () => {
       var _a2;
-      return (_a2 = internalTableContext.columnDefinitions) == null ? void 0 : _a2.map(
-        (colDef) => transformToColDef(
+      return (_a2 = internalTableContext.columnDefinitions) == null ? void 0 : _a2.map((colDef) => {
+        const newColDef = transformToColDef(
           colDef,
           internalTableContext.enableGroupEditAndValidation,
           internalTableContext.enableDynamicRowHeight
-        )
-      );
+        );
+        return {
+          ...newColDef,
+          editable: overrideEditable(colDef.editable)
+        };
+      });
     },
     [internalTableContext.columnDefinitions]
   );
@@ -110139,13 +110183,10 @@ var Table = (props) => {
           getRowId: internalTableContext.getRowId,
           getRowStyle,
           groupAllowUnbalanced: true,
-          groupDefaultExpanded: props.groupsAlwaysExpanded ? -1 : props.groupDefaultExpanded,
-          groupIncludeFooter: !onSSDR && props.groupIncludeFooter === void 0 ? true : props.groupIncludeFooter,
+          groupDefaultExpanded,
+          groupIncludeFooter,
           getGroupRowAgg: props.getGroupRowAgg ? getGroupRowAgg : void 0,
-          groupSelectsChildren: (
-            // Always true for client side, defaults to true for server side
-            internalTableContext.totalRowCount > 0 && props.groupSelectsChildren !== false || !onSSDR
-          ),
+          groupSelectsChildren,
           groupSelectsFiltered: true,
           headerHeight: props.headerHeight,
           icons: tableIcons,
@@ -110203,8 +110244,8 @@ var Table = (props) => {
           pinnedBottomRowData: props.pinnedBottomRowData,
           rowBuffer: props.rowBuffer,
           rowClassRules,
-          rowDragManaged: onSSDR ? false : props.rowDragManaged ?? true,
-          rowModelType: onSSDR ? "serverSide" : void 0,
+          rowDragManaged,
+          rowModelType,
           rowSelection: "multiple",
           ...serverSideInfiniteScroll,
           suppressClickEdit: true,

package/dist/legacy/index.d.cts

@@ -992,6 +992,7 @@ interface TableProps<TRow = any, TBottomRow = any> {
     groupsAlwaysExpanded?: boolean;
     groupDefaultExpanded?: number;
     groupIncludeFooter?: boolean;
+    enableGroupHeaderEdit?: boolean;
     groupSelectsChildren?: boolean;
     headerHeight?: number;
     hideActionsOnGroupedRow?: boolean;

package/dist/legacy/index.d.ts

@@ -992,6 +992,7 @@ interface TableProps<TRow = any, TBottomRow = any> {
     groupsAlwaysExpanded?: boolean;
     groupDefaultExpanded?: number;
     groupIncludeFooter?: boolean;
+    enableGroupHeaderEdit?: boolean;
     groupSelectsChildren?: boolean;
     headerHeight?: number;
     hideActionsOnGroupedRow?: boolean;

package/dist/legacy/index.js

@@ -54647,6 +54647,33 @@ function SingleSelectFilterRenderer({
   );
 }
 
+// src/utils/columnEditableHelpers.ts
+function createColumnEditableUtils(options) {
+  return {
+    overrideEditable: (columnEditable) => {
+      return (params) => {
+        var _a;
+        const isGroupNodeExpanded = params.node.group && params.node.expanded;
+        if (((_a = params.node) == null ? void 0 : _a.rowPinned) || !options.enableGroupHeaderEdit && isGroupNodeExpanded && !params.node.footer) {
+          return false;
+        }
+        if (typeof columnEditable === "boolean") {
+          return columnEditable;
+        }
+        return (columnEditable == null ? void 0 : columnEditable(params)) ?? false;
+      };
+    }
+  };
+}
+function isColumnEditable(columnEditable) {
+  return (params) => {
+    if (typeof columnEditable === "boolean") {
+      return columnEditable;
+    }
+    return (columnEditable == null ? void 0 : columnEditable(params)) ?? false;
+  };
+}
+
 // src/utils/transformers.ts
 var emptyObject = {};
 var DEFAULT_AUTO_GROUP_COLUMN_DEFINITION = {
@@ -54730,24 +54757,12 @@ function transformToColumnDefinition(colDef = emptyObject) {
     valueSetter: colDef.valueSetter
   };
 }
-function isEditable(columnEditable) {
-  return (params) => {
-    var _a;
-    if (((_a = params.node) == null ? void 0 : _a.rowPinned) || params.node.group && params.node.expanded && !params.node.footer) {
-      return false;
-    }
-    if (typeof columnEditable === "boolean") {
-      return columnEditable;
-    }
-    return (columnEditable == null ? void 0 : columnEditable(params)) ?? false;
-  };
-}
 function shouldHaveEditStyles(params) {
   var _a;
   if (!((_a = params.colDef) == null ? void 0 : _a.cellEditor)) {
     return false;
   }
-  return isEditable(params.colDef.editable);
+  return isColumnEditable(params.colDef.editable);
 }
 var toExcelCellClass = (className) => `excel-export--${className}`;
 function transformToExcelStyles(excelDataFormats) {
@@ -54872,11 +54887,11 @@ function transformColumnDefinitionToColDef(dataTableColumnDefinition, enableGrou
       parentData: context == null ? void 0 : context.parentData,
       parentId: context == null ? void 0 : context.parentId
     }) : aggFunc,
-    bulkEditable: isEditable(bulkEditable),
+    bulkEditable: isColumnEditable(bulkEditable),
     cellClass: cellExcelDataType ? toExcelCellClass(cellExcelDataType) : void 0,
     cellClassRules,
     comparator,
-    editable: isEditable(_editable),
+    editable: isColumnEditable(_editable),
     filter: getFilter(dataTableColumnDefinition),
     // set filter by default
     filterParams: {
@@ -55201,12 +55216,12 @@ function getDecoratedAutoGroupColDef(columnDefinition, enableGroupEditAndValidat
 }
 
 // src/CellRenderers/AutoGroupCell.scss
-var css5 = `._autoGroupCell_pq41h_1 {
+var css5 = `._autoGroupCell_1qx8z_1 {
   height: 100%;
   width: 100%;
 }
 
-._indent_pq41h_6 {
+._indent_1qx8z_6 {
   border-right: 1px solid #d6dadc;
   background: #f4f5f6;
   position: absolute;
@@ -55214,44 +55229,45 @@ var css5 = `._autoGroupCell_pq41h_1 {
   bottom: -1px;
   width: 12px;
 }
-._indent_pq41h_6._innermostLastIndent_pq41h_14 {
+._indent_1qx8z_6._innermostLastIndent_1qx8z_14 {
   bottom: 0px;
 }
 
-._expandableCaret_pq41h_18 {
+._expandableCaret_1qx8z_18 {
   margin-left: -8px;
   margin-right: 4px;
   width: 24px;
+  flex-shrink: 0;
 }
 
-._expandCaret_pq41h_24 {
+._expandCaret_1qx8z_25 {
   color: #2066df;
   cursor: pointer;
 }
 
-._collapseCaret_pq41h_29 {
+._collapseCaret_1qx8z_30 {
   color: #75838a;
   cursor: pointer;
 }
 
-._value_pq41h_34 {
+._value_1qx8z_35 {
   overflow: hidden;
   text-overflow: ellipsis;
   font-size: 12px;
 }
-._value_pq41h_34._footer_pq41h_39 {
+._value_1qx8z_35._footer_1qx8z_40 {
   color: #6a767c;
 }`;
 document.head.appendChild(document.createElement("style")).appendChild(document.createTextNode(css5));
 var AutoGroupCell_default = {
-  "autoGroupCell": "_autoGroupCell_pq41h_1",
-  "indent": "_indent_pq41h_6",
-  "innermostLastIndent": "_innermostLastIndent_pq41h_14",
-  "expandableCaret": "_expandableCaret_pq41h_18",
-  "expandCaret": "_expandCaret_pq41h_24",
-  "collapseCaret": "_collapseCaret_pq41h_29",
-  "value": "_value_pq41h_34",
-  "footer": "_footer_pq41h_39"
+  "autoGroupCell": "_autoGroupCell_1qx8z_1",
+  "indent": "_indent_1qx8z_6",
+  "innermostLastIndent": "_innermostLastIndent_1qx8z_14",
+  "expandableCaret": "_expandableCaret_1qx8z_18",
+  "expandCaret": "_expandCaret_1qx8z_25",
+  "collapseCaret": "_collapseCaret_1qx8z_30",
+  "value": "_value_1qx8z_35",
+  "footer": "_footer_1qx8z_40"
 };
 
 // src/utils/rowSelectionHelpers.ts
@@ -76362,12 +76378,12 @@ var MenuItemMapper = class MenuItemMapper2 extends BeanStub {
         if (ModuleRegistry.__assertRegistered(ModuleNames.ClipboardModule, "Cut from Menu", this.context.getGridId())) {
           const focusedCell = this.focusService.getFocusedCell();
           const rowNode = focusedCell ? this.rowPositionUtils.getRowNode(focusedCell) : null;
-          const isEditable2 = rowNode ? focusedCell === null || focusedCell === void 0 ? void 0 : focusedCell.column.isCellEditable(rowNode) : false;
+          const isEditable = rowNode ? focusedCell === null || focusedCell === void 0 ? void 0 : focusedCell.column.isCellEditable(rowNode) : false;
           return {
             name: localeTextFunc("cut", "Cut"),
             shortcut: localeTextFunc("ctrlX", "Ctrl+X"),
             icon: _.createIconNoSpan("clipboardCut", this.gridOptionsService, null),
-            disabled: !isEditable2 || this.gridOptionsService.is("suppressCutToClipboard"),
+            disabled: !isEditable || this.gridOptionsService.is("suppressCutToClipboard"),
             action: () => this.clipboardService.cutToClipboard(void 0, "contextMenu")
           };
         } else {
@@ -109295,6 +109311,20 @@ function getServerSideDatasource(onServerSideDataRequestCallbackRef, onEmptyResp
   };
 }
 var minimumColumnWidth = 140;
+function useComputeAgGridProps(props) {
+  const internalTableContext = useInternalTableContext();
+  const onSSDR = internalTableContext.onServerSideDataRequest;
+  return {
+    groupIncludeFooter: !onSSDR && props.groupIncludeFooter === void 0 ? true : props.groupIncludeFooter,
+    rowDragManaged: onSSDR ? false : props.rowDragManaged ?? true,
+    rowModelType: onSSDR ? "serverSide" : void 0,
+    groupSelectsChildren: (
+      // Always true for client side, defaults to true for server side
+      internalTableContext.totalRowCount > 0 && props.groupSelectsChildren !== false || !onSSDR
+    ),
+    groupDefaultExpanded: props.groupsAlwaysExpanded ? -1 : props.groupDefaultExpanded
+  };
+}
 var Table = (props) => {
   var _a, _b, _c;
   const { suppressColumnVirtualisation = true, rowActionsConfig = {} } = props;
@@ -109345,16 +109375,30 @@ var Table = (props) => {
   React80.useImperativeHandle(internalTableContext.tableRef, () => tableApi, [
     tableApi
   ]);
+  const {
+    groupIncludeFooter,
+    rowDragManaged,
+    rowModelType,
+    groupSelectsChildren,
+    groupDefaultExpanded
+  } = useComputeAgGridProps(props);
+  const { overrideEditable } = createColumnEditableUtils({
+    enableGroupHeaderEdit: props.enableGroupHeaderEdit
+  });
   const decoratedColDefs = React80.useMemo(
     () => {
       var _a2;
-      return (_a2 = internalTableContext.columnDefinitions) == null ? void 0 : _a2.map(
-        (colDef) => transformToColDef(
+      return (_a2 = internalTableContext.columnDefinitions) == null ? void 0 : _a2.map((colDef) => {
+        const newColDef = transformToColDef(
           colDef,
           internalTableContext.enableGroupEditAndValidation,
           internalTableContext.enableDynamicRowHeight
-        )
-      );
+        );
+        return {
+          ...newColDef,
+          editable: overrideEditable(colDef.editable)
+        };
+      });
     },
     [internalTableContext.columnDefinitions]
   );
@@ -110126,13 +110170,10 @@ var Table = (props) => {
           getRowId: internalTableContext.getRowId,
           getRowStyle,
           groupAllowUnbalanced: true,
-          groupDefaultExpanded: props.groupsAlwaysExpanded ? -1 : props.groupDefaultExpanded,
-          groupIncludeFooter: !onSSDR && props.groupIncludeFooter === void 0 ? true : props.groupIncludeFooter,
+          groupDefaultExpanded,
+          groupIncludeFooter,
           getGroupRowAgg: props.getGroupRowAgg ? getGroupRowAgg : void 0,
-          groupSelectsChildren: (
-            // Always true for client side, defaults to true for server side
-            internalTableContext.totalRowCount > 0 && props.groupSelectsChildren !== false || !onSSDR
-          ),
+          groupSelectsChildren,
           groupSelectsFiltered: true,
           headerHeight: props.headerHeight,
           icons: tableIcons,
@@ -110190,8 +110231,8 @@ var Table = (props) => {
           pinnedBottomRowData: props.pinnedBottomRowData,
           rowBuffer: props.rowBuffer,
           rowClassRules,
-          rowDragManaged: onSSDR ? false : props.rowDragManaged ?? true,
-          rowModelType: onSSDR ? "serverSide" : void 0,
+          rowDragManaged,
+          rowModelType,
           rowSelection: "multiple",
           ...serverSideInfiniteScroll,
           suppressClickEdit: true,

package/dist/modern/index.cjs

@@ -54615,6 +54615,32 @@ function SingleSelectFilterRenderer({
   );
 }
 
+// src/utils/columnEditableHelpers.ts
+function createColumnEditableUtils(options) {
+  return {
+    overrideEditable: (columnEditable) => {
+      return (params) => {
+        const isGroupNodeExpanded = params.node.group && params.node.expanded;
+        if (params.node?.rowPinned || !options.enableGroupHeaderEdit && isGroupNodeExpanded && !params.node.footer) {
+          return false;
+        }
+        if (typeof columnEditable === "boolean") {
+          return columnEditable;
+        }
+        return columnEditable?.(params) ?? false;
+      };
+    }
+  };
+}
+function isColumnEditable(columnEditable) {
+  return (params) => {
+    if (typeof columnEditable === "boolean") {
+      return columnEditable;
+    }
+    return columnEditable?.(params) ?? false;
+  };
+}
+
 // src/utils/transformers.ts
 var emptyObject = {};
 var DEFAULT_AUTO_GROUP_COLUMN_DEFINITION = {
@@ -54695,22 +54721,11 @@ function transformToColumnDefinition(colDef = emptyObject) {
     valueSetter: colDef.valueSetter
   };
 }
-function isEditable(columnEditable) {
-  return (params) => {
-    if (params.node?.rowPinned || params.node.group && params.node.expanded && !params.node.footer) {
-      return false;
-    }
-    if (typeof columnEditable === "boolean") {
-      return columnEditable;
-    }
-    return columnEditable?.(params) ?? false;
-  };
-}
 function shouldHaveEditStyles(params) {
   if (!params.colDef?.cellEditor) {
     return false;
   }
-  return isEditable(params.colDef.editable);
+  return isColumnEditable(params.colDef.editable);
 }
 var toExcelCellClass = (className) => `excel-export--${className}`;
 function transformToExcelStyles(excelDataFormats) {
@@ -54833,11 +54848,11 @@ function transformColumnDefinitionToColDef(dataTableColumnDefinition, enableGrou
       parentData: context?.parentData,
       parentId: context?.parentId
     }) : aggFunc,
-    bulkEditable: isEditable(bulkEditable),
+    bulkEditable: isColumnEditable(bulkEditable),
     cellClass: cellExcelDataType ? toExcelCellClass(cellExcelDataType) : void 0,
     cellClassRules,
     comparator,
-    editable: isEditable(_editable),
+    editable: isColumnEditable(_editable),
     filter: getFilter(dataTableColumnDefinition),
     // set filter by default
     filterParams: {
@@ -55158,12 +55173,12 @@ function getDecoratedAutoGroupColDef(columnDefinition, enableGroupEditAndValidat
 }
 
 // src/CellRenderers/AutoGroupCell.scss
-var css5 = `._autoGroupCell_pq41h_1 {
+var css5 = `._autoGroupCell_1qx8z_1 {
   height: 100%;
   width: 100%;
 }
 
-._indent_pq41h_6 {
+._indent_1qx8z_6 {
   border-right: 1px solid #d6dadc;
   background: #f4f5f6;
   position: absolute;
@@ -55171,44 +55186,45 @@ var css5 = `._autoGroupCell_pq41h_1 {
   bottom: -1px;
   width: 12px;
 }
-._indent_pq41h_6._innermostLastIndent_pq41h_14 {
+._indent_1qx8z_6._innermostLastIndent_1qx8z_14 {
   bottom: 0px;
 }
 
-._expandableCaret_pq41h_18 {
+._expandableCaret_1qx8z_18 {
   margin-left: -8px;
   margin-right: 4px;
   width: 24px;
+  flex-shrink: 0;
 }
 
-._expandCaret_pq41h_24 {
+._expandCaret_1qx8z_25 {
   color: #2066df;
   cursor: pointer;
 }
 
-._collapseCaret_pq41h_29 {
+._collapseCaret_1qx8z_30 {
   color: #75838a;
   cursor: pointer;
 }
 
-._value_pq41h_34 {
+._value_1qx8z_35 {
   overflow: hidden;
   text-overflow: ellipsis;
   font-size: 12px;
 }
-._value_pq41h_34._footer_pq41h_39 {
+._value_1qx8z_35._footer_1qx8z_40 {
   color: #6a767c;
 }`;
 document.head.appendChild(document.createElement("style")).appendChild(document.createTextNode(css5));
 var AutoGroupCell_default = {
-  "autoGroupCell": "_autoGroupCell_pq41h_1",
-  "indent": "_indent_pq41h_6",
-  "innermostLastIndent": "_innermostLastIndent_pq41h_14",
-  "expandableCaret": "_expandableCaret_pq41h_18",
-  "expandCaret": "_expandCaret_pq41h_24",
-  "collapseCaret": "_collapseCaret_pq41h_29",
-  "value": "_value_pq41h_34",
-  "footer": "_footer_pq41h_39"
+  "autoGroupCell": "_autoGroupCell_1qx8z_1",
+  "indent": "_indent_1qx8z_6",
+  "innermostLastIndent": "_innermostLastIndent_1qx8z_14",
+  "expandableCaret": "_expandableCaret_1qx8z_18",
+  "expandCaret": "_expandCaret_1qx8z_25",
+  "collapseCaret": "_collapseCaret_1qx8z_30",
+  "value": "_value_1qx8z_35",
+  "footer": "_footer_1qx8z_40"
 };
 
 // src/utils/rowSelectionHelpers.ts
@@ -76272,12 +76288,12 @@ var MenuItemMapper = class MenuItemMapper2 extends BeanStub {
         if (ModuleRegistry.__assertRegistered(ModuleNames.ClipboardModule, "Cut from Menu", this.context.getGridId())) {
           const focusedCell = this.focusService.getFocusedCell();
           const rowNode = focusedCell ? this.rowPositionUtils.getRowNode(focusedCell) : null;
-          const isEditable2 = rowNode ? focusedCell === null || focusedCell === void 0 ? void 0 : focusedCell.column.isCellEditable(rowNode) : false;
+          const isEditable = rowNode ? focusedCell === null || focusedCell === void 0 ? void 0 : focusedCell.column.isCellEditable(rowNode) : false;
           return {
             name: localeTextFunc("cut", "Cut"),
             shortcut: localeTextFunc("ctrlX", "Ctrl+X"),
             icon: _.createIconNoSpan("clipboardCut", this.gridOptionsService, null),
-            disabled: !isEditable2 || this.gridOptionsService.is("suppressCutToClipboard"),
+            disabled: !isEditable || this.gridOptionsService.is("suppressCutToClipboard"),
             action: () => this.clipboardService.cutToClipboard(void 0, "contextMenu")
           };
         } else {
@@ -109153,6 +109169,20 @@ function getServerSideDatasource(onServerSideDataRequestCallbackRef, onEmptyResp
   };
 }
 var minimumColumnWidth = 140;
+function useComputeAgGridProps(props) {
+  const internalTableContext = useInternalTableContext();
+  const onSSDR = internalTableContext.onServerSideDataRequest;
+  return {
+    groupIncludeFooter: !onSSDR && props.groupIncludeFooter === void 0 ? true : props.groupIncludeFooter,
+    rowDragManaged: onSSDR ? false : props.rowDragManaged ?? true,
+    rowModelType: onSSDR ? "serverSide" : void 0,
+    groupSelectsChildren: (
+      // Always true for client side, defaults to true for server side
+      internalTableContext.totalRowCount > 0 && props.groupSelectsChildren !== false || !onSSDR
+    ),
+    groupDefaultExpanded: props.groupsAlwaysExpanded ? -1 : props.groupDefaultExpanded
+  };
+}
 var Table = (props) => {
   const { suppressColumnVirtualisation = true, rowActionsConfig = {} } = props;
   const I18n = coreReact.useI18nContext();
@@ -109202,14 +109232,28 @@ var Table = (props) => {
   React80__default.default.useImperativeHandle(internalTableContext.tableRef, () => tableApi, [
     tableApi
   ]);
+  const {
+    groupIncludeFooter,
+    rowDragManaged,
+    rowModelType,
+    groupSelectsChildren,
+    groupDefaultExpanded
+  } = useComputeAgGridProps(props);
+  const { overrideEditable } = createColumnEditableUtils({
+    enableGroupHeaderEdit: props.enableGroupHeaderEdit
+  });
   const decoratedColDefs = React80__default.default.useMemo(
-    () => internalTableContext.columnDefinitions?.map(
-      (colDef) => transformToColDef(
+    () => internalTableContext.columnDefinitions?.map((colDef) => {
+      const newColDef = transformToColDef(
         colDef,
         internalTableContext.enableGroupEditAndValidation,
         internalTableContext.enableDynamicRowHeight
-      )
-    ),
+      );
+      return {
+        ...newColDef,
+        editable: overrideEditable(colDef.editable)
+      };
+    }),
     [internalTableContext.columnDefinitions]
   );
   const hasRowActions = React80__default.default.useMemo(
@@ -109951,13 +109995,10 @@ var Table = (props) => {
           getRowId: internalTableContext.getRowId,
           getRowStyle,
           groupAllowUnbalanced: true,
-          groupDefaultExpanded: props.groupsAlwaysExpanded ? -1 : props.groupDefaultExpanded,
-          groupIncludeFooter: !onSSDR && props.groupIncludeFooter === void 0 ? true : props.groupIncludeFooter,
+          groupDefaultExpanded,
+          groupIncludeFooter,
           getGroupRowAgg: props.getGroupRowAgg ? getGroupRowAgg : void 0,
-          groupSelectsChildren: (
-            // Always true for client side, defaults to true for server side
-            internalTableContext.totalRowCount > 0 && props.groupSelectsChildren !== false || !onSSDR
-          ),
+          groupSelectsChildren,
           groupSelectsFiltered: true,
           headerHeight: props.headerHeight,
           icons: tableIcons,
@@ -110015,8 +110056,8 @@ var Table = (props) => {
           pinnedBottomRowData: props.pinnedBottomRowData,
           rowBuffer: props.rowBuffer,
           rowClassRules,
-          rowDragManaged: onSSDR ? false : props.rowDragManaged ?? true,
-          rowModelType: onSSDR ? "serverSide" : void 0,
+          rowDragManaged,
+          rowModelType,
           rowSelection: "multiple",
           ...serverSideInfiniteScroll,
           suppressClickEdit: true,

package/dist/modern/index.d.cts

@@ -992,6 +992,7 @@ interface TableProps<TRow = any, TBottomRow = any> {
     groupsAlwaysExpanded?: boolean;
     groupDefaultExpanded?: number;
     groupIncludeFooter?: boolean;
+    enableGroupHeaderEdit?: boolean;
     groupSelectsChildren?: boolean;
     headerHeight?: number;
     hideActionsOnGroupedRow?: boolean;

package/dist/modern/index.d.ts

@@ -992,6 +992,7 @@ interface TableProps<TRow = any, TBottomRow = any> {
     groupsAlwaysExpanded?: boolean;
     groupDefaultExpanded?: number;
     groupIncludeFooter?: boolean;
+    enableGroupHeaderEdit?: boolean;
     groupSelectsChildren?: boolean;
     headerHeight?: number;
     hideActionsOnGroupedRow?: boolean;

package/dist/modern/index.js

@@ -54602,6 +54602,32 @@ function SingleSelectFilterRenderer({
   );
 }
 
+// src/utils/columnEditableHelpers.ts
+function createColumnEditableUtils(options) {
+  return {
+    overrideEditable: (columnEditable) => {
+      return (params) => {
+        const isGroupNodeExpanded = params.node.group && params.node.expanded;
+        if (params.node?.rowPinned || !options.enableGroupHeaderEdit && isGroupNodeExpanded && !params.node.footer) {
+          return false;
+        }
+        if (typeof columnEditable === "boolean") {
+          return columnEditable;
+        }
+        return columnEditable?.(params) ?? false;
+      };
+    }
+  };
+}
+function isColumnEditable(columnEditable) {
+  return (params) => {
+    if (typeof columnEditable === "boolean") {
+      return columnEditable;
+    }
+    return columnEditable?.(params) ?? false;
+  };
+}
+
 // src/utils/transformers.ts
 var emptyObject = {};
 var DEFAULT_AUTO_GROUP_COLUMN_DEFINITION = {
@@ -54682,22 +54708,11 @@ function transformToColumnDefinition(colDef = emptyObject) {
     valueSetter: colDef.valueSetter
   };
 }
-function isEditable(columnEditable) {
-  return (params) => {
-    if (params.node?.rowPinned || params.node.group && params.node.expanded && !params.node.footer) {
-      return false;
-    }
-    if (typeof columnEditable === "boolean") {
-      return columnEditable;
-    }
-    return columnEditable?.(params) ?? false;
-  };
-}
 function shouldHaveEditStyles(params) {
   if (!params.colDef?.cellEditor) {
     return false;
   }
-  return isEditable(params.colDef.editable);
+  return isColumnEditable(params.colDef.editable);
 }
 var toExcelCellClass = (className) => `excel-export--${className}`;
 function transformToExcelStyles(excelDataFormats) {
@@ -54820,11 +54835,11 @@ function transformColumnDefinitionToColDef(dataTableColumnDefinition, enableGrou
       parentData: context?.parentData,
       parentId: context?.parentId
     }) : aggFunc,
-    bulkEditable: isEditable(bulkEditable),
+    bulkEditable: isColumnEditable(bulkEditable),
     cellClass: cellExcelDataType ? toExcelCellClass(cellExcelDataType) : void 0,
     cellClassRules,
     comparator,
-    editable: isEditable(_editable),
+    editable: isColumnEditable(_editable),
     filter: getFilter(dataTableColumnDefinition),
     // set filter by default
     filterParams: {
@@ -55145,12 +55160,12 @@ function getDecoratedAutoGroupColDef(columnDefinition, enableGroupEditAndValidat
 }
 
 // src/CellRenderers/AutoGroupCell.scss
-var css5 = `._autoGroupCell_pq41h_1 {
+var css5 = `._autoGroupCell_1qx8z_1 {
   height: 100%;
   width: 100%;
 }
 
-._indent_pq41h_6 {
+._indent_1qx8z_6 {
   border-right: 1px solid #d6dadc;
   background: #f4f5f6;
   position: absolute;
@@ -55158,44 +55173,45 @@ var css5 = `._autoGroupCell_pq41h_1 {
   bottom: -1px;
   width: 12px;
 }
-._indent_pq41h_6._innermostLastIndent_pq41h_14 {
+._indent_1qx8z_6._innermostLastIndent_1qx8z_14 {
   bottom: 0px;
 }
 
-._expandableCaret_pq41h_18 {
+._expandableCaret_1qx8z_18 {
   margin-left: -8px;
   margin-right: 4px;
   width: 24px;
+  flex-shrink: 0;
 }
 
-._expandCaret_pq41h_24 {
+._expandCaret_1qx8z_25 {
   color: #2066df;
   cursor: pointer;
 }
 
-._collapseCaret_pq41h_29 {
+._collapseCaret_1qx8z_30 {
   color: #75838a;
   cursor: pointer;
 }
 
-._value_pq41h_34 {
+._value_1qx8z_35 {
   overflow: hidden;
   text-overflow: ellipsis;
   font-size: 12px;
 }
-._value_pq41h_34._footer_pq41h_39 {
+._value_1qx8z_35._footer_1qx8z_40 {
   color: #6a767c;
 }`;
 document.head.appendChild(document.createElement("style")).appendChild(document.createTextNode(css5));
 var AutoGroupCell_default = {
-  "autoGroupCell": "_autoGroupCell_pq41h_1",
-  "indent": "_indent_pq41h_6",
-  "innermostLastIndent": "_innermostLastIndent_pq41h_14",
-  "expandableCaret": "_expandableCaret_pq41h_18",
-  "expandCaret": "_expandCaret_pq41h_24",
-  "collapseCaret": "_collapseCaret_pq41h_29",
-  "value": "_value_pq41h_34",
-  "footer": "_footer_pq41h_39"
+  "autoGroupCell": "_autoGroupCell_1qx8z_1",
+  "indent": "_indent_1qx8z_6",
+  "innermostLastIndent": "_innermostLastIndent_1qx8z_14",
+  "expandableCaret": "_expandableCaret_1qx8z_18",
+  "expandCaret": "_expandCaret_1qx8z_25",
+  "collapseCaret": "_collapseCaret_1qx8z_30",
+  "value": "_value_1qx8z_35",
+  "footer": "_footer_1qx8z_40"
 };
 
 // src/utils/rowSelectionHelpers.ts
@@ -76259,12 +76275,12 @@ var MenuItemMapper = class MenuItemMapper2 extends BeanStub {
         if (ModuleRegistry.__assertRegistered(ModuleNames.ClipboardModule, "Cut from Menu", this.context.getGridId())) {
           const focusedCell = this.focusService.getFocusedCell();
           const rowNode = focusedCell ? this.rowPositionUtils.getRowNode(focusedCell) : null;
-          const isEditable2 = rowNode ? focusedCell === null || focusedCell === void 0 ? void 0 : focusedCell.column.isCellEditable(rowNode) : false;
+          const isEditable = rowNode ? focusedCell === null || focusedCell === void 0 ? void 0 : focusedCell.column.isCellEditable(rowNode) : false;
           return {
             name: localeTextFunc("cut", "Cut"),
             shortcut: localeTextFunc("ctrlX", "Ctrl+X"),
             icon: _.createIconNoSpan("clipboardCut", this.gridOptionsService, null),
-            disabled: !isEditable2 || this.gridOptionsService.is("suppressCutToClipboard"),
+            disabled: !isEditable || this.gridOptionsService.is("suppressCutToClipboard"),
             action: () => this.clipboardService.cutToClipboard(void 0, "contextMenu")
           };
         } else {
@@ -109140,6 +109156,20 @@ function getServerSideDatasource(onServerSideDataRequestCallbackRef, onEmptyResp
   };
 }
 var minimumColumnWidth = 140;
+function useComputeAgGridProps(props) {
+  const internalTableContext = useInternalTableContext();
+  const onSSDR = internalTableContext.onServerSideDataRequest;
+  return {
+    groupIncludeFooter: !onSSDR && props.groupIncludeFooter === void 0 ? true : props.groupIncludeFooter,
+    rowDragManaged: onSSDR ? false : props.rowDragManaged ?? true,
+    rowModelType: onSSDR ? "serverSide" : void 0,
+    groupSelectsChildren: (
+      // Always true for client side, defaults to true for server side
+      internalTableContext.totalRowCount > 0 && props.groupSelectsChildren !== false || !onSSDR
+    ),
+    groupDefaultExpanded: props.groupsAlwaysExpanded ? -1 : props.groupDefaultExpanded
+  };
+}
 var Table = (props) => {
   const { suppressColumnVirtualisation = true, rowActionsConfig = {} } = props;
   const I18n = useI18nContext();
@@ -109189,14 +109219,28 @@ var Table = (props) => {
   React80.useImperativeHandle(internalTableContext.tableRef, () => tableApi, [
     tableApi
   ]);
+  const {
+    groupIncludeFooter,
+    rowDragManaged,
+    rowModelType,
+    groupSelectsChildren,
+    groupDefaultExpanded
+  } = useComputeAgGridProps(props);
+  const { overrideEditable } = createColumnEditableUtils({
+    enableGroupHeaderEdit: props.enableGroupHeaderEdit
+  });
   const decoratedColDefs = React80.useMemo(
-    () => internalTableContext.columnDefinitions?.map(
-      (colDef) => transformToColDef(
+    () => internalTableContext.columnDefinitions?.map((colDef) => {
+      const newColDef = transformToColDef(
         colDef,
         internalTableContext.enableGroupEditAndValidation,
         internalTableContext.enableDynamicRowHeight
-      )
-    ),
+      );
+      return {
+        ...newColDef,
+        editable: overrideEditable(colDef.editable)
+      };
+    }),
     [internalTableContext.columnDefinitions]
   );
   const hasRowActions = React80.useMemo(
@@ -109938,13 +109982,10 @@ var Table = (props) => {
           getRowId: internalTableContext.getRowId,
           getRowStyle,
           groupAllowUnbalanced: true,
-          groupDefaultExpanded: props.groupsAlwaysExpanded ? -1 : props.groupDefaultExpanded,
-          groupIncludeFooter: !onSSDR && props.groupIncludeFooter === void 0 ? true : props.groupIncludeFooter,
+          groupDefaultExpanded,
+          groupIncludeFooter,
           getGroupRowAgg: props.getGroupRowAgg ? getGroupRowAgg : void 0,
-          groupSelectsChildren: (
-            // Always true for client side, defaults to true for server side
-            internalTableContext.totalRowCount > 0 && props.groupSelectsChildren !== false || !onSSDR
-          ),
+          groupSelectsChildren,
           groupSelectsFiltered: true,
           headerHeight: props.headerHeight,
           icons: tableIcons,
@@ -110002,8 +110043,8 @@ var Table = (props) => {
           pinnedBottomRowData: props.pinnedBottomRowData,
           rowBuffer: props.rowBuffer,
           rowClassRules,
-          rowDragManaged: onSSDR ? false : props.rowDragManaged ?? true,
-          rowModelType: onSSDR ? "serverSide" : void 0,
+          rowDragManaged,
+          rowModelType,
           rowSelection: "multiple",
           ...serverSideInfiniteScroll,
           suppressClickEdit: true,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@procore/data-table",
-  "version": "14.37.0",
+  "version": "14.38.0",
   "description": "Complex data grid built on top of ag-grid, with DST components and styles.",
   "author": "Procore Technologies",
   "homepage": "https://github.com/procore/core/tree/main/packages/data-table",
@@ -59,8 +59,7 @@
     "pseudo": "pseudolocalize run ./src/locales",
     "storybook": "storybook dev -p 6006",
     "storybook-static:server": "http-server ./storybook-static -p 6006 -c-1 --silent",
-    "test": "jest --runInBand --silent --logHeapUsage",
-    "test:coverage": "yarn test -- --collectCoverage",
+    "test": "jest --runInBand --silent --logHeapUsage --collectCoverage",
     "test:watch": "yarn run test --watch"
   },
   "peerDependencies": {
@@ -107,9 +106,9 @@
     "@dotenvx/dotenvx": "1.6.4",
     "@ngneat/falso": "6.4.0",
     "@procore/core-css": "10.17.0",
-    "@procore/core-icons": "^12.10.1",
+    "@procore/core-icons": "^12.11.0",
     "@procore/core-prettier": "10.2.0",
-    "@procore/core-react": "^12.31.0",
+    "@procore/core-react": "^12.32.0",
     "@procore/eslint-config": "10.0.0",
     "@procore/globalization-toolkit": "3.1.0",
     "@procore/labs-financials-utils": "4.3.1",