@mui/x-charts 7.0.0-beta.3 → 7.0.0-beta.5

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 (221) hide show
  1. package/BarChart/BarChart.js +0 -2
  2. package/CHANGELOG.md +357 -22
  3. package/ChartsGrid/ChartsGrid.js +2 -2
  4. package/ChartsOnAxisClickHandler/ChartsOnAxisClickHandler.js +1 -1
  5. package/ChartsTooltip/utils.js +1 -1
  6. package/ChartsVoronoiHandler/ChartsVoronoiHandler.d.ts +0 -1
  7. package/ChartsVoronoiHandler/ChartsVoronoiHandler.js +1 -2
  8. package/ChartsXAxis/ChartsXAxis.js +1 -1
  9. package/ChartsYAxis/ChartsYAxis.js +1 -1
  10. package/Gauge/Gauge.js +0 -2
  11. package/Gauge/GaugeContainer.d.ts +0 -2
  12. package/Gauge/GaugeContainer.js +0 -2
  13. package/Gauge/GaugeProvider.js +3 -0
  14. package/Gauge/GaugeValueText.js +1 -1
  15. package/LineChart/LineChart.js +0 -2
  16. package/PieChart/PieChart.js +0 -2
  17. package/ResponsiveChartContainer/ResponsiveChartContainer.d.ts +0 -2
  18. package/ResponsiveChartContainer/ResponsiveChartContainer.js +0 -2
  19. package/ScatterChart/ScatterChart.js +0 -3
  20. package/SparkLineChart/SparkLineChart.js +0 -2
  21. package/context/CartesianContextProvider.d.ts +0 -8
  22. package/context/CartesianContextProvider.js +4 -89
  23. package/context/DrawingProvider.d.ts +2 -11
  24. package/context/DrawingProvider.js +10 -35
  25. package/context/HighlightProvider.js +3 -0
  26. package/context/InteractionProvider.js +3 -0
  27. package/context/SeriesContextProvider.js +3 -0
  28. package/context/index.d.ts +0 -2
  29. package/context/index.js +1 -15
  30. package/esm/BarChart/BarChart.js +0 -2
  31. package/esm/ChartsGrid/ChartsGrid.js +2 -2
  32. package/esm/ChartsOnAxisClickHandler/ChartsOnAxisClickHandler.js +2 -2
  33. package/esm/ChartsTooltip/utils.js +2 -2
  34. package/esm/ChartsVoronoiHandler/ChartsVoronoiHandler.js +2 -3
  35. package/esm/ChartsXAxis/ChartsXAxis.js +1 -1
  36. package/esm/ChartsYAxis/ChartsYAxis.js +1 -1
  37. package/esm/Gauge/Gauge.js +0 -2
  38. package/esm/Gauge/GaugeContainer.js +0 -2
  39. package/esm/Gauge/GaugeProvider.js +3 -0
  40. package/esm/Gauge/GaugeValueText.js +1 -1
  41. package/esm/LineChart/LineChart.js +0 -2
  42. package/esm/PieChart/PieChart.js +0 -2
  43. package/esm/ResponsiveChartContainer/ResponsiveChartContainer.js +0 -2
  44. package/esm/ScatterChart/ScatterChart.js +0 -3
  45. package/esm/SparkLineChart/SparkLineChart.js +0 -2
  46. package/esm/context/CartesianContextProvider.js +3 -88
  47. package/esm/context/DrawingProvider.js +10 -36
  48. package/esm/context/HighlightProvider.js +3 -0
  49. package/esm/context/InteractionProvider.js +3 -0
  50. package/esm/context/SeriesContextProvider.js +3 -0
  51. package/esm/context/index.js +1 -2
  52. package/esm/hooks/useAxisEvents.js +2 -2
  53. package/hooks/useAxisEvents.js +1 -1
  54. package/hooks/useTicks.d.ts +1 -1
  55. package/index.js +1 -1
  56. package/modern/BarChart/BarChart.js +0 -2
  57. package/modern/ChartsGrid/ChartsGrid.js +2 -2
  58. package/modern/ChartsOnAxisClickHandler/ChartsOnAxisClickHandler.js +2 -2
  59. package/modern/ChartsTooltip/utils.js +2 -2
  60. package/modern/ChartsVoronoiHandler/ChartsVoronoiHandler.js +2 -3
  61. package/modern/ChartsXAxis/ChartsXAxis.js +1 -1
  62. package/modern/ChartsYAxis/ChartsYAxis.js +1 -1
  63. package/modern/Gauge/Gauge.js +0 -2
  64. package/modern/Gauge/GaugeContainer.js +0 -2
  65. package/modern/Gauge/GaugeProvider.js +3 -0
  66. package/modern/Gauge/GaugeValueText.js +1 -1
  67. package/modern/LineChart/LineChart.js +0 -2
  68. package/modern/PieChart/PieChart.js +0 -2
  69. package/modern/ResponsiveChartContainer/ResponsiveChartContainer.js +0 -2
  70. package/modern/ScatterChart/ScatterChart.js +0 -3
  71. package/modern/SparkLineChart/SparkLineChart.js +0 -2
  72. package/modern/context/CartesianContextProvider.js +3 -88
  73. package/modern/context/DrawingProvider.js +10 -36
  74. package/modern/context/HighlightProvider.js +3 -0
  75. package/modern/context/InteractionProvider.js +3 -0
  76. package/modern/context/SeriesContextProvider.js +3 -0
  77. package/modern/context/index.js +1 -2
  78. package/modern/hooks/useAxisEvents.js +2 -2
  79. package/modern/index.js +1 -1
  80. package/package.json +1 -1
  81. package/legacy/BarChart/BarChart.js +0 -440
  82. package/legacy/BarChart/BarElement.js +0 -119
  83. package/legacy/BarChart/BarPlot.js +0 -232
  84. package/legacy/BarChart/extremums.js +0 -45
  85. package/legacy/BarChart/formatter.js +0 -78
  86. package/legacy/BarChart/index.js +0 -3
  87. package/legacy/BarChart/legend.js +0 -15
  88. package/legacy/ChartContainer/ChartContainer.js +0 -189
  89. package/legacy/ChartContainer/index.js +0 -1
  90. package/legacy/ChartsAxis/ChartsAxis.js +0 -215
  91. package/legacy/ChartsAxis/axisClasses.js +0 -5
  92. package/legacy/ChartsAxis/index.js +0 -2
  93. package/legacy/ChartsAxisHighlight/ChartsAxisHighlight.js +0 -105
  94. package/legacy/ChartsAxisHighlight/index.js +0 -1
  95. package/legacy/ChartsClipPath/ChartsClipPath.js +0 -48
  96. package/legacy/ChartsClipPath/index.js +0 -1
  97. package/legacy/ChartsGrid/ChartsGrid.js +0 -119
  98. package/legacy/ChartsGrid/chartsGridClasses.js +0 -6
  99. package/legacy/ChartsGrid/index.js +0 -2
  100. package/legacy/ChartsLegend/ChartsLegend.js +0 -100
  101. package/legacy/ChartsLegend/DefaultChartsLegend.js +0 -302
  102. package/legacy/ChartsLegend/chartsLegendClasses.js +0 -5
  103. package/legacy/ChartsLegend/index.js +0 -4
  104. package/legacy/ChartsLegend/utils.js +0 -15
  105. package/legacy/ChartsOnAxisClickHandler/ChartsOnAxisClickHandler.js +0 -75
  106. package/legacy/ChartsOnAxisClickHandler/index.js +0 -1
  107. package/legacy/ChartsReferenceLine/ChartsReferenceLine.js +0 -72
  108. package/legacy/ChartsReferenceLine/ChartsXReferenceLine.js +0 -105
  109. package/legacy/ChartsReferenceLine/ChartsYReferenceLine.js +0 -105
  110. package/legacy/ChartsReferenceLine/chartsReferenceLineClasses.js +0 -6
  111. package/legacy/ChartsReferenceLine/common.js +0 -19
  112. package/legacy/ChartsReferenceLine/index.js +0 -2
  113. package/legacy/ChartsSurface.js +0 -78
  114. package/legacy/ChartsText/ChartsText.js +0 -95
  115. package/legacy/ChartsText/index.js +0 -1
  116. package/legacy/ChartsTooltip/ChartsAxisTooltipContent.js +0 -96
  117. package/legacy/ChartsTooltip/ChartsItemTooltipContent.js +0 -53
  118. package/legacy/ChartsTooltip/ChartsTooltip.js +0 -148
  119. package/legacy/ChartsTooltip/ChartsTooltipTable.js +0 -80
  120. package/legacy/ChartsTooltip/DefaultChartsAxisTooltipContent.js +0 -118
  121. package/legacy/ChartsTooltip/DefaultChartsItemTooltipContent.js +0 -78
  122. package/legacy/ChartsTooltip/chartsTooltipClasses.js +0 -5
  123. package/legacy/ChartsTooltip/index.js +0 -6
  124. package/legacy/ChartsTooltip/utils.js +0 -103
  125. package/legacy/ChartsVoronoiHandler/ChartsVoronoiHandler.js +0 -206
  126. package/legacy/ChartsVoronoiHandler/index.js +0 -1
  127. package/legacy/ChartsXAxis/ChartsXAxis.js +0 -339
  128. package/legacy/ChartsXAxis/index.js +0 -1
  129. package/legacy/ChartsYAxis/ChartsYAxis.js +0 -267
  130. package/legacy/ChartsYAxis/index.js +0 -1
  131. package/legacy/Gauge/Gauge.js +0 -146
  132. package/legacy/Gauge/GaugeContainer.js +0 -215
  133. package/legacy/Gauge/GaugeProvider.js +0 -87
  134. package/legacy/Gauge/GaugeReferenceArc.js +0 -37
  135. package/legacy/Gauge/GaugeValueArc.js +0 -44
  136. package/legacy/Gauge/GaugeValueText.js +0 -66
  137. package/legacy/Gauge/gaugeClasses.js +0 -7
  138. package/legacy/Gauge/index.js +0 -7
  139. package/legacy/Gauge/utils.js +0 -84
  140. package/legacy/LineChart/AnimatedArea.js +0 -102
  141. package/legacy/LineChart/AnimatedLine.js +0 -104
  142. package/legacy/LineChart/AreaElement.js +0 -112
  143. package/legacy/LineChart/AreaPlot.js +0 -149
  144. package/legacy/LineChart/LineChart.js +0 -452
  145. package/legacy/LineChart/LineElement.js +0 -112
  146. package/legacy/LineChart/LineHighlightElement.js +0 -79
  147. package/legacy/LineChart/LineHighlightPlot.js +0 -97
  148. package/legacy/LineChart/LinePlot.js +0 -144
  149. package/legacy/LineChart/MarkElement.js +0 -153
  150. package/legacy/LineChart/MarkPlot.js +0 -178
  151. package/legacy/LineChart/extremums.js +0 -54
  152. package/legacy/LineChart/formatter.js +0 -82
  153. package/legacy/LineChart/index.js +0 -11
  154. package/legacy/LineChart/legend.js +0 -15
  155. package/legacy/PieChart/PieArc.js +0 -103
  156. package/legacy/PieChart/PieArcLabel.js +0 -112
  157. package/legacy/PieChart/PieArcLabelPlot.js +0 -193
  158. package/legacy/PieChart/PieArcPlot.js +0 -180
  159. package/legacy/PieChart/PieChart.js +0 -404
  160. package/legacy/PieChart/PiePlot.js +0 -137
  161. package/legacy/PieChart/dataTransform/transition.js +0 -149
  162. package/legacy/PieChart/dataTransform/useTransformData.js +0 -63
  163. package/legacy/PieChart/formatter.js +0 -55
  164. package/legacy/PieChart/index.js +0 -6
  165. package/legacy/PieChart/legend.js +0 -16
  166. package/legacy/ResponsiveChartContainer/ResponsiveChartContainer.js +0 -185
  167. package/legacy/ResponsiveChartContainer/index.js +0 -1
  168. package/legacy/ResponsiveChartContainer/useChartContainerDimensions.js +0 -73
  169. package/legacy/ScatterChart/Scatter.js +0 -110
  170. package/legacy/ScatterChart/ScatterChart.js +0 -395
  171. package/legacy/ScatterChart/ScatterPlot.js +0 -80
  172. package/legacy/ScatterChart/extremums.js +0 -39
  173. package/legacy/ScatterChart/formatter.js +0 -12
  174. package/legacy/ScatterChart/index.js +0 -3
  175. package/legacy/ScatterChart/legend.js +0 -15
  176. package/legacy/SparkLineChart/SparkLineChart.js +0 -266
  177. package/legacy/SparkLineChart/index.js +0 -1
  178. package/legacy/colorPalettes/colorPalettes.js +0 -15
  179. package/legacy/colorPalettes/index.js +0 -1
  180. package/legacy/constants.js +0 -8
  181. package/legacy/context/CartesianContextProvider.js +0 -327
  182. package/legacy/context/DrawingProvider.js +0 -74
  183. package/legacy/context/HighlightProvider.js +0 -56
  184. package/legacy/context/InteractionProvider.js +0 -81
  185. package/legacy/context/SeriesContextProvider.js +0 -74
  186. package/legacy/context/index.js +0 -2
  187. package/legacy/hooks/index.js +0 -2
  188. package/legacy/hooks/useAxisEvents.js +0 -120
  189. package/legacy/hooks/useChartDimensions.js +0 -18
  190. package/legacy/hooks/useDrawingArea.js +0 -21
  191. package/legacy/hooks/useInteractionItemProps.js +0 -71
  192. package/legacy/hooks/useMounted.js +0 -21
  193. package/legacy/hooks/useReducedMotion.js +0 -27
  194. package/legacy/hooks/useScale.js +0 -33
  195. package/legacy/hooks/useTicks.js +0 -65
  196. package/legacy/index.js +0 -33
  197. package/legacy/internals/components/AxisSharedComponents.js +0 -25
  198. package/legacy/internals/defaultizeColor.js +0 -17
  199. package/legacy/internals/defaultizeValueFormatter.js +0 -12
  200. package/legacy/internals/domUtils.js +0 -121
  201. package/legacy/internals/geometry.js +0 -37
  202. package/legacy/internals/getCurve.js +0 -39
  203. package/legacy/internals/getScale.js +0 -17
  204. package/legacy/internals/getWordsByLines.js +0 -15
  205. package/legacy/internals/isBandScale.js +0 -3
  206. package/legacy/internals/stackSeries.js +0 -92
  207. package/legacy/internals/useAnimatedPath.js +0 -32
  208. package/legacy/internals/utils.js +0 -52
  209. package/legacy/models/axis.js +0 -6
  210. package/legacy/models/helpers.js +0 -1
  211. package/legacy/models/index.js +0 -4
  212. package/legacy/models/layout.js +0 -1
  213. package/legacy/models/seriesType/bar.js +0 -1
  214. package/legacy/models/seriesType/common.js +0 -1
  215. package/legacy/models/seriesType/config.js +0 -1
  216. package/legacy/models/seriesType/index.js +0 -5
  217. package/legacy/models/seriesType/line.js +0 -1
  218. package/legacy/models/seriesType/pie.js +0 -1
  219. package/legacy/models/seriesType/scatter.js +0 -1
  220. package/legacy/models/stacking.js +0 -1
  221. package/legacy/themeAugmentation/index.js +0 -3
