vue-data-ui 3.17.9 → 3.17.11

package/dist/{vue-ui-xy-XsqGdS48.js → vue-ui-xy-C11EO1Ja.js}

@@ -1,5 +1,5 @@
-import { defineAsyncComponent as Re, useSlots as Nu, getCurrentInstance as Fu, ref as g, shallowRef as Vu, computed as b, onMounted as It, toRefs as Bu, watch as vt, watchEffect as sl, nextTick as Pt, onBeforeUnmount as Pl, openBlock as i, createElementBlock as r, normalizeStyle as w, normalizeClass as Je, createElementVNode as y, toDisplayString as se, createBlock as _e, createCommentVNode as h, unref as v, withCtx as Y, renderSlot as O, normalizeProps as ve, guardReactiveProps as de, createSlots as lo, createVNode as dt, Fragment as d, renderList as k, mergeProps as Qe, Teleport as Ru, resolveDynamicComponent as Hu, withDirectives as Du, vModelCheckbox as Wu, createTextVNode as ao } from "vue";
-import { j as Ol, q as Nl, t as oo, n as Eu, D as uo, E as so, s as Fl, p as Vl, F as nl, G as W, H as Bl, I as Yu, J as Xu, K as N, L as no, c as io, M as ro, b as co, N as Gu, O as qu, P as Uu, Q as vo, R as ho, k as he, S as Zu, T as fo, U as Ku, z as mo, A as Ie, l as Pe, v as je, u as Ce, V as Ju, a as Qu, W as He, d as il, Y as Se, Z as ju, _ as De, $ as Ot, m as es, o as go, a0 as ts, a1 as ls, a2 as ht, a3 as as } from "./lib-DMzrGQHK.js";
+import { defineAsyncComponent as Re, useSlots as Nu, getCurrentInstance as Fu, ref as g, shallowRef as Vu, computed as b, onMounted as It, toRefs as Bu, watch as ct, watchEffect as sl, nextTick as Pt, onBeforeUnmount as Pl, openBlock as i, createElementBlock as r, normalizeStyle as w, normalizeClass as Je, createElementVNode as y, toDisplayString as se, createBlock as _e, createCommentVNode as h, unref as v, withCtx as Y, renderSlot as O, normalizeProps as ve, guardReactiveProps as de, createSlots as lo, createVNode as vt, Fragment as d, renderList as k, mergeProps as Qe, Teleport as Ru, resolveDynamicComponent as Hu, withDirectives as Du, vModelCheckbox as Wu, createTextVNode as ao } from "vue";
+import { j as Ol, q as Nl, t as oo, n as Eu, D as uo, E as so, s as Fl, p as Vl, F as nl, G as W, H as Bl, I as Yu, J as Xu, K as N, L as no, c as io, M as ro, b as co, N as Gu, O as qu, P as Uu, Q as vo, R as ho, k as he, S as Zu, T as fo, U as Ku, z as mo, A as Ie, l as Pe, v as je, u as Ce, V as Ju, a as Qu, W as He, d as il, Y as Se, Z as ju, _ as De, $ as Ot, m as es, o as go, a0 as ts, a1 as ls, a2 as dt, a3 as as } from "./lib-DMzrGQHK.js";
 import { u as bo, a as po, b as os } from "./useTimeLabels-Cv0tD9In.js";
 import { u as us } from "./useConfig-B70q17MC.js";
 import { u as ss } from "./usePrinter-C4t8DdQ-.js";
@@ -123,21 +123,21 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
     const T = cl, ko = Re(() => import("./DataTable-cMnb68Ik.js")), _o = Re(() => import("./Tooltip-Cvt7Fi0Q.js")), wo = Re(
       () => import("./UserOptions-DVduN6X7.js")
     ), Rl = Re(() => import("./BaseIcon-DX0hTWa-.js")), So = Re(
-      () => import("./vue-ui-table-sparkline-DtryAFeu.js")
+      () => import("./vue-ui-table-sparkline-Cb6fl-Ux.js")
     ), $o = Re(
-      () => import("./PackageVersion-Ov37I8ii.js")
+      () => import("./PackageVersion-CHNfLQ9Q.js")
     ), Lo = Re(
       () => import("./PenAndPaper-CJDoB5H9.js")
     ), Mo = Re(
       () => import("./BaseDraggableDialog-Di8Hlru3.js")
-    ), We = xo, Hl = Nu(), Ao = Fu(), { vue_ui_xy: ft } = us(), { isThemeValid: Co, warnInvalidTheme: To } = cs(), $e = g(null), mt = g(null), Te = g(null), et = g(null), gt = g(null), bt = g(null), zo = g(null), vl = g(null), dl = g(null), Ft = g(null), hl = g(null), fl = g(null), Ne = g(null), ml = g(null), Io = g(0), C = g(null), Dl = g(!0), fe = g(600), ee = g(1e3), Vt = g("0 0 1000 600"), Po = g({ x: 0, y: 0 }), pt = g({ line: "line", bar: "bar", plot: "plot" }), tt = g(!1), Ee = g(!1), Wl = g(!1), Ye = g(null), G = g([]), z = g(Ol()), El = g(0), Yl = g(0), Xl = g(0), yt = g(!0), gl = g(0), P = g(null), Gl = g(!1), bl = g(!0), Bt = g(!0), ae = g(null), Oe = g({}), Rt = g(null), ql = g(!1), lt = g(null), Ht = g(!1), Dt = g(!1), _ = g(null), at = g(null), Ul = g({ x: 0, y: 0 }), Zl = Vu(null), Kl = g(!1), Jl = g(0), Ql = g(0), jl = vs({
+    ), We = xo, Hl = Nu(), Ao = Fu(), { vue_ui_xy: ht } = us(), { isThemeValid: Co, warnInvalidTheme: To } = cs(), $e = g(null), ft = g(null), Te = g(null), mt = g(null), gt = g(null), bt = g(null), zo = g(null), vl = g(null), dl = g(null), Ft = g(null), hl = g(null), fl = g(null), Ne = g(null), ml = g(null), Io = g(0), C = g(null), Dl = g(!0), fe = g(600), ee = g(1e3), Vt = g("0 0 1000 600"), Po = g({ x: 0, y: 0 }), pt = g({ line: "line", bar: "bar", plot: "plot" }), et = g(!1), Ee = g(!1), Wl = g(!1), Ye = g(null), G = g([]), z = g(Ol()), El = g(0), Yl = g(0), Xl = g(0), yt = g(!0), gl = g(0), P = g(null), Gl = g(!1), bl = g(!0), Bt = g(!0), ae = g(null), Oe = g({}), Rt = g(null), ql = g(!1), tt = g(null), Ht = g(!1), Dt = g(!1), _ = g(null), lt = g(null), Ul = g({ x: 0, y: 0 }), Zl = Vu(null), Kl = g(!1), Jl = g(0), Ql = g(0), jl = vs({
       elementRef: Zl,
       minimumWidth: 2,
       minimumHeight: 2,
       stableFramesRequired: 2,
       once: !1,
       onSizeAccepted: () => {
-        ot();
+        at();
       }
     });
     function xt() {
@@ -150,7 +150,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
         });
       });
     }
