vue-data-ui 2.12.6 → 2.12.7-beta.1

package/dist/vue-ui-xy-canvas-ml44sPHS.js

@@ -1,1673 +0,0 @@
-import { ref as c, computed as R, onMounted as ot, nextTick as Oe, onBeforeUnmount as $t, watch as _, createElementBlock as M, openBlock as w, Fragment as je, createCommentVNode as Z, normalizeStyle as N, normalizeClass as ve, createElementVNode as W, withDirectives as gt, createVNode as me, toDisplayString as Qe, unref as D, vModelText as pt, withModifiers as mt, renderList as bt, useSlots as Gt, createBlock as ie, createSlots as Zt, withCtx as A, renderSlot as P, normalizeProps as ye, guardReactiveProps as ge, createTextVNode as qt } from "vue";
-import { l as St, f as be, X as jt, u as Kt, c as Qt, t as _t, p as pe, a as Jt, C as Ke, b as el, D as lt, i as Le, d as xt, a1 as tl, H as ll, aj as al, o as ol, e as nl, x as kt, q as rl, r as ul, y as sl, s as Re } from "./index-BFzQMJda.js";
-import { d as il, t as vl, u as cl, c as dl, a as Lt, l as F, r as at, b as ne, p as wt } from "./useResponsive-JZ9xq-JV.js";
-import { _ as hl } from "./Tooltip-CWmRmhJr.js";
-import { L as fl } from "./Legend-BxtDQCIv.js";
-import { _ as yl } from "./Title-CzaCeCOm.js";
-import { S as gl } from "./Slicer-7qFdY-bT.js";
-import { u as pl, U as ml } from "./usePrinter-C5bLp34h.js";
-import bl from "./vue-ui-accordion-BUz4JIIX.js";
-import { D as xl } from "./DataTable-Rajdtaf6.js";
-import kl from "./vue-ui-skeleton-B_YI7Yuc.js";
-import { u as Ct } from "./useNestedProp-v7KPpwuP.js";
-import { u as Ll } from "./useUserOptionState-BIvW1Kz7.js";
-import { u as wl } from "./useChartAccessibility-BWojgys7.js";
-import De from "./BaseIcon-CNbwMh_-.js";
-import { C as Cl } from "./ColorPicker-B_FoQwtO.js";
-import { _ as zt } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const $l = {
-  class: /* @__PURE__ */ ve({
-    "vue-ui-pen-and-paper-action": !0
-  }),
-  style: { padding: "0 !important" }
-}, Sl = ["disabled"], zl = ["data-mode", "xmlns", "viewBox"], Ml = ["cx", "cy", "r", "fill"], Tl = ["d", "stroke", "stroke-width"], Il = ["x", "y", "fill", "font-size"], Al = ["x", "dy"], El = ["d", "stroke", "stroke-width"], Pl = {
-  __name: "NonSvgPenAndPaper",
-  props: {
-    parent: {
-      type: HTMLElement
-    },
-    backgroundColor: {
-      type: String,
-      default: "#FFFFFF"
-    },
-    color: {
-      type: String,
-      default: "#2D353C"
-    },
-    active: {
-      type: Boolean,
-      default: !1
-    }
-  },
-  emits: ["close"],
-  setup($, { emit: _e }) {
-    const J = $, Je = _e, k = c([]), q = c([]), re = c("0 0 0 0"), H = c(J.color), f = c(1), p = c("draw"), L = c(null), ee = c(!1), d = c(null), j = c({ x: 0, y: 0 }), K = c([""]), T = c({ row: 0, col: 0 }), B = c(16);
-    let te = 1;
-    function le() {
-      return te++;
-    }
-    function we(s) {
-      var l;
-      const n = U.value;
-      if (!n) return { x: 0, y: 0 };
-      const a = n.createSVGPoint();
-      let r = s.clientX, v = s.clientY;
-      s.touches && s.touches.length && (r = s.touches[0].clientX, v = s.touches[0].clientY), a.x = r, a.y = v;
-      const h = (l = n.getScreenCTM()) == null ? void 0 : l.inverse();
-      return h ? a.matrixTransform(h) : { x: 0, y: 0 };
-    }
-    function Ce(s) {
-      if (!L.value || p.value !== "text" || ee.value) return;
-      const { x: n, y: a } = we(s);
-      j.value = { x: n, y: a }, K.value = [""], T.value = { row: 0, col: 0 };
-      const r = document.createElementNS("http://www.w3.org/2000/svg", "text");
-      r.setAttribute("x", n), r.setAttribute("y", a), r.setAttribute("fill", H.value), r.setAttribute("font-size", B.value), r.setAttribute("font-family", "sans-serif"), r.setAttribute("class", "vue-data-ui-doodle"), r.setAttribute("dominant-baseline", "hanging"), r.setAttribute("pointer-events", "all");
-      const v = document.createElementNS("http://www.w3.org/2000/svg", "tspan");
-      v.setAttribute("x", n), v.setAttribute("dy", "0"), v.textContent = "", r.appendChild(v), r.style.pointerEvents = "none", r.style.userSelect = "none", L.value.appendChild(r), d.value = r, ee.value = !0, window.addEventListener("keydown", $e), window.addEventListener("mousedown", ze, !0), ce(), Se();
-    }
-    function $e(s) {
-      if (!ee.value) return;
-      let { row: n, col: a } = T.value, r = K.value.slice(), v = !1;
-      if (s.key === "Enter") {
-        const h = r[n], l = h.slice(0, a), z = h.slice(a);
-        r.splice(n, 1, l, z), n += 1, a = 0, v = !0, s.preventDefault();
-      } else if (s.key === "Backspace") {
-        if (a > 0)
-          r[n] = r[n].slice(0, a - 1) + r[n].slice(a), a -= 1, v = !0;
-        else if (n > 0) {
-          const h = r[n - 1].length;
-          r[n - 1] += r[n], r.splice(n, 1), n -= 1, a = h, v = !0;
-        }
-        s.preventDefault();
-      } else if (s.key === "Delete")
-        a < r[n].length ? (r[n] = r[n].slice(0, a) + r[n].slice(a + 1), v = !0) : n < r.length - 1 && (r[n] += r[n + 1], r.splice(n + 1, 1), v = !0), s.preventDefault();
-      else if (s.key === "ArrowLeft")
-        a > 0 ? a -= 1 : n > 0 && (n -= 1, a = r[n].length), v = !0, s.preventDefault();
-      else if (s.key === "ArrowRight")
-        a < r[n].length ? a += 1 : n < r.length - 1 && (n += 1, a = 0), v = !0, s.preventDefault();
-      else if (s.key === "ArrowUp")
-        n > 0 && (n -= 1, a = Math.min(a, r[n].length), v = !0), s.preventDefault();
-      else if (s.key === "ArrowDown")
-        n < r.length - 1 && (n += 1, a = Math.min(a, r[n].length), v = !0), s.preventDefault();
-      else if (s.key.length === 1 && !s.ctrlKey && !s.metaKey && !s.altKey)
-        r[n] = r[n].slice(0, a) + s.key + r[n].slice(a), a += 1, v = !0, s.preventDefault();
-      else if (s.key === "Escape") {
-        Me(!0);
-        return;
-      } else s.key === "Tab" && s.preventDefault();
-      v && (K.value = r, T.value = { row: n, col: a }, ce(), Se());
-    }
-    function ce() {
-      const s = d.value, { x: n, y: a } = j.value;
-      for (; s.firstChild; ) s.removeChild(s.firstChild);
-      K.value.forEach((r, v) => {
-        const h = document.createElementNS("http://www.w3.org/2000/svg", "tspan");
-        h.setAttribute("x", n), h.setAttribute("dy", v === 0 ? "0" : `${B.value * 1.2}`), h.textContent = r.length ? r : "​", s.appendChild(h);
-      });
-    }
-    function Se() {
-      const s = L.value.querySelector(".vue-data-ui-svg-caret");
-      s && L.value.removeChild(s);
-      const n = d.value;
-      if (!n) return;
-      const { x: a, y: r } = j.value, { row: v, col: h } = T.value, l = B.value, z = n.childNodes[v];
-      if (!z) return;
-      let I = z.textContent.slice(0, h);
-      I.endsWith(" ") && (I += " ");
-      const y = document.createElementNS("http://www.w3.org/2000/svg", "text");
-      y.setAttribute("x", a), y.setAttribute("y", r), y.setAttribute("font-size", l), y.setAttribute("font-family", "sans-serif"), y.textContent = I || "", L.value.appendChild(y);
-      const E = y.getBBox();
-      L.value.removeChild(y);
-      let S = r + v * l * 1.2, g = a + E.width;
-      const i = document.createElementNS("http://www.w3.org/2000/svg", "rect");
-      i.setAttribute("x", g), i.setAttribute("y", S), i.setAttribute("width", 1), i.setAttribute("height", l), i.setAttribute("fill", H.value), i.setAttribute("class", "vue-data-ui-svg-caret"), L.value.appendChild(i);
-    }
-    function ze(s) {
-      if (d.value && !d.value.contains(s.target)) {
-        const n = d.value.children;
-        n.length === 1 && (n[0].textContent === "" || n[0].textContent === "​") && d.value.remove(), Me(!1);
-      }
-    }
-    function Me(s = !1) {
-      var r;
-      window.removeEventListener("keydown", $e), window.removeEventListener("mousedown", ze, !0);
-      const n = (r = L.value) == null ? void 0 : r.querySelector(".vue-data-ui-svg-caret");
-      n && L.value.removeChild(n);
-      const a = K.value.every(
-        (v) => !v || v === "​"
-      );
-      s || a || k.value.push({
-        id: le(),
-        type: "text",
-        x: j.value.x,
-        y: j.value.y,
-        color: H.value,
-        fontSize: B.value,
-        lines: K.value.map((v) => v)
-      }), d.value && L.value && L.value.contains(d.value) && L.value.removeChild(d.value), ee.value = !1, d.value = null, K.value = [""], T.value = { row: 0, col: 0 };
-    }
-    const Q = R(() => St(J.color, 0.6));
-    function de({ width: s, height: n }) {
-      re.value = `0 0 ${s} ${n}`;
-    }
-    const ue = c(null);
-    ot(() => {
-      Oe(() => {
-        if (J.parent) {
-          ue.value = new ResizeObserver((a) => {
-            for (const r of a) {
-              const { width: v, height: h } = r.contentRect;
-              de({ width: v, height: h });
-            }
-          }), ue.value.observe(J.parent);
-          const { width: s, height: n } = J.parent.getBoundingClientRect();
-          de({ width: s, height: n });
-        }
-      }), L.value = U.value.querySelector("g");
-    }), $t(() => {
-      ue.value && ue.value.disconnect();
-    }), _(
-      () => J.parent,
-      (s) => {
-        if (!s) return;
-        const { width: n, height: a } = J.parent.getBoundingClientRect();
-        de({ width: n, height: a });
-      },
-      { immediate: !0 }
-    ), _(p, (s) => {
-      var n, a;
-      s === "text" ? (n = U.value) == null || n.addEventListener("mousedown", Ce) : (a = U.value) == null || a.removeEventListener("mousedown", Ce);
-    });
-    const ae = c(!1), O = c(""), U = c(null);
-    function Ne(s) {
-      if (p.value !== "draw" || !U.value) return;
-      ae.value = !0;
-      const { x: n, y: a } = V(s);
-      O.value = `M ${n} ${a}`;
-    }
-    function Be(s) {
-      if (!ae.value || !U.value) return;
-      const { x: n, y: a } = V(s);
-      O.value += ` ${n} ${a}`;
-    }
-    function t(s) {
-      const n = s.trim().split(/\s+/);
-      if (n.length < 4)
-        return s;
-      const a = n.slice(1).map(Number);
-      if (a.length % 2 !== 0)
-        return s;
-      const r = Te(a), v = [`M ${r[0]} ${r[1]}`];
-      for (let z = 2; z < r.length - 2; z += 2) {
-        const I = r[z - 2], y = r[z - 1], E = r[z], S = r[z + 1], g = (I + E) / 2, i = (y + S) / 2;
-        v.push(`Q ${I} ${y} ${g} ${i}`);
-      }
-      const h = r[r.length - 2], l = r[r.length - 1];
-      return v.push(`L ${h} ${l}`), v.join(" ");
-    }
-    function Te(s, n = 1) {
-      const a = [...s];
-      for (let r = 2; r < s.length - 2; r += 2) {
-        const v = s[r], h = s[r + 1], l = s[r - 2], z = s[r - 1], I = s[r + 2], y = s[r + 3];
-        a[r] = v + n * ((l + I) / 2 - v), a[r + 1] = h + n * ((z + y) / 2 - h);
-      }
-      return a;
-    }
-    function Ye(s) {
-      const n = s.trim().split(/\s+/);
-      let a = "", r = "", v = null, h = null;
-      for (let l = 0; l < n.length; l += 1) {
-        const z = n[l];
-        if (isNaN(z)) {
-          if (r = z, r === "M" || r === "L")
-            v = parseFloat(n[++l]), h = parseFloat(n[++l]), a += `${r}${v} ${h}`;
-          else if (r === "Q") {
-            const I = parseFloat(n[++l]), y = parseFloat(n[++l]), E = parseFloat(n[++l]), S = parseFloat(n[++l]);
-            I === v && y === h ? a += `t${E - v} ${S - h}` : a += `q${I - v} ${y - h} ${E - v} ${S - h}`, v = E, h = S;
-          }
-        } else {
-          const I = parseFloat(z), y = parseFloat(n[++l]);
-          if (r === "L") {
-            const E = I - v, S = y - h;
-            E === 0 ? a += `v${S}` : S === 0 ? a += `h${E}` : a += `l${E} ${S}`, v = I, h = y;
-          } else if (r === "Q") {
-            const E = I, S = y, g = parseFloat(n[++l]), i = parseFloat(n[++l]);
-            E === v && S === h ? a += `t${g - v} ${i - h}` : a += `q${E - v} ${S - h} ${g - v} ${i - h}`, v = g, h = i;
-          }
-        }
-      }
-      return a;
-    }
-    function xe() {
-      ae.value && (k.value.push({
-        id: le(),
-        strokeWidth: f.value,
-        path: Ye(t(O.value)),
-        color: H.value
-      }), q.value = [], O.value = ""), ae.value = !1;
-    }
-    function V(s) {
-      if (!U.value) return { x: 0, y: 0 };
-      const n = U.value.getBoundingClientRect();
-      let a, r;
-      return s.touches && s.touches.length ? (a = s.touches[0].clientX, r = s.touches[0].clientY) : (a = s.clientX, r = s.clientY), {
-        x: a - n.left,
-        y: r - n.top
-      };
-    }
-    function Xe() {
-      if (k.value.length > 0) {
-        const s = k.value.pop();
-        q.value.push(s);
-      }
-    }
-    function He() {
-      if (q.value.length > 0) {
-        const s = q.value.pop();
-        k.value.push(s);
-      }
-    }
-    function Ue() {
-      k.value = [], q.value = [];
-    }
-    const Ie = c(null);
-    return (s, n) => (w(), M(je, null, [
-      $.active ? (w(), M("div", {
-        key: 0,
-        "data-dom-to-png-ignore": "",
-        class: ve({
-          "vue-ui-pen-and-paper-actions": !0,
-          visible: $.active
-        }),
-        style: N({ backgroundColor: $.backgroundColor })
-      }, [
-        W("button", {
-          class: "vue-ui-pen-and-paper-action",
-          style: N({
-            backgroundColor: $.backgroundColor,
-            border: `1px solid ${Q.value}`
-          }),
-          onClick: n[0] || (n[0] = (a) => Je("close"))
-        }, [
-          me(De, {
-            name: "close",
-            stroke: $.color
-          }, null, 8, ["stroke"])
-        ], 4),
-        W("button", $l, [
-          me(Cl, {
-            value: H.value,
-            "onUpdate:value": n[1] || (n[1] = (a) => H.value = a),
-            backgroundColor: $.backgroundColor,
-            buttonBorderColor: Q.value
-          }, null, 8, ["value", "backgroundColor", "buttonBorderColor"])
-        ]),
-        W("button", {
-          class: ve(["vue-ui-pen-and-paper-action", { "vue-ui-pen-and-paper-action-active": p.value === "text" }]),
-          onClick: n[2] || (n[2] = (a) => p.value = p.value === "text" ? "draw" : "text"),
-          style: N({
-            backgroundColor: $.backgroundColor,
-            border: `1px solid ${Q.value}`
-          })
-        }, [
-          me(De, {
-            name: p.value === "draw" ? "annotator" : "text",
-            stroke: $.color
-          }, null, 8, ["name", "stroke"]),
-          W("div", {
-            style: N({
-              position: "absolute",
-              bottom: "-20px",
-              color: Q.value,
-              width: "100%",
-              textAlign: "center",
-              fontSize: "12px"
-            })
-          }, Qe(D(be)({
-            v: p.value === "draw" ? f.value : B.value,
-            s: "px",
-            r: 1
-          })), 5)
-        ], 6),
-        W("button", {
-          class: ve({
-            "vue-ui-pen-and-paper-action": !0,
-            "vue-ui-pen-and-paper-action-disabled": !k.value.length
-          }),
-          disabled: !k.value.length,
-          style: N({
-            backgroundColor: $.backgroundColor,
-            border: `1px solid ${Q.value}`,
-            marginTop: "20px"
-          }),
-          onClick: Xe
-        }, [
-          me(De, {
-            name: "restart",
-            stroke: $.color
-          }, null, 8, ["stroke"])
-        ], 14, Sl),
-        W("button", {
-          class: ve({
-            "vue-ui-pen-and-paper-action": !0,
-            "vue-ui-pen-and-paper-action-disabled": !q.value.length
-          }),
-          style: N({
-            backgroundColor: $.backgroundColor,
-            border: `1px solid ${Q.value}`
-          }),
-          onClick: He
-        }, [
-          me(De, {
-            name: "restart",
-            stroke: $.color,
-            style: { transform: "scaleX(-1)" }
-          }, null, 8, ["stroke"])
-        ], 6),
-        W("button", {
-          class: ve([{
-            "vue-ui-pen-and-paper-action": !0,
-            "vue-ui-pen-and-paper-action-disabled": !k.value.length
-          }, "vue-ui-pen-and-paper-action"]),
-          style: N({
-            backgroundColor: $.backgroundColor,
-            border: `1px solid ${Q.value}`
-          }),
-          onClick: Ue
-        }, [
-          me(De, {
-            name: "trash",
-            stroke: $.color
-          }, null, 8, ["stroke"])
-        ], 6),
-        p.value === "draw" ? gt((w(), M("input", {
-          key: 0,
-          ref_key: "range",
-          ref: Ie,
-          type: "range",
-          class: "vertical-range",
-          min: 0.5,
-          max: 12,
-          step: 0.1,
-          "onUpdate:modelValue": n[3] || (n[3] = (a) => f.value = a),
-          style: N({ accentColor: $.color })
-        }, null, 4)), [
-          [pt, f.value]
-        ]) : Z("", !0),
-        p.value === "text" ? gt((w(), M("input", {
-          key: 1,
-          ref_key: "range",
-          ref: Ie,
-          type: "range",
-          class: "vertical-range",
-          min: 3,
-          max: 48,
-          step: 0.1,
-          "onUpdate:modelValue": n[4] || (n[4] = (a) => B.value = a),
-          style: N({ accentColor: $.color })
-        }, null, 4)), [
-          [pt, B.value]
-        ]) : Z("", !0)
-      ], 6)) : Z("", !0),
-      (w(), M("svg", {
-        "data-mode": p.value,
-        ref_key: "svgElement",
-        ref: U,
-        xmlns: D(jt),
-        viewBox: re.value,
-        class: ve({
-          "vue-ui-pen-and-paper": !0,
-          inactive: !$.active
-        }),
-        onMousedown: Ne,
-        onMousemove: Be,
-        onMouseup: xe,
-        onMouseleave: xe,
-        onTouchstart: mt(Ne, ["prevent"]),
-        onTouchmove: mt(Be, ["prevent"]),
-        onTouchend: xe
-      }, [
-        W("g", {
-          ref_key: "G",
-          ref: L
-        }, [
-          (w(!0), M(je, null, bt(k.value, (a) => (w(), M(je, {
-            key: a.id
-          }, [
-            a.path && a.path.replace("M", "").split(" ").length === 2 ? (w(), M("circle", {
-              key: 0,
-              cx: a.path.replace("M", "").split(" ")[0],
-              cy: a.path.replace("M", "").split(" ")[1],
-              r: a.strokeWidth / 2,
-              fill: a.color
-            }, null, 8, Ml)) : a.path ? (w(), M("path", {
-              key: 1,
-              class: "vue-ui-pen-and-paper-path",
-              d: a.path,
-              stroke: a.color,
-              "stroke-width": a.strokeWidth,
-              fill: "none"
-            }, null, 8, Tl)) : a.type === "text" ? (w(), M("text", {
-              key: 2,
-              x: a.x,
-              y: a.y,
-              fill: a.color,
-              "font-size": a.fontSize,
-              "font-family": "sans-serif",
-              "dominant-baseline": "hanging",
-              class: "vue-ui-pen-and-paper-text"
-            }, [
-              (w(!0), M(je, null, bt(a.lines, (r, v) => (w(), M("tspan", {
-                key: v,
-                x: a.x,
-                dy: v === 0 ? "0" : a.fontSize * 1.2
-              }, Qe(r.length ? r : "​"), 9, Al))), 128))
-            ], 8, Il)) : Z("", !0)
-          ], 64))), 128))
-        ], 512),
-        ae.value ? (w(), M("path", {
-          key: 0,
-          class: "vue-ui-pen-and-paper-path vue-ui-pen-and-paper-path-drawing",
-          d: t(O.value),
-          stroke: H.value,
-          "stroke-width": f.value * 1.1,
-          fill: "none"
-        }, null, 8, El)) : Z("", !0)
-      ], 42, zl))
-    ], 64));
-  }
-}, Fl = /* @__PURE__ */ zt(Pl, [["__scopeId", "data-v-14478ba4"]]), Rl = ["id"], Dl = ["onClick"], Ol = {
-  key: 2,
-  class: "vue-data-ui-watermark"
-}, Nl = ["innerHTML"], Bl = {
-  __name: "vue-ui-xy-canvas",
-  props: {
-    dataset: {
-      type: Array,
-      default() {
-        return [];
-      }
-    },
-    config: {
-      type: Object,
-      default() {
-        return {};
-      }
-    }
-  },
-  emits: ["selectLegend"],
-  setup($, { expose: _e, emit: J }) {
-    const { vue_ui_xy_canvas: Je } = Kt(), k = $, q = c(Qt()), re = c(null), H = c(null), f = c(null), p = c(1), L = c(1), ee = c(!1), d = c(null), j = c(""), K = c(null), T = c([]), B = c(1), te = c(!0), le = c(!0), we = c(null), Ce = c(0), $e = c(0), ce = c(!1), Se = c(null), ze = c(null), Me = c(null), Q = c(null), de = c(0), ue = c(0), ae = c(0), O = c(null), U = R(() => !!k.dataset && k.dataset.length), Ne = J, Be = Gt();
-    ot(() => {
-      Be["chart-background"] && console.warn("VueUiXyCanvas does not support the #chart-background slot.");
-    });
-    const t = R({
-      get: () => Xe(),
-      set: (e) => e
-    }), { userOptionsVisible: Te, setUserOptionsVisibility: Ye, keepUserOptionState: xe } = Ll({ config: t.value }), { svgRef: V } = wl({ config: t.value.style.chart.title });
-    function Xe() {
-      const e = Ct({
-        userConfig: k.config,
-        defaultConfig: Je
-      });
-      let o = {};
-      return e.theme ? o = {
-        ...Ct({
-          userConfig: Jt.vue_ui_xy_canvas[e.theme] || k.config,
-          defaultConfig: e
-        }),
-        customPalette: _t[e.theme] || pe
-      } : o = e, k.config && Ke(k.config, "style.chart.scale.min") ? o.style.chart.scale.min = k.config.style.chart.scale.min : o.style.chart.scale.min = null, k.config && Ke(k.config, "style.chart.scale.max") ? o.style.chart.scale.max = k.config.style.chart.scale.max : o.style.chart.scale.max = null, k.config && Ke(k.config, "style.chart.zoom.startIndex") ? o.style.chart.zoom.startIndex = k.config.style.chart.zoom.startIndex : o.style.chart.zoom.startIndex = null, k.config && Ke(k.config, "style.chart.zoom.endIndex") ? o.style.chart.zoom.endIndex = k.config.style.chart.zoom.endIndex : o.style.chart.zoom.endIndex = null, o;
-    }
-    _(() => k.config, (e) => {
-      t.value = Xe(), Te.value = !t.value.userOptions.showOnChartHover, et(), de.value += 1, ue.value += 1, ae.value += 1, a.value.showTable = t.value.table.show, a.value.showDataLabels = t.value.style.chart.dataLabels.show, a.value.stacked = t.value.style.chart.stacked, a.value.showTooltip = t.value.style.chart.tooltip.show;
-    }, { deep: !0 }), _(() => k.dataset, () => {
-      et(), de.value += 1, ue.value += 1, ae.value += 1;
-    }, { deep: !0 });
-    const He = c(t.value.style.chart.aspectRatio), { isPrinting: Ue, isImaging: Ie, generatePdf: s, generateImage: n } = pl({
-      elementId: `xy_canvas_${q.value}`,
-      fileName: t.value.style.chart.title.text || "vue-ui-xy-canvas",
-      options: t.value.userOptions.print
-    }), a = c({
-      showTable: t.value.table.show,
-      showDataLabels: t.value.style.chart.dataLabels.show,
-      stacked: t.value.style.chart.stacked,
-      showTooltip: t.value.style.chart.tooltip.show
-    });
-    function r(e) {
-      ce.value = e, $e.value += 1;
-    }
-    const v = R(() => el(t.value.customPalette)), h = R(() => S.value ? Math.max(...S.value.filter((e, o) => !T.value.includes(e.absoluteIndex)).map((e) => e.series.length)) : 0), l = R(() => {
-      const e = p.value - p.value * (t.value.style.chart.paddingProportions.left + t.value.style.chart.paddingProportions.right);
-      return {
-        canvasWidth: p.value,
-        canvasHeight: L.value,
-        left: p.value * t.value.style.chart.paddingProportions.left,
-        top: L.value * t.value.style.chart.paddingProportions.top,
-        right: p.value - p.value * t.value.style.chart.paddingProportions.right,
-        bottom: L.value - L.value * t.value.style.chart.paddingProportions.bottom,
-        width: e,
-        height: L.value - L.value * (t.value.style.chart.paddingProportions.top + t.value.style.chart.paddingProportions.bottom),
-        slot: e / (i.value.end - i.value.start)
-      };
-    });
-    function z(e, o) {
-      return e / o;
-    }
-    function I({ hasAutoScale: e, series: o, min: u, max: m, scale: x, yOffset: X, individualHeight: b, stackIndex: C = null }) {
-      return o.map((he, G) => {
-        const se = x.min < 0 ? Math.abs(x.min) : 0, fe = z(he + se, se + x.max);
-        let Pe, Fe;
-        e && (Pe = x.min, Fe = z(he - Pe, x.max - Pe));
-        let oe = 0;
-        return C === null ? oe = l.value.bottom - l.value.height * (e ? Fe : fe) : oe = l.value.bottom - X - b * (e ? Fe : fe), {
-          x: l.value.left + l.value.slot * G + l.value.slot / 2,
-          y: oe,
-          value: he
-        };
-      });
-    }
-    const y = R(() => {
-      const e = t.value.style.chart.scale.min !== null ? t.value.style.chart.scale.min : Math.min(...S.value.filter((b, C) => !T.value.includes(b.absoluteIndex)).flatMap((b) => b.series.slice(i.value.start, i.value.end))), o = t.value.style.chart.scale.max !== null ? t.value.style.chart.scale.max : Math.max(...S.value.filter((b, C) => !T.value.includes(b.absoluteIndex)).flatMap((b) => b.series.slice(i.value.start, i.value.end))), u = lt(e < 0 ? e : 0, o === e ? e + 1 < 0 ? 0 : e + 1 : o < 0 ? 0 : o, t.value.style.chart.scale.ticks), m = u.min < 0 ? Math.abs(u.min) : 0, x = l.value.bottom - l.value.height * (m / (u.max + m)), X = u.ticks.map((b) => ({
-        y: l.value.bottom - l.value.height * ((b + m) / (u.max + m)),
-        x: l.value.left - 8,
-        value: b
-      }));
-      return {
-        absoluteMin: m,
-        max: o,
-        min: e,
-        scale: u,
-        yLabels: X,
-        zero: x
-      };
-    }), E = R(() => g.value.map((e) => `
-            <div style="display:flex;flex-direction:row;gap:6px;align-items:center;">
-                <svg viewBox="0 0 10 10" height="12" width="12">
-                    <circle cx="5" cy="5" r="5" fill="${e.color}"/>
-                </svg>
-                <span>${e.name ? e.name + ": " : ""}</span>
-                <span>${Le(
-      t.value.style.chart.dataLabels.formatter,
-      e.series[d.value],
-      be({
-        p: e.prefix || "",
-        v: e.series[d.value],
-        s: e.suffix || "",
-        r: e.rounding || 0
-      }),
-      { datapoint: e, seriesIndex: d.value }
-    )}</span>
-            </div>
-        `)), S = R(() => k.dataset.map((e, o) => ({
-      ...e,
-      series: tl({
-        data: ll(e.series),
-        threshold: t.value.downsample.threshold
-      }),
-      absoluteIndex: o,
-      color: xt(e.color || v.value[o] || pe[o] || pe[o % pe.length])
-    })));
-    _(h, (e) => {
-      e && nt();
-    });
-    const g = R(() => al(S.value.filter((e, o) => !T.value.includes(e.absoluteIndex))).map((e, o) => ({
-      ...e,
-      series: e.series.slice(i.value.start, i.value.end)
-    })).map((e, o) => {
-      let u = [null, void 0].includes(e.scaleMin) ? Math.min(...e.series) || 0 : e.scaleMin, m = [null, void 0].includes(e.scaleMax) ? Math.max(...e.series) || 1 : e.scaleMax;
-      u === m && (u = u >= 0 ? m - 1 : u, m = m >= 0 ? m : u + 1), e.series.filter((oe) => ![null, void 0].includes(oe)).map((oe) => (oe - u) / (m - u));
-      const x = {
-        valueMin: u,
-        valueMax: m
-      }, X = e.scaleSteps || t.value.style.chart.scale.ticks;
-      let b;
-      e.autoScaling ? b = lt(x.valueMin, x.valueMax, X) : b = lt(x.valueMin < 0 ? x.valueMin : 0, x.valueMax <= 0 ? 0 : x.valueMax, X);
-      const C = a.value.stacked ? l.value.height * (1 - e.cumulatedStackRatio) : 0, he = a.value.stacked ? l.value.height / t.value.style.chart.stackGap : 0, G = a.value.stacked ? l.value.height * e.stackRatio - he : l.value.height, se = b.min < 0 ? Math.abs(b.min) : 0;
-      let fe;
-      e.autoScaling && a.value.stacked && m <= 0 ? fe = l.value.bottom - C - G : fe = l.value.bottom - C - G * (se / (b.max + se));
-      const Pe = b.ticks.map((oe, Vt) => ({
-        y: l.value.bottom - C - G * (Vt / (b.ticks.length - 1)),
-        x: l.value.left - 8,
-        value: oe
-      })), Fe = I({
-        hasAutoScale: a.value.stacked && e.autoScaling,
-        series: e.series,
-        min: a.value.stacked ? u : y.value.min,
-        max: a.value.stacked ? m : y.value.max,
-        scale: a.value.stacked ? b : y.value.scale,
-        yOffset: C,
-        individualHeight: G,
-        stackIndex: a.value.stacked ? o : null
-      });
-      return {
-        ...e,
-        coordinatesLine: Fe,
-        min: u,
-        max: m,
-        localScale: b,
-        localZero: fe,
-        localMin: se,
-        localYLabels: Pe,
-        yOffset: C,
-        individualHeight: G
-      };
-    })), i = c({
-      start: 0,
-      end: h.value
-    });
-    function nt() {
-      rt();
-    }
-    const ke = c(null);
-    async function rt() {
-      (t.value.style.chart.zoom.startIndex !== null || t.value.style.chart.zoom.endIndex !== null) && ke.value ? (t.value.style.chart.zoom.startIndex !== null && (await Oe(), await Oe(), ke.value && ke.value.setStartValue(t.value.style.chart.zoom.startIndex)), t.value.style.chart.zoom.endIndex !== null && (await Oe(), await Oe(), ke.value && ke.value.setEndValue(Mt(t.value.style.chart.zoom.endIndex + 1)))) : (i.value = {
-        start: 0,
-        end: h.value
-      }, Ce.value += 1);
-    }
-    function Mt(e) {
-      const o = h.value;
-      return e > o ? o : e < 0 || t.value.style.chart.zoom.startIndex !== null && e < t.value.style.chart.zoom.startIndex ? t.value.style.chart.zoom.startIndex !== null ? t.value.style.chart.zoom.startIndex + 1 : 1 : e;
-    }
-    const Tt = R(() => g.value.filter((e) => ["line", "plot", void 0].includes(e.type))), Y = R(() => g.value.filter((e) => e.type === "bar"));
-    function It() {
-      if (!V.value)
-        return;
-      const e = H.value.offsetWidth, o = H.value.offsetHeight;
-      V.value.width = e * B.value * 2, V.value.height = o * B.value * 2, p.value = e * B.value * 2, L.value = o * B.value * 2, f.value.scale(B.value, B.value), Ae();
-    }
-    function At() {
-      if (f.value.clearRect(0, 0, 1e4, 1e4), f.value.fillStyle = t.value.style.chart.backgroundColor, f.value.fillRect(0, 0, l.value.canvasWidth, l.value.canvasHeight), a.value.stacked)
-        t.value.style.chart.grid.y.verticalLines.show && i.value.end - i.value.start < t.value.style.chart.grid.y.verticalLines.hideUnderXLength ? g.value.forEach((e) => {
-          for (let o = 0; o < i.value.end - i.value.start + 1; o += 1)
-            F(
-              f.value,
-              [
-                {
-                  x: l.value.left + l.value.slot * o,
-                  y: l.value.bottom - e.yOffset - e.individualHeight
-                },
-                {
-                  x: l.value.left + l.value.slot * o,
-                  y: l.value.bottom - e.yOffset
-                }
-              ],
-              {
-                color: t.value.style.chart.grid.y.verticalLines.color
-              }
-            );
-        }) : t.value.style.chart.grid.y.verticalLines.show && i.value.end - i.value.start >= t.value.style.chart.grid.y.verticalLines.hideUnderXLength && g.value.forEach((e) => {
-          for (let o = i.value.start; o < i.value.end; o += 1)
-            o % Math.floor((i.value.end - i.value.start) / t.value.style.chart.grid.y.timeLabels.modulo) === 0 && F(
-              f.value,
-              [
-                {
-                  x: l.value.left + l.value.slot * (o - i.value.start) + l.value.slot / 2,
-                  y: l.value.bottom - e.yOffset - e.individualHeight
-                },
-                {
-                  x: l.value.left + l.value.slot * (o - i.value.start) + l.value.slot / 2,
-                  y: l.value.bottom - e.yOffset
-                }
-              ],
-              {
-                color: t.value.style.chart.grid.y.verticalLines.color
-              }
-            );
-        }), t.value.style.chart.grid.x.horizontalLines.show && (t.value.style.chart.grid.x.horizontalLines.alternate ? g.value.forEach((e) => {
-          e.localYLabels.forEach((o, u) => {
-            u < e.localYLabels.length - 1 && at(
-              f.value,
-              [
-                { x: l.value.left, y: o.y },
-                { x: l.value.right, y: o.y },
-                { x: l.value.right, y: e.localYLabels[u + 1].y },
-                { x: l.value.left, y: e.localYLabels[u + 1].y }
-              ],
-              {
-                fillColor: u % 2 === 0 ? "transparent" : Re(t.value.style.chart.grid.x.horizontalLines.color, t.value.style.chart.grid.x.horizontalLines.opacity),
-                strokeColor: "transparent"
-              }
-            );
-          });
-        }) : g.value.forEach((e) => {
-          e.localYLabels.slice(i.value.start, i.value.end).forEach((o) => {
-            F(
-              f.value,
-              [
-                { x: l.value.left, y: o.y },
-                { x: l.value.right, y: o.y }
-              ],
-              {
-                color: t.value.style.chart.grid.x.horizontalLines.color
-              }
-            );
-          });
-        })), t.value.style.chart.grid.zeroLine.show && g.value.forEach((e) => {
-          F(
-            f.value,
-            [
-              { x: l.value.left, y: e.localZero },
-              { x: l.value.right, y: e.localZero }
-            ],
-            {
-              color: t.value.style.chart.grid.zeroLine.color,
-              lineDash: t.value.style.chart.grid.zeroLine.dashed ? [10, 10] : [0, 0]
-            }
-          );
-        }), t.value.style.chart.grid.y.axisLabels.show && g.value.forEach((e) => {
-          F(
-            f.value,
-            [
-              { x: l.value.left, y: l.value.bottom - e.yOffset },
-              { x: l.value.left, y: l.value.bottom - e.yOffset - e.individualHeight }
-            ],
-            {
-              color: e.color
-            }
-          ), F(
-            f.value,
-            [
-              { x: l.value.right, y: l.value.bottom - e.yOffset },
-              { x: l.value.right, y: l.value.bottom - e.yOffset - e.individualHeight }
-            ],
-            {
-              color: e.color
-            }
-          );
-        }), g.value.forEach((e) => {
-          ne(
-            f.value,
-            e.name,
-            p.value / 35,
-            l.value.bottom - e.yOffset - e.individualHeight / 2,
-            {
-              align: "center",
-              rotation: -90,
-              color: e.color,
-              font: `${Math.round(p.value / 40 * t.value.style.chart.grid.y.axisLabels.fontSizeRatio)}px ${t.value.style.fontFamily}`
-            }
-          );
-        });
-      else {
-        if (t.value.style.chart.grid.y.verticalLines.show && i.value.end - i.value.start < t.value.style.chart.grid.y.verticalLines.hideUnderXLength)
-          for (let e = 0; e < i.value.end - i.value.start + 1; e += 1)
-            F(
-              f.value,
-              [
-                { x: l.value.left + l.value.slot * e, y: l.value.top },
-                { x: l.value.left + l.value.slot * e, y: l.value.bottom }
-              ],
-              {
-                color: t.value.style.chart.grid.y.verticalLines.color
-              }
-            );
-        else if (t.value.style.chart.grid.y.verticalLines.show && i.value.end - i.value.start >= t.value.style.chart.grid.y.verticalLines.hideUnderXLength)
-          for (let e = i.value.start; e < i.value.end; e += 1)
-            e % Math.floor((i.value.end - i.value.start) / t.value.style.chart.grid.y.timeLabels.modulo) === 0 && F(
-              f.value,
-              [
-                { x: l.value.left + l.value.slot * (e - i.value.start) + l.value.slot / 2, y: l.value.top },
-                { x: l.value.left + l.value.slot * (e - i.value.start) + l.value.slot / 2, y: l.value.bottom }
-              ],
-              {
-                color: t.value.style.chart.grid.y.verticalLines.color
-              }
-            );
-        t.value.style.chart.grid.x.horizontalLines.show && (t.value.style.chart.grid.x.horizontalLines.alternate ? y.value.yLabels.forEach((e, o) => {
-          o < y.value.yLabels.length - 1 && at(
-            f.value,
-            [
-              { x: l.value.left, y: e.y },
-              { x: l.value.right, y: e.y },
-              { x: l.value.right, y: y.value.yLabels[o + 1].y },
-              { x: l.value.left, y: y.value.yLabels[o + 1].y }
-            ],
-            {
-              fillColor: o % 2 === 0 ? "transparent" : Re(t.value.style.chart.grid.x.horizontalLines.color, t.value.style.chart.grid.x.horizontalLines.opacity),
-              strokeColor: "transparent"
-            }
-          );
-        }) : y.value.yLabels.forEach((e) => {
-          F(
-            f.value,
-            [
-              { x: l.value.left, y: e.y },
-              { x: l.value.right, y: e.y }
-            ],
-            {
-              color: t.value.style.chart.grid.x.horizontalLines.color
-            }
-          );
-        })), t.value.style.chart.grid.y.showAxis && F(
-          f.value,
-          [
-            { x: l.value.left, y: l.value.top },
-            { x: l.value.left, y: l.value.bottom }
-          ],
-          {
-            color: t.value.style.chart.grid.y.axisColor,
-            lineWidth: t.value.style.chart.grid.y.axisThickness
-          }
-        ), t.value.style.chart.grid.x.showAxis && F(
-          f.value,
-          [
-            { x: l.value.left, y: l.value.bottom },
-            { x: l.value.right, y: l.value.bottom }
-          ],
-          {
-            color: t.value.style.chart.grid.x.axisColor,
-            lineWidth: t.value.style.chart.grid.x.axisThickness
-          }
-        ), t.value.style.chart.grid.zeroLine.show && F(
-          f.value,
-          [
-            { x: l.value.left, y: y.value.zero },
-            { x: l.value.right, y: y.value.zero }
-          ],
-          {
-            color: t.value.style.chart.grid.zeroLine.color,
-            lineDash: t.value.style.chart.grid.zeroLine.dashed ? [10, 10] : [0, 0]
-          }
-        );
-      }
-      t.value.style.chart.grid.y.axisName && ne(
-        f.value,
-        t.value.style.chart.grid.y.axisName,
-        p.value - p.value / 40 * t.value.style.chart.grid.y.axisLabels.fontSizeRatio * 1.2,
-        l.value.bottom - l.value.height / 2,
-        {
-          font: `${t.value.style.chart.grid.y.axisLabels.bold ? "bold " : ""}${Math.round(p.value / 40 * t.value.style.chart.grid.y.axisLabels.fontSizeRatio)}px ${t.value.style.fontFamily}`,
-          color: t.value.style.chart.color,
-          align: "center",
-          rotation: 90
-        }
-      ), t.value.style.chart.grid.x.axisName && ne(
-        f.value,
-        t.value.style.chart.grid.x.axisName,
-        p.value / 2,
-        L.value,
-        {
-          font: `${t.value.style.chart.grid.y.axisLabels.bold ? "bold " : ""}${Math.round(p.value / 40 * t.value.style.chart.grid.y.axisLabels.fontSizeRatio)}px ${t.value.style.fontFamily}`,
-          color: t.value.style.chart.color,
-          align: "center"
-        }
-      );
-    }
-    function Et(e) {
-      for (let o = 0; o < e.coordinatesLine.length; o += 1) {
-        const u = (d.value === o ? p.value / 150 : t.value.style.chart.line.plots.show ? p.value / 200 : 0) * t.value.style.chart.line.plots.radiusRatio;
-        Lt(
-          f.value,
-          { x: e.coordinatesLine[o].x, y: e.coordinatesLine[o].y },
-          u,
-          {
-            color: t.value.style.chart.backgroundColor,
-            fillStyle: e.color
-          }
-        );
-      }
-    }
-    function Pt() {
-      g.value.forEach((e) => {
-        e.showYMarker && Ee(e) && ne(
-          f.value,
-          Le(
-            t.value.style.chart.dataLabels.formatter,
-            Ee(e).value,
-            be({
-              p: e.prefix || t.value.style.chart.grid.y.axisLabels.prefix || "",
-              v: Ee(e).value,
-              s: e.suffix || t.value.style.chart.grid.y.axisLabels.suffix || "",
-              r: e.rounding || t.value.style.chart.grid.y.axisLabels.rounding || 0
-            }),
-            { datapoint: Ee(e), seriesIndex: null }
-          ),
-          l.value.left - 8 + t.value.style.chart.grid.y.axisLabels.offsetX,
-          Ee(e).y,
-          {
-            align: "right",
-            font: `${t.value.style.chart.grid.y.axisLabels.bold ? "bold " : ""}${Math.round(p.value / 40 * t.value.style.chart.grid.y.axisLabels.fontSizeRatio)}px ${t.value.style.fontFamily}`,
-            color: e.color
-          }
-        );
-      });
-    }
-    function Ft() {
-      t.value.style.chart.grid.y.axisLabels.show && (a.value.stacked ? g.value.forEach((e) => {
-        e.localYLabels.forEach((o, u) => {
-          ne(
-            f.value,
-            Le(
-              t.value.style.chart.dataLabels.formatter,
-              o.value,
-              be({
-                p: e.prefix || t.value.style.chart.grid.y.axisLabels.prefix || "",
-                v: o.value,
-                s: e.suffix || t.value.style.chart.grid.y.axisLabels.suffix || "",
-                r: e.rounding || t.value.style.chart.grid.y.axisLabels.rounding || 0
-              }),
-              { datapoint: o, seriesIndex: u }
-            ),
-            o.x + t.value.style.chart.grid.y.axisLabels.offsetX,
-            o.y,
-            {
-              align: "right",
-              font: `${t.value.style.chart.grid.y.axisLabels.bold ? "bold " : ""}${Math.round(p.value / 40 * t.value.style.chart.grid.y.axisLabels.fontSizeRatio)}px ${t.value.style.fontFamily}`,
-              color: e.color,
-              globalAlpha: e.showYMarker && ![null, void 0].includes(d.value) ? 0.2 : 1
-            }
-          );
-        });
-      }) : y.value.yLabels.forEach((e, o) => {
-        ne(
-          f.value,
-          Le(
-            t.value.style.chart.dataLabels.formatter,
-            e.value,
-            be({
-              p: t.value.style.chart.grid.y.axisLabels.prefix || "",
-              v: e.value,
-              s: t.value.style.chart.grid.y.axisLabels.suffix || "",
-              r: t.value.style.chart.grid.y.axisLabels.rounding || 0
-            }),
-            { datapoint: e, seriesIndex: o }
-          ),
-          e.x + t.value.style.chart.grid.y.axisLabels.offsetX,
-          e.y,
-          {
-            align: "right",
-            font: `${t.value.style.chart.grid.y.axisLabels.bold ? "bold " : ""}${Math.round(p.value / 40 * t.value.style.chart.grid.y.axisLabels.fontSizeRatio)}px ${t.value.style.fontFamily}`,
-            color: t.value.style.chart.grid.y.axisLabels.color,
-            globalAlpha: g.value.some((u) => u.showYMarker) && ![null, void 0].includes(d.value) ? 0.2 : 1
-          }
-        );
-      }));
-    }
-    function Rt(e) {
-      for (let o = 0; o < e.coordinatesLine.length; o += 1)
-        ne(
-          f.value,
-          Le(
-            t.value.style.chart.dataLabels.formatter,
-            e.coordinatesLine[o].value,
-            be({
-              p: e.prefix || "",
-              v: e.coordinatesLine[o].value,
-              s: e.suffix || "",
-              r: e.rounding || 0
-            }),
-            { datapoint: e.coordinatesLine[o], seriesIndex: o }
-          ),
-          e.coordinatesLine[o].x,
-          e.coordinatesLine[o].y + t.value.style.chart.dataLabels.offsetY,
-          {
-            align: "center",
-            font: `${t.value.style.chart.dataLabels.bold ? "bold " : ""}${Math.round(p.value / 40 * t.value.style.chart.dataLabels.fontSizeRatio)}px ${t.value.style.fontFamily}`,
-            color: t.value.style.chart.dataLabels.useSerieColor ? e.color : t.value.style.chart.dataLabels.color
-          }
-        );
-    }
-    function Dt() {
-      for (let e = i.value.start; e < i.value.end; e += 1)
-        (i.value.end - i.value.start < t.value.style.chart.grid.y.timeLabels.modulo || i.value.end - i.value.start >= t.value.style.chart.grid.y.timeLabels.modulo && (e % Math.floor((i.value.end - i.value.start) / t.value.style.chart.grid.y.timeLabels.modulo) === 0 || e === d.value + i.value.start && t.value.style.chart.grid.y.timeLabels.showMarker)) && ne(
-          f.value,
-          t.value.style.chart.grid.y.timeLabels.values[e] || e + 1,
-          l.value.left + l.value.slot * (e - i.value.start) + l.value.slot / 2,
-          l.value.bottom + p.value / t.value.style.chart.grid.y.timeLabels.offsetY,
-          {
-            align: t.value.style.chart.grid.y.timeLabels.rotation === 0 ? "center" : t.value.style.chart.grid.y.timeLabels.rotation > 0 ? "left" : "right",
-            font: `${t.value.style.chart.grid.y.timeLabels.bold ? "bold " : ""}${Math.round(p.value / 40 * t.value.style.chart.grid.y.timeLabels.fontSizeRatio)}px ${t.value.style.fontFamily}`,
-            color: t.value.style.chart.grid.y.timeLabels.showMarker ? Re(t.value.style.chart.grid.y.timeLabels.color, d.value !== null ? d.value + i.value.start === e ? 100 : 20 : 100) : t.value.style.chart.grid.y.timeLabels.color,
-            rotation: t.value.style.chart.grid.y.timeLabels.rotation
-          }
-        );
-    }
-    function ut() {
-      F(
-        f.value,
-        [
-          { x: l.value.left + l.value.slot * d.value + l.value.slot / 2, y: l.value.top },
-          { x: l.value.left + l.value.slot * d.value + l.value.slot / 2, y: l.value.bottom }
-        ],
-        {
-          color: t.value.style.chart.selector.color,
-          lineDash: t.value.style.chart.selector.dashed ? [8, 8] : [0, 0],
-          lineWidth: 2
-        }
-      );
-    }
-    function Ot() {
-      O.value && F(
-        f.value,
-        [
-          { x: l.value.left, y: O.value },
-          { x: l.value.right, y: O.value }
-        ],
-        {
-          color: t.value.style.chart.selector.color,
-          lineDash: t.value.style.chart.selector.dashed ? [8, 8] : [0, 0],
-          lineWidth: 2
-        }
-      );
-    }
-    function Nt() {
-      Y.value.forEach((e, o) => {
-        for (let u = 0; u < e.coordinatesLine.length; u += 1)
-          at(
-            f.value,
-            [
-              {
-                x: l.value.left + l.value.slot * u + l.value.slot / 10 + (a.value.stacked ? 0 : l.value.slot / Y.value.length * o - (o === 0 ? 0 : l.value.slot / (5 * Y.value.length) * o)),
-                y: a.value.stacked ? e.localZero : y.value.zero
-              },
-              {
-                x: l.value.left + l.value.slot * u + l.value.slot / 10 + (a.value.stacked ? 0 : l.value.slot / Y.value.length * o - (o === 0 ? 0 : l.value.slot / (5 * Y.value.length) * o)) + l.value.slot * 0.8 / (a.value.stacked ? 1 : Y.value.length),
-                y: a.value.stacked ? e.localZero : y.value.zero
-              },
-              {
-                x: l.value.left + l.value.slot * u + l.value.slot / 10 + (a.value.stacked ? 0 : l.value.slot / Y.value.length * o - (o === 0 ? 0 : l.value.slot / (5 * Y.value.length) * o)) + l.value.slot * 0.8 / (a.value.stacked ? 1 : Y.value.length),
-                y: e.coordinatesLine[u].y
-              },
-              {
-                x: l.value.left + l.value.slot * u + l.value.slot / 10 + (a.value.stacked ? 0 : l.value.slot / Y.value.length * o - (o === 0 ? 0 : l.value.slot / (5 * Y.value.length) * o)),
-                y: e.coordinatesLine[u].y
-              }
-            ],
-            {
-              strokeColor: t.value.style.chart.backgroundColor,
-              gradient: {
-                type: "linear",
-                start: {
-                  x: e.coordinatesLine[u].x,
-                  y: e.coordinatesLine[u].y
-                },
-                end: {
-                  x: e.coordinatesLine[u].x,
-                  y: a.value.stacked ? e.localZero : y.value.zero
-                },
-                stops: [
-                  { offset: 0, color: e.color },
-                  { offset: 1, color: t.value.style.chart.bar.gradient.show ? St(e.color, 0.5) : e.color }
-                ]
-              }
-            }
-          ), a.value.showDataLabels && [!0, void 0].includes(e.dataLabels) && ne(
-            f.value,
-            Le(
-              t.value.style.chart.dataLabels.formatter,
-              e.coordinatesLine[u].value,
-              be({
-                p: e.prefix || "",
-                v: e.coordinatesLine[u].value,
-                s: e.suffix || "",
-                r: e.rounding || 0
-              }),
-              { datapoint: e.coordinatesLine[u], seriesIndex: u }
-            ),
-            l.value.left + l.value.slot * u + l.value.slot / 10 + (a.value.stacked ? 0 : l.value.slot / Y.value.length * o - (o === 0 ? 0 : l.value.slot / (5 * Y.value.length) * o)) + l.value.slot * 0.4 / (a.value.stacked ? 1 : Y.value.length),
-            (e.coordinatesLine[u].value < 0 ? a.value.stacked ? e.localZero : y.value.zero : e.coordinatesLine[u].y) + t.value.style.chart.dataLabels.offsetY,
-            {
-              align: "center",
-              font: `${Math.round(p.value / 40 * t.value.style.chart.dataLabels.fontSizeRatio)}px ${t.value.style.fontFamily}`,
-              color: t.value.style.chart.dataLabels.useSerieColor ? e.color : t.value.style.chart.dataLabels.color,
-              strokeColor: t.value.style.chart.backgroundColor,
-              lineWidth: 0.8
-            }
-          );
-      });
-    }
-    function Bt(e) {
-      e.useArea ? a.value.stacked ? wt(
-        f.value,
-        [{ x: e.coordinatesLine[0].x, y: e.localZero }, ...e.coordinatesLine, { x: e.coordinatesLine.at(-1).x, y: e.localZero }],
-        {
-          fillColor: Re(e.color, t.value.style.chart.area.opacity),
-          strokeColor: "transparent"
-        }
-      ) : wt(
-        f.value,
-        [{ x: e.coordinatesLine[0].x, y: y.value.zero }, ...e.coordinatesLine, { x: e.coordinatesLine.at(-1).x, y: y.value.zero }],
-        {
-          fillColor: Re(e.color, t.value.style.chart.area.opacity),
-          strokeColor: "transparent"
-        }
-      ) : F(f.value, e.coordinatesLine, {
-        color: e.color,
-        lineWidth: 3
-      });
-    }
-    function Yt() {
-      g.value.forEach((e, o) => {
-        F(
-          f.value,
-          [
-            { x: l.value.left, y: l.value.bottom - e.yOffset },
-            { x: l.value.right, y: l.value.bottom - e.yOffset }
-          ],
-          {
-            color: t.value.style.chart.grid.x.horizontalLines.color,
-            lineWidth: 1
-          }
-        );
-      });
-    }
-    function Ae() {
-      At(), te.value ? (d.value !== null && t.value.style.chart.selector.show && ut(), Nt(), a.value.stacked && t.value.style.chart.grid.x.showAxis && Yt(), Tt.value.forEach((e) => {
-        (e.type === "line" || !e.type) && Bt(e), le.value && (Et(e), a.value.showDataLabels && [!0, void 0].includes(e.dataLabels) && Rt(e));
-      }), we.value = dl(V.value)) : (we.value && (f.value.clearRect(0, 0, 1e4, 1e4), f.value.drawImage(we.value, 0, 0)), d.value !== null && t.value.style.chart.selector.show && ut(), d.value !== null && g.value.forEach((e) => {
-        if (e.type === "line" || !e.type || e.type === "plot") {
-          if (!e.coordinatesLine[d.value]) return;
-          e.coordinatesLine[d.value].x !== void 0 && e.coordinatesLine[d.value].y !== void 0 && Lt(
-            f.value,
-            {
-              x: e.coordinatesLine[d.value].x,
-              y: e.coordinatesLine[d.value].y
-            },
-            p.value / 150 * t.value.style.chart.line.plots.radiusRatio,
-            {
-              color: t.value.style.chart.backgroundColor,
-              fillStyle: e.color
-            }
-          );
-        }
-      })), t.value.style.chart.grid.y.timeLabels.show && Dt(), t.value.style.chart.selector.show && t.value.style.chart.selector.showHorizontalSelector && Ot(), Ft(), Pt(), te.value = !1;
-    }
-    const We = il(() => {
-      le.value = !0, It();
-    }, h.value > 200 ? 10 : 1, !le.value);
-    function Ee(e) {
-      if ([null, void 0].includes(d.value) || !e.coordinatesLine[d.value]) return !1;
-      const { y: o, value: u } = e.coordinatesLine[d.value];
-      return { y: o, value: u };
-    }
-    function Xt(e) {
-      const { left: o, top: u } = V.value.getBoundingClientRect(), m = e.clientX - o;
-      if (O.value = (e.clientY - u) * 2, (O.value < l.value.top || O.value > l.value.bottom) && (O.value = null), m * 2 < l.value.left || m * 2 > l.value.right) {
-        ee.value = !1, d.value = null;
-        return;
-      }
-      const x = m * 2 - l.value.left;
-      if (d.value = Math.floor(x / l.value.slot), ee.value = !0, !le.value) return;
-      let X = "";
-      const b = t.value.style.chart.tooltip.customFormat;
-      kt(b) && sl(() => b({
-        seriesIndex: d.value,
-        datapoint: g.value.map((C) => ({
-          shape: C.shape || null,
-          name: C.name,
-          color: C.color,
-          type: C.type || "line",
-          value: C.series.find((he, G) => G === d.value)
-        })),
-        series: g.value,
-        config: t.value
-      })) ? j.value = b({
-        seriesIndex: d.value,
-        datapoint: g.value.map((C) => ({
-          shape: C.shape || null,
-          name: C.name,
-          color: C.color,
-          type: C.type || "line",
-          value: C.series.find((he, G) => G === d.value)
-        })),
-        series: g.value,
-        config: t.value
-      }) : (t.value.style.chart.grid.y.timeLabels.values.slice(i.value.start, i.value.end)[d.value] && (X += `<div style="padding-bottom: 6px; margin-bottom: 4px; border-bottom: 1px solid ${t.value.style.chart.tooltip.borderColor}; width:100%">${t.value.style.chart.grid.y.timeLabels.values.slice(i.value.start, i.value.end)[d.value]}</div>`), X += E.value.join(""), j.value = X), le.value = !1;
-    }
-    _(() => d.value, (e) => {
-      We();
-    }), _(() => i.value, (e) => {
-      te.value = !0, Ae();
-    }, {
-      deep: !0
-    }), _(() => a.value.showDataLabels, (e) => {
-      te.value = !0, Ae();
-    }), _(() => O.value, (e) => {
-      e && Ae();
-    }), _(() => a.value.stacked, (e) => {
-      te.value = !0, le.value = !0, We();
-    });
-    function Ht() {
-      ee.value = !1, d.value = null, j.value = "", O.value = null, Ae();
-    }
-    const Ve = c(null), Ge = c(null);
-    ot(() => {
-      et();
-    });
-    function et() {
-      if (ol(k.dataset) ? nl({
-        componentName: "VueUiXyCanvas",
-        type: "dataset"
-      }) : V.value && (f.value = V.value.getContext("2d", { willReadFrequently: !0 })), t.value.responsive) {
-        const e = vl(() => {
-          const { width: o, height: u } = cl({
-            chart: re.value,
-            title: t.value.style.chart.title.text ? Se.value : null,
-            legend: t.value.style.chart.legend.show ? ze.value : null,
-            slicer: t.value.style.chart.zoom.show && h.value > 1 ? Me.value : null,
-            source: Q.value
-          });
-          requestAnimationFrame(() => {
-            He.value = `${o} / ${u}`;
-          });
-        });
-        Ve.value = new ResizeObserver(e), Ve.value.observe(re.value.parentNode);
-      }
-      Ge.value = new ResizeObserver((e) => {
-        for (const o of e)
-          o.contentBoxSize && H.value && (te.value = !0, We());
-      }), Ge.value.observe(H.value), rt();
-    }
-    $t(() => {
-      Ge.value && Ge.value.disconnect(), Ve.value && Ve.value.disconnect();
-    });
-    function st(e) {
-      Ne("selectLegend", g.value.find((o) => o.absoluteIndex === e)), T.value.includes(e) ? T.value = T.value.filter((o) => o !== e) : T.value.push(e), te.value = !0, We();
-    }
-    const it = R(() => S.value.map((e, o) => ({
-      ...e,
-      name: e.name,
-      color: xt(e.color) || v.value[o] || pe[o] || pe[o % pe.length],
-      shape: e.shape || "circle",
-      prefix: e.prefix || "",
-      suffix: e.suffix || "",
-      rounding: e.rounding || 0
-    })).map((e) => ({
-      ...e,
-      opacity: T.value.includes(e.absoluteIndex) ? 0.5 : 1,
-      segregate: () => st(e.absoluteIndex),
-      isSegregated: T.value.includes(e.absoluteIndex)
-    }))), Ut = R(() => ({
-      cy: "donut-div-legend",
-      backgroundColor: t.value.style.chart.legend.backgroundColor,
-      color: t.value.style.chart.legend.color,
-      fontSize: t.value.style.chart.legend.fontSize,
-      paddingBottom: 12,
-      fontWeight: t.value.style.chart.legend.bold ? "bold" : ""
-    })), Ze = R(() => {
-      const e = [""].concat(g.value.map((x) => x.name)).concat(' <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M18 16v2a1 1 0 0 1 -1 1h-11l6 -7l-6 -7h11a1 1 0 0 1 1 1v2" /></svg>');
-      let o = [];
-      for (let x = 0; x < h.value; x += 1) {
-        const X = g.value.map((b) => b.series[x] ?? 0).reduce((b, C) => b + C, 0);
-        o.push([t.value.style.chart.grid.y.timeLabels.values.slice(i.value.start, i.value.end)[x] ?? x + 1].concat(g.value.map((b) => (b.series[x] ?? 0).toFixed(t.value.table.rounding))).concat((X ?? 0).toFixed(t.value.table.rounding)));
-      }
-      const u = {
-        th: {
-          backgroundColor: t.value.table.th.backgroundColor,
-          color: t.value.table.th.color,
-          outline: t.value.table.th.outline
-        },
-        td: {
-          backgroundColor: t.value.table.td.backgroundColor,
-          color: t.value.table.td.color,
-          outline: t.value.table.td.outline
-        },
-        breakpoint: t.value.table.responsiveBreakpoint
-      }, m = [t.value.table.columnNames.period].concat(g.value.map((x) => x.name)).concat(t.value.table.columnNames.total);
-      return { head: e, body: o.slice(0, i.value.end - i.value.start), config: u, colNames: m };
-    }), vt = R(() => {
-      if (g.value.length === 0) return { head: [], body: [], config: {}, columnNames: [] };
-      const e = g.value.map((u) => ({
-        label: u.name,
-        color: u.color,
-        type: u.type
-      })), o = [];
-      for (let u = i.value.start; u < i.value.end; u += 1) {
-        const m = [t.value.style.chart.grid.y.timeLabels.values[u] || u + 1];
-        g.value.forEach((x) => {
-          m.push(Number((x.series[u] || 0).toFixed(t.value.table.rounding)));
-        }), o.push(m);
-      }
-      return { head: e, body: o };
-    });
-    function ct() {
-      const e = [[t.value.style.chart.title.text], [t.value.style.chart.title.subtitle.text], [""]], o = ["", ...vt.value.head.map((X) => X.label)], u = vt.value.body, m = e.concat([o]).concat(u), x = rl(m);
-      ul({ csvContent: x, title: t.value.style.chart.title.text || "vue-ui-xy-canvas" });
-    }
-    function Wt() {
-      return g.value;
-    }
-    function dt() {
-      a.value.showTable = !a.value.showTable;
-    }
-    function ht() {
-      a.value.showDataLabels = !a.value.showDataLabels;
-    }
-    function ft() {
-      a.value.stacked = !a.value.stacked;
-    }
-    function yt() {
-      a.value.showTooltip = !a.value.showTooltip;
-    }
-    const qe = c(!1);
-    function tt() {
-      qe.value = !qe.value;
-    }
-    return _e({
-      getData: Wt,
-      generateCsv: ct,
-      generatePdf: s,
-      generateImage: n,
-      toggleTable: dt,
-      toggleLabels: ht,
-      toggleStack: ft,
-      toggleTooltip: yt,
-      toggleAnnotator: tt
-    }), (e, o) => (w(), M("div", {
-      style: N(`width:100%; position:relative; ${t.value.responsive ? "height: 100%" : ""}`),
-      ref_key: "xy",
-      ref: re,
-      id: `xy_canvas_${q.value}`,
-      class: ve(`vue-ui-donut ${ce.value ? "vue-data-ui-wrapper-fullscreen" : ""}`),
-      onMouseenter: o[5] || (o[5] = () => D(Ye)(!0)),
-      onMouseleave: o[6] || (o[6] = () => D(Ye)(!1))
-    }, [
-      t.value.style.chart.title.text ? (w(), M("div", {
-        key: 0,
-        ref_key: "chartTitle",
-        ref: Se,
-        style: N(`width:100%;background:${t.value.style.chart.backgroundColor};`)
-      }, [
-        (w(), ie(yl, {
-          key: `title_${de.value}`,
-          config: {
-            title: {
-              cy: "xy-canvas-title",
-              ...t.value.style.chart.title
-            },
-            subtitle: {
-              cy: "xy-canvas-subtitle",
-              ...t.value.style.chart.title.subtitle
-            }
-          }
-        }, null, 8, ["config"]))
-      ], 4)) : Z("", !0),
-      t.value.userOptions.show && U.value && (D(xe) || D(Te)) ? (w(), ie(ml, {
-        ref: "details",
-        key: `user_option_${$e.value}`,
-        backgroundColor: t.value.style.chart.backgroundColor,
-        color: t.value.style.chart.color,
-        isPrinting: D(Ue),
-        isImaging: D(Ie),
-        uid: q.value,
-        hasTooltip: t.value.userOptions.buttons.tooltip && t.value.style.chart.tooltip.show,
-        hasPdf: t.value.userOptions.buttons.pdf,
-        hasImg: t.value.userOptions.buttons.img,
-        hasXls: t.value.userOptions.buttons.csv,
-        hasLabel: t.value.userOptions.buttons.labels,
-        hasStack: $.dataset.length > 1 && t.value.userOptions.buttons.stack,
-        hasFullscreen: t.value.userOptions.buttons.fullscreen,
-        hasTable: i.value.end - i.value.start < 200 && t.value.userOptions.buttons.table,
-        isFullscreen: ce.value,
-        isTooltip: a.value.showTooltip,
-        isStacked: a.value.stacked,
-        titles: { ...t.value.userOptions.buttonTitles },
-        chartElement: re.value,
-        position: t.value.userOptions.position,
-        hasAnnotator: t.value.userOptions.buttons.annotator,
-        isAnnotation: qe.value,
-        onToggleFullscreen: r,
-        onGeneratePdf: D(s),
-        onGenerateCsv: ct,
-        onGenerateImage: D(n),
-        onToggleTable: dt,
-        onToggleLabels: ht,
-        onToggleStack: ft,
-        onToggleTooltip: yt,
-        onToggleAnnotator: tt,
-        style: N({
-          visibility: D(xe) ? D(Te) ? "visible" : "hidden" : "visible"
-        })
-      }, Zt({ _: 2 }, [
-        e.$slots.menuIcon ? {
-          name: "menuIcon",
-          fn: A(({ isOpen: u, color: m }) => [
-            P(e.$slots, "menuIcon", ye(ge({ isOpen: u, color: m })), void 0, !0)
-          ]),
-          key: "0"
-        } : void 0,
-        e.$slots.optionTooltip ? {
-          name: "optionTooltip",
-          fn: A(() => [
-            P(e.$slots, "optionTooltip", {}, void 0, !0)
-          ]),
-          key: "1"
-        } : void 0,
-        e.$slots.optionPdf ? {
-          name: "optionPdf",
-          fn: A(() => [
-            P(e.$slots, "optionPdf", {}, void 0, !0)
-          ]),
-          key: "2"
-        } : void 0,
-        e.$slots.optionCsv ? {
-          name: "optionCsv",
-          fn: A(() => [
-            P(e.$slots, "optionCsv", {}, void 0, !0)
-          ]),
-          key: "3"
-        } : void 0,
-        e.$slots.optionImg ? {
-          name: "optionImg",
-          fn: A(() => [
-            P(e.$slots, "optionImg", {}, void 0, !0)
-          ]),
-          key: "4"
-        } : void 0,
-        e.$slots.optionTable ? {
-          name: "optionTable",
-          fn: A(() => [
-            P(e.$slots, "optionTable", {}, void 0, !0)
-          ]),
-          key: "5"
-        } : void 0,
-        e.$slots.optionLabels ? {
-          name: "optionLabels",
-          fn: A(() => [
-            P(e.$slots, "optionLabels", {}, void 0, !0)
-          ]),
-          key: "6"
-        } : void 0,
-        e.$slots.optionStack ? {
-          name: "optionStack",
-          fn: A(() => [
-            P(e.$slots, "optionStack", {}, void 0, !0)
-          ]),
-          key: "7"
-        } : void 0,
-        e.$slots.optionFullscreen ? {
-          name: "optionFullscreen",
-          fn: A(({ toggleFullscreen: u, isFullscreen: m }) => [
-            P(e.$slots, "optionFullscreen", ye(ge({ toggleFullscreen: u, isFullscreen: m })), void 0, !0)
-          ]),
-          key: "8"
-        } : void 0,
-        e.$slots.optionAnnotator ? {
-          name: "optionAnnotator",
-          fn: A(({ toggleAnnotator: u, isAnnotator: m }) => [
-            P(e.$slots, "optionAnnotator", ye(ge({ toggleAnnotator: u, isAnnotator: m })), void 0, !0)
-          ]),
-          key: "9"
-        } : void 0
-      ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasTooltip", "hasPdf", "hasImg", "hasXls", "hasLabel", "hasStack", "hasFullscreen", "hasTable", "isFullscreen", "isTooltip", "isStacked", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "onGeneratePdf", "onGenerateImage", "style"])) : Z("", !0),
-      W("div", {
-        class: "vue-ui-xy-canvas",
-        style: N(`position: relative; aspect-ratio: ${He.value}`),
-        ref_key: "container",
-        ref: H
-      }, [
-        U.value ? (w(), M("canvas", {
-          key: 0,
-          ref_key: "canvas",
-          ref: V,
-          style: { width: "100%", height: "100%" },
-          onMousemove: o[0] || (o[0] = (u) => Xt(u)),
-          onMouseleave: Ht
-        }, null, 544)) : (w(), ie(kl, {
-          key: 1,
-          config: {
-            type: "line",
-            style: {
-              backgroundColor: t.value.style.chart.backgroundColor,
-              line: {
-                axis: {
-                  color: "#CCCCCC"
-                },
-                path: {
-                  color: "#CCCCCC",
-                  strokeWidth: 0.5
-                }
-              }
-            }
-          }
-        }, null, 8, ["config"])),
-        me(hl, {
-          show: a.value.showTooltip && ee.value,
-          backgroundColor: t.value.style.chart.tooltip.backgroundColor,
-          color: t.value.style.chart.tooltip.color,
-          fontSize: t.value.style.chart.tooltip.fontSize,
-          borderRadius: t.value.style.chart.tooltip.borderRadius,
-          borderColor: t.value.style.chart.tooltip.borderColor,
-          borderWidth: t.value.style.chart.tooltip.borderWidth,
-          position: t.value.style.chart.tooltip.position,
-          offsetY: t.value.style.chart.tooltip.offsetY,
-          parent: D(V),
-          content: j.value,
-          isFullscreen: ce.value,
-          backgroundOpacity: t.value.style.chart.tooltip.backgroundOpacity,
-          isCustom: D(kt)(t.value.style.chart.tooltip.customFormat)
-        }, {
-          "tooltip-before": A(() => [
-            P(e.$slots, "tooltip-before", ye(ge({ ...K.value })), void 0, !0)
-          ]),
-          "tooltip-after": A(() => [
-            P(e.$slots, "tooltip-after", ye(ge({ ...K.value })), void 0, !0)
-          ]),
-          _: 3
-        }, 8, ["show", "backgroundColor", "color", "fontSize", "borderRadius", "borderColor", "borderWidth", "position", "offsetY", "parent", "content", "isFullscreen", "backgroundOpacity", "isCustom"])
-      ], 4),
-      W("div", {
-        ref_key: "chartSlicer",
-        ref: Me,
-        style: N(`width:100%;background:${t.value.style.chart.backgroundColor}`),
-        "data-dom-to-png-ignore": ""
-      }, [
-        t.value.style.chart.zoom.show && h.value > 1 ? (w(), ie(gl, {
-          ref_key: "slicerComponent",
-          ref: ke,
-          key: `slicer_${Ce.value}`,
-          background: t.value.style.chart.zoom.color,
-          borderColor: t.value.style.chart.backgroundColor,
-          fontSize: t.value.style.chart.zoom.fontSize,
-          useResetSlot: t.value.style.chart.zoom.useResetSlot,
-          labelLeft: t.value.style.chart.grid.y.timeLabels.values[i.value.start] ? t.value.style.chart.grid.y.timeLabels.values[i.value.start] : "",
-          labelRight: t.value.style.chart.grid.y.timeLabels.values[i.value.end - 1] ? t.value.style.chart.grid.y.timeLabels.values[i.value.end - 1] : "",
-          textColor: t.value.style.chart.color,
-          inputColor: t.value.style.chart.zoom.color,
-          selectColor: t.value.style.chart.zoom.highlightColor,
-          max: h.value,
-          min: 0,
-          valueStart: i.value.start,
-          valueEnd: i.value.end,
-          start: i.value.start,
-          "onUpdate:start": o[1] || (o[1] = (u) => i.value.start = u),
-          end: i.value.end,
-          "onUpdate:end": o[2] || (o[2] = (u) => i.value.end = u),
-          refreshStartPoint: t.value.style.chart.zoom.startIndex !== null ? t.value.style.chart.zoom.startIndex : 0,
-          refreshEndPoint: t.value.style.chart.zoom.endIndex !== null ? t.value.style.chart.zoom.endIndex + 1 : h.value,
-          enableRangeHandles: t.value.style.chart.zoom.enableRangeHandles,
-          enableSelectionDrag: t.value.style.chart.zoom.enableSelectionDrag,
-          onReset: nt
-        }, {
-          "reset-action": A(({ reset: u }) => [
-            P(e.$slots, "reset-action", ye(ge({ reset: u })), void 0, !0)
-          ]),
-          _: 3
-        }, 8, ["background", "borderColor", "fontSize", "useResetSlot", "labelLeft", "labelRight", "textColor", "inputColor", "selectColor", "max", "valueStart", "valueEnd", "start", "end", "refreshStartPoint", "refreshEndPoint", "enableRangeHandles", "enableSelectionDrag"])) : Z("", !0)
-      ], 4),
-      W("div", {
-        ref_key: "chartLegend",
-        ref: ze
-      }, [
-        t.value.style.chart.legend.show && U.value ? (w(), ie(fl, {
-          legendSet: it.value,
-          config: Ut.value,
-          key: `legend_${ae.value}`,
-          onClickMarker: o[3] || (o[3] = ({ i: u }) => st(u))
-        }, {
-          item: A(({ legend: u, index: m }) => [
-            W("div", {
-              onClick: (x) => u.segregate(),
-              style: N(`opacity:${T.value.includes(m) ? 0.5 : 1}`)
-            }, Qe(u.name), 13, Dl)
-          ]),
-          _: 1
-        }, 8, ["legendSet", "config"])) : P(e.$slots, "legend", {
-          key: 1,
-          legend: it.value
-        }, void 0, !0)
-      ], 512),
-      e.$slots.watermark ? (w(), M("div", Ol, [
-        P(e.$slots, "watermark", ye(ge({ isPrinting: D(Ue) || D(Ie) })), void 0, !0)
-      ])) : Z("", !0),
-      e.$slots.source ? (w(), M("div", {
-        key: 3,
-        ref_key: "source",
-        ref: Q,
-        dir: "auto"
-      }, [
-        P(e.$slots, "source", {}, void 0, !0)
-      ], 512)) : Z("", !0),
-      i.value.end - i.value.start < 200 ? (w(), ie(bl, {
-        key: 4,
-        hideDetails: "",
-        config: {
-          open: a.value.showTable,
-          maxHeight: 1e4,
-          body: {
-            backgroundColor: t.value.style.chart.backgroundColor,
-            color: t.value.style.chart.color
-          },
-          head: {
-            backgroundColor: t.value.style.chart.backgroundColor,
-            color: t.value.style.chart.color
-          }
-        }
-      }, {
-        content: A(() => [
-          (w(), ie(xl, {
-            key: `table_${ue.value}`,
-            colNames: Ze.value.colNames,
-            head: Ze.value.head,
-            body: Ze.value.body,
-            config: Ze.value.config,
-            title: `${t.value.style.chart.title.text}${t.value.style.chart.title.subtitle.text ? ` : ${t.value.style.chart.title.subtitle.text}` : ""}`,
-            onClose: o[4] || (o[4] = (u) => a.value.showTable = !1)
-          }, {
-            th: A(({ th: u }) => [
-              W("div", { innerHTML: u }, null, 8, Nl)
-            ]),
-            td: A(({ td: u }) => [
-              qt(Qe(u), 1)
-            ]),
-            _: 1
-          }, 8, ["colNames", "head", "body", "config", "title"]))
-        ]),
-        _: 1
-      }, 8, ["config"])) : Z("", !0),
-      t.value.userOptions.buttons.annotator && g.value.length ? (w(), ie(Fl, {
-        key: 5,
-        parent: re.value,
-        backgroundColor: t.value.style.chart.backgroundColor,
-        color: t.value.style.chart.color,
-        active: qe.value,
-        onClose: tt
-      }, null, 8, ["parent", "backgroundColor", "color", "active"])) : Z("", !0)
-    ], 46, Rl));
-  }
-}, aa = /* @__PURE__ */ zt(Bl, [["__scopeId", "data-v-b8851cb8"]]);
-export {
-  aa as default
-};