@mui/x-charts 6.18.3 → 6.18.7

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 (121) hide show
  1. package/BarChart/BarPlot.js +7 -6
  2. package/BarChart/formatter.js +15 -3
  3. package/CHANGELOG.md +175 -1
  4. package/ChartsAxis/ChartsAxis.js +4 -4
  5. package/ChartsLegend/ChartsLegend.d.ts +1 -1
  6. package/ChartsLegend/ChartsLegend.js +3 -2
  7. package/ChartsReferenceLine/ChartsReferenceLine.js +2 -2
  8. package/ChartsReferenceLine/ChartsXReferenceLine.js +1 -1
  9. package/ChartsReferenceLine/ChartsYReferenceLine.js +1 -1
  10. package/ChartsReferenceLine/common.d.ts +1 -1
  11. package/ChartsText/ChartsText.d.ts +17 -0
  12. package/{internals/components → ChartsText}/ChartsText.js +32 -17
  13. package/ChartsText/index.d.ts +3 -0
  14. package/ChartsText/index.js +12 -0
  15. package/ChartsText/package.json +6 -0
  16. package/ChartsXAxis/ChartsXAxis.js +3 -2
  17. package/ChartsYAxis/ChartsYAxis.js +1 -1
  18. package/LineChart/AreaPlot.js +3 -2
  19. package/LineChart/LineHighlightPlot.js +2 -1
  20. package/LineChart/LinePlot.js +3 -2
  21. package/LineChart/MarkPlot.js +2 -1
  22. package/LineChart/formatter.js +14 -2
  23. package/PieChart/PieArcLabelPlot.d.ts +2 -3
  24. package/PieChart/PieArcLabelPlot.js +0 -1
  25. package/PieChart/PieArcPlot.d.ts +2 -3
  26. package/PieChart/PieArcPlot.js +0 -1
  27. package/PieChart/PieChart.js +4 -4
  28. package/PieChart/PiePlot.js +20 -15
  29. package/PieChart/dataTransform/useTransformData.d.ts +2 -3
  30. package/ResponsiveChartContainer/index.js +2 -2
  31. package/context/CartesianContextProvider.js +2 -2
  32. package/context/SeriesContextProvider.js +1 -1
  33. package/esm/BarChart/BarPlot.js +7 -5
  34. package/esm/BarChart/formatter.js +20 -4
  35. package/esm/ChartsAxis/ChartsAxis.js +4 -4
  36. package/esm/ChartsLegend/ChartsLegend.js +2 -1
  37. package/esm/ChartsReferenceLine/ChartsReferenceLine.js +2 -2
  38. package/esm/ChartsReferenceLine/ChartsXReferenceLine.js +1 -1
  39. package/esm/ChartsReferenceLine/ChartsYReferenceLine.js +1 -1
  40. package/esm/{internals/components → ChartsText}/ChartsText.js +33 -16
  41. package/esm/ChartsText/index.js +1 -0
  42. package/esm/ChartsXAxis/ChartsXAxis.js +2 -1
  43. package/esm/ChartsYAxis/ChartsYAxis.js +1 -1
  44. package/esm/LineChart/AreaPlot.js +3 -2
  45. package/esm/LineChart/LineHighlightPlot.js +2 -1
  46. package/esm/LineChart/LinePlot.js +3 -2
  47. package/esm/LineChart/MarkPlot.js +2 -1
  48. package/esm/LineChart/formatter.js +16 -3
  49. package/esm/PieChart/PieArcLabelPlot.js +0 -1
  50. package/esm/PieChart/PieArcPlot.js +0 -1
  51. package/esm/PieChart/PieChart.js +4 -4
  52. package/esm/PieChart/PiePlot.js +20 -15
  53. package/esm/ResponsiveChartContainer/index.js +2 -2
  54. package/esm/context/CartesianContextProvider.js +2 -2
  55. package/esm/context/SeriesContextProvider.js +1 -1
  56. package/esm/index.js +1 -0
  57. package/esm/internals/getWordsByLines.js +14 -0
  58. package/esm/internals/utils.js +40 -0
  59. package/index.d.ts +1 -0
  60. package/index.js +12 -1
  61. package/internals/defaultizeColor.d.ts +4 -4
  62. package/internals/{components/ChartsText.d.ts → getWordsByLines.d.ts} +2 -11
  63. package/internals/getWordsByLines.js +21 -0
  64. package/internals/utils.d.ts +13 -0
  65. package/internals/utils.js +42 -0
  66. package/legacy/BarChart/BarPlot.js +7 -5
  67. package/legacy/BarChart/formatter.js +23 -9
  68. package/legacy/ChartsAxis/ChartsAxis.js +4 -4
  69. package/legacy/ChartsLegend/ChartsLegend.js +2 -1
  70. package/legacy/ChartsReferenceLine/ChartsReferenceLine.js +2 -2
  71. package/legacy/ChartsReferenceLine/ChartsXReferenceLine.js +1 -1
  72. package/legacy/ChartsReferenceLine/ChartsYReferenceLine.js +1 -1
  73. package/legacy/{internals/components → ChartsText}/ChartsText.js +38 -22
  74. package/legacy/ChartsText/index.js +1 -0
  75. package/legacy/ChartsXAxis/ChartsXAxis.js +2 -1
  76. package/legacy/ChartsYAxis/ChartsYAxis.js +1 -1
  77. package/legacy/LineChart/AreaPlot.js +3 -2
  78. package/legacy/LineChart/LineHighlightPlot.js +2 -1
  79. package/legacy/LineChart/LinePlot.js +3 -2
  80. package/legacy/LineChart/MarkPlot.js +2 -1
  81. package/legacy/LineChart/formatter.js +19 -8
  82. package/legacy/PieChart/PieArcLabelPlot.js +0 -1
  83. package/legacy/PieChart/PieArcPlot.js +0 -1
  84. package/legacy/PieChart/PieChart.js +4 -4
  85. package/legacy/PieChart/PiePlot.js +20 -15
  86. package/legacy/ResponsiveChartContainer/index.js +2 -2
  87. package/legacy/context/CartesianContextProvider.js +2 -2
  88. package/legacy/context/SeriesContextProvider.js +1 -1
  89. package/legacy/index.js +2 -1
  90. package/legacy/internals/getWordsByLines.js +15 -0
  91. package/legacy/internals/utils.js +40 -0
  92. package/models/axis.d.ts +1 -1
  93. package/models/seriesType/config.d.ts +4 -3
  94. package/models/seriesType/pie.d.ts +29 -7
  95. package/modern/BarChart/BarPlot.js +7 -5
  96. package/modern/BarChart/formatter.js +15 -3
  97. package/modern/ChartsAxis/ChartsAxis.js +4 -4
  98. package/modern/ChartsLegend/ChartsLegend.js +2 -1
  99. package/modern/ChartsReferenceLine/ChartsReferenceLine.js +2 -2
  100. package/modern/ChartsReferenceLine/ChartsXReferenceLine.js +1 -1
  101. package/modern/ChartsReferenceLine/ChartsYReferenceLine.js +1 -1
  102. package/modern/{internals/components → ChartsText}/ChartsText.js +33 -16
  103. package/modern/ChartsText/index.js +1 -0
  104. package/modern/ChartsXAxis/ChartsXAxis.js +2 -1
  105. package/modern/ChartsYAxis/ChartsYAxis.js +1 -1
  106. package/modern/LineChart/AreaPlot.js +3 -2
  107. package/modern/LineChart/LineHighlightPlot.js +2 -1
  108. package/modern/LineChart/LinePlot.js +3 -2
  109. package/modern/LineChart/MarkPlot.js +2 -1
  110. package/modern/LineChart/formatter.js +14 -2
  111. package/modern/PieChart/PieArcLabelPlot.js +0 -1
  112. package/modern/PieChart/PieArcPlot.js +0 -1
  113. package/modern/PieChart/PieChart.js +4 -4
  114. package/modern/PieChart/PiePlot.js +20 -15
  115. package/modern/ResponsiveChartContainer/index.js +2 -2
  116. package/modern/context/CartesianContextProvider.js +2 -2
  117. package/modern/context/SeriesContextProvider.js +1 -1
  118. package/modern/index.js +2 -1
  119. package/modern/internals/getWordsByLines.js +14 -0
  120. package/modern/internals/utils.js +40 -0
  121. package/package.json +1 -1
