@mui/x-charts-pro 8.0.0 → 8.2.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 (134) hide show
  1. package/BarChartPro/BarChartPro.js +7 -1
  2. package/BarChartPro/BarChartPro.plugins.d.ts +2 -1
  3. package/BarChartPro/BarChartPro.plugins.js +2 -1
  4. package/CHANGELOG.md +230 -5
  5. package/ChartContainerPro/ChartContainerPro.d.ts +1 -0
  6. package/ChartContainerPro/useChartContainerProProps.d.ts +1 -1
  7. package/ChartDataProviderPro/ChartDataProviderPro.js +11 -2
  8. package/ChartDataProviderPro/useChartDataProviderProProps.d.ts +3 -2
  9. package/ChartDataProviderPro/useChartDataProviderProProps.js +2 -0
  10. package/FunnelChart/FunnelChart.js +12 -1
  11. package/FunnelChart/FunnelPlot.d.ts +5 -0
  12. package/FunnelChart/FunnelPlot.js +13 -16
  13. package/FunnelChart/curves/bump.d.ts +24 -0
  14. package/FunnelChart/curves/bump.js +82 -0
  15. package/FunnelChart/curves/curve.types.d.ts +8 -0
  16. package/FunnelChart/curves/curve.types.js +5 -0
  17. package/FunnelChart/curves/funnelStep.d.ts +25 -0
  18. package/FunnelChart/{funnelStepCurve.js → curves/funnelStep.js} +32 -19
  19. package/FunnelChart/curves/getFunnelCurve.d.ts +3 -0
  20. package/FunnelChart/curves/getFunnelCurve.js +22 -0
  21. package/FunnelChart/curves/index.d.ts +2 -0
  22. package/FunnelChart/curves/index.js +27 -0
  23. package/FunnelChart/curves/linear.d.ts +24 -0
  24. package/FunnelChart/curves/linear.js +113 -0
  25. package/FunnelChart/funnel.types.d.ts +2 -2
  26. package/FunnelChart/funnelPlotSlots.types.d.ts +1 -1
  27. package/FunnelChart/funnelSectionClasses.d.ts +1 -1
  28. package/FunnelChart/index.d.ts +3 -2
  29. package/FunnelChart/useFunnelChartProps.d.ts +1 -1
  30. package/FunnelChart/useFunnelChartProps.js +7 -4
  31. package/Heatmap/Heatmap.js +5 -1
  32. package/Heatmap/HeatmapItem.js +1 -1
  33. package/LineChartPro/LineChartPro.js +7 -1
  34. package/LineChartPro/LineChartPro.plugins.d.ts +2 -1
  35. package/LineChartPro/LineChartPro.plugins.js +2 -1
  36. package/ScatterChartPro/ScatterChartPro.js +7 -1
  37. package/ScatterChartPro/ScatterChartPro.plugins.d.ts +2 -1
  38. package/ScatterChartPro/ScatterChartPro.plugins.js +2 -1
  39. package/esm/BarChartPro/BarChartPro.js +7 -1
  40. package/esm/BarChartPro/BarChartPro.plugins.d.ts +2 -1
  41. package/esm/BarChartPro/BarChartPro.plugins.js +2 -1
  42. package/esm/ChartContainerPro/ChartContainerPro.d.ts +1 -0
  43. package/esm/ChartContainerPro/useChartContainerProProps.d.ts +1 -1
  44. package/esm/ChartDataProviderPro/ChartDataProviderPro.js +11 -2
  45. package/esm/ChartDataProviderPro/useChartDataProviderProProps.d.ts +3 -2
  46. package/esm/ChartDataProviderPro/useChartDataProviderProProps.js +2 -0
  47. package/esm/FunnelChart/FunnelChart.js +12 -1
  48. package/esm/FunnelChart/FunnelPlot.d.ts +5 -0
  49. package/esm/FunnelChart/FunnelPlot.js +14 -17
  50. package/esm/FunnelChart/curves/bump.d.ts +24 -0
  51. package/esm/FunnelChart/curves/bump.js +75 -0
  52. package/esm/FunnelChart/curves/curve.types.d.ts +8 -0
  53. package/esm/FunnelChart/curves/curve.types.js +1 -0
  54. package/esm/FunnelChart/curves/funnelStep.d.ts +25 -0
  55. package/esm/FunnelChart/{funnelStepCurve.js → curves/funnelStep.js} +32 -19
  56. package/esm/FunnelChart/curves/getFunnelCurve.d.ts +3 -0
  57. package/esm/FunnelChart/curves/getFunnelCurve.js +15 -0
  58. package/esm/FunnelChart/curves/index.d.ts +2 -0
  59. package/esm/FunnelChart/curves/index.js +2 -0
  60. package/esm/FunnelChart/curves/linear.d.ts +24 -0
  61. package/esm/FunnelChart/curves/linear.js +106 -0
  62. package/esm/FunnelChart/funnel.types.d.ts +2 -2
  63. package/esm/FunnelChart/funnelPlotSlots.types.d.ts +1 -1
  64. package/esm/FunnelChart/funnelSectionClasses.d.ts +1 -1
  65. package/esm/FunnelChart/index.d.ts +3 -2
  66. package/esm/FunnelChart/useFunnelChartProps.d.ts +1 -1
  67. package/esm/FunnelChart/useFunnelChartProps.js +7 -4
  68. package/esm/Heatmap/Heatmap.js +5 -1
  69. package/esm/Heatmap/HeatmapItem.js +1 -1
  70. package/esm/LineChartPro/LineChartPro.js +7 -1
  71. package/esm/LineChartPro/LineChartPro.plugins.d.ts +2 -1
  72. package/esm/LineChartPro/LineChartPro.plugins.js +2 -1
  73. package/esm/ScatterChartPro/ScatterChartPro.js +7 -1
  74. package/esm/ScatterChartPro/ScatterChartPro.plugins.d.ts +2 -1
  75. package/esm/ScatterChartPro/ScatterChartPro.plugins.js +2 -1
  76. package/esm/index.d.ts +1 -0
  77. package/esm/index.js +2 -1
  78. package/esm/internals/plugins/allPlugins.d.ts +5 -4
  79. package/esm/internals/plugins/allPlugins.js +3 -2
  80. package/esm/internals/plugins/useChartProExport/common.d.ts +1 -0
  81. package/esm/internals/plugins/useChartProExport/common.js +8 -0
  82. package/esm/internals/plugins/useChartProExport/exportImage.d.ts +3 -0
  83. package/esm/internals/plugins/useChartProExport/exportImage.js +85 -0
  84. package/esm/internals/plugins/useChartProExport/index.d.ts +2 -0
  85. package/esm/internals/plugins/useChartProExport/index.js +2 -0
  86. package/esm/internals/plugins/useChartProExport/print.d.ts +4 -0
  87. package/esm/internals/plugins/useChartProExport/print.js +28 -0
  88. package/esm/internals/plugins/useChartProExport/useChartProExport.d.ts +3 -0
  89. package/esm/internals/plugins/useChartProExport/useChartProExport.js +65 -0
  90. package/esm/internals/plugins/useChartProExport/useChartProExport.types.d.ts +67 -0
  91. package/esm/internals/plugins/useChartProExport/useChartProExport.types.js +1 -0
  92. package/esm/internals/plugins/useChartProZoom/useChartProZoom.d.ts +2 -1
  93. package/esm/internals/plugins/useChartProZoom/useChartProZoom.js +54 -30
  94. package/esm/internals/plugins/useChartProZoom/useChartProZoom.selectors.d.ts +25 -25
  95. package/esm/locales/index.d.ts +1 -0
  96. package/esm/locales/index.js +1 -0
  97. package/esm/themeAugmentation/components.d.ts +0 -4
  98. package/esm/themeAugmentation/components.js +1 -0
  99. package/esm/themeAugmentation/index.d.ts +3 -3
  100. package/esm/themeAugmentation/overrides.d.ts +0 -3
  101. package/esm/themeAugmentation/overrides.js +2 -0
  102. package/esm/themeAugmentation/props.d.ts +0 -6
  103. package/esm/themeAugmentation/props.js +2 -0
  104. package/index.d.ts +1 -0
  105. package/index.js +12 -1
  106. package/internals/plugins/allPlugins.d.ts +5 -4
  107. package/internals/plugins/allPlugins.js +3 -2
  108. package/internals/plugins/useChartProExport/common.d.ts +1 -0
  109. package/internals/plugins/useChartProExport/common.js +14 -0
  110. package/internals/plugins/useChartProExport/exportImage.d.ts +3 -0
  111. package/internals/plugins/useChartProExport/exportImage.js +95 -0
  112. package/internals/plugins/useChartProExport/index.d.ts +2 -0
  113. package/internals/plugins/useChartProExport/index.js +27 -0
  114. package/internals/plugins/useChartProExport/print.d.ts +4 -0
  115. package/internals/plugins/useChartProExport/print.js +35 -0
  116. package/internals/plugins/useChartProExport/useChartProExport.d.ts +3 -0
  117. package/internals/plugins/useChartProExport/useChartProExport.js +73 -0
  118. package/internals/plugins/useChartProExport/useChartProExport.types.d.ts +67 -0
  119. package/internals/plugins/useChartProExport/useChartProExport.types.js +5 -0
  120. package/internals/plugins/useChartProZoom/useChartProZoom.d.ts +2 -1
  121. package/internals/plugins/useChartProZoom/useChartProZoom.js +54 -30
  122. package/internals/plugins/useChartProZoom/useChartProZoom.selectors.d.ts +25 -25
  123. package/locales/index.d.ts +1 -0
  124. package/locales/index.js +16 -0
  125. package/package.json +7 -4
  126. package/themeAugmentation/components.d.ts +0 -4
  127. package/themeAugmentation/components.js +5 -0
  128. package/themeAugmentation/index.d.ts +3 -3
  129. package/themeAugmentation/overrides.d.ts +0 -3
  130. package/themeAugmentation/overrides.js +5 -0
  131. package/themeAugmentation/props.d.ts +0 -6
  132. package/themeAugmentation/props.js +5 -0
  133. package/FunnelChart/funnelStepCurve.d.ts +0 -4
  134. package/esm/FunnelChart/funnelStepCurve.d.ts +0 -4
