@adaptabletools/adaptable-cjs 23.0.0-canary.6 → 23.0.0-canary.8

package/src/AdaptableState/StyledColumns/IconStyle.d.ts

@@ -0,0 +1,158 @@
+import { AdaptableIcon } from '../Common/AdaptableIcon';
+import { CellBoxStyle, CellFontStyle } from '../Common/AdaptableStyle';
+/**
+ * Built-in mapping presets for Icons (Flags, Currencies, Trend, Status)
+ */
+export type IconStyleBuiltInPreset = 'Flags' | 'Currencies' | 'Trend' | 'Status';
+/**
+ * How the cell value should be matched against {@link IconStyleMapping.Key}.
+ *
+ * - `'Exact'` (default) — strict `===` equality. Numbers, booleans and
+ *   strings are matched as-is; useful when keys are tightly controlled.
+ * - `'CaseInsensitive'` — string keys are matched case-insensitively
+ *   (cell value and key are both lowercased before comparison). Useful
+ *   for free-typed columns where the same logical value can appear as
+ *   `'GBP'` or `'gbp'`.
+ */
+export type IconStyleMatchMode = 'Exact' | 'CaseInsensitive';
+/**
+ * Behaviour when the cell value does not match any mapping key.
+ *
+ * - `'Hide'` (default) — render nothing.
+ * - `'ShowText'` — render the raw cell value (so the cell still shows
+ *   *something* meaningful instead of an empty cell).
+ * - `'Icon'` — render a fallback icon defined by
+ *   {@link IconFallbackProperties.Icon}.
+ */
+export type IconStyleFallback = 'Hide' | 'ShowText' | 'Icon';
+/**
+ * What the renderer draws for a single matched mapping.
+ *
+ * - An {@link AdaptableIcon} — a system icon (`{ name: 'flag' }`), a URL
+ *   (`{ src: '/img/us.svg' }`) or an HTML element / fragment.
+ * - A plain `string` — rendered verbatim, intended for emoji glyphs
+ *   (e.g. `'🇺🇸'`, `'$'`, `'⬆'`). Strings are *not* HTML-parsed so they
+ *   are safe to author from data sources.
+ */
+export type IconStyleSpec = AdaptableIcon | string;
+/**
+ * Fallback settings for {@link IconStyle} — what the renderer draws when
+ * no mapping matches the cell value (`Mode`), and the icon used when
+ * `Mode === 'Icon'` (`Icon`).
+ */
+export interface IconFallbackProperties {
+    /**
+     * Behaviour when no mapping matches the cell value (Hide, ShowText, Icon).
+     *
+     * @defaultValue `'Hide'`
+     */
+    Mode?: IconStyleFallback;
+    /**
+     * Icon used when `Mode: 'Icon'` (ignored otherwise).
+     */
+    Icon?: IconStyleSpec;
+}
+/**
+ * Companion text settings for {@link IconStyle} — what to render alongside
+ * a matched icon (`CellText`) and where it sits relative to the icon
+ * (`CellTextPosition`).
+ */
+export interface IconCellTextProperties {
+    /**
+     * Text to render alongside a matched icon (CellValue and/or the matched
+     * mapping's Description).
+     */
+    CellText?: ('CellValue' | 'IconDescription')[];
+    /**
+     * Where the cell text sits relative to the icon (Before, After, Above, Below).
+     *
+     * @defaultValue `'After'`
+     */
+    CellTextPosition?: 'Before' | 'After' | 'Above' | 'Below';
+}
+/**
+ * One mapping in an {@link IconStyle} — `Key` is matched against the
+ * cell's raw value, `Icon` is what gets drawn when it matches.
+ */
+export interface IconStyleMapping {
+    /**
+     * Cell value that triggers this mapping. Compared using the parent
+     * {@link IconStyle.MatchMode} (defaults to strict equality).
+     *
+     * Booleans and numbers are accepted to support typed columns (e.g.
+     * `Key: true` for an `isLive` flag, `Key: 0` for a status code).
+     */
+    Key: string | number | boolean;
+    /**
+     * Icon to render when `Key` matches the cell value.
+     *
+     * See {@link IconStyleSpec} — accepts an `AdaptableIcon` (system /
+     * URL / element) or a plain string for emoji.
+     */
+    Icon: IconStyleSpec;
+    /**
+     * Optional human-readable description of this mapping (e.g. the full
+     * country name when `Key` is an ISO code). Surfaced in the tooltip and
+     * by the wizard's mappings list.
+     */
+    Description?: string;
+}
+/**
+ * Renders cell values as icons by looking up the cell value in a list of key → icon mappings; designed for one-glyph-per-cell visual recognition
+ */
+export interface IconStyle {
+    /**
+     * Custom mappings for style (layered on top of a preset); leave undefined to use preset as-is
+     */
+    Mappings?: IconStyleMapping[];
+    /**
+     * Built-in mappings to use for the Icon Style
+     */
+    Preset?: IconStyleBuiltInPreset;
+    /**
+     * How `Key` is compared with the cell value (Exact or Case Insensitive)
+     *
+     * @defaultValue `'Exact'`
+     */
+    MatchMode?: IconStyleMatchMode;
+    /**
+     * Behaviour when no mapping matches the cell value, plus the icon used
+     * by `Mode: 'Icon'`.
+     *
+     * Defaults to `{ Mode: 'Hide' }` when omitted.
+     */
+    FallbackProperties?: IconFallbackProperties;
+    /**
+     * Companion text to render alongside a matched icon (Cell Value and/or
+     * the matched mapping's Description) and where it sits relative to the
+     * icon (Before / After / Above / Below).
+     *
+     * Mirrors the `CellTextProperties` grouping used by `PercentBarStyle`,
+     * `BulletChartStyle` and `RangeBarStyle` for consistency.
+     */
+    CellTextProperties?: IconCellTextProperties;
+    /**
+     * Pixel size of icon glyph (square)
+     *
+     * @defaultValue `18`
+     */
+    Size?: number;
+    /**
+     * Pixel gap between the icon and the cell text (when shown).
+     *
+     * @defaultValue `4`
+     */
+    Gap?: number;
+    /**
+     * Tooltip content: `CellValue` (raw cell value) or `IconDescription` (matched mapping's `Description`)
+     */
+    ToolTipText?: ('CellValue' | 'IconDescription')[];
+    /**
+     * Optional cell-text styling applied to the companion text
+     */
+    Font?: CellFontStyle;
+    /**
+     * Optional stying (background / border / radius) for Cell behind the Icon
+     */
+    Cell?: CellBoxStyle;
+}

