@linzjs/step-ag-grid 26.1.0 → 27.1.0

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

@@ -1,5 +1,5 @@
 import { ColDef, EditableCallback, ICellEditorParams, ICellRendererParams } from 'ag-grid-community';
-import { EditableCallbackParams, SuppressKeyboardEventParams, ValueFormatterFunc, ValueFormatterParams, ValueGetterFunc, ValueGetterParams } from 'ag-grid-community';
+import { SuppressKeyboardEventParams, ValueFormatterFunc, ValueGetterFunc } from 'ag-grid-community';
 import { ReactElement } from 'react';
 import { GridBaseRow } from './Grid';
 import { GenericCellColDef } from './gridRender';
@@ -8,48 +8,24 @@ export interface GenericCellEditorProps<E> {
     editor?: (editorProps: E) => ReactElement;
     editorParams?: E;
 }
-export interface SAICellRendererParams<TData = any, TValue = any, TContext = any> extends Omit<ICellRendererParams<TData, TValue, TContext>, 'data'> {
-    data: TData;
-}
 export declare const GridCellRenderer: (props: ICellRendererParams) => import("react/jsx-runtime").JSX.Element;
-export interface SAValueGetterParams<TData = any, TValue = any> extends Omit<ValueGetterParams<TData, TValue>, 'data'> {
-    data: TData;
-    getValue: (field: string) => any;
-}
-export interface SAValueGetterFunc<TData = any, TValue = any> {
-    (params: SAValueGetterParams<TData, TValue>): TValue | null | undefined;
-}
-export interface SAEditableCallbackParams<TData = any, TValue = any> extends Omit<EditableCallbackParams<TData, TValue>, 'data'> {
-    data: TData;
-}
-export interface SAEditableCallback<TData = any, TValue = any> {
-    (params: SAEditableCallbackParams<TData, TValue>): boolean;
-}
-export interface SAValueFormatterParams<TData = any, TValue = any> extends Omit<ValueFormatterParams<TData, TValue>, 'data' | 'value'> {
-    data: TData;
-    value: TValue;
-}
-export interface SAValueFormatterFunc<TData = any, TValue = any> {
-    (params: SAValueFormatterParams<TData, TValue>): string;
-}
 export interface ColDefT<TData extends GridBaseRow, ValueType = any> extends ColDef<TData, ValueType> {
     editable?: boolean | EditableCallback<TData, ValueType>;
     valueGetter?: string | ValueGetterFunc<TData, ValueType>;
     valueFormatter?: string | ValueFormatterFunc<TData, ValueType>;
-    cellRenderer?: ((props: SAICellRendererParams<TData, ValueType>) => ReactElement | string | false | null | undefined) | string;
+    cellRenderer?: ((props: ICellRendererParams<TData, ValueType>) => ReactElement | string | false | null | undefined) | string;
     cellRendererParams?: {
-        singleClickEdit?: boolean;
         rightHoverElement?: ReactElement;
         originalCellRenderer?: any;
         editAction?: (selectedRows: TData[]) => void;
         shortcutKeys?: Record<string, () => void>;
-        warning?: (props: SAICellRendererParams<TData, ValueType>) => ReactElement | string | false | null | undefined;
-        info?: (props: SAICellRendererParams<TData, ValueType>) => ReactElement | string | false | null | undefined;
+        warning?: (props: ICellRendererParams<TData, ValueType>) => ReactElement | string | false | null | undefined;
+        info?: (props: ICellRendererParams<TData, ValueType>) => ReactElement | string | false | null | undefined;
     };
     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 | SAValueGetterFunc<TData, ValueType> | undefined;
+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 GridCell: <TData extends GridBaseRow, TValue = any, Props extends CellEditorCommon = any>(props: GenericCellColDef<TData, TValue>, custom?: {
     multiEdit?: boolean;
     preventAutoEdit?: boolean;

package/dist/src/components/gridRender/GridRenderGenericCell.d.ts

@@ -7,7 +7,6 @@ export interface GenericCellColDef<TData extends GridBaseRow, TValue = any> exte
     exportable?: boolean;
 }
 export interface GenericCellRendererParams<TData extends GridBaseRow> {
-    singleClickEdit?: boolean;
     rightHoverElement?: ReactElement | undefined;
     editAction?: (selectedRows: TData[]) => void;
     shortcutKeys?: Record<string, ((params: SuppressKeyboardEventParams) => boolean | void) | undefined>;

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

@@ -17,7 +17,7 @@ export interface GridContextType<TData extends GridBaseRow> {
     getColDef: (colId?: string) => ColDef | undefined;
     getColumns: (filter?: keyof ColDef | ((r: ColDef) => boolean | undefined | null | number | string)) => ColDefT<TData, any>[];
     getColumnIds: (filter?: keyof ColDef | ((r: ColDef) => boolean | undefined | null | number | string)) => string[];
-    setApis: (gridApi: GridApi | undefined, dataTestId?: string) => void;
+    setApis: (gridApi: GridApi | undefined, hasExternallySelectedItems: boolean, dataTestId?: string) => void;
     prePopupOps: () => void;
     postPopupOps: () => void;
     setQuickFilter: (quickFilter: string) => void;

package/dist/step-ag-grid.cjs

@@ -2066,7 +2066,7 @@ const ControlledMenuFr = ({ 'aria-label': ariaLabel, className, containerProps,
                 }
                 break;
         }
-    }, [anchorRef, saveButtonRef]);
+    }, [anchorRef, onClose, saveButtonRef]);
     const handleKeydownTabAndEnter = React.useMemo(() => handleKeyboardTabAndEnter(true), [handleKeyboardTabAndEnter]);
     const handleKeyupTabAndEnter = React.useMemo(() => handleKeyboardTabAndEnter(false), [handleKeyboardTabAndEnter]);
     React.useEffect(() => {
@@ -2939,14 +2939,15 @@ const Grid = ({ 'data-testid': dataTestId, defaultPostSort = true, rowSelection
             };
         });
     }, [params.columnDefs, params.loading, params.readOnly, params.defaultColDef?.editable]);
