vue-data-ui 2.16.6 → 2.17.1

package/dist/{vue-ui-quick-chart-DB9RKUkb.js → vue-ui-quick-chart-BRlYC_yT.js}

@@ -1,140 +1,141 @@
-import { defineAsyncComponent as ce, ref as z, computed as U, watch as Ve, shallowRef as ht, onMounted as Ot, onBeforeUnmount as Tt, nextTick as Me, createElementBlock as l, openBlock as a, normalizeStyle as R, normalizeClass as he, createBlock as Fe, createCommentVNode as g, createVNode as fe, unref as f, createSlots as Pt, withCtx as G, renderSlot as M, normalizeProps as ne, guardReactiveProps as ie, toDisplayString as O, createElementVNode as _, Fragment as m, renderList as $, mergeProps as qe } from "vue";
-import { u as Rt, c as Mt, t as Ft, p as q, a as Nt, C as ft, b as Ut, G as Bt, e as Dt, d as He, m as Vt, D as gt, X as qt, j as Ht, k as We, n as Le, i as X, f as D, I as Wt, V as mt, v as Z, x as Ne, y as je } from "./index-DvIXJm6t.js";
-import { t as jt, u as Gt } from "./useResponsive-DfdjqQps.js";
-import { u as pt } from "./useNestedProp-DrYHm61t.js";
-import { u as Xt } from "./usePrinter-CWnXbGMb.js";
-import { u as Zt } from "./useChartAccessibility-9icAAmYg.js";
-import { S as Yt } from "./Slicer-BrqtJG2E.js";
-import { u as Jt } from "./useTimeLabels-Mrr0jrpL.js";
-import { _ as Qt } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+import { defineAsyncComponent as he, ref as z, computed as U, watch as Ve, shallowRef as ft, onMounted as Tt, onBeforeUnmount as Pt, nextTick as Me, createElementBlock as l, openBlock as a, normalizeStyle as R, normalizeClass as fe, createBlock as Fe, createCommentVNode as g, createVNode as ge, unref as f, createSlots as Rt, withCtx as G, renderSlot as M, normalizeProps as ie, guardReactiveProps as ue, toDisplayString as O, createElementVNode as _, Fragment as m, renderList as $, mergeProps as qe } from "vue";
+import { u as Mt, c as Ft, t as Nt, p as q, a as Ut, C as gt, b as Bt, G as Dt, e as Vt, d as He, m as qt, D as mt, X as Ht, j as Wt, k as We, n as Le, i as X, f as D, I as jt, V as pt, v as Z, x as Ne, y as je } from "./index-CobsZUkv.js";
+import { t as Gt, u as Xt } from "./useResponsive-DfdjqQps.js";
+import { u as yt } from "./useNestedProp-BwL5wmVa.js";
+import { u as Zt } from "./usePrinter-DPh6U_Qk.js";
+import { u as Yt } from "./useChartAccessibility-9icAAmYg.js";
+import { S as Jt } from "./Slicer-CpSu7plp.js";
+import { u as Qt } from "./useTimeLabels-Mrr0jrpL.js";
+import Kt from "./img-utitT2Gd.js";
+import { _ as ea } from "./_plugin-vue_export-helper-CHgC5LLL.js";
 const A = {
   LINE: "LINE",
   BAR: "BAR",
   DONUT: "DONUT"
-}, Kt = ["SERIE", "SERIES", "DATA", "VALUE", "VALUES", "NUM"];
-function ea({ dataset: c, barLineSwitch: C = 6 }) {
-  let x = null, T = null, H = 0;
-  if ((typeof c == "number" || typeof c == "string") && console.warn(`The provided dataset (${c}) is not sufficient to build a chart`), ze(c) && (Y(c) && (c.length < C ? x = A.BAR : x = A.LINE, T = c, H = c.length), Ue(c))) {
-    if (!aa(c))
+}, ta = ["SERIE", "SERIES", "DATA", "VALUE", "VALUES", "NUM"];
+function aa({ dataset: c, barLineSwitch: C = 6 }) {
+  let y = null, T = null, H = 0;
+  if ((typeof c == "number" || typeof c == "string") && console.warn(`The provided dataset (${c}) is not sufficient to build a chart`), ze(c) && (Y(c) && (c.length < C ? y = A.BAR : y = A.LINE, T = c, H = c.length), Ue(c))) {
+    if (!oa(c))
       return console.warn("The objects in the dataset array have a different data structure. Either keys or value types are different."), !1;
-    const pe = Object.keys(c[0]), $e = Object.values(c[0]);
-    if (!pe.some((F) => la(F)))
+    const ye = Object.keys(c[0]), $e = Object.values(c[0]);
+    if (!ye.some((F) => na(F)))
       return console.warn("The data type of the dataset objects in the array must contain one of the following keys: DATA, SERIES, VALUE, VALUES, NUM. Casing is not important."), !1;
-    xt($e, (F) => typeof F == "number") && (x = A.DONUT, T = c), xt($e, (F) => Array.isArray(F) && Y(F)) && (yt(c) > C ? x = A.LINE : x = A.BAR, H = yt(c), T = c.map((F) => ({
+    xt($e, (F) => typeof F == "number") && (y = A.DONUT, T = c), xt($e, (F) => Array.isArray(F) && Y(F)) && (kt(c) > C ? y = A.LINE : y = A.BAR, H = kt(c), T = c.map((F) => ({
       ...F,
-      data: oa(F, (B) => Y(B))
-    }))), c = c.map((F) => kt(F)), T = T.map((F) => kt(F));
+      data: ia(F, (B) => Y(B))
+    }))), c = c.map((F) => bt(F)), T = T.map((F) => bt(F));
   }
-  return ze(c) && [...new Set(c.flatMap((pe) => Array.isArray(pe)))][0], {
+  return ze(c) && [...new Set(c.flatMap((ye) => Array.isArray(ye)))][0], {
     dataset: c,
-    type: x,
+    type: y,
     usableDataset: T,
     maxSeriesLength: H
   };
 }
-function bt(c) {
+function St(c) {
   return !c || ze(c) && !c.length;
 }
 function ze(c) {
   return Array.isArray(c);
 }
 function Y(c) {
-  if (!ze(c) || bt(c)) return !1;
-  const C = c.map((x) => Number(x));
-  return ![...new Set(C.flatMap((x) => typeof x == "number" && !isNaN(x)))].includes(!1);
+  if (!ze(c) || St(c)) return !1;
+  const C = c.map((y) => Number(y));
+  return ![...new Set(C.flatMap((y) => typeof y == "number" && !isNaN(y)))].includes(!1);
 }
 function Ue(c) {
-  return !ze(c) || bt(c) || !![...new Set(c.flatMap((x) => typeof x == "object" && !Array.isArray(x)))].includes(!1) ? !1 : !c.map((x) => Object.keys(x).length > 0).includes(!1);
+  return !ze(c) || St(c) || !![...new Set(c.flatMap((y) => typeof y == "object" && !Array.isArray(y)))].includes(!1) ? !1 : !c.map((y) => Object.keys(y).length > 0).includes(!1);
 }
-function ta(c, C) {
-  const x = Object.keys(c).sort(), T = Object.keys(C).sort();
-  if (x.length !== T.length)
+function la(c, C) {
+  const y = Object.keys(c).sort(), T = Object.keys(C).sort();
+  if (y.length !== T.length)
     return !1;
-  for (let H = 0; H < x.length; H += 1) {
-    const ge = x[H], me = T[H];
-    if (ge !== me || typeof c[ge] != typeof C[me])
+  for (let H = 0; H < y.length; H += 1) {
+    const me = y[H], pe = T[H];
+    if (me !== pe || typeof c[me] != typeof C[pe])
       return !1;
   }
   return !0;
 }
-function aa(c) {
+function oa(c) {
   if (c.length <= 1) return !0;
   for (let C = 0; C < c.length; C += 1)
-    for (let x = C + 1; x < c.length; x += 1)
-      if (!ta(c[C], c[x]))
+    for (let y = C + 1; y < c.length; y += 1)
+      if (!la(c[C], c[y]))
         return !1;
   return !0;
 }
-function la(c) {
-  return Kt.includes(c.toUpperCase());
+function na(c) {
+  return ta.includes(c.toUpperCase());
 }
 function xt(c, C) {
-  let x = [];
+  let y = [];
   for (let T = 0; T < c.length; T += 1)
-    x.push(C(c[T]));
-  return x.includes(!0);
+    y.push(C(c[T]));
+  return y.includes(!0);
 }
-function yt(c) {
-  return Math.max(...[...c].flatMap((C) => Object.values(C).filter((x) => Y(x)).map((x) => x.length)));
+function kt(c) {
+  return Math.max(...[...c].flatMap((C) => Object.values(C).filter((y) => Y(y)).map((y) => y.length)));
 }
-function oa(c, C) {
-  return Object.values(c).filter((x) => C(x))[0];
+function ia(c, C) {
+  return Object.values(c).filter((y) => C(y))[0];
 }
-function kt(c) {
+function bt(c) {
   const C = {};
-  for (let x in c)
-    c.hasOwnProperty(x) && (C[x.toUpperCase()] = c[x]);
+  for (let y in c)
+    c.hasOwnProperty(y) && (C[y.toUpperCase()] = c[y]);
   return C;
 }
-const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"], ra = ["x", "y", "width", "height"], sa = ["width", "height"], va = ["id"], da = ["id"], ca = ["id"], ha = ["flood-color"], fa = {
+const ua = ["id"], ra = ["xmlns", "viewBox"], sa = ["x", "y", "width", "height"], va = ["x", "y", "width", "height"], da = ["width", "height"], ca = ["id"], ha = ["id"], fa = ["id"], ga = ["flood-color"], ma = {
   key: 0,
   class: "donut-label-connectors"
-}, ga = ["d", "stroke", "stroke-width", "filter"], ma = ["cx", "cy", "r", "fill", "filter"], pa = { class: "donut" }, xa = ["d", "fill", "stroke", "stroke-width", "filter"], ya = ["d", "onMouseenter", "onClick"], ka = {
+}, pa = ["d", "stroke", "stroke-width", "filter"], ya = ["cx", "cy", "r", "fill", "filter"], xa = { class: "donut" }, ka = ["d", "fill", "stroke", "stroke-width", "filter"], ba = ["d", "onMouseenter", "onClick"], Sa = {
   key: 1,
   class: "donut-labels quick-animation"
-}, ba = ["cx", "cy", "fill", "stroke", "filter"], Sa = ["text-anchor", "x", "y", "fill", "font-size", "filter"], wa = ["text-anchor", "x", "y", "fill", "font-size", "filter"], Aa = {
+}, wa = ["cx", "cy", "fill", "stroke", "filter"], Aa = ["text-anchor", "x", "y", "fill", "font-size", "filter"], _a = ["text-anchor", "x", "y", "fill", "font-size", "filter"], La = {
   key: 2,
   class: "donut-hollow quick-animation"
-}, _a = ["x", "y", "font-size", "fill"], La = ["x", "y", "font-size", "fill"], za = {
+}, za = ["x", "y", "font-size", "fill"], $a = ["x", "y", "font-size", "fill"], Ca = {
   key: 0,
   class: "line-grid"
-}, $a = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Ca = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Ia = {
+}, Ia = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Ea = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Oa = {
   key: 1,
   class: "line-axis"
-}, Ea = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Oa = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Ta = {
+}, Ta = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Pa = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Ra = {
   key: 2,
   class: "yLabels"
-}, Pa = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Ra = ["x", "y", "font-size", "fill"], Ma = {
+}, Ma = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Fa = ["x", "y", "font-size", "fill"], Na = {
   key: 3,
   class: "periodLabels"
-}, Fa = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Na = { key: 1 }, Ua = ["font-size", "text-anchor", "fill", "transform"], Ba = ["font-size", "text-anchor", "fill", "transform", "innerHTML"], Da = { class: "plots" }, Va = { class: "line-plot-series" }, qa = ["d", "stroke", "stroke-width"], Ha = ["d", "stroke", "stroke-width"], Wa = ["d", "stroke", "stroke-width"], ja = ["d", "stroke", "stroke-width"], Ga = ["cx", "cy", "fill", "stroke"], Xa = {
+}, Ua = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], Ba = { key: 1 }, Da = ["font-size", "text-anchor", "fill", "transform"], Va = ["font-size", "text-anchor", "fill", "transform", "innerHTML"], qa = { class: "plots" }, Ha = { class: "line-plot-series" }, Wa = ["d", "stroke", "stroke-width"], ja = ["d", "stroke", "stroke-width"], Ga = ["d", "stroke", "stroke-width"], Xa = ["d", "stroke", "stroke-width"], Za = ["cx", "cy", "fill", "stroke"], Ya = {
   key: 4,
   class: "dataLabels"
-}, Za = ["font-size", "fill", "x", "y"], Ya = { class: "tooltip-traps" }, Ja = ["x", "y", "height", "width", "fill", "onMouseenter", "onClick"], Qa = {
+}, Ja = ["font-size", "fill", "x", "y"], Qa = { class: "tooltip-traps" }, Ka = ["x", "y", "height", "width", "fill", "onMouseenter", "onClick"], el = {
   key: 0,
   class: "line-grid"
-}, Ka = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], el = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], tl = {
+}, tl = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], al = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], ll = {
   key: 1,
   class: "line-axis"
-}, al = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], ll = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], ol = {
+}, ol = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], nl = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], il = {
   key: 2,
   class: "yLabels"
-}, nl = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], il = ["x", "y", "font-size", "fill"], ul = {
+}, ul = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], rl = ["x", "y", "font-size", "fill"], sl = {
   key: 3,
   class: "periodLabels"
-}, rl = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], sl = ["font-size", "text-anchor", "transform", "fill"], vl = { class: "plots" }, dl = ["x", "width", "height", "y", "fill", "stroke", "stroke-width"], cl = ["to"], hl = ["from", "to"], fl = {
+}, vl = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], dl = ["font-size", "text-anchor", "transform", "fill"], cl = { class: "plots" }, hl = ["x", "width", "height", "y", "fill", "stroke", "stroke-width"], fl = ["to"], gl = ["from", "to"], ml = {
   key: 4,
   class: "dataLabels"
-}, gl = ["x", "y", "font-size", "fill"], ml = { class: "tooltip-traps" }, pl = ["x", "y", "height", "width", "fill", "onMouseenter", "onClick"], xl = {
+}, pl = ["x", "y", "font-size", "fill"], yl = { class: "tooltip-traps" }, xl = ["x", "y", "height", "width", "fill", "onMouseenter", "onClick"], kl = {
   key: 6,
   class: "axis-labels"
-}, yl = { key: 0 }, kl = ["font-size", "fill", "x", "y"], bl = { key: 1 }, Sl = ["font-size", "fill", "x", "y"], wl = { key: 2 }, Al = ["font-size", "fill", "transform"], _l = { key: 3 }, Ll = ["font-size", "fill", "transform"], zl = {
+}, bl = { key: 0 }, Sl = ["font-size", "fill", "x", "y"], wl = { key: 1 }, Al = ["font-size", "fill", "x", "y"], _l = { key: 2 }, Ll = ["font-size", "fill", "transform"], zl = { key: 3 }, $l = ["font-size", "fill", "transform"], Cl = {
   key: 6,
   class: "vue-data-ui-watermark"
-}, $l = ["onClick"], Cl = ["onClick"], Il = ["onClick"], El = {
+}, Il = ["onClick"], El = ["onClick"], Ol = ["onClick"], Tl = {
   key: 1,
   class: "vue-ui-quick-chart-not-processable"
-}, Ol = {
+}, Pl = {
   __name: "vue-ui-quick-chart",
   props: {
     config: {
@@ -151,35 +152,35 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
     }
   },
   emits: ["selectDatapoint", "selectLegend"],
-  setup(c, { expose: C, emit: x }) {
-    const T = ce(() => import("./BaseIcon-Bn996RXm.js")), H = ce(() => import("./PackageVersion-Bg_9KCU-.js")), ge = ce(() => import("./PenAndPaper-BPTpbnay.js")), me = ce(() => import("./vue-ui-skeleton-BAOt2neL.js")), pe = ce(() => import("./Tooltip-CJxVw7-T.js")), $e = ce(() => import("./UserOptions-CBEK6_jo.js")), { vue_ui_quick_chart: F } = Rt(), B = c, xe = z(null), Ge = z(null), Xe = z(null), Ze = z(null), J = z(Mt()), ee = z(!1), ye = z(null), te = z(""), W = z(null), Ye = z(null), Je = z(null), w = z([]), Qe = z(0), Ce = z(0), e = U({
+  setup(c, { expose: C, emit: y }) {
+    const T = he(() => import("./BaseIcon-D9Tz8ARD.js")), H = he(() => import("./PackageVersion-C-4Ee8BQ.js")), me = he(() => import("./PenAndPaper-Cde-wJ3N.js")), pe = he(() => import("./vue-ui-skeleton-8s4xts8z.js")), ye = he(() => import("./Tooltip-DA0bYKFG.js")), $e = he(() => import("./UserOptions-DTEJ3UM_.js")), { vue_ui_quick_chart: F } = Mt(), B = c, J = z(null), Ge = z(null), Xe = z(null), Ze = z(null), Q = z(Ft()), te = z(!1), xe = z(null), ae = z(""), W = z(null), Ye = z(null), Je = z(null), w = z([]), Qe = z(0), Ce = z(0), e = U({
       get: () => at(),
       set: (o) => o
-    }), { svgRef: Ke } = Zt({ config: { text: e.value.title } }), St = U(() => e.value.showUserOptionsOnChartHover), et = U(() => e.value.keepUserOptionsStateOnChartLeave), Ie = z(!e.value.showUserOptionsOnChartHover);
+    }), { svgRef: Ke } = Yt({ config: { text: e.value.title } }), wt = U(() => e.value.showUserOptionsOnChartHover), et = U(() => e.value.keepUserOptionsStateOnChartLeave), Ie = z(!e.value.showUserOptionsOnChartHover);
     function tt(o = !1) {
-      St.value && (Ie.value = o);
+      wt.value && (Ie.value = o);
     }
     function at() {
-      const o = pt({
+      const o = yt({
         userConfig: B.config,
         defaultConfig: F
       });
       let s = {};
       return o.theme ? s = {
-        ...pt({
-          userConfig: Nt.vue_ui_quick_chart[o.theme] || B.config,
+        ...yt({
+          userConfig: Ut.vue_ui_quick_chart[o.theme] || B.config,
           defaultConfig: o
         }),
-        customPalette: Ft[o.theme] || q
-      } : s = o, B.config && ft(B.config, "zoomStartIndex") ? s.zoomStartIndex = B.config.zoomStartIndex : s.zoomStartIndex = null, B.config && ft(B.config, "zoomEndIndex") ? s.zoomEndIndex = B.config.zoomEndIndex : s.zoomEndIndex = null, s;
+        customPalette: Nt[o.theme] || q
+      } : s = o, B.config && gt(B.config, "zoomStartIndex") ? s.zoomStartIndex = B.config.zoomStartIndex : s.zoomStartIndex = null, B.config && gt(B.config, "zoomEndIndex") ? s.zoomEndIndex = B.config.zoomEndIndex : s.zoomEndIndex = null, s;
     }
     Ve(() => B.config, (o) => {
       e.value = at(), b.value.width = e.value.width, b.value.height = e.value.height, Ie.value = !e.value.showUserOptionsOnChartHover, nt(), Se.value.showTooltip = e.value.showTooltip;
     }, { deep: !0 }), Ve(() => B.dataset, (o) => {
-      p.value = be.value, y.value.start = 0, y.value.end = p.value.maxSeriesLength, Ce.value += 1;
+      p.value = be.value, x.value.start = 0, x.value.end = p.value.maxSeriesLength, Ce.value += 1;
     }, { deep: !0 });
-    const ke = U(() => Ut(e.value.customPalette)), ue = x, be = U(() => {
-      const o = ea({ dataset: Bt(B.dataset, [
+    const ke = U(() => Bt(e.value.customPalette)), re = y, be = U(() => {
+      const o = aa({ dataset: Dt(B.dataset, [
         "serie",
         "series",
         "data",
@@ -188,31 +189,31 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
         "num"
       ]), barLineSwitch: e.value.chartIsBarUnderDatasetLength });
       return o || console.error("VueUiQuickChart : Dataset is not processable"), o;
-    }), p = z(be.value), wt = U(() => !!p.value), L = U(() => p.value ? p.value.type : null);
+    }), p = z(be.value), At = U(() => !!p.value), L = U(() => p.value ? p.value.type : null);
     Ve(() => L.value, (o) => {
-      o || Dt({
+      o || Vt({
         componentName: "VueUiQuickChart",
         type: "dataset"
       });
     }, { immediate: !0 });
-    const { isPrinting: Ee, isImaging: Oe, generatePdf: lt, generateImage: ot } = Xt({
-      elementId: `${L.value}_${J.value}`,
+    const { isPrinting: Ee, isImaging: Oe, generatePdf: lt, generateImage: ot } = Zt({
+      elementId: `${L.value}_${Q.value}`,
       fileName: e.value.title || L.value,
       options: e.value.userOptionsPrint
-    }), At = U(() => e.value.showUserOptions && !e.value.title), b = z({
+    }), _t = U(() => e.value.showUserOptions && !e.value.title), b = z({
       width: e.value.width,
       height: e.value.height
     }), Se = z({
       showTooltip: e.value.showTooltip
-    }), Q = ht(null), re = ht(null);
-    Ot(() => {
+    }), K = ft(null), se = ft(null);
+    Tt(() => {
       nt();
     });
     function nt() {
       if (e.value.responsive) {
-        const o = jt(() => {
-          const { width: s, height: t } = Gt({
-            chart: xe.value,
+        const o = Gt(() => {
+          const { width: s, height: t } = Xt({
+            chart: J.value,
             title: e.value.title ? Ge.value : null,
             legend: e.value.showLegend ? Xe.value : null,
             slicer: [A.BAR, A.LINE].includes(L.value) && e.value.zoomXy && p.value.maxSeriesLength > 1 ? Ze.value : null,
@@ -223,14 +224,14 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
             b.value.width = s, b.value.height = t;
           });
         });
-        Q.value && (re.value && Q.value.unobserve(re.value), Q.value.disconnect()), Q.value = new ResizeObserver(o), re.value = xe.value.parentNode, Q.value.observe(re.value);
+        K.value && (se.value && K.value.unobserve(se.value), K.value.disconnect()), K.value = new ResizeObserver(o), se.value = J.value.parentNode, K.value.observe(se.value);
       }
       dt();
     }
-    Tt(() => {
-      Q.value && (re.value && Q.value.unobserve(re.value), Q.value.disconnect());
+    Pt(() => {
+      K.value && (se.value && K.value.unobserve(se.value), K.value.disconnect());
     });
-    const _t = U(() => {
+    const Lt = U(() => {
       switch (L.value) {
         case A.LINE:
           return `0 0 ${b.value.width <= 0 ? 10 : b.value.width} ${b.value.height <= 0 ? 10 : b.value.height}`;
@@ -246,13 +247,13 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
       return [...o].map((s) => s.value).reduce((s, t) => s + t, 0);
     }
     function we(o) {
-      return e.value.blurOnHover && ![null, void 0].includes(W.value) && W.value !== o ? `url(#blur_${J.value})` : "";
+      return e.value.blurOnHover && ![null, void 0].includes(W.value) && W.value !== o ? `url(#blur_${Q.value})` : "";
     }
     function ut(o, s) {
       w.value.includes(o) ? w.value = w.value.filter((t) => t !== o) : w.value.length < s && w.value.push(o);
     }
     const rt = z(null), st = z(null), Te = z(!1);
-    function Lt(o, s) {
+    function zt(o, s) {
       Te.value = !0;
       let t = o.value;
       const u = be.value.dataset.find((r, h) => o.id === `donut_${h}`).VALUE;
@@ -297,7 +298,7 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
       }
     }
     const j = z(null);
-    function zt(o) {
+    function $t(o) {
       j.value = o;
     }
     const vt = U(() => e.value.donutThicknessRatio < 0.15 ? 0.15 : e.value.donutThicknessRatio > 0.4 ? 0.4 : e.value.donutThicknessRatio), I = U(() => {
@@ -327,7 +328,7 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
         return Math.abs(String(Number(S.toFixed(0))).length - String(Number(i.toFixed(0))).length);
       }
       function r({ datapoint: n, seriesIndex: i }) {
-        ye.value = { datapoint: n, seriesIndex: i, config: e.value, dataset: o }, W.value = n.id;
+        xe.value = { datapoint: n, seriesIndex: i, config: e.value, dataset: o }, W.value = n.id;
         const S = e.value.tooltipCustomFormat;
         if (Ne(S) && je(() => S({
           datapoint: n,
@@ -335,7 +336,7 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
           series: o,
           config: e.value
         })))
-          te.value = S({
+          ae.value = S({
             datapoint: n,
             seriesIndex: i,
             series: o,
@@ -353,25 +354,25 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
               r: e.value.dataLabelRoundingValue
             }),
             { datapoint: n, seriesIndex: i }
-          )}</b>`, k += `<span>(${D({ v: n.proportion * 100, s: "%", r: e.value.dataLabelRoundingPercentage })})</span></div>`, te.value = `<div>${k}</div>`;
+          )}</b>`, k += `<span>(${D({ v: n.proportion * 100, s: "%", r: e.value.dataLabelRoundingPercentage })})</span></div>`, ae.value = `<div>${k}</div>`;
         }
-        ee.value = !0;
+        te.value = !0;
       }
       function h() {
-        ee.value = !1, W.value = null, j.value = null;
+        te.value = !1, W.value = null, j.value = null;
       }
       const P = {
         centerX: b.value.width / 2,
         centerY: b.value.height / 2
-      }, V = o.filter((n) => !w.value.includes(n.id)).map((n) => n.value || 0).reduce((n, i) => n + i, 0), ve = o.map((n, i) => ({
+      }, V = o.filter((n) => !w.value.includes(n.id)).map((n) => n.value || 0).reduce((n, i) => n + i, 0), de = o.map((n, i) => ({
         ...n,
         proportion: (n.value || 0) / V,
         value: n.value || 0,
         absoluteValue: be.value.dataset.find((S, k) => `donut_${k}` === n.id).VALUE
-      })), ae = b.value.width / 2, de = b.value.height / 2, le = b.value.height * e.value.donutRadiusRatio;
+      })), le = b.value.width / 2, ce = b.value.height / 2, oe = b.value.height * e.value.donutRadiusRatio;
       return {
-        dataset: ve.filter((n) => !w.value.includes(n.id)),
-        legend: ve,
+        dataset: de.filter((n) => !w.value.includes(n.id)),
+        legend: de,
         drawingArea: P,
         displayArcPercentage: s,
         isArcBigEnough: t,
@@ -379,15 +380,15 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
         killTooltip: h,
         getSpaces: u,
         total: V,
-        cx: ae,
-        cy: de,
-        radius: le,
-        chart: Vt(
+        cx: le,
+        cy: ce,
+        radius: oe,
+        chart: qt(
           { series: o.filter((n) => !w.value.includes(n.id)) },
-          ae,
-          de,
-          le,
           le,
+          ce,
+          oe,
+          oe,
           1.99999,
           2,
           1,
@@ -396,25 +397,25 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
           b.value.height * vt.value
         )
       };
-    }), y = z({
+    }), x = z({
       start: 0,
       end: p.value.maxSeriesLength
     });
-    function $t() {
+    function Ct() {
       dt();
     }
-    const se = z(null);
+    const ve = z(null);
     async function dt() {
-      (e.value.zoomStartIndex !== null || e.value.zoomEndIndex !== null) && se.value ? (e.value.zoomStartIndex !== null && (await Me(), await Me(), se.value && se.value.setStartValue(e.value.zoomStartIndex)), e.value.zoomEndIndex !== null && (await Me(), await Me(), se.value && se.value.setEndValue(Ct(e.value.zoomEndIndex + 1)))) : (y.value = {
+      (e.value.zoomStartIndex !== null || e.value.zoomEndIndex !== null) && ve.value ? (e.value.zoomStartIndex !== null && (await Me(), await Me(), ve.value && ve.value.setStartValue(e.value.zoomStartIndex)), e.value.zoomEndIndex !== null && (await Me(), await Me(), ve.value && ve.value.setEndValue(It(e.value.zoomEndIndex + 1)))) : (x.value = {
         start: 0,
         end: p.value.maxSeriesLength
       }, Ce.value += 1);
     }
-    function Ct(o) {
+    function It(o) {
       const s = p.value.maxSeriesLength;
       return o > s ? s : o < 0 || e.value.zoomStartIndex !== null && o < e.value.zoomStartIndex ? e.value.zoomStartIndex !== null ? e.value.zoomStartIndex + 1 : 1 : o;
     }
-    const It = U(() => {
+    const Et = U(() => {
       if (!e.value.zoomMinimap.show || L.value === A.DONUT) return [];
       let o = [];
       Y(p.value.dataset) && (o = p.value.dataset), Ue(p.value.dataset) && (o = p.value.dataset.map((r, h) => ({
@@ -446,8 +447,8 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
       let t = [];
       Y(p.value.dataset) && (t = [
         {
-          values: p.value.dataset.slice(y.value.start, y.value.end),
-          absoluteIndices: p.value.dataset.map((n, i) => i).slice(y.value.start, y.value.end),
+          values: p.value.dataset.slice(x.value.start, x.value.end),
+          absoluteIndices: p.value.dataset.map((n, i) => i).slice(x.value.start, x.value.end),
           name: e.value.title,
           color: ke.value[e.value.paletteStartIndex] || q[e.value.paletteStartIndex],
           id: "line_0"
@@ -460,18 +461,18 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
       })).map((n, i) => ({
         ...n,
         color: n.COLOR ? He(n.COLOR) : ke.value[i + e.value.paletteStartIndex] || q[i + e.value.paletteStartIndex] || q[(i + e.value.paletteStartIndex) % q.length],
-        values: n.values.slice(y.value.start, y.value.end),
-        absoluteIndices: n.values.map((S, k) => k).slice(y.value.start, y.value.end)
+        values: n.values.slice(x.value.start, x.value.end),
+        absoluteIndices: n.values.map((S, k) => k).slice(x.value.start, x.value.end)
       })));
       const u = {
         max: Math.max(...t.filter((n) => !w.value.includes(n.id)).flatMap((n) => n.values)),
         min: Math.min(...t.filter((n) => !w.value.includes(n.id)).flatMap((n) => n.values)),
         maxSeries: Math.max(...t.map((n) => n.values.length))
-      }, r = gt(u.min < 0 ? u.min : 0, u.max < 0 ? 0 : u.max, e.value.xyScaleSegments), h = u.min < 0 ? Math.abs(u.min) : 0, P = u.max < 0 ? s.top : s.bottom - h / (r.max + h) * s.height, V = s.width / u.maxSeries, ve = r.ticks.map((n) => ({
+      }, r = mt(u.min < 0 ? u.min : 0, u.max < 0 ? 0 : u.max, e.value.xyScaleSegments), h = u.min < 0 ? Math.abs(u.min) : 0, P = u.max < 0 ? s.top : s.bottom - h / (r.max + h) * s.height, V = s.width / u.maxSeries, de = r.ticks.map((n) => ({
         y: s.bottom - s.height * ((n + h) / (r.max + h)),
         x: s.left - 8,
         value: n
-      })), ae = t.map((n, i) => ({
+      })), le = t.map((n, i) => ({
         ...n,
         coordinates: n.values.map((S, k) => ({
           x: s.left + V * (k + 1) - V / 2,
@@ -487,14 +488,14 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
           linePath: i.join(" ")
         };
       });
-      function de(n) {
+      function ce(n) {
         W.value = n, j.value = n;
         const i = t.map((k) => ({
           ...k,
           value: k.values[n],
           absoluteIndex: k.absoluteIndices[n]
         })).filter((k) => !w.value.includes(k.id));
-        ye.value = { datapoint: i, seriesIndex: n, config: e.value, dataset: t };
+        xe.value = { datapoint: i, seriesIndex: n, config: e.value, dataset: t };
         const S = e.value.tooltipCustomFormat;
         if (Ne(S) && je(() => S({
           datapoint: i,
@@ -502,7 +503,7 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
           series: t,
           config: e.value
         })))
-          te.value = S({
+          ae.value = S({
             datapoint: i,
             seriesIndex: n,
             series: t,
@@ -510,7 +511,7 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
           });
         else {
           let k = "";
-          K.value[i[0].absoluteIndex] && (k += `<div style="border-bottom:1px solid ${e.value.tooltipBorderColor};padding-bottom:6px;margin-bottom:3px;">${K.value[i[0].absoluteIndex].text}</div>`), i.forEach((E, N) => {
+          ee.value[i[0].absoluteIndex] && (k += `<div style="border-bottom:1px solid ${e.value.tooltipBorderColor};padding-bottom:6px;margin-bottom:3px;">${ee.value[i[0].absoluteIndex].text}</div>`), i.forEach((E, N) => {
             k += `
                     <div style="display:flex; flex-wrap: wrap; align-items:center; gap:3px;">
                         <svg viewBox="0 0 12 12" height="14" width="12"><circle cx="6" cy="6" r="6" stroke="none" fill="${E.color}"/></svg>
@@ -529,23 +530,23 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
                         </b>
                     </div>
                 `;
-          }), te.value = k;
+          }), ae.value = k;
         }
-        ee.value = !0;
+        te.value = !0;
       }
-      function le() {
-        W.value = null, j.value = null, ee.value = !1;
+      function oe() {
+        W.value = null, j.value = null, te.value = !1;
       }
       return {
         absoluteZero: P,
-        dataset: ae.filter((n) => !w.value.includes(n.id)),
-        legend: ae,
+        dataset: le.filter((n) => !w.value.includes(n.id)),
+        legend: le,
         drawingArea: s,
         extremes: u,
         slotSize: V,
-        yLabels: ve,
-        useTooltip: de,
-        killTooltip: le
+        yLabels: de,
+        useTooltip: ce,
+        killTooltip: oe
       };
     }), d = U(() => {
       if (L.value !== A.BAR) return null;
@@ -563,8 +564,8 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
       let t = [];
       Y(p.value.dataset) && (t = [
         {
-          values: p.value.dataset.slice(y.value.start, y.value.end),
-          absoluteIndices: p.value.dataset.map((i, S) => S).slice(y.value.start, y.value.end),
+          values: p.value.dataset.slice(x.value.start, x.value.end),
+          absoluteIndices: p.value.dataset.map((i, S) => S).slice(x.value.start, x.value.end),
           name: e.value.title,
           color: ke.value[e.value.paletteStartIndex] || q[e.value.paletteStartIndex],
           id: "bar_0"
@@ -577,21 +578,21 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
       })).map((i, S) => ({
         ...i,
         color: i.COLOR ? He(i.COLOR) : ke.value[S + e.value.paletteStartIndex] || q[S + e.value.paletteStartIndex] || q[(S + e.value.paletteStartIndex) % q.length],
-        values: i.values.slice(y.value.start, y.value.end),
-        absoluteIndices: i.values.map((k, E) => E).slice(y.value.start, y.value.end)
+        values: i.values.slice(x.value.start, x.value.end),
+        absoluteIndices: i.values.map((k, E) => E).slice(x.value.start, x.value.end)
       })));
       const u = {
         max: Math.max(...t.filter((i) => !w.value.includes(i.id)).flatMap((i) => i.values)) < 0 ? 0 : Math.max(...t.filter((i) => !w.value.includes(i.id)).flatMap((i) => i.values)),
         min: Math.min(...t.filter((i) => !w.value.includes(i.id)).flatMap((i) => i.values)),
         maxSeries: Math.max(...t.filter((i) => !w.value.includes(i.id)).map((i) => i.values.length))
-      }, r = gt(u.min < 0 ? u.min : 0, u.max, e.value.xyScaleSegments), h = r.min < 0 ? Math.abs(r.min) : 0, P = s.bottom - h / (r.max + h) * s.height, V = s.width / u.maxSeries, ve = r.ticks.map((i) => ({
+      }, r = mt(u.min < 0 ? u.min : 0, u.max, e.value.xyScaleSegments), h = r.min < 0 ? Math.abs(r.min) : 0, P = s.bottom - h / (r.max + h) * s.height, V = s.width / u.maxSeries, de = r.ticks.map((i) => ({
         y: s.bottom - s.height * ((i + h) / (r.max + h)),
         x: s.left - 8,
         value: i
-      })), ae = t.map((i, S) => ({
+      })), le = t.map((i, S) => ({
         ...i,
         coordinates: i.values.map((k, E) => {
-          const N = (k + h) / (u.max + h) * s.height, Ae = Math.abs(k) / Math.abs(u.min) * (s.height - P), De = h / (u.max + h) * s.height, _e = V / t.filter((oe) => !w.value.includes(oe.id)).length - e.value.barGap / t.filter((oe) => !w.value.includes(oe.id)).length;
+          const N = (k + h) / (u.max + h) * s.height, Ae = Math.abs(k) / Math.abs(u.min) * (s.height - P), De = h / (u.max + h) * s.height, _e = V / t.filter((ne) => !w.value.includes(ne.id)).length - e.value.barGap / t.filter((ne) => !w.value.includes(ne.id)).length;
           return {
             x: s.left + V * E + _e * S + e.value.barGap / 2,
             y: k > 0 ? s.bottom - N : P,
@@ -600,10 +601,10 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
             width: _e
           };
         })
-      })), de = t.filter((i) => !w.value.includes(i.id)).map((i, S) => ({
+      })), ce = t.filter((i) => !w.value.includes(i.id)).map((i, S) => ({
         ...i,
         coordinates: i.values.map((k, E) => {
-          const N = (k + h) / (u.max + h) * s.height, Ae = Math.abs(k) / (u.max + h) * s.height, De = h / (u.max + h) * s.height, _e = V / t.filter((oe) => !w.value.includes(oe.id)).length - e.value.barGap / t.filter((oe) => !w.value.includes(oe.id)).length;
+          const N = (k + h) / (u.max + h) * s.height, Ae = Math.abs(k) / (u.max + h) * s.height, De = h / (u.max + h) * s.height, _e = V / t.filter((ne) => !w.value.includes(ne.id)).length - e.value.barGap / t.filter((ne) => !w.value.includes(ne.id)).length;
           return {
             x: s.left + V * E + _e * S + e.value.barGap / 2,
             y: k > 0 ? s.bottom - N : P,
@@ -613,14 +614,14 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
           };
         })
       }));
-      function le(i) {
+      function oe(i) {
         W.value = i, j.value = i;
         const S = t.map((E) => ({
           ...E,
           value: E.values[i],
           absoluteIndex: E.absoluteIndices[i]
         })).filter((E) => !w.value.includes(E.id));
-        ye.value = { datapoint: S, seriesIndex: i, config: e.value, dataset: t };
+        xe.value = { datapoint: S, seriesIndex: i, config: e.value, dataset: t };
         const k = e.value.tooltipCustomFormat;
         if (Ne(k) && je(() => k({
           datapoint: S,
@@ -628,7 +629,7 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
           series: t,
           config: e.value
         })))
-          te.value = k({
+          ae.value = k({
             point: S,
             seriesIndex: i,
             series: t,
@@ -636,7 +637,7 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
           });
         else {
           let E = "";
-          K.value[S[0].absoluteIndex] && (E += `<div style="border-bottom:1px solid ${e.value.tooltipBorderColor};padding-bottom:6px;margin-bottom:3px;">${K.value[S[0].absoluteIndex].text}</div>`), S.forEach((N, Ae) => {
+          ee.value[S[0].absoluteIndex] && (E += `<div style="border-bottom:1px solid ${e.value.tooltipBorderColor};padding-bottom:6px;margin-bottom:3px;">${ee.value[S[0].absoluteIndex].text}</div>`), S.forEach((N, Ae) => {
             E += `
                     <div style="display:flex; flex-wrap: wrap; align-items:center; gap:3px;">
                         <svg viewBox="0 0 12 12" height="14" width="12"><rect x=0 y="0" width="12" height="12" rx="1" stroke="none" fill="${N.color}"/></svg>
@@ -655,57 +656,71 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
                         </b>
                     </div>
                 `;
-          }), te.value = E;
+          }), ae.value = E;
         }
-        ee.value = !0;
+        te.value = !0;
       }
       function n() {
-        ee.value = !1, W.value = null, j.value = null;
+        te.value = !1, W.value = null, j.value = null;
       }
       return {
         absoluteZero: P,
-        dataset: de.filter((i) => !w.value.includes(i.id)),
-        legend: ae,
+        dataset: ce.filter((i) => !w.value.includes(i.id)),
+        legend: le,
         drawingArea: s,
         extremes: u,
         slotSize: V,
-        yLabels: ve,
-        useTooltip: le,
+        yLabels: de,
+        useTooltip: oe,
         killTooltip: n
       };
-    }), K = U(() => Jt({
+    }), ee = U(() => Qt({
       values: e.value.xyPeriods,
       maxDatapoints: p.value.maxSeriesLength,
       formatter: e.value.datetimeFormatter,
-      start: y.value.start,
-      end: y.value.end
+      start: x.value.start,
+      end: x.value.end
     })), Pe = z(!1);
-    function Et(o) {
+    function ct(o) {
       Pe.value = o, Qe.value += 1;
     }
-    function ct() {
+    function ht() {
       Se.value.showTooltip = !Se.value.showTooltip;
     }
     const Re = z(!1);
     function Be() {
       Re.value = !Re.value;
     }
+    async function Ot({ scale: o = 2 } = {}) {
+      if (!J.value) return;
+      const { width: s, height: t } = J.value.getBoundingClientRect(), u = s / t, { imageUri: r, base64: h } = await Kt({ domElement: J.value, base64: !0, img: !0, scale: o });
+      return {
+        imageUri: r,
+        base64: h,
+        title: e.value.title,
+        width: s,
+        height: t,
+        aspectRatio: u
+      };
+    }
     return C({
+      getImage: Ot,
       generatePdf: lt,
       generateImage: ot,
-      toggleTooltip: ct,
-      toggleAnnotator: Be
-    }), (o, s) => wt.value ? (a(), l("div", {
+      toggleTooltip: ht,
+      toggleAnnotator: Be,
+      toggleFullscreen: ct
+    }), (o, s) => At.value ? (a(), l("div", {
       key: 0,
-      id: `${L.value}_${J.value}`,
+      id: `${L.value}_${Q.value}`,
       ref_key: "quickChart",
-      ref: xe,
-      class: he({ "vue-ui-quick-chart": !0, "vue-data-ui-wrapper-fullscreen": Pe.value }),
+      ref: J,
+      class: fe({ "vue-ui-quick-chart": !0, "vue-data-ui-wrapper-fullscreen": Pe.value }),
       style: R(`background:${e.value.backgroundColor};color:${e.value.color};font-family:${e.value.fontFamily}; position: relative; ${e.value.responsive ? "height: 100%" : ""}`),
       onMouseenter: s[5] || (s[5] = () => tt(!0)),
       onMouseleave: s[6] || (s[6] = () => tt(!1))
     }, [
-      e.value.userOptionsButtons.annotator ? (a(), Fe(f(ge), {
+      e.value.userOptionsButtons.annotator ? (a(), Fe(f(me), {
         key: 0,
         svgRef: f(Ke),
         backgroundColor: e.value.backgroundColor,
@@ -713,7 +728,7 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
         active: Re.value,
         onClose: Be
       }, null, 8, ["svgRef", "backgroundColor", "color", "active"])) : g("", !0),
-      At.value ? (a(), l("div", {
+      _t.value ? (a(), l("div", {
         key: 1,
         ref_key: "noTitle",
         ref: Je,
@@ -727,7 +742,7 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
         color: e.value.color,
         isPrinting: f(Ee),
         isImaging: f(Oe),
-        uid: J.value,
+        uid: Q.value,
         hasTooltip: e.value.userOptionsButtons.tooltip && e.value.showTooltip,
         hasPdf: e.value.userOptionsButtons.pdf,
         hasImg: e.value.userOptionsButtons.img,
@@ -736,25 +751,25 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
         isTooltip: Se.value.showTooltip,
         isFullscreen: Pe.value,
         titles: { ...e.value.userOptionsButtonTitles },
-        chartElement: xe.value,
+        chartElement: J.value,
         position: e.value.userOptionsPosition,
         hasAnnotator: e.value.userOptionsButtons.annotator,
         isAnnotation: Re.value,
         callbacks: e.value.userOptionsCallbacks,
         printScale: e.value.userOptionsPrint.scale,
-        onToggleFullscreen: Et,
+        onToggleFullscreen: ct,
         onGeneratePdf: f(lt),
         onGenerateImage: f(ot),
-        onToggleTooltip: ct,
+        onToggleTooltip: ht,
         onToggleAnnotator: Be,
         style: R({
           visibility: et.value ? Ie.value ? "visible" : "hidden" : "visible"
         })
-      }, Pt({ _: 2 }, [
+      }, Rt({ _: 2 }, [
         o.$slots.menuIcon ? {
           name: "menuIcon",
           fn: G(({ isOpen: t, color: u }) => [
-            M(o.$slots, "menuIcon", ne(ie({ isOpen: t, color: u })), void 0, !0)
+            M(o.$slots, "menuIcon", ie(ue({ isOpen: t, color: u })), void 0, !0)
           ]),
           key: "0"
         } : void 0,
@@ -782,14 +797,14 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
         o.$slots.optionFullscreen ? {
           name: "optionFullscreen",
           fn: G(({ toggleFullscreen: t, isFullscreen: u }) => [
-            M(o.$slots, "optionFullscreen", ne(ie({ toggleFullscreen: t, isFullscreen: u })), void 0, !0)
+            M(o.$slots, "optionFullscreen", ie(ue({ toggleFullscreen: t, isFullscreen: u })), void 0, !0)
           ]),
           key: "4"
         } : void 0,
         o.$slots.optionAnnotator ? {
           name: "optionAnnotator",
           fn: G(({ toggleAnnotator: t, isAnnotator: u }) => [
-            M(o.$slots, "optionAnnotator", ne(ie({ toggleAnnotator: t, isAnnotator: u })), void 0, !0)
+            M(o.$slots, "optionAnnotator", ie(ue({ toggleAnnotator: t, isAnnotator: u })), void 0, !0)
           ]),
           key: "5"
         } : void 0
@@ -805,11 +820,11 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
         key: 4,
         ref_key: "svgRef",
         ref: Ke,
-        xmlns: f(qt),
-        viewBox: _t.value,
+        xmlns: f(Ht),
+        viewBox: Lt.value,
         style: R(`max-width:100%;overflow:visible;background:transparent;color:${e.value.color}`)
       }, [
-        fe(f(H)),
+        ge(f(H)),
         o.$slots["chart-background"] && L.value === A.BAR ? (a(), l("foreignObject", {
           key: 0,
           x: d.value.drawingArea.left,
@@ -821,7 +836,7 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
           }
         }, [
           M(o.$slots, "chart-background", {}, void 0, !0)
-        ], 8, ua)) : g("", !0),
+        ], 8, sa)) : g("", !0),
         o.$slots["chart-background"] && L.value === A.LINE ? (a(), l("foreignObject", {
           key: 1,
           x: v.value.drawingArea.left,
@@ -833,7 +848,7 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
           }
         }, [
           M(o.$slots, "chart-background", {}, void 0, !0)
-        ], 8, ra)) : g("", !0),
+        ], 8, va)) : g("", !0),
         o.$slots["chart-background"] && L.value === A.DONUT ? (a(), l("foreignObject", {
           key: 2,
           x: 0,
@@ -845,10 +860,10 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
           }
         }, [
           M(o.$slots, "chart-background", {}, void 0, !0)
-        ], 8, sa)) : g("", !0),
+        ], 8, da)) : g("", !0),
         _("defs", null, [
           _("filter", {
-            id: `blur_${J.value}`,
+            id: `blur_${Q.value}`,
             x: "-50%",
             y: "-50%",
             width: "200%",
@@ -857,15 +872,15 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
             _("feGaussianBlur", {
               in: "SourceGraphic",
               stdDeviation: 2,
-              id: `blur_std_${J.value}`
-            }, null, 8, da),
+              id: `blur_std_${Q.value}`
+            }, null, 8, ha),
             s[7] || (s[7] = _("feColorMatrix", {
               type: "saturate",
               values: "0"
             }, null, -1))
-          ], 8, va),
+          ], 8, ca),
           _("filter", {
-            id: `shadow_${J.value}`,
+            id: `shadow_${Q.value}`,
             "color-interpolation-filters": "sRGB"
           }, [
             _("feDropShadow", {
@@ -874,22 +889,22 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
               stdDeviation: "10",
               "flood-opacity": "0.5",
               "flood-color": e.value.donutShadowColor
-            }, null, 8, ha)
-          ], 8, ca)
+            }, null, 8, ga)
+          ], 8, fa)
         ]),
         L.value === A.DONUT ? (a(), l(m, { key: 3 }, [
-          e.value.showDataLabels ? (a(), l("g", fa, [
+          e.value.showDataLabels ? (a(), l("g", ma, [
             (a(!0), l(m, null, $(I.value.chart, (t, u) => (a(), l(m, null, [
               I.value.isArcBigEnough(t) ? (a(), l("path", {
                 key: 0,
-                d: f(Ht)(t, { x: b.value.width / 2, y: b.value.height / 2 }, 16, 16, !1, !1, b.value.height * vt.value),
+                d: f(Wt)(t, { x: b.value.width / 2, y: b.value.height / 2 }, 16, 16, !1, !1, b.value.height * vt.value),
                 stroke: t.color,
                 "stroke-width": e.value.donutLabelMarkerStrokeWidth,
                 "stroke-linecap": "round",
                 "stroke-linejoin": "round",
                 fill: "none",
                 filter: we(t.id)
-              }, null, 8, ga)) : g("", !0)
+              }, null, 8, pa)) : g("", !0)
             ], 64))), 256))
           ])) : g("", !0),
           _("circle", {
@@ -897,25 +912,25 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
             cy: I.value.cy,
             r: I.value.radius,
             fill: e.value.backgroundColor,
-            filter: e.value.donutUseShadow ? `url(#shadow_${J.value})` : ""
-          }, null, 8, ma),
-          _("g", pa, [
+            filter: e.value.donutUseShadow ? `url(#shadow_${Q.value})` : ""
+          }, null, 8, ya),
+          _("g", xa, [
             (a(!0), l(m, null, $(I.value.chart, (t, u) => (a(), l("path", {
               d: t.arcSlice,
               fill: t.color,
               stroke: e.value.backgroundColor,
               "stroke-width": e.value.donutStrokeWidth,
               filter: we(t.id)
-            }, null, 8, xa))), 256)),
+            }, null, 8, ka))), 256)),
             (a(!0), l(m, null, $(I.value.chart, (t, u) => (a(), l("path", {
               d: t.arcSlice,
               fill: "transparent",
               onMouseenter: (r) => I.value.useTooltip({ datapoint: t, seriesIndex: u }),
               onMouseout: s[0] || (s[0] = (r) => I.value.killTooltip()),
-              onClick: (r) => ue("selectDatapoint", t)
-            }, null, 40, ya))), 256))
+              onClick: (r) => re("selectDatapoint", t)
+            }, null, 40, ba))), 256))
           ]),
-          e.value.showDataLabels ? (a(), l("g", ka, [
+          e.value.showDataLabels ? (a(), l("g", Sa, [
             (a(!0), l(m, null, $(I.value.chart, (t, u) => (a(), l(m, null, [
               I.value.isArcBigEnough(t) ? (a(), l("circle", {
                 key: 0,
@@ -926,7 +941,7 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
                 "stroke-width": 1,
                 r: 3,
                 filter: we(t.id)
-              }, null, 8, ba)) : g("", !0),
+              }, null, 8, wa)) : g("", !0),
               I.value.isArcBigEnough(t) ? (a(), l("text", {
                 key: 1,
                 "text-anchor": f(Le)(t, !0, 20).anchor,
@@ -945,7 +960,7 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
                   r: e.value.dataLabelRoundingValue
                 }),
                 { datapoint: t, seriesIndex: u }
-              )) + ") ", 9, Sa)) : g("", !0),
+              )) + ") ", 9, Aa)) : g("", !0),
               I.value.isArcBigEnough(t, !0, 20) ? (a(), l("text", {
                 key: 2,
                 "text-anchor": f(Le)(t).anchor,
@@ -954,17 +969,17 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
                 fill: e.value.color,
                 "font-size": e.value.dataLabelFontSize,
                 filter: we(t.id)
-              }, O(t.name), 9, wa)) : g("", !0)
+              }, O(t.name), 9, _a)) : g("", !0)
             ], 64))), 256))
           ])) : g("", !0),
-          e.value.donutShowTotal ? (a(), l("g", Aa, [
+          e.value.donutShowTotal ? (a(), l("g", La, [
             _("text", {
               "text-anchor": "middle",
               x: I.value.drawingArea.centerX,
               y: I.value.drawingArea.centerY - e.value.donutTotalLabelFontSize / 2,
               "font-size": e.value.donutTotalLabelFontSize,
               fill: e.value.color
-            }, O(e.value.donutTotalLabelText), 9, _a),
+            }, O(e.value.donutTotalLabelText), 9, za),
             _("text", {
               "text-anchor": "middle",
               x: I.value.drawingArea.centerX,
@@ -976,11 +991,11 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
               v: I.value.total,
               s: e.value.valueSuffix,
               r: e.value.dataLabelRoundingValue
-            })), 9, La)
+            })), 9, $a)
           ])) : g("", !0)
         ], 64)) : g("", !0),
         L.value === A.LINE ? (a(), l(m, { key: 4 }, [
-          e.value.xyShowGrid ? (a(), l("g", za, [
+          e.value.xyShowGrid ? (a(), l("g", Ca, [
             (a(!0), l(m, null, $(v.value.yLabels, (t) => (a(), l(m, null, [
               t.y <= v.value.drawingArea.bottom ? (a(), l("line", {
                 key: 0,
@@ -991,7 +1006,7 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
                 stroke: e.value.xyGridStroke,
                 "stroke-width": e.value.xyGridStrokeWidth,
                 "stroke-linecap": "round"
-              }, null, 8, $a)) : g("", !0)
+              }, null, 8, Ia)) : g("", !0)
             ], 64))), 256)),
             (a(!0), l(m, null, $(v.value.extremes.maxSeries + 1, (t, u) => (a(), l("line", {
               x1: v.value.drawingArea.left + v.value.slotSize * u,
@@ -1001,9 +1016,9 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
               stroke: e.value.xyGridStroke,
               "stroke-width": e.value.xyGridStrokeWidth,
               "stroke-linecap": "round"
-            }, null, 8, Ca))), 256))
+            }, null, 8, Ea))), 256))
           ])) : g("", !0),
-          e.value.xyShowAxis ? (a(), l("g", Ia, [
+          e.value.xyShowAxis ? (a(), l("g", Oa, [
             _("line", {
               x1: v.value.drawingArea.left,
               x2: v.value.drawingArea.left,
@@ -1012,7 +1027,7 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
               stroke: e.value.xyAxisStroke,
               "stroke-width": e.value.xyAxisStrokeWidth,
               "stroke-linecap": "round"
-            }, null, 8, Ea),
+            }, null, 8, Ta),
             _("line", {
               x1: v.value.drawingArea.left,
               x2: v.value.drawingArea.right,
@@ -1021,9 +1036,9 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
               stroke: e.value.xyAxisStroke,
               "stroke-width": e.value.xyAxisStrokeWidth,
               "stroke-linecap": "round"
-            }, null, 8, Oa)
+            }, null, 8, Pa)
           ])) : g("", !0),
-          e.value.xyShowScale ? (a(), l("g", Ta, [
+          e.value.xyShowScale ? (a(), l("g", Ra, [
             (a(!0), l(m, null, $(v.value.yLabels, (t, u) => (a(), l(m, null, [
               t.y <= v.value.drawingArea.bottom ? (a(), l("line", {
                 key: 0,
@@ -1034,7 +1049,7 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
                 stroke: e.value.xyAxisStroke,
                 "stroke-width": e.value.xyAxisStrokeWidth,
                 "stroke-linecap": "round"
-              }, null, 8, Pa)) : g("", !0),
+              }, null, 8, Ma)) : g("", !0),
               t.y <= v.value.drawingArea.bottom ? (a(), l("text", {
                 key: 1,
                 x: t.x,
@@ -1052,12 +1067,12 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
                   r: e.value.dataLabelRoundingValue
                 }),
                 { datapoint: t, seriesIndex: u }
-              )), 9, Ra)) : g("", !0)
+              )), 9, Fa)) : g("", !0)
             ], 64))), 256))
           ])) : g("", !0),
-          e.value.xyShowScale && e.value.xyPeriods.length ? (a(), l("g", Ma, [
-            (a(!0), l(m, null, $(K.value.map((t) => t.text), (t, u) => (a(), l(m, null, [
-              !e.value.xyPeriodsShowOnlyAtModulo || e.value.xyPeriodsShowOnlyAtModulo && u % Math.floor((y.value.end - y.value.start) / e.value.xyPeriodsModulo) === 0 || y.value.end - y.value.start <= e.value.xyPeriodsModulo ? (a(), l("line", {
+          e.value.xyShowScale && e.value.xyPeriods.length ? (a(), l("g", Na, [
+            (a(!0), l(m, null, $(ee.value.map((t) => t.text), (t, u) => (a(), l(m, null, [
+              !e.value.xyPeriodsShowOnlyAtModulo || e.value.xyPeriodsShowOnlyAtModulo && u % Math.floor((x.value.end - x.value.start) / e.value.xyPeriodsModulo) === 0 || x.value.end - x.value.start <= e.value.xyPeriodsModulo ? (a(), l("line", {
                 key: 0,
                 x1: v.value.drawingArea.left + v.value.slotSize * (u + 1) - v.value.slotSize / 2,
                 x2: v.value.drawingArea.left + v.value.slotSize * (u + 1) - v.value.slotSize / 2,
@@ -1066,8 +1081,8 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
                 stroke: e.value.xyAxisStroke,
                 "stroke-width": e.value.xyAxisStrokeWidth,
                 "stroke-linecap": "round"
-              }, null, 8, Fa)) : g("", !0),
-              !e.value.xyPeriodsShowOnlyAtModulo || e.value.xyPeriodsShowOnlyAtModulo && u % Math.floor((y.value.end - y.value.start) / e.value.xyPeriodsModulo) === 0 || y.value.end - y.value.start <= e.value.xyPeriodsModulo ? (a(), l("g", Na, [
+              }, null, 8, Ua)) : g("", !0),
+              !e.value.xyPeriodsShowOnlyAtModulo || e.value.xyPeriodsShowOnlyAtModulo && u % Math.floor((x.value.end - x.value.start) / e.value.xyPeriodsModulo) === 0 || x.value.end - x.value.start <= e.value.xyPeriodsModulo ? (a(), l("g", Ba, [
                 String(t).includes(`
 `) ? (a(), l("text", {
                   key: 1,
@@ -1075,44 +1090,44 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
                   "text-anchor": e.value.xyPeriodLabelsRotation > 0 ? "start" : e.value.xyPeriodLabelsRotation < 0 ? "end" : "middle",
                   fill: e.value.color,
                   transform: `translate(${v.value.drawingArea.left + v.value.slotSize * (u + 1) - v.value.slotSize / 2}, ${v.value.drawingArea.bottom + e.value.xyLabelsXFontSize + 6}), rotate(${e.value.xyPeriodLabelsRotation})`,
-                  innerHTML: f(Wt)({
+                  innerHTML: f(jt)({
                     content: String(t),
                     fontSize: e.value.xyLabelsXFontSize,
                     fill: e.value.color,
                     x: 0,
                     y: 0
                   })
-                }, null, 8, Ba)) : (a(), l("text", {
+                }, null, 8, Va)) : (a(), l("text", {
                   key: 0,
                   "font-size": e.value.xyLabelsXFontSize,
                   "text-anchor": e.value.xyPeriodLabelsRotation > 0 ? "start" : e.value.xyPeriodLabelsRotation < 0 ? "end" : "middle",
                   fill: e.value.color,
                   transform: `translate(${v.value.drawingArea.left + v.value.slotSize * (u + 1) - v.value.slotSize / 2}, ${v.value.drawingArea.bottom + e.value.xyLabelsXFontSize + 6}), rotate(${e.value.xyPeriodLabelsRotation})`
-                }, O(t), 9, Ua))
+                }, O(t), 9, Da))
               ])) : g("", !0)
             ], 64))), 256))
           ])) : g("", !0),
-          _("g", Da, [
-            (a(!0), l(m, null, $(v.value.dataset, (t, u) => (a(), l("g", Va, [
+          _("g", qa, [
+            (a(!0), l(m, null, $(v.value.dataset, (t, u) => (a(), l("g", Ha, [
               e.value.lineSmooth ? (a(), l(m, { key: 0 }, [
                 _("path", {
-                  d: `M ${f(mt)(t.coordinates)}`,
+                  d: `M ${f(pt)(t.coordinates)}`,
                   stroke: e.value.backgroundColor,
                   "stroke-width": e.value.lineStrokeWidth + 1,
                   "stroke-linecap": "round",
                   fill: "none",
-                  class: he({ "quick-animation": !0, "vue-data-ui-line-animated": e.value.lineAnimated }),
+                  class: fe({ "quick-animation": !0, "vue-data-ui-line-animated": e.value.lineAnimated }),
                   style: { transition: "all 0.3s ease-in-out" }
-                }, null, 10, qa),
+                }, null, 10, Wa),
                 _("path", {
-                  d: `M ${f(mt)(t.coordinates)}`,
+                  d: `M ${f(pt)(t.coordinates)}`,
                   stroke: t.color,
                   "stroke-width": e.value.lineStrokeWidth,
                   "stroke-linecap": "round",
                   fill: "none",
-                  class: he({ "quick-animation": !0, "vue-data-ui-line-animated": e.value.lineAnimated }),
+                  class: fe({ "quick-animation": !0, "vue-data-ui-line-animated": e.value.lineAnimated }),
                   style: { transition: "all 0.3s ease-in-out" }
-                }, null, 10, Ha)
+                }, null, 10, ja)
               ], 64)) : (a(), l(m, { key: 1 }, [
                 _("path", {
                   d: `M ${t.linePath}`,
@@ -1120,18 +1135,18 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
                   "stroke-width": e.value.lineStrokeWidth + 1,
                   "stroke-linecap": "round",
                   fill: "none",
-                  class: he({ "quick-animation": !0, "vue-data-ui-line-animated": e.value.lineAnimated }),
+                  class: fe({ "quick-animation": !0, "vue-data-ui-line-animated": e.value.lineAnimated }),
                   style: { transition: "all 0.3s ease-in-out" }
-                }, null, 10, Wa),
+                }, null, 10, Ga),
                 _("path", {
                   d: `M ${t.linePath}`,
                   stroke: t.color,
                   "stroke-width": e.value.lineStrokeWidth,
                   "stroke-linecap": "round",
                   fill: "none",
-                  class: he({ "quick-animation": !0, "vue-data-ui-line-animated": e.value.lineAnimated }),
+                  class: fe({ "quick-animation": !0, "vue-data-ui-line-animated": e.value.lineAnimated }),
                   style: { transition: "all 0.3s ease-in-out" }
-                }, null, 10, ja)
+                }, null, 10, Xa)
               ], 64)),
               (a(!0), l(m, null, $(t.coordinates, (r, h) => (a(), l("circle", {
                 cx: r.x,
@@ -1142,10 +1157,10 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
                 "stroke-width": "0.5",
                 class: "quick-animation",
                 style: { transition: "all 0.3s ease-in-out" }
-              }, null, 8, Ga))), 256))
+              }, null, 8, Za))), 256))
             ]))), 256))
           ]),
-          e.value.showDataLabels ? (a(), l("g", Xa, [
+          e.value.showDataLabels ? (a(), l("g", Ya, [
             (a(!0), l(m, null, $(v.value.dataset, (t, u) => (a(), l(m, null, [
               (a(!0), l(m, null, $(t.coordinates, (r, h) => (a(), l("text", {
                 "text-anchor": "middle",
@@ -1165,10 +1180,10 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
                   r: e.value.dataLabelRoundingValue
                 }),
                 { datapoint: r, seriesIndex: h }
-              )), 9, Za))), 256))
+              )), 9, Ja))), 256))
             ], 64))), 256))
           ])) : g("", !0),
-          _("g", Ya, [
+          _("g", Qa, [
             (a(!0), l(m, null, $(v.value.extremes.maxSeries, (t, u) => (a(), l("rect", {
               x: v.value.drawingArea.left + u * v.value.slotSize,
               y: v.value.drawingArea.top,
@@ -1178,15 +1193,15 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
               style: R(`opacity:${e.value.xyHighlighterOpacity}`),
               onMouseenter: (r) => v.value.useTooltip(u),
               onMouseleave: s[1] || (s[1] = (r) => v.value.killTooltip()),
-              onClick: (r) => ue("selectDatapoint", v.value.dataset.map((h) => ({
+              onClick: (r) => re("selectDatapoint", v.value.dataset.map((h) => ({
                 ...h,
                 value: h.values[u]
               })))
-            }, null, 44, Ja))), 256))
+            }, null, 44, Ka))), 256))
           ])
         ], 64)) : g("", !0),
         L.value === A.BAR ? (a(), l(m, { key: 5 }, [
-          e.value.xyShowGrid ? (a(), l("g", Qa, [
+          e.value.xyShowGrid ? (a(), l("g", el, [
             (a(!0), l(m, null, $(d.value.yLabels, (t) => (a(), l(m, null, [
               t.y <= d.value.drawingArea.bottom ? (a(), l("line", {
                 key: 0,
@@ -1197,7 +1212,7 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
                 stroke: e.value.xyGridStroke,
                 "stroke-width": e.value.xyGridStrokeWidth,
                 "stroke-linecap": "round"
-              }, null, 8, Ka)) : g("", !0)
+              }, null, 8, tl)) : g("", !0)
             ], 64))), 256)),
             (a(!0), l(m, null, $(d.value.extremes.maxSeries + 1, (t, u) => (a(), l("line", {
               x1: d.value.drawingArea.left + d.value.slotSize * u,
@@ -1207,9 +1222,9 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
               stroke: e.value.xyGridStroke,
               "stroke-width": e.value.xyGridStrokeWidth,
               "stroke-linecap": "round"
-            }, null, 8, el))), 256))
+            }, null, 8, al))), 256))
           ])) : g("", !0),
