@mui/x-charts 6.18.2 → 6.18.4

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 (190) hide show
  1. package/BarChart/BarElement.d.ts +5 -1
  2. package/BarChart/BarElement.js +24 -1
  3. package/BarChart/BarPlot.js +7 -6
  4. package/BarChart/formatter.js +15 -3
  5. package/BarChart/index.d.ts +3 -2
  6. package/BarChart/index.js +31 -12
  7. package/CHANGELOG.md +192 -1
  8. package/ChartsAxis/ChartsAxis.js +4 -4
  9. package/ChartsLegend/ChartsLegend.d.ts +1 -1
  10. package/ChartsLegend/ChartsLegend.js +3 -2
  11. package/ChartsLegend/index.d.ts +1 -0
  12. package/ChartsLegend/index.js +11 -0
  13. package/ChartsReferenceLine/ChartsReferenceLine.js +2 -2
  14. package/ChartsReferenceLine/ChartsXReferenceLine.js +1 -1
  15. package/ChartsReferenceLine/ChartsYReferenceLine.js +1 -1
  16. package/ChartsReferenceLine/common.d.ts +1 -1
  17. package/ChartsText/ChartsText.d.ts +17 -0
  18. package/{internals/components → ChartsText}/ChartsText.js +32 -17
  19. package/ChartsText/index.d.ts +3 -0
  20. package/ChartsText/index.js +12 -0
  21. package/ChartsText/package.json +6 -0
  22. package/ChartsTooltip/ChartsAxisTooltipContent.d.ts +5 -2
  23. package/ChartsTooltip/ChartsAxisTooltipContent.js +93 -73
  24. package/ChartsTooltip/ChartsItemTooltipContent.d.ts +5 -2
  25. package/ChartsTooltip/ChartsItemTooltipContent.js +38 -57
  26. package/ChartsTooltip/DefaultChartsAxisTooltipContent.d.ts +7 -0
  27. package/ChartsTooltip/DefaultChartsAxisTooltipContent.js +174 -0
  28. package/ChartsTooltip/DefaultChartsItemTooltipContent.d.ts +8 -0
  29. package/ChartsTooltip/DefaultChartsItemTooltipContent.js +99 -0
  30. package/ChartsTooltip/index.d.ts +4 -0
  31. package/ChartsTooltip/index.js +44 -0
  32. package/ChartsXAxis/ChartsXAxis.js +3 -2
  33. package/ChartsYAxis/ChartsYAxis.js +7 -5
  34. package/LineChart/AreaPlot.js +3 -2
  35. package/LineChart/LineHighlightPlot.js +2 -1
  36. package/LineChart/LinePlot.js +3 -2
  37. package/LineChart/MarkPlot.js +2 -1
  38. package/LineChart/extremums.js +25 -8
  39. package/LineChart/formatter.js +14 -2
  40. package/LineChart/index.d.ts +5 -5
  41. package/LineChart/index.js +50 -41
  42. package/PieChart/PieArcLabelPlot.d.ts +7 -4
  43. package/PieChart/PieArcLabelPlot.js +88 -1
  44. package/PieChart/PieArcPlot.d.ts +7 -4
  45. package/PieChart/PieArcPlot.js +87 -1
  46. package/PieChart/PieChart.js +4 -4
  47. package/PieChart/PiePlot.js +20 -15
  48. package/PieChart/dataTransform/useTransformData.d.ts +2 -3
  49. package/PieChart/index.d.ts +6 -6
  50. package/PieChart/index.js +60 -46
  51. package/ResponsiveChartContainer/index.js +2 -2
  52. package/ScatterChart/Scatter.js +1 -1
  53. package/ScatterChart/index.d.ts +3 -3
  54. package/ScatterChart/index.js +31 -19
  55. package/context/CartesianContextProvider.js +2 -2
  56. package/context/SeriesContextProvider.js +1 -1
  57. package/esm/BarChart/BarElement.js +26 -2
  58. package/esm/BarChart/BarPlot.js +7 -5
  59. package/esm/BarChart/formatter.js +20 -4
  60. package/esm/BarChart/index.js +3 -2
  61. package/esm/ChartsAxis/ChartsAxis.js +4 -4
  62. package/esm/ChartsLegend/ChartsLegend.js +2 -1
  63. package/esm/ChartsLegend/index.js +2 -1
  64. package/esm/ChartsReferenceLine/ChartsReferenceLine.js +2 -2
  65. package/esm/ChartsReferenceLine/ChartsXReferenceLine.js +1 -1
  66. package/esm/ChartsReferenceLine/ChartsYReferenceLine.js +1 -1
  67. package/esm/{internals/components → ChartsText}/ChartsText.js +33 -16
  68. package/esm/ChartsText/index.js +1 -0
  69. package/esm/ChartsTooltip/ChartsAxisTooltipContent.js +95 -75
  70. package/esm/ChartsTooltip/ChartsItemTooltipContent.js +40 -58
  71. package/esm/ChartsTooltip/DefaultChartsAxisTooltipContent.js +168 -0
  72. package/esm/ChartsTooltip/DefaultChartsItemTooltipContent.js +92 -0
  73. package/esm/ChartsTooltip/index.js +5 -1
  74. package/esm/ChartsXAxis/ChartsXAxis.js +2 -1
  75. package/esm/ChartsYAxis/ChartsYAxis.js +7 -5
  76. package/esm/LineChart/AreaPlot.js +3 -2
  77. package/esm/LineChart/LineHighlightPlot.js +2 -1
  78. package/esm/LineChart/LinePlot.js +3 -2
  79. package/esm/LineChart/MarkPlot.js +2 -1
  80. package/esm/LineChart/extremums.js +25 -8
  81. package/esm/LineChart/formatter.js +16 -3
  82. package/esm/LineChart/index.js +5 -5
  83. package/esm/PieChart/PieArcLabelPlot.js +90 -2
  84. package/esm/PieChart/PieArcPlot.js +89 -2
  85. package/esm/PieChart/PieChart.js +4 -4
  86. package/esm/PieChart/PiePlot.js +20 -15
  87. package/esm/PieChart/index.js +6 -4
  88. package/esm/ResponsiveChartContainer/index.js +2 -2
  89. package/esm/ScatterChart/Scatter.js +1 -1
  90. package/esm/ScatterChart/index.js +3 -3
  91. package/esm/context/CartesianContextProvider.js +2 -2
  92. package/esm/context/SeriesContextProvider.js +1 -1
  93. package/esm/index.js +1 -0
  94. package/esm/internals/defaultizeValueFormatter.js +4 -3
  95. package/esm/internals/getWordsByLines.js +14 -0
  96. package/esm/internals/utils.js +40 -0
  97. package/index.d.ts +1 -0
  98. package/index.js +12 -1
  99. package/internals/defaultizeColor.d.ts +4 -4
  100. package/internals/defaultizeValueFormatter.d.ts +3 -1
  101. package/internals/defaultizeValueFormatter.js +3 -3
  102. package/internals/{components/ChartsText.d.ts → getWordsByLines.d.ts} +2 -11
  103. package/internals/getWordsByLines.js +21 -0
  104. package/internals/utils.d.ts +13 -0
  105. package/internals/utils.js +42 -0
  106. package/legacy/BarChart/BarElement.js +26 -2
  107. package/legacy/BarChart/BarPlot.js +7 -5
  108. package/legacy/BarChart/formatter.js +23 -9
  109. package/legacy/BarChart/index.js +3 -2
  110. package/legacy/ChartsAxis/ChartsAxis.js +4 -4
  111. package/legacy/ChartsLegend/ChartsLegend.js +2 -1
  112. package/legacy/ChartsLegend/index.js +2 -1
  113. package/legacy/ChartsReferenceLine/ChartsReferenceLine.js +2 -2
  114. package/legacy/ChartsReferenceLine/ChartsXReferenceLine.js +1 -1
  115. package/legacy/ChartsReferenceLine/ChartsYReferenceLine.js +1 -1
  116. package/legacy/{internals/components → ChartsText}/ChartsText.js +38 -22
  117. package/legacy/ChartsText/index.js +1 -0
  118. package/legacy/ChartsTooltip/ChartsAxisTooltipContent.js +95 -74
  119. package/legacy/ChartsTooltip/ChartsItemTooltipContent.js +40 -55
  120. package/legacy/ChartsTooltip/DefaultChartsAxisTooltipContent.js +167 -0
  121. package/legacy/ChartsTooltip/DefaultChartsItemTooltipContent.js +89 -0
  122. package/legacy/ChartsTooltip/index.js +5 -1
  123. package/legacy/ChartsXAxis/ChartsXAxis.js +2 -1
  124. package/legacy/ChartsYAxis/ChartsYAxis.js +7 -5
  125. package/legacy/LineChart/AreaPlot.js +3 -2
  126. package/legacy/LineChart/LineHighlightPlot.js +2 -1
  127. package/legacy/LineChart/LinePlot.js +3 -2
  128. package/legacy/LineChart/MarkPlot.js +2 -1
  129. package/legacy/LineChart/extremums.js +29 -14
  130. package/legacy/LineChart/formatter.js +19 -8
  131. package/legacy/LineChart/index.js +5 -5
  132. package/legacy/PieChart/PieArcLabelPlot.js +90 -2
  133. package/legacy/PieChart/PieArcPlot.js +89 -2
  134. package/legacy/PieChart/PieChart.js +4 -4
  135. package/legacy/PieChart/PiePlot.js +20 -15
  136. package/legacy/PieChart/index.js +6 -4
  137. package/legacy/ResponsiveChartContainer/index.js +2 -2
  138. package/legacy/ScatterChart/Scatter.js +1 -1
  139. package/legacy/ScatterChart/index.js +3 -3
  140. package/legacy/context/CartesianContextProvider.js +2 -2
  141. package/legacy/context/SeriesContextProvider.js +1 -1
  142. package/legacy/index.js +2 -1
  143. package/legacy/internals/defaultizeValueFormatter.js +4 -3
  144. package/legacy/internals/getWordsByLines.js +15 -0
  145. package/legacy/internals/utils.js +40 -0
  146. package/models/axis.d.ts +1 -1
  147. package/models/seriesType/config.d.ts +9 -4
  148. package/models/seriesType/pie.d.ts +29 -7
  149. package/models/seriesType/scatter.d.ts +1 -1
  150. package/modern/BarChart/BarElement.js +26 -2
  151. package/modern/BarChart/BarPlot.js +7 -5
  152. package/modern/BarChart/formatter.js +15 -3
  153. package/modern/BarChart/index.js +3 -2
  154. package/modern/ChartsAxis/ChartsAxis.js +4 -4
  155. package/modern/ChartsLegend/ChartsLegend.js +2 -1
  156. package/modern/ChartsLegend/index.js +2 -1
  157. package/modern/ChartsReferenceLine/ChartsReferenceLine.js +2 -2
  158. package/modern/ChartsReferenceLine/ChartsXReferenceLine.js +1 -1
  159. package/modern/ChartsReferenceLine/ChartsYReferenceLine.js +1 -1
  160. package/modern/{internals/components → ChartsText}/ChartsText.js +33 -16
  161. package/modern/ChartsText/index.js +1 -0
  162. package/modern/ChartsTooltip/ChartsAxisTooltipContent.js +95 -74
  163. package/modern/ChartsTooltip/ChartsItemTooltipContent.js +40 -58
  164. package/modern/ChartsTooltip/DefaultChartsAxisTooltipContent.js +167 -0
  165. package/modern/ChartsTooltip/DefaultChartsItemTooltipContent.js +92 -0
  166. package/modern/ChartsTooltip/index.js +5 -1
  167. package/modern/ChartsXAxis/ChartsXAxis.js +2 -1
  168. package/modern/ChartsYAxis/ChartsYAxis.js +7 -5
  169. package/modern/LineChart/AreaPlot.js +3 -2
  170. package/modern/LineChart/LineHighlightPlot.js +2 -1
  171. package/modern/LineChart/LinePlot.js +3 -2
  172. package/modern/LineChart/MarkPlot.js +2 -1
  173. package/modern/LineChart/extremums.js +25 -8
  174. package/modern/LineChart/formatter.js +14 -2
  175. package/modern/LineChart/index.js +5 -5
  176. package/modern/PieChart/PieArcLabelPlot.js +90 -2
  177. package/modern/PieChart/PieArcPlot.js +89 -2
  178. package/modern/PieChart/PieChart.js +4 -4
  179. package/modern/PieChart/PiePlot.js +20 -15
  180. package/modern/PieChart/index.js +6 -4
  181. package/modern/ResponsiveChartContainer/index.js +2 -2
  182. package/modern/ScatterChart/Scatter.js +1 -1
  183. package/modern/ScatterChart/index.js +3 -3
  184. package/modern/context/CartesianContextProvider.js +2 -2
  185. package/modern/context/SeriesContextProvider.js +1 -1
  186. package/modern/index.js +2 -1
  187. package/modern/internals/defaultizeValueFormatter.js +3 -3
  188. package/modern/internals/getWordsByLines.js +14 -0
  189. package/modern/internals/utils.js +40 -0
  190. package/package.json +1 -1
