vue-data-ui 3.3.3 → 3.4.1

package/dist/vue-ui-stackbar-DUlN5QiM.js

@@ -1,1457 +0,0 @@
-import { defineAsyncComponent as H, useSlots as Ia, computed as m, ref as y, onMounted as Rt, toRefs as Na, watch as ze, shallowRef as It, onBeforeUnmount as Nt, watchEffect as Ot, nextTick as Pt, createElementBlock as o, openBlock as r, unref as v, normalizeStyle as j, normalizeClass as le, createBlock as B, createCommentVNode as d, renderSlot as L, createElementVNode as D, createVNode as he, createSlots as Ge, withCtx as C, normalizeProps as W, guardReactiveProps as Y, Fragment as b, renderList as p, mergeProps as Ce, toDisplayString as T, Teleport as Oa, resolveDynamicComponent as Pa, createTextVNode as Vt } from "vue";
-import { u as Va, a as Dt } from "./useNestedProp-Dh-ldrr5.js";
-import { c as Et, t as Da, b as Ea, p as Se, B as se, e as Fa, o as Ft, f as Ut, g as Ua, h as Ha, a8 as _e, a9 as Ht, C as Bt, X as Ba, m as Wa, a4 as $e, E as Wt, a as Te, d as ee, L as Ya, H as Xa, z as Yt, x as Ga, y as Ja, A as qa } from "./lib-CSDxt1Zh.js";
-import { t as Je, u as Za } from "./useResponsive-DfdjqQps.js";
-import { u as Ka } from "./usePrinter-Cq8Pt6Lh.js";
-import { u as Qa, B as ja } from "./BaseScanner-BgWxam9d.js";
-import { u as el } from "./useSvgExport-DrjCWun4.js";
-import { u as tl } from "./useTimeLabels-BGFjWgrv.js";
-import { u as al } from "./useUserOptionState-BIvW1Kz7.js";
-import { u as ll } from "./useChartAccessibility-9icAAmYg.js";
-import { u as sl } from "./useTimeLabelCollider-CIsgDrl9.js";
-import rl from "./img-DI-W68vp.js";
-import ol from "./Title-B6rAo9Oz.js";
-import { _ as nl } from "./Shape-BS9UGhNq.js";
-import { t as il } from "./themes-Dw-dDudK.js";
-import ul from "./Legend-CCBZ2x8T.js";
-import { S as cl } from "./Slicer-BOki89CB.js";
-import { _ as hl } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const vl = ["id"], dl = ["id"], gl = ["xmlns", "viewBox"], yl = ["x", "y", "width", "height"], bl = { key: 1 }, fl = ["id"], ml = ["stop-color"], pl = ["stop-color"], xl = ["stop-color"], kl = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], wl = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], Ll = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], zl = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], Cl = { key: 0 }, Sl = ["x", "y", "height", "rx", "width", "fill", "stroke", "stroke-width"], _l = { key: 0 }, $l = ["x", "y", "height", "rx", "width", "fill", "stroke", "stroke-width"], Tl = ["x", "y", "width", "rx", "height", "fill", "stroke", "stroke-width"], Ml = { key: 0 }, Al = ["x", "y", "width", "rx", "height", "fill", "stroke", "stroke-width"], Rl = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Il = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Nl = ["x", "y", "font-size", "fill", "font-weight"], Ol = ["transform", "font-size", "fill", "font-weight"], Pl = ["x", "y", "font-size", "fill", "font-weight"], Vl = ["x", "y", "font-size", "font-weight", "fill"], Dl = ["x", "y", "font-size", "fill", "font-weight"], El = ["x", "y", "font-size", "font-weight", "fill"], Fl = ["x1", "x2", "y1", "y2", "stroke"], Ul = ["x", "y", "font-size", "font-weight", "fill"], Hl = ["x1", "x2", "y1", "y2", "stroke"], Bl = ["font-size", "font-weight", "fill", "text-anchor", "transform"], Wl = { key: 0 }, Yl = { key: 1 }, Xl = ["text-anchor", "font-size", "font-weight", "fill", "transform", "onClick"], Gl = ["text-anchor", "font-size", "fill", "transform", "innerHTML", "onClick"], Jl = { key: 0 }, ql = { key: 1 }, Zl = ["font-size", "font-weight", "fill", "x", "y", "onClick"], Kl = ["font-size", "font-weight", "fill", "x", "y", "onClick", "innerHTML"], Ql = ["x", "y", "width", "height", "onClick", "onMouseenter", "onMouseleave", "fill"], jl = ["x", "y", "width", "height", "onClick", "onMouseenter", "onMouseleave", "fill"], es = {
-  key: 3,
-  class: "vue-data-ui-watermark"
-}, ts = ["id"], as = ["onClick"], ls = ["innerHTML"], ss = {
-  __name: "vue-ui-stackbar",
-  props: {
-    config: {
-      type: Object,
-      default() {
-        return {};
-      }
-    },
-    dataset: {
-      type: Array,
-      default() {
-        return [];
-      }
-    }
-  },
-  emits: ["selectDatapoint", "selectLegend", "selectTimeLabel"],
-  setup(Me, { expose: Xt, emit: Gt }) {
-    const Jt = H(() => import("./Tooltip-DaInVNiV.js")), qt = H(() => import("./BaseIcon-DG6cvf2h.js")), Zt = H(() => import("./vue-ui-accordion-CaClZrCp.js")), Kt = H(() => import("./DataTable-DUpZ_s2c.js")), Qt = H(() => import("./PenAndPaper-D9LruJaM.js")), jt = H(() => import("./UserOptions-CJXSEhan.js")), ea = H(() => import("./PackageVersion-CQvYRebC.js")), ta = H(() => import("./BaseDraggableDialog-Cysanw8-.js")), { vue_ui_stackbar: aa } = Va(), la = Ia(), f = Me, Ae = Gt, ve = m({
-      get() {
-        return !!f.dataset && f.dataset.length;
-      },
-      set(a) {
-        return a;
-      }
-    }), O = y(null), M = y(Et()), Re = y(!1), Ie = y(null), Ne = y(""), _ = y([]), qe = y(0), Ze = y(null), Ke = y(null), Qe = y(null), je = y(null), et = y(0), re = y(!1), de = y(null), X = y(!1), tt = y(0), sa = y(0), ra = y(0), at = y(null), lt = y(!1), oe = y(null), Oe = y(null), Pe = y(null), Ve = y(null), G = y(null), J = y(null), oa = y(null), st = y(null);
-    Rt(() => {
-      lt.value = !0, He();
-    });
-    const e = y(Fe()), { loading: ne, FINAL_DATASET: ge, manualLoading: ye } = Qa({
-      ...Na(f),
-      FINAL_CONFIG: e,
-      prepareConfig: Fe,
-      callback: () => {
-        Promise.resolve().then(async () => {
-          await Be();
-        });
-      },
-      skeletonDataset: [
-        {
-          name: "",
-          series: [2, 3, 5, 8, 13, 21],
-          color: "#BABABA"
-        },
-        {
-          name: "",
-          series: [1, 2, 3, 5, 8, 13],
-          color: "#CACACA"
-        }
-      ],
-      skeletonConfig: Da({
-        defaultConfig: e.value,
-        userConfig: {
-          userOptions: { show: !1 },
-          useCssAnimation: !1,
-          table: { show: !1 },
-          tooltip: { show: !1 },
-          style: {
-            chart: {
-              backgroundColor: "#99999930",
-              bars: {
-                totalValues: { show: !1 },
-                dataLabels: { show: !1 }
-              },
-              grid: {
-                scale: {
-                  scaleMin: 0,
-                  scaleMax: 40
-                },
-                x: {
-                  axisColor: "#6A6A6A",
-                  linesColor: "#6A6A6A",
-                  axisName: { show: !1 },
-                  timeLabels: { show: !1 }
-                },
-                y: {
-                  axisColor: "#6A6A6A",
-                  linesColor: "#6A6A6A",
-                  axisName: { show: !1 },
-                  axisLabels: { show: !1 }
-                }
-              },
-              legend: {
-                backgroundColor: "transparent"
-              },
-              padding: {
-                left: 24,
-                right: 24,
-                bottom: 12
-              },
-              zoom: {
-                show: !1,
-                startIndex: null,
-                endIndex: null
-              }
-            }
-          }
-        }
-      })
-    }), { userOptionsVisible: De, setUserOptionsVisibility: rt, keepUserOptionState: ot } = al({ config: e.value }), { svgRef: Ee } = ll({ config: e.value.style.chart.title });
-    function Fe() {
-      const a = Dt({
-        userConfig: f.config,
-        defaultConfig: aa
-      });
-      let l = {};
-      return a.theme ? l = {
-        ...Dt({
-          userConfig: il.vue_ui_stackbar[a.theme] || f.config,
-          defaultConfig: a
-        }),
-        customPalette: Ea[a.theme] || Se
-      } : l = a, f.config && se(f.config, "style.chart.grid.scale.scaleMin") ? l.style.chart.grid.scale.scaleMin = f.config.style.chart.grid.scale.scaleMin : l.style.chart.grid.scale.scaleMin = null, f.config && se(f.config, "style.chart.grid.scale.scaleMax") ? l.style.chart.grid.scale.scaleMax = f.config.style.chart.grid.scale.scaleMax : l.style.chart.grid.scale.scaleMax = null, f.config && se(f.config, "style.chart.zoom.startIndex") ? l.style.chart.zoom.startIndex = f.config.style.chart.zoom.startIndex : l.style.chart.zoom.startIndex = null, f.config && se(f.config, "style.chart.zoom.endIndex") ? l.style.chart.zoom.endIndex = f.config.style.chart.zoom.endIndex : l.style.chart.zoom.endIndex = null, f.config && se(f.config, "style.chart.bars.dataLabels.hideUnderValue") ? l.style.chart.bars.dataLabels.hideUnderValue = f.config.style.chart.bars.dataLabels.hideUnderValue : l.style.chart.bars.dataLabels.hideUnderValue = null, f.config && se(f.config, "style.chart.bars.dataLabels.hideUnderPercentage") ? l.style.chart.bars.dataLabels.hideUnderPercentage = f.config.style.chart.bars.dataLabels.hideUnderPercentage : l.style.chart.bars.dataLabels.hideUnderPercentage = null, l;
-    }
-    const nt = m(() => e.value.style.chart.bars.dataLabels.hideUnderValue !== null), it = m(() => e.value.style.chart.bars.dataLabels.hideUnderPercentage !== null);
-    ze(() => f.config, (a) => {
-      ne.value || (e.value = Fe()), De.value = !e.value.userOptions.showOnChartHover, He(), tt.value += 1, sa.value += 1, ra.value += 1, z.value.dataLabels.show = e.value.style.chart.bars.dataLabels.show, z.value.showTable = e.value.table.show, z.value.showTooltip = e.value.style.chart.tooltip.show;
-    }, { deep: !0 }), ze(() => f.dataset, (a) => {
-      Array.isArray(a) && a.length > 0 && (ye.value = !1), yt();
-    }, { deep: !0 });
-    const z = y({
-      dataLabels: {
-        show: e.value.style.chart.bars.dataLabels.show
-      },
-      showTable: e.value.table.show,
-      showTooltip: e.value.style.chart.tooltip.show
-    });
-    ze(e, () => {
-      z.value = {
-        dataLabels: {
-          show: e.value.style.chart.bars.dataLabels.show
-        },
-        showTable: e.value.table.show,
-        showTooltip: e.value.style.chart.tooltip.show
-      };
-    }, { immediate: !0 });
-    const { isPrinting: ut, isImaging: ct, generatePdf: ht, generateImage: vt } = Ka({
-      elementId: `stackbar_${M.value}`,
-      fileName: e.value.style.chart.title.text || "vue-ui-stackbar",
-      options: e.value.userOptions.print
-    }), te = y({
-      width: e.value.style.chart.width,
-      height: e.value.style.chart.height,
-      paddingRatio: {
-        top: e.value.style.chart.padding.top / e.value.style.chart.height,
-        right: e.value.style.chart.padding.right / e.value.style.chart.width,
-        bottom: e.value.style.chart.padding.bottom / e.value.style.chart.height,
-        left: e.value.style.chart.padding.left / e.value.style.chart.width
-      }
-    }), na = m(() => Fa(e.value.customPalette)), E = It(null), ae = It(null), dt = y(null);
-    Rt(() => {
-      He();
-    });
-    const Ue = m(() => !!e.value.debug);
-    function He() {
-      if (Ft(f.dataset) ? (Ut({
-        componentName: "VueUiStackbar",
-        type: "dataset",
-        debug: Ue.value
-      }), ye.value = !0) : f.dataset.forEach((a, l) => {
-        Ua({
-          datasetObject: a,
-          requiredAttributes: ["name", "series"]
-        }).forEach((t) => {
-          ve.value = !1, Ut({
-            componentName: "VueUiStackbar",
-            type: "datasetSerieAttribute",
-            property: t,
-            index: l,
-            debug: Ue.value
-          }), ye.value = !0;
-        });
-      }), Ft(f.dataset) || (ye.value = e.value.loading), setTimeout(() => {
-        X.value = !0;
-      }, 10), e.value.responsive) {
-        const a = Je(() => {
-          X.value = !1;
-          const { width: l, height: t } = Za({
-            chart: O.value,
-            title: e.value.style.chart.title.text ? Ze.value : null,
-            legend: e.value.style.chart.legend.show ? Ke.value : null,
-            slicer: e.value.style.chart.zoom.show && U.value > 1 ? Qe.value : null,
-            source: je.value
-          });
-          requestAnimationFrame(() => {
-            te.value.width = l, te.value.height = t - 12, clearTimeout(dt.value), dt.value = setTimeout(() => {
-              X.value = !0;
-            }, 10);
-          });
-        });
-        E.value && (ae.value && E.value.unobserve(ae.value), E.value.disconnect()), E.value = new ResizeObserver(a), ae.value = O.value.parentNode, E.value.observe(ae.value);
-      }
-      Be();
-    }
-    Nt(() => {
-      E.value && (ae.value && E.value.unobserve(ae.value), E.value.disconnect());
-    });
-    function ia() {
-      let a = 0;
-      e.value.orientation === "vertical" && G.value && (a = Array.from(G.value.querySelectorAll("text")).reduce((s, c) => {
-        const u = c.getComputedTextLength();
-        return u > s ? u : s;
-      }, 0)), e.value.orientation === "horizontal" && J.value && (a = Array.from(J.value.querySelectorAll("text")).reduce((s, c) => {
-        const u = c.getComputedTextLength();
-        return u > s ? u : s;
-      }, 0));
-      const l = Ve.value ? Ve.value.getBoundingClientRect().width : 0;
-      return a + l + (l ? 24 : 0);
-    }
-    const be = y(0), fe = y(0), ua = Je((a) => {
-      be.value = a;
-    }, 100);
-    Ot((a) => {
-      const l = e.value.orientation === "vertical" ? J.value : G.value;
-      if (!l) return;
-      const t = new ResizeObserver((s) => {
-        ua(s[0].contentRect.height);
-      });
-      t.observe(l), a(() => t.disconnect());
-    });
-    const ca = Je((a) => {
-      fe.value = a + e.value.style.chart.bars.totalValues.fontSize;
-    }, 100);
-    Ot((a) => {
-      if (e.value.orientation === "vertical") return;
-      const l = st.value;
-      if (!l) return;
-      const t = new ResizeObserver((s) => {
-        ca(s[0].contentRect.width);
-      });
-      t.observe(l), a(() => t.disconnect());
-    }), Nt(() => {
-      be.value = 0, fe.value = 0;
-    });
-    const gt = m(() => {
-      let a = 0;
-      Pe.value && (a = Pe.value.getBBox().height);
-      let l = 0;
-      return e.value.orientation === "vertical" && J.value && (l = be.value), e.value.orientation === "horizontal" && G.value && (l = be.value), a + l;
-    }), n = m(() => {
-      const { height: a, width: l } = te.value, { right: t } = te.value.paddingRatio;
-      let s = e.value.style.chart.bars.totalValues.show && f.dataset && f.dataset.length > 1 ? e.value.style.chart.bars.totalValues.fontSize * 1.3 : 0, c = 0;
-      e.value.style.chart.grid.y.axisLabels.show && (c = ia());
-      const u = e.value.style.chart.padding.top + s, S = l - l * t - fe.value, q = a - e.value.style.chart.padding.bottom - gt.value - s, Z = e.value.style.chart.padding.left + c, K = l - Z - l * t - fe.value, P = a - u - e.value.style.chart.padding.bottom - gt.value - s;
-      return {
-        chartHeight: a,
-        chartWidth: l,
-        top: u,
-        right: S,
-        bottom: q,
-        left: Z,
-        width: Math.max(0, K),
-        height: Math.max(0, P)
-      };
-    }), F = m(() => ge.value.map((a, l) => {
-      const t = Ha(a.color) || na.value[l] || Se[l] || Se[l % Se.length];
-      return {
-        ...a,
-        // In distributed mode, all values are converted to positive
-        series: JSON.parse(JSON.stringify(a.series)).map((s) => e.value.style.chart.bars.distributed ? Math.abs(s) : s),
-        // Store signs to manage display of neg values in distributed mode
-        signedSeries: a.series.map((s) => s >= 0 ? 1 : -1),
-        absoluteIndex: l,
-        id: Et(),
-        color: t
-      };
-    })), U = m(() => Math.max(...F.value.filter((a) => !_.value.includes(a.id)).map((a) => a.series.length))), h = y({
-      start: 0,
-      end: Math.max(...ge.value.map((a) => a.series.length))
-    });
-    function yt() {
-      Be();
-    }
-    async function Be() {
-      await Pt(), await Pt();
-      const { startIndex: a, endIndex: l } = e.value.style.chart.zoom, t = at.value, s = Math.max(...ge.value.map((c) => c.series.length));
-      h.value = { start: 0, end: s }, (a != null || l != null) && t ? (a != null ? t.setStartValue(a) : (h.value.start = 0, t.setStartValue(0)), l != null ? t.setEndValue(ha(l + 1)) : (h.value.end = s, t.setEndValue(s))) : (h.value = { start: 0, end: s }, et.value += 1);
-    }
-    function ha(a) {
-      const l = Math.max(...ge.value.map((t) => t.series.length));
-      return a > l ? l : a < 0 || e.value.style.chart.zoom.startIndex !== null && a < e.value.style.chart.zoom.startIndex ? e.value.style.chart.zoom.startIndex !== null ? e.value.style.chart.zoom.startIndex + 1 : 1 : a;
-    }
-    const g = m(() => {
-      let a;
-      return e.value.orientation === "vertical" ? a = n.value.width / (h.value.end - h.value.start) : a = n.value.height / (h.value.end - h.value.start), a <= 0 ? 0 : a;
-    }), ie = m(() => _e(F.value.filter((a) => !_.value.includes(a.id))).slice(h.value.start, h.value.end)), va = m(() => _e(F.value.filter((a) => !_.value.includes(a.id)).map((a) => ({
-      ...a,
-      series: a.series.map((l, t) => a.signedSeries[t] === -1 && l >= 0 ? -l : l)
-    }))).slice(h.value.start, h.value.end)), me = m(() => {
-      const a = F.value.filter((l) => !_.value.includes(l.id));
-      return {
-        positive: _e(a.map((l) => ({
-          ...l,
-          series: l.series.slice(h.value.start, h.value.end).map((t) => t >= 0 ? t : 0)
-        }))),
-        negative: _e(a.map((l) => ({
-          ...l,
-          series: l.series.slice(h.value.start, h.value.end).map((t) => t < 0 ? t : 0)
-        })))
-      };
-    }), N = m(() => {
-      const a = e.value.style.chart.grid.scale.scaleMax !== null && !e.value.style.chart.bars.distributed ? e.value.style.chart.grid.scale.scaleMax : Math.max(...me.value.positive), l = Math.min(...me.value.negative), t = e.value.style.chart.grid.scale.scaleMin !== null && !e.value.style.chart.bars.distributed ? e.value.style.chart.grid.scale.scaleMin : [-1 / 0, 1 / 0, NaN, void 0, null].includes(l) ? 0 : l, s = !e.value.style.chart.bars.distributed && (e.value.style.chart.grid.scale.scaleMax !== null || e.value.style.chart.grid.scale.scaleMin !== null) ? Ht(t > 0 ? 0 : t, a < 0 ? 0 : a, e.value.style.chart.grid.scale.ticks) : Bt(t > 0 ? 0 : t, a < 0 ? 0 : a, e.value.style.chart.grid.scale.ticks);
-      return s.ticks.map((c) => ({
-        zero: n.value.bottom - n.value.height * (Math.abs(s.min) / (s.max + Math.abs(s.min))),
-        y: n.value.bottom - n.value.height * ((c + Math.abs(s.min)) / (s.max + Math.abs(s.min))),
-        x: n.value.left - 8,
-        horizontal_zero: n.value.left + n.value.width * (Math.abs(s.min) / (s.max + Math.abs(s.min))),
-        horizontal_x: n.value.left + n.value.width * ((c + Math.abs(s.min)) / (s.max + Math.abs(s.min))),
-        horizontal_y: n.value.bottom - 8,
-        value: c
-      }));
-    }), $ = m(() => tl({
-      values: e.value.style.chart.grid.x.timeLabels.values,
-      maxDatapoints: U.value,
-      formatter: e.value.style.chart.grid.x.timeLabels.datetimeFormatter,
-      start: h.value.start,
-      end: h.value.end
-    })), w = m(() => {
-      if (!ve.value && !ne.value) return [];
-      let a = Array(U.value).fill(0), l = Array(U.value).fill(0), t = Array(U.value).fill(0), s = Array(U.value).fill(0);
-      const c = Math.max(...me.value.positive) || 0, u = Math.min(...me.value.negative), S = [-1 / 0, 1 / 0, NaN, void 0, null].includes(u) ? 0 : u, q = !e.value.style.chart.bars.distributed && (e.value.style.chart.grid.scale.scaleMax !== null || e.value.style.chart.grid.scale.scaleMin !== null) ? Ht(e.value.style.chart.grid.scale.scaleMin !== null ? e.value.style.chart.grid.scale.scaleMin : S > 0 ? 0 : S, e.value.style.chart.grid.scale.scaleMax !== null ? e.value.style.chart.grid.scale.scaleMax : c < 0 ? 0 : c, e.value.style.chart.grid.scale.ticks) : Bt(e.value.style.chart.grid.scale.scaleMin !== null ? e.value.style.chart.grid.scale.scaleMin : S > 0 ? 0 : S, e.value.style.chart.grid.scale.scaleMax !== null ? e.value.style.chart.grid.scale.scaleMax : c < 0 ? 0 : c, e.value.style.chart.grid.scale.ticks), { min: Z, max: K } = q, P = K + (Z >= 0 ? 0 : Math.abs(Z)) || 1, A = n.value.height, Le = n.value.width, Mt = N.value[0] ? N.value[0].zero : n.value.bottom, At = N.value[0] ? N.value[0].horizontal_zero : n.value.left;
-      return F.value.filter((ce) => !_.value.includes(ce.id)).map((ce) => {
-        const V = ce.series.slice(h.value.start, h.value.end), Ca = ce.signedSeries.slice(h.value.start, h.value.end), Sa = V.map((x, k) => n.value.left + g.value * k + g.value * e.value.style.chart.bars.gapRatio / 4), _a = V.map((x, k) => n.value.top + g.value * k + g.value * e.value.style.chart.bars.gapRatio / 4), $a = V.map((x, k) => {
-          const R = e.value.style.chart.bars.distributed ? (x || 0) / ie.value[k] : (x || 0) / P;
-          let Q, I;
-          return x > 0 ? (I = A * R, Q = Mt - I - a[k], a[k] += I) : (I = A * R, Q = Mt + t[k], t[k] += Math.abs(I)), Q;
-        }), Ta = V.map((x, k) => {
-          const R = e.value.style.chart.bars.distributed ? (x || 0) / ie.value[k] : (x || 0) / P;
-          let Q, I;
-          return x > 0 ? (I = Le * R, Q = At + l[k], l[k] += I) : (I = Le * R, Q = At - Math.abs(I) - s[k], s[k] += Math.abs(I)), Q;
-        }), Ma = V.map((x, k) => {
-          const R = e.value.style.chart.bars.distributed ? (x || 0) / ie.value[k] : (x || 0) / P;
-          return x > 0 ? A * R : A * Math.abs(R);
-        }), Aa = V.map((x, k) => {
-          const R = e.value.style.chart.bars.distributed ? (x || 0) / ie.value[k] : (x || 0) / P;
-          return x > 0 ? Le * R : Le * Math.abs(R);
-        }), Ra = V.map((x) => Math.abs(x)).reduce((x, k) => x + k, 0);
-        return {
-          ...ce,
-          proportions: V.map((x, k) => e.value.style.chart.bars.distributed ? (x || 0) / ie.value[k] : (x || 0) / Ra),
-          series: V,
-          signedSeries: Ca,
-          x: Sa,
-          y: $a,
-          height: Ma,
-          horizontal_width: Aa,
-          horizontal_y: _a,
-          horizontal_x: Ta
-        };
-      });
-    }), bt = m(() => va.value.map((a, l) => ({
-      value: a,
-      sign: a >= 0 ? 1 : -1
-    })));
-    function pe(a, l, t, s, c) {
-      const u = c === -1 && a >= 0 ? -a : a;
-      return Te(
-        e.value.style.chart.bars.dataLabels.formatter,
-        u,
-        ee({
-          p: e.value.style.chart.bars.dataLabels.prefix,
-          v: u,
-          s: e.value.style.chart.bars.dataLabels.suffix,
-          r: e.value.style.chart.bars.dataLabels.rounding
-        }),
-        { datapoint: l, seriesIndex: t, datapointIndex: s }
-      );
-    }
-    function ft(a, l, t, s) {
-      return Te(
-        e.value.style.chart.bars.dataLabels.formatter,
-        a,
-        ee({
-          v: isNaN(a) ? 0 : a,
-          s: "%",
-          r: e.value.style.chart.bars.dataLabels.rounding
-        }),
-        { datapoint: l, seriesIndex: t, datapointIndex: s }
-      );
-    }
-    function mt(a) {
-      const l = JSON.parse(JSON.stringify(w.value)).map((t) => ({
-        name: t.name,
-        value: t.series[a] === 0 ? 0 : t.series[a] || null,
-        proportion: t.proportions[a] || null,
-        color: t.color,
-        id: t.id
-      }));
-      e.value.events.datapointClick && e.value.events.datapointClick({ datapoint: l, seriesIndex: a + h.value.start }), Ae("selectDatapoint", { datapoint: l, period: $.value[a] });
-    }
-    function pt(a) {
-      return JSON.parse(JSON.stringify(w.value)).map((l) => ({
-        name: l.name,
-        absoluteIndex: l.absoluteIndex,
-        value: l.series[a] === 0 ? 0 : (l.signedSeries[a] === -1 && l.series[a] >= 0 ? -l.series[a] : l.series[a]) || null,
-        proportion: l.proportions[a] || null,
-        color: l.color,
-        id: l.id
-      }));
-    }
-    function xt(a) {
-      if (e.value.events.datapointLeave) {
-        const l = pt(a);
-        e.value.events.datapointLeave({ datapoint: l, seriesIndex: a + h.value.start });
-      }
-      Re.value = null, de.value = null;
-    }
-    function kt(a) {
-      de.value = a, Re.value = !0;
-      const l = e.value.style.chart.tooltip.customFormat, t = pt(a);
-      e.value.events.datapointEnter && e.value.events.datapointEnter({ datapoint: t, seriesIndex: a + h.value.start }), Ie.value = {
-        datapoint: t,
-        seriesIndex: a,
-        config: e.value,
-        series: w.value
-      };
-      const s = t.map((c) => Math.abs(c.value)).reduce((c, u) => c + u, 0);
-      if (Yt(l) && qa(() => l({
-        seriesIndex: a,
-        datapoint: t,
-        series: w.value,
-        config: e.value
-      })))
-        Ne.value = l({
-          seriesIndex: a,
-          datapoint: t,
-          series: w.value,
-          config: e.value
-        });
-      else {
-        const {
-          showValue: c,
-          showPercentage: u,
-          borderColor: S,
-          roundingValue: q,
-          roundingPercentage: Z
-        } = e.value.style.chart.tooltip;
-        let K = "";
-        $.value[a] && $.value[a].text && e.value.style.chart.tooltip.showTimeLabel && (K += `<div style="width:100%;text-align:center;border-bottom:1px solid ${S};padding-bottom:6px;margin-bottom:3px;">${$.value[a].text}</div>`);
-        const P = [
-          c && u ? "(" : "",
-          c && u ? ")" : ""
-        ];
-        t.reverse().forEach((A) => {
-          K += `
-                <div style="display:flex;flex-direction:row;align-items:center;gap:4px">
-                    <svg viewBox="0 0 60 60" height="14" width="14"><rect rx="5" x="0" y="0" height="60" width="60" stroke="none" fill="${e.value.style.chart.bars.gradient.show ? `url(#gradient_${A.id})` : A.color}"/>${la.pattern ? `<rect rx="5" x="0" y="0" height="60" width="60" stroke="none" fill="url(#pattern_${M.value}_${A.absoluteIndex})"/>` : ""}</svg>
-                    ${A.name}${c || u ? ":" : ""} ${c ? ee({
-            p: e.value.style.chart.bars.dataLabels.prefix,
-            v: A.value,
-            s: e.value.style.chart.bars.dataLabels.suffix,
-            r: q
-          }) : ""} ${P[0]}${u ? ee({
-            v: isNaN(A.value / s) ? 0 : Math.abs(A.value) / s * 100,
-            // Negs are absed to show relative proportion to absolute total. It's opinionated.
-            s: "%",
-            r: Z
-          }) : ""}${P[1]}
-                </div>
-            `;
-        }), Ne.value = `<div>${K}</div>`;
-      }
-    }
-    const da = m(() => te.value.width), ga = m(() => te.value.height);
-    sl({
-      timeLabelsEls: e.value.orientation === "vertical" ? J : G,
-      timeLabels: $,
-      slicer: h,
-      configRef: e,
-      rotationPath: ["style", "chart", "grid", "x", "timeLabels", "rotation"],
-      autoRotatePath: ["style", "chart", "grid", "x", "timeLabels", "autoRotate", "enable"],
-      isAutoSize: !1,
-      width: da,
-      height: ga,
-      rotation: e.value.style.chart.grid.x.timeLabels.autoRotate.angle
-    });
-    function wt(a) {
-      re.value = a, qe.value += 1;
-    }
-    function Lt() {
-      z.value.showTable = !z.value.showTable;
-    }
-    function zt() {
-      z.value.dataLabels.show = !z.value.dataLabels.show;
-    }
-    function Ct() {
-      z.value.showTooltip = !z.value.showTooltip;
-    }
-    function ya() {
-      return w.value;
-    }
-    const St = m(() => {
-      if (w.value.length === 0) return { head: [], body: [], config: {}, columnNames: [] };
-      const a = w.value.map(({ name: t, color: s }) => ({
-        label: t,
-        color: s
-      })), l = [];
-      return $.value.forEach((t) => {
-        const s = [e.value.style.chart.grid.x.timeLabels.values[t.absoluteIndex] ? t.text : i + 1];
-        F.value.forEach((c) => {
-          s.push(Number((c.series[t.absoluteIndex] || 0).toFixed(e.value.table.td.roundingValue)));
-        }), l.push(s);
-      }), { head: a, body: l };
-    });
-    function We(a = null) {
-      const l = [[e.value.style.chart.title.text], [e.value.style.chart.title.subtitle.text], [""]], t = ["", ...St.value.head.map((S) => S.label)], s = St.value.body, c = l.concat([t]).concat(s), u = Ga(c);
-      a ? a(u) : Ja({ csvContent: u, title: e.value.style.chart.title.text || "vue-ui-stackbar" });
-    }
-    const xe = m(() => {
-      const a = [""].concat(w.value.map((c) => c.name)).concat(' <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M18 16v2a1 1 0 0 1 -1 1h-11l6 -7l-6 -7h11a1 1 0 0 1 1 1v2" /></svg>');
-      let l = [];
-      for (let c = 0; c < U.value; c += 1) {
-        const u = w.value.map((S) => S.series[c] ?? 0).reduce((S, q) => S + q, 0);
-        l.push([e.value.style.chart.grid.x.timeLabels.values.slice(h.value.start, h.value.end)[c] ? $.value[c].text : c + 1].concat(w.value.map((S) => (S.series[c] ?? 0).toFixed(e.value.table.td.roundingValue))).concat((u ?? 0).toFixed(e.value.table.td.roundingValue)));
-      }
-      const t = {
-        th: {
-          backgroundColor: e.value.table.th.backgroundColor,
-          color: e.value.table.th.color,
-          outline: e.value.table.th.outline
-        },
-        td: {
-          backgroundColor: e.value.table.td.backgroundColor,
-          color: e.value.table.td.color,
-          outline: e.value.table.td.outline
-        },
-        breakpoint: e.value.table.responsiveBreakpoint
-      }, s = [e.value.table.columnNames.period].concat(w.value.map((c) => c.name)).concat(e.value.table.columnNames.total);
-      return { head: a, body: l.slice(0, h.value.end - h.value.start), config: t, colNames: s };
-    });
-    function ba(a, l) {
-      if (Ae("selectLegend", w.value.find((t) => t.absoluteIndex === a)), _.value.includes(l.id))
-        _.value = _.value.filter((t) => t !== l.id);
-      else {
-        if (_.value.length === F.value.length - 1) return;
-        _.value.push(l.id);
-      }
-    }
-    const Ye = m(() => F.value.map((a, l) => ({
-      ...a,
-      shape: "square"
-    })).map((a) => ({
-      ...a,
-      opacity: _.value.includes(a.id) ? 0.5 : 1,
-      segregate: () => ba(a.absoluteIndex, a),
-      isSegregated: _.value.includes(a.id)
-    }))), fa = m(() => ({
-      cy: "stackbar-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" : ""
-    })), ke = y(!1);
-    function Xe() {
-      ke.value = !ke.value;
-    }
-    function we(a, l) {
-      const t = JSON.parse(JSON.stringify(w.value)).map((s) => ({
-        name: s.name,
-        value: s.series[l] === 0 ? 0 : (s.signedSeries[l] === -1 && s.series[l] >= 0 ? -s.series[l] : s.series[l]) || null,
-        proportion: s.proportions[l] || null,
-        color: s.color,
-        id: s.id
-      }));
-      Ae("selectTimeLabel", {
-        datapoint: t,
-        absoluteIndex: a.absoluteIndex,
-        label: a.text
-      });
-    }
-    const ma = m(() => Math.max(...w.value.flatMap((a) => a.series)));
-    function _t(a, l) {
-      return e.value.style.chart.bars.showDistributedPercentage && e.value.style.chart.bars.distributed ? it.value ? l * 100 >= e.value.style.chart.bars.dataLabels.hideUnderPercentage : e.value.style.chart.bars.dataLabels.hideEmptyPercentages ? l > 0 : !0 : it.value ? (nt.value && Ue.value && console.warn("Vue Data UI - VueUiStackbar - You cannot set both dataLabels.hideUnderPercentage and dataLabels.hideUnderValue. Note that dataLabels.hideUnderPercentage takes precedence in this case."), a > ma.value * e.value.style.chart.bars.dataLabels.hideUnderPercentage / 100) : nt.value ? Math.abs(a) >= e.value.style.chart.bars.dataLabels.hideUnderValue : e.value.style.chart.bars.dataLabels.hideEmptyValues ? a !== 0 : !0;
-    }
-    async function pa({ scale: a = 2 } = {}) {
-      if (!O.value) return;
-      const { width: l, height: t } = O.value.getBoundingClientRect(), s = l / t, { imageUri: c, base64: u } = await rl({ domElement: O.value, base64: !0, img: !0, scale: a });
-      return {
-        imageUri: c,
-        base64: u,
-        title: e.value.style.chart.title.text,
-        width: l,
-        height: t,
-        aspectRatio: s
-      };
-    }
-    const ue = m(() => {
-      const a = e.value.table.useDialog && !e.value.table.show, l = z.value.showTable;
-      return {
-        component: a ? ta : Zt,
-        title: `${e.value.style.chart.title.text}${e.value.style.chart.title.subtitle.text ? `: ${e.value.style.chart.title.subtitle.text}` : ""}`,
-        props: a ? {
-          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: re.value,
-          fullscreenParent: O.value,
-          forcedWidth: Math.min(800, window.innerWidth * 0.8)
-        } : {
-          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
-            }
-          }
-        }
-      };
-    });
-    ze(() => z.value.showTable, (a) => {
-      e.value.table.show || (a && e.value.table.useDialog && oe.value ? oe.value.open() : "close" in oe.value && oe.value.close());
-    });
-    function $t() {
-      z.value.showTable = !1, Oe.value && Oe.value.setTableIconState(!1);
-    }
-    const xa = m(() => e.value.style.chart.backgroundColor), ka = m(() => e.value.style.chart.legend), wa = m(() => e.value.style.chart.title), { exportSvg: La, getSvg: za } = el({
-      svg: Ee,
-      title: wa,
-      legend: ka,
-      legendItems: Ye,
-      backgroundColor: xa
-    });
-    async function Tt({ isCb: a }) {
-      if (a) {
-        const { blob: l, url: t, text: s, dataUrl: c } = await za();
-        e.value.userOptions.callbacks.svg({ blob: l, url: t, text: s, dataUrl: c });
-      } else
-        La();
-    }
-    return Xt({
-      getData: ya,
-      getImage: pa,
-      generatePdf: ht,
-      generateCsv: We,
-      generateImage: vt,
-      generateSvg: Tt,
-      toggleTable: Lt,
-      toggleLabels: zt,
-      toggleTooltip: Ct,
-      toggleAnnotator: Xe,
-      toggleFullscreen: wt
-    }), (a, l) => (r(), o("div", {
-      id: `stackbar_${M.value}`,
-      ref_key: "stackbarChart",
-      ref: O,
-      class: le({ "vue-data-ui-component": !0, "vue-ui-stackbar": !0, "vue-data-ui-wrapper-fullscreen": re.value }),
-      style: j(`background:${e.value.style.chart.backgroundColor};color:${e.value.style.chart.color};font-family:${e.value.style.fontFamily}; position: relative; ${e.value.responsive ? "height: 100%" : ""}`),
-      onMouseenter: l[4] || (l[4] = () => v(rt)(!0)),
-      onMouseleave: l[5] || (l[5] = () => v(rt)(!1))
-    }, [
-      e.value.userOptions.buttons.annotator ? (r(), B(v(Qt), {
-        key: 0,
-        svgRef: v(Ee),
-        backgroundColor: e.value.style.chart.backgroundColor,
-        color: e.value.style.chart.color,
-        active: ke.value,
-        onClose: Xe
-      }, null, 8, ["svgRef", "backgroundColor", "color", "active"])) : d("", !0),
-      L(a.$slots, "userConfig", {}, void 0, !0),
-      e.value.style.chart.title.text ? (r(), o("div", {
-        key: 1,
-        ref_key: "chartTitle",
-        ref: Ze,
-        style: "width:100%;background:transparent;padding-bottom:24px"
-      }, [
-        (r(), B(ol, {
-          key: `title_${tt.value}`,
-          config: {
-            title: {
-              cy: "stackbar-title",
-              ...e.value.style.chart.title
-            },
-            subtitle: {
-              cy: "stackbar-subtitle",
-              ...e.value.style.chart.title.subtitle
-            }
-          }
-        }, null, 8, ["config"]))
-      ], 512)) : d("", !0),
-      D("div", {
-        id: `legend-top-${M.value}`
-      }, null, 8, dl),
-      e.value.userOptions.show && ve.value && (v(ot) || v(De)) ? (r(), B(v(jt), {
-        ref_key: "userOptionsRef",
-        ref: Oe,
-        key: `user_option_${qe.value}`,
-        backgroundColor: e.value.style.chart.backgroundColor,
-        color: e.value.style.chart.color,
-        isPrinting: v(ut),
-        isImaging: v(ct),
-        uid: M.value,
-        hasTooltip: e.value.style.chart.tooltip.show && e.value.userOptions.buttons.tooltip,
-        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,
-        hasLabel: e.value.userOptions.buttons.labels,
-        hasFullscreen: e.value.userOptions.buttons.fullscreen,
-        isFullscreen: re.value,
-        chartElement: O.value,
-        position: e.value.userOptions.position,
-        isTooltip: z.value.showTooltip,
-        titles: { ...e.value.userOptions.buttonTitles },
-        hasAnnotator: e.value.userOptions.buttons.annotator,
-        isAnnotation: ke.value,
-        callbacks: e.value.userOptions.callbacks,
-        printScale: e.value.userOptions.print.scale,
-        tableDialog: e.value.table.useDialog,
-        onToggleFullscreen: wt,
-        onGeneratePdf: v(ht),
-        onGenerateCsv: We,
-        onGenerateImage: v(vt),
-        onGenerateSvg: Tt,
-        onToggleTable: Lt,
-        onToggleLabels: zt,
-        onToggleTooltip: Ct,
-        onToggleAnnotator: Xe,
-        style: j({
-          visibility: v(ot) ? v(De) ? "visible" : "hidden" : "visible"
-        })
-      }, Ge({ _: 2 }, [
-        a.$slots.menuIcon ? {
-          name: "menuIcon",
-          fn: C(({ isOpen: t, color: s }) => [
-            L(a.$slots, "menuIcon", W(Y({ isOpen: t, color: s })), void 0, !0)
-          ]),
-          key: "0"
-        } : void 0,
-        a.$slots.optionTooltip ? {
-          name: "optionTooltip",
-          fn: C(() => [
-            L(a.$slots, "optionTooltip", {}, void 0, !0)
-          ]),
-          key: "1"
-        } : void 0,
-        a.$slots.optionPdf ? {
-          name: "optionPdf",
-          fn: C(() => [
-            L(a.$slots, "optionPdf", {}, void 0, !0)
-          ]),
-          key: "2"
-        } : void 0,
-        a.$slots.optionCsv ? {
-          name: "optionCsv",
-          fn: C(() => [
-            L(a.$slots, "optionCsv", {}, void 0, !0)
-          ]),
-          key: "3"
-        } : void 0,
-        a.$slots.optionImg ? {
-          name: "optionImg",
-          fn: C(() => [
-            L(a.$slots, "optionImg", {}, void 0, !0)
-          ]),
-          key: "4"
-        } : void 0,
-        a.$slots.optionTable ? {
-          name: "optionTable",
-          fn: C(() => [
-            L(a.$slots, "optionTable", {}, void 0, !0)
-          ]),
-          key: "5"
-        } : void 0,
-        a.$slots.optionLabels ? {
-          name: "optionLabels",
-          fn: C(() => [
-            L(a.$slots, "optionLabels", {}, void 0, !0)
-          ]),
-          key: "6"
-        } : void 0,
-        a.$slots.optionFullscreen ? {
-          name: "optionFullscreen",
-          fn: C(({ toggleFullscreen: t, isFullscreen: s }) => [
-            L(a.$slots, "optionFullscreen", W(Y({ toggleFullscreen: t, isFullscreen: s })), void 0, !0)
-          ]),
-          key: "7"
-        } : void 0,
-        a.$slots.optionAnnotator ? {
-          name: "optionAnnotator",
-          fn: C(({ toggleAnnotator: t, isAnnotator: s }) => [
-            L(a.$slots, "optionAnnotator", W(Y({ toggleAnnotator: t, isAnnotator: s })), void 0, !0)
-          ]),
-          key: "8"
-        } : void 0
-      ]), 1032, ["backgroundColor", "color", "isPrinting", "isImaging", "uid", "hasTooltip", "hasPdf", "hasImg", "hasSvg", "hasXls", "hasTable", "hasLabel", "hasFullscreen", "isFullscreen", "chartElement", "position", "isTooltip", "titles", "hasAnnotator", "isAnnotation", "callbacks", "printScale", "tableDialog", "onGeneratePdf", "onGenerateImage", "style"])) : d("", !0),
-      (r(), o("svg", {
-        ref_key: "svgRef",
-        ref: Ee,
-        xmlns: v(Ba),
-        viewBox: `0 0 ${n.value.chartWidth <= 0 ? 10 : n.value.chartWidth} ${n.value.chartHeight <= 0 ? 10 : n.value.chartHeight}`,
-        class: le({ "vue-data-ui-loading": v(ne) }),
-        style: j(`max-width:100%;overflow:visible;background:transparent;color:${e.value.style.chart.color}`)
-      }, [
-        he(v(ea)),
-        a.$slots["chart-background"] ? (r(), o("foreignObject", {
-          key: 0,
-          x: n.value.left,
-          y: n.value.top,
-          width: n.value.width <= 0 ? 10 : n.value.width,
-          height: n.value.height <= 0 ? 10 : n.value.height,
-          style: {
-            pointerEvents: "none"
-          }
-        }, [
-          L(a.$slots, "chart-background", {}, void 0, !0)
-        ], 8, yl)) : d("", !0),
-        e.value.style.chart.bars.gradient.show ? (r(), o("defs", bl, [
-          (r(!0), o(b, null, p(w.value, (t, s) => (r(), o("linearGradient", {
-            id: `gradient_${t.id}`,
-            x1: "0%",
-            y1: "0%",
-            x2: "0%",
-            y2: "100%"
-          }, [
-            D("stop", {
-              offset: "0%",
-              "stop-color": t.color
-            }, null, 8, ml),
-            D("stop", {
-              offset: "61.8%",
-              "stop-color": v(Wa)(t.color, e.value.style.chart.bars.gradient.intensity / 100)
-            }, null, 8, pl),
-            D("stop", {
-              offset: "100%",
-              "stop-color": t.color
-            }, null, 8, xl)
-          ], 8, fl))), 256))
-        ])) : d("", !0),
-        e.value.style.chart.grid.x.showHorizontalLines && e.value.orientation === "vertical" ? (r(!0), o(b, { key: 2 }, p(N.value, (t, s) => (r(), o("line", {
-          x1: n.value.left,
-          x2: n.value.right,
-          y1: t.y,
-          y2: t.y,
-          stroke: e.value.style.chart.grid.x.linesColor,
-          "stroke-width": e.value.style.chart.grid.x.linesThickness,
-          "stroke-dasharray": e.value.style.chart.grid.x.linesStrokeDasharray,
-          "stroke-linecap": "round"
-        }, null, 8, kl))), 256)) : d("", !0),
-        e.value.style.chart.grid.x.showHorizontalLines && e.value.orientation === "horizontal" ? (r(!0), o(b, { key: 3 }, p(h.value.end - h.value.start + 1, (t, s) => (r(), o("line", {
-          x1: n.value.left,
-          x2: n.value.right,
-          y1: n.value.top + g.value * s,
-          y2: n.value.top + g.value * s,
-          stroke: e.value.style.chart.grid.x.linesColor,
-          "stroke-width": e.value.style.chart.grid.x.linesThickness,
-          "stroke-dasharray": e.value.style.chart.grid.x.linesStrokeDasharray,
-          "stroke-linecap": "round"
-        }, null, 8, wl))), 256)) : d("", !0),
-        e.value.style.chart.grid.y.showVerticalLines && e.value.orientation === "vertical" ? (r(!0), o(b, { key: 4 }, p(h.value.end - h.value.start + 1, (t, s) => (r(), o("line", {
-          x1: n.value.left + g.value * s,
-          x2: n.value.left + g.value * s,
-          y1: n.value.top,
-          y2: n.value.bottom,
-          stroke: e.value.style.chart.grid.y.linesColor,
-          "stroke-width": e.value.style.chart.grid.y.linesThickness,
-          "stroke-dasharray": e.value.style.chart.grid.y.linesStrokeDasharray,
-          "stroke-linecap": "round"
-        }, null, 8, Ll))), 256)) : d("", !0),
-        e.value.style.chart.grid.y.showVerticalLines && e.value.orientation === "horizontal" ? (r(!0), o(b, { key: 5 }, p(N.value, (t, s) => (r(), o("line", {
-          x1: t.horizontal_x,
-          x2: t.horizontal_x,
-          y1: n.value.top,
-          y2: n.value.bottom,
-          stroke: e.value.style.chart.grid.y.linesColor,
-          "stroke-width": e.value.style.chart.grid.y.linesThickness,
-          "stroke-dasharray": e.value.style.chart.grid.y.linesStrokeDasharray,
-          "stroke-linecap": "round"
-        }, null, 8, zl))), 256)) : d("", !0),
-        (r(!0), o(b, null, p(w.value, (t, s) => (r(), o("g", null, [
-          a.$slots.pattern ? (r(), o("defs", Cl, [
-            L(a.$slots, "pattern", Ce({ ref_for: !0 }, { seriesIndex: t.absoluteIndex, patternId: `pattern_${M.value}_${t.absoluteIndex}` }), void 0, !0)
-          ])) : d("", !0),
-          e.value.orientation === "vertical" ? (r(), o(b, { key: 1 }, [
-            (r(!0), o(b, null, p(t.x, (c, u) => (r(), o("rect", {
-              x: c,
-              y: t.y[u] < 0 ? 0 : t.y[u],
-              height: t.height[u] < 0 ? 1e-4 : t.height[u] || 0,
-              rx: e.value.style.chart.bars.borderRadius > t.height[u] / 2 ? (t.height[u] < 0 ? 0 : t.height[u]) / 2 : e.value.style.chart.bars.borderRadius,
-              width: g.value * (1 - e.value.style.chart.bars.gapRatio / 2),
-              fill: e.value.style.chart.bars.gradient.show ? `url(#gradient_${t.id})` : t.color,
-              stroke: e.value.style.chart.backgroundColor,
-              "stroke-width": e.value.style.chart.bars.strokeWidth,
-              "stroke-linecap": "round",
-              "stroke-linejoin": "round",
-              class: le({ "vue-data-ui-bar-animated": e.value.useCssAnimation, "vue-data-ui-bar-transition": X.value })
-            }, null, 10, Sl))), 256)),
-            a.$slots.pattern ? (r(), o("g", _l, [
-              (r(!0), o(b, null, p(t.x, (c, u) => (r(), o("rect", {
-                x: c,
-                y: t.y[u] < 0 ? 0 : t.y[u],
-                height: t.height[u] < 0 ? 1e-4 : t.height[u] || 0,
-                rx: e.value.style.chart.bars.borderRadius > t.height[u] / 2 ? (t.height[u] < 0 ? 0 : t.height[u]) / 2 : e.value.style.chart.bars.borderRadius,
-                width: g.value * (1 - e.value.style.chart.bars.gapRatio / 2),
-                fill: `url(#pattern_${M.value}_${t.absoluteIndex})`,
-                stroke: e.value.style.chart.backgroundColor,
-                "stroke-width": e.value.style.chart.bars.strokeWidth,
-                "stroke-linecap": "round",
-                "stroke-linejoin": "round",
-                class: le({ "vue-data-ui-bar-animated": e.value.useCssAnimation, "vue-data-ui-bar-transition": X.value })
-              }, null, 10, $l))), 256))
-            ])) : d("", !0)
-          ], 64)) : (r(), o(b, { key: 2 }, [
-            (r(!0), o(b, null, p(t.horizontal_x, (c, u) => (r(), o("rect", {
-              x: v($e)(c, n.value.left),
-              y: t.horizontal_y[u] < 0 ? 0 : t.horizontal_y[u],
-              width: v($e)(t.horizontal_width[u] < 0 ? 1e-4 : t.horizontal_width[u]),
-              rx: e.value.style.chart.bars.borderRadius > t.height[u] / 2 ? (t.height[u] < 0 ? 0 : t.height[u]) / 2 : e.value.style.chart.bars.borderRadius,
-              height: g.value * (1 - e.value.style.chart.bars.gapRatio / 2),
-              fill: e.value.style.chart.bars.gradient.show ? `url(#gradient_${t.id})` : t.color,
-              stroke: e.value.style.chart.backgroundColor,
-              "stroke-width": e.value.style.chart.bars.strokeWidth,
-              "stroke-linecap": "round",
-              "stroke-linejoin": "round",
-              class: le({ "vue-data-ui-bar-animated": e.value.useCssAnimation, "vue-data-ui-bar-transition": X.value })
-            }, null, 10, Tl))), 256)),
-            a.$slots.pattern ? (r(), o("g", Ml, [
-              (r(!0), o(b, null, p(t.horizontal_x, (c, u) => (r(), o("rect", {
-                x: v($e)(c, n.value.left),
-                y: t.horizontal_y[u] < 0 ? 0 : t.horizontal_y[u],
-                width: v($e)(t.horizontal_width[u] < 0 ? 1e-4 : t.horizontal_width[u]),
-                rx: e.value.style.chart.bars.borderRadius > t.height[u] / 2 ? (t.height[u] < 0 ? 0 : t.height[u]) / 2 : e.value.style.chart.bars.borderRadius,
-                height: g.value * (1 - e.value.style.chart.bars.gapRatio / 2),
-                fill: `url(#pattern_${M.value}_${t.absoluteIndex})`,
-                stroke: e.value.style.chart.backgroundColor,
-                "stroke-width": e.value.style.chart.bars.strokeWidth,
-                "stroke-linecap": "round",
-                "stroke-linejoin": "round",
-                class: le({ "vue-data-ui-bar-animated": e.value.useCssAnimation, "vue-data-ui-bar-transition": X.value })
-              }, null, 10, Al))), 256))
-            ])) : d("", !0)
-          ], 64))
-        ]))), 256)),
-        e.value.style.chart.grid.x.showAxis ? (r(), o("line", {
-          key: 6,
-          x1: n.value.left,
-          x2: n.value.right,
-          y1: n.value.bottom,
-          y2: n.value.bottom,
-          stroke: e.value.style.chart.grid.x.axisColor,
-          "stroke-width": e.value.style.chart.grid.x.axisThickness,
-          "stroke-linecap": "round",
-          "stroke-linejoin": "round"
-        }, null, 8, Rl)) : d("", !0),
-        e.value.style.chart.grid.y.showAxis && !e.value.style.chart.bars.distributed ? (r(), o("line", {
-          key: 7,
-          x1: n.value.left,
-          x2: n.value.left,
-          y1: n.value.top,
-          y2: n.value.bottom,
-          stroke: e.value.style.chart.grid.y.axisColor,
-          "stroke-width": e.value.style.chart.grid.y.axisThickness,
-          "stroke-linecap": "round",
-          "stroke-linejoin": "round"
-        }, null, 8, Il)) : d("", !0),
-        e.value.style.chart.grid.x.axisName.show && e.value.style.chart.grid.x.axisName.text ? (r(), o("text", {
-          key: 8,
-          ref_key: "xAxisLabel",
-          ref: Pe,
-          x: n.value.left + n.value.width / 2,
-          y: n.value.chartHeight - 3,
-          "font-size": e.value.style.chart.grid.x.axisName.fontSize,
-          fill: e.value.style.chart.grid.x.axisName.color,
-          "font-weight": e.value.style.chart.grid.x.axisName.bold ? "bold" : "normal",
-          "text-anchor": "middle"
-        }, T(e.value.style.chart.grid.x.axisName.text), 9, Nl)) : d("", !0),
-        e.value.style.chart.grid.y.axisName.show && e.value.style.chart.grid.y.axisName.text ? (r(), o("text", {
-          key: 9,
-          ref_key: "yAxisLabel",
-          ref: Ve,
-          transform: `translate(${e.value.style.chart.grid.y.axisName.fontSize}, ${n.value.top + n.value.height / 2}) rotate(-90)`,
-          "font-size": e.value.style.chart.grid.y.axisName.fontSize,
-          fill: e.value.style.chart.grid.y.axisName.color,
-          "font-weight": e.value.style.chart.grid.y.axisName.bold ? "bold" : "normal",
-          "text-anchor": "middle"
-        }, T(e.value.style.chart.grid.y.axisName.text), 9, Ol)) : d("", !0),
-        z.value.dataLabels.show && e.value.orientation === "vertical" ? (r(), o(b, { key: 10 }, [
-          (r(!0), o(b, null, p(w.value, (t, s) => (r(), o("g", null, [
-            (r(!0), o(b, null, p(t.x, (c, u) => (r(), o(b, null, [
-              _t(t.series[u], t.proportions[u]) ? (r(), o("text", {
-                key: 0,
-                x: c + g.value * (1 - e.value.style.chart.bars.gapRatio / 2) / 2,
-                y: t.y[u] + t.height[u] / 2 + e.value.style.chart.bars.dataLabels.fontSize / 3,
-                "font-size": e.value.style.chart.bars.dataLabels.fontSize,
-                fill: e.value.style.chart.bars.dataLabels.adaptColorToBackground ? v(Wt)(t.color) : e.value.style.chart.bars.dataLabels.color,
-                "font-weight": e.value.style.chart.bars.dataLabels.bold ? "bold" : "normal",
-                "text-anchor": "middle"
-              }, T(e.value.style.chart.bars.showDistributedPercentage && e.value.style.chart.bars.distributed ? ft(t.proportions[u] * 100, t, s, u) : pe(t.series[u], t, s, u, t.signedSeries[u])), 9, Pl)) : d("", !0)
-            ], 64))), 256))
-          ]))), 256)),
-          e.value.style.chart.bars.totalValues.show && w.value.length > 1 ? (r(), o("g", {
-            key: 0,
-            ref_key: "sumTop",
-            ref: oa
-          }, [
-            (r(!0), o(b, null, p(bt.value, (t, s) => (r(), o(b, null, [
-              !e.value.style.chart.bars.dataLabels.hideEmptyValues || t.value !== 0 ? (r(), o("text", {
-                key: 0,
-                x: n.value.left + g.value * s + g.value / 2,
-                y: e.value.style.chart.bars.totalValues.fontSize,
-                "text-anchor": "middle",
-                "font-size": e.value.style.chart.bars.totalValues.fontSize,
-                "font-weight": e.value.style.chart.bars.totalValues.bold ? "bold" : "normal",
-                fill: e.value.style.chart.bars.totalValues.color
-              }, T(pe(t.value, t, s, t.sign)), 9, Vl)) : d("", !0)
-            ], 64))), 256))
-          ], 512)) : d("", !0)
-        ], 64)) : d("", !0),
-        z.value.dataLabels.show && e.value.orientation === "horizontal" ? (r(), o(b, { key: 11 }, [
-          (r(!0), o(b, null, p(w.value, (t, s) => (r(), o("g", null, [
-            (r(!0), o(b, null, p(t.horizontal_x, (c, u) => (r(), o(b, null, [
-              _t(t.series[u], t.proportions[u]) ? (r(), o("text", {
-                key: 0,
-                x: c + (t.horizontal_width[u] < 0 ? 1e-4 : t.horizontal_width[u]) / 2,
-                y: t.horizontal_y[u] + g.value * (1 - e.value.style.chart.bars.gapRatio / 2) / 2 + e.value.style.chart.bars.dataLabels.fontSize / 3,
-                "font-size": e.value.style.chart.bars.dataLabels.fontSize,
-                fill: e.value.style.chart.bars.dataLabels.adaptColorToBackground ? v(Wt)(t.color) : e.value.style.chart.bars.dataLabels.color,
-                "font-weight": e.value.style.chart.bars.dataLabels.bold ? "bold" : "normal",
-                "text-anchor": "middle"
-              }, T(e.value.style.chart.bars.showDistributedPercentage && e.value.style.chart.bars.distributed ? ft(t.proportions[u] * 100, t, s, u) : pe(t.series[u], t, s, u, t.signedSeries[u])), 9, Dl)) : d("", !0)
-            ], 64))), 256))
-          ]))), 256)),
-          e.value.style.chart.bars.totalValues.show && w.value.length > 1 ? (r(), o("g", {
-            key: 0,
-            ref_key: "sumRight",
-            ref: st
-          }, [
-            (r(!0), o(b, null, p(bt.value, (t, s) => (r(), o(b, null, [
-              !e.value.style.chart.bars.dataLabels.hideEmptyValues || t.value !== 0 ? (r(), o("text", {
-                key: 0,
-                x: n.value.right + e.value.style.chart.bars.totalValues.fontSize / 3,
-                y: n.value.top + g.value * s + g.value / 2,
-                "text-anchor": "start",
-                "font-size": e.value.style.chart.bars.totalValues.fontSize,
-                "font-weight": e.value.style.chart.bars.totalValues.bold ? "bold" : "normal",
-                fill: e.value.style.chart.bars.totalValues.color
-              }, T(pe(t.value, t, s, t.sign)), 9, El)) : d("", !0)
-            ], 64))), 256))
-          ], 512)) : d("", !0)
-        ], 64)) : d("", !0),
-        e.value.style.chart.grid.y.axisLabels.show && !e.value.style.chart.bars.distributed && e.value.orientation === "vertical" ? (r(), o("g", {
-          key: 12,
-          ref_key: "scaleLabels",
-          ref: G
-        }, [
-          (r(!0), o(b, null, p(N.value, (t, s) => (r(), o("line", {
-            x1: n.value.left,
-            x2: n.value.left - 6,
-            y1: t.y,
-            y2: t.y,
-            stroke: e.value.style.chart.grid.x.axisColor,
-            "stroke-width": 1
-          }, null, 8, Fl))), 256)),
-          (r(!0), o(b, null, p(N.value, (t, s) => (r(), o("text", {
-            x: t.x,
-            y: t.y + e.value.style.chart.grid.y.axisLabels.fontSize / 3,
-            "font-size": e.value.style.chart.grid.y.axisLabels.fontSize,
-            "font-weight": e.value.style.chart.grid.y.axisLabels.bold ? "bold" : "normal",
-            fill: e.value.style.chart.grid.y.axisLabels.color,
-            "text-anchor": "end"
-          }, T(v(Te)(
-            e.value.style.chart.grid.y.axisLabels.formatter,
-            t.value,
-            v(ee)({
-              p: e.value.style.chart.bars.dataLabels.prefix,
-              v: t.value,
-              s: e.value.style.chart.bars.dataLabels.suffix,
-              r: e.value.style.chart.grid.y.axisLabels.rounding
-            }),
-            { datapoint: t }
-          )), 9, Ul))), 256))
-        ], 512)) : d("", !0),
-        e.value.style.chart.grid.y.axisLabels.show && !e.value.style.chart.bars.distributed && e.value.orientation === "horizontal" ? (r(), o("g", {
-          key: 13,
-          ref_key: "scaleLabels",
-          ref: G
-        }, [
-          (r(!0), o(b, null, p(N.value, (t, s) => (r(), o("line", {
-            x1: t.horizontal_x,
-            x2: t.horizontal_x,
-            y1: n.value.bottom,
-            y2: n.value.bottom + 6,
-            stroke: e.value.style.chart.grid.x.axisColor,
-            "stroke-width": 1,
-            "stroke-linecap": "round"
-          }, null, 8, Hl))), 256)),
-          (r(!0), o(b, null, p(N.value, (t, s) => (r(), o("text", {
-            class: "vue-data-ui-time-label",
-            "font-size": e.value.style.chart.grid.x.timeLabels.fontSize,
-            "font-weight": e.value.style.chart.grid.y.axisLabels.bold ? "bold" : "normal",
-            fill: e.value.style.chart.grid.y.axisLabels.color,
-            "text-anchor": e.value.style.chart.grid.x.timeLabels.rotation > 0 ? "start" : e.value.style.chart.grid.x.timeLabels.rotation < 0 ? "end" : "middle",
-            transform: `translate(${t.horizontal_x}, ${n.value.bottom + e.value.style.chart.grid.x.timeLabels.fontSize * 1.3 + e.value.style.chart.grid.x.timeLabels.offsetY}), rotate(${e.value.style.chart.grid.x.timeLabels.rotation})`
-          }, T(v(Te)(
-            e.value.style.chart.grid.y.axisLabels.formatter,
-            t.value,
-            v(ee)({
-              p: e.value.style.chart.bars.dataLabels.prefix,
-              v: t.value,
-              s: e.value.style.chart.bars.dataLabels.suffix,
-              r: e.value.style.chart.grid.y.axisLabels.rounding
-            }),
-            { datapoint: t }
-          )), 9, Bl))), 256))
-        ], 512)) : d("", !0),
-        e.value.style.chart.grid.x.timeLabels.show && e.value.orientation === "vertical" ? (r(), o("g", {
-          key: 14,
-          ref_key: "timeLabelsEls",
-          ref: J
-        }, [
-          a.$slots["time-label"] ? (r(), o("g", Wl, [
-            (r(!0), o(b, null, p($.value, (t, s) => (r(), o("g", null, [
-              L(a.$slots, "time-label", Ce({ ref_for: !0 }, {
-                x: n.value.left + g.value * s + g.value / 2,
-                y: n.value.bottom + e.value.style.chart.grid.x.timeLabels.fontSize * 1.3 + e.value.style.chart.grid.x.timeLabels.offsetY,
-                fontSize: e.value.style.chart.grid.x.timeLabels.fontSize,
-                fill: e.value.style.chart.grid.x.timeLabels.color,
-                transform: `translate(${n.value.left + g.value * s + g.value / 2}, ${n.value.bottom + e.value.style.chart.grid.x.timeLabels.fontSize * 1.3 + e.value.style.chart.grid.x.timeLabels.offsetY}), rotate(${e.value.style.chart.grid.x.timeLabels.rotation})`,
-                absoluteIndex: t.absoluteIndex,
-                content: t.text,
-                textAnchor: e.value.style.chart.grid.x.timeLabels.rotation > 0 ? "start" : e.value.style.chart.grid.x.timeLabels.rotation < 0 ? "end" : "middle",
-                show: !0
-              }), void 0, !0)
-            ]))), 256))
-          ])) : (r(), o("g", Yl, [
-            (r(!0), o(b, null, p($.value, (t, s) => (r(), o("g", null, [
-              String(t.text).includes(`
-`) ? (r(), o("text", {
-                key: s + "-multi",
-                "text-anchor": e.value.style.chart.grid.x.timeLabels.rotation > 0 ? "start" : e.value.style.chart.grid.x.timeLabels.rotation < 0 ? "end" : "middle",
-                "font-size": e.value.style.chart.grid.x.timeLabels.fontSize,
-                fill: e.value.style.chart.grid.x.timeLabels.color,
-                transform: `
-                                    translate(
-                                    ${n.value.left + g.value * s + g.value / 2},
-                                    ${n.value.bottom + e.value.style.chart.grid.x.timeLabels.fontSize * 1.3 + e.value.style.chart.grid.x.timeLabels.offsetY}
-                                    ),
-                                    rotate(${e.value.style.chart.grid.x.timeLabels.rotation})
-                                `,
-                style: { cursor: "pointer" },
-                innerHTML: v(Ya)({
-                  content: String(t.text),
-                  fontSize: e.value.style.chart.grid.x.timeLabels.fontSize,
-                  fill: e.value.style.chart.grid.x.timeLabels.color,
-                  x: 0,
-                  y: 0
-                }),
-                onClick: () => we(t, s)
-              }, null, 8, Gl)) : (r(), o("text", {
-                class: "vue-data-ui-time-label",
-                key: s,
-                "text-anchor": e.value.style.chart.grid.x.timeLabels.rotation > 0 ? "start" : e.value.style.chart.grid.x.timeLabels.rotation < 0 ? "end" : "middle",
-                "font-size": e.value.style.chart.grid.x.timeLabels.fontSize,
-                "font-weight": e.value.style.chart.grid.x.timeLabels.bold ? "bold" : "normal",
-                fill: e.value.style.chart.grid.x.timeLabels.color,
-                transform: `translate(${n.value.left + g.value * s + g.value / 2}, ${n.value.bottom + e.value.style.chart.grid.x.timeLabels.fontSize * 1.3 + e.value.style.chart.grid.x.timeLabels.offsetY}), rotate(${e.value.style.chart.grid.x.timeLabels.rotation})`,
-                style: { cursor: "pointer" },
-                onClick: () => we(t, s)
-              }, T(t.text), 9, Xl))
-            ]))), 256))
-          ]))
-        ], 512)) : d("", !0),
-        e.value.style.chart.grid.x.timeLabels.show && e.value.orientation === "horizontal" ? (r(), o("g", {
-          key: 15,
-          ref_key: "timeLabelsEls",
-          ref: J
-        }, [
-          a.$slots["time-label"] ? (r(), o("g", Jl, [
-            (r(!0), o(b, null, p($.value, (t, s) => (r(), o("g", null, [
-              L(a.$slots, "time-label", Ce({ ref_for: !0 }, {
-                x: n.value.left - 8,
-                y: n.value.top + g.value * s + g.value / 2 + e.value.style.chart.grid.y.axisLabels.fontSize / 3,
-                fontSize: e.value.style.chart.grid.x.timeLabels.fontSize,
-                fill: e.value.style.chart.grid.x.timeLabels.color,
-                transform: null,
-                absoluteIndex: t.absoluteIndex,
-                content: t.text,
-                textAnchor: "end",
-                show: !0
-              }), void 0, !0)
-            ]))), 256))
-          ])) : (r(), o("g", ql, [
-            (r(!0), o(b, null, p($.value, (t, s) => (r(), o("g", null, [
-              String(t.text).includes(`
-`) ? (r(), o("text", {
-                key: 1,
-                "text-anchor": "end",
-                "font-size": e.value.style.chart.grid.y.axisLabels.fontSize,
-                "font-weight": e.value.style.chart.grid.y.axisLabels.bold ? "bold" : "normal",
-                fill: e.value.style.chart.grid.y.axisLabels.color,
-                x: n.value.left - 8,
-                y: n.value.top + g.value * s + g.value / 2 + e.value.style.chart.grid.y.axisLabels.fontSize / 3,
-                style: { cursor: "pointer" },
-                onClick: () => we(t, s),
-                innerHTML: v(Xa)({
-                  content: String(t.text),
-                  fontSize: e.value.style.chart.grid.y.axisLabels.fontSize,
-                  fill: e.value.style.chart.grid.y.axisLabels.color,
-                  x: n.value.left - 8,
-                  y: 0
-                })
-              }, null, 8, Kl)) : (r(), o("text", {
-                key: 0,
-                "text-anchor": "end",
-                "font-size": e.value.style.chart.grid.y.axisLabels.fontSize,
-                "font-weight": e.value.style.chart.grid.y.axisLabels.bold ? "bold" : "normal",
-                fill: e.value.style.chart.grid.y.axisLabels.color,
-                x: n.value.left - 8,
-                y: n.value.top + g.value * s + g.value / 2 + e.value.style.chart.grid.y.axisLabels.fontSize / 3,
-                style: {
-                  cursor: "pointer"
-                },
-                onClick: () => we(t, s)
-              }, T(t.text), 9, Zl))
-            ]))), 256))
-          ]))
-        ], 512)) : d("", !0),
-        z.value.showTooltip && e.value.orientation === "vertical" ? (r(!0), o(b, { key: 16 }, p(h.value.end - h.value.start, (t, s) => (r(), o("rect", {
-          x: n.value.left + s * g.value,
-          y: n.value.top,
-          width: g.value,
-          height: n.value.height < 0 ? 0 : n.value.height,
-          onClick: () => mt(s),
-          onMouseenter: () => kt(s),
-          onMouseleave: () => xt(s),
-          fill: s === de.value ? e.value.style.chart.highlighter.color : "transparent",
-          style: j({ opacity: e.value.style.chart.highlighter.opacity / 100 })
-        }, null, 44, Ql))), 256)) : d("", !0),
-        z.value.showTooltip && e.value.orientation === "horizontal" ? (r(!0), o(b, { key: 17 }, p(h.value.end - h.value.start, (t, s) => (r(), o("rect", {
-          x: n.value.left,
-          y: n.value.top + s * g.value,
-          width: n.value.width < 0 ? 0 : n.value.width,
-          height: g.value,
-          onClick: () => mt(s),
-          onMouseenter: () => kt(s),
-          onMouseleave: () => xt(s),
-          fill: s === de.value ? e.value.style.chart.highlighter.color : "transparent",
-          style: j({ opacity: e.value.style.chart.highlighter.opacity / 100 })
-        }, null, 44, jl))), 256)) : d("", !0),
-        L(a.$slots, "svg", W(Y({ ...n.value })), void 0, !0)
-      ], 14, gl)),
-      a.$slots.watermark ? (r(), o("div", es, [
-        L(a.$slots, "watermark", W(Y({ isPrinting: v(ut) || v(ct) })), void 0, !0)
-      ])) : d("", !0),
-      D("div", {
-        ref_key: "chartSlicer",
-        ref: Qe,
-        style: j(`width:100%;background:${e.value.style.chart.backgroundColor}`),
-        "data-dom-to-png-ignore": ""
-      }, [
-        e.value.style.chart.zoom.show && U.value > 1 ? (r(), B(cl, {
-          ref_key: "slicerComponent",
-          ref: at,
-          key: `slicer_${et.value}`,
-          background: e.value.style.chart.zoom.color,
-          borderColor: e.value.style.chart.backgroundColor,
-          fontSize: e.value.style.chart.zoom.fontSize,
-          useResetSlot: e.value.style.chart.zoom.useResetSlot,
-          labelLeft: e.value.style.chart.grid.x.timeLabels.values[h.value.start] ? $.value[0].text : "",
-          labelRight: e.value.style.chart.grid.x.timeLabels.values[h.value.end - 1] ? $.value.at(-1).text : "",
-          textColor: e.value.style.chart.color,
-          inputColor: e.value.style.chart.zoom.color,
-          selectColor: e.value.style.chart.zoom.highlightColor,
-          max: Math.max(...Me.dataset.map((t) => t.series.length)),
-          min: 0,
-          valueStart: h.value.start,
-          valueEnd: h.value.end,
-          start: h.value.start,
-          "onUpdate:start": l[0] || (l[0] = (t) => h.value.start = t),
-          end: h.value.end,
-          "onUpdate:end": l[1] || (l[1] = (t) => h.value.end = t),
-          refreshStartPoint: e.value.style.chart.zoom.startIndex !== null ? e.value.style.chart.zoom.startIndex : 0,
-          refreshEndPoint: e.value.style.chart.zoom.endIndex !== null ? e.value.style.chart.zoom.endIndex + 1 : Math.max(...Me.dataset.map((t) => t.series.length)),
-          enableRangeHandles: e.value.style.chart.zoom.enableRangeHandles,
-          enableSelectionDrag: e.value.style.chart.zoom.enableSelectionDrag,
-          focusOnDrag: e.value.style.chart.zoom.focusOnDrag,
-          focusRangeRatio: e.value.style.chart.zoom.focusRangeRatio,
-          onReset: yt
-        }, {
-          "reset-action": C(({ reset: t }) => [
-            L(a.$slots, "reset-action", W(Y({ reset: t })), void 0, !0)
-          ]),
-          _: 3
-        }, 8, ["background", "borderColor", "fontSize", "useResetSlot", "labelLeft", "labelRight", "textColor", "inputColor", "selectColor", "max", "valueStart", "valueEnd", "start", "end", "refreshStartPoint", "refreshEndPoint", "enableRangeHandles", "enableSelectionDrag", "focusOnDrag", "focusRangeRatio"])) : d("", !0)
-      ], 4),
-      he(v(Jt), {
-        show: z.value.showTooltip && Re.value,
-        backgroundColor: e.value.style.chart.tooltip.backgroundColor,
-        color: e.value.style.chart.tooltip.color,
-        fontSize: e.value.style.chart.tooltip.fontSize,
-        borderRadius: e.value.style.chart.tooltip.borderRadius,
-        borderColor: e.value.style.chart.tooltip.borderColor,
-        borderWidth: e.value.style.chart.tooltip.borderWidth,
-        backgroundOpacity: e.value.style.chart.tooltip.backgroundOpacity,
-        position: e.value.style.chart.tooltip.position,
-        offsetY: e.value.style.chart.tooltip.offsetY,
-        parent: O.value,
-        content: Ne.value,
-        isFullscreen: re.value,
-        isCustom: v(Yt)(e.value.style.chart.tooltip.customFormat),
-        smooth: e.value.style.chart.tooltip.smooth,
-        backdropFilter: e.value.style.chart.tooltip.backdropFilter,
-        smoothForce: e.value.style.chart.tooltip.smoothForce,
-        smoothSnapThreshold: e.value.style.chart.tooltip.smoothSnapThreshold
-      }, {
-        "tooltip-before": C(() => [
-          L(a.$slots, "tooltip-before", W(Y({ ...Ie.value })), void 0, !0)
-        ]),
-        "tooltip-after": C(() => [
-          L(a.$slots, "tooltip-after", W(Y({ ...Ie.value })), void 0, !0)
-        ]),
-        _: 3
-      }, 8, ["show", "backgroundColor", "color", "fontSize", "borderRadius", "borderColor", "borderWidth", "backgroundOpacity", "position", "offsetY", "parent", "content", "isFullscreen", "isCustom", "smooth", "backdropFilter", "smoothForce", "smoothSnapThreshold"]),
-      D("div", {
-        id: `legend-bottom-${M.value}`
-      }, null, 8, ts),
-      lt.value ? (r(), B(Oa, {
-        key: 4,
-        to: e.value.style.chart.legend.position === "top" ? `#legend-top-${M.value}` : `#legend-bottom-${M.value}`
-      }, [
-        D("div", {
-          ref_key: "chartLegend",
-          ref: Ke
-        }, [
-          e.value.style.chart.legend.show ? (r(), B(ul, {
-            key: 0,
-            legendSet: Ye.value,
-            config: fa.value,
-            onClickMarker: l[2] || (l[2] = ({ legend: t }) => t.segregate())
-          }, Ge({
-            item: C(({ legend: t }) => [
-              v(ne) ? d("", !0) : (r(), o("div", {
-                key: 0,
-                onClick: (s) => t.segregate(),
-                style: j(`opacity:${_.value.includes(t.id) ? 0.5 : 1}`)
-              }, T(t.name), 13, as))
-            ]),
-            _: 2
-          }, [
-            a.$slots.pattern ? {
-              name: "legend-pattern",
-              fn: C(({ legend: t, index: s }) => [
-                he(nl, {
-                  shape: t.shape,
-                  radius: 30,
-                  stroke: "none",
-                  plot: { x: 30, y: 30 },
-                  fill: `url(#pattern_${M.value}_${s})`
-                }, null, 8, ["shape", "fill"])
-              ]),
-              key: "0"
-            } : void 0
-          ]), 1032, ["legendSet", "config"])) : L(a.$slots, "legend", {
-            key: 1,
-            legend: Ye.value
-          }, void 0, !0)
-        ], 512)
-      ], 8, ["to"])) : d("", !0),
-      a.$slots.source ? (r(), o("div", {
-        key: 5,
-        ref_key: "source",
-        ref: je,
-        dir: "auto"
-      }, [
-        L(a.$slots, "source", {}, void 0, !0)
-      ], 512)) : d("", !0),
-      ve.value && e.value.userOptions.buttons.table ? (r(), B(Pa(ue.value.component), Ce({ key: 6 }, ue.value.props, {
-        ref_key: "tableUnit",
-        ref: oe,
-        onClose: $t
-      }), Ge({
-        content: C(() => [
-          he(v(Kt), {
-            colNames: xe.value.colNames,
-            head: xe.value.head,
-            body: xe.value.body,
-            config: xe.value.config,
-            title: e.value.table.useDialog ? "" : ue.value.title,
-            withCloseButton: !e.value.table.useDialog,
-            onClose: $t
-          }, {
-            th: C(({ th: t }) => [
-              D("div", { innerHTML: t }, null, 8, ls)
-            ]),
-            td: C(({ td: t }) => [
-              Vt(T(isNaN(Number(t)) ? t : v(ee)({
-                p: e.value.style.chart.bars.dataLabels.prefix,
-                v: t,
-                s: e.value.style.chart.bars.dataLabels.suffix,
-                r: e.value.table.td.roundingValue
-              })), 1)
-            ]),
-            _: 1
-          }, 8, ["colNames", "head", "body", "config", "title", "withCloseButton"])
-        ]),
-        _: 2
-      }, [
-        e.value.table.useDialog ? {
-          name: "title",
-          fn: C(() => [
-            Vt(T(ue.value.title), 1)
-          ]),
-          key: "0"
-        } : void 0,
-        e.value.table.useDialog ? {
-          name: "actions",
-          fn: C(() => [
-            D("button", {
-              tabindex: "0",
-              class: "vue-ui-user-options-button",
-              onClick: l[3] || (l[3] = (t) => We(e.value.userOptions.callbacks.csv))
-            }, [
-              he(v(qt), {
-                name: "excel",
-                stroke: ue.value.props.color
-              }, null, 8, ["stroke"])
-            ])
-          ]),
-          key: "1"
-        } : void 0
-      ]), 1040)) : d("", !0),
-      v(ne) ? (r(), B(ja, { key: 7 })) : d("", !0)
-    ], 46, vl));
-  }
-}, Ls = /* @__PURE__ */ hl(ss, [["__scopeId", "data-v-7beeea3c"]]);
-export {
-  Ls as default
-};