-          e.value.xyShowAxis ? (a(), l("g", tl, [
+          e.value.xyShowAxis ? (a(), l("g", ll, [
             _("line", {
               x1: d.value.drawingArea.left,
               x2: d.value.drawingArea.left,
@@ -1218,7 +1233,7 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
               stroke: e.value.xyAxisStroke,
               "stroke-width": e.value.xyAxisStrokeWidth,
               "stroke-linecap": "round"
-            }, null, 8, al),
+            }, null, 8, ol),
             _("line", {
               x1: d.value.drawingArea.left,
               x2: d.value.drawingArea.right,
@@ -1227,9 +1242,9 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
               stroke: e.value.xyAxisStroke,
               "stroke-width": e.value.xyAxisStrokeWidth,
               "stroke-linecap": "round"
-            }, null, 8, ll)
+            }, null, 8, nl)
           ])) : g("", !0),
-          e.value.xyShowScale ? (a(), l("g", ol, [
+          e.value.xyShowScale ? (a(), l("g", il, [
             (a(!0), l(m, null, $(d.value.yLabels, (t, u) => (a(), l(m, null, [
               t.y <= d.value.drawingArea.bottom ? (a(), l("line", {
                 key: 0,
@@ -1240,7 +1255,7 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
                 stroke: e.value.xyAxisStroke,
                 "stroke-width": e.value.xyAxisStrokeWidth,
                 "stroke-linecap": "round"
-              }, null, 8, nl)) : g("", !0),
+              }, null, 8, ul)) : g("", !0),
               t.y <= d.value.drawingArea.bottom ? (a(), l("text", {
                 key: 1,
                 x: t.x,
@@ -1258,11 +1273,11 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
                   r: e.value.dataLabelRoundingValue
                 }),
                 { datapoint: t, seriesIndex: u }
-              )), 9, il)) : g("", !0)
+              )), 9, rl)) : g("", !0)
             ], 64))), 256))
           ])) : g("", !0),
