vue-data-ui 3.0.0-next.4 → 3.0.0-next.6

package/dist/vue-ui-vertical-bar-B5b5tXjT.js

@@ -1,1029 +0,0 @@
-import { useCssVars as Pt, defineAsyncComponent as j, useSlots as Vt, computed as k, ref as i, watch as Ke, shallowRef as Je, onMounted as Qe, nextTick as ie, onBeforeUnmount as zt, createElementBlock as d, openBlock as u, unref as r, normalizeStyle as h, normalizeClass as E, createBlock as R, createCommentVNode as g, renderSlot as x, createVNode as ee, createSlots as me, withCtx as w, normalizeProps as q, guardReactiveProps as Y, createElementVNode as n, toDisplayString as p, Fragment as K, renderList as J, mergeProps as At, withKeys as It, createTextVNode as Ot } from "vue";
-import { u as Mt, c as Bt, t as Ft, p as D, a as Et, C as ke, b as Rt, v as L, o as Ze, e as te, d as xe, i as de, f as U, X as Dt, s as _e, w as Ut, q as Xt, r as Gt, x as Ht, y as Wt } from "./index-BnnNoGGd.js";
-import { t as jt, u as qt } from "./useResponsive-DfdjqQps.js";
-import { u as et } from "./useNestedProp-B6Dz15k2.js";
-import { u as Yt } from "./usePrinter-Dd-RkmL8.js";
-import { u as Kt } from "./useUserOptionState-BIvW1Kz7.js";
-import { u as Jt } from "./useChartAccessibility-9icAAmYg.js";
-import Qt from "./vue-ui-accordion-qNR0BQCP.js";
-import tt from "./Legend-Bow74t3d.js";
-import Zt from "./Title-FiH2Kirc.js";
-import { _ as at } from "./Shape-BsptIVCm.js";
-import ea from "./img-CP2uNkKq.js";
-import { _ as ta } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const aa = ["id"], la = ["onClick"], oa = ["xmlns", "viewBox"], na = ["width", "height"], ua = ["id"], sa = ["stop-color"], ra = ["stop-color"], ia = { key: 1 }, da = ["x", "y", "width", "height", "fill", "rx"], va = ["x", "y", "width", "height", "fill", "rx", "stroke", "stroke-width"], ca = ["x", "y", "width", "height", "fill", "rx", "stroke", "stroke-width"], ha = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], pa = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], ya = { class: "vue-ui-horizontal-bar-child-label" }, fa = ["x", "y", "text-anchor", "font-size", "fill", "font-weight"], ga = ["x", "y", "font-size", "fill", "font-weight"], ba = { class: "vue-ui-horizontal-bar-parent-label" }, ma = ["x", "y", "font-size", "fill", "font-weight"], ka = ["x", "y", "font-size", "fill", "font-weight"], xa = ["x", "y", "width", "height", "fill", "onMouseenter", "onMouseleave", "onClick"], _a = {
-  key: 6,
-  class: "vue-data-ui-watermark"
-}, wa = ["onClick"], $a = { style: "width:100%;padding-top: 36px;position:relative" }, Ca = { class: "vue-ui-data-table" }, Ta = { key: 0 }, Sa = { style: { width: "100%" } }, La = ["data-cell"], Na = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Pa = ["data-cell"], Va = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, za = ["data-cell"], Aa = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Ia = ["data-cell"], Oa = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Ma = ["data-cell"], Ba = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Fa = ["data-cell"], Ea = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Ra = ["data-cell"], Da = { style: { display: "flex", "align-items": "center", gap: "5px", "justify-content": "flex-end", width: "100%", "padding-right": "3px" } }, Ua = {
-  __name: "vue-ui-vertical-bar",
-  props: {
-    config: {
-      type: Object,
-      default() {
-        return {};
-      }
-    },
-    dataset: {
-      type: Array,
-      default() {
-        return [];
-      }
-    }
-  },
-  emits: ["selectLegend"],
-  setup(lt, { expose: ot, emit: nt }) {
-    Pt((a) => ({
-      "1bf7edfb": a.tdo
-    }));
-    const ut = j(() => import("./BaseIcon-C_m_NEgt.js")), st = j(() => import("./PackageVersion-3ZfzB951.js")), rt = j(() => import("./PenAndPaper-BZddJqUG.js")), it = j(() => import("./vue-ui-skeleton-gHkpLBcj.js")), dt = j(() => import("./Tooltip-BLtR7DBZ.js")), vt = j(() => import("./UserOptions-DOwmMJId.js")), { vue_ui_vertical_bar: ct } = Mt(), ht = Vt(), b = lt, ae = k(() => !!b.dataset && b.dataset.length), S = i(Bt()), pt = i(null), ve = i(!1), ce = i(""), le = i(0), yt = i(null), we = i(0), z = i(null), $e = i(null), he = i(null), Ce = i(null), Te = i(null), Se = i(0), pe = i(0), oe = i(null), ft = nt, e = k({
-      get: () => Ve(),
-      set: (a) => a
-    }), { userOptionsVisible: ye, setUserOptionsVisibility: Le, keepUserOptionState: Ne } = Kt({ config: e.value }), { svgRef: Pe } = Jt({ config: e.value.style.chart.title });
-    function Ve() {
-      const a = et({
-        userConfig: b.config,
-        defaultConfig: ct
-      });
-      let l = {};
-      return a.theme ? l = {
-        ...et({
-          userConfig: Et.vue_ui_vertical_bar[a.theme] || b.config,
-          defaultConfig: a
-        }),
-        customPalette: Ft[a.theme] || D
-      } : l = a, b.config && ke(b.config, "events.datapointEnter") ? l.events.datapointEnter = b.config.events.datapointEnter : l.events.datapointEnter = null, b.config && ke(b.config, "events.datapointLeave") ? l.events.datapointLeave = b.config.events.datapointLeave : l.events.datapointLeave = null, b.config && ke(b.config, "events.datapointClick") ? l.events.datapointClick = b.config.events.datapointClick : l.events.datapointClick = null, l;
-    }
-    Ke(() => b.config, (a) => {
-      e.value = Ve(), ye.value = !e.value.userOptions.showOnChartHover, Ee(), Se.value += 1, pe.value += 1, c.value = e.value.style.chart.layout.bars.height, m.value = e.value.style.chart.layout.bars.gap, $.value.showTable = e.value.table.show, $.value.sortDesc = e.value.style.chart.layout.bars.sort === "desc", $.value.showTooltip = e.value.style.chart.tooltip.show;
-    }, { deep: !0 }), Ke(() => b.dataset, ue, { deep: !0 });
-    const { isPrinting: ze, isImaging: Ae, generatePdf: Ie, generateImage: Oe } = Yt({
-      elementId: `vue-ui-vertical-bar_${S.value}`,
-      fileName: e.value.style.chart.title.text || "vue-ui-vertical-bar",
-      options: e.value.userOptions.print
-    }), gt = k(() => e.value.userOptions.show && !e.value.style.chart.title.text), Me = k(() => Rt(e.value.customPalette)), Be = i(null), Fe = i(!1), bt = k(() => e.value.table.responsiveBreakpoint), A = Je(null), X = Je(null), ne = i("0 0 10 10"), G = k(() => {
-      const [a, l, t, o] = ne.value.split(" ").map(Number);
-      return { x: a, y: l, width: t, height: o };
-    });
-    Qe(async () => {
-      await ie(), Ee(), H();
-    });
-    async function H() {
-      if (ne.value = `0 0 ${C.value.width} ${s.value.fullHeight}`, !e.value.autoSize) return;
-      const a = oe.value.querySelectorAll(".vue-ui-horizontal-bar-parent-label"), l = oe.value.querySelectorAll(".vue-ui-horizontal-bar-child-label");
-      if (a.length) {
-        const o = Math.max(...Array.from(a).flatMap((f) => {
-          const v = f.querySelectorAll("text");
-          return v.length ? Array.from(v).map((_) => _.getBBox().width) : 0;
-        })), y = Math.max(...Array.from(l).flatMap((f) => {
-          const v = f.querySelectorAll("text");
-          return v.length ? Array.from(v).map((_) => _.getBBox().width) : 0;
-        }));
-        Array.from(a).forEach((f) => {
-          const v = f.querySelectorAll("text");
-          Array.from(v).forEach(async (_) => {
-            _.setAttribute("x", 0), _.setAttribute("x", L(-o - y / 4));
-          });
-        });
-      }
-      await ie();
-      const t = oe.value.getBBox();
-      ne.value = [
-        t.x,
-        0,
-        t.width + 12,
-        s.value.fullHeight
-      ].join(" ");
-    }
-    function Ee() {
-      if (Ze(b.dataset) && te({
-        componentName: "VueUiVerticalBar",
-        type: "dataset"
-      }), le.value = b.dataset.flatMap((a) => a.children && a.children.length > 0 ? a.children.length : 1).reduce((a, l) => a + l, 0), mt(), e.value.responsive) {
-        const a = jt(() => {
-          const { width: l, height: t } = qt({
-            chart: z.value,
-            title: e.value.style.chart.title.text ? $e.value : null,
-            legend: e.value.style.chart.legend.show ? he.value : null,
-            source: Ce.value,
-            noTitle: Te.value
-          });
-          requestAnimationFrame(async () => {
-            Ue.value = l, c.value = t / le.value - m.value * 2, await ie(), H();
-          });
-        });
-        A.value && (X.value && A.value.unobserve(X.value), A.value.disconnect()), A.value = new ResizeObserver(a), X.value = z.value.parentNode, A.value.observe(X.value), e.value.autoSize && H();
-      }
-    }
-    zt(() => {
-      A.value && (X.value && A.value.unobserve(X.value), A.value.disconnect());
-    });
-    function mt() {
-      new ResizeObserver((l) => {
-        l.forEach((t) => {
-          Fe.value = t.contentRect.width < bt.value;
-        });
-      }).observe(Be.value);
-    }
-    const $ = i({
-      showTable: e.value.table.show,
-      sortDesc: e.value.style.chart.layout.bars.sort === "desc",
-      showTooltip: e.value.style.chart.tooltip.show
-    }), Re = k(() => $.value.sortDesc), I = k(() => (b.dataset.forEach((a, l) => {
-      !a.value && !a.children && te({
-        componentName: "VueUiVerticalBar",
-        type: "datasetAttributeEmpty",
-        property: `value (index ${l})`
-      }), a.children && (Ze(a.children) ? te({
-        componentName: "VueUiVerticalBar",
-        type: "datasetAttributeEmpty",
-        property: `children (index ${l})`
-      }) : a.children.forEach((t, o) => {
-        [null, void 0].includes(t.name) && te({
-          componentName: "VueUiVerticalBar",
-          type: "datasetSerieAttribute",
-          property: "name",
-          key: "children",
-          index: o
-        });
-      }));
-    }), b.dataset.map((a, l) => {
-      const t = `vertical_parent_${l}_${S.value}`, o = a.children && a.children.length > 0, y = L(a.value ? a.value : o ? a.children.map((v) => v.value || 0).reduce((v, _) => v + _, 0) : 0), f = y >= 0 ? 1 : -1;
-      return {
-        ...a,
-        id: t,
-        absoluteIndex: l,
-        shape: "square",
-        opacity: N.value.includes(t) ? 0.5 : 1,
-        value: Math.abs(y),
-        sign: f,
-        hasChildren: o,
-        isChild: !1,
-        segregate: () => Q(t),
-        isSegregated: N.value.includes(t),
-        color: xe(a.color) || Me.value[l] || D[l] || D[l % D.length],
-        children: !a.children || !a.children.length ? [] : a.children.toSorted(se.value ? () => 0 : (v, _) => Re.value ? _.value - v.value : v.value - _.value).map((v, _) => ({
-          ...v,
-          value: L(Math.abs(v.value)),
-          absoluteIndex: l,
-          sign: v.value >= 0 ? 1 : -1,
-          isChild: !0,
-          parentId: t,
-          parentName: a.name,
-          parentValue: y,
-          parentSign: f,
-          id: `vertical_child_${l}_${_}_${S.value}`,
-          childIndex: _,
-          color: xe(v.color) || xe(a.color) || Me.value[l] || D[l] || D[l % D.length]
-        })).map((v, _) => ({
-          ...v,
-          isFirstChild: _ === 0,
-          isLastChild: _ === a.children.length - 1
-        }))
-      };
-    }).toSorted(se.value ? () => 0 : (a, l) => Re.value ? l.value - a.value : a.value - l.value))), De = k(() => ({
-      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" : ""
-    })), c = i(e.value.style.chart.layout.bars.height), m = i(e.value.style.chart.layout.bars.gap), kt = k(() => (c.value + m.value) * le.value), Ue = i(512), C = k(() => ({
-      width: Ue.value,
-      height: kt.value,
-      padding: {
-        top: 12,
-        left: (e.value.autoSize ? 0 : 128) + e.value.style.chart.layout.bars.offsetX,
-        right: (e.value.autoSize ? 0 : 64) + e.value.style.chart.layout.bars.paddingRight,
-        bottom: 12
-      }
-    })), s = k(() => ({
-      fullHeight: C.value.padding.top + C.value.padding.bottom + C.value.height,
-      top: C.value.padding.top,
-      left: C.value.padding.left,
-      right: C.value.width - C.value.padding.right,
-      bottom: C.value.padding.top + C.value.height,
-      width: C.value.width - (C.value.padding.left + C.value.padding.right)
-    }));
-    async function ue() {
-      le.value = M.value.flatMap((a) => a.children && a.children.length > 0 ? a.children.length : 1).reduce((a, l) => a + l, 0), e.value.autoSize && await H();
-    }
-    const N = i([]);
-    async function Q(a) {
-      if (N.value.includes(a))
-        N.value = N.value.filter((l) => l !== a);
-      else {
-        if (N.value.length === I.value.length - 1) return;
-        N.value.push(a);
-      }
-      ue(), await ie(), e.value.autoSize && H(), ft("selectLegend", M.value);
-    }
-    const M = k(() => I.value.filter((a) => !N.value.includes(a.id))), V = k(() => M.value.map((a) => Math.abs(a.value)).reduce((a, l) => a + l, 0));
-    function Xe(a, l = !1, t = 0) {
-      return l ? U({
-        v: L(Math.abs(a) / V.value * 100),
-        s: "%",
-        r: t
-      }) : Math.abs(a) / V.value;
-    }
-    const B = k(() => M.value.flatMap((a) => a.hasChildren ? a.children : a)), F = k(() => B.value.map((a) => a.sign).includes(-1)), xt = k(() => Math.max(...M.value.flatMap((a) => a.children && a.children.length ? Math.max(...a.children.map((l) => l.value)) : a.value)));
-    function T(a) {
-      const l = a / xt.value;
-      return s.value.width / (F.value ? 2 : 1) * l;
-    }
-    function _t(a) {
-      return T(a) + s.value.left;
-    }
-    function Z(a, l) {
-      const t = M.value.find((f) => f.id === a.parentId), o = s.value.top + (m.value + c.value) * l, y = t.children.length * (m.value + c.value);
-      return {
-        y: o + y / 2 - e.value.style.chart.layout.bars.parentLabels.fontSize,
-        name: t.name,
-        value: [void 0, NaN, null].includes(t.value) ? "" : t.sign === 1 ? t.value : -t.value,
-        percentageToTotal: isNaN(t.value / V.value) ? "" : Xe(t.value, !0, e.value.style.chart.layout.bars.dataLabels.percentage.roundingPercentage),
-        sign: t.sign
-      };
-    }
-    function wt() {
-      return M.value;
-    }
-    const fe = i(null), ge = i(null);
-    function $t({ datapoint: a, seriesIndex: l }) {
-      e.value.events.datapointClick && e.value.events.datapointClick({ datapoint: a, seriesIndex: l });
-    }
-    function Ct({ datapoint: a, seriesIndex: l }) {
-      e.value.events.datapointLeave && e.value.events.datapointLeave({ datapoint: a, seriesIndex: l }), yt.value = null, ve.value = !1, fe.value = null;
-    }
-    function Tt(a, l) {
-      e.value.events.datapointEnter && e.value.events.datapointEnter({ datpoint: a, seriesIndex: l }), ge.value = {
-        datapoint: a,
-        seriesIndex: l,
-        series: I.value,
-        config: e.value
-      }, ve.value = !0, fe.value = a.id;
-      let t = "";
-      const o = a.isChild ? a.parentName : a.name, y = a.isChild ? a.name : "", f = e.value.style.chart.tooltip.customFormat;
-      Ht(f) && Wt(() => f({
-        datapoint: a,
-        series: I.value,
-        config: e.value,
-        seriesIndex: l
-      })) ? ce.value = f({
-        datapoint: a,
-        series: I.value,
-        config: e.value,
-        seriesIndex: l
-      }) : (t += `<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="${a.color}"/>${ht.pattern ? `<rect x="0" y="0" height="60" width="60" rx="5" stroke="none" fill="url(#pattern_${S.value}_${a.absoluteIndex})"/>` : ""}</svg> ${o}</div>
-                ${y ? `<div>${y}</div>` : ""}
-            </div>`, e.value.style.chart.tooltip.showValue && (t += `<div>${e.value.translations.value}: <b>${de(
-        e.value.style.chart.layout.bars.dataLabels.value.formatter,
-        a.sign === 1 ? a.value : -a.value,
-        U({
-          p: e.value.style.chart.tooltip.prefix,
-          v: a.sign === 1 ? a.value : -a.value,
-          s: e.value.style.chart.tooltip.suffix,
-          r: e.value.style.chart.tooltip.roundingValue
-        }),
-        { datapoint: a, seriesIndex: l }
-      )}</b></div>`), e.value.style.chart.tooltip.showPercentage && (t += `<div>${e.value.translations.percentageToTotal} : <b>${U({
-        v: Math.abs(a.value) / V.value * 100,
-        s: "%",
-        r: e.value.style.chart.tooltip.roundingPercentage
-      })}</b></div>`, a.isChild && (t += `<div>${e.value.translations.percentageToSerie}: <b>${U({
-        v: Math.abs(a.value) / Math.abs(a.parentValue) * 100,
-        s: "%",
-        r: e.value.style.chart.tooltip.roundingPercentage
-      })}</b></div>`)), ce.value = `<div style="text-align:left">${t}</div>`);
-    }
-    function Ge(a, l, t, o) {
-      if (!e.value.style.chart.layout.bars.dataLabels.value.show)
-        return "";
-      const y = de(
-        e.value.style.chart.layout.bars.dataLabels.value.formatter,
-        L(o === -1 && a >= 0 ? -a : a),
-        U({
-          p: e.value.style.chart.layout.bars.dataLabels.value.prefix,
-          v: L(o === -1 && a >= 0 ? -a : a),
-          s: e.value.style.chart.layout.bars.dataLabels.value.suffix,
-          r: e.value.style.chart.layout.bars.dataLabels.value.roundingValue
-        }),
-        { datapoint: l, seriesIndex: t }
-      ), f = `(${Xe(a, !0, e.value.style.chart.layout.bars.dataLabels.percentage.roundingPercentage)})`;
-      return `${y}${e.value.style.chart.layout.bars.dataLabels.percentage.show ? ` ${f}` : ""}`;
-    }
-    const P = k(() => {
-      const a = [
-        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 = B.value.map((t) => t.isChild ? t.isFirstChild ? {
-        color: t.color,
-        parentName: t.parentName,
-        parentValue: t.parentValue,
-        percentageToTotal: t.parentValue / V.value,
-        childName: t.name,
-        childValue: t.sign === 1 ? t.value : -t.value,
-        childPercentageToParent: Math.abs(t.value) / Math.abs(t.parentValue),
-        childPercentageToTotal: Math.abs(t.value) / V.value
-      } : {
-        color: "",
-        parentName: "",
-        parentValue: "",
-        percentageToTotal: "",
-        childName: t.name,
-        childValue: t.sign === 1 ? t.value : -t.value,
-        childPercentageToParent: Math.abs(t.value) / Math.abs(t.parentValue),
-        childPercentageToTotal: Math.abs(t.value) / V.value
-      } : {
-        color: t.color,
-        parentName: t.name,
-        parentValue: t.sign === 1 ? t.value : -t.value,
-        percentageToTotal: Math.abs(t.value) / V.value,
-        childName: "",
-        childValue: "",
-        childPercentageToParent: "",
-        childPercentageToTotal: ""
-      });
-      return { head: a, body: l };
-    });
-    function He(a = null) {
-      const l = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [""]], t = P.value.head, o = P.value.body.map((v) => [
-        v.parentName,
-        v.parentValue,
-        v.percentageToTotal,
-        v.childName,
-        v.childValue,
-        v.childPercentageToParent,
-        v.childPercentageToTotal
-      ]), y = l.concat([t]).concat(o), f = Xt(y);
-      a ? a(f) : Gt({ csvContent: f, title: e.value.style.chart.title.text || "vue-ui-vertical-bar" });
-    }
-    const W = i(!1);
-    function We(a) {
-      W.value = a, we.value += 1;
-    }
-    function je() {
-      $.value.showTable = !$.value.showTable;
-    }
-    const St = i({
-      none: 0,
-      asc: 1,
-      desc: 2
-    }), O = i(0), se = i(!1);
-    Qe(() => {
-      ["none", "asc", "desc"].includes(e.value.style.chart.layout.bars.sort) || te({
-        componentName: "VueUiVerticalBar",
-        type: "attributeWrongValue",
-        property: "style.chart.layout.bars.sort",
-        key: e.value.style.chart.layout.bars.sort
-      }), O.value = St.value[e.value.style.chart.layout.bars.sort], $.value.sortDesc = O.value === 2, se.value = O.value === 0;
-    });
-    function Lt() {
-      O.value += 1, O.value > 2 && (O.value = 0);
-    }
-    function qe() {
-      Lt(), $.value.sortDesc = O.value === 2, se.value = O.value === 0, ue();
-    }
-    function Ye() {
-      $.value.showTooltip = !$.value.showTooltip;
-    }
-    const re = i(!1);
-    function be() {
-      re.value = !re.value;
-    }
-    async function Nt({ scale: a = 2 } = {}) {
-      if (!z.value) return;
-      const { width: l, height: t } = z.value.getBoundingClientRect(), o = l / t, { imageUri: y, base64: f } = await ea({ domElement: z.value, base64: !0, img: !0, scale: a });
-      return {
-        imageUri: y,
-        base64: f,
-        title: e.value.style.chart.title.text,
-        width: l,
-        height: t,
-        aspectRatio: o
-      };
-    }
-    return ot({
-      autoSize: H,
-      // v3
-      getData: wt,
-      getImage: Nt,
-      recalculateHeight: ue,
-      generatePdf: Ie,
-      generateCsv: He,
-      generateImage: Oe,
-      toggleTable: je,
-      toggleSort: qe,
-      toggleTooltip: Ye,
-      toggleAnnotator: be,
-      toggleFullscreen: We
-    }), (a, l) => (u(), d("div", {
-      class: E(`vue-ui-vertical-bar ${W.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${e.value.useCssAnimation ? "" : "vue-ui-dna"}`),
-      ref_key: "verticalBarChart",
-      ref: z,
-      id: `vue-ui-vertical-bar_${S.value}`,
-      style: h(`font-family:${e.value.style.fontFamily};width:100%; text-align:center;background:${e.value.style.chart.backgroundColor};${e.value.responsive ? "height: 100%" : ""}`),
-      onMouseenter: l[4] || (l[4] = () => r(Le)(!0)),
-      onMouseleave: l[5] || (l[5] = () => r(Le)(!1))
-    }, [
-      e.value.userOptions.buttons.annotator ? (u(), R(r(rt), {
-        key: 0,
-        svgRef: r(Pe),
-        backgroundColor: e.value.style.chart.backgroundColor,
-        color: e.value.style.chart.color,
-        active: re.value,
-        onClose: be
-      }, null, 8, ["svgRef", "backgroundColor", "color", "active"])) : g("", !0),
-      gt.value ? (u(), d("div", {
-        key: 1,
-        ref_key: "noTitle",
-        ref: Te,
-        class: "vue-data-ui-no-title-space",
-        style: "height:36px; width: 100%;background:transparent"
-      }, null, 512)) : g("", !0),
-      e.value.style.chart.title.text ? (u(), d("div", {
-        key: 2,
-        ref_key: "chartTitle",
-        ref: $e,
-        style: "width:100%;background:transparent;padding-bottom:12px"
-      }, [
-        (u(), R(Zt, {
-          key: `title_${Se.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)) : g("", !0),
-      e.value.userOptions.show && ae.value && (r(Ne) || r(ye)) ? (u(), R(r(vt), {
-        ref_key: "details",
-        ref: pt,
-        key: `user_options_${we.value}`,
-        backgroundColor: e.value.style.chart.backgroundColor,
-        color: e.value.style.chart.color,
-        isImaging: r(Ae),
-        isPrinting: r(ze),
-        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,
-        hasXls: e.value.userOptions.buttons.csv,
-        hasTable: e.value.userOptions.buttons.table,
-        hasSort: e.value.userOptions.buttons.sort,
-        hasFullscreen: e.value.userOptions.buttons.fullscreen,
-        isFullscreen: W.value,
-        isTooltip: $.value.showTooltip,
-        titles: { ...e.value.userOptions.buttonTitles },
-        chartElement: z.value,
-        position: e.value.userOptions.position,
-        hasAnnotator: e.value.userOptions.buttons.annotator,
-        isAnnotation: re.value,
-        callbacks: e.value.userOptions.callbacks,
-        printScale: e.value.userOptions.print.scale,
-        onToggleFullscreen: We,
-        onGeneratePdf: r(Ie),
-        onGenerateCsv: He,
-        onGenerateImage: r(Oe),
-        onToggleTable: je,
-        onToggleSort: qe,
-        onToggleTooltip: Ye,
-        onToggleAnnotator: be,
-        style: h({
-          visibility: r(Ne) ? r(ye) ? "visible" : "hidden" : "visible"
-        })
-      }, me({ _: 2 }, [
-        a.$slots.menuIcon ? {
-          name: "menuIcon",
-          fn: w(({ isOpen: t, color: o }) => [
-            x(a.$slots, "menuIcon", q(Y({ isOpen: t, color: o })), void 0, !0)
-          ]),
-          key: "0"
-        } : void 0,
-        a.$slots.optionTooltip ? {
-          name: "optionTooltip",
-          fn: w(() => [
-            x(a.$slots, "optionTooltip", {}, void 0, !0)
-          ]),
-          key: "1"
-        } : void 0,
-        a.$slots.optionPdf ? {
-          name: "optionPdf",
-          fn: w(() => [
-            x(a.$slots, "optionPdf", {}, void 0, !0)
-          ]),
-          key: "2"
-        } : void 0,
-        a.$slots.optionCsv ? {
-          name: "optionCsv",
-          fn: w(() => [
-            x(a.$slots, "optionCsv", {}, void 0, !0)
-          ]),
-          key: "3"
-        } : void 0,
-        a.$slots.optionImg ? {
-          name: "optionImg",
-          fn: w(() => [
-            x(a.$slots, "optionImg", {}, void 0, !0)
-          ]),
-          key: "4"
-        } : void 0,
-        a.$slots.optionTable ? {
-          name: "optionTable",
-          fn: w(() => [
-            x(a.$slots, "optionTable", {}, void 0, !0)
-          ]),
-          key: "5"
-        } : void 0,
-        a.$slots.optionLabels ? {
-          name: "optionLabels",
-          fn: w(() => [
-            x(a.$slots, "optionLabels", {}, void 0, !0)
-          ]),
-          key: "6"
-        } : void 0,
-        a.$slots.optionSort ? {
-          name: "optionSort",
-          fn: w(() => [
-            x(a.$slots, "optionSort", {}, void 0, !0)
-          ]),
-          key: "7"
-        } : void 0,
-        a.$slots.optionFullscreen ? {
-          name: "optionFullscreen",
-          fn: w(({ toggleFullscreen: t, isFullscreen: o }) => [
-            x(a.$slots, "optionFullscreen", q(Y({ toggleFullscreen: t, isFullscreen: o })), void 0, !0)
-          ]),
-          key: "8"
-        } : void 0,
-        a.$slots.optionAnnotator ? {
-          name: "optionAnnotator",
-          fn: w(({ toggleAnnotator: t, isAnnotator: o }) => [
-            x(a.$slots, "optionAnnotator", q(Y({ toggleAnnotator: t, isAnnotator: o })), void 0, !0)
-          ]),
-          key: "9"
-        } : void 0
-      ]), 1032, ["backgroundColor", "color", "isImaging", "isPrinting", "uid", "hasTooltip", "hasPdf", "hasImg", "hasXls", "hasTable", "hasSort", "hasFullscreen", "isFullscreen", "isTooltip", "titles", "chartElement", "position", "hasAnnotator", "isAnnotation", "callbacks", "printScale", "onGeneratePdf", "onGenerateImage", "style"])) : g("", !0),
-      e.value.style.chart.legend.show && e.value.style.chart.legend.position === "top" ? (u(), d("div", {
-        key: 4,
-        ref_key: "chartLegend",
-        ref: he
-      }, [
-        (u(), R(tt, {
-          key: `legend_top_${pe.value}`,
-          legendSet: I.value,
-          config: De.value,
-          onClickMarker: l[0] || (l[0] = ({ legend: t }) => Q(t.id))
-        }, me({
-          item: w(({ legend: t, index: o }) => [
-            n("div", {
-              onClick: (y) => Q(t.id),
-              style: h(`opacity:${N.value.includes(t.id) ? 0.5 : 1}`)
-            }, p(t.name) + ": " + p(r(de)(
-              e.value.style.chart.layout.bars.dataLabels.value.formatter,
-              t.value,
-              r(U)({
-                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: o }
-            )), 13, la)
-          ]),
-          _: 2
-        }, [
-          a.$slots.pattern ? {
-            name: "legend-pattern",
-            fn: w(({ legend: t, index: o }) => [
-              ee(at, {
-                shape: t.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)) : g("", !0),
-      ae.value ? (u(), d("svg", {
-        key: 5,
-        ref_key: "svgRef",
-        ref: Pe,
-        xmlns: r(Dt),
-        class: E({ "vue-data-ui-fullscreen--on": W.value, "vue-data-ui-fulscreen--off": !W.value }),
-        viewBox: ne.value,
-        style: h(`max-width:100%;overflow:visible;background:transparent;color:${e.value.style.chart.color}`)
-      }, [
-        n("g", {
-          ref_key: "G",
-          ref: oe,
-          class: "vue-data-ui-g"
-        }, [
-          ee(r(st)),
-          a.$slots["chart-background"] ? (u(), d("foreignObject", {
-            key: 0,
-            x: 0,
-            y: 0,
-            width: C.value.width <= 0 ? 10 : C.value.width,
-            height: s.value.fullHeight <= 0 ? 10 : s.value.fullHeight,
-            style: {
-              pointerEvents: "none"
-            }
-          }, [
-            x(a.$slots, "chart-background", {}, void 0, !0)
-          ], 8, na)) : g("", !0),
-          (u(!0), d(K, null, J(B.value, (t, o) => (u(), d("linearGradient", {
-            x1: "0%",
-            y1: "0%",
-            x2: "100%",
-            y2: "0%",
-            id: `vertical_bar_gradient_${S.value}_${o}`
-          }, [
-            n("stop", {
-              offset: "0%",
-              "stop-color": t.color
-            }, null, 8, sa),
-            n("stop", {
-              offset: "100%",
-              "stop-color": r(_e)(r(Ut)(t.color, 0.03), 100 - e.value.style.chart.layout.bars.gradientIntensity)
-            }, null, 8, ra)
-          ], 8, ua))), 256)),
-          a.$slots.pattern ? (u(), d("g", ia, [
-            (u(!0), d(K, null, J(B.value, (t) => (u(), d("defs", null, [
-              x(a.$slots, "pattern", At({ ref_for: !0 }, { seriesIndex: t.absoluteIndex, patternId: `pattern_${S.value}_${t.absoluteIndex}` }), void 0, !0)
-            ]))), 256))
-          ])) : g("", !0),
-          (u(!0), d(K, null, J(B.value, (t, o) => (u(), d("g", null, [
-            n("rect", {
-              x: r(L)(F.value ? s.value.left + s.value.width / 2 - (t.sign === 1 ? 0 : T(t.value) <= 0 ? 1e-4 : T(t.value)) : s.value.left),
-              y: s.value.top + (m.value + c.value) * o,
-              width: r(L)(T(t.value) <= 0 ? 1e-4 : T(t.value)),
-              height: c.value <= 0 ? 1e-4 : c.value,
-              fill: e.value.style.chart.layout.bars.underlayerColor,
-              rx: e.value.style.chart.layout.bars.borderRadius,
-              class: E({ animated: e.value.useCssAnimation })
-            }, null, 10, da)
-          ]))), 256)),
-          (u(!0), d(K, null, J(B.value, (t, o) => (u(), d("g", null, [
-            n("rect", {
-              x: r(L)(F.value ? s.value.left + s.value.width / 2 - (t.sign === 1 ? 0 : T(t.value) <= 0 ? 1e-4 : T(t.value)) : s.value.left),
-              y: s.value.top + (m.value + c.value) * o,
-              width: r(L)(T(t.value) <= 0 ? 1e-4 : T(t.value)),
-              height: c.value <= 0 ? 1e-4 : c.value,
-              fill: e.value.style.chart.layout.bars.useGradient ? `url(#vertical_bar_gradient_${S.value}_${o})` : r(_e)(t.color, e.value.style.chart.layout.bars.fillOpacity),
-              rx: e.value.style.chart.layout.bars.borderRadius,
-              stroke: e.value.style.chart.layout.bars.useStroke ? t.color : "none",
-              "stroke-width": e.value.style.chart.layout.bars.useStroke ? e.value.style.chart.layout.bars.strokeWidth : 0,
-              class: E({ animated: e.value.useCssAnimation })
-            }, null, 10, va),
-            a.$slots.pattern ? (u(), d("rect", {
-              key: 0,
-              x: r(L)(F.value ? s.value.left + s.value.width / 2 - (t.sign === 1 ? 0 : T(t.value) <= 0 ? 1e-4 : T(t.value)) : s.value.left),
-              y: s.value.top + (m.value + c.value) * o,
-              width: r(L)(T(t.value) <= 0 ? 1e-4 : T(t.value)),
-              height: c.value <= 0 ? 1e-4 : c.value,
-              fill: `url(#pattern_${S.value}_${t.absoluteIndex})`,
-              rx: e.value.style.chart.layout.bars.borderRadius,
-              stroke: e.value.style.chart.layout.bars.useStroke ? t.color : "none",
-              "stroke-width": e.value.style.chart.layout.bars.useStroke ? e.value.style.chart.layout.bars.strokeWidth : 0,
-              class: E({ animated: e.value.useCssAnimation })
-            }, null, 10, ca)) : g("", !0),
-            (!t.isChild || t.isLastChild) && e.value.style.chart.layout.separators.show && o !== B.value.length - 1 ? (u(), d("line", {
-              key: 1,
-              x1: G.value.x,
-              x2: s.value.left,
-              y1: c.value + m.value / 2 + s.value.top + (m.value + c.value) * o,
-              y2: c.value + m.value / 2 + s.value.top + (m.value + c.value) * o,
-              stroke: e.value.style.chart.layout.separators.color,
-              "stroke-width": e.value.style.chart.layout.separators.strokeWidth,
-              "stroke-linecap": "round",
-              style: { transition: "none !important", animation: "none !important" }
-            }, null, 8, ha)) : g("", !0),
-            F.value && e.value.style.chart.layout.separators.show ? (u(), d("line", {
-              key: 2,
-              x1: s.value.left + s.value.width / 2,
-              x2: s.value.left + s.value.width / 2,
-              y1: s.value.top,
-              y2: s.value.bottom,
-              stroke: e.value.style.chart.layout.separators.color,
-              "stroke-width": e.value.style.chart.layout.separators.strokeWidth,
-              "stroke-linecap": "round"
-            }, null, 8, pa)) : g("", !0),
-            n("g", ya, [
-              n("text", {
-                x: F.value ? s.value.left + s.value.width / 2 + (t.sign === 1 ? -12 : 12) + (t.sign === 1 ? -e.value.style.chart.layout.bars.dataLabels.offsetX : e.value.style.chart.layout.bars.dataLabels.offsetX) : _t(t.value) + 3 + e.value.style.chart.layout.bars.dataLabels.offsetX,
-                y: s.value.top + (m.value + c.value) * o + c.value / 2 + e.value.style.chart.layout.bars.dataLabels.fontSize / 2,
-                "text-anchor": !F.value || t.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"
-              }, p(Ge(t.value, t, o, t.sign)), 9, fa),
-              (t.isChild || !t.hasChildren) && e.value.style.chart.layout.bars.nameLabels.show ? (u(), d("text", {
-                key: 0,
-                "text-anchor": "end",
-                x: s.value.left - 3 + e.value.style.chart.layout.bars.nameLabels.offsetX,
-                y: s.value.top + (m.value + c.value) * o + c.value / 2 + e.value.style.chart.layout.bars.nameLabels.fontSize / 2,
-                "font-size": e.value.style.chart.layout.bars.nameLabels.fontSize,
-                fill: e.value.style.chart.layout.bars.nameLabels.color,
-                "font-weight": e.value.style.chart.layout.bars.nameLabels.bold ? "bold" : "normal"
-              }, p(t.name), 9, ga)) : g("", !0)
-            ]),
-            n("g", ba, [
-              t.isChild && t.childIndex === 0 && e.value.style.chart.layout.bars.parentLabels.show ? (u(), d("text", {
-                key: 0,
-                x: e.value.autoSize ? void 0 : G.value.x + e.value.style.chart.layout.bars.parentLabels.offsetX,
-                y: Z(t, o).y,
-                "font-size": e.value.style.chart.layout.bars.parentLabels.fontSize,
-                fill: e.value.style.chart.layout.bars.parentLabels.color,
-                "font-weight": e.value.style.chart.layout.bars.parentLabels.bold ? "bold" : "normal",
-                "text-anchor": "start"
-              }, p(Z(t, o).name), 9, ma)) : g("", !0),
-              t.isChild && t.childIndex === 0 && e.value.style.chart.layout.bars.parentLabels.show ? (u(), d("text", {
-                key: 1,
-                x: e.value.autoSize ? void 0 : G.value.x + e.value.style.chart.layout.bars.parentLabels.offsetX,
-                y: Z(t, o).y + e.value.style.chart.layout.bars.parentLabels.fontSize + 6,
-                "font-size": e.value.style.chart.layout.bars.parentLabels.fontSize,
-                fill: e.value.style.chart.layout.bars.parentLabels.color,
-                "font-weight": e.value.style.chart.layout.bars.dataLabels.bold ? "bold" : "normal",
-                "text-anchor": "start"
-              }, p(Ge(Z(t, o).value), Z(t, o), o, t.parentSign || t.sign), 9, ka)) : g("", !0)
-            ]),
-            n("rect", {
-              x: G.value.x,
-              y: s.value.top + (m.value + c.value) * o - m.value / 2,
-              width: G.value.width,
-              height: c.value + m.value <= 0 ? 1e-4 : c.value + m.value,
-              fill: fe.value === t.id ? r(_e)(e.value.style.chart.layout.highlighter.color, e.value.style.chart.layout.highlighter.opacity) : "transparent",
-              onMouseenter: (y) => Tt(t, o),
-              onMouseleave: (y) => Ct({ datapoint: t, seriesIndex: o }),
-              onClick: (y) => $t({ datapoint: t, seriesIndex: o })
-            }, null, 40, xa)
-          ]))), 256)),
-          x(a.$slots, "svg", { svg: G.value }, void 0, !0)
-        ], 512)
-      ], 14, oa)) : g("", !0),
-      a.$slots.watermark ? (u(), d("div", _a, [
-        x(a.$slots, "watermark", q(Y({ isPrinting: r(ze) || r(Ae) })), void 0, !0)
-      ])) : g("", !0),
-      ae.value ? g("", !0) : (u(), R(r(it), {
-        key: 7,
-        config: {
-          type: "verticalBar",
-          style: {
-            backgroundColor: e.value.style.chart.backgroundColor,
-            verticalBar: {
-              axis: {
-                color: "#CCCCCC"
-              },
-              color: "#CCCCCC"
-            }
-          }
-        }
-      }, null, 8, ["config"])),
-      e.value.style.chart.legend.show && e.value.style.chart.legend.position === "bottom" ? (u(), d("div", {
-        key: 8,
-        ref_key: "chartLegend",
-        ref: he
-      }, [
-        (u(), R(tt, {
-          key: `legend_bottom_${pe.value}`,
-          legendSet: I.value,
-          config: De.value,
-          onClickMarker: l[1] || (l[1] = ({ legend: t }) => Q(t.id))
-        }, me({
-          item: w(({ legend: t, index: o }) => [
-            n("div", {
-              onClick: (y) => Q(t.id),
-              style: h(`opacity:${N.value.includes(t.id) ? 0.5 : 1}`)
-            }, p(t.name) + ": " + p(r(de)(
-              e.value.style.chart.layout.bars.dataLabels.value.formatter,
-              t.value,
-              r(U)({
-                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: o }
-            )), 13, wa)
-          ]),
-          _: 2
-        }, [
-          a.$slots.pattern ? {
-            name: "legend-pattern",
-            fn: w(({ legend: t, index: o }) => [
-              ee(at, {
-                shape: t.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)) : g("", !0),
-      x(a.$slots, "legend", { legend: I.value }, void 0, !0),
-      a.$slots.source ? (u(), d("div", {
-        key: 9,
-        ref_key: "source",
-        ref: Ce,
-        dir: "auto"
-      }, [
-        x(a.$slots, "source", {}, void 0, !0)
-      ], 512)) : g("", !0),
-      ee(r(dt), {
-        show: $.value.showTooltip && ve.value && N.value.length < b.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: z.value,
-        content: ce.value,
-        isFullscreen: W.value,
-        isCustom: e.value.style.chart.tooltip.customFormat && typeof e.value.style.chart.tooltip.customFormat == "function"
-      }, {
-        "tooltip-before": w(() => [
-          x(a.$slots, "tooltip-before", q(Y({ ...ge.value })), void 0, !0)
-        ]),
-        "tooltip-after": w(() => [
-          x(a.$slots, "tooltip-after", q(Y({ ...ge.value })), void 0, !0)
-        ]),
-        _: 3
-      }, 8, ["show", "backgroundColor", "color", "borderRadius", "borderColor", "borderWidth", "fontSize", "backgroundOpacity", "position", "offsetY", "parent", "content", "isFullscreen", "isCustom"]),
-      ae.value ? (u(), R(Qt, {
-        key: 10,
-        hideDetails: "",
-        config: {
-          open: $.value.showTable,
-          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
-          }
-        }
-      }, {
-        content: w(() => [
-          n("div", {
-            ref_key: "tableContainer",
-            ref: Be,
-            class: "vue-ui-vertical-bar-table atom-data-table"
-          }, [
-            n("div", $a, [
-              n("div", {
-                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: l[2] || (l[2] = (t) => $.value.showTable = !1),
-                onKeypress: l[3] || (l[3] = It((t) => $.value.showTable = !1, ["enter"]))
-              }, [
-                ee(r(ut), {
-                  name: "close",
-                  stroke: e.value.table.th.color,
-                  "stroke-width": 2
-                }, null, 8, ["stroke"])
-              ], 36),
-              n("div", {
-                style: { width: "100%", "container-type": "inline-size" },
-                class: E({ "vue-ui-responsive": Fe.value })
-              }, [
-                n("table", Ca, [
-                  n("caption", {
-                    style: h({ backgroundColor: e.value.table.th.backgroundColor, color: e.value.table.th.color, outline: e.value.table.th.outline }),
-                    class: "vue-ui-data-table__caption"
-                  }, [
-                    Ot(p(e.value.style.chart.title.text) + " ", 1),
-                    e.value.style.chart.title.subtitle.text ? (u(), d("span", Ta, p(e.value.style.chart.title.subtitle.text), 1)) : g("", !0)
-                  ], 4),
-                  n("thead", null, [
-                    n("tr", {
-                      role: "row",
-                      style: h(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color}`)
-                    }, [
-                      (u(!0), d(K, null, J(P.value.head, (t) => (u(), d("th", {
-                        style: h(`outline:${e.value.table.th.outline}`)
-                      }, [
-                        n("div", Sa, p(t), 1)
-                      ], 4))), 256))
-                    ], 4),
-                    n("tr", null, [
-                      n("th", {
-                        style: h(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color};outline:${e.value.table.th.outline}`)
-                      }, null, 4),
-                      n("th", {
-                        style: h(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color};outline:${e.value.table.th.outline};text-align:right;padding-right:5px;font-weight:bold`)
-                      }, "∑ " + p(e.value.table.td.prefix) + p(isNaN(V.value) ? "" : V.value.toFixed(e.value.table.td.roundingValue)) + p(e.value.table.td.suffix), 5),
-                      n("th", {
-                        style: h(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color};outline:${e.value.table.th.outline};text-align:right;padding-right:5px;font-weight:bold`)
-                      }, "100%", 4),
-                      n("th", {
-                        style: h(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color};outline:${e.value.table.th.outline}`)
-                      }, null, 4),
-                      n("th", {
-                        style: h(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color};outline:${e.value.table.th.outline}`)
-                      }, null, 4),
-                      n("th", {
-                        style: h(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color};outline:${e.value.table.th.outline}`)
-                      }, null, 4),
-                      n("th", {
-                        style: h(`background:${e.value.table.th.backgroundColor};color:${e.value.table.th.color};outline:${e.value.table.th.outline}`)
-                      }, null, 4)
-                    ])
-                  ]),
-                  n("tbody", null, [
-                    (u(!0), d(K, null, J(P.value.body, (t, o) => (u(), d("tr", {
-                      class: E({ "vue-ui-data-table__tbody__row": !0, "vue-ui-data-table__tbody__row-even": o % 2 === 0, "vue-ui-data-table__tbody__row-odd": o % 2 !== 0 }),
-                      style: h(`background:${e.value.table.td.backgroundColor};color:${e.value.table.td.color}`)
-                    }, [
-                      n("td", {
-                        class: "vue-ui-data-table__tbody__td",
-                        style: h(`outline:${e.value.table.td.outline};font-variant-numeric: tabular-nums;`),
-                        "data-cell": P.value.head[0] ?? ""
-                      }, [
-                        n("div", Na, [
-                          t.color ? (u(), d("span", {
-                            key: 0,
-                            style: h(`color:${t.color};margin-right:3px`)
-                          }, "⬤", 4)) : g("", !0),
-                          n("span", null, p(t.parentName), 1)
-                        ])
-                      ], 12, La),
-                      n("td", {
-                        class: "vue-ui-data-table__tbody__td",
-                        style: h(`outline:${e.value.table.td.outline}`),
-                        "data-cell": P.value.head[1] ?? ""
-                      }, [
-                        n("div", Va, p(e.value.table.td.prefix) + p(["", NaN, void 0].includes(t.parentValue) ? "" : t.parentValue.toFixed(e.value.table.td.roundingValue)) + p(e.value.table.td.suffix), 1)
-                      ], 12, Pa),
-                      n("td", {
-                        class: "vue-ui-data-table__tbody__td",
-                        style: h(`outline:${e.value.table.td.outline}`),
-                        "data-cell": P.value.head[2] ?? ""
-                      }, [
-                        n("div", Aa, p(["", NaN, void 0].includes(t.percentageToTotal) ? "" : `${(t.percentageToTotal * 100).toFixed(e.value.table.td.roundingPercentage)}%`), 1)
-                      ], 12, za),
-                      n("td", {
-                        class: "vue-ui-data-table__tbody__td",
-                        style: h(`outline:${e.value.table.td.outline}`),
-                        "data-cell": P.value.head[3] ?? ""
-                      }, [
-                        n("div", Oa, p(t.childName), 1)
-                      ], 12, Ia),
-                      n("td", {
-                        class: "vue-ui-data-table__tbody__td",
-                        style: h(`outline:${e.value.table.td.outline}`),
-                        "data-cell": P.value.head[4] ?? ""
-                      }, [
-                        n("div", Ba, p(e.value.table.td.prefix) + p(["", NaN, void 0].includes(t.childValue) ? "" : t.childValue.toFixed(e.value.table.td.roundingValue)) + p(e.value.table.td.suffix), 1)
-                      ], 12, Ma),
-                      n("td", {
-                        class: "vue-ui-data-table__tbody__td",
-                        style: h(`outline:${e.value.table.td.outline}`),
-                        "data-cell": P.value.head[5] ?? ""
-                      }, [
-                        n("div", Ea, p(["", NaN, void 0].includes(t.childPercentageToParent) ? "" : `${(t.childPercentageToParent * 100).toFixed(e.value.table.td.roundingPercentage)}%`), 1)
-                      ], 12, Fa),
-                      n("td", {
-                        class: "vue-ui-data-table__tbody__td",
-                        style: h(`outline:${e.value.table.td.outline}`),
-                        "data-cell": P.value.head[6] ?? ""
-                      }, [
-                        n("div", Da, p(["", NaN, void 0].includes(t.childPercentageToTotal) ? "" : `${(t.childPercentageToTotal * 100).toFixed(e.value.table.td.roundingPercentage)}%`), 1)
-                      ], 12, Ra)
-                    ], 6))), 256))
-                  ])
-                ])
-              ], 2)
-            ])
-          ], 512)
-        ]),
-        _: 1
-      }, 8, ["config"])) : g("", !0)
-    ], 46, aa));
-  }
-}, al = /* @__PURE__ */ ta(Ua, [["__scopeId", "data-v-5479e057"]]);
-export {
-  al as default
-};