vue-data-ui 3.0.0-next.8 → 3.0.0

package/dist/{vue-ui-vertical-bar-BPay31_q.js → vue-ui-vertical-bar-C-i2dRnU.js}

@@ -1,21 +1,21 @@
-import { useCssVars as Ft, defineAsyncComponent as ae, useSlots as Bt, computed as b, ref as i, toRefs as Rt, watch as nt, shallowRef as ut, onMounted as Te, nextTick as ve, onBeforeUnmount as Et, createElementBlock as v, openBlock as u, unref as s, normalizeStyle as h, normalizeClass as D, createBlock as X, createCommentVNode as y, renderSlot as x, createVNode as le, createSlots as Se, withCtx as w, normalizeProps as Y, guardReactiveProps as K, createElementVNode as n, toDisplayString as p, Fragment as J, renderList as Q, mergeProps as Dt, withKeys as Xt, createTextVNode as Ut } from "vue";
-import { u as Gt, c as Wt, A as Ht, t as jt, p as U, a as qt, C as Le, b as Yt, v as L, o as Pe, e as oe, d as Ne, i as de, f as G, X as Kt, s as Ae, w as Jt, q as Qt, r as Zt, x as ea, y as ta } from "./index-Cfm5-hMQ.js";
+import { useCssVars as Mt, defineAsyncComponent as le, useSlots as Bt, computed as b, ref as i, toRefs as Rt, watch as nt, shallowRef as ut, onMounted as Te, nextTick as ve, onBeforeUnmount as Et, createElementBlock as v, openBlock as u, unref as s, normalizeStyle as h, normalizeClass as D, createBlock as X, createCommentVNode as y, renderSlot as x, createVNode as oe, createSlots as Se, withCtx as w, normalizeProps as K, guardReactiveProps as J, createElementVNode as n, toDisplayString as p, Fragment as Q, renderList as Z, mergeProps as Dt, withKeys as Xt, createTextVNode as Ut } from "vue";
+import { u as Gt, c as Wt, t as Ht, a as jt, p as U, b as qt, C as Le, d as Yt, h as L, o as Pe, f as ne, e as Ne, k as de, i as G, X as Kt, s as Ae, x as Jt, v as Qt, w as Zt, y as ea, z as ta } from "./index-BtNwOUja.js";
 import { t as aa, u as la } from "./useResponsive-DfdjqQps.js";
-import { u as st } from "./useNestedProp-Hh7nGEjp.js";
-import { u as oa } from "./usePrinter-B1Hgs47c.js";
+import { u as st } from "./useNestedProp-f2H3m6Yj.js";
+import { u as oa } from "./usePrinter-DUNjpQNe.js";
 import { u as na } from "./useUserOptionState-BIvW1Kz7.js";
 import { u as ua } from "./useChartAccessibility-9icAAmYg.js";