@@ -1,73 +0,0 @@
1
- import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
2
- import * as React from 'react';
3
- import useEnhancedEffect from '@mui/utils/useEnhancedEffect';
4
- import ownerWindow from '@mui/utils/ownerWindow';
5
- export var useChartContainerDimensions = function useChartContainerDimensions(inWidth, inHeight) {
6
- var rootRef = React.useRef(null);
7
- var displayError = React.useRef(false);
8
- var _React$useState = React.useState(0),
9
- _React$useState2 = _slicedToArray(_React$useState, 2),
10
- width = _React$useState2[0],
11
- setWidth = _React$useState2[1];
12
- var _React$useState3 = React.useState(0),
13
- _React$useState4 = _slicedToArray(_React$useState3, 2),
14
- height = _React$useState4[0],
15
- setHeight = _React$useState4[1];
16
-
17
- // Adaptation of the `computeSizeAndPublishResizeEvent` from the grid.
18
- var computeSize = React.useCallback(function () {
19
- var mainEl = rootRef == null ? void 0 : rootRef.current;
20
- if (!mainEl) {
21
- return;
22
- }
23
- var win = ownerWindow(mainEl);
24
- var computedStyle = win.getComputedStyle(mainEl);
25
- var newHeight = Math.floor(parseFloat(computedStyle.height)) || 0;
26
- var newWidth = Math.floor(parseFloat(computedStyle.width)) || 0;
27
- setWidth(newWidth);
28
- setHeight(newHeight);
29
- }, []);
30
- React.useEffect(function () {
31
- // Ensure the error detection occurs after the first rendering.
32
- displayError.current = true;
33
- }, []);
34
- useEnhancedEffect(function () {
35
- if (inWidth !== undefined && inHeight !== undefined) {
36
- return function () {};
37
- }
38
- computeSize();
39
- var elementToObserve = rootRef.current;
40
- if (typeof ResizeObserver === 'undefined') {
41
- return function () {};
42
- }
43
- var animationFrame;
44
- var observer = new ResizeObserver(function () {
45
- // See https://github.com/mui/mui-x/issues/8733
46
- animationFrame = requestAnimationFrame(function () {
47
- computeSize();
48
- });
49
- });
50
- if (elementToObserve) {
51
- observer.observe(elementToObserve);
52
- }
53
- return function () {
54
- if (animationFrame) {
55
- window.cancelAnimationFrame(animationFrame);
56
- }
57
- if (elementToObserve) {
58
- observer.unobserve(elementToObserve);
59
- }
60
- };
61
- }, [computeSize, inHeight, inWidth]);
62
- if (process.env.NODE_ENV !== 'production') {
63
- if (displayError.current && inWidth === undefined && width === 0) {
64
- console.error("MUI X Charts: ChartContainer does not have `width` prop, and its container has no `width` defined.");
65
- displayError.current = false;
66
- }
67
- if (displayError.current && inHeight === undefined && height === 0) {
68
- console.error("MUI X Charts: ChartContainer does not have `height` prop, and its container has no `height` defined.");
69
- displayError.current = false;
70
- }
71
- }
72
- return [rootRef, inWidth != null ? inWidth : width, inHeight != null ? inHeight : height];
73
- };
@@ -1,110 +0,0 @@
1
- import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
2
- import _extends from "@babel/runtime/helpers/esm/extends";
3
- import * as React from 'react';
4
- import PropTypes from 'prop-types';
5
- import { getValueToPositionMapper } from '../hooks/useScale';
6
- import { getIsFaded, getIsHighlighted, useInteractionItemProps } from '../hooks/useInteractionItemProps';
7
- import { InteractionContext } from '../context/InteractionProvider';
8
- import { jsx as _jsx } from "react/jsx-runtime";
9
- /**
10
- * Demos:
11
- *
12
- * - [Scatter](https://mui.com/x/react-charts/scatter/)
13
- * - [Scatter demonstration](https://mui.com/x/react-charts/scatter-demo/)
14
- *
15
- * API:
16
- *
17
- * - [Scatter API](https://mui.com/x/api/charts/scatter/)
18
- */
19
- function Scatter(props) {
20
- var series = props.series,
21
- xScale = props.xScale,
22
- yScale = props.yScale,
23
- color = props.color,
24
- markerSize = props.markerSize,
25
- onItemClick = props.onItemClick;
26
- var highlightScope = React.useMemo(function () {
27
- return _extends({
28
- highlighted: 'item',
29
- faded: 'global'
30
- }, series.highlightScope);
31
- }, [series.highlightScope]);
32
- var _React$useContext = React.useContext(InteractionContext),
33
- item = _React$useContext.item,
34
- useVoronoiInteraction = _React$useContext.useVoronoiInteraction;
35
- var skipInteractionHandlers = useVoronoiInteraction || series.disableHover;
36
- var getInteractionItemProps = useInteractionItemProps(highlightScope, skipInteractionHandlers);
37
- var cleanData = React.useMemo(function () {
38
- var getXPosition = getValueToPositionMapper(xScale);
39
- var getYPosition = getValueToPositionMapper(yScale);
40
- var xRange = xScale.range();
41
- var yRange = yScale.range();
42
- var minXRange = Math.min.apply(Math, _toConsumableArray(xRange));
43
- var maxXRange = Math.max.apply(Math, _toConsumableArray(xRange));
44
- var minYRange = Math.min.apply(Math, _toConsumableArray(yRange));
45
- var maxYRange = Math.max.apply(Math, _toConsumableArray(yRange));
46
- var temp = [];
47
- for (var i = 0; i < series.data.length; i += 1) {
48
- var scatterPoint = series.data[i];
49
- var x = getXPosition(scatterPoint.x);
50
- var y = getYPosition(scatterPoint.y);
51
- var isInRange = x >= minXRange && x <= maxXRange && y >= minYRange && y <= maxYRange;
52
- var pointCtx = {
53
- type: 'scatter',
54
- seriesId: series.id,
55
- dataIndex: i
56
- };
57
- if (isInRange) {
58
- var isHighlighted = getIsHighlighted(item, pointCtx, highlightScope);
59
- temp.push({
60
- x: x,
61
- y: y,
62
- isHighlighted: isHighlighted,
63
- isFaded: !isHighlighted && getIsFaded(item, pointCtx, highlightScope),
64
- interactionProps: getInteractionItemProps(pointCtx),
65
- id: scatterPoint.id,
66
- dataIndex: i
67
- });
68
- }
69
- }
70
- return temp;
71
- }, [xScale, yScale, series.data, series.id, item, highlightScope, getInteractionItemProps]);
72
- return /*#__PURE__*/_jsx("g", {
73
- children: cleanData.map(function (dataPoint) {
74
- return /*#__PURE__*/_jsx("circle", _extends({
75
- cx: 0,
76
- cy: 0,
77
- r: (dataPoint.isHighlighted ? 1.2 : 1) * markerSize,
78
- transform: "translate(".concat(dataPoint.x, ", ").concat(dataPoint.y, ")"),
79
- fill: color,
80
- opacity: dataPoint.isFaded && 0.3 || 1,
81
- onClick: onItemClick && function (event) {
82
- return onItemClick(event, {
83
- type: 'scatter',
84
- seriesId: series.id,
85
- dataIndex: dataPoint.dataIndex
86
- });
87
- },
88
- cursor: onItemClick ? 'pointer' : 'unset'
89
- }, dataPoint.interactionProps), dataPoint.id);
90
- })
91
- });
92
- }
93
- process.env.NODE_ENV !== "production" ? Scatter.propTypes = {
94
- // ----------------------------- Warning --------------------------------
95
- // | These PropTypes are generated from the TypeScript type definitions |
96
- // | To update them edit the TypeScript types and run "yarn proptypes" |
97
- // ----------------------------------------------------------------------
98
- color: PropTypes.string.isRequired,
99
- markerSize: PropTypes.number.isRequired,
100
- /**
101
- * Callback fired when clicking on a scatter item.
102
- * @param {MouseEvent} event Mouse event recorded on the `<svg/>` element.
103
- * @param {ScatterItemIdentifier} scatterItemIdentifier The scatter item identifier.
104
- */
105
- onItemClick: PropTypes.func,
106
- series: PropTypes.object.isRequired,
107
- xScale: PropTypes.func.isRequired,
108
- yScale: PropTypes.func.isRequired
109
- } : void 0;
110
- export { Scatter };
@@ -1,395 +0,0 @@
1
- import _extends from "@babel/runtime/helpers/esm/extends";
2
- import * as React from 'react';
3
- import PropTypes from 'prop-types';
4
- import { ScatterPlot } from './ScatterPlot';
5
- import { ResponsiveChartContainer } from '../ResponsiveChartContainer';
6
- import { ChartsAxis } from '../ChartsAxis';
7
- import { ChartsTooltip } from '../ChartsTooltip';
8
- import { ChartsLegend } from '../ChartsLegend';
9
- import { ChartsAxisHighlight } from '../ChartsAxisHighlight';
10
- import { ChartsVoronoiHandler } from '../ChartsVoronoiHandler/ChartsVoronoiHandler';
11
- import { ChartsGrid } from '../ChartsGrid';
12
- import { jsx as _jsx } from "react/jsx-runtime";
13
- import { jsxs as _jsxs } from "react/jsx-runtime";
14
- /**
15
- * Demos:
16
- *
17
- * - [Scatter](https://mui.com/x/react-charts/scatter/)
18
- * - [Scatter demonstration](https://mui.com/x/react-charts/scatter-demo/)
19
- *
20
- * API:
21
- *
22
- * - [ScatterChart API](https://mui.com/x/api/charts/scatter-chart/)
23
- */
24
- var ScatterChart = /*#__PURE__*/React.forwardRef(function ScatterChart(props, ref) {
25
- var xAxis = props.xAxis,
26
- yAxis = props.yAxis,
27
- series = props.series,
28
- tooltip = props.tooltip,
29
- axisHighlight = props.axisHighlight,
30
- voronoiMaxRadius = props.voronoiMaxRadius,
31
- disableVoronoi = props.disableVoronoi,
32
- legend = props.legend,
33
- width = props.width,
34
- height = props.height,
35
- margin = props.margin,
36
- colors = props.colors,
37
- sx = props.sx,
38
- grid = props.grid,
39
- topAxis = props.topAxis,
40
- leftAxis = props.leftAxis,
41
- rightAxis = props.rightAxis,
42
- bottomAxis = props.bottomAxis,
43
- onItemClick = props.onItemClick,
44
- children = props.children,
45
- slots = props.slots,
46
- slotProps = props.slotProps;
47
- return /*#__PURE__*/_jsxs(ResponsiveChartContainer, {
48
- ref: ref,
49
- series: series.map(function (s) {
50
- return _extends({
51
- type: 'scatter'
52
- }, s);
53
- }),
54
- width: width,
55
- height: height,
56
- margin: margin,
57
- colors: colors,
58
- xAxis: xAxis,
59
- yAxis: yAxis,
60
- sx: sx,
61
- children: [!disableVoronoi && /*#__PURE__*/_jsx(ChartsVoronoiHandler, {
62
- voronoiMaxRadius: voronoiMaxRadius,
63
- onItemClick: onItemClick
64
- }), /*#__PURE__*/_jsx(ChartsAxis, {
65
- topAxis: topAxis,
66
- leftAxis: leftAxis,
67
- rightAxis: rightAxis,
68
- bottomAxis: bottomAxis,
69
- slots: slots,
70
- slotProps: slotProps
71
- }), grid && /*#__PURE__*/_jsx(ChartsGrid, {
72
- vertical: grid.vertical,
73
- horizontal: grid.horizontal
74
- }), /*#__PURE__*/_jsx(ScatterPlot, {
75
- slots: slots,
76
- slotProps: slotProps,
77
- onItemClick: disableVoronoi ? onItemClick : undefined
78
- }), /*#__PURE__*/_jsx(ChartsLegend, _extends({}, legend, {
79
- slots: slots,
80
- slotProps: slotProps
81
- })), /*#__PURE__*/_jsx(ChartsAxisHighlight, _extends({
82
- x: "none",
83
- y: "none"
84
- }, axisHighlight)), /*#__PURE__*/_jsx(ChartsTooltip, _extends({
85
- trigger: "item"
86
- }, tooltip)), children]
87
- });
88
- });
89
- process.env.NODE_ENV !== "production" ? ScatterChart.propTypes = {
90
- // ----------------------------- Warning --------------------------------
91
- // | These PropTypes are generated from the TypeScript type definitions |
92
- // | To update them edit the TypeScript types and run "yarn proptypes" |
93
- // ----------------------------------------------------------------------
94
- /**
95
- * The configuration of axes highlight.
96
- * @see See {@link https://mui.com/x/react-charts/tooltip/#highlights highlight docs} for more details.
97
- * @default { x: 'none', y: 'none' }
98
- */
99
- axisHighlight: PropTypes.shape({
100
- x: PropTypes.oneOf(['band', 'line', 'none']),
101
- y: PropTypes.oneOf(['band', 'line', 'none'])
102
- }),
103
- /**
104
- * Indicate which axis to display the bottom of the charts.
105
- * Can be a string (the id of the axis) or an object `ChartsXAxisProps`.
106
- * @default xAxisIds[0] The id of the first provided axis
107
- */
108
- bottomAxis: PropTypes.oneOfType([PropTypes.shape({
109
- axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
110
- classes: PropTypes.object,
111
- disableLine: PropTypes.bool,
112
- disableTicks: PropTypes.bool,
113
- fill: PropTypes.string,
114
- label: PropTypes.string,
115
- labelFontSize: PropTypes.number,
116
- labelStyle: PropTypes.object,
117
- position: PropTypes.oneOf(['bottom', 'top']),
118
- slotProps: PropTypes.object,
119
- slots: PropTypes.object,
120
- stroke: PropTypes.string,
121
- tickFontSize: PropTypes.number,
122
- tickInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.array, PropTypes.func]),
123
- tickLabelInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.func]),
124
- tickLabelStyle: PropTypes.object,
125
- tickMaxStep: PropTypes.number,
126
- tickMinStep: PropTypes.number,
127
- tickNumber: PropTypes.number,
128
- tickSize: PropTypes.number
129
- }), PropTypes.string]),
130
- children: PropTypes.node,
131
- className: PropTypes.string,
132
- /**
133
- * Color palette used to colorize multiple series.
134
- * @default blueberryTwilightPalette
135
- */
136
- colors: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string), PropTypes.func]),
137
- /**
138
- * An array of objects that can be used to populate series and axes data using their `dataKey` property.
139
- */
140
- dataset: PropTypes.arrayOf(PropTypes.object),
141
- desc: PropTypes.string,
142
- /**
143
- * If `true`, the charts will not listen to the mouse move event.
144
- * It might break interactive features, but will improve performance.
145
- * @default false
146
- */
147
- disableAxisListener: PropTypes.bool,
148
- /**
149
- * If true, the interaction will not use the Voronoi cell and fall back to hover events.
150
- * @default false
151
- */
152
- disableVoronoi: PropTypes.bool,
153
- /**
154
- * Option to display a cartesian grid in the background.
155
- */
156
- grid: PropTypes.shape({
157
- horizontal: PropTypes.bool,
158
- vertical: PropTypes.bool
159
- }),
160
- /**
161
- * The height of the chart in px. If not defined, it takes the height of the parent element.
162
- * @default undefined
163
- */
164
- height: PropTypes.number,
165
- /**
166
- * Indicate which axis to display the left of the charts.
167
- * Can be a string (the id of the axis) or an object `ChartsYAxisProps`.
168
- * @default yAxisIds[0] The id of the first provided axis
169
- */
170
- leftAxis: PropTypes.oneOfType([PropTypes.shape({
171
- axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
172
- classes: PropTypes.object,
173
- disableLine: PropTypes.bool,
174
- disableTicks: PropTypes.bool,
175
- fill: PropTypes.string,
176
- label: PropTypes.string,
177
- labelFontSize: PropTypes.number,
178
- labelStyle: PropTypes.object,
179
- position: PropTypes.oneOf(['left', 'right']),
180
- slotProps: PropTypes.object,
181
- slots: PropTypes.object,
182
- stroke: PropTypes.string,
183
- tickFontSize: PropTypes.number,
184
- tickInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.array, PropTypes.func]),
185
- tickLabelInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.func]),
186
- tickLabelStyle: PropTypes.object,
187
- tickMaxStep: PropTypes.number,
188
- tickMinStep: PropTypes.number,
189
- tickNumber: PropTypes.number,
190
- tickSize: PropTypes.number
191
- }), PropTypes.string]),
192
- /**
193
- * @deprecated Consider using `slotProps.legend` instead.
194
- */
195
- legend: PropTypes.shape({
196
- classes: PropTypes.object,
197
- direction: PropTypes.oneOf(['column', 'row']),
198
- hidden: PropTypes.bool,
199
- position: PropTypes.shape({
200
- horizontal: PropTypes.oneOf(['left', 'middle', 'right']).isRequired,
201
- vertical: PropTypes.oneOf(['bottom', 'middle', 'top']).isRequired
202
- }),
203
- slotProps: PropTypes.object,
204
- slots: PropTypes.object
205
- }),
206
- /**
207
- * The margin between the SVG and the drawing area.
208
- * It's used for leaving some space for extra information such as the x- and y-axis or legend.
209
- * Accepts an object with the optional properties: `top`, `bottom`, `left`, and `right`.
210
- * @default object Depends on the charts type.
211
- */
212
- margin: PropTypes.shape({
213
- bottom: PropTypes.number,
214
- left: PropTypes.number,
215
- right: PropTypes.number,
216
- top: PropTypes.number
217
- }),
218
- /**
219
- * Callback fired when clicking on a scatter item.
220
- * @param {MouseEvent} event The mouse event recorded on the `<svg/>` element if using Voronoi cells. Or the Mouse event from the scatter element, when `disableVoronoi=true`.
221
- * @param {ScatterItemIdentifier} scatterItemIdentifier The scatter item identifier.
222
- */
223
- onItemClick: PropTypes.func,
224
- /**
225
- * Indicate which axis to display the right of the charts.
226
- * Can be a string (the id of the axis) or an object `ChartsYAxisProps`.
227
- * @default null
228
- */
229
- rightAxis: PropTypes.oneOfType([PropTypes.shape({
230
- axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
231
- classes: PropTypes.object,
232
- disableLine: PropTypes.bool,
233
- disableTicks: PropTypes.bool,
234
- fill: PropTypes.string,
235
- label: PropTypes.string,
236
- labelFontSize: PropTypes.number,
237
- labelStyle: PropTypes.object,
238
- position: PropTypes.oneOf(['left', 'right']),
239
- slotProps: PropTypes.object,
240
- slots: PropTypes.object,
241
- stroke: PropTypes.string,
242
- tickFontSize: PropTypes.number,
243
- tickInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.array, PropTypes.func]),
244
- tickLabelInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.func]),
245
- tickLabelStyle: PropTypes.object,
246
- tickMaxStep: PropTypes.number,
247
- tickMinStep: PropTypes.number,
248
- tickNumber: PropTypes.number,
249
- tickSize: PropTypes.number
250
- }), PropTypes.string]),
251
- /**
252
- * The series to display in the scatter chart.
253
- */
254
- series: PropTypes.arrayOf(PropTypes.object).isRequired,
255
- /**
256
- * The props used for each component slot.
257
- * @default {}
258
- */
259
- slotProps: PropTypes.object,
260
- /**
261
- * Overridable component slots.
262
- * @default {}
263
- */
264
- slots: PropTypes.object,
265
- sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
266
- title: PropTypes.string,
267
- /**
268
- * The configuration of the tooltip.
269
- * @see See {@link https://mui.com/x/react-charts/tooltip/ tooltip docs} for more details.
270
- * @default { trigger: 'item' }
271
- */
272
- tooltip: PropTypes.shape({
273
- axisContent: PropTypes.elementType,
274
- classes: PropTypes.object,
275
- itemContent: PropTypes.elementType,
276
- slotProps: PropTypes.object,
277
- slots: PropTypes.object,
278
- trigger: PropTypes.oneOf(['axis', 'item', 'none'])
279
- }),
280
- /**
281
- * Indicate which axis to display the top of the charts.
282
- * Can be a string (the id of the axis) or an object `ChartsXAxisProps`.
283
- * @default null
284
- */
285
- topAxis: PropTypes.oneOfType([PropTypes.shape({
286
- axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
287
- classes: PropTypes.object,
288
- disableLine: PropTypes.bool,
289
- disableTicks: PropTypes.bool,
290
- fill: PropTypes.string,
291
- label: PropTypes.string,
292
- labelFontSize: PropTypes.number,
293
- labelStyle: PropTypes.object,
294
- position: PropTypes.oneOf(['bottom', 'top']),
295
- slotProps: PropTypes.object,
296
- slots: PropTypes.object,
297
- stroke: PropTypes.string,
298
- tickFontSize: PropTypes.number,
299
- tickInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.array, PropTypes.func]),
300
- tickLabelInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.func]),
301
- tickLabelStyle: PropTypes.object,
302
- tickMaxStep: PropTypes.number,
303
- tickMinStep: PropTypes.number,
304
- tickNumber: PropTypes.number,
305
- tickSize: PropTypes.number
306
- }), PropTypes.string]),
307
- viewBox: PropTypes.shape({
308
- height: PropTypes.number,
309
- width: PropTypes.number,
310
- x: PropTypes.number,
311
- y: PropTypes.number
312
- }),
313
- /**
314
- * Defines the maximal distance between a scatter point and the pointer that triggers the interaction.
315
- * If `undefined`, the radius is assumed to be infinite.
316
- * @default undefined
317
- */
318
- voronoiMaxRadius: PropTypes.number,
319
- /**
320
- * The width of the chart in px. If not defined, it takes the width of the parent element.
321
- * @default undefined
322
- */
323
- width: PropTypes.number,
324
- /**
325
- * The configuration of the x-axes.
326
- * If not provided, a default axis config is used with id set to `DEFAULT_X_AXIS_KEY`.
327
- */
328
- xAxis: PropTypes.arrayOf(PropTypes.shape({
329
- axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
330
- classes: PropTypes.object,
331
- data: PropTypes.array,
332
- dataKey: PropTypes.string,
333
- disableLine: PropTypes.bool,
334
- disableTicks: PropTypes.bool,
335
- fill: PropTypes.string,
336
- hideTooltip: PropTypes.bool,
337
- id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
338
- label: PropTypes.string,
339
- labelFontSize: PropTypes.number,
340
- labelStyle: PropTypes.object,
341
- max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
342
- min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
343
- position: PropTypes.oneOf(['bottom', 'left', 'right', 'top']),
344
- reverse: PropTypes.bool,
345
- scaleType: PropTypes.oneOf(['band', 'linear', 'log', 'point', 'pow', 'sqrt', 'time', 'utc']),
346
- slotProps: PropTypes.object,
347
- slots: PropTypes.object,
348
- stroke: PropTypes.string,
349
- tickFontSize: PropTypes.number,
350
- tickInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.array, PropTypes.func]),
351
- tickLabelInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.func]),
352
- tickLabelStyle: PropTypes.object,
353
- tickMaxStep: PropTypes.number,
354
- tickMinStep: PropTypes.number,
355
- tickNumber: PropTypes.number,
356
- tickSize: PropTypes.number,
357
- valueFormatter: PropTypes.func
358
- })),
359
- /**
360
- * The configuration of the y-axes.
361
- * If not provided, a default axis config is used with id set to `DEFAULT_Y_AXIS_KEY`.
362
- */
363
- yAxis: PropTypes.arrayOf(PropTypes.shape({
364
- axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
365
- classes: PropTypes.object,
366
- data: PropTypes.array,
367
- dataKey: PropTypes.string,
368
- disableLine: PropTypes.bool,
369
- disableTicks: PropTypes.bool,
370
- fill: PropTypes.string,
371
- hideTooltip: PropTypes.bool,
372
- id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
373
- label: PropTypes.string,
374
- labelFontSize: PropTypes.number,
375
- labelStyle: PropTypes.object,
376
- max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
377
- min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
378
- position: PropTypes.oneOf(['bottom', 'left', 'right', 'top']),
379
- reverse: PropTypes.bool,
380
- scaleType: PropTypes.oneOf(['band', 'linear', 'log', 'point', 'pow', 'sqrt', 'time', 'utc']),
381
- slotProps: PropTypes.object,
382
- slots: PropTypes.object,
383
- stroke: PropTypes.string,
384
- tickFontSize: PropTypes.number,
385
- tickInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.array, PropTypes.func]),
386
- tickLabelInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.func]),
387
- tickLabelStyle: PropTypes.object,
388
- tickMaxStep: PropTypes.number,
389
- tickMinStep: PropTypes.number,
390
- tickNumber: PropTypes.number,
391
- tickSize: PropTypes.number,
392
- valueFormatter: PropTypes.func
393
- }))
394
- } : void 0;
395
- export { ScatterChart };
@@ -1,80 +0,0 @@
1
- import _extends from "@babel/runtime/helpers/esm/extends";
2
- import * as React from 'react';
3
- import PropTypes from 'prop-types';
4
- import { Scatter } from './Scatter';
5
- import { SeriesContext } from '../context/SeriesContextProvider';
6
- import { CartesianContext } from '../context/CartesianContextProvider';
7
- import { jsx as _jsx } from "react/jsx-runtime";
8
- /**
9
- * Demos:
10
- *
11
- * - [Scatter](https://mui.com/x/react-charts/scatter/)
12
- * - [Scatter demonstration](https://mui.com/x/react-charts/scatter-demo/)
13
- *
14
- * API:
15
- *
16
- * - [ScatterPlot API](https://mui.com/x/api/charts/scatter-plot/)
17
- */
18
- function ScatterPlot(props) {
19
- var _slots$scatter;
20
- var slots = props.slots,
21
- slotProps = props.slotProps,
22
- onItemClick = props.onItemClick;
23
- var seriesData = React.useContext(SeriesContext).scatter;
24
- var axisData = React.useContext(CartesianContext);
25
- if (seriesData === undefined) {
26
- return null;
27
- }
28
- var series = seriesData.series,
29
- seriesOrder = seriesData.seriesOrder;
30
- var xAxis = axisData.xAxis,
31
- yAxis = axisData.yAxis,
32
- xAxisIds = axisData.xAxisIds,
33
- yAxisIds = axisData.yAxisIds;
34
- var defaultXAxisId = xAxisIds[0];
35
- var defaultYAxisId = yAxisIds[0];
36
- var ScatterItems = (_slots$scatter = slots == null ? void 0 : slots.scatter) != null ? _slots$scatter : Scatter;
37
- return /*#__PURE__*/_jsx(React.Fragment, {
38
- children: seriesOrder.map(function (seriesId) {
39
- var _series$seriesId = series[seriesId],
40
- id = _series$seriesId.id,
41
- xAxisKey = _series$seriesId.xAxisKey,
42
- yAxisKey = _series$seriesId.yAxisKey,
43
- markerSize = _series$seriesId.markerSize,
44
- color = _series$seriesId.color;
45
- var xScale = xAxis[xAxisKey != null ? xAxisKey : defaultXAxisId].scale;
46
- var yScale = yAxis[yAxisKey != null ? yAxisKey : defaultYAxisId].scale;
47
- return /*#__PURE__*/_jsx(ScatterItems, _extends({
48
- xScale: xScale,
49
- yScale: yScale,
50
- color: color,
51
- markerSize: markerSize != null ? markerSize : 4,
52
- series: series[seriesId],
53
- onItemClick: onItemClick
54
- }, slotProps == null ? void 0 : slotProps.scatter), id);
55
- })
56
- });
57
- }
58
- process.env.NODE_ENV !== "production" ? ScatterPlot.propTypes = {
59
- // ----------------------------- Warning --------------------------------
60
- // | These PropTypes are generated from the TypeScript type definitions |
61
- // | To update them edit the TypeScript types and run "yarn proptypes" |
62
- // ----------------------------------------------------------------------
63
- /**
64
- * Callback fired when clicking on a scatter item.
65
- * @param {MouseEvent} event Mouse event recorded on the `<svg/>` element.
66
- * @param {ScatterItemIdentifier} scatterItemIdentifier The scatter item identifier.
67
- */
68
- onItemClick: PropTypes.func,
69
- /**
70
- * The props used for each component slot.
71
- * @default {}
72
- */
73
- slotProps: PropTypes.object,
74
- /**
75
- * Overridable component slots.
76
- * @default {}
77
- */
78
- slots: PropTypes.object
79
- } : void 0;
80
- export { ScatterPlot };