vue-data-ui 3.3.1 → 3.3.2

package/dist/{vue-ui-heatmap-RHDxexNf.js → vue-ui-heatmap-D6n8AnCc.js}

@@ -1,5 +1,5 @@
-import { useCssVars as Jt, defineAsyncComponent as Q, computed as y, ref as d, shallowRef as Qt, toRefs as Zt, watch as we, onBeforeUnmount as dt, onMounted as el, watchEffect as Xe, reactive as ht, nextTick as Ie, createElementBlock as n, openBlock as u, normalizeStyle as w, normalizeClass as ce, createBlock as de, createCommentVNode as f, createElementVNode as p, createVNode as ke, unref as i, createSlots as yt, withCtx as z, renderSlot as L, normalizeProps as Z, guardReactiveProps as ee, Fragment as C, renderList as F, withDirectives as ft, createTextVNode as Ve, toDisplayString as T, vShow as tl, resolveDynamicComponent as ll, mergeProps as al, withKeys as ol } from "vue";
-import { c as Be, t as sl, B as ul, o as pt, f as gt, a0 as he, g as il, X as nl, E as Ae, a as B, d as H, q as E, ai as rl, x as vl, y as cl, z as dl, A as hl } from "./lib-CEjkWSLj.js";
+import { useCssVars as Jt, defineAsyncComponent as Q, computed as y, ref as d, shallowRef as Qt, toRefs as Zt, watch as we, onBeforeUnmount as dt, onMounted as el, reactive as ht, nextTick as Xe, createElementBlock as n, openBlock as u, normalizeStyle as w, normalizeClass as ce, createBlock as de, createCommentVNode as f, createElementVNode as p, createVNode as ke, unref as i, createSlots as yt, withCtx as z, renderSlot as L, normalizeProps as Z, guardReactiveProps as ee, Fragment as C, renderList as F, withDirectives as ft, createTextVNode as Ie, toDisplayString as T, vShow as tl, resolveDynamicComponent as ll, mergeProps as al, withKeys as ol } from "vue";
+import { c as Ve, t as sl, B as ul, o as pt, f as gt, a0 as he, g as il, X as nl, E as Ae, a as B, d as H, q as E, ai as rl, x as vl, y as cl, z as dl, A as hl } from "./lib-CEjkWSLj.js";
 import { t as Ce, u as yl } from "./useResponsive-DfdjqQps.js";
 import { u as fl, a as bt } from "./useNestedProp-Ce3PwN8T.js";
 import { u as pl } from "./usePrinter-DJ1iH-F_.js";
@@ -8,7 +8,7 @@ import { u as ml } from "./useSvgExport-DrjCWun4.js";
 import { u as mt } from "./useTimeLabels-BGFjWgrv.js";
 import { u as xl } from "./useTableResponsive-Cbx-ACcP.js";
 import { u as wl } from "./useUserOptionState-BIvW1Kz7.js";
-import { u as xt } from "./useTimeLabelCollider-CIsgDrl9.js";
+import { u as Be, a as xt } from "./useResizeObserverEffect-DfnWps4W.js";
 import { u as kl } from "./useChartAccessibility-9icAAmYg.js";
 import Al from "./img-J2dLIr8Y.js";
 import Cl from "./Title-Camz1Lce.js";
