vue-data-ui 3.20.11 → 3.21.0

package/dist/{vue-ui-strip-plot-CvjdxEOT.js → vue-ui-strip-plot-C1un5Mku.js}

@@ -1,15 +1,15 @@
 import { t as e } from "./rolldown-runtime-Dy4uBu1J.js";
-import { B as t, Bt as n, Ct as r, Et as i, G as a, H as o, J as s, Rt as c, S as ee, Ut as te, W as ne, X as re, bt as ie, h as ae, i as oe, nt as se, ot as ce, pt as le, t as ue, v as de, x as fe, y as pe, zt as me } from "./lib-DUeYQsS0.js";
+import { B as t, Bt as n, G as r, Gt as i, H as a, Ht as o, J as s, Ot as c, S as ee, St as te, Tt as ne, Vt as re, W as ie, X as ae, ct as oe, h as se, ht as ce, i as le, it as ue, t as de, v as fe, x as pe, y as me } from "./lib-AJRHFE5U.js";
 import { t as he } from "./useConfig-DnH7Pf_2.js";
-import { t as ge } from "./usePrinter-C1Gqt_Sp.js";
+import { t as ge } from "./usePrinter-6n2MzVyV.js";
 import { n as _e, t as ve } from "./BaseScanner-Dr2a1Msy.js";
 import { t as ye } from "./useSvgExport-SVIsDot8.js";
-import { t as be } from "./useNestedProp-CNcoy38D.js";
+import { t as be } from "./useNestedProp-DtcXIg7n.js";
 import { t as xe } from "./useThemeCheck-C43Tcqmk.js";
 import { t as Se } from "./useTimeLabelCollider-AEcY4Ioe.js";
-import { t as Ce } from "./img-1cKsci8e.js";
-import { n as we } from "./Title-NWp4qB4K.js";
-import { t as Te } from "./Shape-BPCJfphn.js";
+import { t as Ce } from "./img-C_RNNswI.js";
+import { n as we } from "./Title-DH6G8_cZ.js";
+import { t as Te } from "./Shape-BxFtoF1z.js";
 import { t as Ee } from "./_plugin-vue_export-helper-B3ysoDQm.js";
 import { c as De } from "./canvas-lib-BOP_HS11.js";
 import { t as Oe } from "./useResponsive-BfnK0KxU.js";
