@adaptabletools/adaptable 18.0.0-canary.32 → 18.0.0-canary.33

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adaptabletools/adaptable",
-  "version": "18.0.0-canary.32",
+  "version": "18.0.0-canary.33",
   "description": "Powerful data-agnostic HTML5 AG Grid extension which provides advanced, cutting-edge functionality to meet all DataGrid requirements",
   "keywords": [
     "web-components",

package/src/AdaptableOptions/QuickSearchOptions.d.ts

@@ -33,7 +33,7 @@ export interface QuickSearchOptions<TData = any> {
      */
     filterResultsAfterQuickSearch?: boolean;
     /**
-     * Include Aggregrated Columns in Grouped Rows when Quick Searching (highlight only)
+     * Include Aggregrated Columns in Group Rows when Quick Searching (highlight only)
      *
      * @defaultValue false
      * @gridInfoItem

package/src/Api/GridApi.d.ts

@@ -485,7 +485,7 @@ export interface GridApi {
      */
     refreshRowNodes(rowNodes: IRowNode[]): void;
     /**
-     * Forces a re-render of all Grouped rows (including aggregations)
+     * Forces a re-render of all Group Rows (including aggregations)
      */
     refreshGroupRowNodes(): void;
     /**

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

@@ -13,6 +13,6 @@ export declare class NoteApiImpl extends ApiBase implements NoteApi {
     deleteNote(note: AdaptableNote): void;
     getNoteState(): NoteState;
     getAllNotes(): AdaptableNotes;
-    getNotesForCell(address: CellAddress): AdaptableNote[];
+    getNoteForCell(address: CellAddress): AdaptableNote;
     getNoteByUuid(uuid: string): AdaptableNote | undefined;
 }

package/src/Api/Implementation/NoteApiImpl.js

@@ -31,8 +31,8 @@ export class NoteApiImpl extends ApiBase {
     getAllNotes() {
         return this.getNoteState().Notes;
     }
-    getNotesForCell(address) {
-        return NoteRedux.GetNotesSelector(this.getAdaptableState().Note, address);
+    getNoteForCell(address) {
+        return NoteRedux.GetNoteSelector(this.getAdaptableState().Note, address);
     }
     getNoteByUuid(uuid) {
         return this.getAllNotes().find((note) => note.Uuid === uuid);

package/src/Api/Internal/FormatColumnInternalApi.js

@@ -168,7 +168,7 @@ export class FormatColumnInternalApi extends ApiBase {
             }
         }
         else if (isGroupedRowNode) {
-            if ((_b = formatColumn.RowScope) === null || _b === void 0 ? void 0 : _b.ExcludeGroupedRows) {
+            if ((_b = formatColumn.RowScope) === null || _b === void 0 ? void 0 : _b.ExcludeGroupRows) {
                 return false;
             }
         }

package/src/Api/NoteApi.d.ts

@@ -39,7 +39,7 @@ export interface NoteApi {
      * Gets all Notes for a cell
      * @param CellAddress note position
      */
-    getNotesForCell(CellAddress: CellAddress): AdaptableNote[];
+    getNoteForCell(CellAddress: CellAddress): AdaptableNote;
     /**
      * Returns a Note by uuid
      * @param uuid note uuid

package/src/PredefinedConfig/Common/AdaptableIcon.d.ts

@@ -54,4 +54,4 @@ export interface AdaptableBaseIcon {
 /**
  * All AdapTable System Icon names
  */
-export type AdaptableSystemIconName = 'add' | 'alert' | 'building' | 'laptop' | 'arrow-down' | 'arrow-left' | 'arrow-right' | 'arrow-up' | 'arrow-up-long' | 'arrow-down-long' | 'arrow-expand' | 'paperclip' | 'unfilled-circle' | 'boolean-list' | 'broadcast' | 'brush' | 'spanner' | 'edit-table' | 'chart-and-grid' | 'calendar' | 'call' | 'cells' | 'fdc3' | 'flag' | 'chart' | 'chat' | 'check' | 'check-circle' | 'checked' | 'clone' | 'close' | 'cloud-upload' | 'collapse' | 'column-add' | 'columns' | 'filter-list' | 'copy' | 'comment' | 'comments' | 'contains' | 'dashboard' | 'data-set' | 'date-range' | 'delete' | 'division' | 'dock' | 'dollar' | 'drag' | 'edit' | 'ends-with' | 'equals' | 'equation' | 'error' | 'expand' | 'exponent' | 'export' | 'export-data' | 'fast-backward' | 'fast-forward' | 'filter' | 'filter-off' | 'lightning' | 'folder' | 'folder-open' | 'folder-shared' | 'color-palette' | 'horizontal-lines' | 'function' | 'greater-than' | 'greater-than-or-equal' | 'history' | 'home' | 'import-export' | 'info' | 'brain' | 'download' | 'grid' | 'interactions' | 'less-than' | 'less-than-or-equal' | 'list' | 'logout' | 'mail' | 'menu' | 'minus' | 'multiplication' | 'money' | 'newpage' | 'news' | 'filled-circle' | 'not-contains' | 'not-equal' | 'open-in-new' | 'order' | 'organisation' | 'pause' | 'percent' | 'percent-tag' | 'person' | 'contact' | 'pie-chart' | 'play' | 'plus' | 'add-circle' | 'search' | 'search-table' | 'select-all' | 'select-off' | 'select-fwd' | 'quote' | 'refresh' | 'regex' | 'reminder' | 'save' | 'schedule' | 'science' | 'settings' | 'link' | 'sort-asc' | 'sort-desc' | 'spark-line' | 'resume' | 'starts-with' | 'assignment' | 'statusbar' | 'stop' | 'traffic-lights' | 'tab-unselected' | 'theme' | 'clipboard' | 'target' | 'triangle-down' | 'triangle-up' | 'unchecked' | 'undo' | 'downloaded' | 'upload' | 'warning' | 'gradient' | 'badge' | 'italic' | 'bold' | 'align-left' | 'align-right' | 'align-center' | 'align-justify' | 'underline' | 'strikethrough' | 'overline' | 'case-upper' | 'case-lower' | 'case-sentence' | 'visibility-on' | 'visibility-off' | 'visibility-off-bold' | 'visibility-on-bold' | 'note' | 'import' | 'grid-filter' | 'grid-info' | 'rows';
+export type AdaptableSystemIconName = 'add' | 'alert' | 'building' | 'laptop' | 'arrow-down' | 'arrow-left' | 'arrow-right' | 'arrow-up' | 'arrow-up-long' | 'arrow-down-long' | 'arrow-expand' | 'paperclip' | 'unfilled-circle' | 'boolean-list' | 'broadcast' | 'brush' | 'spanner' | 'edit-table' | 'chart-and-grid' | 'calendar' | 'call' | 'cells' | 'fdc3' | 'flag' | 'chart' | 'chat' | 'check' | 'check-circle' | 'checked' | 'clone' | 'close' | 'cloud-upload' | 'collapse' | 'column-add' | 'columns' | 'filter-list' | 'copy' | 'comment' | 'comments' | 'contains' | 'dashboard' | 'json' | 'data-set' | 'date-range' | 'delete' | 'division' | 'dock' | 'dollar' | 'drag' | 'edit' | 'ends-with' | 'equals' | 'equation' | 'error' | 'excel' | 'expand' | 'exponent' | 'export' | 'export-data' | 'fast-backward' | 'fast-forward' | 'filter' | 'filter-off' | 'lightning' | 'folder' | 'folder-open' | 'folder-shared' | 'color-palette' | 'horizontal-lines' | 'function' | 'greater-than' | 'greater-than-or-equal' | 'history' | 'home' | 'import-export' | 'info' | 'brain' | 'download' | 'grid' | 'interactions' | 'less-than' | 'less-than-or-equal' | 'list' | 'logout' | 'mail' | 'menu' | 'minus' | 'multiplication' | 'money' | 'newpage' | 'news' | 'filled-circle' | 'not-contains' | 'not-equal' | 'open-in-new' | 'order' | 'organisation' | 'pause' | 'percent' | 'percent-tag' | 'person' | 'contact' | 'pie-chart' | 'play' | 'plus' | 'add-circle' | 'search' | 'search-table' | 'select-all' | 'select-off' | 'select-fwd' | 'quote' | 'refresh' | 'regex' | 'reminder' | 'save' | 'schedule' | 'science' | 'settings' | 'link' | 'sort-asc' | 'sort-desc' | 'spark-line' | 'resume' | 'starts-with' | 'assignment' | 'statusbar' | 'stop' | 'traffic-lights' | 'tab-unselected' | 'theme' | 'clipboard' | 'target' | 'triangle-down' | 'triangle-up' | 'unchecked' | 'undo' | 'downloaded' | 'upload' | 'warning' | 'gradient' | 'badge' | 'italic' | 'bold' | 'align-left' | 'align-right' | 'align-center' | 'align-justify' | 'underline' | 'strikethrough' | 'overline' | 'case-upper' | 'case-lower' | 'case-sentence' | 'visibility-on' | 'visibility-off' | 'visibility-off-bold' | 'visibility-on-bold' | 'note' | 'import' | 'grid-filter' | 'grid-info' | 'csv' | 'rows' | 'expand-all' | 'collapse-all';

package/src/PredefinedConfig/Common/RowScope.d.ts

@@ -7,9 +7,9 @@ export type RowScope = {
      */
     ExcludeDataRows?: boolean;
     /**
-     * Exclude Grouped Rows
+     * Exclude Group Rows
      */
-    ExcludeGroupedRows?: boolean;
+    ExcludeGroupRows?: boolean;
     /**
      * Exclude Summary Rows (used in Row Summaries)
      */

package/src/PredefinedConfig/FormatColumnState.d.ts

@@ -46,7 +46,7 @@ export interface FormatColumn extends SuspendableObject {
      */
     RowScope?: RowScope;
     /**
-     * @deprecated FormatColumns now apply to grouped rows by default; use RowScope for more control
+     * @deprecated FormatColumns now apply to Group Rows by default; use RowScope for more control
      */
     IncludeGroupedRows?: never;
 }

package/src/PredefinedConfig/LayoutState.d.ts

@@ -56,7 +56,7 @@ export interface Layout extends AdaptableObject {
      */
     ExpandedRowGroupValues?: any[];
     /**
-     * Columns showing aggregated values in grouped rows; 1st value in record is Column name, 2nd is either aggfunc (e.g. sum, avg etc.) or 'true' (to use default aggfunc)
+     * Columns showing aggregated values in Group Rows; 1st value in record is Column name, 2nd is either aggfunc (e.g. sum, avg etc.) or 'true' (to use default aggfunc)
      */
     AggregationColumns?: AggregationColumns;
     /**

package/src/Redux/ActionsReducers/NoteRedux.d.ts

@@ -34,5 +34,5 @@ export declare const NoteEdit: (note: AdaptableNote) => AdaptableNoteEditAction;
 export declare const NoteDelete: (note: AdaptableNote) => AdaptableNoteDeleteAction;
 export declare const NoteReady: (note: NoteState) => NoteReadyAction;
 export declare const GetAllNotesSelector: (state: NoteState) => AdaptableNote[];
-export declare const GetNotesSelector: (state: NoteState, address: CellAddress) => AdaptableNote[];
+export declare const GetNoteSelector: (state: NoteState, address: CellAddress) => AdaptableNote;
 export declare const NoteReducer: Redux.Reducer<NoteState>;

package/src/Redux/ActionsReducers/NoteRedux.js

@@ -33,12 +33,12 @@ export const NoteReady = (note) => ({
     noteState: note,
 });
 export const GetAllNotesSelector = (state) => state.Notes;
-export const GetNotesSelector = (state, address) => {
+export const GetNoteSelector = (state, address) => {
     var _a;
     if (!address) {
-        return [];
+        return null;
     }
-    return ((_a = state === null || state === void 0 ? void 0 : state.Notes) !== null && _a !== void 0 ? _a : []).filter((note) => {
+    return ((_a = state === null || state === void 0 ? void 0 : state.Notes) !== null && _a !== void 0 ? _a : []).find((note) => {
         if (note.PrimaryKeyValue === address.PrimaryKeyValue && note.ColumnId === address.ColumnId) {
             // happy check
             return true;

package/src/Strategy/ExportModule.js

@@ -48,7 +48,7 @@ export class ExportModule extends AdaptableModuleBase {
         let returnMenuItems = [];
         const availableSystemReports = this.api.exportApi.getAvailableSystemReports();
         if (availableSystemReports.includes(VISUAL_DATA_REPORT)) {
-            returnMenuItems.push(this.createMenuItemClickFunction('export-visual-data-excel', 'Excel', this.moduleInfo.Glyph, () => this.export(this.api.exportApi.getReportByName(VISUAL_DATA_REPORT), ExportDestination.Excel)));
+            returnMenuItems.push(this.createMenuItemClickFunction('export-visual-data-excel', 'Excel', 'excel', () => this.export(this.api.exportApi.getReportByName(VISUAL_DATA_REPORT), ExportDestination.Excel)));
         }
         if (availableSystemReports.includes(ALL_DATA_REPORT)) {
             const allDataReport = this.api.exportApi.getReportByName(ALL_DATA_REPORT);
@@ -88,9 +88,26 @@ export class ExportModule extends AdaptableModuleBase {
         const getMenuItemName = (reportName, destination) => {
             return `export-${adjustName(reportName)}-${adjustName(destination)}`;
         };
+        const getMenuItemIcon = (exportDestination) => {
+            // once we have icons for csv, clipboard etc then i would like to add them here one by one and use moduleinfo for custom
+            switch (exportDestination) {
+                case ExportDestination.Excel:
+                    return 'excel';
+                case ExportDestination.Clipboard:
+                    return 'clipboard';
+                case ExportDestination.CSV:
+                    return 'csv';
+                case ExportDestination.JSON:
+                    return 'json';
+                case ExportDestination.Table:
+                    return 'grid';
+            }
+            return this.moduleInfo.Glyph;
+        };
         const menuItems = [];
         for (const destination of this.api.exportApi.getAvailableExportDestinations()) {
-            menuItems.push(this.createMenuItemClickFunction(getMenuItemName(report.Name, destination), destination, this.moduleInfo.Glyph, () => this.export(report, destination)));
+            menuItems.push(this.createMenuItemClickFunction(getMenuItemName(report.Name, destination), destination, getMenuItemIcon(destination), //  'filter', //  this.moduleInfo.Glyph,
+            () => this.export(report, destination)));
         }
         for (const customDestination of this.api.exportApi.getCustomDestinations()) {
             menuItems.push(this.createMenuItemClickFunction(getMenuItemName(report.Name, customDestination.name), customDestination.name, this.moduleInfo.Glyph, () => this.export(report, customDestination.name)));

package/src/Strategy/NoteModule.js

@@ -11,7 +11,7 @@ export class NoteModule extends AdaptableModuleBase {
         return super.isModuleAvailable() && !this.api.optionsApi.getAutogeneratePrimaryKey();
     }
     createContextMenuItems(menuContext) {
-        var _a, _b, _c;
+        var _a, _b;
         if (!this.isModuleAvailable()) {
             return;
         }
@@ -28,10 +28,10 @@ export class NoteModule extends AdaptableModuleBase {
         if (!isCellNotable) {
             return;
         }
-        const [note] = (_c = this.adaptable.api.noteApi.getNotesForCell({
+        const note = this.adaptable.api.noteApi.getNoteForCell({
             PrimaryKeyValue: menuContext.primaryKeyValue,
             ColumnId: menuContext.adaptableColumn.columnId,
-        })) !== null && _c !== void 0 ? _c : [];
+        });
         if (note) {
             return [
                 this.createMenuItemClickFunction('note-remove', 'Remove Note', this.moduleInfo.Glyph, () => {

package/src/Strategy/StyledColumnModule.js

@@ -177,7 +177,7 @@ export class StyledColumnModule extends AdaptableModuleBase {
                 name: 'Settings',
                 values: [
                     `Data Rows: ${((_b = (_a = styledColumn.BadgeStyle) === null || _a === void 0 ? void 0 : _a.RowScope) === null || _b === void 0 ? void 0 : _b.ExcludeDataRows) ? 'No' : 'Yes'}`,
-                    `Grouped Rows: ${((_d = (_c = styledColumn.BadgeStyle) === null || _c === void 0 ? void 0 : _c.RowScope) === null || _d === void 0 ? void 0 : _d.ExcludeGroupedRows) ? 'No' : 'Yes'}`,
+                    `Group Rows: ${((_d = (_c = styledColumn.BadgeStyle) === null || _c === void 0 ? void 0 : _c.RowScope) === null || _d === void 0 ? void 0 : _d.ExcludeGroupRows) ? 'No' : 'Yes'}`,
                     `Summary Rows: ${((_f = (_e = styledColumn.BadgeStyle) === null || _e === void 0 ? void 0 : _e.RowScope) === null || _f === void 0 ? void 0 : _f.ExcludeSummaryRows) ? 'No' : 'Yes'}`,
                 ],
             });

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

@@ -3,7 +3,7 @@ export const getFormatColumnSettingsViewItems = (formatColumn) => {
     const values = [
         `Cell alignment: ${(_a = formatColumn.CellAlignment) !== null && _a !== void 0 ? _a : 'default'}`,
         `Data Rows: ${((_b = formatColumn.RowScope) === null || _b === void 0 ? void 0 : _b.ExcludeDataRows) ? 'Yes' : 'No'}`,
-        `Grouped Rows: ${((_c = formatColumn.RowScope) === null || _c === void 0 ? void 0 : _c.ExcludeGroupedRows) ? 'Yes' : 'No'}`,
+        `Group Rows: ${((_c = formatColumn.RowScope) === null || _c === void 0 ? void 0 : _c.ExcludeGroupRows) ? 'Yes' : 'No'}`,
         `Row Summaries: ${((_d = formatColumn.RowScope) === null || _d === void 0 ? void 0 : _d.ExcludeSummaryRows) ? 'Yes' : 'No'}`,
     ].filter(Boolean);
     return {

package/src/Utilities/Services/CellPopupService.js

@@ -74,9 +74,9 @@ export class CellPopupService {
             this.hidePopup();
             return;
         }
-        const cellNotes = this.adaptable.api.noteApi.getNotesForCell(cellPosition);
+        const cellNote = this.adaptable.api.noteApi.getNoteForCell(cellPosition);
         const cellComments = this.adaptable.api.commentApi.getCommentThread(cellPosition);
-        const hasNotesOrComments = (cellNotes === null || cellNotes === void 0 ? void 0 : cellNotes.length) || cellComments;
+        const hasNotesOrComments = cellNote || cellComments;
         // call only if it is different
         if (CellPopupService.isSameAddress(openCellAddress, cellPosition)) {
             return;
@@ -92,9 +92,9 @@ export class CellPopupService {
             return;
         }
         // if open but this has no note, close
-        const cellNotes = this.adaptable.api.noteApi.getNotesForCell(cellAddress);
+        const cellNote = this.adaptable.api.noteApi.getNoteForCell(cellAddress);
         const cellComments = this.adaptable.api.commentApi.getCommentThread(cellAddress);
-        const hasNotesOrComments = (cellNotes === null || cellNotes === void 0 ? void 0 : cellNotes.length) || cellComments;
+        const hasNotesOrComments = cellNote || cellComments;
         if (openCellAddress && !hasNotesOrComments) {
             // hide only if in edit mode
             // because if you select a cell and move the mouse fast over another cell

package/src/View/Components/Popups/GridCellPopup/GridCellPopup.js

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { useSelector } from 'react-redux';
 import { Flex } from 'rebass';
-import { GetNotesSelector } from '../../../../Redux/ActionsReducers/NoteRedux';
+import { GetNoteSelector } from '../../../../Redux/ActionsReducers/NoteRedux';
 import { SystemCommentsAndNotesEditModeSelector, SystemCommentsAndNotesFocusedEntitySelector, SystemCommentsAndNotesSelector, } from '../../../../Redux/ActionsReducers/SystemRedux';
 import { useAdaptable } from '../../../AdaptableContext';
 import { CommentsEditor } from '../../../Comments/CommentsEditor';
@@ -13,11 +13,8 @@ const ConnectedNoteEditor = ({ enableEditMode }) => {
     const editMode = useSelector((state) => SystemCommentsAndNotesEditModeSelector(state.System));
     const cellPopupService = api.internalApi.getCellPopupService();
     const cellAddress = useSelector((state) => SystemCommentsAndNotesSelector(state.System));
-    const [
-    // Only handle first note for now
-    // Later we can handle multiple notes
-    note,] = useSelector((state) => {
-        return cellAddress ? GetNotesSelector(state.Note, cellAddress) : [];
+    const note = useSelector((state) => {
+        return cellAddress ? GetNoteSelector(state.Note, cellAddress) : null;
     });
     const handleNoteChange = React.useCallback((value) => {
         api.noteApi.updateNoteText(value, note);

package/src/View/DataChangeHistory/DataChangeHistoryGrid.js

@@ -95,7 +95,7 @@ const buildAdaptableOptions = (mainAdaptableInstance, gridOptions, adaptableCont
                     columnId: 'undoActionColumn',
                     friendlyName: ' ',
                     rowScope: {
-                        ExcludeGroupedRows: true,
+                        ExcludeGroupRows: true,
                         ExcludeSummaryRows: true,
                     },
                     actionColumnSettings: { suppressMenu: true, suppressMovable: true },

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

@@ -18,8 +18,8 @@ export const renderFormatColumnSettingsSummary = (data) => {
             React.createElement(Tag, null, ((_b = data.RowScope) === null || _b === void 0 ? void 0 : _b.ExcludeDataRows) ? 'no' : 'yes')),
         ' ',
         React.createElement(Text, { mt: 3 },
-            "Grouped Rows ",
-            React.createElement(Tag, null, ((_c = data.RowScope) === null || _c === void 0 ? void 0 : _c.ExcludeGroupedRows) ? 'no' : 'yes')),
+            "Group Rows ",
+            React.createElement(Tag, null, ((_c = data.RowScope) === null || _c === void 0 ? void 0 : _c.ExcludeGroupRows) ? 'no' : 'yes')),
         React.createElement(Text, { mt: 3 },
             "Summary Rows ",
             React.createElement(Tag, null, ((_d = data.RowScope) === null || _d === void 0 ? void 0 : _d.ExcludeSummaryRows) ? 'no' : 'yes'))));
@@ -38,7 +38,7 @@ export const FormatColumnSettingsWizardSection = (props) => {
         props.onChange(Object.assign(Object.assign({}, data), { RowScope: Object.assign(Object.assign({}, data.RowScope), { ExcludeDataRows }) }));
     };
     const onExcludeGroupedRowsChanged = (ExcludeGroupedRows) => {
-        props.onChange(Object.assign(Object.assign({}, data), { RowScope: Object.assign(Object.assign({}, data.RowScope), { ExcludeGroupedRows }) }));
+        props.onChange(Object.assign(Object.assign({}, data), { RowScope: Object.assign(Object.assign({}, data.RowScope), { ExcludeGroupRows: ExcludeGroupedRows }) }));
     };
     const onExcludeSummaryRowsChanged = (ExcludeSummaryRows) => {
         props.onChange(Object.assign(Object.assign({}, data), { RowScope: Object.assign(Object.assign({}, data.RowScope), { ExcludeSummaryRows }) }));
@@ -62,9 +62,9 @@ export const FormatColumnSettingsWizardSection = (props) => {
                     React.createElement(FormRow, { label: "Exclude Data Rows:" },
                         React.createElement(Flex, { alignItems: "center", marginLeft: 2 },
                             React.createElement(CheckBox, { "data-name": "exclude-data-rows-checkbox", checked: (_a = data.RowScope) === null || _a === void 0 ? void 0 : _a.ExcludeDataRows, onChange: onExcludeDataRowsChanged, mr: 2 }))),
-                    React.createElement(FormRow, { label: "Exclude Grouped Rows:" },
+                    React.createElement(FormRow, { label: "Exclude Group Rows:" },
                         React.createElement(Flex, { alignItems: "center", marginLeft: 2 },
-                            React.createElement(CheckBox, { "data-name": "exclude-grouped-rows-checkbox", checked: (_b = data.RowScope) === null || _b === void 0 ? void 0 : _b.ExcludeGroupedRows, onChange: onExcludeGroupedRowsChanged, mr: 2 }))),
+                            React.createElement(CheckBox, { "data-name": "exclude-grouped-rows-checkbox", checked: (_b = data.RowScope) === null || _b === void 0 ? void 0 : _b.ExcludeGroupRows, onChange: onExcludeGroupedRowsChanged, mr: 2 }))),
                     React.createElement(FormRow, { label: "Exclude Row Summaries:" },
                         React.createElement(Flex, { alignItems: "center", marginLeft: 2 },
                             React.createElement(CheckBox, { "data-name": "exclude-summary-rows-checkbox", checked: (_c = data.RowScope) === null || _c === void 0 ? void 0 : _c.ExcludeSummaryRows, onChange: onExcludeSummaryRowsChanged, mr: 2 }))))))));

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

@@ -43,7 +43,7 @@ export const RowGroupingSection = (props) => {
         props.onChange(Object.assign(Object.assign({}, layout), { RowGroupedColumns: columnIds }));
     };
     return (React.createElement(Tabs, { style: { height: '100%' } },
-        React.createElement(Tabs.Tab, null, "Grouped Rows"),
+        React.createElement(Tabs.Tab, null, "Group Rows"),
         ((_a = layout.ExpandedRowGroupValues) === null || _a === void 0 ? void 0 : _a.length) && React.createElement(Tabs.Tab, null, "Expanded Rows"),
         React.createElement(Tabs.Content, null,
             React.createElement(ValueSelector, { showFilterInput: true, showSelectedOnlyPosition: "top", filter: 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/StyledColumn/Wizard/StyledColumnBadgeSection.js

@@ -7,7 +7,6 @@ import HelpBlock from '../../../components/HelpBlock';
 import SimpleButton from '../../../components/SimpleButton';
 import { Tabs } from '../../../components/Tabs';
 import ObjectFactory from '../../../Utilities/ObjectFactory';
-import { AdaptablePopover } from '../../AdaptablePopover';
 import { AdaptableIconSelector } from '../../Components/AdaptableIconSelector';
 import { PredicateEditor } from '../../Components/PredicateEditor/PredicateEditor';
 import { StyleComponent } from '../../Components/StyleComponent';
@@ -16,6 +15,7 @@ import { StyledColumnBadgePreview } from './StyledColumnWizardStyleSection/Compo
 import { Badge } from '../../Components/Badge';
 import { AdaptableIconComponent } from '../../Components/AdaptableIconComponent';
 import { DEFAULT_INTEGER_DISPLAY_VALUE, DEFAULT_STRING_DISPLAY_VALUE, } from '../../../Utilities/Constants/GeneralConstants';
+import { Accordion } from '../../../components/Accordion';
 const BadgeEditor = (props) => {
     var _a, _b;
     const { api } = useOnePageAdaptableWizardContext();
@@ -36,12 +36,10 @@ const BadgeEditor = (props) => {
                 React.createElement(FormRow, { label: "Style" },
                     React.createElement(HelpBlock, { fontSize: 2, mb: 1, mt: 2 }, "Select the Style for the Badge"),
                     ' ',
-                    React.createElement(AdaptablePopover, { showEvent: "mouseenter", hideEvent: "mouseleave", showIcon: false, useButton: false, popoverMaxWidth: 700, bodyText: [
-                            React.createElement(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, { variant: "raised" }, "Edit Badge Style"))),
+                    React.createElement(Accordion, { title: "Edit Badge Style" },
+                        React.createElement(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(
                     FormRow,

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

@@ -14,8 +14,8 @@ export const renderStyledColumnWizardSettingsSummary = (data) => {
             React.createElement(Tag, null, ((_a = badgeStyle.RowScope) === null || _a === void 0 ? void 0 : _a.ExcludeDataRows) ? 'no' : 'yes')),
         ' ',
         React.createElement(Text, { mt: 3 },
-            "Grouped Rows ",
-            React.createElement(Tag, null, ((_b = badgeStyle.RowScope) === null || _b === void 0 ? void 0 : _b.ExcludeGroupedRows) ? 'no' : 'yes')),
+            "Group Rows ",
+            React.createElement(Tag, null, ((_b = badgeStyle.RowScope) === null || _b === void 0 ? void 0 : _b.ExcludeGroupRows) ? 'no' : 'yes')),
         React.createElement(Text, { mt: 3 },
             "Summary Rows ",
             React.createElement(Tag, null, ((_c = badgeStyle.RowScope) === null || _c === void 0 ? void 0 : _c.ExcludeSummaryRows) ? 'no' : 'yes'))));
@@ -27,7 +27,7 @@ export const StyledColumnWizardSettingsSection = (props) => {
         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), { 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 }) }) }));
@@ -42,11 +42,11 @@ export const StyledColumnWizardSettingsSection = (props) => {
                             React.createElement(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(FormRow, { label: "Exclude Grouped Rows:" },
+                    React.createElement(FormRow, { label: "Exclude Group Rows:" },
                         React.createElement(Flex, { alignItems: "center", marginLeft: 2 },
                             React.createElement(CheckBox, { "data-name": "exclude-grouped-rows-checkbox", checked: 
                                 // @ts-ignore
-                                (_b = data.BadgeStyle.RowScope) === null || _b === void 0 ? void 0 : _b.ExcludeGroupedRows, onChange: onExcludeGroupedRowsChanged, mr: 2 }))),
+                                (_b = data.BadgeStyle.RowScope) === null || _b === void 0 ? void 0 : _b.ExcludeGroupRows, onChange: onExcludeGroupedRowsChanged, mr: 2 }))),
                     React.createElement(FormRow, { label: "Exclude Row Summaries:" },
                         React.createElement(Flex, { alignItems: "center", marginLeft: 2 },
                             React.createElement(CheckBox, { "data-name": "exclude-summary-rows-checkbox", checked: 

package/src/agGrid/ActionColumnRenderer.js

@@ -43,7 +43,7 @@ export const ReactActionColumnRenderer = (props) => {
     const isSummaryRow = adaptable.api.gridApi.isSummaryNode(props.node);
     let shouldRender = true;
     if (isGroupedRow) {
-        if ((_a = actionColumn.rowScope) === null || _a === void 0 ? void 0 : _a.ExcludeGroupedRows) {
+        if ((_a = actionColumn.rowScope) === null || _a === void 0 ? void 0 : _a.ExcludeGroupRows) {
             shouldRender = false;
         }
     }
@@ -89,7 +89,7 @@ export class ActionColumnRenderer {
         const isSummaryRow = adaptable.api.gridApi.isSummaryNode(params.node);
         let shouldRender = true;
         if (isGroupedRow) {
-            if ((_a = actionColumn.rowScope) === null || _a === void 0 ? void 0 : _a.ExcludeGroupedRows) {
+            if ((_a = actionColumn.rowScope) === null || _a === void 0 ? void 0 : _a.ExcludeGroupRows) {
                 shouldRender = false;
             }
         }

package/src/agGrid/AgGridColumnAdapter.js

@@ -576,8 +576,8 @@ export class AgGridColumnAdapter {
             PrimaryKeyValue: gridCell.primaryKeyValue,
             ColumnId: gridCell.column.columnId,
         };
-        const cellNotes = this.adaptableApi.noteApi.getNotesForCell(cellPosition);
-        if (!(cellNotes === null || cellNotes === void 0 ? void 0 : cellNotes.length)) {
+        const cellNote = this.adaptableApi.noteApi.getNoteForCell(cellPosition);
+        if (!cellNote) {
             return undefined;
         }
         return 'ab-Cell-Note';

package/src/agGrid/AgGridMenuAdapter.js

@@ -352,25 +352,25 @@ export class AgGridMenuAdapter {
             ? [
                 this.buildMenuGroupParent('Export', exportMenuItems.filter((item) => item.name.startsWith('export-visual-data-excel')), {
                     label: 'Visual Data',
-                    icon: false,
+                    icon: 'export-data',
                 }),
             ]
             : [];
         const allDataExportItems = this.normalizeMenuGroup(this.buildMenuGroupParent('Export', exportMenuItems.filter((item) => item.name.startsWith('export-all-data')), {
             label: 'All Data',
-            icon: false,
+            icon: 'export-data',
         }));
         const currentDataExportItems = this.normalizeMenuGroup(this.buildMenuGroupParent('Export', exportMenuItems.filter((item) => item.name.startsWith('export-current-data')), {
             label: 'Current Data',
-            icon: false,
+            icon: 'export-data',
         }));
         const selectedCellsExportItems = this.normalizeMenuGroup(this.buildMenuGroupParent('Export', exportMenuItems.filter((item) => item.name.startsWith('export-selected-cells')), {
             label: 'Selected Cells',
-            icon: false,
+            icon: 'export-data',
         }));
         const selectedRowsExportItems = this.normalizeMenuGroup(this.buildMenuGroupParent('Export', exportMenuItems.filter((item) => item.name.startsWith('export-selected-rows')), {
             label: 'Selected Rows',
-            icon: false,
+            icon: 'export-data',
         }));
         return this.normalizeMenuGroup(this.buildMenuGroupParent('Export', [
             ...visualDataExportItems,

package/src/agGrid/BadgeRenderer.js

@@ -17,7 +17,7 @@ export const getBadgeRendererForColumn = (badgeStyle, abColumn, api) => {
             const isSummaryRow = adapatableApi.gridApi.isSummaryNode(params.node);
             let shouldRender = true;
             if (isGroupedRow) {
-                if ((_a = badgeStyle.RowScope) === null || _a === void 0 ? void 0 : _a.ExcludeGroupedRows) {
+                if ((_a = badgeStyle.RowScope) === null || _a === void 0 ? void 0 : _a.ExcludeGroupRows) {
                     shouldRender = false;
                 }
             }

package/src/agGrid/PercentBarRenderer.js

@@ -13,7 +13,7 @@ export const getPercentBarRendererForColumn = (styledColumn, abColumn, api) => {
             if (Helper.objectNotExists(value)) {
                 value = 0;
             }
-            // No longer support showing Percent Bar in Grouped Rows
+            // We no longer support showing Percent Bar in Group Rows as it only made sense for Min / Max
             if (api.gridApi.isGroupRowNode(params.node)) {
                 if (params.value) {
                     this.eGui = document.createElement('div');

package/src/components/Accordion.d.ts

@@ -0,0 +1,7 @@
+import React, { ReactElement } from 'react';
+interface AccordionProps {
+    title: string | ReactElement;
+    children: ReactElement;
+}
+export declare const Accordion: React.FC<AccordionProps>;
+export default Accordion;

package/src/components/Accordion.js

@@ -0,0 +1,36 @@
+import React, { useState, useEffect, useRef } from 'react';
+import SimpleButton from './SimpleButton';
+import Panel from './Panel';
+export const Accordion = ({ title, children }) => {
+    const [isOpen, setIsOpen] = useState(false);
+    const [height, setHeight] = useState('0px');
+    const content = useRef(null);
+    const observer = useRef(null);
+    useEffect(() => {
+        setHeight(isOpen && content.current ? `${content.current.scrollHeight}px` : '0px');
+    }, [isOpen, content]);
+    useEffect(() => {
+        if (content.current) {
+            observer.current = new MutationObserver(() => {
+                var _a;
+                setHeight(`${(_a = content.current) === null || _a === void 0 ? void 0 : _a.scrollHeight}px`);
+            });
+            observer.current.observe(content.current, { childList: true, subtree: true });
+        }
+        return () => {
+            var _a;
+            (_a = observer.current) === null || _a === void 0 ? void 0 : _a.disconnect();
+        };
+    }, []);
+    const toggleAccordion = () => {
+        setIsOpen(!isOpen);
+    };
+    return (React.createElement(Panel, { className: "ab-Accordion" },
+        React.createElement(SimpleButton, { iconPosition: 'end', icon: isOpen ? 'expand-all' : 'collapse-all', variant: "text", onClick: toggleAccordion, style: { width: '100%', textAlign: 'left' } }, title),
+        React.createElement("div", { ref: content, style: {
+                maxHeight: `${height}`,
+                overflow: 'hidden',
+                transition: 'max-height 0.6s ease',
+            } }, children)));
+};
+export default Accordion;

package/src/components/icons/collapse-all.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const _default: (props: any) => JSX.Element;
+export default _default;

package/src/components/icons/collapse-all.js

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import DefaultIcon from './DefaultIcon';
+export default (props) => (React.createElement(DefaultIcon, Object.assign({}, props, { viewBox: "0 -960 960 960" }),
+    React.createElement("path", { d: "m296-80-56-56 240-240 240 240-56 56-184-184L296-80Zm184-504L240-824l56-56 184 184 184-184 56 56-240 240Z" })));

package/src/components/icons/csv.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const _default: (props: any) => JSX.Element;
+export default _default;

package/src/components/icons/csv.js

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import DefaultIcon from './DefaultIcon';
+export default (props) => (React.createElement(DefaultIcon, Object.assign({}, props, { viewBox: "0 -960 960 960" }),
+    React.createElement("path", { d: "M230-360h120v-60H250v-120h100v-60H230q-17 0-28.5 11.5T190-560v160q0 17 11.5 28.5T230-360Zm156 0h120q17 0 28.5-11.5T546-400v-60q0-17-11.5-31.5T506-506h-60v-34h100v-60H426q-17 0-28.5 11.5T386-560v60q0 17 11.5 30.5T426-456h60v36H386v60Zm264 0h60l70-240h-60l-40 138-40-138h-60l70 240ZM160-160q-33 0-56.5-23.5T80-240v-480q0-33 23.5-56.5T160-800h640q33 0 56.5 23.5T880-720v480q0 33-23.5 56.5T800-160H160Zm0-80h640v-480H160v480Zm0 0v-480 480Z" })));

package/src/components/icons/data-object.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const _default: (props: any) => JSX.Element;
+export default _default;

package/src/components/icons/data-object.js

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import DefaultIcon from './DefaultIcon';
+export default (props) => (React.createElement(DefaultIcon, Object.assign({}, props, { viewBox: "0 -960 960 960" }),
+    React.createElement("path", { d: "M560-160v-80h120q17 0 28.5-11.5T720-280v-80q0-38 22-69t58-44v-14q-36-13-58-44t-22-69v-80q0-17-11.5-28.5T680-720H560v-80h120q50 0 85 35t35 85v80q0 17 11.5 28.5T840-560h40v160h-40q-17 0-28.5 11.5T800-360v80q0 50-35 85t-85 35H560Zm-280 0q-50 0-85-35t-35-85v-80q0-17-11.5-28.5T120-400H80v-160h40q17 0 28.5-11.5T160-600v-80q0-50 35-85t85-35h120v80H280q-17 0-28.5 11.5T240-680v80q0 38-22 69t-58 44v14q36 13 58 44t22 69v80q0 17 11.5 28.5T280-240h120v80H280Z" })));

package/src/components/icons/excel.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const _default: (props: any) => JSX.Element;
+export default _default;

package/src/components/icons/excel.js

@@ -0,0 +1,5 @@
+import * as React from 'react';
+import DefaultIcon from './DefaultIcon';
+export default (props) => (React.createElement(DefaultIcon, Object.assign({}, props, { viewBox: "0 -960 960 960" }),
+    React.createElement("path", { d: "M200-200h80v-80h-80v80Zm160 0h80v-80h-80v80Zm160 0h80v-80h-80v80Zm160 0h80v-80h-80v80ZM200-680h80v-80h-80v80Zm0 160h80v-80h-80v80Zm0 160h80v-80h-80v80Zm160-320h80v-80h-80v80Zm0 160h80v-80h-80v80Zm0 160h80v-80h-80v80Zm160-320h80v-80h-80v80Zm0 160h80v-80h-80v80Zm0 160h80v-80h-80v80Zm160-320h80v-80h-80v80Zm0 160h80v-80h-80v80Zm0 160h80v-80h-80v80ZM200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H200Z" }),
+    ' '));

package/src/components/icons/expand-all.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const _default: (props: any) => JSX.Element;
+export default _default;

package/src/components/icons/expand-all.js

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import DefaultIcon from './DefaultIcon';
+export default (props) => (React.createElement(DefaultIcon, Object.assign({}, props, { viewBox: "0 -960 960 960" }),
+    React.createElement("path", { d: "M480-80 240-320l57-57 183 183 183-183 57 57L480-80ZM298-584l-58-56 240-240 240 240-58 56-182-182-182 182Z" })));