@procore/data-table 14.35.3 → 14.36.0

package/CHANGELOG.md

@@ -1,5 +1,49 @@
 # Change Log
 
+## 14.36.0
+
+### Minor Changes
+
+- d1578b0: Add UNSAFE_agGridInternalOverrides prop to detailRowConfig to allow custom AG Grid configuration for detail grids (nested tables)
+
+### Patch Changes
+
+- e850539: Remove deprecated `detailRowSelectionEnabled` prop and consolidate row selection logic within `detailRowConfig`.
+
+  **Changes:**
+
+  - Removed deprecated `detailRowSelectionEnabled` prop (deprecated since 11.13.0)
+  - Updated `DetailRowConfig.rowSelectionEnabled` type to use `RowSelectablePredicateParams` instead of `CheckboxSelectionCallbackParams`
+  - Refactored checkbox selection logic from `defaultColDef` to centralized `isRowSelectable` function
+  - Added RowSelection story demonstrating nested table row selection with parent disabled
+  - Added comprehensive e2e tests for nested table row selection functionality
+
+  **Migration:** If still using the deprecated `detailRowSelectionEnabled` prop, move it to `detailRowConfig.rowSelectionEnabled`:
+
+  ```tsx
+  // Before
+  <DataTable.Table
+    detailRowSelectionEnabled={true}
+    detailRowConfig={{
+      // ... other config
+    }}
+  />
+
+  // After
+  <DataTable.Table
+    detailRowConfig={{
+      rowSelectionEnabled: true,
+      // ... other config
+    }}
+  />
+  ```
+
+## 14.35.4
+
+### Patch Changes
+
+- 1077669: Add support for onRowSelect callback of detail rows.
+
 ## 14.35.3
 
 ### Patch Changes

package/dist/legacy/index.cjs

