@mui/x-data-grid 6.18.2 → 6.18.4

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.
Files changed (75) hide show
  1. package/CHANGELOG.md +101 -1
  2. package/components/GridRow.js +2 -4
  3. package/components/cell/GridCell.js +15 -15
  4. package/components/cell/GridEditDateCell.js +1 -20
  5. package/components/columnHeaders/GridColumnGroupHeader.js +2 -1
  6. package/components/columnHeaders/GridColumnHeaderItem.js +2 -1
  7. package/components/panel/filterPanel/GridFilterForm.js +2 -2
  8. package/components/panel/filterPanel/GridFilterInputValue.js +1 -1
  9. package/hooks/features/editing/useGridCellEditing.js +8 -21
  10. package/hooks/features/editing/useGridRowEditing.js +7 -21
  11. package/hooks/features/keyboardNavigation/useGridKeyboardNavigation.js +2 -1
  12. package/hooks/features/rowSelection/useGridRowSelection.js +2 -1
  13. package/index.js +1 -1
  14. package/internals/index.d.ts +1 -1
  15. package/internals/index.js +1 -1
  16. package/legacy/components/GridRow.js +2 -4
  17. package/legacy/components/cell/GridCell.js +14 -14
  18. package/legacy/components/cell/GridEditDateCell.js +1 -20
  19. package/legacy/components/columnHeaders/GridColumnGroupHeader.js +2 -1
  20. package/legacy/components/columnHeaders/GridColumnHeaderItem.js +2 -1
  21. package/legacy/components/panel/filterPanel/GridFilterForm.js +2 -2
  22. package/legacy/components/panel/filterPanel/GridFilterInputValue.js +1 -1
  23. package/legacy/hooks/features/editing/useGridCellEditing.js +8 -21
  24. package/legacy/hooks/features/editing/useGridRowEditing.js +7 -23
  25. package/legacy/hooks/features/keyboardNavigation/useGridKeyboardNavigation.js +2 -1
  26. package/legacy/hooks/features/rowSelection/useGridRowSelection.js +2 -1
  27. package/legacy/index.js +1 -1
  28. package/legacy/internals/index.js +1 -1
  29. package/legacy/locales/bgBG.js +33 -37
  30. package/legacy/locales/daDK.js +37 -39
  31. package/legacy/models/params/gridEditCellParams.js +1 -0
  32. package/legacy/utils/domUtils.js +10 -1
  33. package/locales/bgBG.js +33 -37
  34. package/locales/daDK.js +37 -39
  35. package/models/api/gridEditingApi.d.ts +2 -4
  36. package/models/params/gridEditCellParams.d.ts +3 -1
  37. package/models/params/gridEditCellParams.js +1 -0
  38. package/models/params/gridRowParams.d.ts +1 -0
  39. package/modern/components/GridRow.js +2 -4
  40. package/modern/components/cell/GridCell.js +15 -15
  41. package/modern/components/cell/GridEditDateCell.js +1 -20
  42. package/modern/components/columnHeaders/GridColumnGroupHeader.js +2 -1
  43. package/modern/components/columnHeaders/GridColumnHeaderItem.js +2 -1
  44. package/modern/components/panel/filterPanel/GridFilterForm.js +2 -2
  45. package/modern/components/panel/filterPanel/GridFilterInputValue.js +1 -1
  46. package/modern/hooks/features/editing/useGridCellEditing.js +8 -21
  47. package/modern/hooks/features/editing/useGridRowEditing.js +7 -21
  48. package/modern/hooks/features/keyboardNavigation/useGridKeyboardNavigation.js +2 -1
  49. package/modern/hooks/features/rowSelection/useGridRowSelection.js +2 -1
  50. package/modern/index.js +1 -1
  51. package/modern/internals/index.js +1 -1
  52. package/modern/locales/bgBG.js +33 -37
  53. package/modern/locales/daDK.js +37 -39
  54. package/modern/models/params/gridEditCellParams.js +1 -0
  55. package/modern/utils/domUtils.js +10 -1
  56. package/node/components/GridRow.js +1 -3
  57. package/node/components/cell/GridCell.js +15 -15
  58. package/node/components/cell/GridEditDateCell.js +1 -20
  59. package/node/components/columnHeaders/GridColumnGroupHeader.js +2 -1
  60. package/node/components/columnHeaders/GridColumnHeaderItem.js +2 -1
  61. package/node/components/panel/filterPanel/GridFilterForm.js +2 -2
  62. package/node/components/panel/filterPanel/GridFilterInputValue.js +1 -1
  63. package/node/hooks/features/editing/useGridCellEditing.js +7 -20
  64. package/node/hooks/features/editing/useGridRowEditing.js +6 -20
  65. package/node/hooks/features/keyboardNavigation/useGridKeyboardNavigation.js +2 -1
  66. package/node/hooks/features/rowSelection/useGridRowSelection.js +2 -1
  67. package/node/index.js +1 -1
  68. package/node/internals/index.js +7 -0
  69. package/node/locales/bgBG.js +33 -37
  70. package/node/locales/daDK.js +37 -39
  71. package/node/models/params/gridEditCellParams.js +1 -0
  72. package/node/utils/domUtils.js +11 -1
  73. package/package.json +1 -1
  74. package/utils/domUtils.d.ts +2 -0
  75. package/utils/domUtils.js +10 -1