@@ -28,7 +28,7 @@ function wt(b, {
   cellHeight: ye,
   maxFontSize: W,
   minFontSize: te,
-  index: O,
+  index: M,
   reportRotation: le,
   reportHide: X,
   rotateAll: Le,
@@ -39,26 +39,26 @@ function wt(b, {
   b.setAttribute("font-size", W);
   const j = b.getComputedTextLength();
   if (j <= P)
-    le(O, !1), X(O, !1);
+    le(M, !1), X(M, !1);
   else {
-    const M = Math.floor(W * P / j);
-    M >= te ? (b.setAttribute("font-size", M), le(O, !1), X(O, !1)) : (le(O, !0), X(O, !1), k = !0);
+    const O = Math.floor(W * P / j);
+    O >= te ? (b.setAttribute("font-size", O), le(M, !1), X(M, !1)) : (le(M, !0), X(M, !1), k = !0);
   }
   if (Le && (k = !0), k) {
     b.setAttribute("font-size", W);
-    const M = b.getBBox(), S = M.x + M.width / 2, ae = M.y + M.height / 2;
+    const O = b.getBBox(), S = O.x + O.width / 2, ae = O.y + O.height / 2;
     b.setAttribute("transform", `rotate(-90 ${S} ${ae})`);
     const q = b.getBBox().width;
     if (q <= ye)
-      X(O, !1);
+      X(M, !1);
     else {
       const oe = Math.floor(W * ye / q);
-      oe >= te ? (b.setAttribute("font-size", oe), X(O, !1)) : (fe = !0, X(O, !0));
+      oe >= te ? (b.setAttribute("font-size", oe), X(M, !1)) : (fe = !0, X(M, !0));
     }
   }
   (Te || fe) && b.setAttribute("visibility", "hidden");
 }
-const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"], Ml = ["x", "y", "height", "width", "fill", "stroke", "stroke-width"], Rl = ["x", "y", "height", "width", "fill", "stroke", "stroke-width"], Fl = ["x", "y", "width", "height", "fill", "stroke", "stroke-width"], Dl = ["x", "y", "width", "height", "fill", "stroke", "stroke-width", "onMouseover", "onMouseout", "onClick"], Nl = ["font-size", "font-weight", "fill", "x", "y"], Hl = ["x", "y", "width", "height", "fill", "stroke", "stroke-width"], Pl = ["x", "y", "width", "height", "fill", "stroke", "stroke-width"], Xl = ["font-size", "fill", "x", "y", "font-weight"], Il = ["font-size", "fill", "x", "y", "font-weight"], Vl = ["text-anchor", "font-size", "fill", "font-weight", "transform"], Bl = ["text-anchor", "font-size", "fill", "font-weight", "transform"], El = { key: 6 }, Ul = ["x", "y", "width", "height", "stroke", "stroke-width"], Yl = { class: "vue-ui-heatmap-legend-gauge-right" }, Gl = ["data-value"], Wl = { class: "vue-ui-heatmap-gauge-indicator-value" }, jl = {
+const zl = ["id"], $l = ["xmlns", "viewBox"], Ml = ["x", "y", "width", "height"], Ol = ["x", "y", "height", "width", "fill", "stroke", "stroke-width"], Rl = ["x", "y", "height", "width", "fill", "stroke", "stroke-width"], Fl = ["x", "y", "width", "height", "fill", "stroke", "stroke-width"], Dl = ["x", "y", "width", "height", "fill", "stroke", "stroke-width", "onMouseover", "onMouseout", "onClick"], Nl = ["font-size", "font-weight", "fill", "x", "y"], Hl = ["x", "y", "width", "height", "fill", "stroke", "stroke-width"], Pl = ["x", "y", "width", "height", "fill", "stroke", "stroke-width"], Xl = ["font-size", "fill", "x", "y", "font-weight"], Il = ["font-size", "fill", "x", "y", "font-weight"], Vl = ["text-anchor", "font-size", "fill", "font-weight", "transform"], Bl = ["text-anchor", "font-size", "fill", "font-weight", "transform"], El = { key: 6 }, Ul = ["x", "y", "width", "height", "stroke", "stroke-width"], Yl = { class: "vue-ui-heatmap-legend-gauge-right" }, Gl = ["data-value"], Wl = { class: "vue-ui-heatmap-gauge-indicator-value" }, jl = {
   key: 4,
   class: "vue-data-ui-watermark"
 }, ql = { class: "vue-ui-data-table" }, Kl = { key: 0 }, Jl = ["data-cell"], Ql = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Zl = ["data-cell"], ea = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, ta = {
@@ -80,28 +80,28 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
   emits: ["selectDatapoint"],
   setup(b, { expose: P, emit: ye }) {
     Jt((t) => ({
-      v0640d7e7: t.tdo
+      v7e341d2a: t.tdo
     }));
-    const W = Q(() => import("./Tooltip-VOcQEHa4.js")), te = Q(() => import("./BaseIcon-eZbszQrv.js")), O = Q(() => import("./PenAndPaper-Bo-lMUik.js")), le = Q(() => import("./UserOptions-CSja1SGU.js")), X = Q(() => import("./PackageVersion-BfykJm_B.js")), Le = Q(() => import("./BaseDraggableDialog-CVGErydD.js")), { vue_ui_heatmap: Te } = fl(), k = b, fe = ye, j = y({
+    const W = Q(() => import("./Tooltip-VOcQEHa4.js")), te = Q(() => import("./BaseIcon-eZbszQrv.js")), M = Q(() => import("./PenAndPaper-Bo-lMUik.js")), le = Q(() => import("./UserOptions-CSja1SGU.js")), X = Q(() => import("./PackageVersion-r-Q1R3nV.js")), Le = Q(() => import("./BaseDraggableDialog-CVGErydD.js")), { vue_ui_heatmap: Te } = fl(), k = b, fe = ye, j = y({
       get() {
         return !!k.dataset && k.dataset.length;
       },
       set(t) {
         return t;
       }
-    }), M = d(Be()), S = d(null), ae = d(!1), q = d(""), oe = d(void 0), se = d(null), Ee = d(0), Ue = d(null), Ye = d(0), kt = d(null), ue = d(null), Se = d(null), Ge = d(null), We = d(null), At = d(null), je = d(null), Ct = d(null), _e = d(null), ze = d(null), Lt = d(null), qe = d(null), K = Qt(null), e = d(Re());
+    }), O = d(Ve()), S = d(null), ae = d(!1), q = d(""), oe = d(void 0), se = d(null), Ee = d(0), Ue = d(null), Ye = d(0), kt = d(null), ue = d(null), Se = d(null), Ge = d(null), We = d(null), At = d(null), je = d(null), Ct = d(null), _e = d(null), ze = d(null), Lt = d(null), qe = d(null), K = Qt(null), e = d(Re());
     function Tt() {
-      const t = Array(7).fill("_"), o = [], a = 14, s = t.length;
-      for (let v = 0; v < s; v += 1) {
+      const t = Array(7).fill("_"), s = [], a = 14, o = t.length;
+      for (let v = 0; v < o; v += 1) {
         const c = [];
         for (let x = 0; x < a; x += 1)
           c.push(v + x * 2);
-        o.push({
+        s.push({
           name: `${t[v]}`,
           values: c
         });
       }
-      return o;
+      return s;
     }
     const { loading: pe, FINAL_DATASET: m, manualLoading: $e } = gl({
       ...Zt(k),
@@ -109,7 +109,7 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
       prepareConfig: Re,
       callback: () => {
         Promise.resolve().then(async () => {
-          await Ie(), S.value && rl(S.value);
+          await Xe(), S.value && rl(S.value, { delta: 0.1, delay: 250 });
         });
       },
       skeletonDataset: Tt(),
@@ -138,7 +138,7 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
           }
         }
       })
-    }), { userOptionsVisible: Oe, setUserOptionsVisibility: St, keepUserOptionState: Ke } = wl({ config: e.value }), { svgRef: Me } = kl({ config: e.value.style.title });
+    }), { userOptionsVisible: Me, setUserOptionsVisibility: St, keepUserOptionState: Ke } = wl({ config: e.value }), { svgRef: Oe } = kl({ config: e.value.style.title });
     function Je(t) {
       St(t);
     }
@@ -147,21 +147,21 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
         userConfig: k.config,
         defaultConfig: Te
       });
