@apipass/design-system 7.1.0 → 7.3.1
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/embedded-styles.js +2 -2
- 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 +70 -69
- package/dist/lib/ui/components/DataTable/DataTable.js.map +1 -1
- package/dist/lib/ui/components/FormModal/FormModal.cjs +1 -1
- package/dist/lib/ui/components/FormModal/FormModal.cjs.map +1 -1
- package/dist/lib/ui/components/FormModal/FormModal.js +14 -15
- package/dist/lib/ui/components/FormModal/FormModal.js.map +1 -1
- package/dist/lib/ui/components/charts/TopList/TopList.cjs +1 -1
- package/dist/lib/ui/components/charts/TopList/TopList.cjs.map +1 -1
- package/dist/lib/ui/components/charts/TopList/TopList.js +49 -45
- package/dist/lib/ui/components/charts/TopList/TopList.js.map +1 -1
- package/dist/lib/ui/components/charts/TopList/top-list-option.cjs +1 -1
- package/dist/lib/ui/components/charts/TopList/top-list-option.cjs.map +1 -1
- package/dist/lib/ui/components/charts/TopList/top-list-option.js +148 -106
- package/dist/lib/ui/components/charts/TopList/top-list-option.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 +6 -4
- package/dist/lib/ui/components/charts/chart-theme.js.map +1 -1
- package/dist/lib/ui/primitives/Dialog/Dialog.cjs +1 -1
- package/dist/lib/ui/primitives/Dialog/Dialog.cjs.map +1 -1
- package/dist/lib/ui/primitives/Dialog/Dialog.js +26 -16
- package/dist/lib/ui/primitives/Dialog/Dialog.js.map +1 -1
- package/dist/lib/ui/primitives/JsonViewer/json-code-mirror.cjs +1 -1
- package/dist/lib/ui/primitives/JsonViewer/json-code-mirror.cjs.map +1 -1
- package/dist/lib/ui/primitives/JsonViewer/json-code-mirror.js +23 -23
- package/dist/lib/ui/primitives/JsonViewer/json-code-mirror.js.map +1 -1
- package/dist/lib/ui/primitives/Switch/Switch.cjs +1 -1
- package/dist/lib/ui/primitives/Switch/Switch.cjs.map +1 -1
- package/dist/lib/ui/primitives/Switch/Switch.js +25 -20
- package/dist/lib/ui/primitives/Switch/Switch.js.map +1 -1
- package/dist/types/ui/components/FormModal/FormModal.d.ts +2 -1
- package/dist/types/ui/components/charts/TopList/top-list-option.d.ts +1 -0
- package/dist/types/ui/components/charts/chart-theme.d.ts +2 -0
- package/dist/types/ui/primitives/Dialog/Dialog.d.ts +3 -1
- package/dist/types/ui/primitives/Switch/Switch.d.ts +5 -2
- package/package.json +1 -1
|
@@ -1,178 +1,220 @@
|
|
|
1
|
-
import { formatShare as
|
|
1
|
+
import { formatShare as g } from "../chart-share.js";
|
|
2
2
|
import "echarts/charts";
|
|
3
3
|
import "echarts/components";
|
|
4
|
-
import * as
|
|
4
|
+
import * as P from "echarts/core";
|
|
5
5
|
import "echarts/renderers";
|
|
6
|
-
const
|
|
7
|
-
function
|
|
6
|
+
const _ = "–", C = 12, L = 8, w = 88, B = 56, u = 16, d = 4, m = 6, c = 3, b = 800, f = 13, M = 26, V = 1e-9, k = /[{}|]/g, O = "top-list-values", N = "top-list-tracks";
|
|
7
|
+
function s(t) {
|
|
8
8
|
return t.value ?? 0;
|
|
9
9
|
}
|
|
10
10
|
function v(t) {
|
|
11
|
-
const e = Math.max(...t.map(
|
|
11
|
+
const e = Math.max(...t.map(s));
|
|
12
12
|
return e > 0 ? e : 1;
|
|
13
13
|
}
|
|
14
|
-
function
|
|
15
|
-
const e = [...new Set(t.map(
|
|
16
|
-
(
|
|
17
|
-
),
|
|
18
|
-
return
|
|
14
|
+
function U(t) {
|
|
15
|
+
const e = [...new Set(t.map(s))].sort(
|
|
16
|
+
(a, n) => a - n
|
|
17
|
+
), o = e.slice(1).map((a, n) => a - e[n]);
|
|
18
|
+
return o.length > 0 ? Math.min(...o) : 1 / 0;
|
|
19
19
|
}
|
|
20
|
-
function
|
|
21
|
-
const e = v(t) *
|
|
22
|
-
return Math.min(e,
|
|
20
|
+
function X(t) {
|
|
21
|
+
const e = v(t) * V, o = U(t) / (t.length + 1);
|
|
22
|
+
return Math.min(e, o);
|
|
23
23
|
}
|
|
24
|
-
function
|
|
25
|
-
const e =
|
|
24
|
+
function E(t) {
|
|
25
|
+
const e = X(t);
|
|
26
26
|
return new Map(
|
|
27
|
-
t.map((
|
|
28
|
-
|
|
29
|
-
|
|
27
|
+
t.map((o, a) => [
|
|
28
|
+
o.id,
|
|
29
|
+
s(o) + e * (t.length - a)
|
|
30
30
|
])
|
|
31
31
|
);
|
|
32
32
|
}
|
|
33
|
-
function
|
|
34
|
-
const
|
|
35
|
-
(
|
|
33
|
+
function x(t, e) {
|
|
34
|
+
const o = E(t), a = e === "desc" ? -1 : 1, n = [...t].sort(
|
|
35
|
+
(l, i) => a * (o.get(l.id) - o.get(i.id))
|
|
36
36
|
);
|
|
37
|
-
return new Map(
|
|
37
|
+
return new Map(n.map((l, i) => [l.id, i + 1]));
|
|
38
38
|
}
|
|
39
|
-
function
|
|
40
|
-
return e ?? t.reduce((
|
|
39
|
+
function W(t, e) {
|
|
40
|
+
return e ?? t.reduce((o, a) => o + s(a), 0);
|
|
41
41
|
}
|
|
42
|
-
function
|
|
43
|
-
return e === 0 ? 0 :
|
|
42
|
+
function T(t, e) {
|
|
43
|
+
return e === 0 ? 0 : s(t) / e;
|
|
44
44
|
}
|
|
45
45
|
function p(t) {
|
|
46
46
|
return t.replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">");
|
|
47
47
|
}
|
|
48
|
-
function
|
|
49
|
-
return t.replace(
|
|
48
|
+
function A(t) {
|
|
49
|
+
return t.replace(k, " ");
|
|
50
50
|
}
|
|
51
|
-
function
|
|
52
|
-
const
|
|
53
|
-
return
|
|
51
|
+
function G(t) {
|
|
52
|
+
const e = [];
|
|
53
|
+
return t.includes("value") && e.push(w), t.includes("percent") && e.push(B), e.reduce((o, a) => o + a, 0);
|
|
54
54
|
}
|
|
55
|
-
function
|
|
56
|
-
|
|
55
|
+
function F(t) {
|
|
56
|
+
const e = t.canvasWidthPx - 2 * d - G(t.valueDisplay) - C;
|
|
57
|
+
return Math.max(e, 0);
|
|
57
58
|
}
|
|
58
59
|
function H(t, e) {
|
|
59
|
-
|
|
60
|
+
const o = `${f}px ${e.theme.fontFamily}`;
|
|
61
|
+
return A(P.format.truncateText(t, F(e), o, "…"));
|
|
60
62
|
}
|
|
61
|
-
function
|
|
62
|
-
|
|
63
|
-
return t.includes("value") && e.push(M), t.includes("percent") && e.push(P), e.length === 0 ? 0 : e.reduce((n, o) => n + o, 0) + b;
|
|
63
|
+
function S(t, e) {
|
|
64
|
+
return e === null ? _ : t.valueFormatter ? t.valueFormatter(e) : String(e);
|
|
64
65
|
}
|
|
65
|
-
function
|
|
66
|
-
|
|
67
|
-
|
|
66
|
+
function $(t, e) {
|
|
67
|
+
return t.value === null ? _ : g(T(t, e));
|
|
68
|
+
}
|
|
69
|
+
function z(t, e, o) {
|
|
70
|
+
const a = [];
|
|
71
|
+
return t.valueDisplay.includes("value") && a.push(`{value|${A(S(t, e.value))}}`), t.valueDisplay.includes("percent") && a.push(`{percent|${$(e, o)}}`), a.join("");
|
|
68
72
|
}
|
|
69
|
-
function
|
|
70
|
-
const
|
|
71
|
-
return Math.max(1, Math.ceil(
|
|
73
|
+
function et(t, e) {
|
|
74
|
+
const o = (t - 2 * u) / e;
|
|
75
|
+
return Math.max(1, Math.ceil(M / o));
|
|
72
76
|
}
|
|
73
|
-
function
|
|
77
|
+
function I(t, e) {
|
|
74
78
|
return t === void 0 || (t - 1) % e === 0;
|
|
75
79
|
}
|
|
76
|
-
function
|
|
77
|
-
const { items: n, sort: o, theme: a } = t, r = A(n, o), i = t.labeledRowStep;
|
|
80
|
+
function K(t) {
|
|
78
81
|
return {
|
|
79
82
|
type: "category",
|
|
80
|
-
data:
|
|
81
|
-
inverse:
|
|
83
|
+
data: t.items.map((e) => e.id),
|
|
84
|
+
inverse: t.sort === "desc",
|
|
82
85
|
animationDuration: 0,
|
|
83
|
-
animationDurationUpdate: t.animate ?
|
|
86
|
+
animationDurationUpdate: t.animate ? b : 0,
|
|
84
87
|
axisLine: { show: !1 },
|
|
85
88
|
axisTick: { show: !1 },
|
|
86
|
-
axisLabel: {
|
|
87
|
-
color: a.labelColor,
|
|
88
|
-
fontSize: m,
|
|
89
|
-
interval: 0,
|
|
90
|
-
align: "right",
|
|
91
|
-
margin: E,
|
|
92
|
-
formatter: (l) => {
|
|
93
|
-
if (!y(r.get(l), i)) return "";
|
|
94
|
-
const d = e.get(l);
|
|
95
|
-
return d ? k(d.name, a) : "";
|
|
96
|
-
}
|
|
97
|
-
}
|
|
89
|
+
axisLabel: { show: !1 }
|
|
98
90
|
};
|
|
99
91
|
}
|
|
100
|
-
function
|
|
101
|
-
return (
|
|
102
|
-
const
|
|
103
|
-
if (!
|
|
104
|
-
const
|
|
105
|
-
return `<div>${p(
|
|
92
|
+
function j(t, e, o) {
|
|
93
|
+
return (a) => {
|
|
94
|
+
const n = e.get(a.name);
|
|
95
|
+
if (!n) return "";
|
|
96
|
+
const l = n.value === null ? "" : ` · ${g(T(n, o))}`, i = p(S(t, n.value));
|
|
97
|
+
return `<div>${p(n.name)}</div><div><b>${i}</b>${l}</div>`;
|
|
106
98
|
};
|
|
107
99
|
}
|
|
108
|
-
function
|
|
109
|
-
|
|
100
|
+
function y() {
|
|
101
|
+
return [0, -9];
|
|
102
|
+
}
|
|
103
|
+
function Y(t, e) {
|
|
104
|
+
const o = x(t.items, t.sort);
|
|
105
|
+
return {
|
|
106
|
+
show: !0,
|
|
107
|
+
position: "insideLeft",
|
|
108
|
+
distance: 0,
|
|
109
|
+
align: "left",
|
|
110
|
+
verticalAlign: "bottom",
|
|
111
|
+
offset: y(),
|
|
112
|
+
color: t.theme.emphasizedLabelColor,
|
|
113
|
+
backgroundColor: t.theme.tooltipBackgroundColor,
|
|
114
|
+
fontSize: f,
|
|
115
|
+
fontWeight: 500,
|
|
116
|
+
formatter: (a) => {
|
|
117
|
+
if (!I(o.get(a.name), t.labeledRowStep)) return "";
|
|
118
|
+
const n = e.get(a.name);
|
|
119
|
+
return n ? H(n.name, t) : "";
|
|
120
|
+
}
|
|
121
|
+
};
|
|
122
|
+
}
|
|
123
|
+
function Z(t, e, o) {
|
|
124
|
+
const { theme: a } = t, n = x(t.items, t.sort);
|
|
110
125
|
return {
|
|
111
126
|
show: t.valueDisplay.length > 0,
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
127
|
+
backgroundColor: a.tooltipBackgroundColor,
|
|
128
|
+
position: "insideRight",
|
|
129
|
+
distance: 0,
|
|
130
|
+
align: "right",
|
|
131
|
+
verticalAlign: "bottom",
|
|
132
|
+
offset: y(),
|
|
133
|
+
fontSize: f,
|
|
134
|
+
formatter: (l) => {
|
|
135
|
+
if (!I(n.get(l.name), t.labeledRowStep)) return "";
|
|
136
|
+
const i = e.get(l.name);
|
|
137
|
+
return i ? z(t, i, o) : "";
|
|
119
138
|
},
|
|
120
139
|
rich: {
|
|
121
|
-
value: {
|
|
122
|
-
|
|
140
|
+
value: {
|
|
141
|
+
color: a.labelColor,
|
|
142
|
+
fontWeight: 600,
|
|
143
|
+
padding: [0, t.valueDisplay.includes("percent") ? L : 0, 0, 0]
|
|
144
|
+
},
|
|
145
|
+
percent: { color: a.labelColor }
|
|
123
146
|
}
|
|
124
147
|
};
|
|
125
148
|
}
|
|
126
|
-
function
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
149
|
+
function h() {
|
|
150
|
+
return [c, c, c, c];
|
|
151
|
+
}
|
|
152
|
+
function ot(t) {
|
|
153
|
+
const { items: e, theme: o, colorsByItemId: a } = t, n = new Map(
|
|
154
|
+
e.map((r) => [r.id, r])
|
|
155
|
+
), l = W(e, t.total), i = v(e), D = E(e), R = o.seriesColors[0];
|
|
130
156
|
return {
|
|
131
157
|
animation: !0,
|
|
132
158
|
animationDuration: 0,
|
|
133
|
-
animationDurationUpdate: t.animate ?
|
|
159
|
+
animationDurationUpdate: t.animate ? b : 0,
|
|
134
160
|
animationEasing: "linear",
|
|
135
161
|
animationEasingUpdate: "linear",
|
|
136
|
-
textStyle: { fontFamily:
|
|
162
|
+
textStyle: { fontFamily: o.fontFamily, color: o.labelColor },
|
|
137
163
|
grid: {
|
|
138
|
-
top:
|
|
139
|
-
bottom:
|
|
140
|
-
left:
|
|
141
|
-
right:
|
|
164
|
+
top: u,
|
|
165
|
+
bottom: u,
|
|
166
|
+
left: d,
|
|
167
|
+
right: d,
|
|
142
168
|
containLabel: !1
|
|
143
169
|
},
|
|
144
170
|
tooltip: {
|
|
145
171
|
trigger: "item",
|
|
146
|
-
backgroundColor:
|
|
147
|
-
borderColor:
|
|
148
|
-
textStyle: { color:
|
|
149
|
-
formatter:
|
|
172
|
+
backgroundColor: o.tooltipBackgroundColor,
|
|
173
|
+
borderColor: o.tooltipBorderColor,
|
|
174
|
+
textStyle: { color: o.labelColor },
|
|
175
|
+
formatter: j(t, n, l)
|
|
150
176
|
},
|
|
151
177
|
xAxis: { type: "value", min: 0, max: i, show: !1 },
|
|
152
|
-
yAxis:
|
|
178
|
+
yAxis: K(t),
|
|
153
179
|
series: [
|
|
154
180
|
{
|
|
155
|
-
id:
|
|
181
|
+
id: N,
|
|
182
|
+
type: "bar",
|
|
183
|
+
silent: !0,
|
|
184
|
+
barWidth: m,
|
|
185
|
+
barGap: "-100%",
|
|
186
|
+
itemStyle: { color: o.trackColor, borderRadius: h() },
|
|
187
|
+
data: e.map((r) => ({
|
|
188
|
+
id: r.id,
|
|
189
|
+
name: r.id,
|
|
190
|
+
value: [i, r.id]
|
|
191
|
+
})),
|
|
192
|
+
encode: { x: 0, y: 1 },
|
|
193
|
+
label: Z(t, n, l)
|
|
194
|
+
},
|
|
195
|
+
{
|
|
196
|
+
id: O,
|
|
156
197
|
type: "bar",
|
|
157
198
|
realtimeSort: !0,
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
199
|
+
barWidth: m,
|
|
200
|
+
barGap: "-100%",
|
|
201
|
+
itemStyle: { borderRadius: h() },
|
|
202
|
+
data: e.map((r) => ({
|
|
203
|
+
id: r.id,
|
|
204
|
+
name: r.id,
|
|
205
|
+
value: [D.get(r.id), r.id],
|
|
206
|
+
itemStyle: { color: a[r.id] ?? R }
|
|
165
207
|
})),
|
|
166
208
|
encode: { x: 0, y: 1 },
|
|
167
|
-
label:
|
|
209
|
+
label: Y(t, n)
|
|
168
210
|
}
|
|
169
211
|
]
|
|
170
212
|
};
|
|
171
213
|
}
|
|
172
214
|
export {
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
215
|
+
ot as buildTopListOption,
|
|
216
|
+
et as labeledRowStepFor,
|
|
217
|
+
x as rankById,
|
|
218
|
+
W as resolveTotal
|
|
177
219
|
};
|
|
178
220
|
//# sourceMappingURL=top-list-option.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"top-list-option.js","sources":["../../../../../../src/ui/components/charts/TopList/top-list-option.ts"],"sourcesContent":["import { formatShare } from \"../chart-share\";\nimport { echarts } from \"../echarts-modules\";\nimport type { ChartTheme } from \"../chart-theme\";\n\nexport interface TopListItem {\n id: string;\n name: string;\n value: number | null;\n colorToken?: string;\n}\n\nexport type TopListSort = \"desc\" | \"asc\";\n\nexport type TopListValueDisplay = \"value\" | \"percent\";\n\nexport interface TopListOptionInput {\n items: TopListItem[];\n sort: TopListSort;\n total?: number;\n valueDisplay: TopListValueDisplay[];\n theme: ChartTheme;\n colorsByItemId: Record<string, string>;\n animate: boolean;\n labeledRowStep: number;\n valueFormatter?: (value: number) => string;\n}\n\nconst EMPTY_VALUE_TEXT: string = \"–\";\n\nconst NAME_MAX_WIDTH_PX: number = 160;\n\nconst NAME_TO_BAR_GAP_PX: number = 12;\n\nconst VALUE_COLUMN_WIDTH_PX: number = 88;\n\nconst PERCENT_COLUMN_WIDTH_PX: number = 56;\n\nconst GRID_PADDING_PX: number = 16;\n\nconst BAR_MAX_WIDTH_PX: number = 20;\n\nconst BAR_RADIUS_PX: number = 4;\n\nconst BAR_END_LABEL_DISTANCE_PX: number = 8;\n\nconst UPDATE_ANIMATION_MS: number = 800;\n\nconst LABEL_FONT_SIZE_PX: number = 12;\n\nconst MIN_LABELED_ROW_HEIGHT_PX: number = 14;\n\nconst TIE_BREAK_RELATIVE_STEP: number = 1e-9;\n\nconst RICH_TEXT_RESERVED: RegExp = /[{}|]/g;\n\nconst VALUE_SERIES_ID: string = \"top-list-values\";\n\n\nfunction valueOf(item: TopListItem): number {\n return item.value ?? 0;\n}\n\nfunction maxValueOf(items: TopListItem[]): number {\n const maxValue: number = Math.max(...items.map(valueOf));\n return maxValue > 0 ? maxValue : 1;\n}\n\nfunction smallestGapBetweenDistinctValues(items: TopListItem[]): number {\n const distinctValues: number[] = [...new Set(items.map(valueOf))].sort(\n (first: number, second: number) => first - second,\n );\n const gaps: number[] = distinctValues\n .slice(1)\n .map((value: number, index: number) => value - distinctValues[index]);\n return gaps.length > 0 ? Math.min(...gaps) : Infinity;\n}\n\nfunction tieBreakStepOf(items: TopListItem[]): number {\n const relativeStep: number = maxValueOf(items) * TIE_BREAK_RELATIVE_STEP;\n const stepThatKeepsDistinctValuesApart: number =\n smallestGapBetweenDistinctValues(items) / (items.length + 1);\n return Math.min(relativeStep, stepThatKeepsDistinctValuesApart);\n}\n\nfunction plottedValuesById(items: TopListItem[]): Map<string, number> {\n const tieBreakStep: number = tieBreakStepOf(items);\n return new Map(\n items.map((item: TopListItem, position: number) => [\n item.id,\n valueOf(item) + tieBreakStep * (items.length - position),\n ]),\n );\n}\n\nexport function rankById(items: TopListItem[], sort: TopListSort): Map<string, number> {\n const plottedValues: Map<string, number> = plottedValuesById(items);\n const direction: number = sort === \"desc\" ? -1 : 1;\n const ranked: TopListItem[] = [...items].sort(\n (first: TopListItem, second: TopListItem) =>\n direction * ((plottedValues.get(first.id) as number) - (plottedValues.get(second.id) as number)),\n );\n return new Map(ranked.map((item: TopListItem, index: number) => [item.id, index + 1]));\n}\n\nexport function resolveTotal(items: TopListItem[], total?: number): number {\n return total ?? items.reduce((sum: number, item: TopListItem) => sum + valueOf(item), 0);\n}\n\nfunction shareOf(item: TopListItem, total: number): number {\n return total === 0 ? 0 : valueOf(item) / total;\n}\n\nfunction escapeHtml(text: string): string {\n return text.replace(/&/g, \"&\").replace(/</g, \"<\").replace(/>/g, \">\");\n}\n\nfunction plainRichText(text: string): string {\n return text.replace(RICH_TEXT_RESERVED, \" \");\n}\n\nfunction truncatedName(name: string, theme: ChartTheme): string {\n const font: string = `${LABEL_FONT_SIZE_PX}px ${theme.fontFamily}`;\n return plainRichText(echarts.format.truncateText(name, NAME_MAX_WIDTH_PX, font, \"…\"));\n}\n\nfunction formatValueText(input: TopListOptionInput, value: number | null): string {\n if (value === null) return EMPTY_VALUE_TEXT;\n return input.valueFormatter ? input.valueFormatter(value) : String(value);\n}\n\nfunction formatShareText(item: TopListItem, total: number): string {\n return item.value === null ? EMPTY_VALUE_TEXT : formatShare(shareOf(item, total));\n}\n\nfunction barEndLabelWidthPx(valueDisplay: TopListValueDisplay[]): number {\n const widths: number[] = [];\n if (valueDisplay.includes(\"value\")) widths.push(VALUE_COLUMN_WIDTH_PX);\n if (valueDisplay.includes(\"percent\")) widths.push(PERCENT_COLUMN_WIDTH_PX);\n if (widths.length === 0) return 0;\n return widths.reduce((sum: number, width: number) => sum + width, 0) + BAR_END_LABEL_DISTANCE_PX;\n}\n\nfunction barEndLabelText(input: TopListOptionInput, item: TopListItem, total: number): string {\n const parts: string[] = [];\n if (input.valueDisplay.includes(\"value\")) {\n parts.push(`{value|${plainRichText(formatValueText(input, item.value))}}`);\n }\n if (input.valueDisplay.includes(\"percent\")) {\n parts.push(`{percent|${formatShareText(item, total)}}`);\n }\n return parts.join(\"\");\n}\n\nexport function labeledRowStepFor(canvasHeightPx: number, itemCount: number): number {\n const rowHeightPx: number = (canvasHeightPx - 2 * GRID_PADDING_PX) / itemCount;\n return Math.max(1, Math.ceil(MIN_LABELED_ROW_HEIGHT_PX / rowHeightPx));\n}\n\nfunction isRowLabeled(rank: number | undefined, step: number): boolean {\n return rank === undefined || (rank - 1) % step === 0;\n}\n\nfunction categoryAxis(\n input: TopListOptionInput,\n itemsById: Map<string, TopListItem>,\n): Record<string, unknown> {\n const { items, sort, theme } = input;\n const ranks: Map<string, number> = rankById(items, sort);\n const step: number = input.labeledRowStep;\n return {\n type: \"category\",\n data: items.map((item: TopListItem) => item.id),\n inverse: sort === \"desc\",\n animationDuration: 0,\n animationDurationUpdate: input.animate ? UPDATE_ANIMATION_MS : 0,\n axisLine: { show: false },\n axisTick: { show: false },\n axisLabel: {\n color: theme.labelColor,\n fontSize: LABEL_FONT_SIZE_PX,\n interval: 0,\n align: \"right\",\n margin: NAME_TO_BAR_GAP_PX,\n formatter: (id: string) => {\n if (!isRowLabeled(ranks.get(id), step)) return \"\";\n const item: TopListItem | undefined = itemsById.get(id);\n return item ? truncatedName(item.name, theme) : \"\";\n },\n },\n };\n}\n\nfunction tooltipFormatter(\n input: TopListOptionInput,\n itemsById: Map<string, TopListItem>,\n total: number,\n): (params: { name: string }) => string {\n return (params: { name: string }) => {\n const item: TopListItem | undefined = itemsById.get(params.name);\n if (!item) return \"\";\n const share: string = item.value === null ? \"\" : ` · ${formatShare(shareOf(item, total))}`;\n const value: string = escapeHtml(formatValueText(input, item.value));\n return `<div>${escapeHtml(item.name)}</div><div><b>${value}</b>${share}</div>`;\n };\n}\n\nfunction barEndLabel(\n input: TopListOptionInput,\n itemsById: Map<string, TopListItem>,\n total: number,\n): Record<string, unknown> {\n const { theme } = input;\n const ranks: Map<string, number> = rankById(input.items, input.sort);\n const step: number = input.labeledRowStep;\n return {\n show: input.valueDisplay.length > 0,\n position: \"right\",\n distance: BAR_END_LABEL_DISTANCE_PX,\n fontSize: LABEL_FONT_SIZE_PX,\n formatter: (params: { name: string }) => {\n if (!isRowLabeled(ranks.get(params.name), step)) return \"\";\n const item: TopListItem | undefined = itemsById.get(params.name);\n return item ? barEndLabelText(input, item, total) : \"\";\n },\n rich: {\n value: { color: theme.labelColor, fontWeight: 600, padding: [0, 8, 0, 0] },\n percent: { color: theme.labelColor },\n },\n };\n}\n\nexport function buildTopListOption(input: TopListOptionInput): Record<string, unknown> {\n const { items, theme, colorsByItemId } = input;\n const itemsById: Map<string, TopListItem> = new Map(\n items.map((item: TopListItem) => [item.id, item]),\n );\n const total: number = resolveTotal(items, input.total);\n const maxValue: number = maxValueOf(items);\n const plottedValues: Map<string, number> = plottedValuesById(items);\n const reservedRightPx: number = barEndLabelWidthPx(input.valueDisplay);\n const fallbackColor: string = theme.seriesColors[0];\n \n return {\n animation: true,\n animationDuration: 0,\n animationDurationUpdate: input.animate ? UPDATE_ANIMATION_MS : 0,\n animationEasing: \"linear\",\n animationEasingUpdate: \"linear\",\n textStyle: { fontFamily: theme.fontFamily, color: theme.labelColor },\n grid: {\n top: GRID_PADDING_PX,\n bottom: GRID_PADDING_PX,\n left: GRID_PADDING_PX + NAME_MAX_WIDTH_PX + NAME_TO_BAR_GAP_PX,\n right: GRID_PADDING_PX + reservedRightPx,\n containLabel: false,\n },\n tooltip: {\n trigger: \"item\",\n backgroundColor: theme.tooltipBackgroundColor,\n borderColor: theme.tooltipBorderColor,\n textStyle: { color: theme.labelColor },\n formatter: tooltipFormatter(input, itemsById, total),\n },\n xAxis: { type: \"value\", min: 0, max: maxValue, show: false },\n yAxis: categoryAxis(input, itemsById),\n series: [\n {\n id: VALUE_SERIES_ID,\n type: \"bar\",\n realtimeSort: true,\n barMaxWidth: BAR_MAX_WIDTH_PX,\n itemStyle: { borderRadius: [0, BAR_RADIUS_PX, BAR_RADIUS_PX, 0] },\n data: items.map((item: TopListItem) => ({\n id: item.id,\n name: item.id,\n value: [plottedValues.get(item.id) as number, item.id],\n itemStyle: { color: colorsByItemId[item.id] ?? fallbackColor },\n })),\n encode: { x: 0, y: 1 },\n label: barEndLabel(input, itemsById, total),\n },\n ],\n };\n}\n"],"names":["EMPTY_VALUE_TEXT","NAME_MAX_WIDTH_PX","NAME_TO_BAR_GAP_PX","VALUE_COLUMN_WIDTH_PX","PERCENT_COLUMN_WIDTH_PX","GRID_PADDING_PX","BAR_MAX_WIDTH_PX","BAR_RADIUS_PX","BAR_END_LABEL_DISTANCE_PX","UPDATE_ANIMATION_MS","LABEL_FONT_SIZE_PX","MIN_LABELED_ROW_HEIGHT_PX","TIE_BREAK_RELATIVE_STEP","RICH_TEXT_RESERVED","VALUE_SERIES_ID","valueOf","item","maxValueOf","items","maxValue","smallestGapBetweenDistinctValues","distinctValues","first","second","gaps","value","index","tieBreakStepOf","relativeStep","stepThatKeepsDistinctValuesApart","plottedValuesById","tieBreakStep","position","rankById","sort","plottedValues","direction","ranked","resolveTotal","total","sum","shareOf","escapeHtml","text","plainRichText","truncatedName","name","theme","font","echarts","formatValueText","input","formatShareText","formatShare","barEndLabelWidthPx","valueDisplay","widths","width","barEndLabelText","parts","labeledRowStepFor","canvasHeightPx","itemCount","rowHeightPx","isRowLabeled","rank","step","categoryAxis","itemsById","ranks","id","tooltipFormatter","params","share","barEndLabel","buildTopListOption","colorsByItemId","reservedRightPx","fallbackColor"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"top-list-option.js","sources":["../../../../../../src/ui/components/charts/TopList/top-list-option.ts"],"sourcesContent":["import { formatShare } from \"../chart-share\";\nimport { echarts } from \"../echarts-modules\";\nimport type { ChartTheme } from \"../chart-theme\";\n\nexport interface TopListItem {\n id: string;\n name: string;\n value: number | null;\n colorToken?: string;\n}\n\nexport type TopListSort = \"desc\" | \"asc\";\n\nexport type TopListValueDisplay = \"value\" | \"percent\";\n\nexport interface TopListOptionInput {\n items: TopListItem[];\n sort: TopListSort;\n total?: number;\n valueDisplay: TopListValueDisplay[];\n theme: ChartTheme;\n colorsByItemId: Record<string, string>;\n animate: boolean;\n labeledRowStep: number;\n canvasWidthPx: number;\n valueFormatter?: (value: number) => string;\n}\n\nconst EMPTY_VALUE_TEXT: string = \"–\";\n\nconst NAME_TO_VALUE_GAP_PX: number = 12;\n\nconst VALUE_TO_PERCENT_GAP_PX: number = 8;\n\nconst VALUE_COLUMN_WIDTH_PX: number = 88;\n\nconst PERCENT_COLUMN_WIDTH_PX: number = 56;\n\nconst GRID_PADDING_PX: number = 16;\n\nconst GRID_SIDE_PADDING_PX: number = 4;\n\nconst BAR_WIDTH_PX: number = 6;\n\nconst BAR_RADIUS_PX: number = 3;\n\nconst LABEL_TO_BAR_GAP_PX: number = 6;\n\nconst UPDATE_ANIMATION_MS: number = 800;\n\nconst LABEL_FONT_SIZE_PX: number = 13;\n\nconst MIN_LABELED_ROW_HEIGHT_PX: number = 26;\n\nconst TIE_BREAK_RELATIVE_STEP: number = 1e-9;\n\nconst RICH_TEXT_RESERVED: RegExp = /[{}|]/g;\n\nconst VALUE_SERIES_ID: string = \"top-list-values\";\n\nconst TRACK_SERIES_ID: string = \"top-list-tracks\";\n\nfunction valueOf(item: TopListItem): number {\n return item.value ?? 0;\n}\n\nfunction maxValueOf(items: TopListItem[]): number {\n const maxValue: number = Math.max(...items.map(valueOf));\n return maxValue > 0 ? maxValue : 1;\n}\n\nfunction smallestGapBetweenDistinctValues(items: TopListItem[]): number {\n const distinctValues: number[] = [...new Set(items.map(valueOf))].sort(\n (first: number, second: number) => first - second,\n );\n const gaps: number[] = distinctValues\n .slice(1)\n .map((value: number, index: number) => value - distinctValues[index]);\n return gaps.length > 0 ? Math.min(...gaps) : Infinity;\n}\n\nfunction tieBreakStepOf(items: TopListItem[]): number {\n const relativeStep: number = maxValueOf(items) * TIE_BREAK_RELATIVE_STEP;\n const stepThatKeepsDistinctValuesApart: number =\n smallestGapBetweenDistinctValues(items) / (items.length + 1);\n return Math.min(relativeStep, stepThatKeepsDistinctValuesApart);\n}\n\nfunction plottedValuesById(items: TopListItem[]): Map<string, number> {\n const tieBreakStep: number = tieBreakStepOf(items);\n return new Map(\n items.map((item: TopListItem, position: number) => [\n item.id,\n valueOf(item) + tieBreakStep * (items.length - position),\n ]),\n );\n}\n\nexport function rankById(items: TopListItem[], sort: TopListSort): Map<string, number> {\n const plottedValues: Map<string, number> = plottedValuesById(items);\n const direction: number = sort === \"desc\" ? -1 : 1;\n const ranked: TopListItem[] = [...items].sort(\n (first: TopListItem, second: TopListItem) =>\n direction * ((plottedValues.get(first.id) as number) - (plottedValues.get(second.id) as number)),\n );\n return new Map(ranked.map((item: TopListItem, index: number) => [item.id, index + 1]));\n}\n\nexport function resolveTotal(items: TopListItem[], total?: number): number {\n return total ?? items.reduce((sum: number, item: TopListItem) => sum + valueOf(item), 0);\n}\n\nfunction shareOf(item: TopListItem, total: number): number {\n return total === 0 ? 0 : valueOf(item) / total;\n}\n\nfunction escapeHtml(text: string): string {\n return text.replace(/&/g, \"&\").replace(/</g, \"<\").replace(/>/g, \">\");\n}\n\nfunction plainRichText(text: string): string {\n return text.replace(RICH_TEXT_RESERVED, \" \");\n}\n\nfunction valueColumnsWidthPx(valueDisplay: TopListValueDisplay[]): number {\n const widths: number[] = [];\n if (valueDisplay.includes(\"value\")) widths.push(VALUE_COLUMN_WIDTH_PX);\n if (valueDisplay.includes(\"percent\")) widths.push(PERCENT_COLUMN_WIDTH_PX);\n return widths.reduce((sum: number, width: number) => sum + width, 0);\n}\n\nfunction nameMaxWidthPx(input: TopListOptionInput): number {\n const availablePx: number =\n input.canvasWidthPx -\n 2 * GRID_SIDE_PADDING_PX -\n valueColumnsWidthPx(input.valueDisplay) -\n NAME_TO_VALUE_GAP_PX;\n return Math.max(availablePx, 0);\n}\n\nfunction truncatedName(name: string, input: TopListOptionInput): string {\n const font: string = `${LABEL_FONT_SIZE_PX}px ${input.theme.fontFamily}`;\n return plainRichText(echarts.format.truncateText(name, nameMaxWidthPx(input), font, \"…\"));\n}\n\nfunction formatValueText(input: TopListOptionInput, value: number | null): string {\n if (value === null) return EMPTY_VALUE_TEXT;\n return input.valueFormatter ? input.valueFormatter(value) : String(value);\n}\n\nfunction formatShareText(item: TopListItem, total: number): string {\n return item.value === null ? EMPTY_VALUE_TEXT : formatShare(shareOf(item, total));\n}\n\nfunction valueLabelText(input: TopListOptionInput, item: TopListItem, total: number): string {\n const parts: string[] = [];\n if (input.valueDisplay.includes(\"value\")) {\n parts.push(`{value|${plainRichText(formatValueText(input, item.value))}}`);\n }\n if (input.valueDisplay.includes(\"percent\")) {\n parts.push(`{percent|${formatShareText(item, total)}}`);\n }\n return parts.join(\"\");\n}\n\nexport function labeledRowStepFor(canvasHeightPx: number, itemCount: number): number {\n const rowHeightPx: number = (canvasHeightPx - 2 * GRID_PADDING_PX) / itemCount;\n return Math.max(1, Math.ceil(MIN_LABELED_ROW_HEIGHT_PX / rowHeightPx));\n}\n\nfunction isRowLabeled(rank: number | undefined, step: number): boolean {\n return rank === undefined || (rank - 1) % step === 0;\n}\n\nfunction categoryAxis(input: TopListOptionInput): Record<string, unknown> {\n return {\n type: \"category\",\n data: input.items.map((item: TopListItem) => item.id),\n inverse: input.sort === \"desc\",\n animationDuration: 0,\n animationDurationUpdate: input.animate ? UPDATE_ANIMATION_MS : 0,\n axisLine: { show: false },\n axisTick: { show: false },\n axisLabel: { show: false },\n };\n}\n\nfunction tooltipFormatter(\n input: TopListOptionInput,\n itemsById: Map<string, TopListItem>,\n total: number,\n): (params: { name: string }) => string {\n return (params: { name: string }) => {\n const item: TopListItem | undefined = itemsById.get(params.name);\n if (!item) return \"\";\n const share: string = item.value === null ? \"\" : ` · ${formatShare(shareOf(item, total))}`;\n const value: string = escapeHtml(formatValueText(input, item.value));\n return `<div>${escapeHtml(item.name)}</div><div><b>${value}</b>${share}</div>`;\n };\n}\n\nfunction labelOffsetAboveBar(): number[] {\n return [0, -(BAR_WIDTH_PX / 2 + LABEL_TO_BAR_GAP_PX)];\n}\n\nfunction nameLabel(\n input: TopListOptionInput,\n itemsById: Map<string, TopListItem>,\n): Record<string, unknown> {\n const ranks: Map<string, number> = rankById(input.items, input.sort);\n return {\n show: true,\n position: \"insideLeft\",\n distance: 0,\n align: \"left\",\n verticalAlign: \"bottom\",\n offset: labelOffsetAboveBar(),\n color: input.theme.emphasizedLabelColor,\n backgroundColor: input.theme.tooltipBackgroundColor,\n fontSize: LABEL_FONT_SIZE_PX,\n fontWeight: 500,\n formatter: (params: { name: string }) => {\n if (!isRowLabeled(ranks.get(params.name), input.labeledRowStep)) return \"\";\n const item: TopListItem | undefined = itemsById.get(params.name);\n return item ? truncatedName(item.name, input) : \"\";\n },\n };\n}\n\nfunction valueLabel(\n input: TopListOptionInput,\n itemsById: Map<string, TopListItem>,\n total: number,\n): Record<string, unknown> {\n const { theme } = input;\n const ranks: Map<string, number> = rankById(input.items, input.sort);\n return {\n show: input.valueDisplay.length > 0,\n backgroundColor: theme.tooltipBackgroundColor,\n position: \"insideRight\",\n distance: 0,\n align: \"right\",\n verticalAlign: \"bottom\",\n offset: labelOffsetAboveBar(),\n fontSize: LABEL_FONT_SIZE_PX,\n formatter: (params: { name: string }) => {\n if (!isRowLabeled(ranks.get(params.name), input.labeledRowStep)) return \"\";\n const item: TopListItem | undefined = itemsById.get(params.name);\n return item ? valueLabelText(input, item, total) : \"\";\n },\n rich: {\n value: {\n color: theme.labelColor,\n fontWeight: 600,\n padding: [0, input.valueDisplay.includes(\"percent\") ? VALUE_TO_PERCENT_GAP_PX : 0, 0, 0],\n },\n percent: { color: theme.labelColor },\n },\n };\n}\n\nfunction barRadius(): number[] {\n return [BAR_RADIUS_PX, BAR_RADIUS_PX, BAR_RADIUS_PX, BAR_RADIUS_PX];\n}\n\nexport function buildTopListOption(input: TopListOptionInput): Record<string, unknown> {\n const { items, theme, colorsByItemId } = input;\n const itemsById: Map<string, TopListItem> = new Map(\n items.map((item: TopListItem) => [item.id, item]),\n );\n const total: number = resolveTotal(items, input.total);\n const maxValue: number = maxValueOf(items);\n const plottedValues: Map<string, number> = plottedValuesById(items);\n const fallbackColor: string = theme.seriesColors[0];\n\n return {\n animation: true,\n animationDuration: 0,\n animationDurationUpdate: input.animate ? UPDATE_ANIMATION_MS : 0,\n animationEasing: \"linear\",\n animationEasingUpdate: \"linear\",\n textStyle: { fontFamily: theme.fontFamily, color: theme.labelColor },\n grid: {\n top: GRID_PADDING_PX,\n bottom: GRID_PADDING_PX,\n left: GRID_SIDE_PADDING_PX,\n right: GRID_SIDE_PADDING_PX,\n containLabel: false,\n },\n tooltip: {\n trigger: \"item\",\n backgroundColor: theme.tooltipBackgroundColor,\n borderColor: theme.tooltipBorderColor,\n textStyle: { color: theme.labelColor },\n formatter: tooltipFormatter(input, itemsById, total),\n },\n xAxis: { type: \"value\", min: 0, max: maxValue, show: false },\n yAxis: categoryAxis(input),\n series: [\n {\n id: TRACK_SERIES_ID,\n type: \"bar\",\n silent: true,\n barWidth: BAR_WIDTH_PX,\n barGap: \"-100%\",\n itemStyle: { color: theme.trackColor, borderRadius: barRadius() },\n data: items.map((item: TopListItem) => ({\n id: item.id,\n name: item.id,\n value: [maxValue, item.id],\n })),\n encode: { x: 0, y: 1 },\n label: valueLabel(input, itemsById, total),\n },\n {\n id: VALUE_SERIES_ID,\n type: \"bar\",\n realtimeSort: true,\n barWidth: BAR_WIDTH_PX,\n barGap: \"-100%\",\n itemStyle: { borderRadius: barRadius() },\n data: items.map((item: TopListItem) => ({\n id: item.id,\n name: item.id,\n value: [plottedValues.get(item.id) as number, item.id],\n itemStyle: { color: colorsByItemId[item.id] ?? fallbackColor },\n })),\n encode: { x: 0, y: 1 },\n label: nameLabel(input, itemsById),\n },\n ],\n };\n}\n"],"names":["EMPTY_VALUE_TEXT","NAME_TO_VALUE_GAP_PX","VALUE_TO_PERCENT_GAP_PX","VALUE_COLUMN_WIDTH_PX","PERCENT_COLUMN_WIDTH_PX","GRID_PADDING_PX","GRID_SIDE_PADDING_PX","BAR_WIDTH_PX","BAR_RADIUS_PX","UPDATE_ANIMATION_MS","LABEL_FONT_SIZE_PX","MIN_LABELED_ROW_HEIGHT_PX","TIE_BREAK_RELATIVE_STEP","RICH_TEXT_RESERVED","VALUE_SERIES_ID","TRACK_SERIES_ID","valueOf","item","maxValueOf","items","maxValue","smallestGapBetweenDistinctValues","distinctValues","first","second","gaps","value","index","tieBreakStepOf","relativeStep","stepThatKeepsDistinctValuesApart","plottedValuesById","tieBreakStep","position","rankById","sort","plottedValues","direction","ranked","resolveTotal","total","sum","shareOf","escapeHtml","text","plainRichText","valueColumnsWidthPx","valueDisplay","widths","width","nameMaxWidthPx","input","availablePx","truncatedName","name","font","echarts","formatValueText","formatShareText","formatShare","valueLabelText","parts","labeledRowStepFor","canvasHeightPx","itemCount","rowHeightPx","isRowLabeled","rank","step","categoryAxis","tooltipFormatter","itemsById","params","share","labelOffsetAboveBar","nameLabel","ranks","valueLabel","theme","barRadius","buildTopListOption","colorsByItemId","fallbackColor"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("./chart-palette.cjs");function d(t,
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("./chart-palette.cjs");function d(t,o){const r=window.getComputedStyle(t).getPropertyValue(o).trim();return r===""?void 0:r}function e(t,o,r){const l=t.getPropertyValue(o).trim();return l===""?r:l}function s(t){const o=window.getComputedStyle(t);return{seriesColors:a.CHART_SERIES_COLOR_TOKENS.map(r=>e(o,r,"#4b5563")),neutralColor:e(o,a.CHART_NEUTRAL_COLOR_TOKEN,"#9ca3af"),axisLineColor:e(o,"--sds-color-border-default-secondary","#9ca3af"),splitLineColor:e(o,"--sds-color-border-default-default","#e5e7eb"),labelColor:e(o,"--sds-color-text-default-secondary","#6b7280"),emphasizedLabelColor:e(o,"--sds-color-text-default-default","#111827"),trackColor:e(o,"--sds-color-background-default-secondary","#f3f4f6"),tooltipBackgroundColor:e(o,"--sds-color-background-default-default","#ffffff"),tooltipBorderColor:e(o,"--sds-color-border-default-default","#d1d5db"),fontFamily:e(o,"--sds-typography-body-font-family","inherit")}}exports.readChartTheme=s;exports.resolveColorToken=d;
|
|
2
2
|
//# sourceMappingURL=chart-theme.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"chart-theme.cjs","sources":["../../../../../src/ui/components/charts/chart-theme.ts"],"sourcesContent":["import { CHART_SERIES_COLOR_TOKENS, CHART_NEUTRAL_COLOR_TOKEN as NEUTRAL_COLOR_TOKEN } from \"./chart-palette\";\n\nexport interface ChartTheme {\n seriesColors: string[];\n neutralColor: string;\n axisLineColor: string;\n splitLineColor: string;\n labelColor: string;\n tooltipBackgroundColor: string;\n tooltipBorderColor: string;\n fontFamily: string;\n}\n\n// O renderizador canvas não entende `var(--token)`, então a cor precisa chegar resolvida. A\n// resolução é contra o elemento hospedeiro para que tema aplicado em escopo menor que `:root`\n// continue valendo.\nexport function resolveColorToken(element: HTMLElement, token: string): string | undefined {\n const value: string = window.getComputedStyle(element).getPropertyValue(token).trim();\n return value === \"\" ? undefined : value;\n}\n\nfunction resolveToken(styles: CSSStyleDeclaration, token: string, fallback: string): string {\n const value: string = styles.getPropertyValue(token).trim();\n return value === \"\" ? fallback : value;\n}\n\nexport function readChartTheme(element: HTMLElement): ChartTheme {\n const styles: CSSStyleDeclaration = window.getComputedStyle(element);\n return {\n seriesColors: CHART_SERIES_COLOR_TOKENS.map((token: string) =>\n resolveToken(styles, token, \"#4b5563\"),\n ),\n neutralColor: resolveToken(styles, NEUTRAL_COLOR_TOKEN, \"#9ca3af\"),\n // A escala de borda deste tema vai do claro para o escuro: `tertiary` é a mais escura,\n // não a mais suave. A grade fica na `default` para ficar atrás do dado, e o eixo na\n // `secondary` para se separar da grade sem competir com as linhas.\n axisLineColor: resolveToken(styles, \"--sds-color-border-default-secondary\", \"#9ca3af\"),\n splitLineColor: resolveToken(styles, \"--sds-color-border-default-default\", \"#e5e7eb\"),\n labelColor: resolveToken(styles, \"--sds-color-text-default-secondary\", \"#6b7280\"),\n tooltipBackgroundColor: resolveToken(\n styles,\n \"--sds-color-background-default-default\",\n \"#ffffff\",\n ),\n tooltipBorderColor: resolveToken(styles, \"--sds-color-border-default-default\", \"#d1d5db\"),\n fontFamily: resolveToken(styles, \"--sds-typography-body-font-family\", \"inherit\"),\n };\n}\n"],"names":["resolveColorToken","element","token","value","resolveToken","styles","fallback","readChartTheme","CHART_SERIES_COLOR_TOKENS","NEUTRAL_COLOR_TOKEN"],"mappings":"
|
|
1
|
+
{"version":3,"file":"chart-theme.cjs","sources":["../../../../../src/ui/components/charts/chart-theme.ts"],"sourcesContent":["import { CHART_SERIES_COLOR_TOKENS, CHART_NEUTRAL_COLOR_TOKEN as NEUTRAL_COLOR_TOKEN } from \"./chart-palette\";\n\nexport interface ChartTheme {\n seriesColors: string[];\n neutralColor: string;\n axisLineColor: string;\n splitLineColor: string;\n labelColor: string;\n emphasizedLabelColor: string;\n trackColor: string;\n tooltipBackgroundColor: string;\n tooltipBorderColor: string;\n fontFamily: string;\n}\n\n// O renderizador canvas não entende `var(--token)`, então a cor precisa chegar resolvida. A\n// resolução é contra o elemento hospedeiro para que tema aplicado em escopo menor que `:root`\n// continue valendo.\nexport function resolveColorToken(element: HTMLElement, token: string): string | undefined {\n const value: string = window.getComputedStyle(element).getPropertyValue(token).trim();\n return value === \"\" ? undefined : value;\n}\n\nfunction resolveToken(styles: CSSStyleDeclaration, token: string, fallback: string): string {\n const value: string = styles.getPropertyValue(token).trim();\n return value === \"\" ? fallback : value;\n}\n\nexport function readChartTheme(element: HTMLElement): ChartTheme {\n const styles: CSSStyleDeclaration = window.getComputedStyle(element);\n return {\n seriesColors: CHART_SERIES_COLOR_TOKENS.map((token: string) =>\n resolveToken(styles, token, \"#4b5563\"),\n ),\n neutralColor: resolveToken(styles, NEUTRAL_COLOR_TOKEN, \"#9ca3af\"),\n // A escala de borda deste tema vai do claro para o escuro: `tertiary` é a mais escura,\n // não a mais suave. A grade fica na `default` para ficar atrás do dado, e o eixo na\n // `secondary` para se separar da grade sem competir com as linhas.\n axisLineColor: resolveToken(styles, \"--sds-color-border-default-secondary\", \"#9ca3af\"),\n splitLineColor: resolveToken(styles, \"--sds-color-border-default-default\", \"#e5e7eb\"),\n labelColor: resolveToken(styles, \"--sds-color-text-default-secondary\", \"#6b7280\"),\n emphasizedLabelColor: resolveToken(styles, \"--sds-color-text-default-default\", \"#111827\"),\n trackColor: resolveToken(styles, \"--sds-color-background-default-secondary\", \"#f3f4f6\"),\n tooltipBackgroundColor: resolveToken(\n styles,\n \"--sds-color-background-default-default\",\n \"#ffffff\",\n ),\n tooltipBorderColor: resolveToken(styles, \"--sds-color-border-default-default\", \"#d1d5db\"),\n fontFamily: resolveToken(styles, \"--sds-typography-body-font-family\", \"inherit\"),\n };\n}\n"],"names":["resolveColorToken","element","token","value","resolveToken","styles","fallback","readChartTheme","CHART_SERIES_COLOR_TOKENS","NEUTRAL_COLOR_TOKEN"],"mappings":"uHAkBO,SAASA,EAAkBC,EAAsBC,EAAmC,CACzF,MAAMC,EAAgB,OAAO,iBAAiBF,CAAO,EAAE,iBAAiBC,CAAK,EAAE,KAAA,EAC/E,OAAOC,IAAU,GAAK,OAAYA,CACpC,CAEA,SAASC,EAAaC,EAA6BH,EAAeI,EAA0B,CAC1F,MAAMH,EAAgBE,EAAO,iBAAiBH,CAAK,EAAE,KAAA,EACrD,OAAOC,IAAU,GAAKG,EAAWH,CACnC,CAEO,SAASI,EAAeN,EAAkC,CAC/D,MAAMI,EAA8B,OAAO,iBAAiBJ,CAAO,EACnE,MAAO,CACL,aAAcO,EAAAA,0BAA0B,IAAKN,GAC3CE,EAAaC,EAAQH,EAAO,SAAS,CAAA,EAEvC,aAAcE,EAAaC,EAAQI,EAAAA,0BAAqB,SAAS,EAIjE,cAAeL,EAAaC,EAAQ,uCAAwC,SAAS,EACrF,eAAgBD,EAAaC,EAAQ,qCAAsC,SAAS,EACpF,WAAYD,EAAaC,EAAQ,qCAAsC,SAAS,EAChF,qBAAsBD,EAAaC,EAAQ,mCAAoC,SAAS,EACxF,WAAYD,EAAaC,EAAQ,2CAA4C,SAAS,EACtF,uBAAwBD,EACtBC,EACA,yCACA,SAAA,EAEF,mBAAoBD,EAAaC,EAAQ,qCAAsC,SAAS,EACxF,WAAYD,EAAaC,EAAQ,oCAAqC,SAAS,CAAA,CAEnF"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { CHART_SERIES_COLOR_TOKENS as d, CHART_NEUTRAL_COLOR_TOKEN as a } from "./chart-palette.js";
|
|
2
|
-
function
|
|
2
|
+
function f(t, o) {
|
|
3
3
|
const r = window.getComputedStyle(t).getPropertyValue(o).trim();
|
|
4
4
|
return r === "" ? void 0 : r;
|
|
5
5
|
}
|
|
@@ -7,7 +7,7 @@ function e(t, o, r) {
|
|
|
7
7
|
const l = t.getPropertyValue(o).trim();
|
|
8
8
|
return l === "" ? r : l;
|
|
9
9
|
}
|
|
10
|
-
function
|
|
10
|
+
function n(t) {
|
|
11
11
|
const o = window.getComputedStyle(t);
|
|
12
12
|
return {
|
|
13
13
|
seriesColors: d.map(
|
|
@@ -20,6 +20,8 @@ function f(t) {
|
|
|
20
20
|
axisLineColor: e(o, "--sds-color-border-default-secondary", "#9ca3af"),
|
|
21
21
|
splitLineColor: e(o, "--sds-color-border-default-default", "#e5e7eb"),
|
|
22
22
|
labelColor: e(o, "--sds-color-text-default-secondary", "#6b7280"),
|
|
23
|
+
emphasizedLabelColor: e(o, "--sds-color-text-default-default", "#111827"),
|
|
24
|
+
trackColor: e(o, "--sds-color-background-default-secondary", "#f3f4f6"),
|
|
23
25
|
tooltipBackgroundColor: e(
|
|
24
26
|
o,
|
|
25
27
|
"--sds-color-background-default-default",
|
|
@@ -30,7 +32,7 @@ function f(t) {
|
|
|
30
32
|
};
|
|
31
33
|
}
|
|
32
34
|
export {
|
|
33
|
-
|
|
34
|
-
|
|
35
|
+
n as readChartTheme,
|
|
36
|
+
f as resolveColorToken
|
|
35
37
|
};
|
|
36
38
|
//# sourceMappingURL=chart-theme.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"chart-theme.js","sources":["../../../../../src/ui/components/charts/chart-theme.ts"],"sourcesContent":["import { CHART_SERIES_COLOR_TOKENS, CHART_NEUTRAL_COLOR_TOKEN as NEUTRAL_COLOR_TOKEN } from \"./chart-palette\";\n\nexport interface ChartTheme {\n seriesColors: string[];\n neutralColor: string;\n axisLineColor: string;\n splitLineColor: string;\n labelColor: string;\n tooltipBackgroundColor: string;\n tooltipBorderColor: string;\n fontFamily: string;\n}\n\n// O renderizador canvas não entende `var(--token)`, então a cor precisa chegar resolvida. A\n// resolução é contra o elemento hospedeiro para que tema aplicado em escopo menor que `:root`\n// continue valendo.\nexport function resolveColorToken(element: HTMLElement, token: string): string | undefined {\n const value: string = window.getComputedStyle(element).getPropertyValue(token).trim();\n return value === \"\" ? undefined : value;\n}\n\nfunction resolveToken(styles: CSSStyleDeclaration, token: string, fallback: string): string {\n const value: string = styles.getPropertyValue(token).trim();\n return value === \"\" ? fallback : value;\n}\n\nexport function readChartTheme(element: HTMLElement): ChartTheme {\n const styles: CSSStyleDeclaration = window.getComputedStyle(element);\n return {\n seriesColors: CHART_SERIES_COLOR_TOKENS.map((token: string) =>\n resolveToken(styles, token, \"#4b5563\"),\n ),\n neutralColor: resolveToken(styles, NEUTRAL_COLOR_TOKEN, \"#9ca3af\"),\n // A escala de borda deste tema vai do claro para o escuro: `tertiary` é a mais escura,\n // não a mais suave. A grade fica na `default` para ficar atrás do dado, e o eixo na\n // `secondary` para se separar da grade sem competir com as linhas.\n axisLineColor: resolveToken(styles, \"--sds-color-border-default-secondary\", \"#9ca3af\"),\n splitLineColor: resolveToken(styles, \"--sds-color-border-default-default\", \"#e5e7eb\"),\n labelColor: resolveToken(styles, \"--sds-color-text-default-secondary\", \"#6b7280\"),\n tooltipBackgroundColor: resolveToken(\n styles,\n \"--sds-color-background-default-default\",\n \"#ffffff\",\n ),\n tooltipBorderColor: resolveToken(styles, \"--sds-color-border-default-default\", \"#d1d5db\"),\n fontFamily: resolveToken(styles, \"--sds-typography-body-font-family\", \"inherit\"),\n };\n}\n"],"names":["resolveColorToken","element","token","value","resolveToken","styles","fallback","readChartTheme","CHART_SERIES_COLOR_TOKENS","NEUTRAL_COLOR_TOKEN"],"mappings":";
|
|
1
|
+
{"version":3,"file":"chart-theme.js","sources":["../../../../../src/ui/components/charts/chart-theme.ts"],"sourcesContent":["import { CHART_SERIES_COLOR_TOKENS, CHART_NEUTRAL_COLOR_TOKEN as NEUTRAL_COLOR_TOKEN } from \"./chart-palette\";\n\nexport interface ChartTheme {\n seriesColors: string[];\n neutralColor: string;\n axisLineColor: string;\n splitLineColor: string;\n labelColor: string;\n emphasizedLabelColor: string;\n trackColor: string;\n tooltipBackgroundColor: string;\n tooltipBorderColor: string;\n fontFamily: string;\n}\n\n// O renderizador canvas não entende `var(--token)`, então a cor precisa chegar resolvida. A\n// resolução é contra o elemento hospedeiro para que tema aplicado em escopo menor que `:root`\n// continue valendo.\nexport function resolveColorToken(element: HTMLElement, token: string): string | undefined {\n const value: string = window.getComputedStyle(element).getPropertyValue(token).trim();\n return value === \"\" ? undefined : value;\n}\n\nfunction resolveToken(styles: CSSStyleDeclaration, token: string, fallback: string): string {\n const value: string = styles.getPropertyValue(token).trim();\n return value === \"\" ? fallback : value;\n}\n\nexport function readChartTheme(element: HTMLElement): ChartTheme {\n const styles: CSSStyleDeclaration = window.getComputedStyle(element);\n return {\n seriesColors: CHART_SERIES_COLOR_TOKENS.map((token: string) =>\n resolveToken(styles, token, \"#4b5563\"),\n ),\n neutralColor: resolveToken(styles, NEUTRAL_COLOR_TOKEN, \"#9ca3af\"),\n // A escala de borda deste tema vai do claro para o escuro: `tertiary` é a mais escura,\n // não a mais suave. A grade fica na `default` para ficar atrás do dado, e o eixo na\n // `secondary` para se separar da grade sem competir com as linhas.\n axisLineColor: resolveToken(styles, \"--sds-color-border-default-secondary\", \"#9ca3af\"),\n splitLineColor: resolveToken(styles, \"--sds-color-border-default-default\", \"#e5e7eb\"),\n labelColor: resolveToken(styles, \"--sds-color-text-default-secondary\", \"#6b7280\"),\n emphasizedLabelColor: resolveToken(styles, \"--sds-color-text-default-default\", \"#111827\"),\n trackColor: resolveToken(styles, \"--sds-color-background-default-secondary\", \"#f3f4f6\"),\n tooltipBackgroundColor: resolveToken(\n styles,\n \"--sds-color-background-default-default\",\n \"#ffffff\",\n ),\n tooltipBorderColor: resolveToken(styles, \"--sds-color-border-default-default\", \"#d1d5db\"),\n fontFamily: resolveToken(styles, \"--sds-typography-body-font-family\", \"inherit\"),\n };\n}\n"],"names":["resolveColorToken","element","token","value","resolveToken","styles","fallback","readChartTheme","CHART_SERIES_COLOR_TOKENS","NEUTRAL_COLOR_TOKEN"],"mappings":";AAkBO,SAASA,EAAkBC,GAAsBC,GAAmC;AACzF,QAAMC,IAAgB,OAAO,iBAAiBF,CAAO,EAAE,iBAAiBC,CAAK,EAAE,KAAA;AAC/E,SAAOC,MAAU,KAAK,SAAYA;AACpC;AAEA,SAASC,EAAaC,GAA6BH,GAAeI,GAA0B;AAC1F,QAAMH,IAAgBE,EAAO,iBAAiBH,CAAK,EAAE,KAAA;AACrD,SAAOC,MAAU,KAAKG,IAAWH;AACnC;AAEO,SAASI,EAAeN,GAAkC;AAC/D,QAAMI,IAA8B,OAAO,iBAAiBJ,CAAO;AACnE,SAAO;AAAA,IACL,cAAcO,EAA0B;AAAA,MAAI,CAACN,MAC3CE,EAAaC,GAAQH,GAAO,SAAS;AAAA,IAAA;AAAA,IAEvC,cAAcE,EAAaC,GAAQI,GAAqB,SAAS;AAAA;AAAA;AAAA;AAAA,IAIjE,eAAeL,EAAaC,GAAQ,wCAAwC,SAAS;AAAA,IACrF,gBAAgBD,EAAaC,GAAQ,sCAAsC,SAAS;AAAA,IACpF,YAAYD,EAAaC,GAAQ,sCAAsC,SAAS;AAAA,IAChF,sBAAsBD,EAAaC,GAAQ,oCAAoC,SAAS;AAAA,IACxF,YAAYD,EAAaC,GAAQ,4CAA4C,SAAS;AAAA,IACtF,wBAAwBD;AAAA,MACtBC;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,IAEF,oBAAoBD,EAAaC,GAAQ,sCAAsC,SAAS;AAAA,IACxF,YAAYD,EAAaC,GAAQ,qCAAqC,SAAS;AAAA,EAAA;AAEnF;"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("../../../vendor/clsx/dist/clsx.cjs"),n=require("react-aria-components");;/* empty css */const m=require("../../icons/IconX.cjs"),r=require("../Text/Text.cjs"),c=require("../IconButton/IconButton.cjs"),j=require("../Button/Button.cjs"),N=require("../../hooks/useOverlayPortal.cjs");function u({className:o,type:s="card",size:i="medium",...a}){const l=t.clsx(o,"dialog",`dialog-type-${s}`,`dialog-size-${i}`);return e.jsx(n.Dialog,{className:l,...a})}const y=({onPress:o})=>e.jsx(c.IconButton,{className:"dialog-close","aria-label":"Dismiss dialog",onPress:o,variant:"subtle",size:"small",children:e.jsx(m.IconX,{})});function g({...o}){return e.jsx(n.DialogTrigger,{...o})}function B({label:o,icon:s,variant:i,children:a,...l}){return e.jsxs(g,{children:[s?e.jsx(c.IconButton,{variant:i,"aria-label":o,children:s}):e.jsx(j.Button,{variant:i,children:o}),e.jsx(d,{isDismissable:!0,children:e.jsx(u,{...l,children:a})})]})}function T({className:o,...s}){const i=t.clsx(o,"dialog-title");return e.jsx(r.TextHeading,{...s,slot:"title",className:i})}function b({className:o,...s}){const i=t.clsx(o,"dialog-description");return e.jsx(r.Text,{...s,className:i})}function p({bleed:o,className:s,...i}){const a=t.clsx(s,"dialog-body",o&&"dialog-body-bleed");return e.jsx("div",{...i,className:a})}function d({children:o,className:s,isDismissable:i,UNSTABLE_portalContainer:a,...l}){const x=t.clsx(s,"dialog-backdrop"),D=N.useOverlayPortalContainer();return e.jsx(n.ModalOverlay,{className:x,isDismissable:i,...l,UNSTABLE_portalContainer:a??D,children:e.jsx(n.Modal,{className:"dialog-container",children:o})})}exports.Dialog=u;exports.DialogBody=p;exports.DialogButton=B;exports.DialogClose=y;exports.DialogDescription=b;exports.DialogModal=d;exports.DialogTitle=T;exports.DialogTrigger=g;
|
|
2
2
|
//# sourceMappingURL=Dialog.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dialog.cjs","sources":["../../../../../src/ui/primitives/Dialog/Dialog.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { useOverlayPortalContainer } from \"hooks\";\nimport { IconX } from \"icons\";\nimport {\n Button,\n ButtonProps,\n IconButton,\n IconButtonProps,\n Text,\n TextHeading,\n type TextHeadingProps,\n type TextProps,\n} from \"primitives\";\nimport {\n Dialog as RACDialog,\n DialogTrigger as RACDialogTrigger,\n Modal as RACModal,\n ModalOverlay as RACModalOverlay,\n type DialogProps as RACDialogProps,\n type DialogTriggerProps as RACDialogTriggerProps,\n type ModalOverlayProps as RACModalOverlayProps,\n} from \"react-aria-components\";\nimport \"./dialog.css\";\n\nexport type DialogProps = RACDialogProps & {\n type?: \"sheet\" | \"card\";\n};\nexport function Dialog({
|
|
1
|
+
{"version":3,"file":"Dialog.cjs","sources":["../../../../../src/ui/primitives/Dialog/Dialog.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { useOverlayPortalContainer } from \"hooks\";\nimport { IconX } from \"icons\";\nimport {\n Button,\n ButtonProps,\n IconButton,\n IconButtonProps,\n Text,\n TextHeading,\n type TextHeadingProps,\n type TextProps,\n} from \"primitives\";\nimport {\n Dialog as RACDialog,\n DialogTrigger as RACDialogTrigger,\n Modal as RACModal,\n ModalOverlay as RACModalOverlay,\n type DialogProps as RACDialogProps,\n type DialogTriggerProps as RACDialogTriggerProps,\n type ModalOverlayProps as RACModalOverlayProps,\n} from \"react-aria-components\";\nimport \"./dialog.css\";\n\nexport type DialogSize = \"medium\" | \"large\" | \"xlarge\";\n\nexport type DialogProps = RACDialogProps & {\n type?: \"sheet\" | \"card\";\n size?: DialogSize;\n};\nexport function Dialog({\n className,\n type = \"card\",\n size = \"medium\",\n ...props\n}: DialogProps) {\n const classNames = clsx(\n className,\n \"dialog\",\n `dialog-type-${type}`,\n `dialog-size-${size}`,\n );\n return <RACDialog className={classNames} {...props} />;\n}\n\nexport type DialogCloseProps = Pick<IconButtonProps, \"onPress\">;\nexport const DialogClose = ({ onPress }: DialogCloseProps) => (\n <IconButton\n className=\"dialog-close\"\n aria-label=\"Dismiss dialog\"\n onPress={onPress}\n variant=\"subtle\"\n size=\"small\"\n >\n <IconX />\n </IconButton>\n);\n\nexport type DialogTriggerProps = RACDialogTriggerProps;\nexport function DialogTrigger({ ...props }: DialogTriggerProps) {\n return <RACDialogTrigger {...props} />;\n}\n\nexport interface DialogButtonProps\n extends DialogProps,\n Omit<DialogTriggerProps, \"children\"> {\n label: string;\n variant?: ButtonProps[\"variant\"];\n icon?: React.ReactNode;\n}\nexport function DialogButton({\n label,\n icon,\n variant,\n children,\n ...props\n}: DialogButtonProps) {\n return (\n <DialogTrigger>\n {icon ? (\n <IconButton variant={variant} aria-label={label}>\n {icon}\n </IconButton>\n ) : (\n <Button variant={variant}>{label}</Button>\n )}\n <DialogModal isDismissable>\n <Dialog {...props}>{children}</Dialog>\n </DialogModal>\n </DialogTrigger>\n );\n}\n\nexport type DialogTitleProps = TextHeadingProps;\nexport function DialogTitle({ className, ...props }: DialogTitleProps) {\n const classNames = clsx(className, \"dialog-title\");\n return <TextHeading {...props} slot=\"title\" className={classNames} />;\n}\n\nexport type DialogDescriptionProps = TextProps;\nexport function DialogDescription({\n className,\n ...props\n}: DialogDescriptionProps) {\n const classNames = clsx(className, \"dialog-description\");\n return <Text {...props} className={classNames} />;\n}\n\nexport type DialogBodyProps = {\n bleed?: boolean;\n} & React.ComponentPropsWithoutRef<\"div\">;\nexport function DialogBody({ bleed, className, ...props }: DialogBodyProps) {\n const classNames = clsx(\n className,\n \"dialog-body\",\n bleed && \"dialog-body-bleed\",\n );\n return <div {...props} className={classNames} />;\n}\n\nexport type DialogModalProps = RACModalOverlayProps;\nexport function DialogModal({\n children,\n className,\n isDismissable,\n UNSTABLE_portalContainer,\n ...props\n}: DialogModalProps) {\n const classNames = clsx(className, \"dialog-backdrop\");\n // Sem um container explícito, o RAC faz portal no document.body — fora da\n // shadow root do MFE, onde o CSS do DS não alcança, e o dialog abre sem\n // estilo. Ver OverlayPortalProvider em ui/hooks/useOverlayPortal.\n const portalContainer = useOverlayPortalContainer();\n return (\n <RACModalOverlay\n className={classNames}\n isDismissable={isDismissable}\n {...props}\n UNSTABLE_portalContainer={UNSTABLE_portalContainer ?? portalContainer}\n >\n <RACModal className={\"dialog-container\"}>{children}</RACModal>\n </RACModalOverlay>\n );\n}\n"],"names":["Dialog","className","type","size","props","classNames","clsx","jsx","RACDialog","DialogClose","onPress","IconButton","IconX","DialogTrigger","RACDialogTrigger","DialogButton","label","icon","variant","children","Button","DialogModal","DialogTitle","TextHeading","DialogDescription","Text","DialogBody","bleed","isDismissable","UNSTABLE_portalContainer","portalContainer","useOverlayPortalContainer","RACModalOverlay","RACModal"],"mappings":"qaA8BO,SAASA,EAAO,CACrB,UAAAC,EACA,KAAAC,EAAO,OACP,KAAAC,EAAO,SACP,GAAGC,CACL,EAAgB,CACd,MAAMC,EAAaC,EAAAA,KACjBL,EACA,SACA,eAAeC,CAAI,GACnB,eAAeC,CAAI,EAAA,EAErB,OAAOI,EAAAA,IAACC,EAAAA,OAAA,CAAU,UAAWH,EAAa,GAAGD,EAAO,CACtD,CAGO,MAAMK,EAAc,CAAC,CAAE,QAAAC,CAAA,IAC5BH,EAAAA,IAACI,EAAAA,WAAA,CACC,UAAU,eACV,aAAW,iBACX,QAAAD,EACA,QAAQ,SACR,KAAK,QAEL,eAACE,EAAAA,MAAA,CAAA,CAAM,CAAA,CACT,EAIK,SAASC,EAAc,CAAE,GAAGT,GAA6B,CAC9D,OAAOG,MAACO,EAAAA,cAAA,CAAkB,GAAGV,CAAA,CAAO,CACtC,CASO,SAASW,EAAa,CAC3B,MAAAC,EACA,KAAAC,EACA,QAAAC,EACA,SAAAC,EACA,GAAGf,CACL,EAAsB,CACpB,cACGS,EAAA,CACE,SAAA,CAAAI,EACCV,EAAAA,IAACI,EAAAA,WAAA,CAAW,QAAAO,EAAkB,aAAYF,EACvC,WACH,EAEAT,EAAAA,IAACa,EAAAA,OAAA,CAAO,QAAAF,EAAmB,SAAAF,EAAM,EAEnCT,EAAAA,IAACc,GAAY,cAAa,GACxB,eAACrB,EAAA,CAAQ,GAAGI,EAAQ,SAAAe,CAAA,CAAS,CAAA,CAC/B,CAAA,EACF,CAEJ,CAGO,SAASG,EAAY,CAAE,UAAArB,EAAW,GAAGG,GAA2B,CACrE,MAAMC,EAAaC,EAAAA,KAAKL,EAAW,cAAc,EACjD,aAAQsB,EAAAA,YAAA,CAAa,GAAGnB,EAAO,KAAK,QAAQ,UAAWC,EAAY,CACrE,CAGO,SAASmB,EAAkB,CAChC,UAAAvB,EACA,GAAGG,CACL,EAA2B,CACzB,MAAMC,EAAaC,EAAAA,KAAKL,EAAW,oBAAoB,EACvD,OAAOM,EAAAA,IAACkB,EAAAA,KAAA,CAAM,GAAGrB,EAAO,UAAWC,EAAY,CACjD,CAKO,SAASqB,EAAW,CAAE,MAAAC,EAAO,UAAA1B,EAAW,GAAGG,GAA0B,CAC1E,MAAMC,EAAaC,EAAAA,KACjBL,EACA,cACA0B,GAAS,mBAAA,EAEX,OAAOpB,EAAAA,IAAC,MAAA,CAAK,GAAGH,EAAO,UAAWC,EAAY,CAChD,CAGO,SAASgB,EAAY,CAC1B,SAAAF,EACA,UAAAlB,EACA,cAAA2B,EACA,yBAAAC,EACA,GAAGzB,CACL,EAAqB,CACnB,MAAMC,EAAaC,EAAAA,KAAKL,EAAW,iBAAiB,EAI9C6B,EAAkBC,EAAAA,0BAAA,EACxB,OACExB,EAAAA,IAACyB,EAAAA,aAAA,CACC,UAAW3B,EACX,cAAAuB,EACC,GAAGxB,EACJ,yBAA0ByB,GAA4BC,EAEtD,SAAAvB,EAAAA,IAAC0B,EAAAA,MAAA,CAAS,UAAW,mBAAqB,SAAAd,CAAA,CAAS,CAAA,CAAA,CAGzD"}
|