vue-data-ui 3.10.0 → 3.10.2

package/dist/{vue-ui-horizontal-bar-BPX7YBdV.js → vue-ui-horizontal-bar-B0UY6b-O.js}

@@ -1,41 +1,45 @@
-import { useCssVars as Ca, defineAsyncComponent as ae, useSlots as ka, computed as d, ref as i, toRefs as _a, watch as le, onBeforeUnmount as xa, onMounted as Be, createElementBlock as u, openBlock as n, unref as s, normalizeStyle as h, normalizeClass as J, createBlock as Q, createCommentVNode as y, renderSlot as g, createVNode as oe, withCtx as p, normalizeProps as B, guardReactiveProps as N, createSlots as pe, createElementVNode as r, toDisplayString as m, Fragment as O, renderList as E, mergeProps as mt, resolveDynamicComponent as wa, withKeys as $a, createTextVNode as Ct, nextTick as Ne } from "vue";
-import { c as La, t as Aa, i as Ta, j as Z, a1 as Oe, k as Sa, g as ue, o as Ee, U as S, m as Ie, a as se, d as G, X as Fa, s as Me, h as za, $ as Ve, aq as Pa, v as Da, r as Ba, y as Na, _ as Oa } from "./lib-2iaAPQ_c.js";
-import { t as Ea, u as Ia } from "./useResponsive-DfdjqQps.js";
-import { u as Ma, a as Re } from "./useNestedProp-BCt4DMkT.js";
-import { u as Va, B as Ra } from "./BaseScanner-BMpwQAfz.js";
-import { u as Ha } from "./usePrinter-ChVMpU2f.js";
-import { u as Xa } from "./useSvgExport-ByUukOZt.js";
-import { u as Ua } from "./useThemeCheck-DGJ31Vi5.js";
-import { u as Ga } from "./useTableResponsive-Cbx-ACcP.js";
-import { u as Wa } from "./useUserOptionState-BIvW1Kz7.js";
-import { u as ja } from "./useChartAccessibility-9icAAmYg.js";
-import kt from "./Legend-D2xmnFPH.js";
-import Ya from "./vue-ui-accordion-CAXPDm31.js";
-import qa from "./Title-B5L2jweB.js";
-import { _ as _t } from "./Shape-12_eh8zD.js";
-import Ka from "./img-CqYIrJ8I.js";
-import { _ as Ja } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", layout: { separators: { color: "#4A4A4A" }, bars: { dataLabels: { color: "#CCCCCC" }, nameLabels: { color: "#CCCCCC" }, parentLabels: { color: "#CCCCCC" } }, highlighter: { color: "#CCCCCC" } }, legend: { backgroundColor: "#1A1A1A", color: "#CCCCCC" }, title: { color: "#CCCCCC", subtitle: { color: "#757575" } }, tooltip: { backgroundColor: "#1A1A1A", backgroundOpacity: 70, color: "#CCCCCC", borderColor: "#5A5A5A" } } }, table: { th: { backgroundColor: "#1A1A1A", color: "#CCCCCC" }, td: { backgroundColor: "#1A1A1A", color: "#CCCCCC" } } }, wt = { style: { chart: { backgroundColor: "#FFF8E1", color: "#424242", layout: { bars: { borderRadius: 0, useGradient: !1, dataLabels: { color: "#424242" }, nameLabels: { color: "#424242" }, parentLabels: { color: "#424242" } }, highlighter: { color: "#FF8A65" }, separators: { show: !1 } }, legend: { backgroundColor: "#FFF8E1", color: "#424242" }, title: { color: "#424242", subtitle: { color: "#757575" } }, tooltip: { backgroundColor: "#FFECB3", backgroundOpacity: 30, color: "#424242", borderColor: "#FF8A65" } } }, table: { th: { backgroundColor: "#FFF8E1", color: "#424242" }, td: { backgroundColor: "#FFF8E1", color: "#424242" } } }, $t = { style: { chart: { backgroundColor: "#1E1E1E", color: "#BDBDBD", layout: { bars: { borderRadius: 0, useGradient: !1, dataLabels: { color: "#BDBDBD" }, nameLabels: { color: "#BDBDBD" }, parentLabels: { color: "#FFF8E1" } }, highlighter: { color: "#FF8A65" }, separators: { show: !1 } }, legend: { backgroundColor: "#1E1E1E", color: "#BDBDBD" }, title: { color: "#FFF8E1", subtitle: { color: "#BDBDBD" } }, tooltip: { backgroundColor: "#1E1E1E", backgroundOpacity: 30, color: "#FFF8E1", borderColor: "#FF8A65" } } }, table: { th: { backgroundColor: "#1E1E1E", color: "#BDBDBD" }, td: { backgroundColor: "#1E1E1E", color: "#BDBDBD" } } }, Lt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#99AA99", layout: { bars: { borderRadius: 0, useGradient: !1, dataLabels: { color: "#AACCAA" }, nameLabels: { color: "#99CC99" }, parentLabels: { color: "#99CC99" } }, highlighter: { color: "#66CC66" }, separators: { show: !1 } }, legend: { backgroundColor: "#1A1A1A", color: "#99AA99" }, title: { color: "#66CC66", subtitle: { color: "#99AA99" } }, tooltip: { backgroundColor: "#2A2F2A", color: "#AACCAA", borderColor: "#66CC66" } } }, table: { th: { backgroundColor: "#1A1A1A", color: "#99AA99" }, td: { backgroundColor: "#1A1A1A", color: "#AACCAA" } } }, At = { style: { chart: { backgroundColor: "#fbfafa", color: "#8A9892", layout: { bars: { borderRadius: 8, useGradient: !0, dataLabels: { color: "#A0AC94" }, nameLabels: { color: "#8A9892" }, parentLabels: { color: "#8A9892" } }, highlighter: { color: "#8F837A" }, separators: { show: !1 } }, legend: { backgroundColor: "#fbfafa", color: "#99AA99" }, title: { color: "#8A9892", subtitle: { color: "#99AA99" } }, tooltip: { backgroundColor: "#fbfafa", color: "#8A9892" } } }, table: { th: { backgroundColor: "#fbfafa", color: "#8F837A" }, td: { backgroundColor: "#fbfafa", color: "#8F837A" } } }, Tt = { style: { chart: { backgroundColor: "#f6f6fb", color: "#50606C", layout: { bars: { borderRadius: 0, useGradient: !0, dataLabels: { color: "#61747E" }, nameLabels: { color: "#8A9892" }, parentLabels: { color: "#8A9892" } }, highlighter: { color: "#50606C" }, separators: { show: !0, color: "#DEE1DE" } }, legend: { backgroundColor: "#f6f6fb", color: "#61747E" }, title: { color: "#50606C", subtitle: { color: "#718890" } }, tooltip: { backgroundColor: "#f6f6fb", color: "#50606C" } } }, table: { th: { backgroundColor: "#f6f6fb", color: "#50606C" }, td: { backgroundColor: "#f6f6fb", color: "#50606C" } } }, St = {
+import { useCssVars as _a, defineAsyncComponent as ae, useSlots as xa, computed as d, ref as i, toRefs as wa, watch as le, onBeforeUnmount as $a, onMounted as Be, createElementBlock as u, openBlock as n, unref as s, normalizeStyle as h, normalizeClass as J, createBlock as Q, createCommentVNode as y, renderSlot as g, createVNode as oe, withCtx as b, normalizeProps as B, guardReactiveProps as O, createSlots as be, createElementVNode as r, toDisplayString as m, Fragment as N, renderList as E, mergeProps as mt, resolveDynamicComponent as Aa, withKeys as La, createTextVNode as Ct, nextTick as Oe } from "vue";
+import { c as Ta, t as Sa, i as Fa, j as Z, a1 as Ne, k as za, g as ue, o as Ee, U as S, m as Ie, a as se, d as U, X as Da, s as Me, h as Pa, $ as Ve, aq as Ba, v as Oa, r as Na, y as Ea, _ as Ia } from "./lib-CVHM9FhP.js";
+import { t as Ma, u as Va } from "./useResponsive-DfdjqQps.js";
+import { u as Ra, a as Re } from "./useNestedProp-Ckf_2P_V.js";
+import { u as Ha, B as Xa } from "./BaseScanner-BMpwQAfz.js";
+import { u as Ga } from "./usePrinter-1NmjuP-i.js";
+import { u as Ua } from "./useSvgExport-ByUukOZt.js";
+import { u as Wa } from "./useThemeCheck-D1ZYXUwG.js";
+import { u as ja } from "./useTableResponsive-Cbx-ACcP.js";
+import { u as Ya } from "./useUserOptionState-BIvW1Kz7.js";
+import { u as qa } from "./useChartAccessibility-9icAAmYg.js";
+import kt from "./Legend-DN5UJOBH.js";
+import Ka from "./vue-ui-accordion-DFKaB_05.js";
+import Ja from "./Title-NgeRXqRA.js";
+import { _ as _t } from "./Shape-PzdCMGsP.js";
+import Qa from "./img-6fNF_rG0.js";
+import { _ as Za } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const xt = { userOptions: { show: !1 }, style: { chart: { layout: { bars: { useGradient: !1, borderRadius: 1 } }, legend: { show: !1 } } } }, wt = { userOptions: { show: !1 }, style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", layout: { separators: { color: "#4A4A4A" }, bars: { useGradient: !1, borderRadius: 1, underlayerColor: "#1A1A1A", dataLabels: { color: "#CCCCCC" }, nameLabels: { color: "#CCCCCC" }, parentLabels: { color: "#CCCCCC" } }, highlighter: { color: "#CCCCCC" } }, legend: { show: !1, backgroundColor: "#1A1A1A", color: "#CCCCCC" }, title: { color: "#CCCCCC", subtitle: { color: "#757575" } }, tooltip: { backgroundColor: "#1A1A1A", backgroundOpacity: 70, color: "#CCCCCC", borderColor: "#3A3A3A" } } }, table: { th: { backgroundColor: "#1A1A1A", color: "#CCCCCC" }, td: { backgroundColor: "#1A1A1A", color: "#CCCCCC" } } }, $t = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", layout: { separators: { color: "#4A4A4A" }, bars: { dataLabels: { color: "#CCCCCC" }, nameLabels: { color: "#CCCCCC" }, parentLabels: { color: "#CCCCCC" } }, highlighter: { color: "#CCCCCC" } }, legend: { backgroundColor: "#1A1A1A", color: "#CCCCCC" }, title: { color: "#CCCCCC", subtitle: { color: "#757575" } }, tooltip: { backgroundColor: "#1A1A1A", backgroundOpacity: 70, color: "#CCCCCC", borderColor: "#5A5A5A" } } }, table: { th: { backgroundColor: "#1A1A1A", color: "#CCCCCC" }, td: { backgroundColor: "#1A1A1A", color: "#CCCCCC" } } }, At = { style: { chart: { backgroundColor: "#FFF8E1", color: "#424242", layout: { bars: { borderRadius: 0, useGradient: !1, dataLabels: { color: "#424242" }, nameLabels: { color: "#424242" }, parentLabels: { color: "#424242" } }, highlighter: { color: "#FF8A65" }, separators: { show: !1 } }, legend: { backgroundColor: "#FFF8E1", color: "#424242" }, title: { color: "#424242", subtitle: { color: "#757575" } }, tooltip: { backgroundColor: "#FFECB3", backgroundOpacity: 30, color: "#424242", borderColor: "#FF8A65" } } }, table: { th: { backgroundColor: "#FFF8E1", color: "#424242" }, td: { backgroundColor: "#FFF8E1", color: "#424242" } } }, Lt = { style: { chart: { backgroundColor: "#1E1E1E", color: "#BDBDBD", layout: { bars: { borderRadius: 0, useGradient: !1, dataLabels: { color: "#BDBDBD" }, nameLabels: { color: "#BDBDBD" }, parentLabels: { color: "#FFF8E1" } }, highlighter: { color: "#FF8A65" }, separators: { show: !1 } }, legend: { backgroundColor: "#1E1E1E", color: "#BDBDBD" }, title: { color: "#FFF8E1", subtitle: { color: "#BDBDBD" } }, tooltip: { backgroundColor: "#1E1E1E", backgroundOpacity: 30, color: "#FFF8E1", borderColor: "#FF8A65" } } }, table: { th: { backgroundColor: "#1E1E1E", color: "#BDBDBD" }, td: { backgroundColor: "#1E1E1E", color: "#BDBDBD" } } }, Tt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#99AA99", layout: { bars: { borderRadius: 0, useGradient: !1, dataLabels: { color: "#AACCAA" }, nameLabels: { color: "#99CC99" }, parentLabels: { color: "#99CC99" } }, highlighter: { color: "#66CC66" }, separators: { show: !1 } }, legend: { backgroundColor: "#1A1A1A", color: "#99AA99" }, title: { color: "#66CC66", subtitle: { color: "#99AA99" } }, tooltip: { backgroundColor: "#2A2F2A", color: "#AACCAA", borderColor: "#66CC66" } } }, table: { th: { backgroundColor: "#1A1A1A", color: "#99AA99" }, td: { backgroundColor: "#1A1A1A", color: "#AACCAA" } } }, St = { style: { chart: { backgroundColor: "#fbfafa", color: "#8A9892", layout: { bars: { borderRadius: 8, useGradient: !0, dataLabels: { color: "#A0AC94" }, nameLabels: { color: "#8A9892" }, parentLabels: { color: "#8A9892" } }, highlighter: { color: "#8F837A" }, separators: { show: !1 } }, legend: { backgroundColor: "#fbfafa", color: "#99AA99" }, title: { color: "#8A9892", subtitle: { color: "#99AA99" } }, tooltip: { backgroundColor: "#fbfafa", color: "#8A9892" } } }, table: { th: { backgroundColor: "#fbfafa", color: "#8F837A" }, td: { backgroundColor: "#fbfafa", color: "#8F837A" } } }, Ft = { style: { chart: { backgroundColor: "#f6f6fb", color: "#50606C", layout: { bars: { borderRadius: 0, useGradient: !0, dataLabels: { color: "#61747E" }, nameLabels: { color: "#8A9892" }, parentLabels: { color: "#8A9892" } }, highlighter: { color: "#50606C" }, separators: { show: !0, color: "#DEE1DE" } }, legend: { backgroundColor: "#f6f6fb", color: "#61747E" }, title: { color: "#50606C", subtitle: { color: "#718890" } }, tooltip: { backgroundColor: "#f6f6fb", color: "#50606C" } } }, table: { th: { backgroundColor: "#f6f6fb", color: "#50606C" }, td: { backgroundColor: "#f6f6fb", color: "#50606C" } } }, zt = {
   default: {},
-  dark: xt,
-  celebration: wt,
-  celebrationNight: $t,
-  hack: Lt,
-  zen: At,
-  concrete: Tt
-}, uo = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  minimal: xt,
+  minimalDark: wt,
+  dark: $t,
+  celebration: At,
+  celebrationNight: Lt,
+  hack: Tt,
+  zen: St,
+  concrete: Ft
+}, io = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
-  celebration: wt,
-  celebrationNight: $t,
-  concrete: Tt,
-  dark: xt,
-  default: St,
-  hack: Lt,
-  zen: At
-}, Symbol.toStringTag, { value: "Module" })), Qa = ["id"], Za = ["onClick"], el = ["xmlns", "viewBox"], tl = ["width", "height"], al = ["id"], ll = ["stop-color"], ol = ["stop-color"], nl = { key: 1 }, rl = ["x", "y", "width", "height", "fill", "rx"], ul = ["x", "y", "width", "height", "fill", "rx", "stroke", "stroke-width"], sl = ["x", "y", "width", "height", "fill", "rx", "stroke", "stroke-width"], il = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], cl = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], dl = { class: "vue-ui-horizontal-bar-parent-label" }, vl = ["y", "height", "width", "fill"], hl = ["y", "font-size", "fill", "x", "font-weight", "innerHTML"], pl = ["y", "font-size", "fill", "x", "font-weight"], fl = { class: "vue-ui-horizontal-bar-child-label" }, bl = ["x", "y", "font-size", "font-weight", "innerHTML"], gl = { class: "vue-ui-horizontal-bar-child-label" }, yl = ["x", "y", "font-size", "fill", "font-weight", "innerHTML"], ml = { class: "vue-ui-horizontal-bar-child-label" }, Cl = ["x", "y", "text-anchor", "font-size", "fill", "font-weight"], kl = ["y", "width", "height", "fill", "onMouseenter", "onMouseleave", "onClick"], _l = {
+  celebration: At,
+  celebrationNight: Lt,
+  concrete: Ft,
+  dark: $t,
+  default: zt,
+  hack: Tt,
+  minimal: xt,
+  minimalDark: wt,
+  zen: St
+}, Symbol.toStringTag, { value: "Module" })), el = ["id"], tl = ["onClick"], al = ["xmlns", "viewBox"], ll = ["width", "height"], ol = ["id"], nl = ["stop-color"], rl = ["stop-color"], ul = { key: 1 }, sl = ["x", "y", "width", "height", "fill", "rx"], il = ["x", "y", "width", "height", "fill", "rx", "stroke", "stroke-width"], cl = ["x", "y", "width", "height", "fill", "rx", "stroke", "stroke-width"], dl = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], vl = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], hl = { class: "vue-ui-horizontal-bar-parent-label" }, bl = ["y", "height", "width", "fill"], pl = ["y", "font-size", "fill", "x", "font-weight", "innerHTML"], fl = ["y", "font-size", "fill", "x", "font-weight"], gl = { class: "vue-ui-horizontal-bar-child-label" }, yl = ["x", "y", "font-size", "font-weight", "innerHTML"], ml = { class: "vue-ui-horizontal-bar-child-label" }, Cl = ["x", "y", "font-size", "fill", "font-weight", "innerHTML"], kl = { class: "vue-ui-horizontal-bar-child-label" }, _l = ["x", "y", "text-anchor", "font-size", "fill", "font-weight"], xl = ["y", "width", "height", "fill", "onMouseenter", "onMouseleave", "onClick"], wl = {
   key: 5,
   class: "vue-data-ui-watermark"
-}, xl = ["onClick"], wl = { style: "width:100%;padding-top: 36px;position:relative" }, $l = { class: "vue-ui-data-table" }, Ll = { key: 0 }, Al = { style: { width: "100%" } }, Tl = ["data-cell"], Sl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Fl = ["data-cell"], zl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Pl = ["data-cell"], Dl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Bl = ["data-cell"], Nl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Ol = ["data-cell"], El = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Il = ["data-cell"], Ml = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Vl = ["data-cell"], Rl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Hl = {
+}, $l = ["onClick"], Al = { style: "width:100%;padding-top: 36px;position:relative" }, Ll = { class: "vue-ui-data-table" }, Tl = { key: 0 }, Sl = { style: { width: "100%" } }, Fl = ["data-cell"], zl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Dl = ["data-cell"], Pl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Bl = ["data-cell"], Ol = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Nl = ["data-cell"], El = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Il = ["data-cell"], Ml = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Vl = ["data-cell"], Rl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Hl = ["data-cell"], Xl = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Gl = {
   __name: "vue-ui-horizontal-bar",
   props: {
     config: {
@@ -52,43 +56,43 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
     }
   },
   emits: ["selectLegend"],
-  setup(Ft, { expose: zt, emit: Pt }) {
-    Ca((t) => ({
+  setup(Dt, { expose: Pt, emit: Bt }) {
+    _a((t) => ({
       v5c652955: t.tdo
     }));
-    const Dt = ae(() => import("./Tooltip-DpfUZbt7.js")), He = ae(() => import("./BaseIcon-B9bGT7HU.js")), Bt = ae(
-      () => import("./PenAndPaper-CulSakut.js")
-    ), Nt = ae(
-      () => import("./UserOptions-5pXc4J-c.js")
-    ), Ot = ae(
-      () => import("./PackageVersion-C-JOGZBL.js")
+    const Ot = ae(() => import("./Tooltip-B6qvABDL.js")), He = ae(() => import("./BaseIcon-4uOct8re.js")), Nt = ae(
+      () => import("./PenAndPaper-LTuSTmWE.js")
     ), Et = ae(
-      () => import("./BaseDraggableDialog-O2XSymlZ.js")
-    ), { vue_ui_vertical_bar: It } = Ma(), { isThemeValid: Mt, warnInvalidTheme: Vt } = Ua(), Rt = ka(), C = Ft, fe = d({
+      () => import("./UserOptions-CX7Xsusk.js")
+    ), It = ae(
+      () => import("./PackageVersion-CQxJyGQr.js")
+    ), Mt = ae(
+      () => import("./BaseDraggableDialog-BQYfVNu8.js")
+    ), { vue_ui_vertical_bar: Vt } = Ra(), { isThemeValid: Rt, warnInvalidTheme: Ht } = Wa(), Xt = xa(), C = Dt, pe = d({
       get() {
         return !!C.dataset && C.dataset.length;
       },
       set(t) {
         return t;
       }
-    }), F = i(La()), be = i(!1), ge = i(""), Ht = i(null), Xe = i(0), I = i(null), Ue = i(null), ye = i(null), Ge = i(null), We = i(null), je = i(0), me = i(0), Xt = i(null), ne = i(null), Ce = i(null), Ut = i(null), ke = i(null), w = i([]), Gt = i({ none: 0, asc: 1, desc: 2 }), H = i(0), ie = i(!1), re = i(0), ee = i(0), _e = i(null), Wt = Pt, e = i(Le()), jt = d(() => [
+    }), F = i(Ta()), fe = i(!1), ge = i(""), Gt = i(null), Xe = i(0), I = i(null), Ge = i(null), ye = i(null), Ue = i(null), We = i(null), je = i(0), me = i(0), Ut = i(null), ne = i(null), Ce = i(null), Wt = i(null), ke = i(null), w = i([]), jt = i({ none: 0, asc: 1, desc: 2 }), H = i(0), ie = i(!1), re = i(0), ee = i(0), _e = i(null), Yt = Bt, e = i(Ae()), qt = d(() => [
       { name: "", value: 6, color: "#d9d9d9" },
       { name: "", value: 5, color: "#d9d9d9" },
       { name: "", value: 4, color: "#d9d9d9" },
       { name: "", value: 3, color: "#d9d9d9" },
       { name: "", value: 2, color: "#d9d9d9" },
       { name: "", value: 1, color: "#d9d9d9" }
-    ]), { loading: Ye, FINAL_DATASET: qe, manualLoading: xe } = Va({
-      ..._a(C),
+    ]), { loading: Ye, FINAL_DATASET: qe, manualLoading: xe } = Ha({
+      ...wa(C),
       FINAL_CONFIG: e,
-      prepareConfig: Le,
+      prepareConfig: Ae,
       callback: () => {
         Promise.resolve().then(async () => {
-          x.value.showTable = e.value.table.show, Jt();
+          x.value.showTable = e.value.table.show, Zt();
         });
       },
-      skeletonDataset: jt.value,
-      skeletonConfig: Aa({
+      skeletonDataset: qt.value,
+      skeletonConfig: Sa({
         defaultConfig: e.value,
         userConfig: {
           useCssAnimation: !1,
@@ -121,38 +125,38 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
           }
         }
       })
-    }), { userOptionsVisible: we, setUserOptionsVisibility: Ke, keepUserOptionState: Je } = Wa({ config: e.value }), { svgRef: $e } = ja({
+    }), { userOptionsVisible: we, setUserOptionsVisibility: Ke, keepUserOptionState: Je } = Ya({ config: e.value }), { svgRef: $e } = qa({
       config: e.value.style.chart.title
     });
-    function Le() {
+    function Ae() {
       const t = Re({
         userConfig: C.config,
-        defaultConfig: It
+        defaultConfig: Vt
       });
       let l = {};
       const a = t.theme;
       if (a)
-        if (!Mt.value(t))
-          Vt(t), l = t;
+        if (!Rt.value(t))
+          Ht(t), l = t;
         else {
           const o = Re({
-            userConfig: St[a] || C.config,
+            userConfig: zt[a] || C.config,
             defaultConfig: t
           });
           l = {
             ...Re({ userConfig: C.config, defaultConfig: o }),
-            customPalette: t.customPalette.length ? t.customPalette : Ta[a] || Z
+            customPalette: t.customPalette.length ? t.customPalette : Fa[a] || Z
           };
         }
       else
         l = t;
-      return C.config && Oe(C.config, "events.datapointEnter") ? l.events.datapointEnter = C.config.events.datapointEnter : l.events.datapointEnter = null, C.config && Oe(C.config, "events.datapointLeave") ? l.events.datapointLeave = C.config.events.datapointLeave : l.events.datapointLeave = null, C.config && Oe(C.config, "events.datapointClick") ? l.events.datapointClick = C.config.events.datapointClick : l.events.datapointClick = null, l;
+      return C.config && Ne(C.config, "events.datapointEnter") ? l.events.datapointEnter = C.config.events.datapointEnter : l.events.datapointEnter = null, C.config && Ne(C.config, "events.datapointLeave") ? l.events.datapointLeave = C.config.events.datapointLeave : l.events.datapointLeave = null, C.config && Ne(C.config, "events.datapointClick") ? l.events.datapointClick = C.config.events.datapointClick : l.events.datapointClick = null, l;
     }
     const M = i(e.value.style.chart.width), X = i(e.value.style.chart.height), k = i(e.value.style.chart.layout.bars.gap);
     le(
       () => C.config,
       (t) => {
-        Ye.value || (e.value = Le()), we.value = !e.value.userOptions.showOnChartHover, je.value += 1, me.value += 1, x.value.showTable = e.value.table.show, x.value.sortDesc = e.value.style.chart.layout.bars.sort === "desc", x.value.showTooltip = e.value.style.chart.tooltip.show, M.value = e.value.style.chart.width, X.value = e.value.style.chart.height, k.value = e.value.style.chart.layout.bars.gap;
+        Ye.value || (e.value = Ae()), we.value = !e.value.userOptions.showOnChartHover, je.value += 1, me.value += 1, x.value.showTable = e.value.table.show, x.value.sortDesc = e.value.style.chart.layout.bars.sort === "desc", x.value.showTooltip = e.value.style.chart.tooltip.show, M.value = e.value.style.chart.width, X.value = e.value.style.chart.height, k.value = e.value.style.chart.layout.bars.gap;
       },
       { deep: !0 }
     ), le(
@@ -162,36 +166,36 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
       },
       { deep: !0 }
     );
-    const { isPrinting: Qe, isImaging: Ze, generatePdf: et, generateImage: tt } = Ha({
+    const { isPrinting: Qe, isImaging: Ze, generatePdf: et, generateImage: tt } = Ga({
       elementId: `vue-ui-vertical-bar_${F.value}`,
       fileName: e.value.style.chart.title.text || "vue-ui-vertical-bar",
       options: e.value.userOptions.print
-    }), Yt = d(() => e.value.userOptions.show && !e.value.style.chart.title.text), at = d(() => Sa(e.value.customPalette)), lt = i(null), qt = d(() => e.value.table.responsiveBreakpoint), ce = d(() => !!e.value.debug), Kt = i(0), U = i(null), W = i(null);
-    function Jt() {
+    }), Kt = d(() => e.value.userOptions.show && !e.value.style.chart.title.text), at = d(() => za(e.value.customPalette)), lt = i(null), Jt = d(() => e.value.table.responsiveBreakpoint), ce = d(() => !!e.value.debug), Qt = i(0), G = i(null), W = i(null);
+    function Zt() {
       if (I.value && (Ee(C.dataset) && (ue({
         componentName: "VueUiVerticalBar",
         type: "dataset",
         debug: ce.value
-      }), fe.value = !1, xe.value = !0), Ee(C.dataset) || (xe.value = e.value.loading), e.value.responsive)) {
-        const t = Ea(() => {
-          const { width: l, height: a } = Ia({
+      }), pe.value = !1, xe.value = !0), Ee(C.dataset) || (xe.value = e.value.loading), e.value.responsive)) {
+        const t = Ma(() => {
+          const { width: l, height: a } = Va({
             chart: I.value,
-            title: e.value.style.chart.title.text ? Ue.value : null,
+            title: e.value.style.chart.title.text ? Ge.value : null,
             legend: e.value.style.chart.legend.show ? ye.value : null,
-            source: Ge.value,
+            source: Ue.value,
             noTitle: We.value
           });
-          Kt.value = a / 3, requestAnimationFrame(async () => {
+          Qt.value = a / 3, requestAnimationFrame(async () => {
             X.value = a, M.value = l;
           });
         });
-        U.value && (W.value && U.value.unobserve(W.value), U.value.disconnect()), U.value = new ResizeObserver(t), Ne(() => {
-          W.value = I.value?.parentNode, W.value && U.value.observe(W.value);
+        G.value && (W.value && G.value.unobserve(W.value), G.value.disconnect()), G.value = new ResizeObserver(t), Oe(() => {
+          W.value = I.value?.parentNode, W.value && G.value.observe(W.value);
         });
       }
     }
-    xa(() => {
-      U.value && (W.value && U.value.unobserve(W.value), U.value.disconnect());
+    $a(() => {
+      G.value && (W.value && G.value.unobserve(W.value), G.value.disconnect());
     });
     const x = i({
       showTable: e.value.table.show,
@@ -219,16 +223,16 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
         });
       }));
     }), qe.value.map((t, l) => {
-      const a = `vertical_parent_${l}_${F.value}`, o = t.children && t.children.length > 0, f = S(
-        t.value ? t.value : o ? t.children.map((b) => b.value || 0).reduce((b, P) => b + P, 0) : 0
-      ), _ = f >= 0 ? 1 : -1;
+      const a = `vertical_parent_${l}_${F.value}`, o = t.children && t.children.length > 0, p = S(
+        t.value ? t.value : o ? t.children.map((f) => f.value || 0).reduce((f, D) => f + D, 0) : 0
+      ), _ = p >= 0 ? 1 : -1;
       return {
         ...t,
         id: a,
         absoluteIndex: l,
         shape: "square",
         opacity: w.value.includes(a) ? 0.5 : 1,
-        value: Math.abs(f),
+        value: Math.abs(p),
         sign: _,
         hasChildren: o,
         isChild: !1,
@@ -236,45 +240,45 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
         isSegregated: w.value.includes(a),
         color: Ie(t.color) || at.value[l] || Z[l] || Z[l % Z.length],
         children: !t.children || !t.children.length ? [] : t.children.toSorted(
-          ie.value ? () => 0 : (b, P) => ot.value ? P.value - b.value : b.value - P.value
-        ).map((b, P) => ({
-          ...b,
-          value: S(Math.abs(b.value)),
+          ie.value ? () => 0 : (f, D) => ot.value ? D.value - f.value : f.value - D.value
+        ).map((f, D) => ({
+          ...f,
+          value: S(Math.abs(f.value)),
           absoluteIndex: l,
-          sign: b.value >= 0 ? 1 : -1,
+          sign: f.value >= 0 ? 1 : -1,
           isChild: !0,
           parentId: a,
           parentName: t.name,
-          parentValue: f,
+          parentValue: p,
           parentSign: _,
-          id: `vertical_child_${l}_${P}_${F.value}`,
-          childIndex: P,
-          color: Ie(b.color) || Ie(t.color) || at.value[l] || Z[l] || Z[l % Z.length]
-        })).map((b, P) => ({
-          ...b,
-          isFirstChild: P === 0,
-          isLastChild: P === t.children.length - 1
+          id: `vertical_child_${l}_${D}_${F.value}`,
+          childIndex: D,
+          color: Ie(f.color) || Ie(t.color) || at.value[l] || Z[l] || Z[l % Z.length]
+        })).map((f, D) => ({
+          ...f,
+          isFirstChild: D === 0,
+          isLastChild: D === t.children.length - 1
         }))
       };
     }).toSorted(
       ie.value ? () => 0 : (t, l) => ot.value ? l.value - t.value : t.value - l.value
     ))), j = d(() => z.value.filter(
       (t) => !w.value.includes(t.id)
-    )), $ = d(() => j.value.flatMap((t) => t.hasChildren ? t.children : t)), Qt = d(() => z.value.flatMap((t) => t.hasChildren ? t.children : t)), nt = d(() => j.value.flatMap((t) => t.children && t.children.length > 0 ? t.children.length : 1).reduce((t, l) => t + l, 0)), rt = d(() => ({
+    )), $ = d(() => j.value.flatMap((t) => t.hasChildren ? t.children : t)), ea = d(() => z.value.flatMap((t) => t.hasChildren ? t.children : t)), nt = d(() => j.value.flatMap((t) => t.children && t.children.length > 0 ? t.children.length : 1).reduce((t, l) => t + l, 0)), rt = d(() => ({
       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" : ""
-    })), L = d(() => e.value.style.chart.layout.bars.parentLabels.show ? e.value.style.chart.layout.bars.parentLabels.fontSize * 3 + e.value.style.chart.layout.bars.parentLabels.paddingBottom : 0), A = d(() => {
+    })), A = d(() => e.value.style.chart.layout.bars.parentLabels.show ? e.value.style.chart.layout.bars.parentLabels.fontSize * 3 + e.value.style.chart.layout.bars.parentLabels.paddingBottom : 0), L = d(() => {
       const t = [];
       let l = 0;
       return $.value.forEach((a, o) => {
         a.isChild && a.childIndex === 0 && e.value.style.chart.layout.bars.parentLabels.show && (l += 1), t[o] = l;
       }), t;
     }), v = d(() => {
-      const l = Math.max(0, ...A.value) * L.value;
+      const l = Math.max(0, ...L.value) * A.value;
       return (X.value - 24 - (nt.value - 1) * k.value - l) / nt.value;
     }), R = d(() => ({
       width: M.value,
@@ -285,18 +289,18 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
         right: 64 + e.value.style.chart.layout.bars.paddingRight,
         bottom: 12
       }
-    })), Ae = i(0);
+    })), Le = i(0);
     function ut() {
-      Ne(() => {
+      Oe(() => {
         if (!ke.value) {
-          Ae.value = 0;
+          Le.value = 0;
           return;
         }
         const l = Array.from(ke.value.querySelectorAll("text")).reduce((a, o) => {
-          const f = o.getBBox?.().width ?? o.getComputedTextLength();
-          return f > a ? f : a;
+          const p = o.getBBox?.().width ?? o.getComputedTextLength();
+          return p > a ? p : a;
         }, 0);
-        Ae.value = l + 12;
+        Le.value = l + 12;
       });
     }
     le(
@@ -313,7 +317,7 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
       ut();
     });
     function de() {
-      Ne(() => {
+      Oe(() => {
         re.value = 0, ee.value = 0, requestAnimationFrame(() => {
           if (!_e.value) {
             re.value = 0, ee.value = 0;
@@ -327,12 +331,12 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
             return;
           }
           let l = 1 / 0, a = 0;
-          t.forEach((ma) => {
-            const De = ma.getBBox(), gt = De.x, yt = De.x + De.width;
+          t.forEach((ka) => {
+            const Pe = ka.getBBox(), gt = Pe.x, yt = Pe.x + Pe.width;
             gt < l && (l = gt), yt > a && (a = yt);
           });
-          const o = 0, f = M.value, _ = 24, b = Math.max(0, o - l + _), P = Math.max(0, a - f + _);
-          ee.value = b, re.value = P;
+          const o = 0, p = M.value, _ = 24, f = Math.max(0, o - l + _), D = Math.max(0, a - p + _);
+          ee.value = f, re.value = D;
         });
       });
     }
@@ -342,7 +346,7 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
       { deep: !0 }
     ), Be(() => de());
     const c = d(() => {
-      const t = Ae.value + Math.abs(e.value.style.chart.layout.bars.nameLabels.offsetX) + ee.value + e.value.style.chart.layout.bars.offsetX, l = R.value.width - R.value.padding.right, a = Math.max(0, l - t - re.value - ee.value - e.value.style.chart.layout.bars.offsetX);
+      const t = Le.value + Math.abs(e.value.style.chart.layout.bars.nameLabels.offsetX) + ee.value + e.value.style.chart.layout.bars.offsetX, l = R.value.width - R.value.padding.right, a = Math.max(0, l - t - re.value - ee.value - e.value.style.chart.layout.bars.offsetX);
       return {
         top: R.value.padding.top,
         bottom: R.value.padding.top + R.value.height,
@@ -359,7 +363,7 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
         if (w.value.length === z.value.length - 1) return;
         w.value.push(t);
       }
-      Wt("selectLegend", j.value), de();
+      Yt("selectLegend", j.value), de();
     }
     function st(t) {
       if (!z.value.length)
@@ -367,36 +371,36 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
       const l = z.value.find((a) => a.name === t);
       return l || (e.value.debug && console.warn(`VueUiHorizontalBar - Series name not found "${t}"`), null);
     }
-    function Zt(t) {
+    function ta(t) {
       const l = st(t);
       l !== null && w.value.includes(l.id) && Y(l.id);
     }
-    function ea(t) {
+    function aa(t) {
       const l = st(t);
       l !== null && (w.value.includes(l.id) || Y(l.id));
     }
     const V = d(() => j.value.map((t) => Math.abs(t.value)).reduce((t, l) => t + l, 0));
     function it(t, l = !1, a = 0) {
-      return l ? G({
+      return l ? U({
         v: S(Math.abs(t) / V.value * 100),
         s: "%",
         r: a
       }) : Math.abs(t) / V.value;
     }
-    const q = d(() => $.value.map((t) => t.sign).includes(-1)), ta = d(() => Math.max(
+    const q = d(() => $.value.map((t) => t.sign).includes(-1)), la = d(() => Math.max(
       ...j.value.flatMap((t) => t.children && t.children.length ? Math.max(...t.children.map((l) => l.value)) : t.value)
     ));
     function T(t) {
-      const l = t / ta.value;
+      const l = t / la.value;
       return c.value.width / (q.value ? 2 : 1) * l;
     }
-    function aa(t) {
+    function oa(t) {
       return T(t) + c.value.left;
     }
     function te(t, l) {
-      const a = j.value.find((b) => b.id === t.parentId);
+      const a = j.value.find((f) => f.id === t.parentId);
       return {
-        y: c.value.top + (k.value + v.value) * l + A.value[l] * L.value - L.value + e.value.style.chart.layout.bars.parentLabels.fontSize,
+        y: c.value.top + (k.value + v.value) * l + L.value[l] * A.value - A.value + e.value.style.chart.layout.bars.parentLabels.fontSize,
         name: a.name,
         value: [void 0, NaN, null].includes(a.value) ? "" : a.sign === 1 ? a.value : -a.value,
         percentageToTotal: isNaN(a.value / V.value) ? "" : it(
@@ -407,33 +411,33 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
         sign: a.sign
       };
     }
-    function la() {
+    function na() {
       return j.value;
     }
     function ct(t, l) {
       return te(t, l).name;
     }
-    function oa(t, l) {
+    function ra(t, l) {
       const a = te(t, l);
       return dt(a.value, a, l, t.parentSign || t.sign);
     }
     const Te = i(null), Se = i(null);
-    function na({ datapoint: t, seriesIndex: l }) {
+    function ua({ datapoint: t, seriesIndex: l }) {
       e.value.events.datapointClick && e.value.events.datapointClick({ datapoint: t, seriesIndex: l });
     }
-    function ra({ datapoint: t, seriesIndex: l }) {
-      e.value.events.datapointLeave && e.value.events.datapointLeave({ datapoint: t, seriesIndex: l }), Ht.value = null, be.value = !1, Te.value = null;
+    function sa({ datapoint: t, seriesIndex: l }) {
+      e.value.events.datapointLeave && e.value.events.datapointLeave({ datapoint: t, seriesIndex: l }), Gt.value = null, fe.value = !1, Te.value = null;
     }
-    function ua(t, l) {
+    function ia(t, l) {
       e.value.events.datapointEnter && e.value.events.datapointEnter({ datpoint: t, seriesIndex: l }), Se.value = {
         datapoint: t,
         seriesIndex: l,
         series: z.value,
         config: e.value
-      }, be.value = !0, Te.value = t.id;
+      }, fe.value = !0, Te.value = t.id;
       let a = "";
-      const o = t.isChild ? t.parentName : t.name, f = t.isChild ? t.name : "", _ = e.value.style.chart.tooltip.customFormat;
-      Na(_) && Oa(
+      const o = t.isChild ? t.parentName : t.name, p = t.isChild ? t.name : "", _ = e.value.style.chart.tooltip.customFormat;
+      Ea(_) && Ia(
         () => _({
           datapoint: t,
           series: z.value,
@@ -446,23 +450,23 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
         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}"/>${Rt.pattern ? `<rect x="0" y="0" height="60" width="60" rx="5" stroke="none" fill="url(#pattern_${F.value}_${t.absoluteIndex})"/>` : ""}</svg> ${o}</div>
-                ${f ? `<div>${f}</div>` : ""}
+                <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}"/>${Xt.pattern ? `<rect x="0" y="0" height="60" width="60" rx="5" stroke="none" fill="url(#pattern_${F.value}_${t.absoluteIndex})"/>` : ""}</svg> ${o}</div>
+                ${p ? `<div>${p}</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,
-        G({
+        U({
           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>${G({
+      )}</b></div>`), e.value.style.chart.tooltip.showPercentage && (a += `<div>${e.value.translations.percentageToTotal} : <b>${U({
         v: Math.abs(t.value) / V.value * 100,
         s: "%",
         r: e.value.style.chart.tooltip.roundingPercentage
-      })}</b></div>`, t.isChild && (a += `<div>${e.value.translations.percentageToSerie}: <b>${G({
+      })}</b></div>`, t.isChild && (a += `<div>${e.value.translations.percentageToSerie}: <b>${U({
         v: Math.abs(t.value) / Math.abs(t.parentValue) * 100,
         s: "%",
         r: e.value.style.chart.tooltip.roundingPercentage
@@ -471,10 +475,10 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
     function dt(t, l, a, o) {
       if (!e.value.style.chart.layout.bars.dataLabels.value.show)
         return "";
-      const f = se(
+      const p = se(
         e.value.style.chart.layout.bars.dataLabels.value.formatter,
         S(o === -1 && t >= 0 ? -t : t),
-        G({
+        U({
           p: e.value.style.chart.layout.bars.dataLabels.value.prefix,
           v: S(o === -1 && t >= 0 ? -t : t),
           s: e.value.style.chart.layout.bars.dataLabels.value.suffix,
@@ -486,9 +490,9 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
         !0,
         e.value.style.chart.layout.bars.dataLabels.percentage.roundingPercentage
       )})`;
-      return `${f}${e.value.style.chart.layout.bars.dataLabels.percentage.show ? ` ${_}` : ""}`;
+      return `${p}${e.value.style.chart.layout.bars.dataLabels.percentage.show ? ` ${_}` : ""}`;
     }
-    const D = d(() => {
+    const P = d(() => {
       const t = [
         e.value.translations.parentName,
         e.value.translations.value,
@@ -532,16 +536,16 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
         [e.value.style.chart.title.text],
         [e.value.style.chart.title.subtitle.text],
         [""]
-      ], a = D.value.head, o = D.value.body.map((b) => [
-        b.parentName,
-        b.parentValue,
-        b.percentageToTotal,
-        b.childName,
-        b.childValue,
-        b.childPercentageToParent,
-        b.childPercentageToTotal
-      ]), f = l.concat([a]).concat(o), _ = Da(f);
-      t ? t(_) : Ba({
+      ], a = P.value.head, o = P.value.body.map((f) => [
+        f.parentName,
+        f.parentValue,
+        f.percentageToTotal,
+        f.childName,
+        f.childValue,
+        f.childPercentageToParent,
+        f.childPercentageToTotal
+      ]), p = l.concat([a]).concat(o), _ = Oa(p);
+      t ? t(_) : Na({
         csvContent: _,
         title: e.value.style.chart.title.text || "vue-ui-vertical-bar"
       });
@@ -561,31 +565,31 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
         type: "attributeWrongValue",
         property: "style.chart.layout.bars.sort",
         key: e.value.style.chart.layout.bars.sort
-      }), H.value = Gt.value[e.value.style.chart.layout.bars.sort], x.value.sortDesc = H.value === 2, ie.value = H.value === 0;
+      }), H.value = jt.value[e.value.style.chart.layout.bars.sort], x.value.sortDesc = H.value === 2, ie.value = H.value === 0;
     });
-    function sa() {
+    function ca() {
       H.value += 1, H.value > 2 && (H.value = 0);
     }
-    function pt() {
-      sa(), x.value.sortDesc = H.value === 2, ie.value = H.value === 0;
+    function bt() {
+      ca(), x.value.sortDesc = H.value === 2, ie.value = H.value === 0;
     }
-    function ft() {
+    function pt() {
       x.value.showTooltip = !x.value.showTooltip;
     }
     const ve = i(!1);
     function ze() {
       ve.value = !ve.value;
     }
-    async function ia({ scale: t = 2 } = {}) {
+    async function da({ scale: t = 2 } = {}) {
       if (!I.value) return;
-      const { width: l, height: a } = I.value.getBoundingClientRect(), o = l / a, { imageUri: f, base64: _ } = await Ka({
+      const { width: l, height: a } = I.value.getBoundingClientRect(), o = l / a, { imageUri: p, base64: _ } = await Qa({
         domElement: I.value,
         base64: !0,
         img: !0,
         scale: t
       });
       return {
-        imageUri: f,
+        imageUri: p,
         base64: _,
         title: e.value.style.chart.title.text,
         width: l,
@@ -596,7 +600,7 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
     const he = d(() => {
       const t = e.value.table.useDialog && !e.value.table.show, l = x.value.showTable;
       return {
-        component: t ? Et : Ya,
+        component: t ? Mt : Ka,
         title: `${e.value.style.chart.title.text}${e.value.style.chart.title.subtitle.text ? `: ${e.value.style.chart.title.subtitle.text}` : ""}`,
         props: t ? {
           backgroundColor: e.value.table.th.backgroundColor,
@@ -629,17 +633,17 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
         e.value.table.show || (t && e.value.table.useDialog && ne.value ? ne.value.open() : "close" in ne.value && ne.value.close());
       }
     );
-    const { isResponsive: ca } = Ga(lt, qt);
-    function Pe() {
+    const { isResponsive: va } = ja(lt, Jt);
+    function De() {
       x.value.showTable = !1, Ce.value && Ce.value.setTableIconState(!1);
     }
-    const da = d(() => z.value.map((t, l) => ({
+    const ha = d(() => z.value.map((t, l) => ({
       ...t,
       shape: "square",
       display: `${t.name}: ${se(
         e.value.style.chart.layout.bars.dataLabels.value.formatter,
         t.value,
-        G({
+        U({
           p: e.value.style.chart.legend.prefix,
           v: t.value,
           s: e.value.style.chart.legend.suffix,
@@ -647,39 +651,39 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
         }),
         { datapoint: t, seriesIndex: l }
       )}`
-    }))), va = d(() => e.value.style.chart.backgroundColor), ha = d(() => e.value.style.chart.legend), pa = d(() => e.value.style.chart.title), fa = d(() => da.value.map((t) => ({
+    }))), ba = d(() => e.value.style.chart.backgroundColor), pa = d(() => e.value.style.chart.legend), fa = d(() => e.value.style.chart.title), ga = d(() => ha.value.map((t) => ({
       ...t,
       name: t.display
-    }))), { exportSvg: ba, getSvg: ga } = Xa({
+    }))), { exportSvg: ya, getSvg: ma } = Ua({
       svg: $e,
-      title: pa,
-      legend: ha,
-      legendItems: fa,
-      backgroundColor: va
+      title: fa,
+      legend: pa,
+      legendItems: ga,
+      backgroundColor: ba
     });
-    async function bt({ isCb: t }) {
+    async function ft({ isCb: t }) {
       if (t) {
-        const { blob: l, url: a, text: o, dataUrl: f } = await ga();
-        e.value.userOptions.callbacks.svg({ blob: l, url: a, text: o, dataUrl: f });
+        const { blob: l, url: a, text: o, dataUrl: p } = await ma();
+        e.value.userOptions.callbacks.svg({ blob: l, url: a, text: o, dataUrl: p });
       } else
-        ba();
+        ya();
     }
-    function ya() {
+    function Ca() {
       console.warn("[autoSize]: this legacy method can be safely removed as it ha no impact.");
     }
-    return zt({
-      autoSize: ya,
-      getData: la,
-      getImage: ia,
+    return Pt({
+      autoSize: Ca,
+      getData: na,
+      getImage: da,
       generatePdf: et,
       generateCsv: Fe,
       generateImage: tt,
-      generateSvg: bt,
-      hideSeries: ea,
-      showSeries: Zt,
+      generateSvg: ft,
+      hideSeries: aa,
+      showSeries: ta,
       toggleTable: ht,
-      toggleSort: pt,
-      toggleTooltip: ft,
+      toggleSort: bt,
+      toggleTooltip: pt,
       toggleAnnotator: ze,
       toggleFullscreen: vt
     }), (t, l) => (n(), u("div", {
@@ -691,7 +695,7 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
       onMouseenter: l[3] || (l[3] = () => s(Ke)(!0)),
       onMouseleave: l[4] || (l[4] = () => s(Ke)(!1))
     }, [
-      e.value.userOptions.buttons.annotator ? (n(), Q(s(Bt), {
+      e.value.userOptions.buttons.annotator ? (n(), Q(s(Nt), {
         key: 0,
         svgRef: s($e),
         backgroundColor: e.value.style.chart.backgroundColor,
@@ -699,27 +703,27 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
         active: ve.value,
         onClose: ze
       }, {
-        "annotator-action-close": p(() => [
+        "annotator-action-close": b(() => [
           g(t.$slots, "annotator-action-close", {}, void 0, !0)
         ]),
-        "annotator-action-color": p(({ color: a }) => [
-          g(t.$slots, "annotator-action-color", B(N({ color: a })), void 0, !0)
+        "annotator-action-color": b(({ color: a }) => [
+          g(t.$slots, "annotator-action-color", B(O({ color: a })), void 0, !0)
         ]),
-        "annotator-action-draw": p(({ mode: a }) => [
-          g(t.$slots, "annotator-action-draw", B(N({ mode: a })), void 0, !0)
+        "annotator-action-draw": b(({ mode: a }) => [
+          g(t.$slots, "annotator-action-draw", B(O({ mode: a })), void 0, !0)
         ]),
-        "annotator-action-undo": p(({ disabled: a }) => [
-          g(t.$slots, "annotator-action-undo", B(N({ disabled: a })), void 0, !0)
+        "annotator-action-undo": b(({ disabled: a }) => [
+          g(t.$slots, "annotator-action-undo", B(O({ disabled: a })), void 0, !0)
         ]),
-        "annotator-action-redo": p(({ disabled: a }) => [
-          g(t.$slots, "annotator-action-redo", B(N({ disabled: a })), void 0, !0)
+        "annotator-action-redo": b(({ disabled: a }) => [
+          g(t.$slots, "annotator-action-redo", B(O({ disabled: a })), void 0, !0)
         ]),
-        "annotator-action-delete": p(({ disabled: a }) => [
-          g(t.$slots, "annotator-action-delete", B(N({ disabled: a })), void 0, !0)
+        "annotator-action-delete": b(({ disabled: a }) => [
+          g(t.$slots, "annotator-action-delete", B(O({ disabled: a })), void 0, !0)
         ]),
         _: 3
       }, 8, ["svgRef", "backgroundColor", "color", "active"])) : y("", !0),
-      Yt.value ? (n(), u("div", {
+      Kt.value ? (n(), u("div", {
         key: 1,
         ref_key: "noTitle",
         ref: We,
@@ -729,10 +733,10 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
       e.value.style.chart.title.text ? (n(), u("div", {
         key: 2,
         ref_key: "chartTitle",
-        ref: Ue,
+        ref: Ge,
         style: "width:100%;background:transparent;padding-bottom:12px"
       }, [
-        (n(), Q(qa, {
+        (n(), Q(Ja, {
           key: `title_${je.value}`,
           config: {
             title: {
@@ -746,7 +750,7 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
           }
         }, null, 8, ["config"]))
       ], 512)) : y("", !0),
-      e.value.userOptions.show && fe.value && (s(Je) || s(we)) ? (n(), Q(s(Nt), {
+      e.value.userOptions.show && pe.value && (s(Je) || s(we)) ? (n(), Q(s(Et), {
         ref_key: "userOptionsRef",
         ref: Ce,
         key: `user_options_${Xe.value}`,
@@ -777,89 +781,89 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
         onGeneratePdf: s(et),
         onGenerateCsv: Fe,
         onGenerateImage: s(tt),
-        onGenerateSvg: bt,
+        onGenerateSvg: ft,
         onToggleTable: ht,
-        onToggleSort: pt,
-        onToggleTooltip: ft,
+        onToggleSort: bt,
+        onToggleTooltip: pt,
         onToggleAnnotator: ze,
         style: h({
           visibility: s(Je) ? s(we) ? "visible" : "hidden" : "visible"
         })
-      }, pe({ _: 2 }, [
+      }, be({ _: 2 }, [
         t.$slots.menuIcon ? {
           name: "menuIcon",
-          fn: p(({ isOpen: a, color: o }) => [
-            g(t.$slots, "menuIcon", B(N({ isOpen: a, color: o })), void 0, !0)
+          fn: b(({ isOpen: a, color: o }) => [
+            g(t.$slots, "menuIcon", B(O({ isOpen: a, color: o })), void 0, !0)
           ]),
           key: "0"
         } : void 0,
         t.$slots.optionTooltip ? {
           name: "optionTooltip",
-          fn: p(() => [
+          fn: b(() => [
             g(t.$slots, "optionTooltip", {}, void 0, !0)
           ]),
           key: "1"
         } : void 0,
         t.$slots.optionPdf ? {
           name: "optionPdf",
-          fn: p(() => [
+          fn: b(() => [
             g(t.$slots, "optionPdf", {}, void 0, !0)
           ]),
           key: "2"
         } : void 0,
         t.$slots.optionCsv ? {
           name: "optionCsv",
-          fn: p(() => [
+          fn: b(() => [
             g(t.$slots, "optionCsv", {}, void 0, !0)
           ]),
           key: "3"
         } : void 0,
         t.$slots.optionImg ? {
           name: "optionImg",
-          fn: p(() => [
+          fn: b(() => [
             g(t.$slots, "optionImg", {}, void 0, !0)
           ]),
           key: "4"
         } : void 0,
         t.$slots.optionSvg ? {
           name: "optionSvg",
-          fn: p(() => [
+          fn: b(() => [
             g(t.$slots, "optionSvg", {}, void 0, !0)
           ]),
           key: "5"
         } : void 0,
         t.$slots.optionTable ? {
           name: "optionTable",
-          fn: p(() => [
+          fn: b(() => [
             g(t.$slots, "optionTable", {}, void 0, !0)
           ]),
           key: "6"
         } : void 0,
         t.$slots.optionLabels ? {
           name: "optionLabels",
-          fn: p(() => [
+          fn: b(() => [
             g(t.$slots, "optionLabels", {}, void 0, !0)
           ]),
           key: "7"
         } : void 0,
         t.$slots.optionSort ? {
           name: "optionSort",
-          fn: p(() => [
+          fn: b(() => [
             g(t.$slots, "optionSort", {}, void 0, !0)
           ]),
           key: "8"
         } : void 0,
         t.$slots.optionFullscreen ? {
           name: "optionFullscreen",
-          fn: p(({ toggleFullscreen: a, isFullscreen: o }) => [
-            g(t.$slots, "optionFullscreen", B(N({ toggleFullscreen: a, isFullscreen: o })), void 0, !0)
+          fn: b(({ toggleFullscreen: a, isFullscreen: o }) => [
+            g(t.$slots, "optionFullscreen", B(O({ toggleFullscreen: a, isFullscreen: o })), void 0, !0)
           ]),
           key: "9"
         } : void 0,
         t.$slots.optionAnnotator ? {
           name: "optionAnnotator",
-          fn: p(({ toggleAnnotator: a, isAnnotator: o }) => [
-            g(t.$slots, "optionAnnotator", B(N({ toggleAnnotator: a, isAnnotator: o })), void 0, !0)
+          fn: b(({ toggleAnnotator: a, isAnnotator: o }) => [
+            g(t.$slots, "optionAnnotator", B(O({ toggleAnnotator: a, isAnnotator: o })), void 0, !0)
           ]),
           key: "10"
         } : void 0
@@ -874,28 +878,28 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
           legendSet: z.value,
           config: rt.value,
           onClickMarker: l[0] || (l[0] = ({ legend: a }) => Y(a.id))
-        }, pe({
-          item: p(({ legend: a, index: o }) => [
+        }, be({
+          item: b(({ legend: a, index: o }) => [
             r("div", {
-              onClick: (f) => Y(a.id),
+              onClick: (p) => Y(a.id),
               style: h(`opacity:${w.value.includes(a.id) ? 0.5 : 1}`)
             }, m(a.name) + ": " + m(s(se)(
               e.value.style.chart.layout.bars.dataLabels.value.formatter,
               a.value,
-              s(G)({
+              s(U)({
                 p: e.value.style.chart.legend.prefix,
                 v: a.value,
                 s: e.value.style.chart.legend.suffix,
                 r: e.value.style.chart.legend.roundingValue
               }),
               { datapoint: a, seriesIndex: o }
-            )), 13, Za)
+            )), 13, tl)
           ]),
           _: 2
         }, [
           t.$slots.pattern ? {
             name: "legend-pattern",
-            fn: p(({ legend: a, index: o }) => [
+            fn: b(({ legend: a, index: o }) => [
               oe(_t, {
                 shape: a.shape,
                 radius: 30,
@@ -911,7 +915,7 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
       (n(), u("svg", {
         ref_key: "svgRef",
         ref: $e,
-        xmlns: s(Fa),
+        xmlns: s(Da),
         class: J({
           "vue-data-ui-fullscreen--on": K.value,
           "vue-data-ui-fulscreen--off": !K.value
@@ -921,10 +925,10 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
       }, [
         r("g", {
           ref_key: "G",
-          ref: Xt,
+          ref: Ut,
           class: "vue-data-ui-g"
         }, [
-          oe(s(Ot)),
+          oe(s(It)),
           t.$slots["chart-background"] ? (n(), u("foreignObject", {
             key: 0,
             x: 0,
@@ -936,8 +940,8 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
             }
           }, [
             g(t.$slots, "chart-background", {}, void 0, !0)
-          ], 8, tl)) : y("", !0),
-          (n(!0), u(O, null, E($.value, (a, o) => (n(), u("linearGradient", {
+          ], 8, ll)) : y("", !0),
+          (n(!0), u(N, null, E($.value, (a, o) => (n(), u("linearGradient", {
             x1: "0%",
             y1: "0%",
             x2: "100%",
@@ -947,29 +951,29 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
             r("stop", {
               offset: "0%",
               "stop-color": a.color
-            }, null, 8, ll),
+            }, null, 8, nl),
             r("stop", {
               offset: "100%",
               "stop-color": s(Me)(
-                s(za)(a.color, 0.03),
+                s(Pa)(a.color, 0.03),
                 100 - e.value.style.chart.layout.bars.gradientIntensity
               )
-            }, null, 8, ol)
-          ], 8, al))), 256)),
-          t.$slots.pattern ? (n(), u("g", nl, [
-            (n(!0), u(O, null, E($.value, (a) => (n(), u("defs", null, [
+            }, null, 8, rl)
+          ], 8, ol))), 256)),
+          t.$slots.pattern ? (n(), u("g", ul, [
+            (n(!0), u(N, null, E($.value, (a) => (n(), u("defs", null, [
               g(t.$slots, "pattern", mt({ ref_for: !0 }, {
                 seriesIndex: a.absoluteIndex,
                 patternId: `pattern_${F.value}_${a.absoluteIndex}`
               }), void 0, !0)
             ]))), 256))
           ])) : y("", !0),
-          (n(!0), u(O, null, E($.value, (a, o) => (n(), u("g", null, [
+          (n(!0), u(N, null, E($.value, (a, o) => (n(), u("g", null, [
             r("rect", {
               x: s(S)(
                 q.value ? c.value.left + c.value.width / 2 - (a.sign === 1 ? 0 : T(a.value) <= 0 ? 1e-4 : T(a.value)) : c.value.left
               ),
-              y: c.value.top + (k.value + v.value) * o + A.value[o] * L.value,
+              y: c.value.top + (k.value + v.value) * o + L.value[o] * A.value,
               width: s(S)(
                 T(a.value) <= 0 ? 1e-4 : T(a.value)
               ),
@@ -977,14 +981,14 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
               fill: e.value.style.chart.layout.bars.underlayerColor,
               rx: e.value.style.chart.layout.bars.borderRadius,
               class: J({ animated: e.value.useCssAnimation })
-            }, null, 10, rl)
+            }, null, 10, sl)
           ]))), 256)),
-          (n(!0), u(O, null, E($.value, (a, o) => (n(), u("g", null, [
+          (n(!0), u(N, null, E($.value, (a, o) => (n(), u("g", null, [
             r("rect", {
               x: s(S)(
                 q.value ? c.value.left + c.value.width / 2 - (a.sign === 1 ? 0 : T(a.value) <= 0 ? 1e-4 : T(a.value)) : c.value.left
               ),
-              y: c.value.top + (k.value + v.value) * o + A.value[o] * L.value,
+              y: c.value.top + (k.value + v.value) * o + L.value[o] * A.value,
               width: s(S)(
                 T(a.value) <= 0 ? 1e-4 : T(a.value)
               ),
@@ -997,13 +1001,13 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
               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: J({ animated: e.value.useCssAnimation })
-            }, null, 10, ul),
+            }, null, 10, il),
             t.$slots.pattern ? (n(), u("rect", {
               key: 0,
               x: s(S)(
                 q.value ? c.value.left + c.value.width / 2 - (a.sign === 1 ? 0 : T(a.value) <= 0 ? 1e-4 : T(a.value)) : c.value.left
               ),
-              y: c.value.top + (k.value + v.value) * o + A.value[o] * L.value,
+              y: c.value.top + (k.value + v.value) * o + L.value[o] * A.value,
               width: s(S)(
                 T(a.value) <= 0 ? 1e-4 : T(a.value)
               ),
@@ -1013,13 +1017,13 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
               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: J({ animated: e.value.useCssAnimation })
-            }, null, 10, sl)) : y("", !0),
+            }, null, 10, cl)) : y("", !0),
             (!a.isChild || a.isLastChild) && e.value.style.chart.layout.separators.show && o !== $.value.length - 1 ? (n(), u("line", {
               key: 1,
               x1: M.value,
               x2: e.value.style.chart.layout.separators.fullWidth ? 0 : c.value.left,
-              y1: v.value + k.value / 2 + c.value.top + (k.value + v.value) * o + A.value[o] * L.value,
-              y2: v.value + k.value / 2 + c.value.top + (k.value + v.value) * o + A.value[o] * L.value,
+              y1: v.value + k.value / 2 + c.value.top + (k.value + v.value) * o + L.value[o] * A.value,
+              y2: v.value + k.value / 2 + c.value.top + (k.value + v.value) * o + L.value[o] * A.value,
               stroke: e.value.style.chart.layout.separators.color,
               "stroke-width": e.value.style.chart.layout.separators.strokeWidth,
               "stroke-linecap": "round",
@@ -1027,7 +1031,7 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
                 transition: "none !important",
                 animation: "none !important"
               }
-            }, null, 8, il)) : y("", !0),
+            }, null, 8, dl)) : y("", !0),
             q.value && e.value.style.chart.layout.separators.show ? (n(), u("line", {
               key: 2,
               x1: c.value.left + c.value.width / 2,
@@ -1037,13 +1041,13 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
               stroke: e.value.style.chart.layout.separators.color,
               "stroke-width": e.value.style.chart.layout.separators.strokeWidth,
               "stroke-linecap": "round"
-            }, null, 8, cl)) : y("", !0)
+            }, null, 8, vl)) : y("", !0)
           ]))), 256)),
           r("g", {
             ref_key: "parentLabels",
-            ref: Ut
+            ref: Wt
           }, [
-            (n(!0), u(O, null, E($.value, (a, o) => (n(), u("g", dl, [
+            (n(!0), u(N, null, E($.value, (a, o) => (n(), u("g", hl, [
               a.isChild && a.childIndex === 0 && e.value.style.chart.layout.bars.parentLabels.show ? (n(), u("rect", {
                 key: 0,
                 class: "vue-ui-horizontal-bar-parent-marker",
@@ -1054,7 +1058,7 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
                 rx: 1,
                 fill: a.color,
                 style: { animation: "none !important", transition: "none !important" }
-              }, null, 8, vl)) : y("", !0),
+              }, null, 8, bl)) : y("", !0),
               a.isChild && a.childIndex === 0 && e.value.style.chart.layout.bars.parentLabels.show ? (n(), u("text", {
                 key: 1,
                 y: te(a, o).y,
@@ -1071,28 +1075,28 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
                   y: te(a, o).y,
                   translateY: !1
                 })
-              }, null, 8, hl)) : y("", !0),
+              }, null, 8, pl)) : y("", !0),
               a.isChild && a.childIndex === 0 && e.value.style.chart.layout.bars.parentLabels.show ? (n(), u("text", {
                 key: 2,
-                y: te(a, o).y + s(Pa)(ct(a, o)) * e.value.style.chart.layout.bars.parentLabels.fontSize * 1.1,
+                y: te(a, o).y + s(Ba)(ct(a, o)) * e.value.style.chart.layout.bars.parentLabels.fontSize * 1.1,
                 "font-size": e.value.style.chart.layout.bars.parentLabels.fontSize,
                 fill: e.value.style.chart.layout.bars.parentLabels.color,
                 x: e.value.style.chart.layout.bars.parentLabels.offsetX + e.value.style.chart.layout.bars.parentLabels.fontSize,
                 "font-weight": e.value.style.chart.layout.bars.dataLabels.bold ? "bold" : "normal",
                 "text-anchor": "start"
-              }, m(oa(a, o)), 9, pl)) : y("", !0)
+              }, m(ra(a, o)), 9, fl)) : y("", !0)
             ]))), 256))
           ], 512),
           r("g", {
             ref_key: "childLabels",
             ref: ke
           }, [
-            (n(!0), u(O, null, E(Qt.value, (a, o) => (n(), u("g", fl, [
+            (n(!0), u(N, null, E(ea.value, (a, o) => (n(), u("g", gl, [
               (a.isChild || !a.hasChildren) && e.value.style.chart.layout.bars.nameLabels.show ? (n(), u("text", {
                 key: 0,
                 "text-anchor": "start",
                 x: Math.abs(e.value.style.chart.layout.bars.nameLabels.offsetX),
-                y: s(S)(c.value.top + (k.value + v.value) * o + v.value / 2 + e.value.style.chart.layout.bars.nameLabels.fontSize / 2 + A.value[o] * L.value),
+                y: s(S)(c.value.top + (k.value + v.value) * o + v.value / 2 + e.value.style.chart.layout.bars.nameLabels.fontSize / 2 + L.value[o] * A.value),
                 "font-size": e.value.style.chart.layout.bars.nameLabels.fontSize,
                 fill: "transparent",
                 "font-weight": e.value.style.chart.layout.bars.nameLabels.bold ? "bold" : "normal",
@@ -1102,19 +1106,19 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
                   fontSize: e.value.style.chart.layout.bars.nameLabels.fontSize,
                   fill: "transparent",
                   x: Math.abs(e.value.style.chart.layout.bars.nameLabels.offsetX),
-                  y: s(S)(c.value.top + (k.value + v.value) * o + v.value / 2 + e.value.style.chart.layout.bars.nameLabels.fontSize / 2 + A.value[o] * L.value),
+                  y: s(S)(c.value.top + (k.value + v.value) * o + v.value / 2 + e.value.style.chart.layout.bars.nameLabels.fontSize / 2 + L.value[o] * A.value),
                   translateY: !0
                 })
-              }, null, 8, bl)) : y("", !0)
+              }, null, 8, yl)) : y("", !0)
             ]))), 256))
           ], 512),
           r("g", null, [
-            (n(!0), u(O, null, E($.value, (a, o) => (n(), u("g", gl, [
+            (n(!0), u(N, null, E($.value, (a, o) => (n(), u("g", ml, [
               (a.isChild || !a.hasChildren) && e.value.style.chart.layout.bars.nameLabels.show ? (n(), u("text", {
                 key: 0,
                 "text-anchor": "end",
                 x: c.value.left + e.value.style.chart.layout.bars.nameLabels.offsetX - 6,
-                y: c.value.top + (k.value + v.value) * o + v.value / 2 + e.value.style.chart.layout.bars.nameLabels.fontSize / 3 + A.value[o] * L.value,
+                y: c.value.top + (k.value + v.value) * o + v.value / 2 + e.value.style.chart.layout.bars.nameLabels.fontSize / 3 + L.value[o] * A.value,
                 "font-size": e.value.style.chart.layout.bars.nameLabels.fontSize,
                 fill: e.value.style.chart.layout.bars.nameLabels.color,
                 "font-weight": e.value.style.chart.layout.bars.nameLabels.bold ? "bold" : "normal",
@@ -1123,50 +1127,50 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
                   fontSize: e.value.style.chart.layout.bars.nameLabels.fontSize,
                   fill: e.value.style.chart.layout.bars.nameLabels.color,
                   x: c.value.left + e.value.style.chart.layout.bars.nameLabels.offsetX - 6,
-                  y: c.value.top + (k.value + v.value) * o + v.value / 2 + e.value.style.chart.layout.bars.nameLabels.fontSize / 3 + A.value[o] * L.value,
+                  y: c.value.top + (k.value + v.value) * o + v.value / 2 + e.value.style.chart.layout.bars.nameLabels.fontSize / 3 + L.value[o] * A.value,
                   translateY: !0
                 })
-              }, null, 8, yl)) : y("", !0)
+              }, null, 8, Cl)) : y("", !0)
             ]))), 256))
           ]),
           r("g", {
             ref_key: "dataLabels",
             ref: _e
           }, [
-            (n(!0), u(O, null, E($.value, (a, o) => (n(), u("g", ml, [
+            (n(!0), u(N, null, E($.value, (a, o) => (n(), u("g", kl, [
               r("text", {
                 x: q.value ? c.value.left + c.value.width / 2 + (a.sign === 1 ? -12 : 12) + (a.sign === 1 ? -e.value.style.chart.layout.bars.dataLabels.offsetX : e.value.style.chart.layout.bars.dataLabels.offsetX) : Math.min(
-                  aa(a.value) + 3 + e.value.style.chart.layout.bars.dataLabels.offsetX,
+                  oa(a.value) + 3 + e.value.style.chart.layout.bars.dataLabels.offsetX,
                   c.value.right - 2
                 ),
-                y: c.value.top + (k.value + v.value) * o + v.value / 2 + A.value[o] * L.value + e.value.style.chart.layout.bars.dataLabels.fontSize / 3,
+                y: c.value.top + (k.value + v.value) * o + v.value / 2 + L.value[o] * A.value + e.value.style.chart.layout.bars.dataLabels.fontSize / 3,
                 "text-anchor": !q.value || a.sign === -1 ? "start" : "end",
                 "font-size": e.value.style.chart.layout.bars.dataLabels.fontSize,
                 fill: e.value.style.chart.layout.bars.dataLabels.color,
                 "font-weight": e.value.style.chart.layout.bars.dataLabels.bold ? "bold" : "normal"
-              }, m(dt(a.value, a, o, a.sign)), 9, Cl)
+              }, m(dt(a.value, a, o, a.sign)), 9, _l)
             ]))), 256))
           ], 512),
-          (n(!0), u(O, null, E($.value, (a, o) => (n(), u("g", null, [
+          (n(!0), u(N, null, E($.value, (a, o) => (n(), u("g", null, [
             r("rect", {
               x: 0,
-              y: c.value.top + (k.value + v.value) * o - k.value / 2 + A.value[o] * L.value,
+              y: c.value.top + (k.value + v.value) * o - k.value / 2 + L.value[o] * A.value,
               width: M.value,
               height: v.value + k.value <= 0 ? 1e-4 : v.value + k.value,
               fill: Te.value === a.id ? s(Me)(
                 e.value.style.chart.layout.highlighter.color,
                 e.value.style.chart.layout.highlighter.opacity
               ) : "transparent",
-              onMouseenter: (f) => ua(a, o),
-              onMouseleave: (f) => ra({ datapoint: a, seriesIndex: o }),
-              onClick: (f) => na({ datapoint: a, seriesIndex: o })
-            }, null, 40, kl)
+              onMouseenter: (p) => ia(a, o),
+              onMouseleave: (p) => sa({ datapoint: a, seriesIndex: o }),
+              onClick: (p) => ua({ datapoint: a, seriesIndex: o })
+            }, null, 40, xl)
           ]))), 256)),
           g(t.$slots, "svg", { svg: R.value }, void 0, !0)
         ], 512)
-      ], 14, el)),
-      t.$slots.watermark ? (n(), u("div", _l, [
-        g(t.$slots, "watermark", B(N({ isPrinting: s(Qe) || s(Ze) })), void 0, !0)
+      ], 14, al)),
+      t.$slots.watermark ? (n(), u("div", wl, [
+        g(t.$slots, "watermark", B(O({ isPrinting: s(Qe) || s(Ze) })), void 0, !0)
       ])) : y("", !0),
       e.value.style.chart.legend.show && e.value.style.chart.legend.position === "bottom" ? (n(), u("div", {
         key: 6,
@@ -1178,28 +1182,28 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
           legendSet: z.value,
           config: rt.value,
           onClickMarker: l[1] || (l[1] = ({ legend: a }) => Y(a.id))
-        }, pe({
-          item: p(({ legend: a, index: o }) => [
+        }, be({
+          item: b(({ legend: a, index: o }) => [
             r("div", {
-              onClick: (f) => Y(a.id),
+              onClick: (p) => Y(a.id),
               style: h(`opacity:${w.value.includes(a.id) ? 0.5 : 1}`)
             }, m(a.name) + ": " + m(s(se)(
               e.value.style.chart.layout.bars.dataLabels.value.formatter,
               a.value,
-              s(G)({
+              s(U)({
                 p: e.value.style.chart.legend.prefix,
                 v: a.value,
                 s: e.value.style.chart.legend.suffix,
                 r: e.value.style.chart.legend.roundingValue
               }),
               { datapoint: a, seriesIndex: o }
-            )), 13, xl)
+            )), 13, $l)
           ]),
           _: 2
         }, [
           t.$slots.pattern ? {
             name: "legend-pattern",
-            fn: p(({ legend: a, index: o }) => [
+            fn: b(({ legend: a, index: o }) => [
               oe(_t, {
                 shape: a.shape,
                 radius: 30,
@@ -1216,14 +1220,14 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
       t.$slots.source ? (n(), u("div", {
         key: 7,
         ref_key: "source",
-        ref: Ge,
+        ref: Ue,
         dir: "auto"
       }, [
         g(t.$slots, "source", {}, void 0, !0)
       ], 512)) : y("", !0),
-      oe(s(Dt), {
+      oe(s(Ot), {
         teleportTo: e.value.style.chart.tooltip.teleportTo,
-        show: x.value.showTooltip && be.value && w.value.length < C.dataset.length,
+        show: x.value.showTooltip && fe.value && w.value.length < C.dataset.length,
         backgroundColor: e.value.style.chart.tooltip.backgroundColor,
         color: e.value.style.chart.tooltip.color,
         borderRadius: e.value.style.chart.tooltip.borderRadius,
@@ -1242,34 +1246,34 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
         smoothForce: e.value.style.chart.tooltip.smoothForce,
         smoothSnapThreshold: e.value.style.chart.tooltip.smoothSnapThreshold
       }, {
-        "tooltip-before": p(() => [
-          g(t.$slots, "tooltip-before", B(N({ ...Se.value })), void 0, !0)
+        "tooltip-before": b(() => [
+          g(t.$slots, "tooltip-before", B(O({ ...Se.value })), void 0, !0)
         ]),
-        "tooltip-after": p(() => [
-          g(t.$slots, "tooltip-after", B(N({ ...Se.value })), void 0, !0)
+        "tooltip-after": b(() => [
+          g(t.$slots, "tooltip-after", B(O({ ...Se.value })), void 0, !0)
         ]),
         _: 3
       }, 8, ["teleportTo", "show", "backgroundColor", "color", "borderRadius", "borderColor", "borderWidth", "fontSize", "backgroundOpacity", "position", "offsetY", "parent", "content", "isFullscreen", "isCustom", "smooth", "backdropFilter", "smoothForce", "smoothSnapThreshold"]),
-      fe.value && e.value.userOptions.buttons.table ? (n(), Q(wa(he.value.component), mt({ key: 8 }, he.value.props, {
+      pe.value && e.value.userOptions.buttons.table ? (n(), Q(Aa(he.value.component), mt({ key: 8 }, he.value.props, {
         ref_key: "tableUnit",
         ref: ne,
-        onClose: Pe
-      }), pe({
-        content: p(() => [
+        onClose: De
+      }), be({
+        content: b(() => [
           r("div", {
             ref_key: "tableContainer",
             ref: lt,
             class: "vue-ui-vertical-bar-table atom-data-table",
             style: h(`${e.value.table.useDialog ? "" : "max-height: 300px; margin-top: 24px"}`)
           }, [
-            r("div", wl, [
+            r("div", Al, [
               e.value.table.useDialog ? y("", !0) : (n(), u("div", {
                 key: 0,
                 role: "button",
                 tabindex: "0",
                 style: h(`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: Pe,
-                onKeypress: $a(Pe, ["enter"])
+                onClick: De,
+                onKeypress: La(De, ["enter"])
               }, [
                 oe(s(He), {
                   name: "close",
@@ -1279,9 +1283,9 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
               ], 36)),
               r("div", {
                 style: { width: "100%", "container-type": "inline-size" },
-                class: J({ "vue-ui-responsive": s(ca) })
+                class: J({ "vue-ui-responsive": s(va) })
               }, [
-                r("table", $l, [
+                r("table", Ll, [
                   e.value.table.useDialog ? y("", !0) : (n(), u("caption", {
                     key: 0,
                     style: h({
@@ -1292,17 +1296,17 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
                     class: "vue-ui-data-table__caption"
                   }, [
                     Ct(m(e.value.style.chart.title.text) + " ", 1),
-                    e.value.style.chart.title.subtitle.text ? (n(), u("span", Ll, m(e.value.style.chart.title.subtitle.text), 1)) : y("", !0)
+                    e.value.style.chart.title.subtitle.text ? (n(), u("span", Tl, m(e.value.style.chart.title.subtitle.text), 1)) : y("", !0)
                   ], 4)),
                   r("thead", null, [
                     r("tr", {
                       role: "row",
                       style: h(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color}`)
                     }, [
-                      (n(!0), u(O, null, E(D.value.head, (a) => (n(), u("th", {
+                      (n(!0), u(N, null, E(P.value.head, (a) => (n(), u("th", {
                         style: h(`outline:${e.value.table.th.outline}`)
                       }, [
-                        r("div", Al, m(a), 1)
+                        r("div", Sl, m(a), 1)
                       ], 4))), 256))
                     ], 4),
                     r("tr", null, [
@@ -1330,7 +1334,7 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
                     ])
                   ]),
                   r("tbody", null, [
-                    (n(!0), u(O, null, E(D.value.body, (a, o) => (n(), u("tr", {
+                    (n(!0), u(N, null, E(P.value.body, (a, o) => (n(), u("tr", {
                       class: J({
                         "vue-ui-data-table__tbody__row": !0,
                         "vue-ui-data-table__tbody__row-even": o % 2 === 0,
@@ -1341,72 +1345,72 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
                       r("td", {
                         class: "vue-ui-data-table__tbody__td",
                         style: h(`outline:${e.value.table.td.outline};font-variant-numeric: tabular-nums;`),
-                        "data-cell": D.value.head[0] ?? ""
+                        "data-cell": P.value.head[0] ?? ""
                       }, [
-                        r("div", Sl, [
+                        r("div", zl, [
                           a.color ? (n(), u("span", {
                             key: 0,
                             style: h(`color:${a.color};margin-right:3px`)
                           }, "⬤", 4)) : y("", !0),
                           r("span", null, m(a.parentName), 1)
                         ])
-                      ], 12, Tl),
+                      ], 12, Fl),
                       r("td", {
                         class: "vue-ui-data-table__tbody__td",
                         style: h(`outline:${e.value.table.td.outline}`),
-                        "data-cell": D.value.head[1] ?? ""
+                        "data-cell": P.value.head[1] ?? ""
                       }, [
-                        r("div", zl, m(e.value.table.td.prefix) + m(["", NaN, void 0].includes(a.parentValue) ? "" : a.parentValue.toFixed(
+                        r("div", Pl, m(e.value.table.td.prefix) + m(["", NaN, void 0].includes(a.parentValue) ? "" : a.parentValue.toFixed(
                           e.value.table.td.roundingValue
                         )) + m(e.value.table.td.suffix), 1)
-                      ], 12, Fl),
+                      ], 12, Dl),
                       r("td", {
                         class: "vue-ui-data-table__tbody__td",
                         style: h(`outline:${e.value.table.td.outline}`),
-                        "data-cell": D.value.head[2] ?? ""
+                        "data-cell": P.value.head[2] ?? ""
                       }, [
-                        r("div", Dl, m(["", NaN, void 0].includes(a.percentageToTotal) ? "" : `${(a.percentageToTotal * 100).toFixed(
+                        r("div", Ol, m(["", NaN, void 0].includes(a.percentageToTotal) ? "" : `${(a.percentageToTotal * 100).toFixed(
                           e.value.table.td.roundingPercentage
                         )}%`), 1)
-                      ], 12, Pl),
+                      ], 12, Bl),
                       r("td", {
                         class: "vue-ui-data-table__tbody__td",
                         style: h(`outline:${e.value.table.td.outline}`),
-                        "data-cell": D.value.head[3] ?? ""
+                        "data-cell": P.value.head[3] ?? ""
                       }, [
-                        r("div", Nl, m(a.childName), 1)
-                      ], 12, Bl),
+                        r("div", El, m(a.childName), 1)
+                      ], 12, Nl),
                       r("td", {
                         class: "vue-ui-data-table__tbody__td",
                         style: h(`outline:${e.value.table.td.outline}`),
-                        "data-cell": D.value.head[4] ?? ""
+                        "data-cell": P.value.head[4] ?? ""
                       }, [
-                        r("div", El, m(e.value.table.td.prefix) + m(["", NaN, void 0].includes(a.childValue) ? "" : a.childValue.toFixed(
+                        r("div", Ml, m(e.value.table.td.prefix) + m(["", NaN, void 0].includes(a.childValue) ? "" : a.childValue.toFixed(
                           e.value.table.td.roundingValue
                         )) + m(e.value.table.td.suffix), 1)
-                      ], 12, Ol),
+                      ], 12, Il),
                       r("td", {
                         class: "vue-ui-data-table__tbody__td",
                         style: h(`outline:${e.value.table.td.outline}`),
-                        "data-cell": D.value.head[5] ?? ""
+                        "data-cell": P.value.head[5] ?? ""
                       }, [
-                        r("div", Ml, m(["", NaN, void 0].includes(
+                        r("div", Rl, m(["", NaN, void 0].includes(
                           a.childPercentageToParent
                         ) ? "" : `${(a.childPercentageToParent * 100).toFixed(
                           e.value.table.td.roundingPercentage
                         )}%`), 1)
-                      ], 12, Il),
+                      ], 12, Vl),
                       r("td", {
                         class: "vue-ui-data-table__tbody__td",
                         style: h(`outline:${e.value.table.td.outline}`),
-                        "data-cell": D.value.head[6] ?? ""
+                        "data-cell": P.value.head[6] ?? ""
                       }, [
-                        r("div", Rl, m(["", NaN, void 0].includes(
+                        r("div", Xl, m(["", NaN, void 0].includes(
                           a.childPercentageToTotal
                         ) ? "" : `${(a.childPercentageToTotal * 100).toFixed(
                           e.value.table.td.roundingPercentage
                         )}%`), 1)
-                      ], 12, Vl)
+                      ], 12, Hl)
                     ], 6))), 256))
                   ])
                 ])
@@ -1418,14 +1422,14 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
       }, [
         e.value.table.useDialog ? {
           name: "title",
-          fn: p(() => [
+          fn: b(() => [
             Ct(m(he.value.title), 1)
           ]),
           key: "0"
         } : void 0,
         e.value.table.useDialog ? {
           name: "actions",
-          fn: p(() => [
+          fn: b(() => [
             r("button", {
               tabindex: "0",
               class: "vue-ui-user-options-button",
@@ -1440,15 +1444,15 @@ const xt = { style: { chart: { backgroundColor: "#1A1A1A", color: "#CCCCCC", lay
           key: "1"
         } : void 0
       ]), 1040)) : y("", !0),
-      s(Ye) ? (n(), Q(Ra, { key: 9 })) : y("", !0)
-    ], 46, Qa));
+      s(Ye) ? (n(), Q(Xa, { key: 9 })) : y("", !0)
+    ], 46, el));
   }
-}, Xl = /* @__PURE__ */ Ja(Hl, [["__scopeId", "data-v-2923799c"]]), so = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+}, Ul = /* @__PURE__ */ Za(Gl, [["__scopeId", "data-v-2923799c"]]), co = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
-  default: Xl
+  default: Ul
 }, Symbol.toStringTag, { value: "Module" }));
 export {
-  uo as a,
-  so as b,
-  Xl as v
+  io as a,
+  co as b,
+  Ul as v
 };