vue-data-ui 2.3.28 → 2.3.30

package/dist/{vue-ui-stackbar-NZFO3R77.js → vue-ui-stackbar-B0dWToaf.js}

@@ -1,20 +1,20 @@
-import { computed as y, ref as h, onMounted as xe, openBlock as u, createElementBlock as i, normalizeClass as ke, normalizeStyle as A, renderSlot as p, createVNode as Q, createCommentVNode as d, createBlock as I, unref as C, createSlots as Ae, withCtx as m, normalizeProps as M, guardReactiveProps as O, Fragment as x, renderList as $, createElementVNode as R, toDisplayString as z, createTextVNode as Ie } from "vue";
-import { u as He, c as we, o as Ee, e as Ce, g as Be, t as Ue, a as We, p as G, b as Ge, d as Xe, Z as Ye, z as j, X as Je, l as qe, C as Ze, f as H, r as Ke, v as $e, w as Qe, n as je, q as et } from "./index-BhCM2QF1.js";
-import { u as Le } from "./useNestedProp-CH3PVhvc.js";
-import { t as tt, u as at } from "./useResponsive-NZB-WLRF.js";
-import { u as lt, U as ot } from "./usePrinter-B75HLwzw.js";
-import { S as rt } from "./Slicer-Cv-2s_-r.js";
-import { _ as st } from "./Tooltip-D6BUVHr1.js";
-import { _ as ut } from "./Title-CtWGLaoz.js";
-import { L as it } from "./Legend-DwludSgp.js";
-import nt from "./vue-ui-accordion-CSZdj7wA.js";
-import { D as ct } from "./DataTable-bEXuvNn5.js";
-import vt from "./vue-ui-skeleton-_VMQ594N.js";
-import { _ as dt } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const ht = ["id"], gt = ["xmlns", "viewBox"], yt = { key: 0 }, bt = ["id"], ft = ["stop-color"], pt = ["stop-color"], mt = ["stop-color"], xt = ["x1", "x2", "y1", "y2", "stroke"], kt = ["x1", "x2", "y1", "y2", "stroke"], wt = ["d", "fill", "stroke", "stroke-width"], Ct = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], $t = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Lt = ["x", "y", "font-size", "fill", "font-weight"], _t = ["transform", "font-size", "fill", "font-weight"], St = ["x", "y", "font-size", "fill", "font-weight"], Tt = { key: 0 }, zt = ["x", "y", "font-size", "font-weight", "fill"], Nt = ["x1", "x2", "y1", "y2", "stroke"], Rt = ["x", "y", "font-size", "font-weight", "fill"], Pt = ["text-anchor", "font-size", "font-weight", "fill", "transform"], Ft = ["x", "y", "width", "height", "onClick", "onMouseenter", "fill"], Mt = {
+import { computed as y, ref as h, onMounted as xe, openBlock as u, createElementBlock as n, normalizeClass as ke, normalizeStyle as A, renderSlot as p, createVNode as Z, createCommentVNode as d, createBlock as H, unref as w, createSlots as Ae, withCtx as m, normalizeProps as M, guardReactiveProps as O, Fragment as x, renderList as $, createElementVNode as R, toDisplayString as z, createTextVNode as He } from "vue";
+import { u as Ee, c as we, o as Be, e as Ce, g as Ue, t as We, a as Ge, p as G, b as Xe, d as Ye, _ as Je, A as j, X as qe, l as Ke, D as Qe, f as V, v as Ze, w as $e, i as Le, x as je, q as et, r as tt } from "./index-BlXzlBwZ.js";
+import { u as _e } from "./useNestedProp-BoNl5H_z.js";
+import { t as at, u as lt } from "./useResponsive-NZB-WLRF.js";
+import { u as ot, U as rt } from "./usePrinter-CZ8F5Cth.js";
+import { S as st } from "./Slicer-DaEfxscP.js";
+import { _ as ut } from "./Tooltip-B11OahTD.js";
+import { _ as it } from "./Title-eBTH8iGJ.js";
+import { L as nt } from "./Legend-CkQ_zypV.js";
+import ct from "./vue-ui-accordion-wHRG3nXl.js";
+import { D as vt } from "./DataTable-CsPidn0_.js";
+import dt from "./vue-ui-skeleton-CJ2R5R6u.js";
+import { _ as ht } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const gt = ["id"], yt = ["xmlns", "viewBox"], bt = { key: 0 }, ft = ["id"], pt = ["stop-color"], mt = ["stop-color"], xt = ["stop-color"], kt = ["x1", "x2", "y1", "y2", "stroke"], wt = ["x1", "x2", "y1", "y2", "stroke"], Ct = ["d", "fill", "stroke", "stroke-width"], $t = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Lt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], _t = ["x", "y", "font-size", "fill", "font-weight"], St = ["transform", "font-size", "fill", "font-weight"], Tt = ["x", "y", "font-size", "fill", "font-weight"], zt = { key: 0 }, Nt = ["x", "y", "font-size", "font-weight", "fill"], Rt = ["x1", "x2", "y1", "y2", "stroke"], Pt = ["x", "y", "font-size", "font-weight", "fill"], Ft = ["text-anchor", "font-size", "font-weight", "fill", "transform"], Mt = ["x", "y", "width", "height", "onClick", "onMouseenter", "fill"], Ot = {
   key: 3,
   class: "vue-data-ui-watermark"
-}, Ot = ["onClick"], Dt = ["innerHTML"], Vt = {
+}, Vt = ["onClick"], Dt = ["innerHTML"], It = {
   __name: "vue-ui-stackbar",
   props: {
     config: {
@@ -31,21 +31,21 @@ const ht = ["id"], gt = ["xmlns", "viewBox"], yt = { key: 0 }, bt = ["id"], ft =
     }
   },
   emits: ["selectDatapoint", "selectLegend"],
-  setup(ee, { expose: _e, emit: te }) {
-    const _ = ee, { vue_ui_stackbar: Se } = He(), P = y({
+  setup(ee, { expose: Se, emit: te }) {
+    const _ = ee, { vue_ui_stackbar: Te } = Ee(), P = y({
       get() {
         return !!_.dataset && _.dataset.length;
       },
       set(a) {
         return a;
       }
-    }), D = h(null), X = h(we()), Y = h(!1), ae = h(null), J = h(""), L = h([]), le = h(0), oe = h(null), re = h(null), se = h(null), ue = h(0), q = h(!1), Z = h(null);
+    }), D = h(null), X = h(we()), Y = h(!1), ae = h(null), J = h(""), L = h([]), le = h(0), oe = h(null), re = h(null), se = h(null), ue = h(0), q = h(!1), K = h(null);
     xe(() => {
-      Ee(_.dataset) ? Ce({
+      Be(_.dataset) ? Ce({
         componentName: "VueUiStackbar",
         type: "dataset"
       }) : _.dataset.forEach((a, l) => {
-        Be({
+        Ue({
           datasetObject: a,
           requiredAttributes: ["name", "series"]
         }).forEach((t) => {
@@ -59,24 +59,24 @@ const ht = ["id"], gt = ["xmlns", "viewBox"], yt = { key: 0 }, bt = ["id"], ft =
       });
     });
     const e = y(() => {
-      const a = Le({
+      const a = _e({
         userConfig: _.config,
-        defaultConfig: Se
+        defaultConfig: Te
       });
       return a.theme ? {
-        ...Le({
-          userConfig: Ue.vue_ui_stackbar[a.theme] || _.config,
+        ..._e({
+          userConfig: We.vue_ui_stackbar[a.theme] || _.config,
           defaultConfig: a
         }),
-        customPalette: We[a.theme] || G
+        customPalette: Ge[a.theme] || G
       } : a;
-    }), w = h({
+    }), C = h({
       dataLabels: {
         show: e.value.style.chart.bars.dataLabels.show
       },
       showTable: e.value.table.show,
       showTooltip: e.value.style.chart.tooltip.show
-    }), { isPrinting: ie, isImaging: ne, generatePdf: ce, generateImage: ve } = lt({
+    }), { isPrinting: ie, isImaging: ne, generatePdf: ce, generateImage: ve } = ot({
       elementId: `stackbar_${X.value}`,
       fileName: e.value.style.chart.title.text || "vue-ui-stackbar"
     }), E = h({
@@ -88,11 +88,11 @@ const ht = ["id"], gt = ["xmlns", "viewBox"], yt = { key: 0 }, bt = ["id"], ft =
         bottom: e.value.style.chart.padding.bottom / e.value.style.chart.height,
         left: e.value.style.chart.padding.left / e.value.style.chart.width
       }
-    }), Te = y(() => Ge(e.value.customPalette)), de = h(null);
+    }), ze = y(() => Xe(e.value.customPalette)), de = h(null);
     xe(() => {
       if (e.value.responsive) {
-        const a = tt(() => {
-          const { width: l, height: t } = at({
+        const a = at(() => {
+          const { width: l, height: t } = lt({
             chart: D.value,
             title: e.value.style.chart.title.text ? oe.value : null,
             legend: e.value.style.chart.legend.show ? re.value : null,
@@ -104,19 +104,19 @@ const ht = ["id"], gt = ["xmlns", "viewBox"], yt = { key: 0 }, bt = ["id"], ft =
       }
     });
     const s = y(() => {
-      const { height: a, width: l } = E.value, { right: t } = E.value.paddingRatio, r = e.value.style.chart.padding.top, o = l - l * t, n = a - e.value.style.chart.padding.bottom, g = e.value.style.chart.padding.left, f = l - g - l * t, k = a - r - e.value.style.chart.padding.bottom;
+      const { height: a, width: l } = E.value, { right: t } = E.value.paddingRatio, o = e.value.style.chart.padding.top, r = l - l * t, i = a - e.value.style.chart.padding.bottom, g = e.value.style.chart.padding.left, f = l - g - l * t, k = a - o - e.value.style.chart.padding.bottom;
       return {
         chartHeight: a,
         chartWidth: l,
-        top: r,
-        right: o,
-        bottom: n,
+        top: o,
+        right: r,
+        bottom: i,
         left: g,
         width: f,
         height: k
       };
     }), F = y(() => _.dataset.map((a, l) => {
-      const t = Xe(a.color) || Te.value[l] || G[l] || G[l % G.length];
+      const t = Ye(a.color) || ze.value[l] || G[l] || G[l % G.length];
       return {
         ...a,
         absoluteIndex: l,
@@ -127,7 +127,7 @@ const ht = ["id"], gt = ["xmlns", "viewBox"], yt = { key: 0 }, bt = ["id"], ft =
       start: 0,
       end: Math.max(..._.dataset.map((a) => a.series.length))
     });
-    function ze() {
+    function Ne() {
       c.value = {
         start: 0,
         end: Math.max(..._.dataset.map((a) => a.series.length))
@@ -136,7 +136,7 @@ const ht = ["id"], gt = ["xmlns", "viewBox"], yt = { key: 0 }, bt = ["id"], ft =
     const b = y(() => {
       const a = s.value.width / (c.value.end - c.value.start);
       return a <= 0 ? 0 : a;
-    }), N = y(() => Ye(F.value.filter((a) => !L.value.includes(a.id))).slice(c.value.start, c.value.end)), K = y(() => {
+    }), N = y(() => Je(F.value.filter((a) => !L.value.includes(a.id))).slice(c.value.start, c.value.end)), Q = y(() => {
       const a = Math.max(...N.value), l = j(0, a, e.value.style.chart.grid.scale.ticks);
       return l.ticks.map((t) => ({
         y: s.value.bottom - s.value.height * (t / l.max),
@@ -146,47 +146,57 @@ const ht = ["id"], gt = ["xmlns", "viewBox"], yt = { key: 0 }, bt = ["id"], ft =
     }), U = y(() => e.value.style.chart.grid.x.timeLabels.values.slice(c.value.start, c.value.end)), v = y(() => {
       if (!P.value) return [];
       let a = Array(B.value).fill(0);
-      const l = s.value.height, t = Math.max(...N.value), o = j(0, t, e.value.style.chart.grid.scale.ticks).max;
-      return F.value.filter((n) => !L.value.includes(n.id)).map((n) => {
-        const g = n.series.slice(c.value.start, c.value.end);
+      const l = s.value.height, t = Math.max(...N.value), r = j(0, t, e.value.style.chart.grid.scale.ticks).max;
+      return F.value.filter((i) => !L.value.includes(i.id)).map((i) => {
+        const g = i.series.slice(c.value.start, c.value.end);
         return {
-          ...n,
-          proportions: g.map((f, k) => e.value.style.chart.bars.distributed ? (f || 0) / N.value[k] : (f || 0) / o),
+          ...i,
+          proportions: g.map((f, k) => e.value.style.chart.bars.distributed ? (f || 0) / N.value[k] : (f || 0) / r),
           series: g,
           x: g.map((f, k) => s.value.left + b.value * k + b.value * e.value.style.chart.bars.gapRatio / 4),
           y: g.map((f, k) => {
-            const S = e.value.style.chart.bars.distributed ? (f || 0) / N.value[k] : (f || 0) / o, V = l * S, T = l - V - a[k];
-            return a[k] += V, T + s.value.top;
+            const S = e.value.style.chart.bars.distributed ? (f || 0) / N.value[k] : (f || 0) / r, I = l * S, T = l - I - a[k];
+            return a[k] += I, T + s.value.top;
           }),
           height: g.map((f, k) => {
-            const S = e.value.style.chart.bars.distributed ? (f || 0) / N.value[k] : (f || 0) / o;
+            const S = e.value.style.chart.bars.distributed ? (f || 0) / N.value[k] : (f || 0) / r;
             return l * S <= 0 ? 0 : l * S;
           })
         };
       });
-    }), Ne = y(() => {
+    }), Re = y(() => {
       const a = Math.max(...N.value), t = j(0, a, e.value.style.chart.grid.scale.ticks).max;
-      return N.value.map((r, o) => ({
-        value: r,
-        y: (1 - r / t) * s.value.height
+      return N.value.map((o, r) => ({
+        value: o,
+        y: (1 - o / t) * s.value.height
       }));
     });
-    function he(a) {
-      return H({
-        p: e.value.style.chart.bars.dataLabels.prefix,
-        v: a,
-        s: e.value.style.chart.bars.dataLabels.suffix,
-        r: e.value.style.chart.bars.dataLabels.rounding
-      });
+    function he(a, l, t, o) {
+      return Le(
+        e.value.style.chart.bars.dataLabels.formatter,
+        a,
+        V({
+          p: e.value.style.chart.bars.dataLabels.prefix,
+          v: a,
+          s: e.value.style.chart.bars.dataLabels.suffix,
+          r: e.value.style.chart.bars.dataLabels.rounding
+        }),
+        { datapoint: l, seriesIndex: t, datapointIndex: o }
+      );
     }
-    function Re(a) {
-      return H({
-        v: a,
-        s: "%",
-        r: e.value.style.chart.bars.dataLabels.rounding
-      });
+    function Pe(a, l, t, o) {
+      return Le(
+        e.value.style.chart.bars.dataLabels.formatter,
+        a,
+        V({
+          v: a,
+          s: "%",
+          r: e.value.style.chart.bars.dataLabels.rounding
+        }),
+        { datapoint: l, seriesIndex: t, datapointIndex: o }
+      );
     }
-    function Pe(a) {
+    function Fe(a) {
       const l = JSON.parse(JSON.stringify(v.value)).map((t) => ({
         name: t.name,
         value: t.series[a] === 0 ? 0 : t.series[a] || null,
@@ -196,16 +206,16 @@ const ht = ["id"], gt = ["xmlns", "viewBox"], yt = { key: 0 }, bt = ["id"], ft =
       }));
       te("selectDatapoint", { datapoint: l, period: U.value[a] });
     }
-    function Fe(a) {
-      Z.value = a, Y.value = !0;
-      const l = e.value.style.chart.tooltip.customFormat, t = JSON.parse(JSON.stringify(v.value)).map((o) => ({
-        name: o.name,
-        value: o.series[a] === 0 ? 0 : o.series[a] || null,
-        proportion: o.proportions[a] || null,
-        color: o.color,
-        id: o.id
-      })), r = t.map((o) => o.value).reduce((o, n) => o + n, 0);
-      if ($e(l) && Qe(() => l({
+    function Me(a) {
+      K.value = a, Y.value = !0;
+      const l = e.value.style.chart.tooltip.customFormat, t = JSON.parse(JSON.stringify(v.value)).map((r) => ({
+        name: r.name,
+        value: r.series[a] === 0 ? 0 : r.series[a] || null,
+        proportion: r.proportions[a] || null,
+        color: r.color,
+        id: r.id
+      })), o = t.map((r) => r.value).reduce((r, i) => r + i, 0);
+      if ($e(l) && je(() => l({
         seriesIndex: a,
         datapoint: t,
         series: v.value,
@@ -219,76 +229,76 @@ const ht = ["id"], gt = ["xmlns", "viewBox"], yt = { key: 0 }, bt = ["id"], ft =
         });
       else {
         const {
-          showValue: o,
-          showPercentage: n,
+          showValue: r,
+          showPercentage: i,
           borderColor: g,
           roundingValue: f,
           roundingPercentage: k
         } = e.value.style.chart.tooltip;
         let S = "";
         U.value[a] && (S += `<div style="width:100%;text-align:center;border-bottom:1px solid ${g};padding-bottom:6px;margin-bottom:3px;">${U.value[a]}</div>`);
-        const V = [
-          o && n ? "(" : "",
-          o && n ? ")" : ""
+        const I = [
+          r && i ? "(" : "",
+          r && i ? ")" : ""
         ];
         t.reverse().forEach((T) => {
           S += `
                 <div style="display:flex;flex-direction:row;align-items:center;gap:4px">
                     <svg viewBox="0 0 12 12" height="14" width="14"><rect rx="1" x="0" y="0" height="12" width="12" stroke="none" fill="${e.value.style.chart.bars.gradient.show ? `url(#gradient_${T.id})` : T.color}"/></svg>
-                    ${T.name}${o || n ? ":" : ""} ${o ? H({
+                    ${T.name}${r || i ? ":" : ""} ${r ? V({
             p: e.value.style.chart.bars.dataLabels.prefix,
             v: T.value,
             s: e.value.style.chart.bars.dataLabels.suffix,
             r: f
-          }) : ""} ${V[0]}${n ? H({
-            v: isNaN(T.value / r) ? 0 : T.value / r * 100,
+          }) : ""} ${I[0]}${i ? V({
+            v: isNaN(T.value / o) ? 0 : T.value / o * 100,
             s: "%",
             r: k
-          }) : ""}${V[1]}
+          }) : ""}${I[1]}
                 </div>
             `;
         }), J.value = `<div>${S}</div>`;
       }
     }
-    function Me(a) {
+    function Oe(a) {
       q.value = a, le.value += 1;
     }
     function ge() {
-      w.value.showTable = !w.value.showTable;
+      C.value.showTable = !C.value.showTable;
     }
     function ye() {
-      w.value.dataLabels.show = !w.value.dataLabels.show;
+      C.value.dataLabels.show = !C.value.dataLabels.show;
     }
     function be() {
-      w.value.showTooltip = !w.value.showTooltip;
+      C.value.showTooltip = !C.value.showTooltip;
     }
-    function Oe() {
+    function Ve() {
       return v.value;
     }
     const fe = y(() => {
       if (v.value.length === 0) return { head: [], body: [], config: {}, columnNames: [] };
-      const a = v.value.map(({ name: t, color: r }) => ({
+      const a = v.value.map(({ name: t, color: o }) => ({
         label: t,
-        color: r
+        color: o
       })), l = [];
       for (let t = c.value.start; t < c.value.end; t += 1) {
-        const r = [e.value.style.chart.grid.x.timeLabels.values[t] || t + 1];
-        F.value.forEach((o) => {
-          r.push(Number((o.series[t] || 0).toFixed(e.value.table.td.roundingValue)));
-        }), l.push(r);
+        const o = [e.value.style.chart.grid.x.timeLabels.values[t] || t + 1];
+        F.value.forEach((r) => {
+          o.push(Number((r.series[t] || 0).toFixed(e.value.table.td.roundingValue)));
+        }), l.push(o);
       }
       return { head: a, body: l };
     });
     function pe() {
-      const a = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [""]], l = ["", ...fe.value.head.map((n) => n.label)], t = fe.value.body, r = a.concat([l]).concat(t), o = je(r);
-      et({ csvContent: o, title: e.value.style.chart.title.text || "vue-ui-stackbar" });
+      const a = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [""]], l = ["", ...fe.value.head.map((i) => i.label)], t = fe.value.body, o = a.concat([l]).concat(t), r = et(o);
+      tt({ csvContent: r, title: e.value.style.chart.title.text || "vue-ui-stackbar" });
     }
     const W = y(() => {
-      const a = [""].concat(v.value.map((o) => o.name)).concat(' <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>');
+      const a = [""].concat(v.value.map((r) => r.name)).concat(' <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>');
       let l = [];
-      for (let o = 0; o < B.value; o += 1) {
-        const n = v.value.map((g) => g.series[o] ?? 0).reduce((g, f) => g + f, 0);
-        l.push([e.value.style.chart.grid.x.timeLabels.values.slice(c.value.start, c.value.end)[o] ?? o + 1].concat(v.value.map((g) => (g.series[o] ?? 0).toFixed(e.value.table.rounding))).concat((n ?? 0).toFixed(e.value.table.rounding)));
+      for (let r = 0; r < B.value; r += 1) {
+        const i = v.value.map((g) => g.series[r] ?? 0).reduce((g, f) => g + f, 0);
+        l.push([e.value.style.chart.grid.x.timeLabels.values.slice(c.value.start, c.value.end)[r] ?? r + 1].concat(v.value.map((g) => (g.series[r] ?? 0).toFixed(e.value.table.td.roundingValue))).concat((i ?? 0).toFixed(e.value.table.td.roundingValue)));
       }
       const t = {
         th: {
@@ -302,8 +312,8 @@ const ht = ["id"], gt = ["xmlns", "viewBox"], yt = { key: 0 }, bt = ["id"], ft =
           outline: e.value.table.td.outline
         },
         breakpoint: e.value.table.responsiveBreakpoint
-      }, r = [e.value.table.columnNames.period].concat(v.value.map((o) => o.name)).concat(e.value.table.columnNames.total);
-      return { head: a, body: l.slice(0, c.value.end - c.value.start), config: t, colNames: r };
+      }, o = [e.value.table.columnNames.period].concat(v.value.map((r) => r.name)).concat(e.value.table.columnNames.total);
+      return { head: a, body: l.slice(0, c.value.end - c.value.start), config: t, colNames: o };
     });
     function De(a, l) {
       if (te("selectLegend", v.value.find((t) => t.absoluteIndex === a)), L.value.includes(l.id))
@@ -321,7 +331,7 @@ const ht = ["id"], gt = ["xmlns", "viewBox"], yt = { key: 0 }, bt = ["id"], ft =
       opacity: L.value.includes(a.id) ? 0.5 : 1,
       segregate: () => De(a.absoluteIndex, a),
       isSegregated: L.value.includes(a.id)
-    }))), Ve = y(() => ({
+    }))), Ie = y(() => ({
       cy: "stackbar-legend",
       backgroundColor: e.value.style.chart.legend.backgroundColor,
       color: e.value.style.chart.legend.color,
@@ -329,15 +339,15 @@ const ht = ["id"], gt = ["xmlns", "viewBox"], yt = { key: 0 }, bt = ["id"], ft =
       paddingBottom: 12,
       fontWeight: e.value.style.chart.legend.bold ? "bold" : ""
     }));
-    return _e({
-      getData: Oe,
+    return Se({
+      getData: Ve,
       generatePdf: ce,
       generateCsv: pe,
       generateImage: ve,
       toggleTable: ge,
       toggleLabels: ye,
       toggleTooltip: be
-    }), (a, l) => (u(), i("div", {
+    }), (a, l) => (u(), n("div", {
       id: `stackbar_${X.value}`,
       ref_key: "stackbarChart",
       ref: D,
@@ -345,13 +355,13 @@ const ht = ["id"], gt = ["xmlns", "viewBox"], yt = { key: 0 }, bt = ["id"], ft =
       style: A(`background:${e.value.style.chart.backgroundColor};color:${e.value.style.chart.color};font-family:${e.value.style.fontFamily}; position: relative; ${e.value.responsive ? "height: 100%" : ""}`)
     }, [
       p(a.$slots, "userConfig", {}, void 0, !0),
-      e.value.style.chart.title.text ? (u(), i("div", {
+      e.value.style.chart.title.text ? (u(), n("div", {
         key: 0,
         ref_key: "chartTitle",
         ref: oe,
         style: A(`width:100%;background:${e.value.style.chart.backgroundColor};padding-bottom:24px`)
       }, [
-        Q(ut, {
+        Z(it, {
           config: {
             title: {
               cy: "stackbar-title",
@@ -364,13 +374,13 @@ const ht = ["id"], gt = ["xmlns", "viewBox"], yt = { key: 0 }, bt = ["id"], ft =
           }
         }, null, 8, ["config"])
       ], 4)) : d("", !0),
-      e.value.userOptions.show && P.value ? (u(), I(ot, {
+      e.value.userOptions.show && P.value ? (u(), H(rt, {
         ref: "details",
         key: `user_option_${le.value}`,
         backgroundColor: e.value.style.chart.backgroundColor,
         color: e.value.style.chart.color,
-        isPrinting: C(ie),
-        isImaging: C(ne),
+        isPrinting: w(ie),
+        isImaging: w(ne),
         uid: X.value,
         hasTooltip: e.value.style.chart.tooltip.show && e.value.userOptions.buttons.tooltip,
         hasPdf: e.value.userOptions.buttons.pdf,
@@ -381,12 +391,12 @@ const ht = ["id"], gt = ["xmlns", "viewBox"], yt = { key: 0 }, bt = ["id"], ft =
         hasFullscreen: e.value.userOptions.buttons.fullscreen,
         isFullscreen: q.value,
         chartElement: D.value,
-        isTooltip: w.value.showTooltip,
+        isTooltip: C.value.showTooltip,
         titles: { ...e.value.userOptions.buttonTitles },
-        onToggleFullscreen: Me,
-        onGeneratePdf: C(ce),
+        onToggleFullscreen: Oe,
+        onGeneratePdf: w(ce),
         onGenerateCsv: pe,
-        onGenerateImage: C(ve),
+        onGenerateImage: w(ve),
         onToggleTable: ge,
         onToggleLabels: ye,
         onToggleTooltip: be
@@ -435,20 +445,20 @@ const ht = ["id"], gt = ["xmlns", "viewBox"], yt = { key: 0 }, bt = ["id"], ft =
         } : void 0,
         a.$slots.optionFullscreen ? {
           name: "optionFullscreen",
-          fn: m(({ toggleFullscreen: t, isFullscreen: r }) => [
-            p(a.$slots, "optionFullscreen", M(O({ toggleFullscreen: t, isFullscreen: r })), void 0, !0)
+          fn: m(({ toggleFullscreen: t, isFullscreen: o }) => [
+            p(a.$slots, "optionFullscreen", M(O({ toggleFullscreen: t, isFullscreen: o })), void 0, !0)
           ]),
           key: "6"
         } : void 0
       ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasTooltip", "hasPdf", "hasImg", "hasXls", "hasTable", "hasLabel", "hasFullscreen", "isFullscreen", "chartElement", "isTooltip", "titles", "onGeneratePdf", "onGenerateImage"])) : d("", !0),
-      P.value ? (u(), i("svg", {
+      P.value ? (u(), n("svg", {
         key: 2,
-        xmlns: C(Je),
+        xmlns: w(qe),
         viewBox: `0 0 ${s.value.chartWidth <= 0 ? 10 : s.value.chartWidth} ${s.value.chartHeight <= 0 ? 10 : s.value.chartHeight}`,
         style: A(`max-width:100%;overflow:visible;background:${e.value.style.chart.backgroundColor};color:${e.value.style.chart.color}`)
       }, [
-        e.value.style.chart.bars.gradient.show ? (u(), i("defs", yt, [
-          (u(!0), i(x, null, $(v.value, (t, r) => (u(), i("linearGradient", {
+        e.value.style.chart.bars.gradient.show ? (u(), n("defs", bt, [
+          (u(!0), n(x, null, $(v.value, (t, o) => (u(), n("linearGradient", {
             id: `gradient_${t.id}`,
             x1: "0%",
             y1: "0%",
@@ -458,44 +468,44 @@ const ht = ["id"], gt = ["xmlns", "viewBox"], yt = { key: 0 }, bt = ["id"], ft =
             R("stop", {
               offset: "0%",
               "stop-color": t.color
-            }, null, 8, ft),
+            }, null, 8, pt),
             R("stop", {
               offset: "61.8%",
-              "stop-color": C(qe)(t.color, e.value.style.chart.bars.gradient.intensity / 100)
-            }, null, 8, pt),
+              "stop-color": w(Ke)(t.color, e.value.style.chart.bars.gradient.intensity / 100)
+            }, null, 8, mt),
             R("stop", {
               offset: "100%",
               "stop-color": t.color
-            }, null, 8, mt)
-          ], 8, bt))), 256))
+            }, null, 8, xt)
+          ], 8, ft))), 256))
         ])) : d("", !0),
-        e.value.style.chart.grid.x.showHorizontalLines ? (u(!0), i(x, { key: 1 }, $(K.value, (t, r) => (u(), i("line", {
+        e.value.style.chart.grid.x.showHorizontalLines ? (u(!0), n(x, { key: 1 }, $(Q.value, (t, o) => (u(), n("line", {
           x1: s.value.left,
           x2: s.value.right,
           y1: t.y,
           y2: t.y,
           stroke: e.value.style.chart.grid.x.axisColor,
           "stroke-width": 1
-        }, null, 8, xt))), 256)) : d("", !0),
-        e.value.style.chart.grid.y.showVerticalLines ? (u(!0), i(x, { key: 2 }, $(c.value.end - c.value.start + 1, (t, r) => (u(), i("line", {
-          x1: s.value.left + b.value * r,
-          x2: s.value.left + b.value * r,
+        }, null, 8, kt))), 256)) : d("", !0),
+        e.value.style.chart.grid.y.showVerticalLines ? (u(!0), n(x, { key: 2 }, $(c.value.end - c.value.start + 1, (t, o) => (u(), n("line", {
+          x1: s.value.left + b.value * o,
+          x2: s.value.left + b.value * o,
           y1: s.value.top,
           y2: s.value.bottom,
           stroke: e.value.style.chart.grid.y.axisColor,
           "stroke-width": 1
-        }, null, 8, kt))), 256)) : d("", !0),
-        (u(!0), i(x, null, $(v.value, (t, r) => (u(), i("g", null, [
-          (u(!0), i(x, null, $(t.x, (o, n) => (u(), i("path", {
-            d: r === v.value.length - 1 && v.value.at(-1).series[n] || !v.value.at(-1).series[n] && r < v.value.length - 1 && v.value[r].series[n] && !v.value[r + 1].series[n] ? `M ${o},${t.y[n]} 
+        }, null, 8, wt))), 256)) : d("", !0),
+        (u(!0), n(x, null, $(v.value, (t, o) => (u(), n("g", null, [
+          (u(!0), n(x, null, $(t.x, (r, i) => (u(), n("path", {
+            d: o === v.value.length - 1 && v.value.at(-1).series[i] || !v.value.at(-1).series[i] && o < v.value.length - 1 && v.value[o].series[i] && !v.value[o + 1].series[i] ? `M ${r},${t.y[i]} 
                             h ${b.value * (1 - e.value.style.chart.bars.gapRatio / 2) - e.value.style.chart.bars.borderRadius} 
                             a ${e.value.style.chart.bars.borderRadius},${e.value.style.chart.bars.borderRadius} 0 0 1 ${e.value.style.chart.bars.borderRadius},${e.value.style.chart.bars.borderRadius} 
-                            v ${t.height[n] - e.value.style.chart.bars.borderRadius < 0 ? 0 : t.height[n] - e.value.style.chart.bars.borderRadius} 
+                            v ${t.height[i] - e.value.style.chart.bars.borderRadius < 0 ? 0 : t.height[i] - e.value.style.chart.bars.borderRadius} 
                             h -${b.value * (1 - e.value.style.chart.bars.gapRatio / 2)} 
-                            v -${t.height[n] - e.value.style.chart.bars.borderRadius < 0 ? 0 : t.height[n] - e.value.style.chart.bars.borderRadius} 
-                            a ${e.value.style.chart.bars.borderRadius},${e.value.style.chart.bars.borderRadius} 0 0 1 ${e.value.style.chart.bars.borderRadius},-${e.value.style.chart.bars.borderRadius} z` : `M ${o},${t.y[n]} 
+                            v -${t.height[i] - e.value.style.chart.bars.borderRadius < 0 ? 0 : t.height[i] - e.value.style.chart.bars.borderRadius} 
+                            a ${e.value.style.chart.bars.borderRadius},${e.value.style.chart.bars.borderRadius} 0 0 1 ${e.value.style.chart.bars.borderRadius},-${e.value.style.chart.bars.borderRadius} z` : `M ${r},${t.y[i]} 
                             h ${b.value * (1 - e.value.style.chart.bars.gapRatio / 2)} 
-                            v ${t.height[n] < 0 ? 0 : t.height[n]} 
+                            v ${t.height[i] < 0 ? 0 : t.height[i]} 
                             h -${b.value * (1 - e.value.style.chart.bars.gapRatio / 2)} z`,
             fill: e.value.style.chart.bars.gradient.show ? `url(#gradient_${t.id})` : t.color,
             stroke: e.value.style.chart.backgroundColor,
@@ -503,9 +513,9 @@ const ht = ["id"], gt = ["xmlns", "viewBox"], yt = { key: 0 }, bt = ["id"], ft =
             "stroke-linecap": "round",
             "stroke-linejoin": "round",
             class: ke({ "vue-data-ui-bar-animated": e.value.useCssAnimation })
-          }, null, 10, wt))), 256))
+          }, null, 10, Ct))), 256))
         ]))), 256)),
-        e.value.style.chart.grid.x.showAxis ? (u(), i("line", {
+        e.value.style.chart.grid.x.showAxis ? (u(), n("line", {
           key: 3,
           x1: s.value.left,
           x2: s.value.right,
@@ -515,8 +525,8 @@ const ht = ["id"], gt = ["xmlns", "viewBox"], yt = { key: 0 }, bt = ["id"], ft =
           "stroke-width": e.value.style.chart.grid.x.axisThickness,
           "stroke-linecap": "round",
           "stroke-linejoin": "round"
-        }, null, 8, Ct)) : d("", !0),
-        e.value.style.chart.grid.y.showAxis && !e.value.style.chart.bars.distributed ? (u(), i("line", {
+        }, null, 8, $t)) : d("", !0),
+        e.value.style.chart.grid.y.showAxis && !e.value.style.chart.bars.distributed ? (u(), n("line", {
           key: 4,
           x1: s.value.left,
           x2: s.value.left,
@@ -526,8 +536,8 @@ const ht = ["id"], gt = ["xmlns", "viewBox"], yt = { key: 0 }, bt = ["id"], ft =
           "stroke-width": e.value.style.chart.grid.y.axisThickness,
           "stroke-linecap": "round",
           "stroke-linejoin": "round"
-        }, null, 8, $t)) : d("", !0),
-        e.value.style.chart.grid.x.axisName.show && e.value.style.chart.grid.x.axisName.text ? (u(), i("text", {
+        }, null, 8, Lt)) : d("", !0),
+        e.value.style.chart.grid.x.axisName.show && e.value.style.chart.grid.x.axisName.text ? (u(), n("text", {
           key: 5,
           x: s.value.left + s.value.width / 2,
           y: s.value.chartHeight + e.value.style.chart.grid.x.axisName.offsetY,
@@ -535,85 +545,85 @@ const ht = ["id"], gt = ["xmlns", "viewBox"], yt = { key: 0 }, bt = ["id"], ft =
           fill: e.value.style.chart.grid.x.axisName.color,
           "font-weight": e.value.style.chart.grid.x.axisName.bold ? "bold" : "normal",
           "text-anchor": "middle"
-        }, z(e.value.style.chart.grid.x.axisName.text), 9, Lt)) : d("", !0),
-        e.value.style.chart.grid.y.axisName.show && e.value.style.chart.grid.y.axisName.text ? (u(), i("text", {
+        }, z(e.value.style.chart.grid.x.axisName.text), 9, _t)) : d("", !0),
+        e.value.style.chart.grid.y.axisName.show && e.value.style.chart.grid.y.axisName.text ? (u(), n("text", {
           key: 6,
           transform: `translate(${e.value.style.chart.grid.y.axisName.fontSize + e.value.style.chart.grid.y.axisName.offsetX}, ${s.value.top + s.value.height / 2}) rotate(-90)`,
           "font-size": e.value.style.chart.grid.y.axisName.fontSize,
           fill: e.value.style.chart.grid.y.axisName.color,
           "font-weight": e.value.style.chart.grid.y.axisName.bold ? "bold" : "normal",
           "text-anchor": "middle"
-        }, z(e.value.style.chart.grid.y.axisName.text), 9, _t)) : d("", !0),
-        w.value.dataLabels.show ? (u(), i(x, { key: 7 }, [
-          (u(!0), i(x, null, $(v.value, (t, r) => (u(), i("g", null, [
-            (u(!0), i(x, null, $(t.x, (o, n) => (u(), i("text", {
-              x: o + b.value * (1 - e.value.style.chart.bars.gapRatio / 2) / 2,
-              y: t.y[n] + t.proportions[n] * s.value.height / 2 + e.value.style.chart.bars.dataLabels.fontSize / 3,
+        }, z(e.value.style.chart.grid.y.axisName.text), 9, St)) : d("", !0),
+        C.value.dataLabels.show ? (u(), n(x, { key: 7 }, [
+          (u(!0), n(x, null, $(v.value, (t, o) => (u(), n("g", null, [
+            (u(!0), n(x, null, $(t.x, (r, i) => (u(), n("text", {
+              x: r + b.value * (1 - e.value.style.chart.bars.gapRatio / 2) / 2,
+              y: t.y[i] + t.proportions[i] * s.value.height / 2 + e.value.style.chart.bars.dataLabels.fontSize / 3,
               "font-size": e.value.style.chart.bars.dataLabels.fontSize,
-              fill: e.value.style.chart.bars.dataLabels.adaptColorToBackground ? C(Ze)(t.color) : e.value.style.chart.bars.dataLabels.color,
+              fill: e.value.style.chart.bars.dataLabels.adaptColorToBackground ? w(Qe)(t.color) : e.value.style.chart.bars.dataLabels.color,
               "font-weight": e.value.style.chart.bars.dataLabels.bold ? "bold" : "normal",
               "text-anchor": "middle"
-            }, z(e.value.style.chart.bars.showDistributedPercentage && e.value.style.chart.bars.distributed ? Re(t.proportions[n] * 100) : he(t.series[n])), 9, St))), 256))
+            }, z(e.value.style.chart.bars.showDistributedPercentage && e.value.style.chart.bars.distributed ? Pe(t.proportions[i] * 100, t, o, i) : he(t.series[i], t, o, i)), 9, Tt))), 256))
           ]))), 256)),
-          e.value.style.chart.bars.totalValues.show && v.value.length > 1 ? (u(), i("g", Tt, [
-            (u(!0), i(x, null, $(Ne.value, (t, r) => (u(), i("text", {
-              x: s.value.left + b.value * r + b.value / 2,
+          e.value.style.chart.bars.totalValues.show && v.value.length > 1 ? (u(), n("g", zt, [
+            (u(!0), n(x, null, $(Re.value, (t, o) => (u(), n("text", {
+              x: s.value.left + b.value * o + b.value / 2,
               y: (e.value.style.chart.bars.distributed ? s.value.top - e.value.style.chart.bars.totalValues.fontSize / 3 : t.y) + e.value.style.chart.bars.totalValues.offsetY,
               "text-anchor": "middle",
               "font-size": e.value.style.chart.bars.totalValues.fontSize,
               "font-weight": e.value.style.chart.bars.totalValues.bold ? "bold" : "normal",
               fill: e.value.style.chart.bars.totalValues.color
-            }, z(he(t.value)), 9, zt))), 256))
+            }, z(he(t.value, t, o)), 9, Nt))), 256))
           ])) : d("", !0)
         ], 64)) : d("", !0),
-        e.value.style.chart.grid.y.axisLabels.show && !e.value.style.chart.bars.distributed ? (u(), i(x, { key: 8 }, [
-          (u(!0), i(x, null, $(K.value, (t, r) => (u(), i("line", {
+        e.value.style.chart.grid.y.axisLabels.show && !e.value.style.chart.bars.distributed ? (u(), n(x, { key: 8 }, [
+          (u(!0), n(x, null, $(Q.value, (t, o) => (u(), n("line", {
             x1: s.value.left,
             x2: s.value.left - 6,
             y1: t.y,
             y2: t.y,
             stroke: e.value.style.chart.grid.x.axisColor,
             "stroke-width": 1
-          }, null, 8, Nt))), 256)),
-          (u(!0), i(x, null, $(K.value, (t, r) => (u(), i("text", {
+          }, null, 8, Rt))), 256)),
+          (u(!0), n(x, null, $(Q.value, (t, o) => (u(), n("text", {
             x: t.x,
             y: t.y + e.value.style.chart.grid.y.axisLabels.fontSize / 3,
             "font-size": e.value.style.chart.grid.y.axisLabels.fontSize,
             "font-weight": e.value.style.chart.grid.y.axisLabels.bold ? "bold" : "normal",
             fill: e.value.style.chart.grid.y.axisLabels.color,
             "text-anchor": "end"
-          }, z(C(H)({
+          }, z(w(V)({
             p: e.value.style.chart.bars.dataLabels.prefix,
             v: t.value,
             s: e.value.style.chart.bars.dataLabels.suffix,
             r: e.value.style.chart.grid.y.axisLabels.rounding
-          })), 9, Rt))), 256))
+          })), 9, Pt))), 256))
         ], 64)) : d("", !0),
-        e.value.style.chart.grid.x.timeLabels.show ? (u(!0), i(x, { key: 9 }, $(U.value, (t, r) => (u(), i("text", {
+        e.value.style.chart.grid.x.timeLabels.show ? (u(!0), n(x, { key: 9 }, $(U.value, (t, o) => (u(), n("text", {
           "text-anchor": e.value.style.chart.grid.x.timeLabels.rotation > 0 ? "start" : e.value.style.chart.grid.x.timeLabels.rotation < 0 ? "end" : "middle",
           "font-size": e.value.style.chart.grid.x.timeLabels.fontSize,
           "font-weight": e.value.style.chart.grid.x.timeLabels.bold ? "bold" : "normal",
           fill: e.value.style.chart.grid.x.timeLabels.color,
-          transform: `translate(${s.value.left + b.value * r + b.value / 2}, ${s.value.bottom + e.value.style.chart.grid.x.timeLabels.fontSize * 1.3 + e.value.style.chart.grid.x.timeLabels.offsetY}), rotate(${e.value.style.chart.grid.x.timeLabels.rotation})`
-        }, z(t), 9, Pt))), 256)) : d("", !0),
-        w.value.showTooltip ? (u(!0), i(x, { key: 10 }, $(c.value.end - c.value.start, (t, r) => (u(), i("rect", {
-          x: s.value.left + r * b.value,
+          transform: `translate(${s.value.left + b.value * o + b.value / 2}, ${s.value.bottom + e.value.style.chart.grid.x.timeLabels.fontSize * 1.3 + e.value.style.chart.grid.x.timeLabels.offsetY}), rotate(${e.value.style.chart.grid.x.timeLabels.rotation})`
+        }, z(t), 9, Ft))), 256)) : d("", !0),
+        C.value.showTooltip ? (u(!0), n(x, { key: 10 }, $(c.value.end - c.value.start, (t, o) => (u(), n("rect", {
+          x: s.value.left + o * b.value,
           y: s.value.top,
           width: b.value,
           height: s.value.height,
-          onClick: (o) => Pe(r),
-          onMouseenter: (o) => Fe(r),
-          onMouseleave: l[0] || (l[0] = (o) => {
-            Z.value = null, Y.value = !1;
+          onClick: (r) => Fe(o),
+          onMouseenter: (r) => Me(o),
+          onMouseleave: l[0] || (l[0] = (r) => {
+            K.value = null, Y.value = !1;
           }),
-          fill: r === Z.value ? e.value.style.chart.highlighter.color + C(Ke)[e.value.style.chart.highlighter.opacity] : "transparent"
-        }, null, 40, Ft))), 256)) : d("", !0),
+          fill: o === K.value ? e.value.style.chart.highlighter.color + w(Ze)[e.value.style.chart.highlighter.opacity] : "transparent"
+        }, null, 40, Mt))), 256)) : d("", !0),
         p(a.$slots, "svg", M(O({ ...s.value })), void 0, !0)
-      ], 12, gt)) : d("", !0),
-      a.$slots.watermark ? (u(), i("div", Mt, [
-        p(a.$slots, "watermark", M(O({ isPrinting: C(ie) || C(ne) })), void 0, !0)
+      ], 12, yt)) : d("", !0),
+      a.$slots.watermark ? (u(), n("div", Ot, [
+        p(a.$slots, "watermark", M(O({ isPrinting: w(ie) || w(ne) })), void 0, !0)
       ])) : d("", !0),
-      P.value ? d("", !0) : (u(), I(vt, {
+      P.value ? d("", !0) : (u(), H(dt, {
         key: 4,
         config: {
           type: "bar",
@@ -634,7 +644,7 @@ const ht = ["id"], gt = ["xmlns", "viewBox"], yt = { key: 0 }, bt = ["id"], ft =
         style: A(`width:100%;background:${e.value.style.chart.backgroundColor}`),
         "data-html2canvas-ignore": ""
       }, [
-        e.value.style.chart.zoom.show && B.value > 1 ? (u(), I(rt, {
+        e.value.style.chart.zoom.show && B.value > 1 ? (u(), H(st, {
           key: `slicer_${ue.value}`,
           background: e.value.style.chart.zoom.color,
           borderColor: e.value.style.chart.backgroundColor,
@@ -653,7 +663,7 @@ const ht = ["id"], gt = ["xmlns", "viewBox"], yt = { key: 0 }, bt = ["id"], ft =
           "onUpdate:start": l[1] || (l[1] = (t) => c.value.start = t),
           end: c.value.end,
           "onUpdate:end": l[2] || (l[2] = (t) => c.value.end = t),
-          onReset: ze
+          onReset: Ne
         }, {
           "reset-action": m(({ reset: t }) => [
             p(a.$slots, "reset-action", M(O({ reset: t })), void 0, !0)
@@ -661,8 +671,8 @@ const ht = ["id"], gt = ["xmlns", "viewBox"], yt = { key: 0 }, bt = ["id"], ft =
           _: 3
         }, 8, ["background", "borderColor", "fontSize", "useResetSlot", "labelLeft", "labelRight", "textColor", "inputColor", "selectColor", "max", "valueStart", "valueEnd", "start", "end"])) : d("", !0)
       ], 4),
-      Q(st, {
-        show: w.value.showTooltip && Y.value,
+      Z(ut, {
+        show: C.value.showTooltip && Y.value,
         backgroundColor: e.value.style.chart.tooltip.backgroundColor,
         color: e.value.style.chart.tooltip.color,
         fontSize: e.value.style.chart.tooltip.fontSize,
@@ -674,7 +684,7 @@ const ht = ["id"], gt = ["xmlns", "viewBox"], yt = { key: 0 }, bt = ["id"], ft =
         offsetY: e.value.style.chart.tooltip.offsetY,
         parent: D.value,
         content: J.value,
-        isCustom: C($e)(e.value.style.chart.tooltip.customFormat)
+        isCustom: w($e)(e.value.style.chart.tooltip.customFormat)
       }, {
         "tooltip-before": m(() => [
           p(a.$slots, "tooltip-before", M(O({ ...ae.value })), void 0, !0)
@@ -688,17 +698,17 @@ const ht = ["id"], gt = ["xmlns", "viewBox"], yt = { key: 0 }, bt = ["id"], ft =
         ref_key: "chartLegend",
         ref: re
       }, [
-        e.value.style.chart.legend.show && P.value ? (u(), I(it, {
+        e.value.style.chart.legend.show && P.value ? (u(), H(nt, {
           key: 0,
           legendSet: me.value,
-          config: Ve.value,
+          config: Ie.value,
           onClickMarker: l[3] || (l[3] = ({ legend: t }) => t.segregate())
         }, {
           item: m(({ legend: t }) => [
             R("div", {
-              onClick: (r) => t.segregate(),
+              onClick: (o) => t.segregate(),
               style: A(`opacity:${L.value.includes(t.id) ? 0.5 : 1}`)
-            }, z(t.name), 13, Ot)
+            }, z(t.name), 13, Vt)
           ]),
           _: 1
         }, 8, ["legendSet", "config"])) : p(a.$slots, "legend", {
@@ -706,11 +716,11 @@ const ht = ["id"], gt = ["xmlns", "viewBox"], yt = { key: 0 }, bt = ["id"], ft =
           legend: me.value
         }, void 0, !0)
       ], 512),
-      c.value.end - c.value.start < 200 ? (u(), I(nt, {
+      c.value.end - c.value.start < 200 ? (u(), H(ct, {
         key: 5,
         hideDetails: "",
         config: {
-          open: w.value.showTable,
+          open: C.value.showTable,
           maxHeight: 1e4,
           body: {
             backgroundColor: e.value.style.chart.backgroundColor,
@@ -723,28 +733,33 @@ const ht = ["id"], gt = ["xmlns", "viewBox"], yt = { key: 0 }, bt = ["id"], ft =
         }
       }, {
         content: m(() => [
-          Q(ct, {
+          Z(vt, {
             colNames: W.value.colNames,
             head: W.value.head,
             body: W.value.body,
             config: W.value.config,
             title: `${e.value.style.chart.title.text}${e.value.style.chart.title.subtitle.text ? ` : ${e.value.style.chart.title.subtitle.text}` : ""}`,
-            onClose: l[4] || (l[4] = (t) => w.value.showTable = !1)
+            onClose: l[4] || (l[4] = (t) => C.value.showTable = !1)
           }, {
             th: m(({ th: t }) => [
               R("div", { innerHTML: t }, null, 8, Dt)
             ]),
             td: m(({ td: t }) => [
-              Ie(z(t), 1)
+              He(z(isNaN(Number(t)) ? t : w(V)({
+                p: e.value.style.chart.bars.dataLabels.prefix,
+                v: t,
+                s: e.value.style.chart.bars.dataLabels.suffix,
+                r: e.value.table.td.roundingValue
+              })), 1)
             ]),
             _: 1
           }, 8, ["colNames", "head", "body", "config", "title"])
         ]),
         _: 1
       }, 8, ["config"])) : d("", !0)
-    ], 14, ht));
+    ], 14, gt));
   }
-}, Kt = /* @__PURE__ */ dt(Vt, [["__scopeId", "data-v-5aeb6468"]]);
+}, Zt = /* @__PURE__ */ ht(It, [["__scopeId", "data-v-63fd67c1"]]);
 export {
-  Kt as default
+  Zt as default
 };