@@ -14,10 +14,9 @@ var _SeriesContextProvider = require("../context/SeriesContextProvider");
14
14
  var _CartesianContextProvider = require("../context/CartesianContextProvider");
15
15
  var _BarElement = require("./BarElement");
16
16
  var _axis = require("../models/axis");
17
+ var _constants = require("../constants");
17
18
  var _jsxRuntime = require("react/jsx-runtime");
18
19
  const _excluded = ["skipAnimation"];
19
- function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
20
- function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
21
20
  /**
22
21
  * Solution of the equations
23
22
  * W = barWidth * N + offset * (N-1)
@@ -27,6 +26,8 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
27
26
  * @param gapRatio The ratio of the gap between bars over the bar width.
28
27
  * @returns The bar width and the offset between bars.
29
28
  */
29
+ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
30
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
30
31
  function getBandSize({
31
32
  bandWidth: W,
32
33
  numberOfGroups: N,
@@ -76,18 +77,18 @@ const useCompletedData = () => {
76
77
  let baseScaleConfig;
77
78
  if (verticalLayout) {
78
79
  if (!(0, _axis.isBandScaleConfig)(xAxisConfig)) {
79
- throw new Error(`Axis with id "${xAxisKey}" shoud be of type "band" to display the bar series of id "${seriesId}"`);
80
+ throw new Error(`MUI-X-Charts: ${xAxisKey === _constants.DEFAULT_X_AXIS_KEY ? 'The first `xAxis`' : `The x-axis with id "${xAxisKey}"`} shoud be of type "band" to display the bar series of id "${seriesId}"`);
80
81
  }
81
82
  if (xAxis[xAxisKey].data === undefined) {
82
- throw new Error(`Axis with id "${xAxisKey}" shoud have data property`);
83
+ throw new Error(`MUI-X-Charts: ${xAxisKey === _constants.DEFAULT_X_AXIS_KEY ? 'The first `xAxis`' : `The x-axis with id "${xAxisKey}"`} shoud have data property`);
83
84
  }
84
85
  baseScaleConfig = xAxisConfig;
85
86
  } else {
86
87
  if (!(0, _axis.isBandScaleConfig)(yAxisConfig)) {
87
- throw new Error(`Axis with id "${yAxisKey}" shoud be of type "band" to display the bar series of id "${seriesId}"`);
88
+ throw new Error(`MUI-X-Charts: ${yAxisKey === _constants.DEFAULT_Y_AXIS_KEY ? 'The first `yAxis`' : `The y-axis with id "${yAxisKey}"`} shoud be of type "band" to display the bar series of id "${seriesId}"`);
88
89
  }
89
90
  if (yAxis[yAxisKey].data === undefined) {
90
- throw new Error(`Axis with id "${xAxisKey}" shoud have data property`);
91
+ throw new Error(`MUI-X-Charts: ${yAxisKey === _constants.DEFAULT_Y_AXIS_KEY ? 'The first `yAxis`' : `The y-axis with id "${yAxisKey}"`} shoud have data property`);
91
92
  }
92
93
  baseScaleConfig = yAxisConfig;
93
94
  }
@@ -9,6 +9,7 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
9
9
  var _d3Shape = require("d3-shape");
10
10
  var _stackSeries = require("../internals/stackSeries");
11
11
  var _defaultizeValueFormatter = _interopRequireDefault(require("../internals/defaultizeValueFormatter"));
12
+ let warnOnce = false;
12
13
  const formatter = (params, dataset) => {
13
14
  const {
14
15
  seriesOrder,
@@ -31,7 +32,7 @@ const formatter = (params, dataset) => {
31
32
  }
32
33
  });
33
34
  } else if (dataset === undefined) {
34
- throw new Error([`MUI: bar series with id='${id}' has no data.`, 'Either provide a data property to the series or use the dataset prop.'].join('\n'));
35
+ throw new Error([`MUI-X-Charts: bar series with id='${id}' has no data.`, 'Either provide a data property to the series or use the dataset prop.'].join('\n'));
35
36
  }
36
37
  });
