vue-data-ui 3.2.7 → 3.3.0

package/dist/{vue-ui-scatter-BRr9oPfo.js → vue-ui-scatter-zjlWyvVd.js}

@@ -1,47 +1,48 @@
-import { defineAsyncComponent as se, computed as F, ref as M, toRefs as il, watch as Be, shallowRef as Lt, onMounted as rl, onBeforeUnmount as vl, createElementBlock as y, openBlock as r, unref as c, normalizeStyle as ne, normalizeClass as Bt, createBlock as le, createCommentVNode as x, createElementVNode as w, createVNode as $e, createSlots as Tt, withCtx as X, renderSlot as j, normalizeProps as pe, guardReactiveProps as fe, Fragment as Z, renderList as K, toDisplayString as q, Teleport as yl, resolveDynamicComponent as cl, mergeProps as dl, createTextVNode as zt, nextTick as hl } from "vue";
-import { c as pl, t as fl, b as gl, p as ye, o as Pt, f as Je, e as ml, g as Ot, W as xl, h as Ke, Z as bl, U as kl, s as Te, X as wl, Y as _l, a as ue, q as G, d as Q, x as $l, y as Ml, z as Cl, A as Al } from "./lib-BEpWEyMm.js";
-import { t as Sl, u as Ll } from "./useResponsive-DfdjqQps.js";
-import { u as Bl, a as Dt } from "./useNestedProp-BOk-tPdu.js";
-import { u as Tl, B as zl } from "./BaseScanner-BgWxam9d.js";
-import { u as Pl } from "./usePrinter-w23K-ezx.js";
-import { u as Ol } from "./useUserOptionState-BIvW1Kz7.js";
-import { u as Dl } from "./useChartAccessibility-9icAAmYg.js";
-import { t as El } from "./themes-Dw-dDudK.js";
-import Fl from "./Legend-BpoFJ8fc.js";
-import Wl from "./Title-DG2nloSB.js";
-import { _ as Qe } from "./Shape-C_C_OmqR.js";
-import Nl from "./img-DjWwQXVS.js";
-import { _ as Il } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "height"], Ul = { key: 1 }, Vl = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], ql = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Gl = { key: 2 }, Hl = ["id"], Zl = ["stop-color"], Jl = ["stop-color"], Kl = ["id"], Ql = ["stop-color"], ea = ["stop-color"], ta = ["x", "y", "width", "height", "fill", "stroke", "stroke-width", "rx"], la = ["x", "y", "width", "height", "onMouseenter"], aa = {
+import { defineAsyncComponent as ne, computed as T, ref as M, toRefs as hl, watch as Te, shallowRef as Bt, onMounted as pl, onBeforeUnmount as fl, createElementBlock as y, openBlock as r, unref as c, normalizeStyle as ue, normalizeClass as Tt, createBlock as le, createCommentVNode as x, createElementVNode as w, createVNode as $e, createSlots as zt, withCtx as X, renderSlot as U, normalizeProps as pe, guardReactiveProps as fe, Fragment as Z, renderList as K, toDisplayString as G, Teleport as gl, resolveDynamicComponent as ml, mergeProps as xl, createTextVNode as Pt, nextTick as bl } from "vue";
+import { c as kl, t as wl, b as _l, p as ye, o as Ot, f as Je, e as $l, g as Dt, W as Ml, h as Ke, Z as Cl, U as Al, s as ze, X as Sl, Y as Ll, a as ie, q, d as Q, x as Bl, y as Tl, z as zl, A as Pl } from "./lib-GIYcnm0E.js";
+import { t as Ol, u as Dl } from "./useResponsive-DfdjqQps.js";
+import { u as El, a as Et } from "./useNestedProp-mxyyqd0B.js";
+import { u as Fl, B as Wl } from "./BaseScanner-BgWxam9d.js";
+import { u as Nl } from "./usePrinter-DYRFiw7X.js";
+import { u as Il } from "./useSvgExport-B7-Vrjtu.js";
+import { u as Xl } from "./useUserOptionState-BIvW1Kz7.js";
+import { u as Yl } from "./useChartAccessibility-9icAAmYg.js";
+import { t as Rl } from "./themes-Dw-dDudK.js";
+import Ul from "./Legend-DsogCeTb.js";
+import jl from "./Title-D17CJXko.js";
+import { _ as Qe } from "./Shape-DJG2zW7b.js";
+import Vl from "./img-6wPuVVtk.js";
+import { _ as Gl } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const ql = ["id"], Hl = ["id"], Zl = ["xmlns", "viewBox"], Jl = ["width", "height"], Kl = { key: 1 }, Ql = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], ea = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], ta = { key: 2 }, la = ["id"], aa = ["stop-color"], oa = ["stop-color"], sa = ["id"], na = ["stop-color"], ua = ["stop-color"], ia = ["x", "y", "width", "height", "fill", "stroke", "stroke-width", "rx"], ra = ["x", "y", "width", "height", "onMouseenter"], va = {
   key: 2,
   style: { "pointer-events": "none" }
-}, oa = ["x", "y", "width", "height", "fill", "fill-opacity"], sa = ["x1", "x2", "y2", "stroke", "stroke-dasharray", "stroke-width"], na = ["x1", "x2", "y2", "stroke", "stroke-dasharray", "stroke-width"], ua = ["x", "y", "height", "width", "fill", "stroke", "stroke-width", "rx"], ia = ["x", "y", "width", "height", "onMouseenter"], ra = {
+}, ya = ["x", "y", "width", "height", "fill", "fill-opacity"], ca = ["x1", "x2", "y2", "stroke", "stroke-dasharray", "stroke-width"], da = ["x1", "x2", "y2", "stroke", "stroke-dasharray", "stroke-width"], ha = ["x", "y", "height", "width", "fill", "stroke", "stroke-width", "rx"], pa = ["x", "y", "width", "height", "onMouseenter"], fa = {
   key: 2,
   style: { "pointer-events": "none" }
-}, va = ["x", "y", "width", "height", "fill", "fill-opacity"], ya = ["x1", "x2", "y1", "y2", "stroke", "stroke-dasharray", "stroke-width"], ca = ["x1", "x2", "y1", "y2", "stroke", "stroke-dasharray", "stroke-width"], da = {
+}, ga = ["x", "y", "width", "height", "fill", "fill-opacity"], ma = ["x1", "x2", "y1", "y2", "stroke", "stroke-dasharray", "stroke-width"], xa = ["x1", "x2", "y1", "y2", "stroke", "stroke-dasharray", "stroke-width"], ba = {
   key: 0,
   style: { "pointer-events": "none" }
-}, ha = ["d", "stroke", "stroke-width"], pa = ["d", "stroke", "stroke-width"], fa = ["d", "stroke", "stroke-width"], ga = ["d", "stroke", "stroke-width"], ma = { key: 3 }, xa = ["points", "fill", "stroke-width", "stroke-dasharray", "stroke"], ba = { key: 0 }, ka = ["cx", "cy", "r", "fill", "stroke", "stroke-width", "onMouseover", "onMouseleave", "onClick"], wa = { key: 1 }, _a = ["clip-path"], $a = ["d", "fill", "stroke", "stroke-width", "stroke-opacity"], Ma = {
+}, ka = ["d", "stroke", "stroke-width"], wa = ["d", "stroke", "stroke-width"], _a = ["d", "stroke", "stroke-width"], $a = ["d", "stroke", "stroke-width"], Ma = { key: 3 }, Ca = ["points", "fill", "stroke-width", "stroke-dasharray", "stroke"], Aa = { key: 0 }, Sa = ["cx", "cy", "r", "fill", "stroke", "stroke-width", "onMouseover", "onMouseleave", "onClick"], La = { key: 1 }, Ba = ["clip-path"], Ta = ["d", "fill", "stroke", "stroke-width", "stroke-opacity"], za = {
   key: 0,
   style: { "pointer-events": "none" }
-}, Ca = ["x", "y", "width", "height"], Aa = {
+}, Pa = ["x", "y", "width", "height"], Oa = {
   key: 6,
   style: { "pointer-events": "none !important" }
-}, Sa = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], La = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], Ba = ["x", "y", "font-size", "fill", "font-weight", "text-anchor"], Ta = ["x", "y", "font-size", "fill", "font-weight"], za = ["cx", "cy", "r", "fill", "stroke", "stroke-width"], Pa = ["cx", "cy", "r", "fill", "stroke", "stroke-width"], Oa = ["x", "y", "font-size", "fill", "font-weight", "text-anchor"], Da = ["id", "transform", "font-size", "font-weight", "fill"], Ea = ["font-size", "fill", "transform"], Fa = ["transform", "font-size", "fill"], Wa = ["x", "y", "font-size", "fill"], Na = ["x", "y", "font-size", "fill"], Ia = ["font-size", "font-weight", "fill", "x", "y"], Xa = ["id"], Ya = ["x", "y", "width", "height"], Ra = {
+}, Da = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], Ea = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], Fa = ["x", "y", "font-size", "fill", "font-weight", "text-anchor"], Wa = ["x", "y", "font-size", "fill", "font-weight"], Na = ["cx", "cy", "r", "fill", "stroke", "stroke-width"], Ia = ["cx", "cy", "r", "fill", "stroke", "stroke-width"], Xa = ["x", "y", "font-size", "fill", "font-weight", "text-anchor"], Ya = ["id", "transform", "font-size", "font-weight", "fill"], Ra = ["font-size", "fill", "transform"], Ua = ["transform", "font-size", "fill"], ja = ["x", "y", "font-size", "fill"], Va = ["x", "y", "font-size", "fill"], Ga = ["font-size", "font-weight", "fill", "x", "y"], qa = ["id"], Ha = ["x", "y", "width", "height"], Za = {
   key: 11,
   style: { pointerEvents: "none" }
-}, ja = ["x1", "x2", "y1", "y2", "stroke-dasharray", "stroke", "stroke-width", "clip-path"], Ua = ["x", "y", "fill", "font-size", "font-weight"], Va = {
+}, Ja = ["x1", "x2", "y1", "y2", "stroke-dasharray", "stroke", "stroke-width", "clip-path"], Ka = ["x", "y", "fill", "font-size", "font-weight"], Qa = {
   key: 4,
   class: "vue-data-ui-watermark"
-}, qa = ["id"], Ga = ["onClick"], Ha = {
+}, eo = ["id"], to = ["onClick"], lo = {
   key: 0,
   style: { width: "100%", display: "flex", "align-items": "center", "justify-content": "center" }
-}, Za = {
+}, ao = {
   viewBox: "0 0 20 20",
   height: "20",
   width: "20",
   style: { overflow: "hidden", background: "transparent" }
-}, Ja = { key: 0 }, Ka = ["innerHTML"], Qa = {
+}, oo = { key: 0 }, so = ["innerHTML"], no = {
   __name: "vue-ui-scatter",
   props: {
     config: {
@@ -57,41 +58,41 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
       }
     }
   },
