@adaptabletools/adaptable 13.1.0-canary.1 → 13.1.1-canary.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adaptabletools/adaptable",
-  "version": "13.1.0-canary.1",
+  "version": "13.1.1-canary.0",
   "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: 1668677727949;
+declare const _default: 1668783544579;
 export default _default;

package/publishTimestamp.js

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

package/src/AdaptableOptions/AlertOptions.d.ts

@@ -49,6 +49,10 @@ export interface AlertOptions {
      * @gridInfoItem
      */
     dataChangeDetectionPolicy?: 'rawValue' | 'formattedValue';
+    /**
+     * Function providing Title to display in Alert; if empty, AdapTable provides dynamically
+     */
+    alertMessageTitle?: (alertMessageContext: AlertMessageContext) => string | undefined;
     /**
      * Function providing Message to display in Alert; if empty, AdapTable provides dynamically
      */

package/src/AdaptableOptions/FinancePluginOptions.d.ts

@@ -83,10 +83,18 @@ export interface FDC3Column {
      * Should Column display a 'Broadcast' context menu item
      */
     showBroadcastContextMenu?: boolean;
+    /**
+     * Should Column display a 'Raise Intent for Context' context menu item
+     */
+    showRaiseIntentForContextMenu?: boolean;
     /**
      * Label to display in Broadcast Context Menu Item
      */
     broadcastContextMenuLabel?: string | ((broadcastFDC3MessageContext: ContextMenuContext) => string);
+    /**
+     * Label to display in RaiseIntentForContext Context Menu Item
+     */
+    raiseIntentForContextMenuLabel?: string | ((raiseFDC3IntentForContext: ContextMenuContext) => string);
     /**
      * FDC3 intents which the Column can raise
      */
@@ -281,6 +289,7 @@ export declare type FDC3ContextHandler = (context: FDC3Context) => void;
 export interface FDC3DesktopAgent {
     raiseIntent: (intent: FDC3Intent, context: FDC3Context) => void;
     broadcast: (context: FDC3Context) => void;
+    raiseIntentForContext: (context: FDC3Context) => void;
     addIntentListener: (intent: FDC3Intent | CustomFDC3Intent, listener: (context: FDC3Context) => void) => void;
     addContextListener: (contextType: string | null, handler: FDC3ContextHandler) => {
         unsubscribe: () => void;

package/src/Api/AlertApi.d.ts

@@ -163,6 +163,11 @@ export interface AlertApi {
      * @param alertDefinition Alert Definition to use
      */
     getAlertDescription(alertDefinition: AlertDefinition, cellDataChangedInfo?: CellDataChangedInfo): string;
+    /**
+     * Returns a description title of an Alert Definition
+     * @param alertDefinition Alert Definition to use
+     */
+    getAlertMessageTitle(alertDefinition: AlertDefinition, cellDataChangedInfo?: CellDataChangedInfo): string;
     /**
      * Returns a description of an Alert Definition's Rule
      * @param alertDefinition Alert Definition to use

package/src/Api/ColumnApi.d.ts

@@ -33,6 +33,20 @@ export interface ColumnApi {
      * Returns all boolean Columns
      */
     getBooleanColumns(): AdaptableColumn[];
+    /**
+     * Return all number-array columns
+     */
+    getNumberArrayColumns(): AdaptableColumn[];
+    /**
+     * Return all tuple-number-array columns
+     * e.g. [[1, 2], [3, 4]]
+     */
+    getTupleNumberArrayColumns(): AdaptableColumn[];
+    /**
+     * Return all object-number-array columns
+     * e.g. [{x : 1, y : 2}, {x : 3, y : 4}]
+     */
+    getObjectNumberArrayColumns(): AdaptableColumn[];
     /**
      * Returns all Sortable Columns
      */

package/src/Api/FinanceApi.d.ts

@@ -96,6 +96,11 @@ export interface FinanceApi {
      * @param context context for Event
      */
     publishBroadcastFDC3MessageEvent(context: FDC3Context): void;
+    /**
+     * Publishes an FDC3 Message Event of type `RaiseIntentForContext`
+     * @param context context for Event
+     */
+    publishRaiseFDC3IntentForContextEvent(context: FDC3Context): void;
     /**
      * Publishes an FDC3 Message Event of type `Raise Event`
      * @param context context for Event

package/src/Api/GridApi.d.ts

@@ -219,6 +219,7 @@ export interface GridApi {
      * @param primaryKeyValue Primary Key Value to look up
      */
     getRowNodeForPrimaryKey(primaryKeyValue: any): RowNode;
+    getRowNodeForIndex(rowIndex: number): RowNode | undefined;
     /**
      * Returns the Primary Kev Value for a given Row Node
      * @param rowNode rowNode to look up

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

@@ -41,6 +41,7 @@ export declare class AlertApiImpl extends ApiBase implements AlertApi {
     editAlertDefinition(alertDefinition: AlertDefinition): AlertDefinition;
     suspendAlertDefinition(alertDefinition: AlertDefinition): AlertDefinition;
     unSuspendAlertDefinition(alertDefinition: AlertDefinition): AlertDefinition;
+    getAlertMessageTitle(alertDefinition: AlertDefinition, cellDataChangedInfo?: CellDataChangedInfo): string | undefined;
     getAlertDescription(alertDefinition: AlertDefinition, cellDataChangedInfo?: CellDataChangedInfo): string;
     getAlertRuleDescription(alert: AlertDefinition): string;
     isCellChangedAdaptableAlert(alert: AdaptableAlert): boolean;

package/src/Api/Implementation/AlertApiImpl.js

@@ -300,6 +300,20 @@ class AlertApiImpl extends ApiBase_1.ApiBase {
         this.dispatchAction(AlertRedux.AlertDefinitionUnSuspend(alertDefinition));
         return this.getAlertDefinitionById(alertDefinition.Uuid);
     }
+    getAlertMessageTitle(alertDefinition, cellDataChangedInfo) {
+        var _a, _b;
+        const alertMessageFunction = (_a = this.adaptable.adaptableOptions.alertOptions) === null || _a === void 0 ? void 0 : _a.alertMessageTitle;
+        if (alertMessageFunction) {
+            const returnText = alertMessageFunction({ alertDefinition, cellDataChangedInfo });
+            if (returnText) {
+                return returnText;
+            }
+        }
+        if (alertDefinition.MessageHeader) {
+            return alertDefinition.MessageHeader;
+        }
+        return (_b = cellDataChangedInfo === null || cellDataChangedInfo === void 0 ? void 0 : cellDataChangedInfo.column) === null || _b === void 0 ? void 0 : _b.friendlyName;
+    }
     getAlertDescription(alertDefinition, cellDataChangedInfo) {
         var _a;
         const alertMessageFunction = (_a = this.adaptable.adaptableOptions.alertOptions) === null || _a === void 0 ? void 0 : _a.alertMessageText;

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

@@ -42,6 +42,9 @@ export declare class ColumnApiImpl extends ApiBase implements ColumnApi {
     getColumnFromFriendlyName(columnName: string, logWarning?: boolean): AdaptableColumn;
     getColumnsOfType(dataType: AdaptableColumnDataType): AdaptableColumn[];
     getNumericColumns(): AdaptableColumn[];
+    getNumberArrayColumns(): AdaptableColumn[];
+    getTupleNumberArrayColumns(): AdaptableColumn[];
+    getObjectNumberArrayColumns(): AdaptableColumn[];
     getStringColumns(): AdaptableColumn[];
     getDateColumns(): AdaptableColumn[];
     getBooleanColumns(): AdaptableColumn[];

package/src/Api/Implementation/ColumnApiImpl.js

@@ -238,6 +238,8 @@ class ColumnApiImpl extends ApiBase_1.ApiBase {
                 return this.getNumericColumns();
             case 'String':
                 return this.getStringColumns();
+            case 'NumberArray':
+                return this.getNumberArrayColumns();
             default:
                 return this.getColumns();
         }
@@ -245,6 +247,15 @@ class ColumnApiImpl extends ApiBase_1.ApiBase {
     getNumericColumns() {
         return this.getColumns().filter((c) => c.dataType == 'Number');
     }
+    getNumberArrayColumns() {
+        return this.getColumns().filter((c) => c.dataType == 'NumberArray');
+    }
+    getTupleNumberArrayColumns() {
+        return this.getColumns().filter((c) => c.dataType == 'TupleNumberArray');
+    }
+    getObjectNumberArrayColumns() {
+        return this.getColumns().filter((c) => c.dataType == 'ObjectNumberArray');
+    }
     getStringColumns() {
         return this.getColumns().filter((c) => c.dataType == 'String');
     }

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

@@ -71,6 +71,7 @@ export declare class GridApiImpl extends ApiBase implements GridApi {
     getRowNodesForPrimaryKeys(primaryKeyValues: any[]): RowNode[];
     getRowNodeForPrimaryKey(primaryKeyValue: any): RowNode;
     getPrimaryKeyValueForRowNode(rowNode: RowNode): any;
+    getRowNodeForIndex(index: number): RowNode<any>;
     getPrimaryKeyValuesForRowNodes(rowNodes: RowNode[]): any[];
     setRowGroupColumns(columnIds: string[]): void;
     clearRowGroupColumns(): void;

package/src/Api/Implementation/GridApiImpl.js

@@ -217,6 +217,9 @@ class GridApiImpl extends ApiBase_1.ApiBase {
     getPrimaryKeyValueForRowNode(rowNode) {
         return this.adaptable.getPrimaryKeyValueFromRowNode(rowNode);
     }
+    getRowNodeForIndex(index) {
+        return this.adaptable.getRowNodeByIndex(index);
+    }
     getPrimaryKeyValuesForRowNodes(rowNodes) {
         return rowNodes.map((rowNode) => this.getPrimaryKeyValueForRowNode(rowNode));
     }

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

@@ -144,4 +144,6 @@ export declare class InternalApiImpl extends ApiBase implements InternalApi {
     getEditLookUpValuesForColumn(editLookUpItem: EditLookUpPermittedValues, column: AdaptableColumn, gridCell?: GridCell): any[] | undefined;
     getAdaptableQueryExpressionText(query: Partial<AdaptableQuery>): string;
     deleteConditionalStyles(conditionalStyles: any[]): void;
+    getValueUsingField(rowData: Record<string, any>, column: AdaptableColumn): any;
+    setValueUsingField(rowData: Record<string, any>, column: AdaptableColumn, newValue: any): Record<string, any>;
 }

package/src/Api/Implementation/InternalApiImpl.js

@@ -663,5 +663,64 @@ class InternalApiImpl extends ApiBase_1.ApiBase {
             this.dispatchAction(DeadRedux.ConditionalStyleDelete(cs));
         });
     }
+    // "borrowed" from https://github.com/ag-grid/ag-grid/blob/v28.2.1/community-modules/core/src/ts/utils/object.ts#L205
+    getValueUsingField(rowData, column) {
+        var _a;
+        if (!rowData || !column) {
+            return;
+        }
+        const columnValueKey = (_a = column.field) !== null && _a !== void 0 ? _a : column.columnId;
+        const isColumnValueKeyContainsDots = columnValueKey === null || columnValueKey === void 0 ? void 0 : columnValueKey.includes('.');
+        // if no '.', then it's not a deep value
+        if (!isColumnValueKeyContainsDots) {
+            return rowData[columnValueKey];
+        }
+        // otherwise it is a deep value, so need to dig for it
+        const fields = columnValueKey.split('.');
+        let currentObject = rowData;
+        for (let i = 0; i < fields.length; i++) {
+            if (currentObject == null) {
+                return undefined;
+            }
+            currentObject = currentObject[fields[i]];
+        }
+        return currentObject;
+    }
+    // "borrowed" from https://github.com/ag-grid/ag-grid/blob/v28.2.1/community-modules/core/src/ts/valueService/valueService.ts#L236
+    setValueUsingField(rowData, column, newValue) {
+        var _a;
+        if (!rowData || !column) {
+            return;
+        }
+        const columnValueKey = (_a = column.field) !== null && _a !== void 0 ? _a : column.columnId;
+        const isColumnValueKeyContainsDots = columnValueKey === null || columnValueKey === void 0 ? void 0 : columnValueKey.includes('.');
+        let valuesAreSame = false;
+        if (!isColumnValueKeyContainsDots) {
+            // soft comparison to match strings and numbers
+            valuesAreSame = rowData[columnValueKey] == newValue;
+            if (!valuesAreSame) {
+                rowData[columnValueKey] = newValue;
+            }
+        }
+        else {
+            // otherwise it is a deep value, so need to dig for it
+            const fieldPieces = columnValueKey.split('.');
+            let currentObject = rowData;
+            while (fieldPieces.length > 0 && currentObject) {
+                const fieldPiece = fieldPieces.shift();
+                if (fieldPieces.length === 0) {
+                    // soft comparison to match strings and numbers
+                    valuesAreSame = currentObject[fieldPiece] == newValue;
+                    if (!valuesAreSame) {
+                        currentObject[fieldPiece] = newValue;
+                    }
+                }
+                else {
+                    currentObject = currentObject[fieldPiece];
+                }
+            }
+        }
+        return rowData;
+    }
 }
 exports.InternalApiImpl = InternalApiImpl;

package/src/Api/InternalApi.d.ts

@@ -71,6 +71,8 @@ export interface InternalApi {
     setModuleButtonMenuItems(menuItems: AdaptableMenuItem[]): void;
     setSelectedCells(selectedCellInfo: SelectedCellInfo): void;
     setSelectedRows(selectedRowInfo: SelectedRowInfo): void;
+    getValueUsingField(rowData: Record<string, any>, column: AdaptableColumn): any;
+    setValueUsingField(rowData: Record<string, any>, column: AdaptableColumn, newValue: any): any;
     setPivotModeOn(): void;
     setPivotModeOff(): void;
     isGridInPivotMode(): boolean;

package/src/PredefinedConfig/AlertState.d.ts

@@ -36,6 +36,10 @@ export interface AlertDefinition extends SuspendableObject {
      * Type of Alert: 'Info', 'Success', 'Warning', 'Error'; influences Alert colour, icon and logging
      */
     MessageType: AdaptableMessageType;
+    /**
+     * The Alert Title Message to display
+     */
+    MessageHeader?: string;
     /**
      * Alert Message; if not provided AdapTable creates dynamically using Rule & Scope (Note: can be provided as a function in AlertOptions)
      */

package/src/PredefinedConfig/Common/AdaptableColumn.d.ts

@@ -2,7 +2,7 @@ import { AdaptableObject } from './AdaptableObject';
 /**
  * Type of data stored in an Adaptable Column
  */
-export declare type AdaptableColumnDataType = 'String' | 'Number' | 'Boolean' | 'Date' | 'Object' | 'Unknown';
+export declare type AdaptableColumnDataType = 'String' | 'Number' | 'Boolean' | 'Date' | 'Object' | 'NumberArray' | 'TupleNumberArray' | 'ObjectNumberArray' | 'Unknown';
 /**
  * Base class for Adaptable Column containing most important properties
  */

package/src/PredefinedConfig/Common/FDC3Context.d.ts

@@ -219,9 +219,9 @@ export interface CountryContext extends FDC3Context {
  */
 export interface AdaptableFDC3EventInfo extends BaseEventInfo {
     /**
-     * Type of Event: `RaiseIntent` or `BroadcastMessage`
+     * Type of Event: `RaiseIntent`, `RaiseIntentForContext` or `BroadcastMessage`
      */
-    eventType: 'RaiseIntent' | 'BroadcastMessage';
+    eventType: 'RaiseIntent' | 'RaiseIntentForContext' | 'BroadcastMessage';
     /**
      * The FDC3 Intent which caused Event to fire (if type is `RaiseIntent`)
      */

package/src/PredefinedConfig/Common/Types.d.ts

@@ -36,4 +36,4 @@ export declare type TypeHint<Base, Literals> = (Base & {
 }) | Literals;
 export declare type AdaptableQLModules = AdaptableQLModule[];
 export declare type AdaptableQLModule = 'CalculatedColumn' | 'Filter' | 'Query';
-export declare type AdaptableColumnType = 'abColDefBoolean' | 'abColDefDate' | 'abColDefNumber' | 'abColDefString' | 'abColDefObject' | 'abColDefCustom' | 'abSpecialColumn';
+export declare type AdaptableColumnType = 'abColDefBoolean' | 'abColDefDate' | 'abColDefNumber' | 'abColDefString' | 'abColDefObject' | 'abColDefNumberArray' | 'abColDefTupleNumberArray' | 'abColDefObjectNumberArray' | 'abColDefCustom' | 'abSpecialColumn';

package/src/PredefinedConfig/StyledColumnState.d.ts

@@ -1,5 +1,6 @@
 import { ConfigState } from './ConfigState';
 import { SuspendableObject } from './Common/SuspendableObject';
+import { SparklineOptions } from '@ag-grid-community/core';
 /**
  * Predefined Configuration for Styled Column Module
  */
@@ -29,6 +30,7 @@ export interface StyledColumn extends SuspendableObject {
      * Renders a Checkbox in a boolean column
      */
     CheckBoxStyle?: boolean;
+    SparkLineStyle?: SparkLineStyle;
     /**
      * Includes the Styled Column in Grouped Rows
      * @defaultValue false
@@ -123,3 +125,6 @@ export declare type CellTextOption = 'CellValue' | 'PercentageValue';
  * Whether the Range is Number or Percent based
  */
 export declare type RangeValueType = 'Number' | 'Percentage';
+export declare type SparkLineStyle = {
+    options?: SparklineOptions;
+};

package/src/Strategy/AlertModule.js

@@ -172,7 +172,7 @@ class AlertModule extends AdaptableModuleBase_1.AdaptableModuleBase {
     }
     showAlertForDefinitions(cellDataChangedInfo, alertDefinitions = []) {
         alertDefinitions.forEach((alertDefinition) => {
-            const alert = ObjectFactory_1.default.CreateCellChangedAlert(cellDataChangedInfo.column.friendlyName, this.api.alertApi.getAlertDescription(alertDefinition, cellDataChangedInfo), alertDefinition, cellDataChangedInfo);
+            const alert = ObjectFactory_1.default.CreateCellChangedAlert(this.api.alertApi.getAlertMessageTitle(alertDefinition, cellDataChangedInfo), this.api.alertApi.getAlertDescription(alertDefinition, cellDataChangedInfo), alertDefinition, cellDataChangedInfo);
             this.api.alertApi.displayAlert(alert);
         });
     }

package/src/Strategy/FlashingCellModule.js

@@ -96,7 +96,7 @@ class FlashingCellModule extends AdaptableModuleBase_1.AdaptableModuleBase {
                 const flashingCellForCell = this.api.internalApi.getAdaptableFlashingCellFor(menuContext.primaryKeyValue, menuContext.adaptableColumn.columnId);
                 if (flashingCellForRow) {
                     if (flashingCellForRow.flashTarget === 'row' ||
-                        (Array.isArray(flashingCellForRow.flashTarget) &&
+                        (Array.isArray(flashingCellForRow === null || flashingCellForRow === void 0 ? void 0 : flashingCellForRow.flashTarget) &&
                             flashingCellForRow.flashTarget.includes('row'))) {
                         items.push(this.createColumnMenuItemReduxAction('Clear Flashing Row', this.moduleInfo.Glyph, SystemRedux.SystemFlashingCellDelete(flashingCellForRow)));
                     }

package/src/Strategy/StyledColumnModule.js

@@ -125,9 +125,12 @@ class StyledColumnModule extends AdaptableModuleBase_1.AdaptableModuleBase {
         else if (styledColumn.PercentBarStyle) {
             type = 'Percent Bar';
         }
-        else {
+        else if (styledColumn.CheckBoxStyle) {
             type = 'Check Box';
         }
+        else if (styledColumn.SparkLineStyle) {
+            type = 'Spark Line';
+        }
         return {
             abObject: styledColumn,
             items: [
@@ -139,7 +142,7 @@ class StyledColumnModule extends AdaptableModuleBase_1.AdaptableModuleBase {
                     name: 'Column',
                     values: [this.api.columnApi.getFriendlyNameFromColumnId(styledColumn.ColumnId)],
                 },
-                {
+                !styledColumn.SparkLineStyle && {
                     name: 'Style',
                     view: () => {
                         return (0, StyledColumnWizardStyleSection_1.renderStyledColumnStyleSummary)(styledColumn, this.api);

package/src/Utilities/Extensions/ObjectExtensions.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Returns a new object with the property updated.
+ * The property is identified by the path.
+ *
+ * @param obj Object
+ * @param path path to the property
+ * @param value new property value
+ * @returns
+ */
+export declare function setInPath<T>(obj: any, path: string[], value: any): T;

package/src/Utilities/Extensions/ObjectExtensions.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.setInPath = void 0;
+/**
+ * Returns a new object with the property updated.
+ * The property is identified by the path.
+ *
+ * @param obj Object
+ * @param path path to the property
+ * @param value new property value
+ * @returns
+ */
+function setInPath(obj, path, value) {
+    var _a;
+    if (path.length === 1) {
+        return Object.assign(Object.assign({}, obj), { [path[0]]: value });
+    }
+    return Object.assign(Object.assign({}, obj), { [path[0]]: setInPath((_a = obj === null || obj === void 0 ? void 0 : obj[path[0]]) !== null && _a !== void 0 ? _a : {}, path.slice(1), value) });
+}
+exports.setInPath = setInPath;

package/src/View/Alert/Wizard/AlertDisplayWizardSection.js

@@ -13,6 +13,7 @@ const AlertButtonsEditor_1 = require("./AlertButtonsEditor");
 const CodeBlock_1 = require("../../../components/CodeBlock");
 const AdaptableInput_1 = tslib_1.__importDefault(require("../../Components/AdaptableInput"));
 const join_1 = tslib_1.__importDefault(require("../../../components/utils/join"));
+const FormLayout_1 = tslib_1.__importStar(require("../../../components/FormLayout"));
 const DEFAULT_BUTTONS = [
     {
         Label: 'OK',
@@ -48,7 +49,7 @@ const AlertPreview = (_a) => {
         const Buttons = (((_a = alertForm === null || alertForm === void 0 ? void 0 : alertForm.Buttons) === null || _a === void 0 ? void 0 : _a.length) ? alertForm.Buttons : DEFAULT_BUTTONS).map(mapButtons);
         const result = {
             alertType: 'generic',
-            header: alertDefinition.MessageType,
+            header: api.alertApi.getAlertMessageTitle(alertDefinition),
             message: api.alertApi.getAlertDescription(alertDefinition),
             alertDefinition: Object.assign(Object.assign({}, alertDefinition), { AlertForm: Object.assign(Object.assign({}, alertForm), { Buttons }) }),
         };
@@ -59,10 +60,11 @@ const AlertPreview = (_a) => {
 };
 exports.AlertPreview = AlertPreview;
 const AlertDisplayWizardSection = (props) => {
-    var _a, _b, _c, _d;
+    var _a, _b, _c, _d, _e;
     const { data, api } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
     const messageType = data.MessageType;
     const messageText = api.alertApi.getAlertDescription(data);
+    const messageHeader = (_a = data.MessageHeader) !== null && _a !== void 0 ? _a : '';
     const adaptableAlert = {
         alertType: 'generic',
         header: data.MessageType,
@@ -73,6 +75,10 @@ const AlertDisplayWizardSection = (props) => {
         const { value } = e.target;
         props.onChange(Object.assign(Object.assign({}, data), { MessageText: value }));
     };
+    const onMessageHeaderChange = (e) => {
+        const { value } = e.target;
+        props.onChange(Object.assign(Object.assign({}, data), { MessageHeader: value }));
+    };
     return (React.createElement(React.Fragment, null,
         React.createElement(Tabs_1.Tabs, { "data-name": "message-type" },
             React.createElement(Tabs_1.Tabs.Tab, null, "Message Type"),
@@ -89,23 +95,25 @@ const AlertDisplayWizardSection = (props) => {
             React.createElement(Tabs_1.Tabs.Content, null,
                 React.createElement(rebass_1.Text, { fontSize: 2, mt: 3, mb: 2 }, "The text to display as the Alert Message (leave blank to show automated Message based on Trigger and Condition)"),
                 ' ',
-                React.createElement(AdaptableInput_1.default, { marginTop: 2, type: 'text', autoFocus: false, value: messageText, 
-                    // onChange={(e: any) => onPredicateInputChange(e, index)}
-                    onChange: (e) => onMessageTextChange(e) }))),
+                React.createElement(FormLayout_1.default, null,
+                    React.createElement(FormLayout_1.FormRow, { label: "Header" },
+                        React.createElement(AdaptableInput_1.default, { marginTop: 2, type: 'text', autoFocus: false, value: messageHeader, onChange: (e) => onMessageHeaderChange(e) })),
+                    React.createElement(FormLayout_1.FormRow, { label: "Message" },
+                        React.createElement(AdaptableInput_1.default, { marginTop: 2, type: 'text', autoFocus: false, value: messageText, onChange: (e) => onMessageTextChange(e) }))))),
         React.createElement(Tabs_1.Tabs, { "data-name": "display-options", mt: 2, mb: 3, autoFocus: false },
             React.createElement(Tabs_1.Tabs.Tab, null, "Display options"),
             React.createElement(Tabs_1.Tabs.Content, null,
-                React.createElement(CheckBox_1.CheckBox, { checked: (_a = data.AlertProperties) === null || _a === void 0 ? void 0 : _a.DisplayNotification, onChange: (DisplayNotification) => {
+                React.createElement(CheckBox_1.CheckBox, { checked: (_b = data.AlertProperties) === null || _b === void 0 ? void 0 : _b.DisplayNotification, onChange: (DisplayNotification) => {
                         const newAlertDefinition = Object.assign(Object.assign({}, data), { AlertProperties: Object.assign(Object.assign({}, data.AlertProperties), { DisplayNotification }) });
                         if (!DisplayNotification && typeof newAlertDefinition.AlertForm === 'object') {
                             delete newAlertDefinition.AlertForm.Buttons;
                         }
                         props.onChange(newAlertDefinition);
                     } }, "Show a Notification when Alert is triggered (with action buttons)"),
-                ((_b = data.AlertProperties) === null || _b === void 0 ? void 0 : _b.DisplayNotification) ? (typeof data.AlertForm === 'string' ? (React.createElement(rebass_1.Text, { fontSize: 2 }, "Alert buttons cannot be customized because form is dynamically driven")) : (React.createElement(AlertButtonsEditor_1.AlertButtonsEditor, { AlertButtons: ((_c = data.AlertForm) === null || _c === void 0 ? void 0 : _c.Buttons) || DEFAULT_BUTTONS, api: api, adaptableAlert: adaptableAlert, onChange: (buttons) => {
+                ((_c = data.AlertProperties) === null || _c === void 0 ? void 0 : _c.DisplayNotification) ? (typeof data.AlertForm === 'string' ? (React.createElement(rebass_1.Text, { fontSize: 2 }, "Alert buttons cannot be customized because form is dynamically driven")) : (React.createElement(AlertButtonsEditor_1.AlertButtonsEditor, { AlertButtons: ((_d = data.AlertForm) === null || _d === void 0 ? void 0 : _d.Buttons) || DEFAULT_BUTTONS, api: api, adaptableAlert: adaptableAlert, onChange: (buttons) => {
                         props.onChange(Object.assign(Object.assign({}, data), { AlertForm: Object.assign(Object.assign({}, data.AlertForm), { Buttons: buttons }) }));
                     } }))) : null)),
-        ((_d = data.AlertProperties) === null || _d === void 0 ? void 0 : _d.DisplayNotification) ? (React.createElement(Tabs_1.Tabs, { "data-name": "alert-preview", autoFocus: false },
+        ((_e = data.AlertProperties) === null || _e === void 0 ? void 0 : _e.DisplayNotification) ? (React.createElement(Tabs_1.Tabs, { "data-name": "alert-preview", autoFocus: false },
             React.createElement(Tabs_1.Tabs.Tab, null, "Alert preview"),
             React.createElement(Tabs_1.Tabs.Content, null, typeof data.AlertForm === 'string' ? (React.createElement(rebass_1.Text, { fontSize: 2 }, "Preview not available because form is dynamically driven")) : (React.createElement(exports.AlertPreview, { alertDefinition: data, api: api }))))) : null));
 };

package/src/View/Components/FilterForm/ListBoxFilterForm.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { AdaptableColumn } from '../../../PredefinedConfig/Common/AdaptableColumn';
+import { AdaptableColumn, AdaptableColumnDataType } from '../../../PredefinedConfig/Common/AdaptableColumn';
 import { ListGroupProps } from '../../../components/List/ListGroup';
 export interface ListBoxFilterFormProps extends ListGroupProps {
     currentColumn: AdaptableColumn;
@@ -11,7 +11,7 @@ export interface ListBoxFilterFormProps extends ListGroupProps {
     }[];
     uiSelectedColumnValues: Array<string>;
     onColumnValueSelectedChange: (SelectedValues: Array<any>) => void;
-    dataType: 'String' | 'Number' | 'NumberArray' | 'Boolean' | 'Date' | 'Object' | 'Unknown';
+    dataType: AdaptableColumnDataType;
     isLoading?: boolean;
     suppressClientSideFilter?: boolean;
     onFilterChange?: (filter: string) => void;

package/src/View/StyledColumn/Wizard/StyledColumnSparklineSettingsSection.d.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+import { StyledColumn } from '../../../types';
+export interface StyledColumnSparklineSettingsSectionProps {
+    onChange: (data: StyledColumn) => void;
+}
+export declare const StyledColumnSparklineSettingsSection: React.FunctionComponent<StyledColumnSparklineSettingsSectionProps>;