@adaptabletools/adaptable 20.2.11 → 20.3.0-canary.0

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

@@ -78,10 +78,11 @@ export declare class ColumnApiImpl extends ApiBase implements ColumnApi {
     getPrimaryKeyColumn(): AdaptableColumn<any>;
     getDefaultAggFunc(columnId: string): string;
     openColumnInfoSettingsPanel(): void;
-    getColumnTypes(): string[];
+    getColumnTypes(): import("../../AdaptableState/Common/Types").TypeHint<string, import("../../types").AdaptableColumnType>[];
     getColumnsByColumnType(columnType: string): AdaptableColumn[];
     getRowGroupedColumns(): AdaptableColumn[];
     setColumnCaption(columnId: string, caption: string): void;
     getAGGridColDefForColumnId(columnId: string): ColDef | ColGroupDef;
     getAGGridColumnForColumnId(columnId: string): Column;
+    hasColumnType(columnIdentifier: string | ColDef, columnType: string): boolean;
 }

package/src/Api/Implementation/ColumnApiImpl.js

@@ -500,4 +500,18 @@ export class ColumnApiImpl extends ApiBase {
     getAGGridColumnForColumnId(columnId) {
         return this.getAgGridApi().getColumn(columnId);
     }
+    hasColumnType(columnIdentifier, columnType) {
+        const colDef = typeof columnIdentifier === 'string'
+            ? this.getAgGridApi().getColumnDef(columnIdentifier)
+            : columnIdentifier;
+        if (!colDef?.type) {
+            return false;
+        }
+        if (Array.isArray(colDef.type)) {
+            return colDef.type.includes(columnType);
+        }
+        else {
+            return colDef.type === columnType;
+        }
+    }
 }

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