@@ -47,47 +47,45 @@ const daDKGrid = {
47
47
  filterPanelInputLabel: 'Værdi',
48
48
  filterPanelInputPlaceholder: 'Filter værdi',
49
49
  // Filter operators text
50
- filterOperatorContains: 'Indeholder',
51
- filterOperatorEquals: 'Lig med',
52
- filterOperatorStartsWith: 'Begynder med',
53
- filterOperatorEndsWith: 'Ender med',
54
- filterOperatorIs: 'Er lig med',
55
- filterOperatorNot: 'Er ikke lig med',
56
- filterOperatorAfter: 'Efter',
57
- filterOperatorOnOrAfter: ' eller efter',
58
- filterOperatorBefore: 'Før',
59
- filterOperatorOnOrBefore: ' eller før',
60
- filterOperatorIsEmpty: 'Indeholder ikke data',
61
- filterOperatorIsNotEmpty: 'Indeholder data',
50
+ filterOperatorContains: 'indeholder',
51
+ filterOperatorEquals: 'lig med',
52
+ filterOperatorStartsWith: 'begynder med',
53
+ filterOperatorEndsWith: 'ender med',
54
+ filterOperatorIs: 'er lig med',
55
+ filterOperatorNot: 'er ikke lig med',
56
+ filterOperatorAfter: 'efter',
57
+ filterOperatorOnOrAfter: ' eller efter',
58
+ filterOperatorBefore: 'før',
59
+ filterOperatorOnOrBefore: ' eller før',
60
+ filterOperatorIsEmpty: 'indeholder ikke data',
61
+ filterOperatorIsNotEmpty: 'indeholder data',
62
62
  filterOperatorIsAnyOf: 'indeholder en af',
63
- // 'filterOperator=': '=',
64
- // 'filterOperator!=': '!=',
65
- // 'filterOperator>': '>',
66
- // 'filterOperator>=': '>=',
67
- // 'filterOperator<': '<',
68
- // 'filterOperator<=': '<=',
69
-
63
+ 'filterOperator=': '=',
64
+ 'filterOperator!=': '!=',
65
+ 'filterOperator>': '>',
66
+ 'filterOperator>=': '>=',
67
+ 'filterOperator<': '<',
68
+ 'filterOperator<=': '<=',
70
69
  // Header filter operators text
71
- // headerFilterOperatorContains: 'Contains',
72
- // headerFilterOperatorEquals: 'Equals',
73
- // headerFilterOperatorStartsWith: 'Starts with',
74
- // headerFilterOperatorEndsWith: 'Ends with',
75
- // headerFilterOperatorIs: 'Is',
76
- // headerFilterOperatorNot: 'Is not',
77
- // headerFilterOperatorAfter: 'Is after',
78
- // headerFilterOperatorOnOrAfter: 'Is on or after',
79
- // headerFilterOperatorBefore: 'Is before',
80
- // headerFilterOperatorOnOrBefore: 'Is on or before',
81
- // headerFilterOperatorIsEmpty: 'Is empty',
82
- // headerFilterOperatorIsNotEmpty: 'Is not empty',
83
- // headerFilterOperatorIsAnyOf: 'Is any of',
84
- // 'headerFilterOperator=': 'Equals',
85
- // 'headerFilterOperator!=': 'Not equals',
86
- // 'headerFilterOperator>': 'Greater than',
87
- // 'headerFilterOperator>=': 'Greater than or equal to',
88
- // 'headerFilterOperator<': 'Less than',
89
- // 'headerFilterOperator<=': 'Less than or equal to',
90
-
70
+ headerFilterOperatorContains: 'Indeholder',
71
+ headerFilterOperatorEquals: 'Lig med',
72
+ headerFilterOperatorStartsWith: 'Begynder med',
73
+ headerFilterOperatorEndsWith: 'Ender med',
74
+ headerFilterOperatorIs: 'Er lig med',
75
+ headerFilterOperatorNot: 'Er ikke lig med',
76
+ headerFilterOperatorAfter: 'Efter',
77
+ headerFilterOperatorOnOrAfter: ' eller efter',
78
+ headerFilterOperatorBefore: 'Før',
79
+ headerFilterOperatorOnOrBefore: ' eller før',
80
+ headerFilterOperatorIsEmpty: 'Indeholder ikke data',
81
+ headerFilterOperatorIsNotEmpty: 'Indeholder data',
82
+ headerFilterOperatorIsAnyOf: 'Indeholder en af',
83
+ 'headerFilterOperator=': 'Lig med',
84
+ 'headerFilterOperator!=': 'Ikke lig med',
85
+ 'headerFilterOperator>': 'Større end',
86
+ 'headerFilterOperator>=': 'Større end eller lig med',
87
+ 'headerFilterOperator<': 'Mindre end',
88
+ 'headerFilterOperator<=': 'Mindre end eller lig med',
91
89
  // Filter values text
92
90
  filterValueAny: 'hvilken som helst',
93
91
  filterValueTrue: 'positiv',
@@ -6,6 +6,7 @@ var GridCellEditStartReasons = /*#__PURE__*/function (GridCellEditStartReasons)
6
6
  GridCellEditStartReasons["cellDoubleClick"] = "cellDoubleClick";
7
7
  GridCellEditStartReasons["printableKeyDown"] = "printableKeyDown";
8
8
  GridCellEditStartReasons["deleteKeyDown"] = "deleteKeyDown";
9
+ GridCellEditStartReasons["pasteKeyDown"] = "pasteKeyDown";
9
10
  return GridCellEditStartReasons;
10
11
  }(GridCellEditStartReasons || {});
