@mui/x-charts-pro 8.17.0 → 8.19.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (72) hide show
  1. package/BarChartPro/BarChartPro.js +6 -1
  2. package/CHANGELOG.md +213 -0
  3. package/ChartDataProviderPro/ChartDataProviderPro.js +1 -1
  4. package/ChartZoomSlider/internals/ChartAxisZoomSliderActiveTrack.js +11 -5
  5. package/ChartZoomSlider/internals/ChartAxisZoomSliderThumb.js +8 -5
  6. package/ChartZoomSlider/internals/ChartAxisZoomSliderTrack.js +6 -3
  7. package/ChartsToolbarPro/ChartsToolbarImageExportTrigger.js +1 -0
  8. package/ChartsToolbarPro/ChartsToolbarPrintExportTrigger.js +1 -0
  9. package/ChartsToolbarPro/ChartsToolbarPro.js +1 -0
  10. package/FunnelChart/funnelAxisPlugin/useChartFunnelAxisRendering.selectors.js +1 -1
  11. package/LineChartPro/LineChartPro.js +6 -1
  12. package/SankeyChart/calculateSankeyLayout.js +16 -7
  13. package/SankeyChart/plugins/useSankeyHighlight.selectors.js +10 -10
  14. package/SankeyChart/sankey.types.d.ts +17 -4
  15. package/ScatterChartPro/ScatterChartPro.js +6 -1
  16. package/esm/BarChartPro/BarChartPro.js +6 -1
  17. package/esm/ChartDataProviderPro/ChartDataProviderPro.js +1 -1
  18. package/esm/ChartZoomSlider/internals/ChartAxisZoomSliderActiveTrack.js +11 -5
  19. package/esm/ChartZoomSlider/internals/ChartAxisZoomSliderThumb.js +8 -5
  20. package/esm/ChartZoomSlider/internals/ChartAxisZoomSliderTrack.js +6 -3
  21. package/esm/ChartsToolbarPro/ChartsToolbarImageExportTrigger.js +1 -0
  22. package/esm/ChartsToolbarPro/ChartsToolbarPrintExportTrigger.js +1 -0
  23. package/esm/ChartsToolbarPro/ChartsToolbarPro.js +1 -0
  24. package/esm/FunnelChart/funnelAxisPlugin/useChartFunnelAxisRendering.selectors.js +3 -3
  25. package/esm/LineChartPro/LineChartPro.js +6 -1
  26. package/esm/SankeyChart/calculateSankeyLayout.js +16 -7
  27. package/esm/SankeyChart/plugins/useSankeyHighlight.selectors.js +10 -10
  28. package/esm/SankeyChart/sankey.types.d.ts +17 -4
  29. package/esm/ScatterChartPro/ScatterChartPro.js +6 -1
  30. package/esm/hooks/useFunnelSeries.js +3 -5
  31. package/esm/hooks/useHeatmapSeries.js +3 -5
  32. package/esm/hooks/useSankeySeries.js +3 -5
  33. package/esm/index.js +1 -1
  34. package/esm/internals/plugins/useChartProExport/exportImage.js +5 -3
  35. package/esm/internals/plugins/useChartProExport/print.d.ts +2 -1
  36. package/esm/internals/plugins/useChartProExport/print.js +3 -2
  37. package/esm/internals/plugins/useChartProExport/useChartProExport.types.d.ts +5 -0
  38. package/esm/internals/plugins/useChartProZoom/ZoomInteractionConfig.selectors.d.ts +4 -12
  39. package/esm/internals/plugins/useChartProZoom/ZoomInteractionConfig.selectors.js +5 -4
  40. package/esm/internals/plugins/useChartProZoom/ZoomInteractionConfig.types.d.ts +17 -2
  41. package/esm/internals/plugins/useChartProZoom/gestureHooks/usePanOnWheel.d.ts +8 -0
  42. package/esm/internals/plugins/useChartProZoom/gestureHooks/usePanOnWheel.js +98 -0
  43. package/esm/internals/plugins/useChartProZoom/gestureHooks/useZoom.utils.d.ts +1 -1
  44. package/esm/internals/plugins/useChartProZoom/gestureHooks/useZoom.utils.js +2 -2
  45. package/esm/internals/plugins/useChartProZoom/initializeZoomInteractionConfig.d.ts +2 -1
  46. package/esm/internals/plugins/useChartProZoom/initializeZoomInteractionConfig.js +38 -5
  47. package/esm/internals/plugins/useChartProZoom/useChartProZoom.js +9 -3
  48. package/esm/internals/plugins/useChartProZoom/useChartProZoom.selectors.js +7 -6
  49. package/esm/utils/index.d.ts +1 -0
  50. package/esm/utils/index.js +2 -0
  51. package/hooks/useFunnelSeries.js +2 -5
  52. package/hooks/useHeatmapSeries.js +2 -5
  53. package/hooks/useSankeySeries.js +2 -5
  54. package/index.js +1 -1
  55. package/internals/plugins/useChartProExport/exportImage.js +5 -3
  56. package/internals/plugins/useChartProExport/print.d.ts +2 -1
  57. package/internals/plugins/useChartProExport/print.js +3 -2
  58. package/internals/plugins/useChartProExport/useChartProExport.types.d.ts +5 -0
  59. package/internals/plugins/useChartProZoom/ZoomInteractionConfig.selectors.d.ts +4 -12
  60. package/internals/plugins/useChartProZoom/ZoomInteractionConfig.selectors.js +4 -3
  61. package/internals/plugins/useChartProZoom/ZoomInteractionConfig.types.d.ts +17 -2
  62. package/internals/plugins/useChartProZoom/gestureHooks/usePanOnWheel.d.ts +8 -0
  63. package/internals/plugins/useChartProZoom/gestureHooks/usePanOnWheel.js +105 -0
  64. package/internals/plugins/useChartProZoom/gestureHooks/useZoom.utils.d.ts +1 -1
  65. package/internals/plugins/useChartProZoom/gestureHooks/useZoom.utils.js +2 -2
  66. package/internals/plugins/useChartProZoom/initializeZoomInteractionConfig.d.ts +2 -1
  67. package/internals/plugins/useChartProZoom/initializeZoomInteractionConfig.js +38 -5
  68. package/internals/plugins/useChartProZoom/useChartProZoom.js +9 -3
  69. package/internals/plugins/useChartProZoom/useChartProZoom.selectors.js +6 -5
  70. package/package.json +8 -8
  71. package/utils/index.d.ts +1 -0
  72. package/utils/index.js +16 -0
