vue-data-ui 3.9.12 → 3.9.13

package/dist/{vue-ui-galaxy-DKkviRQr.js → vue-ui-galaxy-DAi1I2Cr.js}

@@ -1,38 +1,39 @@
-import { defineAsyncComponent as S, ref as n, computed as d, toRefs as Bt, onMounted as Et, watch as Ee, createElementBlock as v, openBlock as r, unref as s, normalizeStyle as R, normalizeClass as W, createBlock as F, createCommentVNode as h, createElementVNode as $, createVNode as le, withCtx as i, renderSlot as c, normalizeProps as p, guardReactiveProps as y, createSlots as Ie, Fragment as Le, renderList as Ne, Teleport as It, toDisplayString as ae, resolveDynamicComponent as Lt, mergeProps as Nt, createTextVNode as Ve, nextTick as Me } from "vue";
-import { c as ze, t as Vt, o as Mt, g as Ge, k as zt, i as Gt, p as U, j as Rt, a6 as Re, l as Wt, aa as Ut, a as We, d as D, X as Ht, x as Ue, u as jt, q as Xt, Z as Yt } from "./lib-W9waxHL3.js";
-import { t as qt, u as Zt } from "./useResponsive-DfdjqQps.js";
-import { u as Jt, a as ne } from "./useNestedProp-D-jUHecl.js";
-import { u as Kt, B as Qt } from "./BaseScanner-BMpwQAfz.js";
-import { u as eo } from "./usePrinter-DhoMn87n.js";
-import { u as to } from "./useSvgExport-ByUukOZt.js";
-import { u as oo } from "./useThemeCheck-DGJ31Vi5.js";
-import { u as lo } from "./useUserOptionState-BIvW1Kz7.js";
-import { u as ao } from "./useChartAccessibility-9icAAmYg.js";
-import no from "./img-BJzUSmkm.js";
-import ro from "./Title-DFtCaCah.js";
-import so from "./Legend-Dxz13z4E.js";
-import { _ as uo } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const He = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", legend: { backgroundColor: "#1A1A1A", color: "#CCCCCC" }, title: { color: "#CCCCCC", subtitle: { color: "#757575" } }, tooltip: { backgroundColor: "#1A1A1A", backgroundOpacity: 70, color: "#CCCCCC", borderColor: "#5A5A5A" } } }, table: { th: { backgroundColor: "#1A1A1A", color: "#CCCCCC" }, td: { backgroundColor: "#1A1A1A", color: "#CCCCCC" } } }, je = { style: { chart: { backgroundColor: "#FFF8E1", color: "#424242", layout: { arcs: { gradient: { show: !1 } } }, legend: { backgroundColor: "#FFF8E1", color: "#424242" }, title: { color: "#424242", subtitle: { color: "#757575" } }, tooltip: { backgroundColor: "#FFECB3", backgroundOpacity: 30, color: "#424242", borderColor: "#FF8A65" } } }, table: { th: { backgroundColor: "#FFF8E1", color: "#424242" }, td: { backgroundColor: "#FFF8E1", color: "#424242" } } }, Xe = { style: { chart: { backgroundColor: "#1E1E1E", color: "#BDBDBD", layout: { arcs: { gradient: { show: !1 } } }, legend: { backgroundColor: "#1E1E1E", color: "#BDBDBD" }, title: { color: "#FFF8E1", subtitle: { color: "#BDBDBD" } }, tooltip: { backgroundColor: "#1E1E1E", backgroundOpacity: 30, color: "#FFF8E1", borderColor: "#FF8A65" } } }, table: { th: { backgroundColor: "#1E1E1E", color: "#BDBDBD" }, td: { backgroundColor: "#1E1E1E", color: "#BDBDBD" } } }, Ye = { style: { chart: { backgroundColor: "#1A1A1A", color: "#99AA99", layout: { arcs: { gradient: { color: "#1A1A1A" } } }, legend: { backgroundColor: "#1A1A1A", color: "#99AA99" }, title: { color: "#66CC66", subtitle: { color: "#99AA99" } }, tooltip: { backgroundColor: "#2A2F2A", color: "#AACCAA", borderColor: "#66CC66" } } }, table: { th: { backgroundColor: "#1A1A1A", color: "#99AA99" }, td: { backgroundColor: "#1A1A1A", color: "#AACCAA" } } }, qe = { style: { chart: { backgroundColor: "#fbfafa", color: "#8A9892", layout: { arcs: { gradient: { color: "#fbfafa" } } }, legend: { backgroundColor: "#fbfafa", color: "#99AA99" }, title: { color: "#8A9892", subtitle: { color: "#99AA99" } }, tooltip: { backgroundColor: "#fbfafa", color: "#8A9892" } } }, table: { th: { backgroundColor: "#fbfafa", color: "#8F837A" }, td: { backgroundColor: "#fbfafa", color: "#8F837A" } } }, Ze = { style: { chart: { backgroundColor: "#f6f6fb", color: "#50606C", layout: { arcs: { gradient: { show: !1 } } }, legend: { backgroundColor: "#f6f6fb", color: "#61747E" }, title: { color: "#50606C", subtitle: { color: "#718890" } }, tooltip: { backgroundColor: "#f6f6fb", color: "#50606C" } } }, table: { th: { backgroundColor: "#f6f6fb", color: "#50606C" }, td: { backgroundColor: "#f6f6fb", color: "#50606C" } } }, Je = {
+import { defineAsyncComponent as S, ref as n, computed as d, toRefs as It, onMounted as Lt, watch as Le, createElementBlock as g, openBlock as r, unref as s, normalizeStyle as W, normalizeClass as U, createBlock as F, createCommentVNode as h, createElementVNode as $, createVNode as ae, withCtx as i, renderSlot as c, normalizeProps as p, guardReactiveProps as y, createSlots as Ne, Fragment as Ve, renderList as Me, Teleport as Nt, toDisplayString as ne, resolveDynamicComponent as Vt, mergeProps as Mt, createTextVNode as ze, nextTick as Ge } from "vue";
+import { c as Re, t as zt, o as Gt, g as We, l as Rt, i as Wt, j as H, k as Ut, a7 as Ue, m as Ht, ab as jt, a as He, d as P, X as Xt, y as je, v as Yt, r as qt, _ as Jt } from "./lib-BwysEpWI.js";
+import { b as Kt } from "./labelUtils-PMU3ZGCb.js";
+import { t as Qt, u as Zt } from "./useResponsive-DfdjqQps.js";
+import { u as eo, a as re } from "./useNestedProp--5lL-kf1.js";
+import { u as to, B as oo } from "./BaseScanner-BMpwQAfz.js";
+import { u as lo } from "./usePrinter-BJzHDpYF.js";
+import { u as ao } from "./useSvgExport-ByUukOZt.js";
+import { u as no } from "./useThemeCheck-DGJ31Vi5.js";
+import { u as ro } from "./useUserOptionState-BIvW1Kz7.js";
+import { u as so } from "./useChartAccessibility-9icAAmYg.js";
+import uo from "./img-DKigoPDs.js";
+import io from "./Title-BhURirpm.js";
+import co from "./Legend-D6z73edh.js";
+import { _ as vo } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const Xe = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", legend: { backgroundColor: "#1A1A1A", color: "#CCCCCC" }, title: { color: "#CCCCCC", subtitle: { color: "#757575" } }, tooltip: { backgroundColor: "#1A1A1A", backgroundOpacity: 70, color: "#CCCCCC", borderColor: "#5A5A5A" } } }, table: { th: { backgroundColor: "#1A1A1A", color: "#CCCCCC" }, td: { backgroundColor: "#1A1A1A", color: "#CCCCCC" } } }, Ye = { style: { chart: { backgroundColor: "#FFF8E1", color: "#424242", layout: { arcs: { gradient: { show: !1 } } }, legend: { backgroundColor: "#FFF8E1", color: "#424242" }, title: { color: "#424242", subtitle: { color: "#757575" } }, tooltip: { backgroundColor: "#FFECB3", backgroundOpacity: 30, color: "#424242", borderColor: "#FF8A65" } } }, table: { th: { backgroundColor: "#FFF8E1", color: "#424242" }, td: { backgroundColor: "#FFF8E1", color: "#424242" } } }, qe = { style: { chart: { backgroundColor: "#1E1E1E", color: "#BDBDBD", layout: { arcs: { gradient: { show: !1 } } }, legend: { backgroundColor: "#1E1E1E", color: "#BDBDBD" }, title: { color: "#FFF8E1", subtitle: { color: "#BDBDBD" } }, tooltip: { backgroundColor: "#1E1E1E", backgroundOpacity: 30, color: "#FFF8E1", borderColor: "#FF8A65" } } }, table: { th: { backgroundColor: "#1E1E1E", color: "#BDBDBD" }, td: { backgroundColor: "#1E1E1E", color: "#BDBDBD" } } }, Je = { style: { chart: { backgroundColor: "#1A1A1A", color: "#99AA99", layout: { arcs: { gradient: { color: "#1A1A1A" } } }, legend: { backgroundColor: "#1A1A1A", color: "#99AA99" }, title: { color: "#66CC66", subtitle: { color: "#99AA99" } }, tooltip: { backgroundColor: "#2A2F2A", color: "#AACCAA", borderColor: "#66CC66" } } }, table: { th: { backgroundColor: "#1A1A1A", color: "#99AA99" }, td: { backgroundColor: "#1A1A1A", color: "#AACCAA" } } }, Ke = { style: { chart: { backgroundColor: "#fbfafa", color: "#8A9892", layout: { arcs: { gradient: { color: "#fbfafa" } } }, legend: { backgroundColor: "#fbfafa", color: "#99AA99" }, title: { color: "#8A9892", subtitle: { color: "#99AA99" } }, tooltip: { backgroundColor: "#fbfafa", color: "#8A9892" } } }, table: { th: { backgroundColor: "#fbfafa", color: "#8F837A" }, td: { backgroundColor: "#fbfafa", color: "#8F837A" } } }, Qe = { style: { chart: { backgroundColor: "#f6f6fb", color: "#50606C", layout: { arcs: { gradient: { show: !1 } } }, legend: { backgroundColor: "#f6f6fb", color: "#61747E" }, title: { color: "#50606C", subtitle: { color: "#718890" } }, tooltip: { backgroundColor: "#f6f6fb", color: "#50606C" } } }, table: { th: { backgroundColor: "#f6f6fb", color: "#50606C" }, td: { backgroundColor: "#f6f6fb", color: "#50606C" } } }, Ze = {
   default: {},
