@adaptabletools/adaptable 13.0.9 → 13.1.0-canary.0

package/src/agGrid/Adaptable.js

@@ -63,6 +63,7 @@ const RowEditService_1 = require("../Utilities/Services/RowEditService");
 const weightedAverage_1 = require("./weightedAverage");
 const AggregationColumns_1 = require("../PredefinedConfig/Common/AggregationColumns");
 const renderReactRoot_1 = require("../renderReactRoot");
+const ChartingService_1 = require("../Utilities/Services/ChartingService");
 const tinycolor = require('tinycolor2');
 const GROUP_PATH_SEPARATOR = '/';
 // IMPORTANT - we need colId to be set in order for safeSetColDefs to work correctly
@@ -423,6 +424,7 @@ class Adaptable {
         this.initStore();
         // create the services
         this.LicenseService = this.initLicenseService();
+        this.ChartingService = new ChartingService_1.ChartingService(this.api);
         this.ValidationService = new ValidationService_1.ValidationService(this.api);
         this.ReportService = new ReportService_1.ReportService(this.api);
         this.ModuleService = new ModuleService_1.ModuleService(this.api);
@@ -1920,11 +1922,11 @@ class Adaptable {
         const pkValue = this.getPrimaryKeyValueFromRowNode(rowNode);
         const rawValue = this.getRawValueFromRowNode(rowNode, columnId);
         const displayValue = this.getDisplayValueFromRawValue(rowNode, columnId, rawValue);
-        const normalisedvalue = this.getNormalisedValueFromRowValue(rawValue, abColumn);
+        const normalisedValue = this.getNormalisedValueFromRawValue(rawValue, abColumn);
         return {
             rawValue: rawValue,
             displayValue: displayValue,
-            normalisedValue: normalisedvalue,
+            normalisedValue: normalisedValue,
             column: abColumn,
             primaryKeyValue: pkValue,
             rowNode: rowNode,
@@ -1985,7 +1987,7 @@ class Adaptable {
         };
         return formatterFn(params);
     }
-    getNormalisedValueFromRowValue(rawValue, column) {
+    getNormalisedValueFromRawValue(rawValue, column) {
         if (!column) {
             return rawValue;
         }
@@ -2306,7 +2308,7 @@ class Adaptable {
                         adaptableApi: context.adaptableApi,
                     };
                     this.api.eventApi.emit('ActionRowSubmitted', eventInfo);
-                    (_b = (_a = this.adaptableOptions.actionOptions.actionRowFormOptions).onFormSubmit) === null || _b === void 0 ? void 0 : _b.call(_a, eventInfo);
+                    (_b = (_a = this.adaptableOptions.actionOptions.actionRowButtonOptions.actionRowFormOptions).onFormSubmit) === null || _b === void 0 ? void 0 : _b.call(_a, eventInfo);
                 },
             },
         };
@@ -2318,7 +2320,7 @@ class Adaptable {
                 // should NOT happen unless the user sent some invalid button type in the predefined config
                 return;
             }
-            const customButtonConfig = (_b = (_a = this.adaptableOptions.actionOptions).actionRowButtonCustomConfiguration) === null || _b === void 0 ? void 0 : _b.call(_a, {
+            const customButtonConfig = (_b = (_a = this.adaptableOptions.actionOptions.actionRowButtonOptions).customConfiguration) === null || _b === void 0 ? void 0 : _b.call(_a, {
                 adaptableApi: this.api,
                 actionRowButtonType,
             });
@@ -2349,7 +2351,7 @@ class Adaptable {
                 filter: false,
                 sortable: false,
                 enableRowGroup: false,
-                pinned: this.adaptableOptions.actionOptions.actionRowButtonsPosition === 'pinnedRight'
+                pinned: this.adaptableOptions.actionOptions.actionRowButtonOptions.position === 'pinnedRight'
                     ? 'right'
                     : 'left',
                 cellRenderer: this.variant === 'react' ? ActionColumnRenderer_1.ReactActionColumnRenderer : ActionColumnRenderer_1.ActionColumnRenderer,
@@ -2920,6 +2922,23 @@ class Adaptable {
                 }
             }
         }));
