@adaptabletools/adaptable 23.1.0-canary.1 → 23.1.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adaptabletools/adaptable",
-  "version": "23.1.0-canary.1",
+  "version": "23.1.0",
   "description": "Powerful AG Grid extension which provides advanced, cutting-edge functionality to meet all DataGrid requirements",
   "keywords": [
     "web-components",
@@ -68,8 +68,8 @@
     "uuid": "9.0.1"
   },
   "peerDependencies": {
-    "ag-grid-enterprise": ">=36.1.0",
-    "ag-stack": ">=36.1.0"
+    "ag-grid-enterprise": ">=36.2.0",
+    "ag-stack": ">=36.2.0"
   },
   "publishTimestamp": 0,
   "type": "module",

package/src/AdaptableOptions/FilterOptions.d.ts

@@ -174,9 +174,20 @@ export interface DefaultPredicateFilterContext<TData = any> extends BaseContext
  */
 export interface InFilterValue<ValueType = any> {
     /**
-     * Item's label
+     * Item's label.
+     *
+     * Either a string, or a function that returns the label. The function is
+     * re-evaluated whenever filtering changes, so the label can embed live info
+     * (e.g. `visibleCount`) without `customInFilterValues` being called again:
+     *
+     * ```ts
+     * label: (item) => `${item.label} (${item.visibleCount})`
+     * ```
+     *
+     * The function receives the item's default {@link InFilterValueInfo} (same shape
+     * as `context.defaultValues`), looked up by `value`.
      */
-    label: string;
+    label: string | InFilterValueLabelFn;
     /**
      * The value of Item being shown
      */
@@ -188,6 +199,11 @@ export interface InFilterValue<ValueType = any> {
     level?: number;
     children?: InFilterValue<ValueType>[];
 }
+/**
+ * Computes the label of an IN Filter item from its default info
+ * (`count`, `visibleCount`, `visible`, ...). Re-evaluated when filtering changes.
+ */
+export type InFilterValueLabelFn = (item: InFilterValueInfo) => string;
 /**
  * Result when providing custom values for the IN Column Filter
  */
@@ -245,6 +261,10 @@ export interface InFilterLabelContext extends BaseContext {
  * Information about items in the IN Column Filter
  */
 export interface InFilterValueInfo extends InFilterValue {
+    /**
+     * Item's default label (the Column's display value)
+     */
+    label: string;
     /**
      * Whether Item is currently selected
      */

package/src/Api/Internal/GridInternalApi.js

@@ -205,7 +205,9 @@ export class GridInternalApi extends ApiBase {
             Aggregatable: defaultColumnDefinition.enableValue,
             SuppressMenu: defaultColumnDefinition.suppressHeaderMenuButton,
             SuppressMovable: defaultColumnDefinition.suppressMovable,
-            HeaderToolTip: defaultColumnDefinition.headerTooltip,
+            HeaderToolTip: typeof defaultColumnDefinition.headerTooltip === 'string'
+                ? defaultColumnDefinition.headerTooltip
+                : undefined,
             Width: defaultColumnDefinition.width,
         };
     }

package/src/Utilities/snapshotInFilterValue.d.ts

@@ -0,0 +1,9 @@
+import { InFilterValue, InFilterValueInfo } from '../AdaptableOptions/FilterOptions';
+/**
+ * Copies an In Filter item into a plain object with a string `label`.
+ *
+ * Items coming from `customInFilterValues` may carry a live `label` getter (when
+ * the consumer returned a label function) - snapshotting reads the current label
+ * and gives UI components fresh references so they re-render the text.
+ */
+export declare const snapshotInFilterValue: (item: InFilterValue) => InFilterValueInfo;

package/src/Utilities/snapshotInFilterValue.js

@@ -0,0 +1,8 @@
+export const snapshotInFilterValue = (item) => {
+    const label = item.label;
+    return {
+        ...item,
+        label: typeof label === 'function' ? label(item) : label,
+        children: item.children ? item.children.map(snapshotInFilterValue) : undefined,
+    };
+};

package/src/View/Components/ColumnFilter/components/FloatingFilterValues.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { ColumnValuesSelectProps } from '../../FilterForm/ListBoxFilterForm';
-import { InFilterLabelContext } from '../../../../types';
+import { InFilterValue, InFilterLabelContext } from '../../../../types';
 /** Suggested page size passed to `customInFilterValues` as `context.limit`. */
 export declare const IN_FILTER_VALUES_PAGE_SIZE = 1000;
 export interface FloatingFilterValuesProps {
@@ -24,10 +24,7 @@ export declare function useDistinctFilterColumnValues(options: {
     isDistinctColumnValuesLoading: boolean;
     isLoadingMore: boolean;
     quickFilterValues: {
-        values: {
-            value: any;
-            label: string;
-        }[];
+        values: import("../../../../types").InFilterValueInfo[];
         dataLoadIsComplete: boolean;
         skipDefaultSearch: boolean;
         searchValueUsedInFilterValue: boolean;
@@ -35,10 +32,7 @@ export declare function useDistinctFilterColumnValues(options: {
         inFilterLabel?: (context: InFilterLabelContext) => string;
     };
     setQuickFilterValues: React.Dispatch<React.SetStateAction<{
-        values: {
-            value: any;
-            label: string;
-        }[];
+        values: InFilterValue[];
         dataLoadIsComplete: boolean;
         skipDefaultSearch: boolean;
         searchValueUsedInFilterValue: boolean;

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

@@ -3,6 +3,7 @@ import * as React from 'react';
 import { useEffect } from 'react';
 import { useAdaptable } from '../../../AdaptableContext';
 import { ColumnValuesSelect } from '../../FilterForm/ListBoxFilterForm';
+import { snapshotInFilterValue } from '../../../../Utilities/snapshotInFilterValue';
 import { AG_GRID_GROUPED_COLUMN } from '../../../../Utilities/Constants/GeneralConstants';
 const onceFlags = {};
 const logOnce = (message, loggingFn) => {
@@ -77,6 +78,37 @@ export function useDistinctFilterColumnValues(options) {
         isLoadingMoreRef.current = next;
         setIsLoadingMore(next);
     }, []);
+    const [labelsVersion, setLabelsVersion] = React.useState(0);
+    useEffect(() => {
+        const filterHandler = api.filterApi.columnFilterApi.internalApi.getAdaptableFilterHandler(columnId);
+        if (!filterHandler || typeof filterHandler.onDisplayValuesInvalidated !== 'function') {
+            return;
+        }
+        return filterHandler.onDisplayValuesInvalidated(() => {
+            const refreshed = filterHandler.getCachedFilterDisplayValues();
+            if (refreshed && !refreshed.hasMore) {
+                hasMoreRef.current = false;
+                accumulatedValuesRef.current = refreshed.values;
+                lastRequestedOffsetRef.current = 0;
+                setQuickFilterValues((prev) => ({
+                    ...prev,
+                    values: refreshed.values,
+                    dataLoadIsComplete: true,
+                    skipDefaultSearch: !!refreshed.skipDefaultSearch,
+                    hasMore: false,
+                    inFilterLabel: refreshed.inFilterLabel,
+                }));
+                return;
+            }
+            setLabelsVersion((version) => version + 1);
+        });
+    }, [api, columnId]);
+    const displayedQuickFilterValues = React.useMemo(() => {
+        return {
+            ...quickFilterValues,
+            values: quickFilterValues.values.map(snapshotInFilterValue),
+        };
+    }, [quickFilterValues, labelsVersion]);
     const fetchFilterValues = React.useCallback((offset) => {
         let searchValueUsedInFilterValue = false;
         const columnFilterInternalApi = api.filterApi.columnFilterApi.internalApi;
@@ -283,7 +315,7 @@ export function useDistinctFilterColumnValues(options) {
     return {
         isDistinctColumnValuesLoading,
         isLoadingMore,
-        quickFilterValues,
+        quickFilterValues: displayedQuickFilterValues,
         setQuickFilterValues,
         triggerValuesLoad,
     };

package/src/View/Components/Selectors/PermittedValuesSelector.js

@@ -3,6 +3,7 @@ import * as React from 'react';
 import { runIfNotResolvedIn } from '../../../Utilities/runIfNotResolvedIn';
 import { useAdaptable } from '../../AdaptableContext';
 import { useCallback } from 'react';
+import { snapshotInFilterValue } from '../../../Utilities/snapshotInFilterValue';
 import { MultiCombobox, SingleCombobox, } from '../../../components/Combobox';
 export const PermittedValuesSelector = function (props) {
     const adaptable = useAdaptable();
@@ -42,7 +43,9 @@ export const PermittedValuesSelector = function (props) {
             });
             setSearchValueWasUsedWhenFiltering(searchValueUsedInFilterValue);
             setIsLoading(false);
-            setOptions(Array.isArray(distinctColumnValues) ? distinctColumnValues : distinctColumnValues.values);
+            setOptions((Array.isArray(distinctColumnValues)
+                ? distinctColumnValues
+                : distinctColumnValues.values).map(snapshotInFilterValue));
         })();
     }, [props.columnId, props.loadValues, refetchKey]);
     const isCreatable = (props.allowNewValues && !dataType) || ['text', 'number'].includes(dataType);

package/src/agGrid/AdaptableAgGrid.js

@@ -618,7 +618,6 @@ export class AdaptableAgGrid {
             agGridApi.onFilterChanged();
             filteringApplied = true;
         }
-        agGridApi.refreshCells();
         this._emit('AdapTableFiltersApplied');
         return filteringApplied;
     }
@@ -2440,32 +2439,90 @@ export class AdaptableAgGrid {
         };
         const mapFn = (gridCell, level) => {
             if (level || Array.isArray(gridCell.children)) {
-                const cell = gridCell;
-                const inFilterValue = {
-                    value: gridCell.rawValue,
-                    label: gridCell.displayValue,
-                    level: level ?? 0,
-                    tooltip: false,
-                    get visible() {
-                        return gridCell.visible;
-                    },
-                    count: gridCell.count ?? 0,
-                    leafChildrenCount: cell.leafChildrenCount ?? 0,
-                    get visibleCount() {
-                        return gridCell.visibleCount ?? 0;
-                    },
-                    isSelected: gridCell.rowNode.displayed,
-                    children: cell.children
-                        ? cell.children.map((v) => mapFn(v, level ? level + 1 : 1))
-                        : undefined,
-                };
-                return inFilterValue;
+                return toInFilterValueInfo(gridCell, level ?? 0);
             }
             return {
                 value: gridCell.rawValue,
                 label: gridCell.displayValue,
             };
         };
+        const toInFilterValueInfo = (gridCell, level) => {
+            const itemId = `${gridCell.rowNode?.id}-${gridCell.column?.columnId}`;
+            let children;
+            let childrenComputed = false;
+            return {
+                id: itemId,
+                label: gridCell.displayValue,
+                value: gridCell.rawValue,
+                isSelected: gridCell.rowNode.displayed,
+                count: gridCell.count ?? 0,
+                tooltip: false,
+                level,
+                leafChildrenCount: gridCell.leafChildrenCount ?? 0,
+                get children() {
+                    if (!childrenComputed) {
+                        childrenComputed = true;
+                        children = gridCell.children?.map((child) => mapFn(child, level + 1));
+                    }
+                    return children;
+                },
+                get visible() {
+                    return gridCell.visible;
+                },
+                get visibleCount() {
+                    return gridCell.visibleCount ?? 0;
+                },
+            };
+        };
+        let infoByValue;
+        const getInfoForValue = (value) => {
+            if (!infoByValue) {
+                const lookup = (infoByValue = new Map());
+                const visit = (gridCells, level) => {
+                    for (const gridCell of gridCells) {
+                        if (!lookup.has(gridCell.rawValue)) {
+                            lookup.set(gridCell.rawValue, toInFilterValueInfo(gridCell, level));
+                        }
+                        const children = gridCell.children;
+                        if (children) {
+                            visit(children, level + 1);
+                        }
+                    }
+                };
+                visit(getCurrentGridCells(), 0);
+            }
+            return infoByValue.get(value);
+        };
+        const resolveLabels = (values, level) => {
+            return values.map((item) => {
+                const children = item.children ? resolveLabels(item.children, level + 1) : undefined;
+                if (typeof item.label !== 'function') {
+                    return children === item.children ? item : { ...item, children };
+                }
+                const labelFn = item.label;
+                let info;
+                return {
+                    ...item,
+                    children,
+                    get label() {
+                        if (!info) {
+                            info = getInfoForValue(item.value) ?? {
+                                value: item.value,
+                                label: item.value == null ? '' : String(item.value),
+                                tooltip: item.tooltip ?? false,
+                                level,
+                                isSelected: false,
+                                count: 0,
+                                visibleCount: 0,
+                                visible: false,
+                                leafChildrenCount: 0,
+                            };
+                        }
+                        return labelFn(info);
+                    },
+                };
+            });
+        };
         const customInFilterValues = this.adaptableOptions.filterOptions.customInFilterValues;
         if (customInFilterValues) {
             const gridApiInternal = this.api.gridApi.internalApi;
@@ -2482,101 +2539,33 @@ export class AdaptableAgGrid {
                     return options.currentSearchValue;
                 },
                 get sortedValues() {
-                    const result = gridApiInternal
+                    return gridApiInternal
                         .sortDistinctValues(getCurrentGridCells(), column)
-                        .map((gridCell) => {
-                        const itemId = `${gridCell.rowNode?.id}-${gridCell.column?.columnId}`;
-                        return {
-                            id: itemId,
-                            label: gridCell.displayValue,
-                            value: gridCell.rawValue,
-                            isSelected: gridCell.rowNode.displayed,
-                            count: gridCell.count ?? 0,
-                            tooltip: false,
-                            level: 0,
-                            leafChildrenCount: gridCell.leafChildrenCount ?? 0,
-                            get children() {
-                                if (!gridCell.children) {
-                                    return undefined;
-                                }
-                                return gridCell.children.map((gridCell) => mapFn(gridCell, 1));
-                            },
-                            get visible() {
-                                return gridCell.visible;
-                            },
-                            get visibleCount() {
-                                return gridCell.visibleCount ?? 0;
-                            },
-                        };
-                    });
-                    return result;
+                        .map((gridCell) => toInFilterValueInfo(gridCell, 0));
                 },
                 get defaultValues() {
-                    const result = getCurrentGridCells().map((gridCell) => {
-                        const itemId = `${gridCell.rowNode?.id}-${gridCell.column?.columnId}`;
-                        return {
-                            id: itemId,
-                            label: gridCell.displayValue,
-                            value: gridCell.rawValue,
-                            isSelected: gridCell.rowNode.displayed,
-                            count: gridCell.count ?? 0,
-                            tooltip: false,
-                            level: 0,
-                            leafChildrenCount: gridCell.leafChildrenCount ?? 0,
-                            get children() {
-                                if (!gridCell.children) {
-                                    return undefined;
-                                }
-                                return gridCell.children.map((gridCell) => mapFn(gridCell, 1));
-                            },
-                            get visible() {
-                                return gridCell.visible;
-                            },
-                            get visibleCount() {
-                                return gridCell.visibleCount ?? 0;
-                            },
-                        };
-                    });
-                    return result;
+                    return getCurrentGridCells().map((gridCell) => toInFilterValueInfo(gridCell, 0));
                 },
                 get orderedValues() {
                     const rowNodes = gridApiInternal.getSortedRowNodesWithCurrentLayoutSortOrder();
-                    const currentGridCells = self.getDistinctGridCellsForColumn(column, rowNodes);
-                    const result = currentGridCells.map((gridCell) => {
-                        const itemId = `${gridCell.rowNode?.id}-${gridCell.column?.columnId}`;
-                        return {
-                            id: itemId,
-                            label: gridCell.displayValue,
-                            value: gridCell.rawValue,
-                            isSelected: gridCell.rowNode.displayed,
-                            count: gridCell.count,
-                            tooltip: false,
-                            level: 0,
-                            get children() {
-                                if (!gridCell.children) {
-                                    return undefined;
-                                }
-                                return gridCell.children.map((gridCell) => mapFn(gridCell, 1));
-                            },
-                            leafChildrenCount: gridCell.leafChildrenCount ?? 0,
-                            get visible() {
-                                return gridCell.visible;
-                            },
-                            get visibleCount() {
-                                return gridCell.visibleCount;
-                            },
-                        };
-                    });
-                    return result;
+                    return self
+                        .getDistinctGridCellsForColumn(column, rowNodes)
+                        .map((gridCell) => toInFilterValueInfo(gridCell, 0));
                 },
             };
-            let customInFilterValuesResult;
+            let customInFilterValuesResult = undefined;
             try {
                 customInFilterValuesResult = await customInFilterValues(customInFilterValuesContext);
             }
             catch (error) {
                 this.logger.consoleError('Failed to retrieve custom filter values.', column, error);
             }
+            if (customInFilterValuesResult?.values) {
+                return {
+                    ...customInFilterValuesResult,
+                    values: resolveLabels(customInFilterValuesResult.values, 0),
+                };
+            }
             return customInFilterValuesResult;
         }
         const values = getCurrentGridCells().map((gridCell) => mapFn(gridCell));

package/src/agGrid/AdaptableFilterHandler.d.ts

@@ -8,7 +8,14 @@ export declare class AdaptableFilterHandler implements FilterHandler<any, any, C
     private filterDisplayValuesResult;
     private previousFilterDisplayValuesResult;
     private rememberedInFilterValues;
+    private displayValuesInvalidatedListeners;
     constructor(adaptableApi: AdaptableApi);
+    /**
+     * Notifies when the cached display values are invalidated by a filter change
+     * (or new rows), so mounted filter components can re-read live labels.
+     */
+    onDisplayValuesInvalidated(listener: () => void): () => void;
+    private notifyDisplayValuesInvalidated;
     init(params: FilterHandlerParams): void;
     doesFilterPass(params: DoesFilterPassParams<any, any, ColumnFilter>): boolean;
     getCachedFilterDisplayValues(): InFilterValueResult | undefined;

package/src/agGrid/AdaptableFilterHandler.js

@@ -4,9 +4,21 @@ export class AdaptableFilterHandler {
     filterDisplayValuesResult;
     previousFilterDisplayValuesResult;
     rememberedInFilterValues = new Map();
+    displayValuesInvalidatedListeners = new Set();
     constructor(adaptableApi) {
         this.adaptableApi = adaptableApi;
     }
+    onDisplayValuesInvalidated(listener) {
+        this.displayValuesInvalidatedListeners.add(listener);
+        return () => {
+            this.displayValuesInvalidatedListeners.delete(listener);
+        };
+    }
+    notifyDisplayValuesInvalidated() {
+        this.displayValuesInvalidatedListeners.forEach((listener) => {
+            listener();
+        });
+    }
     init(params) {
         this.colId = params.column.getColId();
     }
@@ -117,15 +129,19 @@ export class AdaptableFilterHandler {
             this.previousFilterDisplayValuesResult = this.filterDisplayValuesResult;
         }
         this.filterDisplayValuesResult = undefined;
+        this.notifyDisplayValuesInvalidated();
     }
     async refreshFilterDisplayValues() {
         this.resetFilterDisplayValues();
-        return this.getFromCacheOrFetchFilterDisplayValues({ currentSearchValue: '' });
+        const result = await this.getFromCacheOrFetchFilterDisplayValues({ currentSearchValue: '' });
+        this.notifyDisplayValuesInvalidated();
+        return result;
     }
     refresh(_params) { }
     destroy() {
         this.filterDisplayValuesResult = undefined;
         this.previousFilterDisplayValuesResult = undefined;
         this.rememberedInFilterValues.clear();
+        this.displayValuesInvalidatedListeners.clear();
     }
 }

package/src/agGrid/AgGridAdapter.js

@@ -48,47 +48,6 @@ const patchLocalEventServiceDispatchEvent = (beans) => {
         DANGER_AG_GRID_ADAPTERS_MAP[gridId]?.handleRowNodeEvent(rowNodeEvent);
     };
 };
-const patchVisibleColsPartition = (beans) => {
-    const visibleCols = beans?.visibleCols;
-    if (!visibleCols || typeof visibleCols.partitionVisibleCols !== 'function') {
-        console.error(`CRITICAL: could not get hold of AG Grid VisibleColsService.partitionVisibleCols, the selection column may NOT be displayed when it is the last column!`);
-        return;
-    }
-    const original_partitionVisibleCols = visibleCols.partitionVisibleCols;
-    visibleCols.partitionVisibleCols = function () {
-        const result = original_partitionVisibleCols.apply(this, arguments);
-        const leftCols = result?.leftCols ?? [];
-        const rightCols = result?.rightCols ?? [];
-        const centerCols = result?.centerCols ?? [];
-        if (leftCols.length + rightCols.length + centerCols.length === 0) {
-            return result;
-        }
-        const colModel = beans.colModel;
-        const selectionCol = colModel?.colsList?.find((col) => col?.colKind === 'selection');
-        if (!selectionCol || !selectionCol.visible) {
-            return result;
-        }
-        if (leftCols.includes(selectionCol) ||
-            rightCols.includes(selectionCol) ||
-            centerCols.includes(selectionCol)) {
-            return result;
-        }
-        const showAutoGroupAndValuesOnly = colModel.pivotMode && !colModel.showingPivotResult;
-        if (showAutoGroupAndValuesOnly && !(beans.selectionColSvc?.isEnabled?.() ?? false)) {
-            return result;
-        }
-        if (selectionCol.pinned === 'right') {
-            rightCols.push(selectionCol);
-        }
-        else if (selectionCol.pinned) {
-            leftCols.push(selectionCol);
-        }
-        else {
-            centerCols.push(selectionCol);
-        }
-        return result;
-    };
-};
 export class AgGridAdapter {
     _adaptableInstance;
     DANGER_USE_GETTER_gridApi;
@@ -117,7 +76,6 @@ export class AgGridAdapter {
                 }
                 DANGER_AG_GRID_BEANS_MAP[gridId] = beans;
                 patchLocalEventServiceDispatchEvent(beans);
-                patchVisibleColsPartition(beans);
             };
         }
     }

package/src/env.js

@@ -1,5 +1,5 @@
 export default {
     NEXT_PUBLIC_INFINITE_TABLE_LICENSE_KEY: "StartDate=2021-06-29|EndDate=2030-01-01|Owner=Adaptable|Type=distribution|TS=1624971462479|C=137829811,1004007071,2756196225,1839832928,3994409405,636616862" || '',
-    PUBLISH_TIMESTAMP: 1789562482621 || Date.now(),
-    VERSION: "23.1.0-canary.1" || '--current-version--',
+    PUBLISH_TIMESTAMP: 1789640674246 || Date.now(),
+    VERSION: "23.1.0" || '--current-version--',
 };