@linzjs/step-ag-grid 29.11.0 → 29.11.2

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

@@ -2783,7 +2783,6 @@ const Grid = ({ 'data-testid': dataTestId, defaultPostSort = true, rowSelection
     const hasSetContentSize = useRef(false);
     const hasSetContentSizeEmpty = useRef(false);
     const needsAutoSize = useRef(true);
-    const requiresInitialSizeToFitRef = useRef(false);
     const autoSizeResultRef = useRef(null);
     const prevRowsVisibleRef = useRef(false);
     const setInitialContentSize = useCallback(() => {
@@ -2812,7 +2811,6 @@ const Grid = ({ 'data-testid': dataTestId, defaultPostSort = true, rowSelection
                 autoSizeColumns({
                     skipHeader,
                     userSizedColIds: new Set(userSizedColIds.current.keys()),
-                    includeFlex: true,
                 });
             // Auto-size failed retry later
             if (!autoSizeResult) {
@@ -2827,7 +2825,6 @@ const Grid = ({ 'data-testid': dataTestId, defaultPostSort = true, rowSelection
                 // We don't do this callback if we have previously had row data, or have already called back for empty
                 if (!hasSetContentSizeEmpty.current && !hasSetContentSize.current) {
                     hasSetContentSizeEmpty.current = true;
-                    requiresInitialSizeToFitRef.current = true;
                     params.onContentSize?.(autoSizeResult);
                 }
             }
@@ -2835,7 +2832,6 @@ const Grid = ({ 'data-testid': dataTestId, defaultPostSort = true, rowSelection
                 // we have rows now so callback grid size
                 if (!hasSetContentSize.current) {
                     hasSetContentSize.current = true;
-                    requiresInitialSizeToFitRef.current = true;
                     params.onContentSize?.(autoSizeResult);
                 }
             }
@@ -2845,6 +2841,7 @@ const Grid = ({ 'data-testid': dataTestId, defaultPostSort = true, rowSelection
             }
         }
         else {
+            console.log('sizeColumnsToFit 3');
             sizeColumnsToFit();
         }
         setAutoSized(true);
@@ -3130,8 +3127,9 @@ const Grid = ({ 'data-testid': dataTestId, defaultPostSort = true, rowSelection
      * When cell editing has completed the colId as needing auto-sizing
      */
     useEffect(() => {
-        if (lastUpdatedDep.current === updatedDep)
+        if (lastUpdatedDep.current === updatedDep) {
             return;
+        }
         lastUpdatedDep.current = updatedDep;
         const colIds = updatingCols();
         // Updating possibly completed
@@ -3170,26 +3168,6 @@ const Grid = ({ 'data-testid': dataTestId, defaultPostSort = true, rowSelection
         }
         prevLoading.current = newLoading;
     }, [params.loading, rowData, showNoRowsOverlay]);
-    /**
-     * Resize columns to fit if required on window/container resize
-     */
-    const onGridResize = useCallback((event) => {
-        if (sizeColumns === 'fit' || (!hasSetContentSizeEmpty.current && !hasSetContentSize.current)) {
-            return;
-        }
-        if (sizeColumns !== 'none') {
-            // Flex columns can expand to fit after resize, but they cannot shrink less than use resized value
-            // Double click column resize handle to reset this behaviour
-            const columnLimits = [
-                ...userSizedColIds.current.entries().map(([c, w]) => ({
-                    key: c,
-                    minWidth: w,
-                    maxWidth: w,
-                })),
-            ];
-            defer(() => event.api.sizeColumnsToFit({ columnLimits }));
-        }
-    }, [sizeColumns]);
     /**
      * Set of column I'd's that are prevented from auto-sizing as they are user set
      */
@@ -3209,17 +3187,17 @@ const Grid = ({ 'data-testid': dataTestId, defaultPostSort = true, rowSelection
         switch (e.source) {
             case 'uiColumnResized':
                 userSizedColIds.current.set(colId, width);
-                const colDef = e.column?.getColDef();
-                if (!colDef?.flex) {
+                /*const colDef = e.column?.getColDef();
+                  if (!colDef?.flex) {
                     onGridResize(e);
-                }
+                  }*/
                 break;
             case 'autosizeColumns':
                 userSizedColIds.current.delete(colId);
-                onGridResize(e);
+                //onGridResize(e);
                 break;
         }
-    }, [onGridResize]);
+    }, []);
     const gridContextMenu = useGridContextMenu({ contextMenu: params.contextMenu, contextMenuSelectRow });
     const startDragYRef = useRef(null);
     const clearHighlightRowClasses = useCallback(() => {
@@ -3362,15 +3340,7 @@ const Grid = ({ 'data-testid': dataTestId, defaultPostSort = true, rowSelection
                             enableClickSelection: params.enableClickSelection ?? false,
                             mode: rowSelection === 'single' ? 'singleRow' : 'multiRow',
                         }
-                        : undefined, onDisplayedColumnsChanged: () => {
-                        // This happens after an autosize event, if we don't wait for it size columns to fit doesn't work
-                        if (requiresInitialSizeToFitRef.current) {
-                            requiresInitialSizeToFitRef.current = false;
-                            delay(() => {
-                                sizeColumnsToFit();
-                            }, 200);
-                        }
-                    }, rowHeight: rowHeight, animateRows: params.animateRows ?? false, rowClassRules: params.rowClassRules, getRowId: getRowId, onGridSizeChanged: onGridResize, suppressColumnVirtualisation: suppressColumnVirtualization, suppressClickEdit: true, onColumnVisible: setInitialContentSize, onRowDataUpdated: onRowDataUpdated, onCellFocused: onCellFocused, onCellKeyDown: onCellKeyPress, onCellClicked: onCellClicked, onCellDoubleClicked: onCellDoubleClick, onCellEditingStopped: onCellEditingStopped, domLayout: params.domLayout, onColumnResized: onColumnResized, defaultColDef: defaultColDef, columnDefs: columnDefsAdjusted, selectionColumnDef: selectionColumnDef, rowData: rowData, postSortRows: params.onRowDragEnd || !defaultPostSort ? undefined : postSortRows, onModelUpdated: onModelUpdated, onGridReady: onGridReady, onSortChanged: ensureSelectedRowIsVisible, quickFilterParser: quickFilterParser, onSelectionChanged: synchroniseExternalStateToGridSelection, onColumnMoved: params.onColumnMoved, noRowsOverlayComponent: noRowsOverlayComponent, alwaysShowVerticalScroll: params.alwaysShowVerticalScroll, isExternalFilterPresent: isExternalFilterPresent, doesExternalFilterPass: doesExternalFilterPass, maintainColumnOrder: true, preventDefaultOnContextMenu: true, onCellContextMenu: gridContextMenu.cellContextMenu, rowDragText: params.rowDragText, onRowDragCancel: clearHighlightRowClasses, onRowDragMove: onRowDragMove, onRowDragEnd: onRowDragEnd, suppressCellFocus: params.suppressCellFocus, pinnedTopRowData: params.pinnedTopRowData, pinnedBottomRowData: params.pinnedBottomRowData, onRowClicked: params.onRowClicked, onRowDoubleClicked: params.onRowDoubleClicked, suppressStartEditOnTab: true }) })] }));
+                        : undefined, rowHeight: rowHeight, animateRows: params.animateRows ?? false, rowClassRules: params.rowClassRules, getRowId: getRowId, suppressColumnVirtualisation: suppressColumnVirtualization, suppressClickEdit: true, onColumnVisible: setInitialContentSize, onRowDataUpdated: onRowDataUpdated, onCellFocused: onCellFocused, onCellKeyDown: onCellKeyPress, onCellClicked: onCellClicked, onCellDoubleClicked: onCellDoubleClick, onCellEditingStopped: onCellEditingStopped, domLayout: params.domLayout, onColumnResized: onColumnResized, defaultColDef: defaultColDef, columnDefs: columnDefsAdjusted, selectionColumnDef: selectionColumnDef, rowData: rowData, postSortRows: params.onRowDragEnd || !defaultPostSort ? undefined : postSortRows, onModelUpdated: onModelUpdated, onGridReady: onGridReady, onSortChanged: ensureSelectedRowIsVisible, quickFilterParser: quickFilterParser, onSelectionChanged: synchroniseExternalStateToGridSelection, onColumnMoved: params.onColumnMoved, noRowsOverlayComponent: noRowsOverlayComponent, alwaysShowVerticalScroll: params.alwaysShowVerticalScroll, isExternalFilterPresent: isExternalFilterPresent, doesExternalFilterPass: doesExternalFilterPass, maintainColumnOrder: true, preventDefaultOnContextMenu: true, onCellContextMenu: gridContextMenu.cellContextMenu, rowDragText: params.rowDragText, onRowDragCancel: clearHighlightRowClasses, onRowDragMove: onRowDragMove, onRowDragEnd: onRowDragEnd, suppressCellFocus: params.suppressCellFocus, pinnedTopRowData: params.pinnedTopRowData, pinnedBottomRowData: params.pinnedBottomRowData, onRowClicked: params.onRowClicked, onRowDoubleClicked: params.onRowDoubleClicked, suppressStartEditOnTab: true }) })] }));
 };
 const quickFilterParser = (filterStr) => {
     // filter is exact matches exactly groups separated by commas
@@ -5344,6 +5314,9 @@ const waitForCondition = async (error, condition, timeoutMs) => {
     return false;
 };
 
+const colStateId = (colState) => colState.colId;
+const colStateFlexed = (colState) => !!colState.flex;
+const colStateNotFlexed = (colState) => !colState.flex;
 /**
  * Context for AgGrid operations.
  * Make sure you wrap AgGrid in this.
@@ -5625,23 +5598,45 @@ const GridContextProvider = (props) => {
     }, [gridApiOp]);
     /**
      * Resize columns to fit container
+     *
+     * This is used to calculate the preferred size of columns.
+     * It sizes the flex columns first and then clears the calculated width.
+     * If you don't clear flex column widths ag-grid gets confused and does random sizing's.
+     * Then we size the flexed columns.
      */
-    const autoSizeColumns = useCallback(({ skipHeader, colIds, userSizedColIds, includeFlex } = {}) => {
+    const autoSizeColumns = useCallback(({ skipHeader, colIds, userSizedColIds } = {}) => {
         if (!gridApi || !gridApi.getColumnState()) {
             return null;
         }
         const colIdsSet = colIds instanceof Set ? colIds : new Set(colIds);
-        const colsToResize = gridApi.getColumnState()?.filter?.((colState) => {
-            const colId = colState.colId;
-            return ((isEmpty(colIdsSet) || colIdsSet.has(colId)) &&
-                !userSizedColIds?.has(colId) &&
-                (includeFlex || !colState.flex));
-        });
-        if (!isEmpty(colsToResize)) {
-            gridApi.autoSizeColumns(colsToResize.map((colState) => colState.colId), skipHeader);
+        const getVisibleColStates = () => {
+            const colStates = gridApi.getColumnState();
+            return colStates.filter((colState) => {
+                const colId = colState.colId;
+                return (isEmpty(colIdsSet) || colIdsSet.has(colId)) && !userSizedColIds?.has(colId);
+            });
+        };
+        const getFlexColStates = () => getVisibleColStates().filter(colStateFlexed);
+        const getNonFlexColStates = () => getVisibleColStates().filter(colStateNotFlexed);
+        // If we don't reset the flex columns auto size it causes issues with random resizing of flex columns
+        let flexColumns = getFlexColStates();
+        let width = 0;
+        if (!isEmpty(flexColumns)) {
+            gridApi.autoSizeColumns(flexColumns.map(colStateId), skipHeader);
+            const flexColumnIds = flexColumns.map(colStateId);
+            flexColumns = getVisibleColStates().filter((colState) => flexColumnIds.includes(colState.colId));
+            width += sumBy(flexColumns.filter((col) => !col.hide), 'width');
+            gridApi.resetColumnState();
+        }
+        let nonFlexColumns = getNonFlexColStates();
+        if (!isEmpty(nonFlexColumns)) {
+            gridApi.autoSizeColumns(nonFlexColumns.map(colStateId), skipHeader);
+            const nonFlexColumnIds = nonFlexColumns.map(colStateId);
+            nonFlexColumns = getVisibleColStates().filter((colState) => nonFlexColumnIds.includes(colState.colId));
+            width += sumBy(nonFlexColumns.filter((col) => !col.hide), 'width');
         }
         return {
-            width: sumBy(gridApi.getColumnState().filter((col) => !col.hide), 'width'),
+            width,
         };
     }, [gridApi]);
     /**
@@ -6126,5 +6121,5 @@ const useDeferredPromise = () => {
     };
 };
 
-export { ActionButton, CancelPromise, ComponentLoadingWrapper, ControlledMenu, Editor, FocusableItem, FormError, GenericCellEditorComponentWrapper, Grid, GridButton, GridCell, GridCellFiller, GridCellFillerColId, GridCellMultiEditor, GridCellMultiSelectClassRules, GridCellRenderer, GridContext, GridContextProvider, GridEditBoolean, GridFilterButtons, GridFilterColumnsMultiSelect, GridFilterColumnsToggle, GridFilterDownloadCsvButton, GridFilterHeaderIconButton, GridFilterQuick, GridFilters, GridFormDropDown, GridFormEditBearing, GridFormMessage, GridFormMultiSelect, GridFormMultiSelectGrid, GridFormPopoverMenu, GridFormSubComponentTextArea, GridFormSubComponentTextInput, GridFormTextArea, GridFormTextInput, GridIcon, GridLoadableCell, GridNoRowsOverlay, GridNoRowsOverlayFr, GridPopoutEditMultiSelect, GridPopoutEditMultiSelectGrid, GridPopoverContext, GridPopoverContextProvider, GridPopoverEditBearing, GridPopoverEditBearingCorrection, GridPopoverEditBearingCorrectionEditorParams, GridPopoverEditBearingEditorParams, GridPopoverEditDropDown, GridPopoverMenu, GridPopoverMessage, GridPopoverTextArea, GridPopoverTextInput, GridRenderPopoutMenuCell, GridSubComponentContext, GridUpdatingContext, GridUpdatingContextProvider, GridWrapper, Menu, MenuButton, MenuDivider, MenuGroup, MenuHeader, MenuHeaderItem, MenuHeaderString, MenuItem, MenuRadioGroup, MenuSeparator, MenuSeparatorString, PopoutMenuSeparator, SubMenu, TextAreaInput, TextInputFormatted, TextInputValidator, bearingCorrectionRangeValidator, bearingCorrectionValueFormatter, bearingNumberParser, bearingRangeValidator, bearingStringValidator, bearingValueFormatter, convertDDToDMS, createCheckboxMultiFilterParams, defaultValueFormatter, downloadCsvUseValueFormattersProcessCellCallback, findParentWithClass, fnOrVar, generateFilterGetter, hasParentClass, isFloat, isGridCellFiller, isNotEmpty, primitiveToSelectOption, sanitiseFileName, stringByteLengthIsInvalid, suppressCellKeyboardEvents, textMatch, useDeferredPromise, useGridContext, useGridContextMenu, useGridFilter, useGridPopoverContext, useGridPopoverHook, useMenuState, usePostSortRowsHook, wait, waitForCondition };
+export { ActionButton, CancelPromise, ComponentLoadingWrapper, ControlledMenu, Editor, FocusableItem, FormError, GenericCellEditorComponentWrapper, Grid, GridButton, GridCell, GridCellFiller, GridCellFillerColId, GridCellMultiEditor, GridCellMultiSelectClassRules, GridCellRenderer, GridContext, GridContextProvider, GridEditBoolean, GridFilterButtons, GridFilterColumnsMultiSelect, GridFilterColumnsToggle, GridFilterDownloadCsvButton, GridFilterHeaderIconButton, GridFilterQuick, GridFilters, GridFormDropDown, GridFormEditBearing, GridFormMessage, GridFormMultiSelect, GridFormMultiSelectGrid, GridFormPopoverMenu, GridFormSubComponentTextArea, GridFormSubComponentTextInput, GridFormTextArea, GridFormTextInput, GridIcon, GridLoadableCell, GridNoRowsOverlay, GridNoRowsOverlayFr, GridPopoutEditMultiSelect, GridPopoutEditMultiSelectGrid, GridPopoverContext, GridPopoverContextProvider, GridPopoverEditBearing, GridPopoverEditBearingCorrection, GridPopoverEditBearingCorrectionEditorParams, GridPopoverEditBearingEditorParams, GridPopoverEditDropDown, GridPopoverMenu, GridPopoverMessage, GridPopoverTextArea, GridPopoverTextInput, GridRenderPopoutMenuCell, GridSubComponentContext, GridUpdatingContext, GridUpdatingContextProvider, GridWrapper, Menu, MenuButton, MenuDivider, MenuGroup, MenuHeader, MenuHeaderItem, MenuHeaderString, MenuItem, MenuRadioGroup, MenuSeparator, MenuSeparatorString, PopoutMenuSeparator, SubMenu, TextAreaInput, TextInputFormatted, TextInputValidator, bearingCorrectionRangeValidator, bearingCorrectionValueFormatter, bearingNumberParser, bearingRangeValidator, bearingStringValidator, bearingValueFormatter, colStateFlexed, colStateId, colStateNotFlexed, convertDDToDMS, createCheckboxMultiFilterParams, defaultValueFormatter, downloadCsvUseValueFormattersProcessCellCallback, findParentWithClass, fnOrVar, generateFilterGetter, hasParentClass, isFloat, isGridCellFiller, isNotEmpty, primitiveToSelectOption, sanitiseFileName, stringByteLengthIsInvalid, suppressCellKeyboardEvents, textMatch, useDeferredPromise, useGridContext, useGridContextMenu, useGridFilter, useGridPopoverContext, useGridPopoverHook, useMenuState, usePostSortRowsHook, wait, waitForCondition };
 //# sourceMappingURL=step-ag-grid.esm.js.map