@linzjs/step-ag-grid 29.11.4 → 29.12.0

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, delay, omit, sortBy, partition, compact, pick, groupBy, fromPairs, toPairs, isEqual, pull, filter, remove, sumBy, flatten, castArray } from 'lodash-es';
+import { negate, isEmpty, findIndex, defer, debounce as debounce$1, xorBy, last, difference, delay, omit, sortBy, 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';
 import { createRoot } from 'react-dom/client';
@@ -590,6 +590,131 @@ const GridUpdatingContext = 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 = negate(isEmpty);
 const wait = (timeoutMs) => new Promise((resolve) => {
     setTimeout(resolve, timeoutMs);
@@ -641,6 +766,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.
@@ -3124,18 +3263,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 = 0;
+                    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]);
@@ -3378,6 +3547,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 = createContext({
     anchorRef: { current: null },
@@ -5640,47 +5818,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 (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 (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 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 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
@@ -6164,5 +6348,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, 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 };
+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, compareNaturalInsensitive, 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