vue-data-ui 2.3.28 → 2.3.30

package/dist/{vue-ui-3d-bar-gi0fEJUl.js → vue-ui-3d-bar-CjnVg4YI.js}

@@ -1,31 +1,31 @@
-import { computed as P, ref as z, onMounted as ze, openBlock as n, createElementBlock as i, normalizeClass as $e, normalizeStyle as D, createVNode as ge, createCommentVNode as k, createBlock as se, unref as v, createSlots as Be, withCtx as B, renderSlot as j, normalizeProps as R, guardReactiveProps as Y, createElementVNode as r, Fragment as $, renderList as g, toDisplayString as M, createTextVNode as Ie, nextTick as Oe, pushScopeId as Le, popScopeId as We } from "vue";
-import { u as Ge, c as _e, t as Ve, a as Ae, p as J, b as Ue, d as S, o as Ee, e as K, g as ae, l as A, m as me, f as I, X as He, h as Q, i as xe, j as O, k as ee, n as Ze, q as qe } from "./index-BhCM2QF1.js";
-import { _ as Xe } from "./Title-CtWGLaoz.js";
-import { u as Re, U as Ye } from "./usePrinter-B75HLwzw.js";
-import Je from "./vue-ui-skeleton-_VMQ594N.js";
-import { D as Ke } from "./DataTable-bEXuvNn5.js";
-import Qe from "./vue-ui-accordion-CSZdj7wA.js";
-import { u as be } from "./useNestedProp-CH3PVhvc.js";
-import { _ as et } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = ["xmlns", "viewBox"], ot = ["id"], st = ["stop-color"], at = ["stop-color"], nt = ["id"], rt = ["stop-color"], ut = ["stop-color"], it = ["id"], dt = ["stop-color"], ct = ["stop-color"], ht = ["id"], vt = ["stop-color"], ft = ["stop-color"], pt = ["stop-color"], yt = { key: 0 }, kt = ["id"], $t = ["stop-color"], gt = ["stop-color"], _t = ["id"], mt = ["stop-color"], xt = ["stop-color"], bt = ["id"], wt = ["stop-color"], Ct = ["stop-color"], Ft = ["id"], Mt = /* @__PURE__ */ te(() => /* @__PURE__ */ r("stop", {
+import { computed as P, ref as B, onMounted as Be, openBlock as n, createElementBlock as i, normalizeClass as ge, normalizeStyle as j, createVNode as _e, createCommentVNode as k, createBlock as ae, unref as h, createSlots as Ie, withCtx as I, renderSlot as S, normalizeProps as R, guardReactiveProps as Y, createElementVNode as r, Fragment as $, renderList as g, toDisplayString as M, createTextVNode as Le, nextTick as Oe, pushScopeId as We, popScopeId as Ge } from "vue";
+import { u as Ve, c as me, t as Ae, a as Ue, p as J, b as Ee, d as T, o as He, e as K, g as ne, l as A, m as xe, f as D, X as Ze, h as Q, i as ee, j as be, k as L, n as te, q as qe, r as Xe } from "./index-BlXzlBwZ.js";
+import { _ as Re } from "./Title-eBTH8iGJ.js";
+import { u as Ye, U as Je } from "./usePrinter-CZ8F5Cth.js";
+import Ke from "./vue-ui-skeleton-CJ2R5R6u.js";
+import { D as Qe } from "./DataTable-CsPidn0_.js";
+import et from "./vue-ui-accordion-wHRG3nXl.js";
+import { u as we } from "./useNestedProp-BoNl5H_z.js";
+import { _ as tt } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const le = (U) => (We("data-v-06e93dd9"), U = U(), Ge(), U), lt = ["id"], ot = ["xmlns", "viewBox"], st = ["id"], at = ["stop-color"], nt = ["stop-color"], rt = ["id"], ut = ["stop-color"], it = ["stop-color"], dt = ["id"], ct = ["stop-color"], ht = ["stop-color"], vt = ["id"], ft = ["stop-color"], pt = ["stop-color"], yt = ["stop-color"], kt = { key: 0 }, $t = ["id"], gt = ["stop-color"], _t = ["stop-color"], mt = ["id"], xt = ["stop-color"], bt = ["stop-color"], wt = ["id"], Ct = ["stop-color"], Ft = ["stop-color"], Mt = ["id"], Pt = /* @__PURE__ */ le(() => /* @__PURE__ */ r("stop", {
   offset: "0%",
   "stop-color": "#FFFFFF"
-}, null, -1)), Pt = /* @__PURE__ */ te(() => /* @__PURE__ */ r("stop", {
+}, null, -1)), Dt = /* @__PURE__ */ le(() => /* @__PURE__ */ r("stop", {
   offset: "100%",
   "stop-color": "#FFFFFF33"
-}, null, -1)), Dt = [
-  Mt,
-  Pt
-], jt = ["x", "y", "font-size", "font-weight", "fill"], St = ["x", "y"], Tt = ["d", "stroke"], Nt = ["d", "stroke"], zt = { key: 3 }, Bt = { key: 0 }, It = ["stroke-dasharray", "d", "stroke", "stroke-width"], Ot = ["stroke-dasharray", "d", "stroke", "stroke-width"], Lt = ["stroke-dasharray", "d", "stroke", "stroke-width"], Wt = ["stroke-dasharray", "d", "stroke", "stroke-width"], Gt = { key: 1 }, Vt = ["d", "stroke", "stroke-width", "fill"], At = ["d", "stroke", "stroke-width", "fill"], Ut = ["d", "stroke", "stroke-width", "fill"], Et = { key: 2 }, Ht = ["d", "fill", "onMouseenter", "onClick"], Zt = ["d", "fill", "onMouseenter", "onClick"], qt = ["d", "fill", "onMouseenter", "onClick"], Xt = ["d", "onMouseenter", "onClick"], Rt = ["d"], Yt = ["d", "stroke"], Jt = ["onClick"], Kt = ["stroke", "d"], Qt = ["cx", "cy", "fill", "stroke"], el = ["x", "y", "width", "height"], tl = { key: 1 }, ll = ["d", "stroke"], ol = ["d", "fill", "stroke"], sl = ["id"], al = ["stop-color"], nl = /* @__PURE__ */ te(() => /* @__PURE__ */ r("stop", {
+}, null, -1)), jt = [
+  Pt,
+  Dt
+], St = ["x", "y", "font-size", "font-weight", "fill"], Tt = ["x", "y"], zt = ["d", "stroke"], Nt = ["d", "stroke"], Bt = { key: 3 }, It = { key: 0 }, Lt = ["stroke-dasharray", "d", "stroke", "stroke-width"], Ot = ["stroke-dasharray", "d", "stroke", "stroke-width"], Wt = ["stroke-dasharray", "d", "stroke", "stroke-width"], Gt = ["stroke-dasharray", "d", "stroke", "stroke-width"], Vt = { key: 1 }, At = ["d", "stroke", "stroke-width", "fill"], Ut = ["d", "stroke", "stroke-width", "fill"], Et = ["d", "stroke", "stroke-width", "fill"], Ht = { key: 2 }, Zt = ["d", "fill", "onMouseenter", "onClick"], qt = ["d", "fill", "onMouseenter", "onClick"], Xt = ["d", "fill", "onMouseenter", "onClick"], Rt = ["d", "onMouseenter", "onClick"], Yt = ["d"], Jt = ["d", "stroke"], Kt = ["onClick"], Qt = ["stroke", "d"], el = ["cx", "cy", "fill", "stroke"], tl = ["x", "y", "width", "height"], ll = { key: 1 }, ol = ["d", "stroke"], sl = ["d", "fill", "stroke"], al = ["id"], nl = ["stop-color"], rl = /* @__PURE__ */ le(() => /* @__PURE__ */ r("stop", {
   offset: "77%",
   "stop-color": "#FFFFFF20"
-}, null, -1)), rl = ["stop-color"], ul = ["cx", "cy", "fill"], il = ["cx", "cy", "fill"], dl = { key: 0 }, cl = ["text-anchor", "x", "y", "fill", "font-size"], hl = ["text-anchor", "x", "y", "fill", "font-size"], vl = { key: 2 }, fl = ["d", "fill", "stroke"], pl = { key: 4 }, yl = { key: 0 }, kl = ["stroke-dasharray", "d", "stroke", "stroke-width"], $l = ["stroke-dasharray", "d", "stroke", "stroke-width"], gl = ["stroke-dasharray", "d", "stroke", "stroke-width"], _l = ["stroke-dasharray", "d", "stroke", "stroke-width"], ml = ["d", "stroke", "stroke-width", "fill"], xl = ["d", "stroke", "stroke-width", "fill"], bl = { key: 1 }, wl = ["onClick"], Cl = ["id"], Fl = ["stop-color"], Ml = ["stop-color"], Pl = ["id"], Dl = ["stop-color"], jl = ["stop-color"], Sl = ["stop-color"], Tl = ["stop-color"], Nl = ["stop-color"], zl = ["onMouseenter", "onClick", "d", "fill"], Bl = ["onMouseenter", "onClick", "d"], Il = ["onMouseenter", "onClick", "d", "fill"], Ol = ["onClick"], Ll = ["stroke", "d"], Wl = ["cx", "cy", "fill", "stroke"], Gl = ["x", "y", "width", "height"], Vl = { key: 1 }, Al = ["d", "stroke"], Ul = ["d", "fill", "stroke"], El = ["id"], Hl = ["stop-color"], Zl = /* @__PURE__ */ te(() => /* @__PURE__ */ r("stop", {
+}, null, -1)), ul = ["stop-color"], il = ["cx", "cy", "fill"], dl = ["cx", "cy", "fill"], cl = { key: 0 }, hl = ["text-anchor", "x", "y", "fill", "font-size"], vl = ["text-anchor", "x", "y", "fill", "font-size"], fl = { key: 2 }, pl = ["d", "fill", "stroke"], yl = { key: 4 }, kl = { key: 0 }, $l = ["stroke-dasharray", "d", "stroke", "stroke-width"], gl = ["stroke-dasharray", "d", "stroke", "stroke-width"], _l = ["stroke-dasharray", "d", "stroke", "stroke-width"], ml = ["stroke-dasharray", "d", "stroke", "stroke-width"], xl = ["d", "stroke", "stroke-width", "fill"], bl = ["d", "stroke", "stroke-width", "fill"], wl = { key: 1 }, Cl = ["onClick"], Fl = ["id"], Ml = ["stop-color"], Pl = ["stop-color"], Dl = ["id"], jl = ["stop-color"], Sl = ["stop-color"], Tl = ["stop-color"], zl = ["stop-color"], Nl = ["stop-color"], Bl = ["onMouseenter", "onClick", "d", "fill"], Il = ["onMouseenter", "onClick", "d"], Ll = ["onMouseenter", "onClick", "d", "fill"], Ol = ["onClick"], Wl = ["stroke", "d"], Gl = ["cx", "cy", "fill", "stroke"], Vl = ["x", "y", "width", "height"], Al = { key: 1 }, Ul = ["d", "stroke"], El = ["d", "fill", "stroke"], Hl = ["id"], Zl = ["stop-color"], ql = /* @__PURE__ */ le(() => /* @__PURE__ */ r("stop", {
   offset: "77%",
   "stop-color": "#FFFFFF20"
-}, null, -1)), ql = ["stop-color"], Xl = ["cx", "cy", "fill"], Rl = ["cx", "cy", "fill"], Yl = { key: 0 }, Jl = ["text-anchor", "x", "y", "fill", "font-size"], Kl = ["text-anchor", "x", "y", "fill", "font-size"], Ql = { key: 2 }, eo = ["d", "fill", "stroke"], to = {
+}, null, -1)), Xl = ["stop-color"], Rl = ["cx", "cy", "fill"], Yl = ["cx", "cy", "fill"], Jl = { key: 0 }, Kl = ["text-anchor", "x", "y", "fill", "font-size"], Ql = ["text-anchor", "x", "y", "fill", "font-size"], eo = { key: 2 }, to = ["d", "fill", "stroke"], lo = {
   key: 3,
   class: "vue-data-ui-watermark"
-}, lo = ["innerHTML"], oo = {
+}, oo = ["innerHTML"], so = {
   __name: "vue-ui-3d-bar",
   props: {
     config: {
@@ -42,23 +42,23 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
     }
   },
   emits: ["selectDatapoint"],
-  setup(U, { expose: we, emit: H }) {
-    const _ = U, { vue_ui_3d_bar: Ce } = Ge(), Z = P(() => !!_.dataset && Object.keys(_.dataset).length), x = z(_e()), Fe = z(null), ne = z(null), L = z(!1), t = P(() => {
-      const d = be({
+  setup(U, { expose: Ce, emit: H }) {
+    const _ = U, { vue_ui_3d_bar: Fe } = Ve(), Z = P(() => !!_.dataset && Object.keys(_.dataset).length), x = B(me()), Me = B(null), re = B(null), O = B(!1), t = P(() => {
+      const d = we({
         userConfig: _.config,
-        defaultConfig: Ce
+        defaultConfig: Fe
       });
       return d.theme ? {
-        ...be({
-          userConfig: Ve.vue_ui_3d_bar[d.theme] || _.config,
+        ...we({
+          userConfig: Ae.vue_ui_3d_bar[d.theme] || _.config,
           defaultConfig: d
         }),
-        customPalette: Ae[d.theme] || J
+        customPalette: Ue[d.theme] || J
       } : d;
-    }), { isPrinting: re, isImaging: ue, generatePdf: ie, generateImage: de } = Re({
+    }), { isPrinting: ue, isImaging: ie, generatePdf: de, generateImage: ce } = Ye({
       elementId: `3d_bar_${x.value}`,
       fileName: t.value.style.chart.title.text || "vue-ui-3d-bar"
-    }), Me = P(() => Ue(t.value.customPalette)), q = z({
+    }), Pe = P(() => Ee(t.value.customPalette)), q = B({
       showTable: t.value.table.show
     }), C = P(() => _.dataset.series && _.dataset.series.length), o = P(() => ({
       height: t.value.style.chart.box.dimensions.height,
@@ -73,21 +73,21 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
       if (C.value) {
         const d = _.dataset.series.map((l) => l.value || 0).reduce((l, a) => l + a, 0), s = _.dataset.series.map((l, a) => ({
           ...l,
-          id: _e(),
+          id: me(),
           proportion: (l.value || 0) / d,
-          color: S(l.color) || Me.value[a] || J[a] || J[a % J.length],
+          color: T(l.color) || Pe.value[a] || J[a] || J[a % J.length],
           breakdown: l.breakdown ? l.breakdown.sort((u, y) => y.value - u.value) : null
         })).sort((l, a) => a.value - l.value), e = [];
         let c = 0;
         for (let l = 0; l < s.length; l += 1)
           e.push({
             ...s[l],
-            fill: Pe(c, s[l].proportion, s[l].breakdown, s[l].color)
+            fill: De(c, s[l].proportion, s[l].breakdown, s[l].color)
           }), c += s[l].proportion;
         return e;
       }
       return null;
-    }), T = P(() => ({
+    }), z = P(() => ({
       right: `M${o.value.width / 2},${o.value.top} ${o.value.width - o.value.right}, ${o.value.top + o.value.perspective} ${o.value.width - o.value.right},${o.value.height - o.value.bottom - o.value.perspective} ${o.value.width / 2},${o.value.height - o.value.bottom}`,
       left: `M${o.value.width / 2},${o.value.top} ${o.value.left},${o.value.top + o.value.perspective} ${o.value.left},${o.value.height - o.value.bottom - o.value.perspective} ${o.value.width / 2},${o.value.height - o.value.bottom}`,
       side: `M${o.value.width / 2},${o.value.height - o.value.bottom} ${o.value.width / 2},${o.value.top + o.value.perspective * 2}`,
@@ -96,13 +96,13 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
       tubeLeft: `M${o.value.left},${o.value.top + o.value.perspective} ${o.value.left},${o.value.height - o.value.bottom - o.value.perspective}`,
       tubeRight: `M${o.value.width - o.value.right},${o.value.top + o.value.perspective} ${o.value.width - o.value.right},${o.value.height - o.value.bottom - o.value.perspective}`,
       tubeBottom: `M${o.value.width - o.value.right},${o.value.height - o.value.bottom - o.value.perspective} C ${o.value.width - o.value.right},${o.value.height} ${o.value.left},${o.value.height} ${o.value.left},${o.value.height - o.value.bottom - o.value.perspective}`
-    })), W = z(t.value.style.chart.animation.use ? 0 : _.dataset.percentage);
-    ze(() => {
-      Ee(_.dataset) ? K({
+    })), G = B(t.value.style.chart.animation.use ? 0 : _.dataset.percentage);
+    Be(() => {
+      He(_.dataset) ? K({
         componentName: "VueUi3dBar",
         type: "dataset"
       }) : _.dataset.series ? _.dataset.series.forEach((l, a) => {
-        ae({
+        ne({
           datasetObject: l,
           requiredAttributes: ["name", "value"]
         }).forEach((u) => {
@@ -113,7 +113,7 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
             index: a
           });
         }), l.breakdown && l.breakdown.forEach((u, y) => {
-          ae({
+          ne({
             datasetObject: u,
             requiredAttributes: ["name", "value"]
           }).forEach((m) => {
@@ -125,7 +125,7 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
             });
           });
         });
-      }) : ae({
+      }) : ne({
         datasetObject: _.dataset,
         requiredAttributes: ["percentage"]
       }).forEach((l) => {
@@ -137,21 +137,21 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
       });
       let d = 0, s = t.value.style.chart.animation.speed, e = 5e-3 * t.value.style.chart.animation.acceleration;
       function c() {
-        W.value += s + d, d += e, W.value < _.dataset.percentage ? requestAnimationFrame(c) : W.value = _.dataset.percentage;
+        G.value += s + d, d += e, G.value < _.dataset.percentage ? requestAnimationFrame(c) : G.value = _.dataset.percentage;
       }
-      t.value.style.chart.animation.use && (W.value = 0, c());
+      t.value.style.chart.animation.use && (G.value = 0, c());
     });
-    function Pe(d, s, e, c) {
-      const l = o.value.height - o.value.bottom - o.value.top - o.value.perspective * 2, { width: a, height: u, bottom: y, right: m, left: f, perspective: p } = o.value, h = y + l * d, oe = u - h - p - l * s / 2, Se = oe > o.value.height / 2 ? "top" : "bottom", fe = 64, Te = !!e;
-      let pe = null, ye = null;
-      return Te && (e = e.map((ke, Ne) => ({
-        ...ke,
-        value: ke.value || 0,
+    function De(d, s, e, c) {
+      const l = o.value.height - o.value.bottom - o.value.top - o.value.perspective * 2, { width: a, height: u, bottom: y, right: m, left: f, perspective: p } = o.value, v = y + l * d, se = u - v - p - l * s / 2, Te = se > o.value.height / 2 ? "top" : "bottom", pe = 64, ze = !!e;
+      let ye = null, ke = null;
+      return ze && (e = e.map(($e, Ne) => ({
+        ...$e,
+        value: $e.value || 0,
         color: A(c, Ne / e.length)
-      })), pe = me(
+      })), ye = xe(
         { series: e },
         a + o.value.absoluteWidth / 4 - 14,
-        Se === "top" ? oe - fe : oe + fe,
+        Te === "top" ? se - pe : se + pe,
         28,
         28,
         1.99999,
@@ -160,10 +160,10 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
         360,
         105.25,
         14
-      ), ye = me(
+      ), ke = xe(
         { series: e },
         a - m + 20,
-        u - h - p - l * s / 2,
+        u - v - p - l * s / 2,
         6,
         6,
         1.99999,
@@ -173,37 +173,37 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
         105.25,
         6
       )), {
-        donut: pe,
-        miniDonut: ye,
+        donut: ye,
+        miniDonut: ke,
         sidePointer: {
           x: a - m,
-          y: u - h - p - l * s / 2,
-          topY: u - h - p - l * s,
+          y: u - v - p - l * s / 2,
+          topY: u - v - p - l * s,
           height: l * s
         },
-        apexBottom: { y: u - h, x: a / 2 },
-        apexTop: { y: u - h - l * s, x: a / 2 },
-        right: `M${a / 2},${u - h} ${a / 2},${u - h - l * s} ${a - m},${u - h - p - l * s} ${a - m},${u - h - p}Z`,
-        left: `M${a / 2},${u - h} ${a / 2},${u - h - l * s} ${f}, ${u - h - p - l * s} ${f},${u - h - p}Z`,
-        liningTop: `M${f},${u - h - p - l * s} ${a / 2},${u - h - l * s} ${a - m},${u - h - p - l * s}`,
-        liningTopShade: `M${f},${u - h - p - l * s - 0.5} ${a / 2},${u - h - l * s - 0.5} ${a - m},${u - h - p - l * s - 0.5}`,
-        top: `M${a / 2},${u - h - l * s} ${f},${u - h - p - l * s} ${a / 2},${u - h - p * 2 - l * s} ${a - m},${u - h - p - l * s} Z`,
-        tubeTop: `M${f},${u - h - l * s - p} C ${f},${u - h - l * s - p * 2.5} ${a - m},${u - h - l * s - p * 2.5} ${a - m},${u - h - l * s - p} C ${a - m},${u - h - l * s + p / 2} ${f},${u - h - l * s + p / 2} ${f},${u - h - l * s - p}`,
-        bottomTubeTop: `M ${a - m - 0.5},${u - h - p} C ${a - m - 0.5},${u - h + p / 2} ${f},${u - h + p / 2} ${f + 0.5},${u - h - p}`,
+        apexBottom: { y: u - v, x: a / 2 },
+        apexTop: { y: u - v - l * s, x: a / 2 },
+        right: `M${a / 2},${u - v} ${a / 2},${u - v - l * s} ${a - m},${u - v - p - l * s} ${a - m},${u - v - p}Z`,
+        left: `M${a / 2},${u - v} ${a / 2},${u - v - l * s} ${f}, ${u - v - p - l * s} ${f},${u - v - p}Z`,
+        liningTop: `M${f},${u - v - p - l * s} ${a / 2},${u - v - l * s} ${a - m},${u - v - p - l * s}`,
+        liningTopShade: `M${f},${u - v - p - l * s - 0.5} ${a / 2},${u - v - l * s - 0.5} ${a - m},${u - v - p - l * s - 0.5}`,
+        top: `M${a / 2},${u - v - l * s} ${f},${u - v - p - l * s} ${a / 2},${u - v - p * 2 - l * s} ${a - m},${u - v - p - l * s} Z`,
+        tubeTop: `M${f},${u - v - l * s - p} C ${f},${u - v - l * s - p * 2.5} ${a - m},${u - v - l * s - p * 2.5} ${a - m},${u - v - l * s - p} C ${a - m},${u - v - l * s + p / 2} ${f},${u - v - l * s + p / 2} ${f},${u - v - l * s - p}`,
+        bottomTubeTop: `M ${a - m - 0.5},${u - v - p} C ${a - m - 0.5},${u - v + p / 2} ${f},${u - v + p / 2} ${f + 0.5},${u - v - p}`,
         tubeBody: `M
-        ${f},${u - h - l * s - p} 
-        C ${f},${u - h - l * s + p / 2} 
-        ${a - m},${u - h - l * s + p / 2} 
-        ${a - m},${u - h - l * s - p} 
-        L${a - m},${u - h - p}
+        ${f},${u - v - l * s - p} 
+        C ${f},${u - v - l * s + p / 2} 
+        ${a - m},${u - v - l * s + p / 2} 
+        ${a - m},${u - v - l * s - p} 
+        L${a - m},${u - v - p}
         C 
-        ${a - m},${u - h + p / 2}
-        ${f},${u - h + p / 2}
-        ${f},${u - h - p}Z`
+        ${a - m},${u - v + p / 2}
+        ${f},${u - v + p / 2}
+        ${f},${u - v - p}Z`
       };
     }
     const E = P(() => {
-      const d = W.value / 100, s = o.value.height - o.value.bottom - o.value.top - o.value.perspective * 2, { width: e, height: c, bottom: l, right: a, left: u, perspective: y } = o.value, f = l + s * 0;
+      const d = G.value / 100, s = o.value.height - o.value.bottom - o.value.top - o.value.perspective * 2, { width: e, height: c, bottom: l, right: a, left: u, perspective: y } = o.value, f = l + s * 0;
       return {
         right: `M${e / 2},${c - f} ${e / 2},${c - f - s * d} ${e - a},${c - f - y - s * d} ${e - a},${c - f - y}Z`,
         left: `M${e / 2},${c - f} ${e / 2},${c - f - s * d} ${u}, ${c - f - y - s * d} ${u},${c - f - y}Z`,
@@ -220,25 +220,25 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
         ${u},${c}
         ${u},${c - f - y}Z`
       };
-    }), b = z(null);
+    }), b = B(null);
     function F(d, s = !1) {
-      H("selectDatapoint", d), s || (b.value = d.id), s && L.value && (L.value = !1), s && !L.value && (L.value = !0);
+      H("selectDatapoint", d), s || (b.value = d.id), s && O.value && (O.value = !1), s && !O.value && (O.value = !0);
     }
-    function G() {
-      L.value || (b.value = null);
+    function W() {
+      O.value || (b.value = null);
     }
     function V(d, s, e = !1) {
-      const c = _.dataset.series.map((u) => u.value || 0).reduce((u, y) => u + y, 0), l = isNaN(d.value / c) ? 0 : d.value / c * 100, a = isNaN(d.value / ce(s)) ? 0 : d.value / ce(s) * 100;
+      const c = _.dataset.series.map((u) => u.value || 0).reduce((u, y) => u + y, 0), l = isNaN(d.value / c) ? 0 : d.value / c * 100, a = isNaN(d.value / he(s)) ? 0 : d.value / he(s) * 100;
       return e ? a : l.toFixed(0) + "%";
     }
-    function ce(d) {
+    function he(d) {
       return [...d].map((s) => s.value).reduce((s, e) => s + e, 0);
     }
-    const le = z(!1);
-    function De(d) {
-      le.value = d;
+    const oe = B(!1);
+    function je(d) {
+      oe.value = d;
     }
-    function je() {
+    function Se() {
       return C.value ? w.value : _.dataset.percentage;
     }
     const N = P(() => {
@@ -254,7 +254,7 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
       } else
         return null;
     });
-    function he() {
+    function ve() {
       if (!C.value) {
         console.warn("VueUi3dBar : CSV download is only available in stack mode (providing dataset.series instead of dataset.percentage)");
         return;
@@ -262,24 +262,28 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
       Oe(() => {
         const d = w.value.map((l) => l.value).reduce((l, a) => l + a, 0), s = N.value.head.map((l, a) => [[
           l.name
-        ], [N.value.body[a]], [isNaN(N.value.body[a] / d) ? "-" : N.value.body[a] / d * 100]]), e = [[t.value.style.chart.title.text], [t.value.style.chart.title.subtitle.text], [[""], ["val"], ["%"]]].concat(s), c = Ze(e);
-        qe({ csvContent: c, title: t.value.style.chart.title.text || "vue-ui-3d-bar" });
+        ], [N.value.body[a]], [isNaN(N.value.body[a] / d) ? "-" : N.value.body[a] / d * 100]]), e = [[t.value.style.chart.title.text], [t.value.style.chart.title.subtitle.text], [[""], ["val"], ["%"]]].concat(s), c = qe(e);
+        Xe({ csvContent: c, title: t.value.style.chart.title.text || "vue-ui-3d-bar" });
       });
     }
     const X = P(() => {
       const d = w.value.map((a) => a.value).reduce((a, u) => a + u, 0), s = [
         ' <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M18 16v2a1 1 0 0 1 -1 1h-11l6 -7l-6 -7h11a1 1 0 0 1 1 1v2" /></svg>',
-        I({ p: t.value.style.chart.legend.prefix, v: d, s: t.value.style.chart.legend.suffix, r: t.value.table.td.roundingValue }),
+        D({ p: t.value.style.chart.legend.prefix, v: d, s: t.value.style.chart.legend.suffix, r: t.value.table.td.roundingValue }),
         "100%"
       ], e = N.value.head.map((a, u) => {
-        const y = I({ p: t.value.style.chart.legend.prefix, v: N.value.body[u], s: t.value.style.chart.legend.suffix, r: t.value.table.td.roundingValue });
+        const y = D({ p: t.value.style.chart.legend.prefix, v: N.value.body[u], s: t.value.style.chart.legend.suffix, r: t.value.table.td.roundingValue });
         return [
           {
             color: a.color,
             name: a.name
           },
           y,
-          isNaN(N.value.body[u] / d) ? "-" : (N.value.body[u] / d * 100).toFixed(t.value.table.td.roundingPercentage) + "%"
+          isNaN(N.value.body[u] / d) ? "-" : D({
+            v: N.value.body[u] / d * 100,
+            s: "%",
+            r: t.value.table.td.roundingPercentage
+          })
         ];
       }), c = {
         th: {
@@ -306,27 +310,27 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
         config: c
       };
     });
-    function ve() {
+    function fe() {
       q.value.showTable = !q.value.showTable;
     }
-    return we({
-      generateCsv: he,
-      generatePdf: ie,
-      generateImage: de,
-      getData: je,
-      toggleTable: ve
+    return Ce({
+      generateCsv: ve,
+      generatePdf: de,
+      generateImage: ce,
+      getData: Se,
+      toggleTable: fe
     }), (d, s) => (n(), i("div", {
       ref_key: "bar3dChart",
-      ref: ne,
-      class: $e("vue-ui-3d-bar"),
-      style: D(`font-family:${t.value.style.fontFamily};width:100%; text-align:center;background:${t.value.style.chart.backgroundColor}`),
+      ref: re,
+      class: ge("vue-ui-3d-bar"),
+      style: j(`font-family:${t.value.style.fontFamily};width:100%; text-align:center;background:${t.value.style.chart.backgroundColor}`),
       id: `3d_bar_${x.value}`
     }, [
       t.value.style.chart.title.text ? (n(), i("div", {
         key: 0,
-        style: D(`width:100%;background:${t.value.style.chart.backgroundColor}`)
+        style: j(`width:100%;background:${t.value.style.chart.backgroundColor}`)
       }, [
-        ge(Xe, {
+        _e(Re, {
           config: {
             title: {
               cy: "3dBar-div-title",
@@ -339,14 +343,14 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
           }
         }, null, 8, ["config"])
       ], 4)) : k("", !0),
-      t.value.userOptions.show && Z.value ? (n(), se(Ye, {
+      t.value.userOptions.show && Z.value ? (n(), ae(Je, {
         key: 1,
         ref_key: "details",
-        ref: Fe,
+        ref: Me,
         backgroundColor: t.value.style.chart.backgroundColor,
         color: t.value.style.chart.color,
-        isPrinting: v(re),
-        isImaging: v(ue),
+        isPrinting: h(ue),
+        isImaging: h(ie),
         uid: x.value,
         hasPdf: t.value.userOptions.buttons.pdf,
         hasTable: !!C.value && t.value.userOptions.buttons.table,
@@ -354,55 +358,55 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
         hasImg: t.value.userOptions.buttons.img,
         hasFullscreen: t.value.userOptions.buttons.fullscreen,
         titles: { ...t.value.userOptions.buttonTitles },
-        chartElement: ne.value,
-        onToggleFullscreen: De,
-        onGeneratePdf: v(ie),
-        onGenerateCsv: he,
-        onGenerateImage: v(de),
-        onToggleTable: ve
-      }, Be({ _: 2 }, [
+        chartElement: re.value,
+        onToggleFullscreen: je,
+        onGeneratePdf: h(de),
+        onGenerateCsv: ve,
+        onGenerateImage: h(ce),
+        onToggleTable: fe
+      }, Ie({ _: 2 }, [
         d.$slots.optionPdf ? {
           name: "optionPdf",
-          fn: B(() => [
-            j(d.$slots, "optionPdf", {}, void 0, !0)
+          fn: I(() => [
+            S(d.$slots, "optionPdf", {}, void 0, !0)
           ]),
           key: "0"
         } : void 0,
         d.$slots.optionCsv ? {
           name: "optionCsv",
-          fn: B(() => [
-            j(d.$slots, "optionCsv", {}, void 0, !0)
+          fn: I(() => [
+            S(d.$slots, "optionCsv", {}, void 0, !0)
           ]),
           key: "1"
         } : void 0,
         d.$slots.optionImg ? {
           name: "optionImg",
-          fn: B(() => [
-            j(d.$slots, "optionImg", {}, void 0, !0)
+          fn: I(() => [
+            S(d.$slots, "optionImg", {}, void 0, !0)
           ]),
           key: "2"
         } : void 0,
         d.$slots.optionTable ? {
           name: "optionTable",
-          fn: B(() => [
-            j(d.$slots, "optionTable", {}, void 0, !0)
+          fn: I(() => [
+            S(d.$slots, "optionTable", {}, void 0, !0)
           ]),
           key: "3"
         } : void 0,
         d.$slots.optionFullscreen ? {
           name: "optionFullscreen",
-          fn: B(({ toggleFullscreen: e, isFullscreen: c }) => [
-            j(d.$slots, "optionFullscreen", R(Y({ toggleFullscreen: e, isFullscreen: c })), void 0, !0)
+          fn: I(({ toggleFullscreen: e, isFullscreen: c }) => [
+            S(d.$slots, "optionFullscreen", R(Y({ toggleFullscreen: e, isFullscreen: c })), void 0, !0)
           ]),
           key: "4"
         } : void 0
       ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasPdf", "hasTable", "hasXls", "hasImg", "hasFullscreen", "titles", "chartElement", "onGeneratePdf", "onGenerateImage"])) : k("", !0),
       Z.value ? (n(), i("svg", {
         key: 2,
-        xmlns: v(He),
-        class: $e({ "vue-data-ui-fullscreen--on": le.value, "vue-data-ui-fulscreen--off": !le.value }),
+        xmlns: h(Ze),
+        class: ge({ "vue-data-ui-fullscreen--on": oe.value, "vue-data-ui-fulscreen--off": !oe.value }),
         viewBox: `0 0 ${o.value.absoluteWidth} ${o.value.height}`,
-        style: D(`max-width:100%; overflow: visible; background:${t.value.style.chart.backgroundColor};color:${t.value.style.chart.color}`)
+        style: j(`max-width:100%; overflow: visible; background:${t.value.style.chart.backgroundColor};color:${t.value.style.chart.color}`)
       }, [
         r("defs", null, [
           r("radialGradient", {
@@ -410,37 +414,37 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
           }, [
             r("stop", {
               offset: "0%",
-              "stop-color": `${v(S)(t.value.style.chart.backgroundColor)}00`
-            }, null, 8, st),
+              "stop-color": `${h(T)(t.value.style.chart.backgroundColor)}00`
+            }, null, 8, at),
             r("stop", {
               offset: "100%",
               "stop-color": `${t.value.style.chart.bar.color}`
-            }, null, 8, at)
-          ], 8, ot),
+            }, null, 8, nt)
+          ], 8, st),
           r("radialGradient", {
             id: `gradient_left${x.value}`
           }, [
             r("stop", {
               offset: "0%",
-              "stop-color": `${v(S)(t.value.style.chart.backgroundColor)}00`
-            }, null, 8, rt),
+              "stop-color": `${h(T)(t.value.style.chart.backgroundColor)}00`
+            }, null, 8, ut),
             r("stop", {
               offset: "100%",
               "stop-color": `${t.value.style.chart.bar.color}33`
-            }, null, 8, ut)
-          ], 8, nt),
+            }, null, 8, it)
+          ], 8, rt),
           r("radialGradient", {
             id: `gradient_right${x.value}`
           }, [
             r("stop", {
               offset: "0%",
-              "stop-color": `${v(S)(t.value.style.chart.backgroundColor)}00`
-            }, null, 8, dt),
+              "stop-color": `${h(T)(t.value.style.chart.backgroundColor)}00`
+            }, null, 8, ct),
             r("stop", {
               offset: "100%",
               "stop-color": `${t.value.style.chart.bar.color}33`
-            }, null, 8, ct)
-          ], 8, it),
+            }, null, 8, ht)
+          ], 8, dt),
           r("linearGradient", {
             id: `gradient_tube_body${x.value}`,
             x1: "0%",
@@ -451,61 +455,61 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
             r("stop", {
               offset: "0%",
               "stop-color": `${t.value.style.chart.bar.color}`
-            }, null, 8, vt),
+            }, null, 8, ft),
             r("stop", {
               offset: "75%",
-              "stop-color": `${v(S)(t.value.style.chart.backgroundColor)}00`
-            }, null, 8, ft),
+              "stop-color": `${h(T)(t.value.style.chart.backgroundColor)}00`
+            }, null, 8, pt),
             r("stop", {
               offset: "100%",
               "stop-color": `${t.value.style.chart.bar.color}66`
-            }, null, 8, pt)
-          ], 8, ht)
+            }, null, 8, yt)
+          ], 8, vt)
         ]),
-        C.value ? (n(), i("defs", yt, [
+        C.value ? (n(), i("defs", kt, [
           (n(!0), i($, null, g(w.value, (e) => (n(), i("radialGradient", {
             id: `grad_top_${e.id}`
           }, [
             r("stop", {
               offset: "0%",
-              "stop-color": `${v(A)(e.color, 0.5)}DD`
-            }, null, 8, $t),
+              "stop-color": `${h(A)(e.color, 0.5)}DD`
+            }, null, 8, gt),
             r("stop", {
               offset: "100%",
               "stop-color": `${e.color}`
-            }, null, 8, gt)
-          ], 8, kt))), 256)),
+            }, null, 8, _t)
+          ], 8, $t))), 256)),
           (n(!0), i($, null, g(w.value, (e) => (n(), i("linearGradient", {
             id: `grad_left_${e.id}`
           }, [
             r("stop", {
               offset: "0%",
               "stop-color": `${e.color}DD`
-            }, null, 8, mt),
+            }, null, 8, xt),
             r("stop", {
               offset: "100%",
-              "stop-color": `${v(Q)(e.color, 0.5)}FF`
-            }, null, 8, xt)
-          ], 8, _t))), 256)),
+              "stop-color": `${h(Q)(e.color, 0.5)}FF`
+            }, null, 8, bt)
+          ], 8, mt))), 256)),
           (n(!0), i($, null, g(w.value, (e) => (n(), i("linearGradient", {
             id: `grad_right_${e.id}`
           }, [
             r("stop", {
               offset: "2%",
-              "stop-color": `${v(A)(e.color, 0.5)}FF`
-            }, null, 8, wt),
+              "stop-color": `${h(A)(e.color, 0.5)}FF`
+            }, null, 8, Ct),
             r("stop", {
               offset: "100%",
               "stop-color": `${e.color}DD`
-            }, null, 8, Ct)
-          ], 8, bt))), 256)),
+            }, null, 8, Ft)
+          ], 8, wt))), 256)),
           r("linearGradient", {
             x1: "0%",
             y1: "0%",
             x2: "0%",
             y2: "100%",
             id: `vertical_line_${x.value}`
-          }, Dt, 8, Ft)
+          }, jt, 8, Mt)
         ])) : k("", !0),
         t.value.style.chart.dataLabel.show && ![null, void 0].includes(_.dataset.percentage) && [null, void 0].includes(_.dataset.series) ? (n(), i("text", {
           key: 1,
@@ -515,11 +519,15 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
           "font-weight": t.value.style.chart.dataLabel.bold ? "bold" : "normal",
           fill: t.value.style.chart.dataLabel.color,
           "text-anchor": "middle"
-        }, M(Number((isNaN(W.value) ? 0 : W.value).toFixed(t.value.style.chart.dataLabel.rounding)).toLocaleString()) + " % ", 9, jt)) : k("", !0),
-        L.value ? (n(), i("g", {
+        }, M(h(D)({
+          v: G.value,
+          s: "%",
+          r: t.value.style.chart.dataLabel.rounding
+        })), 9, St)) : k("", !0),
+        O.value ? (n(), i("g", {
           key: 2,
           onClick: s[0] || (s[0] = (e) => {
-            L.value = !1, b.value = null;
+            O.value = !1, b.value = null;
           }),
           "data-html2canvas-ignore": "",
           style: { cursor: "pointer" }
@@ -530,13 +538,13 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
             height: 12,
             width: 12,
             fill: "transparent"
-          }, null, 8, St),
+          }, null, 8, Tt),
           r("path", {
             d: `M${o.value.width / 2 - 6},${o.value.top - 20} ${o.value.width / 2 + 6},${o.value.top - 9}`,
             stroke: t.value.style.chart.color,
             "stroke-linecap": "round",
             "stroke-width": "1"
-          }, null, 8, Tt),
+          }, null, 8, zt),
           r("path", {
             d: `M${o.value.width / 2 + 6},${o.value.top - 20} ${o.value.width / 2 - 6},${o.value.top - 9}`,
             stroke: t.value.style.chart.color,
@@ -544,20 +552,20 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
             "stroke-width": "1"
           }, null, 8, Nt)
         ])) : k("", !0),
