vue-data-ui 3.2.7 → 3.3.0

package/dist/{vue-ui-heatmap-BAVkwnbX.js → vue-ui-heatmap-CcAe5dDN.js}

@@ -1,66 +1,67 @@
-import { useCssVars as Gt, defineAsyncComponent as Q, computed as g, ref as c, shallowRef as Wt, toRefs as jt, watch as we, onBeforeUnmount as vt, onMounted as qt, watchEffect as Xe, reactive as ct, nextTick as dt, createElementBlock as n, openBlock as u, normalizeStyle as w, normalizeClass as ce, createBlock as de, createCommentVNode as y, createElementVNode as f, createVNode as ke, unref as i, createSlots as ht, withCtx as S, renderSlot as C, normalizeProps as Z, guardReactiveProps as ee, Fragment as L, renderList as F, withDirectives as yt, createTextVNode as Pe, toDisplayString as T, vShow as Kt, resolveDynamicComponent as Jt, mergeProps as Qt, withKeys as Zt } from "vue";
-import { c as Ie, t as el, B as tl, o as ft, f as pt, a0 as he, g as ll, X as al, E as Ae, a as B, d as H, q as E, x as ol, y as sl, z as ul, A as il } from "./lib-BEpWEyMm.js";
-import { t as Le, u as nl } from "./useResponsive-DfdjqQps.js";
-import { u as rl, a as gt } from "./useNestedProp-BOk-tPdu.js";
-import { u as vl } from "./usePrinter-w23K-ezx.js";
-import { u as cl, B as dl } from "./BaseScanner-BgWxam9d.js";
-import { u as bt } from "./useTimeLabels-BGFjWgrv.js";
-import { u as hl } from "./useTableResponsive-Cbx-ACcP.js";
-import { u as yl } from "./useUserOptionState-BIvW1Kz7.js";
-import { u as mt } from "./useTimeLabelCollider-CIsgDrl9.js";
-import { u as fl } from "./useChartAccessibility-9icAAmYg.js";
-import pl from "./img-DjWwQXVS.js";
-import gl from "./Title-DG2nloSB.js";
-import { t as bl } from "./themes-Dw-dDudK.js";
-import ml from "./vue-ui-accordion-CeMTgpl0.js";
-import { _ as xl } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const wl = {
-  mounted(b, X) {
-    xt(b, X.value);
+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 T, normalizeProps as Z, guardReactiveProps as ee, Fragment as C, renderList as F, withDirectives as ft, createTextVNode as Ve, toDisplayString as S, 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-GIYcnm0E.js";
+import { t as Ce, u as yl } from "./useResponsive-DfdjqQps.js";
+import { u as fl, a as bt } from "./useNestedProp-mxyyqd0B.js";
+import { u as pl } from "./usePrinter-DYRFiw7X.js";
+import { u as gl, B as bl } from "./BaseScanner-BgWxam9d.js";
+import { u as ml } from "./useSvgExport-B7-Vrjtu.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 kl } from "./useChartAccessibility-9icAAmYg.js";
+import Al from "./img-6wPuVVtk.js";
+import Cl from "./Title-D17CJXko.js";
+import { t as Ll } from "./themes-Dw-dDudK.js";
+import Tl from "./vue-ui-accordion-Dch9YrCi.js";
+import { _ as Sl } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const _l = {
+  mounted(b, P) {
+    wt(b, P.value);
   },
-  updated(b, X) {
-    xt(b, X.value);
+  updated(b, P) {
+    wt(b, P.value);
   }
 };
-function xt(b, {
-  cellWidth: X,
+function wt(b, {
+  cellWidth: P,
   cellHeight: ye,
   maxFontSize: W,
   minFontSize: te,
-  index: $,
+  index: O,
   reportRotation: le,
-  reportHide: P,
-  rotateAll: Ce,
+  reportHide: X,
+  rotateAll: Le,
   hideAll: Te
 }) {
   b.removeAttribute("transform"), b.removeAttribute("visibility");
   let k = !1, fe = !1;
   b.setAttribute("font-size", W);
   const j = b.getComputedTextLength();
-  if (j <= X)
-    le($, !1), P($, !1);
+  if (j <= P)
+    le(O, !1), X(O, !1);
   else {
-    const M = Math.floor(W * X / j);
-    M >= te ? (b.setAttribute("font-size", M), le($, !1), P($, !1)) : (le($, !0), P($, !1), k = !0);
+    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);
   }
-  if (Ce && (k = !0), k) {
+  if (Le && (k = !0), k) {
     b.setAttribute("font-size", W);
-    const M = b.getBBox(), O = M.x + M.width / 2, ae = M.y + M.height / 2;
-    b.setAttribute("transform", `rotate(-90 ${O} ${ae})`);
+    const M = b.getBBox(), L = M.x + M.width / 2, ae = M.y + M.height / 2;
+    b.setAttribute("transform", `rotate(-90 ${L} ${ae})`);
     const q = b.getBBox().width;
     if (q <= ye)
-      P($, !1);
+      X(O, !1);
     else {
       const oe = Math.floor(W * ye / q);
-      oe >= te ? (b.setAttribute("font-size", oe), P($, !1)) : (fe = !0, P($, !0));
+      oe >= te ? (b.setAttribute("font-size", oe), X(O, !1)) : (fe = !0, X(O, !0));
     }
   }
   (Te || fe) && b.setAttribute("visibility", "hidden");
 }
-const kl = ["id"], Al = ["xmlns", "viewBox"], Ll = ["x", "y", "width", "height"], Cl = ["x", "y", "height", "width", "fill", "stroke", "stroke-width"], Tl = ["x", "y", "height", "width", "fill", "stroke", "stroke-width"], _l = ["x", "y", "width", "height", "fill", "stroke", "stroke-width"], Sl = ["x", "y", "width", "height", "fill", "stroke", "stroke-width", "onMouseover", "onMouseout", "onClick"], zl = ["font-size", "font-weight", "fill", "x", "y"], $l = ["x", "y", "width", "height", "fill", "stroke", "stroke-width"], Ml = ["x", "y", "width", "height", "fill", "stroke", "stroke-width"], Ol = ["font-size", "fill", "x", "y", "font-weight"], Rl = ["font-size", "fill", "x", "y", "font-weight"], Fl = ["text-anchor", "font-size", "fill", "font-weight", "transform"], Dl = ["text-anchor", "font-size", "fill", "font-weight", "transform"], Nl = { key: 6 }, Hl = ["x", "y", "width", "height", "stroke", "stroke-width"], Xl = { class: "vue-ui-heatmap-legend-gauge-right" }, Pl = ["data-value"], Il = { class: "vue-ui-heatmap-gauge-indicator-value" }, Vl = {
+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"], Nl = ["x", "y", "width", "height", "fill", "stroke", "stroke-width", "onMouseover", "onMouseout", "onClick"], Dl = ["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"
-}, Bl = { class: "vue-ui-data-table" }, El = { key: 0 }, Ul = ["data-cell"], Yl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Gl = ["data-cell"], Wl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, jl = {
+}, 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 = {
   __name: "vue-ui-heatmap",
   props: {
     config: {
@@ -77,37 +78,42 @@ const kl = ["id"], Al = ["xmlns", "viewBox"], Ll = ["x", "y", "width", "height"]
     }
   },
   emits: ["selectDatapoint"],
-  setup(b, { expose: X, emit: ye }) {
-    Gt((t) => ({
-      v12b5e388: t.tdo
+  setup(b, { expose: P, emit: ye }) {
+    Jt((t) => ({
+      v0f22886a: t.tdo
     }));
-    const W = Q(() => import("./Tooltip-BOXz8skU.js")), te = Q(() => import("./BaseIcon-Bz-1GQhu.js")), $ = Q(() => import("./PenAndPaper-CR8q353D.js")), le = Q(() => import("./UserOptions-DsTgvAok.js")), P = Q(() => import("./PackageVersion-Cwrh45ON.js")), Ce = Q(() => import("./BaseDraggableDialog-CHhZIht2.js")), { vue_ui_heatmap: Te } = rl(), k = b, fe = ye, j = g({
+    const W = Q(() => import("./Tooltip-CtVdvbZi.js")), te = Q(() => import("./BaseIcon-CtqN7W_g.js")), O = Q(() => import("./PenAndPaper-BxbYiPy4.js")), le = Q(() => import("./UserOptions-B3vCIe-u.js")), X = Q(() => import("./PackageVersion-C9oklnuy.js")), Le = Q(() => import("./BaseDraggableDialog-q3pgSDTz.js")), { vue_ui_heatmap: Te } = fl(), k = b, fe = ye, j = y({
       get() {
         return !!k.dataset && k.dataset.length;
       },
       set(t) {
         return t;
       }
-    }), M = c(Ie()), O = c(null), ae = c(!1), q = c(""), oe = c(void 0), se = c(null), Ve = c(0), Be = c(null), Ee = c(0), wt = c(null), ue = c(null), _e = c(null), Ue = c(null), Ye = c(null), kt = c(null), Ge = c(null), At = c(null), Se = c(null), ze = c(null), Lt = c(null), We = c(null), K = Wt(null), e = c(Oe());
-    function Ct() {
+    }), M = d(Be()), L = 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 d = 0; d < s; d += 1) {
-        const v = [];
+      for (let v = 0; v < s; v += 1) {
+        const c = [];
         for (let x = 0; x < a; x += 1)
-          v.push(d + x * 2);
+          c.push(v + x * 2);
         o.push({
-          name: `${t[d]}`,
-          values: v
+          name: `${t[v]}`,
+          values: c
         });
       }
       return o;
     }
-    const { loading: pe, FINAL_DATASET: m, manualLoading: $e } = cl({
-      ...jt(k),
+    const { loading: pe, FINAL_DATASET: m, manualLoading: $e } = gl({
+      ...Zt(k),
       FINAL_CONFIG: e,
-      prepareConfig: Oe,
-      skeletonDataset: Ct(),
-      skeletonConfig: el({
+      prepareConfig: Re,
+      callback: () => {
+        Promise.resolve().then(async () => {
+          await Ie(), L.value && L.value.parentNode && rl(L.value.parentNode);
+        });
+      },
+      skeletonDataset: Tt(),
+      skeletonConfig: sl({
         defaultConfig: e.value,
         userConfig: {
           table: { show: !1 },
@@ -132,96 +138,96 @@ const kl = ["id"], Al = ["xmlns", "viewBox"], Ll = ["x", "y", "width", "height"]
           }
         }
       })
-    }), { userOptionsVisible: Me, setUserOptionsVisibility: Tt, keepUserOptionState: je } = yl({ config: e.value }), { svgRef: qe } = fl({ config: e.value.style.title });
-    function Ke(t) {
-      Tt(t);
+    }), { userOptionsVisible: Oe, setUserOptionsVisibility: St, keepUserOptionState: Ke } = wl({ config: e.value }), { svgRef: Me } = kl({ config: e.value.style.title });
+    function Je(t) {
+      St(t);
     }
-    function Oe() {
-      const t = gt({
+    function Re() {
+      const t = bt({
         userConfig: k.config,
         defaultConfig: Te
       });
       let o = {};
       return t.theme ? o = {
-        ...gt({
-          userConfig: bl.vue_ui_heatmap[t.theme] || k.config,
+        ...bt({
+          userConfig: Ll.vue_ui_heatmap[t.theme] || k.config,
           defaultConfig: t
         })
-      } : o = t, k.config && tl(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;
+      } : 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;
     }
     we(() => k.config, (t) => {
-      pe.value || (e.value = Oe()), Me.value = !e.value.userOptions.showOnChartHover, Re(), Ee.value += 1, z.value.showTable = e.value.table.show, z.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()), 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;
     }, { deep: !0 }), we(() => k.dataset, (t) => {
-      Array.isArray(t) && t.length > 0 && ($e.value = !1), Re();
+      Array.isArray(t) && t.length > 0 && ($e.value = !1), Fe();
     }, { deep: !0 });
-    const { isPrinting: Je, isImaging: Qe, generatePdf: Ze, generateImage: et } = vl({
+    const { isPrinting: Qe, isImaging: Ze, generatePdf: et, generateImage: tt } = pl({
       elementId: `heatmap__${M.value}`,
       fileName: e.value.style.title.text || "vue-ui-heatmap",
       options: e.value.userOptions.print
-    }), _t = g(() => e.value.userOptions.show && !e.value.style.title.text), z = c({
+    }), _t = y(() => e.value.userOptions.show && !e.value.style.title.text), $ = d({
       showTable: e.value.table.show,
       showTooltip: e.value.style.tooltip.show
     });
     we(e, () => {
-      z.value = {
+      $.value = {
         showTable: e.value.table.show,
         showTooltip: e.value.style.tooltip.show
       };
     }, { immediate: !0 });
-    const St = g(() => e.value.table.responsiveBreakpoint), I = c(null), tt = g(() => !!e.value.debug);
-    function Re() {
-      if (ft(k.dataset) && (pt({
+    const zt = y(() => e.value.table.responsiveBreakpoint), I = d(null), lt = y(() => !!e.value.debug);
+    function Fe() {
+      if (pt(k.dataset) && (gt({
         componentName: "VueUiHeatmap",
         type: "dataset",
-        debug: tt.value
-      }), j.value = !1, $e.value = !0), ft(k.dataset) || ($e.value = e.value.loading), e.value.responsive) {
-        const t = Le(() => {
-          const { width: o, height: a } = nl({
-            chart: O.value,
-            title: e.value.style.title.text ? Ue.value : null,
+        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({
+            chart: L.value,
+            title: e.value.style.title.text ? Ge.value : null,
             // add legend hirizontal in legend attr
             // add legend vertical in some other attr and modify composable to subtract width
-            source: We.value,
-            noTitle: Ye.value
+            source: qe.value,
+            noTitle: We.value
           });
           requestAnimationFrame(() => {
             ie.value = o, ne.value = a;
           });
         });
-        I.value && (K.value && I.value.unobserve(K.value), I.value.disconnect()), I.value = new ResizeObserver(t), K.value = O.value.parentNode, I.value.observe(K.value);
+        I.value && (K.value && I.value.unobserve(K.value), I.value.disconnect()), I.value = new ResizeObserver(t), K.value = L.value.parentNode, I.value.observe(K.value);
       }
     }
-    vt(() => {
+    dt(() => {
       I.value && (K.value && I.value.unobserve(K.value), I.value.disconnect());
-    }), qt(() => {
-      Re();
+    }), el(() => {
+      Fe();
     });
-    const D = g(() => Math.max(...m.value.flatMap((t) => (t.values || []).length))), ie = c(e.value.style.layout.width), ne = c(e.value.style.layout.height), _ = g(() => ({
+    const N = y(() => Math.max(...m.value.flatMap((t) => (t.values || []).length))), ie = d(e.value.style.layout.width), ne = d(e.value.style.layout.height), _ = y(() => ({
       width: Math.max(10, ie.value),
       height: Math.max(10, ne.value)
-    })), re = c(0), zt = Le((t) => {
+    })), re = d(0), $t = Ce((t) => {
       re.value = t;
     }, 100);
     Xe((t) => {
-      const o = Se.value;
+      const o = _e.value;
       if (!o) return;
       const a = new ResizeObserver((s) => {
-        zt(s[0].contentRect.height);
+        $t(s[0].contentRect.height);
       });
       a.observe(o), t(() => a.disconnect());
     });
-    const J = c(0), $t = Le((t) => {
+    const J = d(0), Ot = Ce((t) => {
       J.value = t;
     }, 100);
     Xe((t) => {
-      const o = Ge.value;
+      const o = je.value;
       if (!o) return;
       const a = new ResizeObserver((s) => {
-        $t(s[0].contentRect.width);
+        Ot(s[0].contentRect.width);
       });
       a.observe(o), t(() => a.disconnect());
     });
-    const ge = c(0), Mt = Le((t) => {
+    const ge = d(0), Mt = Ce((t) => {
       ge.value = t;
     }, 100);
     Xe((t) => {
@@ -231,81 +237,81 @@ const kl = ["id"], Al = ["xmlns", "viewBox"], Ll = ["x", "y", "width", "height"]
         Mt(s[0].contentRect.height);
       });
       a.observe(o), t(() => a.disconnect());
-    }), vt(() => {
+    }), dt(() => {
       re.value = 0, J.value = 0, ge.value = 0;
     });
-    const r = g(() => Math.min(_.value.height, _.value.width) / 1e3 * e.value.style.layout.cells.spacing), l = g(() => {
+    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, d = _.value.height - o.top - o.bottom - re.value - a, v = _.value.width / 60, x = {
-        x: r.value * D.value,
+      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 = {
+        x: r.value * N.value,
         y: r.value * ((m.value || []).length + 1)
-      }, N = _.value.width - o.left - o.right - x.x - v * 2 - 2 - t - J.value, h = d - v - x.y - ge.value - s - e.value.style.layout.cells.columnTotal.value.offsetY, A = {
-        width: Math.max(3, N / D.value),
+      }, D = _.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 = {
+        width: Math.max(3, D / N.value),
         height: Math.max(3, h / (m.value.length ?? 1))
       };
       return {
-        top: o.top + re.value + v + a,
+        top: o.top + re.value + c + a,
         topLabelsHeight: re.value,
-        sumCellXHeight: v,
+        sumCellXHeight: c,
         height: h,
-        left: o.left + J.value + v / 2,
+        left: o.left + J.value + c / 2,
         right: o.right - t,
         bottom: _.value.height - o.bottom - ge.value,
-        width: N,
+        width: D,
         cellSize: A
       };
-    }), V = g(() => Math.max(...m.value.flatMap((t) => t.values))), ve = g(() => Math.min(...m.value.flatMap((t) => t.values))), U = g(() => {
+    }), 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;
-    }), Ot = g(() => bt({
+    }), 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,
       formatter: e.value.style.layout.dataLabels.yAxis.datetimeFormatter,
       start: 0,
       end: m.value.length
-    })), Rt = g(() => bt({
+    })), Ft = y(() => mt({
       values: e.value.style.layout.dataLabels.xAxis.values,
-      maxDatapoints: D.value,
+      maxDatapoints: N.value,
       formatter: e.value.style.layout.dataLabels.xAxis.datetimeFormatter,
       start: 0,
-      end: D.value
-    })), p = g(() => {
-      const t = Ot.value.map((h) => h.text), o = Rt.value.map((h) => h.text), a = m.value.map((h) => h.values.reduce((A, He) => A + He, 0)), s = Math.max(...a), d = Math.min(...a), v = [];
-      for (let h = 0; h < D.value; h += 1)
-        v.push(m.value.map((A) => A.values[h] || 0).reduce((A, He) => A + He, 0));
-      const x = Math.max(...v), N = Math.min(...v);
+      end: N.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 = [];
+      for (let h = 0; h < N.value; h += 1)
+        c.push(m.value.map((A) => A.values[h] || 0).reduce((A, Pe) => A + Pe, 0));
+      const x = Math.max(...c), D = Math.min(...c);
       return {
         yTotals: a.map((h) => {
           const A = isNaN(h / s) ? 0 : h / s;
           return {
             total: h,
             proportion: A,
-            color: he(e.value.style.layout.cells.colors.cold, e.value.style.layout.cells.colors.hot, d, s, h)
+            color: he(e.value.style.layout.cells.colors.cold, e.value.style.layout.cells.colors.hot, v, s, h)
           };
         }),
-        xTotals: v.map((h) => {
+        xTotals: c.map((h) => {
           const A = isNaN(h / x) ? 0 : h / x;
           return {
             total: h,
             proportion: A,
-            color: he(e.value.style.layout.cells.colors.cold, e.value.style.layout.cells.colors.hot, N, x, h)
+            color: he(e.value.style.layout.cells.colors.cold, e.value.style.layout.cells.colors.hot, D, x, h)
           };
         }),
         yLabels: t,
-        xLabels: o.slice(0, D.value)
+        xLabels: o.slice(0, N.value)
       };
-    }), Y = g(() => (m.value.forEach((t, o) => {
-      ll({
+    }), Y = y(() => (m.value.forEach((t, o) => {
+      il({
         datasetObject: t,
         requiredAttributes: ["values"]
       }).forEach((a) => {
-        pt({
+        gt({
           componentName: "VueUiHeatmap",
           type: "datasetSerieAttribute",
           property: "values",
           index: o,
-          debug: tt.value
+          debug: lt.value
         });
       });
     }), m.value.map((t, o) => ({
@@ -315,31 +321,31 @@ const kl = ["id"], Al = ["xmlns", "viewBox"], Ll = ["x", "y", "width", "height"]
         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: p.value.yLabels[o],
-        xAxisName: p.value.xLabels[s],
-        id: `vue-data-ui-heatmap-cell-${Ie()}`
+        yAxisName: g.value.yLabels[o],
+        xAxisName: g.value.xLabels[s],
+        id: `vue-data-ui-heatmap-cell-${Be()}`
       } : {
         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: p.value.yLabels[o],
-        xAxisName: p.value.xLabels[s],
-        id: `vue-data-ui-heatmap-cell-${Ie()}`
+        yAxisName: g.value.yLabels[o],
+        xAxisName: g.value.xLabels[s],
+        id: `vue-data-ui-heatmap-cell-${Be()}`
       })
-    })))), lt = g(() => m.value.length), at = ct(Array(lt.value * D.value || 1).fill(!1)), Ft = g(() => at.some((t) => t));
+    })))), at = y(() => m.value.length), ot = ht(Array(at.value * N.value || 1).fill(!1)), Nt = y(() => ot.some((t) => t));
     function Dt(t, o) {
-      at[t] = o;
-    }
-    const ot = ct(Array(lt.value * D.value || 1).fill(!1)), Nt = g(() => ot.some((t) => t));
-    function Ht(t, o) {
       ot[t] = o;
     }
-    const R = c(null), be = c(null);
+    const st = ht(Array(at.value * N.value || 1).fill(!1)), Ht = y(() => st.some((t) => t));
+    function Pt(t, o) {
+      st[t] = o;
+    }
+    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 };
-      const { value: d, yAxisName: v, xAxisName: x, id: N } = t;
-      oe.value = N, R.value = d, be.value = {
+      const { value: v, yAxisName: c, xAxisName: x, id: D } = t;
+      oe.value = D, R.value = v, be.value = {
         datapoint: t,
         seriesIndex: o,
         series: Y.value,
@@ -347,7 +353,7 @@ const kl = ["id"], Al = ["xmlns", "viewBox"], Ll = ["x", "y", "width", "height"]
       }, ae.value = !0;
       let h = "";
       const A = e.value.style.tooltip.customFormat;
-      ul(A) && il(() => A({
+      dl(A) && hl(() => A({
         datapoint: t,
         seriesIndex: o,
         series: Y.value,
@@ -357,106 +363,106 @@ const kl = ["id"], Al = ["xmlns", "viewBox"], Ll = ["x", "y", "width", "height"]
         seriesIndex: o,
         series: Y.value,
         config: e.value
-      }) : (h += `<div>${v} ${x ? v ? ` - ${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, d)}">⬤</span><span>${isNaN(d) ? "-" : B(
+      }) : (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(
         e.value.style.layout.cells.value.formatter,
-        d,
+        v,
         H({
           p: e.value.style.layout.dataLabels.prefix,
-          v: d,
+          v,
           s: e.value.style.layout.dataLabels.suffix,
           r: e.value.style.tooltip.roundingValue
         }),
         { datapoint: t, seriesIndex: o }
       )}</span></div>`, q.value = `<div style="font-size:${e.value.style.tooltip.fontSize}px">${h}</div>`);
     }
-    function Pt({ datapoint: t, seriesIndex: o }) {
+    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(t) {
+    function Vt(t) {
       return B(
         e.value.style.layout.cells.value.formatter,
-        p.value.yTotals[t].total,
+        g.value.yTotals[t].total,
         H({
           p: e.value.style.layout.dataLabels.prefix,
-          v: p.value.yTotals[t].total,
+          v: g.value.yTotals[t].total,
           s: e.value.style.layout.dataLabels.suffix,
           r: e.value.style.layout.cells.value.roundingValue
         }),
-        { datapoint: p.value.yTotals[t], rowIndex: t }
+        { datapoint: g.value.yTotals[t], rowIndex: t }
       );
     }
-    function Vt(t) {
+    function Bt(t) {
       return B(
         e.value.style.layout.cells.value.formatter,
-        p.value.xTotals[t].total,
+        g.value.xTotals[t].total,
         H({
           p: e.value.style.layout.dataLabels.prefix,
-          v: p.value.xTotals[t].total,
+          v: g.value.xTotals[t].total,
           s: e.value.style.layout.dataLabels.suffix,
           r: e.value.style.layout.cells.value.roundingValue
         }),
-        { datapoint: p.value.xTotals[t], colIndex: t }
+        { datapoint: g.value.xTotals[t], colIndex: t }
       );
     }
-    g(() => {
+    y(() => {
       const t = m.value.map((a) => ({
         name: a.name
       })), o = m.value.map((a) => a.values);
       return { head: t, body: o };
     });
-    function Fe(t = null) {
-      dt(() => {
-        const o = ["", ...m.value.map((v, x) => v.name)], a = [];
-        for (let v = 0; v < p.value.xLabels.length; v += 1) {
-          const x = [p.value.xLabels[v]];
-          for (let N = 0; N < m.value.length; N += 1)
-            x.push([m.value[N].values[v]]);
+    function Ne(t = null) {
+      Ie(() => {
+        const o = ["", ...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 D = 0; D < m.value.length; D += 1)
+            x.push([m.value[D].values[c]]);
           a.push(x);
         }
-        const s = [[e.value.style.title.text], [e.value.style.title.subtitle.text], [[""], [""], [""]]].concat([o]).concat(a), d = ol(s);
-        t ? t(d) : sl({ csvContent: d, title: e.value.style.title.text || "vue-ui-heatmap" });
+        const s = [[e.value.style.title.text], [e.value.style.title.subtitle.text], [[""], [""], [""]]].concat([o]).concat(a), v = vl(s);
+        t ? t(v) : cl({ csvContent: v, title: e.value.style.title.text || "vue-ui-heatmap" });
       });
     }
-    const G = c(!1);
-    function st(t) {
-      G.value = t, Ve.value += 1;
-    }
-    function ut() {
-      z.value.showTable = !z.value.showTable;
+    const G = d(!1);
+    function ut(t) {
+      G.value = t, Ee.value += 1;
     }
     function it() {
-      z.value.showTooltip = !z.value.showTooltip;
+      $.value.showTable = !$.value.showTable;
     }
-    const me = c(!1);
+    function nt() {
+      $.value.showTooltip = !$.value.showTooltip;
+    }
+    const me = d(!1);
     function De() {
       me.value = !me.value;
     }
-    function Bt(t, o) {
+    function Et(t, o) {
       e.value.events.datapointClick && e.value.events.datapointClick({ datapoint: t, seriesIndex: o }), fe("selectDatapoint", t);
     }
-    function Et() {
+    function Ut() {
       return Y.value;
     }
-    async function Ut({ scale: t = 2 } = {}) {
-      if (!O.value) return;
-      const { width: o, height: a } = O.value.getBoundingClientRect(), s = o / a, { imageUri: d, base64: v } = await pl({ domElement: O.value, base64: !0, img: !0, scale: t });
+    async function Yt({ scale: t = 2 } = {}) {
+      if (!L.value) return;
+      const { width: o, height: a } = L.value.getBoundingClientRect(), s = o / a, { imageUri: v, base64: c } = await Al({ domElement: L.value, base64: !0, img: !0, scale: t });
       return {
-        imageUri: d,
-        base64: v,
+        imageUri: v,
+        base64: c,
         title: e.value.style.title.text,
         width: o,
         height: a,
         aspectRatio: s
       };
     }
-    const nt = g(() => ({
+    const rt = y(() => ({
       start: 0,
-      end: D.value
-    })), rt = g(() => p.value.xLabels);
-    mt({
-      timeLabelsEls: Se,
-      timeLabels: rt,
-      slicer: nt,
+      end: N.value
+    })), vt = y(() => g.value.xLabels);
+    xt({
+      timeLabelsEls: _e,
+      timeLabels: vt,
+      slicer: rt,
       configRef: e,
       rotationPath: ["style", "layout", "dataLabels", "xAxis", "rotation"],
       autoRotatePath: ["style", "layout", "dataLabels", "xAxis", "autoRotate", "enable"],
@@ -465,10 +471,10 @@ const kl = ["id"], Al = ["xmlns", "viewBox"], Ll = ["x", "y", "width", "height"]
       rotation: e.value.style.layout.dataLabels.xAxis.autoRotate.angle,
       width: ie,
       height: ne
-    }), mt({
+    }), xt({
       timeLabelsEls: ze,
-      timeLabels: rt,
-      slicer: nt,
+      timeLabels: vt,
+      slicer: rt,
       configRef: e,
       rotationPath: ["style", "layout", "cells", "columnTotal", "value", "rotation"],
       autoRotatePath: ["style", "layout", "cells", "columnTotal", "value", "autoRotate", "enable"],
@@ -478,10 +484,10 @@ const kl = ["id"], Al = ["xmlns", "viewBox"], Ll = ["x", "y", "width", "height"]
       width: ie,
       height: ne
     });
-    const xe = g(() => {
-      const t = e.value.table.useDialog && !e.value.table.show, o = z.value.showTable;
+    const xe = y(() => {
+      const t = e.value.table.useDialog && !e.value.table.show, o = $.value.showTable;
       return {
-        component: t ? Ce : ml,
+        component: t ? Le : Tl,
         title: `${e.value.style.title.text}${e.value.style.title.subtitle.text ? `: ${e.value.style.title.subtitle.text}` : ""}`,
         props: t ? {
           backgroundColor: e.value.table.th.backgroundColor,
@@ -489,7 +495,7 @@ const kl = ["id"], Al = ["xmlns", "viewBox"], Ll = ["x", "y", "width", "height"]
           headerColor: e.value.table.th.color,
           headerBg: e.value.table.th.backgroundColor,
           isFullscreen: G.value,
-          fullscreenParent: O.value,
+          fullscreenParent: L.value,
           forcedWidth: Math.min(800, window.innerWidth * 0.8)
         } : {
           hideDetails: !0,
@@ -508,55 +514,68 @@ const kl = ["id"], Al = ["xmlns", "viewBox"], Ll = ["x", "y", "width", "height"]
         }
       };
     });
-    we(() => z.value.showTable, async (t) => {
-      e.value.table.show || (t && e.value.table.useDialog && ue.value ? (await dt(), ue.value.open()) : "close" in ue.value && ue.value.close());
+    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());
     });
-    const { isResponsive: Yt } = hl(Be, St);
-    function Ne() {
-      z.value.showTable = !1, _e.value && _e.value.setTableIconState(!1);
+    const { isResponsive: Gt } = xl(Ue, zt);
+    function He() {
+      $.value.showTable = !1, Se.value && Se.value.setTableIconState(!1);
     }
-    return X({
-      getData: Et,
-      getImage: Ut,
-      generatePdf: Ze,
-      generateCsv: Fe,
-      generateImage: et,
-      toggleTable: ut,
-      toggleTooltip: it,
+    const Wt = y(() => e.value.style.backgroundColor), jt = y(() => e.value.style.title), { exportSvg: qt, getSvg: Kt } = ml({
+      svg: Me,
+      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 });
+      } else
+        qt();
+    }
+    return P({
+      getData: Ut,
+      getImage: Yt,
+      generatePdf: et,
+      generateCsv: Ne,
+      generateImage: tt,
+      generateSvg: ct,
+      toggleTable: it,
+      toggleTooltip: nt,
       toggleAnnotator: De,
-      toggleFullscreen: st
+      toggleFullscreen: ut
     }), (t, o) => (u(), n("div", {
       ref_key: "heatmapChart",
-      ref: O,
-      class: ce(`vue-ui-heatmap ${G.value ? "vue-data-ui-wrapper-fullscreen" : ""}`),
+      ref: L,
+      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] = () => Ke(!0)),
-      onMouseleave: o[2] || (o[2] = () => Ke(!1))
+      onMouseenter: o[1] || (o[1] = () => Je(!0)),
+      onMouseleave: o[2] || (o[2] = () => Je(!1))
     }, [
-      e.value.userOptions.buttons.annotator ? (u(), de(i($), {
+      e.value.userOptions.buttons.annotator ? (u(), de(i(O), {
         key: 0,
-        svgRef: i(qe),
+        svgRef: i(Me),
         backgroundColor: e.value.style.backgroundColor,
         color: e.value.style.color,
         active: me.value,
         onClose: De
-      }, null, 8, ["svgRef", "backgroundColor", "color", "active"])) : y("", !0),
+      }, null, 8, ["svgRef", "backgroundColor", "color", "active"])) : f("", !0),
       _t.value ? (u(), n("div", {
         key: 1,
         ref_key: "noTitle",
-        ref: Ye,
+        ref: We,
         class: "vue-data-ui-no-title-space",
         style: "height:36px; width: 100%;background:transparent"
-      }, null, 512)) : y("", !0),
+      }, null, 512)) : f("", !0),
       e.value.style.title.text ? (u(), n("div", {
         key: 2,
         ref_key: "chartTitle",
-        ref: Ue,
+        ref: Ge,
         style: "width:100%;background:transparent"
       }, [
-        (u(), de(gl, {
-          key: `title_${Ee.value}`,
+        (u(), de(Cl, {
+          key: `title_${Ye.value}`,
           config: {
             title: {
               cy: "heatmap-div-title",
@@ -568,101 +587,103 @@ const kl = ["id"], Al = ["xmlns", "viewBox"], Ll = ["x", "y", "width", "height"]
             }
           }
         }, null, 8, ["config"]))
-      ], 512)) : y("", !0),
-      e.value.userOptions.show && j.value && (i(je) || i(Me)) ? (u(), de(i(le), {
+      ], 512)) : f("", !0),
+      e.value.userOptions.show && j.value && (i(Ke) || i(Oe)) ? (u(), de(i(le), {
         ref_key: "userOptionsRef",
-        ref: _e,
-        key: `user_options_${Ve.value}`,
+        ref: Se,
+        key: `user_options_${Ee.value}`,
         backgroundColor: e.value.style.backgroundColor,
         color: e.value.style.color,
-        isImaging: i(Qe),
-        isPrinting: i(Je),
+        isImaging: i(Ze),
+        isPrinting: i(Qe),
         uid: M.value,
         hasTooltip: e.value.userOptions.buttons.tooltip && e.value.style.tooltip.show,
         hasPdf: e.value.userOptions.buttons.pdf,
         hasImg: e.value.userOptions.buttons.img,
+        hasSvg: e.value.userOptions.buttons.svg,
         hasXls: e.value.userOptions.buttons.csv,
         hasTable: e.value.userOptions.buttons.table,
         hasFullscreen: e.value.userOptions.buttons.fullscreen,
         isFullscreen: G.value,
-        isTooltip: z.value.showTooltip,
+        isTooltip: $.value.showTooltip,
         titles: { ...e.value.userOptions.buttonTitles },
-        chartElement: O.value,
+        chartElement: L.value,
         position: e.value.userOptions.position,
         hasAnnotator: e.value.userOptions.buttons.annotator,
         isAnnotation: me.value,
         callbacks: e.value.userOptions.callbacks,
         printScale: e.value.userOptions.print.scale,
         tableDialog: e.value.table.useDialog,
-        onToggleFullscreen: st,
-        onGeneratePdf: i(Ze),
-        onGenerateCsv: Fe,
-        onGenerateImage: i(et),
-        onToggleTable: ut,
-        onToggleTooltip: it,
+        onToggleFullscreen: ut,
+        onGeneratePdf: i(et),
+        onGenerateCsv: Ne,
+        onGenerateImage: i(tt),
+        onGenerateSvg: ct,
+        onToggleTable: it,
+        onToggleTooltip: nt,
         onToggleAnnotator: De,
         style: w({
-          visibility: i(je) ? i(Me) ? "visible" : "hidden" : "visible"
+          visibility: i(Ke) ? i(Oe) ? "visible" : "hidden" : "visible"
         })
-      }, ht({ _: 2 }, [
+      }, yt({ _: 2 }, [
         t.$slots.menuIcon ? {
           name: "menuIcon",
-          fn: S(({ isOpen: a, color: s }) => [
-            C(t.$slots, "menuIcon", Z(ee({ isOpen: a, color: s })), void 0, !0)
+          fn: z(({ isOpen: a, color: s }) => [
+            T(t.$slots, "menuIcon", Z(ee({ isOpen: a, color: s })), void 0, !0)
           ]),
           key: "0"
         } : void 0,
         t.$slots.optionTooltip ? {
           name: "optionTooltip",
-          fn: S(() => [
-            C(t.$slots, "optionTooltip", {}, void 0, !0)
+          fn: z(() => [
+            T(t.$slots, "optionTooltip", {}, void 0, !0)
           ]),
           key: "1"
         } : void 0,
         t.$slots.optionPdf ? {
           name: "optionPdf",
-          fn: S(() => [
-            C(t.$slots, "optionPdf", {}, void 0, !0)
+          fn: z(() => [
+            T(t.$slots, "optionPdf", {}, void 0, !0)
           ]),
           key: "2"
         } : void 0,
         t.$slots.optionCsv ? {
           name: "optionCsv",
-          fn: S(() => [
-            C(t.$slots, "optionCsv", {}, void 0, !0)
+          fn: z(() => [
+            T(t.$slots, "optionCsv", {}, void 0, !0)
           ]),
           key: "3"
         } : void 0,
         t.$slots.optionImg ? {
           name: "optionImg",
-          fn: S(() => [
-            C(t.$slots, "optionImg", {}, void 0, !0)
+          fn: z(() => [
+            T(t.$slots, "optionImg", {}, void 0, !0)
           ]),
           key: "4"
         } : void 0,
         t.$slots.optionTable ? {
           name: "optionTable",
-          fn: S(() => [
-            C(t.$slots, "optionTable", {}, void 0, !0)
+          fn: z(() => [
+            T(t.$slots, "optionTable", {}, void 0, !0)
           ]),
           key: "5"
         } : void 0,
         t.$slots.optionFullscreen ? {
           name: "optionFullscreen",
-          fn: S(({ toggleFullscreen: a, isFullscreen: s }) => [
-            C(t.$slots, "optionFullscreen", Z(ee({ toggleFullscreen: a, isFullscreen: s })), void 0, !0)
+          fn: z(({ toggleFullscreen: a, isFullscreen: s }) => [
+            T(t.$slots, "optionFullscreen", Z(ee({ toggleFullscreen: a, isFullscreen: s })), void 0, !0)
           ]),
           key: "6"
         } : void 0,
         t.$slots.optionAnnotator ? {
           name: "optionAnnotator",
-          fn: S(({ toggleAnnotator: a, isAnnotator: s }) => [
-            C(t.$slots, "optionAnnotator", Z(ee({ toggleAnnotator: a, isAnnotator: s })), void 0, !0)
+          fn: z(({ toggleAnnotator: a, isAnnotator: s }) => [
+            T(t.$slots, "optionAnnotator", Z(ee({ toggleAnnotator: a, isAnnotator: s })), void 0, !0)
           ]),
           key: "7"
         } : void 0
-      ]), 1032, ["backgroundColor", "color", "isImaging", "isPrinting", "uid", "hasTooltip", "hasPdf", "hasImg", "hasXls", "hasTable", "hasFullscreen", "isFullscreen", "isTooltip", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "callbacks", "printScale", "tableDialog", "onGeneratePdf", "onGenerateImage", "style"])) : y("", !0),
-      f("div", {
+      ]), 1032, ["backgroundColor", "color", "isImaging", "isPrinting", "uid", "hasTooltip", "hasPdf", "hasImg", "hasSvg", "hasXls", "hasTable", "hasFullscreen", "isFullscreen", "isTooltip", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "callbacks", "printScale", "tableDialog", "onGeneratePdf", "onGenerateImage", "style"])) : f("", !0),
+      p("div", {
         class: ce({
           "vue-ui-heatmap-chart-wrapper": !0,
           "vue-ui-heatmap-chart-wrapper-legend-right": e.value.style.legend.show
@@ -670,8 +691,8 @@ const kl = ["id"], Al = ["xmlns", "viewBox"], Ll = ["x", "y", "width", "height"]
       }, [
         (u(), n("svg", {
           ref_key: "svgRef",
-          ref: qe,
-          xmlns: i(al),
+          ref: Me,
+          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}`,
           width: "100%",
@@ -680,7 +701,7 @@ const kl = ["id"], Al = ["xmlns", "viewBox"], Ll = ["x", "y", "width", "height"]
           role: "img",
           preserveAspectRatio: "xMidYMid"
         }, [
-          ke(i(P)),
+          ke(i(X)),
           t.$slots["chart-background"] ? (u(), n("foreignObject", {
             key: 0,
             x: l.value.left,
@@ -691,14 +712,14 @@ const kl = ["id"], Al = ["xmlns", "viewBox"], Ll = ["x", "y", "width", "height"]
               pointerEvents: "none"
             }
           }, [
-            C(t.$slots, "chart-background", {}, void 0, !0)
-          ], 8, Ll)) : y("", !0),
+            T(t.$slots, "chart-background", {}, void 0, !0)
+          ], 8, Ol)) : f("", !0),
           e.value.style.layout.cells.columnTotal.color.show ? (u(), n("g", {
             key: 1,
             ref_key: "xAxisSumRects",
             ref: Lt
           }, [
-            (u(!0), n(L, null, F(p.value.xTotals, (a, s) => (u(), n("rect", {
+            (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,
               y: l.value.top - l.value.sumCellXHeight + r.value * (_.value.height / _.value.width),
               height: l.value.sumCellXHeight,
@@ -706,8 +727,8 @@ const kl = ["id"], Al = ["xmlns", "viewBox"], Ll = ["x", "y", "width", "height"]
               fill: e.value.style.layout.cells.colors.underlayer,
               stroke: e.value.style.backgroundColor,
               "stroke-width": r.value
-            }, null, 8, Cl))), 256)),
-            (u(!0), n(L, null, F(p.value.xTotals, (a, s) => (u(), n("rect", {
+            }, 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,
               y: l.value.top - l.value.sumCellXHeight + r.value * (_.value.height / _.value.width),
               height: l.value.sumCellXHeight,
@@ -715,79 +736,79 @@ const kl = ["id"], Al = ["xmlns", "viewBox"], Ll = ["x", "y", "width", "height"]
               fill: a.color,
               stroke: e.value.style.backgroundColor,
               "stroke-width": r.value
-            }, null, 8, Tl))), 256))
-          ], 512)) : y("", !0),
-          f("g", {
+            }, null, 8, Rl))), 256))
+          ], 512)) : f("", !0),
+          p("g", {
             ref_key: "datapoints",
-            ref: wt
+            ref: kt
           }, [
-            (u(!0), n(L, null, F(Y.value, (a, s) => (u(), n(L, null, [
-              (u(!0), n(L, null, F(a.temperatures, (d, v) => (u(), n("g", null, [
-                f("rect", {
-                  x: l.value.left + l.value.cellSize.width * v + r.value / 2 + l.value.sumCellXHeight,
+            (u(!0), n(C, null, F(Y.value, (a, s) => (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,
                   width: l.value.cellSize.width - r.value,
                   height: l.value.cellSize.height - r.value,
                   fill: e.value.style.layout.cells.colors.underlayer,
                   stroke: e.value.style.backgroundColor,
                   "stroke-width": r.value
-                }, null, 8, _l),
-                f("rect", {
-                  x: l.value.left + l.value.cellSize.width * v + r.value / 2 + l.value.sumCellXHeight,
+                }, 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,
                   width: l.value.cellSize.width - r.value,
                   height: l.value.cellSize.height - r.value,
-                  fill: d.color,
+                  fill: v.color,
                   stroke: e.value.style.backgroundColor,
                   "stroke-width": r.value,
-                  onMouseover: (x) => Xt(d, s, l.value.left + l.value.cellSize.width * v, l.value.top + l.value.cellSize.height * s),
-                  onMouseout: () => Pt({ datapoint: d, seriesIndex: s }),
-                  onClick: () => Bt(d, s)
-                }, null, 40, Sl),
-                e.value.style.layout.cells.value.show ? yt((u(), n("text", {
+                  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)
+                }, null, 40, Nl),
+                e.value.style.layout.cells.value.show ? ft((u(), n("text", {
                   key: 0,
                   "text-anchor": "middle",
                   "font-size": e.value.style.layout.cells.value.fontSize,
                   "font-weight": e.value.style.layout.cells.value.bold ? "bold" : "normal",
-                  fill: i(Ae)(d.color),
-                  x: l.value.left + l.value.cellSize.width * v + l.value.cellSize.width / 2 + l.value.sumCellXHeight,
+                  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,
                   style: { pointerEvents: "none", userSelect: "none" }
                 }, [
-                  Pe(T(i(B)(
+                  Ve(S(i(B)(
                     e.value.style.layout.cells.value.formatter,
-                    d.value,
+                    v.value,
                     i(H)({
                       p: e.value.style.layout.dataLabels.prefix,
-                      v: d.value,
+                      v: v.value,
                       s: e.value.style.layout.dataLabels.suffix,
                       r: e.value.style.layout.cells.value.roundingValue
                     }),
-                    { datapoint: d }
+                    { datapoint: v }
                   )), 1)
-                ], 8, zl)), [
-                  [i(wl), {
+                ], 8, Dl)), [
+                  [i(_l), {
                     cellWidth: l.value.cellSize.width - r.value,
                     cellHeight: l.value.cellSize.height - r.value,
                     maxFontSize: e.value.style.layout.cells.value.fontSize,
                     minFontSize: 10,
-                    index: s * D.value + v,
-                    reportHide: Ht,
+                    index: s * N.value + c,
+                    reportHide: Pt,
                     reportRotation: Dt,
-                    hideAll: Nt.value,
-                    rotateAll: Ft.value
+                    hideAll: Ht.value,
+                    rotateAll: Nt.value
                   }]
-                ]) : y("", !0)
+                ]) : f("", !0)
               ]))), 256))
             ], 64))), 256))
           ], 512),
           e.value.style.layout.cells.rowTotal.color.show ? (u(), n("g", {
             key: 2,
             ref_key: "yAxisSumRects",
-            ref: At
+            ref: Ct
           }, [
-            (u(!0), n(L, null, F(Y.value, (a, s) => (u(), n(L, null, [
-              f("rect", {
+            (u(!0), n(C, null, F(Y.value, (a, s) => (u(), n(C, null, [
+              p("rect", {
                 x: l.value.left,
                 y: l.value.top + l.value.cellSize.height * s,
                 width: l.value.sumCellXHeight,
@@ -795,25 +816,25 @@ const kl = ["id"], Al = ["xmlns", "viewBox"], Ll = ["x", "y", "width", "height"]
                 fill: e.value.style.layout.cells.colors.underlayer,
                 stroke: e.value.style.backgroundColor,
                 "stroke-width": r.value
-              }, null, 8, $l),
-              f("rect", {
+              }, null, 8, Hl),
+              p("rect", {
                 x: l.value.left,
                 y: l.value.top + l.value.cellSize.height * s + r.value / 2,
                 width: l.value.sumCellXHeight,
                 height: l.value.cellSize.height - r.value,
-                fill: p.value.yTotals[s].color,
+                fill: g.value.yTotals[s].color,
                 stroke: e.value.style.backgroundColor,
                 "stroke-width": r.value
-              }, null, 8, Ml)
+              }, null, 8, Pl)
             ], 64))), 256))
-          ], 512)) : y("", !0),
+          ], 512)) : f("", !0),
           e.value.style.layout.dataLabels.yAxis.show ? (u(), n("g", {
             key: 3,
             ref_key: "yAxisLabels",
-            ref: Ge
+            ref: je
           }, [
-            (u(!0), n(L, null, F(Y.value, (a, s) => (u(), n(L, null, [
-              f("text", {
+            (u(!0), n(C, null, F(Y.value, (a, s) => (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,
@@ -821,7 +842,7 @@ const kl = ["id"], Al = ["xmlns", "viewBox"], Ll = ["x", "y", "width", "height"]
                 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),
                 "text-anchor": "end",
                 "font-weight": e.value.style.layout.dataLabels.yAxis.bold ? "bold" : "normal"
-              }, T(p.value.yLabels[s]), 9, Ol),
+              }, S(g.value.yLabels[s]), 9, Xl),
               e.value.style.layout.cells.rowTotal.value.show ? (u(), n("text", {
                 key: 0,
                 class: "vue-ui-heatmap-row-total",
@@ -831,15 +852,15 @@ const kl = ["id"], Al = ["xmlns", "viewBox"], Ll = ["x", "y", "width", "height"]
                 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,
                 "text-anchor": "end",
                 "font-weight": e.value.style.layout.dataLabels.yAxis.bold ? "bold" : "normal"
-              }, T(It(s)), 9, Rl)) : y("", !0)
+              }, S(Vt(s)), 9, Il)) : f("", !0)
             ], 64))), 256))
-          ], 512)) : y("", !0),
+          ], 512)) : f("", !0),
           e.value.style.layout.dataLabels.xAxis.show ? (u(), n("g", {
             key: 4,
             ref_key: "xAxisLabels",
-            ref: Se
+            ref: _e
           }, [
-            (u(!0), n(L, null, F(p.value.xLabels, (a, s) => (u(), n(L, null, [
+            (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", {
                 key: 0,
                 class: "vue-ui-heatmap-col-name",
@@ -847,26 +868,26 @@ const kl = ["id"], Al = ["xmlns", "viewBox"], Ll = ["x", "y", "width", "height"]
                 "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 / p.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})`
-              }, T(a), 9, Fl)) : y("", !0)
+                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})`
+              }, S(a), 9, Vl)) : f("", !0)
             ], 64))), 256))
-          ], 512)) : y("", !0),
+          ], 512)) : f("", !0),
           e.value.style.layout.cells.columnTotal.value.show ? (u(), n("g", {
             key: 5,
             ref_key: "xAxisSums",
             ref: ze
           }, [
-            (u(!0), n(L, null, F(p.value.xLabels, (a, s) => (u(), n("text", {
+            (u(!0), n(C, null, F(g.value.xLabels, (a, s) => (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 / p.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(Vt(s)), 9, Dl))), 256))
-          ], 512)) : y("", !0),
-          se.value ? (u(), n("g", Nl, [
-            f("rect", {
+              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})`
+            }, S(Bt(s)), 9, Bl))), 256))
+          ], 512)) : f("", !0),
+          se.value ? (u(), n("g", El, [
+            p("rect", {
               style: { "pointer-events": "none" },
               x: se.value.x - e.value.style.layout.cells.selected.border / 2 + r.value + l.value.sumCellXHeight,
               y: se.value.y - e.value.style.layout.cells.selected.border / 2 + r.value,
@@ -876,27 +897,27 @@ const kl = ["id"], Al = ["xmlns", "viewBox"], Ll = ["x", "y", "width", "height"]
               stroke: e.value.style.layout.cells.selected.color,
               "stroke-width": e.value.style.layout.cells.selected.border,
               rx: 1
-            }, null, 8, Hl)
-          ])) : y("", !0),
-          C(t.$slots, "svg", { svg: _.value }, void 0, !0)
-        ], 14, Al)),
+            }, null, 8, Ul)
+          ])) : f("", !0),
+          T(t.$slots, "svg", { svg: _.value }, void 0, !0)
+        ], 14, $l)),
         e.value.style.legend.show ? (u(), n("div", {
           key: 0,
           ref_key: "legendRight",
-          ref: kt,
+          ref: At,
           class: "vue-ui-heatmap-legend-right",
           style: w({
             "--legend-width": e.value.style.legend.width + "px"
           })
         }, [
-          i(pe) ? y("", !0) : (u(), n("div", {
+          i(pe) ? f("", !0) : (u(), n("div", {
             key: 0,
             class: "vue-ui-heatmap-legend-label-max",
             style: w({
               fontSize: e.value.style.legend.fontSize + "px",
               color: e.value.style.legend.color
             })
-          }, T(i(B)(
+          }, S(i(B)(
             e.value.style.layout.cells.value.formatter,
             i(E)(V.value),
             i(H)({
@@ -906,14 +927,14 @@ const kl = ["id"], Al = ["xmlns", "viewBox"], Ll = ["x", "y", "width", "height"]
               r: e.value.style.legend.roundingValue
             })
           )), 5)),
-          f("div", Xl, [
-            f("div", {
+          p("div", Yl, [
+            p("div", {
               class: "vue-ui-heatmap-gauge",
               style: w({
                 background: `linear-gradient(to bottom, ${e.value.style.layout.cells.colors.hot}, ${e.value.style.layout.cells.colors.cold})`
               })
             }, [
-              yt(f("div", {
+              ft(p("div", {
                 class: "vue-ui-heatmap-gauge-indicator",
                 "data-value": i(B)(
                   e.value.style.layout.cells.value.formatter,
@@ -939,7 +960,7 @@ const kl = ["id"], Al = ["xmlns", "viewBox"], Ll = ["x", "y", "width", "height"]
                   "--gauge-arrow-font-size": e.value.style.legend.fontSize + "px"
                 })
               }, [
-                f("div", Il, T(i(B)(
+                p("div", Wl, S(i(B)(
                   e.value.style.layout.cells.value.formatter,
                   i(E)(R.value),
                   i(H)({
@@ -949,19 +970,19 @@ const kl = ["id"], Al = ["xmlns", "viewBox"], Ll = ["x", "y", "width", "height"]
                     r: e.value.style.legend.roundingValue
                   })
                 )), 1)
-              ], 12, Pl), [
-                [Kt, ![void 0, null].includes(R.value)]
+              ], 12, Gl), [
+                [tl, ![void 0, null].includes(R.value)]
               ])
             ], 4)
           ]),
-          i(pe) ? y("", !0) : (u(), n("div", {
+          i(pe) ? f("", !0) : (u(), n("div", {
             key: 1,
             class: "vue-ui-heatmap-legend-label-min",
             style: w({
               fontSize: e.value.style.legend.fontSize + "px",
               color: e.value.style.legend.color
             })
-          }, T(i(B)(
+          }, S(i(B)(
             e.value.style.layout.cells.value.formatter,
             i(E)(ve.value),
             i(H)({
@@ -971,21 +992,21 @@ const kl = ["id"], Al = ["xmlns", "viewBox"], Ll = ["x", "y", "width", "height"]
               r: e.value.style.legend.roundingValue
             })
           )), 5))
-        ], 4)) : y("", !0)
+        ], 4)) : f("", !0)
       ], 2),
-      t.$slots.watermark ? (u(), n("div", Vl, [
-        C(t.$slots, "watermark", Z(ee({ isPrinting: i(Je) || i(Qe) })), void 0, !0)
-      ])) : y("", !0),
+      t.$slots.watermark ? (u(), n("div", jl, [
+        T(t.$slots, "watermark", Z(ee({ isPrinting: i(Qe) || i(Ze) })), void 0, !0)
+      ])) : f("", !0),
       t.$slots.source ? (u(), n("div", {
         key: 5,
         ref_key: "source",
-        ref: We,
+        ref: qe,
         dir: "auto"
       }, [
-        C(t.$slots, "source", {}, void 0, !0)
-      ], 512)) : y("", !0),
+        T(t.$slots, "source", {}, void 0, !0)
+      ], 512)) : f("", !0),
       ke(i(W), {
-        show: z.value.showTooltip && ae.value,
+        show: $.value.showTooltip && ae.value,
         backgroundColor: e.value.style.tooltip.backgroundColor,
         color: e.value.style.tooltip.color,
         borderRadius: e.value.style.tooltip.borderRadius,
@@ -995,7 +1016,7 @@ const kl = ["id"], Al = ["xmlns", "viewBox"], Ll = ["x", "y", "width", "height"]
         backgroundOpacity: e.value.style.tooltip.backgroundOpacity,
         position: e.value.style.tooltip.position,
         offsetY: e.value.style.tooltip.offsetY,
-        parent: O.value,
+        parent: L.value,
         content: q.value,
         isFullscreen: G.value,
         isCustom: e.value.style.tooltip.customFormat && typeof e.value.style.tooltip.customFormat == "function",
@@ -1004,37 +1025,37 @@ const kl = ["id"], Al = ["xmlns", "viewBox"], Ll = ["x", "y", "width", "height"]
         smoothForce: e.value.style.tooltip.smoothForce,
         smoothSnapThreshold: e.value.style.tooltip.smoothSnapThreshold
       }, {
-        "tooltip-before": S(() => [
-          C(t.$slots, "tooltip-before", Z(ee({ ...be.value })), void 0, !0)
+        "tooltip-before": z(() => [
+          T(t.$slots, "tooltip-before", Z(ee({ ...be.value })), void 0, !0)
         ]),
-        "tooltip-after": S(() => [
-          C(t.$slots, "tooltip-after", Z(ee({ ...be.value })), void 0, !0)
+        "tooltip-after": z(() => [
+          T(t.$slots, "tooltip-after", Z(ee({ ...be.value })), void 0, !0)
         ]),
         _: 3
       }, 8, ["show", "backgroundColor", "color", "borderRadius", "borderColor", "borderWidth", "fontSize", "backgroundOpacity", "position", "offsetY", "parent", "content", "isFullscreen", "isCustom", "smooth", "backdropFilter", "smoothForce", "smoothSnapThreshold"]),
-      j.value && e.value.userOptions.buttons.table ? (u(), de(Jt(xe.value.component), Qt({ key: 6 }, xe.value.props, {
+      j.value && e.value.userOptions.buttons.table ? (u(), de(ll(xe.value.component), al({ key: 6 }, xe.value.props, {
         ref_key: "tableUnit",
         ref: ue,
-        onClose: Ne
-      }), ht({
-        content: S(() => [
-          f("div", {
+        onClose: He
+      }), yt({
+        content: z(() => [
+          p("div", {
             ref_key: "tableContainer",
-            ref: Be,
+            ref: Ue,
             class: "vue-ui-heatmap-table atom-data-table",
             style: w(`${e.value.table.useDialog ? "" : "max-height: 300px; margin-top: 24px;"}`)
           }, [
-            f("div", {
+            p("div", {
               style: w(`width:100%;overflow-x:auto;position:relative;${e.value.table.useDialog ? "" : "padding-top:36px"};`),
-              class: ce({ "vue-ui-responsive": i(Yt) })
+              class: ce({ "vue-ui-responsive": i(Gt) })
             }, [
-              e.value.table.useDialog ? y("", !0) : (u(), n("div", {
+              e.value.table.useDialog ? f("", !0) : (u(), n("div", {
                 key: 0,
                 role: "button",
                 tabindex: "0",
                 style: w(`width:32px; position: absolute; top: 0; left:4px; padding: 0 0px; display: flex; align-items:center;justify-content:center;height: 36px; width: 32px; cursor:pointer; background:${e.value.table.th.backgroundColor};`),
-                onClick: Ne,
-                onKeypress: Zt(Ne, ["enter"])
+                onClick: He,
+                onKeypress: ol(He, ["enter"])
               }, [
                 ke(i(te), {
                   name: "close",
@@ -1042,48 +1063,48 @@ const kl = ["id"], Al = ["xmlns", "viewBox"], Ll = ["x", "y", "width", "height"]
                   "stroke-width": 2
                 }, null, 8, ["stroke"])
               ], 36)),
-              f("table", Bl, [
-                e.value.table.useDialog ? y("", !0) : (u(), n("caption", {
+              p("table", ql, [
+                e.value.table.useDialog ? f("", !0) : (u(), n("caption", {
                   key: 0,
                   style: w(`backgroundColor:${e.value.table.th.backgroundColor};color:${e.value.table.th.color};outline:${e.value.table.th.outline}`)
                 }, [
-                  Pe(T(e.value.style.title.text) + " ", 1),
-                  e.value.style.title.subtitle.text ? (u(), n("span", El, T(e.value.style.title.subtitle.text), 1)) : y("", !0)
+                  Ve(S(e.value.style.title.text) + " ", 1),
+                  e.value.style.title.subtitle.text ? (u(), n("span", Kl, S(e.value.style.title.subtitle.text), 1)) : f("", !0)
                 ], 4)),
-                f("thead", null, [
-                  f("tr", {
+                p("thead", null, [
+                  p("tr", {
                     role: "row",
                     style: w(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color}`)
                   }, [
-                    f("th", {
+                    p("th", {
                       style: w(`outline:${e.value.table.th.outline};padding-right:6px`)
                     }, null, 4),
-                    (u(!0), n(L, null, F(b.dataset, (a, s) => (u(), n("th", {
+                    (u(!0), n(C, null, F(b.dataset, (a, s) => (u(), n("th", {
                       align: "right",
                       style: w(`outline:${e.value.table.th.outline};padding-right:6px`)
-                    }, T(a.name), 5))), 256))
+                    }, S(a.name), 5))), 256))
                   ], 4)
                 ]),
-                f("tbody", null, [
-                  (u(!0), n(L, null, F(p.value.xLabels, (a, s) => (u(), n("tr", {
+                p("tbody", null, [
+                  (u(!0), n(C, null, F(g.value.xLabels, (a, s) => (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 }),
                     style: w(`background:${e.value.table.td.backgroundColor};color:${e.value.table.td.color}`)
                   }, [
-                    f("td", {
+                    p("td", {
                       "data-cell": e.value.table.colNames.xAxis,
                       class: "vue-ui-data-table__tbody__td",
                       style: w(`outline:${e.value.table.td.outline}`)
                     }, [
-                      f("div", Yl, T(a), 1)
-                    ], 12, Ul),
-                    (u(!0), n(L, null, F(b.dataset, (d, v) => (u(), n("td", {
+                      p("div", Ql, S(a), 1)
+                    ], 12, Jl),
+                    (u(!0), n(C, null, F(b.dataset, (v, c) => (u(), n("td", {
                       class: "vue-ui-data-table__tbody__td",
-                      "data-cell": b.dataset[v].name,
+                      "data-cell": b.dataset[c].name,
                       style: w(`outline:${e.value.table.td.outline}`)
                     }, [
-                      f("div", Wl, T(isNaN(d.values[s]) ? "-" : i(H)({ p: e.value.style.layout.dataLabels.prefix, v: d.values[s], s: e.value.style.layout.dataLabels.suffix, r: e.value.table.td.roundingValue })), 1)
-                    ], 12, Gl))), 256))
+                      p("div", ea, S(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)
+                    ], 12, Zl))), 256))
                   ], 6))), 256))
                 ])
               ])
@@ -1094,18 +1115,18 @@ const kl = ["id"], Al = ["xmlns", "viewBox"], Ll = ["x", "y", "width", "height"]
       }, [
         e.value.table.useDialog ? {
           name: "title",
-          fn: S(() => [
-            Pe(T(xe.value.title), 1)
+          fn: z(() => [
+            Ve(S(xe.value.title), 1)
           ]),
           key: "0"
         } : void 0,
         e.value.table.useDialog ? {
           name: "actions",
-          fn: S(() => [
-            f("button", {
+          fn: z(() => [
+            p("button", {
               tabindex: "0",
               class: "vue-ui-user-options-button",
-              onClick: o[0] || (o[0] = (a) => Fe(e.value.userOptions.callbacks.csv))
+              onClick: o[0] || (o[0] = (a) => Ne(e.value.userOptions.callbacks.csv))
             }, [
               ke(i(te), {
                 name: "excel",
@@ -1115,11 +1136,11 @@ const kl = ["id"], Al = ["xmlns", "viewBox"], Ll = ["x", "y", "width", "height"]
           ]),
           key: "1"
         } : void 0
-      ]), 1040)) : y("", !0),
-      i(pe) ? (u(), de(dl, { key: 7 })) : y("", !0)
-    ], 46, kl));
+      ]), 1040)) : f("", !0),
+      i(pe) ? (u(), de(bl, { key: 7 })) : f("", !0)
+    ], 46, zl));
   }
-}, ca = /* @__PURE__ */ xl(jl, [["__scopeId", "data-v-b8c90b2a"]]);
+}, ma = /* @__PURE__ */ Sl(ta, [["__scopeId", "data-v-39916842"]]);
 export {
-  ca as default
+  ma as default
 };