@linzjs/step-ag-grid 28.3.0 → 28.4.1

package/dist/index.css

@@ -439,6 +439,11 @@ div.ag-ltr div.ag-header-cell-resize {
   right: -4px;
 }
 
+.step-ag-grid__alert-icon {
+  max-width: 34px;
+  width: 34px;
+}
+
 .GridCell-container {
   overflow: hidden;
   text-overflow: ellipsis;

package/dist/src/components/GridCell.d.ts

@@ -1,5 +1,5 @@
-import { ColDef, EditableCallback, ICellEditorParams, ICellRendererParams } from 'ag-grid-community';
-import { SuppressKeyboardEventParams, ValueFormatterFunc, ValueGetterFunc } from 'ag-grid-community';
+import { ColDef, EditableCallback, GetQuickFilterTextParams, ICellEditorParams, ICellRendererParams } from 'ag-grid-community';
+import { SuppressKeyboardEventParams, ValueFormatterFunc, ValueFormatterParams, ValueGetterFunc } from 'ag-grid-community';
 import { ReactElement } from 'react';
 import { GridBaseRow } from './Grid';
 import { GenericCellColDef } from './gridRender';
@@ -25,7 +25,8 @@ export interface ColDefT<TData extends GridBaseRow, ValueType = any> extends Col
     editor?: (editorProps: any) => ReactElement;
 }
 export declare const suppressCellKeyboardEvents: (e: SuppressKeyboardEventParams) => any;