@@ -133,17 +133,17 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 	},
 	emits: ["selectDatapoint", "copyAlt"],
 	setup(e, { expose: Ee, emit: Ge }) {
-		let xt = h(() => import("./Tooltip-BENq327o.js")), St = h(() => import("./BaseIcon-DfLoHNUj.js").then((e) => e.n)), Ct = h(() => import("./vue-ui-accordion-Bpbv-VHE.js").then((e) => e.n)), wt = h(() => import("./DataTable-B--IN22e.js")), Tt = h(() => import("./UserOptions-C1NgoGu6.js").then((e) => e.n)), Et = h(() => import("./PenAndPaper-DqrClVfb.js").then((e) => e.t)), Dt = h(() => import("./PackageVersion-eS823iMF.js").then((e) => e.t)), Ot = h(() => import("./BaseDraggableDialog-4hDW-Rj2.js").then((e) => e.n)), { vue_ui_strip_plot: kt } = he(), { isThemeValid: At, warnInvalidTheme: jt } = xe(), D = e, Mt = Ge, O = u({
+		let xt = h(() => import("./Tooltip-979Ytd8R.js")), St = h(() => import("./BaseIcon-CbDazQLH.js").then((e) => e.n)), Ct = h(() => import("./vue-ui-accordion-DLnwuQda.js").then((e) => e.n)), wt = h(() => import("./DataTable-DweDyHc1.js")), Tt = h(() => import("./UserOptions-qFz-9Pnw.js").then((e) => e.n)), Et = h(() => import("./PenAndPaper-D4aFMYZf.js").then((e) => e.t)), Dt = h(() => import("./PackageVersion-DYLo3MRd.js").then((e) => e.t)), Ot = h(() => import("./BaseDraggableDialog-BvaFJWHb.js").then((e) => e.n)), { vue_ui_strip_plot: kt } = he(), { isThemeValid: At, warnInvalidTheme: jt } = xe(), D = e, Mt = Ge, Nt = u({
 			get() {
 				return !!D.dataset && D.dataset.length;
 			},
 			set(e) {
 				return e;
 			}
-		}), k = x(o()), Nt = x(0), Pt = x(!1), Ft = x(""), A = x(null), It = x(null), Lt = x(null), Rt = x(null), zt = x(!1), Bt = x(0), Vt = x(0), j = x(null), Ht = x(null), Ut = x(!1), Wt = x(!1), Gt = x(null), Kt = x(null), qt = x(null), Jt = x(null), M = x(null), N = x(null), P = x("pointer"), Yt = x({
+		}), O = x(a()), Pt = x(0), Ft = x(!1), It = x(""), k = x(null), Lt = x(null), Rt = x(null), zt = x(null), Bt = x(!1), Vt = x(0), Ht = x(0), A = x(null), Ut = x(null), Wt = x(!1), j = x(!1), Gt = x(null), Kt = x(null), qt = x(null), Jt = x(null), M = x(null), N = x(null), P = x("pointer"), Yt = x({
 			x: 0,
 			y: 0
-		}), Xt = x(!1), F = x(an()), I = u(() => F.value.userOptions.useCursorPointer), Zt = u(() => n({
+		}), Xt = x(!1), F = x(an()), I = u(() => F.value.userOptions.useCursorPointer), Zt = u(() => o({
 			defaultConfig: {
 				userOptions: { show: !1 },
 				table: { show: !1 },
@@ -269,7 +269,7 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 					]
 				}
 			],
-			skeletonConfig: n({
+			skeletonConfig: o({
 				defaultConfig: F.value,
 				userConfig: Zt.value
 			})
@@ -281,20 +281,20 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 			}), t = e.theme;
 			if (!t) return e;
 			if (!At.value(e)) return jt(e), e;
-			let n = be({
+			let r = be({
 				userConfig: Me[t] || D.config,
 				defaultConfig: e
-			}), r = be({
+			}), i = be({
 				userConfig: D.config,
-				defaultConfig: n
+				defaultConfig: r
 			});
 			return {
-				...r,
-				customPalette: r.customPalette.length ? r.customPalette : c[t] || i
+				...i,
+				customPalette: i.customPalette.length ? i.customPalette : n[t] || c
 			};
 		}
 		Ue(() => D.config, async (e) => {
-			Qt.value || (F.value = an()), tn.value = !F.value.userOptions.showOnChartHover, sn(), Bt.value += 1, Vt.value += 1, W.value.dataLabels.show = F.value.style.chart.labels.bestPlotLabel.show, W.value.showTable = F.value.table.show, W.value.showTooltip = F.value.style.chart.tooltip.show, V.value = F.value.style.chart.width, H.value = F.value.style.chart.height, U.value = F.value.style.chart.plots.radius;
+			Qt.value || (F.value = an()), tn.value = !F.value.userOptions.showOnChartHover, sn(), Vt.value += 1, Ht.value += 1, W.value.dataLabels.show = F.value.style.chart.labels.bestPlotLabel.show, W.value.showTable = F.value.table.show, W.value.showTooltip = F.value.style.chart.tooltip.show, V.value = F.value.style.chart.width, H.value = F.value.style.chart.height, U.value = F.value.style.chart.plots.radius;
 		}, { deep: !0 }), Ue(() => D.dataset, (e) => {
 			Array.isArray(e) && e.length > 0 && (en.value = !1);
 		}, { deep: !0 });
@@ -304,16 +304,16 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 		});
 		let on = u(() => !!F.value.debug);
 		function sn() {
-			if (r(D.dataset) ? (re({
+			if (ne(D.dataset) ? (ae({
 				componentName: "VueUiStripPlot",
 				type: "dataset",
 				debug: on.value
 			}), en.value = !0) : D.dataset.forEach((e, t) => {
-				ce({
+				oe({
 					datasetObject: e,
 					requiredAttributes: ["name", "plots"]
 				}).forEach((e) => {
-					O.value = !1, re({
+					Nt.value = !1, ae({
 						componentName: "VueUiStripPlot",
 						type: "datasetSerieAttribute",
 						property: e,
@@ -321,11 +321,11 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 						debug: on.value
 					});
 				}), e.plots && e.plots.forEach((e, n) => {
-					ce({
+					oe({
 						datasetObject: e,
 						requiredAttributes: ["name", "value"]
 					}).forEach((e) => {
-						O.value = !1, re({
+						Nt.value = !1, ae({
 							componentName: "VueUiStripPlot",
 							type: "datasetSerieAttribute",
 							property: e,
@@ -334,16 +334,16 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 						});
 					});
 				});
-			}), r(D.dataset) || (en.value = F.value.loading), F.value.responsive) {
+			}), ne(D.dataset) || (en.value = F.value.loading), F.value.responsive) {
 				let e = De(() => {
 					let { width: e, height: t } = Oe({
-						chart: A.value,
-						title: F.value.style.chart.title.text ? It.value : null,
-						source: Lt.value,
-						noTitle: Rt.value
+						chart: k.value,
+						title: F.value.style.chart.title.text ? Lt.value : null,
+						source: Rt.value,
+						noTitle: zt.value
 					});
 					requestAnimationFrame(() => {
-						hn.value = t, V.value = Math.max(.1, e), H.value = Math.max(.1, t - 12), F.value.responsiveProportionalSizing ? U.value = me({
+						hn.value = t, V.value = Math.max(.1, e), H.value = Math.max(.1, t - 12), F.value.responsiveProportionalSizing ? U.value = re({
 							relator: Math.min(t, e),
 							adjuster: 600,
 							source: F.value.style.chart.plots.radius,
@@ -352,9 +352,9 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 						}) : U.value = F.value.style.chart.plots.radius;
 					});
 				});
-				R.value && (z.value && R.value.unobserve(z.value), R.value.disconnect()), R.value = new ResizeObserver(e), z.value = A.value.parentNode, R.value.observe(z.value);
+				R.value && (z.value && R.value.unobserve(z.value), R.value.disconnect()), R.value = new ResizeObserver(e), z.value = k.value.parentNode, R.value.observe(z.value);
 			}
-			zt.value = !0, setTimeout(() => {
+			Bt.value = !0, setTimeout(() => {
 				B.value = !1;
 			}, Sn.value * 50);
 		}
@@ -362,10 +362,10 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 			R.value && (z.value && R.value.unobserve(z.value), R.value.disconnect());
 		});
 		let { isPrinting: cn, isImaging: ln, generatePdf: un, generateImage: dn } = ge({
-			elementId: `strip-plot_${k.value}`,
+			elementId: `strip-plot_${O.value}`,
 			fileName: F.value.style.chart.title.text || "vue-ui-strip-plot",
 			options: F.value.userOptions.print
-		}), fn = u(() => F.value.userOptions.show && !F.value.style.chart.title.text), pn = u(() => fe(F.value.customPalette)), B = x(F.value.useCssAnimation), mn = x({
+		}), fn = u(() => F.value.userOptions.show && !F.value.style.chart.title.text), pn = u(() => pe(F.value.customPalette)), B = x(F.value.useCssAnimation), mn = x({
 			top: F.value.style.chart.padding.top,
 			bottom: F.value.style.chart.padding.bottom,
 			left: F.value.style.chart.padding.left,
@@ -423,20 +423,20 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 				absoluteHeight: H.value
 			};
 		}), xn = u(() => $t.value.map((e, t) => {
-			let n = o();
+			let n = a();
 			return {
 				...e,
 				id: n,
-				color: e.color ? pe(e.color) : pn.value[t] || i[t] || i[t % i.length],
-				plots: e.plots.map((r, a) => ({
+				color: e.color ? me(e.color) : pn.value[t] || c[t] || c[t % c.length],
+				plots: e.plots.map((r, i) => ({
 					...r,
-					value: de(r.value),
+					value: fe(r.value),
 					parentId: n,
 					parentName: e.name,
 					parentIndex: t,
-					plotIndex: a,
-					color: e.color ? pe(e.color) : pn.value[t] || i[t] || i[t % i.length],
-					id: o()
+					plotIndex: i,
+					color: e.color ? me(e.color) : pn.value[t] || c[t] || c[t % c.length],
+					id: a()
 				})).sort((e, t) => e.value - t.value)
 			};
 		})), K = u(() => (xn.value || []).map((e, t) => ({
@@ -451,7 +451,7 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 				max: Math.max(...e),
 				min: Math.min(...e)
 			};
-		}), q = u(() => ae(Cn.value.min < 0 ? Cn.value.min : 0, Cn.value.max, F.value.style.chart.grid.scaleSteps)), J = u(() => (K.value || []).map((e, t) => ({
+		}), q = u(() => se(Cn.value.min < 0 ? Cn.value.min : 0, Cn.value.max, F.value.style.chart.grid.scaleSteps)), J = u(() => (K.value || []).map((e, t) => ({
 			...e,
 			plots: e.plots.map((e) => ({
 				...e,
@@ -464,7 +464,7 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 			value: e
 		}))), Tn = x(null), Y = x(null);
 		function En({ datapoint: e, seriesIndex: t }) {
-			P.value !== "keyboard" && (Pt.value = !1, Y.value = null, F.value.events.datapointLeave && F.value.events.datapointLeave({
+			P.value !== "keyboard" && (Ft.value = !1, Y.value = null, F.value.events.datapointLeave && F.value.events.datapointLeave({
 				datapoint: e,
 				seriesIndex: t
 			}));
@@ -484,14 +484,14 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 				seriesIndex: t,
 				config: F.value,
 				series: xn.value
-			}, Pt.value = !0, Y.value = e;
-			let r = F.value.style.chart.tooltip.customFormat;
-			if (le(r) && se(() => r({
+			}, Ft.value = !0, Y.value = e;
+			let i = F.value.style.chart.tooltip.customFormat;
+			if (ce(i) && ue(() => i({
 				seriesIndex: t,
 				datapoint: e,
 				series: xn.value,
 				config: F.value
-			}))) Ft.value = r({
+			}))) It.value = i({
 				seriesIndex: t,
 				datapoint: e,
 				series: xn.value,
@@ -499,7 +499,7 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 			});
 			else {
 				let n = "";
-				n += `<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="${F.value.style.chart.plots.gradient.show ? `url(#${e.parentId})` : e.color}"/></svg>${e.name}</div>`, n += `<div>${oe(F.value.style.chart.labels.formatter, e.value, a({
+				n += `<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="${F.value.style.chart.plots.gradient.show ? `url(#${e.parentId})` : e.color}"/></svg>${e.name}</div>`, n += `<div>${le(F.value.style.chart.labels.formatter, e.value, r({
 					p: F.value.style.chart.labels.prefix,
 					v: e.value,
 					s: F.value.style.chart.labels.suffix,
@@ -507,7 +507,7 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 				}), {
 					datapoint: e,
 					seriesIndex: t
-				})}</div>`, Ft.value = `<div>${n}</div>`;
+				})}</div>`, It.value = `<div>${n}</div>`;
 			}
 		}
 		let kn = u(() => ({
@@ -532,7 +532,7 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 		}
 		let X = u(() => {
 			let e = [F.value.table.columnNames.series, F.value.table.columnNames.value], t = kn.value.head.map((e, t) => {
-				let n = a({
+				let n = r({
 					p: F.value.style.chart.labels.prefix,
 					v: kn.value.body[t],
 					s: F.value.style.chart.labels.suffix,
@@ -563,7 +563,7 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 			};
 		}), Z = x(!1);
 		function jn(e) {
-			Z.value = e, Nt.value += 1;
+			Z.value = e, Pt.value += 1;
 		}
 		function Mn() {
 			return K.value;
@@ -582,9 +582,9 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 			Q.value = !Q.value;
 		}
 		async function Ln({ scale: e = 2 } = {}) {
-			if (!A.value) return;
-			let { width: t, height: n } = A.value.getBoundingClientRect(), r = t / n, { imageUri: i, base64: a } = await Ce({
-				domElement: A.value,
+			if (!k.value) return;
+			let { width: t, height: n } = k.value.getBoundingClientRect(), r = t / n, { imageUri: i, base64: a } = await Ce({
+				domElement: k.value,
 				base64: !0,
 				img: !0,
 				scale: e
@@ -639,7 +639,7 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 					headerColor: F.value.table.th.color,
 					headerBg: F.value.table.th.backgroundColor,
 					isFullscreen: Z.value,
-					fullscreenParent: A.value,
+					fullscreenParent: k.value,
 					forcedWidth: Math.min(800, window.innerWidth * .8),
 					isCursorPointer: I.value
 				} : {
@@ -660,10 +660,10 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 			};
 		});
 		Ue(() => W.value.showTable, (e) => {
-			F.value.table.show || (e && F.value.table.useDialog && j.value ? j.value.open() : "close" in j.value && j.value.close());
+			F.value.table.show || (e && F.value.table.useDialog && A.value ? A.value.open() : "close" in A.value && A.value.close());
 		});
 		function zn() {
-			W.value.showTable = !1, Ht.value && Ht.value.setTableIconState(!1);
+			W.value.showTable = !1, Ut.value && Ut.value.setTableIconState(!1);
 		}
 		let Bn = u(() => F.value.style.chart.backgroundColor), { exportSvg: Vn, getSvg: Hn } = ye({
 			svg: L,
@@ -671,7 +671,7 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 			backgroundColor: Bn
 		});
 		async function Un({ isCb: e }) {
-			Wt.value = !0, await Le();
+			j.value = !0, await Le();
 			try {
 				if (e) {
 					let { blob: e, url: t, text: n, dataUrl: r } = await Hn();
@@ -683,16 +683,16 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 					}));
 				} else await Promise.resolve(Vn());
 			} finally {
-				Wt.value = !1;
+				j.value = !1;
 			}
 		}
 		function Wn(e) {
 			if (e?.stage === "start") {
-				Ut.value = !0;
+				Wt.value = !0;
 				return;
 			}
 			if (e?.stage === "end") {
-				Ut.value = !1;
+				Wt.value = !1;
 				return;
 			}
 			dn();
@@ -720,7 +720,7 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 			return !Number.isInteger(e) || !Number.isInteger(t) ? null : qn(e)[t] ?? null;
 		}
 		function Yn() {
-			M.value = null, N.value = null, P.value = "pointer", Pt.value = !1, Y.value = null;
+			M.value = null, N.value = null, P.value = "pointer", Ft.value = !1, Y.value = null;
 		}
 		function Xn(e) {
 			if (!e || !L.value) return;
@@ -795,20 +795,20 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 			copyAlt: Gn
 		}), (e, n) => (b(), p("div", {
 			ref_key: "stripPlotChart",
-			ref: A,
+			ref: k,
 			class: _(`vue-data-ui-component vue-ui-strip-plot ${Z.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${F.value.useCssAnimation ? "" : "vue-ui-dna"}`),
 			style: y(`font-family:${F.value.style.fontFamily};width:100%; text-align:center;background:${F.value.style.chart.backgroundColor};${F.value.responsive ? "height:100%" : ""}`),
-			id: `strip-plot_${k.value}`,
+			id: `strip-plot_${O.value}`,
 			onMouseenter: n[1] ||= () => T(nn)(!0),
 			onMouseleave: n[2] ||= () => T(nn)(!1)
 		}, [
 			m("div", {
-				id: `chart-instructions-${k.value}`,
+				id: `chart-instructions-${O.value}`,
 				class: "sr-only"
 			}, [m("p", null, w(F.value.a11y.translations.keyboardNavigation), 1)], 8, qe),
 			tr.value?.rows?.length ? (b(), d(ke, {
 				key: 0,
-				uid: k.value,
+				uid: O.value,
 				head: tr.value.headers,
 				body: tr.value.rows,
 				notice: F.value.a11y.translations.tableAvailable,
@@ -846,17 +846,17 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 			fn.value ? (b(), p("div", {
 				key: 2,
 				ref_key: "noTitle",
-				ref: Rt,
+				ref: zt,
 				class: "vue-data-ui-no-title-space",
 				style: "height:36px; width: 100%;background:transparent"
 			}, null, 512)) : f("", !0),
 			F.value.style.chart.title.text ? (b(), p("div", {
 				key: 3,
 				ref_key: "chartTitle",
-				ref: It,
+				ref: Lt,
 				style: "width:100%;background:transparent;padding-bottom:24px"
 			}, [(b(), d(we, {
-				key: `title_${Bt.value}`,
+				key: `title_${Vt.value}`,
 				config: {
 					title: {
 						cy: "donut-div-title",
@@ -868,15 +868,15 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 					}
 				}
 			}, null, 8, ["config"]))], 512)) : f("", !0),
-			F.value.userOptions.show && O.value && (T(rn) || T(tn)) ? (b(), d(T(Tt), {
+			F.value.userOptions.show && Nt.value && (T(rn) || T(tn)) ? (b(), d(T(Tt), {
 				ref_key: "userOptionsRef",
-				ref: Ht,
-				key: `user_option_${Nt.value}`,
+				ref: Ut,
+				key: `user_option_${Pt.value}`,
 				backgroundColor: F.value.style.chart.backgroundColor,
 				color: F.value.style.chart.color,
 				isPrinting: T(cn),
 				isImaging: T(ln),
-				uid: k.value,
+				uid: O.value,
 				hasTooltip: F.value.userOptions.buttons.tooltip && F.value.style.chart.tooltip.show,
 				hasPdf: F.value.userOptions.buttons.pdf,
 				hasXls: F.value.userOptions.buttons.csv,
@@ -889,7 +889,7 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 				isTooltip: W.value.showTooltip,
 				isFullscreen: Z.value,
 				titles: { ...F.value.userOptions.buttonTitles },
-				chartElement: A.value,
+				chartElement: k.value,
 				position: F.value.userOptions.position,
 				hasAnnotator: F.value.userOptions.buttons.annotator,
 				isAnnotation: Q.value,
@@ -987,14 +987,14 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 			m("div", Je, [(b(), p("svg", {
 				ref_key: "svgRef",
 				ref: L,
-				xmlns: T(ue),
+				xmlns: T(de),
 				class: _({
 					"vue-data-ui-fullscreen--on": Z.value,
 					"vue-data-ui-fulscreen--off": !Z.value
 				}),
 				viewBox: `0 0 ${V.value} ${H.value}`,
 				style: y(`max-width:100%; overflow: visible; background:transparent;color:${F.value.style.chart.color};`),
-				"aria-describedby": `chart-instructions-${k.value}`,
+				"aria-describedby": `chart-instructions-${O.value}`,
 				tabindex: "0",
 				onFocus: Qn,
 				onBlur: $n,
@@ -1059,7 +1059,7 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 					fill: F.value.style.chart.labels.yAxisLabels.color,
 					"font-size": F.value.style.chart.labels.yAxisLabels.fontSize,
 					"text-anchor": "end"
-				}, w(T(oe)(F.value.style.chart.labels.formatter, e.value, T(a)({
+				}, w(T(le)(F.value.style.chart.labels.formatter, e.value, T(r)({
 					p: F.value.style.chart.labels.prefix,
 					v: e.value,
 					s: F.value.style.chart.labels.suffix,
@@ -1080,7 +1080,7 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 					fill: F.value.style.chart.labels.xAxisLabels.color,
 					"text-anchor": F.value.style.chart.labels.xAxisLabels.rotation > 0 ? "start" : F.value.style.chart.labels.xAxisLabels.rotation < 0 ? "end" : "middle",
 					innerHTML: T(t)({
-						content: T(te)(String(e)),
+						content: T(i)(String(e)),
 						fontSize: F.value.style.chart.labels.xAxisLabels.fontSize,
 						fill: F.value.style.chart.labels.xAxisLabels.color,
 						x: 0,
@@ -1144,11 +1144,11 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 				}, [
 					m("stop", {
 						offset: "10%",
-						"stop-color": T(ie)(e.color, F.value.style.chart.plots.gradient.intensity / 100)
+						"stop-color": T(te)(e.color, F.value.style.chart.plots.gradient.intensity / 100)
 					}, null, 8, pt),
 					m("stop", {
 						offset: "90%",
-						"stop-color": T(ne)(e.color, .1)
+						"stop-color": T(ie)(e.color, .1)
 					}, null, 8, mt),
 					m("stop", {
 						offset: "100%",
@@ -1158,7 +1158,7 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 				(b(!0), p(l, null, S(J.value, (t, n) => (b(), p(l, null, [(b(!0), p(l, null, S(t.plots, (n, r) => (b(), d(Te, Ie({ ref_for: !0 }, e.$attrs, {
 					plot: {
 						x: n.x,
-						y: zt.value ? n.y : G.value.top
+						y: Bt.value ? n.y : G.value.top
 					},
 					radius: Y.value && Y.value.id === n.id ? gn.value * 1.5 : gn.value,
 					shape: F.value.style.chart.plots.shape,
@@ -1203,7 +1203,7 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 					fill: F.value.style.chart.labels.bestPlotLabel.color,
 					"text-anchor": "middle",
 					style: y(`opacity:${F.value.useCssAnimation ? +!B.value : 1};transition:opacity 0.2s ease-in;`)
-				}, w(e.name) + " " + w(F.value.style.chart.labels.bestPlotLabel.showValue ? T(oe)(F.value.style.chart.labels.formatter, e.value, T(a)({
+				}, w(e.name) + " " + w(F.value.style.chart.labels.bestPlotLabel.showValue ? T(le)(F.value.style.chart.labels.formatter, e.value, T(r)({
 					p: `(${F.value.style.chart.labels.prefix}`,
 					v: e.value,
 					s: `${F.value.style.chart.labels.suffix})`,
@@ -1214,23 +1214,23 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 				}) : ""), 13, _t)) : f("", !0)], 64))), 256))])) : f("", !0)], 64))), 256)),
 				C(e.$slots, "svg", { svg: {
 					...G.value,
-					isPrintingImg: T(cn) || T(ln) || Ut.value,
-					isPrintingSvg: Wt.value
+					isPrintingImg: T(cn) || T(ln) || Wt.value,
+					isPrintingSvg: j.value
 				} }, void 0, !0)
 			], 46, Ye)), e.$slots.hint ? (b(), p("div", vt, [C(e.$slots, "hint", v(g({
 				hint: F.value.a11y.translations.keyboardNavigation,
 				isVisible: Xt.value
 			})), void 0, !0)])) : f("", !0)]),
-			e.$slots.watermark ? (b(), p("div", yt, [C(e.$slots, "watermark", v(g({ isPrinting: T(cn) || T(ln) || Ut.value || Wt.value })), void 0, !0)])) : f("", !0),
+			e.$slots.watermark ? (b(), p("div", yt, [C(e.$slots, "watermark", v(g({ isPrinting: T(cn) || T(ln) || Wt.value || j.value })), void 0, !0)])) : f("", !0),
 			e.$slots.source ? (b(), p("div", {
 				key: 6,
 				ref_key: "source",
-				ref: Lt,
+				ref: Rt,
 				dir: "auto"
 			}, [C(e.$slots, "source", {}, void 0, !0)], 512)) : f("", !0),
 			Fe(T(xt), {
 				teleportTo: F.value.style.chart.tooltip.teleportTo,
-				show: W.value.showTooltip && Pt.value,
+				show: W.value.showTooltip && Ft.value,
 				backgroundColor: F.value.style.chart.tooltip.backgroundColor,
 				color: F.value.style.chart.tooltip.color,
 				borderRadius: F.value.style.chart.tooltip.borderRadius,
@@ -1241,10 +1241,10 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 				position: F.value.style.chart.tooltip.position,
 				offsetX: F.value.style.chart.tooltip.offsetX,
 				offsetY: F.value.style.chart.tooltip.offsetY,
-				parent: A.value,
-				content: Ft.value,
+				parent: k.value,
+				content: It.value,
 				isFullscreen: Z.value,
-				isCustom: T(le)(F.value.style.chart.tooltip.customFormat),
+				isCustom: T(ce)(F.value.style.chart.tooltip.customFormat),
 				smooth: F.value.style.chart.tooltip.smooth,
 				backdropFilter: F.value.style.chart.tooltip.backdropFilter,
 				smoothForce: F.value.style.chart.tooltip.smoothForce,
@@ -1280,13 +1280,13 @@ var Ge = /* @__PURE__ */ e({ default: () => xt }), Ke = ["id"], qe = ["id"], Je
 				"isA11yMode",
 				"a11yPosition"
 			]),
-			O.value && F.value.userOptions.buttons.table ? (b(), d(Be($.value.component), Ie({ key: 7 }, $.value.props, {
+			Nt.value && F.value.userOptions.buttons.table ? (b(), d(Be($.value.component), Ie({ key: 7 }, $.value.props, {
 				ref_key: "tableUnit",
-				ref: j,
+				ref: A,
 				onClose: zn
 			}), Ne({
 				content: E(() => [(b(), d(T(wt), {
-					key: `table_${Vt.value}`,
+					key: `table_${Ht.value}`,
 					colNames: X.value.colNames,
 					head: X.value.head,
 					body: X.value.body,