@adaptabletools/adaptable 22.0.0-canary.7 → 22.0.0-canary.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (62) hide show
  1. package/index.css +63 -71
  2. package/index.css.map +1 -1
  3. package/package.json +1 -1
  4. package/src/AdaptableInterfaces/IAdaptable.d.ts +6 -6
  5. package/src/AdaptableOptions/ContainerOptions.d.ts +55 -15
  6. package/src/AdaptableState/AdaptableState.d.ts +2 -0
  7. package/src/AdaptableState/Common/AdaptableColumnContext.d.ts +9 -0
  8. package/src/AdaptableState/Common/AdaptableRowContext.d.ts +11 -0
  9. package/src/AdaptableState/Common/AdaptableRowContext.js +1 -0
  10. package/src/AdaptableState/Common/DataUpdateConfig.d.ts +7 -0
  11. package/src/AdaptableState/Common/TransposeConfig.d.ts +11 -9
  12. package/src/AdaptableState/InitialState.d.ts +9 -0
  13. package/src/AdaptableState/LayoutState.d.ts +1 -2
  14. package/src/AdaptableState/UserInterfaceState.d.ts +14 -0
  15. package/src/AdaptableState/UserInterfaceState.js +1 -0
  16. package/src/Api/GridApi.d.ts +5 -9
  17. package/src/Api/Implementation/AlertApiImpl.js +2 -6
  18. package/src/Api/Implementation/GridApiImpl.d.ts +2 -6
  19. package/src/Api/Implementation/GridApiImpl.js +9 -9
  20. package/src/Api/Implementation/LayoutApiImpl.d.ts +1 -0
  21. package/src/Api/Implementation/LayoutApiImpl.js +3 -0
  22. package/src/Api/Implementation/SystemStatusApiImpl.js +2 -5
  23. package/src/Api/Implementation/UserInterfaceApiImpl.d.ts +5 -0
  24. package/src/Api/Implementation/UserInterfaceApiImpl.js +13 -0
  25. package/src/Api/LayoutApi.d.ts +6 -0
  26. package/src/Api/UserInterfaceApi.d.ts +17 -0
  27. package/src/Redux/ActionsReducers/UserInterfaceRedux.d.ts +11 -0
  28. package/src/Redux/ActionsReducers/UserInterfaceRedux.js +21 -0
  29. package/src/Redux/Store/AdaptableStore.js +27 -0
  30. package/src/Utilities/resolveContainerElement.d.ts +23 -0
  31. package/src/Utilities/resolveContainerElement.js +44 -0
  32. package/src/View/Components/ColumnFilter/components/ColumnFilterInput.js +1 -1
  33. package/src/View/Components/Popups/AdaptablePopup/AdaptablePopup.js +2 -1
  34. package/src/View/Components/Popups/AdaptablePopup/AdaptablePopupBody.js +1 -1
  35. package/src/View/Components/Popups/AdaptablePopup/AdaptablePopupDialog.d.ts +1 -1
  36. package/src/View/Components/Popups/AdaptablePopup/AdaptablePopupDialog.js +1 -8
  37. package/src/View/Components/Popups/WindowPopups/WindowPopups.js +36 -1
  38. package/src/View/Components/WizardSummaryPage.js +1 -1
  39. package/src/View/Dashboard/CustomToolbar.js +1 -1
  40. package/src/View/DataChangeHistory/DataChangeHistoryViewPanel.js +1 -1
  41. package/src/View/Layout/TransposedPopup.js +144 -138
  42. package/src/View/Schedule/Wizard/ScheduleSettingsWizard/ScheduleSettingsReminder.js +1 -1
  43. package/src/View/UIHelper.d.ts +2 -1
  44. package/src/View/UIHelper.js +8 -14
  45. package/src/agGrid/Adaptable.js +11 -11
  46. package/src/agGrid/AdaptableAgGrid.d.ts +12 -8
  47. package/src/agGrid/AdaptableAgGrid.js +112 -31
  48. package/src/agGrid/AgGridFloatingFilterAdapter.js +1 -1
  49. package/src/agGrid/AgGridMenuAdapter.js +9 -1
  50. package/src/components/CheckBox/index.js +1 -1
  51. package/src/components/Dropdown/Arrows.js +1 -1
  52. package/src/components/ExpressionEditor/DataTableEditor.js +3 -3
  53. package/src/components/FormLayout/index.js +1 -1
  54. package/src/components/Select/Select.js +1 -1
  55. package/src/components/Tree/TreeDropdown/index.js +1 -1
  56. package/src/env.js +2 -2
  57. package/src/metamodel/adaptable.metamodel.d.ts +62 -0
  58. package/src/metamodel/adaptable.metamodel.js +1 -1
  59. package/src/types.d.ts +5 -2
  60. package/themes/dark.css +30 -29
  61. package/themes/light.css +4 -2
  62. package/tsconfig.esm.tsbuildinfo +1 -1
