@adaptabletools/adaptable 18.0.0-canary.27 → 18.0.0-canary.29

package/src/Strategy/LayoutModule.js

@@ -15,16 +15,14 @@ import { SHOW_PIVOT_COLUMN_DETAILS } from '../View/Components/Popups/WindowPopup
 import flattenDeep from 'lodash/flattenDeep';
 import StringExtensions from '../Utilities/Extensions/StringExtensions';
 import { getGridFilterViewItems } from '../View/Layout/Wizard/getGridFilterPreview';
-import { AggregatedScalarLiveValue } from '../Utilities/Services/AggregatedScalarLiveValue';
-import { SystemRowSummarySet } from '../Redux/ActionsReducers/SystemRedux';
-import { ROW_SUMMARY_ROW_ID, WEIGHTED_AVERAGE_AGGREATED_FUNCTION, } from '../PredefinedConfig/Common/RowSummary';
-import Helper from '../Utilities/Helpers/Helper';
+import { RowSummaryService } from '../Utilities/Services/RowSummaryService';
 export class LayoutModule extends AdaptableModuleBase {
     constructor(api) {
         super(ModuleConstants.LayoutModuleId, ModuleConstants.LayoutFriendlyName, 'grid', 'LayoutPopup', 'Named sets of column visibility, order, groupings, aggregation, pivots etc.', api);
-        this.cachedCellSummary = new Map();
+        this.rowSummaryService = new RowSummaryService(this.api);
     }
     onAdaptableReady() {
+        this.rowSummaryService.onAdapterReady();
         this.api.eventApi.on('LayoutChanged', (layoutChangedInfo) => {
             var _a;
             if (layoutChangedInfo.newLayoutState.CurrentLayout !==
@@ -36,49 +34,6 @@ export class LayoutModule extends AdaptableModuleBase {
         requestAnimationFrame(() => {
             this.api.layoutApi.internalApi.fireLayoutChangedEvent('ADAPTABLE_READY', null, this.api.layoutApi.getLayoutState());
         });
-        this.rowSummariesSubscriptions();
-    }
-    rowSummariesSubscriptions() {
-        if (this.api.isDestroyed()) {
-            return;
-        }
-        // Currently not available for serverside model
-        if (!this.api.layoutApi.internalApi.getLayoutSupportedFeatures().RowSummaries) {
-            return;
-        }
-        // ROW SUMMARY
-        this.evaluateRowSummary();
-        this.api.eventApi.on('AdaptableStateReloaded', () => {
-            this.evaluateRowSummary();
-        });
-        this.api.eventApi.on('GridDataChanged', (event) => {
-            this.evaluateRowSummary();
-        });
-        this.api.eventApi.on('CellChanged', (event) => {
-            const columnId = event.cellChange.column.columnId;
-            this.evaluateRowSummary({
-                columnId,
-            });
-        });
-        this.api.eventApi.on('LayoutChanged', (event) => {
-            // exclude filter events, those are handled in another event
-            if (event.actionName.includes('FILTER')) {
-                return;
-            }
-            setTimeout(() => {
-                // the timeout is added so the grid has time to repond to the layout changed
-                this.evaluateRowSummary();
-            }, 16);
-        });
-        const adaptable = this.api.internalApi.getAdaptableInstance();
-        adaptable._on('AdapTableFiltersApplied', () => {
-            // we need to use this instead of layout changed
-            // so the rows have time to update
-            this.evaluateRowSummary();
-        });
-        adaptable._on('FirstDataRendered', () => {
-            this.evaluateRowSummary();
-        });
     }
     getModuleAdaptableObjects() {
         return this.api.layoutApi.getLayouts();
@@ -154,7 +109,7 @@ export class LayoutModule extends AdaptableModuleBase {
         let returnColumnMenuItems = [];
         const isReadOnlyLayout = this.api.layoutApi.isCurrentLayoutReadOnly();
         if (!isReadOnlyLayout) {
-            returnColumnMenuItems.push(this.createMenuItemShowPopup('layout-edit', 'Edit Layout', this.moduleInfo.Popup, this.moduleInfo.Glyph, {
+            returnColumnMenuItems.push(this.createMenuItemShowPopup('layout-edit', 'Edit Layout', this.moduleInfo.Popup, 'edit-table', {
                 action: 'Edit',
                 source: 'ColumnMenu',
                 value: this.api.layoutApi.getCurrentLayout(),
@@ -171,20 +126,20 @@ export class LayoutModule extends AdaptableModuleBase {
             }
             const hasExistingSelection = (_b = (_a = this.api.gridApi.getSelectedCellInfo()) === null || _a === void 0 ? void 0 : _a.gridCells) === null || _b === void 0 ? void 0 : _b.length;
             if (hasExistingSelection) {
-                returnColumnMenuItems.push(this.createMenuItemClickFunction('layout-column-select-preserve', 'Column (Preserve Selection)', 'column-add', () => {
+                returnColumnMenuItems.push(this.createMenuItemClickFunction('layout-column-select-preserve', 'Select Column (Preserve Selection)', 'select-fwd', () => {
                     this.api.columnApi.addColumnToSelection(column.columnId);
                 }));
-                returnColumnMenuItems.push(this.createMenuItemClickFunction('layout-column-select-reset', 'Column (Reset Selection)', 'columns', () => {
+                returnColumnMenuItems.push(this.createMenuItemClickFunction('layout-column-select-reset', 'Select Column (Reset Selection)', 'tab-unselected', () => {
                     this.api.columnApi.selectColumn(column.columnId);
                 }));
             }
             else {
-                returnColumnMenuItems.push(this.createMenuItemClickFunction('layout-column-select', 'Column', 'columns', () => {
+                returnColumnMenuItems.push(this.createMenuItemClickFunction('layout-column-select', 'Select Column', 'tab-unselected', () => {
                     this.api.columnApi.selectColumn(column.columnId);
                 }));
             }
         }
-        returnColumnMenuItems.push(this.createMenuItemClickFunction('layout-select-all', 'Whole Grid', this.moduleInfo.Glyph, () => {
+        returnColumnMenuItems.push(this.createMenuItemClickFunction('layout-grid-select', 'Select Grid', 'select-all', () => {
             this.api.gridApi.selectAll();
         }));
         return returnColumnMenuItems;
@@ -192,7 +147,7 @@ export class LayoutModule extends AdaptableModuleBase {
     createContextMenuItems(menuContext) {
         let returnColumnMenuItems = [];
         if (this.isModuleEditable() && !this.api.layoutApi.isCurrentLayoutReadOnly()) {
-            returnColumnMenuItems.push(this.createMenuItemShowPopup('layout-edit', 'Edit Layout', this.moduleInfo.Popup, this.moduleInfo.Glyph, {
+            returnColumnMenuItems.push(this.createMenuItemShowPopup('layout-edit', 'Edit Layout', this.moduleInfo.Popup, 'edit-table', {
                 action: 'Edit',
                 source: 'ColumnMenu',
             }));
@@ -201,11 +156,11 @@ export class LayoutModule extends AdaptableModuleBase {
             ArrayExtensions.IsNotNullOrEmpty(menuContext.selectedCellInfo.columns)) ||
             (menuContext.selectedRowInfo &&
                 ArrayExtensions.IsNotNullOrEmpty(menuContext.selectedRowInfo.gridRows))) {
-            returnColumnMenuItems.push(this.createMenuItemClickFunction('layout-clear-selection', 'Clear Selected Cells', 'undo', () => {
+            returnColumnMenuItems.push(this.createMenuItemClickFunction('layout-clear-selection', 'Clear Selected Cells', 'select-off', () => {
                 this.api.gridApi.deselectAll();
             }));
         }
-        returnColumnMenuItems.push(this.createMenuItemClickFunction('layout-select-all', 'Select', 'tab-unselected', () => {
+        returnColumnMenuItems.push(this.createMenuItemClickFunction('layout-select-all', 'Select Grid', 'select-all', () => {
             this.api.gridApi.selectAll();
         }));
         returnColumnMenuItems.push(this.createMenuItemClickFunction('layout-auto-size', 'Auto Size', 'arrow-expand', () => {
@@ -444,69 +399,4 @@ export class LayoutModule extends AdaptableModuleBase {
         }
         return this.api.namedQueryApi.internalApi.getReferencedNamedQueryNames(layout.GridFilter.Expression);
     }
-    /**
-     *
-     * @param colId optional to evaluate only one column
-     */
-    evaluateRowSummary(reason) {
-        var _a;
-        if (this.api.isDestroyed()) {
-            return;
-        }
-        const currentLayout = this.api.layoutApi.getCurrentLayout();
-        const rowSummaries = (_a = this.api.layoutApi.getCurrentLayout().RowSummaries) !== null && _a !== void 0 ? _a : [];
-        const rowSummariesResults = rowSummaries.map(({ ColumnsMap, Position }) => {
-            return {
-                Position,
-                RowData: Object.entries(ColumnsMap !== null && ColumnsMap !== void 0 ? ColumnsMap : {}).reduce((acc, [columnId, expression]) => {
-                    const key = `${columnId}-${expression}`;
-                    let expressionLiveValue = this.cachedCellSummary.get(key);
-                    if (expressionLiveValue) {
-                        if (!reason) {
-                            // refresh all of them
-                            expressionLiveValue.refresh();
-                        }
-                        else if ('columnId' in reason && reason.columnId === columnId) {
-                            expressionLiveValue.refresh();
-                        }
-                    }
-                    if (!expressionLiveValue) {
-                        try {
-                            let aggregatedScalarExpression = `${expression}([${columnId}])`;
-                            if (aggregatedScalarExpression.includes(WEIGHTED_AVERAGE_AGGREATED_FUNCTION) &&
-                                currentLayout.AggregationColumns[columnId] &&
-                                typeof currentLayout.AggregationColumns[columnId] === 'object') {
-                                const weight = currentLayout.AggregationColumns[columnId]
-                                    .weightedColumnId;
-                                if (weight) {
-                                    aggregatedScalarExpression = `AVG([${columnId}], WEIGHT([${weight}]))`;
-                                }
-                            }
-                            expressionLiveValue = new AggregatedScalarLiveValue({
-                                aggregatedScalarExpression,
-                            }, ModuleConstants.LayoutModuleId, this.api, () => {
-                                return this.api.gridApi.getVisibleRowNodes();
-                            });
-                        }
-                        catch (e) {
-                            this.api.logError('Error evaluating row summary', e);
-                        }
-                        this.cachedCellSummary.set(key, expressionLiveValue);
-                    }
-                    let value = null;
-                    if (expressionLiveValue) {
-                        value = expressionLiveValue.getGlobalAggregatedValue();
-                        if (typeof value === 'number' && !isNaN(value)) {
-                            value = Helper.roundNumber(value, 2);
-                        }
-                    }
-                    acc[columnId] = value;
-                    return acc;
-                }, {
-                    [ROW_SUMMARY_ROW_ID]: true,
-                }),
-            };
-        });
-        this.api.internalApi.dispatchReduxAction(SystemRowSummarySet(rowSummariesResults));
-    }
 }

package/src/Strategy/StyledColumnModule.js

@@ -80,7 +80,8 @@ export class StyledColumnModule extends AdaptableModuleBase {
                             },
                         };
                         const icon = this.getGlyphForStyledColumn(styledColumn);
-                        const label = `Edit ${this.getTypeLabel(styledColumn)} Style`;
+                        const typeLabel = this.getTypeLabel(styledColumn);
+                        const label = `Edit ${typeLabel}`;
                         const name = this.getTypeName(styledColumn);
                         returnColumnMenuItems.push(this.createMenuItemShowPopup(name, label, this.moduleInfo.Popup, icon, popupParam));
                     }
@@ -93,7 +94,7 @@ export class StyledColumnModule extends AdaptableModuleBase {
                         value: newStyledColumn,
                         config: {},
                     };
-                    const badgeLabel = column.dataType === 'Number' ? 'Badge' : 'Create Badge Style';
+                    const badgeLabel = 'Create Badge Style';
                     const newBadgeButton = this.createMenuItemShowPopup('styled-column-badge-add', badgeLabel, this.moduleInfo.Popup, 'badge', Object.assign(Object.assign({}, popupParam), { value: Object.assign(Object.assign({}, newStyledColumn), { BadgeStyle: {
                                 Badges: [ObjectFactory.CreateDefaultStyledColumnBadge()],
                             } }), config: {
@@ -106,12 +107,12 @@ export class StyledColumnModule extends AdaptableModuleBase {
                             const emptyRanges = this.api.scopeApi.createCellColorRangesForScope({
                                 ColumnIds: [column.columnId],
                             });
-                            const newGrandientButton = this.createMenuItemShowPopup('styled-column-gradient-add', 'Gradient', this.moduleInfo.Popup, 'gradient', Object.assign(Object.assign({}, popupParam), { value: Object.assign(Object.assign({}, newStyledColumn), { GradientStyle: {
+                            const newGrandientButton = this.createMenuItemShowPopup('styled-column-gradient-add', 'Create Gradient Column', this.moduleInfo.Popup, 'gradient', Object.assign(Object.assign({}, popupParam), { value: Object.assign(Object.assign({}, newStyledColumn), { GradientStyle: {
                                         CellRanges: emptyRanges,
                                     } }), config: {
                                     defaultCurrentSectionName: 'Style',
                                 } }));
-                            const newPrecentBarButton = this.createMenuItemShowPopup('styled-column-percent-bar-add', 'Percent Bar', this.moduleInfo.Popup, 'percent', Object.assign(Object.assign({}, popupParam), { value: Object.assign(Object.assign({}, newStyledColumn), { PercentBarStyle: {
+                            const newPercentBarButton = this.createMenuItemShowPopup('styled-column-percent-bar-add', 'Create Percent Bar', this.moduleInfo.Popup, 'percent', Object.assign(Object.assign({}, popupParam), { value: Object.assign(Object.assign({}, newStyledColumn), { PercentBarStyle: {
                                         CellRanges: emptyRanges,
                                     } }), config: {
                                     defaultCurrentSectionName: 'Style',
@@ -122,9 +123,9 @@ export class StyledColumnModule extends AdaptableModuleBase {
                             //   module: this.moduleInfo.ModuleName,
                             //   isVisible: true,
                             //   icon: { name: this.moduleInfo.Glyph },
-                            //   subItems: [newGrandientButton, newPrecentBarButton, newBadgeButton],
+                            //   subItems: [newGrandientButton, newPercentBarButton, newBadgeButton],
                             // });
-                            returnColumnMenuItems.push(...[newGrandientButton, newPrecentBarButton, newBadgeButton]);
+                            returnColumnMenuItems.push(...[newGrandientButton, newPercentBarButton, newBadgeButton]);
                             break;
                         case 'String':
                             returnColumnMenuItems.push(newBadgeButton);
@@ -170,10 +171,13 @@ export class StyledColumnModule extends AdaptableModuleBase {
                 },
             });
         }
-        if (!styledColumn.BadgeStyle) {
+        if (styledColumn.BadgeStyle) {
             specificTypeItems.push({
                 name: 'Settings',
-                values: [`Include grouped rows: ${styledColumn.IncludeGroupedRows ? 'Yes' : 'No'}`],
+                values: [
+                    `Include grouped rows: ${styledColumn.IncludeGroupedRows ? 'Yes' : 'No'}`,
+                    `Include row summaries: ${styledColumn.IncludeRowSummaries ? 'Yes' : 'No'}`,
+                ],
             });
         }
         if (styledColumn.BadgeStyle) {
@@ -223,7 +227,7 @@ export class StyledColumnModule extends AdaptableModuleBase {
     getTypeLabel(styledColumn) {
         let type = null;
         if (styledColumn.GradientStyle) {
-            type = 'Gradient';
+            type = 'Gradient Column';
         }
         else if (styledColumn.PercentBarStyle) {
             type = 'Percent Bar';
@@ -232,7 +236,7 @@ export class StyledColumnModule extends AdaptableModuleBase {
             type = 'Spark Line';
         }
         else if (styledColumn.BadgeStyle) {
-            type = 'Badge';
+            type = 'Badge Style';
         }
         return type;
     }

package/src/Strategy/Utilities/FormatColumn/getFormatColumnSettingsViewItems.js

@@ -3,6 +3,7 @@ export const getFormatColumnSettingsViewItems = (formatColumn) => {
     const values = [
         `Cell alignment: ${(_a = formatColumn.CellAlignment) !== null && _a !== void 0 ? _a : 'default'}`,
         `Include grouped rows: ${formatColumn.IncludeGroupedRows ? 'Yes' : 'No'}`,
+        `Include row summaries: ${formatColumn.IncludeRowSummaries ? 'Yes' : 'No'}`,
     ].filter(Boolean);
     return {
         name: 'Settings',

package/src/Utilities/ExpressionFunctions/aggregatedScalarExpressionFunctions.js

@@ -1100,13 +1100,15 @@ const mapAggregationToCumulation = (aggregationParameter, overColumnParameter, c
                                 if ((_a = aggregationEvaluation.context) === null || _a === void 0 ? void 0 : _a.weightParam) {
                                     // weighted average
                                     const weightValue = (_b = context.adaptableApi.gridApi.getRawValueFromRowNode(rowNode, aggregationEvaluation.context.weightParam.value)) !== null && _b !== void 0 ? _b : 0;
-                                    cumulationBag.currentValue = cumulationBag.currentValue + rowValue * weightValue;
+                                    cumulationBag.currentValue =
+                                        cumulationBag.currentValue + rowValue * weightValue;
                                     cumulationBag.numberOfCumulatedValues =
                                         cumulationBag.numberOfCumulatedValues + weightValue;
                                 }
                                 else {
                                     cumulationBag.currentValue = cumulationBag.currentValue + rowValue;
-                                    cumulationBag.numberOfCumulatedValues = cumulationBag.numberOfCumulatedValues + 1;
+                                    cumulationBag.numberOfCumulatedValues =
+                                        cumulationBag.numberOfCumulatedValues + 1;
                                 }
                             }
                             if (cumulationBag.numberOfCumulatedValues !== 0) {

package/src/Utilities/Interface/MessagePopups.d.ts

@@ -32,9 +32,6 @@ export interface ScreenPopup {
         [key: string]: any;
     };
 }
-export interface LoadingPopup {
-    ShowLoadingPopup: boolean;
-}
 export interface ConfirmationPopup {
     ShowConfirmationPopup: boolean;
     Header: string;

package/src/Utilities/Services/RowSummaryService.d.ts

@@ -0,0 +1,22 @@
+import { AdaptableApi, Layout } from '../../types';
+import { AggregatedScalarLiveValue } from './AggregatedScalarLiveValue';
+/**
+ * The logic is extracted here to make it easier to follow
+ */
+export declare class RowSummaryService {
+    private api;
+    cachedCellSummary: Map<string, AggregatedScalarLiveValue>;
+    previousRowSummaries: any;
+    previousLayout: Layout | null;
+    debouncedEvaluateRowSummary: import("lodash").DebouncedFunc<(reason?: {
+        columnId: string;
+    }) => void>;
+    constructor(api: AdaptableApi);
+    onAdapterReady(): void;
+    rowSummariesSubscriptions(): void;
+    /**
+     *
+     * @param colId optional to evaluate only one column
+     */
+    private evaluateRowSummary;
+}

package/src/Utilities/Services/RowSummaryService.js

@@ -0,0 +1,141 @@
+import { isEqual } from 'lodash';
+import { ROW_SUMMARY_ROW_ID, WEIGHTED_AVERAGE_AGGREATED_FUNCTION, } from '../../PredefinedConfig/Common/RowSummary';
+import { SystemRowSummarySet } from '../../Redux/ActionsReducers/SystemRedux';
+import * as ModuleConstants from '../../Utilities/Constants/ModuleConstants';
+import Helper from '../Helpers/Helper';
+import { AggregatedScalarLiveValue } from './AggregatedScalarLiveValue';
+import { isObjectEmpty } from '../Extensions/ObjectExtensions';
+import debounce from 'lodash/debounce';
+/**
+ * The logic is extracted here to make it easier to follow
+ */
+export class RowSummaryService {
+    constructor(api) {
+        this.api = api;
+        this.cachedCellSummary = new Map();
+        this.debouncedEvaluateRowSummary = debounce(this.evaluateRowSummary, 300);
+    }
+    onAdapterReady() {
+        this.rowSummariesSubscriptions();
+    }
+    rowSummariesSubscriptions() {
+        // return;
+        if (this.api.isDestroyed()) {
+            return;
+        }
+        // Currently not available for serverside model
+        if (!this.api.layoutApi.internalApi.getLayoutSupportedFeatures().RowSummaries) {
+            return;
+        }
+        this.debouncedEvaluateRowSummary();
+        this.api.eventApi.on('AdaptableStateReloaded', () => {
+            this.debouncedEvaluateRowSummary();
+        });
+        this.api.eventApi.on('GridDataChanged', (event) => {
+            this.debouncedEvaluateRowSummary();
+        });
+        this.api.eventApi.on('CellChanged', (event) => {
+            const columnId = event.cellChange.column.columnId;
+            this.debouncedEvaluateRowSummary({
+                columnId,
+            });
+        });
+        this.api.eventApi.on('LayoutChanged', (event) => {
+            // exclude filter events, those are handled in another event
+            if (event.actionName.includes('FILTER')) {
+                return;
+            }
+            setTimeout(() => {
+                // the timeout is added so the grid has time to repond to the layout changed
+                this.debouncedEvaluateRowSummary();
+            }, 16);
+        });
+        const adaptable = this.api.internalApi.getAdaptableInstance();
+        adaptable._on('AdapTableFiltersApplied', () => {
+            // we need to use this instead of layout changed
+            // so the rows have time to update
+            this.debouncedEvaluateRowSummary();
+        });
+        adaptable._on('FirstDataRendered', () => {
+            this.debouncedEvaluateRowSummary();
+        });
+    }
+    /**
+     *
+     * @param colId optional to evaluate only one column
+     */
+    evaluateRowSummary(reason) {
+        var _a;
+        if (this.api.isDestroyed()) {
+            return;
+        }
+        const currentLayout = this.api.layoutApi.getCurrentLayout();
+        let previousLayout = this.previousLayout;
+        // it is added here to be sure it is saved
+        this.previousLayout = currentLayout;
+        /**
+         * If the previous & current layout does not have row summaries, it is safe to exit
+         */
+        if (isObjectEmpty(currentLayout === null || currentLayout === void 0 ? void 0 : currentLayout.RowSummaries) && isObjectEmpty(previousLayout === null || previousLayout === void 0 ? void 0 : previousLayout.RowSummaries)) {
+            return;
+        }
+        const rowSummaries = (_a = this.api.layoutApi.getCurrentLayout().RowSummaries) !== null && _a !== void 0 ? _a : [];
+        const rowSummariesResults = rowSummaries.map(({ ColumnsMap, Position }) => {
+            return {
+                Position,
+                RowData: Object.entries(ColumnsMap !== null && ColumnsMap !== void 0 ? ColumnsMap : {}).reduce((acc, [columnId, expression]) => {
+                    const key = `${columnId}-${expression}`;
+                    let expressionLiveValue = this.cachedCellSummary.get(key);
+                    if (expressionLiveValue) {
+                        if (!reason) {
+                            // refresh all of them
+                            expressionLiveValue.refresh();
+                        }
+                        else if ('columnId' in reason && reason.columnId === columnId) {
+                            expressionLiveValue.refresh();
+                        }
+                    }
+                    if (!expressionLiveValue) {
+                        try {
+                            let aggregatedScalarExpression = `${expression}([${columnId}])`;
+                            if (aggregatedScalarExpression.includes(WEIGHTED_AVERAGE_AGGREATED_FUNCTION) &&
+                                currentLayout.AggregationColumns[columnId] &&
+                                typeof currentLayout.AggregationColumns[columnId] === 'object') {
+                                const weight = currentLayout.AggregationColumns[columnId]
+                                    .weightedColumnId;
+                                if (weight) {
+                                    aggregatedScalarExpression = `AVG([${columnId}], WEIGHT([${weight}]))`;
+                                }
+                            }
+                            expressionLiveValue = new AggregatedScalarLiveValue({
+                                aggregatedScalarExpression,
+                            }, ModuleConstants.LayoutModuleId, this.api, () => {
+                                return this.api.gridApi.getVisibleRowNodes();
+                            });
+                        }
+                        catch (e) {
+                            this.api.logError('Error evaluating row summary', e);
+                        }
+                        this.cachedCellSummary.set(key, expressionLiveValue);
+                    }
+                    let value = null;
+                    if (expressionLiveValue) {
+                        value = expressionLiveValue.getGlobalAggregatedValue();
+                        if (typeof value === 'number' && !isNaN(value)) {
+                            value = Helper.roundNumber(value, 2);
+                        }
+                    }
+                    acc[columnId] = value;
+                    return acc;
+                }, {
+                    [ROW_SUMMARY_ROW_ID]: true,
+                }),
+            };
+        });
+        if (this.previousRowSummaries && isEqual(rowSummariesResults, this.previousRowSummaries)) {
+            return;
+        }
+        this.api.internalApi.dispatchReduxAction(SystemRowSummarySet(rowSummariesResults));
+        this.previousRowSummaries = rowSummariesResults;
+    }
+}

package/src/View/CalculatedColumn/Wizard/CalculatedColumnWizard.d.ts

@@ -2,7 +2,7 @@
 import { CalculatedColumn } from '../../../types';
 import { AdaptableOnePageWizardProps } from '../../Wizard/Interface/IAdaptableWizard';
 export declare const calculatedColumnTypes: readonly ["ScalarExpression", "AggregatedScalarExpression", "CumulativeAggregatedExpression", "QuantileAggregatedExpression"];
-export type ExpressionType = typeof calculatedColumnTypes[number];
+export type ExpressionType = (typeof calculatedColumnTypes)[number];
 export interface CalculatedColumnWizardProps extends AdaptableOnePageWizardProps<CalculatedColumn> {
 }
 export declare const CalculatedColumnWizard: (props: CalculatedColumnWizardProps) => JSX.Element;

package/src/View/FormatColumn/Wizard/FormatColumnSettingsWizardSection.js

@@ -15,7 +15,10 @@ export const renderFormatColumnSettingsSummary = (data) => {
             React.createElement(Tag, null, (_a = data.CellAlignment) !== null && _a !== void 0 ? _a : 'default')),
         React.createElement(Text, { mt: 3 },
             "Include grouped rows ",
-            React.createElement(Tag, null, data.IncludeGroupedRows ? 'yes' : 'no'))));
+            React.createElement(Tag, null, data.IncludeGroupedRows ? 'yes' : 'no')),
+        React.createElement(Text, { mt: 3 },
+            "Include row summaries ",
+            React.createElement(Tag, null, data.IncludeRowSummaries ? 'yes' : 'no'))));
 };
 export const FormatColumnSettingsWizardSection = (props) => {
     const { data } = useOnePageAdaptableWizardContext();
@@ -29,6 +32,9 @@ export const FormatColumnSettingsWizardSection = (props) => {
     const onIncludeGroupedRowsChanged = (IncludeGroupedRows) => {
         props.onChange(Object.assign(Object.assign({}, data), { IncludeGroupedRows }));
     };
+    const onIncludeRowSummariesChanged = (IncludeRowSummaries) => {
+        props.onChange(Object.assign(Object.assign({}, data), { IncludeRowSummaries }));
+    };
     return (React.createElement(Tabs, null,
         React.createElement(Tabs.Tab, null, "Settings"),
         React.createElement(Tabs.Content, null,
@@ -47,5 +53,8 @@ export const FormatColumnSettingsWizardSection = (props) => {
                                     : onCellAlignmentSelectChanged(null) }))),
                     React.createElement(FormRow, { label: "Include Grouped Rows:" },
                         React.createElement(Flex, { alignItems: "center", marginLeft: 2 },
-                            React.createElement(CheckBox, { "data-name": "include-grouped-rows-checkbox", checked: data.IncludeGroupedRows, onChange: onIncludeGroupedRowsChanged, mr: 2 }))))))));
+                            React.createElement(CheckBox, { "data-name": "include-grouped-rows-checkbox", checked: data.IncludeGroupedRows, onChange: onIncludeGroupedRowsChanged, mr: 2 }))),
+                    React.createElement(FormRow, { label: "Include Row Summaries:" },
+                        React.createElement(Flex, { alignItems: "center", marginLeft: 2 },
+                            React.createElement(CheckBox, { "data-name": "include-grouped-rows-checkbox", checked: data.IncludeRowSummaries, onChange: onIncludeRowSummariesChanged, mr: 2 }))))))));
 };

package/src/View/StyledColumn/Wizard/StyledColumnWizard.js

@@ -77,7 +77,7 @@ export const StyledColumnWizard = (props) => {
                     React.createElement(StyledColumnWizardStyleSection, { onChange: setStyledColumn })));
             },
             title: 'Style',
-        }, AdditionalSettingSection);
+        });
     }
     else if (styledColumn.BadgeStyle) {
         specificSteps.push({

package/src/View/StyledColumn/Wizard/StyledColumnWizardSettingsSection.js

@@ -1,26 +1,27 @@
 import * as React from 'react';
 import { Box, Flex, Text } from 'rebass';
-import FormLayout, { FormRow } from '../../../components/FormLayout';
 import { CheckBox } from '../../../components/CheckBox';
+import FormLayout, { FormRow } from '../../../components/FormLayout';
 import { Tabs } from '../../../components/Tabs';
-import { useOnePageAdaptableWizardContext } from '../../Wizard/OnePageAdaptableWizard';
 import { Tag } from '../../../components/Tag';
-let alignmentOptions = [
-    { value: 'Left', label: 'Left' },
-    { value: 'Right', label: 'Right' },
-    { value: 'Center', label: 'Center' },
-];
+import { useOnePageAdaptableWizardContext } from '../../Wizard/OnePageAdaptableWizard';
 export const renderStyledColumnWizardSettingsSummary = (data) => {
     return (React.createElement(Box, { padding: 2 },
         React.createElement(Text, { mt: 3 },
             "Include grouped rows ",
-            React.createElement(Tag, null, data.IncludeGroupedRows ? 'yes' : 'no'))));
+            React.createElement(Tag, null, data.IncludeGroupedRows ? 'yes' : 'no')),
+        React.createElement(Text, { mt: 3 },
+            "Include row summaries ",
+            React.createElement(Tag, null, data.IncludeRowSummaries ? 'yes' : 'no'))));
 };
 export const StyledColumnWizardSettingsSection = (props) => {
-    const { data, api } = useOnePageAdaptableWizardContext();
+    const { data } = useOnePageAdaptableWizardContext();
     const onIncludeGroupedRowsChanged = (IncludeGroupedRows) => {
         props.onChange(Object.assign(Object.assign({}, data), { IncludeGroupedRows }));
     };
+    const onIncludeRowSummariesChanged = (IncludeRowSummaries) => {
+        props.onChange(Object.assign(Object.assign({}, data), { IncludeRowSummaries }));
+    };
     return (React.createElement(Tabs, null,
         React.createElement(Tabs.Tab, null, "Settings"),
         React.createElement(Tabs.Content, null,
@@ -28,5 +29,8 @@ export const StyledColumnWizardSettingsSection = (props) => {
                 React.createElement(FormLayout, null,
                     React.createElement(FormRow, { label: "Include Grouped Rows:" },
                         React.createElement(Flex, { alignItems: "center", marginLeft: 2 },
-                            React.createElement(CheckBox, { "data-name": "include-grouped-rows-checkbox", checked: data.IncludeGroupedRows, onChange: onIncludeGroupedRowsChanged, mr: 2 }))))))));
+                            React.createElement(CheckBox, { "data-name": "include-grouped-rows-checkbox", checked: data.IncludeGroupedRows, onChange: onIncludeGroupedRowsChanged, mr: 2 }))),
+                    React.createElement(FormRow, { label: "Include Row Summaries:" },
+                        React.createElement(Flex, { alignItems: "center", marginLeft: 2 },
+                            React.createElement(CheckBox, { "data-name": "include-grouped-rows-checkbox", checked: data.IncludeRowSummaries, onChange: onIncludeRowSummariesChanged, mr: 2 }))))))));
 };

package/src/agGrid/AdaptableAgGrid.js

@@ -1690,7 +1690,8 @@ export class AdaptableAgGrid {
                 return acc;
             }
             const ColumnGroupId = columnGroup.getGroupId();
-            const AllowGroupSplit = !columnGroup.getProvidedColumnGroup().getColGroupDef().marryChildren;
+            const AllowGroupSplit = !columnGroup.getProvidedColumnGroup().getColGroupDef()
+                .marryChildren;
             const FriendlyName = (_c = columnGroup.getProvidedColumnGroup().getColGroupDef().headerName) !== null && _c !== void 0 ? _c : ColumnGroupId;
             const columnsInGroup = columnGroup.getLeafColumns();
             columnsInGroup.forEach((col) => {

package/src/agGrid/AgGridColumnAdapter.js

@@ -5,7 +5,6 @@ import { FloatingFilterWrapperFactory } from './FloatingFilterWrapper';
 import { convertAdaptableStyleToCSS, getVariableColor, normalizeStyleForAgGrid, } from '../Utilities/Helpers/StyleHelper';
 import StringExtensions from '../Utilities/Extensions/StringExtensions';
 import { createBaseContext } from '../Utilities/ObjectFactory';
-import clamp from 'lodash/clamp';
 import tinycolor from 'tinycolor2';
 import UIHelper from '../View/UIHelper';
 import { getPercentBarRendererForColumn } from './PercentBarRenderer';
@@ -665,6 +664,7 @@ export class AgGridColumnAdapter {
         return Object.assign(Object.assign({}, this.getFormatColumnCellStyle(gridCell.column, activeFormatColumnsWithStyle, params)), styledColumnStyle);
     }
     getStyledColumnStyle(styledColumn, abColumn, params) {
+        var _a, _b;
         let style = {};
         const gradientStyle = styledColumn === null || styledColumn === void 0 ? void 0 : styledColumn.GradientStyle;
         if (params.value === undefined) {
@@ -672,18 +672,24 @@ export class AgGridColumnAdapter {
         }
         let colValue = params.value;
         if (this.adaptableApi.gridApi.isGroupRowNode(params.node)) {
-            if (styledColumn.IncludeGroupedRows) {
-                const minColumnValue = this.adaptableApi.styledColumnApi.internalApi.getMinValueForNumericColumn(abColumn);
-                const maxColumnValue = this.adaptableApi.styledColumnApi.internalApi.getMaxValueForNumericColumn(abColumn);
-                /**
-                 * Color should always be in bounds, it should not overflow.
-                 * If the value is out of range, it shoul set the maximum/minimum color.
-                 */
-                colValue = clamp(params.value, minColumnValue, maxColumnValue);
-            }
-            else {
-                return style;
-            }
+            // We no longer support Grouped Rows
+            return style;
+            // if (styledColumn.IncludeGroupedRows) {
+            //   const minColumnValue =
+            //     this.adaptableApi.styledColumnApi.internalApi.getMinValueForNumericColumn(abColumn);
+            //   const maxColumnValue =
+            //     this.adaptableApi.styledColumnApi.internalApi.getMaxValueForNumericColumn(abColumn);
+            //   /**
+            //    * Color should always be in bounds, it should not overflow.
+            //    * If the value is out of range, it shoul set the maximum/minimum color.
+            //    */
+            //   colValue = clamp(params.value, minColumnValue, maxColumnValue);
+            // } else {
+            //   return style;
+            // }
+        }
+        if (((_b = (_a = params === null || params === void 0 ? void 0 : params.node) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b[ROW_SUMMARY_ROW_ID]) && !styledColumn.IncludeRowSummaries) {
+            return style;
         }
         if (gradientStyle) {
             const min = this.adaptableApi.styledColumnApi.internalApi.getNumericStyleMinValue(styledColumn, abColumn, params.node, colValue);