@adaptabletools/adaptable 23.0.20 → 23.0.21

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adaptabletools/adaptable",
-  "version": "23.0.20",
+  "version": "23.0.21",
   "description": "Powerful AG Grid extension which provides advanced, cutting-edge functionality to meet all DataGrid requirements",
   "keywords": [
     "web-components",

package/src/AdaptableOptions/FilterOptions.d.ts

@@ -276,6 +276,14 @@ export interface CustomInFilterValuesContext<TData = any> extends AdaptableColum
      * Opaque pagination cursors may also be stashed on this object and read on the next call.
      */
     previousFilterResult?: InFilterValueResult;
+    /**
+     * Values currently selected in the IN (or NOT IN) Column Filter.
+     *
+     * Labels are resolved from previously loaded In Filter items when available.
+     *
+     * Useful with lazy pagination or server-side search: selected items may not be in the current page.
+     */
+    selectedValues: InFilterValue[];
     /**
      * Zero-based index of the first value to return.
      * Reset to 0 when the dropdown opens or `currentSearchValue` changes.

package/src/AdaptableOptions/LayoutOptions.d.ts

@@ -24,14 +24,7 @@ export interface LayoutOptions<TData = any> {
      */
     layoutCreationDefaultProperties?: LayoutCreationDefaultProperties | ((context: LayoutCreationDefaultPropertiesContext) => TableLayoutCreationDefaultProperties | PivotLayoutCreationDefaultProperties);
     /**
-     * Function which checks if the Row Selection checkbox should be visible for a given row.
-     *
-     * When provided, this overrides `LayoutRowSelection.Checkboxes` and any `gridOptions.rowSelection.checkboxes` value,
-     * and forces AG Grid `hideDisabledCheckboxes: true` so returning `false` hides (rather than greys out) the checkbox.
-     *
-     * Does not apply when the Layout sets `RowSelection: false` (row selection is fully disabled for that Layout).
-     *
-     * Use `context.rowNode` for group / footer / pinned / total rows (`data` may be `undefined` for those).
+     * Sets if Row Selection checkbox should be visible for a given row
      */
     isRowSelectionCheckboxVisible?: (context: LayoutRowSelectionContext<TData>) => boolean;
 }

package/src/AdaptableState/InitialState.d.ts

