vue-data-ui 2.4.3 → 2.4.4

package/dist/{vue-ui-vertical-bar-CtnIKsM1.js → vue-ui-vertical-bar-D1cBfu5p.js}

@@ -1,21 +1,21 @@
-import { useCssVars as Je, computed as m, ref as r, watch as Fe, onMounted as Qe, onBeforeUnmount as Ze, openBlock as u, createElementBlock as d, normalizeClass as R, normalizeStyle as c, createBlock as M, createCommentVNode as f, unref as h, createSlots as et, withCtx as k, renderSlot as _, normalizeProps as U, guardReactiveProps as H, createElementVNode as n, toDisplayString as i, createVNode as re, Fragment as W, renderList as j, withKeys as tt, createTextVNode as at } from "vue";
-import { u as lt, c as ot, t as nt, a as ut, p as I, b as st, o as Me, e as Z, v as S, d as ie, i as ee, f as O, X as rt, s as de, w as it, x as dt, y as ct, q as vt, r as ht } from "./index-Bya_q1J-.js";
-import { t as pt, u as gt } from "./useResponsive-BY8tgM1n.js";
-import { _ as yt } from "./Title-C5pIfQAz.js";
-import { u as ft, U as bt } from "./usePrinter-CiHd1FwD.js";
-import { _ as mt } from "./Tooltip-Cz24YLfw.js";
-import { L as Ie } from "./Legend-DNgTCgEK.js";
-import _t from "./vue-ui-skeleton-BYssP0K4.js";
-import kt from "./BaseIcon-BbvG1AlW.js";
-import xt from "./vue-ui-accordion-DfUfL2dI.js";
-import { u as Oe } from "./useNestedProp-B33hazbH.js";
-import { _ as $t } from "./PackageVersion-VkaUzgmt.js";
-import { P as Ct } from "./PenAndPaper-DAZYA8Ew.js";
-import { _ as wt } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const Tt = ["id"], Lt = ["onClick"], Pt = ["xmlns", "viewBox"], Nt = ["id"], St = ["stop-color"], Vt = ["stop-color"], zt = ["x", "y", "width", "height", "fill", "rx"], Ft = ["x", "y", "width", "height", "fill", "rx", "stroke", "stroke-width"], Mt = ["x2", "y1", "y2", "stroke", "stroke-width"], It = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Ot = ["x", "y", "text-anchor", "font-size", "fill", "font-weight"], At = ["x", "y", "font-size", "fill", "font-weight"], Bt = ["x", "y", "font-size", "fill", "font-weight"], Dt = ["x", "y", "font-size", "fill", "font-weight"], Rt = ["y", "width", "height", "fill", "onMouseenter"], Xt = {
-  key: 5,
+import { useCssVars as Ze, computed as b, ref as r, watch as Me, onMounted as et, onBeforeUnmount as tt, openBlock as u, createElementBlock as i, normalizeClass as R, normalizeStyle as c, createBlock as M, createCommentVNode as g, unref as h, createSlots as at, withCtx as k, renderSlot as _, normalizeProps as U, guardReactiveProps as H, createElementVNode as n, toDisplayString as d, createVNode as re, Fragment as W, renderList as j, withKeys as lt, createTextVNode as ot } from "vue";
+import { u as nt, c as ut, t as st, a as rt, p as O, b as it, o as Oe, e as Z, v as S, d as ie, i as ee, f as I, X as dt, s as de, w as ct, x as vt, y as ht, q as pt, r as gt } from "./index-DCsPHn9C.js";
+import { t as yt, u as ft } from "./useResponsive-CoxXLe23.js";
+import { _ as bt } from "./Title-710895ks.js";
+import { u as mt, U as _t } from "./usePrinter-siG3sKWo.js";
+import { _ as kt } from "./Tooltip-CPlG_yQU.js";
+import { L as Ie } from "./Legend-CRMHjbGw.js";
+import xt from "./vue-ui-skeleton-DNuwx6_y.js";
+import $t from "./BaseIcon-BX3x6oa7.js";
+import Ct from "./vue-ui-accordion-D4Er5Dy5.js";
+import { u as Ae } from "./useNestedProp-DdSlLeTW.js";
+import { _ as wt } from "./PackageVersion-Clrfvyd8.js";
+import { P as Tt } from "./PenAndPaper-BQzgk5kO.js";
+import { _ as Lt } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const Nt = ["id"], Pt = ["onClick"], St = ["xmlns", "viewBox"], Vt = ["id"], zt = ["stop-color"], Ft = ["stop-color"], Mt = ["x", "y", "width", "height", "fill", "rx"], Ot = ["x", "y", "width", "height", "fill", "rx", "stroke", "stroke-width"], It = ["x2", "y1", "y2", "stroke", "stroke-width"], At = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Bt = ["x", "y", "text-anchor", "font-size", "fill", "font-weight"], Dt = ["x", "y", "font-size", "fill", "font-weight"], Rt = ["x", "y", "font-size", "fill", "font-weight"], Xt = ["x", "y", "font-size", "fill", "font-weight"], Et = ["y", "width", "height", "fill", "onMouseenter"], Gt = {
+  key: 6,
   class: "vue-data-ui-watermark"
-}, Et = ["onClick"], Gt = { style: "width:100%;padding-top: 36px;position:relative" }, Ut = { class: "vue-ui-data-table" }, Ht = { key: 0 }, Wt = { style: { width: "100%" } }, jt = ["data-cell"], Yt = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, qt = ["data-cell"], Kt = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Jt = ["data-cell"], Qt = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Zt = ["data-cell"], ea = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, ta = ["data-cell"], aa = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, la = ["data-cell"], oa = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, na = ["data-cell"], ua = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, sa = {
+}, Ut = ["onClick"], Ht = { style: "width:100%;padding-top: 36px;position:relative" }, Wt = { class: "vue-ui-data-table" }, jt = { key: 0 }, Yt = { style: { width: "100%" } }, qt = ["data-cell"], Kt = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Jt = ["data-cell"], Qt = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Zt = ["data-cell"], ea = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, ta = ["data-cell"], aa = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, la = ["data-cell"], oa = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, na = ["data-cell"], ua = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, sa = ["data-cell"], ra = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, ia = {
   __name: "vue-ui-vertical-bar",
   props: {
     config: {
@@ -32,75 +32,76 @@ const Tt = ["id"], Lt = ["onClick"], Pt = ["xmlns", "viewBox"], Nt = ["id"], St
     }
   },
   emits: ["selectLegend"],
-  setup(Ae, { expose: Be, emit: De }) {
-    const C = Ae;
-    Je((t) => ({
-      "13c3fec0": t.tdo
+  setup(Be, { expose: De, emit: Re }) {
+    const C = Be;
+    Ze((t) => ({
+      "5a0dcab3": t.tdo
     }));
-    const { vue_ui_vertical_bar: Re } = lt(), Y = m(() => !!C.dataset && C.dataset.length), V = r(ot()), Xe = r(null), te = r(!1), ae = r(""), q = r(0), Ee = r(null), ce = r(0), A = r(null), ve = r(null), le = r(null), he = r(null), pe = r(0), oe = r(0), e = m({
-      get: () => ge(),
+    const { vue_ui_vertical_bar: Xe } = nt(), Y = b(() => !!C.dataset && C.dataset.length), V = r(ut()), Ee = r(null), te = r(!1), ae = r(""), q = r(0), Ge = r(null), ce = r(0), A = r(null), ve = r(null), le = r(null), he = r(null), pe = r(null), ge = r(0), oe = r(0), e = b({
+      get: () => ye(),
       set: (t) => t
     });
-    function ge() {
-      const t = Oe({
+    function ye() {
+      const t = Ae({
         userConfig: C.config,
-        defaultConfig: Re
+        defaultConfig: Xe
       });
       return t.theme ? {
-        ...Oe({
-          userConfig: nt.vue_ui_vertical_bar[t.theme] || C.config,
+        ...Ae({
+          userConfig: st.vue_ui_vertical_bar[t.theme] || C.config,
           defaultConfig: t
         }),
-        customPalette: ut[t.theme] || I
+        customPalette: rt[t.theme] || O
       } : t;
     }
-    Fe(() => C.config, (t) => {
-      e.value = ge(), $e(), pe.value += 1, oe.value += 1, v.value = e.value.style.chart.layout.bars.height, g.value = e.value.style.chart.layout.bars.gap;
-    }, { deep: !0 }), Fe(() => C.dataset, J, { deep: !0 });
-    const { isPrinting: ye, isImaging: fe, generatePdf: be, generateImage: me } = ft({
+    Me(() => C.config, (t) => {
+      e.value = ye(), Ce(), ge.value += 1, oe.value += 1, v.value = e.value.style.chart.layout.bars.height, y.value = e.value.style.chart.layout.bars.gap;
+    }, { deep: !0 }), Me(() => C.dataset, J, { deep: !0 });
+    const { isPrinting: fe, isImaging: be, generatePdf: me, generateImage: _e } = mt({
       elementId: `vue-ui-vertical-bar_${V.value}`,
       fileName: e.value.style.chart.title.text || "vue-ui-vertical-bar"
-    }), _e = m(() => st(e.value.customPalette)), ke = r(null), xe = r(!1), Ge = m(() => e.value.table.responsiveBreakpoint), K = r(null);
-    Qe(() => {
-      $e();
+    }), Ue = b(() => e.value.userOptions.show && !e.value.style.chart.title.text), ke = b(() => it(e.value.customPalette)), xe = r(null), $e = r(!1), He = b(() => e.value.table.responsiveBreakpoint), K = r(null);
+    et(() => {
+      Ce();
     });
-    function $e() {
-      if (Me(C.dataset) && Z({
+    function Ce() {
+      if (Oe(C.dataset) && Z({
         componentName: "VueUiVerticalBar",
         type: "dataset"
-      }), q.value = C.dataset.flatMap((t) => t.children && t.children.length > 0 ? t.children.length : 1).reduce((t, l) => t + l, 0), Ue(), e.value.responsive) {
-        const t = pt(() => {
-          const { width: l, height: a } = gt({
+      }), q.value = C.dataset.flatMap((t) => t.children && t.children.length > 0 ? t.children.length : 1).reduce((t, l) => t + l, 0), We(), e.value.responsive) {
+        const t = yt(() => {
+          const { width: l, height: a } = ft({
             chart: A.value,
             title: e.value.style.chart.title.text ? ve.value : null,
             legend: e.value.style.chart.legend.show ? le.value : null,
-            source: he.value
+            source: he.value,
+            noTitle: pe.value
           });
-          Te.value = l, v.value = a / q.value - g.value * 2;
+          Le.value = l, v.value = a / q.value - y.value * 2;
         });
         K.value = new ResizeObserver(t), K.value.observe(A.value.parentNode);
       }
     }
-    Ze(() => {
+    tt(() => {
       K.value && K.value.disconnect();
     });
-    function Ue() {
+    function We() {
       new ResizeObserver((l) => {
         l.forEach((a) => {
-          xe.value = a.contentRect.width < Ge.value;
+          $e.value = a.contentRect.width < He.value;
         });
-      }).observe(ke.value);
+      }).observe(xe.value);
     }
     const $ = r({
       showTable: e.value.table.show,
       sortDesc: e.value.style.chart.layout.bars.sort === "desc",
       showTooltip: e.value.style.chart.tooltip.show
-    }), Ce = m(() => $.value.sortDesc), z = m(() => (C.dataset.forEach((t, l) => {
+    }), we = b(() => $.value.sortDesc), z = b(() => (C.dataset.forEach((t, l) => {
       !t.value && !t.children && Z({
         componentName: "VueUiVerticalBar",
         type: "datasetAttributeEmpty",
         property: `value (index ${l})`
-      }), t.children && (Me(t.children) ? Z({
+      }), t.children && (Oe(t.children) ? Z({
         componentName: "VueUiVerticalBar",
         type: "datasetAttributeEmpty",
         property: `children (index ${l})`
@@ -114,99 +115,99 @@ const Tt = ["id"], Lt = ["onClick"], Pt = ["xmlns", "viewBox"], Nt = ["id"], St
         });
       }));
     }), C.dataset.map((t, l) => {
-      const a = `vertical_parent_${l}_${V.value}`, o = t.children && t.children.length > 0, b = S(t.value ? t.value : o ? t.children.map((x) => x.value || 0).reduce((x, P) => x + P, 0) : 0), p = b >= 0 ? 1 : -1;
+      const a = `vertical_parent_${l}_${V.value}`, o = t.children && t.children.length > 0, m = S(t.value ? t.value : o ? t.children.map((x) => x.value || 0).reduce((x, N) => x + N, 0) : 0), p = m >= 0 ? 1 : -1;
       return {
         ...t,
         id: a,
         shape: "square",
         opacity: T.value.includes(a) ? 0.5 : 1,
-        value: Math.abs(b),
+        value: Math.abs(m),
         sign: p,
         hasChildren: o,
         isChild: !1,
         segregate: () => X(a),
         isSegregated: T.value.includes(a),
-        color: ie(t.color) || _e.value[l] || I[l] || I[l % I.length],
-        children: !t.children || !t.children.length ? [] : t.children.toSorted((x, P) => Ce.value ? P.value - x.value : x.value - P.value).map((x, P) => ({
+        color: ie(t.color) || ke.value[l] || O[l] || O[l % O.length],
+        children: !t.children || !t.children.length ? [] : t.children.toSorted((x, N) => we.value ? N.value - x.value : x.value - N.value).map((x, N) => ({
           ...x,
           value: S(Math.abs(x.value)),
           sign: x.value >= 0 ? 1 : -1,
           isChild: !0,
           parentId: a,
           parentName: t.name,
-          parentValue: b,
+          parentValue: m,
           parentSign: p,
-          id: `vertical_child_${l}_${P}_${V.value}`,
-          childIndex: P,
-          color: ie(x.color) || ie(t.color) || _e.value[l] || I[l] || I[l % I.length]
-        })).map((x, P) => ({
+          id: `vertical_child_${l}_${N}_${V.value}`,
+          childIndex: N,
+          color: ie(x.color) || ie(t.color) || ke.value[l] || O[l] || O[l % O.length]
+        })).map((x, N) => ({
           ...x,
-          isFirstChild: P === 0,
-          isLastChild: P === t.children.length - 1
+          isFirstChild: N === 0,
+          isLastChild: N === t.children.length - 1
         }))
       };
-    }).toSorted((t, l) => Ce.value ? l.value - t.value : t.value - l.value))), we = m(() => ({
+    }).toSorted((t, l) => we.value ? l.value - t.value : t.value - l.value))), Te = b(() => ({
       cy: "vertical-bar-div-legend",
       backgroundColor: e.value.style.chart.legend.backgroundColor,
       color: e.value.style.chart.legend.color,
       fontSize: e.value.style.chart.legend.fontSize,
       paddingBottom: 12,
       fontWeight: e.value.style.chart.legend.bold ? "bold" : ""
-    })), v = r(e.value.style.chart.layout.bars.height), g = r(e.value.style.chart.layout.bars.gap), He = m(() => (v.value + g.value) * q.value), Te = r(512), y = m(() => ({
-      width: Te.value,
-      height: He.value,
+    })), v = r(e.value.style.chart.layout.bars.height), y = r(e.value.style.chart.layout.bars.gap), je = b(() => (v.value + y.value) * q.value), Le = r(512), f = b(() => ({
+      width: Le.value,
+      height: je.value,
       padding: {
         top: 12,
         left: 128 + e.value.style.chart.layout.bars.offsetX,
         right: 64 + e.value.style.chart.layout.bars.paddingRight,
         bottom: 12
       }
-    })), s = m(() => ({
-      fullHeight: y.value.padding.top + y.value.padding.bottom + y.value.height,
-      top: y.value.padding.top,
-      left: y.value.padding.left,
-      right: y.value.width - y.value.padding.right,
-      bottom: y.value.padding.top + y.value.height,
-      width: y.value.width - (y.value.padding.left + y.value.padding.right)
+    })), s = b(() => ({
+      fullHeight: f.value.padding.top + f.value.padding.bottom + f.value.height,
+      top: f.value.padding.top,
+      left: f.value.padding.left,
+      right: f.value.width - f.value.padding.right,
+      bottom: f.value.padding.top + f.value.height,
+      width: f.value.width - (f.value.padding.left + f.value.padding.right)
     }));
     function J() {
       q.value = F.value.flatMap((t) => t.children && t.children.length > 0 ? t.children.length : 1).reduce((t, l) => t + l, 0);
     }
     const T = r([]);
     function X(t) {
-      T.value.includes(t) ? T.value = T.value.filter((l) => l !== t) : T.value.push(t), J(), De("selectLegend", F.value);
+      T.value.includes(t) ? T.value = T.value.filter((l) => l !== t) : T.value.push(t), J(), Re("selectLegend", F.value);
     }
-    const F = m(() => z.value.filter((t) => !T.value.includes(t.id))), L = m(() => F.value.map((t) => Math.abs(t.value)).reduce((t, l) => t + l, 0));
-    function Le(t, l = !1, a = 0) {
-      return l ? O({
+    const F = b(() => z.value.filter((t) => !T.value.includes(t.id))), L = b(() => F.value.map((t) => Math.abs(t.value)).reduce((t, l) => t + l, 0));
+    function Ne(t, l = !1, a = 0) {
+      return l ? I({
         v: S(Math.abs(t) / L.value * 100),
         s: "%",
         r: a
       }) : Math.abs(t) / L.value;
     }
-    const B = m(() => F.value.flatMap((t) => t.hasChildren ? t.children : t)), D = m(() => B.value.map((t) => t.sign).includes(-1)), We = m(() => Math.max(...F.value.flatMap((t) => t.children && t.children.length ? Math.max(...t.children.map((l) => l.value)) : t.value)));
-    function N(t) {
-      const l = t / We.value;
+    const B = b(() => F.value.flatMap((t) => t.hasChildren ? t.children : t)), D = b(() => B.value.map((t) => t.sign).includes(-1)), Ye = b(() => Math.max(...F.value.flatMap((t) => t.children && t.children.length ? Math.max(...t.children.map((l) => l.value)) : t.value)));
+    function P(t) {
+      const l = t / Ye.value;
       return s.value.width / (D.value ? 2 : 1) * l;
     }
-    function je(t) {
-      return N(t) + s.value.left;
+    function qe(t) {
+      return P(t) + s.value.left;
     }
     function E(t, l) {
-      const a = F.value.find((p) => p.id === t.parentId), o = s.value.top + (g.value + v.value) * l, b = a.children.length * (g.value + v.value);
+      const a = F.value.find((p) => p.id === t.parentId), o = s.value.top + (y.value + v.value) * l, m = a.children.length * (y.value + v.value);
       return {
-        y: o + b / 2 - e.value.style.chart.layout.bars.parentLabels.fontSize,
+        y: o + m / 2 - e.value.style.chart.layout.bars.parentLabels.fontSize,
         name: a.name,
         value: [void 0, NaN, null].includes(a.value) ? "" : a.sign === 1 ? a.value : -a.value,
-        percentageToTotal: isNaN(a.value / L.value) ? "" : Le(a.value, !0, e.value.style.chart.layout.bars.dataLabels.percentage.roundingPercentage),
+        percentageToTotal: isNaN(a.value / L.value) ? "" : Ne(a.value, !0, e.value.style.chart.layout.bars.dataLabels.percentage.roundingPercentage),
         sign: a.sign
       };
     }
-    function Ye() {
+    function Ke() {
       return F.value;
     }
     const ne = r(null), ue = r(null);
-    function qe(t, l) {
+    function Je(t, l) {
       ue.value = {
         datapoint: t,
         seriesIndex: l,
@@ -214,8 +215,8 @@ const Tt = ["id"], Lt = ["onClick"], Pt = ["xmlns", "viewBox"], Nt = ["id"], St
         config: e.value
       }, te.value = !0, ne.value = t.id;
       let a = "";
-      const o = t.isChild ? t.parentName : t.name, b = t.isChild ? t.name : "", p = e.value.style.chart.tooltip.customFormat;
-      dt(p) && ct(() => p({
+      const o = t.isChild ? t.parentName : t.name, m = t.isChild ? t.name : "", p = e.value.style.chart.tooltip.customFormat;
+      vt(p) && ht(() => p({
         datapoint: t,
         series: z.value,
         config: e.value,
@@ -227,22 +228,22 @@ const Tt = ["id"], Lt = ["onClick"], Pt = ["xmlns", "viewBox"], Nt = ["id"], St
         seriesIndex: l
       }) : (a += `<div style="width:100%;text-align:center;border-bottom:1px solid ${e.value.style.chart.tooltip.borderColor};padding-bottom:6px;margin-bottom:3px;text-align:left;">
                 <div style="display:flex;align-items:center;gap:4px;"><svg viewBox="0 0 12 12" height="14" width="14"><rect x="0" y="0" height="12" width="12" rx="2" stroke="none" fill="${t.color}"/></svg> ${o}</div>
-                ${b ? `<div>${b}</div>` : ""}
+                ${m ? `<div>${m}</div>` : ""}
             </div>`, e.value.style.chart.tooltip.showValue && (a += `<div>${e.value.translations.value}: <b>${ee(
         e.value.style.chart.layout.bars.dataLabels.value.formatter,
         t.sign === 1 ? t.value : -t.value,
-        O({
+        I({
           p: e.value.style.chart.tooltip.prefix,
           v: t.sign === 1 ? t.value : -t.value,
           s: e.value.style.chart.tooltip.suffix,
           r: e.value.style.chart.tooltip.roundingValue
         }),
         { datapoint: t, seriesIndex: l }
-      )}</b></div>`), e.value.style.chart.tooltip.showPercentage && (a += `<div>${e.value.translations.percentageToTotal} : <b>${O({
+      )}</b></div>`), e.value.style.chart.tooltip.showPercentage && (a += `<div>${e.value.translations.percentageToTotal} : <b>${I({
         v: Math.abs(t.value) / L.value * 100,
         s: "%",
         r: e.value.style.chart.tooltip.roundingPercentage
-      })}</b></div>`, t.isChild && (a += `<div>${e.value.translations.percentageToSerie}: <b>${O({
+      })}</b></div>`, t.isChild && (a += `<div>${e.value.translations.percentageToSerie}: <b>${I({
         v: Math.abs(t.value) / Math.abs(t.parentValue) * 100,
         s: "%",
         r: e.value.style.chart.tooltip.roundingPercentage
@@ -251,20 +252,20 @@ const Tt = ["id"], Lt = ["onClick"], Pt = ["xmlns", "viewBox"], Nt = ["id"], St
     function Pe(t, l, a, o) {
       if (!e.value.style.chart.layout.bars.dataLabels.value.show)
         return "";
-      const b = ee(
+      const m = ee(
         e.value.style.chart.layout.bars.dataLabels.value.formatter,
         S(o === -1 && t >= 0 ? -t : t),
-        O({
+        I({
           p: e.value.style.chart.layout.bars.dataLabels.value.prefix,
           v: S(o === -1 && t >= 0 ? -t : t),
           s: e.value.style.chart.layout.bars.dataLabels.value.suffix,
           r: e.value.style.chart.layout.bars.dataLabels.value.roundingValue
         }),
         { datapoint: l, seriesIndex: a }
-      ), p = `(${Le(t, !0, e.value.style.chart.layout.bars.dataLabels.percentage.roundingPercentage)})`;
-      return `${b}${e.value.style.chart.layout.bars.dataLabels.percentage.show ? ` ${p}` : ""}`;
+      ), p = `(${Ne(t, !0, e.value.style.chart.layout.bars.dataLabels.percentage.roundingPercentage)})`;
+      return `${m}${e.value.style.chart.layout.bars.dataLabels.percentage.show ? ` ${p}` : ""}`;
     }
-    const w = m(() => {
+    const w = b(() => {
       const t = [
         e.value.translations.parentName,
         e.value.translations.value,
@@ -303,7 +304,7 @@ const Tt = ["id"], Lt = ["onClick"], Pt = ["xmlns", "viewBox"], Nt = ["id"], St
       });
       return { head: t, body: l };
     });
-    function Ne() {
+    function Se() {
       const t = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [""]], l = w.value.head, a = w.value.body.map((p) => [
         p.parentName,
         p.parentValue,
@@ -312,59 +313,66 @@ const Tt = ["id"], Lt = ["onClick"], Pt = ["xmlns", "viewBox"], Nt = ["id"], St
         p.childValue,
         p.childPercentageToParent,
         p.childPercentageToTotal
-      ]), o = t.concat([l]).concat(a), b = vt(o);
-      ht({ csvContent: b, title: e.value.style.chart.title.text || "vue-ui-vertical-bar" });
+      ]), o = t.concat([l]).concat(a), m = pt(o);
+      gt({ csvContent: m, title: e.value.style.chart.title.text || "vue-ui-vertical-bar" });
     }
     const G = r(!1);
-    function Ke(t) {
+    function Qe(t) {
       G.value = t, ce.value += 1;
     }
-    function Se() {
+    function Ve() {
       $.value.showTable = !$.value.showTable;
     }
-    function Ve() {
+    function ze() {
       $.value.sortDesc = !$.value.sortDesc, J();
     }
-    function ze() {
+    function Fe() {
       $.value.showTooltip = !$.value.showTooltip;
     }
     const Q = r(!1);
     function se() {
       Q.value = !Q.value;
     }
-    return Be({
-      getData: Ye,
+    return De({
+      getData: Ke,
       recalculateHeight: J,
-      generatePdf: be,
-      generateCsv: Ne,
-      generateImage: me,
-      toggleTable: Se,
-      toggleSort: Ve,
-      toggleTooltip: ze,
+      generatePdf: me,
+      generateCsv: Se,
+      generateImage: _e,
+      toggleTable: Ve,
+      toggleSort: ze,
+      toggleTooltip: Fe,
       toggleAnnotator: se
-    }), (t, l) => (u(), d("div", {
+    }), (t, l) => (u(), i("div", {
       class: R(`vue-ui-vertical-bar ${G.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"}`),
       ref_key: "verticalBarChart",
       ref: A,
       id: `vue-ui-vertical-bar_${V.value}`,
-      style: c(`font-family:${e.value.style.fontFamily};width:100%; text-align:center;${e.value.style.chart.title.text ? "" : "padding-top:36px"};background:${e.value.style.chart.backgroundColor};${e.value.responsive ? "height: 100%" : ""}`)
+      style: c(`font-family:${e.value.style.fontFamily};width:100%; text-align:center;background:${e.value.style.chart.backgroundColor};${e.value.responsive ? "height: 100%" : ""}`)
     }, [
-      e.value.userOptions.buttons.annotator ? (u(), M(Ct, {
+      e.value.userOptions.buttons.annotator ? (u(), M(Tt, {
         key: 0,
         parent: A.value,
         backgroundColor: e.value.style.chart.backgroundColor,
         color: e.value.style.chart.color,
         active: Q.value,
         onClose: se
-      }, null, 8, ["parent", "backgroundColor", "color", "active"])) : f("", !0),
-      e.value.style.chart.title.text ? (u(), d("div", {
+      }, null, 8, ["parent", "backgroundColor", "color", "active"])) : g("", !0),
+      Ue.value ? (u(), i("div", {
         key: 1,
+        ref_key: "noTitle",
+        ref: pe,
+        class: "vue-data-ui-no-title-space",
+        style: "height:36px; width: 100%;background:transparent"
+      }, null, 512)) : g("", !0),
+      e.value.style.chart.title.text ? (u(), i("div", {
+        key: 2,
         ref_key: "chartTitle",
         ref: ve,
         style: "width:100%;background:transparent;padding-bottom:12px"
       }, [
-        (u(), M(yt, {
-          key: `title_${pe.value}`,
+        (u(), M(bt, {
+          key: `title_${ge.value}`,
           config: {
             title: {
               cy: "vertical-bar-div-title",
@@ -376,15 +384,15 @@ const Tt = ["id"], Lt = ["onClick"], Pt = ["xmlns", "viewBox"], Nt = ["id"], St
             }
           }
         }, null, 8, ["config"]))
-      ], 512)) : f("", !0),
-      e.value.userOptions.show && Y.value ? (u(), M(bt, {
+      ], 512)) : g("", !0),
+      e.value.userOptions.show && Y.value ? (u(), M(_t, {
         ref_key: "details",
-        ref: Xe,
+        ref: Ee,
         key: `user_options_${ce.value}`,
         backgroundColor: e.value.style.chart.backgroundColor,
         color: e.value.style.chart.color,
-        isImaging: h(fe),
-        isPrinting: h(ye),
+        isImaging: h(be),
+        isPrinting: h(fe),
         uid: V.value,
         hasTooltip: e.value.userOptions.buttons.tooltip && e.value.style.chart.tooltip.show,
         hasPdf: e.value.userOptions.buttons.pdf,
@@ -400,15 +408,15 @@ const Tt = ["id"], Lt = ["onClick"], Pt = ["xmlns", "viewBox"], Nt = ["id"], St
         position: e.value.userOptions.position,
         hasAnnotator: e.value.userOptions.buttons.annotator,
         isAnnotation: Q.value,
-        onToggleFullscreen: Ke,
-        onGeneratePdf: h(be),
-        onGenerateCsv: Ne,
-        onGenerateImage: h(me),
-        onToggleTable: Se,
-        onToggleSort: Ve,
-        onToggleTooltip: ze,
+        onToggleFullscreen: Qe,
+        onGeneratePdf: h(me),
+        onGenerateCsv: Se,
+        onGenerateImage: h(_e),
+        onToggleTable: Ve,
+        onToggleSort: ze,
+        onToggleTooltip: Fe,
         onToggleAnnotator: se
-      }, et({ _: 2 }, [
+      }, at({ _: 2 }, [
         t.$slots.optionTooltip ? {
           name: "optionTooltip",
           fn: k(() => [
@@ -472,47 +480,47 @@ const Tt = ["id"], Lt = ["onClick"], Pt = ["xmlns", "viewBox"], Nt = ["id"], St
           ]),
           key: "8"
         } : void 0
-      ]), 1032, ["backgroundColor", "color", "isImaging", "isPrinting", "uid", "hasTooltip", "hasPdf", "hasImg", "hasXls", "hasTable", "hasSort", "hasFullscreen", "isFullscreen", "isTooltip", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "onGeneratePdf", "onGenerateImage"])) : f("", !0),
-      e.value.style.chart.legend.show && e.value.style.chart.legend.position === "top" ? (u(), d("div", {
-        key: 3,
+      ]), 1032, ["backgroundColor", "color", "isImaging", "isPrinting", "uid", "hasTooltip", "hasPdf", "hasImg", "hasXls", "hasTable", "hasSort", "hasFullscreen", "isFullscreen", "isTooltip", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "onGeneratePdf", "onGenerateImage"])) : g("", !0),
+      e.value.style.chart.legend.show && e.value.style.chart.legend.position === "top" ? (u(), i("div", {
+        key: 4,
         ref_key: "chartLegend",
         ref: le
       }, [
         (u(), M(Ie, {
           key: `legend_top_${oe.value}`,
           legendSet: z.value,
-          config: we.value,
+          config: Te.value,
           onClickMarker: l[0] || (l[0] = ({ legend: a }) => X(a.id))
         }, {
           item: k(({ legend: a, index: o }) => [
             n("div", {
               "data-cy-legend-item": "",
-              onClick: (b) => X(a.id),
+              onClick: (m) => X(a.id),
               style: c(`opacity:${T.value.includes(a.id) ? 0.5 : 1}`)
-            }, i(a.name) + ": " + i(h(ee)(
+            }, d(a.name) + ": " + d(h(ee)(
               e.value.style.chart.layout.bars.dataLabels.value.formatter,
               a.value,
-              h(O)({
+              h(I)({
                 p: e.value.style.chart.legend.prefix,
                 v: a.value,
                 s: e.value.style.chart.legend.suffix,
                 r: e.value.style.chart.legend.roundingValue
               }),
               { datapoint: a, seriesIndex: o }
-            )), 13, Lt)
+            )), 13, Pt)
           ]),
           _: 1
         }, 8, ["legendSet", "config"]))
-      ], 512)) : f("", !0),
-      Y.value ? (u(), d("svg", {
-        key: 4,
-        xmlns: h(rt),
+      ], 512)) : g("", !0),
+      Y.value ? (u(), i("svg", {
+        key: 5,
+        xmlns: h(dt),
         class: R({ "vue-data-ui-fullscreen--on": G.value, "vue-data-ui-fulscreen--off": !G.value }),
-        viewBox: `0 0 ${y.value.width <= 0 ? 10 : y.value.width} ${s.value.fullHeight <= 0 ? 10 : s.value.fullHeight}`,
+        viewBox: `0 0 ${f.value.width <= 0 ? 10 : f.value.width} ${s.value.fullHeight <= 0 ? 10 : s.value.fullHeight}`,
         style: c(`max-width:100%;overflow:visible;background:transparent;color:${e.value.style.chart.color}`)
       }, [
-        re($t),
-        (u(!0), d(W, null, j(B.value, (a, o) => (u(), d("linearGradient", {
+        re(wt),
+        (u(!0), i(W, null, j(B.value, (a, o) => (u(), i("linearGradient", {
           x1: "0%",
           y1: "0%",
           x2: "100%",
@@ -522,46 +530,46 @@ const Tt = ["id"], Lt = ["onClick"], Pt = ["xmlns", "viewBox"], Nt = ["id"], St
           n("stop", {
             offset: "0%",
             "stop-color": a.color
-          }, null, 8, St),
+          }, null, 8, zt),
           n("stop", {
             offset: "100%",
-            "stop-color": h(de)(h(it)(a.color, 0.03), 100 - e.value.style.chart.layout.bars.gradientIntensity)
-          }, null, 8, Vt)
-        ], 8, Nt))), 256)),
-        (u(!0), d(W, null, j(B.value, (a, o) => (u(), d("g", null, [
+            "stop-color": h(de)(h(ct)(a.color, 0.03), 100 - e.value.style.chart.layout.bars.gradientIntensity)
+          }, null, 8, Ft)
+        ], 8, Vt))), 256)),
+        (u(!0), i(W, null, j(B.value, (a, o) => (u(), i("g", null, [
           n("rect", {
-            x: h(S)(D.value ? s.value.left + s.value.width / 2 - (a.sign === 1 ? 0 : N(a.value) <= 0 ? 1e-4 : N(a.value)) : s.value.left),
-            y: s.value.top + (g.value + v.value) * o,
-            width: h(S)(N(a.value) <= 0 ? 1e-4 : N(a.value)),
+            x: h(S)(D.value ? s.value.left + s.value.width / 2 - (a.sign === 1 ? 0 : P(a.value) <= 0 ? 1e-4 : P(a.value)) : s.value.left),
+            y: s.value.top + (y.value + v.value) * o,
+            width: h(S)(P(a.value) <= 0 ? 1e-4 : P(a.value)),
             height: v.value <= 0 ? 1e-4 : v.value,
             fill: e.value.style.chart.layout.bars.underlayerColor,
             rx: e.value.style.chart.layout.bars.borderRadius,
             class: R({ animated: e.value.useCssAnimation })
-          }, null, 10, zt)
+          }, null, 10, Mt)
         ]))), 256)),
-        (u(!0), d(W, null, j(B.value, (a, o) => (u(), d("g", null, [
+        (u(!0), i(W, null, j(B.value, (a, o) => (u(), i("g", null, [
           n("rect", {
-            x: h(S)(D.value ? s.value.left + s.value.width / 2 - (a.sign === 1 ? 0 : N(a.value) <= 0 ? 1e-4 : N(a.value)) : s.value.left),
-            y: s.value.top + (g.value + v.value) * o,
-            width: h(S)(N(a.value) <= 0 ? 1e-4 : N(a.value)),
+            x: h(S)(D.value ? s.value.left + s.value.width / 2 - (a.sign === 1 ? 0 : P(a.value) <= 0 ? 1e-4 : P(a.value)) : s.value.left),
+            y: s.value.top + (y.value + v.value) * o,
+            width: h(S)(P(a.value) <= 0 ? 1e-4 : P(a.value)),
             height: v.value <= 0 ? 1e-4 : v.value,
             fill: e.value.style.chart.layout.bars.useGradient ? `url(#vertical_bar_gradient_${V.value}_${o})` : h(de)(a.color, e.value.style.chart.layout.bars.fillOpacity),
             rx: e.value.style.chart.layout.bars.borderRadius,
             stroke: e.value.style.chart.layout.bars.useStroke ? a.color : "none",
             "stroke-width": e.value.style.chart.layout.bars.useStroke ? e.value.style.chart.layout.bars.strokeWidth : 0,
             class: R({ animated: e.value.useCssAnimation })
-          }, null, 10, Ft),
-          (!a.isChild || a.isLastChild) && e.value.style.chart.layout.separators.show && o !== B.value.length - 1 ? (u(), d("line", {
+          }, null, 10, Ot),
+          (!a.isChild || a.isLastChild) && e.value.style.chart.layout.separators.show && o !== B.value.length - 1 ? (u(), i("line", {
             key: 0,
             x1: 0,
             x2: s.value.left,
-            y1: v.value + g.value / 2 + s.value.top + (g.value + v.value) * o,
-            y2: v.value + g.value / 2 + s.value.top + (g.value + v.value) * o,
+            y1: v.value + y.value / 2 + s.value.top + (y.value + v.value) * o,
+            y2: v.value + y.value / 2 + s.value.top + (y.value + v.value) * o,
             stroke: e.value.style.chart.layout.separators.color,
             "stroke-width": e.value.style.chart.layout.separators.strokeWidth,
             "stroke-linecap": "round"
-          }, null, 8, Mt)) : f("", !0),
-          D.value && e.value.style.chart.layout.separators.show ? (u(), d("line", {
+          }, null, 8, It)) : g("", !0),
+          D.value && e.value.style.chart.layout.separators.show ? (u(), i("line", {
             key: 1,
             x1: s.value.left + s.value.width / 2,
             x2: s.value.left + s.value.width / 2,
@@ -570,25 +578,25 @@ const Tt = ["id"], Lt = ["onClick"], Pt = ["xmlns", "viewBox"], Nt = ["id"], St
             stroke: e.value.style.chart.layout.separators.color,
             "stroke-width": e.value.style.chart.layout.separators.strokeWidth,
             "stroke-linecap": "round"
-          }, null, 8, It)) : f("", !0),
+          }, null, 8, At)) : g("", !0),
           n("text", {
-            x: D.value ? s.value.left + s.value.width / 2 + (a.sign === 1 ? -12 : 12) + (a.sign === 1 ? -e.value.style.chart.layout.bars.dataLabels.offsetX : e.value.style.chart.layout.bars.dataLabels.offsetX) : je(a.value) + 3 + e.value.style.chart.layout.bars.dataLabels.offsetX,
-            y: s.value.top + (g.value + v.value) * o + v.value / 2 + e.value.style.chart.layout.bars.dataLabels.fontSize / 2,
+            x: D.value ? s.value.left + s.value.width / 2 + (a.sign === 1 ? -12 : 12) + (a.sign === 1 ? -e.value.style.chart.layout.bars.dataLabels.offsetX : e.value.style.chart.layout.bars.dataLabels.offsetX) : qe(a.value) + 3 + e.value.style.chart.layout.bars.dataLabels.offsetX,
+            y: s.value.top + (y.value + v.value) * o + v.value / 2 + e.value.style.chart.layout.bars.dataLabels.fontSize / 2,
             "text-anchor": !D.value || a.sign === -1 ? "start" : "end",
             "font-size": e.value.style.chart.layout.bars.dataLabels.fontSize,
             fill: e.value.style.chart.layout.bars.dataLabels.color,
             "font-weight": e.value.style.chart.layout.bars.dataLabels.bold ? "bold" : "normal"
-          }, i(Pe(a.value, a, o, a.sign)), 9, Ot),
-          (a.isChild || !a.hasChildren) && e.value.style.chart.layout.bars.nameLabels.show ? (u(), d("text", {
+          }, d(Pe(a.value, a, o, a.sign)), 9, Bt),
+          (a.isChild || !a.hasChildren) && e.value.style.chart.layout.bars.nameLabels.show ? (u(), i("text", {
             key: 2,
             "text-anchor": "end",
             x: s.value.left - 3 + e.value.style.chart.layout.bars.nameLabels.offsetX,
-            y: s.value.top + (g.value + v.value) * o + v.value / 2 + e.value.style.chart.layout.bars.nameLabels.fontSize / 2,
+            y: s.value.top + (y.value + v.value) * o + v.value / 2 + e.value.style.chart.layout.bars.nameLabels.fontSize / 2,
             "font-size": e.value.style.chart.layout.bars.nameLabels.fontSize,
             fill: e.value.style.chart.layout.bars.nameLabels.color,
             "font-weight": e.value.style.chart.layout.bars.nameLabels.bold ? "bold" : "normal"
-          }, i(a.name), 9, At)) : f("", !0),
-          a.isChild && a.childIndex === 0 && e.value.style.chart.layout.bars.parentLabels.show ? (u(), d("text", {
+          }, d(a.name), 9, Dt)) : g("", !0),
+          a.isChild && a.childIndex === 0 && e.value.style.chart.layout.bars.parentLabels.show ? (u(), i("text", {
             key: 3,
             x: 3 + e.value.style.chart.layout.bars.parentLabels.offsetX,
             y: E(a, o).y,
@@ -596,8 +604,8 @@ const Tt = ["id"], Lt = ["onClick"], Pt = ["xmlns", "viewBox"], Nt = ["id"], St
             fill: e.value.style.chart.layout.bars.parentLabels.color,
             "font-weight": e.value.style.chart.layout.bars.parentLabels.bold ? "bold" : "normal",
             "text-anchor": "start"
-          }, i(E(a, o).name), 9, Bt)) : f("", !0),
-          a.isChild && a.childIndex === 0 && e.value.style.chart.layout.bars.parentLabels.show ? (u(), d("text", {
+          }, d(E(a, o).name), 9, Rt)) : g("", !0),
+          a.isChild && a.childIndex === 0 && e.value.style.chart.layout.bars.parentLabels.show ? (u(), i("text", {
             key: 4,
             x: 3 + e.value.style.chart.layout.bars.parentLabels.offsetX,
             y: E(a, o).y + e.value.style.chart.layout.bars.parentLabels.fontSize + 6,
@@ -605,27 +613,27 @@ const Tt = ["id"], Lt = ["onClick"], Pt = ["xmlns", "viewBox"], Nt = ["id"], St
             fill: e.value.style.chart.layout.bars.parentLabels.color,
             "font-weight": e.value.style.chart.layout.bars.dataLabels.bold ? "bold" : "normal",
             "text-anchor": "start"
-          }, i(Pe(E(a, o).value), E(a, o), o, a.parentSign || a.sign), 9, Dt)) : f("", !0),
+          }, d(Pe(E(a, o).value), E(a, o), o, a.parentSign || a.sign), 9, Xt)) : g("", !0),
           n("rect", {
             "data-cy-trap": "",
             x: 0,
-            y: s.value.top + (g.value + v.value) * o - g.value / 2,
-            width: y.value.width <= 0 ? 1e-4 : y.value.width,
-            height: v.value + g.value <= 0 ? 1e-4 : v.value + g.value,
+            y: s.value.top + (y.value + v.value) * o - y.value / 2,
+            width: f.value.width <= 0 ? 1e-4 : f.value.width,
+            height: v.value + y.value <= 0 ? 1e-4 : v.value + y.value,
             fill: ne.value === a.id ? h(de)(e.value.style.chart.layout.highlighter.color, e.value.style.chart.layout.highlighter.opacity) : "transparent",
-            onMouseenter: (b) => qe(a, o),
-            onMouseleave: l[1] || (l[1] = (b) => {
-              Ee.value = null, te.value = !1, ne.value = null;
+            onMouseenter: (m) => Je(a, o),
+            onMouseleave: l[1] || (l[1] = (m) => {
+              Ge.value = null, te.value = !1, ne.value = null;
             })
-          }, null, 40, Rt)
+          }, null, 40, Et)
         ]))), 256)),
-        _(t.$slots, "svg", { svg: y.value }, void 0, !0)
-      ], 14, Pt)) : f("", !0),
-      t.$slots.watermark ? (u(), d("div", Xt, [
-        _(t.$slots, "watermark", U(H({ isPrinting: h(ye) || h(fe) })), void 0, !0)
-      ])) : f("", !0),
-      Y.value ? f("", !0) : (u(), M(_t, {
-        key: 6,
+        _(t.$slots, "svg", { svg: f.value }, void 0, !0)
+      ], 14, St)) : g("", !0),
+      t.$slots.watermark ? (u(), i("div", Gt, [
+        _(t.$slots, "watermark", U(H({ isPrinting: h(fe) || h(be) })), void 0, !0)
+      ])) : g("", !0),
+      Y.value ? g("", !0) : (u(), M(xt, {
+        key: 7,
         config: {
           type: "verticalBar",
           style: {
@@ -639,46 +647,46 @@ const Tt = ["id"], Lt = ["onClick"], Pt = ["xmlns", "viewBox"], Nt = ["id"], St
           }
         }
       }, null, 8, ["config"])),
-      e.value.style.chart.legend.show && e.value.style.chart.legend.position === "bottom" ? (u(), d("div", {
-        key: 7,
+      e.value.style.chart.legend.show && e.value.style.chart.legend.position === "bottom" ? (u(), i("div", {
+        key: 8,
         ref_key: "chartLegend",
         ref: le
       }, [
         (u(), M(Ie, {
           key: `legend_bottom_${oe.value}`,
           legendSet: z.value,
-          config: we.value,
+          config: Te.value,
           onClickMarker: l[2] || (l[2] = ({ legend: a }) => X(a.id))
         }, {
           item: k(({ legend: a, index: o }) => [
             n("div", {
-              onClick: (b) => X(a.id),
+              onClick: (m) => X(a.id),
               style: c(`opacity:${T.value.includes(a.id) ? 0.5 : 1}`)
-            }, i(a.name) + ": " + i(h(ee)(
+            }, d(a.name) + ": " + d(h(ee)(
               e.value.style.chart.layout.bars.dataLabels.value.formatter,
               a.value,
-              h(O)({
+              h(I)({
                 p: e.value.style.chart.legend.prefix,
                 v: a.value,
                 s: e.value.style.chart.legend.suffix,
                 r: e.value.style.chart.legend.roundingValue
               }),
               { datapoint: a, seriesIndex: o }
-            )), 13, Et)
+            )), 13, Ut)
           ]),
           _: 1
         }, 8, ["legendSet", "config"]))
-      ], 512)) : f("", !0),
+      ], 512)) : g("", !0),
       _(t.$slots, "legend", { legend: z.value }, void 0, !0),
-      t.$slots.source ? (u(), d("div", {
-        key: 8,
+      t.$slots.source ? (u(), i("div", {
+        key: 9,
         ref_key: "source",
         ref: he,
         dir: "auto"
       }, [
         _(t.$slots, "source", {}, void 0, !0)
-      ], 512)) : f("", !0),
-      re(mt, {
+      ], 512)) : g("", !0),
+      re(kt, {
         show: $.value.showTooltip && te.value && T.value.length < C.dataset.length,
         backgroundColor: e.value.style.chart.tooltip.backgroundColor,
         color: e.value.style.chart.tooltip.color,
@@ -701,8 +709,8 @@ const Tt = ["id"], Lt = ["onClick"], Pt = ["xmlns", "viewBox"], Nt = ["id"], St
         ]),
         _: 3
       }, 8, ["show", "backgroundColor", "color", "borderRadius", "borderColor", "borderWidth", "fontSize", "backgroundOpacity", "position", "offsetY", "parent", "content", "isCustom"]),
-      Y.value ? (u(), M(xt, {
-        key: 9,
+      Y.value ? (u(), M(Ct, {
+        key: 10,
         hideDetails: "",
         config: {
           open: $.value.showTable,
@@ -720,18 +728,18 @@ const Tt = ["id"], Lt = ["onClick"], Pt = ["xmlns", "viewBox"], Nt = ["id"], St
         content: k(() => [
           n("div", {
             ref_key: "tableContainer",
-            ref: ke,
+            ref: xe,
             class: "vue-ui-vertical-bar-table"
           }, [
-            n("div", Gt, [
+            n("div", Ht, [
               n("div", {
                 role: "button",
                 tabindex: "0",
                 style: c(`width:32px; position: absolute; top: 0; right:4px; padding: 0 0px; display: flex; align-items:center;justify-content:center;height: 36px; width: 32px; cursor:pointer; background:${e.value.table.th.backgroundColor};`),
                 onClick: l[3] || (l[3] = (a) => $.value.showTable = !1),
-                onKeypress: l[4] || (l[4] = tt((a) => $.value.showTable = !1, ["enter"]))
+                onKeypress: l[4] || (l[4] = lt((a) => $.value.showTable = !1, ["enter"]))
               }, [
-                re(kt, {
+                re($t, {
                   name: "close",
                   stroke: e.value.table.th.color,
                   "stroke-width": 2
@@ -739,25 +747,25 @@ const Tt = ["id"], Lt = ["onClick"], Pt = ["xmlns", "viewBox"], Nt = ["id"], St
               ], 36),
               n("div", {
                 style: { width: "100%", "container-type": "inline-size" },
-                class: R({ "vue-ui-responsive": xe.value })
+                class: R({ "vue-ui-responsive": $e.value })
               }, [
-                n("table", Ut, [
+                n("table", Wt, [
                   n("caption", {
                     style: c({ backgroundColor: e.value.table.th.backgroundColor, color: e.value.table.th.color, outline: e.value.table.th.outline }),
                     class: "vue-ui-data-table__caption"
                   }, [
-                    at(i(e.value.style.chart.title.text) + " ", 1),
-                    e.value.style.chart.title.subtitle.text ? (u(), d("span", Ht, i(e.value.style.chart.title.subtitle.text), 1)) : f("", !0)
+                    ot(d(e.value.style.chart.title.text) + " ", 1),
+                    e.value.style.chart.title.subtitle.text ? (u(), i("span", jt, d(e.value.style.chart.title.subtitle.text), 1)) : g("", !0)
                   ], 4),
                   n("thead", null, [
                     n("tr", {
                       role: "row",
                       style: c(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color}`)
                     }, [
-                      (u(!0), d(W, null, j(w.value.head, (a) => (u(), d("th", {
+                      (u(!0), i(W, null, j(w.value.head, (a) => (u(), i("th", {
                         style: c(`outline:${e.value.table.th.outline}`)
                       }, [
-                        n("div", Wt, i(a), 1)
+                        n("div", Yt, d(a), 1)
                       ], 4))), 256))
                     ], 4),
                     n("tr", null, [
@@ -766,7 +774,7 @@ const Tt = ["id"], Lt = ["onClick"], Pt = ["xmlns", "viewBox"], Nt = ["id"], St
                       }, null, 4),
                       n("th", {
                         style: c(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color};outline:${e.value.table.th.outline};text-align:right;padding-right:5px;font-weight:bold`)
-                      }, "∑ " + i(e.value.table.td.prefix) + i(isNaN(L.value) ? "" : L.value.toFixed(e.value.table.td.roundingValue)) + i(e.value.table.td.suffix), 5),
+                      }, "∑ " + d(e.value.table.td.prefix) + d(isNaN(L.value) ? "" : L.value.toFixed(e.value.table.td.roundingValue)) + d(e.value.table.td.suffix), 5),
                       n("th", {
                         style: c(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color};outline:${e.value.table.th.outline};text-align:right;padding-right:5px;font-weight:bold`)
                       }, "100%", 4),
@@ -785,7 +793,7 @@ const Tt = ["id"], Lt = ["onClick"], Pt = ["xmlns", "viewBox"], Nt = ["id"], St
                     ])
                   ]),
                   n("tbody", null, [
-                    (u(!0), d(W, null, j(w.value.body, (a, o) => (u(), d("tr", {
+                    (u(!0), i(W, null, j(w.value.body, (a, o) => (u(), i("tr", {
                       class: R({ "vue-ui-data-table__tbody__row": !0, "vue-ui-data-table__tbody__row-even": o % 2 === 0, "vue-ui-data-table__tbody__row-odd": o % 2 !== 0 }),
                       style: c(`background:${e.value.table.td.backgroundColor};color:${e.value.table.td.color}`)
                     }, [
@@ -794,56 +802,56 @@ const Tt = ["id"], Lt = ["onClick"], Pt = ["xmlns", "viewBox"], Nt = ["id"], St
                         style: c(`outline:${e.value.table.td.outline};font-variant-numeric: tabular-nums;`),
                         "data-cell": w.value.head[0] ?? ""
                       }, [
-                        n("div", Yt, [
-                          a.color ? (u(), d("span", {
+                        n("div", Kt, [
+                          a.color ? (u(), i("span", {
                             key: 0,
                             style: c(`color:${a.color};margin-right:3px`)
-                          }, "⬤", 4)) : f("", !0),
-                          n("span", null, i(a.parentName), 1)
+                          }, "⬤", 4)) : g("", !0),
+                          n("span", null, d(a.parentName), 1)
                         ])
-                      ], 12, jt),
+                      ], 12, qt),
                       n("td", {
                         class: "vue-ui-data-table__tbody__td",
                         style: c(`outline:${e.value.table.td.outline}`),
                         "data-cell": w.value.head[1] ?? ""
                       }, [
-                        n("div", Kt, i(e.value.table.td.prefix) + i(["", NaN, void 0].includes(a.parentValue) ? "" : a.parentValue.toFixed(e.value.table.td.roundingValue)) + i(e.value.table.td.suffix), 1)
-                      ], 12, qt),
+                        n("div", Qt, d(e.value.table.td.prefix) + d(["", NaN, void 0].includes(a.parentValue) ? "" : a.parentValue.toFixed(e.value.table.td.roundingValue)) + d(e.value.table.td.suffix), 1)
+                      ], 12, Jt),
                       n("td", {
                         class: "vue-ui-data-table__tbody__td",
                         style: c(`outline:${e.value.table.td.outline}`),
                         "data-cell": w.value.head[2] ?? ""
                       }, [
-                        n("div", Qt, i(["", NaN, void 0].includes(a.percentageToTotal) ? "" : `${(a.percentageToTotal * 100).toFixed(e.value.table.td.roundingPercentage)}%`), 1)
-                      ], 12, Jt),
+                        n("div", ea, d(["", NaN, void 0].includes(a.percentageToTotal) ? "" : `${(a.percentageToTotal * 100).toFixed(e.value.table.td.roundingPercentage)}%`), 1)
+                      ], 12, Zt),
                       n("td", {
                         class: "vue-ui-data-table__tbody__td",
                         style: c(`outline:${e.value.table.td.outline}`),
                         "data-cell": w.value.head[3] ?? ""
                       }, [
-                        n("div", ea, i(a.childName), 1)
-                      ], 12, Zt),
+                        n("div", aa, d(a.childName), 1)
+                      ], 12, ta),
                       n("td", {
                         class: "vue-ui-data-table__tbody__td",
                         style: c(`outline:${e.value.table.td.outline}`),
                         "data-cell": w.value.head[4] ?? ""
                       }, [
-                        n("div", aa, i(e.value.table.td.prefix) + i(["", NaN, void 0].includes(a.childValue) ? "" : a.childValue.toFixed(e.value.table.td.roundingValue)) + i(e.value.table.td.suffix), 1)
-                      ], 12, ta),
+                        n("div", oa, d(e.value.table.td.prefix) + d(["", NaN, void 0].includes(a.childValue) ? "" : a.childValue.toFixed(e.value.table.td.roundingValue)) + d(e.value.table.td.suffix), 1)
+                      ], 12, la),
                       n("td", {
                         class: "vue-ui-data-table__tbody__td",
                         style: c(`outline:${e.value.table.td.outline}`),
                         "data-cell": w.value.head[5] ?? ""
                       }, [
-                        n("div", oa, i(["", NaN, void 0].includes(a.childPercentageToParent) ? "" : `${(a.childPercentageToParent * 100).toFixed(e.value.table.td.roundingPercentage)}%`), 1)
-                      ], 12, la),
+                        n("div", ua, d(["", NaN, void 0].includes(a.childPercentageToParent) ? "" : `${(a.childPercentageToParent * 100).toFixed(e.value.table.td.roundingPercentage)}%`), 1)
+                      ], 12, na),
                       n("td", {
                         class: "vue-ui-data-table__tbody__td",
                         style: c(`outline:${e.value.table.td.outline}`),
                         "data-cell": w.value.head[6] ?? ""
                       }, [
-                        n("div", ua, i(["", NaN, void 0].includes(a.childPercentageToTotal) ? "" : `${(a.childPercentageToTotal * 100).toFixed(e.value.table.td.roundingPercentage)}%`), 1)
-                      ], 12, na)
+                        n("div", ra, d(["", NaN, void 0].includes(a.childPercentageToTotal) ? "" : `${(a.childPercentageToTotal * 100).toFixed(e.value.table.td.roundingPercentage)}%`), 1)
+                      ], 12, sa)
                     ], 6))), 256))
                   ])
                 ])
@@ -852,10 +860,10 @@ const Tt = ["id"], Lt = ["onClick"], Pt = ["xmlns", "viewBox"], Nt = ["id"], St
           ], 512)
         ]),
         _: 1
-      }, 8, ["config"])) : f("", !0)
-    ], 14, Tt));
+      }, 8, ["config"])) : g("", !0)
+    ], 14, Nt));
   }
-}, xa = /* @__PURE__ */ wt(sa, [["__scopeId", "data-v-b74689e6"]]);
+}, Ca = /* @__PURE__ */ Lt(ia, [["__scopeId", "data-v-0976c0bc"]]);
 export {
-  xa as default
+  Ca as default
 };