-  dark: He,
-  celebration: je,
-  celebrationNight: Xe,
-  hack: Ye,
-  zen: qe,
-  concrete: Ze
-}, Go = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  dark: Xe,
+  celebration: Ye,
+  celebrationNight: qe,
+  hack: Je,
+  zen: Ke,
+  concrete: Qe
+}, Ho = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
-  celebration: je,
-  celebrationNight: Xe,
-  concrete: Ze,
-  dark: He,
-  default: Je,
-  hack: Ye,
-  zen: qe
-}, Symbol.toStringTag, { value: "Module" })), io = ["id"], co = ["id"], vo = ["xmlns", "viewBox"], ho = ["width", "height"], go = ["id"], fo = ["stdDeviation"], bo = ["d", "stroke", "stroke-width"], po = ["d", "stroke", "stroke-width"], yo = ["filter"], mo = ["d", "stroke", "stroke-width"], Co = ["d", "stroke-width", "onMouseenter", "onMouseleave", "onClick"], ko = {
+  celebration: Ye,
+  celebrationNight: qe,
+  concrete: Qe,
+  dark: Xe,
+  default: Ze,
+  hack: Je,
+  zen: Ke
+}, Symbol.toStringTag, { value: "Module" })), go = ["id"], ho = ["id"], fo = ["xmlns", "viewBox"], bo = ["width", "height"], po = ["id"], yo = ["stdDeviation"], mo = ["d", "stroke", "stroke-width"], Co = ["d", "stroke", "stroke-width"], ko = ["filter"], wo = ["d", "stroke", "stroke-width"], Ao = ["d", "stroke-width", "onMouseenter", "onMouseleave", "onClick"], $o = {
   key: 4,
   class: "vue-data-ui-watermark"
-}, wo = ["id"], Ao = ["onClick"], $o = ["innerHTML"], To = {
+}, To = ["id"], xo = ["onClick"], So = ["innerHTML"], Fo = {
   __name: "vue-ui-galaxy",
   props: {
     config: {
@@ -49,14 +50,14 @@ const He = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", leg
     }
   },
   emits: ["selectLegend", "selectDatapoint"],
-  setup(Ke, { expose: Qe, emit: et }) {
-    const tt = S(() => import("./Tooltip-B79qvriT.js")), ot = S(() => import("./BaseIcon-r3_sTK1A.js")), lt = S(() => import("./vue-ui-accordion-B6BX2vhq.js")), at = S(() => import("./DataTable-DNeCys3I.js")), nt = S(() => import("./PenAndPaper-CsqBamFZ.js")), rt = S(() => import("./UserOptions-B-2A_KRb.js")), st = S(() => import("./PackageVersion-BpArR90N.js")), ut = S(() => import("./BaseDraggableDialog-C167SnU0.js")), { vue_ui_galaxy: it } = Jt(), { isThemeValid: ct, warnInvalidTheme: dt } = oo(), m = Ke, C = n(ze()), k = n(null), H = n(!1), j = n(""), O = n(null), re = n(0), se = n(0), ue = n(0), ie = n(0), ce = n(null), de = n(null), ve = n(null), he = n(null), _ = n(null), N = n(null), ge = n(!1), B = n(null), X = n(null), fe = d(() => !!m.dataset && m.dataset.length), e = n(J()), { loading: Y, FINAL_DATASET: be } = Kt({
-      ...Bt(m),
+  setup(et, { expose: tt, emit: ot }) {
+    const lt = S(() => import("./Tooltip-TDyKgLB6.js")), at = S(() => import("./BaseIcon-4i3dd7Ty.js")), nt = S(() => import("./vue-ui-accordion-tQNKwbVi.js")), rt = S(() => import("./DataTable-WrXCJkfE.js")), st = S(() => import("./PenAndPaper-DxIUvoQ8.js")), ut = S(() => import("./UserOptions-CzJWRC4s.js")), it = S(() => import("./PackageVersion-D3cMhAlf.js")), ct = S(() => import("./BaseDraggableDialog-CAJxIF6g.js")), { vue_ui_galaxy: dt } = eo(), { isThemeValid: vt, warnInvalidTheme: gt } = no(), m = et, C = n(Re()), k = n(null), j = n(!1), X = n(""), D = n(null), se = n(0), ue = n(0), ie = n(0), ce = n(0), de = n(null), ve = n(null), ge = n(null), he = n(null), _ = n(null), V = n(null), fe = n(!1), B = n(null), Y = n(null), be = d(() => !!m.dataset && m.dataset.length), e = n(Q()), { loading: q, FINAL_DATASET: pe } = to({
+      ...It(m),
       FINAL_CONFIG: e,
-      prepareConfig: J,
+      prepareConfig: Q,
       callback: () => {
         Promise.resolve().then(async () => {
-          await Me(), f.value.showTable = e.value.table.show;
+          await Ge(), f.value.showTable = e.value.table.show;
         });
       },
       skeletonDataset: [
@@ -64,7 +65,7 @@ const He = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", leg
         { name: "_", values: [13], color: "#C4C4C4" },
         { name: "_", values: [8], color: "#ADADAD" }
       ],
-      skeletonConfig: Vt({
+      skeletonConfig: zt({
         defaultConfig: e.value,
         userConfig: {
           userOptions: { show: !1 },
@@ -81,125 +82,125 @@ const He = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", leg
         }
       })
     });
-    Et(() => {
-      ge.value = !0, ye();
+    Lt(() => {
+      fe.value = !0, me();
     });
-    const pe = d(() => !!e.value.debug);
-    function ye() {
-      if (Mt(m.dataset) ? Ge({
+    const ye = d(() => !!e.value.debug);
+    function me() {
+      if (Gt(m.dataset) ? We({
         componentName: "VueUiGalaxy",
         type: "dataset",
-        debug: pe.value
+        debug: ye.value
       }) : m.dataset.forEach((t, l) => {
-        zt({
+        Rt({
           datasetObject: t,
           requiredAttributes: ["name", "values"]
         }).forEach((o) => {
-          Ge({
+          We({
             componentName: "VueUiGalaxy",
             type: "datasetSerieAttribute",
             property: o,
             index: l,
-            debug: pe.value
+            debug: ye.value
           });
         });
       }), e.value.responsive) {
-        const t = qt(() => {
+        const t = Qt(() => {
           const { width: l, height: o } = Zt({
             chart: k.value,
-            title: e.value.style.chart.title.text ? ce.value : null,
-            legend: e.value.style.chart.legend.show ? de.value : null,
+            title: e.value.style.chart.title.text ? de.value : null,
+            legend: e.value.style.chart.legend.show ? ve.value : null,
             noTitle: he.value,
-            source: ve.value
+            source: ge.value
           });
           requestAnimationFrame(() => {
-            V.value = Math.max(0.1, l), M.value = Math.max(0.1, o - 12);
+            M.value = Math.max(0.1, l), z.value = Math.max(0.1, o - 12);
           });
         });
-        _.value && (N.value && _.value.unobserve(N.value), _.value.disconnect()), _.value = new ResizeObserver(t), N.value = k.value.parentNode, _.value.observe(N.value);
+        _.value && (V.value && _.value.unobserve(V.value), _.value.disconnect()), _.value = new ResizeObserver(t), V.value = k.value.parentNode, _.value.observe(V.value);
       }
     }
-    const { userOptionsVisible: q, setUserOptionsVisibility: me, keepUserOptionState: Ce } = lo({ config: e.value }), { svgRef: Z } = ao({ config: e.value.style.chart.title });
-    function J() {
-      const t = ne({
+    const { userOptionsVisible: J, setUserOptionsVisibility: Ce, keepUserOptionState: ke } = ro({ config: e.value }), { svgRef: K } = so({ config: e.value.style.chart.title });
+    function Q() {
+      const t = re({
         userConfig: m.config,
-        defaultConfig: it
+        defaultConfig: dt
       }), l = t.theme;
       if (!l) return t;
-      if (!ct.value(t))
-        return dt(t), t;
-      const o = ne({
-        userConfig: Je[l] || m.config,
+      if (!vt.value(t))
+        return gt(t), t;
+      const o = re({
+        userConfig: Ze[l] || m.config,
         defaultConfig: t
-      }), a = ne({
+      }), a = re({
         userConfig: m.config,
         defaultConfig: o
       });
       return {
         ...a,
-        customPalette: a.customPalette.length ? a.customPalette : Gt[l] || U
+        customPalette: a.customPalette.length ? a.customPalette : Wt[l] || H
       };
     }
-    Ee(() => m.config, (t) => {
-      e.value = J(), q.value = !e.value.userOptions.showOnChartHover, ye(), se.value += 1, ue.value += 1, ie.value += 1, f.value.dataLabels.show = e.value.style.chart.layout.labels.dataLabels.show, f.value.showTable = e.value.table.show, f.value.showTooltip = e.value.style.chart.tooltip.show;
+    Le(() => m.config, (t) => {
+      e.value = Q(), J.value = !e.value.userOptions.showOnChartHover, me(), ue.value += 1, ie.value += 1, ce.value += 1, f.value.dataLabels.show = e.value.style.chart.layout.labels.dataLabels.show, f.value.showTable = e.value.table.show, f.value.showTooltip = e.value.style.chart.tooltip.show;
     }, { deep: !0 });
-    const { isPrinting: ke, isImaging: we, generatePdf: Ae, generateImage: $e } = eo({
+    const { isPrinting: we, isImaging: Ae, generatePdf: $e, generateImage: Te } = lo({
       elementId: `galaxy_${C.value}`,
       fileName: e.value.style.chart.title.text || "vue-ui-galaxy",
       options: e.value.userOptions.print
-    }), vt = d(() => e.value.userOptions.show && !e.value.style.chart.title.text), ht = d(() => Rt(e.value.customPalette)), f = n({
+    }), ht = d(() => e.value.userOptions.show && !e.value.style.chart.title.text), ft = d(() => Ut(e.value.customPalette)), f = n({
       dataLabels: {
         show: e.value.style.chart.layout.labels.dataLabels.show
       },
       showTable: e.value.table.show,
       showTooltip: e.value.style.chart.tooltip.show
-    }), V = n(250), M = n(180), gt = n(0), ft = n(0), T = d(() => ({
-      width: V.value,
-      height: M.value,
-      viewBox: `${gt.value} ${ft.value} ${V.value} ${M.value}`
-    })), Te = et, b = n([]);
+    }), M = n(250), z = n(180), bt = n(0), pt = n(0), T = d(() => ({
+      width: M.value,
+      height: z.value,
+      viewBox: `${bt.value} ${pt.value} ${M.value} ${z.value}`
+    })), xe = ot, b = n([]);
     function E(t) {
-      b.value.includes(t.id) ? b.value = b.value.filter((l) => l !== t.id) : b.value.push(t.id), Te("selectLegend", I.value.map((l) => ({
+      b.value.includes(t.id) ? b.value = b.value.filter((l) => l !== t.id) : b.value.push(t.id), xe("selectLegend", I.value.map((l) => ({
         name: l.name,
         color: l.color,
         value: l.value
       })));
     }
-    function xe(t) {
+    function Se(t) {
       if (!w.value.length)
         return e.value.debug && console.warn("VueUiGalaxy - There are no series to show."), null;
       const l = w.value.find((o) => o.name === t);
       return l || (e.value.debug && console.warn(`VueUiGalaxy - Series name not found "${t}"`), null);
     }
-    function bt(t) {
-      const l = xe(t);
+    function yt(t) {
+      const l = Se(t);
       l !== null && b.value.includes(l.id) && E({ id: l.id });
     }
-    function pt(t) {
-      const l = xe(t);
+    function mt(t) {
+      const l = Se(t);
       l !== null && (b.value.includes(l.id) || E({ id: l.id }));
     }
-    const w = d(() => be.value.map((t, l) => ({
+    const w = d(() => pe.value.map((t, l) => ({
       name: t.name,
-      color: Wt(t.color) || ht.value[l] || U[l] || U[l % U.length],
-      value: t.values ? Re(t.values).reduce((o, a) => o + a, 0) : 0,
-      absoluteValues: Re(t.values),
-      id: ze()
+      color: Ht(t.color) || ft.value[l] || H[l] || H[l % H.length],
+      value: t.values ? Ue(t.values).reduce((o, a) => o + a, 0) : 0,
+      absoluteValues: Ue(t.values),
+      id: Re()
     })).sort((t, l) => l.value - t.value).map((t, l) => ({
       ...t,
       absoluteIndex: l
     })));
-    function yt() {
+    function Ct() {
       return w.value.map((t) => ({
         name: t.name,
         color: t.color,
         value: t.value
       }));
     }
-    const A = d(() => w.value.filter((t) => !b.value.includes(t.id)).map((t) => t.value).reduce((t, l) => t + l, 0)), Se = n(190), Fe = d(() => w.value.filter((t) => !b.value.includes(t.id))), mt = d(
+    const A = d(() => w.value.filter((t) => !b.value.includes(t.id)).map((t) => t.value).reduce((t, l) => t + l, 0)), Fe = n(190), De = d(() => w.value.filter((t) => !b.value.includes(t.id))), kt = d(
       () => (e.value.style.chart.layout.arcs.strokeWidth + e.value.style.chart.layout.arcs.borderWidth) / 2 + (e.value.style.chart.layout.padding ?? 12)
-    ), Ct = d(() => Ut({
-      maxPoints: Se.value,
+    ), wt = d(() => jt({
+      maxPoints: Fe.value,
       a: e.value.style.chart.layout.arcs.a ?? 6,
       b: e.value.style.chart.layout.arcs.b ?? 6,
       angleStep: e.value.style.chart.layout.arcs.angleStep ?? 0.07,
@@ -207,93 +208,117 @@ const He = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", leg
       startY: T.value.height / 2 + e.value.style.chart.layout.arcs.offsetY,
       boxWidth: T.value.width,
       boxHeight: T.value.height,
-      padding: mt.value
+      padding: kt.value
     })), I = d(() => {
       const t = [];
-      for (let l = 0; l < Fe.value.length; l += 1) {
-        const o = Fe.value[l], a = o.value / A.value * Se.value + (l > 0 && t.length ? t[l - 1].points : 0);
+      for (let l = 0; l < De.value.length; l += 1) {
+        const o = De.value[l], a = o.value / A.value * Fe.value + (l > 0 && t.length ? t[l - 1].points : 0);
         t.push({
           points: a,
           ...o,
           seriesIndex: l,
           proportion: o.value / A.value,
-          path: Ct.value(a)
+          path: wt.value(a)
         });
       }
       return t.filter((l) => !b.value.includes(l.id)).toSorted((l, o) => o.points - l.points);
     });
-    function K(t) {
-      const l = Math.min(V.value, M.value), o = O.value === t.id && e.value.style.chart.layout.arcs.hoverEffect.show ? e.value.style.chart.layout.arcs.hoverEffect.multiplicator : 1, a = (e.value.style.chart.layout.arcs.strokeWidth + e.value.style.chart.layout.arcs.borderWidth) * o, u = e.value.style.chart.layout.arcs.strokeWidth * o, g = e.value.style.chart.layout.arcs.strokeWidth / 2 * o;
+    function Z(t) {
+      const l = Math.min(M.value, z.value), o = D.value === t.id && e.value.style.chart.layout.arcs.hoverEffect.show ? e.value.style.chart.layout.arcs.hoverEffect.multiplicator : 1, a = (e.value.style.chart.layout.arcs.strokeWidth + e.value.style.chart.layout.arcs.borderWidth) * o, u = e.value.style.chart.layout.arcs.strokeWidth * o, v = e.value.style.chart.layout.arcs.strokeWidth / 2 * o;
       return {
         border: a / 180 * l,
         path: u / 180 * l,
-        blur: g / 180 * l
+        blur: v / 180 * l
       };
     }
-    const P = n(!1);
-    function De(t) {
-      P.value = t, re.value += 1;
+    const O = n(!1);
+    function Oe(t) {
+      O.value = t, se.value += 1;
     }
-    const Q = n(null);
-    function kt(t) {
-      H.value = !1, O.value = null, e.value.events.datapointLeave && e.value.events.datapointLeave({ datapoint: t, seriesIndex: t.absoluteIndex });
+    const ee = n(null);
+    function At(t) {
+      j.value = !1, D.value = null, e.value.events.datapointLeave && e.value.events.datapointLeave({ datapoint: t, seriesIndex: t.absoluteIndex });
     }
-    function wt(t) {
-      Te("selectDatapoint", t), e.value.events.datapointClick && e.value.events.datapointClick({ datapoint: t, seriesIndex: t.absoluteIndex });
+    function $t(t) {
+      xe("selectDatapoint", t), e.value.events.datapointClick && e.value.events.datapointClick({ datapoint: t, seriesIndex: t.absoluteIndex });
     }
-    function At({ datapoint: t, _relativeIndex: l, seriesIndex: o, show: a = !1 }) {
-      e.value.events.datapointEnter && e.value.events.datapointEnter({ datapoint: t, seriesIndex: t.absoluteIndex }), Q.value = {
+    function Pe({
+      val: t,
+      percentage: l,
+      showVal: o,
+      showPercentage: a
+    }) {
+      const u = e.value.style.chart.layout.labels.dataLabels;
+      return Kt({
+        config: u,
+        val: t,
+        percentage: l,
+        showVal: o,
+        showPercentage: a
+      });
+    }
+    function Tt({ datapoint: t, _relativeIndex: l, seriesIndex: o, show: a = !1 }) {
+      e.value.events.datapointEnter && e.value.events.datapointEnter({ datapoint: t, seriesIndex: t.absoluteIndex }), ee.value = {
         datapoint: t,
         seriesIndex: o,
         series: w.value,
         config: e.value
-      }, H.value = a, O.value = t.id;
+      }, j.value = a, D.value = t.id;
       let u = "";
-      const g = e.value.style.chart.tooltip.customFormat;
-      Ue(g) && Yt(() => g({
+      const v = e.value.style.chart.tooltip.customFormat;
+      je(v) && Jt(() => v({
         seriesIndex: o,
         datapoint: t,
         series: w.value,
         config: e.value
-      })) ? j.value = g({
+      })) ? X.value = v({
         seriesIndex: o,
         datapoint: t,
         series: w.value,
         config: e.value
-      }) : (u += `<div style="width:100%;text-align:center;border-bottom:1px solid ${e.value.style.chart.tooltip.borderColor};padding-bottom:6px;margin-bottom:3px;">${t.name}</div>`, u += `<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="${t.color}"/></svg>`, e.value.style.chart.tooltip.showValue && (u += `<b>${We(
-        e.value.style.chart.layout.labels.dataLabels.formatter,
-        t.value,
-        D({
-          p: e.value.style.chart.layout.labels.dataLabels.prefix,
-          v: t.value,
-          s: e.value.style.chart.layout.labels.dataLabels.suffix,
-          r: e.value.style.chart.tooltip.roundingValue
-        }),
-        { datapoint: t, seriesIndex: o }
-      )}</b>`), e.value.style.chart.tooltip.showPercentage && (e.value.style.chart.tooltip.showValue ? u += `<span>(${D({
-        v: t.proportion * 100,
-        s: "%",
-        r: e.value.style.chart.tooltip.roundingPercentage
-      })})</span></div>` : u += `<b>${D({
-        v: t.proportion * 100,
-        s: "%",
-        r: e.value.style.chart.tooltip.roundingPercentage
-      })}</b></div>`), j.value = `<div>${u}</div>`);
+      }) : (u += `<div style="width:100%;text-align:center;border-bottom:1px solid ${e.value.style.chart.tooltip.borderColor};padding-bottom:6px;margin-bottom:3px;">${t.name}</div>`, u += `<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="${t.color}"/></svg>`, u += `<b>${Pe({
+        showVal: e.value.style.chart.tooltip.showValue,
+        showPercentage: e.value.style.chart.tooltip.showPercentage,
+        val: He(
+          e.value.style.chart.layout.labels.dataLabels.formatter,
+          t.value,
+          P({
+            p: e.value.style.chart.layout.labels.dataLabels.prefix,
+            v: t.value,
+            s: e.value.style.chart.layout.labels.dataLabels.suffix,
+            r: e.value.style.chart.tooltip.roundingValue
+          }),
+          { datapoint: t, seriesIndex: o }
+        ),
+        percentage: P({
+          v: t.proportion * 100,
+          s: "%",
+          r: e.value.style.chart.tooltip.roundingPercentage
+        })
+      })}</b></div>`, X.value = `<div>${u}</div>`);
     }
-    const ee = d(() => w.value.map((t, l) => ({
-      ...t,
-      proportion: (t.value || 0) / be.value.map((o) => (o.values || []).reduce((a, u) => a + u, 0)).reduce((o, a) => o + a, 0),
-      opacity: b.value.includes(t.id) ? 0.5 : 1,
-      shape: t.shape || "circle",
-      segregate: () => E(t),
-      isSegregated: b.value.includes(t.id),
-      display: `${t.name}${e.value.style.chart.legend.showPercentage || e.value.style.chart.legend.showValue ? ": " : ""}${e.value.style.chart.legend.showValue ? We(e.value.style.chart.layout.labels.dataLabels.formatter, t.value, D({
+    const te = d(() => w.value.map((t, l) => {
+      const o = He(e.value.style.chart.layout.labels.dataLabels.formatter, t.value, P({
         p: e.value.style.chart.layout.labels.dataLabels.prefix,
         v: t.value,
         s: e.value.style.chart.layout.labels.dataLabels.suffix,
         r: e.value.style.chart.legend.roundingValue
-      }), { datapoint: t, index: l }) : ""}${e.value.style.chart.legend.showPercentage ? b.value.includes(t.id) ? `${e.value.style.chart.legend.showValue ? " (" : ""}- %${e.value.style.chart.legend.showValue ? ")" : ""}` : `${e.value.style.chart.legend.showValue ? " (" : ""}${isNaN(t.value / A.value) ? "-" : D({ v: t.value / A.value * 100, s: "%", r: e.value.style.chart.legend.roundingPercentage })}${e.value.style.chart.legend.showValue ? ")" : ""}` : ""}`
-    }))), $t = d(() => ({
+      }), { datapoint: t, index: l }), a = isNaN(t.value / A.value) || b.value.includes(t.id) ? "-" : P({ v: t.value / A.value * 100, s: "%", r: e.value.style.chart.legend.roundingPercentage }), u = Pe({
+        showVal: e.value.style.chart.legend.showValue,
+        showPercentage: e.value.style.chart.legend.showPercentage,
+        val: o,
+        percentage: a
+      });
+      return {
+        ...t,
+        proportion: (t.value || 0) / pe.value.map((v) => (v.values || []).reduce((N, Et) => N + Et, 0)).reduce((v, N) => v + N, 0),
+        opacity: b.value.includes(t.id) ? 0.5 : 1,
+        shape: t.shape || "circle",
+        segregate: () => E(t),
+        isSegregated: b.value.includes(t.id),
+        display: `${t.name}${e.value.style.chart.legend.showPercentage || e.value.style.chart.legend.showValue ? ": " : ""}${u}`
+      };
+    })), xt = d(() => ({
       cy: "galaxy-div-legend",
       backgroundColor: e.value.style.chart.legend.backgroundColor,
       color: e.value.style.chart.legend.color,
@@ -307,29 +332,29 @@ const He = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", leg
       })), l = I.value.map((o) => o.value);
       return { head: t, body: l };
     });
-    function te(t = null) {
-      Me(() => {
-        const l = x.value.head.map((u, g) => [[
+    function oe(t = null) {
+      Ge(() => {
+        const l = x.value.head.map((u, v) => [[
           u.name
-        ], [x.value.body[g]], [isNaN(x.value.body[g] / A.value) ? "-" : x.value.body[g] / A.value * 100]]), o = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [[""], ["val"], ["%"]]].concat(l), a = jt(o);
-        t ? t(a) : Xt({ csvContent: a, title: e.value.style.chart.title.text || "vue-ui-galaxy" });
+        ], [x.value.body[v]], [isNaN(x.value.body[v] / A.value) ? "-" : x.value.body[v] / A.value * 100]]), o = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [[""], ["val"], ["%"]]].concat(l), a = Yt(o);
+        t ? t(a) : qt({ csvContent: a, title: e.value.style.chart.title.text || "vue-ui-galaxy" });
       });
     }
-    const z = d(() => {
+    const G = d(() => {
       const t = [
         ' <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M18 16v2a1 1 0 0 1 -1 1h-11l6 -7l-6 -7h11a1 1 0 0 1 1 1v2" /></svg>',
-        D({ p: e.value.style.chart.layout.labels.dataLabels.prefix, v: A.value, s: e.value.style.chart.layout.labels.dataLabels.suffix, r: e.value.table.td.roundingValue }),
+        P({ p: e.value.style.chart.layout.labels.dataLabels.prefix, v: A.value, s: e.value.style.chart.layout.labels.dataLabels.suffix, r: e.value.table.td.roundingValue }),
         "100%"
-      ], l = x.value.head.map((u, g) => {
-        const _t = D({ p: e.value.style.chart.layout.labels.dataLabels.prefix, v: x.value.body[g], s: e.value.style.chart.layout.labels.dataLabels.suffix, r: e.value.table.td.roundingValue });
+      ], l = x.value.head.map((u, v) => {
+        const N = P({ p: e.value.style.chart.layout.labels.dataLabels.prefix, v: x.value.body[v], s: e.value.style.chart.layout.labels.dataLabels.suffix, r: e.value.table.td.roundingValue });
         return [
           {
             color: u.color,
             name: u.name
           },
-          _t,
-          isNaN(x.value.body[g] / A.value) ? "-" : D({
-            v: x.value.body[g] / A.value * 100,
+          N,
+          isNaN(x.value.body[v] / A.value) ? "-" : P({
+            v: x.value.body[v] / A.value * 100,
             s: "%",
             r: e.value.table.td.roundingPercentage
           })
@@ -358,22 +383,22 @@ const He = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", leg
         config: o
       };
     });
-    function Oe() {
+    function _e() {
       f.value.showTable = !f.value.showTable;
     }
-    function Pe() {
+    function Be() {
       f.value.showTooltip = !f.value.showTooltip;
     }
-    const G = n(!1);
-    function oe() {
-      G.value = !G.value;
+    const R = n(!1);
+    function le() {
+      R.value = !R.value;
     }
-    async function Tt({ scale: t = 2 } = {}) {
+    async function St({ scale: t = 2 } = {}) {
       if (!k.value) return;
-      const { width: l, height: o } = k.value.getBoundingClientRect(), a = l / o, { imageUri: u, base64: g } = await no({ domElement: k.value, base64: !0, img: !0, scale: t });
+      const { width: l, height: o } = k.value.getBoundingClientRect(), a = l / o, { imageUri: u, base64: v } = await uo({ domElement: k.value, base64: !0, img: !0, scale: t });
       return {
         imageUri: u,
-        base64: g,
+        base64: v,
         title: e.value.style.chart.title.text,
         width: l,
         height: o,
@@ -383,14 +408,14 @@ const He = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", leg
     const L = d(() => {
       const t = e.value.table.useDialog && !e.value.table.show, l = f.value.showTable;
       return {
-        component: t ? ut : lt,
+        component: t ? ct : nt,
         title: `${e.value.style.chart.title.text}${e.value.style.chart.title.subtitle.text ? `: ${e.value.style.chart.title.subtitle.text}` : ""}`,
         props: t ? {
           backgroundColor: e.value.table.th.backgroundColor,
           color: e.value.table.th.color,
           headerColor: e.value.table.th.color,
           headerBg: e.value.table.th.backgroundColor,
-          isFullscreen: P.value,
+          isFullscreen: O.value,
           fullscreenParent: k.value,
           forcedWidth: Math.min(500, window.innerWidth * 0.8)
         } : {
@@ -410,58 +435,58 @@ const He = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", leg
         }
       };
     });
-    Ee(() => f.value.showTable, (t) => {
+    Le(() => f.value.showTable, (t) => {
       e.value.table.show || (t && e.value.table.useDialog && B.value ? B.value.open() : "close" in B.value && B.value.close());
     });
-    function _e() {
-      f.value.showTable = !1, X.value && X.value.setTableIconState(!1);
+    function Ee() {
+      f.value.showTable = !1, Y.value && Y.value.setTableIconState(!1);
     }
-    const xt = d(() => ee.value.map((t) => ({
+    const Ft = d(() => te.value.map((t) => ({
       ...t,
       name: t.display
-    }))), St = d(() => e.value.style.chart.backgroundColor), Ft = d(() => e.value.style.chart.legend), Dt = d(() => e.value.style.chart.title), { exportSvg: Ot, getSvg: Pt } = to({
-      svg: Z,
-      title: Dt,
-      legend: Ft,
-      legendItems: xt,
-      backgroundColor: St
+    }))), Dt = d(() => e.value.style.chart.backgroundColor), Ot = d(() => e.value.style.chart.legend), Pt = d(() => e.value.style.chart.title), { exportSvg: _t, getSvg: Bt } = ao({
+      svg: K,
+      title: Pt,
+      legend: Ot,
+      legendItems: Ft,
+      backgroundColor: Dt
     });
-    async function Be({ isCb: t }) {
+    async function Ie({ isCb: t }) {
       if (t) {
-        const { blob: l, url: o, text: a, dataUrl: u } = await Pt();
+        const { blob: l, url: o, text: a, dataUrl: u } = await Bt();
         e.value.userOptions.callbacks.svg({ blob: l, url: o, text: a, dataUrl: u });
       } else
-        Ot();
+        _t();
     }
-    return Qe({
-      getData: yt,
-      getImage: Tt,
-      generatePdf: Ae,
-      generateCsv: te,
-      generateImage: $e,
-      generateSvg: Be,
-      hideSeries: pt,
-      showSeries: bt,
-      toggleTable: Oe,
-      toggleTooltip: Pe,
-      toggleAnnotator: oe,
-      toggleFullscreen: De
-    }), (t, l) => (r(), v("div", {
+    return tt({
+      getData: Ct,
+      getImage: St,
+      generatePdf: $e,
+      generateCsv: oe,
+      generateImage: Te,
+      generateSvg: Ie,
+      hideSeries: mt,
+      showSeries: yt,
+      toggleTable: _e,
+      toggleTooltip: Be,
+      toggleAnnotator: le,
+      toggleFullscreen: Oe
+    }), (t, l) => (r(), g("div", {
       ref_key: "galaxyChart",
       ref: k,
-      class: W(`vue-data-ui-component vue-ui-galaxy ${P.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"} ${s(Y) ? "loading" : ""}`),
-      style: R(`font-family:${e.value.style.fontFamily};width:100%; text-align:center;${e.value.style.chart.title.text ? "" : "padding-top:36px"};background:${e.value.style.chart.backgroundColor}`),
+      class: U(`vue-data-ui-component vue-ui-galaxy ${O.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"} ${s(q) ? "loading" : ""}`),
+      style: W(`font-family:${e.value.style.fontFamily};width:100%; text-align:center;${e.value.style.chart.title.text ? "" : "padding-top:36px"};background:${e.value.style.chart.backgroundColor}`),
       id: `galaxy_${C.value}`,
-      onMouseenter: l[2] || (l[2] = () => s(me)(!0)),
-      onMouseleave: l[3] || (l[3] = () => s(me)(!1))
+      onMouseenter: l[2] || (l[2] = () => s(Ce)(!0)),
+      onMouseleave: l[3] || (l[3] = () => s(Ce)(!1))
     }, [
-      e.value.userOptions.buttons.annotator ? (r(), F(s(nt), {
+      e.value.userOptions.buttons.annotator ? (r(), F(s(st), {
         key: 0,
-        svgRef: s(Z),
+        svgRef: s(K),
         backgroundColor: e.value.style.chart.backgroundColor,
         color: e.value.style.chart.color,
-        active: G.value,
-        onClose: oe
+        active: R.value,
+        onClose: le
       }, {
         "annotator-action-close": i(() => [
           c(t.$slots, "annotator-action-close", {}, void 0, !0)
@@ -483,21 +508,21 @@ const He = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", leg
         ]),
         _: 3
       }, 8, ["svgRef", "backgroundColor", "color", "active"])) : h("", !0),
-      vt.value ? (r(), v("div", {
+      ht.value ? (r(), g("div", {
         key: 1,
         ref_key: "noTitle",
         ref: he,
         class: "vue-data-ui-no-title-space",
         style: "height:36px; width: 100%;background:transparent"
       }, null, 512)) : h("", !0),
-      e.value.style.chart.title.text ? (r(), v("div", {
+      e.value.style.chart.title.text ? (r(), g("div", {
         key: 2,
         ref_key: "chartTitle",
-        ref: ce,
+        ref: de,
         style: "width:100%;background:transparent;padding-bottom:24px"
       }, [
-        (r(), F(ro, {
-          key: `title_${se.value}`,
+        (r(), F(io, {
+          key: `title_${ue.value}`,
           config: {
             title: {
               cy: "galaxy-div-title",
@@ -512,15 +537,15 @@ const He = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", leg
       ], 512)) : h("", !0),
       $("div", {
         id: `legend-top-${C.value}`
-      }, null, 8, co),
-      e.value.userOptions.show && fe.value && (s(Ce) || s(q)) ? (r(), F(s(rt), {
+      }, null, 8, ho),
+      e.value.userOptions.show && be.value && (s(ke) || s(J)) ? (r(), F(s(ut), {
         ref_key: "userOptionsRef",
-        ref: X,
-        key: `user_option_${re.value}`,
+        ref: Y,
+        key: `user_option_${se.value}`,
         backgroundColor: e.value.style.chart.backgroundColor,
         color: e.value.style.chart.color,
-        isPrinting: s(ke),
-        isImaging: s(we),
+        isPrinting: s(we),
+        isImaging: s(Ae),
         uid: C.value,
         hasTooltip: e.value.userOptions.buttons.tooltip && e.value.style.chart.tooltip.show,
         hasPdf: e.value.userOptions.buttons.pdf,
@@ -530,27 +555,27 @@ const He = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", leg
         hasTable: e.value.userOptions.buttons.table,
         hasFullscreen: e.value.userOptions.buttons.fullscreen,
         isTooltip: f.value.showTooltip,
-        isFullscreen: P.value,
+        isFullscreen: O.value,
         titles: { ...e.value.userOptions.buttonTitles },
         chartElement: k.value,
         position: e.value.userOptions.position,
         hasAnnotator: e.value.userOptions.buttons.annotator,
-        isAnnotation: G.value,
+        isAnnotation: R.value,
         callbacks: e.value.userOptions.callbacks,
         printScale: e.value.userOptions.print.scale,
         tableDialog: e.value.table.useDialog,
-        onToggleFullscreen: De,
-        onGeneratePdf: s(Ae),
-        onGenerateCsv: te,
-        onGenerateImage: s($e),
-        onGenerateSvg: Be,
-        onToggleTable: Oe,
-        onToggleTooltip: Pe,
-        onToggleAnnotator: oe,
-        style: R({
-          visibility: s(Ce) ? s(q) ? "visible" : "hidden" : "visible"
+        onToggleFullscreen: Oe,
+        onGeneratePdf: s($e),
+        onGenerateCsv: oe,
+        onGenerateImage: s(Te),
+        onGenerateSvg: Ie,
+        onToggleTable: _e,
+        onToggleTooltip: Be,
+        onToggleAnnotator: le,
+        style: W({
+          visibility: s(ke) ? s(J) ? "visible" : "hidden" : "visible"
         })
-      }, Ie({ _: 2 }, [
+      }, Ne({ _: 2 }, [
         t.$slots.menuIcon ? {
           name: "menuIcon",
           fn: i(({ isOpen: o, color: a }) => [
@@ -615,16 +640,16 @@ const He = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", leg
           key: "8"
         } : void 0
       ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasTooltip", "hasPdf", "hasXls", "hasImg", "hasSvg", "hasTable", "hasFullscreen", "isTooltip", "isFullscreen", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "callbacks", "printScale", "tableDialog", "onGeneratePdf", "onGenerateImage", "style"])) : h("", !0),
-      (r(), v("svg", {
+      (r(), g("svg", {
         ref_key: "svgRef",
-        ref: Z,
-        xmlns: s(Ht),
-        class: W({ "vue-data-ui-fullscreen--on": P.value, "vue-data-ui-fulscreen--off": !P.value }),
+        ref: K,
+        xmlns: s(Xt),
+        class: U({ "vue-data-ui-fullscreen--on": O.value, "vue-data-ui-fulscreen--off": !O.value }),
         viewBox: T.value.viewBox,
-        style: R(`max-width:100%; overflow: visible; background:transparent;color:${e.value.style.chart.color}`)
+        style: W(`max-width:100%; overflow: visible; background:transparent;color:${e.value.style.chart.color}`)
       }, [
-        le(s(st)),
-        t.$slots["chart-background"] ? (r(), v("foreignObject", {
+        ae(s(it)),
+        t.$slots["chart-background"] ? (r(), g("foreignObject", {
           key: 0,
           x: 0,
           y: 0,
@@ -635,7 +660,7 @@ const He = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", leg
           }
         }, [
           c(t.$slots, "chart-background", {}, void 0, !0)
-        ], 8, ho)) : h("", !0),
+        ], 8, bo)) : h("", !0),
         $("defs", null, [
           $("filter", {
             id: `blur_${C.value}`,
@@ -647,28 +672,28 @@ const He = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", leg
             $("feGaussianBlur", {
               in: "SourceGraphic",
               stdDeviation: 100 / e.value.style.chart.layout.arcs.gradient.intensity
-            }, null, 8, fo)
-          ], 8, go)
+            }, null, 8, yo)
+          ], 8, po)
         ]),
-        (r(!0), v(Le, null, Ne(I.value, (o) => (r(), v("g", null, [
-          o.value ? (r(), v("path", {
+        (r(!0), g(Ve, null, Me(I.value, (o) => (r(), g("g", null, [
+          o.value ? (r(), g("path", {
             key: 0,
             d: o.path,
             fill: "none",
             stroke: e.value.style.chart.backgroundColor,
-            "stroke-width": K(o).border,
+            "stroke-width": Z(o).border,
             "stroke-linecap": "round"
-          }, null, 8, bo)) : h("", !0),
-          o.value ? (r(), v("path", {
+          }, null, 8, mo)) : h("", !0),
+          o.value ? (r(), g("path", {
             key: 1,
             d: o.path,
             fill: "none",
             stroke: o.color,
-            "stroke-width": K(o).path,
+            "stroke-width": Z(o).path,
             "stroke-linecap": "round",
-            class: W(`${O.value && O.value !== o.id && e.value.useBlurOnHover ? "vue-ui-galaxy-blur" : ""}`)
-          }, null, 10, po)) : h("", !0),
-          o.value && e.value.style.chart.layout.arcs.gradient.show ? (r(), v("g", {
+            class: U(`${D.value && D.value !== o.id && e.value.useBlurOnHover ? "vue-ui-galaxy-blur" : ""}`)
+          }, null, 10, Co)) : h("", !0),
+          o.value && e.value.style.chart.layout.arcs.gradient.show ? (r(), g("g", {
             key: 2,
             filter: `url(#blur_${C.value})`
           }, [
@@ -676,73 +701,73 @@ const He = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", leg
               d: o.path,
               fill: "none",
               stroke: e.value.style.chart.layout.arcs.gradient.color,
-              "stroke-width": K(o).blur,
+              "stroke-width": Z(o).blur,
               "stroke-linecap": "round",
-              class: W(`vue-ui-galaxy-gradient ${O.value && O.value !== o.id && e.value.useBlurOnHover ? "vue-ui-galaxy-blur" : ""}`)
-            }, null, 10, mo)
-          ], 8, yo)) : h("", !0)
+              class: U(`vue-ui-galaxy-gradient ${D.value && D.value !== o.id && e.value.useBlurOnHover ? "vue-ui-galaxy-blur" : ""}`)
+            }, null, 10, wo)
+          ], 8, ko)) : h("", !0)
         ]))), 256)),
-        (r(!0), v(Le, null, Ne(I.value, (o, a) => (r(), v("g", null, [
-          o.value ? (r(), v("path", {
+        (r(!0), g(Ve, null, Me(I.value, (o, a) => (r(), g("g", null, [
+          o.value ? (r(), g("path", {
             key: 0,
             d: o.path,
             fill: "none",
             stroke: "transparent",
             "stroke-width": e.value.style.chart.layout.arcs.strokeWidth + e.value.style.chart.layout.arcs.borderWidth,
             "stroke-linecap": "round",
-            onMouseenter: (u) => At({
+            onMouseenter: (u) => Tt({
               datapoint: o,
               seriesIndex: o.seriesIndex,
               show: !0
             }),
-            onMouseleave: (u) => kt(o),
-            onClick: (u) => wt(o)
-          }, null, 40, Co)) : h("", !0)
+            onMouseleave: (u) => At(o),
+            onClick: (u) => $t(o)
+          }, null, 40, Ao)) : h("", !0)
         ]))), 256)),
         c(t.$slots, "svg", { svg: T.value }, void 0, !0)
-      ], 14, vo)),
-      t.$slots.watermark ? (r(), v("div", ko, [
-        c(t.$slots, "watermark", p(y({ isPrinting: s(ke) || s(we) })), void 0, !0)
+      ], 14, fo)),
+      t.$slots.watermark ? (r(), g("div", $o, [
+        c(t.$slots, "watermark", p(y({ isPrinting: s(we) || s(Ae) })), void 0, !0)
       ])) : h("", !0),
       $("div", {
         id: `legend-bottom-${C.value}`
-      }, null, 8, wo),
-      ge.value ? (r(), F(It, {
+      }, null, 8, To),
+      fe.value ? (r(), F(Nt, {
         key: 5,
         to: e.value.style.chart.legend.position === "top" ? `#legend-top-${C.value}` : `#legend-bottom-${C.value}`
       }, [
         $("div", {
           ref_key: "chartLegend",
-          ref: de
+          ref: ve
         }, [
-          e.value.style.chart.legend.show ? (r(), F(so, {
-            key: `legend_${ie.value}`,
-            legendSet: ee.value,
-            config: $t.value,
+          e.value.style.chart.legend.show ? (r(), F(co, {
+            key: `legend_${ce.value}`,
+            legendSet: te.value,
+            config: xt.value,
             onClickMarker: l[0] || (l[0] = ({ legend: o }) => E(o))
           }, {
             item: i(({ legend: o, index: a }) => [
-              s(Y) ? h("", !0) : (r(), v("div", {
+              s(q) ? h("", !0) : (r(), g("div", {
                 key: 0,
                 onClick: (u) => E(o),
-                style: R(`opacity:${b.value.includes(o.id) ? 0.5 : 1}`)
-              }, ae(o.display), 13, Ao))
+                style: W(`opacity:${b.value.includes(o.id) ? 0.5 : 1}`)
+              }, ne(o.display), 13, xo))
             ]),
             _: 1
           }, 8, ["legendSet", "config"])) : h("", !0),
-          c(t.$slots, "legend", { legend: ee.value }, void 0, !0)
+          c(t.$slots, "legend", { legend: te.value }, void 0, !0)
         ], 512)
       ], 8, ["to"])) : h("", !0),
-      t.$slots.source ? (r(), v("div", {
+      t.$slots.source ? (r(), g("div", {
         key: 6,
         ref_key: "source",
-        ref: ve,
+        ref: ge,
         dir: "auto"
       }, [
         c(t.$slots, "source", {}, void 0, !0)
       ], 512)) : h("", !0),
-      le(s(tt), {
-        show: f.value.showTooltip && H.value,
+      ae(s(lt), {
+        show: f.value.showTooltip && j.value,
         backgroundColor: e.value.style.chart.tooltip.backgroundColor,
         color: e.value.style.chart.tooltip.color,
         borderRadius: e.value.style.chart.tooltip.borderRadius,
@@ -753,46 +778,46 @@ const He = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", leg
         position: e.value.style.chart.tooltip.position,
         offsetY: e.value.style.chart.tooltip.offsetY,
         parent: k.value,
-        content: j.value,
-        isFullscreen: P.value,
-        isCustom: s(Ue)(e.value.style.chart.tooltip.customFormat),
+        content: X.value,
+        isFullscreen: O.value,
+        isCustom: s(je)(e.value.style.chart.tooltip.customFormat),
         smooth: e.value.style.chart.tooltip.smooth,
         backdropFilter: e.value.style.chart.tooltip.backdropFilter,
         smoothForce: e.value.style.chart.tooltip.smoothForce,
         smoothSnapThreshold: e.value.style.chart.tooltip.smoothSnapThreshold
       }, {
         "tooltip-before": i(() => [
-          c(t.$slots, "tooltip-before", p(y({ ...Q.value })), void 0, !0)
+          c(t.$slots, "tooltip-before", p(y({ ...ee.value })), void 0, !0)
         ]),
         "tooltip-after": i(() => [
-          c(t.$slots, "tooltip-after", p(y({ ...Q.value })), void 0, !0)
+          c(t.$slots, "tooltip-after", p(y({ ...ee.value })), void 0, !0)
         ]),
         _: 3
       }, 8, ["show", "backgroundColor", "color", "borderRadius", "borderColor", "borderWidth", "fontSize", "backgroundOpacity", "position", "offsetY", "parent", "content", "isFullscreen", "isCustom", "smooth", "backdropFilter", "smoothForce", "smoothSnapThreshold"]),
-      fe.value && e.value.userOptions.buttons.table ? (r(), F(Lt(L.value.component), Nt({ key: 7 }, L.value.props, {
+      be.value && e.value.userOptions.buttons.table ? (r(), F(Vt(L.value.component), Mt({ key: 7 }, L.value.props, {
         ref_key: "tableUnit",
         ref: B,
-        onClose: _e
-      }), Ie({
+        onClose: Ee
+      }), Ne({
         content: i(() => [
-          (r(), F(s(at), {
-            key: `table_${ue.value}`,
-            colNames: z.value.colNames,
-            head: z.value.head,
-            body: z.value.body,
-            config: z.value.config,
+          (r(), F(s(rt), {
+            key: `table_${ie.value}`,
+            colNames: G.value.colNames,
+            head: G.value.head,
+            body: G.value.body,
+            config: G.value.config,
             title: e.value.table.useDialog ? "" : L.value.title,
             withCloseButton: !e.value.table.useDialog,
-            onClose: _e
+            onClose: Ee
           }, {
             th: i(({ th: o }) => [
               $("div", {
                 innerHTML: o,
                 style: { display: "flex", "align-items": "center" }
-              }, null, 8, $o)
+              }, null, 8, So)
             ]),
             td: i(({ td: o }) => [
-              Ve(ae(o.name || o), 1)
+              ze(ne(o.name || o), 1)
             ]),
             _: 1
           }, 8, ["colNames", "head", "body", "config", "title", "withCloseButton"]))
@@ -802,7 +827,7 @@ const He = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", leg
         e.value.table.useDialog ? {
           name: "title",
           fn: i(() => [
-            Ve(ae(L.value.title), 1)
+            ze(ne(L.value.title), 1)
           ]),
           key: "0"
         } : void 0,
@@ -812,9 +837,9 @@ const He = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", leg
             $("button", {
               tabindex: "0",
               class: "vue-ui-user-options-button",
-              onClick: l[1] || (l[1] = (o) => te(e.value.userOptions.callbacks.csv))
+              onClick: l[1] || (l[1] = (o) => oe(e.value.userOptions.callbacks.csv))
             }, [
-              le(s(ot), {
+              ae(s(at), {
                 name: "excel",
                 stroke: L.value.props.color
               }, null, 8, ["stroke"])
@@ -823,15 +848,15 @@ const He = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", leg
           key: "1"
         } : void 0
       ]), 1040)) : h("", !0),
-      s(Y) ? (r(), F(Qt, { key: 8 })) : h("", !0)
-    ], 46, io));
+      s(q) ? (r(), F(oo, { key: 8 })) : h("", !0)
+    ], 46, go));
   }
-}, xo = /* @__PURE__ */ uo(To, [["__scopeId", "data-v-0d1007ad"]]), Ro = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+}, Do = /* @__PURE__ */ vo(Fo, [["__scopeId", "data-v-76025af7"]]), jo = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
-  default: xo
+  default: Do
 }, Symbol.toStringTag, { value: "Module" }));
 export {
-  Go as a,
-  Ro as b,
-  xo as v
+  Ho as a,
+  jo as b,
+  Do as v
 };