-  setup(Et, { expose: Ft }) {
-    const Wt = se(() => import("./Tooltip-BOXz8skU.js")), Nt = se(() => import("./BaseIcon-Bz-1GQhu.js")), It = se(() => import("./vue-ui-accordion-CeMTgpl0.js")), Xt = se(() => import("./DataTable-BvjacRbw.js")), Yt = se(() => import("./PenAndPaper-CR8q353D.js")), Rt = se(() => import("./UserOptions-DsTgvAok.js")), jt = se(() => import("./PackageVersion-Cwrh45ON.js")), Ut = se(() => import("./BaseDraggableDialog-CHhZIht2.js")), { vue_ui_scatter: Vt } = Bl(), ee = Et, et = F(() => !!ee.dataset && ee.dataset.length), W = M(pl()), ze = M(!1), Pe = M(""), tt = M(0), te = M(null), lt = M(null), at = M(null), ot = M(null), st = M(null), nt = M(0), ut = M(0), it = M(0), N = M([]), rt = M(!1), ge = M(null), me = M(null), xe = M(null), Oe = M(null), De = M(null), qt = M(null), Gt = M(null), Ee = M(null), e = M(Xe());
-    function Ht(l = 100, s = 0.8, t = {}) {
+  setup(Ft, { expose: Wt }) {
+    const Nt = ne(() => import("./Tooltip-CtVdvbZi.js")), It = ne(() => import("./BaseIcon-CtqN7W_g.js")), Xt = ne(() => import("./vue-ui-accordion-Dch9YrCi.js")), Yt = ne(() => import("./DataTable-BeI6gYJX.js")), Rt = ne(() => import("./PenAndPaper-BxbYiPy4.js")), Ut = ne(() => import("./UserOptions-B3vCIe-u.js")), jt = ne(() => import("./PackageVersion-C9oklnuy.js")), Vt = ne(() => import("./BaseDraggableDialog-q3pgSDTz.js")), { vue_ui_scatter: Gt } = El(), ee = Ft, et = T(() => !!ee.dataset && ee.dataset.length), W = M(kl()), Pe = M(!1), Oe = M(""), tt = M(0), te = M(null), lt = M(null), at = M(null), ot = M(null), st = M(null), nt = M(0), ut = M(0), it = M(0), N = M([]), rt = M(!1), ge = M(null), me = M(null), xe = M(null), De = M(null), Ee = M(null), qt = M(null), Ht = M(null), Fe = M(null), e = M(Xe());
+    function Zt(l = 100, s = 0.8, t = {}) {
       const { meanX: o = 0, sdX: a = 1, meanY: u = 0, sdY: i = 1, seed: p } = t;
       let v = (p ?? Math.floor(Math.random() * 2 ** 31)) >>> 0;
       const g = () => (v = v * 1664525 + 1013904223 >>> 0, v / 2 ** 32), L = () => {
-        let m = 0, O = 0;
+        let m = 0, D = 0;
         for (; m === 0; ) m = g();
-        for (; O === 0; ) O = g();
-        return Math.sqrt(-2 * Math.log(m)) * Math.cos(2 * Math.PI * O);
-      }, d = l / 2, $ = Array.from({ length: d }, L), P = Array.from({ length: d }, L), C = (m) => m.reduce((O, _e) => O + _e, 0) / m.length, T = C($), I = C(P);
+        for (; D === 0; ) D = g();
+        return Math.sqrt(-2 * Math.log(m)) * Math.cos(2 * Math.PI * D);
+      }, d = l / 2, $ = Array.from({ length: d }, L), O = Array.from({ length: d }, L), C = (m) => m.reduce((D, _e) => D + _e, 0) / m.length, z = C($), I = C(O);
       for (let m = 0; m < d; m += 1)
-        $[m] -= T, P[m] -= I;
-      const B = (m, O) => m.reduce((_e, Le, Ze) => _e + Le * O[Ze], 0), _ = (m) => B(m, m), h = B(P, $) / _($), S = P.map((m, O) => m - h * $[O]), V = _($) / d, J = _(S) / d, oe = Math.sqrt((1 - s * s) * V / J), R = $.map((m, O) => s * m + oe * S[O]), ve = $.concat($.map((m) => -m)), He = R.concat(R.map((m) => -m)), ke = (m) => Math.sqrt(_(m) / m.length), de = (m, O, _e) => {
-        const Le = ke(m);
-        return m.map((Ze) => _e + (Le ? Ze / Le * O : 0));
+        $[m] -= z, O[m] -= I;
+      const B = (m, D) => m.reduce((_e, Be, Ze) => _e + Be * D[Ze], 0), _ = (m) => B(m, m), h = B(O, $) / _($), S = O.map((m, D) => m - h * $[D]), V = _($) / d, J = _(S) / d, se = Math.sqrt((1 - s * s) * V / J), R = $.map((m, D) => s * m + se * S[D]), ve = $.concat($.map((m) => -m)), He = R.concat(R.map((m) => -m)), ke = (m) => Math.sqrt(_(m) / m.length), de = (m, D, _e) => {
+        const Be = ke(m);
+        return m.map((Ze) => _e + (Be ? Ze / Be * D : 0));
       }, he = de(ve, a, o), we = de(He, i, u);
       for (let m = he.length - 1; m > 0; m -= 1) {
-        const O = Math.floor(g() * (m + 1));
-        [he[m], he[O]] = [he[O], he[m]], [we[m], we[O]] = [we[O], we[m]];
+        const D = Math.floor(g() * (m + 1));
+        [he[m], he[D]] = [he[D], he[m]], [we[m], we[D]] = [we[D], we[m]];
       }
-      return he.map((m, O) => ({ x: m, y: we[O] }));
+      return he.map((m, D) => ({ x: m, y: we[D] }));
     }
-    const { loading: vt, FINAL_DATASET: Fe, manualLoading: We } = Tl({
-      ...il(ee),
+    const { loading: vt, FINAL_DATASET: We, manualLoading: Ne } = Fl({
+      ...hl(ee),
       FINAL_CONFIG: e,
       prepareConfig: Xe,
       skeletonDataset: [
         {
           name: "",
           color: "#999999",
-          values: Ht(100, 0.5, { seed: 42 })
+          values: Zt(100, 0.5, { seed: 42 })
         }
       ],
-      skeletonConfig: fl({
+      skeletonConfig: wl({
         defaultConfig: e.value,
         userConfig: {
           userOptions: { show: !1 },
@@ -124,22 +125,22 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
           }
         }
       })
-    }), { userOptionsVisible: Ne, setUserOptionsVisibility: yt, keepUserOptionState: ct } = Ol({ config: e.value }), { svgRef: Ie } = Dl({ config: e.value.style.title });
+    }), { userOptionsVisible: Ie, setUserOptionsVisibility: yt, keepUserOptionState: ct } = Xl({ config: e.value }), { svgRef: Me } = Yl({ config: e.value.style.title });
     function Xe() {
-      const l = Dt({
+      const l = Et({
         userConfig: ee.config,
-        defaultConfig: Vt
+        defaultConfig: Gt
       });
       return l.theme ? {
-        ...Dt({
-          userConfig: El.vue_ui_scatter[l.theme] || ee.config,
+        ...Et({
+          userConfig: Rl.vue_ui_scatter[l.theme] || ee.config,
           defaultConfig: l
         }),
-        customPalette: gl[l.theme] || ye
+        customPalette: _l[l.theme] || ye
       } : l;
     }
-    Be(() => ee.config, (l) => {
-      vt.value || (e.value = Xe()), Ne.value = !e.value.userOptions.showOnChartHover, ht(), nt.value += 1, ut.value += 1, it.value += 1, H.value.showTable = e.value.table.show, H.value.showTooltip = e.value.style.tooltip.show, dt.value && e.value.usePerformanceMode && console.warn(`VueUiScatter : You are using performance mode
+    Te(() => ee.config, (l) => {
+      vt.value || (e.value = Xe()), Ie.value = !e.value.userOptions.showOnChartHover, ht(), nt.value += 1, ut.value += 1, it.value += 1, H.value.showTable = e.value.table.show, H.value.showTooltip = e.value.style.tooltip.show, dt.value && e.value.usePerformanceMode && console.warn(`VueUiScatter : You are using performance mode
 
 - downsampling is disabled in this mode, all plots are rendered
 
@@ -148,22 +149,22 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
 - Depending on plot density, shapes might not display a border (stroke) to avoid fuzziness 
 
 ℹ️ To remove this warning, set config.debug to false.`);
-    }, { deep: !0 }), Be(() => ee.dataset, (l) => {
-      Array.isArray(l) && l.length > 0 && (We.value = !1);
+    }, { deep: !0 }), Te(() => ee.dataset, (l) => {
+      Array.isArray(l) && l.length > 0 && (Ne.value = !1);
     }, { deep: !0 });
-    const ae = Lt(null), ce = Lt(null);
-    rl(() => {
+    const ae = Bt(null), ce = Bt(null);
+    pl(() => {
       rt.value = !0, ht();
     });
-    const dt = F(() => !!e.value.debug);
+    const dt = T(() => !!e.value.debug);
     function ht() {
-      if (Pt(ee.dataset) && (Je({
+      if (Ot(ee.dataset) && (Je({
         componentName: "VueUiScatter",
         type: "dataset",
         debug: dt.value
-      }), We.value = !0), Pt(ee.dataset) || (We.value = e.value.loading), e.value.responsive) {
-        const l = Sl(() => {
-          const { width: s, height: t } = Ll({
+      }), Ne.value = !0), Ot(ee.dataset) || (Ne.value = e.value.loading), e.value.responsive) {
+        const l = Ol(() => {
+          const { width: s, height: t } = Dl({
             chart: te.value,
             title: e.value.style.title.text ? lt.value : null,
             legend: e.value.style.legend.show ? at.value : null,
@@ -171,45 +172,45 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
             noTitle: st.value
           });
           requestAnimationFrame(() => {
-            D.value.width = s, D.value.height = t;
+            E.value.width = s, E.value.height = t;
           });
         });
         ae.value && (ce.value && ae.value.unobserve(ce.value), ae.value.disconnect()), ae.value = new ResizeObserver(l), ce.value = te.value.parentNode, ae.value.observe(ce.value);
       }
     }
-    vl(() => {
+    fl(() => {
       ae.value && (ce.value && ae.value.unobserve(ce.value), ae.value.disconnect());
     });
-    const { isPrinting: pt, isImaging: ft, generatePdf: gt, generateImage: mt } = Pl({
+    const { isPrinting: pt, isImaging: ft, generatePdf: gt, generateImage: mt } = Nl({
       elementId: `vue-ui-scatter_${W.value}`,
       fileName: e.value.style.title.text || "vue-ui-scatter",
       options: e.value.userOptions.print
-    }), Zt = F(() => e.value.userOptions.show && !e.value.style.title.text), xt = F(() => ml(e.value.customPalette)), H = M({
+    }), Jt = T(() => e.value.userOptions.show && !e.value.style.title.text), xt = T(() => $l(e.value.customPalette)), H = M({
       showTable: e.value.table.show,
       showTooltip: e.value.style.tooltip.show
     });
-    Be(e, () => {
+    Te(e, () => {
       H.value = {
         showTable: e.value.table.show,
         showTooltip: e.value.style.tooltip.show
       };
     }, { immediate: !0 });
-    const D = M({
+    const E = M({
       height: e.value.style.layout.height,
       width: e.value.style.layout.width
-    }), Me = F(() => e.value.style.layout.marginalBars.show ? e.value.style.layout.marginalBars.size + e.value.style.layout.marginalBars.offset : 0), n = F(() => {
+    }), Ce = T(() => e.value.style.layout.marginalBars.show ? e.value.style.layout.marginalBars.size + e.value.style.layout.marginalBars.offset : 0), n = T(() => {
       let l = 0, s = 0;
-      return De.value && (l = De.value.getBBox().width + 6), Ee.value && (s = Ee.value.getBBox().height + 6), {
-        top: e.value.style.layout.padding.top + Me.value + e.value.style.layout.dataLabels.yAxis.fontSize * 2,
-        right: D.value.width - e.value.style.layout.padding.right - Me.value - 6,
-        bottom: D.value.height - e.value.style.layout.padding.bottom - s,
+      return Ee.value && (l = Ee.value.getBBox().width + 6), Fe.value && (s = Fe.value.getBBox().height + 6), {
+        top: e.value.style.layout.padding.top + Ce.value + e.value.style.layout.dataLabels.yAxis.fontSize * 2,
+        right: E.value.width - e.value.style.layout.padding.right - Ce.value - 6,
+        bottom: E.value.height - e.value.style.layout.padding.bottom - s,
         left: e.value.style.layout.padding.left + l,
-        height: D.value.height - e.value.style.layout.padding.top - e.value.style.layout.padding.bottom - Me.value - s - e.value.style.layout.dataLabels.yAxis.fontSize * 2,
-        width: D.value.width - e.value.style.layout.padding.left - e.value.style.layout.padding.right - Me.value - l - 6
+        height: E.value.height - e.value.style.layout.padding.top - e.value.style.layout.padding.bottom - Ce.value - s - e.value.style.layout.dataLabels.yAxis.fontSize * 2,
+        width: E.value.width - e.value.style.layout.padding.left - e.value.style.layout.padding.right - Ce.value - l - 6
       };
-    }), z = F(() => {
-      Fe.value.forEach((a, u) => {
-        Ot({
+    }), P = T(() => {
+      We.value.forEach((a, u) => {
+        Dt({
           datasetObject: a,
           requiredAttributes: ["values"]
         }).forEach((i) => {
@@ -220,7 +221,7 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
             index: u
           });
         }), a.values && a.values.forEach((i, p) => {
-          Ot({
+          Dt({
             datasetObject: i,
             requiredAttributes: ["x", "y"]
           }).forEach((v) => {
@@ -233,16 +234,16 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
           });
         });
       });
-      const l = Math.min(...ie.value.filter((a) => !N.value.includes(a.id)).flatMap((a) => a.values.map((u) => u.x))), s = Math.max(...ie.value.filter((a) => !N.value.includes(a.id)).flatMap((a) => a.values.map((u) => u.x))), t = Math.min(...ie.value.filter((a) => !N.value.includes(a.id)).flatMap((a) => a.values.map((u) => u.y))), o = Math.max(...ie.value.filter((a) => !N.value.includes(a.id)).flatMap((a) => a.values.map((u) => u.y)));
+      const l = Math.min(...oe.value.filter((a) => !N.value.includes(a.id)).flatMap((a) => a.values.map((u) => u.x))), s = Math.max(...oe.value.filter((a) => !N.value.includes(a.id)).flatMap((a) => a.values.map((u) => u.x))), t = Math.min(...oe.value.filter((a) => !N.value.includes(a.id)).flatMap((a) => a.values.map((u) => u.y))), o = Math.max(...oe.value.filter((a) => !N.value.includes(a.id)).flatMap((a) => a.values.map((u) => u.y)));
       return { xMin: l >= 0 ? 0 : l, xMax: s, yMin: t >= 0 ? 0 : t, yMax: o };
-    }), E = F(() => ({
-      x: n.value.left + Math.abs(z.value.xMin) / (z.value.xMax + Math.abs(z.value.xMin)) * n.value.width,
-      y: n.value.bottom - Math.abs(z.value.yMin) / (z.value.yMax + Math.abs(z.value.yMin)) * n.value.height
-    })), ie = F(() => Fe.value.map((l, s) => {
+    }), F = T(() => ({
+      x: n.value.left + Math.abs(P.value.xMin) / (P.value.xMax + Math.abs(P.value.xMin)) * n.value.width,
+      y: n.value.bottom - Math.abs(P.value.yMin) / (P.value.yMax + Math.abs(P.value.yMin)) * n.value.height
+    })), oe = T(() => We.value.map((l, s) => {
       const t = `cluster_${W.value}_${s}`;
       return {
         ...l,
-        values: xl({
+        values: Ml({
           data: l.values,
           threshold: e.value.usePerformanceMode ? l.values.length + 1 : e.value.downsample.threshold
         }),
@@ -253,18 +254,18 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
         segregate: () => wt(t),
         isSegregated: N.value.includes(t)
       };
-    })), Jt = F(() => ({
+    })), Kt = T(() => ({
       cy: "scatter-div-legend",
       backgroundColor: e.value.style.legend.backgroundColor,
       color: e.value.style.legend.color,
       fontSize: e.value.style.legend.fontSize,
       paddingBottom: 12,
       fontWeight: e.value.style.legend.bold ? "bold" : ""
-    })), Ye = F(() => ie.value.map((l, s) => ({
+    })), Ye = T(() => oe.value.map((l, s) => ({
       ...l,
       plots: l.values.map((t) => ({
-        x: n.value.left + (t.x + Math.abs(z.value.xMin)) / (z.value.xMax + Math.abs(z.value.xMin)) * n.value.width,
-        y: n.value.bottom - (t.y + Math.abs(z.value.yMin)) / (z.value.yMax + Math.abs(z.value.yMin)) * n.value.height,
+        x: n.value.left + (t.x + Math.abs(P.value.xMin)) / (P.value.xMax + Math.abs(P.value.xMin)) * n.value.width,
+        y: n.value.bottom - (t.y + Math.abs(P.value.yMin)) / (P.value.yMax + Math.abs(P.value.yMin)) * n.value.height,
         v: {
           ...t,
           name: t.name || ""
@@ -274,23 +275,23 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
         id: `plot_${W.value}_${Math.random()}`,
         weight: t.weight ?? e.value.style.layout.plots.radius
       }))
-    })).filter((l) => !N.value.includes(l.id))), U = F(() => {
+    })).filter((l) => !N.value.includes(l.id))), j = T(() => {
       const s = ({ m: t, b: o, rect: a, verticalX: u = null }) => {
         const { left: i, right: p, top: v, bottom: g } = a, L = [], d = (_, h) => {
           Number.isFinite(_) && Number.isFinite(h) && L.push({ x: _, y: h });
         }, $ = ({ x: _, y: h }) => _ >= i - 1e-9 && _ <= p + 1e-9 && h >= v - 1e-9 && h <= g + 1e-9;
         u !== null ? u >= i - 1e-9 && u <= p + 1e-9 && (d(u, v), d(u, g)) : Number.isFinite(t) && (d(i, t * i + o), d(p, t * p + o), Math.abs(t) > 1e-9 ? (d((v - o) / t, v), d((g - o) / t, g)) : o >= v - 1e-9 && o <= g + 1e-9 && (d(i, o), d(p, o)));
-        const P = L.filter($), C = [];
-        for (const _ of P)
+        const O = L.filter($), C = [];
+        for (const _ of O)
           C.some((h) => Math.abs(h.x - _.x) < 1e-6 && Math.abs(h.y - _.y) < 1e-6) || C.push(_);
         if (C.length < 2) return null;
-        let T = C[0], I = C[1], B = 0;
+        let z = C[0], I = C[1], B = 0;
         for (let _ = 0; _ < C.length; _ += 1)
           for (let h = _ + 1; h < C.length; h += 1) {
             const S = C[_].x - C[h].x, V = C[_].y - C[h].y, J = S * S + V * V;
-            J > B && (B = J, T = C[_], I = C[h]);
+            J > B && (B = J, z = C[_], I = C[h]);
           }
-        return { x1: T.x, y1: T.y, x2: I.x, y2: I.y };
+        return { x1: z.x, y1: z.y, x2: I.x, y2: I.y };
       };
       return Ye.value.map((t) => {
         const o = t.plots.length, a = t.plots.reduce((h, S) => h + S.x, 0) / o, u = t.plots.reduce((h, S) => h + S.y, 0) / o;
@@ -303,23 +304,23 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
         p < 1e-9 ? (L = a, v = 1 / 0, g = null) : (v = i / p, g = u - v * a);
         let d, $;
         L !== null ? (d = 1 / 0, $ = null) : (d = v, $ = g);
-        const P = t.plots.every((h) => h.v && typeof h.v.x == "number" && typeof h.v.y == "number");
+        const O = t.plots.every((h) => h.v && typeof h.v.x == "number" && typeof h.v.y == "number");
         let C = NaN;
         if (o >= 2) {
           let h = 0, S = 0;
-          P ? (h = t.plots.reduce((R, ve) => R + ve.v.x, 0) / o, S = t.plots.reduce((R, ve) => R + ve.v.y, 0) / o) : (h = a, S = -u);
-          let V = 0, J = 0, oe = 0;
+          O ? (h = t.plots.reduce((R, ve) => R + ve.v.x, 0) / o, S = t.plots.reduce((R, ve) => R + ve.v.y, 0) / o) : (h = a, S = -u);
+          let V = 0, J = 0, se = 0;
           for (const R of t.plots) {
-            const ve = P ? R.v.x : R.x, He = P ? R.v.y : -R.y, ke = ve - h, de = He - S;
-            V += ke * de, J += ke * ke, oe += de * de;
+            const ve = O ? R.v.x : R.x, He = O ? R.v.y : -R.y, ke = ve - h, de = He - S;
+            V += ke * de, J += ke * ke, se += de * de;
           }
-          if (J >= 1e-9 && oe >= 1e-9) {
-            const R = V / Math.sqrt(J * oe);
+          if (J >= 1e-9 && se >= 1e-9) {
+            const R = V / Math.sqrt(J * se);
             C = Math.max(-1, Math.min(1, R));
           }
         }
-        const T = s({ m: d, b: $, rect: n.value, verticalX: L });
-        if (!T)
+        const z = s({ m: d, b: $, rect: n.value, verticalX: L });
+        if (!z)
           return {
             ...t,
             correlation: null,
@@ -331,19 +332,19 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
               color: Ke(t.color)
             }))
           };
-        const I = (T.x1 + T.x2) / 2, B = (T.y1 + T.y2) / 2, _ = { x: I, y: B };
+        const I = (z.x1 + z.x2) / 2, B = (z.y1 + z.y2) / 2, _ = { x: I, y: B };
         return {
           ...t,
           color: Ke(t.color),
           correlation: {
-            ...T,
+            ...z,
             coefficient: C
           },
           label: _,
           plots: t.plots.map((h) => {
             let S, V;
             L !== null ? (S = L, V = h.y) : Math.abs(d) < 1e-9 ? (S = h.x, V = $) : (S = (h.x + d * h.y - d * $) / (1 + d * d), V = (d * h.x + d * d * h.y + $) / (1 + d * d));
-            const J = h.x - S, oe = h.y - V, R = Math.sqrt(J * J + oe * oe);
+            const J = h.x - S, se = h.y - V, R = Math.sqrt(J * J + se * se);
             return {
               ...h,
               deviation: R,
@@ -353,9 +354,9 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
           })
         };
       });
-    }), bt = F(() => Math.max(...U.value.flatMap((l) => l.plots.map((s) => Math.abs(s.deviation)))));
-    function Kt() {
-      return U.value;
+    }), bt = T(() => Math.max(...j.value.flatMap((l) => l.plots.map((s) => Math.abs(s.deviation)))));
+    function Qt() {
+      return j.value;
     }
     function kt(l, s) {
       const t = Array.isArray(l) ? l.flatMap((B) => B.plots.map((_) => ({
@@ -374,23 +375,23 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
         const h = Math.floor((B - o) / g), S = Math.floor((_ - u) / L);
         d[h] || (d[h] = 0), $[S] || ($[S] = 0), d[h] += 1, $[S] += 1;
       });
-      const P = [], C = [];
+      const O = [], C = [];
       for (let B = 0; B < s; B += 1)
-        P.push(o + (B + 0.5) * g), C.push(u + (B + 0.5) * L);
-      const T = Math.max(...d), I = Math.max(...$);
-      return { x: d, y: $, avgX: P, avgY: C, maxX: T, maxY: I };
+        O.push(o + (B + 0.5) * g), C.push(u + (B + 0.5) * L);
+      const z = Math.max(...d), I = Math.max(...$);
+      return { x: d, y: $, avgX: O, avgY: C, maxX: z, maxY: I };
     }
-    const b = F(() => e.value.style.layout.marginalBars.tranches), A = F(() => kt(Ye.value, b.value)), Qt = F(() => {
+    const b = T(() => e.value.style.layout.marginalBars.tranches), A = T(() => kt(Ye.value, b.value)), el = T(() => {
       const l = n.value.top - e.value.style.layout.marginalBars.offset, s = n.value.right + e.value.style.layout.marginalBars.offset;
       return Ye.value.map((t) => {
         const o = kt(t, b.value);
         return {
           coords: o,
-          dX: kl(o.avgX.map((a, u) => ({
+          dX: Al(o.avgX.map((a, u) => ({
             x: a,
             y: l - o.x[u] / o.maxX * e.value.style.layout.marginalBars.size
           }))),
-          dY: bl(o.avgY.map((a, u) => ({
+          dY: Cl(o.avgY.map((a, u) => ({
             y: a,
             x: s + e.value.style.layout.marginalBars.size * o.y[u] / o.maxY
           }))),
@@ -399,27 +400,27 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
         };
       });
     }), Y = M(void 0), f = M(null), Re = M(null);
-    function je(l, s) {
+    function Ue(l, s) {
       Y.value = l.id, f.value = l;
       let t = "";
       e.value.events.datapointEnter && e.value.events.datapointEnter({ datapoint: l, seriesIndex: s }), Re.value = {
         datapoint: l,
         seriesIndex: s,
-        series: U.value,
+        series: j.value,
         config: e.value
       };
       const o = e.value.style.tooltip.customFormat;
-      Cl(o) && Al(() => o({
+      zl(o) && Pl(() => o({
         datapoint: l,
         seriesIndex: s,
-        series: U.value,
+        series: j.value,
         config: e.value
-      })) ? Pe.value = o({
+      })) ? Oe.value = o({
         datapoint: l,
         seriesIndex: s,
-        series: U.value,
+        series: j.value,
         config: e.value
-      }) : (l.clusterName && (t += `<div style="display:flex;gap:3px;align-items:center">${l.clusterName}</div>`), l.v.name && (t += `<div>${l.v.name}</div>`), t += `<div style="text-align:left;margin-top:6px;padding-top:6px;border-top:1px solid ${e.value.style.tooltip.borderColor}">`, t += `<div>${e.value.style.layout.dataLabels.xAxis.name}: <b>${isNaN(l.v.x) ? "-" : ue(
+      }) : (l.clusterName && (t += `<div style="display:flex;gap:3px;align-items:center">${l.clusterName}</div>`), l.v.name && (t += `<div>${l.v.name}</div>`), t += `<div style="text-align:left;margin-top:6px;padding-top:6px;border-top:1px solid ${e.value.style.tooltip.borderColor}">`, t += `<div>${e.value.style.layout.dataLabels.xAxis.name}: <b>${isNaN(l.v.x) ? "-" : ie(
         e.value.style.layout.plots.selectors.labels.x.formatter,
         l.v.x,
         Q({
@@ -429,7 +430,7 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
           r: e.value.style.tooltip.roundingValue
         }),
         { datapoint: l, seriesIndex: s }
-      )}</b></div>`, t += `<div>${e.value.style.layout.dataLabels.yAxis.name}: <b>${isNaN(l.v.y) ? "-" : ue(
+      )}</b></div>`, t += `<div>${e.value.style.layout.dataLabels.yAxis.name}: <b>${isNaN(l.v.y) ? "-" : ie(
         e.value.style.layout.plots.selectors.labels.y.formatter,
         l.v.y,
         Q({
@@ -442,37 +443,37 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
       )}</b></div>`, t += `${e.value.style.layout.plots.deviation.translation}: <b>${Q({
         v: l.deviation,
         r: e.value.style.layout.plots.deviation.roundingValue
-      })}</b>`, t += "</div>", Pe.value = `<div>${t}</div>`), ze.value = !0;
+      })}</b>`, t += "</div>", Oe.value = `<div>${t}</div>`), Pe.value = !0;
     }
-    function Ce(l, s) {
-      e.value.events.datapointLeave && e.value.events.datapointLeave({ datapoint: l, seriesIndex: s }), ze.value = !1, Y.value = void 0, f.value = null;
+    function Ae(l, s) {
+      e.value.events.datapointLeave && e.value.events.datapointLeave({ datapoint: l, seriesIndex: s }), Pe.value = !1, Y.value = void 0, f.value = null;
     }
-    function Ue(l, s) {
+    function je(l, s) {
       e.value.events.datapointClick && e.value.events.datapointClick({ datapoint: l, seriesIndex: s });
     }
     function wt(l) {
-      N.value.includes(l) ? N.value = N.value.filter((s) => s !== l) : N.value.length < Fe.value.length - 1 && N.value.push(l);
+      N.value.includes(l) ? N.value = N.value.filter((s) => s !== l) : N.value.length < We.value.length - 1 && N.value.push(l);
     }
     function Ve(l = null) {
-      hl(() => {
-        const s = ["", e.value.table.translations.correlationCoefficient, e.value.table.translations.nbrPlots, `${e.value.style.layout.dataLabels.xAxis.name} ${e.value.table.translations.average}`, `${e.value.style.layout.dataLabels.yAxis.name} ${e.value.table.translations.average}`], t = U.value.map((u) => [
+      bl(() => {
+        const s = ["", e.value.table.translations.correlationCoefficient, e.value.table.translations.nbrPlots, `${e.value.style.layout.dataLabels.xAxis.name} ${e.value.table.translations.average}`, `${e.value.style.layout.dataLabels.yAxis.name} ${e.value.table.translations.average}`], t = j.value.map((u) => [
           u.name,
           u.correlation.coefficient,
           u.plots.length,
           u.plots.map((i) => i.v.x).reduce((i, p) => i + p, 0) / u.plots.length,
           u.plots.map((i) => i.v.y).reduce((i, p) => i + p, 0) / u.plots.length
-        ]), o = [[e.value.style.title.text], [e.value.style.title.subtitle.text], [[""], [""], [""]]].concat([s]).concat(t), a = $l(o);
-        l ? l(a) : Ml({ csvContent: a, title: e.value.style.title.text || "vue-ui-heatmap" });
+        ]), o = [[e.value.style.title.text], [e.value.style.title.subtitle.text], [[""], [""], [""]]].concat([s]).concat(t), a = Bl(o);
+        l ? l(a) : Tl({ csvContent: a, title: e.value.style.title.text || "vue-ui-heatmap" });
       });
     }
-    const Ae = F(() => {
+    const Se = T(() => {
       const l = [
         e.value.table.translations.series,
         e.value.table.translations.correlationCoefficient,
         e.value.table.translations.nbrPlots,
         `${e.value.style.layout.dataLabels.xAxis.name} ${e.value.table.translations.average}`,
         `${e.value.style.layout.dataLabels.yAxis.name} ${e.value.table.translations.average}`
-      ], s = U.value.map((o) => [
+      ], s = j.value.map((o) => [
         {
           shape: o.shape,
           content: o.name,
@@ -506,13 +507,13 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
     function Mt() {
       H.value.showTooltip = !H.value.showTooltip;
     }
-    const Se = M(!1);
-    function qe() {
-      Se.value = !Se.value;
+    const Le = M(!1);
+    function Ge() {
+      Le.value = !Le.value;
     }
-    async function el({ scale: l = 2 } = {}) {
+    async function tl({ scale: l = 2 } = {}) {
       if (!te.value) return;
-      const { width: s, height: t } = te.value.getBoundingClientRect(), o = s / t, { imageUri: a, base64: u } = await Nl({ domElement: te.value, base64: !0, img: !0, scale: l });
+      const { width: s, height: t } = te.value.getBoundingClientRect(), o = s / t, { imageUri: a, base64: u } = await Vl({ domElement: te.value, base64: !0, img: !0, scale: l });
       return {
         imageUri: a,
         base64: u,
@@ -522,13 +523,13 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
         aspectRatio: o
       };
     }
-    function tl(l) {
+    function ll(l) {
       ge.value = l, e.value.style.layout.marginalBars.highlighter.highlightBothAxes && (me.value = A.value.y.length - 2 - l);
     }
-    function ll(l) {
+    function al(l) {
       me.value = l, e.value.style.layout.marginalBars.highlighter.highlightBothAxes && (ge.value = l);
     }
-    function Ge() {
+    function qe() {
       ge.value = null, me.value = null;
     }
     const Ct = {
@@ -540,7 +541,7 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
       pentagon: 1.3,
       hexagon: 1.3
     }, k = (l) => l.toFixed(3);
-    function al({ shape: l = "circle", cx: s, cy: t, r: o }) {
+    function ol({ shape: l = "circle", cx: s, cy: t, r: o }) {
       if (!e.value.usePerformanceMode) return "";
       const a = Ct[l] * o;
       switch (l) {
@@ -597,37 +598,37 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
         }
       }
     }
-    const ol = F(() => {
+    const sl = T(() => {
       if (!e.value.usePerformanceMode) return [""];
       const { left: l, right: s, top: t, bottom: o } = n.value, a = Math.max(1, (s - l) * (o - t)), u = (d) => d / a * 1e4, i = 2.5, p = 1e3, v = e.value.style.layout.plots.stroke, g = e.value.style.layout.plots.strokeWidth, L = e.value.style.layout.plots.opacity;
-      return U.value.map((d) => {
+      return j.value.map((d) => {
         const $ = [];
         for (const C of d.plots) {
-          const T = C.x, I = C.y;
-          if (T < l || T > s || I < t || I > o) continue;
+          const z = C.x, I = C.y;
+          if (z < l || z > s || I < t || I > o) continue;
           const B = Math.max(e.value.style.layout.plots.radius, C.weight);
-          $.push(al({
+          $.push(ol({
             shape: d.shape || "circle",
-            cx: T,
+            cx: z,
             cy: I,
             r: B
           }));
         }
         if (!$.length) return null;
-        const P = u(d.plots.length) > i || d.plots.length > p;
+        const O = u(d.plots.length) > i || d.plots.length > p;
         return {
           id: d.id,
           d: $.join(""),
-          fill: Te(d.color, L * 100),
-          stroke: P ? "none" : v,
-          strokeWidth: P ? 0 : g,
+          fill: ze(d.color, L * 100),
+          stroke: O ? "none" : v,
+          strokeWidth: O ? 0 : g,
           strokeOpacity: 1
         };
       }).filter(Boolean);
     });
-    function sl() {
+    function nl() {
       return e.value.usePerformanceMode ? (l) => {
-        const s = Ie.value;
+        const s = Me.value;
         if (!s) return;
         const t = s.createSVGPoint();
         t.x = l.clientX, t.y = l.clientY;
@@ -635,37 +636,37 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
         if (!o) return;
         const a = o.inverse(), u = t.matrixTransform(a), i = 8, p = i * i;
         let v = null, g = 1 / 0, L = -1;
-        if (U.value.forEach((d, $) => {
-          d.plots.forEach((P) => {
-            const C = P.x - u.x, T = P.y - u.y, I = C * C + T * T;
-            I <= p && I < g && (g = I, v = P, L = $);
+        if (j.value.forEach((d, $) => {
+          d.plots.forEach((O) => {
+            const C = O.x - u.x, z = O.y - u.y, I = C * C + z * z;
+            I <= p && I < g && (g = I, v = O, L = $);
           });
         }), v)
-          Y.value !== v.id && (Y.value = v.id, je(v, L));
+          Y.value !== v.id && (Y.value = v.id, Ue(v, L));
         else if (Y.value) {
           const d = f.value;
-          Y.value = void 0, Ce(d, L);
+          Y.value = void 0, Ae(d, L);
         }
       } : () => null;
     }
-    const At = sl();
-    function nl() {
+    const At = nl();
+    function ul() {
       if (Y.value) {
         const l = f.value;
-        Y.value = void 0, Ce(l, null);
+        Y.value = void 0, Ae(l, null);
       }
     }
-    function ul(l) {
+    function il(l) {
       const s = f.value;
       if (s) {
-        const t = U.value.findIndex((o) => o.id === s.clusterId);
-        Ue(s, t >= 0 ? t : 0);
+        const t = j.value.findIndex((o) => o.id === s.clusterId);
+        je(s, t >= 0 ? t : 0);
       }
     }
-    const be = F(() => {
+    const be = T(() => {
       const l = e.value.table.useDialog && !e.value.table.show, s = H.value.showTable;
       return {
-        component: l ? Ut : It,
+        component: l ? Vt : Xt,
         title: `${e.value.style.title.text}${e.value.style.title.subtitle.text ? `: ${e.value.style.title.subtitle.text}` : ""}`,
         props: l ? {
           backgroundColor: e.value.table.th.backgroundColor,
@@ -692,40 +693,55 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
         }
       };
     });
-    Be(() => H.value.showTable, (l) => {
+    Te(() => H.value.showTable, (l) => {
       e.value.table.show || (l && e.value.table.useDialog && xe.value ? xe.value.open() : "close" in xe.value && xe.value.close());
     });
     function St() {
-      H.value.showTable = !1, Oe.value && Oe.value.setTableIconState(!1);
+      H.value.showTable = !1, De.value && De.value.setTableIconState(!1);
     }
-    return Ft({
-      getData: Kt,
-      getImage: el,
+    const rl = T(() => e.value.style.backgroundColor), vl = T(() => e.value.style.legend), yl = T(() => e.value.style.title), { exportSvg: cl, getSvg: dl } = Il({
+      svg: Me,
+      title: yl,
+      legend: vl,
+      legendItems: oe,
+      backgroundColor: rl
+    });
+    async function Lt({ isCb: l }) {
+      if (l) {
+        const { blob: s, url: t, text: o, dataUrl: a } = await dl();
+        e.value.userOptions.callbacks.svg({ blob: s, url: t, text: o, dataUrl: a });
+      } else
+        cl();
+    }
+    return Wt({
+      getData: Qt,
+      getImage: tl,
       generatePdf: gt,
       generateCsv: Ve,
       generateImage: mt,
+      generateSvg: Lt,
       toggleTable: $t,
       toggleTooltip: Mt,
-      toggleAnnotator: qe,
+      toggleAnnotator: Ge,
       toggleFullscreen: _t
     }), (l, s) => (r(), y("div", {
-      class: Bt(`vue-ui-scatter ${re.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"}`),
+      class: Tt(`vue-data-ui-component vue-ui-scatter ${re.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"}`),
       ref_key: "scatterChart",
       ref: te,
       id: `vue-ui-scatter_${W.value}`,
-      style: ne(`font-family:${e.value.style.fontFamily};width:100%; text-align:center;background:${e.value.style.backgroundColor};${e.value.responsive ? "height: 100%" : ""}`),
+      style: ue(`font-family:${e.value.style.fontFamily};width:100%; text-align:center;background:${e.value.style.backgroundColor};${e.value.responsive ? "height: 100%" : ""}`),
       onMouseenter: s[5] || (s[5] = () => c(yt)(!0)),
       onMouseleave: s[6] || (s[6] = () => c(yt)(!1))
     }, [
-      e.value.userOptions.buttons.annotator ? (r(), le(c(Yt), {
+      e.value.userOptions.buttons.annotator ? (r(), le(c(Rt), {
         key: 0,
-        svgRef: c(Ie),
+        svgRef: c(Me),
         backgroundColor: e.value.style.backgroundColor,
         color: e.value.style.color,
-        active: Se.value,
-        onClose: qe
+        active: Le.value,
+        onClose: Ge
       }, null, 8, ["svgRef", "backgroundColor", "color", "active"])) : x("", !0),
-      Zt.value ? (r(), y("div", {
+      Jt.value ? (r(), y("div", {
         key: 1,
         ref_key: "noTitle",
         ref: st,
@@ -738,7 +754,7 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
         ref: lt,
         style: "width:100%;background:transparent"
       }, [
-        (r(), le(Wl, {
+        (r(), le(jl, {
           key: `title_${nt.value}`,
           config: {
             title: {
@@ -754,10 +770,10 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
       ], 512)) : x("", !0),
       w("div", {
         id: `legend-top-${W.value}`
-      }, null, 8, Yl),
-      e.value.userOptions.show && et.value && (c(ct) || c(Ne)) ? (r(), le(c(Rt), {
+      }, null, 8, Hl),
+      e.value.userOptions.show && et.value && (c(ct) || c(Ie)) ? (r(), le(c(Ut), {
         ref_key: "userOptionsRef",
-        ref: Oe,
+        ref: De,
         key: `user_options_${tt.value}`,
         backgroundColor: e.value.style.backgroundColor,
         color: e.value.style.color,
@@ -767,6 +783,7 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
         hasTooltip: e.value.userOptions.buttons.tooltip && e.value.style.tooltip.show,
         hasPdf: e.value.userOptions.buttons.pdf,
         hasImg: e.value.userOptions.buttons.img,
+        hasSvg: e.value.userOptions.buttons.svg,
         hasXls: e.value.userOptions.buttons.csv,
         hasTable: e.value.userOptions.buttons.table,
         hasFullscreen: e.value.userOptions.buttons.fullscreen,
@@ -776,7 +793,7 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
         chartElement: te.value,
         position: e.value.userOptions.position,
         hasAnnotator: e.value.userOptions.buttons.annotator,
-        isAnnotation: Se.value,
+        isAnnotation: Le.value,
         callbacks: e.value.userOptions.callbacks,
         printScale: e.value.userOptions.print.scale,
         tableDialog: e.value.table.useDialog,
@@ -784,113 +801,114 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
         onGeneratePdf: c(gt),
         onGenerateCsv: Ve,
         onGenerateImage: c(mt),
+        onGenerateSvg: Lt,
         onToggleTable: $t,
         onToggleTooltip: Mt,
-        onToggleAnnotator: qe,
-        style: ne({
-          visibility: c(ct) ? c(Ne) ? "visible" : "hidden" : "visible"
+        onToggleAnnotator: Ge,
+        style: ue({
+          visibility: c(ct) ? c(Ie) ? "visible" : "hidden" : "visible"
         })
-      }, Tt({ _: 2 }, [
+      }, zt({ _: 2 }, [
         l.$slots.menuIcon ? {
           name: "menuIcon",
           fn: X(({ isOpen: t, color: o }) => [
-            j(l.$slots, "menuIcon", pe(fe({ isOpen: t, color: o })), void 0, !0)
+            U(l.$slots, "menuIcon", pe(fe({ isOpen: t, color: o })), void 0, !0)
           ]),
           key: "0"
         } : void 0,
         l.$slots.optionTooltip ? {
           name: "optionTooltip",
           fn: X(() => [
-            j(l.$slots, "optionTooltip", {}, void 0, !0)
+            U(l.$slots, "optionTooltip", {}, void 0, !0)
           ]),
           key: "1"
         } : void 0,
         l.$slots.optionPdf ? {
           name: "optionPdf",
           fn: X(() => [
-            j(l.$slots, "optionPdf", {}, void 0, !0)
+            U(l.$slots, "optionPdf", {}, void 0, !0)
           ]),
           key: "2"
         } : void 0,
         l.$slots.optionCsv ? {
           name: "optionCsv",
           fn: X(() => [
-            j(l.$slots, "optionCsv", {}, void 0, !0)
+            U(l.$slots, "optionCsv", {}, void 0, !0)
           ]),
           key: "3"
         } : void 0,
         l.$slots.optionImg ? {
           name: "optionImg",
           fn: X(() => [
-            j(l.$slots, "optionImg", {}, void 0, !0)
+            U(l.$slots, "optionImg", {}, void 0, !0)
           ]),
           key: "4"
         } : void 0,
         l.$slots.optionTable ? {
           name: "optionTable",
           fn: X(() => [
-            j(l.$slots, "optionTable", {}, void 0, !0)
+            U(l.$slots, "optionTable", {}, void 0, !0)
           ]),
           key: "5"
         } : void 0,
         l.$slots.optionFullscreen ? {
           name: "optionFullscreen",
           fn: X(({ toggleFullscreen: t, isFullscreen: o }) => [
-            j(l.$slots, "optionFullscreen", pe(fe({ toggleFullscreen: t, isFullscreen: o })), void 0, !0)
+            U(l.$slots, "optionFullscreen", pe(fe({ toggleFullscreen: t, isFullscreen: o })), void 0, !0)
           ]),
           key: "6"
         } : void 0,
         l.$slots.optionAnnotator ? {
           name: "optionAnnotator",
           fn: X(({ toggleAnnotator: t, isAnnotator: o }) => [
-            j(l.$slots, "optionAnnotator", pe(fe({ toggleAnnotator: t, isAnnotator: o })), void 0, !0)
+            U(l.$slots, "optionAnnotator", pe(fe({ toggleAnnotator: t, isAnnotator: o })), void 0, !0)
           ]),
           key: "7"
         } : void 0
-      ]), 1032, ["backgroundColor", "color", "isImaging", "isPrinting", "uid", "hasTooltip", "hasPdf", "hasImg", "hasXls", "hasTable", "hasFullscreen", "isTooltip", "isFullscreen", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "callbacks", "printScale", "tableDialog", "onGeneratePdf", "onGenerateImage", "style"])) : x("", !0),
+      ]), 1032, ["backgroundColor", "color", "isImaging", "isPrinting", "uid", "hasTooltip", "hasPdf", "hasImg", "hasSvg", "hasXls", "hasTable", "hasFullscreen", "isTooltip", "isFullscreen", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "callbacks", "printScale", "tableDialog", "onGeneratePdf", "onGenerateImage", "style"])) : x("", !0),
       (r(), y("svg", {
         ref_key: "svgRef",
-        ref: Ie,
-        xmlns: c(wl),
-        class: Bt({ "vue-data-ui-fullscreen--on": re.value, "vue-data-ui-fulscreen--off": !re.value, animated: e.value.useCssAnimation }),
-        viewBox: `0 0 ${D.value.width <= 0 ? 10 : D.value.width} ${D.value.height <= 0 ? 10 : D.value.height}`,
-        style: ne(`max-width:100%;overflow:visible;background:transparent;color:${e.value.style.color}`),
-        onMouseleave: Ge
+        ref: Me,
+        xmlns: c(Sl),
+        class: Tt({ "vue-data-ui-fullscreen--on": re.value, "vue-data-ui-fulscreen--off": !re.value, animated: e.value.useCssAnimation }),
+        viewBox: `0 0 ${E.value.width <= 0 ? 10 : E.value.width} ${E.value.height <= 0 ? 10 : E.value.height}`,
+        style: ue(`max-width:100%;overflow:visible;background:transparent;color:${e.value.style.color}`),
+        onMouseleave: qe
       }, [
         $e(c(jt)),
         l.$slots["chart-background"] ? (r(), y("foreignObject", {
           key: 0,
           x: 0,
           y: 0,
-          width: D.value.width <= 0 ? 10 : D.value.width,
-          height: D.value.height <= 0 ? 10 : D.value.height,
+          width: E.value.width <= 0 ? 10 : E.value.width,
+          height: E.value.height <= 0 ? 10 : E.value.height,
           style: {
             pointerEvents: "none"
           }
         }, [
-          j(l.$slots, "chart-background", {}, void 0, !0)
-        ], 8, jl)) : x("", !0),
-        e.value.style.layout.axis.show ? (r(), y("g", Ul, [
+          U(l.$slots, "chart-background", {}, void 0, !0)
+        ], 8, Jl)) : x("", !0),
+        e.value.style.layout.axis.show ? (r(), y("g", Kl, [
           w("line", {
-            x1: E.value.x,
-            x2: E.value.x,
+            x1: F.value.x,
+            x2: F.value.x,
             y1: n.value.top,
             y2: n.value.bottom,
             stroke: e.value.style.layout.axis.stroke,
             "stroke-width": e.value.style.layout.axis.strokeWidth,
             "stroke-linecap": "round"
-          }, null, 8, Vl),
+          }, null, 8, Ql),
           w("line", {
             x1: n.value.left,
             x2: n.value.right,
-            y1: E.value.y,
-            y2: E.value.y,
+            y1: F.value.y,
+            y2: F.value.y,
             stroke: e.value.style.layout.axis.stroke,
             "stroke-width": e.value.style.layout.axis.strokeWidth,
             "stroke-linecap": "round"
-          }, null, 8, ql)
+          }, null, 8, ea)
         ])) : x("", !0),
-        e.value.style.layout.marginalBars.show ? (r(), y("g", Gl, [
+        e.value.style.layout.marginalBars.show ? (r(), y("g", ta, [
           w("defs", null, [
             w("linearGradient", {
               id: `marginal_x_${W.value}`,
@@ -902,12 +920,12 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
               w("stop", {
                 offset: "0%",
                 "stop-color": e.value.style.layout.marginalBars.fill
-              }, null, 8, Zl),
+              }, null, 8, aa),
               w("stop", {
                 offset: "100%",
                 "stop-color": e.value.style.backgroundColor
-              }, null, 8, Jl)
-            ], 8, Hl),
+              }, null, 8, oa)
+            ], 8, la),
             w("linearGradient", {
               id: `marginal_y_${W.value}`,
               x1: "0%",
@@ -918,12 +936,12 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
               w("stop", {
                 offset: "0%",
                 "stop-color": e.value.style.backgroundColor
-              }, null, 8, Ql),
+              }, null, 8, na),
               w("stop", {
                 offset: "100%",
                 "stop-color": e.value.style.layout.marginalBars.fill
-              }, null, 8, ea)
-            ], 8, Kl)
+              }, null, 8, ua)
+            ], 8, sa)
           ]),
           (r(!0), y(Z, null, K(A.value.x, (t, o) => (r(), y("g", null, [
             t && A.value.avgX[o] ? (r(), y("rect", {
@@ -933,11 +951,11 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
               width: n.value.width / b.value <= 0 ? 1e-4 : n.value.width / b.value,
               height: t / A.value.maxX * e.value.style.layout.marginalBars.size <= 0 ? 1e-4 : t / A.value.maxX * e.value.style.layout.marginalBars.size,
               fill: e.value.style.layout.marginalBars.useGradient ? `url(#marginal_x_${W.value})` : e.value.style.layout.marginalBars.fill,
-              style: ne([`opacity:${e.value.style.layout.marginalBars.opacity}`, { "pointer-events": "none" }]),
+              style: ue([`opacity:${e.value.style.layout.marginalBars.opacity}`, { "pointer-events": "none" }]),
               stroke: e.value.style.backgroundColor,
               "stroke-width": e.value.style.layout.marginalBars.strokeWidth,
               rx: e.value.style.layout.marginalBars.borderRadius
-            }, null, 12, ta)) : x("", !0),
+            }, null, 12, ia)) : x("", !0),
             A.value.avgX[o] ? (r(), y("rect", {
               key: 1,
               x: A.value.avgX[o] - n.value.width / b.value / 2,
@@ -945,10 +963,10 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
               width: n.value.width / b.value <= 0 ? 1e-4 : n.value.width / b.value,
               height: Math.max(0.1, e.value.style.layout.marginalBars.size),
               fill: "transparent",
-              onMouseenter: (a) => tl(o),
-              onMouseleave: s[0] || (s[0] = (a) => Ge())
-            }, null, 40, la)) : x("", !0),
-            A.value.avgX[o] && ge.value != null && ge.value === o ? (r(), y("g", aa, [
+              onMouseenter: (a) => ll(o),
+              onMouseleave: s[0] || (s[0] = (a) => qe())
+            }, null, 40, ra)) : x("", !0),
+            A.value.avgX[o] && ge.value != null && ge.value === o ? (r(), y("g", va, [
               w("rect", {
                 x: A.value.avgX[o] - n.value.width / b.value / 2,
                 y: n.value.top,
@@ -956,7 +974,7 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
                 height: n.value.height,
                 fill: e.value.style.layout.marginalBars.highlighter.color,
                 "fill-opacity": e.value.style.layout.marginalBars.highlighter.opacity
-              }, null, 8, oa),
+              }, null, 8, ya),
               w("line", {
                 x1: A.value.avgX[o] - n.value.width / b.value / 2,
                 x2: A.value.avgX[o] - n.value.width / b.value / 2,
@@ -966,7 +984,7 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
                 "stroke-dasharray": e.value.style.layout.marginalBars.highlighter.strokeDasharray,
                 "stroke-width": e.value.style.layout.marginalBars.highlighter.strokeWidth,
                 style: { transition: "none !important", animation: "none !important" }
-              }, null, 8, sa),
+              }, null, 8, ca),
               w("line", {
                 x1: A.value.avgX[o] - n.value.width / b.value / 2 + (n.value.width / b.value <= 0 ? 1e-4 : n.value.width / b.value),
                 x2: A.value.avgX[o] - n.value.width / b.value / 2 + (n.value.width / b.value <= 0 ? 1e-4 : n.value.width / b.value),
@@ -976,7 +994,7 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
                 "stroke-dasharray": e.value.style.layout.marginalBars.highlighter.strokeDasharray,
                 "stroke-width": e.value.style.layout.marginalBars.highlighter.strokeWidth,
                 style: { transition: "none !important", animation: "none !important" }
-              }, null, 8, na)
+              }, null, 8, da)
             ])) : x("", !0)
           ]))), 256)),
           (r(!0), y(Z, null, K(A.value.y, (t, o) => (r(), y("g", null, [
@@ -987,11 +1005,11 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
               height: n.value.height / b.value <= 0 ? 1e-4 : n.value.height / b.value,
               width: t / A.value.maxY * e.value.style.layout.marginalBars.size <= 0 ? 1e-4 : t / A.value.maxY * e.value.style.layout.marginalBars.size,
               fill: e.value.style.layout.marginalBars.useGradient ? `url(#marginal_y_${W.value})` : e.value.style.layout.marginalBars.fill,
-              style: ne([`opacity:${e.value.style.layout.marginalBars.opacity}`, { "pointer-events": "none" }]),
+              style: ue([`opacity:${e.value.style.layout.marginalBars.opacity}`, { "pointer-events": "none" }]),
               stroke: e.value.style.backgroundColor,
               "stroke-width": e.value.style.layout.marginalBars.strokeWidth,
               rx: e.value.style.layout.marginalBars.borderRadius
-            }, null, 12, ua)) : x("", !0),
+            }, null, 12, ha)) : x("", !0),
             A.value.avgY[o] ? (r(), y("rect", {
               key: 1,
               x: n.value.right + e.value.style.layout.marginalBars.offset,
@@ -999,10 +1017,10 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
               width: Math.max(0.1, e.value.style.layout.marginalBars.size),
               height: n.value.height / b.value <= 0 ? 1e-4 : n.value.height / b.value,
               fill: "transparent",
-              onMouseenter: (a) => ll(o),
-              onMouseleave: s[1] || (s[1] = (a) => Ge())
-            }, null, 40, ia)) : x("", !0),
-            A.value.avgY[o] && me.value != null && me.value === o ? (r(), y("g", ra, [
+              onMouseenter: (a) => al(o),
+              onMouseleave: s[1] || (s[1] = (a) => qe())
+            }, null, 40, pa)) : x("", !0),
+            A.value.avgY[o] && me.value != null && me.value === o ? (r(), y("g", fa, [
               w("rect", {
                 x: n.value.left,
                 y: A.value.avgY[o] - n.value.height / b.value / 2,
@@ -1010,31 +1028,31 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
                 height: n.value.height / b.value <= 0 ? 1e-4 : n.value.height / b.value,
                 fill: e.value.style.layout.marginalBars.highlighter.color,
                 "fill-opacity": e.value.style.layout.marginalBars.highlighter.opacity
-              }, null, 8, va),
+              }, null, 8, ga),
               w("line", {
                 x1: n.value.left,
-                x2: D.value.width,
+                x2: E.value.width,
                 y1: A.value.avgY[o] - n.value.height / b.value / 2,
                 y2: A.value.avgY[o] - n.value.height / b.value / 2,
                 stroke: e.value.style.layout.marginalBars.highlighter.stroke,
                 "stroke-dasharray": e.value.style.layout.marginalBars.highlighter.strokeDasharray,
                 "stroke-width": e.value.style.layout.marginalBars.highlighter.strokeWidth,
                 style: { transition: "none !important", animation: "none !important" }
-              }, null, 8, ya),
+              }, null, 8, ma),
               w("line", {
                 x1: n.value.left,
-                x2: D.value.width,
+                x2: E.value.width,
                 y1: A.value.avgY[o] - n.value.height / b.value / 2 + (n.value.height / b.value <= 0 ? 1e-4 : n.value.height / b.value),
                 y2: A.value.avgY[o] - n.value.height / b.value / 2 + (n.value.height / b.value <= 0 ? 1e-4 : n.value.height / b.value),
                 stroke: e.value.style.layout.marginalBars.highlighter.stroke,
                 "stroke-dasharray": e.value.style.layout.marginalBars.highlighter.strokeDasharray,
                 "stroke-width": e.value.style.layout.marginalBars.highlighter.strokeWidth,
                 style: { transition: "none !important", animation: "none !important" }
-              }, null, 8, ca)
+              }, null, 8, xa)
             ])) : x("", !0)
           ]))), 256)),
