@adaptabletools/adaptable 22.0.0-canary.9 → 22.0.0

package/src/agGrid/AdaptableAgGrid.js

@@ -1,5 +1,5 @@
-import throttle from 'lodash/throttle';
-import debounce from 'lodash/debounce';
+import throttle from '../Utilities/utils/throttle';
+import debounce from '../Utilities/utils/debounce';
 import { createGrid, LocalEventService, } from 'ag-grid-enterprise';
 import { AdaptableLogger } from './AdaptableLogger';
 import { PrimaryKeyDocsLink } from '../Utilities/Constants/DocumentationLinkConstants';
@@ -78,7 +78,7 @@ import { AgGridOptionsService } from './AgGridOptionsService';
 import { parseDateValue } from '../Utilities/Helpers/DateHelper';
 import { AgGridColumnAdapter } from './AgGridColumnAdapter';
 import getScrollbarSize from '../Utilities/getScrollbarSize';
-import { WEIGHTED_AVERAGE_AGG_FN_NAME, } from '../AdaptableState/Common/AggregationColumns';
+import { ONLY_AGG_FN_NAME, WEIGHTED_AVERAGE_AGG_FN_NAME, } from '../AdaptableState/Common/AggregationColumns';
 import { RowFormService } from '../Utilities/Services/RowFormService';
 import { FilterOnDataChangeOptions } from '../AdaptableState/Common/Enums';
 import { ADAPTABLE_PUBLISH_TIMESTAMP } from '../EnvVars';
@@ -87,6 +87,7 @@ import { ensureLoadingScreenPortalElement } from '../components/Modal';
 import { AdaptableLoadingScreen } from '../View/Components/Popups/AdaptableLoadingScreen';
 import { createElement } from 'react';
 import { createAgStatusPanelComponent } from '../Utilities/createAgStatusPanelComponent';
+import { only } from '../Utilities/only';
 import { weightedAverage } from '../Utilities/weightedAverage';
 import { ROW_SUMMARY_ROW_ID } from '../AdaptableState/Common/RowSummary';
 import { FlashingCellService } from '../Utilities/Services/FlashingCellService';
