@linzjs/step-ag-grid 29.3.5 → 29.4.0

package/dist/step-ag-grid.esm.js

@@ -2760,7 +2760,7 @@ ModuleRegistry.registerModules([AllCommunityModule]);
 /**
  * Wrapper for AgGrid to add commonly used functionality.
  */
-const Grid = ({ 'data-testid': dataTestId, defaultPostSort = true, rowSelection = 'multiple', suppressColumnVirtualization = true, theme = 'ag-theme-step-default', sizeColumns = 'auto', selectColumnPinned = 'left', contextMenuSelectRow = false, singleClickEdit = false, rowData, rowHeight = theme === 'ag-theme-step-default' ? 40 : theme === 'ag-theme-step-compact' ? 36 : 40, selectable, onCellFocused: paramsOnCellFocused, maxInitialWidth, ...params }) => {
+const Grid = ({ 'data-testid': dataTestId, defaultPostSort = true, rowSelection = 'multiple', suppressColumnVirtualization = true, theme = 'ag-theme-step-default', sizeColumns = 'auto', selectColumnPinned = 'left', contextMenuSelectRow = false, singleClickEdit = false, rowData, rowHeight = theme === 'ag-theme-step-default' ? 40 : theme === 'ag-theme-step-compact' ? 36 : 40, selectable, onCellFocused: paramsOnCellFocused, maxInitialWidth, suppressReadOnlyStyle = false, ...params }) => {
     const { gridReady, gridRenderState, setApis, ensureRowVisible, getFirstRowId, selectRowsById, focusByRowById, ensureSelectedRowIsVisible, autoSizeColumns, sizeColumnsToFit, externallySelectedItemsAreInSync, setExternallySelectedItemsAreInSync, isExternalFilterPresent, doesExternalFilterPass, setOnBulkEditingComplete, getColDef, showNoRowsOverlay, prePopupOps, startCellEditing: propStartCellEditing, } = useGridContext();
     // CellEditingStop event happens too much for one edit
     const startedEditRef = useRef(false);
@@ -2966,11 +2966,14 @@ const Grid = ({ 'data-testid': dataTestId, defaultPostSort = true, rowSelection
      * Synchronise externally selected items to grid on externalSelectedItems change
      */
     useEffect(synchroniseExternallySelectedItemsToGrid, [synchroniseExternallySelectedItemsToGrid]);
-    /**
-     * Add selectable column to colDefs.  Adjust column defs to block fit for auto sized columns.
-     */
-    const columnDefs = useMemo(() => {
-        return params.columnDefs.map((colDef) => {
+    const mapColDef = useCallback((colDef) => {
+        if ('children' in colDef) {
+            return {
+                ...colDef,
+                children: colDef.children.map(mapColDef),
+            };
+        }
+        else {
             const colDefEditable = colDef.editable;
             const editable = combineEditables(params.loading !== true && params.readOnly !== true, params.defaultColDef?.editable, colDefEditable);
             return {
@@ -2978,11 +2981,17 @@ const Grid = ({ 'data-testid': dataTestId, defaultPostSort = true, rowSelection
                 editable,
                 cellClassRules: {
                     ...colDef.cellClassRules,
-                    'GridCell-readonly': (ccp) => !editable(ccp),
+                    'GridCell-readonly': (ccp) => !suppressReadOnlyStyle && !editable(ccp),
                 },
             };
-        });
-    }, [params.columnDefs, params.loading, params.readOnly, params.defaultColDef?.editable]);
+        }
+    }, [params.defaultColDef?.editable, params.loading, params.readOnly, suppressReadOnlyStyle]);
+    /**
+     * Add selectable column to colDefs.  Adjust column defs to block fit for auto sized columns.
+     */
+    const columnDefs = useMemo(() => {
+        return params.columnDefs.map(mapColDef);
+    }, [params.columnDefs, mapColDef]);
     const hasExternallySelectedItems = !!params.setExternalSelectedItems;
     /**
      * When grid is ready set the apis to the grid context and sync selected items to grid.