package/src/AdaptableState/StyledColumns/IconStyle.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/src/AdaptableState/StyledColumns/PercentBarStyle.d.ts

@@ -0,0 +1,32 @@
+import { CellFontStyle } from '../Common/AdaptableStyle';
+import { BarChartCellTextProperties } from './Common/BarChartCellText';
+import { CellTextOptions } from './Common/CellTextOptions';
+import { NumericStyledColumn } from './Common/NumericStyledColumn';
+/**
+ * Style used to display Percent Bars in Special Column Style
+ */
+export interface PercentBarStyle extends NumericStyledColumn {
+    /**
+     * Optional cell-text overlay configuration (display tokens, position, layout, alignment).
+     */
+    CellTextProperties?: BarChartCellTextProperties;
+    /**
+     * Whether Tooltip shows Cell Value, Percent Value, both or none
+     */
+    ToolTipText?: CellTextOptions;
+    /**
+     * Background colour for 'Percent Bar'; leave unset if none required
+     * @defaultValue undefined
+     */
+    BackColor?: string;
+    /**
+     * Origin of the bar - i.e. the value the bar grows from Auto, Zero, Min or fixed number
+     *
+     * @defaultValue 'Auto'
+     */
+    Origin?: 'Auto' | 'Zero' | 'Min' | number;
+    /**
+     * Optional cell-text styling applied to `CellText` overlay
+     */
+    Font?: CellFontStyle;
+}

