@mui/x-data-grid 7.0.0-alpha.1 → 7.0.0-alpha.3

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 (140) hide show
  1. package/CHANGELOG.md +607 -188
  2. package/DataGrid/DataGrid.d.ts +0 -10
  3. package/DataGrid/DataGrid.js +11 -23
  4. package/DataGrid/useDataGridProps.js +1 -1
  5. package/README.md +0 -1
  6. package/components/GridHeader.js +3 -2
  7. package/components/GridPagination.d.ts +2 -2
  8. package/components/GridRow.js +2 -4
  9. package/components/cell/GridCell.js +3 -3
  10. package/components/cell/GridEditDateCell.js +1 -20
  11. package/components/columnHeaders/GridColumnGroupHeader.js +2 -1
  12. package/components/columnHeaders/GridColumnHeaderItem.js +2 -1
  13. package/components/menu/columnMenu/menuItems/GridColumnMenuSortItem.js +1 -1
  14. package/components/panel/filterPanel/GridFilterForm.js +2 -2
  15. package/components/panel/filterPanel/GridFilterInputValue.js +1 -1
  16. package/components/panel/index.d.ts +0 -1
  17. package/components/panel/index.js +0 -1
  18. package/constants/defaultGridSlotsComponents.js +1 -2
  19. package/hooks/features/clipboard/useGridClipboard.d.ts +1 -1
  20. package/hooks/features/clipboard/useGridClipboard.js +1 -1
  21. package/hooks/features/editing/useGridCellEditing.js +8 -21
  22. package/hooks/features/editing/useGridRowEditing.js +7 -21
  23. package/hooks/features/export/useGridCsvExport.d.ts +1 -1
  24. package/hooks/features/export/useGridCsvExport.js +1 -1
  25. package/hooks/features/filter/gridFilterUtils.d.ts +1 -0
  26. package/hooks/features/filter/gridFilterUtils.js +7 -4
  27. package/hooks/features/filter/useGridFilter.js +2 -2
  28. package/hooks/features/keyboardNavigation/useGridKeyboardNavigation.js +2 -1
  29. package/hooks/features/rowSelection/useGridRowSelection.js +2 -1
  30. package/hooks/features/sorting/useGridSorting.js +6 -5
  31. package/index.js +1 -1
  32. package/internals/index.d.ts +1 -1
  33. package/internals/index.js +1 -1
  34. package/legacy/DataGrid/DataGrid.js +11 -23
  35. package/legacy/DataGrid/useDataGridProps.js +1 -1
  36. package/legacy/colDef/gridDefaultColumnTypes.js +2 -3
  37. package/legacy/components/GridHeader.js +3 -2
  38. package/legacy/components/GridPagination.js +3 -4
  39. package/legacy/components/GridRow.js +2 -4
  40. package/legacy/components/cell/GridCell.js +3 -3
  41. package/legacy/components/cell/GridEditDateCell.js +1 -20
  42. package/legacy/components/columnHeaders/GridColumnGroupHeader.js +2 -1
  43. package/legacy/components/columnHeaders/GridColumnHeaderItem.js +2 -1
  44. package/legacy/components/columnHeaders/GridColumnHeadersInner.js +4 -5
  45. package/legacy/components/containers/GridRootStyles.js +69 -70
  46. package/legacy/components/menu/columnMenu/menuItems/GridColumnMenuSortItem.js +1 -1
  47. package/legacy/components/panel/filterPanel/GridFilterForm.js +2 -2
  48. package/legacy/components/panel/filterPanel/GridFilterInputValue.js +1 -1
  49. package/legacy/components/panel/index.js +0 -1
  50. package/legacy/components/toolbar/GridToolbarQuickFilter.js +4 -5
  51. package/legacy/constants/defaultGridSlotsComponents.js +1 -2
  52. package/legacy/hooks/features/clipboard/useGridClipboard.js +1 -1
  53. package/legacy/hooks/features/editing/useGridCellEditing.js +8 -21
  54. package/legacy/hooks/features/editing/useGridRowEditing.js +7 -23
  55. package/legacy/hooks/features/export/useGridCsvExport.js +1 -1
  56. package/legacy/hooks/features/filter/gridFilterUtils.js +7 -4
  57. package/legacy/hooks/features/filter/useGridFilter.js +2 -2
  58. package/legacy/hooks/features/keyboardNavigation/useGridKeyboardNavigation.js +2 -1
  59. package/legacy/hooks/features/rowSelection/useGridRowSelection.js +2 -1
  60. package/legacy/hooks/features/sorting/useGridSorting.js +6 -5
  61. package/legacy/index.js +1 -1
  62. package/legacy/internals/index.js +1 -1
  63. package/legacy/locales/arSD.js +1 -1
  64. package/legacy/locales/bgBG.js +33 -37
  65. package/legacy/locales/heIL.js +1 -2
  66. package/legacy/models/params/gridEditCellParams.js +1 -0
  67. package/legacy/utils/domUtils.js +10 -15
  68. package/locales/arSD.js +1 -1
  69. package/locales/bgBG.js +33 -37
  70. package/locales/heIL.js +1 -2
  71. package/models/api/gridEditingApi.d.ts +2 -4
  72. package/models/api/gridSortApi.d.ts +2 -2
  73. package/models/gridFilterModel.d.ts +2 -2
  74. package/models/gridSlotsComponent.d.ts +0 -5
  75. package/models/gridSlotsComponentsProps.d.ts +0 -3
  76. package/models/params/gridEditCellParams.d.ts +3 -1
  77. package/models/params/gridEditCellParams.js +1 -0
  78. package/models/params/gridRowParams.d.ts +1 -0
  79. package/models/props/DataGridProps.d.ts +1 -1
  80. package/modern/DataGrid/DataGrid.js +11 -23
  81. package/modern/DataGrid/useDataGridProps.js +1 -1
  82. package/modern/components/GridHeader.js +2 -1
  83. package/modern/components/GridRow.js +2 -4
  84. package/modern/components/cell/GridCell.js +2 -2
  85. package/modern/components/cell/GridEditDateCell.js +1 -20
  86. package/modern/components/columnHeaders/GridColumnGroupHeader.js +2 -1
  87. package/modern/components/columnHeaders/GridColumnHeaderItem.js +2 -1
  88. package/modern/components/menu/columnMenu/menuItems/GridColumnMenuSortItem.js +1 -1
  89. package/modern/components/panel/filterPanel/GridFilterForm.js +2 -2
  90. package/modern/components/panel/filterPanel/GridFilterInputValue.js +1 -1
  91. package/modern/components/panel/index.js +0 -1
  92. package/modern/constants/defaultGridSlotsComponents.js +1 -2
  93. package/modern/hooks/features/clipboard/useGridClipboard.js +1 -1
  94. package/modern/hooks/features/editing/useGridCellEditing.js +8 -21
  95. package/modern/hooks/features/editing/useGridRowEditing.js +7 -21
  96. package/modern/hooks/features/export/useGridCsvExport.js +1 -1
  97. package/modern/hooks/features/filter/gridFilterUtils.js +4 -2
  98. package/modern/hooks/features/filter/useGridFilter.js +2 -2
  99. package/modern/hooks/features/keyboardNavigation/useGridKeyboardNavigation.js +2 -1
  100. package/modern/hooks/features/rowSelection/useGridRowSelection.js +2 -1
  101. package/modern/hooks/features/sorting/useGridSorting.js +6 -5
  102. package/modern/index.js +1 -1
  103. package/modern/internals/index.js +1 -1
  104. package/modern/locales/arSD.js +1 -1
  105. package/modern/locales/bgBG.js +33 -37
  106. package/modern/locales/heIL.js +1 -2
  107. package/modern/models/params/gridEditCellParams.js +1 -0
  108. package/modern/utils/domUtils.js +10 -15
  109. package/node/DataGrid/DataGrid.js +11 -23
  110. package/node/DataGrid/useDataGridProps.js +1 -1
  111. package/node/components/GridHeader.js +2 -1
  112. package/node/components/GridRow.js +1 -3
  113. package/node/components/cell/GridCell.js +2 -2
  114. package/node/components/cell/GridEditDateCell.js +1 -20
  115. package/node/components/columnHeaders/GridColumnGroupHeader.js +2 -1
  116. package/node/components/columnHeaders/GridColumnHeaderItem.js +2 -1
  117. package/node/components/menu/columnMenu/menuItems/GridColumnMenuSortItem.js +1 -1
  118. package/node/components/panel/filterPanel/GridFilterForm.js +2 -2
  119. package/node/components/panel/filterPanel/GridFilterInputValue.js +1 -1
  120. package/node/components/panel/index.js +0 -11
  121. package/node/constants/defaultGridSlotsComponents.js +0 -1
  122. package/node/hooks/features/clipboard/useGridClipboard.js +1 -1
  123. package/node/hooks/features/editing/useGridCellEditing.js +7 -20
  124. package/node/hooks/features/editing/useGridRowEditing.js +6 -20
  125. package/node/hooks/features/export/useGridCsvExport.js +1 -1
  126. package/node/hooks/features/filter/gridFilterUtils.js +6 -3
  127. package/node/hooks/features/filter/useGridFilter.js +1 -1
  128. package/node/hooks/features/keyboardNavigation/useGridKeyboardNavigation.js +2 -1
  129. package/node/hooks/features/rowSelection/useGridRowSelection.js +2 -1
  130. package/node/hooks/features/sorting/useGridSorting.js +6 -5
  131. package/node/index.js +1 -1
  132. package/node/internals/index.js +7 -0
  133. package/node/locales/arSD.js +1 -1
  134. package/node/locales/bgBG.js +33 -37
  135. package/node/locales/heIL.js +1 -2
  136. package/node/models/params/gridEditCellParams.js +1 -0
  137. package/node/utils/domUtils.js +11 -18
  138. package/package.json +6 -5
  139. package/utils/domUtils.d.ts +2 -3
  140. package/utils/domUtils.js +10 -15
