@linzjs/step-ag-grid 29.11.4 → 29.13.0

package/dist/step-ag-grid.cjs

@@ -428,147 +428,53 @@ function useInterval(callback, delay) {
   }, [delay]);
 }
 
+const NoContext = () => {
+    console.error('Missing GridContextProvider');
+    return null;
+};
 const GridContext = React.createContext({
     gridReady: false,
     gridRenderState: () => null,
-    getColDef: () => {
-        console.error('no context provider for getColDef');
-        return undefined;
-    },
-    getColumns: () => {
-        console.error('no context provider for getColumns');
-        return [];
-    },
-    getColumnIds: () => {
-        console.error('no context provider for getColumnIds');
-        return [];
-    },
+    getColDef: NoContext,
+    getColumns: NoContext,
+    getColumnIds: NoContext,
     invisibleColumnIds: undefined,
-    setInvisibleColumnIds: () => {
-        console.error('no context provider for setInvisibleColumnIds');
-    },
-    prePopupOps: () => {
-        console.error('no context provider for prePopupOps');
-    },
+    setInvisibleColumnIds: NoContext,
+    prePopupOps: NoContext,
     externallySelectedItemsAreInSync: false,
-    setApis: () => {
-        console.error('no context provider for setApis');
-    },
-    setQuickFilter: () => {
-        console.error('no context provider for setQuickFilter');
-    },
-    selectRowsById: () => {
-        console.error('no context provider for selectRows');
-    },
-    getSelectedRows: () => {
-        console.error('no context provider for getSelectedRows');
-        return [];
-    },
-    getFilteredSelectedRows: () => {
-        console.error('no context provider for getFilteredSelectedRows');
-        return [];
-    },
-    getSelectedRowIds: () => {
-        console.error('no context provider for getSelectedRowIds');
-        return [];
-    },
-    getFilteredSelectedRowIds: () => {
-        console.error('no context provider for getFilteredSelectedRowIds');
-        return [];
-    },
-    // eslint-disable-next-line @typescript-eslint/require-await
-    selectRowsDiff: async () => {
-        console.error('no context provider for selectRowsDiff');
-    },
-    selectRowsByIdWithFlash: () => {
-        console.error('no context provider for selectRowsWithFlash');
-    },
-    // eslint-disable-next-line @typescript-eslint/require-await
-    selectRowsWithFlashDiff: async () => {
-        console.error('no context provider for selectRowsWithFlashDiff');
-    },
-    flashRows: () => {
-        console.error('no context provider for flashRows');
-    },
-    // eslint-disable-next-line @typescript-eslint/require-await
-    flashRowsDiff: async () => {
-        console.error('no context provider for flashRows');
-    },
-    // eslint-disable-next-line @typescript-eslint/require-await,@typescript-eslint/no-misused-promises
-    focusByRowById: async () => {
-        console.error('no context provider for focusByRowById');
-    },
-    ensureRowVisible: () => {
-        console.error('no context provider for ensureRowVisible');
-        return true;
-    },
-    ensureSelectedRowIsVisible: () => {
-        console.error('no context provider for ensureSelectedRowIsVisible');
-    },
-    getFirstRowId: () => {
-        console.error('no context provider for getFirstRowId');
-        return -1;
-    },
-    autoSizeColumns: async () => {
-        console.error('no context provider for autoSizeColumns');
-        return Promise.resolve(null);
-    },
-    sizeColumnsToFit: () => {
-        console.error('no context provider for autoSizeAllColumns');
-        return null;
-    },
-    editingCells: () => {
-        console.error('no context provider for editingCells');
-        return false;
-    },
-    // eslint-disable-next-line @typescript-eslint/require-await
-    startCellEditing: async () => {
-        console.error('no context provider for startCellEditing');
-    },
-    resetFocusedCellAfterCellEditing: () => {
-        console.error('no context provider for resetFocusedCellAfterCellEditing');
-    },
-    // eslint-disable-next-line @typescript-eslint/require-await
-    updatingCells: async () => {
-        console.error('no context provider for modifyUpdating');
-        return false;
-    },
-    redrawRows: () => {
-        console.error('no context provider for redrawRows');
-    },
-    setExternallySelectedItemsAreInSync: () => {
-        console.error('no context provider for setExternallySelectedItemsAreInSync');
-    },
-    // eslint-disable-next-line @typescript-eslint/require-await
-    waitForExternallySelectedItemsToBeInSync: async () => {
-        console.error('no context provider for waitForExternallySelectedItemsToBeInSync');
-    },
-    addExternalFilter: () => {
-        console.error('no context provider for addExternalFilter');
-    },
-    removeExternalFilter: () => {
-        console.error('no context provider for removeExternalFilter');
-    },
-    isExternalFilterPresent: () => {
-        console.error('no context provider for isExternalFilterPresent');
-        return false;
-    },
-    doesExternalFilterPass: () => {
-        console.error('no context provider for doesExternalFilterPass');
-        return true;
-    },
-    downloadCsv: () => {
-        console.error('no context provider for downloadCsv');
-    },
-    onBulkEditingComplete: () => {
-        console.error('no context provider for onBulkEditingComplete');
-    },
-    setOnBulkEditingComplete: () => {
-        console.error('no context provider for setOnBulkEditingComplete');
-    },
-    showNoRowsOverlay: () => {
-        console.error('no context provider for showLoadingOverlay');
-    },
+    setApis: NoContext,
+    setQuickFilter: NoContext,
+    selectRowsById: NoContext,
+    getSelectedRows: NoContext,
+    getFilteredSelectedRows: NoContext,
+    getSelectedRowIds: NoContext,
+    getFilteredSelectedRowIds: NoContext,
+    selectRowsDiff: NoContext,
+    selectRowsByIdWithFlash: NoContext,
+    selectRowsWithFlashDiff: NoContext,
+    flashRows: NoContext,
+    flashRowsDiff: NoContext,
+    focusByRowById: NoContext,
+    ensureRowVisible: NoContext,
+    ensureSelectedRowIsVisible: NoContext,
+    getFirstRowId: NoContext,
+    autoSizeColumns: NoContext,
+    sizeColumnsToFit: NoContext,
+    editingCells: NoContext,
+    startCellEditing: NoContext,
+    resetFocusedCellAfterCellEditing: NoContext,
+    updatingCells: NoContext,
+    redrawRows: NoContext,
+    setExternallySelectedItemsAreInSync: NoContext,
+    waitForExternallySelectedItemsToBeInSync: NoContext,
+    addExternalFilter: NoContext,
+    removeExternalFilter: NoContext,
+    isExternalFilterPresent: NoContext,
+    doesExternalFilterPass: NoContext,
+    downloadCsv: NoContext,
+    onBulkEditingComplete: NoContext,
+    setOnBulkEditingComplete: NoContext,
+    showNoRowsOverlay: NoContext,
 });
 const useGridContext = () => React.useContext(GridContext);
 