+        const eventsThatTriggerChartingChanges = [
+            core_1.Events.EVENT_CHART_CREATED,
+            /** Chart Range selection has changed */
+            core_1.Events.EVENT_CHART_RANGE_SELECTION_CHANGED,
+            /** Chart Options have changed */
+            core_1.Events.EVENT_CHART_OPTIONS_CHANGED,
+            /** Chart was destroyed */
+            core_1.Events.EVENT_CHART_DESTROYED,
+        ];
+        const chartingModule = this.ModuleService.getModuleById('Charting');
+        if (chartingModule.isModuleAvailable()) {
+            this.gridOptions.api.addGlobalListener((type, params) => {
+                if (ArrayExtensions_1.ArrayExtensions.ContainsItem(eventsThatTriggerChartingChanges, type)) {
+                    this.ChartingService.onChartModelChange(this.getChartModels(), type, params);
+                }
+            });
+        }
         /**
          * Row and Cell listeners created in 2020
          * These have supplanted many of the events we previously had and simplified things
@@ -3685,7 +3704,7 @@ class Adaptable {
             this.resetMinMaxCachedValueForColumn(cellDataChangedInfo.column);
         });
         // if node is visible then check if need to refresh other columns / whole row if the updating column is:
-        // 1. referenced in Conditional Styles that have Expressions (refreshing whole row if Scope is All)
+        // 1. referenced in Format Column Styles that have Expressions (refreshing whole row if Scope is All)
         // 2. referenced in Format Column styles that use Column Comparisons (which might also be calculated columns)
         if (this.isVisibleNode(firstInfo.rowNode)) {
             let dataChangedScope = {
@@ -4476,6 +4495,7 @@ import "@adaptabletools/adaptable/themes/${themeName}.css"`);
                     const cellParams = {
                         colDef,
                         node,
+                        column,
                         data: node.data,
                         value: this.getRawValueFromRowNode(node, column.getId()),
                         rowIndex,
@@ -4500,7 +4520,7 @@ import "@adaptabletools/adaptable/themes/${themeName}.css"`);
                     if (userDefinedExcelStyle) {
                         excelStyles.push(userDefinedExcelStyle);
                     }
-                    // add adaptable derived styles (format column, conditional style etc.)
+                    // add adaptable derived styles (format column etc.)
                     const adaptableStyle = Object.assign(Object.assign({}, rowStyle), Object.keys(cellStyle).reduce((result, key) => {
                         if (cellStyle[key] !== null) {
                             result[key] = cellStyle[key];
@@ -4671,12 +4691,27 @@ import "@adaptabletools/adaptable/themes/${themeName}.css"`);
             publishedAt: publishTimestamp_1.default,
         });
     }
-    showCharts(charts) {
+    showCharts(chartsDefinitions, chartContainer) {
+        return chartsDefinitions.map((chartDefinition) => this.showChart(chartDefinition, chartContainer));
+    }
+    showChart(chartDefinition, container) {
         if (!this.gridOptions.api) {
-            (0, LoggingHelper_1.ConsoleLogError)('Adaptable must be instantiated before calling showCharts');
-            return [];
+            (0, LoggingHelper_1.ConsoleLogError)('Adaptable must be instantiated before calling showChart');
+            return null;
         }
-        return charts.map((chart) => this.gridOptions.api.restoreChart(chart));
+        /**
+         * Ag-grid always creates new charts behind the sences.
+         * So we need to update the model inside adaptable state.
+         * This is important to be done as soon as possible so it is not considered new.
+         */
+        const chartRef = this.gridOptions.api.restoreChart(chartDefinition.Model, container);
+        const chartModel = this.getChartModels().find((chartModel) => chartModel.chartId === chartRef.chartId);
+        // Update the definition in state so it is not considered new
+        this.api.chartingApi.editChartDefinition(Object.assign(Object.assign({}, chartDefinition), { Model: chartModel }));
+        return chartRef;
+    }
+    getChartRef(chartId) {
+        return this.gridOptions.api.getChartRef(chartId);
     }
     getChartModels() {
         if (!this.gridOptions.api) {

package/src/agGrid/agGridHelper.js

@@ -80,7 +80,6 @@ class agGridHelper {
         modules.set(ModuleConstants.BulkUpdateModuleId, new BulkUpdateModule_1.BulkUpdateModule(api));
         modules.set(ModuleConstants.CalculatedColumnModuleId, new CalculatedColumnModule_1.CalculatedColumnModule(api));
         modules.set(ModuleConstants.CellSummaryModuleId, new CellSummaryModule_1.CellSummaryModule(api));
-        //  modules.set(ModuleConstants.ConditionalStyleModuleId, new ConditionalStyleModule(api));
         modules.set(ModuleConstants.CustomSortModuleId, new CustomSortModule_1.CustomSortModule(api));
         modules.set(ModuleConstants.DataChangeHistoryModuleId, new DataChangeHistoryModule_1.DataChangeHistoryModule(api));
         modules.set(ModuleConstants.DataSetModuleId, new DataSetModule_1.DataSetModule(api));

package/src/{View → components/ColorPicker}/ColorPicker.d.ts

@@ -1,10 +1,11 @@
 import * as React from 'react';
 import { HTMLProps } from 'react';
 import { BoxProps } from 'rebass';
-import { AdaptableApi } from '../Api/AdaptableApi';
+import { AdaptableApi } from '../../Api/AdaptableApi';
 export declare type ColorPickerProps = Omit<HTMLProps<HTMLInputElement>, 'onChange'> & {
     api: AdaptableApi;
     onChange: (color: string) => void;
     value: string;
+    includeAlpha?: boolean;
 } & Omit<BoxProps, 'onChange'>;
-export declare const ColorPicker: React.ForwardRefExoticComponent<Pick<ColorPickerProps, "max" | "required" | "type" | "data" | "default" | "high" | "low" | "key" | "id" | "media" | "height" | "width" | "start" | "open" | "name" | "alignContent" | "alignItems" | "alignSelf" | "backgroundColor" | "color" | "content" | "display" | "flex" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "justifyContent" | "justifyItems" | "justifySelf" | "letterSpacing" | "lineHeight" | "margin" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "opacity" | "order" | "overflow" | "overflowX" | "overflowY" | "padding" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "textAlign" | "translate" | "verticalAlign" | "value" | "hidden" | "cite" | "dir" | "form" | "label" | "p" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "acceptCharset" | "action" | "method" | "noValidate" | "target" | "accessKey" | "draggable" | "lang" | "className" | "prefix" | "children" | "contentEditable" | "inputMode" | "nonce" | "tabIndex" | "async" | "disabled" | "multiple" | "size" | "manifest" | "m" | "wrap" | "accept" | "allowFullScreen" | "allowTransparency" | "alt" | "as" | "autoComplete" | "autoFocus" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "checked" | "classID" | "cols" | "colSpan" | "controls" | "coords" | "crossOrigin" | "dateTime" | "defer" | "download" | "encType" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "list" | "loop" | "marginHeight" | "marginWidth" | "maxLength" | "mediaGroup" | "min" | "minLength" | "muted" | "optimum" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "contextMenu" | "placeholder" | "spellCheck" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "sizes" | "src" | "srcDoc" | "srcLang" | "srcSet" | "step" | "useMap" | "wmode" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "api" | "bg" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "css" | "variant" | "tx" | "sx"> & React.RefAttributes<unknown>>;
+export declare const ColorPicker: React.ForwardRefExoticComponent<Pick<ColorPickerProps, "max" | "required" | "type" | "data" | "default" | "high" | "low" | "key" | "id" | "media" | "height" | "width" | "start" | "open" | "name" | "alignContent" | "alignItems" | "alignSelf" | "backgroundColor" | "color" | "content" | "display" | "flex" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "justifyContent" | "justifyItems" | "justifySelf" | "letterSpacing" | "lineHeight" | "margin" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "opacity" | "order" | "overflow" | "overflowX" | "overflowY" | "padding" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "textAlign" | "translate" | "verticalAlign" | "value" | "hidden" | "cite" | "dir" | "form" | "label" | "p" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "acceptCharset" | "action" | "method" | "noValidate" | "target" | "accessKey" | "draggable" | "lang" | "className" | "prefix" | "children" | "contentEditable" | "inputMode" | "nonce" | "tabIndex" | "async" | "disabled" | "multiple" | "size" | "manifest" | "m" | "wrap" | "accept" | "allowFullScreen" | "allowTransparency" | "alt" | "as" | "autoComplete" | "autoFocus" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "checked" | "classID" | "cols" | "colSpan" | "controls" | "coords" | "crossOrigin" | "dateTime" | "defer" | "download" | "encType" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "list" | "loop" | "marginHeight" | "marginWidth" | "maxLength" | "mediaGroup" | "min" | "minLength" | "muted" | "optimum" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "contextMenu" | "placeholder" | "spellCheck" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "sizes" | "src" | "srcDoc" | "srcLang" | "srcSet" | "step" | "useMap" | "wmode" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "api" | "bg" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "css" | "variant" | "tx" | "sx" | "includeAlpha"> & React.RefAttributes<unknown>>;

package/src/{View → components/ColorPicker}/ColorPicker.js

@@ -3,12 +3,13 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.ColorPicker = void 0;
 const tslib_1 = require("tslib");
 const React = tslib_1.__importStar(require("react"));
-const Input_1 = tslib_1.__importDefault(require("../components/Input"));
-const StyleHelper_1 = require("../Utilities/Helpers/StyleHelper");
+const rebass_1 = require("rebass");
+const Input_1 = tslib_1.__importDefault(require("../Input"));
+const StyleHelper_1 = require("../../Utilities/Helpers/StyleHelper");
 const tinycolor = require('tinycolor2');
 exports.ColorPicker = React.forwardRef((props, ref) => {
     const ColorPalette = props.api.userInterfaceApi.getColorPalette();
-    let { api, value } = props, restProps = tslib_1.__rest(props, ["api", "value"]);
+    let { api, value, includeAlpha = true } = props, restProps = tslib_1.__rest(props, ["api", "value", "includeAlpha"]);
     const optionsMap = ColorPalette.reduce((acc, colorItem) => (Object.assign(Object.assign({}, acc), { [(0, StyleHelper_1.getVariableColor)(colorItem)]: colorItem })), {});
     const ABcolorChoicesOptions = Object.keys(optionsMap).map((x) => {
         return (React.createElement("option", { key: x, value: x }, x));
@@ -18,8 +19,14 @@ exports.ColorPicker = React.forwardRef((props, ref) => {
         const color = (0, StyleHelper_1.getVariableColor)(value);
         return tinycolor(color).toHexString();
     }, [value]);
-    return (React.createElement("div", { className: 'ColorPicker' },
-        React.createElement(Input_1.default, Object.assign({}, restProps, { onChange: (event) => {
+    const preparedAlphaColor = React.useMemo(() => {
+        const color = (0, StyleHelper_1.getVariableColor)(value);
+        return [tinycolor(color).setAlpha(0).toRgbString(), tinycolor(color).setAlpha(1).toRgbString()];
+    }, [value]);
+    const rangeBackround = `linear-gradient(90deg, ${preparedAlphaColor[0]} 0%, ${preparedAlphaColor[1]} 100%)`;
+    const alpha = tinycolor(value).getAlpha();
+    return (React.createElement(rebass_1.Flex, { className: 'ColorPicker' },
+        React.createElement(Input_1.default, Object.assign({}, restProps, { mr: 2, onChange: (event) => {
                 var _a;
                 /**
                  * The value is not in the map when the color is not in the palette.
@@ -30,5 +37,11 @@ exports.ColorPicker = React.forwardRef((props, ref) => {
                 width: 70,
                 padding: 0 /* we need this to be 0, since otherwise on Windows browsers, the chosen color cannot be seen */,
             }, list: "ABcolorChoices" })),
-        ABcolorChoices));
+        ABcolorChoices,
+        includeAlpha && (React.createElement(rebass_1.Flex, { alignItems: "center" },
+            React.createElement(rebass_1.Box, { mr: 1 }, "Opacity"),
+            React.createElement(Input_1.default, { className: "ab-ColorPicker-range", style: { background: rangeBackround }, value: alpha, onChange: (event) => {
+                    const color = tinycolor(value).setAlpha(event.target.value).toRgbString();
+                    props.onChange(color);
+                }, min: 0, max: 1, step: 0.1, type: "range" })))));
 });

package/src/components/ColorPicker/index.d.ts

@@ -0,0 +1 @@
+export * from './ColorPicker';

package/src/components/ColorPicker/index.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./ColorPicker"), exports);

package/src/components/ExpressionEditor/BaseEditorInput.js

@@ -103,7 +103,7 @@ function BaseEditorInput(props) {
             props.onSelectedFunctionChange(selectedFunctionName ? expressionFunctions[selectedFunctionName] : null);
         }
     }, [selectedFunctionName]);
-    const functionsDropdown = (React.createElement(OverlayTrigger_1.default, { render: () => (React.createElement(rebass_1.Flex, { className: `${baseClassName}__dropdown-functions-list`, "data-name": "expression-dropdown-fuctions-list", flexDirection: "column", p: 2 }, Object.keys(expressionFunctions)
+    const functionsDropdown = (React.createElement(OverlayTrigger_1.default, { render: () => (React.createElement(rebass_1.Flex, { className: `${baseClassName}__dropdown-functions-list`, "data-name": "expression-dropdown-fuctions-list", flexDirection: "column", p: 2, maxHeight: '50vh' }, Object.keys(expressionFunctions)
             .filter((functionName) => !expressionFunctions[functionName].isHiddenFromMenu)
             .map((functionName) => functionName === 'VAR' ? (React.createElement(VarEditorButton, { key: functionName })) : (React.createElement(EditorButton_1.default, { data: `${functionName}()`, key: functionName, mr: 1 }, functionName))))), showEvent: "focus", hideEvent: "blur" },
         React.createElement(SimpleButton_1.default, { "data-name": "expression-dropdown", icon: "arrow-down", iconPosition: 'end', mr: 1 },

package/src/components/icons/index.js

@@ -32,7 +32,6 @@ const export_1 = tslib_1.__importDefault(require("./export"));
 const campaign_1 = tslib_1.__importDefault(require("./campaign"));
 const build_1 = tslib_1.__importDefault(require("./build"));
 const warning_1 = tslib_1.__importDefault(require("./warning"));
-const conditional_style_1 = tslib_1.__importDefault(require("./conditional-style"));
 const dashboard_1 = tslib_1.__importDefault(require("./dashboard"));
 const undo_1 = tslib_1.__importDefault(require("./undo"));
 const fast_forward_1 = tslib_1.__importDefault(require("./fast-forward"));
@@ -169,7 +168,6 @@ const allIcons = {
     'calculated-column': calculated_column_1.default,
     calendar: calendar_1.default,
     'cell-validation': cell_validation_1.default,
-    'conditional-style': conditional_style_1.default,
     chat: chat_1.default,
     'custom-sort': custom_sort_1.default,
     dashboard: dashboard_1.default,

package/src/metamodel/adaptable.metamodel.d.ts

@@ -90,32 +90,32 @@ export declare const ADAPTABLE_METAMODEL: {
         kind: string;
         description: string;
         properties: ({
-            name: string;
-            kind: string;
-            description: string;
-            uiLabel: string;
-            isOptional: boolean;
-            defaultValue?: undefined;
-            reference?: undefined;
-        } | {
             name: string;
             kind: string;
             description: string;
             uiLabel: string;
             isOptional: boolean;
             defaultValue: string;
-            reference?: undefined;
         } | {
             name: string;
             kind: string;
             description: string;
             uiLabel: string;
             isOptional: boolean;
-            reference: string;
             defaultValue?: undefined;
         })[];
     };
-    ActionRowContext: {
+    ActionRowButtonConfigurationContext: {
+        name: string;
+        kind: string;
+        description: string;
+    };
+    ActionRowButtonType: {
+        name: string;
+        kind: string;
+        description: string;
+    };
+    ActionRowFormContext: {
         name: string;
         kind: string;
         description: string;
@@ -140,6 +140,16 @@ export declare const ADAPTABLE_METAMODEL: {
             defaultValue: string;
         })[];
     };
+    ActionRowParamContext: {
+        name: string;
+        kind: string;
+        description: string;
+    };
+    ActionRowParamFieldContext: {
+        name: string;
+        kind: string;
+        description: string;
+    };
     ActionRowSubmittedInfo: {
         name: string;
         kind: string;
@@ -1485,13 +1495,24 @@ export declare const ADAPTABLE_METAMODEL: {
         name: string;
         kind: string;
         description: string;
-        properties: {
+        properties: ({
             name: string;
             kind: string;
             description: string;
             uiLabel: string;
             reference: string;
-        }[];
+        } | {
+            name: string;
+            kind: string;
+            description: string;
+            uiLabel: string;
+            reference?: undefined;
+        })[];
+    };
+    ChartingAggFunc: {
+        name: string;
+        kind: string;
+        description: string;
     };
     ChartingApi: {
         name: string;
@@ -1504,6 +1525,26 @@ export declare const ADAPTABLE_METAMODEL: {
             uiLabel: string;
         }[];
     };
+    ChartingOptions: {
+        name: string;
+        kind: string;
+        description: string;
+        properties: ({
+            name: string;
+            kind: string;
+            description: string;
+            uiLabel: string;
+            isOptional: boolean;
+            defaultValue?: undefined;
+        } | {
+            name: string;
+            kind: string;
+            description: string;
+            uiLabel: string;
+            isOptional: boolean;
+            defaultValue: string;
+        })[];
+    };
     ChartingState: {
         name: string;
         kind: string;
@@ -1829,7 +1870,7 @@ export declare const ADAPTABLE_METAMODEL: {
         kind: string;
         description: string;
     };
-    CreateActionRowContext: {
+    CreateActionRowFormContext: {
         name: string;
         kind: string;
         description: string;
@@ -2429,7 +2470,7 @@ export declare const ADAPTABLE_METAMODEL: {
             reference?: undefined;
         })[];
     };
-    EditActionRowContext: {
+    EditActionRowFormContext: {
         name: string;
         kind: string;
         description: string;
@@ -2946,13 +2987,21 @@ export declare const ADAPTABLE_METAMODEL: {
         name: string;
         kind: string;
         description: string;
-        properties: {
+        properties: ({
             name: string;
             kind: string;
             description: string;
             uiLabel: string;
             isOptional: boolean;
-        }[];
+            defaultValue: string;
+        } | {
+            name: string;
+            kind: string;
+            description: string;
+            uiLabel: string;
+            isOptional: boolean;
+            defaultValue?: undefined;
+        })[];
     };
     FinsembleApi: {
         name: string;