@adaptabletools/adaptable-cjs 21.0.11 → 21.1.0-canary.0

package/src/AdaptableState/Common/AdaptablePredicate.js

@@ -18,6 +18,26 @@ const date_fns_13 = require("date-fns");
 const StringExtensions_1 = tslib_1.__importDefault(require("../../Utilities/Extensions/StringExtensions"));
 const DateHelper_1 = require("../../Utilities/Helpers/DateHelper");
 const Helper_1 = tslib_1.__importDefault(require("../../Utilities/Helpers/Helper"));
+const GeneralConstants_1 = require("../../Utilities/Constants/GeneralConstants");
+function getGroupValuesForNode(config) {
+    const { node, value } = config;
+    const groupValues = node.group
+        ? []
+        : /*for the leaf node, also use its value*/ value != null
+            ? [value]
+            : [];
+    let currentNode = node.group ? node : node.parent;
+    while (currentNode && currentNode.groupData) {
+        if (currentNode.treeParent && !currentNode.data) {
+            // skip filler groups in tree mode
+        }
+        else {
+            groupValues.unshift(currentNode.groupData[GeneralConstants_1.AG_GRID_GROUPED_COLUMN]);
+        }
+        currentNode = currentNode.parent;
+    }
+    return groupValues;
+}
 /**
  * Array of Predicate Defs which are shipped by AdapTable
  */
