@mui/x-data-grid 7.0.0-alpha.5 → 7.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 +408 -6
- package/DataGrid/DataGrid.js +31 -21
- package/DataGrid/useDataGridProps.js +0 -1
- package/colDef/gridDateOperators.js +13 -6
- package/colDef/gridSingleSelectColDef.js +6 -15
- package/components/GridPagination.d.ts +2 -2
- package/components/cell/GridEditSingleSelectCell.d.ts +1 -2
- package/components/cell/GridEditSingleSelectCell.js +9 -29
- package/components/columnSelection/GridHeaderCheckbox.js +3 -1
- package/components/panel/filterPanel/GridFilterForm.js +44 -9
- package/components/panel/filterPanel/GridFilterInputBoolean.js +1 -1
- package/components/panel/filterPanel/GridFilterInputDate.js +25 -8
- package/components/panel/filterPanel/GridFilterInputMultipleSingleSelect.d.ts +2 -2
- package/components/panel/filterPanel/GridFilterInputMultipleSingleSelect.js +7 -48
- package/components/panel/filterPanel/GridFilterInputSingleSelect.d.ts +1 -2
- package/components/panel/filterPanel/GridFilterInputSingleSelect.js +15 -57
- package/components/panel/filterPanel/filterPanelUtils.d.ts +3 -2
- package/components/panel/filterPanel/filterPanelUtils.js +10 -5
- package/hooks/features/filter/gridFilterUtils.js +21 -24
- package/hooks/features/rowSelection/useGridRowSelection.js +9 -9
- package/hooks/features/rowSelection/utils.d.ts +2 -0
- package/hooks/features/rowSelection/utils.js +8 -0
- package/hooks/utils/useGridAriaAttributes.js +2 -1
- package/index.js +1 -1
- package/legacy/DataGrid/DataGrid.js +31 -21
- package/legacy/DataGrid/useDataGridProps.js +0 -1
- package/legacy/colDef/gridDateOperators.js +13 -13
- package/legacy/colDef/gridSingleSelectColDef.js +6 -15
- package/legacy/components/cell/GridEditSingleSelectCell.js +8 -28
- package/legacy/components/columnSelection/GridHeaderCheckbox.js +3 -1
- package/legacy/components/panel/filterPanel/GridFilterForm.js +51 -19
- package/legacy/components/panel/filterPanel/GridFilterInputBoolean.js +1 -1
- package/legacy/components/panel/filterPanel/GridFilterInputDate.js +27 -8
- package/legacy/components/panel/filterPanel/GridFilterInputMultipleSingleSelect.js +6 -53
- package/legacy/components/panel/filterPanel/GridFilterInputSingleSelect.js +14 -59
- package/legacy/components/panel/filterPanel/filterPanelUtils.js +10 -6
- package/legacy/hooks/features/filter/gridFilterUtils.js +20 -17
- package/legacy/hooks/features/rowSelection/useGridRowSelection.js +9 -9
- package/legacy/hooks/features/rowSelection/utils.js +8 -0
- package/legacy/hooks/utils/useGridAriaAttributes.js +2 -1
- package/legacy/index.js +1 -1
- package/legacy/locales/csCZ.js +2 -2
- package/locales/csCZ.js +2 -2
- package/models/props/DataGridProps.d.ts +26 -26
- package/modern/DataGrid/DataGrid.js +31 -21
- package/modern/DataGrid/useDataGridProps.js +0 -1
- package/modern/colDef/gridDateOperators.js +13 -6
- package/modern/colDef/gridSingleSelectColDef.js +6 -15
- package/modern/components/cell/GridEditSingleSelectCell.js +9 -29
- package/modern/components/columnSelection/GridHeaderCheckbox.js +3 -1
- package/modern/components/panel/filterPanel/GridFilterForm.js +44 -9
- package/modern/components/panel/filterPanel/GridFilterInputBoolean.js +1 -1
- package/modern/components/panel/filterPanel/GridFilterInputDate.js +24 -6
- package/modern/components/panel/filterPanel/GridFilterInputMultipleSingleSelect.js +7 -47
- package/modern/components/panel/filterPanel/GridFilterInputSingleSelect.js +15 -56
- package/modern/components/panel/filterPanel/filterPanelUtils.js +10 -5
- package/modern/hooks/features/filter/gridFilterUtils.js +21 -24
- package/modern/hooks/features/rowSelection/useGridRowSelection.js +9 -9
- package/modern/hooks/features/rowSelection/utils.js +8 -0
- package/modern/hooks/utils/useGridAriaAttributes.js +2 -1
- package/modern/index.js +1 -1
- package/modern/locales/csCZ.js +2 -2
- package/node/DataGrid/DataGrid.js +31 -21
- package/node/DataGrid/useDataGridProps.js +0 -1
- package/node/colDef/gridDateOperators.js +13 -6
- package/node/colDef/gridSingleSelectColDef.js +5 -14
- package/node/components/cell/GridEditSingleSelectCell.js +8 -28
- package/node/components/columnSelection/GridHeaderCheckbox.js +3 -1
- package/node/components/panel/filterPanel/GridFilterForm.js +44 -9
- package/node/components/panel/filterPanel/GridFilterInputBoolean.js +1 -1
- package/node/components/panel/filterPanel/GridFilterInputDate.js +24 -6
- package/node/components/panel/filterPanel/GridFilterInputMultipleSingleSelect.js +6 -46
- package/node/components/panel/filterPanel/GridFilterInputSingleSelect.js +14 -55
- package/node/components/panel/filterPanel/filterPanelUtils.js +12 -7
- package/node/hooks/features/filter/gridFilterUtils.js +21 -23
- package/node/hooks/features/rowSelection/useGridRowSelection.js +9 -9
- package/node/hooks/features/rowSelection/utils.js +14 -0
- package/node/hooks/utils/useGridAriaAttributes.js +2 -1
- package/node/index.js +1 -1
- package/node/locales/csCZ.js +2 -2
- package/package.json +4 -4
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
import type { GridColDef, GridSingleSelectColDef
|
|
1
|
+
import type { GridColDef, GridSingleSelectColDef } from '../../../models/colDef/gridColDef';
|
|
2
|
+
import type { GridValueOptionsParams } from '../../../models/params/gridValueOptionsParams';
|
|
2
3
|
export declare function isSingleSelectColDef(colDef: GridColDef | null): colDef is GridSingleSelectColDef;
|
|
4
|
+
export declare function getValueOptions(column: GridSingleSelectColDef, additionalParams?: Omit<GridValueOptionsParams, 'field'>): import("../../../models/colDef/gridColDef").ValueOptions[] | undefined;
|
|
3
5
|
export declare function getValueFromValueOptions(value: string, valueOptions: any[] | undefined, getOptionValue: NonNullable<GridSingleSelectColDef['getOptionValue']>): any;
|
|
4
|
-
export declare const getLabelFromValueOption: (valueOption: ValueOptions) => string;
|
|
@@ -1,6 +1,15 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
1
2
|
export function isSingleSelectColDef(colDef) {
|
|
2
3
|
return (colDef == null ? void 0 : colDef.type) === 'singleSelect';
|
|
3
4
|
}
|
|
5
|
+
export function getValueOptions(column, additionalParams) {
|
|
6
|
+
if (!column) {
|
|
7
|
+
return undefined;
|
|
8
|
+
}
|
|
9
|
+
return typeof column.valueOptions === 'function' ? column.valueOptions(_extends({
|
|
10
|
+
field: column.field
|
|
11
|
+
}, additionalParams)) : column.valueOptions;
|
|
12
|
+
}
|
|
4
13
|
export function getValueFromValueOptions(value, valueOptions, getOptionValue) {
|
|
5
14
|
if (valueOptions === undefined) {
|
|
6
15
|
return undefined;
|
|
@@ -10,8 +19,4 @@ export function getValueFromValueOptions(value, valueOptions, getOptionValue) {
|
|
|
10
19
|
return String(optionValue) === String(value);
|
|
11
20
|
});
|
|
12
21
|
return getOptionValue(result);
|
|
13
|
-
}
|
|
14
|
-
export const getLabelFromValueOption = valueOption => {
|
|
15
|
-
const label = typeof valueOption === 'object' ? valueOption.label : valueOption;
|
|
16
|
-
return label != null ? String(label) : '';
|
|
17
|
-
};
|
|
22
|
+
}
|
|
@@ -4,15 +4,17 @@ import { getDefaultGridFilterModel } from './gridFilterState';
|
|
|
4
4
|
import { buildWarning } from '../../../utils/warning';
|
|
5
5
|
import { getPublicApiRef } from '../../../utils/getPublicApiRef';
|
|
6
6
|
import { gridColumnFieldsSelector, gridColumnLookupSelector, gridVisibleColumnFieldsSelector } from '../columns';
|
|
7
|
-
|
|
8
|
-
// Fixes https://github.com/mui/mui-x/issues/10056
|
|
9
|
-
const globalScope = typeof window === 'undefined' ? globalThis : window;
|
|
10
|
-
const evalCode = globalScope[atob('ZXZhbA==')];
|
|
11
7
|
let hasEval;
|
|
12
|
-
|
|
13
|
-
hasEval
|
|
14
|
-
|
|
15
|
-
|
|
8
|
+
function getHasEval() {
|
|
9
|
+
if (hasEval !== undefined) {
|
|
10
|
+
return hasEval;
|
|
11
|
+
}
|
|
12
|
+
try {
|
|
13
|
+
hasEval = new Function('return true')();
|
|
14
|
+
} catch (_) {
|
|
15
|
+
hasEval = false;
|
|
16
|
+
}
|
|
17
|
+
return hasEval;
|
|
16
18
|
}
|
|
17
19
|
/**
|
|
18
20
|
* Adds default values to the optional fields of a filter items.
|
|
@@ -140,7 +142,7 @@ const buildAggregatedFilterItemsApplier = (filterModel, apiRef, disableEval) =>
|
|
|
140
142
|
if (appliers.length === 0) {
|
|
141
143
|
return null;
|
|
142
144
|
}
|
|
143
|
-
if (
|
|
145
|
+
if (disableEval || !getHasEval()) {
|
|
144
146
|
// This is the original logic, which is used if `eval()` is not supported (aka prevented by CSP).
|
|
145
147
|
return (row, shouldApplyFilter) => {
|
|
146
148
|
const resultPerItemId = {};
|
|
@@ -154,25 +156,20 @@ const buildAggregatedFilterItemsApplier = (filterModel, apiRef, disableEval) =>
|
|
|
154
156
|
};
|
|
155
157
|
}
|
|
156
158
|
|
|
157
|
-
// We generate a new function with `
|
|
159
|
+
// We generate a new function with `new Function()` to avoid expensive patterns for JS engines
|
|
158
160
|
// such as a dynamic object assignment, e.g. `{ [dynamicKey]: value }`.
|
|
159
|
-
const
|
|
160
|
-
|
|
161
|
+
const filterItemCore = new Function('appliers', 'row', 'shouldApplyFilter', `"use strict";
|
|
162
|
+
${appliers.map((applier, i) => `const shouldApply${i} = !shouldApplyFilter || shouldApplyFilter(${JSON.stringify(applier.item.field)});`).join('\n')}
|
|
161
163
|
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
false :
|
|
166
|
-
appliers[${i}].fn(row),
|
|
167
|
-
`).join('\n')}};
|
|
164
|
+
const result$$ = {
|
|
165
|
+
${appliers.map((applier, i) => ` ${JSON.stringify(String(applier.item.id))}: !shouldApply${i} ? false : appliers[${i}].fn(row),`).join('\n')}
|
|
166
|
+
};
|
|
168
167
|
|
|
169
|
-
|
|
170
|
-
})`;
|
|
171
|
-
const filterItemCore = evalCode(filterItemTemplate.replaceAll('$$', String(filterItemsApplierId)));
|
|
172
|
-
const filterItem = (row, shouldApplyItem) => {
|
|
173
|
-
return filterItemCore(apiRef.current.getRowId, appliers, row, shouldApplyItem);
|
|
174
|
-
};
|
|
168
|
+
return result$$;`.replaceAll('$$', String(filterItemsApplierId)));
|
|
175
169
|
filterItemsApplierId += 1;
|
|
170
|
+
|
|
171
|
+
// Assign to the arrow function a name to help debugging
|
|
172
|
+
const filterItem = (row, shouldApplyItem) => filterItemCore(appliers, row, shouldApplyItem);
|
|
176
173
|
return filterItem;
|
|
177
174
|
};
|
|
178
175
|
export const shouldQuickFilterExcludeHiddenColumns = filterModel => {
|
|
@@ -15,6 +15,7 @@ import { useGridVisibleRows } from '../../utils/useGridVisibleRows';
|
|
|
15
15
|
import { GRID_DETAIL_PANEL_TOGGLE_FIELD } from '../../../constants/gridDetailPanelToggleField';
|
|
16
16
|
import { gridClasses } from '../../../constants/gridClasses';
|
|
17
17
|
import { isEventTargetInPortal } from '../../../utils/domUtils';
|
|
18
|
+
import { isMultipleRowSelectionEnabled } from './utils';
|
|
18
19
|
const getSelectionModelPropValue = (selectionModelProp, prevSelectionModel) => {
|
|
19
20
|
if (selectionModelProp == null) {
|
|
20
21
|
return selectionModelProp;
|
|
@@ -60,11 +61,10 @@ export const useGridRowSelection = (apiRef, props) => {
|
|
|
60
61
|
});
|
|
61
62
|
const {
|
|
62
63
|
checkboxSelection,
|
|
63
|
-
disableMultipleRowSelection,
|
|
64
64
|
disableRowSelectionOnClick,
|
|
65
65
|
isRowSelectable: propIsRowSelectable
|
|
66
66
|
} = props;
|
|
67
|
-
const canHaveMultipleSelection =
|
|
67
|
+
const canHaveMultipleSelection = isMultipleRowSelectionEnabled(props);
|
|
68
68
|
const visibleRows = useGridVisibleRows(apiRef, props);
|
|
69
69
|
const expandMouseRowRangeSelection = React.useCallback(id => {
|
|
70
70
|
var _lastRowToggled$curre;
|
|
@@ -95,7 +95,7 @@ export const useGridRowSelection = (apiRef, props) => {
|
|
|
95
95
|
* API METHODS
|
|
96
96
|
*/
|
|
97
97
|
const setRowSelectionModel = React.useCallback(model => {
|
|
98
|
-
if (props.signature === GridSignature.DataGrid && !
|
|
98
|
+
if (props.signature === GridSignature.DataGrid && !canHaveMultipleSelection && Array.isArray(model) && model.length > 1) {
|
|
99
99
|
throw new Error(['MUI: `rowSelectionModel` can only contain 1 item in DataGrid.', 'You need to upgrade to DataGridPro or DataGridPremium component to unlock multiple selection.'].join('\n'));
|
|
100
100
|
}
|
|
101
101
|
const currentModel = gridRowSelectionStateSelector(apiRef.current.state);
|
|
@@ -106,7 +106,7 @@ export const useGridRowSelection = (apiRef, props) => {
|
|
|
106
106
|
}));
|
|
107
107
|
apiRef.current.forceUpdate();
|
|
108
108
|
}
|
|
109
|
-
}, [apiRef, logger, props.rowSelection, props.signature,
|
|
109
|
+
}, [apiRef, logger, props.rowSelection, props.signature, canHaveMultipleSelection]);
|
|
110
110
|
const isRowSelected = React.useCallback(id => gridRowSelectionStateSelector(apiRef.current.state).includes(id), [apiRef]);
|
|
111
111
|
const isRowSelectable = React.useCallback(id => {
|
|
112
112
|
if (propIsRowSelectable && !propIsRowSelectable(apiRef.current.getRowParams(id))) {
|
|
@@ -258,12 +258,12 @@ export const useGridRowSelection = (apiRef, props) => {
|
|
|
258
258
|
if (rowNode.type === 'pinnedRow') {
|
|
259
259
|
return;
|
|
260
260
|
}
|
|
261
|
-
if (event.shiftKey &&
|
|
261
|
+
if (event.shiftKey && canHaveMultipleSelection) {
|
|
262
262
|
expandMouseRowRangeSelection(params.id);
|
|
263
263
|
} else {
|
|
264
264
|
handleSingleRowSelection(params.id, event);
|
|
265
265
|
}
|
|
266
|
-
}, [disableRowSelectionOnClick, canHaveMultipleSelection,
|
|
266
|
+
}, [disableRowSelectionOnClick, canHaveMultipleSelection, apiRef, expandMouseRowRangeSelection, handleSingleRowSelection]);
|
|
267
267
|
const preventSelectionOnShift = React.useCallback((params, event) => {
|
|
268
268
|
if (canHaveMultipleSelection && event.shiftKey) {
|
|
269
269
|
var _window$getSelection;
|
|
@@ -271,12 +271,12 @@ export const useGridRowSelection = (apiRef, props) => {
|
|
|
271
271
|
}
|
|
272
272
|
}, [canHaveMultipleSelection]);
|
|
273
273
|
const handleRowSelectionCheckboxChange = React.useCallback((params, event) => {
|
|
274
|
-
if (event.nativeEvent.shiftKey) {
|
|
274
|
+
if (canHaveMultipleSelection && event.nativeEvent.shiftKey) {
|
|
275
275
|
expandMouseRowRangeSelection(params.id);
|
|
276
276
|
} else {
|
|
277
|
-
apiRef.current.selectRow(params.id, params.value);
|
|
277
|
+
apiRef.current.selectRow(params.id, params.value, !canHaveMultipleSelection);
|
|
278
278
|
}
|
|
279
|
-
}, [apiRef, expandMouseRowRangeSelection]);
|
|
279
|
+
}, [apiRef, expandMouseRowRangeSelection, canHaveMultipleSelection]);
|
|
280
280
|
const handleHeaderSelectionCheckboxChange = React.useCallback(params => {
|
|
281
281
|
const shouldLimitSelectionToCurrentPage = props.checkboxSelectionVisibleOnly && props.pagination;
|
|
282
282
|
const rowsToBeSelected = shouldLimitSelectionToCurrentPage ? gridPaginatedVisibleSortedGridRowIdsSelector(apiRef) : gridExpandedSortedRowIdsSelector(apiRef);
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { GridSignature } from '../../utils/useGridApiEventHandler';
|
|
2
|
+
export function isMultipleRowSelectionEnabled(props) {
|
|
3
|
+
if (props.signature === GridSignature.DataGrid) {
|
|
4
|
+
// DataGrid Community has multiple row selection enabled only if checkbox selection is enabled.
|
|
5
|
+
return props.checkboxSelection && props.disableMultipleRowSelection !== true;
|
|
6
|
+
}
|
|
7
|
+
return !props.disableMultipleRowSelection;
|
|
8
|
+
}
|
|
@@ -4,6 +4,7 @@ import { useGridRootProps } from './useGridRootProps';
|
|
|
4
4
|
import { gridColumnGroupsHeaderMaxDepthSelector } from '../features/columnGrouping/gridColumnGroupsSelector';
|
|
5
5
|
import { gridPinnedRowsCountSelector, gridRowCountSelector } from '../features/rows/gridRowsSelector';
|
|
6
6
|
import { useGridPrivateApiContext } from './useGridPrivateApiContext';
|
|
7
|
+
import { isMultipleRowSelectionEnabled } from '../features/rowSelection/utils';
|
|
7
8
|
export const useGridAriaAttributes = () => {
|
|
8
9
|
var _rootProps$experiment;
|
|
9
10
|
const apiRef = useGridPrivateApiContext();
|
|
@@ -20,6 +21,6 @@ export const useGridAriaAttributes = () => {
|
|
|
20
21
|
role,
|
|
21
22
|
'aria-colcount': visibleColumns.length,
|
|
22
23
|
'aria-rowcount': headerGroupingMaxDepth + 1 + pinnedRowsCount + totalRowCount,
|
|
23
|
-
'aria-multiselectable':
|
|
24
|
+
'aria-multiselectable': isMultipleRowSelectionEnabled(rootProps)
|
|
24
25
|
};
|
|
25
26
|
};
|
package/index.js
CHANGED
|
@@ -41,21 +41,21 @@ DataGridRaw.propTypes = {
|
|
|
41
41
|
// | To update them edit the TypeScript types and run "yarn proptypes" |
|
|
42
42
|
// ----------------------------------------------------------------------
|
|
43
43
|
/**
|
|
44
|
-
* The ref object that allows
|
|
44
|
+
* The ref object that allows Data Grid manipulation. Can be instantiated with `useGridApiRef()`.
|
|
45
45
|
*/
|
|
46
46
|
apiRef: PropTypes.shape({
|
|
47
47
|
current: PropTypes.object.isRequired
|
|
48
48
|
}),
|
|
49
49
|
/**
|
|
50
|
-
* The label of the
|
|
50
|
+
* The label of the Data Grid.
|
|
51
51
|
*/
|
|
52
52
|
'aria-label': PropTypes.string,
|
|
53
53
|
/**
|
|
54
|
-
* The id of the element containing a label for the
|
|
54
|
+
* The id of the element containing a label for the Data Grid.
|
|
55
55
|
*/
|
|
56
56
|
'aria-labelledby': PropTypes.string,
|
|
57
57
|
/**
|
|
58
|
-
* If `true`, the
|
|
58
|
+
* If `true`, the Data Grid height is dynamic and follow the number of rows in the Data Grid.
|
|
59
59
|
* @default false
|
|
60
60
|
*/
|
|
61
61
|
autoHeight: PropTypes.bool,
|
|
@@ -63,13 +63,18 @@ DataGridRaw.propTypes = {
|
|
|
63
63
|
* If `true`, the pageSize is calculated according to the container size and the max number of rows to avoid rendering a vertical scroll bar.
|
|
64
64
|
* @default false
|
|
65
65
|
*/
|
|
66
|
-
autoPageSize: PropTypes.bool,
|
|
66
|
+
autoPageSize: chainPropTypes(PropTypes.bool, function (props) {
|
|
67
|
+
if (props.autoHeight && props.autoPageSize) {
|
|
68
|
+
return new Error(['MUI: `<DataGrid autoPageSize={true} autoHeight={true} />` are not valid props.', 'You can not use both the `autoPageSize` and `autoHeight` props at the same time because `autoHeight` scales the height of the Data Grid according to the `pageSize`.', '', 'Please remove one of these two props.'].join('\n'));
|
|
69
|
+
}
|
|
70
|
+
return null;
|
|
71
|
+
}),
|
|
67
72
|
/**
|
|
68
73
|
* Controls the modes of the cells.
|
|
69
74
|
*/
|
|
70
75
|
cellModesModel: PropTypes.object,
|
|
71
76
|
/**
|
|
72
|
-
* If `true`, the
|
|
77
|
+
* If `true`, the Data Grid will display an extra column with checkboxes for selecting rows.
|
|
73
78
|
* @default false
|
|
74
79
|
*/
|
|
75
80
|
checkboxSelection: PropTypes.bool,
|
|
@@ -89,7 +94,7 @@ DataGridRaw.propTypes = {
|
|
|
89
94
|
columnBuffer: PropTypes.number,
|
|
90
95
|
columnGroupingModel: PropTypes.arrayOf(PropTypes.object),
|
|
91
96
|
/**
|
|
92
|
-
* Sets the height in pixel of the column headers in the
|
|
97
|
+
* Sets the height in pixel of the column headers in the Data Grid.
|
|
93
98
|
* @default 56
|
|
94
99
|
*/
|
|
95
100
|
columnHeaderHeight: PropTypes.number,
|
|
@@ -111,12 +116,12 @@ DataGridRaw.propTypes = {
|
|
|
111
116
|
*/
|
|
112
117
|
columnThreshold: PropTypes.number,
|
|
113
118
|
/**
|
|
114
|
-
* Set the column visibility model of the
|
|
115
|
-
* If defined, the
|
|
119
|
+
* Set the column visibility model of the Data Grid.
|
|
120
|
+
* If defined, the Data Grid will ignore the `hide` property in [[GridColDef]].
|
|
116
121
|
*/
|
|
117
122
|
columnVisibilityModel: PropTypes.object,
|
|
118
123
|
/**
|
|
119
|
-
* Set the density of the
|
|
124
|
+
* Set the density of the Data Grid.
|
|
120
125
|
* @default "standard"
|
|
121
126
|
*/
|
|
122
127
|
density: PropTypes.oneOf(['comfortable', 'compact', 'standard']),
|
|
@@ -143,9 +148,14 @@ DataGridRaw.propTypes = {
|
|
|
143
148
|
/**
|
|
144
149
|
* If `true`, `eval()` is not used for performance optimization.
|
|
145
150
|
* @default false
|
|
146
|
-
* @ignore - do not document
|
|
147
151
|
*/
|
|
148
152
|
disableEval: PropTypes.bool,
|
|
153
|
+
/**
|
|
154
|
+
* If `true`, multiple selection using the Ctrl/CMD or Shift key is disabled.
|
|
155
|
+
* The MIT DataGrid will ignore this prop, unless `checkboxSelection` is enabled.
|
|
156
|
+
* @default false (`!props.checkboxSelection` for MIT Data Grid)
|
|
157
|
+
*/
|
|
158
|
+
disableMultipleRowSelection: PropTypes.bool,
|
|
149
159
|
/**
|
|
150
160
|
* If `true`, the selection on click on a row or cell is disabled.
|
|
151
161
|
* @default false
|
|
@@ -182,7 +192,7 @@ DataGridRaw.propTypes = {
|
|
|
182
192
|
*/
|
|
183
193
|
filterMode: PropTypes.oneOf(['client', 'server']),
|
|
184
194
|
/**
|
|
185
|
-
* Set the filter model of the
|
|
195
|
+
* Set the filter model of the Data Grid.
|
|
186
196
|
*/
|
|
187
197
|
filterModel: PropTypes.shape({
|
|
188
198
|
items: PropTypes.arrayOf(PropTypes.shape({
|
|
@@ -197,7 +207,7 @@ DataGridRaw.propTypes = {
|
|
|
197
207
|
quickFilterValues: PropTypes.array
|
|
198
208
|
}),
|
|
199
209
|
/**
|
|
200
|
-
* Forwarded props for the
|
|
210
|
+
* Forwarded props for the Data Grid root element.
|
|
201
211
|
* @ignore - do not document.
|
|
202
212
|
*/
|
|
203
213
|
forwardedProps: PropTypes.object,
|
|
@@ -265,7 +275,7 @@ DataGridRaw.propTypes = {
|
|
|
265
275
|
*/
|
|
266
276
|
ignoreDiacritics: PropTypes.bool,
|
|
267
277
|
/**
|
|
268
|
-
* If `true`, the
|
|
278
|
+
* If `true`, the Data Grid will not use `valueFormatter` when exporting to CSV or copying to clipboard.
|
|
269
279
|
* If an object is provided, you can choose to ignore the `valueFormatter` for CSV export or clipboard export.
|
|
270
280
|
* @default false
|
|
271
281
|
*/
|
|
@@ -303,7 +313,7 @@ DataGridRaw.propTypes = {
|
|
|
303
313
|
*/
|
|
304
314
|
loading: PropTypes.bool,
|
|
305
315
|
/**
|
|
306
|
-
* Set the locale text of the
|
|
316
|
+
* Set the locale text of the Data Grid.
|
|
307
317
|
* You can find all the translation keys supported in [the source](https://github.com/mui/mui-x/blob/HEAD/packages/grid/x-data-grid/src/constants/localeTextConstants.ts) in the GitHub repository.
|
|
308
318
|
*/
|
|
309
319
|
localeText: PropTypes.object,
|
|
@@ -471,7 +481,7 @@ DataGridRaw.propTypes = {
|
|
|
471
481
|
*/
|
|
472
482
|
onProcessRowUpdateError: PropTypes.func,
|
|
473
483
|
/**
|
|
474
|
-
* Callback fired when the
|
|
484
|
+
* Callback fired when the Data Grid is resized.
|
|
475
485
|
* @param {ElementSize} containerSize With all properties from [[ElementSize]].
|
|
476
486
|
* @param {MuiEvent<{}>} event The event object.
|
|
477
487
|
* @param {GridCallbackDetails} details Additional details for this callback.
|
|
@@ -529,7 +539,7 @@ DataGridRaw.propTypes = {
|
|
|
529
539
|
*/
|
|
530
540
|
onSortModelChange: PropTypes.func,
|
|
531
541
|
/**
|
|
532
|
-
* Callback fired when the state of the
|
|
542
|
+
* Callback fired when the state of the Data Grid is updated.
|
|
533
543
|
* @param {GridState} state The new state.
|
|
534
544
|
* @param {MuiEvent<{}>} event The event object.
|
|
535
545
|
* @param {GridCallbackDetails} details Additional details for this callback.
|
|
@@ -583,7 +593,7 @@ DataGridRaw.propTypes = {
|
|
|
583
593
|
*/
|
|
584
594
|
rowCount: PropTypes.number,
|
|
585
595
|
/**
|
|
586
|
-
* Sets the height in pixel of a row in the
|
|
596
|
+
* Sets the height in pixel of a row in the Data Grid.
|
|
587
597
|
* @default 52
|
|
588
598
|
*/
|
|
589
599
|
rowHeight: PropTypes.number,
|
|
@@ -608,7 +618,7 @@ DataGridRaw.propTypes = {
|
|
|
608
618
|
*/
|
|
609
619
|
rowSelection: PropTypes.bool,
|
|
610
620
|
/**
|
|
611
|
-
* Sets the row selection model of the
|
|
621
|
+
* Sets the row selection model of the Data Grid.
|
|
612
622
|
*/
|
|
613
623
|
rowSelectionModel: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired), PropTypes.number, PropTypes.string]),
|
|
614
624
|
/**
|
|
@@ -622,7 +632,7 @@ DataGridRaw.propTypes = {
|
|
|
622
632
|
*/
|
|
623
633
|
rowThreshold: PropTypes.number,
|
|
624
634
|
/**
|
|
625
|
-
* Override the height/width of the
|
|
635
|
+
* Override the height/width of the Data Grid inner scrollbar.
|
|
626
636
|
*/
|
|
627
637
|
scrollbarSize: PropTypes.number,
|
|
628
638
|
/**
|
|
@@ -656,7 +666,7 @@ DataGridRaw.propTypes = {
|
|
|
656
666
|
*/
|
|
657
667
|
sortingOrder: PropTypes.arrayOf(PropTypes.oneOf(['asc', 'desc'])),
|
|
658
668
|
/**
|
|
659
|
-
* Set the sort model of the
|
|
669
|
+
* Set the sort model of the Data Grid.
|
|
660
670
|
*/
|
|
661
671
|
sortModel: PropTypes.arrayOf(PropTypes.shape({
|
|
662
672
|
field: PropTypes.string.isRequired,
|
|
@@ -8,7 +8,6 @@ import { computeSlots, useProps } from '../internals/utils';
|
|
|
8
8
|
var DATA_GRID_FORCED_PROPS = {
|
|
9
9
|
disableMultipleColumnsFiltering: true,
|
|
10
10
|
disableMultipleColumnsSorting: true,
|
|
11
|
-
disableMultipleRowSelection: true,
|
|
12
11
|
throttleRowsMs: undefined,
|
|
13
12
|
hideFooterRowCount: false,
|
|
14
13
|
pagination: true,
|
|
@@ -1,19 +1,15 @@
|
|
|
1
|
-
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
2
1
|
import { GridFilterInputDate } from '../components/panel/filterPanel/GridFilterInputDate';
|
|
3
|
-
var dateRegex = /(\d+)-(\d+)-(\d+)/;
|
|
4
|
-
var dateTimeRegex = /(\d+)-(\d+)-(\d+)T(\d+):(\d+)/;
|
|
5
2
|
function buildApplyFilterFn(filterItem, compareFn, showTime, keepHours) {
|
|
6
3
|
if (!filterItem.value) {
|
|
7
4
|
return null;
|
|
8
5
|
}
|
|
9
|
-
var
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
var time = new Date(year, month - 1, day, hour || 0, minute || 0).getTime();
|
|
6
|
+
var date = new Date(filterItem.value);
|
|
7
|
+
if (showTime) {
|
|
8
|
+
date.setSeconds(0, 0);
|
|
9
|
+
} else {
|
|
10
|
+
date.setHours(0, 0, 0, 0);
|
|
11
|
+
}
|
|
12
|
+
var time = date.getTime();
|
|
17
13
|
return function (value) {
|
|
18
14
|
if (!value) {
|
|
19
15
|
return false;
|
|
@@ -24,8 +20,12 @@ function buildApplyFilterFn(filterItem, compareFn, showTime, keepHours) {
|
|
|
24
20
|
|
|
25
21
|
// Make a copy of the date to not reset the hours in the original object
|
|
26
22
|
var dateCopy = new Date(value);
|
|
27
|
-
|
|
28
|
-
|
|
23
|
+
if (showTime) {
|
|
24
|
+
dateCopy.setSeconds(0, 0);
|
|
25
|
+
} else {
|
|
26
|
+
dateCopy.setHours(0, 0, 0, 0);
|
|
27
|
+
}
|
|
28
|
+
return compareFn(dateCopy.getTime(), time);
|
|
29
29
|
};
|
|
30
30
|
}
|
|
31
31
|
export var getGridDateOperators = function getGridDateOperators(showTime) {
|
|
@@ -3,7 +3,7 @@ import _typeof from "@babel/runtime/helpers/esm/typeof";
|
|
|
3
3
|
import { GRID_STRING_COL_DEF } from './gridStringColDef';
|
|
4
4
|
import { renderEditSingleSelectCell } from '../components/cell/GridEditSingleSelectCell';
|
|
5
5
|
import { getGridSingleSelectOperators } from './gridSingleSelectOperators';
|
|
6
|
-
import { isSingleSelectColDef } from '../components/panel/filterPanel/filterPanelUtils';
|
|
6
|
+
import { getValueOptions, isSingleSelectColDef } from '../components/panel/filterPanel/filterPanelUtils';
|
|
7
7
|
import { isObject } from '../utils/utils';
|
|
8
8
|
var isArrayOfObjects = function isArrayOfObjects(options) {
|
|
9
9
|
return _typeof(options[0]) === 'object';
|
|
@@ -27,16 +27,10 @@ export var GRID_SINGLE_SELECT_COL_DEF = _extends({}, GRID_STRING_COL_DEF, {
|
|
|
27
27
|
if (!isSingleSelectColDef(colDef)) {
|
|
28
28
|
return '';
|
|
29
29
|
}
|
|
30
|
-
var valueOptions
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
row: id ? api.getRow(id) : null,
|
|
35
|
-
field: field
|
|
36
|
-
});
|
|
37
|
-
} else {
|
|
38
|
-
valueOptions = colDef.valueOptions;
|
|
39
|
-
}
|
|
30
|
+
var valueOptions = getValueOptions(colDef, {
|
|
31
|
+
id: id,
|
|
32
|
+
row: id ? api.getRow(id) : null
|
|
33
|
+
});
|
|
40
34
|
if (value == null) {
|
|
41
35
|
return '';
|
|
42
36
|
}
|
|
@@ -56,10 +50,7 @@ export var GRID_SINGLE_SELECT_COL_DEF = _extends({}, GRID_STRING_COL_DEF, {
|
|
|
56
50
|
// @ts-ignore
|
|
57
51
|
pastedValueParser: function pastedValueParser(value, params) {
|
|
58
52
|
var colDef = params.colDef;
|
|
59
|
-
var
|
|
60
|
-
var valueOptions = typeof colDefValueOptions === 'function' ? colDefValueOptions({
|
|
61
|
-
field: colDef.field
|
|
62
|
-
}) : colDefValueOptions || [];
|
|
53
|
+
var valueOptions = getValueOptions(colDef) || [];
|
|
63
54
|
var getOptionValue = colDef.getOptionValue;
|
|
64
55
|
var valueOption = valueOptions.find(function (option) {
|
|
65
56
|
if (getOptionValue(option) === value) {
|
|
@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
|
|
|
2
2
|
import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
|
|
3
3
|
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
4
4
|
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
5
|
-
var _excluded = ["id", "value", "formattedValue", "api", "field", "row", "rowNode", "colDef", "cellMode", "isEditable", "tabIndex", "className", "hasFocus", "isValidating", "isProcessingProps", "error", "onValueChange", "initialOpen"
|
|
5
|
+
var _excluded = ["id", "value", "formattedValue", "api", "field", "row", "rowNode", "colDef", "cellMode", "isEditable", "tabIndex", "className", "hasFocus", "isValidating", "isProcessingProps", "error", "onValueChange", "initialOpen"],
|
|
6
6
|
_excluded2 = ["MenuProps"];
|
|
7
7
|
import _regeneratorRuntime from "@babel/runtime/regenerator";
|
|
8
8
|
import * as React from 'react';
|
|
@@ -12,7 +12,7 @@ import { GridCellEditStopReasons } from '../../models/params/gridEditCellParams'
|
|
|
12
12
|
import { isEscapeKey } from '../../utils/keyboardUtils';
|
|
13
13
|
import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
|
|
14
14
|
import { GridEditModes } from '../../models/gridEditRowModel';
|
|
15
|
-
import { getValueFromValueOptions, isSingleSelectColDef } from '../panel/filterPanel/filterPanelUtils';
|
|
15
|
+
import { getValueFromValueOptions, getValueOptions, isSingleSelectColDef } from '../panel/filterPanel/filterPanelUtils';
|
|
16
16
|
import { useGridApiContext } from '../../hooks/utils/useGridApiContext';
|
|
17
17
|
import { createElement as _createElement } from "react";
|
|
18
18
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
@@ -41,8 +41,6 @@ function GridEditSingleSelectCell(props) {
|
|
|
41
41
|
onValueChange = props.onValueChange,
|
|
42
42
|
_props$initialOpen = props.initialOpen,
|
|
43
43
|
initialOpen = _props$initialOpen === void 0 ? rootProps.editMode === GridEditModes.Cell : _props$initialOpen,
|
|
44
|
-
getOptionLabelProp = props.getOptionLabel,
|
|
45
|
-
getOptionValueProp = props.getOptionValue,
|
|
46
44
|
other = _objectWithoutProperties(props, _excluded);
|
|
47
45
|
var apiRef = useGridApiContext();
|
|
48
46
|
var ref = React.useRef();
|
|
@@ -65,21 +63,15 @@ function GridEditSingleSelectCell(props) {
|
|
|
65
63
|
if (!isSingleSelectColDef(colDef)) {
|
|
66
64
|
return null;
|
|
67
65
|
}
|
|
68
|
-
var valueOptions
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
row: row,
|
|
73
|
-
field: field
|
|
74
|
-
});
|
|
75
|
-
} else {
|
|
76
|
-
valueOptions = colDef == null ? void 0 : colDef.valueOptions;
|
|
77
|
-
}
|
|
66
|
+
var valueOptions = getValueOptions(colDef, {
|
|
67
|
+
id: id,
|
|
68
|
+
row: row
|
|
69
|
+
});
|
|
78
70
|
if (!valueOptions) {
|
|
79
71
|
return null;
|
|
80
72
|
}
|
|
81
|
-
var getOptionValue =
|
|
82
|
-
var getOptionLabel =
|
|
73
|
+
var getOptionValue = colDef.getOptionValue;
|
|
74
|
+
var getOptionLabel = colDef.getOptionLabel;
|
|
83
75
|
var handleChange = /*#__PURE__*/function () {
|
|
84
76
|
var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(event) {
|
|
85
77
|
var target, formattedTargetValue;
|
|
@@ -190,18 +182,6 @@ process.env.NODE_ENV !== "production" ? GridEditSingleSelectCell.propTypes = {
|
|
|
190
182
|
* The cell value formatted with the column valueFormatter.
|
|
191
183
|
*/
|
|
192
184
|
formattedValue: PropTypes.any,
|
|
193
|
-
/**
|
|
194
|
-
* Used to determine the label displayed for a given value option.
|
|
195
|
-
* @param {ValueOptions} value The current value option.
|
|
196
|
-
* @returns {string} The text to be displayed.
|
|
197
|
-
*/
|
|
198
|
-
getOptionLabel: PropTypes.func,
|
|
199
|
-
/**
|
|
200
|
-
* Used to determine the value used for a value option.
|
|
201
|
-
* @param {ValueOptions} value The current value option.
|
|
202
|
-
* @returns {string} The value to be used.
|
|
203
|
-
*/
|
|
204
|
-
getOptionValue: PropTypes.func,
|
|
205
185
|
/**
|
|
206
186
|
* If true, the cell is the active element.
|
|
207
187
|
*/
|
|
@@ -5,6 +5,7 @@ var _excluded = ["field", "colDef"];
|
|
|
5
5
|
import * as React from 'react';
|
|
6
6
|
import PropTypes from 'prop-types';
|
|
7
7
|
import { unstable_composeClasses as composeClasses } from '@mui/utils';
|
|
8
|
+
import { isMultipleRowSelectionEnabled } from '../../hooks/features/rowSelection/utils';
|
|
8
9
|
import { useGridSelector } from '../../hooks/utils/useGridSelector';
|
|
9
10
|
import { gridTabIndexColumnHeaderSelector } from '../../hooks/features/focus/gridFocusStateSelector';
|
|
10
11
|
import { gridRowSelectionStateSelector } from '../../hooks/features/rowSelection/gridRowSelectionSelector';
|
|
@@ -112,7 +113,8 @@ var GridHeaderCheckbox = /*#__PURE__*/React.forwardRef(function GridHeaderCheckb
|
|
|
112
113
|
'aria-label': label
|
|
113
114
|
},
|
|
114
115
|
tabIndex: tabIndex,
|
|
115
|
-
onKeyDown: handleKeyDown
|
|
116
|
+
onKeyDown: handleKeyDown,
|
|
117
|
+
disabled: !isMultipleRowSelectionEnabled(rootProps)
|
|
116
118
|
}, (_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.baseCheckbox, other));
|
|
117
119
|
});
|
|
118
120
|
process.env.NODE_ENV !== "production" ? GridHeaderCheckbox.propTypes = {
|