package/src/AdaptableState/StyledColumns/PercentBarStyle.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/src/AdaptableState/StyledColumns/RangeBarStyle.d.ts

@@ -0,0 +1,155 @@
+import { BarChartCellTextProperties } from './Common/BarChartCellText';
+import { BarChartMarker } from './Common/BarChartMarker';
+import { CellTextOptions } from './Common/CellTextOptions';
+import { DynamicRangeEndpoint, NumericStyledColumn } from './Common/NumericStyledColumn';
+/**
+ * Resolvable value used by a Range Bar's `Min`, `Max` or `Reference.Value`.
+ *
+ * - `number` — a hard-coded value
+ * - `string` — a column id; the row's value in that column is used
+ * - `'Col-Min' | 'Col-Max' | 'Col-Avg' | 'Col-Median'` — a column-wide
+ *   aggregate computed across visible rows
+ */
+export type RangeBarBound = number | string | DynamicRangeEndpoint;
+/**
+ * Configures a Range Bar Styled Column.
+ *
+ * A Range Bar shows where a row's value sits inside a per-row (or
+ * column-wide) numeric range. The range endpoints (`Min` / `Max`) are
+ * resolved per row — they can be hard-coded numbers, the value of another
+ * column on the same row, or a column-wide aggregate (`Col-Min`, `Col-Max`,
+ * `Col-Avg`, `Col-Median`).
+ *
+ * Common scenarios:
+ *  - Stock price relative to its 52-week low / 52-week high
+ *  - Today's value relative to bid / ask quotes
+ *  - Forecast within an upper / lower confidence interval
+ *  - Measured value within an SLA `[lowerBound, upperBound]`
+ *
+ * Visually the cell renders as a thin track between `Min` and `Max`, with
+ * a marker at the cell value. An optional `Reference` value renders as a
+ * second marker (e.g. previous close, target, midpoint).
+ *
+ * Background bands (`CellRanges`) are drawn behind the track using the same
+ * conventions as Bullet Chart, and are useful for qualitative scales such
+ * as poor / acceptable / good (or red / amber / green SLA bands).
+ */
+export interface RangeBarStyle extends NumericStyledColumn {
+    /**
+     * Lower bound of the track for each row.
+     *
+     * Can be:
+     *  - `number` — a fixed lower bound shared by every row
+     *  - `string` — a column id; the row's value in that column is used
+     *  - `'Col-Min' | 'Col-Max' | 'Col-Avg' | 'Col-Median'` — a column-wide
+     *    aggregate computed across the visible rows
+     */
+    Min: RangeBarBound;
+    /**
+     * Upper bound of the track for each row.
+     *
+     * See `Min` for the supported value forms.
+     */
+    Max: RangeBarBound;
+    /**
+     * Optional reference value (e.g. previous close, target, midpoint) drawn
+     * as a *second* marker on the track, together with its marker styling.
+     * Leave unset to draw only the cell-value marker.
+     */
+    Reference?: RangeBarReferenceProperties;
+    /**
+     * Visual style of the cell-value marker.
+     *
+     * @defaultValue `{ Shape: 'Diamond', Color: 'var(--ab-color-accent)', Size: 8 }`
+     */
+    Marker?: BarChartMarker;
+    /**
+     * Behaviour when the cell value falls outside `[Min, Max]`, plus the
+     * optional marker colour override used by `Mode: 'Clamp'`.
+     *
+     * Defaults to `{ Mode: 'Clamp' }` when omitted.
+     */
+    OutOfRange?: RangeBarOutOfRangeProperties;
+    /**
+     * Visual properties of the track (the line representing the `[Min, Max]`
+     * interval).
+     */
+    Track?: RangeBarTrackProperties;
+    /**
+     * Background colour for the chart area when no `CellRanges` are supplied.
+     */
+    BackColor?: string;
+    /**
+     * Orientation of the range bar.
+     *
+     * @defaultValue `'Horizontal'`
+     */
+    Orientation?: 'Horizontal' | 'Vertical';
+    /**
+     * Optional cell-text overlay configuration.
+     */
+    CellTextProperties?: BarChartCellTextProperties;
+    /**
+     * Tooltip content — same tokens (`'CellValue'`, `'PercentageValue'`)
+     * as Percent Bar / Bullet Chart.
+     */
+    ToolTipText?: CellTextOptions;
+}
+/**
+ * Optional reference value drawn as a *second* marker on a Range Bar track,
+ * together with its marker styling.
+ */
+export interface RangeBarReferenceProperties {
+    /**
+     * Resolvable reference value (number / column id / `'Col-Min' | 'Col-Max'
+     * | 'Col-Avg' | 'Col-Median'`). Same forms as `RangeBarStyle.Min` / `Max`.
+     */
+    Value: RangeBarBound;
+    /**
+     * Visual style of the reference marker.
+     *
+     * @defaultValue `{ Shape: 'Line', Color: 'var(--ab-color-foreground)', Size: 2 }`
+     */
+    Marker?: BarChartMarker;
+}
+/**
+ * Out-of-range behaviour for a Range Bar.
+ */
+export interface RangeBarOutOfRangeProperties {
+    /**
+     * Behaviour when the cell value falls outside `[Min, Max]`.
+     *
+     * - `'Clamp'` (default) — clamp the marker to the nearest end of the
+     *   track and (optionally) re-colour it via `Color`
+     * - `'Overflow'` — draw the marker outside the track at its true position
+     * - `'Hide'` — omit the cell-value marker entirely
+     *
+     * @defaultValue `'Clamp'`
+     */
+    Mode?: 'Clamp' | 'Overflow' | 'Hide';
+    /**
+     * Marker colour override applied when the cell value is out of range
+     * (only used with `Mode: 'Clamp'`). Useful to draw attention to
+     * "off-scale" rows.
+     */
+    Color?: string;
+}
+/**
+ * Visual properties of the Range Bar track (the line representing the
+ * `[Min, Max]` interval).
+ */
+export interface RangeBarTrackProperties {
+    /**
+     * Track colour.
+     *
+     * @defaultValue 'var(--ab-color-foreground, #999)' at low alpha
+     */
+    Color?: string;
+    /**
+     * Track thickness in px (the *short* axis — height in horizontal,
+     * width in vertical).
+     *
+     * @defaultValue 4
+     */
+    Height?: number;
+}