-        !t.value.style.shape || t.value.style.shape === "bar" ? (n(), i("g", zt, [
-          C.value ? k("", !0) : (n(), i("g", Bt, [
+        !t.value.style.shape || t.value.style.shape === "bar" ? (n(), i("g", Bt, [
+          C.value ? k("", !0) : (n(), i("g", It, [
             r("path", {
               "stroke-dasharray": t.value.style.chart.box.strokeDasharray,
-              d: T.value.right,
+              d: z.value.right,
               stroke: t.value.style.chart.box.stroke,
               "stroke-width": t.value.style.chart.box.strokeWidth,
               "stroke-linejoin": "round",
               "stroke-linecap": "round",
               fill: "none"
-            }, null, 8, It),
+            }, null, 8, Lt),
             r("path", {
               "stroke-dasharray": t.value.style.chart.box.strokeDasharray,
-              d: T.value.left,
+              d: z.value.left,
               stroke: t.value.style.chart.box.stroke,
               "stroke-width": t.value.style.chart.box.strokeWidth,
               "stroke-linejoin": "round",
@@ -566,24 +574,24 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
             }, null, 8, Ot),
             r("path", {
               "stroke-dasharray": t.value.style.chart.box.strokeDasharray,
-              d: T.value.side,
+              d: z.value.side,
               stroke: t.value.style.chart.box.stroke,
               "stroke-width": t.value.style.chart.box.strokeWidth,
               "stroke-linejoin": "round",
               "stroke-linecap": "round",
               fill: "none"
-            }, null, 8, Lt),
+            }, null, 8, Wt),
             r("path", {
               "stroke-dasharray": t.value.style.chart.box.strokeDasharray,
-              d: T.value.topSides,
+              d: z.value.topSides,
               stroke: t.value.style.chart.box.stroke,
               "stroke-width": t.value.style.chart.box.strokeWidth,
               "stroke-linejoin": "round",
               "stroke-linecap": "round",
               fill: "none"
-            }, null, 8, Wt)
+            }, null, 8, Gt)
           ])),
-          C.value ? k("", !0) : (n(), i("g", Gt, [
+          C.value ? k("", !0) : (n(), i("g", Vt, [
             r("path", {
               d: E.value.right,
               stroke: t.value.style.chart.bar.stroke,
@@ -591,7 +599,7 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
               "stroke-linejoin": "round",
               "stroke-linecap": "round",
               fill: `url(#gradient_right${x.value})`
-            }, null, 8, Vt),
+            }, null, 8, At),
             r("path", {
               d: E.value.left,
               stroke: t.value.style.chart.bar.stroke,
@@ -599,7 +607,7 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
               "stroke-linejoin": "round",
               "stroke-linecap": "round",
               fill: `url(#gradient_left${x.value})`
-            }, null, 8, At),
+            }, null, 8, Ut),
             r("path", {
               d: E.value.top,
               stroke: t.value.style.chart.bar.stroke,
@@ -607,11 +615,11 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
               "stroke-linejoin": "round",
               "stroke-linecap": "round",
               fill: `url(#gradient_top${x.value})`
-            }, null, 8, Ut)
+            }, null, 8, Et)
           ])),
