vue-data-ui 3.15.12 → 3.16.1

package/dist/vue-ui-scatter-BxDtWASQ.js

@@ -0,0 +1,1831 @@
+import { defineAsyncComponent as ye, computed as T, ref as w, toRefs as Ul, watch as Ue, shallowRef as Gt, onMounted as jl, onBeforeUnmount as Gl, openBlock as v, createElementBlock as c, unref as h, normalizeStyle as ue, normalizeClass as qt, createElementVNode as k, toDisplayString as V, createCommentVNode as x, createBlock as ae, withCtx as B, renderSlot as z, normalizeProps as H, guardReactiveProps as K, createSlots as Ht, createVNode as Oe, Fragment as Q, renderList as oe, Teleport as ql, resolveDynamicComponent as Hl, mergeProps as Kl, createTextVNode as Kt, nextTick as yt } from "vue";
+import { j as Zl, t as Zt, m as Jl, p as ge, o as Jt, q as dt, n as Ql, r as Qt, ak as ea, s as ht, am as ta, c as la, u as je, k as se, l as ee, X as aa, al as oa, K as Z, a0 as sa, a1 as na, T as ua, U as ia, a3 as ra } from "./lib-DBptbyyI.js";
+import { t as va, u as ca } from "./useResponsive-DfdjqQps.js";
+import { u as ya } from "./useConfig-DO94Aj5s.js";
+import { u as da, B as ha } from "./BaseScanner-BhhkKVoj.js";
+import { u as fa } from "./usePrinter-CEpYU3r5.js";
+import { u as pa } from "./useSvgExport-ByUukOZt.js";
+import { u as ft } from "./useNestedProp-Bf5XFbs8.js";
+import { u as ga } from "./useThemeCheck-D1ZYXUwG.js";
+import { u as ma } from "./useUserOptionState-BIvW1Kz7.js";
+import { u as xa } from "./useChartAccessibility-9icAAmYg.js";
+import ba from "./img-LXxMLmCg.js";
+import { _ as pt } from "./Shape-BKRUOeKk.js";
+import ka from "./Title-BeMKE1cj.js";
+import wa from "./vue_ui_scatter-CO5Iq9ai.js";
+import $a from "./Legend-CS7Xo5LK.js";
+import { A as Ma } from "./A11yDataTable-KcVAX2cP.js";
+import { B as _a } from "./BaseLegendToggle-BQVIawmA.js";
+import { _ as Ca } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const Aa = ["id"], Sa = ["id"], Ta = {
+  key: 0,
+  class: "sr-only",
+  "aria-live": "polite",
+  "aria-atomic": "true"
+}, La = ["id"], Pa = { style: { position: "relative" } }, Ba = ["xmlns", "aria-describedby", "viewBox"], za = ["width", "height"], Ia = { key: 1 }, Oa = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Da = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Ea = { key: 2 }, Na = ["id"], Fa = ["stop-color"], Wa = ["stop-color"], Xa = ["id"], Ya = ["stop-color"], Ra = ["stop-color"], Va = ["x", "y", "width", "height", "fill", "stroke", "stroke-width", "rx"], Ua = ["x", "y", "width", "height", "onMouseenter"], ja = {
+  key: 2,
+  style: { "pointer-events": "none" }
+}, Ga = ["x", "y", "width", "height", "fill", "fill-opacity"], qa = ["x1", "x2", "y2", "stroke", "stroke-dasharray", "stroke-width"], Ha = ["x1", "x2", "y2", "stroke", "stroke-dasharray", "stroke-width"], Ka = ["x", "y", "height", "width", "fill", "stroke", "stroke-width", "rx"], Za = ["x", "y", "width", "height", "onMouseenter"], Ja = {
+  key: 2,
+  style: { "pointer-events": "none" }
+}, Qa = ["x", "y", "width", "height", "fill", "fill-opacity"], eo = ["x1", "x2", "y1", "y2", "stroke", "stroke-dasharray", "stroke-width"], to = ["x1", "x2", "y1", "y2", "stroke", "stroke-dasharray", "stroke-width"], lo = {
+  key: 0,
+  style: { "pointer-events": "none" }
+}, ao = ["d", "stroke", "stroke-width"], oo = ["d", "stroke", "stroke-width"], so = ["d", "stroke", "stroke-width"], no = ["d", "stroke", "stroke-width"], uo = { key: 3 }, io = ["points", "fill", "stroke-width", "stroke-dasharray", "stroke"], ro = { key: 0 }, vo = ["cx", "cy", "r", "fill", "stroke", "stroke-width", "onMouseover", "onMouseleave", "onClick"], co = { key: 1 }, yo = ["clip-path"], ho = ["d", "fill", "stroke", "stroke-width", "stroke-opacity"], fo = {
+  key: 0,
+  style: { "pointer-events": "none" }
+}, po = ["x", "y", "width", "height"], go = {
+  key: 6,
+  style: { "pointer-events": "none !important" }
+}, mo = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], xo = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], bo = ["x", "y", "font-size", "fill", "font-weight", "text-anchor"], ko = ["x", "y", "font-size", "fill", "font-weight"], wo = ["cx", "cy", "r", "fill", "stroke", "stroke-width"], $o = ["cx", "cy", "r", "fill", "stroke", "stroke-width"], Mo = ["x", "y", "font-size", "fill", "font-weight", "text-anchor"], _o = ["id", "transform", "font-size", "font-weight", "fill"], Co = ["font-size", "fill", "transform"], Ao = ["transform", "font-size", "fill"], So = ["x", "y", "font-size", "fill"], To = ["x", "y", "font-size", "fill"], Lo = ["font-size", "font-weight", "fill", "x", "y"], Po = ["id"], Bo = ["x", "y", "width", "height"], zo = {
+  key: 11,
+  style: { pointerEvents: "none" }
+}, Io = ["x1", "x2", "y1", "y2", "stroke-dasharray", "stroke", "stroke-width", "clip-path"], Oo = ["x", "y", "fill", "font-size", "font-weight"], Do = {
+  key: 0,
+  style: { position: "absolute", top: "100%", left: "0", width: "100%" },
+  "data-dom-to-png-ignore": "",
+  "aria-hidden": "true"
+}, Eo = {
+  key: 6,
+  class: "vue-data-ui-watermark"
+}, No = ["id"], Fo = ["onClick"], Wo = {
+  key: 0,
+  style: { width: "100%", display: "flex", "align-items": "center", "justify-content": "center" }
+}, Xo = {
+  viewBox: "0 0 20 20",
+  height: "20",
+  width: "20",
+  style: { overflow: "hidden", background: "transparent" }
+}, Yo = { key: 0 }, Ro = ["innerHTML"], Vo = {
+  __name: "vue-ui-scatter",
+  props: {
+    config: {
+      type: Object,
+      default() {
+        return {};
+      }
+    },
+    dataset: {
+      type: Array,
+      default() {
+        return [];
+      }
+    }
+  },
+  emits: ["copyAlt"],
+  setup(el, { expose: tl, emit: ll }) {
+    const al = ye(() => import("./Tooltip-Bf-kM3_A.js")), ol = ye(() => import("./BaseIcon-Cb3zzG6s.js")), sl = ye(() => import("./vue-ui-accordion-nvggWcGN.js")), nl = ye(() => import("./DataTable-DT2kIdQ6.js")), ul = ye(() => import("./PenAndPaper-Ct3qJ4lA.js")), il = ye(() => import("./UserOptions-rW2fRf3V.js")), rl = ye(() => import("./PackageVersion-DPO-OOVI.js")), vl = ye(() => import("./BaseDraggableDialog-CIb-iD9g.js")), { vue_ui_scatter: cl } = ya(), { isThemeValid: yl, warnInvalidTheme: dl } = ga(), te = el, hl = ll, gt = T(() => !!te.dataset && te.dataset.length), N = w(Zl()), De = w(!1), Ge = w(""), mt = w(0), ne = w(null), xt = w(null), bt = w(null), kt = w(null), wt = w(null), $t = w(0), Mt = w(0), _t = w(0), I = w([]), Ct = w(!1), _e = w(null), Ce = w(null), Ae = w(null), qe = w(null), Ee = w(!1), Ne = w(!1), He = w(null), fl = w(null), pl = w(null), Ke = w(null), me = w(null), At = w({ x: 0, y: 0 }), Se = w("pointer"), Fe = w(!1), Te = w(null), e = w(tt()), de = T(() => e.value.userOptions.useCursorPointer);
+    function gl(t = 100, a = 0.8, l = {}) {
+      const { meanX: s = 0, sdX: o = 1, meanY: n = 0, sdY: i = 1, seed: y } = l;
+      let r = (y ?? Math.floor(Math.random() * 2 ** 31)) >>> 0;
+      const f = () => (r = r * 1664525 + 1013904223 >>> 0, r / 2 ** 32), A = () => {
+        let b = 0, X = 0;
+        for (; b === 0; ) b = f();
+        for (; X === 0; ) X = f();
+        return Math.sqrt(-2 * Math.log(b)) * Math.cos(2 * Math.PI * X);
+      }, d = t / 2, m = Array.from({ length: d }, A), E = Array.from({ length: d }, A), _ = (b) => b.reduce((X, Ie) => X + Ie, 0) / b.length, O = _(m), D = _(E);
+      for (let b = 0; b < d; b += 1)
+        m[b] -= O, E[b] -= D;
+      const L = (b, X) => b.reduce((Ie, Ve, ct) => Ie + Ve * X[ct], 0), C = (b) => L(b, b), p = L(E, m) / C(m), P = E.map((b, X) => b - p * m[X]), G = C(m) / d, le = C(P) / d, ce = Math.sqrt((1 - a * a) * G / le), j = m.map((b, X) => a * b + ce * P[X]), pe = m.concat(m.map((b) => -b)), vt = j.concat(j.map((b) => -b)), Be = (b) => Math.sqrt(C(b) / b.length), $e = (b, X, Ie) => {
+        const Ve = Be(b);
+        return b.map((ct) => Ie + (Ve ? ct / Ve * X : 0));
+      }, Me = $e(pe, o, s), ze = $e(vt, i, n);
+      for (let b = Me.length - 1; b > 0; b -= 1) {
+        const X = Math.floor(f() * (b + 1));
+        [Me[b], Me[X]] = [Me[X], Me[b]], [ze[b], ze[X]] = [ze[X], ze[b]];
+      }
+      return Me.map((b, X) => ({ x: b, y: ze[X] }));
+    }
+    const ml = T(() => Zt({
+      defaultConfig: {
+        userOptions: { show: !1 },
+        table: { show: !1 },
+        useCssAnimation: !1,
+        style: {
+          backgroundColor: "#99999930",
+          layout: {
+            axis: {
+              stroke: "#6A6A6A"
+            },
+            correlation: {
+              label: { show: !1 }
+            },
+            dataLabels: {
+              xAxis: { show: !1 },
+              yAxis: { show: !1 }
+            },
+            marginalBars: {
+              fill: "#99999960"
+            },
+            padding: { top: 12, right: 12, bottom: 12, left: 12 },
+            plots: {
+              stroke: "#6A6A6A"
+            }
+          },
+          legend: {
+            backgroundColor: "transparent"
+          }
+        }
+      },
+      userConfig: e.value.skeletonConfig ?? {}
+    })), { loading: Ze, FINAL_DATASET: Je, manualLoading: Qe } = da({
+      ...Ul(te),
+      FINAL_CONFIG: e,
+      prepareConfig: tt,
+      skeletonDataset: te.config?.skeletonDataset ?? [
+        {
+          name: "",
+          color: "#999999",
+          values: gl(100, 0.5, { seed: 42 })
+        }
+      ],
+      skeletonConfig: Zt({
+        defaultConfig: e.value,
+        userConfig: ml.value
+      })
+    }), { userOptionsVisible: et, setUserOptionsVisibility: St, keepUserOptionState: Tt } = ma({ config: e.value }), { svgRef: ie } = xa({ config: e.value.style.title });
+    function tt() {
+      const t = ft({
+        userConfig: te.config,
+        defaultConfig: cl
+      }), a = t.theme;
+      if (!a) return t;
+      if (!yl.value(t))
+        return dl(t), t;
+      const l = ft({
+        userConfig: wa[a] || te.config,
+        defaultConfig: t
+      }), s = ft({
+        userConfig: te.config,
+        defaultConfig: l
+      });
+      return {
+        ...s,
+        customPalette: s.customPalette.length ? s.customPalette : Jl[a] || ge
+      };
+    }
+    Ue(() => te.config, (t) => {
+      Ze.value || (e.value = tt()), et.value = !e.value.userOptions.showOnChartHover, Pt(), $t.value += 1, Mt.value += 1, _t.value += 1, q.value.showTable = e.value.table.show, q.value.showTooltip = e.value.style.tooltip.show, Lt.value && e.value.usePerformanceMode && console.warn(`VueUiScatter : You are using performance mode
+
+- downsampling is disabled in this mode, all plots are rendered
+
+- plot significance is not active in this mode (all plots have the same opacity) 
+
+- 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 }), Ue(() => te.dataset, (t) => {
+      Array.isArray(t) && t.length > 0 && (Qe.value = !1);
+    }, { deep: !0 });
+    const re = Gt(null), xe = Gt(null);
+    jl(() => {
+      Ct.value = !0, Pt();
+    });
+    const Lt = T(() => !!e.value.debug);
+    function Pt() {
+      if (Jt(te.dataset) && (dt({
+        componentName: "VueUiScatter",
+        type: "dataset",
+        debug: Lt.value
+      }), Qe.value = !0), Jt(te.dataset) || (Qe.value = e.value.loading), e.value.responsive) {
+        const t = va(() => {
+          const { width: a, height: l } = ca({
+            chart: ne.value,
+            title: e.value.style.title.text ? xt.value : null,
+            legend: e.value.style.legend.show ? bt.value : null,
+            source: kt.value,
+            noTitle: wt.value
+          });
+          requestAnimationFrame(() => {
+            Y.value.width = a, Y.value.height = l;
+          });
+        });
+        re.value && (xe.value && re.value.unobserve(xe.value), re.value.disconnect()), re.value = new ResizeObserver(t), xe.value = ne.value.parentNode, re.value.observe(xe.value);
+      }
+    }
+    Gl(() => {
+      re.value && (xe.value && re.value.unobserve(xe.value), re.value.disconnect());
+    });
+    const { isPrinting: lt, isImaging: at, generatePdf: Bt, generateImage: zt } = fa({
+      elementId: `vue-ui-scatter_${N.value}`,
+      fileName: e.value.style.title.text || "vue-ui-scatter",
+      options: e.value.userOptions.print
+    }), xl = T(() => e.value.userOptions.show && !e.value.style.title.text), It = T(() => Ql(e.value.customPalette)), q = w({
+      showTable: e.value.table.show,
+      showTooltip: e.value.style.tooltip.show
+    });
+    Ue(e, () => {
+      q.value = {
+        showTable: e.value.table.show,
+        showTooltip: e.value.style.tooltip.show
+      };
+    }, { immediate: !0 });
+    const Y = w({
+      height: e.value.style.layout.height,
+      width: e.value.style.layout.width
+    }), We = T(() => e.value.style.layout.marginalBars.show ? e.value.style.layout.marginalBars.size + e.value.style.layout.marginalBars.offset : 0), u = T(() => {
+      let t = 0, a = 0;
+      return He.value && (t = He.value.getBBox().width + 6), Ke.value && (a = Ke.value.getBBox().height + 6), {
+        top: e.value.style.layout.padding.top + We.value + e.value.style.layout.dataLabels.yAxis.fontSize * 2,
+        right: Y.value.width - e.value.style.layout.padding.right - We.value - 6,
+        bottom: Y.value.height - e.value.style.layout.padding.bottom - a,
+        left: e.value.style.layout.padding.left + t,
+        height: Y.value.height - e.value.style.layout.padding.top - e.value.style.layout.padding.bottom - We.value - a - e.value.style.layout.dataLabels.yAxis.fontSize * 2,
+        width: Y.value.width - e.value.style.layout.padding.left - e.value.style.layout.padding.right - We.value - t - 6
+      };
+    }), F = T(() => {
+      Je.value.forEach((o, n) => {
+        Qt({
+          datasetObject: o,
+          requiredAttributes: ["values"]
+        }).forEach((i) => {
+          dt({
+            componentName: "VueUiScatter",
+            type: "datasetSerieAttribute",
+            property: i,
+            index: n
+          });
+        }), o.values && o.values.forEach((i, y) => {
+          Qt({
+            datasetObject: i,
+            requiredAttributes: ["x", "y"]
+          }).forEach((r) => {
+            dt({
+              componentName: "VueUiScatter",
+              type: "datasetSerieAttribute",
+              property: `values.${r}`,
+              index: `${n} - ${y}`
+            });
+          });
+        });
+      });
+      const t = Math.min(...J.value.filter((o) => !I.value.includes(o.id)).flatMap((o) => o.values.map((n) => n.x))), a = Math.max(...J.value.filter((o) => !I.value.includes(o.id)).flatMap((o) => o.values.map((n) => n.x))), l = Math.min(...J.value.filter((o) => !I.value.includes(o.id)).flatMap((o) => o.values.map((n) => n.y))), s = Math.max(...J.value.filter((o) => !I.value.includes(o.id)).flatMap((o) => o.values.map((n) => n.y)));
+      return { xMin: t >= 0 ? 0 : t, xMax: a, yMin: l >= 0 ? 0 : l, yMax: s };
+    }), W = T(() => ({
+      x: u.value.left + Math.abs(F.value.xMin) / (F.value.xMax + Math.abs(F.value.xMin)) * u.value.width,
+      y: u.value.bottom - Math.abs(F.value.yMin) / (F.value.yMax + Math.abs(F.value.yMin)) * u.value.height
+    })), J = T(() => Je.value.map((t, a) => {
+      const l = `cluster_${N.value}_${a}`;
+      return {
+        ...t,
+        values: ea({
+          data: t.values,
+          threshold: e.value.usePerformanceMode ? t.values.length + 1 : e.value.downsample.threshold
+        }),
+        id: l,
+        color: t.color ? t.color : It.value[a] || ge[a] || ge[a % ge.length],
+        opacity: I.value.includes(l) ? 0.5 : 1,
+        shape: t.shape ?? "circle",
+        segregate: () => Re(l),
+        isSegregated: I.value.includes(l)
+      };
+    })), bl = 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" : ""
+    })), be = T(() => J.value.map((t, a) => ({
+      ...t,
+      plots: t.values.map((l) => ({
+        x: u.value.left + (l.x + Math.abs(F.value.xMin)) / (F.value.xMax + Math.abs(F.value.xMin)) * u.value.width,
+        y: u.value.bottom - (l.y + Math.abs(F.value.yMin)) / (F.value.yMax + Math.abs(F.value.yMin)) * u.value.height,
+        v: {
+          ...l,
+          name: l.name || ""
+        },
+        clusterName: t.name,
+        clusterId: t.id,
+        color: t.color ? t.color : It.value[a] || ge[a] || ge[a % ge.length],
+        id: `plot_${N.value}_${Math.random()}`,
+        weight: l.weight ?? e.value.style.layout.plots.radius
+      }))
+    })).filter((t) => !I.value.includes(t.id))), U = T(() => {
+      const a = ({ m: l, b: s, rect: o, verticalX: n = null }) => {
+        const { left: i, right: y, top: r, bottom: f } = o, A = [], d = (C, p) => {
+          Number.isFinite(C) && Number.isFinite(p) && A.push({ x: C, y: p });
+        }, m = ({ x: C, y: p }) => C >= i - 1e-9 && C <= y + 1e-9 && p >= r - 1e-9 && p <= f + 1e-9;
+        n !== null ? n >= i - 1e-9 && n <= y + 1e-9 && (d(n, r), d(n, f)) : Number.isFinite(l) && (d(i, l * i + s), d(y, l * y + s), Math.abs(l) > 1e-9 ? (d((r - s) / l, r), d((f - s) / l, f)) : s >= r - 1e-9 && s <= f + 1e-9 && (d(i, s), d(y, s)));
+        const E = A.filter(m), _ = [];
+        for (const C of E)
+          _.some((p) => Math.abs(p.x - C.x) < 1e-6 && Math.abs(p.y - C.y) < 1e-6) || _.push(C);
+        if (_.length < 2) return null;
+        let O = _[0], D = _[1], L = 0;
+        for (let C = 0; C < _.length; C += 1)
+          for (let p = C + 1; p < _.length; p += 1) {
+            const P = _[C].x - _[p].x, G = _[C].y - _[p].y, le = P * P + G * G;
+            le > L && (L = le, O = _[C], D = _[p]);
+          }
+        return { x1: O.x, y1: O.y, x2: D.x, y2: D.y };
+      };
+      return be.value.map((l) => {
+        const s = l.plots.length, o = l.plots.reduce((p, P) => p + P.x, 0) / s, n = l.plots.reduce((p, P) => p + P.y, 0) / s;
+        let i = 0, y = 0;
+        for (const p of l.plots) {
+          const P = p.x - o, G = p.y - n;
+          i += P * G, y += P * P;
+        }
+        let r, f, A = null;
+        y < 1e-9 ? (A = o, r = 1 / 0, f = null) : (r = i / y, f = n - r * o);
+        let d, m;
+        A !== null ? (d = 1 / 0, m = null) : (d = r, m = f);
+        const E = l.plots.every((p) => p.v && typeof p.v.x == "number" && typeof p.v.y == "number");
+        let _ = NaN;
+        if (s >= 2) {
+          let p = 0, P = 0;
+          E ? (p = l.plots.reduce((j, pe) => j + pe.v.x, 0) / s, P = l.plots.reduce((j, pe) => j + pe.v.y, 0) / s) : (p = o, P = -n);
+          let G = 0, le = 0, ce = 0;
+          for (const j of l.plots) {
+            const pe = E ? j.v.x : j.x, vt = E ? j.v.y : -j.y, Be = pe - p, $e = vt - P;
+            G += Be * $e, le += Be * Be, ce += $e * $e;
+          }
+          if (le >= 1e-9 && ce >= 1e-9) {
+            const j = G / Math.sqrt(le * ce);
+            _ = Math.max(-1, Math.min(1, j));
+          }
+        }
+        const O = a({ m: d, b: m, rect: u.value, verticalX: A });
+        if (!O)
+          return {
+            ...l,
+            correlation: null,
+            label: null,
+            plots: l.plots.map((p) => ({
+              ...p,
+              deviation: 0,
+              shape: l.shape,
+              color: ht(l.color)
+            }))
+          };
+        const D = (O.x1 + O.x2) / 2, L = (O.y1 + O.y2) / 2, C = { x: D, y: L };
+        return {
+          ...l,
+          color: ht(l.color),
+          correlation: {
+            ...O,
+            coefficient: _
+          },
+          label: C,
+          plots: l.plots.map((p) => {
+            let P, G;
+            A !== null ? (P = A, G = p.y) : Math.abs(d) < 1e-9 ? (P = p.x, G = m) : (P = (p.x + d * p.y - d * m) / (1 + d * d), G = (d * p.x + d * d * p.y + m) / (1 + d * d));
+            const le = p.x - P, ce = p.y - G, j = Math.sqrt(le * le + ce * ce);
+            return {
+              ...p,
+              deviation: j,
+              shape: l.shape,
+              color: ht(l.color)
+            };
+          })
+        };
+      });
+    }), Ot = T(() => Math.max(...U.value.flatMap((t) => t.plots.map((a) => Math.abs(a.deviation)))));
+    function kl() {
+      return U.value;
+    }
+    function Dt(t, a) {
+      const l = Array.isArray(t) ? t.flatMap((L) => L.plots.map((C) => ({
+        x: C.x,
+        y: C.y
+      }))) : t.plots.map((L) => ({
+        x: L.x,
+        y: L.y
+      }));
+      let s = 1 / 0, o = -1 / 0, n = 1 / 0, i = -1 / 0;
+      l.forEach(({ x: L, y: C }) => {
+        s = Math.min(s, L), o = Math.max(o, L), n = Math.min(n, C), i = Math.max(i, C);
+      });
+      const y = o - s, r = i - n, f = y / a, A = r / a, d = Array(a).fill(0), m = Array(a).fill(0);
+      l.forEach(({ x: L, y: C }) => {
+        const p = Math.floor((L - s) / f), P = Math.floor((C - n) / A);
+        d[p] || (d[p] = 0), m[P] || (m[P] = 0), d[p] += 1, m[P] += 1;
+      });
+      const E = [], _ = [];
+      for (let L = 0; L < a; L += 1)
+        E.push(s + (L + 0.5) * f), _.push(n + (L + 0.5) * A);
+      const O = Math.max(...d), D = Math.max(...m);
+      return { x: d, y: m, avgX: E, avgY: _, maxX: O, maxY: D };
+    }
+    const $ = T(() => e.value.style.layout.marginalBars.tranches), S = T(() => Dt(be.value, $.value)), wl = T(() => {
+      const t = u.value.top - e.value.style.layout.marginalBars.offset, a = u.value.right + e.value.style.layout.marginalBars.offset;
+      return be.value.map((l) => {
+        const s = Dt(l, $.value);
+        return {
+          coords: s,
+          dX: la(s.avgX.map((o, n) => ({
+            x: o,
+            y: t - s.x[n] / s.maxX * e.value.style.layout.marginalBars.size
+          }))),
+          dY: ta(s.avgY.map((o, n) => ({
+            y: o,
+            x: a + e.value.style.layout.marginalBars.size * s.y[n] / s.maxY
+          }))),
+          color: l.color,
+          id: l.id
+        };
+      });
+    }), R = w(void 0), g = w(null), ot = w(null);
+    function st() {
+      De.value = !1, R.value = void 0, g.value = null, Te.value = null, me.value = null;
+    }
+    function $l(t) {
+      if (!ie.value || !t) return;
+      const a = ra(t.x, t.y, ie.value);
+      a && (At.value = a);
+    }
+    function he(t, a, l = "pointer", s = null) {
+      R.value = t.id, g.value = t, Se.value = l, Te.value = s, me.value = t.id;
+      let o = "";
+      e.value.events.datapointEnter && e.value.events.datapointEnter({ datapoint: t, seriesIndex: a }), ot.value = {
+        datapoint: t,
+        seriesIndex: a,
+        series: U.value,
+        config: e.value
+      };
+      const n = e.value.style.tooltip.customFormat;
+      ua(n) && ia(() => n({
+        datapoint: t,
+        seriesIndex: a,
+        series: U.value,
+        config: e.value
+      })) ? Ge.value = n({
+        datapoint: t,
+        seriesIndex: a,
+        series: U.value,
+        config: e.value
+      }) : (t.clusterName && (o += `<div style="display:flex;gap:3px;align-items:center">${t.clusterName}</div>`), t.v.name && (o += `<div>${t.v.name}</div>`), o += `<div style="text-align:left;margin-top:6px;padding-top:6px;border-top:1px solid ${e.value.style.tooltip.borderColor}">`, o += `<div>${e.value.style.layout.dataLabels.xAxis.name}: <b>${isNaN(t.v.x) ? "-" : se(
+        e.value.style.layout.plots.selectors.labels.x.formatter,
+        t.v.x,
+        ee({
+          p: e.value.style.tooltip.prefix,
+          v: t.v.x,
+          s: e.value.style.tooltip.suffix,
+          r: e.value.style.tooltip.roundingValue
+        }),
+        { datapoint: t, seriesIndex: a }
+      )}</b></div>`, o += `<div>${e.value.style.layout.dataLabels.yAxis.name}: <b>${isNaN(t.v.y) ? "-" : se(
+        e.value.style.layout.plots.selectors.labels.y.formatter,
+        t.v.y,
+        ee({
+          p: e.value.style.tooltip.prefix,
+          v: t.v.y,
+          s: e.value.style.tooltip.suffix,
+          r: e.value.style.tooltip.roundingValue
+        }),
+        { datapoint: t, seriesIndex: a }
+      )}</b></div>`, o += `${e.value.style.layout.plots.deviation.translation}: <b>${ee({
+        v: t.deviation,
+        r: e.value.style.layout.plots.deviation.roundingValue
+      })}</b>`, o += "</div>", Ge.value = `<div>${o}</div>`), De.value = !0, l === "keyboard" && yt(() => {
+        $l(t);
+      });
+    }
+    function Xe(t, a) {
+      e.value.events.datapointLeave && e.value.events.datapointLeave({ datapoint: t, seriesIndex: a }), !(Se.value === "keyboard" && me.value === t?.id) && (De.value = !1, R.value = void 0, g.value = null);
+    }
+    function Ye(t, a) {
+      e.value.events.datapointClick && e.value.events.datapointClick({ datapoint: t, seriesIndex: a });
+    }
+    function Ml() {
+      I.value.length ? I.value = [] : J.value.forEach((t) => {
+        I.value.push(t.id);
+      });
+    }
+    function Re(t) {
+      I.value.includes(t) ? I.value = I.value.filter((a) => a !== t) : I.value.length < Je.value.length - 1 && I.value.push(t);
+    }
+    function Et(t) {
+      if (!J.value.length)
+        return e.value.debug && console.warn("VueUiScatter - There are no series to show."), null;
+      const a = J.value.find((l) => l.name === t);
+      return a || (e.value.debug && console.warn(`VueUiScatter - Series name not found "${t}"`), null);
+    }
+    function _l(t) {
+      const a = Et(t);
+      a !== null && I.value.includes(a.id) && Re(a.id);
+    }
+    function Cl(t) {
+      const a = Et(t);
+      a !== null && (I.value.includes(a.id) || Re(a.id));
+    }
+    function nt(t = null) {
+      yt(() => {
+        const a = ["", 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}`], l = U.value.map((n) => [
+          n.name,
+          n.correlation.coefficient,
+          n.plots.length,
+          n.plots.map((i) => i.v.x).reduce((i, y) => i + y, 0) / n.plots.length,
+          n.plots.map((i) => i.v.y).reduce((i, y) => i + y, 0) / n.plots.length
+        ]), s = [[e.value.style.title.text], [e.value.style.title.subtitle.text], [[""], [""], [""]]].concat([a]).concat(l), o = sa(s);
+        t ? t(o) : na({ csvContent: o, title: e.value.style.title.text || "vue-ui-heatmap" });
+      });
+    }
+    const ke = T(() => {
+      const t = [
+        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}`
+      ], a = U.value.map((o) => [
+        {
+          shape: o.shape,
+          content: o.name,
+          color: o.color
+        },
+        Number((o.correlation.coefficient ?? 0).toFixed(e.value.table.td.roundingValue)).toLocaleString(),
+        o.plots.length.toLocaleString(),
+        Number((o.plots.map((n) => n.v.x ?? 0).reduce((n, i) => n + i, 0) / o.plots.length).toFixed(e.value.table.td.roundingAverage)).toLocaleString(),
+        Number((o.plots.map((n) => n.v.y ?? 0).reduce((n, i) => n + i, 0) / o.plots.length).toFixed(e.value.table.td.roundingAverage)).toLocaleString()
+      ]), l = a.map((o) => o.map((n, i) => i === 0 ? n.content : n)), s = {
+        th: {
+          backgroundColor: e.value.table.th.backgroundColor,
+          color: e.value.table.th.color,
+          outline: e.value.table.th.outline
+        },
+        td: {
+          backgroundColor: e.value.table.td.backgroundColor,
+          color: e.value.table.td.color,
+          outline: e.value.table.td.outline
+        },
+        breakpoint: e.value.table.responsiveBreakpoint
+      };
+      return { head: t, body: a, a11yBody: l, config: s, colNames: t };
+    }), fe = w(!1);
+    function Nt(t) {
+      fe.value = t, mt.value += 1;
+    }
+    function Ft() {
+      q.value.showTable = !q.value.showTable;
+    }
+    function Wt() {
+      q.value.showTooltip = !q.value.showTooltip;
+    }
+    const Le = w(!1);
+    function ut() {
+      Le.value = !Le.value;
+    }
+    async function Al({ scale: t = 2 } = {}) {
+      if (!ne.value) return;
+      const { width: a, height: l } = ne.value.getBoundingClientRect(), s = a / l, { imageUri: o, base64: n } = await ba({ domElement: ne.value, base64: !0, img: !0, scale: t });
+      return {
+        imageUri: o,
+        base64: n,
+        title: e.value.style.title.text,
+        width: a,
+        height: l,
+        aspectRatio: s
+      };
+    }
+    function Sl(t) {
+      _e.value = t, e.value.style.layout.marginalBars.highlighter.highlightBothAxes && (Ce.value = S.value.y.length - 2 - t);
+    }
+    function Tl(t) {
+      Ce.value = t, e.value.style.layout.marginalBars.highlighter.highlightBothAxes && (_e.value = t);
+    }
+    function it() {
+      _e.value = null, Ce.value = null;
+    }
+    const Xt = {
+      circle: 1,
+      square: 1,
+      diamond: 1,
+      triangle: 1.2,
+      star: 1.3,
+      pentagon: 1.3,
+      hexagon: 1.3
+    }, M = (t) => t.toFixed(3);
+    function Ll({ shape: t = "circle", cx: a, cy: l, r: s }) {
+      if (!e.value.usePerformanceMode) return "";
+      const o = Xt[t] * s;
+      switch (t) {
+        case "circle": {
+          const n = M(a - o), i = M(l), y = M(a + o), r = M(o);
+          return `M ${n} ${i} A ${r} ${r} 0 1 0 ${y} ${i} A ${r} ${r} 0 1 0 ${n} ${i} Z`;
+        }
+        case "square": {
+          const n = M(a - o), i = M(l - o), y = M(a + o), r = M(l + o);
+          return `M ${n} ${i} L ${y} ${i} L ${y} ${r} L ${n} ${r} Z`;
+        }
+        case "diamond": {
+          const n = M(a), i = M(l);
+          return `M ${n} ${M(l - o)} L ${M(a + o)} ${i} L ${n} ${M(l + o)} L ${M(a - o)} ${i} Z`;
+        }
+        case "triangle": {
+          const n = o * Math.sqrt(3), i = a, y = l - 2 / 3 * n, r = a - o, f = l + 1 / 3 * n, A = a + o, d = f;
+          return `M ${M(i)} ${M(y)} L ${M(r)} ${M(f)} L ${M(A)} ${M(d)} Z`;
+        }
+        case "star": {
+          const n = o, i = o * 0.5, y = [];
+          for (let f = 0; f < 10; f += 1) {
+            const A = (-90 + f * 36) * Math.PI / 180, d = f % 2 === 0 ? n : i;
+            y.push([a + d * Math.cos(A), l + d * Math.sin(A)]);
+          }
+          let r = `M ${M(y[0][0])} ${M(y[0][1])}`;
+          for (let f = 1; f < y.length; f += 1)
+            r += ` L ${M(y[f][0])} ${M(y[f][1])}`;
+          return r + " Z";
+        }
+        case "pentagon": {
+          const i = [];
+          for (let r = 0; r < 5; r += 1) {
+            const f = (-90 + r * 72) * Math.PI / 180;
+            i.push([a + o * Math.cos(f), l + o * Math.sin(f)]);
+          }
+          let y = `M ${M(i[0][0])} ${M(i[0][1])}`;
+          for (let r = 1; r < 5; r += 1) y += ` L ${M(i[r][0])} ${M(i[r][1])}`;
+          return y + " Z";
+        }
+        case "hexagon": {
+          const i = [];
+          for (let r = 0; r < 6; r += 1) {
+            const f = (-60 + r * 60) * Math.PI / 180;
+            i.push([a + o * Math.cos(f), l + o * Math.sin(f)]);
+          }
+          let y = `M ${M(i[0][0])} ${M(i[0][1])}`;
+          for (let r = 1; r < 6; r += 1) y += ` L ${M(i[r][0])} ${M(i[r][1])}`;
+          return y + " Z";
+        }
+        default: {
+          const n = M(a - o), i = M(l), y = M(a + o), r = M(o);
+          return `M ${n} ${i} A ${r} ${r} 0 1 0 ${y} ${i} A ${r} ${r} 0 1 0 ${n} ${i} Z`;
+        }
+      }
+    }
+    const Pl = T(() => {
+      if (!e.value.usePerformanceMode) return [""];
+      const { left: t, right: a, top: l, bottom: s } = u.value, o = Math.max(1, (a - t) * (s - l)), n = (d) => d / o * 1e4, i = 2.5, y = 1e3, r = e.value.style.layout.plots.stroke, f = e.value.style.layout.plots.strokeWidth, A = e.value.style.layout.plots.opacity;
+      return U.value.map((d) => {
+        const m = [];
+        for (const _ of d.plots) {
+          const O = _.x, D = _.y;
+          if (O < t || O > a || D < l || D > s) continue;
+          const L = Math.max(e.value.style.layout.plots.radius, _.weight);
+          m.push(Ll({
+            shape: d.shape || "circle",
+            cx: O,
+            cy: D,
+            r: L
+          }));
+        }
+        if (!m.length) return null;
+        const E = n(d.plots.length) > i || d.plots.length > y;
+        return {
+          id: d.id,
+          d: m.join(""),
+          fill: je(d.color, A * 100),
+          stroke: E ? "none" : r,
+          strokeWidth: E ? 0 : f,
+          strokeOpacity: 1
+        };
+      }).filter(Boolean);
+    });
+    function Bl() {
+      return e.value.usePerformanceMode ? (t) => {
+        const a = ie.value;
+        if (!a) return;
+        const l = a.createSVGPoint();
+        l.x = t.clientX, l.y = t.clientY;
+        const s = a.getScreenCTM();
+        if (!s) return;
+        const o = s.inverse(), n = l.matrixTransform(o), i = 8, y = i * i;
+        let r = null, f = 1 / 0, A = -1;
+        if (U.value.forEach((d, m) => {
+          d.plots.forEach((E) => {
+            const _ = E.x - n.x, O = E.y - n.y, D = _ * _ + O * O;
+            D <= y && D < f && (f = D, r = E, A = m);
+          });
+        }), r)
+          R.value !== r.id && (R.value = r.id, he(r, A, "pointer", ve.value.get(r.id) ?? null));
+        else if (R.value) {
+          const d = g.value;
+          R.value = void 0, Xe(d, A);
+        }
+      } : () => null;
+    }
+    const Yt = Bl();
+    function zl() {
+      if (R.value) {
+        const t = g.value;
+        R.value = void 0, Xe(t, null);
+      }
+    }
+    function Il(t) {
+      const a = g.value;
+      if (a) {
+        const l = U.value.findIndex((s) => s.id === a.clusterId);
+        Ye(a, l >= 0 ? l : 0);
+      }
+    }
+    const Pe = T(() => {
+      const t = e.value.table.useDialog && !e.value.table.show, a = q.value.showTable;
+      return {
+        component: t ? vl : sl,
+        title: `${e.value.style.title.text}${e.value.style.title.subtitle.text ? `: ${e.value.style.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: fe.value,
+          fullscreenParent: ne.value,
+          forcedWidth: Math.min(800, window.innerWidth * 0.8),
+          isCursorPointer: de.value
+        } : {
+          hideDetails: !0,
+          config: {
+            open: a,
+            maxHeight: 1e4,
+            body: {
+              backgroundColor: e.value.style.backgroundColor,
+              color: e.value.style.color
+            },
+            head: {
+              backgroundColor: e.value.style.backgroundColor,
+              color: e.value.style.color
+            }
+          }
+        }
+      };
+    });
+    Ue(() => q.value.showTable, (t) => {
+      e.value.table.show || (t && e.value.table.useDialog && Ae.value ? Ae.value.open() : "close" in Ae.value && Ae.value.close());
+    });
+    function Rt() {
+      q.value.showTable = !1, qe.value && qe.value.setTableIconState(!1);
+    }
+    const Ol = T(() => e.value.style.backgroundColor), Dl = T(() => e.value.style.legend), El = T(() => e.value.style.title), { exportSvg: Nl, getSvg: Fl } = pa({
+      svg: ie,
+      title: El,
+      legend: Dl,
+      legendItems: J,
+      backgroundColor: Ol
+    });
+    async function Vt({ isCb: t }) {
+      Ne.value = !0, await yt();
+      try {
+        if (t) {
+          const { blob: a, url: l, text: s, dataUrl: o } = await Fl();
+          await Promise.resolve(e.value.userOptions.callbacks.svg({ blob: a, url: l, text: s, dataUrl: o }));
+        } else
+          await Promise.resolve(Nl());
+      } finally {
+        Ne.value = !1;
+      }
+    }
+    function Wl(t) {
+      if (t?.stage === "start") {
+        Ee.value = !0;
+        return;
+      }
+      if (t?.stage === "end") {
+        Ee.value = !1;
+        return;
+      }
+      zt();
+    }
+    async function Ut() {
+      if (hl("copyAlt", {
+        config: e.value,
+        dataset: be.value
+      }), !e.value.userOptions.callbacks.altCopy) {
+        console.warn("Vue Data UI - A callback must be set for `altCopy` in userOptions.");
+        return;
+      }
+      await Promise.resolve(e.value.userOptions.callbacks.altCopy({
+        config: e.value,
+        dataset: be.value
+      }));
+    }
+    function jt(t, a) {
+      const l = we.value.filter((n) => n.id === t.id ? !1 : a === "right" ? n.x > t.x : a === "left" ? n.x < t.x : a === "down" ? n.y > t.y : a === "up" ? n.y < t.y : !1);
+      if (!l.length) return null;
+      let s = null, o = 1 / 0;
+      return l.forEach((n) => {
+        const i = n.x - t.x, y = n.y - t.y;
+        let r = 0, f = 0;
+        a === "right" || a === "left" ? (r = Math.abs(i), f = Math.abs(y)) : (r = Math.abs(y), f = Math.abs(i));
+        const A = r * 1e3 + f;
+        A < o && (s = n, o = A);
+      }), s;
+    }
+    function Xl() {
+      Te.value = null, me.value = null, Fe.value = !0;
+    }
+    function Yl() {
+      st(), Se.value = "pointer", Fe.value = !1;
+    }
+    function Rl(t) {
+      if (!ie.value || Le.value || document.activeElement !== ie.value || !we.value.length) return;
+      const a = t.key === "ArrowLeft", l = t.key === "ArrowRight", s = t.key === "ArrowUp", o = t.key === "ArrowDown", n = t.key === "Enter" || t.key === " ", i = t.key === "Escape";
+      if (!a && !l && !s && !o && !n && !i) return;
+      if (t.preventDefault(), t.stopPropagation(), i) {
+        st(), Se.value = "pointer";
+        return;
+      }
+      if (n) {
+        if (Te.value === null) return;
+        const m = we.value[Te.value];
+        if (!m) return;
+        Ye(m, m.seriesIndex);
+        return;
+      }
+      let y = null;
+      if (l && (y = "right"), a && (y = "left"), o && (y = "down"), s && (y = "up"), me.value === null) {
+        const m = g.value;
+        if (m && m.id) {
+          const D = jt(m, y);
+          if (!D) {
+            const C = ve.value.get(m.id);
+            if (C === void 0) return;
+            he(m, m.seriesIndex, "keyboard", C);
+            return;
+          }
+          const L = ve.value.get(D.id);
+          if (L === void 0) return;
+          he(D, D.seriesIndex, "keyboard", L);
+          return;
+        }
+        const _ = we.value[0];
+        if (!_) return;
+        const O = ve.value.get(_.id) ?? 0;
+        he(_, _.seriesIndex, "keyboard", O);
+        return;
+      }
+      const r = ve.value.get(me.value);
+      if (r === void 0) return;
+      const f = we.value[r];
+      if (!f) return;
+      const A = jt(f, y);
+      if (!A) return;
+      const d = ve.value.get(A.id);
+      d !== void 0 && he(A, A.seriesIndex, "keyboard", d);
+    }
+    const Vl = T(() => {
+      if (!g.value)
+        return "";
+      const t = g.value, a = isNaN(t.v.x) ? "-" : se(
+        e.value.style.layout.plots.selectors.labels.x.formatter,
+        t.v.x,
+        ee({
+          p: e.value.style.tooltip.prefix,
+          v: t.v.x,
+          s: e.value.style.tooltip.suffix,
+          r: e.value.style.tooltip.roundingValue
+        }),
+        { datapoint: t, seriesIndex: t.seriesIndex }
+      ), l = isNaN(t.v.y) ? "-" : se(
+        e.value.style.layout.plots.selectors.labels.y.formatter,
+        t.v.y,
+        ee({
+          p: e.value.style.tooltip.prefix,
+          v: t.v.y,
+          s: e.value.style.tooltip.suffix,
+          r: e.value.style.tooltip.roundingValue
+        }),
+        { datapoint: t, seriesIndex: t.seriesIndex }
+      );
+      return [
+        t.clusterName || "",
+        t.v.name || "",
+        `${e.value.style.layout.dataLabels.xAxis.name}: ${a}`,
+        `${e.value.style.layout.dataLabels.yAxis.name}: ${l}`
+      ].filter(Boolean).join(". ");
+    }), we = T(() => U.value.flatMap((t, a) => t.plots.map((l) => ({
+      ...l,
+      seriesIndex: a,
+      seriesId: t.id,
+      seriesName: t.name,
+      shape: t.shape || "circle",
+      color: t.color
+    })))), ve = T(() => {
+      const t = /* @__PURE__ */ new Map();
+      return we.value.forEach((a, l) => {
+        t.set(a.id, l);
+      }), t;
+    }), rt = T(() => {
+      const t = ke.value?.colNames ?? [], a = ke.value?.a11yBody ?? [];
+      return { headers: t, rows: a };
+    });
+    return tl({
+      getData: kl,
+      getImage: Al,
+      generatePdf: Bt,
+      generateCsv: nt,
+      generateImage: zt,
+      generateSvg: Vt,
+      hideSeries: Cl,
+      showSeries: _l,
+      toggleTable: Ft,
+      toggleTooltip: Wt,
+      toggleAnnotator: ut,
+      toggleFullscreen: Nt,
+      copyAlt: Ut
+    }), (t, a) => (v(), c("div", {
+      class: qt(`vue-data-ui-component vue-ui-scatter ${fe.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"}`),
+      ref_key: "scatterChart",
+      ref: ne,
+      id: `vue-ui-scatter_${N.value}`,
+      style: ue(`font-family:${e.value.style.fontFamily};width:100%; text-align:center;background:${e.value.style.backgroundColor};${e.value.responsive ? "height: 100%" : ""}`),
+      onMouseenter: a[5] || (a[5] = () => h(St)(!0)),
+      onMouseleave: a[6] || (a[6] = () => {
+        h(St)(!1), Fe.value || st();
+      })
+    }, [
+      k("div", {
+        id: `chart-instructions-${N.value}`,
+        class: "sr-only"
+      }, [
+        k("p", null, V(e.value.a11y.translations.keyboardNavigation), 1)
+      ], 8, Sa),
+      q.value.showTooltip ? x("", !0) : (v(), c("div", Ta, V(Vl.value), 1)),
+      rt.value?.rows?.length ? (v(), ae(Ma, {
+        key: 1,
+        uid: N.value,
+        head: rt.value.headers,
+        body: rt.value.rows,
+        notice: e.value.a11y.translations.tableAvailable,
+        caption: e.value.a11y.translations.tableCaption
+      }, null, 8, ["uid", "head", "body", "notice", "caption"])) : x("", !0),
+      e.value.userOptions.buttons.annotator ? (v(), ae(h(ul), {
+        key: 2,
+        svgRef: h(ie),
+        backgroundColor: e.value.style.backgroundColor,
+        color: e.value.style.color,
+        active: Le.value,
+        isCursorPointer: de.value,
+        onClose: ut
+      }, {
+        "annotator-action-close": B(() => [
+          z(t.$slots, "annotator-action-close", {}, void 0, !0)
+        ]),
+        "annotator-action-color": B(({ color: l }) => [
+          z(t.$slots, "annotator-action-color", H(K({ color: l })), void 0, !0)
+        ]),
+        "annotator-action-draw": B(({ mode: l }) => [
+          z(t.$slots, "annotator-action-draw", H(K({ mode: l })), void 0, !0)
+        ]),
+        "annotator-action-undo": B(({ disabled: l }) => [
+          z(t.$slots, "annotator-action-undo", H(K({ disabled: l })), void 0, !0)
+        ]),
+        "annotator-action-redo": B(({ disabled: l }) => [
+          z(t.$slots, "annotator-action-redo", H(K({ disabled: l })), void 0, !0)
+        ]),
+        "annotator-action-delete": B(({ disabled: l }) => [
+          z(t.$slots, "annotator-action-delete", H(K({ disabled: l })), void 0, !0)
+        ]),
+        _: 3
+      }, 8, ["svgRef", "backgroundColor", "color", "active", "isCursorPointer"])) : x("", !0),
+      xl.value ? (v(), c("div", {
+        key: 3,
+        ref_key: "noTitle",
+        ref: wt,
+        class: "vue-data-ui-no-title-space",
+        style: "height:36px; width: 100%;background:transparent"
+      }, null, 512)) : x("", !0),
+      e.value.style.title.text ? (v(), c("div", {
+        key: 4,
+        ref_key: "chartTitle",
+        ref: xt,
+        style: "width:100%;background:transparent"
+      }, [
+        (v(), ae(ka, {
+          key: `title_${$t.value}`,
+          config: {
+            title: {
+              cy: "scatter-div-title",
+              ...e.value.style.title
+            },
+            subtitle: {
+              cy: "scatter-div-subtitle",
+              ...e.value.style.title.subtitle
+            }
+          }
+        }, null, 8, ["config"]))
+      ], 512)) : x("", !0),
+      k("div", {
+        id: `legend-top-${N.value}`
+      }, null, 8, La),
+      e.value.userOptions.show && gt.value && (h(Tt) || h(et)) ? (v(), ae(h(il), {
+        ref_key: "userOptionsRef",
+        ref: qe,
+        key: `user_options_${mt.value}`,
+        backgroundColor: e.value.style.backgroundColor,
+        color: e.value.style.color,
+        isImaging: h(at),
+        isPrinting: h(lt),
+        uid: N.value,
+        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,
+        hasAltCopy: e.value.userOptions.buttons.altCopy,
+        isTooltip: q.value.showTooltip,
+        isFullscreen: fe.value,
+        titles: { ...e.value.userOptions.buttonTitles },
+        chartElement: ne.value,
+        position: e.value.userOptions.position,
+        hasAnnotator: e.value.userOptions.buttons.annotator,
+        isAnnotation: Le.value,
+        callbacks: e.value.userOptions.callbacks,
+        printScale: e.value.userOptions.print.scale,
+        tableDialog: e.value.table.useDialog,
+        isCursorPointer: de.value,
+        onToggleFullscreen: Nt,
+        onGeneratePdf: h(Bt),
+        onGenerateCsv: nt,
+        onGenerateImage: Wl,
+        onGenerateSvg: Vt,
+        onToggleTable: Ft,
+        onToggleTooltip: Wt,
+        onToggleAnnotator: ut,
+        onCopyAlt: Ut,
+        style: ue({
+          visibility: h(Tt) ? h(et) ? "visible" : "hidden" : "visible"
+        })
+      }, Ht({ _: 2 }, [
+        t.$slots.menuIcon ? {
+          name: "menuIcon",
+          fn: B(({ isOpen: l, color: s }) => [
+            z(t.$slots, "menuIcon", H(K({ isOpen: l, color: s })), void 0, !0)
+          ]),
+          key: "0"
+        } : void 0,
+        t.$slots.optionTooltip ? {
+          name: "optionTooltip",
+          fn: B(() => [
+            z(t.$slots, "optionTooltip", {}, void 0, !0)
+          ]),
+          key: "1"
+        } : void 0,
+        t.$slots.optionPdf ? {
+          name: "optionPdf",
+          fn: B(() => [
+            z(t.$slots, "optionPdf", {}, void 0, !0)
+          ]),
+          key: "2"
+        } : void 0,
+        t.$slots.optionCsv ? {
+          name: "optionCsv",
+          fn: B(() => [
+            z(t.$slots, "optionCsv", {}, void 0, !0)
+          ]),
+          key: "3"
+        } : void 0,
+        t.$slots.optionImg ? {
+          name: "optionImg",
+          fn: B(() => [
+            z(t.$slots, "optionImg", {}, void 0, !0)
+          ]),
+          key: "4"
+        } : void 0,
+        t.$slots.optionSvg ? {
+          name: "optionSvg",
+          fn: B(() => [
+            z(t.$slots, "optionSvg", {}, void 0, !0)
+          ]),
+          key: "5"
+        } : void 0,
+        t.$slots.optionTable ? {
+          name: "optionTable",
+          fn: B(() => [
+            z(t.$slots, "optionTable", {}, void 0, !0)
+          ]),
+          key: "6"
+        } : void 0,
+        t.$slots.optionFullscreen ? {
+          name: "optionFullscreen",
+          fn: B(({ toggleFullscreen: l, isFullscreen: s }) => [
+            z(t.$slots, "optionFullscreen", H(K({ toggleFullscreen: l, isFullscreen: s })), void 0, !0)
+          ]),
+          key: "7"
+        } : void 0,
+        t.$slots.optionAnnotator ? {
+          name: "optionAnnotator",
+          fn: B(({ toggleAnnotator: l, isAnnotator: s }) => [
+            z(t.$slots, "optionAnnotator", H(K({ toggleAnnotator: l, isAnnotator: s })), void 0, !0)
+          ]),
+          key: "8"
+        } : void 0,
+        t.$slots.optionAltCopy ? {
+          name: "optionAltCopy",
+          fn: B(({ altCopy: l }) => [
+            z(t.$slots, "optionAltCopy", H(K({ altCopy: l })), void 0, !0)
+          ]),
+          key: "9"
+        } : void 0
+      ]), 1032, ["backgroundColor", "color", "isImaging", "isPrinting", "uid", "hasTooltip", "hasPdf", "hasImg", "hasSvg", "hasXls", "hasTable", "hasFullscreen", "hasAltCopy", "isTooltip", "isFullscreen", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "callbacks", "printScale", "tableDialog", "isCursorPointer", "onGeneratePdf", "style"])) : x("", !0),
+      k("div", Pa, [
+        (v(), c("svg", {
+          ref_key: "svgRef",
+          ref: ie,
+          xmlns: h(aa),
+          "aria-describedby": `chart-instructions-${N.value}`,
+          class: qt({ "vue-data-ui-fullscreen--on": fe.value, "vue-data-ui-fulscreen--off": !fe.value, animated: e.value.useCssAnimation }),
+          viewBox: `0 0 ${Y.value.width <= 0 ? 10 : Y.value.width} ${Y.value.height <= 0 ? 10 : Y.value.height}`,
+          style: ue(`max-width:100%;overflow:visible;background:transparent;color:${e.value.style.color}`),
+          onMouseleave: it,
+          tabindex: "0",
+          onFocus: Xl,
+          onBlur: Yl,
+          onKeydown: Rl
+        }, [
+          Oe(h(rl)),
+          t.$slots["chart-background"] ? (v(), c("foreignObject", {
+            key: 0,
+            x: 0,
+            y: 0,
+            width: Y.value.width <= 0 ? 10 : Y.value.width,
+            height: Y.value.height <= 0 ? 10 : Y.value.height,
+            style: {
+              pointerEvents: "none"
+            }
+          }, [
+            z(t.$slots, "chart-background", {}, void 0, !0)
+          ], 8, za)) : x("", !0),
+          e.value.style.layout.axis.show ? (v(), c("g", Ia, [
+            k("line", {
+              x1: W.value.x,
+              x2: W.value.x,
+              y1: u.value.top,
+              y2: u.value.bottom,
+              stroke: e.value.style.layout.axis.stroke,
+              "stroke-width": e.value.style.layout.axis.strokeWidth,
+              "stroke-linecap": "round"
+            }, null, 8, Oa),
+            k("line", {
+              x1: u.value.left,
+              x2: u.value.right,
+              y1: W.value.y,
+              y2: W.value.y,
+              stroke: e.value.style.layout.axis.stroke,
+              "stroke-width": e.value.style.layout.axis.strokeWidth,
+              "stroke-linecap": "round"
+            }, null, 8, Da)
+          ])) : x("", !0),
+          e.value.style.layout.marginalBars.show ? (v(), c("g", Ea, [
+            k("defs", null, [
+              k("linearGradient", {
+                id: `marginal_x_${N.value}`,
+                x1: "0%",
+                y1: "0%",
+                x2: "0%",
+                y2: "100%"
+              }, [
+                k("stop", {
+                  offset: "0%",
+                  "stop-color": e.value.style.layout.marginalBars.fill
+                }, null, 8, Fa),
+                k("stop", {
+                  offset: "100%",
+                  "stop-color": e.value.style.backgroundColor
+                }, null, 8, Wa)
+              ], 8, Na),
+              k("linearGradient", {
+                id: `marginal_y_${N.value}`,
+                x1: "0%",
+                x2: "100%",
+                y1: "0%",
+                y2: "0%"
+              }, [
+                k("stop", {
+                  offset: "0%",
+                  "stop-color": e.value.style.backgroundColor
+                }, null, 8, Ya),
+                k("stop", {
+                  offset: "100%",
+                  "stop-color": e.value.style.layout.marginalBars.fill
+                }, null, 8, Ra)
+              ], 8, Xa)
+            ]),
+            (v(!0), c(Q, null, oe(S.value.x, (l, s) => (v(), c("g", null, [
+              l && S.value.avgX[s] ? (v(), c("rect", {
+                key: 0,
+                x: S.value.avgX[s] - u.value.width / $.value / 2,
+                y: u.value.top - e.value.style.layout.marginalBars.offset - l / S.value.maxX * e.value.style.layout.marginalBars.size,
+                width: u.value.width / $.value <= 0 ? 1e-4 : u.value.width / $.value,
+                height: l / S.value.maxX * e.value.style.layout.marginalBars.size <= 0 ? 1e-4 : l / S.value.maxX * e.value.style.layout.marginalBars.size,
+                fill: e.value.style.layout.marginalBars.useGradient ? `url(#marginal_x_${N.value})` : e.value.style.layout.marginalBars.fill,
+                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, Va)) : x("", !0),
+              S.value.avgX[s] ? (v(), c("rect", {
+                key: 1,
+                x: S.value.avgX[s] - u.value.width / $.value / 2,
+                y: u.value.top - e.value.style.layout.marginalBars.offset - e.value.style.layout.marginalBars.size,
+                width: u.value.width / $.value <= 0 ? 1e-4 : u.value.width / $.value,
+                height: Math.max(0.1, e.value.style.layout.marginalBars.size),
+                fill: "transparent",
+                onMouseenter: (o) => Sl(s),
+                onMouseleave: a[0] || (a[0] = (o) => it())
+              }, null, 40, Ua)) : x("", !0),
+              S.value.avgX[s] && _e.value != null && _e.value === s ? (v(), c("g", ja, [
+                k("rect", {
+                  x: S.value.avgX[s] - u.value.width / $.value / 2,
+                  y: u.value.top,
+                  width: u.value.width / $.value <= 0 ? 1e-4 : u.value.width / $.value,
+                  height: u.value.height,
+                  fill: e.value.style.layout.marginalBars.highlighter.color,
+                  "fill-opacity": e.value.style.layout.marginalBars.highlighter.opacity
+                }, null, 8, Ga),
+                k("line", {
+                  x1: S.value.avgX[s] - u.value.width / $.value / 2,
+                  x2: S.value.avgX[s] - u.value.width / $.value / 2,
+                  y1: 0,
+                  y2: u.value.top + u.value.height,
+                  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, qa),
+                k("line", {
+                  x1: S.value.avgX[s] - u.value.width / $.value / 2 + (u.value.width / $.value <= 0 ? 1e-4 : u.value.width / $.value),
+                  x2: S.value.avgX[s] - u.value.width / $.value / 2 + (u.value.width / $.value <= 0 ? 1e-4 : u.value.width / $.value),
+                  y1: 0,
+                  y2: u.value.top + u.value.height,
+                  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, Ha)
+              ])) : x("", !0)
+            ]))), 256)),
+            (v(!0), c(Q, null, oe(S.value.y, (l, s) => (v(), c("g", null, [
+              l && S.value.avgY[s] ? (v(), c("rect", {
+                key: 0,
+                x: u.value.right + e.value.style.layout.marginalBars.offset,
+                y: S.value.avgY[s] - u.value.height / $.value / 2,
+                height: u.value.height / $.value <= 0 ? 1e-4 : u.value.height / $.value,
+                width: l / S.value.maxY * e.value.style.layout.marginalBars.size <= 0 ? 1e-4 : l / S.value.maxY * e.value.style.layout.marginalBars.size,
+                fill: e.value.style.layout.marginalBars.useGradient ? `url(#marginal_y_${N.value})` : e.value.style.layout.marginalBars.fill,
+                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, Ka)) : x("", !0),
+              S.value.avgY[s] ? (v(), c("rect", {
+                key: 1,
+                x: u.value.right + e.value.style.layout.marginalBars.offset,
+                y: S.value.avgY[s] - u.value.height / $.value / 2,
+                width: Math.max(0.1, e.value.style.layout.marginalBars.size),
+                height: u.value.height / $.value <= 0 ? 1e-4 : u.value.height / $.value,
+                fill: "transparent",
+                onMouseenter: (o) => Tl(s),
+                onMouseleave: a[1] || (a[1] = (o) => it())
+              }, null, 40, Za)) : x("", !0),
+              S.value.avgY[s] && Ce.value != null && Ce.value === s ? (v(), c("g", Ja, [
+                k("rect", {
+                  x: u.value.left,
+                  y: S.value.avgY[s] - u.value.height / $.value / 2,
+                  width: u.value.width,
+                  height: u.value.height / $.value <= 0 ? 1e-4 : u.value.height / $.value,
+                  fill: e.value.style.layout.marginalBars.highlighter.color,
+                  "fill-opacity": e.value.style.layout.marginalBars.highlighter.opacity
+                }, null, 8, Qa),
+                k("line", {
+                  x1: u.value.left,
+                  x2: Y.value.width,
+                  y1: S.value.avgY[s] - u.value.height / $.value / 2,
+                  y2: S.value.avgY[s] - u.value.height / $.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, eo),
+                k("line", {
+                  x1: u.value.left,
+                  x2: Y.value.width,
+                  y1: S.value.avgY[s] - u.value.height / $.value / 2 + (u.value.height / $.value <= 0 ? 1e-4 : u.value.height / $.value),
+                  y2: S.value.avgY[s] - u.value.height / $.value / 2 + (u.value.height / $.value <= 0 ? 1e-4 : u.value.height / $.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, to)
+              ])) : x("", !0)
+            ]))), 256)),
+            e.value.style.layout.marginalBars.showLines ? (v(), c("g", lo, [
+              (v(!0), c(Q, null, oe(wl.value, (l) => (v(), c(Q, null, [
+                I.value.includes(l.id) ? x("", !0) : (v(), c("path", {
+                  key: 0,
+                  d: `M ${l.dX}`,
+                  stroke: e.value.style.backgroundColor,
+                  "stroke-width": e.value.style.layout.marginalBars.linesStrokeWidth + 1,
+                  "stroke-linecap": "round",
+                  "stroke-linejoin": "round",
+                  fill: "none"
+                }, null, 8, ao)),
+                I.value.includes(l.id) ? x("", !0) : (v(), c("path", {
+                  key: 1,
+                  d: `M ${l.dX}`,
+                  stroke: l.color,
+                  "stroke-width": e.value.style.layout.marginalBars.linesStrokeWidth,
+                  "stroke-linecap": "round",
+                  "stroke-linejoin": "round",
+                  fill: "none"
+                }, null, 8, oo)),
+                I.value.includes(l.id) ? x("", !0) : (v(), c("path", {
+                  key: 2,
+                  d: `M ${l.dY}`,
+                  stroke: e.value.style.backgroundColor,
+                  "stroke-width": e.value.style.layout.marginalBars.linesStrokeWidth + 1,
+                  "stroke-linecap": "round",
+                  "stroke-linejoin": "round",
+                  fill: "none"
+                }, null, 8, so)),
+                I.value.includes(l.id) ? x("", !0) : (v(), c("path", {
+                  key: 3,
+                  d: `M ${l.dY}`,
+                  stroke: l.color,
+                  "stroke-width": e.value.style.layout.marginalBars.linesStrokeWidth,
+                  "stroke-linecap": "round",
+                  "stroke-linejoin": "round",
+                  fill: "none"
+                }, null, 8, no))
+              ], 64))), 256))
+            ])) : x("", !0)
+          ])) : x("", !0),
+          e.value.style.layout.plots.giftWrap.show ? (v(), c("g", uo, [
+            (v(!0), c(Q, null, oe(U.value, (l, s) => (v(), c("g", null, [
+              l.plots.length > 2 ? (v(), c("polygon", {
+                key: 0,
+                points: h(oa)({ series: l.plots }),
+                fill: h(je)(l.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: l.color,
+                "stroke-linejoin": "round",
+                "stroke-linecap": "round"
+              }, null, 8, io)) : x("", !0)
+            ]))), 256))
+          ])) : x("", !0),
+          e.value.usePerformanceMode ? x("", !0) : (v(!0), c(Q, { key: 4 }, oe(U.value, (l, s) => (v(), c("g", null, [
+            !l.shape || l.shape === "circle" ? (v(), c("g", ro, [
+              (v(!0), c(Q, null, oe(l.plots, (o, n) => (v(), c("circle", {
+                cx: o.x,
+                cy: o.y,
+                r: R.value && R.value === o.id ? o.weight * 2 : o.weight,
+                fill: h(je)(l.color, e.value.style.layout.plots.opacity * 100),
+                stroke: e.value.style.layout.plots.stroke,
+                "stroke-width": e.value.style.layout.plots.strokeWidth,
+                style: ue(`opacity:${R.value && R.value === o.id ? 1 : e.value.style.layout.plots.significance.useDistanceOpacity ? 1 - Math.abs(o.deviation) / Ot.value : e.value.style.layout.plots.significance.show && Math.abs(o.deviation) > e.value.style.layout.plots.significance.deviationThreshold ? e.value.style.layout.plots.significance.opacity : 1}`),
+                onMouseover: (i) => he(o, s, "pointer", ve.value.get(o.id)),
+                onMouseleave: (i) => Xe(o, s),
+                onClick: (i) => Ye(o, s)
+              }, null, 44, vo))), 256))
+            ])) : (v(), c("g", co, [
+              (v(!0), c(Q, null, oe(l.plots, (o, n) => (v(), ae(pt, {
+                plot: { x: o.x, y: o.y },
+                radius: R.value && R.value === o.id ? o.weight * 2 : o.weight,
+                shape: l.shape,
+                color: h(je)(l.color, e.value.style.layout.plots.opacity * 100),
+                stroke: e.value.style.layout.plots.stroke,
+                strokeWidth: e.value.style.layout.plots.strokeWidth,
+                style: ue(`opacity:${R.value && R.value === o.id ? 1 : e.value.style.layout.plots.significance.useDistanceOpacity ? 1 - Math.abs(o.deviation) / Ot.value : e.value.style.layout.plots.significance.show && Math.abs(o.deviation) > e.value.style.layout.plots.significance.deviationThreshold ? e.value.style.layout.plots.significance.opacity : 1}`),
+                onMouseover: (i) => he(o, s, "pointer", ve.value.get(o.id)),
+                onMouseleave: (i) => Xe(o, s),
+                onClick: (i) => Ye(o, s)
+              }, null, 8, ["plot", "radius", "shape", "color", "stroke", "strokeWidth", "style", "onMouseover", "onMouseleave", "onClick"]))), 256))
+            ]))
+          ]))), 256)),
+          e.value.usePerformanceMode ? (v(), c(Q, { key: 5 }, [
+            k("g", {
+              "clip-path": `url(#clip_path_${N.value})`
+            }, [
+              (v(!0), c(Q, null, oe(Pl.value, (l) => (v(), c("path", {
+                key: l.id,
+                d: l.d,
+                fill: l.fill,
+                stroke: l.stroke,
+                "stroke-width": l.strokeWidth,
+                "stroke-opacity": l.strokeOpacity,
+                "vector-effect": "non-scaling-stroke",
+                "paint-order": "fill"
+              }, null, 8, ho))), 128))
+            ], 8, yo),
+            g.value && e.value.style.layout.plots.selectors.show ? (v(), c("g", fo, [
+              Oe(pt, {
+                shape: g.value.shape || "circle",
+                color: g.value.color,
+                plot: { x: g.value.x, y: g.value.y },
+                radius: Math.max(4 * Xt[g.value.shape || "circle"], g.value.weight * 2),
+                stroke: e.value.style.layout.plots.stroke,
+                strokeWidth: e.value.style.layout.plots.strokeWidth
+              }, null, 8, ["shape", "color", "plot", "radius", "stroke", "strokeWidth"])
+            ])) : x("", !0),
+            k("rect", {
+              x: u.value.left,
+              y: u.value.top,
+              width: Math.max(1e-4, u.value.width),
+              height: Math.max(1e-4, u.value.height),
+              fill: "transparent",
+              onMousemove: a[2] || (a[2] = (...l) => h(Yt) && h(Yt)(...l)),
+              onMouseleave: zl,
+              onClick: Il
+            }, null, 40, po)
+          ], 64)) : x("", !0),
+          g.value && e.value.style.layout.plots.selectors.show ? (v(), c("g", go, [
+            k("line", {
+              x1: W.value.x,
+              x2: g.value.x,
+              y1: g.value.y,
+              y2: g.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, mo),
+            k("line", {
+              x1: g.value.x,
+              x2: g.value.x,
+              y1: W.value.y,
+              y2: g.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, xo),
+            k("text", {
+              x: W.value.x + (g.value.x > W.value.x ? -6 : 6),
+              y: g.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": g.value.x > W.value.x ? "end" : "start"
+            }, V(h(se)(
+              e.value.style.layout.plots.selectors.labels.y.formatter,
+              h(Z)(g.value.v.y),
+              h(ee)({
+                p: e.value.style.layout.plots.selectors.labels.prefix,
+                v: h(Z)(g.value.v.y),
+                s: e.value.style.layout.plots.selectors.labels.suffix,
+                r: e.value.style.layout.plots.selectors.labels.rounding
+              }),
+              { datapoint: g.value }
+            )), 9, bo),
+            k("text", {
+              x: g.value.x,
+              y: W.value.y + (g.value.y > W.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"
+            }, V(h(se)(
+              e.value.style.layout.plots.selectors.labels.y.formatter,
+              h(Z)(g.value.v.x),
+              h(ee)({
+                p: e.value.style.layout.plots.selectors.labels.prefix,
+                v: h(Z)(g.value.v.x),
+                s: e.value.style.layout.plots.selectors.labels.suffix,
+                r: e.value.style.layout.plots.selectors.labels.rounding
+              }),
+              { datapoint: g.value }
+            )), 9, ko),
+            k("circle", {
+              cx: W.value.x,
+              cy: g.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, wo),
+            k("circle", {
+              cx: g.value.x,
+              cy: W.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, $o),
+            e.value.style.layout.plots.selectors.labels.showName ? (v(), c("text", {
+              key: 0,
+              x: g.value.x,
+              y: g.value.y + (g.value.y < W.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": g.value.x < u.value.left + 100 ? "start" : g.value.x > u.value.right - 100 ? "end" : g.value.x > W.value.x ? "start" : "end"
+            }, V(g.value.v.name), 9, Mo)) : x("", !0)
+          ])) : x("", !0),
+          e.value.style.layout.dataLabels.xAxis.show ? (v(), c("g", {
+            key: 7,
+            ref_key: "xAxisLabelLeft",
+            ref: He
+          }, [
+            k("text", {
+              id: `vue-ui-scatter-xAxis-label-${N.value}`,
+              transform: `translate(${e.value.style.layout.dataLabels.xAxis.fontSize}, ${u.value.top + u.value.height / 2}), rotate(-90)`,
+              "text-anchor": "middle",
+              "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
+            }, V(e.value.style.layout.dataLabels.xAxis.name), 9, _o),
+            k("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}, ${W.value.y + e.value.style.layout.dataLabels.xAxis.fontSize / 3}), rotate(-90)`
+            }, V(h(se)(
+              e.value.style.layout.plots.selectors.labels.x.formatter,
+              h(Z)(F.value.xMin),
+              h(ee)({
+                p: e.value.style.layout.plots.selectors.labels.prefix,
+                v: h(Z)(F.value.xMin),
+                s: e.value.style.layout.plots.selectors.labels.suffix,
+                r: e.value.style.layout.dataLabels.xAxis.rounding
+              })
+            )), 9, Co)
+          ], 512)) : x("", !0),
+          e.value.style.layout.dataLabels.xAxis.show ? (v(), c("text", {
+            key: 8,
+            ref_key: "xAxisLabelRight",
+            ref: fl,
+            "text-anchor": "middle",
+            transform: `translate(${u.value.right + e.value.style.layout.padding.right + 6}, ${W.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
+          }, V(h(se)(
+            e.value.style.layout.plots.selectors.labels.x.formatter,
+            h(Z)(F.value.xMax),
+            h(ee)({
+              p: e.value.style.layout.plots.selectors.labels.prefix,
+              v: h(Z)(F.value.xMax),
+              s: e.value.style.layout.plots.selectors.labels.suffix,
+              r: e.value.style.layout.dataLabels.xAxis.rounding
+            })
+          )), 9, Ao)) : x("", !0),
+          e.value.style.layout.dataLabels.yAxis.show ? (v(), c("text", {
+            key: 9,
+            ref_key: "yAxisLabelTop",
+            ref: pl,
+            x: W.value.x,
+            y: u.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
+          }, V(h(se)(
+            e.value.style.layout.plots.selectors.labels.y.formatter,
+            h(Z)(F.value.yMax),
+            h(ee)({
+              p: e.value.style.layout.plots.selectors.labels.prefix,
+              v: h(Z)(F.value.yMax),
+              s: e.value.style.layout.plots.selectors.labels.suffix,
+              r: e.value.style.layout.dataLabels.yAxis.rounding
+            })
+          )), 9, So)) : x("", !0),
+          e.value.style.layout.dataLabels.yAxis.show ? (v(), c("g", {
+            key: 10,
+            ref_key: "yAxisLabelBottom",
+            ref: Ke
+          }, [
+            k("text", {
+              x: W.value.x,
+              y: Y.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
+            }, V(h(se)(
+              e.value.style.layout.plots.selectors.labels.y.formatter,
+              h(Z)(F.value.yMin),
+              h(ee)({
+                p: e.value.style.layout.plots.selectors.labels.prefix,
+                v: h(Z)(F.value.yMin),
+                s: e.value.style.layout.plots.selectors.labels.suffix,
+                r: e.value.style.layout.dataLabels.yAxis.rounding
+              })
+            )), 9, To),
+            k("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: u.value.left + u.value.width / 2,
+              y: Y.value.height
+            }, V(e.value.style.layout.dataLabels.yAxis.name), 9, Lo)
+          ], 512)) : x("", !0),
+          k("clipPath", {
+            id: `clip_path_${N.value}`
+          }, [
+            k("rect", {
+              x: u.value.left,
+              y: u.value.top,
+              width: u.value.width <= 0 ? 1e-4 : u.value.width,
+              height: u.value.height <= 0 ? 1e-4 : u.value.height
+            }, null, 8, Bo)
+          ], 8, Po),
+          e.value.style.layout.correlation.show ? (v(), c("g", zo, [
+            (v(!0), c(Q, null, oe(U.value, (l, s) => (v(), c("line", {
+              x1: l.correlation.x1,
+              x2: l.correlation.x2,
+              y1: l.correlation.y1,
+              y2: l.correlation.y2,
+              "stroke-dasharray": e.value.style.layout.correlation.strokeDasharray,
+              stroke: l.color,
+              "stroke-width": e.value.style.layout.correlation.strokeWidth,
+              "clip-path": `url(#clip_path_${N.value})`
+            }, null, 8, Io))), 256)),
+            (v(!0), c(Q, null, oe(U.value, (l, s) => (v(), c("g", null, [
+              e.value.style.layout.correlation.label.show ? (v(), c("text", {
+                key: 0,
+                x: l.correlation.x2,
+                y: l.correlation.y2,
+                fill: e.value.style.layout.correlation.label.useSerieColor ? l.color : e.value.style.layout.correlation.label.color,
+                "text-anchor": "end",
+                "font-size": e.value.style.layout.correlation.label.fontSize,
+                "font-weight": e.value.style.layout.correlation.label.bold ? "bold" : "normal"
+              }, V(h(ee)({
+                v: h(Z)(l.correlation.coefficient),
+                r: e.value.style.layout.correlation.label.roundingValue
+              })), 9, Oo)) : x("", !0)
+            ]))), 256))
+          ])) : x("", !0),
+          z(t.$slots, "svg", {
+            svg: {
+              ...Y.value,
+              drawingArea: {
+                ...u.value,
+                zero: W.value
+              },
+              data: be.value,
+              isPrintingImg: h(lt) | h(at) | Ee.value,
+              isPrintingSvg: Ne.value
+            }
+          }, void 0, !0)
+        ], 46, Ba)),
+        t.$slots.hint ? (v(), c("div", Do, [
+          z(t.$slots, "hint", H(K({ hint: e.value.a11y.translations.keyboardNavigation, isVisible: Fe.value })), void 0, !0)
+        ])) : x("", !0)
+      ]),
+      t.$slots.watermark ? (v(), c("div", Eo, [
+        z(t.$slots, "watermark", H(K({ isPrinting: h(lt) || h(at) || Ee.value || Ne.value })), void 0, !0)
+      ])) : x("", !0),
+      k("div", {
+        id: `legend-bottom-${N.value}`
+      }, null, 8, No),
+      Ct.value ? (v(), ae(ql, {
+        key: 7,
+        to: e.value.style.legend.position === "top" ? `#legend-top-${N.value}` : `#legend-bottom-${N.value}`
+      }, [
+        k("div", {
+          ref_key: "chartLegend",
+          ref: bt
+        }, [
+          e.value.style.legend.show ? (v(), ae($a, {
+            key: `legend_${_t.value}`,
+            legendSet: J.value,
+            config: bl.value,
+            isCursorPointer: de.value,
+            onClickMarker: a[3] || (a[3] = ({ legend: l }) => Re(l.id))
+          }, {
+            item: B(({ legend: l }) => [
+              k("div", {
+                onClick: (s) => l.segregate(),
+                style: ue(`opacity:${I.value.includes(l.id) ? 0.5 : 1}`)
+              }, V(l.name), 13, Fo)
+            ]),
+            legendToggle: B(() => [
+              J.value.length > 2 && e.value.style.legend.selectAllToggle.show && !h(Ze) ? (v(), ae(_a, {
+                key: 0,
+                backgroundColor: e.value.style.legend.selectAllToggle.backgroundColor,
+                color: e.value.style.legend.selectAllToggle.color,
+                fontSize: e.value.style.legend.fontSize,
+                checked: I.value.length > 0,
+                isCursorPointer: de.value,
+                onToggle: Ml
+              }, null, 8, ["backgroundColor", "color", "fontSize", "checked", "isCursorPointer"])) : x("", !0)
+            ]),
+            _: 1
+          }, 8, ["legendSet", "config", "isCursorPointer"])) : z(t.$slots, "legend", {
+            key: 1,
+            legend: J.value
+          }, void 0, !0)
+        ], 512)
+      ], 8, ["to"])) : x("", !0),
+      t.$slots.source ? (v(), c("div", {
+        key: 8,
+        ref_key: "source",
+        ref: kt,
+        dir: "auto"
+      }, [
+        z(t.$slots, "source", {}, void 0, !0)
+      ], 512)) : x("", !0),
+      Oe(h(al), {
+        teleportTo: e.value.style.tooltip.teleportTo,
+        show: q.value.showTooltip && De.value,
+        backgroundColor: e.value.style.tooltip.backgroundColor,
+        color: e.value.style.tooltip.color,
+        borderRadius: e.value.style.tooltip.borderRadius,
+        borderColor: e.value.style.tooltip.borderColor,
+        borderWidth: e.value.style.tooltip.borderWidth,
+        fontSize: e.value.style.tooltip.fontSize,
+        backgroundOpacity: e.value.style.tooltip.backgroundOpacity,
+        position: e.value.style.tooltip.position,
+        offsetY: e.value.style.tooltip.offsetY,
+        parent: ne.value,
+        content: Ge.value,
+        isFullscreen: fe.value,
+        isCustom: e.value.style.tooltip.customFormat && typeof e.value.style.tooltip.customFormat == "function",
+        smooth: e.value.style.tooltip.smooth,
+        backdropFilter: e.value.style.tooltip.backdropFilter,
+        smoothForce: e.value.style.tooltip.smoothForce,
+        smoothSnapThreshold: e.value.style.tooltip.smoothSnapThreshold,
+        isA11yMode: Se.value === "keyboard",
+        a11yPosition: At.value
+      }, {
+        "tooltip-before": B(() => [
+          z(t.$slots, "tooltip-before", H(K({ ...ot.value })), void 0, !0)
+        ]),
+        "tooltip-after": B(() => [
+          z(t.$slots, "tooltip-after", H(K({ ...ot.value })), void 0, !0)
+        ]),
+        default: B(() => [
+          e.value.style.tooltip.showShape ? (v(), c("div", Wo, [
+            (v(), c("svg", Xo, [
+              Oe(pt, {
+                shape: g.value.shape,
+                color: g.value.color,
+                plot: { x: 10, y: 10 },
+                radius: 7
+              }, null, 8, ["shape", "color"])
+            ]))
+          ])) : x("", !0)
+        ]),
+        _: 3
+      }, 8, ["teleportTo", "show", "backgroundColor", "color", "borderRadius", "borderColor", "borderWidth", "fontSize", "backgroundOpacity", "position", "offsetY", "parent", "content", "isFullscreen", "isCustom", "smooth", "backdropFilter", "smoothForce", "smoothSnapThreshold", "isA11yMode", "a11yPosition"]),
+      gt.value && e.value.userOptions.buttons.table ? (v(), ae(Hl(Pe.value.component), Kl({ key: 9 }, Pe.value.props, {
+        ref_key: "tableUnit",
+        ref: Ae,
+        onClose: Rt
+      }), Ht({
+        content: B(() => [
+          (v(), ae(h(nl), {
+            key: `table_${Mt.value}`,
+            colNames: ke.value.colNames,
+            head: ke.value.head,
+            body: ke.value.body,
+            config: ke.value.config,
+            title: e.value.table.useDialog ? "" : Pe.value.title,
+            withCloseButton: !e.value.table.useDialog,
+            isCursorPointer: de.value,
+            onClose: Rt
+          }, {
+            th: B(({ th: l }) => [
+              Kt(V(l), 1)
+            ]),
+            td: B(({ td: l }) => [
+              l.shape ? (v(), c("div", Yo, [
+                k("span", null, V(l.content), 1)
+              ])) : (v(), c("div", {
+                key: 1,
+                innerHTML: l
+              }, null, 8, Ro))
+            ]),
+            _: 1
+          }, 8, ["colNames", "head", "body", "config", "title", "withCloseButton", "isCursorPointer"]))
+        ]),
+        _: 2
+      }, [
+        e.value.table.useDialog ? {
+          name: "title",
+          fn: B(() => [
+            Kt(V(Pe.value.title), 1)
+          ]),
+          key: "0"
+        } : void 0,
+        e.value.table.useDialog ? {
+          name: "actions",
+          fn: B(() => [
+            k("button", {
+              tabindex: "0",
+              class: "vue-ui-user-options-button",
+              onClick: a[4] || (a[4] = (l) => nt(e.value.userOptions.callbacks.csv)),
+              style: ue({ cursor: de.value ? "pointer" : "default" })
+            }, [
+              Oe(h(ol), {
+                name: "fileCsv",
+                stroke: Pe.value.props.color
+              }, null, 8, ["stroke"])
+            ], 4)
+          ]),
+          key: "1"
+        } : void 0
+      ]), 1040)) : x("", !0),
+      z(t.$slots, "skeleton", {}, () => [
+        h(Ze) ? (v(), ae(ha, { key: 0 })) : x("", !0)
+      ], !0)
+    ], 46, Aa));
+  }
+}, vs = /* @__PURE__ */ Ca(Vo, [["__scopeId", "data-v-cde737cf"]]);
+export {
+  vs as default
+};