vue-data-ui 2.4.57 → 2.4.59

package/dist/{vue-ui-donut-evolution-DpDpYw3f.js → vue-ui-donut-evolution-BgD7rCFk.js}

@@ -1,29 +1,29 @@
-import { computed as p, ref as m, onMounted as nt, watch as Me, openBlock as a, createElementBlock as u, normalizeClass as P, normalizeStyle as q, unref as c, createBlock as T, createCommentVNode as v, createSlots as rt, withCtx as I, renderSlot as F, normalizeProps as J, guardReactiveProps as Q, createVNode as it, createElementVNode as d, Fragment as k, renderList as _, toDisplayString as b, withKeys as ct, createTextVNode as He, nextTick as X } from "vue";
-import { u as vt, o as dt, e as Z, g as ht, c as Ue, t as yt, a as ft, p as ee, C as We, b as gt, J as mt, d as de, D as Re, m as he, X as bt, s as G, E as xt, i as ye, f as te, j as Xe, k as le, n as Ge, K as je, q as pt, r as kt } from "./index-CI-N9klv.js";
-import { _ as _t } from "./Title-DLjHHdyq.js";
-import { u as Ct, U as wt } from "./usePrinter-CXc8xCKk.js";
-import { D as Lt } from "./DataTable-DgbrnD__.js";
-import { L as zt } from "./Legend-HooNAKB_.js";
-import St from "./vue-ui-skeleton-owIhXtQF.js";
-import { S as At } from "./Slicer-BXCORSCz.js";
-import $t from "./vue-ui-accordion-CYLks1fW.js";
-import { u as Be } from "./useNestedProp-D1eJ0dvv.js";
-import { _ as Nt } from "./PackageVersion-S3SzpuwC.js";
-import { P as It } from "./PenAndPaper-v846FwcH.js";
+import { computed as p, ref as b, onMounted as nt, watch as Me, openBlock as a, createElementBlock as o, normalizeClass as P, normalizeStyle as q, unref as c, createBlock as E, createCommentVNode as v, createSlots as rt, withCtx as F, renderSlot as S, normalizeProps as J, guardReactiveProps as Q, createVNode as it, createElementVNode as d, Fragment as k, renderList as _, toDisplayString as m, withKeys as ct, createTextVNode as He, nextTick as X } from "vue";
+import { u as vt, o as dt, e as Z, g as ht, c as Ue, t as yt, a as ft, p as ee, C as We, b as gt, J as bt, d as de, D as Re, m as he, X as mt, s as G, E as xt, i as ye, f as te, j as Xe, k as le, n as Ge, K as je, q as pt, r as kt } from "./index-B9RAElpI.js";
+import { _ as _t } from "./Title-zZtEcB9F.js";
+import { u as Ct, U as wt } from "./usePrinter-CwTAwqtF.js";
+import { D as Lt } from "./DataTable-CFUKU8PU.js";
+import { L as zt } from "./Legend-f52bnttJ.js";
+import St from "./vue-ui-skeleton-DVYD_VSe.js";
+import { S as $t } from "./Slicer-Duke9qno.js";
+import At from "./vue-ui-accordion-rNA598L6.js";
+import { u as Be } from "./useNestedProp-DuruL3Nt.js";
+import { _ as Nt } from "./PackageVersion-C_FFs0BP.js";
+import { P as It } from "./PenAndPaper-Dx24BtRW.js";
 import { u as Ft } from "./useUserOptionState-BIvW1Kz7.js";
 import { _ as Pt } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const Ot = ["id"], Tt = ["xmlns", "viewBox"], Dt = ["id"], Et = ["stop-color"], Vt = ["stop-color"], Mt = ["id"], Ht = ["stop-color"], Ut = ["stop-color"], Wt = ["stop-color"], Rt = { key: 0 }, Xt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Gt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], jt = { key: 0 }, Bt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Yt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Kt = ["x", "y", "font-size", "fill", "font-weight"], qt = ["text-anchor", "font-size", "fill", "transform"], Jt = ["x1", "y1", "x2", "y2", "stroke", "stroke-width"], Qt = { key: 1 }, Zt = ["cx", "cy", "r", "fill"], el = { key: 0 }, tl = { key: 0 }, ll = ["d", "stroke"], al = ["text-anchor", "x", "y", "fill"], ol = ["cx", "cy", "r", "fill"], ul = { key: 0 }, sl = ["cx", "cy", "fill"], nl = { key: 1 }, rl = ["d", "fill", "stroke"], il = { key: 2 }, cl = ["d", "fill", "stroke"], vl = ["x", "y", "font-size", "fill"], dl = ["x", "y", "width", "fill", "onClick"], hl = ["x", "y", "width", "height", "onMouseenter", "onClick"], yl = {
-  key: 3,
+const Ot = ["id"], Et = ["xmlns", "viewBox"], Tt = ["x", "y", "width", "height"], Dt = ["id"], Vt = ["stop-color"], Mt = ["stop-color"], Ht = ["id"], Ut = ["stop-color"], Wt = ["stop-color"], Rt = ["stop-color"], Xt = { key: 1 }, Gt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], jt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Bt = { key: 0 }, Yt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Kt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], qt = ["x", "y", "font-size", "fill", "font-weight"], Jt = ["text-anchor", "font-size", "fill", "transform"], Qt = ["x1", "y1", "x2", "y2", "stroke", "stroke-width"], Zt = { key: 1 }, el = ["cx", "cy", "r", "fill"], tl = { key: 0 }, ll = { key: 0 }, al = ["d", "stroke"], ol = ["text-anchor", "x", "y", "fill"], ul = ["cx", "cy", "r", "fill"], sl = { key: 0 }, nl = ["cx", "cy", "fill"], rl = { key: 1 }, il = ["d", "fill", "stroke"], cl = { key: 2 }, vl = ["d", "fill", "stroke"], dl = ["x", "y", "font-size", "fill"], hl = ["x", "y", "width", "fill", "onClick"], yl = ["x", "y", "width", "height", "onMouseenter", "onClick"], fl = {
+  key: 4,
   "data-cy-zoom": "",
   class: "vue-ui-donut-evolution-dialog"
-}, fl = ["x", "y", "width", "height", "fill"], gl = ["x1", "y1", "x2", "y2", "stroke"], ml = ["x1", "y2", "x2", "y1", "stroke"], bl = ["onKeypress", "cx", "cy", "r"], xl = ["d", "stroke"], pl = ["cx", "cy", "r", "fill"], kl = ["d", "fill", "stroke"], _l = { class: "vue-ui-donut-evolution-focus" }, Cl = ["text-anchor", "x", "y", "fill"], wl = ["cx", "cy", "r", "fill"], Ll = ["cx", "cy", "r", "fill"], zl = ["x", "y", "fill"], Sl = ["x", "y", "font-size", "fill"], Al = {
+}, gl = ["x", "y", "width", "height", "fill"], bl = ["x1", "y1", "x2", "y2", "stroke"], ml = ["x1", "y2", "x2", "y1", "stroke"], xl = ["onKeypress", "cx", "cy", "r"], pl = ["d", "stroke"], kl = ["cx", "cy", "r", "fill"], _l = ["d", "fill", "stroke"], Cl = { class: "vue-ui-donut-evolution-focus" }, wl = ["text-anchor", "x", "y", "fill"], Ll = ["cx", "cy", "r", "fill"], zl = ["cx", "cy", "r", "fill"], Sl = ["x", "y", "fill"], $l = ["x", "y", "font-size", "fill"], Al = {
   key: 5,
   class: "vue-data-ui-watermark"
-}, $l = ["onClick"], Nl = { key: 0 }, Il = { key: 1 }, Fl = {
+}, Nl = ["onClick"], Il = { key: 0 }, Fl = { key: 1 }, Pl = {
   key: 9,
   ref: "source",
   dir: "auto"
-}, Pl = { key: 0 }, Ol = { key: 1 }, Tl = {
+}, Ol = { key: 0 }, El = { key: 1 }, Tl = {
   __name: "vue-ui-donut-evolution",
   props: {
     config: {
@@ -41,32 +41,32 @@ const Ot = ["id"], Tt = ["xmlns", "viewBox"], Dt = ["id"], Et = ["stop-color"],
   },
   emits: ["selectLegend"],
   setup(Ye, { expose: Ke, emit: fe }) {
-    const x = Ye, { vue_ui_donut_evolution: qe } = vt(), j = p(() => !!x.dataset && x.dataset.length), h = m({
+    const x = Ye, { vue_ui_donut_evolution: qe } = vt(), j = p(() => !!x.dataset && x.dataset.length), h = b({
       start: 0,
       end: Math.max(...x.dataset.map((l) => l.values.length))
     });
     function ge() {
-      me();
+      be();
     }
-    const V = m(null);
-    async function me() {
+    const V = b(null);
+    async function be() {
       (e.value.style.chart.zoom.startIndex !== null || e.value.style.chart.zoom.endIndex !== null) && V.value ? (e.value.style.chart.zoom.startIndex !== null && (await X(), await X(), V.value && V.value.setStartValue(e.value.style.chart.zoom.startIndex)), e.value.style.chart.zoom.endIndex !== null && (await X(), await X(), V.value && V.value.setEndValue(Je(e.value.style.chart.zoom.endIndex + 1)))) : (h.value = {
         start: 0,
-        end: E.value
+        end: D.value
       }, pe.value += 1);
     }
     function Je(l) {
-      const o = E.value;
-      return l > o ? o : l < 0 || e.value.style.chart.zoom.startIndex !== null && l < e.value.style.chart.zoom.startIndex ? e.value.style.chart.zoom.startIndex !== null ? e.value.style.chart.zoom.startIndex + 1 : 1 : l;
+      const u = D.value;
+      return l > u ? u : l < 0 || e.value.style.chart.zoom.startIndex !== null && l < e.value.style.chart.zoom.startIndex ? e.value.style.chart.zoom.startIndex !== null ? e.value.style.chart.zoom.startIndex + 1 : 1 : l;
     }
     nt(() => {
-      be();
+      me();
     });
-    function be() {
+    function me() {
       dt(x.dataset) ? Z({
         componentName: "VueUiDonutEvolution",
         type: "dataset"
-      }) : x.dataset.length && x.dataset.forEach((l, o) => {
+      }) : x.dataset.length && x.dataset.forEach((l, u) => {
         ht({
           datasetObject: l,
           requiredAttributes: ["name", "values"]
@@ -75,12 +75,12 @@ const Ot = ["id"], Tt = ["xmlns", "viewBox"], Dt = ["id"], Et = ["stop-color"],
             componentName: "VueUiDonutEvolution",
             type: "datasetSerieAttribute",
             property: t,
-            index: o
+            index: u
           });
         });
-      }), me();
+      }), be();
     }
-    const D = m(Ue()), C = m([]), g = m(null), ae = m(null), S = m(!1), A = m(null), oe = m(null), Qe = m(null), xe = m(0), pe = m(0), ke = m(0), _e = m(0), Ce = m(0), e = p({
+    const T = b(Ue()), C = b([]), g = b(null), ae = b(null), $ = b(!1), A = b(null), oe = b(null), Qe = b(null), xe = b(0), pe = b(0), ke = b(0), _e = b(0), Ce = b(0), e = p({
       get: () => ze(),
       set: (l) => l
     }), { userOptionsVisible: ue, setUserOptionsVisibility: we, keepUserOptionState: Le } = Ft({ config: e.value });
@@ -89,80 +89,80 @@ const Ot = ["id"], Tt = ["xmlns", "viewBox"], Dt = ["id"], Et = ["stop-color"],
         userConfig: x.config,
         defaultConfig: qe
       });
-      let o = {};
-      return l.theme ? o = {
+      let u = {};
+      return l.theme ? u = {
         ...Be({
           userConfig: yt.vue_ui_donut_evolution[l.theme] || x.config,
           defaultConfig: l
         }),
         customPalette: ft[l.theme] || ee
-      } : o = l, x.config && We(x.config, "style.chart.zoom.startIndex") ? o.style.chart.zoom.startIndex = x.config.style.chart.zoom.startIndex : o.style.chart.zoom.startIndex = null, x.config && We(x.config, "style.chart.zoom.endIndex") ? o.style.chart.zoom.endIndex = x.config.style.chart.zoom.endIndex : o.style.chart.zoom.endIndex = null, o;
+      } : u = l, x.config && We(x.config, "style.chart.zoom.startIndex") ? u.style.chart.zoom.startIndex = x.config.style.chart.zoom.startIndex : u.style.chart.zoom.startIndex = null, x.config && We(x.config, "style.chart.zoom.endIndex") ? u.style.chart.zoom.endIndex = x.config.style.chart.zoom.endIndex : u.style.chart.zoom.endIndex = null, u;
     }
     Me(() => x.config, (l) => {
-      e.value = ze(), ue.value = !e.value.showOnChartHover, be(), ke.value += 1, _e.value += 1, Ce.value += 1;
+      e.value = ze(), ue.value = !e.value.showOnChartHover, me(), ke.value += 1, _e.value += 1, Ce.value += 1;
     }, { deep: !0 }), Me(() => x.dataset, (l) => {
       ge();
     }, { deep: !0 });
-    const { isPrinting: Se, isImaging: Ae, generatePdf: $e, generateImage: Ne } = Ct({
-      elementId: D.value,
+    const { isPrinting: Se, isImaging: $e, generatePdf: Ae, generateImage: Ne } = Ct({
+      elementId: T.value,
       fileName: e.value.style.chart.title.text || "vue-ui-donut-evolution"
-    }), Ze = p(() => e.value.userOptions.show && !e.value.style.chart.title.text), et = p(() => gt(e.value.customPalette)), B = m({
+    }), Ze = p(() => e.value.userOptions.show && !e.value.style.chart.title.text), et = p(() => gt(e.value.customPalette)), B = b({
       showTable: e.value.table.show
     }), n = p(() => ({
       top: e.value.style.chart.layout.padding.top,
       right: e.value.style.chart.layout.padding.right,
       bottom: e.value.style.chart.layout.padding.bottom,
       left: e.value.style.chart.layout.padding.left
-    })), i = p(() => {
-      const l = e.value.style.chart.layout.height, o = e.value.style.chart.layout.width, t = l - n.value.top - n.value.bottom, r = o - n.value.left - n.value.right;
+    })), r = p(() => {
+      const l = e.value.style.chart.layout.height, u = e.value.style.chart.layout.width, t = l - n.value.top - n.value.bottom, i = u - n.value.left - n.value.right;
       return {
         absoluteHeight: l,
-        absoluteWidth: o,
-        centerX: n.value.left + r / 2,
+        absoluteWidth: u,
+        centerX: n.value.left + i / 2,
         centerY: n.value.top + t / 2,
         height: t,
-        width: r
+        width: i
       };
-    }), O = p(() => (x.dataset.forEach((l, o) => {
+    }), O = p(() => (x.dataset.forEach((l, u) => {
       [null, void 0].includes(l.name) && Z({
         componentName: "VueUiDonutEvolution",
         type: "datasetSerieAttribute",
         property: "name",
-        index: o
+        index: u
       }), [null, void 0].includes(l.values) && Z({
         componentName: "VueUiDonutEvolution",
         type: "datasetSerieAttribute",
         property: "values",
-        index: o
+        index: u
       });
-    }), x.dataset.map((l, o) => ({
+    }), x.dataset.map((l, u) => ({
       ...l,
-      values: mt(l.values),
-      color: de(l.color) || et.value[o] || ee[o] || ee[o % ee.length],
+      values: bt(l.values),
+      color: de(l.color) || et.value[u] || ee[u] || ee[u % ee.length],
       length: (l.values || []).length,
       uid: Ue()
     })))), W = p(() => O.value.filter((l) => !C.value.includes(l.uid)).map((l) => ({
       ...l,
-      values: l.values.filter((o, t) => t >= h.value.start && t <= h.value.end)
-    }))), E = p(() => Math.max(...W.value.map((l) => l.length))), L = p(() => i.value.width / (h.value.end - h.value.start)), w = p(() => {
+      values: l.values.filter((u, t) => t >= h.value.start && t <= h.value.end)
+    }))), D = p(() => Math.max(...W.value.map((l) => l.length))), L = p(() => r.value.width / (h.value.end - h.value.start)), w = p(() => {
       const l = [];
       for (let s = 0; s < h.value.end - h.value.start; s += 1) {
-        const f = W.value.map((N) => N.values[s] ?? null), y = f.filter((N) => [void 0, null].includes(N)).length === f.length, $ = f.reduce((N, z) => N + z, 0), ve = f.map((N) => N / $), U = n.value.left + L.value * s + L.value / 2;
+        const f = W.value.map((I) => I.values[s] ?? null), y = f.filter((I) => [void 0, null].includes(I)).length === f.length, N = f.reduce((I, z) => I + z, 0), ve = f.map((I) => I / N), U = n.value.left + L.value * s + L.value / 2;
         l.push({
           index: s,
           percentages: ve,
-          subtotal: y || $ < 0 ? null : $,
+          subtotal: y || N < 0 ? null : N,
           values: f,
           x: U
         });
       }
-      const o = 0, t = Math.max(...l.map((s) => s.subtotal)), r = l.length === 1 ? t * 2 : t;
+      const u = 0, t = Math.max(...l.map((s) => s.subtotal)), i = l.length === 1 ? t * 2 : t;
       return l.map((s, f) => {
-        const y = L.value / 2 * 0.7, $ = y > i.value.width / 16 ? i.value.width / 16 : y, ve = g.value === s.index ? i.value.width / 16 : $, U = l.length > 4 ? y * 2 : y * 2 > L.value / 2 * 0.7 ? L.value / 2 * 0.7 : y * 2, N = i.value.absoluteHeight - n.value.bottom - i.value.height * s.subtotal / Re(o, r, e.value.style.chart.layout.grid.yAxis.dataLabels.steps).max;
+        const y = L.value / 2 * 0.7, N = y > r.value.width / 16 ? r.value.width / 16 : y, ve = g.value === s.index ? r.value.width / 16 : N, U = l.length > 4 ? y * 2 : y * 2 > L.value / 2 * 0.7 ? L.value / 2 * 0.7 : y * 2, I = r.value.absoluteHeight - n.value.bottom - r.value.height * s.subtotal / Re(u, i, e.value.style.chart.layout.grid.yAxis.dataLabels.steps).max;
         return {
           ...s,
-          y: N,
-          radius: $,
+          y: I,
+          radius: N,
           activeRadius: ve,
           hoverRadius: U,
           donut: he({
@@ -171,25 +171,25 @@ const Ot = ["id"], Tt = ["xmlns", "viewBox"], Dt = ["id"], Et = ["stop-color"],
               name: z.name,
               value: z.values[f] ?? 0
             }))
-          }, s.x, N, $, $, 1.99999, 2, 1, 360, 105.25, $ / 2),
+          }, s.x, I, N, N, 1.99999, 2, 1, 360, 105.25, N / 2),
           donutHover: he({
             series: W.value.map((z, Ve) => ({
               color: z.color,
               name: z.name,
               value: z.values[f] ?? 0
             }))
-          }, s.x, N, U, U, 1.99999, 2, 1, 360, 105.25, U / 2),
+          }, s.x, I, U, U, 1.99999, 2, 1, 360, 105.25, U / 2),
           donutFocus: he({
             series: W.value.map((z, Ve) => ({
               color: z.color,
               name: z.name,
               value: z.values[f] ?? 0
             }))
-          }, i.value.centerX, i.value.centerY, i.value.height / 3.6, i.value.height / 3.6, 1.99999, 2, 1, 360, 105.25, i.value.height / 6)
+          }, r.value.centerX, r.value.centerY, r.value.height / 3.6, r.value.height / 3.6, 1.99999, 2, 1, 360, 105.25, r.value.height / 6)
         };
       });
     });