-          C.value ? (n(), i("g", Et, [
+          C.value ? (n(), i("g", Ht, [
             (n(!0), i($, null, g(w.value, (e, c) => (n(), i("g", {
-              style: D(`opacity:${b.value ? b.value === e.id ? 1 : 0.3 : 1}`),
+              style: j(`opacity:${b.value ? b.value === e.id ? 1 : 0.3 : 1}`),
               class: "vue-ui-3d-bar-stack"
             }, [
               r("path", {
@@ -619,22 +627,22 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
                 fill: `url(#grad_right_${e.id})`,
                 onMouseenter: (l) => F(e),
                 onClick: (l) => F(e, !0),
-                onMouseout: G
-              }, null, 40, Ht),
+                onMouseout: W
+              }, null, 40, Zt),
               r("path", {
                 d: e.fill.left,
                 fill: `url(#grad_left_${e.id})`,
                 onMouseenter: (l) => F(e),
                 onClick: (l) => F(e, !0),
-                onMouseout: G
-              }, null, 40, Zt),
+                onMouseout: W
+              }, null, 40, qt),
               r("path", {
                 d: e.fill.top,
                 fill: `url(#grad_top_${e.id})`,
                 onMouseenter: (l) => F(e),
                 onClick: (l) => F(e, !0),
-                onMouseout: G
-              }, null, 40, qt),
+                onMouseout: W
+              }, null, 40, Xt),
               r("path", {
                 d: e.fill.liningTop,
                 stroke: "#FFFFFF",
@@ -643,14 +651,14 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
                 fill: "none",
                 onMouseenter: (l) => F(e),
                 onClick: (l) => F(e, !0),
-                onMouseout: G
-              }, null, 40, Xt),
+                onMouseout: W
+              }, null, 40, Rt),
               r("path", {
                 d: `M ${e.fill.apexTop.x},${e.fill.apexTop.y} ${e.fill.apexBottom.x},${e.fill.apexBottom.y}`,
                 stroke: "#FFFFFF",
                 "stroke-width": "0.5",
                 "stroke-linecap": "round"
-              }, null, 8, Rt)
+              }, null, 8, Yt)
             ], 4))), 256)),
             (n(!0), i($, null, g(w.value, (e, c) => (n(), i("g", null, [
               c !== w.value.length - 1 ? (n(), i("path", {
@@ -661,10 +669,10 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
                 "stroke-linecap": "round",
                 fill: "none",
                 style: { "pointer-events": "none" }
-              }, null, 8, Yt)) : k("", !0)
+              }, null, 8, Jt)) : k("", !0)
             ]))), 256)),
             (n(!0), i($, null, g(w.value, (e, c) => (n(), i("g", {
-              style: D(`opacity:${b.value ? b.value === e.id ? 1 : 0 : e.proportion * 100 > t.value.style.chart.legend.hideUnderPercentage ? 1 : 0}`),
+              style: j(`opacity:${b.value ? b.value === e.id ? 1 : 0 : e.proportion * 100 > t.value.style.chart.legend.hideUnderPercentage ? 1 : 0}`),
               onClick: (l) => H("selectDatapoint", e)
             }, [
               r("path", {
@@ -673,7 +681,7 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
                 "stroke-width": "0.5",
                 "stroke-linecap": "round",
                 d: `M${e.fill.sidePointer.x},${e.fill.sidePointer.y} ${e.fill.sidePointer.x + 20},${e.fill.sidePointer.y}`
-              }, null, 8, Kt),
+              }, null, 8, Qt),
               !e.fill.miniDonut || b.value ? (n(), i("circle", {
                 key: 0,
                 cx: e.fill.sidePointer.x + 20,
@@ -681,7 +689,7 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
                 r: 2,
                 fill: e.color,
                 stroke: t.value.style.chart.backgroundColor
-              }, null, 8, Qt)) : k("", !0),
+              }, null, 8, el)) : k("", !0),
               (n(), i("foreignObject", {
                 x: e.fill.sidePointer.x + 30,
                 y: e.fill.sidePointer.y - t.value.style.chart.legend.fontSize,
@@ -691,22 +699,32 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
               }, [
                 t.value.style.chart.legend.showDefault ? (n(), i("div", {
                   key: 0,
-                  style: D(`height: 100%; width: 100%; display: flex; flex-direction: row; flex-wrap: wrap; align-items:center;justify-content: flex-start; font-size:${t.value.style.chart.legend.fontSize}px; text-align:left; line-height: ${t.value.style.chart.legend.fontSize}px; color:${t.value.style.chart.legend.color}`)
-                }, M(e.name) + ": " + M(v(I)({ v: e.proportion * 100, s: "%", r: t.value.style.chart.legend.roundingPercentage })) + " (" + M(v(I)({ p: t.value.style.chart.legend.prefix, v: e.value, s: t.value.style.chart.legend.suffix, r: t.value.style.chart.legend.roundingValue })) + ") ", 5)) : k("", !0),
-                j(d.$slots, "legend", R(Y({ datapoint: e, config: t.value, dataset: w.value })), void 0, !0)
-              ], 8, el)),
-              e.fill.donut && b.value === e.id ? (n(), i("g", tl, [
+                  style: j(`height: 100%; width: 100%; display: flex; flex-direction: row; flex-wrap: wrap; align-items:center;justify-content: flex-start; font-size:${t.value.style.chart.legend.fontSize}px; text-align:left; line-height: ${t.value.style.chart.legend.fontSize}px; color:${t.value.style.chart.legend.color}`)
+                }, M(e.name) + ": " + M(h(D)({ v: e.proportion * 100, s: "%", r: t.value.style.chart.legend.roundingPercentage })) + " (" + M(h(ee)(
+                  t.value.style.chart.dataLabel.formatter,
+                  e.value,
+                  h(D)({
+                    p: t.value.style.chart.legend.prefix,
+                    v: e.value,
+                    s: t.value.style.chart.legend.suffix,
+                    r: t.value.style.chart.legend.roundingValue
+                  }),
+                  { datapoint: e, seriesIndex: c }
+                )) + ") ", 5)) : k("", !0),
+                S(d.$slots, "legend", R(Y({ datapoint: e, config: t.value, dataset: w.value })), void 0, !0)
+              ], 8, tl)),
+              e.fill.donut && b.value === e.id ? (n(), i("g", ll, [
                 (n(!0), i($, null, g(e.fill.donut, (l, a) => (n(), i("g", null, [
                   V(l, e.fill.donut, !0) > 6 ? (n(), i("path", {
                     key: 0,
-                    d: v(xe)(l, { x: l.cx, y: l.cy }, 0, 8, !1, !0, 0.5),
+                    d: h(be)(l, { x: l.cx, y: l.cy }, 0, 8, !1, !0, 0.5),
                     stroke: l.color,
                     class: "vue-ui-donut-arc-path",
                     "stroke-width": "0.5",
                     "stroke-linecap": "round",
                     "stroke-linejoin": "round",
                     fill: "none"
-                  }, null, 8, ll)) : k("", !0)
+                  }, null, 8, ol)) : k("", !0)
                 ]))), 256)),
                 (n(!0), i($, null, g(e.fill.donut, (l, a) => (n(), i("path", {
                   class: "vue-ui-donut-arc-path",
@@ -714,21 +732,21 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
                   fill: `${l.color}`,
                   stroke: t.value.style.chart.backgroundColor,
                   "stroke-width": 1
-                }, null, 8, ol))), 256)),
+                }, null, 8, sl))), 256)),
                 r("defs", null, [
                   r("radialGradient", {
                     id: `hollow_gradient_${x.value}`
                   }, [
                     r("stop", {
                       offset: "0%",
-                      "stop-color": `${v(S)(t.value.style.chart.backgroundColor)}00`
-                    }, null, 8, al),
-                    nl,
+                      "stop-color": `${h(T)(t.value.style.chart.backgroundColor)}00`
+                    }, null, 8, nl),
+                    rl,
                     r("stop", {
                       offset: "100%",
-                      "stop-color": `${v(S)(t.value.style.chart.backgroundColor)}00`
-                    }, null, 8, rl)
-                  ], 8, sl)
+                      "stop-color": `${h(T)(t.value.style.chart.backgroundColor)}00`
+                    }, null, 8, ul)
+                  ], 8, al)
                 ]),
                 (n(!0), i($, null, g(e.fill.donut, (l, a) => (n(), i("circle", {
                   class: "vue-ui-donut-arc-path",
@@ -736,83 +754,93 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
                   cy: l.cy,
                   r: 28,
                   fill: `url(#hollow_gradient_${x.value})`
-                }, null, 8, ul))), 256)),
+                }, null, 8, il))), 256)),
                 (n(!0), i($, null, g(e.fill.donut, (l, a) => (n(), i("circle", {
                   class: "vue-ui-donut-arc-path",
                   cx: l.cx,
                   cy: l.cy,
                   r: 14,
                   fill: t.value.style.chart.backgroundColor
-                }, null, 8, il))), 256)),
+                }, null, 8, dl))), 256)),
                 (n(!0), i($, null, g(e.fill.donut, (l, a) => (n(), i("g", null, [
-                  V(l, e.fill.donut, !0) > 6 ? (n(), i("g", dl, [
+                  V(l, e.fill.donut, !0) > 6 ? (n(), i("g", cl, [
                     r("text", {
-                      "text-anchor": v(O)(l, !0, 0).anchor,
-                      x: v(O)(l, !0, 2).x,
-                      y: v(ee)(l, 12, 12),
+                      "text-anchor": h(L)(l, !0, 0).anchor,
+                      x: h(L)(l, !0, 2).x,
+                      y: h(te)(l, 12, 12),
                       fill: t.value.style.chart.legend.color,
                       "font-size": t.value.style.chart.legend.fontSize / 1.5
-                    }, M(V(l, e.fill.donut)) + " (" + M(v(I)({ p: t.value.style.chart.legend.prefix, v: l.value, s: t.value.style.chart.legend.suffix, rounding: t.value.style.chart.legend.roundingValue })) + ") ", 9, cl),
+                    }, M(V(l, e.fill.donut)) + " (" + M(h(ee)(
+                      t.value.style.chart.dataLabel.formatter,
+                      l.value,
+                      h(D)({
+                        p: t.value.style.chart.legend.prefix,
+                        v: l.value,
+                        s: t.value.style.chart.legend.suffix,
+                        r: t.value.style.chart.legend.roundingValue
+                      }),
+                      { datapoint: l, seriesIndex: a }
+                    )) + ") ", 9, hl),
                     r("text", {
-                      "text-anchor": v(O)(l).anchor,
-                      x: v(O)(l, !0, 2).x,
-                      y: v(ee)(l, 12, 12) + t.value.style.chart.legend.fontSize / 1.5,
+                      "text-anchor": h(L)(l).anchor,
+                      x: h(L)(l, !0, 2).x,
+                      y: h(te)(l, 12, 12) + t.value.style.chart.legend.fontSize / 1.5,
                       fill: t.value.style.chart.legend.color,
                       "font-size": t.value.style.chart.legend.fontSize / 1.5
-                    }, M(l.name), 9, hl)
+                    }, M(l.name), 9, vl)
                   ])) : k("", !0)
                 ]))), 256))
               ])) : k("", !0),