@@ -60,7 +60,7 @@ export interface InitialState {
      */
     FormatColumn?: FormatColumnState;
     /**
-     * Collection of *FreeText* objects so users can make their own notes in bespoke columns that will get stored with their state (and not with the DataSource).  Useful if needing a 'Comments' column.
+     * Collection of *FreeText* objects that define user-owned columns whose cell values are stored in Adaptable State (not the grid DataSource). Use for editable per-row fields such as ops notes, flags, or codes — distinct from cell-level Notes and Comments.
      */
     FreeTextColumn?: FreeTextColumnState;
     /**

package/src/Api/Implementation/FormatColumnApiImpl.d.ts

@@ -38,4 +38,5 @@ export declare class FormatColumnApiImpl extends ApiBase implements FormatColumn
     incrementFormatColumnPrecedence(formatColumn: FormatColumn): void;
     decrementFormatColumnPrecedence(formatColumn: FormatColumn): void;
     findFormatColumns(criteria: AdaptableObjectLookupCriteria): FormatColumn[];
+    private refreshColumnsForFormatColumns;
 }

package/src/Api/Implementation/FormatColumnApiImpl.js

@@ -39,14 +39,17 @@ export class FormatColumnApiImpl extends ApiBase {
     addFormatColumn(formatColumn) {
         this.addUidToAdaptableObject(formatColumn);
         this.dispatchAction(FormatColumnRedux.FormatColumnAdd(formatColumn));
+        this.refreshColumnsForFormatColumns(formatColumn);
         return this.getFormatColumnByUuId(formatColumn.Uuid);
     }
     addFormatColumns(formatColumns) {
         this.dispatchAction(FormatColumnRedux.FormatColumnsAdd(formatColumns));
+        this.refreshColumnsForFormatColumns(formatColumns);
         return formatColumns?.map((formatColumn) => this.getFormatColumnByUuId(formatColumn.Uuid));
     }
     editFormatColumn(formatColumn) {
         this.dispatchAction(FormatColumnRedux.FormatColumnEdit(formatColumn));
+        this.refreshColumnsForFormatColumns(formatColumn);
         return this.getFormatColumnByUuId(formatColumn.Uuid);
     }
     addFormatColumnStyle(formatColumn, style) {
@@ -56,26 +59,33 @@ export class FormatColumnApiImpl extends ApiBase {
     updateFormatColumnStyle(formatColumn, style) {
         formatColumn.Style = style;
         this.dispatchAction(FormatColumnRedux.FormatColumnEdit(formatColumn));
+        this.refreshColumnsForFormatColumns(formatColumn);
     }
     deleteFormatColumn(formatColumn) {
         this.dispatchAction(FormatColumnRedux.FormatColumnDelete(formatColumn));
+        this.refreshColumnsForFormatColumns(formatColumn);
     }
     deleteAllFormatColumns() {
         this.dispatchAction(FormatColumnRedux.FormatColumnDeleteAll());
+        this.getGridApi().refreshAllCells(true);
     }
     suspendFormatColumn(formatColumn) {
         this.dispatchAction(FormatColumnRedux.FormatColumnSuspend(formatColumn));
+        this.refreshColumnsForFormatColumns(formatColumn);
         return this.getFormatColumnByUuId(formatColumn.Uuid);
     }
     unSuspendFormatColumn(formatColumn) {
         this.dispatchAction(FormatColumnRedux.FormatColumnUnSuspend(formatColumn));
+        this.refreshColumnsForFormatColumns(formatColumn);
         return this.getFormatColumnByUuId(formatColumn.Uuid);
     }
     suspendAllFormatColumn() {
         this.dispatchAction(FormatColumnRedux.FormatColumnSuspendAll());
+        this.getGridApi().refreshAllCells(true);
     }
     unSuspendAllFormatColumn() {
         this.dispatchAction(FormatColumnRedux.FormatColumnUnSuspendAll());
+        this.getGridApi().refreshAllCells(true);
     }
     getFormatColumnsForColumn(column, config) {
         const formatColumns = this.getFormatColumns(config).filter((formatColumn) => (config?.includeSuspended || !formatColumn.IsSuspended) && (config?.includeReadOnly || !formatColumn.IsReadOnly));
@@ -114,9 +124,11 @@ export class FormatColumnApiImpl extends ApiBase {
     }
     incrementFormatColumnPrecedence(formatColumn) {
         this.dispatchAction(FormatColumnRedux.FormatColumnMoveUp(formatColumn));
+        this.refreshColumnsForFormatColumns(formatColumn);
     }
     decrementFormatColumnPrecedence(formatColumn) {
         this.dispatchAction(FormatColumnRedux.FormatColumnMoveDown(formatColumn));
+        this.refreshColumnsForFormatColumns(formatColumn);
     }
     findFormatColumns(criteria) {
         const config = {
@@ -124,4 +136,7 @@ export class FormatColumnApiImpl extends ApiBase {
         };
         return this.getAdaptableInternalApi().findAdaptableObjectsByLookupCriteria(criteria, this.getFormatColumns(config));
     }
+    refreshColumnsForFormatColumns(formatColumns) {
+        this.internalApi.refreshFormatColumnPresentation(formatColumns);
+    }
 }

package/src/Api/Implementation/FreeTextColumnApiImpl.js

@@ -60,9 +60,6 @@ export class FreeTextColumnApiImpl extends ApiBase {
                                 existingItem.FreeText = sv.FreeText;
                             }
                         }
-                        else {
-                            freeTextColumn.FreeTextStoredValues.push(sv);
-                        }
                     }
                     else {
                         freeTextColumn.FreeTextStoredValues.push(sv);

package/src/Api/Implementation/StateApiImpl.d.ts

@@ -30,6 +30,8 @@ export declare class StateApiImpl extends ApiBase implements StateApi {
     copyUserStateToClipboard(): void;
     getInitialState(): InitialState | any;
     reloadInitialState(newInitialState?: InitialState): Promise<void>;
+    applyInitialState(newInitialState?: InitialState): Promise<void>;
+    remergePersistedState(): Promise<void>;
     getAllState(): AdaptableState;
     getPersistentState(): AdaptablePersistentState;
     getAllUserState(): BaseState[];

package/src/Api/Implementation/StateApiImpl.js

@@ -66,12 +66,27 @@ export class StateApiImpl extends ApiBase {
                 .then(() => {
                 const newState = this.getPersistentState();
                 this.getEventApi().internalApi.fireAdaptableStateReloadedEvent(oldState, newState);
+                this.getGridApi().refreshAllCells(true);
+                this.getThemeApi().applyCurrentTheme();
             })
                 .then(() => {
                 return this.getAdaptableStore().saveStateNow(this._adaptable, this.getAdaptableStore().TheStore.getState());
             });
         });
     }
+    applyInitialState(newInitialState) {
+        if (newInitialState) {
+            this.getOptions().initialState = JSON.parse(JSON.stringify(newInitialState));
+        }
+        const initialState = (newInitialState ?? this.getInitialState());
+        return this.internalApi.applyMergedInitialAndUserState(initialState, this.getPersistentState());
+    }
+    async remergePersistedState() {
+        const config = buildAdaptableStateFunctionConfig(this._adaptable);
+        const loadState = this.getOptions().stateOptions.loadState;
+        const userState = await loadState(config);
+        return this.internalApi.applyMergedInitialAndUserState(this.getInitialState(), userState);
+    }
     getAllState() {
         return this.getAdaptableState();
     }

package/src/Api/Internal/ColumnFilterInternalApi.d.ts

@@ -5,7 +5,7 @@ import { AdaptablePredicateDef } from '../../AdaptableState/Common/AdaptablePred
 import { ColumnFilter } from '../../AdaptableState/Common/ColumnFilter';
 import { GridCell } from '../../AdaptableState/Selection/GridCell';
 import { LayoutColumnFilterAction } from '../../Redux/ActionsReducers/LayoutRedux';
-import { InFilterValueResult } from '../../types';
+import { InFilterValue, InFilterValueResult } from '../../types';
 import { ApiBase } from '../Implementation/ApiBase';
 import { AdaptableFilterHandler } from '../../agGrid/AdaptableFilterHandler';
 export declare class ColumnFilterInternalApi extends ApiBase {
@@ -58,5 +58,11 @@ export declare class ColumnFilterInternalApi extends ApiBase {
     }): Promise<InFilterValueResult>;
     shouldManuallyApplyColumnFilter(columnId: string): boolean;
     getAdaptableFilterHandler(columnId: string): AdaptableFilterHandler | undefined;
+    /**
+     * Returns the remembered selected In-filter items for a column - used to resolve
+     * labels for selected values missing from the current page (lazy pagination).
+     * @param columnId column to get the remembered values for
+     */
+    getRememberedLazyInFilterValues(columnId: string): InFilterValue[];
     getAllAdaptableFilterHandlers(): AdaptableFilterHandler[];
 }

