@adaptabletools/adaptable 12.1.3 → 12.1.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adaptabletools/adaptable",
-  "version": "12.1.3",
+  "version": "12.1.4",
   "description": "Powerful data-agnostic HTML5 datagrid add-on that sits on top of an underlying grid component and provides all the rich functionality that advanced users expect from their DataGrids and Data Tables",
   "keywords": [
     "web-components",

package/publishTimestamp.d.ts

@@ -1,2 +1,2 @@
-declare const _default: 1658938470568;
+declare const _default: 1659024589656;
 export default _default;

package/publishTimestamp.js

@@ -1,3 +1,3 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = 1658938470568;
+exports.default = 1659024589656;

package/src/Api/ColumnApi.d.ts

@@ -303,5 +303,11 @@ export interface ColumnApi {
      * @param columnId Column to Check
      */
     isActionRowButtonColumn(columnId: string): boolean;
+    /**
+     * Returns the default Aggregation Function for a Column
+     * @param columnId Column to Check
+     */
     getDefaultAggFunc(columnId: string): string;
+    getMinValueForNumericColumn(column: AdaptableColumn): number | undefined;
+    getMaxValueForNumericColumn(column: AdaptableColumn): number | undefined;
 }

package/src/Api/Events/SearchChanged.d.ts

@@ -2,6 +2,7 @@ import { BaseEventInfo } from './BaseEventInfo';
 import { AdaptableSortState } from '../../types';
 import { AdaptableSearchState } from './AdaptableSearchState';
 /**
+ * Deprecated Search Changed Event - use `QueryRun` or `FilterApplied` instead
  * @deprecated Use QueryRun and or FilterApplied
  */
 export interface SearchChangedInfo extends BaseEventInfo {

package/src/Api/FormatColumnApi.d.ts

@@ -1,4 +1,4 @@
-import { FormatColumnState, FormatColumn, ColumnStyle, ColumnComparison } from '../PredefinedConfig/FormatColumnState';
+import { FormatColumnState, FormatColumn, ColumnStyle, ColumnComparison, CellColorRange } from '../PredefinedConfig/FormatColumnState';
 import { AdaptableColumn, AdaptableFormat } from '../types';
 import { RowNode } from '@ag-grid-community/all-modules';
 /**
@@ -156,14 +156,16 @@ export interface FormatColumnApi {
      * @param rowNode current Row Node
      * @param cellValue current Cell Value
      */
-    getNumericStyleMinValue(numericStyle: ColumnStyle, rowNode: RowNode, cellValue: any): number;
+    getNumericStyleMinValue(numericStyle: ColumnStyle, column: AdaptableColumn, rowNode: RowNode, cellValue: any): number;
     /**
      * Gets the Maximum Value to display for a Numeric Style
      * @param numericStyle Numeric Style to check
      * @param rowNode current Row Node
      * @param cellValue current Cell Value
      */
-    getNumericStyleMaxValue(numericStyle: ColumnStyle, rowNode: RowNode, cellValue: any): number;
+    getNumericStyleMaxValue(numericStyle: ColumnStyle, column: AdaptableColumn, rowNode: RowNode, cellValue: any): number;
+    getCellColorRangeMinValue(range: CellColorRange, column: AdaptableColumn): number | undefined;
+    getCellColorRangeMaxValue(range: CellColorRange, column: AdaptableColumn): number | undefined;
     /**
      * Returns first Format Column that contains checkbox style
      * @param columnId column to check

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

@@ -70,4 +70,6 @@ export declare class ColumnApiImpl extends ApiBase implements ColumnApi {
     isColumnReferencedInExpression(columnId: string, expression: string): boolean;
     isActionRowButtonColumn(columnId: string): boolean;
     getDefaultAggFunc(columnId: string): string;
+    getMinValueForNumericColumn(column: AdaptableColumn): number | undefined;
+    getMaxValueForNumericColumn(column: AdaptableColumn): number | undefined;
 }

package/src/Api/Implementation/ColumnApiImpl.js

@@ -420,5 +420,19 @@ class ColumnApiImpl extends ApiBase_1.ApiBase {
         const agColumn = (_b = (_a = this.getAgGridColumnForAdaptableColumn(columnId)) === null || _a === void 0 ? void 0 : _a.getColDef) === null || _b === void 0 ? void 0 : _b.call(_a);
         return (_c = agColumn === null || agColumn === void 0 ? void 0 : agColumn.defaultAggFunc) !== null && _c !== void 0 ? _c : availableAggregationFunctions[0];
     }
+    getMinValueForNumericColumn(column) {
+        if (column.dataType !== 'Number') {
+            return undefined;
+        }
+        // can we cache this in some way?
+        return Math.min(...this.getDistinctRawValuesForColumn(column.columnId));
+    }
+    getMaxValueForNumericColumn(column) {
+        if (column.dataType !== 'Number') {
+            return undefined;
+        }
+        // can we cache this in some way?
+        return Math.max(...this.getDistinctRawValuesForColumn(column.columnId));
+    }
 }
 exports.ColumnApiImpl = ColumnApiImpl;

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

@@ -1,7 +1,7 @@
 import { AdaptableStyle } from '../../PredefinedConfig/Common/AdaptableStyle';
 import { ApiBase, LayoutAssociatedObjectLoadConfig } from './ApiBase';
 import { FormatColumnApi } from '../FormatColumnApi';
-import { FormatColumnState, FormatColumn, ColumnStyle, ColumnComparison } from '../../PredefinedConfig/FormatColumnState';
+import { FormatColumnState, FormatColumn, ColumnStyle, CellColorRange, ColumnComparison } from '../../PredefinedConfig/FormatColumnState';
 import { AdaptableColumn } from '../../PredefinedConfig/Common/AdaptableColumn';
 import { RowNode } from '@ag-grid-community/all-modules';
 import { AdaptableFormat } from '../../types';
@@ -39,8 +39,10 @@ export declare class FormatColumnApiImpl extends ApiBase implements FormatColumn
     getFormatColumnsWithAllScope(formatColumns: FormatColumn[]): FormatColumn[] | undefined;
     getFormatColumnsWithDataTypeScope(formatColumns: FormatColumn[]): FormatColumn[] | undefined;
     getFormatColumnsWithColumnScope(formatColumns: FormatColumn[]): FormatColumn[] | undefined;
-    getNumericStyleMinValue(numericStyle: ColumnStyle, rowNode: RowNode, cellValue: any): number;
-    getNumericStyleMaxValue(numericStyle: ColumnStyle, rowNode: RowNode, cellValue: any): number | undefined;
+    getNumericStyleMinValue(numericStyle: ColumnStyle, column: AdaptableColumn, rowNode: RowNode, cellValue: any): number;
+    getNumericStyleMaxValue(numericStyle: ColumnStyle, column: AdaptableColumn, rowNode: RowNode, cellValue: any): number | undefined;
+    getCellColorRangeMinValue(range: CellColorRange, column: AdaptableColumn): number | undefined;
+    getCellColorRangeMaxValue(range: CellColorRange, column: AdaptableColumn): number | undefined;
     getCheckBoxStyleFormatColumn(column: AdaptableColumn): FormatColumn | undefined;
     isCheckBoxStyleFormatColumn(column: AdaptableColumn): boolean;
     fireCheckboxColumnClickedEvent(columnId: string, rowData: any, primaryKeyValue: any, isChecked: boolean): void;

package/src/Api/Implementation/FormatColumnApiImpl.js

@@ -180,7 +180,7 @@ class FormatColumnApiImpl extends ApiBase_1.ApiBase {
     getFormatColumnsWithColumnScope(formatColumns) {
         return formatColumns.filter((fc) => this.adaptable.api.scopeApi.scopeHasColumns(fc.Scope));
     }
-    getNumericStyleMinValue(numericStyle, rowNode, cellValue) {
+    getNumericStyleMinValue(numericStyle, column, rowNode, cellValue) {
         var _a, _b;
         const columnComparison = numericStyle.GradientStyle
             ? numericStyle.GradientStyle.ColumnComparison
@@ -199,24 +199,28 @@ class FormatColumnApiImpl extends ApiBase_1.ApiBase {
                 }
             }
         }
-        // for percentbar we want to get the whole Ranges, for Gradident Column just range that contains cell value
+        // for Gradient Column we want just the range that contains cell value
         if (numericStyle.GradientStyle) {
             let range;
             numericStyle.GradientStyle.CellRanges.forEach((cellRange) => {
-                if (!range && cellValue >= cellRange.Min && cellValue <= cellRange.Max) {
-                    range = cellRange;
+                if (!range) {
+                    if ((cellRange.Min == 'Col-Min' || cellValue >= cellRange.Min) &&
+                        (cellRange.Max == 'Col-Max' || cellValue <= cellRange.Max)) {
+                        range = cellRange;
+                    }
                 }
             });
-            return range ? range.Min : undefined;
+            return this.getCellColorRangeMinValue(range, column);
         }
+        // for percentbar we want to get the whole Ranges
         if (numericStyle.PercentBarStyle) {
             const ranges = (_b = numericStyle.PercentBarStyle) === null || _b === void 0 ? void 0 : _b.CellRanges;
             if (ranges) {
-                return ranges[0].Min;
+                return this.getCellColorRangeMinValue(ranges[0], column);
             }
         }
     }
-    getNumericStyleMaxValue(numericStyle, rowNode, cellValue) {
+    getNumericStyleMaxValue(numericStyle, column, rowNode, cellValue) {
         var _a, _b;
         const columnComparison = numericStyle.GradientStyle
             ? numericStyle.GradientStyle.ColumnComparison
@@ -238,19 +242,44 @@ class FormatColumnApiImpl extends ApiBase_1.ApiBase {
         if (numericStyle.GradientStyle) {
             let range;
             numericStyle.GradientStyle.CellRanges.forEach((cellRange) => {
-                if (!range && cellValue >= cellRange.Min && cellValue <= cellRange.Max) {
-                    range = cellRange;
+                if (!range) {
+                    if ((cellRange.Min == 'Col-Min' || cellValue >= cellRange.Min) &&
+                        (cellRange.Max == 'Col-Max' || cellValue <= cellRange.Max)) {
+                        range = cellRange;
+                    }
                 }
             });
-            return range ? range.Max : undefined;
+            return this.getCellColorRangeMaxValue(range, column);
         }
         if (numericStyle.PercentBarStyle) {
             const ranges = (_b = numericStyle.PercentBarStyle) === null || _b === void 0 ? void 0 : _b.CellRanges;
             if (ranges) {
-                return ranges[ranges.length - 1].Max;
+                return this.getCellColorRangeMaxValue(ranges[ranges.length - 1], column);
             }
         }
     }
+    getCellColorRangeMinValue(range, column) {
+        if (!range) {
+            return undefined;
+        }
+        if (range.Min == undefined) {
+            return undefined;
+        }
+        return range.Min == 'Col-Min'
+            ? this.getAdaptableApi().columnApi.getMinValueForNumericColumn(column)
+            : range.Min;
+    }
+    getCellColorRangeMaxValue(range, column) {
+        if (!range) {
+            return undefined;
+        }
+        if (range.Max == undefined) {
+            return undefined;
+        }
+        return range.Max == 'Col-Max'
+            ? this.getAdaptableApi().columnApi.getMaxValueForNumericColumn(column)
+            : range.Max;
+    }
     getCheckBoxStyleFormatColumn(column) {
         var _a;
         if (column.dataType != 'Boolean') {

package/src/PredefinedConfig/FormatColumnState.d.ts

@@ -111,11 +111,11 @@ export interface CellColorRange {
     /**
      * Start number of Range
      */
-    Min: number;
+    Min: number | 'Col-Min';
     /**
      * End number of Range
      */
-    Max: number;
+    Max: number | 'Col-Max';
     /**
      * Cell colour to use for values that fall inside Range
      */

package/src/Redux/Store/AdaptableStore.js

@@ -899,6 +899,14 @@ const adaptableMiddleware = (adaptable) => function (middlewareAPI) {
                             }
                         }
                     }
