@linzjs/step-ag-grid 14.9.2 → 14.9.4

package/dist/src/contexts/GridContext.d.ts

@@ -53,7 +53,7 @@ export interface GridContextType<RowType extends GridBaseRow> {
     removeExternalFilter: (filter: GridFilterExternal<RowType>) => void;
     isExternalFilterPresent: () => boolean;
     doesExternalFilterPass: (node: RowNode) => boolean;
-    invisibleColumnIds: string[];
+    invisibleColumnIds: string[] | undefined;
     setInvisibleColumnIds: (colIds: string[]) => void;
     downloadCsv: (csvExportParams?: CsvExportParams) => void;
     setOnCellEditingComplete: (callback: (() => void) | undefined) => void;

package/dist/src/utils/util.d.ts

@@ -5,10 +5,4 @@ export declare const findParentWithClass: (className: string, child: Node) => HT
 export declare const hasParentClass: (className: string, child: Node) => boolean;
 export declare const stringByteLengthIsInvalid: (str: string, maxBytes: number) => boolean;
 export declare const fnOrVar: (fn: any, param: any) => any;
-/**
- * Trim filename and replaces troublesome characters.
- *
- * e.g. " LT 1235/543 &%//*$ " => "LT_1235-543_&%-$"
- * e.g. " @filename here!!!" => "@filename_here!!!"
- */
 export declare const sanitiseFileName: (filename: string) => string;

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, defer as defer$1, omit, sortBy, findIndex, debounce as debounce$1, delay, partition, pick, groupBy, fromPairs, toPairs, isEqual, sumBy, compact, remove, castArray, flatten } from 'lodash-es';
+import { negate, isEmpty, xorBy, last, difference, defer as defer$1, omit, sortBy, findIndex, debounce as debounce$1, compact, delay, partition, pick, groupBy, fromPairs, toPairs, isEqual, sumBy, remove, castArray, flatten } from 'lodash-es';
 import * as React from 'react';
 import { createContext, useContext, useRef, useEffect, useCallback, useState, useMemo, forwardRef, useLayoutEffect, memo, useReducer, cloneElement, useImperativeHandle, Fragment as Fragment$1 } from 'react';
 import ReactDOM, { unstable_batchedUpdates, flushSync, createPortal } from 'react-dom';
@@ -42,7 +42,7 @@ const GridContext = createContext({
         console.error("no context provider for getColumns");
         return [];
     },
-    invisibleColumnIds: [],
+    invisibleColumnIds: undefined,
     setInvisibleColumnIds: () => {
         console.error("no context provider for setInvisibleColumnIds");
     },
@@ -223,146 +223,6 @@ const useIntervalHook = ({ callback, timeoutMs }) => {
     }, [timeoutMs]);
 };
 