@@ -5,72 +5,153 @@ import { useAdaptable } from '../AdaptableContext';
5
5
  import { ColumnSelector } from '../Components/Selectors/ColumnSelector';
6
6
  import { AdaptableAgGrid } from '../../agGrid/AdaptableAgGrid';
7
7
  import { Box, Flex } from '../../components/Flex';
8
- const adaptableContainerId = `transposed-adaptable-container`;
9
- const agGridContainerId = `transposed-adaptable-ag-grid-container`;
8
+ import { ExportModuleId } from '../../Utilities/Constants/ModuleConstants';
9
+ import StringExtensions from '../../Utilities/Extensions/StringExtensions';
10
+ const ADAPTABLE_CONTAINER_ID = 'transposed-adaptable-container';
11
+ const AG_GRID_CONTAINER_ID = 'transposed-adaptable-ag-grid-container';
12
+ /** Field used for the first column in transposed grid (hidden, holds column id). */
13
+ const TRANSPOSED_FIRST_COLUMN_FIELD = '_transposed_column_value';
14
+ /** Header used for the first visible column in transposed grid (shows friendly name). */
15
+ const TRANSPOSED_FIRST_COLUMN_HEADER = '_transposed_column_header';
16
+ function buildTransposedAdaptableOptions({ hostOptions, transposedRowsAndColumns, currentTheme, }) {
17
+ return {
18
+ primaryKey: TRANSPOSED_FIRST_COLUMN_FIELD,
19
+ licenseKey: hostOptions.licenseKey,
20
+ userName: `${hostOptions.userName}`,
21
+ adaptableId: `${hostOptions.adaptableId}::TransposedView`,
22
+ containerOptions: {
23
+ adaptableContainer: ADAPTABLE_CONTAINER_ID,
24
+ agGridContainer: AG_GRID_CONTAINER_ID,
25
+ },
26
+ entitlementOptions: { defaultAccessLevel: 'Hidden' },
27
+ initialState: {
28
+ Layout: {
29
+ Revision: Date.now(),
30
+ CurrentLayout: 'TransposedView',
31
+ Layouts: [
32
+ {
33
+ Name: 'TransposedView',
34
+ TableColumns: [
35
+ TRANSPOSED_FIRST_COLUMN_HEADER,
36
+ ...transposedRowsAndColumns.transposedColumns.map((c) => c.colId),
37
+ ],
38
+ ColumnPinning: { [TRANSPOSED_FIRST_COLUMN_HEADER]: 'left' },
39
+ AutoSizeColumns: true,
40
+ },
41
+ ],
42
+ },
43
+ Theme: { CurrentTheme: currentTheme },
44
+ },
45
+ };
46
+ }
47
+ function buildTransposedGridOptions({ transposedRowsAndColumns, elevatedColumnId, adaptableApi, }) {
48
+ const firstColumn = {
49
+ field: TRANSPOSED_FIRST_COLUMN_HEADER,
50
+ headerName: adaptableApi.columnApi.getFriendlyNameForColumnId(elevatedColumnId),
51
+ };
52
+ return {
53
+ loading: false,
54
+ defaultColDef: {
55
+ floatingFilter: false,
56
+ filter: false,
57
+ sortable: true,
58
+ resizable: true,
59
+ enableRowGroup: false,
60
+ editable: false,
61
+ enablePivot: false,
62
+ enableValue: false,
63
+ lockPinned: true,
64
+ menuTabs: [],
65
+ width: 120,
66
+ },
67
+ columnDefs: [
68
+ { field: TRANSPOSED_FIRST_COLUMN_FIELD, hide: true },
69
+ firstColumn,
70
+ ...transposedRowsAndColumns.transposedColumns.map((col) => ({ field: col.colId, headerName: col.header })),
71
+ ],
72
+ rowData: transposedRowsAndColumns.transposedRows,
73
+ sideBar: false,
74
+ };
75
+ }
10
76
  export const TransposedPopup = (props) => {
11
77
  const adaptable = useAdaptable();
12
- const { transposedColumnId, hideTransposedColumn, visibleColumns, visibleRows, autosize } = props.popupProps;
13
- const rowNodes = React.useMemo(() => {
14
- return props.popupProps.visibleRows
15
- ? adaptable.api.gridApi.getVisibleRowNodes()
16
- : adaptable.api.gridApi.getAllRowNodes();
17
- }, [
18
- // can be later triggered by tickng data
19
- ]);
20
78
  const primaryKey = adaptable.api.optionsApi.getPrimaryKey();
21
- const [syntheticTransposedByColumnId, doSetSyntheticTransposedByColumnId] = React.useState(transposedColumnId);
22
- const setSyntheticTransposedByColumnId = (syntheticTransposedByColumnId) => {
79
+ const rawConfig = (props.popupProps ?? {});
80
+ const transposeConfig = {
81
+ transposedColumnId: rawConfig.transposedColumnId ?? primaryKey,
82
+ hideTransposedColumn: rawConfig.hideTransposedColumn ?? true,
83
+ autosize: rawConfig.autosize ?? true,
84
+ columnsToTranspose: rawConfig.columnsToTranspose,
85
+ rowsToTranspose: rawConfig.rowsToTranspose,
86
+ };
87
+ const rowNodes = React.useMemo(() => {
88
+ let transposableRowNodes = [];
89
+ const rowsToTranspose = transposeConfig.rowsToTranspose;
90
+ if (rowsToTranspose === 'VisibleOnly') {
91
+ return adaptable.api.gridApi.getVisibleRowNodes();
92
+ }
93
+ if (rowsToTranspose === 'All') {
94
+ return adaptable.api.gridApi.getAllRowNodes();
95
+ }
96
+ if (StringExtensions.IsNotNullOrEmpty(rowsToTranspose)) {
97
+ adaptable.api.gridApi.getAllRowNodes().forEach((rn) => {
98
+ const shouldTransposeRow = adaptable.api.internalApi
99
+ .getQueryLanguageService()
100
+ .evaluateBooleanExpression(rowsToTranspose, ExportModuleId, rn);
101
+ if (shouldTransposeRow) {
102
+ transposableRowNodes.push(rn);
103
+ }
104
+ });
105
+ return transposableRowNodes;
106
+ }
107
+ return adaptable.api.gridApi.getAllRowNodes();
108
+ }, [transposeConfig.rowsToTranspose, adaptable.api]);
109
+ const [elevatedColumnId, setElevatedColumnIdState] = React.useState(() => transposeConfig.transposedColumnId ?? primaryKey);
110
+ const setElevatedColumnId = (newElevatedColumnId) => {
23
111
  transposedAdaptableApiRef.current?.destroy({ unmount: true, destroyAgGrid: true });
24
- doSetSyntheticTransposedByColumnId(syntheticTransposedByColumnId);
112
+ setElevatedColumnIdState(newElevatedColumnId);
25
113
  };
26
114
  const transposedAdaptableApiRef = React.useRef(null);
27
115
  const columns = React.useMemo(() => {
28
- // customisable
29
- return visibleColumns
30
- ? adaptable.api.columnApi.getVisibleColumns()
31
- : adaptable.api.columnApi.getUIAvailableColumns();
32
- }, []);
116
+ const allUIColumns = adaptable.api.columnApi.getUIAvailableColumns();
117
+ const columnsToTranspose = transposeConfig.columnsToTranspose;
118
+ if (!columnsToTranspose) {
119
+ return allUIColumns;
120
+ }
121
+ const columnIds = typeof columnsToTranspose === 'function'
122
+ ? columnsToTranspose({
123
+ ...adaptable.api.internalApi.buildBaseContext(),
124
+ columns: allUIColumns,
125
+ })
126
+ : columnsToTranspose;
127
+ return columnIds
128
+ .map((c) => adaptable.api.columnApi.getColumnWithColumnId(c))
129
+ .filter((col) => col != null);
130
+ }, [transposeConfig.columnsToTranspose, adaptable.api]);
33
131
  /**
34
- * This is used as first field
132
+ * Build transposed structure: original rows become columns (colId = primaryKey value),
133
+ * original columns become rows. Each transposed row has the column id/header plus
134
+ * one cell per original row keyed by primaryKey value.
35
135
  */