-    async function ot() {
+    async function at() {
       const l = ++Ql.value;
       Kl.value = !1, await Pt(), await ea(), await ea(), l === Ql.value && (Jl.value += 1, Kl.value = !0);
     }
@@ -179,31 +179,31 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
           index: o,
           debug: kt.value
         });
-      }), xt(), jl.start(), ot();
+      }), xt(), jl.start(), at();
     });
     function yl() {
       if (!Object.keys(T.config || {}).length)
-        return ft;
+        return ht;
       const l = Nt({
         userConfig: T.config,
-        defaultConfig: ft
+        defaultConfig: ht
       });
       T.config && Ot(T.config, "chart.highlightArea") && (Array.isArray(T.config.chart.highlightArea) ? l.chart.highlightArea = T.config.chart.highlightArea : l.chart.highlightArea = [
         T.config.chart.highlightArea
       ]), T.config && Ot(T.config, "chart.annotations") && Array.isArray(T.config.chart.annotations) && T.config.chart.annotations.length ? l.chart.annotations = T.config.chart.annotations.map(
         (a) => Nt({
-          defaultConfig: ft.chart.annotations[0],
+          defaultConfig: ht.chart.annotations[0],
           userConfig: a
         })
       ) : l.chart.annotations = [], T.config && Ot(T.config, "chart.grid.position") && T.config.chart.grid.position === "start" && T.dataset.length && T.dataset.some((a) => a.type === "bar") && (l.chart.grid.position = "middle", Ot(T.config, "debug") && console.warn(
         "Vue Data UI - VueUiXy - config.chart.grid.position was overriden to `middle` because your dataset contains a bar"
       )), T.config && Ot(T.config, "chart.highlightArea") && (Array.isArray(T.config.chart.highlightArea) ? l.chart.highlightArea = T.config.chart.highlightArea.map(
         (a) => aa({
-          defaultConfig: ft.chart.highlightArea,
+          defaultConfig: ht.chart.highlightArea,
           userConfig: a
         })
       ) : l.chart.highlightArea = aa({
-        defaultConfig: ft.chart.highlightArea,
+        defaultConfig: ht.chart.highlightArea,
         userConfig: T.config.chart.highlightArea
       }));
       const o = l.theme;
@@ -359,7 +359,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
     function ua(l, o) {
       Me.value[l] = o;
     }
-    function ut() {
+    function ot() {
       const l = Math.max(
         1,
         ...pe.value.map((s) => Fe(s.series).length)
@@ -387,7 +387,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
         }
       };
     });
