vue-data-ui 2.7.2 → 2.7.3

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

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