@mui/x-data-grid 6.19.5 → 6.19.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.
- package/CHANGELOG.md +89 -0
- package/components/GridPagination.d.ts +6 -5
- package/components/GridPagination.js +12 -3
- package/components/cell/GridActionsCellItem.d.ts +8 -25
- package/components/cell/GridActionsCellItem.js +4 -0
- package/hooks/features/clipboard/useGridClipboard.js +4 -2
- package/hooks/features/export/serializers/csvSerializer.d.ts +2 -0
- package/hooks/features/export/serializers/csvSerializer.js +23 -12
- package/hooks/features/export/useGridCsvExport.js +3 -2
- package/hooks/features/rowSelection/useGridRowSelection.js +3 -2
- package/hooks/features/rows/useGridRows.js +8 -4
- package/index.js +1 -1
- package/legacy/components/GridPagination.js +12 -3
- package/legacy/components/cell/GridActionsCellItem.js +4 -0
- package/legacy/hooks/features/clipboard/useGridClipboard.js +4 -2
- package/legacy/hooks/features/export/serializers/csvSerializer.js +23 -12
- package/legacy/hooks/features/export/useGridCsvExport.js +3 -2
- package/legacy/hooks/features/rowSelection/useGridRowSelection.js +3 -2
- package/legacy/hooks/features/rows/useGridRows.js +8 -4
- package/legacy/index.js +1 -1
- package/models/gridExport.d.ts +6 -0
- package/modern/components/GridPagination.js +12 -3
- package/modern/components/cell/GridActionsCellItem.js +4 -0
- package/modern/hooks/features/clipboard/useGridClipboard.js +4 -2
- package/modern/hooks/features/export/serializers/csvSerializer.js +23 -12
- package/modern/hooks/features/export/useGridCsvExport.js +2 -1
- package/modern/hooks/features/rowSelection/useGridRowSelection.js +3 -2
- package/modern/hooks/features/rows/useGridRows.js +8 -4
- package/modern/index.js +1 -1
- package/node/components/GridPagination.js +10 -2
- package/node/components/cell/GridActionsCellItem.js +4 -0
- package/node/hooks/features/clipboard/useGridClipboard.js +4 -2
- package/node/hooks/features/export/serializers/csvSerializer.js +23 -12
- package/node/hooks/features/export/useGridCsvExport.js +2 -1
- package/node/hooks/features/rowSelection/useGridRowSelection.js +2 -1
- package/node/hooks/features/rows/useGridRows.js +8 -4
- package/node/index.js +1 -1
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,95 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## 6.19.8
|
|
7
|
+
|
|
8
|
+
_Mar 20, 2024_
|
|
9
|
+
|
|
10
|
+
We'd like to offer a big thanks to the 3 contributors who made this release possible.
|
|
11
|
+
|
|
12
|
+
### Data Grid
|
|
13
|
+
|
|
14
|
+
#### `@mui/x-data-grid@6.19.8`
|
|
15
|
+
|
|
16
|
+
- [DataGrid] Fix `ElementType` usage (#12505) @cherniavskii
|
|
17
|
+
- [DataGrid] Fix cell value formatting on copy (#12483) @sai6855
|
|
18
|
+
- [DataGrid] Fix checkbox selection when filtering (#12485) @g1mishra
|
|
19
|
+
|
|
20
|
+
#### `@mui/x-data-grid-pro@6.19.8` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
21
|
+
|
|
22
|
+
Same changes as in `@mui/x-data-grid@6.19.8`.
|
|
23
|
+
|
|
24
|
+
#### `@mui/x-data-grid-premium@6.19.8` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
25
|
+
|
|
26
|
+
Same changes as in `@mui/x-data-grid-pro@6.19.8`, plus:
|
|
27
|
+
|
|
28
|
+
- [DataGridPremium] Add support for confirmation before clipboard paste (#12466) @cherniavskii
|
|
29
|
+
|
|
30
|
+
### Docs
|
|
31
|
+
|
|
32
|
+
- [docs] Update links to v7 (#12495) @cherniavskii
|
|
33
|
+
|
|
34
|
+
## 6.19.7
|
|
35
|
+
|
|
36
|
+
_Mar 14, 2024_
|
|
37
|
+
|
|
38
|
+
We'd like to offer a big thanks to @LukasTy who made this release possible.
|
|
39
|
+
|
|
40
|
+
### Date Pickers
|
|
41
|
+
|
|
42
|
+
#### `@mui/x-date-pickers@6.19.7`
|
|
43
|
+
|
|
44
|
+
- [pickers] Keep the existing time when looking for closest enabled date (#12410) @LukasTy
|
|
45
|
+
|
|
46
|
+
#### `@mui/x-date-pickers-pro@6.19.7` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
47
|
+
|
|
48
|
+
Same changes as in `@mui/x-date-pickers@6.19.7`.
|
|
49
|
+
|
|
50
|
+
### Docs
|
|
51
|
+
|
|
52
|
+
- [docs] Add Pickers custom start of week section (#12425) @LukasTy
|
|
53
|
+
|
|
54
|
+
## 6.19.6
|
|
55
|
+
|
|
56
|
+
_Mar 1, 2024_
|
|
57
|
+
|
|
58
|
+
We'd like to offer a big thanks to the 4 contributors who made this release possible. Here are some highlights ✨:
|
|
59
|
+
|
|
60
|
+
- 🌍 Improve Korean (ko-KR) and Chinese (zh-CN) locales on the Pickers
|
|
61
|
+
- 🐞 Bugfixes
|
|
62
|
+
- 📚 Documentation improvements
|
|
63
|
+
|
|
64
|
+
### Data Grid
|
|
65
|
+
|
|
66
|
+
#### `@mui/x-data-grid@6.19.6`
|
|
67
|
+
|
|
68
|
+
- [DataGrid] Fix error when existing rows are passed to `replaceRows` (@martijn-basesoft)
|
|
69
|
+
|
|
70
|
+
#### `@mui/x-data-grid-pro@6.19.6` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
71
|
+
|
|
72
|
+
Same changes as in `@mui/x-data-grid@6.19.6`.
|
|
73
|
+
|
|
74
|
+
#### `@mui/x-data-grid-premium@6.19.6` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
75
|
+
|
|
76
|
+
Same changes as in `@mui/x-data-grid-pro@6.19.6`, plus:
|
|
77
|
+
|
|
78
|
+
- [DataGridPremium] Make clipboard copy respect the sorting during cell selection (#12255) @MBilalShafi
|
|
79
|
+
|
|
80
|
+
### Date Pickers
|
|
81
|
+
|
|
82
|
+
#### `@mui/x-date-pickers@6.19.6`
|
|
83
|
+
|
|
84
|
+
- [l10n] Improve Chinese (zh-CN) locale (#12250) @headironc
|
|
85
|
+
- [l10n] Improve Korean (ko-KR) locale (#12186) @Luzi
|
|
86
|
+
|
|
87
|
+
#### `@mui/x-date-pickers-pro@6.19.6` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
88
|
+
|
|
89
|
+
Same changes as in `@mui/x-date-pickers@6.19.6`.
|
|
90
|
+
|
|
91
|
+
### Docs
|
|
92
|
+
|
|
93
|
+
- [docs] Update lazy loading demo to show skeleton rows during initial rows fetch (#12062) @cherniavskii
|
|
94
|
+
|
|
6
95
|
## 6.19.5
|
|
7
96
|
|
|
8
97
|
_Feb 23, 2024_
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
2
|
+
import { TablePaginationProps } from '@mui/material/TablePagination';
|
|
3
|
+
interface GridPaginationOwnProps {
|
|
4
|
+
component?: React.ElementType;
|
|
5
|
+
}
|
|
6
|
+
declare const GridPagination: React.ForwardRefExoticComponent<Omit<Partial<Omit<TablePaginationProps, "component">> & GridPaginationOwnProps, "ref"> & React.RefAttributes<unknown>>;
|
|
7
|
+
export { GridPagination };
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
2
|
import * as React from 'react';
|
|
3
|
+
import PropTypes from 'prop-types';
|
|
3
4
|
import TablePagination, { tablePaginationClasses } from '@mui/material/TablePagination';
|
|
4
5
|
import { styled } from '@mui/material/styles';
|
|
5
6
|
import { useGridSelector } from '../hooks/utils/useGridSelector';
|
|
@@ -27,7 +28,7 @@ const GridPaginationRoot = styled(TablePagination)(({
|
|
|
27
28
|
|
|
28
29
|
// A mutable version of a readonly array.
|
|
29
30
|
|
|
30
|
-
|
|
31
|
+
const GridPagination = /*#__PURE__*/React.forwardRef(function GridPagination(props, ref) {
|
|
31
32
|
const apiRef = useGridApiContext();
|
|
32
33
|
const rootProps = useGridRootProps();
|
|
33
34
|
const paginationModel = useGridSelector(apiRef, gridPaginationModelSelector);
|
|
@@ -63,7 +64,7 @@ export const GridPagination = /*#__PURE__*/React.forwardRef(function GridPaginat
|
|
|
63
64
|
const warnedOnceMissingInPageSizeOptions = React.useRef(false);
|
|
64
65
|
const pageSize = (_rootProps$pagination = (_rootProps$pagination2 = rootProps.paginationModel) == null ? void 0 : _rootProps$pagination2.pageSize) != null ? _rootProps$pagination : paginationModel.pageSize;
|
|
65
66
|
if (!warnedOnceMissingInPageSizeOptions.current && !rootProps.autoPageSize && !isPageSizeIncludedInPageSizeOptions(pageSize)) {
|
|
66
|
-
console.warn([`MUI: The page size \`${paginationModel.pageSize}\` is not preset in the \`pageSizeOptions
|
|
67
|
+
console.warn([`MUI X: The page size \`${paginationModel.pageSize}\` is not preset in the \`pageSizeOptions\`.`, `Add it to show the pagination select.`].join('\n'));
|
|
67
68
|
warnedOnceMissingInPageSizeOptions.current = true;
|
|
68
69
|
}
|
|
69
70
|
}
|
|
@@ -82,4 +83,12 @@ export const GridPagination = /*#__PURE__*/React.forwardRef(function GridPaginat
|
|
|
82
83
|
onPageChange: handlePageChange,
|
|
83
84
|
onRowsPerPageChange: handlePageSizeChange
|
|
84
85
|
}, apiRef.current.getLocaleText('MuiTablePagination'), props));
|
|
85
|
-
});
|
|
86
|
+
});
|
|
87
|
+
process.env.NODE_ENV !== "production" ? GridPagination.propTypes = {
|
|
88
|
+
// ----------------------------- Warning --------------------------------
|
|
89
|
+
// | These PropTypes are generated from the TypeScript type definitions |
|
|
90
|
+
// | To update them edit the TypeScript types and run "yarn proptypes" |
|
|
91
|
+
// ----------------------------------------------------------------------
|
|
92
|
+
component: PropTypes.elementType
|
|
93
|
+
} : void 0;
|
|
94
|
+
export { GridPagination };
|
|
@@ -1,15 +1,16 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { IconButtonProps } from '@mui/material/IconButton';
|
|
3
3
|
import { MenuItemProps } from '@mui/material/MenuItem';
|
|
4
|
-
|
|
4
|
+
interface GridActionsCellItemCommonProps {
|
|
5
5
|
label: string;
|
|
6
6
|
icon?: React.ReactElement;
|
|
7
7
|
/** from https://mui.com/material-ui/api/button-base/#ButtonBase-prop-component */
|
|
8
8
|
component?: React.ElementType;
|
|
9
|
-
}
|
|
9
|
+
}
|
|
10
|
+
export type GridActionsCellItemProps = GridActionsCellItemCommonProps & (({
|
|
10
11
|
showInMenu?: false;
|
|
11
12
|
icon: React.ReactElement;
|
|
12
|
-
} & IconButtonProps) | ({
|
|
13
|
+
} & Omit<IconButtonProps, 'component'>) | ({
|
|
13
14
|
showInMenu: true;
|
|
14
15
|
/**
|
|
15
16
|
* If false, the menu will not close when this item is clicked.
|
|
@@ -17,25 +18,11 @@ export type GridActionsCellItemProps = {
|
|
|
17
18
|
*/
|
|
18
19
|
closeMenuOnClick?: boolean;
|
|
19
20
|
closeMenu?: () => void;
|
|
20
|
-
} & MenuItemProps));
|
|
21
|
-
declare const GridActionsCellItem: React.ForwardRefExoticComponent<(Omit<{
|
|
22
|
-
label: string;
|
|
23
|
-
icon?: React.ReactElement<any, string | React.JSXElementConstructor<any>> | undefined;
|
|
24
|
-
/** from https://mui.com/material-ui/api/button-base/#ButtonBase-prop-component */
|
|
25
|
-
component?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
|
|
26
|
-
} & {
|
|
21
|
+
} & Omit<MenuItemProps, 'component'>));
|
|
22
|
+
declare const GridActionsCellItem: React.ForwardRefExoticComponent<(Omit<GridActionsCellItemCommonProps & {
|
|
27
23
|
showInMenu?: false | undefined;
|
|
28
24
|
icon: React.ReactElement;
|
|
29
|
-
} &
|
|
30
|
-
ref?: ((instance: HTMLButtonElement | null) => void) | React.RefObject<HTMLButtonElement> | null | undefined;
|
|
31
|
-
}, "color" | "size" | "style" | "disabled" | "action" | "className" | "tabIndex" | "children" | "sx" | "classes" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "edge"> & {
|
|
32
|
-
component?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
|
|
33
|
-
}, "ref"> | Omit<{
|
|
34
|
-
label: string;
|
|
35
|
-
icon?: React.ReactElement<any, string | React.JSXElementConstructor<any>> | undefined;
|
|
36
|
-
/** from https://mui.com/material-ui/api/button-base/#ButtonBase-prop-component */
|
|
37
|
-
component?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
|
|
38
|
-
} & {
|
|
25
|
+
} & Omit<IconButtonProps, "component">, "ref"> | Omit<GridActionsCellItemCommonProps & {
|
|
39
26
|
showInMenu: true;
|
|
40
27
|
/**
|
|
41
28
|
* If false, the menu will not close when this item is clicked.
|
|
@@ -43,9 +30,5 @@ declare const GridActionsCellItem: React.ForwardRefExoticComponent<(Omit<{
|
|
|
43
30
|
*/
|
|
44
31
|
closeMenuOnClick?: boolean | undefined;
|
|
45
32
|
closeMenu?: (() => void) | undefined;
|
|
46
|
-
} &
|
|
47
|
-
ref?: ((instance: HTMLLIElement | null) => void) | React.RefObject<HTMLLIElement> | null | undefined;
|
|
48
|
-
}, "style" | "dense" | "disabled" | "action" | "selected" | "autoFocus" | "className" | "tabIndex" | "children" | "sx" | "classes" | "disableGutters" | "divider" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef"> & {
|
|
49
|
-
component?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
|
|
50
|
-
}, "ref">) & React.RefAttributes<HTMLElement>>;
|
|
33
|
+
} & Omit<MenuItemProps, "component">, "ref">) & React.RefAttributes<HTMLElement>>;
|
|
51
34
|
export { GridActionsCellItem };
|
|
@@ -63,6 +63,10 @@ process.env.NODE_ENV !== "production" ? GridActionsCellItem.propTypes = {
|
|
|
63
63
|
// | These PropTypes are generated from the TypeScript type definitions |
|
|
64
64
|
// | To update them edit the TypeScript types and run "yarn proptypes" |
|
|
65
65
|
// ----------------------------------------------------------------------
|
|
66
|
+
/**
|
|
67
|
+
* from https://mui.com/material-ui/api/button-base/#ButtonBase-prop-component
|
|
68
|
+
*/
|
|
69
|
+
component: PropTypes.elementType,
|
|
66
70
|
icon: PropTypes.element,
|
|
67
71
|
label: PropTypes.string.isRequired,
|
|
68
72
|
showInMenu: PropTypes.bool
|
|
@@ -68,7 +68,8 @@ export const useGridClipboard = (apiRef, props) => {
|
|
|
68
68
|
textToCopy = apiRef.current.getDataAsCsv({
|
|
69
69
|
includeHeaders: false,
|
|
70
70
|
// TODO: make it configurable
|
|
71
|
-
delimiter: clipboardCopyCellDelimiter
|
|
71
|
+
delimiter: clipboardCopyCellDelimiter,
|
|
72
|
+
shouldAppendQuotes: false
|
|
72
73
|
});
|
|
73
74
|
} else {
|
|
74
75
|
const focusedCell = gridFocusCellSelector(apiRef);
|
|
@@ -76,7 +77,8 @@ export const useGridClipboard = (apiRef, props) => {
|
|
|
76
77
|
const cellParams = apiRef.current.getCellParams(focusedCell.id, focusedCell.field);
|
|
77
78
|
textToCopy = serializeCellValue(cellParams, {
|
|
78
79
|
delimiterCharacter: clipboardCopyCellDelimiter,
|
|
79
|
-
ignoreValueFormatter
|
|
80
|
+
ignoreValueFormatter,
|
|
81
|
+
shouldAppendQuotes: false
|
|
80
82
|
});
|
|
81
83
|
}
|
|
82
84
|
}
|
|
@@ -6,6 +6,7 @@ import type { GridApiCommunity } from '../../../../models/api/gridApiCommunity';
|
|
|
6
6
|
export declare const serializeCellValue: (cellParams: GridCellParams, options: {
|
|
7
7
|
delimiterCharacter: string;
|
|
8
8
|
ignoreValueFormatter: boolean;
|
|
9
|
+
shouldAppendQuotes: boolean;
|
|
9
10
|
}) => any;
|
|
10
11
|
interface BuildCSVOptions {
|
|
11
12
|
columns: GridStateColDef[];
|
|
@@ -15,6 +16,7 @@ interface BuildCSVOptions {
|
|
|
15
16
|
includeColumnGroupsHeaders: NonNullable<GridCsvExportOptions['includeColumnGroupsHeaders']>;
|
|
16
17
|
ignoreValueFormatter: boolean;
|
|
17
18
|
apiRef: React.MutableRefObject<GridApiCommunity>;
|
|
19
|
+
shouldAppendQuotes: boolean;
|
|
18
20
|
}
|
|
19
21
|
export declare function buildCSV(options: BuildCSVOptions): string;
|
|
20
22
|
export {};
|
|
@@ -1,10 +1,13 @@
|
|
|
1
1
|
import { GRID_CHECKBOX_SELECTION_COL_DEF } from '../../../../colDef';
|
|
2
2
|
import { buildWarning } from '../../../../utils/warning';
|
|
3
|
-
function sanitizeCellValue(value, delimiterCharacter) {
|
|
3
|
+
function sanitizeCellValue(value, delimiterCharacter, shouldAppendQuotes) {
|
|
4
4
|
if (typeof value === 'string') {
|
|
5
5
|
// Make sure value containing delimiter or line break won't be split into multiple rows
|
|
6
6
|
if ([delimiterCharacter, '\n', '\r', '"'].some(delimiter => value.includes(delimiter))) {
|
|
7
|
-
|
|
7
|
+
if (shouldAppendQuotes) {
|
|
8
|
+
return `"${value.replace(/"/g, '""')}"`;
|
|
9
|
+
}
|
|
10
|
+
return `${value.replace(/"/g, '""')}`;
|
|
8
11
|
}
|
|
9
12
|
return value;
|
|
10
13
|
}
|
|
@@ -13,7 +16,8 @@ function sanitizeCellValue(value, delimiterCharacter) {
|
|
|
13
16
|
export const serializeCellValue = (cellParams, options) => {
|
|
14
17
|
const {
|
|
15
18
|
delimiterCharacter,
|
|
16
|
-
ignoreValueFormatter
|
|
19
|
+
ignoreValueFormatter,
|
|
20
|
+
shouldAppendQuotes
|
|
17
21
|
} = options;
|
|
18
22
|
let value;
|
|
19
23
|
if (ignoreValueFormatter) {
|
|
@@ -32,7 +36,7 @@ export const serializeCellValue = (cellParams, options) => {
|
|
|
32
36
|
} else {
|
|
33
37
|
value = cellParams.formattedValue;
|
|
34
38
|
}
|
|
35
|
-
return sanitizeCellValue(value, delimiterCharacter);
|
|
39
|
+
return sanitizeCellValue(value, delimiterCharacter, shouldAppendQuotes);
|
|
36
40
|
};
|
|
37
41
|
const objectFormattedValueWarning = buildWarning(['MUI: When the value of a field is an object or a `renderCell` is provided, the CSV export might not display the value correctly.', 'You can provide a `valueFormatter` with a string representation to be used.']);
|
|
38
42
|
class CSVRow {
|
|
@@ -49,7 +53,7 @@ class CSVRow {
|
|
|
49
53
|
if (value === null || value === undefined) {
|
|
50
54
|
this.rowString += '';
|
|
51
55
|
} else if (typeof this.options.sanitizeCellValue === 'function') {
|
|
52
|
-
this.rowString += this.options.sanitizeCellValue(value, this.options.delimiterCharacter);
|
|
56
|
+
this.rowString += this.options.sanitizeCellValue(value, this.options.delimiterCharacter, this.options.shouldAppendQuotes);
|
|
53
57
|
} else {
|
|
54
58
|
this.rowString += value;
|
|
55
59
|
}
|
|
@@ -64,10 +68,12 @@ const serializeRow = ({
|
|
|
64
68
|
columns,
|
|
65
69
|
getCellParams,
|
|
66
70
|
delimiterCharacter,
|
|
67
|
-
ignoreValueFormatter
|
|
71
|
+
ignoreValueFormatter,
|
|
72
|
+
shouldAppendQuotes
|
|
68
73
|
}) => {
|
|
69
74
|
const row = new CSVRow({
|
|
70
|
-
delimiterCharacter
|
|
75
|
+
delimiterCharacter,
|
|
76
|
+
shouldAppendQuotes
|
|
71
77
|
});
|
|
72
78
|
columns.forEach(column => {
|
|
73
79
|
const cellParams = getCellParams(id, column.field);
|
|
@@ -78,7 +84,8 @@ const serializeRow = ({
|
|
|
78
84
|
}
|
|
79
85
|
row.addValue(serializeCellValue(cellParams, {
|
|
80
86
|
delimiterCharacter,
|
|
81
|
-
ignoreValueFormatter
|
|
87
|
+
ignoreValueFormatter,
|
|
88
|
+
shouldAppendQuotes
|
|
82
89
|
}));
|
|
83
90
|
});
|
|
84
91
|
return row.getRowString();
|
|
@@ -91,14 +98,16 @@ export function buildCSV(options) {
|
|
|
91
98
|
includeHeaders,
|
|
92
99
|
includeColumnGroupsHeaders,
|
|
93
100
|
ignoreValueFormatter,
|
|
94
|
-
apiRef
|
|
101
|
+
apiRef,
|
|
102
|
+
shouldAppendQuotes
|
|
95
103
|
} = options;
|
|
96
104
|
const CSVBody = rowIds.reduce((acc, id) => `${acc}${serializeRow({
|
|
97
105
|
id,
|
|
98
106
|
columns,
|
|
99
107
|
getCellParams: apiRef.current.getCellParams,
|
|
100
108
|
delimiterCharacter,
|
|
101
|
-
ignoreValueFormatter
|
|
109
|
+
ignoreValueFormatter,
|
|
110
|
+
shouldAppendQuotes
|
|
102
111
|
})}\r\n`, '').trim();
|
|
103
112
|
if (!includeHeaders) {
|
|
104
113
|
return CSVBody;
|
|
@@ -117,7 +126,8 @@ export function buildCSV(options) {
|
|
|
117
126
|
for (let i = 0; i < maxColumnGroupsDepth; i += 1) {
|
|
118
127
|
const headerGroupRow = new CSVRow({
|
|
119
128
|
delimiterCharacter,
|
|
120
|
-
sanitizeCellValue
|
|
129
|
+
sanitizeCellValue,
|
|
130
|
+
shouldAppendQuotes
|
|
121
131
|
});
|
|
122
132
|
headerRows.push(headerGroupRow);
|
|
123
133
|
filteredColumns.forEach(column => {
|
|
@@ -129,7 +139,8 @@ export function buildCSV(options) {
|
|
|
129
139
|
}
|
|
130
140
|
const mainHeaderRow = new CSVRow({
|
|
131
141
|
delimiterCharacter,
|
|
132
|
-
sanitizeCellValue
|
|
142
|
+
sanitizeCellValue,
|
|
143
|
+
shouldAppendQuotes
|
|
133
144
|
});
|
|
134
145
|
filteredColumns.forEach(column => {
|
|
135
146
|
mainHeaderRow.addValue(column.headerName || column.field);
|
|
@@ -19,7 +19,7 @@ export const useGridCsvExport = (apiRef, props) => {
|
|
|
19
19
|
const ignoreValueFormatterProp = props.unstable_ignoreValueFormatterDuringExport;
|
|
20
20
|
const ignoreValueFormatter = (typeof ignoreValueFormatterProp === 'object' ? ignoreValueFormatterProp == null ? void 0 : ignoreValueFormatterProp.csvExport : ignoreValueFormatterProp) || false;
|
|
21
21
|
const getDataAsCsv = React.useCallback((options = {}) => {
|
|
22
|
-
var _options$getRowsToExp, _options$includeHeade, _options$includeColum;
|
|
22
|
+
var _options$getRowsToExp, _options$includeHeade, _options$includeColum, _options$shouldAppend;
|
|
23
23
|
logger.debug(`Get data as CSV`);
|
|
24
24
|
const exportedColumns = getColumnsToExport({
|
|
25
25
|
apiRef,
|
|
@@ -36,7 +36,8 @@ export const useGridCsvExport = (apiRef, props) => {
|
|
|
36
36
|
includeHeaders: (_options$includeHeade = options.includeHeaders) != null ? _options$includeHeade : true,
|
|
37
37
|
includeColumnGroupsHeaders: (_options$includeColum = options.includeColumnGroupsHeaders) != null ? _options$includeColum : true,
|
|
38
38
|
ignoreValueFormatter,
|
|
39
|
-
apiRef
|
|
39
|
+
apiRef,
|
|
40
|
+
shouldAppendQuotes: (_options$shouldAppend = options.shouldAppendQuotes) != null ? _options$shouldAppend : true
|
|
40
41
|
});
|
|
41
42
|
}, [logger, apiRef, ignoreValueFormatter]);
|
|
42
43
|
const exportDataAsCsv = React.useCallback(options => {
|
|
@@ -7,7 +7,7 @@ import { gridRowsLookupSelector } from '../rows/gridRowsSelector';
|
|
|
7
7
|
import { gridRowSelectionStateSelector, selectedGridRowsSelector, selectedIdsLookupSelector } from './gridRowSelectionSelector';
|
|
8
8
|
import { gridPaginatedVisibleSortedGridRowIdsSelector } from '../pagination';
|
|
9
9
|
import { gridFocusCellSelector } from '../focus/gridFocusStateSelector';
|
|
10
|
-
import { gridExpandedSortedRowIdsSelector } from '../filter/gridFilterSelector';
|
|
10
|
+
import { gridExpandedSortedRowIdsSelector, gridFilterModelSelector } from '../filter/gridFilterSelector';
|
|
11
11
|
import { GRID_CHECKBOX_SELECTION_COL_DEF, GRID_ACTIONS_COLUMN_TYPE } from '../../../colDef';
|
|
12
12
|
import { GridCellModes } from '../../../models/gridEditRowModel';
|
|
13
13
|
import { isKeyboardEvent, isNavigationKey } from '../../../utils/keyboardUtils';
|
|
@@ -280,7 +280,8 @@ export const useGridRowSelection = (apiRef, props) => {
|
|
|
280
280
|
const handleHeaderSelectionCheckboxChange = React.useCallback(params => {
|
|
281
281
|
const shouldLimitSelectionToCurrentPage = props.checkboxSelectionVisibleOnly && props.pagination;
|
|
282
282
|
const rowsToBeSelected = shouldLimitSelectionToCurrentPage ? gridPaginatedVisibleSortedGridRowIdsSelector(apiRef) : gridExpandedSortedRowIdsSelector(apiRef);
|
|
283
|
-
apiRef
|
|
283
|
+
const filterModel = gridFilterModelSelector(apiRef);
|
|
284
|
+
apiRef.current.selectRows(rowsToBeSelected, params.value, (filterModel == null ? void 0 : filterModel.items.length) > 0);
|
|
284
285
|
}, [apiRef, props.checkboxSelectionVisibleOnly, props.pagination]);
|
|
285
286
|
const handleCellKeyDown = React.useCallback((params, event) => {
|
|
286
287
|
// Get the most recent cell mode because it may have been changed by another listener
|
|
@@ -266,13 +266,16 @@ export const useGridRows = (apiRef, props) => {
|
|
|
266
266
|
const dataRowIdToIdLookup = _extends({}, gridRowsDataRowIdToIdLookupSelector(apiRef));
|
|
267
267
|
const rootGroup = tree[GRID_ROOT_GROUP_ID];
|
|
268
268
|
const rootGroupChildren = [...rootGroup.children];
|
|
269
|
+
const seenIds = new Set();
|
|
269
270
|
for (let i = 0; i < newRows.length; i += 1) {
|
|
270
271
|
const rowModel = newRows[i];
|
|
271
272
|
const rowId = getRowIdFromRowModel(rowModel, props.getRowId, 'A row was provided without id when calling replaceRows().');
|
|
272
|
-
const [
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
273
|
+
const [removedRowId] = rootGroupChildren.splice(firstRowToRender + i, 1, rowId);
|
|
274
|
+
if (!seenIds.has(removedRowId)) {
|
|
275
|
+
delete dataRowIdToModelLookup[removedRowId];
|
|
276
|
+
delete dataRowIdToIdLookup[removedRowId];
|
|
277
|
+
delete tree[removedRowId];
|
|
278
|
+
}
|
|
276
279
|
const rowTreeNodeConfig = {
|
|
277
280
|
id: rowId,
|
|
278
281
|
depth: 0,
|
|
@@ -283,6 +286,7 @@ export const useGridRows = (apiRef, props) => {
|
|
|
283
286
|
dataRowIdToModelLookup[rowId] = rowModel;
|
|
284
287
|
dataRowIdToIdLookup[rowId] = rowId;
|
|
285
288
|
tree[rowId] = rowTreeNodeConfig;
|
|
289
|
+
seenIds.add(rowId);
|
|
286
290
|
}
|
|
287
291
|
tree[GRID_ROOT_GROUP_ID] = _extends({}, rootGroup, {
|
|
288
292
|
children: rootGroupChildren
|
package/index.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
2
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
3
3
|
import * as React from 'react';
|
|
4
|
+
import PropTypes from 'prop-types';
|
|
4
5
|
import TablePagination, { tablePaginationClasses } from '@mui/material/TablePagination';
|
|
5
6
|
import { styled } from '@mui/material/styles';
|
|
6
7
|
import { useGridSelector } from '../hooks/utils/useGridSelector';
|
|
@@ -24,7 +25,7 @@ var GridPaginationRoot = styled(TablePagination)(function (_ref) {
|
|
|
24
25
|
|
|
25
26
|
// A mutable version of a readonly array.
|
|
26
27
|
|
|
27
|
-
|
|
28
|
+
var GridPagination = /*#__PURE__*/React.forwardRef(function GridPagination(props, ref) {
|
|
28
29
|
var apiRef = useGridApiContext();
|
|
29
30
|
var rootProps = useGridRootProps();
|
|
30
31
|
var paginationModel = useGridSelector(apiRef, gridPaginationModelSelector);
|
|
@@ -62,7 +63,7 @@ export var GridPagination = /*#__PURE__*/React.forwardRef(function GridPaginatio
|
|
|
62
63
|
var warnedOnceMissingInPageSizeOptions = React.useRef(false);
|
|
63
64
|
var pageSize = (_rootProps$pagination = (_rootProps$pagination2 = rootProps.paginationModel) == null ? void 0 : _rootProps$pagination2.pageSize) != null ? _rootProps$pagination : paginationModel.pageSize;
|
|
64
65
|
if (!warnedOnceMissingInPageSizeOptions.current && !rootProps.autoPageSize && !isPageSizeIncludedInPageSizeOptions(pageSize)) {
|
|
65
|
-
console.warn(["MUI: The page size `".concat(paginationModel.pageSize, "` is not preset in the `pageSizeOptions
|
|
66
|
+
console.warn(["MUI X: The page size `".concat(paginationModel.pageSize, "` is not preset in the `pageSizeOptions`."), "Add it to show the pagination select."].join('\n'));
|
|
66
67
|
warnedOnceMissingInPageSizeOptions.current = true;
|
|
67
68
|
}
|
|
68
69
|
}
|
|
@@ -81,4 +82,12 @@ export var GridPagination = /*#__PURE__*/React.forwardRef(function GridPaginatio
|
|
|
81
82
|
onPageChange: handlePageChange,
|
|
82
83
|
onRowsPerPageChange: handlePageSizeChange
|
|
83
84
|
}, apiRef.current.getLocaleText('MuiTablePagination'), props));
|
|
84
|
-
});
|
|
85
|
+
});
|
|
86
|
+
process.env.NODE_ENV !== "production" ? GridPagination.propTypes = {
|
|
87
|
+
// ----------------------------- Warning --------------------------------
|
|
88
|
+
// | These PropTypes are generated from the TypeScript type definitions |
|
|
89
|
+
// | To update them edit the TypeScript types and run "yarn proptypes" |
|
|
90
|
+
// ----------------------------------------------------------------------
|
|
91
|
+
component: PropTypes.elementType
|
|
92
|
+
} : void 0;
|
|
93
|
+
export { GridPagination };
|
|
@@ -62,6 +62,10 @@ process.env.NODE_ENV !== "production" ? GridActionsCellItem.propTypes = {
|
|
|
62
62
|
// | These PropTypes are generated from the TypeScript type definitions |
|
|
63
63
|
// | To update them edit the TypeScript types and run "yarn proptypes" |
|
|
64
64
|
// ----------------------------------------------------------------------
|
|
65
|
+
/**
|
|
66
|
+
* from https://mui.com/material-ui/api/button-base/#ButtonBase-prop-component
|
|
67
|
+
*/
|
|
68
|
+
component: PropTypes.elementType,
|
|
65
69
|
icon: PropTypes.element,
|
|
66
70
|
label: PropTypes.string.isRequired,
|
|
67
71
|
showInMenu: PropTypes.bool
|
|
@@ -69,7 +69,8 @@ export var useGridClipboard = function useGridClipboard(apiRef, props) {
|
|
|
69
69
|
textToCopy = apiRef.current.getDataAsCsv({
|
|
70
70
|
includeHeaders: false,
|
|
71
71
|
// TODO: make it configurable
|
|
72
|
-
delimiter: clipboardCopyCellDelimiter
|
|
72
|
+
delimiter: clipboardCopyCellDelimiter,
|
|
73
|
+
shouldAppendQuotes: false
|
|
73
74
|
});
|
|
74
75
|
} else {
|
|
75
76
|
var focusedCell = gridFocusCellSelector(apiRef);
|
|
@@ -77,7 +78,8 @@ export var useGridClipboard = function useGridClipboard(apiRef, props) {
|
|
|
77
78
|
var cellParams = apiRef.current.getCellParams(focusedCell.id, focusedCell.field);
|
|
78
79
|
textToCopy = serializeCellValue(cellParams, {
|
|
79
80
|
delimiterCharacter: clipboardCopyCellDelimiter,
|
|
80
|
-
ignoreValueFormatter: ignoreValueFormatter
|
|
81
|
+
ignoreValueFormatter: ignoreValueFormatter,
|
|
82
|
+
shouldAppendQuotes: false
|
|
81
83
|
});
|
|
82
84
|
}
|
|
83
85
|
}
|