-    vt(
+    ct(
       () => T.selectedXIndex,
       (l) => {
         if ([null, void 0].includes(T.selectedXIndex)) {
@@ -403,17 +403,17 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
       elementId: `vue-ui-xy_${z.value}`,
       fileName: t.value.chart.title.text || "vue-ui-xy",
       options: t.value.chart.userOptions.print
-    }), Ho = g(!1), Yt = b(() => Eu(t.value.customPalette)), st = b(() => {
+    }), Ho = g(!1), Yt = b(() => Eu(t.value.customPalette)), ut = b(() => {
       const l = t.value.chart.grid.labels.yAxis.scaleMin;
       if (l == null) return null;
       const o = Number(l);
       return Number.isFinite(o) ? o : null;
-    }), Do = b(() => st.value !== null ? c.value.bottom : me.value), _t = b(() => {
+    }), Do = b(() => ut.value !== null ? c.value.bottom : me.value), _t = b(() => {
       const l = t.value.chart.grid.labels.yAxis.scaleMax;
       if (l == null) return null;
       const o = Number(l);
       return Number.isFinite(o) ? o : null;
-    }), ia = b(() => st.value !== null || _t.value !== null), ra = b(() => {
+    }), ia = b(() => ut.value !== null || _t.value !== null), ra = b(() => {
       const l = Ve.value.filter((o) => !G.value.includes(o.id)).flatMap((o) => Array.isArray(o.series) ? o.series : []).filter(Number.isFinite);
       return l.length ? {
         min: Math.min(...l),
@@ -430,7 +430,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
         const u = l;
         return u > 0 ? 0 : u;
       }
-      const e = st.value !== null ? st.value : l > 0 ? 0 : l, s = _t.value !== null ? _t.value : o, a = l < e ? l : e, n = o > s ? o : s;
+      const e = ut.value !== null ? ut.value : l > 0 ? 0 : l, s = _t.value !== null ? _t.value : o, a = l < e ? l : e, n = o > s ? o : s;
       return ca(a, n).min;
     }), Gt = b(() => {
       const { min: l, max: o } = ra.value;
@@ -438,7 +438,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
         const u = o;
         return Xt.value === u ? u + 1 : u;
       }
-      const e = st.value !== null ? st.value : l > 0 ? 0 : l, s = _t.value !== null ? _t.value : o, a = l < e ? l : e, n = o > s ? o : s;
+      const e = ut.value !== null ? ut.value : l > 0 ? 0 : l, s = _t.value !== null ? _t.value : o, a = l < e ? l : e, n = o > s ? o : s;
       return ca(a, n).max;
     }), Ae = b(() => t.value.chart.grid.labels.yAxis.useNiceScale ? uo(
       Xt.value,
@@ -487,18 +487,18 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
       const o = dl.value ? dl.value.getBoundingClientRect().width + t.value.chart.grid.labels.axis.yLabelOffsetX + x.value.yAxis : 0, e = t.value.chart.grid.labels.yAxis.crosshairSize;
       return l + o + e;
     }
-    const St = g(0), nt = g(0);
+    const St = g(0), st = g(0);
     function va() {
       const l = Ft.value;
       if (!l) {
-        St.value = 0, nt.value = 0;
+        St.value = 0, st.value = 0;
         return;
       }
       try {
         const o = l.getBBox();
-        St.value = o?.height ?? 0, nt.value = o?.x ?? 0;
+        St.value = o?.height ?? 0, st.value = o?.x ?? 0;
       } catch {
-        St.value = 0, nt.value = 0;
+        St.value = 0, st.value = 0;
       }
     }
     const da = b(() => {
@@ -516,7 +516,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
       const o = 36;
       t.value.chart.grid.labels.show && (f.value.useIndividualScale && !f.value.isStacked ? l = (pe.value.length - G.value.length) * (t.value.chart.grid.labels.yAxis.labelWidth + o) : f.value.useIndividualScale && f.value.isStacked ? l = t.value.chart.grid.labels.yAxis.labelWidth + o : l = Eo());
       const e = t.value.chart.labels.fontSize * 1.1, s = Yo.value ? 24 : 6;
-      Ft.value && nt.value < 0 && (l += Math.abs(nt.value));
+      Ft.value && st.value < 0 && (l += Math.abs(st.value));
       const a = ee.value - l - t.value.chart.grid.labels.yAxis.crosshairSize - s - t.value.chart.padding?.left - t.value.chart.padding?.right, n = t.value.chart.grid.position === "middle" ? 0 : a / $.value / 2;
       return {
         top: t.value.chart.padding?.top + e,
@@ -565,7 +565,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
       await Pt(), Ut.value = l, Gl.value && (Bt.value = l);
     }
     function wl() {
-      tt.value = !tt.value;
+      et.value = !et.value;
     }
     const oe = g([]), Zt = g([]);
     let ga = 0;
@@ -632,7 +632,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
     It(() => {
       requestAnimationFrame(() => {
         va();
-      }), vt(
+      }), ct(
         [
           () => Zo.value,
           () => t.value.chart.grid.labels.xAxisLabels.rotation,
@@ -648,7 +648,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
         { flush: "post" }
       );
     }), Pl(() => {
-      St.value = 0, nt.value = 0, jl.stop();
+      St.value = 0, st.value = 0, jl.stop();
     });
     function pa(l, o) {
       const e = ye.value.map((s) => ({
@@ -713,7 +713,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
           );
           _a.value = 0, wa.value = e;
           const s = l ?? 0, a = o != null ? Math.min(xa(o + 1), e) : e;
-          Qt.value = !0, m.value.start = s, m.value.end = a, Me.value.start = s, Me.value.end = a, ut(), ka.value = !0;
+          Qt.value = !0, m.value.start = s, m.value.end = a, Me.value.start = s, Me.value.end = a, ot(), ka.value = !0;
         } finally {
           queueMicrotask(() => {
             Qt.value = !1;
@@ -731,7 +731,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
           o,
           _a.value
         )
-      }), Number.isFinite(o) && o !== m.value.start && (m.value.start = o, Me.value.start = o, ut());
+      }), Number.isFinite(o) && o !== m.value.start && (m.value.start = o, Me.value.start = o, ot());
     }
     function jo(l) {
       if ($t.value || Qt.value) return;
@@ -739,7 +739,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
       We("zoomEnd", {
         index: o,
         isZoom: Sa(o, wa.value)
-      }), o !== m.value.end && (m.value.end = o, Me.value.end = o, ut());
+      }), o !== m.value.end && (m.value.end = o, Me.value.end = o, ot());
     }
     async function eu() {
       await Jt(), We("zoomReset");
@@ -796,7 +796,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
         l.zeroPosition
       ) ? 0 : l.zeroPosition;
     }
