vue-data-ui 3.23.1 → 3.23.2

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 (171) hide show
  1. package/dist/{PackageVersion-D6d8SCp9.js → PackageVersion-DXU7nRr9.js} +1 -1
  2. package/dist/components/vue-ui-3d-bar.js +1 -1
  3. package/dist/components/vue-ui-accordion.js +1 -1
  4. package/dist/components/vue-ui-age-pyramid.js +1 -1
  5. package/dist/components/vue-ui-annotator.js +1 -1
  6. package/dist/components/vue-ui-bullet.js +1 -1
  7. package/dist/components/vue-ui-bump.js +1 -1
  8. package/dist/components/vue-ui-candlestick.js +1 -1
  9. package/dist/components/vue-ui-carousel-table.js +1 -1
  10. package/dist/components/vue-ui-chestnut.js +1 -1
  11. package/dist/components/vue-ui-chord.js +1 -1
  12. package/dist/components/vue-ui-circle-pack.js +1 -1
  13. package/dist/components/vue-ui-cursor.js +1 -1
  14. package/dist/components/vue-ui-dag.js +1 -1
  15. package/dist/components/vue-ui-dashboard.js +1 -1
  16. package/dist/components/vue-ui-digits.js +1 -1
  17. package/dist/components/vue-ui-donut-evolution.js +1 -1
  18. package/dist/components/vue-ui-donut.js +1 -1
  19. package/dist/components/vue-ui-dumbbell.js +1 -1
  20. package/dist/components/vue-ui-flow.js +1 -1
  21. package/dist/components/vue-ui-funnel.js +1 -1
  22. package/dist/components/vue-ui-galaxy.js +1 -1
  23. package/dist/components/vue-ui-gauge.js +1 -1
  24. package/dist/components/vue-ui-geo.js +1 -1
  25. package/dist/components/vue-ui-gizmo.js +1 -1
  26. package/dist/components/vue-ui-heatmap.js +1 -1
  27. package/dist/components/vue-ui-hill.js +1 -1
  28. package/dist/components/vue-ui-history-plot.js +1 -1
  29. package/dist/components/vue-ui-horizontal-bar.js +1 -1
  30. package/dist/components/vue-ui-kpi.js +1 -1
  31. package/dist/components/vue-ui-mini-loader.js +1 -1
  32. package/dist/components/vue-ui-molecule.js +1 -1
  33. package/dist/components/vue-ui-mood-radar.js +1 -1
  34. package/dist/components/vue-ui-nested-donuts.js +1 -1
  35. package/dist/components/vue-ui-onion.js +1 -1
  36. package/dist/components/vue-ui-parallel-coordinate-plot.js +1 -1
  37. package/dist/components/vue-ui-quadrant.js +1 -1
  38. package/dist/components/vue-ui-quick-chart.js +1 -1
  39. package/dist/components/vue-ui-radar.js +1 -1
  40. package/dist/components/vue-ui-rating.js +1 -1
  41. package/dist/components/vue-ui-relation-circle.js +1 -1
  42. package/dist/components/vue-ui-ridgeline.js +1 -1
  43. package/dist/components/vue-ui-rings.js +1 -1
  44. package/dist/components/vue-ui-scatter.js +1 -1
  45. package/dist/components/vue-ui-skeleton.js +1 -1
  46. package/dist/components/vue-ui-smiley.js +1 -1
  47. package/dist/components/vue-ui-spark-trend.js +1 -1
  48. package/dist/components/vue-ui-sparkbar.js +1 -1
  49. package/dist/components/vue-ui-sparkgauge.js +1 -1
  50. package/dist/components/vue-ui-sparkhistogram.js +1 -1
  51. package/dist/components/vue-ui-sparkline.js +1 -1
  52. package/dist/components/vue-ui-sparkstackbar.js +1 -1
  53. package/dist/components/vue-ui-stackbar.js +1 -1
  54. package/dist/components/vue-ui-stackline.js +1 -1
  55. package/dist/components/vue-ui-strip-plot.js +1 -1
  56. package/dist/components/vue-ui-table-heatmap.js +1 -1
  57. package/dist/components/vue-ui-table-sparkline.js +1 -1
  58. package/dist/components/vue-ui-table.js +1 -1
  59. package/dist/components/vue-ui-thermometer.js +1 -1
  60. package/dist/components/vue-ui-timer.js +1 -1
  61. package/dist/components/vue-ui-tiremarks.js +1 -1
  62. package/dist/components/vue-ui-treemap.js +1 -1
  63. package/dist/components/vue-ui-vertical-bar.js +1 -1
  64. package/dist/components/vue-ui-waffle.js +1 -1
  65. package/dist/components/vue-ui-wheel.js +1 -1
  66. package/dist/components/vue-ui-word-cloud.js +1 -1
  67. package/dist/components/vue-ui-world.js +1 -1
  68. package/dist/components/vue-ui-xy-canvas.js +1 -1
  69. package/dist/components/vue-ui-xy.js +1 -1
  70. package/dist/{package-KvlL5CqE.js → package-bsfpO6y3.js} +1 -1
  71. package/dist/{render-common-oDYGTc5P.js → render-common-C0PEe9so.js} +1 -1
  72. package/dist/ssr/vue-ui-donut.js +1 -1
  73. package/dist/ssr/vue-ui-xy.js +1 -1
  74. package/dist/ssr.js +2 -2
  75. package/dist/style.css +1 -1
  76. package/dist/types/vue-data-ui.d.ts +6 -0
  77. package/dist/{useSvgExport-DH-FfcqQ.js → useChartExport-DNiwdPmb.js} +47 -1
  78. package/dist/{useConfig-D3scuR88.js → useConfig-DlNpz6P8.js} +6 -0
  79. package/dist/{useObjectBindings-Brg8mm5J.js → useObjectBindings-BeWS5v0i.js} +1 -1
  80. package/dist/utils.js +1 -1
  81. package/dist/{vue-data-ui-DGWDPCwC.js → vue-data-ui-BNxtW8pK.js} +68 -68
  82. package/dist/vue-data-ui.js +69 -69
  83. package/dist/{vue-ui-3d-bar-C_Su9fve.js → vue-ui-3d-bar-BYumVxZG.js} +164 -182
  84. package/dist/{vue-ui-accordion-BxGriZik.js → vue-ui-accordion-DegI2lzR.js} +1 -1
  85. package/dist/vue-ui-age-pyramid-tJx_hCsS.js +1241 -0
  86. package/dist/{vue-ui-annotator-CCtnM8Rv.js → vue-ui-annotator-DfG79D4r.js} +2 -2
  87. package/dist/vue-ui-bullet-DrWG4jRy.js +700 -0
  88. package/dist/{vue-ui-bump-CcdzJZ9n.js → vue-ui-bump-mKysp0KO.js} +213 -263
  89. package/dist/vue-ui-candlestick-PgKcBZdy.js +1837 -0
  90. package/dist/vue-ui-carousel-table-DRvycNBl.js +467 -0
  91. package/dist/vue-ui-chestnut-Dpklo-VE.js +2014 -0
  92. package/dist/vue-ui-chord-7PPVH_iG.js +1345 -0
  93. package/dist/vue-ui-circle-pack-DW4Os6_8.js +1636 -0
  94. package/dist/{vue-ui-cursor-BqHr0n1Z.js → vue-ui-cursor-DIt7vOwc.js} +2 -2
  95. package/dist/{vue-ui-dag-jMLVoQkb.js → vue-ui-dag-Cl0WdSLb.js} +492 -515
  96. package/dist/{vue-ui-dashboard-DVAUFETR.js → vue-ui-dashboard-BwxRLR4E.js} +65 -65
  97. package/dist/{vue-ui-digits-Dy4gG6qm.js → vue-ui-digits-Bp1OH_t1.js} +2 -2
  98. package/dist/{vue-ui-donut-C0cWRLbU.js → vue-ui-donut-BZUT7QYt.js} +333 -359
  99. package/dist/vue-ui-donut-evolution-CQy3ZKXk.js +1549 -0
  100. package/dist/{vue-ui-donut-CYpxGBhl.js → vue-ui-donut-y6tOAVyY.js} +2 -2
  101. package/dist/{vue-ui-dumbbell-DxVbRjKR.js → vue-ui-dumbbell-BtKZcAOV.js} +378 -428
  102. package/dist/{vue-ui-flow-DWaZF4FS.js → vue-ui-flow-BF_cndsv.js} +182 -207
  103. package/dist/vue-ui-funnel-z3AeiDu6.js +750 -0
  104. package/dist/{vue-ui-galaxy-CWBP9oH9.js → vue-ui-galaxy-ClWaSOmM.js} +308 -334
  105. package/dist/vue-ui-gauge-CJstpakj.js +932 -0
  106. package/dist/{vue-ui-geo-ZA7CBy8f.js → vue-ui-geo-B1tOD3HC.js} +362 -413
  107. package/dist/{vue-ui-gizmo-SQCou0bQ.js → vue-ui-gizmo-foatosAv.js} +2 -2
  108. package/dist/{vue-ui-heatmap-CHd9gs_p.js → vue-ui-heatmap-By33A9dZ.js} +292 -315
  109. package/dist/vue-ui-hill-ewqkK9s5.js +1745 -0
  110. package/dist/{vue-ui-history-plot-BwnlC1mx.js → vue-ui-history-plot-FEIwXlsz.js} +258 -283
  111. package/dist/{vue-ui-horizontal-bar-BUar2HUH.js → vue-ui-horizontal-bar-D51sAeVu.js} +273 -298
  112. package/dist/{vue-ui-kpi-BF_9WWoo.js → vue-ui-kpi-y3EkgqJQ.js} +2 -2
  113. package/dist/{vue-ui-mini-loader-CvfukjXi.js → vue-ui-mini-loader-CtTewZJG.js} +1 -1
  114. package/dist/vue-ui-molecule-paWHp18h.js +935 -0
  115. package/dist/{vue-ui-mood-radar-_zpbmvJs.js → vue-ui-mood-radar-wBRTZI5k.js} +337 -386
  116. package/dist/vue-ui-nested-donuts-CB-HOLo2.js +1503 -0
  117. package/dist/{vue-ui-onion-CB5RYIy5.js → vue-ui-onion-B2Q2n55x.js} +257 -282
  118. package/dist/{vue-ui-parallel-coordinate-plot-BUwt-apg.js → vue-ui-parallel-coordinate-plot-GpkXiIZA.js} +190 -215
  119. package/dist/{vue-ui-quadrant-CoROD3er.js → vue-ui-quadrant-DOPuejDE.js} +213 -243
  120. package/dist/{vue-ui-quick-chart-BcH7eY4-.js → vue-ui-quick-chart-CgHX9njq.js} +52 -61
  121. package/dist/{vue-ui-radar-DGbaXGme.js → vue-ui-radar-BLvG-_zE.js} +343 -370
  122. package/dist/{vue-ui-rating-Bo3zD3yW.js → vue-ui-rating-BDVSVFA0.js} +8 -9
  123. package/dist/vue-ui-relation-circle-plOXwxJ5.js +903 -0
  124. package/dist/{vue-ui-ridgeline-BCaGcyfk.js → vue-ui-ridgeline-BbrnXvBo.js} +267 -317
  125. package/dist/{vue-ui-rings-BJUBn8_b.js → vue-ui-rings-B3cKfMWy.js} +407 -432
  126. package/dist/vue-ui-scatter-BY7waF2T.js +2403 -0
  127. package/dist/{vue-ui-skeleton-EeJcGbCo.js → vue-ui-skeleton-DwKxd7fk.js} +2 -2
  128. package/dist/{vue-ui-smiley-D0gibt5c.js → vue-ui-smiley-5iHJeTPc.js} +62 -63
  129. package/dist/{vue-ui-spark-trend-BRoQ7JpQ.js → vue-ui-spark-trend-MpvrV5Wd.js} +2 -2
  130. package/dist/{vue-ui-sparkbar-DFp2k7-7.js → vue-ui-sparkbar-s-2rBmEz.js} +97 -100
  131. package/dist/{vue-ui-sparkgauge-D0Bq85Hs.js → vue-ui-sparkgauge-B-BYVv4p.js} +2 -2
  132. package/dist/{vue-ui-sparkhistogram-BPln7v63.js → vue-ui-sparkhistogram-D7D4NHdi.js} +7 -8
  133. package/dist/{vue-ui-sparkline-C6Q45Dqp.js → vue-ui-sparkline-RbeYtLWp.js} +6 -7
  134. package/dist/{vue-ui-sparkstackbar-CjK4bcQg.js → vue-ui-sparkstackbar-ohN7mtbg.js} +191 -195
  135. package/dist/{vue-ui-stackbar-Ca8EPf3e.js → vue-ui-stackbar-D2bpvQYt.js} +524 -549
  136. package/dist/{vue-ui-stackline-Pz5WWlWT.js → vue-ui-stackline-Bo1oE8yq.js} +570 -595
  137. package/dist/vue-ui-strip-plot-CZ-C4a5x.js +1734 -0
  138. package/dist/{vue-ui-table-Bjg-ujJu.js → vue-ui-table-3PPiJPV6.js} +3 -3
  139. package/dist/{vue-ui-table-heatmap-ljeYW8Wc.js → vue-ui-table-heatmap-D1bbPXKG.js} +48 -49
  140. package/dist/{vue-ui-table-sparkline-iRFmtK5S.js → vue-ui-table-sparkline-l1cUX3ny.js} +7 -9
  141. package/dist/{vue-ui-thermometer-D8uiOaeA.js → vue-ui-thermometer-DltAELO7.js} +240 -261
  142. package/dist/{vue-ui-timer-CYw983oL.js → vue-ui-timer-DWNdx47q.js} +2 -2
  143. package/dist/vue-ui-tiremarks-GYhji_fa.js +538 -0
  144. package/dist/{vue-ui-treemap-h4VbnqPA.js → vue-ui-treemap-DjNlnOG5.js} +498 -524
  145. package/dist/vue-ui-waffle-BAA9EX6O.js +1386 -0
  146. package/dist/{vue-ui-wheel-tLvJadk5.js → vue-ui-wheel-DrefGLos.js} +188 -209
  147. package/dist/{vue-ui-word-cloud-BjpGSsod.js → vue-ui-word-cloud-CQZ8AyOi.js} +375 -398
  148. package/dist/{vue-ui-world-B4fCS3jN.js → vue-ui-world-Y7a3VEjq.js} +428 -453
  149. package/dist/{vue-ui-xy-7ZT9IRD8.js → vue-ui-xy-CJcdttNL.js} +857 -883
  150. package/dist/{vue-ui-xy-gyNS0yH0.js → vue-ui-xy-DPxtkYGc.js} +2 -2
  151. package/dist/{vue-ui-xy-canvas-BnLEwBpi.js → vue-ui-xy-canvas-1rbwMA1m.js} +13 -12
  152. package/package.json +1 -1
  153. package/dist/Slicer-CIk57nL4.js +0 -1163
  154. package/dist/vue-ui-age-pyramid-D4k1MkAL.js +0 -1264
  155. package/dist/vue-ui-bullet-DLZr2Uk8.js +0 -724
  156. package/dist/vue-ui-candlestick-EEEt7ORC.js +0 -1866
  157. package/dist/vue-ui-carousel-table-BicIpNAD.js +0 -463
  158. package/dist/vue-ui-chestnut-BI7mC5dd.js +0 -2068
  159. package/dist/vue-ui-chord-DXaq8ZMu.js +0 -1396
  160. package/dist/vue-ui-circle-pack-XHJBMG51.js +0 -1659
  161. package/dist/vue-ui-donut-evolution-DwR47A2r.js +0 -1603
  162. package/dist/vue-ui-funnel-Bmpx5GHR.js +0 -797
  163. package/dist/vue-ui-gauge-ByE_txav.js +0 -953
  164. package/dist/vue-ui-hill-BT183G-_.js +0 -1768
  165. package/dist/vue-ui-molecule-Bi2CKHer.js +0 -958
  166. package/dist/vue-ui-nested-donuts-qHZAJ70u.js +0 -1528
  167. package/dist/vue-ui-relation-circle-DaU1eTsG.js +0 -925
  168. package/dist/vue-ui-scatter-Pcft1bUt.js +0 -2428
  169. package/dist/vue-ui-strip-plot-Dw4MGDSO.js +0 -1757
  170. package/dist/vue-ui-tiremarks-CekiW2Ru.js +0 -559
  171. package/dist/vue-ui-waffle-cu0w_s6L.js +0 -1412
