@mui/x-charts 6.0.0-alpha.0 → 6.0.0-alpha.2

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 (126) hide show
  1. package/BarChart/BarChart.js +8 -5
  2. package/BarChart/legend.d.ts +3 -0
  3. package/BarChart/legend.js +20 -0
  4. package/CHANGELOG.md +136 -8
  5. package/ChartsAxis/ChartsAxis.d.ts +4 -4
  6. package/ChartsAxis/ChartsAxis.js +4 -4
  7. package/ChartsLegend/ChartsLegend.d.ts +5 -1
  8. package/ChartsLegend/ChartsLegend.js +5 -1
  9. package/ChartsLegend/utils.d.ts +1 -1
  10. package/ChartsLegend/utils.js +12 -1
  11. package/ChartsTooltip/ChartsAxisTooltipContent.js +1 -1
  12. package/ChartsTooltip/ChartsItemTooltipContent.js +11 -2
  13. package/ChartsTooltip/ChartsTooltipTable.js +8 -8
  14. package/LineChart/LineChart.js +8 -5
  15. package/LineChart/legend.d.ts +3 -0
  16. package/LineChart/legend.js +20 -0
  17. package/PieChart/PieArc.d.ts +36 -0
  18. package/PieChart/PieArc.js +128 -0
  19. package/PieChart/PieArcLabel.d.ts +36 -0
  20. package/PieChart/PieArcLabel.js +113 -0
  21. package/PieChart/PieChart.d.ts +20 -0
  22. package/PieChart/PieChart.js +292 -0
  23. package/PieChart/PiePlot.d.ts +2 -0
  24. package/PieChart/PiePlot.js +98 -0
  25. package/PieChart/formatter.d.ts +3 -0
  26. package/PieChart/formatter.js +49 -0
  27. package/PieChart/index.d.ts +4 -0
  28. package/PieChart/index.js +47 -0
  29. package/PieChart/legend.d.ts +3 -0
  30. package/PieChart/legend.js +19 -0
  31. package/PieChart/package.json +6 -0
  32. package/README.md +30 -2
  33. package/ResponsiveChartContainer/index.js +91 -25
  34. package/ScatterChart/Scatter.js +1 -1
  35. package/ScatterChart/ScatterChart.js +5 -4
  36. package/ScatterChart/legend.d.ts +3 -0
  37. package/ScatterChart/legend.js +20 -0
  38. package/context/SeriesContextProvider.js +11 -1
  39. package/esm/BarChart/BarChart.js +8 -5
  40. package/esm/BarChart/legend.js +13 -0
  41. package/esm/ChartsAxis/ChartsAxis.js +4 -4
  42. package/esm/ChartsLegend/ChartsLegend.js +5 -1
  43. package/esm/ChartsLegend/utils.js +11 -1
  44. package/esm/ChartsTooltip/ChartsAxisTooltipContent.js +1 -1
  45. package/esm/ChartsTooltip/ChartsItemTooltipContent.js +11 -3
  46. package/esm/ChartsTooltip/ChartsTooltipTable.js +8 -8
  47. package/esm/LineChart/LineChart.js +8 -5
  48. package/esm/LineChart/legend.js +13 -0
  49. package/esm/PieChart/PieArc.js +117 -0
  50. package/esm/PieChart/PieArcLabel.js +101 -0
  51. package/esm/PieChart/PieChart.js +285 -0
  52. package/esm/PieChart/PiePlot.js +92 -0
  53. package/esm/PieChart/formatter.js +48 -0
  54. package/esm/PieChart/index.js +4 -0
  55. package/esm/PieChart/legend.js +12 -0
  56. package/esm/ResponsiveChartContainer/index.js +94 -26
  57. package/esm/ScatterChart/Scatter.js +1 -1
  58. package/esm/ScatterChart/ScatterChart.js +5 -4
  59. package/esm/ScatterChart/legend.js +13 -0
  60. package/esm/context/SeriesContextProvider.js +11 -1
  61. package/esm/index.js +1 -0
  62. package/esm/internals/defaultizeColor.js +7 -0
  63. package/esm/models/seriesType/index.js +1 -8
  64. package/index.d.ts +1 -0
  65. package/index.js +12 -1
  66. package/internals/defaultizeColor.d.ts +35 -0
  67. package/internals/defaultizeColor.js +7 -0
  68. package/legacy/BarChart/BarChart.js +10 -7
  69. package/legacy/BarChart/legend.js +15 -0
  70. package/legacy/ChartsAxis/ChartsAxis.js +4 -4
  71. package/legacy/ChartsLegend/ChartsLegend.js +5 -1
  72. package/legacy/ChartsLegend/utils.js +12 -6
  73. package/legacy/ChartsTooltip/ChartsAxisTooltipContent.js +3 -1
  74. package/legacy/ChartsTooltip/ChartsItemTooltipContent.js +10 -3
  75. package/legacy/ChartsTooltip/ChartsTooltipTable.js +7 -9
  76. package/legacy/LineChart/LineChart.js +10 -7
  77. package/legacy/LineChart/legend.js +15 -0
  78. package/legacy/PieChart/PieArc.js +118 -0
  79. package/legacy/PieChart/PieArcLabel.js +101 -0
  80. package/legacy/PieChart/PieChart.js +297 -0
  81. package/legacy/PieChart/PiePlot.js +89 -0
  82. package/legacy/PieChart/formatter.js +55 -0
  83. package/legacy/PieChart/index.js +4 -0
  84. package/legacy/PieChart/legend.js +16 -0
  85. package/legacy/ResponsiveChartContainer/index.js +89 -26
  86. package/legacy/ScatterChart/Scatter.js +1 -1
  87. package/legacy/ScatterChart/ScatterChart.js +5 -4
  88. package/legacy/ScatterChart/legend.js +15 -0
  89. package/legacy/context/SeriesContextProvider.js +11 -1
  90. package/legacy/index.js +2 -1
  91. package/legacy/internals/defaultizeColor.js +9 -0
  92. package/legacy/models/seriesType/index.js +1 -8
  93. package/models/seriesType/bar.d.ts +1 -1
  94. package/models/seriesType/common.d.ts +1 -1
  95. package/models/seriesType/config.d.ts +29 -2
  96. package/models/seriesType/index.d.ts +7 -3
  97. package/models/seriesType/index.js +11 -0
  98. package/models/seriesType/line.d.ts +1 -1
  99. package/models/seriesType/pie.d.ts +103 -3
  100. package/models/seriesType/scatter.d.ts +1 -1
  101. package/modern/BarChart/BarChart.js +8 -5
  102. package/modern/BarChart/legend.js +13 -0
  103. package/modern/ChartsAxis/ChartsAxis.js +4 -4
  104. package/modern/ChartsLegend/ChartsLegend.js +5 -1
  105. package/modern/ChartsLegend/utils.js +11 -1
  106. package/modern/ChartsTooltip/ChartsAxisTooltipContent.js +1 -1
  107. package/modern/ChartsTooltip/ChartsItemTooltipContent.js +11 -2
  108. package/modern/ChartsTooltip/ChartsTooltipTable.js +8 -8
  109. package/modern/LineChart/LineChart.js +8 -5
  110. package/modern/LineChart/legend.js +13 -0
  111. package/modern/PieChart/PieArc.js +116 -0
  112. package/modern/PieChart/PieArcLabel.js +101 -0
  113. package/modern/PieChart/PieChart.js +285 -0
  114. package/modern/PieChart/PiePlot.js +91 -0
  115. package/modern/PieChart/formatter.js +41 -0
  116. package/modern/PieChart/index.js +4 -0
  117. package/modern/PieChart/legend.js +12 -0
  118. package/modern/ResponsiveChartContainer/index.js +91 -25
  119. package/modern/ScatterChart/Scatter.js +1 -1
  120. package/modern/ScatterChart/ScatterChart.js +5 -4
  121. package/modern/ScatterChart/legend.js +13 -0
  122. package/modern/context/SeriesContextProvider.js +11 -1
  123. package/modern/index.js +2 -1
  124. package/modern/internals/defaultizeColor.js +7 -0
  125. package/modern/models/seriesType/index.js +1 -8
  126. package/package.json +1 -3
