@linzjs/step-ag-grid 29.2.2 → 29.2.4

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

@@ -2,7 +2,7 @@ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { LuiMiniSpinner, LuiStatusSpinner, LuiIcon, LuiButtonGroup, LuiButton, LuiCheckboxInput } from '@linzjs/lui';
 import { ModuleRegistry, AllCommunityModule } from 'ag-grid-community';
 import { AgGridReact } from 'ag-grid-react';
-import { negate, isEmpty, findIndex, defer, debounce as debounce$1, xorBy, last, difference, omit, sortBy, delay, partition, compact, pick, groupBy, fromPairs, toPairs, isEqual, pull, filter, sumBy, remove, flatten, castArray } from 'lodash-es';
+import { negate, isEmpty, findIndex, defer, debounce as debounce$1, sum, xorBy, last, difference, omit, sortBy, delay, partition, compact, pick, groupBy, fromPairs, toPairs, isEqual, pull, filter, sumBy, remove, flatten, castArray } from 'lodash-es';
 import React, { useRef, useLayoutEffect, useEffect, createContext, useContext, useState, useMemo, memo, forwardRef, useCallback, useReducer, cloneElement, useImperativeHandle, Fragment as Fragment$1, useId } from 'react';
 import { unstable_batchedUpdates, flushSync, createPortal } from 'react-dom';
 
@@ -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, ...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, ...params }) => {
     const { gridReady, gridRenderState, setApis, ensureRowVisible, getFirstRowId, selectRowsById, focusByRowById, ensureSelectedRowIsVisible, autoSizeColumns, sizeColumnsToFit, externallySelectedItemsAreInSync, setExternallySelectedItemsAreInSync, isExternalFilterPresent, doesExternalFilterPass, setOnBulkEditingComplete, getColDef, showNoRowsOverlay, prePopupOps, startCellEditing, } = useGridContext();
     const { updatedDep, updatingCols } = useContext(GridUpdatingContext);
     const gridDivRef = useRef(null);
@@ -2800,6 +2800,10 @@ const Grid = ({ 'data-testid': dataTestId, defaultPostSort = true, rowSelection
                 needsAutoSize.current = true;
                 return;
             }
+            // Default max intial width is 256x initial visible column count, max of 80% window width
+            const maxWidth = maxInitialWidth ||
+                sum(params.columnDefs.map((c) => (!c.hide ? c.maxInitialWidth || 128 : 0)));
+            result.width = Math.min(result.width, maxWidth);
             if (gridRendered === 'empty') {
                 if (!hasSetContentSizeEmpty.current && !hasSetContentSize.current) {
                     hasSetContentSizeEmpty.current = true;
@@ -2828,7 +2832,7 @@ const Grid = ({ 'data-testid': dataTestId, defaultPostSort = true, rowSelection
         }
         setAutoSized(true);
         needsAutoSize.current = false;
-    }, [autoSizeColumns, gridRenderState, params, rowData, sizeColumns, sizeColumnsToFit]);
+    }, [autoSizeColumns, gridRenderState, maxInitialWidth, params, rowData, sizeColumns, sizeColumnsToFit]);
     const lastOwnerDocumentRef = useRef();
     const wasVisibleRef = useRef(false);
     /**
@@ -2837,7 +2841,7 @@ const Grid = ({ 'data-testid': dataTestId, defaultPostSort = true, rowSelection
      */
     useInterval(() => {
         // If grid has become visible after previously being hidden, then refocus the last focused cell.
-        const visible = !!gridDivRef.current?.checkVisibility();
+        const visible = !!gridDivRef.current?.checkVisibility?.();
         if (visible && !wasVisibleRef.current) {
             wasVisibleRef.current = true;
             const el = window.__stepaggrid_lastfocuseventtarget;
@@ -5454,9 +5458,9 @@ const GridContextProvider = (props) => {
     /**
      * Resize columns to fit container
      */
-    const sizeColumnsToFit = useCallback(() => {
+    const sizeColumnsToFit = useCallback((paramsOrGridWidth) => {
         if (gridApi && !gridApi?.isDestroyed()) {
-            gridApi.sizeColumnsToFit();
+            gridApi.sizeColumnsToFit(paramsOrGridWidth);
         }
     }, [gridApi]);
     /**