37
38
  const completedSeries = {};
@@ -46,13 +47,24 @@ const formatter = (params, dataset) => {
46
47
  // Use dataKey if needed and available
47
48
  const dataKey = series[id].dataKey;
48
49
  return series[id].data === undefined && dataKey !== undefined ? dataKey : id;
49
- })).order(stackingOrder).offset(stackingOffset)(d3Dataset);
50
+ })).value((d, key) => d[key] ?? 0) // defaultize null value to 0
51
+ .order(stackingOrder).offset(stackingOffset)(d3Dataset);
50
52
  ids.forEach((id, index) => {
51
53
  const dataKey = series[id].dataKey;
52
54
  completedSeries[id] = (0, _extends2.default)({
53
55
  layout: 'vertical'
54
56
  }, series[id], {
55
- data: dataKey ? dataset.map(d => d[dataKey]) : series[id].data,
57
+ data: dataKey ? dataset.map(data => {
58
+ const value = data[dataKey];
59
+ if (typeof value !== 'number') {
60
+ if (process.env.NODE_ENV !== 'production' && !warnOnce && value !== null) {
61
+ warnOnce = true;
62
+ console.error([`MUI-X charts: your dataset key "${dataKey}" is used for plotting bars, but contains nonnumerical elements.`, 'Bar plots only support numbers and null values.']);
63
+ }
64
+ return 0;
65
+ }
66
+ return value;
67
+ }) : series[id].data,
56
68
  stackedData: stackedSeries[index].map(([a, b]) => [a, b])
57
69
  });
58
70
  });