@@ -1446,7 +1446,7 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
1446
1446
  * Configuration for zoom interactions.
1447
1447
  */
1448
1448
  zoomInteractionConfig: _propTypes.default.shape({
1449
- pan: _propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf(['drag', 'pressAndDrag']), _propTypes.default.shape({
1449
+ pan: _propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf(['drag', 'pressAndDrag', 'wheel']), _propTypes.default.shape({
1450
1450
  pointerMode: _propTypes.default.oneOf(['mouse', 'touch']),
1451
1451
  requiredKeys: _propTypes.default.arrayOf(_propTypes.default.string),
1452
1452
  type: _propTypes.default.oneOf(['drag']).isRequired
@@ -1454,6 +1454,11 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
1454
1454
  pointerMode: _propTypes.default.oneOf(['mouse', 'touch']),
1455
1455
  requiredKeys: _propTypes.default.arrayOf(_propTypes.default.string),
1456
1456
  type: _propTypes.default.oneOf(['pressAndDrag']).isRequired
1457
+ }), _propTypes.default.shape({
1458
+ allowedDirection: _propTypes.default.oneOf(['x', 'xy', 'y']),
1459
+ pointerMode: _propTypes.default.any,
1460
+ requiredKeys: _propTypes.default.arrayOf(_propTypes.default.string),
1461
+ type: _propTypes.default.oneOf(['wheel']).isRequired
1457
1462
  })]).isRequired),
1458
1463
  zoom: _propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf(['brush', 'doubleTapReset', 'pinch', 'tapAndDrag', 'wheel']), _propTypes.default.shape({
1459
1464
  pointerMode: _propTypes.default.any,
package/CHANGELOG.md CHANGED
@@ -5,6 +5,219 @@
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.19.0
9
+
10
+ _Nov 20, 2025_
11
+
12
+ We'd like to extend a big thank you to the 15 contributors who made this release possible. Here are some highlights ✨:
13
+
14
+ - 🔎 Add pan on `wheel` to the charts zoom
15
+ - ⌨️ Allow opt-in to [tab navigation](https://mui.com/x/react-data-grid/accessibility/#tab-navigation) inside the Data Grid.
16
+ - ⚙️ New way of defining [action columns](https://mui.com/x/react-data-grid/column-definition/#ActionsWithModalGrid.tsx) in the Data Grid that makes it easier to keep `columns` prop stable.
17
+ - 🐞 Bugfixes
18
+ - 📚 Documentation improvements
19
+
20
+ Special thanks go out to these community members for their valuable contributions:
21
+ @lauri865, @noobyogi0010, @sai6855
22
+
23
+ The following team members contributed to this release:
24
+ @alexfauquette, @arminmeh, @bernardobelchior, @cherniavskii, @flaviendelangle, @Janpot, @JCQuintas, @mj12albert, @noraleonte, @rita-codes, @siriwatknp, @ZeeshanTamboli
25
+
26
+ ### Data Grid
27
+
28
+ #### `@mui/x-data-grid@8.19.0`
29
+
30
+ - [DataGrid] Add `tabNavigation` prop to control tab navigation in the grid (#20286) @arminmeh
31
+ - [DataGrid] Allow to focus disabled checkbox cells (#19959) @mj12albert
32
+ - [DataGrid] Alternative actions column definition API (#15041) @cherniavskii
33
+ - [DataGrid] Fix failing tests (#20332) @cherniavskii
34
+ - [DataGrid] Prevent Safari 26 error in the event handler (#20369) @arminmeh
35
+ - [DataGrid] Undeprecate the `autoHeight` prop (#20363) @cherniavskii
36
+ - [DataGrid] Fix print export grid dimensions with dynamic row height and print styles (#19835) @cherniavskii
37
+
38
+ #### `@mui/x-data-grid-pro@8.19.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
39
+
40
+ Same changes as in `@mui/x-data-grid@8.19.0`.
41
+
42
+ #### `@mui/x-data-grid-premium@8.19.0` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
43
+
44
+ Same changes as in `@mui/x-data-grid-pro@8.19.0`, plus:
45
+
46
+ - [DataGridPremium] Fix aggregation with sorting (#19892) @lauri865
47
+ - [DataGridPremium] Lock `ExcelJS` version (#20329) @cherniavskii
48
+
49
+ ### Date and Time Pickers
50
+
51
+ #### `@mui/x-date-pickers@8.19.0`
52
+
53
+ - [pickers] Do not loose `slotProps.field.slotProps` (#20322) @flaviendelangle
54
+
55
+ #### `@mui/x-date-pickers-pro@8.19.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
56
+
57
+ Same changes as in `@mui/x-date-pickers@8.19.0`.
58
+
59
+ ### Charts
60
+
61
+ #### `@mui/x-charts@8.19.0`
62
+
63
+ - [charts] Expose `niceDomain` utility (#20250) @bernardobelchior
64
+ - [charts] Fix benchmark regression by downgrading to JSDOM v26 (#20405) @bernardobelchior
65
+ - [charts] Fix Pie Chart keyboard focus highlight (#20358) @JCQuintas
66
+ - [charts] Memoize series selectors (#20326) @JCQuintas
67
+ - [charts] Relax dataset type (#20294) @bernardobelchior
68
+ - [charts] Remove `touch-action: pan-y` when zoom is disabled (#20204) @bernardobelchior
69
+ - [charts] Use `getBBox()` for correct SVG sizes in firefox (#20309) @JCQuintas
70
+ - [charts] Use directly selector from `@mui/x-internals` (#20365) @alexfauquette
71
+ - [charts] Fix unnecessary errors in dev mode (#20380) @JCQuintas
72
+
73
+ #### `@mui/x-charts-pro@8.19.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
74
+
75
+ Same changes as in `@mui/x-charts@8.19.0`, plus:
76
+
77
+ - [charts-pro] Add pan on `wheel` to zoom (#19998) @JCQuintas
78
+ - [charts-pro] Fix zoom slider preview having an opaque background in dark mode (#20367) @bernardobelchior
79
+
80
+ #### `@mui/x-charts-premium@8.19.0` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
81
+
82
+ Same changes as in `@mui/x-charts-pro@8.19.0`.
83
+
84
+ ### Tree View
85
+
86
+ #### `@mui/x-tree-view@8.19.0`
87
+
88
+ - [tree view] Enable lazy load when children count is not know in tree view (#18680) @noobyogi0010
89
+ - [tree view] Fix unwanted behaviors on the item re-ordering (#20368) @flaviendelangle
90
+
91
+ #### `@mui/x-tree-view-pro@8.19.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
92
+
93
+ Same changes as in `@mui/x-tree-view@8.19.0`.
94
+
95
+ ### Codemod
96
+
97
+ #### `@mui/x-codemod@8.19.0`
98
+
99
+ Internal changes.
100
+
101
+ ### Docs
102
+
103
+ - [docs] Add minimum Typescript version to migration guide (#20320) @siriwatknp
104
+ - [docs] Fix Autosizing documentation (#20348) @siriwatknp
105
+ - [docs] Fix separator opacity in demo (#20293) @sai6855
106
+ - [docs] Replace deprecated `LoadingButton` with `Button` component (#20208) @Janpot
107
+
108
+ ### Core
109
+
110
+ - [code-infra] Add new broken links checker (#20120) @Janpot
111
+ - [code-infra] Disable Codspeed pipeline (#20370) @JCQuintas
112
+ - [code-infra] Optimize `checkMaterialVersion` (#20307) @Janpot
113
+ - [code-infra] Use utils from code-infra for changelog and PR creation (#20406) @brijeshb42
114
+ - [docs-infra] Revert `@docsearch/react` (#20313) @Janpot
115
+
116
+ ### Miscellaneous
117
+
118
+ - [test] Fix browser tests skipping some projects (#20318) @cherniavskii
119
+ - [test] Update `use-react-version` pnpm script (#20319) @cherniavskii
120
+
121
+ ## 8.18.0
122
+
123
+ <!-- generated comparing v8.17.0..master -->
124
+
125
+ _Nov 13, 2025_
126
+
127
+ We'd like to extend a big thank you to the 14 contributors who made this release possible. Here are some highlights ✨:
128
+
129
+ - Add `barLabelPlacement` property to customize the bar label position in bar charts, enabling labels to be placed above bars.
130
+
131
+ ![image](https://github.com/user-attachments/assets/4bc3a75b-74b8-4c6d-896b-5f5bf837bcda)
132
+
133
+ - Add `source` property to the date/time picker lifecycle and event handler context, enabling clearer differentiation between changes initiated by the picker UI and those from direct field input.
134
+ - 🐞 Bugfixes
135
+ - 📚 Documentation improvements
136
+
137
+ Special thanks go out to these community members for their valuable contributions:
138
+ @htollefsen, @sai6855, @Sigdriv
139
+
140
+ The following team members contributed to this release:
141
+ @arminmeh, @bernardobelchior, @brijeshb42, @cherniavskii, @flaviendelangle, @JCQuintas, @michelengelen, @noraleonte, @prakhargupta1, @rita-codes, @siriwatknp
142
+
143
+ ### Data Grid
144
+
145
+ #### `@mui/x-data-grid@8.18.0`
146
+
147
+ - [DataGrid] Allow default event in the column action cell item click event handler (#20272) @arminmeh
148
+ - [DataGrid] Remove unnecessary generic from `useGridApiRef` (#20277) @cherniavskii
149
+
150
+ #### `@mui/x-data-grid-pro@8.18.0` [![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-data-grid@8.18.0`.
153
+
154
+ #### `@mui/x-data-grid-premium@8.18.0` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
155
+
156
+ Same changes as in `@mui/x-data-grid-pro@8.18.0`, plus:
157
+
158
+ - [DataGridPremium] Return the correct `cellParams` value from the aggregation cells (#20224) @arminmeh
159
+
160
+ ### Date and Time Pickers
161
+
162
+ #### `@mui/x-date-pickers@8.18.0`
163
+
164
+ - [pickers] Keep invalid date state consistent (#20040) @michelengelen
165
+ - [pickers] Adds new `source` property to `onChange` and `onAccept` context object (#20234) @michelengelen
166
+
167
+ #### `@mui/x-date-pickers-pro@8.18.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
168
+
169
+ Same changes as in `@mui/x-date-pickers@8.18.0`.
170
+
171
+ ### Charts
172
+
173
+ #### `@mui/x-charts@8.18.0`
174
+
175
+ - [charts] Add prop for positioning a bar label (#20194) @Sigdriv
176
+ - [charts] Fix applying dark mode styles in `ChartAxisZoomSliderThumb` (#20232) @sai6855
177
+
178
+ #### `@mui/x-charts-pro@8.18.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
179
+
180
+ Same changes as in `@mui/x-charts@8.18.0`, plus:
181
+
182
+ - [charts-pro] Allow specifying Content Security Policy nonce on export (#20053) @bernardobelchior
183
+ - [charts-pro] Fix applying dark mode styles to slider (#20220) @sai6855
184
+ - [charts-pro] Sankey should respect node order (#20065) @JCQuintas
185
+
186
+ #### `@mui/x-charts-premium@8.18.0` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
187
+
188
+ Same changes as in `@mui/x-charts-pro@8.18.0`.
189
+
190
+ ### Tree View
191
+
192
+ #### `@mui/x-tree-view@8.18.0`
193
+
194
+ - [tree view] Prepare tests for the new store structure (#20225) @flaviendelangle
195
+ - [tree view] Prepare the item plugin files for the store migration (#20240) @flaviendelangle
196
+ - [tree view] Use `TreeItemId` type instead of raw string (#20233) @flaviendelangle
197
+
198
+ #### `@mui/x-tree-view-pro@8.18.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
199
+
200
+ Same changes as in `@mui/x-tree-view@8.18.0`.
201
+
202
+ ### Codemod
203
+
204
+ #### `@mui/x-codemod@8.18.0`
205
+
206
+ Internal changes.
207
+
208
+ ### Docs
209
+
210
+ - [charts] Add a demo for a custom tick label (#20073) @prakhargupta1
211
+ - [charts] Create `useAxes()` hook documentation page (#20229) @JCQuintas
212
+ - [charts] Fix logo alignment (#20228) @JCQuintas
213
+ - [charts] Fixes typo in import example (#20236) @htollefsen
214
+ - [Data Grid] Add recipe for cursor pagination with data source (#19700) @siriwatknp
215
+ - [Data Grid] Add a demo for pinned rows aggregation (#20198) @cherniavskii
216
+
217
+ ### Core
218
+
219
+ - [docs-infra] Use deployment config from docs-infra package (#20243) @brijeshb42
220
+
8
221
  ## 8.17.0
9
222
 
10
223
  _Nov 5, 2025_
@@ -16,7 +16,7 @@ var _material = require("../internals/material");
16
16
  var _allPlugins = require("../internals/plugins/allPlugins");
17
17
  var _useChartDataProviderProProps = require("./useChartDataProviderProProps");
18
18
  var _jsxRuntime = require("react/jsx-runtime");
19
- const releaseInfo = "MTc2MjMwMDgwMDAwMA==";
19
+ const releaseInfo = "MTc2MzU5NjgwMDAwMA==";
20
20
  const packageIdentifier = 'x-charts-pro';
21
21
  /**
22
22
  * Orchestrates the data providers for the chart components and hooks.
@@ -24,19 +24,25 @@ const ZoomSliderActiveTrackRect = (0, _styles.styled)('rect', {
24
24
  shouldForwardProp: prop => (0, _system.shouldForwardProp)(prop) && prop !== 'preview'
25
25
  })(({
26
26
  theme
27
- }) => ({
28
- fill: theme.palette.mode === 'dark' ? (theme.vars || theme).palette.grey[500] : (theme.vars || theme).palette.grey[600],
27
+ }) => (0, _extends2.default)({
28
+ fill: (theme.vars || theme).palette.grey[600]
29
+ }, theme.applyStyles('dark', {
30
+ fill: (theme.vars || theme).palette.grey[500]
31
+ }), {
29
32
  cursor: 'grab',
30
33
  variants: [{
31
34
  props: {
32
35
  preview: true
33
36
  },
34
- style: {
35
- fill: 'transparent',
37
+ style: (0, _extends2.default)({
38
+ fill: 'transparent'
39
+ }, theme.applyStyles('dark', {
40
+ fill: 'transparent'
41
+ }), {
36
42
  rx: 4,
37
43
  ry: 4,
38
44
  stroke: theme.palette.grey[500]
39
- }
45
+ })
40
46
  }]
41
47
  }));
42
48
  function ChartAxisZoomSliderActiveTrack({
@@ -7,8 +7,8 @@ Object.defineProperty(exports, "__esModule", {
7
7
  value: true
8
8
  });
9
9
  exports.ChartAxisZoomSliderThumb = void 0;
10
- var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
11
10
  var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
11
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
12
12
  var React = _interopRequireWildcard(require("react"));
13
13
  var _styles = require("@mui/material/styles");
14
14
  var _useForkRef = _interopRequireDefault(require("@mui/utils/useForkRef"));
@@ -21,10 +21,13 @@ const _excluded = ["className", "onMove", "orientation", "placement", "rx", "ry"
21
21
  const Rect = (0, _styles.styled)('rect')(({
22
22
  theme
23
23
  }) => ({
24
- [`&.${_chartAxisZoomSliderThumbClasses.chartAxisZoomSliderThumbClasses.root}`]: {
25
- fill: theme.palette.mode === 'dark' ? (theme.vars || theme).palette.grey[300] : (theme.vars || theme).palette.common.white,
26
- stroke: theme.palette.mode === 'dark' ? (theme.vars || theme).palette.grey[600] : (theme.vars || theme).palette.grey[500]
27
- },
24
+ [`&.${_chartAxisZoomSliderThumbClasses.chartAxisZoomSliderThumbClasses.root}`]: (0, _extends2.default)({
25
+ fill: (theme.vars || theme).palette.common.white,
26
+ stroke: (theme.vars || theme).palette.grey[500]
27
+ }, theme.applyStyles('dark', {
28
+ fill: (theme.vars || theme).palette.grey[300],
29
+ stroke: (theme.vars || theme).palette.grey[600]
30
+ })),
28
31
  [`&.${_chartAxisZoomSliderThumbClasses.chartAxisZoomSliderThumbClasses.horizontal}`]: {
29
32
  cursor: 'ew-resize'
30
33
  },
@@ -7,8 +7,8 @@ Object.defineProperty(exports, "__esModule", {
7
7
  value: true
8
8
  });
9
9
  exports.ChartAxisZoomSliderTrack = ChartAxisZoomSliderTrack;
10
- var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
11
10
  var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
11
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
12
12
  var React = _interopRequireWildcard(require("react"));
13
13
  var _internals = require("@mui/x-charts/internals");
14
14
  var _styles = require("@mui/material/styles");
@@ -23,8 +23,11 @@ const ZoomSliderTrack = (0, _styles.styled)('rect', {
23
23
  shouldForwardProp: prop => (0, _system.shouldForwardProp)(prop) && prop !== 'axisDirection' && prop !== 'isSelecting'
24
24
  })(({
25
25
  theme
26
- }) => ({
27
- fill: theme.palette.mode === 'dark' ? (theme.vars || theme).palette.grey[800] : (theme.vars || theme).palette.grey[300],
26
+ }) => (0, _extends2.default)({
27
+ fill: (theme.vars || theme).palette.grey[300]
28
+ }, theme.applyStyles('dark', {
29
+ fill: (theme.vars || theme).palette.grey[800]
30
+ }), {
28
31
  cursor: 'pointer',
29
32
  variants: [{
30
33
  props: {
@@ -66,6 +66,7 @@ process.env.NODE_ENV !== "production" ? ChartsToolbarImageExportTrigger.propType
66
66
  options: _propTypes.default.shape({
67
67
  copyStyles: _propTypes.default.bool,
68
68
  fileName: _propTypes.default.string,
69
+ nonce: _propTypes.default.string,
69
70
  onBeforeExport: _propTypes.default.func,
70
71
  quality: _propTypes.default.number,
71
72
  type: _propTypes.default.string.isRequired
@@ -66,6 +66,7 @@ process.env.NODE_ENV !== "production" ? ChartsToolbarPrintExportTrigger.propType
66
66
  options: _propTypes.default.shape({
67
67
  copyStyles: _propTypes.default.bool,
68
68
  fileName: _propTypes.default.string,
69
+ nonce: _propTypes.default.string,
69
70
  onBeforeExport: _propTypes.default.func
70
71
  }),
71
72
  /**
@@ -160,6 +160,7 @@ process.env.NODE_ENV !== "production" ? ChartsToolbarPro.propTypes = {
160
160
  imageExportOptions: _propTypes.default.arrayOf(_propTypes.default.shape({
161
161
  copyStyles: _propTypes.default.bool,
162
162
  fileName: _propTypes.default.string,
163
+ nonce: _propTypes.default.string,
163
164
  onBeforeExport: _propTypes.default.func,
164
165
  quality: _propTypes.default.number,
165
166
  type: _propTypes.default.string.isRequired
@@ -9,7 +9,7 @@ var _internals = require("@mui/x-charts/internals");
9
9
  var _computeAxisValue = require("./computeAxisValue");
10
10
  const selectorFunnel = state => state.funnel;
11
11
  exports.selectorFunnel = selectorFunnel;
12
- const selectorFunnelGap = exports.selectorFunnelGap = (0, _internals.createSelector)([selectorFunnel], funnel => funnel?.gap ?? 0);
12
+ const selectorFunnelGap = exports.selectorFunnelGap = (0, _store.createSelector)(selectorFunnel, funnel => funnel?.gap ?? 0);
13
13
  const selectorChartXAxis = exports.selectorChartXAxis = (0, _store.createSelectorMemoized)(_internals.selectorChartRawXAxis, _internals.selectorChartDrawingArea, _internals.selectorChartSeriesProcessed, _internals.selectorChartSeriesConfig, selectorFunnelGap, (axis, drawingArea, formattedSeries, seriesConfig, gap) => (0, _computeAxisValue.computeAxisValue)({
14
14
  drawingArea,
15
15
  formattedSeries,
@@ -1448,7 +1448,7 @@ process.env.NODE_ENV !== "production" ? LineChartPro.propTypes = {
1448
1448
  * Configuration for zoom interactions.
1449
1449
  */
1450
1450
  zoomInteractionConfig: _propTypes.default.shape({
1451
- pan: _propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf(['drag', 'pressAndDrag']), _propTypes.default.shape({
1451
+ pan: _propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf(['drag', 'pressAndDrag', 'wheel']), _propTypes.default.shape({
1452
1452
  pointerMode: _propTypes.default.oneOf(['mouse', 'touch']),
1453
1453
  requiredKeys: _propTypes.default.arrayOf(_propTypes.default.string),
1454
1454
  type: _propTypes.default.oneOf(['drag']).isRequired
@@ -1456,6 +1456,11 @@ process.env.NODE_ENV !== "production" ? LineChartPro.propTypes = {
1456
1456
  pointerMode: _propTypes.default.oneOf(['mouse', 'touch']),
1457
1457
  requiredKeys: _propTypes.default.arrayOf(_propTypes.default.string),
1458
1458
  type: _propTypes.default.oneOf(['pressAndDrag']).isRequired
1459
+ }), _propTypes.default.shape({
1460
+ allowedDirection: _propTypes.default.oneOf(['x', 'xy', 'y']),
1461
+ pointerMode: _propTypes.default.any,
1462
+ requiredKeys: _propTypes.default.arrayOf(_propTypes.default.string),
1463
+ type: _propTypes.default.oneOf(['wheel']).isRequired
1459
1464
  })]).isRequired),
1460
1465
  zoom: _propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf(['brush', 'doubleTapReset', 'pinch', 'tapAndDrag', 'wheel']), _propTypes.default.shape({
1461
1466
  pointerMode: _propTypes.default.any,
@@ -30,11 +30,11 @@ function calculateSankeyLayout(data, drawingArea, theme, series = {}) {
30
30
  width: nodeWidth = 15,
31
31
  padding: nodePadding = 10,
32
32
  align: nodeAlign = 'justify',
33
- sort: nodeSort = null
33
+ sort: nodeSort
34
34
  } = nodeOptions ?? {};
35
35
  const {
36
36
  color: linkColor = 'source',
37
- sort: linkSort = null,
37
+ sort: linkSort,
38
38
  curveCorrection = 10
39
39
  } = linkOptions ?? {};
40
40
  const {
@@ -59,12 +59,21 @@ function calculateSankeyLayout(data, drawingArea, theme, series = {}) {
59
59
  };
60
60
 
61
61
  // Create the sankey layout generator
62
- let sankeyGenerator = (0, _d3Sankey.sankey)().nodeWidth(nodeWidth).nodePadding(nodePadding).nodeAlign((0, _utils.getNodeAlignFunction)(nodeAlign)).extent([[left, top], [width + right, height + bottom]]).nodeId(d => d.id).iterations(iterations);
63
- if (nodeSort) {
64
- sankeyGenerator = sankeyGenerator.nodeSort(nodeSort);
62
+ const sankeyGenerator = (0, _d3Sankey.sankey)().nodeWidth(nodeWidth).nodePadding(nodePadding).nodeAlign((0, _utils.getNodeAlignFunction)(nodeAlign)).extent([[left, top], [width + right, height + bottom]]).nodeId(d => d.id).iterations(iterations);
63
+
64
+ // For 'auto' or undefined, don't set anything (use d3-sankey default behavior)
65
+ if (typeof nodeSort === 'function') {
66
+ sankeyGenerator.nodeSort(nodeSort);
67
+ } else if (nodeSort === 'fixed') {
68
+ // Null is not accepted by the types.
69
+ // https://github.com/DefinitelyTyped/DefinitelyTyped/pull/73953
70
+ sankeyGenerator.nodeSort(null);
65
71
  }
66
- if (linkSort) {
67
- sankeyGenerator = sankeyGenerator.linkSort(linkSort);
72
+ if (typeof linkSort === 'function') {
73
+ sankeyGenerator.linkSort(linkSort);
74
+ } else if (linkSort === 'fixed') {
75
+ // Null is not accepted by the types.
76
+ sankeyGenerator.linkSort(null);
68
77
  }
69
78
 
70
79
  // Generate the layout
@@ -4,10 +4,10 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.selectorSankeyHighlightedItem = exports.selectorNodeHighlightConfig = exports.selectorNodeFadeConfig = exports.selectorLinkHighlightConfig = exports.selectorLinkFadeConfig = exports.selectorIsSankeyItemFaded = exports.selectorIsNodeHighlighted = exports.selectorIsLinkHighlighted = void 0;
7
- var _internals = require("@mui/x-charts/internals");
7
+ var _store = require("@mui/x-internals/store");
8
8
  const selectorSankeyHighlight = state => state.highlight;
9
9
  const selectSeries = state => state.series;
10
- const selectorSankeySeries = (0, _internals.createSelector)([selectSeries], series => series.processedSeries.sankey?.series[series.processedSeries.sankey?.seriesOrder[0]] || null);
10
+ const selectorSankeySeries = (0, _store.createSelector)(selectSeries, series => series.processedSeries.sankey?.series[series.processedSeries.sankey?.seriesOrder[0]] || null);
11
11
  const DEFAULT_NODE_HIGHLIGHT = 'links';
12
12
  const DEFAULT_LINK_HIGHLIGHT = 'links';
13
13
  const DEFAULT_FADE = 'none';
@@ -16,32 +16,32 @@ const DEFAULT_FADE = 'none';
16
16
  * Get the node highlight configuration from the Sankey series.
17
17
  * Defaults to 'nodes' if not specified.
18
18
  */
19
- const selectorNodeHighlightConfig = exports.selectorNodeHighlightConfig = (0, _internals.createSelector)([selectorSankeySeries], series => series?.nodeOptions?.highlight ?? DEFAULT_NODE_HIGHLIGHT);
19
+ const selectorNodeHighlightConfig = exports.selectorNodeHighlightConfig = (0, _store.createSelector)(selectorSankeySeries, series => series?.nodeOptions?.highlight ?? DEFAULT_NODE_HIGHLIGHT);
20
20
 
21
21
  /**
22
22
  * Get the node fade configuration from the Sankey series.
23
23
  * Defaults to 'none' if not specified.
24
24
  */
25
- const selectorNodeFadeConfig = exports.selectorNodeFadeConfig = (0, _internals.createSelector)([selectorSankeySeries], series => series?.nodeOptions?.fade ?? DEFAULT_FADE);
25
+ const selectorNodeFadeConfig = exports.selectorNodeFadeConfig = (0, _store.createSelector)(selectorSankeySeries, series => series?.nodeOptions?.fade ?? DEFAULT_FADE);
26
26
 
27
27
  /**
28
28
  * Get the link highlight configuration from the Sankey series.
29
29
  * Defaults to 'links' if not specified.
30
30
  */
31
- const selectorLinkHighlightConfig = exports.selectorLinkHighlightConfig = (0, _internals.createSelector)([selectorSankeySeries], series => series?.linkOptions?.highlight ?? DEFAULT_LINK_HIGHLIGHT);
31
+ const selectorLinkHighlightConfig = exports.selectorLinkHighlightConfig = (0, _store.createSelector)(selectorSankeySeries, series => series?.linkOptions?.highlight ?? DEFAULT_LINK_HIGHLIGHT);
32
32
 
33
33
  /**
34
34
  * Get the link fade configuration from the Sankey series.
35
35
  * Defaults to 'none' if not specified.
36
36
  */
37
- const selectorLinkFadeConfig = exports.selectorLinkFadeConfig = (0, _internals.createSelector)([selectorSankeySeries], series => series?.linkOptions?.fade ?? DEFAULT_FADE);
37
+ const selectorLinkFadeConfig = exports.selectorLinkFadeConfig = (0, _store.createSelector)(selectorSankeySeries, series => series?.linkOptions?.fade ?? DEFAULT_FADE);
38
38
 
39
39
  /**
40
40
  * Get the currently highlighted item in the Sankey chart.
41
41
  * @param {UseSankeyHighlightSignature['state']} state The state of the chart.
42
42
  * @returns {SankeyItemIdentifier | null} The highlighted item identifier or null.
43
43
  */
44
- const selectorSankeyHighlightedItem = exports.selectorSankeyHighlightedItem = (0, _internals.createSelector)([selectorSankeyHighlight], highlight => highlight.item);
44
+ const selectorSankeyHighlightedItem = exports.selectorSankeyHighlightedItem = (0, _store.createSelector)(selectorSankeyHighlight, highlight => highlight.item);
45
45
 
46
46
  /**
47
47
  * Determines if a specific node should be highlighted.
@@ -49,7 +49,7 @@ const selectorSankeyHighlightedItem = exports.selectorSankeyHighlightedItem = (0
49
49
  * - It's the highlighted node (unless highlight mode is 'none')
50
50
  * - It's connected to a highlighted link (based on linkOptions.highlight)
51
51
  */
52
- const selectorIsNodeHighlighted = exports.selectorIsNodeHighlighted = (0, _internals.createSelector)([selectorSankeyHighlightedItem, selectorNodeHighlightConfig, selectorLinkHighlightConfig], (highlightedItem, nodeHighlight, linkHighlight, nodeId) => {
52
+ const selectorIsNodeHighlighted = exports.selectorIsNodeHighlighted = (0, _store.createSelector)(selectorSankeyHighlightedItem, selectorNodeHighlightConfig, selectorLinkHighlightConfig, (highlightedItem, nodeHighlight, linkHighlight, nodeId) => {
53
53
  if (!highlightedItem) {
54
54
  return false;
55
55
  }
@@ -84,7 +84,7 @@ const selectorIsNodeHighlighted = exports.selectorIsNodeHighlighted = (0, _inter
84
84
  * - It's the highlighted link (unless highlight mode is 'none')
85
85
  * - It's connected to a highlighted node (based on nodeOptions.highlight)
86
86
  */
87
- const selectorIsLinkHighlighted = exports.selectorIsLinkHighlighted = (0, _internals.createSelector)([selectorSankeyHighlightedItem, selectorNodeHighlightConfig, selectorLinkHighlightConfig], (highlightedItem, nodeHighlight, linkHighlight, link) => {
87
+ const selectorIsLinkHighlighted = exports.selectorIsLinkHighlighted = (0, _store.createSelector)(selectorSankeyHighlightedItem, selectorNodeHighlightConfig, selectorLinkHighlightConfig, (highlightedItem, nodeHighlight, linkHighlight, link) => {
88
88
  if (!highlightedItem) {
89
89
  return false;
90
90
  }
@@ -117,7 +117,7 @@ const selectorIsLinkHighlighted = exports.selectorIsLinkHighlighted = (0, _inter
117
117
  * - This item is not highlighted
118
118
  * - The fade mode is 'global' for the highlighted element type
119
119
  */
120
- const selectorIsSankeyItemFaded = exports.selectorIsSankeyItemFaded = (0, _internals.createSelector)([selectorSankeyHighlightedItem, selectorNodeFadeConfig, selectorLinkFadeConfig], (highlightedItem, nodeFade, linkFade, isHighlighted) => {
120
+ const selectorIsSankeyItemFaded = exports.selectorIsSankeyItemFaded = (0, _store.createSelector)(selectorSankeyHighlightedItem, selectorNodeFadeConfig, selectorLinkFadeConfig, (highlightedItem, nodeFade, linkFade, isHighlighted) => {
121
121
  if (!highlightedItem || isHighlighted) {
122
122
  return false;
123
123
  }
@@ -74,12 +74,19 @@ export type SankeyNodeOptions = {
74
74
  */
75
75
  showLabels?: boolean;
76
76
  /**
77
- * Custom sort function for nodes
77
+ * Custom sort mode for nodes
78
+ *
79
+ * - 'auto': Automatic sorting behavior (default)
80
+ * - 'fixed': Preserve the order from the nodes array (disables automatic sorting)
81
+ * - or a custom function
82
+ *
78
83
  * @param {SankeyLayoutNode} a - First node to compare
79
84
  * @param {SankeyLayoutNode} b - Second node to compare
80
85
  * @returns {number} Comparison result
86
+ *
87
+ * @default 'auto'
81
88
  */
82
- sort?: (a: SankeyLayoutNode, b: SankeyLayoutNode) => number | null;
89
+ sort?: 'auto' | 'fixed' | ((a: SankeyLayoutNode, b: SankeyLayoutNode) => number);
83
90
  } & SankeyNodeHighlightScope;
84
91
  export type SankeyLinkOptions = {
85
92
  /**
@@ -99,12 +106,18 @@ export type SankeyLinkOptions = {
99
106
  */
100
107
  showValues?: boolean;
101
108
  /**
102
- * Custom sort function for links
109
+ * Custom sort mode for links
110
+ *
111
+ * - 'auto': Automatic sorting behavior (default)
112
+ * - 'fixed': Preserve the order from the links array (disables automatic sorting)
113
+ * - or a custom function
114
+ *
103
115
  * @param {SankeyLayoutLink} a - First link to compare
104
116
  * @param {SankeyLayoutLink} b - Second link to compare
105
117
  * @returns {number} Comparison result
118
+ * @default 'auto'
106
119
  */
107
- sort?: (a: SankeyLayoutLink, b: SankeyLayoutLink) => number | null;
120
+ sort?: 'auto' | 'fixed' | ((a: SankeyLayoutLink, b: SankeyLayoutLink) => number);
108
121
  /**
109
122
  * Applies the given number to the X dimension of the control points of the link's curve function.
110
123
  * This can create better looking links between nodes, but is dependent on the graph layout.
@@ -1430,7 +1430,7 @@ process.env.NODE_ENV !== "production" ? ScatterChartPro.propTypes = {
1430
1430
  * Configuration for zoom interactions.
1431
1431
  */
1432
1432
  zoomInteractionConfig: _propTypes.default.shape({
1433
- pan: _propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf(['drag', 'pressAndDrag']), _propTypes.default.shape({
1433
+ pan: _propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf(['drag', 'pressAndDrag', 'wheel']), _propTypes.default.shape({
1434
1434
  pointerMode: _propTypes.default.oneOf(['mouse', 'touch']),
1435
1435
  requiredKeys: _propTypes.default.arrayOf(_propTypes.default.string),
1436
1436
  type: _propTypes.default.oneOf(['drag']).isRequired
@@ -1438,6 +1438,11 @@ process.env.NODE_ENV !== "production" ? ScatterChartPro.propTypes = {
1438
1438
  pointerMode: _propTypes.default.oneOf(['mouse', 'touch']),
1439
1439
  requiredKeys: _propTypes.default.arrayOf(_propTypes.default.string),
1440
1440
  type: _propTypes.default.oneOf(['pressAndDrag']).isRequired
1441
+ }), _propTypes.default.shape({
1442
+ allowedDirection: _propTypes.default.oneOf(['x', 'xy', 'y']),
1443
+ pointerMode: _propTypes.default.any,
1444
+ requiredKeys: _propTypes.default.arrayOf(_propTypes.default.string),
1445
+ type: _propTypes.default.oneOf(['wheel']).isRequired
1441
1446
  })]).isRequired),
1442
1447
  zoom: _propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.oneOf(['brush', 'doubleTapReset', 'pinch', 'tapAndDrag', 'wheel']), _propTypes.default.shape({
1443
1448
  pointerMode: _propTypes.default.any,
@@ -1439,7 +1439,7 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
1439
1439
  * Configuration for zoom interactions.
1440
1440
  */
1441
1441
  zoomInteractionConfig: PropTypes.shape({
1442
- pan: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf(['drag', 'pressAndDrag']), PropTypes.shape({
1442
+ pan: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf(['drag', 'pressAndDrag', 'wheel']), PropTypes.shape({
1443
1443
  pointerMode: PropTypes.oneOf(['mouse', 'touch']),
1444
1444
  requiredKeys: PropTypes.arrayOf(PropTypes.string),
1445
1445
  type: PropTypes.oneOf(['drag']).isRequired
@@ -1447,6 +1447,11 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
1447
1447
  pointerMode: PropTypes.oneOf(['mouse', 'touch']),
1448
1448
  requiredKeys: PropTypes.arrayOf(PropTypes.string),
1449
1449
  type: PropTypes.oneOf(['pressAndDrag']).isRequired
1450
+ }), PropTypes.shape({
1451
+ allowedDirection: PropTypes.oneOf(['x', 'xy', 'y']),
1452
+ pointerMode: PropTypes.any,
1453
+ requiredKeys: PropTypes.arrayOf(PropTypes.string),
1454
+ type: PropTypes.oneOf(['wheel']).isRequired
1450
1455
  })]).isRequired),
1451
1456
  zoom: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf(['brush', 'doubleTapReset', 'pinch', 'tapAndDrag', 'wheel']), PropTypes.shape({
1452
1457
  pointerMode: PropTypes.any,
@@ -10,7 +10,7 @@ import { defaultSlotsMaterial } from "../internals/material/index.js";
10
10
  import { DEFAULT_PLUGINS } from "../internals/plugins/allPlugins.js";
11
11
  import { useChartDataProviderProProps } from "./useChartDataProviderProProps.js";
12
12
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
13
- const releaseInfo = "MTc2MjMwMDgwMDAwMA==";
13
+ const releaseInfo = "MTc2MzU5NjgwMDAwMA==";
14
14
  const packageIdentifier = 'x-charts-pro';
15
15
  /**
16
16
  * Orchestrates the data providers for the chart components and hooks.
@@ -17,19 +17,25 @@ const ZoomSliderActiveTrackRect = styled('rect', {
17
17
  shouldForwardProp: prop => shouldForwardProp(prop) && prop !== 'preview'
18
18
  })(({
19
19
  theme
20
- }) => ({
21
- fill: theme.palette.mode === 'dark' ? (theme.vars || theme).palette.grey[500] : (theme.vars || theme).palette.grey[600],
20
+ }) => _extends({
21
+ fill: (theme.vars || theme).palette.grey[600]
22
+ }, theme.applyStyles('dark', {
23
+ fill: (theme.vars || theme).palette.grey[500]
24
+ }), {
22
25
  cursor: 'grab',
23
26
  variants: [{
24
27
  props: {
25
28
  preview: true
26
29
  },
27
- style: {
28
- fill: 'transparent',
30
+ style: _extends({
31
+ fill: 'transparent'
32
+ }, theme.applyStyles('dark', {
33
+ fill: 'transparent'
34
+ }), {
29
35
  rx: 4,
30
36
  ry: 4,
31
37
  stroke: theme.palette.grey[500]
32
- }
38
+ })
33
39
  }]
34
40
  }));
35
41
  export function ChartAxisZoomSliderActiveTrack({