vue-data-ui 2.6.40 → 2.6.42

package/dist/{vue-ui-xy-canvas-DVzzeUmj.js → vue-ui-xy-canvas-DRbFpLFp.js}

@@ -1,20 +1,20 @@
-import { ref as i, computed as T, onMounted as _e, 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 _t, withCtx as z, renderSlot as M, normalizeProps as ve, guardReactiveProps as de, toDisplayString as ht, createTextVNode as Gt } 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, ab as al, o as ol, e as rl, x as yt, q as nl, r as sl, y as ul, s as Me } from "./index-BaaDnc4F.js";
+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, ac 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-DWsIpwzs.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-vZgZwV-S.js";
-import { _ as hl } from "./Tooltip-HRgkF8HD.js";
-import { L as fl } from "./Legend-Be8mrJpb.js";
-import { _ as yl } from "./Title-D_MGglyN.js";
-import { S as gl } from "./Slicer-CUm2ijlc.js";
-import { u as pl, U as ml } from "./usePrinter-y4-4tCWT.js";
-import bl from "./vue-ui-accordion-CF9kQTXq.js";
-import { D as xl } from "./DataTable-DvwmNjb-.js";
-import kl from "./vue-ui-skeleton-6RiQNJSb.js";
-import { u as mt } from "./useNestedProp-D8vQcOps.js";
-import { _ as kt } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+import { _ as hl } from "./Tooltip-CbWEnMUw.js";
+import { L as fl } from "./Legend-BB51QBPV.js";
+import { _ as yl } from "./Title-y0r2c8bY.js";
+import { S as gl } from "./Slicer-Dhto2Wym.js";
+import { u as pl, U as ml } from "./usePrinter-B8LELMkA.js";
+import bl from "./vue-ui-accordion-WrimcQK1.js";
+import { D as xl } from "./DataTable-B_PZ5EQ5.js";
+import kl from "./vue-ui-skeleton-DDZb9FFJ.js";
+import { u as mt } from "./useNestedProp-Bole8bsm.js";
 import { u as Ll } from "./useUserOptionState-BIvW1Kz7.js";
 import { u as Cl } from "./useChartAccessibility-BWojgys7.js";
