@linzjs/step-ag-grid 13.3.2 → 13.5.0

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

@@ -1,7 +1,7 @@
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { LuiMiniSpinner, LuiIcon, LuiButton, LuiCheckboxInput, LuiButtonGroup } from '@linzjs/lui';
 import { AgGridReact } from 'ag-grid-react';
-import { negate, isEmpty, xorBy, last, difference, sortBy, findIndex, debounce, partition, omit, pick, groupBy, fromPairs, toPairs, delay, defer as defer$1, compact, remove, castArray, flatten, isEqual } from 'lodash-es';
+import { negate, isEmpty, xorBy, last, difference, sortBy, findIndex, debounce, delay, partition, omit, pick, groupBy, fromPairs, toPairs, defer as defer$1, compact, remove, castArray, flatten, isEqual } from 'lodash-es';
 import * as React from 'react';
 import { createContext, useContext, useRef, useCallback, useState, useEffect, useMemo, forwardRef, useLayoutEffect, memo, useReducer, cloneElement, useImperativeHandle, Fragment as Fragment$1 } from 'react';
 import ReactDOM, { unstable_batchedUpdates, flushSync, createPortal } from 'react-dom';
@@ -244,6 +244,9 @@ var GridContext = createContext({
     doesExternalFilterPass: function () {
         console.error("no context provider for doesExternalFilterPass");
         return true;
+    },
+    downloadCsv: function () {
+        console.error("no context provider for downloadCsv");
     }
 });
 var useGridContext = function () { return useContext(GridContext); };
@@ -262,6 +265,144 @@ var GridUpdatingContext = createContext({
     updatedDep: 0
 });
 
