vue-data-ui 3.5.0 → 3.5.1

package/dist/{vue-ui-vertical-bar-D8dtM8sw.js → vue-ui-vertical-bar-ZU1GCbX0.js}

@@ -1,24 +1,24 @@
-import { useCssVars as Zt, defineAsyncComponent as Q, useSlots as ea, computed as f, ref as i, toRefs as ta, watch as ze, shallowRef as dt, onMounted as Ve, nextTick as he, onBeforeUnmount as aa, createElementBlock as v, openBlock as u, unref as s, normalizeStyle as d, normalizeClass as G, createBlock as W, createCommentVNode as y, renderSlot as k, createVNode as J, createSlots as pe, withCtx as b, normalizeProps as Z, guardReactiveProps as ee, createElementVNode as n, toDisplayString as h, Fragment as te, renderList as ae, mergeProps as ht, resolveDynamicComponent as la, withKeys as oa, createTextVNode as pt } from "vue";
-import { c as na, t as ua, b as sa, p as H, O as Oe, e as ra, x as P, o as Ie, f as ue, h as Fe, a as se, d as M, X as ia, s as Be, i as va, P as ca, Q as da, G as ha, H as pa } from "./lib-C_mNZmhD.js";
+import { useCssVars as Zt, defineAsyncComponent as Z, useSlots as ea, computed as g, ref as i, toRefs as ta, watch as ze, shallowRef as ct, onMounted as Ve, nextTick as he, onBeforeUnmount as aa, createElementBlock as v, openBlock as u, unref as s, normalizeStyle as c, normalizeClass as H, createBlock as j, createCommentVNode as m, renderSlot as y, createVNode as ee, withCtx as h, normalizeProps as O, guardReactiveProps as I, createSlots as pe, createElementVNode as n, toDisplayString as p, Fragment as te, renderList as ae, mergeProps as ht, resolveDynamicComponent as la, withKeys as oa, createTextVNode as pt } from "vue";
+import { c as na, t as ua, b as sa, p as q, O as Oe, e as ra, x as P, o as Ie, f as ue, h as Fe, a as se, d as R, X as ia, s as Be, i as va, P as da, Q as ca, G as ha, H as pa } from "./lib-C_mNZmhD.js";
 import { t as fa, u as ga } from "./useResponsive-DfdjqQps.js";
-import { u as ya, a as ft } from "./useNestedProp-BjZe1Y85.js";
+import { u as ya, a as ft } from "./useNestedProp-DjGXw6S9.js";
 import { u as ba, B as ma } from "./BaseScanner-BgWxam9d.js";
 import { u as ka } from "./usePrinter-DTzqpYKF.js";
 import { u as xa } from "./useSvgExport-DrjCWun4.js";
 import { u as wa } from "./useTableResponsive-Cbx-ACcP.js";
-import { u as _a } from "./useUserOptionState-BIvW1Kz7.js";
-import { u as $a } from "./useChartAccessibility-9icAAmYg.js";
+import { u as $a } from "./useUserOptionState-BIvW1Kz7.js";
+import { u as _a } from "./useChartAccessibility-9icAAmYg.js";
 import { t as Ca } from "./themes-AUNCOb2G.js";
 import gt from "./Legend-G6GMcdAc.js";
-import Ta from "./vue-ui-accordion-CZ0thhxa.js";
-import Sa from "./Title-l36lOBMx.js";
+import Ta from "./vue-ui-accordion-CqhVCfc2.js";
+import Sa from "./Title-isbiM8i8.js";
 import { _ as yt } from "./Shape-CNXKB8O0.js";
 import La from "./img-BecE5qXd.js";
 import { _ as Pa } from "./_plugin-vue_export-helper-CHgC5LLL.js";
 const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "width", "height"], Oa = ["id"], Ia = ["stop-color"], Fa = ["stop-color"], Ba = { key: 1 }, Ma = ["x", "y", "width", "height", "fill", "rx"], Da = ["x", "y", "width", "height", "fill", "rx", "stroke", "stroke-width"], Ra = ["x", "y", "width", "height", "fill", "rx", "stroke", "stroke-width"], Ea = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Ua = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Xa = { class: "vue-ui-horizontal-bar-child-label" }, Ga = ["x", "y", "text-anchor", "font-size", "fill", "font-weight"], Wa = ["x", "y", "font-size", "fill", "font-weight"], Ha = { class: "vue-ui-horizontal-bar-parent-label" }, ja = ["x", "y", "font-size", "fill", "font-weight"], qa = ["x", "y", "font-size", "fill", "font-weight"], Ya = ["x", "y", "width", "height", "fill", "onMouseenter", "onMouseleave", "onClick"], Ka = {
   key: 5,
   class: "vue-data-ui-watermark"
-}, Qa = ["onClick"], Ja = { style: "width:100%;padding-top: 36px;position:relative" }, Za = { class: "vue-ui-data-table" }, el = { key: 0 }, tl = { style: { width: "100%" } }, al = ["data-cell"], ll = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, ol = ["data-cell"], nl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, ul = ["data-cell"], sl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, rl = ["data-cell"], il = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, vl = ["data-cell"], cl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, dl = ["data-cell"], hl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, pl = ["data-cell"], fl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, gl = {
+}, Qa = ["onClick"], Ja = { style: "width:100%;padding-top: 36px;position:relative" }, Za = { class: "vue-ui-data-table" }, el = { key: 0 }, tl = { style: { width: "100%" } }, al = ["data-cell"], ll = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, ol = ["data-cell"], nl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, ul = ["data-cell"], sl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, rl = ["data-cell"], il = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, vl = ["data-cell"], dl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, cl = ["data-cell"], hl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, pl = ["data-cell"], fl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, gl = {
   __name: "vue-ui-vertical-bar",
   props: {
     config: {
@@ -37,16 +37,16 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
   emits: ["selectLegend"],
   setup(bt, { expose: mt, emit: kt }) {
     Zt((t) => ({
-      v6fce4bf0: t.tdo
+      bc1c4d4c: t.tdo
     }));
-    const xt = Q(() => import("./Tooltip-oWCO1HKy.js")), Me = Q(() => import("./BaseIcon-BmMbm4d0.js")), wt = Q(() => import("./PenAndPaper-DSvu9dwa.js")), _t = Q(() => import("./UserOptions-CGnQt6Fd.js")), $t = Q(() => import("./PackageVersion-Cyx_s25h.js")), Ct = Q(() => import("./BaseDraggableDialog-ymf2sfB8.js")), { vue_ui_vertical_bar: Tt } = ya(), St = ea(), m = bt, fe = f({
+    const xt = Z(() => import("./Tooltip-oWCO1HKy.js")), Me = Z(() => import("./BaseIcon-BmMbm4d0.js")), wt = Z(() => import("./PenAndPaper-SZQIAgkg.js")), $t = Z(() => import("./UserOptions-CGnQt6Fd.js")), _t = Z(() => import("./PackageVersion-DQvyATVa.js")), Ct = Z(() => import("./BaseDraggableDialog-ymf2sfB8.js")), { vue_ui_vertical_bar: Tt } = ya(), St = ea(), k = bt, fe = g({
       get() {
-        return !!m.dataset && m.dataset.length;
+        return !!k.dataset && k.dataset.length;
       },
       set(t) {
         return t;
       }
-    }), L = i(na()), ge = i(!1), ye = i(""), le = i(0), Lt = i(null), De = i(0), N = i(null), Re = i(null), be = i(null), Ee = i(null), Ue = i(null), Xe = i(0), me = i(0), j = i(null), oe = i(null), ke = i(null), Pt = kt, e = i(Ce()), Nt = f(() => [
+    }), L = i(na()), ge = i(!1), ye = i(""), le = i(0), Lt = i(null), De = i(0), N = i(null), Re = i(null), be = i(null), Ee = i(null), Ue = i(null), Xe = i(0), me = i(0), Y = i(null), oe = i(null), ke = i(null), Pt = kt, e = i(Ce()), Nt = g(() => [
       { name: "", value: 6, color: "#d9d9d9" },
       { name: "", value: 5, color: "#d9d9d9" },
       { name: "", value: 4, color: "#d9d9d9" },
@@ -54,12 +54,12 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
       { name: "", value: 2, color: "#d9d9d9" },
       { name: "", value: 1, color: "#d9d9d9" }
     ]), { loading: Ge, FINAL_DATASET: xe, manualLoading: we } = ba({
-      ...ta(m),
+      ...ta(k),
       FINAL_CONFIG: e,
       prepareConfig: Ce,
       callback: () => {
         Promise.resolve().then(async () => {
-          Y(), $.value.showTable = e.value.table.show, await F();
+          Q(), _.value.showTable = e.value.table.show, await M();
         });
       },
       skeletonDataset: Nt.value,
@@ -109,57 +109,57 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
           }
         }
       })
-    }), { userOptionsVisible: _e, setUserOptionsVisibility: We, keepUserOptionState: He } = _a({ config: e.value }), { svgRef: $e } = $a({ config: e.value.style.chart.title });
+    }), { userOptionsVisible: $e, setUserOptionsVisibility: We, keepUserOptionState: He } = $a({ config: e.value }), { svgRef: _e } = _a({ config: e.value.style.chart.title });
     function Ce() {
       const t = ft({
-        userConfig: m.config,
+        userConfig: k.config,
         defaultConfig: Tt
       });
       let l = {};
       return t.theme ? l = {
         ...ft({
-          userConfig: Ca.vue_ui_vertical_bar[t.theme] || m.config,
+          userConfig: Ca.vue_ui_vertical_bar[t.theme] || k.config,
           defaultConfig: t
         }),
-        customPalette: sa[t.theme] || H
-      } : l = t, m.config && Oe(m.config, "events.datapointEnter") ? l.events.datapointEnter = m.config.events.datapointEnter : l.events.datapointEnter = null, m.config && Oe(m.config, "events.datapointLeave") ? l.events.datapointLeave = m.config.events.datapointLeave : l.events.datapointLeave = null, m.config && Oe(m.config, "events.datapointClick") ? l.events.datapointClick = m.config.events.datapointClick : l.events.datapointClick = null, l;
+        customPalette: sa[t.theme] || q
+      } : l = t, k.config && Oe(k.config, "events.datapointEnter") ? l.events.datapointEnter = k.config.events.datapointEnter : l.events.datapointEnter = null, k.config && Oe(k.config, "events.datapointLeave") ? l.events.datapointLeave = k.config.events.datapointLeave : l.events.datapointLeave = null, k.config && Oe(k.config, "events.datapointClick") ? l.events.datapointClick = k.config.events.datapointClick : l.events.datapointClick = null, l;
     }