package/src/Api/Internal/ColumnFilterInternalApi.js

@@ -234,6 +234,9 @@ export class ColumnFilterInternalApi extends ApiBase {
     getAdaptableFilterHandler(columnId) {
         return this.getAgGridApi().getColumnFilterHandler(columnId);
     }
+    getRememberedLazyInFilterValues(columnId) {
+        return this.getAdaptableFilterHandler(columnId)?.getRememberedLazyInFilterValues() ?? [];
+    }
     getAllAdaptableFilterHandlers() {
         const allFilterableColumns = this.getColumnApi().getFilterableColumns();
         const filterHandlers = allFilterableColumns

package/src/Api/Internal/FormatColumnInternalApi.d.ts

@@ -2,6 +2,11 @@ import { Column, HeaderValueGetterParams, IRowNode } from 'ag-grid-enterprise';
 import { AdaptableColumn, AdaptableFormat, AdaptablePredicateDef, ColumnScope, FormatColumn, FormatColumnConfig, FormatColumnTarget, StringFormatterOptions } from '../../types';
 import { ApiBase } from '../Implementation/ApiBase';
 export declare class FormatColumnInternalApi extends ApiBase {
+    /**
+     * Re-evaluate Format Column styles on affected columns after state changes.
+     * Column-model update alone can leave visible cells stale until scroll.
+     */
+    refreshFormatColumnPresentation(formatColumns: FormatColumn | FormatColumn[] | undefined): void;
     /**
      * Retrieves all Format Columns in Adaptable State with the `Style` property set
      * @returns format columns

package/src/Api/Internal/FormatColumnInternalApi.js

@@ -27,6 +27,28 @@ function getParentGroup(source) {
     return undefined;
 }
 export class FormatColumnInternalApi extends ApiBase {
+    refreshFormatColumnPresentation(formatColumns) {
+        if (!formatColumns) {
+            return;
+        }
+        const list = Array.isArray(formatColumns) ? formatColumns : [formatColumns];
+        const columnIds = new Set();
+        for (const formatColumn of list) {
+            if (!formatColumn?.Scope) {
+                continue;
+            }
+            if (this.getColumnScopeApi().scopeIsAll(formatColumn.Scope)) {
+                this.getGridApi().refreshAllCells(true);
+                return;
+            }
+            this.getColumnScopeApi()
+                .getColumnsInScope(formatColumn.Scope)
+                .forEach((column) => columnIds.add(column.columnId));
+        }
+        if (columnIds.size > 0) {
+            this.getGridApi().refreshColumns([...columnIds]);
+        }
+    }
     getAllFormatColumnWithStyle(config) {
         return this.getFormatColumnApi()
             .getFormatColumns(config)

package/src/Api/Internal/StateInternalApi.d.ts

@@ -1,6 +1,11 @@
-import { AdaptablePersistentState, AdaptableState } from '../../types';
+import { AdaptablePersistentState, AdaptableState, InitialState } from '../../types';
 import { ApiBase } from '../Implementation/ApiBase';
 export declare class StateInternalApi extends ApiBase {
+    /**
+     * Startup-equivalent merge: Initial State + user state → store, layout/theme/cells, persist.
+     * Does not clear persistence and does not call `loadState` (caller supplies user state).
+     */
+    applyMergedInitialAndUserState(initialState: InitialState, userState: AdaptablePersistentState | Record<string, unknown> | null | undefined): Promise<void>;
     getAllStateForDevTools(): AdaptableState;
     /**
      * Replaces persisted Adaptable state with the supplied snapshot (e.g. from DevTools).

package/src/Api/Internal/StateInternalApi.js

@@ -1,6 +1,50 @@
 import { getPersistableState, LoadState, InitState } from '../../Redux/Store/AdaptableStore';
+import { MergeStateFunction } from '../../Redux/Store/AdaptableReduxMerger';
+import { buildAdaptableStateFunctionConfig } from '../../Redux/Store/buildAdaptableStateFunctionConfig';
+import { addUuidsToInitialState } from '../../Utilities/Helpers/AdaptableHelper';
 import { ApiBase } from '../Implementation/ApiBase';
+function deepClone(value) {
+    return JSON.parse(JSON.stringify(value ?? null));
+}
 export class StateInternalApi extends ApiBase {
+    applyMergedInitialAndUserState(initialState, userState) {
+        return new Promise((resolve, reject) => {
+            this.getAdaptableInternalApi().executeWithProgressIndicator('Applying Initial State...', () => {
+                try {
+                    const oldState = this.getAdaptableApi().stateApi.getPersistentState();
+                    const initialForMerge = addUuidsToInitialState(deepClone(initialState));
+                    const userForMerge = deepClone(userState ?? {});
+                    let merged = MergeStateFunction(initialForMerge, userForMerge);
+                    const stateFunctionConfig = buildAdaptableStateFunctionConfig(this._adaptable);
+                    merged = this.getOptions().stateOptions.applyState(merged, stateFunctionConfig);
+                    const agGridOptions = {
+                        columnDefs: this._adaptable.agGridAdapter.getGridOption('columnDefs'),
+                        autoGroupColumnDef: this._adaptable.agGridAdapter.getGridOption('autoGroupColumnDef'),
+                        rowModelType: this._adaptable.agGridAdapter.getGridOption('rowModelType'),
+                        treeData: this._adaptable.agGridAdapter.getGridOption('treeData'),
+                    };
+                    merged = this._adaptable.normalizeAdaptableState(merged, agGridOptions);
+                    this.getAdaptableStore().TheStore.dispatch(LoadState(merged));
+                    this.getAdaptableStore().TheStore.dispatch(InitState());
+                    this._adaptable.refreshLayout();
+                    this.getGridApi().refreshAllCells(true);
+                    this.getThemeApi().applyCurrentTheme();
+                    const newState = this.getAdaptableApi().stateApi.getPersistentState();
+                    this.getEventApi().internalApi.fireAdaptableStateReloadedEvent(oldState, newState);
+                    void this.getAdaptableStore()
+                        .saveStateNow(this._adaptable)
+                        .then(() => resolve())
+                        .catch(reject);
+                }
+                catch (error) {
+                    reject(error);
+                }
+                finally {
+                    this.getUserInterfaceApi().hideProgressIndicator();
+                }
+            });
+        });
+    }
     getAllStateForDevTools() {
         let allState = this.getAdaptableApi().stateApi.getAllState();
         if (allState.Layout && Array.isArray(allState.Layout.Layouts)) {

package/src/Api/StateApi.d.ts

@@ -42,6 +42,26 @@ export interface StateApi {
      * @param newInitialState optional new InitialState to load
      */
     reloadInitialState(newInitialState?: InitialState): Promise<void>;
+    /**
+     * Merges Initial State into the **current** user state (Revision / Override / KeepUserDefined),
+     * without clearing persistence. Same merge as startup, applied at runtime.
+     *
+     * When `newInitialState` is provided it also updates `AdaptableOptions.initialState`.
+     * Omitting it re-applies the current Initial State onto current user state.
+     *
+     * @param newInitialState optional Initial State to merge (defaults to current Initial State)
+     */
+    applyInitialState(newInitialState?: InitialState): Promise<void>;
+    /**
+     * Re-runs the startup merge using **persisted** user state from `StateOptions.loadState`
+     * and the current `AdaptableOptions.initialState`. Does not clear persistence.
+     *
+     * Use when remote/local storage may have changed (or Initial State in options was updated)
+     * and you want to re-sync without a full wipe (`reloadInitialState`).
+     *
+     * Unsaved in-memory-only changes are discarded in favour of what `loadState` returns.
+     */
+    remergePersistedState(): Promise<void>;
     /**
      * Copies all Adaptable state to clipboard
      */

package/src/Redux/Store/AdaptableReduxMerger.js

@@ -2,6 +2,7 @@ import { isArray } from '../../Utilities/Extensions/ArrayExtensions';
 import { isObject, merge, mergeWith, } from '../../Utilities/Extensions/ObjectExtensions';
 import { AdaptableLogger } from '../../agGrid/AdaptableLogger';
 import AdaptableHelper from '../../Utilities/Helpers/AdaptableHelper';
+const mergerLogger = new AdaptableLogger('StateMerger');
 function customizer(objValue, srcValue) {
     if (isArray(objValue)) {
         if (!Array.isArray(srcValue)) {
@@ -66,8 +67,10 @@ export function MergeStateFunction(oldState, newState) {
     }
     for (const initialStateModuleName in initialState) {
         if (!state[initialStateModuleName]) {
-            const { Revision, ...moduleState } = initialState[initialStateModuleName];
-            state[initialStateModuleName] = moduleState;
+            state[initialStateModuleName] = initialState[initialStateModuleName];
+            if (initialState[initialStateModuleName]?.Revision != null) {
+                mergerLogger.info(`Added section '${initialStateModuleName}' from Initial State (Revision preserved)`, initialState[initialStateModuleName].Revision);
+            }
         }
     }
     for (const stateModuleName in state) {
@@ -75,14 +78,29 @@ export function MergeStateFunction(oldState, newState) {
             const stateRevision = state[stateModuleName].Revision ?? 0;
             const initialStateRevision = initialState[stateModuleName].Revision ?? 0;
             const stateRevisionKey = typeof stateRevision === 'object' ? stateRevision.Key : stateRevision;
-            const initialStateRevisionBehaviour = typeof initialStateRevision === 'object' ? initialStateRevision.Behavior : 'Override';
+            let initialStateRevisionStrategy = 'Override';
+            if (typeof initialStateRevision === 'object') {
+                const rawStrategy = initialStateRevision.UpdateStrategy ?? initialStateRevision.Behavior;
+                if (rawStrategy === 'KeepUserDefined' || rawStrategy === 'Override') {
+                    initialStateRevisionStrategy = rawStrategy;
+                }
+                else if (rawStrategy != null) {
+                    mergerLogger.warn(`Unknown Revision UpdateStrategy '${rawStrategy}' on section '${stateModuleName}'; falling back to Override`, initialStateRevision);
+                }
+                if (initialStateRevision.UpdateStrategy == null &&
+                    initialStateRevision.Behavior != null) {
+                    mergerLogger.info(`Section '${stateModuleName}' uses legacy Revision.Behavior; prefer UpdateStrategy`, initialStateRevision);
+                }
+            }
             const initialStateRevisionKey = typeof initialStateRevision === 'object' ? initialStateRevision.Key : initialStateRevision;
             if (initialStateRevisionKey > stateRevisionKey) {
-                if (initialStateRevisionBehaviour === 'Override') {
-                    state[stateModuleName] = initialState[stateModuleName];
+                if (initialStateRevisionStrategy === 'KeepUserDefined') {
+                    mergerLogger.info(`Applying Revision on '${stateModuleName}': ${stateRevisionKey} → ${initialStateRevisionKey} (KeepUserDefined)`);
+                    state[stateModuleName] = ProcessKeepUserDefinedRevision(deepClone(initialState[stateModuleName]), state[stateModuleName]);
                 }
                 else {
-                    state[stateModuleName] = ProcessKeepUserDefinedRevision(deepClone(initialState[stateModuleName]), state[stateModuleName]);
+                    mergerLogger.info(`Applying Revision on '${stateModuleName}': ${stateRevisionKey} → ${initialStateRevisionKey} (Override)`);
+                    state[stateModuleName] = initialState[stateModuleName];
                 }
             }
         }

package/src/Redux/Store/AdaptableStore.js

@@ -255,7 +255,7 @@ export class AdaptableStore {
         this.storageEngine.setStateKey(adaptableStateKey);
         this.loadStorageInProgress = true;
         return (this.Load = this.storageEngine
-            .load(adaptable, initialState)
+            .load(adaptable, initialState ?? adaptable.adaptableOptions.initialState)
             .then((storedState) => {
             if (storedState && this.loadStateOnStartup) {
                 this.TheStore.dispatch(LoadState(postProcessState(adaptable.adaptableOptions.stateOptions.applyState(storedState, buildAdaptableStateFunctionConfig(adaptable)))));

package/src/Utilities/Helpers/SettingsPanelHelper.js

@@ -5,7 +5,7 @@ export const DEFAULT_SETTINGS_PANEL_NAVIGATION_GROUPS = [
     },
     {
         label: 'Layout',
-        items: ['Layout', 'CalculatedColumn', 'CustomSort', 'Charting'],
+        items: ['Layout', 'CalculatedColumn', 'FreeTextColumn', 'CustomSort', 'Charting'],
     },
     {
         label: 'Formatting',
@@ -17,7 +17,7 @@ export const DEFAULT_SETTINGS_PANEL_NAVIGATION_GROUPS = [
     },
     {
         label: 'Notes & Annotations',
-        items: ['Alert', 'Note', 'Comment', 'FreeTextColumn', 'SystemStatus'],
+        items: ['Alert', 'Note', 'Comment', 'SystemStatus'],
     },
     {
         label: 'Export & Import',

package/src/View/Components/ColumnFilter/components/FloatingFilterValues.js

@@ -183,17 +183,17 @@ export function useDistinctFilterColumnValues(options) {
         if (!quickFilterValues.hasMore || !quickFilterValues.dataLoadIsComplete) {
             return;
         }
-        let scrollEl = null;
         let debounceTimer;
-        const onScroll = () => {
+        const onScroll = (event) => {
+            const target = event.target;
+            if (!(target instanceof Element) || !target.matches(FILTER_VALUES_SCROLL_SELECTOR)) {
+                return;
+            }
             if (debounceTimer) {
                 clearTimeout(debounceTimer);
             }
             debounceTimer = setTimeout(() => {
-                if (!scrollEl) {
-                    return;
-                }
-                const el = scrollEl;
+                const el = target;
                 const remaining = el.scrollHeight - el.scrollTop - el.clientHeight;
                 if (remaining > NEAR_END_PX) {
                     return;
@@ -201,45 +201,14 @@ export function useDistinctFilterColumnValues(options) {
                 loadMoreValues();
             }, SCROLL_DEBOUNCE_MS);
         };
-        const tryAttach = () => {
-            scrollEl = document.querySelector(FILTER_VALUES_SCROLL_SELECTOR);
-            if (scrollEl) {
-                scrollEl.addEventListener('scroll', onScroll, { passive: true });
-                return true;
-            }
-            return false;
-        };
-        let attached = tryAttach();
-        const raf = attached
-            ? undefined
-            : requestAnimationFrame(() => {
-                attached = tryAttach();
-            });
-        const timeout = attached
-            ? undefined
-            : setTimeout(() => {
-                tryAttach();
-            }, 50);
+        document.addEventListener('scroll', onScroll, { capture: true, passive: true });
         return () => {
-            if (raf != null) {
-                cancelAnimationFrame(raf);
-            }
-            if (timeout != null) {
-                clearTimeout(timeout);
-            }
             if (debounceTimer) {
                 clearTimeout(debounceTimer);
             }
-            if (scrollEl) {
-                scrollEl.removeEventListener('scroll', onScroll);
-            }
+            document.removeEventListener('scroll', onScroll, { capture: true });
         };
-    }, [
-        quickFilterValues.hasMore,
-        quickFilterValues.dataLoadIsComplete,
-        quickFilterValues.values.length,
-        loadMoreValues,
-    ]);
+    }, [quickFilterValues.hasMore, quickFilterValues.dataLoadIsComplete, loadMoreValues]);
     useEffect(() => {
         if (!hasMoreRef.current ||
             !quickFilterValues.dataLoadIsComplete ||

package/src/View/Components/FilterForm/ListBoxFilterForm.js

@@ -10,6 +10,7 @@ import { useMemo } from 'react';
 import { GridFilterCombobox } from '../../../components/Combobox';
 import { isEmbeddedColumnFilterLocation } from '../ColumnFilter/columnFilterLocation';
 import { useColumnFilterLocation } from '../ColumnFilter/AdaptableColumnFilter';
+import { useAdaptable } from '../../AdaptableContext';
 import { GridFilterTreeDropdown } from '../../../components/Tree/TreeDropdown';
 const baseClassName = 'ab-ListBoxFilterForm';
 function toDateDisplayValue(values) {
@@ -29,9 +30,11 @@ const dateOnChangeParser = (value) => {
 const EMPTY_ARRAY = [];
 export const ColumnValuesSelect = (props) => {
     const location = useColumnFilterLocation();
+    const adaptable = useAdaptable();
     const column = props.column;
     let selectedColumnValues = props.value || EMPTY_ARRAY;
     const rawOptionsFromProps = Array.isArray(props.options) ? props.options : EMPTY_ARRAY;
+    const lookupItems = adaptable?.api.filterApi.columnFilterApi.internalApi.getRememberedLazyInFilterValues(column.columnId) ?? EMPTY_ARRAY;
     const optionsFromProps = useMemo(() => {
         if (rawOptionsFromProps === EMPTY_ARRAY) {
             return rawOptionsFromProps;
@@ -88,19 +91,18 @@ export const ColumnValuesSelect = (props) => {
     }
     const options = column.dataType === 'date' || column.columnId === AG_GRID_GROUPED_COLUMN
         ? dateOptions
-        : optionsFromProps.filter((distinctValue) => {
-            let isActive = selectedColumnValues.indexOf(distinctValue.value) >= 0;
-            if (!isActive && distinctValue.value && distinctValue.value instanceof Date) {
-                isActive = selectedColumnValues.some((dateStr) => isEqual(parseDateValue(dateStr), parseDateValue(distinctValue.value)));
+        : optionsFromProps;
+    if (column.dataType !== 'date' && column.columnId !== AG_GRID_GROUPED_COLUMN) {
+        for (const selected of selectedColumnValues) {
+            if (options.some((option) => option.value === selected)) {
+                value.push(selected);
+                continue;
             }
-            if (StringExtensions.IsNullOrEmpty(distinctValue.value)) {
-                return false;
-            }
-            if (isActive) {
-                value.push(distinctValue.value);
-            }
-            return true;
-        });
+            const dateOption = options.find((option) => option.value instanceof Date &&
+                isEqual(parseDateValue(selected), parseDateValue(option.value)));
+            value.push(dateOption ? dateOption.value : selected);
+        }
+    }
     const treeDropdownToDisplayValue = React.useMemo(() => {
         if (column.dataType === 'date') {
             return toDateDisplayValue;
@@ -117,7 +119,7 @@ export const ColumnValuesSelect = (props) => {
         : undefined;
     const component = column.dataType === 'date' || column.columnId === AG_GRID_GROUPED_COLUMN ? (_jsx(GridFilterTreeDropdown, { toDisplayValue: treeDropdownToDisplayValue, resizable: true, onValueChange: column.dataType === 'date'
             ? (value) => props.onChange(dateOnChangeParser(value))
-            : props.onChange, items: options, value: selectedColumnValues, "data-name": "Select Values", primaryKey: 'value', isLoading: props.isLoading, onOpenChange: onOpenChange, showClear: isEmbeddedColumnFilterLocation(location) })) : (_jsx(GridFilterCombobox, { disabled: props.disabled, ...selectProps, onOpenChange: onOpenChange, items: options, value: value, isLoading: props.isLoading, onValueChange: props.onChange, showClear: isEmbeddedColumnFilterLocation(location) }, "select"));
+            : props.onChange, items: options, value: selectedColumnValues, "data-name": "Select Values", primaryKey: 'value', isLoading: props.isLoading, onOpenChange: onOpenChange, showClear: isEmbeddedColumnFilterLocation(location) })) : (_jsx(GridFilterCombobox, { disabled: props.disabled, ...selectProps, onOpenChange: onOpenChange, items: options, value: value, lookupItems: lookupItems, isLoading: props.isLoading, onValueChange: props.onChange, showClear: isEmbeddedColumnFilterLocation(location) }, "select"));
     return (_jsx("div", { className: join(baseClassName, 'twa:relative', props.isLoading && `${baseClassName}--loading`, !value.length && `${baseClassName}--empty`), onKeyDownCapture: (e) => {
             if (e.key === 'Tab') {
                 e.stopPropagation();

package/src/agGrid/AdaptableAgGrid.d.ts

@@ -291,6 +291,7 @@ export declare class AdaptableAgGrid implements IAdaptable {
     autoSizeColumns(columnIds?: string[]): void;
     autoSizeAllColumns(): void;
     getDistinctValuesForColumn(column: AdaptableColumn): Promise<GridCell[]>;
+    private getSelectedInFilterValues;
     getDistinctFilterValuesForColumn(options: {
         column: AdaptableColumn;
         currentSearchValue: string;

package/src/agGrid/AdaptableAgGrid.js

@@ -2372,6 +2372,18 @@ export class AdaptableAgGrid {
     async getDistinctValuesForColumn(column) {
         return this.getDistinctGridCellsForColumn(column);
     }
+    getSelectedInFilterValues(column) {
+        const columnFilterApi = this.api.filterApi.columnFilterApi;
+        const columnFilter = columnFilterApi.getColumnFilterForColumn(column.columnId);
+        const filterHandler = columnFilterApi.internalApi.getAdaptableFilterHandler(column.columnId);
+        const inputs = (columnFilter?.Predicates ?? [])
+            .filter((predicate) => predicate.PredicateId === 'In' || predicate.PredicateId === 'NotIn')
+            .flatMap((predicate) => (Array.isArray(predicate.Inputs) ? predicate.Inputs : []));
+        return inputs.map((value) => {
+            const known = filterHandler?.getRememberedLazyInFilterValue(value);
+            return known ?? { value, label: value == null ? '' : String(value) };
+        });
+    }
     async getDistinctFilterValuesForColumn(options) {
         const { column, previousResult } = options;
         const offset = options.offset ?? 0;
@@ -2426,6 +2438,9 @@ export class AdaptableAgGrid {
                 previousFilterResult: previousResult,
                 offset,
                 limit,
+                get selectedValues() {
+                    return self.getSelectedInFilterValues(column);
+                },
                 get currentSearchValue() {
                     return options.currentSearchValue;
                 },

package/src/agGrid/AdaptableFilterHandler.d.ts

@@ -1,12 +1,13 @@
 import { DoesFilterPassParams, FilterHandler, FilterHandlerParams } from 'ag-grid-enterprise';
 import { AdaptableApi } from '../Api/AdaptableApi';
-import { InFilterValueResult } from '../AdaptableOptions/FilterOptions';
+import { InFilterValue, InFilterValueResult } from '../AdaptableOptions/FilterOptions';
 import { ColumnFilter } from '../types';
 export declare class AdaptableFilterHandler implements FilterHandler<any, any, ColumnFilter> {
     private adaptableApi;
     colId: string;
     private filterDisplayValuesResult;
     private previousFilterDisplayValuesResult;
+    private rememberedInFilterValues;
     constructor(adaptableApi: AdaptableApi);
     init(params: FilterHandlerParams): void;
     doesFilterPass(params: DoesFilterPassParams<any, any, ColumnFilter>): boolean;
@@ -22,6 +23,9 @@ export declare class AdaptableFilterHandler implements FilterHandler<any, any, C
         offset?: number;
         limit?: number;
     }): Promise<InFilterValueResult>;
+    private rememberSelectedLazyInFilterValues;
+    getRememberedLazyInFilterValues(): InFilterValue[];
+    getRememberedLazyInFilterValue(value: any): InFilterValue | undefined;
     onNewRowsLoaded(): void;
     onAnyFilterChanged(): void;
     resetFilterDisplayValues(): void;