-import sa from "./vue-ui-accordion-CEDGlyKI.js";
-import rt from "./Legend-DInM-hku.js";
-import ra from "./Title-BSlAPr_H.js";
-import { _ as it } from "./Shape-BGr3dQKt.js";
-import ia from "./img-CgMUOQnb.js";
-import { u as va, B as da } from "./useLoading-Bt5Doa8m.js";
+import sa from "./vue-ui-accordion-BKUrAowe.js";
+import rt from "./Legend-BUk0WvWJ.js";
+import ra from "./Title-BGu6gEd2.js";
+import { _ as it } from "./Shape-BRzOzubn.js";
+import ia from "./img-DrR839Ot.js";
+import { u as va, B as da } from "./useLoading-D7YHNtLX.js";
 import { _ as ca } from "./_plugin-vue_export-helper-CHgC5LLL.js";
 const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "width", "height"], ga = ["id"], ba = ["stop-color"], ma = ["stop-color"], ka = { key: 1 }, xa = ["x", "y", "width", "height", "fill", "rx"], _a = ["x", "y", "width", "height", "fill", "rx", "stroke", "stroke-width"], wa = ["x", "y", "width", "height", "fill", "rx", "stroke", "stroke-width"], $a = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Ca = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Ta = { class: "vue-ui-horizontal-bar-child-label" }, Sa = ["x", "y", "text-anchor", "font-size", "fill", "font-weight"], La = ["x", "y", "font-size", "fill", "font-weight"], Pa = { class: "vue-ui-horizontal-bar-parent-label" }, Na = ["x", "y", "font-size", "fill", "font-weight"], Aa = ["x", "y", "font-size", "fill", "font-weight"], za = ["x", "y", "width", "height", "fill", "onMouseenter", "onMouseleave", "onClick"], Va = {
   key: 5,
   class: "vue-data-ui-watermark"
-}, Ia = ["onClick"], Oa = { style: "width:100%;padding-top: 36px;position:relative" }, Ma = { class: "vue-ui-data-table" }, Fa = { key: 0 }, Ba = { style: { width: "100%" } }, Ra = ["data-cell"], Ea = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Da = ["data-cell"], Xa = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Ua = ["data-cell"], Ga = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Wa = ["data-cell"], Ha = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, ja = ["data-cell"], qa = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Ya = ["data-cell"], Ka = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Ja = ["data-cell"], Qa = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Za = {
+}, Ia = ["onClick"], Oa = { style: "width:100%;padding-top: 36px;position:relative" }, Fa = { class: "vue-ui-data-table" }, Ma = { key: 0 }, Ba = { style: { width: "100%" } }, Ra = ["data-cell"], Ea = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Da = ["data-cell"], Xa = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Ua = ["data-cell"], Ga = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Wa = ["data-cell"], Ha = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, ja = ["data-cell"], qa = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Ya = ["data-cell"], Ka = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Ja = ["data-cell"], Qa = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Za = {
   __name: "vue-ui-vertical-bar",
   props: {
     config: {
@@ -33,17 +33,17 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
   },
   emits: ["selectLegend"],
   setup(vt, { expose: dt, emit: ct }) {
-    Ft((t) => ({
-      "3328a5b3": t.tdo
+    Mt((t) => ({
+      dd2a8d00: t.tdo
     }));
-    const ht = ae(() => import("./BaseIcon-BuOIF6t5.js")), pt = ae(() => import("./PackageVersion-CGQlqnmq.js")), ft = ae(() => import("./PenAndPaper-B5slIHlh.js")), yt = ae(() => import("./Tooltip-lPcsweXz.js")), gt = ae(() => import("./UserOptions-Dn5TCQxg.js")), { vue_ui_vertical_bar: bt } = Gt(), mt = Bt(), g = vt, ce = b({
+    const ht = le(() => import("./BaseIcon-CXtL10fo.js")), pt = le(() => import("./PackageVersion-CJ6Vd7V5.js")), ft = le(() => import("./PenAndPaper-D3zudcNI.js")), yt = le(() => import("./Tooltip-Bh2zYSoM.js")), gt = le(() => import("./UserOptions-Ck8fz9f4.js")), { vue_ui_vertical_bar: bt } = Gt(), mt = Bt(), g = vt, ce = b({
       get() {
         return !!g.dataset && g.dataset.length;
       },
       set(t) {
         return t;
       }
-    }), S = i(Wt()), kt = i(null), he = i(!1), pe = i(""), Z = i(0), xt = i(null), ze = i(0), z = i(null), Ve = i(null), fe = i(null), Ie = i(null), Oe = i(null), Me = i(0), ye = i(0), ne = i(null), _t = ct, e = i(xe()), wt = b(() => [
+    }), S = i(Wt()), kt = i(null), he = i(!1), pe = i(""), ee = i(0), xt = i(null), ze = i(0), z = i(null), Ve = i(null), fe = i(null), Ie = i(null), Oe = i(null), Fe = i(0), ye = i(0), W = i(null), _t = ct, e = i(xe()), wt = b(() => [
       { name: "", value: 6, color: "#d9d9d9" },
       { name: "", value: 5, color: "#d9d9d9" },
       { name: "", value: 4, color: "#d9d9d9" },
@@ -56,7 +56,7 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
       prepareConfig: xe,
       callback: () => {
         Promise.resolve().then(async () => {
-          H(), await O();
+          j(), await O();
         });
       },
       skeletonDataset: wt.value,
@@ -68,7 +68,7 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
           table: { show: !1 },
           style: {
             chart: {
-              backgroundColor: "#999999",
+              backgroundColor: "#99999930",
               layout: {
                 bars: {
                   offsetX: 110,
@@ -90,7 +90,7 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
               },
               legend: {
                 show: !0,
-                backgroundColor: "#999999",
+                backgroundColor: "transparent",
                 color: "transparent",
                 prefix: "",
                 suffix: "",
@@ -106,7 +106,7 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
           }
         }
       })
-    }), { userOptionsVisible: ke, setUserOptionsVisibility: Fe, keepUserOptionState: Be } = na({ config: e.value }), { svgRef: Re } = ua({ config: e.value.style.chart.title });
+    }), { userOptionsVisible: ke, setUserOptionsVisibility: Me, keepUserOptionState: Be } = na({ config: e.value }), { svgRef: Re } = ua({ config: e.value.style.chart.title });
     function xe() {
       const t = st({
         userConfig: g.config,
@@ -122,15 +122,15 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
       } : l = t, g.config && Le(g.config, "events.datapointEnter") ? l.events.datapointEnter = g.config.events.datapointEnter : l.events.datapointEnter = null, g.config && Le(g.config, "events.datapointLeave") ? l.events.datapointLeave = g.config.events.datapointLeave : l.events.datapointLeave = null, g.config && Le(g.config, "events.datapointClick") ? l.events.datapointClick = g.config.events.datapointClick : l.events.datapointClick = null, l;
     }
     nt(() => g.config, (t) => {
-      ge.value || (e.value = xe()), ke.value = !e.value.userOptions.showOnChartHover, qe(), Me.value += 1, ye.value += 1, c.value = e.value.style.chart.layout.bars.height, m.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;
+      ge.value || (e.value = xe()), ke.value = !e.value.userOptions.showOnChartHover, qe(), Fe.value += 1, ye.value += 1, c.value = e.value.style.chart.layout.bars.height, m.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 }), nt(() => g.dataset, (t) => {
-      Array.isArray(t) && t.length > 0 && (me.value = !1), H();
+      Array.isArray(t) && t.length > 0 && (me.value = !1), j();
     }, { deep: !0 });
     const { isPrinting: Ee, isImaging: De, generatePdf: Xe, generateImage: Ue } = oa({
       elementId: `vue-ui-vertical-bar_${S.value}`,
       fileName: e.value.style.chart.title.text || "vue-ui-vertical-bar",
       options: e.value.userOptions.print
-    }), $t = b(() => e.value.userOptions.show && !e.value.style.chart.title.text), Ge = b(() => Yt(e.value.customPalette)), We = i(null), He = i(!1), Ct = b(() => e.value.table.responsiveBreakpoint), I = ut(null), W = ut(null), ue = i("0 0 10 10"), P = b(() => {
+    }), $t = b(() => e.value.userOptions.show && !e.value.style.chart.title.text), Ge = b(() => Yt(e.value.customPalette)), We = i(null), He = i(!1), Ct = b(() => e.value.table.responsiveBreakpoint), I = ut(null), H = ut(null), ue = i("0 0 10 10"), P = b(() => {
       const [t, l, a, o] = ue.value.split(" ").map(Number);
       return { x: t, y: l, width: a, height: o };
     });
@@ -138,25 +138,25 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
       await ve(), qe(), O();
     });
     async function O() {
-      if (ue.value = `0 0 ${C.value.width} ${r.value.fullHeight}`, !e.value.autoSize) return;
-      const t = ne.value.querySelectorAll(".vue-ui-horizontal-bar-parent-label"), l = ne.value.querySelectorAll(".vue-ui-horizontal-bar-child-label");
-      if (t.length) {
+      if (ue.value = `0 0 ${C.value.width} ${r.value.fullHeight}`, !e.value.autoSize || !W.value) return;
+      const t = W.value.querySelectorAll(".vue-ui-horizontal-bar-parent-label"), l = W.value.querySelectorAll(".vue-ui-horizontal-bar-child-label");
+      if (t && t.length) {
         const f = Math.max(...Array.from(t).flatMap((d) => {
           const k = d.querySelectorAll("text");
-          return k.length ? Array.from(k).map((q) => q.getBBox().width) : 0;
+          return k.length ? Array.from(k).map((Y) => Y.getBBox().width) : 0;
         })), _ = Math.max(...Array.from(l).flatMap((d) => {
           const k = d.querySelectorAll("text");
-          return k.length ? Array.from(k).map((q) => q.getBBox().width) : 0;
+          return k.length ? Array.from(k).map((Y) => Y.getBBox().width) : 0;
         }));
         Array.from(t).forEach((d) => {
           const k = d.querySelectorAll("text");
-          Array.from(k).forEach(async (q) => {
-            q.setAttribute("x", 0), q.setAttribute("x", L(-f - _));
+          Array.from(k).forEach(async (Y) => {
+            Y.setAttribute("x", 0), Y.setAttribute("x", L(-f - _));
           });
         });
       }
       await ve();
-      const a = ne.value.getBBox(), o = e.value.style.chart.layout.bars.dataLabels.offsetX;
+      const a = W.value ? W.value.getBBox() : 0, o = e.value.style.chart.layout.bars.dataLabels.offsetX;
       ue.value = [
         a.x + -o,
         0,
@@ -171,7 +171,7 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
           const { width: a, height: o } = l.contentRect;
           if (a > 0 && o > 0) {
             Promise.resolve().then(async () => {
-              H(), await O();
+              j(), await O();
             });
             break;
           }
@@ -180,11 +180,11 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
     });
     const se = b(() => !!e.value.debug), _e = i(0);
     function qe() {
-      if (Pe(g.dataset) && (oe({
+      if (Pe(g.dataset) && (ne({
         componentName: "VueUiVerticalBar",
         type: "dataset",
         debug: se.value
-      }), ce.value = !1, me.value = !0), Z.value = be.value.flatMap((t) => t.children && t.children.length > 0 ? t.children.length : 1).reduce((t, l) => t + l, 0), Tt(), Pe(g.dataset) || (me.value = e.value.loading), e.value.responsive) {
+      }), ce.value = !1, me.value = !0), ee.value = be.value.flatMap((t) => t.children && t.children.length > 0 ? t.children.length : 1).reduce((t, l) => t + l, 0), Tt(), Pe(g.dataset) || (me.value = e.value.loading), e.value.responsive) {
         const t = aa(() => {
           const { width: l, height: a } = la({
             chart: z.value,
@@ -195,15 +195,15 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
           });
           _e.value = a / 3, requestAnimationFrame(async () => {
             Je.value = l;
-            const o = m.value * (Z.value - 1);
-            c.value = (a - o) / Z.value, await ve(), O();
+            const o = m.value * (ee.value - 1);
+            c.value = (a - o) / ee.value, await ve(), O();
           });
         });
-        I.value && (W.value && I.value.unobserve(W.value), I.value.disconnect()), I.value = new ResizeObserver(t), W.value = z.value.parentNode, I.value.observe(W.value), e.value.autoSize && O();
+        I.value && (H.value && I.value.unobserve(H.value), I.value.disconnect()), I.value = new ResizeObserver(t), H.value = z.value.parentNode, I.value.observe(H.value), e.value.autoSize && O();
       }
     }
     Et(() => {
-      I.value && (W.value && I.value.unobserve(W.value), I.value.disconnect());
+      I.value && (H.value && I.value.unobserve(H.value), I.value.disconnect());
     });
     function Tt() {
       if (ge.value) return;
@@ -217,19 +217,19 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
       showTable: e.value.table.show,
       sortDesc: e.value.style.chart.layout.bars.sort === "desc",
       showTooltip: e.value.style.chart.tooltip.show
-    }), Ye = b(() => $.value.sortDesc), M = b(() => (be.value.forEach((t, l) => {
-      !t.value && !t.children && oe({
+    }), Ye = b(() => $.value.sortDesc), F = b(() => (be.value.forEach((t, l) => {
+      !t.value && !t.children && ne({
         componentName: "VueUiVerticalBar",
         type: "datasetAttributeEmpty",
         property: `value (index ${l})`,
         debug: se.value
-      }), t.children && (Pe(t.children) ? oe({
+      }), t.children && (Pe(t.children) ? ne({
         componentName: "VueUiVerticalBar",
         type: "datasetAttributeEmpty",
         property: `children (index ${l})`,
         debug: se.value
       }) : t.children.forEach((a, o) => {
-        [null, void 0].includes(a.name) && oe({
+        [null, void 0].includes(a.name) && ne({
           componentName: "VueUiVerticalBar",
           type: "datasetSerieAttribute",
           property: "name",
@@ -250,7 +250,7 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
         sign: _,
         hasChildren: o,
         isChild: !1,
-        segregate: () => ee(a),
+        segregate: () => te(a),
         isSegregated: N.value.includes(a),
         color: Ne(t.color) || Ge.value[l] || U[l] || U[l % U.length],
         children: !t.children || !t.children.length ? [] : t.children.toSorted(re.value ? () => 0 : (d, k) => Ye.value ? k.value - d.value : d.value - k.value).map((d, k) => ({
@@ -279,7 +279,7 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
       fontSize: e.value.style.chart.legend.fontSize,
       paddingBottom: 12,
       fontWeight: e.value.style.chart.legend.bold ? "bold" : ""
-    })), c = i(e.value.style.chart.layout.bars.height), m = i(e.value.style.chart.layout.bars.gap), St = b(() => (c.value + m.value) * Z.value), Je = i(512), C = b(() => ({
+    })), c = i(e.value.style.chart.layout.bars.height), m = i(e.value.style.chart.layout.bars.gap), St = b(() => (c.value + m.value) * ee.value), Je = i(512), C = b(() => ({
       width: Je.value,
       height: St.value,
       padding: {
@@ -296,20 +296,20 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
       bottom: C.value.padding.top + C.value.height,
       width: C.value.width - (C.value.padding.left + C.value.padding.right)
     }));
-    async function H() {
-      Z.value = B.value.flatMap((t) => t.children && t.children.length > 0 ? t.children.length : 1).reduce((t, l) => t + l, 0), e.value.autoSize && await O();
+    async function j() {
+      ee.value = B.value.flatMap((t) => t.children && t.children.length > 0 ? t.children.length : 1).reduce((t, l) => t + l, 0), e.value.autoSize && await O();
     }
     const N = i([]);
-    async function ee(t) {
+    async function te(t) {
       if (N.value.includes(t))
         N.value = N.value.filter((l) => l !== t);
       else {
-        if (N.value.length === M.value.length - 1) return;
+        if (N.value.length === F.value.length - 1) return;
         N.value.push(t);
       }
-      H(), await ve(), e.value.autoSize && O(), _t("selectLegend", B.value);
+      j(), await ve(), e.value.autoSize && O(), _t("selectLegend", B.value);
     }
-    const B = b(() => M.value.filter((t) => !N.value.includes(t.id))), V = b(() => B.value.map((t) => Math.abs(t.value)).reduce((t, l) => t + l, 0));
+    const B = b(() => F.value.filter((t) => !N.value.includes(t.id))), V = b(() => B.value.map((t) => Math.abs(t.value)).reduce((t, l) => t + l, 0));
     function Qe(t, l = !1, a = 0) {
       return l ? G({
         v: L(Math.abs(t) / V.value * 100),
@@ -325,7 +325,7 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
     function Pt(t) {
       return T(t) + r.value.left;
     }
-    function te(t, l) {
+    function ae(t, l) {
       const a = B.value.find((_) => _.id === t.parentId), o = r.value.top + (m.value + c.value) * l, f = a.children.length * (m.value + c.value);
       return {
         y: o + f / 2 - e.value.style.chart.layout.bars.parentLabels.fontSize,
@@ -349,19 +349,19 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
       e.value.events.datapointEnter && e.value.events.datapointEnter({ datpoint: t, seriesIndex: l }), $e.value = {
         datapoint: t,
         seriesIndex: l,
-        series: M.value,
+        series: F.value,
         config: e.value
       }, he.value = !0, we.value = t.id;
       let a = "";
       const o = t.isChild ? t.parentName : t.name, f = t.isChild ? t.name : "", _ = e.value.style.chart.tooltip.customFormat;
       ea(_) && ta(() => _({
         datapoint: t,
-        series: M.value,
+        series: F.value,
         config: e.value,
         seriesIndex: l
       })) ? pe.value = _({
         datapoint: t,
-        series: M.value,
+        series: F.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;">
@@ -454,9 +454,9 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
       ]), f = l.concat([a]).concat(o), _ = Qt(f);
       t ? t(_) : Zt({ csvContent: _, title: e.value.style.chart.title.text || "vue-ui-vertical-bar" });
     }
-    const j = i(!1);
+    const q = i(!1);
     function tt(t) {
-      j.value = t, ze.value += 1;
+      q.value = t, ze.value += 1;
     }
     function at() {
       $.value.showTable = !$.value.showTable;
@@ -465,20 +465,20 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
       none: 0,
       asc: 1,
       desc: 2
-    }), F = i(0), re = i(!1);
+    }), M = i(0), re = i(!1);
     Te(() => {
-      ["none", "asc", "desc"].includes(e.value.style.chart.layout.bars.sort) || oe({
+      ["none", "asc", "desc"].includes(e.value.style.chart.layout.bars.sort) || ne({
         componentName: "VueUiVerticalBar",
         type: "attributeWrongValue",
         property: "style.chart.layout.bars.sort",
         key: e.value.style.chart.layout.bars.sort
-      }), F.value = It.value[e.value.style.chart.layout.bars.sort], $.value.sortDesc = F.value === 2, re.value = F.value === 0;
+      }), M.value = It.value[e.value.style.chart.layout.bars.sort], $.value.sortDesc = M.value === 2, re.value = M.value === 0;
     });
     function Ot() {
-      F.value += 1, F.value > 2 && (F.value = 0);
+      M.value += 1, M.value > 2 && (M.value = 0);
     }
     function lt() {
-      Ot(), $.value.sortDesc = F.value === 2, re.value = F.value === 0, H();
+      Ot(), $.value.sortDesc = M.value === 2, re.value = M.value === 0, j();
     }
     function ot() {
       $.value.showTooltip = !$.value.showTooltip;
@@ -487,7 +487,7 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
     function Ce() {
       ie.value = !ie.value;
     }
-    async function Mt({ scale: t = 2 } = {}) {
+    async function Ft({ scale: t = 2 } = {}) {
       if (!z.value) return;
       const { width: l, height: a } = z.value.getBoundingClientRect(), o = l / a, { imageUri: f, base64: _ } = await ia({ domElement: z.value, base64: !0, img: !0, scale: t });
       return {
@@ -503,8 +503,8 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
       autoSize: O,
       // v3
       getData: Nt,
-      getImage: Mt,
-      recalculateHeight: H,
+      getImage: Ft,
+      recalculateHeight: j,
       generatePdf: Xe,
       generateCsv: et,
       generateImage: Ue,
@@ -514,13 +514,13 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
       toggleAnnotator: Ce,
       toggleFullscreen: tt
     }), (t, l) => (u(), v("div", {
-      class: D(`vue-ui-vertical-bar ${j.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"} ${e.value.responsive && e.value.autoSize ? "vue-ui-vertical-bar-autosize" : ""}`),
+      class: D(`vue-ui-vertical-bar ${q.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: z,
       id: `vue-ui-vertical-bar_${S.value}`,
-      style: h(`margin-top:${e.value.responsive && e.value.autoSize ? `${_e.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% - ${_e.value}px` : "height: 100%" : ""}`),
-      onMouseenter: l[4] || (l[4] = () => s(Fe)(!0)),
-      onMouseleave: l[5] || (l[5] = () => s(Fe)(!1))
+      style: h(`padding-top:${e.value.responsive && e.value.autoSize ? `${_e.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% - ${_e.value}px` : "height: 100%" : ""}`),
+      onMouseenter: l[4] || (l[4] = () => s(Me)(!0)),
+      onMouseleave: l[5] || (l[5] = () => s(Me)(!1))
     }, [
       e.value.userOptions.buttons.annotator ? (u(), X(s(ft), {
         key: 0,
@@ -544,7 +544,7 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
         style: "width:100%;background:transparent;padding-bottom:12px"
       }, [
         (u(), X(ra, {
-          key: `title_${Me.value}`,
+          key: `title_${Fe.value}`,
           config: {
             title: {
               cy: "vertical-bar-div-title",
@@ -573,7 +573,7 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
         hasTable: e.value.userOptions.buttons.table,
         hasSort: e.value.userOptions.buttons.sort,
         hasFullscreen: e.value.userOptions.buttons.fullscreen,
-        isFullscreen: j.value,
+        isFullscreen: q.value,
         isTooltip: $.value.showTooltip,
         titles: { ...e.value.userOptions.buttonTitles },
         chartElement: z.value,
@@ -597,7 +597,7 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
         t.$slots.menuIcon ? {
           name: "menuIcon",
           fn: w(({ isOpen: a, color: o }) => [
-            x(t.$slots, "menuIcon", Y(K({ isOpen: a, color: o })), void 0, !0)
+            x(t.$slots, "menuIcon", K(J({ isOpen: a, color: o })), void 0, !0)
           ]),
           key: "0"
         } : void 0,
@@ -653,14 +653,14 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
         t.$slots.optionFullscreen ? {
           name: "optionFullscreen",
           fn: w(({ toggleFullscreen: a, isFullscreen: o }) => [
-            x(t.$slots, "optionFullscreen", Y(K({ toggleFullscreen: a, isFullscreen: o })), void 0, !0)
+            x(t.$slots, "optionFullscreen", K(J({ toggleFullscreen: a, isFullscreen: o })), void 0, !0)
           ]),
           key: "8"
         } : void 0,
         t.$slots.optionAnnotator ? {
           name: "optionAnnotator",
           fn: w(({ toggleAnnotator: a, isAnnotator: o }) => [
-            x(t.$slots, "optionAnnotator", Y(K({ toggleAnnotator: a, isAnnotator: o })), void 0, !0)
+            x(t.$slots, "optionAnnotator", K(J({ toggleAnnotator: a, isAnnotator: o })), void 0, !0)
           ]),
           key: "9"
         } : void 0
@@ -672,13 +672,13 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
       }, [
         (u(), X(rt, {
           key: `legend_top_${ye.value}`,
-          legendSet: M.value,
+          legendSet: F.value,
           config: Ke.value,
-          onClickMarker: l[0] || (l[0] = ({ legend: a }) => ee(a.id))
+          onClickMarker: l[0] || (l[0] = ({ legend: a }) => te(a.id))
         }, Se({
           item: w(({ legend: a, index: o }) => [
             n("div", {
-              onClick: (f) => ee(a.id),
+              onClick: (f) => te(a.id),
               style: h(`opacity:${N.value.includes(a.id) ? 0.5 : 1}`)
             }, p(a.name) + ": " + p(s(de)(
               e.value.style.chart.layout.bars.dataLabels.value.formatter,
@@ -697,7 +697,7 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
           t.$slots.pattern ? {
             name: "legend-pattern",
             fn: w(({ legend: a, index: o }) => [
-              le(it, {
+              oe(it, {
                 shape: a.shape,
                 radius: 30,
                 stroke: "none",
@@ -713,16 +713,16 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
         ref_key: "svgRef",
         ref: Re,
         xmlns: s(Kt),
-        class: D({ "vue-data-ui-fullscreen--on": j.value, "vue-data-ui-fulscreen--off": !j.value }),
+        class: D({ "vue-data-ui-fullscreen--on": q.value, "vue-data-ui-fulscreen--off": !q.value }),
         viewBox: ue.value,
         style: h(`max-width:100%;overflow:visible;background:transparent;color:${e.value.style.chart.color}`)
       }, [
         n("g", {
           ref_key: "G",
-          ref: ne,
+          ref: W,
           class: "vue-data-ui-g"
         }, [
-          le(s(pt)),
+          oe(s(pt)),
           t.$slots["chart-background"] ? (u(), v("foreignObject", {
             key: 0,
             x: P.value.x,
@@ -735,7 +735,7 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
           }, [
             x(t.$slots, "chart-background", {}, void 0, !0)
           ], 8, ya)) : y("", !0),
-          (u(!0), v(J, null, Q(R.value, (a, o) => (u(), v("linearGradient", {
+          (u(!0), v(Q, null, Z(R.value, (a, o) => (u(), v("linearGradient", {
             x1: "0%",
             y1: "0%",
             x2: "100%",
@@ -752,11 +752,11 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
             }, null, 8, ma)
           ], 8, ga))), 256)),
           t.$slots.pattern ? (u(), v("g", ka, [
-            (u(!0), v(J, null, Q(R.value, (a) => (u(), v("defs", null, [
+            (u(!0), v(Q, null, Z(R.value, (a) => (u(), v("defs", null, [
               x(t.$slots, "pattern", Dt({ ref_for: !0 }, { seriesIndex: a.absoluteIndex, patternId: `pattern_${S.value}_${a.absoluteIndex}` }), void 0, !0)
             ]))), 256))
           ])) : y("", !0),
-          (u(!0), v(J, null, Q(R.value, (a, o) => (u(), v("g", null, [
+          (u(!0), v(Q, null, Z(R.value, (a, o) => (u(), v("g", null, [
             n("rect", {
               x: s(L)(E.value ? r.value.left + r.value.width / 2 - (a.sign === 1 ? 0 : T(a.value) <= 0 ? 1e-4 : T(a.value)) : r.value.left),
               y: r.value.top + (m.value + c.value) * o,
@@ -767,7 +767,7 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
               class: D({ animated: e.value.useCssAnimation })
             }, null, 10, xa)
           ]))), 256)),
-          (u(!0), v(J, null, Q(R.value, (a, o) => (u(), v("g", null, [
+          (u(!0), v(Q, null, Z(R.value, (a, o) => (u(), v("g", null, [
             n("rect", {
               x: s(L)(E.value ? r.value.left + r.value.width / 2 - (a.sign === 1 ? 0 : T(a.value) <= 0 ? 1e-4 : T(a.value)) : r.value.left),
               y: r.value.top + (m.value + c.value) * o,
@@ -835,21 +835,21 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
               a.isChild && a.childIndex === 0 && e.value.style.chart.layout.bars.parentLabels.show ? (u(), v("text", {
                 key: 0,
                 x: e.value.autoSize ? void 0 : P.value.x + e.value.style.chart.layout.bars.parentLabels.offsetX,
-                y: te(a, o).y,
+                y: ae(a, o).y,
                 "font-size": e.value.style.chart.layout.bars.parentLabels.fontSize,
                 fill: e.value.style.chart.layout.bars.parentLabels.color,
                 "font-weight": e.value.style.chart.layout.bars.parentLabels.bold ? "bold" : "normal",
                 "text-anchor": "start"
-              }, p(te(a, o).name), 9, Na)) : y("", !0),
+              }, p(ae(a, o).name), 9, Na)) : y("", !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 : P.value.x + e.value.style.chart.layout.bars.parentLabels.offsetX,
-                y: te(a, o).y + e.value.style.chart.layout.bars.parentLabels.fontSize + 6,
+                y: ae(a, o).y + e.value.style.chart.layout.bars.parentLabels.fontSize + 6,
                 "font-size": e.value.style.chart.layout.bars.parentLabels.fontSize,
                 fill: e.value.style.chart.layout.bars.parentLabels.color,
                 "font-weight": e.value.style.chart.layout.bars.dataLabels.bold ? "bold" : "normal",
                 "text-anchor": "start"
-              }, p(Ze(te(a, o).value), te(a, o), o, a.parentSign || a.sign), 9, Aa)) : y("", !0)
+              }, p(Ze(ae(a, o).value), ae(a, o), o, a.parentSign || a.sign), 9, Aa)) : y("", !0)
             ]),
             n("rect", {
               x: P.value.x,
@@ -866,7 +866,7 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
         ], 512)
       ], 14, fa)),
       t.$slots.watermark ? (u(), v("div", Va, [
-        x(t.$slots, "watermark", Y(K({ isPrinting: s(Ee) || s(De) })), void 0, !0)
+        x(t.$slots, "watermark", K(J({ isPrinting: s(Ee) || s(De) })), void 0, !0)
       ])) : y("", !0),
       e.value.style.chart.legend.show && e.value.style.chart.legend.position === "bottom" ? (u(), v("div", {
         key: 6,
@@ -875,13 +875,13 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
       }, [
         (u(), X(rt, {
           key: `legend_bottom_${ye.value}`,
-          legendSet: M.value,
+          legendSet: F.value,
           config: Ke.value,
-          onClickMarker: l[1] || (l[1] = ({ legend: a }) => ee(a.id))
+          onClickMarker: l[1] || (l[1] = ({ legend: a }) => te(a.id))
         }, Se({
           item: w(({ legend: a, index: o }) => [
             n("div", {
-              onClick: (f) => ee(a.id),
+              onClick: (f) => te(a.id),
               style: h(`opacity:${N.value.includes(a.id) ? 0.5 : 1}`)
             }, p(a.name) + ": " + p(s(de)(
               e.value.style.chart.layout.bars.dataLabels.value.formatter,
@@ -900,7 +900,7 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
           t.$slots.pattern ? {
             name: "legend-pattern",
             fn: w(({ legend: a, index: o }) => [
-              le(it, {
+              oe(it, {
                 shape: a.shape,
                 radius: 30,
                 stroke: "none",
@@ -912,7 +912,7 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
           } : void 0
         ]), 1032, ["legendSet", "config"]))
       ], 512)) : y("", !0),
-      x(t.$slots, "legend", { legend: M.value }, void 0, !0),
+      x(t.$slots, "legend", { legend: F.value }, void 0, !0),
       t.$slots.source ? (u(), v("div", {
         key: 7,
         ref_key: "source",
@@ -921,7 +921,7 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
       }, [
         x(t.$slots, "source", {}, void 0, !0)
       ], 512)) : y("", !0),
-      le(s(yt), {
+      oe(s(yt), {
         show: $.value.showTooltip && he.value && N.value.length < g.dataset.length,
         backgroundColor: e.value.style.chart.tooltip.backgroundColor,
         color: e.value.style.chart.tooltip.color,
@@ -934,17 +934,19 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
         offsetY: e.value.style.chart.tooltip.offsetY,
         parent: z.value,
         content: pe.value,
-        isFullscreen: j.value,
-        isCustom: e.value.style.chart.tooltip.customFormat && typeof e.value.style.chart.tooltip.customFormat == "function"
+        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
       }, {
         "tooltip-before": w(() => [
-          x(t.$slots, "tooltip-before", Y(K({ ...$e.value })), void 0, !0)
+          x(t.$slots, "tooltip-before", K(J({ ...$e.value })), void 0, !0)
         ]),
         "tooltip-after": w(() => [
-          x(t.$slots, "tooltip-after", Y(K({ ...$e.value })), void 0, !0)
+          x(t.$slots, "tooltip-after", K(J({ ...$e.value })), void 0, !0)
         ]),
         _: 3
-      }, 8, ["show", "backgroundColor", "color", "borderRadius", "borderColor", "borderWidth", "fontSize", "backgroundOpacity", "position", "offsetY", "parent", "content", "isFullscreen", "isCustom"]),
+      }, 8, ["show", "backgroundColor", "color", "borderRadius", "borderColor", "borderWidth", "fontSize", "backgroundOpacity", "position", "offsetY", "parent", "content", "isFullscreen", "isCustom", "smooth", "backdropFilter"]),
       ce.value ? (u(), X(sa, {
         key: 8,
         hideDetails: "",
@@ -975,7 +977,7 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
                 onClick: l[2] || (l[2] = (a) => $.value.showTable = !1),
                 onKeypress: l[3] || (l[3] = Xt((a) => $.value.showTable = !1, ["enter"]))
               }, [
-                le(s(ht), {
+                oe(s(ht), {
                   name: "close",
                   stroke: e.value.table.th.color,
                   "stroke-width": 2
@@ -985,20 +987,20 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
                 style: { width: "100%", "container-type": "inline-size" },
                 class: D({ "vue-ui-responsive": He.value })
               }, [
-                n("table", Ma, [
+                n("table", Fa, [
                   n("caption", {
                     style: h({ backgroundColor: e.value.table.th.backgroundColor, color: e.value.table.th.color, outline: e.value.table.th.outline }),
                     class: "vue-ui-data-table__caption"
                   }, [
                     Ut(p(e.value.style.chart.title.text) + " ", 1),
-                    e.value.style.chart.title.subtitle.text ? (u(), v("span", Fa, p(e.value.style.chart.title.subtitle.text), 1)) : y("", !0)
+                    e.value.style.chart.title.subtitle.text ? (u(), v("span", Ma, p(e.value.style.chart.title.subtitle.text), 1)) : y("", !0)
                   ], 4),
                   n("thead", null, [
                     n("tr", {
                       role: "row",
                       style: h(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color}`)
                     }, [
-                      (u(!0), v(J, null, Q(A.value.head, (a) => (u(), v("th", {
+                      (u(!0), v(Q, null, Z(A.value.head, (a) => (u(), v("th", {
                         style: h(`outline:${e.value.table.th.outline}`)
                       }, [
                         n("div", Ba, p(a), 1)
@@ -1029,7 +1031,7 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
                     ])
                   ]),
                   n("tbody", null, [
-                    (u(!0), v(J, null, Q(A.value.body, (a, o) => (u(), v("tr", {
+                    (u(!0), v(Q, null, Z(A.value.body, (a, o) => (u(), v("tr", {
                       class: D({ "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: h(`background:${e.value.table.td.backgroundColor};color:${e.value.table.td.color}`)
                     }, [
@@ -1100,7 +1102,7 @@ const ha = ["id"], pa = ["onClick"], fa = ["xmlns", "viewBox"], ya = ["x", "widt
       s(ge) ? (u(), X(da, { key: 9 })) : y("", !0)
     ], 46, ha));
   }
-}, pl = /* @__PURE__ */ ca(Za, [["__scopeId", "data-v-a356d4a4"]]);
+}, pl = /* @__PURE__ */ ca(Za, [["__scopeId", "data-v-fa1761f3"]]);
 export {
   pl as default
 };