@@ -1080,6 +1081,9 @@ export class AdaptableAgGrid {
          */
         this.agGridOptionsService.setGridOptionsProperty(gridOptions, 'aggFuncs', (original_aggFuncs) => {
             const aggregationFunctions = original_aggFuncs || {};
+            aggregationFunctions[ONLY_AGG_FN_NAME] = (params) => {
+                return only(params, params.column.getColId());
+            };
             aggregationFunctions[WEIGHTED_AVERAGE_AGG_FN_NAME] = (params) => {
                 const columnId = params.column.getColId();
                 const adaptableAggFunc = this.getActiveAdaptableAggFuncForCol(columnId);
@@ -1462,6 +1466,18 @@ export class AdaptableAgGrid {
                 caseSensitive: !!this.adaptableOptions.quickSearchOptions.isQuickSearchCaseSensitive,
             };
         });
+        /**
+         * suppressOverlays
+         */
+        this.agGridOptionsService.setGridOptionsProperty(gridOptions, 'suppressOverlays', (original_suppressOverlays) => {
+            // we want to suppress the exporting overlay because having it enabled will turn api.exportDataAsExcel() and api.exportDataAsCsv() into async operations,
+            // see #export_data_synchronously
+            let suppressOverlays = original_suppressOverlays || [];
+            if (!suppressOverlays.includes('exporting')) {
+                suppressOverlays.push('exporting');
+            }
+            return suppressOverlays;
+        });
     }
     /**
      * Either initializes the AG Grid instance or delegates it to the framework wrappers (React/Anglar)
@@ -2541,12 +2557,15 @@ export class AdaptableAgGrid {
             updatedRows: [],
             removedRows: [],
         };
-        if (!dataRowConfig || !dataRowConfig.dataRows) {
+        if (!dataRowConfig) {
+            return result;
+        }
+        if (!dataRowConfig.addRows || !dataRowConfig.updateRows || !dataRowConfig.deleteRows) {
             return result;
         }
-        const addDataRows = dataRowConfig.dataRows.add;
-        const updateDataRows = dataRowConfig.dataRows.update;
-        const removeDataRows = dataRowConfig.dataRows.delete;
+        const addDataRows = dataRowConfig.addRows;
+        const updateDataRows = dataRowConfig.updateRows;
+        const removeDataRows = dataRowConfig.deleteRows;
         if (this.hasAutogeneratedPrimaryKey) {
             this.addSyntheticPrimaryKeyIfMissing(addDataRows);
         }

package/src/agGrid/AgGridAdapter.js

@@ -471,8 +471,8 @@ export class AgGridAdapter {
             ? 'number'
             : this.deriveAdaptableColumnDataType(agGridColumn, false);
         const isTreeColumn = this.isTreeColumn(isGeneratedRowGroupColumn);
-        const alwaysHidden = this.adaptableApi.columnApi.internalApi.isAlwaysHiddenColumn(colDef);
-        const visible = !alwaysHidden || agGridColumn.isVisible();
+        const isUIHiddenColumn = this.adaptableApi.columnApi.internalApi.isColumnUIHidden(colDef);
+        const visible = !isUIHiddenColumn || agGridColumn.isVisible();
         const isGenerated = isGeneratedRowGroupColumn || isGeneratedPivotResultColumn || isGeneratedSelectionColumn;
         const abColumn = {
             Uuid: createUuid(),
@@ -482,9 +482,9 @@ export class AgGridAdapter {
             resizable: colDef.resizable !== false,
             friendlyName: friendlyName,
             isPrimaryKey: ColumnId === pkColumn,
-            dataType: dataType,
+            dataType,
             visible,
-            alwaysHidden,
+            isUIHiddenColumn,
             readOnly: this.isColumnReadonly(colDef),
             columnGroup: ColumnGroup,
             fieldOnly: isGenerated ? false : this.isColumnFieldonly(colDef),

package/src/agGrid/AgGridColumnAdapter.js

@@ -1,5 +1,5 @@
-import kebabCase from 'lodash/kebabCase';
-import merge from 'lodash/merge';
+import kebabCase from '../Utilities/utils/kebabCase';
+import merge from '../Utilities/utils/merge';
 import { convertAdaptableStyleToCSS, getVariableColor, normalizeStyleForAgGrid, } from '../Utilities/Helpers/StyleHelper';
 import StringExtensions from '../Utilities/Extensions/StringExtensions';
 import { ACTION_COLUMN_TYPE, CALCULATED_COLUMN_TYPE, FDC3_COLUMN_TYPE, FREE_TEXT_COLUMN_TYPE, } from '../AdaptableState/Common/AdaptableColumn';
@@ -533,8 +533,15 @@ export class AgGridColumnAdapter {
                             returnValue = params.value;
                         }
                         if (textOptions.includes('PercentageValue')) {
-                            const clampedValue = Helper.clamp(params.value, min, max);
-                            const percentageValue = ((clampedValue - min) / (max - min)) * 100;
+                            let percentageValue;
+                            if (styledColumn.PercentBarStyle.ColumnComparison) {
+                                const absMax = Math.abs(max);
+                                percentageValue = absMax === 0 ? 0 : (Number(params.value) / absMax) * 100;
+                            }
+                            else {
+                                const clampedValue = Helper.clamp(params.value, min, max);
+                                percentageValue = ((clampedValue - min) / (max - min)) * 100;
+                            }
                             returnValue += ' ' + `(${percentageValue.toFixed(0)}%)`;
                         }
                         return returnValue ? returnValue : params.value;

package/src/agGrid/AgGridExportAdapter.d.ts

@@ -1,8 +1,8 @@
-import { AdaptableAgGrid } from './AdaptableAgGrid';
-import { Report, ReportFormatType } from '../AdaptableState/ExportState';
 import { CsvExportParams, ExcelExportParams, ExcelStyle } from 'ag-grid-enterprise';
 import { CustomExportParams, ExportDestinationType, ExportResultData } from '../AdaptableOptions/ExportOptions';
+import { Report, ReportFormatType } from '../AdaptableState/ExportState';
 import { Layout } from '../AdaptableState/LayoutState';
+import { AdaptableAgGrid } from './AdaptableAgGrid';
 export interface ExportConfig {
     report: Report;
     format: ReportFormatType;

package/src/agGrid/AgGridExportAdapter.js

@@ -1,12 +1,12 @@
-import { ExportModuleId } from '../Utilities/Constants/ModuleConstants';
-import { waitForTimeout } from '../Utilities/waitForTimeout';
-import { convertCSSAbsoluteFontSizeToPt, getVariableColor, sanitizeStyle, } from '../Utilities/Helpers/StyleHelper';
-import FormatHelper, { DateFormatter } from '../Utilities/Helpers/FormatHelper';
 import tinycolor from 'tinycolor2';
-import StringExtensions from '../Utilities/Extensions/StringExtensions';
-import { createUuid } from '../AdaptableState/Uuid';
 import { inferSchema, initParser } from 'udsv';
+import { createUuid } from '../AdaptableState/Uuid';
 import { AG_GRID_GROUPED_COLUMN, AG_GRID_SELECTION_COLUMN, } from '../Utilities/Constants/GeneralConstants';
+import { ExportModuleId } from '../Utilities/Constants/ModuleConstants';
+import StringExtensions from '../Utilities/Extensions/StringExtensions';
+import FormatHelper, { DateFormatter } from '../Utilities/Helpers/FormatHelper';
+import { convertCSSAbsoluteFontSizeToPt, getVariableColor, sanitizeStyle, } from '../Utilities/Helpers/StyleHelper';
+import { waitForTimeout } from '../Utilities/waitForTimeout';
 export class AgGridExportAdapter {
     _adaptableInstance;
     /**
@@ -87,6 +87,7 @@ export class AgGridExportAdapter {
                 this.patchExcelStyles(exportContext);
                 excelStylesWerePatched = true;
             }
+            // see #export_data_synchronously
             // 1. easiest case, we download the file using AG Grid
             // these methods will automatically handle the file download
             if (exportContext.destination === 'Download' && exportContext.isExcelReport) {

package/src/agGrid/cellRenderers/PercentBarRenderer.js

@@ -1,5 +1,5 @@
 import Helper from '../../Utilities/Helpers/Helper';
-import clamp from 'lodash/clamp';
+import clamp from '../../Utilities/utils/clamp';
 export const getPercentBarRendererForColumn = (styledColumn, abColumn, api) => {
     if (!styledColumn.PercentBarStyle) {
         return;
@@ -21,10 +21,22 @@ export const getPercentBarRendererForColumn = (styledColumn, abColumn, api) => {
                 }
                 return;
             }
-            const clampedValue = clamp(value, min, max);
-            const percentageValue = ((clampedValue - min) / (max - min)) * 100;
-            let cellBackColor;
             const percentBarStyle = styledColumn.PercentBarStyle;
+            let percentageValue;
+            let barWidthPercent;
+            if (percentBarStyle.ColumnComparison) {
+                // Finance convention: (difference / |base|) * 100 — signed %, use |price| when base is negative
+                const absMax = Math.abs(max);
+                percentageValue = absMax === 0 ? 0 : (Number(value) / absMax) * 100;
+                // Bar width uses |percentage| so 50% and -50% have the same visual width
+                barWidthPercent = Math.min(100, Math.abs(percentageValue));
+            }
+            else {
+                const clampedValue = clamp(value, min, max);
+                percentageValue = ((clampedValue - min) / (max - min)) * 100;
+                barWidthPercent = percentageValue;
+            }
+            let cellBackColor;
             if (percentBarStyle.ColumnComparison) {
                 cellBackColor = percentBarStyle.ColumnComparison.Color;
             }
@@ -52,7 +64,7 @@ export const getPercentBarRendererForColumn = (styledColumn, abColumn, api) => {
                 barInsideEl.className = 'ab-PercentBar__barInside';
                 barInsideEl.style.background = cellBackColor;
                 barInsideEl.style.height = '100%';
-                barInsideEl.style.width = `${percentageValue.toFixed(0)}%`;
+                barInsideEl.style.width = `${barWidthPercent.toFixed(0)}%`;
                 barEl.append(barInsideEl);
                 this.eGui.append(barEl);
                 if (hasCellText) {

package/src/components/ColorPicker/ColorPicker.js

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { useCallback, useEffect } from 'react';
-import debounce from 'lodash/debounce';
+import debounce from '../../Utilities/utils/debounce';
 import Input from '../Input';
 import { getVariableColor } from '../../Utilities/Helpers/StyleHelper';
 import tinycolor from 'tinycolor2';

package/src/components/DropdownButton/renderItem.js

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import isPlainObject from 'lodash/isPlainObject';
+import isPlainObject from '../../Utilities/utils/isPlainObject';
 export default ({ domProps, item, onItemClick, index, columns, className, idProperty, style, }) => {
     const key = item[idProperty] || index;
     if (!isPlainObject(item)) {

package/src/components/ExpressionEditor/QueryBuilder/QueryBuilderInputs.js

@@ -130,7 +130,7 @@ export const PrimitiveValueInput = (props) => {
             } }));
     }
     else if (!['date', 'boolean'].includes(props.inputType)) {
-        editor = (React.createElement(PermittedValuesSelector, { allowNewValues: true, searchable: 'inline', value: props.value, columnId: mapColumnExpressionToColumnId(props.lefthandColumnIdParam), onChange: (value) => {
+        editor = (React.createElement(PermittedValuesSelector, { allowNewValues: true, searchable: 'menulist', value: props.value, columnId: mapColumnExpressionToColumnId(props.lefthandColumnIdParam), onChange: (value) => {
                 props.onChange(value);
             } }));
     }

package/src/components/FormLayout/index.js

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { createContext, useContext } from 'react';
-import merge from 'lodash/merge';
+import merge from '../../Utilities/utils/merge';
 import join from '../utils/join';
 import { Box } from '../Flex';
 const FormLayoutContext = createContext(null);

package/src/components/OverlayTrigger/index.js

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { useRef, useEffect } from 'react';
-import debounce from 'lodash/debounce';
+import debounce from '../../Utilities/utils/debounce';
 import batchUpdate from '../utils/batchUpdate';
 import selectParent from '../utils/selectParent';
 import useProperty from '../utils/useProperty';

package/src/components/Select/Select.js

@@ -362,6 +362,10 @@ export const Select = function (props) {
                     // and then pass the actual values to Resizable
                     minWidth: CSS_VARS_VALUES['--ab-cmp-select-menu__min-width'], maxHeight: CSS_VARS_VALUES['--ab-cmp-select-menu__max-height'], maxWidth: CSS_VARS_VALUES['--ab-cmp-select-menu__max-width'], defaultSize: sizeRef.current, onResizeStop: onResizeStop, onResizeStart: (e) => {
                         e.preventDefault();
+                    }, handleClasses: {
+                        right: 'ab-Select-resize-handle ab-Select-resize-handle--right',
+                        bottom: 'ab-Select-resize-handle ab-Select-resize-handle--bottom',
+                        bottomRight: 'ab-Select-resize-handle ab-Select-resize-handle--bottom-right',
                     } }, theChildren)) : (theChildren))));
         };
     }, [resizable, JSON.stringify(CSS_VARS_VALUES)]);

package/src/env.js

@@ -1,5 +1,5 @@
 export default {
     NEXT_PUBLIC_INFINITE_TABLE_LICENSE_KEY: "StartDate=2021-06-29|EndDate=2030-01-01|Owner=Adaptable|Type=distribution|TS=1624971462479|C=137829811,1004007071,2756196225,1839832928,3994409405,636616862" || '',
-    PUBLISH_TIMESTAMP: 1770908579112 || Date.now(),
-    VERSION: "22.0.0-canary.9" || '--current-version--',
+    PUBLISH_TIMESTAMP: 1771927464818 || Date.now(),
+    VERSION: "22.0.0" || '--current-version--',
 };

package/src/layout-manager/src/isLayoutEqual.js

@@ -1,4 +1,4 @@
-import isDeepEqual from 'lodash/isEqual';
+import isDeepEqual from '../../Utilities/utils/isEqual';
 import { debug as debugFactory } from '@infinite-table/infinite-react';
 import { isPivotLayoutModel } from './isPivotLayoutModel';
 import { normalizePivotLayoutModel, normalizeTableLayoutModel } from './normalizeLayoutModel';

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

@@ -329,7 +329,7 @@ export declare const ADAPTABLE_METAMODEL: {
         kind: string;
         desc: string;
     };
-    AdaptableColumnType: {
+    AdaptableColumnTypeName: {
         name: string;
         kind: string;
         desc: string;
@@ -3002,6 +3002,17 @@ export declare const ADAPTABLE_METAMODEL: {
             desc: string;
         }[];
     };
+    DataRowConfig: {
+        name: string;
+        kind: string;
+        desc: string;
+        props: {
+            name: string;
+            kind: string;
+            desc: string;
+            isOpt: boolean;
+        }[];
+    };
     DataSet: {
         name: string;
         kind: string;