vue-data-ui
Version:
A user-empowering data visualization Vue 3 components library for eloquent data storytelling
1,146 lines • 184 kB
JavaScript
import { useCssVars as io, computed as k, ref as p, onMounted as rl, onBeforeUnmount as cl, watch as at, nextTick as Kt, onUpdated as so, createElementBlock as i, openBlock as u, createElementVNode as b, createCommentVNode as f, renderSlot as J, normalizeStyle as L, createVNode as qt, withDirectives as Yl, unref as v, Fragment as x, renderList as C, normalizeClass as Ne, withKeys as Ma, vModelText as Ca, toDisplayString as te, defineAsyncComponent as kt, useSlots as ro, getCurrentInstance as co, toRefs as vo, watchEffect as ho, createBlock as Be, createSlots as fo, withCtx as ge, normalizeProps as it, guardReactiveProps as wt, mergeProps as $l, Teleport as go, vModelCheckbox as mo, createTextVNode as xo } from "vue";
import { c as Cl, V as zl, U as Al, X as bo, F as qe, u as po, f as Fl, t as yo, a4 as Ue, d as ko, D as sl, ac as Nt, e as wo, p as So, ad as _l, a9 as D, ae as $o, h as E, af as za, ag as Aa, ah as _o, ai as Ia, aj as Ta, k as be, y as Lo, z as Mo, _ as Na, R as lt, i as Fe, x as Rt, s as Ze, a7 as Q, L as Co, ak as Ll, I as zo, al as St, C as We, a as Ao, b as Io, o as Ra, v as To, w as No, E as Zt } from "./index-q-LPw2IT.js";
import { t as Dl, u as Ro } from "./useResponsive-DfdjqQps.js";
import { u as Po } from "./usePrinter-DX7efa1s.js";
import { u as Oo, B as Ho } from "./useLoading-D7YHNtLX.js";
import { u as Wl } from "./useNestedProp-04aFeUYu.js";
import { u as Pa } from "./useTimeLabels-DkzmKfZn.js";
import { u as Vo } from "./useTimeLabelCollider-CIsgDrl9.js";
import Eo from "./img-Ctts6JQb.js";
import Bo from "./Title-B55R8CAZ.js";
import { S as Fo } from "./Slicer-BarTZZDU.js";
import { _ as Ml } from "./Shape-DHIaJs9G.js";
import Wo from "./BaseIcon-CCivwZUq.js";
import { _ as Oa } from "./_plugin-vue_export-helper-CHgC5LLL.js";
const Yo = {
class: "vue-data-ui-slicer-labels",
style: { position: "relative", "z-index": "1", "pointer-events": "none" }
}, Do = {
key: 0,
style: { width: "100%", position: "relative" }
}, Xo = {
key: 0,
class: "minimap",
style: { width: "100%" }
}, Go = ["xmlns", "viewBox"], Uo = ["id"], Zo = ["stop-color"], qo = ["d", "stroke"], Ko = ["x", "width", "height", "fill", "rx"], Jo = ["d", "fill"], Qo = ["x", "width", "height", "rx", "fill"], jo = ["x", "width", "height", "fill", "rx"], eu = ["d", "fill"], tu = ["d", "stroke"], lu = ["cx", "cy", "stroke", "fill"], au = ["cx", "cy", "stroke", "fill"], ou = ["x1", "x2", "y2", "stroke"], uu = ["x", "height", "width", "onMouseenter"], nu = ["min", "max"], iu = ["min", "max"], su = {
__name: "SlicerPreview",
props: {
background: {
type: String,
default: "#FFFFFF"
},
borderColor: {
type: String,
default: "#FFFFFF"
},
fontSize: {
type: Number,
default: 14
},
labelLeft: {
type: [String, Number],
default: ""
},
labelRight: {
type: [String, Number],
default: ""
},
textColor: {
type: String,
default: "#1A1A1A"
},
inputColor: {
type: String,
default: "#1A1A1A"
},
max: {
type: Number,
default: 0
},
min: {
type: Number,
default: 0
},
selectColor: {
type: String,
default: "#4A4A4A"
},
useResetSlot: {
type: Boolean,
default: !1
},
valueStart: {
type: [Number, String],
default: 0
},
valueEnd: {
type: [Number, String],
default: 0
},
minimap: {
type: Array,
default: []
},
smoothMinimap: {
type: Boolean,
default: !1
},
minimapSelectedColor: {
type: String,
default: "#1f77b4"
},
minimapSelectionRadius: {
type: Number,
default: 12
},
minimapLineColor: {
type: String,
default: "#2D353C"
},
minimapSelectedColorOpacity: {
type: Number,
default: 0.2
},
minimapSelectedIndex: {
type: Number,
default: null
},
minimapIndicatorColor: {
type: String,
default: "#2D353C"
},
refreshStartPoint: {
type: Number,
default: 0
},
refreshEndPoint: {
type: Number,
default: null
},
enableRangeHandles: {
type: Boolean,
default: !1
},
enableSelectionDrag: {
type: Boolean,
default: !0
},
verticalHandles: {
type: Boolean,
default: !1
},
timeLabels: {
type: Array
},
isPreview: {
type: Boolean,
default: !1
}
},
emits: ["futureStart", "futureEnd", "update:start", "update:end", "reset", "trapMouse"],
setup(I, { expose: Il, emit: Tl }) {
io((g) => ({
"08ee7c46": ct.value,
d9036b5e: Ke.value,
"4e6bd1fc": Lt.value,
"73b38b81": I.selectColor,
"07444d8f": _t.value
}));
const d = I, Re = p(null), ve = p(d.min), he = p(d.max), $t = k(() => !!d.minimap.length), Jt = p(Cl()), Pt = p(0), st = k({
get() {
return ve.value;
},
set(g) {
const h = Math.min(g, he.value - 1);
ve.value = h, dt.value && (dt.value.value = String(h)), Ye("futureStart", h);
}
}), rt = k({
get() {
return he.value;
},
set(g) {
const h = Math.max(g, ve.value + 1);
he.value = h, Qt.value && (Qt.value.value = String(h)), Ye("futureEnd", h);
}
});
rl(() => {
const g = () => {
Re.value && (Pt.value = Re.value.getBoundingClientRect().width);
};
g();
const h = Dl(g, 50);
window.addEventListener("resize", h), cl(() => {
window.removeEventListener("resize", h);
});
});
let Ot = null;
function Pe() {
clearTimeout(Ot), Ye("update:start", Number(ve.value)), Ye("update:end", Number(he.value));
}
const Nl = k(() => d.refreshEndPoint === null ? d.max : d.refreshEndPoint), Ye = Tl, oe = k(() => {
const g = d.max - d.min, h = (ve.value - d.min) / g * 100, w = (he.value - d.min) / g * 100, m = (h + w) / 2, ne = Ce.value ? `calc(${m}% - ${t.value.width}px)` : ot.value ? `calc(${m}%)` : `calc(${m}% - ${t.value.width / 2}px)`;
return {
left: `${h}%`,
width: `${w - h}%`,
background: d.selectColor,
tooltipLeft: `calc(${h}% - ${ot.value ? 0 : Ct.value / 2}px)`,
tooltipRight: `calc(${w}% - ${Ce.value ? zt.value : zt.value / 2}px)`,
tooltipCenter: ne,
arrowLeft: !ot.value,
arrowRight: !Ce.value
};
}), ot = k(() => Re.value ? Re.value.getBoundingClientRect().width * ((ve.value - d.min) / (d.max - d.min)) - Ct.value / 2 < 0 : !1), Ce = k(() => Re.value ? Re.value.getBoundingClientRect().width * ((he.value - d.min) / (d.max - d.min)) + zt.value / 2 > Re.value.getBoundingClientRect().width : !1), ct = k(() => d.inputColor), _t = k(() => d.background), Lt = k(() => `${d.selectColor}33`), Ke = k(() => d.borderColor), Ht = k(() => {
let g = [];
for (let h = 0; h < d.minimap.length; h += 1)
g.push(h);
return g;
});
function Vt() {
Ye("reset");
}
p({
start: ve.value,
end: he.value
}), at(
() => d.min,
(g) => {
Number(ve.value) < Number(g) && (ve.value = Number(g)), Number(he.value) < Number(g) && (he.value = Number(g));
}
), at(
() => d.max,
(g) => {
Number(ve.value) > Number(g) && (ve.value = Number(g)), Number(he.value) > Number(g) && (he.value = Number(g));
}
);
const Je = p(null), q = p({
width: 1,
height: 1
}), $e = p(null);
rl(() => {
if ($t.value) {
const g = Dl(() => {
const { width: h, height: w } = Ro({
chart: Je.value
});
q.value.width = h, q.value.height = w - 47;
});
$e.value = new ResizeObserver(g), $e.value.observe(Je.value);
}
}), cl(() => {
$e.value && $e.value.disconnect();
});
const fe = k(() => d.minimap.length ? q.value.width / d.minimap.length : 0), pe = k(() => {
if (!d.minimap.length) return [];
const g = Math.max(...d.minimap), h = Math.min(...d.minimap) - 10, w = g - (h > 0 ? 0 : h), m = d.minimap.map((Xt, Rl) => {
const el = Xt - h;
return {
x: q.value.width / d.minimap.length * Rl + fe.value / 2,
y: q.value.height - el / w * (q.value.height * 0.9)
};
}), ne = d.smoothMinimap ? zl(m) : Al(m), xt = [...m].slice(d.valueStart, d.valueEnd), fl = d.smoothMinimap ? zl(xt) : Al(xt);
return {
fullSet: ne,
selectionSet: fl,
sliced: xt,
firstPlot: m[d.valueStart],
lastPlot: m[d.valueEnd - 1]
};
}), z = k(() => ({
x: fe.value * ve.value + fe.value / 2,
width: q.value.width * ((he.value - ve.value) / d.max) - fe.value
})), vt = p(d.minimapSelectedIndex);
at(() => d.minimapSelectedIndex, (g) => {
vt.value = g + d.valueStart;
}, { immediate: !0 });
function me(g) {
vt.value = g, g >= d.valueStart && g < d.valueEnd && Ye("trapMouse", g - d.valueStart);
}
const ue = p(0), dt = p(null), Qt = p(null);
function ht(g) {
if (typeof g == "object" && g && "target" in g) {
const w = g.target, m = "valueAsNumber" in w ? w.valueAsNumber : +w.value;
return Number.isFinite(m) ? m : NaN;
}
const h = +g;
return Number.isFinite(h) ? h : NaN;
}
function ft(g) {
const h = ht(g);
Number.isFinite(h) && (st.value = h);
}
function ut(g) {
const h = ht(g);
Number.isFinite(h) && (rt.value = h);
}
const Et = k(() => d.valueEnd - d.valueStart), ze = p(!1);
let le = p(null);
const X = k(() => (Pt.value - 48) / (d.max - d.min)), vl = k(() => (Pt.value - 48) / (d.max - d.min) * Et.value), dl = p(2.5), jt = k(() => {
const g = Pt.value - 48;
return Math.ceil(
(d.max - d.min) / ((g - vl.value) / dl.value)
);
});
let _e = null, Oe = null, T = null, De = null;
const Bt = (g) => {
if (y.value = !0, !d.enableSelectionDrag) return;
const h = g.type === "touchstart", w = h && g.targetTouches && g.targetTouches[0] ? g.targetTouches[0] : null, m = h ? w ? w.target : null : g.target;
!m || !(m instanceof Element) || m.classList && m.classList.contains("range-handle") || (ze.value = !0, le.value = h ? w ? w.clientX : 0 : g.clientX, _e = h ? "touchmove" : "mousemove", Oe = h ? "touchend" : "mouseup", T = h ? ye : Ft, De = h ? hl : Wt, window.addEventListener(_e, T, { passive: !1 }), window.addEventListener(Oe, De));
};
function Ft(g) {
ze.value && He(g.clientX);
}
function ye(g) {
if (!ze.value || !Re.value) return;
const h = g.target;
if (!(h instanceof Element) || !Re.value.contains(h) || h.classList && h.classList.contains("range-handle")) return;
g.preventDefault();
const w = g.targetTouches && g.targetTouches[0] ? g.targetTouches[0] : null;
w && He(w.clientX);
}
function He(g) {
if (!ze.value) return;
const h = g - le.value;
if (Math.abs(h) > X.value) {
if (h > 0) {
const w = Math.min(d.max, he.value + jt.value);
rt.value = w, st.value = w - Et.value;
} else {
const w = Math.max(d.min, ve.value - jt.value);
st.value = w, rt.value = w + Et.value;
}
le.value = g;
}
}
function Wt() {
_();
}
function hl() {
_();
}
function _() {
ze.value = !1, _e && T && window.removeEventListener(_e, T), Oe && De && window.removeEventListener(Oe, De), _e = Oe = null, T = De = null, Pe();
}
const gt = p(!1), Mt = p(null), mt = p(null), Ct = p(1), zt = p(1), y = p(!1);
function Yt() {
Mt.value && (Ct.value = Mt.value.getBoundingClientRect().width);
}
function $() {
mt.value && (zt.value = mt.value.getBoundingClientRect().width);
}
const Le = p(0);
function Dt(g) {
Le.value = g === "start" ? 1 : 0;
}
const Qe = p(!1), t = p({
width: 0,
left: 0
});
at([ve, he], async () => {
if (await Kt(), !Mt.value || !mt.value) {
Qe.value = !1, t.value = { width: 0, left: 0 };
return;
}
const g = Mt.value.getBoundingClientRect(), h = mt.value.getBoundingClientRect();
Qe.value = g.x + g.width > h.x;
const w = g.x + g.width / 2, m = h.x + h.width / 2, ne = g.width + h.width, xt = (w + m) / 2;
t.value = {
width: ne,
left: xt - ne / 2
};
}), so(() => {
Yt(), $();
}), at(() => d.labelLeft, () => {
Kt(Yt);
}, { deep: !0 }), at(() => d.labelRight, () => {
Kt($);
}, { deep: !0 });
const B = k(() => {
const g = d.timeLabels.find((w) => w.absoluteIndex === ve.value), h = d.timeLabels.find((w) => w.absoluteIndex === he.value - 1);
return {
left: g ? g.text : "",
right: h ? h.text : ""
};
});
return cl(() => {
$e.value && $e.value.disconnect(), _e && T && window.removeEventListener(_e, T), Oe && De && window.removeEventListener(Oe, De), _e = Oe = null, T = De = null, clearTimeout(Ot);
}), Il({
setStartValue: ft,
setEndValue: ut
}), (g, h) => (u(), i("div", {
"data-dom-to-png-ignore": "",
style: { padding: "0 24px" },
class: "vue-data-ui-zoom",
ref_key: "zoomWrapper",
ref: Re,
onMousedown: Bt,
onTouchstart: Bt
}, [
b("div", Yo, [
I.valueStart !== I.refreshStartPoint || I.valueEnd !== Nl.value ? (u(), i("div", Do, [
I.useResetSlot ? J(g.$slots, "reset-action", {
key: 1,
reset: Vt
}, void 0, !0) : (u(), i("button", {
key: 0,
tabindex: "0",
role: "button",
class: "vue-data-ui-refresh-button",
style: L({
top: $t.value ? "36px" : "-16px",
pointerEvents: "all !important"
}),
onClick: Vt
}, [
qt(Wo, {
name: "refresh",
stroke: I.textColor
}, null, 8, ["stroke"])
], 4))
])) : f("", !0)
]),
b("div", {
class: "double-range-slider",
ref_key: "minimapWrapper",
ref: Je,
style: { "z-index": "0" },
onMouseenter: h[13] || (h[13] = (w) => y.value = !0),
onMouseleave: h[14] || (h[14] = (w) => y.value = !1)
}, [
$t.value ? (u(), i("div", Xo, [
(u(), i("svg", {
xmlns: v(bo),
viewBox: `0 0 ${q.value.width < 0 ? 0 : q.value.width} ${q.value.height < 0 ? 0 : q.value.height}`
}, [
b("defs", null, [
b("linearGradient", {
id: Jt.value,
x1: "0%",
y1: "0%",
x2: "0%",
y2: "100%"
}, [
b("stop", {
offset: "0%",
"stop-color": `${I.minimapLineColor}50`
}, null, 8, Zo),
h[15] || (h[15] = b("stop", {
offset: "100%",
"stop-color": "transparent"
}, null, -1))
], 8, Uo)
]),
b("path", {
d: `M${pe.value.fullSet}`,
stroke: `${I.minimapLineColor}`,
fill: "none",
"stroke-width": "1",
"stroke-linecap": "round",
"stroke-linejoin": "round",
style: { opacity: "1" }
}, null, 8, qo),
b("rect", {
x: z.value.x,
width: z.value.width < 0 ? 0 : z.value.width,
height: Math.max(q.value.height, 0),
y: 0,
fill: Ke.value,
rx: I.minimapSelectionRadius,
stroke: "none"
}, null, 8, Ko),
b("path", {
d: `M${fe.value / 2},${Math.max(q.value.height, 0)} ${pe.value.fullSet} L${q.value.width - fe.value / 2},${Math.max(q.value.height, 0)}Z`,
fill: `url(#${Jt.value})`,
stroke: "none",
style: { opacity: "1" }
}, null, 8, Jo),
b("rect", {
x: z.value.x,
width: z.value.width < 0 ? 0 : z.value.width,
height: Math.max(q.value.height, 0),
y: 0,
rx: I.minimapSelectionRadius,
fill: Ke.value
}, null, 8, Qo),
b("rect", {
x: z.value.x,
width: z.value.width < 0 ? 0 : z.value.width,
height: Math.max(q.value.height, 0),
y: 0,
fill: I.minimapSelectedColor,
rx: I.minimapSelectionRadius,
style: L({
opacity: I.minimapSelectedColorOpacity
})
}, null, 12, jo),
b("path", {
d: `M${pe.value.sliced[0].x},${Math.max(q.value.height, 0)} ${pe.value.selectionSet} L${pe.value.sliced.at(-1).x},${Math.max(q.value.height, 0)}Z`,
fill: `url(#${Jt.value})`,
stroke: "none",
style: { opacity: "1" }
}, null, 8, eu),
b("path", {
d: `M ${pe.value.selectionSet}`,
stroke: `${I.minimapLineColor}`,
fill: "transparent",
"stroke-width": "2",
"stroke-linecap": "round",
"stroke-linejoin": "round"
}, null, 8, tu),
b("circle", {
cx: pe.value.firstPlot.x,
cy: pe.value.firstPlot.y,
"stroke-width": "0.5",
stroke: Ke.value,
r: "3",
fill: I.minimapLineColor
}, null, 8, lu),
b("circle", {
cx: pe.value.lastPlot.x,
cy: pe.value.lastPlot.y,
"stroke-width": "0.5",
stroke: Ke.value,
r: "3",
fill: I.minimapLineColor
}, null, 8, au),
vt.value !== null ? (u(!0), i(x, { key: 0 }, C(Ht.value, (w, m) => (u(), i("g", null, [
vt.value === w && w >= I.valueStart && w < I.valueEnd ? (u(), i("line", {
key: 0,
x1: fe.value * m + fe.value / 2,
x2: fe.value * m + fe.value / 2,
y1: 0,
y2: Math.max(q.value.height, 0),
stroke: I.minimapIndicatorColor,
"stroke-linecap": "round",
"stroke-dasharray": "2",
"stroke-width": "1"
}, null, 8, ou)) : f("", !0)
]))), 256)) : f("", !0),
(u(!0), i(x, null, C(Ht.value, (w, m) => (u(), i("rect", {
x: fe.value * m,
y: 0,
height: Math.max(q.value.height, 0),
width: fe.value < 0 ? 0 : fe.value,
fill: "transparent",
style: L([{ "pointer-events": "all !important" }, {
cursor: w >= I.valueStart && w < I.valueEnd && I.enableSelectionDrag ? gt.value ? "grabbing" : "grab" : "default"
}]),
onMousedown: h[0] || (h[0] = (ne) => gt.value = !0),
onMouseup: h[1] || (h[1] = (ne) => gt.value = !1),
onMouseenter: (ne) => me(w),
onMouseleave: h[2] || (h[2] = (ne) => {
vt.value = null, Ye("trapMouse", null);
})
}, null, 44, uu))), 256))
], 8, Go))
])) : f("", !0),
h[16] || (h[16] = b("div", { class: "slider-track" }, null, -1)),
b("div", {
class: Ne({
"range-highlight": !0,
move: I.enableSelectionDrag
}),
onMousedown: h[3] || (h[3] = (w) => gt.value = !0),
onMouseup: h[4] || (h[4] = (w) => gt.value = !1),
style: L({
...oe.value,
cursor: gt.value ? "grabbing" : "grab"
})
}, null, 38),
I.enableRangeHandles ? Yl((u(), i("input", {
ref_key: "rangeStart",
ref: dt,
key: `range-min${ue.value}`,
type: "range",
class: Ne({ "range-left": !0, "range-handle": !0, "range-minimap": $t.value && I.verticalHandles }),
min: I.min,
max: I.max,
"onUpdate:modelValue": h[5] || (h[5] = (w) => st.value = w),
onInput: h[6] || (h[6] = (w) => ft(w)),
onChange: Pe,
onKeyup: Ma(Pe, ["enter"]),
onBlur: Pe,
onMouseenter: h[7] || (h[7] = (w) => Dt("start")),
onPointermove: h[8] || (h[8] = (w) => st.value = +w.target.value),
onPointerup: Pe
}, null, 42, nu)), [
[
Ca,
st.value,
void 0,
{ number: !0 }
]
]) : f("", !0),
I.enableRangeHandles ? Yl((u(), i("input", {
key: 2,
ref_key: "rangeEnd",
ref: Qt,
type: "range",
class: Ne({ "range-right": !0, "range-handle": !0, "range-minimap": $t.value && I.verticalHandles }),
min: I.min,
max: I.max,
"onUpdate:modelValue": h[9] || (h[9] = (w) => rt.value = w),
onInput: h[10] || (h[10] = (w) => ut(w)),
onChange: Pe,
onKeyup: Ma(Pe, ["enter"]),
onBlur: Pe,
onMouseenter: h[11] || (h[11] = (w) => Dt("end")),
onPointermove: h[12] || (h[12] = (w) => rt.value = +w.target.value),
onPointerup: Pe
}, null, 42, iu)), [
[
Ca,
rt.value,
void 0,
{ number: !0 }
]
]) : f("", !0),
B.value.left ? (u(), i("div", {
key: 3,
ref_key: "tooltipLeft",
ref: Mt,
class: Ne({
"range-tooltip": !0,
"range-tooltip-visible": y.value,
"range-tooltip-arrow": oe.value.arrowLeft && !I.verticalHandles,
"range-tooltip-arrow-left": !oe.value.arrowLeft && !I.verticalHandles
}),
style: L({
left: oe.value.tooltipLeft,
color: v(qe)(I.selectColor),
backgroundColor: I.selectColor,
border: `1px solid ${Ke.value}`,
zIndex: `${Le.value + 4}`,
visibility: Qe.value || B.value.left === B.value.right ? "hidden" : "visible"
})
}, te(B.value.left), 7)) : f("", !0),
(Qe.value || B.value.left === B.value.right) && (B.value.left || B.value.right) ? (u(), i("div", {
key: 4,
ref: "tooltipMerge",
class: Ne({
"range-tooltip": !0,
"range-tooltip-visible": y.value,
"range-tooltip-arrow": !0,
"range-tooltip-arrow-left": !oe.value.arrowLeft && !I.verticalHandles,
"range-tooltip-arrow-right": !oe.value.arrowRight && !I.verticalHandles
}),
style: L({
left: oe.value.tooltipCenter,
width: t.value.width + "px",
color: v(qe)(I.selectColor),
backgroundColor: I.selectColor,
border: `1px solid ${Ke.value}`,
zIndex: "4"
})
}, te(B.value.left === B.value.right ? B.value.left : `${B.value.left} - ${B.value.right}`), 7)) : f("", !0),
B.value.right ? (u(), i("div", {
key: 5,
ref_key: "tooltipRight",
ref: mt,
class: Ne({
"range-tooltip": !0,
"range-tooltip-visible": y.value,
"range-tooltip-arrow": oe.value.arrowRight && !I.verticalHandles,
"range-tooltip-arrow-right": !oe.value.arrowRight && !I.verticalHandles
}),
style: L({
left: oe.value.tooltipRight,
color: v(qe)(I.selectColor),
backgroundColor: I.selectColor,
border: `1px solid ${Ke.value}`,
zIndex: "4",
visibility: Qe.value || B.value.left === B.value.right ? "hidden" : "visible"
})
}, te(B.value.right), 7)) : f("", !0)
], 544)
], 544));
}
}, ru = /* @__PURE__ */ Oa(su, [["__scopeId", "data-v-619e736c"]]), cu = ["id"], vu = ["id"], du = ["viewBox", "aria-label"], hu = ["x", "y", "width", "height"], fu = { key: 1 }, gu = { class: "vue-ui-xy-grid" }, mu = ["stroke", "x1", "x2", "y1", "y2"], xu = ["stroke", "x1", "x2", "y1", "y2"], bu = { key: 1 }, pu = ["x1", "x2", "y1", "y2", "stroke"], yu = ["x1", "x2", "y1", "y2", "stroke"], ku = ["x1", "x2", "y1", "y2", "stroke"], wu = { key: 3 }, Su = ["d", "stroke"], $u = { key: 4 }, _u = ["d", "stroke"], Lu = ["id"], Mu = ["stop-color"], Cu = ["stop-color"], zu = ["stop-color"], Au = ["id"], Iu = ["stop-color"], Tu = ["stop-color"], Nu = ["stop-color"], Ru = ["id"], Pu = ["stop-color"], Ou = ["stop-color"], Hu = ["id"], Vu = ["stop-color"], Eu = ["stop-color"], Bu = ["id"], Fu = ["stop-color"], Wu = ["stop-color"], Yu = ["x", "y", "height", "width", "fill"], Du = ["x", "y", "width"], Xu = { key: 0 }, Gu = ["x", "y", "height", "width", "fill"], Uu = ["x", "y", "height", "width", "rx", "fill", "stroke", "stroke-width"], Zu = ["x", "y", "height", "width", "rx", "fill", "stroke", "stroke-width"], qu = ["width", "x", "y"], Ku = { key: 0 }, Ju = ["id"], Qu = ["fill"], ju = ["x1", "x2", "y1", "y2", "stroke", "marker-end"], en = ["x", "y", "font-size", "fill"], tn = ["stroke", "x1", "x2", "y1", "y2"], ln = { key: 3 }, an = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], on = ["x", "y", "width", "height", "stroke", "stroke-width", "stroke-linecap", "stroke-linejoin", "stroke-dasharray"], un = ["x1", "x2", "y1", "y2", "stroke", "stroke-width"], nn = ["fill", "font-size", "transform"], sn = ["x1", "x2", "y1", "y2", "stroke"], rn = ["x", "y", "font-size", "fill"], cn = ["x1", "x2", "y1", "y2", "stroke"], vn = ["x", "y", "font-size", "fill"], dn = ["width", "x", "y"], hn = { style: { width: "100%" } }, fn = { key: 0 }, gn = ["id"], mn = ["fill"], xn = ["x1", "x2", "y1", "y2", "stroke", "marker-end"], bn = ["x", "y", "font-size", "fill"], pn = ["d", "stroke", "stroke-width", "stroke-dasharray"], yn = ["d", "stroke", "stroke-width", "stroke-dasharray"], kn = { key: 6 }, wn = { key: 0 }, Sn = ["d", "fill"], $n = ["d", "fill"], _n = ["d", "fill"], Ln = ["d", "fill"], Mn = ["d", "stroke", "stroke-width", "stroke-dasharray"], Cn = ["d", "stroke", "stroke-width", "stroke-dasharray"], zn = ["width", "x", "y"], An = { style: { width: "100%" } }, In = { key: 3 }, Tn = ["id"], Nn = ["fill"], Rn = ["x1", "x2", "y1", "y2", "stroke", "marker-end"], Pn = ["x", "y", "font-size", "fill"], On = { key: 7 }, Hn = ["x", "y", "font-size", "fill"], Vn = ["x", "y", "font-size", "fill", "font-weight"], En = { key: 8 }, Bn = ["x", "y", "font-size", "fill"], Fn = { key: 9 }, Wn = ["x", "y"], Yn = ["innerHTML"], Dn = ["x", "y"], Xn = ["innerHTML"], Gn = ["x1", "x2", "y1", "y2", "stroke"], Un = { key: 10 }, Zn = ["x", "y", "font-size", "fill"], qn = { key: 11 }, Kn = ["x", "y"], Jn = ["innerHTML"], Qn = ["x", "y"], jn = ["innerHTML"], ei = ["x1", "x2", "y1", "y2", "stroke"], ti = ["x", "y", "font-size", "fill", "innerHTML"], li = ["x", "y", "font-size", "fill", "innerHTML"], ai = ["x", "y", "font-size", "fill", "innerHTML"], oi = ["x", "y", "font-size", "fill", "innerHTML"], ui = ["id"], ni = ["stop-color"], ii = ["stop-color"], si = ["x", "y", "width", "height", "fill", "onMouseenter"], ri = ["font-size", "fill", "transform"], ci = ["x", "y", "font-size", "fill"], vi = ["text-anchor", "font-size", "fill", "transform", "onClick"], di = ["text-anchor", "font-size", "fill", "transform", "innerHTML", "onClick"], hi = { key: 14 }, fi = ["x1", "y1", "x2", "y2", "stroke", "stroke-width", "stroke-dasharray"], gi = ["x1", "y1", "x2", "y2", "stroke", "stroke-width", "stroke-dasharray"], mi = ["y", "x", "width", "height", "fill"], xi = ["id", "x", "y", "font-size", "fill", "text-anchor"], bi = {
key: 15,
style: { "pointer-events": "none" }
}, pi = ["x", "y"], yi = ["cx", "cy", "r", "fill"], ki = {
key: 4,
class: "vue-data-ui-watermark"
}, wi = {
class: "vue-ui-xy-tag-arrow",
height: "20",
viewBox: "0 0 10 20",
style: { position: "absolute", right: "100%", top: "50%", transform: "translateY(-50%)" }
}, Si = ["fill"], $i = ["innerHTML"], _i = {
class: "vue-ui-xy-tag-arrow",
height: "100%",
viewBox: "0 0 10 20",
style: { position: "absolute", left: "100%", top: "50%", transform: "translateY(-50%)" }
}, Li = ["fill"], Mi = ["innerHTML"], Ci = {
class: "vue-ui-xy-tag-arrow",
height: "20",
viewBox: "0 0 10 20",
style: { position: "absolute", right: "100%", top: "50%", transform: "translateY(-50%)" }
}, zi = ["fill"], Ai = ["innerHTML"], Ii = {
class: "vue-ui-xy-tag-arrow",
height: "100%",
viewBox: "0 0 10 20",
style: { position: "absolute", left: "100%", top: "50%", transform: "translateY(-50%)" }
}, Ti = ["fill"], Ni = ["innerHTML"], Ri = ["id"], Pi = ["onClick"], Oi = {
key: 0,
viewBox: "0 0 20 12",
height: "14",
width: "20"
}, Hi = ["stroke", "fill"], Vi = {
key: 1,
viewBox: "0 0 40 40",
height: "14",
width: "14"
}, Ei = ["fill"], Bi = ["fill"], Fi = {
key: 2,
viewBox: "0 0 12 12",
height: "14",
width: "14"
}, Wi = {
style: { display: "flex", "flex-direction": "row", gap: "6px", "align-items": "center", "padding-left": "6px" },
"data-dom-to-png-ignore": ""
}, Yi = ["innerHTML"], Di = {
__name: "vue-ui-xy",
props: {
config: {
type: Object,
default() {
return {};
}
},
dataset: {
type: Array,
default() {
return [];
}
},
selectedXIndex: {
type: Number,
default: void 0
}
},
emits: ["selectTimeLabel", "selectX", "selectLegend"],
setup(I, { expose: Il, emit: Tl }) {
const d = I, Re = kt(() => import("./DataTable-rj9-mAwF.js")), ve = kt(() => import("./Tooltip-BMOddG-M.js")), he = kt(() => import("./UserOptions-DVzyjG-W.js")), $t = kt(() => import("./BaseIcon-CCivwZUq.js")), Jt = kt(() => import("./vue-ui-table-sparkline-BUzu6v2P.js")), Pt = kt(() => import("./vue-ui-accordion-D46i_gkB.js")), st = kt(() => import("./PackageVersion-5ZjKSIei.js")), rt = kt(() => import("./PenAndPaper-BJ0hcgsa.js")), Ot = Tl, Pe = ro(), Nl = co(), { vue_ui_xy: Ye } = po(), oe = p(null), ot = p(null), Ce = p(null), ct = p(null), _t = p(null), Lt = p(null), Ke = p(null), Ht = p(null), Vt = p(null), Je = p(null), q = p(null), $e = p(null), fe = p(null), pe = p(0), z = p(null), vt = p(!0), me = p(600), ue = p(1e3), dt = p("0 0 1000 600"), Qt = p({ x: 0, y: 0 }), ht = p({ line: "line", bar: "bar", plot: "plot" }), ft = p(!1), ut = p(!1), Et = p(!1), ze = p(null), le = p([]), X = p(Cl()), vl = p(0), dl = p(0), jt = p(0), _e = p(!0), Oe = p(0), T = p(null), De = p(!1), Bt = p(!0), Ft = p(!0), ye = p(null), He = p({}), Wt = p(null), hl = p(!1), _ = p(null), gt = k(() => ({
height: me.value,
width: ue.value
})), Mt = d.config.downsample && d.config.downsample.threshold ? d.config.downsample.threshold : 500;
function mt(l) {
return Number.isFinite(l) ? Math.max(0, Math.floor(l)) : 0;
}
function Ct(l, r, e = 0) {
return Number.isFinite(l) && Number.isFinite(r) && Math.abs(r) > 1e-9 ? l / r : e;
}
const zt = p(!1), y = p({
dataLabels: { show: !0 },
showTooltip: !0,
showTable: !1,
isStacked: !1,
useIndividualScale: !1
});
function Yt() {
zt.value ? (y.value.isStacked = t.value.chart.grid.labels.yAxis.stacked, y.value.useIndividualScale == null && (y.value.useIndividualScale = t.value.chart.grid.labels.yAxis.useIndividualScale)) : (y.value = {
dataLabels: { show: !0 },
showTooltip: t.value.chart.tooltip.show === !0,
showTable: t.value.showTable === !0,
isStacked: t.value.chart.grid.labels.yAxis.stacked,
useIndividualScale: t.value.chart.grid.labels.yAxis.useIndividualScale
}, zt.value = !0);
}
const $ = p({
xAxis: 18,
yAxis: 12,
dataLabels: 20,
plotLabels: 10
}), Le = p({ plot: 3, line: 3 });
rl(() => {
hl.value = !0, d.dataset.length && d.dataset.forEach((l, r) => {
[null, void 0].includes(l.series) && Fl({
componentName: "VueUiXy",
type: "datasetSerieAttribute",
property: "series (number[])",
index: r,
debug: ul.value
});
});
});
function Dt() {
if (!Object.keys(d.config || {}).length)
return Ye;
const l = Wl({
userConfig: d.config,
defaultConfig: Ye
});
return d.config && We(d.config, "chart.highlightArea") && (Array.isArray(d.config.chart.highlightArea) ? l.chart.highlightArea = d.config.chart.highlightArea : l.chart.highlightArea = [d.config.chart.highlightArea]), d.config && We(d.config, "chart.grid.labels.yAxis.scaleMin") ? l.chart.grid.labels.yAxis.scaleMin = d.config.chart.grid.labels.yAxis.scaleMin : l.chart.grid.labels.yAxis.scaleMin = null, d.config && We(d.config, "chart.grid.labels.yAxis.scaleMax") ? l.chart.grid.labels.yAxis.scaleMax = d.config.chart.grid.labels.yAxis.scaleMax : l.chart.grid.labels.yAxis.scaleMax = null, d.config && We(d.config, "chart.zoom.startIndex") ? l.chart.zoom.startIndex = d.config.chart.zoom.startIndex : l.chart.zoom.startIndex = null, d.config && We(d.config, "chart.zoom.endIndex") ? l.chart.zoom.endIndex = d.config.chart.zoom.endIndex : l.chart.zoom.endIndex = null, d.config && We(d.config, "chart.grid.labels.yAxis.groupColor") ? l.chart.grid.labels.yAxis.groupColor = d.config.chart.grid.labels.yAxis.groupColor : l.chart.grid.labels.yAxis.groupColor = null, d.config && d.config.chart.annotations && Array.isArray(d.config.chart.annotations) && d.config.chart.annotations.length ? l.chart.annotations = d.config.chart.annotations.map((r) => Wl({
defaultConfig: Ye.chart.annotations[0],
userConfig: r
})) : l.chart.annotations = [], d.config && We(d.config, "chart.grid.position") && d.config.chart.grid.position === "start" && d.dataset.length && d.dataset.some((r) => r.type === "bar") && (l.chart.grid.position = "middle", We(d.config, "debug") && console.warn("Vue Data UI - VueUiXy - config.chart.grid.position was overriden to `middle` because your dataset contains a bar")), d.config && We(d.config, "chart.grid.labels.yAxis.serieNameFormatter") ? l.chart.grid.labels.yAxis.serieNameFormatter = d.config.chart.grid.labels.yAxis.serieNameFormatter : l.chart.grid.labels.yAxis.serieNameFormatter = null, d.config && We(d.config, "events.datapointEnter") ? l.events.datapointEnter = d.config.events.datapointEnter : l.events.datapointEnter = null, d.config && We(d.config, "events.datapointLeave") ? l.events.datapointLeave = d.config.events.datapointLeave : l.events.datapointLeave = null, d.config && We(d.config, "events.datapointClick") ? l.events.datapointClick = d.config.events.datapointClick : l.events.datapointClick = null, l.theme ? {
...Wl({
userConfig: Io.vue_ui_xy[l.theme] || d.config,
defaultConfig: l
}),
customPalette: Ao[l.theme] || d.palette
} : l;
}
const Qe = k({
get() {
return !!d.dataset && d.dataset.length;
},
set(l) {
return l;
}
}), t = p(Dt()), { loading: B, FINAL_DATASET: g, manualLoading: h } = Oo({
...vo(d),
FINAL_CONFIG: t,
prepareConfig: Dt,
callback: () => {
Promise.resolve().then(async () => {
await bl();
});
},
skeletonDataset: [
{
name: "",
series: [0, 1, 2, 3, 5, 8, 13, 21, 34, 55, 89, 134],
type: "line",
smooth: !0,
color: "#BABABA"
},
{
name: "",
series: [0, 0.5, 1, 1.5, 2.5, 4, 6.5, 10.5, 17, 27.5, 44.5, 67],
type: "bar",
color: "#CACACA"
}
],
skeletonConfig: yo({
defaultConfig: t.value,
userConfig: {
useCssAnimation: !1,
showTable: !1,
chart: {
annotations: [],
highlightArea: [],
backgroundColor: "#99999930",
grid: {
stroke: "#6A6A6A",
labels: {
show: !1,
axis: {
yLabel: "",
xLabel: ""
},
xAxisLabels: { show: !1 },
yAxis: {
commonScaleSteps: 10,
useNiceScale: !0,
scaleMin: 0,
scaleMax: 134
},
zeroLine: { show: !0 }
}
},
padding: {
top: 12,
bottom: 24,
left: 24,
right: 24
},
userOptions: { show: !1 },
zoom: {
show: !1,
startIndex: null,
endIndex: null
}
},
bar: {
serieName: { show: !1 },
labels: { show: !1 },
border: {
useSerieColor: !1,
stroke: "#999999"
}
},
line: {
dot: {
useSerieColor: !1,
fill: "#8A8A8A"
},
labels: { show: !1 }
}
}
})
}), w = k({
get: () => Math.max(...g.value.map((l) => Ue({ data: l.series, threshold: Mt }).length)),
set: (l) => l
}), m = p({ start: 0, end: w.value }), ne = p({ start: 0, end: w.value }), xt = k(() => t.value.chart.zoom.preview.enable && (ne.value.start !== m.value.start || ne.value.end !== m.value.end));
function fl(l, r) {
ne.value[l] = r;
}
function Xt() {
const l = Math.max(
1,
...g.value.map((n) => Ue({
data: n.series,
threshold: t.value.downsample.threshold
}).length)
);
let r = Math.max(0, Math.min(m.value.start ?? 0, l - 1)), e = Math.max(r + 1, Math.min(m.value.end ?? l, l));
(!Number.isFinite(r) || !Number.isFinite(e) || e <= r) && (r = 0, e = l), m.value = { start: r, end: e }, ne.value.start = r, ne.value.end = e;
}
const Rl = k(() => {
const { left: l, top: r, width: e, height: n } = c.value, a = m.value.start, o = m.value.end - a, P = e / o, G = ne.value.start - a, U = ne.value.end - a, M = Math.max(0, Math.min(o, G)), H = Math.max(0, Math.min(o, U));
return {
x: l + M * P,
y: r,
width: (H - M) * P,
height: n,
fill: t.value.chart.zoom.preview.fill,
stroke: t.value.chart.zoom.preview.stroke,
"stroke-width": t.value.chart.zoom.preview.strokeWidth,
"stroke-dasharray": t.value.chart.zoom.preview.strokeDasharray,
"stroke-linecap": "round",
"stroke-linejoin": "round",
style: {
pointerEvents: "none",
transition: "all 0.1s ease-in-out",
animation: "none !important"
}
};
});
at(() => d.selectedXIndex, (l) => {
if ([null, void 0].includes(d.selectedXIndex)) {
_.value = null;
return;
}
const r = l - m.value.start;
r < 0 || l >= m.value.end ? _.value = null : _.value = r ?? null;
}, { immediate: !0 });
const { isPrinting: el, isImaging: Xl, generatePdf: Gl, generateImage: Ul } = Po({
elementId: `vue-ui-xy_${X.value}`,
fileName: t.value.chart.title.text || "vue-ui-xy",
options: t.value.chart.userOptions.print
}), Ha = p(!1), Zl = k(() => ko(t.value.customPalette)), gl = k(() => {
if (t.value.chart.grid.labels.yAxis.scaleMin !== null)
return t.value.chart.grid.labels.yAxis.scaleMin;
const l = Math.min(...nt.value.filter((r) => !le.value.includes(r.id)).map((r) => Math.min(...r.series)));
return l > 0 ? 0 : l;
}), ml = k(() => {
if (t.value.chart.grid.labels.yAxis.scaleMax)
return t.value.chart.grid.labels.yAxis.scaleMax;
const l = Math.max(...nt.value.filter((r) => !le.value.includes(r.id)).map((r) => Math.max(...r.series)));
return gl.value === l ? l + 1 : l;
}), Xe = k(() => t.value.chart.grid.labels.yAxis.useNiceScale ? sl(gl.value, ml.value < 0 ? 0 : ml.value, t.value.chart.grid.labels.yAxis.commonScaleSteps) : Nt(gl.value, ml.value < 0 ? 0 : ml.value, t.value.chart.grid.labels.yAxis.commonScaleSteps)), tl = k(() => [null, void 0].includes(t.value.chart.grid.labels.yAxis.scaleMin) ? Xe.value.min >= 0 ? 0 : Math.abs(Xe.value.min) : -Xe.value.min), nt = k(() => vt.value ? g.value.map((l, r) => {
const e = Ue({
data: l.series,
threshold: t.value.downsample.threshold
}), n = `uniqueId_${r}`;
return {
...l,
slotAbsoluteIndex: r,
series: e.map((a) => _l(a) ? a : null).slice(m.value.start, m.value.end),
color: wo(l.color ? l.color : Zl.value[r] ? Zl.value[r] : So[r]),
id: n,
scaleLabel: l.scaleLabel || n
};
}) : g.value), je = k(() => nt.value.map((l, r) => ({
absoluteIndex: r,
...l,
series: l.series.map((e) => e + tl.value),
absoluteValues: l.series,
segregate: () => va(l),
isSegregated: le.value.includes(l.id)
}))), Ve = k(() => nt.value.map((l, r) => ({
...l,
series: l.series.map((e) => e + tl.value),
absoluteValues: l.series
})).filter((l) => !le.value.includes(l.id)));
function Va() {
let l = 0;
q.value && (l = Array.from(q.value.querySelectorAll("text")).reduce((a, s) => {
const o = s.getComputedTextLength();
return (o > a ? o : a) + t.value.chart.grid.labels.yAxis.scaleValueOffsetX;
}, 0));
const r = Vt.value ? Vt.value.getBoundingClientRect().width + t.value.chart.grid.labels.axis.yLabelOffsetX + $.value.yAxis : 0, e = t.value.chart.grid.labels.yAxis.crosshairSize;
return l + r + e;
}
const Pl = p(0), Ea = Dl((l) => {
Pl.value = l;
}, 100);
ho((l) => {
const r = Je.value;
if (!r) return;
const e = new ResizeObserver((n) => {
Ea(n[0].contentRect.height);
});
e.observe(r), l(() => e.disconnect());
}), cl(() => {
Pl.value = 0;
});
const ql = k(() => {
let l = 0;
Ht.value && (l = Ht.value.getBBox().height);
let r = 0;
return Je.value && (r = Pl.value), l + r + $.value.xAxis;
}), Ba = k(() => g.value.some((l) => l.useProgression)), c = k(() => {
let l = 0;
const r = 36;
t.value.chart.grid.labels.show && (y.value.useIndividualScale && !y.value.isStacked ? l = (g.value.length - le.value.length) * (t.value.chart.grid.labels.yAxis.labelWidth + r) : y.value.useIndividualScale && y.value.isStacked ? l = t.value.chart.grid.labels.yAxis.labelWidth + r : l = Va());
const e = t.value.chart.labels.fontSize * 1.1, n = Ba.value ? 24 : 6;
if (Je.value) {
const o = Je.value.getBBox().x;
o < 0 && (l += Math.abs(o));
}
const a = ue.value - l - t.value.chart.grid.labels.yAxis.crosshairSize - n - t.value.chart.padding.left - t.value.chart.padding.right, s = t.value.chart.grid.position === "middle" ? 0 : a / R.value / 2;
return {
top: t.value.chart.padding.top + e,
right: ue.value - n - t.value.chart.padding.right,
bottom: me.value - ql.value - t.value.chart.padding.bottom - t.value.chart.grid.labels.axis.xLabelOffsetY,
left: l + t.value.chart.grid.labels.yAxis.crosshairSize - s + t.value.chart.padding.left,
height: me.value - ql.value - t.value.chart.padding.top - t.value.chart.padding.bottom - e - t.value.chart.grid.labels.axis.xLabelOffsetY,
width: a,
scaleLabelX: l,
individualOffsetX: r
};
}), Fa = k(() => {
const l = t.value.chart.grid.position === "middle" ? 1 : 0, r = R.value + l, e = D(c.value.top), n = D(c.value.bottom);
return Array.from({ length: r }).map((a, s) => {
const o = c.value.width / R.value * s + c.value.left + j.value;
return `M${o},${e} L${o},${n}`;
}).join(" ");
}), Wa = k(() => {
if (!t.value.chart.grid.labels.xAxis.showCrosshairs) return "";
const l = c.value.width / R.value, r = t.value.chart.grid.labels.xAxis.crosshairSize, e = t.value.chart.grid.labels.xAxis.crosshairsAlwaysAtZero;
return Hl.value.map((n, a) => {
if (!n || !n.text) return null;
const s = c.value.left + l * a + l / 2, o = e ? ke.value - (ke.value === c.value.bottom ? 0 : r / 2) : c.value.bottom, P = e ? ke.value + r / (ke.value === c.value.bottom ? 1 : 2) : c.value.bottom + r;
return `M${s},${o} L${s},${P}`;
}).filter(Boolean).join(" ");
});
function Kl() {
return !!Nl?.vnode.props?.onSelectTimeLabel;
}
function Ya(l, r, e) {
if (!Wt.value) {
const n = document.createElement("canvas");
Wt.value = n.getContext("2d");
}
return Wt.value.font = `normal ${l}px sans-serif`, Wt.value;
}
function Jl() {
const l = oe.value.querySelectorAll(".vue-ui-xy-tag");
l.length && Array.from(l).forEach((r) => r.style.opacity = "0");
}
function xl(l, r, e, n, a) {
e && (He.value[`${l}_${r}_${n}_${a}`] = e);
}
const Ql = p(!1);
async function jl(l = !1) {
await Kt(), Ql.value = l, De.value && (Ft.value = l);
}
function Ol() {
ft.value = !ft.value;
}
const de = k(() => {
const l = Math.max(...g.value.map((r) => Ue({ data: r.series, threshold: t.value.downsample.threshold }).length));
return Pa({
values: t.value.chart.grid.labels.xAxisLabels.values,
maxDatapoints: l,
formatter: t.value.chart.grid.labels.xAxisLabels.datetimeFormatter,
start: m.value.start,
end: m.value.end
});
}), ea = k(() => {
const l = Math.max(...g.value.map((r) => Ue({ data: r.series, threshold: t.value.downsample.threshold }).length));
return Pa({
values: t.value.chart.grid.labels.xAxisLabels.values,
maxDatapoints: l,
formatter: t.value.chart.grid.labels.xAxisLabels.datetimeFormatter,
start: 0,
end: w.value
});
}), Da = k(() => {
const l = t.value.chart.grid.labels.xAxisLabels.modulo;
return de.value.length ? Math.min(l, [...new Set(de.value.map((r) => r.text))].length) : l;
}), Hl = k(() => {
const l = t.value.chart.grid.labels.xAxisLabels, r = de.value || [];
if (l.showOnlyFirstAndLast) {
if (r.length <= 2) return r;
const S = _.value;
return r.map(
(O, A) => A === 0 || A === r.length - 1 || S != null && A === S ? O : { ...O, text: "" }
);
}
if (!l.showOnlyAtModulo) return r;
const e = Math.max(1, Da.value || 1);
if (R.value <= e) return r;
const n = e, a = ea.value || [], s = m.value.start ?? 0, o = [];
for (let S = 0; S < r.length; S += 1) {
const O = r[S]?.text ?? "";
if (!O) continue;
const A = s + S - 1 >= 0 ? a[s + S - 1]?.text ?? "" : null;
O !== A && o.push(S);
}
if (!o.length) return r.map((S) => ({ ...S, text: "" }));
const P = o.length, G = Math.max(2, Math.min(n - 3, P)), U = Math.min(P, n + 3);
let M = Math.min(n, P), H = 1 / 0;
for (let S = G; S <= U; S += 1) {
const O = (P - 1) % (S - 1), A = Math.abs(S - n), ie = O * 10 + A;
ie < H && (H = ie, M = S);
}
const Z = /* @__PURE__ */ new Set();
if (M <= 1)
Z.add(o[Math.round((P - 1) / 2)]);
else {
const S = (P - 1) / (M - 1);
for (let O = 0; O < M; O += 1)
Z.add(o[Math.round(O * S)]);
}
return r.map((S, O) => Z.has(O) ? S : { ...S, text: "" });
});
function ta(l, r) {
const e = Ve.value.map((n) => ({
shape: n.shape || null,
name: n.name,
color: n.color,
type: n.type,
value: n.absoluteValues.find((a, s) => s === r),
comments: n.comments || [],
prefix: n.prefix || t.value.chart.labels.prefix,
suffix: n.suffix || t.value.chart.labels.suffix
}));
Ot("selectTimeLabel", {
datapoint: e,
absoluteIndex: l.absoluteIndex,
label: l.text
});
}
const R = k(() => {
const l = mt((m.value.end ?? 0) - (m.value.start ?? 0));
return Math.max(1, l);
});
function la(l) {
T.value = l;
}
function aa() {
y.value.isStacked = !y.value.isStacked, y.value.isStacked ? y.value.useIndividualScale = !0 : y.value.useIndividualScale = t.value.chart.grid.labels.yAxis.useIndividualScale;
}
function Vl(l) {
ul.value && l.autoScaling && (t.value.chart.grid.labels.yAxis.useIndividualScale || console.warn(`VueUiXy (datapoint: ${l.name}) : autoScaling only works when config.chart.grid.labels.yAxis.useIndividualScale is set to true`), t.value.chart.grid.labels.yAxis.stacked || console.warn(`VueUiXy (datapoint: ${l.name}) : autoScaling only works when config.chart.grid.labels.yAxis.stacked is set to true`));
}
function Xa(l, r) {
const e = mt(l), n = Array(e).fill(0);
for (let a = 0; a < r.length && a < e; a += 1) n[a] = r[a] ?? 0;
return n;
}
function Ga(l) {
const r = Math.max(...g.value.map((e) => Ue({ data: e.series, threshold: t.value.downsample.threshold }).length));
return l > r ? r : l < 0 || t.value.chart.zoom.startIndex !== null && l < t.value.chart.zoom.startIndex ? t.value.chart.zoom.startIndex !== null ? t.value.chart.zoom.startIndex + 1 : 1 : l;
}
async function bl() {
await Kt(), await Kt();
const { startIndex: l, endIndex: r } = t.value.chart.zoom, e = Ce.value, n = Math.max(
...g.value.map(
(a) => Ue({
data: a.series,
threshold: t.value.downsample.threshold
}).le