-              e.fill.miniDonut && !b.value ? (n(), i("g", vl, [
+              e.fill.miniDonut && !b.value ? (n(), i("g", fl, [
                 (n(!0), i($, null, g(e.fill.miniDonut, (l, a) => (n(), i("path", {
                   class: "vue-ui-donut-arc-path",
                   d: l.arcSlice,
                   fill: `${l.color}`,
                   stroke: t.value.style.chart.backgroundColor,
                   "stroke-width": 0.5
-                }, null, 8, fl))), 256))
+                }, null, 8, pl))), 256))
               ])) : k("", !0)
-            ], 12, Jt))), 256))
+            ], 12, Kt))), 256))
           ])) : k("", !0)
         ])) : k("", !0),
-        t.value.style.shape === "tube" ? (n(), i("g", pl, [
-          C.value ? k("", !0) : (n(), i("g", yl, [
+        t.value.style.shape === "tube" ? (n(), i("g", yl, [
+          C.value ? k("", !0) : (n(), i("g", kl, [
             r("path", {
               "stroke-dasharray": t.value.style.chart.box.strokeDasharray,
-              d: T.value.tubeTop,
+              d: z.value.tubeTop,
               stroke: t.value.style.chart.box.stroke,
               "stroke-width": t.value.style.chart.box.strokeWidth,
               "stroke-linejoin": "round",
               "stroke-linecap": "round",
               fill: "none"
-            }, null, 8, kl),
+            }, null, 8, $l),
             r("path", {
               "stroke-dasharray": t.value.style.chart.box.strokeDasharray,
-              d: T.value.tubeLeft,
+              d: z.value.tubeLeft,
               stroke: t.value.style.chart.box.stroke,
               "stroke-width": t.value.style.chart.box.strokeWidth,
               "stroke-linejoin": "round",
               "stroke-linecap": "round",
               fill: "none"
-            }, null, 8, $l),
+            }, null, 8, gl),
             r("path", {
               "stroke-dasharray": t.value.style.chart.box.strokeDasharray,
-              d: T.value.tubeRight,
+              d: z.value.tubeRight,
               stroke: t.value.style.chart.box.stroke,
               "stroke-width": t.value.style.chart.box.strokeWidth,
               "stroke-linejoin": "round",
               "stroke-linecap": "round",
               fill: "none"
-            }, null, 8, gl),
+            }, null, 8, _l),
             r("path", {
               "stroke-dasharray": t.value.style.chart.box.strokeDasharray,
-              d: T.value.tubeBottom,
+              d: z.value.tubeBottom,
               stroke: t.value.style.chart.box.stroke,
               "stroke-width": t.value.style.chart.box.strokeWidth,
               "stroke-linejoin": "round",
               "stroke-linecap": "round",
               fill: "none"
-            }, null, 8, _l),
+            }, null, 8, ml),
             r("path", {
               d: E.value.tubeTop,
               stroke: t.value.style.chart.bar.stroke,
@@ -820,7 +848,7 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
               "stroke-linejoin": "round",
               "stroke-linecap": "round",
               fill: `url(#gradient_top${x.value})`
-            }, null, 8, ml),
+            }, null, 8, xl),
             r("path", {
               d: E.value.tubeBody,
               stroke: t.value.style.chart.bar.stroke,
@@ -828,11 +856,11 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
               "stroke-linejoin": "round",
               "stroke-linecap": "round",
               fill: `url(#gradient_tube_body${x.value})`
-            }, null, 8, xl)
+            }, null, 8, bl)
           ])),