36
- const transposedFirstColumnField = '_transposed_column_value';
37
- const transposedFirstColumnHeader = '_transposed_column_header';
38
136
  const transposedRowsAndColumns = React.useMemo(() => {
39
- /**
40
- * transposed column values become primaryKey of the new tarnsposed rows
41
- * we build row by row, might be easer
42
- */
43
137
  const transposedColumns = [];
44
138
  const transposedRows = [];
45
139
  for (const row of rowNodes) {
46
- // we force the col-ids to be strings, easer to work with
47
- //row[transposeByColumnId] + '';
48
140
  const colId = adaptable.api.gridApi.getNormalisedValueFromRowNode(row, primaryKey) + '';
49
- //row[synteticTransposedByColumnId] + '';
50
- const header = adaptable.api.gridApi.getNormalisedValueFromRowNode(row, syntheticTransposedByColumnId) +
51
- '';
52
- transposedColumns.push({
53
- colId,
54
- header,
55
- });
141
+ const header = adaptable.api.gridApi.getNormalisedValueFromRowNode(row, elevatedColumnId) + '';
142
+ transposedColumns.push({ colId, header });
56
143
  }
57
144
  for (const column of columns) {
58
- /**
59
- * We can hide the transposed column, if we want
60
- */
61
- if (hideTransposedColumn && column.columnId === syntheticTransposedByColumnId) {
145
+ if (transposeConfig.hideTransposedColumn &&
146
+ column.columnId === elevatedColumnId) {
62
147
  continue;
63
148
  }
64
149
  const transposedRow = {
65
- // [transposed-by-column-id]: [other column id],
66
- // the value can be set to friendlyname
67
- [transposedFirstColumnField]: column.columnId,
68
- [transposedFirstColumnHeader]: column.friendlyName,
150
+ [TRANSPOSED_FIRST_COLUMN_FIELD]: column.columnId,
151
+ [TRANSPOSED_FIRST_COLUMN_HEADER]: column.friendlyName,
69
152
  };
70
- for (let row of rowNodes) {
71
- // [transposed-by-column-value[n]]: [other column value[n]]
153
+ for (const row of rowNodes) {
72
154
  const key = adaptable.api.gridApi.getNormalisedValueFromRowNode(row, primaryKey);
73
- // row[column.field]
74
155
  let value = adaptable.api.gridApi.getDisplayValueFromRowNode(row, column.columnId);
75
156
  if (value instanceof Date) {
76
157
  value = value.toLocaleString();
@@ -79,90 +160,25 @@ export const TransposedPopup = (props) => {
79
160
  }
80
161
  transposedRows.push(transposedRow);
81
162
  }
82
- return {
83
- transposedColumns,
84
- transposedRows,
85
- };
86
- }, [rowNodes, primaryKey, syntheticTransposedByColumnId]);
163
+ return { transposedColumns, transposedRows };
164
+ }, [rowNodes, primaryKey, elevatedColumnId, columns, transposeConfig.hideTransposedColumn, adaptable.api]);
87
165
  React.useEffect(() => {
88
- // Mounting in an effect, so the nodes are rendered/available
89
- const hostAdaptableOptions = adaptable.adaptableOptions;
90
- const adaptableOptions = {
91
- primaryKey: transposedFirstColumnField,
92
- licenseKey: hostAdaptableOptions.licenseKey,
93
- userName: `${hostAdaptableOptions.userName}`,
94
- adaptableId: `${hostAdaptableOptions.adaptableId}::TransposedView`,
95
- containerOptions: {
96
- adaptableContainer: adaptableContainerId,
97
- agGridContainer: agGridContainerId,
98
- },
99
- entitlementOptions: {
100
- defaultAccessLevel: 'Hidden',
101
- },
102
- initialState: {
103
- Layout: {
104
- Revision: Date.now(),
105
- CurrentLayout: 'TransposedView',
106
- Layouts: [
107
- {
108
- Name: 'TransposedView',
109
- TableColumns: [
110
- transposedFirstColumnHeader,
111
- ...transposedRowsAndColumns.transposedColumns.map((c) => c.colId),
112
- ],
113
- ColumnPinning: {
114
- [transposedFirstColumnHeader]: 'left',
115
- },
116
- AutoSizeColumns: true,
117
- },
118
- ],
119
- },
120
- Theme: {
121
- CurrentTheme: adaptable.api.themeApi.getCurrentTheme(),
122
- },
123
- },
124
- };
125
- const firstColumn = {
126
- field: transposedFirstColumnHeader, // use the column friendly name
127
- headerName: adaptable.api.columnApi.getFriendlyNameForColumnId(syntheticTransposedByColumnId),
128
- };
129
- const agGridOptions = {
130
- loading: false,
131
- defaultColDef: {
132
- floatingFilter: false,
133
- filter: false,
134
- sortable: true,
135
- resizable: true,
136
- enableRowGroup: false,
137
- editable: false,
138
- enablePivot: false,
139
- enableValue: false,
140
- lockPinned: true,
141
- menuTabs: [],
142
- width: 120,
143
- },
144
- columnDefs: [
145
- {
146
- field: transposedFirstColumnField,
147
- hide: true,
148
- },
149
- firstColumn,
150
- ...transposedRowsAndColumns.transposedColumns.map((col) => {
151
- return {
152
- field: col.colId,
153
- type: null,
154
- headerName: col.header,
155
- };
156
- }),
157
- ],
158
- rowData: transposedRowsAndColumns.transposedRows,
159
- sideBar: false,
160
- };
166
+ const hostOptions = adaptable.adaptableOptions;
167
+ const adaptableOptions = buildTransposedAdaptableOptions({
168
+ hostOptions,
169
+ transposedRowsAndColumns,
170
+ currentTheme: adaptable.api.themeApi.getCurrentTheme(),
171
+ });
172
+ const gridOptions = buildTransposedGridOptions({
173
+ transposedRowsAndColumns,
174
+ elevatedColumnId,
175
+ adaptableApi: adaptable.api,
176
+ });
161
177
  const modules = adaptable.agGridModulesAdapter.getAgGridRegisteredModules();
162
178
  AdaptableAgGrid._initInternal({
163
179
  variant: 'vanilla',
164
180
  adaptableOptions,
165
- gridOptions: agGridOptions,
181
+ gridOptions,
166
182
  modules,
167
183
  }).then((adaptableApi) => {
168
184
  transposedAdaptableApiRef.current = adaptableApi;
@@ -170,30 +186,20 @@ export const TransposedPopup = (props) => {
170
186
  transposedAdaptableApiRef.current?.themeApi.loadTheme(typeof event.theme === 'object' ? event.theme.Name : event.theme);
171
187
  });
172
188
  });
173
- }, [syntheticTransposedByColumnId]);
189
+ }, [elevatedColumnId, adaptable]);
174
190
  React.useEffect(() => {
175
- // destroy when closing the popup
176
191
  return () => {
177
192
  requestAnimationFrame(() => {
178
193
  transposedAdaptableApiRef.current?.destroy({ unmount: true, destroyAgGrid: true });
179
194
  });
180
195
  };
181
196
  }, []);