-import Ye from "./BaseIcon-rw8rKNKS.js";
-import { C as wl } from "./ColorPicker-DyZK3Mhl.js";
+import Ye from "./BaseIcon-BYl8WVrn.js";
+import { C as wl } from "./ColorPicker-rv2BDrXO.js";
+import { _ as kt } from "./_plugin-vue_export-helper-CHgC5LLL.js";
 const $l = {
   class: /* @__PURE__ */ fe({
     "vue-ui-pen-and-paper-action": !0
@@ -46,11 +46,11 @@ const $l = {
       ae.value = `0 0 ${d} ${c}`;
     }
     const Q = i(null);
-    _e(() => {
+    Ge(() => {
       Ie(() => {
         if (q.parent) {
-          Q.value = new ResizeObserver((n) => {
-            for (const v of n) {
+          Q.value = new ResizeObserver((r) => {
+            for (const v of r) {
               const { width: y, height: k } = v.contentRect;
               B({ width: y, height: k });
             }
@@ -65,84 +65,84 @@ const $l = {
       () => q.parent,
       (d) => {
         if (!d) return;
-        const { width: c, height: n } = q.parent.getBoundingClientRect();
-        B({ width: c, height: n });
+        const { width: c, height: r } = q.parent.getBoundingClientRect();
+        B({ width: c, height: r });
       },
       { immediate: !0 }
     );
-    const h = i(!1), _ = i(""), oe = i(null);
+    const h = i(!1), G = i(""), oe = i(null);
     function E(d) {
       if (!oe.value) return;
       h.value = !0;
-      const { x: c, y: n } = Ce(d);
-      _.value = `M ${c} ${n}`;
+      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: n } = Ce(d);
-      _.value += ` ${c} ${n}`;
+      const { x: c, y: r } = Ce(d);
+      G.value += ` ${c} ${r}`;
     }
-    function G(d) {
+    function _(d) {
       const c = d.trim().split(/\s+/);
       if (c.length < 4)
         return d;
-      const n = c.slice(1).map(Number);
-      if (n.length % 2 !== 0)
+      const r = c.slice(1).map(Number);
+      if (r.length % 2 !== 0)
         return d;
-      const v = re(n), y = [`M ${v[0]} ${v[1]}`];
+      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, ne = (F + R) / 2;
-        y.push(`Q ${t} ${F} ${O} ${ne}`);
+        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 re(d, c = 1) {
-      const n = [...d];
+    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];
-        n[v] = y + c * ((w + t) / 2 - y), n[v + 1] = k + c * ((A + F) / 2 - k);
+        r[v] = y + c * ((w + t) / 2 - y), r[v + 1] = k + c * ((A + F) / 2 - k);
       }
-      return n;
+      return r;
     }
     function Le(d) {
       const c = d.trim().split(/\s+/);
-      let n = "", v = "", y = null, k = null;
+      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]), n += `${v}${y} ${k}`;
+            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 ? n += `t${P - y} ${R - k}` : n += `q${t - y} ${F - k} ${P - y} ${R - k}`, y = P, k = R;
+            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 ? n += `v${R}` : R === 0 ? n += `h${P}` : n += `l${P} ${R}`, y = t, k = F;
+            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]), ne = parseFloat(c[++w]);
-            P === y && R === k ? n += `t${O - y} ${ne - k}` : n += `q${P - y} ${R - k} ${O - y} ${ne - k}`, y = O, k = ne;
+            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 n;
+      return r;
     }
     function ye() {
       h.value && (m.value.push({
         strokeWidth: u.value,
-        path: Le(G(_.value)),
+        path: Le(_(G.value)),
         color: Z.value
-      }), V.value = [], _.value = ""), h.value = !1;
+      }), V.value = [], G.value = ""), h.value = !1;
     }
     function Ce(d) {
       if (!oe.value) return { x: 0, y: 0 };
       const c = oe.value.getBoundingClientRect();
-      let n, v;
-      return d.touches && d.touches.length ? (n = d.touches[0].clientX, v = d.touches[0].clientY) : (n = d.clientX, v = d.clientY), {
-        x: n - c.left,
+      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
       };
     }
@@ -178,7 +178,7 @@ const $l = {
             backgroundColor: $.backgroundColor,
             border: `1px solid ${b.value}`
           }),
-          onClick: c[0] || (c[0] = (n) => Be("close"))
+          onClick: c[0] || (c[0] = (r) => Be("close"))
         }, [
           ke(Ye, {
             name: "close",
@@ -188,7 +188,7 @@ const $l = {
         U("button", $l, [
           ke(wl, {
             value: Z.value,
-            "onUpdate:value": c[1] || (c[1] = (n) => Z.value = n),
+            "onUpdate:value": c[1] || (c[1] = (r) => Z.value = r),
             backgroundColor: $.backgroundColor,
             buttonBorderColor: b.value
           }, null, 8, ["value", "backgroundColor", "buttonBorderColor"])
@@ -251,7 +251,7 @@ const $l = {
           min: 0.5,
           max: 12,
           step: 0.1,
-          "onUpdate:modelValue": c[2] || (c[2] = (n) => u.value = n),
+          "onUpdate:modelValue": c[2] || (c[2] = (r) => u.value = r),
           style: W({
             accentColor: $.color
           })
@@ -276,26 +276,26 @@ const $l = {
         onTouchmove: dt(J, ["prevent"]),
         onTouchend: ye
       }, [
-        (C(!0), X(We, null, Vt(m.value, (n) => (C(), X(We, { key: n }, [
-          n.path.replace("M", "").split(" ").length === 2 ? (C(), X("circle", {
+        (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: n.path.replace("M", "").split(" ")[0],
-            cy: n.path.replace("M", "").split(" ")[1],
-            r: n.strokeWidth / 2,
-            fill: n.color
+            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: n.path,
-            stroke: n.color,
-            "stroke-width": n.strokeWidth,
+            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),
+          d: _(G.value),
           stroke: Z.value,
           "stroke-width": u.value * 1.1,
           fill: "none"
@@ -324,15 +324,15 @@ const $l = {
   },
   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), _ = i(""), oe = i(null), E = i([]), J = i(1), G = i(!0), re = 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), n = i(0), v = i(0), y = i(null), k = T(() => !!m.dataset && m.dataset.length), w = q, A = Zt();
-    _e(() => {
+    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: () => ne(),
+      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 ne() {
+    function re() {
       const e = mt({
         userConfig: m.config,
         defaultConfig: Be
@@ -347,13 +347,14 @@ const $l = {
       } : 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 = ne(), F.value = !t.value.userOptions.showOnChartHover, He(), c.value += 1, n.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;
+      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, n.value += 1, v.value += 1;
+      He(), c.value += 1, r.value += 1, v.value += 1;
     }, { deep: !0 });
-    const Ge = i(t.value.style.chart.aspectRatio), { isPrinting: je, isImaging: qe, generatePdf: Qe, generateImage: Je } = pl({
+    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"
+      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,
@@ -374,7 +375,7 @@ const $l = {
         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 / (r.value.end - r.value.start)
+        slot: e / (n.value.end - n.value.start)
       };
     });
     function et(e, a) {
@@ -394,7 +395,7 @@ const $l = {
       });
     }
     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(r.value.start, r.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(r.value.start, r.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) => ({
+      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
@@ -439,7 +440,7 @@ const $l = {
     });
     const x = T(() => al(pe.value.filter((e, a) => !E.value.includes(e.absoluteIndex))).map((e, a) => ({
       ...e,
-      series: e.series.slice(r.value.start, r.value.end)
+      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));
@@ -478,7 +479,7 @@ const $l = {
         yOffset: L,
         individualHeight: H
       };
-    })), r = i({
+    })), n = i({
       start: 0,
       end: j.value
     });
@@ -487,7 +488,7 @@ const $l = {
     }
     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)))) : (r.value = {
+      (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);
@@ -505,8 +506,8 @@ const $l = {
     }
     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 && r.value.end - r.value.start < t.value.style.chart.grid.y.verticalLines.hideUnderXLength ? x.value.forEach((e) => {
-          for (let a = 0; a < r.value.end - r.value.start + 1; a += 1)
+        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,
               [
@@ -523,17 +524,17 @@ const $l = {
                 color: t.value.style.chart.grid.y.verticalLines.color
               }
             );
-        }) : t.value.style.chart.grid.y.verticalLines.show && r.value.end - r.value.start >= t.value.style.chart.grid.y.verticalLines.hideUnderXLength && x.value.forEach((e) => {
-          for (let a = r.value.start; a < r.value.end; a += 1)
-            a % Math.floor((r.value.end - r.value.start) / t.value.style.chart.grid.y.timeLabels.modulo) === 0 && I(
+        }) : 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 - r.value.start) + l.value.slot / 2,
+                  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 - r.value.start) + l.value.slot / 2,
+                  x: l.value.left + l.value.slot * (a - n.value.start) + l.value.slot / 2,
                   y: l.value.bottom - e.yOffset
                 }
               ],
@@ -558,7 +559,7 @@ const $l = {
             );
           });
         }) : x.value.forEach((e) => {
-          e.localYLabels.slice(r.value.start, r.value.end).forEach((a) => {
+          e.localYLabels.slice(n.value.start, n.value.end).forEach((a) => {
             I(
               u.value,
               [
@@ -617,8 +618,8 @@ const $l = {
           );
         });
       else {
-        if (t.value.style.chart.grid.y.verticalLines.show && r.value.end - r.value.start < t.value.style.chart.grid.y.verticalLines.hideUnderXLength)
-          for (let e = 0; e < r.value.end - r.value.start + 1; e += 1)
+        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,
               [
@@ -629,13 +630,13 @@ const $l = {
                 color: t.value.style.chart.grid.y.verticalLines.color
               }
             );
-        else if (t.value.style.chart.grid.y.verticalLines.show && r.value.end - r.value.start >= t.value.style.chart.grid.y.verticalLines.hideUnderXLength)
-          for (let e = r.value.start; e < r.value.end; e += 1)
-            e % Math.floor((r.value.end - r.value.start) / t.value.style.chart.grid.y.timeLabels.modulo) === 0 && I(
+        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 - r.value.start) + l.value.slot / 2, y: l.value.top },
-                { x: l.value.left + l.value.slot * (e - r.value.start) + l.value.slot / 2, y: l.value.bottom }
+                { 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
@@ -836,16 +837,16 @@ const $l = {
         );
     }
     function Rt() {
-      for (let e = r.value.start; e < r.value.end; e += 1)
-        (r.value.end - r.value.start < t.value.style.chart.grid.y.timeLabels.modulo || r.value.end - r.value.start >= t.value.style.chart.grid.y.timeLabels.modulo && (e % Math.floor((r.value.end - r.value.start) / t.value.style.chart.grid.y.timeLabels.modulo) === 0 || e === h.value + r.value.start && t.value.style.chart.grid.y.timeLabels.showMarker)) && ee(
+      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 - r.value.start) + l.value.slot / 2,
+          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 + r.value.start === e ? 100 : 20 : 100) : t.value.style.chart.grid.y.timeLabels.color,
+            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
           }
         );
@@ -980,8 +981,8 @@ const $l = {
       });
     }
     function we() {
-      Mt(), G.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), re.value && (It(e), s.value.showDataLabels && [!0, void 0].includes(e.dataLabels) && Pt(e));
+      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;
@@ -998,11 +999,11 @@ const $l = {
             }
           );
         }
-      })), t.value.style.chart.grid.y.timeLabels.show && Rt(), t.value.style.chart.selector.show && t.value.style.chart.selector.showHorizontalSelector && Ot(), Ft(), Tt(), G.value = !1;
+      })), 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(() => {
-      re.value = !0, zt();
-    }, j.value > 200 ? 10 : 1, !re.value);
+      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];
@@ -1015,7 +1016,7 @@ const $l = {
         return;
       }
       const p = f * 2 - l.value.left;
-      if (h.value = Math.floor(p / l.value.slot), Q.value = !0, !re.value) return;
+      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({
@@ -1029,7 +1030,7 @@ const $l = {
         })),
         series: x.value,
         config: t.value
-      })) ? _.value = g({
+      })) ? G.value = g({
         seriesIndex: h.value,
         datapoint: x.value.map((L) => ({
           shape: L.shape || null,
@@ -1040,30 +1041,30 @@ const $l = {
         })),
         series: x.value,
         config: t.value
-      }) : (t.value.style.chart.grid.y.timeLabels.values.slice(r.value.start, r.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(r.value.start, r.value.end)[h.value]}</div>`), Y += wt.value.join(""), _.value = Y), re.value = !1;
+      }) : (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(() => r.value, (e) => {
-      G.value = !0, we();
+    }), te(() => n.value, (e) => {
+      _.value = !0, we();
     }, {
       deep: !0
     }), te(() => s.value.showDataLabels, (e) => {
-      G.value = !0, we();
+      _.value = !0, we();
     }), te(() => y.value, (e) => {
       e && we();
     }), te(() => s.value.stacked, (e) => {
-      G.value = !0, re.value = !0, Re();
+      _.value = !0, ne.value = !0, Re();
     });
     function Yt() {
-      Q.value = !1, h.value = null, _.value = "", y.value = null, we();
+      Q.value = !1, h.value = null, G.value = "", y.value = null, we();
     }
     const Oe = i(null), De = i(null);
-    _e(() => {
+    Ge(() => {
       He();
     });
     function He() {
-      if (ol(m.dataset) ? rl({
+      if (ol(m.dataset) ? nl({
         componentName: "VueUiXyCanvas",
         type: "dataset"
       }) : O.value && (u.value = O.value.getContext("2d", { willReadFrequently: !0 })), t.value.responsive) {
@@ -1076,23 +1077,23 @@ const $l = {
             source: d.value
           });
           requestAnimationFrame(() => {
-            Ge.value = `${a} / ${o}`;
+            _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 && (G.value = !0, Re());
+          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), G.value = !0, Re();
+      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 rt = T(() => pe.value.map((e, a) => ({
+    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],
@@ -1117,7 +1118,7 @@ const $l = {
       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(r.value.start, r.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)));
+        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: {
@@ -1132,15 +1133,15 @@ const $l = {
         },
         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, r.value.end - r.value.start), config: o, colNames: f };
-    }), nt = T(() => {
+      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 = r.value.start; o < r.value.end; o += 1) {
+      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)));
@@ -1149,7 +1150,7 @@ const $l = {
       return { head: e, body: a };
     });
     function st() {
-      const e = [[t.value.style.chart.title.text], [t.value.style.chart.title.subtitle.text], [""]], a = ["", ...nt.value.head.map((Y) => Y.label)], o = nt.value.body, f = e.concat([a]).concat(o), p = nl(f);
+      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() {
@@ -1225,7 +1226,7 @@ const $l = {
         hasLabel: t.value.userOptions.buttons.labels,
         hasStack: $.dataset.length > 1 && t.value.userOptions.buttons.stack,
         hasFullscreen: t.value.userOptions.buttons.fullscreen,
-        hasTable: r.value.end - r.value.start < 200 && t.value.userOptions.buttons.table,
+        hasTable: n.value.end - n.value.start < 200 && t.value.userOptions.buttons.table,
         isFullscreen: ge.value,
         isTooltip: s.value.showTooltip,
         isStacked: s.value.stacked,
@@ -1246,7 +1247,7 @@ const $l = {
         style: W({
           visibility: D(R) ? D(F) ? "visible" : "hidden" : "visible"
         })
-      }, _t({ _: 2 }, [
+      }, Gt({ _: 2 }, [
         e.$slots.menuIcon ? {
           name: "menuIcon",
           fn: z(({ isOpen: o, color: f }) => [
@@ -1320,7 +1321,7 @@ const $l = {
       ]), 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: ${Ge.value}`),
+        style: W(`position: relative; aspect-ratio: ${_e.value}`),
         ref_key: "container",
         ref: Z
       }, [
@@ -1360,7 +1361,7 @@ const $l = {
           position: t.value.style.chart.tooltip.position,
           offsetY: t.value.style.chart.tooltip.offsetY,
           parent: D(O),
-          content: _.value,
+          content: G.value,
           isFullscreen: ge.value,
           backgroundOpacity: t.value.style.chart.tooltip.backgroundOpacity,
           isCustom: D(yt)(t.value.style.chart.tooltip.customFormat)
@@ -1388,19 +1389,19 @@ const $l = {
           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[r.value.start] ? t.value.style.chart.grid.y.timeLabels.values[r.value.start] : "",
-          labelRight: t.value.style.chart.grid.y.timeLabels.values[r.value.end - 1] ? t.value.style.chart.grid.y.timeLabels.values[r.value.end - 1] : "",
+          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: r.value.start,
-          valueEnd: r.value.end,
-          start: r.value.start,
-          "onUpdate:start": a[1] || (a[1] = (o) => r.value.start = o),
-          end: r.value.end,
-          "onUpdate:end": a[2] || (a[2] = (o) => r.value.end = o),
+          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,
@@ -1418,7 +1419,7 @@ const $l = {
         ref: Fe
       }, [
         t.value.style.chart.legend.show && k.value ? (C(), ue(fl, {
-          legendSet: rt.value,
+          legendSet: nt.value,
           config: Xt.value,
           key: `legend_${v.value}`,
           onClickMarker: a[3] || (a[3] = ({ i: o }) => ot(o))
@@ -1432,7 +1433,7 @@ const $l = {
           _: 1
         }, 8, ["legendSet", "config"])) : M(e.$slots, "legend", {
           key: 1,
-          legend: rt.value
+          legend: nt.value
         }, void 0, !0)
       ], 512),
       e.$slots.watermark ? (C(), X("div", Dl, [
@@ -1446,7 +1447,7 @@ const $l = {
       }, [
         M(e.$slots, "source", {}, void 0, !0)
       ], 512)) : le("", !0),
-      r.value.end - r.value.start < 200 ? (C(), ue(bl, {
+      n.value.end - n.value.start < 200 ? (C(), ue(bl, {
         key: 4,
         hideDetails: "",
         config: {
@@ -1464,7 +1465,7 @@ const $l = {
       }, {
         content: z(() => [
           (C(), ue(xl, {
-            key: `table_${n.value}`,
+            key: `table_${r.value}`,
             colNames: Ee.value.colNames,
             head: Ee.value.head,
             body: Ee.value.body,
@@ -1476,7 +1477,7 @@ const $l = {
               U("div", { innerHTML: o }, null, 8, El)
             ]),
             td: z(({ td: o }) => [
-              Gt(ht(o), 1)
+              _t(ht(o), 1)
             ]),
             _: 1
           }, 8, ["colNames", "head", "body", "config", "title"]))
@@ -1493,7 +1494,7 @@ const $l = {
       }, null, 8, ["parent", "backgroundColor", "color", "active"])) : le("", !0)
     ], 46, Rl));
   }
-}, ta = /* @__PURE__ */ kt(Al, [["__scopeId", "data-v-73b06dd8"]]);
+}, ta = /* @__PURE__ */ kt(Al, [["__scopeId", "data-v-9fd65fd2"]]);
 export {
   ta as default
 };