-          C.value ? (n(), i("g", bl, [
+          C.value ? (n(), i("g", wl, [
             (n(!0), i($, null, g(w.value, (e, c) => (n(), i("g", {
-              style: D(`opacity:${b.value ? b.value === e.id ? 1 : 0.3 : 1}`),
+              style: j(`opacity:${b.value ? b.value === e.id ? 1 : 0.3 : 1}`),
               class: "vue-ui-3d-bar-stack",
               onClick: (l) => H("selectDatapoint", e)
             }, [
@@ -844,13 +872,13 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
                 }, [
                   r("stop", {
                     offset: "0%",
-                    "stop-color": `${v(A)(e.color, 0.5)}DD`
-                  }, null, 8, Fl),
+                    "stop-color": `${h(A)(e.color, 0.5)}DD`
+                  }, null, 8, Ml),
                   r("stop", {
                     offset: "100%",
-                    "stop-color": `${v(Q)(e.color, 0.1)}DD`
-                  }, null, 8, Ml)
-                ], 8, Cl),
+                    "stop-color": `${h(Q)(e.color, 0.1)}DD`
+                  }, null, 8, Pl)
+                ], 8, Fl),
                 r("linearGradient", {
                   id: `gradient_tube_body_${e.id}`,
                   x1: "0%",
@@ -861,62 +889,62 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
                   r("stop", {
                     offset: "0%",
                     "stop-color": `${e.color}`
-                  }, null, 8, Dl),
+                  }, null, 8, jl),
                   r("stop", {
                     offset: "10%",
-                    "stop-color": `${v(Q)(e.color, 0.7)}FF`
-                  }, null, 8, jl),
+                    "stop-color": `${h(Q)(e.color, 0.7)}FF`
+                  }, null, 8, Sl),
                   r("stop", {
                     offset: "25%",
-                    "stop-color": `${v(Q)(e.color, 0.5)}FF`
-                  }, null, 8, Sl),
+                    "stop-color": `${h(Q)(e.color, 0.5)}FF`
+                  }, null, 8, Tl),
                   r("stop", {
                     offset: "75%",
                     "stop-color": `${e.color}DD`
-                  }, null, 8, Tl),
+                  }, null, 8, zl),
                   r("stop", {
                     offset: "100%",
-                    "stop-color": `${v(A)(e.color, 0.7)}FF`
+                    "stop-color": `${h(A)(e.color, 0.7)}FF`
                   }, null, 8, Nl)
