@apipass/design-system 5.9.0 → 6.1.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/dist/lib/charts.index.cjs +1 -1
- package/dist/lib/charts.index.js +11 -8
- package/dist/lib/charts.index.js.map +1 -1
- package/dist/lib/embedded-styles.js +2 -2
- package/dist/lib/lib.index.cjs +1 -1
- package/dist/lib/lib.index.js +657 -657
- package/dist/lib/lib.index.js.map +1 -1
- package/dist/lib/style.css +1 -1
- package/dist/lib/ui/components/DataTable/DataTable.cjs +1 -1
- package/dist/lib/ui/components/DataTable/DataTable.cjs.map +1 -1
- package/dist/lib/ui/components/DataTable/DataTable.js +217 -3
- package/dist/lib/ui/components/DataTable/DataTable.js.map +1 -1
- package/dist/lib/ui/components/charts/BarChart/bar-chart-option.cjs +1 -1
- package/dist/lib/ui/components/charts/BarChart/bar-chart-option.cjs.map +1 -1
- package/dist/lib/ui/components/charts/BarChart/bar-chart-option.js +75 -104
- package/dist/lib/ui/components/charts/BarChart/bar-chart-option.js.map +1 -1
- package/dist/lib/ui/components/charts/ChartLegend/ChartLegend.cjs +1 -1
- package/dist/lib/ui/components/charts/ChartLegend/ChartLegend.cjs.map +1 -1
- package/dist/lib/ui/components/charts/ChartLegend/ChartLegend.js +27 -26
- package/dist/lib/ui/components/charts/ChartLegend/ChartLegend.js.map +1 -1
- package/dist/lib/ui/components/charts/PieChart/PieChart.cjs +2 -0
- package/dist/lib/ui/components/charts/PieChart/PieChart.cjs.map +1 -0
- package/dist/lib/ui/components/charts/PieChart/PieChart.js +177 -0
- package/dist/lib/ui/components/charts/PieChart/PieChart.js.map +1 -0
- package/dist/lib/ui/components/charts/PieChart/pie-chart-option.cjs +2 -0
- package/dist/lib/ui/components/charts/PieChart/pie-chart-option.cjs.map +1 -0
- package/dist/lib/ui/components/charts/PieChart/pie-chart-option.js +124 -0
- package/dist/lib/ui/components/charts/PieChart/pie-chart-option.js.map +1 -0
- package/dist/lib/ui/components/charts/PieChart/pie-chart-slices.cjs +2 -0
- package/dist/lib/ui/components/charts/PieChart/pie-chart-slices.cjs.map +1 -0
- package/dist/lib/ui/components/charts/PieChart/pie-chart-slices.js +65 -0
- package/dist/lib/ui/components/charts/PieChart/pie-chart-slices.js.map +1 -0
- package/dist/lib/ui/components/charts/chart-color-tone.cjs +2 -0
- package/dist/lib/ui/components/charts/chart-color-tone.cjs.map +1 -0
- package/dist/lib/ui/components/charts/chart-color-tone.js +14 -0
- package/dist/lib/ui/components/charts/chart-color-tone.js.map +1 -0
- package/dist/lib/ui/components/charts/chart-label-color.cjs +2 -0
- package/dist/lib/ui/components/charts/chart-label-color.cjs.map +1 -0
- package/dist/lib/ui/components/charts/chart-label-color.js +35 -0
- package/dist/lib/ui/components/charts/chart-label-color.js.map +1 -0
- package/dist/lib/ui/components/charts/chart-palette.cjs +1 -1
- package/dist/lib/ui/components/charts/chart-palette.cjs.map +1 -1
- package/dist/lib/ui/components/charts/chart-palette.js +2 -1
- package/dist/lib/ui/components/charts/chart-palette.js.map +1 -1
- package/dist/lib/ui/components/charts/chart-theme.cjs +1 -1
- package/dist/lib/ui/components/charts/chart-theme.cjs.map +1 -1
- package/dist/lib/ui/components/charts/chart-theme.js +4 -3
- package/dist/lib/ui/components/charts/chart-theme.js.map +1 -1
- package/dist/lib/ui/components/charts/echarts-modules.cjs +1 -1
- package/dist/lib/ui/components/charts/echarts-modules.cjs.map +1 -1
- package/dist/lib/ui/components/charts/echarts-modules.js +11 -9
- package/dist/lib/ui/components/charts/echarts-modules.js.map +1 -1
- package/dist/lib/ui/primitives/Table/Table.cjs +1 -1
- package/dist/lib/ui/primitives/Table/Table.cjs.map +1 -1
- package/dist/lib/ui/primitives/Table/Table.js +123 -12
- package/dist/lib/ui/primitives/Table/Table.js.map +1 -1
- package/dist/types/charts.index.d.ts +1 -0
- package/dist/types/ui/components/DataTable/DataTable.d.ts +79 -11
- package/dist/types/ui/components/charts/ChartLegend/ChartLegend.d.ts +1 -0
- package/dist/types/ui/components/charts/PieChart/PieChart.d.ts +32 -0
- package/dist/types/ui/components/charts/PieChart/pie-chart-option.d.ts +13 -0
- package/dist/types/ui/components/charts/PieChart/pie-chart-slices.d.ts +30 -0
- package/dist/types/ui/components/charts/chart-color-tone.d.ts +1 -0
- package/dist/types/ui/components/charts/chart-label-color.d.ts +2 -0
- package/dist/types/ui/components/charts/chart-palette.d.ts +1 -0
- package/dist/types/ui/components/charts/chart-theme.d.ts +1 -0
- package/dist/types/ui/primitives/Table/Table.d.ts +32 -22
- package/package.json +1 -1
- package/dist/lib/ui/primitives/Table/DataDrivenTable.cjs +0 -2
- package/dist/lib/ui/primitives/Table/DataDrivenTable.cjs.map +0 -1
- package/dist/lib/ui/primitives/Table/DataDrivenTable.js +0 -196
- package/dist/lib/ui/primitives/Table/DataDrivenTable.js.map +0 -1
- package/dist/lib/ui/primitives/Table/TableBase.cjs +0 -2
- package/dist/lib/ui/primitives/Table/TableBase.cjs.map +0 -1
- package/dist/lib/ui/primitives/Table/TableBase.js +0 -127
- package/dist/lib/ui/primitives/Table/TableBase.js.map +0 -1
- package/dist/types/ui/primitives/Table/DataDrivenTable.d.ts +0 -68
- package/dist/types/ui/primitives/Table/TableBase.d.ts +0 -35
|
@@ -0,0 +1,177 @@
|
|
|
1
|
+
import { jsxs as h, Fragment as re, jsx as a } from "react/jsx-runtime";
|
|
2
|
+
import { clsx as ne } from "../../../../vendor/clsx/dist/clsx.js";
|
|
3
|
+
import { useState as O, useMemo as k, useCallback as oe, useEffect as L, useLayoutEffect as ce } from "react";
|
|
4
|
+
import { ChartLegend as se } from "../ChartLegend/ChartLegend.js";
|
|
5
|
+
import { useChartLegend as le } from "../ChartLegend/use-chart-legend.js";
|
|
6
|
+
import { CHART_NEUTRAL_COLOR_TOKEN as ae } from "../chart-palette.js";
|
|
7
|
+
import { useChartInstance as de } from "../useChartInstance.js";
|
|
8
|
+
import { buildPieChartOption as ue, formatShare as M } from "./pie-chart-option.js";
|
|
9
|
+
import { displayNameOf as fe, buildPieSlices as he, findSlice as R, totalOf as me, findParentSlice as pe } from "./pie-chart-slices.js";
|
|
10
|
+
/* empty css */
|
|
11
|
+
const _e = {
|
|
12
|
+
others: "Others",
|
|
13
|
+
total: "Total",
|
|
14
|
+
backToPrevious: (e) => `Back from ${e}`
|
|
15
|
+
}, Se = 200, be = ["percent"], ve = [];
|
|
16
|
+
function Ne(e, r, c) {
|
|
17
|
+
if (!e || r.length === 0) return;
|
|
18
|
+
const s = r.includes("percent"), m = r.includes("value");
|
|
19
|
+
return s && m ? `${c(e.value)} (${M(e.share)})` : m ? c(e.value) : M(e.share);
|
|
20
|
+
}
|
|
21
|
+
function ge(e) {
|
|
22
|
+
const [r, c] = O(0);
|
|
23
|
+
return ce(() => {
|
|
24
|
+
if (!e) return;
|
|
25
|
+
const s = new ResizeObserver(
|
|
26
|
+
() => c(Math.min(e.clientWidth, e.clientHeight))
|
|
27
|
+
);
|
|
28
|
+
return s.observe(e), () => s.disconnect();
|
|
29
|
+
}, [e]), r;
|
|
30
|
+
}
|
|
31
|
+
function Be({
|
|
32
|
+
data: e,
|
|
33
|
+
shape: r = "donut",
|
|
34
|
+
labelContent: c = be,
|
|
35
|
+
showTotal: s = "auto",
|
|
36
|
+
total: m,
|
|
37
|
+
valueFormatter: p,
|
|
38
|
+
legend: $ = "inline",
|
|
39
|
+
legendPosition: D = "bottom",
|
|
40
|
+
legendValues: U = ve,
|
|
41
|
+
onSeriesColorChange: x,
|
|
42
|
+
onFocusChange: _,
|
|
43
|
+
legendLabels: j,
|
|
44
|
+
labels: H,
|
|
45
|
+
className: V,
|
|
46
|
+
...w
|
|
47
|
+
}) {
|
|
48
|
+
const { containerRef: z, chart: l, theme: n, resolveSeriesColor: G } = de(), o = { ..._e, ...H }, [u, K] = O(null), [W, X] = O(null), Z = ge(W), q = k(
|
|
49
|
+
() => e.map((t) => ({
|
|
50
|
+
id: t.id,
|
|
51
|
+
name: fe(t, o.others),
|
|
52
|
+
colorToken: t.colorToken ?? (t.isOthers ? ae : void 0)
|
|
53
|
+
})),
|
|
54
|
+
[e, o.others]
|
|
55
|
+
), {
|
|
56
|
+
items: J,
|
|
57
|
+
colorsBySeriesId: E,
|
|
58
|
+
colorTokensBySeriesId: Q,
|
|
59
|
+
hiddenSeriesIds: C,
|
|
60
|
+
toggleSeries: Y
|
|
61
|
+
} = le(
|
|
62
|
+
q,
|
|
63
|
+
(n == null ? void 0 : n.seriesColors) ?? [],
|
|
64
|
+
G
|
|
65
|
+
), d = k(
|
|
66
|
+
() => he({
|
|
67
|
+
nodes: e.filter((t) => !C.has(t.id)),
|
|
68
|
+
colorsByRootId: E,
|
|
69
|
+
fallbackColor: (n == null ? void 0 : n.neutralColor) ?? "#9ca3af",
|
|
70
|
+
othersName: o.others
|
|
71
|
+
}),
|
|
72
|
+
[e, C, E, n, o.others]
|
|
73
|
+
), i = k(
|
|
74
|
+
() => u === null ? void 0 : R(d, u),
|
|
75
|
+
[d, u]
|
|
76
|
+
), S = i ? i.children : d, f = oe(
|
|
77
|
+
(t) => {
|
|
78
|
+
K(t), _ == null || _(t);
|
|
79
|
+
},
|
|
80
|
+
[_]
|
|
81
|
+
);
|
|
82
|
+
L(() => {
|
|
83
|
+
u !== null && !i && f(null);
|
|
84
|
+
}, [u, i, f]), L(() => {
|
|
85
|
+
!l || !n || l.setOption(
|
|
86
|
+
ue({ slices: S, shape: r, labelContent: c, theme: n, valueFormatter: p }),
|
|
87
|
+
{ notMerge: !0 }
|
|
88
|
+
);
|
|
89
|
+
}, [l, n, S, r, c, p]), L(() => {
|
|
90
|
+
if (!l) return;
|
|
91
|
+
function t(g) {
|
|
92
|
+
var B;
|
|
93
|
+
const A = (B = g.data) == null ? void 0 : B.id;
|
|
94
|
+
if (typeof A != "string") return;
|
|
95
|
+
const T = R(S, A);
|
|
96
|
+
T && T.children.length > 0 && f(T.id);
|
|
97
|
+
}
|
|
98
|
+
return l.on("click", t), () => {
|
|
99
|
+
l.off("click", t);
|
|
100
|
+
};
|
|
101
|
+
}, [l, S, f]);
|
|
102
|
+
function b(t) {
|
|
103
|
+
return p ? p(t) : String(t);
|
|
104
|
+
}
|
|
105
|
+
const F = J.map((t) => ({
|
|
106
|
+
...t,
|
|
107
|
+
detail: Ne(
|
|
108
|
+
d.find((g) => g.id === t.id),
|
|
109
|
+
U,
|
|
110
|
+
b
|
|
111
|
+
)
|
|
112
|
+
})), v = s === "on" || s === "auto" && Z >= Se, N = i ? i.value : m ?? me(d), I = i ? pe(d, i.id) : void 0, ee = $ !== "none" && e.length > 0, P = /* @__PURE__ */ h(re, { children: [
|
|
113
|
+
/* @__PURE__ */ a("span", { className: "pie-chart__total-value", children: b(N) }),
|
|
114
|
+
/* @__PURE__ */ a("span", { className: "pie-chart__total-caption", children: i ? i.name : o.total })
|
|
115
|
+
] });
|
|
116
|
+
function y() {
|
|
117
|
+
f(I ? I.id : null);
|
|
118
|
+
}
|
|
119
|
+
function te() {
|
|
120
|
+
return i ? /* @__PURE__ */ a(
|
|
121
|
+
"button",
|
|
122
|
+
{
|
|
123
|
+
type: "button",
|
|
124
|
+
className: "pie-chart__center pie-chart__center--button",
|
|
125
|
+
"aria-label": o.backToPrevious(i.name),
|
|
126
|
+
onClick: y,
|
|
127
|
+
children: v && P
|
|
128
|
+
}
|
|
129
|
+
) : v && /* @__PURE__ */ a("div", { className: "pie-chart__center", children: P });
|
|
130
|
+
}
|
|
131
|
+
function ie() {
|
|
132
|
+
return i ? /* @__PURE__ */ h(
|
|
133
|
+
"button",
|
|
134
|
+
{
|
|
135
|
+
type: "button",
|
|
136
|
+
className: "pie-chart__footer pie-chart__footer--button",
|
|
137
|
+
"aria-label": o.backToPrevious(i.name),
|
|
138
|
+
onClick: y,
|
|
139
|
+
children: [
|
|
140
|
+
i.name,
|
|
141
|
+
v && `: ${b(N)}`
|
|
142
|
+
]
|
|
143
|
+
}
|
|
144
|
+
) : v && /* @__PURE__ */ a("div", { className: "pie-chart__footer", children: `${o.total}: ${b(N)}` });
|
|
145
|
+
}
|
|
146
|
+
return /* @__PURE__ */ h(
|
|
147
|
+
"div",
|
|
148
|
+
{
|
|
149
|
+
className: ne("pie-chart", `pie-chart--legend-${D}`, V),
|
|
150
|
+
...w,
|
|
151
|
+
children: [
|
|
152
|
+
ee && /* @__PURE__ */ a(
|
|
153
|
+
se,
|
|
154
|
+
{
|
|
155
|
+
className: "pie-chart__legend",
|
|
156
|
+
items: F,
|
|
157
|
+
onToggle: Y,
|
|
158
|
+
onColorChange: x,
|
|
159
|
+
colorTokensBySeriesId: Q,
|
|
160
|
+
labels: j
|
|
161
|
+
}
|
|
162
|
+
),
|
|
163
|
+
/* @__PURE__ */ h("div", { className: "pie-chart__body", children: [
|
|
164
|
+
/* @__PURE__ */ h("div", { ref: X, className: "pie-chart__stage", children: [
|
|
165
|
+
/* @__PURE__ */ a("div", { ref: z, className: "pie-chart__canvas" }),
|
|
166
|
+
r === "donut" && te()
|
|
167
|
+
] }),
|
|
168
|
+
r === "pie" && ie()
|
|
169
|
+
] })
|
|
170
|
+
]
|
|
171
|
+
}
|
|
172
|
+
);
|
|
173
|
+
}
|
|
174
|
+
export {
|
|
175
|
+
Be as PieChart
|
|
176
|
+
};
|
|
177
|
+
//# sourceMappingURL=PieChart.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PieChart.js","sources":["../../../../../../src/ui/components/charts/PieChart/PieChart.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n useCallback,\n useEffect,\n useLayoutEffect,\n useMemo,\n useState,\n} from \"react\";\nimport {\n ChartLegend,\n type ChartLegendItem,\n type ChartLegendLabels,\n} from \"../ChartLegend/ChartLegend\";\nimport {\n useChartLegend,\n type ChartLegendSeries,\n type ChartLegendState,\n} from \"../ChartLegend/use-chart-legend\";\nimport { CHART_NEUTRAL_COLOR_TOKEN } from \"../chart-palette\";\nimport { useChartInstance, type ChartInstance } from \"../useChartInstance\";\nimport {\n buildPieChartOption,\n formatShare,\n type PieChartLabelContent,\n type PieChartShape,\n} from \"./pie-chart-option\";\nimport {\n buildPieSlices,\n displayNameOf,\n findParentSlice,\n findSlice,\n totalOf,\n type PieChartNode,\n type PieSlice,\n} from \"./pie-chart-slices\";\nimport \"./pie-chart.css\";\n\nexport type { PieChartNode } from \"./pie-chart-slices\";\nexport type { PieChartLabelContent, PieChartShape } from \"./pie-chart-option\";\n\nexport type PieChartLegendMode = \"inline\" | \"none\";\n\nexport type PieChartLegendPosition = \"bottom\" | \"right\" | \"top\" | \"left\";\n\nexport type PieChartLegendValue = \"percent\" | \"value\";\n\nexport type PieChartShowTotal = \"auto\" | \"on\" | \"off\";\n\nexport interface PieChartLabels {\n others: string;\n total: string;\n backToPrevious: (categoryName: string) => string;\n}\n\nconst DEFAULT_LABELS: PieChartLabels = {\n others: \"Others\",\n total: \"Total\",\n backToPrevious: (categoryName: string) => `Back from ${categoryName}`,\n};\n\nconst MIN_SIZE_FOR_AUTO_TOTAL_PX: number = 200;\n\nconst DEFAULT_LABEL_CONTENT: PieChartLabelContent[] = [\"percent\"];\n\nconst NO_LEGEND_VALUES: PieChartLegendValue[] = [];\n\nexport type PieChartProps = Omit<ComponentPropsWithoutRef<\"div\">, \"children\"> & {\n data: PieChartNode[];\n shape?: PieChartShape;\n labelContent?: PieChartLabelContent[];\n showTotal?: PieChartShowTotal;\n total?: number;\n valueFormatter?: (value: number) => string;\n legend?: PieChartLegendMode;\n legendPosition?: PieChartLegendPosition;\n legendValues?: PieChartLegendValue[];\n onSeriesColorChange?: (seriesId: string, colorToken: string | null) => void;\n onFocusChange?: (focusedNodeId: string | null) => void;\n legendLabels?: Partial<ChartLegendLabels>;\n labels?: Partial<PieChartLabels>;\n};\n\nfunction legendDetail(\n slice: PieSlice | undefined,\n legendValues: PieChartLegendValue[],\n formatValue: (value: number) => string,\n): string | undefined {\n if (!slice || legendValues.length === 0) return undefined;\n const hasPercent: boolean = legendValues.includes(\"percent\");\n const hasValue: boolean = legendValues.includes(\"value\");\n if (hasPercent && hasValue) return `${formatValue(slice.value)} (${formatShare(slice.share)})`;\n return hasValue ? formatValue(slice.value) : formatShare(slice.share);\n}\n\nfunction useMinSide(element: HTMLElement | null): number {\n const [minSide, setMinSide] = useState<number>(0);\n\n useLayoutEffect(() => {\n if (!element) return undefined;\n const observer: ResizeObserver = new ResizeObserver(() =>\n setMinSide(Math.min(element.clientWidth, element.clientHeight)),\n );\n observer.observe(element);\n return () => observer.disconnect();\n }, [element]);\n\n return minSide;\n}\n\nexport function PieChart({\n data,\n shape = \"donut\",\n labelContent = DEFAULT_LABEL_CONTENT,\n showTotal = \"auto\",\n total,\n valueFormatter,\n legend = \"inline\",\n legendPosition = \"bottom\",\n legendValues = NO_LEGEND_VALUES,\n onSeriesColorChange,\n onFocusChange,\n legendLabels,\n labels,\n className,\n ...props\n}: PieChartProps) {\n const { containerRef, chart, theme, resolveSeriesColor }: ChartInstance = useChartInstance();\n const resolvedLabels: PieChartLabels = { ...DEFAULT_LABELS, ...labels };\n const [focusedNodeId, setFocusedNodeId] = useState<string | null>(null);\n const [stageElement, setStageElement] = useState<HTMLDivElement | null>(null);\n const stageMinSide: number = useMinSide(stageElement);\n\n const legendSeries: ChartLegendSeries[] = useMemo(\n () =>\n data.map((node: PieChartNode) => ({\n id: node.id,\n name: displayNameOf(node, resolvedLabels.others),\n colorToken: node.colorToken ?? (node.isOthers ? CHART_NEUTRAL_COLOR_TOKEN : undefined),\n })),\n [data, resolvedLabels.others],\n );\n\n const {\n items,\n colorsBySeriesId,\n colorTokensBySeriesId,\n hiddenSeriesIds,\n toggleSeries,\n }: ChartLegendState = useChartLegend(\n legendSeries,\n theme?.seriesColors ?? [],\n resolveSeriesColor,\n );\n\n const visibleSlices: PieSlice[] = useMemo(\n () =>\n buildPieSlices({\n nodes: data.filter((node: PieChartNode) => !hiddenSeriesIds.has(node.id)),\n colorsByRootId: colorsBySeriesId,\n fallbackColor: theme?.neutralColor ?? \"#9ca3af\",\n othersName: resolvedLabels.others,\n }),\n [data, hiddenSeriesIds, colorsBySeriesId, theme, resolvedLabels.others],\n );\n\n const focusedSlice: PieSlice | undefined = useMemo(\n () => (focusedNodeId === null ? undefined : findSlice(visibleSlices, focusedNodeId)),\n [visibleSlices, focusedNodeId],\n );\n\n const drawnSlices: PieSlice[] = focusedSlice ? focusedSlice.children : visibleSlices;\n\n const updateFocus = useCallback(\n (nextFocusedNodeId: string | null): void => {\n setFocusedNodeId(nextFocusedNodeId);\n onFocusChange?.(nextFocusedNodeId);\n },\n [onFocusChange],\n );\n\n useEffect(() => {\n if (focusedNodeId !== null && !focusedSlice) updateFocus(null);\n }, [focusedNodeId, focusedSlice, updateFocus]);\n\n useEffect(() => {\n if (!chart || !theme) return;\n chart.setOption(\n buildPieChartOption({ slices: drawnSlices, shape, labelContent, theme, valueFormatter }),\n { notMerge: true },\n );\n }, [chart, theme, drawnSlices, shape, labelContent, valueFormatter]);\n\n useEffect(() => {\n if (!chart) return undefined;\n\n function drillIntoClickedSlice(params: { data?: unknown }): void {\n const clickedId: unknown = (params.data as { id?: unknown } | null | undefined)?.id;\n if (typeof clickedId !== \"string\") return;\n const clickedSlice: PieSlice | undefined = findSlice(drawnSlices, clickedId);\n if (clickedSlice && clickedSlice.children.length > 0) updateFocus(clickedSlice.id);\n }\n\n chart.on(\"click\", drillIntoClickedSlice);\n return () => {\n chart.off(\"click\", drillIntoClickedSlice);\n };\n }, [chart, drawnSlices, updateFocus]);\n\n function formatValue(value: number): string {\n return valueFormatter ? valueFormatter(value) : String(value);\n }\n\n const legendItems: ChartLegendItem[] = items.map((item: ChartLegendItem) => ({\n ...item,\n detail: legendDetail(\n visibleSlices.find((slice: PieSlice) => slice.id === item.id),\n legendValues,\n formatValue,\n ),\n }));\n\n const isTotalVisible: boolean =\n showTotal === \"on\" || (showTotal === \"auto\" && stageMinSide >= MIN_SIZE_FOR_AUTO_TOTAL_PX);\n const centerTotal: number = focusedSlice ? focusedSlice.value : (total ?? totalOf(visibleSlices));\n const parentOfFocusedSlice: PieSlice | undefined = focusedSlice\n ? findParentSlice(visibleSlices, focusedSlice.id)\n : undefined;\n const isLegendVisible: boolean = legend !== \"none\" && data.length > 0;\n\n const centerContent = (\n <>\n <span className=\"pie-chart__total-value\">{formatValue(centerTotal)}</span>\n <span className=\"pie-chart__total-caption\">\n {focusedSlice ? focusedSlice.name : resolvedLabels.total}\n </span>\n </>\n );\n\n function goBack(): void {\n updateFocus(parentOfFocusedSlice ? parentOfFocusedSlice.id : null);\n }\n\n function renderDonutCenter() {\n if (focusedSlice) {\n return (\n <button\n type=\"button\"\n className=\"pie-chart__center pie-chart__center--button\"\n aria-label={resolvedLabels.backToPrevious(focusedSlice.name)}\n onClick={goBack}\n >\n {isTotalVisible && centerContent}\n </button>\n );\n }\n return isTotalVisible && <div className=\"pie-chart__center\">{centerContent}</div>;\n }\n\n function renderPieFooter() {\n if (focusedSlice) {\n return (\n <button\n type=\"button\"\n className=\"pie-chart__footer pie-chart__footer--button\"\n aria-label={resolvedLabels.backToPrevious(focusedSlice.name)}\n onClick={goBack}\n >\n {focusedSlice.name}\n {isTotalVisible && `: ${formatValue(centerTotal)}`}\n </button>\n );\n }\n return (\n isTotalVisible && (\n <div className=\"pie-chart__footer\">{`${resolvedLabels.total}: ${formatValue(centerTotal)}`}</div>\n )\n );\n }\n\n return (\n <div\n className={clsx(\"pie-chart\", `pie-chart--legend-${legendPosition}`, className)}\n {...props}\n >\n {isLegendVisible && (\n <ChartLegend\n className=\"pie-chart__legend\"\n items={legendItems}\n onToggle={toggleSeries}\n onColorChange={onSeriesColorChange}\n colorTokensBySeriesId={colorTokensBySeriesId}\n labels={legendLabels}\n />\n )}\n <div className=\"pie-chart__body\">\n <div ref={setStageElement} className=\"pie-chart__stage\">\n <div ref={containerRef} className=\"pie-chart__canvas\" />\n {shape === \"donut\" && renderDonutCenter()}\n </div>\n {shape === \"pie\" && renderPieFooter()}\n </div>\n </div>\n );\n}\n"],"names":["DEFAULT_LABELS","categoryName","MIN_SIZE_FOR_AUTO_TOTAL_PX","DEFAULT_LABEL_CONTENT","NO_LEGEND_VALUES","legendDetail","slice","legendValues","formatValue","hasPercent","hasValue","formatShare","useMinSide","element","minSide","setMinSide","useState","useLayoutEffect","observer","PieChart","data","shape","labelContent","showTotal","total","valueFormatter","legend","legendPosition","onSeriesColorChange","onFocusChange","legendLabels","labels","className","props","containerRef","chart","theme","resolveSeriesColor","useChartInstance","resolvedLabels","focusedNodeId","setFocusedNodeId","stageElement","setStageElement","stageMinSide","legendSeries","useMemo","node","displayNameOf","CHART_NEUTRAL_COLOR_TOKEN","items","colorsBySeriesId","colorTokensBySeriesId","hiddenSeriesIds","toggleSeries","useChartLegend","visibleSlices","buildPieSlices","focusedSlice","findSlice","drawnSlices","updateFocus","useCallback","nextFocusedNodeId","useEffect","buildPieChartOption","drillIntoClickedSlice","params","clickedId","_a","clickedSlice","value","legendItems","item","isTotalVisible","centerTotal","totalOf","parentOfFocusedSlice","findParentSlice","isLegendVisible","centerContent","jsxs","Fragment","jsx","goBack","renderDonutCenter","renderPieFooter","clsx","ChartLegend"],"mappings":";;;;;;;;;;AAuDA,MAAMA,KAAiC;AAAA,EACrC,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,gBAAgB,CAACC,MAAyB,aAAaA,CAAY;AACrE,GAEMC,KAAqC,KAErCC,KAAgD,CAAC,SAAS,GAE1DC,KAA0C,CAAA;AAkBhD,SAASC,GACPC,GACAC,GACAC,GACoB;AACpB,MAAI,CAACF,KAASC,EAAa,WAAW,EAAG;AACzC,QAAME,IAAsBF,EAAa,SAAS,SAAS,GACrDG,IAAoBH,EAAa,SAAS,OAAO;AACvD,SAAIE,KAAcC,IAAiB,GAAGF,EAAYF,EAAM,KAAK,CAAC,KAAKK,EAAYL,EAAM,KAAK,CAAC,MACpFI,IAAWF,EAAYF,EAAM,KAAK,IAAIK,EAAYL,EAAM,KAAK;AACtE;AAEA,SAASM,GAAWC,GAAqC;AACvD,QAAM,CAACC,GAASC,CAAU,IAAIC,EAAiB,CAAC;AAEhD,SAAAC,GAAgB,MAAM;AACpB,QAAI,CAACJ,EAAS;AACd,UAAMK,IAA2B,IAAI;AAAA,MAAe,MAClDH,EAAW,KAAK,IAAIF,EAAQ,aAAaA,EAAQ,YAAY,CAAC;AAAA,IAAA;AAEhE,WAAAK,EAAS,QAAQL,CAAO,GACjB,MAAMK,EAAS,WAAA;AAAA,EACxB,GAAG,CAACL,CAAO,CAAC,GAELC;AACT;AAEO,SAASK,GAAS;AAAA,EACvB,MAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,cAAAC,IAAenB;AAAA,EACf,WAAAoB,IAAY;AAAA,EACZ,OAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,gBAAAC,IAAiB;AAAA,EACjB,cAAApB,IAAeH;AAAA,EACf,qBAAAwB;AAAA,EACA,eAAAC;AAAA,EACA,cAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,GAAGC;AACL,GAAkB;AAChB,QAAM,EAAE,cAAAC,GAAc,OAAAC,GAAO,OAAAC,GAAO,oBAAAC,EAAA,IAAsCC,GAAA,GACpEC,IAAiC,EAAE,GAAGvC,IAAgB,GAAG+B,EAAA,GACzD,CAACS,GAAeC,CAAgB,IAAIzB,EAAwB,IAAI,GAChE,CAAC0B,GAAcC,CAAe,IAAI3B,EAAgC,IAAI,GACtE4B,IAAuBhC,GAAW8B,CAAY,GAE9CG,IAAoCC;AAAA,IACxC,MACE1B,EAAK,IAAI,CAAC2B,OAAwB;AAAA,MAChC,IAAIA,EAAK;AAAA,MACT,MAAMC,GAAcD,GAAMR,EAAe,MAAM;AAAA,MAC/C,YAAYQ,EAAK,eAAeA,EAAK,WAAWE,KAA4B;AAAA,IAAA,EAC5E;AAAA,IACJ,CAAC7B,GAAMmB,EAAe,MAAM;AAAA,EAAA,GAGxB;AAAA,IACJ,OAAAW;AAAA,IACA,kBAAAC;AAAA,IACA,uBAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,cAAAC;AAAA,EAAA,IACoBC;AAAA,IACpBV;AAAA,KACAT,KAAA,gBAAAA,EAAO,iBAAgB,CAAA;AAAA,IACvBC;AAAA,EAAA,GAGImB,IAA4BV;AAAA,IAChC,MACEW,GAAe;AAAA,MACb,OAAOrC,EAAK,OAAO,CAAC2B,MAAuB,CAACM,EAAgB,IAAIN,EAAK,EAAE,CAAC;AAAA,MACxE,gBAAgBI;AAAA,MAChB,gBAAef,KAAA,gBAAAA,EAAO,iBAAgB;AAAA,MACtC,YAAYG,EAAe;AAAA,IAAA,CAC5B;AAAA,IACH,CAACnB,GAAMiC,GAAiBF,GAAkBf,GAAOG,EAAe,MAAM;AAAA,EAAA,GAGlEmB,IAAqCZ;AAAA,IACzC,MAAON,MAAkB,OAAO,SAAYmB,EAAUH,GAAehB,CAAa;AAAA,IAClF,CAACgB,GAAehB,CAAa;AAAA,EAAA,GAGzBoB,IAA0BF,IAAeA,EAAa,WAAWF,GAEjEK,IAAcC;AAAA,IAClB,CAACC,MAA2C;AAC1C,MAAAtB,EAAiBsB,CAAiB,GAClClC,KAAA,QAAAA,EAAgBkC;AAAA,IAClB;AAAA,IACA,CAAClC,CAAa;AAAA,EAAA;AAGhB,EAAAmC,EAAU,MAAM;AACd,IAAIxB,MAAkB,QAAQ,CAACkB,OAA0B,IAAI;AAAA,EAC/D,GAAG,CAAClB,GAAekB,GAAcG,CAAW,CAAC,GAE7CG,EAAU,MAAM;AACd,IAAI,CAAC7B,KAAS,CAACC,KACfD,EAAM;AAAA,MACJ8B,GAAoB,EAAE,QAAQL,GAAa,OAAAvC,GAAO,cAAAC,GAAc,OAAAc,GAAO,gBAAAX,GAAgB;AAAA,MACvF,EAAE,UAAU,GAAA;AAAA,IAAK;AAAA,EAErB,GAAG,CAACU,GAAOC,GAAOwB,GAAavC,GAAOC,GAAcG,CAAc,CAAC,GAEnEuC,EAAU,MAAM;AACd,QAAI,CAAC7B,EAAO;AAEZ,aAAS+B,EAAsBC,GAAkC;;AAC/D,YAAMC,KAAsBC,IAAAF,EAAO,SAAP,gBAAAE,EAAqD;AACjF,UAAI,OAAOD,KAAc,SAAU;AACnC,YAAME,IAAqCX,EAAUC,GAAaQ,CAAS;AAC3E,MAAIE,KAAgBA,EAAa,SAAS,SAAS,KAAGT,EAAYS,EAAa,EAAE;AAAA,IACnF;AAEA,WAAAnC,EAAM,GAAG,SAAS+B,CAAqB,GAChC,MAAM;AACX,MAAA/B,EAAM,IAAI,SAAS+B,CAAqB;AAAA,IAC1C;AAAA,EACF,GAAG,CAAC/B,GAAOyB,GAAaC,CAAW,CAAC;AAEpC,WAASrD,EAAY+D,GAAuB;AAC1C,WAAO9C,IAAiBA,EAAe8C,CAAK,IAAI,OAAOA,CAAK;AAAA,EAC9D;AAEA,QAAMC,IAAiCtB,EAAM,IAAI,CAACuB,OAA2B;AAAA,IAC3E,GAAGA;AAAA,IACH,QAAQpE;AAAA,MACNmD,EAAc,KAAK,CAAClD,MAAoBA,EAAM,OAAOmE,EAAK,EAAE;AAAA,MAC5DlE;AAAA,MACAC;AAAA,IAAA;AAAA,EACF,EACA,GAEIkE,IACJnD,MAAc,QAASA,MAAc,UAAUqB,KAAgB1C,IAC3DyE,IAAsBjB,IAAeA,EAAa,QAASlC,KAASoD,GAAQpB,CAAa,GACzFqB,IAA6CnB,IAC/CoB,GAAgBtB,GAAeE,EAAa,EAAE,IAC9C,QACEqB,KAA2BrD,MAAW,UAAUN,EAAK,SAAS,GAE9D4D,IACJ,gBAAAC,EAAAC,IAAA,EACE,UAAA;AAAA,IAAA,gBAAAC,EAAC,QAAA,EAAK,WAAU,0BAA0B,UAAA3E,EAAYmE,CAAW,GAAE;AAAA,IACnE,gBAAAQ,EAAC,UAAK,WAAU,4BACb,cAAezB,EAAa,OAAOnB,EAAe,MAAA,CACrD;AAAA,EAAA,GACF;AAGF,WAAS6C,IAAe;AACtB,IAAAvB,EAAYgB,IAAuBA,EAAqB,KAAK,IAAI;AAAA,EACnE;AAEA,WAASQ,KAAoB;AAC3B,WAAI3B,IAEA,gBAAAyB;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAU;AAAA,QACV,cAAY5C,EAAe,eAAemB,EAAa,IAAI;AAAA,QAC3D,SAAS0B;AAAA,QAER,UAAAV,KAAkBM;AAAA,MAAA;AAAA,IAAA,IAIlBN,KAAkB,gBAAAS,EAAC,OAAA,EAAI,WAAU,qBAAqB,UAAAH,GAAc;AAAA,EAC7E;AAEA,WAASM,KAAkB;AACzB,WAAI5B,IAEA,gBAAAuB;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAU;AAAA,QACV,cAAY1C,EAAe,eAAemB,EAAa,IAAI;AAAA,QAC3D,SAAS0B;AAAA,QAER,UAAA;AAAA,UAAA1B,EAAa;AAAA,UACbgB,KAAkB,KAAKlE,EAAYmE,CAAW,CAAC;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA,IAKpDD,KACE,gBAAAS,EAAC,OAAA,EAAI,WAAU,qBAAqB,UAAA,GAAG5C,EAAe,KAAK,KAAK/B,EAAYmE,CAAW,CAAC,IAAG;AAAA,EAGjG;AAEA,SACE,gBAAAM;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWM,GAAK,aAAa,qBAAqB5D,CAAc,IAAIK,CAAS;AAAA,MAC5E,GAAGC;AAAA,MAEH,UAAA;AAAA,QAAA8C,MACC,gBAAAI;AAAA,UAACK;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,OAAOhB;AAAA,YACP,UAAUlB;AAAA,YACV,eAAe1B;AAAA,YACf,uBAAAwB;AAAA,YACA,QAAQtB;AAAA,UAAA;AAAA,QAAA;AAAA,QAGZ,gBAAAmD,EAAC,OAAA,EAAI,WAAU,mBACb,UAAA;AAAA,UAAA,gBAAAA,EAAC,OAAA,EAAI,KAAKtC,GAAiB,WAAU,oBACnC,UAAA;AAAA,YAAA,gBAAAwC,EAAC,OAAA,EAAI,KAAKjD,GAAc,WAAU,qBAAoB;AAAA,YACrDb,MAAU,WAAWgE,GAAA;AAAA,UAAkB,GAC1C;AAAA,UACChE,MAAU,SAASiE,GAAA;AAAA,QAAgB,EAAA,CACtC;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const C=require("../chart-label-color.cjs"),p=require("./pie-chart-slices.cjs"),n=40,_=85,S=8,m=32,h=92,g=" > ",L=10,b=2,R=new Intl.NumberFormat(void 0,{style:"percent",maximumFractionDigits:1});function i(e){return R.format(e)}function d(e,t){return e.valueFormatter?e.valueFormatter(t):String(t)}function u(e){return e.replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">").replace(/"/g,""")}function v(e,t){const o=[];return e.labelContent.includes("name")&&o.push(t.name),e.labelContent.includes("percent")&&o.push(i(t.share)),e.labelContent.includes("value")&&o.push(d(e,t.value)),o.join(" ")}function T(e,t){const o=u(t.path.join(g)),r=u(d(e,t.value));return`<div>${o}</div><div><b>${r}</b> · ${i(t.share)}</div>`}function s(e,t,o){return{id:t.id,name:t.name,value:t.value,itemStyle:{color:t.color},label:{color:C.labelColorOnFill(t.color)},labelText:v(e,t),tooltip:T(e,t),children:o?t.children.map(r=>s(e,r,!0)):void 0}}function I(e){const{theme:t}=e;return{trigger:"item",backgroundColor:t.tooltipBackgroundColor,borderColor:t.tooltipBorderColor,textStyle:{color:t.labelColor},formatter:o=>o.data.tooltip}}function a(e){return e.data.labelText}function f(e){return e.shape==="pie"?0:n}function N(e){return e.shape==="pie"?["0%",`${_}%`]:[`${n}%`,`${n+m}%`]}function y(e){const t=e.labelContent.length>0;return e.shape==="pie"?{show:t,position:"inside",formatter:a}:{show:t,position:"outside",color:e.theme.labelColor,formatter:a}}function A(e){const t=e.shape==="pie";return{type:"pie",radius:N(e),data:e.slices.map(o=>{const{label:r,...l}=s(e,o,!1);return t?{...l,label:r}:l}),itemStyle:{borderColor:e.theme.tooltipBackgroundColor,borderWidth:b},label:y(e),minShowLabelAngle:t?S:0,labelLine:{show:!t&&e.labelContent.length>0},labelLayout:{hideOverlap:!0},emphasis:{scale:!1}}}function P(e,t){const o=f(e),r=(h-o)/t,l=e.shape==="pie"?r:Math.min(m,r),E=Array.from({length:t},($,c)=>({r0:`${o+l*c}%`,r:`${o+l*(c+1)}%`}));return[{},...E]}function D(e){const t=e.labelContent.length>0;return{type:"sunburst",nodeClick:!1,sort:null,radius:[`${f(e)}%`,`${h}%`],data:e.slices.map(o=>s(e,o,!0)),levels:P(e,p.sliceDepth(e.slices)),itemStyle:{borderColor:e.theme.tooltipBackgroundColor,borderWidth:b},label:{show:t,rotate:"radial",minAngle:L,formatter:a},emphasis:{focus:"none"}}}function O(e){return e.some(t=>t.children.length>0)}function F(e){const{theme:t}=e;return{animation:!1,textStyle:{fontFamily:t.fontFamily,color:t.labelColor},tooltip:I(e),series:[O(e.slices)?D(e):A(e)]}}exports.buildPieChartOption=F;exports.formatShare=i;
|
|
2
|
+
//# sourceMappingURL=pie-chart-option.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"pie-chart-option.cjs","sources":["../../../../../../src/ui/components/charts/PieChart/pie-chart-option.ts"],"sourcesContent":["import { labelColorOnFill } from \"../chart-label-color\";\nimport type { ChartTheme } from \"../chart-theme\";\nimport type { PieSlice } from \"./pie-chart-slices\";\nimport { sliceDepth } from \"./pie-chart-slices\";\n\nexport type PieChartLabelContent = \"name\" | \"percent\" | \"value\";\n\nexport type PieChartShape = \"donut\" | \"pie\";\n\nexport interface PieChartOptionInput {\n slices: PieSlice[];\n shape: PieChartShape;\n labelContent: PieChartLabelContent[];\n theme: ChartTheme;\n valueFormatter?: (value: number) => string;\n}\n\nconst DONUT_HOLE_RADIUS_PERCENT: number = 40;\n\nconst FULL_PIE_OUTER_RADIUS_PERCENT: number = 85;\n\nconst MIN_INSIDE_LABEL_ANGLE_DEGREES: number = 8;\n\nconst RING_THICKNESS_PERCENT: number = 32;\n\nconst OUTER_RADIUS_LIMIT_PERCENT: number = 92;\n\nconst PATH_SEPARATOR: string = \" > \";\n\nconst MIN_LABELED_ANGLE_DEGREES: number = 10;\n\nconst RING_BORDER_WIDTH_PX: number = 2;\n\nconst PERCENT_LABEL: Intl.NumberFormat = new Intl.NumberFormat(undefined, {\n style: \"percent\",\n maximumFractionDigits: 1,\n});\n\nexport function formatShare(share: number): string {\n return PERCENT_LABEL.format(share);\n}\n\nfunction formatValue(input: PieChartOptionInput, value: number): string {\n return input.valueFormatter ? input.valueFormatter(value) : String(value);\n}\n\nfunction escapeHtml(text: string): string {\n return text\n .replace(/&/g, \"&\")\n .replace(/</g, \"<\")\n .replace(/>/g, \">\")\n .replace(/\"/g, \""\");\n}\n\nfunction labelText(input: PieChartOptionInput, slice: PieSlice): string {\n const parts: string[] = [];\n if (input.labelContent.includes(\"name\")) parts.push(slice.name);\n if (input.labelContent.includes(\"percent\")) parts.push(formatShare(slice.share));\n if (input.labelContent.includes(\"value\")) parts.push(formatValue(input, slice.value));\n return parts.join(\" \");\n}\n\nfunction tooltipHtml(input: PieChartOptionInput, slice: PieSlice): string {\n const path: string = escapeHtml(slice.path.join(PATH_SEPARATOR));\n const value: string = escapeHtml(formatValue(input, slice.value));\n return `<div>${path}</div><div><b>${value}</b> · ${formatShare(slice.share)}</div>`;\n}\n\ninterface DataItem {\n id: string;\n name: string;\n value: number;\n itemStyle: { color: string };\n label?: { color: string };\n labelText: string;\n tooltip: string;\n children?: DataItem[];\n}\n\nfunction toDataItem(input: PieChartOptionInput, slice: PieSlice, withChildren: boolean): DataItem {\n return {\n id: slice.id,\n name: slice.name,\n value: slice.value,\n itemStyle: { color: slice.color },\n label: { color: labelColorOnFill(slice.color) },\n labelText: labelText(input, slice),\n tooltip: tooltipHtml(input, slice),\n children: withChildren\n ? slice.children.map((child: PieSlice) => toDataItem(input, child, true))\n : undefined,\n };\n}\n\nfunction tooltipOption(input: PieChartOptionInput): Record<string, unknown> {\n const { theme } = input;\n return {\n trigger: \"item\",\n backgroundColor: theme.tooltipBackgroundColor,\n borderColor: theme.tooltipBorderColor,\n textStyle: { color: theme.labelColor },\n formatter: (params: { data: DataItem }) => params.data.tooltip,\n };\n}\n\nfunction labelFormatter(params: { data: DataItem }): string {\n return params.data.labelText;\n}\n\nfunction holeRadiusPercent(input: PieChartOptionInput): number {\n return input.shape === \"pie\" ? 0 : DONUT_HOLE_RADIUS_PERCENT;\n}\n\nfunction pieRadius(input: PieChartOptionInput): [string, string] {\n if (input.shape === \"pie\") return [\"0%\", `${FULL_PIE_OUTER_RADIUS_PERCENT}%`];\n return [\n `${DONUT_HOLE_RADIUS_PERCENT}%`,\n `${DONUT_HOLE_RADIUS_PERCENT + RING_THICKNESS_PERCENT}%`,\n ];\n}\n\nfunction pieLabel(input: PieChartOptionInput): Record<string, unknown> {\n const show: boolean = input.labelContent.length > 0;\n if (input.shape === \"pie\") {\n return { show, position: \"inside\", formatter: labelFormatter };\n }\n return { show, position: \"outside\", color: input.theme.labelColor, formatter: labelFormatter };\n}\n\nfunction pieSeries(input: PieChartOptionInput): Record<string, unknown> {\n const isFullPie: boolean = input.shape === \"pie\";\n return {\n type: \"pie\",\n radius: pieRadius(input),\n data: input.slices.map((slice: PieSlice) => {\n const { label: fillLabel, ...item } = toDataItem(input, slice, false);\n return isFullPie ? { ...item, label: fillLabel } : item;\n }),\n itemStyle: { borderColor: input.theme.tooltipBackgroundColor, borderWidth: RING_BORDER_WIDTH_PX },\n label: pieLabel(input),\n minShowLabelAngle: isFullPie ? MIN_INSIDE_LABEL_ANGLE_DEGREES : 0,\n labelLine: { show: !isFullPie && input.labelContent.length > 0 },\n labelLayout: { hideOverlap: true },\n emphasis: { scale: false },\n };\n}\n\nfunction sunburstLevels(input: PieChartOptionInput, depth: number): Array<Record<string, unknown>> {\n const hole: number = holeRadiusPercent(input);\n const evenThickness: number = (OUTER_RADIUS_LIMIT_PERCENT - hole) / depth;\n const thickness: number =\n input.shape === \"pie\" ? evenThickness : Math.min(RING_THICKNESS_PERCENT, evenThickness);\n const rings: Array<Record<string, unknown>> = Array.from(\n { length: depth },\n (_unused, ringIndex: number) => ({\n r0: `${hole + thickness * ringIndex}%`,\n r: `${hole + thickness * (ringIndex + 1)}%`,\n }),\n );\n return [{}, ...rings];\n}\n\nfunction sunburstSeries(input: PieChartOptionInput): Record<string, unknown> {\n const hasLabels: boolean = input.labelContent.length > 0;\n return {\n type: \"sunburst\",\n nodeClick: false,\n sort: null,\n radius: [`${holeRadiusPercent(input)}%`, `${OUTER_RADIUS_LIMIT_PERCENT}%`],\n data: input.slices.map((slice: PieSlice) => toDataItem(input, slice, true)),\n levels: sunburstLevels(input, sliceDepth(input.slices)),\n itemStyle: { borderColor: input.theme.tooltipBackgroundColor, borderWidth: RING_BORDER_WIDTH_PX },\n label: {\n show: hasLabels,\n rotate: \"radial\",\n minAngle: MIN_LABELED_ANGLE_DEGREES,\n formatter: labelFormatter,\n },\n emphasis: { focus: \"none\" },\n };\n}\n\nfunction isHierarchical(slices: PieSlice[]): boolean {\n return slices.some((slice: PieSlice) => slice.children.length > 0);\n}\n\nexport function buildPieChartOption(input: PieChartOptionInput): Record<string, unknown> {\n const { theme } = input;\n return {\n animation: false,\n textStyle: { fontFamily: theme.fontFamily, color: theme.labelColor },\n tooltip: tooltipOption(input),\n series: [isHierarchical(input.slices) ? sunburstSeries(input) : pieSeries(input)],\n };\n}\n"],"names":["DONUT_HOLE_RADIUS_PERCENT","FULL_PIE_OUTER_RADIUS_PERCENT","MIN_INSIDE_LABEL_ANGLE_DEGREES","RING_THICKNESS_PERCENT","OUTER_RADIUS_LIMIT_PERCENT","PATH_SEPARATOR","MIN_LABELED_ANGLE_DEGREES","RING_BORDER_WIDTH_PX","PERCENT_LABEL","formatShare","share","formatValue","input","value","escapeHtml","text","labelText","slice","parts","tooltipHtml","path","toDataItem","withChildren","labelColorOnFill","child","tooltipOption","theme","params","labelFormatter","holeRadiusPercent","pieRadius","pieLabel","show","pieSeries","isFullPie","fillLabel","item","sunburstLevels","depth","hole","evenThickness","thickness","rings","_unused","ringIndex","sunburstSeries","hasLabels","sliceDepth","isHierarchical","slices","buildPieChartOption"],"mappings":"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"}
|
|
@@ -0,0 +1,124 @@
|
|
|
1
|
+
import { labelColorOnFill as p } from "../chart-label-color.js";
|
|
2
|
+
import { sliceDepth as C } from "./pie-chart-slices.js";
|
|
3
|
+
const n = 40, _ = 85, g = 8, u = 32, m = 92, R = " > ", L = 10, h = 2, S = new Intl.NumberFormat(void 0, {
|
|
4
|
+
style: "percent",
|
|
5
|
+
maximumFractionDigits: 1
|
|
6
|
+
});
|
|
7
|
+
function d(e) {
|
|
8
|
+
return S.format(e);
|
|
9
|
+
}
|
|
10
|
+
function f(e, t) {
|
|
11
|
+
return e.valueFormatter ? e.valueFormatter(t) : String(t);
|
|
12
|
+
}
|
|
13
|
+
function c(e) {
|
|
14
|
+
return e.replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">").replace(/"/g, """);
|
|
15
|
+
}
|
|
16
|
+
function v(e, t) {
|
|
17
|
+
const o = [];
|
|
18
|
+
return e.labelContent.includes("name") && o.push(t.name), e.labelContent.includes("percent") && o.push(d(t.share)), e.labelContent.includes("value") && o.push(f(e, t.value)), o.join(" ");
|
|
19
|
+
}
|
|
20
|
+
function T(e, t) {
|
|
21
|
+
const o = c(t.path.join(R)), r = c(f(e, t.value));
|
|
22
|
+
return `<div>${o}</div><div><b>${r}</b> · ${d(t.share)}</div>`;
|
|
23
|
+
}
|
|
24
|
+
function s(e, t, o) {
|
|
25
|
+
return {
|
|
26
|
+
id: t.id,
|
|
27
|
+
name: t.name,
|
|
28
|
+
value: t.value,
|
|
29
|
+
itemStyle: { color: t.color },
|
|
30
|
+
label: { color: p(t.color) },
|
|
31
|
+
labelText: v(e, t),
|
|
32
|
+
tooltip: T(e, t),
|
|
33
|
+
children: o ? t.children.map((r) => s(e, r, !0)) : void 0
|
|
34
|
+
};
|
|
35
|
+
}
|
|
36
|
+
function I(e) {
|
|
37
|
+
const { theme: t } = e;
|
|
38
|
+
return {
|
|
39
|
+
trigger: "item",
|
|
40
|
+
backgroundColor: t.tooltipBackgroundColor,
|
|
41
|
+
borderColor: t.tooltipBorderColor,
|
|
42
|
+
textStyle: { color: t.labelColor },
|
|
43
|
+
formatter: (o) => o.data.tooltip
|
|
44
|
+
};
|
|
45
|
+
}
|
|
46
|
+
function a(e) {
|
|
47
|
+
return e.data.labelText;
|
|
48
|
+
}
|
|
49
|
+
function b(e) {
|
|
50
|
+
return e.shape === "pie" ? 0 : n;
|
|
51
|
+
}
|
|
52
|
+
function N(e) {
|
|
53
|
+
return e.shape === "pie" ? ["0%", `${_}%`] : [
|
|
54
|
+
`${n}%`,
|
|
55
|
+
`${n + u}%`
|
|
56
|
+
];
|
|
57
|
+
}
|
|
58
|
+
function A(e) {
|
|
59
|
+
const t = e.labelContent.length > 0;
|
|
60
|
+
return e.shape === "pie" ? { show: t, position: "inside", formatter: a } : { show: t, position: "outside", color: e.theme.labelColor, formatter: a };
|
|
61
|
+
}
|
|
62
|
+
function D(e) {
|
|
63
|
+
const t = e.shape === "pie";
|
|
64
|
+
return {
|
|
65
|
+
type: "pie",
|
|
66
|
+
radius: N(e),
|
|
67
|
+
data: e.slices.map((o) => {
|
|
68
|
+
const { label: r, ...l } = s(e, o, !1);
|
|
69
|
+
return t ? { ...l, label: r } : l;
|
|
70
|
+
}),
|
|
71
|
+
itemStyle: { borderColor: e.theme.tooltipBackgroundColor, borderWidth: h },
|
|
72
|
+
label: A(e),
|
|
73
|
+
minShowLabelAngle: t ? g : 0,
|
|
74
|
+
labelLine: { show: !t && e.labelContent.length > 0 },
|
|
75
|
+
labelLayout: { hideOverlap: !0 },
|
|
76
|
+
emphasis: { scale: !1 }
|
|
77
|
+
};
|
|
78
|
+
}
|
|
79
|
+
function y(e, t) {
|
|
80
|
+
const o = b(e), r = (m - o) / t, l = e.shape === "pie" ? r : Math.min(u, r), E = Array.from(
|
|
81
|
+
{ length: t },
|
|
82
|
+
(O, i) => ({
|
|
83
|
+
r0: `${o + l * i}%`,
|
|
84
|
+
r: `${o + l * (i + 1)}%`
|
|
85
|
+
})
|
|
86
|
+
);
|
|
87
|
+
return [{}, ...E];
|
|
88
|
+
}
|
|
89
|
+
function P(e) {
|
|
90
|
+
const t = e.labelContent.length > 0;
|
|
91
|
+
return {
|
|
92
|
+
type: "sunburst",
|
|
93
|
+
nodeClick: !1,
|
|
94
|
+
sort: null,
|
|
95
|
+
radius: [`${b(e)}%`, `${m}%`],
|
|
96
|
+
data: e.slices.map((o) => s(e, o, !0)),
|
|
97
|
+
levels: y(e, C(e.slices)),
|
|
98
|
+
itemStyle: { borderColor: e.theme.tooltipBackgroundColor, borderWidth: h },
|
|
99
|
+
label: {
|
|
100
|
+
show: t,
|
|
101
|
+
rotate: "radial",
|
|
102
|
+
minAngle: L,
|
|
103
|
+
formatter: a
|
|
104
|
+
},
|
|
105
|
+
emphasis: { focus: "none" }
|
|
106
|
+
};
|
|
107
|
+
}
|
|
108
|
+
function F(e) {
|
|
109
|
+
return e.some((t) => t.children.length > 0);
|
|
110
|
+
}
|
|
111
|
+
function k(e) {
|
|
112
|
+
const { theme: t } = e;
|
|
113
|
+
return {
|
|
114
|
+
animation: !1,
|
|
115
|
+
textStyle: { fontFamily: t.fontFamily, color: t.labelColor },
|
|
116
|
+
tooltip: I(e),
|
|
117
|
+
series: [F(e.slices) ? P(e) : D(e)]
|
|
118
|
+
};
|
|
119
|
+
}
|
|
120
|
+
export {
|
|
121
|
+
k as buildPieChartOption,
|
|
122
|
+
d as formatShare
|
|
123
|
+
};
|
|
124
|
+
//# sourceMappingURL=pie-chart-option.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"pie-chart-option.js","sources":["../../../../../../src/ui/components/charts/PieChart/pie-chart-option.ts"],"sourcesContent":["import { labelColorOnFill } from \"../chart-label-color\";\nimport type { ChartTheme } from \"../chart-theme\";\nimport type { PieSlice } from \"./pie-chart-slices\";\nimport { sliceDepth } from \"./pie-chart-slices\";\n\nexport type PieChartLabelContent = \"name\" | \"percent\" | \"value\";\n\nexport type PieChartShape = \"donut\" | \"pie\";\n\nexport interface PieChartOptionInput {\n slices: PieSlice[];\n shape: PieChartShape;\n labelContent: PieChartLabelContent[];\n theme: ChartTheme;\n valueFormatter?: (value: number) => string;\n}\n\nconst DONUT_HOLE_RADIUS_PERCENT: number = 40;\n\nconst FULL_PIE_OUTER_RADIUS_PERCENT: number = 85;\n\nconst MIN_INSIDE_LABEL_ANGLE_DEGREES: number = 8;\n\nconst RING_THICKNESS_PERCENT: number = 32;\n\nconst OUTER_RADIUS_LIMIT_PERCENT: number = 92;\n\nconst PATH_SEPARATOR: string = \" > \";\n\nconst MIN_LABELED_ANGLE_DEGREES: number = 10;\n\nconst RING_BORDER_WIDTH_PX: number = 2;\n\nconst PERCENT_LABEL: Intl.NumberFormat = new Intl.NumberFormat(undefined, {\n style: \"percent\",\n maximumFractionDigits: 1,\n});\n\nexport function formatShare(share: number): string {\n return PERCENT_LABEL.format(share);\n}\n\nfunction formatValue(input: PieChartOptionInput, value: number): string {\n return input.valueFormatter ? input.valueFormatter(value) : String(value);\n}\n\nfunction escapeHtml(text: string): string {\n return text\n .replace(/&/g, \"&\")\n .replace(/</g, \"<\")\n .replace(/>/g, \">\")\n .replace(/\"/g, \""\");\n}\n\nfunction labelText(input: PieChartOptionInput, slice: PieSlice): string {\n const parts: string[] = [];\n if (input.labelContent.includes(\"name\")) parts.push(slice.name);\n if (input.labelContent.includes(\"percent\")) parts.push(formatShare(slice.share));\n if (input.labelContent.includes(\"value\")) parts.push(formatValue(input, slice.value));\n return parts.join(\" \");\n}\n\nfunction tooltipHtml(input: PieChartOptionInput, slice: PieSlice): string {\n const path: string = escapeHtml(slice.path.join(PATH_SEPARATOR));\n const value: string = escapeHtml(formatValue(input, slice.value));\n return `<div>${path}</div><div><b>${value}</b> · ${formatShare(slice.share)}</div>`;\n}\n\ninterface DataItem {\n id: string;\n name: string;\n value: number;\n itemStyle: { color: string };\n label?: { color: string };\n labelText: string;\n tooltip: string;\n children?: DataItem[];\n}\n\nfunction toDataItem(input: PieChartOptionInput, slice: PieSlice, withChildren: boolean): DataItem {\n return {\n id: slice.id,\n name: slice.name,\n value: slice.value,\n itemStyle: { color: slice.color },\n label: { color: labelColorOnFill(slice.color) },\n labelText: labelText(input, slice),\n tooltip: tooltipHtml(input, slice),\n children: withChildren\n ? slice.children.map((child: PieSlice) => toDataItem(input, child, true))\n : undefined,\n };\n}\n\nfunction tooltipOption(input: PieChartOptionInput): Record<string, unknown> {\n const { theme } = input;\n return {\n trigger: \"item\",\n backgroundColor: theme.tooltipBackgroundColor,\n borderColor: theme.tooltipBorderColor,\n textStyle: { color: theme.labelColor },\n formatter: (params: { data: DataItem }) => params.data.tooltip,\n };\n}\n\nfunction labelFormatter(params: { data: DataItem }): string {\n return params.data.labelText;\n}\n\nfunction holeRadiusPercent(input: PieChartOptionInput): number {\n return input.shape === \"pie\" ? 0 : DONUT_HOLE_RADIUS_PERCENT;\n}\n\nfunction pieRadius(input: PieChartOptionInput): [string, string] {\n if (input.shape === \"pie\") return [\"0%\", `${FULL_PIE_OUTER_RADIUS_PERCENT}%`];\n return [\n `${DONUT_HOLE_RADIUS_PERCENT}%`,\n `${DONUT_HOLE_RADIUS_PERCENT + RING_THICKNESS_PERCENT}%`,\n ];\n}\n\nfunction pieLabel(input: PieChartOptionInput): Record<string, unknown> {\n const show: boolean = input.labelContent.length > 0;\n if (input.shape === \"pie\") {\n return { show, position: \"inside\", formatter: labelFormatter };\n }\n return { show, position: \"outside\", color: input.theme.labelColor, formatter: labelFormatter };\n}\n\nfunction pieSeries(input: PieChartOptionInput): Record<string, unknown> {\n const isFullPie: boolean = input.shape === \"pie\";\n return {\n type: \"pie\",\n radius: pieRadius(input),\n data: input.slices.map((slice: PieSlice) => {\n const { label: fillLabel, ...item } = toDataItem(input, slice, false);\n return isFullPie ? { ...item, label: fillLabel } : item;\n }),\n itemStyle: { borderColor: input.theme.tooltipBackgroundColor, borderWidth: RING_BORDER_WIDTH_PX },\n label: pieLabel(input),\n minShowLabelAngle: isFullPie ? MIN_INSIDE_LABEL_ANGLE_DEGREES : 0,\n labelLine: { show: !isFullPie && input.labelContent.length > 0 },\n labelLayout: { hideOverlap: true },\n emphasis: { scale: false },\n };\n}\n\nfunction sunburstLevels(input: PieChartOptionInput, depth: number): Array<Record<string, unknown>> {\n const hole: number = holeRadiusPercent(input);\n const evenThickness: number = (OUTER_RADIUS_LIMIT_PERCENT - hole) / depth;\n const thickness: number =\n input.shape === \"pie\" ? evenThickness : Math.min(RING_THICKNESS_PERCENT, evenThickness);\n const rings: Array<Record<string, unknown>> = Array.from(\n { length: depth },\n (_unused, ringIndex: number) => ({\n r0: `${hole + thickness * ringIndex}%`,\n r: `${hole + thickness * (ringIndex + 1)}%`,\n }),\n );\n return [{}, ...rings];\n}\n\nfunction sunburstSeries(input: PieChartOptionInput): Record<string, unknown> {\n const hasLabels: boolean = input.labelContent.length > 0;\n return {\n type: \"sunburst\",\n nodeClick: false,\n sort: null,\n radius: [`${holeRadiusPercent(input)}%`, `${OUTER_RADIUS_LIMIT_PERCENT}%`],\n data: input.slices.map((slice: PieSlice) => toDataItem(input, slice, true)),\n levels: sunburstLevels(input, sliceDepth(input.slices)),\n itemStyle: { borderColor: input.theme.tooltipBackgroundColor, borderWidth: RING_BORDER_WIDTH_PX },\n label: {\n show: hasLabels,\n rotate: \"radial\",\n minAngle: MIN_LABELED_ANGLE_DEGREES,\n formatter: labelFormatter,\n },\n emphasis: { focus: \"none\" },\n };\n}\n\nfunction isHierarchical(slices: PieSlice[]): boolean {\n return slices.some((slice: PieSlice) => slice.children.length > 0);\n}\n\nexport function buildPieChartOption(input: PieChartOptionInput): Record<string, unknown> {\n const { theme } = input;\n return {\n animation: false,\n textStyle: { fontFamily: theme.fontFamily, color: theme.labelColor },\n tooltip: tooltipOption(input),\n series: [isHierarchical(input.slices) ? sunburstSeries(input) : pieSeries(input)],\n };\n}\n"],"names":["DONUT_HOLE_RADIUS_PERCENT","FULL_PIE_OUTER_RADIUS_PERCENT","MIN_INSIDE_LABEL_ANGLE_DEGREES","RING_THICKNESS_PERCENT","OUTER_RADIUS_LIMIT_PERCENT","PATH_SEPARATOR","MIN_LABELED_ANGLE_DEGREES","RING_BORDER_WIDTH_PX","PERCENT_LABEL","formatShare","share","formatValue","input","value","escapeHtml","text","labelText","slice","parts","tooltipHtml","path","toDataItem","withChildren","labelColorOnFill","child","tooltipOption","theme","params","labelFormatter","holeRadiusPercent","pieRadius","pieLabel","show","pieSeries","isFullPie","fillLabel","item","sunburstLevels","depth","hole","evenThickness","thickness","rings","_unused","ringIndex","sunburstSeries","hasLabels","sliceDepth","isHierarchical","slices","buildPieChartOption"],"mappings":"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"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const v=require("../chart-color-tone.cjs"),O=.22;function S(e){return e!==null&&Number.isFinite(e)&&e>0}function N(e){return e.reduce((r,t)=>r+(t.value??0),0)}function P(e){return e.filter(r=>S(r.value))}function s(e,r){return e.name===""?r:e.name}function y(e,r,t){return r===void 0?t.colorsByRootId[e.id]??t.fallbackColor:e.isOthers?t.fallbackColor:v.lightenColor(r,O)}function a(e,r,t,n){const l=P(e),m=N(l);return l.map(i=>{const b=i.isOthers===!0,o=s(i,n.othersName),c=[...r,o],u=y(i,t,n);return{id:i.id,name:o,value:i.value,share:i.value/m,path:c,color:u,isOthers:b,children:a(i.children??[],c,u,n)}})}function T(e){return a(e.nodes,[],void 0,e)}function f(e,r){for(const t of e){if(t.id===r)return t;const n=f(t.children,r);if(n)return n}}function d(e,r){for(const t of e){if(t.children.some(l=>l.id===r))return t;const n=d(t.children,r);if(n)return n}}function h(e){return e.length===0?0:1+Math.max(...e.map(r=>h(r.children)))}function g(e){return e.reduce((r,t)=>r+t.value,0)}exports.buildPieSlices=T;exports.displayNameOf=s;exports.findParentSlice=d;exports.findSlice=f;exports.sliceDepth=h;exports.totalOf=g;
|
|
2
|
+
//# sourceMappingURL=pie-chart-slices.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"pie-chart-slices.cjs","sources":["../../../../../../src/ui/components/charts/PieChart/pie-chart-slices.ts"],"sourcesContent":["import { lightenColor } from \"../chart-color-tone\";\n\nexport interface PieChartNode {\n id: string;\n name: string;\n value: number | null;\n // Nome de token, nunca hex, e só do primeiro nível: os filhos herdam o tom do pai.\n colorToken?: string;\n isOthers?: boolean;\n children?: PieChartNode[];\n}\n\nexport interface PieSlice {\n id: string;\n name: string;\n value: number;\n share: number;\n path: string[];\n color: string;\n isOthers: boolean;\n children: PieSlice[];\n}\n\nexport interface BuildPieSlicesInput {\n nodes: PieChartNode[];\n colorsByRootId: Record<string, string>;\n fallbackColor: string;\n othersName: string;\n}\n\nconst CHILD_LIGHTEN_STEP: number = 0.22;\n\nfunction isDrawableValue(value: number | null): value is number {\n return value !== null && Number.isFinite(value) && value > 0;\n}\n\nfunction sumValues(nodes: PieChartNode[]): number {\n return nodes.reduce((total: number, node: PieChartNode) => total + (node.value ?? 0), 0);\n}\n\nfunction drawableNodes(nodes: PieChartNode[]): PieChartNode[] {\n return nodes.filter((node: PieChartNode) => isDrawableValue(node.value));\n}\n\nexport function displayNameOf(node: PieChartNode, othersName: string): string {\n return node.name === \"\" ? othersName : node.name;\n}\n\nfunction colorOf(\n node: PieChartNode,\n parentColor: string | undefined,\n input: BuildPieSlicesInput,\n): string {\n if (parentColor === undefined) return input.colorsByRootId[node.id] ?? input.fallbackColor;\n if (node.isOthers) return input.fallbackColor;\n return lightenColor(parentColor, CHILD_LIGHTEN_STEP);\n}\n\nfunction buildLevel(\n nodes: PieChartNode[],\n parentPath: string[],\n parentColor: string | undefined,\n input: BuildPieSlicesInput,\n): PieSlice[] {\n const drawable: PieChartNode[] = drawableNodes(nodes);\n const levelTotal: number = sumValues(drawable);\n return drawable.map((node: PieChartNode): PieSlice => {\n const isOthers: boolean = node.isOthers === true;\n const name: string = displayNameOf(node, input.othersName);\n const path: string[] = [...parentPath, name];\n const color: string = colorOf(node, parentColor, input);\n return {\n id: node.id,\n name,\n value: node.value as number,\n share: (node.value as number) / levelTotal,\n path,\n color,\n isOthers,\n children: buildLevel(node.children ?? [], path, color, input),\n };\n });\n}\n\nexport function buildPieSlices(input: BuildPieSlicesInput): PieSlice[] {\n return buildLevel(input.nodes, [], undefined, input);\n}\n\nexport function findSlice(slices: PieSlice[], id: string): PieSlice | undefined {\n for (const slice of slices) {\n if (slice.id === id) return slice;\n const nested: PieSlice | undefined = findSlice(slice.children, id);\n if (nested) return nested;\n }\n return undefined;\n}\n\nexport function findParentSlice(slices: PieSlice[], id: string): PieSlice | undefined {\n for (const slice of slices) {\n if (slice.children.some((child: PieSlice) => child.id === id)) return slice;\n const nested: PieSlice | undefined = findParentSlice(slice.children, id);\n if (nested) return nested;\n }\n return undefined;\n}\n\nexport function sliceDepth(slices: PieSlice[]): number {\n if (slices.length === 0) return 0;\n return 1 + Math.max(...slices.map((slice: PieSlice) => sliceDepth(slice.children)));\n}\n\nexport function totalOf(slices: PieSlice[]): number {\n return slices.reduce((total: number, slice: PieSlice) => total + slice.value, 0);\n}\n"],"names":["CHILD_LIGHTEN_STEP","isDrawableValue","value","sumValues","nodes","total","node","drawableNodes","displayNameOf","othersName","colorOf","parentColor","input","lightenColor","buildLevel","parentPath","drawable","levelTotal","isOthers","name","path","color","buildPieSlices","findSlice","slices","id","slice","nested","findParentSlice","child","sliceDepth","totalOf"],"mappings":"2HA8BMA,EAA6B,IAEnC,SAASC,EAAgBC,EAAuC,CAC9D,OAAOA,IAAU,MAAQ,OAAO,SAASA,CAAK,GAAKA,EAAQ,CAC7D,CAEA,SAASC,EAAUC,EAA+B,CAChD,OAAOA,EAAM,OAAO,CAACC,EAAeC,IAAuBD,GAASC,EAAK,OAAS,GAAI,CAAC,CACzF,CAEA,SAASC,EAAcH,EAAuC,CAC5D,OAAOA,EAAM,OAAQE,GAAuBL,EAAgBK,EAAK,KAAK,CAAC,CACzE,CAEO,SAASE,EAAcF,EAAoBG,EAA4B,CAC5E,OAAOH,EAAK,OAAS,GAAKG,EAAaH,EAAK,IAC9C,CAEA,SAASI,EACPJ,EACAK,EACAC,EACQ,CACR,OAAID,IAAgB,OAAkBC,EAAM,eAAeN,EAAK,EAAE,GAAKM,EAAM,cACzEN,EAAK,SAAiBM,EAAM,cACzBC,EAAAA,aAAaF,EAAaX,CAAkB,CACrD,CAEA,SAASc,EACPV,EACAW,EACAJ,EACAC,EACY,CACZ,MAAMI,EAA2BT,EAAcH,CAAK,EAC9Ca,EAAqBd,EAAUa,CAAQ,EAC7C,OAAOA,EAAS,IAAKV,GAAiC,CACpD,MAAMY,EAAoBZ,EAAK,WAAa,GACtCa,EAAeX,EAAcF,EAAMM,EAAM,UAAU,EACnDQ,EAAiB,CAAC,GAAGL,EAAYI,CAAI,EACrCE,EAAgBX,EAAQJ,EAAMK,EAAaC,CAAK,EACtD,MAAO,CACL,GAAIN,EAAK,GACT,KAAAa,EACA,MAAOb,EAAK,MACZ,MAAQA,EAAK,MAAmBW,EAChC,KAAAG,EACA,MAAAC,EACA,SAAAH,EACA,SAAUJ,EAAWR,EAAK,UAAY,CAAA,EAAIc,EAAMC,EAAOT,CAAK,CAAA,CAEhE,CAAC,CACH,CAEO,SAASU,EAAeV,EAAwC,CACrE,OAAOE,EAAWF,EAAM,MAAO,CAAA,EAAI,OAAWA,CAAK,CACrD,CAEO,SAASW,EAAUC,EAAoBC,EAAkC,CAC9E,UAAWC,KAASF,EAAQ,CAC1B,GAAIE,EAAM,KAAOD,EAAI,OAAOC,EAC5B,MAAMC,EAA+BJ,EAAUG,EAAM,SAAUD,CAAE,EACjE,GAAIE,EAAQ,OAAOA,CACrB,CAEF,CAEO,SAASC,EAAgBJ,EAAoBC,EAAkC,CACpF,UAAWC,KAASF,EAAQ,CAC1B,GAAIE,EAAM,SAAS,KAAMG,GAAoBA,EAAM,KAAOJ,CAAE,EAAG,OAAOC,EACtE,MAAMC,EAA+BC,EAAgBF,EAAM,SAAUD,CAAE,EACvE,GAAIE,EAAQ,OAAOA,CACrB,CAEF,CAEO,SAASG,EAAWN,EAA4B,CACrD,OAAIA,EAAO,SAAW,EAAU,EACzB,EAAI,KAAK,IAAI,GAAGA,EAAO,IAAKE,GAAoBI,EAAWJ,EAAM,QAAQ,CAAC,CAAC,CACpF,CAEO,SAASK,EAAQP,EAA4B,CAClD,OAAOA,EAAO,OAAO,CAACnB,EAAeqB,IAAoBrB,EAAQqB,EAAM,MAAO,CAAC,CACjF"}
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
import { lightenColor as d } from "../chart-color-tone.js";
|
|
2
|
+
const h = 0.22;
|
|
3
|
+
function m(r) {
|
|
4
|
+
return r !== null && Number.isFinite(r) && r > 0;
|
|
5
|
+
}
|
|
6
|
+
function v(r) {
|
|
7
|
+
return r.reduce((e, n) => e + (n.value ?? 0), 0);
|
|
8
|
+
}
|
|
9
|
+
function b(r) {
|
|
10
|
+
return r.filter((e) => m(e.value));
|
|
11
|
+
}
|
|
12
|
+
function O(r, e) {
|
|
13
|
+
return r.name === "" ? e : r.name;
|
|
14
|
+
}
|
|
15
|
+
function N(r, e, n) {
|
|
16
|
+
return e === void 0 ? n.colorsByRootId[r.id] ?? n.fallbackColor : r.isOthers ? n.fallbackColor : d(e, h);
|
|
17
|
+
}
|
|
18
|
+
function s(r, e, n, t) {
|
|
19
|
+
const o = b(r), f = v(o);
|
|
20
|
+
return o.map((i) => {
|
|
21
|
+
const a = i.isOthers === !0, l = O(i, t.othersName), c = [...e, l], u = N(i, n, t);
|
|
22
|
+
return {
|
|
23
|
+
id: i.id,
|
|
24
|
+
name: l,
|
|
25
|
+
value: i.value,
|
|
26
|
+
share: i.value / f,
|
|
27
|
+
path: c,
|
|
28
|
+
color: u,
|
|
29
|
+
isOthers: a,
|
|
30
|
+
children: s(i.children ?? [], c, u, t)
|
|
31
|
+
};
|
|
32
|
+
});
|
|
33
|
+
}
|
|
34
|
+
function I(r) {
|
|
35
|
+
return s(r.nodes, [], void 0, r);
|
|
36
|
+
}
|
|
37
|
+
function S(r, e) {
|
|
38
|
+
for (const n of r) {
|
|
39
|
+
if (n.id === e) return n;
|
|
40
|
+
const t = S(n.children, e);
|
|
41
|
+
if (t) return t;
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
function w(r, e) {
|
|
45
|
+
for (const n of r) {
|
|
46
|
+
if (n.children.some((o) => o.id === e)) return n;
|
|
47
|
+
const t = w(n.children, e);
|
|
48
|
+
if (t) return t;
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
function C(r) {
|
|
52
|
+
return r.length === 0 ? 0 : 1 + Math.max(...r.map((e) => C(e.children)));
|
|
53
|
+
}
|
|
54
|
+
function L(r) {
|
|
55
|
+
return r.reduce((e, n) => e + n.value, 0);
|
|
56
|
+
}
|
|
57
|
+
export {
|
|
58
|
+
I as buildPieSlices,
|
|
59
|
+
O as displayNameOf,
|
|
60
|
+
w as findParentSlice,
|
|
61
|
+
S as findSlice,
|
|
62
|
+
C as sliceDepth,
|
|
63
|
+
L as totalOf
|
|
64
|
+
};
|
|
65
|
+
//# sourceMappingURL=pie-chart-slices.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"pie-chart-slices.js","sources":["../../../../../../src/ui/components/charts/PieChart/pie-chart-slices.ts"],"sourcesContent":["import { lightenColor } from \"../chart-color-tone\";\n\nexport interface PieChartNode {\n id: string;\n name: string;\n value: number | null;\n // Nome de token, nunca hex, e só do primeiro nível: os filhos herdam o tom do pai.\n colorToken?: string;\n isOthers?: boolean;\n children?: PieChartNode[];\n}\n\nexport interface PieSlice {\n id: string;\n name: string;\n value: number;\n share: number;\n path: string[];\n color: string;\n isOthers: boolean;\n children: PieSlice[];\n}\n\nexport interface BuildPieSlicesInput {\n nodes: PieChartNode[];\n colorsByRootId: Record<string, string>;\n fallbackColor: string;\n othersName: string;\n}\n\nconst CHILD_LIGHTEN_STEP: number = 0.22;\n\nfunction isDrawableValue(value: number | null): value is number {\n return value !== null && Number.isFinite(value) && value > 0;\n}\n\nfunction sumValues(nodes: PieChartNode[]): number {\n return nodes.reduce((total: number, node: PieChartNode) => total + (node.value ?? 0), 0);\n}\n\nfunction drawableNodes(nodes: PieChartNode[]): PieChartNode[] {\n return nodes.filter((node: PieChartNode) => isDrawableValue(node.value));\n}\n\nexport function displayNameOf(node: PieChartNode, othersName: string): string {\n return node.name === \"\" ? othersName : node.name;\n}\n\nfunction colorOf(\n node: PieChartNode,\n parentColor: string | undefined,\n input: BuildPieSlicesInput,\n): string {\n if (parentColor === undefined) return input.colorsByRootId[node.id] ?? input.fallbackColor;\n if (node.isOthers) return input.fallbackColor;\n return lightenColor(parentColor, CHILD_LIGHTEN_STEP);\n}\n\nfunction buildLevel(\n nodes: PieChartNode[],\n parentPath: string[],\n parentColor: string | undefined,\n input: BuildPieSlicesInput,\n): PieSlice[] {\n const drawable: PieChartNode[] = drawableNodes(nodes);\n const levelTotal: number = sumValues(drawable);\n return drawable.map((node: PieChartNode): PieSlice => {\n const isOthers: boolean = node.isOthers === true;\n const name: string = displayNameOf(node, input.othersName);\n const path: string[] = [...parentPath, name];\n const color: string = colorOf(node, parentColor, input);\n return {\n id: node.id,\n name,\n value: node.value as number,\n share: (node.value as number) / levelTotal,\n path,\n color,\n isOthers,\n children: buildLevel(node.children ?? [], path, color, input),\n };\n });\n}\n\nexport function buildPieSlices(input: BuildPieSlicesInput): PieSlice[] {\n return buildLevel(input.nodes, [], undefined, input);\n}\n\nexport function findSlice(slices: PieSlice[], id: string): PieSlice | undefined {\n for (const slice of slices) {\n if (slice.id === id) return slice;\n const nested: PieSlice | undefined = findSlice(slice.children, id);\n if (nested) return nested;\n }\n return undefined;\n}\n\nexport function findParentSlice(slices: PieSlice[], id: string): PieSlice | undefined {\n for (const slice of slices) {\n if (slice.children.some((child: PieSlice) => child.id === id)) return slice;\n const nested: PieSlice | undefined = findParentSlice(slice.children, id);\n if (nested) return nested;\n }\n return undefined;\n}\n\nexport function sliceDepth(slices: PieSlice[]): number {\n if (slices.length === 0) return 0;\n return 1 + Math.max(...slices.map((slice: PieSlice) => sliceDepth(slice.children)));\n}\n\nexport function totalOf(slices: PieSlice[]): number {\n return slices.reduce((total: number, slice: PieSlice) => total + slice.value, 0);\n}\n"],"names":["CHILD_LIGHTEN_STEP","isDrawableValue","value","sumValues","nodes","total","node","drawableNodes","displayNameOf","othersName","colorOf","parentColor","input","lightenColor","buildLevel","parentPath","drawable","levelTotal","isOthers","name","path","color","buildPieSlices","findSlice","slices","id","slice","nested","findParentSlice","child","sliceDepth","totalOf"],"mappings":";AA8BA,MAAMA,IAA6B;AAEnC,SAASC,EAAgBC,GAAuC;AAC9D,SAAOA,MAAU,QAAQ,OAAO,SAASA,CAAK,KAAKA,IAAQ;AAC7D;AAEA,SAASC,EAAUC,GAA+B;AAChD,SAAOA,EAAM,OAAO,CAACC,GAAeC,MAAuBD,KAASC,EAAK,SAAS,IAAI,CAAC;AACzF;AAEA,SAASC,EAAcH,GAAuC;AAC5D,SAAOA,EAAM,OAAO,CAACE,MAAuBL,EAAgBK,EAAK,KAAK,CAAC;AACzE;AAEO,SAASE,EAAcF,GAAoBG,GAA4B;AAC5E,SAAOH,EAAK,SAAS,KAAKG,IAAaH,EAAK;AAC9C;AAEA,SAASI,EACPJ,GACAK,GACAC,GACQ;AACR,SAAID,MAAgB,SAAkBC,EAAM,eAAeN,EAAK,EAAE,KAAKM,EAAM,gBACzEN,EAAK,WAAiBM,EAAM,gBACzBC,EAAaF,GAAaX,CAAkB;AACrD;AAEA,SAASc,EACPV,GACAW,GACAJ,GACAC,GACY;AACZ,QAAMI,IAA2BT,EAAcH,CAAK,GAC9Ca,IAAqBd,EAAUa,CAAQ;AAC7C,SAAOA,EAAS,IAAI,CAACV,MAAiC;AACpD,UAAMY,IAAoBZ,EAAK,aAAa,IACtCa,IAAeX,EAAcF,GAAMM,EAAM,UAAU,GACnDQ,IAAiB,CAAC,GAAGL,GAAYI,CAAI,GACrCE,IAAgBX,EAAQJ,GAAMK,GAAaC,CAAK;AACtD,WAAO;AAAA,MACL,IAAIN,EAAK;AAAA,MACT,MAAAa;AAAA,MACA,OAAOb,EAAK;AAAA,MACZ,OAAQA,EAAK,QAAmBW;AAAA,MAChC,MAAAG;AAAA,MACA,OAAAC;AAAA,MACA,UAAAH;AAAA,MACA,UAAUJ,EAAWR,EAAK,YAAY,CAAA,GAAIc,GAAMC,GAAOT,CAAK;AAAA,IAAA;AAAA,EAEhE,CAAC;AACH;AAEO,SAASU,EAAeV,GAAwC;AACrE,SAAOE,EAAWF,EAAM,OAAO,CAAA,GAAI,QAAWA,CAAK;AACrD;AAEO,SAASW,EAAUC,GAAoBC,GAAkC;AAC9E,aAAWC,KAASF,GAAQ;AAC1B,QAAIE,EAAM,OAAOD,EAAI,QAAOC;AAC5B,UAAMC,IAA+BJ,EAAUG,EAAM,UAAUD,CAAE;AACjE,QAAIE,EAAQ,QAAOA;AAAA,EACrB;AAEF;AAEO,SAASC,EAAgBJ,GAAoBC,GAAkC;AACpF,aAAWC,KAASF,GAAQ;AAC1B,QAAIE,EAAM,SAAS,KAAK,CAACG,MAAoBA,EAAM,OAAOJ,CAAE,EAAG,QAAOC;AACtE,UAAMC,IAA+BC,EAAgBF,EAAM,UAAUD,CAAE;AACvE,QAAIE,EAAQ,QAAOA;AAAA,EACrB;AAEF;AAEO,SAASG,EAAWN,GAA4B;AACrD,SAAIA,EAAO,WAAW,IAAU,IACzB,IAAI,KAAK,IAAI,GAAGA,EAAO,IAAI,CAACE,MAAoBI,EAAWJ,EAAM,QAAQ,CAAC,CAAC;AACpF;AAEO,SAASK,EAAQP,GAA4B;AAClD,SAAOA,EAAO,OAAO,CAACnB,GAAeqB,MAAoBrB,IAAQqB,EAAM,OAAO,CAAC;AACjF;"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("./chart-label-color.cjs"),a=255;function i(e,n){const r=u.parseColorChannels(e);if(!r)return e;const[o,l,s]=r.map(t=>Math.round(t+(a-t)*n));return`rgb(${o}, ${l}, ${s})`}exports.lightenColor=i;
|
|
2
|
+
//# sourceMappingURL=chart-color-tone.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"chart-color-tone.cjs","sources":["../../../../../src/ui/components/charts/chart-color-tone.ts"],"sourcesContent":["import { parseColorChannels } from \"./chart-label-color\";\n\nconst MAX_CHANNEL: number = 255;\n\nexport function lightenColor(color: string, amount: number): string {\n const channels: [number, number, number] | undefined = parseColorChannels(color);\n if (!channels) return color;\n const [red, green, blue] = channels.map((channel: number) =>\n Math.round(channel + (MAX_CHANNEL - channel) * amount),\n );\n return `rgb(${red}, ${green}, ${blue})`;\n}\n"],"names":["MAX_CHANNEL","lightenColor","color","amount","channels","parseColorChannels","red","green","blue","channel"],"mappings":"2HAEMA,EAAsB,IAErB,SAASC,EAAaC,EAAeC,EAAwB,CAClE,MAAMC,EAAiDC,EAAAA,mBAAmBH,CAAK,EAC/E,GAAI,CAACE,EAAU,OAAOF,EACtB,KAAM,CAACI,EAAKC,EAAOC,CAAI,EAAIJ,EAAS,IAAKK,GACvC,KAAK,MAAMA,GAAWT,EAAcS,GAAWN,CAAM,CAAA,EAEvD,MAAO,OAAOG,CAAG,KAAKC,CAAK,KAAKC,CAAI,GACtC"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { parseColorChannels as a } from "./chart-label-color.js";
|
|
2
|
+
const i = 255;
|
|
3
|
+
function p(r, o) {
|
|
4
|
+
const n = a(r);
|
|
5
|
+
if (!n) return r;
|
|
6
|
+
const [t, s, u] = n.map(
|
|
7
|
+
(e) => Math.round(e + (i - e) * o)
|
|
8
|
+
);
|
|
9
|
+
return `rgb(${t}, ${s}, ${u})`;
|
|
10
|
+
}
|
|
11
|
+
export {
|
|
12
|
+
p as lightenColor
|
|
13
|
+
};
|
|
14
|
+
//# sourceMappingURL=chart-color-tone.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"chart-color-tone.js","sources":["../../../../../src/ui/components/charts/chart-color-tone.ts"],"sourcesContent":["import { parseColorChannels } from \"./chart-label-color\";\n\nconst MAX_CHANNEL: number = 255;\n\nexport function lightenColor(color: string, amount: number): string {\n const channels: [number, number, number] | undefined = parseColorChannels(color);\n if (!channels) return color;\n const [red, green, blue] = channels.map((channel: number) =>\n Math.round(channel + (MAX_CHANNEL - channel) * amount),\n );\n return `rgb(${red}, ${green}, ${blue})`;\n}\n"],"names":["MAX_CHANNEL","lightenColor","color","amount","channels","parseColorChannels","red","green","blue","channel"],"mappings":";AAEA,MAAMA,IAAsB;AAErB,SAASC,EAAaC,GAAeC,GAAwB;AAClE,QAAMC,IAAiDC,EAAmBH,CAAK;AAC/E,MAAI,CAACE,EAAU,QAAOF;AACtB,QAAM,CAACI,GAAKC,GAAOC,CAAI,IAAIJ,EAAS;AAAA,IAAI,CAACK,MACvC,KAAK,MAAMA,KAAWT,IAAcS,KAAWN,CAAM;AAAA,EAAA;AAEvD,SAAO,OAAOG,CAAG,KAAKC,CAAK,KAAKC,CAAI;AACtC;"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i="#ffffff",l="#1e1e1e",u=.0144,L=1;function f(t){const n=t/255;return n<=.03928?n/12.92:Math.pow((n+.055)/1.055,2.4)}function s(t){const n=t.trim().match(/^#([0-9a-f]{3}|[0-9a-f]{6})$/i);if(n){const r=n[1],o=r.length===3?r.split("").map(a=>a+a).join(""):r;return[0,2,4].map(a=>parseInt(o.slice(a,a+2),16))}const e=t.trim().match(/^rgba?\(\s*(\d+)[\s,]+(\d+)[\s,]+(\d+)/i);if(e)return[Number(e[1]),Number(e[2]),Number(e[3])]}function m(t){const n=s(t);if(!n)return;const[e,r,o]=n.map(f);return .2126*e+.7152*r+.0722*o}function c(t,n){return(t+.05)/(n+.05)}function d(t){const n=m(t);if(n===void 0)return i;const e=c(L,n);return c(n,u)>=e?l:i}exports.labelColorOnFill=d;exports.parseColorChannels=s;
|
|
2
|
+
//# sourceMappingURL=chart-label-color.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"chart-label-color.cjs","sources":["../../../../../src/ui/components/charts/chart-label-color.ts"],"sourcesContent":["// O rótulo dentro da fatia é lido contra a cor da série, não contra o fundo da página: a paleta\n// de séries é a mesma nos dois temas, então quem decide entre texto claro e escuro é o\n// preenchimento. O branco que o ECharts usa por padrão reprova no contraste em toda a paleta —\n// 2,24:1 sobre a `yellow-500`.\nconst LABEL_ON_DARK_FILL: string = \"#ffffff\";\n\nconst LABEL_ON_LIGHT_FILL: string = \"#1e1e1e\";\n\nconst LABEL_ON_LIGHT_FILL_LUMINANCE: number = 0.0144;\n\nconst WHITE_LUMINANCE: number = 1;\n\nfunction channelLuminance(channel: number): number {\n const normalized: number = channel / 255;\n return normalized <= 0.03928\n ? normalized / 12.92\n : Math.pow((normalized + 0.055) / 1.055, 2.4);\n}\n\nexport function parseColorChannels(color: string): [number, number, number] | undefined {\n const hexMatch: RegExpMatchArray | null = color\n .trim()\n .match(/^#([0-9a-f]{3}|[0-9a-f]{6})$/i);\n if (hexMatch) {\n const digits: string = hexMatch[1];\n const expanded: string =\n digits.length === 3\n ? digits\n .split(\"\")\n .map((digit: string) => digit + digit)\n .join(\"\")\n : digits;\n return [0, 2, 4].map((start: number) => parseInt(expanded.slice(start, start + 2), 16)) as [\n number,\n number,\n number,\n ];\n }\n\n const rgbMatch: RegExpMatchArray | null = color\n .trim()\n .match(/^rgba?\\(\\s*(\\d+)[\\s,]+(\\d+)[\\s,]+(\\d+)/i);\n if (rgbMatch) {\n return [Number(rgbMatch[1]), Number(rgbMatch[2]), Number(rgbMatch[3])];\n }\n\n return undefined;\n}\n\nfunction relativeLuminance(color: string): number | undefined {\n const channels: [number, number, number] | undefined = parseColorChannels(color);\n if (!channels) return undefined;\n const [red, green, blue] = channels.map(channelLuminance);\n return 0.2126 * red + 0.7152 * green + 0.0722 * blue;\n}\n\nfunction contrastRatio(lighter: number, darker: number): number {\n return (lighter + 0.05) / (darker + 0.05);\n}\n\nexport function labelColorOnFill(fillColor: string): string {\n const luminance: number | undefined = relativeLuminance(fillColor);\n if (luminance === undefined) return LABEL_ON_DARK_FILL;\n const againstLightText: number = contrastRatio(WHITE_LUMINANCE, luminance);\n const againstDarkText: number = contrastRatio(luminance, LABEL_ON_LIGHT_FILL_LUMINANCE);\n return againstDarkText >= againstLightText ? LABEL_ON_LIGHT_FILL : LABEL_ON_DARK_FILL;\n}\n"],"names":["LABEL_ON_DARK_FILL","LABEL_ON_LIGHT_FILL","LABEL_ON_LIGHT_FILL_LUMINANCE","WHITE_LUMINANCE","channelLuminance","channel","normalized","parseColorChannels","color","hexMatch","digits","expanded","digit","start","rgbMatch","relativeLuminance","channels","red","green","blue","contrastRatio","lighter","darker","labelColorOnFill","fillColor","luminance","againstLightText"],"mappings":"gFAIA,MAAMA,EAA6B,UAE7BC,EAA8B,UAE9BC,EAAwC,MAExCC,EAA0B,EAEhC,SAASC,EAAiBC,EAAyB,CACjD,MAAMC,EAAqBD,EAAU,IACrC,OAAOC,GAAc,OACjBA,EAAa,MACb,KAAK,KAAKA,EAAa,MAAS,MAAO,GAAG,CAChD,CAEO,SAASC,EAAmBC,EAAqD,CACtF,MAAMC,EAAoCD,EACvC,KAAA,EACA,MAAM,+BAA+B,EACxC,GAAIC,EAAU,CACZ,MAAMC,EAAiBD,EAAS,CAAC,EAC3BE,EACJD,EAAO,SAAW,EACdA,EACG,MAAM,EAAE,EACR,IAAKE,GAAkBA,EAAQA,CAAK,EACpC,KAAK,EAAE,EACVF,EACN,MAAO,CAAC,EAAG,EAAG,CAAC,EAAE,IAAKG,GAAkB,SAASF,EAAS,MAAME,EAAOA,EAAQ,CAAC,EAAG,EAAE,CAAC,CAKxF,CAEA,MAAMC,EAAoCN,EACvC,KAAA,EACA,MAAM,yCAAyC,EAClD,GAAIM,EACF,MAAO,CAAC,OAAOA,EAAS,CAAC,CAAC,EAAG,OAAOA,EAAS,CAAC,CAAC,EAAG,OAAOA,EAAS,CAAC,CAAC,CAAC,CAIzE,CAEA,SAASC,EAAkBP,EAAmC,CAC5D,MAAMQ,EAAiDT,EAAmBC,CAAK,EAC/E,GAAI,CAACQ,EAAU,OACf,KAAM,CAACC,EAAKC,EAAOC,CAAI,EAAIH,EAAS,IAAIZ,CAAgB,EACxD,MAAO,OAASa,EAAM,MAASC,EAAQ,MAASC,CAClD,CAEA,SAASC,EAAcC,EAAiBC,EAAwB,CAC9D,OAAQD,EAAU,MAASC,EAAS,IACtC,CAEO,SAASC,EAAiBC,EAA2B,CAC1D,MAAMC,EAAgCV,EAAkBS,CAAS,EACjE,GAAIC,IAAc,OAAW,OAAOzB,EACpC,MAAM0B,EAA2BN,EAAcjB,EAAiBsB,CAAS,EAEzE,OADgCL,EAAcK,EAAWvB,CAA6B,GAC5DwB,EAAmBzB,EAAsBD,CACrE"}
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
const o = "#ffffff", s = "#1e1e1e";
|
|
2
|
+
function L(t) {
|
|
3
|
+
const n = t / 255;
|
|
4
|
+
return n <= 0.03928 ? n / 12.92 : Math.pow((n + 0.055) / 1.055, 2.4);
|
|
5
|
+
}
|
|
6
|
+
function u(t) {
|
|
7
|
+
const n = t.trim().match(/^#([0-9a-f]{3}|[0-9a-f]{6})$/i);
|
|
8
|
+
if (n) {
|
|
9
|
+
const r = n[1], i = r.length === 3 ? r.split("").map((a) => a + a).join("") : r;
|
|
10
|
+
return [0, 2, 4].map((a) => parseInt(i.slice(a, a + 2), 16));
|
|
11
|
+
}
|
|
12
|
+
const e = t.trim().match(/^rgba?\(\s*(\d+)[\s,]+(\d+)[\s,]+(\d+)/i);
|
|
13
|
+
if (e)
|
|
14
|
+
return [Number(e[1]), Number(e[2]), Number(e[3])];
|
|
15
|
+
}
|
|
16
|
+
function f(t) {
|
|
17
|
+
const n = u(t);
|
|
18
|
+
if (!n) return;
|
|
19
|
+
const [e, r, i] = n.map(L);
|
|
20
|
+
return 0.2126 * e + 0.7152 * r + 0.0722 * i;
|
|
21
|
+
}
|
|
22
|
+
function c(t, n) {
|
|
23
|
+
return (t + 0.05) / (n + 0.05);
|
|
24
|
+
}
|
|
25
|
+
function _(t) {
|
|
26
|
+
const n = f(t);
|
|
27
|
+
if (n === void 0) return o;
|
|
28
|
+
const e = c(1, n);
|
|
29
|
+
return c(n, 0.0144) >= e ? s : o;
|
|
30
|
+
}
|
|
31
|
+
export {
|
|
32
|
+
_ as labelColorOnFill,
|
|
33
|
+
u as parseColorChannels
|
|
34
|
+
};
|
|
35
|
+
//# sourceMappingURL=chart-label-color.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"chart-label-color.js","sources":["../../../../../src/ui/components/charts/chart-label-color.ts"],"sourcesContent":["// O rótulo dentro da fatia é lido contra a cor da série, não contra o fundo da página: a paleta\n// de séries é a mesma nos dois temas, então quem decide entre texto claro e escuro é o\n// preenchimento. O branco que o ECharts usa por padrão reprova no contraste em toda a paleta —\n// 2,24:1 sobre a `yellow-500`.\nconst LABEL_ON_DARK_FILL: string = \"#ffffff\";\n\nconst LABEL_ON_LIGHT_FILL: string = \"#1e1e1e\";\n\nconst LABEL_ON_LIGHT_FILL_LUMINANCE: number = 0.0144;\n\nconst WHITE_LUMINANCE: number = 1;\n\nfunction channelLuminance(channel: number): number {\n const normalized: number = channel / 255;\n return normalized <= 0.03928\n ? normalized / 12.92\n : Math.pow((normalized + 0.055) / 1.055, 2.4);\n}\n\nexport function parseColorChannels(color: string): [number, number, number] | undefined {\n const hexMatch: RegExpMatchArray | null = color\n .trim()\n .match(/^#([0-9a-f]{3}|[0-9a-f]{6})$/i);\n if (hexMatch) {\n const digits: string = hexMatch[1];\n const expanded: string =\n digits.length === 3\n ? digits\n .split(\"\")\n .map((digit: string) => digit + digit)\n .join(\"\")\n : digits;\n return [0, 2, 4].map((start: number) => parseInt(expanded.slice(start, start + 2), 16)) as [\n number,\n number,\n number,\n ];\n }\n\n const rgbMatch: RegExpMatchArray | null = color\n .trim()\n .match(/^rgba?\\(\\s*(\\d+)[\\s,]+(\\d+)[\\s,]+(\\d+)/i);\n if (rgbMatch) {\n return [Number(rgbMatch[1]), Number(rgbMatch[2]), Number(rgbMatch[3])];\n }\n\n return undefined;\n}\n\nfunction relativeLuminance(color: string): number | undefined {\n const channels: [number, number, number] | undefined = parseColorChannels(color);\n if (!channels) return undefined;\n const [red, green, blue] = channels.map(channelLuminance);\n return 0.2126 * red + 0.7152 * green + 0.0722 * blue;\n}\n\nfunction contrastRatio(lighter: number, darker: number): number {\n return (lighter + 0.05) / (darker + 0.05);\n}\n\nexport function labelColorOnFill(fillColor: string): string {\n const luminance: number | undefined = relativeLuminance(fillColor);\n if (luminance === undefined) return LABEL_ON_DARK_FILL;\n const againstLightText: number = contrastRatio(WHITE_LUMINANCE, luminance);\n const againstDarkText: number = contrastRatio(luminance, LABEL_ON_LIGHT_FILL_LUMINANCE);\n return againstDarkText >= againstLightText ? LABEL_ON_LIGHT_FILL : LABEL_ON_DARK_FILL;\n}\n"],"names":["LABEL_ON_DARK_FILL","LABEL_ON_LIGHT_FILL","channelLuminance","channel","normalized","parseColorChannels","color","hexMatch","digits","expanded","digit","start","rgbMatch","relativeLuminance","channels","red","green","blue","contrastRatio","lighter","darker","labelColorOnFill","fillColor","luminance","againstLightText"],"mappings":"AAIA,MAAMA,IAA6B,WAE7BC,IAA8B;AAMpC,SAASC,EAAiBC,GAAyB;AACjD,QAAMC,IAAqBD,IAAU;AACrC,SAAOC,KAAc,UACjBA,IAAa,QACb,KAAK,KAAKA,IAAa,SAAS,OAAO,GAAG;AAChD;AAEO,SAASC,EAAmBC,GAAqD;AACtF,QAAMC,IAAoCD,EACvC,KAAA,EACA,MAAM,+BAA+B;AACxC,MAAIC,GAAU;AACZ,UAAMC,IAAiBD,EAAS,CAAC,GAC3BE,IACJD,EAAO,WAAW,IACdA,EACG,MAAM,EAAE,EACR,IAAI,CAACE,MAAkBA,IAAQA,CAAK,EACpC,KAAK,EAAE,IACVF;AACN,WAAO,CAAC,GAAG,GAAG,CAAC,EAAE,IAAI,CAACG,MAAkB,SAASF,EAAS,MAAME,GAAOA,IAAQ,CAAC,GAAG,EAAE,CAAC;AAAA,EAKxF;AAEA,QAAMC,IAAoCN,EACvC,KAAA,EACA,MAAM,yCAAyC;AAClD,MAAIM;AACF,WAAO,CAAC,OAAOA,EAAS,CAAC,CAAC,GAAG,OAAOA,EAAS,CAAC,CAAC,GAAG,OAAOA,EAAS,CAAC,CAAC,CAAC;AAIzE;AAEA,SAASC,EAAkBP,GAAmC;AAC5D,QAAMQ,IAAiDT,EAAmBC,CAAK;AAC/E,MAAI,CAACQ,EAAU;AACf,QAAM,CAACC,GAAKC,GAAOC,CAAI,IAAIH,EAAS,IAAIZ,CAAgB;AACxD,SAAO,SAASa,IAAM,SAASC,IAAQ,SAASC;AAClD;AAEA,SAASC,EAAcC,GAAiBC,GAAwB;AAC9D,UAAQD,IAAU,SAASC,IAAS;AACtC;AAEO,SAASC,EAAiBC,GAA2B;AAC1D,QAAMC,IAAgCV,EAAkBS,CAAS;AACjE,MAAIC,MAAc,OAAW,QAAOvB;AACpC,QAAMwB,IAA2BN,EAAc,GAAiBK,CAAS;AAEzE,SADgCL,EAAcK,GAAW,MAA6B,KAC5DC,IAAmBvB,IAAsBD;AACrE;"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=["--sds-color-blue-500","--sds-color-green-500","--sds-color-pink-500","--sds-color-yellow-500","--sds-color-red-500","--sds-color-blue-700","--sds-color-green-700","--sds-color-pink-700","--sds-color-yellow-700","--sds-color-red-700"];exports.CHART_SERIES_COLOR_TOKENS=o;
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=["--sds-color-blue-500","--sds-color-green-500","--sds-color-pink-500","--sds-color-yellow-500","--sds-color-red-500","--sds-color-blue-700","--sds-color-green-700","--sds-color-pink-700","--sds-color-yellow-700","--sds-color-red-700"],s="--sds-color-gray-400";exports.CHART_NEUTRAL_COLOR_TOKEN=s;exports.CHART_SERIES_COLOR_TOKENS=o;
|
|
2
2
|
//# sourceMappingURL=chart-palette.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"chart-palette.cjs","sources":["../../../../../src/ui/components/charts/chart-palette.ts"],"sourcesContent":["// Ordenada para afastar ao máximo os matizes de séries vizinhas: os cinco cromáticos do tema\n// no passo 500, e só depois os mesmos cinco no 700. As rampas neutras ficam de fora porque se\n// confundem com grade e eixo — a `brand-500` deste tema é cinza.\nexport const CHART_SERIES_COLOR_TOKENS: string[] = [\n \"--sds-color-blue-500\",\n \"--sds-color-green-500\",\n \"--sds-color-pink-500\",\n \"--sds-color-yellow-500\",\n \"--sds-color-red-500\",\n \"--sds-color-blue-700\",\n \"--sds-color-green-700\",\n \"--sds-color-pink-700\",\n \"--sds-color-yellow-700\",\n \"--sds-color-red-700\",\n];\n"],"names":["CHART_SERIES_COLOR_TOKENS"],"mappings":"gFAGO,MAAMA,EAAsC,CACjD,uBACA,wBACA,uBACA,yBACA,sBACA,uBACA,wBACA,uBACA,yBACA,qBACF"}
|
|
1
|
+
{"version":3,"file":"chart-palette.cjs","sources":["../../../../../src/ui/components/charts/chart-palette.ts"],"sourcesContent":["// Ordenada para afastar ao máximo os matizes de séries vizinhas: os cinco cromáticos do tema\n// no passo 500, e só depois os mesmos cinco no 700. As rampas neutras ficam de fora porque se\n// confundem com grade e eixo — a `brand-500` deste tema é cinza.\nexport const CHART_SERIES_COLOR_TOKENS: string[] = [\n \"--sds-color-blue-500\",\n \"--sds-color-green-500\",\n \"--sds-color-pink-500\",\n \"--sds-color-yellow-500\",\n \"--sds-color-red-500\",\n \"--sds-color-blue-700\",\n \"--sds-color-green-700\",\n \"--sds-color-pink-700\",\n \"--sds-color-yellow-700\",\n \"--sds-color-red-700\",\n];\n\nexport const CHART_NEUTRAL_COLOR_TOKEN: string = \"--sds-color-gray-400\";\n"],"names":["CHART_SERIES_COLOR_TOKENS","CHART_NEUTRAL_COLOR_TOKEN"],"mappings":"gFAGO,MAAMA,EAAsC,CACjD,uBACA,wBACA,uBACA,yBACA,sBACA,uBACA,wBACA,uBACA,yBACA,qBACF,EAEaC,EAAoC"}
|
|
@@ -9,8 +9,9 @@ const o = [
|
|
|
9
9
|
"--sds-color-pink-700",
|
|
10
10
|
"--sds-color-yellow-700",
|
|
11
11
|
"--sds-color-red-700"
|
|
12
|
-
];
|
|
12
|
+
], s = "--sds-color-gray-400";
|
|
13
13
|
export {
|
|
14
|
+
s as CHART_NEUTRAL_COLOR_TOKEN,
|
|
14
15
|
o as CHART_SERIES_COLOR_TOKENS
|
|
15
16
|
};
|
|
16
17
|
//# sourceMappingURL=chart-palette.js.map
|