vue-data-ui 3.22.5 → 3.22.7

package/dist/{vue-ui-quick-chart-CJ1xQgYc.js → vue-ui-quick-chart-D1OWBgQJ.js}

@@ -1,21 +1,21 @@
 import { t as e } from "./rolldown-runtime-Dy4uBu1J.js";
-import { Et as t, Ft as n, Gt as r, H as i, Ot as a, Q as o, S as s, Ut as c, W as l, b as ee, d as u, h as d, i as f, j as p, jt as m, ot as te, p as ne, q as h, t as re, u as ie, v as g, vt as ae } from "./lib-CuwHGt1j.js";
+import { Et as t, Ft as n, Gt as r, H as i, Ot as a, Q as o, S as s, Ut as c, W as l, at as ee, b as te, d as u, h as d, i as f, j as p, jt as m, p as ne, q as h, t as re, u as ie, v as g, vt as ae } from "./lib-EAmk-PgA.js";
 import { t as oe } from "./useTimeLabels-BmBRv27Y.js";
-import { t as se } from "./useConfig-pVLia3dt.js";
-import { t as ce } from "./usePrinter-C0wAS8yc.js";
+import { t as se } from "./useConfig-DYM3f6EI.js";
+import { t as ce } from "./usePrinter-DnGzpp6Q.js";
 import { n as le, t as ue } from "./BaseScanner-DZvpgOjM.js";
 import { t as de } from "./useSvgExport-SVIsDot8.js";
-import { t as fe } from "./useNestedProp-BjkuFaz1.js";
+import { t as fe } from "./useNestedProp-D8XqxgOU.js";
 import { t as pe } from "./useThemeCheck-C43Tcqmk.js";
 import { t as me } from "./useTimeLabelCollider-AEcY4Ioe.js";
-import { t as he } from "./img-B29J8tV5.js";
+import { t as he } from "./img-B_abIg0o.js";
 import { t as ge } from "./_plugin-vue_export-helper-B3ysoDQm.js";
 import { c as _e } from "./canvas-lib-BOP_HS11.js";
 import { t as ve } from "./useResponsive-BfnK0KxU.js";
-import { t as ye } from "./BaseLegendToggle-C4Usj0LI.js";
+import { t as ye } from "./BaseLegendToggle-CHnlKalt.js";
 import { t as be } from "./A11yDataTable-DdRsVULz.js";
 import { t as xe } from "./useChartAccessibility-DYqac8yF.js";
-import { t as Se } from "./Slicer-hEvKOLw3.js";
+import { t as Se } from "./Slicer-6FOtg9py.js";
 import { t as Ce } from "./vue_ui_quick_chart-mZBdml3Z.js";
 import { Fragment as _, Teleport as we, computed as v, createBlock as Te, createCommentVNode as y, createElementBlock as b, createElementVNode as x, createSlots as Ee, createVNode as De, defineAsyncComponent as Oe, guardReactiveProps as S, mergeProps as ke, nextTick as Ae, normalizeClass as je, normalizeProps as C, normalizeStyle as w, onBeforeUnmount as Me, onMounted as Ne, openBlock as T, ref as E, renderList as D, renderSlot as O, shallowRef as Pe, toDisplayString as k, toRefs as Fe, unref as A, watch as Ie, watchEffect as Le, withCtx as j } from "vue";
 //#region src/chartDetector.js