-                ], 8, Pl)
+                ], 8, Dl)
               ]),
               r("path", {
                 onMouseenter: (l) => F(e),
                 onClick: (l) => F(e, !0),
-                onMouseout: G,
+                onMouseout: W,
                 d: e.fill.tubeBody,
                 stroke: "#FFFFFF",
                 "stroke-width": 0.5,
                 "stroke-linejoin": "round",
                 "stroke-linecap": "round",
                 fill: `url(#gradient_tube_body_${e.id})`
-              }, null, 40, zl),
+              }, null, 40, Bl),
               c > 0 ? (n(), i("path", {
                 key: 0,
                 onMouseenter: (l) => F(e),
                 onClick: (l) => F(e, !0),
-                onMouseout: G,
+                onMouseout: W,
                 d: e.fill.bottomTubeTop,
                 stroke: "#000000",
                 "stroke-width": 0.5,
                 "stroke-linejoin": "round",
                 "stroke-linecap": "round",
                 fill: "none"
-              }, null, 40, Bl)) : k("", !0),
+              }, null, 40, Il)) : k("", !0),
               r("path", {
                 onMouseenter: (l) => F(e),
                 onClick: (l) => F(e, !0),
-                onMouseout: G,
+                onMouseout: W,
                 d: e.fill.tubeTop,
                 stroke: "#FFFFFF",
                 "stroke-width": 0.5,
                 "stroke-linejoin": "round",
                 "stroke-linecap": "round",
                 fill: `url(#gradient_tube_top_${e.id})`
-              }, null, 40, Il)
-            ], 12, wl))), 256)),
+              }, null, 40, Ll)
+            ], 12, Cl))), 256)),
             (n(!0), i($, null, g(w.value, (e, c) => (n(), i("g", {
-              style: D(`opacity:${b.value ? b.value === e.id ? 1 : 0 : e.proportion * 100 > t.value.style.chart.legend.hideUnderPercentage ? 1 : 0}`),
+              style: j(`opacity:${b.value ? b.value === e.id ? 1 : 0 : e.proportion * 100 > t.value.style.chart.legend.hideUnderPercentage ? 1 : 0}`),
               onClick: (l) => H("selectDatapoint", e)
             }, [
               r("path", {
@@ -925,7 +953,7 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
                 "stroke-width": "0.5",
                 "stroke-linecap": "round",
                 d: `M${e.fill.sidePointer.x},${e.fill.sidePointer.y} ${e.fill.sidePointer.x + 20},${e.fill.sidePointer.y}`
-              }, null, 8, Ll),
+              }, null, 8, Wl),
               !e.fill.miniDonut || b.value ? (n(), i("circle", {
                 key: 0,
                 cx: e.fill.sidePointer.x + 20,
@@ -933,7 +961,7 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
                 r: 2,
                 fill: e.color,
                 stroke: t.value.style.chart.backgroundColor
-              }, null, 8, Wl)) : k("", !0),
+              }, null, 8, Gl)) : k("", !0),
               (n(), i("foreignObject", {
                 x: e.fill.sidePointer.x + 30,
                 y: e.fill.sidePointer.y - t.value.style.chart.legend.fontSize,
@@ -943,22 +971,32 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
               }, [
                 t.value.style.chart.legend.showDefault ? (n(), i("div", {
                   key: 0,
-                  style: D(`height: 100%; width: 100%; display: flex; flex-direction: row; flex-wrap: wrap; align-items:center;justify-content: flex-start; font-size:${t.value.style.chart.legend.fontSize}px; text-align:left; line-height: ${t.value.style.chart.legend.fontSize}px; color:${t.value.style.chart.legend.color}`)
-                }, M(e.name) + ": " + M(v(I)({ v: e.proportion * 100, s: "%", r: t.value.style.chart.legend.roundingPercentage })) + " (" + M(v(I)({ p: t.value.style.chart.legend.prefix, v: e.value, s: t.value.style.chart.legend.suffix, r: t.value.style.chart.legend.roundingValue })) + ") ", 5)) : k("", !0),
-                j(d.$slots, "legend", R(Y({ datapoint: e, config: t.value, dataset: w.value })), void 0, !0)
-              ], 8, Gl)),
-              e.fill.donut && b.value === e.id ? (n(), i("g", Vl, [
+                  style: j(`height: 100%; width: 100%; display: flex; flex-direction: row; flex-wrap: wrap; align-items:center;justify-content: flex-start; font-size:${t.value.style.chart.legend.fontSize}px; text-align:left; line-height: ${t.value.style.chart.legend.fontSize}px; color:${t.value.style.chart.legend.color}`)
+                }, M(e.name) + ": " + M(h(D)({ v: e.proportion * 100, s: "%", r: t.value.style.chart.legend.roundingPercentage })) + " (" + M(h(ee)(
+                  t.value.style.chart.dataLabel.formatter,
+                  e.value,
+                  h(D)({
+                    p: t.value.style.chart.legend.prefix,
+                    v: e.value,
+                    s: t.value.style.chart.legend.suffix,
+                    r: t.value.style.chart.legend.roundingValue
+                  }),
+                  { datapoint: e, seriesIndex: c }
+                )) + ") ", 5)) : k("", !0),
+                S(d.$slots, "legend", R(Y({ datapoint: e, config: t.value, dataset: w.value })), void 0, !0)
+              ], 8, Vl)),
+              e.fill.donut && b.value === e.id ? (n(), i("g", Al, [
                 (n(!0), i($, null, g(e.fill.donut, (l, a) => (n(), i("g", null, [
                   V(l, e.fill.donut, !0) > 6 ? (n(), i("path", {
                     key: 0,
-                    d: v(xe)(l, { x: l.cx, y: l.cy }, 0, 8, !1, !0, 0.5),
+                    d: h(be)(l, { x: l.cx, y: l.cy }, 0, 8, !1, !0, 0.5),
                     stroke: l.color,
                     class: "vue-ui-donut-arc-path",
                     "stroke-width": "0.5",
                     "stroke-linecap": "round",
                     "stroke-linejoin": "round",
                     fill: "none"
-                  }, null, 8, Al)) : k("", !0)
+                  }, null, 8, Ul)) : k("", !0)
                 ]))), 256)),
                 (n(!0), i($, null, g(e.fill.donut, (l, a) => (n(), i("path", {
                   class: "vue-ui-donut-arc-path",
@@ -966,21 +1004,21 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
                   fill: `${l.color}`,
                   stroke: t.value.style.chart.backgroundColor,
                   "stroke-width": 1
-                }, null, 8, Ul))), 256)),
+                }, null, 8, El))), 256)),
                 r("defs", null, [
                   r("radialGradient", {
                     id: `hollow_gradient_${x.value}`
                   }, [
                     r("stop", {
                       offset: "0%",
-                      "stop-color": `${v(S)(t.value.style.chart.backgroundColor)}00`
-                    }, null, 8, Hl),
-                    Zl,
+                      "stop-color": `${h(T)(t.value.style.chart.backgroundColor)}00`
+                    }, null, 8, Zl),
+                    ql,
                     r("stop", {
                       offset: "100%",
-                      "stop-color": `${v(S)(t.value.style.chart.backgroundColor)}00`
-                    }, null, 8, ql)
-                  ], 8, El)
+                      "stop-color": `${h(T)(t.value.style.chart.backgroundColor)}00`
+                    }, null, 8, Xl)
+                  ], 8, Hl)
                 ]),
                 (n(!0), i($, null, g(e.fill.donut, (l, a) => (n(), i("circle", {
                   class: "vue-ui-donut-arc-path",
@@ -988,51 +1026,61 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
                   cy: l.cy,
                   r: 28,
                   fill: `url(#hollow_gradient_${x.value})`
-                }, null, 8, Xl))), 256)),
+                }, null, 8, Rl))), 256)),
                 (n(!0), i($, null, g(e.fill.donut, (l, a) => (n(), i("circle", {
                   class: "vue-ui-donut-arc-path",
                   cx: l.cx,
                   cy: l.cy,
                   r: 14,
                   fill: t.value.style.chart.backgroundColor
-                }, null, 8, Rl))), 256)),
+                }, null, 8, Yl))), 256)),
                 (n(!0), i($, null, g(e.fill.donut, (l, a) => (n(), i("g", null, [
-                  V(l, e.fill.donut, !0) > 6 ? (n(), i("g", Yl, [
+                  V(l, e.fill.donut, !0) > 6 ? (n(), i("g", Jl, [
                     r("text", {
-                      "text-anchor": v(O)(l, !0, 0).anchor,
-                      x: v(O)(l, !0, 2).x,
-                      y: v(ee)(l, 12, 12),
+                      "text-anchor": h(L)(l, !0, 0).anchor,
+                      x: h(L)(l, !0, 2).x,
+                      y: h(te)(l, 12, 12),
                       fill: t.value.style.chart.legend.color,
                       "font-size": t.value.style.chart.legend.fontSize / 1.5
-                    }, M(V(l, e.fill.donut)) + " (" + M(v(I)({ p: t.value.style.chart.legend.prefix, v: l.value, s: t.value.style.chart.legend.suffix, rounding: t.value.style.chart.legend.roundingValue })) + ") ", 9, Jl),
+                    }, M(V(l, e.fill.donut)) + " (" + M(h(ee)(
+                      t.value.style.chart.dataLabel.formatter,
+                      l.value,
+                      h(D)({
+                        p: t.value.style.chart.legend.prefix,
+                        v: l.value,
+                        s: t.value.style.chart.legend.suffix,
+                        r: t.value.style.chart.legend.roundingValue
+                      }),
+                      { datapoint: l, seriesIndex: a }
+                    )) + ") ", 9, Kl),
                     r("text", {
-                      "text-anchor": v(O)(l).anchor,
-                      x: v(O)(l, !0, 2).x,
-                      y: v(ee)(l, 12, 12) + t.value.style.chart.legend.fontSize / 1.5,
+                      "text-anchor": h(L)(l).anchor,
+                      x: h(L)(l, !0, 2).x,
+                      y: h(te)(l, 12, 12) + t.value.style.chart.legend.fontSize / 1.5,
                       fill: t.value.style.chart.legend.color,
                       "font-size": t.value.style.chart.legend.fontSize / 1.5
-                    }, M(l.name), 9, Kl)
+                    }, M(l.name), 9, Ql)
                   ])) : k("", !0)
                 ]))), 256))
               ])) : k("", !0),
