vue-data-ui 2.12.6 → 2.12.7-beta.0

package/dist/{vue-ui-dumbbell-DTKLLd1N.js → vue-ui-dumbbell-C8Lokx-F.js}

@@ -1,22 +1,17 @@
-import { computed as g, ref as d, watch as fe, onMounted as be, onBeforeUnmount as Ie, createElementBlock as r, openBlock as o, unref as u, normalizeStyle as F, normalizeClass as ge, createBlock as L, createCommentVNode as v, createElementVNode as i, createSlots as Ge, withCtx as _, renderSlot as m, normalizeProps as V, guardReactiveProps as E, createVNode as Me, Fragment as C, renderList as $, toDisplayString as A, createTextVNode as me, nextTick as De } from "vue";
-import { u as Fe, c as pe, a as Ve, o as Ee, e as _e, g as Re, v as ke, D as He, f as z, X as xe, i as B, l as we, h as Ce, q as We, r as Ue } from "./index-BFzQMJda.js";
-import { t as Be, u as je } from "./useResponsive-JZ9xq-JV.js";
-import { _ as qe } from "./Title-CzaCeCOm.js";
-import { u as Ye, U as Ze } from "./usePrinter-C5bLp34h.js";
-import { D as Je } from "./DataTable-Rajdtaf6.js";
-import Ke from "./vue-ui-skeleton-B_YI7Yuc.js";
-import { L as Qe } from "./Legend-BxtDQCIv.js";
-import et from "./vue-ui-accordion-BUz4JIIX.js";
-import { u as $e } from "./useNestedProp-v7KPpwuP.js";
-import { _ as tt } from "./PackageVersion-BjrblLPQ.js";
-import { _ as lt } from "./PenAndPaper-BkP3J-Ft.js";
-import { u as at } from "./useUserOptionState-BIvW1Kz7.js";
-import { u as st } from "./useChartAccessibility-BWojgys7.js";
-import { _ as ot } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const rt = ["id"], nt = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"], it = { key: 1 }, ct = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], dt = { key: 2 }, vt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], ht = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], yt = { key: 3 }, ft = ["x", "y", "font-size", "fill", "font-weight"], bt = ["x", "y", "font-size", "fill"], gt = { key: 4 }, mt = ["x", "y", "font-size", "fill", "font-weight"], pt = ["id"], _t = ["stop-color"], kt = ["stop-color"], xt = ["stop-color"], wt = ["id"], Ct = ["stop-color"], $t = ["stop-color"], Lt = ["stop-color"], At = ["id"], zt = ["stop-color"], St = ["stop-color"], Xt = ["id"], Nt = ["stop-color"], Tt = ["stop-color"], Ot = { key: 0 }, Pt = ["d", "fill"], It = { key: 1 }, Gt = ["x", "y", "height", "width", "fill"], Mt = ["cx", "cy", "r", "fill", "stroke", "stroke-width"], Dt = ["cx", "cy", "r", "fill", "stroke", "stroke-width"], Ft = { key: 5 }, Vt = ["x", "y", "fill", "font-size"], Et = { key: 6 }, Rt = ["x", "y", "fill", "font-size"], Ht = {
+import { defineAsyncComponent as T, computed as g, ref as d, watch as ge, shallowRef as pe, onMounted as me, onBeforeUnmount as We, createElementBlock as r, openBlock as o, unref as n, normalizeStyle as E, normalizeClass as ke, createBlock as A, createCommentVNode as v, createElementVNode as i, createSlots as Ue, withCtx as k, renderSlot as p, normalizeProps as R, guardReactiveProps as H, createVNode as Be, Fragment as $, renderList as L, toDisplayString as z, createTextVNode as _e, nextTick as je } from "vue";
+import { u as qe, c as xe, a as Ye, o as Ze, e as we, g as Je, v as Ce, D as Ke, f as S, X as $e, i as q, l as Le, h as Ae, q as Qe, r as et } from "./index-BiHmNd1-.js";
+import { t as tt, u as lt } from "./useResponsive-JZ9xq-JV.js";
+import { u as ze } from "./useNestedProp-tRqS0ZAM.js";
+import { u as at } from "./usePrinter-CRCbl1WG.js";
+import { u as st } from "./useUserOptionState-BIvW1Kz7.js";
+import { u as ot } from "./useChartAccessibility-9icAAmYg.js";
+import rt from "./Legend-DFunFf8i.js";
+import nt from "./Title-B5qqUI3M.js";
+import { _ as ut } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const it = ["id"], ct = ["xmlns", "viewBox"], dt = ["x", "y", "width", "height"], vt = { key: 1 }, ht = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], yt = { key: 2 }, ft = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], bt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], gt = { key: 3 }, pt = ["x", "y", "font-size", "fill", "font-weight"], mt = ["x", "y", "font-size", "fill"], kt = { key: 4 }, _t = ["x", "y", "font-size", "fill", "font-weight"], xt = ["id"], wt = ["stop-color"], Ct = ["stop-color"], $t = ["stop-color"], Lt = ["id"], At = ["stop-color"], zt = ["stop-color"], St = ["stop-color"], Xt = ["id"], Nt = ["stop-color"], Tt = ["stop-color"], Pt = ["id"], Ot = ["stop-color"], Mt = ["stop-color"], It = { key: 0 }, Gt = ["d", "fill"], Dt = { key: 1 }, Ft = ["x", "y", "height", "width", "fill"], Vt = ["cx", "cy", "r", "fill", "stroke", "stroke-width"], Et = ["cx", "cy", "r", "fill", "stroke", "stroke-width"], Rt = { key: 5 }, Ht = ["x", "y", "fill", "font-size"], Wt = { key: 6 }, Ut = ["x", "y", "fill", "font-size"], Bt = {
   key: 5,
   class: "vue-data-ui-watermark"
-}, Wt = ["xmlns", "height", "width"], Ut = ["fill"], Bt = ["innerHTML"], jt = {
+}, jt = ["xmlns", "height", "width"], qt = ["fill"], Yt = ["innerHTML"], Zt = {
   __name: "vue-ui-dumbbell",
   props: {
     config: {
@@ -33,144 +28,144 @@ const rt = ["id"], nt = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
     }
   },
   emits: ["selectDatapoint"],
-  setup(Le, { expose: Ae, emit: qt }) {
-    const { vue_ui_dumbbell: ze } = Fe(), b = Le, S = g({
+  setup(Se, { expose: Xe, emit: Jt }) {
+    const Ne = T(() => import("./vue-ui-accordion-CmCs2yR2.js")), Te = T(() => import("./DataTable-Cv9CIz-a.js")), Pe = T(() => import("./PackageVersion-CLY-udAA.js")), Oe = T(() => import("./PenAndPaper-B9na2mbr.js")), Me = T(() => import("./vue-ui-skeleton-CbYQYRvD.js")), Ie = T(() => import("./UserOptions-Ddy6CuLC.js")), { vue_ui_dumbbell: Ge } = qe(), b = Se, X = g({
       get() {
         return !!b.dataset && b.dataset.length;
       },
       set(l) {
         return l;
       }
-    }), y = d(pe()), j = d(0), O = d(null), q = d(null), Y = d(null), Z = d(null), J = d(null), K = d(0), Q = d(0), ee = d(0), e = g({
-      get: () => se(),
+    }), y = d(xe()), Y = d(0), I = d(null), Z = d(null), J = d(null), K = d(null), Q = d(null), ee = d(0), te = d(0), le = d(0), e = g({
+      get: () => re(),
       set: (l) => l
-    }), { userOptionsVisible: R, setUserOptionsVisibility: te, keepUserOptionState: le } = at({ config: e.value }), { svgRef: ae } = st({ config: e.value.style.chart.title });
-    function se() {
-      const l = $e({
+    }), { userOptionsVisible: W, setUserOptionsVisibility: ae, keepUserOptionState: se } = st({ config: e.value }), { svgRef: oe } = ot({ config: e.value.style.chart.title });
+    function re() {
+      const l = ze({
         userConfig: b.config,
-        defaultConfig: ze
+        defaultConfig: Ge
       });
       return l.theme ? {
-        ...$e({
-          userConfig: Ve.vue_ui_dumbbell[l.theme] || b.config,
+        ...ze({
+          userConfig: Ye.vue_ui_dumbbell[l.theme] || b.config,
           defaultConfig: l
         })
       } : l;
     }
-    fe(() => b.config, (l) => {
-      e.value = se(), R.value = !e.value.userOptions.showOnChartHover, oe(), K.value += 1, Q.value += 1, ee.value += 1, h.value = e.value.style.chart.rowHeight, N.value = e.value.style.chart.width, X.value.showTable = e.value.table.show;
-    }, { deep: !0 }), fe(() => b.dataset, (l) => {
-      de();
+    ge(() => b.config, (l) => {
+      e.value = re(), W.value = !e.value.userOptions.showOnChartHover, ne(), ee.value += 1, te.value += 1, le.value += 1, h.value = e.value.style.chart.rowHeight, O.value = e.value.style.chart.width, P.value.showTable = e.value.table.show;
+    }, { deep: !0 }), ge(() => b.dataset, (l) => {
+      he();
     }, { deep: !0 });
-    const P = d(null);
-    be(() => {
-      oe();
+    const _ = pe(null), N = pe(null);
+    me(() => {
+      ne();
     });
-    function oe() {
-      if (Ee(b.dataset) ? _e({
+    function ne() {
+      if (Ze(b.dataset) ? we({
         componentName: "VueUiDumbbell",
         type: "dataset"
-      }) : b.dataset.forEach((l, n) => {
-        Re({
+      }) : b.dataset.forEach((l, u) => {
+        Je({
           datasetObject: l,
           requiredAttributes: ["name", "start", "end"]
         }).forEach((t) => {
-          S.value = !1, _e({
+          X.value = !1, we({
             componentName: "VueUiDumbbell",
             type: "datasetSerieAttribute",
             property: t,
-            index: n
+            index: u
           });
         });
       }), e.value.responsive) {
-        const l = Be(() => {
-          const { width: n, height: t } = je({
-            chart: O.value,
-            title: e.value.style.chart.title.text ? q.value : null,
-            legend: e.value.style.chart.legend.show ? Y.value : null,
-            source: Z.value,
-            noTitle: J.value
+        const l = tt(() => {
+          const { width: u, height: t } = lt({
+            chart: I.value,
+            title: e.value.style.chart.title.text ? Z.value : null,
+            legend: e.value.style.chart.legend.show ? J.value : null,
+            source: K.value,
+            noTitle: Q.value
           });
           requestAnimationFrame(() => {
-            N.value = n, h.value = t / b.dataset.length, f.value = I();
+            O.value = u, h.value = t / b.dataset.length, f.value = G();
           });
         });
-        P.value = new ResizeObserver(l), P.value.observe(O.value.parentNode);
+        _.value && (N.value && _.value.unobserve(N.value), _.value.disconnect()), _.value = new ResizeObserver(l), N.value = I.value.parentNode, _.value.observe(N.value);
       }
     }
-    Ie(() => {
-      P.value && P.value.disconnect();
+    We(() => {
+      _.value && (N.value && _.value.unobserve(N.value), _.value.disconnect());
     });
-    const { isPrinting: re, isImaging: ne, generatePdf: ue, generateImage: ie } = Ye({
+    const { isPrinting: ue, isImaging: ie, generatePdf: ce, generateImage: de } = at({
       elementId: `dumbbell_${y.value}`,
       fileName: e.value.style.chart.title.text || "vue-ui-dumbbell",
       options: e.value.userOptions.print
-    }), Se = g(() => e.value.userOptions.show && !e.value.style.chart.title.text), X = d({
+    }), De = g(() => e.value.userOptions.show && !e.value.style.chart.title.text), P = d({
       showTable: e.value.table.show
-    }), k = g(() => b.dataset.map((l, n) => ({
+    }), x = g(() => b.dataset.map((l, u) => ({
       ...l,
-      start: ke(l.start),
-      end: ke(l.end),
-      id: pe()
-    }))), H = g(() => ({
-      max: Math.max(...k.value.flatMap((l) => [l.start, l.end])),
-      min: Math.min(...k.value.flatMap((l) => [l.start, l.end]))
-    })), c = g(() => He(H.value.min < 0 ? H.value.min : 0, H.value.max, e.value.style.chart.grid.scaleSteps)), h = d(e.value.style.chart.rowHeight), N = d(e.value.style.chart.width), s = g(() => {
-      const l = h.value, n = e.value.style.chart.padding.left + e.value.style.chart.padding.right + N.value, t = e.value.style.chart.padding.top + e.value.style.chart.padding.bottom + l * b.dataset.length, a = c.value.ticks.length * (N.value / c.value.ticks.length);
+      start: Ce(l.start),
+      end: Ce(l.end),
+      id: xe()
+    }))), U = g(() => ({
+      max: Math.max(...x.value.flatMap((l) => [l.start, l.end])),
+      min: Math.min(...x.value.flatMap((l) => [l.start, l.end]))
+    })), c = g(() => Ke(U.value.min < 0 ? U.value.min : 0, U.value.max, e.value.style.chart.grid.scaleSteps)), h = d(e.value.style.chart.rowHeight), O = d(e.value.style.chart.width), s = g(() => {
+      const l = h.value, u = e.value.style.chart.padding.left + e.value.style.chart.padding.right + O.value, t = e.value.style.chart.padding.top + e.value.style.chart.padding.bottom + l * b.dataset.length, a = c.value.ticks.length * (O.value / c.value.ticks.length);
       return {
         left: e.value.style.chart.padding.left,
-        right: n - e.value.style.chart.padding.right,
+        right: u - e.value.style.chart.padding.right,
         top: e.value.style.chart.padding.top,
         bottom: t - e.value.style.chart.padding.bottom,
-        width: N.value,
+        width: O.value,
         height: l * b.dataset.length,
         rowHeight: l,
         absoluteHeight: t,
-        absoluteWidth: n,
+        absoluteWidth: u,
         widthPlotReference: a
       };
     });
-    function I() {
-      return k.value.map((l, n) => {
-        const t = s.value.left + (l.start + Math.abs(c.value.min)) / (c.value.max + Math.abs(c.value.min)) * s.value.widthPlotReference, a = s.value.left + (l.end + Math.abs(c.value.min)) / (c.value.max + Math.abs(c.value.min)) * s.value.widthPlotReference, p = t + (a - t) / 2;
+    function G() {
+      return x.value.map((l, u) => {
+        const t = s.value.left + (l.start + Math.abs(c.value.min)) / (c.value.max + Math.abs(c.value.min)) * s.value.widthPlotReference, a = s.value.left + (l.end + Math.abs(c.value.min)) / (c.value.max + Math.abs(c.value.min)) * s.value.widthPlotReference, m = t + (a - t) / 2;
         return {
           ...l,
           startX: t,
           endX: a,
-          centerX: p,
-          y: s.value.top + n * h.value + h.value / 2,
+          centerX: m,
+          y: s.value.top + u * h.value + h.value / 2,
           endVal: l.start
         };
       });
     }
-    const f = d([]), ce = d(null), Xe = g(() => k.value.map((l) => l.end).reduce((l, n) => l + n, 0));
-    be(() => {
-      de();
+    const f = d([]), ve = d(null), Fe = g(() => x.value.map((l) => l.end).reduce((l, u) => l + u, 0));
+    me(() => {
+      he();
     });
-    function de() {
-      f.value = I();
+    function he() {
+      f.value = G();
       let l = f.value.map((t) => t.start).reduce((t, a) => t + a, 0);
-      function n() {
-        const t = k.value.map((a) => a.end - a.start);
-        l >= Xe.value ? (cancelAnimationFrame(ce.value), f.value = I()) : (f.value = f.value.map((a, p) => {
-          a.endVal += t[p] * (e.value.animationSpeed / 100);
-          const w = s.value.left + (a.start + Math.abs(c.value.min)) / (c.value.max + Math.abs(c.value.min)) * s.value.widthPlotReference, D = s.value.left + (a.endVal + Math.abs(c.value.min)) / (c.value.max + Math.abs(c.value.min)) * s.value.widthPlotReference, U = w + (D - w) / 2;
+      function u() {
+        const t = x.value.map((a) => a.end - a.start);
+        l >= Fe.value ? (cancelAnimationFrame(ve.value), f.value = G()) : (f.value = f.value.map((a, m) => {
+          a.endVal += t[m] * (e.value.animationSpeed / 100);
+          const C = s.value.left + (a.start + Math.abs(c.value.min)) / (c.value.max + Math.abs(c.value.min)) * s.value.widthPlotReference, V = s.value.left + (a.endVal + Math.abs(c.value.min)) / (c.value.max + Math.abs(c.value.min)) * s.value.widthPlotReference, j = C + (V - C) / 2;
           return {
             ...a,
-            startX: w,
-            endX: D,
-            centerX: U,
-            y: s.value.top + p * h.value + h.value / 2,
+            startX: C,
+            endX: V,
+            centerX: j,
+            y: s.value.top + m * h.value + h.value / 2,
             endVal: a.endVal
           };
-        }), l = f.value.map((a) => a.endVal).reduce((a, p) => a + p, 0), ce.value = requestAnimationFrame(n));
+        }), l = f.value.map((a) => a.endVal).reduce((a, m) => a + m, 0), ve.value = requestAnimationFrame(u));
       }
-      e.value.useAnimation ? n() : f.value = I();
+      e.value.useAnimation ? u() : f.value = G();
     }
-    const ve = g(() => [
+    const ye = g(() => [
       { name: e.value.style.chart.legend.labelStart, color: e.value.style.chart.plots.gradient.show ? `url(#start_grad_${y.value})` : e.value.style.chart.plots.startColor },
       { name: e.value.style.chart.legend.labelEnd, color: e.value.style.chart.plots.gradient.show ? `url(#end_grad_${y.value})` : e.value.style.chart.plots.endColor }
-    ]), Ne = g(() => ({
+    ]), Ve = g(() => ({
       cy: "donut-div-legend",
       backgroundColor: e.value.style.chart.legend.backgroundColor,
       color: e.value.style.chart.legend.color,
@@ -178,41 +173,41 @@ const rt = ["id"], nt = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
       paddingBottom: 12,
       paddingTop: 12,
       fontWeight: e.value.style.chart.legend.bold ? "bold" : ""
-    })), x = g(() => {
+    })), w = g(() => {
       const l = f.value.map((t) => ({
         name: t.name
-      })), n = f.value.map((t) => ({
+      })), u = f.value.map((t) => ({
         start: t.start,
         end: t.end
       }));
-      return { head: l, body: n };
-    }), G = g(() => {
+      return { head: l, body: u };
+    }), D = g(() => {
       const l = [
         e.value.table.columnNames.series,
         e.value.table.columnNames.start,
         e.value.table.columnNames.end,
         e.value.table.columnNames.progression
-      ], n = x.value.head.map((p, w) => {
-        const D = z({
+      ], u = w.value.head.map((m, C) => {
+        const V = S({
           p: e.value.style.chart.labels.prefix,
-          v: x.value.body[w].start,
+          v: w.value.body[C].start,
           s: e.value.style.chart.labels.suffix,
           r: e.value.table.td.roundingValue
-        }), U = z({
+        }), j = S({
           p: e.value.style.chart.labels.prefix,
-          v: x.value.body[w].end,
+          v: w.value.body[C].end,
           s: e.value.style.chart.labels.suffix,
           r: e.value.table.td.roundingValue
-        }), Pe = z({
-          v: 100 * (x.value.body[w].end / x.value.body[w].start - 1),
+        }), He = S({
+          v: 100 * (w.value.body[C].end / w.value.body[C].start - 1),
           s: "%",
           r: e.value.table.td.roundingPercentage
         });
         return [
-          { name: p.name },
-          D,
-          U,
-          Pe
+          { name: m.name },
+          V,
+          j,
+          He
         ];
       }), t = {
         th: {
@@ -235,71 +230,71 @@ const rt = ["id"], nt = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
           e.value.table.columnNames.progression
         ],
         head: l,
-        body: n,
+        body: u,
         config: t
       };
     });
-    function he() {
-      De(() => {
-        const l = x.value.head.map((a, p) => [[
+    function fe() {
+      je(() => {
+        const l = w.value.head.map((a, m) => [[
           a.name
-        ], [x.value.body[p].start], [x.value.body[p].end]]), n = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [[e.value.table.columnNames.series], [e.value.table.columnNames.start], [e.value.table.columnNames.end]]].concat(l), t = We(n);
-        Ue({ csvContent: t, title: e.value.style.chart.title.text || "vue-ui-dumbbell" });
+        ], [w.value.body[m].start], [w.value.body[m].end]]), u = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [[e.value.table.columnNames.series], [e.value.table.columnNames.start], [e.value.table.columnNames.end]]].concat(l), t = Qe(u);
+        et({ csvContent: t, title: e.value.style.chart.title.text || "vue-ui-dumbbell" });
       });
     }
-    const T = d(!1);
-    function Te(l) {
-      T.value = l, j.value += 1;
+    const M = d(!1);
+    function Ee(l) {
+      M.value = l, Y.value += 1;
     }
-    function Oe() {
+    function Re() {
       return f.value;
     }
-    function ye() {
-      X.value.showTable = !X.value.showTable;
+    function be() {
+      P.value.showTable = !P.value.showTable;
     }
-    const M = d(!1);
-    function W() {
-      M.value = !M.value;
+    const F = d(!1);
+    function B() {
+      F.value = !F.value;
     }
-    return Ae({
-      getData: Oe,
-      generatePdf: ue,
-      generateCsv: he,
-      generateImage: ie,
-      toggleTable: ye,
-      toggleAnnotator: W
-    }), (l, n) => (o(), r("div", {
+    return Xe({
+      getData: Re,
+      generatePdf: ce,
+      generateCsv: fe,
+      generateImage: de,
+      toggleTable: be,
+      toggleAnnotator: B
+    }), (l, u) => (o(), r("div", {
       ref_key: "dumbbellChart",
-      ref: O,
-      class: ge(`vue-ui-dumbbell ${T.value ? "vue-data-ui-wrapper-fullscreen" : ""}`),
-      style: F(`font-family:${e.value.style.fontFamily};width:100%; text-align:center;background:${e.value.style.chart.backgroundColor};${e.value.responsive ? "height:100%" : ""}`),
+      ref: I,
+      class: ke(`vue-ui-dumbbell ${M.value ? "vue-data-ui-wrapper-fullscreen" : ""}`),
+      style: E(`font-family:${e.value.style.fontFamily};width:100%; text-align:center;background:${e.value.style.chart.backgroundColor};${e.value.responsive ? "height:100%" : ""}`),
       id: `dumbbell_${y.value}`,
-      onMouseenter: n[1] || (n[1] = () => u(te)(!0)),
-      onMouseleave: n[2] || (n[2] = () => u(te)(!1))
+      onMouseenter: u[1] || (u[1] = () => n(ae)(!0)),
+      onMouseleave: u[2] || (u[2] = () => n(ae)(!1))
     }, [
-      e.value.userOptions.buttons.annotator ? (o(), L(lt, {
+      e.value.userOptions.buttons.annotator ? (o(), A(n(Oe), {
         key: 0,
-        svgRef: u(ae),
+        svgRef: n(oe),
         backgroundColor: e.value.style.chart.backgroundColor,
         color: e.value.style.chart.color,
-        active: M.value,
-        onClose: W
+        active: F.value,
+        onClose: B
       }, null, 8, ["svgRef", "backgroundColor", "color", "active"])) : v("", !0),
-      Se.value ? (o(), r("div", {
+      De.value ? (o(), r("div", {
         key: 1,
         ref_key: "noTitle",
-        ref: J,
+        ref: Q,
         class: "vue-data-ui-no-title-space",
         style: "height:36px; width: 100%;background:transparent"
       }, null, 512)) : v("", !0),
       e.value.style.chart.title.text ? (o(), r("div", {
         key: 2,
         ref_key: "chartTitle",
-        ref: q,
+        ref: Z,
         style: "width:100%;background:transparent;padding-bottom:24px"
       }, [
-        (o(), L(qe, {
-          key: `title_${K.value}`,
+        (o(), A(nt, {
+          key: `title_${ee.value}`,
           config: {
             title: {
               cy: "donut-div-title",
@@ -312,109 +307,109 @@ const rt = ["id"], nt = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
           }
         }, null, 8, ["config"]))
       ], 512)) : v("", !0),
-      e.value.userOptions.show && S.value && (u(le) || u(R)) ? (o(), L(Ze, {
+      e.value.userOptions.show && X.value && (n(se) || n(W)) ? (o(), A(n(Ie), {
         ref: "details",
-        key: `user_option_${j.value}`,
+        key: `user_option_${Y.value}`,
         backgroundColor: e.value.style.chart.backgroundColor,
         color: e.value.style.chart.color,
-        isPrinting: u(re),
-        isImaging: u(ne),
+        isPrinting: n(ue),
+        isImaging: n(ie),
         uid: y.value,
         hasPdf: e.value.userOptions.buttons.pdf,
         hasXls: e.value.userOptions.buttons.csv,
         hasImg: e.value.userOptions.buttons.img,
         hasTable: e.value.userOptions.buttons.table,
         hasFullscreen: e.value.userOptions.buttons.fullscreen,
-        isFullscreen: T.value,
+        isFullscreen: M.value,
         titles: { ...e.value.userOptions.buttonTitles },
-        chartElement: O.value,
+        chartElement: I.value,
         position: e.value.userOptions.position,
         hasAnnotator: e.value.userOptions.buttons.annotator,
-        isAnnotation: M.value,
-        onToggleFullscreen: Te,
-        onGeneratePdf: u(ue),
-        onGenerateCsv: he,
-        onGenerateImage: u(ie),
-        onToggleTable: ye,
-        onToggleAnnotator: W,
-        style: F({
-          visibility: u(le) ? u(R) ? "visible" : "hidden" : "visible"
+        isAnnotation: F.value,
+        onToggleFullscreen: Ee,
+        onGeneratePdf: n(ce),
+        onGenerateCsv: fe,
+        onGenerateImage: n(de),
+        onToggleTable: be,
+        onToggleAnnotator: B,
+        style: E({
+          visibility: n(se) ? n(W) ? "visible" : "hidden" : "visible"
         })
-      }, Ge({ _: 2 }, [
+      }, Ue({ _: 2 }, [
         l.$slots.menuIcon ? {
           name: "menuIcon",
-          fn: _(({ isOpen: t, color: a }) => [
-            m(l.$slots, "menuIcon", V(E({ isOpen: t, color: a })), void 0, !0)
+          fn: k(({ isOpen: t, color: a }) => [
+            p(l.$slots, "menuIcon", R(H({ isOpen: t, color: a })), void 0, !0)
           ]),
           key: "0"
         } : void 0,
         l.$slots.optionPdf ? {
           name: "optionPdf",
-          fn: _(() => [
-            m(l.$slots, "optionPdf", {}, void 0, !0)
+          fn: k(() => [
+            p(l.$slots, "optionPdf", {}, void 0, !0)
           ]),
           key: "1"
         } : void 0,
         l.$slots.optionCsv ? {
           name: "optionCsv",
-          fn: _(() => [
-            m(l.$slots, "optionCsv", {}, void 0, !0)
+          fn: k(() => [
+            p(l.$slots, "optionCsv", {}, void 0, !0)
           ]),
           key: "2"
         } : void 0,
         l.$slots.optionImg ? {
           name: "optionImg",
-          fn: _(() => [
-            m(l.$slots, "optionImg", {}, void 0, !0)
+          fn: k(() => [
+            p(l.$slots, "optionImg", {}, void 0, !0)
           ]),
           key: "3"
         } : void 0,
         l.$slots.optionTable ? {
           name: "optionTable",
-          fn: _(() => [
-            m(l.$slots, "optionTable", {}, void 0, !0)
+          fn: k(() => [
+            p(l.$slots, "optionTable", {}, void 0, !0)
           ]),
           key: "4"
         } : void 0,
         l.$slots.optionFullscreen ? {
           name: "optionFullscreen",
-          fn: _(({ toggleFullscreen: t, isFullscreen: a }) => [
-            m(l.$slots, "optionFullscreen", V(E({ toggleFullscreen: t, isFullscreen: a })), void 0, !0)
+          fn: k(({ toggleFullscreen: t, isFullscreen: a }) => [
+            p(l.$slots, "optionFullscreen", R(H({ toggleFullscreen: t, isFullscreen: a })), void 0, !0)
           ]),
           key: "5"
         } : void 0,
         l.$slots.optionAnnotator ? {
           name: "optionAnnotator",
-          fn: _(({ toggleAnnotator: t, isAnnotator: a }) => [
-            m(l.$slots, "optionAnnotator", V(E({ toggleAnnotator: t, isAnnotator: a })), void 0, !0)
+          fn: k(({ toggleAnnotator: t, isAnnotator: a }) => [
+            p(l.$slots, "optionAnnotator", R(H({ toggleAnnotator: t, isAnnotator: a })), void 0, !0)
           ]),
           key: "6"
         } : void 0
       ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasPdf", "hasXls", "hasImg", "hasTable", "hasFullscreen", "isFullscreen", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "onGeneratePdf", "onGenerateImage", "style"])) : v("", !0),
-      S.value ? (o(), r("svg", {
+      X.value ? (o(), r("svg", {
         key: 4,
         ref_key: "svgRef",
-        ref: ae,
-        xmlns: u(xe),
-        class: ge({ "vue-data-ui-fullscreen--on": T.value, "vue-data-ui-fulscreen--off": !T.value }),
+        ref: oe,
+        xmlns: n($e),
+        class: ke({ "vue-data-ui-fullscreen--on": M.value, "vue-data-ui-fulscreen--off": !M.value }),
         viewBox: `0 0 ${s.value.absoluteWidth <= 0 ? 10 : s.value.absoluteWidth} ${s.value.absoluteHeight <= 0 ? 10 : s.value.absoluteHeight}`,
-        style: F(`max-width:100%; overflow: visible; background:transparent;color:${e.value.style.chart.color}`)
+        style: E(`max-width:100%; overflow: visible; background:transparent;color:${e.value.style.chart.color}`)
       }, [
-        Me(tt),
+        Be(n(Pe)),
         l.$slots["chart-background"] ? (o(), r("foreignObject", {
           key: 0,
           x: s.value.left,
           y: s.value.top,
-          width: s.value.width,
-          height: s.value.height,
+          width: Math.max(0.1, s.value.width),
+          height: Math.max(0.1, s.value.height),
           style: {
             pointerEvents: "none"
           }
         }, [
-          m(l.$slots, "chart-background", {}, void 0, !0)
-        ], 8, ut)) : v("", !0),
-        e.value.style.chart.grid.verticalGrid.show ? (o(), r("g", it, [
-          (o(!0), r(C, null, $(c.value.ticks, (t, a) => (o(), r("line", {
+          p(l.$slots, "chart-background", {}, void 0, !0)
+        ], 8, dt)) : v("", !0),
+        e.value.style.chart.grid.verticalGrid.show ? (o(), r("g", vt, [
+          (o(!0), r($, null, L(c.value.ticks, (t, a) => (o(), r("line", {
             x1: s.value.left + a * s.value.width / (c.value.ticks.length - 1),
             x2: s.value.left + a * s.value.width / (c.value.ticks.length - 1),
             y1: s.value.top,
@@ -422,10 +417,10 @@ const rt = ["id"], nt = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
             stroke: e.value.style.chart.grid.verticalGrid.stroke,
             "stroke-width": e.value.style.chart.grid.verticalGrid.strokeWidth,
             "stroke-dasharray": e.value.style.chart.grid.verticalGrid.strokeDasharray
-          }, null, 8, ct))), 256))
+          }, null, 8, ht))), 256))
         ])) : v("", !0),
-        e.value.style.chart.grid.horizontalGrid.show ? (o(), r("g", dt, [
-          (o(!0), r(C, null, $(k.value, (t, a) => (o(), r("line", {
+        e.value.style.chart.grid.horizontalGrid.show ? (o(), r("g", yt, [
+          (o(!0), r($, null, L(x.value, (t, a) => (o(), r("line", {
             x1: s.value.left,
             x2: s.value.right,
             y1: s.value.top + a * h.value,
@@ -433,7 +428,7 @@ const rt = ["id"], nt = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
             stroke: e.value.style.chart.grid.horizontalGrid.stroke,
             "stroke-width": e.value.style.chart.grid.horizontalGrid.strokeWidth,
             "stroke-dasharray": e.value.style.chart.grid.horizontalGrid.strokeDasharray
-          }, null, 8, vt))), 256)),
+          }, null, 8, ft))), 256)),
           i("line", {
             x1: s.value.left,
             x2: s.value.right,
@@ -442,48 +437,48 @@ const rt = ["id"], nt = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
             stroke: e.value.style.chart.grid.horizontalGrid.stroke,
             "stroke-width": e.value.style.chart.grid.horizontalGrid.strokeWidth,
             "stroke-dasharray": e.value.style.chart.grid.horizontalGrid.strokeDasharray
-          }, null, 8, ht)
+          }, null, 8, bt)
         ])) : v("", !0),
-        e.value.style.chart.labels.yAxisLabels.show ? (o(), r("g", yt, [
-          (o(!0), r(C, null, $(k.value, (t, a) => (o(), r("text", {
+        e.value.style.chart.labels.yAxisLabels.show ? (o(), r("g", gt, [
+          (o(!0), r($, null, L(x.value, (t, a) => (o(), r("text", {
             x: s.value.left - 6 + e.value.style.chart.labels.yAxisLabels.offsetX,
             y: s.value.top + a * h.value + (e.value.style.chart.labels.yAxisLabels.showProgression ? h.value / 3 : h.value / 2) + e.value.style.chart.labels.yAxisLabels.fontSize / 3,
             "font-size": e.value.style.chart.labels.yAxisLabels.fontSize,
             fill: e.value.style.chart.labels.yAxisLabels.color,
             "font-weight": e.value.style.chart.labels.yAxisLabels.bold ? "bold" : "normal",
             "text-anchor": "end"
-          }, A(t.name), 9, ft))), 256)),
-          e.value.style.chart.labels.yAxisLabels.showProgression ? (o(!0), r(C, { key: 0 }, $(k.value, (t, a) => (o(), r("text", {
+          }, z(t.name), 9, pt))), 256)),
+          e.value.style.chart.labels.yAxisLabels.showProgression ? (o(!0), r($, { key: 0 }, L(x.value, (t, a) => (o(), r("text", {
             x: s.value.left - 6 + e.value.style.chart.labels.yAxisLabels.offsetX,
             y: s.value.top + a * h.value + h.value / 1.3 + e.value.style.chart.labels.yAxisLabels.fontSize / 3,
             "font-size": e.value.style.chart.labels.yAxisLabels.fontSize,
             fill: e.value.style.chart.labels.yAxisLabels.color,
             "text-anchor": "end"
-          }, A(u(z)({
+          }, z(n(S)({
             v: 100 * (t.end / t.start - 1),
             s: "%",
             r: e.value.style.chart.labels.yAxisLabels.rounding
-          })), 9, bt))), 256)) : v("", !0)
+          })), 9, mt))), 256)) : v("", !0)
         ])) : v("", !0),
-        e.value.style.chart.labels.xAxisLabels.show ? (o(), r("g", gt, [
-          (o(!0), r(C, null, $(c.value.ticks, (t, a) => (o(), r("text", {
+        e.value.style.chart.labels.xAxisLabels.show ? (o(), r("g", kt, [
+          (o(!0), r($, null, L(c.value.ticks, (t, a) => (o(), r("text", {
             x: s.value.left + a * (s.value.width / (c.value.ticks.length - 1)),
             y: s.value.bottom + e.value.style.chart.labels.xAxisLabels.fontSize + e.value.style.chart.labels.xAxisLabels.offsetY,
             "font-size": e.value.style.chart.labels.xAxisLabels.fontSize,
             fill: e.value.style.chart.labels.xAxisLabels.color,
             "font-weight": e.value.style.chart.labels.xAxisLabels.bold ? "bold" : "normal",
             "text-anchor": "middle"
-          }, A(u(B)(
+          }, z(n(q)(
             e.value.style.chart.labels.formatter,
             t,
-            u(z)({
+            n(S)({
               p: e.value.style.chart.labels.prefix,
               v: t,
               s: e.value.style.chart.labels.suffix,
               r: e.value.style.chart.labels.xAxisLabels.rounding
             }),
             { datapoint: t, seriesIndex: a }
-          )), 9, mt))), 256))
+          )), 9, _t))), 256))
         ])) : v("", !0),
         i("defs", null, [
           i("radialGradient", {
@@ -492,36 +487,36 @@ const rt = ["id"], nt = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
           }, [
             i("stop", {
               offset: "10%",
-              "stop-color": u(we)(e.value.style.chart.plots.startColor, e.value.style.chart.plots.gradient.intensity / 100)
-            }, null, 8, _t),
+              "stop-color": n(Le)(e.value.style.chart.plots.startColor, e.value.style.chart.plots.gradient.intensity / 100)
+            }, null, 8, wt),
             i("stop", {
               offset: "90%",
-              "stop-color": u(Ce)(e.value.style.chart.plots.startColor, 0.1)
-            }, null, 8, kt),
+              "stop-color": n(Ae)(e.value.style.chart.plots.startColor, 0.1)
+            }, null, 8, Ct),
             i("stop", {
               offset: "100%",
               "stop-color": e.value.style.chart.plots.startColor
-            }, null, 8, xt)
-          ], 8, pt),
+            }, null, 8, $t)
+          ], 8, xt),
           i("radialGradient", {
             id: `end_grad_${y.value}`,
             fy: "30%"
           }, [
             i("stop", {
               offset: "10%",
-              "stop-color": u(we)(e.value.style.chart.plots.endColor, e.value.style.chart.plots.gradient.intensity / 100)
-            }, null, 8, Ct),
+              "stop-color": n(Le)(e.value.style.chart.plots.endColor, e.value.style.chart.plots.gradient.intensity / 100)
+            }, null, 8, At),
             i("stop", {
               offset: "90%",
-              "stop-color": u(Ce)(e.value.style.chart.plots.endColor, 0.1)
-            }, null, 8, $t),
+              "stop-color": n(Ae)(e.value.style.chart.plots.endColor, 0.1)
+            }, null, 8, zt),
             i("stop", {
               offset: "100%",
               "stop-color": e.value.style.chart.plots.endColor
-            }, null, 8, Lt)
-          ], 8, wt)
+            }, null, 8, St)
+          ], 8, Lt)
         ]),
-        (o(!0), r(C, null, $(f.value, (t, a) => (o(), r("g", null, [
+        (o(!0), r($, null, L(f.value, (t, a) => (o(), r("g", null, [
           i("defs", null, [
             i("linearGradient", {
               id: `grad_positive_${y.value}`,
@@ -533,12 +528,12 @@ const rt = ["id"], nt = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
               i("stop", {
                 offset: "0%",
                 "stop-color": e.value.style.chart.plots.startColor
-              }, null, 8, zt),
+              }, null, 8, Nt),
               i("stop", {
                 offset: "100%",
                 "stop-color": e.value.style.chart.plots.endColor
-              }, null, 8, St)
-            ], 8, At),
+              }, null, 8, Tt)
+            ], 8, Xt),
             i("linearGradient", {
               id: `grad_negative_${y.value}`,
               x1: "0%",
@@ -549,14 +544,14 @@ const rt = ["id"], nt = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
               i("stop", {
                 offset: "0%",
                 "stop-color": e.value.style.chart.plots.endColor
-              }, null, 8, Nt),
+              }, null, 8, Ot),
               i("stop", {
                 offset: "100%",
                 "stop-color": e.value.style.chart.plots.startColor
-              }, null, 8, Tt)
-            ], 8, Xt)
+              }, null, 8, Mt)
+            ], 8, Pt)
           ]),
-          e.value.style.chart.plots.link.type === "curved" ? (o(), r("g", Ot, [
+          e.value.style.chart.plots.link.type === "curved" ? (o(), r("g", It, [
             i("path", {
               d: `M 
                             ${t.startX},${t.y + e.value.style.chart.plots.radius / 2} 
@@ -568,15 +563,15 @@ const rt = ["id"], nt = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
                             Z
                         `,
               fill: t.endX > t.startX ? `url(#grad_positive_${y.value})` : `url(#grad_negative_${y.value})`
-            }, null, 8, Pt)
-          ])) : (o(), r("g", It, [
+            }, null, 8, Gt)
+          ])) : (o(), r("g", Dt, [
             i("rect", {
               x: t.endX > t.startX ? t.startX : t.endX,
               y: t.y - e.value.style.chart.plots.link.strokeWidth / 2,
               height: e.value.style.chart.plots.link.strokeWidth,
               width: Math.abs(t.endX - t.startX),
               fill: t.endX > t.startX ? `url(#grad_positive_${y.value})` : `url(#grad_negative_${y.value})`
-            }, null, 8, Gt)
+            }, null, 8, Ft)
           ])),
           i("circle", {
             cx: t.startX,
@@ -585,7 +580,7 @@ const rt = ["id"], nt = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
             fill: e.value.style.chart.plots.gradient.show ? `url(#start_grad_${y.value})` : e.value.style.chart.plots.startColor,
             stroke: e.value.style.chart.plots.stroke,
             "stroke-width": e.value.style.chart.plots.strokeWidth
-          }, null, 8, Mt),
+          }, null, 8, Vt),
           i("circle", {
             cx: t.endX,
             cy: t.y,
@@ -593,52 +588,52 @@ const rt = ["id"], nt = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
             fill: e.value.style.chart.plots.gradient.show ? `url(#end_grad_${y.value})` : e.value.style.chart.plots.endColor,
             stroke: e.value.style.chart.plots.stroke,
             "stroke-width": e.value.style.chart.plots.strokeWidth
-          }, null, 8, Dt)
+          }, null, 8, Et)
         ]))), 256)),
-        e.value.style.chart.labels.startLabels.show ? (o(), r("g", Ft, [
-          (o(!0), r(C, null, $(f.value, (t, a) => (o(), r("text", {
+        e.value.style.chart.labels.startLabels.show ? (o(), r("g", Rt, [
+          (o(!0), r($, null, L(f.value, (t, a) => (o(), r("text", {
             x: t.startX,
             y: s.value.top + (a + 1) * h.value - e.value.style.chart.labels.startLabels.fontSize / 3 + e.value.style.chart.labels.startLabels.offsetY,
             fill: e.value.style.chart.labels.startLabels.useStartColor ? e.value.style.chart.plots.startColor : e.value.style.chart.labels.startLabels.color,
             "font-size": e.value.style.chart.labels.startLabels.fontSize,
             "text-anchor": "middle"
-          }, A(u(B)(
+          }, z(n(q)(
             e.value.style.chart.labels.formatter,
             t.start,
-            u(z)({
+            n(S)({
               p: e.value.style.chart.labels.prefix,
               v: t.start,
               s: e.value.style.chart.labels.suffix,
               r: e.value.style.chart.labels.startLabels.rounding
             }),
             { datapoint: t, seriesIndex: a }
-          )), 9, Vt))), 256))
+          )), 9, Ht))), 256))
         ])) : v("", !0),
-        e.value.style.chart.labels.endLabels.show ? (o(), r("g", Et, [
-          (o(!0), r(C, null, $(f.value, (t, a) => (o(), r("text", {
+        e.value.style.chart.labels.endLabels.show ? (o(), r("g", Wt, [
+          (o(!0), r($, null, L(f.value, (t, a) => (o(), r("text", {
             x: t.endX,
             y: s.value.top + a * h.value + e.value.style.chart.labels.endLabels.fontSize + e.value.style.chart.labels.endLabels.offsetY,
             fill: e.value.style.chart.labels.endLabels.useEndColor ? e.value.style.chart.plots.endColor : e.value.style.chart.labels.endLabels.color,
             "font-size": e.value.style.chart.labels.endLabels.fontSize,
             "text-anchor": "middle"
-          }, A(u(B)(
+          }, z(n(q)(
             e.value.style.chart.labels.formatter,
             t.end,
-            u(z)({
+            n(S)({
               p: e.value.style.chart.labels.prefix,
               v: t.end,
               s: e.value.style.chart.labels.suffix,
               r: e.value.style.chart.labels.endLabels.rounding
             }),
             { datapoint: t, seriesIndex: a }
-          )), 9, Rt))), 256))
+          )), 9, Ut))), 256))
         ])) : v("", !0),
-        m(l.$slots, "svg", { svg: s.value }, void 0, !0)
-      ], 14, nt)) : v("", !0),
-      l.$slots.watermark ? (o(), r("div", Ht, [
-        m(l.$slots, "watermark", V(E({ isPrinting: u(re) || u(ne) })), void 0, !0)
+        p(l.$slots, "svg", { svg: s.value }, void 0, !0)
+      ], 14, ct)) : v("", !0),
+      l.$slots.watermark ? (o(), r("div", Bt, [
+        p(l.$slots, "watermark", R(H({ isPrinting: n(ue) || n(ie) })), void 0, !0)
       ])) : v("", !0),
-      S.value ? v("", !0) : (o(), L(Ke, {
+      X.value ? v("", !0) : (o(), A(n(Me), {
         key: 6,
         config: {
           type: "dumbbell",
@@ -652,19 +647,19 @@ const rt = ["id"], nt = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
       }, null, 8, ["config"])),
       i("div", {
         ref_key: "chartLegend",
-        ref: Y
+        ref: J
       }, [
-        e.value.style.chart.legend.show && S.value ? (o(), L(Qe, {
-          key: `legend_${ee.value}`,
-          legendSet: ve.value,
-          config: Ne.value
+        e.value.style.chart.legend.show && X.value ? (o(), A(rt, {
+          key: `legend_${le.value}`,
+          legendSet: ye.value,
+          config: Ve.value
         }, {
-          item: _(({ legend: t }) => [
+          item: k(({ legend: t }) => [
             i("div", {
-              style: F(`display:flex;align-items:center;gap:4px;font-size:${e.value.style.chart.legend.fontSize}px`)
+              style: E(`display:flex;align-items:center;gap:4px;font-size:${e.value.style.chart.legend.fontSize}px`)
             }, [
               (o(), r("svg", {
-                xmlns: u(xe),
+                xmlns: n($e),
                 viewBox: "0 0 20 20",
                 height: e.value.style.chart.legend.fontSize,
                 width: e.value.style.chart.legend.fontSize
@@ -674,30 +669,30 @@ const rt = ["id"], nt = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
                   cy: 10,
                   r: 9,
                   fill: t.color
-                }, null, 8, Ut)
-              ], 8, Wt)),
-              me(" " + A(t.name), 1)
+                }, null, 8, qt)
+              ], 8, jt)),
+              _e(" " + z(t.name), 1)
             ], 4)
           ]),
           _: 1
-        }, 8, ["legendSet", "config"])) : m(l.$slots, "legend", {
+        }, 8, ["legendSet", "config"])) : p(l.$slots, "legend", {
           key: 1,
-          legend: ve.value
+          legend: ye.value
         }, void 0, !0)
       ], 512),
       l.$slots.source ? (o(), r("div", {
         key: 7,
         ref_key: "source",
-        ref: Z,
+        ref: K,
         dir: "auto"
       }, [
-        m(l.$slots, "source", {}, void 0, !0)
+        p(l.$slots, "source", {}, void 0, !0)
       ], 512)) : v("", !0),
-      S.value ? (o(), L(et, {
+      X.value ? (o(), A(n(Ne), {
         key: 8,
         hideDetails: "",
         config: {
-          open: X.value.showTable,
+          open: P.value.showTable,
           maxHeight: 1e4,
           body: {
             backgroundColor: e.value.style.chart.backgroundColor,
@@ -709,33 +704,33 @@ const rt = ["id"], nt = ["xmlns", "viewBox"], ut = ["x", "y", "width", "height"]
           }
         }
       }, {
-        content: _(() => [
-          (o(), L(Je, {
-            key: `table_${Q.value}`,
-            colNames: G.value.colNames,
-            head: G.value.head,
-            body: G.value.body,
-            config: G.value.config,
+        content: k(() => [
+          (o(), A(n(Te), {
+            key: `table_${te.value}`,
+            colNames: D.value.colNames,
+            head: D.value.head,
+            body: D.value.body,
+            config: D.value.config,
             title: `${e.value.style.chart.title.text}${e.value.style.chart.title.subtitle.text ? ` : ${e.value.style.chart.title.subtitle.text}` : ""}`,
-            onClose: n[0] || (n[0] = (t) => X.value.showTable = !1)
+            onClose: u[0] || (u[0] = (t) => P.value.showTable = !1)
           }, {
-            th: _(({ th: t }) => [
+            th: k(({ th: t }) => [
               i("div", {
                 innerHTML: t,
                 style: { display: "flex", "align-items": "center" }
-              }, null, 8, Bt)
+              }, null, 8, Yt)
             ]),
-            td: _(({ td: t }) => [
-              me(A(t.name || t), 1)
+            td: k(({ td: t }) => [
+              _e(z(t.name || t), 1)
             ]),
             _: 1
           }, 8, ["colNames", "head", "body", "config", "title"]))
         ]),
         _: 1
       }, 8, ["config"])) : v("", !0)
-    ], 46, rt));
+    ], 46, it));
   }
-}, cl = /* @__PURE__ */ ot(jt, [["__scopeId", "data-v-39357753"]]);
+}, ul = /* @__PURE__ */ ut(Zt, [["__scopeId", "data-v-42691b72"]]);
 export {
-  cl as default
+  ul as default
 };