@@ -9,6 +9,7 @@ import { CartesianContext } from '../context/CartesianContextProvider';
9
9
  import { LineElement } from './LineElement';
10
10
  import { getValueToPositionMapper } from '../hooks/useScale';
11
11
  import getCurveFactory from '../internals/getCurve';
12
+ import { DEFAULT_X_AXIS_KEY } from '../constants';
12
13
  import { jsx as _jsx } from "react/jsx-runtime";
13
14
  /**
14
15
  * Demos:
@@ -55,10 +56,10 @@ function LinePlot(props) {
55
56
  var xData = xAxis[xAxisKey].data;
56
57
  if (process.env.NODE_ENV !== 'production') {
57
58
  if (xData === undefined) {
58
- throw new Error("Axis of id \"".concat(xAxisKey, "\" should have data property to be able to display a line plot"));
59
+ throw new Error("MUI-X-Charts: ".concat(xAxisKey === DEFAULT_X_AXIS_KEY ? 'The first `xAxis`' : "The x-axis with id \"".concat(xAxisKey, "\""), " should have data property to be able to display a line plot"));
59
60
  }
60
61
  if (xData.length < stackedData.length) {
61
- throw new Error("MUI: data length of the x axis (".concat(xData.length, " items) is lower than the length of series (").concat(stackedData.length, " items)"));
62
+ throw new Error("MUI-X-Charts: The data length of the x axis (".concat(xData.length, " items) is lower than the length of series (").concat(stackedData.length, " items)"));
62
63
  }
63
64
  }
64
65
  var linePath = d3Line().x(function (d) {
@@ -8,6 +8,7 @@ import { SeriesContext } from '../context/SeriesContextProvider';
8
8
  import { CartesianContext } from '../context/CartesianContextProvider';
9
9
  import { MarkElement } from './MarkElement';
10
10
  import { getValueToPositionMapper } from '../hooks/useScale';
11
+ import { DEFAULT_X_AXIS_KEY } from '../constants';
11
12
  import { jsx as _jsx } from "react/jsx-runtime";
12
13
  /**
13
14
  * Demos:
@@ -71,7 +72,7 @@ function MarkPlot(props) {
71
72
  return true;
72
73
  };
73
74
  if (xData === undefined) {
74
- throw new Error("Axis of id \"".concat(xAxisKey, "\" should have data property to be able to display a line plot"));
75
+ throw new Error("MUI-X-Charts: ".concat(xAxisKey === DEFAULT_X_AXIS_KEY ? 'The first `xAxis`' : "The x-axis with id \"".concat(xAxisKey, "\""), " should have data property to be able to display a line plot"));
75
76
  }
76
77
  return xData == null ? void 0 : xData.map(function (x, index) {
77
78
  var value = data[index] == null ? null : stackedData[index][1];
@@ -7,6 +7,21 @@ export var getExtremumX = function getExtremumX(params) {
7
7
  var maxX = Math.max.apply(Math, _toConsumableArray((_axis$data2 = axis.data) != null ? _axis$data2 : []));
8
8
  return [minX, maxX];
9
9
  };
10
+ function getSeriesExtremums(getValues, stackedData) {
11
+ if (stackedData.length === 0) {
12
+ return [null, null];
13
+ }
14
+ return stackedData.reduce(function (seriesAcc, stackedValue) {
15
+ var _getValues = getValues(stackedValue),
16
+ _getValues2 = _slicedToArray(_getValues, 2),
17
+ base = _getValues2[0],
18
+ value = _getValues2[1];
19
+ if (seriesAcc[0] === null) {
20
+ return [Math.min(base, value), Math.max(base, value)];
21
+ }
22
+ return [Math.min(base, value, seriesAcc[0]), Math.max(base, value, seriesAcc[1])];
23
+ }, getValues(stackedData[0]));
24
+ }
10
25
  export var getExtremumY = function getExtremumY(params) {
11
26
  var series = params.series,
12
27
  axis = params.axis,
@@ -14,26 +29,26 @@ export var getExtremumY = function getExtremumY(params) {
14
29
  return Object.keys(series).filter(function (seriesId) {
15
30
  return series[seriesId].yAxisKey === axis.id || isDefaultAxis && series[seriesId].yAxisKey === undefined;
16
31
  }).reduce(function (acc, seriesId) {
17
- var isArea = series[seriesId].area !== undefined;
32
+ var _series$seriesId = series[seriesId],
33
+ area = _series$seriesId.area,
34
+ stackedData = _series$seriesId.stackedData;
35
+ var isArea = area !== undefined;
18
36
  var getValues = isArea ? function (d) {
19
37
  return d;
20
38
  } : function (d) {
21
39
  return [d[1], d[1]];
22
- }; // Id area should go from bottom to top, without area should only consider the top
40
+ }; // Since this series is not used to display an area, we do not consider the base (the d[0]).
23
41
 
24
- var _series$seriesId$stac = series[seriesId].stackedData.reduce(function (seriesAcc, stackedValue) {
25
- var _getValues = getValues(stackedValue),
26
- _getValues2 = _slicedToArray(_getValues, 2),
27
- base = _getValues2[0],
28
- value = _getValues2[1];
29
- return [Math.min(base, value, seriesAcc[0]), Math.max(base, value, seriesAcc[1])];
30
- }, getValues(series[seriesId].stackedData[0])),
31
- _series$seriesId$stac2 = _slicedToArray(_series$seriesId$stac, 2),
32
- seriesMin = _series$seriesId$stac2[0],
33
- seriesMax = _series$seriesId$stac2[1];
34
- if (acc[0] === null || acc[1] === null) {
35
- return [seriesMin, seriesMax];
42
+ var seriesExtremums = getSeriesExtremums(getValues, stackedData);
43
+ if (acc[0] === null) {
44
+ return seriesExtremums;
45
+ }
46
+ if (seriesExtremums[0] === null) {
47
+ return acc;
36
48
  }
49
+ var _seriesExtremums = _slicedToArray(seriesExtremums, 2),
50
+ seriesMin = _seriesExtremums[0],
51
+ seriesMax = _seriesExtremums[1];
37
52
  return [Math.min(seriesMin, acc[0]), Math.max(seriesMax, acc[1])];
38
53
  }, [null, null]);
39
54
  };
@@ -4,14 +4,17 @@ import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
4
4
  import { stack as d3Stack } from 'd3-shape';
5
5
  import { getStackingGroups } from '../internals/stackSeries';
6
6
  import defaultizeValueFormatter from '../internals/defaultizeValueFormatter';
7
+ var warnedOnce = false;
8
+
7
9
  // For now it's a copy past of bar charts formatter, but maybe will diverge later
8
10
  var formatter = function formatter(params, dataset) {
11
+ var _ref;
9
12
  var seriesOrder = params.seriesOrder,
10
13
  series = params.series;
11
14
  var stackingGroups = getStackingGroups(params);
12
15
 
13
16
  // Create a data set with format adapted to d3
14
- var d3Dataset = dataset != null ? dataset : [];
17
+ var d3Dataset = (_ref = dataset) != null ? _ref : [];
15
18
  seriesOrder.forEach(function (id) {
16
19
  var data = series[id].data;
17
20
  if (data !== undefined) {
@@ -23,7 +26,7 @@ var formatter = function formatter(params, dataset) {
23
26
  }
24
27
  });
25
28
  } else if (dataset === undefined && process.env.NODE_ENV !== 'production') {
26
- throw new Error(["MUI: line series with id='".concat(id, "' has no data."), 'Either provide a data property to the series or use the dataset prop.'].join('\n'));
29
+ throw new Error(["MUI-X-Charts: line series with id='".concat(id, "' has no data."), 'Either provide a data property to the series or use the dataset prop.'].join('\n'));
27
30
  }
28
31
  });
29
32
  var completedSeries = {};
@@ -44,13 +47,21 @@ var formatter = function formatter(params, dataset) {
44
47
  ids.forEach(function (id, index) {
45
48
  var dataKey = series[id].dataKey;
46
49
  completedSeries[id] = _extends({}, series[id], {
47
- data: dataKey ? dataset.map(function (d) {
48
- return d[dataKey];
50
+ data: dataKey ? dataset.map(function (data) {
51
+ var value = data[dataKey];
52
+ if (typeof value !== 'number') {
53
+ if (process.env.NODE_ENV !== 'production' && !warnedOnce && value !== null) {
54
+ warnedOnce = true;
55
+ console.error(["MUI-X charts: your dataset key \"".concat(dataKey, "\" is used for plotting line, but contains nonnumerical elements."), 'Line plots only support numbers and null values.']);
56
+ }
57
+ return 0;
58
+ }
59
+ return value;
49
60
  }) : series[id].data,
50
- stackedData: stackedSeries[index].map(function (_ref) {
51
- var _ref2 = _slicedToArray(_ref, 2),
52
- a = _ref2[0],
53
- b = _ref2[1];
61
+ stackedData: stackedSeries[index].map(function (_ref2) {
62
+ var _ref3 = _slicedToArray(_ref2, 2),
63
+ a = _ref3[0],
64
+ b = _ref3[1];
54
65
  return [a, b];
55
66
  })
56
67
  });
@@ -1,8 +1,8 @@
1
- export { LinePlot } from './LinePlot';
2
- export { AreaPlot } from './AreaPlot';
3
- export { MarkPlot } from './MarkPlot';
4
- export { LineHighlightPlot } from './LineHighlightPlot';
5
- export { LineChart } from './LineChart';
1
+ export * from './LineChart';
2
+ export * from './LinePlot';
3
+ export * from './AreaPlot';
4
+ export * from './MarkPlot';
5
+ export * from './LineHighlightPlot';
6
6
  export * from './AreaElement';
7
7
  export * from './LineElement';
8
8
  export * from './MarkElement';
@@ -3,6 +3,7 @@ import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutPr
3
3
  var _excluded = ["slots", "slotProps", "innerRadius", "outerRadius", "cornerRadius", "paddingAngle", "id", "highlightScope", "highlighted", "faded", "data", "arcLabel", "arcLabelMinAngle", "skipAnimation"],
4
4
  _excluded2 = ["startAngle", "endAngle", "paddingAngle", "innerRadius", "outerRadius", "cornerRadius"];
5
5
  import * as React from 'react';
6
+ import PropTypes from 'prop-types';
6
7
  import { useTransition } from '@react-spring/web';
7
8
  import { defaultLabelTransitionConfig } from './dataTransform/transition';
8
9
  import { useTransformData } from './dataTransform/useTransformData';
@@ -23,7 +24,7 @@ function getItemLabel(arcLabel, arcLabelMinAngle, item) {
23
24
  }
24
25
  return arcLabel(item);
25
26
  }
26
- export function PieArcLabelPlot(props) {
27
+ function PieArcLabelPlot(props) {
27
28
  var _slots$pieArcLabel;
28
29
  var slots = props.slots,
29
30
  slotProps = props.slotProps,
@@ -90,4 +91,91 @@ export function PieArcLabelPlot(props) {
90
91
  }, slotProps == null ? void 0 : slotProps.pieArcLabel));
91
92
  })
92
93
  }));
93
- }
94
+ }
95
+ process.env.NODE_ENV !== "production" ? PieArcLabelPlot.propTypes = {
96
+ // ----------------------------- Warning --------------------------------
97
+ // | These PropTypes are generated from the TypeScript type definitions |
98
+ // | To update them edit the TypeScript types and run "yarn proptypes" |
99
+ // ----------------------------------------------------------------------
100
+ /**
101
+ * The label displayed into the arc.
102
+ */
103
+ arcLabel: PropTypes.oneOfType([PropTypes.oneOf(['formattedValue', 'label', 'value']), PropTypes.func]),
104
+ /**
105
+ * The minimal angle required to display the arc label.
106
+ */
107
+ arcLabelMinAngle: PropTypes.number,
108
+ /**
109
+ * The radius applied to arc corners (similar to border radius).
110
+ * @default 0
111
+ */
112
+ cornerRadius: PropTypes.number,
113
+ data: PropTypes.arrayOf(PropTypes.shape({
114
+ color: PropTypes.string.isRequired,
115
+ endAngle: PropTypes.number.isRequired,
116
+ formattedValue: PropTypes.string.isRequired,
117
+ id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,
118
+ index: PropTypes.number.isRequired,
119
+ label: PropTypes.string,
120
+ padAngle: PropTypes.number.isRequired,
121
+ startAngle: PropTypes.number.isRequired,
122
+ value: PropTypes.number.isRequired
123
+ })).isRequired,
124
+ /**
125
+ * Override the arc attibutes when it is faded.
126
+ */
127
+ faded: PropTypes.shape({
128
+ additionalRadius: PropTypes.number,
129
+ color: PropTypes.string,
130
+ cornerRadius: PropTypes.number,
131
+ innerRadius: PropTypes.number,
132
+ outerRadius: PropTypes.number,
133
+ paddingAngle: PropTypes.number
134
+ }),
135
+ /**
136
+ * Override the arc attibutes when it is highlighted.
137
+ */
138
+ highlighted: PropTypes.shape({
139
+ additionalRadius: PropTypes.number,
140
+ color: PropTypes.string,
141
+ cornerRadius: PropTypes.number,
142
+ innerRadius: PropTypes.number,
143
+ outerRadius: PropTypes.number,
144
+ paddingAngle: PropTypes.number
145
+ }),
146
+ highlightScope: PropTypes.shape({
147
+ faded: PropTypes.oneOf(['global', 'none', 'series']),
148
+ highlighted: PropTypes.oneOf(['item', 'none', 'series'])
149
+ }),
150
+ id: PropTypes.string.isRequired,
151
+ /**
152
+ * The radius between circle center and the begining of the arc.
153
+ * @default 0
154
+ */
155
+ innerRadius: PropTypes.number,
156
+ /**
157
+ * The radius between circle center and the end of the arc.
158
+ */
159
+ outerRadius: PropTypes.number.isRequired,
160
+ /**
161
+ * The padding angle (deg) between two arcs.
162
+ * @default 0
163
+ */
164
+ paddingAngle: PropTypes.number,
165
+ /**
166
+ * If `true`, animations are skiped.
167
+ * @default false
168
+ */
169
+ skipAnimation: PropTypes.bool,
170
+ /**
171
+ * The props used for each component slot.
172
+ * @default {}
173
+ */
174
+ slotProps: PropTypes.object,
175
+ /**
176
+ * Overridable component slots.
177
+ * @default {}
178
+ */
179
+ slots: PropTypes.object
180
+ } : void 0;
181
+ export { PieArcLabelPlot };
@@ -3,12 +3,13 @@ import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutPr
3
3
  var _excluded = ["slots", "slotProps", "innerRadius", "outerRadius", "cornerRadius", "paddingAngle", "id", "highlightScope", "highlighted", "faded", "data", "onClick", "skipAnimation"],
4
4
  _excluded2 = ["startAngle", "endAngle", "paddingAngle", "innerRadius", "outerRadius", "cornerRadius"];
5
5
  import * as React from 'react';
6
+ import PropTypes from 'prop-types';
6
7
  import { useTransition } from '@react-spring/web';
7
8
  import { PieArc } from './PieArc';
8
9
  import { defaultTransitionConfig } from './dataTransform/transition';
9
10
  import { useTransformData } from './dataTransform/useTransformData';
10
11
  import { jsx as _jsx } from "react/jsx-runtime";
11
- export function PieArcPlot(props) {
12
+ function PieArcPlot(props) {
12
13
  var _slots$pieArc;
13
14
  var slots = props.slots,
14
15
  slotProps = props.slotProps,
@@ -81,4 +82,90 @@ export function PieArcPlot(props) {
81
82
  }, slotProps == null ? void 0 : slotProps.pieArc));
82
83
  })
83
84
  }));
84
- }
85
+ }
86
+ process.env.NODE_ENV !== "production" ? PieArcPlot.propTypes = {
87
+ // ----------------------------- Warning --------------------------------
88
+ // | These PropTypes are generated from the TypeScript type definitions |
89
+ // | To update them edit the TypeScript types and run "yarn proptypes" |
90
+ // ----------------------------------------------------------------------
91
+ /**
92
+ * The radius applied to arc corners (similar to border radius).
93
+ * @default 0
94
+ */
95
+ cornerRadius: PropTypes.number,
96
+ data: PropTypes.arrayOf(PropTypes.shape({
97
+ color: PropTypes.string.isRequired,
98
+ endAngle: PropTypes.number.isRequired,
99
+ formattedValue: PropTypes.string.isRequired,
100
+ id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,
101
+ index: PropTypes.number.isRequired,
102
+ label: PropTypes.string,
103
+ padAngle: PropTypes.number.isRequired,
104
+ startAngle: PropTypes.number.isRequired,
105
+ value: PropTypes.number.isRequired
106
+ })).isRequired,
107
+ /**
108
+ * Override the arc attibutes when it is faded.
109
+ */
110
+ faded: PropTypes.shape({
111
+ additionalRadius: PropTypes.number,
112
+ color: PropTypes.string,
113
+ cornerRadius: PropTypes.number,
114
+ innerRadius: PropTypes.number,
115
+ outerRadius: PropTypes.number,
116
+ paddingAngle: PropTypes.number
117
+ }),
118
+ /**
119
+ * Override the arc attibutes when it is highlighted.
120
+ */
121
+ highlighted: PropTypes.shape({
122
+ additionalRadius: PropTypes.number,
123
+ color: PropTypes.string,
124
+ cornerRadius: PropTypes.number,
125
+ innerRadius: PropTypes.number,
126
+ outerRadius: PropTypes.number,
127
+ paddingAngle: PropTypes.number
128
+ }),
129
+ highlightScope: PropTypes.shape({
130
+ faded: PropTypes.oneOf(['global', 'none', 'series']),
131
+ highlighted: PropTypes.oneOf(['item', 'none', 'series'])
132
+ }),
133
+ id: PropTypes.string.isRequired,
134
+ /**
135
+ * The radius between circle center and the begining of the arc.
136
+ * @default 0
137
+ */
138
+ innerRadius: PropTypes.number,
139
+ /**
140
+ * Callback fired when a pie item is clicked.
141
+ * @param {React.MouseEvent<SVGPathElement, MouseEvent>} event The event source of the callback.
142
+ * @param {PieItemIdentifier} pieItemIdentifier The pie item identifier.
143
+ * @param {DefaultizedPieValueType} item The pie item.
144
+ */
145
+ onClick: PropTypes.func,
146
+ /**
147
+ * The radius between circle center and the end of the arc.
148
+ */
149
+ outerRadius: PropTypes.number.isRequired,
150
+ /**
151
+ * The padding angle (deg) between two arcs.
152
+ * @default 0
153
+ */
154
+ paddingAngle: PropTypes.number,
155
+ /**
156
+ * If `true`, animations are skiped.
157
+ * @default false
158
+ */
159
+ skipAnimation: PropTypes.bool,
160
+ /**
161
+ * The props used for each component slot.
162
+ * @default {}
163
+ */
164
+ slotProps: PropTypes.object,
165
+ /**
166
+ * Overridable component slots.
167
+ * @default {}
168
+ */
169
+ slots: PropTypes.object
170
+ } : void 0;
171
+ export { PieArcPlot };
@@ -252,8 +252,8 @@ process.env.NODE_ENV !== "production" ? PieChart.propTypes = {
252
252
  arcLabelMinAngle: PropTypes.number,
253
253
  color: PropTypes.string,
254
254
  cornerRadius: PropTypes.number,
255
- cx: PropTypes.number,
256
- cy: PropTypes.number,
255
+ cx: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
256
+ cy: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
257
257
  data: PropTypes.arrayOf(PropTypes.shape({
258
258
  color: PropTypes.string,
259
259
  id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
@@ -282,8 +282,8 @@ process.env.NODE_ENV !== "production" ? PieChart.propTypes = {
282
282
  highlighted: PropTypes.oneOf(['item', 'none', 'series'])
283
283
  }),
284
284
  id: PropTypes.string,
285
- innerRadius: PropTypes.number,
286
- outerRadius: PropTypes.number,
285
+ innerRadius: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
286
+ outerRadius: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
287
287
  paddingAngle: PropTypes.number,
288
288
  sortingValues: PropTypes.oneOfType([PropTypes.oneOf(['asc', 'desc', 'none']), PropTypes.func]),
289
289
  startAngle: PropTypes.number,
@@ -4,6 +4,7 @@ import { SeriesContext } from '../context/SeriesContextProvider';
4
4
  import { DrawingContext } from '../context/DrawingProvider';
5
5
  import { PieArcPlot } from './PieArcPlot';
6
6
  import { PieArcLabelPlot } from './PieArcLabelPlot';
7
+ import { getPercentageValue } from '../internals/utils';
7
8
  import { jsx as _jsx } from "react/jsx-runtime";
8
9
  import { jsxs as _jsxs } from "react/jsx-runtime";
9
10
  /**
@@ -31,30 +32,30 @@ function PiePlot(props) {
31
32
  return null;
32
33
  }
33
34
  var availableRadius = Math.min(width, height) / 2;
34
- var center = {
35
- x: left + width / 2,
36
- y: top + height / 2
37
- };
38
35
  var series = seriesData.series,
39
36
  seriesOrder = seriesData.seriesOrder;
40
37
  return /*#__PURE__*/_jsxs("g", {
41
38
  children: [seriesOrder.map(function (seriesId) {
42
39
  var _series$seriesId = series[seriesId],
43
- innerRadius = _series$seriesId.innerRadius,
44
- outerRadius = _series$seriesId.outerRadius,
40
+ innerRadiusParam = _series$seriesId.innerRadius,
41
+ outerRadiusParam = _series$seriesId.outerRadius,
45
42
  cornerRadius = _series$seriesId.cornerRadius,
46
43
  paddingAngle = _series$seriesId.paddingAngle,
47
44
  data = _series$seriesId.data,
48
- cx = _series$seriesId.cx,
49
- cy = _series$seriesId.cy,
45
+ cxParam = _series$seriesId.cx,
46
+ cyParam = _series$seriesId.cy,
50
47
  highlighted = _series$seriesId.highlighted,
51
48
  faded = _series$seriesId.faded,
52
49
  highlightScope = _series$seriesId.highlightScope;
50
+ var outerRadius = getPercentageValue(outerRadiusParam != null ? outerRadiusParam : availableRadius, availableRadius);
51
+ var innerRadius = getPercentageValue(innerRadiusParam != null ? innerRadiusParam : 0, availableRadius);
52
+ var cx = getPercentageValue(cxParam != null ? cxParam : '50%', width);
53
+ var cy = getPercentageValue(cyParam != null ? cyParam : '50%', height);
53
54
  return /*#__PURE__*/_jsx("g", {
54
- transform: "translate(".concat(cx === undefined ? center.x : left + cx, ", ").concat(cy === undefined ? center.y : top + cy, ")"),
55
+ transform: "translate(".concat(left + cx, ", ").concat(top + cy, ")"),
55
56
  children: /*#__PURE__*/_jsx(PieArcPlot, {
56
57
  innerRadius: innerRadius,
57
- outerRadius: outerRadius != null ? outerRadius : availableRadius,
58
+ outerRadius: outerRadius,
58
59
  cornerRadius: cornerRadius,
59
60
  paddingAngle: paddingAngle,
60
61
  id: seriesId,
@@ -70,18 +71,22 @@ function PiePlot(props) {
70
71
  }, seriesId);
71
72
  }), seriesOrder.map(function (seriesId) {
72
73
  var _series$seriesId2 = series[seriesId],
73
- innerRadius = _series$seriesId2.innerRadius,
74
- outerRadius = _series$seriesId2.outerRadius,
74
+ innerRadiusParam = _series$seriesId2.innerRadius,
75
+ outerRadiusParam = _series$seriesId2.outerRadius,
75
76
  cornerRadius = _series$seriesId2.cornerRadius,
76
77
  paddingAngle = _series$seriesId2.paddingAngle,
77
78
  arcLabel = _series$seriesId2.arcLabel,
78
79
  arcLabelMinAngle = _series$seriesId2.arcLabelMinAngle,
79
80
  data = _series$seriesId2.data,
80
- cx = _series$seriesId2.cx,
81
- cy = _series$seriesId2.cy,
81
+ cxParam = _series$seriesId2.cx,
82
+ cyParam = _series$seriesId2.cy,
82
83
  highlightScope = _series$seriesId2.highlightScope;
84
+ var outerRadius = getPercentageValue(outerRadiusParam != null ? outerRadiusParam : availableRadius, availableRadius);
85
+ var innerRadius = getPercentageValue(innerRadiusParam != null ? innerRadiusParam : 0, availableRadius);
86
+ var cx = getPercentageValue(cxParam != null ? cxParam : '50%', width);
87
+ var cy = getPercentageValue(cyParam != null ? cyParam : '50%', height);
83
88
  return /*#__PURE__*/_jsx("g", {
84
- transform: "translate(".concat(cx === undefined ? center.x : left + cx, ", ").concat(cy === undefined ? center.y : top + cy, ")"),
89
+ transform: "translate(".concat(left + cx, ", ").concat(top + cy, ")"),
85
90
  children: /*#__PURE__*/_jsx(PieArcLabelPlot, {
86
91
  innerRadius: innerRadius,
87
92
  outerRadius: outerRadius != null ? outerRadius : availableRadius,
@@ -1,4 +1,6 @@
1
- export { PiePlot } from './PiePlot';
2
- export { PieChart } from './PieChart';
3
- export { PieArcLabel, getPieArcLabelUtilityClass, pieArcLabelClasses } from './PieArcLabel';
4
- export { PieArc, getPieArcUtilityClass, pieArcClasses } from './PieArc';
1
+ export * from './PieChart';
2
+ export * from './PiePlot';
3
+ export * from './PieArcPlot';
4
+ export * from './PieArcLabelPlot';
5
+ export * from './PieArc';
6
+ export * from './PieArcLabel';
@@ -67,11 +67,11 @@ var useChartDimensions = function useChartDimensions(inWidth, inHeight) {
67
67
  }, [computeSize, inHeight, inWidth]);
68
68
  if (process.env.NODE_ENV !== 'production') {
69
69
  if (displayError.current && inWidth === undefined && width === 0) {
70
- console.error("MUI: Charts does not have `width` prop, and its container has no `width` defined.");
70
+ console.error("MUI-X-Charts: ChartContainer does not have `width` prop, and its container has no `width` defined.");
71
71
  displayError.current = false;
72
72
  }
73
73
  if (displayError.current && inHeight === undefined && height === 0) {
74
- console.error("MUI: Charts does not have `height` prop, and its container has no `height` defined.");
74
+ console.error("MUI-X-Charts: ChartContainer does not have `height` prop, and its container has no `height` defined.");
75
75
  displayError.current = false;
76
76
  }
77
77
  }
@@ -78,7 +78,7 @@ process.env.NODE_ENV !== "production" ? Scatter.propTypes = {
78
78
  color: PropTypes.string.isRequired,
79
79
  markerSize: PropTypes.number.isRequired,
80
80
  series: PropTypes.shape({
81
- color: PropTypes.string,
81
+ color: PropTypes.string.isRequired,
82
82
  data: PropTypes.arrayOf(PropTypes.shape({
83
83
  id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,
84
84
  x: PropTypes.number.isRequired,
@@ -1,3 +1,3 @@
1
- export { ScatterPlot } from './ScatterPlot';
2
- export { ScatterChart } from './ScatterChart';
3
- export { Scatter } from './Scatter';
1
+ export * from './ScatterChart';
2
+ export * from './ScatterPlot';
3
+ export * from './Scatter';
@@ -54,7 +54,7 @@ function CartesianContextProvider(_ref) {
54
54
  return axisConfig;
55
55
  }
56
56
  if (dataset === undefined) {
57
- throw Error('MUI: x-axis uses `dataKey` but no `dataset` is provided.');
57
+ throw Error('MUI-X-Charts: x-axis uses `dataKey` but no `dataset` is provided.');
58
58
  }
59
59
  return _extends({}, axisConfig, {
60
60
  data: dataset.map(function (d) {
@@ -70,7 +70,7 @@ function CartesianContextProvider(_ref) {
70
70
  return axisConfig;
71
71
  }
72
72
  if (dataset === undefined) {
73
- throw Error('MUI: y-axis uses `dataKey` but no `dataset` is provided.');
73
+ throw Error('MUI-X-Charts: y-axis uses `dataKey` but no `dataset` is provided.');
74
74
  }
75
75
  return _extends({}, axisConfig, {
76
76
  data: dataset.map(function (d) {
@@ -39,7 +39,7 @@ var formatSeries = function formatSeries(series, colors, dataset) {
39
39
  };
40
40
  }
41
41
  if (((_seriesGroups$type = seriesGroups[type]) == null ? void 0 : _seriesGroups$type.series[id]) !== undefined) {
42
- throw new Error("MUI: series' id \"".concat(id, "\" is not unique"));
42
+ throw new Error("MUI-X-Charts: series' id \"".concat(id, "\" is not unique"));
43
43
  }
44
44
  seriesGroups[type].series[id] = _extends({
45
45
  id: id
package/legacy/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @mui/x-charts v6.18.2
2
+ * @mui/x-charts v6.18.4
3
3
  *
4
4
  * @license MIT
5
5
  * This source code is licensed under the MIT license found in the
@@ -15,6 +15,7 @@ export * from './ChartsReferenceLine';
15
15
  export * from './ChartsAxis';
16
16
  export * from './ChartsXAxis';
17
17
  export * from './ChartsYAxis';
18
+ export * from './ChartsText';
18
19
  export * from './ChartsTooltip';
19
20
  export * from './ChartsAxisHighlight';
20
21
  export * from './BarChart';
@@ -2,9 +2,10 @@ import _extends from "@babel/runtime/helpers/esm/extends";
2
2
  function defaultizeValueFormatter(series, defaultValueFormatter) {
3
3
  var defaultizedSeries = {};
4
4
  Object.keys(series).forEach(function (seriesId) {
5
- defaultizedSeries[seriesId] = _extends({
6
- valueFormatter: defaultValueFormatter
7
- }, series[seriesId]);
5
+ var _series$seriesId$valu;
6
+ defaultizedSeries[seriesId] = _extends({}, series[seriesId], {
7
+ valueFormatter: (_series$seriesId$valu = series[seriesId].valueFormatter) != null ? _series$seriesId$valu : defaultValueFormatter
8
+ });
8
9
  });
9
10
  return defaultizedSeries;
10
11
  }
@@ -0,0 +1,15 @@
1
+ import _extends from "@babel/runtime/helpers/esm/extends";
2
+ import { getStringSize } from './domUtils';
3
+ export function getWordsByLines(_ref) {
4
+ var style = _ref.style,
5
+ needsComputation = _ref.needsComputation,
6
+ text = _ref.text;
7
+ return text.split('\n').map(function (subText) {
8
+ return _extends({
9
+ text: subText
10
+ }, needsComputation ? getStringSize(subText, style) : {
11
+ width: 0,
12
+ height: 0
13
+ });
14
+ });
15
+ }
@@ -2,4 +2,44 @@
2
2
  export function getSymbol(shape) {
3
3
  var symbolNames = 'circle cross diamond square star triangle wye'.split(/ /);
4
4
  return symbolNames.indexOf(shape) || 0;
5
+ }
6
+ /**
7
+ * Transform mouse event position to corrdinates inside the SVG.
8
+ * @param svg The SVG element
9
+ * @param event The mouseEvent to transform
10
+ */
11
+ export function getSVGPoint(svg, event) {
12
+ var pt = svg.createSVGPoint();
13
+ pt.x = event.clientX;
14
+ pt.y = event.clientY;
15
+ return pt.matrixTransform(svg.getScreenCTM().inverse());
16
+ }
17
+
18
+ /**
19
+ * Helper that converts values and percentages into values.
20
+ * @param value The value provided by the developer. Can either be a number or a string with '%' or 'px'.
21
+ * @param refValue The numerical value associated to 100%.
22
+ * @returns The numerical value associated to the provided value.
23
+ */
24
+ export function getPercentageValue(value, refValue) {
25
+ if (typeof value === 'number') {
26
+ return value;
27
+ }
28
+ if (value === '100%') {
29
+ // Avoid potential rounding issues
30
+ return refValue;
31
+ }
32
+ if (value.endsWith('%')) {
33
+ var percentage = Number.parseFloat(value.slice(0, value.length - 1));
34
+ if (!Number.isNaN(percentage)) {
35
+ return percentage * refValue / 100;
36
+ }
37
+ }
38
+ if (value.endsWith('px')) {
39
+ var val = Number.parseFloat(value.slice(0, value.length - 2));
40
+ if (!Number.isNaN(val)) {
41
+ return val;
42
+ }
43
+ }
44
+ throw Error("MUI-Charts: Received an unknown value \"".concat(value, "\". It should be a number, or a string with a percentage value."));
5
45
  }