@@ -0,0 +1,128 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.default = PieArc;
8
+ exports.getPieArcUtilityClass = getPieArcUtilityClass;
9
+ exports.pieArcClasses = void 0;
10
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
11
+ var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
12
+ var React = _interopRequireWildcard(require("react"));
13
+ var _d3Shape = require("d3-shape");
14
+ var _propTypes = _interopRequireDefault(require("prop-types"));
15
+ var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
16
+ var _generateUtilityClass = _interopRequireDefault(require("@mui/utils/generateUtilityClass"));
17
+ var _styles = require("@mui/material/styles");
18
+ var _generateUtilityClasses = _interopRequireDefault(require("@mui/utils/generateUtilityClasses"));
19
+ var _InteractionProvider = require("../context/InteractionProvider");
20
+ var _useInteractionItemProps = require("../hooks/useInteractionItemProps");
21
+ var _jsxRuntime = require("react/jsx-runtime");
22
+ const _excluded = ["id", "dataIndex", "classes", "color", "highlightScope", "innerRadius", "outerRadius", "cornerRadius", "highlighted", "faded"];
23
+ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
24
+ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
25
+ function getPieArcUtilityClass(slot) {
26
+ return (0, _generateUtilityClass.default)('MuiPieArc', slot);
27
+ }
28
+ const pieArcClasses = (0, _generateUtilityClasses.default)('MuiPieArc', ['root', 'highlighted', 'faded']);
29
+ exports.pieArcClasses = pieArcClasses;
30
+ const useUtilityClasses = ownerState => {
31
+ const {
32
+ classes,
33
+ id,
34
+ isFaded,
35
+ isHighlighted
36
+ } = ownerState;
37
+ const slots = {
38
+ root: ['root', `series-${id}`, isHighlighted && 'highlighted', isFaded && 'faded']
39
+ };
40
+ return (0, _composeClasses.default)(slots, getPieArcUtilityClass, classes);
41
+ };
42
+ const PieArcRoot = (0, _styles.styled)('path', {
43
+ name: 'MuiPieArc',
44
+ slot: 'Root',
45
+ overridesResolver: (_, styles) => styles.arc
46
+ })(({
47
+ ownerState,
48
+ theme
49
+ }) => ({
50
+ stroke: theme.palette.background.paper,
51
+ strokeWidth: 1,
52
+ strokeLinejoin: 'round',
53
+ fill: ownerState.color,
54
+ opacity: ownerState.isFaded ? 0.3 : 1
55
+ }));
56
+ function PieArc(props) {
57
+ const {
58
+ id,
59
+ dataIndex,
60
+ classes: innerClasses,
61
+ color,
62
+ highlightScope,
63
+ innerRadius: baseInnerRadius = 0,
64
+ outerRadius: baseOuterRadius,
65
+ cornerRadius: baseCornerRadius = 0,
66
+ highlighted,
67
+ faded = {
68
+ additionalRadius: -5
69
+ }
70
+ } = props,
71
+ other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
72
+ const getInteractionItemProps = (0, _useInteractionItemProps.useInteractionItemProps)(highlightScope);
73
+ const {
74
+ item
75
+ } = React.useContext(_InteractionProvider.InteractionContext);
76
+ const isHighlighted = (0, _useInteractionItemProps.getIsHighlighted)(item, {
77
+ type: 'pie',
78
+ seriesId: id,
79
+ dataIndex
80
+ }, highlightScope);
81
+ const isFaded = !isHighlighted && (0, _useInteractionItemProps.getIsFaded)(item, {
82
+ type: 'pie',
83
+ seriesId: id,
84
+ dataIndex
85
+ }, highlightScope);
86
+ const ownerState = {
87
+ id,
88
+ dataIndex,
89
+ classes: innerClasses,
90
+ color,
91
+ isFaded,
92
+ isHighlighted
93
+ };
94
+ const classes = useUtilityClasses(ownerState);
95
+ const attibuesOverride = (0, _extends2.default)({
96
+ additionalRadius: 0
97
+ }, isFaded && faded || isHighlighted && highlighted || {});
98
+ const innerRadius = Math.max(0, attibuesOverride.innerRadius ?? baseInnerRadius);
99
+ const outerRadius = Math.max(0, attibuesOverride.outerRadius ?? baseOuterRadius + attibuesOverride.additionalRadius);
100
+ const cornerRadius = attibuesOverride.cornerRadius ?? baseCornerRadius;
101
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(PieArcRoot, (0, _extends2.default)({
102
+ d: (0, _d3Shape.arc)().cornerRadius(cornerRadius)((0, _extends2.default)({}, other, {
103
+ innerRadius,
104
+ outerRadius
105
+ })),
106
+ ownerState: ownerState,
107
+ className: classes.root
108
+ }, getInteractionItemProps({
109
+ type: 'pie',
110
+ seriesId: id,
111
+ dataIndex
112
+ })));
113
+ }
114
+ process.env.NODE_ENV !== "production" ? PieArc.propTypes = {
115
+ // ----------------------------- Warning --------------------------------
116
+ // | These PropTypes are generated from the TypeScript type definitions |
117
+ // | To update them edit the TypeScript types and run "yarn proptypes" |
118
+ // ----------------------------------------------------------------------
119
+ classes: _propTypes.default.object,
120
+ cornerRadius: _propTypes.default.number,
121
+ dataIndex: _propTypes.default.number.isRequired,
122
+ highlightScope: _propTypes.default.shape({
123
+ faded: _propTypes.default.oneOf(['global', 'none', 'series']),
124
+ highlighted: _propTypes.default.oneOf(['item', 'none', 'series'])
125
+ }),
126
+ innerRadius: _propTypes.default.number,
127
+ outerRadius: _propTypes.default.number.isRequired
128
+ } : void 0;
@@ -0,0 +1,36 @@
1
+ import * as React from 'react';
2
+ import { PieArcDatum as D3PieArcDatum } from 'd3-shape';
3
+ import { HighlightScope } from '../context/HighlightProvider';
4
+ import { PieSeriesType } from '../models/seriesType/pie';
5
+ export interface PieArcLabelClasses {
6
+ /** Styles applied to the root element. */
7
+ root: string;
8
+ /** Styles applied to the root element when higlighted. */
9
+ highlighted: string;
10
+ /** Styles applied to the root element when faded. */
11
+ faded: string;
12
+ }
13
+ export type PieArcLabelClassKey = keyof PieArcLabelClasses;
14
+ export interface PieArcLabelOwnerState {
15
+ id: string;
16
+ dataIndex: number;
17
+ color: string;
18
+ isFaded: boolean;
19
+ isHighlighted: boolean;
20
+ classes?: Partial<PieArcLabelClasses>;
21
+ }
22
+ export declare function getPieArcLabelUtilityClass(slot: string): string;
23
+ export declare const pieArcLabelClasses: PieArcLabelClasses;
24
+ export type PieArcLabelProps = Omit<PieArcLabelOwnerState, 'isFaded' | 'isHighlighted'> & React.ComponentPropsWithoutRef<'path'> & D3PieArcDatum<any> & {
25
+ highlightScope?: Partial<HighlightScope>;
26
+ innerRadius: PieSeriesType['innerRadius'];
27
+ outerRadius: number;
28
+ cornerRadius: PieSeriesType['cornerRadius'];
29
+ } & {
30
+ formattedArcLabel?: string | null;
31
+ };
32
+ declare function PieArcLabel(props: PieArcLabelProps): React.JSX.Element;
33
+ declare namespace PieArcLabel {
34
+ var propTypes: any;
35
+ }
36
+ export default PieArcLabel;
@@ -0,0 +1,113 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.default = PieArcLabel;
8
+ exports.getPieArcLabelUtilityClass = getPieArcLabelUtilityClass;
9
+ exports.pieArcLabelClasses = void 0;
10
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
11
+ var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
12
+ var React = _interopRequireWildcard(require("react"));
13
+ var _d3Shape = require("d3-shape");
14
+ var _propTypes = _interopRequireDefault(require("prop-types"));
15
+ var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
16
+ var _generateUtilityClass = _interopRequireDefault(require("@mui/utils/generateUtilityClass"));
17
+ var _styles = require("@mui/material/styles");
18
+ var _generateUtilityClasses = _interopRequireDefault(require("@mui/utils/generateUtilityClasses"));
19
+ var _InteractionProvider = require("../context/InteractionProvider");
20
+ var _useInteractionItemProps = require("../hooks/useInteractionItemProps");
21
+ var _jsxRuntime = require("react/jsx-runtime");
22
+ const _excluded = ["id", "dataIndex", "classes", "color", "highlightScope", "innerRadius", "outerRadius", "cornerRadius", "formattedArcLabel"];
23
+ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
24
+ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
25
+ function getPieArcLabelUtilityClass(slot) {
26
+ return (0, _generateUtilityClass.default)('MuiPieArcLabel', slot);
27
+ }
28
+ const pieArcLabelClasses = (0, _generateUtilityClasses.default)('MuiPieArcLabel', ['root', 'highlighted', 'faded']);
29
+ exports.pieArcLabelClasses = pieArcLabelClasses;
30
+ const useUtilityClasses = ownerState => {
31
+ const {
32
+ classes,
33
+ id,
34
+ isFaded,
35
+ isHighlighted
36
+ } = ownerState;
37
+ const slots = {
38
+ root: ['root', `series-${id}`, isHighlighted && 'highlighted', isFaded && 'faded']
39
+ };
40
+ return (0, _composeClasses.default)(slots, getPieArcLabelUtilityClass, classes);
41
+ };
42
+ const PieArcLabelRoot = (0, _styles.styled)('text', {
43
+ name: 'MuiPieArcLabel',
44
+ slot: 'Root',
45
+ overridesResolver: (_, styles) => styles.root
46
+ })(({
47
+ theme
48
+ }) => ({
49
+ fill: theme.palette.text.primary,
50
+ alignmentBaseline: 'baseline',
51
+ textAnchor: 'middle'
52
+ }));
53
+ function PieArcLabel(props) {
54
+ const {
55
+ id,
56
+ dataIndex,
57
+ classes: innerClasses,
58
+ color,
59
+ highlightScope,
60
+ innerRadius = 0,
61
+ outerRadius,
62
+ cornerRadius = 0,
63
+ formattedArcLabel
64
+ } = props,
65
+ other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
66
+ const {
67
+ item
68
+ } = React.useContext(_InteractionProvider.InteractionContext);
69
+ const isHighlighted = (0, _useInteractionItemProps.getIsHighlighted)(item, {
70
+ type: 'pie',
71
+ seriesId: id,
72
+ dataIndex
73
+ }, highlightScope);
74
+ const isFaded = !isHighlighted && (0, _useInteractionItemProps.getIsFaded)(item, {
75
+ type: 'pie',
76
+ seriesId: id,
77
+ dataIndex
78
+ }, highlightScope);
79
+ const ownerState = {
80
+ id,
81
+ dataIndex,
82
+ classes: innerClasses,
83
+ color,
84
+ isFaded,
85
+ isHighlighted
86
+ };
87
+ const classes = useUtilityClasses(ownerState);
88
+ const arcLabelPosition = formattedArcLabel ? (0, _d3Shape.arc)().cornerRadius(cornerRadius).centroid((0, _extends2.default)({}, other, {
89
+ innerRadius,
90
+ outerRadius
91
+ })) : [0, 0];
92
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(PieArcLabelRoot, {
93
+ className: classes.root,
94
+ x: arcLabelPosition[0],
95
+ y: arcLabelPosition[1],
96
+ children: formattedArcLabel
97
+ });
98
+ }
99
+ process.env.NODE_ENV !== "production" ? PieArcLabel.propTypes = {
100
+ // ----------------------------- Warning --------------------------------
101
+ // | These PropTypes are generated from the TypeScript type definitions |
102
+ // | To update them edit the TypeScript types and run "yarn proptypes" |
103
+ // ----------------------------------------------------------------------
104
+ classes: _propTypes.default.object,
105
+ cornerRadius: _propTypes.default.number,
106
+ dataIndex: _propTypes.default.number.isRequired,
107
+ highlightScope: _propTypes.default.shape({
108
+ faded: _propTypes.default.oneOf(['global', 'none', 'series']),
109
+ highlighted: _propTypes.default.oneOf(['item', 'none', 'series'])
110
+ }),
111
+ innerRadius: _propTypes.default.number,
112
+ outerRadius: _propTypes.default.number.isRequired
113
+ } : void 0;
@@ -0,0 +1,20 @@
1
+ import * as React from 'react';
2
+ import { ResponsiveChartContainerProps } from '../ResponsiveChartContainer';
3
+ import { ChartsAxisProps } from '../ChartsAxis/ChartsAxis';
4
+ import { PieSeriesType } from '../models/seriesType';
5
+ import { MakeOptional } from '../models/helpers';
6
+ import { ChartsTooltipProps } from '../ChartsTooltip';
7
+ import { ChartsLegendProps } from '../ChartsLegend';
8
+ import { ChartsAxisHighlightProps } from '../ChartsAxisHighlight';
9
+ import { PieValueType } from '../models/seriesType/pie';
10
+ export interface PieChartProps extends Omit<ResponsiveChartContainerProps, 'series'>, ChartsAxisProps {
11
+ series: MakeOptional<PieSeriesType<MakeOptional<PieValueType, 'id'>>, 'type'>[];
12
+ tooltip?: ChartsTooltipProps;
13
+ axisHighlight?: ChartsAxisHighlightProps;
14
+ legend?: ChartsLegendProps;
15
+ }
16
+ declare function PieChart(props: PieChartProps): React.JSX.Element;
17
+ declare namespace PieChart {
18
+ var propTypes: any;
19
+ }
20
+ export { PieChart };
@@ -0,0 +1,292 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.PieChart = PieChart;
8
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
9
+ var React = _interopRequireWildcard(require("react"));
10
+ var _propTypes = _interopRequireDefault(require("prop-types"));
11
+ var _ResponsiveChartContainer = require("../ResponsiveChartContainer");
12
+ var _ChartsAxis = require("../ChartsAxis/ChartsAxis");
13
+ var _constants = require("../constants");
14
+ var _ChartsTooltip = require("../ChartsTooltip");
15
+ var _ChartsLegend = require("../ChartsLegend");
16
+ var _ChartsAxisHighlight = require("../ChartsAxisHighlight");
17
+ var _PiePlot = require("./PiePlot");
18
+ var _jsxRuntime = require("react/jsx-runtime");
19
+ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
20
+ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
21
+ const defaultMargin = {
22
+ top: 5,
23
+ bottom: 5,
24
+ left: 5,
25
+ right: 100
26
+ };
27
+ function PieChart(props) {
28
+ const {
29
+ xAxis,
30
+ yAxis,
31
+ series,
32
+ width,
33
+ height,
34
+ margin: marginProps,
35
+ colors,
36
+ sx,
37
+ tooltip = {
38
+ trigger: 'item'
39
+ },
40
+ axisHighlight = {
41
+ x: 'none',
42
+ y: 'none'
43
+ },
44
+ legend = {
45
+ direction: 'column',
46
+ position: {
47
+ vertical: 'middle',
48
+ horizontal: 'right'
49
+ }
50
+ },
51
+ topAxis = null,
52
+ leftAxis = null,
53
+ rightAxis = null,
54
+ bottomAxis = null,
55
+ children
56
+ } = props;
57
+ const margin = (0, _extends2.default)({}, defaultMargin, marginProps);
58
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ResponsiveChartContainer.ResponsiveChartContainer, {
59
+ series: series.map(s => (0, _extends2.default)({
60
+ type: 'pie'
61
+ }, s)),
62
+ width: width,
63
+ height: height,
64
+ margin: margin,
65
+ xAxis: xAxis ?? [{
66
+ id: _constants.DEFAULT_X_AXIS_KEY,
67
+ scaleType: 'point',
68
+ data: [...new Array(Math.max(...series.map(s => s.data.length)))].map((_, index) => index)
69
+ }],
70
+ yAxis: yAxis,
71
+ colors: colors,
72
+ sx: sx,
73
+ disableAxisListener: tooltip?.trigger !== 'axis' && axisHighlight?.x === 'none' && axisHighlight?.y === 'none',
74
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsAxis.ChartsAxis, {
75
+ topAxis: topAxis,
76
+ leftAxis: leftAxis,
77
+ rightAxis: rightAxis,
78
+ bottomAxis: bottomAxis
79
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_PiePlot.PiePlot, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsLegend.ChartsLegend, (0, _extends2.default)({}, legend)), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsAxisHighlight.ChartsAxisHighlight, (0, _extends2.default)({}, axisHighlight)), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsTooltip.ChartsTooltip, (0, _extends2.default)({}, tooltip)), children]
80
+ });
81
+ }
82
+ process.env.NODE_ENV !== "production" ? PieChart.propTypes = {
83
+ // ----------------------------- Warning --------------------------------
84
+ // | These PropTypes are generated from the TypeScript type definitions |
85
+ // | To update them edit the TypeScript types and run "yarn proptypes" |
86
+ // ----------------------------------------------------------------------
87
+ axisHighlight: _propTypes.default.shape({
88
+ x: _propTypes.default.oneOf(['band', 'line', 'none']),
89
+ y: _propTypes.default.oneOf(['line', 'none'])
90
+ }),
91
+ /**
92
+ * Indicate which axis to display the bottom of the charts.
93
+ * Can be a string (the id of the axis) or an object `ChartsXAxisProps`
94
+ * @default xAxisIds[0] The id of the first provided axis
95
+ */
96
+ bottomAxis: _propTypes.default.oneOfType([_propTypes.default.shape({
97
+ axisId: _propTypes.default.string.isRequired,
98
+ classes: _propTypes.default.object,
99
+ disableLine: _propTypes.default.bool,
100
+ disableTicks: _propTypes.default.bool,
101
+ fill: _propTypes.default.string,
102
+ label: _propTypes.default.string,
103
+ labelFontSize: _propTypes.default.number,
104
+ position: _propTypes.default.oneOf(['bottom', 'top']),
105
+ stroke: _propTypes.default.string,
106
+ tickFontSize: _propTypes.default.number,
107
+ tickSize: _propTypes.default.number
108
+ }), _propTypes.default.string]),
109
+ children: _propTypes.default.node,
110
+ className: _propTypes.default.string,
111
+ /**
112
+ * Color palette used to colorize multiple series.
113
+ */
114
+ colors: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.string), _propTypes.default.func]),
115
+ desc: _propTypes.default.string,
116
+ disableAxisListener: _propTypes.default.bool,
117
+ height: _propTypes.default.number,
118
+ /**
119
+ * Indicate which axis to display the left of the charts.
120
+ * Can be a string (the id of the axis) or an object `ChartsYAxisProps`
121
+ * @default yAxisIds[0] The id of the first provided axis
122
+ */
123
+ leftAxis: _propTypes.default.oneOfType([_propTypes.default.shape({
124
+ axisId: _propTypes.default.string.isRequired,
125
+ classes: _propTypes.default.object,
126
+ disableLine: _propTypes.default.bool,
127
+ disableTicks: _propTypes.default.bool,
128
+ fill: _propTypes.default.string,
129
+ label: _propTypes.default.string,
130
+ labelFontSize: _propTypes.default.number,
131
+ position: _propTypes.default.oneOf(['left', 'right']),
132
+ stroke: _propTypes.default.string,
133
+ tickFontSize: _propTypes.default.number,
134
+ tickSize: _propTypes.default.number
135
+ }), _propTypes.default.string]),
136
+ legend: _propTypes.default.shape({
137
+ classes: _propTypes.default.object,
138
+ direction: _propTypes.default.oneOf(['column', 'row']),
139
+ hidden: _propTypes.default.bool,
140
+ itemWidth: _propTypes.default.number,
141
+ markSize: _propTypes.default.number,
142
+ offset: _propTypes.default.shape({
143
+ x: _propTypes.default.number,
144
+ y: _propTypes.default.number
145
+ }),
146
+ position: _propTypes.default.shape({
147
+ horizontal: _propTypes.default.oneOf(['left', 'middle', 'right']).isRequired,
148
+ vertical: _propTypes.default.oneOf(['bottom', 'middle', 'top']).isRequired
149
+ }),
150
+ spacing: _propTypes.default.number
151
+ }),
152
+ margin: _propTypes.default.shape({
153
+ bottom: _propTypes.default.number,
154
+ left: _propTypes.default.number,
155
+ right: _propTypes.default.number,
156
+ top: _propTypes.default.number
157
+ }),
158
+ /**
159
+ * Indicate which axis to display the right of the charts.
160
+ * Can be a string (the id of the axis) or an object `ChartsYAxisProps`
161
+ * @default null
162
+ */
163
+ rightAxis: _propTypes.default.oneOfType([_propTypes.default.shape({
164
+ axisId: _propTypes.default.string.isRequired,
165
+ classes: _propTypes.default.object,
166
+ disableLine: _propTypes.default.bool,
167
+ disableTicks: _propTypes.default.bool,
168
+ fill: _propTypes.default.string,
169
+ label: _propTypes.default.string,
170
+ labelFontSize: _propTypes.default.number,
171
+ position: _propTypes.default.oneOf(['left', 'right']),
172
+ stroke: _propTypes.default.string,
173
+ tickFontSize: _propTypes.default.number,
174
+ tickSize: _propTypes.default.number
175
+ }), _propTypes.default.string]),
176
+ series: _propTypes.default.arrayOf(_propTypes.default.shape({
177
+ arcLabel: _propTypes.default.oneOfType([_propTypes.default.oneOf(['formattedValue', 'label', 'value']), _propTypes.default.func]),
178
+ arcLabelMinAngle: _propTypes.default.number,
179
+ color: _propTypes.default.string,
180
+ cornerRadius: _propTypes.default.number,
181
+ cx: _propTypes.default.number,
182
+ cy: _propTypes.default.number,
183
+ data: _propTypes.default.arrayOf(_propTypes.default.shape({
184
+ color: _propTypes.default.string,
185
+ id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
186
+ label: _propTypes.default.string,
187
+ value: _propTypes.default.number.isRequired
188
+ })).isRequired,
189
+ endAngle: _propTypes.default.number,
190
+ faded: _propTypes.default.shape({
191
+ additionalRadius: _propTypes.default.number,
192
+ cornerRadius: _propTypes.default.number,
193
+ innerRadius: _propTypes.default.number,
194
+ outerRadius: _propTypes.default.number
195
+ }),
196
+ highlighted: _propTypes.default.shape({
197
+ additionalRadius: _propTypes.default.number,
198
+ cornerRadius: _propTypes.default.number,
199
+ innerRadius: _propTypes.default.number,
200
+ outerRadius: _propTypes.default.number
201
+ }),
202
+ highlightScope: _propTypes.default.shape({
203
+ faded: _propTypes.default.oneOf(['global', 'none', 'series']),
204
+ highlighted: _propTypes.default.oneOf(['item', 'none', 'series'])
205
+ }),
206
+ id: _propTypes.default.string,
207
+ innerRadius: _propTypes.default.number,
208
+ outerRadius: _propTypes.default.number,
209
+ paddingAngle: _propTypes.default.number,
210
+ sortingValues: _propTypes.default.oneOfType([_propTypes.default.oneOf(['asc', 'desc', 'none']), _propTypes.default.func]),
211
+ startAngle: _propTypes.default.number,
212
+ type: _propTypes.default.oneOf(['pie']),
213
+ valueFormatter: _propTypes.default.func
214
+ })).isRequired,
215
+ sx: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object, _propTypes.default.bool])), _propTypes.default.func, _propTypes.default.object]),
216
+ title: _propTypes.default.string,
217
+ tooltip: _propTypes.default.shape({
218
+ axisContent: _propTypes.default.elementType,
219
+ classes: _propTypes.default.object,
220
+ itemContent: _propTypes.default.elementType,
221
+ trigger: _propTypes.default.oneOf(['axis', 'item', 'none'])
222
+ }),
223
+ /**
224
+ * Indicate which axis to display the top of the charts.
225
+ * Can be a string (the id of the axis) or an object `ChartsXAxisProps`
226
+ * @default null
227
+ */
228
+ topAxis: _propTypes.default.oneOfType([_propTypes.default.shape({
229
+ axisId: _propTypes.default.string.isRequired,
230
+ classes: _propTypes.default.object,
231
+ disableLine: _propTypes.default.bool,
232
+ disableTicks: _propTypes.default.bool,
233
+ fill: _propTypes.default.string,
234
+ label: _propTypes.default.string,
235
+ labelFontSize: _propTypes.default.number,
236
+ position: _propTypes.default.oneOf(['bottom', 'top']),
237
+ stroke: _propTypes.default.string,
238
+ tickFontSize: _propTypes.default.number,
239
+ tickSize: _propTypes.default.number
240
+ }), _propTypes.default.string]),
241
+ viewBox: _propTypes.default.shape({
242
+ height: _propTypes.default.number,
243
+ width: _propTypes.default.number,
244
+ x: _propTypes.default.number,
245
+ y: _propTypes.default.number
246
+ }),
247
+ width: _propTypes.default.number,
248
+ xAxis: _propTypes.default.arrayOf(_propTypes.default.shape({
249
+ axisId: _propTypes.default.string,
250
+ classes: _propTypes.default.object,
251
+ data: _propTypes.default.array,
252
+ disableLine: _propTypes.default.bool,
253
+ disableTicks: _propTypes.default.bool,
254
+ fill: _propTypes.default.string,
255
+ id: _propTypes.default.string,
256
+ label: _propTypes.default.string,
257
+ labelFontSize: _propTypes.default.number,
258
+ max: _propTypes.default.number,
259
+ maxTicks: _propTypes.default.number,
260
+ min: _propTypes.default.number,
261
+ minTicks: _propTypes.default.number,
262
+ position: _propTypes.default.oneOf(['bottom', 'left', 'right', 'top']),
263
+ scaleType: _propTypes.default.oneOf(['band', 'linear', 'log', 'point', 'pow', 'sqrt', 'time', 'utc']),
264
+ stroke: _propTypes.default.string,
265
+ tickFontSize: _propTypes.default.number,
266
+ tickSize: _propTypes.default.number,
267
+ tickSpacing: _propTypes.default.number,
268
+ valueFormatter: _propTypes.default.func
269
+ })),
270
+ yAxis: _propTypes.default.arrayOf(_propTypes.default.shape({
271
+ axisId: _propTypes.default.string,
272
+ classes: _propTypes.default.object,
273
+ data: _propTypes.default.array,
274
+ disableLine: _propTypes.default.bool,
275
+ disableTicks: _propTypes.default.bool,
276
+ fill: _propTypes.default.string,
277
+ id: _propTypes.default.string,
278
+ label: _propTypes.default.string,
279
+ labelFontSize: _propTypes.default.number,
280
+ max: _propTypes.default.number,
281
+ maxTicks: _propTypes.default.number,
282
+ min: _propTypes.default.number,
283
+ minTicks: _propTypes.default.number,
284
+ position: _propTypes.default.oneOf(['bottom', 'left', 'right', 'top']),
285
+ scaleType: _propTypes.default.oneOf(['band', 'linear', 'log', 'point', 'pow', 'sqrt', 'time', 'utc']),
286
+ stroke: _propTypes.default.string,
287
+ tickFontSize: _propTypes.default.number,
288
+ tickSize: _propTypes.default.number,
289
+ tickSpacing: _propTypes.default.number,
290
+ valueFormatter: _propTypes.default.func
291
+ }))
292
+ } : void 0;
@@ -0,0 +1,2 @@
1
+ import * as React from 'react';
2
+ export declare function PiePlot(): React.JSX.Element | null;