@mui/x-charts 7.0.0-beta.3 → 7.0.0-beta.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.
- package/BarChart/BarChart.js +0 -2
- package/CHANGELOG.md +226 -15
- package/ChartsOnAxisClickHandler/ChartsOnAxisClickHandler.js +1 -1
- package/ChartsTooltip/utils.js +1 -1
- package/ChartsVoronoiHandler/ChartsVoronoiHandler.d.ts +0 -1
- package/ChartsVoronoiHandler/ChartsVoronoiHandler.js +1 -2
- package/ChartsXAxis/ChartsXAxis.js +1 -1
- package/ChartsYAxis/ChartsYAxis.js +1 -1
- package/Gauge/Gauge.js +0 -2
- package/Gauge/GaugeContainer.d.ts +0 -2
- package/Gauge/GaugeContainer.js +0 -2
- package/Gauge/GaugeProvider.js +3 -0
- package/Gauge/GaugeValueText.js +1 -1
- package/LineChart/LineChart.js +0 -2
- package/PieChart/PieChart.js +0 -2
- package/ResponsiveChartContainer/ResponsiveChartContainer.d.ts +0 -2
- package/ResponsiveChartContainer/ResponsiveChartContainer.js +0 -2
- package/ScatterChart/ScatterChart.js +0 -3
- package/SparkLineChart/SparkLineChart.js +0 -2
- package/context/CartesianContextProvider.d.ts +0 -8
- package/context/CartesianContextProvider.js +4 -89
- package/context/DrawingProvider.d.ts +2 -11
- package/context/DrawingProvider.js +10 -35
- package/context/HighlightProvider.js +3 -0
- package/context/InteractionProvider.js +3 -0
- package/context/SeriesContextProvider.js +3 -0
- package/context/index.d.ts +0 -2
- package/context/index.js +1 -15
- package/esm/BarChart/BarChart.js +0 -2
- package/esm/ChartsOnAxisClickHandler/ChartsOnAxisClickHandler.js +2 -2
- package/esm/ChartsTooltip/utils.js +2 -2
- package/esm/ChartsVoronoiHandler/ChartsVoronoiHandler.js +2 -3
- package/esm/ChartsXAxis/ChartsXAxis.js +1 -1
- package/esm/ChartsYAxis/ChartsYAxis.js +1 -1
- package/esm/Gauge/Gauge.js +0 -2
- package/esm/Gauge/GaugeContainer.js +0 -2
- package/esm/Gauge/GaugeProvider.js +3 -0
- package/esm/Gauge/GaugeValueText.js +1 -1
- package/esm/LineChart/LineChart.js +0 -2
- package/esm/PieChart/PieChart.js +0 -2
- package/esm/ResponsiveChartContainer/ResponsiveChartContainer.js +0 -2
- package/esm/ScatterChart/ScatterChart.js +0 -3
- package/esm/SparkLineChart/SparkLineChart.js +0 -2
- package/esm/context/CartesianContextProvider.js +3 -88
- package/esm/context/DrawingProvider.js +10 -36
- package/esm/context/HighlightProvider.js +3 -0
- package/esm/context/InteractionProvider.js +3 -0
- package/esm/context/SeriesContextProvider.js +3 -0
- package/esm/context/index.js +1 -2
- package/esm/hooks/useAxisEvents.js +2 -2
- package/hooks/useAxisEvents.js +1 -1
- package/hooks/useTicks.d.ts +1 -1
- package/index.js +1 -1
- package/modern/BarChart/BarChart.js +0 -2
- package/modern/ChartsOnAxisClickHandler/ChartsOnAxisClickHandler.js +2 -2
- package/modern/ChartsTooltip/utils.js +2 -2
- package/modern/ChartsVoronoiHandler/ChartsVoronoiHandler.js +2 -3
- package/modern/ChartsXAxis/ChartsXAxis.js +1 -1
- package/modern/ChartsYAxis/ChartsYAxis.js +1 -1
- package/modern/Gauge/Gauge.js +0 -2
- package/modern/Gauge/GaugeContainer.js +0 -2
- package/modern/Gauge/GaugeProvider.js +3 -0
- package/modern/Gauge/GaugeValueText.js +1 -1
- package/modern/LineChart/LineChart.js +0 -2
- package/modern/PieChart/PieChart.js +0 -2
- package/modern/ResponsiveChartContainer/ResponsiveChartContainer.js +0 -2
- package/modern/ScatterChart/ScatterChart.js +0 -3
- package/modern/SparkLineChart/SparkLineChart.js +0 -2
- package/modern/context/CartesianContextProvider.js +3 -88
- package/modern/context/DrawingProvider.js +10 -36
- package/modern/context/HighlightProvider.js +3 -0
- package/modern/context/InteractionProvider.js +3 -0
- package/modern/context/SeriesContextProvider.js +3 -0
- package/modern/context/index.js +1 -2
- package/modern/hooks/useAxisEvents.js +2 -2
- package/modern/index.js +1 -1
- package/package.json +1 -1
- package/legacy/BarChart/BarChart.js +0 -440
- package/legacy/BarChart/BarElement.js +0 -119
- package/legacy/BarChart/BarPlot.js +0 -232
- package/legacy/BarChart/extremums.js +0 -45
- package/legacy/BarChart/formatter.js +0 -78
- package/legacy/BarChart/index.js +0 -3
- package/legacy/BarChart/legend.js +0 -15
- package/legacy/ChartContainer/ChartContainer.js +0 -189
- package/legacy/ChartContainer/index.js +0 -1
- package/legacy/ChartsAxis/ChartsAxis.js +0 -215
- package/legacy/ChartsAxis/axisClasses.js +0 -5
- package/legacy/ChartsAxis/index.js +0 -2
- package/legacy/ChartsAxisHighlight/ChartsAxisHighlight.js +0 -105
- package/legacy/ChartsAxisHighlight/index.js +0 -1
- package/legacy/ChartsClipPath/ChartsClipPath.js +0 -48
- package/legacy/ChartsClipPath/index.js +0 -1
- package/legacy/ChartsGrid/ChartsGrid.js +0 -119
- package/legacy/ChartsGrid/chartsGridClasses.js +0 -6
- package/legacy/ChartsGrid/index.js +0 -2
- package/legacy/ChartsLegend/ChartsLegend.js +0 -100
- package/legacy/ChartsLegend/DefaultChartsLegend.js +0 -302
- package/legacy/ChartsLegend/chartsLegendClasses.js +0 -5
- package/legacy/ChartsLegend/index.js +0 -4
- package/legacy/ChartsLegend/utils.js +0 -15
- package/legacy/ChartsOnAxisClickHandler/ChartsOnAxisClickHandler.js +0 -75
- package/legacy/ChartsOnAxisClickHandler/index.js +0 -1
- package/legacy/ChartsReferenceLine/ChartsReferenceLine.js +0 -72
- package/legacy/ChartsReferenceLine/ChartsXReferenceLine.js +0 -105
- package/legacy/ChartsReferenceLine/ChartsYReferenceLine.js +0 -105
- package/legacy/ChartsReferenceLine/chartsReferenceLineClasses.js +0 -6
- package/legacy/ChartsReferenceLine/common.js +0 -19
- package/legacy/ChartsReferenceLine/index.js +0 -2
- package/legacy/ChartsSurface.js +0 -78
- package/legacy/ChartsText/ChartsText.js +0 -95
- package/legacy/ChartsText/index.js +0 -1
- package/legacy/ChartsTooltip/ChartsAxisTooltipContent.js +0 -96
- package/legacy/ChartsTooltip/ChartsItemTooltipContent.js +0 -53
- package/legacy/ChartsTooltip/ChartsTooltip.js +0 -148
- package/legacy/ChartsTooltip/ChartsTooltipTable.js +0 -80
- package/legacy/ChartsTooltip/DefaultChartsAxisTooltipContent.js +0 -118
- package/legacy/ChartsTooltip/DefaultChartsItemTooltipContent.js +0 -78
- package/legacy/ChartsTooltip/chartsTooltipClasses.js +0 -5
- package/legacy/ChartsTooltip/index.js +0 -6
- package/legacy/ChartsTooltip/utils.js +0 -103
- package/legacy/ChartsVoronoiHandler/ChartsVoronoiHandler.js +0 -206
- package/legacy/ChartsVoronoiHandler/index.js +0 -1
- package/legacy/ChartsXAxis/ChartsXAxis.js +0 -339
- package/legacy/ChartsXAxis/index.js +0 -1
- package/legacy/ChartsYAxis/ChartsYAxis.js +0 -267
- package/legacy/ChartsYAxis/index.js +0 -1
- package/legacy/Gauge/Gauge.js +0 -146
- package/legacy/Gauge/GaugeContainer.js +0 -215
- package/legacy/Gauge/GaugeProvider.js +0 -87
- package/legacy/Gauge/GaugeReferenceArc.js +0 -37
- package/legacy/Gauge/GaugeValueArc.js +0 -44
- package/legacy/Gauge/GaugeValueText.js +0 -66
- package/legacy/Gauge/gaugeClasses.js +0 -7
- package/legacy/Gauge/index.js +0 -7
- package/legacy/Gauge/utils.js +0 -84
- package/legacy/LineChart/AnimatedArea.js +0 -102
- package/legacy/LineChart/AnimatedLine.js +0 -104
- package/legacy/LineChart/AreaElement.js +0 -112
- package/legacy/LineChart/AreaPlot.js +0 -149
- package/legacy/LineChart/LineChart.js +0 -452
- package/legacy/LineChart/LineElement.js +0 -112
- package/legacy/LineChart/LineHighlightElement.js +0 -79
- package/legacy/LineChart/LineHighlightPlot.js +0 -97
- package/legacy/LineChart/LinePlot.js +0 -144
- package/legacy/LineChart/MarkElement.js +0 -153
- package/legacy/LineChart/MarkPlot.js +0 -178
- package/legacy/LineChart/extremums.js +0 -54
- package/legacy/LineChart/formatter.js +0 -82
- package/legacy/LineChart/index.js +0 -11
- package/legacy/LineChart/legend.js +0 -15
- package/legacy/PieChart/PieArc.js +0 -103
- package/legacy/PieChart/PieArcLabel.js +0 -112
- package/legacy/PieChart/PieArcLabelPlot.js +0 -193
- package/legacy/PieChart/PieArcPlot.js +0 -180
- package/legacy/PieChart/PieChart.js +0 -404
- package/legacy/PieChart/PiePlot.js +0 -137
- package/legacy/PieChart/dataTransform/transition.js +0 -149
- package/legacy/PieChart/dataTransform/useTransformData.js +0 -63
- package/legacy/PieChart/formatter.js +0 -55
- package/legacy/PieChart/index.js +0 -6
- package/legacy/PieChart/legend.js +0 -16
- package/legacy/ResponsiveChartContainer/ResponsiveChartContainer.js +0 -185
- package/legacy/ResponsiveChartContainer/index.js +0 -1
- package/legacy/ResponsiveChartContainer/useChartContainerDimensions.js +0 -73
- package/legacy/ScatterChart/Scatter.js +0 -110
- package/legacy/ScatterChart/ScatterChart.js +0 -395
- package/legacy/ScatterChart/ScatterPlot.js +0 -80
- package/legacy/ScatterChart/extremums.js +0 -39
- package/legacy/ScatterChart/formatter.js +0 -12
- package/legacy/ScatterChart/index.js +0 -3
- package/legacy/ScatterChart/legend.js +0 -15
- package/legacy/SparkLineChart/SparkLineChart.js +0 -266
- package/legacy/SparkLineChart/index.js +0 -1
- package/legacy/colorPalettes/colorPalettes.js +0 -15
- package/legacy/colorPalettes/index.js +0 -1
- package/legacy/constants.js +0 -8
- package/legacy/context/CartesianContextProvider.js +0 -327
- package/legacy/context/DrawingProvider.js +0 -74
- package/legacy/context/HighlightProvider.js +0 -56
- package/legacy/context/InteractionProvider.js +0 -81
- package/legacy/context/SeriesContextProvider.js +0 -74
- package/legacy/context/index.js +0 -2
- package/legacy/hooks/index.js +0 -2
- package/legacy/hooks/useAxisEvents.js +0 -120
- package/legacy/hooks/useChartDimensions.js +0 -18
- package/legacy/hooks/useDrawingArea.js +0 -21
- package/legacy/hooks/useInteractionItemProps.js +0 -71
- package/legacy/hooks/useMounted.js +0 -21
- package/legacy/hooks/useReducedMotion.js +0 -27
- package/legacy/hooks/useScale.js +0 -33
- package/legacy/hooks/useTicks.js +0 -65
- package/legacy/index.js +0 -33
- package/legacy/internals/components/AxisSharedComponents.js +0 -25
- package/legacy/internals/defaultizeColor.js +0 -17
- package/legacy/internals/defaultizeValueFormatter.js +0 -12
- package/legacy/internals/domUtils.js +0 -121
- package/legacy/internals/geometry.js +0 -37
- package/legacy/internals/getCurve.js +0 -39
- package/legacy/internals/getScale.js +0 -17
- package/legacy/internals/getWordsByLines.js +0 -15
- package/legacy/internals/isBandScale.js +0 -3
- package/legacy/internals/stackSeries.js +0 -92
- package/legacy/internals/useAnimatedPath.js +0 -32
- package/legacy/internals/utils.js +0 -52
- package/legacy/models/axis.js +0 -6
- package/legacy/models/helpers.js +0 -1
- package/legacy/models/index.js +0 -4
- package/legacy/models/layout.js +0 -1
- package/legacy/models/seriesType/bar.js +0 -1
- package/legacy/models/seriesType/common.js +0 -1
- package/legacy/models/seriesType/config.js +0 -1
- package/legacy/models/seriesType/index.js +0 -5
- package/legacy/models/seriesType/line.js +0 -1
- package/legacy/models/seriesType/pie.js +0 -1
- package/legacy/models/seriesType/scatter.js +0 -1
- package/legacy/models/stacking.js +0 -1
- package/legacy/themeAugmentation/index.js +0 -3
|
@@ -1,302 +0,0 @@
|
|
|
1
|
-
import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
|
|
2
|
-
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
3
|
-
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
4
|
-
var _excluded = ["rotate", "dominantBaseline"],
|
|
5
|
-
_excluded2 = ["label"];
|
|
6
|
-
import * as React from 'react';
|
|
7
|
-
import PropTypes from 'prop-types';
|
|
8
|
-
import { NoSsr } from '@mui/base/NoSsr';
|
|
9
|
-
import { useTheme, styled } from '@mui/material/styles';
|
|
10
|
-
import { ChartsText } from '../ChartsText';
|
|
11
|
-
import { getWordsByLines } from '../internals/getWordsByLines';
|
|
12
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
13
|
-
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
14
|
-
export var ChartsLegendRoot = styled('g', {
|
|
15
|
-
name: 'MuiChartsLegend',
|
|
16
|
-
slot: 'Root',
|
|
17
|
-
overridesResolver: function overridesResolver(props, styles) {
|
|
18
|
-
return styles.root;
|
|
19
|
-
}
|
|
20
|
-
})({});
|
|
21
|
-
/**
|
|
22
|
-
* Transforms number or partial padding object to a defaultized padding object.
|
|
23
|
-
*/
|
|
24
|
-
var getStandardizedPadding = function getStandardizedPadding(padding) {
|
|
25
|
-
if (typeof padding === 'number') {
|
|
26
|
-
return {
|
|
27
|
-
left: padding,
|
|
28
|
-
right: padding,
|
|
29
|
-
top: padding,
|
|
30
|
-
bottom: padding
|
|
31
|
-
};
|
|
32
|
-
}
|
|
33
|
-
return _extends({
|
|
34
|
-
left: 0,
|
|
35
|
-
right: 0,
|
|
36
|
-
top: 0,
|
|
37
|
-
bottom: 0
|
|
38
|
-
}, padding);
|
|
39
|
-
};
|
|
40
|
-
function DefaultChartsLegend(props) {
|
|
41
|
-
var hidden = props.hidden,
|
|
42
|
-
position = props.position,
|
|
43
|
-
direction = props.direction,
|
|
44
|
-
seriesToDisplay = props.seriesToDisplay,
|
|
45
|
-
drawingArea = props.drawingArea,
|
|
46
|
-
classes = props.classes,
|
|
47
|
-
_props$itemMarkWidth = props.itemMarkWidth,
|
|
48
|
-
itemMarkWidth = _props$itemMarkWidth === void 0 ? 20 : _props$itemMarkWidth,
|
|
49
|
-
_props$itemMarkHeight = props.itemMarkHeight,
|
|
50
|
-
itemMarkHeight = _props$itemMarkHeight === void 0 ? 20 : _props$itemMarkHeight,
|
|
51
|
-
_props$markGap = props.markGap,
|
|
52
|
-
markGap = _props$markGap === void 0 ? 5 : _props$markGap,
|
|
53
|
-
_props$itemGap = props.itemGap,
|
|
54
|
-
itemGap = _props$itemGap === void 0 ? 10 : _props$itemGap,
|
|
55
|
-
_props$padding = props.padding,
|
|
56
|
-
paddingProps = _props$padding === void 0 ? 10 : _props$padding,
|
|
57
|
-
inLabelStyle = props.labelStyle;
|
|
58
|
-
var theme = useTheme();
|
|
59
|
-
var labelStyle = React.useMemo(function () {
|
|
60
|
-
return _extends({}, theme.typography.subtitle1, {
|
|
61
|
-
color: 'inherit',
|
|
62
|
-
dominantBaseline: 'central',
|
|
63
|
-
textAnchor: 'start',
|
|
64
|
-
fill: (theme.vars || theme).palette.text.primary,
|
|
65
|
-
lineHeight: 1
|
|
66
|
-
}, inLabelStyle);
|
|
67
|
-
},
|
|
68
|
-
// To say to TS that the dominantBaseline and textAnchor are correct
|
|
69
|
-
[inLabelStyle, theme]);
|
|
70
|
-
var padding = React.useMemo(function () {
|
|
71
|
-
return getStandardizedPadding(paddingProps);
|
|
72
|
-
}, [paddingProps]);
|
|
73
|
-
var getItemSpace = React.useCallback(function (label) {
|
|
74
|
-
var inStyle = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
75
|
-
var rotate = inStyle.rotate,
|
|
76
|
-
dominantBaseline = inStyle.dominantBaseline,
|
|
77
|
-
style = _objectWithoutProperties(inStyle, _excluded);
|
|
78
|
-
var linesSize = getWordsByLines({
|
|
79
|
-
style: style,
|
|
80
|
-
needsComputation: true,
|
|
81
|
-
text: label
|
|
82
|
-
});
|
|
83
|
-
var innerSize = {
|
|
84
|
-
innerWidth: itemMarkWidth + markGap + Math.max.apply(Math, _toConsumableArray(linesSize.map(function (size) {
|
|
85
|
-
return size.width;
|
|
86
|
-
}))),
|
|
87
|
-
innerHeight: Math.max(itemMarkHeight, linesSize.length * linesSize[0].height)
|
|
88
|
-
};
|
|
89
|
-
return _extends({}, innerSize, {
|
|
90
|
-
outerWidth: innerSize.innerWidth + itemGap,
|
|
91
|
-
outerHeight: innerSize.innerHeight + itemGap
|
|
92
|
-
});
|
|
93
|
-
}, [itemGap, itemMarkHeight, itemMarkWidth, markGap]);
|
|
94
|
-
var totalWidth = drawingArea.left + drawingArea.width + drawingArea.right;
|
|
95
|
-
var totalHeight = drawingArea.top + drawingArea.height + drawingArea.bottom;
|
|
96
|
-
var availableWidth = totalWidth - padding.left - padding.right;
|
|
97
|
-
var availableHeight = totalHeight - padding.top - padding.bottom;
|
|
98
|
-
var seriesWithPosition = React.useMemo(function () {
|
|
99
|
-
// Start at 0, 0. Will be modified later by padding and position.
|
|
100
|
-
var x = 0;
|
|
101
|
-
var y = 0;
|
|
102
|
-
|
|
103
|
-
// total values used to align legend later.
|
|
104
|
-
var totalWidthUsed = 0;
|
|
105
|
-
var totalHeightUsed = 0;
|
|
106
|
-
var rowIndex = 0;
|
|
107
|
-
var rowMaxHeight = [0];
|
|
108
|
-
var seriesWithRawPosition = seriesToDisplay.map(function (_ref) {
|
|
109
|
-
var label = _ref.label,
|
|
110
|
-
other = _objectWithoutProperties(_ref, _excluded2);
|
|
111
|
-
var itemSpace = getItemSpace(label, labelStyle);
|
|
112
|
-
var rep = _extends({}, other, {
|
|
113
|
-
label: label,
|
|
114
|
-
positionX: x,
|
|
115
|
-
positionY: y,
|
|
116
|
-
innerHeight: itemSpace.innerHeight,
|
|
117
|
-
innerWidth: itemSpace.innerWidth,
|
|
118
|
-
outerHeight: itemSpace.outerHeight,
|
|
119
|
-
outerWidth: itemSpace.outerWidth,
|
|
120
|
-
rowIndex: rowIndex
|
|
121
|
-
});
|
|
122
|
-
if (direction === 'row') {
|
|
123
|
-
if (x + itemSpace.innerWidth > availableWidth) {
|
|
124
|
-
// This legend item would create overflow along the x-axis, so we start a new row.
|
|
125
|
-
x = 0;
|
|
126
|
-
y += rowMaxHeight[rowIndex];
|
|
127
|
-
rowIndex += 1;
|
|
128
|
-
if (rowMaxHeight.length <= rowIndex) {
|
|
129
|
-
rowMaxHeight.push(0);
|
|
130
|
-
}
|
|
131
|
-
rep.positionX = x;
|
|
132
|
-
rep.positionY = y;
|
|
133
|
-
rep.rowIndex = rowIndex;
|
|
134
|
-
}
|
|
135
|
-
totalWidthUsed = Math.max(totalWidthUsed, x + itemSpace.outerWidth);
|
|
136
|
-
totalHeightUsed = Math.max(totalHeightUsed, y + itemSpace.outerHeight);
|
|
137
|
-
rowMaxHeight[rowIndex] = Math.max(rowMaxHeight[rowIndex], itemSpace.outerHeight);
|
|
138
|
-
x += itemSpace.outerWidth;
|
|
139
|
-
}
|
|
140
|
-
if (direction === 'column') {
|
|
141
|
-
if (y + itemSpace.innerHeight > availableHeight) {
|
|
142
|
-
// This legend item would create overflow along the y-axis, so we start a new column.
|
|
143
|
-
x = totalWidthUsed + itemGap;
|
|
144
|
-
y = 0;
|
|
145
|
-
rowIndex = 0;
|
|
146
|
-
rep.positionX = x;
|
|
147
|
-
rep.positionY = y;
|
|
148
|
-
rep.rowIndex = rowIndex;
|
|
149
|
-
}
|
|
150
|
-
if (rowMaxHeight.length <= rowIndex) {
|
|
151
|
-
rowMaxHeight.push(0);
|
|
152
|
-
}
|
|
153
|
-
totalWidthUsed = Math.max(totalWidthUsed, x + itemSpace.outerWidth);
|
|
154
|
-
totalHeightUsed = Math.max(totalHeightUsed, y + itemSpace.outerHeight);
|
|
155
|
-
rowIndex += 1;
|
|
156
|
-
y += itemSpace.outerHeight;
|
|
157
|
-
}
|
|
158
|
-
return rep;
|
|
159
|
-
});
|
|
160
|
-
|
|
161
|
-
// Move the legend according to padding and position
|
|
162
|
-
var gapX = 0;
|
|
163
|
-
var gapY = 0;
|
|
164
|
-
switch (position.horizontal) {
|
|
165
|
-
case 'left':
|
|
166
|
-
gapX = padding.left;
|
|
167
|
-
break;
|
|
168
|
-
case 'right':
|
|
169
|
-
gapX = totalWidth - padding.right - totalWidthUsed;
|
|
170
|
-
break;
|
|
171
|
-
default:
|
|
172
|
-
gapX = (totalWidth - totalWidthUsed) / 2;
|
|
173
|
-
break;
|
|
174
|
-
}
|
|
175
|
-
switch (position.vertical) {
|
|
176
|
-
case 'top':
|
|
177
|
-
gapY = padding.top;
|
|
178
|
-
break;
|
|
179
|
-
case 'bottom':
|
|
180
|
-
gapY = totalHeight - padding.bottom - totalHeightUsed;
|
|
181
|
-
break;
|
|
182
|
-
default:
|
|
183
|
-
gapY = (totalHeight - totalHeightUsed) / 2;
|
|
184
|
-
break;
|
|
185
|
-
}
|
|
186
|
-
return seriesWithRawPosition.map(function (item) {
|
|
187
|
-
return _extends({}, item, {
|
|
188
|
-
// Add the gap due to the position
|
|
189
|
-
positionX: item.positionX + gapX,
|
|
190
|
-
// Add the gap due to the position
|
|
191
|
-
positionY: item.positionY + gapY + (direction === 'row' ? rowMaxHeight[item.rowIndex] / 2 // Get the center of the entire row
|
|
192
|
-
: item.outerHeight / 2) // Get the center of the item
|
|
193
|
-
});
|
|
194
|
-
});
|
|
195
|
-
}, [seriesToDisplay, position.horizontal, position.vertical, getItemSpace, labelStyle, direction, availableWidth, availableHeight, itemGap, padding.left, padding.right, padding.top, padding.bottom, totalWidth, totalHeight]);
|
|
196
|
-
if (hidden) {
|
|
197
|
-
return null;
|
|
198
|
-
}
|
|
199
|
-
return /*#__PURE__*/_jsx(NoSsr, {
|
|
200
|
-
children: /*#__PURE__*/_jsx(ChartsLegendRoot, {
|
|
201
|
-
className: classes.root,
|
|
202
|
-
children: seriesWithPosition.map(function (_ref2) {
|
|
203
|
-
var id = _ref2.id,
|
|
204
|
-
label = _ref2.label,
|
|
205
|
-
color = _ref2.color,
|
|
206
|
-
positionX = _ref2.positionX,
|
|
207
|
-
positionY = _ref2.positionY;
|
|
208
|
-
return /*#__PURE__*/_jsxs("g", {
|
|
209
|
-
className: classes.series,
|
|
210
|
-
transform: "translate(".concat(positionX, " ").concat(positionY, ")"),
|
|
211
|
-
children: [/*#__PURE__*/_jsx("rect", {
|
|
212
|
-
className: classes.mark,
|
|
213
|
-
y: -itemMarkHeight / 2,
|
|
214
|
-
width: itemMarkWidth,
|
|
215
|
-
height: itemMarkHeight,
|
|
216
|
-
fill: color
|
|
217
|
-
}), /*#__PURE__*/_jsx(ChartsText, {
|
|
218
|
-
style: labelStyle,
|
|
219
|
-
text: label,
|
|
220
|
-
x: itemMarkWidth + markGap,
|
|
221
|
-
y: 0
|
|
222
|
-
})]
|
|
223
|
-
}, id);
|
|
224
|
-
})
|
|
225
|
-
})
|
|
226
|
-
});
|
|
227
|
-
}
|
|
228
|
-
process.env.NODE_ENV !== "production" ? DefaultChartsLegend.propTypes = {
|
|
229
|
-
// ----------------------------- Warning --------------------------------
|
|
230
|
-
// | These PropTypes are generated from the TypeScript type definitions |
|
|
231
|
-
// | To update them edit the TypeScript types and run "yarn proptypes" |
|
|
232
|
-
// ----------------------------------------------------------------------
|
|
233
|
-
/**
|
|
234
|
-
* Override or extend the styles applied to the component.
|
|
235
|
-
*/
|
|
236
|
-
classes: PropTypes.object.isRequired,
|
|
237
|
-
/**
|
|
238
|
-
* The direction of the legend layout.
|
|
239
|
-
* The default depends on the chart.
|
|
240
|
-
*/
|
|
241
|
-
direction: PropTypes.oneOf(['column', 'row']).isRequired,
|
|
242
|
-
drawingArea: PropTypes.shape({
|
|
243
|
-
bottom: PropTypes.number.isRequired,
|
|
244
|
-
height: PropTypes.number.isRequired,
|
|
245
|
-
left: PropTypes.number.isRequired,
|
|
246
|
-
right: PropTypes.number.isRequired,
|
|
247
|
-
top: PropTypes.number.isRequired,
|
|
248
|
-
width: PropTypes.number.isRequired
|
|
249
|
-
}).isRequired,
|
|
250
|
-
/**
|
|
251
|
-
* Set to true to hide the legend.
|
|
252
|
-
* @default false
|
|
253
|
-
*/
|
|
254
|
-
hidden: PropTypes.bool,
|
|
255
|
-
/**
|
|
256
|
-
* Space between two legend items (in px).
|
|
257
|
-
* @default 10
|
|
258
|
-
*/
|
|
259
|
-
itemGap: PropTypes.number,
|
|
260
|
-
/**
|
|
261
|
-
* Height of the item mark (in px).
|
|
262
|
-
* @default 20
|
|
263
|
-
*/
|
|
264
|
-
itemMarkHeight: PropTypes.number,
|
|
265
|
-
/**
|
|
266
|
-
* Width of the item mark (in px).
|
|
267
|
-
* @default 20
|
|
268
|
-
*/
|
|
269
|
-
itemMarkWidth: PropTypes.number,
|
|
270
|
-
/**
|
|
271
|
-
* Style applied to legend labels.
|
|
272
|
-
* @default theme.typography.subtitle1
|
|
273
|
-
*/
|
|
274
|
-
labelStyle: PropTypes.object,
|
|
275
|
-
/**
|
|
276
|
-
* Space between the mark and the label (in px).
|
|
277
|
-
* @default 5
|
|
278
|
-
*/
|
|
279
|
-
markGap: PropTypes.number,
|
|
280
|
-
/**
|
|
281
|
-
* Legend padding (in px).
|
|
282
|
-
* Can either be a single number, or an object with top, left, bottom, right properties.
|
|
283
|
-
* @default 10
|
|
284
|
-
*/
|
|
285
|
-
padding: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({
|
|
286
|
-
bottom: PropTypes.number,
|
|
287
|
-
left: PropTypes.number,
|
|
288
|
-
right: PropTypes.number,
|
|
289
|
-
top: PropTypes.number
|
|
290
|
-
})]),
|
|
291
|
-
position: PropTypes.shape({
|
|
292
|
-
horizontal: PropTypes.oneOf(['left', 'middle', 'right']).isRequired,
|
|
293
|
-
vertical: PropTypes.oneOf(['bottom', 'middle', 'top']).isRequired
|
|
294
|
-
}).isRequired,
|
|
295
|
-
series: PropTypes.object.isRequired,
|
|
296
|
-
seriesToDisplay: PropTypes.arrayOf(PropTypes.shape({
|
|
297
|
-
color: PropTypes.string.isRequired,
|
|
298
|
-
id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,
|
|
299
|
-
label: PropTypes.string.isRequired
|
|
300
|
-
})).isRequired
|
|
301
|
-
} : void 0;
|
|
302
|
-
export { DefaultChartsLegend };
|
|
@@ -1,5 +0,0 @@
|
|
|
1
|
-
import { unstable_generateUtilityClass as generateUtilityClass, unstable_generateUtilityClasses as generateUtilityClasses } from '@mui/utils';
|
|
2
|
-
export function getLegendUtilityClass(slot) {
|
|
3
|
-
return generateUtilityClass('MuiChartsLegend', slot);
|
|
4
|
-
}
|
|
5
|
-
export var legendClasses = generateUtilityClasses('MuiChartsLegend', ['root', 'series', 'mark', 'label', 'column', 'row']);
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import getBarLegend from '../BarChart/legend';
|
|
2
|
-
import getScatterLegend from '../ScatterChart/legend';
|
|
3
|
-
import getLineLegend from '../LineChart/legend';
|
|
4
|
-
import getPieLegend from '../PieChart/legend';
|
|
5
|
-
var legendGetter = {
|
|
6
|
-
bar: getBarLegend,
|
|
7
|
-
scatter: getScatterLegend,
|
|
8
|
-
line: getLineLegend,
|
|
9
|
-
pie: getPieLegend
|
|
10
|
-
};
|
|
11
|
-
export function getSeriesToDisplay(series) {
|
|
12
|
-
return Object.keys(series).flatMap(function (seriesType) {
|
|
13
|
-
return legendGetter[seriesType](series[seriesType]);
|
|
14
|
-
});
|
|
15
|
-
}
|
|
@@ -1,75 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import PropTypes from 'prop-types';
|
|
3
|
-
import { SVGContext } from '../context/DrawingProvider';
|
|
4
|
-
import { InteractionContext } from '../context/InteractionProvider';
|
|
5
|
-
import { CartesianContext } from '../context/CartesianContextProvider';
|
|
6
|
-
import { SeriesContext } from '../context/SeriesContextProvider';
|
|
7
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
8
|
-
function ChartsOnAxisClickHandler(props) {
|
|
9
|
-
var onAxisClick = props.onAxisClick;
|
|
10
|
-
var svgRef = React.useContext(SVGContext);
|
|
11
|
-
var series = React.useContext(SeriesContext);
|
|
12
|
-
var _React$useContext = React.useContext(InteractionContext),
|
|
13
|
-
axis = _React$useContext.axis;
|
|
14
|
-
var _React$useContext2 = React.useContext(CartesianContext),
|
|
15
|
-
xAxisIds = _React$useContext2.xAxisIds,
|
|
16
|
-
xAxis = _React$useContext2.xAxis,
|
|
17
|
-
yAxisIds = _React$useContext2.yAxisIds,
|
|
18
|
-
yAxis = _React$useContext2.yAxis;
|
|
19
|
-
React.useEffect(function () {
|
|
20
|
-
var element = svgRef.current;
|
|
21
|
-
if (element === null || !onAxisClick) {
|
|
22
|
-
return function () {};
|
|
23
|
-
}
|
|
24
|
-
var handleMouseClick = function handleMouseClick(event) {
|
|
25
|
-
var _USED_AXIS_ID$data;
|
|
26
|
-
event.preventDefault();
|
|
27
|
-
var isXaxis = (axis.x && axis.x.index) !== undefined;
|
|
28
|
-
var USED_AXIS_ID = isXaxis ? xAxisIds[0] : yAxisIds[0];
|
|
29
|
-
var dataIndex = isXaxis ? axis.x && axis.x.index : axis.y && axis.y.index;
|
|
30
|
-
if (dataIndex == null) {
|
|
31
|
-
return;
|
|
32
|
-
}
|
|
33
|
-
var seriesValues = {};
|
|
34
|
-
Object.keys(series).filter(function (seriesType) {
|
|
35
|
-
return ['bar', 'line'].includes(seriesType);
|
|
36
|
-
}).forEach(function (seriesType) {
|
|
37
|
-
var _series$seriesType;
|
|
38
|
-
(_series$seriesType = series[seriesType]) == null || _series$seriesType.seriesOrder.forEach(function (seriesId) {
|
|
39
|
-
var seriesItem = series[seriesType].series[seriesId];
|
|
40
|
-
var axisKey = isXaxis ? seriesItem.xAxisKey : seriesItem.yAxisKey;
|
|
41
|
-
if (axisKey === undefined || axisKey === USED_AXIS_ID) {
|
|
42
|
-
seriesValues[seriesId] = seriesItem.data[dataIndex];
|
|
43
|
-
}
|
|
44
|
-
});
|
|
45
|
-
});
|
|
46
|
-
var axisValue = (_USED_AXIS_ID$data = (isXaxis ? xAxis : yAxis)[USED_AXIS_ID].data) == null ? void 0 : _USED_AXIS_ID$data[dataIndex];
|
|
47
|
-
onAxisClick(event, {
|
|
48
|
-
dataIndex: dataIndex,
|
|
49
|
-
axisValue: axisValue,
|
|
50
|
-
seriesValues: seriesValues
|
|
51
|
-
});
|
|
52
|
-
};
|
|
53
|
-
element.addEventListener('click', handleMouseClick);
|
|
54
|
-
return function () {
|
|
55
|
-
element.removeEventListener('click', handleMouseClick);
|
|
56
|
-
};
|
|
57
|
-
}, [axis.x, axis.y, onAxisClick, series, svgRef, xAxis, xAxisIds, yAxis, yAxisIds]);
|
|
58
|
-
|
|
59
|
-
// eslint-disable-next-line react/jsx-no-useless-fragment
|
|
60
|
-
return /*#__PURE__*/_jsx(React.Fragment, {});
|
|
61
|
-
}
|
|
62
|
-
process.env.NODE_ENV !== "production" ? ChartsOnAxisClickHandler.propTypes = {
|
|
63
|
-
// ----------------------------- Warning --------------------------------
|
|
64
|
-
// | These PropTypes are generated from the TypeScript type definitions |
|
|
65
|
-
// | To update them edit the TypeScript types and run "yarn proptypes" |
|
|
66
|
-
// ----------------------------------------------------------------------
|
|
67
|
-
/**
|
|
68
|
-
* The function called for onClick events.
|
|
69
|
-
* The second argument contains information about all line/bar elements at the current mouse position.
|
|
70
|
-
* @param {MouseEvent} event The mouse event recorded on the `<svg/>` element.
|
|
71
|
-
* @param {null | AxisData} data The data about the clicked axis and items associated with it.
|
|
72
|
-
*/
|
|
73
|
-
onAxisClick: PropTypes.func
|
|
74
|
-
} : void 0;
|
|
75
|
-
export { ChartsOnAxisClickHandler };
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from './ChartsOnAxisClickHandler';
|
|
@@ -1,72 +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 { ChartsXReferenceLine } from './ChartsXReferenceLine';
|
|
5
|
-
import { ChartsYReferenceLine } from './ChartsYReferenceLine';
|
|
6
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
7
|
-
function ChartsReferenceLine(props) {
|
|
8
|
-
var x = props.x,
|
|
9
|
-
y = props.y;
|
|
10
|
-
if (x !== undefined && y !== undefined) {
|
|
11
|
-
throw new Error('MUI X Charts: The ChartsReferenceLine cannot have both `x` and `y` props set.');
|
|
12
|
-
}
|
|
13
|
-
if (x === undefined && y === undefined) {
|
|
14
|
-
throw new Error('MUI X Charts: The ChartsReferenceLine should have a value in `x` or `y` prop.');
|
|
15
|
-
}
|
|
16
|
-
if (x !== undefined) {
|
|
17
|
-
return /*#__PURE__*/_jsx(ChartsXReferenceLine, _extends({}, props));
|
|
18
|
-
}
|
|
19
|
-
return /*#__PURE__*/_jsx(ChartsYReferenceLine, _extends({}, props));
|
|
20
|
-
}
|
|
21
|
-
process.env.NODE_ENV !== "production" ? ChartsReferenceLine.propTypes = {
|
|
22
|
-
// ----------------------------- Warning --------------------------------
|
|
23
|
-
// | These PropTypes are generated from the TypeScript type definitions |
|
|
24
|
-
// | To update them edit the TypeScript types and run "yarn proptypes" |
|
|
25
|
-
// ----------------------------------------------------------------------
|
|
26
|
-
/**
|
|
27
|
-
* The id of the axis used for the reference value.
|
|
28
|
-
* @default The `id` of the first defined axis.
|
|
29
|
-
*/
|
|
30
|
-
axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
|
31
|
-
/**
|
|
32
|
-
* Override or extend the styles applied to the component.
|
|
33
|
-
*/
|
|
34
|
-
classes: PropTypes.object,
|
|
35
|
-
/**
|
|
36
|
-
* The label to display along the reference line.
|
|
37
|
-
*/
|
|
38
|
-
label: PropTypes.string,
|
|
39
|
-
/**
|
|
40
|
-
* The alignment if the label is in the chart drawing area.
|
|
41
|
-
* @default 'middle'
|
|
42
|
-
*/
|
|
43
|
-
labelAlign: PropTypes.oneOf(['end', 'middle', 'start']),
|
|
44
|
-
/**
|
|
45
|
-
* The style applied to the label.
|
|
46
|
-
*/
|
|
47
|
-
labelStyle: PropTypes.object,
|
|
48
|
-
/**
|
|
49
|
-
* The style applied to the line.
|
|
50
|
-
*/
|
|
51
|
-
lineStyle: PropTypes.object,
|
|
52
|
-
/**
|
|
53
|
-
* Additional space arround the label in px.
|
|
54
|
-
* Can be a number or an object `{ x, y }` to distinguish space with the reference line and space with axes.
|
|
55
|
-
* @default 5
|
|
56
|
-
*/
|
|
57
|
-
spacing: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({
|
|
58
|
-
x: PropTypes.number,
|
|
59
|
-
y: PropTypes.number
|
|
60
|
-
})]),
|
|
61
|
-
/**
|
|
62
|
-
* The x value associated with the reference line.
|
|
63
|
-
* If defined the reference line will be vertical.
|
|
64
|
-
*/
|
|
65
|
-
x: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number, PropTypes.string]),
|
|
66
|
-
/**
|
|
67
|
-
* The y value associated with the reference line.
|
|
68
|
-
* If defined the reference line will be horizontal.
|
|
69
|
-
*/
|
|
70
|
-
y: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number, PropTypes.string])
|
|
71
|
-
} : void 0;
|
|
72
|
-
export { ChartsReferenceLine };
|
|
@@ -1,105 +0,0 @@
|
|
|
1
|
-
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
|
-
import _typeof from "@babel/runtime/helpers/esm/typeof";
|
|
3
|
-
import * as React from 'react';
|
|
4
|
-
import composeClasses from '@mui/utils/composeClasses';
|
|
5
|
-
import { useDrawingArea, useXScale } from '../hooks';
|
|
6
|
-
import { ReferenceLineRoot } from './common';
|
|
7
|
-
import { ChartsText } from '../ChartsText';
|
|
8
|
-
import { getReferenceLineUtilityClass } from './chartsReferenceLineClasses';
|
|
9
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
-
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
11
|
-
var getTextParams = function getTextParams(_ref) {
|
|
12
|
-
var top = _ref.top,
|
|
13
|
-
height = _ref.height,
|
|
14
|
-
spacingY = _ref.spacingY,
|
|
15
|
-
_ref$labelAlign = _ref.labelAlign,
|
|
16
|
-
labelAlign = _ref$labelAlign === void 0 ? 'middle' : _ref$labelAlign;
|
|
17
|
-
switch (labelAlign) {
|
|
18
|
-
case 'start':
|
|
19
|
-
return {
|
|
20
|
-
y: top + spacingY,
|
|
21
|
-
style: {
|
|
22
|
-
dominantBaseline: 'hanging',
|
|
23
|
-
textAnchor: 'start'
|
|
24
|
-
}
|
|
25
|
-
};
|
|
26
|
-
case 'end':
|
|
27
|
-
return {
|
|
28
|
-
y: top + height - spacingY,
|
|
29
|
-
style: {
|
|
30
|
-
dominantBaseline: 'auto',
|
|
31
|
-
textAnchor: 'start'
|
|
32
|
-
}
|
|
33
|
-
};
|
|
34
|
-
default:
|
|
35
|
-
return {
|
|
36
|
-
y: top + height / 2,
|
|
37
|
-
style: {
|
|
38
|
-
dominantBaseline: 'central',
|
|
39
|
-
textAnchor: 'start'
|
|
40
|
-
}
|
|
41
|
-
};
|
|
42
|
-
}
|
|
43
|
-
};
|
|
44
|
-
export function getXReferenceLineClasses(classes) {
|
|
45
|
-
return composeClasses({
|
|
46
|
-
root: ['root', 'vertical'],
|
|
47
|
-
line: ['line'],
|
|
48
|
-
label: ['label']
|
|
49
|
-
}, getReferenceLineUtilityClass, classes);
|
|
50
|
-
}
|
|
51
|
-
var warnedOnce = false;
|
|
52
|
-
function ChartsXReferenceLine(props) {
|
|
53
|
-
var _spacing$x, _spacing$y;
|
|
54
|
-
var x = props.x,
|
|
55
|
-
_props$label = props.label,
|
|
56
|
-
label = _props$label === void 0 ? '' : _props$label,
|
|
57
|
-
_props$spacing = props.spacing,
|
|
58
|
-
spacing = _props$spacing === void 0 ? 5 : _props$spacing,
|
|
59
|
-
inClasses = props.classes,
|
|
60
|
-
labelAlign = props.labelAlign,
|
|
61
|
-
lineStyle = props.lineStyle,
|
|
62
|
-
labelStyle = props.labelStyle,
|
|
63
|
-
axisId = props.axisId;
|
|
64
|
-
var _useDrawingArea = useDrawingArea(),
|
|
65
|
-
top = _useDrawingArea.top,
|
|
66
|
-
height = _useDrawingArea.height;
|
|
67
|
-
var xAxisScale = useXScale(axisId);
|
|
68
|
-
var xPosition = xAxisScale(x);
|
|
69
|
-
if (xPosition === undefined) {
|
|
70
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
71
|
-
if (!warnedOnce) {
|
|
72
|
-
warnedOnce = true;
|
|
73
|
-
console.error("MUI X Charts: the value ".concat(x, " does not exist in the data of x axis with id ").concat(axisId, "."));
|
|
74
|
-
}
|
|
75
|
-
}
|
|
76
|
-
return null;
|
|
77
|
-
}
|
|
78
|
-
var d = "M ".concat(xPosition, " ").concat(top, " l 0 ").concat(height);
|
|
79
|
-
var classes = getXReferenceLineClasses(inClasses);
|
|
80
|
-
var spacingX = _typeof(spacing) === 'object' ? (_spacing$x = spacing.x) != null ? _spacing$x : 0 : spacing;
|
|
81
|
-
var spacingY = _typeof(spacing) === 'object' ? (_spacing$y = spacing.y) != null ? _spacing$y : 0 : spacing;
|
|
82
|
-
var textParams = _extends({
|
|
83
|
-
x: xPosition + spacingX,
|
|
84
|
-
text: label,
|
|
85
|
-
fontSize: 12
|
|
86
|
-
}, getTextParams({
|
|
87
|
-
top: top,
|
|
88
|
-
height: height,
|
|
89
|
-
spacingY: spacingY,
|
|
90
|
-
labelAlign: labelAlign
|
|
91
|
-
}), {
|
|
92
|
-
className: classes.label
|
|
93
|
-
});
|
|
94
|
-
return /*#__PURE__*/_jsxs(ReferenceLineRoot, {
|
|
95
|
-
className: classes.root,
|
|
96
|
-
children: [/*#__PURE__*/_jsx("path", {
|
|
97
|
-
d: d,
|
|
98
|
-
className: classes.line,
|
|
99
|
-
style: lineStyle
|
|
100
|
-
}), /*#__PURE__*/_jsx(ChartsText, _extends({}, textParams, {
|
|
101
|
-
style: _extends({}, textParams.style, labelStyle)
|
|
102
|
-
}))]
|
|
103
|
-
});
|
|
104
|
-
}
|
|
105
|
-
export { ChartsXReferenceLine };
|
|
@@ -1,105 +0,0 @@
|
|
|
1
|
-
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
|
-
import _typeof from "@babel/runtime/helpers/esm/typeof";
|
|
3
|
-
import * as React from 'react';
|
|
4
|
-
import composeClasses from '@mui/utils/composeClasses';
|
|
5
|
-
import { useDrawingArea, useYScale } from '../hooks';
|
|
6
|
-
import { ReferenceLineRoot } from './common';
|
|
7
|
-
import { ChartsText } from '../ChartsText';
|
|
8
|
-
import { getReferenceLineUtilityClass } from './chartsReferenceLineClasses';
|
|
9
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
-
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
11
|
-
var getTextParams = function getTextParams(_ref) {
|
|
12
|
-
var left = _ref.left,
|
|
13
|
-
width = _ref.width,
|
|
14
|
-
spacingX = _ref.spacingX,
|
|
15
|
-
_ref$labelAlign = _ref.labelAlign,
|
|
16
|
-
labelAlign = _ref$labelAlign === void 0 ? 'middle' : _ref$labelAlign;
|
|
17
|
-
switch (labelAlign) {
|
|
18
|
-
case 'start':
|
|
19
|
-
return {
|
|
20
|
-
x: left + spacingX,
|
|
21
|
-
style: {
|
|
22
|
-
dominantBaseline: 'auto',
|
|
23
|
-
textAnchor: 'start'
|
|
24
|
-
}
|
|
25
|
-
};
|
|
26
|
-
case 'end':
|
|
27
|
-
return {
|
|
28
|
-
x: left + width - spacingX,
|
|
29
|
-
style: {
|
|
30
|
-
dominantBaseline: 'auto',
|
|
31
|
-
textAnchor: 'end'
|
|
32
|
-
}
|
|
33
|
-
};
|
|
34
|
-
default:
|
|
35
|
-
return {
|
|
36
|
-
x: left + width / 2,
|
|
37
|
-
style: {
|
|
38
|
-
dominantBaseline: 'auto',
|
|
39
|
-
textAnchor: 'middle'
|
|
40
|
-
}
|
|
41
|
-
};
|
|
42
|
-
}
|
|
43
|
-
};
|
|
44
|
-
var warnedOnce = false;
|
|
45
|
-
export function getYReferenceLineClasses(classes) {
|
|
46
|
-
return composeClasses({
|
|
47
|
-
root: ['root', 'horizontal'],
|
|
48
|
-
line: ['line'],
|
|
49
|
-
label: ['label']
|
|
50
|
-
}, getReferenceLineUtilityClass, classes);
|
|
51
|
-
}
|
|
52
|
-
function ChartsYReferenceLine(props) {
|
|
53
|
-
var _spacing$x, _spacing$y;
|
|
54
|
-
var y = props.y,
|
|
55
|
-
_props$label = props.label,
|
|
56
|
-
label = _props$label === void 0 ? '' : _props$label,
|
|
57
|
-
_props$spacing = props.spacing,
|
|
58
|
-
spacing = _props$spacing === void 0 ? 5 : _props$spacing,
|
|
59
|
-
inClasses = props.classes,
|
|
60
|
-
labelAlign = props.labelAlign,
|
|
61
|
-
lineStyle = props.lineStyle,
|
|
62
|
-
labelStyle = props.labelStyle,
|
|
63
|
-
axisId = props.axisId;
|
|
64
|
-
var _useDrawingArea = useDrawingArea(),
|
|
65
|
-
left = _useDrawingArea.left,
|
|
66
|
-
width = _useDrawingArea.width;
|
|
67
|
-
var yAxisScale = useYScale(axisId);
|
|
68
|
-
var yPosition = yAxisScale(y);
|
|
69
|
-
if (yPosition === undefined) {
|
|
70
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
71
|
-
if (!warnedOnce) {
|
|
72
|
-
warnedOnce = true;
|
|
73
|
-
console.error("MUI X Charts: the value ".concat(y, " does not exist in the data of y axis with id ").concat(axisId, "."));
|
|
74
|
-
}
|
|
75
|
-
}
|
|
76
|
-
return null;
|
|
77
|
-
}
|
|
78
|
-
var d = "M ".concat(left, " ").concat(yPosition, " l ").concat(width, " 0");
|
|
79
|
-
var classes = getYReferenceLineClasses(inClasses);
|
|
80
|
-
var spacingX = _typeof(spacing) === 'object' ? (_spacing$x = spacing.x) != null ? _spacing$x : 0 : spacing;
|
|
81
|
-
var spacingY = _typeof(spacing) === 'object' ? (_spacing$y = spacing.y) != null ? _spacing$y : 0 : spacing;
|
|
82
|
-
var textParams = _extends({
|
|
83
|
-
y: yPosition - spacingY,
|
|
84
|
-
text: label,
|
|
85
|
-
fontSize: 12
|
|
86
|
-
}, getTextParams({
|
|
87
|
-
left: left,
|
|
88
|
-
width: width,
|
|
89
|
-
spacingX: spacingX,
|
|
90
|
-
labelAlign: labelAlign
|
|
91
|
-
}), {
|
|
92
|
-
className: classes.label
|
|
93
|
-
});
|
|
94
|
-
return /*#__PURE__*/_jsxs(ReferenceLineRoot, {
|
|
95
|
-
className: classes.root,
|
|
96
|
-
children: [/*#__PURE__*/_jsx("path", {
|
|
97
|
-
d: d,
|
|
98
|
-
className: classes.line,
|
|
99
|
-
style: lineStyle
|
|
100
|
-
}), /*#__PURE__*/_jsx(ChartsText, _extends({}, textParams, {
|
|
101
|
-
style: _extends({}, textParams.style, labelStyle)
|
|
102
|
-
}))]
|
|
103
|
-
});
|
|
104
|
-
}
|
|
105
|
-
export { ChartsYReferenceLine };
|