vue-data-ui 2.2.91 → 2.2.93

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (58) hide show
  1. package/dist/index-DZlxUin4.js +57288 -0
  2. package/dist/{index.es-Dc9Fd4o6.js → index.es-Cgqo-FBk.js} +1 -1
  3. package/dist/style.css +1 -1
  4. package/dist/vue-data-ui.js +61 -455
  5. package/package.json +1 -1
  6. package/dist/data-table-d-VcuH-r.js +0 -1488
  7. package/dist/legend-DJCYLsl_.js +0 -61
  8. package/dist/themes-lgjsYHsH.js +0 -4967
  9. package/dist/title-BF-9Qcni.js +0 -56
  10. package/dist/tooltip-D85WEOKi.js +0 -94
  11. package/dist/user-options-DZgCz8UA.js +0 -415
  12. package/dist/vue-ui-3d-bar-DW7kGJSz.js +0 -20360
  13. package/dist/vue-ui-age-pyramid-4hcuKpFY.js +0 -781
  14. package/dist/vue-ui-annotator-C83FVvl8.js +0 -2175
  15. package/dist/vue-ui-candlestick-diclGj95.js +0 -807
  16. package/dist/vue-ui-chestnut-ACetHLdG.js +0 -1049
  17. package/dist/vue-ui-cursor-Rx7UNaYT.js +0 -229
  18. package/dist/vue-ui-dashboard-B3PlN0ks.js +0 -231
  19. package/dist/vue-ui-digits-CxMXID42.js +0 -154
  20. package/dist/vue-ui-donut-DMiwVXNd.js +0 -1534
  21. package/dist/vue-ui-dumbbell-B_X1T8TR.js +0 -621
  22. package/dist/vue-ui-flow-B72wzQ6V.js +0 -451
  23. package/dist/vue-ui-galaxy-DXX5yivT.js +0 -482
  24. package/dist/vue-ui-gauge-Cs9PDurH.js +0 -466
  25. package/dist/vue-ui-heatmap-PcoNSLdN.js +0 -581
  26. package/dist/vue-ui-kpi-DchEmPtB.js +0 -55
  27. package/dist/vue-ui-mini-loader-DltJLkqy.js +0 -131
  28. package/dist/vue-ui-molecule-CWvukBzs.js +0 -746
  29. package/dist/vue-ui-mood-radar-DEfdtIi8.js +0 -544
  30. package/dist/vue-ui-nested-donuts-9URpqgXE.js +0 -768
  31. package/dist/vue-ui-onion-C0eowUT6.js +0 -551
  32. package/dist/vue-ui-parallel-coordinate-plot-Bc_pAaPJ.js +0 -647
  33. package/dist/vue-ui-quadrant-_ddVAm9V.js +0 -1174
  34. package/dist/vue-ui-quick-chart-Cio0hDYO.js +0 -1310
  35. package/dist/vue-ui-radar-Dyg38i33.js +0 -853
  36. package/dist/vue-ui-rating-CE1Lmwd2.js +0 -271
  37. package/dist/vue-ui-relation-circle-BMlB3k3d.js +0 -303
  38. package/dist/vue-ui-rings-BuXeijvb.js +0 -507
  39. package/dist/vue-ui-scatter-B1hZfOua.js +0 -870
  40. package/dist/vue-ui-screenshot-0QXgxzGs.js +0 -160
  41. package/dist/vue-ui-smiley-B7kR7exr.js +0 -763
  42. package/dist/vue-ui-spark-trend-BmL2KiYL.js +0 -245
  43. package/dist/vue-ui-sparkgauge-BMzFv14L.js +0 -158
  44. package/dist/vue-ui-sparkhistogram-DWpOXqHm.js +0 -243
  45. package/dist/vue-ui-sparkstackbar-DB9VQXlc.js +0 -244
  46. package/dist/vue-ui-strip-plot-DyN6P0JO.js +0 -614
  47. package/dist/vue-ui-table-DM3zL89q.js +0 -2180
  48. package/dist/vue-ui-table-heatmap-gWx0Nslu.js +0 -237
  49. package/dist/vue-ui-thermometer-Bcqv5kd_.js +0 -384
  50. package/dist/vue-ui-timer-BIFxjujK.js +0 -451
  51. package/dist/vue-ui-tiremarks-zBwHpED_.js +0 -248
  52. package/dist/vue-ui-treemap-BaplVc_z.js +0 -719
  53. package/dist/vue-ui-vertical-bar-CdK6ZJPM.js +0 -734
  54. package/dist/vue-ui-waffle-COOzH7M3.js +0 -635
  55. package/dist/vue-ui-wheel-BEpuVTBk.js +0 -226
  56. package/dist/vue-ui-word-cloud-DNqxAAiX.js +0 -344
  57. package/dist/vue-ui-xy-_mHq-czW.js +0 -2058
  58. package/dist/vue-ui-xy-canvas-DqX8Gee5.js +0 -1003
