@automattic/charts 0.57.0 → 0.59.0
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/CHANGELOG.md +36 -2
- package/README.md +7 -54
- package/dist/index.cjs +9607 -21
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +32 -49
- package/dist/index.css.map +1 -1
- package/dist/index.d.cts +1612 -33
- package/dist/index.d.ts +1612 -33
- package/dist/index.js +9640 -54
- package/dist/index.js.map +1 -1
- package/package.json +9 -126
- package/src/charts/bar-chart/bar-chart.module.scss +0 -5
- package/src/charts/bar-chart/bar-chart.tsx +142 -149
- package/src/charts/bar-chart/test/bar-chart.test.tsx +48 -31
- package/src/charts/leaderboard-chart/leaderboard-chart.tsx +54 -74
- package/src/charts/leaderboard-chart/test/leaderboard-chart.test.tsx +4 -5
- package/src/charts/leaderboard-chart/types.ts +1 -11
- package/src/charts/line-chart/line-chart.module.scss +0 -5
- package/src/charts/line-chart/line-chart.tsx +202 -193
- package/src/charts/line-chart/private/line-chart-annotations-overlay.tsx +1 -2
- package/src/charts/line-chart/test/line-chart.test.tsx +49 -27
- package/src/charts/line-chart/types.ts +0 -1
- package/src/charts/pie-chart/pie-chart.module.scss +2 -10
- package/src/charts/pie-chart/pie-chart.tsx +212 -212
- package/src/charts/pie-chart/test/composition-api.test.tsx +44 -3
- package/src/charts/pie-chart/test/pie-chart.test.tsx +51 -44
- package/src/charts/pie-semi-circle-chart/pie-semi-circle-chart.module.scss +2 -8
- package/src/charts/pie-semi-circle-chart/pie-semi-circle-chart.tsx +166 -168
- package/src/charts/pie-semi-circle-chart/test/pie-semi-circle-chart.test.tsx +58 -30
- package/src/charts/private/chart-composition/index.ts +2 -0
- package/src/charts/private/chart-composition/render-legend-slot.ts +22 -0
- package/src/charts/private/chart-composition/test/render-legend-slot.test.tsx +60 -0
- package/src/charts/private/chart-composition/test/use-chart-children.test.tsx +91 -0
- package/src/charts/private/chart-composition/use-chart-children.ts +34 -2
- package/src/charts/private/chart-layout/chart-layout.module.scss +7 -0
- package/src/charts/private/chart-layout/chart-layout.tsx +106 -0
- package/src/charts/private/chart-layout/index.ts +2 -0
- package/src/charts/private/chart-layout/test/chart-layout.test.tsx +167 -0
- package/src/charts/private/single-chart-context/single-chart-context.tsx +2 -2
- package/src/charts/private/svg-empty-state/index.ts +1 -0
- package/src/charts/private/svg-empty-state/svg-empty-state.module.scss +7 -0
- package/src/charts/private/svg-empty-state/svg-empty-state.tsx +40 -0
- package/src/components/legend/hooks/test/use-chart-legend-items.test.tsx +12 -8
- package/src/components/legend/hooks/use-chart-legend-items.ts +12 -13
- package/src/components/legend/index.ts +1 -8
- package/src/components/legend/legend.tsx +33 -8
- package/src/components/legend/private/base-legend.module.scss +19 -37
- package/src/components/legend/private/base-legend.tsx +0 -2
- package/src/components/legend/test/legend.test.tsx +93 -1
- package/src/components/legend/types.ts +7 -34
- package/src/hooks/index.ts +1 -1
- package/src/hooks/use-data-with-percentages.ts +24 -0
- package/src/hooks/use-interactive-legend-data.ts +18 -15
- package/src/index.ts +66 -9
- package/src/providers/chart-context/global-charts-provider.tsx +7 -1
- package/src/providers/chart-context/hooks/use-chart-registration.ts +2 -1
- package/src/providers/chart-context/types.ts +2 -2
- package/src/types.ts +110 -45
- package/src/utils/date-parsing.ts +10 -1
- package/src/utils/test/date-parsing.test.ts +12 -0
- package/src/utils/test/resolve-css-var.test.ts +4 -2
- package/tsup.config.ts +1 -1
- package/dist/base-tooltip-DOq93wjU.d.cts +0 -38
- package/dist/base-tooltip-DOq93wjU.d.ts +0 -38
- package/dist/charts/bar-chart/index.cjs +0 -15
- package/dist/charts/bar-chart/index.cjs.map +0 -1
- package/dist/charts/bar-chart/index.css +0 -153
- package/dist/charts/bar-chart/index.css.map +0 -1
- package/dist/charts/bar-chart/index.d.cts +0 -37
- package/dist/charts/bar-chart/index.d.ts +0 -37
- package/dist/charts/bar-chart/index.js +0 -15
- package/dist/charts/bar-chart/index.js.map +0 -1
- package/dist/charts/bar-list-chart/index.cjs +0 -16
- package/dist/charts/bar-list-chart/index.cjs.map +0 -1
- package/dist/charts/bar-list-chart/index.css +0 -153
- package/dist/charts/bar-list-chart/index.css.map +0 -1
- package/dist/charts/bar-list-chart/index.d.cts +0 -92
- package/dist/charts/bar-list-chart/index.d.ts +0 -92
- package/dist/charts/bar-list-chart/index.js +0 -16
- package/dist/charts/bar-list-chart/index.js.map +0 -1
- package/dist/charts/conversion-funnel-chart/index.cjs +0 -11
- package/dist/charts/conversion-funnel-chart/index.cjs.map +0 -1
- package/dist/charts/conversion-funnel-chart/index.css +0 -251
- package/dist/charts/conversion-funnel-chart/index.css.map +0 -1
- package/dist/charts/conversion-funnel-chart/index.d.cts +0 -97
- package/dist/charts/conversion-funnel-chart/index.d.ts +0 -97
- package/dist/charts/conversion-funnel-chart/index.js +0 -11
- package/dist/charts/conversion-funnel-chart/index.js.map +0 -1
- package/dist/charts/geo-chart/index.cjs +0 -13
- package/dist/charts/geo-chart/index.cjs.map +0 -1
- package/dist/charts/geo-chart/index.css +0 -117
- package/dist/charts/geo-chart/index.css.map +0 -1
- package/dist/charts/geo-chart/index.d.cts +0 -67
- package/dist/charts/geo-chart/index.d.ts +0 -67
- package/dist/charts/geo-chart/index.js +0 -13
- package/dist/charts/geo-chart/index.js.map +0 -1
- package/dist/charts/leaderboard-chart/index.cjs +0 -20
- package/dist/charts/leaderboard-chart/index.cjs.map +0 -1
- package/dist/charts/leaderboard-chart/index.css +0 -172
- package/dist/charts/leaderboard-chart/index.css.map +0 -1
- package/dist/charts/leaderboard-chart/index.d.cts +0 -46
- package/dist/charts/leaderboard-chart/index.d.ts +0 -46
- package/dist/charts/leaderboard-chart/index.js +0 -20
- package/dist/charts/leaderboard-chart/index.js.map +0 -1
- package/dist/charts/line-chart/index.cjs +0 -15
- package/dist/charts/line-chart/index.cjs.map +0 -1
- package/dist/charts/line-chart/index.css +0 -225
- package/dist/charts/line-chart/index.css.map +0 -1
- package/dist/charts/line-chart/index.d.cts +0 -99
- package/dist/charts/line-chart/index.d.ts +0 -99
- package/dist/charts/line-chart/index.js +0 -15
- package/dist/charts/line-chart/index.js.map +0 -1
- package/dist/charts/pie-chart/index.cjs +0 -18
- package/dist/charts/pie-chart/index.cjs.map +0 -1
- package/dist/charts/pie-chart/index.css +0 -143
- package/dist/charts/pie-chart/index.css.map +0 -1
- package/dist/charts/pie-chart/index.d.cts +0 -97
- package/dist/charts/pie-chart/index.d.ts +0 -97
- package/dist/charts/pie-chart/index.js +0 -18
- package/dist/charts/pie-chart/index.js.map +0 -1
- package/dist/charts/pie-semi-circle-chart/index.cjs +0 -17
- package/dist/charts/pie-semi-circle-chart/index.cjs.map +0 -1
- package/dist/charts/pie-semi-circle-chart/index.css +0 -144
- package/dist/charts/pie-semi-circle-chart/index.css.map +0 -1
- package/dist/charts/pie-semi-circle-chart/index.d.cts +0 -94
- package/dist/charts/pie-semi-circle-chart/index.d.ts +0 -94
- package/dist/charts/pie-semi-circle-chart/index.js +0 -17
- package/dist/charts/pie-semi-circle-chart/index.js.map +0 -1
- package/dist/charts/sparkline/index.cjs +0 -16
- package/dist/charts/sparkline/index.cjs.map +0 -1
- package/dist/charts/sparkline/index.css +0 -242
- package/dist/charts/sparkline/index.css.map +0 -1
- package/dist/charts/sparkline/index.d.cts +0 -113
- package/dist/charts/sparkline/index.d.ts +0 -113
- package/dist/charts/sparkline/index.js +0 -16
- package/dist/charts/sparkline/index.js.map +0 -1
- package/dist/chunk-2A34OA5O.cjs +0 -51
- package/dist/chunk-2A34OA5O.cjs.map +0 -1
- package/dist/chunk-2NCY7R4G.js +0 -3897
- package/dist/chunk-2NCY7R4G.js.map +0 -1
- package/dist/chunk-32DH6JDF.js +0 -1263
- package/dist/chunk-32DH6JDF.js.map +0 -1
- package/dist/chunk-4OPFE4RM.js +0 -614
- package/dist/chunk-4OPFE4RM.js.map +0 -1
- package/dist/chunk-6CCZL2JJ.js +0 -63
- package/dist/chunk-6CCZL2JJ.js.map +0 -1
- package/dist/chunk-77OKCVQN.cjs +0 -421
- package/dist/chunk-77OKCVQN.cjs.map +0 -1
- package/dist/chunk-7FQX4ALL.cjs +0 -219
- package/dist/chunk-7FQX4ALL.cjs.map +0 -1
- package/dist/chunk-ASLARV7L.cjs +0 -81
- package/dist/chunk-ASLARV7L.cjs.map +0 -1
- package/dist/chunk-BCX5THDQ.js +0 -403
- package/dist/chunk-BCX5THDQ.js.map +0 -1
- package/dist/chunk-BPYKWMI7.js +0 -194
- package/dist/chunk-BPYKWMI7.js.map +0 -1
- package/dist/chunk-CZGYJKG6.js +0 -421
- package/dist/chunk-CZGYJKG6.js.map +0 -1
- package/dist/chunk-D2UH4CFE.cjs +0 -120
- package/dist/chunk-D2UH4CFE.cjs.map +0 -1
- package/dist/chunk-DAU3HNEG.js +0 -344
- package/dist/chunk-DAU3HNEG.js.map +0 -1
- package/dist/chunk-H2V4JMSA.js +0 -219
- package/dist/chunk-H2V4JMSA.js.map +0 -1
- package/dist/chunk-I2276W3I.cjs +0 -66
- package/dist/chunk-I2276W3I.cjs.map +0 -1
- package/dist/chunk-I35UYJJR.cjs +0 -468
- package/dist/chunk-I35UYJJR.cjs.map +0 -1
- package/dist/chunk-IU4DYUAV.js +0 -120
- package/dist/chunk-IU4DYUAV.js.map +0 -1
- package/dist/chunk-KXRWNFQJ.js +0 -51
- package/dist/chunk-KXRWNFQJ.js.map +0 -1
- package/dist/chunk-OP6PHB2U.js +0 -81
- package/dist/chunk-OP6PHB2U.js.map +0 -1
- package/dist/chunk-PXLEMUGJ.js +0 -165
- package/dist/chunk-PXLEMUGJ.js.map +0 -1
- package/dist/chunk-RCY6XLGU.cjs +0 -63
- package/dist/chunk-RCY6XLGU.cjs.map +0 -1
- package/dist/chunk-RHHVEJHJ.cjs +0 -1263
- package/dist/chunk-RHHVEJHJ.cjs.map +0 -1
- package/dist/chunk-TO3OQBXG.cjs +0 -165
- package/dist/chunk-TO3OQBXG.cjs.map +0 -1
- package/dist/chunk-V36ERY7Y.js +0 -375
- package/dist/chunk-V36ERY7Y.js.map +0 -1
- package/dist/chunk-VJM5XCB4.cjs +0 -614
- package/dist/chunk-VJM5XCB4.cjs.map +0 -1
- package/dist/chunk-VTS3PNMS.cjs +0 -344
- package/dist/chunk-VTS3PNMS.cjs.map +0 -1
- package/dist/chunk-WLODYNLB.js +0 -1067
- package/dist/chunk-WLODYNLB.js.map +0 -1
- package/dist/chunk-XKRJL2QT.cjs +0 -375
- package/dist/chunk-XKRJL2QT.cjs.map +0 -1
- package/dist/chunk-XWYZIFZW.js +0 -66
- package/dist/chunk-XWYZIFZW.js.map +0 -1
- package/dist/chunk-Y3NNQMAX.cjs +0 -194
- package/dist/chunk-Y3NNQMAX.cjs.map +0 -1
- package/dist/chunk-YE2T52VZ.cjs +0 -1067
- package/dist/chunk-YE2T52VZ.cjs.map +0 -1
- package/dist/chunk-Z26M4V2M.js +0 -468
- package/dist/chunk-Z26M4V2M.js.map +0 -1
- package/dist/chunk-Z45KX47P.cjs +0 -3897
- package/dist/chunk-Z45KX47P.cjs.map +0 -1
- package/dist/chunk-ZH4F5RMG.cjs +0 -403
- package/dist/chunk-ZH4F5RMG.cjs.map +0 -1
- package/dist/components/legend/index.cjs +0 -11
- package/dist/components/legend/index.cjs.map +0 -1
- package/dist/components/legend/index.css +0 -103
- package/dist/components/legend/index.css.map +0 -1
- package/dist/components/legend/index.d.cts +0 -37
- package/dist/components/legend/index.d.ts +0 -37
- package/dist/components/legend/index.js +0 -11
- package/dist/components/legend/index.js.map +0 -1
- package/dist/components/tooltip/index.cjs +0 -12
- package/dist/components/tooltip/index.cjs.map +0 -1
- package/dist/components/tooltip/index.css +0 -13
- package/dist/components/tooltip/index.css.map +0 -1
- package/dist/components/tooltip/index.d.cts +0 -71
- package/dist/components/tooltip/index.d.ts +0 -71
- package/dist/components/tooltip/index.js +0 -12
- package/dist/components/tooltip/index.js.map +0 -1
- package/dist/components/trend-indicator/index.cjs +0 -8
- package/dist/components/trend-indicator/index.cjs.map +0 -1
- package/dist/components/trend-indicator/index.css +0 -27
- package/dist/components/trend-indicator/index.css.map +0 -1
- package/dist/components/trend-indicator/index.d.cts +0 -44
- package/dist/components/trend-indicator/index.d.ts +0 -44
- package/dist/components/trend-indicator/index.js +0 -8
- package/dist/components/trend-indicator/index.js.map +0 -1
- package/dist/format-metric-value-MXm5DtQ_.d.cts +0 -24
- package/dist/format-metric-value-MXm5DtQ_.d.ts +0 -24
- package/dist/hooks/index.cjs +0 -31
- package/dist/hooks/index.cjs.map +0 -1
- package/dist/hooks/index.css +0 -103
- package/dist/hooks/index.css.map +0 -1
- package/dist/hooks/index.d.cts +0 -272
- package/dist/hooks/index.d.ts +0 -272
- package/dist/hooks/index.js +0 -31
- package/dist/hooks/index.js.map +0 -1
- package/dist/leaderboard-chart-BKYYXcg2.d.ts +0 -83
- package/dist/leaderboard-chart-DR7CGb0L.d.cts +0 -83
- package/dist/legend-C2grwnWk.d.cts +0 -9
- package/dist/legend-Cj0xM5dU.d.ts +0 -9
- package/dist/providers/index.cjs +0 -21
- package/dist/providers/index.cjs.map +0 -1
- package/dist/providers/index.css +0 -103
- package/dist/providers/index.css.map +0 -1
- package/dist/providers/index.d.cts +0 -28
- package/dist/providers/index.d.ts +0 -28
- package/dist/providers/index.js +0 -21
- package/dist/providers/index.js.map +0 -1
- package/dist/themes-BmVGrYnF.d.ts +0 -67
- package/dist/themes-CyjKm-P_.d.cts +0 -67
- package/dist/types-CuUEszrM.d.ts +0 -19
- package/dist/types-DZordNiO.d.cts +0 -505
- package/dist/types-DZordNiO.d.ts +0 -505
- package/dist/types-I67mddpr.d.cts +0 -78
- package/dist/types-I67mddpr.d.ts +0 -78
- package/dist/types-KtOPPzPX.d.cts +0 -19
- package/dist/utils/index.cjs +0 -44
- package/dist/utils/index.cjs.map +0 -1
- package/dist/utils/index.d.cts +0 -226
- package/dist/utils/index.d.ts +0 -226
- package/dist/utils/index.js +0 -44
- package/dist/utils/index.js.map +0 -1
- package/dist/with-responsive-CNfhzAUu.d.cts +0 -18
- package/dist/with-responsive-CNfhzAUu.d.ts +0 -18
- package/src/hooks/use-has-legend-child.ts +0 -22
package/dist/chunk-V36ERY7Y.js
DELETED
|
@@ -1,375 +0,0 @@
|
|
|
1
|
-
import {
|
|
2
|
-
radial_wipe_animation_default
|
|
3
|
-
} from "./chunk-KXRWNFQJ.js";
|
|
4
|
-
import {
|
|
5
|
-
ChartHTML,
|
|
6
|
-
ChartSVG,
|
|
7
|
-
useChartChildren
|
|
8
|
-
} from "./chunk-6CCZL2JJ.js";
|
|
9
|
-
import {
|
|
10
|
-
BaseTooltip
|
|
11
|
-
} from "./chunk-BPYKWMI7.js";
|
|
12
|
-
import {
|
|
13
|
-
Stack
|
|
14
|
-
} from "./chunk-Z26M4V2M.js";
|
|
15
|
-
import {
|
|
16
|
-
withResponsive
|
|
17
|
-
} from "./chunk-OP6PHB2U.js";
|
|
18
|
-
import {
|
|
19
|
-
GlobalChartsContext,
|
|
20
|
-
GlobalChartsProvider,
|
|
21
|
-
Legend,
|
|
22
|
-
SingleChartContext,
|
|
23
|
-
useChartId,
|
|
24
|
-
useChartLegendItems,
|
|
25
|
-
useChartRegistration,
|
|
26
|
-
useElementSize,
|
|
27
|
-
useGlobalChartsContext,
|
|
28
|
-
useInteractiveLegendData,
|
|
29
|
-
usePrefersReducedMotion
|
|
30
|
-
} from "./chunk-32DH6JDF.js";
|
|
31
|
-
import {
|
|
32
|
-
attachSubComponents
|
|
33
|
-
} from "./chunk-DAU3HNEG.js";
|
|
34
|
-
|
|
35
|
-
// src/charts/pie-semi-circle-chart/pie-semi-circle-chart.tsx
|
|
36
|
-
import { Group } from "@visx/group";
|
|
37
|
-
import { Pie } from "@visx/shape";
|
|
38
|
-
import { Text } from "@visx/text";
|
|
39
|
-
import { useTooltip, useTooltipInPortal } from "@visx/tooltip";
|
|
40
|
-
import { __ } from "@wordpress/i18n";
|
|
41
|
-
import clsx from "clsx";
|
|
42
|
-
import { useCallback, useContext, useMemo } from "react";
|
|
43
|
-
|
|
44
|
-
// src/charts/pie-semi-circle-chart/pie-semi-circle-chart.module.scss
|
|
45
|
-
var pie_semi_circle_chart_module_default = {
|
|
46
|
-
"pie-semi-circle-chart--responsive": "a8ccharts-V0wiEb",
|
|
47
|
-
"pie-semi-circle-chart__svg-wrapper": "a8ccharts-hGowej",
|
|
48
|
-
"pie-semi-circle-chart": "a8ccharts-8tyaQj",
|
|
49
|
-
"label": "a8ccharts-EKZS3j",
|
|
50
|
-
"note": "a8ccharts-v85A8-"
|
|
51
|
-
};
|
|
52
|
-
|
|
53
|
-
// src/charts/pie-semi-circle-chart/pie-semi-circle-chart.tsx
|
|
54
|
-
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
55
|
-
var renderDefaultPieSemiCircleTooltip = ({
|
|
56
|
-
tooltipData
|
|
57
|
-
}) => {
|
|
58
|
-
return /* @__PURE__ */ _jsx(BaseTooltip, {
|
|
59
|
-
data: tooltipData,
|
|
60
|
-
top: 0,
|
|
61
|
-
left: 0,
|
|
62
|
-
renderContainer: false
|
|
63
|
-
});
|
|
64
|
-
};
|
|
65
|
-
var PAD_ANGLE = 0.03;
|
|
66
|
-
var DEFAULT_WIDTH = 400;
|
|
67
|
-
var validateData = (data) => {
|
|
68
|
-
if (!data.length) {
|
|
69
|
-
return {
|
|
70
|
-
isValid: false,
|
|
71
|
-
message: "No data available"
|
|
72
|
-
};
|
|
73
|
-
}
|
|
74
|
-
const hasNegativeValues = data.some((item) => item.percentage < 0 || item.value < 0);
|
|
75
|
-
if (hasNegativeValues) {
|
|
76
|
-
return {
|
|
77
|
-
isValid: false,
|
|
78
|
-
message: "Invalid data: Negative values are not allowed"
|
|
79
|
-
};
|
|
80
|
-
}
|
|
81
|
-
const totalPercentage = data.reduce((sum, item) => sum + item.percentage, 0);
|
|
82
|
-
if (totalPercentage <= 0) {
|
|
83
|
-
return {
|
|
84
|
-
isValid: false,
|
|
85
|
-
message: "Invalid percentage total: Must be greater than 0"
|
|
86
|
-
};
|
|
87
|
-
}
|
|
88
|
-
return {
|
|
89
|
-
isValid: true,
|
|
90
|
-
message: ""
|
|
91
|
-
};
|
|
92
|
-
};
|
|
93
|
-
var PieSemiCircleChartInternal = ({
|
|
94
|
-
data,
|
|
95
|
-
chartId: providedChartId,
|
|
96
|
-
width: propWidth,
|
|
97
|
-
height: propHeight,
|
|
98
|
-
thickness = 0.4,
|
|
99
|
-
clockwise = true,
|
|
100
|
-
withTooltips = false,
|
|
101
|
-
showLegend = false,
|
|
102
|
-
legendOrientation = "horizontal",
|
|
103
|
-
legendPosition = "bottom",
|
|
104
|
-
legendAlignment = "center",
|
|
105
|
-
legendMaxWidth,
|
|
106
|
-
legendTextOverflow = "wrap",
|
|
107
|
-
legendItemClassName,
|
|
108
|
-
legendShape = "circle",
|
|
109
|
-
legendValueDisplay = "percentage",
|
|
110
|
-
legendInteractive = false,
|
|
111
|
-
label,
|
|
112
|
-
animation,
|
|
113
|
-
note,
|
|
114
|
-
className,
|
|
115
|
-
children,
|
|
116
|
-
tooltipOffsetX = 0,
|
|
117
|
-
tooltipOffsetY = -15,
|
|
118
|
-
renderTooltip = renderDefaultPieSemiCircleTooltip,
|
|
119
|
-
gap = "md"
|
|
120
|
-
}) => {
|
|
121
|
-
const chartId = useChartId(providedChartId);
|
|
122
|
-
const [svgWrapperRef, svgWrapperWidth, svgWrapperHeight] = useElementSize();
|
|
123
|
-
const {
|
|
124
|
-
tooltipOpen,
|
|
125
|
-
tooltipLeft,
|
|
126
|
-
tooltipTop,
|
|
127
|
-
tooltipData,
|
|
128
|
-
hideTooltip,
|
|
129
|
-
showTooltip
|
|
130
|
-
} = useTooltip();
|
|
131
|
-
const {
|
|
132
|
-
containerRef,
|
|
133
|
-
TooltipInPortal,
|
|
134
|
-
containerBounds
|
|
135
|
-
} = useTooltipInPortal({
|
|
136
|
-
detectBounds: true,
|
|
137
|
-
scroll: true,
|
|
138
|
-
debounce: 0
|
|
139
|
-
});
|
|
140
|
-
const handleMouseMove = useCallback((event, arc) => {
|
|
141
|
-
if (containerBounds.width === 0 || containerBounds.height === 0) {
|
|
142
|
-
return;
|
|
143
|
-
}
|
|
144
|
-
showTooltip({
|
|
145
|
-
tooltipData: arc.data,
|
|
146
|
-
tooltipLeft: event.clientX - containerBounds.left + tooltipOffsetX,
|
|
147
|
-
tooltipTop: event.clientY - containerBounds.top + tooltipOffsetY
|
|
148
|
-
});
|
|
149
|
-
}, [containerBounds.width, containerBounds.height, containerBounds.left, containerBounds.top, showTooltip, tooltipOffsetX, tooltipOffsetY]);
|
|
150
|
-
const handleMouseLeave = useCallback(() => {
|
|
151
|
-
hideTooltip();
|
|
152
|
-
}, [hideTooltip]);
|
|
153
|
-
const handleArcMouseMove = useCallback((arc) => (event) => {
|
|
154
|
-
handleMouseMove(event, arc);
|
|
155
|
-
}, [handleMouseMove]);
|
|
156
|
-
const {
|
|
157
|
-
isValid,
|
|
158
|
-
message
|
|
159
|
-
} = validateData(data);
|
|
160
|
-
const {
|
|
161
|
-
getElementStyles,
|
|
162
|
-
isSeriesVisible
|
|
163
|
-
} = useGlobalChartsContext();
|
|
164
|
-
const {
|
|
165
|
-
visibleData,
|
|
166
|
-
allSegmentsHidden,
|
|
167
|
-
legendData
|
|
168
|
-
} = useInteractiveLegendData({
|
|
169
|
-
data,
|
|
170
|
-
chartId,
|
|
171
|
-
legendInteractive,
|
|
172
|
-
isSeriesVisible
|
|
173
|
-
});
|
|
174
|
-
const accessors = useMemo(() => ({
|
|
175
|
-
value: (d) => d.value,
|
|
176
|
-
sort: (a, b) => b.value - a.value,
|
|
177
|
-
fill: (d) => getElementStyles({
|
|
178
|
-
data: d,
|
|
179
|
-
index: d.index
|
|
180
|
-
}).color
|
|
181
|
-
}), [getElementStyles]);
|
|
182
|
-
const legendOptions = useMemo(() => ({
|
|
183
|
-
showValues: true,
|
|
184
|
-
legendValueDisplay
|
|
185
|
-
}), [legendValueDisplay]);
|
|
186
|
-
const legendItems = useChartLegendItems(legendData, legendOptions);
|
|
187
|
-
const {
|
|
188
|
-
svgChildren,
|
|
189
|
-
htmlChildren,
|
|
190
|
-
otherChildren
|
|
191
|
-
} = useChartChildren(children, "PieSemiCircleChart");
|
|
192
|
-
const chartMetadata = useMemo(() => ({
|
|
193
|
-
thickness,
|
|
194
|
-
clockwise
|
|
195
|
-
}), [thickness, clockwise]);
|
|
196
|
-
useChartRegistration({
|
|
197
|
-
chartId,
|
|
198
|
-
legendItems,
|
|
199
|
-
chartType: "pie-semi-circle",
|
|
200
|
-
isDataValid: isValid,
|
|
201
|
-
metadata: chartMetadata
|
|
202
|
-
});
|
|
203
|
-
const prefersReducedMotion = usePrefersReducedMotion();
|
|
204
|
-
const effectiveWidth = propWidth || DEFAULT_WIDTH;
|
|
205
|
-
if (!isValid) {
|
|
206
|
-
const errorWidth = propHeight ? Math.min(propWidth || propHeight * 2, propHeight * 2) : effectiveWidth;
|
|
207
|
-
const errorHeight = errorWidth / 2;
|
|
208
|
-
return /* @__PURE__ */ _jsx("div", {
|
|
209
|
-
className: pie_semi_circle_chart_module_default["pie-semi-circle-chart"],
|
|
210
|
-
children: /* @__PURE__ */ _jsx("svg", {
|
|
211
|
-
width: errorWidth,
|
|
212
|
-
height: errorHeight,
|
|
213
|
-
children: /* @__PURE__ */ _jsx("text", {
|
|
214
|
-
x: "50%",
|
|
215
|
-
y: "50%",
|
|
216
|
-
textAnchor: "middle",
|
|
217
|
-
className: pie_semi_circle_chart_module_default.error,
|
|
218
|
-
children: message
|
|
219
|
-
})
|
|
220
|
-
})
|
|
221
|
-
});
|
|
222
|
-
}
|
|
223
|
-
const availableWidth = svgWrapperWidth > 0 ? svgWrapperWidth : effectiveWidth;
|
|
224
|
-
const availableHeight = svgWrapperHeight > 0 ? svgWrapperHeight : propHeight || effectiveWidth / 2;
|
|
225
|
-
const width = Math.min(availableWidth, availableHeight * 2);
|
|
226
|
-
const height = width / 2;
|
|
227
|
-
const radius = height;
|
|
228
|
-
const innerRadius = radius * (1 - thickness);
|
|
229
|
-
const dataWithIndex = visibleData.map((d) => {
|
|
230
|
-
const originalIndex = data.findIndex((item) => item.label === d.label);
|
|
231
|
-
return {
|
|
232
|
-
...d,
|
|
233
|
-
index: originalIndex >= 0 ? originalIndex : 0
|
|
234
|
-
};
|
|
235
|
-
});
|
|
236
|
-
const startAngle = clockwise ? -Math.PI / 2 : Math.PI / 2;
|
|
237
|
-
const endAngle = clockwise ? Math.PI / 2 : -Math.PI / 2;
|
|
238
|
-
const legendElement = showLegend && /* @__PURE__ */ _jsx(Legend, {
|
|
239
|
-
orientation: legendOrientation,
|
|
240
|
-
position: legendPosition,
|
|
241
|
-
alignment: legendAlignment,
|
|
242
|
-
labelStyles: {
|
|
243
|
-
maxWidth: legendMaxWidth,
|
|
244
|
-
textOverflow: legendTextOverflow
|
|
245
|
-
},
|
|
246
|
-
itemClassName: legendItemClassName,
|
|
247
|
-
shape: legendShape,
|
|
248
|
-
chartId,
|
|
249
|
-
interactive: legendInteractive
|
|
250
|
-
});
|
|
251
|
-
return /* @__PURE__ */ _jsx(SingleChartContext.Provider, {
|
|
252
|
-
value: {
|
|
253
|
-
chartId,
|
|
254
|
-
chartWidth: width,
|
|
255
|
-
chartHeight: height
|
|
256
|
-
},
|
|
257
|
-
children: /* @__PURE__ */ _jsxs(Stack, {
|
|
258
|
-
ref: containerRef,
|
|
259
|
-
direction: "column",
|
|
260
|
-
gap,
|
|
261
|
-
className: clsx("pie-semi-circle-chart", pie_semi_circle_chart_module_default["pie-semi-circle-chart"], {
|
|
262
|
-
[pie_semi_circle_chart_module_default["pie-semi-circle-chart--responsive"]]: !propWidth && !propHeight
|
|
263
|
-
}, className),
|
|
264
|
-
style: {
|
|
265
|
-
width: propWidth || void 0,
|
|
266
|
-
height: propHeight || void 0
|
|
267
|
-
},
|
|
268
|
-
children: [legendPosition === "top" && legendElement, /* @__PURE__ */ _jsx("div", {
|
|
269
|
-
ref: svgWrapperRef,
|
|
270
|
-
className: pie_semi_circle_chart_module_default["pie-semi-circle-chart__svg-wrapper"],
|
|
271
|
-
children: /* @__PURE__ */ _jsxs("svg", {
|
|
272
|
-
width,
|
|
273
|
-
height,
|
|
274
|
-
viewBox: `0 0 ${width} ${height}`,
|
|
275
|
-
children: [/* @__PURE__ */ _jsx("defs", {
|
|
276
|
-
children: /* @__PURE__ */ _jsx(radial_wipe_animation_default, {
|
|
277
|
-
id: `radial-wipe-${chartId}`,
|
|
278
|
-
radius,
|
|
279
|
-
innerRadius,
|
|
280
|
-
startAngle: "-180deg",
|
|
281
|
-
wipePercentage: 50
|
|
282
|
-
})
|
|
283
|
-
}), /* @__PURE__ */ _jsx(Group, {
|
|
284
|
-
top: height,
|
|
285
|
-
left: width / 2,
|
|
286
|
-
mask: animation && !prefersReducedMotion ? `url(#radial-wipe-${chartId})` : null,
|
|
287
|
-
children: allSegmentsHidden ? /* @__PURE__ */ _jsx("text", {
|
|
288
|
-
textAnchor: "middle",
|
|
289
|
-
y: -radius / 2,
|
|
290
|
-
fill: "#ccc",
|
|
291
|
-
fontSize: "14",
|
|
292
|
-
fontFamily: "-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif",
|
|
293
|
-
children: __("All segments are hidden. Click legend items to show data.", "jetpack-charts")
|
|
294
|
-
}) : /* @__PURE__ */ _jsxs(_Fragment, {
|
|
295
|
-
children: [/* @__PURE__ */ _jsx(Pie, {
|
|
296
|
-
data: dataWithIndex,
|
|
297
|
-
pieValue: accessors.value,
|
|
298
|
-
outerRadius: radius,
|
|
299
|
-
innerRadius,
|
|
300
|
-
cornerRadius: 3,
|
|
301
|
-
padAngle: PAD_ANGLE,
|
|
302
|
-
startAngle,
|
|
303
|
-
endAngle,
|
|
304
|
-
pieSort: accessors.sort,
|
|
305
|
-
children: (pie) => {
|
|
306
|
-
return pie.arcs.map((arc) => /* @__PURE__ */ _jsx("g", {
|
|
307
|
-
onMouseMove: withTooltips ? handleArcMouseMove(arc) : void 0,
|
|
308
|
-
onMouseLeave: withTooltips ? handleMouseLeave : void 0,
|
|
309
|
-
children: /* @__PURE__ */ _jsx("path", {
|
|
310
|
-
d: pie.path(arc) || "",
|
|
311
|
-
fill: accessors.fill(arc.data)
|
|
312
|
-
})
|
|
313
|
-
}, arc.data.label));
|
|
314
|
-
}
|
|
315
|
-
}), /* @__PURE__ */ _jsxs(Group, {
|
|
316
|
-
children: [/* @__PURE__ */ _jsx(Text, {
|
|
317
|
-
textAnchor: "middle",
|
|
318
|
-
verticalAnchor: "start",
|
|
319
|
-
y: -40,
|
|
320
|
-
className: pie_semi_circle_chart_module_default.label,
|
|
321
|
-
children: label
|
|
322
|
-
}), /* @__PURE__ */ _jsx(Text, {
|
|
323
|
-
textAnchor: "middle",
|
|
324
|
-
verticalAnchor: "start",
|
|
325
|
-
y: -20,
|
|
326
|
-
className: pie_semi_circle_chart_module_default.note,
|
|
327
|
-
children: note
|
|
328
|
-
})]
|
|
329
|
-
}), !allSegmentsHidden && svgChildren]
|
|
330
|
-
})
|
|
331
|
-
})]
|
|
332
|
-
})
|
|
333
|
-
}), legendPosition !== "top" && legendElement, withTooltips && tooltipOpen && tooltipData && /* @__PURE__ */ _jsx(TooltipInPortal, {
|
|
334
|
-
top: tooltipTop || 0,
|
|
335
|
-
left: tooltipLeft || 0,
|
|
336
|
-
children: /* @__PURE__ */ _jsx("div", {
|
|
337
|
-
role: "tooltip",
|
|
338
|
-
children: renderTooltip({
|
|
339
|
-
tooltipData
|
|
340
|
-
})
|
|
341
|
-
})
|
|
342
|
-
}), htmlChildren, otherChildren]
|
|
343
|
-
})
|
|
344
|
-
});
|
|
345
|
-
};
|
|
346
|
-
var PieSemiCircleChartWithProvider = (props) => {
|
|
347
|
-
const existingContext = useContext(GlobalChartsContext);
|
|
348
|
-
if (existingContext) {
|
|
349
|
-
return /* @__PURE__ */ _jsx(PieSemiCircleChartInternal, {
|
|
350
|
-
...props
|
|
351
|
-
});
|
|
352
|
-
}
|
|
353
|
-
return /* @__PURE__ */ _jsx(GlobalChartsProvider, {
|
|
354
|
-
children: /* @__PURE__ */ _jsx(PieSemiCircleChartInternal, {
|
|
355
|
-
...props
|
|
356
|
-
})
|
|
357
|
-
});
|
|
358
|
-
};
|
|
359
|
-
PieSemiCircleChartWithProvider.displayName = "PieSemiCircleChart";
|
|
360
|
-
var PieSemiCircleChart = attachSubComponents(PieSemiCircleChartWithProvider, {
|
|
361
|
-
Legend,
|
|
362
|
-
SVG: ChartSVG,
|
|
363
|
-
HTML: ChartHTML
|
|
364
|
-
});
|
|
365
|
-
var PieSemiCircleChartResponsive = attachSubComponents(withResponsive(PieSemiCircleChartWithProvider), {
|
|
366
|
-
Legend,
|
|
367
|
-
SVG: ChartSVG,
|
|
368
|
-
HTML: ChartHTML
|
|
369
|
-
});
|
|
370
|
-
|
|
371
|
-
export {
|
|
372
|
-
PieSemiCircleChart,
|
|
373
|
-
PieSemiCircleChartResponsive
|
|
374
|
-
};
|
|
375
|
-
//# sourceMappingURL=chunk-V36ERY7Y.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/charts/pie-semi-circle-chart/pie-semi-circle-chart.tsx","../src/charts/pie-semi-circle-chart/pie-semi-circle-chart.module.scss"],"sourcesContent":["import { Group } from '@visx/group';\nimport { Pie } from '@visx/shape';\nimport { Text } from '@visx/text';\nimport { useTooltip, useTooltipInPortal } from '@visx/tooltip';\nimport { __ } from '@wordpress/i18n';\nimport { Stack } from '@wordpress/ui';\nimport clsx from 'clsx';\nimport { useCallback, useContext, useMemo } from 'react';\nimport { Legend, useChartLegendItems } from '../../components/legend';\nimport { BaseTooltip } from '../../components/tooltip';\nimport { useElementSize, useInteractiveLegendData, usePrefersReducedMotion } from '../../hooks';\nimport { GlobalChartsProvider, useChartId, useChartRegistration, useGlobalChartsContext, GlobalChartsContext } from '../../providers';\nimport { attachSubComponents } from '../../utils';\nimport { ChartSVG, ChartHTML, useChartChildren } from '../private/chart-composition';\nimport { RadialWipeAnimation } from '../private/radial-wipe-animation';\nimport { SingleChartContext } from '../private/single-chart-context';\nimport { withResponsive } from '../private/with-responsive';\nimport styles from './pie-semi-circle-chart.module.scss';\n\n/**\n * Parameters passed to the renderTooltip function for semi-circle charts.\n */\nimport { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from \"react/jsx-runtime\";\n/**\n * Default tooltip renderer for semi-circle pie charts.\n * Renders a BaseTooltip with the hovered segment's data.\n *\n * @param {PieSemiCircleChartRenderTooltipParams} params - The tooltip parameters containing the hovered data point\n * @return {ReactNode} The rendered tooltip content\n */\nconst renderDefaultPieSemiCircleTooltip = ({\n tooltipData\n}) => {\n return /*#__PURE__*/_jsx(BaseTooltip, {\n data: tooltipData,\n top: 0,\n left: 0,\n renderContainer: false\n });\n};\nconst PAD_ANGLE = 0.03; // Padding between segments\nconst DEFAULT_WIDTH = 400;\n\n// Base props type with optional responsive properties\n\n// Composition API types\n\n/**\n * Validates the semi-circle pie chart data\n * @param data - The data to validate\n * @return Object containing validation result and error message\n */\nconst validateData = data => {\n if (!data.length) {\n return {\n isValid: false,\n message: 'No data available'\n };\n }\n\n // Check for negative values\n const hasNegativeValues = data.some(item => item.percentage < 0 || item.value < 0);\n if (hasNegativeValues) {\n return {\n isValid: false,\n message: 'Invalid data: Negative values are not allowed'\n };\n }\n\n // Validate total percentage is greater than 0\n const totalPercentage = data.reduce((sum, item) => sum + item.percentage, 0);\n if (totalPercentage <= 0) {\n return {\n isValid: false,\n message: 'Invalid percentage total: Must be greater than 0'\n };\n }\n return {\n isValid: true,\n message: ''\n };\n};\nconst PieSemiCircleChartInternal = ({\n data,\n chartId: providedChartId,\n width: propWidth,\n height: propHeight,\n thickness = 0.4,\n clockwise = true,\n withTooltips = false,\n showLegend = false,\n legendOrientation = 'horizontal',\n legendPosition = 'bottom',\n legendAlignment = 'center',\n legendMaxWidth,\n legendTextOverflow = 'wrap',\n legendItemClassName,\n legendShape = 'circle',\n legendValueDisplay = 'percentage',\n legendInteractive = false,\n label,\n animation,\n note,\n className,\n children,\n tooltipOffsetX = 0,\n tooltipOffsetY = -15,\n renderTooltip = renderDefaultPieSemiCircleTooltip,\n gap = 'md'\n}) => {\n const chartId = useChartId(providedChartId);\n // Measure the SVG wrapper to calculate constrained dimensions\n const [svgWrapperRef, svgWrapperWidth, svgWrapperHeight] = useElementSize();\n const {\n tooltipOpen,\n tooltipLeft,\n tooltipTop,\n tooltipData,\n hideTooltip,\n showTooltip\n } = useTooltip();\n\n // Set up portal tooltip for better z-index handling\n // We get containerBounds to cancel out stale offsets in the position calculation\n const {\n containerRef,\n TooltipInPortal,\n containerBounds\n } = useTooltipInPortal({\n detectBounds: true,\n scroll: true,\n debounce: 0\n });\n const handleMouseMove = useCallback((event, arc) => {\n // Don't show tooltip until container bounds are measured\n if (containerBounds.width === 0 || containerBounds.height === 0) {\n return;\n }\n\n // Use clientX/Y and subtract containerBounds to cancel out any stale offset.\n // TooltipInPortal calculates: tooltipLeft + containerBounds.left + scrollX\n // By passing (clientX - containerBounds.left), we get:\n // (clientX - containerBounds.left) + containerBounds.left + scrollX = clientX + scrollX\n // This gives correct page coordinates regardless of stale bounds.\n showTooltip({\n tooltipData: arc.data,\n tooltipLeft: event.clientX - containerBounds.left + tooltipOffsetX,\n tooltipTop: event.clientY - containerBounds.top + tooltipOffsetY\n });\n }, [containerBounds.width, containerBounds.height, containerBounds.left, containerBounds.top, showTooltip, tooltipOffsetX, tooltipOffsetY]);\n const handleMouseLeave = useCallback(() => {\n hideTooltip();\n }, [hideTooltip]);\n const handleArcMouseMove = useCallback(arc => event => {\n handleMouseMove(event, arc);\n }, [handleMouseMove]);\n\n // Validate data first to get validation result\n const {\n isValid,\n message\n } = validateData(data);\n const {\n getElementStyles,\n isSeriesVisible\n } = useGlobalChartsContext();\n\n // Filter and recalculate data for interactive legends\n const {\n visibleData,\n allSegmentsHidden,\n legendData\n } = useInteractiveLegendData({\n data,\n chartId,\n legendInteractive,\n isSeriesVisible\n });\n\n // Define accessors with useMemo to avoid changing dependencies\n const accessors = useMemo(() => ({\n value: d => d.value,\n sort: (a, b) => b.value - a.value,\n fill: d => getElementStyles({\n data: d,\n index: d.index\n }).color\n }), [getElementStyles]);\n\n // Memoize legend options to prevent unnecessary re-calculations\n const legendOptions = useMemo(() => ({\n showValues: true,\n legendValueDisplay\n }), [legendValueDisplay]);\n\n // Create legend items using legendData (has recalculated percentages for visible items)\n const legendItems = useChartLegendItems(legendData, legendOptions);\n\n // Process children to extract compound components\n const {\n svgChildren,\n htmlChildren,\n otherChildren\n } = useChartChildren(children, 'PieSemiCircleChart');\n\n // Memoize metadata to prevent unnecessary re-registration\n const chartMetadata = useMemo(() => ({\n thickness,\n clockwise\n }), [thickness, clockwise]);\n\n // Register chart with context only if data is valid\n useChartRegistration({\n chartId,\n legendItems,\n chartType: 'pie-semi-circle',\n isDataValid: isValid,\n metadata: chartMetadata\n });\n const prefersReducedMotion = usePrefersReducedMotion();\n const effectiveWidth = propWidth || DEFAULT_WIDTH;\n if (!isValid) {\n const errorWidth = propHeight ? Math.min(propWidth || propHeight * 2, propHeight * 2) : effectiveWidth;\n const errorHeight = errorWidth / 2;\n return /*#__PURE__*/_jsx(\"div\", {\n className: styles['pie-semi-circle-chart'],\n children: /*#__PURE__*/_jsx(\"svg\", {\n width: errorWidth,\n height: errorHeight,\n children: /*#__PURE__*/_jsx(\"text\", {\n x: \"50%\",\n y: \"50%\",\n textAnchor: \"middle\",\n className: styles.error,\n children: message\n })\n })\n });\n }\n\n // Calculate chart dimensions maintaining the 2:1 width-to-height ratio.\n // Use measured SVG wrapper dimensions to respect height constraints, falling back\n // to explicit props during initial render before measurement is available.\n const availableWidth = svgWrapperWidth > 0 ? svgWrapperWidth : effectiveWidth;\n const availableHeight = svgWrapperHeight > 0 ? svgWrapperHeight : propHeight || effectiveWidth / 2;\n // Constrain width so that height (= width / 2) never exceeds the available height\n const width = Math.min(availableWidth, availableHeight * 2);\n const height = width / 2;\n const radius = height; // For a semi-circle, radius equals the SVG height\n const innerRadius = radius * (1 - thickness);\n\n // Map data with index for color assignment\n // When interactive, we need to find the original index to maintain consistent colors\n const dataWithIndex = visibleData.map(d => {\n const originalIndex = data.findIndex(item => item.label === d.label);\n return {\n ...d,\n index: originalIndex >= 0 ? originalIndex : 0\n };\n });\n\n // Configure pie angles based on clockwise direction\n const startAngle = clockwise ? -Math.PI / 2 : Math.PI / 2;\n const endAngle = clockwise ? Math.PI / 2 : -Math.PI / 2;\n const legendElement = showLegend && /*#__PURE__*/_jsx(Legend, {\n orientation: legendOrientation,\n position: legendPosition,\n alignment: legendAlignment,\n labelStyles: {\n maxWidth: legendMaxWidth,\n textOverflow: legendTextOverflow\n },\n itemClassName: legendItemClassName,\n shape: legendShape,\n chartId: chartId,\n interactive: legendInteractive\n });\n return /*#__PURE__*/_jsx(SingleChartContext.Provider, {\n value: {\n chartId,\n chartWidth: width,\n chartHeight: height\n },\n children: /*#__PURE__*/_jsxs(Stack, {\n ref: containerRef,\n direction: \"column\",\n gap: gap,\n className: clsx('pie-semi-circle-chart', styles['pie-semi-circle-chart'], {\n [styles['pie-semi-circle-chart--responsive']]: !propWidth && !propHeight\n }, className),\n style: {\n width: propWidth || undefined,\n height: propHeight || undefined\n },\n children: [legendPosition === 'top' && legendElement, /*#__PURE__*/_jsx(\"div\", {\n ref: svgWrapperRef,\n className: styles['pie-semi-circle-chart__svg-wrapper'],\n children: /*#__PURE__*/_jsxs(\"svg\", {\n width: width,\n height: height,\n viewBox: `0 0 ${width} ${height}`,\n children: [/*#__PURE__*/_jsx(\"defs\", {\n children: /*#__PURE__*/_jsx(RadialWipeAnimation, {\n id: `radial-wipe-${chartId}`,\n radius: radius,\n innerRadius: innerRadius,\n startAngle: \"-180deg\",\n wipePercentage: 50\n })\n }), /*#__PURE__*/_jsx(Group, {\n top: height,\n left: width / 2,\n mask: animation && !prefersReducedMotion ? `url(#radial-wipe-${chartId})` : null,\n children: allSegmentsHidden ? /*#__PURE__*/_jsx(\"text\", {\n textAnchor: \"middle\",\n y: -radius / 2,\n fill: \"#ccc\",\n fontSize: \"14\",\n fontFamily: \"-apple-system,BlinkMacSystemFont,Roboto,Helvetica Neue,sans-serif\",\n children: __('All segments are hidden. Click legend items to show data.', 'jetpack-charts')\n }) : /*#__PURE__*/_jsxs(_Fragment, {\n children: [/*#__PURE__*/_jsx(Pie, {\n data: dataWithIndex,\n pieValue: accessors.value,\n outerRadius: radius,\n innerRadius: innerRadius,\n cornerRadius: 3,\n padAngle: PAD_ANGLE,\n startAngle: startAngle,\n endAngle: endAngle,\n pieSort: accessors.sort,\n children: pie => {\n return pie.arcs.map(arc => /*#__PURE__*/_jsx(\"g\", {\n onMouseMove: withTooltips ? handleArcMouseMove(arc) : undefined,\n onMouseLeave: withTooltips ? handleMouseLeave : undefined,\n children: /*#__PURE__*/_jsx(\"path\", {\n d: pie.path(arc) || '',\n fill: accessors.fill(arc.data)\n })\n }, arc.data.label));\n }\n }), /*#__PURE__*/_jsxs(Group, {\n children: [/*#__PURE__*/_jsx(Text, {\n textAnchor: \"middle\",\n verticalAnchor: \"start\",\n y: -40 // Position above the chart with space for note\n ,\n className: styles.label,\n children: label\n }), /*#__PURE__*/_jsx(Text, {\n textAnchor: \"middle\",\n verticalAnchor: \"start\",\n y: -20 // Position between label and chart\n ,\n className: styles.note,\n children: note\n })]\n }), !allSegmentsHidden && svgChildren]\n })\n })]\n })\n }), legendPosition !== 'top' && legendElement, withTooltips && tooltipOpen && tooltipData && /*#__PURE__*/_jsx(TooltipInPortal, {\n top: tooltipTop || 0,\n left: tooltipLeft || 0,\n children: /*#__PURE__*/_jsx(\"div\", {\n role: \"tooltip\",\n children: renderTooltip({\n tooltipData\n })\n })\n }), htmlChildren, otherChildren]\n })\n });\n};\nconst PieSemiCircleChartWithProvider = props => {\n const existingContext = useContext(GlobalChartsContext);\n\n // If we're already in a GlobalChartsProvider context, don't create a new one\n if (existingContext) {\n return /*#__PURE__*/_jsx(PieSemiCircleChartInternal, {\n ...props\n });\n }\n\n // Otherwise, create our own GlobalChartsProvider\n return /*#__PURE__*/_jsx(GlobalChartsProvider, {\n children: /*#__PURE__*/_jsx(PieSemiCircleChartInternal, {\n ...props\n })\n });\n};\nPieSemiCircleChartWithProvider.displayName = 'PieSemiCircleChart';\n\n// Create PieSemiCircleChart with composition API\nconst PieSemiCircleChart = attachSubComponents(PieSemiCircleChartWithProvider, {\n Legend: Legend,\n SVG: ChartSVG,\n HTML: ChartHTML\n});\n\n// Create responsive PieSemiCircleChart with composition API\nconst PieSemiCircleChartResponsive = attachSubComponents(withResponsive(PieSemiCircleChartWithProvider), {\n Legend: Legend,\n SVG: ChartSVG,\n HTML: ChartHTML\n});\nexport { PieSemiCircleChartResponsive as default, PieSemiCircleChart as PieSemiCircleChartUnresponsive };","import 'css-chunk:src/charts/pie-semi-circle-chart/pie-semi-circle-chart.module.scss';export default {\n \"pie-semi-circle-chart--responsive\": \"a8ccharts-V0wiEb\",\n \"pie-semi-circle-chart__svg-wrapper\": \"a8ccharts-hGowej\",\n \"pie-semi-circle-chart\": \"a8ccharts-8tyaQj\",\n \"label\": \"a8ccharts-EKZS3j\",\n \"note\": \"a8ccharts-v85A8-\"\n};"],"mappings":"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","names":[]}
|