+    const hasExternallySelectedItems = !!params.setExternalSelectedItems;
     /**
      * When grid is ready set the apis to the grid context and sync selected items to grid.
      */
     const onGridReady = React.useCallback((event) => {
-        setApis(event.api, dataTestId);
+        setApis(event.api, hasExternallySelectedItems, dataTestId);
         event.api.showNoRowsOverlay();
         synchroniseExternallySelectedItemsToGrid();
-    }, [dataTestId, setApis, synchroniseExternallySelectedItemsToGrid]);
+    }, [dataTestId, hasExternallySelectedItems, setApis, synchroniseExternallySelectedItemsToGrid]);
     /**
      * When the grid is being initialized the data may be empty.
      * This will resize columns when we have at least one row.
@@ -2999,7 +3000,7 @@ const Grid = ({ 'data-testid': dataTestId, defaultPostSort = true, rowSelection
      * Handle single click edits
      */
     const onCellClicked = React.useCallback((event) => {
-        if (event.colDef?.cellRendererParams?.singleClickEdit ?? singleClickEdit) {
+        if (event.colDef.singleClickEdit ?? singleClickEdit) {
             void startCellEditing({ rowId: event.data.id, colId: event.column.getColId() });
         }
     }, [singleClickEdit, startCellEditing]);
@@ -4988,11 +4989,9 @@ const GridPopoverMenu = (colDef, custom) => GridCell({
     exportable: false,
     cellStyle: { flex: 1, justifyContent: 'center' },
     cellRenderer: GridRenderPopoutMenuCell,
+    // Menus open on single click, this parameter is picked up in Grid.tsx
+    singleClickEdit: true,
     ...colDef,
-    cellRendererParams: {
-        // Menus open on single click, this parameter is picked up in Grid.tsx
-        singleClickEdit: true,
-    },
 }, {
     editor: GridFormPopoverMenu,
     preventAutoEdit: true,
@@ -5002,10 +5001,7 @@ const GridPopoverMenu = (colDef, custom) => GridCell({
 const GridPopoverMessage = (colDef, props) => GridCell({
     resizable: true,
     ...colDef,
-    cellRendererParams: {
-        singleClickEdit: true,
-        ...colDef.cellRendererParams,
-    },
+    singleClickEdit: true,
 }, {
     editor: GridFormMessage,
     ...props,
@@ -5035,6 +5031,7 @@ const GridContextProvider = (props) => {
     const [quickFilter, _setQuickFilter] = React.useState('');
     const [invisibleColumnIds, _setInvisibleColumnIds] = React.useState();
     const testId = React.useRef();
+    const hasExternallySelectedItemsRef = React.useRef(false);
     const idsBeforeUpdate = React.useRef([]);
     const prePopupFocusedCell = React.useRef();
     const [externallySelectedItemsAreInSync, setExternallySelectedItemsAreInSync] = React.useState(false);
@@ -5098,7 +5095,8 @@ const GridContextProvider = (props) => {
     /**
      * Set the grid api when the grid is ready.
      */
-    const setApis = React.useCallback((gridApi, dataTestId) => {
+    const setApis = React.useCallback((gridApi, hasExternallySelectedItems, dataTestId) => {
+        hasExternallySelectedItemsRef.current = hasExternallySelectedItems;
         testId.current = dataTestId;
         setGridApi(gridApi);
         gridApi?.setGridOption('quickFilterText', quickFilter);
@@ -5352,10 +5350,17 @@ const GridContextProvider = (props) => {
         externallySelectedItemsAreInSyncRef.current = externallySelectedItemsAreInSync;
     }, [externallySelectedItemsAreInSync]);
     const waitForExternallySelectedItemsToBeInSync = React.useCallback(async () => {
+        if (!hasExternallySelectedItemsRef.current) {
+            externallySelectedItemsAreInSyncRef.current = true;
+            return;
+        }
         // Wait for up to 5 seconds
         for (let i = 0; i < 5000 / 200 && !externallySelectedItemsAreInSyncRef.current; i++) {
             await wait(200);
         }
+        if (!externallySelectedItemsAreInSyncRef.current) {
+            console.error('externallySelectedItems did not sync with ag-grid selection');
+        }
     }, []);
     const startCellEditing = React.useCallback(async ({ rowId, colId }) => {
         if (!gridApi)