-      let o = {};
-      return t.theme ? o = {
+      let s = {};
+      return t.theme ? s = {
         ...bt({
           userConfig: Ll.vue_ui_heatmap[t.theme] || k.config,
           defaultConfig: t
         })
-      } : o = t, k.config && ul(k.config, "style.layout.dataLabels.xAxis.showOnlyAtModulo") ? o.style.layout.dataLabels.xAxis.showOnlyAtModulo = k.config.style.layout.dataLabels.xAxis.showOnlyAtModulo : o.style.layout.dataLabels.xAxis.showOnlyAtModulo = null, o;
+      } : s = t, k.config && ul(k.config, "style.layout.dataLabels.xAxis.showOnlyAtModulo") ? s.style.layout.dataLabels.xAxis.showOnlyAtModulo = k.config.style.layout.dataLabels.xAxis.showOnlyAtModulo : s.style.layout.dataLabels.xAxis.showOnlyAtModulo = null, s;
     }
     we(() => k.config, (t) => {
-      pe.value || (e.value = Re()), Oe.value = !e.value.userOptions.showOnChartHover, Fe(), Ye.value += 1, $.value.showTable = e.value.table.show, $.value.showTooltip = e.value.style.tooltip.show, ie.value = e.value.style.layout.width, ne.value = e.value.style.layout.height;
+      pe.value || (e.value = Re()), Me.value = !e.value.userOptions.showOnChartHover, Fe(), Ye.value += 1, $.value.showTable = e.value.table.show, $.value.showTooltip = e.value.style.tooltip.show, ie.value = e.value.style.layout.width, ne.value = e.value.style.layout.height;
     }, { deep: !0 }), we(() => k.dataset, (t) => {
       Array.isArray(t) && t.length > 0 && ($e.value = !1), Fe();
     }, { deep: !0 });
     const { isPrinting: Qe, isImaging: Ze, generatePdf: et, generateImage: tt } = pl({
-      elementId: `heatmap__${M.value}`,
+      elementId: `heatmap__${O.value}`,
       fileName: e.value.style.title.text || "vue-ui-heatmap",
       options: e.value.userOptions.print
     }), _t = y(() => e.value.userOptions.show && !e.value.style.title.text), $ = d({
@@ -182,7 +182,7 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
         debug: lt.value
       }), j.value = !1, $e.value = !0), pt(k.dataset) || ($e.value = e.value.loading), e.value.responsive) {
         const t = Ce(() => {
-          const { width: o, height: a } = yl({
+          const { width: s, height: a } = yl({
             chart: S.value,
             title: e.value.style.title.text ? Ge.value : null,
             // add legend hirizontal in legend attr
@@ -191,7 +191,7 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
             noTitle: We.value
           });
           requestAnimationFrame(() => {
-            ie.value = o, ne.value = a;
+            ie.value = s, ne.value = a;
           });
         });
         I.value && (K.value && I.value.unobserve(K.value), I.value.disconnect()), I.value = new ResizeObserver(t), K.value = S.value.parentNode, I.value.observe(K.value);
@@ -208,62 +208,41 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
     })), re = d(0), $t = Ce((t) => {
       re.value = t;
     }, 100);
