vue-data-ui 2.2.92 → 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,551 +0,0 @@
1
- import { computed as d, ref as n, onMounted as _e, onBeforeUnmount as Oe, watch as Pe, openBlock as s, createElementBlock as i, normalizeClass as R, normalizeStyle as D, createVNode as E, createCommentVNode as b, createBlock as L, unref as x, createSlots as Fe, withCtx as v, renderSlot as g, normalizeProps as H, guardReactiveProps as W, Fragment as F, renderList as I, createElementVNode as C, toDisplayString as T, createTextVNode as Ie, nextTick as Se } from "vue";
2
- import { _ as Me, e as Ne, f as Ae, p as re, g as Re, i as De, j, h as Le, X as ze, y as se, D as Be, v as Ve, w as Xe, z as Ge, n as ne } from "./data-table-d-VcuH-r.js";
3
- import { t as Ue, u as Ye } from "./vue-ui-age-pyramid-4hcuKpFY.js";
4
- import { t as Ee } from "./themes-lgjsYHsH.js";
5
- import { u as ue, _ as He } from "./title-BF-9Qcni.js";
6
- import { U as We } from "./user-options-DZgCz8UA.js";
7
- import { L as je } from "./legend-DJCYLsl_.js";
8
- import { _ as qe } from "./tooltip-D85WEOKi.js";
9
- import { u as Je, a as Ke, S as Qe, A as Ze } from "./vue-ui-3d-bar-DW7kGJSz.js";
10
- const et = ["id"], tt = ["xmlns", "viewBox"], at = ["cx", "cy", "r", "stroke", "stroke-width", "stroke-dasharray", "stroke-dashoffset"], lt = ["cx", "cy", "r", "stroke", "stroke-width", "stroke-dasharray", "stroke-dashoffset"], ot = ["id"], rt = ["stdDeviation"], st = ["filter"], nt = ["cx", "cy", "r", "stroke-width", "stroke-dasharray", "stroke-dashoffset"], ut = ["cx", "cy", "r", "stroke-width", "stroke-dasharray", "stroke-dashoffset", "onMouseenter"], it = { key: 1 }, ct = ["onMouseenter"], dt = ["x", "y", "font-size", "fill", "font-weight"], vt = ["onClick"], ht = ["innerHTML"], gt = {
11
- __name: "vue-ui-onion",
12
- props: {
13
- config: {
14
- type: Object,
15
- default() {
16
- return {};
17
- }
18
- },
19
- dataset: {
20
- type: Array,
21
- default() {
22
- return [];
23
- }
24
- }
25
- },
26
- emits: ["selectLegend"],
27
- setup(ie, { expose: ce, emit: de }) {
28
- const k = ie, { vue_ui_onion: ve } = Je(), S = d(() => !!k.dataset && k.dataset.length), w = n(Ne()), he = n(null), q = n(0), M = n(!1), z = n(""), h = n([]), _ = n(null), J = n(null), K = n(null), e = d(() => {
29
- const a = ue({
30
- userConfig: k.config,
31
- defaultConfig: ve
32
- });
33
- return a.theme ? {
34
- ...ue({
35
- userConfig: Ee.vue_ui_onion[a.theme] || k.config,
36
- defaultConfig: a
37
- }),
38
- customPalette: Ae[a.theme] || re
39
- } : a;
40
- }), { isPrinting: ge, isImaging: fe, generatePdf: Q, generateImage: Z } = Ke({
41
- elementId: `vue-ui-onion_${w.value}`,
42
- fileName: e.value.style.chart.title.text || "vue-ui-onion"
43
- }), pe = d(() => Re(e.value.customPalette)), m = n({
44
- showTable: e.value.table.show,
45
- showTooltip: e.value.style.chart.tooltip.show
46
- }), r = n({
47
- height: 512,
48
- width: 512,
49
- padding: {
50
- top: 64,
51
- left: 64,
52
- right: 64,
53
- bottom: 64
54
- },
55
- minRadius: 64
56
- }), N = n(null);
57
- _e(() => {
58
- if (De(k.dataset) && j({
59
- componentName: "VueUiOnion",
60
- type: "dataset"
61
- }), e.value.responsive) {
62
- const o = Ue(() => {
63
- const { width: t, height: l } = Ye({
64
- chart: _.value,
65
- title: e.value.style.chart.title.text ? J.value : null,
66
- legend: e.value.style.chart.legend.show ? K.value : null
67
- });
68
- r.value.width = t, r.value.height = l, r.value.padding.top = Math.max(t, l) * 0.125, r.value.padding.right = Math.max(t, l) * 0.125, r.value.padding.bottom = Math.max(t, l) * 0.125, r.value.padding.left = Math.max(t, l) * 0.125, r.value.minRadius = Math.min(t, l) * 0.125;
69
- });
70
- N.value = new ResizeObserver(o), N.value.observe(_.value.parentNode);
71
- }
72
- }), Oe(() => {
73
- N.value && N.value.disconnect();
74
- });
75
- const u = d(() => ({
76
- top: r.value.padding.top,
77
- left: r.value.padding.left,
78
- right: r.value.width - r.value.padding.right,
79
- bottom: r.value.height - r.value.padding.bottom,
80
- centerX: r.value.width / 2,
81
- centerY: r.value.height / 2,
82
- width: r.value.width - r.value.padding.right - r.value.padding.left,
83
- height: r.value.height - r.value.padding.bottom - r.value.padding.top,
84
- minRadius: r.value.minRadius,
85
- maxRadius: Math.min(r.value.width, r.value.height) - r.value.padding.top * 2
86
- })), c = d(() => (k.dataset.forEach((a, o) => {
87
- [null, void 0].includes(a.name) && j({
88
- componentName: "VueUiOnion",
89
- type: "datasetSerieAttribute",
90
- property: "name",
91
- index: o
92
- }), [void 0].includes(a.percentage) && j({
93
- componentName: "VueUiOnion",
94
- type: "datasetSerieAttribute",
95
- property: "percentage",
96
- index: o
97
- });
98
- }), k.dataset.map((a, o) => {
99
- const t = `onion_serie_${o}_${w.value}`;
100
- return {
101
- ...a,
102
- percentage: a.percentage || 0,
103
- targetPercentage: a.percentage || 0,
104
- color: Le(a.color) || pe.value[o] || re[o],
105
- id: t,
106
- shape: "circle",
107
- opacity: h.value.includes(t) ? 0.5 : 1,
108
- absoluteIndex: o,
109
- segregate: () => ee(t),
110
- isSegregated: h.value.includes(t)
111
- };
112
- }))), O = n(c.value), ye = d(() => e.value.useStartAnimation), me = n(null), be = d(() => Math.max(...c.value.map((a) => a.percentage))), B = n(!1);
113
- Pe(() => c.value, ke, { immediate: !0 });
114
- function ke() {
115
- if (ye.value && !B.value) {
116
- let o = function() {
117
- a >= be.value ? (cancelAnimationFrame(me.value), O.value = c.value, B.value = !0) : (O.value = c.value.map((t) => ({
118
- ...t,
119
- percentage: a < t.targetPercentage ? a : t.targetPercentage
120
- })), a += 1, requestAnimationFrame(o), B.value = !0);
121
- };
122
- O.value = c.value.map((t) => ({
123
- ...t,
124
- percentage: 0
125
- }));
126
- let a = 0;
127
- o();
128
- } else
129
- O.value = c.value;
130
- }
131
- const $e = d(() => ({
132
- cy: "onion-div-legend",
133
- backgroundColor: e.value.style.chart.legend.backgroundColor,
134
- color: e.value.style.chart.legend.color,
135
- fontSize: e.value.style.chart.legend.fontSize,
136
- paddingBottom: 12,
137
- fontWeight: e.value.style.chart.legend.bold ? "bold" : ""
138
- })), we = d(() => c.value.filter((a) => !h.value.includes(a.id)).length), $ = d(() => {
139
- const a = Math.min(u.value.width, u.value.height) / 2 / c.value.length;
140
- return {
141
- gutter: (a > e.value.style.chart.layout.maxThickness ? e.value.style.chart.layout.maxThickness : a) * e.value.style.chart.layout.gutter.width,
142
- track: (a > e.value.style.chart.layout.maxThickness ? e.value.style.chart.layout.maxThickness : a) * e.value.style.chart.layout.track.width
143
- };
144
- }), f = d(() => O.value.filter((a) => !h.value.includes(a.id)).map((a, o) => {
145
- const t = (u.value.maxRadius - $.value.track) / we.value / 2 * (1 + o), l = u.value.centerY - t;
146
- return {
147
- percentage: a.percentage || 0,
148
- ...a,
149
- labelY: l,
150
- radius: t,
151
- path: xe(t, a.percentage || 0)
152
- };
153
- }));
154
- function xe(a, o) {
155
- const t = a * (1.5 + (o / 100 > 0.3333333333333333 ? 0 : 1 - o / 100)) * Math.PI, l = a * 1.5 * Math.PI;
156
- return {
157
- bgDashArray: `${l} ${l}`,
158
- bgDashOffset: l - o / 100 * l,
159
- dashArray: `${t} ${t}`,
160
- dashOffset: t - o / 100 * t,
161
- fullOffset: 0,
162
- active: `M${u.value.centerX},${u.value.centerY} A ${a},${a} 0 0 0 ${u.value.right},${u.value.top}`
163
- };
164
- }
165
- function ee(a) {
166
- h.value.includes(a) ? h.value = h.value.filter((o) => o !== a) : h.value.push(a), de("selectLegend", f.value);
167
- }
168
- function Ce() {
169
- return f.value;
170
- }
171
- const V = d(() => {
172
- const a = [e.value.table.translations.serie, e.value.table.translations.percentage, e.value.table.translations.value], o = f.value.map((t) => [
173
- t.name,
174
- t.percentage,
175
- t.value
176
- ]);
177
- return { head: a, body: o };
178
- }), A = d(() => {
179
- const a = V.value.head, o = f.value.map((l) => [
180
- `<span style="color:${l.color}">⬤</span> ${l.name}`,
181
- `${Number(l.percentage ?? 0).toFixed(e.value.table.td.roundingPercentage).toLocaleString()}%`,
182
- `${l.prefix || ""}${[null, void 0, NaN, "NaN"].includes(l.value) ? "-" : l.value.toFixed(e.value.table.td.roundingValue).toLocaleString()}${l.suffix || ""}`
183
- ]), t = {
184
- th: {
185
- backgroundColor: e.value.table.th.backgroundColor,
186
- color: e.value.table.th.color,
187
- outline: e.value.table.th.outline
188
- },
189
- td: {
190
- backgroundColor: e.value.table.td.backgroundColor,
191
- color: e.value.table.td.color,
192
- outline: e.value.table.td.outline
193
- },
194
- breakpoint: e.value.table.responsiveBreakpoint
195
- };
196
- return { head: a, body: o, config: t, colNames: a };
197
- });
198
- function te() {
199
- Se(() => {
200
- const a = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [""]], o = V.value.head, t = V.value.body, l = a.concat([o]).concat(t), y = Ve(l);
201
- Xe({ csvContent: y, title: e.value.style.chart.title.text || "vue-ui-onion" });
202
- });
203
- }
204
- const p = n(void 0), P = n(!1);
205
- function Te(a) {
206
- P.value = a, q.value += 1;
207
- }
208
- const X = n(null);
209
- function ae({ datapoint: a, seriesIndex: o, show: t = !0 }) {
210
- const l = a.absoluteIndex;
211
- p.value = o, X.value = {
212
- datapoint: a,
213
- seriesIndex: l,
214
- series: c.value,
215
- config: e.value
216
- }, M.value = t;
217
- let y = "";
218
- const G = e.value.style.chart.tooltip.customFormat;
219
- if (se(G) && Ge(() => G({
220
- seriesIndex: l,
221
- datapoint: a,
222
- series: c.value,
223
- config: e.value
224
- })))
225
- z.value = G({
226
- seriesIndex: l,
227
- datapoint: a,
228
- series: c.value,
229
- config: e.value
230
- });
231
- else {
232
- const U = e.value.style.chart.tooltip.showPercentage, Y = e.value.style.chart.tooltip.showValue;
233
- y += `<div style="width: 100%; border-bottom: 1px solid ${e.value.style.chart.tooltip.borderColor}; padding-bottom: 6px;margin-bottom:3px;display:flex;flex-direction:row;gap:3px;align-items:center"><svg viewBox="0 0 12 12" height="14" width="14"><circle cx="6" cy="6" r="6" stroke="none" fill="${a.color}"/></svg><span></span>${a.name}</span></div>`, y += `<div style="width:100%;text-align:left;"><b>${U ? ne({ p: "", v: a.percentage, s: "%", r: e.value.style.chart.tooltip.roundingPercentage }) : ""}</b> ${U && Y ? "(" : ""}${Y ? ne({ p: a.prefix || "", v: a.value, s: a.suffix || "", r: e.value.style.chart.tooltip.roundingValue }) : ""}${U && Y ? ")" : ""}</div>`, z.value = `<div>${y}</div>`;
234
- }
235
- }
236
- function le() {
237
- m.value.showTable = !m.value.showTable;
238
- }
239
- function oe() {
240
- m.value.showTooltip = !m.value.showTooltip;
241
- }
242
- return ce({
243
- getData: Ce,
244
- generatePdf: Q,
245
- generateCsv: te,
246
- generateImage: Z,
247
- toggleTable: le,
248
- toggleTooltip: oe
249
- }), (a, o) => (s(), i("div", {
250
- class: R(`vue-ui-onion ${P.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"}`),
251
- ref_key: "onionChart",
252
- ref: _,
253
- id: `vue-ui-onion_${w.value}`,
254
- style: D(`font-family:${e.value.style.fontFamily};width:100%; ${e.value.responsive ? "height: 100%;" : ""} text-align:center;background:${e.value.style.chart.backgroundColor}`)
255
- }, [
256
- e.value.style.chart.title.text ? (s(), i("div", {
257
- key: 0,
258
- ref_key: "chartTitle",
259
- ref: J,
260
- style: D(`width:100%;background:${e.value.style.chart.backgroundColor}`)
261
- }, [
262
- E(He, {
263
- config: {
264
- title: {
265
- cy: "onion-div-title",
266
- ...e.value.style.chart.title
267
- },
268
- subtitle: {
269
- cy: "onion-div-subtitle",
270
- ...e.value.style.chart.title.subtitle
271
- }
272
- }
273
- }, null, 8, ["config"])
274
- ], 4)) : b("", !0),
275
- e.value.userOptions.show && S.value ? (s(), L(We, {
276
- ref_key: "details",
277
- ref: he,
278
- key: `user_options${q.value}`,
279
- backgroundColor: e.value.style.chart.backgroundColor,
280
- color: e.value.style.chart.color,
281
- isImaging: x(fe),
282
- isPrinting: x(ge),
283
- uid: w.value,
284
- hasTooltip: e.value.userOptions.buttons.tooltip && e.value.style.chart.tooltip.show,
285
- hasPdf: e.value.userOptions.buttons.pdf,
286
- hasImg: e.value.userOptions.buttons.img,
287
- hasXls: e.value.userOptions.buttons.csv,
288
- hasTable: e.value.userOptions.buttons.table,
289
- hasFullscreen: e.value.userOptions.buttons.fullscreen,
290
- isFullscreen: P.value,
291
- isTooltip: m.value.showTooltip,
292
- titles: { ...e.value.userOptions.buttonTitles },
293
- chartElement: _.value,
294
- onToggleFullscreen: Te,
295
- onGeneratePdf: x(Q),
296
- onGenerateCsv: te,
297
- onGenerateImage: x(Z),
298
- onToggleTable: le,
299
- onToggleTooltip: oe
300
- }, Fe({ _: 2 }, [
301
- a.$slots.optionTooltip ? {
302
- name: "optionTooltip",
303
- fn: v(() => [
304
- g(a.$slots, "optionTooltip", {}, void 0, !0)
305
- ]),
306
- key: "0"
307
- } : void 0,
308
- a.$slots.optionPdf ? {
309
- name: "optionPdf",
310
- fn: v(() => [
311
- g(a.$slots, "optionPdf", {}, void 0, !0)
312
- ]),
313
- key: "1"
314
- } : void 0,
315
- a.$slots.optionCsv ? {
316
- name: "optionCsv",
317
- fn: v(() => [
318
- g(a.$slots, "optionCsv", {}, void 0, !0)
319
- ]),
320
- key: "2"
321
- } : void 0,
322
- a.$slots.optionImg ? {
323
- name: "optionImg",
324
- fn: v(() => [
325
- g(a.$slots, "optionImg", {}, void 0, !0)
326
- ]),
327
- key: "3"
328
- } : void 0,
329
- a.$slots.optionTable ? {
330
- name: "optionTable",
331
- fn: v(() => [
332
- g(a.$slots, "optionTable", {}, void 0, !0)
333
- ]),
334
- key: "4"
335
- } : void 0,
336
- a.$slots.optionFullscreen ? {
337
- name: "optionFullscreen",
338
- fn: v(({ toggleFullscreen: t, isFullscreen: l }) => [
339
- g(a.$slots, "optionFullscreen", H(W({ toggleFullscreen: t, isFullscreen: l })), void 0, !0)
340
- ]),
341
- key: "5"
342
- } : void 0
343
- ]), 1032, ["backgroundColor", "color", "isImaging", "isPrinting", "uid", "hasTooltip", "hasPdf", "hasImg", "hasXls", "hasTable", "hasFullscreen", "isFullscreen", "isTooltip", "titles", "chartElement", "onGeneratePdf", "onGenerateImage"])) : b("", !0),
344
- S.value ? (s(), i("svg", {
345
- key: 2,
346
- xmlns: x(ze),
347
- class: R({ "vue-data-ui-fullscreen--on": P.value, "vue-data-ui-fulscreen--off": !P.value }),
348
- viewBox: `0 0 ${r.value.width <= 0 ? 1e-4 : r.value.width} ${r.value.height <= 0 ? 1e-4 : r.value.height}`,
349
- style: D(`max-width:100%;overflow:visible;background:${e.value.style.chart.backgroundColor};color:${e.value.style.chart.color}`)
350
- }, [
351
- (s(!0), i(F, null, I(f.value, (t, l) => (s(), i("circle", {
352
- cx: u.value.centerX,
353
- cy: u.value.centerY,
354
- r: t.radius <= 0 ? 1e-4 : t.radius,
355
- stroke: e.value.style.chart.layout.gutter.color,
356
- "stroke-width": $.value.gutter,
357
- fill: "none",
358
- "stroke-dasharray": t.path.bgDashArray,
359
- "stroke-dashoffset": t.path.fullOffset,
360
- "stroke-linecap": "round",
361
- class: R({ "vue-ui-onion-path": !0, "vue-ui-onion-blur": e.value.useBlurOnHover && ![null, void 0].includes(p.value) && p.value !== l }),
362
- style: { transform: "rotate(-90deg)", "transform-origin": "50% 50%" }
363
- }, null, 10, at))), 256)),
364
- (s(!0), i(F, null, I(f.value, (t, l) => (s(), i("circle", {
365
- cx: u.value.centerX,
366
- cy: u.value.centerY,
367
- r: t.radius < 0 ? 1e-4 : t.radius,
368
- stroke: `${t.color}`,
369
- "stroke-width": $.value.track,
370
- fill: "none",
371
- "stroke-dasharray": t.path.dashArray,
372
- "stroke-dashoffset": t.path.dashOffset,
373
- class: R({ "vue-ui-onion-path": !0, "vue-ui-onion-blur": e.value.useBlurOnHover && ![null, void 0].includes(p.value) && p.value !== l }),
374
- "stroke-linecap": "round",
375
- style: { transform: "rotate(-90deg)", "transform-origin": "50% 50%" }
376
- }, null, 10, lt))), 256)),
377
- C("defs", null, [
378
- C("filter", {
379
- id: `blur_${w.value}`,
380
- x: "-50%",
381
- y: "-50%",
382
- width: "200%",
383
- height: "200%"
384
- }, [
385
- C("feGaussianBlur", {
386
- in: "SourceGraphic",
387
- stdDeviation: 100 / e.value.style.chart.gradientIntensity
388
- }, null, 8, rt)
389
- ], 8, ot)
390
- ]),
391
- e.value.style.chart.useGradient ? (s(), i("g", {
392
- key: 0,
393
- filter: `url(#blur_${w.value})`
394
- }, [
395
- (s(!0), i(F, null, I(f.value, (t, l) => (s(), i("circle", {
396
- cx: u.value.centerX,
397
- cy: u.value.centerY,
398
- r: t.radius <= 0 ? 1e-4 : t.radius,
399
- stroke: "white",
400
- "stroke-width": $.value.track / 3,
401
- fill: "none",
402
- "stroke-linecap": "round",
403
- "stroke-dasharray": t.path.dashArray,
404
- "stroke-dashoffset": t.path.dashOffset,
405
- style: { transform: "rotate(-90deg)", "transform-origin": "50% 50%" }
406
- }, null, 8, nt))), 256))
407
- ], 8, st)) : b("", !0),
408
- (s(!0), i(F, null, I(f.value, (t, l) => (s(), i("circle", {
409
- "data-cy-trap": "",
410
- cx: u.value.centerX,
411
- cy: u.value.centerY,
412
- r: t.radius <= 0 ? 1e-4 : t.radius,
413
- stroke: "transparent",
414
- "stroke-width": Math.max($.value.track, $.value.gutter),
415
- fill: "none",
416
- "stroke-dasharray": t.path.bgDashArray,
417
- "stroke-dashoffset": t.path.fullOffset,
418
- "stroke-linecap": "round",
419
- class: "vue-ui-onion-path",
420
- style: { transform: "rotate(-90deg)", "transform-origin": "50% 50%" },
421
- onMouseenter: (y) => ae({
422
- datapoint: t,
423
- show: !0,
424
- seriesIndex: l
425
- }),
426
- onMouseleave: o[0] || (o[0] = (y) => {
427
- p.value = void 0, M.value = !1;
428
- })
429
- }, null, 40, ut))), 256)),
430
- e.value.style.chart.layout.labels.show ? (s(), i("g", it, [
431
- (s(!0), i(F, null, I(f.value, (t, l) => (s(), i("g", {
432
- onMouseenter: (y) => ae({
433
- datapoint: t,
434
- show: !0,
435
- seriesIndex: l
436
- }),
437
- onMouseleave: o[1] || (o[1] = (y) => {
438
- p.value = void 0, M.value = !1;
439
- })
440
- }, [
441
- h.value.includes(t.id) ? b("", !0) : (s(), i("text", {
442
- key: 0,
443
- x: r.value.width / 2 - $.value.gutter * 0.8 + e.value.style.chart.layout.labels.offsetX,
444
- y: t.labelY + e.value.style.chart.layout.labels.offsetY,
445
- "text-anchor": "end",
446
- "font-size": e.value.style.chart.layout.labels.fontSize,
447
- fill: e.value.useBlurOnHover && ![null, void 0].includes(p.value) && p.value === l ? t.color : e.value.style.chart.layout.labels.color,
448
- "font-weight": e.value.style.chart.layout.labels.bold ? "bold" : "normal"
449
- }, T(t.name ? t.name + ": " : "") + " " + T(e.value.style.chart.layout.labels.percentage.show ? `${(t.percentage || 0).toFixed(e.value.style.chart.layout.labels.roundingPercentage)}%` : "") + " " + T(!e.value.style.chart.layout.labels.percentage.show && e.value.style.chart.layout.labels.value.show ? ` : ${t.value ? `${t.prefix || ""}${t.value.toFixed(e.value.style.chart.layout.labels.roundingValue)}${t.suffix || ""}` : ""}` : `${e.value.style.chart.layout.labels.value.show && t.value ? `(${t.prefix || ""}${t.value.toFixed(e.value.style.chart.layout.labels.roundingValue)}${t.suffix || ""})` : ""}`), 9, dt))
450
- ], 40, ct))), 256))
451
- ])) : b("", !0),
452
- g(a.$slots, "svg", { svg: r.value }, void 0, !0)
453
- ], 14, tt)) : b("", !0),
454
- S.value ? b("", !0) : (s(), L(Qe, {
455
- key: 3,
456
- config: {
457
- type: "onion",
458
- style: {
459
- backgroundColor: e.value.style.chart.backgroundColor,
460
- onion: {
461
- color: e.value.style.chart.layout.gutter.color
462
- }
463
- }
464
- }
465
- }, null, 8, ["config"])),
466
- C("div", {
467
- ref_key: "chartLegend",
468
- ref: K
469
- }, [
470
- e.value.style.chart.legend.show ? (s(), L(je, {
471
- key: 0,
472
- legendSet: c.value,
473
- config: $e.value,
474
- onClickMarker: o[2] || (o[2] = ({ legend: t }) => ee(t.id))
475
- }, {
476
- item: v(({ legend: t }) => [
477
- C("div", {
478
- "data-cy-legend-item": "",
479
- onClick: (l) => t.segregate(),
480
- style: D(`opacity:${h.value.includes(t.id) ? 0.5 : 1}`)
481
- }, T(t.name ? t.name + ": " : "") + " " + T((t.percentage || 0).toFixed(e.value.style.chart.legend.roundingPercentage)) + "% ", 13, vt)
482
- ]),
483
- _: 1
484
- }, 8, ["legendSet", "config"])) : g(a.$slots, "legend", {
485
- key: 1,
486
- legend: c.value
487
- }, void 0, !0)
488
- ], 512),
489
- E(qe, {
490
- show: m.value.showTooltip && M.value,
491
- backgroundColor: e.value.style.chart.tooltip.backgroundColor,
492
- color: e.value.style.chart.tooltip.color,
493
- borderRadius: e.value.style.chart.tooltip.borderRadius,
494
- borderColor: e.value.style.chart.tooltip.borderColor,
495
- borderWidth: e.value.style.chart.tooltip.borderWidth,
496
- fontSize: e.value.style.chart.tooltip.fontSize,
497
- backgroundOpacity: e.value.style.chart.tooltip.backgroundOpacity,
498
- parent: _.value,
499
- content: z.value,
500
- isCustom: x(se)(e.value.style.chart.tooltip.customFormat)
501
- }, {
502
- "tooltip-before": v(() => [
503
- g(a.$slots, "tooltip-before", H(W({ ...X.value })), void 0, !0)
504
- ]),
505
- "tooltip-after": v(() => [
506
- g(a.$slots, "tooltip-after", H(W({ ...X.value })), void 0, !0)
507
- ]),
508
- _: 3
509
- }, 8, ["show", "backgroundColor", "color", "borderRadius", "borderColor", "borderWidth", "fontSize", "backgroundOpacity", "parent", "content", "isCustom"]),
510
- S.value ? (s(), L(Ze, {
511
- key: 4,
512
- hideDetails: "",
513
- config: {
514
- open: m.value.showTable,
515
- maxHeight: 1e4,
516
- head: {
517
- backgroundColor: e.value.style.chart.backgroundColor,
518
- color: e.value.style.chart.color
519
- },
520
- body: {
521
- backgroundColor: e.value.style.chart.backgroundColor,
522
- color: e.value.style.chart.color
523
- }
524
- }
525
- }, {
526
- content: v(() => [
527
- E(Be, {
528
- colNames: A.value.colNames,
529
- head: A.value.head,
530
- body: A.value.body,
531
- config: A.value.config,
532
- title: `${e.value.style.chart.title.text}${e.value.style.chart.title.subtitle.text ? ` : ${e.value.style.chart.title.subtitle.text}` : ""}`,
533
- onClose: o[3] || (o[3] = (t) => m.value.showTable = !1)
534
- }, {
535
- th: v(({ th: t }) => [
536
- Ie(T(t), 1)
537
- ]),
538
- td: v(({ td: t }) => [
539
- C("div", { innerHTML: t }, null, 8, ht)
540
- ]),
541
- _: 1
542
- }, 8, ["colNames", "head", "body", "config", "title"])
543
- ]),
544
- _: 1
545
- }, 8, ["config"])) : b("", !0)
546
- ], 14, et));
547
- }
548
- }, Ct = /* @__PURE__ */ Me(gt, [["__scopeId", "data-v-2ee9d4d0"]]);
549
- export {
550
- Ct as default
551
- };