+                    // when changing current layout via the api, the layout should update
+                    if (returnAction.type == LayoutRedux.LAYOUT_SAVE) {
+                        const currentLayout = adaptable.api.layoutApi.getCurrentLayout();
+                        const savingLayout = returnAction.layout;
+                        if (currentLayout.Name === savingLayout.Name) {
+                            adaptable.setLayout(savingLayout);
+                        }
+                    }
                     return returnAction;
                 }
                 /*******************

package/src/Strategy/LayoutModule.js

@@ -247,8 +247,8 @@ class LayoutModule extends AdaptableModuleBase_1.AdaptableModuleBase {
                     values: [layout.Name],
                 },
                 {
-                    name: 'Pivot Layout',
-                    values: [(layout === null || layout === void 0 ? void 0 : layout.EnablePivot) ? 'Yes' : 'No'],
+                    name: 'Layout Grid Type',
+                    values: [(layout === null || layout === void 0 ? void 0 : layout.EnablePivot) ? 'Pivot' : 'Table'],
                 },
                 {
                     name: 'Columns',

package/src/View/Components/RangesComponent.js

@@ -147,7 +147,7 @@ class RangesComponent extends React.Component {
     addRange() {
         const lastRange = this.state.ranges[this.state.ranges.length - 1];
         this.state.ranges.push({
-            Min: lastRange.Max,
+            Min: lastRange.Max == 'Col-Max' ? 0 : lastRange.Max,
             Max: lastRange.Max,
             Color: UIHelper_1.getHexForName(UIHelper_1.GRAY),
         }),

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

@@ -58,7 +58,7 @@ const AggregationsSection = (props) => {
     const allColumns = adaptable.api.columnApi.getColumns();
     const sortedAggregableColumns = React.useMemo(() => {
         var _a, _b;
-        return sortWithOrder_1.sortWithOrderArray(allAggregableColumns.map((col) => col.columnId), (_b = Object.keys((_a = layout.AggregationColumns) !== null && _a !== void 0 ? _a : {})) !== null && _b !== void 0 ? _b : [], { sortUnorderedItems: true }).map((colId) => adaptable.api.columnApi.getColumnFromId(colId));
+        return sortWithOrder_1.sortWithOrderArray(allAggregableColumns.map((col) => col.columnId), (_b = Object.keys((_a = layout.AggregationColumns) !== null && _a !== void 0 ? _a : {})) !== null && _b !== void 0 ? _b : [], { sortUnorderedItems: false }).map((colId) => adaptable.api.columnApi.getColumnFromId(colId));
     }, [layout, allAggregableColumns]);
     const handleColumnsSelectionChange = React.useCallback((columnIds) => {
         props.onChange(Object.assign(Object.assign({}, layout), { AggregationColumns: columnIds.reduce((acc, colId) => {

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

@@ -31,6 +31,10 @@ const ColumnsSectionSummary = () => {
     const data = React.useMemo(() => {
         return layout.Columns.map((columnId) => {
             var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+            if (adaptable.api.columnApi.isAutoPivotColumn(columnId) ||
+                adaptable.api.columnApi.isAutoRowGroupColumn(columnId)) {
+                return null;
+            }
             const friendlyName = adaptable.api.columnApi.getFriendlyNameFromColumnId(columnId);
             const header = (_b = (_a = layout.ColumnHeadersMap) === null || _a === void 0 ? void 0 : _a[columnId]) !== null && _b !== void 0 ? _b : '';
             const columnWidth = (_c = layout.ColumnWidthMap) === null || _c === void 0 ? void 0 : _c[columnId];
@@ -57,7 +61,7 @@ const ColumnsSectionSummary = () => {
                 grouping,
                 filter,
             };
-        });
+        }).filter(Boolean);
     }, [layout]);
     const columns = React.useMemo(() => {
         return {
@@ -187,7 +191,7 @@ const ColumnsSection = (props) => {
     const { data: layout } = OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext();
     const allColumns = adaptable.api.columnApi.getColumns();
     const sortedColumns = React.useMemo(() => {
-        return sortWithOrder_1.sortWithOrderArray(allColumns.map((col) => col.columnId), layout.Columns, { sortUnorderedItems: true }).map((colId) => adaptable.api.columnApi.getColumnFromId(colId));
+        return sortWithOrder_1.sortWithOrderArray(allColumns.map((col) => col.columnId), layout.Columns, { sortUnorderedItems: false }).map((colId) => adaptable.api.columnApi.getColumnFromId(colId));
     }, [layout, allColumns]);
     const handlePinChange = (columnId, pinning) => {
         props.onChange(Object.assign(Object.assign({}, layout), { PinnedColumnsMap: Object.assign(Object.assign({}, layout.PinnedColumnsMap), { [columnId]: pinning }) }));

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

@@ -12,9 +12,10 @@ const ValueSelector_1 = require("../../../Components/ValueSelector");
 const OnePageAdaptableWizard_1 = require("../../../Wizard/OnePageAdaptableWizard");
 const Utilities_1 = require("./Utilities");
 const PivotColumnsSectionSummary = () => {
+    var _a;
     const adaptable = AdaptableContext_1.useAdaptable();
     const { data: layout } = OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext();
-    return (React.createElement(rebass_1.Box, { p: 2, style: { borderRadius: 'var(--ab__border-radius)' }, backgroundColor: "var(--ab-color-defaultbackground)" }, layout.PivotColumns.length ? (layout.PivotColumns.map((columnId) => (React.createElement(Tag_1.Tag, { mr: 1, key: columnId }, adaptable.api.columnApi.getFriendlyNameFromColumnId(columnId))))) : (React.createElement(Tag_1.Tag, null, "No Column Pivoting"))));
+    return (React.createElement(rebass_1.Box, { p: 2, style: { borderRadius: 'var(--ab__border-radius)' }, backgroundColor: "var(--ab-color-defaultbackground)" }, ((_a = layout.PivotColumns) === null || _a === void 0 ? void 0 : _a.length) ? (layout.PivotColumns.map((columnId) => (React.createElement(Tag_1.Tag, { mr: 1, key: columnId }, adaptable.api.columnApi.getFriendlyNameFromColumnId(columnId))))) : (React.createElement(Tag_1.Tag, null, "No Column Pivoting"))));
 };
 exports.PivotColumnsSectionSummary = PivotColumnsSectionSummary;
 const PivotColumnsSection = (props) => {
@@ -24,7 +25,7 @@ const PivotColumnsSection = (props) => {
     const allPivotColumns = adaptable.api.columnApi.getPivotableColumns();
     const sortedPivotColumns = React.useMemo(() => {
         var _a;
-        return sortWithOrder_1.sortWithOrderArray(allPivotColumns.map((col) => col.columnId), (_a = layout.PivotColumns) !== null && _a !== void 0 ? _a : [], { sortUnorderedItems: true }).map((colId) => adaptable.api.columnApi.getColumnFromId(colId));
+        return sortWithOrder_1.sortWithOrderArray(allPivotColumns.map((col) => col.columnId), (_a = layout.PivotColumns) !== null && _a !== void 0 ? _a : [], { sortUnorderedItems: false }).map((colId) => adaptable.api.columnApi.getColumnFromId(colId));
     }, [layout, allPivotColumns]);
     const handleColumnsChange = (columnIds) => {
         props.onChange(Object.assign(Object.assign({}, layout), { PivotColumns: columnIds }));

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

@@ -26,7 +26,7 @@ const RowGroupingSection = (props) => {
     const allGroupableColumns = adaptable.api.columnApi.getGroupableColumns();
     const sortedGroupableColumns = React.useMemo(() => {
         var _a;
-        return sortWithOrder_1.sortWithOrderArray(allGroupableColumns.map((col) => col.columnId), (_a = layout.RowGroupedColumns) !== null && _a !== void 0 ? _a : [], { sortUnorderedItems: true }).map((colId) => adaptable.api.columnApi.getColumnFromId(colId));
+        return sortWithOrder_1.sortWithOrderArray(allGroupableColumns.map((col) => col.columnId), (_a = layout.RowGroupedColumns) !== null && _a !== void 0 ? _a : [], { sortUnorderedItems: false }).map((colId) => adaptable.api.columnApi.getColumnFromId(colId));
     }, [layout, allGroupableColumns]);
     const handleColumnsChange = (columnIds) => {
         props.onChange(Object.assign(Object.assign({}, layout), { RowGroupedColumns: columnIds }));

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

@@ -17,8 +17,8 @@ const SettingsSectionSummary = () => {
             "Layout Name: ",
             layout.Name),
         React.createElement(Tag_1.Tag, { mr: 2 },
-            "Pivot Layout: ",
-            layout.EnablePivot ? 'Yes' : 'No'),
+            "Layout Grid Type: ",
+            layout.EnablePivot ? 'Pivot' : 'Table'),
         React.createElement(Tag_1.Tag, { mr: 2 },
             "Suppress Aggregation Function in Header: ",
             layout.SuppressAggFuncInHeader ? 'Yes' : 'No')));

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

@@ -38,7 +38,7 @@ const SortSection = (props) => {
     });
     const sortedSortColumns = React.useMemo(() => {
         var _a;
-        return sortWithOrder_1.sortWithOrderArray(allSortableColumns.map((col) => col.columnId), ((_a = layout.ColumnSorts) !== null && _a !== void 0 ? _a : []).map((sort) => sort.ColumnId), { sortUnorderedItems: true }).map((colId) => adaptable.api.columnApi.getColumnFromId(colId));
+        return sortWithOrder_1.sortWithOrderArray(allSortableColumns.map((col) => col.columnId), ((_a = layout.ColumnSorts) !== null && _a !== void 0 ? _a : []).map((sort) => sort.ColumnId), { sortUnorderedItems: false }).map((colId) => adaptable.api.columnApi.getColumnFromId(colId));
     }, [layout, allSortableColumns]);
     const handleColumnsSelectionChange = React.useCallback((columnIds) => {
         props.onChange(Object.assign(Object.assign({}, layout), { ColumnSorts: (columnIds || []).map((columnId) => {

package/src/agGrid/Adaptable.d.ts

@@ -259,7 +259,7 @@ export declare class Adaptable implements IAdaptable {
     getExcelClassNameForCell(colId: string, primaryKeyValue: any): string;
     setupColumnCellEditor({ colId, col }: ColumnSetupInfo): void;
     setupColumnCellRenderer({ col, colId, abColumn }: ColumnSetupInfo): void;
-    setupColumnTooltipValueGetter({ col, colId }: ColumnSetupInfo): void;
+    setupColumnTooltipValueGetter({ col, colId, abColumn }: ColumnSetupInfo): void;
     setupColumnQuickFilerText({ col, abColumn }: ColumnSetupInfo): void;
     setupColumnHeader({ col, abColumn }: ColumnSetupInfo): boolean;
     setupColumnFilter({ col, colDef }: ColumnSetupInfo): void;

package/src/agGrid/Adaptable.js

@@ -893,7 +893,7 @@ class Adaptable {
         this.gridOptions.api.setColumnDefs(colDefs);
         this.updateColumnsIntoStore(); // todo remove this from here!!!
     }
-    getFormatColumnCellStyle(formatColumn, params) {
+    getFormatColumnCellStyle(abColumn, formatColumn, params) {
         if (!formatColumn.IncludeGroupedRows && this.isGroupRowNode(params.node)) {
             return;
         }
@@ -906,8 +906,8 @@ class Adaptable {
         if (columnStyle) {
             const gradientStyle = columnStyle === null || columnStyle === void 0 ? void 0 : columnStyle.GradientStyle;
             if (gradientStyle) {
-                const min = this.api.formatColumnApi.getNumericStyleMinValue(columnStyle, params.node, params.value);
-                const max = this.api.formatColumnApi.getNumericStyleMaxValue(columnStyle, params.node, params.value);
+                const min = this.api.formatColumnApi.getNumericStyleMinValue(columnStyle, abColumn, params.node, params.value);
+                const max = this.api.formatColumnApi.getNumericStyleMaxValue(columnStyle, abColumn, params.node, params.value);
                 const clampedValue = clamp_1.default(params.value, min, max);
                 let cellBackColor;
                 let reverseGradient = false;
@@ -915,7 +915,8 @@ class Adaptable {
                     cellBackColor = gradientStyle.ColumnComparison.Color;
                 }
                 else {
-                    const matchingRange = gradientStyle.CellRanges.find((r) => r.Min <= clampedValue && r.Max >= clampedValue);
+                    const matchingRange = gradientStyle.CellRanges.find((r) => (r.Min == 'Col-Min' || r.Min <= clampedValue) &&
+                        (r.Max == 'Col-Max' || r.Max >= clampedValue));
                     if (matchingRange) {
                         cellBackColor = matchingRange.Color;
                         reverseGradient = matchingRange.ReverseGradient;
@@ -3129,7 +3130,7 @@ class Adaptable {
             const hasQuickSearchStyle = quickSearchStyle != undefined;
             const cellStyle = (params) => {
                 const formatColumnCellStyle = formatColumn
-                    ? this.getFormatColumnCellStyle(formatColumn, params)
+                    ? this.getFormatColumnCellStyle(abColumn, formatColumn, params)
                     : undefined;
                 const isQuickSearchActive = hasQuickSearchStyle && this.isQuickSearchActive(abColumn, params);
                 const result = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, defaultCellStyle), this.getReadOnlyCellStyle(abColumn, params)), this.getEditableCellStyle(abColumn, params)), (typeof userCellStyle === 'function' ? userCellStyle(params) : userCellStyle)), formatColumnCellStyle), this.getConditionalStyleCellStyle(conditionalStyles, abColumn, params)), (isQuickSearchActive ? quickSearchStyle : undefined)), this.getAlertCellStyle(abColumn, params)), this.getFlashingCellStyle(abColumn, params)), this.getCellHighlightStyle(abColumn, params));
@@ -3221,7 +3222,7 @@ class Adaptable {
             const formatColumn = this.api.formatColumnApi.getActiveFormatColumnForColumn(abColumn);
             if (formatColumn && !(formatColumn === null || formatColumn === void 0 ? void 0 : formatColumn.IsSuspended) && formatColumn.ColumnStyle) {
                 if (formatColumn.ColumnStyle.PercentBarStyle) {
-                    return this.agGridHelper.createPercentBarRendererComp(formatColumn);
+                    return this.agGridHelper.createPercentBarRendererComp(formatColumn, abColumn);
                 }
                 if (formatColumn.ColumnStyle.CheckBoxStyle) {
                     return this.agGridHelper.createCheckboxRendererComp(abColumn.columnId, abColumn.readOnly);
@@ -3229,7 +3230,7 @@ class Adaptable {
             }
         });
     }
-    setupColumnTooltipValueGetter({ col, colId }) {
+    setupColumnTooltipValueGetter({ col, colId, abColumn }) {
         this.setColDefProperty(col, 'tooltipValueGetter', () => {
             var _a;
             const formatColumn = this.api.formatColumnApi.getFormatColumnForColumnId(colId);
@@ -3240,8 +3241,8 @@ class Adaptable {
                 formatColumn.ColumnStyle.PercentBarStyle.ToolTipText) {
                 if ((_a = formatColumn === null || formatColumn === void 0 ? void 0 : formatColumn.ColumnStyle) === null || _a === void 0 ? void 0 : _a.PercentBarStyle) {
                     return (params) => {
-                        const min = this.api.formatColumnApi.getNumericStyleMinValue(formatColumn === null || formatColumn === void 0 ? void 0 : formatColumn.ColumnStyle, params.node, params.value);
-                        const max = this.api.formatColumnApi.getNumericStyleMaxValue(formatColumn === null || formatColumn === void 0 ? void 0 : formatColumn.ColumnStyle, params.node, params.value);
+                        const min = this.api.formatColumnApi.getNumericStyleMinValue(formatColumn === null || formatColumn === void 0 ? void 0 : formatColumn.ColumnStyle, abColumn, params.node, params.value);
+                        const max = this.api.formatColumnApi.getNumericStyleMaxValue(formatColumn === null || formatColumn === void 0 ? void 0 : formatColumn.ColumnStyle, abColumn, params.node, params.value);
                         const textOptions = formatColumn.ColumnStyle.PercentBarStyle.ToolTipText;
                         let returnValue = '';
                         if (textOptions.includes('CellValue')) {

package/src/agGrid/PercentBarRenderer.d.ts

@@ -1,3 +1,4 @@
 import { FormatColumn } from '../PredefinedConfig/FormatColumnState';
 import { AdaptableApi } from '../Api/AdaptableApi';
-export declare const getPercentBarRendererForColumn: (formatColumn: FormatColumn, api: AdaptableApi) => any;
+import { AdaptableColumn } from '../PredefinedConfig/Common/AdaptableColumn';
+export declare const getPercentBarRendererForColumn: (formatColumn: FormatColumn, abColumn: AdaptableColumn, api: AdaptableApi) => any;

package/src/agGrid/PercentBarRenderer.js

@@ -5,7 +5,7 @@ const tslib_1 = require("tslib");
 const Helper_1 = tslib_1.__importDefault(require("../Utilities/Helpers/Helper"));
 const clamp_1 = tslib_1.__importDefault(require("lodash/clamp"));
 const FormatHelper_1 = tslib_1.__importDefault(require("../Utilities/Helpers/FormatHelper"));
-const getPercentBarRendererForColumn = (formatColumn, api) => {
+const getPercentBarRendererForColumn = (formatColumn, abColumn, api) => {
     var _a;
     if (!((_a = formatColumn === null || formatColumn === void 0 ? void 0 : formatColumn.ColumnStyle) === null || _a === void 0 ? void 0 : _a.PercentBarStyle)) {
         return;
@@ -15,8 +15,8 @@ const getPercentBarRendererForColumn = (formatColumn, api) => {
             if (!formatColumn.IncludeGroupedRows && api.gridApi.isGroupRowNode(params.node)) {
                 return;
             }
-            const min = api.formatColumnApi.getNumericStyleMinValue(formatColumn.ColumnStyle, params.node, params.value);
-            const max = api.formatColumnApi.getNumericStyleMaxValue(formatColumn.ColumnStyle, params.node, params.value);
+            const min = api.formatColumnApi.getNumericStyleMinValue(formatColumn.ColumnStyle, abColumn, params.node, params.value);
+            const max = api.formatColumnApi.getNumericStyleMaxValue(formatColumn.ColumnStyle, abColumn, params.node, params.value);
             let value = params.value;
             if (Helper_1.default.objectNotExists(value)) {
                 value = 0;

package/src/agGrid/agGridHelper.d.ts

@@ -21,7 +21,7 @@ export declare class agGridHelper {
     setUpModules(): Map<AdaptableModule, IModule>;
     TrySetUpNodeIds(hasAutogeneratedPrimaryKey: boolean): boolean;
     createCheckboxRendererComp(columnId: string, isColumnReadOnly: boolean): ICellRendererFunc | undefined;
-    createPercentBarRendererComp(formatColumn: FormatColumn): ICellRendererFunc;
+    createPercentBarRendererComp(formatColumn: FormatColumn, abColumn: AdaptableColumn): ICellRendererFunc;
     getCleanValue(value: string): string | undefined;
     getRenderedValue(colDef: ColDef, valueToRender: any): any;
     createAdaptableColumnFromAgGridColumn(agGridColumn: Column, colsToGroups: Record<string, AdaptableColumnGroup>): AdaptableColumn;

package/src/agGrid/agGridHelper.js

@@ -148,8 +148,8 @@ class agGridHelper {
     createCheckboxRendererComp(columnId, isColumnReadOnly) {
         return CheckboxRenderer_1.getCheckboxRendererForColumn(columnId, isColumnReadOnly, this.adaptable.api);
     }
-    createPercentBarRendererComp(formatColumn) {
-        return PercentBarRenderer_1.getPercentBarRendererForColumn(formatColumn, this.adaptable.api);
+    createPercentBarRendererComp(formatColumn, abColumn) {
+        return PercentBarRenderer_1.getPercentBarRendererForColumn(formatColumn, abColumn, this.adaptable.api);
     }
     getCleanValue(value) {
         if (value == null || value == 'null' || value == undefined || value == 'undefined') {