-          e.value.xyShowScale && e.value.xyPeriods.length ? (a(), l("g", ul, [
-            (a(!0), l(m, null, $(e.value.xyPeriods.slice(y.value.start, y.value.end), (t, u) => (a(), l("line", {
+          e.value.xyShowScale && e.value.xyPeriods.length ? (a(), l("g", sl, [
+            (a(!0), l(m, null, $(e.value.xyPeriods.slice(x.value.start, x.value.end), (t, u) => (a(), l("line", {
               x1: d.value.drawingArea.left + d.value.slotSize * (u + 1) - d.value.slotSize / 2,
               x2: d.value.drawingArea.left + d.value.slotSize * (u + 1) - d.value.slotSize / 2,
               y1: d.value.drawingArea.bottom,
@@ -1270,15 +1285,15 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
               stroke: e.value.xyAxisStroke,
               "stroke-width": e.value.xyAxisStrokeWidth,
               "stroke-linecap": "round"
-            }, null, 8, rl))), 256)),
-            (a(!0), l(m, null, $(K.value.map((t) => t.text), (t, u) => (a(), l("text", {
+            }, null, 8, vl))), 256)),
+            (a(!0), l(m, null, $(ee.value.map((t) => t.text), (t, u) => (a(), l("text", {
               "font-size": e.value.xyLabelsXFontSize,
               "text-anchor": e.value.xyPeriodLabelsRotation > 0 ? "start" : e.value.xyPeriodLabelsRotation < 0 ? "end" : "middle",
               transform: `translate(${d.value.drawingArea.left + d.value.slotSize * (u + 1) - d.value.slotSize / 2}, ${d.value.drawingArea.bottom + e.value.xyLabelsXFontSize + 6}) rotate(${e.value.xyPeriodLabelsRotation})`,
               fill: e.value.color
-            }, O(t), 9, sl))), 256))
+            }, O(t), 9, dl))), 256))
           ])) : g("", !0),
-          _("g", vl, [
+          _("g", cl, [
             (a(!0), l(m, null, $(d.value.dataset, (t, u) => (a(), l(m, null, [
               (a(!0), l(m, null, $(t.coordinates, (r, h) => (a(), l("rect", {
                 x: r.x,
@@ -1289,7 +1304,7 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
                 stroke: e.value.backgroundColor,
                 "stroke-width": e.value.barStrokeWidth,
                 "stroke-linecap": "round",
-                class: he({ "vue-data-ui-bar-animated": e.value.barAnimated && r.value < 0 })
+                class: fe({ "vue-data-ui-bar-animated": e.value.barAnimated && r.value < 0 })
               }, [
                 e.value.barAnimated && r.value > 0 && !f(Ee) && !f(Oe) ? (a(), l("animate", {
                   key: 0,
@@ -1297,18 +1312,18 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
                   from: 0,
                   to: r.height,
                   dur: "0.5s"
-                }, null, 8, cl)) : g("", !0),
+                }, null, 8, fl)) : g("", !0),
                 e.value.barAnimated && r.value > 0 && !f(Ee) && !f(Oe) ? (a(), l("animate", {
                   key: 1,
                   attributeName: "y",
                   from: d.value.absoluteZero,
                   to: d.value.absoluteZero - r.height,
                   dur: "0.5s"
-                }, null, 8, hl)) : g("", !0)
-              ], 10, dl))), 256))
+                }, null, 8, gl)) : g("", !0)
+              ], 10, hl))), 256))
             ], 64))), 256))
           ]),
