@adaptabletools/adaptable-cjs 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 +2 -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 +2 -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 +26 -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 +47 -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 +35 -0
  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.cjs.tsbuildinfo +1 -1
@@ -9,72 +9,153 @@ const AdaptableContext_1 = require("../AdaptableContext");
9
9
  const ColumnSelector_1 = require("../Components/Selectors/ColumnSelector");
10
10
  const AdaptableAgGrid_1 = require("../../agGrid/AdaptableAgGrid");
11
11
  const Flex_1 = require("../../components/Flex");
12
- const adaptableContainerId = `transposed-adaptable-container`;
13
- const agGridContainerId = `transposed-adaptable-ag-grid-container`;
12
+ const ModuleConstants_1 = require("../../Utilities/Constants/ModuleConstants");
13
+ const StringExtensions_1 = tslib_1.__importDefault(require("../../Utilities/Extensions/StringExtensions"));
14
+ const ADAPTABLE_CONTAINER_ID = 'transposed-adaptable-container';
15
+ const AG_GRID_CONTAINER_ID = 'transposed-adaptable-ag-grid-container';
16
+ /** Field used for the first column in transposed grid (hidden, holds column id). */
17
+ const TRANSPOSED_FIRST_COLUMN_FIELD = '_transposed_column_value';
18
+ /** Header used for the first visible column in transposed grid (shows friendly name). */
19
+ const TRANSPOSED_FIRST_COLUMN_HEADER = '_transposed_column_header';
20
+ function buildTransposedAdaptableOptions({ hostOptions, transposedRowsAndColumns, currentTheme, }) {
21
+ return {
22
+ primaryKey: TRANSPOSED_FIRST_COLUMN_FIELD,
23
+ licenseKey: hostOptions.licenseKey,
24
+ userName: `${hostOptions.userName}`,
25
+ adaptableId: `${hostOptions.adaptableId}::TransposedView`,
26
+ containerOptions: {
27
+ adaptableContainer: ADAPTABLE_CONTAINER_ID,
28
+ agGridContainer: AG_GRID_CONTAINER_ID,
29
+ },
30
+ entitlementOptions: { defaultAccessLevel: 'Hidden' },
31
+ initialState: {
32
+ Layout: {
33
+ Revision: Date.now(),
34
+ CurrentLayout: 'TransposedView',
35
+ Layouts: [
36
+ {
37
+ Name: 'TransposedView',
38
+ TableColumns: [
39
+ TRANSPOSED_FIRST_COLUMN_HEADER,
40
+ ...transposedRowsAndColumns.transposedColumns.map((c) => c.colId),
41
+ ],
42
+ ColumnPinning: { [TRANSPOSED_FIRST_COLUMN_HEADER]: 'left' },
43
+ AutoSizeColumns: true,
44
+ },
45
+ ],
46
+ },
47
+ Theme: { CurrentTheme: currentTheme },
48
+ },
49
+ };
50
+ }
51
+ function buildTransposedGridOptions({ transposedRowsAndColumns, elevatedColumnId, adaptableApi, }) {
52
+ const firstColumn = {
53
+ field: TRANSPOSED_FIRST_COLUMN_HEADER,
54
+ headerName: adaptableApi.columnApi.getFriendlyNameForColumnId(elevatedColumnId),
55
+ };
56
+ return {
57
+ loading: false,
58
+ defaultColDef: {
59
+ floatingFilter: false,
60
+ filter: false,
61
+ sortable: true,
62
+ resizable: true,
63
+ enableRowGroup: false,
64
+ editable: false,
65
+ enablePivot: false,
66
+ enableValue: false,
67
+ lockPinned: true,
68
+ menuTabs: [],
69
+ width: 120,
70
+ },
71
+ columnDefs: [
72
+ { field: TRANSPOSED_FIRST_COLUMN_FIELD, hide: true },
73
+ firstColumn,
74
+ ...transposedRowsAndColumns.transposedColumns.map((col) => ({ field: col.colId, headerName: col.header })),
75
+ ],
76
+ rowData: transposedRowsAndColumns.transposedRows,
77
+ sideBar: false,
78
+ };
79
+ }
14
80
  const TransposedPopup = (props) => {
15
81
  const adaptable = (0, AdaptableContext_1.useAdaptable)();
16
- const { transposedColumnId, hideTransposedColumn, visibleColumns, visibleRows, autosize } = props.popupProps;
17
- const rowNodes = React.useMemo(() => {
18
- return props.popupProps.visibleRows
19
- ? adaptable.api.gridApi.getVisibleRowNodes()
20
- : adaptable.api.gridApi.getAllRowNodes();
21
- }, [
22
- // can be later triggered by tickng data
23
- ]);
24
82
  const primaryKey = adaptable.api.optionsApi.getPrimaryKey();
25
- const [syntheticTransposedByColumnId, doSetSyntheticTransposedByColumnId] = React.useState(transposedColumnId);
26
- const setSyntheticTransposedByColumnId = (syntheticTransposedByColumnId) => {
83
+ const rawConfig = (props.popupProps ?? {});
84
+ const transposeConfig = {
85
+ transposedColumnId: rawConfig.transposedColumnId ?? primaryKey,
86
+ hideTransposedColumn: rawConfig.hideTransposedColumn ?? true,
87
+ autosize: rawConfig.autosize ?? true,
88
+ columnsToTranspose: rawConfig.columnsToTranspose,
89
+ rowsToTranspose: rawConfig.rowsToTranspose,
90
+ };
91
+ const rowNodes = React.useMemo(() => {
92
+ let transposableRowNodes = [];
93
+ const rowsToTranspose = transposeConfig.rowsToTranspose;
94
+ if (rowsToTranspose === 'VisibleOnly') {
95
+ return adaptable.api.gridApi.getVisibleRowNodes();
96
+ }
97
+ if (rowsToTranspose === 'All') {
98
+ return adaptable.api.gridApi.getAllRowNodes();
99
+ }
100
+ if (StringExtensions_1.default.IsNotNullOrEmpty(rowsToTranspose)) {
101
+ adaptable.api.gridApi.getAllRowNodes().forEach((rn) => {
102
+ const shouldTransposeRow = adaptable.api.internalApi
103
+ .getQueryLanguageService()
104
+ .evaluateBooleanExpression(rowsToTranspose, ModuleConstants_1.ExportModuleId, rn);
105
+ if (shouldTransposeRow) {
106
+ transposableRowNodes.push(rn);
107
+ }
108
+ });
109
+ return transposableRowNodes;
110
+ }
111
+ return adaptable.api.gridApi.getAllRowNodes();
112
+ }, [transposeConfig.rowsToTranspose, adaptable.api]);
113
+ const [elevatedColumnId, setElevatedColumnIdState] = React.useState(() => transposeConfig.transposedColumnId ?? primaryKey);
114
+ const setElevatedColumnId = (newElevatedColumnId) => {
27
115
  transposedAdaptableApiRef.current?.destroy({ unmount: true, destroyAgGrid: true });
28
- doSetSyntheticTransposedByColumnId(syntheticTransposedByColumnId);
116
+ setElevatedColumnIdState(newElevatedColumnId);
29
117
  };
30
118
  const transposedAdaptableApiRef = React.useRef(null);
31
119
  const columns = React.useMemo(() => {
32
- // customisable
33
- return visibleColumns
34
- ? adaptable.api.columnApi.getVisibleColumns()
35
- : adaptable.api.columnApi.getUIAvailableColumns();
36
- }, []);
120
+ const allUIColumns = adaptable.api.columnApi.getUIAvailableColumns();
121
+ const columnsToTranspose = transposeConfig.columnsToTranspose;
122
+ if (!columnsToTranspose) {
123
+ return allUIColumns;
124
+ }
125
+ const columnIds = typeof columnsToTranspose === 'function'
126
+ ? columnsToTranspose({
127
+ ...adaptable.api.internalApi.buildBaseContext(),
128
+ columns: allUIColumns,
129
+ })
130
+ : columnsToTranspose;
131
+ return columnIds
132
+ .map((c) => adaptable.api.columnApi.getColumnWithColumnId(c))
133
+ .filter((col) => col != null);
134
+ }, [transposeConfig.columnsToTranspose, adaptable.api]);
37
135
  /**
38
- * This is used as first field
136
+ * Build transposed structure: original rows become columns (colId = primaryKey value),
137
+ * original columns become rows. Each transposed row has the column id/header plus
138
+ * one cell per original row keyed by primaryKey value.
39
139
  */
