vue-data-ui 3.25.3 → 3.25.5

package/dist/{vue-ui-rings-DDGKIiGT.js → vue-ui-rings-BJ8yEQMw.js}

@@ -1,25 +1,25 @@
 import { t as e } from "./rolldown-runtime-Dy4uBu1J.js";
-import { $ as t, Bt as n, D as r, G as i, Ht as a, It as o, Jt as ee, Nt as te, S as ne, St as re, Ut as ie, X as s, Xt as ae, b as oe, i as se, lt as ce, mt as le, nt as ue, q as de, t as fe, w as pe } from "./lib-C7t_vY8w.js";
+import { $ as t, Ct as n, D as r, G as i, Lt as a, Pt as o, S as ee, Ut as te, Vt as ne, Wt as re, X as s, Yt as ie, Zt as ae, b as oe, ht as se, i as ce, lt as le, nt as ue, q as de, t as fe, w as pe } from "./lib-Dql7cqyA.js";
 import { n as me, t as he } from "./useHints-Dq_w2E8B.js";
-import { t as ge } from "./useConfig-CyCVHo81.js";
-import { t as _e } from "./usePrinter-VVTuFI6H.js";
+import { t as ge } from "./useConfig-C_mX5pOZ.js";
+import { t as _e } from "./usePrinter-DISD7q5m.js";
 import { n as ve, t as ye } from "./BaseScanner-DZvpgOjM.js";
-import { t as be } from "./useNestedProp-BfTgFMXF.js";
+import { t as be } from "./useNestedProp-Chvyfpl-.js";
 import { t as xe } from "./useThemeCheck-C43Tcqmk.js";
 import { t as Se } from "./useChartExport-iwOqiIWX.js";
 import { t as Ce } from "./useTransitions-g_zBREk2.js";
-import { t as we } from "./img-IjqD_xWl.js";
-import { n as Te } from "./Title-DIf1lG-_.js";
-import { t as Ee } from "./Shape-BBKymE00.js";
+import { t as we } from "./img-DhGApYG0.js";
+import { n as Te } from "./Title-CPHi-evi.js";
+import { t as Ee } from "./Shape-CIqU-p2F.js";
 import { t as De } from "./_plugin-vue_export-helper-B3ysoDQm.js";
 import { l as Oe, t as ke } from "./useResponsive-ZtArZtUf.js";
 import { t as Ae } from "./DefGrad-DVBqDjhO.js";
-import { t as je } from "./BaseLegendToggle-BF-thEu0.js";
+import { t as je } from "./BaseLegendToggle-__JnV08B.js";
 import { t as Me } from "./A11yDataTable-DdRsVULz.js";
 import { t as Ne } from "./useUserOptionState-DK-_1ddE.js";
 import { t as Pe } from "./useChartAccessibility-DYqac8yF.js";
-import { t as Fe } from "./labelUtils-Bgt85NUY.js";
-import { t as Ie } from "./Legend-DmitJZi5.js";
+import { t as Fe } from "./labelUtils-BXX2NzRe.js";
+import { t as Ie } from "./Legend-X4kF4PvW.js";
 import { t as Le } from "./vue_ui_rings-BVgD2aMn.js";
 import { Fragment as Re, Teleport as ze, computed as c, createBlock as l, createCommentVNode as u, createElementBlock as d, createElementVNode as f, createSlots as Be, createTextVNode as Ve, createVNode as He, defineAsyncComponent as p, guardReactiveProps as m, mergeProps as Ue, nextTick as We, normalizeClass as h, normalizeProps as g, normalizeStyle as _, onBeforeUnmount as Ge, onMounted as Ke, openBlock as v, ref as y, renderList as qe, renderSlot as b, resolveDynamicComponent as Je, shallowRef as Ye, toDisplayString as x, toRefs as Xe, unref as S, useSlots as Ze, watch as Qe, withCtx as C } from "vue";
 //#region src/components/vue-ui-rings.vue
@@ -108,12 +108,12 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 	},
 	emits: ["selectLegend", "copyAlt"],
 	setup(e, { expose: De, emit: $e }) {
-		let bt = p(() => import("./Tooltip-C3jBTIhR.js")), xt = p(() => import("./BaseIcon-CVrQHhw1.js").then((e) => e.n)), St = p(() => import("./vue-ui-accordion-DuARUUdY.js").then((e) => e.n)), Ct = p(() => import("./DataTable-BBpTEQY5.js")), wt = p(() => import("./PenAndPaper-DzM1vUXR.js").then((e) => e.t)), Tt = p(() => import("./UserOptions-m0uxKoiy.js").then((e) => e.n)), Et = p(() => import("./PackageVersion-hRJtldYi.js").then((e) => e.t)), Dt = p(() => import("./BaseDraggableDialog-BCQY4Tir.js").then((e) => e.n)), { vue_ui_rings: Ot } = ge(), { isThemeValid: kt, warnInvalidTheme: At } = xe(), jt = Ze(), w = e, T = y(!1), Mt = c(() => !!w.dataset && w.dataset.length), E = y(de()), D = y(!1), Nt = y(""), O = y(null), Pt = y(0), k = y(null), Ft = y(null), It = y(null), Lt = y(null), Rt = y(null), zt = y(0), Bt = y(0), Vt = y(0), Ht = y(!1), Ut = y(!1), A = y(null), Wt = y(null), j = y(null), Gt = y({
+		let bt = p(() => import("./Tooltip-hhrkQ3Lk.js")), xt = p(() => import("./BaseIcon-t83PDe9k.js").then((e) => e.n)), St = p(() => import("./vue-ui-accordion-DRf3NQyH.js").then((e) => e.n)), Ct = p(() => import("./DataTable-COIO9gi4.js")), wt = p(() => import("./PenAndPaper-BgH3m_LP.js").then((e) => e.t)), Tt = p(() => import("./UserOptions-f3Q0nqrj.js").then((e) => e.n)), Et = p(() => import("./PackageVersion-M2Ws-VwJ.js").then((e) => e.t)), Dt = p(() => import("./BaseDraggableDialog-BM_R41j8.js").then((e) => e.n)), { vue_ui_rings: Ot } = ge(), { isThemeValid: kt, warnInvalidTheme: At } = xe(), jt = Ze(), w = e, T = y(!1), Mt = c(() => !!w.dataset && w.dataset.length), E = y(de()), D = y(!1), Nt = y(""), O = y(null), Pt = y(0), k = y(null), Ft = y(null), It = y(null), Lt = y(null), Rt = y(null), zt = y(0), Bt = y(0), Vt = y(0), Ht = y(!1), Ut = y(!1), A = y(null), Wt = y(null), j = y(null), Gt = y({
 			x: 0,
 			y: 0
-		}), Kt = y("pointer"), qt = y(!1), M = y(en());
+		}), M = y("pointer"), Kt = y(!1), N = y($t());
 		me({
-			config: () => M.value,
+			config: () => N.value,
 			dataset: () => w.dataset,
 			component: "VueUiRings",
 			rules: [
@@ -133,10 +133,10 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 				}
 			]
 		});
-		let { transitionEnabled: N } = Ce({
-			config: () => M.value.transitions,
+		let { transitionEnabled: P } = Ce({
+			config: () => N.value.transitions,
 			dataset: () => w.dataset
-		}), P = c(() => M.value.userOptions.useCursorPointer), Jt = c(() => ae({
+		}), F = c(() => N.value.userOptions.useCursorPointer), qt = c(() => ae({
 			defaultConfig: {
 				userOptions: { show: !1 },
 				table: { show: !1 },
@@ -152,11 +152,11 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 					legend: { backgroundColor: "transparent" }
 				} }
 			},
-			userConfig: M.value.skeletonConfig ?? {}
-		})), { loading: F, FINAL_DATASET: Yt, manualLoading: Xt } = ve({
+			userConfig: N.value.skeletonConfig ?? {}
+		})), { loading: I, FINAL_DATASET: Jt, manualLoading: Yt } = ve({
 			...Xe(w),
-			FINAL_CONFIG: M,
-			prepareConfig: en,
+			FINAL_CONFIG: N,
+			prepareConfig: $t,
 			skeletonDataset: w.config?.skeletonDataset ?? [
 				{
 					name: "_",
@@ -185,11 +185,11 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 				}
 			],
 			skeletonConfig: ae({
-				defaultConfig: M.value,
-				userConfig: Jt.value
+				defaultConfig: N.value,
+				userConfig: qt.value
 			})
-		}), { userOptionsVisible: Zt, setUserOptionsVisibility: Qt, keepUserOptionState: $t } = Ne({ config: M.value }), { svgRef: I } = Pe({ config: M.value.style.chart.title });
-		function en() {
+		}), { userOptionsVisible: Xt, setUserOptionsVisibility: Zt, keepUserOptionState: Qt } = Ne({ config: N.value }), { svgRef: L } = Pe({ config: N.value.style.chart.title });
+		function $t() {
 			let e = be({
 				userConfig: w.config,
 				defaultConfig: Ot
@@ -205,41 +205,41 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 					userConfig: w.config,
 					defaultConfig: n
 				}),
-				customPalette: e.customPalette.length ? e.customPalette : ee[e.theme] || o
+				customPalette: e.customPalette.length ? e.customPalette : ie[e.theme] || a
 			};
 		}
 		Qe(() => w.config, (e) => {
-			F.value || (M.value = en()), Zt.value = !M.value.userOptions.showOnChartHover, nn(), zt.value += 1, Bt.value += 1, Vt.value += 1, V.value.showTable = M.value.table.show, V.value.showTooltip = M.value.style.chart.tooltip.show, V.value.showLabels = M.value.style.chart.layout.labels.dataLabels.show, H.value.width = M.value.style.chart.size, H.value.height = M.value.style.chart.size;
+			I.value || (N.value = $t()), Xt.value = !N.value.userOptions.showOnChartHover, tn(), zt.value += 1, Bt.value += 1, Vt.value += 1, H.value.showTable = N.value.table.show, H.value.showTooltip = N.value.style.chart.tooltip.show, H.value.showLabels = N.value.style.chart.layout.labels.dataLabels.show, U.value.width = N.value.style.chart.size, U.value.height = N.value.style.chart.size;
 		}, { deep: !0 });