@@ -26,7 +46,10 @@ exports.SystemPredicateDefs = [
         id: 'In',
         label: 'In',
         icon: { text: 'IN' },
-        columnScope: { DataTypes: ['text', 'number', 'date', 'textArray', 'numberArray'] },
+        columnScope: {
+            DataTypes: ['text', 'number', 'date', 'textArray', 'numberArray'],
+            ColumnIds: [GeneralConstants_1.AG_GRID_GROUPED_COLUMN],
+        },
         moduleScope: ['columnFilter', 'flashingcell', 'formatColumn', 'alert', 'badgeStyle'],
         handler: (context) => {
             const { inputs = [], column, value, adaptableApi } = context;
@@ -63,9 +86,26 @@ exports.SystemPredicateDefs = [
             if (inputs.length === 0) {
                 return true;
             }
+            if (column.columnId === GeneralConstants_1.AG_GRID_GROUPED_COLUMN) {
+                const { node, treeSelectionState } = context;
+                const groupValues = getGroupValuesForNode({ node, value });
+                if (!treeSelectionState) {
+                    // in case we don't have treeSelectionState
+                    // this is another possible implementation
+                    // though it won't be as performant as using the treeSelectionState
+                    const currentValues = (groupValues ?? []).join('#');
+                    return inputs.some((values) => {
+                        const valuesString = values.join('#');
+                        return currentValues.startsWith(valuesString);
+                    });
+                }
+                const result = groupValues ? treeSelectionState.isNodeSelected(groupValues) : false;
+                // console.log('filter', groupValues, 'pass', result, treeSelectionState.getState());
+                return result;
+            }
             if (column.dataType === 'date') {
                 return inputs.some((input) => {
-                    if (adaptableApi.optionsApi.getPredicateOptions().evaluateInPredicateUsingTime) {
+                    if (adaptableApi.predicateApi.internalApi.shouldEvaluateInPredicateUsingTime(column.columnId)) {
                         return (0, date_fns_3.isEqual)(input, value);
                     }
                     else {
@@ -82,7 +122,7 @@ exports.SystemPredicateDefs = [
                     return arrayValue.includes(input);
                 });
             }
-            const useCaseSensitivity = adaptableApi.predicateApi.useCaseSensitivity();
+            const useCaseSensitivity = adaptableApi.predicateApi.useCaseSensitivity(column.columnId);
             if (column.dataType === 'text') {
                 return useCaseSensitivity
                     ? inputs
@@ -105,6 +145,80 @@ exports.SystemPredicateDefs = [
         toString: ({ inputs }) => `IN (${inputs.join(', ')})`,
         shortcuts: ['#', '['],
     },
+    // {
+    //   id: 'Tree',
+    //   label: 'Tree',
+    //   icon: { text: 'Tree' },
+    //   columnScope: { DataTypes: ['date'] },
+    //   moduleScope: ['columnFilter', 'flashingcell', 'formatColumn', 'alert'],
+    //   handler: (context) => {
+    //     const { inputs = [], column, value, adaptableApi } = context;
+    //     const predicateInputs = (context.inputs || []).reduce<AdaptablePredicateDef[]>(
+    //       (acc, input) => {
+    //         const predicate = adaptableApi.predicateApi.getPredicateDefById(input);
+    //         if (predicate) {
+    //           acc.push(predicate);
+    //         }
+    //         return acc;
+    //       },
+    //       []
+    //     );
+    //     if (predicateInputs.length) {
+    //       const nestedContext = { ...context };
+    //       delete nestedContext.inputs;
+    //       const predicateResult = predicateInputs.some((predicate) => {
+    //         return adaptableApi.predicateApi.handlePredicate(
+    //           {
+    //             PredicateId: predicate.id,
+    //           },
+    //           nestedContext,
+    //           false
+    //         );
+    //       });
+    //       if (predicateResult) {
+    //         // We want to use the only true values, to allow for multiple predicates to be used
+    //         return predicateResult;
+    //       }
+    //     }
+    //     if (inputs.length === 0) {
+    //       return true;
+    //     }
+    //     if (column.dataType === 'date') {
+    //       const treeSelectionState = new TreeSelectionState(
+    //         {
+    //           defaultSelection: false,
+    //           // make sure something like
+    //           // Predicates: [{ PredicateId: 'Tree', Inputs: [['2021', '2'], ['2022']] }],
+    //           // is always converted to numbers
+    //           selectedPaths: inputs
+    //             .map((array) => {
+    //               if (!Array.isArray(array)) {
+    //                 return null;
+    //               }
+    //               return array.map(Number);
+    //             })
+    //             .filter(Boolean),
+    //         },
+    //         () => {
+    //           return {
+    //             treeDeepMap: new DeepMap<string, any>(),
+    //             treePaths: new DeepMap<string, any>(),
+    //           };
+    //         }
+    //       );
+    //       const currrentDate = parseDateValue(value);
+    //       const currentYear = currrentDate.getFullYear();
+    //       const currentMonth = currrentDate.getMonth() + 1;
+    //       const currentDay = currrentDate.getDate();
+    //       const result = treeSelectionState.isNodeSelected([currentYear, currentMonth, currentDay]);
+    //       // console.log({ currentYear, currentMonth, currentDay, result, inputs: inputs.join('-') });
+    //       return result;
+    //     }
+    //     return true;
+    //   },
+    //   toString: ({ inputs }) => `IN Tree (${inputs.join(', ')})`,
+    //   shortcuts: ['#', '['],
+    // },
     {
         id: 'NotIn',
         label: 'Not In',
@@ -149,7 +263,7 @@ exports.SystemPredicateDefs = [
                 return true;
             }
             if (column.dataType === 'date') {
-                if (adaptableApi.optionsApi.getPredicateOptions().evaluateInPredicateUsingTime) {
+                if (adaptableApi.predicateApi.useCaseSensitivity(column.columnId)) {
                     return inputs.every((input) => {
                         return !(0, date_fns_3.isEqual)(input, value);
                     });
@@ -170,7 +284,7 @@ exports.SystemPredicateDefs = [
                 });
             }
             if (column.dataType === 'text') {
-                return adaptableApi.predicateApi.useCaseSensitivity()
+                return adaptableApi.predicateApi.useCaseSensitivity(column.columnId)
                     ? !inputs
                         .map((i) => {
                         return i?.toLocaleLowerCase();
@@ -181,7 +295,7 @@ exports.SystemPredicateDefs = [
             if (column.dataType === 'textArray') {
                 const arrayValue = Array.isArray(value) ? value : [value];
                 return inputs.every((input) => {
-                    return adaptableApi.predicateApi.useCaseSensitivity()
+                    return adaptableApi.predicateApi.useCaseSensitivity(column.columnId)
                         ? !arrayValue.map((v) => v?.toLocaleLowerCase()).includes(input?.toLocaleLowerCase())
                         : !arrayValue.includes(input);
                 });
@@ -337,11 +451,11 @@ exports.SystemPredicateDefs = [
         columnScope: { DataTypes: ['text'] },
         moduleScope: ['columnFilter', 'alert', 'flashingcell', 'formatColumn', 'badgeStyle'],
         inputs: [{ type: 'text' }],
-        handler: ({ value, inputs, adaptableApi }) => {
+        handler: ({ value, inputs, adaptableApi, column }) => {
             if (!value) {
                 return false;
             }
-            const ignoreCase = !adaptableApi.predicateApi.useCaseSensitivity();
+            const ignoreCase = !adaptableApi.predicateApi.internalApi.shouldUseCaseSensitivePredicates(column);
             const v = ignoreCase ? String(value).toLocaleLowerCase() : String(value);
             const i = ignoreCase ? String(inputs[0]).toLocaleLowerCase() : String(inputs[0]);
             return v == i;
@@ -356,11 +470,11 @@ exports.SystemPredicateDefs = [
         columnScope: { DataTypes: ['text'] },
         moduleScope: ['columnFilter', 'alert', 'flashingcell', 'formatColumn', 'badgeStyle'],
         inputs: [{ type: 'text' }],
-        handler: ({ value, inputs, adaptableApi }) => {
+        handler: ({ value, inputs, adaptableApi, column }) => {
             if (!value) {
                 return true;
             }
-            const ignoreCase = !adaptableApi.predicateApi.useCaseSensitivity();
+            const ignoreCase = !adaptableApi.predicateApi.internalApi.shouldUseCaseSensitivePredicates(column);
             const v = ignoreCase ? String(value).toLocaleLowerCase() : String(value);
             const i = ignoreCase ? String(inputs[0]).toLocaleLowerCase() : String(inputs[0]);
             return v != i;
@@ -375,11 +489,11 @@ exports.SystemPredicateDefs = [
         columnScope: { DataTypes: ['text'] },
         moduleScope: ['columnFilter', 'alert', 'flashingcell', 'formatColumn', 'badgeStyle'],
         inputs: [{ type: 'text' }],
-        handler: ({ value, inputs, adaptableApi }) => {
+        handler: ({ value, inputs, adaptableApi, column }) => {
             if (!value) {
                 return false;
             }
-            const ignoreCase = !adaptableApi.predicateApi.useCaseSensitivity();
+            const ignoreCase = !adaptableApi.predicateApi.internalApi.shouldUseCaseSensitivePredicates(column);
             const v = ignoreCase ? String(value).toLocaleLowerCase() : String(value);
             const i = ignoreCase ? String(inputs[0]).toLocaleLowerCase() : String(inputs[0]);
             return v.indexOf(i) !== -1;
@@ -393,11 +507,11 @@ exports.SystemPredicateDefs = [
         columnScope: { DataTypes: ['text'] },
         moduleScope: ['columnFilter', 'alert', 'flashingcell', 'formatColumn', 'badgeStyle'],
         inputs: [{ type: 'text' }],
-        handler: ({ value, inputs, adaptableApi }) => {
+        handler: ({ value, inputs, adaptableApi, column }) => {
             if (!value) {
                 return true;
             }
-            const ignoreCase = !adaptableApi.predicateApi.useCaseSensitivity();
+            const ignoreCase = !adaptableApi.predicateApi.internalApi.shouldUseCaseSensitivePredicates(column);
             const v = ignoreCase ? String(value).toLocaleLowerCase() : String(value);
             const i = ignoreCase ? String(inputs[0]).toLocaleLowerCase() : String(inputs[0]);
             return v.indexOf(i) === -1;
@@ -411,11 +525,11 @@ exports.SystemPredicateDefs = [
         columnScope: { DataTypes: ['text'] },
         moduleScope: ['columnFilter', 'alert', 'flashingcell', 'formatColumn', 'badgeStyle'],
         inputs: [{ type: 'text' }],
-        handler: ({ value, inputs, adaptableApi }) => {
+        handler: ({ value, inputs, adaptableApi, column }) => {
             if (!value) {
                 return false;
             }
-            const ignoreCase = !adaptableApi.predicateApi.useCaseSensitivity();
+            const ignoreCase = !adaptableApi.predicateApi.internalApi.shouldUseCaseSensitivePredicates(column);
             const v = ignoreCase ? String(value).toLocaleLowerCase() : String(value);
             const i = ignoreCase ? String(inputs[0]).toLocaleLowerCase() : String(inputs[0]);
             return v.startsWith(i);
@@ -429,11 +543,11 @@ exports.SystemPredicateDefs = [
         columnScope: { DataTypes: ['text'] },
         moduleScope: ['columnFilter', 'alert', 'flashingcell', 'formatColumn', 'badgeStyle'],
         inputs: [{ type: 'text' }],
-        handler: ({ value, inputs, adaptableApi }) => {
+        handler: ({ value, inputs, adaptableApi, column }) => {
             if (!value) {
                 return false;
             }
-            const ignoreCase = !adaptableApi.predicateApi.useCaseSensitivity();
+            const ignoreCase = !adaptableApi.predicateApi.internalApi.shouldUseCaseSensitivePredicates(column);
             const v = ignoreCase ? String(value).toLocaleLowerCase() : String(value);
             const i = ignoreCase ? String(inputs[0]).toLocaleLowerCase() : String(inputs[0]);
             return v.endsWith(i);

package/src/AdaptableState/Selection/GridCell.d.ts

@@ -64,6 +64,16 @@ export interface GridCellWithCount extends GridCell {
      */
     visibleCount?: number;
 }
+export interface GridCellWithChildren extends GridCell {
+    /**
+     * Children of Cell
+     */
+    children?: GridCellWithChildren[];
+    /**
+     * For the grouping scenario, how many leafs are there under this item
+     */
+    leafChildrenCount?: number;
+}
 export interface UniqueGridCell<TData = any> {
     /**
      * Raw value of Cell

package/src/Api/Implementation/ExportApiImpl.js

@@ -89,13 +89,7 @@ class ExportApiImpl extends ApiBase_1.ApiBase {
                 currentReportFormat: this.getExportApi().getCurrentReportFormat(),
             })
             : systemExportDestinationsOption;
-        return systemExportDestinations.filter((destination) => {
-            // VisualExcel format can't be exported to custom destinations
-            if (this.getExportApi().getCurrentReportFormat() === GeneralConstants_1.VISUAL_EXCEL_FORMAT_REPORT) {
-                return false;
-            }
-            return true;
-        });
+        return systemExportDestinations;
     }
     getAvailableCustomDestinations() {
         const customDestinationsOption = this.getExportOptions().customDestinations;

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

@@ -3,6 +3,8 @@ import { PredicateApi } from '../PredicateApi';
 import { AdaptableColumnPredicate, AdaptablePredicate, AdaptablePredicateDef, PredicateDefHandlerContext, PredicateModuleScope } from '../../types';
 import { IAdaptable } from '../../AdaptableInterfaces/IAdaptable';
 import { PredicateInternalApi } from '../Internal/PredicateInternalApi';
+import { TreeSelectionState } from '@infinite-table/infinite-react';
+export declare const getTreeSelectionStateForPredicateInputs: (inputs: any[], cache?: WeakMap<any[], TreeSelectionState>) => TreeSelectionState<any>;
 export declare class PredicateApiImpl extends ApiBase implements PredicateApi {
     internalApi: PredicateInternalApi;
     constructor(_adaptable: IAdaptable);
@@ -22,5 +24,5 @@ export declare class PredicateApiImpl extends ApiBase implements PredicateApi {
     handleColumnPredicates(predicates: AdaptableColumnPredicate[], context: Omit<PredicateDefHandlerContext, 'adaptableApi' | 'inputs'>, defaultReturn: boolean): boolean;
     handlePredicate(predicate: AdaptablePredicate | undefined, context: Omit<PredicateDefHandlerContext, 'adaptableApi' | 'inputs'>, defaultReturn: boolean): boolean;
     handlePredicates(predicates: AdaptablePredicate[], params: Omit<PredicateDefHandlerContext, 'adaptableApi' | 'inputs'>, defaultReturn: boolean): boolean;
-    useCaseSensitivity(): boolean;
+    useCaseSensitivity(columnId: string): boolean;
 }

package/src/Api/Implementation/PredicateApiImpl.js

@@ -1,12 +1,31 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.PredicateApiImpl = void 0;
+exports.PredicateApiImpl = exports.getTreeSelectionStateForPredicateInputs = void 0;
 const tslib_1 = require("tslib");
 const ApiBase_1 = require("./ApiBase");
 const ArrayExtensions_1 = tslib_1.__importDefault(require("../../Utilities/Extensions/ArrayExtensions"));
 const StringExtensions_1 = tslib_1.__importDefault(require("../../Utilities/Extensions/StringExtensions"));
 const PredicateInternalApi_1 = require("../Internal/PredicateInternalApi");
 const AdaptablePredicate_1 = require("../../AdaptableState/Common/AdaptablePredicate");
+const GeneralConstants_1 = require("../../Utilities/Constants/GeneralConstants");
+const infinite_react_1 = require("@infinite-table/infinite-react");
+const treeSelectionStatesForPredicates = new WeakMap();
+const getTreeSelectionStateForPredicateInputs = (inputs, cache = treeSelectionStatesForPredicates) => {
+    const treeSelectionState = cache.get(inputs);
+    if (treeSelectionState) {
+        return treeSelectionState;
+    }
+    const newTreeSelectionState = new infinite_react_1.TreeSelectionState({
+        defaultSelection: false,
+        selectedPaths: inputs,
+    }, {
+        treePaths: inputs,
+        strictCheckPaths: false,
+    });
+    cache.set(inputs, newTreeSelectionState);
+    return newTreeSelectionState;
+};
+exports.getTreeSelectionStateForPredicateInputs = getTreeSelectionStateForPredicateInputs;
 class PredicateApiImpl extends ApiBase_1.ApiBase {
     constructor(_adaptable) {
         super(_adaptable);
@@ -129,10 +148,15 @@ class PredicateApiImpl extends ApiBase_1.ApiBase {
         if (predicateDef.inputs?.some((_, i) => predicate.Inputs?.[i] === undefined || predicate.Inputs?.[i] === '')) {
             return defaultReturn;
         }
+        let treeSelectionState;
+        if (context.column.columnId === GeneralConstants_1.AG_GRID_GROUPED_COLUMN && predicate.PredicateId === 'In') {
+            treeSelectionState = (0, exports.getTreeSelectionStateForPredicateInputs)(predicate.Inputs);
+        }
         try {
             return predicateDef.handler({
                 adaptableApi: this.getAdaptableApi(),
                 inputs: predicate.Inputs,
+                treeSelectionState,
                 ...context,
             });
         }
@@ -150,8 +174,8 @@ class PredicateApiImpl extends ApiBase_1.ApiBase {
         }
         return predicates?.every((p) => this.handlePredicate(p, params, defaultReturn));
     }
-    useCaseSensitivity() {
-        return this.getPredicateOptions().caseSensitivePredicates;
+    useCaseSensitivity(columnId) {
+        return this.internalApi.shouldUseCaseSensitivePredicates(columnId);
     }
 }
 exports.PredicateApiImpl = PredicateApiImpl;

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

@@ -23,7 +23,7 @@ import { AdaptableFrameworkComponent } from '../../agGrid/AdaptableFrameworkComp
 import { IMetamodelService } from '../../Utilities/Services/Interface/IMetamodelService';
 import { IModuleCollection } from '../../Strategy/Interface/IModule';
 import { AdaptableObjectTag, AdaptableObjectWithScope } from '../../AdaptableState/Common/AdaptableObject';
-import { AdaptableForm, CellSummmaryInfo, FormContext, RowDataChangeTrigger, RowDataChangedInfo } from '../../../types';
+import { AdaptableForm, CellSummmaryInfo, FormContext, RowDataChangeTrigger, RowDataChangedInfo, AdaptableColumn, AdaptableColumnContext } from '../../../types';
 import { Fdc3Service } from '../../Utilities/Services/Fdc3Service';
 import { AnnotationsService } from '../../Utilities/Services/AnnotationsService';
 import { RowFormService } from '../../Utilities/Services/RowFormService';
@@ -122,6 +122,7 @@ export declare class AdaptableInternalApi extends ApiBase {
     setValueUsingField(rowData: Record<string, any>, fieldName: string, newValue: any): Record<string, any>;
     findAdaptableObjectsByLookupCriteria<T extends AdaptableObjectWithScope>({ scope, tag, ids }: AdaptableObjectLookupCriteria, specificAdaptableObjects: T[]): T[];
     buildBaseContext(): BaseContext;
+    buildAdaptableColumnContext(column: AdaptableColumn<any> | string): AdaptableColumnContext;
     setCellSummaryInfo(cellSummaryInfo: CellSummmaryInfo): void;
     parseDateValue(dateValue: string | Date | number): Date | undefined;
 }

package/src/Api/Internal/AdaptableInternalApi.js

@@ -441,6 +441,12 @@ class AdaptableInternalApi extends ApiBase_1.ApiBase {
             clientTimestamp: new Date(),
         };
     }
+    buildAdaptableColumnContext(column) {
+        return {
+            ...this.buildBaseContext(),
+            column: typeof column === 'string' ? this.getColumnApi().getColumnWithColumnId(column) : column,
+        };
+    }
     setCellSummaryInfo(cellSummaryInfo) {
         this.dispatchAction(InternalRedux.SetCellSummaryInfo(cellSummaryInfo));
     }

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

@@ -1,7 +1,7 @@
 import { ApiBase } from '../Implementation/ApiBase';
 import { AdaptablePredicate, AdaptablePredicateDef } from '../../AdaptableState/Common/AdaptablePredicate';
 import { SystemFilterPredicateId } from '../../AdaptableState/Common/ColumnFilter';
-import { AdaptableColumnDataType } from '../../AdaptableState/Common/AdaptableColumn';
+import { AdaptableColumn, AdaptableColumnDataType } from '../../AdaptableState/Common/AdaptableColumn';
 import { ColumnScope } from '../../types';
 export declare class PredicateInternalApi extends ApiBase {
     IsInOrNotInPredicate(predicate: AdaptablePredicate): boolean;
@@ -10,6 +10,8 @@ export declare class PredicateInternalApi extends ApiBase {
      * Get all Filter Predicate Definitions - System and Custom
      */
     getFilterPredicateDefs(scope: ColumnScope): AdaptablePredicateDef[];
+    shouldUseCaseSensitivePredicates(column: string | AdaptableColumn): boolean;
+    shouldEvaluateInPredicateUsingTime(column: string | AdaptableColumn): boolean;
     private getSystemFilterPredicateIds;
     /**
      * Get all Alert Predicate Definitions - System and Custom

package/src/Api/Internal/PredicateInternalApi.js

@@ -15,6 +15,20 @@ class PredicateInternalApi extends ApiBase_1.ApiBase {
     getFilterPredicateDefs(scope) {
         return this.mergeSystemAndCustomPredicates(this.getSystemFilterPredicateIds(scope)?.map((predicateId) => this.getPredicateApi().getPredicateDefById(predicateId)), this.getPredicateApi().getCustomPredicateDefs()).filter((predicateDef) => predicateDef.moduleScope.includes('columnFilter'));
     }
+    shouldUseCaseSensitivePredicates(column) {
+        const caseSensitivePredicates = this.getPredicateOptions().caseSensitivePredicates;
+        if (typeof caseSensitivePredicates === 'function') {
+            return caseSensitivePredicates(this.getAdaptableInternalApi().buildAdaptableColumnContext(column));
+        }
+        return caseSensitivePredicates;
+    }
+    shouldEvaluateInPredicateUsingTime(column) {
+        const evaluateInPredicateUsingTime = this.getPredicateOptions().evaluateInPredicateUsingTime;
+        if (typeof evaluateInPredicateUsingTime === 'function') {
+            return evaluateInPredicateUsingTime(this.getAdaptableInternalApi().buildAdaptableColumnContext(column));
+        }
+        return evaluateInPredicateUsingTime;
+    }
     getSystemFilterPredicateIds(scope) {
         const systemFilterPredicates = this.getPredicateOptions().systemFilterPredicates;
         if (typeof systemFilterPredicates === 'function') {

package/src/Api/PredicateApi.d.ts

@@ -95,5 +95,5 @@ export interface PredicateApi {
     /**
      * Whether Predicates are evaluated using Case Sensitivity
      */
-    useCaseSensitivity(): boolean;
+    useCaseSensitivity(columnId: string): boolean;
 }

package/src/Redux/Store/AdaptableStore.js

@@ -42,6 +42,7 @@ const InternalRedux = tslib_1.__importStar(require("../ActionsReducers/InternalR
 const TeamSharingRedux = tslib_1.__importStar(require("../ActionsReducers/TeamSharingRedux"));
 const ThemeRedux = tslib_1.__importStar(require("../ActionsReducers/ThemeRedux"));
 const ToolPanelRedux = tslib_1.__importStar(require("../ActionsReducers/ToolPanelRedux"));
+const devTools_1 = require("../../devTools");
 const TeamSharingState_1 = require("../../AdaptableState/TeamSharingState");
 const buildAdaptableStateFunctionConfig_1 = require("./buildAdaptableStateFunctionConfig");
 const INIT_STATE = 'INIT_STATE';
@@ -233,17 +234,21 @@ class AdaptableStore {
             }
             return finalState;
         };
+        const devToolsActionMarkerMiddleware = createDevToolsActionMarkerMiddleware(adaptable);
         const pluginsMiddleware = [];
         adaptable.forPlugins((plugin) => {
             if (plugin.reduxMiddleware) {
                 pluginsMiddleware.push(plugin.reduxMiddleware(adaptable));
             }
         });
+        const middlewares = [
+            devToolsActionMarkerMiddleware,
+            adaptableMiddleware(adaptable), // the main middleware that actually does stuff,
+            ...pluginsMiddleware, // the plugins middleware
+        ].filter(Boolean);
         //TODO: need to check if we want the storage to be done before or after
         //we enrich the state with the AB middleware
-        this.TheStore = Redux.createStore(persistedReducer, composeEnhancers(Redux.applyMiddleware(adaptableMiddleware(adaptable), // the main middleware that actually does stuff,
-        ...pluginsMiddleware // the plugins middleware
-        )));
+        this.TheStore = Redux.createStore(persistedReducer, composeEnhancers(Redux.applyMiddleware(...middlewares)));
         this.storageEngine = storageEngine;
     }
     destroy() {
@@ -265,6 +270,109 @@ class AdaptableStore {
     }
 }
 exports.AdaptableStore = AdaptableStore;
+function createDevToolsActionMarkerMiddleware(adaptable) {
+    const adaptableId = adaptable?.adaptableOptions?.adaptableId;
+    if (!adaptableId) {
+        return null;
+    }
+    if (!(0, devTools_1.areAdaptableProfileTracksEnabled)(adaptableId)) {
+        return null;
+    }
+    return (middlewareAPI) => (next) => (action) => {
+        if (!isTrackableReduxAction(action)) {
+            return next(action);
+        }
+        const previousState = middlewareAPI.getState();
+        const marker = (0, devTools_1.getMarker)(adaptableId).track.Redux.label.Action.start();
+        try {
+            return next(action);
+        }
+        finally {
+            const nextState = middlewareAPI.getState();
+            const changedKeys = detectChangedAdaptableStateKeys(previousState, nextState);
+            const details = buildDevToolsActionDetails(action, changedKeys);
+            marker.end({
+                label: action.type,
+                tooltip: changedKeys?.length ? `State changes: ${changedKeys.join(', ')}` : undefined,
+                details: details.length ? details : undefined,
+            });
+        }
+    };
+}
+const MAX_MARKER_DETAILS = 6;
+function buildDevToolsActionDetails(action, changedKeys) {
+    const details = [];
+    if (changedKeys && changedKeys.length > 0) {
+        const truncatedKeys = changedKeys.slice(0, MAX_MARKER_DETAILS);
+        const suffix = changedKeys.length > truncatedKeys.length
+            ? ` +${changedKeys.length - truncatedKeys.length} more`
+            : '';
+        details.push({
+            name: 'State changes',
+            value: `${truncatedKeys.join(', ')}${suffix}`,
+        });
+    }
+    if (isActionWithPayload(action)) {
+        const entries = Object.entries(action).filter(([key]) => key !== 'type');
+        for (const [key, value] of entries) {
+            if (details.length >= MAX_MARKER_DETAILS) {
+                break;
+            }
+            details.push({
+                name: `action.${key}`,
+                value: coerceMarkerDetailValue(value),
+            });
+        }
+    }
+    return details;
+}
+function detectChangedAdaptableStateKeys(previousState, nextState) {
+    if (!previousState || !nextState || previousState === nextState) {
+        return undefined;
+    }
+    const previous = previousState;
+    const next = nextState;
+    const keys = new Set([...Object.keys(previous), ...Object.keys(next)]);
+    const changed = [];
+    keys.forEach((key) => {
+        if (previous[key] !== next[key]) {
+            changed.push(key);
+        }
+    });
+    return changed.length > 0 ? changed : undefined;
+}
+function isTrackableReduxAction(action) {
+    return !!action && typeof action.type === 'string';
+}
+function isActionWithPayload(action) {
+    return !!action && typeof action === 'object';
+}
+function coerceMarkerDetailValue(value) {
+    if (value === null) {
+        return 'null';
+    }
+    if (value === undefined) {
+        return 'undefined';
+    }
+    const valueType = typeof value;
+    if (valueType === 'string' || valueType === 'number' || valueType === 'boolean') {
+        return value;
+    }
+    if (valueType === 'function') {
+        return '[function]';
+    }
+    try {
+        const json = JSON.stringify(value);
+        if (!json) {
+            return '[empty]';
+        }
+        const MAX_LENGTH = 200;
+        return json.length > MAX_LENGTH ? `${json.slice(0, MAX_LENGTH - 3)}...` : json;
+    }
+    catch (err) {
+        return '[unserializable]';
+    }
+}
 // this is the main function for dealing with Redux Actions which require additional functionality to be triggered.
 // Please document each use case where we have to use the Store rather than a module or a popup screen
 // This should ideally be the ONLY place where we LISTEN to store changes

package/src/Utilities/Helpers/Helper.js

@@ -99,11 +99,35 @@ async function copyToClipboard(text) {
         return true;
     }
     catch (ex) {
-        AdaptableLogger_1.AdaptableLogger.consoleErrorBase('Copy to clipboard failed.', ex);
-        return false;
+        return copyToClipboardForOldBrowsers(text);
     }
 }
 exports.copyToClipboard = copyToClipboard;
+function copyToClipboardForOldBrowsers(text) {
+    if (document.queryCommandSupported && document.queryCommandSupported('copy')) {
+        let textarea = document.createElement('textarea');
+        textarea.textContent = text;
+        textarea.style.width = '1px';
+        textarea.style.height = '1px';
+        textarea.style.top = '0px';
+        textarea.style.left = '0px';
+        textarea.style.position = 'absolute';
+        textarea.style.opacity = '0.0';
+        document.body.appendChild(textarea);
+        textarea.select();
+        textarea.focus();
+        try {
+            return document.execCommand('copy'); // Security exception may be thrown by some browsers.
+        }
+        catch (ex) {
+            AdaptableLogger_1.AdaptableLogger.consoleErrorBase('Copy to clipboard failed.', ex);
+            return false;
+        }
+        finally {
+            document.body.removeChild(textarea);
+        }
+    }
+}
 function returnItemCount(items, itemName) {
     if (items.length == 0) {
         return `No ${itemName}s`;

package/src/Utilities/Hooks/index.d.ts

@@ -0,0 +1,4 @@
+import { useAdaptableColumn } from './useAdaptableColumn';
+import { useAdaptableOptions } from './useAdaptableOptions';
+import { useAdaptableState } from './useAdaptableState';
+export { useAdaptableColumn, useAdaptableOptions, useAdaptableState };

package/src/Utilities/Hooks/index.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useAdaptableState = exports.useAdaptableOptions = exports.useAdaptableColumn = void 0;
+const useAdaptableColumn_1 = require("./useAdaptableColumn");
+Object.defineProperty(exports, "useAdaptableColumn", { enumerable: true, get: function () { return useAdaptableColumn_1.useAdaptableColumn; } });
+const useAdaptableOptions_1 = require("./useAdaptableOptions");
+Object.defineProperty(exports, "useAdaptableOptions", { enumerable: true, get: function () { return useAdaptableOptions_1.useAdaptableOptions; } });
+const useAdaptableState_1 = require("./useAdaptableState");
+Object.defineProperty(exports, "useAdaptableState", { enumerable: true, get: function () { return useAdaptableState_1.useAdaptableState; } });

package/src/Utilities/Hooks/useAdaptableColumn.d.ts

@@ -0,0 +1,2 @@
+import { AdaptableColumn } from '../../types';
+export declare function useAdaptableColumn(columnId: string): AdaptableColumn | undefined;