@adaptabletools/adaptable 13.0.0-canary.3 → 13.0.0-canary.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adaptabletools/adaptable",
-  "version": "13.0.0-canary.3",
+  "version": "13.0.0-canary.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: 1663245222592;
+declare const _default: 1663256074117;
 export default _default;

package/publishTimestamp.js

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

package/src/AdaptableOptions/GeneralOptions.d.ts

@@ -65,6 +65,12 @@ export interface GeneralOptions {
      * Value to use for 'Unbalanced Groups' (string columns)
      */
     unbalancedGroupsKey?: string | ((context: UnbalancedGroupsKeyContext) => string);
+    /**
+     * Starting with v13, ConditionalStyle module is deprecated, and it's functionality is merged into the FormatColumn module. By default, all existing conditional styles are migrated to format columns. By setting this property to TRUE, the conditional styles are not migrated.
+     *
+     * @defaultValue false
+     */
+    keepDeprecatedConditionalStyles?: boolean;
 }
 /**
  * Comparer object for Column Values - used for custom sorting

package/src/Api/Implementation/ColumnApiImpl.js

@@ -89,13 +89,13 @@ class ColumnApiImpl extends ApiBase_1.ApiBase {
         return false;
     }
     isNumericColumn(column) {
-        return column.dataType == 'Number';
+        return (column === null || column === void 0 ? void 0 : column.dataType) == 'Number';
     }
     isBooleanColumn(column) {
-        return column.dataType == 'Boolean';
+        return (column === null || column === void 0 ? void 0 : column.dataType) == 'Boolean';
     }
     isDateColumn(column) {
-        return column.dataType == 'Date';
+        return (column === null || column === void 0 ? void 0 : column.dataType) == 'Date';
     }
     getColumnDataTypeFromColumnId(columnId) {
         const column = this.getColumnFromId(columnId); // this.getColumns().find(c => c.ColumnId == columnId);

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

@@ -142,4 +142,5 @@ export declare class InternalApiImpl extends ApiBase implements InternalApi {
     getValueForTag(adaptableObjectTag: AdaptableObjectTag): string | number;
     getEditLookUpValuesForColumn(editLookUpItem: EditLookUpPermittedValues, column: AdaptableColumn, gridCell?: GridCell): any[] | undefined;
     getAdaptableQueryExpressionText(query: Partial<AdaptableQuery>): string;
+    shouldKeepDeprecatedConditionalStyles(): boolean;
 }

package/src/Api/Implementation/InternalApiImpl.js

@@ -650,5 +650,9 @@ class InternalApiImpl extends ApiBase_1.ApiBase {
             ? this.adaptable.api.queryLanguageApi.getAdaptableQueryExpressionWithColumnFriendlyNames(query)
             : this.adaptable.api.queryLanguageApi.getAdaptableQueryExpression(query);
     }
+    shouldKeepDeprecatedConditionalStyles() {
+        var _a, _b;
+        return (_b = (_a = this.getOptions()) === null || _a === void 0 ? void 0 : _a.generalOptions) === null || _b === void 0 ? void 0 : _b.keepDeprecatedConditionalStyles;
+    }
 }
 exports.InternalApiImpl = InternalApiImpl;

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

@@ -3,7 +3,7 @@ import { ToolPanelApi } from '../ToolPanelApi';
 import { ToolPanelState, ToolPanelVisibilityMode } from '../../PredefinedConfig/ToolPanelState';
 import { CustomToolPanel, ToolPanelButtonContext } from '../../AdaptableOptions/ToolPanelOptions';
 import { AdaptableButton } from '../../PredefinedConfig/Common/AdaptableButton';
-import { AdaptableToolPanel } from '../../PredefinedConfig/Common/Types';
+import { AdaptableModuleButtons, AdaptableToolPanel } from '../../PredefinedConfig/Common/Types';
 export declare class ToolPanelApiImpl extends ApiBase implements ToolPanelApi {
     getToolPanelState(): ToolPanelState;
     showToolPanelPopup(): void;
@@ -14,6 +14,8 @@ export declare class ToolPanelApiImpl extends ApiBase implements ToolPanelApi {
     getCustomToolPanelByName(name: string): CustomToolPanel | undefined;
     setAdaptableToolPanelVisibilityMode(adaptableToolPanel: AdaptableToolPanel, visibilityMode: ToolPanelVisibilityMode): void;
     setCustomToolPanelVisibilityMode(customToolPanelName: string, visibilityMode: ToolPanelVisibilityMode): void;
+    setModuleButtons(moduleButtons: AdaptableModuleButtons): void;
+    getModuleButtons(): AdaptableModuleButtons;
     private setExpandedToolPanelVisibility;
     private setCollapsedToolPanelVisibility;
 }

package/src/Api/Implementation/ToolPanelApiImpl.js

@@ -5,6 +5,7 @@ const tslib_1 = require("tslib");
 const ApiBase_1 = require("./ApiBase");
 const ModuleConstants = tslib_1.__importStar(require("../../Utilities/Constants/ModuleConstants"));
 const ToolPanelRedux = tslib_1.__importStar(require("../../Redux/ActionsReducers/ToolPanelRedux"));
+const ToolPanelRedux_1 = require("../../Redux/ActionsReducers/ToolPanelRedux");
 class ToolPanelApiImpl extends ApiBase_1.ApiBase {
     getToolPanelState() {
         return this.getAdaptableState().ToolPanel;
@@ -51,6 +52,13 @@ class ToolPanelApiImpl extends ApiBase_1.ApiBase {
             this.setCollapsedToolPanelVisibility(customToolPanelName);
         }
     }
+    setModuleButtons(moduleButtons) {
+        this.dispatchAction((0, ToolPanelRedux_1.ToolPanelSetModuleButtons)(moduleButtons));
+    }
+    getModuleButtons() {
+        var _a, _b;
+        return (_b = (_a = this.getToolPanelState()) === null || _a === void 0 ? void 0 : _a.ModuleButtons) !== null && _b !== void 0 ? _b : [];
+    }
     setExpandedToolPanelVisibility(toolPanelName) {
         this.dispatchAction(ToolPanelRedux.ToolPanelExpandToolPanel(toolPanelName));
     }

package/src/Api/InternalApi.d.ts

@@ -144,4 +144,5 @@ export interface InternalApi {
     getValueForTag(adaptableObjectTag: AdaptableObjectTag): string | number;
     getEditLookUpValuesForColumn(editLookUpItem: EditLookUpPermittedValues, column: AdaptableColumn, gridCell?: GridCell): any[] | undefined;
     getAdaptableQueryExpressionText(query: Partial<AdaptableQuery>): string;
+    shouldKeepDeprecatedConditionalStyles(): boolean;
 }

package/src/Api/ToolPanelApi.d.ts

@@ -1,7 +1,7 @@
 import { ToolPanelState, ToolPanelVisibilityMode } from '../PredefinedConfig/ToolPanelState';
 import { CustomToolPanel, ToolPanelButtonContext } from '../AdaptableOptions/ToolPanelOptions';
 import { AdaptableButton } from '../PredefinedConfig/Common/AdaptableButton';
-import { AdaptableToolPanel } from '../PredefinedConfig/Common/Types';
+import { AdaptableModuleButtons, AdaptableToolPanel } from '../PredefinedConfig/Common/Types';
 /**
  * Functions for managing the AdapTable ToolPanel Component (at side of grid)
  */
