@adaptabletools/adaptable-cjs 22.0.0-canary.12 → 22.0.0-canary.14

package/src/Api/Implementation/GridApiImpl.js

@@ -611,7 +611,6 @@ class GridApiImpl extends ApiBase_1.ApiBase {
     showTransposedView(transposeConfig = {}) {
         const transposedColumnId = transposeConfig.transposedColumnId ?? this.getOptionsApi().getPrimaryKey();
         const hideTransposedColumn = transposeConfig.hideTransposedColumn ?? true;
-        const autosize = transposeConfig.autosize ?? true;
         const columnsToTranspose = transposeConfig.columnsToTranspose;
         const rowsToTranspose = transposeConfig.rowsToTranspose;
         this.getAdaptableInternalApi().showPopupWindow({
@@ -622,7 +621,6 @@ class GridApiImpl extends ApiBase_1.ApiBase {
             popupProps: {
                 transposedColumnId,
                 hideTransposedColumn,
-                autosize,
                 columnsToTranspose,
                 rowsToTranspose,
             },

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

@@ -32,6 +32,6 @@ export declare class ColumnInternalApi extends ApiBase {
     private buildColumnHeaderContext;
     hasArrayDataType(column: AdaptableColumn): boolean;
     getQueryableColumnsForUIEditor(): AdaptableColumn[];
-    isAlwaysHiddenColumn(columnIdentifier: string | ColDef): boolean;
+    isColumnUIHidden(columnIdentifier: string | ColDef): boolean;
     getColumnDateTypes(): AdaptableColumnDataType[];
 }

package/src/Api/Internal/ColumnInternalApi.js

@@ -282,9 +282,11 @@ class ColumnInternalApi extends ApiBase_1.ApiBase {
     getQueryableColumnsForUIEditor() {
         return this.getColumnApi()
             .getQueryableColumns()
-            .filter((column) => !column.isGeneratedPivotResultColumn && !column.isGeneratedRowGroupColumn && !column.isGeneratedSelectionColumn);
+            .filter((column) => !column.isGeneratedPivotResultColumn &&
+            !column.isGeneratedRowGroupColumn &&
+            !column.isGeneratedSelectionColumn);
     }
-    isAlwaysHiddenColumn(columnIdentifier) {
+    isColumnUIHidden(columnIdentifier) {
         return this.getColumnApi().hasColumnType(columnIdentifier, AdaptableColumn_1.HIDDEN_COLUMN_TYPE);
     }
     getColumnDateTypes() {

package/src/Strategy/FormatColumnModule.js

@@ -13,7 +13,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");
+const getFormatColumnRowTargetItems_1 = require("./Utilities/FormatColumn/getFormatColumnRowTargetItems");
 const FormatColumnStyleWizardSection_1 = require("../View/FormatColumn/Wizard/FormatColumnStyleWizardSection");
 class FormatColumnModule extends AdaptableModuleBase_1.AdaptableModuleBase {
     constructor(api) {
@@ -91,7 +91,7 @@ class FormatColumnModule extends AdaptableModuleBase_1.AdaptableModuleBase {
                     values: [formatColumn.Name],
                 },
                 (0, getScopeViewItems_1.getScopeViewItems)(formatColumn.Scope, this.api),
-                (0, getFormatColumnSettingsTargetItems_1.getFormatColumnSettingsTargetItems)(formatColumn),
+                (0, getFormatColumnRowTargetItems_1.getFormatColumnRowTargetItems)(formatColumn),
                 formatColumn.Rule && (0, getRuleViewItems_1.getRuleViewItems)(formatColumn.Rule, this.api),
                 {
                     name: 'Style',

package/src/Strategy/StyledColumnModule.js

@@ -191,14 +191,22 @@ class StyledColumnModule extends AdaptableModuleBase_1.AdaptableModuleBase {
             });
         }
         if (styledColumn.BadgeStyle) {
+            let rowTypes = [];
+            if (!styledColumn.BadgeStyle?.RowScope?.ExcludeDataRows) {
+                rowTypes.push('Data');
+            }
+            if (!styledColumn.BadgeStyle?.RowScope?.ExcludeGroupRows) {
+                rowTypes.push('Group');
+            }
+            if (!styledColumn.BadgeStyle?.RowScope?.ExcludeSummaryRows) {
+                rowTypes.push('Summary');
+            }
+            if (!styledColumn.BadgeStyle?.RowScope?.ExcludeTotalRows) {
+                rowTypes.push('Total');
+            }
             specificTypeItems.push({
                 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'}`,
-                ],
+                values: rowTypes
             });
         }
         if (styledColumn.BadgeStyle) {

package/src/Strategy/Utilities/FormatColumn/{getFormatColumnSettingsTargetItems.d.ts → getFormatColumnRowTargetItems.d.ts}

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

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

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getFormatColumnRowTargetItems = void 0;
+const getFormatColumnRowTargetItems = (formatColumn) => {
+    let values = [];
+    if (formatColumn.RowScope) {
+        if (!formatColumn.RowScope.ExcludeDataRows) {
+            values.push('Data');
+        }
+        if (!formatColumn.RowScope.ExcludeGroupRows) {
+            values.push('Group');
+        }
+        if (!formatColumn.RowScope.ExcludeSummaryRows) {
+            values.push('Summary');
+        }
+        if (!formatColumn.RowScope.ExcludeTotalRows) {
+            values.push('Total');
+        }
+    }
+    values = values.filter(Boolean);
+    return {
+        name: 'Rows',
+        values: values.length > 0 ? values : ['-'],
+    };
+};
+exports.getFormatColumnRowTargetItems = getFormatColumnRowTargetItems;

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

@@ -3,19 +3,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.getFormatColumnSettingsViewItems = void 0;
 const getFormatColumnSettingsViewItems = (formatColumn) => {
     let values = [];
-    if (formatColumn.RowScope) {
-        if (formatColumn.RowScope.ExcludeDataRows) {
-            values.push('Exclude Data Rows');
-        }
-        if (formatColumn.RowScope.ExcludeGroupRows) {
-            values.push('Exclude Group Rows');
-        }
-        if (formatColumn.RowScope.ExcludeSummaryRows) {
-            values.push('Exclude Summary Rows');
-        }
-        if (formatColumn.RowScope.ExcludeTotalRows) {
-            values.push('Exclude Total Rows');
-        }
+    if (!formatColumn.Target || formatColumn.Target === 'cell') {
+        values.push('Target: Column Cells');
+    }
+    else {
+        values.push('Target: Column Header');
     }
     if (formatColumn.ColumnGroupScope) {
         values.push(`Column Groups: ${formatColumn.ColumnGroupScope === 'Both' ? 'Always' : formatColumn.ColumnGroupScope}`);

package/src/Utilities/ExpressionFunctions/aggregatedScalarExpressionFunctions.js

@@ -454,7 +454,7 @@ exports.aggregatedScalarExpressionFunctions = {
         handler(args, context) {
             const distinctColumnParameter = (0, expressionFunctionUtils_1.extractColumnParameter)('ONLY', args);
             const onlyColumnName = distinctColumnParameter.value;
-            const columnType = (0, expressionFunctionUtils_1.validateColumnType)(onlyColumnName, ['number'], 'ONLY', context.adaptableApi);
+            const columnType = (0, expressionFunctionUtils_1.validateColumnType)(onlyColumnName, ['number', 'text'], 'ONLY', context.adaptableApi);
             const groupByParameter = (0, expressionFunctionUtils_1.extractParameter)('ONLY', 'operand', ['GROUP_BY'], args, {
                 isOptional: true,
             });

package/src/Utilities/getScopeViewItems.js

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

package/src/Utilities/only.d.ts

@@ -0,0 +1,15 @@
+import { IAggFuncParams } from 'ag-grid-enterprise';
+interface OnlyAggResult {
+    distinctValues: Set<number | string>;
+    value: number | string | null;
+    toString(): string;
+}
+/**
+ * AG Grid aggFunc that returns the column value only when all rows in the group
+ * share the same value. Returns null when values differ (or when there are no values).
+ *
+ * Supports multiple group levels: leaf groups aggregate raw cell values while
+ * parent groups merge the metadata objects returned by child groups.
+ */
+export declare const only: (params: IAggFuncParams, columnId: string) => OnlyAggResult;
+export {};

package/src/Utilities/only.js

@@ -0,0 +1,58 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.only = void 0;
+function createOnlyResult(distinctValues) {
+    const value = distinctValues.size === 1 ? distinctValues.values().next().value : null;
+    return {
+        distinctValues,
+        value,
+        toString() {
+            return value != null ? String(value) : '';
+        },
+    };
+}
+/**
+ * AG Grid aggFunc that returns the column value only when all rows in the group
+ * share the same value. Returns null when values differ (or when there are no values).
+ *
+ * Supports multiple group levels: leaf groups aggregate raw cell values while
+ * parent groups merge the metadata objects returned by child groups.
+ */
+const only = (params, columnId) => {
+    const { api: gridApi, rowNode: groupRowNode, values } = params;
+    // Leaf group: the lowest-level group whose children are actual data rows.
+    // We read raw cell values and collect distinct ones, bailing out early
+    // as soon as we see a second distinct value (the result would be null anyway).
+    if (groupRowNode.leafGroup) {
+        const filteredOnly = !gridApi.getGridOption('suppressAggFilteredOnly');
+        const childNodes = (filteredOnly ? groupRowNode.childrenAfterFilter : groupRowNode.childrenAfterGroup) ?? [];
+        const distinctValues = new Set();
+        for (const rowNode of childNodes) {
+            const rawValue = gridApi.getCellValue({ colKey: columnId, rowNode });
+            if (typeof rawValue === 'number' || typeof rawValue === 'string') {
+                distinctValues.add(rawValue);
+                if (distinctValues.size > 1) {
+                    return createOnlyResult(distinctValues);
+                }
+            }
+        }
+        return createOnlyResult(distinctValues);
+    }
+    // Non-leaf group: children are other groups, not data rows.
+    // AG Grid has already called this aggFunc on each child group, so
+    // `params.values` contains the OnlyAggResult objects they returned.
+    // We merge their distinctValues sets instead of re-traversing leaf rows.
+    const mergedDistinctValues = new Set();
+    for (const childResult of values) {
+        if (childResult && typeof childResult === 'object' && 'distinctValues' in childResult) {
+            for (const val of childResult.distinctValues) {
+                mergedDistinctValues.add(val);
+                if (mergedDistinctValues.size > 1) {
+                    return createOnlyResult(mergedDistinctValues);
+                }
+            }
+        }
+    }
+    return createOnlyResult(mergedDistinctValues);
+};
+exports.only = only;

package/src/View/Components/ValueSelector/index.js

@@ -164,7 +164,12 @@ const renderSelectionSection = (props) => {
     const { value, options, disabled, singleSelect, toLabel, toIdentifier, } = props;
     const selectionBox = (React.createElement(Flex_1.Box, { className: "twa:flex twa:flex-col twa:gap-2 twa:py-2" },
         React.createElement(Flex_1.Box, { className: (0, clsx_1.default)('twa:flex twa:flex-row', 'twa:border-b twa:border-primarydark/30 twa:rounded-standard') },
-            React.createElement(CheckBox_1.CheckBox, { className: "twa:ml-0.5 twa:font-bold", checked: !value.length ? false : value.length === options.length ? true : null, onChange: (checked) => {
+            singleSelect ? (React.createElement(Flex_1.Box, { className: "twa:flex twa:flex-row twa:text-3 twa:font-normal" },
+                "(",
+                value.length,
+                " of ",
+                options.length,
+                " selected)")) : (React.createElement(CheckBox_1.CheckBox, { className: "twa:ml-0.5 twa:font-bold", checked: !value.length ? false : value.length === options.length ? true : null, onChange: (checked) => {
                     if (checked) {
                         props.onSelectAll();
                     }
@@ -179,7 +184,7 @@ const renderSelectionSection = (props) => {
                         value.length,
                         " of ",
                         options.length,
-                        " selected)"))),
+                        " selected)")))),
             React.createElement("div", { className: "twa:flex-1" }),
             React.createElement(Flex_1.Box, { className: "twa:mr-2 twa:text-2 twa:font-normal" }, props.showOnlySelectedCheckbox))));
     return React.createElement(Flex_1.Box, { className: (0, clsx_1.default)(`${baseClassName}__header `) }, selectionBox);

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

@@ -39,6 +39,14 @@ const NewReportWizard = (props) => {
         props.onFinishWizard(report);
     };
     return (React.createElement(OnePageAdaptableWizard_1.OnePageAdaptableWizard, { defaultCurrentSectionName: props.defaultCurrentSectionName, moduleInfo: props.moduleInfo, data: report, onHide: props.onCloseWizard, onFinish: handleFinish, sections: [
+            {
+                title: 'Name',
+                details: 'Enter the name of the Report',
+                isValid: ReportNameWizardSection_1.isValidReportName,
+                renderSummary: ReportNameWizardSection_1.renderReportNameSummary,
+                render: () => (React.createElement(Flex_1.Box, { className: "twa:p-2" },
+                    React.createElement(ReportNameWizardSection_1.ReportNameWizardSection, { onChange: setReport }))),
+            },
             {
                 title: 'Columns',
                 details: 'Choose the Columns you want to include in the Report',
@@ -52,14 +60,6 @@ const NewReportWizard = (props) => {
                 renderSummary: ReportRowsWizardSection_1.renderReportRowsSummary,
                 render: () => React.createElement(ReportRowsWizardSection_1.ReportRowsWizardSection, { onChange: setReport }),
             },
-            {
-                title: 'Name',
-                details: 'Enter the name of the Report',
-                isValid: ReportNameWizardSection_1.isValidReportName,
-                renderSummary: ReportNameWizardSection_1.renderReportNameSummary,
-                render: () => (React.createElement(Flex_1.Box, { className: "twa:p-2" },
-                    React.createElement(ReportNameWizardSection_1.ReportNameWizardSection, { onChange: setReport }))),
-            },
             {
                 details: 'Select Report Tags',
                 title: 'Tags',

package/src/View/FlashingCell/Wizard/FlashingCellSettingsWizardSection.js

@@ -86,15 +86,12 @@ const FlashingAlertSettingsWizardSection = (props) => {
             React.createElement(Tabs_1.Tabs.Content, null,
                 React.createElement(FormLayout_1.default, null,
                     React.createElement(FormLayout_1.FormRow, { label: "Name" },
-                        React.createElement(Input_1.default, { "data-name": "flashing-cell-name", className: "twa:flex-1 twa:mr-3", onChange: handleNameChange, placeholder: "Enter Name", value: flashingCell.Name ?? '' })),
-                    React.createElement(FormLayout_1.FormRow, { label: "Flash Target" },
-                        React.createElement(CheckBox_1.CheckBox, { "data-name": "flashing-target", onChange: (checked) => handleTargetChange('cell', checked), className: "twa:mr-3", checked: flashingCell?.FlashTarget === 'cell' ||
-                                flashingCell?.FlashTarget?.includes?.('cell'), tabIndex: -1 }, "Cell"),
-                        React.createElement(CheckBox_1.CheckBox, { "data-name": "flashing-target-row", className: "twa:mr-3", onChange: (checked) => handleTargetChange('row', checked), checked: flashingCell?.FlashTarget === 'row' ||
-                                flashingCell?.FlashTarget?.includes?.('row'), tabIndex: -1 }, "Row"),
-                        React.createElement(CheckBox_1.CheckBox, { "data-name": "flashing-target-aggFuncCell", onChange: (checked) => handleTargetChange('aggFuncCell', checked), checked: flashingCell?.FlashTarget === 'aggFuncCell' ||
-                                flashingCell?.FlashTarget?.includes?.('aggFuncCell'), tabIndex: -1 }, "Aggregated Function Cell")),
-                    React.createElement(FormLayout_1.FormRow, { label: "Duration" },
+                        React.createElement(Input_1.default, { "data-name": "flashing-cell-name", className: "twa:flex-1 twa:mr-3", onChange: handleNameChange, placeholder: "Enter Name", value: flashingCell.Name ?? '' }))))),
+        React.createElement(Tabs_1.Tabs, { autoFocus: false, className: "twa:p-2" },
+            React.createElement(Tabs_1.Tabs.Tab, null, "Flash Duration"),
+            React.createElement(Tabs_1.Tabs.Content, null,
+                React.createElement(FormLayout_1.default, null,
+                    React.createElement(FormLayout_1.FormRow, { label: "" },
                         React.createElement(Flex_1.Flex, { alignItems: "center" },
                             React.createElement(CheckBox_1.CheckBox, { "data-name": "duration-always", checked: duration === 'always', onChange: (checked) => handleTypeChange(checked ? 'always' : 'number'), className: "twa:mr-4", tabIndex: -1 }, "Always"),
                             duration !== 'always' && (React.createElement(React.Fragment, null,
@@ -102,6 +99,18 @@ const FlashingAlertSettingsWizardSection = (props) => {
                                         const value = event.target.value;
                                         setDuration(isNaN(Number(value)) ? 500 : Number(value));
                                     } }),
-                                React.createElement(Flex_1.Box, { className: "twa:text-2" }, "ms"))))))))));
+                                React.createElement(Flex_1.Box, { className: "twa:text-2" }, "ms")))))))),
+        ' ',
+        React.createElement(Tabs_1.Tabs, { autoFocus: false, className: "twa:p-2" },
+            React.createElement(Tabs_1.Tabs.Tab, null, "Flash Target"),
+            React.createElement(Tabs_1.Tabs.Content, null,
+                React.createElement(FormLayout_1.default, null,
+                    React.createElement(FormLayout_1.FormRow, { label: "" },
+                        React.createElement(CheckBox_1.CheckBox, { "data-name": "flashing-target", onChange: (checked) => handleTargetChange('cell', checked), className: "twa:mr-3", checked: flashingCell?.FlashTarget === 'cell' ||
+                                flashingCell?.FlashTarget?.includes?.('cell'), tabIndex: -1 }, "Cell"),
+                        React.createElement(CheckBox_1.CheckBox, { "data-name": "flashing-target-row", className: "twa:mr-3", onChange: (checked) => handleTargetChange('row', checked), checked: flashingCell?.FlashTarget === 'row' ||
+                                flashingCell?.FlashTarget?.includes?.('row'), tabIndex: -1 }, "Row"),
+                        React.createElement(CheckBox_1.CheckBox, { "data-name": "flashing-target-aggFuncCell", onChange: (checked) => handleTargetChange('aggFuncCell', checked), checked: flashingCell?.FlashTarget === 'aggFuncCell' ||
+                                flashingCell?.FlashTarget?.includes?.('aggFuncCell'), tabIndex: -1 }, "Aggregated Function Cell")))))));
 };
 exports.FlashingAlertSettingsWizardSection = FlashingAlertSettingsWizardSection;

package/src/View/FlashingCell/Wizard/FlashingCellWizard.js

@@ -77,7 +77,7 @@ const FlashingCellWizard = (props) => {
                 isValid: NewScopeComponent_1.isScopeValid,
                 render: () => React.createElement(FlashingCellScopeWizardSection_1.FlashingAlertScopeWizardSection, { onChange: setFlashingCell }),
                 renderSummary: BaseAlertScopeWizardSection_1.renderScopeSummary,
-                title: 'Scope',
+                title: 'Columns',
             },
             {
                 details: 'Build the Rules for when Cells should Flash',

package/src/View/FormatColumn/Wizard/FormatColumnRowScopeWizardSection.d.ts

@@ -0,0 +1,8 @@
+import * as React from 'react';
+import { FormatColumn } from '../../../AdaptableState/FormatColumnState';
+type FormatColumnRowScopeWizardSectionProps = {
+    onChange: (data: FormatColumn) => void;
+};
+export declare const renderFormatColumnRowScopeSummary: (data: FormatColumn) => React.JSX.Element;
+export declare const FormatColumnRowScopeWizardSection: (props: FormatColumnRowScopeWizardSectionProps) => React.JSX.Element;
+export {};

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

@@ -0,0 +1,86 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FormatColumnRowScopeWizardSection = exports.renderFormatColumnRowScopeSummary = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const FormLayout_1 = tslib_1.__importStar(require("../../../components/FormLayout"));
+const CheckBox_1 = require("../../../components/CheckBox");
+const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
+const Tag_1 = require("../../../components/Tag");
+const Flex_1 = require("../../../components/Flex");
+const Tabs_1 = require("../../../components/Tabs");
+const renderFormatColumnRowScopeSummary = (data) => {
+    return (React.createElement(Flex_1.Box, { className: "twa:p-2" },
+        React.createElement(Flex_1.Box, { className: "twa:mt-3" },
+            "Data Rows ",
+            React.createElement(Tag_1.Tag, null, data.RowScope?.ExcludeDataRows ? 'no' : 'yes')),
+        ' ',
+        React.createElement(Flex_1.Box, { className: "twa:mt-3" },
+            "Group Rows ",
+            React.createElement(Tag_1.Tag, null, data.RowScope?.ExcludeGroupRows ? 'no' : 'yes')),
+        React.createElement(Flex_1.Box, { className: "twa:mt-3" },
+            "Summary Rows ",
+            React.createElement(Tag_1.Tag, null, data.RowScope?.ExcludeSummaryRows ? 'no' : 'yes')),
+        React.createElement(Flex_1.Box, { className: "twa:mt-3" },
+            "Total Rows ",
+            React.createElement(Tag_1.Tag, null, data.RowScope?.ExcludeTotalRows ? 'no' : 'yes'))));
+};
+exports.renderFormatColumnRowScopeSummary = renderFormatColumnRowScopeSummary;
+const FormatColumnRowScopeWizardSection = (props) => {
+    const { data } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
+    const onExcludeDataRowsChanged = (includeDataRows) => {
+        props.onChange({
+            ...data,
+            RowScope: {
+                ...data.RowScope,
+                ExcludeDataRows: !includeDataRows,
+            },
+        });
+    };
+    const onExcludeGroupedRowsChanged = (includeGroupedRows) => {
+        props.onChange({
+            ...data,
+            RowScope: {
+                ...data.RowScope,
+                ExcludeGroupRows: !includeGroupedRows,
+            },
+        });
+    };
+    const onExcludeSummaryRowsChanged = (includeSummaryRows) => {
+        props.onChange({
+            ...data,
+            RowScope: {
+                ...data.RowScope,
+                ExcludeSummaryRows: !includeSummaryRows,
+            },
+        });
+    };
+    const onExcludeTotalRowsChanged = (includeTotalRows) => {
+        props.onChange({
+            ...data,
+            RowScope: {
+                ...data.RowScope,
+                ExcludeTotalRows: !includeTotalRows,
+            },
+        });
+    };
+    return (React.createElement(Flex_1.Flex, { flexDirection: "column", style: { height: '100%' } },
+        React.createElement(Tabs_1.Tabs, { className: "twa:mb-3" },
+            React.createElement(Tabs_1.Tabs.Tab, null, "Row Types"),
+            React.createElement(Tabs_1.Tabs.Content, null,
+                React.createElement(Flex_1.Flex, { flexDirection: "row" },
+                    React.createElement(FormLayout_1.default, null, data.Target === 'cell' && (React.createElement(React.Fragment, null,
+                        React.createElement(FormLayout_1.FormRow, { label: "Data (leaf) Rows:" },
+                            React.createElement(Flex_1.Flex, { alignItems: "center", className: "twa:ml-2" },
+                                React.createElement(CheckBox_1.CheckBox, { "data-name": "include-data-rows-checkbox", checked: !data.RowScope?.ExcludeDataRows, onChange: onExcludeDataRowsChanged, className: "twa:mr-2" }))),
+                        React.createElement(FormLayout_1.FormRow, { label: "Group Rows:" },
+                            React.createElement(Flex_1.Flex, { alignItems: "center", className: "twa:ml-2" },
+                                React.createElement(CheckBox_1.CheckBox, { "data-name": "include-grouped-rows-checkbox", checked: !data.RowScope?.ExcludeGroupRows, onChange: onExcludeGroupedRowsChanged, className: "twa:mr-2" }))),
+                        React.createElement(FormLayout_1.FormRow, { label: "Summary Rows:" },
+                            React.createElement(Flex_1.Flex, { alignItems: "center", className: "twa:ml-2" },
+                                React.createElement(CheckBox_1.CheckBox, { "data-name": "include-summary-rows-checkbox", checked: !data.RowScope?.ExcludeSummaryRows, onChange: onExcludeSummaryRowsChanged, className: "twa:mr-2" }))),
+                        React.createElement(FormLayout_1.FormRow, { label: "Total Rows:" },
+                            React.createElement(Flex_1.Flex, { alignItems: "center", className: "twa:ml-2" },
+                                React.createElement(CheckBox_1.CheckBox, { "data-name": "include-total-rows-checkbox", checked: !data.RowScope?.ExcludeTotalRows, onChange: onExcludeTotalRowsChanged, className: "twa:mr-2" })))))))))));
+};
+exports.FormatColumnRowScopeWizardSection = FormatColumnRowScopeWizardSection;

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

@@ -4,31 +4,23 @@ exports.FormatColumnSettingsWizardSection = exports.renderFormatColumnSettingsSu
 const tslib_1 = require("tslib");
 const React = tslib_1.__importStar(require("react"));
 const FormLayout_1 = tslib_1.__importStar(require("../../../components/FormLayout"));
-const CheckBox_1 = require("../../../components/CheckBox");
 const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
 const Tag_1 = require("../../../components/Tag");
 const Radio_1 = tslib_1.__importStar(require("../../../components/Radio"));
 const Flex_1 = require("../../../components/Flex");
 const Tabs_1 = require("../../../components/Tabs");
 const Input_1 = tslib_1.__importDefault(require("../../../components/Input"));
+const TypeRadio_1 = require("../../Wizard/TypeRadio");
 const renderFormatColumnSettingsSummary = (data) => {
     return (React.createElement(Flex_1.Box, { className: "twa:p-2" },
         React.createElement(Flex_1.Box, { className: "twa:mt-3" },
             "Name ",
             React.createElement(Tag_1.Tag, null, data.Name)),
         React.createElement(Flex_1.Box, { className: "twa:mt-3" },
-            "Data Rows ",
-            React.createElement(Tag_1.Tag, null, data.RowScope?.ExcludeDataRows ? 'no' : 'yes')),
+            "Target",
+            ' ',
+            React.createElement(Tag_1.Tag, null, !data.Target || data.Target === 'cell' ? 'Column Cells' : 'Column Header')),
         ' ',
-        React.createElement(Flex_1.Box, { className: "twa:mt-3" },
-            "Group Rows ",
-            React.createElement(Tag_1.Tag, null, data.RowScope?.ExcludeGroupRows ? 'no' : 'yes')),
-        React.createElement(Flex_1.Box, { className: "twa:mt-3" },
-            "Summary Rows ",
-            React.createElement(Tag_1.Tag, null, data.RowScope?.ExcludeSummaryRows ? 'no' : 'yes')),
-        React.createElement(Flex_1.Box, { className: "twa:mt-3" },
-            "Total Rows ",
-            React.createElement(Tag_1.Tag, null, data.RowScope?.ExcludeTotalRows ? 'no' : 'yes')),
         React.createElement(Flex_1.Box, { className: "twa:mt-3" },
             "Apply on Column Groups:",
             ' ',
@@ -38,49 +30,22 @@ const renderFormatColumnSettingsSummary = (data) => {
 };
 exports.renderFormatColumnSettingsSummary = renderFormatColumnSettingsSummary;
 const FormatColumnSettingsWizardSection = (props) => {
-    const { data } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
-    const onNameChange = (event) => {
-        props.onChange({
-            ...data,
-            Name: event.target.value,
-        });
-    };
-    const onExcludeDataRowsChanged = (ExcludeDataRows) => {
-        props.onChange({
-            ...data,
-            RowScope: {
-                ...data.RowScope,
-                ExcludeDataRows,
-            },
-        });
-    };
-    const onExcludeGroupedRowsChanged = (ExcludeGroupedRows) => {
+    const { data, api } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
+    const currentTarget = data.Target ? data.Target : 'cell';
+    const handleTargetChange = (target) => {
+        // Update the formatColumn object
         props.onChange({
             ...data,
-            RowScope: {
-                ...data.RowScope,
-                ExcludeGroupRows: ExcludeGroupedRows,
-            },
+            Target: target,
         });
     };
-    const onExcludeSummaryRowsChanged = (ExcludeSummaryRows) => {
-        props.onChange({
-            ...data,
-            RowScope: {
-                ...data.RowScope,
-                ExcludeSummaryRows,
-            },
-        });
-    };
-    const onExcludeTotalRowsChanged = (ExcludeTotalRows) => {
+    const onNameChange = (event) => {
         props.onChange({
             ...data,
-            RowScope: {
-                ...data.RowScope,
-                ExcludeTotalRows,
-            },
+            Name: event.target.value,
         });
     };
+    const behaviourSpellingVariant = api.internalApi.getCorrectEnglishVariant('Behaviour');
     return (React.createElement(Flex_1.Flex, { flexDirection: "column", style: { height: '100%' } },
         React.createElement(Tabs_1.Tabs, { className: "twa:mb-3" },
             React.createElement(Tabs_1.Tabs.Tab, null, "Settings"),
@@ -89,24 +54,20 @@ const FormatColumnSettingsWizardSection = (props) => {
                     React.createElement(FormLayout_1.default, { className: "twa:max-w-[300px] twa:w-full" },
                         React.createElement(FormLayout_1.FormRow, { label: "Name" },
                             React.createElement(Input_1.default, { className: "twa:w-full", "data-name": "format-column-name", onChange: onNameChange, value: data?.Name ?? '' })))))),
+        React.createElement(Tabs_1.Tabs, { className: "twa:mb-3" },
+            React.createElement(Tabs_1.Tabs.Tab, null, "Target"),
+            React.createElement(Tabs_1.Tabs.Content, null,
+                React.createElement(Flex_1.Flex, { flexDirection: "column" },
+                    React.createElement(TypeRadio_1.TypeRadio, { "data-name": "target-column-cell", text: 'Column Cells', description: "Column Cells are styled and formatted", checked: currentTarget === 'cell', onClick: () => handleTargetChange('cell') }),
+                    React.createElement(TypeRadio_1.TypeRadio, { "data-name": "target-column-header", text: 'Column Header', description: "The Column Header is styled (Note: Conditions are not available for Column Headers)", checked: currentTarget === 'columnHeader', onClick: () => handleTargetChange('columnHeader') })))),
         React.createElement(Tabs_1.Tabs, null,
-            React.createElement(Tabs_1.Tabs.Tab, null, "Configuration"),
+            React.createElement(Tabs_1.Tabs.Tab, null,
+                "Column Group ",
+                behaviourSpellingVariant,
+                " "),
             React.createElement(Tabs_1.Tabs.Content, null,
                 React.createElement(Flex_1.Flex, { flexDirection: "row" },
                     React.createElement(FormLayout_1.default, null,
-                        data.Target === 'cell' && (React.createElement(React.Fragment, null,
-                            React.createElement(FormLayout_1.FormRow, { label: "Exclude Data Rows:" },
-                                React.createElement(Flex_1.Flex, { alignItems: "center", className: "twa:ml-2" },
-                                    React.createElement(CheckBox_1.CheckBox, { "data-name": "exclude-data-rows-checkbox", checked: data.RowScope?.ExcludeDataRows, onChange: onExcludeDataRowsChanged, className: "twa:mr-2" }))),
-                            React.createElement(FormLayout_1.FormRow, { label: "Exclude Group Rows:" },
-                                React.createElement(Flex_1.Flex, { alignItems: "center", className: "twa:ml-2" },
-                                    React.createElement(CheckBox_1.CheckBox, { "data-name": "exclude-grouped-rows-checkbox", checked: data.RowScope?.ExcludeGroupRows, onChange: onExcludeGroupedRowsChanged, className: "twa:mr-2" }))),
-                            React.createElement(FormLayout_1.FormRow, { label: "Exclude Row Summaries:" },
-                                React.createElement(Flex_1.Flex, { alignItems: "center", className: "twa:ml-2" },
-                                    React.createElement(CheckBox_1.CheckBox, { "data-name": "exclude-summary-rows-checkbox", checked: data.RowScope?.ExcludeSummaryRows, onChange: onExcludeSummaryRowsChanged, className: "twa:mr-2" }))),
-                            React.createElement(FormLayout_1.FormRow, { label: "Exclude Total Rows:" },
-                                React.createElement(Flex_1.Flex, { alignItems: "center", className: "twa:ml-2" },
-                                    React.createElement(CheckBox_1.CheckBox, { "data-name": "exclude-total-rows-checkbox", checked: data.RowScope?.ExcludeTotalRows, onChange: onExcludeTotalRowsChanged, className: "twa:mr-2" }))))),
                         React.createElement(FormLayout_1.FormRow, { label: "Apply on Column Group:" },
                             React.createElement(Radio_1.RadioGroup, { value: data.ColumnGroupScope || 'Both', name: "columnGroupScope", orientation: "horizontal", onRadioChange: (columnGroupScope) => {
                                     props.onChange({