vue-data-ui 3.16.0 → 3.16.2

package/dist/{vue-ui-stackbar-DcSJuwTC.js → vue-ui-stackbar-D5JI4liZ.js}

@@ -1,4 +1,4 @@
-import { defineAsyncComponent as re, useSlots as no, computed as g, ref as h, shallowRef as Tt, onMounted as io, toRefs as uo, watch as Ie, onBeforeUnmount as je, watchEffect as Re, nextTick as At, openBlock as s, createElementBlock as u, normalizeStyle as q, normalizeClass as ke, createElementVNode as Z, toDisplayString as E, createBlock as ee, createCommentVNode as f, unref as b, withCtx as C, renderSlot as L, normalizeProps as V, guardReactiveProps as B, createSlots as $t, createVNode as Oe, Fragment as x, renderList as S, mergeProps as De, Teleport as co, resolveDynamicComponent as vo, createTextVNode as Pa } from "vue";
+import { defineAsyncComponent as re, useSlots as no, computed as g, ref as h, shallowRef as Tt, onMounted as io, toRefs as uo, watch as Ie, onBeforeUnmount as je, watchEffect as Re, nextTick as At, openBlock as s, createElementBlock as u, normalizeStyle as q, normalizeClass as ke, createElementVNode as Z, toDisplayString as E, createBlock as ee, createCommentVNode as f, unref as b, withCtx as C, renderSlot as L, normalizeProps as V, guardReactiveProps as B, createSlots as $t, createVNode as Oe, Fragment as w, renderList as S, mergeProps as De, Teleport as co, resolveDynamicComponent as vo, createTextVNode as Pa } from "vue";
 import { u as ho } from "./useConfig-DO94Aj5s.js";
 import { j as Na, t as Fa, m as yo, p as et, n as fo, o as Ia, q as Ra, r as go, s as mo, ar as Ee, E as Oa, D as Da, I as bo, X as po, x as xo, G as de, W as Ea, k as we, l as ne, Z as ko, as as wo, T as Va, a0 as Lo, a1 as Co, U as So, a3 as zo } from "./lib-DBptbyyI.js";
 import { t as Ba, u as Mo } from "./useResponsive-DfdjqQps.js";