-          e.value.showDataLabels ? (a(), l("g", fl, [
+          e.value.showDataLabels ? (a(), l("g", ml, [
             (a(!0), l(m, null, $(d.value.dataset, (t, u) => (a(), l(m, null, [
               (a(!0), l(m, null, $(t.coordinates, (r, h) => (a(), l("text", {
                 x: r.x + r.width / 2,
@@ -1327,10 +1342,10 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
                   r: e.value.dataLabelRoundingValue
                 }),
                 { datapoint: r, seriesIndex: h }
-              )), 9, gl))), 256))
+              )), 9, pl))), 256))
             ], 64))), 256))
           ])) : g("", !0),
-          _("g", ml, [
+          _("g", yl, [
             (a(!0), l(m, null, $(d.value.extremes.maxSeries, (t, u) => (a(), l("rect", {
               x: d.value.drawingArea.left + u * d.value.slotSize,
               y: d.value.drawingArea.top,
@@ -1340,51 +1355,51 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
               style: R(`opacity:${e.value.xyHighlighterOpacity}`),
               onMouseenter: (r) => d.value.useTooltip(u),
               onMouseleave: s[2] || (s[2] = (r) => d.value.killTooltip()),
-              onClick: (r) => ue("selectDatapoint", d.value.dataset.map((h) => ({
+              onClick: (r) => re("selectDatapoint", d.value.dataset.map((h) => ({
                 ...h,
                 value: h.values[u]
               })))
-            }, null, 44, pl))), 256))
+            }, null, 44, xl))), 256))
           ])
         ], 64)) : g("", !0),
