@adaptabletools/adaptable 21.1.0-canary.2 → 21.1.0
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.
- package/package.json +1 -1
- package/src/AdaptableOptions/DefaultAdaptableOptions.js +1 -1
- package/src/AdaptableOptions/PredicateOptions.d.ts +2 -2
- package/src/Api/Events/LayoutChanged.d.ts +1 -1
- package/src/Api/LayoutApi.d.ts +2 -2
- package/src/Strategy/LayoutModule.js +1 -1
- package/src/agGrid/AdaptableAgGrid.js +13 -7
- package/src/agGrid/AgGridAdapter.js +16 -0
- package/src/components/Tree/TreeDropdown/index.js +37 -21
- package/src/env.js +2 -2
- package/tsconfig.esm.tsbuildinfo +1 -1
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@adaptabletools/adaptable",
|
|
3
|
-
"version": "21.1.0
|
|
3
|
+
"version": "21.1.0",
|
|
4
4
|
"description": "Powerful data-agnostic HTML5 AG Grid extension which provides advanced, cutting-edge functionality to meet all DataGrid requirements",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"web-components",
|
|
@@ -216,7 +216,7 @@ const DefaultAdaptableOptions = {
|
|
|
216
216
|
systemFlashingCellPredicates: SystemFlashingCellPredicateIds,
|
|
217
217
|
systemBadgeStylePredicates: SystemBadgeStylePredicateIds,
|
|
218
218
|
caseSensitivePredicates: false,
|
|
219
|
-
evaluateInPredicateUsingTime:
|
|
219
|
+
evaluateInPredicateUsingTime: false,
|
|
220
220
|
},
|
|
221
221
|
quickSearchOptions: {
|
|
222
222
|
clearQuickSearchOnStartUp: false,
|
|
@@ -38,8 +38,8 @@ export interface PredicateOptions {
|
|
|
38
38
|
caseSensitivePredicates?: boolean | ((context: AdaptableColumnContext) => boolean);
|
|
39
39
|
/**
|
|
40
40
|
*
|
|
41
|
-
* Should
|
|
42
|
-
* @defaultValue
|
|
41
|
+
* Should In Predicate evaluate using datetime, rather than date (the default)
|
|
42
|
+
* @defaultValue false
|
|
43
43
|
* @noCodeItem
|
|
44
44
|
*/
|
|
45
45
|
evaluateInPredicateUsingTime?: boolean | ((context: AdaptableColumnContext) => boolean);
|
|
@@ -20,4 +20,4 @@ export interface LayoutChangedInfo extends BaseContext {
|
|
|
20
20
|
/**
|
|
21
21
|
* Trigger for Layout Changed Event
|
|
22
22
|
*/
|
|
23
|
-
export type LayoutChangedAction = '
|
|
23
|
+
export type LayoutChangedAction = 'LAYOUT_READY' | 'LAYOUT_ADD' | 'LAYOUT_EDIT' | 'LAYOUT_SAVE' | 'LAYOUT_DELETE' | 'LAYOUT_SELECT' | 'LAYOUT_COLUMN_FILTER_ADD' | 'LAYOUT_COLUMN_FILTER_EDIT' | 'LAYOUT_COLUMN_FILTER_SET' | 'LAYOUT_COLUMN_FILTER_CLEAR' | 'LAYOUT_COLUMN_FILTER_CLEAR_ALL' | 'LAYOUT_COLUMN_FILTER_SUSPEND' | 'LAYOUT_COLUMN_FILTER_SUSPEND_ALL' | 'LAYOUT_COLUMN_FILTER_UNSUSPEND' | 'LAYOUT_COLUMN_FILTER_UNSUSPEND_ALL' | 'LAYOUT_GRID_FILTER_SET' | 'LAYOUT_GRID_FILTER_CLEAR' | 'LAYOUT_GRID_FILTER_SUSPEND' | 'LAYOUT_GRID_FILTER_UNSUSPEND';
|
package/src/Api/LayoutApi.d.ts
CHANGED
|
@@ -64,9 +64,9 @@ export interface LayoutApi {
|
|
|
64
64
|
getExtendedLayoutByName(layoutName: string): ExtendedLayout | undefined;
|
|
65
65
|
/**
|
|
66
66
|
* Creates (or Updates) an Extended Layout
|
|
67
|
-
* @param
|
|
67
|
+
* @param extendedLayout extendedLayout to Create
|
|
68
68
|
*/
|
|
69
|
-
createOrUpdateExtendedLayout(
|
|
69
|
+
createOrUpdateExtendedLayout(extendedLayout: ExtendedLayout): void;
|
|
70
70
|
/**
|
|
71
71
|
* Retrieves all Layouts in Adaptable State
|
|
72
72
|
* @returns layouts
|
|
@@ -34,7 +34,7 @@ export class LayoutModule extends AdaptableModuleBase {
|
|
|
34
34
|
if (this.api.isDestroyed()) {
|
|
35
35
|
return;
|
|
36
36
|
}
|
|
37
|
-
this.api.eventApi.internalApi.fireLayoutChangedEvent('
|
|
37
|
+
this.api.eventApi.internalApi.fireLayoutChangedEvent('LAYOUT_READY', null, this.api.layoutApi.getLayoutState());
|
|
38
38
|
});
|
|
39
39
|
}
|
|
40
40
|
getModuleAdaptableObjects() {
|
|
@@ -3954,13 +3954,19 @@ You need to define at least one Layout!`);
|
|
|
3954
3954
|
const prevLayoutForRefresh = this.__prevLayoutForRefresh || this.api.layoutApi.getCurrentLayout();
|
|
3955
3955
|
// see #on-regroup-expect-group-column-to-be-recomputed-and-setup-properly
|
|
3956
3956
|
const rowGroupsChanged = this.isRowGroupDifferentInLayout(prevLayoutForRefresh, layout);
|
|
3957
|
-
|
|
3958
|
-
|
|
3959
|
-
|
|
3960
|
-
|
|
3961
|
-
|
|
3962
|
-
|
|
3963
|
-
|
|
3957
|
+
if (rowGroupsChanged) {
|
|
3958
|
+
// when grouping changes, if we have a filter on the grouped column, we need to remove it
|
|
3959
|
+
// as it is no longer valid
|
|
3960
|
+
if (layout.ColumnFilters) {
|
|
3961
|
+
const newFilters = layout.ColumnFilters.filter((filter) => filter.ColumnId !== AG_GRID_GROUPED_COLUMN);
|
|
3962
|
+
if (newFilters.length != layout.ColumnFilters.length) {
|
|
3963
|
+
layout = { ...layout };
|
|
3964
|
+
layout.ColumnFilters = newFilters;
|
|
3965
|
+
}
|
|
3966
|
+
}
|
|
3967
|
+
// also we need to reset the cache for the group column, when we have rowGripDisplayType single
|
|
3968
|
+
if (layout.RowGroupDisplayType === 'single') {
|
|
3969
|
+
this.api.filterApi.columnFilterApi.resetFilterValues(AG_GRID_GROUPED_COLUMN);
|
|
3964
3970
|
}
|
|
3965
3971
|
}
|
|
3966
3972
|
const hasPivotTotalsInLayout = this.hasPivotTotalsInLayout(prevLayoutForRefresh, layout);
|
|
@@ -95,6 +95,22 @@ export class AgGridAdapter {
|
|
|
95
95
|
colDef.hide = !allDisplayedColIds.includes(colDef.colId);
|
|
96
96
|
}
|
|
97
97
|
});
|
|
98
|
+
// for pre-existing ColDefs, keep the filter property from the previous one
|
|
99
|
+
if (self.adaptableApi.optionsApi.getFilterOptions().useAdaptableFiltering) {
|
|
100
|
+
const hasActiveFilters = self.adaptableApi.filterApi.columnFilterApi.getActiveColumnFilters().length;
|
|
101
|
+
// theoretically we should always update the filter property
|
|
102
|
+
// practically, only do it if there are active filters to avoid unnecessary processing
|
|
103
|
+
if (hasActiveFilters) {
|
|
104
|
+
self.patchColDefs(colDefsWithSpecialColumns, (colDef) => {
|
|
105
|
+
if (colDef.filter !== false) {
|
|
106
|
+
const originalColDef = self.getAgGridApi().getColumnDef(colDef.colId);
|
|
107
|
+
if (originalColDef) {
|
|
108
|
+
colDef.filter = originalColDef.filter;
|
|
109
|
+
}
|
|
110
|
+
}
|
|
111
|
+
});
|
|
112
|
+
}
|
|
113
|
+
}
|
|
98
114
|
options['columnDefs'] = colDefsWithSpecialColumns;
|
|
99
115
|
self.logger.info(`Added SpecialColumns on GridOptions.columnDefs update (source=${source})`);
|
|
100
116
|
}
|
|
@@ -23,7 +23,7 @@ export function toDisplayValueDefault(value) {
|
|
|
23
23
|
}
|
|
24
24
|
return value.map((v) => (Array.isArray(v) ? v.join('-') : v)).join(', ');
|
|
25
25
|
}
|
|
26
|
-
const getLabelColumn = (field) => {
|
|
26
|
+
const getLabelColumn = (field, { includeExpandCollapseButton }) => {
|
|
27
27
|
return {
|
|
28
28
|
field,
|
|
29
29
|
defaultFlex: 1,
|
|
@@ -58,14 +58,14 @@ const getLabelColumn = (field) => {
|
|
|
58
58
|
api.focus();
|
|
59
59
|
} }),
|
|
60
60
|
React.createElement(Flex, { flex: 1 }),
|
|
61
|
-
React.createElement(SimpleButton, { label: "toggle-expand-collapse", icon: allFirstLevelCollapsed ? 'expand-all' : 'collapse-all', onMouseDown: () => {
|
|
61
|
+
includeExpandCollapseButton ? (React.createElement(SimpleButton, { label: "toggle-expand-collapse", icon: allFirstLevelCollapsed ? 'expand-all' : 'collapse-all', onMouseDown: () => {
|
|
62
62
|
if (allFirstLevelCollapsed) {
|
|
63
63
|
dataSourceApi.treeApi.expandAll();
|
|
64
64
|
}
|
|
65
65
|
else {
|
|
66
66
|
dataSourceApi.treeApi.collapseAll();
|
|
67
67
|
}
|
|
68
|
-
}, iconPosition: "end" }, allFirstLevelCollapsed ? 'Expand All' : 'Collapse All')));
|
|
68
|
+
}, iconPosition: "end" }, allFirstLevelCollapsed ? 'Expand All' : 'Collapse All')) : null));
|
|
69
69
|
},
|
|
70
70
|
};
|
|
71
71
|
};
|
|
@@ -89,11 +89,6 @@ export function TreeDropdown(props) {
|
|
|
89
89
|
const [treeExpandState, setTreeExpandState] = useState(undefined);
|
|
90
90
|
const [searchValue, setSearchValue] = useState('');
|
|
91
91
|
const labelField = props.labelField ?? 'label';
|
|
92
|
-
const columns = useMemo(() => {
|
|
93
|
-
return {
|
|
94
|
-
label: getLabelColumn(labelField),
|
|
95
|
-
};
|
|
96
|
-
}, [labelField]);
|
|
97
92
|
const [stateValue, setStateValue] = useState(props.value !== undefined ? props.value : props.defaultValue || []);
|
|
98
93
|
const onChange = useCallback((value) => {
|
|
99
94
|
const paths = value instanceof TreeSelectionState
|
|
@@ -115,6 +110,14 @@ export function TreeDropdown(props) {
|
|
|
115
110
|
const rowCount = useMemo(() => {
|
|
116
111
|
return getRowCount(props.options);
|
|
117
112
|
}, [props.options]);
|
|
113
|
+
const hasChildren = rowCount > props.options.length;
|
|
114
|
+
const columns = useMemo(() => {
|
|
115
|
+
return {
|
|
116
|
+
label: getLabelColumn(labelField, {
|
|
117
|
+
includeExpandCollapseButton: hasChildren,
|
|
118
|
+
}),
|
|
119
|
+
};
|
|
120
|
+
}, [labelField, hasChildren]);
|
|
118
121
|
const [size, setSize] = useState({
|
|
119
122
|
width: 0,
|
|
120
123
|
height: rowCount * 35,
|
|
@@ -191,7 +194,13 @@ export function TreeDropdown(props) {
|
|
|
191
194
|
React.createElement(NotifyResize, { onResize: (newSize) => {
|
|
192
195
|
setWidth(newSize.width);
|
|
193
196
|
} }),
|
|
194
|
-
React.createElement(OverlayTrigger, { visible: visible, targetOffset: 20,
|
|
197
|
+
React.createElement(OverlayTrigger, { visible: visible, targetOffset: 20, alignPosition: [
|
|
198
|
+
// overlay - target
|
|
199
|
+
['TopLeft', 'BottomLeft'],
|
|
200
|
+
['TopRight', 'BottomRight'],
|
|
201
|
+
['BottomLeft', 'TopLeft'],
|
|
202
|
+
['BottomRight', 'TopRight'],
|
|
203
|
+
], render: () => {
|
|
195
204
|
const minWidth = listSizeConstraints?.minWidth ||
|
|
196
205
|
computedCSSVars['--ab-cmp-select-menu__min-width'] ||
|
|
197
206
|
240;
|
|
@@ -203,19 +212,24 @@ export function TreeDropdown(props) {
|
|
|
203
212
|
computedCSSVars['--ab-cmp-select-menu__max-height'] ||
|
|
204
213
|
'50vh';
|
|
205
214
|
const resizable = getProps().resizable;
|
|
206
|
-
const
|
|
215
|
+
const treeListStyle = resizable
|
|
216
|
+
? { ...sizeFull }
|
|
217
|
+
: {
|
|
218
|
+
width: size.width,
|
|
219
|
+
height: size.height,
|
|
220
|
+
maxWidth,
|
|
221
|
+
minHeight,
|
|
222
|
+
maxHeight,
|
|
223
|
+
minWidth,
|
|
224
|
+
};
|
|
225
|
+
if (!hasChildren) {
|
|
226
|
+
// @ts-ignore - don't leave any space for the > expand icon, as there are no children
|
|
227
|
+
treeListStyle['--infinite-group-row-column-nesting'] = 'var(--ab-space-2)';
|
|
228
|
+
}
|
|
229
|
+
const treeList = (React.createElement(TreeList, { primaryKey: props.primaryKey ?? 'id', treeFilterFunction: filterFunction, columnHeaderHeight: 32, onReady: ({ api }) => {
|
|
207
230
|
setTreeListApi(api);
|
|
208
231
|
api.focus();
|
|
209
|
-
}, defaultTreeExpandState: treeExpandState, onTreeExpandStateChange: setTreeExpandState, columns: columns, options: props.options, treeSelection: treeSelection, onTreeSelectionChange: withSelectedLeafNodesOnly(onChange), style:
|
|
210
|
-
? sizeFull
|
|
211
|
-
: {
|
|
212
|
-
width: size.width,
|
|
213
|
-
height: size.height,
|
|
214
|
-
maxWidth,
|
|
215
|
-
minHeight,
|
|
216
|
-
maxHeight,
|
|
217
|
-
minWidth,
|
|
218
|
-
} }));
|
|
232
|
+
}, defaultTreeExpandState: treeExpandState, onTreeExpandStateChange: setTreeExpandState, columns: columns, options: props.options, treeSelection: treeSelection, onTreeSelectionChange: withSelectedLeafNodesOnly(onChange), style: treeListStyle }));
|
|
219
233
|
let children = (React.createElement(Flex, { flexDirection: 'column', height: '100%' },
|
|
220
234
|
React.createElement(Flex, { backgroundColor: 'defaultbackground', p: 1, alignItems: 'center', justifyContent: 'stretch', justifyItems: 'stretch' },
|
|
221
235
|
React.createElement(Input, { "data-name": "menulist-search-input", placeholder: "Search...", style: { width: '100%' }, value: searchValue, onChange: (e) => setSearchValue(e.target.value) })),
|
|
@@ -233,7 +247,9 @@ export function TreeDropdown(props) {
|
|
|
233
247
|
e.preventDefault();
|
|
234
248
|
} }, children));
|
|
235
249
|
}
|
|
236
|
-
return (React.createElement(Box, { ref: overlayDOMRef, className: "ab-TreeDropdownOverlay", "data-name": "menu-container"
|
|
250
|
+
return (React.createElement(Box, { ref: overlayDOMRef, className: "ab-TreeDropdownOverlay", "data-name": "menu-container", style: {
|
|
251
|
+
fontSize: 'var(--ab-cmp-select__font-size)',
|
|
252
|
+
} }, children));
|
|
237
253
|
} },
|
|
238
254
|
React.createElement(FieldWrap, { style: { width: '100%', ...props.fieldStyle } },
|
|
239
255
|
React.createElement(Input, { type: "text", readOnly: true, "data-name": "Select Values", placeholder: props.placeholder ?? 'Select a value', style: {
|
package/src/env.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
export default {
|
|
2
2
|
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" || '',
|
|
3
|
-
PUBLISH_TIMESTAMP:
|
|
4
|
-
VERSION: "21.1.0
|
|
3
|
+
PUBLISH_TIMESTAMP: 1763997613774 || Date.now(),
|
|
4
|
+
VERSION: "21.1.0" || '--current-version--',
|
|
5
5
|
};
|