vue-data-ui 3.16.0 → 3.16.2

package/dist/{vue-ui-horizontal-bar-FKkR13e7.js → vue-ui-horizontal-bar-B58pqRYq.js}

@@ -1,25 +1,25 @@
-import { useCssVars as Na, defineAsyncComponent as ne, useSlots as Ia, computed as h, ref as v, toRefs as Va, watch as ue, onBeforeUnmount as Oa, onMounted as Ge, openBlock as n, createElementBlock as s, unref as r, normalizeStyle as b, normalizeClass as ee, createElementVNode as u, toDisplayString as m, createBlock as H, createCommentVNode as p, withCtx as f, renderSlot as y, normalizeProps as O, guardReactiveProps as F, createSlots as we, createVNode as se, Fragment as B, renderList as D, mergeProps as Ot, resolveDynamicComponent as Fa, withKeys as Ma, createTextVNode as Ft, nextTick as _e } from "vue";
-import { j as Ba, t as Mt, m as Da, p as te, $ as Ke, n as Ea, q as he, o as je, K as N, s as Ye, k as pe, l as M, X as Ra, u as qe, v as Xa, Z as Ze, aq as Ha, a0 as Ua, a1 as Wa, T as Ga, U as Ka, a3 as ja } from "./lib-DBptbyyI.js";
+import { useCssVars as Na, defineAsyncComponent as se, useSlots as Ia, computed as h, ref as v, toRefs as Va, watch as re, onBeforeUnmount as Oa, onMounted as qe, openBlock as n, createElementBlock as r, unref as i, normalizeStyle as b, normalizeClass as te, createElementVNode as s, toDisplayString as k, createBlock as H, createCommentVNode as p, withCtx as f, renderSlot as y, normalizeProps as O, guardReactiveProps as F, createSlots as Te, createVNode as ie, Fragment as D, renderList as B, mergeProps as Ot, resolveDynamicComponent as Fa, withKeys as Ma, createTextVNode as Ft, nextTick as Le } from "vue";
+import { j as Da, t as Mt, m as Ba, p as ae, $ as Ze, n as Ea, q as ye, o as Je, K as N, s as Qe, k as ge, l as M, X as Ra, u as et, v as Xa, Z as tt, aq as Ha, a0 as Ua, a1 as Wa, T as Ga, U as Ka, a3 as ja } from "./lib-DBptbyyI.js";
 import { t as Ya, u as qa } from "./useResponsive-DfdjqQps.js";
 import { u as Za } from "./useConfig-DO94Aj5s.js";
 import { u as Ja, B as Qa } from "./BaseScanner-BhhkKVoj.js";
 import { u as el } from "./usePrinter-CEpYU3r5.js";
 import { u as tl } from "./useSvgExport-ByUukOZt.js";
-import { u as Je } from "./useNestedProp-Bf5XFbs8.js";
+import { u as at } from "./useNestedProp-Bf5XFbs8.js";
 import { u as al } from "./useThemeCheck-D1ZYXUwG.js";
 import { u as ll } from "./useTableResponsive-Cbx-ACcP.js";
 import { u as ol } from "./useUserOptionState-BIvW1Kz7.js";
 import { u as nl } from "./useChartAccessibility-9icAAmYg.js";
 import ul from "./img-LXxMLmCg.js";
-import { _ as Bt } from "./Shape-BKRUOeKk.js";
+import { _ as Dt } from "./Shape-BKRUOeKk.js";
 import sl from "./Title-BeMKE1cj.js";
 import rl from "./vue_ui_horizontal_bar-BEagrV0T.js";
-import Dt from "./Legend-CS7Xo5LK.js";
+import Bt from "./Legend-CS7Xo5LK.js";
 import il from "./vue-ui-accordion-nvggWcGN.js";
 import { B as Et } from "./BaseLegendToggle-BQVIawmA.js";
 import { A as vl } from "./A11yDataTable-KcVAX2cP.js";
 import { _ as cl } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "relative" } }, yl = ["xmlns", "viewBox", "aria-describedby"], gl = ["width", "height"], bl = ["id"], ml = ["stop-color"], kl = ["stop-color"], Cl = { key: 1 }, xl = ["y", "width", "height", "fill", "rx"], wl = ["x", "y", "width", "height", "fill", "rx"], _l = ["x", "y", "width", "height", "fill", "rx", "stroke", "stroke-width"], $l = ["x", "y", "width", "height", "fill", "rx", "stroke", "stroke-width"], Tl = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Ll = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Sl = { class: "vue-ui-horizontal-bar-parent-label" }, Pl = ["y", "height", "width", "fill"], Al = ["y", "font-size", "fill", "x", "font-weight", "innerHTML"], zl = ["y", "font-size", "fill", "x", "font-weight"], Nl = { class: "vue-ui-horizontal-bar-child-label" }, Il = ["x", "y", "font-size", "font-weight", "innerHTML"], Vl = { class: "vue-ui-horizontal-bar-child-label" }, Ol = ["x", "y", "font-size", "fill", "font-weight", "innerHTML"], Fl = { class: "vue-ui-horizontal-bar-child-label" }, Ml = ["x", "y", "text-anchor", "font-size", "fill", "font-weight"], Bl = ["y", "width", "height", "fill", "onMouseenter", "onMouseleave", "onClick"], Dl = {
+const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "relative" } }, yl = ["xmlns", "viewBox", "aria-describedby"], gl = ["width", "height"], bl = ["id"], ml = ["stop-color"], kl = ["stop-color"], Cl = { key: 1 }, xl = ["y", "width", "height", "fill", "rx"], wl = ["x", "y", "width", "height", "fill", "rx"], _l = ["x", "y", "width", "height", "fill", "rx", "stroke", "stroke-width"], $l = ["x", "y", "width", "height", "fill", "rx", "stroke", "stroke-width"], Tl = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Ll = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Sl = { class: "vue-ui-horizontal-bar-parent-label" }, Pl = ["y", "height", "width", "fill"], Al = ["y", "font-size", "fill", "x", "font-weight", "innerHTML"], zl = ["y", "font-size", "fill", "x", "font-weight"], Nl = { class: "vue-ui-horizontal-bar-child-label" }, Il = ["x", "y", "font-size", "font-weight", "innerHTML"], Vl = { class: "vue-ui-horizontal-bar-child-label" }, Ol = ["x", "y", "font-size", "fill", "font-weight", "innerHTML"], Fl = { class: "vue-ui-horizontal-bar-child-label" }, Ml = ["x", "y", "text-anchor", "font-size", "fill", "font-weight"], Dl = ["y", "width", "height", "fill", "onMouseenter", "onMouseleave", "onClick"], Bl = {
   key: 0,
   style: { position: "absolute", top: "100%", left: "0", width: "100%" },
   "data-dom-to-png-ignore": "",
@@ -43,19 +43,19 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
       }
     }
   },
-  emits: ["selectLegend", "copyAlt"],
+  emits: ["selectLegend", "copyAlt", "selectDatapoint"],
   setup(Rt, { expose: Xt, emit: Ht }) {
     Na((t) => ({
-      e37a108e: t.tdo
+      v5b6931d5: t.tdo
     }));
-    const Ut = ne(() => import("./Tooltip-Bf-kM3_A.js")), Qe = ne(() => import("./BaseIcon-Cb3zzG6s.js")), Wt = ne(() => import("./PenAndPaper-DARlvvKW.js")), Gt = ne(() => import("./UserOptions-DWHf8jyO.js")), Kt = ne(() => import("./PackageVersion-IIGK_e2C.js")), jt = ne(() => import("./BaseDraggableDialog-CIb-iD9g.js")), { vue_ui_vertical_bar: Yt } = Za(), { isThemeValid: qt, warnInvalidTheme: Zt } = al(), Jt = Ia(), C = Rt, $e = h({
+    const Ut = se(() => import("./Tooltip-Bf-kM3_A.js")), lt = se(() => import("./BaseIcon-Cb3zzG6s.js")), Wt = se(() => import("./PenAndPaper-Ct3qJ4lA.js")), Gt = se(() => import("./UserOptions-rW2fRf3V.js")), Kt = se(() => import("./PackageVersion-C4NWSOC8.js")), jt = se(() => import("./BaseDraggableDialog-CIb-iD9g.js")), { vue_ui_vertical_bar: Yt } = Za(), { isThemeValid: qt, warnInvalidTheme: Zt } = al(), Jt = Ia(), C = Rt, Se = h({
       get() {
         return !!C.dataset && C.dataset.length;
       },
       set(t) {
         return t;
       }
-    }), S = v(Ba()), fe = v(!1), Te = v(""), et = v(null), tt = v(0), R = v(null), at = v(null), Le = v(null), lt = v(null), ot = v(null), nt = v(0), Se = v(0), Qt = v(null), re = v(null), Pe = v(null), ea = v(null), Ae = v(null), w = v([]), ta = v({ none: 0, asc: 1, desc: 2 }), G = v(0), ye = v(!1), ie = v(0), ae = v(0), ze = v(null), ge = v(!1), be = v(!1), z = v(null), ut = v({ x: 0, y: 0 }), Ne = v("pointer"), st = Ht, e = v(Oe()), Y = h(() => e.value.userOptions.useCursorPointer), aa = h(() => {
+    }), S = v(Da()), be = v(!1), Pe = v(""), me = v(null), ot = v(0), R = v(null), nt = v(null), Ae = v(null), ut = v(null), st = v(null), rt = v(0), ze = v(0), Qt = v(null), ve = v(null), Ne = v(null), ea = v(null), Ie = v(null), _ = v([]), ta = v({ none: 0, asc: 1, desc: 2 }), G = v(0), ke = v(!1), ce = v(0), le = v(0), Ve = v(null), Ce = v(!1), xe = v(!1), z = v(null), it = v({ x: 0, y: 0 }), Oe = v("pointer"), Fe = Ht, e = v(Be()), Y = h(() => e.value.userOptions.useCursorPointer), aa = h(() => {
       const t = [
         { name: "", value: 6, color: "#d9d9d9" },
         { name: "", value: 5, color: "#d9d9d9" },
@@ -97,13 +97,13 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
         }
       },
       userConfig: e.value.skeletonConfig ?? {}
-    })), { loading: me, FINAL_DATASET: rt, manualLoading: Ie } = Ja({
+    })), { loading: we, FINAL_DATASET: vt, manualLoading: Me } = Ja({
       ...Va(C),
       FINAL_CONFIG: e,
-      prepareConfig: Oe,
+      prepareConfig: Be,
       callback: () => {
         Promise.resolve().then(async () => {
-          $.value.showTable = e.value.table.show, sa();
+          T.value.showTable = e.value.table.show, sa();
         });
       },
       skeletonDataset: aa.value,
@@ -111,11 +111,11 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
         defaultConfig: e.value,
         userConfig: la.value
       })
-    }), { userOptionsVisible: Ve, setUserOptionsVisibility: it, keepUserOptionState: vt } = ol({ config: e.value }), { svgRef: le } = nl({
+    }), { userOptionsVisible: De, setUserOptionsVisibility: ct, keepUserOptionState: dt } = ol({ config: e.value }), { svgRef: oe } = nl({
       config: e.value.style.chart.title
     });