-        [A.LINE, A.BAR].includes(L.value) ? (a(), l("g", xl, [
-          e.value.xAxisLabel && L.value === A.LINE ? (a(), l("g", yl, [
+        [A.LINE, A.BAR].includes(L.value) ? (a(), l("g", kl, [
+          e.value.xAxisLabel && L.value === A.LINE ? (a(), l("g", bl, [
             _("text", {
               "font-size": e.value.axisLabelsFontSize,
               fill: e.value.color,
               "text-anchor": "middle",
               x: v.value.drawingArea.left + v.value.drawingArea.width / 2,
               y: b.value.height - e.value.axisLabelsFontSize / 3
-            }, O(e.value.xAxisLabel), 9, kl)
+            }, O(e.value.xAxisLabel), 9, Sl)
           ])) : g("", !0),
-          e.value.xAxisLabel && L.value === A.BAR ? (a(), l("g", bl, [
+          e.value.xAxisLabel && L.value === A.BAR ? (a(), l("g", wl, [
             _("text", {
               "font-size": e.value.axisLabelsFontSize,
               fill: e.value.color,
               "text-anchor": "middle",
               x: d.value.drawingArea.left + d.value.drawingArea.width / 2,
               y: b.value.height - e.value.axisLabelsFontSize / 3
-            }, O(e.value.xAxisLabel), 9, Sl)
+            }, O(e.value.xAxisLabel), 9, Al)
           ])) : g("", !0),
-          e.value.yAxisLabel && L.value === A.LINE ? (a(), l("g", wl, [
+          e.value.yAxisLabel && L.value === A.LINE ? (a(), l("g", _l, [
             _("text", {
               "font-size": e.value.axisLabelsFontSize,
               fill: e.value.color,
               transform: `translate(${e.value.axisLabelsFontSize}, ${v.value.drawingArea.top + v.value.drawingArea.height / 2}) rotate(-90)`,
               "text-anchor": "middle"
-            }, O(e.value.yAxisLabel), 9, Al)
+            }, O(e.value.yAxisLabel), 9, Ll)
           ])) : g("", !0),
-          e.value.yAxisLabel && L.value === A.BAR ? (a(), l("g", _l, [
+          e.value.yAxisLabel && L.value === A.BAR ? (a(), l("g", zl, [
             _("text", {
               "font-size": e.value.axisLabelsFontSize,
               fill: e.value.color,
               transform: `translate(${e.value.axisLabelsFontSize}, ${d.value.drawingArea.top + d.value.drawingArea.height / 2}) rotate(-90)`,
               "text-anchor": "middle"
-            }, O(e.value.yAxisLabel), 9, Ll)
+            }, O(e.value.yAxisLabel), 9, $l)
           ])) : g("", !0)
         ])) : g("", !0)
-      ], 12, ia)) : g("", !0),
-      L.value ? g("", !0) : (a(), Fe(f(me), {
+      ], 12, ra)) : g("", !0),
+      L.value ? g("", !0) : (a(), Fe(f(pe), {
         key: 5,
         config: {
           type: "line",
@@ -1402,53 +1417,53 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
           }
         }
       }, null, 8, ["config"])),
-      o.$slots.watermark ? (a(), l("div", zl, [
-        M(o.$slots, "watermark", ne(ie({ isPrinting: f(Ee) || f(Oe) })), void 0, !0)
+      o.$slots.watermark ? (a(), l("div", Cl, [
+        M(o.$slots, "watermark", ie(ue({ isPrinting: f(Ee) || f(Oe) })), void 0, !0)
       ])) : g("", !0),
       [A.BAR, A.LINE].includes(L.value) && e.value.zoomXy && p.value.maxSeriesLength > 1 ? (a(), l("div", {
         key: `slicer_${Ce.value}`,
         ref_key: "quickChartSlicer",
         ref: Ze
       }, [
-        (a(), Fe(Yt, {
+        (a(), Fe(Jt, {
           ref_key: "slicerComponent",
-          ref: se,
+          ref: ve,
           key: `slicer_${Ce.value}`,
           background: e.value.zoomColor,
           borderColor: e.value.backgroundColor,
           fontSize: e.value.zoomFontSize,
           useResetSlot: e.value.zoomUseResetSlot,
-          labelLeft: e.value.xyPeriods[y.value.start] ? K.value[0].text : "",
-          labelRight: e.value.xyPeriods[y.value.end - 1] ? K.value.at(-1).text : "",
+          labelLeft: e.value.xyPeriods[x.value.start] ? ee.value[0].text : "",
+          labelRight: e.value.xyPeriods[x.value.end - 1] ? ee.value.at(-1).text : "",
           textColor: e.value.color,
           inputColor: e.value.zoomColor,
           selectColor: e.value.zoomHighlightColor,
           max: p.value.maxSeriesLength,
           min: 0,
-          valueStart: y.value.start,
-          valueEnd: y.value.end,
+          valueStart: x.value.start,
+          valueEnd: x.value.end,
           smoothMinimap: e.value.zoomMinimap.smooth,
           minimapSelectedColor: e.value.zoomMinimap.selectedColor,
           minimapSelectedColorOpacity: e.value.zoomMinimap.selectedColorOpacity,
           minimapSelectionRadius: e.value.zoomMinimap.selectionRadius,
           minimapLineColor: e.value.zoomMinimap.lineColor,
-          minimap: It.value,
+          minimap: Et.value,
           minimapIndicatorColor: e.value.zoomMinimap.indicatorColor,
           verticalHandles: e.value.zoomMinimap.verticalHandles,
           minimapSelectedIndex: j.value,
-          start: y.value.start,
-          "onUpdate:start": s[3] || (s[3] = (t) => y.value.start = t),
-          end: y.value.end,
-          "onUpdate:end": s[4] || (s[4] = (t) => y.value.end = t),
+          start: x.value.start,
+          "onUpdate:start": s[3] || (s[3] = (t) => x.value.start = t),
+          end: x.value.end,
+          "onUpdate:end": s[4] || (s[4] = (t) => x.value.end = t),
           refreshStartPoint: e.value.zoomStartIndex !== null ? e.value.zoomStartIndex : 0,
           refreshEndPoint: e.value.zoomEndIndex !== null ? e.value.zoomEndIndex + 1 : p.value.maxSeriesLength,
           enableRangeHandles: e.value.zoomEnableRangeHandles,
           enableSelectionDrag: e.value.zoomEnableSelectionDrag,
-          onReset: $t,
-          onTrapMouse: zt
+          onReset: Ct,
+          onTrapMouse: $t
         }, {
           "reset-action": G(({ reset: t }) => [
-            M(o.$slots, "reset-action", ne(ie({ reset: t })), void 0, !0)
+            M(o.$slots, "reset-action", ie(ue({ reset: t })), void 0, !0)
           ]),
           _: 3
         }, 8, ["background", "borderColor", "fontSize", "useResetSlot", "labelLeft", "labelRight", "textColor", "inputColor", "selectColor", "max", "valueStart", "valueEnd", "smoothMinimap", "minimapSelectedColor", "minimapSelectedColorOpacity", "minimapSelectionRadius", "minimapLineColor", "minimap", "minimapIndicatorColor", "verticalHandles", "minimapSelectedIndex", "start", "end", "refreshStartPoint", "refreshEndPoint", "enableRangeHandles", "enableSelectionDrag"]))
@@ -1463,7 +1478,7 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
         L.value === A.DONUT ? (a(!0), l(m, { key: 0 }, $(I.value.legend, (t, u) => (a(), l("div", {
           class: "vue-ui-quick-chart-legend-item",
           onClick: (r) => {
-            Lt(t, I.value.dataset), ue("selectLegend", t);
+            zt(t, I.value.dataset), re("selectLegend", t);
           },
           style: R(`cursor: ${I.value.legend.length > 1 ? "pointer" : "default"}; opacity:${w.value.includes(t.id) ? "0.5" : "1"}`)
         }, [
@@ -1471,7 +1486,7 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
             key: 0,
             ref_for: !0
           }, { legend: t }), void 0, !0) : (a(), l(m, { key: 1 }, [
-            fe(f(T), {
+            ge(f(T), {
               name: e.value.legendIcon,
               stroke: t.color,
               size: e.value.legendIconSize
@@ -1507,11 +1522,11 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
               r: e.value.dataLabelRoundingPercentage
             })) + ") ", 5))
           ], 64))
-        ], 12, $l))), 256)) : g("", !0),
+        ], 12, Il))), 256)) : g("", !0),
         L.value === A.LINE ? (a(!0), l(m, { key: 1 }, $(v.value.legend, (t, u) => (a(), l("div", {
           class: "vue-ui-quick-chart-legend-item",
           onClick: (r) => {
-            ut(t.id, v.value.legend.length - 1), ue("selectLegend", t);
+            ut(t.id, v.value.legend.length - 1), re("selectLegend", t);
           },
           style: R(`cursor: ${v.value.legend.length > 1 ? "pointer" : "default"}; opacity:${w.value.includes(t.id) ? "0.5" : "1"}`)
         }, [
@@ -1519,7 +1534,7 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
             key: 0,
             ref_for: !0
           }, { legend: t }), void 0, !0) : (a(), l(m, { key: 1 }, [
-            fe(f(T), {
+            ge(f(T), {
               name: e.value.legendIcon,
               stroke: t.color,
               size: e.value.legendIconSize
@@ -1528,11 +1543,11 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
               style: R(`font-size:${e.value.legendFontSize}px`)
             }, O(t.name), 5)
           ], 64))
-        ], 12, Cl))), 256)) : g("", !0),
+        ], 12, El))), 256)) : g("", !0),
         L.value === A.BAR ? (a(!0), l(m, { key: 2 }, $(d.value.legend, (t, u) => (a(), l("div", {
           class: "vue-ui-quick-chart-legend-item",
           onClick: (r) => {
-            ut(t.id, d.value.legend.length - 1), ue("selectLegend", t);
+            ut(t.id, d.value.legend.length - 1), re("selectLegend", t);
           },
           style: R(`cursor: ${d.value.legend.length > 1 ? "pointer" : "default"}; opacity:${w.value.includes(t.id) ? "0.5" : "1"}`)
         }, [
@@ -1540,7 +1555,7 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
             key: 0,
             ref_for: !0
           }, { legend: t }), void 0, !0) : (a(), l(m, { key: 1 }, [
-            fe(f(T), {
+            ge(f(T), {
               name: e.value.legendIcon,
               stroke: t.color,
               size: e.value.legendIconSize
@@ -1549,7 +1564,7 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
               style: R(`font-size:${e.value.legendFontSize}px`)
             }, O(t.name), 5)
           ], 64))
-        ], 12, Il))), 256)) : g("", !0)
+        ], 12, Ol))), 256)) : g("", !0)
       ], 4)) : g("", !0),
       o.$slots.source ? (a(), l("div", {
         key: 9,
@@ -1559,8 +1574,8 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
       }, [
         M(o.$slots, "source", {}, void 0, !0)
       ], 512)) : g("", !0),
