vue-data-ui/dist/vue-ui-stackline-Pz5WWlWT.js

A user-empowering data visualization Vue 3 components library for eloquent data storytelling

import { t as e } from "./rolldown-runtime-Dy4uBu1J.js";
import { $ as t, Bt as n, D as r, Gt as i, Jt as a, Kt as o, M as s, Ot as c, P as l, Pt as u, S as d, St as f, V as p, Wt as m, X as h, _ as g, b as _, c as ee, ct as te, dt as ne, i as v, jt as re, ot as ie, pt as ae, q as oe, t as se, tt as ce, v as le, w as ue, xt as de, z as fe } from "./lib-Bttd6u5E.js";
import { n as pe, t as me } from "./useHints-Dq_w2E8B.js";
import { n as he, r as ge, t as _e } from "./useTimeLabels-d2f-W1L4.js";
import { t as ve } from "./useConfig-D3scuR88.js";
import { t as ye } from "./usePrinter-DN5bYhTG.js";
import { n as be, t as xe } from "./BaseScanner-DZvpgOjM.js";
import { t as Se } from "./useSvgExport-DH-FfcqQ.js";
import { t as Ce } from "./useNestedProp-vPNvh7rV.js";
import { t as we } from "./useThemeCheck-C43Tcqmk.js";
import { t as Te } from "./useTransitions-g_zBREk2.js";
import { t as Ee } from "./useStableElementSize-C7KADDKj.js";
import { t as De } from "./useTimeLabelCollider-AEcY4Ioe.js";
import { t as Oe } from "./img-Bnokohej.js";
import { n as ke } from "./Title-BE3qg9xl.js";
import { t as Ae } from "./Shape-C21CMlWS.js";
import { t as je } from "./_plugin-vue_export-helper-B3ysoDQm.js";
import { l as Me, t as Ne } from "./useResponsive-ZtArZtUf.js";
import { t as Pe } from "./DefGrad-DVBqDjhO.js";
import { t as Fe } from "./SlicerPreview-wUw1hFwe.js";
import { t as Ie } from "./BaseLegendToggle-DZVucLnv.js";
import { t as Le } from "./A11yDataTable-DdRsVULz.js";
import { t as Re } from "./useUserOptionState-DK-_1ddE.js";
import { t as ze } from "./useChartAccessibility-DYqac8yF.js";
import { t as Be } from "./Legend-CQxUgOd-.js";
import { t as Ve } from "./vue_ui_stackline-DQqKPA9z.js";
import { Fragment as y, Teleport as He, computed as b, createBlock as x, createCommentVNode as S, createElementBlock as C, createElementVNode as w, createSlots as Ue, createTextVNode as We, createVNode as Ge, defineAsyncComponent as Ke, guardReactiveProps as T, mergeProps as qe, nextTick as Je, normalizeClass as Ye, normalizeProps as E, normalizeStyle as Xe, onBeforeUnmount as Ze, onMounted as Qe, openBlock as D, ref as O, renderList as k, renderSlot as A, resolveDynamicComponent as $e, shallowRef as et, toDisplayString as j, toRefs as tt, unref as M, useSlots as nt, watch as rt, watchEffect as it, withCtx as N } from "vue";
//#region src/components/vue-ui-stackline.vue
var at = /* @__PURE__ */ e({ default: () => Ht }), ot = ["id"], st = ["id"], ct = ["id"], lt = { style: { position: "relative" } }, ut = [
	"aria-describedby",
	"xmlns",
	"viewBox"
], dt = { key: 0 }, ft = [
	"x",
	"y",
	"width",
	"height"
], pt = { key: 1 }, mt = [
	"x1",
	"x2",
	"y1",
	"y2",
	"stroke",
	"stroke-width",
	"stroke-dasharray"
], ht = [
	"x1",
	"x2",
	"y1",
	"y2",
	"stroke",
	"stroke-width",
	"stroke-dasharray"
], gt = [
	"x1",
	"x2",
	"y1",
	"y2",
	"stroke",
	"stroke-width"
], _t = [
	"x1",
	"x2",
	"y1",
	"y2",
	"stroke",
	"stroke-width"
], vt = [
	"x",
	"y",
	"font-size",
	"fill",
	"font-weight"
], yt = [
	"transform",
	"font-size",
	"fill",
	"font-weight"
], bt = [
	"x",
	"y",
	"width",
	"height",
	"stroke",
	"stroke-width",
	"stroke-linecap",
	"stroke-linejoin",
	"stroke-dasharray"
], xt = [
	"d",
	"fill",
	"opacity"
], St = [
	"d",
	"stroke",
	"stroke-width"
], Ct = [
	"x1",
	"x2",
	"y1",
	"y2",
	"stroke"
], wt = [
	"transform",
	"font-size",
	"font-weight",
	"fill",
	"text-anchor"
], Tt = { key: 0 }, Et = { key: 1 }, Dt = [
	"text-anchor",
	"font-size",
	"font-weight",
	"fill",
	"transform",
	"onClick"
], Ot = [
	"text-anchor",
	"font-size",
	"fill",
	"transform",
	"innerHTML",
	"onClick"
], kt = [
	"x",
	"y",
	"height",
	"width",
	"fill"
], At = { key: 0 }, jt = [
	"x1",
	"x2",
	"y1",
	"y2",
	"stroke",
	"stroke-width",
	"stroke-dasharray"
], Mt = { key: 0 }, Nt = [
	"transform",
	"font-size",
	"fill",
	"font-weight"
], Pt = [
	"transform",
	"font-size",
	"font-weight",
	"fill"
], Ft = ["data-start", "data-end"], It = {
	key: 0,
	style: {
		position: "absolute",
		top: "100%",
		left: "0",
		width: "100%"
	},
	"data-dom-to-png-ignore": "",
	"aria-hidden": "true"
}, Lt = {
	key: 5,
	class: "vue-data-ui-watermark"
}, Rt = ["onClick"], zt = ["innerHTML"], Bt = ["innerHTML"], Vt = ["id"], Ht = /*#__PURE__*/ je({
	__name: "vue-ui-stackline",
	props: {
		config: {
			type: Object,
			default() {
				return {};
			}
		},
		dataset: {
			type: Array,
			default() {
				return [];
			}
		},
		selectedXIndex: {
			type: Number,
			default: void 0
		}
	},
	emits: [
		"selectDatapoint",
		"selectLegend",
		"selectTimeLabel",
		"selectX",
		"copyAlt"
	],
	setup(e, { expose: je, emit: at }) {
		let Ht = Ke(() => import("./Tooltip-DhjyfHwz.js")), Ut = Ke(() => import("./BaseIcon-BfndwIWE.js").then((e) => e.n)), Wt = Ke(() => import("./vue-ui-accordion-BxGriZik.js").then((e) => e.n)), Gt = Ke(() => import("./DataTable-BbKgJ5UI.js")), Kt = Ke(() => import("./PenAndPaper-DAE-tnEQ.js").then((e) => e.t)), qt = Ke(() => import("./UserOptions-Dt98of5H.js").then((e) => e.n)), Jt = Ke(() => import("./PackageVersion-D6d8SCp9.js").then((e) => e.t)), Yt = Ke(() => import("./BaseDraggableDialog-LoqqwRtV.js").then((e) => e.n)), { vue_ui_stackline: Xt } = ve(), { isThemeValid: Zt, warnInvalidTheme: Qt } = we(), $t = nt(), P = e, F = at, en = b({
			get() {
				return !!P.dataset && P.dataset.length;
			},
			set(e) {
				return e;
			}
		}), tn = O(null), I = O(oe()), nn = O(!1), L = O([]), rn = O(0), an = O(null), on = O(null), sn = O(null), cn = O(null), ln = O(null), un = O(!1), dn = O(!1), fn = O(0), pn = O(0), mn = O(0), hn = O(!1), gn = O(null), _n = O(null), vn = O(!1), yn = O(!1), bn = O(!1), xn = O(null), Sn = O(null), Cn = O(null), wn = O(null), Tn = O(null), En = et(null), Dn = O(!1), On = O(0), kn = O(0), R = O(null), An = O({
			x: 0,
			y: 0
		}), jn = O("pointer"), Mn = Ee({
			elementRef: En,
			minimumWidth: 2,
			minimumHeight: 2,
			stableFramesRequired: 2,
			once: !1,
			onSizeAccepted: () => {
				Fn();
			}
		});
		function Nn() {
			En.value = tn.value?.parentNode ?? null;
		}
		function Pn() {
			return new Promise((e) => {
				requestAnimationFrame(() => {
					requestAnimationFrame(e);
				});
			});
		}
		async function Fn() {
			let e = ++kn.value;
			Dn.value = !1, await Je(), await Pn(), await Pn(), e === kn.value && (On.value += 1, Dn.value = !0);
		}
		let In = O(null), Ln = O(!1);
		function Rn() {
			Ln.value = !Ln.value;
		}
		Qe(() => {
			Nn(), Mn.start(), hn.value = !0, cr(), Fn();
		});
		let z = O(Yn());
		pe({
			config: () => z.value,
			dataset: () => P.dataset,
			component: "VueUiStackline",
			rules: [
				me.emptyArray,
				{
					test: (e) => e.some((e) => e.series.length > 200),
					message: [
						"👀 Some series have > 200 datapoints, which can impact performance. Consider:",
						"",
						"▶️ Aggregating data to larger time units, to reduce the number of datapoints.",
						"",
						"▶️ Using filters to constraint the data to a specific time range."
					]
				},
				{
					test: (e) => e.length > 6,
					message: [
						"👀 The number of series > 6, which can make the chart hard to read. Consider:",
						"",
						"▶️ Grouping small values into an \"Other\" category.",
						"",
						"▶️ Using filters to let users choose a maximum number of series to display."
					]
				}
			]
		});
		let { transitionEnabled: zn } = Te({
			config: () => z.value.transitions,
			dataset: () => P.dataset
		}), B = b(() => z.value.userOptions.useCursorPointer), Bn = b(() => a({
			defaultConfig: {
				userOptions: { show: !1 },
				useCssAnimation: !1,
				table: { show: !1 },
				tooltip: { show: !1 },
				style: { chart: {
					backgroundColor: "#99999930",
					lines: {
						totalValues: { show: !1 },
						dataLabels: { show: !1 }
					},
					grid: {
						frame: { stroke: "#6A6A6A" },
						scale: {
							scaleMin: 0,
							scaleMax: 144
						},
						x: {
							axisColor: "#6A6A6A",
							linesColor: "#6A6A6A",
							axisName: { show: !1 },
							timeLabels: { show: !1 }
						},
						y: {
							axisColor: "#6A6A6A",
							linesColor: "#6A6A6A",
							axisName: { show: !1 },
							axisLabels: { show: !1 }
						}
					},
					legend: { backgroundColor: "transparent" },
					padding: {
						left: 24,
						right: 24,
						bottom: 12
					},
					zoom: {
						show: !1,
						startIndex: null,
						endIndex: null,
						keepState: !1
					}
				} }
			},
			userConfig: z.value.skeletonConfig ?? {}
		})), { loading: Vn, FINAL_DATASET: Hn, manualLoading: Un } = be({
			...tt(P),
			FINAL_CONFIG: z,
			prepareConfig: Yn,
			callback: () => {
				Promise.resolve().then(async () => {
					(!z.value.style.chart.zoom.keepState || !ei.value || q.value.start === 0 && q.value.end === 0) && await ni();
				});
			},
			skeletonDataset: P.config?.skeletonDataset ?? [{
				name: "",
				series: [
					3,
					2,
					1,
					5,
					13,
					21,
					8,
					89,
					34,
					55
				],
				color: "#8A8A8A"
			}, {
				name: "",
				series: [
					1,
					2,
					3,
					5,
					8,
					13,
					21,
					34,
					55,
					89
				],
				color: "#CACACA"
			}],
			skeletonConfig: a({
				defaultConfig: z.value,
				userConfig: Bn.value
			})
		}), { userOptionsVisible: Wn, setUserOptionsVisibility: Gn, keepUserOptionState: Kn } = Re({ config: z.value }), { svgRef: V } = ze({ config: z.value.style.chart.title });
		function qn() {
			vn.value = !0, Gn(!0);
		}
		function Jn() {
			Gn(!1), vn.value = !1, R.value = null, jn.value = "pointer", nn.value = !1, $.value = null, F("selectX", {
				index: null,
				indexLabel: null,
				dataset: null
			});
		}
		function Yn() {
			let e = Ce({
				userConfig: P.config,
				defaultConfig: Xt
			}), t = {}, n = e.theme;
			if (n) if (!Zt.value(e)) Qt(e), t = e;
			else {
				let r = Ce({
					userConfig: Ve[n] || P.config,
					defaultConfig: e
				});
				t = {
					...Ce({
						userConfig: P.config,
						defaultConfig: r
					}),
					customPalette: e.customPalette.length ? e.customPalette : o[n] || u
				};
			}
			else t = e;
			return t;
		}
		let Xn = b(() => z.value.style.chart.lines.dataLabels.hideUnderValue !== null), Zn = b(() => z.value.style.chart.lines.dataLabels.hideUnderPercentage !== null);
		rt(() => P.config, (e) => {
			Vn.value || (z.value = Yn()), Wn.value = !z.value.userOptions.showOnChartHover, cr({ resetSlicer: !z.value.style.chart.zoom.keepState }), fn.value += 1, pn.value += 1, mn.value += 1, H.value.dataLabels.show = z.value.style.chart.lines.dataLabels.show, H.value.showTable = z.value.table.show, H.value.showTooltip = z.value.style.chart.tooltip.show, U.value.width = z.value.style.chart.width, U.value.height = z.value.style.chart.height, U.value.paddingRatio = {
				top: z.value.style.chart.padding.top / z.value.style.chart.height,
				right: z.value.style.chart.padding.right / z.value.style.chart.width,
				bottom: z.value.style.chart.padding.bottom / z.value.style.chart.height,
				left: z.value.style.chart.padding.left / z.value.style.chart.width
			}, Nn(), Fn(), !z.value.style.chart.zoom.keepState || !ei.value || q.value.start === 0 && q.value.end === 0 ? ni() : wr();
		}, { deep: !0 }), rt(() => P.dataset, (e) => {
			Array.isArray(e) && e.length > 0 && (Un.value = !1), z.value.style.chart.zoom.keepState ? wr() : Dr(), Nn(), Fn();
		}, { deep: !0 });
		let H = O({
			dataLabels: { show: z.value.style.chart.lines.dataLabels.show },
			showTable: z.value.table.show,
			showTooltip: z.value.style.chart.tooltip.show
		});
		rt(z, () => {
			H.value = {
				dataLabels: { show: z.value.style.chart.lines.dataLabels.show },
				showTable: z.value.table.show,
				showTooltip: z.value.style.chart.tooltip.show
			};
		}, { immediate: !0 });
		let { isPrinting: Qn, isImaging: $n, generatePdf: er, generateImage: tr } = ye({
			elementId: `stackline_${I.value}`,
			fileName: z.value.style.chart.title.text || "vue-ui-stackline",
			options: z.value.userOptions.print
		}), nr = b(() => z.value.userOptions.show && !z.value.style.chart.title.text), U = O({
			width: z.value.style.chart.width,
			height: z.value.style.chart.height,
			paddingRatio: {
				top: z.value.style.chart.padding.top / z.value.style.chart.height,
				right: z.value.style.chart.padding.right / z.value.style.chart.width,
				bottom: z.value.style.chart.padding.bottom / z.value.style.chart.height,
				left: z.value.style.chart.padding.left / z.value.style.chart.width
			}
		}), rr = b(() => ue(z.value.customPalette)), ir = et(null), ar = et(null), or = O(null), sr = b(() => !!z.value.debug);
		function cr({ resetSlicer: e = !0 } = {}) {
			if (re(P.dataset) ? (ce({
				componentName: "VueUiStackline",
				type: "dataset",
				debug: sr.value
			}), Un.value = !0) : P.dataset.forEach((e, t) => {
				ae({
					datasetObject: e,
					requiredAttributes: ["name", "series"]
				}).forEach((e) => {
					en.value = !1, ce({
						componentName: "VueUiStackline",
						type: "datasetSerieAttribute",
						property: e,
						index: t,
						debug: sr.value
					}), Un.value = !0;
				});
			}), re(P.dataset) || (Un.value = z.value.loading), setTimeout(() => {
				dn.value = !0;
			}, 10), z.value.responsive) {
				let e = Me(() => {
					dn.value = !1;
					let { width: e, height: t } = Ne({
						chart: tn.value,
						noTitle: cn.value,
						title: z.value.style.chart.title.text ? an.value : null,
						legend: z.value.style.chart.legend.show ? on.value : null,
						slicer: z.value.style.chart.zoom.show && K.value > 6 ? sn.value.$el : null,
						source: ln.value
					});
					requestAnimationFrame(() => {
						U.value.width = e, U.value.height = t - 12, clearTimeout(or.value), or.value = setTimeout(() => {
							dn.value = !0;
						}, 10);
					});
				});
				ir.value && (ar.value && ir.value.unobserve(ar.value), ir.value.disconnect()), ir.value = new ResizeObserver(e), ar.value = tn.value.parentNode, ir.value.observe(ar.value);
			}
			e && ni();
		}
		Ze(() => {
			Mn.stop(), ir.value && (ar.value && ir.value.unobserve(ar.value), ir.value.disconnect());
		});
		let lr = b(() => z.value.style.chart.grid.y.position === "right");
		function ur() {
			let e = 0;
			Cn.value && (e = Array.from(Cn.value.querySelectorAll("text")).reduce((e, t) => {
				let n = t.getComputedTextLength();
				return n > e ? n : e;
			}, 0));
			let t = Sn.value ? Sn.value.getBoundingClientRect().width + z.value.style.chart.grid.y.axisName.fontSize + z.value.style.chart.grid.y.axisName.offsetX : 0;
			return {
				left: lr.value ? 0 : e + t,
				right: lr.value ? e + t : 0,
				scaleLabelsWidth: e,
				yAxisLabelWidth: t
			};
		}
		let dr = O(0), fr = O(0), pr = O(0);
		function mr() {
			let e = wn.value;
			if (!e) {
				fr.value = 0;
				return;
			}
			try {
				let t = e.getBBox();
				fr.value = Number.isFinite(t?.height) ? t.height : 0;
			} catch {
				fr.value = 0;
			}
		}
		function hr() {
			pr.value && cancelAnimationFrame(pr.value), pr.value = requestAnimationFrame(() => {
				requestAnimationFrame(() => {
					mr();
				});
			});
		}
		Ze(() => {
			pr.value && cancelAnimationFrame(pr.value), fr.value = 0, dr.value = 0;
		});
		let gr = b(() => {
			let e = 0;
			if (xn.value) try {
				e = xn.value.getBBox().height;
			} catch {
				e = 0;
			}
			let t = z.value.style.chart.grid.x.timeLabels.show ? fr.value : 0;
			return e + t;
		}), W = b(() => {
			On.value;
			let { height: e, width: t } = U.value, { right: n } = U.value.paddingRatio, r = z.value.style.chart.lines.totalValues.show && P.dataset && P.dataset.length > 1 ? z.value.style.chart.lines.totalValues.fontSize * 1.3 : 0, i = 0, a = 0, o = 0, s = 0;
			if (z.value.style.chart.grid.y.axisLabels.show) {
				let e = ur();
				i = e.left, a = e.right, o = e.scaleLabelsWidth, s = e.yAxisLabelWidth;
			}
			let c = z.value.style.chart.padding.top + r, l = t - t * n - dr.value - a, u = e - z.value.style.chart.padding.bottom - gr.value - r, d = z.value.style.chart.padding.left + i, f = t - d - t * n - dr.value - a, p = e - c - z.value.style.chart.padding.bottom - gr.value - r;
			return {
				chartHeight: Math.max(0, e),
				chartWidth: Math.max(0, t),
				top: c,
				right: Math.max(0, l),
				bottom: Math.max(0, u),
				left: Math.max(0, d),
				width: Math.max(0, f),
				height: Math.max(0, p),
				offsetLeftAxis: i,
				offsetRightAxis: a,
				scaleLabelsWidth: o,
				yAxisLabelWidth: s
			};
		}), _r = b(() => {
			let { left: e, top: t, width: n, height: r } = W.value, i = q.value.start, a = q.value.end, o = Math.max(1, a - i), s = Math.max(0, Math.min(o, (J.value.start ?? i) - i)), c = Math.max(0, Math.min(o, (J.value.end ?? a) - i)), l = Math.max(0, c - s), u = {
				fill: z.value.style.chart.zoom.preview.fill,
				stroke: z.value.style.chart.zoom.preview.stroke,
				"stroke-width": z.value.style.chart.zoom.preview.strokeWidth,
				"stroke-dasharray": z.value.style.chart.zoom.preview.strokeDasharray,
				"stroke-linecap": "round",
				"stroke-linejoin": "round",
				style: {
					pointerEvents: "none",
					transition: "none !important",
					animation: "none !important"
				}
			}, d = n / o;
			return {
				x: e + s * d,
				y: t,
				width: l * d,
				height: r,
				...u
			};
		}), G = b(() => Hn.value.map((e, t) => {
			let n = oe(), r = d(e.color) || rr.value[t] || u[t] || u[t % u.length];
			return {
				...e,
				shape: e.shape || "circle",
				standalone: !!e.standalone,
				series: JSON.parse(JSON.stringify(e.series)).map((e) => z.value.style.chart.lines.distributed ? Math.abs(e) : e),
				seriesSource: e.series,
				signedSeries: e.series.map((e) => e >= 0 ? 1 : -1),
				absoluteIndex: t,
				id: n,
				color: r
			};
		})), vr = b(() => G.value.filter((e) => !L.value.includes(e.id) && !e.standalone)), yr = b(() => G.value.filter((e) => !L.value.includes(e.id) && e.standalone)), K = b(() => {
			let e = Math.max(...G.value.filter((e) => !L.value.includes(e.id)).map((e) => e.series.length));
			return isFinite(e) ? e : Math.max(...G.value.map((e) => e.series.length));
		});
		function br(e) {
			In.value = e;
		}
		let q = O({
			start: 0,
			end: Math.max(...Hn.value.map((e) => e.series.length))
		}), J = O({
			start: 0,
			end: Math.max(...Hn.value.map((e) => e.series.length))
		});
		function xr(e) {
			return (q.value.start ?? 0) + (e ?? 0);
		}
		let Sr = b(() => z.value.style.chart.zoom.preview.enable && (J.value.start !== q.value.start || J.value.end !== q.value.end));
		function Cr(e, t) {
			J.value[e] = t;
		}
		function wr() {
			let e = K.value, t = Math.max(0, Math.min(q.value.start ?? 0, e - 1)), n = Math.max(t + 1, Math.min(q.value.end ?? e, e));
			(!Number.isFinite(t) || !Number.isFinite(n) || n <= t) && (t = 0, n = e), q.value.start = t, q.value.end = n, J.value.start = t, J.value.end = n, sn.value && (sn.value.setStartValue(t), sn.value.setEndValue(n));
		}
		let Tr = O(null);
		function Er() {
			return new Promise((e) => requestAnimationFrame(() => requestAnimationFrame(() => e())));
		}
		Ze(() => {
			Tr.value && cancelAnimationFrame(Tr.value);
		});
		async function Dr({ force: e = !1 } = {}) {
			if (z.value.style.chart.zoom.keepState && !e && ei.value && (q.value.start !== 0 || q.value.end !== 0)) {
				wr();
				return;
			}
			ni(), await Je(), Tr.value && cancelAnimationFrame(Tr.value), Tr.value = requestAnimationFrame(async () => {
				await Er(), ni();
			});
		}
		let Or = b(() => Math.max(0, W.value.width / (q.value.end - q.value.start))), kr = b(() => m(vr.value.map((e) => ({
			...e,
			series: e.series.map((e) => e ?? 0)
		}))).slice(q.value.start, q.value.end)), Ar = b(() => L.value.length === G.value.length), jr = b(() => {
			if (!z.value.style.chart.zoom.minimap.show) return [];
			let e = G.value.filter((e) => Ar.value ? !0 : !L.value.includes(e.id) && !e.standalone);
			if (e.length) return m(e.map((e) => ({
				...e,
				series: (e.series || []).map((e) => e ?? 0)
			})));
			let t = yr.value;
			if (!t.length) return [];
			let n = Math.max(...t.map((e) => e.series.length || 0));
			return Array.from({ length: n }, (e, n) => t.reduce((e, t) => e + Math.abs(t.series[n] ?? 0), 0));
		}), Mr = b(() => {
			if (!z.value.style.chart.zoom.minimap.show) return [];
			let e = G.value.filter((e) => Ar.value ? !0 : !L.value.includes(e.id) && !e.standalone), t = yr.value, n = e.length ? [{
				name: "",
				series: jr.value,
				color: "#000000",
				isVisible: !0
			}] : [], r = t.map((e) => ({
				name: e.name || "",
				series: (e.series || []).map((e) => e ?? 0),
				color: e.color,
				isVisible: !0
			}));
			return n.concat(r);
		}), Nr = b(() => m(vr.value.filter((e) => !L.value.includes(e.id)).map((e) => ({
			...e,
			series: e.series.map((t, n) => {
				let r = t ?? 0;
				return e.signedSeries[n] === -1 && r >= 0 ? -r : r;
			})
		}))).slice(q.value.start, q.value.end)), Pr = b(() => {
			let e = vr.value.filter((e) => !L.value.includes(e.id));
			return {
				positive: m(e.map((e) => ({
					...e,
					series: e.series.slice(q.value.start, q.value.end).map((e) => (e ?? 0) >= 0 ? e ?? 0 : 0)
				}))),
				negative: m(e.map((e) => ({
					...e,
					series: e.series.slice(q.value.start, q.value.end).map((e) => (e ?? 0) < 0 ? e ?? 0 : 0)
				})))
			};
		}), Fr = b(() => {
			let e = Math.max(0, q.value.end - q.value.start), t = Array(e).fill(0), n = Array(e).fill(0);
			return yr.value.forEach((r) => {
				for (let i = 0; i < e; i += 1) {
					let e = r.series[q.value.start + i] ?? 0;
					e > 0 && (t[i] = Math.max(t[i], e)), e < 0 && (n[i] = Math.min(n[i], e));
				}
			}), {
				positive: t,
				negative: n
			};
		}), Ir = b(() => Nr.value.map((e, t) => ({
			value: e,
			sign: e >= 0 ? 1 : -1
		})));
		function Lr() {
			return { y0: zr.value?.[0]?.zero ?? W.value.bottom };
		}
		function Rr(e) {
			let { y0: t } = Lr(), n = z.value.style.chart.lines.totalValues, r = Math.max(2, n.fontSize * 1.3 + n.offsetY), i = (e) => Math.min(Math.max(e, W.value.top - z.value.style.chart.lines.totalValues.fontSize * 1.3), W.value.bottom + z.value.style.chart.lines.totalValues.fontSize * 2);
			if ((Ir.value?.[e]?.value ?? 0) >= 0 || z.value.style.chart.lines.distributed) {
				let n = Infinity;
				for (let t of Y.value || []) {
					let r = t?.series?.[e], i = t?.topY?.[e];
					(r ?? 0) > 0 && Number.isFinite(i) && i < n && (n = i);
				}
				return i((Number.isFinite(n) ? n : t) - r - z.value.style.chart.lines.totalValues.offsetY);
			}
			{
				let a = -Infinity;
				for (let t of Y.value || []) {
					let n = t?.series?.[e], r = t?.topY?.[e];
					(n ?? 0) < 0 && Number.isFinite(r) && r > a && (a = r);
				}
				return i((Number.isFinite(a) ? a : t) + r + n.fontSize * .7 + z.value.style.chart.lines.totalValues.offsetY);
			}
		}
		let zr = b(() => {
			let e = Math.max(...Pr.value.positive, 0), t = Math.min(...Pr.value.negative, 0), n = Math.max(...Fr.value.positive, 0), r = Math.min(...Fr.value.negative, 0), i = Math.max(e, n), a = Math.min(t, r), o = [
				-Infinity,
				Infinity,
				NaN,
				void 0,
				null
			].includes(a) ? 0 : a, s = z.value.style.chart.grid.scale.scaleMin, c = z.value.style.chart.grid.scale.scaleMax, l = !z.value.style.chart.lines.distributed && (s !== null || c !== null), u = s !== null && !z.value.style.chart.lines.distributed ? s : o > 0 ? 0 : o, d = c !== null && !z.value.style.chart.lines.distributed ? c : i < 0 ? 0 : i, f = l ? le(u, d, z.value.style.chart.grid.scale.ticks) : g(u, d, z.value.style.chart.grid.scale.ticks), p = Math.abs(Number(f.min) || 0), m = (Number(f.max) || 0) + p, h = m === 0 || !Number.isFinite(m) ? 1 : m, _ = Array.isArray(f.ticks) && f.ticks.length ? f.ticks : [0], ee = W.value.bottom - W.value.height * (p / h);
			return _.map((e) => {
				let t = Number(e) || 0, n = W.value.bottom - W.value.height * ((t + p) / h);
				return {
					zero: ee,
					y: n,
					x: lr.value ? X.value.right + 8 : X.value.left - 8,
					value: t
				};
			});
		}), Br = O([]), Vr = O([]), Hr = 0;
		it(() => {
			let e = ++Hr;
			(async () => {
				let t = await _e({
					values: z.value.style.chart.grid.x.timeLabels.values,
					maxDatapoints: K.value,
					formatter: z.value.style.chart.grid.x.timeLabels.datetimeFormatter,
					start: q.value.start,
					end: q.value.end
				});
				e === Hr && (Br.value = t);
			})();
		});
		let Ur = 0;
		it(() => {
			let e = ++Ur;
			(async () => {
				let t = await _e({
					values: z.value.style.chart.grid.x.timeLabels.values,
					maxDatapoints: K.value,
					formatter: z.value.style.chart.grid.x.timeLabels.datetimeFormatter,
					start: 0,
					end: K.value
				});
				e === Ur && (Vr.value = t);
			})();
		});
		let Wr = b(() => {
			let e = z.value.style.chart.grid.x.timeLabels.modulo;
			return Br.value.length ? Math.min(e, [...new Set(Br.value.map((e) => e.text))].length) : e;
		}), Gr = b(() => {
			let e = z.value.style.chart.grid.x.timeLabels, t = Br.value || [], n = Vr.value || [], r = q.value.start ?? 0, i = $.value, a = K.value, o = t.map((e) => e?.text ?? ""), s = n.map((e) => e?.text ?? "");
			return ee(!!e.showOnlyFirstAndLast, !!e.showOnlyAtModulo, Math.max(1, Wr.value || 1), o, s, r, i, a);
		});
		it(() => {
			z.value.style.chart.grid.x.timeLabels.show, z.value.style.chart.grid.x.timeLabels.fontSize, z.value.style.chart.grid.x.timeLabels.rotation, z.value.style.chart.grid.x.timeLabels.offsetY, (Gr.value || []).map((e) => e?.text ?? "").join("|"), U.value.width, U.value.height, wn.value, xn.value, hr();
		}, { flush: "post" });
		let Kr = O({
			months: [],
			shortMonths: [],
			days: [],
			shortDays: []
		}), qr = 0;
		it(() => {
			let e = ++qr, t = z.value.style.chart.grid.x.timeLabels.datetimeFormatter;
			(async () => {
				let n = await ge(t.locale).catch(() => ge("en"));
				e === qr && (Kr.value = n.data);
			})();
		});
		let Jr = b(() => {
			let e = z.value.style.chart.grid.x.timeLabels.datetimeFormatter, t = he({
				useUTC: e.useUTC,
				locale: Kr.value,
				januaryAsYear: e.januaryAsYear
			});
			return (e, n) => {
				let r = z.value.style.chart.grid.x.timeLabels.values?.[e];
				return r == null ? "" : t.formatDate(new Date(r), n);
			};
		}), Yr = b(() => (z.value.style.chart.grid.x.timeLabels.values || []).map((e, t) => ({
			text: Jr.value(t, z.value.style.chart.zoom.timeFormat),
			absoluteIndex: t
		}))), Xr = b(() => (z.value.style.chart.grid.x.timeLabels.values || []).map((e, t) => ({
			text: Jr.value(t, z.value.style.chart.tooltip.timeFormat),
			absoluteIndex: t
		}))), Zr = b(() => {
			if (!en.value && !Vn.value) return [];
			let e = W.value.height, t = zr.value[0] ? zr.value[0].zero : W.value.bottom, n = q.value.start ?? 0, r = q.value.end ?? 0, i = Math.max(1, r - n), a = Math.max(...Pr.value.positive, 0), o = Math.min(...Pr.value.negative, 0), s = Math.max(...Fr.value.positive, 0), c = Math.min(...Fr.value.negative, 0), l = Math.max(a, s), u = Math.min(o, c), { min: d, max: f } = !z.value.style.chart.lines.distributed && (z.value.style.chart.grid.scale.scaleMax !== null || z.value.style.chart.grid.scale.scaleMin !== null) ? le(z.value.style.chart.grid.scale.scaleMin === null ? u > 0 ? 0 : u : z.value.style.chart.grid.scale.scaleMin, z.value.style.chart.grid.scale.scaleMax === null ? l < 0 ? 0 : l : z.value.style.chart.grid.scale.scaleMax, z.value.style.chart.grid.scale.ticks) : g(z.value.style.chart.grid.scale.scaleMin === null ? u > 0 ? 0 : u : z.value.style.chart.grid.scale.scaleMin, z.value.style.chart.grid.scale.scaleMax === null ? l < 0 ? 0 : l : z.value.style.chart.grid.scale.scaleMax, z.value.style.chart.grid.scale.ticks), p = f + (d >= 0 ? 0 : Math.abs(d)) || 1, m = Array(i).fill(0), h = Array(i).fill(0), _ = (e) => i <= 1 ? W.value.left + W.value.width / 2 : W.value.left + e / (i - 1) * W.value.width;
			return G.value.filter((e) => !L.value.includes(e.id)).map((r) => {
				let a = [], o = [], s = [], c = Array(i).fill(null), l = Array(i).fill(null);
				for (let u = 0; u < i; u += 1) {
					let i = n + u, d = r.series?.[i], f = r.signedSeries?.[i], g = d == null || Number.isNaN(d) ? 0 : d, _ = r.standalone ? g / p : z.value.style.chart.lines.distributed ? g / (kr.value[u] || 1) : g / p;
					if (g >= 0) {
						let n = e * Math.abs(_);
						if (r.standalone) c[u] = t, l[u] = t - n;
						else {
							let e = m[u], r = e + n;
							c[u] = t - e, l[u] = t - r, m[u] = r;
						}
					} else {
						let n = e * Math.abs(_);
						if (r.standalone) c[u] = t, l[u] = t + n;
						else {
							let e = h[u], r = e + n;
							c[u] = t + e, l[u] = t + r, h[u] = r;
						}
					}
					a.push(u), o.push(g), s.push(f ?? (g >= 0 ? 1 : -1));
				}
				let u = a.map((e) => ({
					x: _(e),
					y: l[e]
				})), d = u.map((e) => e.x), f = o.reduce((e, t) => e + Math.abs(t || 0), 0), g = f === 0 ? 1 : f, ee = o.map((e, t) => {
					if (z.value.style.chart.lines.distributed && !r.standalone) {
						let n = a[t], r = kr.value[n] || 1;
						return (e || 0) / r;
					}
					return (e || 0) / g;
				});
				return {
					...r,
					x: d,
					points: u,
					baseY: a.map((e) => c[e]),
					topY: a.map((e) => l[e]),
					series: o,
					signedSeries: s,
					proportions: ee,
					rel: a,
					fullSeries: Array.isArray(r.fullSeries) ? r.fullSeries : r.series
				};
			});
		}), Y = b(() => {
			let e = (e) => typeof e == "string" ? e.replace(/^M\s*[-+]?[\d.]+(?:e[-+]?\d+)?\s*,?\s*[-+]?[\d.]+(?:e[-+]?\d+)?\s*/i, "").trim() : "", t = Math.max(...Pr.value.positive, 0), n = Math.min(...Pr.value.negative, 0), r = Math.max(...Fr.value.positive, 0), i = Math.min(...Fr.value.negative, 0), a = Math.max(t, r), o = Math.min(n, i), s = !z.value.style.chart.lines.distributed && (z.value.style.chart.grid.scale.scaleMax !== null || z.value.style.chart.grid.scale.scaleMin !== null) ? le(z.value.style.chart.grid.scale.scaleMin === null ? o > 0 ? 0 : o : z.value.style.chart.grid.scale.scaleMin, z.value.style.chart.grid.scale.scaleMax === null ? a < 0 ? 0 : a : z.value.style.chart.grid.scale.scaleMax, z.value.style.chart.grid.scale.ticks) : g(z.value.style.chart.grid.scale.scaleMin === null ? o > 0 ? 0 : o : z.value.style.chart.grid.scale.scaleMin, z.value.style.chart.grid.scale.scaleMax === null ? a < 0 ? 0 : a : z.value.style.chart.grid.scale.scaleMax, z.value.style.chart.grid.scale.ticks), c = Number(s.min) || 0, u = Number(s.max) || 0, d = Math.abs(c), f = u + d || 1, m = (e) => {
				if (z.value.style.chart.lines.distributed) {
					let t = Math.max(0, Math.min(1, e));
					return minimapH - minimapH * t;
				}
				return clampY(minimapH - minimapH * (((e ?? 0) + d) / f));
			};
			return Zr.value.map((t) => {
				let n = t.x.length, r = Array.isArray(t.fullSeries) ? t.fullSeries : t.series, i = ({ left: e = 0, unitW: t }) => {
					let n = r.length;
					return !Number.isFinite(t) || t <= 0 || n <= 0 ? [] : n === 1 ? [e + t * .5] : r.map((n, r) => e + r * t);
				}, a = ({ minimapH: e }) => !Number.isFinite(e) || e <= 0 ? [] : r.map((t) => m(t || 0, e)), o = ({ minimapH: e }) => {
					if (!Number.isFinite(e) || e <= 0) return [];
					let t = m(0, e);
					return r.map(() => t);
				};
				if (n === 0) return {
					...t,
					points: [],
					smoothPath: "",
					straightPath: "",
					smoothArea: "",
					straightArea: "",
					xMinimap: i,
					yMinimap: a,
					yMinimapBase: o
				};
				let s = t.x.map((e, n) => ({
					x: e,
					y: t.topY[n]
				})), c = t.x.map((e, n) => ({
					x: e,
					y: t.baseY[n]
				})), u = n >= 2 ? l(s) : `M${s[0].x},${s[0].y}`, d = n >= 2 ? p(s) : `M${s[0].x},${s[0].y}`, f = n >= 2 ? `M${e(u)}` : u, h = n >= 2 ? `M${e(d)}` : d, g = "", _ = "";
				if (z.value.style.chart.lines.useArea && n >= 2) {
					let t = l([...c].reverse()), n = p([...c].reverse()), r = c[c.length - 1];
					g = `M${s[0].x},${s[0].y} ${e(u)} L${r.x},${r.y} ${e(t)} Z`, _ = `M${s[0].x},${s[0].y} ${e(d)} L${r.x},${r.y} ${e(n)} Z`;
				}
				return {
					...t,
					points: s,
					smoothPath: f,
					straightPath: h,
					smoothArea: g,
					straightArea: _,
					xMinimap: i,
					yMinimap: a,
					yMinimapBase: o
				};
			});
		}), Qr = b(() => $.value === null || $.value === void 0 ? null : {
			timeLabel: yi($.value),
			absoluteIndex: $.value + q.value.start,
			seriesIndex: $.value,
			datapoint: vi.value,
			series: Y.value,
			config: z.value
		}), $r = O(!1), ei = O(!1);
		function ti(e) {
			let t = K.value;
			return e > t ? t : e < 0 || e < q.value.start ? z.value.style.chart.zoom.startIndex === null ? 1 : q.value.start + 1 : e;
		}
		function ni() {
			if (!$r.value) {
				$r.value = !0;
				try {
					let { startIndex: e, endIndex: t, keepState: n } = z.value.style.chart.zoom, r = n ? Math.max(0, K.value) : K.value;
					if (n && r <= 0) return;
					let i = e ?? 0, a = t == null ? r : Math.min(ti(t + 1), r);
					oi.value = !0, q.value.start = i, q.value.end = a, J.value.start = i, J.value.end = a, wr(), ei.value = !0;
				} finally {
					queueMicrotask(() => {
						oi.value = !1;
					}), $r.value = !1;
				}
			}
		}
		function ri(e) {
			$r.value || oi.value || e !== q.value.start && (q.value.start = e, J.value.start = e, wr());
		}
		function ii(e) {
			if ($r.value || oi.value) return;
			let t = ti(e);
			t !== q.value.end && (q.value.end = t, J.value.end = t, wr());
		}
		let X = b(() => ({
			left: W.value.left,
			right: W.value.right,
			width: W.value.width
		})), ai = b(() => {
			let e = z.value.style.chart.grid.y.axisLabels, { prefix: t, suffix: n } = z.value.style.chart.lines.dataLabels;
			return zr.value.map((r) => String(v(e.formatter, r.value, h({
				p: t,
				v: r.value,
				s: n,
				r: e.rounding
			}), { datapoint: r }) ?? "")).join("|");
		});
		rt([
			ai,
			() => z.value.style.chart.grid.y.axisLabels.show,
			() => z.value.style.chart.grid.y.axisLabels.fontSize,
			() => z.value.style.chart.grid.y.axisLabels.bold,
			() => z.value.style.chart.grid.y.position
		], () => {
			z.value.style.chart.grid.y.axisLabels.show && Fn();
		}, { flush: "post" });
		let oi = O(!1), si = b(() => U.value.width), ci = b(() => U.value.height);
		De({
			timeLabelsEls: wn,
			timeLabels: Br,
			slicer: q,
			configRef: z,
			rotationPath: [
				"style",
				"chart",
				"grid",
				"x",
				"timeLabels",
				"rotation"
			],
			autoRotatePath: [
				"style",
				"chart",
				"grid",
				"x",
				"timeLabels",
				"autoRotate",
				"enable"
			],
			isAutoSize: !1,
			width: si,
			height: ci,
			rotation: z.value.style.chart.grid.x.timeLabels.autoRotate.angle
		});
		let li = O(null);
		function ui(e) {
			let t = V.value;
			if (!t) return null;
			if (t.createSVGPoint && t.getScreenCTM) {
				let n = t.createSVGPoint();
				n.x = e.clientX, n.y = e.clientY;
				let r = t.getScreenCTM();
				if (r) {
					let e = n.matrixTransform(r.inverse());
					return {
						x: e.x,
						y: e.y,
						ok: !0
					};
				}
			}
			let n = t.getBoundingClientRect(), r = t.viewBox?.baseVal || {
				x: 0,
				y: 0,
				width: n.width,
				height: n.height
			}, i = Math.min(n.width / r.width, n.height / r.height), a = r.width * i, o = r.height * i, s = (n.width - a) / 2, c = (n.height - o) / 2;
			return {
				x: (e.clientX - n.left - s) / i + r.x,
				y: (e.clientY - n.top - c) / i + r.y,
				ok: !0
			};
		}
		let di = 0, Z = b(() => Math.max(1, q.value.end - q.value.start)), fi = b(() => Z.value > 1 ? W.value.width / (Z.value - 1) : 0);
		function Q(e) {
			return Z.value <= 1 ? W.value.left + W.value.width / 2 : W.value.left + e * fi.value;
		}
		function pi(e) {
			if (Z.value <= 1) return {
				x: W.value.left,
				width: W.value.width
			};
			let t = e === 0 ? W.value.left : (Q(e - 1) + Q(e)) / 2, n = e === Z.value - 1 ? W.value.left + W.value.width : (Q(e) + Q(e + 1)) / 2;
			return {
				x: t,
				width: Math.max(0, n - t)
			};
		}
		function mi(e) {
			Ln.value || (di && cancelAnimationFrame(di), di = requestAnimationFrame(() => {
				di = 0;
				let t = ui(e);
				if (!t || !V.value) {
					_i();
					return;
				}
				let { left: n, right: r, top: i, bottom: a } = W.value;
				if (t.x < n || t.x > r || t.y < i || t.y > a) {
					_i();
					return;
				}
				let o = 0;
				if (Z.value > 1) {
					let e = (t.x - n) / fi.value;
					o = Math.round(e);
				} else o = 0;
				o < 0 && (o = 0), o > Z.value - 1 && (o = Z.value - 1), li.value !== o && (li.value = o, xi(!0, o));
			}));
		}
		function hi(e) {
			let t = ui(e);
			if (!t || !V.value) return;
			let { left: n, right: r, top: i, bottom: a } = W.value;
			if (t.x < n || t.x > r || t.y < i || t.y > a) return;
			let o = 0;
			if (Z.value > 1) {
				let e = (t.x - n) / fi.value;
				o = Math.round(e);
			} else o = 0;
			o < 0 && (o = 0), o > Z.value - 1 && (o = Z.value - 1), ta({
				seriesIndex: o,
				datapoint: qi(o)
			}), gi(o);
		}
		function gi(e) {
			let t = JSON.parse(JSON.stringify(Y.value)).map((t) => ({
				name: t.name,
				value: t.series[e] === 0 ? 0 : t.series[e] || null,
				proportion: t.proportions[e] || null,
				color: t.color,
				id: t.id
			}));
			z.value.events.datapointClick && z.value.events.datapointClick({
				datapoint: t,
				seriesIndex: e + q.value.start
			}), F("selectDatapoint", {
				datapoint: t,
				period: Br.value[e]
			});
		}
		rt(() => [
			q.value.start,
			q.value.end,
			Y.value.length
		], () => {
			let e = Z.value;
			if ($.value != null) {
				if (e <= 0) {
					$.value = null;
					return;
				}
				$.value < 0 && ($.value = 0), $.value > e - 1 && ($.value = e - 1);
			}
		});
		function _i() {
			di &&= (cancelAnimationFrame(di), 0), li.value = null, xi(!1, null);
		}
		let $ = O(null), vi = b(() => {
			let e = $.value, t = e == null ? null : xr(e);
			return Y.value.map((n) => ({
				slotAbsoluteIndex: n.absoluteIndex,
				shape: n.shape || "circle",
				name: n.name,
				color: n.color,
				value: e == null ? null : n.series.find((t, n) => n === e),
				sourceValue: t == null ? null : n.seriesSource?.[t],
				comments: n.comments || [],
				id: n.id,
				standalone: !!n.standalone
			}));
		});
		function yi(e) {
			if (e == null || !z.value.style.chart.tooltip.showTimeLabel) return null;
			let t = Br.value?.[e]?.text || null, n = Xr.value?.[e]?.text || null, r = Vr.value?.[e]?.text || null;
			return z.value.style.chart.tooltip.useDefaultTimeFormat ? t : n || r;
		}
		let bi = b(() => {
			let e = z.value.style.chart.tooltip.customFormat, t = [...vi.value].reverse(), n = t.filter((e) => !e.standalone), r = t.filter((e) => e.standalone), i = n.map((e) => e.value).filter((e) => f(e) && e !== null).reduce((e, t) => Math.abs(e) + Math.abs(t), 0);
			if (de(e) && te(() => e({
				absoluteIndex: $.value + q.value.start,
				seriesIndex: $.value,
				datapoint: vi.value,
				series: G.value,
				config: z.value
			}))) return e({
				absoluteIndex: $.value + q.value.start,
				seriesIndex: $.value,
				datapoint: vi.value,
				series: G.value,
				config: z.value
			});
			let { showValue: a, showTotal: o, totalTranslation: c, showPercentage: l, borderColor: u, roundingValue: d, roundingPercentage: p } = z.value.style.chart.tooltip, m = (e) => !e.shape || ![
				"star",
				"triangle",
				"square",
				"diamond",
				"pentagon",
				"hexagon"
			].includes(e.shape) ? `<svg viewBox="0 0 12 12" height="14" width="14"><circle cx="6" cy="6" r="6" stroke="${z.value.style.chart.tooltip.backgroundColor}" stroke-width="1" fill="${e.color}" /></svg>` : e.shape === "star" ? `<svg viewBox="0 0 12 12" height="14" width="14" style="overflow:visible"><polygon stroke="${z.value.style.chart.tooltip.backgroundColor}" stroke-width="1" fill="${e.color}" points="${fe({
				plot: {
					x: 6,
					y: 6
				},
				radius: 5
			})}" /></svg>` : e.shape === "triangle" ? `<svg viewBox="0 0 12 12" height="14" width="14" style="overflow:visible"><path d="${s({
				plot: {
					x: 6,
					y: 6
				},
				radius: 6,
				sides: 3,
				rotation: .52
			}).path}" fill="${e.color}" stroke="${z.value.style.chart.tooltip.backgroundColor}" stroke-width="1" /></svg>` : e.shape === "square" ? `<svg viewBox="0 0 12 12" height="14" width="14"><path d="${s({
				plot: {
					x: 6,
					y: 6
				},
				radius: 6,
				sides: 4,
				rotation: .8
			}).path}" fill="${e.color}" stroke="${z.value.style.chart.tooltip.backgroundColor}" stroke-width="1" /></svg>` : e.shape === "diamond" ? `<svg viewBox="0 0 12 12" height="14" width="14" style="overflow:visible"><path d="${s({
				plot: {
					x: 6,
					y: 6
				},
				radius: 5,
				sides: 4,
				rotation: 0
			}).path}" fill="${e.color}" stroke="${z.value.style.chart.tooltip.backgroundColor}" stroke-width="1" /></svg>` : e.shape === "pentagon" ? `<svg viewBox="0 0 12 12" height="14" width="14" style="overflow:visible"><path d="${s({
				plot: {
					x: 6,
					y: 6
				},
				radius: 5,
				sides: 5,
				rotation: .95
			}).path}" fill="${e.color}" stroke="${z.value.style.chart.tooltip.backgroundColor}" stroke-width="1" /></svg>` : `<svg viewBox="0 0 12 12" height="14" width="14" style="overflow:visible"><path d="${s({
				plot: {
					x: 6,
					y: 6
				},
				radius: 5,
				sides: 6,
				rotation: 0
			}).path}" fill="${e.color}" stroke="${z.value.style.chart.tooltip.backgroundColor}" stroke-width="1" /></svg>`, g = (e, t) => {
				let n = t ? h({
					v: isNaN((e.value ?? 0) / (i || 1)) ? 0 : Math.abs(e.value ?? 0) / (i || 1) * 100,
					s: "%",
					r: p
				}) : "", r = a && t ? "(" : "", o = a && t ? ")" : "";
				return `
        <div style="display:flex;flex-direction:row;align-items:center;gap:4px">
            <div style="width:20px;height:20px;display:flex;align-items:center;justify-content:center;">${m(e)}</div>
            ${e.name}${a || t ? ":" : ""} 
            ${a ? v(z.value.style.chart.lines.dataLabels.formatter, e.sourceValue, h({
					p: z.value.style.chart.lines.dataLabels.prefix,
					v: e.sourceValue,
					s: z.value.style.chart.lines.dataLabels.suffix,
					r: d
				}, { datapoint: e })) : ""} ${r}${n}${o}
        </div>
        `;
			}, _ = "", ee = yi($.value);
			return ee && (_ += `<div style="width:100%;text-align:center;border-bottom:1px solid ${u};padding-bottom:6px;margin-bottom:3px;">${ee}</div>`), o && n.length > 1 && (_ += `<div class="vue-data-ui-tooltip-total" style="display:flex;flex-direction:row;align-items:center;gap:4px">
        <span>${c}:</span>
        <span>${v(z.value.style.chart.lines.dataLabels.formatter, ie(i), h({
				p: z.value.style.chart.lines.dataLabels.prefix,
				v: ie(i),
				s: z.value.style.chart.lines.dataLabels.suffix,
				r: d
			}), { datapoint: {
				name: c,
				value: ie(i)
			} })}</span>
        </div>`), n.forEach((e) => {
				_ += g(e, l);
			}), r.length && (_ += `<div style="border-top:1px solid ${vr.value.length ? u : "transparent"}; margin:${vr.value.length ? "6px 0" : "0"};"></div>`, r.forEach((e) => {
				_ += g(e, !1);
			})), `<div>${_}</div>`;
		});
		function xi(e, t = null, n = "pointer") {
			if (Ar.value) return;
			jn.value = n, nn.value = e;
			let r = Y.value.map((e) => ({
				name: e.name,
				value: [
					null,
					void 0,
					NaN
				].includes(e.series[t]) ? null : e.series[t],
				color: e.color
			}));
			e ? (R.value = t, $.value = t, ta({
				seriesIndex: t,
				datapoint: r
			}), z.value.events.datapointEnter && z.value.events.datapointEnter({
				datapoint: r,
				seriesIndex: t + q.value.start
			})) : (R.value = null, $.value = null, F("selectX", {
				index: null,
				indexLabel: null,
				dataset: null
			}), z.value.events.datapointLeave && z.value.events.datapointLeave({
				datapoint: r,
				seriesIndex: t + q.value.start
			}));
		}
		function Si(e, t) {
			let n = JSON.parse(JSON.stringify(Y.value)).map((e) => ({
				name: e.name,
				value: e.series[t] === 0 ? 0 : (e.signedSeries[t] === -1 && e.series[t] >= 0 ? -e.series[t] : e.series[t]) || null,
				proportion: e.proportions[t] || null,
				color: e.color,
				id: e.id
			}));
			F("selectTimeLabel", {
				datapoint: n,
				absoluteIndex: e.absoluteIndex,
				label: e.text
			});
		}
		function Ci() {
			L.value.length ? L.value = [] : Ti.value.forEach((e) => {
				L.value.push(e.id);
			}), F("selectLegend", Y.value);
		}
		function wi(e) {
			if (L.value.includes(e.id)) L.value = L.value.filter((t) => t !== e.id);
			else {
				if (L.value.length === G.value.length - 1) return;
				L.value.push(e.id);
			}
			F("selectLegend", Y.value);
		}
		let Ti = b(() => G.value.map((e) => ({
			...e,
			opacity: L.value.includes(e.id) ? .5 : 1,
			segregate: () => wi(e),
			isSegregated: L.value.includes(e.id)
		}))), Ei = b(() => ({
			cy: "stackline-legend",
			backgroundColor: z.value.style.chart.legend.backgroundColor,
			color: z.value.style.chart.legend.color,
			fontSize: z.value.style.chart.legend.fontSize,
			paddingBottom: 12,
			fontWeight: z.value.style.chart.legend.bold ? "bold" : ""
		}));
		function Di(e) {
			return G.value.length ? G.value.find((t) => t.name === e) || (z.value.debug && console.warn(`VueUiStackline - Series name not found "${e}"`), null) : (z.value.debug && console.warn("VueUiStackline - There are no series to show."), null);
		}
		function Oi(e) {
			let t = Di(e);
			t !== null && L.value.includes(t.id) && wi({ id: t.id });
		}
		function ki(e) {
			let t = Di(e);
			t !== null && (L.value.includes(t.id) || wi({ id: t.id }));
		}
		let Ai = b(() => {
			if (Y.value.length === 0) return {
				head: [],
				body: [],
				config: {},
				columnNames: []
			};
			let e = Y.value.map(({ name: e, color: t }) => ({
				label: e,
				color: t
			})), t = [];
			return Gr.value.forEach((e) => {
				let n = e.absoluteIndex, r = [z.value.style.chart.grid.x.timeLabels.values?.[n] ? e.text : n + 1];
				G.value.forEach((e) => {
					let t = e.series?.[n], i = Number((t ?? 0).toFixed(z.value.table.td.roundingValue));
					r.push(i);
				}), t.push(r);
			}), {
				head: e,
				body: t
			};
		});
		function ji(e = null) {
			let n = [
				[z.value.style.chart.title.text],
				[z.value.style.chart.title.subtitle.text],
				[""]
			], i = ["", ...Ai.value.head.map((e) => e.label)], a = Ai.value.body, o = n.concat([i]).concat(a), s = r(o);
			e ? e(s) : t({
				csvContent: s,
				title: z.value.style.chart.title.text || "vue-ui-stackline"
			});
		}
		let Mi = b(() => {
			let e = [""].concat(Y.value.map((e) => e.name), " <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\" fill=\"none\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M18 16v2a1 1 0 0 1 -1 1h-11l6 -7l-6 -7h11a1 1 0 0 1 1 1v2\" /></svg>"), t = [], n = Math.max(0, q.value.end - q.value.start);
			for (let e = 0; e < n; e += 1) {
				let n = xr(e), r = z.value.style.chart.grid.x.timeLabels.values?.[n] ? Br.value?.[e]?.text ?? n + 1 : n + 1, i = Y.value.map((t) => {
					let n = t.series?.[e] ?? 0;
					return Number(n.toFixed(z.value.table.td.roundingValue));
				}), a = Y.value.filter((e) => !e.standalone).map((t) => t.series?.[e] ?? 0).reduce((e, t) => e + t, 0);
				t.push([r].concat(i, Number(a.toFixed(z.value.table.td.roundingValue))));
			}
			return {
				head: e,
				body: t,
				config: {
					th: {
						backgroundColor: z.value.table.th.backgroundColor,
						color: z.value.table.th.color,
						outline: z.value.table.th.outline
					},
					td: {
						backgroundColor: z.value.table.td.backgroundColor,
						color: z.value.table.td.color,
						outline: z.value.table.td.outline
					},
					breakpoint: z.value.table.responsiveBreakpoint
				},
				colNames: [z.value.table.columnNames.period].concat(Y.value.map((e) => e.name), z.value.table.columnNames.total)
			};
		}), Ni = b(() => z.value.style.chart.backgroundColor), Pi = b(() => z.value.style.chart.legend), Fi = b(() => z.value.style.chart.title), { exportSvg: Ii, getSvg: Li } = Se({
			svg: V,
			title: Fi,
			legend: Pi,
			legendItems: Ti,
			backgroundColor: Ni
		});
		async function Ri({ isCb: e }) {
			bn.value = !0, await Je();
			try {
				if (e) {
					let { blob: e, url: t, text: n, dataUrl: r } = await Li();
					await Promise.resolve(z.value.userOptions.callbacks.svg({
						blob: e,
						url: t,
						text: n,
						dataUrl: r
					}));
				} else await Promise.resolve(Ii());
			} finally {
				bn.value = !1;
			}
		}
		async function zi({ scale: e = 2 } = {}) {
			if (!tn.value) return;
			let { imageUri: t, base64: n } = await Oe({
				domElement: tn.value,
				base64: !0,
				img: !0,
				scale: e
			}), r = tn.value.getBoundingClientRect(), i = {
				width: r.width,
				height: r.height,
				aspectRatio: r.height ? r.width / r.height : 0
			}, a = await ne(t, e) ?? i;
			return {
				imageUri: t,
				base64: n,
				title: z.value.style.chart.title.text,
				...a
			};
		}
		let Bi = b(() => {
			let e = z.value.table.useDialog && !z.value.table.show, t = H.value.showTable;
			return {
				component: e ? Yt : Wt,
				title: `${z.value.style.chart.title.text}${z.value.style.chart.title.subtitle.text ? `: ${z.value.style.chart.title.subtitle.text}` : ""}`,
				props: e ? {
					backgroundColor: z.value.table.th.backgroundColor,
					color: z.value.table.th.color,
					headerColor: z.value.table.th.color,
					headerBg: z.value.table.th.backgroundColor,
					isFullscreen: un.value,
					fullscreenParent: tn.value,
					forcedWidth: Math.min(800, window.innerWidth * .8),
					isCursorPointer: B.value
				} : {
					hideDetails: !0,
					config: {
						open: t,
						maxHeight: 1e4,
						body: {
							backgroundColor: z.value.style.chart.backgroundColor,
							color: z.value.style.chart.color
						},
						head: {
							backgroundColor: z.value.style.chart.backgroundColor,
							color: z.value.style.chart.color
						}
					}
				}
			};
		});
		rt(() => H.value.showTable, (e) => {
			z.value.table.show || (e && z.value.table.useDialog && gn.value ? gn.value.open() : "close" in gn.value && gn.value.close());
		});
		function Vi() {
			H.value.showTable = !1, _n.value && _n.value.setTableIconState(!1);
		}
		function Hi(e) {
			un.value = e, rn.value += 1;
		}
		function Ui() {
			H.va