@@ -91,6 +91,8 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
91
91
  // ----------------------------------------------------------------------
92
92
  apiRef: _propTypes.default.shape({
93
93
  current: _propTypes.default.shape({
94
+ exportAsImage: _propTypes.default.func.isRequired,
95
+ exportAsPrint: _propTypes.default.func.isRequired,
94
96
  setZoomData: _propTypes.default.func.isRequired
95
97
  })
96
98
  }),
@@ -181,6 +183,10 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
181
183
  * @default false
182
184
  */
183
185
  loading: _propTypes.default.bool,
186
+ /**
187
+ * Localized text for chart components.
188
+ */
189
+ localeText: _propTypes.default.object,
184
190
  /**
185
191
  * The margin between the SVG and the drawing area.
186
192
  * It's used for leaving some space for extra information such as the x- and y-axis or legend.
@@ -197,7 +203,7 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
197
203
  * The function called for onClick events.
198
204
  * The second argument contains information about all line/bar elements at the current mouse position.
199
205
  * @param {MouseEvent} event The mouse event recorded on the `<svg/>` element.
200
- * @param {null | AxisData} data The data about the clicked axis and items associated with it.
206
+ * @param {null | ChartsAxisData} data The data about the clicked axis and items associated with it.
201
207
  */
202
208
  onAxisClick: _propTypes.default.func,