-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 sanitize$1 = /*@__PURE__*/getDefaultExportFromCjs(sanitizeFilename);
-
 const isNotEmpty = negate(isEmpty);
 const wait$2 = (timeoutMs) => new Promise((resolve) => {
     setTimeout(resolve, timeoutMs);
@@ -401,13 +261,19 @@ const hasParentClass = function (className, child) {
 };
 const stringByteLengthIsInvalid = (str, maxBytes) => new TextEncoder().encode(str).length > maxBytes;
 const fnOrVar = (fn, param) => (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!!!"
- */
-const sanitiseFileName = (filename) => sanitize$1(filename.trim().replaceAll(/(\/|\\)+/g, "-")).replaceAll(/\s+/g, "_");
+const sanitiseFileName = (filename) => {
+    const valid = filename
+        .trim()
+        .replaceAll(/(\/|\\)+/g, "-")
+        .replaceAll(/\s+/g, "_")
+        .replaceAll(/[^\w\-āēīōūĀĒĪŌŪ.]/g, "");
+    const parts = valid.split(".");
+    const fileExt = parts.length > 1 ? parts.pop() : undefined;
+    // Arbitrary max filename length of 64 chars + extension
+    if (!fileExt)
+        return valid.slice().slice(0, 64);
+    return valid.slice(0, -fileExt.length - 1).slice(0, 64) + "." + fileExt;
+};
 
 const GridNoRowsOverlay = (params) => (jsx("span", { children: isEmpty(params.rowData)
         ? params.noRowsOverlayText ?? "There are currently no rows"
@@ -652,11 +518,20 @@ const Grid = ({ "data-testid": dataTestId, rowSelection = "multiple", suppressCo
         }
         needsAutoSize.current = false;
     }, [autoSizeColumns, params, sizeColumns, sizeColumnsToFit]);
+    const lastOwnerDocumentRef = useRef();
     /**
      * Auto-size windows that had deferred auto-size
      */
     useIntervalHook({
         callback: () => {
+            // Check if window has been popped out and needs resize
+            const currentDocument = gridDivRef.current?.ownerDocument;
+            if (currentDocument !== lastOwnerDocumentRef.current) {
+                lastOwnerDocumentRef.current = currentDocument;
+                if (currentDocument) {
+                    needsAutoSize.current = true;
+                }
+            }
             if (needsAutoSize.current) {
                 needsAutoSize.current = false;
                 setInitialContentSize();
@@ -935,11 +810,19 @@ const Grid = ({ "data-testid": dataTestId, rowSelection = "multiple", suppressCo
      * Once the grid has auto-sized we want to run fit to fit the grid in its container,
      * but we don't want the non-flex auto-sized columns to "fit" size, so suppressSizeToFit is set to true.
      */
-    const columnDefsAdjusted = useMemo(() => columnDefs.map((colDef) => ({
-        ...colDef,
-        suppressSizeToFit: (sizeColumns === "auto" || sizeColumns === "auto-skip-headers") && !colDef.flex,
-        sortable: colDef.sortable && params.defaultColDef?.sortable !== false,
-    })), [columnDefs, params.defaultColDef?.sortable, sizeColumns]);
+    const columnDefsAdjusted = useMemo(() => {
+        const adjustColDefOrGroup = (colDef) => "children" in colDef ? adjustGroupColDef(colDef) : adjustColDef(colDef);
+        const adjustGroupColDef = (colDef) => ({
+            ...colDef,
+            children: colDef.children.map((colDef) => adjustColDefOrGroup(colDef)),
+        });
+        const adjustColDef = (colDef) => ({
+            ...colDef,
+            suppressSizeToFit: (sizeColumns === "auto" || sizeColumns === "auto-skip-headers") && !colDef.flex,
+            sortable: colDef.sortable && params.defaultColDef?.sortable !== false,
+        });
+        return columnDefs.map((colDef) => adjustColDefOrGroup(colDef));
+    }, [columnDefs, params.defaultColDef?.sortable, sizeColumns]);
     /**
      * Set of colIds that need auto-sizing.
      */
@@ -3034,15 +2917,23 @@ const GridFilterColumnsToggle = ({ saveState = true }) => {
         if (saveState) {
             try {
                 const stored = window.localStorage.getItem(columnStorageKey);
-                const invisibleIds = JSON.parse(stored ?? "[]");
-                if (!Array.isArray(invisibleIds)) {
-                    console.error(`stored invisible ids not an array: ${stored}`);
-                }
-                else if (!invisibleIds.every((id) => typeof id === "string")) {
-                    console.error(`stored invisible ids not strings: ${stored}`);
+                if (!stored) {
+                    // infer the invisible ids from colDefs
+                    setInvisibleColumnIds(compact(getColumns()
+                        .filter((col) => col.initialHide)
+                        .map((col) => col.colId)));
                 }
                 else {
-                    invisibleIds && setInvisibleColumnIds(invisibleIds);
+                    const invisibleIds = JSON.parse(stored ?? "[]");
+                    if (!Array.isArray(invisibleIds)) {
+                        console.error(`stored invisible ids not an array: ${stored}`);
+                    }
+                    else if (!invisibleIds.every((id) => typeof id === "string")) {
+                        console.error(`stored invisible ids not strings: ${stored}`);
+                    }
+                    else {
+                        invisibleIds && setInvisibleColumnIds(invisibleIds);
+                    }
                 }
             }
             catch (ex) {
@@ -3050,7 +2941,7 @@ const GridFilterColumnsToggle = ({ saveState = true }) => {
             }
             setLoaded(true);
         }
-    }, [columnStorageKey, loaded, saveState, setInvisibleColumnIds]);
+    }, [columnStorageKey, getColumns, loaded, saveState, setInvisibleColumnIds]);
     // Save state on column visibility change
     useEffect(() => {
         loaded &&
@@ -3059,7 +2950,7 @@ const GridFilterColumnsToggle = ({ saveState = true }) => {
             window.localStorage.setItem(columnStorageKey, JSON.stringify(invisibleColumnIds));
     }, [columnStorageKey, invisibleColumnIds, loaded, saveState]);
     const toggleColumn = useCallback((colId) => {
-        if (!colId)
+        if (!colId || !invisibleColumnIds)
             return;
         setInvisibleColumnIds(invisibleColumnIds.includes(colId)
             ? invisibleColumnIds.filter((id) => id !== colId)
@@ -3082,7 +2973,7 @@ const GridFilterColumnsToggle = ({ saveState = true }) => {
                                 toggleColumn(col.colId);
                             }
                         }
-                    }, children: jsx(LuiCheckboxInput, { isChecked: !invisibleColumnIds.includes(col.colId ?? ""), value: `${col.colId}`, label: col.headerName ?? "", isDisabled: isNonManageableColumn(col), inputProps: {
+                    }, children: jsx(LuiCheckboxInput, { isChecked: !!invisibleColumnIds && !invisibleColumnIds.includes(col.colId ?? ""), value: `${col.colId}`, label: col.headerName ?? "", isDisabled: isNonManageableColumn(col), inputProps: {
                             onClick: (e) => {
                                 // Click is handled by MenuItem onClick so keyboard events work
                                 e.preventDefault();
@@ -3168,6 +3059,40 @@ const GridFilterDownloadCsvButton = (csvExportParams) => {
         } })) : (jsx(GridFilterHeaderIconButton, { icon: "ic_csv_file", title: "Download CSV", onClick: handleDownloadClick, disabled: downloading }));
 };
 
+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;
+}
+
 /* global setTimeout, clearTimeout */
 
 var dist$1 = function debounce(fn) {
@@ -4530,7 +4455,7 @@ const GridContextProvider = (props) => {
     const [columnApi, setColumnApi] = useState();
     const [gridReady, setGridReady] = useState(false);
     const [quickFilter, setQuickFilter] = useState("");
-    const [invisibleColumnIds, setInvisibleColumnIds] = useState([]);
+    const [invisibleColumnIds, setInvisibleColumnIds] = useState();
     const testId = useRef();
     const idsBeforeUpdate = useRef([]);
     const prePopupFocusedCell = useRef();
@@ -4650,6 +4575,10 @@ const GridContextProvider = (props) => {
             .map((rowId) => gridApi.getRowNode("" + rowId)) //
             .filter((r) => r), () => []);
     }, [gridApiOp]);
+    /**
+     * Get ColDefs, with flattened ColGroupDefs
+     */
+    const getColumns = useCallback(() => columnApi?.getAllColumns()?.map((col) => col.getColDef()) ?? [], [columnApi]);
     /**
      * Internal method for selecting and flashing rows.
      *
@@ -4673,9 +4602,9 @@ const GridContextProvider = (props) => {
             const firstNode = rowsThatNeedSelecting[0];
             if (firstNode) {
                 defer$1(() => gridApi.ensureNodeVisible(firstNode));
-                const colDefs = gridApi.getColumnDefs();
-                if (colDefs?.length) {
-                    const col = colDefs[0]; // We don't support ColGroupDef
+                const colDefs = getColumns();
+                if (!isEmpty(colDefs)) {
+                    const col = colDefs[0];
                     const rowIndex = firstNode.rowIndex;
                     if (rowIndex != null && col != null) {
                         const colId = col.colId;
@@ -4706,7 +4635,7 @@ const GridContextProvider = (props) => {
                 }, 250);
             }
         });
-    }, [_getNewNodes, _rowIdsToNodes, gridApiOp]);
+    }, [_getNewNodes, _rowIdsToNodes, getColumns, gridApiOp]);
     const selectRowsById = useCallback((rowIds) => _selectRowsWithOptionalFlash(rowIds, true, false), [_selectRowsWithOptionalFlash]);
     const selectRowsByIdWithFlash = useCallback((rowIds) => _selectRowsWithOptionalFlash(rowIds, true, true), [_selectRowsWithOptionalFlash]);
     const flashRows = useCallback((rowIds) => _selectRowsWithOptionalFlash(rowIds, false, true), [_selectRowsWithOptionalFlash]);
@@ -4939,9 +4868,8 @@ const GridContextProvider = (props) => {
         return externalFilters.current.every((filter) => filter(node.data, node));
     };
     const getColDef = useCallback((colId) => (!!colId && gridApi?.getColumnDef(colId)) || undefined, [gridApi]);
-    const getColumns = useCallback(() => gridApi?.getColumnDefs() ?? [], [gridApi]);
     useEffect(() => {
-        if (columnApi) {
+        if (columnApi && invisibleColumnIds) {
             // show all columns that aren't invisible
             columnApi.setColumnsVisible(compact(getColumns()
                 .filter((col) => !col.lockVisible && col.colId && !invisibleColumnIds.includes(col.colId))