-    Xe((t) => {
-      const o = _e.value;
-      if (!o) return;
-      const a = new ResizeObserver((s) => {
-        $t(s[0].contentRect.height);
-      });
-      a.observe(o), t(() => a.disconnect());
-    });
-    const J = d(0), Ot = Ce((t) => {
+    Be({ elementRef: _e, callback: $t, attr: "height" });
+    const J = d(0), Mt = Ce((t) => {
       J.value = t;
     }, 100);
-    Xe((t) => {
-      const o = je.value;
-      if (!o) return;
-      const a = new ResizeObserver((s) => {
-        Ot(s[0].contentRect.width);
-      });
-      a.observe(o), t(() => a.disconnect());
-    });
-    const ge = d(0), Mt = Ce((t) => {
+    Be({ elementRef: je, callback: Mt, attr: "width" });
+    const ge = d(0), Ot = Ce((t) => {
       ge.value = t;
     }, 100);
-    Xe((t) => {
-      const o = ze.value;
-      if (!o) return;
-      const a = new ResizeObserver((s) => {
-        Mt(s[0].contentRect.height);
-      });
-      a.observe(o), t(() => a.disconnect());
-    }), dt(() => {
+    Be({ elementRef: ze, callback: Ot, attr: "height" }), dt(() => {
       re.value = 0, J.value = 0, ge.value = 0;
     });
     const r = y(() => Math.min(_.value.height, _.value.width) / 1e3 * e.value.style.layout.cells.spacing), l = y(() => {
       let t = 0;
       e.value.style.legend.show && (t = e.value.style.legend.width);
-      const o = e.value.style.layout.padding, a = e.value.style.layout.dataLabels.xAxis.fontSize / 3, s = e.value.style.layout.dataLabels.xAxis.fontSize / 2, v = _.value.height - o.top - o.bottom - re.value - a, c = _.value.width / 60, x = {
+      const s = e.value.style.layout.padding, a = e.value.style.layout.dataLabels.xAxis.fontSize / 3, o = e.value.style.layout.dataLabels.xAxis.fontSize / 2, v = _.value.height - s.top - s.bottom - re.value - a, c = _.value.width / 60, x = {
         x: r.value * D.value,
         y: r.value * ((m.value || []).length + 1)
-      }, N = _.value.width - o.left - o.right - x.x - c * 2 - 2 - t - J.value, h = v - c - x.y - ge.value - s - e.value.style.layout.cells.columnTotal.value.offsetY, A = {
+      }, N = _.value.width - s.left - s.right - x.x - c * 2 - 2 - t - J.value, h = v - c - x.y - ge.value - o - e.value.style.layout.cells.columnTotal.value.offsetY, A = {
         width: Math.max(3, N / D.value),
         height: Math.max(3, h / (m.value.length ?? 1))
       };
       return {
-        top: o.top + re.value + c + a,
+        top: s.top + re.value + c + a,
         topLabelsHeight: re.value,
         sumCellXHeight: c,
         height: h,
-        left: o.left + J.value + c / 2,
-        right: o.right - t,
-        bottom: _.value.height - o.bottom - ge.value,
+        left: s.left + J.value + c / 2,
+        right: s.right - t,
+        bottom: _.value.height - s.bottom - ge.value,
         width: N,
         cellSize: A
       };
     }), V = y(() => Math.max(...m.value.flatMap((t) => t.values))), ve = y(() => Math.min(...m.value.flatMap((t) => t.values))), U = y(() => {
       const t = m.value.flatMap((a) => a.values);
-      return t.reduce((a, s) => a + s, 0) / t.length;
+      return t.reduce((a, o) => a + o, 0) / t.length;
     }), Rt = y(() => mt({
       values: e.value.style.layout.dataLabels.yAxis.values.length ? e.value.style.layout.dataLabels.yAxis.values : m.value.map((t) => t.name),
       maxDatapoints: m.value.length,
@@ -277,17 +256,17 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
       start: 0,
       end: D.value
     })), g = y(() => {
-      const t = Rt.value.map((h) => h.text), o = Ft.value.map((h) => h.text), a = m.value.map((h) => h.values.reduce((A, Pe) => A + Pe, 0)), s = Math.max(...a), v = Math.min(...a), c = [];
+      const t = Rt.value.map((h) => h.text), s = Ft.value.map((h) => h.text), a = m.value.map((h) => h.values.reduce((A, Pe) => A + Pe, 0)), o = Math.max(...a), v = Math.min(...a), c = [];
       for (let h = 0; h < D.value; h += 1)
         c.push(m.value.map((A) => A.values[h] || 0).reduce((A, Pe) => A + Pe, 0));
       const x = Math.max(...c), N = Math.min(...c);
       return {
         yTotals: a.map((h) => {
-          const A = isNaN(h / s) ? 0 : h / s;
+          const A = isNaN(h / o) ? 0 : h / o;
           return {
             total: h,
             proportion: A,
-            color: he(e.value.style.layout.cells.colors.cold, e.value.style.layout.cells.colors.hot, v, s, h)
+            color: he(e.value.style.layout.cells.colors.cold, e.value.style.layout.cells.colors.hot, v, o, h)
           };
         }),
         xTotals: c.map((h) => {
@@ -299,9 +278,9 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
           };
         }),
         yLabels: t,
-        xLabels: o.slice(0, D.value)
+        xLabels: s.slice(0, D.value)
       };
-    }), Y = y(() => (m.value.forEach((t, o) => {
+    }), Y = y(() => (m.value.forEach((t, s) => {
       il({
         datasetObject: t,
         requiredAttributes: ["values"]
@@ -310,44 +289,44 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
           componentName: "VueUiHeatmap",
           type: "datasetSerieAttribute",
           property: "values",
-          index: o,
+          index: s,
           debug: lt.value
         });
       });
-    }), m.value.map((t, o) => ({
+    }), m.value.map((t, s) => ({
       ...t,
-      temperatures: (t.values || []).map((a, s) => a >= U.value ? {
+      temperatures: (t.values || []).map((a, o) => a >= U.value ? {
         side: "up",
         color: he(e.value.style.layout.cells.colors.cold, e.value.style.layout.cells.colors.hot, ve.value, V.value, a),
         ratio: Math.abs(Math.abs(a - U.value) / Math.abs(V.value - U.value)) > 1 ? 1 : Math.abs(Math.abs(a - U.value) / Math.abs(V.value - U.value)),
         value: a,
-        yAxisName: g.value.yLabels[o],
-        xAxisName: g.value.xLabels[s],
-        id: `vue-data-ui-heatmap-cell-${Be()}`
+        yAxisName: g.value.yLabels[s],
+        xAxisName: g.value.xLabels[o],
+        id: `vue-data-ui-heatmap-cell-${Ve()}`
       } : {
         side: "down",
         ratio: Math.abs(1 - Math.abs(a) / Math.abs(U.value)) > 1 ? 1 : Math.abs(1 - Math.abs(a) / Math.abs(U.value)),
         color: he(e.value.style.layout.cells.colors.cold, e.value.style.layout.cells.colors.hot, ve.value, V.value, a),
         value: a,
-        yAxisName: g.value.yLabels[o],
-        xAxisName: g.value.xLabels[s],
-        id: `vue-data-ui-heatmap-cell-${Be()}`
+        yAxisName: g.value.yLabels[s],
+        xAxisName: g.value.xLabels[o],
+        id: `vue-data-ui-heatmap-cell-${Ve()}`
       })
     })))), at = y(() => m.value.length), ot = ht(Array(at.value * D.value || 1).fill(!1)), Dt = y(() => ot.some((t) => t));
-    function Nt(t, o) {
-      ot[t] = o;
+    function Nt(t, s) {
+      ot[t] = s;
     }
     const st = ht(Array(at.value * D.value || 1).fill(!1)), Ht = y(() => st.some((t) => t));
-    function Pt(t, o) {
-      st[t] = o;
+    function Pt(t, s) {
+      st[t] = s;
     }
     const R = d(null), be = d(null);
-    function Xt(t, o, a, s) {
-      e.value.events.datapointEnter && e.value.events.datapointEnter({ datapoint: t, seriesIndex: o }), se.value = { x: a, y: s };
+    function Xt(t, s, a, o) {
+      e.value.events.datapointEnter && e.value.events.datapointEnter({ datapoint: t, seriesIndex: s }), se.value = { x: a, y: o };
       const { value: v, yAxisName: c, xAxisName: x, id: N } = t;
       oe.value = N, R.value = v, be.value = {
         datapoint: t,
-        seriesIndex: o,
+        seriesIndex: s,
         series: Y.value,
         config: e.value
       }, ae.value = !0;
@@ -355,12 +334,12 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
       const A = e.value.style.tooltip.customFormat;
       dl(A) && hl(() => A({
         datapoint: t,
-        seriesIndex: o,
+        seriesIndex: s,
         series: Y.value,
         config: e.value
       })) ? q.value = A({
         datapoint: t,
-        seriesIndex: o,
+        seriesIndex: s,
         series: Y.value,
         config: e.value
       }) : (h += `<div>${c} ${x ? c ? ` - ${x}` : `${x}` : ""}</div>`, h += `<div style="margin-top:6px;padding-top:6px;border-top:1px solid ${e.value.style.tooltip.borderColor};font-weight:bold;display:flex;flex-direction:row;gap:12px;align-items:center;justify-content:center"><span style="color:${he(e.value.style.layout.cells.colors.cold, e.value.style.layout.cells.colors.hot, ve.value, V.value, v)}">⬤</span><span>${isNaN(v) ? "-" : B(
@@ -372,11 +351,11 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
           s: e.value.style.layout.dataLabels.suffix,
           r: e.value.style.tooltip.roundingValue
         }),
-        { datapoint: t, seriesIndex: o }
+        { datapoint: t, seriesIndex: s }
       )}</span></div>`, q.value = `<div style="font-size:${e.value.style.tooltip.fontSize}px">${h}</div>`);
     }
-    function It({ datapoint: t, seriesIndex: o }) {
-      e.value.events.datapointLeave && e.value.events.datapointLeave({ datapoint: t, seriesIndex: o }), ae.value = !1, oe.value = void 0, R.value = null, se.value = null;
+    function It({ datapoint: t, seriesIndex: s }) {
+      e.value.events.datapointLeave && e.value.events.datapointLeave({ datapoint: t, seriesIndex: s }), ae.value = !1, oe.value = void 0, R.value = null, se.value = null;
     }
     function Vt(t) {
       return B(
@@ -407,19 +386,19 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
     y(() => {
       const t = m.value.map((a) => ({
         name: a.name
-      })), o = m.value.map((a) => a.values);
-      return { head: t, body: o };
+      })), s = m.value.map((a) => a.values);
+      return { head: t, body: s };
     });
     function De(t = null) {
-      Ie(() => {
-        const o = ["", ...m.value.map((c, x) => c.name)], a = [];
+      Xe(() => {
+        const s = ["", ...m.value.map((c, x) => c.name)], a = [];
         for (let c = 0; c < g.value.xLabels.length; c += 1) {
           const x = [g.value.xLabels[c]];
           for (let N = 0; N < m.value.length; N += 1)
             x.push([m.value[N].values[c]]);
           a.push(x);
         }
-        const s = [[e.value.style.title.text], [e.value.style.title.subtitle.text], [[""], [""], [""]]].concat([o]).concat(a), v = vl(s);
+        const o = [[e.value.style.title.text], [e.value.style.title.subtitle.text], [[""], [""], [""]]].concat([s]).concat(a), v = vl(o);
         t ? t(v) : cl({ csvContent: v, title: e.value.style.title.text || "vue-ui-heatmap" });
       });
     }
@@ -437,22 +416,22 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
     function Ne() {
       me.value = !me.value;
     }
-    function Et(t, o) {
-      e.value.events.datapointClick && e.value.events.datapointClick({ datapoint: t, seriesIndex: o }), fe("selectDatapoint", t);
+    function Et(t, s) {
+      e.value.events.datapointClick && e.value.events.datapointClick({ datapoint: t, seriesIndex: s }), fe("selectDatapoint", t);
     }
     function Ut() {
       return Y.value;
     }
     async function Yt({ scale: t = 2 } = {}) {
       if (!S.value) return;
-      const { width: o, height: a } = S.value.getBoundingClientRect(), s = o / a, { imageUri: v, base64: c } = await Al({ domElement: S.value, base64: !0, img: !0, scale: t });
+      const { width: s, height: a } = S.value.getBoundingClientRect(), o = s / a, { imageUri: v, base64: c } = await Al({ domElement: S.value, base64: !0, img: !0, scale: t });
       return {
         imageUri: v,
         base64: c,
         title: e.value.style.title.text,
-        width: o,
+        width: s,
         height: a,
-        aspectRatio: s
+        aspectRatio: o
       };
     }
     const rt = y(() => ({
@@ -485,7 +464,7 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
       height: ne
     });
     const xe = y(() => {
-      const t = e.value.table.useDialog && !e.value.table.show, o = $.value.showTable;
+      const t = e.value.table.useDialog && !e.value.table.show, s = $.value.showTable;
       return {
         component: t ? Le : Tl,
         title: `${e.value.style.title.text}${e.value.style.title.subtitle.text ? `: ${e.value.style.title.subtitle.text}` : ""}`,
@@ -500,7 +479,7 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
         } : {
           hideDetails: !0,
           config: {
-            open: o,
+            open: s,
             maxHeight: 1e4,
             body: {
               backgroundColor: e.value.style.backgroundColor,
@@ -515,21 +494,21 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
       };
     });
     we(() => $.value.showTable, async (t) => {
-      e.value.table.show || (t && e.value.table.useDialog && ue.value ? (await Ie(), ue.value.open()) : "close" in ue.value && ue.value.close());
+      e.value.table.show || (t && e.value.table.useDialog && ue.value ? (await Xe(), ue.value.open()) : "close" in ue.value && ue.value.close());
     });
     const { isResponsive: Gt } = xl(Ue, zt);
     function He() {
       $.value.showTable = !1, Se.value && Se.value.setTableIconState(!1);
     }
     const Wt = y(() => e.value.style.backgroundColor), jt = y(() => e.value.style.title), { exportSvg: qt, getSvg: Kt } = ml({
-      svg: Me,
+      svg: Oe,
       title: jt,
       backgroundColor: Wt
     });
     async function ct({ isCb: t }) {
       if (t) {
-        const { blob: o, url: a, text: s, dataUrl: v } = await Kt();
-        e.value.userOptions.callbacks.svg({ blob: o, url: a, text: s, dataUrl: v });
+        const { blob: s, url: a, text: o, dataUrl: v } = await Kt();
+        e.value.userOptions.callbacks.svg({ blob: s, url: a, text: o, dataUrl: v });
       } else
         qt();
     }
@@ -544,18 +523,18 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
       toggleTooltip: nt,
       toggleAnnotator: Ne,
       toggleFullscreen: ut
-    }), (t, o) => (u(), n("div", {
+    }), (t, s) => (u(), n("div", {
       ref_key: "heatmapChart",
       ref: S,
       class: ce(`vue-data-ui-component vue-ui-heatmap ${G.value ? "vue-data-ui-wrapper-fullscreen" : ""}`),
       style: w(`font-family:${e.value.style.fontFamily};width:100%;${e.value.responsive ? "height: 100%;" : ""} text-align:center;background:${e.value.style.backgroundColor}`),
-      id: `heatmap__${M.value}`,
-      onMouseenter: o[1] || (o[1] = () => Je(!0)),
-      onMouseleave: o[2] || (o[2] = () => Je(!1))
+      id: `heatmap__${O.value}`,
+      onMouseenter: s[1] || (s[1] = () => Je(!0)),
+      onMouseleave: s[2] || (s[2] = () => Je(!1))
     }, [
-      e.value.userOptions.buttons.annotator ? (u(), de(i(O), {
+      e.value.userOptions.buttons.annotator ? (u(), de(i(M), {
         key: 0,
-        svgRef: i(Me),
+        svgRef: i(Oe),
         backgroundColor: e.value.style.backgroundColor,
         color: e.value.style.color,
         active: me.value,
@@ -588,7 +567,7 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
           }
         }, null, 8, ["config"]))
       ], 512)) : f("", !0),
-      e.value.userOptions.show && j.value && (i(Ke) || i(Oe)) ? (u(), de(i(le), {
+      e.value.userOptions.show && j.value && (i(Ke) || i(Me)) ? (u(), de(i(le), {
         ref_key: "userOptionsRef",
         ref: Se,
         key: `user_options_${Ee.value}`,
@@ -596,7 +575,7 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
         color: e.value.style.color,
         isImaging: i(Ze),
         isPrinting: i(Qe),
-        uid: M.value,
+        uid: O.value,
         hasTooltip: e.value.userOptions.buttons.tooltip && e.value.style.tooltip.show,
         hasPdf: e.value.userOptions.buttons.pdf,
         hasImg: e.value.userOptions.buttons.img,
@@ -623,13 +602,13 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
         onToggleTooltip: nt,
         onToggleAnnotator: Ne,
         style: w({
-          visibility: i(Ke) ? i(Oe) ? "visible" : "hidden" : "visible"
+          visibility: i(Ke) ? i(Me) ? "visible" : "hidden" : "visible"
         })
       }, yt({ _: 2 }, [
         t.$slots.menuIcon ? {
           name: "menuIcon",
-          fn: z(({ isOpen: a, color: s }) => [
-            L(t.$slots, "menuIcon", Z(ee({ isOpen: a, color: s })), void 0, !0)
+          fn: z(({ isOpen: a, color: o }) => [
+            L(t.$slots, "menuIcon", Z(ee({ isOpen: a, color: o })), void 0, !0)
           ]),
           key: "0"
         } : void 0,
@@ -670,15 +649,15 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
         } : void 0,
         t.$slots.optionFullscreen ? {
           name: "optionFullscreen",
-          fn: z(({ toggleFullscreen: a, isFullscreen: s }) => [
-            L(t.$slots, "optionFullscreen", Z(ee({ toggleFullscreen: a, isFullscreen: s })), void 0, !0)
+          fn: z(({ toggleFullscreen: a, isFullscreen: o }) => [
+            L(t.$slots, "optionFullscreen", Z(ee({ toggleFullscreen: a, isFullscreen: o })), void 0, !0)
           ]),
           key: "6"
         } : void 0,
         t.$slots.optionAnnotator ? {
           name: "optionAnnotator",
-          fn: z(({ toggleAnnotator: a, isAnnotator: s }) => [
-            L(t.$slots, "optionAnnotator", Z(ee({ toggleAnnotator: a, isAnnotator: s })), void 0, !0)
+          fn: z(({ toggleAnnotator: a, isAnnotator: o }) => [
+            L(t.$slots, "optionAnnotator", Z(ee({ toggleAnnotator: a, isAnnotator: o })), void 0, !0)
           ]),
           key: "7"
         } : void 0
@@ -691,7 +670,7 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
       }, [
         (u(), n("svg", {
           ref_key: "svgRef",
-          ref: Me,
+          ref: Oe,
           xmlns: i(nl),
           class: ce({ "vue-data-ui-fullscreen--on": G.value, "vue-data-ui-fulscreen--off": !G.value }),
           viewBox: `0 0 ${_.value.width} ${_.value.height}`,
@@ -713,23 +692,23 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
             }
           }, [
             L(t.$slots, "chart-background", {}, void 0, !0)
-          ], 8, Ol)) : f("", !0),
+          ], 8, Ml)) : f("", !0),
           e.value.style.layout.cells.columnTotal.color.show ? (u(), n("g", {
             key: 1,
             ref_key: "xAxisSumRects",
             ref: Lt
           }, [
-            (u(!0), n(C, null, F(g.value.xTotals, (a, s) => (u(), n("rect", {
-              x: l.value.left + l.value.cellSize.width * s + r.value / 2 + l.value.sumCellXHeight,
+            (u(!0), n(C, null, F(g.value.xTotals, (a, o) => (u(), n("rect", {
+              x: l.value.left + l.value.cellSize.width * o + r.value / 2 + l.value.sumCellXHeight,
               y: l.value.top - l.value.sumCellXHeight + r.value * (_.value.height / _.value.width),
               height: l.value.sumCellXHeight,
               width: l.value.cellSize.width - r.value,
               fill: e.value.style.layout.cells.colors.underlayer,
               stroke: e.value.style.backgroundColor,
               "stroke-width": r.value
-            }, null, 8, Ml))), 256)),
-            (u(!0), n(C, null, F(g.value.xTotals, (a, s) => (u(), n("rect", {
-              x: l.value.left + l.value.cellSize.width * s + r.value / 2 + l.value.sumCellXHeight,
+            }, null, 8, Ol))), 256)),
+            (u(!0), n(C, null, F(g.value.xTotals, (a, o) => (u(), n("rect", {
+              x: l.value.left + l.value.cellSize.width * o + r.value / 2 + l.value.sumCellXHeight,
               y: l.value.top - l.value.sumCellXHeight + r.value * (_.value.height / _.value.width),
               height: l.value.sumCellXHeight,
               width: l.value.cellSize.width - r.value,
@@ -742,11 +721,11 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
             ref_key: "datapoints",
             ref: kt
           }, [
-            (u(!0), n(C, null, F(Y.value, (a, s) => (u(), n(C, null, [
+            (u(!0), n(C, null, F(Y.value, (a, o) => (u(), n(C, null, [
               (u(!0), n(C, null, F(a.temperatures, (v, c) => (u(), n("g", null, [
                 p("rect", {
                   x: l.value.left + l.value.cellSize.width * c + r.value / 2 + l.value.sumCellXHeight,
-                  y: l.value.top + l.value.cellSize.height * s + r.value / 2,
+                  y: l.value.top + l.value.cellSize.height * o + r.value / 2,
                   width: l.value.cellSize.width - r.value,
                   height: l.value.cellSize.height - r.value,
                   fill: e.value.style.layout.cells.colors.underlayer,
@@ -755,15 +734,15 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
                 }, null, 8, Fl),
                 p("rect", {
                   x: l.value.left + l.value.cellSize.width * c + r.value / 2 + l.value.sumCellXHeight,
-                  y: l.value.top + l.value.cellSize.height * s + r.value / 2,
+                  y: l.value.top + l.value.cellSize.height * o + r.value / 2,
                   width: l.value.cellSize.width - r.value,
                   height: l.value.cellSize.height - r.value,
                   fill: v.color,
                   stroke: e.value.style.backgroundColor,
                   "stroke-width": r.value,
-                  onMouseover: (x) => Xt(v, s, l.value.left + l.value.cellSize.width * c, l.value.top + l.value.cellSize.height * s),
-                  onMouseout: () => It({ datapoint: v, seriesIndex: s }),
-                  onClick: () => Et(v, s)
+                  onMouseover: (x) => Xt(v, o, l.value.left + l.value.cellSize.width * c, l.value.top + l.value.cellSize.height * o),
+                  onMouseout: () => It({ datapoint: v, seriesIndex: o }),
+                  onClick: () => Et(v, o)
                 }, null, 40, Dl),
                 e.value.style.layout.cells.value.show ? ft((u(), n("text", {
                   key: 0,
@@ -772,10 +751,10 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
                   "font-weight": e.value.style.layout.cells.value.bold ? "bold" : "normal",
                   fill: i(Ae)(v.color),
                   x: l.value.left + l.value.cellSize.width * c + l.value.cellSize.width / 2 + l.value.sumCellXHeight,
-                  y: l.value.top + l.value.cellSize.height * s + l.value.cellSize.height / 2 + e.value.style.layout.cells.value.fontSize / 3,
+                  y: l.value.top + l.value.cellSize.height * o + l.value.cellSize.height / 2 + e.value.style.layout.cells.value.fontSize / 3,
                   style: { pointerEvents: "none", userSelect: "none" }
                 }, [
-                  Ve(T(i(B)(
+                  Ie(T(i(B)(
                     e.value.style.layout.cells.value.formatter,
                     v.value,
                     i(H)({
@@ -792,7 +771,7 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
                     cellHeight: l.value.cellSize.height - r.value,
                     maxFontSize: e.value.style.layout.cells.value.fontSize,
                     minFontSize: 10,
-                    index: s * D.value + c,
+                    index: o * D.value + c,
                     reportHide: Pt,
                     reportRotation: Nt,
                     hideAll: Ht.value,
@@ -807,10 +786,10 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
             ref_key: "yAxisSumRects",
             ref: Ct
           }, [
-            (u(!0), n(C, null, F(Y.value, (a, s) => (u(), n(C, null, [
+            (u(!0), n(C, null, F(Y.value, (a, o) => (u(), n(C, null, [
               p("rect", {
                 x: l.value.left,
-                y: l.value.top + l.value.cellSize.height * s,
+                y: l.value.top + l.value.cellSize.height * o,
                 width: l.value.sumCellXHeight,
                 height: l.value.cellSize.height - r.value,
                 fill: e.value.style.layout.cells.colors.underlayer,
@@ -819,10 +798,10 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
               }, null, 8, Hl),
               p("rect", {
                 x: l.value.left,
-                y: l.value.top + l.value.cellSize.height * s + r.value / 2,
+                y: l.value.top + l.value.cellSize.height * o + r.value / 2,
                 width: l.value.sumCellXHeight,
                 height: l.value.cellSize.height - r.value,
-                fill: g.value.yTotals[s].color,
+                fill: g.value.yTotals[o].color,
                 stroke: e.value.style.backgroundColor,
                 "stroke-width": r.value
               }, null, 8, Pl)
@@ -833,26 +812,26 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
             ref_key: "yAxisLabels",
             ref: je
           }, [
-            (u(!0), n(C, null, F(Y.value, (a, s) => (u(), n(C, null, [
+            (u(!0), n(C, null, F(Y.value, (a, o) => (u(), n(C, null, [
               p("text", {
                 class: "vue-ui-heatmap-row-name",
                 "font-size": e.value.style.layout.dataLabels.yAxis.fontSize,
                 fill: e.value.style.layout.dataLabels.yAxis.color,
                 x: J.value,
-                y: l.value.top + l.value.cellSize.height * s + l.value.cellSize.height / 2 + e.value.style.layout.dataLabels.yAxis.fontSize / 3 + e.value.style.layout.dataLabels.yAxis.offsetY - (e.value.style.layout.cells.rowTotal.value.show ? e.value.style.layout.dataLabels.yAxis.fontSize / 1.5 : 0),
+                y: l.value.top + l.value.cellSize.height * o + l.value.cellSize.height / 2 + e.value.style.layout.dataLabels.yAxis.fontSize / 3 + e.value.style.layout.dataLabels.yAxis.offsetY - (e.value.style.layout.cells.rowTotal.value.show ? e.value.style.layout.dataLabels.yAxis.fontSize / 1.5 : 0),
                 "text-anchor": "end",
                 "font-weight": e.value.style.layout.dataLabels.yAxis.bold ? "bold" : "normal"
-              }, T(g.value.yLabels[s]), 9, Xl),
+              }, T(g.value.yLabels[o]), 9, Xl),
               e.value.style.layout.cells.rowTotal.value.show ? (u(), n("text", {
                 key: 0,
                 class: "vue-ui-heatmap-row-total",
                 "font-size": e.value.style.layout.dataLabels.yAxis.fontSize,
                 fill: e.value.style.layout.dataLabels.yAxis.color,
                 x: J.value,
-                y: l.value.top + l.value.cellSize.height * s + l.value.cellSize.height / 2 + e.value.style.layout.dataLabels.yAxis.fontSize + e.value.style.layout.dataLabels.yAxis.offsetY,
+                y: l.value.top + l.value.cellSize.height * o + l.value.cellSize.height / 2 + e.value.style.layout.dataLabels.yAxis.fontSize + e.value.style.layout.dataLabels.yAxis.offsetY,
                 "text-anchor": "end",
                 "font-weight": e.value.style.layout.dataLabels.yAxis.bold ? "bold" : "normal"
-              }, T(Vt(s)), 9, Il)) : f("", !0)
+              }, T(Vt(o)), 9, Il)) : f("", !0)
             ], 64))), 256))
           ], 512)) : f("", !0),
           e.value.style.layout.dataLabels.xAxis.show ? (u(), n("g", {
@@ -860,15 +839,15 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
             ref_key: "xAxisLabels",
             ref: _e
           }, [
-            (u(!0), n(C, null, F(g.value.xLabels, (a, s) => (u(), n(C, null, [
-              !e.value.style.layout.dataLabels.xAxis.showOnlyAtModulo || e.value.style.layout.dataLabels.xAxis.showOnlyAtModulo && s % e.value.style.layout.dataLabels.xAxis.showOnlyAtModulo === 0 ? (u(), n("text", {
+            (u(!0), n(C, null, F(g.value.xLabels, (a, o) => (u(), n(C, null, [
+              !e.value.style.layout.dataLabels.xAxis.showOnlyAtModulo || e.value.style.layout.dataLabels.xAxis.showOnlyAtModulo && o % e.value.style.layout.dataLabels.xAxis.showOnlyAtModulo === 0 ? (u(), n("text", {
                 key: 0,
                 class: "vue-ui-heatmap-col-name",
                 "text-anchor": e.value.style.layout.dataLabels.xAxis.rotation === 0 ? "middle" : e.value.style.layout.dataLabels.xAxis.rotation < 0 ? "start" : "end",
                 "font-size": e.value.style.layout.dataLabels.xAxis.fontSize,
                 fill: e.value.style.layout.dataLabels.xAxis.color,
                 "font-weight": e.value.style.layout.dataLabels.xAxis.bold ? "bold" : "normal",
-                transform: `translate(${l.value.left + l.value.cellSize.width / 2 + l.value.width / g.value.xLabels.length * s + e.value.style.layout.dataLabels.xAxis.offsetX + l.value.sumCellXHeight}, ${l.value.topLabelsHeight}), rotate(${e.value.style.layout.dataLabels.xAxis.rotation})`
+                transform: `translate(${l.value.left + l.value.cellSize.width / 2 + l.value.width / g.value.xLabels.length * o + e.value.style.layout.dataLabels.xAxis.offsetX + l.value.sumCellXHeight}, ${l.value.topLabelsHeight}), rotate(${e.value.style.layout.dataLabels.xAxis.rotation})`
               }, T(a), 9, Vl)) : f("", !0)
             ], 64))), 256))
           ], 512)) : f("", !0),
@@ -877,14 +856,14 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
             ref_key: "xAxisSums",
             ref: ze
           }, [
-            (u(!0), n(C, null, F(g.value.xLabels, (a, s) => (u(), n("text", {
+            (u(!0), n(C, null, F(g.value.xLabels, (a, o) => (u(), n("text", {
               class: "vue-ui-heatmap-col-total",
               "text-anchor": e.value.style.layout.cells.columnTotal.value.rotation === 0 ? "middle" : e.value.style.layout.cells.columnTotal.value.rotation < 0 ? "end" : "start",
               "font-size": e.value.style.layout.dataLabels.xAxis.fontSize,
               fill: e.value.style.layout.dataLabels.xAxis.color,
               "font-weight": e.value.style.layout.dataLabels.xAxis.bold ? "bold" : "normal",
-              transform: `translate(${l.value.left + l.value.cellSize.width / 2 + l.value.width / g.value.xLabels.length * s + e.value.style.layout.dataLabels.xAxis.offsetX + e.value.style.layout.cells.columnTotal.value.offsetX + l.value.sumCellXHeight}, ${l.value.bottom + e.value.style.layout.dataLabels.xAxis.fontSize / 2}), rotate(${e.value.style.layout.cells.columnTotal.value.rotation})`
-            }, T(Bt(s)), 9, Bl))), 256))
+              transform: `translate(${l.value.left + l.value.cellSize.width / 2 + l.value.width / g.value.xLabels.length * o + e.value.style.layout.dataLabels.xAxis.offsetX + e.value.style.layout.cells.columnTotal.value.offsetX + l.value.sumCellXHeight}, ${l.value.bottom + e.value.style.layout.dataLabels.xAxis.fontSize / 2}), rotate(${e.value.style.layout.cells.columnTotal.value.rotation})`
+            }, T(Bt(o)), 9, Bl))), 256))
           ], 512)) : f("", !0),
           se.value ? (u(), n("g", El, [
             p("rect", {
@@ -1068,7 +1047,7 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
                   key: 0,
                   style: w(`backgroundColor:${e.value.table.th.backgroundColor};color:${e.value.table.th.color};outline:${e.value.table.th.outline}`)
                 }, [
-                  Ve(T(e.value.style.title.text) + " ", 1),
+                  Ie(T(e.value.style.title.text) + " ", 1),
                   e.value.style.title.subtitle.text ? (u(), n("span", Kl, T(e.value.style.title.subtitle.text), 1)) : f("", !0)
                 ], 4)),
                 p("thead", null, [
@@ -1079,16 +1058,16 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
                     p("th", {
                       style: w(`outline:${e.value.table.th.outline};padding-right:6px`)
                     }, null, 4),
-                    (u(!0), n(C, null, F(b.dataset, (a, s) => (u(), n("th", {
+                    (u(!0), n(C, null, F(b.dataset, (a, o) => (u(), n("th", {
                       align: "right",
                       style: w(`outline:${e.value.table.th.outline};padding-right:6px`)
                     }, T(a.name), 5))), 256))
                   ], 4)
                 ]),
                 p("tbody", null, [
-                  (u(!0), n(C, null, F(g.value.xLabels, (a, s) => (u(), n("tr", {
+                  (u(!0), n(C, null, F(g.value.xLabels, (a, o) => (u(), n("tr", {
                     role: "row",
-                    class: ce({ "vue-ui-data-table__tbody__row": !0, "vue-ui-data-table__tbody__row-even": s % 2 === 0, "vue-ui-data-table__tbody__row-odd": s % 2 !== 0 }),
+                    class: ce({ "vue-ui-data-table__tbody__row": !0, "vue-ui-data-table__tbody__row-even": o % 2 === 0, "vue-ui-data-table__tbody__row-odd": o % 2 !== 0 }),
                     style: w(`background:${e.value.table.td.backgroundColor};color:${e.value.table.td.color}`)
                   }, [
                     p("td", {
@@ -1103,7 +1082,7 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
                       "data-cell": b.dataset[c].name,
                       style: w(`outline:${e.value.table.td.outline}`)
                     }, [
-                      p("div", ea, T(isNaN(v.values[s]) ? "-" : i(H)({ p: e.value.style.layout.dataLabels.prefix, v: v.values[s], s: e.value.style.layout.dataLabels.suffix, r: e.value.table.td.roundingValue })), 1)
+                      p("div", ea, T(isNaN(v.values[o]) ? "-" : i(H)({ p: e.value.style.layout.dataLabels.prefix, v: v.values[o], s: e.value.style.layout.dataLabels.suffix, r: e.value.table.td.roundingValue })), 1)
                     ], 12, Zl))), 256))
                   ], 6))), 256))
                 ])
@@ -1116,7 +1095,7 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
         e.value.table.useDialog ? {
           name: "title",
           fn: z(() => [
-            Ve(T(xe.value.title), 1)
+            Ie(T(xe.value.title), 1)
           ]),
           key: "0"
         } : void 0,
@@ -1126,7 +1105,7 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
             p("button", {
               tabindex: "0",
               class: "vue-ui-user-options-button",
-              onClick: o[0] || (o[0] = (a) => De(e.value.userOptions.callbacks.csv))
+              onClick: s[0] || (s[0] = (a) => De(e.value.userOptions.callbacks.csv))
             }, [
               ke(i(te), {
                 name: "excel",
@@ -1140,7 +1119,7 @@ const zl = ["id"], $l = ["xmlns", "viewBox"], Ol = ["x", "y", "width", "height"]
       i(pe) ? (u(), de(bl, { key: 7 })) : f("", !0)
     ], 46, zl));
   }
-}, ma = /* @__PURE__ */ Sl(ta, [["__scopeId", "data-v-8725d53b"]]);
+}, ma = /* @__PURE__ */ Sl(ta, [["__scopeId", "data-v-7b02a740"]]);
 export {
   ma as default
 };