203
209
  /**
@@ -1,4 +1,5 @@
1
1
  import { UseChartZAxisSignature, UseChartCartesianAxisSignature, UseChartInteractionSignature, UseChartHighlightSignature, ConvertSignaturesIntoPlugins } from '@mui/x-charts/internals';
2
+ import { UseChartProExportSignature } from "../internals/plugins/useChartProExport/index.js";
2
3
  import { UseChartProZoomSignature } from "../internals/plugins/useChartProZoom/index.js";
3
- export type BarChartProPluginsSignatures = [UseChartZAxisSignature, UseChartCartesianAxisSignature<'bar'>, UseChartInteractionSignature, UseChartHighlightSignature, UseChartProZoomSignature];
4
+ export type BarChartProPluginsSignatures = [UseChartZAxisSignature, UseChartCartesianAxisSignature<'bar'>, UseChartInteractionSignature, UseChartHighlightSignature, UseChartProZoomSignature, UseChartProExportSignature];
4
5
  export declare const BAR_CHART_PRO_PLUGINS: ConvertSignaturesIntoPlugins<BarChartProPluginsSignatures>;
@@ -5,5 +5,6 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.BAR_CHART_PRO_PLUGINS = void 0;
7
7
  var _internals = require("@mui/x-charts/internals");
8
+ var _useChartProExport = require("../internals/plugins/useChartProExport");
8
9
  var _useChartProZoom = require("../internals/plugins/useChartProZoom");
9
- const BAR_CHART_PRO_PLUGINS = exports.BAR_CHART_PRO_PLUGINS = [_internals.useChartZAxis, _internals.useChartCartesianAxis, _internals.useChartInteraction, _internals.useChartHighlight, _useChartProZoom.useChartProZoom];
10
+ const BAR_CHART_PRO_PLUGINS = exports.BAR_CHART_PRO_PLUGINS = [_internals.useChartZAxis, _internals.useChartCartesianAxis, _internals.useChartInteraction, _internals.useChartHighlight, _useChartProZoom.useChartProZoom, _useChartProExport.useChartProExport];
package/CHANGELOG.md CHANGED
@@ -5,6 +5,227 @@
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.2.0
9
+
10
+ _May 1, 2025_
11
+
12
+ We'd like to offer a big thanks to the 14 contributors who made this release possible. Here are some highlights ✨:
13
+
14
+ - 📊 `<FunnelChart/>` now uses the `strawberrySky` sequential color palette by default.
15
+ <img width="481" alt="Screenshot 2025-04-29 at 13 55 21" src="https://github.com/user-attachments/assets/182085d1-a7ce-4e4d-9d8d-a4fe87f27167" />
16
+ - 📊 Add API to export a chart as an image: `apiRef.exportAsImage` — [Learn more](https://mui.com/x/react-charts/export/#export-as-image).
17
+
18
+ Special thanks go out to the community members for their valuable contributions:
19
+ @federico-ntr, @nusr.
20
+ Following are all team members who have contributed to this release:
21
+ @alexfauquette, @arminmeh, @bernardobelchior, @hasdfa, @Janpot, @JCQuintas, @KenanYusuf, @LukasTy, @MBilalShafi, @michelengelen, @oliviertassinari, @romgrk.
22
+
23
+ <!--/ HIGHLIGHT_ABOVE_SEPARATOR /-->
24
+
25
+ ### Data Grid
26
+
27
+ #### `@mui/x-data-grid@8.2.0`
28
+
29
+ - [DataGrid] Fix panel alignment (#17625) @KenanYusuf
30
+ - [DataGrid] Fix theme `defaultProps` causing unwanted re-renders (#17490) @KenanYusuf
31
+ - [DataGrid] Fix circular reference error (#17591) @romgrk
32
+ - [DataGrid] Fix `<GridEditInputCell />` break input (#16773) @nusr
33
+
34
+ #### `@mui/x-data-grid-pro@8.2.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
35
+
36
+ Same changes as in `@mui/x-data-grid@8.2.0`, plus:
37
+
38
+ - [DataGridPro] Use intersection observer to trigger server-side infinite loading (#17369) @arminmeh
39
+
40
+ #### `@mui/x-data-grid-premium@8.2.0` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
41
+
42
+ Same changes as in `@mui/x-data-grid-pro@8.2.0`.
43
+
44
+ ### Date and Time Pickers
45
+
46
+ #### `@mui/x-date-pickers@8.2.0`
47
+
48
+ - [l10n] Improve Italian (it-IT) locale (#17600) @federico-ntr
49
+ - [pickers] Refactor owner state typing (#17517) @LukasTy
50
+
51
+ #### `@mui/x-date-pickers-pro@8.2.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
52
+
53
+ Same changes as in `@mui/x-date-pickers@8.2.0`.
54
+
55
+ ### Charts
56
+
57
+ #### `@mui/x-charts@8.2.0`
58
+
59
+ - [charts] Add library name to errors (#17547) @bernardobelchior
60
+ - [charts] Add monochrome palettes (#17610) @JCQuintas
61
+ - [charts] Add screenshot of the tooltip (#17395) @alexfauquette
62
+ - [charts] Default bar chart x-axis scale type to band (#17519) @bernardobelchior
63
+ - [charts] Document axis ID uniqueness constraints (#17630) @bernardobelchior
64
+ - [charts] Refactor axis types (#17632) @bernardobelchior
65
+ - [charts] Use `<circle />` for circular legend mark (#17590) @alexfauquette
66
+
67
+ #### `@mui/x-charts-pro@8.2.0` [![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-charts@8.2.0`, plus:
70
+
71
+ - [charts-pro] Add `gap` option to `<FunnelChart />` (#17642) @JCQuintas
72
+ - [charts-pro] Export charts as image (#17353) @bernardobelchior
73
+ - [charts-pro] Simplify zoom testing (#17525) @JCQuintas
74
+ - [charts-pro] Use new sequential color palette in `<FunnelChart />` (#17606) @JCQuintas
75
+
76
+ ### Tree View
77
+
78
+ #### `@mui/x-tree-view@8.2.0`
79
+
80
+ Internal changes.
81
+
82
+ #### `@mui/x-tree-view-pro@8.2.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
83
+
84
+ Same changes as in `@mui/x-tree-view@8.2.0`.
85
+
86
+ ### Docs
87
+
88
+ - [docs][charts] Add composition sections (#17377) @alexfauquette
89
+ - [docs][charts] Add docs on tooltip style (#17601) @bernardobelchior
90
+ - [docs][charts] Fix highlighting heading structure (#17581) @oliviertassinari
91
+ - [docs][charts] Improve export docs (#17538) @oliviertassinari
92
+ - [docs][charts] Similar introduction on most charts pages (#17374) @alexfauquette
93
+ - [docs][DataGrid] Clear component docs (#17540) @oliviertassinari
94
+ - [docs] Explicitly state that `groupingColDef` reference needs to be stable (#17544) @arminmeh
95
+ - [docs] Fix <kbd> a11y (#17536) @oliviertassinari
96
+ - [docs] Fix CodeSandbox spelling @oliviertassinari
97
+ - [docs] Fix coding style function @oliviertassinari
98
+ - [docs] Fix migration guide format (#17450) @oliviertassinari
99
+ - [docs] Improve data grid export docs (#17551) @MBilalShafi
100
+ - [docs] Remove leftover `@next` usages (#17542) @LukasTy
101
+
102
+ ### Core
103
+
104
+ - [core] Add security label to dependabot PRs @oliviertassinari
105
+ - [core] Allow post-install vale @oliviertassinari
106
+ - [core] Component consistency @oliviertassinari
107
+ - [core] Fix all Vale errors @oliviertassinari
108
+ - [core] Move `loadStyleSheets` to internals and use it in data grid and charts (#17548) @bernardobelchior
109
+ - [core] Remove empty version (#17582) @oliviertassinari
110
+ - [core] Remove eslint from codemod spec files (#17443) @alexfauquette
111
+ - [core] Remove unnecessary versions (#17597) @oliviertassinari
112
+ - [code-infra] Allow postinstall scripts for packages requesting it (#17635) @LukasTy
113
+ - [code-infra] Data Grid `vitest` changes (#17619) @JCQuintas
114
+ - [code-infra] Fix date-time sensitive tests (#17644) @JCQuintas
115
+ - [code-infra] Fix extension handling for type imports (#17636) @Janpot
116
+ - [code-infra] Further remove `clock=fake` and add `async act` for datagrid (#17563) @JCQuintas
117
+ - [code-infra] Latest vitest picker changes (#17577) @JCQuintas
118
+ - [docs-infra] Fix Vale no longer working (#17602) @alexfauquette
119
+ - [docs-infra] Uniformize Vale between repositories @oliviertassinari
120
+ - [infra] Updates to `branch switch comments` (#17589) @michelengelen
121
+ - [x-telemetry] Fix issue with get machineid hash (#17614) @hasdfa
122
+
123
+ ## 8.1.0
124
+
125
+ _Apr 24, 2025_
126
+
127
+ We'd like to offer a big thanks to the 14 contributors who made this release possible. Here are some highlights ✨:
128
+
129
+ - 📊 Add API to print a chart or export it as PDF: `apiRef.exportAsPrint()`.
130
+ - 📚 Documentation improvements
131
+ - 🐞 Bugfixes
132
+
133
+ Special thanks go out to the community members for their valuable contributions:
134
+ @lhilgert9, @ArturAghakaryan, @sai6855.
135
+ Following are all team members who have contributed to this release:
136
+ @alexfauquette, @arminmeh, @bernardobelchior, @cherniavskii, @JCQuintas, @joserodolfofreitas, @KenanYusuf, @LukasTy, @mapache-salvaje, @oliviertassinari, @romgrk.
137
+
138
+ <!--/ HIGHLIGHT_ABOVE_SEPARATOR /-->
139
+
140
+ ### Data Grid
141
+
142
+ #### `@mui/x-data-grid@8.1.0`
143
+
144
+ - [DataGrid] Allow row deselection with multiple rows selected (#17473) @arminmeh
145
+ - [DataGrid] Fix column title truncation on touch devices (#17375) @KenanYusuf
146
+ - [DataGrid] Remove internal usage of `material` prop (#17513) @KenanYusuf
147
+ - [DataGrid] Fix apiRef not being passed on onCellClick params (#17335) @sai6855
148
+ - [DataGrid] Add Armenian (hy-AM) locale (#17527) @ArturAghakaryan
149
+
150
+ #### `@mui/x-data-grid-pro@8.1.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.1.0`, plus:
153
+
154
+ - [DataGridPro] Fix locales.ts export (#17433) @lhilgert9
155
+ - [DataGridPro] Avoid proptypes warnings with header filters in React 17 (#17482) @cherniavskii
156
+ - [DataGridPro] Fix expandable rows detail content height updates (#17394) @arminmeh
157
+
158
+ #### `@mui/x-data-grid-premium@8.1.0` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
159
+
160
+ Same changes as in `@mui/x-data-grid-pro@8.1.0`.
161
+
162
+ ### Date and Time Pickers
163
+
164
+ #### `@mui/x-date-pickers@8.1.0`
165
+
166
+ - [pickers] Improve `PickersInputBase` owner state typing (#17478) @LukasTy
167
+
168
+ #### `@mui/x-date-pickers-pro@8.1.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
169
+
170
+ Same changes as in `@mui/x-date-pickers@8.1.0`.
171
+
172
+ ### Charts
173
+
174
+ - Add API to print a chart or export it as PDF: `apiRef.exportAsPrint()`.
175
+
176
+ #### `@mui/x-charts@8.1.0`
177
+
178
+ - [charts] Add a localization provider (#17325) @alexfauquette
179
+ - [charts] Add codemod for replacing legend's hidden slot prop (#17392) @bernardobelchior
180
+ - [charts] Fix chart visual tests flakiness (#17469) @bernardobelchior
181
+ - [charts] Fix tooltip position (#17440) @alexfauquette
182
+ - [charts] Improve axis tooltip performances (#17398) @alexfauquette
183
+ - [charts] Move radar from under development to preview (#17418) @alexfauquette
184
+ - [charts] Advance time in charts regression tests (#17420) @bernardobelchior
185
+ - [charts] Fix charts visuals flakiness (#17472) @bernardobelchior
186
+ - [charts] Move `rafThrottle` on event handlers instead of setter (#17489) @bernardobelchior
187
+
188
+ #### `@mui/x-charts-pro@8.1.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
189
+
190
+ Same changes as in `@mui/x-charts@8.1.0`, plus:
191
+
192
+ - [charts-pro] Add export as PDF/print functionality (#17285) @bernardobelchior
193
+ - [charts-pro] Fix axis zoom being disabled when not specified in `initialZoom` (#17500) @bernardobelchior
194
+
195
+ ### Tree View
196
+
197
+ #### `@mui/x-tree-view@8.1.0`
198
+
199
+ Internal changes.
200
+
201
+ #### `@mui/x-tree-view-pro@8.1.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
202
+
203
+ Same changes as in `@mui/x-tree-view@8.1.0`.
204
+
205
+ ### Docs
206
+
207
+ - [docs] Fix AI Assistant Panel Trigger demo (#17426) @KenanYusuf
208
+ - [docs] Fix DataGrid's master-detail demo for one expanded detail panel at a time (#17471) @arminmeh
209
+ - [docs] Improve StackOverflow links (#17483) @oliviertassinari
210
+ - [docs] Refine charts demos (#17417) @alexfauquette
211
+ - [docs] Remove ad on paid docs pages (#17373) @oliviertassinari
212
+ - [docs] Serve migration guides in raw markdown format (#17210) @cherniavskii
213
+ - [docs] Fix heading structure (#17495) @oliviertassinari
214
+ - [docs] Revise the Row Grouping doc (#16217) @mapache-salvaje
215
+ - [docs] Fix ellipsis in the demo (#17476) @oliviertassinari
216
+ - [docs] Add docs information for Legend HTML (#17502) @alexfauquette
217
+ - [docs] Refine charts demos (#17417) @alexfauquette
218
+ - [tree view][docs] Copyedit the Tree View Overview page (#17498) @mapache-salvaje
219
+
220
+ ### Core
221
+
222
+ - [core] Bump `@types/node` (#17444) @LukasTy
223
+ - [core] Remove `react-is` dependency (#17470) @LukasTy
224
+ - [core] Remove redundant `overridesResolver` in `styled` components (#17466) @romgrk
225
+ - [core] Update support table (#17425) @joserodolfofreitas
226
+ - [code-infra] Ditch `@babel/node` (#17446) @LukasTy
227
+ - [code-infra] Further remove `clock=fake` from pickers (#17253) @JCQuintas
228
+
8
229
  ## 8.0.0
9
230
 
10
231
  _Apr 17, 2025_
@@ -1715,7 +1936,7 @@ Same changes as in `@mui/x-tree-view@8.0.0-alpha.8`.
1715
1936
  - [docs] Add example for custom legend (#16169) @alexfauquette
1716
1937
  - [docs] Add full custom field creation example (#15194) @flaviendelangle
1717
1938
  - [docs] Copyedit the Data Grid cell selection page (#16099) @samuelsycamore
1718
- - [docs] Fix demo rendering issue on Codesandbox (#16118) @arminmeh
1939
+ - [docs] Fix demo rendering issue on CodeSandbox (#16118) @arminmeh
1719
1940
  - [docs] Remove broken links (#16167) @alexfauquette
1720
1941
  - [docs] Split the Data Grid editing page (#14931) @MBilalShafi
1721
1942
  - [docs] Fix wrong props warnings (#16119) @JCQuintas
@@ -2162,7 +2383,7 @@ Releasing to benefit from license package fix (#15814).
2162
2383
 
2163
2384
  - [code-infra] Add Charts sandbox generation (#15830) @JCQuintas
2164
2385
  - [code-infra] Remove redundant `@type/react-test-renderer` dep (#15766) @LukasTy
2165
- - [license] Use `console.log` for the error message on Codesandbox to avoid rendering error (#15814) @arminmeh
2386
+ - [license] Use `console.log` for the error message on CodeSandbox to avoid rendering error (#15814) @arminmeh
2166
2387
 
2167
2388
  ## 8.0.0-alpha.3
2168
2389
 
@@ -2378,6 +2599,8 @@ Same changes as in `@mui/x-tree-view@v8.0.0-alpha.2`.
2378
2599
 
2379
2600
  ### Docs
2380
2601
 
2602
+ <!-- vale MUI.CorrectRererenceCased = NO -->
2603
+
2381
2604
  - [docs] Fix 404 links (#15575) @oliviertassinari
2382
2605
  - [docs] Fix bash comments (#15571) @oliviertassinari
2383
2606
  - [docs] Fix Pickers theme augmentation example (#15672) @LukasTy
@@ -2387,6 +2610,8 @@ Same changes as in `@mui/x-tree-view@v8.0.0-alpha.2`.
2387
2610
  - [docs] Fix `anchorEl` API page for charts (#15625) @oliviertassinari
2388
2611
  - [docs] Add documentation for the list view feature (#15344) @KenanYusuf
2389
2612
 
2613
+ <!-- vale MUI.CorrectRererenceCased = YES -->
2614
+
2390
2615
  ### Core
2391
2616
 
2392
2617
  - [core] Follow `()` function convention for docs @oliviertassinari
@@ -3295,7 +3520,7 @@ Same changes as in `@mui/x-tree-view@7.24.0`.
3295
3520
  ### Docs
3296
3521
 
3297
3522
  - [docs] Copyedit the Data Grid cell selection page (#16213) @samuelsycamore
3298
- - [docs] Fix demo rendering issue on Codesandbox (#16129) @arminmeh
3523
+ - [docs] Fix demo rendering issue on CodeSandbox (#16129) @arminmeh
3299
3524
 
3300
3525
  ### Core
3301
3526
 
@@ -3573,7 +3798,7 @@ Releasing to benefit from license package fix (#15818).
3573
3798
  ### Core
3574
3799
 
3575
3800
  - [core] Add `@mui/x-tree-view-pro` to `releaseChangelog` (#15747) @flaviendelangle
3576
- - [license] Use `console.log` for the error message on Codesandbox to avoid rendering error (#15818) @arminmeh
3801
+ - [license] Use `console.log` for the error message on CodeSandbox to avoid rendering error (#15818) @arminmeh
3577
3802
 
3578
3803
  ## 7.23.1
3579
3804
 
@@ -6914,7 +7139,7 @@ Same changes as in `@mui/x-data-grid-pro@7.0.0-beta.4`.
6914
7139
  />
6915
7140
  ```
6916
7141
 
6917
- - The headless field hooks (e.g.: `useDateField`) now returns a new prop called `enableAccessibleFieldDOMStructure`.
7142
+ - The headless field hooks (for example `useDateField()`) now returns a new prop called `enableAccessibleFieldDOMStructure`.
6918
7143
  This property is utilized to determine whether the anticipated UI is constructed using an accessible DOM structure.
6919
7144
  Learn more about this new accessible DOM structure in the [v8 migration guide](https://v7.mui.com/x/migration/migration-pickers-v7/#new-dom-structure-for-the-field).
6920
7145
 
@@ -7,6 +7,7 @@ export type ChartContainerProProps<TSeries extends ChartSeriesType = ChartSeries
7
7
  type ChartContainerProComponent = <TSeries extends ChartSeriesType = ChartSeriesType, TSignatures extends readonly ChartAnyPluginSignature[] = AllPluginSignatures<TSeries>>(props: ChartContainerProProps<TSeries, TSignatures> & {
8
8
  ref?: React.ForwardedRef<SVGSVGElement>;
9
9
  }) => React.JSX.Element;
10
+ export type ChartProApi = NonNullable<NonNullable<ChartContainerProProps['apiRef']>['current']>;
10
11
  /**
11
12
  * It sets up the data providers as well as the `<svg>` for the chart.
12
13
  *
@@ -1,7 +1,7 @@
1
1
  import { ChartAnyPluginSignature, ChartSeriesType, UseChartContainerPropsReturnValue } from '@mui/x-charts/internals';
2
2
  import * as React from 'react';
3
3
  import { ChartDataProviderProps } from '@mui/x-charts/ChartDataProvider';
4
- import type { ChartContainerProProps } from './ChartContainerPro';
4
+ import type { ChartContainerProProps } from "./ChartContainerPro.js";
5
5
  import { AllPluginSignatures } from "../internals/plugins/allPlugins.js";
6
6
  export type UseChartContainerProPropsReturnValue<TSeries extends ChartSeriesType, TSignatures extends readonly ChartAnyPluginSignature[]> = Pick<UseChartContainerPropsReturnValue<TSeries, TSignatures>, 'chartsSurfaceProps' | 'children'> & {
7
7
  chartDataProviderProProps: ChartDataProviderProps<TSeries, TSignatures>;
@@ -12,11 +12,12 @@ var React = _interopRequireWildcard(require("react"));
12
12
  var _propTypes = _interopRequireDefault(require("prop-types"));
13
13
  var _Watermark = require("@mui/x-license/Watermark");
14
14
  var _internals = require("@mui/x-charts/internals");
15
+ var _ChartsLocalizationProvider = require("@mui/x-charts/ChartsLocalizationProvider");
15
16
  var _useLicenseVerifier = require("@mui/x-license/useLicenseVerifier");
16
17
  var _allPlugins = require("../internals/plugins/allPlugins");
17
18
  var _useChartDataProviderProProps = require("./useChartDataProviderProProps");
18
19
  var _jsxRuntime = require("react/jsx-runtime");
19
- const releaseInfo = "MTc0NDg0MDgwMDAwMA==";
20
+ const releaseInfo = "MTc0NjA0NjgwMDAwMA==";
20
21
  const packageIdentifier = 'x-charts-pro';
21
22
  /**
22
23
  * Orchestrates the data providers for the chart components and hooks.
@@ -48,13 +49,17 @@ const packageIdentifier = 'x-charts-pro';
48
49
  function ChartDataProviderPro(props) {
49
50
  const {
50
51
  children,
52
+ localeText,
51
53
  chartProviderProps
52
54
  } = (0, _useChartDataProviderProProps.useChartDataProviderProProps)((0, _extends2.default)({}, props, {
53
55
  plugins: props.plugins ?? _allPlugins.DEFAULT_PLUGINS
54
56
  }));
55
57
  (0, _useLicenseVerifier.useLicenseVerifier)(packageIdentifier, releaseInfo);
56
58
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_internals.ChartProvider, (0, _extends2.default)({}, chartProviderProps, {
57
- children: [children, /*#__PURE__*/(0, _jsxRuntime.jsx)(_Watermark.Watermark, {
59
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsLocalizationProvider.ChartsLocalizationProvider, {
60
+ localeText: localeText,
61
+ children: children
62
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Watermark.Watermark, {
58
63
  packageName: packageIdentifier,
59
64
  releaseInfo: releaseInfo
60
65
  })]
@@ -86,6 +91,10 @@ process.env.NODE_ENV !== "production" ? ChartDataProviderPro.propTypes = {
86
91
  * If you don't provide this prop. It falls back to a randomly generated id.
87
92
  */
88
93
  id: _propTypes.default.string,
94
+ /**
95
+ * Localized text for chart components.
96
+ */
97
+ localeText: _propTypes.default.object,
89
98
  /**
90
99
  * The margin between the SVG and the drawing area.
91
100
  * It's used for leaving some space for extra information such as the x- and y-axis or legend.
@@ -1,7 +1,8 @@
1
1
  import { ChartAnyPluginSignature, ChartSeriesType } from '@mui/x-charts/internals';
2
- import type { ChartDataProviderProProps } from './ChartDataProviderPro';
3
- import type { AllPluginSignatures } from '../internals/plugins/allPlugins';
2
+ import type { ChartDataProviderProProps } from "./ChartDataProviderPro.js";
3
+ import type { AllPluginSignatures } from "../internals/plugins/allPlugins.js";
4
4
  export declare const useChartDataProviderProProps: <TSeries extends ChartSeriesType = ChartSeriesType, TSignatures extends readonly ChartAnyPluginSignature[] = AllPluginSignatures<TSeries>>(props: ChartDataProviderProProps<TSeries, TSignatures>) => {
5
5
  children: import("react").ReactNode;
6
+ localeText: Partial<import("@mui/x-charts/locales").ChartsLocaleText> | undefined;
6
7
  chartProviderProps: import("@mui/x-charts/internals").ChartProviderProps<TSeries, TSignatures>;
7
8
  };
@@ -9,10 +9,12 @@ var _internals = require("@mui/x-charts/internals");
9
9
  const useChartDataProviderProProps = props => {
10
10
  const {
11
11
  chartProviderProps,
12
+ localeText,
12
13
  children
13
14
  } = (0, _internals.useChartDataProviderProps)(props);
14
15
  return {
15
16
  children,
17
+ localeText,
16
18
  chartProviderProps
17
19
  };
18
20
  };
@@ -70,6 +70,8 @@ process.env.NODE_ENV !== "production" ? FunnelChart.propTypes = {
70
70
  // ----------------------------------------------------------------------
71
71
  apiRef: _propTypes.default.shape({
72
72
  current: _propTypes.default.shape({
73
+ exportAsImage: _propTypes.default.func.isRequired,
74
+ exportAsPrint: _propTypes.default.func.isRequired,
73
75
  setZoomData: _propTypes.default.func.isRequired
74
76
  })
75
77
  }),
@@ -182,6 +184,11 @@ process.env.NODE_ENV !== "production" ? FunnelChart.propTypes = {
182
184
  * @default false
183
185
  */
184
186
  disableAxisListener: _propTypes.default.bool,
187
+ /**
188
+ * The gap, in pixels, between funnel sections.
189
+ * @default 0
190
+ */
191
+ gap: _propTypes.default.number,
185
192
  /**
186
193
  * The height of the chart in px. If not defined, it takes the height of the parent element.
187
194
  */
@@ -218,6 +225,10 @@ process.env.NODE_ENV !== "production" ? FunnelChart.propTypes = {
218
225
  * @default false
219
226
  */
220
227
  loading: _propTypes.default.bool,
228
+ /**
229
+ * Localized text for chart components.
230
+ */
231
+ localeText: _propTypes.default.object,
221
232
  /**
222
233
  * The margin between the SVG and the drawing area.
223
234
  * It's used for leaving some space for extra information such as the x- and y-axis or legend.
@@ -234,7 +245,7 @@ process.env.NODE_ENV !== "production" ? FunnelChart.propTypes = {
234
245
  * The function called for onClick events.
235
246
  * The second argument contains information about all line/bar elements at the current mouse position.
236
247
  * @param {MouseEvent} event The mouse event recorded on the `<svg/>` element.
237
- * @param {null | AxisData} data The data about the clicked axis and items associated with it.
248
+ * @param {null | ChartsAxisData} data The data about the clicked axis and items associated with it.
238
249
  */
239
250
  onAxisClick: _propTypes.default.func,
240
251
  /**
@@ -2,6 +2,11 @@ import * as React from 'react';
2
2
  import { FunnelItemIdentifier } from "./funnel.types.js";
3
3
  import { FunnelPlotSlotExtension } from "./funnelPlotSlots.types.js";
4
4
  export interface FunnelPlotProps extends FunnelPlotSlotExtension {
5
+ /**
6
+ * The gap, in pixels, between funnel sections.
7
+ * @default 0
8
+ */
9
+ gap?: number;
5
10
  /**
6
11
  * Callback fired when a funnel item is clicked.
7
12
  * @param {React.MouseEvent<SVGElement, MouseEvent>} event The event source of the callback.
@@ -17,21 +17,12 @@ var _hooks = require("@mui/x-charts/hooks");
17
17
  var _styles = require("@mui/material/styles");
18
18
  var _FunnelSection = require("./FunnelSection");
19
19
  var _labelUtils = require("./labelUtils");
20
- var _funnelStepCurve = require("./funnelStepCurve");
21
20
  var _useFunnelSeries = require("../hooks/useFunnelSeries");
21
+ var _curves = require("./curves");
22
22
  var _jsxRuntime = require("react/jsx-runtime");
23
- const _excluded = ["onItemClick"];
23
+ const _excluded = ["onItemClick", "gap"];
24
24
  _internals.cartesianSeriesTypes.addType('funnel');
25
- const getFunnelCurve = (curve, isHorizontal) => {
26
- if (curve === 'step') {
27
- return isHorizontal ? _funnelStepCurve.funnelHorizontalStepCurve : _funnelStepCurve.funnelVerticalStepCurve;
28
- }
29
- if (curve === 'bump') {
30
- return isHorizontal ? (0, _internals.getCurveFactory)('bumpX') : (0, _internals.getCurveFactory)('bumpY');
31
- }
32
- return (0, _internals.getCurveFactory)(curve ?? 'linear');
33
- };
34
- const useAggregatedData = () => {
25
+ const useAggregatedData = gap => {
35
26
  const seriesData = (0, _useFunnelSeries.useFunnelSeriesContext)();
36
27
  const {
37
28
  xAxis,
@@ -63,7 +54,7 @@ const useAggregatedData = () => {
63
54
  const bandWidth = (isXAxisBand || isYAxisBand) && baseScaleConfig.scale?.bandwidth() || 0;
64
55
  const xScale = xAxis[xAxisId].scale;
65
56
  const yScale = yAxis[yAxisId].scale;
66
- const curve = getFunnelCurve(currentSeries.curve, isHorizontal);
57
+ const curve = (0, _curves.getFunnelCurve)(currentSeries.curve, isHorizontal, gap);
67
58
  const xPosition = (value, bandIndex, stackOffset, useBand) => {
68
59
  if (isXAxisBand) {
69
60
  const position = xScale(bandIndex);
@@ -109,16 +100,17 @@ const useAggregatedData = () => {
109
100
  });
110
101
  });
111
102
  return result.flat();
112
- }, [seriesData, xAxis, xAxisIds, yAxis, yAxisIds]);
103
+ }, [seriesData, xAxis, xAxisIds, yAxis, yAxisIds, gap]);
113
104
  return allData;
114
105
  };
115
106
  function FunnelPlot(props) {
116
107
  const {
117
- onItemClick
108
+ onItemClick,
109
+ gap
118
110
  } = props,
119
111
  other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
120
112
  const theme = (0, _styles.useTheme)();
121
- const data = useAggregatedData();
113
+ const data = useAggregatedData(gap);
122
114
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(React.Fragment, {
123
115
  children: [data.map(({
124
116
  d,
@@ -172,6 +164,11 @@ process.env.NODE_ENV !== "production" ? FunnelPlot.propTypes = {
172
164
  // | These PropTypes are generated from the TypeScript type definitions |
173
165
  // | To update them edit the TypeScript types and run "pnpm proptypes" |
174
166
  // ----------------------------------------------------------------------
167
+ /**
168
+ * The gap, in pixels, between funnel sections.
169
+ * @default 0
170
+ */
171
+ gap: _propTypes.default.number,
175
172
  /**
176
173
  * Callback fired when a funnel item is clicked.
177
174
  * @param {React.MouseEvent<SVGElement, MouseEvent>} event The event source of the callback.
@@ -0,0 +1,24 @@
1
+ import { CurveGenerator } from '@mui/x-charts-vendor/d3-shape';
2
+ /**
3
+ * This is a custom "bump" curve generator.
4
+ *
5
+ * It takes into account the gap between the points and draws a smooth curve between them.
6
+ *
7
+ * It is based on the d3-shape bump curve generator.
8
+ * https://github.com/d3/d3-shape/blob/a82254af78f08799c71d7ab25df557c4872a3c51/src/curve/bump.js
9
+ */
10
+ export declare class Bump implements CurveGenerator {
11
+ private context;
12
+ private line;
13
+ private x;
14
+ private y;
15
+ private currentPoint;
16
+ private isHorizontal;
17
+ private gap;
18
+ constructor(context: CanvasRenderingContext2D, isHorizontal: boolean, gap?: number);
19
+ areaStart(): void;
20
+ areaEnd(): void;
21
+ lineStart(): void;
22
+ lineEnd(): void;
23
+ point(x: number, y: number): void;
24
+ }
@@ -0,0 +1,82 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.Bump = void 0;
7
+ /**
8
+ * This is a custom "bump" curve generator.
9
+ *
10
+ * It takes into account the gap between the points and draws a smooth curve between them.
11
+ *
12
+ * It is based on the d3-shape bump curve generator.
13
+ * https://github.com/d3/d3-shape/blob/a82254af78f08799c71d7ab25df557c4872a3c51/src/curve/bump.js
14
+ */
15
+ class Bump {
16
+ constructor(context, isHorizontal, gap = 0) {
17
+ this.context = void 0;
18
+ this.line = NaN;
19
+ this.x = NaN;
20
+ this.y = NaN;
21
+ this.currentPoint = 0;
22
+ this.isHorizontal = false;
23
+ this.gap = 0;
24
+ this.context = context;
25
+ this.isHorizontal = isHorizontal;
26
+ this.gap = gap / 2;
27
+ }
28
+ areaStart() {
29
+ this.line = 0;
30
+ }
31
+ areaEnd() {
32
+ this.line = NaN;
33
+ }
34
+ lineStart() {
35
+ this.currentPoint = 0;
36
+ }
37
+ lineEnd() {
38
+ if (this.line || this.line !== 0 && this.currentPoint === 1) {
39
+ this.context.closePath();
40
+ }
41
+ this.line = 1 - this.line;
42
+ }
43
+ point(x, y) {
44
+ x = +x;
45
+ y = +y;
46
+
47
+ // 0 is the top-left corner.
48
+ if (this.isHorizontal) {
49
+ if (this.currentPoint === 0) {
50
+ this.context.moveTo(x + this.gap, y);
51
+ this.context.lineTo(x + this.gap, y);
52
+ } else if (this.currentPoint === 1) {
53
+ this.context.bezierCurveTo((this.x + x) / 2, this.y, (this.x + x) / 2, y, x - this.gap, y);
54
+ } else if (this.currentPoint === 2) {
55
+ this.context.lineTo(x - this.gap, y);
56
+ } else {
57
+ this.context.bezierCurveTo((this.x + x) / 2, this.y, (this.x + x) / 2, y, x + this.gap, y);
58
+ }
59
+ this.currentPoint += 1;
60
+ this.x = x;
61
+ this.y = y;
62
+ return;
63
+ }
64
+
65
+ // 0 is the top-right corner.
66
+ if (this.currentPoint === 0) {
67
+ // X from Y
68
+ this.context.moveTo(x, y + this.gap);
69
+ this.context.lineTo(x, y + this.gap);
70
+ } else if (this.currentPoint === 1) {
71
+ this.context.bezierCurveTo(this.x, (this.y + y) / 2, x, (this.y + y) / 2, x, y - this.gap);
72
+ } else if (this.currentPoint === 2) {
73
+ this.context.lineTo(x, y - this.gap);
74
+ } else {
75
+ this.context.bezierCurveTo(this.x, (this.y + y) / 2, x, (this.y + y) / 2, x, y + this.gap);
76
+ }
77
+ this.currentPoint += 1;
78
+ this.x = x;
79
+ this.y = y;
80
+ }
81
+ }
82
+ exports.Bump = Bump;
@@ -0,0 +1,8 @@
1
+ export type FunnelCurveOptions = {
2
+ /**
3
+ * The gap between the funnel segments.
4
+ * @default 0
5
+ */
6
+ gap?: number;
7
+ };
8
+ export type FunnelCurveType = 'linear' | 'step' | 'bump';
@@ -0,0 +1,5 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });