@mui/x-charts 7.0.0-alpha.7 → 7.0.0-alpha.8

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/BarChart.js +1 -0
  2. package/BarChart/BarElement.d.ts +37 -20
  3. package/BarChart/BarPlot.js +4 -4
  4. package/BarChart/formatter.js +1 -1
  5. package/CHANGELOG.md +175 -49
  6. package/ChartsAxis/ChartsAxis.js +4 -4
  7. package/ChartsReferenceLine/ChartsReferenceLine.js +9 -5
  8. package/ChartsSurface.d.ts +2 -2
  9. package/ChartsSurface.js +33 -1
  10. package/ChartsTooltip/ChartsTooltipTable.d.ts +1 -1
  11. package/ChartsTooltip/ChartsTooltipTable.js +2 -0
  12. package/LineChart/AreaPlot.js +2 -2
  13. package/LineChart/LineChart.d.ts +1 -0
  14. package/LineChart/LineChart.js +2 -0
  15. package/LineChart/LineHighlightPlot.js +1 -1
  16. package/LineChart/LinePlot.js +2 -2
  17. package/LineChart/MarkPlot.js +1 -1
  18. package/LineChart/formatter.js +1 -1
  19. package/PieChart/PieArcLabelPlot.d.ts +5 -0
  20. package/PieChart/PieArcLabelPlot.js +2 -0
  21. package/PieChart/PieArcPlot.d.ts +5 -0
  22. package/PieChart/PieArcPlot.js +1 -0
  23. package/PieChart/PieChart.d.ts +14 -2
  24. package/PieChart/PieChart.js +3 -2
  25. package/ResponsiveChartContainer/index.js +2 -2
  26. package/ScatterChart/ScatterChart.js +1 -0
  27. package/SparkLineChart/SparkLineChart.d.ts +15 -1
  28. package/SparkLineChart/SparkLineChart.js +8 -1
  29. package/context/CartesianContextProvider.d.ts +1 -1
  30. package/context/CartesianContextProvider.js +9 -8
  31. package/context/DrawingProvider.d.ts +1 -1
  32. package/context/DrawingProvider.js +8 -7
  33. package/context/HighlightProvider.d.ts +2 -2
  34. package/context/HighlightProvider.js +4 -3
  35. package/context/InteractionProvider.d.ts +2 -2
  36. package/context/InteractionProvider.js +4 -3
  37. package/context/SeriesContextProvider.d.ts +3 -1
  38. package/context/SeriesContextProvider.js +8 -7
  39. package/esm/BarChart/BarChart.js +1 -0
  40. package/esm/BarChart/BarPlot.js +4 -4
  41. package/esm/BarChart/formatter.js +1 -1
  42. package/esm/ChartsAxis/ChartsAxis.js +4 -4
  43. package/esm/ChartsReferenceLine/ChartsReferenceLine.js +9 -5
  44. package/esm/ChartsSurface.js +35 -2
  45. package/esm/ChartsTooltip/ChartsTooltipTable.js +2 -0
  46. package/esm/LineChart/AreaPlot.js +2 -2
  47. package/esm/LineChart/LineChart.js +2 -0
  48. package/esm/LineChart/LineHighlightPlot.js +1 -1
  49. package/esm/LineChart/LinePlot.js +2 -2
  50. package/esm/LineChart/MarkPlot.js +1 -1
  51. package/esm/LineChart/formatter.js +1 -1
  52. package/esm/PieChart/PieArcLabelPlot.js +2 -0
  53. package/esm/PieChart/PieArcPlot.js +1 -0
  54. package/esm/PieChart/PieChart.js +3 -2
  55. package/esm/ResponsiveChartContainer/index.js +2 -2
  56. package/esm/ScatterChart/ScatterChart.js +1 -0
  57. package/esm/SparkLineChart/SparkLineChart.js +8 -1
  58. package/esm/context/CartesianContextProvider.js +9 -8
  59. package/esm/context/DrawingProvider.js +8 -7
  60. package/esm/context/HighlightProvider.js +6 -4
  61. package/esm/context/InteractionProvider.js +6 -4
  62. package/esm/context/SeriesContextProvider.js +10 -8
  63. package/esm/index.js +1 -0
  64. package/esm/internals/domUtils.js +3 -1
  65. package/index.d.ts +1 -0
  66. package/index.js +12 -1
  67. package/internals/domUtils.js +3 -1
  68. package/legacy/BarChart/BarChart.js +1 -0
  69. package/legacy/BarChart/BarPlot.js +4 -4
  70. package/legacy/BarChart/formatter.js +1 -1
  71. package/legacy/ChartsAxis/ChartsAxis.js +4 -4
  72. package/legacy/ChartsReferenceLine/ChartsReferenceLine.js +7 -5
  73. package/legacy/ChartsSurface.js +35 -2
  74. package/legacy/ChartsTooltip/ChartsTooltipTable.js +2 -0
  75. package/legacy/LineChart/AreaPlot.js +2 -2
  76. package/legacy/LineChart/LineChart.js +2 -0
  77. package/legacy/LineChart/LineHighlightPlot.js +1 -1
  78. package/legacy/LineChart/LinePlot.js +2 -2
  79. package/legacy/LineChart/MarkPlot.js +1 -1
  80. package/legacy/LineChart/formatter.js +1 -1
  81. package/legacy/PieChart/PieArcLabelPlot.js +2 -0
  82. package/legacy/PieChart/PieArcPlot.js +1 -0
  83. package/legacy/PieChart/PieChart.js +3 -2
  84. package/legacy/ResponsiveChartContainer/index.js +2 -2
  85. package/legacy/ScatterChart/ScatterChart.js +1 -0
  86. package/legacy/SparkLineChart/SparkLineChart.js +8 -1
  87. package/legacy/context/CartesianContextProvider.js +17 -17
  88. package/legacy/context/DrawingProvider.js +6 -6
  89. package/legacy/context/HighlightProvider.js +4 -3
  90. package/legacy/context/InteractionProvider.js +4 -3
  91. package/legacy/context/SeriesContextProvider.js +9 -8
  92. package/legacy/index.js +2 -1
  93. package/legacy/internals/domUtils.js +3 -3
  94. package/models/seriesType/pie.d.ts +1 -0
  95. package/modern/BarChart/BarChart.js +1 -0
  96. package/modern/BarChart/BarPlot.js +4 -4
  97. package/modern/BarChart/formatter.js +1 -1
  98. package/modern/ChartsAxis/ChartsAxis.js +4 -4
  99. package/modern/ChartsReferenceLine/ChartsReferenceLine.js +9 -5
  100. package/modern/ChartsSurface.js +35 -2
  101. package/modern/ChartsTooltip/ChartsTooltipTable.js +2 -0
  102. package/modern/LineChart/AreaPlot.js +2 -2
  103. package/modern/LineChart/LineChart.js +2 -0
  104. package/modern/LineChart/LineHighlightPlot.js +1 -1
  105. package/modern/LineChart/LinePlot.js +2 -2
  106. package/modern/LineChart/MarkPlot.js +1 -1
  107. package/modern/LineChart/formatter.js +1 -1
  108. package/modern/PieChart/PieArcLabelPlot.js +2 -0
  109. package/modern/PieChart/PieArcPlot.js +1 -0
  110. package/modern/PieChart/PieChart.js +3 -2
  111. package/modern/ResponsiveChartContainer/index.js +2 -2
  112. package/modern/ScatterChart/ScatterChart.js +1 -0
  113. package/modern/SparkLineChart/SparkLineChart.js +8 -1
  114. package/modern/context/CartesianContextProvider.js +9 -8
  115. package/modern/context/DrawingProvider.js +8 -7
  116. package/modern/context/HighlightProvider.js +6 -4
  117. package/modern/context/InteractionProvider.js +6 -4
  118. package/modern/context/SeriesContextProvider.js +10 -8
  119. package/modern/index.js +2 -1
  120. package/modern/internals/domUtils.js +3 -1
  121. package/package.json +1 -1
@@ -2,6 +2,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
2
2
  import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
3
3
  var _excluded = ["children", "width", "height", "viewBox", "disableAxisListener", "className"];
4
4
  import { styled } from '@mui/material/styles';
5
+ import PropTypes from 'prop-types';
5
6
  import * as React from 'react';
6
7
  import { useAxisEvents } from './hooks/useAxisEvents';
7
8
  import { jsx as _jsx } from "react/jsx-runtime";
@@ -12,7 +13,7 @@ var ChartChartsSurfaceStyles = styled('svg', {
12
13
  })(function () {
13
14
  return {};
14
15
  });
15
- export var ChartsSurface = /*#__PURE__*/React.forwardRef(function ChartsSurface(props, ref) {
16
+ var ChartsSurface = /*#__PURE__*/React.forwardRef(function ChartsSurface(props, ref) {
16
17
  var children = props.children,
17
18
  width = props.width,
18
19
  height = props.height,
@@ -40,4 +41,36 @@ export var ChartsSurface = /*#__PURE__*/React.forwardRef(function ChartsSurface(
40
41
  children: props.desc
41
42
  }), children]
42
43
  }));
43
- });
44
+ });
45
+ process.env.NODE_ENV !== "production" ? ChartsSurface.propTypes = {
46
+ // ----------------------------- Warning --------------------------------
47
+ // | These PropTypes are generated from the TypeScript type definitions |
48
+ // | To update them edit the TypeScript types and run "yarn proptypes" |
49
+ // ----------------------------------------------------------------------
50
+ children: PropTypes.node,
51
+ className: PropTypes.string,
52
+ desc: PropTypes.string,
53
+ /**
54
+ * If `true`, the charts will not listen to the mouse move event.
55
+ * It might break interactive features, but will improve performance.
56
+ * @default false
57
+ */
58
+ disableAxisListener: PropTypes.bool,
59
+ /**
60
+ * The height of the chart in px.
61
+ */
62
+ height: PropTypes.number.isRequired,
63
+ sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
64
+ title: PropTypes.string,
65
+ viewBox: PropTypes.shape({
66
+ height: PropTypes.number,
67
+ width: PropTypes.number,
68
+ x: PropTypes.number,
69
+ y: PropTypes.number
70
+ }),
71
+ /**
72
+ * The width of the chart in px.
73
+ */
74
+ width: PropTypes.number.isRequired
75
+ } : void 0;
76
+ export { ChartsSurface };
@@ -60,6 +60,8 @@ export var ChartsTooltipCell = styled('td', {
60
60
  paddingRight: theme.spacing(2)
61
61
  });