package/src/AdaptableState/StyledColumns/RangeBarStyle.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/src/AdaptableState/StyledColumns/RatingStyle.d.ts

@@ -0,0 +1,111 @@
+import { CellBoxStyle } from '../Common/AdaptableStyle';
+import { CellTextOptions } from './Common/CellTextOptions';
+/**
+ * Icon used by a Rating Style
+ */
+export type RatingIconShape = 'Star' | 'Heart' | 'Circle' | 'Thumb';
+/**
+ * Styles a numeric column as a row of icons whose fill represents the
+ * cell value on a 0..`Max` scale.
+ *
+ * Conceptually similar to a Percent Bar but with a discrete, instantly
+ * legible visual idiom (★★★☆☆) commonly used for ratings, satisfaction
+ * scores and review-style cells.
+ *
+ * The cell value is clamped to `[0, Max]`. When `AllowHalf` is true (the
+ * default) the icon at the boundary is rendered with a partial fill that
+ * matches the fractional part of the value; otherwise the value is
+ * rounded to the nearest whole icon.
+ */
+export interface RatingStyle {
+    /**
+     * Number of icons per cell **and** the upper bound of the rating scale,
+     * in the **same numeric units as the cell value**.
+     *
+     * The renderer clamps the cell value to `[0, Max]` and maps that number
+     * directly to filled icons (e.g. `Max: 5` and value `4` → four units of
+     * fill across five icons — roughly four stars, not “4 out of 10 scaled
+     * to five stars”). Values above `Max` show as fully filled; values below
+     * `0` show as empty.
+     *
+     * To show a 1–10 score as five stars, use a calculated column (e.g.
+     * `value / 2`) or set `Max` to match your data range (e.g. `Max: 10`
+     * for ten icons), unless a future `ScaleMin` / `ScaleMax` option is added.
+     *
+     * @defaultValue 5
+     */
+    Max?: number;
+    /**
+     * Icon used for each rating mark.
+     *
+     * @defaultValue 'Star'
+     */
+    Icon?: RatingIconShape;
+    /**
+     * Fill colour for the active (filled) portion of the rating.
+     *
+     * @defaultValue 'var(--ab-color-warn, #f5a623)' — a warm amber that
+     * reads well on both light and dark themes.
+     */
+    FilledColor?: string;
+    /**
+     * Outline / fill colour for the inactive portion of the rating.
+     *
+     * Drawn as a subtle background icon so the user can see the maximum
+     * possible rating at a glance even when the cell value is low.
+     *
+     * @defaultValue a low-opacity tint of the current text colour.
+     */
+    EmptyColor?: string;
+    /**
+     * Icon size in pixels (each icon is square). The renderer keeps the
+     * row of icons vertically centred regardless of cell height.
+     *
+     * @defaultValue 14
+     */
+    Size?: number;
+    /**
+     * Pixel gap between adjacent icons.
+     *
+     * @defaultValue 2
+     */
+    Gap?: number;
+    /**
+     * Controls **partial icons** for fractional values after clamping to
+     * `[0, Max]` — not scaling between different ranges (e.g. 10-point vs
+     * 5-star).
+     *
+     * When `true`, the decimal part fills part of the next icon (e.g. `3.5`
+     * with `Max: 5` → three full icons + one half-filled + one empty).
+     * When `false`, the clamped value is rounded with `Math.round` before
+     * drawing, so only whole icons appear.
+     *
+     * @defaultValue true
+     */
+    AllowHalf?: boolean;
+    /**
+     * When `true`, the numeric cell value is also displayed alongside the
+     * icons (e.g. `★★★★☆ 4.2`). Useful when precise scores matter beyond
+     * the visual approximation.
+     *
+     * @defaultValue false
+     */
+    ShowValue?: boolean;
+    /**
+     * Optional AG Grid tooltip content — `CellValue` and/or `PercentageValue`.
+     * `PercentageValue` is the clamped cell value as a percent of `Max`
+     * (`clamp(value, 0, Max) / Max`, same scale as the icon fill).
+     */
+    ToolTipText?: CellTextOptions;
+    /**
+     * Optional cell box styling (background colour, border, border radius)
+     * applied to the cell behind the rating icons.
+     *
+     * When set, this property "claims" the Cell slice for the column: any
+     * Format Column matching this column has its Cell-box properties stripped
+     * (so a Format Column `BackColor` cannot tint the cell behind a Rating).
+     * When unset, Format Column Cell properties inherit through normally —
+     * useful for tinting a row of stars to match a Format Column theme.
+     */
+    Cell?: CellBoxStyle;
+}