@@ -51,14 +51,14 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
   },
   emits: ["selectDatapoint", "selectLegend", "selectTimeLabel", "selectX", "copyAlt"],
   setup(tt, { expose: Wa, emit: Xa }) {
-    const Ya = re(() => import("./Tooltip-Bf-kM3_A.js")), qa = re(() => import("./BaseIcon-Cb3zzG6s.js")), Ga = re(() => import("./vue-ui-accordion-nvggWcGN.js")), Ja = re(() => import("./DataTable-DT2kIdQ6.js")), Ka = re(() => import("./PenAndPaper-DARlvvKW.js")), Za = re(() => import("./UserOptions-DWHf8jyO.js")), Qa = re(() => import("./PackageVersion-IIGK_e2C.js")), ja = re(() => import("./BaseDraggableDialog-CIb-iD9g.js")), { vue_ui_stackbar: el } = ho(), { isThemeValid: tl, warnInvalidTheme: al } = No(), ll = no(), P = tt, ae = Xa, Le = g({
+    const Ya = re(() => import("./Tooltip-Bf-kM3_A.js")), qa = re(() => import("./BaseIcon-Cb3zzG6s.js")), Ga = re(() => import("./vue-ui-accordion-nvggWcGN.js")), Ja = re(() => import("./DataTable-DT2kIdQ6.js")), Ka = re(() => import("./PenAndPaper-Ct3qJ4lA.js")), Za = re(() => import("./UserOptions-rW2fRf3V.js")), Qa = re(() => import("./PackageVersion-C4NWSOC8.js")), ja = re(() => import("./BaseDraggableDialog-CIb-iD9g.js")), { vue_ui_stackbar: el } = ho(), { isThemeValid: tl, warnInvalidTheme: al } = No(), ll = no(), F = tt, ae = Xa, Le = g({
       get() {
-        return !!P.dataset && P.dataset.length;
+        return !!F.dataset && F.dataset.length;
       },
       set(t) {
         return t;
       }
-    }), Q = h(null), I = h(Na()), ye = h(!1), at = h(null), lt = h(""), T = h([]), Nt = h(0), Ft = h(null), It = h(null), Ce = h(null), Rt = h(null), Se = h(!1), W = h(null), ie = h(!1), Ot = h(0), ol = h(0), sl = h(0), Dt = h(!1), ze = h(null), ot = h(null), Ve = h(!1), Be = h(!1), Ue = h(null), st = h(null), ue = h(null), ce = h(null), rl = h(null), rt = h(null), Et = Tt(null), Vt = h(!1), Bt = h(0), Ut = h(0), G = h(null), Ht = h({ x: 0, y: 0 }), Wt = h("pointer"), Xt = Io({
+    }), Q = h(null), R = h(Na()), ye = h(!1), at = h(null), lt = h(""), A = h([]), Nt = h(0), Ft = h(null), It = h(null), Ce = h(null), Rt = h(null), Se = h(!1), U = h(null), ie = h(!1), Ot = h(0), ol = h(0), sl = h(0), Dt = h(!1), ze = h(null), ot = h(null), Ve = h(!1), Be = h(!1), Ue = h(null), st = h(null), ue = h(null), ce = h(null), rl = h(null), rt = h(null), Et = Tt(null), Vt = h(!1), Bt = h(0), Ut = h(0), G = h(null), Ht = h({ x: 0, y: 0 }), Wt = h("pointer"), Xt = Io({
       elementRef: Et,
       minimumWidth: 2,
       minimumHeight: 2,
@@ -138,7 +138,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
       },
       userConfig: e.value.skeletonConfig ?? {}
     })), { loading: fe, FINAL_DATASET: ut, manualLoading: He } = Ao({
-      ...uo(P),
+      ...uo(F),
       FINAL_CONFIG: e,
       prepareConfig: vt,
       callback: () => {
@@ -146,7 +146,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
           await Ke();
         });
       },
-      skeletonDataset: P.config?.skeletonDataset ?? [
+      skeletonDataset: F.config?.skeletonDataset ?? [
         {
           name: "",
           series: [2, 3, 5, 8, 13, 21],
@@ -167,11 +167,11 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
       Gt(!0);
     }
     function ul() {
-      Gt(!1), ae("selectX", { seriesIndex: null, datapoint: null }), W.value = null, G.value = null, ye.value = !1;
+      Gt(!1), ae("selectX", { seriesIndex: null, datapoint: null }), U.value = null, G.value = null, ye.value = !1;
     }
     function vt() {
       const t = Pt({
-        userConfig: P.config,
+        userConfig: F.config,
         defaultConfig: el
       });
       let l = {};
@@ -181,12 +181,12 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
           al(t), l = t;
         else {
           const o = Pt({
-            userConfig: Bo[a] || P.config,
+            userConfig: Bo[a] || F.config,
             defaultConfig: t
           });
           l = {
             ...Pt({
-              userConfig: P.config,
+              userConfig: F.config,
               defaultConfig: o
             }),
             customPalette: t.customPalette.length ? t.customPalette : yo[a] || et
@@ -197,12 +197,12 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
       return l;
     }
     const Kt = g(() => e.value.style.chart.bars.dataLabels.hideUnderValue != null), Zt = g(() => e.value.style.chart.bars.dataLabels.hideUnderPercentage != null);
-    Ie(() => P.config, (t) => {
-      fe.value || (e.value = vt()), ct.value = !e.value.userOptions.showOnChartHover, ta(), Ot.value += 1, ol.value += 1, sl.value += 1, A.value.dataLabels.show = e.value.style.chart.bars.dataLabels.show, A.value.showTable = e.value.table.show, A.value.showTooltip = e.value.style.chart.tooltip.show, nt(), Ye();
-    }, { deep: !0 }), Ie(() => P.dataset, (t) => {
+    Ie(() => F.config, (t) => {
+      fe.value || (e.value = vt()), ct.value = !e.value.userOptions.showOnChartHover, ta(), Ot.value += 1, ol.value += 1, sl.value += 1, $.value.dataLabels.show = e.value.style.chart.bars.dataLabels.show, $.value.showTable = e.value.table.show, $.value.showTooltip = e.value.style.chart.tooltip.show, nt(), Ye();
+    }, { deep: !0 }), Ie(() => F.dataset, (t) => {
       Array.isArray(t) && t.length > 0 && (He.value = !1), nt(), sa();
     }, { deep: !0 });
-    const A = h({
+    const $ = h({
       dataLabels: {
         show: e.value.style.chart.bars.dataLabels.show
       },
@@ -210,7 +210,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
       showTooltip: e.value.style.chart.tooltip.show
     });
     Ie(e, () => {
-      A.value = {
+      $.value = {
         dataLabels: {
           show: e.value.style.chart.bars.dataLabels.show
         },
@@ -219,7 +219,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
       };
     }, { immediate: !0 });
     const { isPrinting: ht, isImaging: dt, generatePdf: Qt, generateImage: jt } = To({
-      elementId: `stackbar_${I.value}`,
+      elementId: `stackbar_${R.value}`,
       fileName: e.value.style.chart.title.text || "vue-ui-stackbar",
       options: e.value.userOptions.print
     }), le = h({
@@ -233,11 +233,11 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
       }
     }), cl = g(() => fo(e.value.customPalette)), oe = Tt(null), me = Tt(null), ea = h(null), yt = g(() => !!e.value.debug);
     function ta() {
-      if (Ia(P.dataset) ? (Ra({
+      if (Ia(F.dataset) ? (Ra({
         componentName: "VueUiStackbar",
         type: "dataset",
         debug: yt.value
-      }), He.value = !0) : P.dataset.forEach((t, l) => {
+      }), He.value = !0) : F.dataset.forEach((t, l) => {
         go({
           datasetObject: t,
           requiredAttributes: ["name", "series"]
@@ -250,7 +250,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
             debug: yt.value
           }), He.value = !0;
         });
-      }), Ia(P.dataset) || (He.value = e.value.loading), setTimeout(() => {
+      }), Ia(F.dataset) || (He.value = e.value.loading), setTimeout(() => {
         ie.value = !0;
       }, 10), e.value.responsive) {
         const t = Ba(() => {
@@ -259,7 +259,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
             chart: Q.value,
             title: e.value.style.chart.title.text ? Ft.value : null,
             legend: e.value.style.chart.legend.show ? It.value : null,
-            slicer: e.value.style.chart.zoom.show && N.value > 6 ? Ce.value.$el : null,
+            slicer: e.value.style.chart.zoom.show && I.value > 6 ? Ce.value.$el : null,
             source: Rt.value
           });
           requestAnimationFrame(() => {
@@ -360,21 +360,21 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
     }), n = g(() => {
       Bt.value;
       const { height: t, width: l } = le.value, { right: a } = le.value.paddingRatio;
-      let o = e.value.style.chart.bars.totalValues.show && P.dataset && P.dataset.length > 1 ? e.value.style.chart.bars.totalValues.fontSize * 1.3 : 0, c = 0;
+      let o = e.value.style.chart.bars.totalValues.show && F.dataset && F.dataset.length > 1 ? e.value.style.chart.bars.totalValues.fontSize * 1.3 : 0, c = 0;
       e.value.style.chart.grid.y.axisLabels.show && (c = vl());
-      const r = e.value.style.chart.padding.top + o, d = l - l * a - We.value, k = t - e.value.style.chart.padding.bottom - aa.value - o, w = e.value.style.chart.padding.left + c, $ = l - w - l * a - We.value, F = t - r - e.value.style.chart.padding.bottom - aa.value - o;
+      const r = e.value.style.chart.padding.top + o, d = l - l * a - We.value, x = t - e.value.style.chart.padding.bottom - aa.value - o, k = e.value.style.chart.padding.left + c, M = l - k - l * a - We.value, P = t - r - e.value.style.chart.padding.bottom - aa.value - o;
       return {
         chartHeight: t,
         chartWidth: l,
         top: r,
         right: d,
-        bottom: k,
-        left: w,
-        width: Math.max(0, $),
-        height: Math.max(0, F)
+        bottom: x,
+        left: k,
+        width: Math.max(0, M),
+        height: Math.max(0, P)
       };
     }), ml = g(() => {
-      const { left: t, top: l, width: a, height: o } = n.value, c = v.value.start, r = v.value.end, d = Math.max(1, r - c), k = Math.max(0, Math.min(d, (H.value.start ?? c) - c)), w = Math.max(0, Math.min(d, (H.value.end ?? r) - c)), $ = Math.max(0, w - k), F = {
+      const { left: t, top: l, width: a, height: o } = n.value, c = v.value.start, r = v.value.end, d = Math.max(1, r - c), x = Math.max(0, Math.min(d, (W.value.start ?? c) - c)), k = Math.max(0, Math.min(d, (W.value.end ?? r) - c)), M = Math.max(0, k - x), P = {
         fill: e.value.style.chart.zoom.preview.fill,
         stroke: e.value.style.chart.zoom.preview.stroke,
         "stroke-width": e.value.style.chart.zoom.preview.strokeWidth,
@@ -388,25 +388,25 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
         }
       };
       if (e.value.orientation === "horizontal") {
-        const O = o / d;
+        const N = o / d;
         return {
           x: t,
-          y: l + k * O,
+          y: l + x * N,
           width: a,
-          height: $ * O,
-          ...F
+          height: M * N,
+          ...P
         };
       } else {
-        const O = a / d;
+        const N = a / d;
         return {
-          x: t + k * O,
+          x: t + x * N,
           y: l,
-          width: $ * O,
+          width: M * N,
           height: o,
-          ...F
+          ...P
         };
       }
-    }), U = g(() => ut.value.map((t, l) => {
+    }), H = g(() => ut.value.map((t, l) => {
       const a = mo(t.color) || cl.value[l] || et[l] || et[l % et.length];
       return {
         ...t,
@@ -418,9 +418,9 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
         id: Na(),
         color: a
       };
-    })), N = g(() => {
-      const t = Math.max(...U.value.filter((l) => !T.value.includes(l.id)).map((l) => l.series.length));
-      return isFinite(t) ? t : Math.max(...U.value.map((l) => l.series.length));
+    })), I = g(() => {
+      const t = Math.max(...H.value.filter((l) => !A.value.includes(l.id)).map((l) => l.series.length));
+      return isFinite(t) ? t : Math.max(...H.value.map((l) => l.series.length));
     });
     function bl(t) {
       it.value = t;
@@ -428,14 +428,14 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
     const v = h({
       start: 0,
       end: Math.max(...ut.value.map((t) => t.series.length))
-    }), H = h({ start: 0, end: Math.max(...ut.value.map((t) => t.series.length)) }), la = g(() => e.value.style.chart.zoom.preview.enable && (H.value.start !== v.value.start || H.value.end !== v.value.end));
+    }), W = h({ start: 0, end: Math.max(...ut.value.map((t) => t.series.length)) }), la = g(() => e.value.style.chart.zoom.preview.enable && (W.value.start !== v.value.start || W.value.end !== v.value.end));
     function oa(t, l) {
-      H.value[t] = l;
+      W.value[t] = l;
     }
     function Ye() {
-      const t = N.value;
+      const t = I.value;
       let l = Math.max(0, Math.min(v.value.start ?? 0, t - 1)), a = Math.max(l + 1, Math.min(v.value.end ?? t, t));
-      (!Number.isFinite(l) || !Number.isFinite(a) || a <= l) && (l = 0, a = t), v.value.start = l, v.value.end = a, H.value.start = l, H.value.end = a, Ce.value && (Ce.value.setStartValue(l), Ce.value.setEndValue(a));
+      (!Number.isFinite(l) || !Number.isFinite(a) || a <= l) && (l = 0, a = t), v.value.start = l, v.value.end = a, W.value.start = l, W.value.end = a, Ce.value && (Ce.value.setStartValue(l), Ce.value.setEndValue(a));
     }
     const _e = h(null);
     function pl() {
@@ -454,19 +454,19 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
     const m = g(() => {
       let t;
       return e.value.orientation === "vertical" ? t = n.value.width / (v.value.end - v.value.start) : t = n.value.height / (v.value.end - v.value.start), t <= 0 ? 0 : t;
-    }), Te = g(() => Ee(U.value.filter((t) => !T.value.includes(t.id))).slice(v.value.start, v.value.end)), ft = g(() => T.value.length === U.value.length), ve = g(() => e.value.style.chart.zoom.minimap.show ? Ee(U.value.map((t) => ({
+    }), Te = g(() => Ee(H.value.filter((t) => !A.value.includes(t.id))).slice(v.value.start, v.value.end)), ft = g(() => A.value.length === H.value.length), ve = g(() => e.value.style.chart.zoom.minimap.show ? Ee(H.value.map((t) => ({
       ...t,
       series: t.series.map((l) => l ?? 0)
-    })).filter((t) => ft.value ? !0 : !T.value.includes(t.id))) : []), xl = g(() => e.value.style.chart.zoom.minimap.show ? [{
+    })).filter((t) => ft.value ? !0 : !A.value.includes(t.id))) : []), xl = g(() => e.value.style.chart.zoom.minimap.show ? [{
       name: "",
       series: ve.value,
       color: "#000000",
       isVisible: !0
-    }] : []), kl = g(() => Ee(U.value.filter((t) => !T.value.includes(t.id)).map((t) => ({
+    }] : []), kl = g(() => Ee(H.value.filter((t) => !A.value.includes(t.id)).map((t) => ({
       ...t,
       series: t.series.map((l, a) => t.signedSeries[a] === -1 && l >= 0 ? -l : l)
     }))).slice(v.value.start, v.value.end)), qe = g(() => {
-      const t = U.value.filter((l) => !T.value.includes(l.id));
+      const t = H.value.filter((l) => !A.value.includes(l.id));
       return {
         positive: Ee(t.map((l) => ({
           ...l,
@@ -488,19 +488,19 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
         horizontal_y: n.value.bottom - 8,
         value: c
       }));
-    }), R = h([]), be = h([]);
+    }), O = h([]), be = h([]);
     let ra = 0;
     Re(() => {
       const t = ++ra;
       (async () => {
         const l = await Ua({
           values: e.value.style.chart.grid.x.timeLabels.values,
-          maxDatapoints: N.value,
+          maxDatapoints: I.value,
           formatter: e.value.style.chart.grid.x.timeLabels.datetimeFormatter,
           start: v.value.start,
           end: v.value.end
         });
-        t === ra && (R.value = l);
+        t === ra && (O.value = l);
       })();
     });
     let na = 0;
@@ -509,25 +509,25 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
       (async () => {
         const l = await Ua({
           values: e.value.style.chart.grid.x.timeLabels.values,
-          maxDatapoints: N.value,
+          maxDatapoints: I.value,
           formatter: e.value.style.chart.grid.x.timeLabels.datetimeFormatter,
           start: 0,
-          end: N.value
+          end: I.value
         });
         t === na && (be.value = l);
       })();
     });
     const wl = g(() => {
       const t = e.value.style.chart.grid.x.timeLabels.modulo;
-      return R.value.length ? Math.min(t, [...new Set(R.value.map((l) => l.text))].length) : t;
+      return O.value.length ? Math.min(t, [...new Set(O.value.map((l) => l.text))].length) : t;
     }), gt = g(() => {
-      const t = e.value.style.chart.grid.x.timeLabels, l = R.value || [], a = be.value || [], o = v.value.start ?? 0, c = W.value, r = N.value, d = l.map((w) => w?.text ?? ""), k = a.map((w) => w?.text ?? "");
+      const t = e.value.style.chart.grid.x.timeLabels, l = O.value || [], a = be.value || [], o = v.value.start ?? 0, c = U.value, r = I.value, d = l.map((k) => k?.text ?? ""), x = a.map((k) => k?.text ?? "");
       return bo(
         !!t.showOnlyFirstAndLast,
         !!t.showOnlyAtModulo,
         Math.max(1, wl.value || 1),
         d,
-        k,
+        x,
         o,
         c,
         r
@@ -563,73 +563,73 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
       absoluteIndex: a
     }))), z = g(() => {
       if (!Le.value && !fe.value) return [];
-      let t = Array(N.value).fill(0), l = Array(N.value).fill(0), a = Array(N.value).fill(0), o = Array(N.value).fill(0);
-      const c = Math.max(...qe.value.positive) || 0, r = Math.min(...qe.value.negative), d = [-1 / 0, 1 / 0, NaN, void 0, null].includes(r) ? 0 : r, k = !e.value.style.chart.bars.distributed && (e.value.style.chart.grid.scale.scaleMax !== null || e.value.style.chart.grid.scale.scaleMin !== null) ? Oa(e.value.style.chart.grid.scale.scaleMin !== null ? e.value.style.chart.grid.scale.scaleMin : d > 0 ? 0 : d, e.value.style.chart.grid.scale.scaleMax !== null ? e.value.style.chart.grid.scale.scaleMax : c < 0 ? 0 : c, e.value.style.chart.grid.scale.ticks) : Da(e.value.style.chart.grid.scale.scaleMin !== null ? e.value.style.chart.grid.scale.scaleMin : d > 0 ? 0 : d, e.value.style.chart.grid.scale.scaleMax !== null ? e.value.style.chart.grid.scale.scaleMax : c < 0 ? 0 : c, e.value.style.chart.grid.scale.ticks), { min: w, max: $ } = k, F = $ + (w >= 0 ? 0 : Math.abs(w)) || 1, O = n.value.height, j = n.value.width, he = Y.value[0] ? Y.value[0].zero : n.value.bottom, Fe = Y.value[0] ? Y.value[0].horizontal_zero : n.value.left;
+      let t = Array(I.value).fill(0), l = Array(I.value).fill(0), a = Array(I.value).fill(0), o = Array(I.value).fill(0);
+      const c = Math.max(...qe.value.positive) || 0, r = Math.min(...qe.value.negative), d = [-1 / 0, 1 / 0, NaN, void 0, null].includes(r) ? 0 : r, x = !e.value.style.chart.bars.distributed && (e.value.style.chart.grid.scale.scaleMax !== null || e.value.style.chart.grid.scale.scaleMin !== null) ? Oa(e.value.style.chart.grid.scale.scaleMin !== null ? e.value.style.chart.grid.scale.scaleMin : d > 0 ? 0 : d, e.value.style.chart.grid.scale.scaleMax !== null ? e.value.style.chart.grid.scale.scaleMax : c < 0 ? 0 : c, e.value.style.chart.grid.scale.ticks) : Da(e.value.style.chart.grid.scale.scaleMin !== null ? e.value.style.chart.grid.scale.scaleMin : d > 0 ? 0 : d, e.value.style.chart.grid.scale.scaleMax !== null ? e.value.style.chart.grid.scale.scaleMax : c < 0 ? 0 : c, e.value.style.chart.grid.scale.ticks), { min: k, max: M } = x, P = M + (k >= 0 ? 0 : Math.abs(k)) || 1, N = n.value.height, j = n.value.width, he = Y.value[0] ? Y.value[0].zero : n.value.bottom, Fe = Y.value[0] ? Y.value[0].horizontal_zero : n.value.left;
       let J = Array(ve.value.length).fill(0), _a = Array(ve.value.length).fill(0);
-      return U.value.filter((xe) => !T.value.includes(xe.id)).map((xe) => {
+      return H.value.filter((xe) => !A.value.includes(xe.id)).map((xe) => {
         const se = xe.series.slice(), Ta = se.map((y, p) => J[p]), Gl = se.map((y, p) => _a[p]);
         se.forEach((y, p) => {
           (Number(y) || 0) >= 0 ? J[p] += Number(y) || 0 : _a[p] += Math.abs(Number(y) || 0);
         });
         const te = xe.series.slice(v.value.start, v.value.end), Jl = xe.signedSeries.slice(v.value.start, v.value.end), Kl = te.map((y, p) => n.value.left + m.value * p + m.value * e.value.style.chart.bars.gapRatio / 4), Qe = (ve.value || []).filter(Number.isFinite), zt = Qe.length ? Math.max(...Qe) : 0, Mt = Qe.length ? Math.min(...Qe) : 0;
         function Aa({ minimapH: y }) {
-          const M = zt > 0, D = Mt < 0;
-          if (M && D) {
+          const _ = zt > 0, D = Mt < 0;
+          if (_ && D) {
             const K = Math.max(zt, Math.abs(Mt)) || 1e-9;
             return {
               pxPerUnit: y / 2 / K,
               zero: y / 2
             };
           }
-          if (M) {
+          if (_) {
             const K = Math.max(1e-9, zt);
             return {
               pxPerUnit: y / K,
               zero: y
             };
           }
-          const _ = Math.max(1e-9, Math.abs(Mt));
+          const T = Math.max(1e-9, Math.abs(Mt));
           return {
-            pxPerUnit: y / _,
+            pxPerUnit: y / T,
             zero: 0
           };
         }
         const Zl = ({ left: y, unitW: p }) => {
-          const M = p * (e.value.style.chart.bars.gapRatio / 4);
-          return se.map((D, _) => y + p * _ + M);
+          const _ = p * (e.value.style.chart.bars.gapRatio / 4);
+          return se.map((D, T) => y + p * T + _);
         }, Ql = te.map((y, p) => n.value.top + m.value * p + m.value * e.value.style.chart.bars.gapRatio / 4), jl = te.map((y, p) => {
-          const M = e.value.style.chart.bars.distributed ? (y || 0) / Te.value[p] : (y || 0) / F;
-          let D, _;
-          return y > 0 ? (_ = O * M, D = he - _ - t[p], t[p] += _) : (_ = O * M, D = he + a[p], a[p] += Math.abs(_)), D;
+          const _ = e.value.style.chart.bars.distributed ? (y || 0) / Te.value[p] : (y || 0) / P;
+          let D, T;
+          return y > 0 ? (T = N * _, D = he - T - t[p], t[p] += T) : (T = N * _, D = he + a[p], a[p] += Math.abs(T)), D;
         }), eo = ({ minimapH: y }) => {
           if (e.value.style.chart.bars.distributed)
-            return se.map((_, K) => {
-              const _t = Math.abs(Number(_) || 0), $a = Math.abs(ve.value?.[K] || 0) || 1e-9, ro = (Ta[K] + _t) / $a;
+            return se.map((T, K) => {
+              const _t = Math.abs(Number(T) || 0), $a = Math.abs(ve.value?.[K] || 0) || 1e-9, ro = (Ta[K] + _t) / $a;
               return y - ro * y;
             });
-          const { pxPerUnit: p, zero: M } = Aa({ minimapH: y });
-          return se.map((D, _) => {
+          const { pxPerUnit: p, zero: _ } = Aa({ minimapH: y });
+          return se.map((D, T) => {
             const K = Number(D) || 0;
-            return K >= 0 ? M - (Ta[_] + K) * p : M + Gl[_] * p;
+            return K >= 0 ? _ - (Ta[T] + K) * p : _ + Gl[T] * p;
           });
         }, to = te.map((y, p) => {
-          const M = e.value.style.chart.bars.distributed ? (y || 0) / Te.value[p] : (y || 0) / F;
-          let D, _;
-          return y > 0 ? (_ = j * M, D = Fe + l[p], l[p] += _) : (_ = j * M, D = Fe - Math.abs(_) - o[p], o[p] += Math.abs(_)), D;
+          const _ = e.value.style.chart.bars.distributed ? (y || 0) / Te.value[p] : (y || 0) / P;
+          let D, T;
+          return y > 0 ? (T = j * _, D = Fe + l[p], l[p] += T) : (T = j * _, D = Fe - Math.abs(T) - o[p], o[p] += Math.abs(T)), D;
         }), ao = te.map((y, p) => {
-          const M = e.value.style.chart.bars.distributed ? (y || 0) / Te.value[p] : (y || 0) / F;
-          return y > 0 ? O * M : O * Math.abs(M);
+          const _ = e.value.style.chart.bars.distributed ? (y || 0) / Te.value[p] : (y || 0) / P;
+          return y > 0 ? N * _ : N * Math.abs(_);
         }), lo = ({ minimapH: y }) => {
           if (e.value.style.chart.bars.distributed)
-            return se.map((D, _) => {
-              const K = Math.abs(Number(D) || 0), _t = Math.abs(ve.value?.[_] || 0) || 1e-9;
+            return se.map((D, T) => {
+              const K = Math.abs(Number(D) || 0), _t = Math.abs(ve.value?.[T] || 0) || 1e-9;
               return K / _t * y;
             });
           const { pxPerUnit: p } = Aa({ minimapH: y });
-          return se.map((M) => Math.abs(Number(M) || 0) * p);
+          return se.map((_) => Math.abs(Number(_) || 0) * p);
         }, oo = te.map((y, p) => {
-          const M = e.value.style.chart.bars.distributed ? (y || 0) / Te.value[p] : (y || 0) / F;
-          return y > 0 ? j * M : j * Math.abs(M);
+          const _ = e.value.style.chart.bars.distributed ? (y || 0) / Te.value[p] : (y || 0) / P;
+          return y > 0 ? j * _ : j * Math.abs(_);
         }), so = te.map((y) => Math.abs(y)).reduce((y, p) => y + p, 0);
         return {
           ...xe,
@@ -685,7 +685,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
         color: a.color,
         id: a.id
       }));
-      e.value.events.datapointClick && e.value.events.datapointClick({ datapoint: l, seriesIndex: t + v.value.start }), ae("selectDatapoint", { datapoint: l, period: R.value[t] });
+      e.value.events.datapointClick && e.value.events.datapointClick({ datapoint: l, seriesIndex: t + v.value.start }), ae("selectDatapoint", { datapoint: l, period: O.value[t] });
     }
     function pt(t) {
       return JSON.parse(JSON.stringify(z.value)).map((l) => ({
@@ -703,20 +703,20 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
         const l = pt(t);
         e.value.events.datapointLeave({ datapoint: l, seriesIndex: t + v.value.start });
       }
-      ye.value = !1, W.value = null, G.value === t && (G.value = null);
+      ye.value = !1, U.value = null, G.value === t && (G.value = null);
     }
-    const Ll = g(() => Array(N.value).fill(0).map((t, l) => pt(l)));
-    Ie(() => P.selectedXIndex, (t) => {
-      if ([null, void 0].includes(P.selectedXIndex)) {
-        W.value = null;
+    const Ll = g(() => Array(I.value).fill(0).map((t, l) => pt(l)));
+    Ie(() => F.selectedXIndex, (t) => {
+      if ([null, void 0].includes(F.selectedXIndex)) {
+        U.value = null;
         return;
       }
       const l = t - v.value.start;
-      l < 0 || t >= v.value.end ? W.value = null : W.value = l ?? null;
+      l < 0 || t >= v.value.end ? U.value = null : U.value = l ?? null;
     }, { immediate: !0 });
     function xt(t, l = "pointer") {
       if (ft.value) return;
-      Wt.value = l, G.value = t, W.value = t, ye.value = !0;
+      Wt.value = l, G.value = t, U.value = t, ye.value = !0;
       const a = e.value.style.chart.tooltip.customFormat, o = pt(t);
       Bl({ seriesIndex: t, datapoint: o }), e.value.events.datapointEnter && e.value.events.datapointEnter({ datapoint: o, seriesIndex: t + v.value.start }), at.value = {
         datapoint: o,
@@ -724,7 +724,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
         config: e.value,
         series: z.value
       };
-      const c = o.map((d) => Math.abs(d.value)).reduce((d, k) => d + k, 0), r = o.map((d) => de(d.value)).reduce((d, k) => d + k, 0);
+      const c = o.map((d) => Math.abs(d.value)).reduce((d, x) => d + x, 0), r = o.map((d) => de(d.value)).reduce((d, x) => d + x, 0);
       if (Va(a) && So(() => a({
         seriesIndex: t,
         datapoint: o,
@@ -740,16 +740,16 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
       else {
         const {
           showValue: d,
-          showTotal: k,
-          totalTranslation: w,
-          showPercentage: $,
-          borderColor: F,
-          roundingValue: O,
+          showTotal: x,
+          totalTranslation: k,
+          showPercentage: M,
+          borderColor: P,
+          roundingValue: N,
           roundingPercentage: j
         } = e.value.style.chart.tooltip;
         let he = "";
-        (R.value[t] && R.value[t].text || mt.value[t] && mt.value[t].text && e.value.style.chart.tooltip.showTimeLabel) && (he += `<div style="width:100%;text-align:center;border-bottom:1px solid ${F};padding-bottom:6px;margin-bottom:3px;">${e.value.style.chart.tooltip.useDefaultTimeFormat ? R.value[t]?.text : mt.value[t]?.text || be.value[t]?.text || ""}</div>`), k && (he += `<div class="vue-data-ui-tooltip-total" style="display:flex;flex-direction:row;align-items:center;gap:4px">
-                <span>${w}:</span>
+        (O.value[t] && O.value[t].text || mt.value[t] && mt.value[t].text && e.value.style.chart.tooltip.showTimeLabel) && (he += `<div style="width:100%;text-align:center;border-bottom:1px solid ${P};padding-bottom:6px;margin-bottom:3px;">${e.value.style.chart.tooltip.useDefaultTimeFormat ? O.value[t]?.text : mt.value[t]?.text || be.value[t]?.text || ""}</div>`), x && (he += `<div class="vue-data-ui-tooltip-total" style="display:flex;flex-direction:row;align-items:center;gap:4px">
+                <span>${k}:</span>
                 <span>
                     ${we(
           e.value.style.chart.bars.dataLabels.formatter,
@@ -758,30 +758,30 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
             p: e.value.style.chart.bars.dataLabels.prefix,
             v: r,
             s: e.value.style.chart.bars.dataLabels.suffix,
-            r: O
+            r: N
           }),
-          { datapoint: { name: w, value: r } }
+          { datapoint: { name: k, value: r } }
         )}
                 </span>
             </div>`);
         const Fe = [
-          d && $ ? "(" : "",
-          d && $ ? ")" : ""
+          d && M ? "(" : "",
+          d && M ? ")" : ""
         ];
         o.reverse().forEach((J) => {
           he += `
                 <div style="display:flex;flex-direction:row;align-items:center;gap:4px">
-                    <svg viewBox="0 0 60 60" height="14" width="14"><rect rx="5" x="0" y="0" height="60" width="60" stroke="none" fill="${e.value.style.chart.bars.gradient.show ? `url(#gradient_${J.id})` : J.color}"/>${ll.pattern ? `<rect rx="5" x="0" y="0" height="60" width="60" stroke="none" fill="url(#pattern_${I.value}_${J.absoluteIndex})"/>` : ""}</svg>
-                    ${J.name}${d || $ ? ":" : ""} ${d ? we(
+                    <svg viewBox="0 0 60 60" height="14" width="14"><rect rx="5" x="0" y="0" height="60" width="60" stroke="none" fill="${e.value.style.chart.bars.gradient.show ? `url(#gradient_${J.id})` : J.color}"/>${ll.pattern ? `<rect rx="5" x="0" y="0" height="60" width="60" stroke="none" fill="url(#pattern_${R.value}_${J.absoluteIndex})"/>` : ""}</svg>
+                    ${J.name}${d || M ? ":" : ""} ${d ? we(
             e.value.style.chart.bars.dataLabels.formatter,
             J.value,
             ne({
               p: e.value.style.chart.bars.dataLabels.prefix,
               v: J.value,
               s: e.value.style.chart.bars.dataLabels.suffix,
-              r: O
+              r: N
             })
-          ) : ""} ${Fe[0]}${$ ? ne({
+          ) : ""} ${Fe[0]}${M ? ne({
             v: isNaN(J.value / c) ? 0 : Math.abs(J.value) / c * 100,
             // Negs are absed to show relative proportion to absolute total. It's opinionated.
             s: "%",
@@ -795,7 +795,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
     const Cl = g(() => le.value.width), Sl = g(() => le.value.height);
     Oo({
       timeLabelsEls: e.value.orientation === "vertical" ? ce : ue,
-      timeLabels: R,
+      timeLabels: O,
       slicer: v,
       configRef: e,
       rotationPath: ["style", "chart", "grid", "x", "timeLabels", "rotation"],
@@ -809,13 +809,13 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
       Se.value = t, Nt.value += 1;
     }
     function ga() {
-      A.value.showTable = !A.value.showTable;
+      $.value.showTable = !$.value.showTable;
     }
     function ma() {
-      A.value.dataLabels.show = !A.value.dataLabels.show;
+      $.value.dataLabels.show = !$.value.dataLabels.show;
     }
     function ba() {
-      A.value.showTooltip = !A.value.showTooltip;
+      $.value.showTooltip = !$.value.showTooltip;
     }
     function zl() {
       return z.value;
@@ -826,9 +826,9 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
         label: a,
         color: o
       })), l = [];
-      return R.value.forEach((a) => {
+      return O.value.forEach((a) => {
         const o = [e.value.style.chart.grid.x.timeLabels.values[a.absoluteIndex] ? a.text : i + 1];
-        U.value.forEach((c) => {
+        H.value.forEach((c) => {
           o.push(Number((c.series[a.absoluteIndex] || 0).toFixed(e.value.table.td.roundingValue)));
         }), l.push(o);
       }), { head: t, body: l };
@@ -840,9 +840,9 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
     const pe = g(() => {
       const t = [""].concat(z.value.map((c) => c.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 l = [];
-      for (let c = 0; c < N.value; c += 1) {
-        const r = z.value.map((d) => d.series[c] ?? 0).reduce((d, k) => d + k, 0);
-        l.push([e.value.style.chart.grid.x.timeLabels.values.slice(v.value.start, v.value.end)[c] ? R.value[c]?.text : c + 1].concat(z.value.map((d) => (d.series[c] ?? 0).toFixed(e.value.table.td.roundingValue))).concat((r ?? 0).toFixed(e.value.table.td.roundingValue)));
+      for (let c = 0; c < I.value; c += 1) {
+        const r = z.value.map((d) => d.series[c] ?? 0).reduce((d, x) => d + x, 0);
+        l.push([e.value.style.chart.grid.x.timeLabels.values.slice(v.value.start, v.value.end)[c] ? O.value[c]?.text : c + 1].concat(z.value.map((d) => (d.series[c] ?? 0).toFixed(e.value.table.td.roundingValue))).concat((r ?? 0).toFixed(e.value.table.td.roundingValue)));
       }
       const a = {
         th: {
@@ -860,41 +860,41 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
       return { head: t, body: l.slice(0, v.value.end - v.value.start), config: a, colNames: o };
     });
     function Ml() {
-      T.value.length ? T.value = [] : Ae.value.forEach((t) => {
-        T.value.push(t.id);
+      A.value.length ? A.value = [] : Ae.value.forEach((t) => {
+        A.value.push(t.id);
       });
     }
     function wt(t) {
-      if (T.value.includes(t.id))
-        T.value = T.value.filter((l) => l !== t.id);
+      if (A.value.includes(t.id))
+        A.value = A.value.filter((l) => l !== t.id);
       else {
-        if (T.value.length === U.value.length - 1) return;
-        T.value.push(t.id);
+        if (A.value.length === H.value.length - 1) return;
+        A.value.push(t.id);
       }
       ae("selectLegend", z.value);
     }
     function xa(t) {
-      if (!U.value.length)
+      if (!H.value.length)
         return e.value.debug && console.warn("VueUiStackbar - There are no series to show."), null;
-      const l = U.value.find((a) => a.name === t);
+      const l = H.value.find((a) => a.name === t);
       return l || (e.value.debug && console.warn(`VueUiStackbar - Series name not found "${t}"`), null);
     }
     function _l(t) {
       const l = xa(t);
-      l !== null && T.value.includes(l.id) && wt({ id: l.id });
+      l !== null && A.value.includes(l.id) && wt({ id: l.id });
     }
     function Tl(t) {
       const l = xa(t);
-      l !== null && (T.value.includes(l.id) || wt({ id: l.id }));
+      l !== null && (A.value.includes(l.id) || wt({ id: l.id }));
     }
-    const Ae = g(() => U.value.map((t, l) => ({
+    const Ae = g(() => H.value.map((t, l) => ({
       ...t,
       shape: "square"
     })).map((t) => ({
       ...t,
-      opacity: T.value.includes(t.id) ? 0.5 : 1,
+      opacity: A.value.includes(t.id) ? 0.5 : 1,
       segregate: () => wt(t),
-      isSegregated: T.value.includes(t.id)
+      isSegregated: A.value.includes(t.id)
     }))), Al = g(() => ({
       cy: "stackbar-legend",
       backgroundColor: e.value.style.chart.legend.backgroundColor,
@@ -937,7 +937,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
       };
     }
     const Pe = g(() => {
-      const t = e.value.table.useDialog && !e.value.table.show, l = A.value.showTable;
+      const t = e.value.table.useDialog && !e.value.table.show, l = $.value.showTable;
       return {
         component: t ? ja : Ga,
         title: `${e.value.style.chart.title.text}${e.value.style.chart.title.subtitle.text ? `: ${e.value.style.chart.title.subtitle.text}` : ""}`,
@@ -967,11 +967,11 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
         }
       };
     });
-    Ie(() => A.value.showTable, (t) => {
+    Ie(() => $.value.showTable, (t) => {
       e.value.table.show || (t && e.value.table.useDialog && ze.value ? ze.value.open() : "close" in ze.value && ze.value.close());
     });
     function wa() {
-      A.value.showTable = !1, ot.value && ot.value.setTableIconState(!1);
+      $.value.showTable = !1, ot.value && ot.value.setTableIconState(!1);
     }
     const Nl = g(() => e.value.style.chart.backgroundColor), Fl = g(() => e.value.style.chart.legend), Il = g(() => e.value.style.chart.title), { exportSvg: Rl, getSvg: Ol } = Po({
       svg: ge,
@@ -1004,7 +1004,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
       jt();
     }
     function Ca(t) {
-      const l = N.value;
+      const l = I.value;
       return t > l ? l : t < 0 || t < v.value.start ? e.value.style.chart.zoom.startIndex !== null ? v.value.start + 1 : 1 : t;
     }
     const Ne = h(!1), Sa = h(!1);
@@ -1012,8 +1012,8 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
       if (!Ne.value) {
         Ne.value = !0;
         try {
-          const { startIndex: t, endIndex: l } = e.value.style.chart.zoom, a = N.value, o = t ?? 0, c = l != null ? Math.min(Ca(l + 1), a) : a;
-          Ze.value = !0, v.value.start = o, v.value.end = c, H.value.start = o, H.value.end = c, Ye(), Sa.value = !0;
+          const { startIndex: t, endIndex: l } = e.value.style.chart.zoom, a = I.value, o = t ?? 0, c = l != null ? Math.min(Ca(l + 1), a) : a;
+          Ze.value = !0, v.value.start = o, v.value.end = c, W.value.start = o, W.value.end = c, Ye(), Sa.value = !0;
         } finally {
           queueMicrotask(() => {
             Ze.value = !1;
@@ -1023,12 +1023,12 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
     }
     const Ze = h(!1);
     function El(t) {
-      Ne.value || Ze.value || t !== v.value.start && (v.value.start = t, H.value.start = t, Ye());
+      Ne.value || Ze.value || t !== v.value.start && (v.value.start = t, W.value.start = t, Ye());
     }
     function Vl(t) {
       if (Ne.value || Ze.value) return;
       const l = Ca(t);
-      l !== v.value.end && (v.value.end = l, H.value.end = l, Ye());
+      l !== v.value.end && (v.value.end = l, W.value.end = l, Ye());
     }
     function Bl({ seriesIndex: t, datapoint: l }) {
       const a = v.value.start + t;
@@ -1044,13 +1044,13 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
     function Ul(t) {
       const { y0: l } = za(), a = e.value.style.chart.bars.totalValues, o = Math.max(2, a.fontSize * 0.3 + a.offsetY);
       let c = 1 / 0, r = !1;
-      for (const $ of z.value || []) {
-        const F = $?.series?.[t] ?? 0, O = $?.height?.[t] ?? 0, j = $?.y?.[t];
-        F > 0 && O > 0 && Number.isFinite(j) && (r = !0, j < c && (c = j));
+      for (const M of z.value || []) {
+        const P = M?.series?.[t] ?? 0, N = M?.height?.[t] ?? 0, j = M?.y?.[t];
+        P > 0 && N > 0 && Number.isFinite(j) && (r = !0, j < c && (c = j));
       }
-      const k = (r && Number.isFinite(c) ? c : l) - o;
+      const x = (r && Number.isFinite(c) ? c : l) - o;
       return Math.min(
-        Math.max(k, 0),
+        Math.max(x, 0),
         n.value.bottom
       );
     }
@@ -1058,8 +1058,8 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
       const { x0: l } = za(), a = Math.max(2, e.value.style.chart.bars.totalValues.fontSize * 0.3 + e.value.style.chart.bars.totalValues.offsetX);
       let o = -1 / 0, c = !1;
       for (const d of z.value || []) {
-        const k = d?.series?.[t] ?? 0, w = d?.horizontal_x?.[t], $ = d?.horizontal_width?.[t], F = Number.isFinite($) ? Math.max(0, $) : 0;
-        Number.isFinite(w) && k > 0 && F > 0 && (c = !0, o = Math.max(o, w + F));
+        const x = d?.series?.[t] ?? 0, k = d?.horizontal_x?.[t], M = d?.horizontal_width?.[t], P = Number.isFinite(M) ? Math.max(0, M) : 0;
+        Number.isFinite(k) && x > 0 && P > 0 && (c = !0, o = Math.max(o, k + P));
       }
       return (c && Number.isFinite(o) ? o : l) + a;
     }
@@ -1081,16 +1081,16 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
       G.value = null, Ct.value = !0;
     }
     function Xl() {
-      G.value = null, ye.value = !1, W.value = null, ae("selectX", { seriesIndex: null, datapoint: null }), Ct.value = !1;
+      G.value = null, ye.value = !1, U.value = null, ae("selectX", { seriesIndex: null, datapoint: null }), Ct.value = !1;
     }
     function Yl(t) {
       if (!ge.value || $e.value || document.activeElement !== ge.value || ft.value || !v.value.end && v.value.end !== 0) return;
       const l = e.value.orientation === "vertical", a = e.value.orientation === "horizontal", o = l && t.key === "ArrowLeft" || a && t.key === "ArrowUp", c = l && t.key === "ArrowRight" || a && t.key === "ArrowDown", r = t.key === "Enter" || t.key === " ", d = t.key === "Escape";
       if (!o && !c && !r && !d) return;
-      const k = v.value.end - v.value.start;
-      if (k <= 0) return;
+      const x = v.value.end - v.value.start;
+      if (x <= 0) return;
       if (t.preventDefault(), t.stopPropagation(), d) {
-        G.value = null, ye.value = !1, W.value = null, ae("selectX", { seriesIndex: null, datapoint: null });
+        G.value = null, ye.value = !1, U.value = null, ae("selectX", { seriesIndex: null, datapoint: null });
         return;
       }
       if (r) {
@@ -1098,8 +1098,9 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
         bt(G.value);
         return;
       }
-      let w = G.value;
-      w === null || w < 0 || w >= k ? c ? w = 0 : w = k - 1 : c ? (w += 1, w >= k && (w = 0)) : o && (w -= 1, w < 0 && (w = k - 1)), G.value = w, ql(w), xt(w, "keyboard");
+      let k = G.value;
+      const M = U.value, P = k !== null && k >= 0 && k < x, N = M !== null && M >= 0 && M < x;
+      P ? c ? (k += 1, k >= x && (k = 0)) : o && (k -= 1, k < 0 && (k = x - 1)) : N ? (k = c ? M + 1 : M - 1, k >= x && (k = 0), k < 0 && (k = x - 1)) : c ? k = 0 : k = x - 1, G.value = k, ql(k), xt(k, "keyboard");
     }
     function ql(t) {
       if (!Number.isFinite(t)) return;
@@ -1128,7 +1129,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
       toggleFullscreen: fa,
       copyAlt: Ma
     }), (t, l) => (s(), u("div", {
-      id: `stackbar_${I.value}`,
+      id: `stackbar_${R.value}`,
       ref_key: "stackbarChart",
       ref: Q,
       class: ke({ "vue-data-ui-component": !0, "vue-ui-stackbar": !0, "vue-data-ui-wrapper-fullscreen": Se.value }),
@@ -1137,14 +1138,14 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
       onMouseleave: ul
     }, [
       Z("div", {
-        id: `chart-instructions-${I.value}`,
+        id: `chart-instructions-${R.value}`,
         class: "sr-only"
       }, [
         Z("p", null, E(e.value.a11y.translations.keyboardNavigation), 1)
       ], 8, Go),
       St.value?.rows?.length ? (s(), ee(Ho, {
         key: 0,
-        uid: I.value,
+        uid: R.value,
         head: St.value.headers,
         body: St.value.rows,
         notice: e.value.a11y.translations.tableAvailable,
@@ -1201,7 +1202,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
         }, null, 8, ["config"]))
       ], 512)) : f("", !0),
       Z("div", {
-        id: `legend-top-${I.value}`
+        id: `legend-top-${R.value}`
       }, null, 8, Jo),
       e.value.userOptions.show && Le.value && (b(Jt) || b(ct)) ? (s(), ee(b(Za), {
         ref_key: "userOptionsRef",
@@ -1211,7 +1212,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
         color: e.value.style.chart.color,
         isPrinting: b(ht),
         isImaging: b(dt),
-        uid: I.value,
+        uid: R.value,
         hasTooltip: e.value.style.chart.tooltip.show && e.value.userOptions.buttons.tooltip,
         hasPdf: e.value.userOptions.buttons.pdf,
         hasImg: e.value.userOptions.buttons.img,
@@ -1224,7 +1225,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
         isFullscreen: Se.value,
         chartElement: Q.value,
         position: e.value.userOptions.position,
-        isTooltip: A.value.showTooltip,
+        isTooltip: $.value.showTooltip,
         titles: { ...e.value.userOptions.buttonTitles },
         hasAnnotator: e.value.userOptions.buttons.annotator,
         isAnnotation: $e.value,
@@ -1329,7 +1330,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
           ref_key: "svgRef",
           ref: ge,
           xmlns: b(po),
-          "aria-describedby": `chart-instructions-${I.value}`,
+          "aria-describedby": `chart-instructions-${R.value}`,
           viewBox: `0 0 ${n.value.chartWidth <= 0 ? 10 : n.value.chartWidth} ${n.value.chartHeight <= 0 ? 10 : n.value.chartHeight}`,
           class: ke({ "vue-data-ui-loading": b(fe) }),
           style: q(`max-width:100%;overflow:visible;background:transparent;color:${e.value.style.chart.color}`),
@@ -1352,7 +1353,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
             L(t.$slots, "chart-background", {}, void 0, !0)
           ], 8, Qo)) : f("", !0),
           e.value.style.chart.bars.gradient.show ? (s(), u("defs", jo, [
-            (s(!0), u(x, null, S(z.value, (a, o) => (s(), u("linearGradient", {
+            (s(!0), u(w, null, S(z.value, (a, o) => (s(), u("linearGradient", {
               id: `gradient_${a.id}`,
               x1: "0%",
               y1: "0%",
@@ -1387,7 +1388,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
             "stroke-linejoin": e.value.style.chart.grid.frame.strokeLinejoin,
             "stroke-dasharray": e.value.style.chart.grid.frame.strokeDasharray
           }, null, 8, os)) : f("", !0),
-          e.value.style.chart.grid.x.showHorizontalLines && e.value.orientation === "vertical" ? (s(!0), u(x, { key: 3 }, S(Y.value, (a, o) => (s(), u("line", {
+          e.value.style.chart.grid.x.showHorizontalLines && e.value.orientation === "vertical" ? (s(!0), u(w, { key: 3 }, S(Y.value, (a, o) => (s(), u("line", {
             x1: n.value.left,
             x2: n.value.right,
             y1: a.y,
@@ -1397,7 +1398,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
             "stroke-dasharray": e.value.style.chart.grid.x.linesStrokeDasharray,
             "stroke-linecap": "round"
           }, null, 8, ss))), 256)) : f("", !0),
-          e.value.style.chart.grid.x.showHorizontalLines && e.value.orientation === "horizontal" ? (s(!0), u(x, { key: 4 }, S(v.value.end - v.value.start + 1, (a, o) => (s(), u("line", {
+          e.value.style.chart.grid.x.showHorizontalLines && e.value.orientation === "horizontal" ? (s(!0), u(w, { key: 4 }, S(v.value.end - v.value.start + 1, (a, o) => (s(), u("line", {
             x1: n.value.left,
             x2: n.value.right,
             y1: n.value.top + m.value * o,
@@ -1407,7 +1408,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
             "stroke-dasharray": e.value.style.chart.grid.x.linesStrokeDasharray,
             "stroke-linecap": "round"
           }, null, 8, rs))), 256)) : f("", !0),
-          e.value.style.chart.grid.y.showVerticalLines && e.value.orientation === "vertical" ? (s(!0), u(x, { key: 5 }, S(v.value.end - v.value.start + 1, (a, o) => (s(), u("line", {
+          e.value.style.chart.grid.y.showVerticalLines && e.value.orientation === "vertical" ? (s(!0), u(w, { key: 5 }, S(v.value.end - v.value.start + 1, (a, o) => (s(), u("line", {
             x1: n.value.left + m.value * o,
             x2: n.value.left + m.value * o,
             y1: n.value.top,
@@ -1417,7 +1418,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
             "stroke-dasharray": e.value.style.chart.grid.y.linesStrokeDasharray,
             "stroke-linecap": "round"
           }, null, 8, ns))), 256)) : f("", !0),
-          e.value.style.chart.grid.y.showVerticalLines && e.value.orientation === "horizontal" ? (s(!0), u(x, { key: 6 }, S(Y.value, (a, o) => (s(), u("line", {
+          e.value.style.chart.grid.y.showVerticalLines && e.value.orientation === "horizontal" ? (s(!0), u(w, { key: 6 }, S(Y.value, (a, o) => (s(), u("line", {
             x1: a.horizontal_x,
             x2: a.horizontal_x,
             y1: n.value.top,
@@ -1427,12 +1428,12 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
             "stroke-dasharray": e.value.style.chart.grid.y.linesStrokeDasharray,
             "stroke-linecap": "round"
           }, null, 8, is))), 256)) : f("", !0),
-          (s(!0), u(x, null, S(z.value, (a, o) => (s(), u("g", null, [
+          (s(!0), u(w, null, S(z.value, (a, o) => (s(), u("g", null, [
             t.$slots.pattern ? (s(), u("defs", us, [
-              L(t.$slots, "pattern", De({ ref_for: !0 }, { seriesIndex: a.absoluteIndex, patternId: `pattern_${I.value}_${a.absoluteIndex}` }), void 0, !0)
+              L(t.$slots, "pattern", De({ ref_for: !0 }, { seriesIndex: a.absoluteIndex, patternId: `pattern_${R.value}_${a.absoluteIndex}` }), void 0, !0)
             ])) : f("", !0),
-            e.value.orientation === "vertical" ? (s(), u(x, { key: 1 }, [
-              (s(!0), u(x, null, S(a.x, (c, r) => (s(), u("rect", {
+            e.value.orientation === "vertical" ? (s(), u(w, { key: 1 }, [
+              (s(!0), u(w, null, S(a.x, (c, r) => (s(), u("rect", {
                 x: c,
                 y: b(de)(a.y[r]),
                 height: a.height[r] < 0 ? 1e-4 : a.height[r] || 0,
@@ -1446,13 +1447,13 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
                 class: ke({ "vue-data-ui-bar-animated": e.value.useCssAnimation, "vue-data-ui-bar-transition": ie.value })
               }, null, 10, cs))), 256)),
               t.$slots.pattern ? (s(), u("g", vs, [
-                (s(!0), u(x, null, S(a.x, (c, r) => (s(), u("rect", {
+                (s(!0), u(w, null, S(a.x, (c, r) => (s(), u("rect", {
                   x: c,
                   y: b(de)(a.y[r]),
                   height: a.height[r] < 0 ? 1e-4 : a.height[r] || 0,
                   rx: e.value.style.chart.bars.borderRadius > a.height[r] / 2 ? (a.height[r] < 0 ? 0 : a.height[r]) / 2 : e.value.style.chart.bars.borderRadius,
                   width: m.value * (1 - e.value.style.chart.bars.gapRatio / 2),
-                  fill: `url(#pattern_${I.value}_${a.absoluteIndex})`,
+                  fill: `url(#pattern_${R.value}_${a.absoluteIndex})`,
                   stroke: e.value.style.chart.backgroundColor,
                   "stroke-width": e.value.style.chart.bars.strokeWidth,
                   "stroke-linecap": "round",
@@ -1460,8 +1461,8 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
                   class: ke({ "vue-data-ui-bar-animated": e.value.useCssAnimation, "vue-data-ui-bar-transition": ie.value })
                 }, null, 10, hs))), 256))
               ])) : f("", !0)
-            ], 64)) : (s(), u(x, { key: 2 }, [
-              (s(!0), u(x, null, S(a.horizontal_x, (c, r) => (s(), u("rect", {
+            ], 64)) : (s(), u(w, { key: 2 }, [
+              (s(!0), u(w, null, S(a.horizontal_x, (c, r) => (s(), u("rect", {
                 x: b(de)(c, n.value.left),
                 y: a.horizontal_y[r] < 0 ? 0 : a.horizontal_y[r],
                 width: b(de)(a.horizontal_width[r] < 0 ? 1e-4 : a.horizontal_width[r]),
@@ -1475,13 +1476,13 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
                 class: ke({ "vue-data-ui-bar-animated": e.value.useCssAnimation, "vue-data-ui-bar-transition": ie.value })
               }, null, 10, ds))), 256)),
               t.$slots.pattern ? (s(), u("g", ys, [
-                (s(!0), u(x, null, S(a.horizontal_x, (c, r) => (s(), u("rect", {
+                (s(!0), u(w, null, S(a.horizontal_x, (c, r) => (s(), u("rect", {
                   x: b(de)(c, n.value.left),
                   y: a.horizontal_y[r] < 0 ? 0 : a.horizontal_y[r],
                   width: b(de)(a.horizontal_width[r] < 0 ? 1e-4 : a.horizontal_width[r]),
                   rx: e.value.style.chart.bars.borderRadius > a.height[r] / 2 ? (a.height[r] < 0 ? 0 : a.height[r]) / 2 : e.value.style.chart.bars.borderRadius,
                   height: m.value * (1 - e.value.style.chart.bars.gapRatio / 2),
-                  fill: `url(#pattern_${I.value}_${a.absoluteIndex})`,
+                  fill: `url(#pattern_${R.value}_${a.absoluteIndex})`,
                   stroke: e.value.style.chart.backgroundColor,
                   "stroke-width": e.value.style.chart.bars.strokeWidth,
                   "stroke-linecap": "round",
@@ -1534,9 +1535,9 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
             "font-weight": e.value.style.chart.grid.y.axisName.bold ? "bold" : "normal",
             "text-anchor": "middle"
           }, E(e.value.style.chart.grid.y.axisName.text), 9, ps)) : f("", !0),
-          A.value.dataLabels.show && e.value.orientation === "vertical" ? (s(), u(x, { key: 11 }, [
-            (s(!0), u(x, null, S(z.value, (a, o) => (s(), u("g", null, [
-              (s(!0), u(x, null, S(a.x, (c, r) => (s(), u(x, null, [
+          $.value.dataLabels.show && e.value.orientation === "vertical" ? (s(), u(w, { key: 11 }, [
+            (s(!0), u(w, null, S(z.value, (a, o) => (s(), u("g", null, [
+              (s(!0), u(w, null, S(a.x, (c, r) => (s(), u(w, null, [
                 ka(a.series[r], a.proportions[r]) ? (s(), u("text", {
                   key: 0,
                   x: c + m.value * (1 - e.value.style.chart.bars.gapRatio / 2) / 2,
@@ -1553,7 +1554,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
               ref_key: "sumTop",
               ref: rl
             }, [
-              (s(!0), u(x, null, S(ha.value, (a, o) => (s(), u(x, null, [
+              (s(!0), u(w, null, S(ha.value, (a, o) => (s(), u(w, null, [
                 !e.value.style.chart.bars.dataLabels.hideEmptyValues || a.value !== 0 ? (s(), u("text", {
                   key: 0,
                   x: n.value.left + m.value * o + m.value / 2,
@@ -1566,9 +1567,9 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
               ], 64))), 256))
             ], 512)) : f("", !0)
           ], 64)) : f("", !0),
-          A.value.dataLabels.show && e.value.orientation === "horizontal" ? (s(), u(x, { key: 12 }, [
-            (s(!0), u(x, null, S(z.value, (a, o) => (s(), u("g", null, [
-              (s(!0), u(x, null, S(a.horizontal_x, (c, r) => (s(), u(x, null, [
+          $.value.dataLabels.show && e.value.orientation === "horizontal" ? (s(), u(w, { key: 12 }, [
+            (s(!0), u(w, null, S(z.value, (a, o) => (s(), u("g", null, [
+              (s(!0), u(w, null, S(a.horizontal_x, (c, r) => (s(), u(w, null, [
                 ka(a.series[r], a.proportions[r]) ? (s(), u("text", {
                   key: 0,
                   x: c + (a.horizontal_width[r] < 0 ? 1e-4 : a.horizontal_width[r]) / 2,
@@ -1585,7 +1586,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
               ref_key: "sumRight",
               ref: rt
             }, [
-              (s(!0), u(x, null, S(ha.value, (a, o) => (s(), u(x, null, [
+              (s(!0), u(w, null, S(ha.value, (a, o) => (s(), u(w, null, [
                 !e.value.style.chart.bars.dataLabels.hideEmptyValues || a.value !== 0 ? (s(), u("text", {
                   key: 0,
                   x: Hl(o),
@@ -1603,7 +1604,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
             ref_key: "scaleLabels",
             ref: ue
           }, [
-            (s(!0), u(x, null, S(Y.value, (a, o) => (s(), u("line", {
+            (s(!0), u(w, null, S(Y.value, (a, o) => (s(), u("line", {
               x1: n.value.left,
               x2: n.value.left - 6,
               y1: a.y,
@@ -1611,7 +1612,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
               stroke: e.value.style.chart.grid.x.axisColor,
               "stroke-width": 1
             }, null, 8, Cs))), 256)),
-            (s(!0), u(x, null, S(Y.value, (a, o) => (s(), u("text", {
+            (s(!0), u(w, null, S(Y.value, (a, o) => (s(), u("text", {
               x: a.x,
               y: a.y + e.value.style.chart.grid.y.axisLabels.fontSize / 3,
               "font-size": e.value.style.chart.grid.y.axisLabels.fontSize,
@@ -1635,7 +1636,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
             ref_key: "scaleLabels",
             ref: ue
           }, [
-            (s(!0), u(x, null, S(Y.value, (a, o) => (s(), u("line", {
+            (s(!0), u(w, null, S(Y.value, (a, o) => (s(), u("line", {
               x1: a.horizontal_x,
               x2: a.horizontal_x,
               y1: n.value.bottom,
@@ -1644,7 +1645,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
               "stroke-width": 1,
               "stroke-linecap": "round"
             }, null, 8, zs))), 256)),
-            (s(!0), u(x, null, S(Y.value, (a, o) => (s(), u("text", {
+            (s(!0), u(w, null, S(Y.value, (a, o) => (s(), u("text", {
               class: "vue-data-ui-time-label",
               "font-size": e.value.style.chart.grid.x.timeLabels.fontSize,
               "font-weight": e.value.style.chart.grid.y.axisLabels.bold ? "bold" : "normal",
@@ -1669,7 +1670,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
             ref: ce
           }, [
             t.$slots["time-label"] ? (s(), u("g", _s, [
-              (s(!0), u(x, null, S(gt.value, (a, o) => (s(), u("g", null, [
+              (s(!0), u(w, null, S(gt.value, (a, o) => (s(), u("g", null, [
                 L(t.$slots, "time-label", De({ ref_for: !0 }, {
                   x: n.value.left + m.value * o + m.value / 2,
                   y: n.value.bottom + e.value.style.chart.grid.x.timeLabels.fontSize * 1.3 + e.value.style.chart.grid.x.timeLabels.offsetY,
@@ -1683,7 +1684,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
                 }), void 0, !0)
               ]))), 256))
             ])) : (s(), u("g", Ts, [
-              (s(!0), u(x, null, S(gt.value, (a, o) => (s(), u("g", null, [
+              (s(!0), u(w, null, S(gt.value, (a, o) => (s(), u("g", null, [
                 String(a.text).includes(`
 `) ? (s(), u("text", {
                   key: o + "-multi",
@@ -1726,7 +1727,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
             ref: ce
           }, [
             t.$slots["time-label"] ? (s(), u("g", Ps, [
-              (s(!0), u(x, null, S(R.value, (a, o) => (s(), u("g", null, [
+              (s(!0), u(w, null, S(O.value, (a, o) => (s(), u("g", null, [
                 L(t.$slots, "time-label", De({ ref_for: !0 }, {
                   x: n.value.left - 8,
                   y: n.value.top + m.value * o + m.value / 2 + e.value.style.chart.grid.y.axisLabels.fontSize / 3,
@@ -1740,7 +1741,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
                 }), void 0, !0)
               ]))), 256))
             ])) : (s(), u("g", Ns, [
-              (s(!0), u(x, null, S(R.value, (a, o) => (s(), u("g", null, [
+              (s(!0), u(w, null, S(O.value, (a, o) => (s(), u("g", null, [
                 String(a.text).includes(`
 `) ? (s(), u("text", {
                   key: 1,
@@ -1775,7 +1776,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
               ]))), 256))
             ]))
           ], 512)) : f("", !0),
-          A.value.showTooltip && e.value.orientation === "vertical" ? (s(!0), u(x, { key: 17 }, S(v.value.end - v.value.start, (a, o) => (s(), u("rect", {
+          $.value.showTooltip && e.value.orientation === "vertical" ? (s(!0), u(w, { key: 17 }, S(v.value.end - v.value.start, (a, o) => (s(), u("rect", {
             x: n.value.left + o * m.value,
             y: n.value.top,
             width: m.value,
@@ -1783,10 +1784,10 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
             onClick: () => bt(o),
             onMouseenter: () => xt(o, "pointer"),
             onMouseleave: () => ya(o),
-            fill: o === W.value || o === it.value ? e.value.style.chart.highlighter.color : "transparent",
+            fill: o === U.value || o === it.value ? e.value.style.chart.highlighter.color : "transparent",
             style: q({ opacity: e.value.style.chart.highlighter.opacity / 100 })
           }, null, 44, Rs))), 256)) : f("", !0),
-          A.value.showTooltip && e.value.orientation === "horizontal" ? (s(!0), u(x, { key: 18 }, S(v.value.end - v.value.start, (a, o) => (s(), u("rect", {
+          $.value.showTooltip && e.value.orientation === "horizontal" ? (s(!0), u(w, { key: 18 }, S(v.value.end - v.value.start, (a, o) => (s(), u("rect", {
             x: n.value.left,
             y: n.value.top + o * m.value,
             width: n.value.width < 0 ? 0 : n.value.width,
@@ -1794,7 +1795,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
             onClick: () => bt(o),
             onMouseenter: () => xt(o, "pointer"),
             onMouseleave: () => ya(o),
-            fill: o === W.value || o === it.value ? e.value.style.chart.highlighter.color : "transparent",
+            fill: o === U.value || o === it.value ? e.value.style.chart.highlighter.color : "transparent",
             style: q({ opacity: e.value.style.chart.highlighter.opacity / 100 })
           }, null, 44, Os))), 256)) : f("", !0),
           la.value ? (s(), u("rect", De({ key: 19 }, ml.value, {
@@ -1817,7 +1818,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
       t.$slots.watermark ? (s(), u("div", Vs, [
         L(t.$slots, "watermark", V(B({ isPrinting: b(ht) || b(dt) || Ve.value || Be.value })), void 0, !0)
       ])) : f("", !0),
-      e.value.style.chart.zoom.show && Le.value && Sa.value && N.value > 6 ? (s(), ee(Wo, {
+      e.value.style.chart.zoom.show && Le.value && Sa.value && I.value > 6 ? (s(), ee(Wo, {
         key: 5,
         ref_key: "chartSlicer",
         ref: Ce,
@@ -1836,8 +1837,8 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
         immediate: !e.value.style.chart.zoom.preview.enable,
         inputColor: e.value.style.chart.zoom.color,
         isPreview: la.value,
-        labelLeft: e.value.style.chart.grid.x.timeLabels.values[v.value.start] ? R.value?.[0]?.text ?? "" : "",
-        labelRight: e.value.style.chart.grid.x.timeLabels.values[v.value.end - 1] ? R.value?.at(-1)?.text ?? "" : "",
+        labelLeft: e.value.style.chart.grid.x.timeLabels.values[v.value.start] ? O.value?.[0]?.text ?? "" : "",
+        labelRight: e.value.style.chart.grid.x.timeLabels.values[v.value.end - 1] ? O.value?.at(-1)?.text ?? "" : "",
         max: Math.max(...tt.dataset.map((a) => a.series.length)),
         min: 0,
         minimap: ve.value,
@@ -1847,7 +1848,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
         minimapMerged: !1,
         minimapSelectedColor: e.value.style.chart.zoom.minimap.selectedColor,
         minimapSelectedColorOpacity: e.value.style.chart.zoom.minimap.selectedColorOpacity,
-        minimapSelectedIndex: W.value,
+        minimapSelectedIndex: U.value,
         minimapSelectionRadius: 1,
         preciseLabels: va.value.length ? va.value : be.value,
         refreshEndPoint: e.value.style.chart.zoom.endIndex !== null ? e.value.style.chart.zoom.endIndex + 1 : Math.max(...tt.dataset.map((a) => a.series.length)),
@@ -1882,15 +1883,15 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
           L(t.$slots, "reset-action", V(B({ reset: a })), void 0, !0)
         ]),
         slotMap: C(({ width: a, height: o, unitW: c }) => [
-          (s(!0), u(x, null, S(z.value, (r) => (s(), u("g", {
+          (s(!0), u(w, null, S(z.value, (r) => (s(), u("g", {
             key: r.id
           }, [
-            (s(!0), u(x, null, S(r.xMinimap({ left: 0, unitW: c }), (d, k) => (s(), u("rect", {
-              key: k,
-              x: k === 0 ? d - c * (e.value.style.chart.bars.gapRatio / 4) : d - c / 2,
-              y: Math.max(0, Math.min(o, r.yMinimap({ minimapH: o })[k])),
-              height: r.heightMinimap({ minimapH: o })[k],
-              width: [0, N.value - 1].includes(k) ? c * (1 - e.value.style.chart.bars.gapRatio / 2) / 2 : c * (1 - e.value.style.chart.bars.gapRatio / 2),
+            (s(!0), u(w, null, S(r.xMinimap({ left: 0, unitW: c }), (d, x) => (s(), u("rect", {
+              key: x,
+              x: x === 0 ? d - c * (e.value.style.chart.bars.gapRatio / 4) : d - c / 2,
+              y: Math.max(0, Math.min(o, r.yMinimap({ minimapH: o })[x])),
+              height: r.heightMinimap({ minimapH: o })[x],
+              width: [0, I.value - 1].includes(x) ? c * (1 - e.value.style.chart.bars.gapRatio / 2) / 2 : c * (1 - e.value.style.chart.bars.gapRatio / 2),
               fill: e.value.style.chart.bars.gradient.show ? `url(#gradient_${r.id})` : r.color,
               stroke: e.value.style.chart.backgroundColor,
               "stroke-width": 0.5,
@@ -1898,7 +1899,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
               "stroke-linecap": "round",
               "stroke-linejoin": "round",
               style: q({
-                opacity: k >= H.value.start && k <= H.value.end ? 1 : 0.62
+                opacity: x >= W.value.start && x <= W.value.end ? 1 : 0.62
               })
             }, null, 12, Bs))), 128))
           ]))), 128))
@@ -1907,7 +1908,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
       }, 8, ["allMinimaps", "background", "borderColor", "customFormat", "enableRangeHandles", "enableSelectionDrag", "end", "focusOnDrag", "focusRangeRatio", "fontSize", "immediate", "inputColor", "isPreview", "labelLeft", "labelRight", "max", "minimap", "minimapCompact", "minimapFrameColor", "minimapIndicatorColor", "minimapSelectedColor", "minimapSelectedColorOpacity", "minimapSelectedIndex", "preciseLabels", "refreshEndPoint", "refreshStartPoint", "selectColor", "selectedSeries", "start", "textColor", "timeLabels", "usePreciseLabels", "valueEnd", "valueStart", "verticalHandles", "maxWidth", "isCursorPointer", "additionalMinimapHeight", "handleType", "handleIconColor", "handleBorderWidth", "handleBorderColor", "handleFill", "handleWidth"])) : f("", !0),
       Oe(b(Ya), {
         teleportTo: e.value.style.chart.tooltip.teleportTo,
-        show: A.value.showTooltip && ye.value,
+        show: $.value.showTooltip && ye.value,
         backgroundColor: e.value.style.chart.tooltip.backgroundColor,
         color: e.value.style.chart.tooltip.color,
         fontSize: e.value.style.chart.tooltip.fontSize,
@@ -1937,11 +1938,11 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
         _: 3
       }, 8, ["teleportTo", "show", "backgroundColor", "color", "fontSize", "borderRadius", "borderColor", "borderWidth", "backgroundOpacity", "position", "offsetY", "parent", "content", "isFullscreen", "isCustom", "smooth", "backdropFilter", "smoothForce", "smoothSnapThreshold", "isA11yMode", "a11yPosition"]),
       Z("div", {
-        id: `legend-bottom-${I.value}`
+        id: `legend-bottom-${R.value}`
       }, null, 8, Us),
       Dt.value ? (s(), ee(co, {
         key: 6,
-        to: e.value.style.chart.legend.position === "top" ? `#legend-top-${I.value}` : `#legend-bottom-${I.value}`
+        to: e.value.style.chart.legend.position === "top" ? `#legend-top-${R.value}` : `#legend-bottom-${R.value}`
       }, [
         Z("div", {
           ref_key: "chartLegend",
@@ -1958,7 +1959,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
               b(fe) ? f("", !0) : (s(), u("div", {
                 key: 0,
                 onClick: (o) => a.segregate(),
-                style: q(`opacity:${T.value.includes(a.id) ? 0.5 : 1}`)
+                style: q(`opacity:${A.value.includes(a.id) ? 0.5 : 1}`)
               }, E(a.name), 13, Hs))
             ]),
             legendToggle: C(() => [
@@ -1967,7 +1968,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
                 backgroundColor: e.value.style.chart.legend.selectAllToggle.backgroundColor,
                 color: e.value.style.chart.legend.selectAllToggle.color,
                 fontSize: e.value.style.chart.legend.fontSize,
-                checked: T.value.length > 0,
+                checked: A.value.length > 0,
                 isCursorPointer: X.value,
                 onToggle: Ml
               }, null, 8, ["backgroundColor", "color", "fontSize", "checked", "isCursorPointer"])) : f("", !0)
@@ -1982,7 +1983,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
                   radius: 30,
                   stroke: "none",
                   plot: { x: 30, y: 30 },
-                  fill: `url(#pattern_${I.value}_${o})`
+                  fill: `url(#pattern_${R.value}_${o})`
                 }, null, 8, ["shape", "fill"])
               ]),
               key: "0"
@@ -2063,7 +2064,7 @@ const qo = ["id"], Go = ["id"], Jo = ["id"], Ko = { style: { position: "relative
       ], !0)
     ], 46, qo));
   }
-}, gr = /* @__PURE__ */ Yo(Xs, [["__scopeId", "data-v-6cbfc0f3"]]);
+}, gr = /* @__PURE__ */ Yo(Xs, [["__scopeId", "data-v-c875bbb3"]]);
 export {
   gr as default
 };