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,1264 +0,0 @@
1
- import { t as e } from "./rolldown-runtime-Dy4uBu1J.js";
2
- import { $ as t, Bt as n, D as r, Gt as i, Jt as a, Vt as o, X as s, b as c, ct as ee, i as l, jt as te, q as ne, t as re, tt as ie, xt as ae } from "./lib-Bttd6u5E.js";
3
- import { n as oe, t as se } from "./useHints-Dq_w2E8B.js";
4
- import { t as ce } from "./useConfig-D3scuR88.js";
5
- import { t as le } from "./usePrinter-DN5bYhTG.js";
6
- import { n as ue, t as de } from "./BaseScanner-DZvpgOjM.js";
7
- import { t as fe } from "./useSvgExport-DH-FfcqQ.js";
8
- import { t as pe } from "./useNestedProp-vPNvh7rV.js";
9
- import { t as me } from "./useThemeCheck-C43Tcqmk.js";
10
- import { t as he } from "./useTimeLabelCollider-AEcY4Ioe.js";
11
- import { t as ge } from "./img-Bnokohej.js";
12
- import { n as _e } from "./Title-BE3qg9xl.js";
13
- import { t as ve } from "./_plugin-vue_export-helper-B3ysoDQm.js";
14
- import { l as ye, t as be } from "./useResponsive-ZtArZtUf.js";
15
- import { t as xe } from "./DefGrad-DVBqDjhO.js";
16
- import { t as Se } from "./A11yDataTable-DdRsVULz.js";
17
- import { t as Ce } from "./useUserOptionState-DK-_1ddE.js";
18
- import { t as we } from "./useChartAccessibility-DYqac8yF.js";
19
- import { t as Te } from "./vue_ui_age_pyramid-BY6c-oX_.js";
20
- import { Fragment as u, computed as d, createBlock as f, createCommentVNode as p, createElementBlock as m, createElementVNode as h, createSlots as Ee, createTextVNode as De, createVNode as g, defineAsyncComponent as _, guardReactiveProps as v, mergeProps as Oe, nextTick as ke, normalizeClass as Ae, normalizeProps as y, normalizeStyle as b, onBeforeUnmount as je, onMounted as Me, openBlock as x, ref as S, renderList as C, renderSlot as w, resolveDynamicComponent as Ne, shallowRef as Pe, toDisplayString as T, toRefs as Fe, unref as E, watch as D, watchEffect as Ie, withCtx as O } from "vue";
21
- //#region src/components/vue-ui-age-pyramid.vue
22
- var Le = /* @__PURE__ */ e({ default: () => ut }), Re = ["id"], ze = ["id"], Be = { style: { position: "relative" } }, Ve = [
23
- "xmlns",
24
- "viewBox",
25
- "aria-describedby"
26
- ], He = [
27
- "x",
28
- "y",
29
- "width",
30
- "height"
31
- ], Ue = [
32
- "x",
33
- "y",
34
- "width",
35
- "height",
36
- "fill",
37
- "rx"
38
- ], We = [
39
- "x",
40
- "y",
41
- "width",
42
- "height",
43
- "fill",
44
- "rx"
45
- ], Ge = [
46
- "x",
47
- "y",
48
- "width",
49
- "height",
50
- "fill",
51
- "rx"
52
- ], Ke = [
53
- "x",
54
- "y",
55
- "width",
56
- "height",
57
- "fill",
58
- "rx"
59
- ], qe = { key: 0 }, Je = [
60
- "x",
61
- "y",
62
- "fill",
63
- "font-size",
64
- "font-weight"
65
- ], Ye = [
66
- "x",
67
- "y",
68
- "fill",
69
- "font-size",
70
- "font-weight"
71
- ], Xe = { key: 1 }, Ze = [
72
- "x",
73
- "y",
74
- "font-size",
75
- "fill",
76
- "font-weight"
77
- ], Qe = { key: 2 }, $e = { key: 0 }, et = [
78
- "x1",
79
- "x2",
80
- "y1",
81
- "y2",
82
- "stroke",
83
- "stroke-width"
84
- ], tt = [
85
- "x1",
86
- "x2",
87
- "y1",
88
- "y2",
89
- "stroke",
90
- "stroke-width"
91
- ], nt = [
92
- "x1",
93
- "x2",
94
- "y1",
95
- "y2",
96
- "stroke",
97
- "stroke-width"
98
- ], rt = [
99
- "x1",
100
- "x2",
101
- "y1",
102
- "y2",
103
- "stroke",
104
- "stroke-width"
105
- ], it = [
106
- "font-size",
107
- "fill",
108
- "text-anchor",
109
- "font-weight",
110
- "transform"
111
- ], at = [
112
- "font-size",
113
- "fill",
114
- "text-anchor",
115
- "font-weight",
116
- "transform"
117
- ], ot = [
118
- "x",
119
- "y",
120
- "font-size",
121
- "fill",
122
- "font-weight"
123
- ], st = [
124
- "x",
125
- "y",
126
- "width",
127
- "height",
128
- "fill",
129
- "onMouseover",
130
- "onMouseleave",
131
- "onClick"
132
- ], ct = {
133
- key: 0,
134
- style: {
135
- position: "absolute",
136
- top: "100%",
137
- left: "0",
138
- width: "100%"
139
- },
140
- "data-dom-to-png-ignore": "",
141
- "aria-hidden": "true"
142
- }, lt = {
143
- key: 5,
144
- class: "vue-data-ui-watermark"
145
- }, ut = /*#__PURE__*/ ve({
146
- __name: "vue-ui-age-pyramid",
147
- props: {
148
- config: {
149
- type: Object,
150
- default() {
151
- return {};
152
- }
153
- },
154
- dataset: {
155
- type: Array,
156
- default() {
157
- return [];
158
- }
159
- }
160
- },
161
- emits: ["copyAlt"],
162
- setup(e, { expose: ve, emit: Le }) {
163
- let ut = _(() => import("./Tooltip-DhjyfHwz.js")), dt = _(() => import("./BaseIcon-BfndwIWE.js").then((e) => e.n)), ft = _(() => import("./vue-ui-accordion-BxGriZik.js").then((e) => e.n)), pt = _(() => import("./DataTable-BbKgJ5UI.js")), mt = _(() => import("./PenAndPaper-DAE-tnEQ.js").then((e) => e.t)), ht = _(() => import("./UserOptions-Dt98of5H.js").then((e) => e.n)), gt = _(() => import("./PackageVersion-D6d8SCp9.js").then((e) => e.t)), _t = _(() => import("./BaseDraggableDialog-LoqqwRtV.js").then((e) => e.n)), { vue_ui_age_pyramid: vt } = ce(), { isThemeValid: yt, warnInvalidTheme: bt } = me(), k = e, xt = Le, St = d(() => !!k.dataset && k.dataset.length), A = S(ne()), j = S(!1), Ct = S(""), M = S(null), wt = S(0), N = S(null), Tt = S(null), Et = S(null), Dt = S(null), Ot = S(0), kt = S(0), At = S(null), P = S(null), jt = S(null), Mt = S(!1), Nt = S(!1), F = S(null), Pt = S({
164
- x: 0,
165
- y: 0
166
- }), I = S("pointer"), Ft = S(!1), L = S(Ut());
167
- oe({
168
- config: () => L.value,
169
- dataset: () => k.dataset,
170
- component: "VueUiAgePyramid",
171
- rules: [se.emptyArray, {
172
- test: (e) => e.length > 130,
173
- message: [
174
- "👀 Dataset has > 130 points. Consider:",
175
- "",
176
- "▶️ Grouping small values into aggregated categories.",
177
- "",
178
- "▶️ Using VueUiStackline to display data in a more compact way."
179
- ]
180
- }]
181
- });
182
- let R = d(() => L.value.userOptions.useCursorPointer), It = d(() => a({
183
- defaultConfig: {
184
- userOptions: { show: !1 },
185
- table: { show: !1 },
186
- translations: {
187
- male: "",
188
- female: ""
189
- },
190
- style: {
191
- backgroundColor: "#99999930",
192
- layout: {
193
- bars: {
194
- left: { color: "#CACACA" },
195
- right: { color: "#999999" }
196
- },
197
- dataLabels: {
198
- xAxis: {
199
- fontSize: 0,
200
- scale: 1e3,
201
- translation: ""
202
- },
203
- yAxis: { show: !1 }
204
- },
205
- grid: { stroke: "#6A6A6A" }
206
- }
207
- }
208
- },
209
- userConfig: L.value.skeletonConfig ?? {}
210
- })), { loading: Lt, FINAL_DATASET: Rt, manualLoading: zt } = ue({
211
- ...Fe(k),
212
- FINAL_CONFIG: L,
213
- prepareConfig: Ut,
214
- skeletonDataset: k.config?.skeletonDataset ?? [
215
- [
216
- "_",
217
- 9,
218
- 2,
219
- 2
220
- ],
221
- [
222
- "_",
223
- 8,
224
- 3,
225
- 3
226
- ],
227
- [
228
- "_",
229
- 7,
230
- 5,
231
- 5
232
- ],
233
- [
234
- "_",
235
- 6,
236
- 8,
237
- 8
238
- ],
239
- [
240
- "_",
241
- 5,
242
- 13,
243
- 13
244
- ],
245
- [
246
- "_",
247
- 4,
248
- 21,
249
- 21
250
- ],
251
- [
252
- "_",
253
- 3,
254
- 34,
255
- 34
256
- ],
257
- [
258
- "_",
259
- 2,
260
- 55,
261
- 55
262
- ],
263
- [
264
- "_",
265
- 1,
266
- 89,
267
- 89
268
- ],
269
- [
270
- "_",
271
- 0,
272
- 144,
273
- 144
274
- ]
275
- ],
276
- skeletonConfig: a({
277
- defaultConfig: L.value,
278
- userConfig: It.value
279
- })
280
- }), { userOptionsVisible: Bt, setUserOptionsVisibility: Vt, keepUserOptionState: Ht } = Ce({ config: L.value }), { svgRef: z } = we({ config: L.value.style.title });
281
- function Ut() {
282
- let e = pe({
283
- userConfig: k.config,
284
- defaultConfig: vt
285
- }), t = e.theme;
286
- if (!t) return e;
287
- if (!yt.value(e)) return bt(e), e;
288
- let n = pe({
289
- userConfig: Te[t] || k.config,
290
- defaultConfig: e
291
- });
292
- return pe({
293
- userConfig: k.config,
294
- defaultConfig: n
295
- });
296
- }
297
- D(() => k.config, (e) => {
298
- Lt.value || (L.value = Ut()), Bt.value = !L.value.userOptions.showOnChartHover, Gt(), Ot.value += 1, kt.value += 1, H.value.showTable = L.value.table.show, H.value.showTooltip = L.value.style.tooltip.show;
299
- }, { deep: !0 }), D(() => k.dataset, (e) => {
300
- Array.isArray(e) && e.length > 0 && (zt.value = !1);
301
- }, { deep: !0 });
302
- let B = Pe(null), V = Pe(null);
303
- Me(() => {
304
- Gt();
305
- });
306
- let Wt = d(() => !!L.value.debug);
307
- function Gt() {
308
- if (te(k.dataset) && (ie({
309
- componentName: "VueUiAgePyramid",
310
- type: "dataset",
311
- debug: Wt.value
312
- }), zt.value = !0), te(k.dataset) || (zt.value = L.value.loading), L.value.responsive) {
313
- let e = ye(() => {
314
- let { width: e, height: t } = be({
315
- chart: N.value,
316
- title: L.value.style.title.text ? Tt.value : null,
317
- source: Et.value,
318
- noTitle: Dt.value
319
- });
320
- requestAnimationFrame(() => {
321
- U.value.width = e, U.value.height = t;
322
- });
323
- });
324
- B.value && (V.value && B.value.unobserve(V.value), B.value.disconnect()), B.value = new ResizeObserver(e), V.value = N.value.parentNode, B.value.observe(V.value);
325
- }
326
- }
327
- je(() => {
328
- B.value && (V.value && B.value.unobserve(V.value), B.value.disconnect());
329
- });
330
- let { isPrinting: Kt, isImaging: qt, generatePdf: Jt, generateImage: Yt } = le({
331
- elementId: `vue-ui-age-pyramid_${A.value}`,
332
- fileName: L.value.style.title.text || "vue-ui-age-pyramid",
333
- options: L.value.userOptions.print
334
- }), Xt = d(() => L.value.userOptions.show && !L.value.style.title.text), H = S({
335
- showTable: L.value.table.show,
336
- showTooltip: L.value.style.tooltip.show
337
- });
338
- D(L, () => {
339
- H.value = {
340
- showTable: L.value.table.show,
341
- showTooltip: L.value.style.tooltip.show
342
- };
343
- }, { immediate: !0 });
344
- let U = S({
345
- height: L.value.style.height,
346
- width: L.value.style.width
347
- }), Zt = d(() => U.value.width), Qt = d(() => U.value.height), $t = S(0), en = ye((e) => {
348
- $t.value = e;
349
- }, 100);
350
- Ie((e) => {
351
- let t = At.value;
352
- if (!t) return;
353
- let n = new ResizeObserver((e) => {
354
- en(e[0].contentRect.height);
355
- });
356
- n.observe(t), e(() => n.disconnect());
357
- }), je(() => {
358
- $t.value = 0;
359
- });
360
- let W = d(() => {
361
- let e = U.value.width - L.value.style.layout.padding.right - L.value.style.layout.padding.left, t = L.value.style.layout.padding.left, n = U.value.width - L.value.style.layout.padding.right;
362
- return {
363
- top: L.value.style.layout.padding.top + L.value.style.layout.dataLabels.sideTitles.fontSize + L.value.style.layout.dataLabels.sideTitles.offsetY + 12,
364
- left: t,
365
- right: n,
366
- bottom: U.value.height - L.value.style.layout.padding.bottom - $t.value,
367
- width: e,
368
- height: U.value.height - L.value.style.layout.padding.top - L.value.style.layout.padding.bottom - $t.value - L.value.style.layout.dataLabels.sideTitles.fontSize - L.value.style.layout.dataLabels.sideTitles.offsetY - 12,
369
- centerX: L.value.style.layout.padding.left + e / 2,
370
- leftChart: {
371
- width: e / 2 - L.value.style.layout.centerSlit.width,
372
- right: t + e / 2 - L.value.style.layout.centerSlit.width
373
- },
374
- rightChart: {
375
- width: e / 2 - L.value.style.layout.centerSlit.width,
376
- left: t + e / 2 + L.value.style.layout.centerSlit.width
377
- }
378
- };
379
- }), tn = d(() => Rt.value.map((e) => L.value.style.layout.dataLabels.yAxis.display === "age" ? e[1] : e[0])), G = d(() => {
380
- let e = nn(K.value / 5), t = [], n = [];
381
- for (let r = 0; r <= 5; r += 1) {
382
- let i = e * r, a = e * (r - 5);
383
- t.push({
384
- value: i,
385
- x: W.value.left + W.value.width / 2 + L.value.style.layout.centerSlit.width + i / K.value * W.value.leftChart.width
386
- }), n.push({
387
- value: Math.abs(a),
388
- x: W.value.left + W.value.width / 2 + a / K.value * W.value.leftChart.width - L.value.style.layout.centerSlit.width
389
- });
390
- }
391
- return {
392
- right: t,
393
- left: n
394
- };
395
- });
396
- function nn(e) {
397
- if (e === 0) return 0;
398
- let t = 10 ** Math.floor(Math.log10(Math.abs(e))), n;
399
- return n = Math.round(e / t) * t, n;
400
- }
401
- let K = d(() => Math.max(...Rt.value.flatMap((e) => e.slice(-2).map((e) => c(e))))), q = d(() => Rt.value.length), rn = d(() => Rt.value.map((e) => ({
402
- segment: e[0],
403
- age: e[1],
404
- left: {
405
- value: e[2],
406
- proportionToMax: e[2] / K.value
407
- },
408
- right: {
409
- value: e[3],
410
- proportionToMax: e[3] / K.value
411
- }
412
- }))), J = d(() => rn.value.map((e, t) => {
413
- let n = W.value.top + W.value.height / q.value * t, r = W.value.height / q.value - L.value.style.layout.bars.gap;
414
- return {
415
- segment: e.segment,
416
- age: e.age,
417
- left: {
418
- ...e.left,
419
- y: n,
420
- color: L.value.style.layout.bars.left.color,
421
- x: W.value.leftChart.right - e.left.proportionToMax * W.value.leftChart.width,
422
- width: c(e.left.proportionToMax * W.value.leftChart.width),
423
- height: r
424
- },
425
- right: {
426
- ...e.right,
427
- y: n,
428
- color: L.value.style.layout.bars.right.color,
429
- x: W.value.rightChart.left,
430
- width: c(e.right.proportionToMax * W.value.rightChart.width),
431
- height: r
432
- }
433
- };
434
- })), Y = S(null);
435
- function an(e) {
436
- let [t, n, r, i] = e;
437
- return {
438
- segment: t,
439
- index: n,
440
- left: r,
441
- right: i
442
- };
443
- }
444
- function on(e, t) {
445
- L.value.events.datapointClick && L.value.events.datapointClick({
446
- datapoint: an(t),
447
- seriesIndex: e
448
- });
449
- }
450
- function sn(e, t) {
451
- L.value.events.datapointLeave && L.value.events.datapointLeave({
452
- datapoint: an(t),
453
- seriesIndex: e
454
- }), (I.value !== "keyboard" || F.value !== e) && (M.value = null, j.value = !1);
455
- }
456
- function cn(e) {
457
- if (!z.value) return;
458
- let t = J.value[e];
459
- if (!t) return;
460
- let n = i(W.value.left + W.value.width / 2, t.left.y + t.left.height / 2, z.value);
461
- n && (Pt.value = n);
462
- }
463
- function ln(e, t, n = "pointer") {
464
- L.value.events.datapointEnter && L.value.events.datapointEnter({
465
- datapoint: an(t),
466
- seriesIndex: e
467
- }), M.value = e, F.value = e, I.value = n, Y.value = {
468
- datapoint: t,
469
- seriesIndex: e,
470
- series: J.value,
471
- config: L.value
472
- };
473
- let r = L.value.style.tooltip.customFormat;
474
- if (ae(r) && ee(() => r({
475
- seriesIndex: e,
476
- datapoint: {
477
- segment: t[0],
478
- index: t[1],
479
- left: t[2],
480
- right: t[3]
481
- },
482
- series: J.value,
483
- config: L.value
484
- }))) Ct.value = r({
485
- seriesIndex: e,
486
- datapoint: {
487
- segment: t[0],
488
- index: t[1],
489
- left: t[2],
490
- right: t[3]
491
- },
492
- series: J.value,
493
- config: L.value
494
- });
495
- else {
496
- let n = "", r = J.value[e];
497
- n += `<div><b>${r.segment}</b></div>`, n += `<div>${L.value.translations.age}: ${l(L.value.style.layout.dataLabels.yAxis.formatter, c(r.age), s({ v: c(r.age) }), {
498
- datapoint: t,
499
- seriesIndex: e
500
- })}</div>`, n += `<div style="margin-top:6px;padding-top:6px;border-top:1px solid ${L.value.style.tooltip.borderColor}">`, n += "<div style=\"display:flex; flex-direction:row;gap:12px\">", n += `<div style="display:flex;flex-direction:column;align-items:center;justify-content:center"><svg viewBox="0 0 12 12" height="12" width="12"><rect stroke="none" x="0" y="0" height="12" width="12" rx="2" fill="${L.value.style.layout.bars.gradient.underlayer}"/><rect stroke="none" x="0" y="0" height="12" width="12" rx="2" fill="${L.value.style.layout.bars.gradient.show ? `url(#age_pyramid_left_${A.value})` : L.value.style.layout.bars.left.color}"/></svg><div>${L.value.translations.female}</div><div><b>${l(L.value.style.layout.dataLabels.xAxis.formatter, c(r.left.value), s({ v: c(r.left.value) }), {
501
- datapoint: t,
502
- seriesIndex: e
503
- })}</b></div></div>`, n += `<div style="display:flex;flex-direction:column;align-items:center;justify-content:center"><svg viewBox="0 0 12 12" height="12" width="12"><rect stroke="none" x="0" y="0" height="12" width="12" rx="2" fill="${L.value.style.layout.bars.gradient.underlayer}"/><rect stroke="none" x="0" y="0" height="12" width="12" rx="2" fill="${L.value.style.layout.bars.gradient.show ? `url(#age_pyramid_right_${A.value})` : L.value.style.layout.bars.right.color}"/></svg><div>${L.value.translations.male}</div><div><b>${l(L.value.style.layout.dataLabels.xAxis.formatter, c(r.right.value), s({ v: c(r.right.value) }), {
504
- datapoint: t,
505
- seriesIndex: e
506
- })}</b></div></div>`, n += "</div>", n += `<div style="margin-top:6px;padding-top:6px;border-top:1px solid ${L.value.style.tooltip.borderColor}"><div>${L.value.translations.total}</div><div><b>${l(L.value.style.layout.dataLabels.xAxis.formatter, c(r.right.value) + c(r.left.value), s({ v: c(r.right.value) + c(r.left.value) }), {
507
- datapoint: t,
508
- seriesIndex: e
509
- })}</b></div></div>`, n += "</div>", Ct.value = `<div>${n}</div>`;
510
- }
511
- j.value = !0, n === "keyboard" && ke(() => {
512
- cn(e);
513
- });
514
- }
515
- function un(e = null) {
516
- ke(() => {
517
- let n = [
518
- L.value.translations.year,
519
- L.value.translations.age,
520
- L.value.translations.female,
521
- L.value.translations.male,
522
- L.value.translations.total
523
- ], i = k.dataset.map((e) => [
524
- e[0],
525
- e[1],
526
- e[2],
527
- e[3],
528
- e[2] ?? 0 + e[3] ?? 0
529
- ]), a = [
530
- [L.value.style.title.text],
531
- [L.value.style.title.subtitle.text],
532
- [
533
- [""],
534
- [""],
535
- [""]
536
- ],
537
- n
538
- ].concat(i), o = r(a);
539
- e ? e(o) : t({
540
- csvContent: o,
541
- title: L.value.style.title.text || "vue-ui-heatmap"
542
- });
543
- });
544
- }
545
- let X = d(() => {
546
- let e = [
547
- L.value.translations.year,
548
- L.value.translations.age,
549
- L.value.translations.female,
550
- L.value.translations.male,
551
- L.value.translations.total
552
- ];
553
- return {
554
- head: e,
555
- body: k.dataset.map((e) => [
556
- e[0],
557
- e[1],
558
- e[2] == null ? "" : e[2].toLocaleString(),
559
- e[3] == null ? "" : e[3].toLocaleString(),
560
- (e[2] ?? 0 + e[3] ?? 0).toLocaleString()
561
- ]),
562
- config: {
563
- th: {
564
- backgroundColor: L.value.table.th.backgroundColor,
565
- color: L.value.table.th.color,
566
- outline: L.value.table.th.outline
567
- },
568
- td: {
569
- backgroundColor: L.value.table.td.backgroundColor,
570
- color: L.value.table.td.color,
571
- outline: L.value.table.td.outline
572
- },
573
- breakpoint: L.value.table.responsiveBreakpoint
574
- },
575
- colNames: e
576
- };
577
- }), Z = S(!1);
578
- function dn(e) {
579
- Z.value = e, wt.value += 1;
580
- }
581
- function fn() {
582
- H.value.showTable = !H.value.showTable;
583
- }
584
- function pn() {
585
- H.value.showTooltip = !H.value.showTooltip;
586
- }
587
- let Q = S(!1);
588
- function mn() {
589
- Q.value = !Q.value;
590
- }
591
- async function hn({ scale: e = 2 } = {}) {
592
- if (!N.value) return;
593
- let { width: t, height: n } = N.value.getBoundingClientRect(), r = t / n, { imageUri: i, base64: a } = await ge({
594
- domElement: N.value,
595
- base64: !0,
596
- img: !0,
597
- scale: e
598
- });
599
- return {
600
- imageUri: i,
601
- base64: a,
602
- title: L.value.style.title.text,
603
- width: t,
604
- height: n,
605
- aspectRatio: r
606
- };
607
- }
608
- let gn = S([]), _n = S({
609
- start: 0,
610
- end: J.value.length
611
- });
612
- he({
613
- timeLabelsEls: At,
614
- timeLabels: gn,
615
- slicer: _n,
616
- configRef: L,
617
- rotationPath: [
618
- "style",
619
- "layout",
620
- "dataLabels",
621
- "xAxis",
622
- "rotation"
623
- ],
624
- autoRotatePath: [
625
- "style",
626
- "layout",
627
- "dataLabels",
628
- "xAxis",
629
- "autoRotate",
630
- "enable"
631
- ],
632
- isAutoSize: !1,
633
- width: Zt,
634
- height: Qt,
635
- targetClass: ".vue-ui-age-pyramid-x-axis-label",
636
- rotation: L.value.style.layout.dataLabels.xAxis.autoRotate.angle
637
- });
638
- let $ = d(() => {
639
- let e = L.value.table.useDialog && !L.value.table.show, t = H.value.showTable;
640
- return {
641
- component: e ? _t : ft,
642
- title: `${L.value.style.title.text}${L.value.style.title.subtitle.text ? `: ${L.value.style.title.subtitle.text}` : ""}`,
643
- props: e ? {
644
- backgroundColor: L.value.table.th.backgroundColor,
645
- color: L.value.table.th.color,
646
- headerColor: L.value.table.th.color,
647
- headerBg: L.value.table.th.backgroundColor,
648
- isFullscreen: Z.value,
649
- fullscreenParent: N.value,
650
- forcedWidth: Math.min(800, window.innerWidth * .8),
651
- isCursorPointer: R.value
652
- } : {
653
- hideDetails: !0,
654
- config: {
655
- open: t,
656
- maxHeight: 1e4,
657
- body: {
658
- backgroundColor: L.value.style.backgroundColor,
659
- color: L.value.style.color
660
- },
661
- head: {
662
- backgroundColor: L.value.style.backgroundColor,
663
- color: L.value.style.color
664
- }
665
- }
666
- }
667
- };
668
- });
669
- D(() => H.value.showTable, (e) => {
670
- L.value.table.show || (e && L.value.table.useDialog && P.value ? P.value.open() : "close" in P.value && P.value.close());
671
- });
672
- function vn() {
673
- H.value.showTable = !1, jt.value && jt.value.setTableIconState(!1);
674
- }
675
- let yn = d(() => L.value.style.backgroundColor), bn = d(() => L.value.style.title), { exportSvg: xn, getSvg: Sn } = fe({
676
- svg: z,
677
- title: bn,
678
- backgroundColor: yn
679
- });
680
- async function Cn({ isCb: e }) {
681
- Nt.value = !0, await ke();
682
- try {
683
- if (e) {
684
- let { blob: e, url: t, text: n, dataUrl: r } = await Sn();
685
- await Promise.resolve(L.value.userOptions.callbacks.svg({
686
- blob: e,
687
- url: t,
688
- text: n,
689
- dataUrl: r
690
- }));
691
- } else await Promise.resolve(xn());
692
- } finally {
693
- Nt.value = !1;
694
- }
695
- }
696
- function wn(e) {
697
- if (e?.stage === "start") {
698
- Mt.value = !0;
699
- return;
700
- }
701
- if (e?.stage === "end") {
702
- Mt.value = !1;
703
- return;
704
- }
705
- Yt();
706
- }
707
- async function Tn() {
708
- if (xt("copyAlt", {
709
- config: L.value,
710
- dataset: J.value
711
- }), !L.value.userOptions.callbacks.altCopy) {
712
- console.warn("Vue Data UI - A callback must be set for `altCopy` in userOptions.");
713
- return;
714
- }
715
- await Promise.resolve(L.value.userOptions.callbacks.altCopy({
716
- config: L.value,
717
- dataset: J.value
718
- }));
719
- }
720
- function En() {
721
- Ft.value = !0;
722
- }
723
- function Dn() {
724
- M.value = null, F.value = null, I.value = "pointer", j.value = !1, Ft.value = !1;
725
- }
726
- function On(e) {
727
- if (!z.value || Q.value || document.activeElement !== z.value || !J.value.length) return;
728
- let t = ["ArrowUp", "ArrowLeft"].includes(e.key), n = ["ArrowDown", "ArrowRight"].includes(e.key), r = e.key === "Enter" || e.key === " ", i = e.key === "Escape";
729
- if (!t && !n && !r && !i) return;
730
- if (e.preventDefault(), e.stopPropagation(), i) {
731
- M.value = null, F.value = null, I.value = "pointer", j.value = !1;
732
- return;
733
- }
734
- if (r) {
735
- if (F.value === null) return;
736
- let e = k.dataset[F.value];
737
- if (!e) return;
738
- on(F.value, e);
739
- return;
740
- }
741
- let a = F.value, o = M.value, s = a !== null && a >= 0 && a < J.value.length, c = o !== null && o >= 0 && o < J.value.length;
742
- s ? t ? a = a - 1 < 0 ? J.value.length - 1 : a - 1 : n && (a = a + 1 > J.value.length - 1 ? 0 : a + 1) : c ? (a = n ? o + 1 : o - 1, a >= J.value.length && (a = 0), a < 0 && (a = J.value.length - 1)) : a = n ? 0 : J.value.length - 1;
743
- let ee = k.dataset[a];
744
- ee && ln(a, ee, "keyboard");
745
- }
746
- return ve({
747
- getImage: hn,
748
- generatePdf: Jt,
749
- generateCsv: un,
750
- generateImage: Yt,
751
- generateSvg: Cn,
752
- toggleTable: fn,
753
- toggleTooltip: pn,
754
- toggleAnnotator: mn,
755
- toggleFullscreen: dn,
756
- copyAlt: Tn
757
- }), (t, r) => (x(), m("div", {
758
- class: Ae(`vue-data-ui-component vue-ui-age-pyramid ${Z.value ? "vue-data-ui-wrapper-fullscreen" : ""}`),
759
- ref_key: "agePyramid",
760
- ref: N,
761
- id: `vue-ui-age-pyramid_${A.value}`,
762
- style: b(`font-family:${L.value.style.fontFamily};width:100%; text-align:center;background:${L.value.style.backgroundColor};${L.value.responsive ? "height:100%" : ""}`),
763
- onMouseenter: r[1] ||= () => E(Vt)(!0),
764
- onMouseleave: r[2] ||= () => E(Vt)(!1)
765
- }, [
766
- h("div", {
767
- id: `chart-instructions-${A.value}`,
768
- class: "sr-only"
769
- }, [h("p", null, T(L.value.a11y.translations.keyboardNavigation), 1)], 8, ze),
770
- X.value?.body?.length ? (x(), f(Se, {
771
- key: 0,
772
- uid: A.value,
773
- head: X.value.head,
774
- body: X.value.body,
775
- notice: L.value.a11y.translations.tableAvailable,
776
- caption: L.value.a11y.translations.tableCaption
777
- }, null, 8, [
778
- "uid",
779
- "head",
780
- "body",
781
- "notice",
782
- "caption"
783
- ])) : p("", !0),
784
- L.value.userOptions.buttons.annotator ? (x(), f(E(mt), {
785
- key: 1,
786
- svgRef: E(z),
787
- backgroundColor: L.value.style.backgroundColor,
788
- color: L.value.style.color,
789
- active: Q.value,
790
- isCursorPointer: R.value,
791
- onClose: mn
792
- }, {
793
- "annotator-action-close": O(() => [w(t.$slots, "annotator-action-close", {}, void 0, !0)]),
794
- "annotator-action-color": O(({ color: e }) => [w(t.$slots, "annotator-action-color", y(v({ color: e })), void 0, !0)]),
795
- "annotator-action-draw": O(({ mode: e }) => [w(t.$slots, "annotator-action-draw", y(v({ mode: e })), void 0, !0)]),
796
- "annotator-action-undo": O(({ disabled: e }) => [w(t.$slots, "annotator-action-undo", y(v({ disabled: e })), void 0, !0)]),
797
- "annotator-action-redo": O(({ disabled: e }) => [w(t.$slots, "annotator-action-redo", y(v({ disabled: e })), void 0, !0)]),
798
- "annotator-action-delete": O(({ disabled: e }) => [w(t.$slots, "annotator-action-delete", y(v({ disabled: e })), void 0, !0)]),
799
- _: 3
800
- }, 8, [
801
- "svgRef",
802
- "backgroundColor",
803
- "color",
804
- "active",
805
- "isCursorPointer"
806
- ])) : p("", !0),
807
- Xt.value ? (x(), m("div", {
808
- key: 2,
809
- ref_key: "noTitle",
810
- ref: Dt,
811
- class: "vue-data-ui-no-title-space",
812
- style: "height:36px; width: 100%;background:transparent"
813
- }, null, 512)) : p("", !0),
814
- L.value.style.title.text ? (x(), m("div", {
815
- key: 3,
816
- ref_key: "chartTitle",
817
- ref: Tt,
818
- style: "width:100%;background:transparent"
819
- }, [(x(), f(_e, {
820
- key: `title_${Ot.value}`,
821
- config: {
822
- title: {
823
- cy: "pyramid-div-title",
824
- ...L.value.style.title
825
- },
826
- subtitle: {
827
- cy: "pyramid-div-subtitle",
828
- ...L.value.style.title.subtitle
829
- }
830
- }
831
- }, null, 8, ["config"]))], 512)) : p("", !0),
832
- L.value.userOptions.show && St.value && (E(Ht) || E(Bt)) ? (x(), f(E(ht), {
833
- ref_key: "userOptionsRef",
834
- ref: jt,
835
- key: `user_options_${wt.value}`,
836
- backgroundColor: L.value.style.backgroundColor,
837
- color: L.value.style.color,
838
- isImaging: E(qt),
839
- isPrinting: E(Kt),
840
- uid: A.value,
841
- hasTooltip: L.value.userOptions.buttons.tooltip && L.value.style.tooltip.show,
842
- hasPdf: L.value.userOptions.buttons.pdf,
843
- hasXls: L.value.userOptions.buttons.csv,
844
- hasImg: L.value.userOptions.buttons.img,
845
- hasSvg: L.value.userOptions.buttons.svg,
846
- hasTable: L.value.userOptions.buttons.table,
847
- hasFullscreen: L.value.userOptions.buttons.fullscreen,
848
- hasAltCopy: L.value.userOptions.buttons.altCopy,
849
- isFullscreen: Z.value,
850
- isTooltip: H.value.showTooltip,
851
- titles: { ...L.value.userOptions.buttonTitles },
852
- chartElement: N.value,
853
- position: L.value.userOptions.position,
854
- hasAnnotator: L.value.userOptions.buttons.annotator,
855
- isAnnotation: Q.value,
856
- callbacks: L.value.userOptions.callbacks,
857
- printScale: L.value.userOptions.print.scale,
858
- tableDialog: L.value.table.useDialog,
859
- isCursorPointer: R.value,
860
- onToggleFullscreen: dn,
861
- onGeneratePdf: E(Jt),
862
- onGenerateCsv: un,
863
- onGenerateImage: wn,
864
- onGenerateSvg: Cn,
865
- onToggleTable: fn,
866
- onToggleTooltip: pn,
867
- onToggleAnnotator: mn,
868
- onCopyAlt: Tn,
869
- style: b({ visibility: E(Ht) ? E(Bt) ? "visible" : "hidden" : "visible" })
870
- }, Ee({ _: 2 }, [
871
- t.$slots.menuIcon ? {
872
- name: "menuIcon",
873
- fn: O(({ isOpen: e, color: n }) => [w(t.$slots, "menuIcon", y(v({
874
- isOpen: e,
875
- color: n
876
- })), void 0, !0)]),
877
- key: "0"
878
- } : void 0,
879
- t.$slots.optionTooltip ? {
880
- name: "optionTooltip",
881
- fn: O(() => [w(t.$slots, "optionTooltip", {}, void 0, !0)]),
882
- key: "1"
883
- } : void 0,
884
- t.$slots.optionPdf ? {
885
- name: "optionPdf",
886
- fn: O(() => [w(t.$slots, "optionPdf", {}, void 0, !0)]),
887
- key: "2"
888
- } : void 0,
889
- t.$slots.optionCsv ? {
890
- name: "optionCsv",
891
- fn: O(() => [w(t.$slots, "optionCsv", {}, void 0, !0)]),
892
- key: "3"
893
- } : void 0,
894
- t.$slots.optionImg ? {
895
- name: "optionImg",
896
- fn: O(() => [w(t.$slots, "optionImg", {}, void 0, !0)]),
897
- key: "4"
898
- } : void 0,
899
- t.$slots.optionSvg ? {
900
- name: "optionSvg",
901
- fn: O(() => [w(t.$slots, "optionSvg", {}, void 0, !0)]),
902
- key: "5"
903
- } : void 0,
904
- t.$slots.optionTable ? {
905
- name: "optionTable",
906
- fn: O(() => [w(t.$slots, "optionTable", {}, void 0, !0)]),
907
- key: "6"
908
- } : void 0,
909
- t.$slots.optionFullscreen ? {
910
- name: "optionFullscreen",
911
- fn: O(({ toggleFullscreen: e, isFullscreen: n }) => [w(t.$slots, "optionFullscreen", y(v({
912
- toggleFullscreen: e,
913
- isFullscreen: n
914
- })), void 0, !0)]),
915
- key: "7"
916
- } : void 0,
917
- t.$slots.optionAnnotator ? {
918
- name: "optionAnnotator",
919
- fn: O(({ toggleAnnotator: e, isAnnotator: n }) => [w(t.$slots, "optionAnnotator", y(v({
920
- toggleAnnotator: e,
921
- isAnnotator: n
922
- })), void 0, !0)]),
923
- key: "8"
924
- } : void 0,
925
- t.$slots.optionAltCopy ? {
926
- name: "optionAltCopy",
927
- fn: O(({ altCopy: e }) => [w(t.$slots, "optionAltCopy", y(v({ altCopy: e })), void 0, !0)]),
928
- key: "9"
929
- } : void 0,
930
- t.$slots["custom-menu-before"] ? {
931
- name: "custom-menu-before",
932
- fn: O(() => [w(t.$slots, "custom-menu-before", {}, void 0, !0)]),
933
- key: "10"
934
- } : void 0,
935
- t.$slots["custom-menu-after"] ? {
936
- name: "custom-menu-after",
937
- fn: O(() => [w(t.$slots, "custom-menu-after", {}, void 0, !0)]),
938
- key: "11"
939
- } : void 0
940
- ]), 1032, /* @__PURE__ */ "backgroundColor.color.isImaging.isPrinting.uid.hasTooltip.hasPdf.hasXls.hasImg.hasSvg.hasTable.hasFullscreen.hasAltCopy.isFullscreen.isTooltip.titles.chartElement.position.hasAnnotator.isAnnotation.callbacks.printScale.tableDialog.isCursorPointer.onGeneratePdf.style".split("."))) : p("", !0),
941
- h("div", Be, [(x(), m("svg", {
942
- ref_key: "svgRef",
943
- ref: z,
944
- xmlns: E(re),
945
- class: Ae({
946
- "vue-data-ui-fullscreen--on": Z.value,
947
- "vue-data-ui-fulscreen--off": !Z.value
948
- }),
949
- viewBox: `0 0 ${U.value.width <= 0 ? 10 : U.value.width} ${U.value.height <= 0 ? 10 : U.value.height}`,
950
- style: b(`max-width:100%;overflow:visible;background:transparent;color:${L.value.style.color}`),
951
- tabindex: "0",
952
- "aria-describedby": `chart-instructions-${A.value}`,
953
- onFocus: En,
954
- onBlur: Dn,
955
- onKeydown: On
956
- }, [
957
- g(E(gt)),
958
- t.$slots["chart-background"] ? (x(), m("foreignObject", {
959
- key: 0,
960
- x: W.value.left,
961
- y: W.value.top,
962
- width: Math.max(.1, W.value.width),
963
- height: Math.max(.1, W.value.height),
964
- style: { pointerEvents: "none" }
965
- }, [w(t.$slots, "chart-background", {}, void 0, !0)], 8, He)) : p("", !0),
966
- h("defs", null, [g(xe, {
967
- t: "linear",
968
- id: `age_pyramid_left_${A.value}`,
969
- x1: "0%",
970
- y1: "0%",
971
- x2: "100%",
972
- y2: "0%",
973
- stops: [[
974
- "0%",
975
- L.value.style.layout.bars.left.color,
976
- 1
977
- ], [
978
- "100%",
979
- E(n)(E(o)(L.value.style.layout.bars.left.color, L.value.style.layout.bars.gradient.shiftHue), 100 - L.value.style.layout.bars.gradient.intensity),
980
- 1
981
- ]]
982
- }, null, 8, ["id", "stops"]), g(xe, {
983
- t: "linear",
984
- id: `age_pyramid_right_${A.value}`,
985
- x1: "0%",
986
- y1: "0%",
987
- x2: "100%",
988
- y2: "0%",
989
- stops: [[
990
- "0%",
991
- E(n)(E(o)(L.value.style.layout.bars.right.color, L.value.style.layout.bars.gradient.shiftHue), 100 - L.value.style.layout.bars.gradient.intensity),
992
- 1
993
- ], [
994
- "100%",
995
- L.value.style.layout.bars.right.color,
996
- 1
997
- ]]
998
- }, null, 8, ["id", "stops"])]),
999
- (x(!0), m(u, null, C(J.value, (e, t) => (x(), m("g", null, [
1000
- h("rect", {
1001
- x: e.left.x,
1002
- y: e.left.y,
1003
- width: E(c)(e.left.width <= 0 ? 1e-4 : e.left.width),
1004
- height: e.left.height <= 0 ? 1e-4 : e.left.height,
1005
- fill: L.value.style.layout.bars.gradient.underlayer,
1006
- rx: L.value.style.layout.bars.borderRadius
1007
- }, null, 8, Ue),
1008
- h("rect", {
1009
- x: e.left.x,
1010
- y: e.left.y,
1011
- width: e.left.width <= 0 ? 1e-4 : e.left.width,
1012
- height: e.left.height <= 0 ? 1e-4 : e.left.height,
1013
- fill: L.value.style.layout.bars.gradient.show ? `url(#age_pyramid_left_${A.value})` : e.left.color,
1014
- rx: L.value.style.layout.bars.borderRadius
1015
- }, null, 8, We),
1016
- h("rect", {
1017
- x: e.right.x,
1018
- y: e.right.y,
1019
- width: e.right.width <= 0 ? 1e-4 : e.right.width,
1020
- height: e.right.height <= 0 ? 1e-4 : e.right.height,
1021
- fill: L.value.style.layout.bars.gradient.underlayer,
1022
- rx: L.value.style.layout.bars.borderRadius
1023
- }, null, 8, Ge),
1024
- h("rect", {
1025
- x: e.right.x,
1026
- y: e.right.y,
1027
- width: e.right.width <= 0 ? 1e-4 : e.right.width,
1028
- height: e.right.height <= 0 ? 1e-4 : e.right.height,
1029
- fill: L.value.style.layout.bars.gradient.show ? `url(#age_pyramid_right_${A.value})` : e.right.color,
1030
- rx: L.value.style.layout.bars.borderRadius
1031
- }, null, 8, Ke)
1032
- ]))), 256)),
1033
- h("g", null, [
1034
- L.value.style.layout.dataLabels.sideTitles.show ? (x(), m("g", qe, [h("text", {
1035
- x: W.value.left,
1036
- y: L.value.style.layout.dataLabels.sideTitles.fontSize,
1037
- fill: L.value.style.layout.dataLabels.sideTitles.useSideColor ? L.value.style.layout.bars.left.color : L.value.style.layout.dataLabels.sideTitles.color,
1038
- "font-size": L.value.style.layout.dataLabels.sideTitles.fontSize,
1039
- "text-anchor": "start",
1040
- "font-weight": L.value.style.layout.dataLabels.sideTitles.bold ? "bold" : "normal"
1041
- }, T(L.value.translations.female), 9, Je), h("text", {
1042
- x: W.value.right,
1043
- y: L.value.style.layout.dataLabels.sideTitles.fontSize,
1044
- fill: L.value.style.layout.dataLabels.sideTitles.useSideColor ? L.value.style.layout.bars.right.color : L.value.style.layout.dataLabels.sideTitles.color,
1045
- "font-size": L.value.style.layout.dataLabels.sideTitles.fontSize,
1046
- "text-anchor": "end",
1047
- "font-weight": L.value.style.layout.dataLabels.sideTitles.bold ? "bold" : "normal"
1048
- }, T(L.value.translations.male), 9, Ye)])) : p("", !0),
1049
- L.value.style.layout.dataLabels.yAxis.show ? (x(), m("g", Xe, [(x(!0), m(u, null, C(tn.value, (e, t) => (x(), m(u, null, [t % L.value.style.layout.dataLabels.yAxis.showEvery === 0 ? (x(), m("text", {
1050
- key: 0,
1051
- x: W.value.centerX,
1052
- y: W.value.top + W.value.height / q.value * t + L.value.style.layout.dataLabels.yAxis.fontSize / 3,
1053
- "text-anchor": "middle",
1054
- "font-size": L.value.style.layout.dataLabels.yAxis.fontSize,
1055
- fill: L.value.style.layout.dataLabels.yAxis.color,
1056
- "font-weight": L.value.style.layout.dataLabels.yAxis.bold ? "bold" : "normal"
1057
- }, T(E(l)(L.value.style.layout.dataLabels.yAxis.formatter, e, E(s)({ v: e }), {
1058
- datapoint: e,
1059
- seriesIndex: t
1060
- })), 9, Ze)) : p("", !0)], 64))), 256))])) : p("", !0),
1061
- L.value.style.layout.dataLabels.xAxis.show ? (x(), m("g", Qe, [
1062
- L.value.style.layout.grid.show ? (x(), m("g", $e, [h("line", {
1063
- x1: G.value.right[0].x,
1064
- x2: G.value.right.at(-1).x,
1065
- y1: W.value.bottom + L.value.style.layout.dataLabels.xAxis.fontSize / 2,
1066
- y2: W.value.bottom + L.value.style.layout.dataLabels.xAxis.fontSize / 2,
1067
- stroke: L.value.style.layout.grid.stroke,
1068
- "stroke-width": L.value.style.layout.grid.strokeWidth,
1069
- "stroke-linecap": "round"
1070
- }, null, 8, et), h("line", {
1071
- x1: G.value.left[0].x,
1072
- x2: G.value.left.at(-1).x,
1073
- y1: W.value.bottom + L.value.style.layout.dataLabels.xAxis.fontSize / 2,
1074
- y2: W.value.bottom + L.value.style.layout.dataLabels.xAxis.fontSize / 2,
1075
- stroke: L.value.style.layout.grid.stroke,
1076
- "stroke-width": L.value.style.layout.grid.strokeWidth,
1077
- "stroke-linecap": "round"
1078
- }, null, 8, tt)])) : p("", !0),
1079
- (x(!0), m(u, null, C(G.value.right, (e, t) => (x(), m("g", null, [L.value.style.layout.grid.show ? (x(), m("line", {
1080
- key: 0,
1081
- x1: e.x,
1082
- x2: e.x,
1083
- y1: W.value.bottom + L.value.style.layout.dataLabels.xAxis.fontSize / 2,
1084
- y2: W.value.bottom + L.value.style.layout.dataLabels.xAxis.fontSize / 2 + 4,
1085
- stroke: L.value.style.layout.grid.stroke,
1086
- "stroke-width": L.value.style.layout.grid.strokeWidth,
1087
- "stroke-linecap": "round"
1088
- }, null, 8, nt)) : p("", !0)]))), 256)),
1089
- (x(!0), m(u, null, C(G.value.left, (e, t) => (x(), m("g", null, [L.value.style.layout.grid.show ? (x(), m("line", {
1090
- key: 0,
1091
- x1: e.x,
1092
- x2: e.x,
1093
- y1: W.value.bottom + L.value.style.layout.dataLabels.xAxis.fontSize / 2,
1094
- y2: W.value.bottom + L.value.style.layout.dataLabels.xAxis.fontSize / 2 + 4,
1095
- stroke: L.value.style.layout.grid.stroke,
1096
- "stroke-width": L.value.style.layout.grid.strokeWidth,
1097
- "stroke-linecap": "round"
1098
- }, null, 8, rt)) : p("", !0)]))), 256)),
1099
- h("g", {
1100
- ref_key: "xAxisLabels",
1101
- ref: At
1102
- }, [(x(!0), m(u, null, C(G.value.right, (e, t) => (x(), m("text", {
1103
- class: "vue-ui-age-pyramid-x-axis-label",
1104
- "font-size": L.value.style.layout.dataLabels.xAxis.fontSize,
1105
- fill: L.value.style.layout.dataLabels.xAxis.color,
1106
- "text-anchor": L.value.style.layout.dataLabels.xAxis.rotation > 0 ? "start" : L.value.style.layout.dataLabels.xAxis.rotation < 0 ? "end" : "middle",
1107
- "font-weight": L.value.style.layout.dataLabels.xAxis.bold ? "bold" : "normal",
1108
- transform: `translate(${e.x}, ${W.value.bottom + L.value.style.layout.dataLabels.xAxis.fontSize * 2}) rotate(${L.value.style.layout.dataLabels.xAxis.rotation})`
1109
- }, T(E(l)(L.value.style.layout.dataLabels.xAxis.formatter, e.value / L.value.style.layout.dataLabels.xAxis.scale, E(s)({ v: e.value / L.value.style.layout.dataLabels.xAxis.scale }), {
1110
- datapoint: e,
1111
- seriesIndex: t
1112
- })), 9, it))), 256)), (x(!0), m(u, null, C(G.value.left, (e, t) => (x(), m("text", {
1113
- class: "vue-ui-age-pyramid-x-axis-label",
1114
- "font-size": L.value.style.layout.dataLabels.xAxis.fontSize,
1115
- fill: L.value.style.layout.dataLabels.xAxis.color,
1116
- "text-anchor": L.value.style.layout.dataLabels.xAxis.rotation > 0 ? "start" : L.value.style.layout.dataLabels.xAxis.rotation < 0 ? "end" : "middle",
1117
- "font-weight": L.value.style.layout.dataLabels.xAxis.bold ? "bold" : "normal",
1118
- transform: `translate(${e.x}, ${W.value.bottom + L.value.style.layout.dataLabels.xAxis.fontSize * 2}) rotate(${L.value.style.layout.dataLabels.xAxis.rotation})`
1119
- }, T(E(l)(L.value.style.layout.dataLabels.xAxis.formatter, e.value / L.value.style.layout.dataLabels.xAxis.scale, E(s)({ v: e.value / L.value.style.layout.dataLabels.xAxis.scale }), {
1120
- datapoint: e,
1121
- seriesIndex: t
1122
- })), 9, at))), 256))], 512),
1123
- h("text", {
1124
- x: W.value.right,
1125
- y: U.value.height,
1126
- "text-anchor": "end",
1127
- "font-size": L.value.style.layout.dataLabels.xAxis.fontSize,
1128
- fill: L.value.style.layout.dataLabels.xAxis.color,
1129
- "font-weight": L.value.style.layout.dataLabels.xAxis.bold ? "bold" : "normal"
1130
- }, T(L.value.style.layout.dataLabels.xAxis.translation), 9, ot)
1131
- ])) : p("", !0)
1132
- ]),
1133
- (x(!0), m(u, null, C(e.dataset, (e, t) => (x(), m("g", null, [h("rect", {
1134
- x: W.value.left,
1135
- y: W.value.top + W.value.height / q.value * t - L.value.style.layout.bars.gap / 2,
1136
- width: W.value.width <= 0 ? 1e-4 : W.value.width,
1137
- height: W.value.height / q.value <= 0 ? 1e-4 : W.value.height / q.value,
1138
- fill: M.value !== null && M.value === t ? E(n)(L.value.style.highlighter.color, L.value.style.highlighter.opacity) : "transparent",
1139
- onMouseover: (n) => ln(t, e, "pointer"),
1140
- onMouseleave: (n) => sn(t, e),
1141
- onClick: (n) => on(t, e)
1142
- }, null, 40, st)]))), 256)),
1143
- w(t.$slots, "svg", { svg: {
1144
- ...U.value,
1145
- drawingArea: W.value,
1146
- isPrintingImg: E(Kt) || E(qt) || Mt.value,
1147
- isPrintingSvg: Nt.value
1148
- } }, void 0, !0)
1149
- ], 46, Ve)), t.$slots.hint ? (x(), m("div", ct, [w(t.$slots, "hint", y(v({
1150
- hint: L.value.a11y.translations.keyboardNavigation,
1151
- isVisible: Ft.value
1152
- })), void 0, !0)])) : p("", !0)]),
1153
- t.$slots.watermark ? (x(), m("div", lt, [w(t.$slots, "watermark", y(v({ isPrinting: E(Kt) || E(qt) || Mt.value || Nt.value })), void 0, !0)])) : p("", !0),
1154
- w(t.$slots, "legend", { legend: J.value }, void 0, !0),
1155
- t.$slots.source ? (x(), m("div", {
1156
- key: 6,
1157
- ref_key: "source",
1158
- ref: Et,
1159
- dir: "auto"
1160
- }, [w(t.$slots, "source", {}, void 0, !0)], 512)) : p("", !0),
1161
- g(E(ut), {
1162
- teleportTo: L.value.style.tooltip.teleportTo,
1163
- show: H.value.showTooltip && j.value,
1164
- backgroundColor: L.value.style.tooltip.backgroundColor,
1165
- color: L.value.style.tooltip.color,
1166
- borderRadius: L.value.style.tooltip.borderRadius,
1167
- borderColor: L.value.style.tooltip.borderColor,
1168
- borderWidth: L.value.style.tooltip.borderWidth,
1169
- fontSize: L.value.style.tooltip.fontSize,
1170
- backgroundOpacity: L.value.style.tooltip.backgroundOpacity,
1171
- position: L.value.style.tooltip.position,
1172
- offsetX: L.value.style.tooltip.offsetX,
1173
- offsetY: L.value.style.tooltip.offsetY,
1174
- parent: N.value,
1175
- content: Ct.value,
1176
- isFullscreen: Z.value,
1177
- isCustom: L.value.style.tooltip.customFormat && typeof L.value.style.tooltip.customFormat == "function",
1178
- smooth: L.value.style.tooltip.smooth,
1179
- backdropFilter: L.value.style.tooltip.backdropFilter,
1180
- smoothForce: L.value.style.tooltip.smoothForce,
1181
- smoothSnapThreshold: L.value.style.tooltip.smoothSnapThreshold,
1182
- isA11yMode: I.value === "keyboard",
1183
- a11yPosition: Pt.value
1184
- }, {
1185
- "tooltip-before": O(() => [w(t.$slots, "tooltip-before", y(v({ ...Y.value })), void 0, !0)]),
1186
- tooltip: O(() => [w(t.$slots, "tooltip", y(v({ ...Y.value })), void 0, !0)]),
1187
- "tooltip-after": O(() => [w(t.$slots, "tooltip-after", y(v({ ...Y.value })), void 0, !0)]),
1188
- _: 3
1189
- }, 8, [
1190
- "teleportTo",
1191
- "show",
1192
- "backgroundColor",
1193
- "color",
1194
- "borderRadius",
1195
- "borderColor",
1196
- "borderWidth",
1197
- "fontSize",
1198
- "backgroundOpacity",
1199
- "position",
1200
- "offsetX",
1201
- "offsetY",
1202
- "parent",
1203
- "content",
1204
- "isFullscreen",
1205
- "isCustom",
1206
- "smooth",
1207
- "backdropFilter",
1208
- "smoothForce",
1209
- "smoothSnapThreshold",
1210
- "isA11yMode",
1211
- "a11yPosition"
1212
- ]),
1213
- St.value && L.value.userOptions.buttons.table ? (x(), f(Ne($.value.component), Oe({ key: 7 }, $.value.props, {
1214
- ref_key: "tableUnit",
1215
- ref: P,
1216
- onClose: vn
1217
- }), Ee({
1218
- content: O(() => [(x(), f(E(pt), {
1219
- key: `table_${kt.value}`,
1220
- colNames: X.value.colNames,
1221
- head: X.value.head,
1222
- body: X.value.body,
1223
- config: X.value.config,
1224
- title: L.value.table.useDialog ? "" : $.value.title,
1225
- withCloseButton: !L.value.table.useDialog,
1226
- isCursorPointer: R.value,
1227
- onClose: vn
1228
- }, {
1229
- th: O(({ th: e }) => [De(T(e), 1)]),
1230
- td: O(({ td: e }) => [De(T(e), 1)]),
1231
- _: 1
1232
- }, 8, [
1233
- "colNames",
1234
- "head",
1235
- "body",
1236
- "config",
1237
- "title",
1238
- "withCloseButton",
1239
- "isCursorPointer"
1240
- ]))]),
1241
- _: 2
1242
- }, [L.value.table.useDialog ? {
1243
- name: "title",
1244
- fn: O(() => [De(T($.value.title), 1)]),
1245
- key: "0"
1246
- } : void 0, L.value.table.useDialog ? {
1247
- name: "actions",
1248
- fn: O(() => [h("button", {
1249
- tabindex: "0",
1250
- class: "vue-ui-user-options-button",
1251
- onClick: r[0] ||= (e) => un(L.value.userOptions.callbacks.csv),
1252
- style: b({ cursor: R.value ? "pointer" : "default" })
1253
- }, [g(E(dt), {
1254
- name: "fileCsv",
1255
- stroke: $.value.props.color
1256
- }, null, 8, ["stroke"])], 4)]),
1257
- key: "1"
1258
- } : void 0]), 1040)) : p("", !0),
1259
- w(t.$slots, "skeleton", {}, () => [E(Lt) ? (x(), f(de, { key: 0 })) : p("", !0)], !0)
1260
- ], 46, Re));
1261
- }
1262
- }, [["__scopeId", "data-v-dee20652"]]);
1263
- //#endregion
1264
- export { Le as n, ut as t };