-              e.fill.miniDonut && !b.value ? (n(), i("g", Ql, [
+              e.fill.miniDonut && !b.value ? (n(), i("g", eo, [
                 (n(!0), i($, null, g(e.fill.miniDonut, (l, a) => (n(), i("path", {
                   class: "vue-ui-donut-arc-path",
                   d: l.arcSlice,
                   fill: `${l.color}`,
                   stroke: t.value.style.chart.backgroundColor,
                   "stroke-width": 0.5
-                }, null, 8, eo))), 256))
+                }, null, 8, to))), 256))
               ])) : k("", !0)
             ], 12, Ol))), 256))
           ])) : k("", !0)
         ])) : k("", !0),
-        j(d.$slots, "svg", { svg: o.value }, void 0, !0)
-      ], 14, lt)) : k("", !0),
-      d.$slots.watermark ? (n(), i("div", to, [
-        j(d.$slots, "watermark", R(Y({ isPrinting: v(re) || v(ue) })), void 0, !0)
+        S(d.$slots, "svg", { svg: o.value }, void 0, !0)
+      ], 14, ot)) : k("", !0),
+      d.$slots.watermark ? (n(), i("div", lo, [
+        S(d.$slots, "watermark", R(Y({ isPrinting: h(ue) || h(ie) })), void 0, !0)
       ])) : k("", !0),