-export declare const generateFilterGetter: <TData extends GridBaseRow, ValueType>(field: string | undefined, filterValueGetter: string | ValueGetterFunc<TData, ValueType> | undefined, valueFormatter: string | ValueFormatterFunc<TData, ValueType> | undefined) => string | ValueGetterFunc<TData, ValueType> | undefined;
+export declare const generateFilterGetter: <TData extends GridBaseRow, ValueType>(valueFormatter: string | ValueFormatterFunc<TData, ValueType> | undefined) => string | ((params: GetQuickFilterTextParams<TData, ValueType>) => string) | undefined;
+export declare const defaultValueFormatter: ({ value }: ValueFormatterParams) => string;
 export declare const GridCell: <TData extends GridBaseRow, TValue = any, Props extends CellEditorCommon = any>(props: GenericCellColDef<TData, TValue>, custom?: {
     multiEdit?: boolean;
     preventAutoEdit?: boolean;

package/dist/step-ag-grid.cjs

@@ -3235,11 +3235,8 @@ const Grid = ({ 'data-testid': dataTestId, defaultPostSort = true, rowSelection
                         event.api.forEachNode(() => rowCount++);
                         return (jsxRuntime.jsx(GridNoRowsOverlay, { loading: !rowData || params.loading === true, rowCount: rowCount, headerRowHeight: headerRowCount * rowHeight, filteredRowCount: event.api.getDisplayedRowCount(), noRowsOverlayText: params.noRowsOverlayText, noRowsMatchingOverlayText: params.noRowsMatchingOverlayText }));
                     }, quickFilterParser: (filterStr) => {
-                        filterStr = filterStr.trim();
-                        const quoted = filterStr.startsWith('"');
-                        filterStr = filterStr.replace(/^"/, '').replace(/"$/, '');
-                        // If the user encloses the search term in quotes, treat it as an exact match otherwise split by space
-                        return quoted ? [filterStr] : filterStr.split(' ');
+                        // filter is exact matches exactly groups separated by commas
+                        return filterStr.split(',').map((str) => str.trim());
                     }, onModelUpdated: onModelUpdated, onGridReady: onGridReady, onSortChanged: ensureSelectedRowIsVisible, postSortRows: params.onRowDragEnd || !defaultPostSort ? undefined : postSortRows, onSelectionChanged: synchroniseExternalStateToGridSelection, onColumnMoved: params.onColumnMoved, alwaysShowVerticalScroll: params.alwaysShowVerticalScroll, isExternalFilterPresent: isExternalFilterPresent, doesExternalFilterPass: doesExternalFilterPass, maintainColumnOrder: true, preventDefaultOnContextMenu: true, onCellContextMenu: gridContextMenu.cellContextMenu, rowDragText: params.rowDragText, onRowDragCancel: clearHighlightRowClasses, onRowDragMove: onRowDragMove, onRowDragEnd: onRowDragEnd, suppressCellFocus: params.suppressCellFocus, pinnedTopRowData: params.pinnedTopRowData, pinnedBottomRowData: params.pinnedBottomRowData, selectionColumnDef: {
                         suppressNavigable: params.hideSelectColumn,
                         rowDrag: !!params.onRowDragEnd,
@@ -3334,7 +3331,7 @@ const GridCellMultiSelectClassRules = {
     },
 };
 
-const GridIcon = (props) => (jsxRuntime.jsx(lui.LuiIcon, { name: props.icon, title: props.title, alt: props.title, size: props.size ?? 'md', className: clsx(`AgGridGenericCellRenderer-${props.icon}Icon`, props.className, props.disabled && 'GridIcon-disabled') }));
+const GridIcon = (props) => (jsxRuntime.jsx(lui.LuiIcon, { name: props.icon, title: props.title, alt: props.title, size: props.size ?? 'md', className: clsx(`step-ag-grid__alert-icon`, `AgGridGenericCellRenderer-${props.icon}Icon`, props.className, props.disabled && 'GridIcon-disabled') }));
 
 const GridLoadableCell = () => (jsxRuntime.jsx(lui.LuiMiniSpinner, { size: 22, divProps: { className: 'GridLoadableCell-container', role: 'status', 'aria-label': 'Loading' } }));
 
@@ -3363,24 +3360,21 @@ const suppressCellKeyboardEvents = (e) => {
     // as the incorrect selected rows will be returned
     return !['ArrowLeft', 'ArrowRight', 'ArrowDown', 'ArrowUp', 'Tab', ' ', 'Home', 'End', 'PageUp', 'PageDown'].includes(e.event.key);
 };
-const generateFilterGetter = (field, filterValueGetter, valueFormatter) => {
-    if (filterValueGetter)
-        return filterValueGetter;
+const generateFilterGetter = (valueFormatter) => {
     // aggrid will default to valueGetter
-    if (typeof valueFormatter !== 'function' || !field)
+    if (typeof valueFormatter !== 'function') {
         return undefined;
-    return (params) => {
-        const value = params.getValue(field);
-        let formattedValue = valueFormatter({ ...params, value });
-        // Search for null values using standard dash
-        if (formattedValue === '–')
-            formattedValue += ' -';
-        // Search by raw value as well as formatted
-        const gotValue = ['string', 'number'].includes(typeof value) ? value : undefined;
-        return (formattedValue + (gotValue != null && formattedValue != gotValue ? ' ' + gotValue : '')) //
-            .replace(/\s+/g, ' ')
-            .trim();
-    };
+    }
+    return (params) => valueFormatter(params);
+};
+const stringableValueFormatterTypes = ['number', 'boolean', 'string'];
+const defaultValueFormatter = ({ value }) => {
+    if (value == null) {
+        return '–';
+    }
+    return stringableValueFormatterTypes.includes(typeof value) //
+        ? String(value)
+        : JSON.stringify(value);
 };
 /*
  * All cells should use this.
@@ -3390,16 +3384,17 @@ const GridCell = (props, custom) => {
     // Generate a default filter value getter which uses the formatted value plus
     // the editable value if it's a string and different from the formatted value.
     // This is so that e.g. bearings can be searched for by DMS or raw number.
-    const valueFormatter = props.valueFormatter;
+    const valueFormatter = props.valueFormatter ?? defaultValueFormatter;
     // FIXME
-    const filterValueGetter = generateFilterGetter(props.field, props.filterValueGetter, valueFormatter);
+    const filterValueGetter = props.filterValueGetter ?? generateFilterGetter(valueFormatter);
     const exportable = props.exportable;
     // Can't leave this here ag-grid will complain
     delete props.exportable;
     return {
-        colId: props.field ?? props.field,
+        // Will be overridden if specified later
+        colId: props.field,
         headerTooltip: props.headerName,
-        sortable: !!(props?.field || props?.valueGetter),
+        sortable: true,
         resizable: true,
         editable: props.editable ?? false,
         ...(custom?.editor && {
@@ -3416,18 +3411,9 @@ const GridCell = (props, custom) => {
             },
         }),
         // If there's a valueFormatter and no filterValueGetter then create a filterValueGetter
-        // FIXME
-        filterValueGetter: filterValueGetter,
+        getQuickFilterText: filterValueGetter,
         // Default value formatter, otherwise react freaks out on objects
-        valueFormatter: (params) => {
-            if (params.value == null)
-                return '–';
-            const types = ['number', 'boolean', 'string'];
-            if (types.includes(typeof params.value))
-                return `${params.value}`;
-            else
-                return JSON.stringify(params.value);
-        },
+        valueFormatter,
         ...props,
         cellRenderer: typeof props.cellRenderer === 'string' ? props.cellRenderer : GridCellRenderer,
         cellRendererParams: {
@@ -5939,6 +5925,7 @@ exports.bearingRangeValidator = bearingRangeValidator;
 exports.bearingStringValidator = bearingStringValidator;
 exports.bearingValueFormatter = bearingValueFormatter;
 exports.convertDDToDMS = convertDDToDMS;
+exports.defaultValueFormatter = defaultValueFormatter;
 exports.downloadCsvUseValueFormattersProcessCellCallback = downloadCsvUseValueFormattersProcessCellCallback;
 exports.findParentWithClass = findParentWithClass;
 exports.fnOrVar = fnOrVar;