62
62
  });
63
+
64
+ // eslint-disable-next-line material-ui/no-styled-box
63
65
  export var ChartsTooltipMark = styled(Box, {
64
66
  name: 'MuiChartsTooltip',
65
67
  slot: 'Mark'
@@ -57,10 +57,10 @@ function AreaPlot(props) {
57
57
  var xData = xAxis[xAxisKey].data;
58
58
  if (process.env.NODE_ENV !== 'production') {
59
59
  if (xData === undefined) {
60
- 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."));
60
+ 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."));
61
61
  }
62
62
  if (xData.length < stackedData.length) {
63
- 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)"));
63
+ 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)."));
64
64
  }
65
65
  }
66
66
  var areaPath = d3Area().x(function (d) {
@@ -124,6 +124,7 @@ process.env.NODE_ENV !== "production" ? LineChart.propTypes = {
124
124
  * - 'none': display nothing.
125
125
  * - 'line': display a line at the current mouse position.
126
126
  * - 'band': display a band at the current mouse position. Only available with band scale.
127
+ * @default { x: 'line' }
127
128
  */
128
129
  axisHighlight: PropTypes.shape({
129
130
  x: PropTypes.oneOf(['band', 'line', 'none']),
@@ -160,6 +161,7 @@ process.env.NODE_ENV !== "production" ? LineChart.propTypes = {
160
161
  className: PropTypes.string,
161
162
  /**
162
163
  * Color palette used to colorize multiple series.
164
+ * @default blueberryTwilightPalette
163
165
  */
164
166
  colors: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string), PropTypes.func]),
165
167
  /**
@@ -64,7 +64,7 @@ function LineHighlightPlot(props) {
64
64
  var yScale = yAxis[yAxisKey].scale;
65
65
  var xData = xAxis[xAxisKey].data;
66
66
  if (xData === undefined) {
67
- 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."));
67
+ 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."));
68
68
  }
69
69
  var x = xScale(xData[highlightedIndex]);
70
70
  var y = yScale(stackedData[highlightedIndex][1]); // This should not be undefined since y should not be a band scale
@@ -56,10 +56,10 @@ function LinePlot(props) {
56
56
  var xData = xAxis[xAxisKey].data;
57
57
  if (process.env.NODE_ENV !== 'production') {
58
58
  if (xData === undefined) {
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
+ 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."));
60
60
  }
61
61
  if (xData.length < stackedData.length) {
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
+ 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)."));
63
63
  }
64
64
  }
65
65
  var linePath = d3Line().x(function (d) {
@@ -72,7 +72,7 @@ function MarkPlot(props) {
72
72
  return true;
73
73
  };
74
74
  if (xData === undefined) {
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
+ 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."));
76
76
  }
77
77
  return xData == null ? void 0 : xData.map(function (x, index) {
78
78
  var value = data[index] == null ? null : stackedData[index][1];
@@ -26,7 +26,7 @@ var formatter = function formatter(params, dataset) {
26
26
  }
27
27
  });
28
28
  } else if (dataset === undefined && process.env.NODE_ENV !== 'production') {
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'));
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'));
30
30
  }
31
31
  });
32
32
  var completedSeries = {};
@@ -106,6 +106,7 @@ process.env.NODE_ENV !== "production" ? PieArcLabelPlot.propTypes = {
106
106
  arcLabel: PropTypes.oneOfType([PropTypes.oneOf(['formattedValue', 'label', 'value']), PropTypes.func]),
107
107
  /**
108
108
  * The minimal angle required to display the arc label.
109
+ * @default 0
109
110
  */
110
111
  arcLabelMinAngle: PropTypes.number,
111
112
  /**
@@ -131,6 +132,7 @@ process.env.NODE_ENV !== "production" ? PieArcLabelPlot.propTypes = {
131
132
  })).isRequired,
132
133
  /**
133
134
  * Override the arc attibutes when it is faded.
135
+ * @default { additionalRadius: -5 }
134
136
  */
135
137
  faded: PropTypes.shape({
136
138
  additionalRadius: PropTypes.number,
@@ -112,6 +112,7 @@ process.env.NODE_ENV !== "production" ? PieArcPlot.propTypes = {
112
112
  })).isRequired,
113
113
  /**
114
114
  * Override the arc attibutes when it is faded.
115
+ * @default { additionalRadius: -5 }
115
116
  */
116
117
  faded: PropTypes.shape({
117
118
  additionalRadius: PropTypes.number,
@@ -120,7 +120,7 @@ process.env.NODE_ENV !== "production" ? PieChart.propTypes = {
120
120
  /**
121
121
  * Indicate which axis to display the bottom of the charts.
122
122
  * Can be a string (the id of the axis) or an object `ChartsXAxisProps`.
123
- * @default xAxisIds[0] The id of the first provided axis
123
+ * @default null
124
124
  */
125
125
  bottomAxis: PropTypes.oneOfType([PropTypes.shape({
126
126
  axisId: PropTypes.string,
@@ -148,6 +148,7 @@ process.env.NODE_ENV !== "production" ? PieChart.propTypes = {
148
148
  className: PropTypes.string,
149
149
  /**
150
150
  * Color palette used to colorize multiple series.
151
+ * @default blueberryTwilightPalette
151
152
  */
152
153
  colors: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string), PropTypes.func]),
153
154
  /**
@@ -169,7 +170,7 @@ process.env.NODE_ENV !== "production" ? PieChart.propTypes = {
169
170
  /**
170
171
  * Indicate which axis to display the left of the charts.
171
172
  * Can be a string (the id of the axis) or an object `ChartsYAxisProps`.
172
- * @default yAxisIds[0] The id of the first provided axis
173
+ * @default null
173
174
  */
174
175
  leftAxis: PropTypes.oneOfType([PropTypes.shape({
175
176
  axisId: PropTypes.string,
@@ -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-X-Charts: ChartContainer 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-X-Charts: ChartContainer 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
  }
@@ -118,6 +118,7 @@ process.env.NODE_ENV !== "production" ? ScatterChart.propTypes = {
118
118
  className: PropTypes.string,
119
119
  /**
120
120
  * Color palette used to colorize multiple series.
121
+ * @default blueberryTwilightPalette
121
122
  */
122
123
  colors: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string), PropTypes.func]),
123
124
  /**
@@ -126,6 +126,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
126
126
  className: PropTypes.string,
127
127
  /**
128
128
  * Color palette used to colorize multiple series.
129
+ * @default blueberryTwilightPalette
129
130
  */
130
131
  colors: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string), PropTypes.func]),
131
132
  /**
@@ -156,7 +157,12 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
156
157
  * The margin between the SVG and the drawing area.
157
158
  * It's used for leaving some space for extra information such as the x- and y-axis or legend.
158
159
  * Accepts an object with the optional properties: `top`, `bottom`, `left`, and `right`.
159
- * @default object Depends on the charts type.
160
+ * @default {
161
+ * top: 5,
162
+ * bottom: 5,
163
+ * left: 5,
164
+ * right: 5,
165
+ * }
160
166
  */
161
167
  margin: PropTypes.shape({
162
168
  bottom: PropTypes.number,
@@ -205,6 +211,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
205
211
  * Formatter used by the tooltip.
206
212
  * @param {number} value The value to format.
207
213
  * @returns {string} the formatted value.
214
+ * @default (v: number) => v.toString()
208
215
  */
209
216
  valueFormatter: PropTypes.func,
210
217
  viewBox: PropTypes.shape({
@@ -40,11 +40,11 @@ export var CartesianContext = /*#__PURE__*/React.createContext({
40
40
  *
41
41
  * - [CartesianContextProvider API](https://mui.com/x/api/charts/cartesian-context-provider/)
42
42
  */
43
- function CartesianContextProvider(_ref) {
44
- var inXAxis = _ref.xAxis,
45
- inYAxis = _ref.yAxis,
46
- dataset = _ref.dataset,
47
- children = _ref.children;
43
+ function CartesianContextProvider(props) {
44
+ var inXAxis = props.xAxis,
45
+ inYAxis = props.yAxis,
46
+ dataset = props.dataset,
47
+ children = props.children;
48
48
  var formattedSeries = React.useContext(SeriesContext);
49
49
  var drawingArea = React.useContext(DrawingContext);
50
50
  var xAxis = React.useMemo(function () {
@@ -54,7 +54,7 @@ function CartesianContextProvider(_ref) {
54
54
  return axisConfig;
55
55
  }
56
56
  if (dataset === undefined) {
57
- throw Error('MUI-X-Charts: 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-X-Charts: 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) {
@@ -82,9 +82,9 @@ function CartesianContextProvider(_ref) {
82
82
  var value = React.useMemo(function () {
83
83
  var _xAxis$map, _yAxis$map;
84
84
  var axisExtremumCallback = function axisExtremumCallback(acc, chartType, axis, getters, isDefaultAxis) {
85
- var _ref2, _formattedSeries$char;
85
+ var _ref, _formattedSeries$char;
86
86
  var getter = getters[chartType];
87
- var series = (_ref2 = (_formattedSeries$char = formattedSeries[chartType]) == null ? void 0 : _formattedSeries$char.series) != null ? _ref2 : {};
87
+ var series = (_ref = (_formattedSeries$char = formattedSeries[chartType]) == null ? void 0 : _formattedSeries$char.series) != null ? _ref : {};
88
88
  var _getter = getter({
89
89
  series: series,
90
90
  axis: axis,
@@ -114,8 +114,8 @@ function CartesianContextProvider(_ref) {
114
114
  return _extends({
115
115
  id: "deaultized-x-axis-".concat(index)
116
116
  }, axis);
117
- })) != null ? _xAxis$map : []), _toConsumableArray(xAxis === undefined || xAxis.findIndex(function (_ref3) {
118
- var id = _ref3.id;
117
+ })) != null ? _xAxis$map : []), _toConsumableArray(xAxis === undefined || xAxis.findIndex(function (_ref2) {
118
+ var id = _ref2.id;
119
119
  return id === DEFAULT_X_AXIS_KEY;
120
120
  }) === -1 ? [{
121
121
  id: DEFAULT_X_AXIS_KEY,
@@ -171,8 +171,8 @@ function CartesianContextProvider(_ref) {
171
171
  return _extends({
172
172
  id: "deaultized-y-axis-".concat(index)
173
173
  }, axis);
174
- })) != null ? _yAxis$map : []), _toConsumableArray(yAxis === undefined || yAxis.findIndex(function (_ref4) {
175
- var id = _ref4.id;
174
+ })) != null ? _yAxis$map : []), _toConsumableArray(yAxis === undefined || yAxis.findIndex(function (_ref3) {
175
+ var id = _ref3.id;
176
176
  return id === DEFAULT_Y_AXIS_KEY;
177
177
  }) === -1 ? [{
178
178
  id: DEFAULT_Y_AXIS_KEY,
@@ -226,12 +226,12 @@ function CartesianContextProvider(_ref) {
226
226
  return {
227
227
  xAxis: completedXAxis,
228
228
  yAxis: completedYAxis,
229
- xAxisIds: allXAxis.map(function (_ref5) {
230
- var id = _ref5.id;
229
+ xAxisIds: allXAxis.map(function (_ref4) {
230
+ var id = _ref4.id;
231
231
  return id;
232
232
  }),
233
- yAxisIds: allYAxis.map(function (_ref6) {
234
- var id = _ref6.id;
233
+ yAxisIds: allYAxis.map(function (_ref5) {
234
+ var id = _ref5.id;
235
235
  return id;
236
236
  })
237
237
  };
@@ -23,12 +23,12 @@ export var SVGContext = /*#__PURE__*/React.createContext({
23
23
  *
24
24
  * - [DrawingProvider API](https://mui.com/x/api/charts/drawing-provider/)
25
25
  */
26
- function DrawingProvider(_ref) {
27
- var width = _ref.width,
28
- height = _ref.height,
29
- margin = _ref.margin,
30
- svgRef = _ref.svgRef,
31
- children = _ref.children;
26
+ function DrawingProvider(props) {
27
+ var width = props.width,
28
+ height = props.height,
29
+ margin = props.margin,
30
+ svgRef = props.svgRef,
31
+ children = props.children;
32
32
  var drawingArea = useChartDimensions(width, height, margin);
33
33
  return /*#__PURE__*/_jsx(SVGContext.Provider, {
34
34
  value: svgRef,
@@ -34,8 +34,8 @@ var dataReducer = function dataReducer(prevState, action) {
34
34
  return prevState;
35
35
  }
36
36
  };
37
- export function HighlightProvider(_ref) {
38
- var children = _ref.children;
37
+ function HighlightProvider(props) {
38
+ var children = props.children;
39
39
  var _React$useReducer = React.useReducer(dataReducer, {
40
40
  item: null,
41
41
  scope: defaultScope
@@ -52,4 +52,5 @@ export function HighlightProvider(_ref) {
52
52
  value: value,
53
53
  children: children
54
54
  });
55
- }
55
+ }
56
+ export { HighlightProvider };
@@ -55,8 +55,8 @@ var dataReducer = function dataReducer(prevState, action) {
55
55
  return prevState;
56
56
  }
57
57
  };
58
- export function InteractionProvider(_ref) {
59
- var children = _ref.children;
58
+ function InteractionProvider(props) {
59
+ var children = props.children;
60
60
  var _React$useReducer = React.useReducer(dataReducer, {
61
61
  item: null,
62
62
  axis: {
@@ -77,4 +77,5 @@ export function InteractionProvider(_ref) {
77
77
  value: value,
78
78
  children: children
79
79
  });
80
- }
80
+ }
81
+ export { InteractionProvider };
@@ -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-X-Charts: 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
@@ -56,12 +56,12 @@ var formatSeries = function formatSeries(series, colors, dataset) {
56
56
  });
57
57
  return formattedSeries;
58
58
  };
59
- export function SeriesContextProvider(_ref) {
60
- var series = _ref.series,
61
- dataset = _ref.dataset,
62
- _ref$colors = _ref.colors,
63
- colors = _ref$colors === void 0 ? blueberryTwilightPalette : _ref$colors,
64
- children = _ref.children;
59
+ function SeriesContextProvider(props) {
60
+ var series = props.series,
61
+ dataset = props.dataset,
62
+ _props$colors = props.colors,
63
+ colors = _props$colors === void 0 ? blueberryTwilightPalette : _props$colors,
64
+ children = props.children;
65
65
  var theme = useTheme();
66
66
  var formattedSeries = React.useMemo(function () {
67
67
  return formatSeries(series, typeof colors === 'function' ? colors(theme.palette.mode) : colors, dataset);
@@ -70,4 +70,5 @@ export function SeriesContextProvider(_ref) {
70
70
  value: formattedSeries,
71
71
  children: children
72
72
  });
73
- }
73
+ }
74
+ export { SeriesContextProvider };
package/legacy/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @mui/x-charts v7.0.0-alpha.7
2
+ * @mui/x-charts v7.0.0-alpha.8
3
3
  *
4
4
  * @license MIT
5
5
  * This source code is licensed under the MIT license found in the
@@ -26,4 +26,5 @@ export * from './PieChart';
26
26
  export * from './ScatterChart';
27
27
  export * from './SparkLineChart';
28
28
  export * from './ChartContainer';
29
+ export * from './ChartsSurface';
29
30
  export * from './ResponsiveChartContainer';
@@ -3,9 +3,9 @@ import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
3
3
  // DOM utils taken from
4
4
  // https://github.com/recharts/recharts/blob/master/src/util/DOMUtils.ts
5
5
 
6
- var isSsr = function isSsr() {
7
- return !(typeof window !== 'undefined' && window.document && window.setTimeout);
8
- };
6
+ function isSsr() {
7
+ return typeof window === 'undefined';
8
+ }
9
9
  var stringCache = {
10
10
  widthCache: {},
11
11
  cacheCount: 0
@@ -63,6 +63,7 @@ export interface PieSeriesType<Tdata = PieValueType> extends CommonSeriesType<Td
63
63
  arcLabel?: 'formattedValue' | 'label' | 'value' | ((item: DefaultizedPieValueType) => string);
64
64
  /**
65
65
  * The minimal angle required to display the arc label.
66
+ * @default 0
66
67
  */
67
68
  arcLabelMinAngle?: number;
68
69
  /**
@@ -153,6 +153,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
153
153
  className: PropTypes.string,
154
154
  /**
155
155
  * Color palette used to colorize multiple series.
156
+ * @default blueberryTwilightPalette
156
157
  */
157
158
  colors: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string), PropTypes.func]),
158
159
  /**
@@ -69,18 +69,18 @@ const useCompletedData = () => {
69
69
  let baseScaleConfig;
70
70
  if (verticalLayout) {
71
71
  if (!isBandScaleConfig(xAxisConfig)) {
72
- throw new Error(`MUI-X-Charts: ${xAxisKey === 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}"`);
72
+ throw new Error(`MUI X Charts: ${xAxisKey === 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}".`);
73
73
  }
74
74
  if (xAxis[xAxisKey].data === undefined) {
75
- throw new Error(`MUI-X-Charts: ${xAxisKey === DEFAULT_X_AXIS_KEY ? 'The first `xAxis`' : `The x-axis with id "${xAxisKey}"`} shoud have data property`);
75
+ throw new Error(`MUI X Charts: ${xAxisKey === DEFAULT_X_AXIS_KEY ? 'The first `xAxis`' : `The x-axis with id "${xAxisKey}"`} shoud have data property.`);
76
76
  }
77
77
  baseScaleConfig = xAxisConfig;
78
78
  } else {
79
79
  if (!isBandScaleConfig(yAxisConfig)) {
80
- throw new Error(`MUI-X-Charts: ${yAxisKey === 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}"`);
80
+ throw new Error(`MUI X Charts: ${yAxisKey === 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}".`);
81
81
  }
82
82
  if (yAxis[yAxisKey].data === undefined) {
83
- throw new Error(`MUI-X-Charts: ${yAxisKey === DEFAULT_Y_AXIS_KEY ? 'The first `yAxis`' : `The y-axis with id "${yAxisKey}"`} shoud have data property`);
83
+ throw new Error(`MUI X Charts: ${yAxisKey === DEFAULT_Y_AXIS_KEY ? 'The first `yAxis`' : `The y-axis with id "${yAxisKey}"`} shoud have data property.`);
84
84
  }
85
85
  baseScaleConfig = yAxisConfig;
86
86
  }
@@ -25,7 +25,7 @@ const formatter = (params, dataset) => {
25
25
  }
26
26
  });
27
27
  } else if (dataset === undefined) {
28
- 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'));
28
+ 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'));
29
29
  }
30
30
  });
31
31
  const completedSeries = {};
@@ -58,16 +58,16 @@ function ChartsAxis(props) {
58
58
  const topId = getAxisId(topAxis);
59
59
  const rightId = getAxisId(rightAxis);
60
60
  if (topId !== null && !xAxis[topId]) {
61
- throw Error([`MUI-X-Charts: id used for top axis "${topId}" is not defined.`, `Available ids are: ${xAxisIds.join(', ')}.`].join('\n'));
61
+ throw Error([`MUI X Charts: id used for top axis "${topId}" is not defined.`, `Available ids are: ${xAxisIds.join(', ')}.`].join('\n'));
62
62
  }
63
63
  if (leftId !== null && !yAxis[leftId]) {
64
- throw Error([`MUI-X-Charts: id used for left axis "${leftId}" is not defined.`, `Available ids are: ${yAxisIds.join(', ')}.`].join('\n'));
64
+ throw Error([`MUI X Charts: id used for left axis "${leftId}" is not defined.`, `Available ids are: ${yAxisIds.join(', ')}.`].join('\n'));
65
65
  }
66
66
  if (rightId !== null && !yAxis[rightId]) {
67
- throw Error([`MUI-X-Charts: id used for right axis "${rightId}" is not defined.`, `Available ids are: ${yAxisIds.join(', ')}.`].join('\n'));
67
+ throw Error([`MUI X Charts: id used for right axis "${rightId}" is not defined.`, `Available ids are: ${yAxisIds.join(', ')}.`].join('\n'));
68
68
  }
69
69
  if (bottomId !== null && !xAxis[bottomId]) {
70
- throw Error([`MUI-X-Charts: id used for bottom axis "${bottomId}" is not defined.`, `Available ids are: ${xAxisIds.join(', ')}.`].join('\n'));
70
+ throw Error([`MUI X Charts: id used for bottom axis "${bottomId}" is not defined.`, `Available ids are: ${xAxisIds.join(', ')}.`].join('\n'));
71
71
  }
72
72
  const topAxisProps = mergeProps(topAxis, slots, slotProps);
73
73
  const bottomAxisProps = mergeProps(bottomAxis, slots, slotProps);
@@ -5,13 +5,17 @@ import { ChartsXReferenceLine } from './ChartsXReferenceLine';
5
5
  import { ChartsYReferenceLine } from './ChartsYReferenceLine';
6
6
  import { jsx as _jsx } from "react/jsx-runtime";
7
7
  function ChartsReferenceLine(props) {
8
- if (props.x !== undefined && props.y !== undefined) {
9
- throw new Error('MUI-X-Charts: The ChartsReferenceLine can not have both `x` and `y` props set.');
8
+ const {
9
+ x,
10
+ y
11
+ } = props;
12
+ if (x !== undefined && y !== undefined) {
13
+ throw new Error('MUI X Charts: The ChartsReferenceLine can not have both `x` and `y` props set.');
10
14
  }
11
- if (props.x === undefined && props.y === undefined) {
12
- throw new Error('MUI-X-Charts: The ChartsReferenceLine should have a value in `x` or `y` prop.');
15
+ if (x === undefined && y === undefined) {
16
+ throw new Error('MUI X Charts: The ChartsReferenceLine should have a value in `x` or `y` prop.');
13
17
  }
14
- if (props.x !== undefined) {
18
+ if (x !== undefined) {
15
19
  return /*#__PURE__*/_jsx(ChartsXReferenceLine, _extends({}, props));
16
20
  }
17
21
  return /*#__PURE__*/_jsx(ChartsYReferenceLine, _extends({}, props));
@@ -2,6 +2,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
2
2
  import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
3
3
  const _excluded = ["children", "width", "height", "viewBox", "disableAxisListener", "className"];
4
4
  import { styled } from '@mui/material/styles';
5
+ import PropTypes from 'prop-types';
5
6
  import * as React from 'react';
6
7
  import { useAxisEvents } from './hooks/useAxisEvents';
7
8
  import { jsx as _jsx } from "react/jsx-runtime";
@@ -10,7 +11,7 @@ const ChartChartsSurfaceStyles = styled('svg', {
10
11
  name: 'MuiChartsSurface',
11
12
  slot: 'Root'
12
13
  })(() => ({}));
13
- export const ChartsSurface = /*#__PURE__*/React.forwardRef(function ChartsSurface(props, ref) {
14
+ const ChartsSurface = /*#__PURE__*/React.forwardRef(function ChartsSurface(props, ref) {
14
15
  const {
15
16
  children,
16
17
  width,
@@ -38,4 +39,36 @@ export const ChartsSurface = /*#__PURE__*/React.forwardRef(function ChartsSurfac
38
39
  children: props.desc
39
40
  }), children]
40
41
  }));
41
- });
42
+ });
43
+ process.env.NODE_ENV !== "production" ? ChartsSurface.propTypes = {
44
+ // ----------------------------- Warning --------------------------------
45
+ // | These PropTypes are generated from the TypeScript type definitions |
46
+ // | To update them edit the TypeScript types and run "yarn proptypes" |
47
+ // ----------------------------------------------------------------------
48
+ children: PropTypes.node,
49
+ className: PropTypes.string,
50
+ desc: PropTypes.string,
51
+ /**
52
+ * If `true`, the charts will not listen to the mouse move event.
53
+ * It might break interactive features, but will improve performance.
54
+ * @default false
55
+ */
56
+ disableAxisListener: PropTypes.bool,
57
+ /**
58
+ * The height of the chart in px.
59
+ */
60
+ height: PropTypes.number.isRequired,
61
+ sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
62
+ title: PropTypes.string,
63
+ viewBox: PropTypes.shape({
64
+ height: PropTypes.number,
65
+ width: PropTypes.number,
66
+ x: PropTypes.number,
67
+ y: PropTypes.number
68
+ }),
69
+ /**
70
+ * The width of the chart in px.
71
+ */
72
+ width: PropTypes.number.isRequired
73
+ } : void 0;
74
+ export { ChartsSurface };
@@ -59,6 +59,8 @@ export const ChartsTooltipCell = styled('td', {
59
59
  paddingRight: theme.spacing(2)
60
60
  }
61
61
  }));
62
+
63
+ // eslint-disable-next-line material-ui/no-styled-box
62
64
  export const ChartsTooltipMark = styled(Box, {
63
65
  name: 'MuiChartsTooltip',
64
66
  slot: 'Mark'
@@ -62,10 +62,10 @@ function AreaPlot(props) {
62
62
  const xData = xAxis[xAxisKey].data;
63
63
  if (process.env.NODE_ENV !== 'production') {
64
64
  if (xData === undefined) {
65
- throw new Error(`MUI-X-Charts: ${xAxisKey === 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.`);
65
+ throw new Error(`MUI X Charts: ${xAxisKey === 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.`);
66
66
  }
67
67
  if (xData.length < stackedData.length) {
68
- 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)`);
68
+ 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).`);
69
69
  }
70
70
  }
71
71
  const areaPath = d3Area().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]));