@@ -1,1528 +0,0 @@
1
- import { t as e } from "./rolldown-runtime-Dy4uBu1J.js";
2
- import { $ as t, Bt as n, D as r, Ft as i, Jt as a, Kt as o, Pt as s, Rt as c, S as l, X as u, b as ee, ct as te, et as ne, f as re, i as d, jt as ie, kt as ae, n as oe, p as se, q as ce, t as le, tt as f, w as ue, xt as de } from "./lib-Bttd6u5E.js";
3
- import { n as fe, t as pe } from "./useHints-Dq_w2E8B.js";
4
- import { t as me } from "./useConfig-D3scuR88.js";
5
- import { t as he } from "./usePrinter-DN5bYhTG.js";
6
- import { n as ge, t as _e } from "./BaseScanner-DZvpgOjM.js";
7
- import { t as ve } from "./useSvgExport-DH-FfcqQ.js";
8
- import { t as ye } from "./useNestedProp-vPNvh7rV.js";
9
- import { t as be } from "./useThemeCheck-C43Tcqmk.js";
10
- import { t as xe } from "./img-Bnokohej.js";
11
- import { n as Se } from "./Title-BE3qg9xl.js";
12
- import { t as Ce } from "./_plugin-vue_export-helper-B3ysoDQm.js";
13
- import { l as we, t as Te } from "./useResponsive-ZtArZtUf.js";
14
- import { t as Ee } from "./DefGrad-DVBqDjhO.js";
15
- import { t as De } from "./BaseLegendToggle-DZVucLnv.js";
16
- import { t as Oe } from "./A11yDataTable-DdRsVULz.js";
17
- import { t as ke } from "./useUserOptionState-DK-_1ddE.js";
18
- import { t as Ae } from "./useChartAccessibility-DYqac8yF.js";
19
- import { t as je } from "./labelUtils-BeVpDvTJ.js";
20
- import { t as Me } from "./Legend-CQxUgOd-.js";
21
- import { t as Ne } from "./vue_ui_nested_donuts-B8csIoVO.js";
22
- import { Fragment as p, Teleport as Pe, computed as m, createBlock as h, createCommentVNode as g, createElementBlock as _, createElementVNode as v, createSlots as Fe, createTextVNode as Ie, createVNode as Le, defineAsyncComponent as y, guardReactiveProps as b, mergeProps as Re, nextTick as ze, normalizeClass as Be, normalizeProps as x, normalizeStyle as Ve, onBeforeUnmount as He, onMounted as Ue, openBlock as S, ref as C, renderList as w, renderSlot as T, resolveDynamicComponent as We, shallowRef as Ge, toDisplayString as E, toRefs as Ke, unref as D, vShow as qe, watch as Je, withCtx as O, withDirectives as Ye } from "vue";
23
- //#region src/components/vue-ui-nested-donuts.vue
24
- var Xe = /* @__PURE__ */ e({ default: () => Dt }), Ze = ["id"], Qe = ["id"], $e = ["id"], et = { style: { position: "relative" } }, tt = [
25
- "xmlns",
26
- "aria-describedby",
27
- "viewBox"
28
- ], nt = ["width", "height"], rt = ["id"], it = ["id"], at = ["id"], ot = ["flood-color"], st = ["id", "d"], ct = [
29
- "d",
30
- "fill",
31
- "stroke",
32
- "stroke-width",
33
- "filter"
34
- ], lt = [
35
- "d",
36
- "fill",
37
- "stroke",
38
- "stroke-width"
39
- ], ut = { key: 1 }, dt = ["d", "fill"], ft = { key: 2 }, pt = [
40
- "font-size",
41
- "font-weight",
42
- "fill",
43
- "dy"
44
- ], mt = ["href"], ht = [
45
- "x",
46
- "y",
47
- "font-size",
48
- "font-weight",
49
- "fill"
50
- ], gt = { key: 3 }, _t = ["filter"], vt = [
51
- "opacity",
52
- "text-anchor",
53
- "x",
54
- "y",
55
- "fill",
56
- "font-size",
57
- "font-weight"
58
- ], yt = [
59
- "opacity",
60
- "text-anchor",
61
- "x",
62
- "y",
63
- "fill",
64
- "font-size",
65
- "font-weight"
66
- ], bt = [
67
- "d",
68
- "fill",
69
- "onMouseenter",
70
- "onClick",
71
- "onMouseleave"
72
- ], xt = {
73
- key: 0,
74
- style: {
75
- position: "absolute",
76
- top: "100%",
77
- left: "0",
78
- width: "100%"
79
- },
80
- "data-dom-to-png-ignore": "",
81
- "aria-hidden": "true"
82
- }, St = {
83
- key: 5,
84
- class: "vue-data-ui-watermark"
85
- }, Ct = ["id"], wt = {
86
- key: 0,
87
- class: "vue-ui-nested-donuts-legend-title"
88
- }, Tt = ["onClick"], Et = ["innerHTML"], Dt = /*#__PURE__*/ Ce({
89
- __name: "vue-ui-nested-donuts",
90
- props: {
91
- config: {
92
- type: Object,
93
- default() {
94
- return {};
95
- }
96
- },
97
- dataset: {
98
- type: Array,
99
- default() {
100
- return [];
101
- }
102
- }
103
- },
104
- emits: [
105
- "selectLegend",
106
- "selectDatapoint",
107
- "copyAlt"
108
- ],
109
- setup(e, { expose: Ce, emit: Xe }) {
110
- let Dt = y(() => import("./Tooltip-DhjyfHwz.js")), Ot = y(() => import("./BaseIcon-BfndwIWE.js").then((e) => e.n)), kt = y(() => import("./vue-ui-accordion-BxGriZik.js").then((e) => e.n)), At = y(() => import("./DataTable-BbKgJ5UI.js")), jt = y(() => import("./UserOptions-Dt98of5H.js").then((e) => e.n)), Mt = y(() => import("./PenAndPaper-DAE-tnEQ.js").then((e) => e.t)), Nt = y(() => import("./PackageVersion-D6d8SCp9.js").then((e) => e.t)), Pt = y(() => import("./BaseDraggableDialog-LoqqwRtV.js").then((e) => e.n)), { vue_ui_nested_donuts: Ft } = me(), { isThemeValid: It, warnInvalidTheme: Lt } = be(), k = e, Rt = m({
111
- get() {
112
- return !!k.dataset && k.dataset.length;
113
- },
114
- set(e) {
115
- return e;
116
- }
117
- }), A = C(ce()), zt = C(!1), Bt = C(""), Vt = C(null), Ht = C(0), j = C(null), Ut = C(null), Wt = C(null), Gt = C(null), Kt = C(null), qt = C(0), Jt = C(0), Yt = C(0), M = C(!0), N = C([]), Xt = C([]), Zt = C(!1), Qt = C(null), $t = C(null), en = C(!1), tn = C(!1), P = C(null), nn = C({
118
- x: 0,
119
- y: 0
120
- }), rn = C("pointer"), an = C(!1), F = C(!1);
121
- function on(e) {
122
- F.value = e, Ht.value += 1;
123
- }
124
- let I = C(mn());
125
- fe({
126
- config: () => I.value,
127
- dataset: () => k.dataset,
128
- component: "VueUiNestedDonuts",
129
- rules: [
130
- pe.emptyArray,
131
- {
132
- test: (e) => e.some((e) => e.series.length > 6),
133
- message: [
134
- "👀 Some series have > 6 data points. Consider:",
135
- "",
136
- "▶️ Grouping small values dynamically into a single \"Other\" data point.",
137
- "",
138
- "▶️ Using filters to let users choose a maximum number of data points to display.",
139
- "",
140
- "▶️ Using VueUiHorizontalBar instead to make the dataset breakdown easier to read."
141
- ]
142
- },
143
- {
144
- test: (e) => e.length === 1,
145
- message: [
146
- "👀 There is only one series in your dataset. Consider:",
147
- "",
148
- "▶️ Using VueUiDonut instead."
149
- ]
150
- },
151
- {
152
- test: (e) => e.length > 6,
153
- message: [
154
- "👀 The number of series in your dataset > 6. Consider:",
155
- "",
156
- "▶️ Using filters to let users choose a maximum number of series to display",
157
- "",
158
- "▶️ Using VueUiHorizontalBar instead to make the dataset breakdown easier to read."
159
- ]
160
- }
161
- ]
162
- });
163
- let L = m(() => I.value.userOptions.useCursorPointer), sn = {
164
- name: "",
165
- series: [
166
- {
167
- name: "",
168
- values: [3],
169
- color: "#BABABA"
170
- },
171
- {
172
- name: "",
173
- values: [2],
174
- color: "#AAAAAA"
175
- },
176
- {
177
- name: "",
178
- values: [1],
179
- color: "#CACACA"
180
- }
181
- ]
182
- }, cn = m(() => a({
183
- defaultConfig: {
184
- useCssAnimation: !1,
185
- table: { show: !1 },
186
- startAnimation: { show: !1 },
187
- userOptions: { show: !1 },
188
- style: { chart: {
189
- backgroundColor: "#99999930",
190
- layout: { labels: { dataLabels: { show: !1 } } },
191
- legend: {
192
- backgroundColor: "transparent",
193
- showValue: !1,
194
- showPercentage: !1
195
- },
196
- title: {
197
- color: "#1A1A1A",
198
- subtitle: { color: "#5A5A5A" }
199
- }
200
- } }
201
- },
202
- userConfig: I.value.skeletonConfig ?? {}
203
- })), { loading: ln, FINAL_DATASET: R, manualLoading: un } = ge({
204
- ...Ke(k),
205
- FINAL_CONFIG: I,
206
- prepareConfig: mn,
207
- callback: () => {
208
- Promise.resolve().then(async () => {
209
- await _n();
210
- });
211
- },
212
- skeletonDataset: k.config?.skeletonDataset ?? [sn, sn],
213
- skeletonConfig: a({
214
- defaultConfig: I.value,
215
- userConfig: cn.value
216
- })
217
- }), { userOptionsVisible: dn, setUserOptionsVisibility: fn, keepUserOptionState: pn } = ke({ config: I.value }), { svgRef: z } = Ae({ config: I.value.style.chart.title });
218
- function mn() {
219
- let e = ye({
220
- userConfig: k.config,
221
- defaultConfig: Ft
222
- }), t = {}, n = e.theme;
223
- if (n) if (!It.value(e)) Lt(e), t = e;
224
- else {
225
- let r = ye({
226
- userConfig: Ne[n] || k.config,
227
- defaultConfig: e
228
- });
229
- t = {
230
- ...ye({
231
- userConfig: k.config,
232
- defaultConfig: r
233
- }),
234
- customPalette: e.customPalette.length ? e.customPalette : o[n] || s
235
- };
236
- }
237
- else t = e;
238
- return t;
239
- }
240
- Je(() => k.config, (e) => {
241
- ln.value || (I.value = mn()), dn.value = !I.value.userOptions.showOnChartHover, bn(), qt.value += 1, Jt.value += 1, Yt.value += 1, V.value.dataLabels.show = I.value.style.chart.layout.labels.dataLabels.show, V.value.showTable = I.value.table.show, V.value.showTooltip = I.value.style.chart.tooltip.show, H.value.width = I.value.style.chart.width, H.value.height = I.value.style.chart.height;
242
- }, { deep: !0 });
243
- let hn = m(() => {
244
- let { top: e, right: t, bottom: n, left: r } = I.value.style.chart.padding;
245
- return {
246
- css: `padding:${e}px ${t}px ${n}px ${r}px`,
247
- top: e,
248
- right: t,
249
- bottom: n,
250
- left: r
251
- };
252
- });
253
- function gn(e, t = 1e3, n = 50) {
254
- return new Promise((r) => {
255
- let i = e.length;
256
- N.value = Array(i).fill(0), Xt.value = [];
257
- let a = 0;
258
- e.forEach((e, o) => {
259
- setTimeout(() => {
260
- let n = performance.now();
261
- function s(l) {
262
- let u = Math.min((l - n) / t, 1), te = e * ne(u);
263
- N.value[o] = te, N.value = [...N.value];
264
- let re = [], d = 0;
265
- k.dataset.forEach((e, t) => {
266
- let n = ee(e.series.reduce((e, t) => e + ee(c(t.values).reduce((e, t) => e + t, 0)), 0)) - ee(N.value.slice(d, d + e.series.length).reduce((e, t) => e + t, 0));
267
- n > Number.MIN_VALUE && re.push({
268
- name: "__ghost__",
269
- arcOf: e.name,
270
- arcOfId: `${A.value}_${t}`,
271
- id: `ghost_${A.value}_${t}`,
272
- seriesIndex: -1,
273
- datasetIndex: t,
274
- color: "transparent",
275
- value: n,
276
- fullValue: n,
277
- absoluteValues: [],
278
- ghost: !0
279
- }), d += e.series.length;
280
- }), Xt.value = re, u < 1 ? requestAnimationFrame(s) : (a += 1, a === i && r());
281
- }
282
- requestAnimationFrame(s);
283
- }, o * n);
284
- });
285
- });
286
- }
287
- async function _n() {
288
- if (I.value.startAnimation?.show) {
289
- let e = R.value.flatMap((e) => e.series).map((e) => c(e.values).reduce((e, t) => e + t, 0));
290
- N.value = e.map(() => 0), M.value = !0, Xt.value = R.value.map((e, t) => {
291
- let n = e.series.reduce((e, t) => e + c(t.values).reduce((e, t) => e + t, 0), 0);
292
- return {
293
- name: "__ghost__",
294
- arcOf: e.name,
295
- arcOfId: `${A.value}_${t}`,
296
- id: `ghost_${A.value}_${t}`,
297
- seriesIndex: -1,
298
- datasetIndex: t,
299
- color: "transparent",
300
- value: n,
301
- fullValue: n,
302
- absoluteValues: [],
303
- ghost: !0
304
- };
305
- }), await ze(), gn(e, I.value.startAnimation.durationMs, I.value.startAnimation.staggerMs).then(() => {
306
- M.value = !1, Xt.value = [];
307
- });
308
- } else M.value = !1;
309
- }
310
- Ue(async () => {
311
- Zt.value = !0, bn(), await _n();
312
- });
313
- let B = Ge(null), vn = Ge(null), yn = m(() => !!I.value.debug);
314
- function bn() {
315
- if (ie(k.dataset) ? (f({
316
- componentName: "VueUiNestedDonuts",
317
- type: "dataset",
318
- debug: yn.value
319
- }), Rt.value = !1, un.value = !0) : un.value = I.value.loading, I.value.responsive) {
320
- let e = we(() => {
321
- let { width: e, height: t } = Te({
322
- chart: j.value,
323
- title: I.value.style.chart.title.text ? Ut.value : null,
324
- legend: I.value.style.chart.legend.show ? Wt.value : null,
325
- source: Gt.value,
326
- noTitle: Kt.value,
327
- padding: hn.value
328
- });
329
- requestAnimationFrame(() => {
330
- H.value.width = e, H.value.height = t;
331
- });
332
- });
333
- B.value && (vn.value && B.value.unobserve(vn.value), B.value.disconnect()), B.value = new ResizeObserver(e), vn.value = j.value.parentNode, B.value.observe(vn.value);
334
- }
335
- }
336
- He(() => {
337
- B.value && (vn.value && B.value.unobserve(vn.value), B.value.disconnect());
338
- });
339
- let { isPrinting: xn, isImaging: Sn, generatePdf: Cn, generateImage: wn } = he({
340
- elementId: `nested_donuts_${A.value}`,
341
- fileName: I.value.style.chart.title.text || "vue-ui-nested-donuts",
342
- options: I.value.userOptions.print
343
- }), Tn = m(() => I.value.userOptions.show && !I.value.style.chart.title.text), En = m(() => ue(I.value.customPalette)), V = C({
344
- dataLabels: { show: I.value.style.chart.layout.labels.dataLabels.show },
345
- showTable: I.value.table.show,
346
- showTooltip: I.value.style.chart.tooltip.show
347
- });
348
- Je(I, () => {
349
- V.value = {
350
- dataLabels: { show: I.value.style.chart.layout.labels.dataLabels.show },
351
- showTable: I.value.table.show,
352
- showTooltip: I.value.style.chart.tooltip.show
353
- };
354
- }, { immediate: !0 });
355
- let H = C({
356
- width: I.value.style.chart.width,
357
- height: I.value.style.chart.height
358
- }), U = Xe;
359
- function Dn({ datapoint: e, index: t, seriesIndex: n }) {
360
- I.value.events.datapointClick && I.value.events.datapointClick({
361
- datapoint: e,
362
- seriesIndex: n
363
- }), U("selectDatapoint", {
364
- datapoint: e,
365
- index: t
366
- });
367
- }
368
- function On({ from: e, to: t, duration: n, onUpdate: r, onDone: i, easing: a = ne }) {
369
- let o = performance.now();
370
- function s(c) {
371
- let l = Math.min((c - o) / n, 1), u = a(l);
372
- r(e + (t - e) * u, l), l < 1 ? requestAnimationFrame(s) : (r(t, 1), i && i());
373
- }
374
- requestAnimationFrame(s);
375
- }
376
- let W = C([]), G = m(() => {
377
- ln.value, R.value.forEach((e, t) => {
378
- [null, void 0].includes(e.name) && f({
379
- componentName: "VueUiNestedDonuts",
380
- type: "datasetSerieAttribute",
381
- property: "name",
382
- index: t,
383
- debug: yn.value
384
- }), [null, void 0].includes(e.series) ? f({
385
- componentName: "VueUiNestedDonuts",
386
- type: "datasetSerieAttribute",
387
- property: "series",
388
- index: t,
389
- debug: yn.value
390
- }) : e.series.length === 0 ? f({
391
- componentName: "VueUiNestedDonuts",
392
- type: "datasetAttributeEmpty",
393
- property: `series at index ${t}`,
394
- debug: yn.value
395
- }) : e.series.forEach((e, t) => {
396
- [null, void 0].includes(e.name) && f({
397
- componentName: "VueUiNestedDonuts",
398
- type: "datasetSerieAttribute",
399
- property: "name",
400
- index: t,
401
- key: "serie",
402
- debug: yn.value
403
- }), [null, void 0].includes(e.values) && f({
404
- componentName: "VueUiNestedDonuts",
405
- type: "datasetSerieAttribute",
406
- property: "values",
407
- index: t,
408
- key: "serie",
409
- debug: yn.value
410
- });
411
- });
412
- });
413
- let e = 0;
414
- return R.value.map((t, n) => ({
415
- ...t,
416
- total: t.series.filter((e) => !W.value.includes(e.id)).map((e) => c(e.values).reduce((e, t) => e + t, 0)).reduce((e, t) => e + t, 0),
417
- datasetIndex: n,
418
- id: `${A.value}_${n}`,
419
- series: t.series.map((r, i) => {
420
- let a = c(r.values).reduce((e, t) => e + t, 0);
421
- return {
422
- name: r.name,
423
- arcOf: t.name,
424
- arcOfId: `${A.value}_${n}`,
425
- id: `${A.value}_${n}_${i}`,
426
- seriesIndex: i,
427
- datasetIndex: n,
428
- color: l(r.color) || En.value[i] || s[i % s.length],
429
- value: M.value ? N.value[e++] ?? 0 : a,
430
- absoluteValues: r.values || []
431
- };
432
- })
433
- }));
434
- });
435
- Je(() => k.dataset, (e) => {
436
- Array.isArray(e) && e.length > 0 && (un.value = !1);
437
- }, { immediate: !0 });
438
- let K = m(() => Math.min(H.value.height, H.value.width) * (I.value.style.chart.layout.donut.strokeWidth / 512)), q = m(() => [...G.value].map((e, t) => {
439
- let n = e.series.filter((e) => !W.value.includes(e.id)).map((e) => e.value).reduce((e, t) => e + t, 0);
440
- return {
441
- ...e,
442
- total: n,
443
- series: e.series.filter((e) => !W.value.includes(e.id)).map((e) => ({
444
- ...e,
445
- proportion: e.value / n
446
- }))
447
- };
448
- }));
449
- function kn(e, t, n) {
450
- let r = 0;
451
- for (let t = 0; t < e.length; t += 1) n.includes(e[t]) && (r += 1);
452
- return r < t;
453
- }
454
- let J = C(q.value);
455
- Je(() => q.value, (e) => J.value = e);
456
- function An(e) {
457
- let t = e.map((e) => e.id);
458
- if (e.some((e) => W.value.includes(e.id))) {
459
- let e = new Set(t);
460
- W.value = W.value.filter((t) => !e.has(t));
461
- } else W.value.push(...t);
462
- U("selectLegend", q.value);
463
- }
464
- function Y(e) {
465
- let t = k.dataset.flatMap((e, t) => e.series.map((e, n) => ({
466
- value: c(e.values).reduce((e, t) => e + t, 0),
467
- id: `${A.value}_${t}_${n}`,
468
- arcOfId: `${A.value}_${t}`
469
- }))).find((t) => t.id === e.id);
470
- if (!t) return;
471
- let n = G.value.flatMap((e) => e.series).find((t) => t.id === e.id)?.value ?? 0, r = J.value.flatMap((e) => e.series).find((t) => t.id === e.id), i = r ? r.value : 0, a = G.value.find((e) => e.id === t.arcOfId);
472
- if (!a) return;
473
- let o = a.series.map((e) => e.id), s = kn(o, o.length - 1, W.value);
474
- W.value.includes(e.id) ? (W.value = W.value.filter((t) => t !== e.id), I.value.serieToggleAnimation.show ? On({
475
- from: i,
476
- to: n,
477
- duration: I.value.serieToggleAnimation.durationMs,
478
- onUpdate: (t) => {
479
- J.value = J.value.map((n) => ({
480
- ...n,
481
- series: n.series.map((n) => n.id === e.id ? {
482
- ...n,
483
- value: t
484
- } : n)
485
- }));
486
- },
487
- onDone: () => {
488
- U("selectLegend", q.value);
489
- }
490
- }) : (J.value = J.value.map((t) => ({
491
- ...t,
492
- series: t.series.map((t) => t.id === e.id ? {
493
- ...t,
494
- value: n
495
- } : t)
496
- })), U("selectLegend", q.value))) : s && (I.value.serieToggleAnimation.show ? On({
497
- from: i,
498
- to: 0,
499
- duration: I.value.serieToggleAnimation.durationMs,
500
- onUpdate: (t) => {
501
- J.value = J.value.map((n) => ({
502
- ...n,
503
- series: n.series.map((n) => n.id === e.id ? {
504
- ...n,
505
- value: t
506
- } : n)
507
- }));
508
- },
509
- onDone: () => {
510
- W.value.push(e.id), U("selectLegend", q.value);
511
- }
512
- }) : (J.value = J.value.map((t) => ({
513
- ...t,
514
- series: t.series.map((t) => t.id === e.id ? {
515
- ...t,
516
- value: 0
517
- } : t)
518
- })), W.value.push(e.id), U("selectLegend", q.value)));
519
- }
520
- function jn(e) {
521
- return G.value.length ? G.value.flatMap((e) => e.series).filter((t) => t.name === e) || (I.value.debug && console.warn(`VueUiNestedDonuts - Series name not found "${e}"`), null) : (I.value.debug && console.warn("VueUiNestedDonuts - There are no series to show."), null);
522
- }
523
- function Mn(e) {
524
- let t = jn(e);
525
- t !== null && (Array.isArray(t) ? t.forEach((e) => {
526
- W.value.includes(e.id) && Y({ id: e.id });
527
- }) : W.value.includes(t.id) && Y({ id: t.id }));
528
- }
529
- function Nn(e) {
530
- let t = jn(e);
531
- t !== null && (Array.isArray(t) ? t.forEach((e) => {
532
- W.value.includes(e.id) || Y({ id: e.id });
533
- }) : W.value.includes(t.id) || Y({ id: t.id }));
534
- }
535
- let Pn = m(() => K.value / G.value.length * I.value.style.chart.layout.donut.spacingRatio), Fn = m(() => J.value.map((e, t) => K.value - t * K.value / G.value.length)), X = m(() => J.value.map((e, t) => {
536
- let n = Math.abs(e.series.map((e) => e.value).reduce((e, t) => e + t, 0)) > 0, r = K.value - t * K.value / J.value.length, i = M.value ? Xt.value.find((e) => e.datasetIndex === t) : null, a = [...e.series, ...i ? [i] : []].map((e) => ({
537
- ...e,
538
- value: e.value < 1e-11 ? Number.MIN_VALUE : e.value
539
- })), o = ae({ series: [{
540
- name: "_",
541
- color: I.value.style.chart.layout.donut.emptyFill,
542
- value: 1
543
- }] }, H.value.width / 2, H.value.height / 2, r, r, 1.99999, 2, 1, 360, 105.25, Pn.value), s = `M ${H.value.width / 2},${H.value.height / 2 + r}
544
- a ${r},${r} 0 1,1 0,${-2 * r}
545
- a ${r},${r} 0 1,1 0,${2 * r}`;
546
- return {
547
- ...e,
548
- hasData: n,
549
- radius: r,
550
- skeleton: o,
551
- fullCirclePath: s,
552
- donut: ae({ series: a }, H.value.width / 2, H.value.height / 2, r, r, 1.99999, 2, 1, 360, 105.25, Pn.value)
553
- };
554
- })), In = m(() => [...G.value].map((e, t) => {
555
- let n = t * K.value / G.value.length;
556
- return {
557
- sizeRatio: n,
558
- donut: ae({ series: [{ value: 1 }] }, H.value.width / 2, H.value.height / 2, K.value - n, K.value - n, 1.99999, 2, 1, 360, 105.25, K.value / G.value.length * I.value.style.chart.layout.donut.spacingRatio)[0]
559
- };
560
- })), Ln = C(null), Rn = C(null), Z = C(null), zn = C(null);
561
- function Bn({ datapoint: e, seriesIndex: t }) {
562
- I.value.events.datapointLeave && I.value.events.datapointLeave({
563
- datapoint: e,
564
- seriesIndex: t
565
- }), zt.value = !1, Ln.value = null, Vt.value = null, Rn.value = null, Z.value = null, P.value = null, rn.value = "pointer";
566
- }
567
- function Vn({ val: e, percentage: t, showVal: n, showPercentage: r, config: i }) {
568
- return je({
569
- config: i,
570
- val: e,
571
- percentage: t,
572
- showVal: n,
573
- showPercentage: r
574
- });
575
- }
576
- function Hn({ datapoint: e, _relativeIndex: t, seriesIndex: n, triggerMode: r = "pointer" }) {
577
- I.value.events.datapointEnter && I.value.events.datapointEnter({
578
- datapoint: e,
579
- seriesIndex: n
580
- }), rn.value = r, P.value = n, Ln.value = e.arcOfId, Rn.value = e.id, Z.value = n, Vt.value = e.id, zn.value = {
581
- datapoint: e,
582
- seriesIndex: n,
583
- series: J.value,
584
- config: I.value
585
- };
586
- let i = I.value.style.chart.tooltip.customFormat;
587
- if (de(i) && te(() => i({
588
- seriesIndex: n,
589
- datapoint: e,
590
- series: J.value,
591
- config: I.value
592
- }))) Bt.value = i({
593
- seriesIndex: n,
594
- datapoint: e,
595
- series: J.value,
596
- config: I.value
597
- });
598
- else {
599
- let t = "";
600
- if (I.value.style.chart.tooltip.showAllItemsAtIndex && W.value.length === 0) {
601
- let r = J.value.map((e) => e.series.find((e) => e.seriesIndex === n));
602
- r.forEach((i, a) => {
603
- if (!i) return "";
604
- t += `
605
- <div style="display:flex; flex-direction: column; justify-content:flex-start; align-items:flex-start;padding:6px 0; ${a < r.length - 1 ? `border-bottom:1px solid ${I.value.style.chart.tooltip.borderColor}` : ""}">
606
- <div style="display:flex; flex-direction: row; gap: 3px; justify-content:flex-start; align-items:center;">
607
- <svg viewBox="0 0 20 20" height="${I.value.style.chart.tooltip.fontSize}" width="${I.value.style.chart.tooltip.fontSize}">
608
- <circle cx="10" cy="10" r="10" fill="${i.color}"/>
609
- </svg>
610
- <span>
611
- ${i.arcOf ?? ""} - ${i.name}
612
- </span>
613
- </div>
614
- <span>
615
- <b>
616
- ${Vn({
617
- config: I.value.style.chart.tooltip,
618
- showVal: I.value.style.chart.tooltip.showValue,
619
- showPercentage: I.value.style.chart.tooltip.showPercentage,
620
- val: d(I.value.style.chart.layout.labels.dataLabels.formatter, e.value, u({
621
- p: I.value.style.chart.layout.labels.dataLabels.prefix,
622
- v: e.value,
623
- s: I.value.style.chart.layout.labels.dataLabels.suffix,
624
- r: I.value.style.chart.tooltip.roundingValue
625
- }), {
626
- datapoint: e,
627
- seriesIndex: n
628
- }),
629
- percentage: u({
630
- v: i.proportion * 100,
631
- s: "%",
632
- r: I.value.style.chart.tooltip.roundingPercentage
633
- })
634
- })}
635
- </b>
636
- </span>
637
- </div>
638
- `;
639
- });
640
- } else t += `<div style="width:100%;text-align:center;border-bottom:1px solid ${I.value.style.chart.tooltip.borderColor};padding-bottom:6px;margin-bottom:3px;">${e.arcOf ?? ""} - ${e.name}</div>`, t += `<div style="display:flex;flex-direction:row;gap:6px;align-items:center;"><svg viewBox="0 0 12 12" height="14" width="14"><circle cx="6" cy="6" r="6" stroke="none" fill="${e.color}"/></svg>`, I.value.style.chart.tooltip.showValue && (t += `<b>${d(I.value.style.chart.layout.labels.dataLabels.formatter, e.value, u({
641
- p: I.value.style.chart.layout.labels.dataLabels.prefix,
642
- v: e.value,
643
- s: I.value.style.chart.layout.labels.dataLabels.suffix,
644
- r: I.value.style.chart.tooltip.roundingValue
645
- }), {
646
- datapoint: e,
647
- seriesIndex: n
648
- })}</b>`), I.value.style.chart.tooltip.showPercentage && (I.value.style.chart.tooltip.showValue ? t += `<span>(${u({
649
- v: e.proportion * 100,
650
- s: "%",
651
- r: I.value.style.chart.tooltip.roundingPercentage
652
- })})</span></div>` : t += `<b>${u({
653
- v: e.proportion * 100,
654
- s: "%",
655
- r: I.value.style.chart.tooltip.roundingPercentage
656
- })}</b></div>`);
657
- Bt.value = `<div style="font-size:${I.value.style.chart.tooltip.fontSize}px">${t}</div>`;
658
- }
659
- zt.value = !0;
660
- }
661
- function Un(e) {
662
- return e.proportion * 100 > I.value.style.chart.layout.labels.dataLabels.hideUnderValue;
663
- }
664
- function Wn(e, t) {
665
- if (!I.value.useBlurOnHover) return "";
666
- if (I.value.style.chart.tooltip.showAllItemsAtIndex && W.value.length === 0) return [null, void 0].includes(Z.value) || Z.value === t ? "" : `url(#blur_${A.value})`;
667
- if (!I.value.style.chart.tooltip.showAllItemsAtIndex || W.value.length) return [null, void 0].includes(Rn.value) || Rn.value === e.id ? "" : `url(#blur_${A.value})`;
668
- }
669
- let Gn = m(() => G.value.map((e, t) => {
670
- let n = e.series.filter((e) => !W.value.includes(e.id)), r = M.value ? n.map((e) => {
671
- let n = R.value[t].series.findIndex((t) => t.name === e.name);
672
- return c(R.value[t].series[n].values).reduce((e, t) => e + t, 0);
673
- }).reduce((e, t) => e + t, 0) : n.map((e) => e.value).reduce((e, t) => e + t, 0);
674
- return e.series.map((e, n) => {
675
- let i = c(R.value[t].series[n].values).reduce((e, t) => e + t, 0), a = M.value ? i : e.value, o = Vn({
676
- val: d(I.value.style.chart.layout.labels.dataLabels.formatter, a, u({
677
- p: I.value.style.chart.layout.labels.dataLabels.prefix,
678
- v: a,
679
- s: I.value.style.chart.layout.labels.dataLabels.suffix,
680
- r: I.value.style.chart.legend.roundingValue
681
- }), {
682
- datapoint: e,
683
- seriesIndex: n
684
- }),
685
- percentage: isNaN(a / r) || W.value.includes(e.id) ? "-" : u({
686
- v: a / r * 100,
687
- s: "%",
688
- r: I.value.style.chart.legend.roundingPercentage
689
- }),
690
- showVal: I.value.style.chart.legend.showValue,
691
- showPercentage: I.value.style.chart.legend.showPercentage,
692
- config: I.value.style.chart.legend
693
- }), s = `${e.name}${I.value.style.chart.legend.showPercentage || I.value.style.chart.legend.showValue ? ": " : ""}${o}`;
694
- return {
695
- name: e.name,
696
- color: e.color,
697
- value: a,
698
- display: s,
699
- svgDisplay: `${e.arcOf ? `${e.arcOf} - ` : ""}${s}`,
700
- shape: "circle",
701
- arcOf: e.arcOf,
702
- id: e.id,
703
- seriesIndex: n,
704
- datasetIndex: t,
705
- total: r,
706
- opacity: W.value.includes(e.id) ? .5 : 1,
707
- segregate: () => Y(e),
708
- isSegregated: W.value.includes(e.id)
709
- };
710
- });
711
- })), Kn = m(() => ({
712
- cy: "nested-donuts-legend",
713
- backgroundColor: I.value.style.chart.legend.backgroundColor,
714
- color: I.value.style.chart.legend.color,
715
- fontSize: I.value.style.chart.legend.fontSize,
716
- paddingBottom: 12,
717
- fontWeight: I.value.style.chart.legend.bold ? "bold" : ""
718
- })), Q = m(() => ({
719
- head: J.value.flatMap((e) => e.series.map((t) => ({
720
- name: `${e.name} - ${t.name}`,
721
- color: t.color,
722
- total: e.total
723
- }))),
724
- body: J.value.flatMap((e) => e.series.map((e) => e.value))
725
- }));
726
- function qn(e = null) {
727
- ze(() => {
728
- let n = Q.value.head.map((e, t) => [
729
- [e.name],
730
- [Q.value.body[t]],
731
- [isNaN(Q.value.body[t] / e.total) ? "-" : Q.value.body[t] / e.total * 100]
732
- ]), i = [
733
- [I.value.style.chart.title.text],
734
- [I.value.style.chart.title.subtitle.text],
735
- [
736
- [""],
737
- ["val"],
738
- ["%"]
739
- ]
740
- ].concat(n), a = r(i);
741
- e ? e(a) : t({
742
- csvContent: a,
743
- title: I.value.style.chart.title.text || "vue-ui-nested-donuts"
744
- });
745
- });
746
- }
747
- let Jn = m(() => {
748
- let e = [
749
- I.value.table.columnNames.series,
750
- I.value.table.columnNames.value,
751
- I.value.table.columnNames.percentage
752
- ], t = Q.value.head.map((e, t) => {
753
- let n = u({
754
- p: I.value.style.chart.layout.labels.dataLabels.prefix,
755
- v: Q.value.body[t],
756
- s: I.value.style.chart.layout.labels.dataLabels.suffix,
757
- r: I.value.table.td.roundingValue
758
- });
759
- return [
760
- {
761
- color: e.color,
762
- name: e.name
763
- },
764
- n,
765
- isNaN(Q.value.body[t] / e.total) ? "-" : u({
766
- v: Q.value.body[t] / e.total * 100,
767
- s: "%",
768
- r: I.value.table.td.roundingPercentage
769
- })
770
- ];
771
- }), n = t.map((e) => e.map((e, t) => t === 0 ? e.name : e)), r = {
772
- th: {
773
- backgroundColor: I.value.table.th.backgroundColor,
774
- color: I.value.table.th.color,
775
- outline: I.value.table.th.outline
776
- },
777
- td: {
778
- backgroundColor: I.value.table.td.backgroundColor,
779
- color: I.value.table.td.color,
780
- outline: I.value.table.td.outline
781
- },
782
- breakpoint: I.value.table.responsiveBreakpoint
783
- };
784
- return {
785
- colNames: [
786
- I.value.table.columnNames.series,
787
- I.value.table.columnNames.value,
788
- I.value.table.columnNames.percentage
789
- ],
790
- head: e,
791
- body: t,
792
- a11yBody: n,
793
- config: r
794
- };
795
- });
796
- function Yn() {
797
- return G.value;
798
- }
799
- function Xn() {
800
- V.value.showTable = !V.value.showTable;
801
- }
802
- function Zn() {
803
- V.value.dataLabels.show = !V.value.dataLabels.show;
804
- }
805
- function Qn() {
806
- V.value.showTooltip = !V.value.showTooltip;
807
- }
808
- let $n = C(!1);
809
- function er() {
810
- $n.value = !$n.value;
811
- }
812
- async function tr({ scale: e = 2 } = {}) {
813
- if (!j.value) return;
814
- let { width: t, height: n } = j.value.getBoundingClientRect(), r = t / n, { imageUri: i, base64: a } = await xe({
815
- domElement: j.value,
816
- base64: !0,
817
- img: !0,
818
- scale: e
819
- });
820
- return {
821
- imageUri: i,
822
- base64: a,
823
- title: I.value.style.chart.title.text,
824
- width: t,
825
- height: n,
826
- aspectRatio: r
827
- };
828
- }
829
- let nr = C(null);
830
- function rr() {
831
- if (!nr.value) return;
832
- let { x: e, y: t, width: n, height: r } = nr.value.getBBox();
833
- z.value && z.value.setAttribute("viewBox", `${e} ${t} ${n + Math.min(0, e)} ${r + Math.min(0, t)}`);
834
- }
835
- let ir = m(() => {
836
- let e = I.value.table.useDialog && !I.value.table.show, t = V.value.showTable;
837
- return {
838
- component: e ? Pt : kt,
839
- title: `${I.value.style.chart.title.text}${I.value.style.chart.title.subtitle.text ? `: ${I.value.style.chart.title.subtitle.text}` : ""}`,
840
- props: e ? {
841
- backgroundColor: I.value.table.th.backgroundColor,
842
- color: I.value.table.th.color,
843
- headerColor: I.value.table.th.color,
844
- headerBg: I.value.table.th.backgroundColor,
845
- isFullscreen: F.value,
846
- fullscreenParent: j.value,
847
- forcedWidth: Math.min(800, window.innerWidth * .8),
848
- isCursorPointer: L.value
849
- } : {
850
- hideDetails: !0,
851
- config: {
852
- open: t,
853
- maxHeight: 1e4,
854
- body: {
855
- backgroundColor: I.value.style.chart.backgroundColor,
856
- color: I.value.style.chart.color
857
- },
858
- head: {
859
- backgroundColor: I.value.style.chart.backgroundColor,
860
- color: I.value.style.chart.color
861
- }
862
- }
863
- }
864
- };
865
- });
866
- Je(() => V.value.showTable, (e) => {
867
- I.value.table.show || (e && I.value.table.useDialog && Qt.value ? Qt.value.open() : "close" in Qt.value && Qt.value.close());
868
- });
869
- function ar() {
870
- V.value.showTable = !1, $t.value && $t.value.setTableIconState(!1);
871
- }
872
- let or = m(() => I.value.style.chart.backgroundColor), sr = m(() => I.value.style.chart.legend), cr = m(() => I.value.style.chart.title), lr = m(() => Gn.value.flat().map((e) => ({
873
- ...e,
874
- name: e.svgDisplay
875
- }))), { exportSvg: ur, getSvg: dr } = ve({
876
- svg: z,
877
- title: cr,
878
- legend: sr,
879
- legendItems: lr,
880
- backgroundColor: or
881
- });
882
- async function fr({ isCb: e }) {
883
- tn.value = !0, await ze();
884
- try {
885
- if (e) {
886
- let { blob: e, url: t, text: n, dataUrl: r } = await dr();
887
- await Promise.resolve(I.value.userOptions.callbacks.svg({
888
- blob: e,
889
- url: t,
890
- text: n,
891
- dataUrl: r
892
- }));
893
- } else await Promise.resolve(ur());
894
- } finally {
895
- tn.value = !1;
896
- }
897
- }
898
- function pr(e) {
899
- if (e?.stage === "start") {
900
- en.value = !0;
901
- return;
902
- }
903
- if (e?.stage === "end") {
904
- en.value = !1;
905
- return;
906
- }
907
- wn();
908
- }
909
- async function mr() {
910
- if (U("copyAlt", {
911
- config: I.value,
912
- dataset: J.value
913
- }), !I.value.userOptions.callbacks.altCopy) {
914
- console.warn("Vue Data UI - A callback must be set for `altCopy` in userOptions.");
915
- return;
916
- }
917
- await Promise.resolve(I.value.userOptions.callbacks.altCopy({
918
- config: I.value,
919
- dataset: J.value
920
- }));
921
- }
922
- let $ = m(() => X.value.flatMap((e) => e.donut.filter((e) => !e.ghost)));
923
- function hr() {
924
- P.value = null, an.value = !0;
925
- }
926
- function gr() {
927
- P.value = null, rn.value = "pointer", zt.value = !1, Ln.value = null, Vt.value = null, Rn.value = null, Z.value = null, an.value = !1;
928
- }
929
- function _r(e) {
930
- if (!z.value || $n.value || document.activeElement !== z.value || !$.value.length) return;
931
- let t = ["ArrowLeft", "ArrowUp"].includes(e.key), n = ["ArrowRight", "ArrowDown"].includes(e.key), r = e.key === "Enter" || e.key === " ", i = e.key === "Escape";
932
- if (!t && !n && !r && !i) return;
933
- if (e.preventDefault(), e.stopPropagation(), i) {
934
- P.value = null, rn.value = "pointer", zt.value = !1, Ln.value = null, Vt.value = null, Rn.value = null, Z.value = null;
935
- return;
936
- }
937
- if (r) {
938
- if (P.value === null) return;
939
- let e = $.value[P.value];
940
- if (!e) return;
941
- Dn({
942
- datapoint: e,
943
- index: P.value,
944
- seriesIndex: e.seriesIndex
945
- });
946
- return;
947
- }
948
- let a = P.value, o = Z.value, s = a !== null && a >= 0 && a < $.value.length, c = o !== null && o >= 0 && o < $.value.length;
949
- s ? n ? (a += 1, a >= $.value.length && (a = 0)) : t && (--a, a < 0 && (a = $.value.length - 1)) : c ? (a = n ? o + 1 : o - 1, a >= $.value.length && (a = 0), a < 0 && (a = $.value.length - 1)) : a = n ? 0 : $.value.length - 1;
950
- let l = $.value[a];
951
- l && (P.value = a, vr(), Hn({
952
- datapoint: l,
953
- relativeIndex: a,
954
- seriesIndex: l.seriesIndex,
955
- show: !0,
956
- triggerMode: "keyboard"
957
- }));
958
- }
959
- function vr() {
960
- if (!z.value) return;
961
- let e = z.value.getBoundingClientRect();
962
- nn.value = {
963
- x: e.left + e.width / 2,
964
- y: e.top + e.height / 2
965
- };
966
- }
967
- let yr = m(() => ({
968
- headers: Jn.value?.colNames ?? [],
969
- rows: Jn.value?.a11yBody ?? []
970
- }));
971
- return Ce({
972
- autoSize: rr,
973
- getData: Yn,
974
- getImage: tr,
975
- generatePdf: Cn,
976
- generateCsv: qn,
977
- generateImage: wn,
978
- generateSvg: fr,
979
- hideSeries: Nn,
980
- showSeries: Mn,
981
- toggleTable: Xn,
982
- toggleLabels: Zn,
983
- toggleTooltip: Qn,
984
- toggleAnnotator: er,
985
- toggleFullscreen: on,
986
- copyAlt: mr
987
- }), (e, t) => (S(), _("div", {
988
- ref_key: "nestedDonutsChart",
989
- ref: j,
990
- class: Be(`vue-data-ui-component vue-ui-nested-donuts ${F.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${I.value.useCssAnimation ? "" : "vue-ui-dna"}`),
991
- style: Ve(`font-family:${I.value.style.fontFamily};width:100%; text-align:center;background:${I.value.style.chart.backgroundColor}`),
992
- id: `nested_donuts_${A.value}`,
993
- onMouseenter: t[2] ||= () => D(fn)(!0),
994
- onMouseleave: t[3] ||= () => D(fn)(!1)
995
- }, [
996
- v("div", {
997
- id: `chart-instructions-${A.value}`,
998
- class: "sr-only"
999
- }, [v("p", null, E(I.value.a11y.translations.keyboardNavigation), 1)], 8, Qe),
1000
- yr.value?.rows?.length ? (S(), h(Oe, {
1001
- key: 0,
1002
- uid: A.value,
1003
- head: yr.value.headers,
1004
- body: yr.value.rows,
1005
- notice: I.value.a11y.translations.tableAvailable,
1006
- caption: I.value.a11y.translations.tableCaption
1007
- }, null, 8, [
1008
- "uid",
1009
- "head",
1010
- "body",
1011
- "notice",
1012
- "caption"
1013
- ])) : g("", !0),
1014
- I.value.userOptions.buttons.annotator ? (S(), h(D(Mt), {
1015
- key: 1,
1016
- svgRef: D(z),
1017
- backgroundColor: I.value.style.chart.backgroundColor,
1018
- color: I.value.style.chart.color,
1019
- active: $n.value,
1020
- isCursorPointer: L.value,
1021
- onClose: er
1022
- }, {
1023
- "annotator-action-close": O(() => [T(e.$slots, "annotator-action-close", {}, void 0, !0)]),
1024
- "annotator-action-color": O(({ color: t }) => [T(e.$slots, "annotator-action-color", x(b({ color: t })), void 0, !0)]),
1025
- "annotator-action-draw": O(({ mode: t }) => [T(e.$slots, "annotator-action-draw", x(b({ mode: t })), void 0, !0)]),
1026
- "annotator-action-undo": O(({ disabled: t }) => [T(e.$slots, "annotator-action-undo", x(b({ disabled: t })), void 0, !0)]),
1027
- "annotator-action-redo": O(({ disabled: t }) => [T(e.$slots, "annotator-action-redo", x(b({ disabled: t })), void 0, !0)]),
1028
- "annotator-action-delete": O(({ disabled: t }) => [T(e.$slots, "annotator-action-delete", x(b({ disabled: t })), void 0, !0)]),
1029
- _: 3
1030
- }, 8, [
1031
- "svgRef",
1032
- "backgroundColor",
1033
- "color",
1034
- "active",
1035
- "isCursorPointer"
1036
- ])) : g("", !0),
1037
- Tn.value ? (S(), _("div", {
1038
- key: 2,
1039
- ref_key: "noTitle",
1040
- ref: Kt,
1041
- class: "vue-data-ui-no-title-space",
1042
- style: "height:36px; width: 100%;background:transparent"
1043
- }, null, 512)) : g("", !0),
1044
- I.value.style.chart.title.text ? (S(), _("div", {
1045
- key: 3,
1046
- ref_key: "chartTitle",
1047
- ref: Ut
1048
- }, [(S(), h(Se, {
1049
- key: `title_${qt.value}`,
1050
- config: {
1051
- title: {
1052
- cy: "donut-div-title",
1053
- ...I.value.style.chart.title
1054
- },
1055
- subtitle: {
1056
- cy: "donut-div-subtitle",
1057
- ...I.value.style.chart.title.subtitle
1058
- }
1059
- }
1060
- }, null, 8, ["config"]))], 512)) : g("", !0),
1061
- v("div", { id: `legend-top-${A.value}` }, null, 8, $e),
1062
- I.value.userOptions.show && Rt.value && (D(pn) || D(dn)) ? (S(), h(D(jt), {
1063
- ref_key: "userOptionsRef",
1064
- ref: $t,
1065
- key: `user_option_${Ht.value}`,
1066
- backgroundColor: I.value.style.chart.backgroundColor,
1067
- color: I.value.style.chart.color,
1068
- isPrinting: D(xn),
1069
- isImaging: D(Sn),
1070
- uid: A.value,
1071
- hasTooltip: I.value.userOptions.buttons.tooltip && I.value.style.chart.tooltip.show,
1072
- hasPdf: I.value.userOptions.buttons.pdf,
1073
- hasXls: I.value.userOptions.buttons.csv,
1074
- hasImg: I.value.userOptions.buttons.img,
1075
- hasSvg: I.value.userOptions.buttons.svg,
1076
- hasTable: I.value.userOptions.buttons.table,
1077
- hasLabel: I.value.userOptions.buttons.labels,
1078
- hasFullscreen: I.value.userOptions.buttons.fullscreen,
1079
- hasAltCopy: I.value.userOptions.buttons.altCopy,
1080
- isFullscreen: F.value,
1081
- isTooltip: V.value.showTooltip,
1082
- titles: { ...I.value.userOptions.buttonTitles },
1083
- chartElement: j.value,
1084
- position: I.value.userOptions.position,
1085
- hasAnnotator: I.value.userOptions.buttons.annotator,
1086
- isAnnotation: $n.value,
1087
- callbacks: I.value.userOptions.callbacks,
1088
- printScale: I.value.userOptions.print.scale,
1089
- tableDialog: I.value.table.useDialog,
1090
- isCursorPointer: L.value,
1091
- onToggleFullscreen: on,
1092
- onGeneratePdf: D(Cn),
1093
- onGenerateCsv: qn,
1094
- onGenerateImage: pr,
1095
- onGenerateSvg: fr,
1096
- onToggleTable: Xn,
1097
- onToggleLabels: Zn,
1098
- onToggleTooltip: Qn,
1099
- onToggleAnnotator: er,
1100
- onCopyAlt: mr,
1101
- style: Ve({ visibility: D(pn) ? D(dn) ? "visible" : "hidden" : "visible" })
1102
- }, Fe({ _: 2 }, [
1103
- e.$slots.menuIcon ? {
1104
- name: "menuIcon",
1105
- fn: O(({ isOpen: t, color: n }) => [T(e.$slots, "menuIcon", x(b({
1106
- isOpen: t,
1107
- color: n
1108
- })), void 0, !0)]),
1109
- key: "0"
1110
- } : void 0,
1111
- e.$slots.optionTooltip ? {
1112
- name: "optionTooltip",
1113
- fn: O(() => [T(e.$slots, "optionTooltip", {}, void 0, !0)]),
1114
- key: "1"
1115
- } : void 0,
1116
- e.$slots.optionPdf ? {
1117
- name: "optionPdf",
1118
- fn: O(() => [T(e.$slots, "optionPdf", {}, void 0, !0)]),
1119
- key: "2"
1120
- } : void 0,
1121
- e.$slots.optionCsv ? {
1122
- name: "optionCsv",
1123
- fn: O(() => [T(e.$slots, "optionCsv", {}, void 0, !0)]),
1124
- key: "3"
1125
- } : void 0,
1126
- e.$slots.optionImg ? {
1127
- name: "optionImg",
1128
- fn: O(() => [T(e.$slots, "optionImg", {}, void 0, !0)]),
1129
- key: "4"
1130
- } : void 0,
1131
- e.$slots.optionSvg ? {
1132
- name: "optionSvg",
1133
- fn: O(() => [T(e.$slots, "optionSvg", {}, void 0, !0)]),
1134
- key: "5"
1135
- } : void 0,
1136
- e.$slots.optionTable ? {
1137
- name: "optionTable",
1138
- fn: O(() => [T(e.$slots, "optionTable", {}, void 0, !0)]),
1139
- key: "6"
1140
- } : void 0,
1141
- e.$slots.optionLabels ? {
1142
- name: "optionLabels",
1143
- fn: O(() => [T(e.$slots, "optionLabels", {}, void 0, !0)]),
1144
- key: "7"
1145
- } : void 0,
1146
- e.$slots.optionFullscreen ? {
1147
- name: "optionFullscreen",
1148
- fn: O(({ toggleFullscreen: t, isFullscreen: n }) => [T(e.$slots, "optionFullscreen", x(b({
1149
- toggleFullscreen: t,
1150
- isFullscreen: n
1151
- })), void 0, !0)]),
1152
- key: "8"
1153
- } : void 0,
1154
- e.$slots.optionAnnotator ? {
1155
- name: "optionAnnotator",
1156
- fn: O(({ toggleAnnotator: t, isAnnotator: n }) => [T(e.$slots, "optionAnnotator", x(b({
1157
- toggleAnnotator: t,
1158
- isAnnotator: n
1159
- })), void 0, !0)]),
1160
- key: "9"
1161
- } : void 0,
1162
- e.$slots.optionAltCopy ? {
1163
- name: "optionAltCopy",
1164
- fn: O(({ altCopy: t }) => [T(e.$slots, "optionAltCopy", x(b({ altCopy: t })), void 0, !0)]),
1165
- key: "10"
1166
- } : void 0,
1167
- e.$slots["custom-menu-before"] ? {
1168
- name: "custom-menu-before",
1169
- fn: O(() => [T(e.$slots, "custom-menu-before", {}, void 0, !0)]),
1170
- key: "11"
1171
- } : void 0,
1172
- e.$slots["custom-menu-after"] ? {
1173
- name: "custom-menu-after",
1174
- fn: O(() => [T(e.$slots, "custom-menu-after", {}, void 0, !0)]),
1175
- key: "12"
1176
- } : void 0
1177
- ]), 1032, /* @__PURE__ */ "backgroundColor.color.isPrinting.isImaging.uid.hasTooltip.hasPdf.hasXls.hasImg.hasSvg.hasTable.hasLabel.hasFullscreen.hasAltCopy.isFullscreen.isTooltip.titles.chartElement.position.hasAnnotator.isAnnotation.callbacks.printScale.tableDialog.isCursorPointer.onGeneratePdf.style".split("."))) : g("", !0),
1178
- v("div", et, [(S(), _("svg", {
1179
- ref_key: "svgRef",
1180
- ref: z,
1181
- xmlns: D(le),
1182
- "aria-describedby": `chart-instructions-${A.value}`,
1183
- class: Be({
1184
- "vue-data-ui-fullscreen--on": F.value,
1185
- "vue-data-ui-fulscreen--off": !F.value,
1186
- "vue-data-ui-svg": !0
1187
- }),
1188
- viewBox: `0 0 ${H.value.width <= 0 ? .001 : H.value.width} ${H.value.height < 0 ? .001 : H.value.height}`,
1189
- style: Ve(`max-width:100%; overflow: visible; background:transparent;color:${I.value.style.chart.color};${hn.value.css}`),
1190
- tabindex: "0",
1191
- onFocus: hr,
1192
- onBlur: gr,
1193
- onKeydown: _r
1194
- }, [v("g", {
1195
- ref_key: "G",
1196
- ref: nr,
1197
- class: "vue-data-ui-g"
1198
- }, [
1199
- Le(D(Nt)),
1200
- e.$slots["chart-background"] ? (S(), _("foreignObject", {
1201
- key: 0,
1202
- x: 0,
1203
- y: 0,
1204
- width: H.value.width <= 0 ? .001 : H.value.width,
1205
- height: H.value.height < 0 ? .001 : H.value.height,
1206
- style: { pointerEvents: "none" }
1207
- }, [T(e.$slots, "chart-background", {}, void 0, !0)], 8, nt)) : g("", !0),
1208
- v("defs", null, [(S(!0), _(p, null, w(In.value, (e, t) => (S(), h(Ee, {
1209
- t: "radial",
1210
- id: `radial_${A.value}_${t}`,
1211
- key: `radial_${A.value}_${t}`,
1212
- stops: [
1213
- [
1214
- "0%",
1215
- "#FFFFFF",
1216
- 0
1217
- ],
1218
- [
1219
- `${(1 - Pn.value / Fn.value[t]) * 100}%`,
1220
- D(n)("#FFFFFF", 0),
1221
- 0
1222
- ],
1223
- [
1224
- `${(1 - Pn.value / Fn.value[t] / 2) * 100}%`,
1225
- "#FFFFFF",
1226
- I.value.style.chart.gradientIntensity / 100
1227
- ],
1228
- [
1229
- "100%",
1230
- "#FFFFFF",
1231
- 0
1232
- ]
1233
- ]
1234
- }, null, 8, ["id", "stops"]))), 128))]),
1235
- v("defs", null, [v("filter", {
1236
- id: `blur_${A.value}`,
1237
- x: "-50%",
1238
- y: "-50%",
1239
- width: "200%",
1240
- height: "200%"
1241
- }, [v("feGaussianBlur", {
1242
- in: "SourceGraphic",
1243
- stdDeviation: 2,
1244
- id: `blur_std_${A.value}`
1245
- }, null, 8, it), t[4] ||= v("feColorMatrix", {
1246
- type: "saturate",
1247
- values: "0"
1248
- }, null, -1)], 8, rt), v("filter", {
1249
- id: `shadow_${A.value}`,
1250
- "color-interpolation-filters": "sRGB"
1251
- }, [v("feDropShadow", {
1252
- dx: "0",
1253
- dy: "0",
1254
- stdDeviation: "10",
1255
- "flood-opacity": "0.5",
1256
- "flood-color": I.value.style.chart.layout.donut.shadowColor
1257
- }, null, 8, ot)], 8, at)]),
1258
- v("defs", null, [(S(!0), _(p, null, w(X.value, (e, t) => (S(), _("path", {
1259
- key: `path-full-${t}`,
1260
- id: `path-full-${t}-${A.value}`,
1261
- d: e.fullCirclePath,
1262
- fill: "none"
1263
- }, null, 8, st))), 128))]),
1264
- (S(!0), _(p, null, w(X.value, (e, t) => (S(), _("g", null, [e.hasData ? (S(!0), _(p, { key: 0 }, w(e.donut.filter((e) => !e.ghost), (e, t) => (S(), _("g", null, [v("path", {
1265
- class: "vue-ui-donut-arc-path",
1266
- d: e.arcSlice,
1267
- fill: e.color,
1268
- stroke: I.value.style.chart.layout.donut.borderColorAuto ? I.value.style.chart.backgroundColor : I.value.style.chart.layout.donut.borderColor,
1269
- "stroke-width": I.value.style.chart.layout.donut.borderWidth,
1270
- filter: Wn(e, t)
1271
- }, null, 8, ct)]))), 256)) : (S(!0), _(p, { key: 1 }, w(e.skeleton, (e, t) => (S(), _("g", null, [v("path", {
1272
- class: "vue-ui-donut-arc-path",
1273
- d: e.arcSlice,
1274
- fill: e.color,
1275
- stroke: I.value.style.chart.layout.donut.borderColorAuto ? I.value.style.chart.backgroundColor : I.value.style.chart.layout.donut.borderColor,
1276
- "stroke-width": I.value.style.chart.layout.donut.borderWidth
1277
- }, null, 8, lt)]))), 256))]))), 256)),
1278
- I.value.style.chart.useGradient ? (S(), _("g", ut, [(S(!0), _(p, null, w(In.value, (e, t) => (S(), _("g", null, [v("path", {
1279
- d: e.donut.arcSlice,
1280
- fill: `url(#radial_${A.value}_${t})`,
1281
- stroke: "transparent",
1282
- "stroke-width": "0"
1283
- }, null, 8, dt)]))), 256))])) : g("", !0),
1284
- I.value.style.chart.layout.labels.dataLabels.showDonutName ? (S(), _("g", ft, [I.value.style.chart.layout.labels.dataLabels.curvedDonutName ? (S(!0), _(p, { key: 0 }, w(X.value, (e, t) => (S(), _("g", null, [(S(!0), _(p, null, w(e.donut, (n, r) => (S(), _("g", null, [r === 0 && H.value.width && H.value.height ? (S(), _("text", {
1285
- key: 0,
1286
- "text-anchor": "middle",
1287
- "font-size": I.value.style.chart.layout.labels.dataLabels.fontSize,
1288
- "font-weight": I.value.style.chart.layout.labels.dataLabels.boldDonutName ? "bold" : "normal",
1289
- fill: I.value.style.chart.layout.labels.dataLabels.color,
1290
- dy: I.value.style.chart.layout.labels.dataLabels.donutNameOffsetY
1291
- }, [v("textPath", {
1292
- href: `#path-full-${t}-${A.value}`,
1293
- startOffset: "50%",
1294
- "text-anchor": "middle",
1295
- method: "align",
1296
- spacing: "auto"
1297
- }, E(I.value.style.chart.layout.labels.dataLabels.donutNameAbbreviation ? D(oe)({
1298
- source: e.name,
1299
- length: I.value.style.chart.layout.labels.dataLabels.donutNameMaxAbbreviationSize
1300
- }) : e.name), 9, mt)], 8, pt)) : g("", !0)]))), 256))]))), 256)) : (S(!0), _(p, { key: 1 }, w(X.value, (e, t) => (S(), _("g", null, [(S(!0), _(p, null, w(e.donut, (t, n) => (S(), _("g", null, [n === 0 && H.value.width && H.value.height ? (S(), _("text", {
1301
- key: 0,
1302
- x: H.value.width / 2,
1303
- y: t.startY - I.value.style.chart.layout.labels.dataLabels.fontSize + I.value.style.chart.layout.labels.dataLabels.donutNameOffsetY,
1304
- "text-anchor": "middle",
1305
- "font-size": I.value.style.chart.layout.labels.dataLabels.fontSize,
1306
- "font-weight": I.value.style.chart.layout.labels.dataLabels.boldDonutName ? "bold" : "normal",
1307
- fill: I.value.style.chart.layout.labels.dataLabels.color
1308
- }, E(I.value.style.chart.layout.labels.dataLabels.donutNameAbbreviation ? D(oe)({
1309
- source: e.name,
1310
- length: I.value.style.chart.layout.labels.dataLabels.donutNameMaxAbbreviationSize
1311
- }) : e.name), 9, ht)) : g("", !0)]))), 256))]))), 256))])) : g("", !0),
1312
- I.value.style.chart.layout.labels.dataLabels.show ? (S(), _("g", gt, [(S(!0), _(p, null, w(X.value, (e, t) => (S(), _("g", null, [(S(!0), _(p, null, w(e.donut.filter((e) => !e.ghost), (e, n) => (S(), _("g", { filter: Wn(e, n) }, [Ye(v("text", {
1313
- opacity: +!!Un(e),
1314
- "text-anchor": D(re)(e, !0).anchor,
1315
- x: D(re)(e, !1, I.value.style.chart.layout.labels.dataLabels.offsetX).x || 0,
1316
- y: D(se)(e, I.value.style.chart.layout.labels.dataLabels.offsetY, I.value.style.chart.layout.labels.dataLabels.offsetY) + (I.value.style.chart.layout.labels.dataLabels.showValueFirst && I.value.style.chart.layout.labels.dataLabels.showValue ? I.value.style.chart.layout.labels.dataLabels.fontSize : 0),
1317
- fill: I.value.style.chart.layout.labels.dataLabels.useSerieColor ? e.color : I.value.style.chart.layout.labels.dataLabels.color,
1318
- "font-size": I.value.style.chart.layout.labels.dataLabels.fontSize,
1319
- "font-weight": I.value.style.chart.layout.labels.dataLabels.boldPercentage ? "bold" : "normal"
1320
- }, E(D(i)(D(u)({
1321
- v: e.proportion * 100,
1322
- s: "%",
1323
- r: I.value.style.chart.layout.labels.dataLabels.roundingPercentage
1324
- }), I.value.style.chart.layout.labels.dataLabels.usePercentageParens ? "(" : "", I.value.style.chart.layout.labels.dataLabels.usePercentageParens ? ")" : "")), 9, vt), [[qe, V.value.dataLabels.show && I.value.style.chart.layout.labels.dataLabels.showPercentage]]), Ye(v("text", {
1325
- opacity: +!!Un(e),
1326
- "text-anchor": D(re)(e, !0).anchor,
1327
- x: D(re)(e, !1, I.value.style.chart.layout.labels.dataLabels.offsetX).x || 0,
1328
- y: D(se)(e, I.value.style.chart.layout.labels.dataLabels.offsetY, I.value.style.chart.layout.labels.dataLabels.offsetY) + (I.value.style.chart.layout.labels.dataLabels.showValueFirst || !I.value.style.chart.layout.labels.dataLabels.showPercentage ? 0 : I.value.style.chart.layout.labels.dataLabels.fontSize),
1329
- fill: I.value.style.chart.layout.labels.dataLabels.useSerieColor ? e.color : I.value.style.chart.layout.labels.dataLabels.color,
1330
- "font-size": I.value.style.chart.layout.labels.dataLabels.fontSize,
1331
- "font-weight": I.value.style.chart.layout.labels.dataLabels.boldValue ? "bold" : "normal"
1332
- }, E(D(i)(D(d)(I.value.style.chart.layout.labels.dataLabels.formatter, e.value, D(u)({
1333
- p: I.value.style.chart.layout.labels.dataLabels.prefix,
1334
- v: e.value,
1335
- s: I.value.style.chart.layout.labels.dataLabels.suffix,
1336
- r: I.value.style.chart.layout.labels.dataLabels.roundingValue
1337
- }), {
1338
- datapoint: e,
1339
- seriesIndex: t,
1340
- datapointIndex: n
1341
- }), I.value.style.chart.layout.labels.dataLabels.useValueParens ? "(" : "", I.value.style.chart.layout.labels.dataLabels.useValueParens ? ")" : "")), 9, yt), [[qe, V.value.dataLabels.show && I.value.style.chart.layout.labels.dataLabels.showValue]])], 8, _t))), 256))]))), 256))])) : g("", !0),
1342
- (S(!0), _(p, null, w(X.value, (e, t) => (S(), _("g", null, [(S(!0), _(p, null, w(e.donut, (e, t) => (S(), _("g", null, [v("path", {
1343
- d: e.arcSlice,
1344
- fill: Vt.value === e.id ? I.value.style.chart.layout.donut.selectedColor : "transparent",
1345
- onMouseenter: (t) => Hn({
1346
- datapoint: e,
1347
- relativeIndex: $.value.findIndex((t) => t.id === e.id),
1348
- seriesIndex: e.seriesIndex
1349
- }),
1350
- onClick: (n) => Dn({
1351
- datapoint: e,
1352
- index: t,
1353
- seriesIndex: e.seriesIndex
1354
- }),
1355
- onMouseleave: (t) => Bn({
1356
- datapoint: e,
1357
- seriesIndex: e.seriesIndex
1358
- })
1359
- }, null, 40, bt)]))), 256))]))), 256)),
1360
- T(e.$slots, "svg", { svg: {
1361
- ...H.value,
1362
- isPrintingImg: D(xn) || D(Sn) || en.value,
1363
- isPrintingSvg: tn.value
1364
- } }, void 0, !0)
1365
- ], 512)], 46, tt)), e.$slots.hint ? (S(), _("div", xt, [T(e.$slots, "hint", x(b({
1366
- hint: I.value.a11y.translations.keyboardNavigation,
1367
- isVisible: an.value
1368
- })), void 0, !0)])) : g("", !0)]),
1369
- e.$slots.watermark ? (S(), _("div", St, [T(e.$slots, "watermark", x(b({ isPrinting: D(xn) || D(Sn) || en.value || tn.value })), void 0, !0)])) : g("", !0),
1370
- Le(D(Dt), {
1371
- teleportTo: I.value.style.chart.tooltip.teleportTo,
1372
- show: V.value.showTooltip && zt.value,
1373
- backgroundColor: I.value.style.chart.tooltip.backgroundColor,
1374
- color: I.value.style.chart.tooltip.color,
1375
- borderRadius: I.value.style.chart.tooltip.borderRadius,
1376
- borderColor: I.value.style.chart.tooltip.borderColor,
1377
- borderWidth: I.value.style.chart.tooltip.borderWidth,
1378
- fontSize: I.value.style.chart.tooltip.fontSize,
1379
- backgroundOpacity: I.value.style.chart.tooltip.backgroundOpacity,
1380
- position: I.value.style.chart.tooltip.position,
1381
- offsetX: I.value.style.chart.tooltip.offsetX,
1382
- offsetY: I.value.style.chart.tooltip.offsetY,
1383
- parent: j.value,
1384
- content: Bt.value,
1385
- isFullscreen: F.value,
1386
- isCustom: D(de)(I.value.style.chart.tooltip.customFormat),
1387
- smooth: I.value.style.chart.tooltip.smooth,
1388
- backdropFilter: I.value.style.chart.tooltip.backdropFilter,
1389
- smoothForce: I.value.style.chart.tooltip.smoothForce,
1390
- smoothSnapThreshold: I.value.style.chart.tooltip.smoothSnapThreshold,
1391
- isA11yMode: rn.value === "keyboard",
1392
- a11yPosition: nn.value
1393
- }, {
1394
- "tooltip-before": O(() => [T(e.$slots, "tooltip-before", x(b({ ...zn.value })), void 0, !0)]),
1395
- tooltip: O(() => [T(e.$slots, "tooltip", x(b({ ...zn.value })), void 0, !0)]),
1396
- "tooltip-after": O(() => [T(e.$slots, "tooltip-after", x(b({ ...zn.value })), void 0, !0)]),
1397
- _: 3
1398
- }, 8, [
1399
- "teleportTo",
1400
- "show",
1401
- "backgroundColor",
1402
- "color",
1403
- "borderRadius",
1404
- "borderColor",
1405
- "borderWidth",
1406
- "fontSize",
1407
- "backgroundOpacity",
1408
- "position",
1409
- "offsetX",
1410
- "offsetY",
1411
- "parent",
1412
- "content",
1413
- "isFullscreen",
1414
- "isCustom",
1415
- "smooth",
1416
- "backdropFilter",
1417
- "smoothForce",
1418
- "smoothSnapThreshold",
1419
- "isA11yMode",
1420
- "a11yPosition"
1421
- ]),
1422
- v("div", { id: `legend-bottom-${A.value}` }, null, 8, Ct),
1423
- Zt.value && (I.value.style.chart.legend.show || e.$slots.legend) ? (S(), h(Pe, {
1424
- key: 6,
1425
- to: I.value.style.chart.legend.position === "top" ? `#legend-top-${A.value}` : `#legend-bottom-${A.value}`
1426
- }, [I.value.style.chart.legend.show ? (S(), _("div", {
1427
- key: 0,
1428
- ref_key: "chartLegend",
1429
- ref: Wt,
1430
- class: Be({ "vue-ui-nested-donuts-legend": Gn.value.length > 1 })
1431
- }, [T(e.$slots, "legend", { legend: Gn.value }, () => [(S(!0), _(p, null, w(Gn.value, (e, n) => (S(), h(Me, {
1432
- key: `legend_${n}_${Yt.value}`,
1433
- legendSet: e,
1434
- config: Kn.value,
1435
- isCursorPointer: L.value,
1436
- onClickMarker: t[0] ||= ({ legend: e }) => Y(e)
1437
- }, {
1438
- legendTitle: O(({ titleSet: e }) => [e[0] && e[0].arcOf ? (S(), _("div", wt, E(e[0].arcOf), 1)) : g("", !0)]),
1439
- item: O(({ legend: e, index: t }) => [v("div", {
1440
- onClick: (t) => Y(e),
1441
- style: Ve(`opacity:${W.value.includes(e.id) ? .5 : 1}`)
1442
- }, E(e.display), 13, Tt)]),
1443
- legendToggle: O(() => [e.length > 2 && I.value.style.chart.legend.selectAllToggle.show && !D(ln) ? (S(), h(De, {
1444
- key: `toggle-${n}`,
1445
- backgroundColor: I.value.style.chart.legend.selectAllToggle.backgroundColor,
1446
- color: I.value.style.chart.legend.selectAllToggle.color,
1447
- fontSize: I.value.style.chart.legend.fontSize,
1448
- checked: e.some((e) => W.value.includes(e.id)),
1449
- isCursorPointer: L.value,
1450
- onToggle: (t) => An(e)
1451
- }, null, 8, [
1452
- "backgroundColor",
1453
- "color",
1454
- "fontSize",
1455
- "checked",
1456
- "isCursorPointer",
1457
- "onToggle"
1458
- ])) : g("", !0)]),
1459
- _: 2
1460
- }, 1032, [
1461
- "legendSet",
1462
- "config",
1463
- "isCursorPointer"
1464
- ]))), 128))], !0)], 2)) : g("", !0)], 8, ["to"])) : g("", !0),
1465
- e.$slots.source ? (S(), _("div", {
1466
- key: 7,
1467
- ref_key: "source",
1468
- ref: Gt,
1469
- dir: "auto"
1470
- }, [T(e.$slots, "source", {}, void 0, !0)], 512)) : g("", !0),
1471
- Rt.value && I.value.userOptions.buttons.table ? (S(), h(We(ir.value.component), Re({ key: 8 }, ir.value.props, {
1472
- ref_key: "tableUnit",
1473
- ref: Qt,
1474
- onClose: ar
1475
- }), Fe({
1476
- content: O(() => [(S(), h(D(At), {
1477
- key: `table_${Jt.value}`,
1478
- colNames: Jn.value.colNames,
1479
- head: Jn.value.head,
1480
- body: Jn.value.body,
1481
- config: Jn.value.config,
1482
- title: I.value.table.useDialog ? "" : ir.value.title,
1483
- withCloseButton: !I.value.table.useDialog,
1484
- isCursorPointer: L.value,
1485
- onClose: ar
1486
- }, {
1487
- th: O(({ th: e }) => [v("div", {
1488
- innerHTML: e,
1489
- style: {
1490
- display: "flex",
1491
- "align-items": "center"
1492
- }
1493
- }, null, 8, Et)]),
1494
- td: O(({ td: e }) => [Ie(E(e.name || e), 1)]),
1495
- _: 1
1496
- }, 8, [
1497
- "colNames",
1498
- "head",
1499
- "body",
1500
- "config",
1501
- "title",
1502
- "withCloseButton",
1503
- "isCursorPointer"
1504
- ]))]),
1505
- _: 2
1506
- }, [I.value.table.useDialog ? {
1507
- name: "title",
1508
- fn: O(() => [Ie(E(ir.value.title), 1)]),
1509
- key: "0"
1510
- } : void 0, I.value.table.useDialog ? {
1511
- name: "actions",
1512
- fn: O(() => [v("button", {
1513
- tabindex: "0",
1514
- class: "vue-ui-user-options-button",
1515
- onClick: t[1] ||= (e) => qn(I.value.userOptions.callbacks.csv),
1516
- style: Ve({ cursor: L.value ? "pointer" : "default" })
1517
- }, [Le(D(Ot), {
1518
- name: "fileCsv",
1519
- stroke: ir.value.props.color
1520
- }, null, 8, ["stroke"])], 4)]),
1521
- key: "1"
1522
- } : void 0]), 1040)) : g("", !0),
1523
- T(e.$slots, "skeleton", {}, () => [D(ln) ? (S(), h(_e, { key: 0 })) : g("", !0)], !0)
1524
- ], 46, Ze));
1525
- }
1526
- }, [["__scopeId", "data-v-eed076c6"]]);
1527
- //#endregion
1528
- export { Xe as n, Dt as t };