@@ -104339,12 +104339,10 @@ var buildDetailRowsConfig = ({
   frameworkComponents,
   getRowHeight,
   emptyStateRenderer,
-  detailRowSelectionEnabled: detailRowSelectionEnabled_,
   enableGroupEditAndValidation,
   enableDynamicRowHeight,
   isServerSideRowModel
 }) => {
-  const detailRowSelectionEnabled = detailRowSelectionEnabled_ ?? false;
   if (detailRowConfig === void 0) {
     return {};
   }
@@ -104353,7 +104351,6 @@ var buildDetailRowsConfig = ({
     frameworkComponents,
     getRowHeight,
     emptyStateRenderer,
-    detailRowSelectionEnabled,
     enableGroupEditAndValidation,
     enableDynamicRowHeight,
     isServerSideRowModel
@@ -104364,7 +104361,6 @@ var buildDetailRowsConfig_ = (detailRowConfig, {
   frameworkComponents,
   getRowHeight,
   emptyStateRenderer,
-  detailRowSelectionEnabled: deprecatedDetailRowSelectionEnabled,
   enableGroupEditAndValidation,
   enableDynamicRowHeight,
   isServerSideRowModel
@@ -104379,7 +104375,18 @@ var buildDetailRowsConfig_ = (detailRowConfig, {
     }
   };
   const rowHeightConfig = detailRowConfig.height === "auto" || detailRowConfig.height === void 0 ? { detailRowAutoHeight: true } : { detailRowHeight: detailRowConfig.height };
-  const isRowSelectable = () => deprecatedDetailRowSelectionEnabled ?? false;
+  const isRowSelectable = (node) => {
+    if (typeof detailRowConfig.rowSelectionEnabled === "boolean") {
+      return detailRowConfig.rowSelectionEnabled;
+    }
+    if (typeof detailRowConfig.rowSelectionEnabled === "function") {
+      return isRowSelectionEnabledForRow(
+        detailRowConfig.rowSelectionEnabled,
+        node
+      );
+    }
+    return false;
+  };
   return {
     isRowMaster: detailRowConfig.isExpandable,
     masterDetail: true,
@@ -104417,20 +104424,10 @@ var buildDetailRowsConfig_ = (detailRowConfig, {
           onCellValueChanged: onGridReadyOrValueChange,
           onRowDataChanged: onGridReadyOrValueChange,
           onRowDataUpdated: onGridReadyOrValueChange,
+          onRowSelected: detailRowConfig.onRowSelected ?? null,
           refreshStrategy: detailRowConfig.refreshStrategy || "everything",
           aggFuncs: aggregationFunctions_exports,
-          defaultColDef: {
-            ...defaultColDef,
-            checkboxSelection(params) {
-              var _a, _b, _c;
-              const rowSelectionEnabled = detailRowConfig.rowSelectionEnabled ?? deprecatedDetailRowSelectionEnabled;
-              const rowSelectionEnabledValue = typeof rowSelectionEnabled === "function" ? rowSelectionEnabled(params) : rowSelectionEnabled ?? false;
-              if (!rowSelectionEnabledValue) {
-                return false;
-              }
-              return ((_c = (_b = (_a = params.columnApi) == null ? void 0 : _a.getRowGroupColumns) == null ? void 0 : _b.call(_a)) == null ? void 0 : _c.length) === 0 && isFirstColumn(params);
-            }
-          },
+          defaultColDef,
           rowSelection: detailRowConfig.rowSelection,
           rowMultiSelectWithClick: detailRowConfig.rowMultiSelectWithClick,
           suppressRowClickSelection: detailRowConfig.suppressRowClickSelection ?? true,
@@ -104450,7 +104447,8 @@ var buildDetailRowsConfig_ = (detailRowConfig, {
           suppressAggFuncInHeader: true,
           suppressContextMenu: true,
           suppressColumnVirtualisation: true,
-          getRowHeight: getRowHeight == null ? void 0 : getRowHeight(detailRowConfig.customFooters)
+          getRowHeight: getRowHeight == null ? void 0 : getRowHeight(detailRowConfig.customFooters),
+          ...detailRowConfig.UNSAFE_agGridInternalOverrides ?? {}
         },
         getDetailRowData: detailRowConfig.getDetailRowData
       };
@@ -109347,7 +109345,6 @@ var Table = (props) => {
     [
       columnGroupBordersEnabled,
       props.showGroupChildCount,
-      props.detailRowSelectionEnabled,
       props.detailRowConfigs,
       props.detailRowConfig
     ]
@@ -109359,13 +109356,11 @@ var Table = (props) => {
       frameworkComponents: frameworkComponents.detail,
       getRowHeight,
       emptyStateRenderer: props.emptyStateRenderer,
-      detailRowSelectionEnabled: props.detailRowSelectionEnabled,
       enableGroupEditAndValidation: internalTableContext.enableGroupEditAndValidation,
       enableDynamicRowHeight: internalTableContext.enableDynamicRowHeight,
       isServerSideRowModel: !!internalTableContext.onServerSideDataRequest
     });
   }, [
-    props.detailRowSelectionEnabled,
     props.detailRowConfigs,
     props.detailRowConfig,
     defaultColDef,

package/dist/legacy/index.d.cts

@@ -1,5 +1,5 @@
 import * as _ag_grid_community_core from '@ag-grid-community/core';
-import { ICellRendererParams, NumberFilterModel as NumberFilterModel$1, ColDef, IRowNode, ICellEditorParams, ColumnPinnedType, RowHeightParams, GetRowIdParams, RowDataTransaction, RowNodeTransaction, ServerSideTransaction, GridApi, ICellEditor, RefreshCellsParams, RowNode as RowNode$1, Column, SelectionEventSourceType, CheckboxSelectionCallbackParams, ExcelDataType, Module, RowGroupOpenedEvent, RowSelectedEvent, ColumnEverythingChangedEvent, CellFocusedEvent, ColumnApi, TabToNextCellParams, CellPosition, IFilter, IScalarFilterParams, ISimpleFilterParams } from '@ag-grid-community/core';
+import { ICellRendererParams, NumberFilterModel as NumberFilterModel$1, ColDef, IRowNode, ICellEditorParams, ColumnPinnedType, RowHeightParams, GetRowIdParams, RowDataTransaction, RowNodeTransaction, ServerSideTransaction, GridApi, ICellEditor, RefreshCellsParams, RowNode as RowNode$1, Column, SelectionEventSourceType, RowSelectedEvent, ExcelDataType, Module, RowGroupOpenedEvent, ColumnEverythingChangedEvent, CellFocusedEvent, ColumnApi, TabToNextCellParams, CellPosition, IFilter, IScalarFilterParams, ISimpleFilterParams } from '@ag-grid-community/core';
 import * as React$1 from 'react';
 import React__default from 'react';
 import { AgGridReactProps, AgReactUiProps } from '@ag-grid-community/react';
@@ -755,10 +755,21 @@ interface DetailRowConfig<TRow = any> {
     customFooters?: CustomFooterConfig[];
     /** See ag-grid docs for more info: https://www.ag-grid.com/javascript-data-grid/master-detail-refresh/ */
     refreshStrategy?: 'everything' | 'rows' | 'nothing';
-    rowSelectionEnabled?: boolean | ((params: CheckboxSelectionCallbackParams<TRow>) => boolean);
+    rowSelectionEnabled?: boolean | ((params: RowSelectablePredicateParams<TRow>) => boolean);
     rowSelection?: 'multiple' | 'single';
     rowMultiSelectWithClick?: boolean;
     suppressRowClickSelection?: boolean;
+    onRowSelected?: (event: RowSelectedEvent) => void;
+    /**
+     * Overrides internal props for the detail grid's AgGridReact component. This is not guaranteed under DataTable SemVer
+     * and can break during any upgrade of the ag-grid-react package
+     *
+     * For documentation see: {@link https://www.ag-grid.com/react-data-grid/grid-options/}
+     * The ag-grid changelog can be found here: {@link https://www.ag-grid.com/changelog/}
+     *
+     * Warning: This can break normal Data Table functionality.
+     */
+    UNSAFE_agGridInternalOverrides?: AgGridReactProps | AgReactUiProps;
 }
 type CustomRendererCell = {
     component: React.ComponentType<any>;
@@ -971,11 +982,6 @@ interface TableProps<TRow = any, TBottomRow = any> {
      */
     detailRowConfigs?: DetailRowConfig<TRow>[];
     detailRowConfig?: DetailRowConfig<TRow>;
-    /**
-     * @deprecated Please use `detailRowConfig.rowSelectionEnabled` instead
-     * @deprecatedSince 11.13.0
-     */
-    detailRowSelectionEnabled?: boolean;
     siblingGroupsRowSelectionDisabled?: boolean;
     emptyStateRenderer?: React.FunctionComponent;
     excelDataTypeFormats?: DTExcelFormats[];

package/dist/legacy/index.d.ts

@@ -1,5 +1,5 @@
 import * as _ag_grid_community_core from '@ag-grid-community/core';
-import { ICellRendererParams, NumberFilterModel as NumberFilterModel$1, ColDef, IRowNode, ICellEditorParams, ColumnPinnedType, RowHeightParams, GetRowIdParams, RowDataTransaction, RowNodeTransaction, ServerSideTransaction, GridApi, ICellEditor, RefreshCellsParams, RowNode as RowNode$1, Column, SelectionEventSourceType, CheckboxSelectionCallbackParams, ExcelDataType, Module, RowGroupOpenedEvent, RowSelectedEvent, ColumnEverythingChangedEvent, CellFocusedEvent, ColumnApi, TabToNextCellParams, CellPosition, IFilter, IScalarFilterParams, ISimpleFilterParams } from '@ag-grid-community/core';
+import { ICellRendererParams, NumberFilterModel as NumberFilterModel$1, ColDef, IRowNode, ICellEditorParams, ColumnPinnedType, RowHeightParams, GetRowIdParams, RowDataTransaction, RowNodeTransaction, ServerSideTransaction, GridApi, ICellEditor, RefreshCellsParams, RowNode as RowNode$1, Column, SelectionEventSourceType, RowSelectedEvent, ExcelDataType, Module, RowGroupOpenedEvent, ColumnEverythingChangedEvent, CellFocusedEvent, ColumnApi, TabToNextCellParams, CellPosition, IFilter, IScalarFilterParams, ISimpleFilterParams } from '@ag-grid-community/core';
 import * as React$1 from 'react';
 import React__default from 'react';
 import { AgGridReactProps, AgReactUiProps } from '@ag-grid-community/react';
@@ -755,10 +755,21 @@ interface DetailRowConfig<TRow = any> {
     customFooters?: CustomFooterConfig[];
     /** See ag-grid docs for more info: https://www.ag-grid.com/javascript-data-grid/master-detail-refresh/ */
     refreshStrategy?: 'everything' | 'rows' | 'nothing';
-    rowSelectionEnabled?: boolean | ((params: CheckboxSelectionCallbackParams<TRow>) => boolean);
+    rowSelectionEnabled?: boolean | ((params: RowSelectablePredicateParams<TRow>) => boolean);
     rowSelection?: 'multiple' | 'single';
     rowMultiSelectWithClick?: boolean;
     suppressRowClickSelection?: boolean;
+    onRowSelected?: (event: RowSelectedEvent) => void;
+    /**
+     * Overrides internal props for the detail grid's AgGridReact component. This is not guaranteed under DataTable SemVer
+     * and can break during any upgrade of the ag-grid-react package
+     *
+     * For documentation see: {@link https://www.ag-grid.com/react-data-grid/grid-options/}
+     * The ag-grid changelog can be found here: {@link https://www.ag-grid.com/changelog/}
+     *
+     * Warning: This can break normal Data Table functionality.
+     */
+    UNSAFE_agGridInternalOverrides?: AgGridReactProps | AgReactUiProps;
 }
 type CustomRendererCell = {
     component: React.ComponentType<any>;
@@ -971,11 +982,6 @@ interface TableProps<TRow = any, TBottomRow = any> {
      */
     detailRowConfigs?: DetailRowConfig<TRow>[];
     detailRowConfig?: DetailRowConfig<TRow>;
-    /**
-     * @deprecated Please use `detailRowConfig.rowSelectionEnabled` instead
-     * @deprecatedSince 11.13.0
-     */
-    detailRowSelectionEnabled?: boolean;
     siblingGroupsRowSelectionDisabled?: boolean;
     emptyStateRenderer?: React.FunctionComponent;
     excelDataTypeFormats?: DTExcelFormats[];

package/dist/legacy/index.js

@@ -104326,12 +104326,10 @@ var buildDetailRowsConfig = ({
   frameworkComponents,
   getRowHeight,
   emptyStateRenderer,
-  detailRowSelectionEnabled: detailRowSelectionEnabled_,
   enableGroupEditAndValidation,
   enableDynamicRowHeight,
   isServerSideRowModel
 }) => {
-  const detailRowSelectionEnabled = detailRowSelectionEnabled_ ?? false;
   if (detailRowConfig === void 0) {
     return {};
   }
@@ -104340,7 +104338,6 @@ var buildDetailRowsConfig = ({
     frameworkComponents,
     getRowHeight,
     emptyStateRenderer,
-    detailRowSelectionEnabled,
     enableGroupEditAndValidation,
     enableDynamicRowHeight,
     isServerSideRowModel
@@ -104351,7 +104348,6 @@ var buildDetailRowsConfig_ = (detailRowConfig, {
   frameworkComponents,
   getRowHeight,
   emptyStateRenderer,
-  detailRowSelectionEnabled: deprecatedDetailRowSelectionEnabled,
   enableGroupEditAndValidation,
   enableDynamicRowHeight,
   isServerSideRowModel
@@ -104366,7 +104362,18 @@ var buildDetailRowsConfig_ = (detailRowConfig, {
     }
   };
   const rowHeightConfig = detailRowConfig.height === "auto" || detailRowConfig.height === void 0 ? { detailRowAutoHeight: true } : { detailRowHeight: detailRowConfig.height };
-  const isRowSelectable = () => deprecatedDetailRowSelectionEnabled ?? false;
+  const isRowSelectable = (node) => {
+    if (typeof detailRowConfig.rowSelectionEnabled === "boolean") {
+      return detailRowConfig.rowSelectionEnabled;
+    }
+    if (typeof detailRowConfig.rowSelectionEnabled === "function") {
+      return isRowSelectionEnabledForRow(
+        detailRowConfig.rowSelectionEnabled,
+        node
+      );
+    }
+    return false;
+  };
   return {
     isRowMaster: detailRowConfig.isExpandable,
     masterDetail: true,
@@ -104404,20 +104411,10 @@ var buildDetailRowsConfig_ = (detailRowConfig, {
           onCellValueChanged: onGridReadyOrValueChange,
           onRowDataChanged: onGridReadyOrValueChange,
           onRowDataUpdated: onGridReadyOrValueChange,
+          onRowSelected: detailRowConfig.onRowSelected ?? null,
           refreshStrategy: detailRowConfig.refreshStrategy || "everything",
           aggFuncs: aggregationFunctions_exports,
-          defaultColDef: {
-            ...defaultColDef,
-            checkboxSelection(params) {
-              var _a, _b, _c;
-              const rowSelectionEnabled = detailRowConfig.rowSelectionEnabled ?? deprecatedDetailRowSelectionEnabled;
-              const rowSelectionEnabledValue = typeof rowSelectionEnabled === "function" ? rowSelectionEnabled(params) : rowSelectionEnabled ?? false;
-              if (!rowSelectionEnabledValue) {
-                return false;
-              }
-              return ((_c = (_b = (_a = params.columnApi) == null ? void 0 : _a.getRowGroupColumns) == null ? void 0 : _b.call(_a)) == null ? void 0 : _c.length) === 0 && isFirstColumn(params);
-            }
-          },
+          defaultColDef,
           rowSelection: detailRowConfig.rowSelection,
           rowMultiSelectWithClick: detailRowConfig.rowMultiSelectWithClick,
           suppressRowClickSelection: detailRowConfig.suppressRowClickSelection ?? true,
@@ -104437,7 +104434,8 @@ var buildDetailRowsConfig_ = (detailRowConfig, {
           suppressAggFuncInHeader: true,
           suppressContextMenu: true,
           suppressColumnVirtualisation: true,
-          getRowHeight: getRowHeight == null ? void 0 : getRowHeight(detailRowConfig.customFooters)
+          getRowHeight: getRowHeight == null ? void 0 : getRowHeight(detailRowConfig.customFooters),
+          ...detailRowConfig.UNSAFE_agGridInternalOverrides ?? {}
         },
         getDetailRowData: detailRowConfig.getDetailRowData
       };
@@ -109334,7 +109332,6 @@ var Table = (props) => {
     [
       columnGroupBordersEnabled,
       props.showGroupChildCount,
-      props.detailRowSelectionEnabled,
       props.detailRowConfigs,
       props.detailRowConfig
     ]
@@ -109346,13 +109343,11 @@ var Table = (props) => {
       frameworkComponents: frameworkComponents.detail,
       getRowHeight,
       emptyStateRenderer: props.emptyStateRenderer,
-      detailRowSelectionEnabled: props.detailRowSelectionEnabled,
       enableGroupEditAndValidation: internalTableContext.enableGroupEditAndValidation,
       enableDynamicRowHeight: internalTableContext.enableDynamicRowHeight,
       isServerSideRowModel: !!internalTableContext.onServerSideDataRequest
     });
   }, [
-    props.detailRowSelectionEnabled,
     props.detailRowConfigs,
     props.detailRowConfig,
     defaultColDef,

package/dist/modern/index.cjs

@@ -104205,12 +104205,10 @@ var buildDetailRowsConfig = ({
   frameworkComponents,
   getRowHeight,
   emptyStateRenderer,
-  detailRowSelectionEnabled: detailRowSelectionEnabled_,
   enableGroupEditAndValidation,
   enableDynamicRowHeight,
   isServerSideRowModel
 }) => {
-  const detailRowSelectionEnabled = detailRowSelectionEnabled_ ?? false;
   if (detailRowConfig === void 0) {
     return {};
   }
@@ -104219,7 +104217,6 @@ var buildDetailRowsConfig = ({
     frameworkComponents,
     getRowHeight,
     emptyStateRenderer,
-    detailRowSelectionEnabled,
     enableGroupEditAndValidation,
     enableDynamicRowHeight,
     isServerSideRowModel
@@ -104230,7 +104227,6 @@ var buildDetailRowsConfig_ = (detailRowConfig, {
   frameworkComponents,
   getRowHeight,
   emptyStateRenderer,
-  detailRowSelectionEnabled: deprecatedDetailRowSelectionEnabled,
   enableGroupEditAndValidation,
   enableDynamicRowHeight,
   isServerSideRowModel
@@ -104245,7 +104241,18 @@ var buildDetailRowsConfig_ = (detailRowConfig, {
     }
   };
   const rowHeightConfig = detailRowConfig.height === "auto" || detailRowConfig.height === void 0 ? { detailRowAutoHeight: true } : { detailRowHeight: detailRowConfig.height };
-  const isRowSelectable = () => deprecatedDetailRowSelectionEnabled ?? false;
+  const isRowSelectable = (node) => {
+    if (typeof detailRowConfig.rowSelectionEnabled === "boolean") {
+      return detailRowConfig.rowSelectionEnabled;
+    }
+    if (typeof detailRowConfig.rowSelectionEnabled === "function") {
+      return isRowSelectionEnabledForRow(
+        detailRowConfig.rowSelectionEnabled,
+        node
+      );
+    }
+    return false;
+  };
   return {
     isRowMaster: detailRowConfig.isExpandable,
     masterDetail: true,
@@ -104283,19 +104290,10 @@ var buildDetailRowsConfig_ = (detailRowConfig, {
           onCellValueChanged: onGridReadyOrValueChange,
           onRowDataChanged: onGridReadyOrValueChange,
           onRowDataUpdated: onGridReadyOrValueChange,
+          onRowSelected: detailRowConfig.onRowSelected ?? null,
           refreshStrategy: detailRowConfig.refreshStrategy || "everything",
           aggFuncs: aggregationFunctions_exports,
-          defaultColDef: {
-            ...defaultColDef,
-            checkboxSelection(params) {
-              const rowSelectionEnabled = detailRowConfig.rowSelectionEnabled ?? deprecatedDetailRowSelectionEnabled;
-              const rowSelectionEnabledValue = typeof rowSelectionEnabled === "function" ? rowSelectionEnabled(params) : rowSelectionEnabled ?? false;
-              if (!rowSelectionEnabledValue) {
-                return false;
-              }
-              return params.columnApi?.getRowGroupColumns?.()?.length === 0 && isFirstColumn(params);
-            }
-          },
+          defaultColDef,
           rowSelection: detailRowConfig.rowSelection,
           rowMultiSelectWithClick: detailRowConfig.rowMultiSelectWithClick,
           suppressRowClickSelection: detailRowConfig.suppressRowClickSelection ?? true,
@@ -104315,7 +104313,8 @@ var buildDetailRowsConfig_ = (detailRowConfig, {
           suppressAggFuncInHeader: true,
           suppressContextMenu: true,
           suppressColumnVirtualisation: true,
-          getRowHeight: getRowHeight?.(detailRowConfig.customFooters)
+          getRowHeight: getRowHeight?.(detailRowConfig.customFooters),
+          ...detailRowConfig.UNSAFE_agGridInternalOverrides ?? {}
         },
         getDetailRowData: detailRowConfig.getDetailRowData
       };
@@ -109158,7 +109157,6 @@ var Table = (props) => {
     [
       columnGroupBordersEnabled,
       props.showGroupChildCount,
-      props.detailRowSelectionEnabled,
       props.detailRowConfigs,
       props.detailRowConfig
     ]
@@ -109170,13 +109168,11 @@ var Table = (props) => {
       frameworkComponents: frameworkComponents.detail,
       getRowHeight,
       emptyStateRenderer: props.emptyStateRenderer,
-      detailRowSelectionEnabled: props.detailRowSelectionEnabled,
       enableGroupEditAndValidation: internalTableContext.enableGroupEditAndValidation,
       enableDynamicRowHeight: internalTableContext.enableDynamicRowHeight,
       isServerSideRowModel: !!internalTableContext.onServerSideDataRequest
     });
   }, [
-    props.detailRowSelectionEnabled,
     props.detailRowConfigs,
     props.detailRowConfig,
     defaultColDef,

package/dist/modern/index.d.cts

@@ -1,5 +1,5 @@
 import * as _ag_grid_community_core from '@ag-grid-community/core';
-import { ICellRendererParams, NumberFilterModel as NumberFilterModel$1, ColDef, IRowNode, ICellEditorParams, ColumnPinnedType, RowHeightParams, GetRowIdParams, RowDataTransaction, RowNodeTransaction, ServerSideTransaction, GridApi, ICellEditor, RefreshCellsParams, RowNode as RowNode$1, Column, SelectionEventSourceType, CheckboxSelectionCallbackParams, ExcelDataType, Module, RowGroupOpenedEvent, RowSelectedEvent, ColumnEverythingChangedEvent, CellFocusedEvent, ColumnApi, TabToNextCellParams, CellPosition, IFilter, IScalarFilterParams, ISimpleFilterParams } from '@ag-grid-community/core';
+import { ICellRendererParams, NumberFilterModel as NumberFilterModel$1, ColDef, IRowNode, ICellEditorParams, ColumnPinnedType, RowHeightParams, GetRowIdParams, RowDataTransaction, RowNodeTransaction, ServerSideTransaction, GridApi, ICellEditor, RefreshCellsParams, RowNode as RowNode$1, Column, SelectionEventSourceType, RowSelectedEvent, ExcelDataType, Module, RowGroupOpenedEvent, ColumnEverythingChangedEvent, CellFocusedEvent, ColumnApi, TabToNextCellParams, CellPosition, IFilter, IScalarFilterParams, ISimpleFilterParams } from '@ag-grid-community/core';
 import * as React$1 from 'react';
 import React__default from 'react';
 import { AgGridReactProps, AgReactUiProps } from '@ag-grid-community/react';
@@ -755,10 +755,21 @@ interface DetailRowConfig<TRow = any> {
     customFooters?: CustomFooterConfig[];
     /** See ag-grid docs for more info: https://www.ag-grid.com/javascript-data-grid/master-detail-refresh/ */
     refreshStrategy?: 'everything' | 'rows' | 'nothing';
-    rowSelectionEnabled?: boolean | ((params: CheckboxSelectionCallbackParams<TRow>) => boolean);
+    rowSelectionEnabled?: boolean | ((params: RowSelectablePredicateParams<TRow>) => boolean);
     rowSelection?: 'multiple' | 'single';
     rowMultiSelectWithClick?: boolean;
     suppressRowClickSelection?: boolean;
+    onRowSelected?: (event: RowSelectedEvent) => void;
+    /**
+     * Overrides internal props for the detail grid's AgGridReact component. This is not guaranteed under DataTable SemVer
+     * and can break during any upgrade of the ag-grid-react package
+     *
+     * For documentation see: {@link https://www.ag-grid.com/react-data-grid/grid-options/}
+     * The ag-grid changelog can be found here: {@link https://www.ag-grid.com/changelog/}
+     *
+     * Warning: This can break normal Data Table functionality.
+     */
+    UNSAFE_agGridInternalOverrides?: AgGridReactProps | AgReactUiProps;
 }
 type CustomRendererCell = {
     component: React.ComponentType<any>;
@@ -971,11 +982,6 @@ interface TableProps<TRow = any, TBottomRow = any> {
      */
     detailRowConfigs?: DetailRowConfig<TRow>[];
     detailRowConfig?: DetailRowConfig<TRow>;
-    /**
-     * @deprecated Please use `detailRowConfig.rowSelectionEnabled` instead
-     * @deprecatedSince 11.13.0
-     */
-    detailRowSelectionEnabled?: boolean;
     siblingGroupsRowSelectionDisabled?: boolean;
     emptyStateRenderer?: React.FunctionComponent;
     excelDataTypeFormats?: DTExcelFormats[];

package/dist/modern/index.d.ts

@@ -1,5 +1,5 @@
 import * as _ag_grid_community_core from '@ag-grid-community/core';
-import { ICellRendererParams, NumberFilterModel as NumberFilterModel$1, ColDef, IRowNode, ICellEditorParams, ColumnPinnedType, RowHeightParams, GetRowIdParams, RowDataTransaction, RowNodeTransaction, ServerSideTransaction, GridApi, ICellEditor, RefreshCellsParams, RowNode as RowNode$1, Column, SelectionEventSourceType, CheckboxSelectionCallbackParams, ExcelDataType, Module, RowGroupOpenedEvent, RowSelectedEvent, ColumnEverythingChangedEvent, CellFocusedEvent, ColumnApi, TabToNextCellParams, CellPosition, IFilter, IScalarFilterParams, ISimpleFilterParams } from '@ag-grid-community/core';
+import { ICellRendererParams, NumberFilterModel as NumberFilterModel$1, ColDef, IRowNode, ICellEditorParams, ColumnPinnedType, RowHeightParams, GetRowIdParams, RowDataTransaction, RowNodeTransaction, ServerSideTransaction, GridApi, ICellEditor, RefreshCellsParams, RowNode as RowNode$1, Column, SelectionEventSourceType, RowSelectedEvent, ExcelDataType, Module, RowGroupOpenedEvent, ColumnEverythingChangedEvent, CellFocusedEvent, ColumnApi, TabToNextCellParams, CellPosition, IFilter, IScalarFilterParams, ISimpleFilterParams } from '@ag-grid-community/core';
 import * as React$1 from 'react';
 import React__default from 'react';
 import { AgGridReactProps, AgReactUiProps } from '@ag-grid-community/react';
@@ -755,10 +755,21 @@ interface DetailRowConfig<TRow = any> {
     customFooters?: CustomFooterConfig[];
     /** See ag-grid docs for more info: https://www.ag-grid.com/javascript-data-grid/master-detail-refresh/ */
     refreshStrategy?: 'everything' | 'rows' | 'nothing';
-    rowSelectionEnabled?: boolean | ((params: CheckboxSelectionCallbackParams<TRow>) => boolean);
+    rowSelectionEnabled?: boolean | ((params: RowSelectablePredicateParams<TRow>) => boolean);
     rowSelection?: 'multiple' | 'single';
     rowMultiSelectWithClick?: boolean;
     suppressRowClickSelection?: boolean;
+    onRowSelected?: (event: RowSelectedEvent) => void;
+    /**
+     * Overrides internal props for the detail grid's AgGridReact component. This is not guaranteed under DataTable SemVer
+     * and can break during any upgrade of the ag-grid-react package
+     *
+     * For documentation see: {@link https://www.ag-grid.com/react-data-grid/grid-options/}
+     * The ag-grid changelog can be found here: {@link https://www.ag-grid.com/changelog/}
+     *
+     * Warning: This can break normal Data Table functionality.
+     */
+    UNSAFE_agGridInternalOverrides?: AgGridReactProps | AgReactUiProps;
 }
 type CustomRendererCell = {
     component: React.ComponentType<any>;
@@ -971,11 +982,6 @@ interface TableProps<TRow = any, TBottomRow = any> {
      */
     detailRowConfigs?: DetailRowConfig<TRow>[];
     detailRowConfig?: DetailRowConfig<TRow>;
-    /**
-     * @deprecated Please use `detailRowConfig.rowSelectionEnabled` instead
-     * @deprecatedSince 11.13.0
-     */
-    detailRowSelectionEnabled?: boolean;
     siblingGroupsRowSelectionDisabled?: boolean;
     emptyStateRenderer?: React.FunctionComponent;
     excelDataTypeFormats?: DTExcelFormats[];

package/dist/modern/index.js

@@ -104192,12 +104192,10 @@ var buildDetailRowsConfig = ({
   frameworkComponents,
   getRowHeight,
   emptyStateRenderer,
-  detailRowSelectionEnabled: detailRowSelectionEnabled_,
   enableGroupEditAndValidation,
   enableDynamicRowHeight,
   isServerSideRowModel
 }) => {
-  const detailRowSelectionEnabled = detailRowSelectionEnabled_ ?? false;
   if (detailRowConfig === void 0) {
     return {};
   }
@@ -104206,7 +104204,6 @@ var buildDetailRowsConfig = ({
     frameworkComponents,
     getRowHeight,
     emptyStateRenderer,
-    detailRowSelectionEnabled,
     enableGroupEditAndValidation,
     enableDynamicRowHeight,
     isServerSideRowModel
@@ -104217,7 +104214,6 @@ var buildDetailRowsConfig_ = (detailRowConfig, {
   frameworkComponents,
   getRowHeight,
   emptyStateRenderer,
-  detailRowSelectionEnabled: deprecatedDetailRowSelectionEnabled,
   enableGroupEditAndValidation,
   enableDynamicRowHeight,
   isServerSideRowModel
@@ -104232,7 +104228,18 @@ var buildDetailRowsConfig_ = (detailRowConfig, {
     }
   };
   const rowHeightConfig = detailRowConfig.height === "auto" || detailRowConfig.height === void 0 ? { detailRowAutoHeight: true } : { detailRowHeight: detailRowConfig.height };
-  const isRowSelectable = () => deprecatedDetailRowSelectionEnabled ?? false;
+  const isRowSelectable = (node) => {
+    if (typeof detailRowConfig.rowSelectionEnabled === "boolean") {
+      return detailRowConfig.rowSelectionEnabled;
+    }
+    if (typeof detailRowConfig.rowSelectionEnabled === "function") {
+      return isRowSelectionEnabledForRow(
+        detailRowConfig.rowSelectionEnabled,
+        node
+      );
+    }
+    return false;
+  };
   return {
     isRowMaster: detailRowConfig.isExpandable,
     masterDetail: true,
@@ -104270,19 +104277,10 @@ var buildDetailRowsConfig_ = (detailRowConfig, {
           onCellValueChanged: onGridReadyOrValueChange,
           onRowDataChanged: onGridReadyOrValueChange,
           onRowDataUpdated: onGridReadyOrValueChange,
+          onRowSelected: detailRowConfig.onRowSelected ?? null,
           refreshStrategy: detailRowConfig.refreshStrategy || "everything",
           aggFuncs: aggregationFunctions_exports,
-          defaultColDef: {
-            ...defaultColDef,
-            checkboxSelection(params) {
-              const rowSelectionEnabled = detailRowConfig.rowSelectionEnabled ?? deprecatedDetailRowSelectionEnabled;
-              const rowSelectionEnabledValue = typeof rowSelectionEnabled === "function" ? rowSelectionEnabled(params) : rowSelectionEnabled ?? false;
-              if (!rowSelectionEnabledValue) {
-                return false;
-              }
-              return params.columnApi?.getRowGroupColumns?.()?.length === 0 && isFirstColumn(params);
-            }
-          },
+          defaultColDef,
           rowSelection: detailRowConfig.rowSelection,
           rowMultiSelectWithClick: detailRowConfig.rowMultiSelectWithClick,
           suppressRowClickSelection: detailRowConfig.suppressRowClickSelection ?? true,
@@ -104302,7 +104300,8 @@ var buildDetailRowsConfig_ = (detailRowConfig, {
           suppressAggFuncInHeader: true,
           suppressContextMenu: true,
           suppressColumnVirtualisation: true,
-          getRowHeight: getRowHeight?.(detailRowConfig.customFooters)
+          getRowHeight: getRowHeight?.(detailRowConfig.customFooters),
+          ...detailRowConfig.UNSAFE_agGridInternalOverrides ?? {}
         },
         getDetailRowData: detailRowConfig.getDetailRowData
       };
@@ -109145,7 +109144,6 @@ var Table = (props) => {
     [
       columnGroupBordersEnabled,
       props.showGroupChildCount,
-      props.detailRowSelectionEnabled,
       props.detailRowConfigs,
       props.detailRowConfig
     ]
@@ -109157,13 +109155,11 @@ var Table = (props) => {
       frameworkComponents: frameworkComponents.detail,
       getRowHeight,
       emptyStateRenderer: props.emptyStateRenderer,
-      detailRowSelectionEnabled: props.detailRowSelectionEnabled,
       enableGroupEditAndValidation: internalTableContext.enableGroupEditAndValidation,
       enableDynamicRowHeight: internalTableContext.enableDynamicRowHeight,
       isServerSideRowModel: !!internalTableContext.onServerSideDataRequest
     });
   }, [
-    props.detailRowSelectionEnabled,
     props.detailRowConfigs,
     props.detailRowConfig,
     defaultColDef,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@procore/data-table",
-  "version": "14.35.3",
+  "version": "14.36.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",
@@ -107,9 +107,9 @@
     "@dotenvx/dotenvx": "1.6.4",
     "@ngneat/falso": "6.4.0",
     "@procore/core-css": "10.17.0",
-    "@procore/core-icons": "^12.9.0",
+    "@procore/core-icons": "^12.10.0",
     "@procore/core-prettier": "10.2.0",
-    "@procore/core-react": "^12.26.1",
+    "@procore/core-react": "^12.28.1",
     "@procore/eslint-config": "10.0.0",
     "@procore/globalization-toolkit": "3.1.0",
     "@procore/labs-financials-utils": "4.3.1",