@mui/x-charts 6.18.7 → 6.19.3
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 +1 -0
- package/BarChart/BarElement.d.ts +37 -20
- package/CHANGELOG.md +155 -0
- package/ChartsLegend/ChartsLegend.d.ts +5 -2
- package/ChartsLegend/ChartsLegend.js +137 -1
- package/ChartsReferenceLine/ChartsReferenceLine.js +7 -3
- package/ChartsSurface.d.ts +2 -2
- package/ChartsSurface.js +33 -1
- package/ChartsTooltip/ChartsAxisTooltipContent.js +2 -54
- package/ChartsTooltip/ChartsItemTooltipContent.js +15 -1
- package/ChartsTooltip/ChartsTooltipTable.d.ts +1 -1
- package/ChartsTooltip/ChartsTooltipTable.js +2 -0
- package/ChartsTooltip/DefaultChartsAxisTooltipContent.js +2 -54
- package/ChartsTooltip/DefaultChartsItemTooltipContent.js +15 -1
- package/LineChart/LineChart.d.ts +1 -0
- package/LineChart/LineChart.js +2 -0
- package/LineChart/formatter.js +5 -1
- package/PieChart/PieArcLabel.d.ts +1 -0
- package/PieChart/PieArcLabel.js +7 -8
- package/PieChart/PieArcLabelPlot.d.ts +5 -0
- package/PieChart/PieArcLabelPlot.js +16 -3
- package/PieChart/PieArcPlot.d.ts +5 -0
- package/PieChart/PieArcPlot.js +9 -1
- package/PieChart/PieChart.d.ts +14 -2
- package/PieChart/PieChart.js +6 -2
- package/PieChart/PiePlot.js +3 -0
- package/PieChart/dataTransform/transition.js +9 -2
- package/PieChart/dataTransform/useTransformData.d.ts +1 -0
- package/PieChart/dataTransform/useTransformData.js +11 -8
- package/ScatterChart/ScatterChart.js +1 -0
- package/SparkLineChart/SparkLineChart.d.ts +15 -1
- package/SparkLineChart/SparkLineChart.js +8 -1
- package/context/CartesianContextProvider.d.ts +1 -1
- package/context/CartesianContextProvider.js +7 -6
- package/context/DrawingProvider.d.ts +1 -1
- package/context/DrawingProvider.js +8 -7
- package/context/HighlightProvider.d.ts +2 -2
- package/context/HighlightProvider.js +4 -3
- package/context/InteractionProvider.d.ts +2 -2
- package/context/InteractionProvider.js +4 -3
- package/context/SeriesContextProvider.d.ts +3 -1
- package/context/SeriesContextProvider.js +7 -6
- package/esm/BarChart/BarChart.js +1 -0
- package/esm/ChartsLegend/ChartsLegend.js +139 -2
- package/esm/ChartsReferenceLine/ChartsReferenceLine.js +7 -3
- package/esm/ChartsSurface.js +35 -2
- package/esm/ChartsTooltip/ChartsAxisTooltipContent.js +2 -54
- package/esm/ChartsTooltip/ChartsItemTooltipContent.js +15 -1
- package/esm/ChartsTooltip/ChartsTooltipTable.js +2 -0
- package/esm/ChartsTooltip/DefaultChartsAxisTooltipContent.js +2 -54
- package/esm/ChartsTooltip/DefaultChartsItemTooltipContent.js +15 -1
- package/esm/LineChart/LineChart.js +2 -0
- package/esm/LineChart/formatter.js +5 -1
- package/esm/PieChart/PieArcLabel.js +7 -8
- package/esm/PieChart/PieArcLabelPlot.js +16 -3
- package/esm/PieChart/PieArcPlot.js +9 -1
- package/esm/PieChart/PieChart.js +6 -2
- package/esm/PieChart/PiePlot.js +3 -0
- package/esm/PieChart/dataTransform/transition.js +9 -2
- package/esm/PieChart/dataTransform/useTransformData.js +12 -9
- package/esm/ScatterChart/ScatterChart.js +1 -0
- package/esm/SparkLineChart/SparkLineChart.js +8 -1
- package/esm/context/CartesianContextProvider.js +7 -6
- package/esm/context/DrawingProvider.js +8 -7
- package/esm/context/HighlightProvider.js +6 -4
- package/esm/context/InteractionProvider.js +6 -4
- package/esm/context/SeriesContextProvider.js +9 -7
- package/esm/hooks/useDrawingArea.js +7 -3
- package/esm/index.js +2 -0
- package/esm/internals/stackSeries.js +5 -3
- package/esm/models/index.js +1 -0
- package/esm/models/stacking.js +1 -0
- package/hooks/useDrawingArea.d.ts +2 -0
- package/hooks/useDrawingArea.js +7 -3
- package/index.d.ts +2 -0
- package/index.js +23 -1
- package/internals/defaultizeColor.d.ts +7 -4
- package/internals/stackSeries.d.ts +8 -3
- package/internals/stackSeries.js +4 -3
- package/legacy/BarChart/BarChart.js +1 -0
- package/legacy/ChartsLegend/ChartsLegend.js +139 -2
- package/legacy/ChartsReferenceLine/ChartsReferenceLine.js +5 -3
- package/legacy/ChartsReferenceLine/common.js +3 -4
- package/legacy/ChartsSurface.js +35 -2
- package/legacy/ChartsTooltip/ChartsAxisTooltipContent.js +2 -54
- package/legacy/ChartsTooltip/ChartsItemTooltipContent.js +15 -1
- package/legacy/ChartsTooltip/ChartsTooltipTable.js +8 -7
- package/legacy/ChartsTooltip/DefaultChartsAxisTooltipContent.js +2 -54
- package/legacy/ChartsTooltip/DefaultChartsItemTooltipContent.js +15 -1
- package/legacy/LineChart/LineChart.js +2 -0
- package/legacy/LineChart/formatter.js +6 -2
- package/legacy/PieChart/PieArcLabel.js +7 -6
- package/legacy/PieChart/PieArcLabelPlot.js +16 -4
- package/legacy/PieChart/PieArcPlot.js +10 -1
- package/legacy/PieChart/PieChart.js +6 -2
- package/legacy/PieChart/PiePlot.js +3 -0
- package/legacy/PieChart/dataTransform/transition.js +9 -2
- package/legacy/PieChart/dataTransform/useTransformData.js +12 -9
- package/legacy/ScatterChart/ScatterChart.js +1 -0
- package/legacy/SparkLineChart/SparkLineChart.js +8 -1
- package/legacy/context/CartesianContextProvider.js +15 -15
- package/legacy/context/DrawingProvider.js +6 -6
- package/legacy/context/HighlightProvider.js +4 -3
- package/legacy/context/InteractionProvider.js +4 -3
- package/legacy/context/SeriesContextProvider.js +8 -7
- package/legacy/hooks/useDrawingArea.js +7 -3
- package/legacy/index.js +3 -1
- package/legacy/internals/components/AxisSharedComponents.js +5 -6
- package/legacy/internals/stackSeries.js +5 -3
- package/legacy/models/index.js +1 -0
- package/legacy/models/stacking.js +1 -0
- package/models/index.d.ts +1 -0
- package/models/index.js +11 -0
- package/models/seriesType/bar.d.ts +6 -0
- package/models/seriesType/common.d.ts +2 -3
- package/models/seriesType/index.d.ts +0 -1
- package/models/seriesType/line.d.ts +6 -0
- package/models/seriesType/pie.d.ts +15 -0
- package/models/stacking.d.ts +2 -0
- package/models/stacking.js +5 -0
- package/modern/BarChart/BarChart.js +1 -0
- package/modern/ChartsLegend/ChartsLegend.js +139 -2
- package/modern/ChartsReferenceLine/ChartsReferenceLine.js +7 -3
- package/modern/ChartsSurface.js +35 -2
- package/modern/ChartsTooltip/ChartsAxisTooltipContent.js +2 -54
- package/modern/ChartsTooltip/ChartsItemTooltipContent.js +15 -1
- package/modern/ChartsTooltip/ChartsTooltipTable.js +2 -0
- package/modern/ChartsTooltip/DefaultChartsAxisTooltipContent.js +2 -54
- package/modern/ChartsTooltip/DefaultChartsItemTooltipContent.js +15 -1
- package/modern/LineChart/LineChart.js +2 -0
- package/modern/LineChart/formatter.js +5 -1
- package/modern/PieChart/PieArcLabel.js +7 -8
- package/modern/PieChart/PieArcLabelPlot.js +16 -3
- package/modern/PieChart/PieArcPlot.js +9 -1
- package/modern/PieChart/PieChart.js +6 -2
- package/modern/PieChart/PiePlot.js +3 -0
- package/modern/PieChart/dataTransform/transition.js +9 -2
- package/modern/PieChart/dataTransform/useTransformData.js +11 -8
- package/modern/ScatterChart/ScatterChart.js +1 -0
- package/modern/SparkLineChart/SparkLineChart.js +8 -1
- package/modern/context/CartesianContextProvider.js +7 -6
- package/modern/context/DrawingProvider.js +8 -7
- package/modern/context/HighlightProvider.js +6 -4
- package/modern/context/InteractionProvider.js +6 -4
- package/modern/context/SeriesContextProvider.js +9 -7
- package/modern/hooks/useDrawingArea.js +7 -3
- package/modern/index.js +3 -1
- package/modern/internals/stackSeries.js +4 -3
- package/modern/models/index.js +1 -0
- package/modern/models/stacking.js +1 -0
- package/package.json +1 -1
|
@@ -5,12 +5,16 @@ export function useDrawingArea() {
|
|
|
5
5
|
left,
|
|
6
6
|
top,
|
|
7
7
|
width,
|
|
8
|
-
height
|
|
8
|
+
height,
|
|
9
|
+
bottom,
|
|
10
|
+
right
|
|
9
11
|
} = React.useContext(DrawingContext);
|
|
10
12
|
return React.useMemo(() => ({
|
|
11
13
|
left,
|
|
12
14
|
top,
|
|
13
15
|
width,
|
|
14
|
-
height
|
|
15
|
-
|
|
16
|
+
height,
|
|
17
|
+
bottom,
|
|
18
|
+
right
|
|
19
|
+
}), [height, left, top, width, bottom, right]);
|
|
16
20
|
}
|
package/esm/index.js
CHANGED
|
@@ -56,7 +56,8 @@ export const StackOffset = {
|
|
|
56
56
|
export const getStackingGroups = params => {
|
|
57
57
|
const {
|
|
58
58
|
series,
|
|
59
|
-
seriesOrder
|
|
59
|
+
seriesOrder,
|
|
60
|
+
defaultStrategy
|
|
60
61
|
} = params;
|
|
61
62
|
const stackingGroups = [];
|
|
62
63
|
const stackIndex = {};
|
|
@@ -73,11 +74,12 @@ export const getStackingGroups = params => {
|
|
|
73
74
|
stackingOffset: StackOffset.none
|
|
74
75
|
});
|
|
75
76
|
} else if (stackIndex[stack] === undefined) {
|
|
77
|
+
var _ref, _ref2;
|
|
76
78
|
stackIndex[stack] = stackingGroups.length;
|
|
77
79
|
stackingGroups.push({
|
|
78
80
|
ids: [id],
|
|
79
|
-
stackingOrder: StackOrder[stackOrder != null ? stackOrder : 'none'],
|
|
80
|
-
stackingOffset: StackOffset[stackOffset != null ? stackOffset : 'diverging']
|
|
81
|
+
stackingOrder: StackOrder[(_ref = stackOrder != null ? stackOrder : defaultStrategy == null ? void 0 : defaultStrategy.stackOrder) != null ? _ref : 'none'],
|
|
82
|
+
stackingOffset: StackOffset[(_ref2 = stackOffset != null ? stackOffset : defaultStrategy == null ? void 0 : defaultStrategy.stackOffset) != null ? _ref2 : 'diverging']
|
|
81
83
|
});
|
|
82
84
|
} else {
|
|
83
85
|
stackingGroups[stackIndex[stack]].ids.push(id);
|
package/esm/models/index.js
CHANGED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
package/hooks/useDrawingArea.js
CHANGED
|
@@ -13,12 +13,16 @@ function useDrawingArea() {
|
|
|
13
13
|
left,
|
|
14
14
|
top,
|
|
15
15
|
width,
|
|
16
|
-
height
|
|
16
|
+
height,
|
|
17
|
+
bottom,
|
|
18
|
+
right
|
|
17
19
|
} = React.useContext(_DrawingProvider.DrawingContext);
|
|
18
20
|
return React.useMemo(() => ({
|
|
19
21
|
left,
|
|
20
22
|
top,
|
|
21
23
|
width,
|
|
22
|
-
height
|
|
23
|
-
|
|
24
|
+
height,
|
|
25
|
+
bottom,
|
|
26
|
+
right
|
|
27
|
+
}), [height, left, top, width, bottom, right]);
|
|
24
28
|
}
|
package/index.d.ts
CHANGED
package/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* @mui/x-charts v6.
|
|
2
|
+
* @mui/x-charts v6.19.3
|
|
3
3
|
*
|
|
4
4
|
* @license MIT
|
|
5
5
|
* This source code is licensed under the MIT license found in the
|
|
@@ -219,6 +219,28 @@ Object.keys(_ChartContainer).forEach(function (key) {
|
|
|
219
219
|
}
|
|
220
220
|
});
|
|
221
221
|
});
|
|
222
|
+
var _ChartsSurface = require("./ChartsSurface");
|
|
223
|
+
Object.keys(_ChartsSurface).forEach(function (key) {
|
|
224
|
+
if (key === "default" || key === "__esModule") return;
|
|
225
|
+
if (key in exports && exports[key] === _ChartsSurface[key]) return;
|
|
226
|
+
Object.defineProperty(exports, key, {
|
|
227
|
+
enumerable: true,
|
|
228
|
+
get: function () {
|
|
229
|
+
return _ChartsSurface[key];
|
|
230
|
+
}
|
|
231
|
+
});
|
|
232
|
+
});
|
|
233
|
+
var _ChartsLegend = require("./ChartsLegend");
|
|
234
|
+
Object.keys(_ChartsLegend).forEach(function (key) {
|
|
235
|
+
if (key === "default" || key === "__esModule") return;
|
|
236
|
+
if (key in exports && exports[key] === _ChartsLegend[key]) return;
|
|
237
|
+
Object.defineProperty(exports, key, {
|
|
238
|
+
enumerable: true,
|
|
239
|
+
get: function () {
|
|
240
|
+
return _ChartsLegend[key];
|
|
241
|
+
}
|
|
242
|
+
});
|
|
243
|
+
});
|
|
222
244
|
var _ResponsiveChartContainer = require("./ResponsiveChartContainer");
|
|
223
245
|
Object.keys(_ResponsiveChartContainer).forEach(function (key) {
|
|
224
246
|
if (key === "default" || key === "__esModule") return;
|
|
@@ -9,6 +9,7 @@ export declare function defaultizeColor(series: AllSeriesType, seriesIndex: numb
|
|
|
9
9
|
type: "pie";
|
|
10
10
|
innerRadius?: string | number | undefined;
|
|
11
11
|
outerRadius?: string | number | undefined;
|
|
12
|
+
arcLabelRadius?: string | number | undefined;
|
|
12
13
|
cornerRadius?: number | undefined;
|
|
13
14
|
startAngle?: number | undefined;
|
|
14
15
|
endAngle?: number | undefined;
|
|
@@ -24,6 +25,7 @@ export declare function defaultizeColor(series: AllSeriesType, seriesIndex: numb
|
|
|
24
25
|
outerRadius?: number | undefined;
|
|
25
26
|
cornerRadius?: number | undefined;
|
|
26
27
|
paddingAngle?: number | undefined;
|
|
28
|
+
arcLabelRadius?: number | undefined;
|
|
27
29
|
color?: string | undefined;
|
|
28
30
|
} | undefined;
|
|
29
31
|
faded?: {
|
|
@@ -32,6 +34,7 @@ export declare function defaultizeColor(series: AllSeriesType, seriesIndex: numb
|
|
|
32
34
|
outerRadius?: number | undefined;
|
|
33
35
|
cornerRadius?: number | undefined;
|
|
34
36
|
paddingAngle?: number | undefined;
|
|
37
|
+
arcLabelRadius?: number | undefined;
|
|
35
38
|
color?: string | undefined;
|
|
36
39
|
} | undefined;
|
|
37
40
|
id?: string | undefined;
|
|
@@ -44,6 +47,7 @@ export declare function defaultizeColor(series: AllSeriesType, seriesIndex: numb
|
|
|
44
47
|
dataKey?: string | undefined;
|
|
45
48
|
label?: string | undefined;
|
|
46
49
|
layout?: "horizontal" | "vertical" | undefined;
|
|
50
|
+
stackOffset?: import("..").StackOffsetType | undefined;
|
|
47
51
|
id?: string | undefined;
|
|
48
52
|
color: string;
|
|
49
53
|
valueFormatter?: ((value: number) => string) | undefined;
|
|
@@ -51,8 +55,7 @@ export declare function defaultizeColor(series: AllSeriesType, seriesIndex: numb
|
|
|
51
55
|
xAxisKey?: string | undefined;
|
|
52
56
|
yAxisKey?: string | undefined;
|
|
53
57
|
stack?: string | undefined;
|
|
54
|
-
|
|
55
|
-
stackOrder?: "reverse" | "none" | "appearance" | "ascending" | "descending" | "insideOut" | undefined;
|
|
58
|
+
stackOrder?: import("..").StackOrderType | undefined;
|
|
56
59
|
} | {
|
|
57
60
|
type: "line";
|
|
58
61
|
data?: (number | null)[] | undefined;
|
|
@@ -64,14 +67,14 @@ export declare function defaultizeColor(series: AllSeriesType, seriesIndex: numb
|
|
|
64
67
|
showMark?: boolean | ((params: import("../models/seriesType").ShowMarkParams<number | Date>) => boolean) | undefined;
|
|
65
68
|
disableHighlight?: boolean | undefined;
|
|
66
69
|
connectNulls?: boolean | undefined;
|
|
70
|
+
stackOffset?: import("..").StackOffsetType | undefined;
|
|
67
71
|
id?: string | undefined;
|
|
68
72
|
color: string;
|
|
69
73
|
valueFormatter?: ((value: number) => string) | undefined;
|
|
70
74
|
highlightScope?: Partial<import("..").HighlightScope> | undefined;
|
|
71
75
|
xAxisKey?: string | undefined;
|
|
72
76
|
yAxisKey?: string | undefined;
|
|
73
|
-
|
|
74
|
-
stackOrder?: "reverse" | "none" | "appearance" | "ascending" | "descending" | "insideOut" | undefined;
|
|
77
|
+
stackOrder?: import("..").StackOrderType | undefined;
|
|
75
78
|
} | {
|
|
76
79
|
type: "scatter";
|
|
77
80
|
data: import("../models/seriesType").ScatterValueType[];
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { Series } from 'd3-shape';
|
|
2
|
-
import { BarSeriesType, LineSeriesType } from '../models/seriesType';
|
|
2
|
+
import type { BarSeriesType, LineSeriesType } from '../models/seriesType';
|
|
3
|
+
import type { StackOffsetType, StackOrderType } from '../models/stacking';
|
|
3
4
|
type StackableSeries = {
|
|
4
5
|
[id: string]: BarSeriesType;
|
|
5
6
|
} | {
|
|
@@ -8,6 +9,10 @@ type StackableSeries = {
|
|
|
8
9
|
type FormatterParams = {
|
|
9
10
|
series: StackableSeries;
|
|
10
11
|
seriesOrder: string[];
|
|
12
|
+
defaultStrategy?: {
|
|
13
|
+
stackOrder?: StackOrderType;
|
|
14
|
+
stackOffset?: StackOffsetType;
|
|
15
|
+
};
|
|
11
16
|
};
|
|
12
17
|
export type StackingGroupsType = {
|
|
13
18
|
ids: string[];
|
|
@@ -15,10 +20,10 @@ export type StackingGroupsType = {
|
|
|
15
20
|
stackingOffset: (series: Series<any, any>, order: Iterable<number>) => void;
|
|
16
21
|
}[];
|
|
17
22
|
export declare const StackOrder: {
|
|
18
|
-
[key in
|
|
23
|
+
[key in StackOrderType]: (series: Series<any, any>) => number[];
|
|
19
24
|
};
|
|
20
25
|
export declare const StackOffset: {
|
|
21
|
-
[key in
|
|
26
|
+
[key in StackOffsetType]: (series: Series<any, any>, order: Iterable<number>) => void;
|
|
22
27
|
};
|
|
23
28
|
/**
|
|
24
29
|
* Takes a set of series and groups their ids
|
package/internals/stackSeries.js
CHANGED
|
@@ -62,7 +62,8 @@ const StackOffset = exports.StackOffset = {
|
|
|
62
62
|
const getStackingGroups = params => {
|
|
63
63
|
const {
|
|
64
64
|
series,
|
|
65
|
-
seriesOrder
|
|
65
|
+
seriesOrder,
|
|
66
|
+
defaultStrategy
|
|
66
67
|
} = params;
|
|
67
68
|
const stackingGroups = [];
|
|
68
69
|
const stackIndex = {};
|
|
@@ -82,8 +83,8 @@ const getStackingGroups = params => {
|
|
|
82
83
|
stackIndex[stack] = stackingGroups.length;
|
|
83
84
|
stackingGroups.push({
|
|
84
85
|
ids: [id],
|
|
85
|
-
stackingOrder: StackOrder[stackOrder ?? 'none'],
|
|
86
|
-
stackingOffset: StackOffset[stackOffset ?? 'diverging']
|
|
86
|
+
stackingOrder: StackOrder[stackOrder ?? defaultStrategy?.stackOrder ?? 'none'],
|
|
87
|
+
stackingOffset: StackOffset[stackOffset ?? defaultStrategy?.stackOffset ?? 'diverging']
|
|
87
88
|
});
|
|
88
89
|
} else {
|
|
89
90
|
stackingGroups[stackIndex[stack]].ids.push(id);
|
|
@@ -161,6 +161,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
|
|
|
161
161
|
className: PropTypes.string,
|
|
162
162
|
/**
|
|
163
163
|
* Color palette used to colorize multiple series.
|
|
164
|
+
* @default blueberryTwilightPalette
|
|
164
165
|
*/
|
|
165
166
|
colors: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string), PropTypes.func]),
|
|
166
167
|
/**
|
|
@@ -4,6 +4,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
|
|
|
4
4
|
var _excluded = ["rotate", "dominantBaseline"],
|
|
5
5
|
_excluded2 = ["label"];
|
|
6
6
|
import * as React from 'react';
|
|
7
|
+
import PropTypes from 'prop-types';
|
|
7
8
|
import { useSlotProps } from '@mui/base/utils';
|
|
8
9
|
import { NoSsr } from '@mui/base/NoSsr';
|
|
9
10
|
import { unstable_composeClasses as composeClasses } from '@mui/utils';
|
|
@@ -248,7 +249,108 @@ function DefaultChartsLegend(props) {
|
|
|
248
249
|
})
|
|
249
250
|
});
|
|
250
251
|
}
|
|
251
|
-
|
|
252
|
+
process.env.NODE_ENV !== "production" ? DefaultChartsLegend.propTypes = {
|
|
253
|
+
// ----------------------------- Warning --------------------------------
|
|
254
|
+
// | These PropTypes are generated from the TypeScript type definitions |
|
|
255
|
+
// | To update them edit the TypeScript types and run "yarn proptypes" |
|
|
256
|
+
// ----------------------------------------------------------------------
|
|
257
|
+
/**
|
|
258
|
+
* Override or extend the styles applied to the component.
|
|
259
|
+
*/
|
|
260
|
+
classes: PropTypes.object.isRequired,
|
|
261
|
+
/**
|
|
262
|
+
* The direction of the legend layout.
|
|
263
|
+
* The default depends on the chart.
|
|
264
|
+
*/
|
|
265
|
+
direction: PropTypes.oneOf(['column', 'row']).isRequired,
|
|
266
|
+
drawingArea: PropTypes.shape({
|
|
267
|
+
bottom: PropTypes.number.isRequired,
|
|
268
|
+
height: PropTypes.number.isRequired,
|
|
269
|
+
left: PropTypes.number.isRequired,
|
|
270
|
+
right: PropTypes.number.isRequired,
|
|
271
|
+
top: PropTypes.number.isRequired,
|
|
272
|
+
width: PropTypes.number.isRequired
|
|
273
|
+
}).isRequired,
|
|
274
|
+
/**
|
|
275
|
+
* Set to true to hide the legend.
|
|
276
|
+
* @default false
|
|
277
|
+
*/
|
|
278
|
+
hidden: PropTypes.bool,
|
|
279
|
+
/**
|
|
280
|
+
* Space between two legend items (in px).
|
|
281
|
+
* @default 10
|
|
282
|
+
*/
|
|
283
|
+
itemGap: PropTypes.number,
|
|
284
|
+
/**
|
|
285
|
+
* Height of the item mark (in px).
|
|
286
|
+
* @default 20
|
|
287
|
+
*/
|
|
288
|
+
itemMarkHeight: PropTypes.number,
|
|
289
|
+
/**
|
|
290
|
+
* Width of the item mark (in px).
|
|
291
|
+
* @default 20
|
|
292
|
+
*/
|
|
293
|
+
itemMarkWidth: PropTypes.number,
|
|
294
|
+
/**
|
|
295
|
+
* Style applied to legend labels.
|
|
296
|
+
* @default theme.typography.subtitle1
|
|
297
|
+
*/
|
|
298
|
+
labelStyle: PropTypes.object,
|
|
299
|
+
/**
|
|
300
|
+
* Space between the mark and the label (in px).
|
|
301
|
+
* @default 5
|
|
302
|
+
*/
|
|
303
|
+
markGap: PropTypes.number,
|
|
304
|
+
/**
|
|
305
|
+
* Legend padding (in px).
|
|
306
|
+
* Can either be a single number, or an object with top, left, bottom, right properties.
|
|
307
|
+
* @default 0
|
|
308
|
+
*/
|
|
309
|
+
padding: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({
|
|
310
|
+
bottom: PropTypes.number,
|
|
311
|
+
left: PropTypes.number,
|
|
312
|
+
right: PropTypes.number,
|
|
313
|
+
top: PropTypes.number
|
|
314
|
+
})]),
|
|
315
|
+
position: PropTypes.shape({
|
|
316
|
+
horizontal: PropTypes.oneOf(['left', 'middle', 'right']).isRequired,
|
|
317
|
+
vertical: PropTypes.oneOf(['bottom', 'middle', 'top']).isRequired
|
|
318
|
+
}).isRequired,
|
|
319
|
+
series: PropTypes.shape({
|
|
320
|
+
bar: PropTypes.shape({
|
|
321
|
+
series: PropTypes.object.isRequired,
|
|
322
|
+
seriesOrder: PropTypes.arrayOf(PropTypes.string).isRequired,
|
|
323
|
+
stackingGroups: PropTypes.arrayOf(PropTypes.shape({
|
|
324
|
+
ids: PropTypes.arrayOf(PropTypes.string).isRequired,
|
|
325
|
+
stackingOffset: PropTypes.func.isRequired,
|
|
326
|
+
stackingOrder: PropTypes.func.isRequired
|
|
327
|
+
})).isRequired
|
|
328
|
+
}),
|
|
329
|
+
line: PropTypes.shape({
|
|
330
|
+
series: PropTypes.object.isRequired,
|
|
331
|
+
seriesOrder: PropTypes.arrayOf(PropTypes.string).isRequired,
|
|
332
|
+
stackingGroups: PropTypes.arrayOf(PropTypes.shape({
|
|
333
|
+
ids: PropTypes.arrayOf(PropTypes.string).isRequired,
|
|
334
|
+
stackingOffset: PropTypes.func.isRequired,
|
|
335
|
+
stackingOrder: PropTypes.func.isRequired
|
|
336
|
+
})).isRequired
|
|
337
|
+
}),
|
|
338
|
+
pie: PropTypes.shape({
|
|
339
|
+
series: PropTypes.object.isRequired,
|
|
340
|
+
seriesOrder: PropTypes.arrayOf(PropTypes.string).isRequired
|
|
341
|
+
}),
|
|
342
|
+
scatter: PropTypes.shape({
|
|
343
|
+
series: PropTypes.object.isRequired,
|
|
344
|
+
seriesOrder: PropTypes.arrayOf(PropTypes.string).isRequired
|
|
345
|
+
})
|
|
346
|
+
}).isRequired,
|
|
347
|
+
seriesToDisplay: PropTypes.arrayOf(PropTypes.shape({
|
|
348
|
+
color: PropTypes.string.isRequired,
|
|
349
|
+
id: PropTypes.string.isRequired,
|
|
350
|
+
label: PropTypes.string.isRequired
|
|
351
|
+
})).isRequired
|
|
352
|
+
} : void 0;
|
|
353
|
+
function ChartsLegend(inProps) {
|
|
252
354
|
var _slots$legend;
|
|
253
355
|
var props = useThemeProps({
|
|
254
356
|
props: _extends({}, defaultProps, inProps),
|
|
@@ -282,4 +384,39 @@ export function ChartsLegend(inProps) {
|
|
|
282
384
|
ownerState: {}
|
|
283
385
|
});
|
|
284
386
|
return /*#__PURE__*/_jsx(ChartLegendRender, _extends({}, chartLegendRenderProps));
|
|
285
|
-
}
|
|
387
|
+
}
|
|
388
|
+
process.env.NODE_ENV !== "production" ? ChartsLegend.propTypes = {
|
|
389
|
+
// ----------------------------- Warning --------------------------------
|
|
390
|
+
// | These PropTypes are generated from the TypeScript type definitions |
|
|
391
|
+
// | To update them edit the TypeScript types and run "yarn proptypes" |
|
|
392
|
+
// ----------------------------------------------------------------------
|
|
393
|
+
/**
|
|
394
|
+
* Override or extend the styles applied to the component.
|
|
395
|
+
*/
|
|
396
|
+
classes: PropTypes.object,
|
|
397
|
+
/**
|
|
398
|
+
* The direction of the legend layout.
|
|
399
|
+
* The default depends on the chart.
|
|
400
|
+
*/
|
|
401
|
+
direction: PropTypes.oneOf(['column', 'row']),
|
|
402
|
+
/**
|
|
403
|
+
* Set to true to hide the legend.
|
|
404
|
+
* @default false
|
|
405
|
+
*/
|
|
406
|
+
hidden: PropTypes.bool,
|
|
407
|
+
position: PropTypes.shape({
|
|
408
|
+
horizontal: PropTypes.oneOf(['left', 'middle', 'right']).isRequired,
|
|
409
|
+
vertical: PropTypes.oneOf(['bottom', 'middle', 'top']).isRequired
|
|
410
|
+
}),
|
|
411
|
+
/**
|
|
412
|
+
* The props used for each component slot.
|
|
413
|
+
* @default {}
|
|
414
|
+
*/
|
|
415
|
+
slotProps: PropTypes.object,
|
|
416
|
+
/**
|
|
417
|
+
* Overridable component slots.
|
|
418
|
+
* @default {}
|
|
419
|
+
*/
|
|
420
|
+
slots: PropTypes.object
|
|
421
|
+
} : void 0;
|
|
422
|
+
export { ChartsLegend };
|
|
@@ -5,13 +5,15 @@ 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
|
-
|
|
8
|
+
var x = props.x,
|
|
9
|
+
y = props.y;
|
|
10
|
+
if (x !== undefined && y !== undefined) {
|
|
9
11
|
throw new Error('MUI-X-Charts: The ChartsReferenceLine can not have both `x` and `y` props set.');
|
|
10
12
|
}
|
|
11
|
-
if (
|
|
13
|
+
if (x === undefined && y === undefined) {
|
|
12
14
|
throw new Error('MUI-X-Charts: The ChartsReferenceLine should have a value in `x` or `y` prop.');
|
|
13
15
|
}
|
|
14
|
-
if (
|
|
16
|
+
if (x !== undefined) {
|
|
15
17
|
return /*#__PURE__*/_jsx(ChartsXReferenceLine, _extends({}, props));
|
|
16
18
|
}
|
|
17
19
|
return /*#__PURE__*/_jsx(ChartsYReferenceLine, _extends({}, props));
|
|
@@ -3,18 +3,17 @@ import _extends from "@babel/runtime/helpers/esm/extends";
|
|
|
3
3
|
import { styled } from '@mui/material/styles';
|
|
4
4
|
import { referenceLineClasses } from './chartsReferenceLineClasses';
|
|
5
5
|
export var ReferenceLineRoot = styled('g')(function (_ref) {
|
|
6
|
-
var _ref2;
|
|
7
6
|
var theme = _ref.theme;
|
|
8
|
-
return
|
|
7
|
+
return _defineProperty(_defineProperty({}, "& .".concat(referenceLineClasses.line), {
|
|
9
8
|
fill: 'none',
|
|
10
9
|
stroke: (theme.vars || theme).palette.text.primary,
|
|
11
10
|
shapeRendering: 'crispEdges',
|
|
12
11
|
strokeWidth: 1,
|
|
13
12
|
pointerEvents: 'none'
|
|
14
|
-
}),
|
|
13
|
+
}), "& .".concat(referenceLineClasses.label), _extends({
|
|
15
14
|
fill: (theme.vars || theme).palette.text.primary,
|
|
16
15
|
stroke: 'none',
|
|
17
16
|
pointerEvents: 'none',
|
|
18
17
|
fontSize: 12
|
|
19
|
-
}, theme.typography.body1))
|
|
18
|
+
}, theme.typography.body1));
|
|
20
19
|
});
|
package/legacy/ChartsSurface.js
CHANGED
|
@@ -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
|
-
|
|
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 };
|
|
@@ -75,37 +75,7 @@ process.env.NODE_ENV !== "production" ? ChartsAxisTooltipContent.propTypes = {
|
|
|
75
75
|
classes: PropTypes.object.isRequired,
|
|
76
76
|
content: PropTypes.elementType,
|
|
77
77
|
contentProps: PropTypes.shape({
|
|
78
|
-
axis: PropTypes.
|
|
79
|
-
axisId: PropTypes.string,
|
|
80
|
-
classes: PropTypes.object,
|
|
81
|
-
data: PropTypes.array,
|
|
82
|
-
dataKey: PropTypes.string,
|
|
83
|
-
disableLine: PropTypes.bool,
|
|
84
|
-
disableTicks: PropTypes.bool,
|
|
85
|
-
fill: PropTypes.string,
|
|
86
|
-
hideTooltip: PropTypes.bool,
|
|
87
|
-
id: PropTypes.string.isRequired,
|
|
88
|
-
label: PropTypes.string,
|
|
89
|
-
labelFontSize: PropTypes.number,
|
|
90
|
-
labelStyle: PropTypes.object,
|
|
91
|
-
max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
|
|
92
|
-
min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
|
|
93
|
-
position: PropTypes.oneOf(['bottom', 'left', 'right', 'top']),
|
|
94
|
-
scale: PropTypes.func.isRequired,
|
|
95
|
-
scaleType: PropTypes.oneOf(['time']).isRequired,
|
|
96
|
-
slotProps: PropTypes.object,
|
|
97
|
-
slots: PropTypes.object,
|
|
98
|
-
stroke: PropTypes.string,
|
|
99
|
-
tickFontSize: PropTypes.number,
|
|
100
|
-
tickInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.array, PropTypes.func]),
|
|
101
|
-
tickLabelInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.func]),
|
|
102
|
-
tickLabelStyle: PropTypes.object,
|
|
103
|
-
tickMaxStep: PropTypes.number,
|
|
104
|
-
tickMinStep: PropTypes.number,
|
|
105
|
-
tickNumber: PropTypes.number.isRequired,
|
|
106
|
-
tickSize: PropTypes.number,
|
|
107
|
-
valueFormatter: PropTypes.func
|
|
108
|
-
}),
|
|
78
|
+
axis: PropTypes.object,
|
|
109
79
|
axisData: PropTypes.shape({
|
|
110
80
|
x: PropTypes.shape({
|
|
111
81
|
index: PropTypes.number,
|
|
@@ -119,29 +89,7 @@ process.env.NODE_ENV !== "production" ? ChartsAxisTooltipContent.propTypes = {
|
|
|
119
89
|
axisValue: PropTypes.any,
|
|
120
90
|
classes: PropTypes.object,
|
|
121
91
|
dataIndex: PropTypes.number,
|
|
122
|
-
series: PropTypes.arrayOf(PropTypes.
|
|
123
|
-
area: PropTypes.bool,
|
|
124
|
-
color: PropTypes.string.isRequired,
|
|
125
|
-
connectNulls: PropTypes.bool,
|
|
126
|
-
curve: PropTypes.oneOf(['catmullRom', 'linear', 'monotoneX', 'monotoneY', 'natural', 'step', 'stepAfter', 'stepBefore']),
|
|
127
|
-
data: PropTypes.arrayOf(PropTypes.number).isRequired,
|
|
128
|
-
dataKey: PropTypes.string,
|
|
129
|
-
disableHighlight: PropTypes.bool,
|
|
130
|
-
highlightScope: PropTypes.shape({
|
|
131
|
-
faded: PropTypes.oneOf(['global', 'none', 'series']),
|
|
132
|
-
highlighted: PropTypes.oneOf(['item', 'none', 'series'])
|
|
133
|
-
}),
|
|
134
|
-
id: PropTypes.string.isRequired,
|
|
135
|
-
label: PropTypes.string,
|
|
136
|
-
showMark: PropTypes.oneOfType([PropTypes.func, PropTypes.bool]),
|
|
137
|
-
stack: PropTypes.string,
|
|
138
|
-
stackOffset: PropTypes.oneOf(['diverging', 'expand', 'none', 'silhouette', 'wiggle']),
|
|
139
|
-
stackOrder: PropTypes.oneOf(['appearance', 'ascending', 'descending', 'insideOut', 'none', 'reverse']),
|
|
140
|
-
type: PropTypes.oneOf(['line']).isRequired,
|
|
141
|
-
valueFormatter: PropTypes.func.isRequired,
|
|
142
|
-
xAxisKey: PropTypes.string,
|
|
143
|
-
yAxisKey: PropTypes.string
|
|
144
|
-
})),
|
|
92
|
+
series: PropTypes.arrayOf(PropTypes.object),
|
|
145
93
|
sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
|
|
146
94
|
}),
|
|
147
95
|
sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
|
|
@@ -42,7 +42,21 @@ process.env.NODE_ENV !== "production" ? ChartsItemTooltipContent.propTypes = {
|
|
|
42
42
|
}),
|
|
43
43
|
series: PropTypes.shape({
|
|
44
44
|
color: PropTypes.string,
|
|
45
|
-
data: PropTypes.arrayOf(PropTypes.number).
|
|
45
|
+
data: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.number), PropTypes.arrayOf(PropTypes.number), PropTypes.arrayOf(PropTypes.shape({
|
|
46
|
+
id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,
|
|
47
|
+
x: PropTypes.number.isRequired,
|
|
48
|
+
y: PropTypes.number.isRequired
|
|
49
|
+
})), PropTypes.arrayOf(PropTypes.shape({
|
|
50
|
+
color: PropTypes.string.isRequired,
|
|
51
|
+
endAngle: PropTypes.number.isRequired,
|
|
52
|
+
formattedValue: PropTypes.string.isRequired,
|
|
53
|
+
id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,
|
|
54
|
+
index: PropTypes.number.isRequired,
|
|
55
|
+
label: PropTypes.string,
|
|
56
|
+
padAngle: PropTypes.number.isRequired,
|
|
57
|
+
startAngle: PropTypes.number.isRequired,
|
|
58
|
+
value: PropTypes.number.isRequired
|
|
59
|
+
}))]).isRequired,
|
|
46
60
|
highlightScope: PropTypes.shape({
|
|
47
61
|
faded: PropTypes.oneOf(['global', 'none', 'series']),
|
|
48
62
|
highlighted: PropTypes.oneOf(['item', 'none', 'series'])
|
|
@@ -45,22 +45,23 @@ export var ChartsTooltipCell = styled('td', {
|
|
|
45
45
|
name: 'MuiChartsTooltip',
|
|
46
46
|
slot: 'Cell'
|
|
47
47
|
})(function (_ref4) {
|
|
48
|
-
var _ref5;
|
|
49
48
|
var theme = _ref4.theme;
|
|
50
|
-
return
|
|
49
|
+
return _defineProperty(_defineProperty(_defineProperty(_defineProperty({
|
|
51
50
|
verticalAlign: 'middle',
|
|
52
51
|
color: (theme.vars || theme).palette.text.secondary
|
|
53
|
-
},
|
|
52
|
+
}, "&.".concat(chartsTooltipClasses.labelCell), {
|
|
54
53
|
paddingLeft: theme.spacing(1)
|
|
55
|
-
}),
|
|
54
|
+
}), "&.".concat(chartsTooltipClasses.valueCell), {
|
|
56
55
|
paddingLeft: theme.spacing(4),
|
|
57
56
|
color: (theme.vars || theme).palette.text.primary
|
|
58
|
-
}),
|
|
57
|
+
}), 'td:first-of-type&', {
|
|
59
58
|
paddingLeft: theme.spacing(2)
|
|
60
|
-
}),
|
|
59
|
+
}), 'td:last-of-type&', {
|
|
61
60
|
paddingRight: theme.spacing(2)
|
|
62
|
-
})
|
|
61
|
+
});
|
|
63
62
|
});
|
|
63
|
+
|
|
64
|
+
// eslint-disable-next-line material-ui/no-styled-box
|
|
64
65
|
export var ChartsTooltipMark = styled(Box, {
|
|
65
66
|
name: 'MuiChartsTooltip',
|
|
66
67
|
slot: 'Mark'
|