-		let tn = c(() => {
-			let { markers: e } = M.value.style.chart.layout.labels.dataLabels, t = J.value / 2, n = V.value.showLabels ? e.position === "left" ? t : -t : 0, r = V.value.showLabels ? H.value.width / 2 - t : 0, i = e.position === "left" ? r : -r;
+		let en = c(() => {
+			let { markers: e } = N.value.style.chart.layout.labels.dataLabels, t = J.value / 2, n = H.value.showLabels ? e.position === "left" ? t : -t : 0, r = H.value.showLabels ? U.value.width / 2 - t : 0, i = e.position === "left" ? r : -r;
 			return {
-				x: M.value.responsive ? i : n / M.value.style.chart.size * H.value.width,
-				y: 0 / M.value.style.chart.size * H.value.height
+				x: N.value.responsive ? i : n / N.value.style.chart.size * U.value.width,
+				y: 0 / N.value.style.chart.size * U.value.height
 			};
-		}), L = c(() => ({
-			x: H.value.width / 2 + tn.value.x,
-			y: H.value.height / 2 + tn.value.y
+		}), R = c(() => ({
+			x: U.value.width / 2 + en.value.x,
+			y: U.value.height / 2 + en.value.y
 		}));
 		Qe(() => w.dataset, (e) => {
-			Array.isArray(e) && e.length > 0 && (Xt.value = !1);
+			Array.isArray(e) && e.length > 0 && (Yt.value = !1);
 		}, { deep: !0 });
-		let R = Ye(null), z = Ye(null);
+		let z = Ye(null), B = Ye(null);
 		Ke(() => {
-			Ut.value = !0, nn();
+			Ut.value = !0, tn();
 		});
-		let B = c(() => M.value.debug);
-		function nn() {
-			if (te(w.dataset) ? (ue({
+		let V = c(() => N.value.debug);
+		function tn() {
+			if (o(w.dataset) ? (ue({
 				componentName: "VueUiRings",
 				type: "dataset",
-				debug: B.value
-			}), Xt.value = !0) : w.dataset.forEach((e, t) => {
+				debug: V.value
+			}), Yt.value = !0) : w.dataset.forEach((e, t) => {
 				e.values.length || (ue({
 					componentName: "VueUiRings",
 					type: "dataset",
-					debug: B.value
-				}), Xt.value = !0), le({
+					debug: V.value
+				}), Yt.value = !0), se({
 					datasetObject: e,
 					requiredAttributes: ["name", "values"]
 				}).forEach((e) => {
@@ -248,140 +248,140 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 						type: "datasetSerieAttribute",
 						property: e,
 						index: t,
-						debug: B.value
+						debug: V.value
 					});
 				});
-			}), te(w.dataset) || (Xt.value = M.value.loading), M.value.responsive) {
+			}), o(w.dataset) || (Yt.value = N.value.loading), N.value.responsive) {
 				let e = Oe(() => {
 					Ht.value = !0;
 					let { width: e, height: t } = ke({
 						chart: k.value,
-						title: M.value.style.chart.title.text ? Ft.value : null,
-						legend: M.value.style.chart.legend.show ? It.value : null,
+						title: N.value.style.chart.title.text ? Ft.value : null,
+						legend: N.value.style.chart.legend.show ? It.value : null,
 						source: Lt.value,
 						noTitle: Rt.value
 					});
 					requestAnimationFrame(() => {
-						H.value.width = e, H.value.height = t - 12, Ht.value = !1;
+						U.value.width = e, U.value.height = t - 12, Ht.value = !1;
 					});
 				});
-				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);
+				z.value && (B.value && z.value.unobserve(B.value), z.value.disconnect()), z.value = new ResizeObserver(e), B.value = k.value.parentNode, z.value.observe(B.value);
 			}
 			setTimeout(() => {
 				T.value = !0;
 			}, 600);
 		}
 		Ge(() => {
-			R.value && (z.value && R.value.unobserve(z.value), R.value.disconnect());
+			z.value && (B.value && z.value.unobserve(B.value), z.value.disconnect());
 		});
-		let { isPrinting: rn, isImaging: an, generatePdf: on, generateImage: sn } = _e({
+		let { isPrinting: nn, isImaging: rn, generatePdf: an, generateImage: on } = _e({
 			elementId: `rings_${E.value}`,
-			fileName: M.value.style.chart.title.text || "vue-ui-rings",
-			options: M.value.userOptions.print
-		}), cn = c(() => M.value.userOptions.show && !M.value.style.chart.title.text), ln = c(() => pe(M.value.customPalette)), V = y({
-			showTable: M.value.table.show,
-			showTooltip: M.value.style.chart.tooltip.show,
-			showLabels: M.value.style.chart.layout.labels.dataLabels.show
+			fileName: N.value.style.chart.title.text || "vue-ui-rings",
+			options: N.value.userOptions.print
+		}), sn = c(() => N.value.userOptions.show && !N.value.style.chart.title.text), cn = c(() => pe(N.value.customPalette)), H = y({
+			showTable: N.value.table.show,
+			showTooltip: N.value.style.chart.tooltip.show,
+			showLabels: N.value.style.chart.layout.labels.dataLabels.show
 		});
-		Qe(M, () => {
-			V.value = {
-				showTable: M.value.table.show,
-				showTooltip: M.value.style.chart.tooltip.show,
-				showLabels: M.value.style.chart.layout.labels.dataLabels.show
+		Qe(N, () => {
+			H.value = {
+				showTable: N.value.table.show,
+				showTooltip: N.value.style.chart.tooltip.show,
+				showLabels: N.value.style.chart.layout.labels.dataLabels.show
 			};
 		}, { immediate: !0 });
-		let H = y({
-			height: M.value.style.chart.size,
-			width: M.value.style.chart.size
-		}), un = c(() => Math.min(H.value.height, H.value.width)), dn = $e, U = y([]);
-		function fn() {
-			U.value.length ? U.value = [] : yn.value.forEach((e) => {
-				U.value.push(e.uid);
-			}), pn();
+		let U = y({
+			height: N.value.style.chart.size,
+			width: N.value.style.chart.size
+		}), ln = c(() => Math.min(U.value.height, U.value.width)), un = $e, W = y([]);
+		function dn() {
+			W.value.length ? W.value = [] : yn.value.forEach((e) => {
+				W.value.push(e.uid);
+			}), fn();
 		}
-		function pn() {
-			dn("selectLegend", q.value.map((e) => ({
+		function fn() {
+			un("selectLegend", q.value.map((e) => ({
 				name: e.name,
 				color: e.color,
 				value: e.value
 			})));
 		}
-		function W(e) {
-			if (U.value.includes(e)) U.value = U.value.filter((t) => t !== e);
+		function pn(e) {
+			if (W.value.includes(e)) W.value = W.value.filter((t) => t !== e);
 			else {
-				if (U.value.length === G.value.length - 1) return;
-				U.value.push(e);
+				if (W.value.length === G.value.length - 1) return;
+				W.value.push(e);
 			}
-			pn();
+			fn();
 		}
 		function mn(e) {
-			return G.value.length ? G.value.find((t) => t.name === e) || (B.value && console.warn(`VueUiRings - Series name not found "${e}"`), null) : (B.value && console.warn("VueUiRings - There are no series to show."), null);
+			return G.value.length ? G.value.find((t) => t.name === e) || (V.value && console.warn(`VueUiRings - Series name not found "${e}"`), null) : (V.value && console.warn("VueUiRings - There are no series to show."), null);
 		}
 		function hn(e) {
 			let t = mn(e);
-			t !== null && U.value.includes(t.uid) && W(t.uid);
+			t !== null && W.value.includes(t.uid) && pn(t.uid);
 		}
 		function gn(e) {
 			let t = mn(e);
-			t !== null && (U.value.includes(t.uid) || W(t.uid));
+			t !== null && (W.value.includes(t.uid) || pn(t.uid));
 		}
-		let _n = c(() => Math.max(...G.value.filter((e) => !U.value.includes(e.uid)).map(({ value: e }) => e)));
+		let _n = c(() => Math.max(...G.value.filter((e) => !W.value.includes(e.uid)).map(({ value: e }) => e)));
 		function vn(e) {
 			return e / _n.value;
 		}
-		let G = c(() => Yt.value.map(({ values: e, name: t, color: r = null }, i) => {
-			let a = n(e).reduce((e, t) => e + t, 0);
+		let G = c(() => Jt.value.map(({ values: e, name: t, color: n = null }, r) => {
+			let i = ne(e).reduce((e, t) => e + t, 0);
 			return {
 				name: t,
-				color: r || ne(r) || ln.value[i] || o[i] || o[i % o.length],
-				value: a,
-				proportion: a / Yt.value.map((e) => (e.values || []).reduce((e, t) => e + t, 0)).reduce((e, t) => e + t, 0),
+				color: n || ee(n) || cn.value[r] || a[r] || a[r % a.length],
+				value: i,
+				proportion: i / Jt.value.map((e) => (e.values || []).reduce((e, t) => e + t, 0)).reduce((e, t) => e + t, 0),
 				uid: de(),
-				absoluteIndex: i
+				absoluteIndex: r
 			};
 		})), yn = c(() => G.value.map((e, t) => {
-			let n = se(M.value.style.chart.layout.labels.dataLabels.formatter, e.value, s({
-				p: M.value.style.chart.layout.labels.dataLabels.prefix,
+			let n = ce(N.value.style.chart.layout.labels.dataLabels.formatter, e.value, s({
+				p: N.value.style.chart.layout.labels.dataLabels.prefix,
 				v: e.value,
-				s: M.value.style.chart.layout.labels.dataLabels.suffix,
-				r: M.value.style.chart.legend.roundingValue
+				s: N.value.style.chart.layout.labels.dataLabels.suffix,
+				r: N.value.style.chart.legend.roundingValue
 			}), {
 				datapoint: e,
 				index: t
 			}), r = isNaN(e.value / K.value) ? "-" : s({
 				v: e.value / K.value * 100,
 				s: "%",
-				r: M.value.style.chart.legend.roundingPercentage
+				r: N.value.style.chart.legend.roundingPercentage
 			}), i = wn({
-				showVal: M.value.style.chart.legend.showValue,
-				showPercentage: M.value.style.chart.legend.showPercentage,
+				showVal: N.value.style.chart.legend.showValue,
+				showPercentage: N.value.style.chart.legend.showPercentage,
 				val: n,
-				percentage: U.value.includes(e.uid) ? "-%" : r
+				percentage: W.value.includes(e.uid) ? "-%" : r
 			});
 			return {
 				...e,
 				shape: "circle",
-				opacity: U.value.includes(e.uid) ? .5 : 1,
-				segregate: () => W(e.uid),
-				isSegregated: U.value.includes(e.uid),
-				display: `${e.name}${M.value.style.chart.legend.showPercentage || M.value.style.chart.legend.showValue ? ": " : ""}${i}`
+				opacity: W.value.includes(e.uid) ? .5 : 1,
+				segregate: () => pn(e.uid),
+				isSegregated: W.value.includes(e.uid),
+				display: `${e.name}${N.value.style.chart.legend.showPercentage || N.value.style.chart.legend.showValue ? ": " : ""}${i}`
 			};
 		}).toSorted((e, t) => t.value - e.value)), bn = c(() => ({
 			cy: "rings-div-legend",
-			backgroundColor: M.value.style.chart.legend.backgroundColor,
-			color: M.value.style.chart.legend.color,
-			fontSize: M.value.style.chart.legend.fontSize,
+			backgroundColor: N.value.style.chart.legend.backgroundColor,
+			color: N.value.style.chart.legend.color,
+			fontSize: N.value.style.chart.legend.fontSize,
 			paddingBottom: 12,
-			fontWeight: M.value.style.chart.legend.bold ? "bold" : ""
-		})), K = c(() => G.value.filter((e) => !U.value.includes(e.uid)).map(({ value: e }) => e).reduce((e, t) => e + t, 0)), q = c(() => G.value.filter((e) => !U.value.includes(e.uid)).map(({ name: e, value: t, color: n = null, uid: r, absoluteIndex: i }, a) => ({
+			fontWeight: N.value.style.chart.legend.bold ? "bold" : ""
+		})), K = c(() => G.value.filter((e) => !W.value.includes(e.uid)).map(({ value: e }) => e).reduce((e, t) => e + t, 0)), q = c(() => G.value.filter((e) => !W.value.includes(e.uid)).map(({ name: e, value: t, color: n = null, uid: r, absoluteIndex: i }, o) => ({
 			absoluteIndex: i,
 			uid: r,
 			name: e,
-			color: n || ne(n) || ln.value[a] || o[a] || o[a % o.length],
+			color: n || ee(n) || cn.value[o] || a[o] || a[o % a.length],
 			value: t,
 			proportion: vn(t),
 			percentage: t / K.value * 100,
-			strokeWidth: M.value.style.chart.layout.rings.strokeWidth * vn(t)
+			strokeWidth: N.value.style.chart.layout.rings.strokeWidth * vn(t)
 		})).toSorted((e, t) => t.value - e.value));
 		function xn() {
 			return q.value.map(({ name: e, color: t, value: n, absoluteValues: r, percentage: i }) => ({
@@ -392,21 +392,21 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 				percentage: i
 			}));
 		}
-		let J = c(() => un.value - M.value.style.chart.layout.rings.strokeWidth * 2);
+		let J = c(() => ln.value - N.value.style.chart.layout.rings.strokeWidth * 2);
 		function Sn(e, t) {
-			M.value.events.datapointClick && M.value.events.datapointClick({
+			N.value.events.datapointClick && N.value.events.datapointClick({
 				datapoint: e,
 				seriesIndex: t
 			});
 		}
 		function Cn(e, t) {
-			O.value = null, D.value = !1, j.value = null, Kt.value = "pointer", M.value.events.datapointLeave && M.value.events.datapointLeave({
+			O.value = null, D.value = !1, j.value = null, M.value = "pointer", N.value.events.datapointLeave && N.value.events.datapointLeave({
 				datapoint: e,
 				seriesIndex: t
 			});
 		}
 		function wn({ val: e, percentage: t, showVal: n, showPercentage: r }) {
-			let i = M.value.style.chart.layout.labels.dataLabels;
+			let i = N.value.style.chart.layout.labels.dataLabels;
 			return Fe({
 				config: i,
 				val: e,
@@ -416,7 +416,7 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 			});
 		}
 		function Tn(e) {
-			let t = M.value.style.chart.layout.labels.dataLabels, n = se(t.formatter, e.value, s({
+			let t = N.value.style.chart.layout.labels.dataLabels, n = ce(t.formatter, e.value, s({
 				p: t.prefix,
 				v: e.value,
 				s: t.suffix,
@@ -437,57 +437,57 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 			return oe(J.value * e.proportion / 2 * .9 <= 0 ? 1e-4 : J.value * e.proportion / 2 * .9);
 		}
 		function Dn(e, t) {
-			return t === 0 ? L.value.y : L.value.y + J.value * q.value[0].proportion / 2 - J.value * e.proportion / 2 - 2 * (t + 1);
+			return t === 0 ? R.value.y : R.value.y + J.value * q.value[0].proportion / 2 - J.value * e.proportion / 2 - 2 * (t + 1);
 		}
 		function Y(e, t) {
-			let n = M.value.style.chart.layout.labels.dataLabels.markers.position === "left" ? -(J.value / 2) : J.value / 2;
+			let n = N.value.style.chart.layout.labels.dataLabels.markers.position === "left" ? -(J.value / 2) : J.value / 2;
 			return {
-				x: L.value.x + n,
+				x: R.value.x + n,
 				y: Dn(e, t) - En(e)
 			};
 		}
 		let On = y(null);
-		function kn(e, t, n = "pointer") {
-			if (M.value.events.datapointEnter && M.value.events.datapointEnter({
+		function kn(e, t, r = "pointer") {
+			if (N.value.events.datapointEnter && N.value.events.datapointEnter({
 				datapoint: e,
 				seriesIndex: t
-			}), U.value.length === w.dataset.length) return;
+			}), W.value.length === w.dataset.length) return;
 			On.value = {
 				datapoint: e,
 				seriesIndex: t,
 				series: q.value,
-				config: M.value
-			}, O.value = t, j.value = t, Kt.value = n;
-			let r = q.value[t], i = M.value.style.chart.tooltip.customFormat;
-			if (re(i) && ce(() => i({
+				config: N.value
+			}, O.value = t, j.value = t, M.value = r;
+			let i = q.value[t], a = N.value.style.chart.tooltip.customFormat;
+			if (n(a) && le(() => a({
 				seriesIndex: t,
 				datapoint: e,
 				series: q.value,
-				config: M.value
-			}))) Nt.value = i({
+				config: N.value
+			}))) Nt.value = a({
 				seriesIndex: t,
 				datapoint: e,
 				series: q.value,
-				config: M.value
+				config: N.value
 			});
 			else {
 				let n = "";
-				n += `<div style="width:100%;text-align:center;border-bottom:1px solid ${M.value.style.chart.tooltip.borderColor};padding-bottom:6px;margin-bottom:3px;">${r.name}</div>`, n += `<div style="display:flex;flex-direction:row;gap:6px;align-items:center;"><svg viewBox="0 0 60 60" height="14" width="14"><circle cx="30" cy="30" r="30" stroke="none" fill="${r.color}" />${jt.pattern ? `<circle cx="30" cy="30" r="30" stroke="none" fill="url(#pattern_${E.value}_${e.absoluteIndex})" />` : ""}</svg>`, n += `<b>${wn({
-					showVal: M.value.style.chart.tooltip.showValue,
-					showPercentage: M.value.style.chart.tooltip.showPercentage,
-					val: `<span>${se(M.value.style.chart.layout.labels.dataLabels.formatter, r.value, s({
-						p: M.value.style.chart.layout.labels.dataLabels.prefix,
-						v: r.value,
-						s: M.value.style.chart.layout.labels.dataLabels.suffix,
-						r: M.value.style.chart.tooltip.roundingValue
+				n += `<div style="width:100%;text-align:center;border-bottom:1px solid ${N.value.style.chart.tooltip.borderColor};padding-bottom:6px;margin-bottom:3px;">${i.name}</div>`, n += `<div style="display:flex;flex-direction:row;gap:6px;align-items:center;"><svg viewBox="0 0 60 60" height="14" width="14"><circle cx="30" cy="30" r="30" stroke="none" fill="${i.color}" />${jt.pattern ? `<circle cx="30" cy="30" r="30" stroke="none" fill="url(#pattern_${E.value}_${e.absoluteIndex})" />` : ""}</svg>`, n += `<b>${wn({
+					showVal: N.value.style.chart.tooltip.showValue,
+					showPercentage: N.value.style.chart.tooltip.showPercentage,
+					val: `<span>${ce(N.value.style.chart.layout.labels.dataLabels.formatter, i.value, s({
+						p: N.value.style.chart.layout.labels.dataLabels.prefix,
+						v: i.value,
+						s: N.value.style.chart.layout.labels.dataLabels.suffix,
+						r: N.value.style.chart.tooltip.roundingValue
 					}), {
 						datapoint: e,
 						seriesIndex: t
 					})}</span>`,
 					percentage: s({
-						v: r.value / K.value * 100,
+						v: i.value / K.value * 100,
 						s: "%",
-						r: M.value.style.chart.tooltip.roundingPercentage
+						r: N.value.style.chart.tooltip.roundingPercentage
 					})
 				})}</b></div>`, Nt.value = n;
 			}
@@ -503,10 +503,10 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 			let e = [
 				"__SUM__",
 				s({
-					p: M.value.style.chart.layout.labels.dataLabels.prefix,
+					p: N.value.style.chart.layout.labels.dataLabels.prefix,
 					v: K.value,
-					s: M.value.style.chart.layout.labels.dataLabels.suffix,
-					r: M.value.table.td.roundingValue
+					s: N.value.style.chart.layout.labels.dataLabels.suffix,
+					r: N.value.table.td.roundingValue
 				}),
 				"100%"
 			], t = X.value.head.map((e, t) => [
@@ -515,12 +515,12 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 					name: e.name
 				},
 				s({
-					p: M.value.style.chart.layout.labels.dataLabels.prefix,
+					p: N.value.style.chart.layout.labels.dataLabels.prefix,
 					v: X.value.body[t],
-					s: M.value.style.chart.layout.labels.dataLabels.suffix,
-					r: M.value.table.td.roundingValue
+					s: N.value.style.chart.layout.labels.dataLabels.suffix,
+					r: N.value.table.td.roundingValue
 				}),
-				isNaN(X.value.body[t] / K.value) ? "-" : (X.value.body[t] / K.value * 100).toFixed(M.value.table.td.roundingPercentage) + "%"
+				isNaN(X.value.body[t] / K.value) ? "-" : (X.value.body[t] / K.value * 100).toFixed(N.value.table.td.roundingPercentage) + "%"
 			]);
 			return {
 				head: e,
@@ -528,21 +528,21 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 				a11yBody: t.map((e) => e.map((e, t) => t === 0 ? e.name : e)),
 				config: {
 					th: {
-						backgroundColor: M.value.table.th.backgroundColor,
-						color: M.value.table.th.color,
-						outline: M.value.table.th.outline
+						backgroundColor: N.value.table.th.backgroundColor,
+						color: N.value.table.th.color,
+						outline: N.value.table.th.outline
 					},
 					td: {
-						backgroundColor: M.value.table.td.backgroundColor,
-						color: M.value.table.td.color,
-						outline: M.value.table.td.outline
+						backgroundColor: N.value.table.td.backgroundColor,
+						color: N.value.table.td.color,
+						outline: N.value.table.td.outline
 					},
-					breakpoint: M.value.table.responsiveBreakpoint
+					breakpoint: N.value.table.responsiveBreakpoint
 				},
 				colNames: [
-					M.value.table.columnNames.series,
-					M.value.table.columnNames.value,
-					M.value.table.columnNames.percentage
+					N.value.table.columnNames.series,
+					N.value.table.columnNames.value,
+					N.value.table.columnNames.percentage
 				]
 			};
 		});
@@ -553,8 +553,8 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 					[X.value.body[t]],
 					[isNaN(X.value.body[t] / K.value) ? "-" : X.value.body[t] / K.value * 100]
 				]), i = [
-					[M.value.style.chart.title.text],
-					[M.value.style.chart.title.subtitle.text],
+					[N.value.style.chart.title.text],
+					[N.value.style.chart.title.subtitle.text],
 					[
 						[""],
 						["val"],
@@ -563,7 +563,7 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 				].concat(n), a = r(i);
 				e ? e(a) : t({
 					csvContent: a,
-					title: M.value.style.chart.title.text || "vue-ui-rings"
+					title: N.value.style.chart.title.text || "vue-ui-rings"
 				});
 			});
 		}
@@ -572,13 +572,13 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 			Q.value = e, Pt.value += 1;
 		}
 		function Mn() {
-			V.value.showTable = !V.value.showTable;
+			H.value.showTable = !H.value.showTable;
 		}
 		function Nn() {
-			V.value.showTooltip = !V.value.showTooltip;
+			H.value.showTooltip = !H.value.showTooltip;
 		}
 		function Pn() {
-			V.value.showLabels = !V.value.showLabels;
+			H.value.showLabels = !H.value.showLabels;
 		}
 		let Fn = y(!1);
 		function In() {
@@ -595,86 +595,86 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 			return {
 				imageUri: i,
 				base64: a,
-				title: M.value.style.chart.title.text,
+				title: N.value.style.chart.title.text,
 				width: t,
 				height: n,
 				aspectRatio: r
 			};
 		}
 		let $ = c(() => {
-			let e = M.value.table.useDialog && !M.value.table.show, t = V.value.showTable;
+			let e = N.value.table.useDialog && !N.value.table.show, t = H.value.showTable;
 			return {
 				component: e ? Dt : St,
-				title: `${M.value.style.chart.title.text}${M.value.style.chart.title.subtitle.text ? `: ${M.value.style.chart.title.subtitle.text}` : ""}`,
+				title: `${N.value.style.chart.title.text}${N.value.style.chart.title.subtitle.text ? `: ${N.value.style.chart.title.subtitle.text}` : ""}`,
 				props: e ? {
-					backgroundColor: M.value.table.th.backgroundColor,
-					color: M.value.table.th.color,
-					headerColor: M.value.table.th.color,
-					headerBg: M.value.table.th.backgroundColor,
+					backgroundColor: N.value.table.th.backgroundColor,
+					color: N.value.table.th.color,
+					headerColor: N.value.table.th.color,
+					headerBg: N.value.table.th.backgroundColor,
 					isFullscreen: Q.value,
 					fullscreenParent: k.value,
 					forcedWidth: Math.min(800, window.innerWidth * .8),
-					isCursorPointer: P.value
+					isCursorPointer: F.value
 				} : {
 					hideDetails: !0,
 					config: {
 						open: t,
 						maxHeight: 1e4,
 						body: {
-							backgroundColor: M.value.style.chart.backgroundColor,
-							color: M.value.style.chart.color
+							backgroundColor: N.value.style.chart.backgroundColor,
+							color: N.value.style.chart.color
 						},
 						head: {
-							backgroundColor: M.value.style.chart.backgroundColor,
-							color: M.value.style.chart.color
+							backgroundColor: N.value.style.chart.backgroundColor,
+							color: N.value.style.chart.color
 						}
 					}
 				}
 			};
 		});
-		Qe(() => V.value.showTable, (e) => {
-			M.value.table.show || (e && M.value.table.useDialog && A.value ? A.value.open() : "close" in A.value && A.value.close());
+		Qe(() => H.value.showTable, (e) => {
+			N.value.table.show || (e && N.value.table.useDialog && A.value ? A.value.open() : "close" in A.value && A.value.close());
 		});
 		function Rn() {
-			V.value.showTable = !1, Wt.value && Wt.value.setTableIconState(!1);
+			H.value.showTable = !1, Wt.value && Wt.value.setTableIconState(!1);
 		}
 		let zn = c(() => yn.value.map((e) => ({
 			...e,
 			name: e.display
-		}))), Bn = c(() => M.value.style.chart.backgroundColor), Vn = c(() => M.value.style.chart.legend), Hn = c(() => M.value.style.chart.title), { isCallbackImaging: Un, isCallbackSvg: Wn, generateSvg: Gn, onGenerateImage: Kn } = Se({
-			svg: I,
+		}))), Bn = c(() => N.value.style.chart.backgroundColor), Vn = c(() => N.value.style.chart.legend), Hn = c(() => N.value.style.chart.title), { isCallbackImaging: Un, isCallbackSvg: Wn, generateSvg: Gn, onGenerateImage: Kn } = Se({
+			svg: L,
 			title: Hn,
 			legend: Vn,
 			legendItems: zn,
 			backgroundColor: Bn,
-			getSvgCallback: () => M.value.userOptions.callbacks.svg,
-			generateImage: sn
+			getSvgCallback: () => N.value.userOptions.callbacks.svg,
+			generateImage: on
 		});
 		async function qn() {
-			if (dn("copyAlt", {
-				config: M.value,
+			if (un("copyAlt", {
+				config: N.value,
 				dataset: q.value
-			}), !M.value.userOptions.callbacks.altCopy) {
+			}), !N.value.userOptions.callbacks.altCopy) {
 				console.warn("Vue Data UI - A callback must be set for `altCopy` in userOptions.");
 				return;
 			}
-			await Promise.resolve(M.value.userOptions.callbacks.altCopy({
-				config: M.value,
+			await Promise.resolve(N.value.userOptions.callbacks.altCopy({
+				config: N.value,
 				dataset: q.value
 			}));
 		}
 		function Jn() {
-			j.value = null, qt.value = !0;
+			j.value = null, Kt.value = !0;
 		}
 		function Yn() {
-			j.value = null, Kt.value = "pointer", D.value = !1, O.value = null, qt.value = !1;
+			j.value = null, M.value = "pointer", D.value = !1, O.value = null, Kt.value = !1;
 		}
 		function Xn(e) {
-			if (!I.value || Fn.value || document.activeElement !== I.value || !q.value.length || U.value.length === w.dataset.length) return;
+			if (!L.value || Fn.value || document.activeElement !== L.value || !q.value.length || W.value.length === w.dataset.length) return;
 			let t = ["ArrowLeft", "ArrowUp"].includes(e.key), n = ["ArrowRight", "ArrowDown"].includes(e.key), r = e.key === "Enter" || e.key === " ", i = e.key === "Escape";
 			if (!t && !n && !r && !i) return;
 			if (e.preventDefault(), e.stopPropagation(), i) {
-				j.value = null, Kt.value = "pointer", D.value = !1, O.value = null;
+				j.value = null, M.value = "pointer", D.value = !1, O.value = null;
 				return;
 			}
 			if (r) {
@@ -690,13 +690,13 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 			o && (Zn(a), kn(o, a, "keyboard"));
 		}
 		function Zn(e) {
-			if (!Number.isFinite(e) || !I.value) return;
+			if (!Number.isFinite(e) || !L.value) return;
 			let t = q.value[e];
 			if (!t) return;
-			let n = Y(t, e), r = I.value.getBoundingClientRect();
+			let n = Y(t, e), r = L.value.getBoundingClientRect();
 			Gt.value = {
-				x: r.left + n.x / H.value.width * r.width,
-				y: r.top + n.y / H.value.height * r.height
+				x: r.left + n.x / U.value.width * r.width,
+				y: r.top + n.y / U.value.height * r.height
 			};
 		}
 		let Qn = c(() => ({
@@ -706,9 +706,9 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 		return De({
 			getData: xn,
 			getImage: Ln,
-			generatePdf: on,
+			generatePdf: an,
 			generateCsv: An,
-			generateImage: sn,
+			generateImage: on,
 			generateSvg: Gn,
 			hideSeries: gn,
 			showSeries: hn,
@@ -721,25 +721,25 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 		}), (e, t) => (v(), d("div", {
 			ref_key: "ringsChart",
 			ref: k,
-			class: h(`vue-data-ui-component vue-ui-rings ${Q.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${M.value.useCssAnimation ? "" : "vue-ui-dna"}`),
-			style: _(`font-family:${M.value.style.fontFamily};text-align:center;width:100%;background:${M.value.style.chart.backgroundColor};${M.value.responsive ? "height: 100%" : ""}`),
+			class: h(`vue-data-ui-component vue-ui-rings ${Q.value ? "vue-data-ui-wrapper-fullscreen" : ""} ${N.value.useCssAnimation ? "" : "vue-ui-dna"}`),
+			style: _(`font-family:${N.value.style.fontFamily};text-align:center;width:100%;background:${N.value.style.chart.backgroundColor};${N.value.responsive ? "height: 100%" : ""}`),
 			id: `rings_${E.value}`,
 			onMouseleave: t[2] ||= (e) => {
-				O.value = null, D.value = !1, S(Qt)(!1);
+				O.value = null, D.value = !1, S(Zt)(!1);
 			},
-			onMouseenter: t[3] ||= () => S(Qt)(!0)
+			onMouseenter: t[3] ||= () => S(Zt)(!0)
 		}, [
 			f("div", {
 				id: `chart-instructions-${E.value}`,
 				class: "sr-only"
-			}, [f("p", null, x(M.value.a11y.translations.keyboardNavigation), 1)], 8, tt),
+			}, [f("p", null, x(N.value.a11y.translations.keyboardNavigation), 1)], 8, tt),
 			Qn.value?.rows?.length ? (v(), l(Me, {
 				key: 0,
 				uid: E.value,
 				head: Qn.value.headers,
 				body: Qn.value.rows,
-				notice: M.value.a11y.translations.tableAvailable,
-				caption: M.value.a11y.translations.tableCaption
+				notice: N.value.a11y.translations.tableAvailable,
+				caption: N.value.a11y.translations.tableCaption
 			}, null, 8, [
 				"uid",
 				"head",
@@ -747,13 +747,14 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 				"notice",
 				"caption"
 			])) : u("", !0),
-			M.value.userOptions.buttons.annotator ? (v(), l(S(wt), {
+			N.value.userOptions.buttons.annotator ? (v(), l(S(wt), {
 				key: 1,
-				svgRef: S(I),
-				backgroundColor: M.value.style.chart.backgroundColor,
-				color: M.value.style.chart.color,
+				svgRef: S(L),
+				backgroundColor: N.value.style.chart.backgroundColor,
+				color: N.value.style.chart.color,
 				active: Fn.value,
-				isCursorPointer: P.value,
+				isCursorPointer: F.value,
+				palette: N.value.userOptions.annotatorPalette,
 				onClose: In
 			}, {
 				"annotator-action-close": C(() => [b(e.$slots, "annotator-action-close", {}, void 0, !0)]),
@@ -768,16 +769,17 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 				"backgroundColor",
 				"color",
 				"active",
-				"isCursorPointer"
+				"isCursorPointer",
+				"palette"
 			])) : u("", !0),
-			cn.value ? (v(), d("div", {
+			sn.value ? (v(), d("div", {
 				key: 2,
 				ref_key: "noTitle",
 				ref: Rt,
 				class: "vue-data-ui-no-title-space",
 				style: "height:36px; width: 100%;background:transparent"
 			}, null, 512)) : u("", !0),
-			M.value.style.chart.title.text ? (v(), d("div", {
+			N.value.style.chart.title.text ? (v(), d("div", {
 				key: 3,
 				ref_key: "chartTitle",
 				ref: Ft,
@@ -787,46 +789,46 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 				config: {
 					title: {
 						cy: "rings-div-title",
-						...M.value.style.chart.title
+						...N.value.style.chart.title
 					},
 					subtitle: {
 						cy: "rings-div-subtitle",
-						...M.value.style.chart.title.subtitle
+						...N.value.style.chart.title.subtitle
 					}
 				}
 			}, null, 8, ["config"]))], 512)) : u("", !0),
 			f("div", { id: `legend-top-${E.value}` }, null, 8, nt),
-			M.value.userOptions.show && Mt.value && (S($t) || S(Zt)) ? (v(), l(S(Tt), {
+			N.value.userOptions.show && Mt.value && (S(Qt) || S(Xt)) ? (v(), l(S(Tt), {
 				ref_key: "userOptionsRef",
 				ref: Wt,
 				key: `user_options_${Pt.value}`,
-				backgroundColor: M.value.style.chart.backgroundColor,
-				color: M.value.style.chart.color,
-				isPrinting: S(rn),
-				isImaging: S(an),
+				backgroundColor: N.value.style.chart.backgroundColor,
+				color: N.value.style.chart.color,
+				isPrinting: S(nn),
+				isImaging: S(rn),
 				uid: E.value,
-				hasTooltip: M.value.userOptions.buttons.tooltip && M.value.style.chart.tooltip.show,
-				hasPdf: M.value.userOptions.buttons.pdf,
-				hasXls: M.value.userOptions.buttons.csv,
-				hasImg: M.value.userOptions.buttons.img,
-				hasSvg: M.value.userOptions.buttons.svg,
-				hasTable: M.value.userOptions.buttons.table,
-				hasFullscreen: M.value.userOptions.buttons.fullscreen,
-				hasAltCopy: M.value.userOptions.buttons.altCopy,
-				hasLabel: M.value.userOptions.buttons.labels,
-				isTooltip: V.value.showTooltip,
+				hasTooltip: N.value.userOptions.buttons.tooltip && N.value.style.chart.tooltip.show,
+				hasPdf: N.value.userOptions.buttons.pdf,
+				hasXls: N.value.userOptions.buttons.csv,
+				hasImg: N.value.userOptions.buttons.img,
+				hasSvg: N.value.userOptions.buttons.svg,
+				hasTable: N.value.userOptions.buttons.table,
+				hasFullscreen: N.value.userOptions.buttons.fullscreen,
+				hasAltCopy: N.value.userOptions.buttons.altCopy,
+				hasLabel: N.value.userOptions.buttons.labels,
+				isTooltip: H.value.showTooltip,
 				isFullscreen: Q.value,
-				titles: { ...M.value.userOptions.buttonTitles },
+				titles: { ...N.value.userOptions.buttonTitles },
 				chartElement: k.value,
-				position: M.value.userOptions.position,
-				hasAnnotator: M.value.userOptions.buttons.annotator,
+				position: N.value.userOptions.position,
+				hasAnnotator: N.value.userOptions.buttons.annotator,
 				isAnnotation: Fn.value,
-				callbacks: M.value.userOptions.callbacks,
-				printScale: M.value.userOptions.print.scale,
-				tableDialog: M.value.table.useDialog,
-				isCursorPointer: P.value,
+				callbacks: N.value.userOptions.callbacks,
+				printScale: N.value.userOptions.print.scale,
+				tableDialog: N.value.table.useDialog,
+				isCursorPointer: F.value,
 				onToggleFullscreen: jn,
-				onGeneratePdf: S(on),
+				onGeneratePdf: S(an),
 				onGenerateCsv: An,
 				onGenerateImage: S(Kn),
 				onGenerateSvg: S(Gn),
@@ -835,7 +837,7 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 				onToggleAnnotator: In,
 				onToggleLabels: Pn,
 				onCopyAlt: qn,
-				style: _({ visibility: S($t) ? S(Zt) ? "visible" : "hidden" : "visible" })
+				style: _({ visibility: S(Qt) ? S(Xt) ? "visible" : "hidden" : "visible" })
 			}, Be({ _: 2 }, [
 				e.$slots.menuIcon ? {
 					name: "menuIcon",
@@ -914,16 +916,16 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 			]), 1032, /* @__PURE__ */ "backgroundColor.color.isPrinting.isImaging.uid.hasTooltip.hasPdf.hasXls.hasImg.hasSvg.hasTable.hasFullscreen.hasAltCopy.hasLabel.isTooltip.isFullscreen.titles.chartElement.position.hasAnnotator.isAnnotation.callbacks.printScale.tableDialog.isCursorPointer.onGeneratePdf.onGenerateImage.onGenerateSvg.style".split("."))) : u("", !0),
 			f("div", rt, [(v(), d("svg", {
 				ref_key: "svgRef",
-				ref: I,
+				ref: L,
 				xmlns: S(fe),
 				class: h({
 					"vue-data-ui-fullscreen--on": Q.value,
 					"vue-data-ui-fulscreen--off": !Q.value,
-					resizing: Ht.value || S(F),
-					"vue-data-ui-no-transition": !S(N)
+					resizing: Ht.value || S(I),
+					"vue-data-ui-no-transition": !S(P)
 				}),
-				viewBox: `0 0 ${H.value.width <= 0 ? 10 : H.value.width} ${H.value.height <= 0 ? 10 : H.value.height}`,
-				style: _(`max-width:100%;overflow:hidden;background:transparent;color:${M.value.style.chart.color}`),
+				viewBox: `0 0 ${U.value.width <= 0 ? 10 : U.value.width} ${U.value.height <= 0 ? 10 : U.value.height}`,
+				style: _(`max-width:100%;overflow:hidden;background:transparent;color:${N.value.style.chart.color}`),
 				"aria-describedby": `chart-instructions-${E.value}`,
 				tabindex: "0",
 				onFocus: Jn,
@@ -935,8 +937,8 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 					key: 0,
 					x: 0,
 					y: 0,
-					width: H.value.width <= 0 ? 10 : H.value.width,
-					height: H.value.height <= 0 ? 10 : H.value.height,
+					width: U.value.width <= 0 ? 10 : U.value.width,
+					height: U.value.height <= 0 ? 10 : U.value.height,
 					style: { pointerEvents: "none" }
 				}, [b(e.$slots, "chart-background", {}, void 0, !0)], 8, at)) : u("", !0),
 				f("defs", null, [(v(!0), d(Re, null, qe(q.value, (e, t) => (v(), l(Ae, {
@@ -950,7 +952,7 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 					key: `gradient_${E.value}_${t}`,
 					stops: [[
 						"0%",
-						S(a)(S(ie)(e.color, .05), 100 - M.value.style.chart.layout.rings.gradient.intensity),
+						S(te)(S(re)(e.color, .05), 100 - N.value.style.chart.layout.rings.gradient.intensity),
 						1
 					], [
 						"100%",
@@ -965,51 +967,51 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 				(v(!0), d(Re, null, qe(q.value, (t, n) => (v(), d("g", { key: `r_${t.uid}` }, [
 					f("circle", {
 						class: h({
-							"vue-data-ui-transition": T.value && S(N),
-							"vue-rings-item-onload": !T.value && M.value.useCssAnimation && !S(F),
+							"vue-data-ui-transition": T.value && S(P),
+							"vue-rings-item-onload": !T.value && N.value.useCssAnimation && !S(I),
 							"vue-ui-rings-opacity": O.value !== null && O.value !== n
 						}),
 						style: _(`animation-delay:${n * 100}ms`),
-						stroke: M.value.style.chart.layout.rings.stroke,
-						cx: L.value.x,
+						stroke: N.value.style.chart.layout.rings.stroke,
+						cx: R.value.x,
 						cy: Dn(t, n),
 						r: En(t),
-						fill: M.value.style.chart.layout.rings.gradient.underlayerColor
+						fill: N.value.style.chart.layout.rings.gradient.underlayerColor
 					}, null, 14, st),
 					f("circle", {
 						class: h({
-							"vue-data-ui-transition": T.value && S(N),
-							"vue-rings-item-onload": !T.value && M.value.useCssAnimation && !S(F),
-							"vue-ui-rings-shadow": M.value.style.chart.layout.rings.useShadow,
+							"vue-data-ui-transition": T.value && S(P),
+							"vue-rings-item-onload": !T.value && N.value.useCssAnimation && !S(I),
+							"vue-ui-rings-shadow": N.value.style.chart.layout.rings.useShadow,
 							"vue-ui-rings-blur": O.value !== null && O.value !== n
 						}),
 						style: _(`animation-delay:${n * 100}ms`),
-						stroke: M.value.style.chart.layout.rings.stroke,
+						stroke: N.value.style.chart.layout.rings.stroke,
 						"stroke-width": t.strokeWidth < .5 ? .5 : t.strokeWidth,
-						cx: L.value.x,
+						cx: R.value.x,
 						cy: Dn(t, n),
 						r: En(t),
-						fill: M.value.style.chart.layout.rings.gradient.show ? `url(#gradient_${E.value}_${n})` : t.color
+						fill: N.value.style.chart.layout.rings.gradient.show ? `url(#gradient_${E.value}_${n})` : t.color
 					}, null, 14, ct),
 					e.$slots.pattern ? (v(), d("circle", {
 						key: 0,
 						class: h({
-							"vue-data-ui-transition": T.value && S(N),
-							"vue-rings-item-onload": !T.value && M.value.useCssAnimation && !S(F),
-							"vue-ui-rings-shadow": M.value.style.chart.layout.rings.useShadow,
+							"vue-data-ui-transition": T.value && S(P),
+							"vue-rings-item-onload": !T.value && N.value.useCssAnimation && !S(I),
+							"vue-ui-rings-shadow": N.value.style.chart.layout.rings.useShadow,
 							"vue-ui-rings-blur": O.value !== null && O.value !== n
 						}),
 						style: _(`animation-delay:${n * 100}ms`),
-						stroke: M.value.style.chart.layout.rings.stroke,
+						stroke: N.value.style.chart.layout.rings.stroke,
 						"stroke-width": t.strokeWidth < .5 ? .5 : t.strokeWidth,
-						cx: L.value.x,
+						cx: R.value.x,
 						cy: Dn(t, n),
 						r: En(t),
 						fill: `url(#pattern_${E.value}_${t.absoluteIndex})`
 					}, null, 14, lt)) : u("", !0),
 					f("circle", {
 						stroke: "none",
-						cx: L.value.x,
+						cx: R.value.x,
 						cy: Dn(t, n),
 						r: En(t),
 						fill: "transparent",
@@ -1017,53 +1019,53 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 						onMouseleave: (e) => Cn(t, n),
 						onClick: (e) => Sn(t, n)
 					}, null, 40, ut),
-					V.value.showLabels ? (v(), d(Re, { key: 1 }, [
+					H.value.showLabels ? (v(), d(Re, { key: 1 }, [
 						f("rect", {
-							x: M.value.style.chart.layout.labels.dataLabels.markers.position === "left" ? Y(t, n).x : L.value.x,
-							y: Y(t, n).y - M.value.style.chart.layout.labels.dataLabels.markers.strokeWidth / 2,
-							width: Math.abs(L.value.x - Y(t, n).x),
-							height: M.value.style.chart.layout.labels.dataLabels.markers.strokeWidth,
-							fill: M.value.style.chart.layout.labels.dataLabels.markers.stroke,
-							rx: M.value.style.chart.layout.labels.dataLabels.markers.strokeWidth,
+							x: N.value.style.chart.layout.labels.dataLabels.markers.position === "left" ? Y(t, n).x : R.value.x,
+							y: Y(t, n).y - N.value.style.chart.layout.labels.dataLabels.markers.strokeWidth / 2,
+							width: Math.abs(R.value.x - Y(t, n).x),
+							height: N.value.style.chart.layout.labels.dataLabels.markers.strokeWidth,
+							fill: N.value.style.chart.layout.labels.dataLabels.markers.stroke,
+							rx: N.value.style.chart.layout.labels.dataLabels.markers.strokeWidth,
 							class: h({
-								"vue-data-ui-transition": T.value && S(N),
-								"vue-rings-item-onload": !T.value && M.value.useCssAnimation && !S(F),
-								"vue-ui-rings-shadow": M.value.style.chart.layout.rings.useShadow,
+								"vue-data-ui-transition": T.value && S(P),
+								"vue-rings-item-onload": !T.value && N.value.useCssAnimation && !S(I),
+								"vue-ui-rings-shadow": N.value.style.chart.layout.rings.useShadow,
 								"vue-ui-rings-blur": O.value !== null && O.value !== n
 							})
 						}, null, 10, dt),
 						f("circle", {
 							cx: Y(t, n).x,
 							cy: Y(t, n).y,
-							r: M.value.style.chart.layout.labels.dataLabels.markers.radius,
+							r: N.value.style.chart.layout.labels.dataLabels.markers.radius,
 							fill: t.color,
-							stroke: M.value.style.chart.backgroundColor,
+							stroke: N.value.style.chart.backgroundColor,
 							class: h({
-								"vue-data-ui-transition": T.value && S(N),
-								"vue-rings-item-onload": !T.value && M.value.useCssAnimation && !S(F),
-								"vue-ui-rings-shadow": M.value.style.chart.layout.rings.useShadow,
+								"vue-data-ui-transition": T.value && S(P),
+								"vue-rings-item-onload": !T.value && N.value.useCssAnimation && !S(I),
+								"vue-ui-rings-shadow": N.value.style.chart.layout.rings.useShadow,
 								"vue-ui-rings-blur": O.value !== null && O.value !== n
 							})
 						}, null, 10, ft),
 						f("text", {
-							"text-anchor": M.value.style.chart.layout.labels.dataLabels.markers.position === "left" ? "end" : "start",
-							"font-size": M.value.style.chart.layout.labels.dataLabels.fontSize,
-							fill: M.value.style.chart.layout.labels.dataLabels.color,
-							"font-weight": M.value.style.chart.layout.labels.dataLabels.bold ? "bold" : "normal",
+							"text-anchor": N.value.style.chart.layout.labels.dataLabels.markers.position === "left" ? "end" : "start",
+							"font-size": N.value.style.chart.layout.labels.dataLabels.fontSize,
+							fill: N.value.style.chart.layout.labels.dataLabels.color,
+							"font-weight": N.value.style.chart.layout.labels.dataLabels.bold ? "bold" : "normal",
 							class: h({
-								"vue-data-ui-transition": T.value && S(N),
-								"vue-rings-item-onload": !T.value && M.value.useCssAnimation && !S(F),
-								"vue-ui-rings-shadow": M.value.style.chart.layout.rings.useShadow,
+								"vue-data-ui-transition": T.value && S(P),
+								"vue-rings-item-onload": !T.value && N.value.useCssAnimation && !S(I),
+								"vue-ui-rings-shadow": N.value.style.chart.layout.rings.useShadow,
 								"vue-ui-rings-blur": O.value !== null && O.value !== n
 							}),
-							transform: `translate(${Y(t, n).x + (M.value.style.chart.layout.labels.dataLabels.markers.position === "left" ? -M.value.style.chart.layout.labels.dataLabels.offsetX - 14 : M.value.style.chart.layout.labels.dataLabels.offsetX) + 6}, ${Y(t, n).y + M.value.style.chart.layout.labels.dataLabels.fontSize / 3})`,
+							transform: `translate(${Y(t, n).x + (N.value.style.chart.layout.labels.dataLabels.markers.position === "left" ? -N.value.style.chart.layout.labels.dataLabels.offsetX - 14 : N.value.style.chart.layout.labels.dataLabels.offsetX) + 6}, ${Y(t, n).y + N.value.style.chart.layout.labels.dataLabels.fontSize / 3})`,
 							onMouseenter: (e) => kn(t, n, "pointer"),
 							onMouseleave: (e) => Cn(t, n),
 							onClick: (e) => Sn(t, n),
 							innerHTML: S(i)({
 								content: Tn(t),
-								fontSize: M.value.style.chart.layout.labels.dataLabels.fontSize,
-								fill: M.value.style.chart.layout.labels.dataLabels.color,
+								fontSize: N.value.style.chart.layout.labels.dataLabels.fontSize,
+								fill: N.value.style.chart.layout.labels.dataLabels.color,
 								x: 0,
 								y: 0,
 								translateY: !0
@@ -1072,42 +1074,42 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 					], 64)) : u("", !0)
 				]))), 128)),
 				b(e.$slots, "svg", { svg: {
-					...H.value,
-					isPrintingImg: S(rn) || S(an) || S(Un),
+					...U.value,
+					isPrintingImg: S(nn) || S(rn) || S(Un),
 					isPrintingSvg: S(Wn)
 				} }, void 0, !0)
 			], 46, it)), e.$slots.hint ? (v(), d("div", mt, [b(e.$slots, "hint", g(m({
-				hint: M.value.a11y.translations.keyboardNavigation,
-				isVisible: qt.value
+				hint: N.value.a11y.translations.keyboardNavigation,
+				isVisible: Kt.value
 			})), void 0, !0)])) : u("", !0)]),
-			e.$slots.watermark ? (v(), d("div", ht, [b(e.$slots, "watermark", g(m({ isPrinting: S(rn) || S(an) || S(Un) || S(Wn) })), void 0, !0)])) : u("", !0),
+			e.$slots.watermark ? (v(), d("div", ht, [b(e.$slots, "watermark", g(m({ isPrinting: S(nn) || S(rn) || S(Un) || S(Wn) })), void 0, !0)])) : u("", !0),
 			f("div", { id: `legend-bottom-${E.value}` }, null, 8, gt),
-			Ut.value && (M.value.style.chart.legend.show || e.$slots.legend) ? (v(), l(ze, {
+			Ut.value && (N.value.style.chart.legend.show || e.$slots.legend) ? (v(), l(ze, {
 				key: 6,
-				to: M.value.style.chart.legend.position === "top" ? `#legend-top-${E.value}` : `#legend-bottom-${E.value}`
+				to: N.value.style.chart.legend.position === "top" ? `#legend-top-${E.value}` : `#legend-bottom-${E.value}`
 			}, [f("div", {
 				ref_key: "chartLegend",
 				ref: It
-			}, [b(e.$slots, "legend", { legend: yn.value }, () => [M.value.style.chart.legend.show ? (v(), l(Ie, {
+			}, [b(e.$slots, "legend", { legend: yn.value }, () => [N.value.style.chart.legend.show ? (v(), l(Ie, {
 				key: `legend_${Vt.value}`,
 				legendSet: yn.value,
 				config: bn.value,
-				isCursorPointer: P.value,
-				onClickMarker: t[0] ||= ({ legend: e }) => W(e.uid)
+				isCursorPointer: F.value,
+				onClickMarker: t[0] ||= ({ legend: e }) => pn(e.uid)
 			}, Be({
-				item: C(({ legend: e, index: t }) => [S(F) ? u("", !0) : (v(), d("div", {
+				item: C(({ legend: e, index: t }) => [S(I) ? u("", !0) : (v(), d("div", {
 					key: 0,
-					onClick: (t) => W(e.uid),
-					style: _(`opacity:${U.value.includes(e.uid) ? .5 : 1}`)
+					onClick: (t) => pn(e.uid),
+					style: _(`opacity:${W.value.includes(e.uid) ? .5 : 1}`)
 				}, x(e.display), 13, _t))]),
-				legendToggle: C(() => [yn.value.length > 2 && M.value.style.chart.legend.selectAllToggle.show && !S(F) ? (v(), l(je, {
+				legendToggle: C(() => [yn.value.length > 2 && N.value.style.chart.legend.selectAllToggle.show && !S(I) ? (v(), l(je, {
 					key: 0,
-					backgroundColor: M.value.style.chart.legend.selectAllToggle.backgroundColor,
-					color: M.value.style.chart.legend.selectAllToggle.color,
-					fontSize: M.value.style.chart.legend.fontSize,
-					checked: U.value.length > 0,
-					isCursorPointer: P.value,
-					onToggle: fn
+					backgroundColor: N.value.style.chart.legend.selectAllToggle.backgroundColor,
+					color: N.value.style.chart.legend.selectAllToggle.color,
+					fontSize: N.value.style.chart.legend.fontSize,
+					checked: W.value.length > 0,
+					isCursorPointer: F.value,
+					onToggle: dn
 				}, null, 8, [
 					"backgroundColor",
 					"color",
@@ -1141,27 +1143,27 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 				dir: "auto"
 			}, [b(e.$slots, "source", {}, void 0, !0)], 512)) : u("", !0),
 			He(S(bt), {
-				teleportTo: M.value.style.chart.tooltip.teleportTo,
-				show: V.value.showTooltip && D.value && U.value.length < w.dataset.length,
-				backgroundColor: M.value.style.chart.tooltip.backgroundColor,
-				color: M.value.style.chart.tooltip.color,
-				borderRadius: M.value.style.chart.tooltip.borderRadius,
-				borderColor: M.value.style.chart.tooltip.borderColor,
-				borderWidth: M.value.style.chart.tooltip.borderWidth,
-				fontSize: M.value.style.chart.tooltip.fontSize,
-				backgroundOpacity: M.value.style.chart.tooltip.backgroundOpacity,
-				position: M.value.style.chart.tooltip.position,
-				offsetX: M.value.style.chart.tooltip.offsetX,
-				offsetY: M.value.style.chart.tooltip.offsetY,
+				teleportTo: N.value.style.chart.tooltip.teleportTo,
+				show: H.value.showTooltip && D.value && W.value.length < w.dataset.length,
+				backgroundColor: N.value.style.chart.tooltip.backgroundColor,
+				color: N.value.style.chart.tooltip.color,
+				borderRadius: N.value.style.chart.tooltip.borderRadius,
+				borderColor: N.value.style.chart.tooltip.borderColor,
+				borderWidth: N.value.style.chart.tooltip.borderWidth,
+				fontSize: N.value.style.chart.tooltip.fontSize,
+				backgroundOpacity: N.value.style.chart.tooltip.backgroundOpacity,
+				position: N.value.style.chart.tooltip.position,
+				offsetX: N.value.style.chart.tooltip.offsetX,
+				offsetY: N.value.style.chart.tooltip.offsetY,
 				parent: k.value,
 				content: Nt.value,
 				isFullscreen: Q.value,
-				isCustom: M.value.style.chart.tooltip.customFormat && typeof M.value.style.chart.tooltip.customFormat == "function",
-				smooth: M.value.style.chart.tooltip.smooth,
-				backdropFilter: M.value.style.chart.tooltip.backdropFilter,
-				smoothForce: M.value.style.chart.tooltip.smoothForce,
-				smoothSnapThreshold: M.value.style.chart.tooltip.smoothSnapThreshold,
-				isA11yMode: Kt.value === "keyboard",
+				isCustom: N.value.style.chart.tooltip.customFormat && typeof N.value.style.chart.tooltip.customFormat == "function",
+				smooth: N.value.style.chart.tooltip.smooth,
+				backdropFilter: N.value.style.chart.tooltip.backdropFilter,
+				smoothForce: N.value.style.chart.tooltip.smoothForce,
+				smoothSnapThreshold: N.value.style.chart.tooltip.smoothSnapThreshold,
+				isA11yMode: M.value === "keyboard",
 				a11yPosition: Gt.value
 			}, {
 				"tooltip-before": C(() => [b(e.$slots, "tooltip-before", g(m({ ...On.value })), void 0, !0)]),
@@ -1192,7 +1194,7 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 				"isA11yMode",
 				"a11yPosition"
 			]),
-			Mt.value && M.value.userOptions.buttons.table ? (v(), l(Je($.value.component), Ue({ key: 8 }, $.value.props, {
+			Mt.value && N.value.userOptions.buttons.table ? (v(), l(Je($.value.component), Ue({ key: 8 }, $.value.props, {
 				ref_key: "tableUnit",
 				ref: A,
 				onClose: Rn
@@ -1203,9 +1205,9 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 					head: Z.value.head,
 					body: Z.value.body,
 					config: Z.value.config,
-					title: M.value.table.useDialog ? "" : $.value.title,
-					withCloseButton: !M.value.table.useDialog,
-					isCursorPointer: P.value,
+					title: N.value.table.useDialog ? "" : $.value.title,
+					withCloseButton: !N.value.table.useDialog,
+					isCursorPointer: F.value,
 					onClose: Rn
 				}, {
 					th: C(({ th: e }) => [e === "__SUM__" ? (v(), d("div", vt, [He(S(xt), {
@@ -1225,26 +1227,26 @@ var $e = /* @__PURE__ */ e({ default: () => bt }), et = ["id"], tt = ["id"], nt
 					"isCursorPointer"
 				]))]),
 				_: 2
-			}, [M.value.table.useDialog ? {
+			}, [N.value.table.useDialog ? {
 				name: "title",
 				fn: C(() => [Ve(x($.value.title), 1)]),
 				key: "0"
-			} : void 0, M.value.table.useDialog ? {
+			} : void 0, N.value.table.useDialog ? {
 				name: "actions",
 				fn: C(() => [f("button", {
 					tabindex: "0",
 					class: "vue-ui-user-options-button",
-					onClick: t[1] ||= (e) => An(M.value.userOptions.callbacks.csv),
-					style: _({ cursor: P.value ? "pointer" : "default" })
+					onClick: t[1] ||= (e) => An(N.value.userOptions.callbacks.csv),
+					style: _({ cursor: F.value ? "pointer" : "default" })
 				}, [He(S(xt), {
 					name: "fileCsv",
 					stroke: $.value.props.color
 				}, null, 8, ["stroke"])], 4)]),
 				key: "1"
 			} : void 0]), 1040)) : u("", !0),
-			b(e.$slots, "skeleton", {}, () => [S(F) ? (v(), l(ye, { key: 0 })) : u("", !0)], !0)
+			b(e.$slots, "skeleton", {}, () => [S(I) ? (v(), l(ye, { key: 0 })) : u("", !0)], !0)
 		], 46, et));
 	}
-}, [["__scopeId", "data-v-157db649"]]);
+}, [["__scopeId", "data-v-78347f44"]]);
 //#endregion
 export { $e as n, bt as t };