@@ -1,1049 +0,0 @@
1
- import { useCssVars as Pe, computed as $, ref as z, onMounted as Ve, openBlock as a, createElementBlock as o, normalizeClass as m, normalizeStyle as h, createBlock as Q, unref as y, createSlots as Re, withCtx as A, renderSlot as X, normalizeProps as Be, guardReactiveProps as Me, createCommentVNode as b, toDisplayString as n, createElementVNode as s, Fragment as p, renderList as _, createTextVNode as Y, withKeys as je, createVNode as Xe, nextTick as ve } from "vue";
2
- import { _ as Oe, e as Ge, f as Ae, p as I, g as Ee, k as Z, j as H, h as ee, i as Ue, X as De, x as ye, o as F, F as he, m as fe, r as Ye, s as L, u as q, B as qe, v as He, w as We } from "./data-table-d-VcuH-r.js";
3
- import { t as Ke } from "./themes-lgjsYHsH.js";
4
- import { U as Je } from "./user-options-DZgCz8UA.js";
5
- import { u as Qe, a as Ze, S as et, A as tt } from "./vue-ui-3d-bar-DW7kGJSz.js";
6
- import { u as be } from "./title-BF-9Qcni.js";
7
- const lt = ["id"], at = ["xmlns", "viewBox"], ot = { key: 0 }, st = ["fill", "font-weight", "font-size", "x", "y"], ut = ["fill", "font-weight", "font-size", "x", "y"], nt = ["id"], rt = ["stop-color"], it = ["stop-color"], ct = ["id"], dt = ["stop-color"], vt = ["stop-color"], yt = ["id"], ht = ["stop-color"], ft = ["stop-color"], bt = ["stop-color"], pt = ["id"], _t = ["stop-color"], gt = ["stop-color"], xt = ["stop-color"], mt = ["id"], kt = ["stop-color"], wt = ["stop-color"], $t = ["stop-color"], Ct = { key: 1 }, zt = ["x", "y", "font-size", "font-weight", "fill"], Tt = ["x", "y", "font-size", "font-weight", "fill"], Ft = ["d", "stroke"], Nt = ["cx", "cy", "r", "fill"], St = ["cx", "cy", "r", "fill", "stroke", "stroke-width", "onClick"], It = { key: 2 }, Lt = ["x", "y", "font-size", "fill", "onClick"], Pt = { key: 0 }, Vt = ["x", "y", "fill", "font-size", "font-weight"], Rt = ["x", "y", "height", "width", "fill", "rx", "onClick"], Bt = ["x", "y", "height", "width", "fill", "rx", "stroke", "stroke-width", "onClick"], Mt = { key: 3 }, jt = ["x", "y", "fill", "font-size", "onClick"], Xt = ["d", "stroke"], Ot = ["cx", "cy", "fill", "onClick"], Gt = ["fill", "cx", "cy", "r", "onClick"], At = { key: 4 }, Et = ["x", "y", "font-size", "font-weight", "fill"], Ut = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Dt = ["y", "height", "width"], Yt = { style: { width: "100%", height: "100%", display: "flex", "align-items": "center", "justify-content": "center", "flex-direction": "column" } }, qt = { style: { display: "flex", "align-items": "center", "justify-content": "center", gap: "12px", "flex-wrap": "wrap", "flex-direction": "row" } }, Ht = {
8
- viewBox: "0 0 20 20",
9
- height: "16",
10
- width: "16"
11
- }, Wt = ["fill"], Kt = { key: 6 }, Jt = ["y", "height", "width"], Qt = { style: { width: "100%", height: "100%", display: "flex", "align-items": "center", "justify-content": "center", "flex-direction": "column" } }, Zt = { style: { display: "flex", "align-items": "center", "justify-content": "center", gap: "12px", "flex-wrap": "wrap", "flex-direction": "row" } }, el = {
12
- viewBox: "0 0 20 20",
13
- height: "16",
14
- width: "16"
15
- }, tl = ["fill"], ll = ["d", "stroke"], al = ["cx", "cy", "fill"], ol = ["cx", "cy", "fill"], sl = ["d", "stroke"], ul = ["cx", "cy", "fill"], nl = ["cx", "cy", "fill"], rl = ["x", "y", "fill", "font-size", "font-weight"], il = ["x", "y", "fill", "font-size", "font-weight"], cl = ["x", "text-anchor", "y", "fill", "font-size"], dl = ["x", "text-anchor", "y", "fill", "font-size"], vl = ["x", "text-anchor", "y", "fill", "font-size"], yl = ["x", "text-anchor", "y", "fill", "font-size"], hl = ["x", "text-anchor", "y", "fill", "font-size"], fl = ["x", "y", "font-size", "fill"], bl = ["x", "y", "font-size", "fill"], pl = ["x", "y", "font-size", "fill"], _l = { style: { "padding-top": "36px", position: "relative" } }, gl = { class: "vue-ui-data-table" }, xl = { key: 0 }, ml = ["data-cell"], kl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, wl = { key: 0 }, $l = { key: 1 }, Cl = ["data-cell"], zl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Tl = { key: 0 }, Fl = { key: 1 }, Nl = ["data-cell"], Sl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Il = { key: 0 }, Ll = { key: 1 }, Pl = ["data-cell"], Vl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Rl = { key: 0 }, Bl = { key: 1 }, Ml = ["data-cell"], jl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Xl = { key: 0 }, Ol = { key: 1 }, Gl = ["data-cell"], Al = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, El = { key: 0 }, Ul = { key: 1 }, Dl = ["data-cell"], Yl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, ql = { key: 0 }, Hl = { key: 1 }, Wl = ["data-cell"], Kl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Jl = ["data-cell"], Ql = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Zl = ["data-cell"], ea = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, ta = ["data-cell"], la = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, aa = ["data-cell"], oa = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, sa = {
16
- __name: "vue-ui-chestnut",
17
- props: {
18
- config: {
19
- type: Object,
20
- default() {
21
- return {};
22
- }
23
- },
24
- dataset: {
25
- type: Array,
26
- default() {
27
- return [];
28
- }
29
- }
30
- },
31
- emits: ["selectRoot", "selectBranch", "selectNut"],
32
- setup(pe, { expose: _e, emit: O }) {
33
- const P = pe;
34
- Pe((l) => ({
35
- a08a8b28: l.tdo
36
- }));
37
- const { vue_ui_chestnut: ge } = Qe(), E = $(() => !!P.dataset && P.dataset.length), k = z(Ge()), te = z(null), xe = z(null), le = z(0), e = $(() => {
38
- const l = be({
39
- userConfig: P.config,
40
- defaultConfig: ge
41
- });
42
- return l.theme ? {
43
- ...be({
44
- userConfig: Ke.vue_ui_chestnut[l.theme] || P.config,
45
- defaultConfig: l
46
- }),
47
- customPalette: Ae[l.theme] || I
48
- } : l;
49
- }), { isPrinting: me, isImaging: ke, generatePdf: ae, generateImage: oe } = Ze({
50
- elementId: `vue-ui-chestnut_${k.value}`,
51
- fileName: e.value.style.chart.layout.title.text || "vue-ui-chestnut"
52
- }), W = $(() => Ee(e.value.customPalette)), U = z({
53
- showTable: e.value.table.show
54
- }), se = z(null), ue = z(!1), we = $(() => e.value.table.responsiveBreakpoint), r = z({
55
- gap: 6,
56
- padding: {
57
- top: 102,
58
- left: 12,
59
- right: 12,
60
- bottom: 96
61
- },
62
- width: 1024,
63
- height: 0,
64
- branchSize: 32,
65
- branchStart: 128
66
- }), C = $(() => ({
67
- left: r.value.padding.left,
68
- top: r.value.padding.top,
69
- right: r.value.width - r.value.padding.right,
70
- bottom: r.value.height - r.value.padding.bottom,
71
- width: r.value.width - (r.value.padding.left + r.value.padding.right),
72
- height: r.value.height - (r.value.padding.top + r.value.padding.bottom),
73
- seedX: r.value.padding.left + 64
74
- })), V = $(() => E.value ? P.dataset.flatMap((l) => l.branches.map((i) => i.value)).reduce((l, i) => l + i) : 0), T = $(() => (P.dataset.forEach((l, i) => {
75
- Z({
76
- datasetObject: l,
77
- requiredAttributes: ["name", "branches"]
78
- }).forEach((t) => {
79
- H({
80
- componentName: "VueUiChestnut",
81
- type: "datasetSerieAttribute",
82
- property: t,
83
- index: i
84
- });
85
- }), l.branches && l.branches.forEach((t, u) => {
86
- Z({
87
- datasetObject: t,
88
- requiredAttributes: ["name", "value"]
89
- }).forEach((f) => {
90
- H({
91
- componentName: "VueUiChestnut",
92
- type: "datasetSerieAttribute",
93
- property: f,
94
- index: `${i} - ${u}`
95
- });
96
- }), t.breakdown && t.breakdown.forEach((f, v) => {
97
- Z({
98
- datasetObject: f,
99
- requiredAttributes: ["name", "value"]
100
- }).forEach((g) => {
101
- H({
102
- componentName: "VueUiChestnut",
103
- type: "datasetSerieAttribute",
104
- property: g,
105
- index: `${i} - ${u} - ${v}`
106
- });
107
- });
108
- });
109
- });
110
- }), P.dataset.map((l, i) => {
111
- const t = l.branches.map((u) => u.value).reduce((u, f) => u + f);
112
- return {
113
- ...l,
114
- color: ee(l.color) || W.value[i] || I[i] || I[i % I.length],
115
- id: l.id || `root_${i}_${k.value}`,
116
- type: "root",
117
- total: t,
118
- rootIndex: i,
119
- branches: l.branches.map((u, f) => ({
120
- ...u,
121
- rootName: l.name,
122
- rootIndex: i,
123
- color: ee(l.color) || W.value[i] || I[i] || I[i % I.length],
124
- value: u.value >= 0 ? u.value : 0,
125
- id: u.id || `branch_${i}_${f}_${k.value}`,
126
- proportionToRoot: u.value / t,
127
- type: "branch",
128
- breakdown: u.breakdown.map((v, g) => ({
129
- table: {
130
- rootName: l.name,
131
- rootValue: t,
132
- rootToTotal: t / V.value,
133
- branchName: u.name,
134
- branchValue: u.value,
135
- branchToTotal: u.value / V.value,
136
- branchToRoot: u.value / t,
137
- nutName: v.name,
138
- nutValue: v.value,
139
- nutToTotal: v.value / V.value,
140
- nutToRoot: v.value / t,
141
- nutToBranch: v.value / u.value
142
- },
143
- ...v,
144
- type: "nut",
145
- branchName: u.name,
146
- rootName: l.name,
147
- branchTotal: u.value >= 0 ? u.value : 0,
148
- proportionToBranch: v.value / u.value,
149
- proportionToRoot: v.value / t,
150
- proportionToTree: v.value / V.value,
151
- rootIndex: i,
152
- id: v.id || `nut_${i}_${f}_${g}_${k.value}`,
153
- color: ee(v.color) || W.value[g] || I[g] || I[g % I.length],
154
- value: v.value >= 0 ? v.value : 0
155
- }))
156
- }))
157
- };
158
- })));
159
- function $e() {
160
- return T.value;
161
- }
162
- const Ce = $(() => T.value.flatMap((l) => l.branches).length), ze = $(() => Math.max(...T.value.map((l) => l.branches.map((i) => i.value).reduce((i, t) => i + t, 0)))), Te = $(() => Math.max(...T.value.flatMap((l) => l.branches.map((i) => i.value)))), ne = $(() => 256 + r.value.padding.left), B = $(() => T.value.sort((l, i) => i.total - l.total).map((l, i) => {
163
- const t = C.value.height / T.value.length / 2, u = l.total / ze.value * (t > 64 ? 64 : t);
164
- return {
165
- ...l,
166
- x: C.value.seedX,
167
- y: C.value.top + C.value.height / T.value.length * (i + 1) - (C.value.height / T.value.length / 2 + r.value.gap / 2),
168
- r: u < r.value.branchSize / 2 ? r.value.branchSize / 2 : u
169
- };
170
- })), Fe = $(() => e.value.style.chart.layout.branches.widthRatio <= 0 ? 0.1 : e.value.style.chart.layout.branches.widthRatio > 1.8 ? 1.8 : e.value.style.chart.layout.branches.widthRatio), Ne = $(() => B.value.flatMap((l) => l.branches)), R = $(() => Ne.value.sort((l, i) => i.value - l.value).map((l, i) => ({
171
- ...l,
172
- y1: i * r.value.branchSize + C.value.top + i * r.value.gap,
173
- y2: i * r.value.branchSize + r.value.branchSize,
174
- x1: ne.value,
175
- x2: 384 * l.value / Te.value * Fe.value + ne.value
176
- })));
177
- function K(l) {
178
- const i = B.value.find((t) => t.rootIndex === l.rootIndex);
179
- return { x: i.x, y: i.y, r: i.r };
180
- }
181
- const d = z(null), M = z(null), x = z(null), N = z(null);
182
- function w() {
183
- d.value = null, x.value = null, N.value = null;
184
- }
185
- function S(l) {
186
- return N.value ? N.value === null ? !0 : l.type === "root" ? l.id === N.value.id : l.rootIndex === N.value.rootIndex : d.value === null && x.value === null ? !0 : l.type === "nut" ? d.value.id === l.id : l.type === "branch" ? x.value.id === l.id : l.type === "root" ? x.value && x.value.rootIndex === l.rootIndex || d.value && d.value.rootIndex === l.rootIndex : !1;
187
- }
188
- function re(l) {
189
- w(), ve(() => {
190
- d.value = l, x.value = l, M.value = fe(
191
- { series: l.breakdown, base: 1 },
192
- l.x2 + 24 + e.value.style.chart.layout.nuts.offsetX,
193
- l.y1 + r.value.branchSize / 2,
194
- 80,
195
- 80
196
- ), O("selectNut", l.breakdown);
197
- });
198
- }
199
- function j() {
200
- d.value = null, M.value = null, O("selectNut", null);
201
- }
202
- function J(l) {
203
- x.value && x.value.id === l.id ? (x.value = null, w(), O("selectBranch", null)) : (w(), x.value = l, O("selectBranch", l));
204
- }
205
- function ie(l) {
206
- N.value && N.value.id === l.id ? (w(), O("selectRoot", null)) : (w(), N.value = l, O("selectRoot", l));
207
- }
208
- function Se() {
209
- return C.value.bottom - (d.value.y1 + 180) < 0 ? 0 : C.value.bottom;
210
- }
211
- function G(l) {
212
- return l.proportion * 100 > e.value.style.chart.layout.nuts.selected.labels.dataLabels.hideUnderValue;
213
- }
214
- function Ie() {
215
- new ResizeObserver((i) => {
216
- i.forEach((t) => {
217
- ue.value = t.contentRect.width < we.value;
218
- });
219
- }).observe(se.value);
220
- }
221
- Ve(() => {
222
- Ue(P.dataset) && H({
223
- componentName: "VueUiChestnut",
224
- type: "dataset"
225
- });
226
- const l = Ce.value * (r.value.branchSize + r.value.gap) + r.value.padding.top + r.value.padding.bottom;
227
- r.value.height = l, Ie();
228
- });
229
- const c = $(() => {
230
- const l = [
231
- e.value.table.th.translations.rootName,
232
- e.value.table.th.translations.rootValue,
233
- e.value.table.th.translations.rootToTotal,
234
- e.value.table.th.translations.branchName,
235
- e.value.table.th.translations.branchValue,
236
- e.value.table.th.translations.branchToRoot,
237
- e.value.table.th.translations.branchToTotal,
238
- e.value.table.th.translations.nutName,
239
- e.value.table.th.translations.nutValue,
240
- e.value.table.th.translations.nutToBranch,
241
- e.value.table.th.translations.nutToRoot,
242
- e.value.table.th.translations.nutToTotal
243
- ], i = T.value.flatMap((t, u) => t.branches.flatMap((f, v) => f.breakdown.flatMap((g, ua) => g.table)));
244
- return { head: l, body: i };
245
- });
246
- function ce() {
247
- ve(() => {
248
- const l = [[e.value.style.chart.layout.title.text], [e.value.style.chart.layout.title.subtitle.text], [""], ["Grand total", V.value], [""]], i = c.value.head, t = c.value.body.map((v, g) => [
249
- c.value.body[g - 1] && c.value.body[g - 1].rootName === v.rootName ? "" : v.rootName,
250
- c.value.body[g - 1] && c.value.body[g - 1].rootName === v.rootName ? "" : v.rootValue,
251
- c.value.body[g - 1] && c.value.body[g - 1].rootName === v.rootName ? "" : v.rootToTotal,
252
- c.value.body[g - 1] && c.value.body[g - 1].branchName === v.branchName ? "" : v.branchName,
253
- c.value.body[g - 1] && c.value.body[g - 1].branchName === v.branchName ? "" : v.branchValue,
254
- c.value.body[g - 1] && c.value.body[g - 1].branchName === v.branchName ? "" : v.branchToRoot,
255
- c.value.body[g - 1] && c.value.body[g - 1].branchName === v.branchName ? "" : v.branchToTotal,
256
- v.nutName,
257
- v.nutValue,
258
- v.nutToBranch,
259
- v.nutToRoot,
260
- v.nutToTotal
261
- ]), u = l.concat([i]).concat(t), f = He(u);
262
- We({ csvContent: f, title: e.value.style.chart.layout.title.text || "vue-ui-chestnut" });
263
- });
264
- }
265
- const D = z(!1);
266
- function Le(l) {
267
- D.value = l, le.value += 1;
268
- }
269
- function de() {
270
- U.value.showTable = !U.value.showTable;
271
- }
272
- return _e({
273
- getData: $e,
274
- generatePdf: ae,
275
- generateCsv: ce,
276
- generateImage: oe,
277
- toggleTable: de
278
- }), (l, i) => (a(), o("div", {
279
- class: m(`vue-ui-chestnut ${D.value ? "vue-data-ui-wrapper-fullscreen" : ""}`),
280
- ref_key: "chestnutChart",
281
- ref: te,
282
- id: `vue-ui-chestnut_${k.value}`,
283
- style: h(`font-family:${e.value.style.fontFamily};width:100%; text-align:center;padding-top:36px;background:${e.value.style.chart.backgroundColor}`)
284
- }, [
285
- e.value.userOptions.show && E.value ? (a(), Q(Je, {
286
- ref_key: "details",
287
- ref: xe,
288
- key: `user_options_${le.value}`,
289
- backgroundColor: e.value.style.chart.backgroundColor,
290
- color: e.value.style.chart.color,
291
- isImaging: y(ke),
292
- isPrinting: y(me),
293
- uid: k.value,
294
- hasPdf: e.value.userOptions.buttons.pdf,
295
- hasImg: e.value.userOptions.buttons.img,
296
- hasXls: e.value.userOptions.buttons.csv,
297
- hasTable: e.value.userOptions.buttons.table,
298
- hasFullscreen: e.value.userOptions.buttons.fullscreen,
299
- isFullscreen: D.value,
300
- titles: { ...e.value.userOptions.buttonTitles },
301
- chartElement: te.value,
302
- onToggleFullscreen: Le,
303
- onGeneratePdf: y(ae),
304
- onGenerateCsv: ce,
305
- onGenerateImage: y(oe),
306
- onToggleTable: de
307
- }, Re({ _: 2 }, [
308
- l.$slots.optionPdf ? {
309
- name: "optionPdf",
310
- fn: A(() => [
311
- X(l.$slots, "optionPdf", {}, void 0, !0)
312
- ]),
313
- key: "0"
314
- } : void 0,
315
- l.$slots.optionCsv ? {
316
- name: "optionCsv",
317
- fn: A(() => [
318
- X(l.$slots, "optionCsv", {}, void 0, !0)
319
- ]),
320
- key: "1"
321
- } : void 0,
322
- l.$slots.optionImg ? {
323
- name: "optionImg",
324
- fn: A(() => [
325
- X(l.$slots, "optionImg", {}, void 0, !0)
326
- ]),
327
- key: "2"
328
- } : void 0,
329
- l.$slots.optionTable ? {
330
- name: "optionTable",
331
- fn: A(() => [
332
- X(l.$slots, "optionTable", {}, void 0, !0)
333
- ]),
334
- key: "3"
335
- } : void 0,
336
- l.$slots.optionFullscreen ? {
337
- name: "optionFullscreen",
338
- fn: A(({ toggleFullscreen: t, isFullscreen: u }) => [
339
- X(l.$slots, "optionFullscreen", Be(Me({ toggleFullscreen: t, isFullscreen: u })), void 0, !0)
340
- ]),
341
- key: "4"
342
- } : void 0
343
- ]), 1032, ["backgroundColor", "color", "isImaging", "isPrinting", "uid", "hasPdf", "hasImg", "hasXls", "hasTable", "hasFullscreen", "isFullscreen", "titles", "chartElement", "onGeneratePdf", "onGenerateImage"])) : b("", !0),
344
- r.value.height > 0 && E.value ? (a(), o("svg", {
345
- key: 1,
346
- xmlns: y(De),
347
- class: m({ "vue-data-ui-fullscreen--on": D.value, "vue-data-ui-fulscreen--off": !D.value }),
348
- viewBox: `0 0 ${r.value.width} ${r.value.height}`,
349
- style: h(`max-width:100%;overflow:visible;background:${e.value.style.chart.backgroundColor};color:${e.value.style.chart.color}`)
350
- }, [
351
- d.value ? b("", !0) : (a(), o("g", ot, [
352
- e.value.style.chart.layout.title.text ? (a(), o("text", {
353
- key: 0,
354
- "text-anchor": "middle",
355
- fill: e.value.style.chart.layout.title.color,
356
- "font-weight": e.value.style.chart.layout.title.bold ? "bold" : "normal",
357
- "font-size": e.value.style.chart.layout.title.fontSize,
358
- x: r.value.width / 2,
359
- y: 12 + e.value.style.chart.layout.title.fontSize + e.value.style.chart.layout.title.offsetY,
360
- onClick: w
361
- }, n(e.value.style.chart.layout.title.text), 9, st)) : b("", !0),
362
- e.value.style.chart.layout.title.subtitle.text ? (a(), o("text", {
363
- key: 1,
364
- "text-anchor": "middle",
365
- fill: e.value.style.chart.layout.title.subtitle.color,
366
- "font-weight": e.value.style.chart.layout.title.subtitle.bold ? "bold" : "normal",
367
- "font-size": e.value.style.chart.layout.title.subtitle.fontSize,
368
- x: r.value.width / 2,
369
- y: 48 + e.value.style.chart.layout.title.subtitle.fontSize + e.value.style.chart.layout.title.subtitle.offsetY,
370
- onClick: w
371
- }, n(e.value.style.chart.layout.title.subtitle.text), 9, ut)) : b("", !0)
372
- ])),
373
- s("defs", null, [
374
- (a(!0), o(p, null, _(T.value, (t, u) => (a(), o("radialGradient", {
375
- cx: "50%",
376
- cy: "50%",
377
- r: "50%",
378
- fx: "50%",
379
- fy: "50%",
380
- id: `root_gradient_${k.value}_${t.rootIndex}`
381
- }, [
382
- s("stop", {
383
- offset: "0%",
384
- "stop-color": `${y(ye)(t.color, 0.05)}${y(F)[100 - e.value.style.chart.layout.roots.gradientIntensity]}`
385
- }, null, 8, rt),
386
- s("stop", {
387
- offset: "100%",
388
- "stop-color": t.color
389
- }, null, 8, it)
390
- ], 8, nt))), 256)),
391
- (a(!0), o(p, null, _(T.value, (t) => (a(), o("linearGradient", {
392
- x1: "0%",
393
- y1: "0%",
394
- x2: "100%",
395
- y2: "0%",
396
- id: `branch_gradient_${k.value}_${t.rootIndex}`
397
- }, [
398
- s("stop", {
399
- offset: "0%",
400
- "stop-color": t.color
401
- }, null, 8, dt),
402
- s("stop", {
403
- offset: "100%",
404
- "stop-color": `${y(ye)(t.color, 0.02)}${y(F)[100 - e.value.style.chart.layout.branches.gradientIntensity]}`
405
- }, null, 8, vt)
406
- ], 8, ct))), 256)),
407
- s("radialGradient", {
408
- cx: "50%",
409
- cy: "50%",
410
- r: "50%",
411
- fx: "50%",
412
- fy: "50%",
413
- id: `nutpick_${k.value}`
414
- }, [
415
- s("stop", {
416
- offset: "0%",
417
- "stop-color": `#FFFFFF${y(F)[0]}`
418
- }, null, 8, ht),
419
- s("stop", {
420
- offset: "80%",
421
- "stop-color": `#FFFFFF${y(F)[e.value.style.chart.layout.nuts.selected.gradientIntensity]}`
422
- }, null, 8, ft),
423
- s("stop", {
424
- offset: "100%",
425
- "stop-color": `#FFFFFF${y(F)[0]}`
426
- }, null, 8, bt)
427
- ], 8, yt),
428
- s("radialGradient", {
429
- cx: "50%",
430
- cy: "50%",
431
- r: "50%",
432
- fx: "50%",
433
- fy: "50%",
434
- id: `nut_${k.value}`
435
- }, [
436
- s("stop", {
437
- offset: "0%",
438
- "stop-color": `#FFFFFF${y(F)[0]}`
439
- }, null, 8, _t),
440
- s("stop", {
441
- offset: "80%",
442
- "stop-color": `#FFFFFF${y(F)[e.value.style.chart.layout.nuts.gradientIntensity]}`
443
- }, null, 8, gt),
444
- s("stop", {
445
- offset: "100%",
446
- "stop-color": `#FFFFFF${y(F)[0]}`
447
- }, null, 8, xt)
448
- ], 8, pt),
449
- s("radialGradient", {
450
- cx: "50%",
451
- cy: "50%",
452
- r: "50%",
453
- fx: "50%",
454
- fy: "50%",
455
- id: `nut_underlayer_${k.value}`
456
- }, [
457
- s("stop", {
458
- offset: "0%",
459
- "stop-color": `${e.value.style.chart.backgroundColor}${y(F)[100]}`
460
- }, null, 8, kt),
461
- s("stop", {
462
- offset: "80%",
463
- "stop-color": `${e.value.style.chart.backgroundColor}${y(F)[60]}`
464
- }, null, 8, wt),
465
- s("stop", {
466
- offset: "100%",
467
- "stop-color": `${e.value.style.chart.backgroundColor}${y(F)[0]}`
468
- }, null, 8, $t)
469
- ], 8, mt)
470
- ]),
471
- e.value.style.chart.layout.grandTotal.show ? (a(), o("g", Ct, [
472
- s("text", {
473
- x: C.value.seedX,
474
- y: 32 + e.value.style.chart.layout.grandTotal.offsetY,
475
- "font-size": e.value.style.chart.layout.grandTotal.fontSize,
476
- "font-weight": e.value.style.chart.layout.grandTotal.bold ? "bold" : "normal",
477
- fill: e.value.style.chart.layout.grandTotal.color,
478
- "text-anchor": "middle",
479
- onClick: w
480
- }, n(e.value.style.chart.layout.grandTotal.text), 9, zt),
481
- s("text", {
482
- x: C.value.seedX,
483
- y: 38 + e.value.style.chart.layout.grandTotal.fontSize + e.value.style.chart.layout.grandTotal.offsetY,
484
- "font-size": e.value.style.chart.layout.grandTotal.fontSize,
485
- "font-weight": e.value.style.chart.layout.grandTotal.bold ? "bold" : "normal",
486
- fill: e.value.style.chart.layout.grandTotal.color,
487
- "text-anchor": "middle",
488
- onClick: w
489
- }, n(e.value.style.chart.layout.grandTotal.prefix) + " " + n(V.value.toFixed(e.value.style.chart.layout.grandTotal.roundingValue)) + " " + n(e.value.style.chart.layout.grandTotal.suffix), 9, Tt)
490
- ])) : b("", !0),
491
- (a(!0), o(p, null, _(R.value, (t) => (a(), o("g", null, [
492
- (a(!0), o(p, null, _(r.value.branchSize, (u, f) => (a(), o("path", {
493
- d: `M
494
- ${t.x1},${t.y1 + f}
495
- C${t.x1 - 20},${t.y1 + f}
496
- ${t.x1 - 80},${t.y1 + f}
497
- ${K(t).x + K(t).r / 2}, ${K(t).y}
498
- `,
499
- stroke: `${t.color}${y(F)[e.value.style.chart.layout.links.opacity]}`,
500
- fill: "none",
501
- "stroke-width": "2",
502
- "shape-rendering": "cirspEdges",
503
- style: h(`opacity:${S(t) ? 1 : 0}`),
504
- onClick: w
505
- }, null, 12, Ft))), 256))
506
- ]))), 256)),
507
- (a(!0), o(p, null, _(B.value, (t) => (a(), o("circle", {
508
- cx: t.x,
509
- cy: t.y,
510
- r: t.r,
511
- fill: e.value.style.chart.layout.roots.underlayerColor,
512
- stroke: "none",
513
- style: h(`cursor:pointer; opacity:${S(t) ? 1 : 0.05}`)
514
- }, null, 12, Nt))), 256)),
515
- (a(!0), o(p, null, _(B.value, (t, u) => (a(), o("circle", {
516
- cx: t.x,
517
- cy: t.y,
518
- r: t.r,
519
- fill: e.value.style.chart.layout.roots.useGradient ? `url(#root_gradient_${k.value}_${t.rootIndex})` : t.color,
520
- stroke: e.value.style.chart.layout.roots.stroke,
521
- "stroke-width": e.value.style.chart.layout.roots.strokeWidth,
522
- style: h(`cursor:pointer; opacity:${S(t) ? 1 : 0.05}`),
523
- onClick: (f) => ie(t)
524
- }, null, 12, St))), 256)),
525
- e.value.style.chart.layout.roots.labels.show ? (a(), o("g", It, [
526
- (a(!0), o(p, null, _(B.value, (t, u) => (a(), o("text", {
527
- x: t.x,
528
- y: t.y + e.value.style.chart.layout.roots.labels.fontSize / 2.6,
529
- "text-anchor": "middle",
530
- "font-size": e.value.style.chart.layout.roots.labels.fontSize,
531
- fill: e.value.style.chart.layout.roots.labels.adaptColorToBackground ? y(he)(t.color) : e.value.style.chart.layout.roots.labels.color,
532
- "font-weight": "bold",
533
- style: h(`cursor:pointer; opacity:${S(t) ? 1 : 0.05}`),
534
- onClick: (f) => ie(t)
535
- }, n(e.value.style.chart.layout.roots.labels.prefix) + " " + n(t.total.toFixed(e.value.style.chart.layout.roots.labels.roundingValue)) + " " + n(e.value.style.chart.layout.roots.labels.suffix), 13, Lt))), 256)),
536
- (a(!0), o(p, null, _(B.value, (t) => (a(), o("g", null, [
537
- d.value && t.rootIndex === d.value.rootIndex || x.value && t.rootIndex === x.value.rootIndex || N.value && t.rootIndex === N.value.rootIndex ? (a(), o("g", Pt, [
538
- s("text", {
539
- x: t.x,
540
- y: t.y + t.r + 24,
541
- "text-anchor": "middle",
542
- fill: e.value.style.chart.layout.roots.labels.name.color,
543
- "font-size": e.value.style.chart.layout.roots.labels.name.fontSize,
544
- "font-weight": e.value.style.chart.layout.roots.labels.name.bold ? "bold" : "normal",
545
- onClick: w
546
- }, n(t.name), 9, Vt)
547
- ])) : b("", !0)
548
- ]))), 256))
549
- ])) : b("", !0),
550
- (a(!0), o(p, null, _(R.value, (t) => (a(), o("rect", {
551
- x: t.x1,
552
- y: t.y1,
553
- height: r.value.branchSize,
554
- width: t.x2 - t.x1,
555
- fill: e.value.style.chart.layout.branches.underlayerColor,
556
- rx: e.value.style.chart.layout.branches.borderRadius,
557
- stroke: "none",
558
- style: h(`opacity:${S(t) ? 1 : 0.05}`),
559
- onClick: (u) => J(t)
560
- }, null, 12, Rt))), 256)),
561
- (a(!0), o(p, null, _(R.value, (t, u) => (a(), o("rect", {
562
- x: t.x1,
563
- y: t.y1,
564
- height: r.value.branchSize,
565
- width: t.x2 - t.x1,
566
- fill: e.value.style.chart.layout.branches.useGradient ? `url(#branch_gradient_${k.value}_${t.rootIndex})` : t.color,
567
- rx: e.value.style.chart.layout.branches.borderRadius,
568
- stroke: e.value.style.chart.layout.branches.stroke,
569
- "stroke-width": e.value.style.chart.layout.branches.strokeWidth,
570
- style: h(`cursor:pointer; opacity:${S(t) ? 1 : 0.05}`),
571
- onClick: (f) => J(t)
572
- }, null, 12, Bt))), 256)),
573
- e.value.style.chart.layout.branches.labels.dataLabels.show ? (a(), o("g", Mt, [
574
- (a(!0), o(p, null, _(R.value, (t) => (a(), o("g", null, [
575
- t.proportionToRoot * 100 > e.value.style.chart.layout.branches.labels.dataLabels.hideUnderValue ? (a(), o("text", {
576
- key: 0,
577
- x: t.x1 + 6,
578
- y: t.y1 + r.value.branchSize / 1.5,
579
- "text-anchor": "start",
580
- fill: y(he)(t.color),
581
- "font-size": e.value.style.chart.layout.branches.labels.dataLabels.fontSize,
582
- "font-weight": "bold",
583
- style: h(`cursor:pointer; opacity:${S(t) ? 1 : 0.05}`),
584
- onClick: (u) => J(t)
585
- }, n(e.value.style.chart.layout.branches.labels.dataLabels.prefix) + " " + n(t.value.toFixed(e.value.style.chart.layout.branches.labels.dataLabels.roundingValue)) + " " + n(e.value.style.chart.layout.branches.labels.dataLabels.suffix), 13, jt)) : b("", !0)
586
- ]))), 256))
587
- ])) : b("", !0),
588
- (a(!0), o(p, null, _(R.value, (t, u) => (a(), o("g", null, [
589
- (a(!0), o(p, null, _(y(fe)(
590
- { series: t.breakdown, base: 1 },
591
- t.x2 + 24 + e.value.style.chart.layout.nuts.offsetX,
592
- t.y1 + r.value.branchSize / 2,
593
- r.value.branchSize / 3,
594
- r.value.branchSize / 3
595
- ), (f, v) => (a(), o("path", {
596
- d: f.path,
597
- stroke: f.color,
598
- "stroke-width": 10,
599
- fill: "none",
600
- style: h(`opacity:${S(t) ? 1 : 0.1}`)
601
- }, null, 12, Xt))), 256)),
602
- (a(!0), o(p, null, _(R.value, (f) => (a(), o("circle", {
603
- cx: f.x2 + 24 + e.value.style.chart.layout.nuts.offsetX,
604
- cy: f.y1 + r.value.branchSize / 2,
605
- r: 6,
606
- fill: e.value.style.chart.backgroundColor,
607
- onClick: (v) => re(f),
608
- style: { cursor: "pointer" }
609
- }, null, 8, Ot))), 256)),
610
- s("circle", {
611
- fill: e.value.style.chart.layout.nuts.useGradient ? `url(#nut_${k.value})` : "transparent",
612
- cx: t.x2 + 24 + e.value.style.chart.layout.nuts.offsetX,
613
- cy: t.y1 + r.value.branchSize / 2,
614
- r: r.value.branchSize / 2 + 2,
615
- onClick: (f) => re(t),
616
- style: h(`cursor:pointer;opacity:${S(t) ? 1 : 0.1}`)
617
- }, null, 12, Gt)
618
- ]))), 256)),
619
- e.value.style.chart.layout.branches.labels.show && !x.value ? (a(), o("g", At, [
620
- (a(!0), o(p, null, _(R.value, (t) => (a(), o("text", {
621
- x: t.x2 + r.value.branchSize + 24 + e.value.style.chart.layout.nuts.offsetX,
622
- y: t.y1 + r.value.branchSize / 2 + 5,
623
- "font-size": e.value.style.chart.layout.branches.labels.fontSize,
624
- "font-weight": e.value.style.chart.layout.branches.labels.bold ? "bold" : "normal",
625
- fill: e.value.style.chart.layout.branches.labels.color,
626
- "text-anchor": "start",
627
- style: h(`opacity:${S(t) ? 1 : 0.1}`)
628
- }, n(t.name), 13, Et))), 256))
629
- ])) : b("", !0),
630
- s("line", {
631
- x1: 256 + r.value.padding.left,
632
- x2: 256 + r.value.padding.left,
633
- y1: C.value.top,
634
- y2: C.value.bottom,
635
- stroke: e.value.style.chart.layout.verticalSeparator.stroke,
636
- "stroke-width": e.value.style.chart.layout.verticalSeparator.strokeWidth
637
- }, null, 8, Ut),
638
- !d.value && !x.value ? (a(), o("foreignObject", {
639
- key: 5,
640
- x: 0,
641
- y: C.value.bottom,
642
- height: r.value.height - C.value.bottom,
643
- width: r.value.width,
644
- style: { overflow: "visible" },
645
- onClick: w
646
- }, [
647
- s("div", Yt, [
648
- s("div", qt, [
649
- (a(!0), o(p, null, _(B.value, (t) => (a(), o("div", {
650
- style: h(`display:flex;align-items:center;gap:3px;flex-direction:row;font-size:${e.value.style.chart.layout.legend.fontSize}px;`)
651
- }, [
652
- (a(), o("svg", Ht, [
653
- s("circle", {
654
- cx: "10",
655
- cy: "10",
656
- r: "10",
657
- fill: t.color,
658
- stroke: "none"
659
- }, null, 8, Wt)
660
- ])),
661
- s("span", null, n(t.name) + ":", 1),
662
- Y(),
663
- s("b", null, n(e.value.style.chart.layout.legend.prefix) + " " + n(t.total.toFixed(e.value.style.chart.layout.legend.roundingValue)) + " " + n(e.value.style.chart.layout.legend.suffix), 1),
664
- Y("(" + n((t.total / V.value * 100).toFixed(e.value.style.chart.layout.legend.roundingPercentage)) + "%) ", 1)
665
- ], 4))), 256))
666
- ])
667
- ])
668
- ], 8, Dt)) : b("", !0),
669
- d.value && M.value ? (a(), o("g", Kt, [
670
- (a(), o("foreignObject", {
671
- x: 0,
672
- y: Se(),
673
- height: r.value.height - C.value.bottom,
674
- width: r.value.width,
675
- style: { overflow: "visible" },
676
- onClick: w
677
- }, [
678
- s("div", Qt, [
679
- s("b", null, n(d.value.name), 1),
680
- s("div", Zt, [
681
- (a(!0), o(p, null, _(d.value.breakdown, (t, u) => (a(), o("div", {
682
- style: h(`display:flex;align-items:center;gap:6px;flex-direction:row;font-size:${e.value.style.chart.layout.legend.fontSize}px;`)
683
- }, [
684
- (a(), o("svg", el, [
685
- s("circle", {
686
- cx: "10",
687
- cy: "10",
688
- r: "10",
689
- fill: t.color,
690
- stroke: "none"
691
- }, null, 8, tl)
692
- ])),
693
- s("span", null, [
694
- Y(n(t.name) + ": ", 1),
695
- s("b", null, n(e.value.style.chart.layout.legend.prefix) + " " + n(t.value.toFixed(e.value.style.chart.layout.nuts.selected.labels.roundingValue)) + " " + n(e.value.style.chart.layout.legend.suffix), 1),
696
- Y(" (" + n((t.proportionToBranch * 100).toFixed(e.value.style.chart.layout.nuts.selected.labels.roundingPercentage)) + "%)", 1)
697
- ])
698
- ], 4))), 256))
699
- ])
700
- ])
701
- ], 8, Jt)),
702
- (a(!0), o(p, null, _(M.value, (t) => (a(), o("g", null, [
703
- G(t) ? (a(), o("path", {
704
- key: 0,
705
- d: y(Ye)(t),
706
- stroke: t.color,
707
- "stroke-width": "1",
708
- "stroke-linecap": "round",
709
- "stroke-linejoin": "round",
710
- fill: "none",
711
- class: m(e.value.style.chart.layout.nuts.selected.useMotion ? "vue-ui-chestnut-animated" : "")
712
- }, null, 10, ll)) : b("", !0)
713
- ]))), 256)),
714
- s("circle", {
715
- cx: d.value.x2 + 24 + e.value.style.chart.layout.nuts.offsetX,
716
- cy: d.value.y1 + r.value.branchSize / 2,
717
- r: 256,
718
- fill: `url(#nut_underlayer_${k.value})`,
719
- onClick: j,
720
- class: m(e.value.style.chart.layout.nuts.selected.useMotion ? "vue-ui-chestnut-animated" : "")
721
- }, null, 10, al),
722
- s("circle", {
723
- cx: d.value.x2 + 24 + e.value.style.chart.layout.nuts.offsetX,
724
- cy: d.value.y1 + r.value.branchSize / 2,
725
- r: 118,
726
- fill: e.value.style.chart.backgroundColor,
727
- onClick: j,
728
- class: m(e.value.style.chart.layout.nuts.selected.useMotion ? "vue-ui-chestnut-animated" : "")
729
- }, null, 10, ol),
730
- (a(!0), o(p, null, _(M.value, (t) => (a(), o("path", {
731
- d: t.path,
732
- stroke: t.color,
733
- "stroke-width": 64,
734
- fill: "none",
735
- onClick: j,
736
- class: m(e.value.style.chart.layout.nuts.selected.useMotion ? "vue-ui-chestnut-animated" : "")
737
- }, null, 10, sl))), 256)),
738
- s("circle", {
739
- cx: d.value.x2 + 24 + e.value.style.chart.layout.nuts.offsetX,
740
- cy: d.value.y1 + r.value.branchSize / 2,
741
- r: 100,
742
- fill: `url(#nutpick_${k.value})`,
743
- onClick: j,
744
- class: m(e.value.style.chart.layout.nuts.selected.useMotion ? "vue-ui-chestnut-animated" : "")
745
- }, null, 10, ul),
746
- s("circle", {
747
- cx: d.value.x2 + 24 + e.value.style.chart.layout.nuts.offsetX,
748
- cy: d.value.y1 + r.value.branchSize / 2,
749
- r: 48,
750
- fill: e.value.style.chart.backgroundColor,
751
- onClick: j,
752
- class: m(e.value.style.chart.layout.nuts.selected.useMotion ? "vue-ui-chestnut-animated" : "")
753
- }, null, 10, nl),
754
- s("text", {
755
- x: d.value.x2 + 24 + e.value.style.chart.layout.nuts.offsetX,
756
- y: d.value.y1 + 8,
757
- fill: e.value.style.chart.layout.nuts.selected.labels.core.total.color,
758
- "font-size": e.value.style.chart.layout.nuts.selected.labels.core.total.fontSize,
759
- "font-weight": e.value.style.chart.layout.nuts.selected.labels.core.total.bold ? "bold" : "normal",
760
- "text-anchor": "middle",
761
- onClick: j,
762
- class: m(e.value.style.chart.layout.nuts.selected.useMotion ? "vue-ui-chestnut-animated" : "")
763
- }, n(e.value.translations.total), 11, rl),
764
- s("text", {
765
- x: d.value.x2 + 24 + e.value.style.chart.layout.nuts.offsetX,
766
- y: d.value.y1 + 36,
767
- fill: e.value.style.chart.layout.nuts.selected.labels.core.value.color,
768
- "font-size": e.value.style.chart.layout.nuts.selected.labels.core.value.fontSize,
769
- "font-weight": e.value.style.chart.layout.nuts.selected.labels.core.value.bold ? "bold" : "normal",
770
- "text-anchor": "middle",
771
- onClick: j,
772
- class: m(e.value.style.chart.layout.nuts.selected.useMotion ? "vue-ui-chestnut-animated" : "")
773
- }, n(e.value.style.chart.layout.nuts.selected.labels.core.value.prefix) + " " + n(d.value.value.toFixed(e.value.style.chart.layout.nuts.selected.roundingValue)) + " " + n(e.value.style.chart.layout.nuts.selected.labels.core.value.suffix), 11, il),
774
- (a(!0), o(p, null, _(M.value, (t, u) => (a(), o("g", null, [
775
- G(t) ? (a(), o("text", {
776
- key: 0,
777
- x: y(L)(t).x,
778
- "text-anchor": y(L)(t).anchor,
779
- y: y(q)(t),
780
- fill: t.color,
781
- "font-size": e.value.style.chart.layout.nuts.selected.labels.dataLabels.fontSize,
782
- style: h(`font-weight:${e.value.style.chart.layout.nuts.selected.labels.dataLabels.bold ? "bold" : ""}`),
783
- class: m(e.value.style.chart.layout.nuts.selected.useMotion ? "vue-ui-chestnut-animated" : "")
784
- }, " ⬤ ", 14, cl)) : b("", !0),
785
- G(t) ? (a(), o("text", {
786
- key: 1,
787
- x: y(L)(t, !0).x,
788
- "text-anchor": y(L)(t, !0).anchor,
789
- y: y(q)(t),
790
- fill: e.value.style.chart.layout.nuts.selected.labels.dataLabels.color,
791
- "font-size": e.value.style.chart.layout.nuts.selected.labels.dataLabels.fontSize,
792
- style: h(`font-weight:${e.value.style.chart.layout.nuts.selected.labels.dataLabels.bold ? "bold" : ""}`),
793
- class: m(e.value.style.chart.layout.nuts.selected.useMotion ? "vue-ui-chestnut-animated" : "")
794
- }, n(d.value.breakdown[u].name), 15, dl)) : b("", !0)
795
- ]))), 256)),
796
- (a(!0), o(p, null, _(M.value, (t, u) => (a(), o("g", null, [
797
- G(t) ? (a(), o("text", {
798
- key: 0,
799
- x: y(L)(t, !0).x,
800
- "text-anchor": y(L)(t).anchor,
801
- y: y(q)(t) + e.value.style.chart.layout.nuts.selected.labels.dataLabels.fontSize,
802
- fill: e.value.style.chart.layout.nuts.selected.labels.dataLabels.color,
803
- "font-size": e.value.style.chart.layout.nuts.selected.labels.dataLabels.fontSize,
804
- style: h(`font-weight:${e.value.style.chart.layout.nuts.selected.labels.dataLabels.bold ? "bold" : ""}`),
805
- class: m(e.value.style.chart.layout.nuts.selected.useMotion ? "vue-ui-chestnut-animated" : "")
806
- }, n((d.value.breakdown[u].value / d.value.value * 100).toFixed(e.value.style.chart.layout.nuts.selected.labels.roundingPercentage)) + "% " + n(e.value.translations.of) + " " + n(d.value.breakdown[u].branchName) + " (" + n(e.value.style.chart.layout.nuts.selected.labels.dataLabels.prefix) + " " + n(d.value.breakdown[u].value) + " " + n(e.value.style.chart.layout.nuts.selected.labels.dataLabels.suffix) + ") ", 15, vl)) : b("", !0),
807
- G(t) ? (a(), o("text", {
808
- key: 1,
809
- x: y(L)(t, !0).x,
810
- "text-anchor": y(L)(t).anchor,
811
- y: y(q)(t) + e.value.style.chart.layout.nuts.selected.labels.dataLabels.fontSize * 2,
812
- fill: e.value.style.chart.layout.nuts.selected.labels.dataLabels.color,
813
- "font-size": e.value.style.chart.layout.nuts.selected.labels.dataLabels.fontSize,
814
- style: h(`font-weight:${e.value.style.chart.layout.nuts.selected.labels.dataLabels.bold ? "bold" : ""}`),
815
- class: m(e.value.style.chart.layout.nuts.selected.useMotion ? "vue-ui-chestnut-animated" : "")
816
- }, n((d.value.breakdown[u].proportionToRoot * 100).toFixed(e.value.style.chart.layout.nuts.selected.labels.roundingPercentage)) + "% " + n(e.value.translations.of) + " " + n(d.value.breakdown[u].rootName), 15, yl)) : b("", !0),
817
- G(t) ? (a(), o("text", {
818
- key: 2,
819
- x: y(L)(t, !0).x,
820
- "text-anchor": y(L)(t).anchor,
821
- y: y(q)(t) + e.value.style.chart.layout.nuts.selected.labels.dataLabels.fontSize * 3,
822
- fill: e.value.style.chart.layout.nuts.selected.labels.dataLabels.color,
823
- "font-size": e.value.style.chart.layout.nuts.selected.labels.dataLabels.fontSize,
824
- style: h(`font-weight:${e.value.style.chart.layout.nuts.selected.labels.dataLabels.bold ? "bold" : ""}`),
825
- class: m(e.value.style.chart.layout.nuts.selected.useMotion ? "vue-ui-chestnut-animated" : "")
826
- }, n((d.value.breakdown[u].proportionToTree * 100).toFixed(e.value.style.chart.layout.nuts.selected.labels.roundingPercentage)) + "% " + n(e.value.translations.proportionToTree), 15, hl)) : b("", !0)
827
- ]))), 256))
828
- ])) : b("", !0),
829
- (a(!0), o(p, null, _(R.value, (t) => (a(), o("g", null, [
830
- x.value && x.value.id === t.id && !d.value ? (a(), o("text", {
831
- key: 0,
832
- x: t.x1 + 6,
833
- y: t.y1 + r.value.branchSize + 24,
834
- "font-weight": "bold",
835
- "text-anchor": "start",
836
- "font-size": e.value.style.chart.layout.branches.labels.dataLabels.fontSize,
837
- fill: e.value.style.chart.layout.branches.labels.color,
838
- onClick: w
839
- }, n(t.name) + ": " + n(e.value.style.chart.layout.branches.labels.dataLabels.prefix) + " " + n(t.value.toFixed(e.value.style.chart.layout.branches.labels.dataLabels.roundingValue)) + " " + n(e.value.style.chart.layout.branches.labels.dataLabels.suffix), 9, fl)) : b("", !0),
840
- x.value && x.value.id === t.id && !d.value ? (a(), o("text", {
841
- key: 1,
842
- x: t.x1 + 6,
843
- y: t.y1 + r.value.branchSize + 48,
844
- "text-anchor": "start",
845
- "font-size": e.value.style.chart.layout.branches.labels.dataLabels.fontSize,
846
- fill: e.value.style.chart.layout.branches.labels.color,
847
- onClick: w
848
- }, n((t.proportionToRoot * 100).toFixed(e.value.style.chart.layout.branches.labels.dataLabels.roundingPercentage)) + "% " + n(e.value.translations.of) + " " + n(t.rootName), 9, bl)) : b("", !0),
849
- x.value && x.value.id === t.id && !d.value ? (a(), o("text", {
850
- key: 2,
851
- x: t.x1 + 6,
852
- y: t.y1 + r.value.branchSize + 72,
853
- "text-anchor": "start",
854
- "font-size": e.value.style.chart.layout.branches.labels.dataLabels.fontSize,
855
- fill: e.value.style.chart.layout.branches.labels.color,
856
- onClick: w
857
- }, n((t.value / V.value * 100).toFixed(e.value.style.chart.layout.branches.labels.dataLabels.roundingPercentage)) + "% " + n(e.value.translations.proportionToTree), 9, pl)) : b("", !0)
858
- ]))), 256)),
859
- X(l.$slots, "svg", { svg: r.value }, void 0, !0)
860
- ], 14, at)) : b("", !0),
861
- E.value ? b("", !0) : (a(), Q(et, {
862
- key: 2,
863
- config: {
864
- type: "chestnut",
865
- style: {
866
- backgroundColor: e.value.style.chart.backgroundColor,
867
- chestnut: {
868
- color: "#CCCCCC"
869
- }
870
- }
871
- }
872
- }, null, 8, ["config"])),
873
- X(l.$slots, "legend", { legend: T.value }, void 0, !0),
874
- E.value ? (a(), Q(tt, {
875
- key: 3,
876
- hideDetails: "",
877
- config: {
878
- open: U.value.showTable,
879
- maxHeight: 1e4,
880
- body: {
881
- backgroundColor: e.value.style.chart.backgroundColor,
882
- color: e.value.style.chart.color
883
- },
884
- head: {
885
- backgroundColor: e.value.style.chart.backgroundColor,
886
- color: e.value.style.chart.color
887
- }
888
- }
889
- }, {
890
- content: A(() => [
891
- s("div", {
892
- ref_key: "tableContainer",
893
- ref: se,
894
- class: "vue-ui-chestnut-table"
895
- }, [
896
- s("div", _l, [
897
- s("div", {
898
- role: "button",
899
- tabindex: "0",
900
- style: h(`width:32px; position: absolute; top: 0; left:4px; padding: 0 0px; display: flex; align-items:center;justify-content:center;height: 36px; width: 32px; cursor:pointer; background:${e.value.table.th.backgroundColor};`),
901
- onClick: i[0] || (i[0] = (t) => U.value.showTable = !1),
902
- onKeypress: i[1] || (i[1] = je((t) => U.value.showTable = !1, ["enter"]))
903
- }, [
904
- Xe(qe, {
905
- name: "close",
906
- stroke: e.value.table.th.color,
907
- "stroke-width": 2
908
- }, null, 8, ["stroke"])
909
- ], 36),
910
- s("div", {
911
- style: { width: "100%" },
912
- class: m({ "vue-ui-responsive": ue.value })
913
- }, [
914
- s("table", gl, [
915
- s("caption", {
916
- style: h({ backgroundColor: e.value.table.th.backgroundColor, color: e.value.table.th.color, outline: e.value.table.th.outline }),
917
- class: "vue-ui-data-table__caption"
918
- }, [
919
- Y(n(e.value.style.chart.layout.title.text) + " ", 1),
920
- e.value.style.chart.layout.title.subtitle.text ? (a(), o("span", xl, n(e.value.style.chart.layout.title.subtitle.text), 1)) : b("", !0)
921
- ], 4),
922
- s("thead", null, [
923
- s("tr", {
924
- role: "row",
925
- style: h(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color}`)
926
- }, [
927
- (a(!0), o(p, null, _(c.value.head, (t) => (a(), o("th", {
928
- style: h(`outline:${e.value.table.th.outline}`)
929
- }, n(t), 5))), 256))
930
- ], 4)
931
- ]),
932
- s("tbody", null, [
933
- (a(!0), o(p, null, _(c.value.body, (t, u) => (a(), o("tr", {
934
- class: m({ "vue-ui-data-table__tbody__row": !0, "vue-ui-data-table__tbody__row-even": u % 2 === 0, "vue-ui-data-table__tbody__row-odd": u % 2 !== 0 }),
935
- style: h(`background:${e.value.table.td.backgroundColor};color:${e.value.table.td.color}`)
936
- }, [
937
- s("td", {
938
- class: "vue-ui-data-table__tbody__td",
939
- style: h(`outline:${e.value.table.td.outline}`),
940
- "data-cell": c.value.head[0]
941
- }, [
942
- s("div", kl, [
943
- c.value.body[u - 1] && c.value.body[u - 1].rootName === t.rootName ? (a(), o("span", wl)) : (a(), o("span", $l, n(t.rootName), 1))
944
- ])
945
- ], 12, ml),
946
- s("td", {
947
- class: "vue-ui-data-table__tbody__td",
948
- style: h(`outline:${e.value.table.td.outline}`),
949
- "data-cell": c.value.head[1]
950
- }, [
951
- s("div", zl, [
952
- c.value.body[u - 1] && c.value.body[u - 1].rootName === t.rootName ? (a(), o("span", Tl)) : (a(), o("span", Fl, n(t.rootValue.toFixed(e.value.table.td.roundingValue)), 1))
953
- ])
954
- ], 12, Cl),
955
- s("td", {
956
- class: "vue-ui-data-table__tbody__td",
957
- style: h(`outline:${e.value.table.td.outline}`),
958
- "data-cell": c.value.head[2]
959
- }, [
960
- s("div", Sl, [
961
- c.value.body[u - 1] && c.value.body[u - 1].rootName === t.rootName ? (a(), o("span", Il)) : (a(), o("span", Ll, n((t.rootToTotal * 100).toFixed(e.value.table.td.roundingPercentage)) + "% ", 1))
962
- ])
963
- ], 12, Nl),
964
- s("td", {
965
- class: "vue-ui-data-table__tbody__td",
966
- style: h(`outline:${e.value.table.td.outline}`),
967
- "data-cell": c.value.head[3]
968
- }, [
969
- s("div", Vl, [
970
- c.value.body[u - 1] && c.value.body[u - 1].branchName === t.branchName ? (a(), o("span", Rl)) : (a(), o("span", Bl, n(t.branchName), 1))
971
- ])
972
- ], 12, Pl),
973
- s("td", {
974
- class: "vue-ui-data-table__tbody__td",
975
- style: h(`outline:${e.value.table.td.outline}`),
976
- "data-cell": c.value.head[4]
977
- }, [
978
- s("div", jl, [
979
- c.value.body[u - 1] && c.value.body[u - 1].branchName === t.branchName ? (a(), o("span", Xl)) : (a(), o("span", Ol, n(t.branchValue.toFixed(e.value.table.td.roundingValue)), 1))
980
- ])
981
- ], 12, Ml),
982
- s("td", {
983
- class: "vue-ui-data-table__tbody__td",
984
- style: h(`outline:${e.value.table.td.outline}`),
985
- "data-cell": c.value.head[5]
986
- }, [
987
- s("div", Al, [
988
- c.value.body[u - 1] && c.value.body[u - 1].branchName === t.branchName ? (a(), o("span", El)) : (a(), o("span", Ul, n((t.branchToRoot * 100).toFixed(e.value.table.td.roundingPercentage)) + "% ", 1))
989
- ])
990
- ], 12, Gl),
991
- s("td", {
992
- class: "vue-ui-data-table__tbody__td",
993
- style: h(`outline:${e.value.table.td.outline}`),
994
- "data-cell": c.value.head[6]
995
- }, [
996
- s("div", Yl, [
997
- c.value.body[u - 1] && c.value.body[u - 1].branchName === t.branchName ? (a(), o("span", ql)) : (a(), o("span", Hl, n((t.branchToTotal * 100).toFixed(e.value.table.td.roundingPercentage)) + "% ", 1))
998
- ])
999
- ], 12, Dl),
1000
- s("td", {
1001
- class: "vue-ui-data-table__tbody__td",
1002
- style: h(`outline:${e.value.table.td.outline}`),
1003
- "data-cell": c.value.head[7]
1004
- }, [
1005
- s("div", Kl, n(t.nutName), 1)
1006
- ], 12, Wl),
1007
- s("td", {
1008
- class: "vue-ui-data-table__tbody__td",
1009
- style: h(`outline:${e.value.table.td.outline}`),
1010
- "data-cell": c.value.head[8]
1011
- }, [
1012
- s("div", Ql, n(t.nutValue.toFixed(e.value.table.td.roundingValue)), 1)
1013
- ], 12, Jl),
1014
- s("td", {
1015
- class: "vue-ui-data-table__tbody__td",
1016
- style: h(`outline:${e.value.table.td.outline}`),
1017
- "data-cell": c.value.head[9]
1018
- }, [
1019
- s("div", ea, n((t.nutToBranch * 100).toFixed(e.value.table.td.roundingPercentage)) + "% ", 1)
1020
- ], 12, Zl),
1021
- s("td", {
1022
- class: "vue-ui-data-table__tbody__td",
1023
- style: h(`outline:${e.value.table.td.outline}`),
1024
- "data-cell": c.value.head[10]
1025
- }, [
1026
- s("div", la, n((t.nutToRoot * 100).toFixed(e.value.table.td.roundingPercentage)) + "% ", 1)
1027
- ], 12, ta),
1028
- s("td", {
1029
- class: "vue-ui-data-table__tbody__td",
1030
- style: h(`outline:${e.value.table.td.outline}`),
1031
- "data-cell": c.value.head[11]
1032
- }, [
1033
- s("div", oa, n((t.nutToTotal * 100).toFixed(e.value.table.td.roundingPercentage)) + "% ", 1)
1034
- ], 12, aa)
1035
- ], 6))), 256))
1036
- ])
1037
- ])
1038
- ], 2)
1039
- ])
1040
- ], 512)
1041
- ]),
1042
- _: 1
1043
- }, 8, ["config"])) : b("", !0)
1044
- ], 14, lt));
1045
- }
1046
- }, ya = /* @__PURE__ */ Oe(sa, [["__scopeId", "data-v-bf0d15ab"]]);
1047
- export {
1048
- ya as default
1049
- };