-          e.value.style.layout.marginalBars.showLines ? (r(), y("g", da, [
-            (r(!0), y(Z, null, K(Qt.value, (t) => (r(), y(Z, null, [
+          e.value.style.layout.marginalBars.showLines ? (r(), y("g", ba, [
+            (r(!0), y(Z, null, K(el.value, (t) => (r(), y(Z, null, [
               N.value.includes(t.id) ? x("", !0) : (r(), y("path", {
                 key: 0,
                 d: `M ${t.dX}`,
@@ -1043,7 +1061,7 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
                 "stroke-linecap": "round",
                 "stroke-linejoin": "round",
                 fill: "none"
-              }, null, 8, ha)),
+              }, null, 8, ka)),
               N.value.includes(t.id) ? x("", !0) : (r(), y("path", {
                 key: 1,
                 d: `M ${t.dX}`,
@@ -1052,7 +1070,7 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
                 "stroke-linecap": "round",
                 "stroke-linejoin": "round",
                 fill: "none"
-              }, null, 8, pa)),
+              }, null, 8, wa)),
               N.value.includes(t.id) ? x("", !0) : (r(), y("path", {
                 key: 2,
                 d: `M ${t.dY}`,
@@ -1061,7 +1079,7 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
                 "stroke-linecap": "round",
                 "stroke-linejoin": "round",
                 fill: "none"
-              }, null, 8, fa)),
+              }, null, 8, _a)),
               N.value.includes(t.id) ? x("", !0) : (r(), y("path", {
                 key: 3,
                 d: `M ${t.dY}`,
@@ -1070,50 +1088,50 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
                 "stroke-linecap": "round",
                 "stroke-linejoin": "round",
                 fill: "none"
-              }, null, 8, ga))
+              }, null, 8, $a))
             ], 64))), 256))
           ])) : x("", !0)
         ])) : x("", !0),