+var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
+
+function getDefaultExportFromCjs (x) {
+	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
+}
+
+function getAugmentedNamespace(n) {
+  if (n.__esModule) return n;
+  var f = n.default;
+	if (typeof f == "function") {
+		var a = function a () {
+			if (this instanceof a) {
+				var args = [null];
+				args.push.apply(args, arguments);
+				var Ctor = Function.bind.apply(f, args);
+				return new Ctor();
+			}
+			return f.apply(this, arguments);
+		};
+		a.prototype = f.prototype;
+  } else a = {};
+  Object.defineProperty(a, '__esModule', {value: true});
+	Object.keys(n).forEach(function (k) {
+		var d = Object.getOwnPropertyDescriptor(n, k);
+		Object.defineProperty(a, k, d.get ? d : {
+			enumerable: true,
+			get: function () {
+				return n[k];
+			}
+		});
+	});
+	return a;
+}
+
+function isHighSurrogate(codePoint) {
+  return codePoint >= 0xd800 && codePoint <= 0xdbff;
+}
+
+function isLowSurrogate(codePoint) {
+  return codePoint >= 0xdc00 && codePoint <= 0xdfff;
+}
+
+// Truncate string by size in bytes
+var truncate$2 = function truncate(getLength, string, byteLength) {
+  if (typeof string !== "string") {
+    throw new Error("Input must be string");
+  }
+
+  var charLength = string.length;
+  var curByteLength = 0;
+  var codePoint;
+  var segment;
+
+  for (var i = 0; i < charLength; i += 1) {
+    codePoint = string.charCodeAt(i);
+    segment = string[i];
+
+    if (isHighSurrogate(codePoint) && isLowSurrogate(string.charCodeAt(i + 1))) {
+      i += 1;
+      segment += string[i];
+    }
+
+    curByteLength += getLength(segment);
+
+    if (curByteLength === byteLength) {
+      return string.slice(0, i + 1);
+    }
+    else if (curByteLength > byteLength) {
+      return string.slice(0, i - segment.length + 1);
+    }
+  }
+
+  return string;
+};
+
+var truncate$1 = truncate$2;
+var getLength = Buffer.byteLength.bind(Buffer);
+var truncateUtf8Bytes = truncate$1.bind(null, getLength);
+
+/*jshint node:true*/
+
+/**
+ * Replaces characters in strings that are illegal/unsafe for filenames.
+ * Unsafe characters are either removed or replaced by a substitute set
+ * in the optional `options` object.
+ *
+ * Illegal Characters on Various Operating Systems
+ * / ? < > \ : * | "
+ * https://kb.acronis.com/content/39790
+ *
+ * Unicode Control codes
+ * C0 0x00-0x1f & C1 (0x80-0x9f)
+ * http://en.wikipedia.org/wiki/C0_and_C1_control_codes
+ *
+ * Reserved filenames on Unix-based systems (".", "..")
+ * Reserved filenames in Windows ("CON", "PRN", "AUX", "NUL", "COM1",
+ * "COM2", "COM3", "COM4", "COM5", "COM6", "COM7", "COM8", "COM9",
+ * "LPT1", "LPT2", "LPT3", "LPT4", "LPT5", "LPT6", "LPT7", "LPT8", and
+ * "LPT9") case-insesitively and with or without filename extensions.
+ *
+ * Capped at 255 characters in length.
+ * http://unix.stackexchange.com/questions/32795/what-is-the-maximum-allowed-filename-and-folder-size-with-ecryptfs
+ *
+ * @param  {String} input   Original filename
+ * @param  {Object} options {replacement: String | Function }
+ * @return {String}         Sanitized filename
+ */
+
+var truncate = truncateUtf8Bytes;
+
+var illegalRe = /[\/\?<>\\:\*\|"]/g;
+var controlRe = /[\x00-\x1f\x80-\x9f]/g;
+var reservedRe = /^\.+$/;
+var windowsReservedRe = /^(con|prn|aux|nul|com[0-9]|lpt[0-9])(\..*)?$/i;
+var windowsTrailingRe = /[\. ]+$/;
+
+function sanitize(input, replacement) {
+  if (typeof input !== 'string') {
+    throw new Error('Input must be string');
+  }
+  var sanitized = input
+    .replace(illegalRe, replacement)
+    .replace(controlRe, replacement)
+    .replace(reservedRe, replacement)
+    .replace(windowsReservedRe, replacement)
+    .replace(windowsTrailingRe, replacement);
+  return truncate(sanitized, 255);
+}
+
+var sanitizeFilename = function (input, options) {
+  var replacement = (options && options.replacement) || '';
+  var output = sanitize(input, replacement);
+  if (replacement === '') {
+    return output;
+  }
+  return sanitize(output, '');
+};
+
 var isNotEmpty = negate(isEmpty);
 var wait$2 = function (timeoutMs) {
     return new Promise(function (resolve) {
@@ -293,7 +434,16 @@ var hasParentClass = function (className, child) {
 var stringByteLengthIsInvalid = function (str, maxBytes) {
     return new TextEncoder().encode(str).length > maxBytes;
 };
-var fnOrVar = function (fn, param) { return (typeof fn === "function" ? fn(param) : fn); };
+var fnOrVar = function (fn, param) { return (typeof fn === "function" ? fn(param) : fn); };
+/**
+ * Trim filename and replaces troublesome characters.
+ *
+ * e.g. " LT 1235/543 &%//*$ " => "LT_1235-543_&%-$"
+ * e.g. " @filename here!!!" => "@filename_here!!!"
+ */
+var sanitiseFileName = function (filename) {
+    return sanitizeFilename(filename.trim().replaceAll(/(\/|\\)+/g, "-")).replaceAll(/\s+/g, "_");
+};
 
 var GridNoRowsOverlay = function (params) {
     var _a;
@@ -619,6 +769,9 @@ var Grid = function (_a) {
                     colId: "selection",
                     editable: false,
                     minWidth: 42,
+                    headerComponentParams: {
+                        exportable: false
+                    },
                     maxWidth: 42,
                     suppressSizeToFit: true,
                     checkboxSelection: true,
@@ -713,7 +866,7 @@ var Grid = function (_a) {
             sizeColumnsToFit();
         }
     }, [columnDefs === null || columnDefs === void 0 ? void 0 : columnDefs.length, sizeColumnsToFit]);
-    return (jsx("div", __assign({ "data-testid": dataTestId, className: clsx("Grid-container", theme, staleGrid && "Grid-sortIsStale", gridReady && params.rowData && "Grid-ready") }, { children: jsx("div", __assign({ style: { flex: 1 } }, { children: jsx(AgGridReact, { animateRows: params.animateRows, rowClassRules: params.rowClassRules, getRowId: function (params) { return "".concat(params.data.id); }, suppressRowClickSelection: true, rowSelection: rowSelection, suppressBrowserResizeObserver: true, colResizeDefault: "shift", onFirstDataRendered: (_c = params.onFirstDataRendered) !== null && _c !== void 0 ? _c : sizeColumnsToFit, onGridSizeChanged: (_d = params.onGridSizeChanged) !== null && _d !== void 0 ? _d : sizeColumnsToFit, suppressColumnVirtualisation: suppressColumnVirtualization, suppressClickEdit: true, onCellKeyPress: onCellKeyPress, onCellClicked: onCellClicked, onCellDoubleClicked: onCellDoubleClick, onCellEditingStarted: refreshSelectedRows, domLayout: params.domLayout, columnDefs: columnDefs, rowData: params.rowData, noRowsOverlayComponent: GridNoRowsOverlay, noRowsOverlayComponentParams: { rowData: params.rowData, noRowsOverlayText: params.noRowsOverlayText }, onModelUpdated: onModelUpdated, onGridReady: onGridReady, onSortChanged: ensureSelectedRowIsVisible, postSortRows: (_e = params.postSortRows) !== null && _e !== void 0 ? _e : postSortRows, onSelectionChanged: synchroniseExternalStateToGridSelection, onColumnMoved: params.onColumnMoved, alwaysShowVerticalScroll: params.alwaysShowVerticalScroll, isExternalFilterPresent: isExternalFilterPresent, doesExternalFilterPass: doesExternalFilterPass }) })) })));
+    return (jsx("div", __assign({ "data-testid": dataTestId, className: clsx("Grid-container", theme, staleGrid && "Grid-sortIsStale", gridReady && params.rowData && "Grid-ready") }, { children: jsx("div", __assign({ style: { flex: 1 } }, { children: jsx(AgGridReact, { animateRows: params.animateRows, rowClassRules: params.rowClassRules, getRowId: function (params) { return "".concat(params.data.id); }, suppressRowClickSelection: true, rowSelection: rowSelection, suppressBrowserResizeObserver: true, colResizeDefault: "shift", onFirstDataRendered: (_c = params.onFirstDataRendered) !== null && _c !== void 0 ? _c : sizeColumnsToFit, onGridSizeChanged: (_d = params.onGridSizeChanged) !== null && _d !== void 0 ? _d : sizeColumnsToFit, suppressColumnVirtualisation: suppressColumnVirtualization, suppressClickEdit: true, onCellKeyPress: onCellKeyPress, onCellClicked: onCellClicked, onCellDoubleClicked: onCellDoubleClick, onCellEditingStarted: refreshSelectedRows, domLayout: params.domLayout, columnDefs: columnDefs, rowData: params.rowData, noRowsOverlayComponent: GridNoRowsOverlay, noRowsOverlayComponentParams: { rowData: params.rowData, noRowsOverlayText: params.noRowsOverlayText }, onModelUpdated: onModelUpdated, onGridReady: onGridReady, onSortChanged: ensureSelectedRowIsVisible, postSortRows: (_e = params.postSortRows) !== null && _e !== void 0 ? _e : postSortRows, onSelectionChanged: synchroniseExternalStateToGridSelection, onColumnMoved: params.onColumnMoved, alwaysShowVerticalScroll: params.alwaysShowVerticalScroll, isExternalFilterPresent: isExternalFilterPresent, doesExternalFilterPass: doesExternalFilterPass, maintainColumnOrder: true }) })) })));
 };
 
 var GridPopoverContext = createContext({
@@ -859,6 +1012,9 @@ var GridCell = function (props, custom) {
     // This is so that e.g. bearings can be searched for by DMS or raw number.
     var valueFormatter = props.valueFormatter;
     var filterValueGetter = generateFilterGetter(props.field, props.filterValueGetter, valueFormatter);
+    var exportable = props.exportable;
+    // Can't leave this here ag-grid will complain
+    delete props.exportable;
     return __assign(__assign(__assign(__assign(__assign(__assign({ colId: props.field, sortable: !!((props === null || props === void 0 ? void 0 : props.field) || (props === null || props === void 0 ? void 0 : props.valueGetter)), resizable: true, editable: (_a = props.editable) !== null && _a !== void 0 ? _a : false }, ((custom === null || custom === void 0 ? void 0 : custom.editor) && {
         cellClassRules: GridCellMultiSelectClassRules,
         editable: (_b = props.editable) !== null && _b !== void 0 ? _b : true,
@@ -877,7 +1033,7 @@ var GridCell = function (props, custom) {
                 return "".concat(params.value);
             else
                 return JSON.stringify(params.value);
-        } }), props), { cellRenderer: GridCellRenderer, cellRendererParams: __assign({ originalCellRenderer: props.cellRenderer }, props.cellRendererParams) });
+        } }), props), { cellRenderer: GridCellRenderer, cellRendererParams: __assign({ originalCellRenderer: props.cellRenderer }, props.cellRendererParams), headerComponentParams: __assign({ exportable: exportable }, props.headerComponentParams) });
 };
 var GenericCellEditorComponentWrapper = function (editor) {
     var obj = { editor: editor };
@@ -913,7 +1069,7 @@ var GridCellMultiEditor = function (props, cellEditorSelector) {
 
 var GridFilterHeaderIconButton = forwardRef(function columnsButton(_a, ref) {
     var icon = _a.icon, title = _a.title, onClick = _a.onClick, buttonProps = _a.buttonProps, _b = _a.disabled, disabled = _b === void 0 ? false : _b, _c = _a.size, size = _c === void 0 ? "md" : _c;
-    return (jsx(LuiButton, __assign({}, buttonProps, { type: "button", level: "tertiary", className: "GridFilterHeaderIconButton lui-button-icon-only", ref: ref, "aria-label": title, title: title, onClick: onClick, disabled: disabled }, { children: jsx(LuiIcon, { name: icon, alt: "Menu", size: size }) })));
+    return (jsx(LuiButton, __assign({}, buttonProps, { type: "button", level: "tertiary", className: "lui-button-icon-only", ref: ref, "aria-label": title, title: title, onClick: onClick, disabled: disabled }, { children: jsx(LuiIcon, { name: icon, alt: "Menu", size: size }) })));
 });
 
 // Generate className following BEM methodology: http://getbem.com/naming/
@@ -2863,9 +3019,9 @@ var GridFilterQuick = function (_a) {
     useEffect(function () {
         setQuickFilter(quickFilterValue);
     }, [quickFilterValue, setQuickFilter]);
-    return (jsx("input", { "aria-label": "Search", className: "Grid-quickFilterBox", type: "text", placeholder: quickFilterPlaceholder !== null && quickFilterPlaceholder !== void 0 ? quickFilterPlaceholder : "Search...", value: quickFilterValue, onChange: function (event) {
-            setQuickFilterValue(event.target.value);
-        } }));
+    return (jsx("div", __assign({ className: "GridFilterQuick-container" }, { children: jsx("input", { "aria-label": "Search", className: "GridFilterQuick-input", type: "text", placeholder: quickFilterPlaceholder !== null && quickFilterPlaceholder !== void 0 ? quickFilterPlaceholder : "Search...", value: quickFilterValue, onChange: function (event) {
+                setQuickFilterValue(event.target.value);
+            } }) })));
 };
 
 var GridFilters = function (_a) {
@@ -2873,39 +3029,79 @@ var GridFilters = function (_a) {
     return jsx("div", __assign({ className: "Grid-container-filters" }, { children: children }));
 };
 
-var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
+/**
+ * Cancels timeouts on scope being destroyed.
+ *
+ * This could almost be a debounce, but debounce tracks by function reference, this tracks by hook reference.
+ * This could have been implemented using debounce if the callers function was wrapped in useCallback,
+ * but there's no way to enforce that, so  it would lead to bugs.
+ */
+var useTimeoutHook = function () {
+    var timeout = useRef();
+    /**
+     * Clear any pending timeouts.
+     */
+    var clearTimeouts = function () {
+        if (timeout.current) {
+            var tc = timeout.current;
+            timeout.current = undefined;
+            clearTimeout(tc);
+        }
+    };
+    /**
+     * Call this when your action has completed.
+     */
+    var invoke = useCallback(function (fn, waitTimeMs) {
+        clearTimeouts();
+        timeout.current = setTimeout(fn, waitTimeMs);
+    }, []);
+    /**
+     * Clear timeout on loss of scope.
+     */
+    useEffect(function () {
+        return function () { return clearTimeouts(); };
+    }, []);
+    return invoke;
+};
 
-function getDefaultExportFromCjs (x) {
-	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
-}
+/**
+ * Defers state change up to a minimum time since last state change.
+ */
+var useStateDeferred = function (initialValue) {
+    var startTime = useRef(0);
+    var timeoutHook = useTimeoutHook();
+    var _a = useState(initialValue), value = _a[0], _setValue = _a[1];
+    var setValue = useCallback(function (newValue) {
+        startTime.current = Date.now();
+        _setValue(newValue);
+    }, []);
+    var setValueDeferred = useCallback(function (newValue, minimumWaitTimeMs) {
+        var waitTimeMs = Math.max(minimumWaitTimeMs - (Date.now() - startTime.current), 0);
+        timeoutHook(function () { return _setValue(newValue); }, waitTimeMs);
+    }, [timeoutHook]);
+    return [value, setValue, setValueDeferred];
+};
 
-function getAugmentedNamespace(n) {
-  if (n.__esModule) return n;
-  var f = n.default;
-	if (typeof f == "function") {
-		var a = function a () {
-			if (this instanceof a) {
-				var args = [null];
-				args.push.apply(args, arguments);
-				var Ctor = Function.bind.apply(f, args);
-				return new Ctor();
-			}
-			return f.apply(this, arguments);
-		};
-		a.prototype = f.prototype;
-  } else a = {};
-  Object.defineProperty(a, '__esModule', {value: true});
-	Object.keys(n).forEach(function (k) {
-		var d = Object.getOwnPropertyDescriptor(n, k);
-		Object.defineProperty(a, k, d.get ? d : {
-			enumerable: true,
-			get: function () {
-				return n[k];
-			}
-		});
-	});
-	return a;
-}
+var GridFilterDownloadCsvButton = function (csvExportParams) {
+    var _a;
+    var downloadCsv = useContext(GridContext).downloadCsv;
+    var _b = useStateDeferred(false), downloading = _b[0], setDownloading = _b[1], setDownloadingDeferred = _b[2];
+    var handleDownloadClick = function () {
+        setDownloading(true);
+        // Defer the download such that the component disabled state can update
+        delay(function () {
+            downloadCsv(csvExportParams);
+            // Defer re-enablement as the browser takes time to process the download
+            setDownloadingDeferred(false, 4000);
+        }, 100);
+    };
+    return downloading ? (jsx(LuiMiniSpinner, { size: 22, divProps: (_a = {
+                role: "status"
+            },
+            _a["aria-label"] = "Downloading...",
+            _a.style = { width: 42, display: "flex", justifyContent: "center" },
+            _a) })) : (jsx(GridFilterHeaderIconButton, { icon: "ic_save_download", title: "Download CSV", onClick: handleDownloadClick, disabled: downloading }));
+};
 
 /* global setTimeout, clearTimeout */
 
@@ -4255,7 +4451,7 @@ var GridRenderPopoutMenuCell = function (props) {
  * Popout burger menu
  */
 var GridPopoverMenu = function (colDef, custom) {
-    return GridCell(__assign(__assign({ minWidth: 48, maxWidth: 48, width: 40, editable: colDef.editable != null ? colDef.editable : true, cellStyle: { justifyContent: "center" }, cellRenderer: GridRenderPopoutMenuCell }, colDef), { cellRendererParams: {
+    return GridCell(__assign(__assign({ minWidth: 48, maxWidth: 48, width: 40, editable: colDef.editable != null ? colDef.editable : true, exportable: false, cellStyle: { justifyContent: "center" }, cellRenderer: GridRenderPopoutMenuCell }, colDef), { cellRendererParams: {
             // Menus open on single click, this parameter is picked up in Grid.tsx
             singleClickEdit: true
         } }), __assign({ editor: GridFormPopoverMenu }, custom));
@@ -4652,6 +4848,11 @@ var GridContextProvider = function (props) {
             gridApi.redrawRows(rowNodes ? { rowNodes: rowNodes } : undefined);
         });
     }, [gridApiOp]);
+    // waitForExternallySelectedItemsToBeInSync can't use the state as it won't be updated during function execution
+    var externallySelectedItemsAreInSyncRef = useRef(false);
+    useEffect(function () {
+        externallySelectedItemsAreInSyncRef.current = externallySelectedItemsAreInSync;
+    }, [externallySelectedItemsAreInSync]);
     var waitForExternallySelectedItemsToBeInSync = useCallback(function () { return __awaiter(void 0, void 0, void 0, function () {
         var i;
         return __generator(this, function (_a) {
@@ -4660,7 +4861,7 @@ var GridContextProvider = function (props) {
                     i = 0;
                     _a.label = 1;
                 case 1:
-                    if (!(i < 5000 / 200 && !externallySelectedItemsAreInSync)) return [3 /*break*/, 4];
+                    if (!(i < 5000 / 200 && !externallySelectedItemsAreInSyncRef.current)) return [3 /*break*/, 4];
                     return [4 /*yield*/, wait$2(200)];
                 case 2:
                     _a.sent();
@@ -4671,7 +4872,7 @@ var GridContextProvider = function (props) {
                 case 4: return [2 /*return*/];
             }
         });
-    }); }, [externallySelectedItemsAreInSync]);
+    }); }, []);
     var onFilterChanged = useMemo(function () {
         return debounce(function () {
             gridApi && gridApi.onFilterChanged();
@@ -4700,6 +4901,16 @@ var GridContextProvider = function (props) {
             columnApi.setColumnsVisible(invisibleColumnIds, false);
         }
     }, [invisibleColumnIds, columnApi, getColumns]);
+    /**
+     * Download visible columns as a CSV
+     */
+    var downloadCsv = useCallback(function (csvExportParams) {
+        if (!gridApi || !columnApi)
+            return;
+        var fileName = (csvExportParams === null || csvExportParams === void 0 ? void 0 : csvExportParams.fileName) && sanitiseFileName(csvExportParams.fileName);
+        var columnKeys = columnApi === null || columnApi === void 0 ? void 0 : columnApi.getColumnState().filter(function (cs) { var _a, _b; return !cs.hide && ((_b = (_a = gridApi.getColumnDef(cs.colId)) === null || _a === void 0 ? void 0 : _a.headerComponentParams) === null || _b === void 0 ? void 0 : _b.exportable) !== false; }).map(function (cs) { return cs.colId; });
+        gridApi.exportDataAsCsv(__assign(__assign({ columnKeys: columnKeys, processCellCallback: downloadCsvUseValueFormattersProcessCellCallback }, csvExportParams), { fileName: fileName }));
+    }, [columnApi, gridApi]);
     return (jsx(GridContext.Provider, __assign({ value: {
             getColumns: getColumns,
             invisibleColumnIds: invisibleColumnIds,
@@ -4732,8 +4943,52 @@ var GridContextProvider = function (props) {
             addExternalFilter: addExternalFilter,
             removeExternalFilter: removeExternalFilter,
             isExternalFilterPresent: isExternalFilterPresent,
-            doesExternalFilterPass: doesExternalFilterPass
+            doesExternalFilterPass: doesExternalFilterPass,
+            downloadCsv: downloadCsv
         } }, { children: props.children })));
+};
+/**
+ * Aggrid defaults to using getters and ignores formatters.
+ * step-ag-grid by default has a valueFormatter for every column that defaults to the getter if no valueFormatter
+ * This function uses valueFormatter by default
+ */
+var downloadCsvUseValueFormattersProcessCellCallback = function (params) {
+    var _a, _b;
+    var encodeToString = function (value) {
+        // Convert nullish values to blank
+        if (value === "-" || value === "–" || value == null) {
+            return "";
+        }
+        if (typeof value === "string") {
+            return value;
+        }
+        return JSON.stringify(value);
+    };
+    // Try to use valueFormatter
+    var colDef = (_a = params === null || params === void 0 ? void 0 : params.column) === null || _a === void 0 ? void 0 : _a.getColDef();
+    if (!colDef)
+        return encodeToString(params.value);
+    // All columns in step-ag-grid have a default valueFormatter
+    // If you have custom a renderer you need to define your own valueFormatter to produce the text value
+    var valueFormatter = colDef.valueFormatter;
+    // If no valueFormatter then value _must_ be a string
+    if (valueFormatter == null) {
+        if (params.value != null && typeof params.value !== "string") {
+            console.error("downloadCsv: valueFormatter missing and getValue is not a string, colId: ".concat(colDef.colId));
+        }
+        return encodeToString(params.value);
+    }
+    // We don't have access to registered functions, so we can't call them
+    if (typeof valueFormatter !== "function") {
+        console.error("downloadCsv: String type (registered) value formatters are unsupported in downloadCsv, colId: ".concat(colDef.colId));
+        return encodeToString(params.value);
+    }
+    var result = valueFormatter(__assign(__assign({}, params), { data: (_b = params.node) === null || _b === void 0 ? void 0 : _b.data, colDef: colDef }));
+    if (params.value != null && typeof result !== "string") {
+        console.error("downloadCsv: valueFormatter is returning non string values, colDef:\", colId: ".concat(colDef.colId));
+    }
+    // We add an extra encodeToString here just in case valueFormatter is returning non string values
+    return encodeToString(result);
 };
 
 var GridUpdatingContextProvider = function (props) {
@@ -4794,59 +5049,6 @@ var usePrevious = function (value) {
     return ref.current;
 };
 
-/**
- * Cancels timeouts on scope being destroyed.
- *
- * This could almost be a debounce, but debounce tracks by function reference, this tracks by hook reference.
- * This could have been implemented using debounce if the callers function was wrapped in useCallback,
- * but there's no way to enforce that, so  it would lead to bugs.
- */
-var useTimeoutHook = function () {
-    var timeout = useRef();
-    /**
-     * Clear any pending timeouts.
-     */
-    var clearTimeouts = function () {
-        if (timeout.current) {
-            var tc = timeout.current;
-            timeout.current = undefined;
-            clearTimeout(tc);
-        }
-    };
-    /**
-     * Call this when your action has completed.
-     */
-    var invoke = useCallback(function (fn, waitTimeMs) {
-        clearTimeouts();
-        timeout.current = setTimeout(fn, waitTimeMs);
-    }, []);
-    /**
-     * Clear timeout on loss of scope.
-     */
-    useEffect(function () {
-        return function () { return clearTimeouts(); };
-    }, []);
-    return invoke;
-};
-
-/**
- * Defers state change up to a minimum time since last state change.
- */
-var useStateDeferred = function (initialValue) {
-    var startTime = useRef(0);
-    var timeoutHook = useTimeoutHook();
-    var _a = useState(initialValue), value = _a[0], _setValue = _a[1];
-    var setValue = useCallback(function (newValue) {
-        startTime.current = Date.now();
-        _setValue(newValue);
-    }, []);
-    var setValueDeferred = useCallback(function (newValue, minimumWaitTimeMs) {
-        var waitTimeMs = Math.max(minimumWaitTimeMs - (Date.now() - startTime.current), 0);
-        timeoutHook(function () { return _setValue(newValue); }, waitTimeMs);
-    }, [timeoutHook]);
-    return [value, setValue, setValueDeferred];
-};
-
 // Kept this less than one second, so I don't have issues with waitFor as it defaults to 1s
 var minimumInProgressTimeMs = 950;
 var ActionButton = function (_a) {
@@ -25000,5 +25202,5 @@ var clickActionButton = function (text, container) { return __awaiter(void 0, vo
     });
 }); };
 
-export { ActionButton, ComponentLoadingWrapper, ControlledMenu, Editor, FocusableItem, FormError, GenericCellEditorComponentWrapper, Grid, GridCell, GridCellMultiEditor, GridCellMultiSelectClassRules, GridCellRenderer, GridContext, GridContextProvider, GridFilterButtons, GridFilterColumnsToggle, GridFilterHeaderIconButton, GridFilterQuick, GridFilters, GridFormDropDown, GridFormEditBearing, GridFormMessage, GridFormMultiSelect, GridFormPopoverMenu, GridFormSubComponentTextArea, GridFormSubComponentTextInput, GridFormTextArea, GridFormTextInput, GridHeaderSelect, GridIcon, GridLoadableCell, GridNoRowsOverlay, GridPopoutEditMultiSelect, 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, bearingCorrectionRangeValidator, bearingCorrectionValueFormatter, bearingNumberParser, bearingRangeValidator, bearingStringValidator, bearingValueFormatter, clickActionButton, clickMenuOption, clickMultiSelectOption, closeMenu, closePopover, convertDDToDMS, countRows, deselectRow, editCell, findActionButton, findCell, findCellContains, findMenuOption, findMultiSelectOption, findOpenPopover, findParentWithClass, findRow, fnOrVar, generateFilterGetter, getMultiSelectOptions, hasParentClass, isCellReadOnly, isFloat, isNotEmpty, openAndClickMenuOption, openAndFindMenuOption, queryMenuOption, queryRow, selectCell, selectRow, stringByteLengthIsInvalid, suppressCellKeyboardEvents, typeInputByLabel, typeInputByPlaceholder, typeOnlyInput, typeOtherInput, typeOtherTextArea, useDeferredPromise, useGenerateOrDefaultId, useGridContext, useGridFilter, useGridPopoverContext, useGridPopoverHook, useMenuState, usePostSortRowsHook, validateMenuOptions, wait$2 as wait };
+export { ActionButton, ComponentLoadingWrapper, ControlledMenu, Editor, FocusableItem, FormError, GenericCellEditorComponentWrapper, Grid, GridCell, GridCellMultiEditor, GridCellMultiSelectClassRules, GridCellRenderer, GridContext, GridContextProvider, GridFilterButtons, GridFilterColumnsToggle, GridFilterDownloadCsvButton, GridFilterHeaderIconButton, GridFilterQuick, GridFilters, GridFormDropDown, GridFormEditBearing, GridFormMessage, GridFormMultiSelect, GridFormPopoverMenu, GridFormSubComponentTextArea, GridFormSubComponentTextInput, GridFormTextArea, GridFormTextInput, GridHeaderSelect, GridIcon, GridLoadableCell, GridNoRowsOverlay, GridPopoutEditMultiSelect, 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, bearingCorrectionRangeValidator, bearingCorrectionValueFormatter, bearingNumberParser, bearingRangeValidator, bearingStringValidator, bearingValueFormatter, clickActionButton, clickMenuOption, clickMultiSelectOption, closeMenu, closePopover, convertDDToDMS, countRows, deselectRow, downloadCsvUseValueFormattersProcessCellCallback, editCell, findActionButton, findCell, findCellContains, findMenuOption, findMultiSelectOption, findOpenPopover, findParentWithClass, findRow, fnOrVar, generateFilterGetter, getMultiSelectOptions, hasParentClass, isCellReadOnly, isFloat, isNotEmpty, openAndClickMenuOption, openAndFindMenuOption, queryMenuOption, queryRow, sanitiseFileName, selectCell, selectRow, stringByteLengthIsInvalid, suppressCellKeyboardEvents, typeInputByLabel, typeInputByPlaceholder, typeOnlyInput, typeOtherInput, typeOtherTextArea, useDeferredPromise, useGenerateOrDefaultId, useGridContext, useGridFilter, useGridPopoverContext, useGridPopoverHook, useMenuState, usePostSortRowsHook, validateMenuOptions, wait$2 as wait };
 //# sourceMappingURL=step-ag-grid.esm.js.map