-    const it = g(null);
+    const nt = g(null);
     function Ta(l) {
       const o = ae.value;
       if (!o) return null;
@@ -819,7 +819,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
     }
     let qe = 0;
     function tu(l) {
-      at.value = null, !tt.value && (qe && cancelAnimationFrame(qe), qe = requestAnimationFrame(() => {
+      lt.value = null, !et.value && (qe && cancelAnimationFrame(qe), qe = requestAnimationFrame(() => {
         qe = 0;
         const o = Ta(l);
         if (!o || !ae.value) {
@@ -832,11 +832,11 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
           return;
         }
         const S = o.x - e, M = u / $.value, I = Math.floor(S / M);
-        I >= 0 && I < $.value ? it.value !== I && (it.value = I, Al(!0, I)) : Lt();
+        I >= 0 && I < $.value ? nt.value !== I && (nt.value = I, Al(!0, I)) : Lt();
       }));
     }
     function Lt() {
-      qe && (cancelAnimationFrame(qe), qe = 0), it.value = null, Al(!1, null);
+      qe && (cancelAnimationFrame(qe), qe = 0), nt.value = null, Al(!1, null);
     }
     function za(l) {
       const o = Ta(l);
@@ -850,7 +850,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
           }
         }
       }
-      it.value != null && Ia(it.value);
+      nt.value != null && Ia(nt.value);
     }
     function Ia(l) {
       const o = ye.value.map((e) => ({
@@ -986,7 +986,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
       prefix: t.value.chart.labels.prefix,
       suffix: t.value.chart.labels.suffix,
       colNames: oe.value.map(
-        (l, o) => t.value.table.useDefaultTimeFormat ? l.text : rt.value(
+        (l, o) => t.value.table.useDefaultTimeFormat ? l.text : it.value(
           o + m.value.start,
           t.value.table.timeFormat
         )
@@ -1623,7 +1623,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
         l === Da && (Ha.value = e.data);
       })();
     });
-    const rt = b(() => {
+    const it = b(() => {
       const l = t.value.chart.grid.labels.xAxisLabels.datetimeFormatter, o = os({
         useUTC: l.useUTC,
         locale: Ha.value,
@@ -1634,7 +1634,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
         return n == null ? "" : o.formatDate(new Date(n), s);
       };
     }), Wa = b(() => (t.value.chart.grid.labels.xAxisLabels.values || []).map((o, e) => ({
-      text: rt.value(
+      text: it.value(
         e,
         t.value.chart.zoom.timeFormat
       ),
@@ -1667,7 +1667,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
           dateLabel: e
         });
       if (e && e.text && t.value.chart.tooltip.showTimeLabel) {
-        const a = rt.value(
+        const a = it.value(
           _.value + m.value.start,
           t.value.chart.tooltip.timeFormat
         );
@@ -1754,7 +1754,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
       })), o = [];
       return oe.value.forEach((e, s) => {
         const a = t.value.table.useDefaultTimeFormat ? [e.text] : [
-          rt.value(
+          it.value(
             s + m.value.start,
             t.value.table.timeFormat
           )
@@ -1769,7 +1769,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
           );
         }), o.push(a);
       }), { head: l, body: o };
-    }), ct = b(() => {
+    }), rt = b(() => {
       const l = t.value.table.showSum;
       let o = [""].concat(ye.value.map((n) => n.name));
       l && (o = o.concat(
@@ -1780,7 +1780,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
         const u = ye.value.map((S) => S.absoluteValues[n] ?? 0).reduce((S, M) => S + M, 0);
         e.push(
           [
-            t.value.table.useDefaultTimeFormat ? oe.value[n]?.text ?? "-" : rt.value(
+            t.value.table.useDefaultTimeFormat ? oe.value[n]?.text ?? "-" : it.value(
               n + m.value.start,
               t.value.table.timeFormat
             )
@@ -1862,37 +1862,37 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
         x.value.dataLabels = t.value.chart.grid.labels.fontSize, x.value.yAxis = t.value.chart.grid.labels.axis.fontSize, x.value.xAxis = t.value.chart.grid.labels.xAxisLabels.fontSize, x.value.plotLabels = t.value.chart.labels.fontSize, Le.value.plot = t.value.plot.radius, Le.value.line = t.value.line.radius;
         return;
       }
-      x.value.dataLabels = ht({
+      x.value.dataLabels = dt({
         relator: fe.value,
         adjuster: 400,
         source: t.value.chart.grid.labels.fontSize,
         threshold: 10,
         fallback: 10
-      }), x.value.yAxis = ht({
+      }), x.value.yAxis = dt({
         relator: ee.value,
         adjuster: 1e3,
         source: t.value.chart.grid.labels.axis.fontSize,
         threshold: 10,
         fallback: 10
-      }), x.value.xAxis = ht({
+      }), x.value.xAxis = dt({
         relator: ee.value,
         adjuster: 1e3,
         source: t.value.chart.grid.labels.xAxisLabels.fontSize,
         threshold: 10,
         fallback: 10
-      }), x.value.plotLabels = ht({
+      }), x.value.plotLabels = dt({
         relator: ee.value,
         adjuster: 800,
         source: t.value.chart.labels.fontSize,
         threshold: 10,
         fallback: 10
-      }), Le.value.plot = ht({
+      }), Le.value.plot = dt({
         relator: ee.value,
         adjuster: 800,
         source: t.value.plot.radius,
         threshold: 1,
         fallback: 1
-      }), Le.value.line = ht({
+      }), Le.value.line = dt({
         relator: ee.value,
         adjuster: 800,
         source: t.value.line.radius,
@@ -1928,25 +1928,25 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
         Ne.value && (Ne.value.unobserve(ml.value), Ne.value.disconnect());
         const { height: s, width: a } = e.getBoundingClientRect();
         let n = null, u = 0;
-        t.value.chart.title.show && mt.value && (n = mt.value, u = n.getBoundingClientRect().height);
+        t.value.chart.title.show && ft.value && (n = ft.value, u = n.getBoundingClientRect().height);
         let S = null, M = 0;
         t.value.chart.zoom.show && ze.value > 6 && xl.value && Te.value && Te.value.$el && (S = Te.value.$el, M = S.getBoundingClientRect().height);
         let I = null, V = 0;
-        t.value.chart.legend.show && et.value && (I = et.value, V = I.getBoundingClientRect().height);
+        t.value.chart.legend.show && mt.value && (I = mt.value, V = I.getBoundingClientRect().height);
         let D = 0;
         gt.value && (D = gt.value.getBoundingClientRect().height);
         let F = 0;
         bt.value && (F = bt.value.getBoundingClientRect().height), fe.value = s - u - V - M - D - F - l, ee.value = a, Vt.value = `0 0 ${ee.value < 0 ? 10 : ee.value} ${fe.value < 0 ? 10 : fe.value}`, Ua();
         const p = new ResizeObserver((te) => {
           for (const B of te)
-            t.value.chart.title.show && mt.value ? u = mt.value.getBoundingClientRect().height : u = 0, Te.value && Te.value.$el ? M = Te.value.$el.getBoundingClientRect().height : M = 0, et.value ? V = et.value.getBoundingClientRect().height : V = 0, gt.value ? D = gt.value.getBoundingClientRect().height : D = 0, bt.value ? F = bt.value.getBoundingClientRect().height : F = 0, requestAnimationFrame(() => {
-              fe.value = B.contentRect.height - u - V - M - D - F - l, ee.value = B.contentBoxSize[0].inlineSize ?? B.contentRect.width, Vt.value = `0 0 ${ee.value < 0 ? 10 : ee.value} ${fe.value < 0 ? 10 : fe.value}`, Ua(), xt(), ot();
+            t.value.chart.title.show && ft.value ? u = ft.value.getBoundingClientRect().height : u = 0, Te.value && Te.value.$el ? M = Te.value.$el.getBoundingClientRect().height : M = 0, mt.value ? V = mt.value.getBoundingClientRect().height : V = 0, gt.value ? D = gt.value.getBoundingClientRect().height : D = 0, bt.value ? F = bt.value.getBoundingClientRect().height : F = 0, requestAnimationFrame(() => {
+              fe.value = B.contentRect.height - u - V - M - D - F - l, ee.value = B.contentBoxSize[0].inlineSize ?? B.contentRect.width, Vt.value = `0 0 ${ee.value < 0 ? 10 : ee.value} ${fe.value < 0 ? 10 : fe.value}`, Ua(), xt(), at();
             });
         });
         Ne.value = p, ml.value = e, p.observe(e);
       } else
         fe.value = t.value.chart.height, ee.value = t.value.chart.width, x.value.dataLabels = t.value.chart.grid.labels.fontSize, x.value.yAxis = t.value.chart.grid.labels.axis.fontSize, x.value.xAxis = t.value.chart.grid.labels.xAxisLabels.fontSize, x.value.plotLabels = t.value.chart.labels.fontSize, Le.value.plot = t.value.plot.radius, Le.value.line = t.value.line.radius, Vt.value = `0 0 ${ee.value} ${fe.value}`;
-      xt(), ot();
+      xt(), at();
     }
     function Za(l) {
       Po.value = {
@@ -2037,12 +2037,12 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
           console.warn("Custom format cannot be applied on timeTag."), al.value = !1;
         }
       if (!al.value)
-        return [null, void 0].includes(oe.value[l]) ? "" : t.value.chart.grid.labels.xAxisLabels.datetimeFormatter.enable && !t.value.chart.timeTag.useDefaultFormat ? rt.value(
+        return [null, void 0].includes(oe.value[l]) ? "" : t.value.chart.grid.labels.xAxisLabels.datetimeFormatter.enable && !t.value.chart.timeTag.useDefaultFormat ? it.value(
           l + m.value.start,
           t.value.chart.timeTag.timeFormat
         ) : oe.value[l].text;
     });
-    vt(
+    ct(
       () => T.dataset,
       (l) => {
         Array.isArray(l) && l.length > 0 && (Wt.value = !1), ze.value = Math.max(
@@ -2052,13 +2052,13 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
         ), m.value = {
           start: 0,
           end: ze.value
-        }, Io.value += 1, gl.value += 1, xt(), ot(), ut();
+        }, Io.value += 1, gl.value += 1, xt(), at(), ot();
       },
       { deep: !0 }
-    ), vt(
+    ), ct(
       () => T.config,
       (l) => {
-        ne.value || (t.value = yl()), Cl(), Xl.value += 1, Yl.value += 1, kl(), xt(), ot(), ut();
+        ne.value || (t.value = yl()), Cl(), Xl.value += 1, Yl.value += 1, kl(), xt(), at(), ot();
       },
       { deep: !0 }
     );
@@ -2075,10 +2075,10 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
     It(() => {
       Qa();
       const l = new ResizeObserver(() => {
-        Qa(), Tl.value && (Cl(), ut(), Jt());
+        Qa(), Tl.value && (Cl(), ot(), Jt());
       });
       $e.value?.parentNode && l.observe($e.value.parentNode);
-    }), vt(
+    }), ct(
       t,
       () => {
         kl();
@@ -2115,10 +2115,10 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
         }
       };
     });
-    vt(
+    ct(
       () => f.value.showTable,
       (l) => {
-        t.value.showTable || (l && t.value.table.useDialog && lt.value ? lt.value.open() : lt.value && lt.value.close && lt.value.close());
+        t.value.showTable || (l && t.value.table.useDialog && tt.value ? tt.value.open() : tt.value && tt.value.close && tt.value.close());
       }
     );
     function ja() {
@@ -2198,21 +2198,21 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
     }
     const zl = g(!1);
     function Cu() {
-      m.value.end > m.value.start && (at.value = null), Ut.value = !0, zl.value = !0;
+      m.value.end > m.value.start && (lt.value = null), Ut.value = !0, zl.value = !0;
     }
     function Tu() {
-      at.value = null, Lt(), zl.value = !1, Ut.value = !1;
+      lt.value = null, Lt(), zl.value = !1, Ut.value = !1;
     }
     function zu(l) {
-      if (!ae.value || tt.value || document.activeElement !== ae.value) return;
+      if (!ae.value || et.value || document.activeElement !== ae.value) return;
       const o = l.key === "ArrowLeft", e = l.key === "ArrowRight";
       if (!o && !e || !m.value.end && m.value.end !== 0) return;
       const s = m.value.end - m.value.start;
       if (s <= 0) return;
       l.preventDefault(), l.stopPropagation();
-      let a = at.value;
-      const n = it.value, u = a !== null && a >= 0 && a < s, S = n !== null && n >= 0 && n < s;
-      u ? e ? (a += 1, a >= s && (a = 0)) : o && (a -= 1, a < 0 && (a = s - 1)) : S ? (a = e ? n + 1 : n - 1, a >= s && (a = 0), a < 0 && (a = s - 1)) : e ? a = 0 : a = s - 1, at.value = a, Iu(a), Al(!0, a);
+      let a = lt.value;
+      const n = nt.value, u = a !== null && a >= 0 && a < s, S = n !== null && n >= 0 && n < s;
+      u ? e ? (a += 1, a >= s && (a = 0)) : o && (a -= 1, a < 0 && (a = s - 1)) : S ? (a = e ? n + 1 : n - 1, a >= s && (a = 0), a < 0 && (a = s - 1)) : e ? a = 0 : a = s - 1, lt.value = a, Iu(a), Al(!0, a);
     }
     function Iu(l) {
       const o = m.value.end - m.value.start;
@@ -2221,13 +2221,13 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
       n && (Ul.value = n);
     }
     const Il = b(() => {
-      if (!ct.value) return null;
+      if (!rt.value) return null;
       const l = t.value.table.showSum;
       let o = [t.value.table.columnNames.period].concat(
         ye.value.map((s) => s.name)
       );
       l && (o = o.concat(t.value.table.columnNames.total));
-      const e = ct.value.body.slice(
+      const e = rt.value.body.slice(
         m.value.start,
         m.value.end
       );
@@ -2281,7 +2281,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
         svgRef: ae.value,
         backgroundColor: t.value.chart.backgroundColor,
         color: t.value.chart.color,
-        active: tt.value,
+        active: et.value,
         isCursorPointer: Xe.value,
         onClose: wl
       }, {
@@ -2315,7 +2315,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
       t.value.chart.title.show ? (i(), r("div", {
         key: 3,
         ref_key: "chartTitle",
-        ref: mt,
+        ref: ft,
         class: "vue-ui-xy-title",
         style: w(`font-family:${t.value.chart.fontFamily}`)
       }, [
@@ -2362,7 +2362,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
         isTooltip: f.value.showTooltip,
         titles: { ...t.value.chart.userOptions.buttonTitles },
         hasAnnotator: t.value.chart.userOptions.buttons.annotator,
-        isAnnotation: tt.value,
+        isAnnotation: et.value,
         callbacks: t.value.chart.userOptions.callbacks,
         tableDialog: t.value.table.useDialog,
         printScale: t.value.chart.userOptions.print.scale,
@@ -2501,7 +2501,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
             ref: zo,
             class: "vue-data-ui-g"
           }, [
-            dt(v($o)),
+            vt(v($o)),
             l.$slots["chart-background"] ? (i(), r("foreignObject", {
               key: 0,
               x: c.value?.left + q.value < 0 ? 0 : c.value?.left + q.value,
@@ -4220,115 +4220,114 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
       y("div", {
         id: `legend-bottom-${z.value}`
       }, null, 8, Ui),
-      ql.value ? (i(), _e(Ru, {
+      ql.value && (t.value.chart.legend.show || l.$slots.legend) ? (i(), _e(Ru, {
         key: 7,
         to: t.value.chart.legend.position === "top" ? `#legend-top-${z.value}` : `#legend-bottom-${z.value}`
       }, [
-        t.value.chart.legend.show ? (i(), r("div", {
-          key: 0,
+        y("div", {
           ref_key: "chartLegend",
-          ref: et,
-          class: "vue-ui-xy-legend",
-          style: w({
-            fontSize: `var(--legend-font-size, ${t.value.chart.legend.fontSize ?? 14}px)`
-          })
+          ref: mt
         }, [
-          t.value.chart.legend.selectAllToggle.show && ie.value.length > 2 && !v(ne) ? (i(), _e(ps, {
-            key: 0,
-            backgroundColor: t.value.chart.legend.selectAllToggle.backgroundColor,
-            color: t.value.chart.legend.selectAllToggle.color,
-            fontSize: t.value.chart.legend.fontSize,
-            checked: G.value.length > 0,
-            onToggle: ou
-          }, null, 8, ["backgroundColor", "color", "fontSize", "checked"])) : h("", !0),
-          (i(!0), r(d, null, k(ie.value, (e, s) => (i(), r("div", {
-            key: `div_legend_item_${s}`,
-            onClick: (a) => Mt(e),
-            onKeydown: (a) => uu(a, e),
-            role: "button",
-            tabindex: "0",
-            class: Je({
-              "vue-ui-xy-legend-item-alone": ie.value.length === 1,
-              "vue-ui-xy-legend-item": !0,
-              "vue-ui-xy-legend-item-segregated": G.value.includes(e.id)
-            }),
-            style: w({
-              cursor: Xe.value ? "pointer" : "default"
-            })
-          }, [
-            pt.value[e.type] === "line" ? (i(), r("svg", Ki, [
-              y("rect", {
-                x: "0",
-                y: "7.5",
-                rx: "1.5",
-                stroke: t.value.chart.backgroundColor,
-                "stroke-width": 0.5,
-                height: "3",
-                width: "20",
-                fill: e.color
-              }, null, 8, Ji),
-              dt(rl, {
-                plot: { x: 10, y: 9 },
-                radius: 4,
-                color: e.color,
-                shape: [
-                  "triangle",
-                  "square",
-                  "diamond",
-                  "pentagon",
-                  "hexagon",
-                  "star"
-                ].includes(e.shape) ? e.shape : "circle",
-                stroke: t.value.chart.backgroundColor,
-                strokeWidth: 0.5
-              }, null, 8, ["color", "shape", "stroke"])
-            ])) : pt.value[e.type] === "bar" ? (i(), r("svg", Qi, [
-              pt.value[e.type] === "bar" && l.$slots.pattern ? (i(), r("rect", {
+          O(l.$slots, "legend", { legend: ie.value }, () => [
+            t.value.chart.legend.show ? (i(), r("div", {
+              key: 0,
+              class: "vue-ui-xy-legend",
+              style: w({
+                fontSize: `var(--legend-font-size, ${t.value.chart.legend.fontSize ?? 14}px)`
+              })
+            }, [
+              t.value.chart.legend.selectAllToggle.show && ie.value.length > 2 && !v(ne) ? (i(), _e(ps, {
                 key: 0,
-                x: "4",
-                y: "4",
-                rx: "1",
-                height: "32",
-                width: "32",
-                stroke: "none",
-                fill: e.color
-              }, null, 8, ji)) : h("", !0),
-              pt.value[e.type] === "bar" ? (i(), r("rect", {
-                key: 1,
-                x: "4",
-                y: "4",
-                rx: "1",
-                height: "32",
-                width: "32",
-                stroke: "none",
-                fill: l.$slots.pattern ? `url(#pattern_${z.value}_${e.slotAbsoluteIndex})` : e.color
-              }, null, 8, er)) : h("", !0)
-            ])) : (i(), r("svg", tr, [
-              dt(rl, {
-                plot: { x: 6, y: 6 },
-                radius: 5,
-                color: e.color,
-                shape: [
-                  "triangle",
-                  "square",
-                  "diamond",
-                  "pentagon",
-                  "hexagon",
-                  "star"
-                ].includes(e.shape) ? e.shape : "circle"
-              }, null, 8, ["color", "shape"])
-            ])),
-            y("span", {
-              style: w(`color:${t.value.chart.legend.color}`)
-            }, se(e.name), 5)
-          ], 46, Zi))), 128))
-        ], 4)) : (i(), r("div", {
-          key: 1,
-          ref_key: "chartLegend",
-          ref: et
-        }, [
-          O(l.$slots, "legend", { legend: ie.value }, void 0, !0)
-        ], 512))
+                backgroundColor: t.value.chart.legend.selectAllToggle.backgroundColor,
+                color: t.value.chart.legend.selectAllToggle.color,
+                fontSize: t.value.chart.legend.fontSize,
+                checked: G.value.length > 0,
+                onToggle: ou
+              }, null, 8, ["backgroundColor", "color", "fontSize", "checked"])) : h("", !0),
+              (i(!0), r(d, null, k(ie.value, (e, s) => (i(), r("div", {
+                key: `div_legend_item_${s}`,
+                onClick: (a) => Mt(e),
+                onKeydown: (a) => uu(a, e),
+                role: "button",
+                tabindex: "0",
+                class: Je({
+                  "vue-ui-xy-legend-item-alone": ie.value.length === 1,
+                  "vue-ui-xy-legend-item": !0,
+                  "vue-ui-xy-legend-item-segregated": G.value.includes(e.id)
+                }),
+                style: w({
+                  cursor: Xe.value ? "pointer" : "default"
+                })
+              }, [
+                pt.value[e.type] === "line" ? (i(), r("svg", Ki, [
+                  y("rect", {
+                    x: "0",
+                    y: "7.5",
+                    rx: "1.5",
+                    stroke: t.value.chart.backgroundColor,
+                    "stroke-width": 0.5,
+                    height: "3",
+                    width: "20",
+                    fill: e.color
+                  }, null, 8, Ji),
+                  vt(rl, {
+                    plot: { x: 10, y: 9 },
+                    radius: 4,
+                    color: e.color,
+                    shape: [
+                      "triangle",
+                      "square",
+                      "diamond",
+                      "pentagon",
+                      "hexagon",
+                      "star"
+                    ].includes(e.shape) ? e.shape : "circle",
+                    stroke: t.value.chart.backgroundColor,
+                    strokeWidth: 0.5
+                  }, null, 8, ["color", "shape", "stroke"])
+                ])) : pt.value[e.type] === "bar" ? (i(), r("svg", Qi, [
+                  pt.value[e.type] === "bar" && l.$slots.pattern ? (i(), r("rect", {
+                    key: 0,
+                    x: "4",
+                    y: "4",
+                    rx: "1",
+                    height: "32",
+                    width: "32",
+                    stroke: "none",
+                    fill: e.color
+                  }, null, 8, ji)) : h("", !0),
+                  pt.value[e.type] === "bar" ? (i(), r("rect", {
+                    key: 1,
+                    x: "4",
+                    y: "4",
+                    rx: "1",
+                    height: "32",
+                    width: "32",
+                    stroke: "none",
+                    fill: l.$slots.pattern ? `url(#pattern_${z.value}_${e.slotAbsoluteIndex})` : e.color
+                  }, null, 8, er)) : h("", !0)
+                ])) : (i(), r("svg", tr, [
+                  vt(rl, {
+                    plot: { x: 6, y: 6 },
+                    radius: 5,
+                    color: e.color,
+                    shape: [
+                      "triangle",
+                      "square",
+                      "diamond",
+                      "pentagon",
+                      "hexagon",
+                      "star"
+                    ].includes(e.shape) ? e.shape : "circle"
+                  }, null, 8, ["color", "shape"])
+                ])),
+                y("span", {
+                  style: w(`color:${t.value.chart.legend.color}`)
+                }, se(e.name), 5)
+              ], 46, Zi))), 128))
+            ], 4)) : h("", !0)
+          ], !0)
+        ], 512)
       ], 8, ["to"])) : h("", !0),
       l.$slots.source ? (i(), r("div", {
         key: 8,
@@ -4338,7 +4337,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
       }, [
         O(l.$slots, "source", {}, void 0, !0)
       ], 512)) : h("", !0),
-      dt(v(_o), {
+      vt(v(_o), {
         teleportTo: t.value.chart.tooltip.teleportTo,
         show: f.value.showTooltip && Wl.value,
         backgroundColor: t.value.chart.tooltip.backgroundColor,
@@ -4358,7 +4357,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
         backdropFilter: t.value.chart.tooltip.backdropFilter,
         smoothForce: t.value.chart.tooltip.smoothForce,
         smoothSnapThreshold: t.value.chart.tooltip.smoothSnapThreshold,
-        isA11yMode: at.value != null,
+        isA11yMode: lt.value != null,
         a11yPosition: Ul.value
       }, {
         "tooltip-before": Y(() => [
@@ -4374,7 +4373,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
       }, 8, ["teleportTo", "show", "backgroundColor", "color", "fontSize", "borderRadius", "borderColor", "borderWidth", "backgroundOpacity", "position", "offsetY", "parent", "content", "isFullscreen", "isCustom", "smooth", "backdropFilter", "smoothForce", "smoothSnapThreshold", "isA11yMode", "a11yPosition"]),
       xl.value && t.value.chart.userOptions.buttons.table ? (i(), _e(Hu(Ct.value.component), Qe({ key: 9 }, Ct.value.props, {
         ref_key: "tableUnit",
-        ref: lt,
+        ref: tt,
         onClose: ja
       }), lo({
         content: Y(() => [
@@ -4394,7 +4393,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
                   cursor: Xe.value ? "pointer" : "default"
                 })
               }, [
-                dt(v(Rl), {
+                vt(v(Rl), {
                   name: "chartLine",
                   size: 20,
                   stroke: t.value.chart.color
@@ -4407,10 +4406,10 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
               config: du.value
             }, null, 8, ["dataset", "config"])) : (i(), _e(v(ko), {
               key: `table_${Yl.value}`,
-              colNames: ct.value.colNames,
-              head: ct.value.head,
-              body: ct.value.body,
-              config: ct.value.config,
+              colNames: rt.value.colNames,
+              head: rt.value.head,
+              body: rt.value.body,
+              config: rt.value.config,
               title: t.value.table.useDialog ? "" : Ct.value.title,
               withCloseButton: !t.value.table.useDialog,
               onClose: ja
@@ -4449,7 +4448,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
                 t.value.chart.userOptions.callbacks.csv
               ))
             }, [
-              dt(v(Rl), {
+              vt(v(Rl), {
                 name: "fileCsv",
                 stroke: Ct.value.props.color
               }, null, 8, ["stroke"])
@@ -4463,7 +4462,7 @@ const ks = ["id"], _s = ["id"], ws = ["id"], Ss = { style: { position: "relative
       ], !0)
     ], 46, ks));
   }
-}, $r = /* @__PURE__ */ xs(or, [["__scopeId", "data-v-37e62326"]]);
+}, $r = /* @__PURE__ */ xs(or, [["__scopeId", "data-v-8ec65780"]]);
 export {
   $r as default
 };