40
- const transposedFirstColumnField = '_transposed_column_value';
41
- const transposedFirstColumnHeader = '_transposed_column_header';
42
140
  const transposedRowsAndColumns = React.useMemo(() => {
43
- /**
44
- * transposed column values become primaryKey of the new tarnsposed rows
45
- * we build row by row, might be easer
46
- */
47
141
  const transposedColumns = [];
48
142
  const transposedRows = [];
49
143
  for (const row of rowNodes) {
50
- // we force the col-ids to be strings, easer to work with
51
- //row[transposeByColumnId] + '';
52
144
  const colId = adaptable.api.gridApi.getNormalisedValueFromRowNode(row, primaryKey) + '';
53
- //row[synteticTransposedByColumnId] + '';
54
- const header = adaptable.api.gridApi.getNormalisedValueFromRowNode(row, syntheticTransposedByColumnId) +
55
- '';
56
- transposedColumns.push({
57
- colId,
58
- header,
59
- });
145
+ const header = adaptable.api.gridApi.getNormalisedValueFromRowNode(row, elevatedColumnId) + '';
146
+ transposedColumns.push({ colId, header });
60
147
  }
61
148
  for (const column of columns) {
62
- /**
63
- * We can hide the transposed column, if we want
64
- */
65
- if (hideTransposedColumn && column.columnId === syntheticTransposedByColumnId) {
149
+ if (transposeConfig.hideTransposedColumn &&
150
+ column.columnId === elevatedColumnId) {
66
151
  continue;
67
152
  }
68
153
  const transposedRow = {
69
- // [transposed-by-column-id]: [other column id],
70
- // the value can be set to friendlyname
71
- [transposedFirstColumnField]: column.columnId,
72
- [transposedFirstColumnHeader]: column.friendlyName,
154
+ [TRANSPOSED_FIRST_COLUMN_FIELD]: column.columnId,
155
+ [TRANSPOSED_FIRST_COLUMN_HEADER]: column.friendlyName,
73
156
  };
74
- for (let row of rowNodes) {
75
- // [transposed-by-column-value[n]]: [other column value[n]]
157
+ for (const row of rowNodes) {
76
158
  const key = adaptable.api.gridApi.getNormalisedValueFromRowNode(row, primaryKey);
77
- // row[column.field]
78
159
  let value = adaptable.api.gridApi.getDisplayValueFromRowNode(row, column.columnId);
79
160
  if (value instanceof Date) {
80
161
  value = value.toLocaleString();
@@ -83,90 +164,25 @@ const TransposedPopup = (props) => {
83
164
  }
84
165
  transposedRows.push(transposedRow);
85
166
  }
86
- return {
87
- transposedColumns,
88
- transposedRows,
89
- };
90
- }, [rowNodes, primaryKey, syntheticTransposedByColumnId]);
167
+ return { transposedColumns, transposedRows };
168
+ }, [rowNodes, primaryKey, elevatedColumnId, columns, transposeConfig.hideTransposedColumn, adaptable.api]);
91
169
  React.useEffect(() => {
92
- // Mounting in an effect, so the nodes are rendered/available
93
- const hostAdaptableOptions = adaptable.adaptableOptions;
94
- const adaptableOptions = {
95
- primaryKey: transposedFirstColumnField,
96
- licenseKey: hostAdaptableOptions.licenseKey,
97
- userName: `${hostAdaptableOptions.userName}`,
98
- adaptableId: `${hostAdaptableOptions.adaptableId}::TransposedView`,
99
- containerOptions: {
100
- adaptableContainer: adaptableContainerId,
101
- agGridContainer: agGridContainerId,
102
- },
103
- entitlementOptions: {
104
- defaultAccessLevel: 'Hidden',
105
- },
106
- initialState: {
107
- Layout: {
108
- Revision: Date.now(),
109
- CurrentLayout: 'TransposedView',
110
- Layouts: [
111
- {
112
- Name: 'TransposedView',
113
- TableColumns: [
114
- transposedFirstColumnHeader,
115
- ...transposedRowsAndColumns.transposedColumns.map((c) => c.colId),
116
- ],
117
- ColumnPinning: {
118
- [transposedFirstColumnHeader]: 'left',
119
- },
120
- AutoSizeColumns: true,
121
- },
122
- ],
123
- },
124
- Theme: {
125
- CurrentTheme: adaptable.api.themeApi.getCurrentTheme(),
126
- },
127
- },
128
- };
129
- const firstColumn = {
130
- field: transposedFirstColumnHeader, // use the column friendly name
131
- headerName: adaptable.api.columnApi.getFriendlyNameForColumnId(syntheticTransposedByColumnId),
132
- };
133
- const agGridOptions = {
134
- loading: false,
135
- defaultColDef: {
136
- floatingFilter: false,
137
- filter: false,
138
- sortable: true,
139
- resizable: true,
140
- enableRowGroup: false,
141
- editable: false,
142
- enablePivot: false,
143
- enableValue: false,
144
- lockPinned: true,
145
- menuTabs: [],
146
- width: 120,
147
- },
148
- columnDefs: [
149
- {
150
- field: transposedFirstColumnField,
151
- hide: true,
152
- },
153
- firstColumn,
154
- ...transposedRowsAndColumns.transposedColumns.map((col) => {
155
- return {
156
- field: col.colId,
157
- type: null,
158
- headerName: col.header,
159
- };
160
- }),
161
- ],
162
- rowData: transposedRowsAndColumns.transposedRows,
163
- sideBar: false,
164
- };
170
+ const hostOptions = adaptable.adaptableOptions;
171
+ const adaptableOptions = buildTransposedAdaptableOptions({
172
+ hostOptions,
173
+ transposedRowsAndColumns,
174
+ currentTheme: adaptable.api.themeApi.getCurrentTheme(),
175
+ });
176
+ const gridOptions = buildTransposedGridOptions({
177
+ transposedRowsAndColumns,
178
+ elevatedColumnId,
179
+ adaptableApi: adaptable.api,
180
+ });
165
181
  const modules = adaptable.agGridModulesAdapter.getAgGridRegisteredModules();
166
182
  AdaptableAgGrid_1.AdaptableAgGrid._initInternal({
167
183
  variant: 'vanilla',
168
184
  adaptableOptions,
169
- gridOptions: agGridOptions,
185
+ gridOptions,
170
186
  modules,
171
187
  }).then((adaptableApi) => {
172
188
  transposedAdaptableApiRef.current = adaptableApi;
@@ -174,31 +190,21 @@ const TransposedPopup = (props) => {
174
190
  transposedAdaptableApiRef.current?.themeApi.loadTheme(typeof event.theme === 'object' ? event.theme.Name : event.theme);
175
191
  });
176
192
  });
177
- }, [syntheticTransposedByColumnId]);
193
+ }, [elevatedColumnId, adaptable]);
178
194
  React.useEffect(() => {
179
- // destroy when closing the popup
180
195
  return () => {
181
196
  requestAnimationFrame(() => {
182
197
  transposedAdaptableApiRef.current?.destroy({ unmount: true, destroyAgGrid: true });
183
198
  });
184
199
  };
185
200
  }, []);