-    function Oe() {
-      const t = Je({
+    function Be() {
+      const t = at({
         userConfig: C.config,
         defaultConfig: Yt
       });
@@ -125,57 +125,57 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
         if (!qt.value(t))
           Zt(t), l = t;
         else {
-          const o = Je({
+          const o = at({
             userConfig: rl[a] || C.config,
             defaultConfig: t
           });
           l = {
-            ...Je({ userConfig: C.config, defaultConfig: o }),
-            customPalette: t.customPalette.length ? t.customPalette : Da[a] || te
+            ...at({ userConfig: C.config, defaultConfig: o }),
+            customPalette: t.customPalette.length ? t.customPalette : Ba[a] || ae
           };
         }
       else
         l = t;
-      return C.config && Ke(C.config, "events.datapointEnter") ? l.events.datapointEnter = C.config.events.datapointEnter : l.events.datapointEnter = null, C.config && Ke(C.config, "events.datapointLeave") ? l.events.datapointLeave = C.config.events.datapointLeave : l.events.datapointLeave = null, C.config && Ke(C.config, "events.datapointClick") ? l.events.datapointClick = C.config.events.datapointClick : l.events.datapointClick = null, l;
+      return C.config && Ze(C.config, "events.datapointEnter") ? l.events.datapointEnter = C.config.events.datapointEnter : l.events.datapointEnter = null, C.config && Ze(C.config, "events.datapointLeave") ? l.events.datapointLeave = C.config.events.datapointLeave : l.events.datapointLeave = null, C.config && Ze(C.config, "events.datapointClick") ? l.events.datapointClick = C.config.events.datapointClick : l.events.datapointClick = null, l;
     }
     const E = v(e.value.style.chart.width), K = v(e.value.style.chart.height), x = v(e.value.style.chart.layout.bars.gap);
-    ue(
+    re(
       () => C.config,
       (t) => {
-        me.value || (e.value = Oe()), Ve.value = !e.value.userOptions.showOnChartHover, nt.value += 1, Se.value += 1, $.value.showTable = e.value.table.show, $.value.sortDesc = e.value.style.chart.layout.bars.sort === "desc", $.value.showTooltip = e.value.style.chart.tooltip.show, E.value = e.value.style.chart.width, K.value = e.value.style.chart.height, x.value = e.value.style.chart.layout.bars.gap;
+        we.value || (e.value = Be()), De.value = !e.value.userOptions.showOnChartHover, rt.value += 1, ze.value += 1, T.value.showTable = e.value.table.show, T.value.sortDesc = e.value.style.chart.layout.bars.sort === "desc", T.value.showTooltip = e.value.style.chart.tooltip.show, E.value = e.value.style.chart.width, K.value = e.value.style.chart.height, x.value = e.value.style.chart.layout.bars.gap;
       },
       { deep: !0 }
-    ), ue(
+    ), re(
       () => C.dataset,
       (t) => {
-        Array.isArray(t) && t.length > 0 && (Ie.value = !1);
+        Array.isArray(t) && t.length > 0 && (Me.value = !1);
       },
       { deep: !0 }
     );
-    const { isPrinting: Fe, isImaging: Me, generatePdf: ct, generateImage: dt } = el({
+    const { isPrinting: Ee, isImaging: Re, generatePdf: ht, generateImage: pt } = el({
       elementId: `vue-ui-vertical-bar_${S.value}`,
       fileName: e.value.style.chart.title.text || "vue-ui-vertical-bar",
       options: e.value.userOptions.print
-    }), oa = h(() => e.value.userOptions.show && !e.value.style.chart.title.text), ht = h(() => Ea(e.value.customPalette)), pt = v(null), na = h(() => e.value.table.responsiveBreakpoint), ke = h(() => !!e.value.debug), ua = v(0), j = v(null), q = v(null);
+    }), oa = h(() => e.value.userOptions.show && !e.value.style.chart.title.text), ft = h(() => Ea(e.value.customPalette)), yt = v(null), na = h(() => e.value.table.responsiveBreakpoint), _e = h(() => !!e.value.debug), ua = v(0), j = v(null), q = v(null);
     function sa() {
-      if (R.value && (je(C.dataset) && (he({
+      if (R.value && (Je(C.dataset) && (ye({
         componentName: "VueUiVerticalBar",
         type: "dataset",
-        debug: ke.value
-      }), $e.value = !1, Ie.value = !0), je(C.dataset) || (Ie.value = e.value.loading), e.value.responsive)) {
+        debug: _e.value
+      }), Se.value = !1, Me.value = !0), Je(C.dataset) || (Me.value = e.value.loading), e.value.responsive)) {
         const t = Ya(() => {
           const { width: l, height: a } = qa({
             chart: R.value,
-            title: e.value.style.chart.title.text ? at.value : null,
-            legend: e.value.style.chart.legend.show ? Le.value : null,
-            source: lt.value,
-            noTitle: ot.value
+            title: e.value.style.chart.title.text ? nt.value : null,
+            legend: e.value.style.chart.legend.show ? Ae.value : null,
+            source: ut.value,
+            noTitle: st.value
           });
           ua.value = a / 3, requestAnimationFrame(async () => {
             K.value = a, E.value = l;
           });
         });
-        j.value && (q.value && j.value.unobserve(q.value), j.value.disconnect()), j.value = new ResizeObserver(t), _e(() => {
+        j.value && (q.value && j.value.unobserve(q.value), j.value.disconnect()), j.value = new ResizeObserver(t), Le(() => {
           q.value = R.value?.parentNode, q.value && j.value.observe(q.value);
         });
       }
@@ -183,89 +183,89 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
     Oa(() => {
       j.value && (q.value && j.value.unobserve(q.value), j.value.disconnect());
     });
-    const $ = v({
+    const T = v({
       showTable: e.value.table.show,
       sortDesc: e.value.style.chart.layout.bars.sort === "desc",
       showTooltip: e.value.style.chart.tooltip.show
-    }), ft = h(() => $.value.sortDesc), P = h(() => (rt.value.forEach((t, l) => {
-      !t.value && !t.children && he({
+    }), gt = h(() => T.value.sortDesc), P = h(() => (vt.value.forEach((t, l) => {
+      !t.value && !t.children && ye({
         componentName: "VueUiVerticalBar",
         type: "datasetAttributeEmpty",
         property: `value (index ${l})`,
-        debug: ke.value
-      }), t.children && (je(t.children) ? he({
+        debug: _e.value
+      }), t.children && (Je(t.children) ? ye({
         componentName: "VueUiVerticalBar",
         type: "datasetAttributeEmpty",
         property: `children (index ${l})`,
-        debug: ke.value
+        debug: _e.value
       }) : t.children.forEach((a, o) => {
-        [null, void 0].includes(a.name) && he({
+        [null, void 0].includes(a.name) && ye({
           componentName: "VueUiVerticalBar",
           type: "datasetSerieAttribute",
           property: "name",
           key: "children",
           index: o,
-          debug: ke.value
+          debug: _e.value
         });
       }));
-    }), rt.value.map((t, l) => {
+    }), vt.value.map((t, l) => {
       const a = `vertical_parent_${l}_${S.value}`, o = t.children && t.children.length > 0, g = N(
-        t.value ? t.value : o ? t.children.map((i) => i.value || 0).reduce((i, L) => i + L, 0) : 0
-      ), k = g >= 0 ? 1 : -1;
+        t.value ? t.value : o ? t.children.map((u) => u.value || 0).reduce((u, $) => u + $, 0) : 0
+      ), m = g >= 0 ? 1 : -1;
       return {
         ...t,
         id: a,
         absoluteIndex: l,
         shape: "square",
-        opacity: w.value.includes(a) ? 0.5 : 1,
+        opacity: _.value.includes(a) ? 0.5 : 1,
         value: Math.abs(g),
-        sign: k,
+        sign: m,
         hasChildren: o,
         isChild: !1,
         segregate: () => Z(a),
-        isSegregated: w.value.includes(a),
-        color: Ye(t.color) || ht.value[l] || te[l] || te[l % te.length],
+        isSegregated: _.value.includes(a),
+        color: Qe(t.color) || ft.value[l] || ae[l] || ae[l % ae.length],
         children: !t.children || !t.children.length ? [] : t.children.toSorted(
-          ye.value ? () => 0 : (i, L) => ft.value ? L.value - i.value : i.value - L.value
-        ).map((i, L) => ({
-          ...i,
-          value: N(Math.abs(i.value)),
+          ke.value ? () => 0 : (u, $) => gt.value ? $.value - u.value : u.value - $.value
+        ).map((u, $) => ({
+          ...u,
+          value: N(Math.abs(u.value)),
           absoluteIndex: l,
-          sign: i.value >= 0 ? 1 : -1,
+          sign: u.value >= 0 ? 1 : -1,
           isChild: !0,
           parentId: a,
           parentName: t.name,
           parentValue: g,
-          parentSign: k,
-          id: `vertical_child_${l}_${L}_${S.value}`,
-          childIndex: L,
-          color: Ye(i.color) || Ye(t.color) || ht.value[l] || te[l] || te[l % te.length]
-        })).map((i, L) => ({
-          ...i,
-          isFirstChild: L === 0,
-          isLastChild: L === t.children.length - 1
+          parentSign: m,
+          id: `vertical_child_${l}_${$}_${S.value}`,
+          childIndex: $,
+          color: Qe(u.color) || Qe(t.color) || ft.value[l] || ae[l] || ae[l % ae.length]
+        })).map((u, $) => ({
+          ...u,
+          isFirstChild: $ === 0,
+          isLastChild: $ === t.children.length - 1
         }))
       };
     }).toSorted(
-      ye.value ? () => 0 : (t, l) => ft.value ? l.value - t.value : t.value - l.value
+      ke.value ? () => 0 : (t, l) => gt.value ? l.value - t.value : t.value - l.value
     ))), U = h(() => P.value.filter(
-      (t) => !w.value.includes(t.id)
-    )), _ = h(() => U.value.flatMap((t) => t.hasChildren ? t.children : t)), ra = h(() => P.value.flatMap((t) => t.hasChildren ? t.children : t)), yt = h(() => U.value.flatMap((t) => t.children && t.children.length > 0 ? t.children.length : 1).reduce((t, l) => t + l, 0)), gt = h(() => ({
+      (t) => !_.value.includes(t.id)
+    )), w = h(() => U.value.flatMap((t) => t.hasChildren ? t.children : t)), ra = h(() => P.value.flatMap((t) => t.hasChildren ? t.children : t)), bt = h(() => U.value.flatMap((t) => t.children && t.children.length > 0 ? t.children.length : 1).reduce((t, l) => t + l, 0)), mt = h(() => ({
       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" : ""
-    })), T = h(() => e.value.style.chart.layout.bars.parentLabels.show ? e.value.style.chart.layout.bars.parentLabels.fontSize * 3 + e.value.style.chart.layout.bars.parentLabels.paddingBottom : 0), A = h(() => {
+    })), L = h(() => e.value.style.chart.layout.bars.parentLabels.show ? e.value.style.chart.layout.bars.parentLabels.fontSize * 3 + e.value.style.chart.layout.bars.parentLabels.paddingBottom : 0), A = h(() => {
       const t = [];
       let l = 0;
-      return _.value.forEach((a, o) => {
+      return w.value.forEach((a, o) => {
         a.isChild && a.childIndex === 0 && e.value.style.chart.layout.bars.parentLabels.show && (l += 1), t[o] = l;
       }), t;
     }), d = h(() => {
-      const l = Math.max(0, ...A.value) * T.value;
-      return (K.value - 24 - (yt.value - 1) * x.value - l) / yt.value;
+      const l = Math.max(0, ...A.value) * L.value;
+      return (K.value - 24 - (bt.value - 1) * x.value - l) / bt.value;
     }), W = h(() => ({
       width: E.value,
       height: K.value,
@@ -275,64 +275,64 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
         right: 64 + e.value.style.chart.layout.bars.paddingRight,
         bottom: 12
       }
-    })), Be = v(0);
-    function bt() {
-      _e(() => {
-        if (!Ae.value) {
-          Be.value = 0;
+    })), Xe = v(0);
+    function kt() {
+      Le(() => {
+        if (!Ie.value) {
+          Xe.value = 0;
           return;
         }
-        const l = Array.from(Ae.value.querySelectorAll("text")).reduce((a, o) => {
+        const l = Array.from(Ie.value.querySelectorAll("text")).reduce((a, o) => {
           const g = o.getBBox?.().width ?? o.getComputedTextLength();
           return g > a ? g : a;
         }, 0);
-        Be.value = l + 12;
+        Xe.value = l + 12;
       });
     }
-    ue(
+    re(
       () => [
-        _.value,
+        w.value,
         E.value,
         K.value,
         e.value.style.chart.layout.bars.nameLabels,
         e.value.style.chart.layout.bars.offsetX
       ],
-      () => bt(),
+      () => kt(),
       { deep: !0 }
-    ), Ge(() => {
-      bt();
+    ), qe(() => {
+      kt();
     });
-    function ve() {
-      _e(() => {
-        ie.value = 0, ae.value = 0, requestAnimationFrame(() => {
-          if (!ze.value) {
-            ie.value = 0, ae.value = 0;
+    function de() {
+      Le(() => {
+        ce.value = 0, le.value = 0, requestAnimationFrame(() => {
+          if (!Ve.value) {
+            ce.value = 0, le.value = 0;
             return;
           }
           const t = Array.from(
-            ze.value.querySelectorAll("text")
+            Ve.value.querySelectorAll("text")
           );
           if (!t.length) {
-            ie.value = 0, ae.value = 0;
+            ce.value = 0, le.value = 0;
             return;
           }
           let l = 1 / 0, a = 0;
-          t.forEach((xe) => {
-            const We = xe.getBBox(), It = We.x, Vt = We.x + We.width;
-            It < l && (l = It), Vt > a && (a = Vt);
+          t.forEach((Ye) => {
+            const fe = Ye.getBBox(), ue = fe.x, ee = fe.x + fe.width;
+            ue < l && (l = ue), ee > a && (a = ee);
           });
-          const o = 0, g = E.value, k = 24, i = Math.max(0, o - l + k), L = Math.max(0, a - g + k);
-          ae.value = i, ie.value = L;
+          const o = 0, g = E.value, m = 24, u = Math.max(0, o - l + m), $ = Math.max(0, a - g + m);
+          le.value = u, ce.value = $;
         });
       });
     }
-    ue(w, () => ve(), { deep: !0 }), ue(
-      () => [_.value, E.value, K.value],
-      () => ve(),
+    re(_, () => de(), { deep: !0 }), re(
+      () => [w.value, E.value, K.value],
+      () => de(),
       { deep: !0 }
-    ), Ge(() => ve());
+    ), qe(() => de());
     const c = h(() => {
-      const t = Be.value + Math.abs(e.value.style.chart.layout.bars.nameLabels.offsetX) + ae.value + e.value.style.chart.layout.bars.offsetX, l = W.value.width - W.value.padding.right, a = Math.max(0, l - t - ie.value - ae.value - e.value.style.chart.layout.bars.offsetX);
+      const t = Xe.value + Math.abs(e.value.style.chart.layout.bars.nameLabels.offsetX) + le.value + e.value.style.chart.layout.bars.offsetX, l = W.value.width - W.value.padding.right, a = Math.max(0, l - t - ce.value - le.value - e.value.style.chart.layout.bars.offsetX);
       return {
         top: W.value.padding.top,
         bottom: W.value.padding.top + W.value.height,
@@ -342,43 +342,43 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
         fullHeight: W.value.padding.top + W.value.padding.bottom + W.value.height
       };
     });
-    function mt() {
-      w.value.length ? w.value = [] : P.value.forEach((t) => {
-        w.value.push(t.id);
-      }), ve();
+    function Ct() {
+      _.value.length ? _.value = [] : P.value.forEach((t) => {
+        _.value.push(t.id);
+      }), de();
     }
     async function Z(t) {
-      if (w.value.includes(t))
-        w.value = w.value.filter((l) => l !== t);
+      if (_.value.includes(t))
+        _.value = _.value.filter((l) => l !== t);
       else {
-        if (w.value.length === P.value.length - 1) return;
-        w.value.push(t);
+        if (_.value.length === P.value.length - 1) return;
+        _.value.push(t);
       }
-      st("selectLegend", U.value), ve();
+      Fe("selectLegend", U.value), de();
     }
-    function kt(t) {
+    function xt(t) {
       if (!P.value.length)
         return e.value.debug && console.warn("VueUiHorizontalBar - There are no series to show."), null;
       const l = P.value.find((a) => a.name === t);
       return l || (e.value.debug && console.warn(`VueUiHorizontalBar - Series name not found "${t}"`), null);
     }
     function ia(t) {
-      const l = kt(t);
-      l !== null && w.value.includes(l.id) && Z(l.id);
+      const l = xt(t);
+      l !== null && _.value.includes(l.id) && Z(l.id);
     }
     function va(t) {
-      const l = kt(t);
-      l !== null && (w.value.includes(l.id) || Z(l.id));
+      const l = xt(t);
+      l !== null && (_.value.includes(l.id) || Z(l.id));
     }
     const X = h(() => U.value.map((t) => Math.abs(t.value)).reduce((t, l) => t + l, 0));
-    function Ct(t, l = !1, a = 0) {
+    function wt(t, l = !1, a = 0) {
       return l ? M({
         v: N(Math.abs(t) / X.value * 100),
         s: "%",
         r: a
       }) : Math.abs(t) / X.value;
     }
-    const J = h(() => _.value.map((t) => t.sign).includes(-1)), ca = h(() => Math.max(
+    const J = h(() => w.value.map((t) => t.sign).includes(-1)), ca = h(() => Math.max(
       ...U.value.flatMap((t) => t.children && t.children.length ? Math.max(...t.children.map((l) => l.value)) : t.value)
     ));
     function I(t) {
@@ -388,13 +388,13 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
     function da(t) {
       return I(t) + c.value.left;
     }
-    function oe(t, l) {
-      const a = U.value.find((i) => i.id === t.parentId);
+    function ne(t, l) {
+      const a = U.value.find((u) => u.id === t.parentId);
       return {
-        y: c.value.top + (x.value + d.value) * l + A.value[l] * T.value - T.value + e.value.style.chart.layout.bars.parentLabels.fontSize,
+        y: c.value.top + (x.value + d.value) * l + A.value[l] * L.value - L.value + 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 / X.value) ? "" : Ct(
+        percentageToTotal: isNaN(a.value / X.value) ? "" : wt(
           a.value,
           !0,
           e.value.style.chart.layout.bars.dataLabels.percentage.roundingPercentage
@@ -405,45 +405,45 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
     function ha() {
       return U.value;
     }
-    function xt(t, l) {
-      return oe(t, l).name;
+    function _t(t, l) {
+      return ne(t, l).name;
     }
     function pa(t, l) {
-      const a = oe(t, l);
-      return Tt(a.value, a, l, t.parentSign || t.sign);
+      const a = ne(t, l);
+      return St(a.value, a, l, t.parentSign || t.sign);
     }
-    const De = v(null), Ee = v(null);
-    function wt({ datapoint: t, seriesIndex: l }) {
-      e.value.events.datapointClick && e.value.events.datapointClick({ datapoint: t, seriesIndex: l });
+    const He = v(null), Ue = v(null);
+    function $t({ datapoint: t, seriesIndex: l }) {
+      Fe("selectDatapoint", t), e.value.events.datapointClick && e.value.events.datapointClick({ datapoint: t, seriesIndex: l });
     }
-    function _t({ datapoint: t, seriesIndex: l }) {
-      e.value.events.datapointLeave && e.value.events.datapointLeave({ datapoint: t, seriesIndex: l }), et.value = null, fe.value = !1, De.value = null, z.value === l && (z.value = null);
+    function Tt({ datapoint: t, seriesIndex: l }) {
+      e.value.events.datapointLeave && e.value.events.datapointLeave({ datapoint: t, seriesIndex: l }), me.value = null, be.value = !1, He.value = null, z.value === l && (z.value = null);
     }
-    function $t(t, l, a = "pointer") {
-      Ne.value = a, e.value.events.datapointEnter && e.value.events.datapointEnter({ datpoint: t, seriesIndex: l }), z.value = l, et.value = t, Ee.value = {
+    function Lt(t, l, a = "pointer") {
+      Oe.value = a, e.value.events.datapointEnter && e.value.events.datapointEnter({ datpoint: t, seriesIndex: l }), z.value = l, me.value = t, Ue.value = {
         datapoint: t,
         seriesIndex: l,
         series: P.value,
         config: e.value
-      }, fe.value = !0, De.value = t.id;
+      }, be.value = !0, He.value = t.id;
       let o = "";
-      const g = t.isChild ? t.parentName : t.name, k = t.isChild ? t.name : "", i = e.value.style.chart.tooltip.customFormat;
-      Ga(i) && Ka(
-        () => i({
+      const g = t.isChild ? t.parentName : t.name, m = t.isChild ? t.name : "", u = e.value.style.chart.tooltip.customFormat;
+      Ga(u) && Ka(
+        () => u({
           datapoint: t,
           series: P.value,
           config: e.value,
           seriesIndex: l
         })
-      ) ? Te.value = i({
+      ) ? Pe.value = u({
         datapoint: t,
         series: P.value,
         config: e.value,
         seriesIndex: l
       }) : (o += `<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 60 60" height="14" width="14"><rect x="0" y="0" height="60" width="60" rx="5" stroke="none" fill="${t.color}"/>${Jt.pattern ? `<rect x="0" y="0" height="60" width="60" rx="5" stroke="none" fill="url(#pattern_${S.value}_${t.absoluteIndex})"/>` : ""}</svg> ${g}</div>
-                ${k ? `<div>${k}</div>` : ""}
-            </div>`, e.value.style.chart.tooltip.showValue && (o += `<div>${e.value.translations.value}: <b>${pe(
+                ${m ? `<div>${m}</div>` : ""}
+            </div>`, e.value.style.chart.tooltip.showValue && (o += `<div>${e.value.translations.value}: <b>${ge(
         e.value.style.chart.layout.bars.dataLabels.value.formatter,
         t.sign === 1 ? t.value : -t.value,
         M({
@@ -461,12 +461,12 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
         v: Math.abs(t.value) / Math.abs(t.parentValue) * 100,
         s: "%",
         r: e.value.style.chart.tooltip.roundingPercentage
-      })}</b></div>`)), Te.value = `<div style="text-align:left">${o}</div>`);
+      })}</b></div>`)), Pe.value = `<div style="text-align:left">${o}</div>`);
     }
-    function Tt(t, l, a, o) {
+    function St(t, l, a, o) {
       if (!e.value.style.chart.layout.bars.dataLabels.value.show)
         return "";
-      const g = pe(
+      const g = ge(
         e.value.style.chart.layout.bars.dataLabels.value.formatter,
         N(o === -1 && t >= 0 ? -t : t),
         M({
@@ -476,12 +476,12 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
           r: e.value.style.chart.layout.bars.dataLabels.value.roundingValue
         }),
         { datapoint: l, seriesIndex: a }
-      ), k = `(${Ct(
+      ), m = `(${wt(
         t,
         !0,
         e.value.style.chart.layout.bars.dataLabels.percentage.roundingPercentage
       )})`;
-      return `${g}${e.value.style.chart.layout.bars.dataLabels.percentage.show ? ` ${k}` : ""}`;
+      return `${g}${e.value.style.chart.layout.bars.dataLabels.percentage.show ? ` ${m}` : ""}`;
     }
     const V = h(() => {
       const t = [
@@ -492,7 +492,7 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
         e.value.translations.value,
         e.value.translations.percentageToSerie,
         e.value.translations.percentageToTotal
-      ], l = _.value.map((a) => a.isChild ? a.isFirstChild ? {
+      ], l = w.value.map((a) => a.isChild ? a.isFirstChild ? {
         color: a.color,
         parentName: a.parentName,
         parentValue: a.parentValue,
@@ -522,58 +522,58 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
       });
       return { head: t, body: l };
     });
-    function Re(t = null) {
+    function We(t = null) {
       const l = [
         [e.value.style.chart.title.text],
         [e.value.style.chart.title.subtitle.text],
         [""]
-      ], a = V.value.head, o = V.value.body.map((i) => [
-        i.parentName,
-        i.parentValue,
-        i.percentageToTotal,
-        i.childName,
-        i.childValue,
-        i.childPercentageToParent,
-        i.childPercentageToTotal
-      ]), g = l.concat([a]).concat(o), k = Ua(g);
-      t ? t(k) : Wa({
-        csvContent: k,
+      ], a = V.value.head, o = V.value.body.map((u) => [
+        u.parentName,
+        u.parentValue,
+        u.percentageToTotal,
+        u.childName,
+        u.childValue,
+        u.childPercentageToParent,
+        u.childPercentageToTotal
+      ]), g = l.concat([a]).concat(o), m = Ua(g);
+      t ? t(m) : Wa({
+        csvContent: m,
         title: e.value.style.chart.title.text || "vue-ui-vertical-bar"
       });
     }
     const Q = v(!1);
-    function Lt(t) {
-      Q.value = t, tt.value += 1;
+    function Pt(t) {
+      Q.value = t, ot.value += 1;
     }
-    function St() {
-      $.value.showTable = !$.value.showTable;
+    function At() {
+      T.value.showTable = !T.value.showTable;
     }
-    Ge(() => {
+    qe(() => {
       ["none", "asc", "desc"].includes(
         e.value.style.chart.layout.bars.sort
-      ) || he({
+      ) || ye({
         componentName: "VueUiVerticalBar",
         type: "attributeWrongValue",
         property: "style.chart.layout.bars.sort",
         key: e.value.style.chart.layout.bars.sort
-      }), G.value = ta.value[e.value.style.chart.layout.bars.sort], $.value.sortDesc = G.value === 2, ye.value = G.value === 0;
+      }), G.value = ta.value[e.value.style.chart.layout.bars.sort], T.value.sortDesc = G.value === 2, ke.value = G.value === 0;
     });
     function fa() {
       G.value += 1, G.value > 2 && (G.value = 0);
     }
-    function Pt() {
-      fa(), $.value.sortDesc = G.value === 2, ye.value = G.value === 0;
+    function zt() {
+      fa(), T.value.sortDesc = G.value === 2, ke.value = G.value === 0;
     }
-    function At() {
-      $.value.showTooltip = !$.value.showTooltip;
+    function Nt() {
+      T.value.showTooltip = !T.value.showTooltip;
     }
-    const ce = v(!1);
-    function Xe() {
-      ce.value = !ce.value;
+    const he = v(!1);
+    function Ge() {
+      he.value = !he.value;
     }
     async function ya({ scale: t = 2 } = {}) {
       if (!R.value) return;
-      const { width: l, height: a } = R.value.getBoundingClientRect(), o = l / a, { imageUri: g, base64: k } = await ul({
+      const { width: l, height: a } = R.value.getBoundingClientRect(), o = l / a, { imageUri: g, base64: m } = await ul({
         domElement: R.value,
         base64: !0,
         img: !0,
@@ -581,15 +581,15 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
       });
       return {
         imageUri: g,
-        base64: k,
+        base64: m,
         title: e.value.style.chart.title.text,
         width: l,
         height: a,
         aspectRatio: o
       };
     }
-    const Ce = h(() => {
-      const t = e.value.table.useDialog && !e.value.table.show, l = $.value.showTable;
+    const $e = h(() => {
+      const t = e.value.table.useDialog && !e.value.table.show, l = T.value.showTable;
       return {
         component: t ? jt : il,
         title: `${e.value.style.chart.title.text}${e.value.style.chart.title.subtitle.text ? `: ${e.value.style.chart.title.subtitle.text}` : ""}`,
@@ -619,20 +619,20 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
         }
       };
     });
-    ue(
-      () => $.value.showTable,
+    re(
+      () => T.value.showTable,
       (t) => {
-        e.value.table.show || (t && e.value.table.useDialog && re.value ? re.value.open() : "close" in re.value && re.value.close());
+        e.value.table.show || (t && e.value.table.useDialog && ve.value ? ve.value.open() : "close" in ve.value && ve.value.close());
       }
     );
-    const { isResponsive: ga } = ll(pt, na);
-    function He() {
-      $.value.showTable = !1, Pe.value && Pe.value.setTableIconState(!1);
+    const { isResponsive: ga } = ll(yt, na);
+    function Ke() {
+      T.value.showTable = !1, Ne.value && Ne.value.setTableIconState(!1);
     }
     const ba = h(() => P.value.map((t, l) => ({
       ...t,
       shape: "square",
-      display: `${t.name}: ${pe(
+      display: `${t.name}: ${ge(
         e.value.style.chart.layout.bars.dataLabels.value.formatter,
         t.value,
         M({
@@ -647,14 +647,14 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
       ...t,
       name: t.display
     }))), { exportSvg: wa, getSvg: _a } = tl({
-      svg: le,
+      svg: oe,
       title: Ca,
       legend: ka,
       legendItems: xa,
       backgroundColor: ma
     });
-    async function zt({ isCb: t }) {
-      be.value = !0, await _e();
+    async function It({ isCb: t }) {
+      xe.value = !0, await Le();
       try {
         if (t) {
           const { blob: l, url: a, text: o, dataUrl: g } = await _a();
@@ -662,25 +662,25 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
         } else
           await Promise.resolve(wa());
       } finally {
-        be.value = !1;
+        xe.value = !1;
       }
     }
     function $a(t) {
       if (t?.stage === "start") {
-        ge.value = !0;
+        Ce.value = !0;
         return;
       }
       if (t?.stage === "end") {
-        ge.value = !1;
+        Ce.value = !1;
         return;
       }
-      dt();
+      pt();
     }
     function Ta() {
       console.warn("[autoSize]: this legacy method can be safely removed as it has no impact.");
     }
-    async function Nt() {
-      if (st("copyAlt", {
+    async function Vt() {
+      if (Fe("copyAlt", {
         config: e.value,
         dataset: U.value
       }), !e.value.userOptions.callbacks.altCopy) {
@@ -692,55 +692,56 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
         dataset: U.value
       }));
     }
-    const Ue = v(!1);
+    const je = v(!1);
     function La() {
-      z.value = null, Ue.value = !0;
+      z.value = null, je.value = !0;
     }
     function Sa() {
-      z.value = null, fe.value = !1, Ue.value = !1;
+      z.value = null, be.value = !1, je.value = !1;
     }
     function Pa() {
       if (z.value === null) return;
-      const t = _.value[z.value];
-      t && _t({
+      const t = w.value[z.value];
+      t && Tt({
         datapoint: t,
         seriesIndex: z.value
-      }), z.value = null, Ne.value = "pointer";
+      }), z.value = null, Oe.value = "pointer";
     }
     function Aa(t) {
-      if (!le.value || ce.value || document.activeElement !== le.value) return;
+      if (!oe.value || he.value || document.activeElement !== oe.value) return;
       const l = t.key === "ArrowRight" || t.key === "ArrowDown", a = t.key === "ArrowLeft" || t.key === "ArrowUp", o = t.key === "Enter" || t.key === " ", g = t.key === "Escape";
       if (!l && !a && !o && !g) return;
-      const k = _.value.length;
-      if (!k) return;
+      const m = w.value.length;
+      if (!m) return;
       if (t.preventDefault(), t.stopPropagation(), g) {
         Pa();
         return;
       }
       if (o) {
         if (z.value === null) return;
-        const xe = _.value[z.value];
-        if (!xe) return;
-        wt({
-          datapoint: xe,
+        const ee = w.value[z.value];
+        if (!ee) return;
+        $t({
+          datapoint: ee,
           seriesIndex: z.value
         });
         return;
       }
-      let i = z.value;
-      i === null || i < 0 || i >= k ? l ? i = 0 : i = k - 1 : l ? (i += 1, i >= k && (i = 0)) : a && (i -= 1, i < 0 && (i = k - 1));
-      const L = _.value[i];
-      L && (z.value = i, za(L), $t(L, i, "keyboard"));
+      let u = z.value;
+      const $ = me.value ? w.value.findIndex((ee) => ee.id === me.value.id) : null, Ye = u !== null && u >= 0 && u < m, fe = $ !== null && $ >= 0 && $ < m;
+      Ye ? l ? (u += 1, u >= m && (u = 0)) : a && (u -= 1, u < 0 && (u = m - 1)) : fe ? (u = l ? $ + 1 : $ - 1, u >= m && (u = 0), u < 0 && (u = m - 1)) : l ? u = 0 : u = m - 1;
+      const ue = w.value[u];
+      ue && (z.value = u, za(ue), Lt(ue, u, "keyboard"));
     }
     function za(t) {
       if (!t) return;
-      let l = c.value.right, a = c.value.top + (x.value + d.value) * t.absoluteIndex + A.value[t.absoluteIndex] * T.value;
+      let l = c.value.right, a = c.value.top + (x.value + d.value) * t.absoluteIndex + A.value[t.absoluteIndex] * L.value;
       if (!Number.isFinite(l) || !Number.isFinite(a))
         return;
-      const o = ja(l, a, le.value);
-      o && (ut.value = o);
+      const o = ja(l, a, oe.value);
+      o && (it.value = o);
     }
-    const de = h(() => ({
+    const pe = h(() => ({
       head: V.value.head,
       body: V.value.body.map((t) => [
         t.parentName,
@@ -780,47 +781,47 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
       autoSize: Ta,
       getData: ha,
       getImage: ya,
-      generatePdf: ct,
-      generateCsv: Re,
-      generateImage: dt,
-      generateSvg: zt,
+      generatePdf: ht,
+      generateCsv: We,
+      generateImage: pt,
+      generateSvg: It,
       hideSeries: va,
       showSeries: ia,
-      toggleTable: St,
-      toggleSort: Pt,
-      toggleTooltip: At,
-      toggleAnnotator: Xe,
-      toggleFullscreen: Lt,
-      copyAlt: Nt
-    }), (t, l) => (n(), s("div", {
-      class: ee(`vue-data-ui-component vue-ui-vertical-bar ${Q.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"} ${e.value.responsive ? "vue-ui-vertical-bar-autosize" : ""}`),
+      toggleTable: At,
+      toggleSort: zt,
+      toggleTooltip: Nt,
+      toggleAnnotator: Ge,
+      toggleFullscreen: Pt,
+      copyAlt: Vt
+    }), (t, l) => (n(), r("div", {
+      class: te(`vue-data-ui-component vue-ui-vertical-bar ${Q.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"} ${e.value.responsive ? "vue-ui-vertical-bar-autosize" : ""}`),
       ref_key: "verticalBarChart",
       ref: R,
       id: `vue-ui-vertical-bar_${S.value}`,
       style: b(`font-family:${e.value.style.fontFamily};width:100%; text-align:center;background:${e.value.style.chart.backgroundColor};height:100%`),
-      onMouseenter: l[3] || (l[3] = () => r(it)(!0)),
-      onMouseleave: l[4] || (l[4] = () => r(it)(!1))
+      onMouseenter: l[3] || (l[3] = () => i(ct)(!0)),
+      onMouseleave: l[4] || (l[4] = () => i(ct)(!1))
     }, [
-      u("p", {
+      s("p", {
         id: `chart-instructions-${S.value}`,
         class: "sr-only"
-      }, m(e.value.a11y.translations.keyboardNavigation), 9, hl),
-      de.value.body.length ? (n(), H(vl, {
+      }, k(e.value.a11y.translations.keyboardNavigation), 9, hl),
+      pe.value.body.length ? (n(), H(vl, {
         key: 0,
         uid: S.value,
-        head: de.value.head,
-        body: de.value.body,
-        caption: de.value.caption,
-        notice: de.value.notice
+        head: pe.value.head,
+        body: pe.value.body,
+        caption: pe.value.caption,
+        notice: pe.value.notice
       }, null, 8, ["uid", "head", "body", "caption", "notice"])) : p("", !0),
-      e.value.userOptions.buttons.annotator ? (n(), H(r(Wt), {
+      e.value.userOptions.buttons.annotator ? (n(), H(i(Wt), {
         key: 1,
-        svgRef: r(le),
+        svgRef: i(oe),
         backgroundColor: e.value.style.chart.backgroundColor,
         color: e.value.style.chart.color,
-        active: ce.value,
+        active: he.value,
         isCursorPointer: Y.value,
-        onClose: Xe
+        onClose: Ge
       }, {
         "annotator-action-close": f(() => [
           y(t.$slots, "annotator-action-close", {}, void 0, !0)
@@ -842,21 +843,21 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
         ]),
         _: 3
       }, 8, ["svgRef", "backgroundColor", "color", "active", "isCursorPointer"])) : p("", !0),
-      oa.value ? (n(), s("div", {
+      oa.value ? (n(), r("div", {
         key: 2,
         ref_key: "noTitle",
-        ref: ot,
+        ref: st,
         class: "vue-data-ui-no-title-space",
         style: "height:36px; width: 100%;background:transparent"
       }, null, 512)) : p("", !0),
-      e.value.style.chart.title.text ? (n(), s("div", {
+      e.value.style.chart.title.text ? (n(), r("div", {
         key: 3,
         ref_key: "chartTitle",
-        ref: at,
+        ref: nt,
         style: "width:100%;background:transparent;padding-bottom:12px"
       }, [
         (n(), H(sl, {
-          key: `title_${nt.value}`,
+          key: `title_${rt.value}`,
           config: {
             title: {
               cy: "vertical-bar-div-title",
@@ -869,14 +870,14 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
           }
         }, null, 8, ["config"]))
       ], 512)) : p("", !0),
-      e.value.userOptions.show && $e.value && (r(vt) || r(Ve)) ? (n(), H(r(Gt), {
+      e.value.userOptions.show && Se.value && (i(dt) || i(De)) ? (n(), H(i(Gt), {
         ref_key: "userOptionsRef",
-        ref: Pe,
+        ref: Ne,
         backgroundColor: e.value.style.chart.backgroundColor,
         color: e.value.style.chart.color,
-        key: `user_options_${tt.value}`,
-        isImaging: r(Me),
-        isPrinting: r(Fe),
+        key: `user_options_${ot.value}`,
+        isImaging: i(Re),
+        isPrinting: i(Ee),
         uid: S.value,
         hasTooltip: e.value.userOptions.buttons.tooltip && e.value.style.chart.tooltip.show,
         hasPdf: e.value.userOptions.buttons.pdf,
@@ -888,30 +889,30 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
         hasFullscreen: e.value.userOptions.buttons.fullscreen,
         hasAltCopy: e.value.userOptions.buttons.altCopy,
         isFullscreen: Q.value,
-        isTooltip: $.value.showTooltip,
+        isTooltip: T.value.showTooltip,
         titles: { ...e.value.userOptions.buttonTitles },
         chartElement: R.value,
         position: e.value.userOptions.position,
         hasAnnotator: e.value.userOptions.buttons.annotator,
-        isAnnotation: ce.value,
+        isAnnotation: he.value,
         callbacks: e.value.userOptions.callbacks,
         printScale: e.value.userOptions.print.scale,
         tableDialog: e.value.table.useDialog,
         isCursorPointer: Y.value,
-        onToggleFullscreen: Lt,
-        onGeneratePdf: r(ct),
-        onGenerateCsv: Re,
+        onToggleFullscreen: Pt,
+        onGeneratePdf: i(ht),
+        onGenerateCsv: We,
         onGenerateImage: $a,
-        onGenerateSvg: zt,
-        onToggleTable: St,
-        onToggleSort: Pt,
-        onToggleTooltip: At,
-        onToggleAnnotator: Xe,
-        onCopyAlt: Nt,
+        onGenerateSvg: It,
+        onToggleTable: At,
+        onToggleSort: zt,
+        onToggleTooltip: Nt,
+        onToggleAnnotator: Ge,
+        onCopyAlt: Vt,
         style: b({
-          visibility: r(vt) ? r(Ve) ? "visible" : "hidden" : "visible"
+          visibility: i(dt) ? i(De) ? "visible" : "hidden" : "visible"
         })
-      }, we({ _: 2 }, [
+      }, Te({ _: 2 }, [
         t.$slots.menuIcon ? {
           name: "menuIcon",
           fn: f(({ isOpen: a, color: o }) => [
@@ -997,25 +998,25 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
           key: "11"
         } : void 0
       ]), 1032, ["backgroundColor", "color", "isImaging", "isPrinting", "uid", "hasTooltip", "hasPdf", "hasImg", "hasSvg", "hasXls", "hasTable", "hasSort", "hasFullscreen", "hasAltCopy", "isFullscreen", "isTooltip", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "callbacks", "printScale", "tableDialog", "isCursorPointer", "onGeneratePdf", "style"])) : p("", !0),
-      e.value.style.chart.legend.show && e.value.style.chart.legend.position === "top" ? (n(), s("div", {
+      e.value.style.chart.legend.show && e.value.style.chart.legend.position === "top" ? (n(), r("div", {
         key: 5,
         ref_key: "chartLegend",
-        ref: Le
+        ref: Ae
       }, [
-        (n(), H(Dt, {
-          key: `legend_top_${Se.value}`,
+        (n(), H(Bt, {
+          key: `legend_top_${ze.value}`,
           legendSet: P.value,
-          config: gt.value,
+          config: mt.value,
           onClickMarker: l[0] || (l[0] = ({ legend: a }) => Z(a.id))
-        }, we({
+        }, Te({
           item: f(({ legend: a, index: o }) => [
-            u("div", {
+            s("div", {
               onClick: (g) => Z(a.id),
-              style: b(`opacity:${w.value.includes(a.id) ? 0.5 : 1}`)
-            }, m(a.name) + ": " + m(r(pe)(
+              style: b(`opacity:${_.value.includes(a.id) ? 0.5 : 1}`)
+            }, k(a.name) + ": " + k(i(ge)(
               e.value.style.chart.layout.bars.dataLabels.value.formatter,
               a.value,
-              r(M)({
+              i(M)({
                 p: e.value.style.chart.legend.prefix,
                 v: a.value,
                 s: e.value.style.chart.legend.suffix,
@@ -1025,13 +1026,13 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
             )), 13, pl)
           ]),
           legendToggle: f(() => [
-            P.value.length > 2 && e.value.style.chart.legend.selectAllToggle.show && !r(me) ? (n(), H(Et, {
+            P.value.length > 2 && e.value.style.chart.legend.selectAllToggle.show && !i(we) ? (n(), H(Et, {
               key: 0,
               backgroundColor: e.value.style.chart.legend.selectAllToggle.backgroundColor,
               color: e.value.style.chart.legend.selectAllToggle.color,
               fontSize: e.value.style.chart.legend.fontSize,
-              checked: w.value.length > 0,
-              onToggle: mt
+              checked: _.value.length > 0,
+              onToggle: Ct
             }, null, 8, ["backgroundColor", "color", "fontSize", "checked"])) : p("", !0)
           ]),
           _: 2
@@ -1039,7 +1040,7 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
           t.$slots.pattern ? {
             name: "legend-pattern",
             fn: f(({ legend: a, index: o }) => [
-              se(Bt, {
+              ie(Dt, {
                 shape: a.shape,
                 radius: 30,
                 stroke: "none",
@@ -1051,12 +1052,12 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
           } : void 0
         ]), 1032, ["legendSet", "config"]))
       ], 512)) : p("", !0),
-      u("div", fl, [
-        (n(), s("svg", {
+      s("div", fl, [
+        (n(), r("svg", {
           ref_key: "svgRef",
-          ref: le,
-          xmlns: r(Ra),
-          class: ee({
+          ref: oe,
+          xmlns: i(Ra),
+          class: te({
             "vue-data-ui-fullscreen--on": Q.value,
             "vue-data-ui-fulscreen--off": !Q.value
           }),
@@ -1068,13 +1069,13 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
           onBlur: Sa,
           onKeydown: Aa
         }, [
-          u("g", {
+          s("g", {
             ref_key: "G",
             ref: Qt,
             class: "vue-data-ui-g"
           }, [
-            se(r(Kt)),
-            t.$slots["chart-background"] ? (n(), s("foreignObject", {
+            ie(i(Kt)),
+            t.$slots["chart-background"] ? (n(), r("foreignObject", {
               key: 0,
               x: 0,
               y: 0,
@@ -1086,37 +1087,37 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
             }, [
               y(t.$slots, "chart-background", {}, void 0, !0)
             ], 8, gl)) : p("", !0),
-            (n(!0), s(B, null, D(_.value, (a, o) => (n(), s("linearGradient", {
+            (n(!0), r(D, null, B(w.value, (a, o) => (n(), r("linearGradient", {
               x1: "0%",
               y1: "0%",
               x2: "100%",
               y2: "0%",
               id: `vertical_bar_gradient_${S.value}_${o}`
             }, [
-              u("stop", {
+              s("stop", {
                 offset: "0%",
                 "stop-color": a.color
               }, null, 8, ml),
-              u("stop", {
+              s("stop", {
                 offset: "100%",
-                "stop-color": r(qe)(
-                  r(Xa)(a.color, 0.03),
+                "stop-color": i(et)(
+                  i(Xa)(a.color, 0.03),
                   100 - e.value.style.chart.layout.bars.gradientIntensity
                 )
               }, null, 8, kl)
             ], 8, bl))), 256)),
-            t.$slots.pattern ? (n(), s("g", Cl, [
-              (n(!0), s(B, null, D(_.value, (a) => (n(), s("defs", null, [
+            t.$slots.pattern ? (n(), r("g", Cl, [
+              (n(!0), r(D, null, B(w.value, (a) => (n(), r("defs", null, [
                 y(t.$slots, "pattern", Ot({ ref_for: !0 }, {
                   seriesIndex: a.absoluteIndex,
                   patternId: `pattern_${S.value}_${a.absoluteIndex}`
                 }), void 0, !0)
               ]))), 256))
             ])) : p("", !0),
-            e.value.style.chart.layout.bars.rowColor ? (n(!0), s(B, { key: 2 }, D(_.value, (a, o) => (n(), s("g", null, [
-              u("rect", {
+            e.value.style.chart.layout.bars.rowColor ? (n(!0), r(D, { key: 2 }, B(w.value, (a, o) => (n(), r("g", null, [
+              s("rect", {
                 x: 0,
-                y: c.value.top + (x.value + d.value) * o + A.value[o] * T.value,
+                y: c.value.top + (x.value + d.value) * o + A.value[o] * L.value,
                 width: E.value,
                 height: d.value <= 0 ? 1e-4 : d.value,
                 fill: e.value.style.chart.layout.bars.rowColor,
@@ -1124,47 +1125,47 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
                 style: { pointerEvents: "none" }
               }, null, 8, xl)
             ]))), 256)) : p("", !0),
-            (n(!0), s(B, null, D(_.value, (a, o) => (n(), s("g", null, [
-              u("rect", {
-                x: r(N)(
+            (n(!0), r(D, null, B(w.value, (a, o) => (n(), r("g", null, [
+              s("rect", {
+                x: i(N)(
                   J.value ? c.value.left + c.value.width / 2 - (a.sign === 1 ? 0 : I(a.value) <= 0 ? 1e-4 : I(a.value)) : c.value.left
                 ),
-                y: c.value.top + (x.value + d.value) * o + A.value[o] * T.value,
-                width: r(N)(
+                y: c.value.top + (x.value + d.value) * o + A.value[o] * L.value,
+                width: i(N)(
                   I(a.value) <= 0 ? 1e-4 : I(a.value)
                 ),
                 height: d.value <= 0 ? 1e-4 : d.value,
                 fill: e.value.style.chart.layout.bars.underlayerColor,
                 rx: e.value.style.chart.layout.bars.borderRadius,
-                class: ee({ animated: e.value.useCssAnimation })
+                class: te({ animated: e.value.useCssAnimation })
               }, null, 10, wl)
             ]))), 256)),
-            (n(!0), s(B, null, D(_.value, (a, o) => (n(), s("g", null, [
-              u("rect", {
-                x: r(N)(
+            (n(!0), r(D, null, B(w.value, (a, o) => (n(), r("g", null, [
+              s("rect", {
+                x: i(N)(
                   J.value ? c.value.left + c.value.width / 2 - (a.sign === 1 ? 0 : I(a.value) <= 0 ? 1e-4 : I(a.value)) : c.value.left
                 ),
-                y: c.value.top + (x.value + d.value) * o + A.value[o] * T.value,
-                width: r(N)(
+                y: c.value.top + (x.value + d.value) * o + A.value[o] * L.value,
+                width: i(N)(
                   I(a.value) <= 0 ? 1e-4 : I(a.value)
                 ),
                 height: d.value <= 0 ? 1e-4 : d.value,
-                fill: e.value.style.chart.layout.bars.useGradient ? `url(#vertical_bar_gradient_${S.value}_${o})` : r(qe)(
+                fill: e.value.style.chart.layout.bars.useGradient ? `url(#vertical_bar_gradient_${S.value}_${o})` : i(et)(
                   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: ee({ animated: e.value.useCssAnimation })
+                class: te({ animated: e.value.useCssAnimation })
               }, null, 10, _l),
-              t.$slots.pattern ? (n(), s("rect", {
+              t.$slots.pattern ? (n(), r("rect", {
                 key: 0,
-                x: r(N)(
+                x: i(N)(
                   J.value ? c.value.left + c.value.width / 2 - (a.sign === 1 ? 0 : I(a.value) <= 0 ? 1e-4 : I(a.value)) : c.value.left
                 ),
-                y: c.value.top + (x.value + d.value) * o + A.value[o] * T.value,
-                width: r(N)(
+                y: c.value.top + (x.value + d.value) * o + A.value[o] * L.value,
+                width: i(N)(
                   I(a.value) <= 0 ? 1e-4 : I(a.value)
                 ),
                 height: d.value <= 0 ? 1e-4 : d.value,
@@ -1172,14 +1173,14 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
                 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: ee({ animated: e.value.useCssAnimation })
+                class: te({ animated: e.value.useCssAnimation })
               }, null, 10, $l)) : p("", !0),
-              (!a.isChild || a.isLastChild) && e.value.style.chart.layout.separators.show && o !== _.value.length - 1 ? (n(), s("line", {
+              (!a.isChild || a.isLastChild) && e.value.style.chart.layout.separators.show && o !== w.value.length - 1 ? (n(), r("line", {
                 key: 1,
                 x1: E.value,
                 x2: e.value.style.chart.layout.separators.fullWidth ? 0 : c.value.left,
-                y1: d.value + x.value / 2 + c.value.top + (x.value + d.value) * o + A.value[o] * T.value,
-                y2: d.value + x.value / 2 + c.value.top + (x.value + d.value) * o + A.value[o] * T.value,
+                y1: d.value + x.value / 2 + c.value.top + (x.value + d.value) * o + A.value[o] * L.value,
+                y2: d.value + x.value / 2 + c.value.top + (x.value + d.value) * o + A.value[o] * L.value,
                 stroke: e.value.style.chart.layout.separators.color,
                 "stroke-width": e.value.style.chart.layout.separators.strokeWidth,
                 "stroke-linecap": "round",
@@ -1188,7 +1189,7 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
                   animation: "none !important"
                 }
               }, null, 8, Tl)) : p("", !0),
-              J.value && e.value.style.chart.layout.separators.show ? (n(), s("line", {
+              J.value && e.value.style.chart.layout.separators.show ? (n(), r("line", {
                 key: 2,
                 x1: c.value.left + c.value.width / 2,
                 x2: c.value.left + c.value.width / 2,
@@ -1199,165 +1200,165 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
                 "stroke-linecap": "round"
               }, null, 8, Ll)) : p("", !0)
             ]))), 256)),
-            u("g", {
+            s("g", {
               ref_key: "parentLabels",
               ref: ea
             }, [
-              (n(!0), s(B, null, D(_.value, (a, o) => (n(), s("g", Sl, [
-                a.isChild && a.childIndex === 0 && e.value.style.chart.layout.bars.parentLabels.show ? (n(), s("rect", {
+              (n(!0), r(D, null, B(w.value, (a, o) => (n(), r("g", Sl, [
+                a.isChild && a.childIndex === 0 && e.value.style.chart.layout.bars.parentLabels.show ? (n(), r("rect", {
                   key: 0,
                   class: "vue-ui-horizontal-bar-parent-marker",
                   x: 2,
-                  y: oe(a, o).y - e.value.style.chart.layout.bars.parentLabels.fontSize / 1.5,
+                  y: ne(a, o).y - e.value.style.chart.layout.bars.parentLabels.fontSize / 1.5,
                   height: e.value.style.chart.layout.bars.parentLabels.fontSize / 1.5,
                   width: e.value.style.chart.layout.bars.parentLabels.fontSize / 1.5,
                   rx: 1,
                   fill: a.color,
                   style: { animation: "none !important", transition: "none !important" }
                 }, null, 8, Pl)) : p("", !0),
-                a.isChild && a.childIndex === 0 && e.value.style.chart.layout.bars.parentLabels.show ? (n(), s("text", {
+                a.isChild && a.childIndex === 0 && e.value.style.chart.layout.bars.parentLabels.show ? (n(), r("text", {
                   key: 1,
-                  y: oe(a, o).y,
+                  y: ne(a, o).y,
                   "font-size": e.value.style.chart.layout.bars.parentLabels.fontSize,
                   fill: e.value.style.chart.layout.bars.parentLabels.color,
                   x: e.value.style.chart.layout.bars.parentLabels.offsetX + e.value.style.chart.layout.bars.parentLabels.fontSize,
                   "font-weight": e.value.style.chart.layout.bars.parentLabels.bold ? "bold" : "normal",
                   "text-anchor": "start",
-                  innerHTML: r(Ze)({
-                    content: `${xt(a, o)}`,
+                  innerHTML: i(tt)({
+                    content: `${_t(a, o)}`,
                     fontSize: e.value.style.chart.layout.bars.parentLabels.fontSize,
                     fill: e.value.style.chart.layout.bars.parentLabels.color,
                     x: e.value.style.chart.layout.bars.parentLabels.offsetX + e.value.style.chart.layout.bars.parentLabels.fontSize,
-                    y: oe(a, o).y,
+                    y: ne(a, o).y,
                     translateY: !1
                   })
                 }, null, 8, Al)) : p("", !0),
-                a.isChild && a.childIndex === 0 && e.value.style.chart.layout.bars.parentLabels.show ? (n(), s("text", {
+                a.isChild && a.childIndex === 0 && e.value.style.chart.layout.bars.parentLabels.show ? (n(), r("text", {
                   key: 2,
-                  y: oe(a, o).y + r(Ha)(xt(a, o)) * e.value.style.chart.layout.bars.parentLabels.fontSize * 1.1,
+                  y: ne(a, o).y + i(Ha)(_t(a, o)) * e.value.style.chart.layout.bars.parentLabels.fontSize * 1.1,
                   "font-size": e.value.style.chart.layout.bars.parentLabels.fontSize,
                   fill: e.value.style.chart.layout.bars.parentLabels.color,
                   x: e.value.style.chart.layout.bars.parentLabels.offsetX + e.value.style.chart.layout.bars.parentLabels.fontSize,
                   "font-weight": e.value.style.chart.layout.bars.dataLabels.bold ? "bold" : "normal",
                   "text-anchor": "start"
-                }, m(pa(a, o)), 9, zl)) : p("", !0)
+                }, k(pa(a, o)), 9, zl)) : p("", !0)
               ]))), 256))
             ], 512),
-            u("g", {
+            s("g", {
               ref_key: "childLabels",
-              ref: Ae
+              ref: Ie
             }, [
-              (n(!0), s(B, null, D(ra.value, (a, o) => (n(), s("g", Nl, [
-                (a.isChild || !a.hasChildren) && e.value.style.chart.layout.bars.nameLabels.show ? (n(), s("text", {
+              (n(!0), r(D, null, B(ra.value, (a, o) => (n(), r("g", Nl, [
+                (a.isChild || !a.hasChildren) && e.value.style.chart.layout.bars.nameLabels.show ? (n(), r("text", {
                   key: 0,
                   "text-anchor": "start",
                   x: Math.abs(e.value.style.chart.layout.bars.nameLabels.offsetX),
-                  y: r(N)(c.value.top + (x.value + d.value) * o + d.value / 2 + e.value.style.chart.layout.bars.nameLabels.fontSize / 2 + A.value[o] * T.value),
+                  y: i(N)(c.value.top + (x.value + d.value) * o + d.value / 2 + e.value.style.chart.layout.bars.nameLabels.fontSize / 2 + A.value[o] * L.value),
                   "font-size": e.value.style.chart.layout.bars.nameLabels.fontSize,
                   fill: "transparent",
                   "font-weight": e.value.style.chart.layout.bars.nameLabels.bold ? "bold" : "normal",
                   style: { "user-select": "none" },
-                  innerHTML: r(Ze)({
+                  innerHTML: i(tt)({
                     content: a.name,
                     fontSize: e.value.style.chart.layout.bars.nameLabels.fontSize,
                     fill: "transparent",
                     x: Math.abs(e.value.style.chart.layout.bars.nameLabels.offsetX),
-                    y: r(N)(c.value.top + (x.value + d.value) * o + d.value / 2 + e.value.style.chart.layout.bars.nameLabels.fontSize / 2 + A.value[o] * T.value),
+                    y: i(N)(c.value.top + (x.value + d.value) * o + d.value / 2 + e.value.style.chart.layout.bars.nameLabels.fontSize / 2 + A.value[o] * L.value),
                     translateY: !0
                   })
                 }, null, 8, Il)) : p("", !0)
               ]))), 256))
             ], 512),
-            u("g", null, [
-              (n(!0), s(B, null, D(_.value, (a, o) => (n(), s("g", Vl, [
-                (a.isChild || !a.hasChildren) && e.value.style.chart.layout.bars.nameLabels.show ? (n(), s("text", {
+            s("g", null, [
+              (n(!0), r(D, null, B(w.value, (a, o) => (n(), r("g", Vl, [
+                (a.isChild || !a.hasChildren) && e.value.style.chart.layout.bars.nameLabels.show ? (n(), r("text", {
                   key: 0,
                   "text-anchor": "end",
                   x: c.value.left + e.value.style.chart.layout.bars.nameLabels.offsetX - 6,
-                  y: c.value.top + (x.value + d.value) * o + d.value / 2 + e.value.style.chart.layout.bars.nameLabels.fontSize / 3 + A.value[o] * T.value,
+                  y: c.value.top + (x.value + d.value) * o + d.value / 2 + e.value.style.chart.layout.bars.nameLabels.fontSize / 3 + A.value[o] * L.value,
                   "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",
-                  innerHTML: r(Ze)({
+                  innerHTML: i(tt)({
                     content: a.name,
                     fontSize: e.value.style.chart.layout.bars.nameLabels.fontSize,
                     fill: e.value.style.chart.layout.bars.nameLabels.color,
                     x: c.value.left + e.value.style.chart.layout.bars.nameLabels.offsetX - 6,
-                    y: c.value.top + (x.value + d.value) * o + d.value / 2 + e.value.style.chart.layout.bars.nameLabels.fontSize / 3 + A.value[o] * T.value,
+                    y: c.value.top + (x.value + d.value) * o + d.value / 2 + e.value.style.chart.layout.bars.nameLabels.fontSize / 3 + A.value[o] * L.value,
                     translateY: !0
                   })
                 }, null, 8, Ol)) : p("", !0)
               ]))), 256))
             ]),
-            u("g", {
+            s("g", {
               ref_key: "dataLabels",
-              ref: ze
+              ref: Ve
             }, [
-              (n(!0), s(B, null, D(_.value, (a, o) => (n(), s("g", Fl, [
-                u("text", {
+              (n(!0), r(D, null, B(w.value, (a, o) => (n(), r("g", Fl, [
+                s("text", {
                   x: J.value ? c.value.left + c.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) : Math.min(
                     da(a.value) + 3 + e.value.style.chart.layout.bars.dataLabels.offsetX,
                     c.value.right - 2
                   ),
-                  y: c.value.top + (x.value + d.value) * o + d.value / 2 + A.value[o] * T.value + e.value.style.chart.layout.bars.dataLabels.fontSize / 3,
+                  y: c.value.top + (x.value + d.value) * o + d.value / 2 + A.value[o] * L.value + e.value.style.chart.layout.bars.dataLabels.fontSize / 3,
                   "text-anchor": !J.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"
-                }, m(Tt(a.value, a, o, a.sign)), 9, Ml)
+                }, k(St(a.value, a, o, a.sign)), 9, Ml)
               ]))), 256))
             ], 512),
-            (n(!0), s(B, null, D(_.value, (a, o) => (n(), s("g", null, [
-              u("rect", {
+            (n(!0), r(D, null, B(w.value, (a, o) => (n(), r("g", null, [
+              s("rect", {
                 x: 0,
-                y: c.value.top + (x.value + d.value) * o - x.value / 2 + A.value[o] * T.value,
+                y: c.value.top + (x.value + d.value) * o - x.value / 2 + A.value[o] * L.value,
                 width: E.value,
                 height: d.value + x.value <= 0 ? 1e-4 : d.value + x.value,
-                fill: De.value === a.id ? r(qe)(
+                fill: He.value === a.id ? i(et)(
                   e.value.style.chart.layout.highlighter.color,
                   e.value.style.chart.layout.highlighter.opacity
                 ) : "transparent",
-                onMouseenter: (g) => $t(a, o, "pointer"),
-                onMouseleave: (g) => _t({ datapoint: a, seriesIndex: o }),
-                onClick: (g) => wt({ datapoint: a, seriesIndex: o })
-              }, null, 40, Bl)
+                onMouseenter: (g) => Lt(a, o, "pointer"),
+                onMouseleave: (g) => Tt({ datapoint: a, seriesIndex: o }),
+                onClick: (g) => $t({ datapoint: a, seriesIndex: o })
+              }, null, 40, Dl)
             ]))), 256)),
             y(t.$slots, "svg", {
               svg: {
                 ...W.value,
-                isPrintingImg: r(Fe) | r(Me) | ge.value,
-                isPrintingSvg: be.value
+                isPrintingImg: i(Ee) | i(Re) | Ce.value,
+                isPrintingSvg: xe.value
               }
             }, void 0, !0)
           ], 512)
         ], 46, yl)),
-        t.$slots.hint ? (n(), s("div", Dl, [
-          y(t.$slots, "hint", O(F({ hint: e.value.a11y.translations.keyboardNavigation, isVisible: Ue.value })), void 0, !0)
+        t.$slots.hint ? (n(), r("div", Bl, [
+          y(t.$slots, "hint", O(F({ hint: e.value.a11y.translations.keyboardNavigation, isVisible: je.value })), void 0, !0)
         ])) : p("", !0)
       ]),
-      t.$slots.watermark ? (n(), s("div", El, [
-        y(t.$slots, "watermark", O(F({ isPrinting: r(Fe) || r(Me) || ge.value || be.value })), void 0, !0)
+      t.$slots.watermark ? (n(), r("div", El, [
+        y(t.$slots, "watermark", O(F({ isPrinting: i(Ee) || i(Re) || Ce.value || xe.value })), void 0, !0)
       ])) : p("", !0),
-      e.value.style.chart.legend.show && e.value.style.chart.legend.position === "bottom" ? (n(), s("div", {
+      e.value.style.chart.legend.show && e.value.style.chart.legend.position === "bottom" ? (n(), r("div", {
         key: 7,
         ref_key: "chartLegend",
-        ref: Le
+        ref: Ae
       }, [
-        (n(), H(Dt, {
-          key: `legend_bottom_${Se.value}`,
+        (n(), H(Bt, {
+          key: `legend_bottom_${ze.value}`,
           legendSet: P.value,
-          config: gt.value,
+          config: mt.value,
           isCursorPointer: Y.value,
           onClickMarker: l[1] || (l[1] = ({ legend: a }) => Z(a.id))
-        }, we({
+        }, Te({
           item: f(({ legend: a, index: o }) => [
-            u("div", {
+            s("div", {
               onClick: (g) => Z(a.id),
-              style: b(`opacity:${w.value.includes(a.id) ? 0.5 : 1}`)
-            }, m(a.name) + ": " + m(r(pe)(
+              style: b(`opacity:${_.value.includes(a.id) ? 0.5 : 1}`)
+            }, k(a.name) + ": " + k(i(ge)(
               e.value.style.chart.layout.bars.dataLabels.value.formatter,
               a.value,
-              r(M)({
+              i(M)({
                 p: e.value.style.chart.legend.prefix,
                 v: a.value,
                 s: e.value.style.chart.legend.suffix,
@@ -1367,14 +1368,14 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
             )), 13, Rl)
           ]),
           legendToggle: f(() => [
-            P.value.length > 2 && e.value.style.chart.legend.selectAllToggle.show && !r(me) ? (n(), H(Et, {
+            P.value.length > 2 && e.value.style.chart.legend.selectAllToggle.show && !i(we) ? (n(), H(Et, {
               key: 0,
               backgroundColor: e.value.style.chart.legend.selectAllToggle.backgroundColor,
               color: e.value.style.chart.legend.selectAllToggle.color,
               fontSize: e.value.style.chart.legend.fontSize,
-              checked: w.value.length > 0,
+              checked: _.value.length > 0,
               isCursorPointer: Y.value,
-              onToggle: mt
+              onToggle: Ct
             }, null, 8, ["backgroundColor", "color", "fontSize", "checked", "isCursorPointer"])) : p("", !0)
           ]),
           _: 2
@@ -1382,7 +1383,7 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
           t.$slots.pattern ? {
             name: "legend-pattern",
             fn: f(({ legend: a, index: o }) => [
-              se(Bt, {
+              ie(Dt, {
                 shape: a.shape,
                 radius: 30,
                 stroke: "none",
@@ -1395,17 +1396,17 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
         ]), 1032, ["legendSet", "config", "isCursorPointer"]))
       ], 512)) : p("", !0),
       y(t.$slots, "legend", { legend: P.value }, void 0, !0),
-      t.$slots.source ? (n(), s("div", {
+      t.$slots.source ? (n(), r("div", {
         key: 8,
         ref_key: "source",
-        ref: lt,
+        ref: ut,
         dir: "auto"
       }, [
         y(t.$slots, "source", {}, void 0, !0)
       ], 512)) : p("", !0),
-      se(r(Ut), {
+      ie(i(Ut), {
         teleportTo: e.value.style.chart.tooltip.teleportTo,
-        show: $.value.showTooltip && fe.value && w.value.length < C.dataset.length,
+        show: T.value.showTooltip && be.value && _.value.length < C.dataset.length,
         backgroundColor: e.value.style.chart.tooltip.backgroundColor,
         color: e.value.style.chart.tooltip.color,
         borderRadius: e.value.style.chart.tooltip.borderRadius,
@@ -1416,57 +1417,57 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
         position: e.value.style.chart.tooltip.position,
         offsetY: e.value.style.chart.tooltip.offsetY,
         parent: R.value,
-        content: Te.value,
+        content: Pe.value,
         isFullscreen: Q.value,
         isCustom: e.value.style.chart.tooltip.customFormat && typeof e.value.style.chart.tooltip.customFormat == "function",
         smooth: e.value.style.chart.tooltip.smooth,
         backdropFilter: e.value.style.chart.tooltip.backdropFilter,
         smoothForce: e.value.style.chart.tooltip.smoothForce,
         smoothSnapThreshold: e.value.style.chart.tooltip.smoothSnapThreshold,
-        isA11yMode: Ne.value === "keyboard",
-        a11yPosition: ut.value
+        isA11yMode: Oe.value === "keyboard",
+        a11yPosition: it.value
       }, {
         "tooltip-before": f(() => [
-          y(t.$slots, "tooltip-before", O(F({ ...Ee.value })), void 0, !0)
+          y(t.$slots, "tooltip-before", O(F({ ...Ue.value })), void 0, !0)
         ]),
         "tooltip-after": f(() => [
-          y(t.$slots, "tooltip-after", O(F({ ...Ee.value })), void 0, !0)
+          y(t.$slots, "tooltip-after", O(F({ ...Ue.value })), void 0, !0)
         ]),
         _: 3
       }, 8, ["teleportTo", "show", "backgroundColor", "color", "borderRadius", "borderColor", "borderWidth", "fontSize", "backgroundOpacity", "position", "offsetY", "parent", "content", "isFullscreen", "isCustom", "smooth", "backdropFilter", "smoothForce", "smoothSnapThreshold", "isA11yMode", "a11yPosition"]),
-      $e.value && e.value.userOptions.buttons.table ? (n(), H(Fa(Ce.value.component), Ot({ key: 9 }, Ce.value.props, {
+      Se.value && e.value.userOptions.buttons.table ? (n(), H(Fa($e.value.component), Ot({ key: 9 }, $e.value.props, {
         ref_key: "tableUnit",
-        ref: re,
-        onClose: He
-      }), we({
+        ref: ve,
+        onClose: Ke
+      }), Te({
         content: f(() => [
-          u("div", {
+          s("div", {
             ref_key: "tableContainer",
-            ref: pt,
+            ref: yt,
             class: "vue-ui-vertical-bar-table atom-data-table",
             style: b(`${e.value.table.useDialog ? "" : "max-height: 300px; margin-top: 24px"}`)
           }, [
-            u("div", Xl, [
-              e.value.table.useDialog ? p("", !0) : (n(), s("div", {
+            s("div", Xl, [
+              e.value.table.useDialog ? p("", !0) : (n(), r("div", {
                 key: 0,
                 role: "button",
                 tabindex: "0",
                 style: b(`width:32px; position: absolute; top: 0; right:4px; padding: 0 0px; display: flex; align-items:center;justify-content:center;height: 36px; width: 32px; cursor:${Y.value ? "pointer" : "default"}; background:${e.value.table.th.backgroundColor};`),
-                onClick: He,
-                onKeypress: Ma(He, ["enter"])
+                onClick: Ke,
+                onKeypress: Ma(Ke, ["enter"])
               }, [
-                se(r(Qe), {
+                ie(i(lt), {
                   name: "close",
                   stroke: e.value.table.th.color,
                   "stroke-width": 2
                 }, null, 8, ["stroke"])
               ], 36)),
-              u("div", {
+              s("div", {
                 style: { width: "100%", "container-type": "inline-size" },
-                class: ee({ "vue-ui-responsive": r(ga) })
+                class: te({ "vue-ui-responsive": i(ga) })
               }, [
-                u("table", Hl, [
-                  e.value.table.useDialog ? p("", !0) : (n(), s("caption", {
+                s("table", Hl, [
+                  e.value.table.useDialog ? p("", !0) : (n(), r("caption", {
                     key: 0,
                     style: b({
                       backgroundColor: e.value.table.th.backgroundColor,
@@ -1475,117 +1476,117 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
                     }),
                     class: "vue-ui-data-table__caption"
                   }, [
-                    Ft(m(e.value.style.chart.title.text) + " ", 1),
-                    e.value.style.chart.title.subtitle.text ? (n(), s("span", Ul, m(e.value.style.chart.title.subtitle.text), 1)) : p("", !0)
+                    Ft(k(e.value.style.chart.title.text) + " ", 1),
+                    e.value.style.chart.title.subtitle.text ? (n(), r("span", Ul, k(e.value.style.chart.title.subtitle.text), 1)) : p("", !0)
                   ], 4)),
-                  u("thead", null, [
-                    u("tr", {
+                  s("thead", null, [
+                    s("tr", {
                       role: "row",
                       style: b(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color}`)
                     }, [
-                      (n(!0), s(B, null, D(V.value.head, (a) => (n(), s("th", {
+                      (n(!0), r(D, null, B(V.value.head, (a) => (n(), r("th", {
                         style: b(`outline:${e.value.table.th.outline}`)
                       }, [
-                        u("div", Wl, m(a), 1)
+                        s("div", Wl, k(a), 1)
                       ], 4))), 256))
                     ], 4),
-                    u("tr", null, [
-                      u("th", {
+                    s("tr", null, [
+                      s("th", {
                         style: b(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color};outline:${e.value.table.th.outline}`)
                       }, null, 4),
-                      u("th", {
+                      s("th", {
                         style: b(`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`)
-                      }, " ∑ " + m(e.value.table.td.prefix) + m(isNaN(X.value) ? "" : X.value.toFixed(e.value.table.td.roundingValue)) + m(e.value.table.td.suffix), 5),
-                      u("th", {
+                      }, " ∑ " + k(e.value.table.td.prefix) + k(isNaN(X.value) ? "" : X.value.toFixed(e.value.table.td.roundingValue)) + k(e.value.table.td.suffix), 5),
+                      s("th", {
                         style: b(`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),
-                      u("th", {
+                      s("th", {
                         style: b(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color};outline:${e.value.table.th.outline}`)
                       }, null, 4),
-                      u("th", {
+                      s("th", {
                         style: b(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color};outline:${e.value.table.th.outline}`)
                       }, null, 4),
-                      u("th", {
+                      s("th", {
                         style: b(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color};outline:${e.value.table.th.outline}`)
                       }, null, 4),
-                      u("th", {
+                      s("th", {
                         style: b(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color};outline:${e.value.table.th.outline}`)
                       }, null, 4)
                     ])
                   ]),
-                  u("tbody", null, [
-                    (n(!0), s(B, null, D(V.value.body, (a, o) => (n(), s("tr", {
-                      class: ee({
+                  s("tbody", null, [
+                    (n(!0), r(D, null, B(V.value.body, (a, o) => (n(), r("tr", {
+                      class: te({
                         "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: b(`background:${e.value.table.td.backgroundColor};color:${e.value.table.td.color}`)
                     }, [
-                      u("td", {
+                      s("td", {
                         class: "vue-ui-data-table__tbody__td",
                         style: b(`outline:${e.value.table.td.outline};font-variant-numeric: tabular-nums;`),
                         "data-cell": V.value.head[0] ?? ""
                       }, [
-                        u("div", Kl, [
-                          a.color ? (n(), s("span", {
+                        s("div", Kl, [
+                          a.color ? (n(), r("span", {
                             key: 0,
                             style: b(`color:${a.color};margin-right:3px`)
                           }, "⬤", 4)) : p("", !0),
-                          u("span", null, m(a.parentName), 1)
+                          s("span", null, k(a.parentName), 1)
                         ])
                       ], 12, Gl),
-                      u("td", {
+                      s("td", {
                         class: "vue-ui-data-table__tbody__td",
                         style: b(`outline:${e.value.table.td.outline}`),
                         "data-cell": V.value.head[1] ?? ""
                       }, [
-                        u("div", Yl, m(e.value.table.td.prefix) + m(["", NaN, void 0].includes(a.parentValue) ? "" : a.parentValue.toFixed(
+                        s("div", Yl, k(e.value.table.td.prefix) + k(["", NaN, void 0].includes(a.parentValue) ? "" : a.parentValue.toFixed(
                           e.value.table.td.roundingValue
-                        )) + m(e.value.table.td.suffix), 1)
+                        )) + k(e.value.table.td.suffix), 1)
                       ], 12, jl),
-                      u("td", {
+                      s("td", {
                         class: "vue-ui-data-table__tbody__td",
                         style: b(`outline:${e.value.table.td.outline}`),
                         "data-cell": V.value.head[2] ?? ""
                       }, [
-                        u("div", Zl, m(["", NaN, void 0].includes(a.percentageToTotal) ? "" : `${(a.percentageToTotal * 100).toFixed(
+                        s("div", Zl, k(["", NaN, void 0].includes(a.percentageToTotal) ? "" : `${(a.percentageToTotal * 100).toFixed(
                           e.value.table.td.roundingPercentage
                         )}%`), 1)
                       ], 12, ql),
-                      u("td", {
+                      s("td", {
                         class: "vue-ui-data-table__tbody__td",
                         style: b(`outline:${e.value.table.td.outline}`),
                         "data-cell": V.value.head[3] ?? ""
                       }, [
-                        u("div", Ql, m(a.childName), 1)
+                        s("div", Ql, k(a.childName), 1)
                       ], 12, Jl),
-                      u("td", {
+                      s("td", {
                         class: "vue-ui-data-table__tbody__td",
                         style: b(`outline:${e.value.table.td.outline}`),
                         "data-cell": V.value.head[4] ?? ""
                       }, [
-                        u("div", to, m(e.value.table.td.prefix) + m(["", NaN, void 0].includes(a.childValue) ? "" : a.childValue.toFixed(
+                        s("div", to, k(e.value.table.td.prefix) + k(["", NaN, void 0].includes(a.childValue) ? "" : a.childValue.toFixed(
                           e.value.table.td.roundingValue
-                        )) + m(e.value.table.td.suffix), 1)
+                        )) + k(e.value.table.td.suffix), 1)
                       ], 12, eo),
-                      u("td", {
+                      s("td", {
                         class: "vue-ui-data-table__tbody__td",
                         style: b(`outline:${e.value.table.td.outline}`),
                         "data-cell": V.value.head[5] ?? ""
                       }, [
-                        u("div", lo, m(["", NaN, void 0].includes(
+                        s("div", lo, k(["", NaN, void 0].includes(
                           a.childPercentageToParent
                         ) ? "" : `${(a.childPercentageToParent * 100).toFixed(
                           e.value.table.td.roundingPercentage
                         )}%`), 1)
                       ], 12, ao),
-                      u("td", {
+                      s("td", {
                         class: "vue-ui-data-table__tbody__td",
                         style: b(`outline:${e.value.table.td.outline}`),
                         "data-cell": V.value.head[6] ?? ""
                       }, [
-                        u("div", no, m(["", NaN, void 0].includes(
+                        s("div", no, k(["", NaN, void 0].includes(
                           a.childPercentageToTotal
                         ) ? "" : `${(a.childPercentageToTotal * 100).toFixed(
                           e.value.table.td.roundingPercentage
@@ -1603,22 +1604,22 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
         e.value.table.useDialog ? {
           name: "title",
           fn: f(() => [
-            Ft(m(Ce.value.title), 1)
+            Ft(k($e.value.title), 1)
           ]),
           key: "0"
         } : void 0,
         e.value.table.useDialog ? {
           name: "actions",
           fn: f(() => [
-            u("button", {
+            s("button", {
               tabindex: "0",
               class: "vue-ui-user-options-button",
-              onClick: l[2] || (l[2] = (a) => Re(e.value.userOptions.callbacks.csv)),
+              onClick: l[2] || (l[2] = (a) => We(e.value.userOptions.callbacks.csv)),
               style: b({ cursor: Y.value ? "pointer" : "default" })
             }, [
-              se(r(Qe), {
+              ie(i(lt), {
                 name: "fileCsv",
-                stroke: Ce.value.props.color
+                stroke: $e.value.props.color
               }, null, 8, ["stroke"])
             ], 4)
           ]),
@@ -1626,11 +1627,11 @@ const dl = ["id"], hl = ["id"], pl = ["onClick"], fl = { style: { position: "rel
         } : void 0
       ]), 1040)) : p("", !0),
       y(t.$slots, "skeleton", {}, () => [
-        r(me) ? (n(), H(Qa, { key: 0 })) : p("", !0)
+        i(we) ? (n(), H(Qa, { key: 0 })) : p("", !0)
       ], !0)
     ], 46, dl));
   }
-}, Po = /* @__PURE__ */ cl(uo, [["__scopeId", "data-v-342a1331"]]);
+}, Po = /* @__PURE__ */ cl(uo, [["__scopeId", "data-v-5fde1ef4"]]);
 export {
   Po as default
 };