-      fe(f(pe), {
-        show: Se.value.showTooltip && ee.value,
+      ge(f(ye), {
+        show: Se.value.showTooltip && te.value,
         backgroundColor: e.value.backgroundColor,
         color: e.value.color,
         borderRadius: e.value.tooltipBorderRadius,
@@ -1570,28 +1585,28 @@ const na = ["id"], ia = ["xmlns", "viewBox"], ua = ["x", "y", "width", "height"]
         backgroundOpacity: e.value.tooltipBackgroundOpacity,
         position: e.value.tooltipPosition,
         offsetY: e.value.tooltipOffsetY,
-        parent: xe.value,
-        content: te.value,
+        parent: J.value,
+        content: ae.value,
         isFullscreen: Pe.value,
         isCustom: f(Ne)(e.value.tooltipCustomFormat)
       }, {
         "tooltip-before": G(() => [
-          M(o.$slots, "tooltip-before", ne(ie({ ...ye.value })), void 0, !0)
+          M(o.$slots, "tooltip-before", ie(ue({ ...xe.value })), void 0, !0)
         ]),
         "tooltip-after": G(() => [
-          M(o.$slots, "tooltip-after", ne(ie({ ...ye.value })), void 0, !0)
+          M(o.$slots, "tooltip-after", ie(ue({ ...xe.value })), void 0, !0)
         ]),
         _: 3
       }, 8, ["show", "backgroundColor", "color", "borderRadius", "borderColor", "borderWidth", "fontSize", "backgroundOpacity", "position", "offsetY", "parent", "content", "isFullscreen", "isCustom"])
-    ], 46, na)) : (a(), l("div", El, [
-      fe(f(T), {
+    ], 46, ua)) : (a(), l("div", Tl, [
+      ge(f(T), {
         name: "circleCancel",
         stroke: "red"
       }),
       s[8] || (s[8] = _("span", null, "Dataset is not processable", -1))
     ]));
   }
-}, Vl = /* @__PURE__ */ Qt(Ol, [["__scopeId", "data-v-28f301ff"]]);
+}, Wl = /* @__PURE__ */ ea(Pl, [["__scopeId", "data-v-38c96f9a"]]);
 export {
-  Vl as default
+  Wl as default
 };