-    ze(() => m.config, (t) => {
-      Ge.value || (e.value = Ce()), _e.value = !e.value.userOptions.showOnChartHover, et(), Xe.value += 1, me.value += 1, p.value = e.value.style.chart.layout.bars.height, x.value = e.value.style.chart.layout.bars.gap, $.value.showTable = e.value.table.show, $.value.sortDesc = e.value.style.chart.layout.bars.sort === "desc", $.value.showTooltip = e.value.style.chart.tooltip.show;
-    }, { deep: !0 }), ze(() => m.dataset, (t) => {
-      Array.isArray(t) && t.length > 0 && (we.value = !1), Y();
+    ze(() => k.config, (t) => {
+      Ge.value || (e.value = Ce()), $e.value = !e.value.userOptions.showOnChartHover, et(), Xe.value += 1, me.value += 1, f.value = e.value.style.chart.layout.bars.height, x.value = e.value.style.chart.layout.bars.gap, _.value.showTable = e.value.table.show, _.value.sortDesc = e.value.style.chart.layout.bars.sort === "desc", _.value.showTooltip = e.value.style.chart.tooltip.show;
+    }, { deep: !0 }), ze(() => k.dataset, (t) => {
+      Array.isArray(t) && t.length > 0 && (we.value = !1), Q();
     }, { deep: !0 });
     const { isPrinting: je, isImaging: qe, generatePdf: Ye, generateImage: Ke } = ka({
       elementId: `vue-ui-vertical-bar_${L.value}`,
       fileName: e.value.style.chart.title.text || "vue-ui-vertical-bar",
       options: e.value.userOptions.print
-    }), At = f(() => e.value.userOptions.show && !e.value.style.chart.title.text), Qe = f(() => ra(e.value.customPalette)), Je = i(null), zt = f(() => e.value.table.responsiveBreakpoint), I = dt(null), q = dt(null), re = i("0 0 10 10"), A = f(() => {
+    }), At = g(() => e.value.userOptions.show && !e.value.style.chart.title.text), Qe = g(() => ra(e.value.customPalette)), Je = i(null), zt = g(() => e.value.table.responsiveBreakpoint), B = ct(null), K = ct(null), re = i("0 0 10 10"), A = g(() => {
       const [t, l, a, o] = re.value.split(" ").map(Number);
       return { x: t, y: l, width: a, height: o };
     });
     Ve(async () => {
-      await he(), et(), F();
+      await he(), et(), M();
     });
-    async function F() {
-      if (re.value = `0 0 ${C.value.width} ${r.value.fullHeight}`, !e.value.autoSize || !j.value) return;
-      const t = j.value.querySelectorAll(".vue-ui-horizontal-bar-parent-label"), l = j.value.querySelectorAll(".vue-ui-horizontal-bar-child-label");
+    async function M() {
+      if (re.value = `0 0 ${C.value.width} ${r.value.fullHeight}`, !e.value.autoSize || !Y.value) return;
+      const t = Y.value.querySelectorAll(".vue-ui-horizontal-bar-parent-label"), l = Y.value.querySelectorAll(".vue-ui-horizontal-bar-child-label");
       if (t && t.length) {
-        const g = Math.max(...Array.from(t).flatMap((c) => {
-          const w = c.querySelectorAll("text");
-          return w.length ? Array.from(w).map((K) => K.getBBox().width) : 0;
-        })), _ = Math.max(...Array.from(l).flatMap((c) => {
-          const w = c.querySelectorAll("text");
-          return w.length ? Array.from(w).map((K) => K.getBBox().width) : 0;
+        const b = Math.max(...Array.from(t).flatMap((d) => {
+          const w = d.querySelectorAll("text");
+          return w.length ? Array.from(w).map((J) => J.getBBox().width) : 0;
+        })), $ = Math.max(...Array.from(l).flatMap((d) => {
+          const w = d.querySelectorAll("text");
+          return w.length ? Array.from(w).map((J) => J.getBBox().width) : 0;
         }));
-        Array.from(t).forEach((c) => {
-          const w = c.querySelectorAll("text");
-          Array.from(w).forEach(async (K) => {
-            K.setAttribute("x", 0), K.setAttribute("x", P(-g - _));
+        Array.from(t).forEach((d) => {
+          const w = d.querySelectorAll("text");
+          Array.from(w).forEach(async (J) => {
+            J.setAttribute("x", 0), J.setAttribute("x", P(-b - $));
           });
         });
       }
       await he();
-      const a = j.value ? j.value.getBBox() : 0, o = e.value.style.chart.layout.bars.dataLabels.offsetX;
+      const a = Y.value ? Y.value.getBBox() : 0, o = e.value.style.chart.layout.bars.dataLabels.offsetX;
       re.value = [
         a.x + -o,
         0,
@@ -174,20 +174,20 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
           const { width: a, height: o } = l.contentRect;
           if (a > 0 && o > 0) {
             Promise.resolve().then(async () => {
-              Y(), await F();
+              Q(), await M();
             });
             break;
           }
         }
       }), Ze.observe(N.value.parentElement));
     });
-    const ie = f(() => !!e.value.debug), Te = i(0);
+    const ie = g(() => !!e.value.debug), Te = i(0);
     function et() {
-      if (Ie(m.dataset) && (ue({
+      if (Ie(k.dataset) && (ue({
         componentName: "VueUiVerticalBar",
         type: "dataset",
         debug: ie.value
-      }), fe.value = !1, we.value = !0), le.value = xe.value.flatMap((t) => t.children && t.children.length > 0 ? t.children.length : 1).reduce((t, l) => t + l, 0), Ie(m.dataset) || (we.value = e.value.loading), e.value.responsive) {
+      }), fe.value = !1, we.value = !0), le.value = xe.value.flatMap((t) => t.children && t.children.length > 0 ? t.children.length : 1).reduce((t, l) => t + l, 0), Ie(k.dataset) || (we.value = e.value.loading), e.value.responsive) {
         const t = fa(() => {
           const { width: l, height: a } = ga({
             chart: N.value,
@@ -199,20 +199,20 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
           Te.value = a / 3, requestAnimationFrame(async () => {
             lt.value = l;
             const o = x.value * (le.value - 1);
-            p.value = (a - o) / le.value, await he(), F();
+            f.value = (a - o) / le.value, await he(), M();
           });
         });
-        I.value && (q.value && I.value.unobserve(q.value), I.value.disconnect()), I.value = new ResizeObserver(t), q.value = N.value.parentNode, I.value.observe(q.value), e.value.autoSize && F();
+        B.value && (K.value && B.value.unobserve(K.value), B.value.disconnect()), B.value = new ResizeObserver(t), K.value = N.value.parentNode, B.value.observe(K.value), e.value.autoSize && M();
       }
     }
     aa(() => {
-      I.value && (q.value && I.value.unobserve(q.value), I.value.disconnect());
+      B.value && (K.value && B.value.unobserve(K.value), B.value.disconnect());
     });
-    const $ = i({
+    const _ = i({
       showTable: e.value.table.show,
       sortDesc: e.value.style.chart.layout.bars.sort === "desc",
       showTooltip: e.value.style.chart.tooltip.show
-    }), tt = f(() => $.value.sortDesc), z = f(() => (xe.value.forEach((t, l) => {
+    }), tt = g(() => _.value.sortDesc), z = g(() => (xe.value.forEach((t, l) => {
       !t.value && !t.children && ue({
         componentName: "VueUiVerticalBar",
         type: "datasetAttributeEmpty",
@@ -234,47 +234,47 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
         });
       }));
     }), xe.value.map((t, l) => {
-      const a = `vertical_parent_${l}_${L.value}`, o = t.children && t.children.length > 0, g = P(t.value ? t.value : o ? t.children.map((c) => c.value || 0).reduce((c, w) => c + w, 0) : 0), _ = g >= 0 ? 1 : -1;
+      const a = `vertical_parent_${l}_${L.value}`, o = t.children && t.children.length > 0, b = P(t.value ? t.value : o ? t.children.map((d) => d.value || 0).reduce((d, w) => d + w, 0) : 0), $ = b >= 0 ? 1 : -1;
       return {
         ...t,
         id: a,
         absoluteIndex: l,
         shape: "square",
         opacity: T.value.includes(a) ? 0.5 : 1,
-        value: Math.abs(g),
-        sign: _,
+        value: Math.abs(b),
+        sign: $,
         hasChildren: o,
         isChild: !1,
-        segregate: () => D(a),
+        segregate: () => E(a),
         isSegregated: T.value.includes(a),
-        color: Fe(t.color) || Qe.value[l] || H[l] || H[l % H.length],
-        children: !t.children || !t.children.length ? [] : t.children.toSorted(ve.value ? () => 0 : (c, w) => tt.value ? w.value - c.value : c.value - w.value).map((c, w) => ({
-          ...c,
-          value: P(Math.abs(c.value)),
+        color: Fe(t.color) || Qe.value[l] || q[l] || q[l % q.length],
+        children: !t.children || !t.children.length ? [] : t.children.toSorted(ve.value ? () => 0 : (d, w) => tt.value ? w.value - d.value : d.value - w.value).map((d, w) => ({
+          ...d,
+          value: P(Math.abs(d.value)),
           absoluteIndex: l,
-          sign: c.value >= 0 ? 1 : -1,
+          sign: d.value >= 0 ? 1 : -1,
           isChild: !0,
           parentId: a,
           parentName: t.name,
-          parentValue: g,
-          parentSign: _,
+          parentValue: b,
+          parentSign: $,
           id: `vertical_child_${l}_${w}_${L.value}`,
           childIndex: w,
-          color: Fe(c.color) || Fe(t.color) || Qe.value[l] || H[l] || H[l % H.length]
-        })).map((c, w) => ({
-          ...c,
+          color: Fe(d.color) || Fe(t.color) || Qe.value[l] || q[l] || q[l % q.length]
+        })).map((d, w) => ({
+          ...d,
           isFirstChild: w === 0,
           isLastChild: w === t.children.length - 1
         }))
       };
-    }).toSorted(ve.value ? () => 0 : (t, l) => tt.value ? l.value - t.value : t.value - l.value))), at = f(() => ({
+    }).toSorted(ve.value ? () => 0 : (t, l) => tt.value ? l.value - t.value : t.value - l.value))), at = g(() => ({
       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" : ""
-    })), p = i(e.value.style.chart.layout.bars.height), x = i(e.value.style.chart.layout.bars.gap), Vt = f(() => (p.value + x.value) * le.value), lt = i(512), C = f(() => ({
+    })), f = i(e.value.style.chart.layout.bars.height), x = i(e.value.style.chart.layout.bars.gap), Vt = g(() => (f.value + x.value) * le.value), lt = i(512), C = g(() => ({
       width: lt.value,
       height: Vt.value,
       padding: {
@@ -283,7 +283,7 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
         right: (e.value.autoSize ? 0 : 64) + e.value.style.chart.layout.bars.paddingRight,
         bottom: 12
       }
-    })), r = f(() => ({
+    })), r = g(() => ({
       fullHeight: C.value.padding.top + C.value.padding.bottom + C.value.height,
       top: C.value.padding.top,
       left: C.value.padding.left,
@@ -291,18 +291,18 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
       bottom: C.value.padding.top + C.value.height,
       width: C.value.width - (C.value.padding.left + C.value.padding.right)
     }));
-    async function Y() {
-      le.value = R.value.flatMap((t) => t.children && t.children.length > 0 ? t.children.length : 1).reduce((t, l) => t + l, 0), e.value.autoSize && await F();
+    async function Q() {
+      le.value = U.value.flatMap((t) => t.children && t.children.length > 0 ? t.children.length : 1).reduce((t, l) => t + l, 0), e.value.autoSize && await M();
     }
     const T = i([]);
-    async function D(t) {
+    async function E(t) {
       if (T.value.includes(t))
         T.value = T.value.filter((l) => l !== t);
       else {
         if (T.value.length === z.value.length - 1) return;
         T.value.push(t);
       }
-      Y(), await he(), e.value.autoSize && F(), Pt("selectLegend", R.value);
+      Q(), await he(), e.value.autoSize && M(), Pt("selectLegend", U.value);
     }
     function ot(t) {
       if (!z.value.length)
@@ -312,40 +312,40 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
     }
     function Ot(t) {
       const l = ot(t);
-      l !== null && T.value.includes(l.id) && D(l.id);
+      l !== null && T.value.includes(l.id) && E(l.id);
     }
     function It(t) {
       const l = ot(t);
-      l !== null && (T.value.includes(l.id) || D(l.id));
+      l !== null && (T.value.includes(l.id) || E(l.id));
     }
-    const R = f(() => z.value.filter((t) => !T.value.includes(t.id))), O = f(() => R.value.map((t) => Math.abs(t.value)).reduce((t, l) => t + l, 0));
+    const U = g(() => z.value.filter((t) => !T.value.includes(t.id))), F = g(() => U.value.map((t) => Math.abs(t.value)).reduce((t, l) => t + l, 0));
     function nt(t, l = !1, a = 0) {
-      return l ? M({
-        v: P(Math.abs(t) / O.value * 100),
+      return l ? R({
+        v: P(Math.abs(t) / F.value * 100),
         s: "%",
         r: a
-      }) : Math.abs(t) / O.value;
+      }) : Math.abs(t) / F.value;
     }
-    const E = f(() => R.value.flatMap((t) => t.hasChildren ? t.children : t)), U = f(() => E.value.map((t) => t.sign).includes(-1)), Ft = f(() => Math.max(...R.value.flatMap((t) => t.children && t.children.length ? Math.max(...t.children.map((l) => l.value)) : t.value)));
+    const X = g(() => U.value.flatMap((t) => t.hasChildren ? t.children : t)), G = g(() => X.value.map((t) => t.sign).includes(-1)), Ft = g(() => Math.max(...U.value.flatMap((t) => t.children && t.children.length ? Math.max(...t.children.map((l) => l.value)) : t.value)));
     function S(t) {
       const l = t / Ft.value;
-      return r.value.width / (U.value ? 2 : 1) * l;
+      return r.value.width / (G.value ? 2 : 1) * l;
     }
     function Bt(t) {
       return S(t) + r.value.left;
     }
     function ne(t, l) {
-      const a = R.value.find((_) => _.id === t.parentId), o = r.value.top + (x.value + p.value) * l, g = a.children.length * (x.value + p.value);
+      const a = U.value.find(($) => $.id === t.parentId), o = r.value.top + (x.value + f.value) * l, b = a.children.length * (x.value + f.value);
       return {
-        y: o + g / 2 - e.value.style.chart.layout.bars.parentLabels.fontSize,
+        y: o + b / 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 / O.value) ? "" : nt(a.value, !0, e.value.style.chart.layout.bars.dataLabels.percentage.roundingPercentage),
+        percentageToTotal: isNaN(a.value / F.value) ? "" : nt(a.value, !0, e.value.style.chart.layout.bars.dataLabels.percentage.roundingPercentage),
         sign: a.sign
       };
     }
     function Mt() {
-      return R.value;
+      return U.value;
     }
     const Se = i(null), Le = i(null);
     function Dt({ datapoint: t, seriesIndex: l }) {
@@ -362,35 +362,35 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
         config: e.value
       }, ge.value = !0, Se.value = t.id;
       let a = "";
-      const o = t.isChild ? t.parentName : t.name, g = t.isChild ? t.name : "", _ = e.value.style.chart.tooltip.customFormat;
-      ha(_) && pa(() => _({
+      const o = t.isChild ? t.parentName : t.name, b = t.isChild ? t.name : "", $ = e.value.style.chart.tooltip.customFormat;
+      ha($) && pa(() => $({
         datapoint: t,
         series: z.value,
         config: e.value,
         seriesIndex: l
-      })) ? ye.value = _({
+      })) ? ye.value = $({
         datapoint: t,
         series: z.value,
         config: e.value,
         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 60 60" height="14" width="14"><rect x="0" y="0" height="60" width="60" rx="5" stroke="none" fill="${t.color}"/>${St.pattern ? `<rect x="0" y="0" height="60" width="60" rx="5" stroke="none" fill="url(#pattern_${L.value}_${t.absoluteIndex})"/>` : ""}</svg> ${o}</div>
-                ${g ? `<div>${g}</div>` : ""}
+                ${b ? `<div>${b}</div>` : ""}
             </div>`, e.value.style.chart.tooltip.showValue && (a += `<div>${e.value.translations.value}: <b>${se(
         e.value.style.chart.layout.bars.dataLabels.value.formatter,
         t.sign === 1 ? t.value : -t.value,
-        M({
+        R({
           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>${M({
-        v: Math.abs(t.value) / O.value * 100,
+      )}</b></div>`), e.value.style.chart.tooltip.showPercentage && (a += `<div>${e.value.translations.percentageToTotal} : <b>${R({
+        v: Math.abs(t.value) / F.value * 100,
         s: "%",
         r: e.value.style.chart.tooltip.roundingPercentage
-      })}</b></div>`, t.isChild && (a += `<div>${e.value.translations.percentageToSerie}: <b>${M({
+      })}</b></div>`, t.isChild && (a += `<div>${e.value.translations.percentageToSerie}: <b>${R({
         v: Math.abs(t.value) / Math.abs(t.parentValue) * 100,
         s: "%",
         r: e.value.style.chart.tooltip.roundingPercentage
@@ -399,20 +399,20 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
     function ut(t, l, a, o) {
       if (!e.value.style.chart.layout.bars.dataLabels.value.show)
         return "";
-      const g = se(
+      const b = se(
         e.value.style.chart.layout.bars.dataLabels.value.formatter,
         P(o === -1 && t >= 0 ? -t : t),
-        M({
+        R({
           p: e.value.style.chart.layout.bars.dataLabels.value.prefix,
           v: P(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 }
-      ), _ = `(${nt(t, !0, e.value.style.chart.layout.bars.dataLabels.percentage.roundingPercentage)})`;
-      return `${g}${e.value.style.chart.layout.bars.dataLabels.percentage.show ? ` ${_}` : ""}`;
+      ), $ = `(${nt(t, !0, e.value.style.chart.layout.bars.dataLabels.percentage.roundingPercentage)})`;
+      return `${b}${e.value.style.chart.layout.bars.dataLabels.percentage.show ? ` ${$}` : ""}`;
     }
-    const V = f(() => {
+    const V = g(() => {
       const t = [
         e.value.translations.parentName,
         e.value.translations.value,
@@ -421,15 +421,15 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
         e.value.translations.value,
         e.value.translations.percentageToSerie,
         e.value.translations.percentageToTotal
-      ], l = E.value.map((a) => a.isChild ? a.isFirstChild ? {
+      ], l = X.value.map((a) => a.isChild ? a.isFirstChild ? {
         color: a.color,
         parentName: a.parentName,
         parentValue: a.parentValue,
-        percentageToTotal: a.parentValue / O.value,
+        percentageToTotal: a.parentValue / F.value,
         childName: a.name,
         childValue: a.sign === 1 ? a.value : -a.value,
         childPercentageToParent: Math.abs(a.value) / Math.abs(a.parentValue),
-        childPercentageToTotal: Math.abs(a.value) / O.value
+        childPercentageToTotal: Math.abs(a.value) / F.value
       } : {
         color: "",
         parentName: "",
@@ -438,12 +438,12 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
         childName: a.name,
         childValue: a.sign === 1 ? a.value : -a.value,
         childPercentageToParent: Math.abs(a.value) / Math.abs(a.parentValue),
-        childPercentageToTotal: Math.abs(a.value) / O.value
+        childPercentageToTotal: Math.abs(a.value) / F.value
       } : {
         color: a.color,
         parentName: a.name,
         parentValue: a.sign === 1 ? a.value : -a.value,
-        percentageToTotal: Math.abs(a.value) / O.value,
+        percentageToTotal: Math.abs(a.value) / F.value,
         childName: "",
         childValue: "",
         childPercentageToParent: "",
@@ -452,64 +452,64 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
       return { head: t, body: l };
     });
     function Pe(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((c) => [
-        c.parentName,
-        c.parentValue,
-        c.percentageToTotal,
-        c.childName,
-        c.childValue,
-        c.childPercentageToParent,
-        c.childPercentageToTotal
-      ]), g = l.concat([a]).concat(o), _ = ca(g);
-      t ? t(_) : da({ csvContent: _, title: e.value.style.chart.title.text || "vue-ui-vertical-bar" });
+      const l = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [""]], a = V.value.head, o = V.value.body.map((d) => [
+        d.parentName,
+        d.parentValue,
+        d.percentageToTotal,
+        d.childName,
+        d.childValue,
+        d.childPercentageToParent,
+        d.childPercentageToTotal
+      ]), b = l.concat([a]).concat(o), $ = da(b);
+      t ? t($) : ca({ csvContent: $, title: e.value.style.chart.title.text || "vue-ui-vertical-bar" });
     }
-    const X = i(!1);
+    const W = i(!1);
     function st(t) {
-      X.value = t, De.value += 1;
+      W.value = t, De.value += 1;
     }
     function rt() {
-      $.value.showTable = !$.value.showTable;
+      _.value.showTable = !_.value.showTable;
     }
     const Ut = i({
       none: 0,
       asc: 1,
       desc: 2
-    }), B = i(0), ve = i(!1);
+    }), D = i(0), ve = i(!1);
     Ve(() => {
       ["none", "asc", "desc"].includes(e.value.style.chart.layout.bars.sort) || ue({
         componentName: "VueUiVerticalBar",
         type: "attributeWrongValue",
         property: "style.chart.layout.bars.sort",
         key: e.value.style.chart.layout.bars.sort
-      }), B.value = Ut.value[e.value.style.chart.layout.bars.sort], $.value.sortDesc = B.value === 2, ve.value = B.value === 0;
+      }), D.value = Ut.value[e.value.style.chart.layout.bars.sort], _.value.sortDesc = D.value === 2, ve.value = D.value === 0;
     });
     function Xt() {
-      B.value += 1, B.value > 2 && (B.value = 0);
+      D.value += 1, D.value > 2 && (D.value = 0);
     }
     function it() {
-      Xt(), $.value.sortDesc = B.value === 2, ve.value = B.value === 0, Y();
+      Xt(), _.value.sortDesc = D.value === 2, ve.value = D.value === 0, Q();
     }
     function vt() {
-      $.value.showTooltip = !$.value.showTooltip;
+      _.value.showTooltip = !_.value.showTooltip;
     }
-    const ce = i(!1);
+    const de = i(!1);
     function Ne() {
-      ce.value = !ce.value;
+      de.value = !de.value;
     }
     async function Gt({ scale: t = 2 } = {}) {
       if (!N.value) return;
-      const { width: l, height: a } = N.value.getBoundingClientRect(), o = l / a, { imageUri: g, base64: _ } = await La({ domElement: N.value, base64: !0, img: !0, scale: t });
+      const { width: l, height: a } = N.value.getBoundingClientRect(), o = l / a, { imageUri: b, base64: $ } = await La({ domElement: N.value, base64: !0, img: !0, scale: t });
       return {
-        imageUri: g,
-        base64: _,
+        imageUri: b,
+        base64: $,
         title: e.value.style.chart.title.text,
         width: l,
         height: a,
         aspectRatio: o
       };
     }
-    const de = f(() => {
-      const t = e.value.table.useDialog && !e.value.table.show, l = $.value.showTable;
+    const ce = g(() => {
+      const t = e.value.table.useDialog && !e.value.table.show, l = _.value.showTable;
       return {
         component: t ? Ct : Ta,
         title: `${e.value.style.chart.title.text}${e.value.style.chart.title.subtitle.text ? `: ${e.value.style.chart.title.subtitle.text}` : ""}`,
@@ -518,7 +518,7 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
           color: e.value.table.th.color,
           headerColor: e.value.table.th.color,
           headerBg: e.value.table.th.backgroundColor,
-          isFullscreen: X.value,
+          isFullscreen: W.value,
           fullscreenParent: N.value,
           forcedWidth: Math.min(800, window.innerWidth * 0.8)
         } : {
@@ -538,20 +538,20 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
         }
       };
     });
-    ze(() => $.value.showTable, (t) => {
+    ze(() => _.value.showTable, (t) => {
       e.value.table.show || (t && e.value.table.useDialog && oe.value ? oe.value.open() : "close" in oe.value && oe.value.close());
     });
     const { isResponsive: Wt } = wa(Je, zt);
     function Ae() {
-      $.value.showTable = !1, ke.value && ke.value.setTableIconState(!1);
+      _.value.showTable = !1, ke.value && ke.value.setTableIconState(!1);
     }
-    const Ht = f(() => z.value.map((t, l) => ({
+    const Ht = g(() => z.value.map((t, l) => ({
       ...t,
       shape: "square",
       display: `${t.name}: ${se(
         e.value.style.chart.layout.bars.dataLabels.value.formatter,
         t.value,
-        M({
+        R({
           p: e.value.style.chart.legend.prefix,
           v: t.value,
           s: e.value.style.chart.legend.suffix,
@@ -559,33 +559,33 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
         }),
         { datapoint: t, seriesIndex: l }
       )}`
-    }))), jt = f(() => e.value.style.chart.backgroundColor), qt = f(() => e.value.style.chart.legend), Yt = f(() => e.value.style.chart.title), Kt = f(() => Ht.value.map((t) => ({
+    }))), jt = g(() => e.value.style.chart.backgroundColor), qt = g(() => e.value.style.chart.legend), Yt = g(() => e.value.style.chart.title), Kt = g(() => Ht.value.map((t) => ({
       ...t,
       name: t.display
     }))), { exportSvg: Qt, getSvg: Jt } = xa({
-      svg: $e,
+      svg: _e,
       title: Yt,
       legend: qt,
       legendItems: Kt,
       backgroundColor: jt
     });
-    async function ct({ isCb: t }) {
+    async function dt({ isCb: t }) {
       if (t) {
-        const { blob: l, url: a, text: o, dataUrl: g } = await Jt();
-        e.value.userOptions.callbacks.svg({ blob: l, url: a, text: o, dataUrl: g });
+        const { blob: l, url: a, text: o, dataUrl: b } = await Jt();
+        e.value.userOptions.callbacks.svg({ blob: l, url: a, text: o, dataUrl: b });
       } else
         Qt();
     }
     return mt({
-      autoSize: F,
+      autoSize: M,
       // v3
       getData: Mt,
       getImage: Gt,
-      recalculateHeight: Y,
+      recalculateHeight: Q,
       generatePdf: Ye,
       generateCsv: Pe,
       generateImage: Ke,
-      generateSvg: ct,
+      generateSvg: dt,
       hideSeries: It,
       showSeries: Ot,
       toggleTable: rt,
@@ -594,36 +594,56 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
       toggleAnnotator: Ne,
       toggleFullscreen: st
     }), (t, l) => (u(), v("div", {
-      class: G(`vue-data-ui-component vue-ui-vertical-bar ${X.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"} ${e.value.responsive && e.value.autoSize ? "vue-ui-vertical-bar-autosize" : ""}`),
+      class: H(`vue-data-ui-component vue-ui-vertical-bar ${W.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"} ${e.value.responsive && e.value.autoSize ? "vue-ui-vertical-bar-autosize" : ""}`),
       ref_key: "verticalBarChart",
       ref: N,
       id: `vue-ui-vertical-bar_${L.value}`,
-      style: d(`padding-top:${e.value.responsive && e.value.autoSize ? `${Te.value / 2}px` : "0"}; font-family:${e.value.style.fontFamily};width:100%; text-align:center;background:${e.value.style.chart.backgroundColor};${e.value.responsive ? e.value.autoSize ? `height:calc(100% - ${Te.value}px` : "height: 100%" : ""}`),
+      style: c(`padding-top:${e.value.responsive && e.value.autoSize ? `${Te.value / 2}px` : "0"}; font-family:${e.value.style.fontFamily};width:100%; text-align:center;background:${e.value.style.chart.backgroundColor};${e.value.responsive ? e.value.autoSize ? `height:calc(100% - ${Te.value}px` : "height: 100%" : ""}`),
       onMouseenter: l[3] || (l[3] = () => s(We)(!0)),
       onMouseleave: l[4] || (l[4] = () => s(We)(!1))
     }, [
-      e.value.userOptions.buttons.annotator ? (u(), W(s(wt), {
+      e.value.userOptions.buttons.annotator ? (u(), j(s(wt), {
         key: 0,
-        svgRef: s($e),
+        svgRef: s(_e),
         backgroundColor: e.value.style.chart.backgroundColor,
         color: e.value.style.chart.color,
-        active: ce.value,
+        active: de.value,
         onClose: Ne
-      }, null, 8, ["svgRef", "backgroundColor", "color", "active"])) : y("", !0),
+      }, {
+        "annotator-action-close": h(() => [
+          y(t.$slots, "annotator-action-close", {}, void 0, !0)
+        ]),
+        "annotator-action-color": h(({ color: a }) => [
+          y(t.$slots, "annotator-action-color", O(I({ color: a })), void 0, !0)
+        ]),
+        "annotator-action-draw": h(({ mode: a }) => [
+          y(t.$slots, "annotator-action-draw", O(I({ mode: a })), void 0, !0)
+        ]),
+        "annotator-action-undo": h(({ disabled: a }) => [
+          y(t.$slots, "annotator-action-undo", O(I({ disabled: a })), void 0, !0)
+        ]),
+        "annotator-action-redo": h(({ disabled: a }) => [
+          y(t.$slots, "annotator-action-redo", O(I({ disabled: a })), void 0, !0)
+        ]),
+        "annotator-action-delete": h(({ disabled: a }) => [
+          y(t.$slots, "annotator-action-delete", O(I({ disabled: a })), void 0, !0)
+        ]),
+        _: 3
+      }, 8, ["svgRef", "backgroundColor", "color", "active"])) : m("", !0),
       At.value ? (u(), v("div", {
         key: 1,
         ref_key: "noTitle",
         ref: Ue,
         class: "vue-data-ui-no-title-space",
         style: "height:36px; width: 100%;background:transparent"
-      }, null, 512)) : y("", !0),
+      }, null, 512)) : m("", !0),
       e.value.style.chart.title.text ? (u(), v("div", {
         key: 2,
         ref_key: "chartTitle",
         ref: Re,
         style: "width:100%;background:transparent;padding-bottom:12px"
       }, [
-        (u(), W(Sa, {
+        (u(), j(Sa, {
           key: `title_${Xe.value}`,
           config: {
             title: {
@@ -636,8 +656,8 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
             }
           }
         }, null, 8, ["config"]))
-      ], 512)) : y("", !0),
-      e.value.userOptions.show && fe.value && (s(He) || s(_e)) ? (u(), W(s(_t), {
+      ], 512)) : m("", !0),
+      e.value.userOptions.show && fe.value && (s(He) || s($e)) ? (u(), j(s($t), {
         ref_key: "userOptionsRef",
         ref: ke,
         key: `user_options_${De.value}`,
@@ -654,13 +674,13 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
         hasTable: e.value.userOptions.buttons.table,
         hasSort: e.value.userOptions.buttons.sort,
         hasFullscreen: e.value.userOptions.buttons.fullscreen,
-        isFullscreen: X.value,
-        isTooltip: $.value.showTooltip,
+        isFullscreen: W.value,
+        isTooltip: _.value.showTooltip,
         titles: { ...e.value.userOptions.buttonTitles },
         chartElement: N.value,
         position: e.value.userOptions.position,
         hasAnnotator: e.value.userOptions.buttons.annotator,
-        isAnnotation: ce.value,
+        isAnnotation: de.value,
         callbacks: e.value.userOptions.callbacks,
         printScale: e.value.userOptions.print.scale,
         tableDialog: e.value.table.useDialog,
@@ -668,112 +688,112 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
         onGeneratePdf: s(Ye),
         onGenerateCsv: Pe,
         onGenerateImage: s(Ke),
-        onGenerateSvg: ct,
+        onGenerateSvg: dt,
         onToggleTable: rt,
         onToggleSort: it,
         onToggleTooltip: vt,
         onToggleAnnotator: Ne,
-        style: d({
-          visibility: s(He) ? s(_e) ? "visible" : "hidden" : "visible"
+        style: c({
+          visibility: s(He) ? s($e) ? "visible" : "hidden" : "visible"
         })
       }, pe({ _: 2 }, [
         t.$slots.menuIcon ? {
           name: "menuIcon",
-          fn: b(({ isOpen: a, color: o }) => [
-            k(t.$slots, "menuIcon", Z(ee({ isOpen: a, color: o })), void 0, !0)
+          fn: h(({ isOpen: a, color: o }) => [
+            y(t.$slots, "menuIcon", O(I({ isOpen: a, color: o })), void 0, !0)
           ]),
           key: "0"
         } : void 0,
         t.$slots.optionTooltip ? {
           name: "optionTooltip",
-          fn: b(() => [
-            k(t.$slots, "optionTooltip", {}, void 0, !0)
+          fn: h(() => [
+            y(t.$slots, "optionTooltip", {}, void 0, !0)
           ]),
           key: "1"
         } : void 0,
         t.$slots.optionPdf ? {
           name: "optionPdf",
-          fn: b(() => [
-            k(t.$slots, "optionPdf", {}, void 0, !0)
+          fn: h(() => [
+            y(t.$slots, "optionPdf", {}, void 0, !0)
           ]),
           key: "2"
         } : void 0,
         t.$slots.optionCsv ? {
           name: "optionCsv",
-          fn: b(() => [
-            k(t.$slots, "optionCsv", {}, void 0, !0)
+          fn: h(() => [
+            y(t.$slots, "optionCsv", {}, void 0, !0)
           ]),
           key: "3"
         } : void 0,
         t.$slots.optionImg ? {
           name: "optionImg",
-          fn: b(() => [
-            k(t.$slots, "optionImg", {}, void 0, !0)
+          fn: h(() => [
+            y(t.$slots, "optionImg", {}, void 0, !0)
           ]),
           key: "4"
         } : void 0,
         t.$slots.optionSvg ? {
           name: "optionSvg",
-          fn: b(() => [
-            k(t.$slots, "optionSvg", {}, void 0, !0)
+          fn: h(() => [
+            y(t.$slots, "optionSvg", {}, void 0, !0)
           ]),
           key: "5"
         } : void 0,
         t.$slots.optionTable ? {
           name: "optionTable",
-          fn: b(() => [
-            k(t.$slots, "optionTable", {}, void 0, !0)
+          fn: h(() => [
+            y(t.$slots, "optionTable", {}, void 0, !0)
           ]),
           key: "6"
         } : void 0,
         t.$slots.optionLabels ? {
           name: "optionLabels",
-          fn: b(() => [
-            k(t.$slots, "optionLabels", {}, void 0, !0)
+          fn: h(() => [
+            y(t.$slots, "optionLabels", {}, void 0, !0)
           ]),
           key: "7"
         } : void 0,
         t.$slots.optionSort ? {
           name: "optionSort",
-          fn: b(() => [
-            k(t.$slots, "optionSort", {}, void 0, !0)
+          fn: h(() => [
+            y(t.$slots, "optionSort", {}, void 0, !0)
           ]),
           key: "8"
         } : void 0,
         t.$slots.optionFullscreen ? {
           name: "optionFullscreen",
-          fn: b(({ toggleFullscreen: a, isFullscreen: o }) => [
-            k(t.$slots, "optionFullscreen", Z(ee({ toggleFullscreen: a, isFullscreen: o })), void 0, !0)
+          fn: h(({ toggleFullscreen: a, isFullscreen: o }) => [
+            y(t.$slots, "optionFullscreen", O(I({ toggleFullscreen: a, isFullscreen: o })), void 0, !0)
           ]),
           key: "9"
         } : void 0,
         t.$slots.optionAnnotator ? {
           name: "optionAnnotator",
-          fn: b(({ toggleAnnotator: a, isAnnotator: o }) => [
-            k(t.$slots, "optionAnnotator", Z(ee({ toggleAnnotator: a, isAnnotator: o })), void 0, !0)
+          fn: h(({ toggleAnnotator: a, isAnnotator: o }) => [
+            y(t.$slots, "optionAnnotator", O(I({ toggleAnnotator: a, isAnnotator: o })), void 0, !0)
           ]),
           key: "10"
         } : void 0
-      ]), 1032, ["backgroundColor", "color", "isImaging", "isPrinting", "uid", "hasTooltip", "hasPdf", "hasImg", "hasSvg", "hasXls", "hasTable", "hasSort", "hasFullscreen", "isFullscreen", "isTooltip", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "callbacks", "printScale", "tableDialog", "onGeneratePdf", "onGenerateImage", "style"])) : y("", !0),
+      ]), 1032, ["backgroundColor", "color", "isImaging", "isPrinting", "uid", "hasTooltip", "hasPdf", "hasImg", "hasSvg", "hasXls", "hasTable", "hasSort", "hasFullscreen", "isFullscreen", "isTooltip", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "callbacks", "printScale", "tableDialog", "onGeneratePdf", "onGenerateImage", "style"])) : m("", !0),
       e.value.style.chart.legend.show && e.value.style.chart.legend.position === "top" ? (u(), v("div", {
         key: 4,
         ref_key: "chartLegend",
         ref: be
       }, [
-        (u(), W(gt, {
+        (u(), j(gt, {
           key: `legend_top_${me.value}`,
           legendSet: z.value,
           config: at.value,
-          onClickMarker: l[0] || (l[0] = ({ legend: a }) => D(a.id))
+          onClickMarker: l[0] || (l[0] = ({ legend: a }) => E(a.id))
         }, pe({
-          item: b(({ legend: a, index: o }) => [
+          item: h(({ legend: a, index: o }) => [
             n("div", {
-              onClick: (g) => D(a.id),
-              style: d(`opacity:${T.value.includes(a.id) ? 0.5 : 1}`)
-            }, h(a.name) + ": " + h(s(se)(
+              onClick: (b) => E(a.id),
+              style: c(`opacity:${T.value.includes(a.id) ? 0.5 : 1}`)
+            }, p(a.name) + ": " + p(s(se)(
               e.value.style.chart.layout.bars.dataLabels.value.formatter,
               a.value,
-              s(M)({
+              s(R)({
                 p: e.value.style.chart.legend.prefix,
                 v: a.value,
                 s: e.value.style.chart.legend.suffix,
@@ -786,8 +806,8 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
         }, [
           t.$slots.pattern ? {
             name: "legend-pattern",
-            fn: b(({ legend: a, index: o }) => [
-              J(yt, {
+            fn: h(({ legend: a, index: o }) => [
+              ee(yt, {
                 shape: a.shape,
                 radius: 30,
                 stroke: "none",
@@ -798,21 +818,21 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
             key: "0"
           } : void 0
         ]), 1032, ["legendSet", "config"]))
-      ], 512)) : y("", !0),
+      ], 512)) : m("", !0),
       (u(), v("svg", {
         ref_key: "svgRef",
-        ref: $e,
+        ref: _e,
         xmlns: s(ia),
-        class: G({ "vue-data-ui-fullscreen--on": X.value, "vue-data-ui-fulscreen--off": !X.value }),
+        class: H({ "vue-data-ui-fullscreen--on": W.value, "vue-data-ui-fulscreen--off": !W.value }),
         viewBox: re.value,
-        style: d(`max-width:100%;overflow:visible;background:transparent;color:${e.value.style.chart.color}`)
+        style: c(`max-width:100%;overflow:visible;background:transparent;color:${e.value.style.chart.color}`)
       }, [
         n("g", {
           ref_key: "G",
-          ref: j,
+          ref: Y,
           class: "vue-data-ui-g"
         }, [
-          J(s($t)),
+          ee(s(_t)),
           t.$slots["chart-background"] ? (u(), v("foreignObject", {
             key: 0,
             x: A.value.x,
@@ -823,9 +843,9 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
               pointerEvents: "none"
             }
           }, [
-            k(t.$slots, "chart-background", {}, void 0, !0)
-          ], 8, Va)) : y("", !0),
-          (u(!0), v(te, null, ae(E.value, (a, o) => (u(), v("linearGradient", {
+            y(t.$slots, "chart-background", {}, void 0, !0)
+          ], 8, Va)) : m("", !0),
+          (u(!0), v(te, null, ae(X.value, (a, o) => (u(), v("linearGradient", {
             x1: "0%",
             y1: "0%",
             x2: "100%",
@@ -842,57 +862,57 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
             }, null, 8, Fa)
           ], 8, Oa))), 256)),
           t.$slots.pattern ? (u(), v("g", Ba, [
-            (u(!0), v(te, null, ae(E.value, (a) => (u(), v("defs", null, [
-              k(t.$slots, "pattern", ht({ ref_for: !0 }, { seriesIndex: a.absoluteIndex, patternId: `pattern_${L.value}_${a.absoluteIndex}` }), void 0, !0)
+            (u(!0), v(te, null, ae(X.value, (a) => (u(), v("defs", null, [
+              y(t.$slots, "pattern", ht({ ref_for: !0 }, { seriesIndex: a.absoluteIndex, patternId: `pattern_${L.value}_${a.absoluteIndex}` }), void 0, !0)
             ]))), 256))
-          ])) : y("", !0),
-          (u(!0), v(te, null, ae(E.value, (a, o) => (u(), v("g", null, [
+          ])) : m("", !0),
+          (u(!0), v(te, null, ae(X.value, (a, o) => (u(), v("g", null, [
             n("rect", {
-              x: s(P)(U.value ? r.value.left + r.value.width / 2 - (a.sign === 1 ? 0 : S(a.value) <= 0 ? 1e-4 : S(a.value)) : r.value.left),
-              y: r.value.top + (x.value + p.value) * o,
+              x: s(P)(G.value ? r.value.left + r.value.width / 2 - (a.sign === 1 ? 0 : S(a.value) <= 0 ? 1e-4 : S(a.value)) : r.value.left),
+              y: r.value.top + (x.value + f.value) * o,
               width: s(P)(S(a.value) <= 0 ? 1e-4 : S(a.value)),
-              height: p.value <= 0 ? 1e-4 : p.value,
+              height: f.value <= 0 ? 1e-4 : f.value,
               fill: e.value.style.chart.layout.bars.underlayerColor,
               rx: e.value.style.chart.layout.bars.borderRadius,
-              class: G({ animated: e.value.useCssAnimation })
+              class: H({ animated: e.value.useCssAnimation })
             }, null, 10, Ma)
           ]))), 256)),
-          (u(!0), v(te, null, ae(E.value, (a, o) => (u(), v("g", null, [
+          (u(!0), v(te, null, ae(X.value, (a, o) => (u(), v("g", null, [
             n("rect", {
-              x: s(P)(U.value ? r.value.left + r.value.width / 2 - (a.sign === 1 ? 0 : S(a.value) <= 0 ? 1e-4 : S(a.value)) : r.value.left),
-              y: r.value.top + (x.value + p.value) * o,
+              x: s(P)(G.value ? r.value.left + r.value.width / 2 - (a.sign === 1 ? 0 : S(a.value) <= 0 ? 1e-4 : S(a.value)) : r.value.left),
+              y: r.value.top + (x.value + f.value) * o,
               width: s(P)(S(a.value) <= 0 ? 1e-4 : S(a.value)),
-              height: p.value <= 0 ? 1e-4 : p.value,
+              height: f.value <= 0 ? 1e-4 : f.value,
               fill: e.value.style.chart.layout.bars.useGradient ? `url(#vertical_bar_gradient_${L.value}_${o})` : s(Be)(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: G({ animated: e.value.useCssAnimation })
+              class: H({ animated: e.value.useCssAnimation })
             }, null, 10, Da),
             t.$slots.pattern ? (u(), v("rect", {
               key: 0,
-              x: s(P)(U.value ? r.value.left + r.value.width / 2 - (a.sign === 1 ? 0 : S(a.value) <= 0 ? 1e-4 : S(a.value)) : r.value.left),
-              y: r.value.top + (x.value + p.value) * o,
+              x: s(P)(G.value ? r.value.left + r.value.width / 2 - (a.sign === 1 ? 0 : S(a.value) <= 0 ? 1e-4 : S(a.value)) : r.value.left),
+              y: r.value.top + (x.value + f.value) * o,
               width: s(P)(S(a.value) <= 0 ? 1e-4 : S(a.value)),
-              height: p.value <= 0 ? 1e-4 : p.value,
+              height: f.value <= 0 ? 1e-4 : f.value,
               fill: `url(#pattern_${L.value}_${a.absoluteIndex})`,
               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: G({ animated: e.value.useCssAnimation })
-            }, null, 10, Ra)) : y("", !0),
-            (!a.isChild || a.isLastChild) && e.value.style.chart.layout.separators.show && o !== E.value.length - 1 ? (u(), v("line", {
+              class: H({ animated: e.value.useCssAnimation })
+            }, null, 10, Ra)) : m("", !0),
+            (!a.isChild || a.isLastChild) && e.value.style.chart.layout.separators.show && o !== X.value.length - 1 ? (u(), v("line", {
               key: 1,
               x1: A.value.x,
               x2: e.value.style.chart.layout.separators.fullWidth ? A.value.width - Math.abs(A.value.x) : r.value.left,
-              y1: p.value + x.value / 2 + r.value.top + (x.value + p.value) * o,
-              y2: p.value + x.value / 2 + r.value.top + (x.value + p.value) * o,
+              y1: f.value + x.value / 2 + r.value.top + (x.value + f.value) * o,
+              y2: f.value + x.value / 2 + r.value.top + (x.value + f.value) * o,
               stroke: e.value.style.chart.layout.separators.color,
               "stroke-width": e.value.style.chart.layout.separators.strokeWidth,
               "stroke-linecap": "round",
               style: { transition: "none !important", animation: "none !important" }
-            }, null, 8, Ea)) : y("", !0),
-            U.value && e.value.style.chart.layout.separators.show ? (u(), v("line", {
+            }, null, 8, Ea)) : m("", !0),
+            G.value && e.value.style.chart.layout.separators.show ? (u(), v("line", {
               key: 2,
               x1: r.value.left + r.value.width / 2,
               x2: r.value.left + r.value.width / 2,
@@ -901,25 +921,25 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
               stroke: e.value.style.chart.layout.separators.color,
               "stroke-width": e.value.style.chart.layout.separators.strokeWidth,
               "stroke-linecap": "round"
-            }, null, 8, Ua)) : y("", !0),
+            }, null, 8, Ua)) : m("", !0),
             n("g", Xa, [
               n("text", {
-                x: U.value ? r.value.left + r.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) : Bt(a.value) + 3 + e.value.style.chart.layout.bars.dataLabels.offsetX,
-                y: r.value.top + (x.value + p.value) * o + p.value / 2 + e.value.style.chart.layout.bars.dataLabels.fontSize / 2,
-                "text-anchor": !U.value || a.sign === -1 ? "start" : "end",
+                x: G.value ? r.value.left + r.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) : Bt(a.value) + 3 + e.value.style.chart.layout.bars.dataLabels.offsetX,
+                y: r.value.top + (x.value + f.value) * o + f.value / 2 + e.value.style.chart.layout.bars.dataLabels.fontSize / 2,
+                "text-anchor": !G.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"
-              }, h(ut(a.value, a, o, a.sign)), 9, Ga),
+              }, p(ut(a.value, a, o, a.sign)), 9, Ga),
               (a.isChild || !a.hasChildren) && e.value.style.chart.layout.bars.nameLabels.show ? (u(), v("text", {
                 key: 0,
                 "text-anchor": "end",
                 x: r.value.left - 3 + e.value.style.chart.layout.bars.nameLabels.offsetX,
-                y: r.value.top + (x.value + p.value) * o + p.value / 2 + e.value.style.chart.layout.bars.nameLabels.fontSize / 2,
+                y: r.value.top + (x.value + f.value) * o + f.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"
-              }, h(a.name), 9, Wa)) : y("", !0)
+              }, p(a.name), 9, Wa)) : m("", !0)
             ]),
             n("g", Ha, [
               a.isChild && a.childIndex === 0 && e.value.style.chart.layout.bars.parentLabels.show ? (u(), v("text", {
@@ -930,7 +950,7 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
                 fill: e.value.style.chart.layout.bars.parentLabels.color,
                 "font-weight": e.value.style.chart.layout.bars.parentLabels.bold ? "bold" : "normal",
                 "text-anchor": "start"
-              }, h(ne(a, o).name), 9, ja)) : y("", !0),
+              }, p(ne(a, o).name), 9, ja)) : m("", !0),
               a.isChild && a.childIndex === 0 && e.value.style.chart.layout.bars.parentLabels.show ? (u(), v("text", {
                 key: 1,
                 x: e.value.autoSize ? void 0 : A.value.x + e.value.style.chart.layout.bars.parentLabels.offsetX,
@@ -939,44 +959,44 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
                 fill: e.value.style.chart.layout.bars.parentLabels.color,
                 "font-weight": e.value.style.chart.layout.bars.dataLabels.bold ? "bold" : "normal",
                 "text-anchor": "start"
-              }, h(ut(ne(a, o).value), ne(a, o), o, a.parentSign || a.sign), 9, qa)) : y("", !0)
+              }, p(ut(ne(a, o).value), ne(a, o), o, a.parentSign || a.sign), 9, qa)) : m("", !0)
             ]),
             n("rect", {
               x: A.value.x,
-              y: r.value.top + (x.value + p.value) * o - x.value / 2,
+              y: r.value.top + (x.value + f.value) * o - x.value / 2,
               width: A.value.width,
-              height: p.value + x.value <= 0 ? 1e-4 : p.value + x.value,
+              height: f.value + x.value <= 0 ? 1e-4 : f.value + x.value,
               fill: Se.value === a.id ? s(Be)(e.value.style.chart.layout.highlighter.color, e.value.style.chart.layout.highlighter.opacity) : "transparent",
-              onMouseenter: (g) => Et(a, o),
-              onMouseleave: (g) => Rt({ datapoint: a, seriesIndex: o }),
-              onClick: (g) => Dt({ datapoint: a, seriesIndex: o })
+              onMouseenter: (b) => Et(a, o),
+              onMouseleave: (b) => Rt({ datapoint: a, seriesIndex: o }),
+              onClick: (b) => Dt({ datapoint: a, seriesIndex: o })
             }, null, 40, Ya)
           ]))), 256)),
-          k(t.$slots, "svg", { svg: A.value }, void 0, !0)
+          y(t.$slots, "svg", { svg: A.value }, void 0, !0)
         ], 512)
       ], 14, za)),
       t.$slots.watermark ? (u(), v("div", Ka, [
-        k(t.$slots, "watermark", Z(ee({ isPrinting: s(je) || s(qe) })), void 0, !0)
-      ])) : y("", !0),
+        y(t.$slots, "watermark", O(I({ isPrinting: s(je) || s(qe) })), void 0, !0)
+      ])) : m("", !0),
       e.value.style.chart.legend.show && e.value.style.chart.legend.position === "bottom" ? (u(), v("div", {
         key: 6,
         ref_key: "chartLegend",
         ref: be
       }, [
-        (u(), W(gt, {
+        (u(), j(gt, {
           key: `legend_bottom_${me.value}`,
           legendSet: z.value,
           config: at.value,
-          onClickMarker: l[1] || (l[1] = ({ legend: a }) => D(a.id))
+          onClickMarker: l[1] || (l[1] = ({ legend: a }) => E(a.id))
         }, pe({
-          item: b(({ legend: a, index: o }) => [
+          item: h(({ legend: a, index: o }) => [
             n("div", {
-              onClick: (g) => D(a.id),
-              style: d(`opacity:${T.value.includes(a.id) ? 0.5 : 1}`)
-            }, h(a.name) + ": " + h(s(se)(
+              onClick: (b) => E(a.id),
+              style: c(`opacity:${T.value.includes(a.id) ? 0.5 : 1}`)
+            }, p(a.name) + ": " + p(s(se)(
               e.value.style.chart.layout.bars.dataLabels.value.formatter,
               a.value,
-              s(M)({
+              s(R)({
                 p: e.value.style.chart.legend.prefix,
                 v: a.value,
                 s: e.value.style.chart.legend.suffix,
@@ -989,8 +1009,8 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
         }, [
           t.$slots.pattern ? {
             name: "legend-pattern",
-            fn: b(({ legend: a, index: o }) => [
-              J(yt, {
+            fn: h(({ legend: a, index: o }) => [
+              ee(yt, {
                 shape: a.shape,
                 radius: 30,
                 stroke: "none",
@@ -1001,18 +1021,18 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
             key: "0"
           } : void 0
         ]), 1032, ["legendSet", "config"]))
-      ], 512)) : y("", !0),
-      k(t.$slots, "legend", { legend: z.value }, void 0, !0),
+      ], 512)) : m("", !0),
+      y(t.$slots, "legend", { legend: z.value }, void 0, !0),
       t.$slots.source ? (u(), v("div", {
         key: 7,
         ref_key: "source",
         ref: Ee,
         dir: "auto"
       }, [
-        k(t.$slots, "source", {}, void 0, !0)
-      ], 512)) : y("", !0),
-      J(s(xt), {
-        show: $.value.showTooltip && ge.value && T.value.length < m.dataset.length,
+        y(t.$slots, "source", {}, void 0, !0)
+      ], 512)) : m("", !0),
+      ee(s(xt), {
+        show: _.value.showTooltip && ge.value && T.value.length < k.dataset.length,
         backgroundColor: e.value.style.chart.tooltip.backgroundColor,
         color: e.value.style.chart.tooltip.color,
         borderRadius: e.value.style.chart.tooltip.borderRadius,
@@ -1024,43 +1044,43 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
         offsetY: e.value.style.chart.tooltip.offsetY,
         parent: N.value,
         content: ye.value,
-        isFullscreen: X.value,
+        isFullscreen: W.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
       }, {
-        "tooltip-before": b(() => [
-          k(t.$slots, "tooltip-before", Z(ee({ ...Le.value })), void 0, !0)
+        "tooltip-before": h(() => [
+          y(t.$slots, "tooltip-before", O(I({ ...Le.value })), void 0, !0)
         ]),
-        "tooltip-after": b(() => [
-          k(t.$slots, "tooltip-after", Z(ee({ ...Le.value })), void 0, !0)
+        "tooltip-after": h(() => [
+          y(t.$slots, "tooltip-after", O(I({ ...Le.value })), void 0, !0)
         ]),
         _: 3
       }, 8, ["show", "backgroundColor", "color", "borderRadius", "borderColor", "borderWidth", "fontSize", "backgroundOpacity", "position", "offsetY", "parent", "content", "isFullscreen", "isCustom", "smooth", "backdropFilter", "smoothForce", "smoothSnapThreshold"]),
-      fe.value && e.value.userOptions.buttons.table ? (u(), W(la(de.value.component), ht({ key: 8 }, de.value.props, {
+      fe.value && e.value.userOptions.buttons.table ? (u(), j(la(ce.value.component), ht({ key: 8 }, ce.value.props, {
         ref_key: "tableUnit",
         ref: oe,
         onClose: Ae
       }), pe({
-        content: b(() => [
+        content: h(() => [
           n("div", {
             ref_key: "tableContainer",
             ref: Je,
             class: "vue-ui-vertical-bar-table atom-data-table",
-            style: d(`${e.value.table.useDialog ? "" : "max-height: 300px; margin-top: 24px"}`)
+            style: c(`${e.value.table.useDialog ? "" : "max-height: 300px; margin-top: 24px"}`)
           }, [
             n("div", Ja, [
-              e.value.table.useDialog ? y("", !0) : (u(), v("div", {
+              e.value.table.useDialog ? m("", !0) : (u(), v("div", {
                 key: 0,
                 role: "button",
                 tabindex: "0",
-                style: d(`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};`),
+                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: Ae,
                 onKeypress: oa(Ae, ["enter"])
               }, [
-                J(s(Me), {
+                ee(s(Me), {
                   name: "close",
                   stroke: e.value.table.th.color,
                   "stroke-width": 2
@@ -1068,111 +1088,111 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
               ], 36)),
               n("div", {
                 style: { width: "100%", "container-type": "inline-size" },
-                class: G({ "vue-ui-responsive": s(Wt) })
+                class: H({ "vue-ui-responsive": s(Wt) })
               }, [
                 n("table", Za, [
-                  e.value.table.useDialog ? y("", !0) : (u(), v("caption", {
+                  e.value.table.useDialog ? m("", !0) : (u(), v("caption", {
                     key: 0,
-                    style: d({ backgroundColor: e.value.table.th.backgroundColor, color: e.value.table.th.color, outline: e.value.table.th.outline }),
+                    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"
                   }, [
-                    pt(h(e.value.style.chart.title.text) + " ", 1),
-                    e.value.style.chart.title.subtitle.text ? (u(), v("span", el, h(e.value.style.chart.title.subtitle.text), 1)) : y("", !0)
+                    pt(p(e.value.style.chart.title.text) + " ", 1),
+                    e.value.style.chart.title.subtitle.text ? (u(), v("span", el, p(e.value.style.chart.title.subtitle.text), 1)) : m("", !0)
                   ], 4)),
                   n("thead", null, [
                     n("tr", {
                       role: "row",
-                      style: d(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color}`)
+                      style: c(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color}`)
                     }, [
                       (u(!0), v(te, null, ae(V.value.head, (a) => (u(), v("th", {
-                        style: d(`outline:${e.value.table.th.outline}`)
+                        style: c(`outline:${e.value.table.th.outline}`)
                       }, [
-                        n("div", tl, h(a), 1)
+                        n("div", tl, p(a), 1)
                       ], 4))), 256))
                     ], 4),
                     n("tr", null, [
                       n("th", {
-                        style: d(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color};outline:${e.value.table.th.outline}`)
+                        style: c(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color};outline:${e.value.table.th.outline}`)
                       }, null, 4),
                       n("th", {
-                        style: d(`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`)
-                      }, "∑ " + h(e.value.table.td.prefix) + h(isNaN(O.value) ? "" : O.value.toFixed(e.value.table.td.roundingValue)) + h(e.value.table.td.suffix), 5),
+                        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`)
+                      }, "∑ " + p(e.value.table.td.prefix) + p(isNaN(F.value) ? "" : F.value.toFixed(e.value.table.td.roundingValue)) + p(e.value.table.td.suffix), 5),
                       n("th", {
-                        style: d(`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`)
+                        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),
                       n("th", {
-                        style: d(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color};outline:${e.value.table.th.outline}`)
+                        style: c(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color};outline:${e.value.table.th.outline}`)
                       }, null, 4),
                       n("th", {
-                        style: d(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color};outline:${e.value.table.th.outline}`)
+                        style: c(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color};outline:${e.value.table.th.outline}`)
                       }, null, 4),
                       n("th", {
-                        style: d(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color};outline:${e.value.table.th.outline}`)
+                        style: c(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color};outline:${e.value.table.th.outline}`)
                       }, null, 4),
                       n("th", {
-                        style: d(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color};outline:${e.value.table.th.outline}`)
+                        style: c(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color};outline:${e.value.table.th.outline}`)
                       }, null, 4)
                     ])
                   ]),
                   n("tbody", null, [
                     (u(!0), v(te, null, ae(V.value.body, (a, o) => (u(), v("tr", {
-                      class: G({ "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: d(`background:${e.value.table.td.backgroundColor};color:${e.value.table.td.color}`)
+                      class: H({ "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}`)
                     }, [
                       n("td", {
                         class: "vue-ui-data-table__tbody__td",
-                        style: d(`outline:${e.value.table.td.outline};font-variant-numeric: tabular-nums;`),
+                        style: c(`outline:${e.value.table.td.outline};font-variant-numeric: tabular-nums;`),
                         "data-cell": V.value.head[0] ?? ""
                       }, [
                         n("div", ll, [
                           a.color ? (u(), v("span", {
                             key: 0,
-                            style: d(`color:${a.color};margin-right:3px`)
-                          }, "⬤", 4)) : y("", !0),
-                          n("span", null, h(a.parentName), 1)
+                            style: c(`color:${a.color};margin-right:3px`)
+                          }, "⬤", 4)) : m("", !0),
+                          n("span", null, p(a.parentName), 1)
                         ])
                       ], 12, al),
                       n("td", {
                         class: "vue-ui-data-table__tbody__td",
-                        style: d(`outline:${e.value.table.td.outline}`),
+                        style: c(`outline:${e.value.table.td.outline}`),
                         "data-cell": V.value.head[1] ?? ""
                       }, [
-                        n("div", nl, h(e.value.table.td.prefix) + h(["", NaN, void 0].includes(a.parentValue) ? "" : a.parentValue.toFixed(e.value.table.td.roundingValue)) + h(e.value.table.td.suffix), 1)
+                        n("div", nl, p(e.value.table.td.prefix) + p(["", NaN, void 0].includes(a.parentValue) ? "" : a.parentValue.toFixed(e.value.table.td.roundingValue)) + p(e.value.table.td.suffix), 1)
                       ], 12, ol),
                       n("td", {
                         class: "vue-ui-data-table__tbody__td",
-                        style: d(`outline:${e.value.table.td.outline}`),
+                        style: c(`outline:${e.value.table.td.outline}`),
                         "data-cell": V.value.head[2] ?? ""
                       }, [
-                        n("div", sl, h(["", NaN, void 0].includes(a.percentageToTotal) ? "" : `${(a.percentageToTotal * 100).toFixed(e.value.table.td.roundingPercentage)}%`), 1)
+                        n("div", sl, p(["", NaN, void 0].includes(a.percentageToTotal) ? "" : `${(a.percentageToTotal * 100).toFixed(e.value.table.td.roundingPercentage)}%`), 1)
                       ], 12, ul),
                       n("td", {
                         class: "vue-ui-data-table__tbody__td",
-                        style: d(`outline:${e.value.table.td.outline}`),
+                        style: c(`outline:${e.value.table.td.outline}`),
                         "data-cell": V.value.head[3] ?? ""
                       }, [
-                        n("div", il, h(a.childName), 1)
+                        n("div", il, p(a.childName), 1)
                       ], 12, rl),
                       n("td", {
                         class: "vue-ui-data-table__tbody__td",
-                        style: d(`outline:${e.value.table.td.outline}`),
+                        style: c(`outline:${e.value.table.td.outline}`),
                         "data-cell": V.value.head[4] ?? ""
                       }, [
-                        n("div", cl, h(e.value.table.td.prefix) + h(["", NaN, void 0].includes(a.childValue) ? "" : a.childValue.toFixed(e.value.table.td.roundingValue)) + h(e.value.table.td.suffix), 1)
+                        n("div", dl, p(e.value.table.td.prefix) + p(["", NaN, void 0].includes(a.childValue) ? "" : a.childValue.toFixed(e.value.table.td.roundingValue)) + p(e.value.table.td.suffix), 1)
                       ], 12, vl),
                       n("td", {
                         class: "vue-ui-data-table__tbody__td",
-                        style: d(`outline:${e.value.table.td.outline}`),
+                        style: c(`outline:${e.value.table.td.outline}`),
                         "data-cell": V.value.head[5] ?? ""
                       }, [
-                        n("div", hl, h(["", NaN, void 0].includes(a.childPercentageToParent) ? "" : `${(a.childPercentageToParent * 100).toFixed(e.value.table.td.roundingPercentage)}%`), 1)
-                      ], 12, dl),
+                        n("div", hl, p(["", NaN, void 0].includes(a.childPercentageToParent) ? "" : `${(a.childPercentageToParent * 100).toFixed(e.value.table.td.roundingPercentage)}%`), 1)
+                      ], 12, cl),
                       n("td", {
                         class: "vue-ui-data-table__tbody__td",
-                        style: d(`outline:${e.value.table.td.outline}`),
+                        style: c(`outline:${e.value.table.td.outline}`),
                         "data-cell": V.value.head[6] ?? ""
                       }, [
-                        n("div", fl, h(["", NaN, void 0].includes(a.childPercentageToTotal) ? "" : `${(a.childPercentageToTotal * 100).toFixed(e.value.table.td.roundingPercentage)}%`), 1)
+                        n("div", fl, p(["", NaN, void 0].includes(a.childPercentageToTotal) ? "" : `${(a.childPercentageToTotal * 100).toFixed(e.value.table.td.roundingPercentage)}%`), 1)
                       ], 12, pl)
                     ], 6))), 256))
                   ])
@@ -1185,32 +1205,32 @@ const Na = ["id"], Aa = ["onClick"], za = ["xmlns", "viewBox"], Va = ["x", "widt
       }, [
         e.value.table.useDialog ? {
           name: "title",
-          fn: b(() => [
-            pt(h(de.value.title), 1)
+          fn: h(() => [
+            pt(p(ce.value.title), 1)
           ]),
           key: "0"
         } : void 0,
         e.value.table.useDialog ? {
           name: "actions",
-          fn: b(() => [
+          fn: h(() => [
             n("button", {
               tabindex: "0",
               class: "vue-ui-user-options-button",
               onClick: l[2] || (l[2] = (a) => Pe(e.value.userOptions.callbacks.csv))
             }, [
-              J(s(Me), {
+              ee(s(Me), {
                 name: "excel",
-                stroke: de.value.props.color
+                stroke: ce.value.props.color
               }, null, 8, ["stroke"])
             ])
           ]),
           key: "1"
         } : void 0
-      ]), 1040)) : y("", !0),
-      s(Ge) ? (u(), W(ma, { key: 9 })) : y("", !0)
+      ]), 1040)) : m("", !0),
+      s(Ge) ? (u(), j(ma, { key: 9 })) : m("", !0)
     ], 46, Na));
   }
-}, Ol = /* @__PURE__ */ Pa(gl, [["__scopeId", "data-v-4ecc1fd7"]]);
+}, Ol = /* @__PURE__ */ Pa(gl, [["__scopeId", "data-v-12742a13"]]);
 export {
   Ol as default
 };