package/CHANGELOG.md CHANGED
@@ -3,6 +3,313 @@
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.0.0-alpha.3
7
+
8
+ _Dec 4, 2023_
9
+
10
+ We'd like to offer a big thanks to the 15 contributors who made this release possible. Here are some highlights ✨:
11
+
12
+ - 🚀 Support localized start of the week on pickers' `AdapterLuxon`
13
+
14
+ When using Luxon 3.4.4 or higher, the start of the week will be defined by the date locale (e.g.: Sunday for `en-US`, Monday for `fr-FR`).
15
+
16
+ - 📈 Fix a lot of Charts package issues
17
+ - 🎉 The Data Grid features Cell selection and Clipboard paste are now stable
18
+ - 🌍 Improve Bulgarian (bg-BG) locale on Data Grid
19
+ - 🐞 Bugfixes
20
+ - 📚 Documentation improvements
21
+
22
+ ### Data Grid
23
+
24
+ #### Breaking changes
25
+
26
+ - The clipboard paste feature is now enabled by default. The flag `clipboardPaste` is no longer needed to be passed to the `experimentalFeatures` prop.
27
+
28
+ - The clipboard related exports `ignoreValueFormatterDuringExport` and `splitClipboardPastedText` are no longer prefixed with `unstable_`.
29
+
30
+ - The deprecated constants `SUBMIT_FILTER_STROKE_TIME` and `SUBMIT_FILTER_DATE_STROKE_TIME` have been removed from the `DataGrid` exports. Use the [`filterDebounceMs`](https://next.mui.com/x/api/data-grid/data-grid/#DataGrid-prop-filterDebounceMs) prop to customize filter debounce time.
31
+
32
+ - The `slots.preferencesPanel` slot and the `slotProps.preferencesPanel` prop were removed. Use `slots.panel` and `slotProps.panel` instead.
33
+
34
+ - The `GridPreferencesPanel` component is not exported anymore as it wasn't meant to be used outside of the Data Grid.
35
+
36
+ - The `unstable_` prefix has been removed from the cell selection props listed below.
37
+
38
+ | Old name | New name |
39
+ | :------------------------------------ | :--------------------------- |
40
+ | `unstable_cellSelection` | `cellSelection` |
41
+ | `unstable_cellSelectionModel` | `cellSelectionModel` |
42
+ | `unstable_onCellSelectionModelChange` | `onCellSelectionModelChange` |
43
+
44
+ - The `unstable_` prefix has been removed from the cell selection API methods listed below.
45
+
46
+ | Old name | New name |
47
+ | :--------------------------------- | :------------------------ |
48
+ | `unstable_getCellSelectionModel` | `getCellSelectionModel` |
49
+ | `unstable_getSelectedCellsAsArray` | `getSelectedCellsAsArray` |
50
+ | `unstable_isCellSelected` | `isCellSelected` |
51
+ | `unstable_selectCellRange` | `selectCellRange` |
52
+ | `unstable_setCellSelectionModel` | `setCellSelectionModel` |
53
+
54
+ - The Quick Filter now ignores hidden columns by default.
55
+ See [including hidden columns](https://next.mui.com/x/react-data-grid/filtering/quick-filter/#including-hidden-columns) section for more details.
56
+
57
+ #### `@mui/x-data-grid@7.0.0-alpha.3`
58
+
59
+ - [DataGrid] Fix cell editing adding a leading "v" on paste (#9205) @prasad5795
60
+ - [DataGrid] Exclude hidden columns from quick filtering by default (#11229) @cherniavskii
61
+ - [DataGrid] Fix `onFilterModelChange` being fired with stale field value (#11000) @gitstart
62
+ - [DataGrid] Fix handling of event target in portal (#11174) @cherniavskii
63
+ - [DataGrid] Remove deprecated constants (#11233) @michelengelen
64
+ - [DataGrid] Remove the `preferencesPanel` slot (#11228) @cherniavskii
65
+ - [l10n] Improve Bulgarian (bg-BG) locale (#10856) @Kristiqn95
66
+
67
+ #### `@mui/x-data-grid-pro@7.0.0-alpha.3` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
68
+
69
+ Same changes as in `@mui/x-data-grid@7.0.0-alpha.3`.
70
+
71
+ #### `@mui/x-data-grid-premium@7.0.0-alpha.3` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
72
+
73
+ Same changes as in `@mui/x-data-grid-pro@7.0.0-alpha.3`, plus:
74
+
75
+ - [DataGridPremium] Fix aggregated column ignoring column definition changes (#11129) @cherniavskii
76
+ - [DataGridPremium] Make Cell selection feature stable (#11246) @MBilalShafi
77
+ - [DataGridPremium] Make Clipboard paste feature stable (#11248) @MBilalShafi
78
+
79
+ ### Date Pickers
80
+
81
+ #### Breaking changes
82
+
83
+ - The Date and Time Pickers now use the localized week when using `AdapterLuxon` and Luxon v3.4.4 or higher is installed.
84
+ This new behavior allows `AdapterLuxon` to have the same behavior as the other adapters.
85
+ If you want to keep the start of the week on Monday even if your locale says otherwise, you can hardcode the week settings as follows:
86
+ The Firefox browser currently does not support this behavior because the [getWeekInfo](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/Locale/getWeekInfo) API is not yet implemented.
87
+
88
+ ```ts
89
+ import { Settings } from 'luxon';
90
+
91
+ Settings.defaultWeekSettings = {
92
+ firstDay: 1,
93
+ minimalDays: Info.getMinimumDaysInFirstWeek(),
94
+ weekend: [6, 7],
95
+ };
96
+ ```
97
+
98
+ - Add new parameters to the `shortcuts` slot `onChange` callback
99
+
100
+ The `onChange` callback fired when selecting a shortcut now requires two new parameters (previously they were optional):
101
+
102
+ - The [`changeImportance`](/x/react-date-pickers/shortcuts/#behavior-when-selecting-a-shortcut) of the shortcut.
103
+ - The `item` containing the entire shortcut object.
104
+
105
+ ```diff
106
+ const CustomShortcuts = (props) => {
107
+ return (
108
+ <React.Fragment>
109
+ {props.items.map(item => {
110
+ const value = item.getValue({ isValid: props.isValid });
111
+ return (
112
+ <button
113
+ - onClick={() => onChange(value)}
114
+ + onClick={() => onChange(value, props.changeImportance ?? 'accept', item)}
115
+ >
116
+ {value}
117
+ </button>
118
+ )
119
+ }}
120
+ </React.Fragment>
121
+ )
122
+ }
123
+
124
+ <DatePicker slots={{ shortcuts: CustomShortcuts }} />
125
+ ```
126
+
127
+ - Usage of `AdapterDayjs` with the `customParseFormat` plugin
128
+ The call to `dayjs.extend(customParseFormatPlugin)` has been moved to the `AdapterDayjs` constructor. This allows users to pass custom options to this plugin before the adapter uses it.
129
+
130
+ If you are using this plugin before the rendering of the first `LocalizationProvider` component and did not call `dayjs.extend` in your own codebase, you will need to manually extend `dayjs`:
131
+
132
+ ```tsx
133
+ import dayjs from 'dayjs';
134
+ import customParseFormatPlugin from 'dayjs/plugin/customParseFormat';
135
+
136
+ dayjs.extend(customParseFormatPlugin);
137
+ ```
138
+
139
+ The other plugins are still added before the adapter initialization.
140
+
141
+ #### `@mui/x-date-pickers@7.0.0-alpha.3`
142
+
143
+ - [pickers] Expand field placeholder methods flexibility by providing `format` parameter (#11130) @LukasTy
144
+ - [pickers] Make `changeImportance` and `shortcut` mandatory in `PickersShortcuts` (#10941) @flaviendelangle
145
+ - [pickers] Moved extend with `customParseFormat` to constructor (#11151) @michelengelen
146
+ - [pickers] POC: `PickersTextField` styling - outlined variant (#10778) @noraleonte
147
+ - [pickers] Support localized start of the week on `AdapterLuxon` (#10964) @flaviendelangle
148
+ - [pickers] Use adapter methods instead of date library ones whenever possible (#11142) @flaviendelangle
149
+
150
+ #### `@mui/x-date-pickers-pro@7.0.0-alpha.3` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
151
+
152
+ Same changes as in `@mui/x-date-pickers@7.0.0-alpha.3`.
153
+
154
+ ### Charts / `@mui/x-charts@7.0.0-alpha.3`
155
+
156
+ - [charts] Adjusted `defaultizeValueFormatter` util to accept an optional `series.valueFormatter` value (#11144) @michelengelen
157
+ - [charts] Apply `labelStyle` and `tickLabelStyle` props on `<ChartsYAxis />` (#11180) @akamfoad
158
+ - [charts] Fix TS config (#11259) @alexfauquette
159
+ - [charts] Fix error with empty dataset (#11063) @alexfauquette
160
+ - [charts] Fix export strategy (#11235) @alexfauquette
161
+ - [charts] Remove outdated prop-types (#11045) @alexfauquette
162
+
163
+ ### Docs
164
+
165
+ - [docs] Add `TextField` styling example to customization playground (#10812) @noraleonte
166
+ - [docs] Add a card grid to the installation page (#11177) @danilo-leal
167
+ - [docs] Add end v6 blogpost to whats new page (#10999) @joserodolfofreitas
168
+ - [docs] Add small formatting improvements to the licensing page (#11178) @danilo-leal
169
+ - [docs] Document charts composition (#10710) (#11239) @alexfauquette
170
+ - [docs] Fix <title> generation (#11182) @oliviertassinari
171
+ - [docs] Fix dead anchor link (#11265) @oliviertassinari
172
+ - [docs] Improve Data Grid togglable columns example (#11238) @MBilalShafi
173
+ - [docs] Improve the prop descriptions of `DayCalendar` (#11158) @flaviendelangle
174
+ - [docs] Move the adapter breaking changes in a collapsable block (#11205) @flaviendelangle
175
+ - [docs] Polish Next.js header description @oliviertassinari
176
+ - [docs] Remove the `newFeature` flag on v6 features (#11168) @flaviendelangle
177
+ - [docs] Simplify a bit chart demo (#11173) @oliviertassinari
178
+ - [docs] Standardize the usage of callouts in the MUI X docs (#7127) @samuelsycamore
179
+ - [docs] Adjust the Data Grid demo page design (#11231) @danilo-leal
180
+
181
+ ### Core
182
+
183
+ - [core] Make `@mui/system` a direct dependency (#11128) @LukasTy
184
+ - [core] Remove blank lines, coding style @oliviertassinari
185
+ - [core] Remove outdated `ENABLE_AD` env variable (#11181) @oliviertassinari
186
+ - [github] Do not add `plan: Pro` and `plan: Premium` labels on pro / premium issue templates (#10183) @flaviendelangle
187
+
188
+ ## 7.0.0-alpha.2
189
+
190
+ _Nov 23, 2023_
191
+
192
+ We'd like to offer a big thanks to the 10 contributors who made this release possible. Here are some highlights ✨:
193
+
194
+ - 📈 Export missing Charts props
195
+ - 🌍 Improve Arabic (ar-SD) and Hebrew (he-IL) locales on Data Grid
196
+ - 🌍 Add Macedonian (mk) locale and improve German (de-DE) locale on Pickers
197
+ - 🐞 Bugfixes
198
+ - 📚 Documentation improvements
199
+
200
+ ### Data Grid
201
+
202
+ #### `@mui/x-data-grid@7.0.0-alpha.2`
203
+
204
+ - [l10n] Improve Arabic (ar-SD) locale (#11114) @MBilalShafi
205
+ - [l10n] Improve Hebrew (he-IL) locale (#11056) (#11149) @MBilalShafi
206
+ - [DataGrid] Remove unused utilities (#11156) @flaviendelangle
207
+
208
+ #### `@mui/x-data-grid-pro@7.0.0-alpha.2` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
209
+
210
+ Same changes as in `@mui/x-data-grid@7.0.0-alpha.2`.
211
+
212
+ #### `@mui/x-data-grid-premium@7.0.0-alpha.2` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
213
+
214
+ Same changes as in `@mui/x-data-grid-pro@7.0.0-alpha.2`.
215
+
216
+ ### Date Pickers
217
+
218
+ #### Breaking changes
219
+
220
+ - The deprecated `shouldDisableClock` prop has been removed in favor of the more flexible `shouldDisableTime` prop.
221
+ The `shouldDisableClock` prop received `value` as a `number` of hours, minutes, or seconds.
222
+ Instead, the `shouldDisableTime` prop receives the date object (based on the used adapter).
223
+
224
+ You can read more about the deprecation of this prop in [v6 migration guide](https://next.mui.com//x/migration/migration-pickers-v5/#%E2%9C%85-rename-or-refactor-shoulddisabletime-prop).
225
+
226
+ ```diff
227
+ <DateTimePicker
228
+ - shouldDisableClock={(timeValue, view) => view === 'hours' && timeValue < 12}
229
+ + shouldDisableTime={(value, view) => view === 'hours' && value.hour() < 12}
230
+ />
231
+ ```
232
+
233
+ - The `adapter.dateWithTimezone` method has been removed and its content moved to the `date` method.
234
+ You can use the `adapter.date` method instead:
235
+
236
+ ```diff
237
+ - adapter.dateWithTimezone(undefined, 'system');
238
+ + adapter.date(undefined, 'system');
239
+ ```
240
+
241
+ - The `dayPickerClasses` variable has been renamed to `dayCalendarClasses` to be consistent with the new name of the `DayCalendar` component introduced in v6.0.0.
242
+
243
+ ```diff
244
+ - import { dayPickerClasses } from '@mui/x-date-pickers/DateCalendar';
245
+ + import { dayCalendarClasses } from '@mui/x-date-pickers/DateCalendar';
246
+ ```
247
+
248
+ - The deprecated `defaultCalendarMonth` prop has been removed in favor of the more flexible `referenceDate` prop.
249
+
250
+ ```diff
251
+ - <DateCalendar defaultCalendarMonth={dayjs('2022-04-01')};
252
+ + <DateCalendar referenceDate{dayjs('2022-04-01')} />
253
+ ```
254
+
255
+ - The `adapter.date` method now has the v6 `adapter.dateWithTimezone` method behavior.
256
+ It no longer accepts `any` as a value but only `string | null | undefined`.
257
+
258
+ ```diff
259
+ - adapter.date(new Date());
260
+ + adapter.date();
261
+
262
+ - adapter.date(new Date('2022-04-17');
263
+ + adapter.date('2022-04-17');
264
+
265
+ - adapter.date(new Date(2022, 3, 17, 4, 5, 34));
266
+ + adapter.date('2022-04-17T04:05:34');
267
+
268
+ - adapter.date(new Date('Invalid Date'));
269
+ + adapter.getInvalidDate();
270
+ ```
271
+
272
+ #### `@mui/x-date-pickers@7.0.0-alpha.2`
273
+
274
+ - [l10n] Improve German (de-DE) locale (#11103) @jho-vema
275
+ - [l10n] Add Macedonian (mk) locale (#10935) @brsnik
276
+ - [pickers] Remove the `defaultCalendarMonth` prop (#10987) @flaviendelangle
277
+ - [pickers] Remove the `shouldDisableClock` prop (#11042) @flaviendelangle
278
+ - [pickers] Rename the `dayPickerClasses` variable `dayCalendarClasses` (#11140) @flaviendelangle
279
+ - [pickers] Replace `adapter.date` with the current `adapter.dateWithTimezone` (#10979) @flaviendelangle
280
+
281
+ #### `@mui/x-date-pickers-pro@7.0.0-alpha.2` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
282
+
283
+ Same changes as in `@mui/x-date-pickers@7.0.0-alpha.2`.
284
+
285
+ ### Charts / `@mui/x-charts@7.0.0-alpha.2`
286
+
287
+ - [charts] Change export strategy in index files (#11113) @michelengelen
288
+ - [charts] Fix `ChartsTooltip` component setup (#11152) @LukasTy
289
+
290
+ ### `@mui/x-codemod@7.0.0-alpha.2`
291
+
292
+ - [codemod] Add codemod to use `referenceDate` instead of `defaultCalendarMonth` (#11139) @flaviendelangle
293
+ - [codemod] Clean the components to slots codemod usage (#11145) @flaviendelangle
294
+
295
+ ### Docs
296
+
297
+ - [docs] Add LTS section to support docs (#10927) @joserodolfofreitas
298
+ - [docs] Clean the codemod README (#11051) @flaviendelangle
299
+ - [docs] Fix typos and grammar issues (#11049) @flaviendelangle
300
+ - [docs] Fix version links (#11001) @LukasTy
301
+ - [docs] Point to the source of `@mui/x-data-grid-generator` (#11134) @oliviertassinari
302
+
303
+ ### Core
304
+
305
+ - [core] Bump monorepo (#11160) @LukasTy
306
+ - [core] Fix comment in doc generation (#11098) @flaviendelangle
307
+ - [core] Rename OpenCollective @oliviertassinari
308
+ - [core] Upgrade `babel-plugin-module-resolver` to 5.0.0 (#11065) @flaviendelangle
309
+ - [changelog] Improve git diff format @oliviertassinari
310
+ - [renovate] Monthly schedule for lockfile maintenance (#10336) @Janpot
311
+ - [test] Skip flaky e2e test in webkit (#11110) @cherniavskii
312
+
6
313
  ## 7.0.0-alpha.1
7
314
 
8
315
  _Nov 17, 2023_
@@ -23,29 +330,29 @@ We'd like to offer a big thanks to the 3 contributors who made this release poss
23
330
  ```diff
24
331
  <DateCalendar
25
332
  // If you were still using the day string, you can get it back with your date library.
26
- - dayOfWeekFormatter={dayStr => `${dayStr}.`}
27
- + dayOfWeekFormatter={day => `${day.format('dd')}.`}
333
+ - dayOfWeekFormatter={dayStr => `${dayStr}.`}
334
+ + dayOfWeekFormatter={day => `${day.format('dd')}.`}
28
335
 
29
336
  // If you were already using the day object, just remove the first argument.
30
- - dayOfWeekFormatter={(_dayStr, day) => `${day.format('dd')}.`}
31
- + dayOfWeekFormatter={day => `${day.format('dd')}.`}
337
+ - dayOfWeekFormatter={(_dayStr, day) => `${day.format('dd')}.`}
338
+ + dayOfWeekFormatter={day => `${day.format('dd')}.`}
32
339
  />
33
340
  ```
34
341
 
35
342
  - The imports related to the `calendarHeader` slot have been moved from `@mui/x-date-pickers/DateCalendar` to `@mui/x-date-pickers/PIckersCalendarHeader`:
36
343
 
37
344
  ```diff
38
- export {
39
- pickersCalendarHeaderClasses,
40
- PickersCalendarHeaderClassKey,
41
- PickersCalendarHeaderClasses,
42
- PickersCalendarHeader,
43
- PickersCalendarHeaderProps,
44
- PickersCalendarHeaderSlotsComponent,
45
- PickersCalendarHeaderSlotsComponentsProps,
46
- ExportedPickersCalendarHeaderProps,
47
- - } from '@mui/x-date-pickers/DateCalendar';
48
- + } from '@mui/x-date-pickers/PickersCalendarHeader';
345
+ export {
346
+ pickersCalendarHeaderClasses,
347
+ PickersCalendarHeaderClassKey,
348
+ PickersCalendarHeaderClasses,
349
+ PickersCalendarHeader,
350
+ PickersCalendarHeaderProps,
351
+ PickersCalendarHeaderSlotsComponent,
352
+ PickersCalendarHeaderSlotsComponentsProps,
353
+ ExportedPickersCalendarHeaderProps,
354
+ -} from '@mui/x-date-pickers/DateCalendar';
355
+ +} from '@mui/x-date-pickers/PickersCalendarHeader';
49
356
 
50
357
  ```
51
358
 
@@ -53,170 +360,170 @@ We'd like to offer a big thanks to the 3 contributors who made this release poss
53
360
  It was used in the header of the calendar views, you can replace it with the new `format` prop of the `calendarHeader` slot:
54
361
 
55
362
  ```diff
56
- <LocalizationProvider
57
- adapter={AdapterDayJS}
58
- - formats={{ monthAndYear: 'MM/YYYY' }}
59
- />
60
- <DatePicker
61
- + slotProps={{ calendarHeader: { format: 'MM/YYYY' }}}
62
- />
63
- <DateRangePicker
64
- + slotProps={{ calendarHeader: { format: 'MM/YYYY' }}}
65
- />
66
- <LocalizationProvider />
363
+ <LocalizationProvider
364
+ adapter={AdapterDayJS}
365
+ - formats={{ monthAndYear: 'MM/YYYY' }}
366
+ />
367
+ <DatePicker
368
+ + slotProps={{ calendarHeader: { format: 'MM/YYYY' }}}
369
+ />
370
+ <DateRangePicker
371
+ + slotProps={{ calendarHeader: { format: 'MM/YYYY' }}}
372
+ />
373
+ <LocalizationProvider />
67
374
  ```
68
375
 
69
376
  - The `adapter.getDiff` method have been removed, you can directly use your date library:
70
377
 
71
378
  ```diff
72
- // For Day.js
73
- - const diff = adapter.getDiff(value, comparing, unit);
74
- + const diff = value.diff(comparing, unit);
75
-
76
- // For Luxon
77
- - const diff = adapter.getDiff(value, comparing, unit);
78
- + const getDiff = (value: DateTime, comparing: DateTime | string, unit?: AdapterUnits) => {
79
- + const parsedComparing = typeof comparing === 'string'
80
- + ? DateTime.fromJSDate(new Date(comparing))
81
- + : comparing;
82
- + if (unit) {
83
- + return Math.floor(value.diff(comparing).as(unit));
84
- + }
85
- + return value.diff(comparing).as('millisecond');
86
- + };
379
+ // For Day.js
380
+ -const diff = adapter.getDiff(value, comparing, unit);
381
+ +const diff = value.diff(comparing, unit);
382
+
383
+ // For Luxon
384
+ -const diff = adapter.getDiff(value, comparing, unit);
385
+ +const getDiff = (value: DateTime, comparing: DateTime | string, unit?: AdapterUnits) => {
386
+ + const parsedComparing = typeof comparing === 'string'
387
+ + ? DateTime.fromJSDate(new Date(comparing))
388
+ + : comparing;
389
+ + if (unit) {
390
+ + return Math.floor(value.diff(comparing).as(unit));
391
+ + }
392
+ + return value.diff(comparing).as('millisecond');
393
+ +};
87
394
  +
88
- + const diff = getDiff(value, comparing, unit);
395
+ +const diff = getDiff(value, comparing, unit);
89
396
 
90
397
  // For DateFns
91
- - const diff = adapter.getDiff(value, comparing, unit);
92
- + const getDiff = (value: Date, comparing: Date | string, unit?: AdapterUnits) => {
93
- + const parsedComparing = typeof comparing === 'string' ? new Date(comparing) : comparing;
94
- + switch (unit) {
95
- + case 'years':
96
- + return dateFns.differenceInYears(value, parsedComparing);
97
- + case 'quarters':
98
- + return dateFns.differenceInQuarters(value, parsedComparing);
99
- + case 'months':
100
- + return dateFns.differenceInMonths(value, parsedComparing);
101
- + case 'weeks':
102
- + return dateFns.differenceInWeeks(value, parsedComparing);
103
- + case 'days':
104
- + return dateFns.differenceInDays(value, parsedComparing);
105
- + case 'hours':
106
- + return dateFns.differenceInHours(value, parsedComparing);
107
- + case 'minutes':
108
- + return dateFns.differenceInMinutes(value, parsedComparing);
109
- + case 'seconds':
110
- + return dateFns.differenceInSeconds(value, parsedComparing);
111
- + default: {
112
- + return dateFns.differenceInMilliseconds(value, parsedComparing);
113
- + }
114
- + }
115
- + };
398
+ -const diff = adapter.getDiff(value, comparing, unit);
399
+ +const getDiff = (value: Date, comparing: Date | string, unit?: AdapterUnits) => {
400
+ + const parsedComparing = typeof comparing === 'string' ? new Date(comparing) : comparing;
401
+ + switch (unit) {
402
+ + case 'years':
403
+ + return dateFns.differenceInYears(value, parsedComparing);
404
+ + case 'quarters':
405
+ + return dateFns.differenceInQuarters(value, parsedComparing);
406
+ + case 'months':
407
+ + return dateFns.differenceInMonths(value, parsedComparing);
408
+ + case 'weeks':
409
+ + return dateFns.differenceInWeeks(value, parsedComparing);
410
+ + case 'days':
411
+ + return dateFns.differenceInDays(value, parsedComparing);
412
+ + case 'hours':
413
+ + return dateFns.differenceInHours(value, parsedComparing);
414
+ + case 'minutes':
415
+ + return dateFns.differenceInMinutes(value, parsedComparing);
416
+ + case 'seconds':
417
+ + return dateFns.differenceInSeconds(value, parsedComparing);
418
+ + default: {
419
+ + return dateFns.differenceInMilliseconds(value, parsedComparing);
420
+ + }
421
+ + }
422
+ +};
116
423
  +
117
- + const diff = getDiff(value, comparing, unit);
424
+ +const diff = getDiff(value, comparing, unit);
118
425
 
119
- // For Moment
120
- - const diff = adapter.getDiff(value, comparing, unit);
121
- + const diff = value.diff(comparing, unit);
426
+ // For Moment
427
+ -const diff = adapter.getDiff(value, comparing, unit);
428
+ +const diff = value.diff(comparing, unit);
122
429
  ```
123
430
 
124
431
  - The `adapter.getFormatHelperText` method have been removed, you can use the `adapter.expandFormat` instead:
125
432
 
126
433
  ```diff
127
- - const expandedFormat = adapter.getFormatHelperText(format);
128
- + const expandedFormat = adapter.expandFormat(format);
434
+ -const expandedFormat = adapter.getFormatHelperText(format);
435
+ +const expandedFormat = adapter.expandFormat(format);
129
436
  ```
130
437
 
131
438
  And if you need the exact same output you can apply the following transformation:
132
439
 
133
440
  ```diff
134
- // For Day.js
135
- - const expandedFormat = adapter.getFormatHelperText(format);
136
- + const expandedFormat = adapter.expandFormat(format).replace(/a/gi, '(a|p)m').toLocaleLowerCase();
441
+ // For Day.js
442
+ -const expandedFormat = adapter.getFormatHelperText(format);
443
+ +const expandedFormat = adapter.expandFormat(format).replace(/a/gi, '(a|p)m').toLocaleLowerCase();
137
444
 
138
- // For Luxon
139
- - const expandedFormat = adapter.getFormatHelperText(format);
140
- + const expandedFormat = adapter.expandFormat(format).replace(/(a)/g, '(a|p)m').toLocaleLowerCase();
445
+ // For Luxon
446
+ -const expandedFormat = adapter.getFormatHelperText(format);
447
+ +const expandedFormat = adapter.expandFormat(format).replace(/(a)/g, '(a|p)m').toLocaleLowerCase();
141
448
 
142
- // For DateFns
143
- - const expandedFormat = adapter.getFormatHelperText(format);
144
- + const expandedFormat = adapter.expandFormat(format).replace(/(aaa|aa|a)/g, '(a|p)m').toLocaleLowerCase();
449
+ // For DateFns
450
+ -const expandedFormat = adapter.getFormatHelperText(format);
451
+ +const expandedFormat = adapter.expandFormat(format).replace(/(aaa|aa|a)/g, '(a|p)m').toLocaleLowerCase();
145
452
 
146
- // For Moment
147
- - const expandedFormat = adapter.getFormatHelperText(format);
148
- + const expandedFormat = adapter.expandFormat(format).replace(/a/gi, '(a|p)m').toLocaleLowerCase();
453
+ // For Moment
454
+ -const expandedFormat = adapter.getFormatHelperText(format);
455
+ +const expandedFormat = adapter.expandFormat(format).replace(/a/gi, '(a|p)m').toLocaleLowerCase();
149
456
  ```
150
457
 
151
458
  - The `adapter.getMeridiemText` method have been removed, you can use the `adapter.setHours`, `adapter.date` and `adapter.format` methods to recreate its behavior:
152
459
 
153
460
  ```diff
154
- - const meridiem = adapter.getMeridiemText('am');
155
- + const getMeridiemText = (meridiem: 'am' | 'pm') => {
156
- + const date = adapter.setHours(adapter.date()!, meridiem === 'am' ? 2 : 14);
157
- + return utils.format(date, 'meridiem');
158
- + };
461
+ -const meridiem = adapter.getMeridiemText('am');
462
+ +const getMeridiemText = (meridiem: 'am' | 'pm') => {
463
+ + const date = adapter.setHours(adapter.date()!, meridiem === 'am' ? 2 : 14);
464
+ + return utils.format(date, 'meridiem');
465
+ +};
159
466
  +
160
- + const meridiem = getMeridiemText('am');
467
+ +const meridiem = getMeridiemText('am');
161
468
  ```
162
469
 
163
470
  - The `adapter.getMonthArray` method have been removed, you can use the `adapter.startOfYear` and `adapter.addMonths` methods to recreate its behavior:
164
471
 
165
472
  ```diff
166
- - const monthArray = adapter.getMonthArray(value);
167
- + const getMonthArray = (year) => {
168
- + const firstMonth = utils.startOfYear(year);
169
- + const months = [firstMonth];
473
+ -const monthArray = adapter.getMonthArray(value);
474
+ +const getMonthArray = (year) => {
475
+ + const firstMonth = utils.startOfYear(year);
476
+ + const months = [firstMonth];
170
477
  +
171
- + while (months.length < 12) {
172
- + const prevMonth = months[months.length - 1];
173
- + months.push(utils.addMonths(prevMonth, 1));
174
- + }
478
+ + while (months.length < 12) {
479
+ + const prevMonth = months[months.length - 1];
480
+ + months.push(utils.addMonths(prevMonth, 1));
481
+ + }
175
482
  +
176
- + return months;
177
- + }
483
+ + return months;
484
+ +}
178
485
  +
179
- + const monthArray = getMonthArray(value);
486
+ +const monthArray = getMonthArray(value);
180
487
  ```
181
488
 
182
489
  - The `adapter.getNextMonth` method have been removed, you can use the `adapter.addMonths` method instead:
183
490
 
184
491
  ```diff
185
- - const nextMonth = adapter.getNextMonth(value);
186
- + const nextMonth = adapter.addMonths(value, 1);
492
+ -const nextMonth = adapter.getNextMonth(value);
493
+ +const nextMonth = adapter.addMonths(value, 1);
187
494
  ```
188
495
 
189
496
  - The `adapter.getPreviousMonth` method have been removed, you can use the `adapter.addMonths` method instead:
190
497
 
191
498
  ```diff
192
- - const previousMonth = adapter.getPreviousMonth(value);
193
- + const previousMonth = adapter.addMonths(value, -1);
499
+ -const previousMonth = adapter.getPreviousMonth(value);
500
+ +const previousMonth = adapter.addMonths(value, -1);
194
501
  ```
195
502
 
196
503
  - The `adapter.getWeekdays` method have been removed, you can use the `adapter.startOfWeek` and `adapter.addDays` methods instead:
197
504
 
198
505
  ```diff
199
- - const weekDays = adapter.getWeekdays(value);
200
- + const getWeekdays = (value) => {
201
- + const start = adapter.startOfWeek(value);
202
- + return [0, 1, 2, 3, 4, 5, 6].map((diff) => utils.addDays(start, diff));
203
- + };
506
+ -const weekDays = adapter.getWeekdays(value);
507
+ +const getWeekdays = (value) => {
508
+ + const start = adapter.startOfWeek(value);
509
+ + return [0, 1, 2, 3, 4, 5, 6].map((diff) => utils.addDays(start, diff));
510
+ +};
204
511
  +
205
- + const weekDays = getWeekdays(value);
512
+ +const weekDays = getWeekdays(value);
206
513
  ```
207
514
 
208
515
  - The `isNull` method have been removed, you can replace it with a very basic check:
209
516
 
210
517
  ```diff
211
- - const isNull = adapter.isNull(value);
212
- + const isNull = value === null;
518
+ -const isNull = adapter.isNull(value);
519
+ +const isNull = value === null;
213
520
  ```
214
521
 
215
522
  - The `adapter.mergeDateAndTime` method have been removed, you can use the `adapter.setHours`, `adapter.setMinutes`, and `adapter.setSeconds` methods to recreate its behavior:
216
523
 
217
524
  ```diff
218
- - const result = adapter.mergeDateAndTime(valueWithDate, valueWithTime);
219
- + const mergeDateAndTime = <TDate>(
525
+ -const result = adapter.mergeDateAndTime(valueWithDate, valueWithTime);
526
+ +const mergeDateAndTime = <TDate>(
220
527
  + dateParam,
221
528
  + timeParam,
222
529
  + ) => {
@@ -228,37 +535,37 @@ And if you need the exact same output you can apply the following transformation
228
535
  + return mergedDate;
229
536
  + };
230
537
  +
231
- + const result = mergeDateAndTime(valueWithDate, valueWithTime);
538
+ +const result = mergeDateAndTime(valueWithDate, valueWithTime);
232
539
  ```
233
540
 
234
541
  - The `adapter.parseISO` method have been removed, you can directly use your date library:
235
542
 
236
543
  ```diff
237
- // For Day.js
238
- - const value = adapter.parseISO(isoString);
239
- + const value = dayjs(isoString);
544
+ // For Day.js
545
+ -const value = adapter.parseISO(isoString);
546
+ +const value = dayjs(isoString);
240
547
 
241
- // For Luxon
242
- - const value = adapter.parseISO(isoString);
243
- + const value = DateTime.fromISO(isoString);
548
+ // For Luxon
549
+ -const value = adapter.parseISO(isoString);
550
+ +const value = DateTime.fromISO(isoString);
244
551
 
245
- // For DateFns
246
- - const value = adapter.parseISO(isoString);
247
- + const value = dateFns.parseISO(isoString);
552
+ // For DateFns
553
+ -const value = adapter.parseISO(isoString);
554
+ +const value = dateFns.parseISO(isoString);
248
555
 
249
- // For Moment
250
- - const value = adapter.parseISO(isoString);
251
- + const value = moment(isoString, true);
556
+ // For Moment
557
+ -const value = adapter.parseISO(isoString);
558
+ +const value = moment(isoString, true);
252
559
  ```
253
560
 
254
561
  - The `adapter.toISO` method have been removed, you can directly use your date library:
255
562
 
256
563
  ```diff
257
- - const isoString = adapter.toISO(value);
258
- + const isoString = value.toISOString();
259
- + const isoString = value.toUTC().toISO({ format: 'extended' });
260
- + const isoString = dateFns.formatISO(value, { format: 'extended' });
261
- + const isoString = value.toISOString();
564
+ -const isoString = adapter.toISO(value);
565
+ +const isoString = value.toISOString();
566
+ +const isoString = value.toUTC().toISO({ format: 'extended' });
567
+ +const isoString = dateFns.formatISO(value, { format: 'extended' });
568
+ +const isoString = value.toISOString();
262
569
  ```
263
570
 
264
571
  - The `adapter.isEqual` method used to accept any type of value for its two input and tried to parse them before checking if they were equal.
@@ -277,49 +584,49 @@ And if you need the exact same output you can apply the following transformation
277
584
  const isEqual = adapterDateFns.isEqual(new Date(), new Date('2022-04-17'));
278
585
 
279
586
  // Non-supported formats (JS Date)
280
- - const isEqual = adapterDayjs.isEqual(new Date(), new Date('2022-04-17'));
281
- + const isEqual = adapterDayjs.isEqual(dayjs(), dayjs('2022-04-17'));
587
+ -const isEqual = adapterDayjs.isEqual(new Date(), new Date('2022-04-17'));
588
+ +const isEqual = adapterDayjs.isEqual(dayjs(), dayjs('2022-04-17'));
282
589
 
283
- - const isEqual = adapterLuxon.isEqual(new Date(), new Date('2022-04-17'));
284
- + const isEqual = adapterLuxon.isEqual(DateTime.now(), DateTime.fromISO('2022-04-17'));
590
+ -const isEqual = adapterLuxon.isEqual(new Date(), new Date('2022-04-17'));
591
+ +const isEqual = adapterLuxon.isEqual(DateTime.now(), DateTime.fromISO('2022-04-17'));
285
592
 
286
- - const isEqual = adapterMoment.isEqual(new Date(), new Date('2022-04-17'));
287
- + const isEqual = adapterMoment.isEqual(moment(), moment('2022-04-17'));
593
+ -const isEqual = adapterMoment.isEqual(new Date(), new Date('2022-04-17'));
594
+ +const isEqual = adapterMoment.isEqual(moment(), moment('2022-04-17'));
288
595
 
289
596
  // Non-supported formats (string)
290
- - const isEqual = adapterDayjs.isEqual('2022-04-16', '2022-04-17');
291
- + const isEqual = adapterDayjs.isEqual(dayjs('2022-04-17'), dayjs('2022-04-17'));
597
+ -const isEqual = adapterDayjs.isEqual('2022-04-16', '2022-04-17');
598
+ +const isEqual = adapterDayjs.isEqual(dayjs('2022-04-17'), dayjs('2022-04-17'));
292
599
 
293
- - const isEqual = adapterLuxon.isEqual('2022-04-16', '2022-04-17');
294
- + const isEqual = adapterLuxon.isEqual(DateTime.fromISO('2022-04-17'), DateTime.fromISO('2022-04-17'));
600
+ -const isEqual = adapterLuxon.isEqual('2022-04-16', '2022-04-17');
601
+ +const isEqual = adapterLuxon.isEqual(DateTime.fromISO('2022-04-17'), DateTime.fromISO('2022-04-17'));
295
602
 
296
- - const isEqual = adapterMoment.isEqual('2022-04-16', '2022-04-17');
297
- + const isEqual = adapterMoment.isEqual(moment('2022-04-17'), moment('2022-04-17'));
603
+ -const isEqual = adapterMoment.isEqual('2022-04-16', '2022-04-17');
604
+ +const isEqual = adapterMoment.isEqual(moment('2022-04-17'), moment('2022-04-17'));
298
605
 
299
- - const isEqual = adapterDateFns.isEqual('2022-04-16', '2022-04-17');
300
- + const isEqual = adapterDateFns.isEqual(new Date('2022-04-17'), new Date('2022-04-17'));
606
+ -const isEqual = adapterDateFns.isEqual('2022-04-16', '2022-04-17');
607
+ +const isEqual = adapterDateFns.isEqual(new Date('2022-04-17'), new Date('2022-04-17'));
301
608
  ```
302
609
 
303
610
  - The `dateLibInstance` prop of `LocalizationProvider` does not work with `AdapterDayjs` anymore (#11023). This prop was used to set the pickers in UTC mode before the implementation of a proper timezone support in the components.
304
611
  You can learn more about the new approach on the [dedicated doc page](https://mui.com/x/react-date-pickers/timezone/).
305
612
 
306
613
  ```diff
307
- // When a `value` or a `defaultValue` is provided
308
- <LocalizationProvider
309
- adapter={AdapterDayjs}
310
- - dateLibInstance={dayjs.utc}
311
- >
312
- <DatePicker value={dayjs.utc('2022-04-17')} />
313
- </LocalizationProvider>
314
-
315
- // When no `value` or `defaultValue` is provided
316
- <LocalizationProvider
317
- adapter={AdapterDayjs}
318
- - dateLibInstance={dayjs.utc}
319
- >
320
- - <DatePicker />
321
- + <DatePicker timezone="UTC" />
322
- </LocalizationProvider>
614
+ // When a `value` or a `defaultValue` is provided
615
+ <LocalizationProvider
616
+ adapter={AdapterDayjs}
617
+ - dateLibInstance={dayjs.utc}
618
+ >
619
+ <DatePicker value={dayjs.utc('2022-04-17')} />
620
+ </LocalizationProvider>
621
+
622
+ // When no `value` or `defaultValue` is provided
623
+ <LocalizationProvider
624
+ adapter={AdapterDayjs}
625
+ - dateLibInstance={dayjs.utc}
626
+ >
627
+ - <DatePicker />
628
+ + <DatePicker timezone="UTC" />
629
+ </LocalizationProvider>
323
630
  ```
324
631
 
325
632
  - The property `hasLeadingZeros` has been removed from the sections in favor of the more precise `hasLeadingZerosInFormat` and `hasLeadingZerosInInput` properties (#10994). To keep the same behavior, you can replace it by `hasLeadingZerosInFormat`:
@@ -328,10 +635,10 @@ And if you need the exact same output you can apply the following transformation
328
635
  const fieldRef = React.useRef<FieldRef<FieldSection>>(null);
329
636
 
330
637
  React.useEffect(() => {
331
- const firstSection = fieldRef.current!.getSections()[0]
332
- - console.log(firstSection.hasLeadingZeros)
333
- + console.log(firstSection.hasLeadingZerosInFormat)
334
- }, [])
638
+ const firstSection = fieldRef.current!.getSections()[0];
639
+ - console.log(firstSection.hasLeadingZeros);
640
+ + console.log(firstSection.hasLeadingZerosInFormat);
641
+ }, []);
335
642
 
336
643
  return (
337
644
  <DateField unstableFieldRef={fieldRef} />
@@ -341,8 +648,8 @@ And if you need the exact same output you can apply the following transformation
341
648
  - The `adapter.getYearRange` method used to accept two params and now accepts a tuple to be consistent with the `adapter.isWithinRange` method (#10978):
342
649
 
343
650
  ```diff
344
- - adapter.getYearRange(start, end);
345
- + adapter.getYearRange([start, end])
651
+ -adapter.getYearRange(start, end);
652
+ +adapter.getYearRange([start, end])
346
653
  ```
347
654
 
348
655
  - The `adapter.isValid` method used to accept any type of value and tried to parse them before checking their validity (#10971).
@@ -362,27 +669,27 @@ And if you need the exact same output you can apply the following transformation
362
669
  const isValid = adapterDateFns.isValid(new Date());
363
670
 
364
671
  // Non-supported formats (JS Date)
365
- - const isValid = adapterDayjs.isValid(new Date('2022-04-17'));
366
- + const isValid = adapterDayjs.isValid(dayjs('2022-04-17'));
672
+ -const isValid = adapterDayjs.isValid(new Date('2022-04-17'));
673
+ +const isValid = adapterDayjs.isValid(dayjs('2022-04-17'));
367
674
 
368
- - const isValid = adapterLuxon.isValid(new Date('2022-04-17'));
369
- + const isValid = adapterLuxon.isValid(DateTime.fromISO('2022-04-17'));
675
+ -const isValid = adapterLuxon.isValid(new Date('2022-04-17'));
676
+ +const isValid = adapterLuxon.isValid(DateTime.fromISO('2022-04-17'));
370
677
 
371
- - const isValid = adapterMoment.isValid(new Date('2022-04-17'));
372
- + const isValid = adapterMoment.isValid(moment('2022-04-17'));
678
+ -const isValid = adapterMoment.isValid(new Date('2022-04-17'));
679
+ +const isValid = adapterMoment.isValid(moment('2022-04-17'));
373
680
 
374
681
  // Non-supported formats (string)
375
- - const isValid = adapterDayjs.isValid('2022-04-17');
376
- + const isValid = adapterDayjs.isValid(dayjs('2022-04-17'));
682
+ -const isValid = adapterDayjs.isValid('2022-04-17');
683
+ +const isValid = adapterDayjs.isValid(dayjs('2022-04-17'));
377
684
 
378
- - const isValid = adapterLuxon.isValid('2022-04-17');
379
- + const isValid = adapterLuxon.isValid(DateTime.fromISO('2022-04-17'));
685
+ -const isValid = adapterLuxon.isValid('2022-04-17');
686
+ +const isValid = adapterLuxon.isValid(DateTime.fromISO('2022-04-17'));
380
687
 
381
- - const isValid = adapterMoment.isValid('2022-04-17');
382
- + const isValid = adapterMoment.isValid(moment('2022-04-17'));
688
+ -const isValid = adapterMoment.isValid('2022-04-17');
689
+ +const isValid = adapterMoment.isValid(moment('2022-04-17'));
383
690
 
384
- - const isValid = adapterDateFns.isValid('2022-04-17');
385
- + const isValid = adapterDateFns.isValid(new Date('2022-04-17'));
691
+ -const isValid = adapterDateFns.isValid('2022-04-17');
692
+ +const isValid = adapterDateFns.isValid(new Date('2022-04-17'));
386
693
  ```
387
694
 
388
695
  #### Changes
@@ -447,7 +754,7 @@ A special shoutout to thank the 12 contributors who made this release possible.
447
754
  }
448
755
  const filterRegex = new RegExp(escapeRegExp(filterItem.value), 'i');
449
756
  - return (cellParams) => {
450
- - const { value } = cellParams;
757
+ - const { value } = cellParams;
451
758
  + return (value, row, colDef, apiRef) => {
452
759
  return value != null ? filterRegex.test(String(value)) : false;
453
760
  };
@@ -559,6 +866,118 @@ Here is an example of the renaming for the `<ChartsTooltip />` component.
559
866
  - [core] Update release instructions as per v7 configuration (#10962) @MBilalShafi
560
867
  - [license] Correctly throw errors (#10924) @oliviertassinari
561
868
 
869
+ ## 6.18.3
870
+
871
+ _Dec 4, 2023_
872
+
873
+ We'd like to offer a big thanks to the 10 contributors who made this release possible. Here are some highlights ✨:
874
+
875
+ - 📈 Fix a lot of Charts package issues
876
+ - 🌍 Improve Bulgarian (bg-BG) locale on Data Grid
877
+ - 🐞 Bugfixes
878
+ - 📚 Documentation improvements
879
+
880
+ ### Data Grid
881
+
882
+ #### `@mui/x-data-grid@6.18.3`
883
+
884
+ - [DataGrid] Fix cell editing adding a leading "v" on paste (#11166) @prasad5795
885
+ - [DataGrid] Fix handling of event target in portal (#11209) @cherniavskii
886
+ - [DataGrid] Fix `onFilterModelChange` being fired with stale field value (#11244) @gitstart
887
+ - [l10n] Improve Bulgarian (bg-BG) locale (#10856) (#11206) @Kristiqn95
888
+
889
+ #### `@mui/x-data-grid-pro@6.18.3` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
890
+
891
+ Same changes as in `@mui/x-data-grid@6.18.3`.
892
+
893
+ #### `@mui/x-data-grid-premium@6.18.3` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
894
+
895
+ Same changes as in `@mui/x-data-grid-pro@6.18.3`, plus:
896
+
897
+ - [DataGridPremium] Fix aggregated column ignoring column definition changes (#11176) @cherniavskii
898
+ - [DataGridPremium] Fix custom filter operators not working on aggregated column (#11201) @cherniavskii
899
+
900
+ ### Date Pickers
901
+
902
+ #### `@mui/x-date-pickers@6.18.3`
903
+
904
+ - [pickers] Correctly format `MultiSectionDigitalClock` number sections (#11297) @LukasTy
905
+ - [pickers] Expand field placeholder methods flexibility by providing `format` parameter (#11254) @LukasTy
906
+
907
+ #### `@mui/x-date-pickers-pro@6.18.3` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
908
+
909
+ Same changes as in `@mui/x-date-pickers@6.18.3`.
910
+
911
+ ### Charts / `@mui/x-charts@6.18.3`
912
+
913
+ - [charts] Adjusted `defaultizeValueFormatter` util to accept an optional `series.valueFormatter` value (#11213) @michelengelen
914
+ - [charts] Apply `labelStyle` and `tickLabelStyle` props on `<ChartsYAxis />` (#11180) @akamfoad
915
+ - [charts] Fix TS config (#11259) @alexfauquette
916
+ - [charts] Fix error with empty dataset (#11063) @alexfauquette
917
+ - [charts] Fix export strategy (#11235) @alexfauquette
918
+
919
+ ### Docs
920
+
921
+ - [docs] Add LTS section to support page (#11300) @joserodolfofreitas
922
+ - [docs] Add end v6 blogpost to whats new page (#11299) @joserodolfofreitas
923
+ - [docs] Document charts composition (#10710) @alexfauquette
924
+ - [docs] Fix version links (#11167) @LukasTy
925
+ - [docs] Improve Data Grid togglable columns example (#11241) @MBilalShafi
926
+ - [docs] Split charts overview and getting started in distinct pages (#10910) @alexfauquette
927
+
928
+ ## 6.18.2
929
+
930
+ _Nov 23, 2023_
931
+
932
+ We'd like to offer a big thanks to the 11 contributors who made this release possible. Here are some highlights ✨:
933
+
934
+ - 🌍 Improve Arabic (ar-SD), Czech (cs-CZ), and Hebrew (he-IL) locales on Data Grid
935
+ - 🌍 Add Basque (eu) and Macedonian (mk) locales on Pickers
936
+ - 🌍 Improve German (de-DE) and Spanish (es-ES) locales on Pickers
937
+ - 🐞 Bugfixes
938
+ - 📚 Documentation improvements
939
+
940
+ ### Data Grid
941
+
942
+ #### `@mui/x-data-grid@6.18.2`
943
+
944
+ - [l10n] Improve Arabic (ar-SD) locale (#11096) @OmarWebDev
945
+ - [l10n] Improve Czech (cs-CZ) locale (#10968) @luborepka
946
+ - [l10n] Improve Hebrew (he-IL) locale (#11056) @LironKiloma
947
+
948
+ #### `@mui/x-data-grid-pro@6.18.2` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
949
+
950
+ Same changes as in `@mui/x-data-grid@6.18.2`.
951
+
952
+ #### `@mui/x-data-grid-premium@6.18.2` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
953
+
954
+ Same changes as in `@mui/x-data-grid-pro@6.18.2`.
955
+
956
+ ### Date Pickers
957
+
958
+ #### `@mui/x-date-pickers@6.18.2`
959
+
960
+ - [l10n] Add Basque (eu) locale and improve Spanish (es-ES) locale (#10985) @lajtomekadimon
961
+ - [l10n] Add Macedonian (mk) locale (#11155) @brsnik
962
+ - [l10n] Improve German (de-DE) locale (#11104) @jho-vema
963
+ - [pickers] Deprecate `defaultCalendarMonth` prop (#11138) @flaviendelangle
964
+ - [pickers] Fix `DateCalendar` crashing when given an invalid value (#11101) @flaviendelangle
965
+
966
+ #### `@mui/x-date-pickers-pro@6.18.2` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
967
+
968
+ Same changes as in `@mui/x-date-pickers@6.18.2`.
969
+
970
+ ### Charts / `@mui/x-charts@6.18.2`
971
+
972
+ - [charts] Fix `ChartsTooltip` component setup (#11157) @LukasTy
973
+ - [charts] Remove outdated prop-types (#10998) @alexfauquette
974
+
975
+ ### Docs
976
+
977
+ - [docs] Fix incoherent naming of a component in `Custom slots and subcomponents` page (#11003) @lhilgert9
978
+ - [test] Skip flaky e2e test in webkit (#11115) @cherniavskii
979
+ - [test] Wait for images to load (#11109) @cherniavskii
980
+
562
981
  ## 6.18.1
563
982
 
564
983
  _Nov 9, 2023_
@@ -625,11 +1044,11 @@ We'd like to offer a big thanks to the 7 contributors who made this release poss
625
1044
 
626
1045
  - 🎁 The Charts package is now officially stable!
627
1046
  - 🥧 Pie charts are now animated.
628
- - 📈 Line charts now support partial data, and can interpolate missing data.
1047
+ - 📈 Line charts now support partial data, and can interpolate missing data https://mui.com/x/react-charts/lines/#skip-missing-points.
629
1048
 
630
- <img width="380" alt="line charts with partial data" src="https://github.com/mui/mui-x/assets/45398769/385ecf77-19b2-4a03-8aef-5d547db1d9ad">
1049
+ <img src="https://github.com/mui/mui-x/assets/3165635/d2d50b1b-ee29-4e4c-9ebe-629c06f3093e" width="683" height="436" />
631
1050
 
632
- - ✨ Allow to ignore [diacritics](https://en.wikipedia.org/wiki/Diacritic) when filtering
1051
+ - ✨ The data grid allows to ignore [diacritics](https://en.wikipedia.org/wiki/Diacritic) when filtering.
633
1052
  - 📚 Documentation improvements
634
1053
 
635
1054
  ### Data Grid