186
- /**
187
- * Need to get all data, manualy pivot the grid using the primary key.
188
- *
189
- * 1. get the data, and pivot using the primary key
190
- * 2. create the col definitios, a col definition for each row
191
- * 3. create the grid
192
- */
193
201
  return (React.createElement(Flex_1.Flex, { flexDirection: "column", className: "twa:w-full twa:h-full" },
194
202
  React.createElement(Panel_1.default, null,
195
203
  React.createElement(FormLayout_1.default, null,
196
204
  React.createElement(FormLayout_1.FormRow, { label: "Elevated Column" },
197
- React.createElement(ColumnSelector_1.ColumnSelector, { value: syntheticTransposedByColumnId, onChange: (colId) => {
198
- setSyntheticTransposedByColumnId(colId);
199
- } })))),
205
+ React.createElement(ColumnSelector_1.ColumnSelector, { value: elevatedColumnId, onChange: setElevatedColumnId })))),
200
206
  React.createElement(Flex_1.Flex, { className: "twa:h-full" },
201
- React.createElement(Flex_1.Box, { id: adaptableContainerId }),
202
- React.createElement(Flex_1.Box, { className: "twa:h-full twa:w-full", id: agGridContainerId }))));
207
+ React.createElement(Flex_1.Box, { id: ADAPTABLE_CONTAINER_ID }),
208
+ React.createElement(Flex_1.Box, { className: "twa:h-full twa:w-full", id: AG_GRID_CONTAINER_ID }))));
203
209
  };
