@adaptabletools/adaptable-cjs 20.3.0-canary.2 → 20.3.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adaptabletools/adaptable-cjs",
-  "version": "20.3.0-canary.2",
+  "version": "20.3.0",
   "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/ColumnOptions.d.ts

@@ -57,6 +57,9 @@ export interface BaseColumnHeaderContext extends BaseContext {
      */
     currentLayout: Layout;
 }
+/**
+ * Context for Columns created automatically by AG Grid when grouping
+ */
 export interface AutoGroupColumnHeaderContext extends BaseColumnHeaderContext {
     /**
      * Auto-generated Group Column when GroupDisplayType is `single` column
@@ -71,11 +74,14 @@ export interface AutoGroupColumnHeaderContext extends BaseColumnHeaderContext {
      */
     groupedColumnIds: string[];
 }
+/**
+ * Context for Columns created when Row Grouping
+ */
 export interface RowGroupColumnHeaderContext extends BaseColumnHeaderContext {
     /**
-     * Group Columns - see `TableLayout.RowGroupedColumns` or `PivotLayout.PivotGroupedColumns`
+     * A Row Grouped Column - see `TableLayout.RowGroupedColumns` or `PivotLayout.PivotGroupedColumns`
      */
-    columnType: 'groupColumn';
+    columnType: 'rowGroupColumn';
     /**
      * Technical ID of the Column
      */
@@ -85,6 +91,9 @@ export interface RowGroupColumnHeaderContext extends BaseColumnHeaderContext {
      */
     groupColumnId: string;
 }
+/**
+ * Context for standard Table Layout Columns
+ */
 export interface TableColumnHeaderContext extends BaseColumnHeaderContext {
     /**
      *  Table Column - see `TableLayout.TableColumns`
@@ -99,9 +108,12 @@ export interface TableColumnHeaderContext extends BaseColumnHeaderContext {
      */
     aggregation?: string;
 }
+/**
+ * Context for Column Group headers
+ */
 export interface TableColumnGroupHeaderContext extends BaseColumnHeaderContext {
     /**
-     * Column Group - see https://www.ag-grid.com/javascript-data-grid/column-groups/
+     * Column Group (used when Column Grouping)
      */
     columnType: 'tableColumnGroup';
     /**
@@ -117,9 +129,12 @@ export interface TableColumnGroupHeaderContext extends BaseColumnHeaderContext {
      */
     state: 'expanded' | 'collapsed';
 }
+/**
+ * Context for Pivot Column Groups
+ */
 export interface PivotColumnGroupHeaderContext extends BaseColumnHeaderContext {
     /**
-     * Pivot Column - see `PivotLayout.PivotColumns`
+     * Pivot Column Column - created by `PivotLayout.PivotColumns`
      */
     columnType: 'pivotColumnGroup';
     /**
@@ -135,11 +150,14 @@ export interface PivotColumnGroupHeaderContext extends BaseColumnHeaderContext {
      */
     state: 'expanded' | 'collapsed';
 }
-export interface PivotAggregationColumnHeaderContext extends BaseColumnHeaderContext {
+/**
+ * Context for Pivot Result Columns
+ */
+export interface PivotResultColumnHeaderContext extends BaseColumnHeaderContext {
     /**
-     * Pivot Aggregation Column - see `PivotLayout.PivotAggregationColumns`
+     * Pivot Result Column - intersecton of `PivotLayout.PivotAggregationColumns` and `PivotLayout.PivotColumns`
      */
-    columnType: 'pivotAggregationColumn';
+    columnType: 'pivotResultColumn';
     /**
      * Technical ID of the generated Column
      */
@@ -157,6 +175,9 @@ export interface PivotAggregationColumnHeaderContext extends BaseColumnHeaderCon
      */
     aggregation: string;
 }
+/**
+ * Context for Pivot Grand Total Columns
+ */
 export interface PivotGrandTotalHeaderContext extends BaseColumnHeaderContext {
     /**
      * Pivot Grand Total - see `PivotLayout.PivotGrandTotal`
@@ -171,6 +192,9 @@ export interface PivotGrandTotalHeaderContext extends BaseColumnHeaderContext {
      */
     aggregation: string;
 }
+/**
+ * Context for Pivot Total Columns
+ */
 export interface PivotColumnTotalHeaderContext extends BaseColumnHeaderContext {
     /**
      * Pivot Column Total - see `PivotLayout.PivotColumnTotal`
@@ -189,6 +213,9 @@ export interface PivotColumnTotalHeaderContext extends BaseColumnHeaderContext {
      */
     aggregation: string;
 }
+/**
+ * Context for Pivot Aggregation Totals
+ */
 export interface PivotAggregationTotalHeaderContext extends BaseColumnHeaderContext {
     /**
      * Pivot Aggregation Total Column - see `PivotLayout.PivotAggregationColumns.TotalColumn`
@@ -211,153 +238,10 @@ export interface PivotAggregationTotalHeaderContext extends BaseColumnHeaderCont
      */
     pivotKey: string;
 }
-export type ColumnHeaderContext = TableColumnHeaderContext | TableColumnGroupHeaderContext | AutoGroupColumnHeaderContext | RowGroupColumnHeaderContext | PivotColumnGroupHeaderContext | PivotAggregationColumnHeaderContext | PivotGrandTotalHeaderContext | PivotColumnTotalHeaderContext | PivotAggregationTotalHeaderContext;
-export type ColumnHeaderContextOld = BaseColumnHeaderContext & ({
-    /**
-     * Auto-generated Group Column when GroupDisplayType is `single` column
-     */
-    columnType: 'autoGroupColumn';
-    /**
-     * Technical ID of the Column
-     */
-    columnId: string;
-    /**
-     * IDs of the Columns that are grouped
-     */
-    groupedColumnIds: string[];
-} | {
-    /**
-     * Group Columns - see `TableLayout.RowGroupedColumns` or `PivotLayout.PivotGroupedColumns`
-     */
-    columnType: 'groupColumn';
-    /**
-     * Technical ID of the Column
-     */
-    columnId: string;
-    /**
-     * ID of the grouped Column
-     */
-    groupColumnId: string;
-} | {
-    /**
-     *  Table Column - see `TableLayout.TableColumns`
-     */
-    columnType: 'tableColumn';
-    /**
-     * Technical ID of the Column
-     */
-    columnId: string;
-    /**
-     * Optional Aggregation function of the Column - see `TableLayout.TableAggregationColumns`
-     */
-    aggregation?: string;
-} | {
-    /**
-     * Column Group - see https://www.ag-grid.com/javascript-data-grid/column-groups/
-     */
-    columnType: 'tableColumnGroup';
-    /**
-     * Technical ID of the Column Group - see `ColGroupDef.groupId`
-     */
-    groupId: string;
-    /**
-     * IDs of the Column Group children - see `ColGroupDef.children`
-     */
-    childrenColumnIds: string[];
-    /**
-     * State of the Column Group
-     */
-    state: 'expanded' | 'collapsed';
-} | {
-    /**
-     * Pivot Column - see `PivotLayout.PivotColumns`
-     */
-    columnType: 'pivotColumnGroup';
-    /**
-     * Technical ID of the generated Column Group
-     */
-    groupId: string;
-    /**
-     * Pivot Keys for the current Column Group
-     */
-    pivotKeys: string[];
-    /**
-     * State of the Column Group
-     */
-    state: 'expanded' | 'collapsed';
-} | {
-    /**
-     * Pivot Aggregation Column - see `PivotLayout.PivotAggregationColumns`
-     */
-    columnType: 'pivotAggregationColumn';
-    /**
-     * Technical ID of the generated Column
-     */
-    columnId: string;
-    /**
-     * Current Pivot Keys
-     */
-    pivotKeys: string[];
-    /**
-     * ID of the Aggregated Column - see `PivotLayout.PivotAggregationColumns`
-     */
-    aggregatedColumnId: string;
-    /**
-     *  Aggregation function of the Column - see `PivotLayout.PivotAggregationColumns.AggregationColumnValue`
-     */
-    aggregation: string;
-} | {
-    /**
-     * Pivot Grand Total - see `PivotLayout.PivotGrandTotal`
-     */
-    columnType: 'pivotGrandTotal';
-    /**
-     * ID of the Aggregated Column - see `PivotLayout.PivotAggregationColumns`
-     */
-    aggregatedColumnId: string;
-    /**
-     *  Aggregation function of the Column - see `PivotLayout.PivotAggregationColumns.AggregationColumnValue`
-     */
-    aggregation: string;
-} | {
-    /**
-     * Pivot Column Total - see `PivotLayout.PivotColumnTotal`
-     */
-    columnType: 'pivotColumnTotal';
-    /**
-     * Current Pivot Keys
-     */
-    pivotKey: string;
-    /**
-     * ID of the Pivot Column - see `PivotLayout.PivotColumns`
-     */
-    pivotColumnId: string;
-    /**
-     *  Aggregation function of the Column - see `PivotLayout.PivotAggregationColumns.AggregationColumnValue`
-     */
-    aggregation: string;
-} | {
-    /**
-     * Pivot Aggregation Total Column - see `PivotLayout.PivotAggregationColumns.TotalColumn`
-     */
-    columnType: 'pivotAggregationTotal';
-    /**
-     * ID of the Aggregated Column - see `PivotLayout.PivotAggregationColumns`
-     */
-    aggregatedColumnId: string;
-    /**
-     *  Aggregation function of the Column - see `PivotLayout.PivotAggregationColumns.AggregationColumnValue`
-     */
-    aggregation: string;
-    /**
-     * ID of the Pivot Column - see `PivotLayout.PivotColumns`
-     */
-    pivotColumnId: string;
-    /**
-     * Current Pivot Keys
-     */
-    pivotKey: string;
-});
+/**
+ * Context provided to columnHeader function custom Headers to be provided for any type of AG Grid Column
+ */
+export type ColumnHeaderContext = TableColumnHeaderContext | TableColumnGroupHeaderContext | AutoGroupColumnHeaderContext | RowGroupColumnHeaderContext | PivotColumnGroupHeaderContext | PivotResultColumnHeaderContext | PivotGrandTotalHeaderContext | PivotColumnTotalHeaderContext | PivotAggregationTotalHeaderContext;
 /**
  * Context used when setting a Column Friendly Name
  */

package/src/AdaptableState/Common/CustomWindowConfig.d.ts

@@ -1,51 +1,51 @@
 import { AdaptableSystemIconName } from '../../types';
 import { CustomRenderContext, AdaptableFrameworkComponent } from '../../agGrid/AdaptableFrameworkComponent';
 /**
- * Config used to open a custom window
+ * Config used to open a Custom Window
  */
 export interface CustomWindowConfig {
     /**
-     * Unique identifier for the custom window.
+     * Unique identifier for Custom Window
      */
     id: string;
     /**
-     * Title of the custom window.
+     * Title of Custom Window
      */
     title?: string;
     /**
-     * Icon to display in the custom window heading.
+     * Icon to display in Custom Window header
      */
     icon?: AdaptableSystemIconName;
     /**
-     * Render function to display custom content in the window (if not using a framework component).
+     * Render function to display content in Custom Window(if not using a framework component)
      */
     render?: (customRenderContext: CustomRenderContext) => string | null;
     /**
-     * A React, Angular or Vue Framework component to use for the custom window content.
+     * React, Angular or Vue Framework component to use for Custom Window content
      */
     frameworkComponent?: AdaptableFrameworkComponent;
     /**
-     * Callback function to be called when the framework component is destroyed.
+     * Callback function to be called when the framework component is destroyed
      */
     onFrameworkComponentDestroyed?: () => void;
     /**
-     * Window position in pixels.
+     * Size of window in pixels (provided as width, height)
      */
     size?: WindowSize;
     /**
-     * Position of the window in pixels.
+     * Position of window in pixels (provided as x, y)
      */
     position?: WindowPosition;
 }
 /**
- * Defines size of a custom window
+ * Defines size of a Custom Window
  */
 export interface WindowSize {
     width: number;
     height: number;
 }
 /**
- * Defines position of a custom window
+ * Defines position of a Custom Window
  */
 export interface WindowPosition {
     x: number;

package/src/AdaptableState/Common/ProgressIndicatorConfig.d.ts

@@ -17,10 +17,7 @@ export interface ProgressIndicatorConfig {
      */
     frameworkComponent?: AdaptableFrameworkComponent;
     /**
-     * Determines how the custom component is rendered:
-     * - "content" (default): Inside the default Dialog with spinner
-     * - "dialog": As a complete replacement for the Dialog
-     * Applies to both frameworkComponent and render parameters.
+     * Determines whether custom component is rendered as "content" (inside window) or "dialog" (replacing window)
      */
     renderMode?: 'content' | 'dialog';
     /**

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

@@ -15,7 +15,7 @@ export interface RowScope {
      */
     ExcludeSummaryRows?: boolean;
     /**
-     * Exclude Grand Total Rows
+     * Exclude Grand Total Rows (used in Aggregations)
      */
     ExcludeTotalRows?: boolean;
 }

package/src/AdaptableState/FormatColumnState.d.ts

@@ -26,17 +26,17 @@ export interface FormatColumn extends SuspendableObject {
      */
     Scope: ColumnScope;
     /**
-     * Which part of the Column to apply Format to: `cell`, `column header`
+     * Where in Column to apply Format (`cell` or `columnHeader`)
      *
-     * @defaultValue ['cell']
+     * @defaultValue 'cell'
      */
-    Target?: FormatColumnTarget[];
+    Target?: FormatColumnTarget;
     /**
      * Rule to decide whether to apply Format; if undefined Format is always applied
      */
     Rule?: FormatColumnRule;
     /**
-     * Style to apply
+     * AdapTable Style to apply
      */
     Style?: AdaptableStyle;
     /**
@@ -44,21 +44,21 @@ export interface FormatColumn extends SuspendableObject {
      */
     DisplayFormat?: AdaptableFormat;
     /**
-     * Aligns cells 'Left' or 'Right' or 'Center'
+     * Align cells 'Left' or 'Right' or 'Center'
      */
     CellAlignment?: CellAlignment;
     /**
-     * Which types of Rows should be formatted (data, grouped, summary)
+     * Which types of Rows to apply format (data, grouped, summary, total)
      */
     RowScope?: RowScope;
     /**
-     * When to format Columns in Column Groups ('Expanded', 'Collapsed' or 'Both')
+     * When to format Columns in Column Groups ('Expanded', 'Collapsed', 'Both')
      *
      */
     ColumnGroupScope?: ColumnGroupScope;
 }
 /**
- * Target for Format Column: Specifies which visual elements of the column receive formatting
+ * Specifies whether Column's cells or header is formatted
  */
 export type FormatColumnTarget = 'cell' | 'columnHeader';
 /**

package/src/Api/Internal/ColumnInternalApi.js

@@ -146,7 +146,7 @@ class ColumnInternalApi extends ApiBase_1.ApiBase {
             };
         }
         if (params.column?.getColId().startsWith(`${GeneralConstants_1.AG_GRID_GROUPED_COLUMN}-`)) {
-            const columnType = 'groupColumn';
+            const columnType = 'rowGroupColumn';
             const columnId = params.column.getColId();
             // remove `${AG_GRID_GROUPED_COLUMN}-` from beginning of columnId
             const groupColumnId = columnId.substring(`${GeneralConstants_1.AG_GRID_GROUPED_COLUMN}-`.length);
@@ -266,7 +266,7 @@ class ColumnInternalApi extends ApiBase_1.ApiBase {
                     };
                 }
                 if ((0, ColumnApiImpl_1.isPivotResultColumn)(columnId)) {
-                    const columnType = 'pivotAggregationColumn';
+                    const columnType = 'pivotResultColumn';
                     const pivotValueCol = params.colDef.pivotValueColumn;
                     const aggregatedColumnId = pivotValueCol?.getColId();
                     const currentLayoutAggCols = currentPivotLayout.PivotAggregationColumns?.map((col) => col.ColumnId);

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

@@ -1,4 +1,4 @@
-import { IRowNode } from 'ag-grid-enterprise';
+import { HeaderValueGetterParams, IRowNode } from 'ag-grid-enterprise';
 import { AdaptableColumn, AdaptableFormat, AdaptablePredicateDef, ColumnScope, FormatColumn, FormatColumnTarget, StringFormatterOptions } from '../../types';
 import { ApiBase } from '../Implementation/ApiBase';
 export declare class FormatColumnInternalApi extends ApiBase {
@@ -49,7 +49,8 @@ export declare class FormatColumnInternalApi extends ApiBase {
      * @param config
      * @returns list of FormatColumn
      */
-    getFormatColumnsWithDisplayFormatForColumn(column: AdaptableColumn, config?: {
+    getFormatColumnsWithDisplayFormatForColumn(column: AdaptableColumn, config: {
+        target: FormatColumnTarget;
         includeSuspended?: boolean;
     }): FormatColumn[];
     /**
@@ -129,4 +130,5 @@ export declare class FormatColumnInternalApi extends ApiBase {
      * Retrieves the columns that need rerendering based on format column predicates.
      */
     getFormatColumnColumnsDependentOnColumnChange(column: AdaptableColumn): string[];
+    formatColumnHeaderName(headerName: string, params: HeaderValueGetterParams): string;
 }

package/src/Api/Internal/FormatColumnInternalApi.js

@@ -82,8 +82,8 @@ class FormatColumnInternalApi extends ApiBase_1.ApiBase {
         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);
+            const fcTarget = formatColumn.Target ?? 'cell';
+            return fcTarget === config.target;
         })
             .filter((formatColumn) => config?.includeSuspended || !formatColumn.IsSuspended);
         return this.getFormatColumnWithColumnInScope(formatColumns, column);
@@ -120,7 +120,13 @@ class FormatColumnInternalApi extends ApiBase_1.ApiBase {
      * @returns list of FormatColumn
      */
     getFormatColumnsWithDisplayFormatForColumn(column, config) {
-        const formatColumns = this.getAllFormatColumnWithDisplayFormat().filter((formatColumn) => config?.includeSuspended || !formatColumn.IsSuspended);
+        const formatColumns = this.getAllFormatColumnWithDisplayFormat()
+            .filter((formatColumn) => {
+            // FormatColumn default target is 'cell', so if no target is specified, we assume 'cell'
+            const fcTarget = formatColumn.Target ?? 'cell';
+            return fcTarget === config.target;
+        })
+            .filter((formatColumn) => config?.includeSuspended || !formatColumn.IsSuspended);
         return this.getFormatColumnWithColumnInScope(formatColumns, column);
     }
     /**
@@ -360,5 +366,28 @@ class FormatColumnInternalApi extends ApiBase_1.ApiBase {
         });
         return [...columnsThatNeedRefresh];
     }
+    formatColumnHeaderName(headerName, params) {
+        // currently we only format the header name for normal columns (NOT column groups)
+        if (!params.column) {
+            return headerName;
+        }
+        const abColumn = this.getColumnApi().getColumnWithColumnId(params.column.getColId());
+        const activeFormatColumnsWithDisplayFormat = this.getFormatColumnApi().internalApi.getFormatColumnsWithDisplayFormatForColumn(abColumn, {
+            target: 'columnHeader',
+        });
+        if (!activeFormatColumnsWithDisplayFormat.length) {
+            return headerName;
+        }
+        const mostRelevantFormatColumn = activeFormatColumnsWithDisplayFormat.find((formatColumn) => this.formatColumnShouldRenderInHeader(formatColumn, abColumn));
+        if (!mostRelevantFormatColumn) {
+            return headerName;
+        }
+        if (mostRelevantFormatColumn.DisplayFormat?.Formatter !== 'StringFormatter') {
+            // headers are always strings, so we can only use StringFormatter
+            return headerName;
+        }
+        const formattedHeaderName = this.getFormatColumnApi().internalApi.getStringFormattedValue(headerName, null, abColumn, mostRelevantFormatColumn.DisplayFormat.Options);
+        return formattedHeaderName;
+    }
 }
 exports.FormatColumnInternalApi = FormatColumnInternalApi;

package/src/Strategy/FormatColumnModule.js

@@ -14,6 +14,7 @@ const MoveFormatColumn_1 = require("../View/FormatColumn/MoveFormatColumn");
 const getObjectTagsViewItems_1 = require("../Utilities/getObjectTagsViewItems");
 const getRuleViewItems_1 = require("../Utilities/getRuleViewItems");
 const getScopeViewItems_1 = require("../Utilities/getScopeViewItems");
+const getFormatColumnSettingsTargetItems_1 = require("./Utilities/FormatColumn/getFormatColumnSettingsTargetItems");
 class FormatColumnModule extends AdaptableModuleBase_1.AdaptableModuleBase {
     constructor(api) {
         super(ModuleConstants.FormatColumnModuleId, ModuleConstants.FormatColumnFriendlyName, 'color-palette', 'FormatColumnPopup', 'Create a column style, display format or cell alignment', api);
@@ -86,6 +87,7 @@ class FormatColumnModule extends AdaptableModuleBase_1.AdaptableModuleBase {
             abObject: formatColumn,
             items: [
                 (0, getScopeViewItems_1.getScopeViewItems)(formatColumn.Scope, this.api),
+                (0, getFormatColumnSettingsTargetItems_1.getFormatColumnSettingsTargetItems)(formatColumn),
                 formatColumn.Rule && (0, getRuleViewItems_1.getRuleViewItems)(formatColumn.Rule, this.api),
                 {
                     name: 'Style',

package/src/Strategy/Utilities/FormatColumn/getFormatColumnSettingsTargetItems.d.ts

@@ -0,0 +1,5 @@
+import { FormatColumn } from '../../../AdaptableState/FormatColumnState';
+export declare const getFormatColumnSettingsTargetItems: (formatColumn: FormatColumn) => {
+    name: string;
+    values: string[];
+};

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

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getFormatColumnSettingsTargetItems = void 0;
+const getFormatColumnSettingsTargetItems = (formatColumn) => {
+    if (!formatColumn.Target || formatColumn.Target === 'cell') {
+        return {
+            name: 'Target',
+            values: ['Column Cells'],
+        };
+    }
+    return {
+        name: 'Target',
+        values: ['Column Header'],
+    };
+};
+exports.getFormatColumnSettingsTargetItems = getFormatColumnSettingsTargetItems;

package/src/Utilities/ObjectFactory.js

@@ -256,6 +256,7 @@ function CreateEmptyFormatColumn() {
         DisplayFormat: undefined,
         CellAlignment: undefined,
         RowScope: undefined,
+        Target: 'cell'
     };
 }
 exports.CreateEmptyFormatColumn = CreateEmptyFormatColumn;

package/src/Utilities/getScopeViewItems.js

@@ -1,6 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getScopeViewItems = void 0;
+const tslib_1 = require("tslib");
+const StringExtensions_1 = tslib_1.__importDefault(require("./Extensions/StringExtensions"));
 const getScopeViewItems = (scope, api) => {
     let values = [];
     if ('ColumnIds' in scope && Array.isArray(scope.ColumnIds)) {
@@ -8,7 +10,9 @@ const getScopeViewItems = (scope, api) => {
         values = scope.ColumnIds.map((columnId) => api.columnApi.getFriendlyNameForColumnId(columnId)).filter(Boolean);
     }
     if ('DataTypes' in scope) {
-        values = scope.DataTypes;
+        values = scope.DataTypes.map((d) => {
+            return 'Data Type: ' + StringExtensions_1.default.CapitaliseFirstLetter(d);
+        });
     }
     if ('All' in scope) {
         values = ['All Columns'];
@@ -17,7 +21,7 @@ const getScopeViewItems = (scope, api) => {
         values = scope.ColumnTypes;
     }
     return {
-        label: 'Scope & Target',
+        label: 'Scope',
         name: 'Target',
         values,
     };

package/src/View/Components/NewScopeComponent.js

@@ -14,6 +14,7 @@ const AdaptableFormControlTextClear_1 = require("./Forms/AdaptableFormControlTex
 const AdaptableContext_1 = require("../AdaptableContext");
 const ValueSelector_1 = require("./ValueSelector");
 const AdaptableColumn_1 = require("../../AdaptableState/Common/AdaptableColumn");
+const StringExtensions_1 = tslib_1.__importDefault(require("../../Utilities/Extensions/StringExtensions"));
 const isScopeValid = ({ Scope }) => {
     const result = [];
     if (!Scope) {
@@ -46,6 +47,9 @@ const DATA_TYPES_MAP = {
         value: 'boolean',
     },
 };
+const renderDataTypeLabel = (c) => {
+    return 'DataType: ' + StringExtensions_1.default.CapitaliseFirstLetter(c);
+};
 const renderScopeSummary = (scope, labels) => {
     const adaptable = (0, AdaptableContext_1.useAdaptable)();
     const scopeApi = adaptable.api.columnScopeApi;
@@ -58,7 +62,7 @@ const renderScopeSummary = (scope, labels) => {
             columnsInScope.length ? (React.createElement(ValueSelector_1.ValueOptionsTags, { options: columnsInScope, value: columnsInScope.map((c) => c.columnId), toLabel: (c) => c.friendlyName, allowWrap: true, readOnly: true, renderLabel: (c) => React.createElement(OnePageAdaptableWizard_1.SummaryText, { mb: 0 }, c), toIdentifier: (c) => c.columnId })) : null)) : null),
         React.createElement(rebass_1.Box, null, 'DataTypes' in scope ? (React.createElement(React.Fragment, null,
             React.createElement(rebass_1.Text, { fontSize: 2, mb: 2 }, labels.scopeDataTypes),
-            React.createElement(ValueSelector_1.ValueOptionsTags, { readOnly: true, options: scope.DataTypes, value: scope.DataTypes, toLabel: (c) => c, allowWrap: true, renderLabel: (c) => React.createElement(rebass_1.Text, { fontSize: 2 }, `DataType: ${c}`), toIdentifier: (c) => c }))) : null)));
+            React.createElement(ValueSelector_1.ValueOptionsTags, { readOnly: true, options: scope.DataTypes, value: scope.DataTypes, toLabel: (c) => c, allowWrap: true, renderLabel: (c) => React.createElement(rebass_1.Text, { fontSize: 2 }, renderDataTypeLabel(c)), toIdentifier: (c) => c }))) : null)));
 };
 exports.renderScopeSummary = renderScopeSummary;
 const DATA_TYPES_OPTIONS = Object.values(DATA_TYPES_MAP);

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

@@ -460,6 +460,6 @@ const FormatColumnFormatWizardSection = (props) => {
     return (React.createElement(HelpBlock_1.default, { margin: 3 },
         "Setting a Display Format is only possible if ",
         React.createElement("b", null, "all"),
-        " the columns in Scope are Numeric, String or Date."));
+        " the columns in Scope are Numeric, String or Date"));
 };
 exports.FormatColumnFormatWizardSection = FormatColumnFormatWizardSection;

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

@@ -5,8 +5,12 @@ const tslib_1 = require("tslib");
 const React = tslib_1.__importStar(require("react"));
 const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
 const EntityRulesEditor_1 = require("../../Components/EntityRulesEditor");
+const HelpBlock_1 = tslib_1.__importDefault(require("../../../components/HelpBlock"));
 function FormatColumnRuleWizardSection(props) {
     const { data, api, moduleInfo } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
+    if (data.Target && data.Target === 'columnHeader') {
+        return (React.createElement(HelpBlock_1.default, { margin: 3 }, "Conditions cannot be applied if the Target of the Format Column is Column Header"));
+    }
     return (React.createElement(EntityRulesEditor_1.EntityRulesEditor, { module: moduleInfo.ModuleName, defaultPredicateId: props.defaultPredicateId, 
         // TODO see what is this
         predicateDefs: api.formatColumnApi.internalApi.getFormatColumnDefsForScope(data.Scope), getPredicateDefsForColId: (colId) => api.formatColumnApi.internalApi.getFormatColumnDefsForScope({ ColumnIds: [colId] }), showNoRule: true, showBoolean: true, showAggregation: false, showObservable: false, showQueryBuilder: true, showPredicate: !api.columnScopeApi.scopeIsAll(data.Scope), data: data, onChange: (formatColumn) => props.onChange(formatColumn), descriptions: {