@adaptabletools/adaptable 16.0.0-canary.2 → 16.0.0-canary.3

package/src/agGrid/Adaptable.js

@@ -1256,7 +1256,8 @@ class Adaptable {
         if (!params.node) {
             return false;
         }
-        if (!this.api.optionsApi.getQuickSearchOptions().runQuickSearchOnRowGroups && params.node.group) {
+        if (!this.api.optionsApi.getQuickSearchOptions().runQuickSearchOnRowGroups &&
+            params.node.group) {
             return false;
         }
         let quickSearchValue = this.api.quickSearchApi.getQuickSearchValue();
@@ -1352,11 +1353,11 @@ class Adaptable {
         }
         const perfSetLayout = this.logger.beginPerf(`setLayout(${layout.Name})`);
         layout.Columns = layout.Columns || [];
-        const rowEditActionColumn = this.getColDefsForRowEditColumns()[0];
-        if (rowEditActionColumn) {
-            layout.Columns.push(rowEditActionColumn.colId);
+        const actionRowColumn = this.getColDefsForActionRowColumns()[0];
+        if (actionRowColumn) {
+            layout.Columns.push(actionRowColumn.colId);
             layout.PinnedColumnsMap = layout.PinnedColumnsMap || {};
-            layout.PinnedColumnsMap[rowEditActionColumn.colId] = rowEditActionColumn.pinned;
+            layout.PinnedColumnsMap[actionRowColumn.colId] = actionRowColumn.pinned;
         }
         const layoutColumnsMap = layout.Columns.reduce((acc, colId) => {
             acc[colId] = true;
@@ -1409,6 +1410,9 @@ class Adaptable {
                 // autosize only the columns which are part of the selected layout
                 colsToAutoSize[colId] = true;
             }
+            if (actionRowColumn && actionRowColumn.colId === colId) {
+                newColState.width = actionRowColumn.width;
+            }
             newColState.rowGroupIndex =
                 groupedColumnsIndexesMap[colId] != null ? groupedColumnsIndexesMap[colId] : null;
             const previousRowGroup = newColState.rowGroup;
@@ -1700,7 +1704,10 @@ class Adaptable {
         }
         layout.EnablePivot = this.gridOptions.columnApi.isPivotMode();
         layout.PivotColumns = pivotColumns;
-        if (this.api.layoutApi.internalApi.areExpandedRowGroupsSavedInLayouts()) {
+        if (
+        // check first row node for presence of data without iterating over whole grid
+        this.api.layoutApi.internalApi.areExpandedRowGroupsSavedInLayouts() &&
+            this.api.gridApi.getFirstRowNode()) {
             layout.ExpandedRowGroupValues = this.getExpandRowGroupsKeys();
         }
         this.persistLayout(layout);
@@ -1887,13 +1894,16 @@ class Adaptable {
                 });
             }
         }
-        const uniqueVals = (0, uniqBy_1.default)(returnValues, (dataItem) => {
+        let uniqueVals = (0, uniqBy_1.default)(returnValues, (dataItem) => {
             const value = dataItem.rawValue;
             if (value instanceof Date) {
                 return value.toISOString();
             }
             return value;
         });
+        if (column.dataType == 'String' && this.api.internalApi.isTextComparisonCaseSensitive()) {
+            uniqueVals = (0, uniqBy_1.default)(uniqueVals, (d) => d.displayValue.toLowerCase());
+        }
         return uniqueVals.slice(0, this.adaptableOptions.filterOptions.maxFilterValuesToDisplay);
     }
     async getDistinctFilterValuesForColumn(column, visibleRowsOnly, filter, skipRowNode) {
@@ -2326,7 +2336,7 @@ class Adaptable {
             ...this.getColDefsForCalculatedColumns(),
             ...this.getColDefsForActionColumns(),
             ...this.getColDefsForFreeTextColumns(),
-            ...this.getColDefsForRowEditColumns(),
+            ...this.getColDefsForActionRowColumns(),
         ];
     }
     getColDefsForFreeTextColumns() {
@@ -2386,12 +2396,12 @@ class Adaptable {
             return userValue;
         });
     }
-    getColDefsForRowEditColumns() {
+    getActionRowButtonDefs() {
         const actionRowButtons = this.api.actionRowApi.getActionRowButtons();
         if (!(actionRowButtons === null || actionRowButtons === void 0 ? void 0 : actionRowButtons.length)) {
             return [];
         }
-        const defaultEditButtonConfiguration = {
+        const defaultActionRowButtonConfiguration = {
             create: {
                 icon: {
                     name: 'add',
@@ -2438,10 +2448,10 @@ class Adaptable {
                 },
             },
         };
-        const editButtons = actionRowButtons
+        const actionButtons = actionRowButtons
             .map((actionRowButtonType) => {
             var _a, _b;
-            const defaultButtonConfig = defaultEditButtonConfiguration[actionRowButtonType];
+            const defaultButtonConfig = defaultActionRowButtonConfiguration[actionRowButtonType];
             if (!defaultButtonConfig) {
                 // should NOT happen unless the user sent some invalid button type in the predefined config
                 return;
@@ -2458,12 +2468,20 @@ class Adaptable {
             return Object.assign(Object.assign({}, defaultButtonConfig), customButtonConfig);
         })
             .filter(Boolean);
-        if (!editButtons.length) {
+        return actionButtons;
+    }
+    getColDefsForActionRowColumns() {
+        const actionRowButtons = this.api.actionRowApi.getActionRowButtons();
+        if (!(actionRowButtons === null || actionRowButtons === void 0 ? void 0 : actionRowButtons.length)) {
             return [];
         }
-        const rowEditActionColumn = {
+        const actionButtons = this.getActionRowButtonDefs();
+        if (!actionButtons.length) {
+            return [];
+        }
+        const actionRowColumn = {
             columnId: GeneralConstants_1.ADAPTABLE_ROW_ACTION_BUTTONS,
-            actionColumnButton: editButtons,
+            actionColumnButton: actionButtons,
         };
         return [
             {
@@ -2472,7 +2490,7 @@ class Adaptable {
                 hide: false,
                 editable: false,
                 // 15px is the icon width + left&right padding + left&right border
-                width: editButtons.length * (UIHelper_1.default.getSimpleButtonPaddingWidth() * 2 + 15) + 2,
+                width: actionButtons.length * (UIHelper_1.default.getSimpleButtonPaddingWidth() * 2 + 15) + 2,
                 resizable: false,
                 lockVisible: true,
                 suppressColumnsToolPanel: true,
@@ -2486,9 +2504,6 @@ class Adaptable {
                     ? 'right'
                     : 'left',
                 cellRenderer: this.variant === 'react' ? ActionColumnRenderer_1.ReactActionColumnRenderer : ActionColumnRenderer_1.ActionColumnRenderer,
-                cellRendererParams: {
-                    actionColumn: rowEditActionColumn,
-                },
                 cellClass: GeneralConstants_1.ADAPTABLE_ROW_ACTION_BUTTONS,
                 type: [GeneralConstants_1.AB_SPECIAL_COLUMN, 'abColDefObject'],
             },
@@ -2873,7 +2888,10 @@ class Adaptable {
         }
         const gridContainerElement = this.getAgGridContainerElement();
         if (gridContainerElement) {
-            gridContainerElement.addEventListener('keydown', (this.listenerKeydown = (event) => this._emit('KeyDown', event)));
+            gridContainerElement.addEventListener('keydown', (this.listenerKeydown = (event) => this._emit('KeyDown', event)), 
+            // This is needed to be able to prevent the editor to be opened
+            // in bubling phase the opening is not prevented with ag-grid v30
+            true);
         }
         /*********************
          * AG Grid EVENTS
@@ -3769,22 +3787,28 @@ class Adaptable {
         if (standardAgGridRegistrationCheck) {
             return true;
         }
+        const allAgGridRegisteredModules = this.getAllAgGridRegisteredModules();
+        return !!allAgGridRegisteredModules[moduleName];
+    }
+    getAllAgGridRegisteredModules() {
         // as of AG Grid 30.0.3 the ModuleRegistry gets an dynamic grid ID for the framework versions
         // because of that we have to check ALL grid IDs to see if the module is registered
         // TODO AFL: we should recheck this later, it seems AG Grid is already refactoring this faulty registration process
         // @ts-ignore
         const gridModulesMap = core_1.ModuleRegistry.gridModulesMap;
-        let allGridModulesMap = {};
+        let allModulesMap = {};
         Object.keys(gridModulesMap).forEach((gridId) => {
-            allGridModulesMap = Object.assign(Object.assign({}, allGridModulesMap), gridModulesMap[gridId]);
+            allModulesMap = Object.assign(Object.assign({}, allModulesMap), gridModulesMap[gridId]);
         });
-        return !!allGridModulesMap[moduleName];
+        return allModulesMap;
     }
     getAgGridRegisteredModules() {
-        return core_1.ModuleRegistry.__getRegisteredModules(this.gridOptions.gridId);
+        // see comment from getAllAgGridRegisteredModules()
+        // return ModuleRegistry.__getRegisteredModules(this.gridOptions.gridId);
+        return Object.values(this.getAllAgGridRegisteredModules());
     }
     getAgGridRegisteredModuleNames() {
-        return core_1.ModuleRegistry.__getRegisteredModules(this.gridOptions.gridId).map((module) => module.moduleName);
+        return this.getAgGridRegisteredModules().map((module) => module.moduleName);
     }
     onRowDataChanged({ rowNode, oldData, newData, }) {
         if (oldData == null || oldData == undefined) {
@@ -4983,6 +5007,18 @@ class Adaptable {
         this.api.chartingApi.editChartDefinition(Object.assign(Object.assign({}, chartDefinition), { Model: chartModel }));
         return chartRef;
     }
+    updateChart(chart) {
+        const upgradableProperties = {
+            // Only Range charts are supported to be created at run time
+            // the other two are pivot & cross-filter
+            type: 'rangeChartUpdate',
+            chartId: chart.Model.chartId,
+            unlinkChart: Boolean(chart.Model.unlinkChart),
+            suppressChartRanges: Boolean(chart.Model.suppressChartRanges),
+            aggFunc: chart.Model.aggFunc,
+        };
+        this.gridOptions.api.updateChart(upgradableProperties);
+    }
     getChartRef(chartId) {
         return this.gridOptions.api.getChartRef(chartId);
     }

package/src/agGrid/BadgeRenderer.js

@@ -1,24 +1,35 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getBadgeRendererForColumn = void 0;
-const Badge_1 = require("../components/Badge");
+const Badge_1 = require("../View/Components/Badge");
+const renderWithAdaptableContext_1 = require("../View/renderWithAdaptableContext");
 const getBadgeRendererForColumn = (styledColumn, abColumn, api) => {
     if (!styledColumn.BadgeStyle) {
         return;
     }
     return class BadgetRenderer {
+        getAdaptableInstance(params) {
+            const adaptable = params.api.__adaptable;
+            return adaptable;
+        }
         init(params) {
-            var _a, _b, _c, _d, _e, _f;
+            var _a, _b, _c, _d;
+            const adaptable = this.getAdaptableInstance(params);
+            const adapatableApi = adaptable.api;
             this.eGui = document.createElement('div');
             this.eGui.className = 'ab-Badge__wrapper';
             const formattedValue = (_c = (_b = (_a = params.formatValue) === null || _a === void 0 ? void 0 : _a.call(params, params.value)) !== null && _b !== void 0 ? _b : params.value) !== null && _c !== void 0 ? _c : '';
-            const badge = api.styledColumnApi.internalApi.getApplicableBadge(styledColumn, {
+            const predicateDefHandlerContext = {
                 value: params.value,
                 oldValue: null,
                 displayValue: params.formatValue,
                 node: params.node,
                 column: abColumn,
-            });
+                adaptableApi: adapatableApi,
+                userName: adapatableApi.optionsApi.getUserName(),
+                adaptableId: adapatableApi.optionsApi.getAdaptableId(),
+            };
+            const badge = api.styledColumnApi.internalApi.getApplicableBadge(styledColumn, predicateDefHandlerContext);
             const isGrouped = params.node.group;
             const includeGrouped = Boolean(styledColumn.IncludeGroupedRows);
             const isNullValue = formattedValue === '' || formattedValue === null || formattedValue === undefined;
@@ -32,24 +43,12 @@ const getBadgeRendererForColumn = (styledColumn, abColumn, api) => {
                 this.eGui.innerHTML = formattedValue;
                 return;
             }
-            let icon = badge.Icon;
-            if (icon && 'name' in icon && icon.size === undefined) {
-                icon.size = 14;
-            }
-            const userInterfaceOptions = (_d = api.optionsApi.getAdaptableOptions()) === null || _d === void 0 ? void 0 : _d.userInterfaceOptions;
-            const customDefinedIcons = (_e = userInterfaceOptions.customIcons) !== null && _e !== void 0 ? _e : [];
-            let customIcon = badge.Icon && 'name' in badge.Icon
-                ? api.userInterfaceApi.getCustomIconDefinition(badge.Icon.name)
-                : null;
-            if (customIcon) {
-                icon = customIcon;
-            }
-            this.unmountReactRoot = api.internalApi.getAdaptableInstance().renderReactRoot((0, Badge_1.Badge)({
+            this.unmountReactRoot = api.internalApi.getAdaptableInstance().renderReactRoot((0, renderWithAdaptableContext_1.renderWithAdaptableContext)((0, Badge_1.Badge)({
                 adaptableStyle: badge.Style,
                 children: formattedValue,
-                icon,
-                iconPosition: (_f = badge.IconPosition) !== null && _f !== void 0 ? _f : 'start',
-            }), this.eGui);
+                icon: badge.Icon,
+                iconPosition: (_d = badge.IconPosition) !== null && _d !== void 0 ? _d : 'start',
+            }), adaptable), this.eGui);
         }
         getGui() {
             return this.eGui;

package/src/agGrid/CheckboxRenderer.js

@@ -30,7 +30,7 @@ const getCheckboxRendererForColumn = (columnId, isColumnReadOnly, api) => {
     CheckboxRenderer.prototype.checkedHandler = function (e) {
         let checked = e.target.checked;
         this.params.node.setDataValue(columnId, checked);
-        api.styledColumnApi.fireCheckboxColumnClickedEvent(columnId, this.params.node.data, api.gridApi.getPrimaryKeyValueForRowNode(this.params.node), checked);
+        api.styledColumnApi.internalApi.fireCheckboxColumnClickedEvent(columnId, this.params.node.data, api.gridApi.getPrimaryKeyValueForRowNode(this.params.node), checked);
     };
     CheckboxRenderer.prototype.suppressEditEvent = function (event) {
         if (event.target === this.eGui) {

package/src/agGrid/agGridHelper.js

@@ -494,6 +494,8 @@ class agGridHelper {
                     return 'Date';
                 case 'abColDefObject':
                     return 'Object';
+                case 'abColDefStringArray':
+                    return 'StringArray';
                 case 'abColDefNumberArray':
                     return 'NumberArray';
                 case 'abColDefTupleNumberArray':

package/src/agGrid/agGridMenuHelper.js

@@ -5,7 +5,7 @@ const tslib_1 = require("tslib");
 const ArrayExtensions_1 = require("../Utilities/Extensions/ArrayExtensions");
 const icons_1 = require("../components/icons");
 const flatten_1 = tslib_1.__importDefault(require("lodash/flatten"));
-const AdaptableIconComponent_1 = require("../components/AdaptableIconComponent");
+const Icon_1 = require("../components/Icon");
 // tslint:disable-next-line: class-name
 class agGridMenuHelper {
     constructor(adaptable, gridOptions) {
@@ -168,11 +168,18 @@ class agGridMenuHelper {
         };
     }
     mapAdaptableIconToAgGridIcon(adaptableIcon, style) {
-        if ((0, AdaptableIconComponent_1.isAdaptableElementIcon)(adaptableIcon)) {
-            return adaptableIcon.element;
+        const icon = this.adaptable.api.userInterfaceApi.internalApi.prepareAdaptableIconDef(adaptableIcon);
+        if ((0, Icon_1.isAdaptableElementIcon)(icon)) {
+            let element = icon.element;
+            if (typeof element === 'string') {
+                return element;
+            }
+            // THe element neets to be cloned.
+            // when it is used in more than one plce the element is removed from the DOM
+            return element.cloneNode(true);
         }
         else {
-            return (0, icons_1.iconToString)(adaptableIcon, {
+            return (0, icons_1.iconToString)(icon, {
                 fill: 'var(--ab-color-text-on-primary)',
             });
         }

package/src/agGrid/attachAddaptableColumnTypes.d.ts

@@ -9,6 +9,7 @@ export declare const attachColumnTypes: (gridOptions: GridOptions) => {
     abColDefDate: import("@ag-grid-community/core").ColDef<any, any>;
     abColDefObject: import("@ag-grid-community/core").ColDef<any, any>;
     abColDefCustom: import("@ag-grid-community/core").ColDef<any, any>;
+    abColDefStringArray: import("@ag-grid-community/core").ColDef<any, any>;
     abColDefNumberArray: import("@ag-grid-community/core").ColDef<any, any>;
     abColDefTupleNumberArray: import("@ag-grid-community/core").ColDef<any, any>;
     abColDefObjectNumberArray: import("@ag-grid-community/core").ColDef<any, any>;

package/src/agGrid/attachAddaptableColumnTypes.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.attachColumnTypes = void 0;
 const GeneralConstants_1 = require("../Utilities/Constants/GeneralConstants");
 const attachColumnTypes = (gridOptions) => {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
     gridOptions.columnTypes = (_a = gridOptions.columnTypes) !== null && _a !== void 0 ? _a : {};
     return Object.assign(gridOptions.columnTypes, {
         [GeneralConstants_1.AB_SPECIAL_COLUMN]: {},
@@ -13,9 +13,10 @@ const attachColumnTypes = (gridOptions) => {
         abColDefDate: (_e = gridOptions.columnTypes.abColDefDate) !== null && _e !== void 0 ? _e : {},
         abColDefObject: (_f = gridOptions.columnTypes.abColDefObject) !== null && _f !== void 0 ? _f : {},
         abColDefCustom: (_g = gridOptions.columnTypes.abColDefCustom) !== null && _g !== void 0 ? _g : {},
-        abColDefNumberArray: (_h = gridOptions.columnTypes.abColDefNumberArray) !== null && _h !== void 0 ? _h : {},
-        abColDefTupleNumberArray: (_j = gridOptions.columnTypes.abColDefTupleNumberArray) !== null && _j !== void 0 ? _j : {},
-        abColDefObjectNumberArray: (_k = gridOptions.columnTypes.abColDefObjectNumberArray) !== null && _k !== void 0 ? _k : {},
+        abColDefStringArray: (_h = gridOptions.columnTypes.abColDefStringArray) !== null && _h !== void 0 ? _h : {},
+        abColDefNumberArray: (_j = gridOptions.columnTypes.abColDefNumberArray) !== null && _j !== void 0 ? _j : {},
+        abColDefTupleNumberArray: (_k = gridOptions.columnTypes.abColDefTupleNumberArray) !== null && _k !== void 0 ? _k : {},
+        abColDefObjectNumberArray: (_l = gridOptions.columnTypes.abColDefObjectNumberArray) !== null && _l !== void 0 ? _l : {},
     });
 };
 exports.attachColumnTypes = attachColumnTypes;

package/src/agGrid/editors/AdaptableNumberEditor/index.js

@@ -20,7 +20,7 @@ function getStartValue(params) {
         return '';
     }
     if (params.eventKey && isValidChar(params.eventKey)) {
-        return params.eventKey;
+        return Number(params.eventKey);
     }
     return params.value;
 }

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

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import { AdaptableElementIcon, AdaptableCustomIcon, AdaptableIcon, AdaptableSystemIcon } from '../../PredefinedConfig/Common/AdaptableIcon';
+export interface IconComponentProps {
+    icon: AdaptableIcon;
+    iconClassName?: string;
+}
+export declare const IconComponent: (props: IconComponentProps) => JSX.Element;
+export declare const isAdaptableSystemIcon: (icon: unknown) => icon is AdaptableSystemIcon;
+export declare const isAdaptableCustomIcon: (icon: unknown) => icon is AdaptableCustomIcon;
+export declare const isAdaptableElementIcon: (icon: unknown) => icon is AdaptableElementIcon;
+export declare const isAdaptableIcon: (icon: unknown) => icon is AdaptableIcon;

package/src/components/{AdaptableIconComponent → Icon}/index.js

@@ -1,12 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.isAdaptableIcon = exports.isAdaptableElementIcon = exports.isAdaptableExternalIcon = exports.isAdaptableInternalIcon = exports.AdaptableIconComponent = void 0;
+exports.isAdaptableIcon = exports.isAdaptableElementIcon = exports.isAdaptableCustomIcon = exports.isAdaptableSystemIcon = exports.IconComponent = void 0;
 const tslib_1 = require("tslib");
 const React = tslib_1.__importStar(require("react"));
 const icons_1 = tslib_1.__importStar(require("../icons"));
 const join_1 = tslib_1.__importDefault(require("../utils/join"));
 const react_1 = require("react");
-const AdaptableIconComponent = (props) => {
+const IconComponent = (props) => {
     var _a, _b, _c, _d, _e;
     const { icon, iconClassName } = props;
     if (!icon) {
@@ -38,10 +38,10 @@ const AdaptableIconComponent = (props) => {
             }
         };
     }, [icon]);
-    if ((0, exports.isAdaptableInternalIcon)(icon) && icon.name in icons_1.default) {
+    if ((0, exports.isAdaptableSystemIcon)(icon) && icon.name in icons_1.default) {
         return (React.createElement(icons_1.Icon, { name: icon.name, size: icon.size, style: icon.style, className: className }));
     }
-    if ((0, exports.isAdaptableExternalIcon)(icon)) {
+    if ((0, exports.isAdaptableCustomIcon)(icon)) {
         let width = (_b = (_a = icon.style) === null || _a === void 0 ? void 0 : _a.width) !== null && _b !== void 0 ? _b : 'var(--ab-cmp-icon__width)';
         let height = (_d = (_c = icon.style) === null || _c === void 0 ? void 0 : _c.height) !== null && _d !== void 0 ? _d : 'var(--ab-cmp-icon__height)';
         const iconStyle = (_e = icon.style) !== null && _e !== void 0 ? _e : {};
@@ -52,15 +52,15 @@ const AdaptableIconComponent = (props) => {
     }
     return null;
 };
-exports.AdaptableIconComponent = AdaptableIconComponent;
-const isAdaptableInternalIcon = (icon) => {
+exports.IconComponent = IconComponent;
+const isAdaptableSystemIcon = (icon) => {
     return typeof (icon === null || icon === void 0 ? void 0 : icon.name) === 'string';
 };
-exports.isAdaptableInternalIcon = isAdaptableInternalIcon;
-const isAdaptableExternalIcon = (icon) => {
+exports.isAdaptableSystemIcon = isAdaptableSystemIcon;
+const isAdaptableCustomIcon = (icon) => {
     return typeof (icon === null || icon === void 0 ? void 0 : icon.src) === 'string';
 };
-exports.isAdaptableExternalIcon = isAdaptableExternalIcon;
+exports.isAdaptableCustomIcon = isAdaptableCustomIcon;
 const isAdaptableElementIcon = (icon) => {
     return ((typeof HTMLElement === 'function' &&
         (icon === null || icon === void 0 ? void 0 : icon.element) instanceof HTMLElement) ||
@@ -68,6 +68,6 @@ const isAdaptableElementIcon = (icon) => {
 };
 exports.isAdaptableElementIcon = isAdaptableElementIcon;
 const isAdaptableIcon = (icon) => {
-    return ((0, exports.isAdaptableInternalIcon)(icon) || (0, exports.isAdaptableExternalIcon)(icon) || (0, exports.isAdaptableElementIcon)(icon));
+    return ((0, exports.isAdaptableSystemIcon)(icon) || (0, exports.isAdaptableCustomIcon)(icon) || (0, exports.isAdaptableElementIcon)(icon));
 };
 exports.isAdaptableIcon = isAdaptableIcon;

package/src/components/IconSelector/IconSelector.js

@@ -5,7 +5,7 @@ const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const rebass_1 = require("rebass");
 const AdaptableInput_1 = tslib_1.__importDefault(require("../../View/Components/AdaptableInput"));
-const AdaptableIconComponent_1 = require("../AdaptableIconComponent");
+const Icon_1 = require("../Icon");
 const icons_1 = tslib_1.__importStar(require("../icons"));
 const OverlayTrigger_1 = tslib_1.__importDefault(require("../OverlayTrigger"));
 const SimpleButton_1 = tslib_1.__importDefault(require("../SimpleButton"));
@@ -27,7 +27,7 @@ const IconSelector = (props) => {
     });
     const customIconsElements = (_a = props.customIcons) === null || _a === void 0 ? void 0 : _a.map((def) => {
         return (react_1.default.createElement(IconButton, { key: def.name, active: false, onClick: () => props.onChange(def.name) },
-            react_1.default.createElement(AdaptableIconComponent_1.AdaptableIconComponent, { key: def.name, icon: def.icon })));
+            react_1.default.createElement(Icon_1.IconComponent, { key: def.name, icon: def.icon })));
     });
     const popup = (react_1.default.createElement(rebass_1.Box, { className: "ab-IconSelector__Popup" },
         react_1.default.createElement(rebass_1.Box, { mb: 2 },
@@ -44,7 +44,7 @@ const IconSelector = (props) => {
     else {
         const icon = (_b = props.customIcons) === null || _b === void 0 ? void 0 : _b.find((def) => def.name === props.value);
         if (icon)
-            value = react_1.default.createElement(AdaptableIconComponent_1.AdaptableIconComponent, { icon: icon.icon });
+            value = react_1.default.createElement(Icon_1.IconComponent, { icon: icon.icon });
     }
     return (react_1.default.createElement(rebass_1.Flex, { className: "ab-IconSelector" },
         react_1.default.createElement(OverlayTrigger_1.default, { preventPortalEventPropagation: false, render: () => popup, showEvent: "mouseenter", hideEvent: "mouseleave", hideDelay: 300 },

package/src/components/SimpleButton/index.js

@@ -8,21 +8,21 @@ const join_1 = tslib_1.__importDefault(require("../utils/join"));
 const icons_1 = tslib_1.__importDefault(require("../icons"));
 const Tooltip_1 = tslib_1.__importDefault(require("../Tooltip"));
 const theme_1 = tslib_1.__importDefault(require("../../theme"));
-const AdaptableIconComponent_1 = require("../AdaptableIconComponent");
+const Icon_1 = require("../Icon");
 exports.baseClassName = 'ab-SimpleButton';
 const SimpleButton = React.forwardRef((props, theRef) => {
     var _a, _b;
     let { children, disabled, variant = 'outlined', tone = 'neutral', iconPosition = 'start', iconSize, className, icon, tooltip, accessLevel: accessLevel, type } = props, buttonProps = tslib_1.__rest(props, ["children", "disabled", "variant", "tone", "iconPosition", "iconSize", "className", "icon", "tooltip", "accessLevel", "type"]);
-    let adaptableInternalIcon;
-    if ((0, AdaptableIconComponent_1.isAdaptableInternalIcon)(icon)) {
-        adaptableInternalIcon = icon;
+    let adaptableSystemIcon;
+    if ((0, Icon_1.isAdaptableSystemIcon)(icon)) {
+        adaptableSystemIcon = icon;
     }
     if (typeof icon === 'string' && icons_1.default[icon]) {
-        adaptableInternalIcon = { name: icon };
+        adaptableSystemIcon = { name: icon };
     }
-    if (adaptableInternalIcon) {
+    if (adaptableSystemIcon) {
         const iconProps = {
-            icon: adaptableInternalIcon,
+            icon: adaptableSystemIcon,
         };
         if (iconSize) {
             iconProps.icon = Object.assign(Object.assign({}, iconProps.icon), { size: iconSize });
@@ -30,10 +30,10 @@ const SimpleButton = React.forwardRef((props, theRef) => {
         if (typeof buttonProps.color === 'string') {
             iconProps.icon = Object.assign(Object.assign({}, iconProps.icon), { style: { color: buttonProps.color } });
         }
-        icon = React.createElement(AdaptableIconComponent_1.AdaptableIconComponent, Object.assign({}, iconProps));
+        icon = React.createElement(Icon_1.IconComponent, Object.assign({}, iconProps));
     }
-    if ((0, AdaptableIconComponent_1.isAdaptableExternalIcon)(icon) || (0, AdaptableIconComponent_1.isAdaptableElementIcon)(icon)) {
-        icon = React.createElement(AdaptableIconComponent_1.AdaptableIconComponent, { icon: icon });
+    if ((0, Icon_1.isAdaptableCustomIcon)(icon) || (0, Icon_1.isAdaptableElementIcon)(icon)) {
+        icon = React.createElement(Icon_1.IconComponent, { icon: icon });
     }
     if (icon) {
         children =

package/src/components/Toggle/Toggle.d.ts

@@ -1,8 +1,8 @@
 import * as React from 'react';
-import { AdaptableInternalIconName } from '../../types';
+import { AdaptableSystemIconName } from '../../types';
 export declare type ToggleProps = {
     onPressedChange: (pressed: boolean) => void;
     pressed?: boolean;
-    icon?: AdaptableInternalIconName;
+    icon?: AdaptableSystemIconName;
 };
 export declare const Toggle: React.FunctionComponent<React.PropsWithChildren<ToggleProps>>;

package/src/components/Toggle/Toggle.js

@@ -3,13 +3,13 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Toggle = void 0;
 const tslib_1 = require("tslib");
 const React = tslib_1.__importStar(require("react"));
-const AdaptableIconComponent_1 = require("../AdaptableIconComponent");
+const Icon_1 = require("../Icon");
 const join_1 = tslib_1.__importDefault(require("../utils/join"));
 const Toggle = (_a) => {
     var { onPressedChange, pressed, icon, children } = _a, rest = tslib_1.__rest(_a, ["onPressedChange", "pressed", "icon", "children"]);
     const baseClassName = 'ab-Toggle';
     return (React.createElement("button", Object.assign({}, rest, { className: (0, join_1.default)(baseClassName, pressed && `${baseClassName}--pressed`), onClick: () => onPressedChange(!pressed) }),
-        icon && React.createElement(AdaptableIconComponent_1.AdaptableIconComponent, { icon: { name: icon } }),
+        icon && React.createElement(Icon_1.IconComponent, { icon: { name: icon } }),
         children));
 };
 exports.Toggle = Toggle;

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

@@ -1,15 +1,15 @@
 import * as React from 'react';
 import { CSSProperties } from 'react';
 import { IconProps } from './DefaultIcon';
-import { AdaptableExternalIcon, AdaptableInternalIcon, AdaptableInternalIconName } from '../../PredefinedConfig/Common/AdaptableIcon';
-declare const allIcons: Record<AdaptableInternalIconName, React.FunctionComponent<IconProps>>;
+import { AdaptableCustomIcon, AdaptableSystemIcon, AdaptableSystemIconName } from '../../PredefinedConfig/Common/AdaptableIcon';
+declare const allIcons: Record<AdaptableSystemIconName, React.FunctionComponent<IconProps>>;
 export declare const Icon: ({ name, style, className, tabIndex, ...props }: {
     style?: React.CSSProperties;
-    name: AdaptableInternalIconName;
+    name: AdaptableSystemIconName;
     size?: number;
     className?: string;
     tabIndex?: number;
     props?: React.SVGProps<SVGElement>;
 }) => JSX.Element;
-export declare const iconToString: (icon: AdaptableInternalIcon | AdaptableExternalIcon, style?: CSSProperties) => string;
+export declare const iconToString: (icon: AdaptableSystemIcon | AdaptableCustomIcon, style?: CSSProperties) => string;
 export default allIcons;

package/src/components/icons/index.js

@@ -144,7 +144,7 @@ const instrument_1 = tslib_1.__importDefault(require("./instrument"));
 const analysis_1 = tslib_1.__importDefault(require("./analysis"));
 const visibility_1 = tslib_1.__importDefault(require("./visibility"));
 const visibility_off_1 = tslib_1.__importDefault(require("./visibility-off"));
-const AdaptableIconComponent_1 = require("../AdaptableIconComponent");
+const Icon_1 = require("../Icon");
 const AdaptableLogger_1 = require("../../agGrid/AdaptableLogger");
 const allIcons = {
     search: query_1.default,
@@ -187,8 +187,8 @@ const allIcons = {
     assignment: state_management_1.default,
     clipboard: tool_panel_1.default,
     'traffic-lights': system_status_1.default,
-    'add': add_row_1.default,
-    'downloaded': updated_row_1.default,
+    add: add_row_1.default,
+    downloaded: updated_row_1.default,
     // others
     edit: edit_1.default,
     undo: undo_1.default,
@@ -226,7 +226,7 @@ const allIcons = {
     'sort-desc': sort_desc_1.default,
     logout: logout_1.default,
     'import-export': import_export_1.default,
-    'paperclip': attach_file_1.default,
+    paperclip: attach_file_1.default,
     info: info_1.default,
     'cloud-upload': cloud_upload_1.default,
     upload: upload_1.default,
@@ -265,7 +265,7 @@ const allIcons = {
     'not-contains': not_contains_1.default,
     contains: contains_1.default,
     regex: regex_1.default,
-    'target': track_changes_1.default,
+    target: track_changes_1.default,
     menu: menu_1.default,
     statusbar: statusbar_1.default,
     dashboard: dashboard_1.default,
@@ -307,7 +307,7 @@ const iconToString = (icon, style) => {
     if (!icon) {
         return;
     }
-    return ReactDOMServer.renderToString(React.createElement(AdaptableIconComponent_1.AdaptableIconComponent, { icon: Object.assign(Object.assign({}, icon), { style: Object.assign(Object.assign({}, icon.style), style) }) }));
+    return ReactDOMServer.renderToString(React.createElement(Icon_1.IconComponent, { icon: Object.assign(Object.assign({}, icon), { style: Object.assign(Object.assign({}, icon.style), style) }) }));
 };
 exports.iconToString = iconToString;
 exports.default = allIcons;