182
- /**
183
- * Need to get all data, manualy pivot the grid using the primary key.
184
- *
185
- * 1. get the data, and pivot using the primary key
186
- * 2. create the col definitios, a col definition for each row
187
- * 3. create the grid
188
- */
189
197
  return (React.createElement(Flex, { flexDirection: "column", className: "twa:w-full twa:h-full" },
190
198
  React.createElement(Panel, null,
191
199
  React.createElement(FormLayout, null,
192
200
  React.createElement(FormRow, { label: "Elevated Column" },
193
- React.createElement(ColumnSelector, { value: syntheticTransposedByColumnId, onChange: (colId) => {
194
- setSyntheticTransposedByColumnId(colId);
195
- } })))),
201
+ React.createElement(ColumnSelector, { value: elevatedColumnId, onChange: setElevatedColumnId })))),
196
202
  React.createElement(Flex, { className: "twa:h-full" },
197
- React.createElement(Box, { id: adaptableContainerId }),
198
- React.createElement(Box, { className: "twa:h-full twa:w-full", id: agGridContainerId }))));
203
+ React.createElement(Box, { id: ADAPTABLE_CONTAINER_ID }),
204
+ React.createElement(Box, { className: "twa:h-full twa:w-full", id: AG_GRID_CONTAINER_ID }))));
199
205
  };