-        e.value.style.layout.plots.giftWrap.show ? (r(), y("g", ma, [
-          (r(!0), y(Z, null, K(U.value, (t, o) => (r(), y("g", null, [
+        e.value.style.layout.plots.giftWrap.show ? (r(), y("g", Ma, [
+          (r(!0), y(Z, null, K(j.value, (t, o) => (r(), y("g", null, [
             t.plots.length > 2 ? (r(), y("polygon", {
               key: 0,
-              points: c(_l)({ series: t.plots }),
-              fill: c(Te)(t.color, e.value.style.layout.plots.giftWrap.fillOpacity * 100),
+              points: c(Ll)({ series: t.plots }),
+              fill: c(ze)(t.color, e.value.style.layout.plots.giftWrap.fillOpacity * 100),
               "stroke-width": e.value.style.layout.plots.giftWrap.strokeWidth,
               "stroke-dasharray": e.value.style.layout.plots.giftWrap.strokeDasharray,
               stroke: t.color,
               "stroke-linejoin": "round",
               "stroke-linecap": "round"
-            }, null, 8, xa)) : x("", !0)
+            }, null, 8, Ca)) : x("", !0)
           ]))), 256))
         ])) : x("", !0),
-        e.value.usePerformanceMode ? x("", !0) : (r(!0), y(Z, { key: 4 }, K(U.value, (t, o) => (r(), y("g", null, [
-          !t.shape || t.shape === "circle" ? (r(), y("g", ba, [
+        e.value.usePerformanceMode ? x("", !0) : (r(!0), y(Z, { key: 4 }, K(j.value, (t, o) => (r(), y("g", null, [
+          !t.shape || t.shape === "circle" ? (r(), y("g", Aa, [
             (r(!0), y(Z, null, K(t.plots, (a, u) => (r(), y("circle", {
               cx: a.x,
               cy: a.y,
               r: Y.value && Y.value === a.id ? a.weight * 2 : a.weight,
-              fill: c(Te)(t.color, e.value.style.layout.plots.opacity * 100),
+              fill: c(ze)(t.color, e.value.style.layout.plots.opacity * 100),
               stroke: e.value.style.layout.plots.stroke,
               "stroke-width": e.value.style.layout.plots.strokeWidth,
-              style: ne(`opacity:${Y.value && Y.value === a.id ? 1 : e.value.style.layout.plots.significance.useDistanceOpacity ? 1 - Math.abs(a.deviation) / bt.value : e.value.style.layout.plots.significance.show && Math.abs(a.deviation) > e.value.style.layout.plots.significance.deviationThreshold ? e.value.style.layout.plots.significance.opacity : 1}`),
-              onMouseover: (i) => je(a, o),
-              onMouseleave: (i) => Ce(a, o),
-              onClick: (i) => Ue(a, o)
-            }, null, 44, ka))), 256))
-          ])) : (r(), y("g", wa, [
+              style: ue(`opacity:${Y.value && Y.value === a.id ? 1 : e.value.style.layout.plots.significance.useDistanceOpacity ? 1 - Math.abs(a.deviation) / bt.value : e.value.style.layout.plots.significance.show && Math.abs(a.deviation) > e.value.style.layout.plots.significance.deviationThreshold ? e.value.style.layout.plots.significance.opacity : 1}`),
+              onMouseover: (i) => Ue(a, o),
+              onMouseleave: (i) => Ae(a, o),
+              onClick: (i) => je(a, o)
+            }, null, 44, Sa))), 256))
+          ])) : (r(), y("g", La, [
             (r(!0), y(Z, null, K(t.plots, (a, u) => (r(), le(Qe, {
               plot: { x: a.x, y: a.y },
               radius: Y.value && Y.value === a.id ? a.weight * 2 : a.weight,
               shape: t.shape,
-              color: c(Te)(t.color, e.value.style.layout.plots.opacity * 100),
+              color: c(ze)(t.color, e.value.style.layout.plots.opacity * 100),
               stroke: e.value.style.layout.plots.stroke,
               strokeWidth: e.value.style.layout.plots.strokeWidth,
-              style: ne(`opacity:${Y.value && Y.value === a.id ? 1 : e.value.style.layout.plots.significance.useDistanceOpacity ? 1 - Math.abs(a.deviation) / bt.value : e.value.style.layout.plots.significance.show && Math.abs(a.deviation) > e.value.style.layout.plots.significance.deviationThreshold ? e.value.style.layout.plots.significance.opacity : 1}`),
-              onMouseover: (i) => je(a, o),
-              onMouseleave: (i) => Ce(a, o),
-              onClick: (i) => Ue(a, o)
+              style: ue(`opacity:${Y.value && Y.value === a.id ? 1 : e.value.style.layout.plots.significance.useDistanceOpacity ? 1 - Math.abs(a.deviation) / bt.value : e.value.style.layout.plots.significance.show && Math.abs(a.deviation) > e.value.style.layout.plots.significance.deviationThreshold ? e.value.style.layout.plots.significance.opacity : 1}`),
+              onMouseover: (i) => Ue(a, o),
+              onMouseleave: (i) => Ae(a, o),
+              onClick: (i) => je(a, o)
             }, null, 8, ["plot", "radius", "shape", "color", "stroke", "strokeWidth", "style", "onMouseover", "onMouseleave", "onClick"]))), 256))
           ]))
         ]))), 256)),
@@ -1121,7 +1139,7 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
           w("g", {
             "clip-path": `url(#clip_path_${W.value})`
           }, [
-            (r(!0), y(Z, null, K(ol.value, (t) => (r(), y("path", {
+            (r(!0), y(Z, null, K(sl.value, (t) => (r(), y("path", {
               key: t.id,
               d: t.d,
               fill: t.fill,
@@ -1130,9 +1148,9 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
               "stroke-opacity": t.strokeOpacity,
               "vector-effect": "non-scaling-stroke",
               "paint-order": "fill"
-            }, null, 8, $a))), 128))
-          ], 8, _a),
-          f.value && e.value.style.layout.plots.selectors.show ? (r(), y("g", Ma, [
+            }, null, 8, Ta))), 128))
+          ], 8, Ba),
+          f.value && e.value.style.layout.plots.selectors.show ? (r(), y("g", za, [
             $e(Qe, {
               shape: f.value.shape || "circle",
               color: f.value.color,
@@ -1149,13 +1167,13 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
             height: Math.max(1e-4, n.value.height),
             fill: "transparent",
             onMousemove: s[2] || (s[2] = (...t) => c(At) && c(At)(...t)),
-            onMouseleave: nl,
-            onClick: ul
-          }, null, 40, Ca)
+            onMouseleave: ul,
+            onClick: il
+          }, null, 40, Pa)
         ], 64)) : x("", !0),
-        f.value && e.value.style.layout.plots.selectors.show ? (r(), y("g", Aa, [
+        f.value && e.value.style.layout.plots.selectors.show ? (r(), y("g", Oa, [
           w("line", {
-            x1: E.value.x,
+            x1: F.value.x,
             x2: f.value.x,
             y1: f.value.y,
             y2: f.value.y,
@@ -1164,86 +1182,86 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
             "stroke-dasharray": e.value.style.layout.plots.selectors.strokeDasharray,
             "stroke-linecap": "round",
             class: "line-pointer"
-          }, null, 8, Sa),
+          }, null, 8, Da),
           w("line", {
             x1: f.value.x,
             x2: f.value.x,
-            y1: E.value.y,
+            y1: F.value.y,
             y2: f.value.y,
             stroke: e.value.style.layout.plots.selectors.stroke,
             "stroke-width": e.value.style.layout.plots.selectors.strokeWidth,
             "stroke-dasharray": e.value.style.layout.plots.selectors.strokeDasharray,
             "stroke-linecap": "round",
             class: "line-pointer"
-          }, null, 8, La),
+          }, null, 8, Ea),
           w("text", {
-            x: E.value.x + (f.value.x > E.value.x ? -6 : 6),
+            x: F.value.x + (f.value.x > F.value.x ? -6 : 6),
             y: f.value.y + e.value.style.layout.plots.selectors.labels.fontSize / 3,
             "font-size": e.value.style.layout.plots.selectors.labels.fontSize,
             fill: e.value.style.layout.plots.selectors.labels.color,
             "font-weight": e.value.style.layout.plots.selectors.labels.bold ? "bold" : "normal",
-            "text-anchor": f.value.x > E.value.x ? "end" : "start"
-          }, q(c(ue)(
+            "text-anchor": f.value.x > F.value.x ? "end" : "start"
+          }, G(c(ie)(
             e.value.style.layout.plots.selectors.labels.y.formatter,
-            c(G)(f.value.v.y),
+            c(q)(f.value.v.y),
             c(Q)({
               p: e.value.style.layout.plots.selectors.labels.prefix,
-              v: c(G)(f.value.v.y),
+              v: c(q)(f.value.v.y),
               s: e.value.style.layout.plots.selectors.labels.suffix,
               r: e.value.style.layout.plots.selectors.labels.rounding
             }),
             { datapoint: f.value }
-          )), 9, Ba),
+          )), 9, Fa),
           w("text", {
             x: f.value.x,
-            y: E.value.y + (f.value.y > E.value.y ? -6 : e.value.style.layout.plots.selectors.labels.fontSize + 6),
+            y: F.value.y + (f.value.y > F.value.y ? -6 : e.value.style.layout.plots.selectors.labels.fontSize + 6),
             "font-size": e.value.style.layout.plots.selectors.labels.fontSize,
             fill: e.value.style.layout.plots.selectors.labels.color,
             "font-weight": e.value.style.layout.plots.selectors.labels.bold ? "bold" : "normal",
             "text-anchor": "middle"
-          }, q(c(ue)(
+          }, G(c(ie)(
             e.value.style.layout.plots.selectors.labels.y.formatter,
-            c(G)(f.value.v.x),
+            c(q)(f.value.v.x),
             c(Q)({
               p: e.value.style.layout.plots.selectors.labels.prefix,
-              v: c(G)(f.value.v.x),
+              v: c(q)(f.value.v.x),
               s: e.value.style.layout.plots.selectors.labels.suffix,
               r: e.value.style.layout.plots.selectors.labels.rounding
             }),
             { datapoint: f.value }
-          )), 9, Ta),
+          )), 9, Wa),
           w("circle", {
-            cx: E.value.x,
+            cx: F.value.x,
             cy: f.value.y,
             r: e.value.style.layout.plots.selectors.markers.radius,
             fill: e.value.style.layout.plots.selectors.markers.fill,
             stroke: e.value.style.layout.plots.selectors.markers.stroke,
             "stroke-width": e.value.style.layout.plots.selectors.markers.strokeWidth,
             class: "line-pointer"
-          }, null, 8, za),
+          }, null, 8, Na),
           w("circle", {
             cx: f.value.x,
-            cy: E.value.y,
+            cy: F.value.y,
             r: e.value.style.layout.plots.selectors.markers.radius,
             fill: e.value.style.layout.plots.selectors.markers.fill,
             stroke: e.value.style.layout.plots.selectors.markers.stroke,
             "stroke-width": e.value.style.layout.plots.selectors.markers.strokeWidth,
             class: "line-pointer"
-          }, null, 8, Pa),
+          }, null, 8, Ia),
           e.value.style.layout.plots.selectors.labels.showName ? (r(), y("text", {
             key: 0,
             x: f.value.x,
-            y: f.value.y + (f.value.y < E.value.y ? -e.value.style.layout.plots.selectors.labels.fontSize / 2 : e.value.style.layout.plots.selectors.labels.fontSize),
+            y: f.value.y + (f.value.y < F.value.y ? -e.value.style.layout.plots.selectors.labels.fontSize / 2 : e.value.style.layout.plots.selectors.labels.fontSize),
             "font-size": e.value.style.layout.plots.selectors.labels.fontSize,
             fill: e.value.style.layout.plots.selectors.labels.color,
             "font-weight": e.value.style.layout.plots.selectors.labels.bold ? "bold" : "normal",
-            "text-anchor": f.value.x < n.value.left + 100 ? "start" : f.value.x > n.value.right - 100 ? "end" : f.value.x > E.value.x ? "start" : "end"
-          }, q(f.value.v.name), 9, Oa)) : x("", !0)
+            "text-anchor": f.value.x < n.value.left + 100 ? "start" : f.value.x > n.value.right - 100 ? "end" : f.value.x > F.value.x ? "start" : "end"
+          }, G(f.value.v.name), 9, Xa)) : x("", !0)
         ])) : x("", !0),
         e.value.style.layout.dataLabels.xAxis.show ? (r(), y("g", {
           key: 7,
           ref_key: "xAxisLabelLeft",
-          ref: De
+          ref: Ee
         }, [
           w("text", {
             id: `vue-ui-scatter-xAxis-label-${W.value}`,
@@ -1252,89 +1270,89 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
             "font-size": e.value.style.layout.dataLabels.xAxis.fontSize,
             "font-weight": e.value.style.layout.dataLabels.xAxis.bold ? "bold" : "normal",
             fill: e.value.style.layout.dataLabels.xAxis.color
-          }, q(e.value.style.layout.dataLabels.xAxis.name), 9, Da),
+          }, G(e.value.style.layout.dataLabels.xAxis.name), 9, Ya),
           w("text", {
             "text-anchor": "middle",
             "font-size": e.value.style.layout.dataLabels.xAxis.fontSize,
             fill: e.value.style.layout.dataLabels.xAxis.color,
-            transform: `translate(${e.value.style.layout.dataLabels.xAxis.name ? e.value.style.layout.dataLabels.xAxis.fontSize * 3 : 0}, ${E.value.y + e.value.style.layout.dataLabels.xAxis.fontSize / 3}), rotate(-90)`
-          }, q(c(ue)(
+            transform: `translate(${e.value.style.layout.dataLabels.xAxis.name ? e.value.style.layout.dataLabels.xAxis.fontSize * 3 : 0}, ${F.value.y + e.value.style.layout.dataLabels.xAxis.fontSize / 3}), rotate(-90)`
+          }, G(c(ie)(
             e.value.style.layout.plots.selectors.labels.x.formatter,
-            c(G)(z.value.xMin),
+            c(q)(P.value.xMin),
             c(Q)({
               p: e.value.style.layout.plots.selectors.labels.prefix,
-              v: c(G)(z.value.xMin),
+              v: c(q)(P.value.xMin),
               s: e.value.style.layout.plots.selectors.labels.suffix,
               r: e.value.style.layout.dataLabels.xAxis.rounding
             })
-          )), 9, Ea)
+          )), 9, Ra)
         ], 512)) : x("", !0),
         e.value.style.layout.dataLabels.xAxis.show ? (r(), y("text", {
           key: 8,
           ref_key: "xAxisLabelRight",
           ref: qt,
           "text-anchor": "middle",
-          transform: `translate(${n.value.right + e.value.style.layout.padding.right + 6}, ${E.value.y + e.value.style.layout.dataLabels.xAxis.fontSize / 3}), rotate(-90)`,
+          transform: `translate(${n.value.right + e.value.style.layout.padding.right + 6}, ${F.value.y + e.value.style.layout.dataLabels.xAxis.fontSize / 3}), rotate(-90)`,
           "font-size": e.value.style.layout.dataLabels.xAxis.fontSize,
           fill: e.value.style.layout.dataLabels.xAxis.color
-        }, q(c(ue)(
+        }, G(c(ie)(
           e.value.style.layout.plots.selectors.labels.x.formatter,
-          c(G)(z.value.xMax),
+          c(q)(P.value.xMax),
           c(Q)({
             p: e.value.style.layout.plots.selectors.labels.prefix,
-            v: c(G)(z.value.xMax),
+            v: c(q)(P.value.xMax),
             s: e.value.style.layout.plots.selectors.labels.suffix,
             r: e.value.style.layout.dataLabels.xAxis.rounding
           })
-        )), 9, Fa)) : x("", !0),
+        )), 9, Ua)) : x("", !0),
         e.value.style.layout.dataLabels.yAxis.show ? (r(), y("text", {
           key: 9,
           ref_key: "yAxisLabelTop",
-          ref: Gt,
-          x: E.value.x,
+          ref: Ht,
+          x: F.value.x,
           y: n.value.top - e.value.style.layout.dataLabels.yAxis.fontSize,
           "text-anchor": "middle",
           "font-size": e.value.style.layout.dataLabels.yAxis.fontSize,
           fill: e.value.style.layout.dataLabels.yAxis.color
-        }, q(c(ue)(
+        }, G(c(ie)(
           e.value.style.layout.plots.selectors.labels.y.formatter,
-          c(G)(z.value.yMax),
+          c(q)(P.value.yMax),
           c(Q)({
             p: e.value.style.layout.plots.selectors.labels.prefix,
-            v: c(G)(z.value.yMax),
+            v: c(q)(P.value.yMax),
             s: e.value.style.layout.plots.selectors.labels.suffix,
             r: e.value.style.layout.dataLabels.yAxis.rounding
           })
-        )), 9, Wa)) : x("", !0),
+        )), 9, ja)) : x("", !0),
         e.value.style.layout.dataLabels.yAxis.show ? (r(), y("g", {
           key: 10,
           ref_key: "yAxisLabelBottom",
-          ref: Ee
+          ref: Fe
         }, [
           w("text", {
-            x: E.value.x,
-            y: D.value.height - e.value.style.layout.dataLabels.yAxis.fontSize * 2,
+            x: F.value.x,
+            y: E.value.height - e.value.style.layout.dataLabels.yAxis.fontSize * 2,
             "text-anchor": "middle",
             "font-size": e.value.style.layout.dataLabels.yAxis.fontSize,
             fill: e.value.style.layout.dataLabels.yAxis.color
-          }, q(c(ue)(
+          }, G(c(ie)(
             e.value.style.layout.plots.selectors.labels.y.formatter,
-            c(G)(z.value.yMin),
+            c(q)(P.value.yMin),
             c(Q)({
               p: e.value.style.layout.plots.selectors.labels.prefix,
-              v: c(G)(z.value.yMin),
+              v: c(q)(P.value.yMin),
               s: e.value.style.layout.plots.selectors.labels.suffix,
               r: e.value.style.layout.dataLabels.yAxis.rounding
             })
-          )), 9, Na),
+          )), 9, Va),
           w("text", {
             "text-anchor": "middle",
             "font-size": e.value.style.layout.dataLabels.yAxis.fontSize,
             "font-weight": e.value.style.layout.dataLabels.yAxis.bold ? "bold" : "normal",
             fill: e.value.style.layout.dataLabels.yAxis.color,
             x: n.value.left + n.value.width / 2,
-            y: D.value.height
-          }, q(e.value.style.layout.dataLabels.yAxis.name), 9, Ia)
+            y: E.value.height
+          }, G(e.value.style.layout.dataLabels.yAxis.name), 9, Ga)
         ], 512)) : x("", !0),
         w("clipPath", {
           id: `clip_path_${W.value}`
@@ -1344,10 +1362,10 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
             y: n.value.top,
             width: n.value.width <= 0 ? 1e-4 : n.value.width,
             height: n.value.height <= 0 ? 1e-4 : n.value.height
-          }, null, 8, Ya)
-        ], 8, Xa),
-        e.value.style.layout.correlation.show ? (r(), y("g", Ra, [
-          (r(!0), y(Z, null, K(U.value, (t, o) => (r(), y("line", {
+          }, null, 8, Ha)
+        ], 8, qa),
+        e.value.style.layout.correlation.show ? (r(), y("g", Za, [
+          (r(!0), y(Z, null, K(j.value, (t, o) => (r(), y("line", {
             x1: t.correlation.x1,
             x2: t.correlation.x2,
             y1: t.correlation.y1,
@@ -1356,8 +1374,8 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
             stroke: t.color,
             "stroke-width": e.value.style.layout.correlation.strokeWidth,
             "clip-path": `url(#clip_path_${W.value})`
-          }, null, 8, ja))), 256)),
-          (r(!0), y(Z, null, K(U.value, (t, o) => (r(), y("g", null, [
+          }, null, 8, Ja))), 256)),
+          (r(!0), y(Z, null, K(j.value, (t, o) => (r(), y("g", null, [
             e.value.style.layout.correlation.label.show ? (r(), y("text", {
               key: 0,
               x: t.correlation.x2,
@@ -1366,21 +1384,21 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
               "text-anchor": "end",
               "font-size": e.value.style.layout.correlation.label.fontSize,
               "font-weight": e.value.style.layout.correlation.label.bold ? "bold" : "normal"
-            }, q(c(Q)({
-              v: c(G)(t.correlation.coefficient),
+            }, G(c(Q)({
+              v: c(q)(t.correlation.coefficient),
               r: e.value.style.layout.correlation.label.roundingValue
-            })), 9, Ua)) : x("", !0)
+            })), 9, Ka)) : x("", !0)
           ]))), 256))
         ])) : x("", !0),
-        j(l.$slots, "svg", { svg: D.value }, void 0, !0)
-      ], 46, Rl)),
-      l.$slots.watermark ? (r(), y("div", Va, [
-        j(l.$slots, "watermark", pe(fe({ isPrinting: c(pt) || c(ft) })), void 0, !0)
+        U(l.$slots, "svg", { svg: E.value }, void 0, !0)
+      ], 46, Zl)),
+      l.$slots.watermark ? (r(), y("div", Qa, [
+        U(l.$slots, "watermark", pe(fe({ isPrinting: c(pt) || c(ft) })), void 0, !0)
       ])) : x("", !0),
       w("div", {
         id: `legend-bottom-${W.value}`
-      }, null, 8, qa),
-      rt.value ? (r(), le(yl, {
+      }, null, 8, eo),
+      rt.value ? (r(), le(gl, {
         key: 5,
         to: e.value.style.legend.position === "top" ? `#legend-top-${W.value}` : `#legend-bottom-${W.value}`
       }, [
@@ -1388,22 +1406,22 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
           ref_key: "chartLegend",
           ref: at
         }, [
-          e.value.style.legend.show ? (r(), le(Fl, {
+          e.value.style.legend.show ? (r(), le(Ul, {
             key: `legend_${it.value}`,
-            legendSet: ie.value,
-            config: Jt.value,
+            legendSet: oe.value,
+            config: Kt.value,
             onClickMarker: s[3] || (s[3] = ({ legend: t }) => wt(t.id))
           }, {
             item: X(({ legend: t }) => [
               w("div", {
                 onClick: (o) => t.segregate(),
-                style: ne(`opacity:${N.value.includes(t.id) ? 0.5 : 1}`)
-              }, q(t.name), 13, Ga)
+                style: ue(`opacity:${N.value.includes(t.id) ? 0.5 : 1}`)
+              }, G(t.name), 13, to)
             ]),
             _: 1
-          }, 8, ["legendSet", "config"])) : j(l.$slots, "legend", {
+          }, 8, ["legendSet", "config"])) : U(l.$slots, "legend", {
             key: 1,
-            legend: ie.value
+            legend: oe.value
           }, void 0, !0)
         ], 512)
       ], 8, ["to"])) : x("", !0),
