@mui/x-data-grid 7.29.0 → 7.29.2
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 +131 -0
- package/DataGrid/useDataGridProps.js +6 -5
- package/components/GridApiContext.js +2 -0
- package/components/GridConfigurationContext.js +2 -0
- package/components/GridScrollArea.js +2 -0
- package/components/columnHeaders/GridColumnHeaderSortIcon.d.ts +1 -0
- package/components/columnHeaders/GridColumnHeaderSortIcon.js +8 -3
- package/components/containers/GridRootStyles.js +19 -14
- package/constants/gridClasses.d.ts +4 -0
- package/constants/gridClasses.js +1 -1
- package/context/GridRootPropsContext.js +2 -0
- package/hooks/features/virtualization/useGridVirtualScroller.js +5 -5
- package/index.js +1 -1
- package/locales/hyAM.d.ts +2 -0
- package/locales/hyAM.js +178 -0
- package/locales/index.d.ts +1 -0
- package/locales/index.js +1 -0
- package/modern/DataGrid/useDataGridProps.js +6 -5
- package/modern/components/GridApiContext.js +2 -0
- package/modern/components/GridConfigurationContext.js +2 -0
- package/modern/components/GridScrollArea.js +2 -0
- package/modern/components/columnHeaders/GridColumnHeaderSortIcon.js +8 -3
- package/modern/components/containers/GridRootStyles.js +19 -14
- package/modern/constants/gridClasses.js +1 -1
- package/modern/context/GridRootPropsContext.js +2 -0
- package/modern/hooks/features/virtualization/useGridVirtualScroller.js +5 -5
- package/modern/index.js +1 -1
- package/modern/locales/hyAM.js +178 -0
- package/modern/locales/index.js +1 -0
- package/node/DataGrid/useDataGridProps.js +5 -4
- package/node/components/GridApiContext.js +1 -0
- package/node/components/GridConfigurationContext.js +1 -0
- package/node/components/GridScrollArea.js +1 -0
- package/node/components/columnHeaders/GridColumnHeaderSortIcon.js +8 -3
- package/node/components/containers/GridRootStyles.js +19 -14
- package/node/constants/gridClasses.js +1 -1
- package/node/context/GridRootPropsContext.js +1 -0
- package/node/hooks/features/virtualization/useGridVirtualScroller.js +5 -5
- package/node/index.js +1 -1
- package/node/locales/hyAM.js +184 -0
- package/node/locales/index.js +11 -0
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,137 @@
|
|
|
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
|
+
## 7.29.2
|
|
7
|
+
|
|
8
|
+
_May 1, 2025_
|
|
9
|
+
|
|
10
|
+
We'd like to offer a big thanks to the 7 contributors who made this release possible. Here are some highlights ✨:
|
|
11
|
+
|
|
12
|
+
- 🌍 Add Armenian (hy-AM) locale on the Data Grid
|
|
13
|
+
- 🌍 Improve Italian (it-IT) locale on the Date and Time Pickers
|
|
14
|
+
- 🐞 Bugfixes
|
|
15
|
+
|
|
16
|
+
Special thanks go out to the community contributors who have helped make this release possible:
|
|
17
|
+
@ArturAghakaryan, @federico-ntr.
|
|
18
|
+
|
|
19
|
+
Following are all team members who have contributed to this release:
|
|
20
|
+
@arminmeh, @JCQuintas, @KenanYusuf, @MBilalShafi, @oliviertassinari.
|
|
21
|
+
|
|
22
|
+
<!--/ HIGHLIGHT_ABOVE_SEPARATOR /-->
|
|
23
|
+
|
|
24
|
+
### Data Grid
|
|
25
|
+
|
|
26
|
+
#### `@mui/x-data-grid@7.29.2`
|
|
27
|
+
|
|
28
|
+
- [DataGrid] Fix column title truncation on touch devices (#17497) @KenanYusuf
|
|
29
|
+
- [DataGrid] Fix theme `defaultProps` causing unwanted re-renders (#17530) @KenanYusuf
|
|
30
|
+
- [l10n] Add Armenian (hy-AM) locale (#17422) @ArturAghakaryan
|
|
31
|
+
- [l10n] Fix l10n export (#17526) @arminmeh
|
|
32
|
+
|
|
33
|
+
#### `@mui/x-data-grid-pro@7.29.2` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
34
|
+
|
|
35
|
+
Same changes as in `@mui/x-data-grid@7.29.2`.
|
|
36
|
+
|
|
37
|
+
#### `@mui/x-data-grid-premium@7.29.2` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
38
|
+
|
|
39
|
+
Same changes as in `@mui/x-data-grid-pro@7.29.2`.
|
|
40
|
+
|
|
41
|
+
### Date and Time Pickers
|
|
42
|
+
|
|
43
|
+
#### `@mui/x-date-pickers@7.29.2`
|
|
44
|
+
|
|
45
|
+
- [l10n] Improve Italian (it-IT) locale (#17604) @federico-ntr
|
|
46
|
+
|
|
47
|
+
#### `@mui/x-date-pickers-pro@7.29.2` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
48
|
+
|
|
49
|
+
Same changes as in `@mui/x-date-pickers@7.29.2`.
|
|
50
|
+
|
|
51
|
+
### Docs
|
|
52
|
+
|
|
53
|
+
- [docs] Fix MUI X v7 install instructions (#17537) @oliviertassinari
|
|
54
|
+
- [docs] Improve data grid export docs (#17553) @MBilalShafi
|
|
55
|
+
|
|
56
|
+
### Core
|
|
57
|
+
|
|
58
|
+
- [core] Fix root package 7.29.1 (#17523) @JCQuintas
|
|
59
|
+
|
|
60
|
+
## 7.29.1
|
|
61
|
+
|
|
62
|
+
_Apr 23, 2025_
|
|
63
|
+
|
|
64
|
+
We'd like to offer a big thanks to the 5 contributors who made this release possible. Here are some highlights ✨:
|
|
65
|
+
|
|
66
|
+
- 🐞 Bugfixes
|
|
67
|
+
|
|
68
|
+
Special thanks go out to the community contributors who have helped make this release possible:
|
|
69
|
+
@lhilgert9
|
|
70
|
+
|
|
71
|
+
Following are all team members who have contributed to this release:
|
|
72
|
+
@arminmeh, @cherniavskii, @flaviendelangle, @LukasTy, @romgrk.
|
|
73
|
+
|
|
74
|
+
<!--/ HIGHLIGHT_ABOVE_SEPARATOR /-->
|
|
75
|
+
|
|
76
|
+
### Data Grid
|
|
77
|
+
|
|
78
|
+
#### `@mui/x-data-grid@7.29.1`
|
|
79
|
+
|
|
80
|
+
- [DataGrid] Prevent scrollbars from showing on top (#17410) @romgrk
|
|
81
|
+
|
|
82
|
+
#### `@mui/x-data-grid-pro@7.29.1` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
83
|
+
|
|
84
|
+
Same changes as in `@mui/x-data-grid@7.29.1`, plus:
|
|
85
|
+
|
|
86
|
+
- [DataGridPro] Avoid proptypes warnings with header filters in React 17 (#17492) @cherniavskii
|
|
87
|
+
- [DataGridPro] Fix expandable rows detail content height updates (#17509) @arminmeh
|
|
88
|
+
- [DataGridPro] Fix row virtualization not working in list view (#17404) @cherniavskii
|
|
89
|
+
- [DataGridPro] Move locales re-export to allow proper tree shaking (#17438) @lhilgert9
|
|
90
|
+
|
|
91
|
+
#### `@mui/x-data-grid-premium@7.29.1` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
92
|
+
|
|
93
|
+
Same changes as in `@mui/x-data-grid-pro@7.29.1`, plus:
|
|
94
|
+
|
|
95
|
+
- [DataGridPremium] Use `groupingValueGetter` for row grouping on the server (#17423) @cherniavskii
|
|
96
|
+
|
|
97
|
+
### Date and Time Pickers
|
|
98
|
+
|
|
99
|
+
#### `@mui/x-date-pickers@7.29.1`
|
|
100
|
+
|
|
101
|
+
Internal changes.
|
|
102
|
+
|
|
103
|
+
#### `@mui/x-date-pickers-pro@7.29.1` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
104
|
+
|
|
105
|
+
Same changes as in `@mui/x-date-pickers@7.29.1`.
|
|
106
|
+
|
|
107
|
+
### Charts
|
|
108
|
+
|
|
109
|
+
#### `@mui/x-charts@7.29.1`
|
|
110
|
+
|
|
111
|
+
Internal changes.
|
|
112
|
+
|
|
113
|
+
#### `@mui/x-charts-pro@7.29.1` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
114
|
+
|
|
115
|
+
Same changes as in `@mui/x-charts@7.29.1`.
|
|
116
|
+
|
|
117
|
+
### Tree View
|
|
118
|
+
|
|
119
|
+
#### `@mui/x-tree-view@7.29.1`
|
|
120
|
+
|
|
121
|
+
Internal changes.
|
|
122
|
+
|
|
123
|
+
#### `@mui/x-tree-view-pro@7.29.1` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
124
|
+
|
|
125
|
+
Same changes as in `@mui/x-tree-view@7.29.1`, plus:
|
|
126
|
+
|
|
127
|
+
- [RichTreeViewPro] Fix drag and drop issue with label editing (#17415) @flaviendelangle
|
|
128
|
+
|
|
129
|
+
### Docs
|
|
130
|
+
|
|
131
|
+
- [docs] Use MUI X v7 packages in CodeSandbox and StackBlitz (#17516) @cherniavskii
|
|
132
|
+
|
|
133
|
+
### Core
|
|
134
|
+
|
|
135
|
+
- [core] Bump monorepo (#17437) @LukasTy
|
|
136
|
+
|
|
6
137
|
## 7.29.0
|
|
7
138
|
|
|
8
139
|
_Apr 16, 2025_
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
2
|
import * as React from 'react';
|
|
3
|
-
import {
|
|
3
|
+
import { useTheme } from '@mui/material/styles';
|
|
4
|
+
import { getThemeProps } from '@mui/system';
|
|
4
5
|
import { GRID_DEFAULT_LOCALE_TEXT } from "../constants/index.js";
|
|
5
6
|
import { DATA_GRID_DEFAULT_SLOTS_COMPONENTS } from "../constants/defaultGridSlotsComponents.js";
|
|
6
7
|
import { computeSlots, useProps } from "../internals/utils/index.js";
|
|
@@ -19,12 +20,12 @@ const DATA_GRID_FORCED_PROPS = {
|
|
|
19
20
|
};
|
|
20
21
|
const defaultSlots = DATA_GRID_DEFAULT_SLOTS_COMPONENTS;
|
|
21
22
|
export const useDataGridProps = inProps => {
|
|
22
|
-
const
|
|
23
|
-
|
|
24
|
-
useThemeProps({
|
|
23
|
+
const theme = useTheme();
|
|
24
|
+
const themedProps = useProps(React.useMemo(() => getThemeProps({
|
|
25
25
|
props: inProps,
|
|
26
|
+
theme,
|
|
26
27
|
name: 'MuiDataGrid'
|
|
27
|
-
}));
|
|
28
|
+
}), [theme, inProps]));
|
|
28
29
|
const localeText = React.useMemo(() => _extends({}, GRID_DEFAULT_LOCALE_TEXT, themedProps.localeText), [themedProps.localeText]);
|
|
29
30
|
const slots = React.useMemo(() => computeSlots({
|
|
30
31
|
defaultSlots,
|
|
@@ -6,6 +6,7 @@ export interface GridColumnHeaderSortIconProps {
|
|
|
6
6
|
index: number | undefined;
|
|
7
7
|
sortingOrder: readonly GridSortDirection[];
|
|
8
8
|
disabled?: boolean;
|
|
9
|
+
className?: string;
|
|
9
10
|
}
|
|
10
11
|
declare function GridColumnHeaderSortIconRaw(props: GridColumnHeaderSortIconProps): React.JSX.Element | null;
|
|
11
12
|
declare namespace GridColumnHeaderSortIconRaw {
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
|
|
2
2
|
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
3
|
-
const _excluded = ["direction", "index", "sortingOrder", "disabled"];
|
|
3
|
+
const _excluded = ["direction", "index", "sortingOrder", "disabled", "className"];
|
|
4
4
|
import * as React from 'react';
|
|
5
5
|
import PropTypes from 'prop-types';
|
|
6
6
|
import composeClasses from '@mui/utils/composeClasses';
|
|
7
|
+
import clsx from 'clsx';
|
|
7
8
|
import { useGridApiContext } from "../../hooks/utils/useGridApiContext.js";
|
|
8
9
|
import { getDataGridUtilityClass } from "../../constants/gridClasses.js";
|
|
9
10
|
import { useGridRootProps } from "../../hooks/utils/useGridRootProps.js";
|
|
@@ -14,6 +15,7 @@ const useUtilityClasses = ownerState => {
|
|
|
14
15
|
classes
|
|
15
16
|
} = ownerState;
|
|
16
17
|
const slots = {
|
|
18
|
+
root: ['sortButton'],
|
|
17
19
|
icon: ['sortIcon']
|
|
18
20
|
};
|
|
19
21
|
return composeClasses(slots, getDataGridUtilityClass, classes);
|
|
@@ -39,7 +41,8 @@ function GridColumnHeaderSortIconRaw(props) {
|
|
|
39
41
|
direction,
|
|
40
42
|
index,
|
|
41
43
|
sortingOrder,
|
|
42
|
-
disabled
|
|
44
|
+
disabled,
|
|
45
|
+
className
|
|
43
46
|
} = props,
|
|
44
47
|
other = _objectWithoutPropertiesLoose(props, _excluded);
|
|
45
48
|
const apiRef = useGridApiContext();
|
|
@@ -57,7 +60,8 @@ function GridColumnHeaderSortIconRaw(props) {
|
|
|
57
60
|
"aria-label": apiRef.current.getLocaleText('columnHeaderSortIconLabel'),
|
|
58
61
|
title: apiRef.current.getLocaleText('columnHeaderSortIconLabel'),
|
|
59
62
|
size: "small",
|
|
60
|
-
disabled: disabled
|
|
63
|
+
disabled: disabled,
|
|
64
|
+
className: clsx(classes.root, className)
|
|
61
65
|
}, rootProps.slotProps?.baseIconButton, other, {
|
|
62
66
|
children: iconElement
|
|
63
67
|
}));
|
|
@@ -76,6 +80,7 @@ process.env.NODE_ENV !== "production" ? GridColumnHeaderSortIconRaw.propTypes =
|
|
|
76
80
|
// | These PropTypes are generated from the TypeScript type definitions |
|
|
77
81
|
// | To update them edit the TypeScript types and run "pnpm proptypes" |
|
|
78
82
|
// ----------------------------------------------------------------------
|
|
83
|
+
className: PropTypes.string,
|
|
79
84
|
direction: PropTypes.oneOf(['asc', 'desc']),
|
|
80
85
|
disabled: PropTypes.bool,
|
|
81
86
|
field: PropTypes.string.isRequired,
|
|
@@ -12,16 +12,6 @@ function getBorderColor(theme) {
|
|
|
12
12
|
}
|
|
13
13
|
return darken(alpha(theme.palette.divider, 1), 0.68);
|
|
14
14
|
}
|
|
15
|
-
const columnHeaderStyles = {
|
|
16
|
-
[`& .${c.iconButtonContainer}`]: {
|
|
17
|
-
visibility: 'visible',
|
|
18
|
-
width: 'auto'
|
|
19
|
-
},
|
|
20
|
-
[`& .${c.menuIcon}`]: {
|
|
21
|
-
width: 'auto',
|
|
22
|
-
visibility: 'visible'
|
|
23
|
-
}
|
|
24
|
-
};
|
|
25
15
|
const columnSeparatorTargetSize = 10;
|
|
26
16
|
const columnSeparatorOffset = -5;
|
|
27
17
|
const focusOutlineWidth = 1;
|
|
@@ -345,6 +335,9 @@ export const GridRootStyles = styled('div', {
|
|
|
345
335
|
overflow: 'hidden',
|
|
346
336
|
overflowAnchor: 'none',
|
|
347
337
|
// Keep the same scrolling position
|
|
338
|
+
transform: 'translate(0, 0)',
|
|
339
|
+
// Create a stacking context to keep scrollbars from showing on top
|
|
340
|
+
|
|
348
341
|
[`.${c.main} > *:first-child${ignoreSsrWarning}`]: {
|
|
349
342
|
borderTopLeftRadius: 'var(--unstable_DataGrid-radius)',
|
|
350
343
|
borderTopRightRadius: 'var(--unstable_DataGrid-radius)'
|
|
@@ -436,7 +429,7 @@ export const GridRootStyles = styled('div', {
|
|
|
436
429
|
visibility: 'visible',
|
|
437
430
|
width: 'auto'
|
|
438
431
|
},
|
|
439
|
-
[`& .${c.columnHeader}:not(.${c['columnHeader--sorted']}) .${c.
|
|
432
|
+
[`& .${c.columnHeader}:not(.${c['columnHeader--sorted']}) .${c.sortButton}`]: {
|
|
440
433
|
opacity: 0,
|
|
441
434
|
transition: t.transitions.create(['opacity'], {
|
|
442
435
|
duration: t.transitions.duration.shorter
|
|
@@ -504,13 +497,25 @@ export const GridRootStyles = styled('div', {
|
|
|
504
497
|
width: 'var(--DataGrid-rowWidth)'
|
|
505
498
|
},
|
|
506
499
|
'@media (hover: hover)': {
|
|
507
|
-
[`& .${c.columnHeader}:hover`]:
|
|
508
|
-
|
|
500
|
+
[`& .${c.columnHeader}:hover`]: {
|
|
501
|
+
[`& .${c.menuIcon}`]: {
|
|
502
|
+
width: 'auto',
|
|
503
|
+
visibility: 'visible'
|
|
504
|
+
},
|
|
505
|
+
[`& .${c.iconButtonContainer}`]: {
|
|
506
|
+
visibility: 'visible',
|
|
507
|
+
width: 'auto'
|
|
508
|
+
}
|
|
509
|
+
},
|
|
510
|
+
[`& .${c.columnHeader}:not(.${c['columnHeader--sorted']}):hover .${c.sortButton}`]: {
|
|
509
511
|
opacity: 0.5
|
|
510
512
|
}
|
|
511
513
|
},
|
|
512
514
|
'@media (hover: none)': {
|
|
513
|
-
[`& .${c.columnHeader}`]:
|
|
515
|
+
[`& .${c.columnHeader} .${c.menuIcon}`]: {
|
|
516
|
+
width: 'auto',
|
|
517
|
+
visibility: 'visible'
|
|
518
|
+
},
|
|
514
519
|
[`& .${c.columnHeader}:focus,
|
|
515
520
|
& .${c['columnHeader--siblingFocused']}`]: {
|
|
516
521
|
[`.${c['columnSeparator--resizable']}`]: {
|
|
@@ -574,6 +574,10 @@ export interface GridClasses {
|
|
|
574
574
|
* Styles applied to the footer selected row count element.
|
|
575
575
|
*/
|
|
576
576
|
selectedRowCount: string;
|
|
577
|
+
/**
|
|
578
|
+
* Styles applied to the sort button element.
|
|
579
|
+
*/
|
|
580
|
+
sortButton: string;
|
|
577
581
|
/**
|
|
578
582
|
* Styles applied to the sort icon element.
|
|
579
583
|
*/
|
package/constants/gridClasses.js
CHANGED
|
@@ -2,4 +2,4 @@ import { unstable_generateUtilityClasses as generateUtilityClasses, unstable_gen
|
|
|
2
2
|
export function getDataGridUtilityClass(slot) {
|
|
3
3
|
return generateUtilityClass('MuiDataGrid', slot);
|
|
4
4
|
}
|
|
5
|
-
export const gridClasses = generateUtilityClasses('MuiDataGrid', ['actionsCell', 'aggregationColumnHeader', 'aggregationColumnHeader--alignLeft', 'aggregationColumnHeader--alignCenter', 'aggregationColumnHeader--alignRight', 'aggregationColumnHeaderLabel', 'autoHeight', 'autosizing', 'booleanCell', 'cell--editable', 'cell--editing', 'cell--flex', 'cell--textCenter', 'cell--textLeft', 'cell--textRight', 'cell--rangeTop', 'cell--rangeBottom', 'cell--rangeLeft', 'cell--rangeRight', 'cell--pinnedLeft', 'cell--pinnedRight', 'cell--selectionMode', 'cell', 'cellCheckbox', 'cellEmpty', 'cellSkeleton', 'cellOffsetLeft', 'checkboxInput', 'columnHeader', 'columnHeader--alignCenter', 'columnHeader--alignLeft', 'columnHeader--alignRight', 'columnHeader--dragging', 'columnHeader--moving', 'columnHeader--numeric', 'columnHeader--sortable', 'columnHeader--sorted', 'columnHeader--filtered', 'columnHeader--pinnedLeft', 'columnHeader--pinnedRight', 'columnHeader--last', 'columnHeader--lastUnpinned', 'columnHeader--siblingFocused', 'columnHeaderCheckbox', 'columnHeaderDraggableContainer', 'columnHeaderTitle', 'columnHeaderTitleContainer', 'columnHeaderTitleContainerContent', 'columnHeader--filledGroup', 'columnHeader--emptyGroup', 'columnHeaders', 'columnSeparator--resizable', 'columnSeparator--resizing', 'columnSeparator--sideLeft', 'columnSeparator--sideRight', 'columnSeparator', 'columnsManagement', 'columnsManagementRow', 'columnsManagementHeader', 'columnsManagementSearchInput', 'columnsManagementFooter', 'container--top', 'container--bottom', 'detailPanel', 'detailPanels', 'detailPanelToggleCell', 'detailPanelToggleCell--expanded', 'footerCell', 'panel', 'panelHeader', 'panelWrapper', 'panelContent', 'panelFooter', 'paper', 'editBooleanCell', 'editInputCell', 'filler', 'filler--borderBottom', 'filler--pinnedLeft', 'filler--pinnedRight', 'filterForm', 'filterFormDeleteIcon', 'filterFormLogicOperatorInput', 'filterFormColumnInput', 'filterFormOperatorInput', 'filterFormValueInput', 'filterIcon', 'footerContainer', 'headerFilterRow', 'iconButtonContainer', 'iconSeparator', 'main', 'main--hasPinnedRight', 'main--hasSkeletonLoadingOverlay', 'menu', 'menuIcon', 'menuIconButton', 'menuOpen', 'menuList', 'overlay', 'overlayWrapper', 'overlayWrapperInner', 'root', 'root--densityStandard', 'root--densityComfortable', 'root--densityCompact', 'root--disableUserSelection', 'root--noToolbar', 'row', 'row--editable', 'row--editing', 'row--firstVisible', 'row--lastVisible', 'row--dragging', 'row--dynamicHeight', 'row--detailPanelExpanded', 'row--borderBottom', 'rowReorderCellPlaceholder', 'rowCount', 'rowReorderCellContainer', 'rowReorderCell', 'rowReorderCell--draggable', 'rowSkeleton', 'scrollArea--left', 'scrollArea--right', 'scrollArea', 'scrollbar', 'scrollbar--vertical', 'scrollbar--horizontal', 'scrollbarFiller', 'scrollbarFiller--header', 'scrollbarFiller--borderTop', 'scrollbarFiller--borderBottom', 'scrollbarFiller--pinnedRight', 'selectedRowCount', 'sortIcon', 'toolbarContainer', 'toolbarFilterList', 'virtualScroller', 'virtualScroller--hasScrollX', 'virtualScrollerContent', 'virtualScrollerContent--overflowed', 'virtualScrollerRenderZone', 'pinnedColumns', 'withVerticalBorder', 'withBorderColor', 'cell--withRightBorder', 'cell--withLeftBorder', 'columnHeader--withRightBorder', 'columnHeader--withLeftBorder', 'treeDataGroupingCell', 'treeDataGroupingCellToggle', 'treeDataGroupingCellLoadingContainer', 'groupingCriteriaCell', 'groupingCriteriaCellToggle', 'groupingCriteriaCellLoadingContainer', 'pinnedRows', 'pinnedRows--top', 'pinnedRows--bottom', 'pinnedRowsRenderZone']);
|
|
5
|
+
export const gridClasses = generateUtilityClasses('MuiDataGrid', ['actionsCell', 'aggregationColumnHeader', 'aggregationColumnHeader--alignLeft', 'aggregationColumnHeader--alignCenter', 'aggregationColumnHeader--alignRight', 'aggregationColumnHeaderLabel', 'autoHeight', 'autosizing', 'booleanCell', 'cell--editable', 'cell--editing', 'cell--flex', 'cell--textCenter', 'cell--textLeft', 'cell--textRight', 'cell--rangeTop', 'cell--rangeBottom', 'cell--rangeLeft', 'cell--rangeRight', 'cell--pinnedLeft', 'cell--pinnedRight', 'cell--selectionMode', 'cell', 'cellCheckbox', 'cellEmpty', 'cellSkeleton', 'cellOffsetLeft', 'checkboxInput', 'columnHeader', 'columnHeader--alignCenter', 'columnHeader--alignLeft', 'columnHeader--alignRight', 'columnHeader--dragging', 'columnHeader--moving', 'columnHeader--numeric', 'columnHeader--sortable', 'columnHeader--sorted', 'columnHeader--filtered', 'columnHeader--pinnedLeft', 'columnHeader--pinnedRight', 'columnHeader--last', 'columnHeader--lastUnpinned', 'columnHeader--siblingFocused', 'columnHeaderCheckbox', 'columnHeaderDraggableContainer', 'columnHeaderTitle', 'columnHeaderTitleContainer', 'columnHeaderTitleContainerContent', 'columnHeader--filledGroup', 'columnHeader--emptyGroup', 'columnHeaders', 'columnSeparator--resizable', 'columnSeparator--resizing', 'columnSeparator--sideLeft', 'columnSeparator--sideRight', 'columnSeparator', 'columnsManagement', 'columnsManagementRow', 'columnsManagementHeader', 'columnsManagementSearchInput', 'columnsManagementFooter', 'container--top', 'container--bottom', 'detailPanel', 'detailPanels', 'detailPanelToggleCell', 'detailPanelToggleCell--expanded', 'footerCell', 'panel', 'panelHeader', 'panelWrapper', 'panelContent', 'panelFooter', 'paper', 'editBooleanCell', 'editInputCell', 'filler', 'filler--borderBottom', 'filler--pinnedLeft', 'filler--pinnedRight', 'filterForm', 'filterFormDeleteIcon', 'filterFormLogicOperatorInput', 'filterFormColumnInput', 'filterFormOperatorInput', 'filterFormValueInput', 'filterIcon', 'footerContainer', 'headerFilterRow', 'iconButtonContainer', 'iconSeparator', 'main', 'main--hasPinnedRight', 'main--hasSkeletonLoadingOverlay', 'menu', 'menuIcon', 'menuIconButton', 'menuOpen', 'menuList', 'overlay', 'overlayWrapper', 'overlayWrapperInner', 'root', 'root--densityStandard', 'root--densityComfortable', 'root--densityCompact', 'root--disableUserSelection', 'root--noToolbar', 'row', 'row--editable', 'row--editing', 'row--firstVisible', 'row--lastVisible', 'row--dragging', 'row--dynamicHeight', 'row--detailPanelExpanded', 'row--borderBottom', 'rowReorderCellPlaceholder', 'rowCount', 'rowReorderCellContainer', 'rowReorderCell', 'rowReorderCell--draggable', 'rowSkeleton', 'scrollArea--left', 'scrollArea--right', 'scrollArea', 'scrollbar', 'scrollbar--vertical', 'scrollbar--horizontal', 'scrollbarFiller', 'scrollbarFiller--header', 'scrollbarFiller--borderTop', 'scrollbarFiller--borderBottom', 'scrollbarFiller--pinnedRight', 'selectedRowCount', 'sortButton', 'sortIcon', 'toolbarContainer', 'toolbarFilterList', 'virtualScroller', 'virtualScroller--hasScrollX', 'virtualScrollerContent', 'virtualScrollerContent--overflowed', 'virtualScrollerRenderZone', 'pinnedColumns', 'withVerticalBorder', 'withBorderColor', 'cell--withRightBorder', 'cell--withLeftBorder', 'columnHeader--withRightBorder', 'columnHeader--withLeftBorder', 'treeDataGroupingCell', 'treeDataGroupingCellToggle', 'treeDataGroupingCellLoadingContainer', 'groupingCriteriaCell', 'groupingCriteriaCellToggle', 'groupingCriteriaCellLoadingContainer', 'pinnedRows', 'pinnedRows--top', 'pinnedRows--bottom', 'pinnedRowsRenderZone']);
|
|
@@ -588,11 +588,6 @@ function computeRenderContext(inputs, scrollPosition, scrollCache) {
|
|
|
588
588
|
firstColumnIndex: 0,
|
|
589
589
|
lastColumnIndex: inputs.visibleColumns.length
|
|
590
590
|
};
|
|
591
|
-
if (inputs.listView) {
|
|
592
|
-
return _extends({}, renderContext, {
|
|
593
|
-
lastColumnIndex: 1
|
|
594
|
-
});
|
|
595
|
-
}
|
|
596
591
|
const {
|
|
597
592
|
top,
|
|
598
593
|
left
|
|
@@ -617,6 +612,11 @@ function computeRenderContext(inputs, scrollPosition, scrollCache) {
|
|
|
617
612
|
renderContext.firstRowIndex = firstRowIndex;
|
|
618
613
|
renderContext.lastRowIndex = lastRowIndex;
|
|
619
614
|
}
|
|
615
|
+
if (inputs.listView) {
|
|
616
|
+
return _extends({}, renderContext, {
|
|
617
|
+
lastColumnIndex: 1
|
|
618
|
+
});
|
|
619
|
+
}
|
|
620
620
|
if (inputs.enabledForColumns) {
|
|
621
621
|
let firstColumnIndex = 0;
|
|
622
622
|
let lastColumnIndex = inputs.columnPositions.length;
|
package/index.js
CHANGED
package/locales/hyAM.js
ADDED
|
@@ -0,0 +1,178 @@
|
|
|
1
|
+
import { hyAM as hyAMCore } from '@mui/material/locale';
|
|
2
|
+
import { getGridLocalization } from "../utils/getGridLocalization.js";
|
|
3
|
+
const hyAMGrid = {
|
|
4
|
+
// Root
|
|
5
|
+
noRowsLabel: 'Տվյալներ չկան',
|
|
6
|
+
noResultsOverlayLabel: 'Արդյունքներ չեն գտնվել։',
|
|
7
|
+
// Density selector toolbar button text
|
|
8
|
+
toolbarDensity: 'Խտություն',
|
|
9
|
+
toolbarDensityLabel: 'Խտություն',
|
|
10
|
+
toolbarDensityCompact: 'Կոմպակտ',
|
|
11
|
+
toolbarDensityStandard: 'Ստանդարտ',
|
|
12
|
+
toolbarDensityComfortable: 'Հարմարավետ',
|
|
13
|
+
// Columns selector toolbar button text
|
|
14
|
+
toolbarColumns: 'Սյունակներ',
|
|
15
|
+
toolbarColumnsLabel: 'Ընտրել սյունակներ',
|
|
16
|
+
// Filters toolbar button text
|
|
17
|
+
toolbarFilters: 'Զտիչներ',
|
|
18
|
+
toolbarFiltersLabel: 'Ցուցադրել զտիչները',
|
|
19
|
+
toolbarFiltersTooltipHide: 'Թաքցնել զտիչները',
|
|
20
|
+
toolbarFiltersTooltipShow: 'Ցուցադրել զտիչները',
|
|
21
|
+
toolbarFiltersTooltipActive: count => {
|
|
22
|
+
let pluralForm = 'ակտիվ զտիչ';
|
|
23
|
+
if (count === 1) {
|
|
24
|
+
pluralForm = 'ակտիվ զտիչ';
|
|
25
|
+
} else {
|
|
26
|
+
pluralForm = 'ակտիվ զտիչներ';
|
|
27
|
+
}
|
|
28
|
+
return `${count} ${pluralForm}`;
|
|
29
|
+
},
|
|
30
|
+
// Quick filter toolbar field
|
|
31
|
+
toolbarQuickFilterPlaceholder: 'Որոնել…',
|
|
32
|
+
toolbarQuickFilterLabel: 'Որոնել',
|
|
33
|
+
toolbarQuickFilterDeleteIconLabel: 'Մաքրել',
|
|
34
|
+
// Export selector toolbar button text
|
|
35
|
+
toolbarExport: 'Արտահանում',
|
|
36
|
+
toolbarExportLabel: 'Արտահանում',
|
|
37
|
+
toolbarExportCSV: 'Ներբեռնել CSV-ով',
|
|
38
|
+
toolbarExportPrint: 'Տպել',
|
|
39
|
+
toolbarExportExcel: 'Ներբեռնել Excel-ով',
|
|
40
|
+
// Columns management text
|
|
41
|
+
columnsManagementSearchTitle: 'Որոնել',
|
|
42
|
+
columnsManagementNoColumns: 'Սյունակներ չկան',
|
|
43
|
+
columnsManagementShowHideAllText: 'Ցուցադրել/Թաքցնել բոլորը',
|
|
44
|
+
columnsManagementReset: 'Վերակայել',
|
|
45
|
+
columnsManagementDeleteIconLabel: 'Հեռացնել',
|
|
46
|
+
// Filter panel text
|
|
47
|
+
filterPanelAddFilter: 'Ավելացնել զտիչ',
|
|
48
|
+
filterPanelRemoveAll: 'Հեռացնել բոլորը',
|
|
49
|
+
filterPanelDeleteIconLabel: 'Հեռացնել',
|
|
50
|
+
filterPanelLogicOperator: 'Տրամաբանական օպերատոր',
|
|
51
|
+
filterPanelOperator: 'Օպերատոր',
|
|
52
|
+
filterPanelOperatorAnd: 'Եվ',
|
|
53
|
+
filterPanelOperatorOr: 'Կամ',
|
|
54
|
+
filterPanelColumns: 'Սյունակներ',
|
|
55
|
+
filterPanelInputLabel: 'Արժեք',
|
|
56
|
+
filterPanelInputPlaceholder: 'Զտիչի արժեք',
|
|
57
|
+
// Filter operators text
|
|
58
|
+
filterOperatorContains: 'պարունակում է',
|
|
59
|
+
filterOperatorDoesNotContain: 'չի պարունակում',
|
|
60
|
+
filterOperatorEquals: 'հավասար է',
|
|
61
|
+
filterOperatorDoesNotEqual: 'հավասար չէ',
|
|
62
|
+
filterOperatorStartsWith: 'սկսվում է',
|
|
63
|
+
filterOperatorEndsWith: 'վերջանում է',
|
|
64
|
+
filterOperatorIs: 'է',
|
|
65
|
+
filterOperatorNot: 'չէ',
|
|
66
|
+
filterOperatorAfter: 'հետո է',
|
|
67
|
+
filterOperatorOnOrAfter: 'այդ օրը կամ հետո է',
|
|
68
|
+
filterOperatorBefore: 'մինչ է',
|
|
69
|
+
filterOperatorOnOrBefore: 'այդ օրը կամ առաջ է',
|
|
70
|
+
filterOperatorIsEmpty: 'դատարկ է',
|
|
71
|
+
filterOperatorIsNotEmpty: 'դատարկ չէ',
|
|
72
|
+
filterOperatorIsAnyOf: 'որևէ մեկը',
|
|
73
|
+
'filterOperator=': '=',
|
|
74
|
+
'filterOperator!=': '!=',
|
|
75
|
+
'filterOperator>': '>',
|
|
76
|
+
'filterOperator>=': '>=',
|
|
77
|
+
'filterOperator<': '<',
|
|
78
|
+
'filterOperator<=': '<=',
|
|
79
|
+
// Header filter operators text
|
|
80
|
+
headerFilterOperatorContains: 'Պարունակում է',
|
|
81
|
+
headerFilterOperatorDoesNotContain: 'Չի պարունակում',
|
|
82
|
+
headerFilterOperatorEquals: 'Հավասար է',
|
|
83
|
+
headerFilterOperatorDoesNotEqual: 'Հավասար չէ',
|
|
84
|
+
headerFilterOperatorStartsWith: 'Սկսվում է',
|
|
85
|
+
headerFilterOperatorEndsWith: 'Վերջանում է',
|
|
86
|
+
headerFilterOperatorIs: 'Է',
|
|
87
|
+
headerFilterOperatorNot: 'Չէ',
|
|
88
|
+
headerFilterOperatorAfter: 'Հետո է',
|
|
89
|
+
headerFilterOperatorOnOrAfter: 'Այդ օրը կամ հետո է',
|
|
90
|
+
headerFilterOperatorBefore: 'Մինչ է',
|
|
91
|
+
headerFilterOperatorOnOrBefore: 'Այդ օրը կամ առաջ է',
|
|
92
|
+
headerFilterOperatorIsEmpty: 'Դատարկ է',
|
|
93
|
+
headerFilterOperatorIsNotEmpty: 'Դատարկ չէ',
|
|
94
|
+
headerFilterOperatorIsAnyOf: 'Որևէ մեկը',
|
|
95
|
+
'headerFilterOperator=': 'Հավասար է',
|
|
96
|
+
'headerFilterOperator!=': 'Հավասար չէ',
|
|
97
|
+
'headerFilterOperator>': 'Ավելի մեծ է',
|
|
98
|
+
'headerFilterOperator>=': 'Ավելի մեծ կամ հավասար է',
|
|
99
|
+
'headerFilterOperator<': 'Ավելի փոքր է',
|
|
100
|
+
'headerFilterOperator<=': 'Ավելի փոքր կամ հավասար է',
|
|
101
|
+
// Filter values text
|
|
102
|
+
filterValueAny: 'ցանկացած',
|
|
103
|
+
filterValueTrue: 'այո',
|
|
104
|
+
filterValueFalse: 'ոչ',
|
|
105
|
+
// Column menu text
|
|
106
|
+
columnMenuLabel: 'Մենյու',
|
|
107
|
+
columnMenuAriaLabel: columnName => `${columnName} սյունակի մենյու`,
|
|
108
|
+
columnMenuShowColumns: 'Ցուցադրել սյունակները',
|
|
109
|
+
columnMenuManageColumns: 'Կառավարել սյունակները',
|
|
110
|
+
columnMenuFilter: 'Զտիչ',
|
|
111
|
+
columnMenuHideColumn: 'Թաքցնել',
|
|
112
|
+
columnMenuUnsort: 'Մաքրել դասավորումը',
|
|
113
|
+
columnMenuSortAsc: 'Աճման կարգով դասավորել',
|
|
114
|
+
columnMenuSortDesc: 'Նվազման կարգով դասավորել',
|
|
115
|
+
// Column header text
|
|
116
|
+
columnHeaderFiltersTooltipActive: count => {
|
|
117
|
+
let pluralForm = 'ակտիվ զտիչներ';
|
|
118
|
+
if (count === 1) {
|
|
119
|
+
pluralForm = 'ակտիվ զտիչ';
|
|
120
|
+
}
|
|
121
|
+
return `${count} ${pluralForm}`;
|
|
122
|
+
},
|
|
123
|
+
columnHeaderFiltersLabel: 'Ցուցադրել զտիչները',
|
|
124
|
+
columnHeaderSortIconLabel: 'Դասավորել',
|
|
125
|
+
// Rows selected footer text
|
|
126
|
+
footerRowSelected: count => {
|
|
127
|
+
let pluralForm = 'ընտրված տող';
|
|
128
|
+
if (count === 1) {
|
|
129
|
+
pluralForm = 'ընտրված տող';
|
|
130
|
+
} else {
|
|
131
|
+
pluralForm = 'ընտրված տողեր';
|
|
132
|
+
}
|
|
133
|
+
return `${count} ${pluralForm}`;
|
|
134
|
+
},
|
|
135
|
+
// Total row amount footer text
|
|
136
|
+
footerTotalRows: 'Ընդամենը տողեր:',
|
|
137
|
+
// Total visible row amount footer text
|
|
138
|
+
footerTotalVisibleRows: (visibleCount, totalCount) => {
|
|
139
|
+
return `${visibleCount.toLocaleString()} / ${totalCount.toLocaleString()}`;
|
|
140
|
+
},
|
|
141
|
+
// Checkbox selection text
|
|
142
|
+
checkboxSelectionHeaderName: 'Տողի ընտրություն',
|
|
143
|
+
checkboxSelectionSelectAllRows: 'Ընտրել բոլոր տողերը',
|
|
144
|
+
checkboxSelectionUnselectAllRows: 'Չընտրել բոլոր տողերը',
|
|
145
|
+
checkboxSelectionSelectRow: 'Ընտրել տողը',
|
|
146
|
+
checkboxSelectionUnselectRow: 'Չընտրել տողը',
|
|
147
|
+
// Boolean cell text
|
|
148
|
+
booleanCellTrueLabel: 'այո',
|
|
149
|
+
booleanCellFalseLabel: 'ոչ',
|
|
150
|
+
// Actions cell more text
|
|
151
|
+
actionsCellMore: 'ավելին',
|
|
152
|
+
// Column pinning text
|
|
153
|
+
pinToLeft: 'Կցել ձախ',
|
|
154
|
+
pinToRight: 'Կցել աջ',
|
|
155
|
+
unpin: 'Անջատել',
|
|
156
|
+
// Tree Data
|
|
157
|
+
treeDataGroupingHeaderName: 'Խումբ',
|
|
158
|
+
treeDataExpand: 'Բացել ենթատողերը',
|
|
159
|
+
treeDataCollapse: 'Փակել ենթատողերը',
|
|
160
|
+
// Grouping columns
|
|
161
|
+
groupingColumnHeaderName: 'Խմբավորում',
|
|
162
|
+
groupColumn: name => `Խմբավորել ըստ ${name}`,
|
|
163
|
+
unGroupColumn: name => `Չխմբավորել ըստ ${name}`,
|
|
164
|
+
// Master/detail
|
|
165
|
+
detailPanelToggle: 'Փոխարկել մանրամասն տեսքը',
|
|
166
|
+
expandDetailPanel: 'Բացել',
|
|
167
|
+
collapseDetailPanel: 'Փակել',
|
|
168
|
+
// Row reordering text
|
|
169
|
+
rowReorderingHeaderName: 'Տողերի վերադասավորում',
|
|
170
|
+
// Aggregation
|
|
171
|
+
aggregationMenuItemHeader: 'Ագրեգացում',
|
|
172
|
+
aggregationFunctionLabelSum: 'գումար',
|
|
173
|
+
aggregationFunctionLabelAvg: 'միջին',
|
|
174
|
+
aggregationFunctionLabelMin: 'մինիմում',
|
|
175
|
+
aggregationFunctionLabelMax: 'մաքսիմում',
|
|
176
|
+
aggregationFunctionLabelSize: 'քանակ'
|
|
177
|
+
};
|
|
178
|
+
export const hyAM = getGridLocalization(hyAMGrid, hyAMCore);
|
package/locales/index.d.ts
CHANGED
package/locales/index.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
2
|
import * as React from 'react';
|
|
3
|
-
import {
|
|
3
|
+
import { useTheme } from '@mui/material/styles';
|
|
4
|
+
import { getThemeProps } from '@mui/system';
|
|
4
5
|
import { GRID_DEFAULT_LOCALE_TEXT } from "../constants/index.js";
|
|
5
6
|
import { DATA_GRID_DEFAULT_SLOTS_COMPONENTS } from "../constants/defaultGridSlotsComponents.js";
|
|
6
7
|
import { computeSlots, useProps } from "../internals/utils/index.js";
|
|
@@ -19,12 +20,12 @@ const DATA_GRID_FORCED_PROPS = {
|
|
|
19
20
|
};
|
|
20
21
|
const defaultSlots = DATA_GRID_DEFAULT_SLOTS_COMPONENTS;
|
|
21
22
|
export const useDataGridProps = inProps => {
|
|
22
|
-
const
|
|
23
|
-
|
|
24
|
-
useThemeProps({
|
|
23
|
+
const theme = useTheme();
|
|
24
|
+
const themedProps = useProps(React.useMemo(() => getThemeProps({
|
|
25
25
|
props: inProps,
|
|
26
|
+
theme,
|
|
26
27
|
name: 'MuiDataGrid'
|
|
27
|
-
}));
|
|
28
|
+
}), [theme, inProps]));
|
|
28
29
|
const localeText = React.useMemo(() => _extends({}, GRID_DEFAULT_LOCALE_TEXT, themedProps.localeText), [themedProps.localeText]);
|
|
29
30
|
const slots = React.useMemo(() => computeSlots({
|
|
30
31
|
defaultSlots,
|