package/src/AdaptableState/StyledColumns/RatingStyle.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/src/AdaptableState/StyledColumns/SparklineStyle.d.ts

@@ -0,0 +1,21 @@
+import { AgSparklineOptions } from 'ag-charts-types';
+import { CellBoxStyle } from '../Common/AdaptableStyle';
+/**
+ * Style to show for a Sparkline Column
+ */
+export interface SparklineStyle {
+    /**
+     * AG Grid Sparkline Options
+     */
+    options?: AgSparklineOptions;
+    /**
+     * Optional cell box styling applied to the cell behind the sparkline chart.
+     *
+     * When set, this property "claims" the Cell slice for the column: any
+     * Format Column matching this column has its Cell-box properties stripped.
+     * When unset, Format Column Cell properties inherit through normally —
+     * useful for letting a row's themed background show through behind the
+     * sparkline.
+     */
+    Cell?: CellBoxStyle;
+}

package/src/AdaptableState/StyledColumns/SparklineStyle.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/src/Api/ColumnScopeApi.d.ts

@@ -1,6 +1,6 @@
 import { AdaptableColumn } from '../AdaptableState/Common/AdaptableColumn';
 import { ColumnScope, ScopeDataType } from '../AdaptableState/Common/ColumnScope';
-import { CellColorRange } from '../AdaptableState/StyledColumnState';
+import { CellColorRange } from '../AdaptableState/StyledColumns/Common/NumericStyledColumn';
 /**
  * Provides access to a suite of functions related to the `Column Scope` object
  */

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