@@ -440,12 +440,12 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 		"copyAlt"
 	],
 	setup(e, { expose: ge, emit: Re }) {
-		let Be = Oe(() => import("./BaseIcon-xBuW2jjI.js").then((e) => e.n)), Ve = Oe(() => import("./PackageVersion-CqE8ssFu.js").then((e) => e.t)), Ue = Oe(() => import("./PenAndPaper-ISUbDKXq.js").then((e) => e.t)), We = Oe(() => import("./Tooltip-BhKov422.js")), Ge = Oe(() => import("./UserOptions-BxT1XHzN.js").then((e) => e.n)), { vue_ui_quick_chart: Ke } = se(), { isThemeValid: qe, warnInvalidTheme: Je } = pe(), P = e, F = E(null), wn = E(null), Tn = E(null), En = E(null), I = E(l()), L = E(!1), Dn = E(null), On = E(""), R = E(null), kn = E(null), An = E(null), z = E([]), jn = E(0), Mn = E(0), Nn = E(!1), Pn = E(null), Fn = E(null), In = E(null), Ln = E(null), Rn = E(null), zn = E(null);
+		let Be = Oe(() => import("./BaseIcon-_-BX7be3.js").then((e) => e.n)), Ve = Oe(() => import("./PackageVersion-Dse0n05o.js").then((e) => e.t)), Ue = Oe(() => import("./PenAndPaper-gaV1QPpP.js").then((e) => e.t)), We = Oe(() => import("./Tooltip-B8yYfISA.js")), Ge = Oe(() => import("./UserOptions-BL9VlHop.js").then((e) => e.n)), { vue_ui_quick_chart: Ke } = se(), { isThemeValid: qe, warnInvalidTheme: Je } = pe(), P = e, F = E(null), wn = E(null), Tn = E(null), En = E(null), I = E(l()), L = E(!1), Dn = E(null), On = E(""), R = E(null), kn = E(null), An = E(null), z = E([]), jn = E(0), Mn = E(0), Nn = E(!1), Pn = E(null), Fn = E(null), B = E(null), In = E(null), Ln = E(null), Rn = E(null);
 		E("#FFFFFF");
-		let B = E($n()), Bn = v(() => !!B.value.debug), Vn = v(() => B.value.useCursorPointer), V = E(null), Hn = E({
+		let V = E($n()), zn = v(() => !!V.value.debug), Bn = v(() => V.value.useCursorPointer), H = E(null), Vn = E({
 			x: 0,
 			y: 0
-		}), H = E("pointer"), Un = E(!1), Wn = v(() => r({
+		}), Hn = E("pointer"), Un = E(!1), Wn = v(() => r({
 			dafaultConfig: {
 				backgroundColor: "#99999930",
 				customPalette: ["#BABABA"],
@@ -465,14 +465,14 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 				zoomStartIndex: null,
 				zoomEndIndex: null
 			},
-			userConfig: B.value.skeletonConfig ?? {}
+			userConfig: V.value.skeletonConfig ?? {}
 		})), { loading: U, FINAL_DATASET: Gn, manualLoading: Kn } = le({
 			...Fe(P),
-			FINAL_CONFIG: B,
+			FINAL_CONFIG: V,
 			prepareConfig: $n,
 			callback: () => {
 				Promise.resolve().then(async () => {
-					await Ae(), K.value === M.LINE && B.value.lineAnimated && !U.value && Lr({
+					await Ae(), K.value === M.LINE && V.value.lineAnimated && !U.value && Lr({
 						pathDuration: 1e3,
 						pointDuration: 1200,
 						labelDuration: 1200
@@ -492,10 +492,10 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 				89
 			],
 			skeletonConfig: r({
-				defaultConfig: B.value,
+				defaultConfig: V.value,
 				userConfig: Wn.value
 			})
-		}), { svgRef: qn } = xe({ config: { text: B.value.title } }), Jn = v(() => B.value.showUserOptionsOnChartHover), Yn = v(() => B.value.keepUserOptionsStateOnChartLeave), Xn = E(!B.value.showUserOptionsOnChartHover), Zn = E(!1);
+		}), { svgRef: qn } = xe({ config: { text: V.value.title } }), Jn = v(() => V.value.showUserOptionsOnChartHover), Yn = v(() => V.value.keepUserOptionsStateOnChartLeave), Xn = E(!V.value.showUserOptionsOnChartHover), Zn = E(!1);
 		function Qn(e = !1) {
 			Zn.value = e, Jn.value && (Xn.value = e);
 		}
@@ -522,15 +522,15 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 			return t;
 		}
 		Ie(() => P.config, (e) => {
-			U.value || (B.value = $n()), q.value.width = B.value.width, q.value.height = B.value.height, Xn.value = !B.value.showUserOptionsOnChartHover, dr(), cr.value.showTooltip = B.value.showTooltip;
+			U.value || (V.value = $n()), q.value.width = V.value.width, q.value.height = V.value.height, Xn.value = !V.value.showUserOptionsOnChartHover, dr(), cr.value.showTooltip = V.value.showTooltip;
 		}, { deep: !0 }), Ie(() => P.dataset, (e) => {
 			G.value = tr.value, X.value.start = 0, X.value.end = G.value.maxSeriesLength, Mn.value += 1;
 		}, { deep: !0 }), Ie(() => P.dataset, (e) => {
 			Array.isArray(e) && e.length > 0 && (Kn.value = !1);
 		}, { immediate: !0 });
-		let er = v(() => s(B.value.customPalette)), W = Re, tr = v(() => {
+		let er = v(() => s(V.value.customPalette)), W = Re, tr = v(() => {
 			let e = ze({
-				debug: Bn.value,
+				debug: zn.value,
 				dataset: n(Gn.value, [
 					"serie",
 					"series",
@@ -539,40 +539,40 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 					"values",
 					"num"
 				]),
-				barLineSwitch: B.value.chartIsBarUnderDatasetLength
+				barLineSwitch: V.value.chartIsBarUnderDatasetLength
 			});
-			return !e && Bn.value && console.error("VueUiQuickChart : Dataset is not processable"), e;
+			return !e && zn.value && console.error("VueUiQuickChart : Dataset is not processable"), e;
 		}), G = E(tr.value), nr = v(() => !!G.value), K = v(() => G.value ? G.value.type : null);
 		Ie(() => K.value, (e) => {
 			e || o({
 				componentName: "VueUiQuickChart",
 				type: "dataset",
-				debug: Bn.value
+				debug: zn.value
 			});
 		}, { immediate: !0 });
 		let { isPrinting: rr, isImaging: ir, generatePdf: ar, generateImage: or } = ce({
 			elementId: `${K.value}_${I.value}`,
-			fileName: B.value.title || K.value,
-			options: B.value.userOptionsPrint
-		}), sr = v(() => B.value.showUserOptions && !B.value.title), q = E({
-			width: B.value.width,
-			height: B.value.height
-		}), cr = E({ showTooltip: B.value.showTooltip });
-		Ie(B, () => {
-			cr.value = { showTooltip: B.value.showTooltip };
+			fileName: V.value.title || K.value,
+			options: V.value.userOptionsPrint
+		}), sr = v(() => V.value.showUserOptions && !V.value.title), q = E({
+			width: V.value.width,
+			height: V.value.height
+		}), cr = E({ showTooltip: V.value.showTooltip });
+		Ie(V, () => {
+			cr.value = { showTooltip: V.value.showTooltip };
 		}, { immediate: !0 });
 		let lr = Pe(null), ur = Pe(null);
 		Ne(async () => {
 			Nn.value = !0, dr();
 		});
 		function dr() {
-			if (a(P.dataset) || (Kn.value = B.value.loading), B.value.responsive) {
+			if (a(P.dataset) || (Kn.value = V.value.loading), V.value.responsive) {
 				let e = _e(() => {
 					let { width: e, height: t } = ve({
 						chart: F.value,
-						title: B.value.title ? wn.value : null,
-						legend: B.value.showLegend ? Tn.value : null,
-						slicer: [M.BAR, M.LINE].includes(K.value) && B.value.zoomXy && G.value.maxSeriesLength > 1 ? En.value : null,
+						title: V.value.title ? wn.value : null,
+						legend: V.value.showLegend ? Tn.value : null,
+						slicer: [M.BAR, M.LINE].includes(K.value) && V.value.zoomXy && G.value.maxSeriesLength > 1 ? En.value : null,
 						source: kn.value,
 						noTitle: An.value
 					});
@@ -599,7 +599,7 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 			return [...e].map((e) => e.value).reduce((e, t) => e + t, 0);
 		}
 		function mr(e) {
-			return B.value.blurOnHover && ![null, void 0].includes(R.value) && R.value !== e ? `url(#blur_${I.value})` : "";
+			return V.value.blurOnHover && ![null, void 0].includes(R.value) && R.value !== e ? `url(#blur_${I.value})` : "";
 		}
 		function hr() {
 			z.value.length ? z.value = [] : K.value === M.DONUT ? Y.value.legend.forEach((e) => {
@@ -662,7 +662,7 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 		function xr(e) {
 			J.value = e;
 		}
-		let Sr = v(() => B.value.donutThicknessRatio < .01 ? .01 : B.value.donutThicknessRatio > .4 ? .4 : B.value.donutThicknessRatio), Y = v(() => {
+		let Sr = v(() => V.value.donutThicknessRatio < .01 ? .01 : V.value.donutThicknessRatio > .4 ? .4 : V.value.donutThicknessRatio), Y = v(() => {
 			if (K.value !== M.DONUT) return null;
 			let e = G.value.dataset.map((e, t) => ({
 				...e,
@@ -671,18 +671,18 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 				id: `donut_${t}`
 			})).map((e, t) => ({
 				...e,
-				color: e.COLOR ? ee(e.COLOR) : er.value[t + B.value.paletteStartIndex] || m[t + B.value.paletteStartIndex] || m[(t + B.value.paletteStartIndex) % m.length],
+				color: e.COLOR ? te(e.COLOR) : er.value[t + V.value.paletteStartIndex] || m[t + V.value.paletteStartIndex] || m[(t + V.value.paletteStartIndex) % m.length],
 				immutableValue: e.value
 			}));
 			function n(e, t) {
 				return h({
 					v: isNaN(e.value / pr(t)) ? 0 : e.value / pr(t) * 100,
 					s: "%",
-					r: B.value.dataLabelRoundingPercentage
+					r: V.value.dataLabelRoundingPercentage
 				});
 			}
 			function r(e) {
-				return e.proportion * 100 > B.value.donutHideLabelUnderPercentage;
+				return e.proportion * 100 > V.value.donutHideLabelUnderPercentage;
 			}
 			function i(e, t) {
 				let n = tr.value.dataset.find((t, n) => `donut_${n}` === e).VALUE;
@@ -692,50 +692,50 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 				Dn.value = {
 					datapoint: t,
 					seriesIndex: n,
-					config: B.value,
+					config: V.value,
 					dataset: e
-				}, R.value = t.id, V.value = n, H.value = r;
-				let i = B.value.tooltipCustomFormat;
-				if (B.value.events.datapointEnter && B.value.events.datapointEnter({
+				}, R.value = t.id, H.value = n, Hn.value = r;
+				let i = V.value.tooltipCustomFormat;
+				if (V.value.events.datapointEnter && V.value.events.datapointEnter({
 					datapoint: t,
 					seriesIndex: n
-				}), ae(i) && te(() => i({
+				}), ae(i) && ee(() => i({
 					datapoint: t,
 					seriesIndex: n,
 					series: e,
-					config: B.value
+					config: V.value
 				}))) On.value = i({
 					datapoint: t,
 					seriesIndex: n,
 					series: e,
-					config: B.value
+					config: V.value
 				});
 				else {
 					let e = "";
-					e += `<div style="width:100%;text-align:center;border-bottom:1px solid ${B.value.tooltipBorderColor};padding-bottom:6px;margin-bottom:3px;">${t.name}</div>`, e += `<div style="display:flex;flex-direction:row;gap:6px;align-items:center;"><svg viewBox="0 0 12 12" height="14" width="14"><circle cx="6" cy="6" r="6" stroke="none" fill="${t.color}"/></svg>`, e += `<b>${f(B.value.formatter, t.value, h({
-						p: B.value.valuePrefix,
+					e += `<div style="width:100%;text-align:center;border-bottom:1px solid ${V.value.tooltipBorderColor};padding-bottom:6px;margin-bottom:3px;">${t.name}</div>`, e += `<div style="display:flex;flex-direction:row;gap:6px;align-items:center;"><svg viewBox="0 0 12 12" height="14" width="14"><circle cx="6" cy="6" r="6" stroke="none" fill="${t.color}"/></svg>`, e += `<b>${f(V.value.formatter, t.value, h({
+						p: V.value.valuePrefix,
 						v: t.value,
-						s: B.value.valueSuffix,
-						r: B.value.dataLabelRoundingValue
+						s: V.value.valueSuffix,
+						r: V.value.dataLabelRoundingValue
 					}), {
 						datapoint: t,
 						seriesIndex: n
 					})}</b>`, e += `<span>(${h({
 						v: t.proportion * 100,
 						s: "%",
-						r: B.value.dataLabelRoundingPercentage
+						r: V.value.dataLabelRoundingPercentage
 					})})</span></div>`, On.value = `<div>${e}</div>`;
 				}
 				L.value = !0;
 			}
 			function o({ datapoint: e, seriesIndex: t }) {
-				B.value.events.datapointLeave && B.value.events.datapointLeave({
+				V.value.events.datapointLeave && V.value.events.datapointLeave({
 					datapoint: e,
 					seriesIndex: t
-				}), L.value = !1, R.value = null, J.value = null, V.value = null, H.value = "pointer";
+				}), L.value = !1, R.value = null, J.value = null, H.value = null, Hn.value = "pointer";
 			}
 			function s({ datapoint: e, seriesIndex: t }) {
-				B.value.events.datapointClick && B.value.events.datapointClick({
+				V.value.events.datapointClick && V.value.events.datapointClick({
 					datapoint: e,
 					seriesIndex: t
 				}), W("selectDatapoint", e);
@@ -749,7 +749,7 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 				value: e.value || 0,
 				absoluteValue: tr.value.dataset.find((t, n) => `donut_${n}` === e.id).VALUE,
 				shape: "circle"
-			})), d = q.value.width / 2, p = q.value.height / 2, ne = q.value.height * B.value.donutRadiusRatio;
+			})), d = q.value.width / 2, p = q.value.height / 2, ne = q.value.height * V.value.donutRadiusRatio;
 			return {
 				dataset: u.filter((e) => !z.value.includes(e.id)),
 				legend: u,
@@ -776,7 +776,7 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 		let wr = E(null);
 		async function Tr() {
 			await Ae(), await Ae();
-			let { zoomStartIndex: e, zoomEndIndex: t } = B.value, n = wr.value;
+			let { zoomStartIndex: e, zoomEndIndex: t } = V.value, n = wr.value;
 			(e != null || t != null) && n ? (e != null && n.setStartValue(e), t != null && n.setEndValue(Er(t + 1))) : (X.value = {
 				start: 0,
 				end: G.value.maxSeriesLength
@@ -784,10 +784,10 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 		}
 		function Er(e) {
 			let t = G.value.maxSeriesLength;
-			return e > t ? t : e < 0 || B.value.zoomStartIndex !== null && e < B.value.zoomStartIndex ? B.value.zoomStartIndex === null ? 1 : B.value.zoomStartIndex + 1 : e;
+			return e > t ? t : e < 0 || V.value.zoomStartIndex !== null && e < V.value.zoomStartIndex ? V.value.zoomStartIndex === null ? 1 : V.value.zoomStartIndex + 1 : e;
 		}
 		let Dr = v(() => {
-			if (!B.value.zoomMinimap.show || K.value === M.DONUT) return [];
+			if (!V.value.zoomMinimap.show || K.value === M.DONUT) return [];
 			let e = [];
 			N(G.value.dataset) && (e = G.value.dataset), He(G.value.dataset) && (e = G.value.dataset.map((e, t) => ({
 				values: e.VALUE || e.DATA || e.SERIE || e.SERIES || e.VALUES || e.NUM || 0,
@@ -801,7 +801,7 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 		});
 		function Or() {
 			let e = 0;
-			return Ln.value && (e = Array.from(Ln.value.querySelectorAll("text")).reduce((e, t) => {
+			return In.value && (e = Array.from(In.value.querySelectorAll("text")).reduce((e, t) => {
 				let n = t.getComputedTextLength();
 				return n > e ? n : e;
 			}, 0)), e + 4;
@@ -810,7 +810,7 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 			kr.value = e;
 		}, 100);
 		Le((e) => {
-			let t = In.value;
+			let t = B.value;
 			if (!t) return;
 			let n = new ResizeObserver((e) => {
 				Ar(e[0].contentRect.height);
@@ -821,31 +821,31 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 		});
 		let jr = v(() => {
 			let e = 0;
-			return In.value && (e = kr.value), 0 + e;
+			return B.value && (e = kr.value), 0 + e;
 		}), Z = v(() => {
 			if (K.value !== M.LINE) return null;
 			let e = {
 				height: q.value.height,
 				width: q.value.width
 			}, t = Or();
-			if (In.value) {
-				let e = In.value.getBBox().x;
+			if (B.value) {
+				let e = B.value.getBBox().x;
 				e < 0 && (t += Math.abs(e));
 			}
 			let n = {
-				left: t + B.value.xyPaddingLeft,
-				top: B.value.xyPaddingTop,
-				right: e.width - B.value.xyPaddingRight,
-				bottom: e.height - B.value.xyPaddingBottom - jr.value,
-				width: Math.max(10, e.width - B.value.xyPaddingLeft - B.value.xyPaddingRight - t),
-				height: Math.max(10, e.height - B.value.xyPaddingTop - B.value.xyPaddingBottom - jr.value)
+				left: t + V.value.xyPaddingLeft,
+				top: V.value.xyPaddingTop,
+				right: e.width - V.value.xyPaddingRight,
+				bottom: e.height - V.value.xyPaddingBottom - jr.value,
+				width: Math.max(10, e.width - V.value.xyPaddingLeft - V.value.xyPaddingRight - t),
+				height: Math.max(10, e.height - V.value.xyPaddingTop - V.value.xyPaddingBottom - jr.value)
 			}, r = [];
 			N(G.value.dataset) && (r = [{
 				values: G.value.dataset.slice(X.value.start, X.value.end),
 				absoluteValues: G.value.dataset,
 				absoluteIndices: G.value.dataset.map((e, t) => t).slice(X.value.start, X.value.end),
-				name: B.value.title,
-				color: er.value[B.value.paletteStartIndex] || m[B.value.paletteStartIndex],
+				name: V.value.title,
+				color: er.value[V.value.paletteStartIndex] || m[V.value.paletteStartIndex],
 				id: "line_0"
 			}]), He(G.value.dataset) && (r = G.value.dataset.map((e, t) => ({
 				...e,
@@ -854,7 +854,7 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 				id: `line_${t}`
 			})).map((e, t) => ({
 				...e,
-				color: e.COLOR ? ee(e.COLOR) : er.value[t + B.value.paletteStartIndex] || m[t + B.value.paletteStartIndex] || m[(t + B.value.paletteStartIndex) % m.length],
+				color: e.COLOR ? te(e.COLOR) : er.value[t + V.value.paletteStartIndex] || m[t + V.value.paletteStartIndex] || m[(t + V.value.paletteStartIndex) % m.length],
 				values: e.values.slice(X.value.start, X.value.end),
 				absoluteValues: e.values,
 				absoluteIndices: e.values.map((e, t) => t).slice(X.value.start, X.value.end)
@@ -863,7 +863,7 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 				max: Math.max(...r.filter((e) => !z.value.includes(e.id)).flatMap((e) => e.values)),
 				min: Math.min(...r.filter((e) => !z.value.includes(e.id)).flatMap((e) => e.values)),
 				maxSeries: Math.max(...r.map((e) => e.values.length))
-			}, a = i.max === i.min ? d(i.min, i.min + 1, B.value.xyScaleSegments) : d(i.min < 0 ? i.min : 0, i.max < 0 ? 0 : i.max, B.value.xyScaleSegments), o = i.min < 0 ? Math.abs(i.min) : 0, s = i.max < 0 ? n.top : n.bottom - o / (a.max + o) * n.height, c = n.width / i.maxSeries, l = a.ticks.map((e) => ({
+			}, a = i.max === i.min ? d(i.min, i.min + 1, V.value.xyScaleSegments) : d(i.min < 0 ? i.min : 0, i.max < 0 ? 0 : i.max, V.value.xyScaleSegments), o = i.min < 0 ? Math.abs(i.min) : 0, s = i.max < 0 ? n.top : n.bottom - o / (a.max + o) * n.height, c = n.width / i.maxSeries, l = a.ticks.map((e) => ({
 				y: n.bottom - n.height * ((e + o) / (a.max + o)),
 				x: n.left - 8,
 				value: e
@@ -892,41 +892,41 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 				})).filter((e) => !z.value.includes(e.id));
 			}
 			function ne(e, t = "pointer") {
-				R.value = e, J.value = e, V.value = e, H.value = t;
+				R.value = e, J.value = e, H.value = e, Hn.value = t;
 				let n = p(e);
 				Dn.value = {
 					datapoint: n,
 					seriesIndex: e,
-					config: B.value,
+					config: V.value,
 					dataset: r
 				};
-				let i = B.value.tooltipCustomFormat;
-				if (B.value.events.datapointEnter && B.value.events.datapointEnter({
+				let i = V.value.tooltipCustomFormat;
+				if (V.value.events.datapointEnter && V.value.events.datapointEnter({
 					datapoint: n,
 					seriesIndex: e + X.value.start
-				}), ae(i) && te(() => i({
+				}), ae(i) && ee(() => i({
 					datapoint: n,
 					seriesIndex: e,
 					series: r,
-					config: B.value
+					config: V.value
 				}))) On.value = i({
 					datapoint: n,
 					seriesIndex: e,
 					series: r,
-					config: B.value
+					config: V.value
 				});
 				else {
 					let e = "";
-					$.value[n[0].absoluteIndex] && (e += `<div style="border-bottom:1px solid ${B.value.tooltipBorderColor};padding-bottom:6px;margin-bottom:3px;">${$.value[n[0].absoluteIndex].text}</div>`), n.forEach((t, n) => {
+					$.value[n[0].absoluteIndex] && (e += `<div style="border-bottom:1px solid ${V.value.tooltipBorderColor};padding-bottom:6px;margin-bottom:3px;">${$.value[n[0].absoluteIndex].text}</div>`), n.forEach((t, n) => {
 						e += `
                     <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="${t.color}"/></svg>
                         <span>${t.name}:</span>
-                        <b>${f(B.value.formatter, t.value, h({
-							p: B.value.valuePrefix,
+                        <b>${f(V.value.formatter, t.value, h({
+							p: V.value.valuePrefix,
 							v: t.value,
-							s: B.value.valueSuffix,
-							r: B.value.dataLabelRoundingValue
+							s: V.value.valueSuffix,
+							r: V.value.dataLabelRoundingValue
 						}), {
 							datapoint: t,
 							seriesIndex: n
@@ -940,14 +940,14 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 			}
 			function re(e) {
 				let t = p(e);
-				B.value.events.datapointLeave && B.value.events.datapointLeave({
+				V.value.events.datapointLeave && V.value.events.datapointLeave({
 					datapoint: t,
 					seriesIndex: e + X.value.start
-				}), R.value = null, J.value = null, L.value = !1, V.value = null, H.value = "pointer";
+				}), R.value = null, J.value = null, L.value = !1, H.value = null, Hn.value = "pointer";
 			}
 			function ie(e) {
 				let t = p(e);
-				B.value.events.datapointClick && B.value.events.datapointClick({
+				V.value.events.datapointClick && V.value.events.datapointClick({
 					datapoint: t,
 					seriesIndex: e + X.value.start
 				}), W("selectDatapoint", t);
@@ -970,24 +970,24 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 				height: q.value.height,
 				width: q.value.width
 			}, t = Or();
-			if (In.value) {
-				let e = In.value.getBBox().x;
+			if (B.value) {
+				let e = B.value.getBBox().x;
 				e < 0 && (t += Math.abs(e));
 			}
 			let n = {
-				left: t + B.value.xyPaddingLeft,
-				top: B.value.xyPaddingTop,
-				right: e.width - B.value.xyPaddingRight,
-				bottom: e.height - B.value.xyPaddingBottom - jr.value,
-				width: Math.max(10, e.width - B.value.xyPaddingLeft - B.value.xyPaddingRight - t),
-				height: Math.max(10, e.height - B.value.xyPaddingTop - B.value.xyPaddingBottom - jr.value)
+				left: t + V.value.xyPaddingLeft,
+				top: V.value.xyPaddingTop,
+				right: e.width - V.value.xyPaddingRight,
+				bottom: e.height - V.value.xyPaddingBottom - jr.value,
+				width: Math.max(10, e.width - V.value.xyPaddingLeft - V.value.xyPaddingRight - t),
+				height: Math.max(10, e.height - V.value.xyPaddingTop - V.value.xyPaddingBottom - jr.value)
 			}, r = [];
 			N(G.value.dataset) && (r = [{
 				values: G.value.dataset.slice(X.value.start, X.value.end),
 				absoluteValues: G.value.dataset,
 				absoluteIndices: G.value.dataset.map((e, t) => t).slice(X.value.start, X.value.end),
-				name: B.value.title,
-				color: er.value[B.value.paletteStartIndex] || m[B.value.paletteStartIndex],
+				name: V.value.title,
+				color: er.value[V.value.paletteStartIndex] || m[V.value.paletteStartIndex],
 				id: "bar_0"
 			}]), He(G.value.dataset) && (r = G.value.dataset.map((e, t) => ({
 				...e,
@@ -996,7 +996,7 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 				id: `bar_${t}`
 			})).map((e, t) => ({
 				...e,
-				color: e.COLOR ? ee(e.COLOR) : er.value[t + B.value.paletteStartIndex] || m[t + B.value.paletteStartIndex] || m[(t + B.value.paletteStartIndex) % m.length],
+				color: e.COLOR ? te(e.COLOR) : er.value[t + V.value.paletteStartIndex] || m[t + V.value.paletteStartIndex] || m[(t + V.value.paletteStartIndex) % m.length],
 				values: e.values.slice(X.value.start, X.value.end),
 				absoluteValues: e.values,
 				absoluteIndices: e.values.map((e, t) => t).slice(X.value.start, X.value.end)
@@ -1005,7 +1005,7 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 				max: Math.max(...r.filter((e) => !z.value.includes(e.id)).flatMap((e) => e.values)) < 0 ? 0 : Math.max(...r.filter((e) => !z.value.includes(e.id)).flatMap((e) => e.values)) ?? 1,
 				min: Math.min(...r.filter((e) => !z.value.includes(e.id)).flatMap((e) => e.values)) ?? 0,
 				maxSeries: Math.max(...r.filter((e) => !z.value.includes(e.id)).map((e) => e.values.length)) ?? 0
-			}, a = i.min === i.max ? d(i.min, i.min + 1, B.value.xyScaleSegments) : d(i.min < 0 ? i.min : 0, i.max, B.value.xyScaleSegments), o = a.min < 0 ? Math.abs(a.min) : 0, s = n.bottom - o / (a.max + o) * n.height, c = n.width / i.maxSeries, l = a.ticks.map((e) => ({
+			}, a = i.min === i.max ? d(i.min, i.min + 1, V.value.xyScaleSegments) : d(i.min < 0 ? i.min : 0, i.max, V.value.xyScaleSegments), o = a.min < 0 ? Math.abs(a.min) : 0, s = n.bottom - o / (a.max + o) * n.height, c = n.width / i.maxSeries, l = a.ticks.map((e) => ({
 				y: n.bottom - n.height * ((e + o) / (a.max + o)),
 				x: n.left - 8,
 				value: e
@@ -1013,25 +1013,25 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 				...e,
 				shape: "square",
 				coordinates: e.values.map((e, a) => {
-					let l = (e + o) / (i.max + o) * n.height, ee = Math.abs(e) / Math.abs(i.min) * (n.height - s), u = o / (i.max + o) * n.height, d = c / r.filter((e) => !z.value.includes(e.id)).length - B.value.barGap / r.filter((e) => !z.value.includes(e.id)).length;
+					let l = (e + o) / (i.max + o) * n.height, ee = Math.abs(e) / Math.abs(i.min) * (n.height - s), te = o / (i.max + o) * n.height, u = c / r.filter((e) => !z.value.includes(e.id)).length - V.value.barGap / r.filter((e) => !z.value.includes(e.id)).length;
 					return {
-						x: n.left + c * a + d * t + B.value.barGap / 2,
+						x: n.left + c * a + u * t + V.value.barGap / 2,
 						y: e > 0 ? n.bottom - l : s,
-						height: e > 0 ? l - u : ee,
+						height: e > 0 ? l - te : ee,
 						value: e,
-						width: d
+						width: u
 					};
 				})
 			})), p = r.filter((e) => !z.value.includes(e.id)).map((e, t) => ({
 				...e,
 				coordinates: e.values.map((e, a) => {
-					let l = (e + o) / (i.max + o) * n.height, ee = Math.abs(e) / (i.max + o) * n.height, u = o / (i.max + o) * n.height, d = c / r.filter((e) => !z.value.includes(e.id)).length - B.value.barGap / r.filter((e) => !z.value.includes(e.id)).length;
+					let l = (e + o) / (i.max + o) * n.height, ee = Math.abs(e) / (i.max + o) * n.height, te = o / (i.max + o) * n.height, u = c / r.filter((e) => !z.value.includes(e.id)).length - V.value.barGap / r.filter((e) => !z.value.includes(e.id)).length;
 					return {
-						x: n.left + c * a + d * t + B.value.barGap / 2,
+						x: n.left + c * a + u * t + V.value.barGap / 2,
 						y: e > 0 ? n.bottom - l : s,
-						height: e > 0 ? l - u : ee,
+						height: e > 0 ? l - te : ee,
 						value: e,
-						width: d
+						width: u
 					};
 				})
 			}));
@@ -1043,41 +1043,41 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 				})).filter((e) => !z.value.includes(e.id));
 			}
 			function re(e, t = "pointer") {
-				R.value = e, J.value = e, V.value = e, H.value = t;
+				R.value = e, J.value = e, H.value = e, Hn.value = t;
 				let n = ne(e);
 				Dn.value = {
 					datapoint: n,
 					seriesIndex: e,
-					config: B.value,
+					config: V.value,
 					dataset: r
 				};
-				let i = B.value.tooltipCustomFormat;
-				if (B.value.events.datapointEnter && B.value.events.datapointEnter({
+				let i = V.value.tooltipCustomFormat;
+				if (V.value.events.datapointEnter && V.value.events.datapointEnter({
 					datapoint: n,
 					seriesIndex: e + X.value.start
-				}), ae(i) && te(() => i({
+				}), ae(i) && ee(() => i({
 					datapoint: n,
 					seriesIndex: e,
 					series: r,
-					config: B.value
+					config: V.value
 				}))) On.value = i({
 					point: n,
 					seriesIndex: e,
 					series: r,
-					config: B.value
+					config: V.value
 				});
 				else {
 					let e = "";
-					$.value[n[0].absoluteIndex] && (e += `<div style="border-bottom:1px solid ${B.value.tooltipBorderColor};padding-bottom:6px;margin-bottom:3px;">${$.value[n[0].absoluteIndex].text}</div>`), n.forEach((t, n) => {
+					$.value[n[0].absoluteIndex] && (e += `<div style="border-bottom:1px solid ${V.value.tooltipBorderColor};padding-bottom:6px;margin-bottom:3px;">${$.value[n[0].absoluteIndex].text}</div>`), n.forEach((t, n) => {
 						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="${t.color}"/></svg>
                         <span>${t.name}:</span>
-                        <b>${f(B.value.formatter, t.value, h({
-							p: B.value.valuePrefix,
+                        <b>${f(V.value.formatter, t.value, h({
+							p: V.value.valuePrefix,
 							v: t.value,
-							s: B.value.valueSuffix,
-							r: B.value.dataLabelRoundingValue
+							s: V.value.valueSuffix,
+							r: V.value.dataLabelRoundingValue
 						}), {
 							datapoint: t,
 							seriesIndex: n
@@ -1091,14 +1091,14 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 			}
 			function ie(e) {
 				let t = ne(e);
-				B.value.events.datapointLeave && B.value.events.datapointLeave({
+				V.value.events.datapointLeave && V.value.events.datapointLeave({
 					datapoint: t,
 					seriesIndex: e + X.value.start
-				}), L.value = !1, R.value = null, J.value = null, V.value = null, H.value = "pointer";
+				}), L.value = !1, R.value = null, J.value = null, H.value = null, Hn.value = "pointer";
 			}
 			function g(e) {
 				let t = ne(e);
-				B.value.events.datapointClick && B.value.events.datapointClick({
+				V.value.events.datapointClick && V.value.events.datapointClick({
 					datapoint: t,
 					seriesIndex: e + X.value.start
 				}), W("selectDatapoint", t);
@@ -1162,25 +1162,25 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 			return a.push(o), a;
 		}
 		function Lr({ pathDuration: e, pathEasing: t = "ease-in-out", pointDuration: n, labelDuration: r, pointDelay: i = 0, labelDelay: a = 0, pointStep: o = 0, labelStep: s = 0, intraSeriesStep: c = 0 } = {}) {
-			let l = Array.isArray(Pn?.value) ? Pn.value : [Pn?.value].filter(Boolean), ee = Array.isArray(Fn?.value) ? Fn.value : [Fn?.value].filter(Boolean), u = [...l, ...ee].filter(Boolean), d = F?.value || null, f = d ? Array.from(d.querySelectorAll(".vue-ui-quick-chart-plot")) : [], p = d ? Array.from(d.querySelectorAll(".vue-ui-quick-chart-label")) : [];
-			u.forEach(Mr), Nr(f, {
+			let l = Array.isArray(Pn?.value) ? Pn.value : [Pn?.value].filter(Boolean), ee = Array.isArray(Fn?.value) ? Fn.value : [Fn?.value].filter(Boolean), te = [...l, ...ee].filter(Boolean), u = F?.value || null, d = u ? Array.from(u.querySelectorAll(".vue-ui-quick-chart-plot")) : [], f = u ? Array.from(u.querySelectorAll(".vue-ui-quick-chart-label")) : [];
+			te.forEach(Mr), Nr(d, {
 				fromOpacity: "0",
 				fromScale: "0.75"
-			}), Nr(p, {
+			}), Nr(f, {
 				fromOpacity: "0",
 				fromScale: "0.98"
-			}), f.forEach((e) => e.classList.remove("quick-animation")), p.forEach((e) => e.classList.remove("quick-animation")), d && d.offsetWidth;
-			let m = f.length ? Ir(f, Pr) : [], te = p.length ? Ir(p, Fr) : [];
+			}), d.forEach((e) => e.classList.remove("quick-animation")), f.forEach((e) => e.classList.remove("quick-animation")), u && u.offsetWidth;
+			let p = d.length ? Ir(d, Pr) : [], m = f.length ? Ir(f, Fr) : [];
 			requestAnimationFrame(() => {
 				requestAnimationFrame(() => {
-					u.forEach((n) => {
+					te.forEach((n) => {
 						n.style.transition = `stroke-dashoffset ${e}ms ${t}`, n.style.strokeDashoffset = "0";
-					}), m.forEach((e, t) => {
+					}), p.forEach((e, t) => {
 						e.items.forEach((e, r) => {
 							let a = i + t * o + r * c;
 							e.style.transition = `opacity ${n}ms ease-out ${a}ms, transform ${n}ms ease-out ${a}ms`, e.style.opacity = "1", e.style.transform = "scale(1)";
 						});
-					}), te.forEach((e, t) => {
+					}), m.forEach((e, t) => {
 						e.items.forEach((e, n) => {
 							let i = a + t * s + n * c;
 							e.style.transition = `opacity ${r}ms ease-out ${i}ms, transform ${r}ms ease-out ${i}ms`, e.style.opacity = "1", e.style.transform = "scale(1)";
@@ -1207,9 +1207,9 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 			let e = ++zr;
 			(async () => {
 				let t = await oe({
-					values: B.value.xyPeriods,
+					values: V.value.xyPeriods,
 					maxDatapoints: G.value.maxSeriesLength,
-					formatter: B.value.datetimeFormatter,
+					formatter: V.value.datetimeFormatter,
 					start: X.value.start,
 					end: X.value.end
 				});
@@ -1217,8 +1217,8 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 			})();
 		});
 		let Br = v(() => {
-			let e = B.value.xyPeriodsModulo;
-			return B.value.xyPeriods.length ? Math.min(e, [...new Set($.value.map((e) => e.text))].length) : e;
+			let e = V.value.xyPeriodsModulo;
+			return V.value.xyPeriods.length ? Math.min(e, [...new Set($.value.map((e) => e.text))].length) : e;
 		}), Vr = E(!1);
 		function Hr(e) {
 			Vr.value = e, jn.value += 1;
@@ -1241,7 +1241,7 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 			return {
 				imageUri: i,
 				base64: a,
-				title: B.value.title,
+				title: V.value.title,
 				width: t,
 				height: n,
 				aspectRatio: r
@@ -1249,32 +1249,32 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 		}
 		let qr = v(() => q.value.width), Jr = v(() => q.value.height);
 		me({
-			timeLabelsEls: In,
+			timeLabelsEls: B,
 			timeLabels: $,
 			slicer: X,
-			configRef: B,
+			configRef: V,
 			rotationPath: ["xyPeriodLabelsRotation"],
 			autoRotatePath: ["xyPeriodLabelsAutoRotate", "enable"],
 			isAutoSize: !1,
-			rotation: B.value.xyPeriodLabelsAutoRotate.angle,
+			rotation: V.value.xyPeriodLabelsAutoRotate.angle,
 			height: Jr.value,
 			width: qr.value
 		});
-		let Yr = v(() => B.value.backgroundColor), Xr = v(() => K.value === M.DONUT ? Y.value.legend : K.value === M.LINE ? Z.value.legend : Q.value.legend), Zr = v(() => ({
-			show: B.value.showLegend,
+		let Yr = v(() => V.value.backgroundColor), Xr = v(() => K.value === M.DONUT ? Y.value.legend : K.value === M.LINE ? Z.value.legend : Q.value.legend), Zr = v(() => ({
+			show: V.value.showLegend,
 			bold: !1,
-			backgroundColor: B.value.backgroundColor,
-			color: B.value.color,
-			fontSize: B.value.legendFontSize,
-			position: B.value.legendPosition
+			backgroundColor: V.value.backgroundColor,
+			color: V.value.color,
+			fontSize: V.value.legendFontSize,
+			position: V.value.legendPosition
 		})), { exportSvg: Qr, getSvg: $r } = de({
 			svg: qn,
 			title: v(() => ({
-				text: B.value.title,
-				color: B.value.color,
-				fontSize: B.value.titleFontSize,
-				bold: B.value.titleBold,
-				textAlign: B.value.titleTextAlign,
+				text: V.value.title,
+				color: V.value.color,
+				fontSize: V.value.titleFontSize,
+				bold: V.value.titleBold,
+				textAlign: V.value.titleTextAlign,
 				subtitle: { text: "" }
 			})),
 			legend: Zr,
@@ -1284,7 +1284,7 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 		async function ei({ isCb: e }) {
 			if (e) {
 				let { blob: e, url: t, text: n, dataUrl: r } = await $r();
-				B.value.userOptionsCallbacks.svg({
+				V.value.userOptionsCallbacks.svg({
 					blob: e,
 					url: t,
 					text: n,
@@ -1294,18 +1294,18 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 		}
 		async function ti() {
 			if (W("copyAlt", {
-				config: B.value,
+				config: V.value,
 				dataset: {
 					line: Z.value,
 					bar: Q.value,
 					donut: Y.value
 				}
-			}), !B.value.userOptionsCallbacks.altCopy) {
+			}), !V.value.userOptionsCallbacks.altCopy) {
 				console.warn("Vue Data UI - A callback must be set for `altCopy` in userOptions.");
 				return;
 			}
-			await Promise.resolve(B.value.userOptionsCallbacks.altCopy({
-				config: B.value,
+			await Promise.resolve(V.value.userOptionsCallbacks.altCopy({
+				config: V.value,
 				dataset: {
 					line: Z.value,
 					bar: Q.value,
@@ -1318,41 +1318,41 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 		}
 		let ri = v(() => K.value === M.DONUT ? Y.value?.chart?.length ?? 0 : K.value === M.LINE ? Z.value?.extremes?.maxSeries ?? 0 : K.value === M.BAR ? Q.value?.extremes?.maxSeries ?? 0 : 0);
 		function ii() {
-			V.value = null, Un.value = !0;
+			H.value = null, Un.value = !0;
 		}
 		function ai() {
-			V.value = null, H.value = "pointer", L.value = !1, R.value = null, J.value = null, Un.value = !1;
+			H.value = null, Hn.value = "pointer", L.value = !1, R.value = null, J.value = null, Un.value = !1;
 		}
 		function oi(e) {
 			if (!qn.value || Wr.value || document.activeElement !== qn.value || !ri.value) return;
 			let t = e.key === "ArrowLeft", n = e.key === "ArrowRight", r = e.key === "Enter" || e.key === " ", i = e.key === "Escape";
 			if (!t && !n && !r && !i) return;
 			if (e.preventDefault(), e.stopPropagation(), i) {
-				V.value = null, H.value = "pointer", L.value = !1, R.value = null, J.value = null;
+				H.value = null, Hn.value = "pointer", L.value = !1, R.value = null, J.value = null;
 				return;
 			}
 			if (r) {
-				if (V.value === null) return;
+				if (H.value === null) return;
 				if (K.value === M.DONUT) {
-					let e = Y.value?.chart?.[V.value];
+					let e = Y.value?.chart?.[H.value];
 					if (!e) return;
 					Y.value.selectDatapoint({
 						datapoint: e,
-						seriesIndex: V.value
+						seriesIndex: H.value
 					});
 					return;
 				}
 				if (K.value === M.LINE) {
-					Z.value?.selectDatapoint(V.value);
+					Z.value?.selectDatapoint(H.value);
 					return;
 				}
 				if (K.value === M.BAR) {
-					Q.value?.selectDatapoint(V.value);
+					Q.value?.selectDatapoint(H.value);
 					return;
 				}
 				return;
 			}
-			let a = V.value, o = J.value, s = a !== null && a >= 0 && a < ri.value, c = o !== null && o >= 0 && o < ri.value;
+			let a = H.value, o = J.value, s = a !== null && a >= 0 && a < ri.value, c = o !== null && o >= 0 && o < ri.value;
 			if (s ? n ? (a += 1, a >= ri.value && (a = 0)) : t && (--a, a < 0 && (a = ri.value - 1)) : c ? (a = n ? o + 1 : o - 1, a >= ri.value && (a = 0), a < 0 && (a = ri.value - 1)) : a = n ? 0 : ri.value - 1, K.value === M.DONUT) {
 				let e = Y.value?.chart?.[a];
 				if (!e) return;
@@ -1388,7 +1388,7 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 				t = r.left + i * (e + 1) - i / 2, n = r.top + r.height / 2;
 			}
 			let r = qn.value.getBoundingClientRect();
-			Hn.value = {
+			Vn.value = {
 				x: r.left + t / q.value.width * r.width,
 				y: r.top + n / q.value.height * r.height
 			};
@@ -1404,15 +1404,15 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 					let t = Y.value?.total ? h({
 						v: e.value / Y.value.total * 100,
 						s: "%",
-						r: B.value.dataLabelRoundingPercentage
+						r: V.value.dataLabelRoundingPercentage
 					}) : "0%";
 					return [
 						e.name,
-						f(B.value.formatter, e.value, h({
-							p: B.value.valuePrefix,
+						f(V.value.formatter, e.value, h({
+							p: V.value.valuePrefix,
 							v: e.value,
-							s: B.value.valueSuffix,
-							r: B.value.dataLabelRoundingValue
+							s: V.value.valueSuffix,
+							r: V.value.dataLabelRoundingValue
 						})),
 						t
 					];
@@ -1424,11 +1424,11 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 					headers: ["Index", ...e.map((e) => e.name)],
 					rows: Array.from({ length: t }, (t, n) => [$.value?.[n + X.value.start]?.text ?? String(n + X.value.start), ...e.map((e) => {
 						let t = e.values?.[n];
-						return f(B.value.formatter, t, h({
-							p: B.value.valuePrefix,
+						return f(V.value.formatter, t, h({
+							p: V.value.valuePrefix,
 							v: t,
-							s: B.value.valueSuffix,
-							r: B.value.dataLabelRoundingValue
+							s: V.value.valueSuffix,
+							r: V.value.dataLabelRoundingValue
 						}));
 					})])
 				};
@@ -1457,21 +1457,21 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 				"vue-ui-quick-chart": !0,
 				"vue-data-ui-wrapper-fullscreen": Vr.value
 			}),
-			style: w(`background:${B.value.backgroundColor};color:${B.value.color};font-family:${B.value.fontFamily}; position: relative; ${B.value.responsive ? "height: 100%" : ""}`),
+			style: w(`background:${V.value.backgroundColor};color:${V.value.color};font-family:${V.value.fontFamily}; position: relative; ${V.value.responsive ? "height: 100%" : ""}`),
 			onMouseenter: t[2] ||= () => Qn(!0),
 			onMouseleave: t[3] ||= () => Qn(!1)
 		}, [
 			x("div", {
 				id: `chart-instructions-${I.value}`,
 				class: "sr-only"
-			}, [x("p", null, k(B.value.a11y.translations.keyboardNavigation), 1)], 8, Xe),
+			}, [x("p", null, k(V.value.a11y.translations.keyboardNavigation), 1)], 8, Xe),
 			ci.value.rows.length ? (T(), Te(be, {
 				key: 0,
 				uid: I.value,
 				head: ci.value.headers,
 				body: ci.value.rows,
-				notice: B.value.a11y.translations.tableAvailable,
-				caption: B.value.a11y.translations.tableCaption
+				notice: V.value.a11y.translations.tableAvailable,
+				caption: V.value.a11y.translations.tableCaption
 			}, null, 8, [
 				"uid",
 				"head",
@@ -1479,13 +1479,13 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 				"notice",
 				"caption"
 			])) : y("", !0),
-			B.value.userOptionsButtons.annotator ? (T(), Te(A(Ue), {
+			V.value.userOptionsButtons.annotator ? (T(), Te(A(Ue), {
 				key: 1,
 				svgRef: A(qn),
-				backgroundColor: B.value.backgroundColor,
-				color: B.value.color,
+				backgroundColor: V.value.backgroundColor,
+				color: V.value.color,
 				active: Wr.value,
-				isCursorPointer: Vn.value,
+				isCursorPointer: Bn.value,
 				onClose: Gr
 			}, {
 				"annotator-action-close": j(() => [O(e.$slots, "annotator-action-close", {}, void 0, !0)]),
@@ -1509,31 +1509,31 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 				class: "vue-data-ui-no-title-space",
 				style: "height:36px; width: 100%;background:transparent"
 			}, null, 512)) : y("", !0),
-			B.value.showUserOptions && (Yn.value || Xn.value) ? (T(), Te(A(Ge), {
+			V.value.showUserOptions && (Yn.value || Xn.value) ? (T(), Te(A(Ge), {
 				ref: "details",
 				key: `user_option_${jn.value}`,
-				backgroundColor: B.value.backgroundColor,
-				color: B.value.color,
+				backgroundColor: V.value.backgroundColor,
+				color: V.value.color,
 				isPrinting: A(rr),
 				isImaging: A(ir),
 				uid: I.value,
-				hasTooltip: B.value.userOptionsButtons.tooltip && B.value.showTooltip,
-				hasPdf: B.value.userOptionsButtons.pdf,
-				hasImg: B.value.userOptionsButtons.img,
-				hasSvg: B.value.userOptionsButtons.svg,
-				hasFullscreen: B.value.userOptionsButtons.fullscreen,
-				hasAltCopy: B.value.userOptionsButtons.altCopy,
+				hasTooltip: V.value.userOptionsButtons.tooltip && V.value.showTooltip,
+				hasPdf: V.value.userOptionsButtons.pdf,
+				hasImg: V.value.userOptionsButtons.img,
+				hasSvg: V.value.userOptionsButtons.svg,
+				hasFullscreen: V.value.userOptionsButtons.fullscreen,
+				hasAltCopy: V.value.userOptionsButtons.altCopy,
 				hasXls: !1,
 				isTooltip: cr.value.showTooltip,
 				isFullscreen: Vr.value,
-				titles: { ...B.value.userOptionsButtonTitles },
+				titles: { ...V.value.userOptionsButtonTitles },
 				chartElement: F.value,
-				position: B.value.userOptionsPosition,
-				hasAnnotator: B.value.userOptionsButtons.annotator,
+				position: V.value.userOptionsPosition,
+				hasAnnotator: V.value.userOptionsButtons.annotator,
 				isAnnotation: Wr.value,
-				callbacks: B.value.userOptionsCallbacks,
-				printScale: B.value.userOptionsPrint.scale,
-				isCursorPointer: Vn.value,
+				callbacks: V.value.userOptionsCallbacks,
+				printScale: V.value.userOptionsPrint.scale,
+				isCursorPointer: Bn.value,
 				onToggleFullscreen: Hr,
 				onGeneratePdf: A(ar),
 				onGenerateImage: A(or),
@@ -1628,13 +1628,13 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 				"onGenerateImage",
 				"style"
 			])) : y("", !0),
-			B.value.title ? (T(), b("div", {
+			V.value.title ? (T(), b("div", {
 				key: 4,
 				ref_key: "quickChartTitle",
 				ref: wn,
 				class: "vue-ui-quick-chart-title",
-				style: w(`background:transparent;color:${B.value.color};font-size:${B.value.titleFontSize}px;font-weight:${B.value.titleBold ? "bold" : "normal"};text-align:${B.value.titleTextAlign}`)
-			}, k(B.value.title), 5)) : y("", !0),
+				style: w(`background:transparent;color:${V.value.color};font-size:${V.value.titleFontSize}px;font-weight:${V.value.titleBold ? "bold" : "normal"};text-align:${V.value.titleTextAlign}`)
+			}, k(V.value.title), 5)) : y("", !0),
 			x("div", { id: `legend-top-${I.value}` }, null, 8, Ze),
 			x("div", Qe, [K.value ? (T(), b("svg", {
 				key: 0,
@@ -1643,7 +1643,7 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 				xmlns: A(re),
 				"aria-describedby": `chart-instructions-${I.value}`,
 				viewBox: fr.value,
-				style: w(`max-width:100%;overflow:visible;background:transparent;color:${B.value.color}`),
+				style: w(`max-width:100%;overflow:visible;background:transparent;color:${V.value.color}`),
 				tabindex: "0",
 				onFocus: ii,
 				onBlur: ai,
@@ -1695,17 +1695,17 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 					dy: "0",
 					stdDeviation: "10",
 					"flood-opacity": "0.5",
-					"flood-color": B.value.donutShadowColor
+					"flood-color": V.value.donutShadowColor
 				}, null, 8, ot)], 8, at)]),
 				K.value === M.DONUT ? (T(), b(_, { key: 3 }, [
-					B.value.showDataLabels ? (T(), b("g", st, [(T(!0), b(_, null, D(Y.value.chart, (e, t) => (T(), b(_, null, [Y.value.isArcBigEnough(e) ? (T(), b("path", {
+					V.value.showDataLabels ? (T(), b("g", st, [(T(!0), b(_, null, D(Y.value.chart, (e, t) => (T(), b(_, null, [Y.value.isArcBigEnough(e) ? (T(), b("path", {
 						key: 0,
 						d: A(ne)(e, {
 							x: q.value.width / 2,
 							y: q.value.height / 2
-						}, 16, 16, !1, !1, q.value.height * Sr.value, 12, B.value.donutCurvedMarkers),
+						}, 16, 16, !1, !1, q.value.height * Sr.value, 12, V.value.donutCurvedMarkers),
 						stroke: e.color,
-						"stroke-width": B.value.donutLabelMarkerStrokeWidth,
+						"stroke-width": V.value.donutLabelMarkerStrokeWidth,
 						"stroke-linecap": "round",
 						"stroke-linejoin": "round",
 						fill: "none",
@@ -1715,14 +1715,14 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 						cx: Y.value.cx,
 						cy: Y.value.cy,
 						r: Y.value.radius,
-						fill: B.value.backgroundColor,
-						filter: B.value.donutUseShadow ? `url(#shadow_${I.value})` : ""
+						fill: V.value.backgroundColor,
+						filter: V.value.donutUseShadow ? `url(#shadow_${I.value})` : ""
 					}, null, 8, lt),
 					x("g", ut, [(T(!0), b(_, null, D(Y.value.chart, (e, t) => (T(), b("path", {
 						d: e.arcSlice,
 						fill: e.color,
-						stroke: B.value.donutStroke || B.value.backgroundColor,
-						"stroke-width": B.value.donutStrokeWidth,
+						stroke: V.value.donutStroke || V.value.backgroundColor,
+						"stroke-width": V.value.donutStrokeWidth,
 						filter: mr(e.id)
 					}, null, 8, dt))), 256)), (T(!0), b(_, null, D(Y.value.chart, (e, t) => (T(), b("path", {
 						d: e.arcSlice,
@@ -1741,13 +1741,13 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 							seriesIndex: t
 						})
 					}, null, 40, ft))), 256))]),
-					B.value.showDataLabels ? (T(), b("g", pt, [(T(!0), b(_, null, D(Y.value.chart, (e, t) => (T(), b(_, null, [
+					V.value.showDataLabels ? (T(), b("g", pt, [(T(!0), b(_, null, D(Y.value.chart, (e, t) => (T(), b(_, null, [
 						Y.value.isArcBigEnough(e) ? (T(), b("circle", {
 							key: 0,
 							cx: A(ie)(e).x,
 							cy: A(u)(e) - 3.7,
 							fill: e.color,
-							stroke: B.value.backgroundColor,
+							stroke: V.value.backgroundColor,
 							"stroke-width": 1,
 							r: 3,
 							filter: mr(e.id)
@@ -1757,14 +1757,14 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 							"text-anchor": A(ie)(e, !0, 20).anchor,
 							x: A(ie)(e, !0).x,
 							y: A(u)(e),
-							fill: B.value.color,
-							"font-size": B.value.dataLabelFontSize,
+							fill: V.value.color,
+							"font-size": V.value.dataLabelFontSize,
 							filter: mr(e.id)
-						}, k(Y.value.displayArcPercentage(e, Y.value.chart)) + " (" + k(A(f)(B.value.formatter, e.value, A(h)({
-							p: B.value.valuePrefix,
+						}, k(Y.value.displayArcPercentage(e, Y.value.chart)) + " (" + k(A(f)(V.value.formatter, e.value, A(h)({
+							p: V.value.valuePrefix,
 							v: e.value,
-							s: B.value.valueSuffix,
-							r: B.value.dataLabelRoundingValue
+							s: V.value.valueSuffix,
+							r: V.value.dataLabelRoundingValue
 						}), {
 							datapoint: e,
 							seriesIndex: t
@@ -1773,143 +1773,143 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 							key: 2,
 							"text-anchor": A(ie)(e).anchor,
 							x: A(ie)(e, !0).x,
-							y: A(u)(e) + B.value.dataLabelFontSize,
-							fill: B.value.color,
-							"font-size": B.value.dataLabelFontSize,
+							y: A(u)(e) + V.value.dataLabelFontSize,
+							fill: V.value.color,
+							"font-size": V.value.dataLabelFontSize,
 							filter: mr(e.id)
 						}, k(e.name), 9, gt)) : y("", !0)
 					], 64))), 256))])) : y("", !0),
-					B.value.donutShowTotal ? (T(), b("g", _t, [x("text", {
+					V.value.donutShowTotal ? (T(), b("g", _t, [x("text", {
 						"text-anchor": "middle",
 						x: Y.value.drawingArea.centerX,
-						y: Y.value.drawingArea.centerY - B.value.donutTotalLabelFontSize / 2,
-						"font-size": B.value.donutTotalLabelFontSize,
-						fill: B.value.color
-					}, k(B.value.donutTotalLabelText), 9, vt), x("text", {
+						y: Y.value.drawingArea.centerY - V.value.donutTotalLabelFontSize / 2,
+						"font-size": V.value.donutTotalLabelFontSize,
+						fill: V.value.color
+					}, k(V.value.donutTotalLabelText), 9, vt), x("text", {
 						"text-anchor": "middle",
 						x: Y.value.drawingArea.centerX,
-						y: Y.value.drawingArea.centerY + B.value.donutTotalLabelFontSize,
-						"font-size": B.value.donutTotalLabelFontSize,
-						fill: B.value.color
+						y: Y.value.drawingArea.centerY + V.value.donutTotalLabelFontSize,
+						"font-size": V.value.donutTotalLabelFontSize,
+						fill: V.value.color
 					}, k(A(h)({
-						p: B.value.valuePrefix,
+						p: V.value.valuePrefix,
 						v: Y.value.total,
-						s: B.value.valueSuffix,
-						r: B.value.dataLabelRoundingValue
+						s: V.value.valueSuffix,
+						r: V.value.dataLabelRoundingValue
 					})), 9, yt)])) : y("", !0)
 				], 64)) : y("", !0),
 				K.value === M.LINE ? (T(), b(_, { key: 4 }, [
-					B.value.xyShowGrid ? (T(), b("g", bt, [(T(!0), b(_, null, D(Z.value.yLabels, (e) => (T(), b(_, null, [e.y <= Z.value.drawingArea.bottom ? (T(), b("line", {
+					V.value.xyShowGrid ? (T(), b("g", bt, [(T(!0), b(_, null, D(Z.value.yLabels, (e) => (T(), b(_, null, [e.y <= Z.value.drawingArea.bottom ? (T(), b("line", {
 						key: 0,
 						x1: Z.value.drawingArea.left,
 						x2: Z.value.drawingArea.right,
 						y1: e.y,
 						y2: e.y,
-						stroke: B.value.xyGridStroke,
-						"stroke-width": B.value.xyGridStrokeWidth,
+						stroke: V.value.xyGridStroke,
+						"stroke-width": V.value.xyGridStrokeWidth,
 						"stroke-linecap": "round"
 					}, null, 8, xt)) : y("", !0)], 64))), 256)), (T(!0), b(_, null, D(Z.value.extremes.maxSeries + 1, (e, t) => (T(), b("line", {
 						x1: Z.value.drawingArea.left + Z.value.slotSize * t,
 						x2: Z.value.drawingArea.left + Z.value.slotSize * t,
 						y1: Z.value.drawingArea.top,
 						y2: Z.value.drawingArea.bottom,
-						stroke: B.value.xyGridStroke,
-						"stroke-width": B.value.xyGridStrokeWidth,
+						stroke: V.value.xyGridStroke,
+						"stroke-width": V.value.xyGridStrokeWidth,
 						"stroke-linecap": "round"
 					}, null, 8, St))), 256))])) : y("", !0),
-					B.value.xyShowAxis ? (T(), b("g", Ct, [x("line", {
+					V.value.xyShowAxis ? (T(), b("g", Ct, [x("line", {
 						x1: Z.value.drawingArea.left,
 						x2: Z.value.drawingArea.left,
 						y1: Z.value.drawingArea.top,
 						y2: Z.value.drawingArea.bottom,
-						stroke: B.value.xyAxisStroke,
-						"stroke-width": B.value.xyAxisStrokeWidth,
+						stroke: V.value.xyAxisStroke,
+						"stroke-width": V.value.xyAxisStrokeWidth,
 						"stroke-linecap": "round"
 					}, null, 8, wt), x("line", {
 						x1: Z.value.drawingArea.left,
 						x2: Z.value.drawingArea.right,
 						y1: isNaN(Z.value.absoluteZero) ? Z.value.drawingArea.bottom : Z.value.absoluteZero,
 						y2: isNaN(Z.value.absoluteZero) ? Z.value.drawingArea.bottom : Z.value.absoluteZero,
-						stroke: B.value.xyAxisStroke,
-						"stroke-width": B.value.xyAxisStrokeWidth,
+						stroke: V.value.xyAxisStroke,
+						"stroke-width": V.value.xyAxisStrokeWidth,
 						"stroke-linecap": "round"
 					}, null, 8, Tt)])) : y("", !0),
-					B.value.xyShowScale ? (T(), b("g", {
+					V.value.xyShowScale ? (T(), b("g", {
 						key: 2,
 						class: "yLabels",
 						ref_key: "scaleLabels",
-						ref: Ln
+						ref: In
 					}, [(T(!0), b(_, null, D(Z.value.yLabels, (e, t) => (T(), b(_, null, [e.y <= Z.value.drawingArea.bottom ? (T(), b("line", {
 						key: 0,
 						x1: e.x + 4,
 						x2: Z.value.drawingArea.left,
 						y1: e.y,
 						y2: e.y,
-						stroke: B.value.xyAxisStroke,
-						"stroke-width": B.value.xyAxisStrokeWidth,
+						stroke: V.value.xyAxisStroke,
+						"stroke-width": V.value.xyAxisStrokeWidth,
 						"stroke-linecap": "round"
 					}, null, 8, Et)) : y("", !0), e.y <= Z.value.drawingArea.bottom ? (T(), b("text", {
 						key: 1,
 						x: e.x,
-						y: e.y + B.value.xyLabelsYFontSize / 3,
+						y: e.y + V.value.xyLabelsYFontSize / 3,
 						"text-anchor": "end",
-						"font-size": B.value.xyLabelsYFontSize,
-						fill: B.value.color
-					}, k(A(f)(B.value.formatter, e.value, A(h)({
-						p: B.value.valuePrefix,
+						"font-size": V.value.xyLabelsYFontSize,
+						fill: V.value.color
+					}, k(A(f)(V.value.formatter, e.value, A(h)({
+						p: V.value.valuePrefix,
 						v: e.value,
-						s: B.value.valueSuffix,
-						r: B.value.dataLabelRoundingValue
+						s: V.value.valueSuffix,
+						r: V.value.dataLabelRoundingValue
 					}), {
 						datapoint: e,
 						seriesIndex: t
 					})), 9, Dt)) : y("", !0)], 64))), 256))], 512)) : y("", !0),
-					B.value.xyShowScale && B.value.xyPeriods.length ? (T(), b("g", Ot, [(T(!0), b(_, null, D($.value.map((e) => e.text), (e, t) => (T(), b(_, null, [!B.value.xyPeriodsShowOnlyAtModulo || B.value.xyPeriodsShowOnlyAtModulo && t % Math.floor((X.value.end - X.value.start) / Br.value) === 0 || X.value.end - X.value.start <= Br.value ? (T(), b("line", {
+					V.value.xyShowScale && V.value.xyPeriods.length ? (T(), b("g", Ot, [(T(!0), b(_, null, D($.value.map((e) => e.text), (e, t) => (T(), b(_, null, [!V.value.xyPeriodsShowOnlyAtModulo || V.value.xyPeriodsShowOnlyAtModulo && t % Math.floor((X.value.end - X.value.start) / Br.value) === 0 || X.value.end - X.value.start <= Br.value ? (T(), b("line", {
 						key: 0,
 						x1: Z.value.drawingArea.left + Z.value.slotSize * (t + 1) - Z.value.slotSize / 2,
 						x2: Z.value.drawingArea.left + Z.value.slotSize * (t + 1) - Z.value.slotSize / 2,
 						y1: Z.value.drawingArea.bottom,
 						y2: Z.value.drawingArea.bottom + 4,
-						stroke: B.value.xyAxisStroke,
-						"stroke-width": B.value.xyAxisStrokeWidth,
+						stroke: V.value.xyAxisStroke,
+						"stroke-width": V.value.xyAxisStrokeWidth,
 						"stroke-linecap": "round"
 					}, null, 8, kt)) : y("", !0)], 64))), 256)), x("g", {
 						ref_key: "timeLabelsEls",
-						ref: In
-					}, [(T(!0), b(_, null, D($.value.map((e) => e.text), (e, t) => (T(), b(_, null, [!B.value.xyPeriodsShowOnlyAtModulo || B.value.xyPeriodsShowOnlyAtModulo && t % Math.floor((X.value.end - X.value.start) / Br.value) === 0 || X.value.end - X.value.start <= Br.value ? (T(), b("g", At, [String(e).includes("\n") ? (T(), b("text", {
+						ref: B
+					}, [(T(!0), b(_, null, D($.value.map((e) => e.text), (e, t) => (T(), b(_, null, [!V.value.xyPeriodsShowOnlyAtModulo || V.value.xyPeriodsShowOnlyAtModulo && t % Math.floor((X.value.end - X.value.start) / Br.value) === 0 || X.value.end - X.value.start <= Br.value ? (T(), b("g", At, [String(e).includes("\n") ? (T(), b("text", {
 						key: 1,
 						class: "vue-data-ui-time-label",
-						"font-size": B.value.xyLabelsXFontSize,
-						"text-anchor": B.value.xyPeriodLabelsRotation > 0 ? "start" : B.value.xyPeriodLabelsRotation < 0 ? "end" : "middle",
-						fill: B.value.color,
-						transform: `translate(${Z.value.drawingArea.left + Z.value.slotSize * (t + 1) - Z.value.slotSize / 2}, ${Z.value.drawingArea.bottom + B.value.xyLabelsXFontSize + 6}), rotate(${B.value.xyPeriodLabelsRotation})`,
+						"font-size": V.value.xyLabelsXFontSize,
+						"text-anchor": V.value.xyPeriodLabelsRotation > 0 ? "start" : V.value.xyPeriodLabelsRotation < 0 ? "end" : "middle",
+						fill: V.value.color,
+						transform: `translate(${Z.value.drawingArea.left + Z.value.slotSize * (t + 1) - Z.value.slotSize / 2}, ${Z.value.drawingArea.bottom + V.value.xyLabelsXFontSize + 6}), rotate(${V.value.xyPeriodLabelsRotation})`,
 						innerHTML: A(i)({
 							content: String(e),
-							fontSize: B.value.xyLabelsXFontSize,
-							fill: B.value.color,
+							fontSize: V.value.xyLabelsXFontSize,
+							fill: V.value.color,
 							x: 0,
 							y: 0
 						})
 					}, null, 8, Mt)) : (T(), b("text", {
 						key: 0,
 						class: "vue-data-ui-time-label",
-						"font-size": B.value.xyLabelsXFontSize,
-						"text-anchor": B.value.xyPeriodLabelsRotation > 0 ? "start" : B.value.xyPeriodLabelsRotation < 0 ? "end" : "middle",
-						fill: B.value.color,
-						transform: `translate(${Z.value.drawingArea.left + Z.value.slotSize * (t + 1) - Z.value.slotSize / 2}, ${Z.value.drawingArea.bottom + B.value.xyLabelsXFontSize + 6}), rotate(${B.value.xyPeriodLabelsRotation})`
+						"font-size": V.value.xyLabelsXFontSize,
+						"text-anchor": V.value.xyPeriodLabelsRotation > 0 ? "start" : V.value.xyPeriodLabelsRotation < 0 ? "end" : "middle",
+						fill: V.value.color,
+						transform: `translate(${Z.value.drawingArea.left + Z.value.slotSize * (t + 1) - Z.value.slotSize / 2}, ${Z.value.drawingArea.bottom + V.value.xyLabelsXFontSize + 6}), rotate(${V.value.xyPeriodLabelsRotation})`
 					}, k(e), 9, jt))])) : y("", !0)], 64))), 256))], 512)])) : y("", !0),
-					x("g", Nt, [(T(!0), b(_, null, D(Z.value.dataset, (e, t) => (T(), b("g", Pt, [B.value.lineSmooth ? (T(), b(_, { key: 0 }, [x("path", {
+					x("g", Nt, [(T(!0), b(_, null, D(Z.value.dataset, (e, t) => (T(), b("g", Pt, [V.value.lineSmooth ? (T(), b(_, { key: 0 }, [x("path", {
 						ref_for: !0,
 						ref_key: "pathWrapper",
 						ref: Pn,
 						d: `M ${A(p)(e.coordinates)}`,
-						stroke: B.value.backgroundColor,
-						"stroke-width": B.value.lineStrokeWidth + 1,
+						stroke: V.value.backgroundColor,
+						"stroke-width": V.value.lineStrokeWidth + 1,
 						"stroke-linecap": "round",
 						fill: "none",
 						class: je({
 							"quick-animation": !A(U),
-							"vue-data-ui-line-animated": B.value.lineAnimated && !A(U)
+							"vue-data-ui-line-animated": V.value.lineAnimated && !A(U)
 						}),
 						style: w({ transition: A(U) ? void 0 : "all 0.3s ease-in-out" })
 					}, null, 14, Ft), x("path", {
@@ -1918,12 +1918,12 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 						ref: Fn,
 						d: `M ${A(p)(e.coordinates)}`,
 						stroke: e.color,
-						"stroke-width": B.value.lineStrokeWidth,
+						"stroke-width": V.value.lineStrokeWidth,
 						"stroke-linecap": "round",
 						fill: "none",
 						class: je({
 							"quick-animation": !A(U),
-							"vue-data-ui-line-animated": B.value.lineAnimated && !A(U)
+							"vue-data-ui-line-animated": V.value.lineAnimated && !A(U)
 						}),
 						style: w({ transition: A(U) ? void 0 : "all 0.3s ease-in-out" })
 					}, null, 14, It)], 64)) : (T(), b(_, { key: 1 }, [x("path", {
@@ -1931,13 +1931,13 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 						ref_key: "pathWrapper",
 						ref: Pn,
 						d: `M ${e.linePath}`,
-						stroke: B.value.backgroundColor,
-						"stroke-width": B.value.lineStrokeWidth + 1,
+						stroke: V.value.backgroundColor,
+						"stroke-width": V.value.lineStrokeWidth + 1,
 						"stroke-linecap": "round",
 						fill: "none",
 						class: je({
 							"quick-animation": !A(U),
-							"vue-data-ui-line-animated": B.value.lineAnimated && !A(U)
+							"vue-data-ui-line-animated": V.value.lineAnimated && !A(U)
 						}),
 						style: w({ transition: A(U) ? void 0 : "all 0.3s ease-in-out" })
 					}, null, 14, Lt), x("path", {
@@ -1946,12 +1946,12 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 						ref: Fn,
 						d: `M ${e.linePath}`,
 						stroke: e.color,
-						"stroke-width": B.value.lineStrokeWidth,
+						"stroke-width": V.value.lineStrokeWidth,
 						"stroke-linecap": "round",
 						fill: "none",
 						class: je({
 							"quick-animation": !A(U),
-							"vue-data-ui-line-animated": B.value.lineAnimated && !A(U)
+							"vue-data-ui-line-animated": V.value.lineAnimated && !A(U)
 						}),
 						style: w({ transition: A(U) ? void 0 : "all 0.3s ease-in-out" })
 					}, null, 14, Rt)], 64)), (T(!0), b(_, null, D(e.coordinates, (t, n) => (T(), b("circle", {
@@ -1959,7 +1959,7 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 						cy: A(g)(t.y),
 						r: 3,
 						fill: e.color,
-						stroke: B.value.backgroundColor,
+						stroke: V.value.backgroundColor,
 						"stroke-width": "0.5",
 						class: je({
 							"vue-ui-quick-chart-plot": !0,
@@ -1967,22 +1967,22 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 						}),
 						style: w({ transition: A(U) ? void 0 : "all 0.3s ease-in-out" })
 					}, null, 14, zt))), 256))]))), 256))]),
-					B.value.showDataLabels ? (T(), b("g", Bt, [(T(!0), b(_, null, D(Z.value.dataset, (e, t) => (T(), b(_, null, [(T(!0), b(_, null, D(e.coordinates, (t, n) => (T(), b("text", {
+					V.value.showDataLabels ? (T(), b("g", Bt, [(T(!0), b(_, null, D(Z.value.dataset, (e, t) => (T(), b(_, null, [(T(!0), b(_, null, D(e.coordinates, (t, n) => (T(), b("text", {
 						"text-anchor": "middle",
-						"font-size": B.value.dataLabelFontSize,
+						"font-size": V.value.dataLabelFontSize,
 						fill: e.color,
 						x: t.x,
-						y: A(g)(t.y) - B.value.dataLabelFontSize / 2,
+						y: A(g)(t.y) - V.value.dataLabelFontSize / 2,
 						class: je({
 							"vue-ui-quick-chart-label": !0,
 							"quick-animation": !A(U)
 						}),
 						style: w({ transition: A(U) ? void 0 : "all 0.3s ease-in-out" })
-					}, k(A(f)(B.value.formatter, A(g)(t.value), A(h)({
-						p: B.value.valuePrefix,
+					}, k(A(f)(V.value.formatter, A(g)(t.value), A(h)({
+						p: V.value.valuePrefix,
 						v: A(g)(t.value),
-						s: B.value.valueSuffix,
-						r: B.value.dataLabelRoundingValue
+						s: V.value.valueSuffix,
+						r: V.value.dataLabelRoundingValue
 					}), {
 						datapoint: t,
 						seriesIndex: n
@@ -1992,111 +1992,111 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 						y: Z.value.drawingArea.top,
 						height: Z.value.drawingArea.height <= 0 ? 1e-5 : Z.value.drawingArea.height,
 						width: Z.value.slotSize <= 0 ? 1e-5 : Z.value.slotSize,
-						fill: [R.value, J.value].includes(t) ? B.value.xyHighlighterColor : "transparent",
-						style: w(`opacity:${B.value.xyHighlighterOpacity}`),
+						fill: [R.value, J.value].includes(t) ? V.value.xyHighlighterColor : "transparent",
+						style: w(`opacity:${V.value.xyHighlighterOpacity}`),
 						onMouseenter: (e) => Z.value.useTooltip(t, "pointer"),
 						onMouseleave: (e) => Z.value.killTooltip(t),
 						onClick: (e) => Z.value.selectDatapoint(t)
 					}, null, 44, Ut))), 256))])) : y("", !0)
 				], 64)) : y("", !0),
 				K.value === M.BAR ? (T(), b(_, { key: 5 }, [
-					B.value.xyShowGrid ? (T(), b("g", Wt, [(T(!0), b(_, null, D(Q.value.yLabels, (e) => (T(), b(_, null, [e.y <= Q.value.drawingArea.bottom ? (T(), b("line", {
+					V.value.xyShowGrid ? (T(), b("g", Wt, [(T(!0), b(_, null, D(Q.value.yLabels, (e) => (T(), b(_, null, [e.y <= Q.value.drawingArea.bottom ? (T(), b("line", {
 						key: 0,
 						x1: Q.value.drawingArea.left,
 						x2: Q.value.drawingArea.right,
 						y1: e.y,
 						y2: e.y,
-						stroke: B.value.xyGridStroke,
-						"stroke-width": B.value.xyGridStrokeWidth,
+						stroke: V.value.xyGridStroke,
+						"stroke-width": V.value.xyGridStrokeWidth,
 						"stroke-linecap": "round"
 					}, null, 8, Gt)) : y("", !0)], 64))), 256)), z.value.length < Q.value.legend.length ? (T(!0), b(_, { key: 0 }, D(Q.value.extremes.maxSeries + 1, (e, t) => (T(), b("line", {
 						x1: Q.value.drawingArea.left + Q.value.slotSize * t,
 						x2: Q.value.drawingArea.left + Q.value.slotSize * t,
 						y1: Q.value.drawingArea.top,
 						y2: Q.value.drawingArea.bottom,
-						stroke: B.value.xyGridStroke,
-						"stroke-width": B.value.xyGridStrokeWidth,
+						stroke: V.value.xyGridStroke,
+						"stroke-width": V.value.xyGridStrokeWidth,
 						"stroke-linecap": "round"
 					}, null, 8, Kt))), 256)) : y("", !0)])) : y("", !0),
-					B.value.xyShowAxis ? (T(), b("g", qt, [x("line", {
+					V.value.xyShowAxis ? (T(), b("g", qt, [x("line", {
 						x1: Q.value.drawingArea.left,
 						x2: Q.value.drawingArea.left,
 						y1: Q.value.drawingArea.top,
 						y2: Q.value.drawingArea.bottom,
-						stroke: B.value.xyAxisStroke,
-						"stroke-width": B.value.xyAxisStrokeWidth,
+						stroke: V.value.xyAxisStroke,
+						"stroke-width": V.value.xyAxisStrokeWidth,
 						"stroke-linecap": "round"
 					}, null, 8, Jt), x("line", {
 						x1: Q.value.drawingArea.left,
 						x2: Q.value.drawingArea.right,
 						y1: isNaN(Q.value.absoluteZero) ? Q.value.drawingArea.bottom : Q.value.absoluteZero,
 						y2: isNaN(Q.value.absoluteZero) ? Q.value.drawingArea.bottom : Q.value.absoluteZero,
-						stroke: B.value.xyAxisStroke,
-						"stroke-width": B.value.xyAxisStrokeWidth,
+						stroke: V.value.xyAxisStroke,
+						"stroke-width": V.value.xyAxisStrokeWidth,
 						"stroke-linecap": "round"
 					}, null, 8, Yt)])) : y("", !0),
-					B.value.xyShowScale ? (T(), b("g", {
+					V.value.xyShowScale ? (T(), b("g", {
 						key: 2,
 						class: "yLabels",
 						ref_key: "scaleLabels",
-						ref: Ln
+						ref: In
 					}, [(T(!0), b(_, null, D(Q.value.yLabels, (e, t) => (T(), b(_, null, [e.y <= Q.value.drawingArea.bottom ? (T(), b("line", {
 						key: 0,
 						x1: e.x + 4,
 						x2: Q.value.drawingArea.left,
 						y1: e.y,
 						y2: e.y,
-						stroke: B.value.xyAxisStroke,
-						"stroke-width": B.value.xyAxisStrokeWidth,
+						stroke: V.value.xyAxisStroke,
+						"stroke-width": V.value.xyAxisStrokeWidth,
 						"stroke-linecap": "round"
 					}, null, 8, Xt)) : y("", !0), e.y <= Q.value.drawingArea.bottom ? (T(), b("text", {
 						key: 1,
 						x: e.x,
-						y: e.y + B.value.xyLabelsYFontSize / 3,
+						y: e.y + V.value.xyLabelsYFontSize / 3,
 						"text-anchor": "end",
-						"font-size": B.value.xyLabelsYFontSize,
-						fill: B.value.color
-					}, k(A(f)(B.value.formatter, e.value, A(h)({
-						p: B.value.valuePrefix,
+						"font-size": V.value.xyLabelsYFontSize,
+						fill: V.value.color
+					}, k(A(f)(V.value.formatter, e.value, A(h)({
+						p: V.value.valuePrefix,
 						v: e.value,
-						s: B.value.valueSuffix,
-						r: B.value.dataLabelRoundingValue
+						s: V.value.valueSuffix,
+						r: V.value.dataLabelRoundingValue
 					}), {
 						datapoint: e,
 						seriesIndex: t
 					})), 9, Zt)) : y("", !0)], 64))), 256))], 512)) : y("", !0),
-					B.value.xyShowScale && B.value.xyPeriods.length ? (T(), b("g", Qt, [(T(!0), b(_, null, D(B.value.xyPeriods.slice(X.value.start, X.value.end), (e, t) => (T(), b("line", {
+					V.value.xyShowScale && V.value.xyPeriods.length ? (T(), b("g", Qt, [(T(!0), b(_, null, D(V.value.xyPeriods.slice(X.value.start, X.value.end), (e, t) => (T(), b("line", {
 						x1: Q.value.drawingArea.left + Q.value.slotSize * (t + 1) - Q.value.slotSize / 2,
 						x2: Q.value.drawingArea.left + Q.value.slotSize * (t + 1) - Q.value.slotSize / 2,
 						y1: Q.value.drawingArea.bottom,
 						y2: Q.value.drawingArea.bottom + 4,
-						stroke: B.value.xyAxisStroke,
-						"stroke-width": B.value.xyAxisStrokeWidth,
+						stroke: V.value.xyAxisStroke,
+						"stroke-width": V.value.xyAxisStrokeWidth,
 						"stroke-linecap": "round"
 					}, null, 8, $t))), 256)), x("g", {
 						ref_key: "timeLabelsEls",
-						ref: In
-					}, [(T(!0), b(_, null, D($.value.map((e) => e.text), (e, t) => (T(), b(_, null, [!B.value.xyPeriodsShowOnlyAtModulo || B.value.xyPeriodsShowOnlyAtModulo && t % Math.floor((X.value.end - X.value.start) / Br.value) === 0 || X.value.end - X.value.start <= Br.value ? (T(), b("g", en, [String(e).includes("\n") ? (T(), b("text", {
+						ref: B
+					}, [(T(!0), b(_, null, D($.value.map((e) => e.text), (e, t) => (T(), b(_, null, [!V.value.xyPeriodsShowOnlyAtModulo || V.value.xyPeriodsShowOnlyAtModulo && t % Math.floor((X.value.end - X.value.start) / Br.value) === 0 || X.value.end - X.value.start <= Br.value ? (T(), b("g", en, [String(e).includes("\n") ? (T(), b("text", {
 						key: 1,
 						class: "vue-data-ui-time-label",
-						"font-size": B.value.xyLabelsXFontSize,
-						"text-anchor": B.value.xyPeriodLabelsRotation > 0 ? "start" : B.value.xyPeriodLabelsRotation < 0 ? "end" : "middle",
-						fill: B.value.color,
-						transform: `translate(${Q.value.drawingArea.left + Q.value.slotSize * (t + 1) - Q.value.slotSize / 2}, ${Q.value.drawingArea.bottom + B.value.xyLabelsXFontSize + 6}), rotate(${B.value.xyPeriodLabelsRotation})`,
+						"font-size": V.value.xyLabelsXFontSize,
+						"text-anchor": V.value.xyPeriodLabelsRotation > 0 ? "start" : V.value.xyPeriodLabelsRotation < 0 ? "end" : "middle",
+						fill: V.value.color,
+						transform: `translate(${Q.value.drawingArea.left + Q.value.slotSize * (t + 1) - Q.value.slotSize / 2}, ${Q.value.drawingArea.bottom + V.value.xyLabelsXFontSize + 6}), rotate(${V.value.xyPeriodLabelsRotation})`,
 						innerHTML: A(i)({
 							content: String(e),
-							fontSize: B.value.xyLabelsXFontSize,
-							fill: B.value.color,
+							fontSize: V.value.xyLabelsXFontSize,
+							fill: V.value.color,
 							x: 0,
 							y: 0
 						})
 					}, null, 8, nn)) : (T(), b("text", {
 						key: 0,
 						class: "vue-data-ui-time-label",
-						"font-size": B.value.xyLabelsXFontSize,
-						"text-anchor": B.value.xyPeriodLabelsRotation > 0 ? "start" : B.value.xyPeriodLabelsRotation < 0 ? "end" : "middle",
-						fill: B.value.color,
-						transform: `translate(${Q.value.drawingArea.left + Q.value.slotSize * (t + 1) - Q.value.slotSize / 2}, ${Q.value.drawingArea.bottom + B.value.xyLabelsXFontSize + 6}), rotate(${B.value.xyPeriodLabelsRotation})`
+						"font-size": V.value.xyLabelsXFontSize,
+						"text-anchor": V.value.xyPeriodLabelsRotation > 0 ? "start" : V.value.xyPeriodLabelsRotation < 0 ? "end" : "middle",
+						fill: V.value.color,
+						transform: `translate(${Q.value.drawingArea.left + Q.value.slotSize * (t + 1) - Q.value.slotSize / 2}, ${Q.value.drawingArea.bottom + V.value.xyLabelsXFontSize + 6}), rotate(${V.value.xyPeriodLabelsRotation})`
 					}, k(e), 9, tn))])) : y("", !0)], 64))), 256))], 512)])) : y("", !0),
 					x("g", rn, [(T(!0), b(_, null, D(Q.value.dataset, (e, t) => (T(), b(_, null, [(T(!0), b(_, null, D(e.coordinates, (t, n) => (T(), b("rect", {
 						x: t.x,
@@ -2104,35 +2104,35 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 						height: A(g)(t.height <= 0 ? 1e-5 : t.height),
 						y: A(g)(t.y),
 						fill: e.color,
-						stroke: B.value.backgroundColor,
-						"stroke-width": B.value.barStrokeWidth,
+						stroke: V.value.backgroundColor,
+						"stroke-width": V.value.barStrokeWidth,
 						"stroke-linecap": "round",
-						class: je({ "vue-data-ui-bar-animated": B.value.barAnimated && t.value < 0 && !A(U) })
-					}, [B.value.barAnimated && t.value > 0 && !A(rr) && !A(ir) ? (T(), b("animate", {
+						class: je({ "vue-data-ui-bar-animated": V.value.barAnimated && t.value < 0 && !A(U) })
+					}, [V.value.barAnimated && t.value > 0 && !A(rr) && !A(ir) ? (T(), b("animate", {
 						key: 0,
 						attributeName: "height",
 						from: 0,
 						to: t.height,
 						dur: "0.5s"
-					}, null, 8, on)) : y("", !0), B.value.barAnimated && t.value > 0 && !A(rr) && !A(ir) ? (T(), b("animate", {
+					}, null, 8, on)) : y("", !0), V.value.barAnimated && t.value > 0 && !A(rr) && !A(ir) ? (T(), b("animate", {
 						key: 1,
 						attributeName: "y",
 						from: Q.value.absoluteZero,
 						to: Q.value.absoluteZero - t.height,
 						dur: "0.5s"
 					}, null, 8, sn)) : y("", !0)], 10, an))), 256))], 64))), 256))]),
-					B.value.showDataLabels ? (T(), b("g", cn, [(T(!0), b(_, null, D(Q.value.dataset, (e, t) => (T(), b(_, null, [(T(!0), b(_, null, D(e.coordinates, (t, n) => (T(), b("text", {
+					V.value.showDataLabels ? (T(), b("g", cn, [(T(!0), b(_, null, D(Q.value.dataset, (e, t) => (T(), b(_, null, [(T(!0), b(_, null, D(e.coordinates, (t, n) => (T(), b("text", {
 						x: t.x + t.width / 2,
-						y: A(g)(t.y) - B.value.dataLabelFontSize / 2,
+						y: A(g)(t.y) - V.value.dataLabelFontSize / 2,
 						"text-anchor": "middle",
-						"font-size": B.value.dataLabelFontSize,
+						"font-size": V.value.dataLabelFontSize,
 						fill: e.color,
 						class: "quick-animation"
-					}, k(A(f)(B.value.formatter, A(g)(t.value), A(h)({
-						p: B.value.valuePrefix,
+					}, k(A(f)(V.value.formatter, A(g)(t.value), A(h)({
+						p: V.value.valuePrefix,
 						v: A(g)(t.value),
-						s: B.value.valueSuffix,
-						r: B.value.dataLabelRoundingValue
+						s: V.value.valueSuffix,
+						r: V.value.dataLabelRoundingValue
 					}), {
 						datapoint: t,
 						seriesIndex: n
@@ -2142,63 +2142,63 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 						y: Q.value.drawingArea.top,
 						height: Q.value.drawingArea.height <= 0 ? 1e-5 : Q.value.drawingArea.height,
 						width: Q.value.slotSize <= 0 ? 1e-5 : Q.value.slotSize,
-						fill: [R.value, J.value].includes(t) ? B.value.xyHighlighterColor : "transparent",
-						style: w(`opacity:${B.value.xyHighlighterOpacity}`),
+						fill: [R.value, J.value].includes(t) ? V.value.xyHighlighterColor : "transparent",
+						style: w(`opacity:${V.value.xyHighlighterOpacity}`),
 						onMouseenter: (e) => Q.value.useTooltip(t, "pointer"),
 						onMouseleave: (e) => Q.value.killTooltip(t),
 						onClick: (e) => Q.value.selectDatapoint(t)
 					}, null, 44, dn))), 256))])) : y("", !0)
 				], 64)) : y("", !0),
 				[M.LINE, M.BAR].includes(K.value) ? (T(), b("g", fn, [
-					B.value.xAxisLabel && K.value === M.LINE ? (T(), b("g", {
+					V.value.xAxisLabel && K.value === M.LINE ? (T(), b("g", {
 						key: 0,
 						ref_key: "xAxisLabel",
-						ref: Rn
+						ref: Ln
 					}, [x("text", {
-						"font-size": B.value.axisLabelsFontSize,
-						fill: B.value.color,
+						"font-size": V.value.axisLabelsFontSize,
+						fill: V.value.color,
 						"text-anchor": "middle",
 						x: Z.value.drawingArea.left + Z.value.drawingArea.width / 2,
-						y: q.value.height - B.value.axisLabelsFontSize / 3
-					}, k(B.value.xAxisLabel), 9, pn)], 512)) : y("", !0),
-					B.value.xAxisLabel && K.value === M.BAR ? (T(), b("g", {
+						y: q.value.height - V.value.axisLabelsFontSize / 3
+					}, k(V.value.xAxisLabel), 9, pn)], 512)) : y("", !0),
+					V.value.xAxisLabel && K.value === M.BAR ? (T(), b("g", {
 						key: 1,
 						ref_key: "xAxisLabel",
-						ref: Rn
+						ref: Ln
 					}, [x("text", {
-						"font-size": B.value.axisLabelsFontSize,
-						fill: B.value.color,
+						"font-size": V.value.axisLabelsFontSize,
+						fill: V.value.color,
 						"text-anchor": "middle",
 						x: Q.value.drawingArea.left + Q.value.drawingArea.width / 2,
-						y: q.value.height - B.value.axisLabelsFontSize / 3
-					}, k(B.value.xAxisLabel), 9, mn)], 512)) : y("", !0),
-					B.value.yAxisLabel && K.value === M.LINE ? (T(), b("g", {
+						y: q.value.height - V.value.axisLabelsFontSize / 3
+					}, k(V.value.xAxisLabel), 9, mn)], 512)) : y("", !0),
+					V.value.yAxisLabel && K.value === M.LINE ? (T(), b("g", {
 						key: 2,
 						ref_key: "yAxisLabel",
-						ref: zn
+						ref: Rn
 					}, [x("text", {
-						"font-size": B.value.axisLabelsFontSize,
-						fill: B.value.color,
-						transform: `translate(${B.value.axisLabelsFontSize}, ${Z.value.drawingArea.top + Z.value.drawingArea.height / 2}) rotate(-90)`,
+						"font-size": V.value.axisLabelsFontSize,
+						fill: V.value.color,
+						transform: `translate(${V.value.axisLabelsFontSize}, ${Z.value.drawingArea.top + Z.value.drawingArea.height / 2}) rotate(-90)`,
 						"text-anchor": "middle"
-					}, k(B.value.yAxisLabel), 9, hn)], 512)) : y("", !0),
-					B.value.yAxisLabel && K.value === M.BAR ? (T(), b("g", {
+					}, k(V.value.yAxisLabel), 9, hn)], 512)) : y("", !0),
+					V.value.yAxisLabel && K.value === M.BAR ? (T(), b("g", {
 						key: 3,
 						ref_key: "yAxisLabel",
-						ref: zn
+						ref: Rn
 					}, [x("text", {
-						"font-size": B.value.axisLabelsFontSize,
-						fill: B.value.color,
-						transform: `translate(${B.value.axisLabelsFontSize}, ${Q.value.drawingArea.top + Q.value.drawingArea.height / 2}) rotate(-90)`,
+						"font-size": V.value.axisLabelsFontSize,
+						fill: V.value.color,
+						transform: `translate(${V.value.axisLabelsFontSize}, ${Q.value.drawingArea.top + Q.value.drawingArea.height / 2}) rotate(-90)`,
 						"text-anchor": "middle"
-					}, k(B.value.yAxisLabel), 9, gn)], 512)) : y("", !0)
+					}, k(V.value.yAxisLabel), 9, gn)], 512)) : y("", !0)
 				])) : y("", !0)
 			], 44, $e)) : y("", !0), e.$slots.hint ? (T(), b("div", _n, [O(e.$slots, "hint", C(S({
-				hint: B.value.a11y.translations.keyboardNavigation,
+				hint: V.value.a11y.translations.keyboardNavigation,
 				isVisible: Un.value
 			})), void 0, !0)])) : y("", !0)]),
 			e.$slots.watermark ? (T(), b("div", vn, [O(e.$slots, "watermark", C(S({ isPrinting: A(rr) || A(ir) })), void 0, !0)])) : y("", !0),
-			[M.BAR, M.LINE].includes(K.value) && B.value.zoomXy && G.value.maxSeriesLength > 1 ? (T(), b("div", {
+			[M.BAR, M.LINE].includes(K.value) && V.value.zoomXy && G.value.maxSeriesLength > 1 ? (T(), b("div", {
 				key: `slicer_${Mn.value}`,
 				ref_key: "quickChartSlicer",
 				ref: En
@@ -2206,50 +2206,50 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 				ref_key: "slicerComponent",
 				ref: wr,
 				key: `slicer_${Mn.value}`,
-				background: B.value.zoomColor,
-				borderColor: B.value.backgroundColor,
-				fontSize: B.value.zoomFontSize,
-				useResetSlot: B.value.zoomUseResetSlot,
-				labelLeft: B.value.xyPeriods[X.value.start] && $.value[0] ? $.value[0].text : "",
-				labelRight: B.value.xyPeriods[X.value.end - 1] && $.value?.length ? $.value.at(-1).text : "",
-				textColor: B.value.color,
-				inputColor: B.value.zoomColor,
-				selectColor: B.value.zoomHighlightColor,
+				background: V.value.zoomColor,
+				borderColor: V.value.backgroundColor,
+				fontSize: V.value.zoomFontSize,
+				useResetSlot: V.value.zoomUseResetSlot,
+				labelLeft: V.value.xyPeriods[X.value.start] && $.value[0] ? $.value[0].text : "",
+				labelRight: V.value.xyPeriods[X.value.end - 1] && $.value?.length ? $.value.at(-1).text : "",
+				textColor: V.value.color,
+				inputColor: V.value.zoomColor,
+				selectColor: V.value.zoomHighlightColor,
 				max: G.value.maxSeriesLength,
 				min: 0,
 				valueStart: X.value.start,
 				valueEnd: X.value.end,
-				smoothMinimap: B.value.zoomMinimap.smooth,
-				minimapSelectedColor: B.value.zoomMinimap.selectedColor,
-				minimapSelectedColorOpacity: B.value.zoomMinimap.selectedColorOpacity,
-				minimapSelectionRadius: B.value.zoomMinimap.selectionRadius,
-				minimapLineColor: B.value.zoomMinimap.lineColor,
+				smoothMinimap: V.value.zoomMinimap.smooth,
+				minimapSelectedColor: V.value.zoomMinimap.selectedColor,
+				minimapSelectedColorOpacity: V.value.zoomMinimap.selectedColorOpacity,
+				minimapSelectionRadius: V.value.zoomMinimap.selectionRadius,
+				minimapLineColor: V.value.zoomMinimap.lineColor,
 				minimap: Dr.value,
-				minimapIndicatorColor: B.value.zoomMinimap.indicatorColor,
-				verticalHandles: B.value.zoomMinimap.verticalHandles,
+				minimapIndicatorColor: V.value.zoomMinimap.indicatorColor,
+				verticalHandles: V.value.zoomMinimap.verticalHandles,
 				minimapSelectedIndex: J.value,
 				start: X.value.start,
 				"onUpdate:start": t[0] ||= (e) => X.value.start = e,
 				end: X.value.end,
 				"onUpdate:end": t[1] ||= (e) => X.value.end = e,
-				refreshStartPoint: B.value.zoomStartIndex === null ? 0 : B.value.zoomStartIndex,
-				refreshEndPoint: B.value.zoomEndIndex === null ? G.value.maxSeriesLength : B.value.zoomEndIndex + 1,
-				enableRangeHandles: B.value.zoomEnableRangeHandles,
-				enableSelectionDrag: B.value.zoomEnableSelectionDrag,
-				minimapCompact: B.value.zoomMinimap.compact,
-				minimapMerged: B.value.zoomMinimap.merged,
+				refreshStartPoint: V.value.zoomStartIndex === null ? 0 : V.value.zoomStartIndex,
+				refreshEndPoint: V.value.zoomEndIndex === null ? G.value.maxSeriesLength : V.value.zoomEndIndex + 1,
+				enableRangeHandles: V.value.zoomEnableRangeHandles,
+				enableSelectionDrag: V.value.zoomEnableSelectionDrag,
+				minimapCompact: V.value.zoomMinimap.compact,
+				minimapMerged: V.value.zoomMinimap.merged,
 				allMinimaps: Rr.value,
-				minimapFrameColor: B.value.zoomMinimap.frameColor,
-				additionalMinimapHeight: B.value.zoomMinimap.additionalHeight,
-				handleType: B.value.zoomMinimap.handleType,
-				handleWidth: B.value.zoomMinimap.handleWidth,
-				handleBorderWidth: B.value.zoomMinimap.handleBorderWidth,
-				handleIconColor: B.value.zoomMinimap.handleIconColor,
-				handleBorderColor: B.value.zoomMinimap.handleBorderColor,
-				handleFill: B.value.zoomMinimap.handleFill,
-				focusOnDrag: B.value.zoomFocusOnDrag,
-				focusRangeRatio: B.value.zoomFocusRangeRatio,
-				maxWidth: B.value.zoomMaxWidth,
+				minimapFrameColor: V.value.zoomMinimap.frameColor,
+				additionalMinimapHeight: V.value.zoomMinimap.additionalHeight,
+				handleType: V.value.zoomMinimap.handleType,
+				handleWidth: V.value.zoomMinimap.handleWidth,
+				handleBorderWidth: V.value.zoomMinimap.handleBorderWidth,
+				handleIconColor: V.value.zoomMinimap.handleIconColor,
+				handleBorderColor: V.value.zoomMinimap.handleBorderColor,
+				handleFill: V.value.zoomMinimap.handleFill,
+				focusOnDrag: V.value.zoomFocusOnDrag,
+				focusRangeRatio: V.value.zoomFocusRangeRatio,
+				maxWidth: V.value.zoomMaxWidth,
 				onReset: Cr,
 				onTrapMouse: xr
 			}, {
@@ -2257,23 +2257,23 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 				_: 3
 			}, 8, /* @__PURE__ */ "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.minimapCompact.minimapMerged.allMinimaps.minimapFrameColor.additionalMinimapHeight.handleType.handleWidth.handleBorderWidth.handleIconColor.handleBorderColor.handleFill.focusOnDrag.focusRangeRatio.maxWidth".split(".")))])) : y("", !0),
 			x("div", { id: `legend-bottom-${I.value}` }, null, 8, yn),
-			Nn.value && B.value.showLegend ? (T(), Te(we, {
+			Nn.value && V.value.showLegend ? (T(), Te(we, {
 				key: 7,
-				to: B.value.legendPosition === "top" ? `#legend-top-${I.value}` : `#legend-bottom-${I.value}`
-			}, [B.value.showLegend ? (T(), b("div", {
+				to: V.value.legendPosition === "top" ? `#legend-top-${I.value}` : `#legend-bottom-${I.value}`
+			}, [V.value.showLegend ? (T(), b("div", {
 				key: 0,
 				ref_key: "quickChartLegend",
 				ref: Tn,
 				class: "vue-ui-quick-chart-legend",
-				style: w(`background:transparent;color:${B.value.color}`)
+				style: w(`background:transparent;color:${V.value.color}`)
 			}, [
-				(Y.value?.legend?.length > 2 || Z.value?.legend?.length > 2 || Q.value?.legend?.length > 2) && B.value.showLegendSelectAllToggle && !A(U) ? (T(), Te(ye, {
+				(Y.value?.legend?.length > 2 || Z.value?.legend?.length > 2 || Q.value?.legend?.length > 2) && V.value.showLegendSelectAllToggle && !A(U) ? (T(), Te(ye, {
 					key: 0,
-					backgroundColor: B.value.legendSelectAllToggleBackgroundColor,
-					color: B.value.legendSelectAllToggleColor,
-					fontSize: B.value.legendFontSize,
+					backgroundColor: V.value.legendSelectAllToggleBackgroundColor,
+					color: V.value.legendSelectAllToggleColor,
+					fontSize: V.value.legendFontSize,
 					checked: z.value.length > 0,
-					isCursorPointer: Vn.value,
+					isCursorPointer: Bn.value,
 					onToggle: hr
 				}, null, 8, [
 					"backgroundColor",
@@ -2285,7 +2285,7 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 				K.value === M.DONUT ? (T(!0), b(_, { key: 1 }, D(Y.value.legend, (t, n) => (T(), b("div", {
 					class: "vue-ui-quick-chart-legend-item",
 					onClick: (e) => br(t, Y.value.dataset),
-					style: w(`cursor: ${Y.value.legend.length > 1 && Vn.value ? "pointer" : "default"}; opacity:${z.value.includes(t.id) ? "0.5" : "1"}`),
+					style: w(`cursor: ${Y.value.legend.length > 1 && Bn.value ? "pointer" : "default"}; opacity:${z.value.includes(t.id) ? "0.5" : "1"}`),
 					role: "button",
 					tabindex: "0",
 					onKeydown: (e) => {
@@ -2293,7 +2293,7 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 							br(t, Y.value.dataset);
 						});
 					}
-				}, [B.value.useCustomLegend ? O(e.$slots, "legend", ke({
+				}, [V.value.useCustomLegend ? O(e.$slots, "legend", ke({
 					key: 0,
 					ref_for: !0
 				}, { legend: {
@@ -2304,37 +2304,37 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 					}
 				} }), void 0, !0) : (T(), b(_, { key: 1 }, [
 					De(A(Be), {
-						name: B.value.legendIcon,
+						name: V.value.legendIcon,
 						stroke: t.color,
-						size: B.value.legendIconSize
+						size: V.value.legendIconSize
 					}, null, 8, [
 						"name",
 						"stroke",
 						"size"
 					]),
-					x("span", { style: w(`font-size:${B.value.legendFontSize}px`) }, k(t.name), 5),
-					x("span", { style: w(`font-size:${B.value.legendFontSize}px;font-variant-numeric:tabular-nums`) }, k(z.value.includes(t.id) ? "-" : A(f)(B.value.formatter, t.absoluteValue, A(h)({
-						p: B.value.valuePrefix,
+					x("span", { style: w(`font-size:${V.value.legendFontSize}px`) }, k(t.name), 5),
+					x("span", { style: w(`font-size:${V.value.legendFontSize}px;font-variant-numeric:tabular-nums`) }, k(z.value.includes(t.id) ? "-" : A(f)(V.value.formatter, t.absoluteValue, A(h)({
+						p: V.value.valuePrefix,
 						v: t.absoluteValue,
-						s: B.value.valueSuffix,
-						r: B.value.dataLabelRoundingValue
+						s: V.value.valueSuffix,
+						r: V.value.dataLabelRoundingValue
 					}), {
 						datapoint: t,
 						seriesIndex: n
 					})), 5),
 					z.value.includes(t.id) ? (T(), b("span", {
 						key: 0,
-						style: w(`font-size:${B.value.legendFontSize}px`)
+						style: w(`font-size:${V.value.legendFontSize}px`)
 					}, " ( - % ) ", 4)) : yr.value ? (T(), b("span", {
 						key: 1,
-						style: w(`font-size:${B.value.legendFontSize}px; font-variant-numeric: tabular-nums;`)
+						style: w(`font-size:${V.value.legendFontSize}px; font-variant-numeric: tabular-nums;`)
 					}, " ( - % ) ", 4)) : (T(), b("span", {
 						key: 2,
-						style: w(`font-size:${B.value.legendFontSize}px; font-variant-numeric: tabular-nums;`)
+						style: w(`font-size:${V.value.legendFontSize}px; font-variant-numeric: tabular-nums;`)
 					}, " (" + k(A(h)({
 						v: t.value / Y.value.total * 100,
 						s: "%",
-						r: B.value.dataLabelRoundingPercentage
+						r: V.value.dataLabelRoundingPercentage
 					})) + ") ", 5))
 				], 64))], 44, bn))), 256)) : y("", !0),
 				K.value === M.LINE ? (T(!0), b(_, { key: 2 }, D(Z.value.legend, (t, n) => (T(), b("div", {
@@ -2342,7 +2342,7 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 					onClick: (e) => {
 						gr(t.id, Z.value.legend.length - 1), W("selectLegend", Z.value.dataset);
 					},
-					style: w(`cursor: ${Z.value.legend.length > 1 && Vn.value ? "pointer" : "default"}; opacity:${z.value.includes(t.id) ? "0.5" : "1"}`),
+					style: w(`cursor: ${Z.value.legend.length > 1 && Bn.value ? "pointer" : "default"}; opacity:${z.value.includes(t.id) ? "0.5" : "1"}`),
 					role: "button",
 					tabindex: "0",
 					onKeydown: (e) => {
@@ -2350,7 +2350,7 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 							gr(t.id, Z.value.legend.length - 1), W("selectLegend", Z.value.dataset);
 						});
 					}
-				}, [B.value.useCustomLegend ? O(e.$slots, "legend", ke({
+				}, [V.value.useCustomLegend ? O(e.$slots, "legend", ke({
 					key: 0,
 					ref_for: !0
 				}, { legend: {
@@ -2360,20 +2360,20 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 						gr(t.id, Z.value.legend.length - 1), W("selectLegend", Z.value.dataset);
 					}
 				} }), void 0, !0) : (T(), b(_, { key: 1 }, [De(A(Be), {
-					name: B.value.legendIcon,
+					name: V.value.legendIcon,
 					stroke: t.color,
-					size: B.value.legendIconSize
+					size: V.value.legendIconSize
 				}, null, 8, [
 					"name",
 					"stroke",
 					"size"
-				]), x("span", { style: w(`font-size:${B.value.legendFontSize}px`) }, k(t.name), 5)], 64))], 44, xn))), 256)) : y("", !0),
+				]), x("span", { style: w(`font-size:${V.value.legendFontSize}px`) }, k(t.name), 5)], 64))], 44, xn))), 256)) : y("", !0),
 				K.value === M.BAR ? (T(!0), b(_, { key: 3 }, D(Q.value.legend, (t, n) => (T(), b("div", {
 					class: "vue-ui-quick-chart-legend-item",
 					onClick: (e) => {
 						gr(t.id, Q.value.legend.length - 1), W("selectLegend", Q.value.dataset);
 					},
-					style: w(`cursor: ${Q.value.legend.length > 1 && Vn.value ? "pointer" : "default"}; opacity:${z.value.includes(t.id) ? "0.5" : "1"}`),
+					style: w(`cursor: ${Q.value.legend.length > 1 && Bn.value ? "pointer" : "default"}; opacity:${z.value.includes(t.id) ? "0.5" : "1"}`),
 					role: "button",
 					tabindex: "0",
 					onKeydown: (e) => {
@@ -2381,7 +2381,7 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 							gr(t.id, Q.value.legend.length - 1), W("selectLegend", Q.value.dataset);
 						});
 					}
-				}, [B.value.useCustomLegend ? O(e.$slots, "legend", ke({
+				}, [V.value.useCustomLegend ? O(e.$slots, "legend", ke({
 					key: 0,
 					ref_for: !0
 				}, { legend: {
@@ -2391,14 +2391,14 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 						gr(t.id, Q.value.legend.length - 1), W("selectLegend", Q.value.dataset);
 					}
 				} }), void 0, !0) : (T(), b(_, { key: 1 }, [De(A(Be), {
-					name: B.value.legendIcon,
+					name: V.value.legendIcon,
 					stroke: t.color,
-					size: B.value.legendIconSize
+					size: V.value.legendIconSize
 				}, null, 8, [
 					"name",
 					"stroke",
 					"size"
-				]), x("span", { style: w(`font-size:${B.value.legendFontSize}px`) }, k(t.name), 5)], 64))], 44, Sn))), 256)) : y("", !0)
+				]), x("span", { style: w(`font-size:${V.value.legendFontSize}px`) }, k(t.name), 5)], 64))], 44, Sn))), 256)) : y("", !0)
 			], 4)) : y("", !0)], 8, ["to"])) : y("", !0),
 			e.$slots.source ? (T(), b("div", {
 				key: 8,
@@ -2407,28 +2407,28 @@ var F = /* @__PURE__ */ e({ default: () => wn }), Ye = ["id"], Xe = ["id"], Ze =
 				dir: "auto"
 			}, [O(e.$slots, "source", {}, void 0, !0)], 512)) : y("", !0),
 			De(A(We), {
-				teleportTo: B.value.tooltipTeleportTo,
+				teleportTo: V.value.tooltipTeleportTo,
 				show: cr.value.showTooltip && L.value,
-				backgroundColor: B.value.backgroundColor,
-				color: B.value.color,
-				borderRadius: B.value.tooltipBorderRadius,
-				borderColor: B.value.tooltipBorderColor,
-				borderWidth: B.value.tooltipBorderWidth,
-				fontSize: B.value.tooltipFontSize,
-				backgroundOpacity: B.value.tooltipBackgroundOpacity,
-				position: B.value.tooltipPosition,
-				offsetX: B.value.tooltipOffsetX,
-				offsetY: B.value.tooltipOffsetY,
+				backgroundColor: V.value.backgroundColor,
+				color: V.value.color,
+				borderRadius: V.value.tooltipBorderRadius,
+				borderColor: V.value.tooltipBorderColor,
+				borderWidth: V.value.tooltipBorderWidth,
+				fontSize: V.value.tooltipFontSize,
+				backgroundOpacity: V.value.tooltipBackgroundOpacity,
+				position: V.value.tooltipPosition,
+				offsetX: V.value.tooltipOffsetX,
+				offsetY: V.value.tooltipOffsetY,
 				parent: F.value,
 				content: On.value,
 				isFullscreen: Vr.value,
-				isCustom: A(ae)(B.value.tooltipCustomFormat),
-				smooth: B.value.tooltipSmooth,
-				smoothForce: B.value.tooltipSmoothForce,
-				smoothSnapThreshold: B.value.tooltipSmoothSnapThreshold,
-				backdropFilter: B.value.tooltipBackdropFilter,
-				isA11yMode: H.value === "keyboard",
-				a11yPosition: Hn.value
+				isCustom: A(ae)(V.value.tooltipCustomFormat),
+				smooth: V.value.tooltipSmooth,
+				smoothForce: V.value.tooltipSmoothForce,
+				smoothSnapThreshold: V.value.tooltipSmoothSnapThreshold,
+				backdropFilter: V.value.tooltipBackdropFilter,
+				isA11yMode: Hn.value === "keyboard",
+				a11yPosition: Vn.value
 			}, {
 				"tooltip-before": j(() => [O(e.$slots, "tooltip-before", C(S({ ...Dn.value })), void 0, !0)]),
 				tooltip: j(() => [O(e.$slots, "tooltip", C(S({ ...Dn.value })), void 0, !0)]),