11
12
  /**
@@ -51,4 +51,13 @@ export const getActiveElement = (root = document) => {
51
51
  return getActiveElement(activeEl.shadowRoot);
52
52
  }
53
53
  return activeEl;
54
- };
54
+ };
55
+ export function isEventTargetInPortal(event) {
56
+ if (
57
+ // The target is not an element when triggered by a Select inside the cell
58
+ // See https://github.com/mui/material-ui/issues/10534
59
+ event.target.nodeType === 1 && !event.currentTarget.contains(event.target)) {
60
+ return true;
61
+ }
62
+ return false;
63
+ }
@@ -145,9 +145,7 @@ const GridRow = /*#__PURE__*/React.forwardRef(function GridRow(props, refProp) {
145
145
  }, [apiRef, currentPage.range, index, rowHeight, rowId, position]);
146
146
  const publish = React.useCallback((eventName, propHandler) => event => {
147
147
  // Ignore portal
148
- // The target is not an element when triggered by a Select inside the cell
149
- // See https://github.com/mui/material-ui/issues/10534
150
- if (event.target.nodeType === 1 && !event.currentTarget.contains(event.target)) {
148
+ if ((0, _domUtils.isEventTargetInPortal)(event)) {
151
149
  return;
152
150
  }
153
151
 
@@ -22,8 +22,8 @@ var _gridFocusStateSelector = require("../../hooks/features/focus/gridFocusState
22
22
  var _useGridParamsApi = require("../../hooks/features/rows/useGridParamsApi");
23
23
  var _jsxRuntime = require("react/jsx-runtime");
24
24
  const _excluded = ["changeReason", "unstable_updateValueOnRender"],
25
- _excluded2 = ["align", "children", "editCellState", "colIndex", "column", "cellMode", "field", "formattedValue", "hasFocus", "height", "isEditable", "isSelected", "rowId", "tabIndex", "value", "width", "className", "showRightBorder", "extendRowFullWidth", "row", "colSpan", "disableDragEvents", "isNotVisible", "onClick", "onDoubleClick", "onMouseDown", "onMouseUp", "onMouseOver", "onKeyDown", "onKeyUp", "onDragEnter", "onDragOver"],
26
- _excluded3 = ["column", "rowId", "editCellState", "align", "children", "colIndex", "height", "width", "className", "showRightBorder", "extendRowFullWidth", "row", "colSpan", "disableDragEvents", "isNotVisible", "onClick", "onDoubleClick", "onMouseDown", "onMouseUp", "onMouseOver", "onKeyDown", "onKeyUp", "onDragEnter", "onDragOver"],
25
+ _excluded2 = ["align", "children", "editCellState", "colIndex", "column", "cellMode", "field", "formattedValue", "hasFocus", "height", "isEditable", "isSelected", "rowId", "tabIndex", "style", "value", "width", "className", "showRightBorder", "extendRowFullWidth", "row", "colSpan", "disableDragEvents", "isNotVisible", "onClick", "onDoubleClick", "onMouseDown", "onMouseUp", "onMouseOver", "onKeyDown", "onKeyUp", "onDragEnter", "onDragOver"],
26
+ _excluded3 = ["column", "rowId", "editCellState", "align", "children", "colIndex", "height", "width", "className", "showRightBorder", "extendRowFullWidth", "row", "colSpan", "disableDragEvents", "isNotVisible", "onClick", "onDoubleClick", "onMouseDown", "onMouseUp", "onMouseOver", "onKeyDown", "onKeyUp", "onDragEnter", "onDragOver", "style"],
27
27
  _excluded4 = ["changeReason", "unstable_updateValueOnRender"];
28
28
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
29
29
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -179,6 +179,7 @@ const GridCell = exports.GridCell = /*#__PURE__*/React.forwardRef((props, ref) =
179
179
  isSelected,
180
180
  rowId,
181
181
  tabIndex,
182
+ style: styleProp,
182
183
  value,
183
184
  width,
184
185
  className,
@@ -245,15 +246,14 @@ const GridCell = exports.GridCell = /*#__PURE__*/React.forwardRef((props, ref) =
245
246
  border: 0
246
247
  };
247
248
  }
248
- const cellStyle = {
249
+ const cellStyle = (0, _extends2.default)({
249
250
  minWidth: width,
250
251
  maxWidth: width,
251
252
  minHeight: height,
252
- maxHeight: height === 'auto' ? 'none' : height // max-height doesn't support "auto"
253
- };
254
-
253
+ maxHeight: height === 'auto' ? 'none' : height
254
+ }, styleProp);
255
255
  return cellStyle;
256
- }, [width, height, isNotVisible]);
256
+ }, [width, height, isNotVisible, styleProp]);
257
257
  React.useEffect(() => {
258
258
  if (!hasFocus || cellMode === _models.GridCellModes.Edit) {
259
259
  return;
@@ -414,7 +414,8 @@ const GridCellV7 = /*#__PURE__*/React.forwardRef((props, ref) => {
414
414
  onKeyDown,
415
415
  onKeyUp,
416
416
  onDragEnter,
417
- onDragOver
417
+ onDragOver,
418
+ style: styleProp
418
419
  } = props,
419
420
  other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded3);
420
421
  const apiRef = (0, _useGridApiContext.useGridApiContext)();
@@ -505,22 +506,21 @@ const GridCellV7 = /*#__PURE__*/React.forwardRef((props, ref) => {
505
506
  }, [apiRef, field, rowId]);
506
507
  const style = React.useMemo(() => {
507
508
  if (isNotVisible) {
508
- return {
509
+ return (0, _extends2.default)({
509
510
  padding: 0,
510
511
  opacity: 0,
511
512
  width: 0,
512
513
  border: 0
513
- };
514
+ }, styleProp);
514
515
  }
515
- const cellStyle = {
516
+ const cellStyle = (0, _extends2.default)({
516
517
  minWidth: width,
517
518
  maxWidth: width,
518
519
  minHeight: height,
519
- maxHeight: height === 'auto' ? 'none' : height // max-height doesn't support "auto"
520
- };
521
-
520
+ maxHeight: height === 'auto' ? 'none' : height
521
+ }, styleProp);
522
522
  return cellStyle;
523
- }, [width, height, isNotVisible]);
523
+ }, [width, height, isNotVisible, styleProp]);
524
524
  React.useEffect(() => {
525
525
  if (!hasFocus || cellMode === _models.GridCellModes.Edit) {
526
526
  return;
@@ -73,7 +73,6 @@ function GridEditDateCell(props) {
73
73
  classes: rootProps.classes
74
74
  };
75
75
  const classes = useUtilityClasses(ownerState);
76
- const hasUpdatedEditValueOnMount = React.useRef(false);
77
76
  const parseValueToDate = React.useCallback(value => {
78
77
  if (value === '') {
79
78
  return null;
@@ -118,26 +117,8 @@ function GridEditDateCell(props) {
118
117
  inputRef.current.focus();
119
118
  }
120
119
  }, [hasFocus]);
121
- const meta = apiRef.current.unstable_getEditCellMeta(id, field);
122
- const handleInputRef = el => {
123
- inputRef.current = el;
124
- if (meta?.unstable_updateValueOnRender && !hasUpdatedEditValueOnMount.current) {
125
- const inputValue = inputRef.current.value;
126
- const parsedDate = parseValueToDate(inputValue);
127
- setValueState({
128
- parsed: parsedDate,
129
- formatted: inputValue
130
- });
131
- apiRef.current.setEditCellValue({
132
- id,
133
- field,
134
- value: parsedDate
135
- });
136
- hasUpdatedEditValueOnMount.current = true;
137
- }
138
- };
139
120
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledInputBase, (0, _extends2.default)({
140
- inputRef: handleInputRef,
121
+ inputRef: inputRef,
141
122
  fullWidth: true,
142
123
  className: classes.root,
143
124
  type: isDateTime ? 'datetime-local' : 'date',
@@ -14,6 +14,7 @@ var _gridColumnGroupsSelector = require("../../hooks/features/columnGrouping/gri
14
14
  var _useGridApiContext = require("../../hooks/utils/useGridApiContext");
15
15
  var _useGridSelector = require("../../hooks/utils/useGridSelector");
16
16
  var _GridGenericColumnHeaderItem = require("./GridGenericColumnHeaderItem");
17
+ var _domUtils = require("../../utils/domUtils");
17
18
  var _jsxRuntime = require("react/jsx-runtime");
18
19
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
19
20
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -93,7 +94,7 @@ function GridColumnGroupHeader(props) {
93
94
  const publish = React.useCallback(eventName => event => {
94
95
  // Ignore portal
95
96
  // See https://github.com/mui/mui-x/issues/1721
96
- if (!event.currentTarget.contains(event.target)) {
97
+ if ((0, _domUtils.isEventTargetInPortal)(event)) {
97
98
  return;
98
99
  }
99
100
  apiRef.current.publishEvent(eventName, renderParams, event);
@@ -16,6 +16,7 @@ var _GridColumnHeaderMenu = require("../menu/columnMenu/GridColumnHeaderMenu");
16
16
  var _gridClasses = require("../../constants/gridClasses");
17
17
  var _useGridRootProps = require("../../hooks/utils/useGridRootProps");
18
18
  var _GridGenericColumnHeaderItem = require("./GridGenericColumnHeaderItem");
19
+ var _domUtils = require("../../utils/domUtils");
19
20
  var _jsxRuntime = require("react/jsx-runtime");
20
21
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
21
22
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -75,7 +76,7 @@ function GridColumnHeaderItem(props) {
75
76
  const publish = React.useCallback(eventName => event => {
76
77
  // Ignore portal
77
78
  // See https://github.com/mui/mui-x/issues/1721
78
- if (!event.currentTarget.contains(event.target)) {
79
+ if ((0, _domUtils.isEventTargetInPortal)(event)) {
79
80
  return;
80
81
  }
81
82
  apiRef.current.publishEvent(eventName, apiRef.current.getColumnHeaderParams(colDef.field), event);
@@ -184,8 +184,8 @@ const GridFilterForm = exports.GridFilterForm = /*#__PURE__*/React.forwardRef(fu
184
184
  // try to keep the same operator when column change
185
185
  const newOperator = column.filterOperators.find(operator => operator.value === item.operator) || column.filterOperators[0];
186
186
 
187
- // Erase filter value if the input component is modified
188
- const eraseItemValue = !newOperator.InputComponent || newOperator.InputComponent !== currentOperator?.InputComponent;
187
+ // Erase filter value if the input component or filtered column type is modified
188
+ const eraseItemValue = !newOperator.InputComponent || newOperator.InputComponent !== currentOperator?.InputComponent || column.type !== currentColumn.type;
189
189
  applyFilterChanges((0, _extends2.default)({}, item, {
190
190
  field,
191
191
  operator: newOperator.value,
@@ -51,7 +51,7 @@ function GridFilterInputValue(props) {
51
51
  }, [id, applyValue, item, rootProps.filterDebounceMs, filterTimeout]);
52
52
  React.useEffect(() => {
53
53
  const itemPlusTag = item;
54
- if (itemPlusTag.fromInput !== id) {
54
+ if (itemPlusTag.fromInput !== id || item.value === undefined) {
55
55
  setFilterValueState(String(item.value ?? ''));
56
56
  }
57
57
  }, [id, item]);
@@ -110,7 +110,7 @@ const useGridCellEditing = (apiRef, props) => {
110
110
  if ((0, _keyboardUtils.isPrintableKey)(event)) {
111
111
  reason = _gridEditCellParams.GridCellEditStartReasons.printableKeyDown;
112
112
  } else if ((event.ctrlKey || event.metaKey) && event.key === 'v') {
113
- reason = _gridEditCellParams.GridCellEditStartReasons.printableKeyDown;
113
+ reason = _gridEditCellParams.GridCellEditStartReasons.pasteKeyDown;
114
114
  } else if (event.key === 'Enter') {
115
115
  reason = _gridEditCellParams.GridCellEditStartReasons.enterKeyDown;
116
116
  } else if (event.key === 'Delete' || event.key === 'Backspace') {
@@ -130,24 +130,13 @@ const useGridCellEditing = (apiRef, props) => {
130
130
  const {
131
131
  id,
132
132
  field,
133
- reason,
134
- key,
135
- colDef
133
+ reason
136
134
  } = params;
137
135
  const startCellEditModeParams = {
138
136
  id,
139
137
  field
140
138
  };
141
- if (reason === _gridEditCellParams.GridCellEditStartReasons.printableKeyDown) {
142
- if (React.version.startsWith('17')) {
143
- // In React 17, cleaning the input is enough.
144
- // The sequence of events makes the key pressed by the end-users update the textbox directly.
145
- startCellEditModeParams.deleteValue = true;
146
- } else {
147
- const initialValue = colDef.valueParser ? colDef.valueParser(key) : key;
148
- startCellEditModeParams.initialValue = initialValue;
149
- }
150
- } else if (reason === _gridEditCellParams.GridCellEditStartReasons.deleteKeyDown) {
139
+ if (reason === _gridEditCellParams.GridCellEditStartReasons.printableKeyDown || reason === _gridEditCellParams.GridCellEditStartReasons.deleteKeyDown || reason === _gridEditCellParams.GridCellEditStartReasons.pasteKeyDown) {
151
140
  startCellEditModeParams.deleteValue = true;
152
141
  }
153
142
  apiRef.current.startCellEditMode(startCellEditModeParams);
@@ -257,17 +246,13 @@ const useGridCellEditing = (apiRef, props) => {
257
246
  initialValue
258
247
  } = params;
259
248
  let newValue = apiRef.current.getCellValue(id, field);
260
- // eslint-disable-next-line @typescript-eslint/naming-convention
261
- let unstable_updateValueOnRender = false;
262
249
  if (deleteValue || initialValue) {
263
250
  newValue = deleteValue ? '' : initialValue;
264
- unstable_updateValueOnRender = true;
265
251
  }
266
252
  const newProps = {
267
253
  value: newValue,
268
254
  error: false,
269
- isProcessingProps: false,
270
- unstable_updateValueOnRender
255
+ isProcessingProps: false
271
256
  };
272
257
  updateOrDeleteFieldState(id, field, newProps);
273
258
  apiRef.current.setCellFocus(id, field);
@@ -431,7 +416,9 @@ const useGridCellEditing = (apiRef, props) => {
431
416
  updateCellModesModel(cellModesModelProp);
432
417
  }
433
418
  }, [cellModesModelProp, updateCellModesModel]);
434
- React.useEffect(() => {
419
+
420
+ // Run this effect synchronously so that the keyboard event can impact the yet-to-be-rendered input.
421
+ (0, _utils.unstable_useEnhancedEffect)(() => {
435
422
  const idToIdLookup = (0, _gridRowsSelector.gridRowsDataRowIdToIdLookupSelector)(apiRef);
436
423
 
437
424
  // Update the ref here because updateStateToStopCellEditMode may change it later
@@ -180,7 +180,6 @@ const useGridRowEditing = (apiRef, props) => {
180
180
  const rowParams = apiRef.current.getRowParams(params.id);
181
181
  const newParams = (0, _extends2.default)({}, rowParams, {
182
182
  field: params.field,
183
- key: event.key,
184
183
  reason
185
184
  });
186
185
  apiRef.current.publishEvent('rowEditStart', newParams, event);
@@ -191,24 +190,13 @@ const useGridRowEditing = (apiRef, props) => {
191
190
  const {
192
191
  id,
193
192
  field,
194
- reason,
195
- key,
196
- columns
193
+ reason
197
194
  } = params;
198
195
  const startRowEditModeParams = {
199
196
  id,
200
197
  fieldToFocus: field
201
198
  };
202
- if (reason === _gridRowParams.GridRowEditStartReasons.printableKeyDown) {
203
- if (React.version.startsWith('17')) {
204
- // In React 17, cleaning the input is enough.
205
- // The sequence of events makes the key pressed by the end-users update the textbox directly.
206
- startRowEditModeParams.deleteValue = !!field;
207
- } else {
208
- const colDef = columns.find(col => col.field === field);
209
- startRowEditModeParams.initialValue = colDef.valueParser ? colDef.valueParser(key) : key;
210
- }
211
- } else if (reason === _gridRowParams.GridRowEditStartReasons.deleteKeyDown) {
199
+ if (reason === _gridRowParams.GridRowEditStartReasons.printableKeyDown || reason === _gridRowParams.GridRowEditStartReasons.deleteKeyDown) {
212
200
  startRowEditModeParams.deleteValue = !!field;
213
201
  }
214
202
  apiRef.current.startRowEditMode(startRowEditModeParams);
@@ -331,17 +319,13 @@ const useGridRowEditing = (apiRef, props) => {
331
319
  return acc;
332
320
  }
333
321
  let newValue = apiRef.current.getCellValue(id, field);
334
- // eslint-disable-next-line @typescript-eslint/naming-convention
335
- let unstable_updateValueOnRender = false;
336
322
  if (fieldToFocus === field && (deleteValue || initialValue)) {
337
323
  newValue = deleteValue ? '' : initialValue;
338
- unstable_updateValueOnRender = true;
339
324
  }
340
325
  acc[field] = {
341
326
  value: newValue,
342
327
  error: false,
343
- isProcessingProps: false,
344
- unstable_updateValueOnRender
328
+ isProcessingProps: false
345
329
  };
346
330
  return acc;
347
331
  }, {});
@@ -561,7 +545,9 @@ const useGridRowEditing = (apiRef, props) => {
561
545
  updateRowModesModel(rowModesModelProp);
562
546
  }
563
547
  }, [rowModesModelProp, updateRowModesModel]);
564
- React.useEffect(() => {
548
+
549
+ // Run this effect synchronously so that the keyboard event can impact the yet-to-be-rendered input.
550
+ (0, _utils.unstable_useEnhancedEffect)(() => {
565
551
  const idToIdLookup = (0, _gridRowsSelector.gridRowsDataRowIdToIdLookupSelector)(apiRef);
566
552
 
567
553
  // Update the ref here because updateStateToStopRowEditMode may change it later
@@ -21,6 +21,7 @@ var _focus = require("../focus");
21
21
  var _gridColumnGroupsSelector = require("../columnGrouping/gridColumnGroupsSelector");
22
22
  var _gridHeaderFilteringSelectors = require("../headerFiltering/gridHeaderFilteringSelectors");
23
23
  var _pipeProcessing = require("../../core/pipeProcessing");
24
+ var _domUtils = require("../../../utils/domUtils");
24
25
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
25
26
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
26
27
  function enrichPageRowsWithPinnedRows(apiRef, rows) {
@@ -421,7 +422,7 @@ const useGridKeyboardNavigation = (apiRef, props) => {
421
422
  }, [apiRef, currentPageRows.length, goToHeader, goToGroupHeader, goToCell, getRowIdFromIndex]);
422
423
  const handleCellKeyDown = React.useCallback((params, event) => {
423
424
  // Ignore portal
424
- if (!event.currentTarget.contains(event.target)) {
425
+ if ((0, _domUtils.isEventTargetInPortal)(event)) {
425
426
  return;
426
427
  }
427
428
 
@@ -21,6 +21,7 @@ var _keyboardUtils = require("../../../utils/keyboardUtils");
21
21
  var _useGridVisibleRows = require("../../utils/useGridVisibleRows");
22
22
  var _gridDetailPanelToggleField = require("../../../constants/gridDetailPanelToggleField");
23
23
  var _gridClasses = require("../../../constants/gridClasses");
24
+ var _domUtils = require("../../../utils/domUtils");
24
25
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
25
26
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
26
27
  const getSelectionModelPropValue = (selectionModelProp, prevSelectionModel) => {
@@ -293,7 +294,7 @@ const useGridRowSelection = (apiRef, props) => {
293
294
 
294
295
  // Ignore portal
295
296
  // Do not apply shortcuts if the focus is not on the cell root component
296
- if (!event.currentTarget.contains(event.target)) {
297
+ if ((0, _domUtils.isEventTargetInPortal)(event)) {
297
298
  return;
298
299
  }
299
300
  if ((0, _keyboardUtils.isNavigationKey)(event.key) && event.shiftKey) {
package/node/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @mui/x-data-grid v6.18.2
2
+ * @mui/x-data-grid v6.18.4
3
3
  *
4
4
  * @license MIT
5
5
  * This source code is licensed under the MIT license found in the
@@ -84,6 +84,7 @@ var _exportNames = {
84
84
  unstable_resetCreateSelectorCache: true,
85
85
  findParentElementFromClassName: true,
86
86
  getActiveElement: true,
87
+ isEventTargetInPortal: true,
87
88
  isNavigationKey: true,
88
89
  clamp: true,
89
90
  isDeepEqual: true,
@@ -323,6 +324,12 @@ Object.defineProperty(exports, "isDeepEqual", {
323
324
  return _utils2.isDeepEqual;
324
325
  }
325
326
  });
327
+ Object.defineProperty(exports, "isEventTargetInPortal", {
328
+ enumerable: true,
329
+ get: function () {
330
+ return _domUtils.isEventTargetInPortal;
331
+ }
332
+ });
326
333
  Object.defineProperty(exports, "isFunction", {
327
334
  enumerable: true,
328
335
  get: function () {
@@ -66,34 +66,32 @@ const bgBGGrid = {
66
66
  filterOperatorIsEmpty: 'е празен',
67
67
  filterOperatorIsNotEmpty: 'не е празен',
68
68
  filterOperatorIsAnyOf: 'е някой от',
69
- // 'filterOperator=': '=',
70
- // 'filterOperator!=': '!=',
71
- // 'filterOperator>': '>',
72
- // 'filterOperator>=': '>=',
73
- // 'filterOperator<': '<',
74
- // 'filterOperator<=': '<=',
75
-
69
+ 'filterOperator=': '=',
70
+ 'filterOperator!=': '!=',
71
+ 'filterOperator>': '>',
72
+ 'filterOperator>=': '>=',
73
+ 'filterOperator<': '<',
74
+ 'filterOperator<=': '<=',
76
75
  // Header filter operators text
77
- // headerFilterOperatorContains: 'Contains',
78
- // headerFilterOperatorEquals: 'Equals',
79
- // headerFilterOperatorStartsWith: 'Starts with',
80
- // headerFilterOperatorEndsWith: 'Ends with',
81
- // headerFilterOperatorIs: 'Is',
82
- // headerFilterOperatorNot: 'Is not',
83
- // headerFilterOperatorAfter: 'Is after',
84
- // headerFilterOperatorOnOrAfter: 'Is on or after',
85
- // headerFilterOperatorBefore: 'Is before',
86
- // headerFilterOperatorOnOrBefore: 'Is on or before',
87
- // headerFilterOperatorIsEmpty: 'Is empty',
88
- // headerFilterOperatorIsNotEmpty: 'Is not empty',
89
- // headerFilterOperatorIsAnyOf: 'Is any of',
90
- // 'headerFilterOperator=': 'Equals',
91
- // 'headerFilterOperator!=': 'Not equals',
92
- // 'headerFilterOperator>': 'Greater than',
93
- // 'headerFilterOperator>=': 'Greater than or equal to',
94
- // 'headerFilterOperator<': 'Less than',
95
- // 'headerFilterOperator<=': 'Less than or equal to',
96
-
76
+ headerFilterOperatorContains: 'Съдържа',
77
+ headerFilterOperatorEquals: 'Равнo',
78
+ headerFilterOperatorStartsWith: 'Започва с',
79
+ headerFilterOperatorEndsWith: 'Завършва с',
80
+ headerFilterOperatorIs: 'Равно е на',
81
+ headerFilterOperatorNot: 'Не се равнява на',
82
+ headerFilterOperatorAfter: 'След',
83
+ headerFilterOperatorOnOrAfter: 'След (включително)',
84
+ headerFilterOperatorBefore: 'Преди',
85
+ headerFilterOperatorOnOrBefore: 'Преди (включително)',
86
+ headerFilterOperatorIsEmpty: 'Празен',
87
+ headerFilterOperatorIsNotEmpty: 'Не е празен',
88
+ headerFilterOperatorIsAnyOf: 'Всичко от',
89
+ 'headerFilterOperator=': 'Равно',
90
+ 'headerFilterOperator!=': 'Различно',
91
+ 'headerFilterOperator>': 'По-голямо от',
92
+ 'headerFilterOperator>=': 'По-голямо или равно на',
93
+ 'headerFilterOperator<': 'По-малко от',
94
+ 'headerFilterOperator<=': 'По-малко или равно на',
97
95
  // Filter values text
98
96
  filterValueAny: 'всякакви',
99
97
  filterValueTrue: 'вярно',
@@ -141,19 +139,17 @@ const bgBGGrid = {
141
139
  groupColumn: name => `Групирай по ${name}`,
142
140
  unGroupColumn: name => `Спри групиране по ${name}`,
143
141
  // Master/detail
144
- // detailPanelToggle: 'Detail panel toggle',
142
+ detailPanelToggle: 'Превключване на панела с детайли',
145
143
  expandDetailPanel: 'Разгъване',
146
144
  collapseDetailPanel: 'Свиване',
147
145
  // Row reordering text
148
- rowReorderingHeaderName: 'Подредба на редове'
149
-
146
+ rowReorderingHeaderName: 'Подредба на редове',
150
147
  // Aggregation
151
- // aggregationMenuItemHeader: 'Aggregation',
152
- // aggregationFunctionLabelSum: 'sum',
153
- // aggregationFunctionLabelAvg: 'avg',
154
- // aggregationFunctionLabelMin: 'min',
155
- // aggregationFunctionLabelMax: 'max',
156
- // aggregationFunctionLabelSize: 'size',
148
+ aggregationMenuItemHeader: 'Агрегиране',
149
+ aggregationFunctionLabelSum: 'сума',
150
+ aggregationFunctionLabelAvg: 'срст',
151
+ aggregationFunctionLabelMin: 'мин',
152
+ aggregationFunctionLabelMax: 'макс',
153
+ aggregationFunctionLabelSize: 'размер'
157
154
  };
158
-
159
155
  const bgBG = exports.bgBG = (0, _getGridLocalization.getGridLocalization)(bgBGGrid, _locale.bgBG);