@mui/x-data-grid 8.27.5 → 8.28.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +78 -0
- package/components/containers/GridRootStyles.js +2 -6
- package/constants/gridClasses.d.ts +16 -0
- package/constants/gridClasses.js +21 -4
- package/constants/index.d.ts +1 -1
- package/constants/index.js +19 -10
- package/esm/components/containers/GridRootStyles.js +3 -7
- package/esm/constants/gridClasses.d.ts +16 -0
- package/esm/constants/gridClasses.js +20 -3
- package/esm/constants/index.d.ts +1 -1
- package/esm/constants/index.js +1 -1
- package/esm/index.js +1 -1
- package/index.js +1 -1
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -5,6 +5,84 @@
|
|
|
5
5
|
All notable changes to this project will be documented in this file.
|
|
6
6
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
7
7
|
|
|
8
|
+
## 8.28.0
|
|
9
|
+
|
|
10
|
+
_Mar 19, 2026_
|
|
11
|
+
|
|
12
|
+
We'd like to extend a big thank you to the 5 contributors who made this release possible. Here are some highlights ✨:
|
|
13
|
+
|
|
14
|
+
TODO INSERT HIGHLIGHTS
|
|
15
|
+
|
|
16
|
+
The following team members contributed to this release:
|
|
17
|
+
@alexfauquette, @brijeshb42, @Janpot, @JCQuintas, @sai6855
|
|
18
|
+
|
|
19
|
+
### Data Grid
|
|
20
|
+
|
|
21
|
+
#### `@mui/x-data-grid@8.28.0`
|
|
22
|
+
|
|
23
|
+
- [DataGrid] Move `elementOverrides` to constants and remove duplicates (@sai6855) (#21752) @github-actions[bot]
|
|
24
|
+
|
|
25
|
+
#### `@mui/x-data-grid-pro@8.28.0` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
26
|
+
|
|
27
|
+
Same changes as in `@mui/x-data-grid@8.28.0`.
|
|
28
|
+
|
|
29
|
+
#### `@mui/x-data-grid-premium@8.28.0` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
30
|
+
|
|
31
|
+
Same changes as in `@mui/x-data-grid-pro@8.28.0`.
|
|
32
|
+
|
|
33
|
+
### Date and Time Pickers
|
|
34
|
+
|
|
35
|
+
#### `@mui/x-date-pickers@8.27.2`
|
|
36
|
+
|
|
37
|
+
Internal changes.
|
|
38
|
+
|
|
39
|
+
#### `@mui/x-date-pickers-pro@8.27.2` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
40
|
+
|
|
41
|
+
Same changes as in `@mui/x-date-pickers@8.27.2`.
|
|
42
|
+
|
|
43
|
+
### Charts
|
|
44
|
+
|
|
45
|
+
#### `@mui/x-charts@8.28.0`
|
|
46
|
+
|
|
47
|
+
- [charts] Improve deprecation warnings (#21760) (#21767) @alexfauquette
|
|
48
|
+
- [charts] Refactor `FunnelChart` classes structure (@JCQuintas) (#21763) @github-actions[bot]
|
|
49
|
+
- [charts] Refactor `Heatmap` classes structure (#21653) (#21745) @JCQuintas
|
|
50
|
+
- [charts] Refactor `PieChart` classes structure (@JCQuintas) (#21715) @github-actions[bot]
|
|
51
|
+
- [charts] Refactor `RadarChart` classes structure (@JCQuintas) (#21730) @github-actions[bot]
|
|
52
|
+
- [charts] Refactor `SankeyChart` classes structure (#21654) (#21726) @JCQuintas
|
|
53
|
+
- [charts] Rename `data-series-id` by `data-series` (#21761) (#21772) @alexfauquette
|
|
54
|
+
|
|
55
|
+
#### `@mui/x-charts-pro@8.28.0` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
56
|
+
|
|
57
|
+
Same changes as in `@mui/x-charts@8.28.0`, plus:
|
|
58
|
+
|
|
59
|
+
- [charts-pro] Allow `brush` interaction to accept `requiredKeys/pointerMode` (#21723) @JCQuintas
|
|
60
|
+
|
|
61
|
+
#### `@mui/x-charts-premium@8.28.0` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
62
|
+
|
|
63
|
+
Same changes as in `@mui/x-charts-pro@8.28.0`.
|
|
64
|
+
|
|
65
|
+
### Tree View
|
|
66
|
+
|
|
67
|
+
#### `@mui/x-tree-view@8.27.2`
|
|
68
|
+
|
|
69
|
+
Internal changes.
|
|
70
|
+
|
|
71
|
+
#### `@mui/x-tree-view-pro@8.27.2` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
72
|
+
|
|
73
|
+
Same changes as in `@mui/x-tree-view@8.27.2`.
|
|
74
|
+
|
|
75
|
+
### Codemod
|
|
76
|
+
|
|
77
|
+
#### `@mui/x-codemod@8.27.0`
|
|
78
|
+
|
|
79
|
+
Internal changes.
|
|
80
|
+
|
|
81
|
+
### Core
|
|
82
|
+
|
|
83
|
+
- [code-infra] Fix contributor generation in changelog (#21712) @brijeshb42
|
|
84
|
+
- [code-infra] Install pkg-pr-new (#21778) @Janpot
|
|
85
|
+
|
|
8
86
|
## 8.27.5
|
|
9
87
|
|
|
10
88
|
_Mar 11, 2026_
|
|
@@ -22,17 +22,13 @@ const separatorIconDragStyles = {
|
|
|
22
22
|
// https://github.com/emotion-js/emotion/issues/1105#issuecomment-1722524968
|
|
23
23
|
const ignoreSsrWarning = '/* emotion-disable-server-rendering-unsafe-selector-warning-please-do-not-use-this-the-warning-exists-for-a-reason */';
|
|
24
24
|
const shouldShowBorderTopRightRadiusSelector = apiRef => !apiRef.current.state.dimensions.isReady ? apiRef.current.state.dimensions.scrollbarSize === 0 : apiRef.current.state.dimensions.hasScrollX && (!apiRef.current.state.dimensions.hasScrollY || apiRef.current.state.dimensions.scrollbarSize === 0);
|
|
25
|
-
const elementOverrides = {
|
|
26
|
-
root: ['autoHeight', 'autosizing', 'root--densityStandard', 'root--densityComfortable', 'root--densityCompact', 'root--disableUserSelection', 'root--noToolbar', 'withVerticalBorder'],
|
|
27
|
-
children: ['actionsCell', 'booleanCell', 'cell', 'cell--editable', 'cell--editing', 'cell--flex', 'cell--pinnedLeft', 'cell--pinnedRight', 'cell--rangeBottom', 'cell--rangeLeft', 'cell--rangeRight', 'cell--rangeTop', 'cell--selectionMode', 'cell--textCenter', 'cell--textLeft', 'cell--textRight', 'cell--withLeftBorder', 'cell--withRightBorder', 'cellCheckbox', 'cellEmpty', 'cellOffsetLeft', 'cellSkeleton', 'checkboxInput', 'columnHeader', 'columnHeader--alignCenter', 'columnHeader--alignLeft', 'columnHeader--alignRight', 'columnHeader--dragging', 'columnHeader--emptyGroup', 'columnHeader--filledGroup', 'columnHeader--filtered', 'columnHeader--last', 'columnHeader--moving', 'columnHeader--numeric', 'columnHeader--pinnedLeft', 'columnHeader--pinnedRight', 'columnHeader--siblingFocused', 'columnHeader--sortable', 'columnHeader--sorted', 'columnHeader--withLeftBorder', 'columnHeader--withRightBorder', 'columnHeaderCheckbox', 'columnHeaderDraggableContainer', 'columnHeaderTitleContainer', 'columnHeaderTitleContainerContent', 'columnSeparator', 'columnSeparator--resizable', 'columnSeparator--resizing', 'columnSeparator--sideLeft', 'columnSeparator--sideRight', 'container--bottom', 'container--top', 'detailPanelToggleCell', 'detailPanelToggleCell--expanded', 'editBooleanCell', 'filterIcon', 'filler--borderBottom', 'filler--pinnedLeft', 'filler--pinnedRight', 'groupingCriteriaCell', 'groupingCriteriaCellLoadingContainer', 'groupingCriteriaCellToggle', 'headerFilterRow', 'iconSeparator', 'menuIcon', 'menuIconButton', 'menuList', 'menuOpen', 'overlayWrapperInner', 'pinnedRows', 'pinnedRows--bottom', 'pinnedRows--top', 'row', 'row--borderBottom', 'row--detailPanelExpanded', 'row--dragging', 'row--dynamicHeight', 'row--editable', 'row--editing', 'row--firstVisible', 'row--lastVisible', 'rowReorderCell', 'rowReorderCell--draggable', 'rowReorderCellContainer', 'rowReorderCellPlaceholder', 'rowSkeleton', 'scrollbar', 'scrollbar--horizontal', 'scrollbar--vertical', 'scrollbarFiller', 'scrollbarFiller--pinnedRight', 'sortIcon', 'treeDataGroupingCell', 'treeDataGroupingCellLoadingContainer', 'treeDataGroupingCellToggle', 'withBorderColor', 'row--beingDragged']
|
|
28
|
-
};
|
|
29
25
|
const GridRootStyles = exports.GridRootStyles = (0, _styles.styled)('div', {
|
|
30
26
|
name: 'MuiDataGrid',
|
|
31
27
|
slot: 'Root',
|
|
32
28
|
overridesResolver: (props, styles) => {
|
|
33
29
|
// Root overrides
|
|
34
30
|
const overrides = [styles.root];
|
|
35
|
-
|
|
31
|
+
_gridClasses.gridClassesOverrides.root.forEach(key => {
|
|
36
32
|
overrides.push({
|
|
37
33
|
[`&.${_gridClasses.gridClasses[key]}`]: styles[key]
|
|
38
34
|
});
|
|
@@ -41,7 +37,7 @@ const GridRootStyles = exports.GridRootStyles = (0, _styles.styled)('div', {
|
|
|
41
37
|
// Child element overrides
|
|
42
38
|
// - Only declare overrides here for class names that are not applied to `styled` components.
|
|
43
39
|
// - For `styled` components, declare overrides in the component itself.
|
|
44
|
-
|
|
40
|
+
_gridClasses.gridClassesOverrides.children.forEach(key => {
|
|
45
41
|
overrides.push({
|
|
46
42
|
[`& .${_gridClasses.gridClasses[key]}`]: styles[key]
|
|
47
43
|
});
|
|
@@ -960,4 +960,20 @@ export interface GridClasses {
|
|
|
960
960
|
}
|
|
961
961
|
export type GridClassKey = keyof GridClasses;
|
|
962
962
|
export declare function getDataGridUtilityClass(slot: string): string;
|
|
963
|
+
/**
|
|
964
|
+
* Class groups for the MuiDataGrid component used in GridRootStyles overridesResolver.
|
|
965
|
+
*
|
|
966
|
+
* Splits classes into two groups to support style overrides:
|
|
967
|
+
* - `root`: classes applied directly to the root element (use `&.className` selector)
|
|
968
|
+
* - `children`: classes applied to child elements (use `& .className` selector)
|
|
969
|
+
*
|
|
970
|
+
* These are spread into the gridClasses utility object and used for CSS-in-JS overrides.
|
|
971
|
+
*
|
|
972
|
+
* Only include class names here that are NOT applied via `styled` components.
|
|
973
|
+
* For `styled` components, declare overrides directly in the component definition.
|
|
974
|
+
*/
|
|
975
|
+
export declare const gridClassesOverrides: {
|
|
976
|
+
readonly root: ["autoHeight", "autosizing", "root--densityStandard", "root--densityComfortable", "root--densityCompact", "root--disableUserSelection", "root--noToolbar", "withVerticalBorder"];
|
|
977
|
+
readonly children: ["actionsCell", "booleanCell", "cell", "cell--editable", "cell--editing", "cell--flex", "cell--pinnedLeft", "cell--pinnedRight", "cell--rangeBottom", "cell--rangeLeft", "cell--rangeRight", "cell--rangeTop", "cell--selectionMode", "cell--textCenter", "cell--textLeft", "cell--textRight", "cell--withLeftBorder", "cell--withRightBorder", "cellCheckbox", "cellEmpty", "cellOffsetLeft", "cellSkeleton", "checkboxInput", "columnHeader", "columnHeader--alignCenter", "columnHeader--alignLeft", "columnHeader--alignRight", "columnHeader--dragging", "columnHeader--emptyGroup", "columnHeader--filledGroup", "columnHeader--filtered", "columnHeader--last", "columnHeader--moving", "columnHeader--numeric", "columnHeader--pinnedLeft", "columnHeader--pinnedRight", "columnHeader--siblingFocused", "columnHeader--sortable", "columnHeader--sorted", "columnHeader--withLeftBorder", "columnHeader--withRightBorder", "columnHeaderCheckbox", "columnHeaderDraggableContainer", "columnHeaderTitleContainer", "columnHeaderTitleContainerContent", "columnSeparator", "columnSeparator--resizable", "columnSeparator--resizing", "columnSeparator--sideLeft", "columnSeparator--sideRight", "container--bottom", "container--top", "detailPanelToggleCell", "detailPanelToggleCell--expanded", "editBooleanCell", "filterIcon", "filler--borderBottom", "filler--pinnedLeft", "filler--pinnedRight", "groupingCriteriaCell", "groupingCriteriaCellLoadingContainer", "groupingCriteriaCellToggle", "headerFilterRow", "iconSeparator", "menuIcon", "menuIconButton", "menuList", "menuOpen", "overlayWrapperInner", "pinnedRows", "pinnedRows--bottom", "pinnedRows--top", "row", "row--borderBottom", "row--detailPanelExpanded", "row--dragging", "row--dynamicHeight", "row--editable", "row--editing", "row--firstVisible", "row--lastVisible", "rowReorderCell", "rowReorderCell--draggable", "rowReorderCellContainer", "rowReorderCellPlaceholder", "rowSkeleton", "scrollbar", "scrollbar--horizontal", "scrollbar--vertical", "scrollbarFiller", "scrollbarFiller--pinnedRight", "sortIcon", "treeDataGroupingCell", "treeDataGroupingCellLoadingContainer", "treeDataGroupingCellToggle", "withBorderColor", "row--beingDragged"];
|
|
978
|
+
};
|
|
963
979
|
export declare const gridClasses: Record<keyof GridClasses, string>;
|
package/constants/gridClasses.js
CHANGED
|
@@ -5,12 +5,29 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
7
|
exports.getDataGridUtilityClass = getDataGridUtilityClass;
|
|
8
|
-
exports.gridClasses = void 0;
|
|
8
|
+
exports.gridClassesOverrides = exports.gridClasses = void 0;
|
|
9
9
|
var _generateUtilityClass = _interopRequireDefault(require("@mui/utils/generateUtilityClass"));
|
|
10
10
|
var _generateUtilityClasses = _interopRequireDefault(require("@mui/utils/generateUtilityClasses"));
|
|
11
11
|
function getDataGridUtilityClass(slot) {
|
|
12
12
|
return (0, _generateUtilityClass.default)('MuiDataGrid', slot);
|
|
13
13
|
}
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
14
|
+
|
|
15
|
+
/**
|
|
16
|
+
* Class groups for the MuiDataGrid component used in GridRootStyles overridesResolver.
|
|
17
|
+
*
|
|
18
|
+
* Splits classes into two groups to support style overrides:
|
|
19
|
+
* - `root`: classes applied directly to the root element (use `&.className` selector)
|
|
20
|
+
* - `children`: classes applied to child elements (use `& .className` selector)
|
|
21
|
+
*
|
|
22
|
+
* These are spread into the gridClasses utility object and used for CSS-in-JS overrides.
|
|
23
|
+
*
|
|
24
|
+
* Only include class names here that are NOT applied via `styled` components.
|
|
25
|
+
* For `styled` components, declare overrides directly in the component definition.
|
|
26
|
+
*/
|
|
27
|
+
const gridClassesOverrides = exports.gridClassesOverrides = {
|
|
28
|
+
root: ['autoHeight', 'autosizing', 'root--densityStandard', 'root--densityComfortable', 'root--densityCompact', 'root--disableUserSelection', 'root--noToolbar', 'withVerticalBorder'],
|
|
29
|
+
children: ['actionsCell', 'booleanCell', 'cell', 'cell--editable', 'cell--editing', 'cell--flex', 'cell--pinnedLeft', 'cell--pinnedRight', 'cell--rangeBottom', 'cell--rangeLeft', 'cell--rangeRight', 'cell--rangeTop', 'cell--selectionMode', 'cell--textCenter', 'cell--textLeft', 'cell--textRight', 'cell--withLeftBorder', 'cell--withRightBorder', 'cellCheckbox', 'cellEmpty', 'cellOffsetLeft', 'cellSkeleton', 'checkboxInput', 'columnHeader', 'columnHeader--alignCenter', 'columnHeader--alignLeft', 'columnHeader--alignRight', 'columnHeader--dragging', 'columnHeader--emptyGroup', 'columnHeader--filledGroup', 'columnHeader--filtered', 'columnHeader--last', 'columnHeader--moving', 'columnHeader--numeric', 'columnHeader--pinnedLeft', 'columnHeader--pinnedRight', 'columnHeader--siblingFocused', 'columnHeader--sortable', 'columnHeader--sorted', 'columnHeader--withLeftBorder', 'columnHeader--withRightBorder', 'columnHeaderCheckbox', 'columnHeaderDraggableContainer', 'columnHeaderTitleContainer', 'columnHeaderTitleContainerContent', 'columnSeparator', 'columnSeparator--resizable', 'columnSeparator--resizing', 'columnSeparator--sideLeft', 'columnSeparator--sideRight', 'container--bottom', 'container--top', 'detailPanelToggleCell', 'detailPanelToggleCell--expanded', 'editBooleanCell', 'filterIcon', 'filler--borderBottom', 'filler--pinnedLeft', 'filler--pinnedRight', 'groupingCriteriaCell', 'groupingCriteriaCellLoadingContainer', 'groupingCriteriaCellToggle', 'headerFilterRow', 'iconSeparator', 'menuIcon', 'menuIconButton', 'menuList', 'menuOpen', 'overlayWrapperInner', 'pinnedRows', 'pinnedRows--bottom', 'pinnedRows--top', 'row', 'row--borderBottom', 'row--detailPanelExpanded',
|
|
30
|
+
// TODO v9: Rename to `cell--dragging`
|
|
31
|
+
'row--dragging', 'row--dynamicHeight', 'row--editable', 'row--editing', 'row--firstVisible', 'row--lastVisible', 'rowReorderCell', 'rowReorderCell--draggable', 'rowReorderCellContainer', 'rowReorderCellPlaceholder', 'rowSkeleton', 'scrollbar', 'scrollbar--horizontal', 'scrollbar--vertical', 'scrollbarFiller', 'scrollbarFiller--pinnedRight', 'sortIcon', 'treeDataGroupingCell', 'treeDataGroupingCellLoadingContainer', 'treeDataGroupingCellToggle', 'withBorderColor', 'row--beingDragged']
|
|
32
|
+
};
|
|
33
|
+
const gridClasses = exports.gridClasses = (0, _generateUtilityClasses.default)('MuiDataGrid', [...gridClassesOverrides.root, ...gridClassesOverrides.children, 'aiAssistantPanel', 'aiAssistantPanelHeader', 'aiAssistantPanelTitleContainer', 'aiAssistantPanelTitle', 'aiAssistantPanelBody', 'aiAssistantPanelEmptyText', 'aiAssistantPanelFooter', 'aiAssistantPanelConversation', 'aiAssistantPanelConversationList', 'aiAssistantPanelConversationTitle', 'aiAssistantPanelSuggestions', 'aiAssistantPanelSuggestionsList', 'aiAssistantPanelSuggestionsItem', 'aiAssistantPanelSuggestionsLabel', 'aggregationColumnHeader', 'aggregationColumnHeader--alignLeft', 'aggregationColumnHeader--alignCenter', 'aggregationColumnHeader--alignRight', 'aggregationColumnHeaderLabel', 'aggregationRowOverlayWrapper', 'mainContent', 'withSidePanel', 'collapsible', 'collapsibleTrigger', 'collapsibleIcon', 'collapsiblePanel', 'columnHeader--filter', 'columnHeaderFilterInput', 'columnHeaderFilterOperatorLabel', 'columnHeaderTitle', 'columnHeaders', 'columnsManagement', 'columnsManagementRow', 'columnsManagementHeader', 'columnsManagementSearchInput', 'columnsManagementFooter', 'columnsManagementScrollArea', 'columnsManagementEmptyText', 'detailPanel', 'footerCell', 'panel', 'panelHeader', 'panelWrapper', 'panelContent', 'panelFooter', 'paper', 'editInputCell', 'longTextCell', 'longTextCellContent', 'longTextCellExpandButton', 'longTextCellCollapseButton', 'longTextCellPopup', 'longTextCellPopperContent', 'editLongTextCell', 'editLongTextCellValue', 'editLongTextCellPopup', 'editLongTextCellPopperContent', 'editLongTextCellTextarea', 'filler', 'filterForm', 'filterFormDeleteIcon', 'filterFormLogicOperatorInput', 'filterFormColumnInput', 'filterFormOperatorInput', 'filterFormValueInput', 'footerContainer', 'iconButtonContainer', 'main', 'main--hasPinnedRight', 'main--hiddenContent', 'menu', 'overlay', 'overlayWrapper', 'root', 'rowCount', 'rowReorderIcon', 'scrollArea--left', 'scrollArea--right', 'scrollArea--up', 'scrollArea--down', 'scrollArea', 'scrollShadow', 'scrollShadow--vertical', 'scrollShadow--horizontal', 'selectedRowCount', 'sortButton', 'shadowScrollArea', 'sidebar', 'sidebarHeader', 'toolbarContainer', 'toolbar', 'toolbarLabel', 'toolbarDivider', 'toolbarFilterList', 'toolbarQuickFilter', 'toolbarQuickFilterTrigger', 'toolbarQuickFilterControl', 'virtualScroller', 'virtualScroller--hasScrollX', 'virtualScrollerContent', 'virtualScrollerContent--overflowed', 'virtualScrollerRenderZone', 'pivotPanelAvailableFields', 'pivotPanelField', 'pivotPanelField--sorted', 'pivotPanelFieldActionContainer', 'pivotPanelFieldCheckbox', 'pivotPanelFieldDragIcon', 'pivotPanelFieldList', 'pivotPanelFieldName', 'pivotPanelHeader', 'pivotPanelPlaceholder', 'pivotPanelScrollArea', 'pivotPanelSearchContainer', 'pivotPanelSection', 'pivotPanelSectionTitle', 'pivotPanelSections', 'pivotPanelSwitch', 'pivotPanelSwitchLabel', 'prompt', 'promptContent', 'promptText', 'promptFeedback', 'promptChangeList', 'promptChangesToggle', 'promptChangesToggleIcon', 'promptIcon', 'promptIconContainer', 'promptError', 'promptAction', 'resizablePanelHandle', 'resizablePanelHandle--horizontal', 'resizablePanelHandle--vertical']);
|
package/constants/index.d.ts
CHANGED
package/constants/index.js
CHANGED
|
@@ -3,9 +3,26 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
+
var _exportNames = {
|
|
7
|
+
getDataGridUtilityClass: true,
|
|
8
|
+
gridClasses: true
|
|
9
|
+
};
|
|
10
|
+
Object.defineProperty(exports, "getDataGridUtilityClass", {
|
|
11
|
+
enumerable: true,
|
|
12
|
+
get: function () {
|
|
13
|
+
return _gridClasses.getDataGridUtilityClass;
|
|
14
|
+
}
|
|
15
|
+
});
|
|
16
|
+
Object.defineProperty(exports, "gridClasses", {
|
|
17
|
+
enumerable: true,
|
|
18
|
+
get: function () {
|
|
19
|
+
return _gridClasses.gridClasses;
|
|
20
|
+
}
|
|
21
|
+
});
|
|
6
22
|
var _envConstants = require("./envConstants");
|
|
7
23
|
Object.keys(_envConstants).forEach(function (key) {
|
|
8
24
|
if (key === "default" || key === "__esModule") return;
|
|
25
|
+
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
9
26
|
if (key in exports && exports[key] === _envConstants[key]) return;
|
|
10
27
|
Object.defineProperty(exports, key, {
|
|
11
28
|
enumerable: true,
|
|
@@ -17,6 +34,7 @@ Object.keys(_envConstants).forEach(function (key) {
|
|
|
17
34
|
var _localeTextConstants = require("./localeTextConstants");
|
|
18
35
|
Object.keys(_localeTextConstants).forEach(function (key) {
|
|
19
36
|
if (key === "default" || key === "__esModule") return;
|
|
37
|
+
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
20
38
|
if (key in exports && exports[key] === _localeTextConstants[key]) return;
|
|
21
39
|
Object.defineProperty(exports, key, {
|
|
22
40
|
enumerable: true,
|
|
@@ -26,19 +44,10 @@ Object.keys(_localeTextConstants).forEach(function (key) {
|
|
|
26
44
|
});
|
|
27
45
|
});
|
|
28
46
|
var _gridClasses = require("./gridClasses");
|
|
29
|
-
Object.keys(_gridClasses).forEach(function (key) {
|
|
30
|
-
if (key === "default" || key === "__esModule") return;
|
|
31
|
-
if (key in exports && exports[key] === _gridClasses[key]) return;
|
|
32
|
-
Object.defineProperty(exports, key, {
|
|
33
|
-
enumerable: true,
|
|
34
|
-
get: function () {
|
|
35
|
-
return _gridClasses[key];
|
|
36
|
-
}
|
|
37
|
-
});
|
|
38
|
-
});
|
|
39
47
|
var _signature = require("./signature");
|
|
40
48
|
Object.keys(_signature).forEach(function (key) {
|
|
41
49
|
if (key === "default" || key === "__esModule") return;
|
|
50
|
+
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
42
51
|
if (key in exports && exports[key] === _signature[key]) return;
|
|
43
52
|
Object.defineProperty(exports, key, {
|
|
44
53
|
enumerable: true,
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { styled } from '@mui/material/styles';
|
|
2
|
-
import { gridClasses as c } from "../../constants/gridClasses.js";
|
|
2
|
+
import { gridClasses as c, gridClassesOverrides } from "../../constants/gridClasses.js";
|
|
3
3
|
import { vars } from "../../constants/cssVariables.js";
|
|
4
4
|
import { useGridSelector } from "../../hooks/utils/useGridSelector.js";
|
|
5
5
|
import { useGridPrivateApiContext } from "../../hooks/utils/useGridPrivateApiContext.js";
|
|
@@ -16,17 +16,13 @@ const separatorIconDragStyles = {
|
|
|
16
16
|
// https://github.com/emotion-js/emotion/issues/1105#issuecomment-1722524968
|
|
17
17
|
const ignoreSsrWarning = '/* emotion-disable-server-rendering-unsafe-selector-warning-please-do-not-use-this-the-warning-exists-for-a-reason */';
|
|
18
18
|
const shouldShowBorderTopRightRadiusSelector = apiRef => !apiRef.current.state.dimensions.isReady ? apiRef.current.state.dimensions.scrollbarSize === 0 : apiRef.current.state.dimensions.hasScrollX && (!apiRef.current.state.dimensions.hasScrollY || apiRef.current.state.dimensions.scrollbarSize === 0);
|
|
19
|
-
const elementOverrides = {
|
|
20
|
-
root: ['autoHeight', 'autosizing', 'root--densityStandard', 'root--densityComfortable', 'root--densityCompact', 'root--disableUserSelection', 'root--noToolbar', 'withVerticalBorder'],
|
|
21
|
-
children: ['actionsCell', 'booleanCell', 'cell', 'cell--editable', 'cell--editing', 'cell--flex', 'cell--pinnedLeft', 'cell--pinnedRight', 'cell--rangeBottom', 'cell--rangeLeft', 'cell--rangeRight', 'cell--rangeTop', 'cell--selectionMode', 'cell--textCenter', 'cell--textLeft', 'cell--textRight', 'cell--withLeftBorder', 'cell--withRightBorder', 'cellCheckbox', 'cellEmpty', 'cellOffsetLeft', 'cellSkeleton', 'checkboxInput', 'columnHeader', 'columnHeader--alignCenter', 'columnHeader--alignLeft', 'columnHeader--alignRight', 'columnHeader--dragging', 'columnHeader--emptyGroup', 'columnHeader--filledGroup', 'columnHeader--filtered', 'columnHeader--last', 'columnHeader--moving', 'columnHeader--numeric', 'columnHeader--pinnedLeft', 'columnHeader--pinnedRight', 'columnHeader--siblingFocused', 'columnHeader--sortable', 'columnHeader--sorted', 'columnHeader--withLeftBorder', 'columnHeader--withRightBorder', 'columnHeaderCheckbox', 'columnHeaderDraggableContainer', 'columnHeaderTitleContainer', 'columnHeaderTitleContainerContent', 'columnSeparator', 'columnSeparator--resizable', 'columnSeparator--resizing', 'columnSeparator--sideLeft', 'columnSeparator--sideRight', 'container--bottom', 'container--top', 'detailPanelToggleCell', 'detailPanelToggleCell--expanded', 'editBooleanCell', 'filterIcon', 'filler--borderBottom', 'filler--pinnedLeft', 'filler--pinnedRight', 'groupingCriteriaCell', 'groupingCriteriaCellLoadingContainer', 'groupingCriteriaCellToggle', 'headerFilterRow', 'iconSeparator', 'menuIcon', 'menuIconButton', 'menuList', 'menuOpen', 'overlayWrapperInner', 'pinnedRows', 'pinnedRows--bottom', 'pinnedRows--top', 'row', 'row--borderBottom', 'row--detailPanelExpanded', 'row--dragging', 'row--dynamicHeight', 'row--editable', 'row--editing', 'row--firstVisible', 'row--lastVisible', 'rowReorderCell', 'rowReorderCell--draggable', 'rowReorderCellContainer', 'rowReorderCellPlaceholder', 'rowSkeleton', 'scrollbar', 'scrollbar--horizontal', 'scrollbar--vertical', 'scrollbarFiller', 'scrollbarFiller--pinnedRight', 'sortIcon', 'treeDataGroupingCell', 'treeDataGroupingCellLoadingContainer', 'treeDataGroupingCellToggle', 'withBorderColor', 'row--beingDragged']
|
|
22
|
-
};
|
|
23
19
|
export const GridRootStyles = styled('div', {
|
|
24
20
|
name: 'MuiDataGrid',
|
|
25
21
|
slot: 'Root',
|
|
26
22
|
overridesResolver: (props, styles) => {
|
|
27
23
|
// Root overrides
|
|
28
24
|
const overrides = [styles.root];
|
|
29
|
-
|
|
25
|
+
gridClassesOverrides.root.forEach(key => {
|
|
30
26
|
overrides.push({
|
|
31
27
|
[`&.${c[key]}`]: styles[key]
|
|
32
28
|
});
|
|
@@ -35,7 +31,7 @@ export const GridRootStyles = styled('div', {
|
|
|
35
31
|
// Child element overrides
|
|
36
32
|
// - Only declare overrides here for class names that are not applied to `styled` components.
|
|
37
33
|
// - For `styled` components, declare overrides in the component itself.
|
|
38
|
-
|
|
34
|
+
gridClassesOverrides.children.forEach(key => {
|
|
39
35
|
overrides.push({
|
|
40
36
|
[`& .${c[key]}`]: styles[key]
|
|
41
37
|
});
|
|
@@ -960,4 +960,20 @@ export interface GridClasses {
|
|
|
960
960
|
}
|
|
961
961
|
export type GridClassKey = keyof GridClasses;
|
|
962
962
|
export declare function getDataGridUtilityClass(slot: string): string;
|
|
963
|
+
/**
|
|
964
|
+
* Class groups for the MuiDataGrid component used in GridRootStyles overridesResolver.
|
|
965
|
+
*
|
|
966
|
+
* Splits classes into two groups to support style overrides:
|
|
967
|
+
* - `root`: classes applied directly to the root element (use `&.className` selector)
|
|
968
|
+
* - `children`: classes applied to child elements (use `& .className` selector)
|
|
969
|
+
*
|
|
970
|
+
* These are spread into the gridClasses utility object and used for CSS-in-JS overrides.
|
|
971
|
+
*
|
|
972
|
+
* Only include class names here that are NOT applied via `styled` components.
|
|
973
|
+
* For `styled` components, declare overrides directly in the component definition.
|
|
974
|
+
*/
|
|
975
|
+
export declare const gridClassesOverrides: {
|
|
976
|
+
readonly root: ["autoHeight", "autosizing", "root--densityStandard", "root--densityComfortable", "root--densityCompact", "root--disableUserSelection", "root--noToolbar", "withVerticalBorder"];
|
|
977
|
+
readonly children: ["actionsCell", "booleanCell", "cell", "cell--editable", "cell--editing", "cell--flex", "cell--pinnedLeft", "cell--pinnedRight", "cell--rangeBottom", "cell--rangeLeft", "cell--rangeRight", "cell--rangeTop", "cell--selectionMode", "cell--textCenter", "cell--textLeft", "cell--textRight", "cell--withLeftBorder", "cell--withRightBorder", "cellCheckbox", "cellEmpty", "cellOffsetLeft", "cellSkeleton", "checkboxInput", "columnHeader", "columnHeader--alignCenter", "columnHeader--alignLeft", "columnHeader--alignRight", "columnHeader--dragging", "columnHeader--emptyGroup", "columnHeader--filledGroup", "columnHeader--filtered", "columnHeader--last", "columnHeader--moving", "columnHeader--numeric", "columnHeader--pinnedLeft", "columnHeader--pinnedRight", "columnHeader--siblingFocused", "columnHeader--sortable", "columnHeader--sorted", "columnHeader--withLeftBorder", "columnHeader--withRightBorder", "columnHeaderCheckbox", "columnHeaderDraggableContainer", "columnHeaderTitleContainer", "columnHeaderTitleContainerContent", "columnSeparator", "columnSeparator--resizable", "columnSeparator--resizing", "columnSeparator--sideLeft", "columnSeparator--sideRight", "container--bottom", "container--top", "detailPanelToggleCell", "detailPanelToggleCell--expanded", "editBooleanCell", "filterIcon", "filler--borderBottom", "filler--pinnedLeft", "filler--pinnedRight", "groupingCriteriaCell", "groupingCriteriaCellLoadingContainer", "groupingCriteriaCellToggle", "headerFilterRow", "iconSeparator", "menuIcon", "menuIconButton", "menuList", "menuOpen", "overlayWrapperInner", "pinnedRows", "pinnedRows--bottom", "pinnedRows--top", "row", "row--borderBottom", "row--detailPanelExpanded", "row--dragging", "row--dynamicHeight", "row--editable", "row--editing", "row--firstVisible", "row--lastVisible", "rowReorderCell", "rowReorderCell--draggable", "rowReorderCellContainer", "rowReorderCellPlaceholder", "rowSkeleton", "scrollbar", "scrollbar--horizontal", "scrollbar--vertical", "scrollbarFiller", "scrollbarFiller--pinnedRight", "sortIcon", "treeDataGroupingCell", "treeDataGroupingCellLoadingContainer", "treeDataGroupingCellToggle", "withBorderColor", "row--beingDragged"];
|
|
978
|
+
};
|
|
963
979
|
export declare const gridClasses: Record<keyof GridClasses, string>;
|
|
@@ -3,6 +3,23 @@ import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
|
|
|
3
3
|
export function getDataGridUtilityClass(slot) {
|
|
4
4
|
return generateUtilityClass('MuiDataGrid', slot);
|
|
5
5
|
}
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
6
|
+
|
|
7
|
+
/**
|
|
8
|
+
* Class groups for the MuiDataGrid component used in GridRootStyles overridesResolver.
|
|
9
|
+
*
|
|
10
|
+
* Splits classes into two groups to support style overrides:
|
|
11
|
+
* - `root`: classes applied directly to the root element (use `&.className` selector)
|
|
12
|
+
* - `children`: classes applied to child elements (use `& .className` selector)
|
|
13
|
+
*
|
|
14
|
+
* These are spread into the gridClasses utility object and used for CSS-in-JS overrides.
|
|
15
|
+
*
|
|
16
|
+
* Only include class names here that are NOT applied via `styled` components.
|
|
17
|
+
* For `styled` components, declare overrides directly in the component definition.
|
|
18
|
+
*/
|
|
19
|
+
export const gridClassesOverrides = {
|
|
20
|
+
root: ['autoHeight', 'autosizing', 'root--densityStandard', 'root--densityComfortable', 'root--densityCompact', 'root--disableUserSelection', 'root--noToolbar', 'withVerticalBorder'],
|
|
21
|
+
children: ['actionsCell', 'booleanCell', 'cell', 'cell--editable', 'cell--editing', 'cell--flex', 'cell--pinnedLeft', 'cell--pinnedRight', 'cell--rangeBottom', 'cell--rangeLeft', 'cell--rangeRight', 'cell--rangeTop', 'cell--selectionMode', 'cell--textCenter', 'cell--textLeft', 'cell--textRight', 'cell--withLeftBorder', 'cell--withRightBorder', 'cellCheckbox', 'cellEmpty', 'cellOffsetLeft', 'cellSkeleton', 'checkboxInput', 'columnHeader', 'columnHeader--alignCenter', 'columnHeader--alignLeft', 'columnHeader--alignRight', 'columnHeader--dragging', 'columnHeader--emptyGroup', 'columnHeader--filledGroup', 'columnHeader--filtered', 'columnHeader--last', 'columnHeader--moving', 'columnHeader--numeric', 'columnHeader--pinnedLeft', 'columnHeader--pinnedRight', 'columnHeader--siblingFocused', 'columnHeader--sortable', 'columnHeader--sorted', 'columnHeader--withLeftBorder', 'columnHeader--withRightBorder', 'columnHeaderCheckbox', 'columnHeaderDraggableContainer', 'columnHeaderTitleContainer', 'columnHeaderTitleContainerContent', 'columnSeparator', 'columnSeparator--resizable', 'columnSeparator--resizing', 'columnSeparator--sideLeft', 'columnSeparator--sideRight', 'container--bottom', 'container--top', 'detailPanelToggleCell', 'detailPanelToggleCell--expanded', 'editBooleanCell', 'filterIcon', 'filler--borderBottom', 'filler--pinnedLeft', 'filler--pinnedRight', 'groupingCriteriaCell', 'groupingCriteriaCellLoadingContainer', 'groupingCriteriaCellToggle', 'headerFilterRow', 'iconSeparator', 'menuIcon', 'menuIconButton', 'menuList', 'menuOpen', 'overlayWrapperInner', 'pinnedRows', 'pinnedRows--bottom', 'pinnedRows--top', 'row', 'row--borderBottom', 'row--detailPanelExpanded',
|
|
22
|
+
// TODO v9: Rename to `cell--dragging`
|
|
23
|
+
'row--dragging', 'row--dynamicHeight', 'row--editable', 'row--editing', 'row--firstVisible', 'row--lastVisible', 'rowReorderCell', 'rowReorderCell--draggable', 'rowReorderCellContainer', 'rowReorderCellPlaceholder', 'rowSkeleton', 'scrollbar', 'scrollbar--horizontal', 'scrollbar--vertical', 'scrollbarFiller', 'scrollbarFiller--pinnedRight', 'sortIcon', 'treeDataGroupingCell', 'treeDataGroupingCellLoadingContainer', 'treeDataGroupingCellToggle', 'withBorderColor', 'row--beingDragged']
|
|
24
|
+
};
|
|
25
|
+
export const gridClasses = generateUtilityClasses('MuiDataGrid', [...gridClassesOverrides.root, ...gridClassesOverrides.children, 'aiAssistantPanel', 'aiAssistantPanelHeader', 'aiAssistantPanelTitleContainer', 'aiAssistantPanelTitle', 'aiAssistantPanelBody', 'aiAssistantPanelEmptyText', 'aiAssistantPanelFooter', 'aiAssistantPanelConversation', 'aiAssistantPanelConversationList', 'aiAssistantPanelConversationTitle', 'aiAssistantPanelSuggestions', 'aiAssistantPanelSuggestionsList', 'aiAssistantPanelSuggestionsItem', 'aiAssistantPanelSuggestionsLabel', 'aggregationColumnHeader', 'aggregationColumnHeader--alignLeft', 'aggregationColumnHeader--alignCenter', 'aggregationColumnHeader--alignRight', 'aggregationColumnHeaderLabel', 'aggregationRowOverlayWrapper', 'mainContent', 'withSidePanel', 'collapsible', 'collapsibleTrigger', 'collapsibleIcon', 'collapsiblePanel', 'columnHeader--filter', 'columnHeaderFilterInput', 'columnHeaderFilterOperatorLabel', 'columnHeaderTitle', 'columnHeaders', 'columnsManagement', 'columnsManagementRow', 'columnsManagementHeader', 'columnsManagementSearchInput', 'columnsManagementFooter', 'columnsManagementScrollArea', 'columnsManagementEmptyText', 'detailPanel', 'footerCell', 'panel', 'panelHeader', 'panelWrapper', 'panelContent', 'panelFooter', 'paper', 'editInputCell', 'longTextCell', 'longTextCellContent', 'longTextCellExpandButton', 'longTextCellCollapseButton', 'longTextCellPopup', 'longTextCellPopperContent', 'editLongTextCell', 'editLongTextCellValue', 'editLongTextCellPopup', 'editLongTextCellPopperContent', 'editLongTextCellTextarea', 'filler', 'filterForm', 'filterFormDeleteIcon', 'filterFormLogicOperatorInput', 'filterFormColumnInput', 'filterFormOperatorInput', 'filterFormValueInput', 'footerContainer', 'iconButtonContainer', 'main', 'main--hasPinnedRight', 'main--hiddenContent', 'menu', 'overlay', 'overlayWrapper', 'root', 'rowCount', 'rowReorderIcon', 'scrollArea--left', 'scrollArea--right', 'scrollArea--up', 'scrollArea--down', 'scrollArea', 'scrollShadow', 'scrollShadow--vertical', 'scrollShadow--horizontal', 'selectedRowCount', 'sortButton', 'shadowScrollArea', 'sidebar', 'sidebarHeader', 'toolbarContainer', 'toolbar', 'toolbarLabel', 'toolbarDivider', 'toolbarFilterList', 'toolbarQuickFilter', 'toolbarQuickFilterTrigger', 'toolbarQuickFilterControl', 'virtualScroller', 'virtualScroller--hasScrollX', 'virtualScrollerContent', 'virtualScrollerContent--overflowed', 'virtualScrollerRenderZone', 'pivotPanelAvailableFields', 'pivotPanelField', 'pivotPanelField--sorted', 'pivotPanelFieldActionContainer', 'pivotPanelFieldCheckbox', 'pivotPanelFieldDragIcon', 'pivotPanelFieldList', 'pivotPanelFieldName', 'pivotPanelHeader', 'pivotPanelPlaceholder', 'pivotPanelScrollArea', 'pivotPanelSearchContainer', 'pivotPanelSection', 'pivotPanelSectionTitle', 'pivotPanelSections', 'pivotPanelSwitch', 'pivotPanelSwitchLabel', 'prompt', 'promptContent', 'promptText', 'promptFeedback', 'promptChangeList', 'promptChangesToggle', 'promptChangesToggleIcon', 'promptIcon', 'promptIconContainer', 'promptError', 'promptAction', 'resizablePanelHandle', 'resizablePanelHandle--horizontal', 'resizablePanelHandle--vertical']);
|
package/esm/constants/index.d.ts
CHANGED
package/esm/constants/index.js
CHANGED
package/esm/index.js
CHANGED
package/index.js
CHANGED