-    function Y(l, o, t) {
+    function Y(l, u, t) {
       return ye(
         e.value.style.chart.layout.dataLabels.formatter,
         l,
@@ -199,7 +199,7 @@ const Ot = ["id"], Tt = ["xmlns", "viewBox"], Dt = ["id"], Et = ["stop-color"],
           s: e.value.style.chart.layout.dataLabels.suffix,
           r: e.value.style.chart.layout.dataLabels.rounding
         }),
-        { datapoint: o, index: t }
+        { datapoint: u, index: t }
       );
     }
     const se = p(() => ({
@@ -213,37 +213,37 @@ const Ot = ["id"], Tt = ["xmlns", "viewBox"], Dt = ["id"], Et = ["stop-color"],
       return l / M.value.max;
     }
     const lt = p(() => M.value.ticks.map((l) => ({
-      y: i.value.absoluteHeight - n.value.bottom - i.value.height * tt(l),
+      y: r.value.absoluteHeight - n.value.bottom - r.value.height * tt(l),
       value: l
     })));
-    function Ie(l, o) {
-      return isNaN(l.value / je(o, "value")) ? 0 : (l.value / je(o, "value") * 100).toFixed(0) + "%";
+    function Ie(l, u) {
+      return isNaN(l.value / je(u, "value")) ? 0 : (l.value / je(u, "value") * 100).toFixed(0) + "%";
     }
     function Fe() {
-      S.value || (g.value = null, ae.value = null);
+      $.value || (g.value = null, ae.value = null);
     }
     function at(l) {
-      S.value || (g.value = l.index, ae.value = l);
+      $.value || (g.value = l.index, ae.value = l);
     }
-    const ne = m(null);
-    function re(l, o) {
-      l.subtotal && (ae.value = null, g.value = null, S.value = !0, A.value = l, [null, void 0].includes(o) || (ne.value = o));
+    const ne = b(null);
+    function re(l, u) {
+      l.subtotal && (ae.value = null, g.value = null, $.value = !0, A.value = l, [null, void 0].includes(u) || (ne.value = u));
     }
     function Pe() {
-      A.value = null, S.value = !1, ne.value = null;
+      A.value = null, $.value = !1, ne.value = null;
     }
-    const Oe = p(() => O.value.map((l, o) => ({
+    const Oe = p(() => O.value.map((l, u) => ({
       name: l.name,
-      value: l.values.slice(h.value.start, h.value.end).reduce((t, r) => t + r, 0),
+      value: l.values.slice(h.value.start, h.value.end).reduce((t, i) => t + i, 0),
       shape: "circle",
       uid: l.uid,
       color: l.color
-    })).sort((l, o) => o.value - l.value).map((l) => ({
+    })).sort((l, u) => u.value - l.value).map((l) => ({
       ...l,
       opacity: C.value.includes(l.uid) ? 0.5 : 1,
       segregate: () => ie(l.uid),
       isSegregated: C.value.includes(l.uid)
-    }))), Te = p(() => w.value.map((l) => l.subtotal).reduce((l, o) => l + o, 0)), ot = p(() => ({
+    }))), Ee = p(() => w.value.map((l) => l.subtotal).reduce((l, u) => l + u, 0)), ot = p(() => ({
       cy: "donut-div-legend",
       backgroundColor: e.value.style.chart.legend.backgroundColor,
       color: e.value.style.chart.legend.color,
@@ -253,22 +253,22 @@ const Ot = ["id"], Tt = ["xmlns", "viewBox"], Dt = ["id"], Et = ["stop-color"],
     }));
     function ie(l) {
       if (C.value.includes(l))
-        C.value = C.value.filter((o) => o !== l), fe("selectLegend", null);
+        C.value = C.value.filter((u) => u !== l), fe("selectLegend", null);
       else {
         if (C.value.length === O.value.length - 1) return;
-        C.value.push(l), fe("selectLegend", O.value.find((o) => o.uid === l));
+        C.value.push(l), fe("selectLegend", O.value.find((u) => u.uid === l));
       }
-      A.value && re(w.value.find((o, t) => t === ne.value));
+      A.value && re(w.value.find((u, t) => t === ne.value));
     }
     const H = p(() => {
       const l = [""].concat(O.value.filter((s) => !C.value.includes(s.uid)).map((s) => ({
         name: s.name,
         color: s.color
       }))).concat(["Σ"]);
-      let o = [];
-      for (let s = 0; s < E.value; s += 1) {
-        const f = O.value.filter((y) => !C.value.includes(y.uid)).map((y) => y.values[s] ?? 0).reduce((y, $) => y + $, 0);
-        o.push([e.value.style.chart.layout.grid.xAxis.dataLabels.values[s] ?? "-"].concat(O.value.filter((y) => !C.value.includes(y.uid)).map((y) => ({
+      let u = [];
+      for (let s = 0; s < D.value; s += 1) {
+        const f = O.value.filter((y) => !C.value.includes(y.uid)).map((y) => y.values[s] ?? 0).reduce((y, N) => y + N, 0);
+        u.push([e.value.style.chart.layout.grid.xAxis.dataLabels.values[s] ?? "-"].concat(O.value.filter((y) => !C.value.includes(y.uid)).map((y) => ({
           value: y.values[s] ?? 0,
           percentage: y.values[s] ? y.values[s] / f * 100 : 0
         }))).concat([`${e.value.style.chart.layout.dataLabels.prefix}${Number(f.toFixed(e.value.table.td.roundingValue))}${e.value.style.chart.layout.dataLabels.suffix}`]));
@@ -285,48 +285,48 @@ const Ot = ["id"], Tt = ["xmlns", "viewBox"], Dt = ["id"], Et = ["stop-color"],
           outline: e.value.table.td.outline
         },
         breakpoint: e.value.table.responsiveBreakpoint
-      }, r = [
+      }, i = [
         e.value.table.columnNames.period
       ].concat(O.value.filter((s) => !C.value.includes(s.uid)).map((s) => s.name)).concat(e.value.table.columnNames.total);
-      return { head: l, body: o, config: t, colNames: r };
+      return { head: l, body: u, config: t, colNames: i };
     });
     function ut() {
       return O.value;
     }
-    function De() {
+    function Te() {
       X(() => {
-        const l = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [""]], o = [...H.value.head.map((f) => f.name ?? f)], t = [...H.value.body.map((f) => f.map((y) => y.value ?? y))], r = l.concat([o]).concat(t), s = pt(r);
+        const l = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [""]], u = [...H.value.head.map((f) => f.name ?? f)], t = [...H.value.body.map((f) => f.map((y) => y.value ?? y))], i = l.concat([u]).concat(t), s = pt(i);
         kt({ csvContent: s, title: e.value.style.chart.title.text || "vue-ui-donut-evolution" });
       });
     }
-    const R = m(!1);
+    const R = b(!1);
     function st(l) {
       R.value = l, xe.value += 1;
     }
-    function Ee() {
+    function De() {
       B.value.showTable = !B.value.showTable;
     }
-    const K = m(!1);
+    const K = b(!1);
     function ce() {
       K.value = !K.value;
     }
     return Ke({
       getData: ut,
-      generatePdf: $e,
-      generateCsv: De,
+      generatePdf: Ae,
+      generateCsv: Te,
       generateImage: Ne,
-      toggleTable: Ee,
+      toggleTable: De,
       toggleAnnotator: ce
-    }), (l, o) => (a(), u("div", {
+    }), (l, u) => (a(), o("div", {
       ref_key: "donutEvolutionChart",
       ref: oe,
       class: P(`vue-ui-donut-evolution ${R.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"}`),
       style: q(`font-family:${e.value.style.fontFamily};width:100%; text-align:center;background:${e.value.style.chart.backgroundColor}`),
-      id: D.value,
-      onMouseenter: o[4] || (o[4] = () => c(we)(!0)),
-      onMouseleave: o[5] || (o[5] = () => c(we)(!1))
+      id: T.value,
+      onMouseenter: u[4] || (u[4] = () => c(we)(!0)),
+      onMouseleave: u[5] || (u[5] = () => c(we)(!1))
     }, [
-      e.value.userOptions.buttons.annotator ? (a(), T(It, {
+      e.value.userOptions.buttons.annotator ? (a(), E(It, {
         key: 0,
         parent: oe.value,
         backgroundColor: e.value.style.chart.backgroundColor,
@@ -334,19 +334,19 @@ const Ot = ["id"], Tt = ["xmlns", "viewBox"], Dt = ["id"], Et = ["stop-color"],
         active: K.value,
         onClose: ce
       }, null, 8, ["parent", "backgroundColor", "color", "active"])) : v("", !0),
-      Ze.value ? (a(), u("div", {
+      Ze.value ? (a(), o("div", {
         key: 1,
         ref_key: "noTitle",
         ref: Qe,
         class: "vue-data-ui-no-title-space",
         style: "height:36px; width: 100%;background:transparent"
       }, null, 512)) : v("", !0),
-      e.value.style.chart.title.text ? (a(), u("div", {
+      e.value.style.chart.title.text ? (a(), o("div", {
         key: 2,
         style: "width:100%;background:transparent;padding-bottom:24px",
         onMouseleave: Fe
       }, [
-        (a(), T(_t, {
+        (a(), E(_t, {
           key: `title_${ke.value}`,
           config: {
             title: {
@@ -360,14 +360,14 @@ const Ot = ["id"], Tt = ["xmlns", "viewBox"], Dt = ["id"], Et = ["stop-color"],
           }
         }, null, 8, ["config"]))
       ], 32)) : v("", !0),
-      e.value.userOptions.show && j.value && (c(Le) || c(ue)) ? (a(), T(wt, {
+      e.value.userOptions.show && j.value && (c(Le) || c(ue)) ? (a(), E(wt, {
         ref: "details",
         key: `user_options_${xe.value}`,
         backgroundColor: e.value.style.chart.backgroundColor,
         color: e.value.style.chart.color,
         isPrinting: c(Se),
-        isImaging: c(Ae),
-        uid: D.value,
+        isImaging: c($e),
+        uid: T.value,
         hasPdf: e.value.userOptions.buttons.pdf,
         hasImg: e.value.userOptions.buttons.img,
         hasXls: e.value.userOptions.buttons.csv,
@@ -380,10 +380,10 @@ const Ot = ["id"], Tt = ["xmlns", "viewBox"], Dt = ["id"], Et = ["stop-color"],
         hasAnnotator: e.value.userOptions.buttons.annotator,
         isAnnotation: K.value,
         onToggleFullscreen: st,
-        onGeneratePdf: c($e),
-        onGenerateCsv: De,
+        onGeneratePdf: c(Ae),
+        onGenerateCsv: Te,
         onGenerateImage: c(Ne),
-        onToggleTable: Ee,
+        onToggleTable: De,
         onToggleAnnotator: ce,
         style: q({
           visibility: c(Le) ? c(ue) ? "visible" : "hidden" : "visible"
@@ -391,58 +391,70 @@ const Ot = ["id"], Tt = ["xmlns", "viewBox"], Dt = ["id"], Et = ["stop-color"],
       }, rt({ _: 2 }, [
         l.$slots.optionPdf ? {
           name: "optionPdf",
-          fn: I(() => [
-            F(l.$slots, "optionPdf", {}, void 0, !0)
+          fn: F(() => [
+            S(l.$slots, "optionPdf", {}, void 0, !0)
           ]),
           key: "0"
         } : void 0,
         l.$slots.optionCsv ? {
           name: "optionCsv",
-          fn: I(() => [
-            F(l.$slots, "optionCsv", {}, void 0, !0)
+          fn: F(() => [
+            S(l.$slots, "optionCsv", {}, void 0, !0)
           ]),
           key: "1"
         } : void 0,
         l.$slots.optionImg ? {
           name: "optionImg",
-          fn: I(() => [
-            F(l.$slots, "optionImg", {}, void 0, !0)
+          fn: F(() => [
+            S(l.$slots, "optionImg", {}, void 0, !0)
           ]),
           key: "2"
         } : void 0,
         l.$slots.optionTable ? {
           name: "optionTable",
-          fn: I(() => [
-            F(l.$slots, "optionTable", {}, void 0, !0)
+          fn: F(() => [
+            S(l.$slots, "optionTable", {}, void 0, !0)
           ]),
           key: "3"
         } : void 0,
         l.$slots.optionFullscreen ? {
           name: "optionFullscreen",
-          fn: I(({ toggleFullscreen: t, isFullscreen: r }) => [
-            F(l.$slots, "optionFullscreen", J(Q({ toggleFullscreen: t, isFullscreen: r })), void 0, !0)
+          fn: F(({ toggleFullscreen: t, isFullscreen: i }) => [
+            S(l.$slots, "optionFullscreen", J(Q({ toggleFullscreen: t, isFullscreen: i })), void 0, !0)
           ]),
           key: "4"
         } : void 0,
         l.$slots.optionAnnotator ? {
           name: "optionAnnotator",
-          fn: I(({ toggleAnnotator: t, isAnnotator: r }) => [
-            F(l.$slots, "optionAnnotator", J(Q({ toggleAnnotator: t, isAnnotator: r })), void 0, !0)
+          fn: F(({ toggleAnnotator: t, isAnnotator: i }) => [
+            S(l.$slots, "optionAnnotator", J(Q({ toggleAnnotator: t, isAnnotator: i })), void 0, !0)
           ]),
           key: "5"
         } : void 0
       ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasPdf", "hasImg", "hasXls", "hasTable", "hasFullscreen", "isFullscreen", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "onGeneratePdf", "onGenerateImage", "style"])) : v("", !0),
-      j.value ? (a(), u("svg", {
+      j.value ? (a(), o("svg", {
         key: 4,
-        xmlns: c(bt),
+        xmlns: c(mt),
         class: P({ "vue-data-ui-fullscreen--on": R.value, "vue-data-ui-fulscreen--off": !R.value }),
-        viewBox: `0 0 ${i.value.absoluteWidth} ${i.value.absoluteHeight}`,
+        viewBox: `0 0 ${r.value.absoluteWidth} ${r.value.absoluteHeight}`,
         style: q(`max-width:100%; overflow: visible; background:transparent;color:${e.value.style.chart.color}`)
       }, [
         it(Nt),
+        l.$slots["chart-background"] ? (a(), o("foreignObject", {
+          key: 0,
+          x: n.value.left,
+          y: n.value.top,
+          width: r.value.width,
+          height: r.value.height,
+          style: {
+            pointerEvents: "none"
+          }
+        }, [
+          S(l.$slots, "chart-background", {}, void 0, !0)
+        ], 8, Tt)) : v("", !0),
         d("defs", null, [
           d("linearGradient", {
-            id: `hover_${D.value}`,
+            id: `hover_${T.value}`,
             x1: "0%",
             y1: "0%",
             x2: "0%",
@@ -451,66 +463,66 @@ const Ot = ["id"], Tt = ["xmlns", "viewBox"], Dt = ["id"], Et = ["stop-color"],
             d("stop", {
               offset: "0%",
               "stop-color": c(G)(e.value.style.chart.backgroundColor, e.value.style.chart.layout.highlighter.opacity)
-            }, null, 8, Et),
+            }, null, 8, Vt),
             d("stop", {
               offset: "100%",
               "stop-color": c(G)(e.value.style.chart.layout.highlighter.color, e.value.style.chart.layout.highlighter.opacity)
-            }, null, 8, Vt)
+            }, null, 8, Mt)
           ], 8, Dt),
           d("radialGradient", {
-            id: `focus_${D.value}`
+            id: `focus_${T.value}`
           }, [
             d("stop", {
               offset: "0%",
               "stop-color": c(G)(c(de)(e.value.style.chart.backgroundColor), 0)
-            }, null, 8, Ht),
+            }, null, 8, Ut),
             d("stop", {
               offset: "77%",
               "stop-color": c(G)("#FFFFFF", 30)
-            }, null, 8, Ut),
+            }, null, 8, Wt),
             d("stop", {
               offset: "100%",
               "stop-color": c(G)(c(de)(e.value.style.chart.backgroundColor), 0)
-            }, null, 8, Wt)
-          ], 8, Mt)
+            }, null, 8, Rt)
+          ], 8, Ht)
         ]),
-        e.value.style.chart.layout.grid.show ? (a(), u("g", Rt, [
+        e.value.style.chart.layout.grid.show ? (a(), o("g", Xt, [
           d("line", {
             x1: n.value.left,
             x2: n.value.left,
             y1: n.value.top,
-            y2: n.value.top + i.value.height,
+            y2: n.value.top + r.value.height,
             stroke: e.value.style.chart.layout.grid.stroke,
             "stroke-width": e.value.style.chart.layout.grid.strokeWidth,
             "stroke-linecap": "round"
-          }, null, 8, Xt),
+          }, null, 8, Gt),
           d("line", {
             x1: n.value.left,
-            x2: i.value.absoluteWidth - n.value.right,
-            y1: i.value.absoluteHeight - n.value.bottom,
-            y2: i.value.absoluteHeight - n.value.bottom,
+            x2: r.value.absoluteWidth - n.value.right,
+            y1: r.value.absoluteHeight - n.value.bottom,
+            y2: r.value.absoluteHeight - n.value.bottom,
             stroke: e.value.style.chart.layout.grid.stroke,
             "stroke-width": e.value.style.chart.layout.grid.strokeWidth,
             "stroke-linecap": "round"
-          }, null, 8, Gt),
-          e.value.style.chart.layout.grid.showVerticalLines ? (a(), u("g", jt, [
-            (a(!0), u(k, null, _(h.value.end - h.value.start, (t, r) => (a(), u("line", {
-              x1: n.value.left + (r + 1) * L.value,
-              x2: n.value.left + (r + 1) * L.value,
+          }, null, 8, jt),
+          e.value.style.chart.layout.grid.showVerticalLines ? (a(), o("g", Bt, [
+            (a(!0), o(k, null, _(h.value.end - h.value.start, (t, i) => (a(), o("line", {
+              x1: n.value.left + (i + 1) * L.value,
+              x2: n.value.left + (i + 1) * L.value,
               y1: n.value.top,
-              y2: i.value.absoluteHeight - n.value.bottom,
+              y2: r.value.absoluteHeight - n.value.bottom,
               stroke: e.value.style.chart.layout.grid.stroke,
               "stroke-width": e.value.style.chart.layout.grid.strokeWidth,
               "stroke-linecap": "round"
-            }, null, 8, Bt))), 256))
+            }, null, 8, Yt))), 256))
           ])) : v("", !0)
         ])) : v("", !0),
-        e.value.style.chart.layout.grid.yAxis.dataLabels.show ? (a(), u("g", {
-          key: 1,
-          class: P({ "donut-opacity": !0, "donut-behind": g.value !== null || S.value })
+        e.value.style.chart.layout.grid.yAxis.dataLabels.show ? (a(), o("g", {
+          key: 2,
+          class: P({ "donut-opacity": !0, "donut-behind": g.value !== null || $.value })
         }, [
-          (a(!0), u(k, null, _(lt.value, (t, r) => (a(), u("g", null, [
-            t.value >= M.value.min && t.value <= M.value.max ? (a(), u("line", {
+          (a(!0), o(k, null, _(lt.value, (t, i) => (a(), o("g", null, [
+            t.value >= M.value.min && t.value <= M.value.max ? (a(), o("line", {
               key: 0,
               x1: n.value.left,
               x2: n.value.left - 5,
@@ -518,8 +530,8 @@ const Ot = ["id"], Tt = ["xmlns", "viewBox"], Dt = ["id"], Et = ["stop-color"],
               y2: t.y,
               stroke: e.value.style.chart.layout.grid.stroke,
               "stroke-width": e.value.style.chart.layout.grid.strokeWidth
-            }, null, 8, Yt)) : v("", !0),
-            t.value >= M.value.min && t.value <= M.value.max ? (a(), u("text", {
+            }, null, 8, Kt)) : v("", !0),
+            t.value >= M.value.min && t.value <= M.value.max ? (a(), o("text", {
               key: 1,
               x: n.value.left - 8 + e.value.style.chart.layout.grid.yAxis.dataLabels.offsetX,
               y: t.y + e.value.style.chart.layout.grid.yAxis.dataLabels.fontSize / 3,
@@ -527,7 +539,7 @@ const Ot = ["id"], Tt = ["xmlns", "viewBox"], Dt = ["id"], Et = ["stop-color"],
               "text-anchor": "end",
               fill: e.value.style.chart.layout.grid.yAxis.dataLabels.color,
               "font-weight": e.value.style.chart.layout.grid.yAxis.dataLabels.bold ? "bold" : "normal"
-            }, b(c(xt)(t.value) ? c(ye)(
+            }, m(c(xt)(t.value) ? c(ye)(
               e.value.style.chart.layout.dataLabels.formatter,
               t.value,
               c(te)({
@@ -536,53 +548,53 @@ const Ot = ["id"], Tt = ["xmlns", "viewBox"], Dt = ["id"], Et = ["stop-color"],
                 s: e.value.style.chart.layout.dataLabels.suffix,
                 r: e.value.style.chart.layout.grid.yAxis.dataLabels.roundingValue
               }),
-              { datapoint: t, seriesIndex: r }
-            ) : ""), 9, Kt)) : v("", !0)
+              { datapoint: t, seriesIndex: i }
+            ) : ""), 9, qt)) : v("", !0)
           ]))), 256))
         ], 2)) : v("", !0),
-        e.value.style.chart.layout.grid.xAxis.dataLabels.show ? (a(), u("g", {
-          key: 2,
-          class: P({ "donut-opacity": !0, "donut-behind": S.value })
+        e.value.style.chart.layout.grid.xAxis.dataLabels.show ? (a(), o("g", {
+          key: 3,
+          class: P({ "donut-opacity": !0, "donut-behind": $.value })
         }, [
-          (a(!0), u(k, null, _(h.value.end - h.value.start, (t, r) => (a(), u("g", null, [
-            e.value.style.chart.layout.grid.xAxis.dataLabels.showOnlyFirstAndLast && (r === 0 || r === E.value - 1) || !e.value.style.chart.layout.grid.xAxis.dataLabels.showOnlyFirstAndLast ? (a(), u("text", {
+          (a(!0), o(k, null, _(h.value.end - h.value.start, (t, i) => (a(), o("g", null, [
+            e.value.style.chart.layout.grid.xAxis.dataLabels.showOnlyFirstAndLast && (i === 0 || i === D.value - 1) || !e.value.style.chart.layout.grid.xAxis.dataLabels.showOnlyFirstAndLast ? (a(), o("text", {
               key: 0,
               "text-anchor": e.value.style.chart.layout.grid.xAxis.dataLabels.rotation > 0 ? "start" : e.value.style.chart.layout.grid.xAxis.dataLabels.rotation < 0 ? "end" : "middle",
               "font-size": e.value.style.chart.layout.grid.xAxis.dataLabels.fontSize,
               fill: e.value.style.chart.layout.grid.xAxis.dataLabels.color,
-              transform: `translate(${n.value.left + L.value * r + L.value / 2}, ${e.value.style.chart.layout.grid.xAxis.dataLabels.offsetY + i.value.absoluteHeight - n.value.bottom + e.value.style.chart.layout.grid.xAxis.dataLabels.fontSize * 2}), rotate(${e.value.style.chart.layout.grid.xAxis.dataLabels.rotation})`
-            }, b(e.value.style.chart.layout.grid.xAxis.dataLabels.values[Number(r) + Number(h.value.start)] ?? ""), 9, qt)) : v("", !0)
+              transform: `translate(${n.value.left + L.value * i + L.value / 2}, ${e.value.style.chart.layout.grid.xAxis.dataLabels.offsetY + r.value.absoluteHeight - n.value.bottom + e.value.style.chart.layout.grid.xAxis.dataLabels.fontSize * 2}), rotate(${e.value.style.chart.layout.grid.xAxis.dataLabels.rotation})`
+            }, m(e.value.style.chart.layout.grid.xAxis.dataLabels.values[Number(i) + Number(h.value.start)] ?? ""), 9, Jt)) : v("", !0)
           ]))), 256))
         ], 2)) : v("", !0),
-        (a(!0), u(k, null, _(w.value, (t, r) => (a(), u("g", null, [
-          e.value.style.chart.layout.line.show && r < w.value.length - 1 && ![t.subtotal, w.value[r + 1].subtotal].includes(null) ? (a(), u("line", {
+        (a(!0), o(k, null, _(w.value, (t, i) => (a(), o("g", null, [
+          e.value.style.chart.layout.line.show && i < w.value.length - 1 && ![t.subtotal, w.value[i + 1].subtotal].includes(null) ? (a(), o("line", {
             key: 0,
-            class: P({ "donut-opacity": !0, "donut-behind": g.value !== null || S.value }),
+            class: P({ "donut-opacity": !0, "donut-behind": g.value !== null || $.value }),
             x1: t.x,
             y1: t.y,
-            x2: w.value[r + 1].x,
-            y2: w.value[r + 1].y,
+            x2: w.value[i + 1].x,
+            y2: w.value[i + 1].y,
             stroke: e.value.style.chart.layout.line.stroke,
             "stroke-width": e.value.style.chart.layout.line.strokeWidth,
             "stroke-linecap": "round",
             "stroke-linejoin": "round"
-          }, null, 10, Jt)) : v("", !0),
-          t.subtotal !== null ? (a(), u("g", Qt, [
-            t.subtotal ? (a(), u("circle", {
+          }, null, 10, Qt)) : v("", !0),
+          t.subtotal !== null ? (a(), o("g", Zt, [
+            t.subtotal ? (a(), o("circle", {
               key: 0,
               cx: t.x,
               cy: t.y,
               r: t.activeRadius,
               fill: e.value.style.chart.backgroundColor
-            }, null, 8, Zt)) : v("", !0)
+            }, null, 8, el)) : v("", !0)
           ])) : v("", !0)
         ]))), 256)),
-        (a(!0), u(k, null, _(w.value, (t, r) => (a(), u("g", {
-          class: P({ "donut-opacity": !0, "donut-behind": r !== g.value && g.value !== null || S.value })
+        (a(!0), o(k, null, _(w.value, (t, i) => (a(), o("g", {
+          class: P({ "donut-opacity": !0, "donut-behind": i !== g.value && g.value !== null || $.value })
         }, [
-          t.subtotal ? (a(), u("g", el, [
-            g.value !== null && g.value === r ? (a(), u("g", tl, [
-              (a(!0), u(k, null, _(t.donutHover, (s) => (a(), u("g", null, [
+          t.subtotal ? (a(), o("g", tl, [
+            g.value !== null && g.value === i ? (a(), o("g", ll, [
+              (a(!0), o(k, null, _(t.donutHover, (s) => (a(), o("g", null, [
                 d("path", {
                   d: c(Xe)(s, { x: s.center.endX, y: s.center.endY }, 12, 12, { x: t.x, y: t.y }, !0, 20),
                   stroke: s.color,
@@ -590,9 +602,9 @@ const Ot = ["id"], Tt = ["xmlns", "viewBox"], Dt = ["id"], Et = ["stop-color"],
                   "stroke-linecap": "round",
                   "stroke-linejoin": "round",
                   fill: "none"
-                }, null, 8, ll)
+                }, null, 8, al)
               ]))), 256)),
-              (a(!0), u(k, null, _(t.donutHover, (s, f) => (a(), u("g", null, [
+              (a(!0), o(k, null, _(t.donutHover, (s, f) => (a(), o("g", null, [
                 d("text", {
                   "data-cy-hover-label": "",
                   "text-anchor": c(le)(s, !0, 0).anchor,
@@ -601,7 +613,7 @@ const Ot = ["id"], Tt = ["xmlns", "viewBox"], Dt = ["id"], Et = ["stop-color"],
                   fill: e.value.style.chart.layout.grid.yAxis.dataLabels.color,
                   "font-size": 8,
                   "font-weight": "bold"
-                }, b(s.name) + ": " + b(Ie(s, t.donut)) + " (" + b(s.value === null ? "-" : Y(s.value, s, f)) + ") ", 9, al)
+                }, m(s.name) + ": " + m(Ie(s, t.donut)) + " (" + m(s.value === null ? "-" : Y(s.value, s, f)) + ") ", 9, ol)
               ]))), 256)),
               d("g", null, [
                 d("circle", {
@@ -609,42 +621,42 @@ const Ot = ["id"], Tt = ["xmlns", "viewBox"], Dt = ["id"], Et = ["stop-color"],
                   cy: t.y,
                   r: t.hoverRadius,
                   fill: e.value.style.chart.backgroundColor
-                }, null, 8, ol)
+                }, null, 8, ul)
               ])
             ])) : v("", !0)
           ])) : v("", !0)
         ], 2))), 256)),
-        (a(!0), u(k, null, _(w.value, (t, r) => (a(), u("g", {
-          class: P({ "donut-opacity": !0, "donut-behind": r !== g.value && g.value !== null || S.value })
+        (a(!0), o(k, null, _(w.value, (t, i) => (a(), o("g", {
+          class: P({ "donut-opacity": !0, "donut-behind": i !== g.value && g.value !== null || $.value })
         }, [
-          t.subtotal !== null ? (a(), u("g", ul, [
-            t.subtotal === 0 ? (a(), u("circle", {
+          t.subtotal !== null ? (a(), o("g", sl, [
+            t.subtotal === 0 ? (a(), o("circle", {
               key: 0,
               cx: t.x,
               cy: t.y,
               r: 3,
               fill: e.value.style.chart.color
-            }, null, 8, sl)) : g.value !== null && g.value === r ? (a(), u("g", nl, [
-              (a(!0), u(k, null, _(t.donutHover, (s, f) => (a(), u("path", {
+            }, null, 8, nl)) : g.value !== null && g.value === i ? (a(), o("g", rl, [
+              (a(!0), o(k, null, _(t.donutHover, (s, f) => (a(), o("path", {
                 d: s.arcSlice,
                 fill: `${s.color}`,
                 "stroke-width": 1,
                 stroke: e.value.style.chart.backgroundColor
-              }, null, 8, rl))), 256))
-            ])) : (a(), u("g", il, [
-              (a(!0), u(k, null, _(t.donut, (s, f) => (a(), u("path", {
+              }, null, 8, il))), 256))
+            ])) : (a(), o("g", cl, [
+              (a(!0), o(k, null, _(t.donut, (s, f) => (a(), o("path", {
                 d: s.arcSlice,
                 fill: `${s.color}`,
                 "stroke-width": 0.5,
                 stroke: e.value.style.chart.backgroundColor
-              }, null, 8, cl))), 256))
+              }, null, 8, vl))), 256))
             ]))
           ])) : v("", !0)
         ], 2))), 256)),
-        (a(!0), u(k, null, _(w.value, (t, r) => (a(), u("g", {
-          class: P({ "donut-opacity": !0, "donut-behind": r !== g.value && g.value !== null || S.value })
+        (a(!0), o(k, null, _(w.value, (t, i) => (a(), o("g", {
+          class: P({ "donut-opacity": !0, "donut-behind": i !== g.value && g.value !== null || $.value })
         }, [
-          t.subtotal !== null && e.value.style.chart.layout.dataLabels.show ? (a(), u("text", {
+          t.subtotal !== null && e.value.style.chart.layout.dataLabels.show ? (a(), o("text", {
             key: 0,
             "text-anchor": "middle",
             x: t.x,
@@ -652,54 +664,54 @@ const Ot = ["id"], Tt = ["xmlns", "viewBox"], Dt = ["id"], Et = ["stop-color"],
             "font-size": e.value.style.chart.layout.dataLabels.fontSize,
             "font-weight": "bold",
             fill: e.value.style.chart.layout.dataLabels.color
-          }, b(Y(t.subtotal, t, r)), 9, vl)) : v("", !0)
+          }, m(Y(t.subtotal, t, i)), 9, dl)) : v("", !0)
         ], 2))), 256)),
-        (a(!0), u(k, null, _(w.value, (t, r) => (a(), u("rect", {
-          x: n.value.left + r * L.value,
-          y: i.value.absoluteHeight - n.value.bottom - 10,
+        (a(!0), o(k, null, _(w.value, (t, i) => (a(), o("rect", {
+          x: n.value.left + i * L.value,
+          y: r.value.absoluteHeight - n.value.bottom - 10,
           width: L.value,
           height: 10,
-          fill: g.value === t.index ? `url(#hover_${D.value})` : "transparent",
-          onClick: (s) => re(t, r),
+          fill: g.value === t.index ? `url(#hover_${T.value})` : "transparent",
+          onClick: (s) => re(t, i),
           class: P({ "donut-hover": g.value === t.index && t.subtotal })
-        }, null, 10, dl))), 256)),
-        (a(!0), u(k, null, _(w.value, (t, r) => (a(), u("rect", {
+        }, null, 10, hl))), 256)),
+        (a(!0), o(k, null, _(w.value, (t, i) => (a(), o("rect", {
           "data-cy-trap": "",
-          x: n.value.left + r * L.value,
+          x: n.value.left + i * L.value,
           y: n.value.top,
           width: L.value,
-          height: i.value.height,
+          height: r.value.height,
           fill: "transparent",
           onMouseenter: (s) => at(t),
           onMouseleave: Fe,
-          onClick: (s) => re(t, r),
+          onClick: (s) => re(t, i),
           class: P({ "donut-hover": g.value === t.index && t.subtotal })
-        }, null, 42, hl))), 256)),
-        S.value ? (a(), u("g", yl, [
+        }, null, 42, yl))), 256)),
+        $.value ? (a(), o("g", fl, [
           d("rect", {
             rx: 4,
             x: n.value.left,
             y: n.value.top,
-            width: i.value.width,
-            height: i.value.height,
+            width: r.value.width,
+            height: r.value.height,
             fill: e.value.style.chart.backgroundColor,
             style: { filter: "drop-shadow(0 12px 12px rgba(0,0,0,0.3))" }
-          }, null, 8, fl),
+          }, null, 8, gl),
           d("line", {
             "data-html2canvas-ignore": "",
-            x1: i.value.absoluteWidth - n.value.right - 15,
+            x1: r.value.absoluteWidth - n.value.right - 15,
             y1: n.value.top + 5,
-            x2: i.value.absoluteWidth - n.value.right - 4,
+            x2: r.value.absoluteWidth - n.value.right - 4,
             y2: n.value.top + 15.5,
             "stroke-linecap": "round",
             stroke: e.value.style.chart.color,
             "stroke-width": "1.5"
-          }, null, 8, gl),
+          }, null, 8, bl),
           d("line", {
             "data-html2canvas-ignore": "",
-            x1: i.value.absoluteWidth - n.value.right - 15,
+            x1: r.value.absoluteWidth - n.value.right - 15,
             y2: n.value.top + 5,
-            x2: i.value.absoluteWidth - n.value.right - 4,
+            x2: r.value.absoluteWidth - n.value.right - 4,
             y1: n.value.top + 15.5,
             "stroke-linecap": "round",
             stroke: e.value.style.chart.color,
@@ -709,39 +721,39 @@ const Ot = ["id"], Tt = ["xmlns", "viewBox"], Dt = ["id"], Et = ["stop-color"],
             "data-cy-close": "",
             onClick: Pe,
             onKeypress: ct(Pe, ["enter"]),
-            cx: i.value.absoluteWidth - n.value.right - i.value.width / 40,
-            cy: n.value.top + i.value.height / 30,
-            r: i.value.height / 12,
+            cx: r.value.absoluteWidth - n.value.right - r.value.width / 40,
+            cy: n.value.top + r.value.height / 30,
+            r: r.value.height / 12,
             fill: "transparent",
             style: { cursor: "pointer" },
             tabindex: "0"
-          }, null, 40, bl),
-          (a(!0), u(k, null, _(A.value.donutFocus, (t) => (a(), u("g", null, [
+          }, null, 40, xl),
+          (a(!0), o(k, null, _(A.value.donutFocus, (t) => (a(), o("g", null, [
             d("path", {
               "data-cy-zoom-donut": "",
-              d: c(Xe)(t, { x: i.value.centerX, y: i.value.centerY }, 12, 12, !1, !1, 15),
+              d: c(Xe)(t, { x: r.value.centerX, y: r.value.centerY }, 12, 12, !1, !1, 15),
               stroke: t.color,
               "stroke-width": "1",
               "stroke-linecap": "round",
               "stroke-linejoin": "round",
               fill: "none",
               class: "vue-ui-donut-evolution-focus"
-            }, null, 8, xl)
+            }, null, 8, pl)
           ]))), 256)),
           d("circle", {
-            cx: n.value.left + i.value.width / 2,
-            cy: n.value.top + i.value.height / 2,
-            r: i.value.height / 7,
+            cx: n.value.left + r.value.width / 2,
+            cy: n.value.top + r.value.height / 2,
+            r: r.value.height / 7,
             fill: e.value.style.chart.backgroundColor
-          }, null, 8, pl),
-          (a(!0), u(k, null, _(A.value.donutFocus, (t, r) => (a(), u("path", {
+          }, null, 8, kl),
+          (a(!0), o(k, null, _(A.value.donutFocus, (t, i) => (a(), o("path", {
             d: t.arcSlice,
             fill: `${t.color}`,
             "stroke-width": 1,
             stroke: e.value.style.chart.backgroundColor,
             class: "vue-ui-donut-evolution-focus"
-          }, null, 8, kl))), 256)),
-          (a(!0), u(k, null, _(A.value.donutFocus, (t, r) => (a(), u("g", _l, [
+          }, null, 8, _l))), 256)),
+          (a(!0), o(k, null, _(A.value.donutFocus, (t, i) => (a(), o("g", Cl, [
             d("text", {
               "text-anchor": c(le)(t, !0, 20).anchor,
               x: c(le)(t, !0, 10).x,
@@ -749,43 +761,43 @@ const Ot = ["id"], Tt = ["xmlns", "viewBox"], Dt = ["id"], Et = ["stop-color"],
               fill: e.value.style.chart.layout.grid.yAxis.dataLabels.color,
               "font-size": 10,
               "font-weight": "bold"
-            }, b(t.name) + ": " + b(Ie(t, A.value.donutFocus)) + " (" + b(t.value === null ? "-" : Y(t.value, t, r)) + ") ", 9, Cl)
+            }, m(t.name) + ": " + m(Ie(t, A.value.donutFocus)) + " (" + m(t.value === null ? "-" : Y(t.value, t, i)) + ") ", 9, wl)
           ]))), 256)),
           d("circle", {
-            cx: n.value.left + i.value.width / 2,
-            cy: n.value.top + i.value.height / 2,
-            r: i.value.height / 3.8,
-            fill: `url(#focus_${D.value})`
-          }, null, 8, wl),
+            cx: n.value.left + r.value.width / 2,
+            cy: n.value.top + r.value.height / 2,
+            r: r.value.height / 3.8,
+            fill: `url(#focus_${T.value})`
+          }, null, 8, Ll),
           d("circle", {
-            cx: n.value.left + i.value.width / 2,
-            cy: n.value.top + i.value.height / 2,
-            r: i.value.height / 7.7,
+            cx: n.value.left + r.value.width / 2,
+            cy: n.value.top + r.value.height / 2,
+            r: r.value.height / 7.7,
             fill: e.value.style.chart.backgroundColor
-          }, null, 8, Ll),
+          }, null, 8, zl),
           d("text", {
             "text-anchor": "middle",
-            x: n.value.left + i.value.width / 2,
-            y: n.value.top + i.value.height / 2 + 14 / 3,
+            x: n.value.left + r.value.width / 2,
+            y: n.value.top + r.value.height / 2 + 14 / 3,
             "font-size": 14,
             "font-weight": "bold",
             fill: e.value.style.chart.layout.dataLabels.color,
             class: "vue-ui-donut-evolution-focus"
-          }, b(Y(A.value.subtotal, A.value, null)), 9, zl),
-          e.value.style.chart.layout.grid.xAxis.dataLabels.values[A.value.index] ? (a(), u("text", {
+          }, m(Y(A.value.subtotal, A.value, null)), 9, Sl),
+          e.value.style.chart.layout.grid.xAxis.dataLabels.values[A.value.index] ? (a(), o("text", {
             key: 0,
             x: n.value.left + 6,
             y: n.value.top + e.value.style.chart.layout.grid.xAxis.dataLabels.fontSize * 2,
             "font-size": e.value.style.chart.layout.grid.xAxis.dataLabels.fontSize * 1.6,
             fill: e.value.style.chart.layout.dataLabels.color
-          }, b(e.value.style.chart.layout.grid.xAxis.dataLabels.values[Number(A.value.index) + Number(h.value.start)]), 9, Sl)) : v("", !0)
+          }, m(e.value.style.chart.layout.grid.xAxis.dataLabels.values[Number(A.value.index) + Number(h.value.start)]), 9, $l)) : v("", !0)
         ])) : v("", !0),
-        F(l.$slots, "svg", { svg: i.value }, void 0, !0)
-      ], 14, Tt)) : v("", !0),
-      l.$slots.watermark ? (a(), u("div", Al, [
-        F(l.$slots, "watermark", J(Q({ isPrinting: c(Se) || c(Ae) })), void 0, !0)
+        S(l.$slots, "svg", { svg: r.value }, void 0, !0)
+      ], 14, Et)) : v("", !0),
+      l.$slots.watermark ? (a(), o("div", Al, [
+        S(l.$slots, "watermark", J(Q({ isPrinting: c(Se) || c($e) })), void 0, !0)
       ])) : v("", !0),
-      j.value ? v("", !0) : (a(), T(St, {
+      j.value ? v("", !0) : (a(), E(St, {
         key: 6,
         config: {
           type: "donutEvolution",
@@ -802,7 +814,7 @@ const Ot = ["id"], Tt = ["xmlns", "viewBox"], Dt = ["id"], Et = ["stop-color"],
           }
         }
       }, null, 8, ["config"])),
-      E.value > 1 && e.value.style.chart.zoom.show ? (a(), T(At, {
+      D.value > 1 && e.value.style.chart.zoom.show ? (a(), E($t, {
         ref_key: "slicerComponent",
         ref: V,
         key: `slicer_${pe.value}`,
@@ -815,36 +827,36 @@ const Ot = ["id"], Tt = ["xmlns", "viewBox"], Dt = ["id"], Et = ["stop-color"],
         textColor: e.value.style.chart.color,
         inputColor: e.value.style.chart.zoom.color,
         selectColor: e.value.style.chart.zoom.highlightColor,
-        max: E.value,
+        max: D.value,
         min: 0,
         valueStart: h.value.start,
         valueEnd: h.value.end,
         start: h.value.start,
-        "onUpdate:start": o[0] || (o[0] = (t) => h.value.start = t),
+        "onUpdate:start": u[0] || (u[0] = (t) => h.value.start = t),
         end: h.value.end,
-        "onUpdate:end": o[1] || (o[1] = (t) => h.value.end = t),
+        "onUpdate:end": u[1] || (u[1] = (t) => h.value.end = t),
         refreshStartPoint: e.value.style.chart.zoom.startIndex !== null ? e.value.style.chart.zoom.startIndex : 0,
-        refreshEndPoint: e.value.style.chart.zoom.endIndex !== null ? e.value.style.chart.zoom.endIndex + 1 : E.value,
+        refreshEndPoint: e.value.style.chart.zoom.endIndex !== null ? e.value.style.chart.zoom.endIndex + 1 : D.value,
         onReset: ge
       }, {
-        "reset-action": I(({ reset: t }) => [
-          F(l.$slots, "reset-action", J(Q({ reset: t })), void 0, !0)
+        "reset-action": F(({ reset: t }) => [
+          S(l.$slots, "reset-action", J(Q({ reset: t })), void 0, !0)
         ]),
         _: 3
       }, 8, ["background", "borderColor", "fontSize", "useResetSlot", "labelLeft", "labelRight", "textColor", "inputColor", "selectColor", "max", "valueStart", "valueEnd", "start", "end", "refreshStartPoint", "refreshEndPoint"])) : v("", !0),
-      e.value.style.chart.legend.show ? (a(), T(zt, {
+      e.value.style.chart.legend.show ? (a(), E(zt, {
         key: `legend_${Ce.value}`,
         legendSet: Oe.value,
         config: ot.value,
-        onClickMarker: o[2] || (o[2] = ({ legend: t }) => ie(t.uid))
+        onClickMarker: u[2] || (u[2] = ({ legend: t }) => ie(t.uid))
       }, {
-        item: I(({ legend: t, index: r }) => [
+        item: F(({ legend: t, index: i }) => [
           d("div", {
             "data-cy-legend-item": "",
             onClick: (s) => ie(t.uid),
             style: q(`opacity:${C.value.includes(t.uid) ? 0.5 : 1}`)
           }, [
-            He(b(t.name) + ": " + b(c(ye)(
+            He(m(t.name) + ": " + m(c(ye)(
               e.value.style.chart.layout.dataLabels.formatter,
               t.value,
               c(te)({
@@ -853,22 +865,22 @@ const Ot = ["id"], Tt = ["xmlns", "viewBox"], Dt = ["id"], Et = ["stop-color"],
                 s: e.value.style.chart.layout.dataLabels.suffix,
                 r: e.value.style.chart.legend.roundingValue
               }),
-              { datapoint: t, seriesIndex: r }
+              { datapoint: t, seriesIndex: i }
             )) + " ", 1),
-            C.value.includes(t.uid) ? (a(), u("span", Il, " ( - % ) ")) : (a(), u("span", Nl, " (" + b(isNaN(t.value / Te.value) ? "-" : c(te)({
-              v: t.value / Te.value * 100,
+            C.value.includes(t.uid) ? (a(), o("span", Fl, " ( - % ) ")) : (a(), o("span", Il, " (" + m(isNaN(t.value / Ee.value) ? "-" : c(te)({
+              v: t.value / Ee.value * 100,
               s: "%",
               r: e.value.style.chart.legend.roundingPercentage
             })) + ") ", 1))
-          ], 12, $l)
+          ], 12, Nl)
         ]),
         _: 1
       }, 8, ["legendSet", "config"])) : v("", !0),
-      F(l.$slots, "legend", { legend: Oe.value }, void 0, !0),
-      l.$slots.source ? (a(), u("div", Fl, [
-        F(l.$slots, "source", {}, void 0, !0)
+      S(l.$slots, "legend", { legend: Oe.value }, void 0, !0),
+      l.$slots.source ? (a(), o("div", Pl, [
+        S(l.$slots, "source", {}, void 0, !0)
       ], 512)) : v("", !0),
-      j.value ? (a(), T($t, {
+      j.value ? (a(), E(At, {
         key: 10,
         hideDetails: "",
         config: {
@@ -884,22 +896,22 @@ const Ot = ["id"], Tt = ["xmlns", "viewBox"], Dt = ["id"], Et = ["stop-color"],
           }
         }
       }, {
-        content: I(() => [
-          (a(), T(Lt, {
+        content: F(() => [
+          (a(), E(Lt, {
             key: `table_${_e.value}`,
             colNames: H.value.colNames,
             head: H.value.head,
             body: H.value.body,
             config: H.value.config,
             title: `${e.value.style.chart.title.text}${e.value.style.chart.title.subtitle.text ? ` : ${e.value.style.chart.title.subtitle.text}` : ""}`,
-            onClose: o[3] || (o[3] = (t) => B.value.showTable = !1)
+            onClose: u[3] || (u[3] = (t) => B.value.showTable = !1)
           }, {
-            th: I(({ th: t }) => [
-              He(b(t.name ?? t), 1)
+            th: F(({ th: t }) => [
+              He(m(t.name ?? t), 1)
             ]),
-            td: I(({ td: t }) => [
-              t.value === null ? (a(), u("span", Pl, "-")) : (a(), u("b", Ol, b(isNaN(t.value) ? "" : e.value.style.chart.layout.dataLabels.prefix) + b(!isNaN(t.value) && t.value !== null ? Number(t.value.toFixed(e.value.table.td.roundingValue)).toLocaleString() : t) + b(isNaN(t.value) ? "" : e.value.style.chart.layout.dataLabels.suffix), 1)),
-              d("span", null, b(t.percentage && !isNaN(t.percentage) ? `(${Number(t.percentage.toFixed(e.value.table.td.roundingPercentage)).toLocaleString()}%)` : ""), 1)
+            td: F(({ td: t }) => [
+              t.value === null ? (a(), o("span", Ol, "-")) : (a(), o("b", El, m(isNaN(t.value) ? "" : e.value.style.chart.layout.dataLabels.prefix) + m(!isNaN(t.value) && t.value !== null ? Number(t.value.toFixed(e.value.table.td.roundingValue)).toLocaleString() : t) + m(isNaN(t.value) ? "" : e.value.style.chart.layout.dataLabels.suffix), 1)),
+              d("span", null, m(t.percentage && !isNaN(t.percentage) ? `(${Number(t.percentage.toFixed(e.value.table.td.roundingPercentage)).toLocaleString()}%)` : ""), 1)
             ]),
             _: 1
           }, 8, ["colNames", "head", "body", "config", "title"]))
@@ -908,7 +920,7 @@ const Ot = ["id"], Tt = ["xmlns", "viewBox"], Dt = ["id"], Et = ["stop-color"],
       }, 8, ["config"])) : v("", !0)
     ], 46, Ot));
   }
-}, ql = /* @__PURE__ */ Pt(Tl, [["__scopeId", "data-v-2d3649a3"]]);
+}, Jl = /* @__PURE__ */ Pt(Tl, [["__scopeId", "data-v-f941860c"]]);
 export {
-  ql as default
+  Jl as default
 };