@@ -592,6 +498,131 @@ const GridUpdatingContext = React.createContext({
     updatedDep: 0,
 });
 
+var lib = {};
+
+var hasRequiredLib;
+
+function requireLib () {
+	if (hasRequiredLib) return lib;
+	hasRequiredLib = 1;
+	Object.defineProperty(lib, "__esModule", { value: true });
+	function natsort(options) {
+	    if (options === void 0) { options = {}; }
+	    var ore = /^0/;
+	    var sre = /\s+/g;
+	    var tre = /^\s+|\s+$/g;
+	    // unicode
+	    var ure = /[^\x00-\x80]/;
+	    // hex
+	    var hre = /^0x[0-9a-f]+$/i;
+	    // numeric
+	    var nre = /(0x[\da-fA-F]+|(^[\+\-]?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?(?=\D|\s|$))|\d+)/g;
+	    // datetime
+	    var dre = /(^([\w ]+,?[\w ]+)?[\w ]+,?[\w ]+\d+:\d+(:\d+)?[\w ]?|^\d{1,4}[\/\-]\d{1,4}[\/\-]\d{1,4}|^\w+, \w+ \d+, \d{4})/; // tslint:disable-line
+	    var toLowerCase = String.prototype.toLocaleLowerCase || String.prototype.toLowerCase;
+	    var GREATER = options.desc ? -1 : 1;
+	    var SMALLER = -GREATER;
+	    var normalize = options.insensitive
+	        ? function (s) { return toLowerCase.call("" + s).replace(tre, ''); }
+	        : function (s) { return ("" + s).replace(tre, ''); };
+	    function tokenize(s) {
+	        return s.replace(nre, '\0$1\0')
+	            .replace(/\0$/, '')
+	            .replace(/^\0/, '')
+	            .split('\0');
+	    }
+	    function parse(s, l) {
+	        // normalize spaces; find floats not starting with '0',
+	        // string or 0 if not defined (Clint Priest)
+	        return (!s.match(ore) || l === 1)
+	            && parseFloat(s)
+	            || s.replace(sre, ' ').replace(tre, '')
+	            || 0;
+	    }
+	    return function (a, b) {
+	        // trim pre-post whitespace
+	        var aa = normalize(a);
+	        var bb = normalize(b);
+	        // return immediately if at least one of the values is empty.
+	        // empty string < any others
+	        if (!aa && !bb) {
+	            return 0;
+	        }
+	        if (!aa && bb) {
+	            return SMALLER;
+	        }
+	        if (aa && !bb) {
+	            return GREATER;
+	        }
+	        // tokenize: split numeric strings and default strings
+	        var aArr = tokenize(aa);
+	        var bArr = tokenize(bb);
+	        // hex or date detection
+	        var aHex = aa.match(hre);
+	        var bHex = bb.match(hre);
+	        var av = (aHex && bHex) ? parseInt(aHex[0], 16) : (aArr.length !== 1 && Date.parse(aa));
+	        var bv = (aHex && bHex)
+	            ? parseInt(bHex[0], 16)
+	            : av && bb.match(dre) && Date.parse(bb) || null;
+	        // try and sort Hex codes or Dates
+	        if (bv) {
+	            if (av === bv) {
+	                return 0;
+	            }
+	            if (av < bv) {
+	                return SMALLER;
+	            }
+	            if (av > bv) {
+	                return GREATER;
+	            }
+	        }
+	        var al = aArr.length;
+	        var bl = bArr.length;
+	        // handle numeric strings and default strings
+	        for (var i = 0, l = Math.max(al, bl); i < l; i += 1) {
+	            var af = parse(aArr[i] || '', al);
+	            var bf = parse(bArr[i] || '', bl);
+	            // handle numeric vs string comparison.
+	            // numeric < string
+	            if (isNaN(af) !== isNaN(bf)) {
+	                return isNaN(af) ? GREATER : SMALLER;
+	            }
+	            // if unicode use locale comparison
+	            if (ure.test(af + bf) && af.localeCompare) {
+	                var comp = af.localeCompare(bf);
+	                if (comp > 0) {
+	                    return GREATER;
+	                }
+	                if (comp < 0) {
+	                    return SMALLER;
+	                }
+	                if (i === l - 1) {
+	                    return 0;
+	                }
+	            }
+	            if (af < bf) {
+	                return SMALLER;
+	            }
+	            if (af > bf) {
+	                return GREATER;
+	            }
+	            if ("" + af < "" + bf) {
+	                return SMALLER;
+	            }
+	            if ("" + af > "" + bf) {
+	                return GREATER;
+	            }
+	        }
+	        return 0;
+	    };
+	}
+	lib.default = natsort;
+	return lib;
+}
+
+var libExports = requireLib();
+var natsort = /*@__PURE__*/getDefaultExportFromCjs(libExports);
+
 const isNotEmpty = lodashEs.negate(lodashEs.isEmpty);
 const wait = (timeoutMs) => new Promise((resolve) => {
     setTimeout(resolve, timeoutMs);
@@ -643,6 +674,20 @@ const sanitiseFileName = (filename) => {
         return valid.slice().slice(0, 64);
     return valid.slice(0, -fileExt.length - 1).slice(0, 64) + '.' + fileExt;
 };
+const naturalSortInsensitive = natsort({ insensitive: true });
+const santitizeNaturalValue = (v) => {
+    if (v === '–' || v === '-' || v == null) {
+        return '';
+    }
+    return String(v);
+};
+const compareNaturalInsensitive = (a, b) => {
+    if ((a !== null && typeof a === 'object') || (b !== null && typeof b === 'object')) {
+        // We can't compare objects
+        return 0;
+    }
+    return naturalSortInsensitive(santitizeNaturalValue(a), santitizeNaturalValue(b));
+};
 
 /**
  * AgGrid checkbox select does not pass clicks within cell but not on the checkbox to checkbox.
@@ -2763,7 +2808,7 @@ agGridCommunity.ModuleRegistry.registerModules([agGridCommunity.AllCommunityModu
 /**
  * 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, suppressReadOnlyStyle = false, ...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, autoSelectFirstRow, onCellFocused: paramsOnCellFocused, maxInitialWidth, suppressReadOnlyStyle = false, externalSelectedItems, setExternalSelectedItems, externalSelectedIds, setExternalSelectedIds, ...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 = React.useRef(false);
@@ -2773,7 +2818,7 @@ const Grid = ({ 'data-testid': dataTestId, defaultPostSort = true, rowSelection
     }, [propStartCellEditing]);
     const { updatedDep, anyUpdating, updatingCols } = React.useContext(GridUpdatingContext);
     const gridDivRef = React.useRef(null);
-    const lastSelectedIds = React.useRef([]);
+    const lastSelectedIds = React.useRef();
     const [staleGrid, setStaleGrid] = React.useState(false);
     const [autoSized, setAutoSized] = React.useState(false);
     const postSortRows = usePostSortRowsHook({ setStaleGrid });
@@ -2899,12 +2944,13 @@ const Grid = ({ 'data-testid': dataTestId, defaultPostSort = true, rowSelection
      */
     const hasSelectedFirstItem = React.useRef(false);
     React.useEffect(() => {
-        if (!gridReady || hasSelectedFirstItem.current || !rowData || !externallySelectedItemsAreInSync)
+        if (!gridReady || hasSelectedFirstItem.current || !rowData || !externallySelectedItemsAreInSync) {
             return;
+        }
         hasSelectedFirstItem.current = true;
-        if (isNotEmpty(rowData) && lodashEs.isEmpty(params.externalSelectedItems)) {
+        if (isNotEmpty(rowData) && lodashEs.isEmpty(externalSelectedItems)) {
             const firstRowId = getFirstRowId();
-            if (params.autoSelectFirstRow) {
+            if (autoSelectFirstRow && selectable) {
                 selectRowsById([firstRowId]);
             }
             else {
@@ -2915,31 +2961,51 @@ const Grid = ({ 'data-testid': dataTestId, defaultPostSort = true, rowSelection
         externallySelectedItemsAreInSync,
         focusByRowById,
         gridReady,
-        params.externalSelectedItems,
-        params.autoSelectFirstRow,
+        externalSelectedItems,
+        autoSelectFirstRow,
         rowData,
         selectRowsById,
         getFirstRowId,
+        selectable,
     ]);
     /**
      * Ensure external selected items list is in sync with panel.
      */
     const synchroniseExternalStateToGridSelection = React.useCallback(({ api }) => {
-        if (!params.externalSelectedItems || !params.setExternalSelectedItems) {
-            setExternallySelectedItemsAreInSync(true);
-            return;
+        if (externalSelectedIds && setExternalSelectedIds) {
+            const selectedRowsIds = api.getSelectedRows().map((row) => row.id);
+            // We don't want to update selected Items if it hasn't changed to prevent excess renders
+            if (externalSelectedIds.length !== selectedRowsIds.length ||
+                isNotEmpty(lodashEs.xorBy(selectedRowsIds, externalSelectedIds))) {
+                setExternallySelectedItemsAreInSync(false);
+                setExternalSelectedIds([...selectedRowsIds]);
+            }
+            else {
+                setExternallySelectedItemsAreInSync(true);
+            }
         }
-        const selectedRows = api.getSelectedRows();
-        // We don't want to update selected Items if it hasn't changed to prevent excess renders
-        if (params.externalSelectedItems.length !== selectedRows.length ||
-            isNotEmpty(lodashEs.xorBy(selectedRows, params.externalSelectedItems, (row) => row.id))) {
-            setExternallySelectedItemsAreInSync(false);
-            params.setExternalSelectedItems([...selectedRows]);
+        else if (externalSelectedItems && setExternalSelectedItems) {
+            const selectedRows = api.getSelectedRows();
+            // We don't want to update selected Items if it hasn't changed to prevent excess renders
+            if (externalSelectedItems.length !== selectedRows.length ||
+                isNotEmpty(lodashEs.xorBy(selectedRows, externalSelectedItems, (row) => row.id))) {
+                setExternallySelectedItemsAreInSync(false);
+                setExternalSelectedItems([...selectedRows]);
+            }
+            else {
+                setExternallySelectedItemsAreInSync(true);
+            }
         }
         else {
             setExternallySelectedItemsAreInSync(true);
         }
-    }, [params, setExternallySelectedItemsAreInSync]);
+    }, [
+        externalSelectedIds,
+        externalSelectedItems,
+        setExternalSelectedIds,
+        setExternalSelectedItems,
+        setExternallySelectedItemsAreInSync,
+    ]);
     /**
      * Synchronise externally selected items to grid.
      * If new ids are selected scroll them into view.
@@ -2947,19 +3013,26 @@ const Grid = ({ 'data-testid': dataTestId, defaultPostSort = true, rowSelection
     const synchroniseExternallySelectedItemsToGrid = React.useCallback(() => {
         if (!gridReady)
             return;
-        if (!params.externalSelectedItems) {
+        if (!externalSelectedItems && !externalSelectedIds) {
             setExternallySelectedItemsAreInSync(true);
             return;
         }
-        const selectedIds = params.externalSelectedItems.map((row) => row.id);
-        const lastNewId = lodashEs.last(lodashEs.difference(selectedIds, lastSelectedIds.current));
+        const selectedIds = externalSelectedIds ?? externalSelectedItems?.map((row) => row.id);
+        const lastNewId = lodashEs.last(lodashEs.difference(selectedIds, lastSelectedIds.current ?? []));
         if (lastNewId != null) {
             ensureRowVisible(lastNewId);
         }
         lastSelectedIds.current = selectedIds;
         selectRowsById(selectedIds);
         setExternallySelectedItemsAreInSync(true);
-    }, [gridReady, params.externalSelectedItems, ensureRowVisible, selectRowsById, setExternallySelectedItemsAreInSync]);
+    }, [
+        gridReady,
+        externalSelectedItems,
+        externalSelectedIds,
+        selectRowsById,
+        setExternallySelectedItemsAreInSync,
+        ensureRowVisible,
+    ]);
     /**
      * Combine grid and cell editable into one function
      */
@@ -3001,7 +3074,7 @@ const Grid = ({ 'data-testid': dataTestId, defaultPostSort = true, rowSelection
     const columnDefs = React.useMemo(() => {
         return params.columnDefs.map(mapColDef);
     }, [params.columnDefs, mapColDef]);
-    const hasExternallySelectedItems = !!params.setExternalSelectedItems;
+    const hasExternallySelectedItems = !!setExternalSelectedItems || !!setExternalSelectedIds;
     /**
      * When grid is ready set the apis to the grid context and sync selected items to grid.
      */
@@ -3126,18 +3199,48 @@ const Grid = ({ 'data-testid': dataTestId, defaultPostSort = true, rowSelection
         });
         const adjustColDef = (colDef) => {
             const flex = colDef.flex ?? (sizeColumns === 'fit' ? 1 : undefined);
-            return {
+            const valueFormatter = colDef.valueFormatter;
+            const sortable = colDef.sortable && params.defaultColDef?.sortable !== false;
+            let comparator = colDef.comparator;
+            if (sortable && !comparator) {
+                comparator = (value1, value2, node1, node2) => {
+                    let r;
+                    if (typeof valueFormatter === 'function') {
+                        r = compareNaturalInsensitive(valueFormatter({
+                            data: node1.data,
+                            value: value1,
+                            node: node1,
+                            colDef: adjustedColDef,
+                            ...NotAGridValueFormatterCall,
+                        }), valueFormatter({
+                            data: node2.data,
+                            value: value2,
+                            node: node2,
+                            colDef: adjustedColDef,
+                            ...NotAGridValueFormatterCall,
+                        }));
+                    }
+                    else {
+                        r = compareNaturalInsensitive(value1, value2);
+                    }
+                    // secondary compare as primary sort column rows are equal
+                    return r === 0 ? compareNaturalInsensitive(node1.data?.id, node2.data?.id) : r;
+                };
+            }
+            const adjustedColDef = {
                 ...colDef,
                 // You cannot pass a width to a flex
                 width: !!colDef.flex ? undefined : colDef.width,
-                flexAutoSizeWidth: colDef.width,
+                ...(!!colDef.flex && { flexAutoSizeWidth: colDef.width }),
                 // If this is allowed flex columns don't size based on flex
                 suppressSizeToFit: true,
                 // Auto-sizing flex columns breaks everything
                 flex,
                 suppressAutoSize: !!flex,
-                sortable: colDef.sortable && params.defaultColDef?.sortable !== false,
+                sortable,
+                comparator,
             };
+            return adjustedColDef;
         };
         return columnDefs.map((colDef) => adjustColDefOrGroup(colDef));
     }, [columnDefs, params.defaultColDef?.sortable, sizeColumns]);
@@ -3298,11 +3401,14 @@ const Grid = ({ 'data-testid': dataTestId, defaultPostSort = true, rowSelection
         }
     }, [params, clearHighlightRowClasses]);
     React.useEffect(() => {
-        if (params.setExternalSelectedItems && selectable == null) {
-            console.warn('<Grid/> has setExternalSelectedItems parameter, but is missing selectable parameter,' +
+        if ((setExternalSelectedItems || setExternalSelectedIds) && selectable == null) {
+            console.warn('<Grid/> has setExternalSelectedItems/setExternalSelectedIds parameter, but is missing selectable parameter,' +
                 'this will cause weird delays in editing.\nIf you need to hide selection column use hideSelectColumn=true');
         }
-    }, [params.setExternalSelectedItems, selectable]);
+    }, 
+    // Only needs to run on startup
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [selectable]);
     // This is setting a ref in the GridContext so won't be triggering an update loop
     setOnBulkEditingComplete(params.onBulkEditingComplete);
     const getRowId = React.useCallback((params) => `${params.data.id}`, []);
@@ -3346,19 +3452,9 @@ const Grid = ({ 'data-testid': dataTestId, defaultPostSort = true, rowSelection
                 }
                 return false;
             },
-            onCellClicked: params.enableSelectionWithoutKeys || params.enableClickSelection
-                ? undefined
-                : clickInputWhenContainingCellClicked,
+            onCellClicked: clickInputWhenContainingCellClicked,
         };
-    }, [
-        params.enableClickSelection,
-        params.enableSelectionWithoutKeys,
-        params.hideSelectColumn,
-        params.onRowDragEnd,
-        rowSelection,
-        selectColumnPinned,
-        selectable,
-    ]);
+    }, [params.hideSelectColumn, params.onRowDragEnd, rowSelection, selectColumnPinned, selectable]);
     const onGridSizeChanged = React.useCallback((event) => {
         if (sizeColumns === 'fit' || (['auto', 'auto-skip-headers'].includes(sizeColumns) && hasSetContentSize.current)) {
             event.api.sizeColumnsToFit();
@@ -3380,6 +3476,15 @@ const quickFilterParser = (filterStr) => {
     // filter is exact matches exactly groups separated by commas
     return filterStr.split(',').map((str) => str.trim());
 };
+/**
+ * Columns to indicate to user when they debug why things are broken in the default comparator if their valueFormatter
+ * is too complicated.
+ */
+const NotAGridValueFormatterCall = {
+    column: 'Default comparator has no access to column, write your own comparator',
+    api: 'Default comparator has no access to api, write your own comparator',
+    context: 'Default comparator has no access to context, write your own comparator',
+};
 
 const GridPopoverContext = React.createContext({
     anchorRef: { current: null },
@@ -5642,47 +5747,53 @@ const GridContextProvider = (props) => {
         if (!gridApi || !gridApi.getColumnState()) {
             return null;
         }
-        const colIdsSet = colIds instanceof Set ? colIds : new Set(colIds);
-        const getVisibleColStates = () => {
-            const colStates = gridApi.getColumnState();
-            return colStates.filter((colState) => {
-                const colId = colState.colId;
-                return (lodashEs.isEmpty(colIdsSet) || colIdsSet.has(colId)) && !userSizedColIds?.has(colId);
+        try {
+            const colIdsSet = colIds instanceof Set ? colIds : new Set(colIds);
+            const getVisibleColStates = () => {
+                const colStates = gridApi.getColumnState();
+                return colStates.filter((colState) => {
+                    const colId = colState.colId;
+                    return (lodashEs.isEmpty(colIdsSet) || colIdsSet.has(colId)) && !userSizedColIds?.has(colId);
+                });
+            };
+            const getFlexColStates = () => getVisibleColStates().filter(colStateFlexed);
+            const getNonFlexColStates = () => getVisibleColStates().filter(colStateNotFlexed);
+            // You cannot autosize flex columns it will break layout randomly
+            // So, a flex column is assumed to be 150 wide, unless width is provided
+            const flexColumns = getFlexColStates().map(colStateId);
+            let width = 0;
+            flexColumns.forEach((colId) => {
+                const colDef = gridApi.getColumnDef(colId);
+                width += colDef?.flexAutoSizeWidth ?? 200;
             });
-        };
-        const getFlexColStates = () => getVisibleColStates().filter(colStateFlexed);
-        const getNonFlexColStates = () => getVisibleColStates().filter(colStateNotFlexed);
-        // You cannot autosize flex columns it will break layout randomly
-        // So, a flex column is assumed to be 150 wide, unless width is provided
-        const flexColumns = getFlexColStates().map(colStateId);
-        let width = 0;
-        flexColumns.forEach((colId) => {
-            const colDef = gridApi.getColumnDef(colId);
-            width += colDef?.flexAutoSizeWidth ?? 200;
-        });
-        const nonFlexColumns = getNonFlexColStates();
-        const nonFlexColumnIds = nonFlexColumns.map(colStateId);
-        gridApi.autoSizeColumns({ colIds: nonFlexColumnIds, skipHeader });
-        const calcSubWidth = () => {
-            const updatedFlexColumns = getVisibleColStates().filter((colState) => nonFlexColumnIds.includes(colState.colId));
-            return lodashEs.sumBy(updatedFlexColumns.filter((col) => !col.hide), 'width');
-        };
-        // ag-grid updates widths asynchronously, so we wait here for the default calculated width to change
-        let lastSubWidth = calcSubWidth();
-        const endTime = Date.now() + 1000;
-        while (Date.now() < endTime) {
-            await wait(40);
-            const newSubWidth = calcSubWidth();
-            if (lastSubWidth !== newSubWidth) {
-                lastSubWidth = newSubWidth;
-                break;
+            const nonFlexColumns = getNonFlexColStates();
+            const nonFlexColumnIds = nonFlexColumns.map(colStateId);
+            gridApi.autoSizeColumns({ colIds: nonFlexColumnIds, skipHeader });
+            const calcSubWidth = () => {
+                const updatedFlexColumns = getVisibleColStates().filter((colState) => nonFlexColumnIds.includes(colState.colId));
+                return lodashEs.sumBy(updatedFlexColumns.filter((col) => !col.hide), 'width');
+            };
+            // ag-grid updates widths asynchronously, so we wait here for the default calculated width to change
+            let lastSubWidth = calcSubWidth();
+            const endTime = Date.now() + 1000;
+            while (Date.now() < endTime) {
+                await wait(40);
+                const newSubWidth = calcSubWidth();
+                if (lastSubWidth !== newSubWidth) {
+                    lastSubWidth = newSubWidth;
+                    break;
+                }
             }
+            width += lastSubWidth;
+            gridApi.sizeColumnsToFit();
+            return {
+                width,
+            };
+        }
+        catch (ex) {
+            console.info('autosize failed', ex);
+            return null;
         }
-        width += lastSubWidth;
-        gridApi.sizeColumnsToFit();
-        return {
-            width,
-        };
     }, [gridApi]);
     /**
      * Resize columns to fit container
@@ -6249,6 +6360,7 @@ exports.bearingValueFormatter = bearingValueFormatter;
 exports.colStateFlexed = colStateFlexed;
 exports.colStateId = colStateId;
 exports.colStateNotFlexed = colStateNotFlexed;
+exports.compareNaturalInsensitive = compareNaturalInsensitive;
 exports.convertDDToDMS = convertDDToDMS;
 exports.createCheckboxMultiFilterParams = createCheckboxMultiFilterParams;
 exports.defaultValueFormatter = defaultValueFormatter;