@@ -1413,10 +1431,10 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
         ref: ot,
         dir: "auto"
       }, [
-        j(l.$slots, "source", {}, void 0, !0)
+        U(l.$slots, "source", {}, void 0, !0)
       ], 512)) : x("", !0),
-      $e(c(Wt), {
-        show: H.value.showTooltip && ze.value,
+      $e(c(Nt), {
+        show: H.value.showTooltip && Pe.value,
         backgroundColor: e.value.style.tooltip.backgroundColor,
         color: e.value.style.tooltip.color,
         borderRadius: e.value.style.tooltip.borderRadius,
@@ -1427,7 +1445,7 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
         position: e.value.style.tooltip.position,
         offsetY: e.value.style.tooltip.offsetY,
         parent: te.value,
-        content: Pe.value,
+        content: Oe.value,
         isFullscreen: re.value,
         isCustom: e.value.style.tooltip.customFormat && typeof e.value.style.tooltip.customFormat == "function",
         smooth: e.value.style.tooltip.smooth,
@@ -1436,14 +1454,14 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
         smoothSnapThreshold: e.value.style.tooltip.smoothSnapThreshold
       }, {
         "tooltip-before": X(() => [
-          j(l.$slots, "tooltip-before", pe(fe({ ...Re.value })), void 0, !0)
+          U(l.$slots, "tooltip-before", pe(fe({ ...Re.value })), void 0, !0)
         ]),
         "tooltip-after": X(() => [
-          j(l.$slots, "tooltip-after", pe(fe({ ...Re.value })), void 0, !0)
+          U(l.$slots, "tooltip-after", pe(fe({ ...Re.value })), void 0, !0)
         ]),
         default: X(() => [
-          e.value.style.tooltip.showShape ? (r(), y("div", Ha, [
-            (r(), y("svg", Za, [
+          e.value.style.tooltip.showShape ? (r(), y("div", lo, [
+            (r(), y("svg", ao, [
               $e(Qe, {
                 shape: f.value.shape,
                 color: f.value.color,
@@ -1455,32 +1473,32 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
         ]),
         _: 3
       }, 8, ["show", "backgroundColor", "color", "borderRadius", "borderColor", "borderWidth", "fontSize", "backgroundOpacity", "position", "offsetY", "parent", "content", "isFullscreen", "isCustom", "smooth", "backdropFilter", "smoothForce", "smoothSnapThreshold"]),
-      et.value && e.value.userOptions.buttons.table ? (r(), le(cl(be.value.component), dl({ key: 7 }, be.value.props, {
+      et.value && e.value.userOptions.buttons.table ? (r(), le(ml(be.value.component), xl({ key: 7 }, be.value.props, {
         ref_key: "tableUnit",
         ref: xe,
         onClose: St
-      }), Tt({
+      }), zt({
         content: X(() => [
-          (r(), le(c(Xt), {
+          (r(), le(c(Yt), {
             key: `table_${ut.value}`,
-            colNames: Ae.value.colNames,
-            head: Ae.value.head,
-            body: Ae.value.body,
-            config: Ae.value.config,
+            colNames: Se.value.colNames,
+            head: Se.value.head,
+            body: Se.value.body,
+            config: Se.value.config,
             title: e.value.table.useDialog ? "" : be.value.title,
             withCloseButton: !e.value.table.useDialog,
             onClose: St
           }, {
             th: X(({ th: t }) => [
-              zt(q(t), 1)
+              Pt(G(t), 1)
             ]),
             td: X(({ td: t }) => [
-              t.shape ? (r(), y("div", Ja, [
-                w("span", null, q(t.content), 1)
+              t.shape ? (r(), y("div", oo, [
+                w("span", null, G(t.content), 1)
               ])) : (r(), y("div", {
                 key: 1,
                 innerHTML: t
-              }, null, 8, Ka))
+              }, null, 8, so))
             ]),
             _: 1
           }, 8, ["colNames", "head", "body", "config", "title", "withCloseButton"]))
@@ -1490,7 +1508,7 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
         e.value.table.useDialog ? {
           name: "title",
           fn: X(() => [
-            zt(q(be.value.title), 1)
+            Pt(G(be.value.title), 1)
           ]),
           key: "0"
         } : void 0,
@@ -1502,7 +1520,7 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
               class: "vue-ui-user-options-button",
               onClick: s[4] || (s[4] = (t) => Ve(e.value.userOptions.callbacks.csv))
             }, [
-              $e(c(Nt), {
+              $e(c(It), {
                 name: "excel",
                 stroke: be.value.props.color
               }, null, 8, ["stroke"])
@@ -1511,10 +1529,10 @@ const Xl = ["id"], Yl = ["id"], Rl = ["xmlns", "viewBox"], jl = ["width", "heigh
           key: "1"
         } : void 0
       ]), 1040)) : x("", !0),
-      c(vt) ? (r(), le(zl, { key: 8 })) : x("", !0)
-    ], 46, Xl));
+      c(vt) ? (r(), le(Wl, { key: 8 })) : x("", !0)
+    ], 46, ql));
   }
-}, po = /* @__PURE__ */ Il(Qa, [["__scopeId", "data-v-5097acd5"]]);
+}, _o = /* @__PURE__ */ Gl(no, [["__scopeId", "data-v-33f7d698"]]);
 export {
-  po as default
+  _o as default
 };