@mui/x-data-grid-premium 8.0.0-alpha.5 → 8.0.0-alpha.7
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/CHANGELOG.md +206 -1
- package/DataGridPremium/DataGridPremium.js +6 -4
- package/DataGridPremium/useDataGridPremiumComponent.d.ts +1 -1
- package/DataGridPremium/useDataGridPremiumComponent.js +2 -1
- package/DataGridPremium/useDataGridPremiumProps.js +3 -1
- package/components/GridColumnMenuAggregationItem.js +53 -20
- package/components/GridDataSourceGroupingCriteriaCell.js +1 -2
- package/components/GridPremiumColumnMenu.d.ts +1 -1
- package/components/GridPremiumColumnMenu.js +5 -5
- package/esm/DataGridPremium/DataGridPremium.js +6 -4
- package/esm/DataGridPremium/useDataGridPremiumComponent.js +3 -2
- package/esm/DataGridPremium/useDataGridPremiumProps.js +3 -1
- package/esm/components/GridColumnMenuAggregationItem.js +51 -18
- package/esm/components/GridDataSourceGroupingCriteriaCell.js +1 -2
- package/esm/components/GridPremiumColumnMenu.js +5 -5
- package/esm/hooks/features/aggregation/createAggregationLookup.js +52 -55
- package/esm/hooks/features/aggregation/gridAggregationUtils.js +17 -13
- package/esm/hooks/features/aggregation/index.js +0 -1
- package/esm/hooks/features/aggregation/useGridAggregation.js +22 -10
- package/esm/hooks/features/aggregation/useGridAggregationPreProcessors.js +7 -14
- package/esm/hooks/features/cellSelection/useGridCellSelection.js +3 -3
- package/esm/hooks/features/dataSource/cache.js +3 -0
- package/esm/hooks/features/dataSource/models.js +1 -0
- package/esm/hooks/features/dataSource/useGridDataSourcePremium.js +53 -0
- package/esm/hooks/features/rowGrouping/useGridRowGroupingPreProcessors.js +9 -4
- package/esm/utils/releaseInfo.js +1 -1
- package/hooks/features/aggregation/createAggregationLookup.d.ts +6 -5
- package/hooks/features/aggregation/createAggregationLookup.js +52 -55
- package/hooks/features/aggregation/gridAggregationInterfaces.d.ts +18 -5
- package/hooks/features/aggregation/gridAggregationUtils.d.ts +9 -10
- package/hooks/features/aggregation/gridAggregationUtils.js +17 -13
- package/hooks/features/aggregation/index.d.ts +1 -1
- package/hooks/features/aggregation/index.js +0 -12
- package/hooks/features/aggregation/useGridAggregation.d.ts +1 -1
- package/hooks/features/aggregation/useGridAggregation.js +22 -10
- package/hooks/features/aggregation/useGridAggregationPreProcessors.d.ts +1 -1
- package/hooks/features/aggregation/useGridAggregationPreProcessors.js +7 -14
- package/hooks/features/cellSelection/useGridCellSelection.d.ts +1 -1
- package/hooks/features/cellSelection/useGridCellSelection.js +3 -3
- package/hooks/features/dataSource/cache.d.ts +2 -0
- package/hooks/features/dataSource/cache.js +9 -0
- package/hooks/features/dataSource/models.d.ts +47 -0
- package/hooks/features/dataSource/models.js +5 -0
- package/hooks/features/dataSource/useGridDataSourcePremium.d.ts +4 -0
- package/hooks/features/dataSource/useGridDataSourcePremium.js +62 -0
- package/hooks/features/rowGrouping/useGridRowGroupingPreProcessors.js +9 -4
- package/hooks/utils/useGridApiRef.d.ts +1 -1
- package/index.d.ts +2 -0
- package/index.js +1 -1
- package/models/dataGridPremiumProps.d.ts +6 -4
- package/models/gridApiPremium.d.ts +5 -3
- package/modern/DataGridPremium/DataGridPremium.js +6 -4
- package/modern/DataGridPremium/useDataGridPremiumComponent.js +3 -2
- package/modern/DataGridPremium/useDataGridPremiumProps.js +3 -1
- package/modern/components/GridColumnMenuAggregationItem.js +51 -18
- package/modern/components/GridDataSourceGroupingCriteriaCell.js +1 -2
- package/modern/components/GridPremiumColumnMenu.js +5 -5
- package/modern/hooks/features/aggregation/createAggregationLookup.js +52 -55
- package/modern/hooks/features/aggregation/gridAggregationUtils.js +17 -13
- package/modern/hooks/features/aggregation/index.js +0 -1
- package/modern/hooks/features/aggregation/useGridAggregation.js +22 -10
- package/modern/hooks/features/aggregation/useGridAggregationPreProcessors.js +7 -14
- package/modern/hooks/features/cellSelection/useGridCellSelection.js +3 -3
- package/modern/hooks/features/dataSource/cache.js +3 -0
- package/modern/hooks/features/dataSource/models.js +1 -0
- package/modern/hooks/features/dataSource/useGridDataSourcePremium.js +53 -0
- package/modern/hooks/features/rowGrouping/useGridRowGroupingPreProcessors.js +9 -4
- package/modern/index.js +1 -1
- package/modern/utils/releaseInfo.js +1 -1
- package/package.json +5 -5
- package/utils/releaseInfo.js +1 -1
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import { GridPrivateApiPremium } from '../../../models/gridApiPremium';
|
|
3
3
|
import { DataGridPremiumProcessedProps } from '../../../models/dataGridPremiumProps';
|
|
4
|
-
import { GridAggregationFunction, GridAggregationLookup } from './gridAggregationInterfaces';
|
|
5
|
-
export declare const createAggregationLookup: ({ apiRef, aggregationFunctions, aggregationRowsScope, getAggregationPosition, }: {
|
|
6
|
-
apiRef: React.MutableRefObject<
|
|
7
|
-
aggregationFunctions: Record<string, GridAggregationFunction>;
|
|
4
|
+
import { GridAggregationFunction, GridAggregationFunctionDataSource, GridAggregationLookup } from './gridAggregationInterfaces';
|
|
5
|
+
export declare const createAggregationLookup: ({ apiRef, aggregationFunctions, aggregationRowsScope, getAggregationPosition, isDataSource, }: {
|
|
6
|
+
apiRef: React.MutableRefObject<GridPrivateApiPremium>;
|
|
7
|
+
aggregationFunctions: Record<string, GridAggregationFunction> | Record<string, GridAggregationFunctionDataSource>;
|
|
8
8
|
aggregationRowsScope: DataGridPremiumProcessedProps["aggregationRowsScope"];
|
|
9
9
|
getAggregationPosition: DataGridPremiumProcessedProps["getAggregationPosition"];
|
|
10
|
+
isDataSource: boolean;
|
|
10
11
|
}) => GridAggregationLookup;
|
|
@@ -7,18 +7,13 @@ exports.createAggregationLookup = void 0;
|
|
|
7
7
|
var _xDataGridPro = require("@mui/x-data-grid-pro");
|
|
8
8
|
var _gridAggregationUtils = require("./gridAggregationUtils");
|
|
9
9
|
var _gridAggregationSelectors = require("./gridAggregationSelectors");
|
|
10
|
-
const
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
field,
|
|
14
|
-
aggregationFunction,
|
|
15
|
-
aggregationRowsScope
|
|
16
|
-
}) => {
|
|
17
|
-
const filteredRowsLookup = (0, _xDataGridPro.gridFilteredRowsLookupSelector)(apiRef);
|
|
10
|
+
const getGroupAggregatedValue = (groupId, apiRef, aggregationRowsScope, aggregatedFields, aggregationRules, position) => {
|
|
11
|
+
const groupAggregationLookup = {};
|
|
12
|
+
const aggregatedValues = [];
|
|
18
13
|
const rowIds = apiRef.current.getRowGroupChildren({
|
|
19
14
|
groupId
|
|
20
15
|
});
|
|
21
|
-
const
|
|
16
|
+
const filteredRowsLookup = (0, _xDataGridPro.gridFilteredRowsLookupSelector)(apiRef);
|
|
22
17
|
rowIds.forEach(rowId => {
|
|
23
18
|
if (aggregationRowsScope === 'filtered' && filteredRowsLookup[rowId] === false) {
|
|
24
19
|
return;
|
|
@@ -35,42 +30,53 @@ const getAggregationCellValue = ({
|
|
|
35
30
|
if (rowNode.type === 'group') {
|
|
36
31
|
return;
|
|
37
32
|
}
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
33
|
+
const row = apiRef.current.getRow(rowId);
|
|
34
|
+
for (let j = 0; j < aggregatedFields.length; j += 1) {
|
|
35
|
+
const aggregatedField = aggregatedFields[j];
|
|
36
|
+
const columnAggregationRules = aggregationRules[aggregatedField];
|
|
37
|
+
const aggregationFunction = columnAggregationRules.aggregationFunction;
|
|
38
|
+
const field = aggregatedField;
|
|
39
|
+
if (aggregatedValues[j] === undefined) {
|
|
40
|
+
aggregatedValues[j] = {
|
|
41
|
+
aggregatedField,
|
|
42
|
+
values: []
|
|
43
|
+
};
|
|
44
|
+
}
|
|
45
|
+
if (typeof aggregationFunction.getCellValue === 'function') {
|
|
46
|
+
aggregatedValues[j].values.push(aggregationFunction.getCellValue({
|
|
47
|
+
row
|
|
48
|
+
}));
|
|
49
|
+
} else {
|
|
50
|
+
const colDef = apiRef.current.getColumn(field);
|
|
51
|
+
aggregatedValues[j].values.push(apiRef.current.getRowValue(row, colDef));
|
|
52
|
+
}
|
|
45
53
|
}
|
|
46
54
|
});
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
55
|
+
for (let i = 0; i < aggregatedValues.length; i += 1) {
|
|
56
|
+
const {
|
|
57
|
+
aggregatedField,
|
|
58
|
+
values
|
|
59
|
+
} = aggregatedValues[i];
|
|
60
|
+
const aggregationFunction = aggregationRules[aggregatedField].aggregationFunction;
|
|
61
|
+
const value = aggregationFunction.apply({
|
|
62
|
+
values,
|
|
63
|
+
groupId,
|
|
64
|
+
field: aggregatedField // Added per user request in https://github.com/mui/mui-x/issues/6995#issuecomment-1327423455
|
|
65
|
+
});
|
|
66
|
+
groupAggregationLookup[aggregatedField] = {
|
|
67
|
+
position,
|
|
68
|
+
value
|
|
69
|
+
};
|
|
70
|
+
}
|
|
71
|
+
return groupAggregationLookup;
|
|
52
72
|
};
|
|
53
|
-
const
|
|
54
|
-
groupId,
|
|
55
|
-
apiRef,
|
|
56
|
-
aggregationRowsScope,
|
|
57
|
-
aggregatedFields,
|
|
58
|
-
aggregationRules,
|
|
59
|
-
position
|
|
60
|
-
}) => {
|
|
73
|
+
const getGroupAggregatedValueDataSource = (groupId, apiRef, aggregatedFields, position) => {
|
|
61
74
|
const groupAggregationLookup = {};
|
|
62
75
|
for (let j = 0; j < aggregatedFields.length; j += 1) {
|
|
63
76
|
const aggregatedField = aggregatedFields[j];
|
|
64
|
-
const columnAggregationRules = aggregationRules[aggregatedField];
|
|
65
77
|
groupAggregationLookup[aggregatedField] = {
|
|
66
78
|
position,
|
|
67
|
-
value:
|
|
68
|
-
apiRef,
|
|
69
|
-
groupId,
|
|
70
|
-
field: aggregatedField,
|
|
71
|
-
aggregationFunction: columnAggregationRules.aggregationFunction,
|
|
72
|
-
aggregationRowsScope
|
|
73
|
-
})
|
|
79
|
+
value: apiRef.current.resolveGroupAggregation(groupId, aggregatedField)
|
|
74
80
|
};
|
|
75
81
|
}
|
|
76
82
|
return groupAggregationLookup;
|
|
@@ -79,13 +85,10 @@ const createAggregationLookup = ({
|
|
|
79
85
|
apiRef,
|
|
80
86
|
aggregationFunctions,
|
|
81
87
|
aggregationRowsScope,
|
|
82
|
-
getAggregationPosition
|
|
88
|
+
getAggregationPosition,
|
|
89
|
+
isDataSource
|
|
83
90
|
}) => {
|
|
84
|
-
const aggregationRules = (0, _gridAggregationUtils.getAggregationRules)(
|
|
85
|
-
columnsLookup: (0, _xDataGridPro.gridColumnLookupSelector)(apiRef),
|
|
86
|
-
aggregationModel: (0, _gridAggregationSelectors.gridAggregationModelSelector)(apiRef),
|
|
87
|
-
aggregationFunctions
|
|
88
|
-
});
|
|
91
|
+
const aggregationRules = (0, _gridAggregationUtils.getAggregationRules)((0, _xDataGridPro.gridColumnLookupSelector)(apiRef), (0, _gridAggregationSelectors.gridAggregationModelSelector)(apiRef), aggregationFunctions, isDataSource);
|
|
89
92
|
const aggregatedFields = Object.keys(aggregationRules);
|
|
90
93
|
if (aggregatedFields.length === 0) {
|
|
91
94
|
return {};
|
|
@@ -100,18 +103,12 @@ const createAggregationLookup = ({
|
|
|
100
103
|
createGroupAggregationLookup(childNode);
|
|
101
104
|
}
|
|
102
105
|
}
|
|
103
|
-
const
|
|
104
|
-
if (
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
apiRef,
|
|
110
|
-
aggregatedFields,
|
|
111
|
-
aggregationRowsScope,
|
|
112
|
-
aggregationRules,
|
|
113
|
-
position
|
|
114
|
-
});
|
|
106
|
+
const position = getAggregationPosition(groupNode);
|
|
107
|
+
if (position !== null) {
|
|
108
|
+
if (isDataSource) {
|
|
109
|
+
aggregationLookup[groupNode.id] = getGroupAggregatedValueDataSource(groupNode.id, apiRef, aggregatedFields, position);
|
|
110
|
+
} else if (groupNode.children.length) {
|
|
111
|
+
aggregationLookup[groupNode.id] = getGroupAggregatedValue(groupNode.id, apiRef, aggregationRowsScope, aggregatedFields, aggregationRules, position);
|
|
115
112
|
}
|
|
116
113
|
}
|
|
117
114
|
};
|
|
@@ -17,6 +17,12 @@ export interface GridAggregationApi {
|
|
|
17
17
|
*/
|
|
18
18
|
setAggregationModel: (model: GridAggregationModel) => void;
|
|
19
19
|
}
|
|
20
|
+
export interface GridAggregationPrivateApi {
|
|
21
|
+
/**
|
|
22
|
+
* Applies the aggregation to the rows.
|
|
23
|
+
*/
|
|
24
|
+
applyAggregation: () => void;
|
|
25
|
+
}
|
|
20
26
|
export interface GridAggregationGetCellValueParams {
|
|
21
27
|
/**
|
|
22
28
|
* The row model of the row that the current cell belongs to.
|
|
@@ -38,7 +44,7 @@ export interface GridAggregationFunction<V = any, AV = V> {
|
|
|
38
44
|
apply: (params: GridAggregationParams<V>) => AV | null | undefined;
|
|
39
45
|
/**
|
|
40
46
|
* Label of the aggregation function.
|
|
41
|
-
*
|
|
47
|
+
* Used for adding a label to the footer of the grouping column when this aggregation function is the only one being used.
|
|
42
48
|
* @default apiRef.current.getLocaleText('aggregationFunctionLabel{capitalize(name)})
|
|
43
49
|
*/
|
|
44
50
|
label?: string;
|
|
@@ -48,12 +54,12 @@ export interface GridAggregationFunction<V = any, AV = V> {
|
|
|
48
54
|
*/
|
|
49
55
|
columnTypes?: string[];
|
|
50
56
|
/**
|
|
51
|
-
* Function
|
|
52
|
-
* If not defined, the grid
|
|
57
|
+
* Function for applying a formatter to the aggregated value.
|
|
58
|
+
* If not defined, the grid uses the formatter of the column.
|
|
53
59
|
*/
|
|
54
60
|
valueFormatter?: GridValueFormatter;
|
|
55
61
|
/**
|
|
56
|
-
* Indicates if the aggregated value
|
|
62
|
+
* Indicates if the aggregated value has the same unit as the cells used to generate it.
|
|
57
63
|
* It can be used to apply a custom cell renderer only if the aggregated value has the same unit.
|
|
58
64
|
* @default true
|
|
59
65
|
*/
|
|
@@ -67,6 +73,13 @@ export interface GridAggregationFunction<V = any, AV = V> {
|
|
|
67
73
|
*/
|
|
68
74
|
getCellValue?: (params: GridAggregationGetCellValueParams) => V;
|
|
69
75
|
}
|
|
76
|
+
/**
|
|
77
|
+
* Grid aggregation function data source definition interface.
|
|
78
|
+
* @demos
|
|
79
|
+
* - [Server-side aggregation](/x/react-data-grid/server-side-data/aggregation/)
|
|
80
|
+
*/
|
|
81
|
+
export interface GridAggregationFunctionDataSource extends Omit<GridAggregationFunction, 'apply' | 'getCellValue'> {
|
|
82
|
+
}
|
|
70
83
|
export interface GridAggregationParams<V = any> {
|
|
71
84
|
values: (V | undefined)[];
|
|
72
85
|
groupId: GridRowId;
|
|
@@ -102,7 +115,7 @@ export interface GridAggregationHeaderMeta {
|
|
|
102
115
|
}
|
|
103
116
|
export interface GridAggregationRule {
|
|
104
117
|
aggregationFunctionName: string;
|
|
105
|
-
aggregationFunction: GridAggregationFunction;
|
|
118
|
+
aggregationFunction: GridAggregationFunction | GridAggregationFunctionDataSource;
|
|
106
119
|
}
|
|
107
120
|
/**
|
|
108
121
|
* Object containing all the aggregation rules that must be applied to the current columns.
|
|
@@ -1,27 +1,26 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { GridColDef, GridRowId } from '@mui/x-data-grid-pro';
|
|
3
3
|
import { GridColumnRawLookup, GridHydrateRowsValue } from '@mui/x-data-grid-pro/internals';
|
|
4
|
-
import { GridAggregationFunction, GridAggregationModel, GridAggregationRule, GridAggregationRules } from './gridAggregationInterfaces';
|
|
4
|
+
import { GridAggregationFunction, GridAggregationFunctionDataSource, GridAggregationModel, GridAggregationRule, GridAggregationRules } from './gridAggregationInterfaces';
|
|
5
5
|
import { GridStatePremium } from '../../../models/gridStatePremium';
|
|
6
6
|
import { DataGridPremiumProcessedProps } from '../../../models/dataGridPremiumProps';
|
|
7
7
|
import { GridApiPremium, GridPrivateApiPremium } from '../../../models/gridApiPremium';
|
|
8
8
|
export declare const GRID_AGGREGATION_ROOT_FOOTER_ROW_ID = "auto-generated-group-footer-root";
|
|
9
9
|
export declare const getAggregationFooterRowIdFromGroupId: (groupId: GridRowId | null) => string;
|
|
10
|
-
|
|
10
|
+
type AggregationFunction = GridAggregationFunction | GridAggregationFunctionDataSource | undefined;
|
|
11
|
+
export declare const canColumnHaveAggregationFunction: ({ colDef, aggregationFunctionName, aggregationFunction, isDataSource, }: {
|
|
11
12
|
colDef: GridColDef | undefined;
|
|
12
13
|
aggregationFunctionName: string;
|
|
13
|
-
aggregationFunction:
|
|
14
|
+
aggregationFunction: AggregationFunction;
|
|
15
|
+
isDataSource: boolean;
|
|
14
16
|
}) => boolean;
|
|
15
|
-
export declare const getAvailableAggregationFunctions: ({ aggregationFunctions, colDef, }: {
|
|
16
|
-
aggregationFunctions: Record<string, GridAggregationFunction>;
|
|
17
|
+
export declare const getAvailableAggregationFunctions: ({ aggregationFunctions, colDef, isDataSource, }: {
|
|
18
|
+
aggregationFunctions: Record<string, GridAggregationFunction> | Record<string, GridAggregationFunctionDataSource>;
|
|
17
19
|
colDef: GridColDef;
|
|
20
|
+
isDataSource: boolean;
|
|
18
21
|
}) => string[];
|
|
19
22
|
export declare const mergeStateWithAggregationModel: (aggregationModel: GridAggregationModel) => (state: GridStatePremium) => GridStatePremium;
|
|
20
|
-
export declare const getAggregationRules: (
|
|
21
|
-
columnsLookup: GridColumnRawLookup;
|
|
22
|
-
aggregationModel: GridAggregationModel;
|
|
23
|
-
aggregationFunctions: Record<string, GridAggregationFunction>;
|
|
24
|
-
}) => GridAggregationRules;
|
|
23
|
+
export declare const getAggregationRules: (columnsLookup: GridColumnRawLookup, aggregationModel: GridAggregationModel, aggregationFunctions: Record<string, GridAggregationFunction> | Record<string, GridAggregationFunctionDataSource>, isDataSource: boolean) => GridAggregationRules;
|
|
25
24
|
interface AddFooterRowsParams {
|
|
26
25
|
groupingParams: GridHydrateRowsValue;
|
|
27
26
|
getAggregationPosition: DataGridPremiumProcessedProps['getAggregationPosition'];
|
|
@@ -18,21 +18,23 @@ const getAggregationFooterRowIdFromGroupId = groupId => {
|
|
|
18
18
|
return `auto-generated-group-footer-${groupId}`;
|
|
19
19
|
};
|
|
20
20
|
exports.getAggregationFooterRowIdFromGroupId = getAggregationFooterRowIdFromGroupId;
|
|
21
|
+
const isClientSideAggregateFunction = aggregationFunction => !!aggregationFunction && 'apply' in aggregationFunction;
|
|
21
22
|
const canColumnHaveAggregationFunction = ({
|
|
22
23
|
colDef,
|
|
23
24
|
aggregationFunctionName,
|
|
24
|
-
aggregationFunction
|
|
25
|
+
aggregationFunction,
|
|
26
|
+
isDataSource
|
|
25
27
|
}) => {
|
|
26
28
|
if (!colDef) {
|
|
27
29
|
return false;
|
|
28
30
|
}
|
|
29
|
-
if (!aggregationFunction) {
|
|
31
|
+
if (!isClientSideAggregateFunction(aggregationFunction) && !isDataSource) {
|
|
30
32
|
return false;
|
|
31
33
|
}
|
|
32
34
|
if (colDef.availableAggregationFunctions != null) {
|
|
33
35
|
return colDef.availableAggregationFunctions.includes(aggregationFunctionName);
|
|
34
36
|
}
|
|
35
|
-
if (!aggregationFunction
|
|
37
|
+
if (!aggregationFunction?.columnTypes) {
|
|
36
38
|
return true;
|
|
37
39
|
}
|
|
38
40
|
return aggregationFunction.columnTypes.includes(colDef.type);
|
|
@@ -40,11 +42,13 @@ const canColumnHaveAggregationFunction = ({
|
|
|
40
42
|
exports.canColumnHaveAggregationFunction = canColumnHaveAggregationFunction;
|
|
41
43
|
const getAvailableAggregationFunctions = ({
|
|
42
44
|
aggregationFunctions,
|
|
43
|
-
colDef
|
|
45
|
+
colDef,
|
|
46
|
+
isDataSource
|
|
44
47
|
}) => Object.keys(aggregationFunctions).filter(aggregationFunctionName => canColumnHaveAggregationFunction({
|
|
45
48
|
colDef,
|
|
46
49
|
aggregationFunctionName,
|
|
47
|
-
aggregationFunction: aggregationFunctions[aggregationFunctionName]
|
|
50
|
+
aggregationFunction: aggregationFunctions[aggregationFunctionName],
|
|
51
|
+
isDataSource
|
|
48
52
|
}));
|
|
49
53
|
exports.getAvailableAggregationFunctions = getAvailableAggregationFunctions;
|
|
50
54
|
const mergeStateWithAggregationModel = aggregationModel => state => (0, _extends2.default)({}, state, {
|
|
@@ -53,24 +57,24 @@ const mergeStateWithAggregationModel = aggregationModel => state => (0, _extends
|
|
|
53
57
|
})
|
|
54
58
|
});
|
|
55
59
|
exports.mergeStateWithAggregationModel = mergeStateWithAggregationModel;
|
|
56
|
-
const getAggregationRules = ({
|
|
57
|
-
columnsLookup,
|
|
58
|
-
aggregationModel,
|
|
59
|
-
aggregationFunctions
|
|
60
|
-
}) => {
|
|
60
|
+
const getAggregationRules = (columnsLookup, aggregationModel, aggregationFunctions, isDataSource) => {
|
|
61
61
|
const aggregationRules = {};
|
|
62
|
-
|
|
62
|
+
|
|
63
|
+
// eslint-disable-next-line guard-for-in
|
|
64
|
+
for (const field in aggregationModel) {
|
|
65
|
+
const columnItem = aggregationModel[field];
|
|
63
66
|
if (columnsLookup[field] && canColumnHaveAggregationFunction({
|
|
64
67
|
colDef: columnsLookup[field],
|
|
65
68
|
aggregationFunctionName: columnItem,
|
|
66
|
-
aggregationFunction: aggregationFunctions[columnItem]
|
|
69
|
+
aggregationFunction: aggregationFunctions[columnItem],
|
|
70
|
+
isDataSource
|
|
67
71
|
})) {
|
|
68
72
|
aggregationRules[field] = {
|
|
69
73
|
aggregationFunctionName: columnItem,
|
|
70
74
|
aggregationFunction: aggregationFunctions[columnItem]
|
|
71
75
|
};
|
|
72
76
|
}
|
|
73
|
-
}
|
|
77
|
+
}
|
|
74
78
|
return aggregationRules;
|
|
75
79
|
};
|
|
76
80
|
exports.getAggregationRules = getAggregationRules;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export
|
|
1
|
+
export type { GridAggregationState, GridAggregationInitialState, GridAggregationInternalCache, GridAggregationApi, GridAggregationGetCellValueParams, GridAggregationFunction, GridAggregationFunctionDataSource, GridAggregationParams, GridAggregationModel, GridAggregationLookup, GridAggregationPosition, GridAggregationCellMeta, GridAggregationHeaderMeta, GridAggregationRule, GridAggregationRules, } from './gridAggregationInterfaces';
|
|
2
2
|
export * from './gridAggregationSelectors';
|
|
3
3
|
export * from './gridAggregationFunctions';
|
|
4
4
|
export { GRID_AGGREGATION_ROOT_FOOTER_ROW_ID, getAggregationFooterRowIdFromGroupId, } from './gridAggregationUtils';
|
|
@@ -19,18 +19,6 @@ Object.defineProperty(exports, "getAggregationFooterRowIdFromGroupId", {
|
|
|
19
19
|
return _gridAggregationUtils.getAggregationFooterRowIdFromGroupId;
|
|
20
20
|
}
|
|
21
21
|
});
|
|
22
|
-
var _gridAggregationInterfaces = require("./gridAggregationInterfaces");
|
|
23
|
-
Object.keys(_gridAggregationInterfaces).forEach(function (key) {
|
|
24
|
-
if (key === "default" || key === "__esModule") return;
|
|
25
|
-
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
26
|
-
if (key in exports && exports[key] === _gridAggregationInterfaces[key]) return;
|
|
27
|
-
Object.defineProperty(exports, key, {
|
|
28
|
-
enumerable: true,
|
|
29
|
-
get: function () {
|
|
30
|
-
return _gridAggregationInterfaces[key];
|
|
31
|
-
}
|
|
32
|
-
});
|
|
33
|
-
});
|
|
34
22
|
var _gridAggregationSelectors = require("./gridAggregationSelectors");
|
|
35
23
|
Object.keys(_gridAggregationSelectors).forEach(function (key) {
|
|
36
24
|
if (key === "default" || key === "__esModule") return;
|
|
@@ -3,4 +3,4 @@ import { GridStateInitializer } from '@mui/x-data-grid-pro/internals';
|
|
|
3
3
|
import { DataGridPremiumProcessedProps } from '../../../models/dataGridPremiumProps';
|
|
4
4
|
import { GridPrivateApiPremium } from '../../../models/gridApiPremium';
|
|
5
5
|
export declare const aggregationStateInitializer: GridStateInitializer<Pick<DataGridPremiumProcessedProps, 'aggregationModel' | 'initialState'>, GridPrivateApiPremium>;
|
|
6
|
-
export declare const useGridAggregation: (apiRef: React.MutableRefObject<GridPrivateApiPremium>, props: Pick<DataGridPremiumProcessedProps, "onAggregationModelChange" | "initialState" | "aggregationModel" | "getAggregationPosition" | "aggregationFunctions" | "aggregationRowsScope" | "disableAggregation" | "rowGroupingColumnMode">) => void;
|
|
6
|
+
export declare const useGridAggregation: (apiRef: React.MutableRefObject<GridPrivateApiPremium>, props: Pick<DataGridPremiumProcessedProps, "onAggregationModelChange" | "initialState" | "aggregationModel" | "getAggregationPosition" | "aggregationFunctions" | "aggregationRowsScope" | "disableAggregation" | "rowGroupingColumnMode" | "unstable_dataSource">) => void;
|
|
@@ -9,6 +9,7 @@ exports.useGridAggregation = exports.aggregationStateInitializer = void 0;
|
|
|
9
9
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
10
10
|
var React = _interopRequireWildcard(require("react"));
|
|
11
11
|
var _xDataGridPro = require("@mui/x-data-grid-pro");
|
|
12
|
+
var _internals = require("@mui/x-data-grid-pro/internals");
|
|
12
13
|
var _gridAggregationSelectors = require("./gridAggregationSelectors");
|
|
13
14
|
var _gridAggregationUtils = require("./gridAggregationUtils");
|
|
14
15
|
var _createAggregationLookup = require("./createAggregationLookup");
|
|
@@ -48,18 +49,29 @@ const useGridAggregation = (apiRef, props) => {
|
|
|
48
49
|
apiRef,
|
|
49
50
|
getAggregationPosition: props.getAggregationPosition,
|
|
50
51
|
aggregationFunctions: props.aggregationFunctions,
|
|
51
|
-
aggregationRowsScope: props.aggregationRowsScope
|
|
52
|
+
aggregationRowsScope: props.aggregationRowsScope,
|
|
53
|
+
isDataSource: !!props.unstable_dataSource
|
|
52
54
|
});
|
|
53
55
|
apiRef.current.setState(state => (0, _extends2.default)({}, state, {
|
|
54
56
|
aggregation: (0, _extends2.default)({}, state.aggregation, {
|
|
55
57
|
lookup: aggregationLookup
|
|
56
58
|
})
|
|
57
59
|
}));
|
|
58
|
-
}, [apiRef, props.getAggregationPosition, props.aggregationFunctions, props.aggregationRowsScope]);
|
|
60
|
+
}, [apiRef, props.getAggregationPosition, props.aggregationFunctions, props.aggregationRowsScope, props.unstable_dataSource]);
|
|
59
61
|
const aggregationApi = {
|
|
60
62
|
setAggregationModel
|
|
61
63
|
};
|
|
64
|
+
const aggregationPrivateApi = {
|
|
65
|
+
applyAggregation
|
|
66
|
+
};
|
|
62
67
|
(0, _xDataGridPro.useGridApiMethod)(apiRef, aggregationApi, 'public');
|
|
68
|
+
(0, _xDataGridPro.useGridApiMethod)(apiRef, aggregationPrivateApi, 'private');
|
|
69
|
+
const addGetRowsParams = React.useCallback(params => {
|
|
70
|
+
return (0, _extends2.default)({}, params, {
|
|
71
|
+
aggregationModel: (0, _gridAggregationSelectors.gridAggregationModelSelector)(apiRef)
|
|
72
|
+
});
|
|
73
|
+
}, [apiRef]);
|
|
74
|
+
(0, _internals.useGridRegisterPipeProcessor)(apiRef, 'getRowsParams', addGetRowsParams);
|
|
63
75
|
|
|
64
76
|
/**
|
|
65
77
|
* EVENTS
|
|
@@ -69,16 +81,16 @@ const useGridAggregation = (apiRef, props) => {
|
|
|
69
81
|
rulesOnLastRowHydration,
|
|
70
82
|
rulesOnLastColumnHydration
|
|
71
83
|
} = apiRef.current.caches.aggregation;
|
|
72
|
-
const aggregationRules = props.disableAggregation ? {} : (0, _gridAggregationUtils.getAggregationRules)(
|
|
73
|
-
columnsLookup: (0, _xDataGridPro.gridColumnLookupSelector)(apiRef),
|
|
74
|
-
aggregationModel: (0, _gridAggregationSelectors.gridAggregationModelSelector)(apiRef),
|
|
75
|
-
aggregationFunctions: props.aggregationFunctions
|
|
76
|
-
});
|
|
84
|
+
const aggregationRules = props.disableAggregation ? {} : (0, _gridAggregationUtils.getAggregationRules)((0, _xDataGridPro.gridColumnLookupSelector)(apiRef), (0, _gridAggregationSelectors.gridAggregationModelSelector)(apiRef), props.aggregationFunctions, !!props.unstable_dataSource);
|
|
77
85
|
|
|
78
86
|
// Re-apply the row hydration to add / remove the aggregation footers
|
|
79
87
|
if (!(0, _gridAggregationUtils.areAggregationRulesEqual)(rulesOnLastRowHydration, aggregationRules)) {
|
|
80
|
-
|
|
81
|
-
|
|
88
|
+
if (props.unstable_dataSource) {
|
|
89
|
+
apiRef.current.unstable_dataSource.fetchRows();
|
|
90
|
+
} else {
|
|
91
|
+
apiRef.current.requestPipeProcessorsApplication('hydrateRows');
|
|
92
|
+
applyAggregation();
|
|
93
|
+
}
|
|
82
94
|
}
|
|
83
95
|
|
|
84
96
|
// Re-apply the column hydration to wrap / unwrap the aggregated columns
|
|
@@ -86,7 +98,7 @@ const useGridAggregation = (apiRef, props) => {
|
|
|
86
98
|
apiRef.current.caches.aggregation.rulesOnLastColumnHydration = aggregationRules;
|
|
87
99
|
apiRef.current.requestPipeProcessorsApplication('hydrateColumns');
|
|
88
100
|
}
|
|
89
|
-
}, [apiRef, applyAggregation, props.aggregationFunctions, props.disableAggregation]);
|
|
101
|
+
}, [apiRef, applyAggregation, props.aggregationFunctions, props.disableAggregation, props.unstable_dataSource]);
|
|
90
102
|
(0, _xDataGridPro.useGridApiEventHandler)(apiRef, 'aggregationModelChange', checkAggregationRulesDiff);
|
|
91
103
|
(0, _xDataGridPro.useGridApiEventHandler)(apiRef, 'columnsChange', checkAggregationRulesDiff);
|
|
92
104
|
(0, _xDataGridPro.useGridApiEventHandler)(apiRef, 'filteredRowsSet', applyAggregation);
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { GridPrivateApiPremium } from '../../../models/gridApiPremium';
|
|
3
3
|
import { DataGridPremiumProcessedProps } from '../../../models/dataGridPremiumProps';
|
|
4
|
-
export declare const useGridAggregationPreProcessors: (apiRef: React.MutableRefObject<GridPrivateApiPremium>, props: Pick<DataGridPremiumProcessedProps, "aggregationFunctions" | "disableAggregation" | "getAggregationPosition" | "slotProps" | "slots">) => void;
|
|
4
|
+
export declare const useGridAggregationPreProcessors: (apiRef: React.MutableRefObject<GridPrivateApiPremium>, props: Pick<DataGridPremiumProcessedProps, "aggregationFunctions" | "disableAggregation" | "getAggregationPosition" | "slotProps" | "slots" | "unstable_dataSource">) => void;
|
|
@@ -18,11 +18,7 @@ const useGridAggregationPreProcessors = (apiRef, props) => {
|
|
|
18
18
|
// that the pre-processor is called it will already have been updated with the current rules.
|
|
19
19
|
const rulesOnLastColumnHydration = React.useRef({});
|
|
20
20
|
const updateAggregatedColumns = React.useCallback(columnsState => {
|
|
21
|
-
const aggregationRules = props.disableAggregation ? {} : (0, _gridAggregationUtils.getAggregationRules)(
|
|
22
|
-
columnsLookup: columnsState.lookup,
|
|
23
|
-
aggregationModel: (0, _gridAggregationSelectors.gridAggregationModelSelector)(apiRef),
|
|
24
|
-
aggregationFunctions: props.aggregationFunctions
|
|
25
|
-
});
|
|
21
|
+
const aggregationRules = props.disableAggregation ? {} : (0, _gridAggregationUtils.getAggregationRules)(columnsState.lookup, (0, _gridAggregationSelectors.gridAggregationModelSelector)(apiRef), props.aggregationFunctions, !!props.unstable_dataSource);
|
|
26
22
|
columnsState.orderedFields.forEach(field => {
|
|
27
23
|
const shouldHaveAggregationValue = !!aggregationRules[field];
|
|
28
24
|
const haveAggregationColumnValue = !!rulesOnLastColumnHydration.current[field];
|
|
@@ -43,13 +39,9 @@ const useGridAggregationPreProcessors = (apiRef, props) => {
|
|
|
43
39
|
});
|
|
44
40
|
rulesOnLastColumnHydration.current = aggregationRules;
|
|
45
41
|
return columnsState;
|
|
46
|
-
}, [apiRef, props.aggregationFunctions, props.disableAggregation]);
|
|
42
|
+
}, [apiRef, props.aggregationFunctions, props.disableAggregation, props.unstable_dataSource]);
|
|
47
43
|
const addGroupFooterRows = React.useCallback(value => {
|
|
48
|
-
const aggregationRules = props.disableAggregation ? {} : (0, _gridAggregationUtils.getAggregationRules)(
|
|
49
|
-
columnsLookup: (0, _xDataGridPro.gridColumnLookupSelector)(apiRef),
|
|
50
|
-
aggregationModel: (0, _gridAggregationSelectors.gridAggregationModelSelector)(apiRef),
|
|
51
|
-
aggregationFunctions: props.aggregationFunctions
|
|
52
|
-
});
|
|
44
|
+
const aggregationRules = props.disableAggregation ? {} : (0, _gridAggregationUtils.getAggregationRules)((0, _xDataGridPro.gridColumnLookupSelector)(apiRef), (0, _gridAggregationSelectors.gridAggregationModelSelector)(apiRef), props.aggregationFunctions, !!props.unstable_dataSource);
|
|
53
45
|
const hasAggregationRule = Object.keys(aggregationRules).length > 0;
|
|
54
46
|
|
|
55
47
|
// If we did not have any aggregation footer before, and we still don't have any,
|
|
@@ -64,20 +56,21 @@ const useGridAggregationPreProcessors = (apiRef, props) => {
|
|
|
64
56
|
getAggregationPosition: props.getAggregationPosition,
|
|
65
57
|
hasAggregationRule
|
|
66
58
|
});
|
|
67
|
-
}, [apiRef, props.disableAggregation, props.getAggregationPosition, props.aggregationFunctions]);
|
|
59
|
+
}, [apiRef, props.disableAggregation, props.getAggregationPosition, props.aggregationFunctions, props.unstable_dataSource]);
|
|
68
60
|
const addColumnMenuButtons = React.useCallback((columnMenuItems, colDef) => {
|
|
69
61
|
if (props.disableAggregation || !colDef.aggregable) {
|
|
70
62
|
return columnMenuItems;
|
|
71
63
|
}
|
|
72
64
|
const availableAggregationFunctions = (0, _gridAggregationUtils.getAvailableAggregationFunctions)({
|
|
73
65
|
aggregationFunctions: props.aggregationFunctions,
|
|
74
|
-
colDef
|
|
66
|
+
colDef,
|
|
67
|
+
isDataSource: !!props.unstable_dataSource
|
|
75
68
|
});
|
|
76
69
|
if (availableAggregationFunctions.length === 0) {
|
|
77
70
|
return columnMenuItems;
|
|
78
71
|
}
|
|
79
72
|
return [...columnMenuItems, 'columnMenuAggregationItem'];
|
|
80
|
-
}, [props.aggregationFunctions, props.disableAggregation]);
|
|
73
|
+
}, [props.aggregationFunctions, props.disableAggregation, props.unstable_dataSource]);
|
|
81
74
|
const stateExportPreProcessing = React.useCallback(prevState => {
|
|
82
75
|
if (props.disableAggregation) {
|
|
83
76
|
return prevState;
|
|
@@ -3,4 +3,4 @@ import { GridStateInitializer } from '@mui/x-data-grid-pro/internals';
|
|
|
3
3
|
import { DataGridPremiumProcessedProps } from '../../../models/dataGridPremiumProps';
|
|
4
4
|
import { GridPrivateApiPremium } from '../../../models/gridApiPremium';
|
|
5
5
|
export declare const cellSelectionStateInitializer: GridStateInitializer<Pick<DataGridPremiumProcessedProps, 'cellSelectionModel' | 'initialState'>>;
|
|
6
|
-
export declare const useGridCellSelection: (apiRef: React.
|
|
6
|
+
export declare const useGridCellSelection: (apiRef: React.RefObject<GridPrivateApiPremium>, props: Pick<DataGridPremiumProcessedProps, "cellSelection" | "cellSelectionModel" | "onCellSelectionModelChange" | "pagination" | "paginationMode" | "ignoreValueFormatterDuringExport" | "clipboardCopyCellDelimiter" | "columnHeaderHeight">) => void;
|
|
@@ -26,10 +26,10 @@ const AUTO_SCROLL_SPEED = 20; // The speed to scroll once the mouse enters the s
|
|
|
26
26
|
const useGridCellSelection = (apiRef, props) => {
|
|
27
27
|
const hasRootReference = apiRef.current.rootElementRef.current !== null;
|
|
28
28
|
const visibleRows = (0, _internals.useGridVisibleRows)(apiRef, props);
|
|
29
|
-
const cellWithVirtualFocus = React.useRef();
|
|
30
|
-
const lastMouseDownCell = React.useRef();
|
|
29
|
+
const cellWithVirtualFocus = React.useRef(null);
|
|
30
|
+
const lastMouseDownCell = React.useRef(null);
|
|
31
31
|
const mousePosition = React.useRef(null);
|
|
32
|
-
const autoScrollRAF = React.useRef();
|
|
32
|
+
const autoScrollRAF = React.useRef(null);
|
|
33
33
|
const sortedRowIds = (0, _xDataGridPro.useGridSelector)(apiRef, _xDataGridPro.gridSortedRowIdsSelector);
|
|
34
34
|
const dimensions = (0, _xDataGridPro.useGridSelector)(apiRef, _xDataGridPro.gridDimensionsSelector);
|
|
35
35
|
const totalHeaderHeight = (0, _internals.getTotalHeaderHeight)(apiRef, props);
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.getKeyPremium = getKeyPremium;
|
|
7
|
+
function getKeyPremium(params) {
|
|
8
|
+
return JSON.stringify([params.filterModel, params.sortModel, params.groupKeys, params.groupFields, params.start, params.end, params.aggregationModel]);
|
|
9
|
+
}
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import type { GridColDef, GridRowId, GridValidRowModel, GridDataSource, GridGetRowsResponse, GridGetRowsParams, GridDataSourceApiBase, GridDataSourcePrivateApi } from '@mui/x-data-grid-pro';
|
|
2
|
+
import type { GridAggregationModel } from '../aggregation/gridAggregationInterfaces';
|
|
3
|
+
export interface GridGetRowsResponsePremium extends GridGetRowsResponse {
|
|
4
|
+
/**
|
|
5
|
+
* Row to be used for aggregation footer row.
|
|
6
|
+
* It must provide the values for the aggregated columns passed in
|
|
7
|
+
* `GridGetRowsParams.aggregationModel`.
|
|
8
|
+
*/
|
|
9
|
+
aggregateRow?: GridValidRowModel;
|
|
10
|
+
}
|
|
11
|
+
export interface GridGetRowsParamsPremium extends GridGetRowsParams {
|
|
12
|
+
aggregationModel?: GridAggregationModel;
|
|
13
|
+
}
|
|
14
|
+
export interface GridDataSourcePremium extends Omit<GridDataSource, 'getRows'> {
|
|
15
|
+
/**
|
|
16
|
+
* This method will be called when the grid needs to fetch some rows.
|
|
17
|
+
* @param {GridGetRowsParamsPremium} params The parameters required to fetch the rows.
|
|
18
|
+
* @returns {Promise<GridGetRowsResponsePremium>} A promise that resolves to the data of type [GridGetRowsResponsePremium].
|
|
19
|
+
*/
|
|
20
|
+
getRows(params: GridGetRowsParamsPremium): Promise<GridGetRowsResponsePremium>;
|
|
21
|
+
/**
|
|
22
|
+
* Used to get the aggregated value for a parent row.
|
|
23
|
+
* @param {GridValidRowModel} row The row to extract the aggregated value from.
|
|
24
|
+
* @param {GridColDef['field']} field The field to extract the aggregated value for.
|
|
25
|
+
* @returns {string} The aggregated value for a specific aggregated column.
|
|
26
|
+
*/
|
|
27
|
+
getAggregatedValue?: (row: GridValidRowModel, field: GridColDef['field']) => string;
|
|
28
|
+
}
|
|
29
|
+
export interface GridDataSourceApiBasePremium extends Omit<GridDataSourceApiBase, 'fetchRows'> {
|
|
30
|
+
/**
|
|
31
|
+
* Fetches the rows from the server.
|
|
32
|
+
* If no `parentId` option is provided, it fetches the root rows.
|
|
33
|
+
* Any missing parameter from `params` will be filled from the state (sorting, filtering, etc.).
|
|
34
|
+
* @param {GridRowId} parentId The id of the parent node (default: `GRID_ROOT_GROUP_ID`).
|
|
35
|
+
* @param {Partial<GridGetRowsParamsPremium>} params Request parameters override.
|
|
36
|
+
*/
|
|
37
|
+
fetchRows: (parentId?: GridRowId, params?: Partial<GridGetRowsParamsPremium>) => void;
|
|
38
|
+
}
|
|
39
|
+
export interface GridDataSourceApiPremium {
|
|
40
|
+
/**
|
|
41
|
+
* The data source API.
|
|
42
|
+
*/
|
|
43
|
+
unstable_dataSource: GridDataSourceApiBasePremium;
|
|
44
|
+
}
|
|
45
|
+
export interface GridDataSourcePremiumPrivateApi extends GridDataSourcePrivateApi {
|
|
46
|
+
resolveGroupAggregation: (groupId: GridRowId, field: string) => any;
|
|
47
|
+
}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { GridPrivateApiPremium } from '../../../models/gridApiPremium';
|
|
3
|
+
import { DataGridPremiumProcessedProps } from '../../../models/dataGridPremiumProps';
|
|
4
|
+
export declare const useGridDataSourcePremium: (apiRef: React.MutableRefObject<GridPrivateApiPremium>, props: DataGridPremiumProcessedProps) => void;
|