-      Z.value ? k("", !0) : (n(), se(Je, {
+      Z.value ? k("", !0) : (n(), ae(Ke, {
         key: 4,
         config: {
           type: "bar3d",
@@ -1044,7 +1092,7 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
           }
         }
       }, null, 8, ["config"])),
-      Z.value && C.value ? (n(), se(Qe, {
+      Z.value && C.value ? (n(), ae(et, {
         key: 5,
         hideDetails: "",
         config: {
@@ -1060,8 +1108,8 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
           }
         }
       }, {
-        content: B(() => [
-          ge(Ke, {
+        content: I(() => [
+          _e(Qe, {
             colNames: X.value.colNames,
             head: X.value.head,
             body: X.value.body,
@@ -1069,23 +1117,23 @@ const te = (U) => (Le("data-v-82f069d2"), U = U(), We(), U), tt = ["id"], lt = [
             title: `${t.value.style.chart.title.text}${t.value.style.chart.title.subtitle.text ? ` : ${t.value.style.chart.title.subtitle.text}` : ""}`,
             onClose: s[1] || (s[1] = (e) => q.value.showTable = !1)
           }, {
-            th: B(({ th: e }) => [
+            th: I(({ th: e }) => [
               r("div", {
                 innerHTML: e,
                 style: { display: "flex", "align-items": "center" }
-              }, null, 8, lo)
+              }, null, 8, oo)
             ]),
-            td: B(({ td: e }) => [
-              Ie(M(e.name || e), 1)
+            td: I(({ td: e }) => [
+              Le(M(e.name || e), 1)
             ]),
             _: 1
           }, 8, ["colNames", "head", "body", "config", "title"])
         ]),
         _: 1
       }, 8, ["config"])) : k("", !0)
-    ], 12, tt));
+    ], 12, lt));
   }
-}, fo = /* @__PURE__ */ et(oo, [["__scopeId", "data-v-82f069d2"]]);
+}, po = /* @__PURE__ */ tt(so, [["__scopeId", "data-v-06e93dd9"]]);
 export {
-  fo as default
+  po as default
 };