@adaptabletools/adaptable-cjs 18.0.0-canary.8 → 18.0.0

package/src/View/Layout/Wizard/sections/RowGroupingSection.js

@@ -16,7 +16,23 @@ const RowGroupingSectionSummary = () => {
     var _a;
     const adaptable = (0, AdaptableContext_1.useAdaptable)();
     const { data: layout } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
-    return (React.createElement(rebass_1.Box, null, ((_a = layout.RowGroupedColumns) === null || _a === void 0 ? void 0 : _a.length) ? (layout.RowGroupedColumns.map((columnId) => (React.createElement(Tag_1.Tag, { mr: 1, key: columnId }, adaptable.api.columnApi.getFriendlyNameForColumnId(columnId))))) : (React.createElement(Tag_1.Tag, null, "No Row Grouping"))));
+    return (React.createElement(rebass_1.Box, null, ((_a = layout.RowSummaries) === null || _a === void 0 ? void 0 : _a.length) ? (layout === null || layout === void 0 ? void 0 : layout.RowSummaries.map((rowSummary, index) => {
+        var _a;
+        const columns = Object.entries((_a = rowSummary.ColumnsMap) !== null && _a !== void 0 ? _a : {})
+            .map(([columnId, expression]) => {
+            if (columnId === 'Source' || columnId === 'Uuid') {
+                return '';
+            }
+            return `${expression}(${adaptable.api.columnApi.getFriendlyNameForColumnId(columnId)})`;
+        })
+            .filter(Boolean)
+            .join(', ');
+        return (React.createElement(rebass_1.Box, { mb: 2 },
+            React.createElement(Tag_1.Tag, { key: index },
+                rowSummary.Position,
+                " ",
+                columns)));
+    })) : (React.createElement(Tag_1.Tag, null, "No Row Summaries"))));
 };
 exports.RowGroupingSectionSummary = RowGroupingSectionSummary;
 const RowGroupingSection = (props) => {
@@ -32,7 +48,7 @@ const RowGroupingSection = (props) => {
         props.onChange(Object.assign(Object.assign({}, layout), { RowGroupedColumns: columnIds }));
     };
     return (React.createElement(Tabs_1.Tabs, { style: { height: '100%' } },
-        React.createElement(Tabs_1.Tabs.Tab, null, "Grouped Rows"),
+        React.createElement(Tabs_1.Tabs.Tab, null, "Group Rows"),
         ((_a = layout.ExpandedRowGroupValues) === null || _a === void 0 ? void 0 : _a.length) && React.createElement(Tabs_1.Tabs.Tab, null, "Expanded Rows"),
         React.createElement(Tabs_1.Tabs.Content, null,
             React.createElement(ValueSelector_1.ValueSelector, { showFilterInput: true, showSelectedOnlyPosition: "top", filter: Utilities_1.columnFilter, toIdentifier: (option) => `${option.columnId}`, toLabel: (option) => { var _a; return (_a = option.friendlyName) !== null && _a !== void 0 ? _a : option.columnId; }, options: sortedGroupableColumns, value: (_b = layout.RowGroupedColumns) !== null && _b !== void 0 ? _b : [], allowReorder: true, xSelectedLabel: () => {

package/src/View/Layout/Wizard/sections/RowSummarySection.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+import { Layout } from '../../../../../types';
+export declare const areSummaryRowsValid: (layout: Layout) => true | string;
+export declare const RowGroupingSectionSummary: React.FunctionComponent;
+interface RowSummarySectionProps {
+    onChange: (data: Layout) => void;
+}
+export declare const RowSummarySection: React.FunctionComponent<RowSummarySectionProps>;
+export {};

package/src/View/Layout/Wizard/sections/RowSummarySection.js

@@ -0,0 +1,181 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RowSummarySection = exports.RowGroupingSectionSummary = exports.areSummaryRowsValid = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const rebass_1 = require("rebass");
+const FormLayout_1 = tslib_1.__importStar(require("../../../../components/FormLayout"));
+const Panel_1 = tslib_1.__importDefault(require("../../../../components/Panel"));
+const Select_1 = require("../../../../components/Select");
+const SimpleButton_1 = tslib_1.__importDefault(require("../../../../components/SimpleButton"));
+const Tabs_1 = require("../../../../components/Tabs");
+const Tag_1 = require("../../../../components/Tag");
+const RowSummary_1 = require("../../../../PredefinedConfig/Common/RowSummary");
+const adaptableQlUtils_1 = require("../../../../Utilities/adaptableQlUtils");
+const ModuleConstants_1 = require("../../../../Utilities/Constants/ModuleConstants");
+const sortWithOrder_1 = require("../../../../Utilities/sortWithOrder");
+const AdaptableContext_1 = require("../../../AdaptableContext");
+const ValueSelector_1 = require("../../../Components/ValueSelector");
+const OnePageAdaptableWizard_1 = require("../../../Wizard/OnePageAdaptableWizard");
+const Utilities_1 = require("./Utilities");
+const areSummaryRowsValid = (layout) => {
+    var _a;
+    if (!layout.RowSummaries)
+        return true;
+    let valid = true;
+    (_a = layout.RowSummaries) === null || _a === void 0 ? void 0 : _a.find((rowSummary) => {
+        var _a;
+        for (const [_, fn] of Object.entries((_a = rowSummary.ColumnsMap) !== null && _a !== void 0 ? _a : {})) {
+            if (!fn) {
+                valid = 'All row summary columns must have an aggregation function.';
+                return true;
+            }
+        }
+    });
+    return valid;
+};
+exports.areSummaryRowsValid = areSummaryRowsValid;
+const getAvailableExpressionsForColumnType = (columnType, availableScalarExpressions) => {
+    const inputType = (0, adaptableQlUtils_1.mapColumnDataTypeToExpressionFunctionType)(columnType);
+    // Object.entries(availableScalarExpressions ?? {})
+    return RowSummary_1.summarySupportedExpressions
+        .filter((expression) => availableScalarExpressions[expression])
+        .map((expression) => {
+        var _a, _b;
+        const expressionDef = availableScalarExpressions[expression];
+        let firstArg = null;
+        if (Array.isArray((_a = expressionDef === null || expressionDef === void 0 ? void 0 : expressionDef.inputs) === null || _a === void 0 ? void 0 : _a[0])) {
+            // @ts-ignore
+            firstArg = (_b = expressionDef.inputs.find((input) => input.includes(inputType))) === null || _b === void 0 ? void 0 : _b[0];
+        }
+        else {
+            firstArg = expressionDef.inputs[0];
+        }
+        if (inputType === firstArg) {
+            return expression;
+        }
+        else {
+            return null;
+        }
+    })
+        .filter(Boolean);
+};
+const RowGroupingSectionSummary = () => {
+    var _a;
+    const adaptable = (0, AdaptableContext_1.useAdaptable)();
+    const { data: layout } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
+    return (React.createElement(rebass_1.Box, null, ((_a = layout.RowGroupedColumns) === null || _a === void 0 ? void 0 : _a.length) ? (layout.RowGroupedColumns.map((columnId) => (React.createElement(Tag_1.Tag, { mr: 1, key: columnId }, adaptable.api.columnApi.getFriendlyNameForColumnId(columnId))))) : (React.createElement(Tag_1.Tag, null, "No Row Grouping"))));
+};
+exports.RowGroupingSectionSummary = RowGroupingSectionSummary;
+const RowSummaryEditor = ({ rowSummary, onChange, availableScalarExpressions, onDelete, }) => {
+    const { data: layout } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
+    const adaptable = (0, AdaptableContext_1.useAdaptable)();
+    const columns = React.useMemo(() => {
+        const colIds = adaptable.api.columnApi
+            .getColumns()
+            .filter((column) => {
+            var _a, _b;
+            if (!['Number', 'String', 'Date'].includes(column.dataType))
+                return false;
+            return (_b = (_a = layout.Columns) === null || _a === void 0 ? void 0 : _a.includes) === null || _b === void 0 ? void 0 : _b.call(_a, column.columnId);
+        })
+            .map((c) => c.columnId);
+        return (0, sortWithOrder_1.sortWithOrderArray)(colIds, Object.keys(rowSummary.ColumnsMap), {
+            sortUnorderedItems: false,
+        }).map((colId) => adaptable.api.columnApi.getColumnWithColumnId(colId));
+    }, [rowSummary.ColumnsMap]);
+    return (React.createElement(Panel_1.default, { header: React.createElement(rebass_1.Flex, { style: { width: '100%' } },
+            React.createElement(rebass_1.Flex, { flex: 1, alignItems: "center" }, "Row Summary"),
+            React.createElement(SimpleButton_1.default, { icon: "delete", onClick: () => {
+                    onDelete();
+                } })), p: 2 },
+        React.createElement(FormLayout_1.default, null,
+            React.createElement(FormLayout_1.FormRow, { label: "Position" },
+                React.createElement(Select_1.Select, { options: [
+                        {
+                            label: 'Top',
+                            value: 'Top',
+                        },
+                        {
+                            label: 'Bottom',
+                            value: 'Bottom',
+                        },
+                    ], value: rowSummary.Position, onChange: (position) => {
+                        onChange(Object.assign(Object.assign({}, rowSummary), { Position: position }));
+                    } }))),
+        React.createElement(rebass_1.Flex, { flexDirection: 'column', mt: 2, mb: 1 },
+            React.createElement(rebass_1.Flex, { alignItems: "center", flex: 1, mb: 2 }, "Column Aggregations"),
+            React.createElement(Panel_1.default, { bodyProps: { maxHeight: '100%' }, style: { height: 360 } },
+                React.createElement(ValueSelector_1.ValueSelector, { style: { maxHeight: '100%' }, showFilterInput: true, filter: Utilities_1.columnFilter, toIdentifier: (column) => column.columnId, toLabel: (option) => { var _a; return (_a = option.friendlyName) !== null && _a !== void 0 ? _a : option.columnId; }, options: columns, xSelectedLabel: () => {
+                        return 'Active Aggregations:';
+                    }, toListLabel: (column) => {
+                        var _a, _b, _c;
+                        const label = (_a = column.friendlyName) !== null && _a !== void 0 ? _a : column.columnId;
+                        if (!(column.columnId in ((_b = rowSummary.ColumnsMap) !== null && _b !== void 0 ? _b : {}))) {
+                            return label;
+                        }
+                        const expressionOptions = getAvailableExpressionsForColumnType(column.dataType, availableScalarExpressions).map((expression) => ({
+                            label: expression,
+                            value: expression,
+                        }));
+                        // check out if this layout has a aggregation with wighted column
+                        const aggregation = (_c = layout.AggregationColumns) === null || _c === void 0 ? void 0 : _c[column.columnId];
+                        if (aggregation && typeof aggregation === 'object' && aggregation.weightedColumnId) {
+                            expressionOptions.push({
+                                label: 'WEIGHTERD_AVG',
+                                value: RowSummary_1.WEIGHTED_AVERAGE_AGGREATED_FUNCTION,
+                            });
+                        }
+                        const expression = rowSummary.ColumnsMap[column.columnId];
+                        return (React.createElement(rebass_1.Flex, null,
+                            React.createElement(rebass_1.Flex, { mr: 2, alignItems: 'center' }, label),
+                            React.createElement(Select_1.Select, { value: expression, options: expressionOptions, onChange: (expression) => {
+                                    onChange(Object.assign(Object.assign({}, rowSummary), { ColumnsMap: Object.assign(Object.assign({}, rowSummary.ColumnsMap), { [column.columnId]: expression }) }));
+                                } })));
+                    }, value: Object.keys(rowSummary.ColumnsMap), onChange: (colIds) => {
+                        const newColumnsMap = {};
+                        colIds.forEach((colId) => {
+                            var _a;
+                            newColumnsMap[colId] = (_a = rowSummary.ColumnsMap[colId]) !== null && _a !== void 0 ? _a : null;
+                        });
+                        onChange(Object.assign(Object.assign({}, rowSummary), { ColumnsMap: newColumnsMap }));
+                    } })))));
+};
+const RowSummarySection = (props) => {
+    var _a;
+    const adaptable = (0, AdaptableContext_1.useAdaptable)();
+    const { data: layout } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
+    const availableScalarExpressions = React.useMemo(() => {
+        return adaptable.api.internalApi
+            .getQueryLanguageService()
+            .getModuleExpressionFunctionsMap(ModuleConstants_1.LayoutModuleId).aggregatedScalarFunctions;
+    }, []);
+    return (React.createElement(Tabs_1.Tabs, { style: { height: '100%' } },
+        React.createElement(Tabs_1.Tabs.Tab, null, "Row Summaries"),
+        React.createElement(Tabs_1.Tabs.Content, null,
+            React.createElement("div", null,
+                React.createElement(rebass_1.Flex, { mb: 1 },
+                    React.createElement(rebass_1.Flex, { flex: 1 }),
+                    React.createElement(SimpleButton_1.default, { onClick: () => {
+                            var _a;
+                            props.onChange(Object.assign(Object.assign({}, layout), { RowSummaries: [
+                                    ...((_a = layout.RowSummaries) !== null && _a !== void 0 ? _a : []),
+                                    {
+                                        Position: 'Top',
+                                        ColumnsMap: {},
+                                    },
+                                ] }));
+                        }, icon: "plus" }, "Add Row Summary")),
+                ((_a = layout.RowSummaries) !== null && _a !== void 0 ? _a : []).map((rowSummary, index) => {
+                    return (React.createElement(RowSummaryEditor, { key: index, onDelete: () => {
+                            const newSummaries = [...layout.RowSummaries];
+                            newSummaries.splice(index, 1);
+                            props.onChange(Object.assign(Object.assign({}, layout), { RowSummaries: newSummaries }));
+                        }, availableScalarExpressions: availableScalarExpressions, rowSummary: rowSummary, onChange: (rowSummary) => {
+                            const newSummaries = [...layout.RowSummaries];
+                            newSummaries[index] = rowSummary;
+                            props.onChange(Object.assign(Object.assign({}, layout), { RowSummaries: newSummaries }));
+                        } }));
+                })))));
+};
+exports.RowSummarySection = RowSummarySection;

package/src/View/License/LicenseWatermark.js

@@ -1,66 +1 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.LicenseWatermark = void 0;
-const tslib_1 = require("tslib");
-const React = tslib_1.__importStar(require("react"));
-const Logo_1 = require("../../components/Logo");
-const rebass_1 = require("rebass");
-const style = {
-    border: '1px solid var(--ab-color-error)',
-    padding: '5px',
-    fontWeight: 600,
-    margin: '5px',
-    fontSize: '14px',
-    alignItems: 'center',
-    color: 'var(--ab-color-text-on-defaultbackground)',
-    background: 'var(--ab-color-defaultbackground)',
-};
-const isStyleValid = (element) => {
-    const notAllowedProperties = [
-        ['display', 'none'],
-        ['opacity', '0'],
-        ['position', 'absolute'],
-        ['position', 'fixed'],
-        ['position', 'relative'],
-        ['visibility', 'hidden'],
-    ];
-    for (const [prop, value] of notAllowedProperties) {
-        if (element.style[prop] === value) {
-            return false;
-        }
-    }
-    return true;
-};
-const LicenseWatermark = (props) => {
-    const ref = React.useRef(null);
-    React.useEffect(() => {
-        const checkWatermark = () => {
-            var _a, _b;
-            if (!((_a = ref.current) === null || _a === void 0 ? void 0 : _a.isConnected)) {
-                alert('It is not allowed to remove the Adaptable watermark.');
-            }
-            if (!isStyleValid(ref.current)) {
-                alert('It is not allowed to modify the Adaptable watermark.');
-            }
-            if ((_b = ref === null || ref === void 0 ? void 0 : ref.current) === null || _b === void 0 ? void 0 : _b.style) {
-                ref.current.style.border = style.border;
-                ref.current.style.padding = style.padding;
-                ref.current.style.fontWeight = `${style.fontWeight}`;
-                ref.current.style.margin = style.margin;
-                ref.current.style.fontSize = style.fontSize;
-                ref.current.style.color = style.color;
-                ref.current.style.background = style.background;
-                ref.current.style.display = 'flex';
-                ref.current.style.position = 'static';
-                ref.current.style.opacity = '1';
-                ref.current.style.visibility = 'visible';
-            }
-        };
-        const timerId = setInterval(checkWatermark, 5000);
-        return () => clearTimeout(timerId);
-    }, []);
-    return (React.createElement(rebass_1.Flex, { style: style, ref: ref },
-        React.createElement(Logo_1.Logo, { style: { marginRight: 10 } }),
-        React.createElement("div", null, props.children)));
-};
-exports.LicenseWatermark = LicenseWatermark;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.LicenseWatermark=void 0;const e=require("tslib"),t=e.__importStar(require("react")),r=require("../../components/Logo"),o=require("rebass"),n={border:"1px solid var(--ab-color-error)",padding:"5px",fontWeight:600,margin:"5px",fontSize:"14px",alignItems:"center",color:"var(--ab-color-text-on-defaultbackground)",background:"var(--ab-color-defaultbackground)"},i=e=>{const t=[["display","none"],["opacity","0"],["position","absolute"],["position","fixed"],["position","relative"],["visibility","hidden"]];for(const[r,o]of t)if(e.style[r]===o)return!1;return!0},l=e=>{const l=t.useRef(null);return t.useEffect((()=>{const e=setInterval((()=>{var e,t;(null===(e=l.current)||void 0===e?void 0:e.isConnected)||alert("It is not allowed to remove the Adaptable watermark."),i(l.current)||alert("It is not allowed to modify the Adaptable watermark."),(null===(t=null==l?void 0:l.current)||void 0===t?void 0:t.style)&&(l.current.style.border=n.border,l.current.style.padding=n.padding,l.current.style.fontWeight=`${n.fontWeight}`,l.current.style.margin=n.margin,l.current.style.fontSize=n.fontSize,l.current.style.color=n.color,l.current.style.background=n.background,l.current.style.display="flex",l.current.style.position="static",l.current.style.opacity="1",l.current.style.visibility="visible")}),5e3);return()=>clearTimeout(e)}),[]),t.createElement(o.Flex,{style:n,ref:l},t.createElement(r.Logo,{style:{marginRight:10}}),t.createElement("div",null,e.children))};exports.LicenseWatermark=l;

package/src/View/Note/NotePopup.d.ts

@@ -0,0 +1,2 @@
+import * as React from 'react';
+export declare const NotePopup: React.FunctionComponent;

package/src/View/{Notes/NotesPopup.js → Note/NotePopup.js}

@@ -1,14 +1,16 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.NotesPopup = void 0;
+exports.NotePopup = void 0;
 const tslib_1 = require("tslib");
 const React = tslib_1.__importStar(require("react"));
 const react_redux_1 = require("react-redux");
 const InfiniteTable_1 = require("../../components/InfiniteTable");
-const NotesRedux_1 = require("../../Redux/ActionsReducers/NotesRedux");
+const NoteRedux_1 = require("../../Redux/ActionsReducers/NoteRedux");
+const format_1 = tslib_1.__importDefault(require("date-fns/format"));
 const AdaptableContext_1 = require("../AdaptableContext");
 const AdaptableButton_1 = require("../Components/AdaptableButton");
 const PopupPanel_1 = require("../Components/Popups/AdaptablePopup/PopupPanel");
+const GeneralConstants_1 = require("../../Utilities/Constants/GeneralConstants");
 const tableDOMProps = {
     style: {
         height: '100%',
@@ -16,10 +18,13 @@ const tableDOMProps = {
         // minHeight: 600,
     },
 };
-const NotesPopup = (props) => {
+const NotePopup = (props) => {
+    var _a, _b, _c, _d;
     const adaptable = (0, AdaptableContext_1.useAdaptable)();
     const primaryKeyHeader = adaptable.api.columnApi.getFriendlyNameForColumnId(adaptable.api.columnApi.getPrimaryKeyColumn().columnId);
-    const allNotes = (0, react_redux_1.useSelector)((state) => (0, NotesRedux_1.GetAllNotesSelector)(state.Notes));
+    const dateFormat = (_d = (_c = (_b = (_a = adaptable.api.optionsApi) === null || _a === void 0 ? void 0 : _a.getNoteOptions) === null || _b === void 0 ? void 0 : _b.call(_a)) === null || _c === void 0 ? void 0 : _c.dateFormat) !== null && _d !== void 0 ? _d : GeneralConstants_1.DEFAULT_DATE_FORMAT_PATTERN_WITH_TIME;
+    const allNotes = (0, react_redux_1.useSelector)((state) => (0, NoteRedux_1.GetAllNotesSelector)(state.Note));
+    const isReadOnlyModule = adaptable.api.entitlementApi.getEntitlementAccessLevelForModule('Note') === 'ReadOnly';
     const columnsMap = React.useMemo(() => {
         const columns = {
             primaryKey: {
@@ -36,21 +41,21 @@ const NotesPopup = (props) => {
             text: {
                 field: 'Text',
                 header: 'Text',
-                defaultEditable: true,
+                defaultEditable: !isReadOnlyModule,
                 defaultFlex: 3,
             },
             timestamp: {
                 field: 'Timestamp',
                 valueGetter: (params) => {
-                    return new Date(params.data.Timestamp).toDateString();
+                    return (0, format_1.default)(params.data.Timestamp, dateFormat);
                 },
             },
             delete: {
                 defaultWidth: 50,
                 render: (params) => {
-                    return (React.createElement(AdaptableButton_1.AdaptableButtonComponent, { variant: "text", icon: "delete", onClick: () => {
-                            const note = adaptable.api.notesApi.getNoteByUuid(params.data.Uuid);
-                            adaptable.api.notesApi.deleteNote(note);
+                    return (React.createElement(AdaptableButton_1.AdaptableButtonComponent, { disabled: isReadOnlyModule, variant: "text", icon: "delete", onClick: () => {
+                            const note = adaptable.api.noteApi.getNoteByUuid(params.data.Uuid);
+                            adaptable.api.noteApi.deleteNote(note);
                         } }));
                 },
             },
@@ -66,7 +71,7 @@ const NotesPopup = (props) => {
                             const data = change.data;
                             const prevNote = allNotes.find((x) => x.Uuid === uuid);
                             if (prevNote.Text !== data.Text) {
-                                adaptable.api.notesApi.updateNoteText(data.Text, prevNote);
+                                adaptable.api.noteApi.updateNoteText(data.Text, prevNote);
                             }
                         }
                     }
@@ -83,4 +88,4 @@ const NotesPopup = (props) => {
                     alwaysReserveSpaceForSortIcon: false,
                 }, rowHeight: 40, columnHeaderHeight: 65, domProps: tableDOMProps, columns: columnsMap }))));
 };
-exports.NotesPopup = NotesPopup;
+exports.NotePopup = NotePopup;

package/src/View/PlusMinus/PlusMinusSummary.js

@@ -23,12 +23,12 @@ class PlusMinusSummaryComponent extends React.Component {
     render() {
         let moduleSummaries = [];
         // title row
-        let titleRow = (React.createElement(ModuleHeader_1.ModuleHeader, { key: this.props.moduleInfo.FriendlyName, moduleInfo: this.props.moduleInfo, moduleSummary: Helper_1.Helper.returnItemCount(this.props.PlusMinusNudges.filter((item) => this.props.api.scopeApi.isColumnInScopeColumns(this.props.summarisedColumn, item.Scope)), this.props.moduleInfo.FriendlyName), onNew: () => this.onNew(), newButtonTooltip: 'Plus / Minus Rule', accessLevel: this.props.accessLevel }));
+        let titleRow = (React.createElement(ModuleHeader_1.ModuleHeader, { key: this.props.moduleInfo.FriendlyName, moduleInfo: this.props.moduleInfo, moduleSummary: Helper_1.Helper.returnItemCount(this.props.PlusMinusNudges.filter((item) => this.props.api.columnScopeApi.isColumnInScopeColumns(this.props.summarisedColumn, item.Scope)), this.props.moduleInfo.FriendlyName), onNew: () => this.onNew(), newButtonTooltip: 'Plus / Minus Rule', accessLevel: this.props.accessLevel }));
         moduleSummaries.push(titleRow);
         // existing items
         this.props.PlusMinusNudges.map((item, index) => {
             var _a;
-            if (this.props.api.scopeApi.isColumnInScopeColumns(this.props.summarisedColumn, item.Scope)) {
+            if (this.props.api.columnScopeApi.isColumnInScopeColumns(this.props.summarisedColumn, item.Scope)) {
                 let detailRow = (React.createElement(ModuleDetail_1.ModuleDetail, { key: 'PM' + index, item1: 'Nudge Value: ' + item.NudgeValue, item2: ((_a = item.Rule) === null || _a === void 0 ? void 0 : _a.BooleanExpression) ? item.Rule.BooleanExpression : 'Always', configEnity: item, showShare: this.props.teamSharingActivated, moduleInfo: this.props.moduleInfo, onEdit: () => this.onEdit(item), onShare: (config) => this.props.onShare(item, config), onDelete: PlusMinusRedux.PlusMinusNudgeDelete(item), accessLevel: this.props.accessLevel }));
                 moduleSummaries.push(detailRow);
             }

package/src/View/SmartEdit/SmartEditPopup.js

@@ -67,7 +67,7 @@ class SmartEditPopupComponent extends React.Component {
                         (this.props.PreviewInfo &&
                             this.props.PreviewInfo.previewValidationSummary.validationResult == 'All'), onClick: () => {
                         this.submit();
-                    }, marginRight: 2 }, "Apply to Grid"),
+                    }, marginRight: 2 }, "Apply Smart Edit"),
                 ' ',
                 this.props.PreviewInfo &&
                     this.props.PreviewInfo.previewValidationSummary.validationResult != 'None' && (React.createElement(AdaptablePopover_1.AdaptablePopover, { headerText: 'Validation Error', bodyText: [globalValidationMessage], MessageType: 'Error' }))),

package/src/View/SpecialColumnSettingsWizardStep.js

@@ -11,10 +11,10 @@ const Tabs_1 = require("../components/Tabs");
 const ModuleConstants_1 = require("../Utilities/Constants/ModuleConstants");
 const AdaptableContext_1 = require("./AdaptableContext");
 const SpecialColumnSettingsWizardStep = (props) => {
-    var _a, _b;
+    var _a, _b, _c;
     const adaptable = (0, AdaptableContext_1.useAdaptable)();
-    const possibleColumnTypes = adaptable.api.optionsApi.getColumnOptions().columnTypes;
-    const { Filterable, Resizable, Groupable, Sortable, Pivotable, Aggregatable, SuppressMenu, SuppressMovable, } = (_a = props.settings) !== null && _a !== void 0 ? _a : {};
+    const possibleColumnTypes = (_a = adaptable.api.columnApi.getColumnTypes()) !== null && _a !== void 0 ? _a : [];
+    const { Filterable, Resizable, Groupable, Sortable, Pivotable, Aggregatable, SuppressMenu, SuppressMovable, } = (_b = props.settings) !== null && _b !== void 0 ? _b : {};
     const handleColumnTypeChange = (columnType, checked) => {
         var _a, _b, _c;
         const columnTypes = (_b = (_a = props.settings) === null || _a === void 0 ? void 0 : _a.ColumnTypes) !== null && _b !== void 0 ? _b : [];
@@ -55,7 +55,7 @@ const SpecialColumnSettingsWizardStep = (props) => {
         Boolean(possibleColumnTypes === null || possibleColumnTypes === void 0 ? void 0 : possibleColumnTypes.length) && (React.createElement(Tabs_1.Tabs, { marginTop: 2, autoFocus: false },
             React.createElement(Tabs_1.Tabs.Tab, null, "Column Types"),
             React.createElement(Tabs_1.Tabs.Content, null,
-                React.createElement(FormLayout_1.default, { columns: [{ name: 'first', size: '30%' }, { name: 'second' }] }, (_b = (0, chunk_1.default)(possibleColumnTypes !== null && possibleColumnTypes !== void 0 ? possibleColumnTypes : [], 2)) === null || _b === void 0 ? void 0 : _b.map(([first, second]) => {
+                React.createElement(FormLayout_1.default, { columns: [{ name: 'first', size: '30%' }, { name: 'second' }] }, (_c = (0, chunk_1.default)(possibleColumnTypes !== null && possibleColumnTypes !== void 0 ? possibleColumnTypes : [], 2)) === null || _c === void 0 ? void 0 : _c.map(([first, second]) => {
                     var _a, _b, _c, _d, _e, _f;
                     return (React.createElement(FormLayout_1.FormRow, { key: first },
                         first && (React.createElement(CheckBox_1.CheckBox, { "data-name": first, onChange: (checked) => handleColumnTypeChange(first, checked), checked: (_c = (_b = (_a = props.settings) === null || _a === void 0 ? void 0 : _a.ColumnTypes) === null || _b === void 0 ? void 0 : _b.includes) === null || _c === void 0 ? void 0 : _c.call(_b, first) }, first)),

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

@@ -11,7 +11,6 @@ const HelpBlock_1 = tslib_1.__importDefault(require("../../../components/HelpBlo
 const SimpleButton_1 = tslib_1.__importDefault(require("../../../components/SimpleButton"));
 const Tabs_1 = require("../../../components/Tabs");
 const ObjectFactory_1 = tslib_1.__importDefault(require("../../../Utilities/ObjectFactory"));
-const AdaptablePopover_1 = require("../../AdaptablePopover");
 const AdaptableIconSelector_1 = require("../../Components/AdaptableIconSelector");
 const PredicateEditor_1 = require("../../Components/PredicateEditor/PredicateEditor");
 const StyleComponent_1 = require("../../Components/StyleComponent");
@@ -20,6 +19,7 @@ const StyledColumnBadgePreview_1 = require("./StyledColumnWizardStyleSection/Com
 const Badge_1 = require("../../Components/Badge");
 const AdaptableIconComponent_1 = require("../../Components/AdaptableIconComponent");
 const GeneralConstants_1 = require("../../../Utilities/Constants/GeneralConstants");
+const Accordion_1 = require("../../../components/Accordion");
 const BadgeEditor = (props) => {
     var _a, _b;
     const { api } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
@@ -40,12 +40,10 @@ const BadgeEditor = (props) => {
                 React.createElement(FormLayout_1.FormRow, { label: "Style" },
                     React.createElement(HelpBlock_1.default, { fontSize: 2, mb: 1, mt: 2 }, "Select the Style for the Badge"),
                     ' ',
-                    React.createElement(AdaptablePopover_1.AdaptablePopover, { showEvent: "mouseenter", hideEvent: "mouseleave", showIcon: false, useButton: false, popoverMaxWidth: 700, bodyText: [
-                            React.createElement(StyleComponent_1.StyleComponent, { showFontSizeAs: "radio", headless: true, hidePreview: true, api: api, Style: (_a = badge.Style) !== null && _a !== void 0 ? _a : {}, UpdateStyle: (Style) => {
-                                    onChange(Object.assign(Object.assign({}, badge), { Style }));
-                                } }),
-                        ] },
-                        React.createElement(SimpleButton_1.default, { variant: "raised" }, "Edit Badge Style"))),
+                    React.createElement(Accordion_1.Accordion, { title: "Edit Badge Style" },
+                        React.createElement(StyleComponent_1.StyleComponent, { showFontSizeAs: "radio", headless: true, hidePreview: true, api: api, Style: (_a = badge.Style) !== null && _a !== void 0 ? _a : {}, UpdateStyle: (Style) => {
+                                onChange(Object.assign(Object.assign({}, badge), { Style }));
+                            } }))),
                 !api.columnApi.hasArrayDataType(columnId) && ( // dont show predicates for arrays
                 (React.createElement(
                     FormLayout_1.FormRow,

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

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

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

@@ -61,7 +61,7 @@ const StyledColumnWizardColumnSection = (props) => {
     }, [data]);
     const handleColumnsChange = (columnIds) => {
         const columnId = columnIds[0];
-        const emptyRanges = api.scopeApi.createCellColorRangesForScope({
+        const emptyRanges = api.columnScopeApi.createCellColorRangesForScope({
             ColumnIds: [columnId],
         });
         const newStyledColumn = Object.assign(Object.assign({}, data), { ColumnId: columnId });

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

@@ -4,35 +4,59 @@ exports.StyledColumnWizardSettingsSection = exports.renderStyledColumnWizardSett
 const tslib_1 = require("tslib");
 const React = tslib_1.__importStar(require("react"));
 const rebass_1 = require("rebass");
-const FormLayout_1 = tslib_1.__importStar(require("../../../components/FormLayout"));
 const CheckBox_1 = require("../../../components/CheckBox");
+const FormLayout_1 = tslib_1.__importStar(require("../../../components/FormLayout"));
 const Tabs_1 = require("../../../components/Tabs");
-const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
 const Tag_1 = require("../../../components/Tag");
-let alignmentOptions = [
-    { value: 'Left', label: 'Left' },
-    { value: 'Right', label: 'Right' },
-    { value: 'Center', label: 'Center' },
-];
+const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
 const renderStyledColumnWizardSettingsSummary = (data) => {
+    var _a, _b, _c;
+    const badgeStyle = data;
     return (React.createElement(rebass_1.Box, { padding: 2 },
         React.createElement(rebass_1.Text, { mt: 3 },
-            "Include grouped rows ",
-            React.createElement(Tag_1.Tag, null, data.IncludeGroupedRows ? 'yes' : 'no'))));
+            "Data Rows ",
+            React.createElement(Tag_1.Tag, null, ((_a = badgeStyle.RowScope) === null || _a === void 0 ? void 0 : _a.ExcludeDataRows) ? 'no' : 'yes')),
+        ' ',
+        React.createElement(rebass_1.Text, { mt: 3 },
+            "Group Rows ",
+            React.createElement(Tag_1.Tag, null, ((_b = badgeStyle.RowScope) === null || _b === void 0 ? void 0 : _b.ExcludeGroupRows) ? 'no' : 'yes')),
+        React.createElement(rebass_1.Text, { mt: 3 },
+            "Summary Rows ",
+            React.createElement(Tag_1.Tag, null, ((_c = badgeStyle.RowScope) === null || _c === void 0 ? void 0 : _c.ExcludeSummaryRows) ? 'no' : 'yes'))));
 };
 exports.renderStyledColumnWizardSettingsSummary = renderStyledColumnWizardSettingsSummary;
 const StyledColumnWizardSettingsSection = (props) => {
-    const { data, api } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
-    const onIncludeGroupedRowsChanged = (IncludeGroupedRows) => {
-        props.onChange(Object.assign(Object.assign({}, data), { IncludeGroupedRows }));
+    var _a, _b, _c;
+    const { data } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
+    const onExcludeDataRowsChanged = (ExcludeDataRows) => {
+        props.onChange(Object.assign(Object.assign({}, data), { BadgeStyle: Object.assign(Object.assign({}, data.BadgeStyle), { RowScope: Object.assign(Object.assign({}, data.BadgeStyle.RowScope), { ExcludeDataRows }) }) }));
+    };
+    const onExcludeGroupedRowsChanged = (ExcludeGroupedRows) => {
+        props.onChange(Object.assign(Object.assign({}, data), { BadgeStyle: Object.assign(Object.assign({}, data.BadgeStyle), { RowScope: Object.assign(Object.assign({}, data.BadgeStyle.RowScope), { ExcludeGroupRows: ExcludeGroupedRows }) }) }));
+    };
+    const onExcludeSummaryRowsChanged = (ExcludeSummaryRows) => {
+        props.onChange(Object.assign(Object.assign({}, data), { BadgeStyle: Object.assign(Object.assign({}, data.BadgeStyle), { RowScope: Object.assign(Object.assign({}, data.BadgeStyle.RowScope), { ExcludeSummaryRows }) }) }));
     };
     return (React.createElement(Tabs_1.Tabs, null,
         React.createElement(Tabs_1.Tabs.Tab, null, "Settings"),
         React.createElement(Tabs_1.Tabs.Content, null,
             React.createElement(rebass_1.Flex, { flexDirection: "row" },
                 React.createElement(FormLayout_1.default, null,
-                    React.createElement(FormLayout_1.FormRow, { label: "Include Grouped Rows:" },
+                    React.createElement(FormLayout_1.FormRow, { label: "Exclude Data Rows:" },
+                        React.createElement(rebass_1.Flex, { alignItems: "center", marginLeft: 2 },
+                            React.createElement(CheckBox_1.CheckBox, { "data-name": "exclude-data-rows-checkbox", checked: 
+                                // @ts-ignore
+                                (_a = data.BadgeStyle.RowScope) === null || _a === void 0 ? void 0 : _a.ExcludeDataRows, onChange: onExcludeDataRowsChanged, mr: 2 }))),
+                    React.createElement(FormLayout_1.FormRow, { label: "Exclude Group Rows:" },
+                        React.createElement(rebass_1.Flex, { alignItems: "center", marginLeft: 2 },
+                            React.createElement(CheckBox_1.CheckBox, { "data-name": "exclude-grouped-rows-checkbox", checked: 
+                                // @ts-ignore
+                                (_b = data.BadgeStyle.RowScope) === null || _b === void 0 ? void 0 : _b.ExcludeGroupRows, onChange: onExcludeGroupedRowsChanged, mr: 2 }))),
+                    React.createElement(FormLayout_1.FormRow, { label: "Exclude Row Summaries:" },
                         React.createElement(rebass_1.Flex, { alignItems: "center", marginLeft: 2 },
-                            React.createElement(CheckBox_1.CheckBox, { "data-name": "include-grouped-rows-checkbox", checked: data.IncludeGroupedRows, onChange: onIncludeGroupedRowsChanged, mr: 2 }))))))));
+                            React.createElement(CheckBox_1.CheckBox, { "data-name": "exclude-summary-rows-checkbox", checked: 
+                                // @ts-ignore
+                                (_c = data.BadgeStyle.RowScope) === null || _c === void 0 ? void 0 : _c.ExcludeSummaryRows, onChange: onExcludeSummaryRowsChanged, mr: 2 }))),
+                    ' ')))));
 };
 exports.StyledColumnWizardSettingsSection = StyledColumnWizardSettingsSection;

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

@@ -210,7 +210,7 @@ const StyledColumnWizardStyleSection = (props) => {
     };
     const handleRangeValueTypeChange = React.useCallback((rangeValueType) => {
         const ranges = rangeValueType === 'Number'
-            ? api.scopeApi.createCellColorRangesForScope(scope)
+            ? api.columnScopeApi.createCellColorRangesForScope(scope)
             : [
                 {
                     Min: 0,