@mui/x-charts-pro 8.0.0-alpha.12 → 8.0.0-alpha.13

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 (51) hide show
  1. package/BarChartPro/BarChartPro.js +25 -30
  2. package/CHANGELOG.md +299 -0
  3. package/ChartContainerPro/ChartContainerPro.d.ts +1 -1
  4. package/ChartContainerPro/ChartContainerPro.js +1 -1
  5. package/ChartContainerPro/useChartContainerProProps.js +3 -1
  6. package/ChartDataProviderPro/ChartDataProviderPro.d.ts +1 -1
  7. package/ChartDataProviderPro/ChartDataProviderPro.js +3 -2
  8. package/Heatmap/Heatmap.d.ts +5 -4
  9. package/Heatmap/Heatmap.js +37 -52
  10. package/LineChartPro/LineChartPro.js +25 -30
  11. package/ScatterChartPro/ScatterChartPro.js +25 -30
  12. package/esm/BarChartPro/BarChartPro.js +25 -30
  13. package/esm/ChartContainerPro/ChartContainerPro.d.ts +1 -1
  14. package/esm/ChartContainerPro/ChartContainerPro.js +1 -1
  15. package/esm/ChartContainerPro/useChartContainerProProps.js +3 -1
  16. package/esm/ChartDataProviderPro/ChartDataProviderPro.d.ts +1 -1
  17. package/esm/ChartDataProviderPro/ChartDataProviderPro.js +3 -2
  18. package/esm/Heatmap/Heatmap.d.ts +5 -4
  19. package/esm/Heatmap/Heatmap.js +37 -52
  20. package/esm/LineChartPro/LineChartPro.js +25 -30
  21. package/esm/ScatterChartPro/ScatterChartPro.js +25 -30
  22. package/esm/index.js +1 -1
  23. package/esm/internals/plugins/useChartProZoom/useChartProZoom.js +63 -12
  24. package/esm/internals/plugins/useChartProZoom/useChartProZoom.selectors.d.ts +26 -24
  25. package/esm/internals/plugins/useChartProZoom/useChartProZoom.types.d.ts +12 -3
  26. package/esm/internals/utils/releaseInfo.js +1 -1
  27. package/esm/models/seriesType/heatmap.d.ts +2 -2
  28. package/index.js +1 -1
  29. package/internals/plugins/useChartProZoom/useChartProZoom.js +63 -12
  30. package/internals/plugins/useChartProZoom/useChartProZoom.selectors.d.ts +26 -24
  31. package/internals/plugins/useChartProZoom/useChartProZoom.types.d.ts +12 -3
  32. package/internals/utils/releaseInfo.js +1 -1
  33. package/models/seriesType/heatmap.d.ts +2 -2
  34. package/modern/BarChartPro/BarChartPro.js +25 -30
  35. package/modern/ChartContainerPro/ChartContainerPro.d.ts +1 -1
  36. package/modern/ChartContainerPro/ChartContainerPro.js +1 -1
  37. package/modern/ChartContainerPro/useChartContainerProProps.js +3 -1
  38. package/modern/ChartDataProviderPro/ChartDataProviderPro.d.ts +1 -1
  39. package/modern/ChartDataProviderPro/ChartDataProviderPro.js +3 -2
  40. package/modern/Heatmap/Heatmap.d.ts +5 -4
  41. package/modern/Heatmap/Heatmap.js +37 -52
  42. package/modern/LineChartPro/LineChartPro.js +25 -30
  43. package/modern/ScatterChartPro/ScatterChartPro.js +25 -30
  44. package/modern/index.js +1 -1
  45. package/modern/internals/plugins/useChartProZoom/useChartProZoom.js +63 -12
  46. package/modern/internals/plugins/useChartProZoom/useChartProZoom.selectors.d.ts +26 -24
  47. package/modern/internals/plugins/useChartProZoom/useChartProZoom.types.d.ts +12 -3
  48. package/modern/internals/utils/releaseInfo.js +1 -1
  49. package/modern/models/seriesType/heatmap.d.ts +2 -2
  50. package/package.json +5 -5
  51. package/tsconfig.build.tsbuildinfo +1 -1