@@ -2,7 +2,7 @@ import { ApiBase } from './ApiBase';
 import { AdaptableColumn } from '../../AdaptableState/Common/AdaptableColumn';
 import { ColumnScope, ScopeDataType } from '../../AdaptableState/Common/ColumnScope';
 import { ColumnScopeApi } from '../ColumnScopeApi';
-import { CellColorRange } from '../../AdaptableState/StyledColumnState';
+import { CellColorRange } from '../../AdaptableState/StyledColumns/Common/NumericStyledColumn';
 export declare class ColumnScopeApiImpl extends ApiBase implements ColumnScopeApi {
     isColumnInScope(column: AdaptableColumn | undefined, scope: ColumnScope | undefined): boolean;
     getColumnsInScope(scope: ColumnScope): AdaptableColumn[];

package/src/Api/Internal/AlertInternalApi.js

@@ -126,7 +126,7 @@ class AlertInternalApi extends ApiBase_1.ApiBase {
             let backgroundColor = '';
             switch (highlightType) {
                 case 'Error':
-                    backgroundColor = 'var(--ab-color-error)';
+                    backgroundColor = 'var(--ab-color-destructive)';
                     break;
                 case 'Info':
                     backgroundColor = 'var(--ab-color-info)';

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

@@ -1,5 +1,8 @@
 import { ApiBase } from '../Implementation/ApiBase';
 import { DataSet } from '../../AdaptableOptions/DataSetOptions';
 export declare class DataSetInternalApi extends ApiBase {
+    handleDataSetSelected(dataSet: DataSet): void;
     showDataSetForm(dataSet: DataSet): void;
+    private buildDataSetForm;
+    private runDataSetHandler;
 }

package/src/Api/Internal/DataSetInternalApi.js

@@ -3,21 +3,81 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.DataSetInternalApi = void 0;
 const ApiBase_1 = require("../Implementation/ApiBase");
 class DataSetInternalApi extends ApiBase_1.ApiBase {
+    handleDataSetSelected(dataSet) {
+        if (!dataSet.form) {
+            this.getEventApi().internalApi.fireDataSetSelectedEvent(dataSet);
+            const dataSetSelectedInfo = {
+                ...this.getAdaptableInternalApi().buildBaseContext(),
+                dataSet,
+            };
+            this.runDataSetHandler(async () => {
+                if (dataSet.loadData) {
+                    const rowData = await dataSet.loadData(dataSetSelectedInfo);
+                    if (rowData != null) {
+                        this.getGridApi().loadGridData(rowData);
+                    }
+                }
+                if (dataSet.onSelect) {
+                    await dataSet.onSelect(dataSetSelectedInfo);
+                }
+            }, 'selection', dataSet.name);
+        }
+    }
     showDataSetForm(dataSet) {
-        if (dataSet.form) {
-            this.getAdaptableInternalApi().showPopupForm({
-                Id: 'data-set-form',
-                Form: dataSet.form,
-                prepareContext: (context) => {
-                    return new Promise((resolve) => {
-                        const preparedContext = {
-                            ...context,
-                            dataSet,
-                        };
-                        resolve(preparedContext);
-                    });
+        if (!dataSet.form) {
+            return;
+        }
+        this.getAdaptableInternalApi().showPopupForm({
+            Id: 'data-set-form',
+            Form: this.buildDataSetForm(dataSet),
+            prepareContext: (context) => {
+                return new Promise((resolve) => {
+                    const preparedContext = {
+                        ...context,
+                        dataSet,
+                    };
+                    resolve(preparedContext);
+                });
+            },
+        });
+    }
+    buildDataSetForm(dataSet) {
+        const sourceForm = dataSet.form;
+        if (!dataSet.onFormSubmit) {
+            return sourceForm;
+        }
+        const invokeOnFormSubmit = (context) => {
+            this.runDataSetHandler(() => dataSet.onFormSubmit(context), 'onFormSubmit', dataSet.name);
+        };
+        const onSubmit = (formData, context) => {
+            sourceForm.onSubmit?.(formData, context);
+            invokeOnFormSubmit({ ...context, formData, dataSet });
+        };
+        const buttons = sourceForm.buttons?.length > 0
+            ? sourceForm.buttons
+            : [
+                {
+                    label: 'OK',
+                    onClick: (_, context) => invokeOnFormSubmit({ ...context, dataSet }),
                 },
-            });
+            ];
+        return {
+            ...sourceForm,
+            onSubmit,
+            buttons,
+        };
+    }
+    runDataSetHandler(handler, handlerName, dataSetName) {
+        try {
+            const result = handler();
+            if (result != null && typeof result.then === 'function') {
+                result.catch((error) => {
+                    this.logError(`DataSet '${dataSetName}' ${handlerName} handler failed`, error);
+                });
+            }
+        }
+        catch (error) {
+            this.logError(`DataSet '${dataSetName}' ${handlerName} handler failed`, error);
         }
     }
 }

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

@@ -1,6 +1,8 @@
 import { ApiBase } from '../Implementation/ApiBase';
 import { AdaptableColumn } from '../../AdaptableState/Common/AdaptableColumn';
-import { BadgeStyle, BadgeStyleDefinition, CellColorRange, ColumnComparison, NumericStyledColumn, StyledColumn } from '../../AdaptableState/StyledColumnState';
+import { StyledColumn } from '../../AdaptableState/StyledColumnState';
+import { CellColorRange, ColumnComparison, NumericStyledColumn } from '../../AdaptableState/StyledColumns/Common/NumericStyledColumn';
+import { BadgeStyle, BadgeStyleDefinition } from '../../AdaptableState/StyledColumns/BadgeStyle';
 import { IRowNode } from 'ag-grid-enterprise';
 import { PredicateDefHandlerContext } from '../../types';
 export declare class StyledColumnInternalApi extends ApiBase {

package/src/Redux/Store/AdaptableStore.js

@@ -913,10 +913,12 @@ const adaptableMiddleware = (adaptable) => (function(middlewareAPI) {
                 case InternalRedux.DATA_SET_SELECT: {
                     let returnAction = next(action);
                     const dataSet = adaptable.api.dataSetApi.getCurrentDataSet();
-                    adaptable.api.eventApi.internalApi.fireDataSetSelectedEvent(dataSet);
-                    requestAnimationFrame(() => {
-                        adaptable.api.dataSetApi.internalApi.showDataSetForm(dataSet);
-                    });
+                    if (dataSet) {
+                        adaptable.api.dataSetApi.internalApi.handleDataSetSelected(dataSet);
+                        requestAnimationFrame(() => {
+                            adaptable.api.dataSetApi.internalApi.showDataSetForm(dataSet);
+                        });
+                    }
                     return returnAction;
                 }
                 /*******************

package/src/Strategy/CalculatedColumnModule.js

@@ -119,6 +119,7 @@ class CalculatedColumnModule extends AdaptableModuleBase_1.AdaptableModuleBase {
                 name: 'Settings',
                 label: 'Column Id',
                 values: [calculateColumn.ColumnId],
+                tagVariant: 'column',
             },
             calculateColumn.FriendlyName && {
                 name: 'Settings',