@@ -47,4 +47,13 @@ export interface ToolPanelApi {
      * @param visibilityMode
      */
     setCustomToolPanelVisibilityMode(customToolPanelName: string, visibilityMode: ToolPanelVisibilityMode): void;
+    /**
+     * Sets the Module buttons in the Adaptable ToolPanel
+     * @param moduleButtons the module buttons
+     */
+    setModuleButtons(moduleButtons: AdaptableModuleButtons): void;
+    /**
+     * Sets the Module buttons from the Adaptable ToolPanel
+     */
+    getModuleButtons(): AdaptableModuleButtons;
 }

package/src/Strategy/ConditionalStyleModule.d.ts

@@ -7,8 +7,10 @@ import { AdaptableModuleBase } from './AdaptableModuleBase';
 import { IConditionalStyleModule } from './Interface/IConditionalStyleModule';
 import { AdaptableObject } from '../PredefinedConfig/Common/AdaptableObject';
 import { AdaptableModuleView, AdaptableObjectView } from './Interface/IModule';
+import { AccessLevel } from '../types';
 export declare class ConditionalStyleModule extends AdaptableModuleBase implements IConditionalStyleModule {
     constructor(api: AdaptableApi);
+    getViewAccessLevel(): AccessLevel;
     getModuleAdaptableObjects(config?: {
         includeLayoutNotAssociatedObjects?: boolean;
     }): AdaptableObject[];

package/src/Strategy/ConditionalStyleModule.js

@@ -13,10 +13,15 @@ const ConditionalStyleWizard_1 = require("../View/ConditionalStyle/Wizard/Condit
 const getRuleViewItems_1 = require("./Utilities/getRuleViewItems");
 const getStyleViewItems_1 = require("./Utilities/getStyleViewItems");
 const getObjectTagsViewItems_1 = require("./Utilities/getObjectTagsViewItems");
+const ConditionalStylePopupHeader_1 = require("../View/ConditionalStyle/ConditionalStylePopupHeader");
 class ConditionalStyleModule extends AdaptableModuleBase_1.AdaptableModuleBase {
     constructor(api) {
         super(ModuleConstants.ConditionalStyleModuleId, ModuleConstants.ConditionalStyleFriendlyName, 'conditional-style', 'ConditionalStylePopup', 'Style columns and rows dynamically based on rules and cell values', api);
     }
+    getViewAccessLevel() {
+        const keepDeprecatedConditionalStyles = this.api.internalApi.shouldKeepDeprecatedConditionalStyles();
+        return keepDeprecatedConditionalStyles ? super.getViewAccessLevel() : 'Hidden';
+    }
     getModuleAdaptableObjects(config) {
         return this.api.conditionalStyleApi.getAllConditionalStyle(config);
     }
@@ -209,6 +214,7 @@ class ConditionalStyleModule extends AdaptableModuleBase_1.AdaptableModuleBase {
     }
     getViewProperties() {
         return {
+            HeaderComponent: ConditionalStylePopupHeader_1.ConditionalStylePopupHeader,
             getDeleteAction: (conditionalStyle) => ConditionalStyleRedux.ConditionalStyleDelete(conditionalStyle),
             getSuspendAction: (conditionalStyle) => ConditionalStyleRedux.ConditionalStyleSuspend(conditionalStyle),
             getUnSuspendAction: (conditionalStyle) => ConditionalStyleRedux.ConditionalStyleUnSuspend(conditionalStyle),

package/src/Strategy/FormatColumnModule.d.ts

@@ -14,6 +14,8 @@ export declare class FormatColumnModule extends AdaptableModuleBase implements I
     getExplicitlyReferencedColumnIds(formatColumn: FormatColumn): string[];
     hasNamedQueryReferences(): boolean;
     updateOldConfig(): void;
+    private updateConditionalStylesColumnsOldConfig;
+    private updateGradientColumnsOldConfig;
     private getExistingFormatColumn;
     addColumnMenuItems(column: AdaptableColumn): AdaptableMenuItem[] | undefined;
     getTeamSharingAction(): TeamSharingImportInfo<FormatColumn>;

package/src/Strategy/FormatColumnModule.js

@@ -62,6 +62,52 @@ class FormatColumnModule extends AdaptableModuleBase_1.AdaptableModuleBase {
             .FormatColumn) === null || _a === void 0 ? void 0 : _a.FormatColumns) === null || _b === void 0 ? void 0 : _b.some((formatColumn) => !!formatColumn.HeaderName)) {
             (0, LoggingHelper_1.ConsoleLogWarning)(`DEPRECATED: The 'FormatColumn.HeaderName' property is deprecated; use a Layout custom Column Header instead!`);
         }
+        this.updateGradientColumnsOldConfig();
+        const keepDeprecatedConditionalStyles = this.api.internalApi.shouldKeepDeprecatedConditionalStyles();
+        if (!keepDeprecatedConditionalStyles) {
+            this.updateConditionalStylesColumnsOldConfig();
+            // update ConditionalStyle StatusBarPanel
+            const oldStatusBars = this.api.internalApi.getState().StatusBar.StatusBars;
+            let replaceConditionalStyleStatusBar = false;
+            const newStatusBars = oldStatusBars.map((statusBar) => (Object.assign(Object.assign({}, statusBar), { StatusBarPanels: [
+                    ...new Set(statusBar.StatusBarPanels.map((statusBarPanel) => {
+                        if (statusBarPanel === 'ConditionalStyle') {
+                            replaceConditionalStyleStatusBar = true;
+                            return 'FormatColumn';
+                        }
+                        return statusBarPanel;
+                    })),
+                ] })));
+            if (replaceConditionalStyleStatusBar) {
+                this.api.statusBarApi.setStatusBarPanels(newStatusBars);
+            }
+            // update ConditionalStyle dashboard buttons
+            const dashboardModuleButtons = this.api.internalApi.getState().Dashboard.ModuleButtons;
+            if (dashboardModuleButtons.includes('ConditionalStyle')) {
+                dashboardModuleButtons[dashboardModuleButtons.indexOf('ConditionalStyle')] = 'FormatColumn';
+                this.api.dashboardApi.setModuleButtons([...new Set(dashboardModuleButtons)]);
+            }
+            // update ConditionalStyle toolPanel buttons
+            const toolPanelModuleButtons = this.api.internalApi.getState().ToolPanel.ModuleButtons;
+            if (toolPanelModuleButtons.includes('ConditionalStyle')) {
+                toolPanelModuleButtons[toolPanelModuleButtons.indexOf('ConditionalStyle')] = 'FormatColumn';
+                this.api.toolPanelApi.setModuleButtons([...new Set(dashboardModuleButtons)]);
+            }
+        }
+    }
+    updateConditionalStylesColumnsOldConfig() {
+        var _a;
+        const oldConditionalStyles = (_a = this.api.internalApi.getState().ConditionalStyle) === null || _a === void 0 ? void 0 : _a.ConditionalStyles;
+        if (!(oldConditionalStyles === null || oldConditionalStyles === void 0 ? void 0 : oldConditionalStyles.length)) {
+            return;
+        }
+        (0, LoggingHelper_1.ConsoleLogWarning)(`DEPRECATED: The 'ConditionalStyle.ConditionalStyles' property is deprecated; use 'FormatColumn' instead!`);
+        // remove conditional styles
+        this.api.conditionalStyleApi.deleteConditionalStyles(oldConditionalStyles);
+        // add as format column
+        this.api.formatColumnApi.addFormatColumns(oldConditionalStyles);
+    }
+    updateGradientColumnsOldConfig() {
         let newFormatColumns = [];
         let existingFormatColumns = [];
         // 1. Convert Gradient Columns to Format Columns

package/src/Strategy/Interface/IModule.d.ts

@@ -88,6 +88,7 @@ export interface AdaptableModuleView {
      */
     actions?: AdaptableModuleViewAction[];
     onMount?: () => void;
+    HeaderComponent?: React.FunctionComponent;
     onOpenEditPopup?: (abObject?: AdaptableObject) => void;
     getDeleteAction?: (abObject: AdaptableObject) => Redux.Action;
     getCompactDeleteAction?: (abObject: AdaptableObject) => Redux.Action;

package/src/Utilities/Defaults/DefaultAdaptableOptions.js

@@ -152,6 +152,7 @@ exports.DefaultAdaptableOptions = {
         customSortComparers: undefined,
         englishVariant: 'GB',
         unbalancedGroupsKey: undefined,
+        keepDeprecatedConditionalStyles: false,
     },
     layoutOptions: {
         includeExpandedRowGroups: false,

package/src/View/Components/Popups/AdaptablePopup/AdaptablePopupModuleView.js

@@ -111,6 +111,7 @@ const AdaptablePopupModuleView = (props) => {
                 "s not available in current Layout")));
     };
     return (React.createElement(PopupPanel_1.PopupPanel, { glyphicon: moduleInfo.Glyph, infoLink: moduleInfo.HelpPage, headerText: moduleInfo.FriendlyName, button: newButton, infoLinkDisabled: !props.api.internalApi.isDocumentationLinksDisplayed() },
+        moduleViewProperties.HeaderComponent && React.createElement(moduleViewProperties.HeaderComponent, null),
         toggleButtonShowLayoutAssociatedObjects(),
         (items === null || items === void 0 ? void 0 : items.length) ? (React.createElement(AdaptableObjectList_1.AdaptableObjectList, { module: props.module, items: items })) : (React.createElement(EmptyContent_1.default, null, emptyContent !== null && emptyContent !== void 0 ? emptyContent : `Click 'New' to create a new ${moduleInfo.FriendlyName}`)),
         isWizardOpen && EditWizard && (React.createElement(EditWizard, { abObjectType: abObjectType, moduleInfo: moduleInfo, data: null, popupParams: props.popupParams, configEntities: null, onCloseWizard: handleWizardClose, onFinishWizard: handleWizardClose }))));

package/src/View/ConditionalStyle/ConditionalStylePopupHeader.d.ts

@@ -0,0 +1,2 @@
+import * as React from 'react';
+export declare const ConditionalStylePopupHeader: React.FunctionComponent;

package/src/View/ConditionalStyle/ConditionalStylePopupHeader.js

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ConditionalStylePopupHeader = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const HelpBlock_1 = tslib_1.__importDefault(require("../../components/HelpBlock"));
+const SimpleButton_1 = tslib_1.__importDefault(require("../../components/SimpleButton"));
+const AdaptableContext_1 = require("../AdaptableContext");
+const ConditionalStylePopupHeader = () => {
+    const adaptable = (0, AdaptableContext_1.useAdaptable)();
+    return (React.createElement(HelpBlock_1.default, null,
+        "Conditional Styles are deprecated, use",
+        ' ',
+        React.createElement(SimpleButton_1.default, { onClick: () => adaptable.api.settingsPanelApi.showSettingsPanel('FormatColumn'), variant: "outlined" }, "Format Columns"),
+        ' ',
+        "instead."));
+};
+exports.ConditionalStylePopupHeader = ConditionalStylePopupHeader;

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

@@ -125,7 +125,7 @@ const getFormatDisplayTypeForScope = (scope, api) => {
     }
     // need to see if all columns are numeric or date
     if ('ColumnIds' in scope) {
-        const columns = scope.ColumnIds.map((c) => api.columnApi.getColumnFromId(c));
+        const columns = scope.ColumnIds.map((c) => api.columnApi.getColumnFromId(c)).filter(Boolean);
         const columnDataTypes = (0, uniq_1.default)(columns.map((c) => c.dataType));
         if (columnDataTypes.length == 1 && columnDataTypes[0] == 'Number') {
             return 'Number';