@@ -99,6 +99,7 @@ export declare class GridApiImpl extends ApiBase implements GridApi {
     isMasterDetailGrid(): boolean;
     isTreeDataGrid(): boolean;
     isGroupRowNode(rowNode: IRowNode): boolean;
+    isGrandTotalRowNode(rowNode: IRowNode): boolean;
     isVisibleRowNode(rowNode: IRowNode): boolean;
     isSummaryNode(rowNode: IRowNode): boolean;
     isQuickFilterAvailable(): boolean;

package/src/Api/Implementation/GridApiImpl.js

@@ -382,6 +382,9 @@ export class GridApiImpl extends ApiBase {
     isGroupRowNode(rowNode) {
         return this._adaptable.isGroupRowNode(rowNode);
     }
+    isGrandTotalRowNode(rowNode) {
+        return this._adaptable.isGrandTotalRowNode(rowNode);
+    }
     isVisibleRowNode(rowNode) {
         return this._adaptable.isRowNodeVisible(rowNode);
     }

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

@@ -9,7 +9,7 @@ export declare class PredicateApiImpl extends ApiBase implements PredicateApi {
     getPredicateDefs(): AdaptablePredicateDef<string>[];
     getSystemPredicateDefs(): AdaptablePredicateDef<string>[];
     getSystemPredicateDefsByModuleScope<PREDICATE_TYPE extends string = string>(moduleScope: PredicateModuleScope): AdaptablePredicateDef<PREDICATE_TYPE>[];
-    getCustomPredicateDefs(): AdaptablePredicateDef<string>[];
+    getCustomPredicateDefs(): AdaptablePredicateDef[];
     getPredicateDefsByModuleScope(moduleScope: PredicateModuleScope): AdaptablePredicateDef[];
     getPredicateDefById(predicateId: string): AdaptablePredicateDef;
     getSystemPredicateDefById(predicateId: string): AdaptablePredicateDef;

package/src/Api/Implementation/PredicateApiImpl.js

@@ -18,7 +18,31 @@ export class PredicateApiImpl extends ApiBase {
         return SystemPredicateDefs.filter((p) => p.moduleScope.includes(moduleScope));
     }
     getCustomPredicateDefs() {
-        return this.getPredicateOptions().customPredicateDefs;
+        const predicateDefsMap = new Map(this.getSystemPredicateDefs().map((p) => [p.id, p]));
+        const customPredicateDefs = this.getPredicateOptions().customPredicateDefs || [];
+        return customPredicateDefs
+            .map((p) => {
+            if ('extends' in p) {
+                const foundPredicateDef = predicateDefsMap.get(p.extends);
+                if (!foundPredicateDef) {
+                    this.logWarn(`Custom predicate with ID '${p.id}' references a missing 'extends' target '${p.extends}'. No such system or custom predicate found.`);
+                    return null;
+                }
+                else {
+                    const { extends: _, ...rest } = p;
+                    const result = {
+                        ...foundPredicateDef,
+                        ...rest,
+                        id: rest.id,
+                    };
+                    predicateDefsMap.set(result.id, result);
+                    return result;
+                }
+            }
+            predicateDefsMap.set(p.id, p);
+            return p;
+        })
+            .filter((p) => p !== null);
     }
     getPredicateDefsByModuleScope(moduleScope) {
         return this.getPredicateDefs().filter((p) => p.moduleScope.includes(moduleScope));

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

@@ -17,7 +17,9 @@ export declare class UserInterfaceApiImpl extends ApiBase implements UserInterfa
     getAdaptableObjectTags(): AdaptableObjectTag[] | undefined;
     getAdaptableObjectsWithTag(tag: AdaptableObjectTag, adaptableModule?: AdaptableModule): AdaptableObject[] | undefined;
     getCustomIconDefinition(iconName: string): import("../../types").AdaptableIcon | import("../../types").CustomIcon;
-    showProgressIndicator(config: ProgressIndicatorConfig): void;
+    showProgressIndicator(config: ProgressIndicatorConfig): {
+        close: () => void;
+    };
     hideProgressIndicator(): void;
     openCustomWindowPopup(config: CustomWindowConfig): {
         close: () => void;

package/src/Api/Implementation/UserInterfaceApiImpl.js

@@ -83,6 +83,9 @@ export class UserInterfaceApiImpl extends ApiBase {
         return customIcon;
     }
     showProgressIndicator(config) {
+        const close = () => {
+            this.hideProgressIndicator();
+        };
         if (config.delay) {
             this.showProgressIndicatorTimeout = setTimeout(() => {
                 this.dispatchAction(ProgressIndicatorShow(config));
@@ -91,6 +94,7 @@ export class UserInterfaceApiImpl extends ApiBase {
         else {
             this.dispatchAction(ProgressIndicatorShow(config));
         }
+        return { close };
     }
     hideProgressIndicator() {
         if (this.showProgressIndicatorTimeout) {
@@ -111,6 +115,8 @@ export class UserInterfaceApiImpl extends ApiBase {
                 render: config.render,
                 frameworkComponent: config.frameworkComponent,
                 onFrameworkComponentDestroyed: config.onFrameworkComponentDestroyed,
+                size: config.size,
+                position: config.position,
             },
             Icon: config.icon,
         });

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

@@ -34,4 +34,5 @@ export declare class ColumnInternalApi extends ApiBase {
     getColumnHeaderName(params: HeaderValueGetterParams): string;
     private buildColumnHeaderContext;
     getQueryableColumnsForUIEditor(): AdaptableColumn[];
+    hasArrayDataType(column: AdaptableColumn): boolean;
 }

package/src/Api/Internal/ColumnInternalApi.js

@@ -287,4 +287,7 @@ export class ColumnInternalApi extends ApiBase {
             .getQueryableColumns()
             .filter((column) => !column.isGeneratedPivotResultColumn && !column.isGeneratedRowGroupColumn);
     }
+    hasArrayDataType(column) {
+        return ['textArray', 'numberArray', 'tupleArray', 'objectArray'].includes(column.dataType);
+    }
 }

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

@@ -1,5 +1,5 @@
 import { IRowNode } from 'ag-grid-enterprise';
-import { AdaptableColumn, AdaptableFormat, AdaptablePredicateDef, ColumnScope, FormatColumn, StringFormatterOptions } from '../../types';
+import { AdaptableColumn, AdaptableFormat, AdaptablePredicateDef, ColumnScope, FormatColumn, FormatColumnTarget, StringFormatterOptions } from '../../types';
 import { ApiBase } from '../Implementation/ApiBase';
 export declare class FormatColumnInternalApi extends ApiBase {
     /**
@@ -28,7 +28,8 @@ export declare class FormatColumnInternalApi extends ApiBase {
      * @param config
      * @returns list of FormatColumn
      */
-    getFormatColumnsWithStyleForColumn(column: AdaptableColumn, config?: {
+    getFormatColumnsWithStyleForColumn(column: AdaptableColumn, config: {
+        target: FormatColumnTarget;
         includeSuspended?: boolean;
     }): FormatColumn[];
     /**
@@ -36,8 +37,9 @@ export declare class FormatColumnInternalApi extends ApiBase {
      * @param column The Column for which to retrieve the Format Column
      * @returns format columns
      */
-    getFormatColumnWithStyleClassNameForColumn(column: AdaptableColumn, config?: {
+    getFormatColumnWithStyleClassNameForColumn(column: AdaptableColumn, config: {
         includeSuspended?: boolean;
+        target: FormatColumnTarget;
     }): FormatColumn[];
     getFormatColumnWithColumnInScope(formatColumns: FormatColumn[], column: AdaptableColumn): FormatColumn[];
     private getFormatColumnInColumnScope;
@@ -85,7 +87,14 @@ export declare class FormatColumnInternalApi extends ApiBase {
      * @param column
      * @param params
      */
-    formatColumnShouldRender(formatColumn: FormatColumn, column: AdaptableColumn, rowNode: IRowNode, cellValue: any): boolean;
+    formatColumnShouldRenderInCell(formatColumn: FormatColumn, column: AdaptableColumn, rowNode: IRowNode, cellValue: any): boolean;
+    /**
+     * Checks if format column is relevant for a given Column Header
+     *
+     * @param formatColumn
+     * @param column
+     */
+    formatColumnShouldRenderInHeader(formatColumn: FormatColumn, column: AdaptableColumn): boolean;
     private evaluatePredicate;
     private evaluateExpression;
     /**

package/src/Api/Internal/FormatColumnInternalApi.js

@@ -75,7 +75,13 @@ export class FormatColumnInternalApi extends ApiBase {
      * @returns list of FormatColumn
      */
     getFormatColumnsWithStyleForColumn(column, config) {
-        const formatColumns = this.getAllFormatColumnWithStyleAndCellAlignment().filter((formatColumn) => config?.includeSuspended || !formatColumn.IsSuspended);
+        const formatColumns = this.getAllFormatColumnWithStyleAndCellAlignment()
+            .filter((formatColumn) => {
+            // FormatColumn default target is 'cell', so if no target is specified, we assume 'cell'
+            const fcTarget = formatColumn.Target ?? ['cell'];
+            return fcTarget.includes(config.target);
+        })
+            .filter((formatColumn) => config?.includeSuspended || !formatColumn.IsSuspended);
         return this.getFormatColumnWithColumnInScope(formatColumns, column);
     }
     /**
@@ -210,15 +216,20 @@ export class FormatColumnInternalApi extends ApiBase {
      * @param column
      * @param params
      */
-    formatColumnShouldRender(formatColumn, column, rowNode, cellValue) {
+    formatColumnShouldRenderInCell(formatColumn, column, rowNode, cellValue) {
         // suspended is important to be first
         if (formatColumn.IsSuspended) {
             return false;
         }
         const isSummaryNode = this.getGridApi().isSummaryNode(rowNode);
         const isGroupedRowNode = this.getGridApi().isGroupRowNode(rowNode);
-        // For Summary Rows cannot be excluded
-        if (isSummaryNode) {
+        const isGrandTotalRowNode = this.getGridApi().isGrandTotalRowNode(rowNode);
+        if (isGrandTotalRowNode) {
+            if (formatColumn.RowScope?.ExcludeTotalRows) {
+                return false;
+            }
+        }
+        else if (isSummaryNode) {
             if (formatColumn.RowScope?.ExcludeSummaryRows) {
                 return false;
             }
@@ -258,6 +269,22 @@ export class FormatColumnInternalApi extends ApiBase {
         // nothing has passed then return false
         return false;
     }
+    /**
+     * Checks if format column is relevant for a given Column Header
+     *
+     * @param formatColumn
+     * @param column
+     */
+    formatColumnShouldRenderInHeader(formatColumn, column) {
+        if (formatColumn.IsSuspended) {
+            return false;
+        }
+        if (formatColumn.ColumnGroupScope &&
+            !this.getFormatColumnApi().internalApi.formatColumnWithColumnGroupScopeShouldRender(formatColumn, column)) {
+            return false;
+        }
+        return true;
+    }
     evaluatePredicate(formatColumn, predicateDefHandlerContext) {
         return this.getPredicateApi().handleColumnPredicates(formatColumn.Rule?.Predicates, predicateDefHandlerContext, false);
     }
@@ -282,7 +309,7 @@ export class FormatColumnInternalApi extends ApiBase {
      * @param params
      */
     getFormatColumnsRelevantForColumn(formatColumns, column, params) {
-        return formatColumns.filter((formatColumn) => this.formatColumnShouldRender(formatColumn, column, params.node, params.value));
+        return formatColumns.filter((formatColumn) => this.formatColumnShouldRenderInCell(formatColumn, column, params.node, params.value));
     }
     /**
      * Extract from the given FormatColumns the one which is the most relevant  for a given cell (intersection of given AdaptableColumn and RowNode)
@@ -292,7 +319,7 @@ export class FormatColumnInternalApi extends ApiBase {
      * @param params
      */
     getMostRelevantFormatColumnForColumn(formatColumns, column, params) {
-        return formatColumns.find((formatColumn) => this.formatColumnShouldRender(formatColumn, column, params.node, params.value));
+        return formatColumns.find((formatColumn) => this.formatColumnShouldRenderInCell(formatColumn, column, params.node, params.value));
     }
     /**
      * Retrieves all Format Columns which have an Expression

package/src/Api/UserInterfaceApi.d.ts

@@ -46,17 +46,29 @@ export interface UserInterfaceApi {
      * Displays a progress indicator
      * @param config.progressText - text to display in the progress indicator
      * @param config.render - render function for a custom progress indicator (if not using a framework component)
-     * @param config.frameworkComponent - the framework (React/Angular) component to render as progress indicator
+     * @param config.frameworkComponent - the framework (React/Angular/Vue) component to render as progress indicator
+     * @param config.renderMode - how to render the custom component ('content' or 'dialog'). Applies to both render and frameworkComponent.
      * @param config.delay - delay before showing the progress indicator (in milliseconds)
+     * @returns An object with a close method to close the window
      */
-    showProgressIndicator(config: ProgressIndicatorConfig): void;
+    showProgressIndicator(config: ProgressIndicatorConfig): {
+        close: () => void;
+    };
     /**
      * Hides the progress indicator
      */
     hideProgressIndicator(): void;
     /**
-     * Opens window with custom content
-     * @param config
+     * Opens a custom window popup
+     * @param config - The configuration for the custom window
+     * @param config.id - Unique identifier for the custom window
+     * @param config.title - Title of the custom window
+     * @param config.icon - Icon to display in the custom window heading
+     * @param config.render - Render function to display custom content in the window (if not using a framework component)
+     * @param config.frameworkComponent - A React, Angular or Vue Framework component to use for the custom window content
+     * @param config.onFrameworkComponentDestroyed - Callback function to be called when the framework component is destroyed
+     * @param config.renderMode - How to render the custom component ('content' or 'dialog'). Applies to both render and frameworkComponent.
+     * @returns An object with a close method to close the window
      */
     openCustomWindowPopup(config: CustomWindowConfig): {
         close: () => void;

package/src/Redux/ActionsReducers/PopupRedux.js

@@ -318,6 +318,7 @@ export const PopupReducer = (state = initialState, action) => {
                     text: actionTypedAdd.progressIndicatorConfig.text,
                     render: actionTypedAdd.progressIndicatorConfig.render,
                     frameworkComponent: actionTypedAdd.progressIndicatorConfig.frameworkComponent,
+                    renderMode: actionTypedAdd.progressIndicatorConfig.renderMode,
                 },
             };
             return Object.assign({}, state, updatedState);

package/src/Strategy/StyledColumnModule.js

@@ -6,6 +6,7 @@ import { renderStyledColumnStyleSummary } from '../View/StyledColumn/Wizard/Styl
 import ObjectFactory from '../Utilities/ObjectFactory';
 import { StyledColumnBadgePreview } from '../View/StyledColumn/Wizard/StyledColumnWizardStyleSection/Components/StyledColumnBadgePreview';
 import { getObjectTagsViewItems } from '../Utilities/getObjectTagsViewItems';
+import { StyledColumnBadgeSettings } from '../View/StyledColumn/Wizard/StyledColumnWizardStyleSection/Components/StyledColumnBadgeSettings';
 export class StyledColumnModule extends AdaptableModuleBase {
     constructor(api) {
         super(ModuleConstants.StyledColumnModuleId, ModuleConstants.StyledColumnFriendlyName, 'brush', 'StyledColumnPopup', // to change
@@ -143,9 +144,8 @@ export class StyledColumnModule extends AdaptableModuleBase {
                             returnColumnMenuItems.push(...[newGrandientButton, newPercentBarButton, newBadgeButton]);
                             break;
                         case 'text':
-                            returnColumnMenuItems.push(newBadgeButton);
-                            break;
                         case 'textArray':
+                        case 'numberArray':
                             returnColumnMenuItems.push(newBadgeButton);
                             break;
                     }
@@ -188,15 +188,20 @@ export class StyledColumnModule extends AdaptableModuleBase {
         }
         if (styledColumn.BadgeStyle) {
             specificTypeItems.push({
-                name: 'Settings',
+                name: 'Rows',
                 values: [
                     `Data Rows: ${styledColumn.BadgeStyle?.RowScope?.ExcludeDataRows ? 'No' : 'Yes'}`,
                     `Group Rows: ${styledColumn.BadgeStyle?.RowScope?.ExcludeGroupRows ? 'No' : 'Yes'}`,
                     `Summary Rows: ${styledColumn.BadgeStyle?.RowScope?.ExcludeSummaryRows ? 'No' : 'Yes'}`,
+                    `Total Rows: ${styledColumn.BadgeStyle?.RowScope?.ExcludeTotalRows ? 'No' : 'Yes'}`,
                 ],
             });
         }
         if (styledColumn.BadgeStyle) {
+            specificTypeItems.push({
+                name: 'Settings',
+                view: StyledColumnBadgeSettings,
+            });
             specificTypeItems.push({
                 name: 'Preview',
                 view: StyledColumnBadgePreview,

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

@@ -13,6 +13,12 @@ export const getFormatColumnSettingsViewItems = (formatColumn) => {
         if (formatColumn.RowScope.ExcludeSummaryRows) {
             values.push('Exclude Summary Rows');
         }
+        if (formatColumn.RowScope.ExcludeTotalRows) {
+            values.push('Exclude Total Rows');
+        }
+    }
+    if (formatColumn.ColumnGroupScope) {
+        values.push(`Column Groups: ${formatColumn.ColumnGroupScope === 'Both' ? 'Always' : formatColumn.ColumnGroupScope}`);
     }
     return {
         name: 'Settings',

package/src/Utilities/Constants/GeneralConstants.d.ts

@@ -26,6 +26,7 @@ export declare const AG_GRID_SELECTION_COLUMN: string;
 export declare const AG_GRID_PIVOT_COLUMN: string;
 export declare const AG_GRID_PIVOT_GRAND_TOTAL_COLUMN: string;
 export declare const AG_GRID_CHART_WINDOW = "AG Grid Window";
+export declare const AG_GRID_GRAND_TOTAL_ROW_ID = "rowGroupFooter_ROOT_NODE_ID";
 export declare const ADAPTABLE_FDC3_ACTION_COLUMN_FRIENDLY_NAME = "(FDC3ActionColumn)";
 export declare const DEFAULT_DATE_FORMAT_PATTERN = "dd-MM-yyyy";
 export declare const DEFAULT_DATE_FORMAT_PATTERN_WITH_TIME = "dd-MM-yyyy HH:mm:ss";

package/src/Utilities/Constants/GeneralConstants.js

@@ -26,6 +26,7 @@ export const AG_GRID_SELECTION_COLUMN = 'ag-Grid-SelectionColumn';
 export const AG_GRID_PIVOT_COLUMN = 'pivot_';
 export const AG_GRID_PIVOT_GRAND_TOTAL_COLUMN = 'PivotRowTotal_pivot_';
 export const AG_GRID_CHART_WINDOW = 'AG Grid Window';
+export const AG_GRID_GRAND_TOTAL_ROW_ID = 'rowGroupFooter_ROOT_NODE_ID';
 export const ADAPTABLE_FDC3_ACTION_COLUMN_FRIENDLY_NAME = '(FDC3ActionColumn)';
 // FIXME AFL - load this from DateInputOptions
 export const DEFAULT_DATE_FORMAT_PATTERN = 'dd-MM-yyyy';

package/src/Utilities/Helpers/FormatHelper.js

@@ -60,6 +60,9 @@ export function NumberFormatter(input, options = {}, rowNode, column, api) {
     if (options.Floor) {
         n = Math.floor(n);
     }
+    if (options.Empty) {
+        return ' ';
+    }
     let s;
     let digitsToUse;
     if (options.Truncate || options.Ceiling || options.Round || options.Floor) {

package/src/Utilities/getScopeViewItems.js

@@ -14,7 +14,7 @@ export const getScopeViewItems = (scope, api) => {
         values = scope.ColumnTypes;
     }
     return {
-        label: 'Target',
+        label: 'Scope & Target',
         name: 'Target',
         values,
     };

package/src/View/Components/ColumnFilter/utils.js

@@ -14,10 +14,15 @@ dataType) => {
     const inputs = (adaptablePredicateDef?.inputs ?? [])?.map((input) => {
         return input.type;
     });
-    if ((adaptablePredicateDef.id === 'In' || adaptablePredicateDef.id === 'NotIn') &&
-        ['text', 'number', 'date'].includes(dataType)) {
-        // add array type
-        inputs.push(`${dataType}[]`);
+    if (adaptablePredicateDef.id === 'In' || adaptablePredicateDef.id === 'NotIn') {
+        if (['text', 'number', 'date'].includes(dataType)) {
+            // add array type
+            inputs.push(`${dataType}[]`);
+        }
+        if (['text[]', 'number[]'].includes(dataType)) {
+            // add array type
+            inputs.push(dataType);
+        }
     }
     const qlPredicateDef = {
         operator: adaptablePredicateDef.id,

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

@@ -53,8 +53,7 @@ export const AdaptablePopupConfirmation = (props) => {
                 props.showInputBox && (React.createElement(Box, { padding: 2, "data-name": "body" },
                     React.createElement("p", null, "Please enter a comment to confirm"),
                     React.createElement(Input, { marginTop: 2, width: '100%', value: promptText, type: "string", placeholder: "Enter text", onChange: (e) => changeContent(e) }))),
-                React.createElement(Flex, { marginTop: 3, padding: 2, "data-name": "footer" },
-                    React.createElement(SimpleButton, { tone: "error", "data-name": "delete", variant: "raised", disabled: !canConfirm(), onClick: () => onConfirmmForm() }, props.confirmButtonText),
-                    React.createElement("div", { style: { flex: 1 } }),
-                    props.cancelButtonText != null ? (React.createElement(SimpleButton, { "data-name": "cancel", tone: "neutral", variant: "raised", onClick: () => onCancelForm() }, props.cancelButtonText)) : null)))));
+                React.createElement(Flex, { marginTop: 3, padding: 2, "data-name": "footer", justifyContent: "space-between" },
+                    props.cancelButtonText != null ? (React.createElement(SimpleButton, { "data-name": "cancel", tone: "neutral", variant: "raised", onClick: () => onCancelForm() }, props.cancelButtonText)) : (React.createElement("div", null)),
+                    React.createElement(SimpleButton, { tone: "error", "data-name": "delete", variant: "raised", disabled: !canConfirm(), onClick: () => onConfirmmForm() }, props.confirmButtonText))))));
 };

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

@@ -36,8 +36,7 @@ export const AdaptablePopupPrompt = (props) => {
                 })))),
             React.createElement(Input, { autoFocus: true, marginTop: 3, mx: 3, value: promptText, type: "string", placeholder: "Enter text", onChange: (e) => changeContent(e) }),
             React.createElement(Box, { marginTop: 3 },
-                React.createElement(Flex, { padding: 2 },
-                    React.createElement(SimpleButton, { tone: "accent", "data-name": "ok", variant: "raised", disabled: StringExtensions.IsNullOrEmpty(promptText), onClick: () => onConfirmForm() }, "OK"),
-                    React.createElement("div", { style: { flex: 1 } }),
-                    React.createElement(SimpleButton, { tone: "neutral", variant: "raised", onClick: () => onCloseForm(), "data-name": "cancel" }, "Cancel"))))));
+                React.createElement(Flex, { padding: 2, "data-name": "footer", justifyContent: "space-between" },
+                    React.createElement(SimpleButton, { tone: "neutral", variant: "raised", onClick: () => onCloseForm(), "data-name": "cancel" }, "Cancel"),
+                    React.createElement(SimpleButton, { tone: "accent", "data-name": "ok", variant: "raised", disabled: StringExtensions.IsNullOrEmpty(promptText), onClick: () => onConfirmForm() }, "OK"))))));
 };

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

@@ -31,11 +31,7 @@ export const WindowPopups = () => {
         let componentNode = null;
         if (!Component &&
             (windowItem.PopupProps.render || windowItem.PopupProps.frameworkComponent)) {
-            componentNode = (React.createElement(ExternalRenderer
-            // TODO AFL: add configurable width&height for custom popups
-            , { 
-                // TODO AFL: add configurable width&height for custom popups
-                style: { height: '100%' }, render: windowItem.PopupProps.render, frameworkComponent: windowItem.PopupProps.frameworkComponent, onDestroy: windowItem.PopupProps.onFrameworkComponentDestroyed }));
+            componentNode = (React.createElement(ExternalRenderer, { style: { height: '100%' }, render: windowItem.PopupProps.render, frameworkComponent: windowItem.PopupProps.frameworkComponent, onDestroy: windowItem.PopupProps.onFrameworkComponentDestroyed }));
         }
         else {
             Component = Component ?? NoopComponent;

package/src/View/DataChangeHistory/DataChangeHistoryGrid.js

@@ -97,6 +97,7 @@ const buildAdaptableOptions = (mainAdaptableInstance, adaptableContainerId, agGr
                     rowScope: {
                         ExcludeGroupRows: true,
                         ExcludeSummaryRows: true,
+                        ExcludeTotalRows: true,
                     },
                     actionColumnSettings: { suppressMenu: true, suppressMovable: true },
                     actionColumnButton,

package/src/View/Export/Wizard/ReportColumnsWizardSection.js

@@ -28,7 +28,7 @@ export const renderReportColumnsSummary = (report) => {
 };
 export const ReportColumnsWizardSection = (props) => {
     const { api, data } = useOnePageAdaptableWizardContext();
-    return (React.createElement(Flex, { flexDirection: "column", style: { height: '100%' }, padding: 2 },
+    return (React.createElement(Flex, { flexDirection: "column", style: { height: '100%' } },
         React.createElement(Tabs, { m: 2, value: data.ReportColumnScope, onValueChange: (ReportColumnScope) => {
                 const report = {
                     ...data,

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

@@ -20,6 +20,7 @@ import { DEFAULT_DOUBLE_DISPLAY_VALUE, DEFAULT_STRING_DISPLAY_VALUE, } from '../
 import Textarea from '../../../components/Textarea';
 import { ButtonInfo } from '../../Components/Buttons/ButtonInfo';
 import { FormatColumnPlaceholderDocsLink } from '../../../Utilities/Constants/DocumentationLinkConstants';
+import { PIVOT_AGGREGATION_TOTAL_COLUMN_TYPE, PIVOT_ANY_TOTAL_COLUMN_TYPE, PIVOT_COLUMN_TOTAL_COLUMN_TYPE, PIVOT_GRAND_TOTAL_COLUMN_TYPE, } from '../../../AdaptableState/Common/AdaptableColumn';
 const DOLLAR_OPTIONS = {
     FractionDigits: 2,
     FractionSeparator: '.',
@@ -143,6 +144,18 @@ export const getFormatDisplayTypeForScope = (scope, api) => {
         return 'text';
     }
     if ('ColumnTypes' in scope && scope.ColumnTypes.length) {
+        // if a Pivot Total Column Type is specified, we can safely assume that the data type is number
+        const pivotTotalTypes = [
+            PIVOT_ANY_TOTAL_COLUMN_TYPE,
+            PIVOT_GRAND_TOTAL_COLUMN_TYPE,
+            PIVOT_COLUMN_TOTAL_COLUMN_TYPE,
+            PIVOT_AGGREGATION_TOTAL_COLUMN_TYPE,
+        ];
+        // if all column types are pivot total types, we can safely assume that the data type is number
+        if (scope.ColumnTypes.length > 0 &&
+            scope.ColumnTypes.every((type) => pivotTotalTypes.includes(type))) {
+            return 'number';
+        }
         // need to check if all column with this column type has the same data type and return that particular one
         const columns = scope.ColumnTypes.flatMap((columnType) => {
             return api.columnApi.getColumnsByColumnType(columnType);
@@ -295,7 +308,9 @@ const renderNumberFormat = (data, onChange, setFormatOption, scopedCustomFormatt
                         React.createElement(FormRow, { label: "Floor" },
                             React.createElement(CheckBox, { "data-name": "floor-checkbox", checked: data.DisplayFormat.Options.Floor, onChange: (checked) => setFormatOption('Floor', checked) })),
                         React.createElement(FormRow, { label: "Round" },
-                            React.createElement(CheckBox, { "data-name": "round-checkbox", checked: data.DisplayFormat.Options.Round, onChange: (checked) => setFormatOption('Round', checked) })))))),
+                            React.createElement(CheckBox, { "data-name": "round-checkbox", checked: data.DisplayFormat.Options.Round, onChange: (checked) => setFormatOption('Round', checked) })),
+                        React.createElement(FormRow, { label: "Empty" },
+                            React.createElement(CheckBox, { "data-name": "empty-checkbox", checked: data.DisplayFormat.Options.Empty, onChange: (checked) => setFormatOption('Empty', checked) })))))),
         scopedCustomFormatters.length > 0 && (React.createElement(Tabs, { marginTop: 2, keyboardNavigation: false },
             React.createElement(Tabs.Tab, null, "Custom Formats"),
             React.createElement(Tabs.Content, null,