@@ -53,7 +53,7 @@ export const ScheduleSettingsReminder = (props) => {
53
53
  React.createElement(Tabs.Content, null,
54
54
  React.createElement(FormLayout, null,
55
55
  React.createElement(FormRow, { label: "Name" },
56
- React.createElement(Input, { "data-name": "schedule-name", className: "twa:w-[300px]", onChange: handleNameChange, placeholder: "Enter Schedule Name", type: "string", value: props.reminderSchedule?.Name ?? '' })),
56
+ React.createElement(Input, { "data-name": "schedule-name", className: "twa:w-[300px]", onChange: handleNameChange, placeholder: "Enter Reminder Name", type: "string", value: props.reminderSchedule?.Name ?? '' })),
57
57
  React.createElement(FormRow, { label: "" },
58
58
  React.createElement(Box, { className: "twa:h-2" })),
59
59
  React.createElement(FormRow, { label: "Header" },
@@ -6,6 +6,7 @@ import { Schedule, Weekday } from '../AdaptableState/Common/Schedule';
6
6
  import { AdaptableColumnDataType, AdaptableSystemIconName, AdaptableOptions } from '../types';
7
7
  import { AdaptableAlert } from '../AdaptableState/Common/AdaptableAlert';
8
8
  import { AdaptableMessageType } from '../AdaptableState/Common/AdaptableMessageType';
9
+ import type { ContainerContext } from '../AdaptableOptions/ContainerOptions';
9
10
  export declare const BLACK: string;
10
11
  export declare const WHITE: string;
11
12
  export declare const LIGHT_GRAY: string;
@@ -31,7 +32,7 @@ export declare function getDefaultColors(): string[];
31
32
  export declare function getEmptyConfigState(): EditableConfigEntityState;
32
33
  export declare function getDescriptionForDataType(dataType: AdaptableColumnDataType): "text" | "number" | "date";
33
34
  export declare function getPlaceholderForDataType(dataType: AdaptableColumnDataType): "Enter Value" | "Enter Number" | "Enter Date";
34
- export declare function getModalContainer(adaptableOptions: AdaptableOptions, document: Document): HTMLElement;
35
+ export declare function getModalContainer(adaptableOptions: AdaptableOptions, document: Document, context?: ContainerContext): HTMLElement;
35
36
  export declare function IsEmptyStyle(style: AdaptableStyle): boolean;
36
37
  export declare function IsNotEmptyStyle(style: AdaptableStyle): boolean;
37
38
  export declare function getMessageTypeByStatusColour(statusColour: StatusColour): AdaptableMessageType;
@@ -2,6 +2,7 @@ import { WizardStatus, } from './Components/SharedProps/EditableConfigEntityStat
2
2
  import { FontWeight, FontStyle, StatusColour } from '../AdaptableState/Common/Enums';
3
3
  import { StringExtensions } from '../Utilities/Extensions/StringExtensions';
4
4
  import ArrayExtensions from '../Utilities/Extensions/ArrayExtensions';
5
+ import { resolveContainerElement } from '../Utilities/resolveContainerElement';
5
6
  export const BLACK = 'Black';
6
7
  export const WHITE = 'White';
7
8
  export const LIGHT_GRAY = 'LightGray';
@@ -120,19 +121,12 @@ export function getPlaceholderForDataType(dataType) {
120
121
  return 'Enter Date';
121
122
  }
122
123
  }
123
- export function getModalContainer(adaptableOptions, document) {
124
- let modalContainer;
125
- if (adaptableOptions.containerOptions.modalContainer) {
126
- // this has been set, so we use the property
127
- modalContainer =
128
- typeof adaptableOptions.containerOptions.modalContainer === 'string'
129
- ? document.getElementById(adaptableOptions.containerOptions.modalContainer)
130
- : adaptableOptions.containerOptions.modalContainer;
131
- if (modalContainer) {
132
- const modalContainerClassName = ' modal-container';
133
- if (!modalContainer.className.includes(modalContainerClassName)) {
134
- modalContainer.className += modalContainerClassName;
135
- }
124
+ export function getModalContainer(adaptableOptions, document, context) {
125
+ let modalContainer = resolveContainerElement(adaptableOptions.containerOptions.modalContainer, context, document);
126
+ if (modalContainer) {
127
+ const modalContainerClassName = ' modal-container';
128
+ if (!modalContainer.className.includes(modalContainerClassName)) {
129
+ modalContainer.className += modalContainerClassName;
136
130
  }
137
131
  }
138
132
  if (!modalContainer) {
@@ -423,7 +417,7 @@ export function getAdaptableToolPanelWidth() {
423
417
  return getNumericCSSVariableValue(getCSSVariableValue('--ab-cmp-toolpanel__width'), 200);
424
418
  }
425
419
  export function getSimpleButtonPaddingWidth() {
426
- return getNumericCSSVariableValue(getCSSVariableValue('--ab-space-1'), 4);
420
+ return getNumericCSSVariableValue(getCSSVariableValue('--ab-base-space'), 4);
427
421
  }
428
422
  export function getCSSVariableValue(cssVariable) {
429
423
  if (!isBrowserDocumentAvailable()) {
@@ -5,6 +5,7 @@ import { AdaptableAgGrid } from './AdaptableAgGrid';
5
5
  import { getDefaultAdaptableOptions } from '../AdaptableOptions/DefaultAdaptableOptions';
6
6
  import { renderReactRoot as defaultRenderReactRoot } from '../renderReactRoot';
7
7
  import AdaptableWizardView from '../View/AdaptableWizardView';
8
+ import { resolveContainerElement } from '../Utilities/resolveContainerElement';
8
9
  export class Adaptable {
9
10
  /**
10
11
  * Initializer for Adaptable
@@ -39,19 +40,18 @@ export class AdaptableNoCodeWizard {
39
40
  this.render();
40
41
  }
41
42
  render(container) {
42
- let id = getDefaultAdaptableOptions().containerOptions.adaptableContainer || 'adaptable';
43
43
  if (!container) {
44
- let containerOptionsContainer = this.adaptableOptions.containerOptions?.adaptableContainer;
45
- if (containerOptionsContainer) {
46
- if (typeof containerOptionsContainer === 'string') {
47
- id = containerOptionsContainer ?? id;
48
- }
49
- else {
50
- container = containerOptionsContainer;
51
- }
52
- }
44
+ const initContext = {
45
+ adaptableId: this.adaptableOptions?.adaptableId ?? '',
46
+ adaptableStateKey: this.adaptableOptions?.adaptableStateKey ?? '',
47
+ adaptableContext: this.adaptableOptions?.adaptableContext,
48
+ };
49
+ container = resolveContainerElement(this.adaptableOptions.containerOptions?.adaptableContainer, initContext);
50
+ }
51
+ if (!container) {
52
+ const defaultId = getDefaultAdaptableOptions().containerOptions.adaptableContainer || 'adaptable';
53
+ container = document.getElementById(defaultId);
53
54
  }
54
- container = container || document.getElementById(id);
55
55
  if (!container) {
56
56
  throw new Error('Cannot find container in which to render Adaptable No Code Wizard');
57
57
  }
@@ -1,5 +1,5 @@
1
1
  import { AdaptableOptions } from '../AdaptableOptions/AdaptableOptions';
2
- import { ChartRef, Column, GridApi, GridOptions, IRowNode, Module, RowModelType } from 'ag-grid-enterprise';
2
+ import { ChartRef, Column, GridApi, GridOptions, IRowNode, Module, RowModelType, StatusPanelDef } from 'ag-grid-enterprise';
3
3
  import { AdaptableLogger } from './AdaptableLogger';
4
4
  import { AdaptableApi, DestroyConfig } from '../Api/AdaptableApi';
5
5
  import { AdaptableVariant, IAdaptable, NormalizeAdaptableStateOptions } from '../AdaptableInterfaces/IAdaptable';
@@ -20,7 +20,7 @@ import { Fdc3Service } from '../Utilities/Services/Fdc3Service';
20
20
  import { AnnotationsService } from '../Utilities/Services/AnnotationsService';
21
21
  import { IModuleCollection } from '../Strategy/Interface/IModule';
22
22
  import { AgGridMenuAdapter } from './AgGridMenuAdapter';
23
- import { AdaptableColumn, AdaptableTheme, ChartDefinition, ColumnSort, DataUpdateConfig, GridCell, InFilterValueResult, Layout, SelectedCellInfo, SelectedRowInfo } from '../types';
23
+ import { AdaptableColumn, AdaptableTheme, ChartDefinition, ColumnSort, DataRowConfig, DataUpdateConfig, GridCell, InFilterValueResult, Layout, SelectedCellInfo, SelectedRowInfo } from '../types';
24
24
  import { RenderReactRootFn } from '../renderReactRoot';
25
25
  import { AgGridOptionsService } from './AgGridOptionsService';
26
26
  import { AgGridColumnAdapter } from './AgGridColumnAdapter';
@@ -119,6 +119,8 @@ export declare class AdaptableAgGrid implements IAdaptable {
119
119
  * Temporary, these are MIGRATION technical debts, and should be removed as soon as possible
120
120
  */
121
121
  private adaptableStatusPanelKeys;
122
+ private adaptableStatusPanelDefs;
123
+ hasAdaptableStatusBar: boolean;
122
124
  _PRIVATE_adaptableJSXElement: React.JSX.Element;
123
125
  private _prevLayout;
124
126
  private __prevLayoutForRefresh;
@@ -163,6 +165,11 @@ export declare class AdaptableAgGrid implements IAdaptable {
163
165
  private refreshInitialSortIfNeeded;
164
166
  showQuickFilter(): void;
165
167
  hideQuickFilter(): void;
168
+ showAdaptableToolPanel(): void;
169
+ hideAdaptableToolPanel(): void;
170
+ private buildAdaptableToolPanelDef;
171
+ showAdaptableStatusBar(): void;
172
+ hideAdaptableStatusBar(): void;
166
173
  private normalizeAdaptableOptions;
167
174
  private setInitialGridOptions;
168
175
  /**
@@ -170,6 +177,7 @@ export declare class AdaptableAgGrid implements IAdaptable {
170
177
  */
171
178
  private initializeAgGrid;
172
179
  useRowNodeLookUp(): boolean;
180
+ private buildInitContainerContext;
173
181
  getAgGridContainerElement(): HTMLElement | null;
174
182
  getAdaptableContainerElement(): HTMLElement;
175
183
  refreshSelectedCellsState(): SelectedCellInfo | undefined;
@@ -257,11 +265,7 @@ export declare class AdaptableAgGrid implements IAdaptable {
257
265
  added: IRowNode[];
258
266
  updated: IRowNode[];
259
267
  }>;
260
- manageGridRows(dataRows: {
261
- add?: any[];
262
- update?: any[];
263
- delete?: any[];
264
- }, config?: DataUpdateConfig): Promise<{
268
+ manageGridRows(dataRowConfig: DataRowConfig, dataUpdateConfig?: DataUpdateConfig): Promise<{
265
269
  addedRows: IRowNode[];
266
270
  updatedRows: IRowNode[];
267
271
  removedRows: IRowNode[];
@@ -292,7 +296,7 @@ export declare class AdaptableAgGrid implements IAdaptable {
292
296
  getGridCellsForColumn(columnId: string, onlyVisibleRows?: boolean): GridCell[] | undefined;
293
297
  getRowNodesForPrimaryKeys(primaryKeyValues: any[]): any[];
294
298
  getRowNodeByIndex(index: number): IRowNode;
295
- getAgGridStatusPanels(): import("ag-grid-enterprise").StatusPanelDef[];
299
+ getAgGridStatusPanels(): StatusPanelDef[];
296
300
  setDataValue(value: any, column: AdaptableColumn, primaryKeyValue: any, rowNode?: IRowNode): void;
297
301
  forAllRowNodesDo(func: (rowNode: IRowNode, rowIndex: number) => void, config?: {
298
302
  includeGroupRows?: boolean;