204
210
  exports.TransposedPopup = TransposedPopup;
@@ -57,7 +57,7 @@ const ScheduleSettingsReminder = (props) => {
57
57
  React.createElement(Tabs_1.Tabs.Content, null,
58
58
  React.createElement(FormLayout_1.default, null,
59
59
  React.createElement(FormLayout_1.FormRow, { label: "Name" },
60
- React.createElement(Input_1.default, { "data-name": "schedule-name", className: "twa:w-[300px]", onChange: handleNameChange, placeholder: "Enter Schedule Name", type: "string", value: props.reminderSchedule?.Name ?? '' })),
60
+ React.createElement(Input_1.default, { "data-name": "schedule-name", className: "twa:w-[300px]", onChange: handleNameChange, placeholder: "Enter Reminder Name", type: "string", value: props.reminderSchedule?.Name ?? '' })),
61
61
  React.createElement(FormLayout_1.FormRow, { label: "" },
62
62
  React.createElement(Flex_1.Box, { className: "twa:h-2" })),
63
63
  React.createElement(FormLayout_1.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;
@@ -35,6 +35,7 @@ const EditableConfigEntityState_1 = require("./Components/SharedProps/EditableCo
35
35
  const Enums_1 = require("../AdaptableState/Common/Enums");
36
36
  const StringExtensions_1 = require("../Utilities/Extensions/StringExtensions");
37
37
  const ArrayExtensions_1 = tslib_1.__importDefault(require("../Utilities/Extensions/ArrayExtensions"));
38
+ const resolveContainerElement_1 = require("../Utilities/resolveContainerElement");
38
39
  exports.BLACK = 'Black';
39
40
  exports.WHITE = 'White';
40
41
  exports.LIGHT_GRAY = 'LightGray';
@@ -153,19 +154,12 @@ function getPlaceholderForDataType(dataType) {
153
154
  return 'Enter Date';
154
155
  }
155
156
  }
156
- function getModalContainer(adaptableOptions, document) {
157
- let modalContainer;
158
- if (adaptableOptions.containerOptions.modalContainer) {
159
- // this has been set, so we use the property
160
- modalContainer =
161
- typeof adaptableOptions.containerOptions.modalContainer === 'string'
162
- ? document.getElementById(adaptableOptions.containerOptions.modalContainer)
163
- : adaptableOptions.containerOptions.modalContainer;
164
- if (modalContainer) {
165
- const modalContainerClassName = ' modal-container';
166
- if (!modalContainer.className.includes(modalContainerClassName)) {
167
- modalContainer.className += modalContainerClassName;
168
- }
157
+ function getModalContainer(adaptableOptions, document, context) {
158
+ let modalContainer = (0, resolveContainerElement_1.resolveContainerElement)(adaptableOptions.containerOptions.modalContainer, context, document);
159
+ if (modalContainer) {
160
+ const modalContainerClassName = ' modal-container';
161
+ if (!modalContainer.className.includes(modalContainerClassName)) {
162
+ modalContainer.className += modalContainerClassName;
169
163
  }
170
164
  }
171
165
  if (!modalContainer) {
@@ -456,7 +450,7 @@ function getAdaptableToolPanelWidth() {
456
450
  return getNumericCSSVariableValue(getCSSVariableValue('--ab-cmp-toolpanel__width'), 200);
457
451
  }
458
452
  function getSimpleButtonPaddingWidth() {
459
- return getNumericCSSVariableValue(getCSSVariableValue('--ab-space-1'), 4);
453
+ return getNumericCSSVariableValue(getCSSVariableValue('--ab-base-space'), 4);
460
454
  }
461
455
  function getCSSVariableValue(cssVariable) {
462
456
  if (!isBrowserDocumentAvailable()) {
@@ -9,6 +9,7 @@ const AdaptableAgGrid_1 = require("./AdaptableAgGrid");
9
9
  const DefaultAdaptableOptions_1 = require("../AdaptableOptions/DefaultAdaptableOptions");
10
10
  const renderReactRoot_1 = require("../renderReactRoot");
11
11
  const AdaptableWizardView_1 = tslib_1.__importDefault(require("../View/AdaptableWizardView"));
12
+ const resolveContainerElement_1 = require("../Utilities/resolveContainerElement");
12
13
  class Adaptable {
13
14
  /**
14
15
  * Initializer for Adaptable
@@ -44,19 +45,18 @@ class AdaptableNoCodeWizard {
44
45
  this.render();
45
46
  }
46
47
  render(container) {
47
- let id = (0, DefaultAdaptableOptions_1.getDefaultAdaptableOptions)().containerOptions.adaptableContainer || 'adaptable';
48
48
  if (!container) {
49
- let containerOptionsContainer = this.adaptableOptions.containerOptions?.adaptableContainer;
50
- if (containerOptionsContainer) {
51
- if (typeof containerOptionsContainer === 'string') {
52
- id = containerOptionsContainer ?? id;
53
- }
54
- else {
55
- container = containerOptionsContainer;
56
- }
57
- }
49
+ const initContext = {
50
+ adaptableId: this.adaptableOptions?.adaptableId ?? '',
51
+ adaptableStateKey: this.adaptableOptions?.adaptableStateKey ?? '',
52
+ adaptableContext: this.adaptableOptions?.adaptableContext,
53
+ };
54
+ container = (0, resolveContainerElement_1.resolveContainerElement)(this.adaptableOptions.containerOptions?.adaptableContainer, initContext);
55
+ }
56
+ if (!container) {
57
+ const defaultId = (0, DefaultAdaptableOptions_1.getDefaultAdaptableOptions)().containerOptions.adaptableContainer || 'adaptable';
58
+ container = document.getElementById(defaultId);
58
59
  }
59
- container = container || document.getElementById(id);
60
60
  if (!container) {
61
61
  throw new Error('Cannot find container in which to render Adaptable No Code Wizard');
62
62
  }
@@ -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;