@octanejs/recharts 0.1.62 → 0.1.63
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/package.json +5 -5
- package/src/animation/AnimatedItems.tsrx +36 -31
- package/src/animation/CSSTransitionAnimate.tsrx +1 -2
- package/src/animation/JavascriptAnimate.tsrx +1 -2
- package/src/cartesian/Area.tsrx +414 -386
- package/src/cartesian/AreaRevealShape.tsrx +103 -84
- package/src/cartesian/Bar.tsrx +343 -317
- package/src/cartesian/BarStack.tsrx +33 -28
- package/src/cartesian/CartesianAxis.tsrx +168 -165
- package/src/cartesian/CartesianGrid.tsrx +256 -272
- package/src/cartesian/ErrorBar.tsrx +108 -104
- package/src/cartesian/Funnel.tsrx +405 -382
- package/src/cartesian/GraphicalItemClipPath.tsrx +4 -8
- package/src/cartesian/Line.tsrx +190 -177
- package/src/cartesian/LineDrawShape.tsrx +14 -15
- package/src/cartesian/ReferenceLine.tsrx +119 -105
- package/src/cartesian/Scatter.tsrx +416 -398
- package/src/cartesian/XAxis.tsrx +39 -32
- package/src/cartesian/YAxis.tsrx +47 -37
- package/src/cartesian/ZAxis.tsrx +76 -73
- package/src/chart/AreaChart.tsrx +15 -11
- package/src/chart/BarChart.tsrx +15 -11
- package/src/chart/CategoricalChart.tsrx +32 -26
- package/src/chart/ComposedChart.tsrx +15 -11
- package/src/chart/FunnelChart.tsrx +15 -11
- package/src/chart/LineChart.tsrx +15 -11
- package/src/chart/PieChart.tsrx +15 -11
- package/src/chart/PolarChart.tsrx +45 -48
- package/src/chart/RadarChart.tsrx +38 -32
- package/src/chart/RadialBarChart.tsrx +15 -11
- package/src/chart/RechartsWrapper.tsrx +214 -162
- package/src/chart/Sankey.tsrx +412 -378
- package/src/chart/ScatterChart.tsrx +15 -11
- package/src/chart/SunburstChart.tsrx +162 -155
- package/src/component/ActivePoints.tsrx +19 -13
- package/src/component/Cursor.tsrx +25 -18
- package/src/component/DefaultLegendContent.tsrx +131 -127
- package/src/component/DefaultTooltipContent.tsrx +46 -42
- package/src/component/Dots.tsrx +11 -5
- package/src/component/Label.tsrx +69 -55
- package/src/component/LabelList.tsrx +32 -27
- package/src/component/Legend.tsrx +120 -123
- package/src/component/ResponsiveContainer.tsrx +18 -11
- package/src/component/Text.tsrx +50 -43
- package/src/component/Tooltip.tsrx +234 -223
- package/src/component/TooltipBoundingBox.tsrx +34 -34
- package/src/container/ClipPathProvider.tsrx +1 -3
- package/src/container/Layer.tsrx +5 -1
- package/src/container/RootSurface.tsrx +31 -21
- package/src/container/Surface.tsrx +15 -13
- package/src/context/ErrorBarContext.tsrx +5 -5
- package/src/polar/Pie.tsrx +541 -487
- package/src/polar/PolarAngleAxis.tsrx +245 -227
- package/src/polar/PolarGrid.tsrx +139 -127
- package/src/polar/PolarRadiusAxis.tsrx +204 -185
- package/src/polar/Radar.tsrx +274 -264
- package/src/polar/RadialBar.tsrx +408 -361
- package/src/shape/Cross.tsrx +13 -7
- package/src/shape/Curve.tsrx +54 -44
- package/src/shape/Dot.tsrx +10 -8
- package/src/shape/Polygon.tsrx +38 -29
- package/src/shape/Rectangle.tsrx +73 -28
- package/src/shape/Sector.tsrx +30 -18
- package/src/shape/Symbols.tsrx +13 -11
- package/src/shape/Trapezoid.tsrx +16 -11
- package/src/state/RechartsStoreProvider.tsrx +5 -1
- package/src/synchronisation/useChartSynchronisation.tsrx +8 -7
- package/src/util/BarUtils.tsrx +43 -40
- package/src/util/FunnelUtils.tsrx +5 -5
- package/src/util/RadialBarUtils.tsrx +3 -4
- package/src/util/ScatterUtils.tsrx +13 -8
- package/src/zIndex/ZIndexLayer.tsrx +2 -2
- package/src/zIndex/ZIndexPortal.tsrx +2 -8
package/src/chart/PieChart.tsrx
CHANGED
|
@@ -19,17 +19,21 @@ export const defaultPieChartProps = {
|
|
|
19
19
|
* @provides PolarViewBoxContext
|
|
20
20
|
* @provides PolarChartContext
|
|
21
21
|
*/
|
|
22
|
-
export function PieChart<DataPointType = unknown>(
|
|
23
|
-
|
|
24
|
-
|
|
22
|
+
export function PieChart<DataPointType = unknown>(
|
|
23
|
+
props: PolarChartProps<DataPointType> & {
|
|
24
|
+
ref?: Ref<SVGSVGElement>;
|
|
25
|
+
},
|
|
26
|
+
) {
|
|
25
27
|
const { ref, ...rest } = props;
|
|
26
28
|
const propsWithDefaults = resolveDefaultProps(rest, defaultPieChartProps);
|
|
27
|
-
return
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
29
|
+
return (
|
|
30
|
+
<PolarChart
|
|
31
|
+
chartName="PieChart"
|
|
32
|
+
defaultTooltipEventType="item"
|
|
33
|
+
validateTooltipEventTypes={allowedTooltipTypes}
|
|
34
|
+
tooltipPayloadSearcher={arrayTooltipSearcher}
|
|
35
|
+
categoricalChartProps={propsWithDefaults}
|
|
36
|
+
ref={ref}
|
|
37
|
+
/>
|
|
38
|
+
);
|
|
35
39
|
}
|
|
@@ -42,15 +42,14 @@ export const defaultPolarChartProps = {
|
|
|
42
42
|
* We can't have the defaults in this file because each of those convenience components
|
|
43
43
|
* have their own opinions about what they should be.
|
|
44
44
|
*/
|
|
45
|
-
type PolarChartPropsWithDefaults =
|
|
46
|
-
PolarChartProps
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
};
|
|
45
|
+
type PolarChartPropsWithDefaults = PolarChartProps & {
|
|
46
|
+
cx: NonNullable<PolarChartProps['cx']>;
|
|
47
|
+
cy: NonNullable<PolarChartProps['cy']>;
|
|
48
|
+
startAngle: NonNullable<PolarChartProps['startAngle']>;
|
|
49
|
+
endAngle: NonNullable<PolarChartProps['endAngle']>;
|
|
50
|
+
innerRadius: NonNullable<PolarChartProps['innerRadius']>;
|
|
51
|
+
outerRadius: NonNullable<PolarChartProps['outerRadius']>;
|
|
52
|
+
};
|
|
54
53
|
|
|
55
54
|
/**
|
|
56
55
|
* These are one-time, immutable options that decide the chart's behavior.
|
|
@@ -71,12 +70,8 @@ export function PolarChart(props: PolarChartOptions & { ref?: Ref<SVGSVGElement>
|
|
|
71
70
|
|
|
72
71
|
const { layout, ...otherCategoricalProps } = polarChartProps;
|
|
73
72
|
|
|
74
|
-
const {
|
|
75
|
-
|
|
76
|
-
defaultTooltipEventType,
|
|
77
|
-
validateTooltipEventTypes,
|
|
78
|
-
tooltipPayloadSearcher,
|
|
79
|
-
} = props;
|
|
73
|
+
const { chartName, defaultTooltipEventType, validateTooltipEventTypes, tooltipPayloadSearcher } =
|
|
74
|
+
props;
|
|
80
75
|
|
|
81
76
|
const options: ChartOptions = {
|
|
82
77
|
chartName,
|
|
@@ -86,37 +81,39 @@ export function PolarChart(props: PolarChartOptions & { ref?: Ref<SVGSVGElement>
|
|
|
86
81
|
eventEmitter: undefined,
|
|
87
82
|
};
|
|
88
83
|
|
|
89
|
-
return
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
84
|
+
return (
|
|
85
|
+
<RechartsStoreProvider
|
|
86
|
+
preloadedState={{ options }}
|
|
87
|
+
reduxStoreName={polarChartProps.id ?? chartName}
|
|
88
|
+
>
|
|
89
|
+
<ChartDataContextProvider chartData={polarChartProps.data} />
|
|
90
|
+
<ReportMainChartProps layout={layout} margin={polarChartProps.margin} />
|
|
91
|
+
<ReportEventSettings
|
|
92
|
+
throttleDelay={polarChartProps.throttleDelay}
|
|
93
|
+
throttledEvents={polarChartProps.throttledEvents}
|
|
94
|
+
/>
|
|
95
|
+
<ReportChartProps
|
|
96
|
+
baseValue={undefined}
|
|
97
|
+
accessibilityLayer={polarChartProps.accessibilityLayer}
|
|
98
|
+
barCategoryGap={polarChartProps.barCategoryGap}
|
|
99
|
+
maxBarSize={polarChartProps.maxBarSize}
|
|
100
|
+
stackOffset={polarChartProps.stackOffset}
|
|
101
|
+
barGap={polarChartProps.barGap}
|
|
102
|
+
barSize={polarChartProps.barSize}
|
|
103
|
+
syncId={polarChartProps.syncId}
|
|
104
|
+
syncMethod={polarChartProps.syncMethod}
|
|
105
|
+
className={polarChartProps.className}
|
|
106
|
+
reverseStackOrder={polarChartProps.reverseStackOrder}
|
|
107
|
+
/>
|
|
108
|
+
<ReportPolarOptions
|
|
109
|
+
cx={polarChartProps.cx}
|
|
110
|
+
cy={polarChartProps.cy}
|
|
111
|
+
startAngle={polarChartProps.startAngle}
|
|
112
|
+
endAngle={polarChartProps.endAngle}
|
|
113
|
+
innerRadius={polarChartProps.innerRadius}
|
|
114
|
+
outerRadius={polarChartProps.outerRadius}
|
|
115
|
+
/>
|
|
116
|
+
<CategoricalChart {...otherCategoricalProps} ref={ref} />
|
|
117
|
+
</RechartsStoreProvider>
|
|
118
|
+
);
|
|
122
119
|
}
|
|
@@ -14,44 +14,50 @@ export const defaultRadarChartProps = {
|
|
|
14
14
|
endAngle: -270,
|
|
15
15
|
} as const satisfies Partial<PolarChartProps<never>>;
|
|
16
16
|
|
|
17
|
-
type RadarChartProps<DataPointType> =
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
17
|
+
type RadarChartProps<DataPointType> = Omit<
|
|
18
|
+
PolarChartProps<DataPointType>,
|
|
19
|
+
'layout' | 'startAngle' | 'endAngle'
|
|
20
|
+
> & {
|
|
21
|
+
/**
|
|
22
|
+
* The layout of chart defines the orientation of axes, graphical items, and tooltip.
|
|
23
|
+
*
|
|
24
|
+
* @defaultValue centric
|
|
25
|
+
*/
|
|
26
|
+
layout?: PolarLayout;
|
|
27
|
+
/**
|
|
28
|
+
* Angle in degrees from which the chart should start.
|
|
29
|
+
* @defaultValue 90
|
|
30
|
+
*
|
|
31
|
+
*/
|
|
32
|
+
startAngle?: number;
|
|
33
|
+
/**
|
|
34
|
+
* Angle, in degrees, at which the chart should end.
|
|
35
|
+
*
|
|
36
|
+
* @defaultValue -270
|
|
37
|
+
*/
|
|
38
|
+
endAngle?: number;
|
|
39
|
+
};
|
|
38
40
|
|
|
39
41
|
/**
|
|
40
42
|
* @consumes ResponsiveContainerContext
|
|
41
43
|
* @provides PolarViewBoxContext
|
|
42
44
|
* @provides PolarChartContext
|
|
43
45
|
*/
|
|
44
|
-
export function RadarChart<DataPointType = unknown>(
|
|
45
|
-
|
|
46
|
-
|
|
46
|
+
export function RadarChart<DataPointType = unknown>(
|
|
47
|
+
props: RadarChartProps<DataPointType> & {
|
|
48
|
+
ref?: Ref<SVGSVGElement>;
|
|
49
|
+
},
|
|
50
|
+
) {
|
|
47
51
|
const { ref, ...rest } = props;
|
|
48
52
|
const propsWithDefaults = resolveDefaultProps(rest, defaultRadarChartProps);
|
|
49
|
-
return
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
53
|
+
return (
|
|
54
|
+
<PolarChart
|
|
55
|
+
chartName="RadarChart"
|
|
56
|
+
defaultTooltipEventType="axis"
|
|
57
|
+
validateTooltipEventTypes={allowedTooltipTypes}
|
|
58
|
+
tooltipPayloadSearcher={arrayTooltipSearcher}
|
|
59
|
+
categoricalChartProps={propsWithDefaults}
|
|
60
|
+
ref={ref}
|
|
61
|
+
/>
|
|
62
|
+
);
|
|
57
63
|
}
|
|
@@ -19,17 +19,21 @@ export const defaultRadialBarChartProps = {
|
|
|
19
19
|
* @provides PolarViewBoxContext
|
|
20
20
|
* @provides PolarChartContext
|
|
21
21
|
*/
|
|
22
|
-
export function RadialBarChart<DataPointType = unknown>(
|
|
23
|
-
|
|
24
|
-
|
|
22
|
+
export function RadialBarChart<DataPointType = unknown>(
|
|
23
|
+
props: PolarChartProps<DataPointType> & {
|
|
24
|
+
ref?: Ref<SVGSVGElement>;
|
|
25
|
+
},
|
|
26
|
+
) {
|
|
25
27
|
const { ref, ...rest } = props;
|
|
26
28
|
const propsWithDefaults = resolveDefaultProps(rest, defaultRadialBarChartProps);
|
|
27
|
-
return
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
29
|
+
return (
|
|
30
|
+
<PolarChart
|
|
31
|
+
chartName="RadialBarChart"
|
|
32
|
+
defaultTooltipEventType="axis"
|
|
33
|
+
validateTooltipEventTypes={allowedTooltipTypes}
|
|
34
|
+
tooltipPayloadSearcher={arrayTooltipSearcher}
|
|
35
|
+
categoricalChartProps={propsWithDefaults}
|
|
36
|
+
ref={ref}
|
|
37
|
+
/>
|
|
38
|
+
);
|
|
35
39
|
}
|