package/CHANGELOG.md CHANGED
@@ -3,6 +3,179 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## 6.18.7
7
+
8
+ _Jan 5, 2024_
9
+
10
+ We'd like to offer a big thanks to the 4 contributors who made this release possible. Here are some highlights ✨:
11
+
12
+ - 🌍 Improve Czech (cs-CZ) locale on Data Grid (#11429) @wensiet
13
+ - 🐞 Bugfixes
14
+
15
+ ### Data Grid
16
+
17
+ #### `@mui/x-data-grid@6.18.7`
18
+
19
+ - [DataGrid] Don't evaluate `hasEval` when `disableEval` is set (#11553) @reihwald
20
+ - [l10n] Update Czech (cs-CZ) locale (#11498) @fdebef
21
+
22
+ #### `@mui/x-data-grid-pro@6.18.7` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
23
+
24
+ Same changes as in `@mui/x-data-grid@6.18.7`.
25
+
26
+ #### `@mui/x-data-grid-premium@6.18.7` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
27
+
28
+ Same changes as in `@mui/x-data-grid-pro@6.18.7`.
29
+
30
+ ### Date Pickers
31
+
32
+ #### `@mui/x-date-pickers@6.18.7`
33
+
34
+ - [pickers] Fix views management (@LukasTy) (#11572)
35
+
36
+ #### `@mui/x-date-pickers-pro@6.18.7` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
37
+
38
+ Same changes as in `@mui/x-date-pickers@6.18.7`.
39
+
40
+ ### Charts / `@mui/x-charts@6.18.7`
41
+
42
+ - [charts] Fix `null` in line chart using dataset (@alexfauquette) (#11561)
43
+
44
+ ### Docs
45
+
46
+ - [docs] Clarify Pickers usage with Luxon (#11566) @LukasTy
47
+
48
+ ## 6.18.6
49
+
50
+ _Dec 22, 2023_
51
+
52
+ We'd like to offer a big thanks to the 5 contributors who made this release possible. Here are some highlights ✨:
53
+
54
+ - 🌍 Improve Russian (ru-RU) locale (#11429) @wensiet
55
+ - 🐞 Bugfixes
56
+
57
+ ### Data Grid
58
+
59
+ #### `@mui/x-data-grid@6.18.6`
60
+
61
+ - [DataGrid] Fix typos in the JSDoc (#11475) @flaviendelangle
62
+ - [l10n] Improve Russian (ru-RU) locale (#11429) @wensiet
63
+
64
+ #### `@mui/x-data-grid-pro@6.18.6` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
65
+
66
+ Same changes as in `@mui/x-data-grid@6.18.6`.
67
+
68
+ #### `@mui/x-data-grid-premium@6.18.6` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
69
+
70
+ Same changes as in `@mui/x-data-grid-pro@6.18.6`.
71
+
72
+ ### Date Pickers
73
+
74
+ #### `@mui/x-date-pickers@6.18.6`
75
+
76
+ - [fields] Fix section pasting (#11467) @LukasTy
77
+
78
+ #### `@mui/x-date-pickers-pro@6.18.6` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
79
+
80
+ Same changes as in `@mui/x-date-pickers@6.18.6`.
81
+
82
+ ### Charts / `@mui/x-charts@6.18.4`
83
+
84
+ - [charts] Allow percentage values for pie chart center and radius (#11464) @alexfauquette
85
+ - [charts] Make error message more explicit (#11457) @alexfauquette
86
+ - [charts] Make the helper `ChartsText` component public (#11370) @alexfauquette
87
+ - [charts] Improve dataset typing (#11372) @alexfauquette
88
+ - [charts] Fix size overflow (#11385) @alexfauquette
89
+
90
+ ### Docs
91
+
92
+ - [docs] Document false default values for boolean props (#11489) @cherniavskii
93
+ - [docs] Improve Pickers `name` prop examples (#11442) @LukasTy
94
+ - [docs] Limit `date-fns` package to v2 in codesandbox (#11478) @LukasTy
95
+ - [test] Reload the page if its blank and there are no links to the remaining tests (#11471) @cherniavskii
96
+
97
+ ## 6.18.5
98
+
99
+ _Dec 14, 2023_
100
+
101
+ We'd like to offer a big thanks to the 7 contributors who made this release possible. Here are some highlights ✨:
102
+
103
+ - 🌍 Improve Swedish (sv-SE) and Urdu (ur-PK) locales on the Data Grid
104
+ - 🐞 Bugfixes
105
+
106
+ ### Data Grid
107
+
108
+ #### `@mui/x-data-grid@6.18.5`
109
+
110
+ - [l10n] Improve Swedish (sv-SE) locale (#11379) @fredrikcarlbom
111
+ - [l10n] Improve Urdu (ur-PK) locale for data grid (#11409) @MBilalShafi
112
+
113
+ #### `@mui/x-data-grid-pro@6.18.5` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
114
+
115
+ Same changes as in `@mui/x-data-grid@6.18.5`.
116
+
117
+ #### `@mui/x-data-grid-premium@6.18.5` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
118
+
119
+ Same changes as in `@mui/x-data-grid-pro@6.18.5`.
120
+
121
+ ### Date Pickers
122
+
123
+ #### `@mui/x-date-pickers@6.18.5`
124
+
125
+ - [pickers] Fix field types to avoid error on latest `@types/react` version (#11398) @LukasTy
126
+ - [pickers] Support name prop (#11380) @gitstart
127
+
128
+ #### `@mui/x-date-pickers-pro@6.18.5` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
129
+
130
+ Same changes as in `@mui/x-date-pickers@6.18.5`, plus:
131
+
132
+ - [DateRangePicker] Fix `autoFocus` behavior (#11376) @kealjones-wk
133
+
134
+ ### Docs
135
+
136
+ - [docs] Respect GoT books (#11294) @janoma
137
+ - [test] Fix flaky screenshots (#11391) @cherniavskii
138
+
139
+ ## 6.18.4
140
+
141
+ _Dec 8, 2023_
142
+
143
+ We'd like to offer a big thanks to the 6 contributors who made this release possible. Here are some highlights ✨:
144
+
145
+ - 📚 Add [Pickers FAQ page](https://mui.com/x/react-date-pickers/faq/)
146
+ - 🌍 Improve Danish (da-DK) locale on Data Grid
147
+ - 🐞 Bugfixes
148
+
149
+ ### Data Grid
150
+
151
+ #### `@mui/x-data-grid@6.18.4`
152
+
153
+ - [DataGrid] Fix cell slot style override (#11215) @oliviertassinari
154
+ - [l10n] Improve Danish (da-DK) locale (#11346) @goibon
155
+
156
+ #### `@mui/x-data-grid-pro@6.18.4` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
157
+
158
+ Same changes as in `@mui/x-data-grid@6.18.4`.
159
+
160
+ #### `@mui/x-data-grid-premium@6.18.4` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
161
+
162
+ Same changes as in `@mui/x-data-grid-pro@6.18.4`.
163
+
164
+ ### Date Pickers
165
+
166
+ #### `@mui/x-date-pickers@6.18.4`
167
+
168
+ - [pickers] Fix `MultiSectionDigitalClock` issues (#11308) @LukasTy
169
+
170
+ #### `@mui/x-date-pickers-pro@6.18.4` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
171
+
172
+ Same changes as in `@mui/x-date-pickers@6.18.4`.
173
+
174
+ ### Docs
175
+
176
+ - [docs] Fix typo (#11323) @cadam11
177
+ - [docs] Add FAQ page (#11347) @noraleonte
178
+
6
179
  ## 6.18.3
7
180
 
8
181
  _Dec 4, 2023_
@@ -347,7 +520,7 @@ Same changes as in `@mui/x-date-pickers@6.16.3`, plus:
347
520
 
348
521
  - [charts] Add reference links to area + bar chart components (#10652) @michelengelen
349
522
  - [charts] Add reference links to line chart + sparkline components (#10650) @michelengelen
350
- - [charts] Add reference links to pie + scatter chart components (#10653) @michelengelen
523
+ - [charts] Add reference links to pie + scatter chart components (#10653) @michelengelen
351
524
  - [charts] Render only when `width` and `height` are resolved (#10714) @alexfauquette
352
525
  - [charts] Support animation on `BarChart` (#9926) @alexfauquette
353
526
  - [charts] Use new text component to avoid tick label overflow on x-axis (#10648) @alexfauquette
@@ -423,6 +596,7 @@ It adds line break support and avoids overlapping text in the legend.
423
596
  This comes with some breaking changes.
424
597
 
425
598
  - The DOM structure is modified. An intermediary `<tspan />` element has been added. This can impact how your style is applied.
599
+
426
600
  ```diff
427
601
  - <text>The label</text>
428
602
  + <text><tspan>The label</tspan></text>
@@ -66,16 +66,16 @@ function ChartsAxis(props) {
66
66
  const topId = getAxisId(topAxis);
67
67
  const rightId = getAxisId(rightAxis);
68
68
  if (topId !== null && !xAxis[topId]) {
69
- throw Error(`MUI: id used for top axis "${topId}" is not defined`);
69
+ throw Error([`MUI-X-Charts: id used for top axis "${topId}" is not defined.`, `Available ids are: ${xAxisIds.join(', ')}.`].join('\n'));
70
70
  }
71
71
  if (leftId !== null && !yAxis[leftId]) {
72
- throw Error(`MUI: id used for left axis "${leftId}" is not defined`);
72
+ throw Error([`MUI-X-Charts: id used for left axis "${leftId}" is not defined.`, `Available ids are: ${yAxisIds.join(', ')}.`].join('\n'));
73
73
  }
74
74
  if (rightId !== null && !yAxis[rightId]) {
75
- throw Error(`MUI: id used for right axis "${rightId}" is not defined`);
75
+ throw Error([`MUI-X-Charts: id used for right axis "${rightId}" is not defined.`, `Available ids are: ${yAxisIds.join(', ')}.`].join('\n'));
76
76
  }
77
77
  if (bottomId !== null && !xAxis[bottomId]) {
78
- throw Error(`MUI: id used for bottom axis "${bottomId}" is not defined`);
78
+ throw Error([`MUI-X-Charts: id used for bottom axis "${bottomId}" is not defined.`, `Available ids are: ${xAxisIds.join(', ')}.`].join('\n'));
79
79
  }
80
80
  const topAxisProps = mergeProps(topAxis, slots, slotProps);
81
81
  const bottomAxisProps = mergeProps(bottomAxis, slots, slotProps);
@@ -6,7 +6,7 @@ import { FormattedSeries } from '../context/SeriesContextProvider';
6
6
  import { ChartsLegendClasses } from './chartsLegendClasses';
7
7
  import { DefaultizedProps } from '../models/helpers';
8
8
  import { LegendParams } from '../models/seriesType/config';
9
- import { ChartsTextStyle } from '../internals/components/ChartsText';
9
+ import { ChartsTextStyle } from '../ChartsText';
10
10
  import { CardinalDirections } from '../models/layout';
11
11
  export interface ChartsLegendSlotsComponent {
12
12
  legend?: React.JSXElementConstructor<LegendRendererProps>;
@@ -17,7 +17,8 @@ var _DrawingProvider = require("../context/DrawingProvider");
17
17
  var _utils3 = require("./utils");
18
18
  var _SeriesContextProvider = require("../context/SeriesContextProvider");
19
19
  var _chartsLegendClasses = require("./chartsLegendClasses");
20
- var _ChartsText = require("../internals/components/ChartsText");
20
+ var _ChartsText = require("../ChartsText");
21
+ var _getWordsByLines = require("../internals/getWordsByLines");
21
22
  var _jsxRuntime = require("react/jsx-runtime");
22
23
  const _excluded = ["rotate", "dominantBaseline"],
23
24
  _excluded2 = ["label"];
@@ -95,7 +96,7 @@ function DefaultChartsLegend(props) {
95
96
  const padding = React.useMemo(() => getStandardizedPadding(paddingProps), [paddingProps]);
96
97
  const getItemSpace = React.useCallback((label, inStyle = {}) => {
97
98
  const style = (0, _objectWithoutPropertiesLoose2.default)(inStyle, _excluded);
98
- const linesSize = (0, _ChartsText.getWordsByLines)({
99
+ const linesSize = (0, _getWordsByLines.getWordsByLines)({
99
100
  style,
100
101
  needsComputation: true,
101
102
  text: label
@@ -15,10 +15,10 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
15
15
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
16
16
  function ChartsReferenceLine(props) {
17
17
  if (props.x !== undefined && props.y !== undefined) {
18
- throw new Error('MUI-X: The ChartsReferenceLine can not have both `x` and `y` props set.');
18
+ throw new Error('MUI-X-Charts: The ChartsReferenceLine can not have both `x` and `y` props set.');
19
19
  }
20
20
  if (props.x === undefined && props.y === undefined) {
21
- throw new Error('MUI-X: The ChartsReferenceLine should have a value in `x` or `y` prop.');
21
+ throw new Error('MUI-X-Charts: The ChartsReferenceLine should have a value in `x` or `y` prop.');
22
22
  }
23
23
  if (props.x !== undefined) {
24
24
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsXReferenceLine.ChartsXReferenceLine, (0, _extends2.default)({}, props));
@@ -11,7 +11,7 @@ var React = _interopRequireWildcard(require("react"));
11
11
  var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
12
12
  var _hooks = require("../hooks");
13
13
  var _common = require("./common");
14
- var _ChartsText = require("../internals/components/ChartsText");
14
+ var _ChartsText = require("../ChartsText");
15
15
  var _chartsReferenceLineClasses = require("./chartsReferenceLineClasses");
16
16
  var _jsxRuntime = require("react/jsx-runtime");
17
17
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
@@ -11,7 +11,7 @@ var React = _interopRequireWildcard(require("react"));
11
11
  var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
12
12
  var _hooks = require("../hooks");
13
13
  var _common = require("./common");
14
- var _ChartsText = require("../internals/components/ChartsText");
14
+ var _ChartsText = require("../ChartsText");
15
15
  var _chartsReferenceLineClasses = require("./chartsReferenceLineClasses");
16
16
  var _jsxRuntime = require("react/jsx-runtime");
17
17
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
@@ -1,6 +1,6 @@
1
1
  /// <reference types="react" />
2
2
  import { ChartsReferenceLineClasses } from './chartsReferenceLineClasses';
3
- import { ChartsTextStyle } from '../internals/components/ChartsText';
3
+ import { ChartsTextStyle } from '../ChartsText';
4
4
  export type CommonChartsReferenceLineProps = {
5
5
  /**
6
6
  * The alignment if the label is in the chart drawing area.
@@ -0,0 +1,17 @@
1
+ import * as React from 'react';
2
+ import { GetWordsByLinesParams } from '../internals/getWordsByLines';
3
+ export interface ChartsTextProps extends Omit<React.SVGTextElementAttributes<SVGTextElement>, 'width' | 'ref' | 'style' | 'dominantBaseline'>, GetWordsByLinesParams {
4
+ /**
5
+ * Height of a text line (in `em`).
6
+ */
7
+ lineHeight?: number;
8
+ ownerState?: any;
9
+ }
10
+ /**
11
+ * Helper component to manage multiline text in SVG
12
+ */
13
+ declare function ChartsText(props: ChartsTextProps): React.JSX.Element;
14
+ declare namespace ChartsText {
15
+ var propTypes: any;
16
+ }
17
+ export { ChartsText };
@@ -5,28 +5,19 @@ Object.defineProperty(exports, "__esModule", {
5
5
  value: true
6
6
  });
7
7
  exports.ChartsText = ChartsText;
8
- exports.getWordsByLines = getWordsByLines;
9
- var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
10
8
  var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
9
+ var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
11
10
  var React = _interopRequireWildcard(require("react"));
12
- var _domUtils = require("../domUtils");
11
+ var _propTypes = _interopRequireDefault(require("prop-types"));
12
+ var _getWordsByLines = require("../internals/getWordsByLines");
13
13
  var _jsxRuntime = require("react/jsx-runtime");
14
14
  const _excluded = ["x", "y", "style", "text", "ownerState"],
15
15
  _excluded2 = ["angle", "textAnchor", "dominantBaseline"];
16
16
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
17
17
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
18
- function getWordsByLines({
19
- style,
20
- needsComputation,
21
- text
22
- }) {
23
- return text.split('\n').map(subText => (0, _extends2.default)({
24
- text: subText
25
- }, needsComputation ? (0, _domUtils.getStringSize)(subText, style) : {
26
- width: 0,
27
- height: 0
28
- }));
29
- }
18
+ /**
19
+ * Helper component to manage multiline text in SVG
20
+ */
30
21
  function ChartsText(props) {
31
22
  const {
32
23
  x,
@@ -42,7 +33,7 @@ function ChartsText(props) {
42
33
  dominantBaseline
43
34
  } = _ref,
44
35
  style = (0, _objectWithoutPropertiesLoose2.default)(_ref, _excluded2);
45
- const wordsByLines = React.useMemo(() => getWordsByLines({
36
+ const wordsByLines = React.useMemo(() => (0, _getWordsByLines.getWordsByLines)({
46
37
  style,
47
38
  needsComputation: text.includes('\n'),
48
39
  text
@@ -84,4 +75,28 @@ function ChartsText(props) {
84
75
  children: line.text
85
76
  }, index))
86
77
  }));
87
- }
78
+ }
79
+ process.env.NODE_ENV !== "production" ? ChartsText.propTypes = {
80
+ // ----------------------------- Warning --------------------------------
81
+ // | These PropTypes are generated from the TypeScript type definitions |
82
+ // | To update them edit the TypeScript types and run "yarn proptypes" |
83
+ // ----------------------------------------------------------------------
84
+ /**
85
+ * Height of a text line (in `em`).
86
+ */
87
+ lineHeight: _propTypes.default.number,
88
+ /**
89
+ * If `true`, the line width is computed.
90
+ * @default false
91
+ */
92
+ needsComputation: _propTypes.default.bool,
93
+ ownerState: _propTypes.default.any,
94
+ /**
95
+ * Style applied to text elements.
96
+ */
97
+ style: _propTypes.default.object,
98
+ /**
99
+ * Text displayed.
100
+ */
101
+ text: _propTypes.default.string.isRequired
102
+ } : void 0;
@@ -0,0 +1,3 @@
1
+ export { ChartsText } from './ChartsText';
2
+ export type { ChartsTextProps } from './ChartsText';
3
+ export type { ChartsTextStyle } from '../internals/getWordsByLines';
@@ -0,0 +1,12 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ Object.defineProperty(exports, "ChartsText", {
7
+ enumerable: true,
8
+ get: function () {
9
+ return _ChartsText.ChartsText;
10
+ }
11
+ });
12
+ var _ChartsText = require("./ChartsText");
@@ -0,0 +1,6 @@
1
+ {
2
+ "sideEffects": false,
3
+ "module": "../esm/ChartsText/index.js",
4
+ "main": "./index.js",
5
+ "types": "./index.d.ts"
6
+ }
@@ -17,9 +17,10 @@ var _DrawingProvider = require("../context/DrawingProvider");
17
17
  var _useTicks = _interopRequireDefault(require("../hooks/useTicks"));
18
18
  var _axisClasses = require("../ChartsAxis/axisClasses");
19
19
  var _AxisSharedComponents = require("../internals/components/AxisSharedComponents");
20
- var _ChartsText = require("../internals/components/ChartsText");
20
+ var _ChartsText = require("../ChartsText");
21
21
  var _geometry = require("../internals/geometry");
22
22
  var _useMounted = require("../hooks/useMounted");
23
+ var _getWordsByLines = require("../internals/getWordsByLines");
23
24
  var _jsxRuntime = require("react/jsx-runtime");
24
25
  const _excluded = ["scale", "tickNumber"];
25
26
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
@@ -51,7 +52,7 @@ function addLabelDimension(xTicks, {
51
52
  height: 0
52
53
  });
53
54
  }
54
- const tickSizes = (0, _ChartsText.getWordsByLines)({
55
+ const tickSizes = (0, _getWordsByLines.getWordsByLines)({
55
56
  style,
56
57
  needsComputation: true,
57
58
  text: tick.formattedValue
@@ -16,7 +16,7 @@ var _CartesianContextProvider = require("../context/CartesianContextProvider");
16
16
  var _DrawingProvider = require("../context/DrawingProvider");
17
17
  var _useTicks = _interopRequireDefault(require("../hooks/useTicks"));
18
18
  var _AxisSharedComponents = require("../internals/components/AxisSharedComponents");
19
- var _ChartsText = require("../internals/components/ChartsText");
19
+ var _ChartsText = require("../ChartsText");
20
20
  var _axisClasses = require("../ChartsAxis/axisClasses");
21
21
  var _jsxRuntime = require("react/jsx-runtime");
22
22
  const _excluded = ["scale", "tickNumber"];
@@ -15,6 +15,7 @@ var _CartesianContextProvider = require("../context/CartesianContextProvider");
15
15
  var _AreaElement = require("./AreaElement");
16
16
  var _useScale = require("../hooks/useScale");
17
17
  var _getCurve = _interopRequireDefault(require("../internals/getCurve"));
18
+ var _constants = require("../constants");
18
19
  var _jsxRuntime = require("react/jsx-runtime");
19
20
  const _excluded = ["slots", "slotProps"];
20
21
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
@@ -70,10 +71,10 @@ function AreaPlot(props) {
70
71
  const xData = xAxis[xAxisKey].data;
71
72
  if (process.env.NODE_ENV !== 'production') {
72
73
  if (xData === undefined) {
73
- throw new Error(`Axis of id "${xAxisKey}" should have data property to be able to display a line plot.`);
74
+ throw new Error(`MUI-X-Charts: ${xAxisKey === _constants.DEFAULT_X_AXIS_KEY ? 'The first `xAxis`' : `The x-axis with id "${xAxisKey}"`} should have data property to be able to display a line plot.`);
74
75
  }
75
76
  if (xData.length < stackedData.length) {
76
- throw new Error(`MUI: data length of the x axis (${xData.length} items) is lower than the length of series (${stackedData.length} items)`);
77
+ throw new Error(`MUI-X-Charts: The data length of the x axis (${xData.length} items) is lower than the length of series (${stackedData.length} items)`);
77
78
  }
78
79
  }
79
80
  const areaPath = (0, _d3Shape.area)().x(d => xScale(d.x)).defined((_, i) => connectNulls || data[i] != null).y0(d => d.y && yScale(d.y[0])).y1(d => d.y && yScale(d.y[1]));
@@ -14,6 +14,7 @@ var _CartesianContextProvider = require("../context/CartesianContextProvider");
14
14
  var _LineHighlightElement = require("./LineHighlightElement");
15
15
  var _useScale = require("../hooks/useScale");
16
16
  var _InteractionProvider = require("../context/InteractionProvider");
17
+ var _constants = require("../constants");
17
18
  var _jsxRuntime = require("react/jsx-runtime");
18
19
  const _excluded = ["slots", "slotProps"];
19
20
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
@@ -78,7 +79,7 @@ function LineHighlightPlot(props) {
78
79
  const yScale = yAxis[yAxisKey].scale;
79
80
  const xData = xAxis[xAxisKey].data;
80
81
  if (xData === undefined) {
81
- throw new Error(`Axis of id "${xAxisKey}" should have data property to be able to display a line plot.`);
82
+ throw new Error(`MUI-X-Charts: ${xAxisKey === _constants.DEFAULT_X_AXIS_KEY ? 'The first `xAxis`' : `The x-axis with id "${xAxisKey}"`} should have data property to be able to display a line plot.`);
82
83
  }
83
84
  const x = xScale(xData[highlightedIndex]);
84
85
  const y = yScale(stackedData[highlightedIndex][1]); // This should not be undefined since y should not be a band scale
@@ -15,6 +15,7 @@ var _CartesianContextProvider = require("../context/CartesianContextProvider");
15
15
  var _LineElement = require("./LineElement");
16
16
  var _useScale = require("../hooks/useScale");
17
17
  var _getCurve = _interopRequireDefault(require("../internals/getCurve"));
18
+ var _constants = require("../constants");
18
19
  var _jsxRuntime = require("react/jsx-runtime");
19
20
  const _excluded = ["slots", "slotProps"];
20
21
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
@@ -69,10 +70,10 @@ function LinePlot(props) {
69
70
  const xData = xAxis[xAxisKey].data;
70
71
  if (process.env.NODE_ENV !== 'production') {
71
72
  if (xData === undefined) {
72
- throw new Error(`Axis of id "${xAxisKey}" should have data property to be able to display a line plot`);
73
+ throw new Error(`MUI-X-Charts: ${xAxisKey === _constants.DEFAULT_X_AXIS_KEY ? 'The first `xAxis`' : `The x-axis with id "${xAxisKey}"`} should have data property to be able to display a line plot`);
73
74
  }
74
75
  if (xData.length < stackedData.length) {
75
- throw new Error(`MUI: data length of the x axis (${xData.length} items) is lower than the length of series (${stackedData.length} items)`);
76
+ throw new Error(`MUI-X-Charts: The data length of the x axis (${xData.length} items) is lower than the length of series (${stackedData.length} items)`);
76
77
  }
77
78
  }
78
79
  const linePath = (0, _d3Shape.line)().x(d => xScale(d.x)).defined((_, i) => connectNulls || data[i] != null).y(d => yScale(d.y[1]));
@@ -13,6 +13,7 @@ var _SeriesContextProvider = require("../context/SeriesContextProvider");
13
13
  var _CartesianContextProvider = require("../context/CartesianContextProvider");
14
14
  var _MarkElement = require("./MarkElement");
15
15
  var _useScale = require("../hooks/useScale");
16
+ var _constants = require("../constants");
16
17
  var _jsxRuntime = require("react/jsx-runtime");
17
18
  const _excluded = ["slots", "slotProps"];
18
19
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
@@ -84,7 +85,7 @@ function MarkPlot(props) {
84
85
  return true;
85
86
  };
86
87
  if (xData === undefined) {
87
- throw new Error(`Axis of id "${xAxisKey}" should have data property to be able to display a line plot`);
88
+ throw new Error(`MUI-X-Charts: ${xAxisKey === _constants.DEFAULT_X_AXIS_KEY ? 'The first `xAxis`' : `The x-axis with id "${xAxisKey}"`} should have data property to be able to display a line plot`);
88
89
  }
89
90
  return xData?.map((x, index) => {
90
91
  const value = data[index] == null ? null : stackedData[index][1];