@@ -27,7 +27,7 @@ var _useChartContainerProProps = require("../ChartContainerPro/useChartContainer
27
27
  var _ChartDataProviderPro = require("../ChartDataProviderPro");
28
28
  var _BarChartPro = require("./BarChartPro.plugins");
29
29
  var _jsxRuntime = require("react/jsx-runtime");
30
- const _excluded = ["initialZoom", "onZoomChange", "apiRef"];
30
+ const _excluded = ["initialZoom", "zoomData", "onZoomChange", "apiRef"];
31
31
  function BarChartPlotZoom(props) {
32
32
  const isInteracting = (0, _zoom.useIsZoomInteracting)();
33
33
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_BarChart.BarPlot, (0, _extends2.default)({}, props, {
@@ -91,6 +91,7 @@ const BarChartPro = exports.BarChartPro = /*#__PURE__*/React.forwardRef(function
91
91
  });
92
92
  const {
93
93
  initialZoom,
94
+ zoomData,
94
95
  onZoomChange,
95
96
  apiRef
96
97
  } = props,
@@ -113,6 +114,7 @@ const BarChartPro = exports.BarChartPro = /*#__PURE__*/React.forwardRef(function
113
114
  chartsSurfaceProps
114
115
  } = (0, _useChartContainerProProps.useChartContainerProProps)((0, _extends2.default)({}, chartContainerProps, {
115
116
  initialZoom,
117
+ zoomData,
116
118
  onZoomChange,
117
119
  apiRef,
118
120
  plugins: _BarChartPro.BAR_CHART_PRO_PLUGINS
@@ -160,12 +162,6 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
160
162
  * Defines the border radius of the bar element.
161
163
  */
162
164
  borderRadius: _propTypes.default.number,
163
- /**
164
- * Indicate which axis to display the bottom of the charts.
165
- * Can be a string (the id of the axis) or an object `ChartsXAxisProps`.
166
- * @default xAxisIds[0] The id of the first provided axis
167
- */
168
- bottomAxis: _propTypes.default.oneOfType([_propTypes.default.object, _propTypes.default.string]),
169
165
  children: _propTypes.default.node,
170
166
  className: _propTypes.default.string,
171
167
  /**
@@ -214,6 +210,7 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
214
210
  id: _propTypes.default.string,
215
211
  /**
216
212
  * The list of zoom data related to each axis.
213
+ * Used to initialize the zoom in a specific configuration without controlling it.
217
214
  */
218
215
  initialZoom: _propTypes.default.arrayOf(_propTypes.default.shape({
219
216
  axisId: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]).isRequired,
@@ -225,12 +222,6 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
225
222
  * @default 'vertical'
226
223
  */
227
224
  layout: _propTypes.default.oneOf(['horizontal', 'vertical']),
228
- /**
229
- * Indicate which axis to display the left of the charts.
230
- * Can be a string (the id of the axis) or an object `ChartsYAxisProps`.
231
- * @default yAxisIds[0] The id of the first provided axis
232
- */
233
- leftAxis: _propTypes.default.oneOfType([_propTypes.default.object, _propTypes.default.string]),
234
225
  /**
235
226
  * If `true`, a loading overlay is displayed.
236
227
  * @default false
@@ -239,14 +230,15 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
239
230
  /**
240
231
  * The margin between the SVG and the drawing area.
241
232
  * It's used for leaving some space for extra information such as the x- and y-axis or legend.
242
- * Accepts an object with the optional properties: `top`, `bottom`, `left`, and `right`.
233
+ *
234
+ * Accepts a `number` to be used on all sides or an object with the optional properties: `top`, `bottom`, `left`, and `right`.
243
235
  */
244
- margin: _propTypes.default.shape({
236
+ margin: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.shape({
245
237
  bottom: _propTypes.default.number,
246
238
  left: _propTypes.default.number,
247
239
  right: _propTypes.default.number,
248
240
  top: _propTypes.default.number
249
- }),
241
+ })]),
250
242
  /**
251
243
  * The function called for onClick events.
252
244
  * The second argument contains information about all line/bar elements at the current mouse position.
@@ -272,12 +264,6 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
272
264
  * @param {ZoomData[]} zoomData Updated zoom data.
273
265
  */
274
266
  onZoomChange: _propTypes.default.func,
275
- /**
276
- * Indicate which axis to display the right of the charts.
277
- * Can be a string (the id of the axis) or an object `ChartsYAxisProps`.
278
- * @default null
279
- */
280
- rightAxis: _propTypes.default.oneOfType([_propTypes.default.object, _propTypes.default.string]),
281
267
  /**
282
268
  * The series to display in the bar chart.
283
269
  * An array of [[BarSeriesType]] objects.
@@ -301,12 +287,6 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
301
287
  sx: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object, _propTypes.default.bool])), _propTypes.default.func, _propTypes.default.object]),
302
288
  theme: _propTypes.default.oneOf(['dark', 'light']),
303
289
  title: _propTypes.default.string,
304
- /**
305
- * Indicate which axis to display the top of the charts.
306
- * Can be a string (the id of the axis) or an object `ChartsXAxisProps`.
307
- * @default null
308
- */
309
- topAxis: _propTypes.default.oneOfType([_propTypes.default.object, _propTypes.default.string]),
310
290
  /**
311
291
  * The width of the chart in px. If not defined, it takes the width of the parent element.
312
292
  */
@@ -317,6 +297,7 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
317
297
  * An array of [[AxisConfig]] objects.
318
298
  */
319
299
  xAxis: _propTypes.default.arrayOf(_propTypes.default.shape({
300
+ axis: _propTypes.default.oneOf(['x']),
320
301
  classes: _propTypes.default.object,
321
302
  colorMap: _propTypes.default.oneOfType([_propTypes.default.shape({
322
303
  colors: _propTypes.default.arrayOf(_propTypes.default.string).isRequired,
@@ -339,13 +320,15 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
339
320
  disableTicks: _propTypes.default.bool,
340
321
  domainLimit: _propTypes.default.oneOfType([_propTypes.default.oneOf(['nice', 'strict']), _propTypes.default.func]),
341
322
  fill: _propTypes.default.string,
323
+ height: _propTypes.default.number,
342
324
  hideTooltip: _propTypes.default.bool,
343
325
  id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
344
326
  label: _propTypes.default.string,
345
327
  labelStyle: _propTypes.default.object,
346
328
  max: _propTypes.default.oneOfType([_propTypes.default.instanceOf(Date), _propTypes.default.number]),
347
329
  min: _propTypes.default.oneOfType([_propTypes.default.instanceOf(Date), _propTypes.default.number]),
348
- position: _propTypes.default.oneOf(['bottom', 'top']),
330
+ offset: _propTypes.default.number,
331
+ position: _propTypes.default.oneOf(['bottom', 'none', 'top']),
349
332
  reverse: _propTypes.default.bool,
350
333
  scaleType: _propTypes.default.oneOf(['band', 'linear', 'log', 'point', 'pow', 'sqrt', 'time', 'utc']),
351
334
  slotProps: _propTypes.default.object,
@@ -354,6 +337,7 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
354
337
  sx: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object, _propTypes.default.bool])), _propTypes.default.func, _propTypes.default.object]),
355
338
  tickInterval: _propTypes.default.oneOfType([_propTypes.default.oneOf(['auto']), _propTypes.default.array, _propTypes.default.func]),
356
339
  tickLabelInterval: _propTypes.default.oneOfType([_propTypes.default.oneOf(['auto']), _propTypes.default.func]),
340
+ tickLabelMinGap: _propTypes.default.number,
357
341
  tickLabelPlacement: _propTypes.default.oneOf(['middle', 'tick']),
358
342
  tickLabelStyle: _propTypes.default.object,
359
343
  tickMaxStep: _propTypes.default.number,
@@ -378,6 +362,7 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
378
362
  * An array of [[AxisConfig]] objects.
379
363
  */
380
364
  yAxis: _propTypes.default.arrayOf(_propTypes.default.shape({
365
+ axis: _propTypes.default.oneOf(['y']),
381
366
  classes: _propTypes.default.object,
382
367
  colorMap: _propTypes.default.oneOfType([_propTypes.default.shape({
383
368
  colors: _propTypes.default.arrayOf(_propTypes.default.string).isRequired,
@@ -406,7 +391,8 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
406
391
  labelStyle: _propTypes.default.object,
407
392
  max: _propTypes.default.oneOfType([_propTypes.default.instanceOf(Date), _propTypes.default.number]),
408
393
  min: _propTypes.default.oneOfType([_propTypes.default.instanceOf(Date), _propTypes.default.number]),
409
- position: _propTypes.default.oneOf(['left', 'right']),
394
+ offset: _propTypes.default.number,
395
+ position: _propTypes.default.oneOf(['left', 'none', 'right']),
410
396
  reverse: _propTypes.default.bool,
411
397
  scaleType: _propTypes.default.oneOf(['band', 'linear', 'log', 'point', 'pow', 'sqrt', 'time', 'utc']),
412
398
  slotProps: _propTypes.default.object,
@@ -423,6 +409,7 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
423
409
  tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
424
410
  tickSize: _propTypes.default.number,
425
411
  valueFormatter: _propTypes.default.func,
412
+ width: _propTypes.default.number,
426
413
  zoom: _propTypes.default.oneOfType([_propTypes.default.shape({
427
414
  filterMode: _propTypes.default.oneOf(['discard', 'keep']),
428
415
  maxEnd: _propTypes.default.number,
@@ -457,5 +444,13 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
457
444
  id: _propTypes.default.string,
458
445
  max: _propTypes.default.number,
459
446
  min: _propTypes.default.number
447
+ })),
448
+ /**
449
+ * The list of zoom data related to each axis.
450
+ */
451
+ zoomData: _propTypes.default.arrayOf(_propTypes.default.shape({
452
+ axisId: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]).isRequired,
453
+ end: _propTypes.default.number.isRequired,
454
+ start: _propTypes.default.number.isRequired
460
455
  }))
461
456
  } : void 0;
package/CHANGELOG.md CHANGED
@@ -5,6 +5,305 @@
5
5
  All notable changes to this project will be documented in this file.
6
6
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
7
7
 
8
+ ## 8.0.0-alpha.13
9
+
10
+ _Feb 28, 2025_
11
+
12
+ We'd like to offer a big thanks to the 19 contributors who made this release possible. Here are some highlights ✨:
13
+
14
+ - 📊 Decouple `margin` and `axis-size`. A new API to support multiple axes (#16418) @JCQuintas
15
+ - 🗺️ Added Bangla (bn-BD) locale
16
+ - 🗺️ Improve Russian (ru-RU) and Hungarian (hu-HU) locale on the Data Grid
17
+
18
+ Special thanks go out to the community members for their contributions:
19
+ @denpiligrim, @lhilgert9, @noherczeg, @officialkidmax, @pcorpet.
20
+ Following are all team members who have contributed to this release:
21
+ @alexfauquette, @arminmeh, @bernardobelchior, @cherniavskii, @flaviendelangle, @hasdfa, @Janpot, @JCQuintas, @KenanYusuf, @LukasTy, @michelengelen, @MBilalShafi, @oliviertassinari, @romgrk.
22
+
23
+ <!--/ HIGHLIGHT_ABOVE_SEPARATOR /-->
24
+
25
+ ### Data Grid
26
+
27
+ #### Breaking changes
28
+
29
+ - The `slots.baseFormControl` component was removed.
30
+
31
+ - The "Reset" button in the column visibility panel now resets to the initial column visibility model. Previously it was reset to the model that was active at the time the panel was opened. The reset behavior follows these rules:
32
+
33
+ 1. If an initial `columnVisibilityModel` is provided, it resets to that model.
34
+ 2. If a controlled `columnVisibilityModel` is provided, it resets to the first model value.
35
+ 3. When the columns are updated (via the `columns` prop or `updateColumns()` API method), the reset reference point updates to the current `columnVisibilityModel`.
36
+
37
+ To revert to the previous behavior, provide a custom component to the `slots.columnsManagement`.
38
+
39
+ - The deprecated `LicenseInfo` export has been removed from the `@mui/x-data-grid-pro` and `@mui/x-data-grid-premium` packages.
40
+ You have to import it from `@mui/x-license` instead:
41
+
42
+ ```diff
43
+ - import { LicenseInfo } from '@mui/x-data-grid-pro';
44
+ - import { LicenseInfo } from '@mui/x-data-grid-premium';
45
+ + import { LicenseInfo } from '@mui/x-license';
46
+
47
+ LicenseInfo.setLicenseKey('YOUR_LICENSE_KEY');
48
+ ```
49
+
50
+ - The row selection model has been changed from `GridRowId[]` to `{ type: 'include' | 'exclude'; ids: Set<GridRowId> }`.
51
+ Using `Set` allows for a more efficient row selection management.
52
+ The `exclude` selection type allows to select all rows except the ones in the `ids` set.
53
+
54
+ This change impacts the following props:
55
+
56
+ - `rowSelectionModel`
57
+ - `onRowSelectionModelChange`
58
+ - `initialState.rowSelectionModel`
59
+
60
+ ```diff
61
+ - const [rowSelectionModel, setRowSelectionModel] = React.useState<GridRowSelectionModel>([]);
62
+ + const [rowSelectionModel, setRowSelectionModel] = React.useState<GridRowSelectionModel>({ type: 'include', ids: new Set() });
63
+ ```
64
+
65
+ This change also impacts the `gridRowSelectionStateSelector` selector.
66
+ For convenience, use the `gridRowSelectionManagerSelector` selector to handle both selection types:
67
+
68
+ ```diff
69
+ - const rowSelection = gridRowSelectionStateSelector(apiRef);
70
+ - const isRowSelected = rowSelection.includes(rowId);
71
+ + const rowSelectionManager = gridRowSelectionManagerSelector(apiRef);
72
+ + const isRowSelected = rowSelectionManager.has(rowId);
73
+ ```
74
+
75
+ There is also a `createRowSelectionManager` utility function that can be used to manage the row selection:
76
+
77
+ ```ts
78
+ const rowSelectionManager = createRowSelectionManager({
79
+ type: 'include',
80
+ ids: new Set(),
81
+ });
82
+ rowSelectionManager.select(rowId);
83
+ rowSelectionManager.unselect(rowId);
84
+ rowSelectionManager.has(rowId);
85
+ ```
86
+
87
+ - The `selectedIdsLookupSelector` selector has been removed. Use the `gridRowSelectionManagerSelector` or `gridRowSelectionStateSelector` selectors instead.
88
+ - The `selectedGridRowsSelector` has been renamed to `gridRowSelectionIdsSelector`.
89
+ - The `selectedGridRowsCountSelector` has been renamed to `gridRowSelectionCountSelector`.
90
+
91
+ - The data source feature and its related props are now stable.
92
+
93
+ ```diff
94
+ <DataGridPro
95
+ - unstable_dataSource={dataSource}
96
+ - unstable_dataSourceCache={cache}
97
+ - unstable_lazyLoading
98
+ - unstable_lazyLoadingRequestThrottleMs={100}
99
+ + dataSource={dataSource}
100
+ + dataSourceCache={cache}
101
+ + lazyLoading
102
+ + lazyLoadingRequestThrottleMs={100}
103
+ />
104
+ ```
105
+
106
+ - The data source API is now stable.
107
+
108
+ ```diff
109
+ - apiRef.current.unstable_dataSource.getRows()
110
+ + apiRef.current.dataSource.getRows()
111
+ ```
112
+
113
+ - The signature of `unstable_onDataSourceError()` has been updated to support future use-cases.
114
+
115
+ ```diff
116
+ <DataGrid
117
+ - unstable_onDataSourceError={(error: Error, params: GridGetRowsParams) => {
118
+ - if (params.filterModel) {
119
+ - // do something
120
+ - }
121
+ - }}
122
+ + unstable_onDataSourceError={(error: GridGetRowsError | GridUpdateRowError) => {
123
+ + if (error instanceof GridGetRowsError && error.params.filterModel) {
124
+ + // do something
125
+ + }
126
+ + }}
127
+ />
128
+ ```
129
+
130
+ - Fix the type of the `GridSortModel` to allow readonly arrays.
131
+
132
+ - `GridSortItem` interface is not exported anymore.
133
+
134
+ - The `showToolbar` prop is now required to display the toolbar.
135
+
136
+ It is no longer necessary to pass `GridToolbar` as a slot to display the default toolbar.
137
+
138
+ ```diff
139
+ <DataGrid
140
+ + showToolbar
141
+ - slots={{
142
+ - toolbar: GridToolbar,
143
+ - }}
144
+ />
145
+ ```
146
+
147
+ #### `@mui/x-data-grid@8.0.0-alpha.13`
148
+
149
+ - [DataGrid] Add `showToolbar` prop to enable default toolbar (#16687) @KenanYusuf
150
+ - [DataGrid] Column Visibility: Update "Reset" button behavior (#16626) @MBilalShafi
151
+ - [DataGrid] Column management design updates (#16630) @KenanYusuf
152
+ - [DataGrid] Fix `showColumnVerticalBorder` prop (#16715) @KenanYusuf
153
+ - [DataGrid] Fix scrollbar overlapping cells on mount (#16639) @KenanYusuf
154
+ - [DataGrid] Fix: base `Select` menuprops `onClose()` (#16643) @romgrk
155
+ - [DataGrid] Make `GridSortItem` internal (#16732) @arminmeh
156
+ - [DataGrid] Make data source stable (#16710) @MBilalShafi
157
+ - [DataGrid] Reshape row selection model (#15651) @cherniavskii
158
+ - [DataGrid] Replace `sx` prop usage with `styled()` components (#16665) @KenanYusuf
159
+ - [DataGrid] Refactor: create base `Autocomplete` (#16390) @romgrk
160
+ - [DataGrid] Refactor: remove base form control (#16634) @romgrk
161
+ - [DataGrid] Refactor: remove base input label & adornment (#16646) @romgrk
162
+ - [DataGrid] Refactor: remove material containers (#16633) @romgrk
163
+ - [DataGrid] Refactor: theme to CSS variables (#16588) @romgrk
164
+ - [DataGrid] Update the signature of the `onDataSourceError()` callback (#16718) @MBilalShafi
165
+ - [DataGrid] Use readonly array for the `GridSortModel` (#16627) @pcorpet
166
+ - [DataGrid] Fix the popper focus trap (#16736) @romgrk
167
+ - [l10n] Added Bangla (bn-BD) locale (#16648) @officialkidmax
168
+ - [l10n] Improve Hungarian (hu-HU) locale (#16578) @noherczeg
169
+ - [l10n] Improve Russian (ru-RU) locale (#16591) @denpiligrim
170
+
171
+ #### `@mui/x-data-grid-pro@8.0.0-alpha.13` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
172
+
173
+ Same changes as in `@mui/x-data-grid@8.0.0-alpha.13`, plus:
174
+
175
+ - [DataGridPro] Remove `LicenseInfo` reexports (#16671) @cherniavskii
176
+
177
+ #### `@mui/x-data-grid-premium@8.0.0-alpha.13` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
178
+
179
+ Same changes as in `@mui/x-data-grid-pro@8.0.0-alpha.13`, plus:
180
+
181
+ - [DataGridPremium] Use `valueGetter` to get row group keys (#16016) @cherniavskii
182
+
183
+ ### Date and Time Pickers
184
+
185
+ #### Breaking changes
186
+
187
+ - The `<DateRangePicker />` now uses a `dialog` instead of a `tooltip` to render their view when used with a single input range field.
188
+
189
+ #### `@mui/x-date-pickers@8.0.0-alpha.13`
190
+
191
+ - [l10n] Added Bangla (bn-BD) locale (#16648) @officialkidmax
192
+ - [pickers] Clean the typing of the slots on the range pickers (#16670) @flaviendelangle
193
+ - [pickers] Fix Time Clock meridiem button selected styles (#16681) @LukasTy
194
+ - [pickers] Make the single input field the default field on range pickers (#16656) @flaviendelangle
195
+ - [pickers] Move the opening logic to the range fields (#16175) @flaviendelangle
196
+
197
+ #### `@mui/x-date-pickers-pro@8.0.0-alpha.13` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
198
+
199
+ Same changes as in `@mui/x-date-pickers@8.0.0-alpha.13`.
200
+
201
+ ### Charts
202
+
203
+ #### Breaking changes
204
+
205
+ - Charts array inputs are now `readonly`. Allowing externally defined `as const` to be used as a prop value of the React component.
206
+
207
+ ```tsx
208
+ const xAxis = [{ position: 'bottom' }] as const
209
+ <BarChart xAxis={xAxis} />
210
+ ```
211
+
212
+ - Replace `topAxis`, `rightAxis`, `bottomAxis` and `leftAxis` props by the `position` property in the axis config.
213
+ If you were using them to place axis, set the `position` property to the corresponding value `'top' | 'right' | 'bottom' | 'left'`.
214
+ If you were disabling an axis by setting it to `null`, set its `position` to `'none'`.
215
+
216
+ ```diff
217
+ <LineChart
218
+ yAxis={[
219
+ {
220
+ scaleType: 'linear',
221
+ + position: 'right',
222
+ },
223
+ ]}
224
+ series={[{ data: [1, 10, 30, 50, 70, 90, 100], label: 'linear' }]}
225
+ height={400}
226
+ - rightAxis={{}}
227
+ />
228
+ ```
229
+
230
+ - Remove `position` prop from `ChartsXAxis` and `ChartsYAxis`.
231
+ The `position` prop has been removed from the `ChartsXAxis` and `ChartsYAxis` components. Configure it directly in the axis config.
232
+
233
+ ```diff
234
+ <ChartContainer
235
+ yAxis={[
236
+ {
237
+ id: 'my-axis',
238
+ + position: 'right',
239
+ },
240
+ ]}
241
+ >
242
+ - <ChartsYAxis axisId="my-axis" position="right" />
243
+ + <ChartsYAxis axisId="my-axis" />
244
+ </ChartContainer>
245
+ ```
246
+
247
+ - Add `minTickLabelGap` to x-axis, which allows users to define the minimum gap, in pixels, between two tick labels. The default value is 4px. Make sure to check your charts as the spacing between tick labels might have changed.
248
+
249
+ #### `@mui/x-charts@8.0.0-alpha.13`
250
+
251
+ - [charts] Accept component in `labelMarkType` (#16739) @bernardobelchior
252
+ - [charts] Add `minTickLabelGap` to x-axis (#16548) @bernardobelchior
253
+ - [charts] Add unit test for pie chart with empty series (#16663) @bernardobelchior
254
+ - [charts] Decouple `margin` and `axis-size` (#16418) @JCQuintas
255
+ - [charts] Display slider tooltip on demos (#16723) @JCQuintas
256
+ - [charts] Fix composition docs link (#16761) @bernardobelchior
257
+ - [charts] Fix default label measurement being off (#16635) @bernardobelchior
258
+ - [charts] Fix is highlighted memoization (#16592) @alexfauquette
259
+ - [charts] Fix missing `theme.shape` error in the tooltip (#16748) @alexfauquette
260
+ - [charts] Fix typo in error message (#16641) @JCQuintas
261
+ - [charts] Improve axis size docs (#16673) @JCQuintas
262
+ - [charts] Improve performance of rendering ticks in x-axis (#16536) @bernardobelchior
263
+ - [charts] Make `defaultizeAxis` function type-safe (#16642) @JCQuintas
264
+ - [charts] Make `series.data` readonly (#16645) @JCQuintas
265
+ - [charts] Migrate `ChartsUsageDemo` to TSX and removed NoSnap (#16686) @JCQuintas
266
+ - [charts] Prevent `position='none'` axes from rendering (#16727) @JCQuintas
267
+ - [charts] Make array inputs readonly (#16632) @JCQuintas
268
+ - [charts] Remove state initialization hack (#16520) @alexfauquette
269
+ - [charts] Remove redundant default axis (#16734) @bernardobelchior
270
+
271
+ #### `@mui/x-charts-pro@8.0.0-alpha.13` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
272
+
273
+ Same changes as in `@mui/x-charts@8.0.0-alpha.13`, plus:
274
+
275
+ - [charts-pro] Add back zoom control (#16550) @alexfauquette
276
+
277
+ ### Tree View
278
+
279
+ #### `@mui/x-tree-view@8.0.0-alpha.13`
280
+
281
+ Internal changes.
282
+
283
+ #### `@mui/x-tree-view-pro@8.0.0-alpha.13` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
284
+
285
+ Same changes as in `@mui/x-tree-view@8.0.0-alpha.13`.
286
+
287
+ ### `@mui/x-codemod@8.0.0-alpha.13`
288
+
289
+ - [codemod] Add a few Data Grid codemods (#16711) @MBilalShafi
290
+ - [codemod] Improve Pickers renaming codemod (#16685) @LukasTy
291
+
292
+ ### Docs
293
+
294
+ - [docs] Fix charts with on bar and line pages (#16712) @alexfauquette
295
+ - [docs] Fix migration guide introduction for charts (#16679) @alexfauquette
296
+ - [docs] Fix remaining charts demos on mobile (#16728) @alexfauquette
297
+ - [docs] Fix scroll overflow on mobile (#16675) @oliviertassinari
298
+ - [docs] Improve Pickers migration page (#16682) @LukasTy
299
+ - [docs] Update small Pickers doc inconsistencies (#16724) @LukasTy
300
+ - [code-infra] Charts changes for `vitest` (#16755) @JCQuintas
301
+ - [code-infra] General packages changes for `vitest` (#16757) @JCQuintas
302
+ - [code-infra] Native Node.js ESM (#16603) @Janpot
303
+ - [infra] Update contributor acknowledgment wording (#16751) @michelengelen
304
+ - [test] Revert timeout increase for possibly slow tests (#16651) @LukasTy
305
+ - [x-license] Introduce usage telemetry (#13530) @hasdfa
306
+
8
307
  ## 8.0.0-alpha.12
9
308
 
10
309
  _Feb 17, 2025_
@@ -27,7 +27,7 @@ type ChartContainerProComponent = <TSeries extends ChartSeriesType = ChartSeries
27
27
  * xAxis={[{ data: ["A", "B"], scaleType: "band", id: "x-axis" }]}
28
28
  * >
29
29
  * <BarPlot />
30
- * <ChartsXAxis position="bottom" axisId="x-axis" />
30
+ * <ChartsXAxis axisId="x-axis" />
31
31
  * </ChartContainerPro>
32
32
  * ```
33
33
  */
@@ -34,7 +34,7 @@ var _jsxRuntime = require("react/jsx-runtime");
34
34
  * xAxis={[{ data: ["A", "B"], scaleType: "band", id: "x-axis" }]}
35
35
  * >
36
36
  * <BarPlot />
37
- * <ChartsXAxis position="bottom" axisId="x-axis" />
37
+ * <ChartsXAxis axisId="x-axis" />
38
38
  * </ChartContainerPro>
39
39
  * ```
40
40
  */
@@ -10,11 +10,12 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
10
10
  var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
11
11
  var _internals = require("@mui/x-charts/internals");
12
12
  var _allPlugins = require("../internals/plugins/allPlugins");
13
- const _excluded = ["initialZoom", "onZoomChange", "plugins", "apiRef"];
13
+ const _excluded = ["initialZoom", "zoomData", "onZoomChange", "plugins", "apiRef"];
14
14
  const useChartContainerProProps = (props, ref) => {
15
15
  const _ref = props,
16
16
  {
17
17
  initialZoom,
18
+ zoomData,
18
19
  onZoomChange,
19
20
  plugins,
20
21
  apiRef
@@ -27,6 +28,7 @@ const useChartContainerProProps = (props, ref) => {
27
28
  } = (0, _internals.useChartContainerProps)(baseProps, ref);
28
29
  const chartDataProviderProProps = (0, _extends2.default)({}, chartDataProviderProps, {
29
30
  initialZoom,
31
+ zoomData,
30
32
  onZoomChange,
31
33
  apiRef,
32
34
  plugins: plugins ?? _allPlugins.ALL_PLUGINS
@@ -24,7 +24,7 @@ export type ChartDataProviderProProps<TSeries extends ChartSeriesType = ChartSer
24
24
  * >
25
25
  * <ChartsSurface>
26
26
  * <BarPlot />
27
- * <ChartsXAxis position="bottom" axisId="x-axis" />
27
+ * <ChartsXAxis axisId="x-axis" />
28
28
  * </ChartsSurface>
29
29
  * {'Custom Legend Component'}
30
30
  * </ChartDataProviderPro>
@@ -39,7 +39,7 @@ const packageIdentifier = 'x-charts-pro';
39
39
  * >
40
40
  * <ChartsSurface>
41
41
  * <BarPlot />
42
- * <ChartsXAxis position="bottom" axisId="x-axis" />
42
+ * <ChartsXAxis axisId="x-axis" />
43
43
  * </ChartsSurface>
44
44
  * {'Custom Legend Component'}
45
45
  * </ChartDataProviderPro>
@@ -89,7 +89,8 @@ process.env.NODE_ENV !== "production" ? ChartDataProviderPro.propTypes = {
89
89
  /**
90
90
  * The margin between the SVG and the drawing area.
91
91
  * It's used for leaving some space for extra information such as the x- and y-axis or legend.
92
- * Accepts an object with the optional properties: `top`, `bottom`, `left`, and `right`.
92
+ *
93
+ * Accepts a `number` to be used on all sides or an object with the optional properties: `top`, `bottom`, `left`, and `right`.
93
94
  */
94
95
  margin: _propTypes.default.any,
95
96
  /**
@@ -8,6 +8,7 @@ import { ChartContainerProProps } from "../ChartContainerPro/index.js";
8
8
  import { HeatmapSeriesType } from "../models/seriesType/heatmap.js";
9
9
  import { HeatmapTooltipProps } from "./HeatmapTooltip.js";
10
10
  import { HeatmapItemSlotProps, HeatmapItemSlots } from "./HeatmapItem.js";
11
+ import { HeatmapPluginsSignatures } from "./Heatmap.plugins.js";
11
12
  export interface HeatmapSlots extends ChartsAxisSlots, ChartsOverlaySlots, HeatmapItemSlots {
12
13
  /**
13
14
  * Custom component for the tooltip popper.
@@ -18,24 +19,24 @@ export interface HeatmapSlots extends ChartsAxisSlots, ChartsOverlaySlots, Heatm
18
19
  export interface HeatmapSlotProps extends ChartsAxisSlotProps, ChartsOverlaySlotProps, HeatmapItemSlotProps {
19
20
  tooltip?: Partial<HeatmapTooltipProps>;
20
21
  }
21
- export interface HeatmapProps extends Omit<ChartContainerProProps, 'series' | 'plugins' | 'xAxis' | 'yAxis' | 'zoom' | 'onZoomChange' | 'skipAnimation'>, Omit<ChartsAxisProps, 'slots' | 'slotProps'>, Omit<ChartsOverlayProps, 'slots' | 'slotProps'> {
22
+ export interface HeatmapProps extends Omit<ChartContainerProProps<'heatmap', HeatmapPluginsSignatures>, 'series' | 'plugins' | 'xAxis' | 'yAxis' | 'skipAnimation'>, Omit<ChartsAxisProps, 'slots' | 'slotProps'>, Omit<ChartsOverlayProps, 'slots' | 'slotProps'> {
22
23
  /**
23
24
  * The configuration of the x-axes.
24
25
  * If not provided, a default axis config is used.
25
26
  * An array of [[AxisConfig]] objects.
26
27
  */
27
- xAxis: MakeOptional<AxisConfig<'band', any, ChartsXAxisProps>, 'id' | 'scaleType'>[];
28
+ xAxis: Readonly<MakeOptional<AxisConfig<'band', any, ChartsXAxisProps>, 'id' | 'scaleType'>[]>;
28
29
  /**
29
30
  * The configuration of the y-axes.
30
31
  * If not provided, a default axis config is used.
31
32
  * An array of [[AxisConfig]] objects.
32
33
  */
33
- yAxis: MakeOptional<AxisConfig<'band', any, ChartsYAxisProps>, 'id' | 'scaleType'>[];
34
+ yAxis: Readonly<MakeOptional<AxisConfig<'band', any, ChartsYAxisProps>, 'id' | 'scaleType'>[]>;
34
35
  /**
35
36
  * The series to display in the bar chart.
36
37
  * An array of [[HeatmapSeriesType]] objects.
37
38
  */
38
- series: MakeOptional<HeatmapSeriesType, 'type'>[];
39
+ series: Readonly<MakeOptional<HeatmapSeriesType, 'type'>[]>;
39
40
  /**
40
41
  * The configuration of the tooltip.
41
42
  * @see See {@link https://mui.com/x/react-charts/tooltip/ tooltip docs} for more details.