vue-data-ui 3.17.13 → 3.18.0

package/dist/vue-ui-horizontal-bar-BonPYUZf.js

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