vue-data-ui 3.16.4 → 3.17.0

package/dist/{vue-ui-sparkline-DFnG0CrA.js → vue-ui-sparkline-B-zOqzrC.js}

@@ -1,7 +1,7 @@
-import { computed as p, watch as z, nextTick as te, onBeforeUnmount as ot, openBlock as f, createElementBlock as g, Fragment as Z, renderList as ge, createElementVNode as M, createCommentVNode as L, ref as C, defineAsyncComponent as yt, toRefs as qt, shallowRef as mt, onMounted as bt, watchEffect as Gt, normalizeStyle as H, toDisplayString as Le, createBlock as _e, renderSlot as pe, normalizeProps as Ze, guardReactiveProps as Je, unref as b, createVNode as Ot, withCtx as jt, createTextVNode as zt } from "vue";
-import { j as Yt, t as kt, aD as Qe, o as wt, q as xt, r as Xt, v as Fe, Y as Kt, ap as Ut, c as $t, b as Ht, O as Zt, N as Jt, s as Qt, X as ea, u as Ve, V as ta, G as St, k as et, l as tt, aE as aa } from "./lib-DBptbyyI.js";
+import { computed as g, watch as z, nextTick as te, onBeforeUnmount as ot, openBlock as f, createElementBlock as y, Fragment as Z, renderList as ge, createElementVNode as M, createCommentVNode as _, ref as L, defineAsyncComponent as mt, toRefs as qt, shallowRef as bt, onMounted as kt, watchEffect as Gt, normalizeStyle as H, toDisplayString as Le, createBlock as _e, renderSlot as pe, normalizeProps as Ze, guardReactiveProps as Je, unref as b, createVNode as Ot, withCtx as jt, createTextVNode as zt } from "vue";
+import { j as Yt, t as wt, aD as Qe, o as xt, q as $t, r as Xt, v as Ve, Y as Kt, ap as Ut, c as St, b as Ht, O as Zt, N as Jt, s as Qt, X as ea, u as We, V as ta, G as Mt, k as et, l as tt, aE as aa } from "./lib-DBptbyyI.js";
 import { t as la, u as na } from "./useResponsive-DfdjqQps.js";
-import { u as ra } from "./useConfig-CpJA0VZa.js";
+import { u as ra } from "./useConfig-ChRble71.js";
 import { u as ua, B as oa } from "./BaseScanner-BhhkKVoj.js";
 import { u as at } from "./useNestedProp-Bf5XFbs8.js";
 import { u as sa } from "./useThemeCheck-D1ZYXUwG.js";
@@ -35,7 +35,7 @@ const pa = {
     isBar: { type: Boolean, required: !0 }
   },
   setup(e) {
-    const a = e, n = p(() => Math.min(a.pulseTrailLength, 45)), s = p(() => !!a.pulse?.show && !a.isBar && !a.prefersReducedMotion && !a.loading && Number(a.pulsePathLength) > 0);
+    const a = e, n = g(() => Math.min(a.pulseTrailLength, 45)), s = g(() => !!a.pulse?.show && !a.isBar && !a.prefersReducedMotion && !a.loading && Number(a.pulsePathLength) > 0);
     function o() {
       const i = a.svgRef?.value;
       i && (typeof i.pauseAnimations == "function" && i.pauseAnimations(), typeof i.setCurrentTime == "function" && i.setCurrentTime(0), typeof i.unpauseAnimations == "function" && i.unpauseAnimations());
@@ -44,15 +44,15 @@ const pa = {
       if (typeof i != "string") return i;
       const v = i.trim().match(/^([\d.]+)\s*(ms|s)$/);
       if (!v) return i;
-      const w = Number(v[1]), I = v[2];
-      return Number.isNaN(w) ? i : `${w + S}${I}`;
+      const x = Number(v[1]), I = v[2];
+      return Number.isNaN(x) ? i : `${x + S}${I}`;
     }
     function h(i) {
       return (n.value - i) / n.value * a.pulse.radius;
     }
-    function y(i) {
-      const S = a.pulse.trail.opacity, v = (n.value - i) / n.value, w = i === 0 ? 1 : v * S;
-      return `0;${w};${w};0`;
+    function m(i) {
+      const S = a.pulse.trail.opacity, v = (n.value - i) / n.value, x = i === 0 ? 1 : v * S;
+      return `0;${x};${x};0`;
     }
     return z(
       () => a.loading,
@@ -70,17 +70,17 @@ const pa = {
       }
     ), ot(() => {
       o();
-    }), (i, S) => s.value ? (f(), g("g", pa, [
-      (f(!0), g(Z, null, ge(n.value, (v, w) => (f(), g(Z, null, [
-        w % 3 === 0 ? (f(), g("circle", {
-          key: `sparkline_dot_${w}_${e.pulsePathId}`,
-          r: h(w),
+    }), (i, S) => s.value ? (f(), y("g", pa, [
+      (f(!0), y(Z, null, ge(n.value, (v, x) => (f(), y(Z, null, [
+        x % 3 === 0 ? (f(), y("circle", {
+          key: `sparkline_dot_${x}_${e.pulsePathId}`,
+          r: h(x),
           fill: e.pulse.color,
           filter: `url(#sparkline_pulse_glow_${e.uid})`,
           opacity: "0"
         }, [
           M("animateMotion", {
-            begin: d(e.pulseBegin, w * 10),
+            begin: d(e.pulseBegin, x * 10),
             dur: e.pulseDur,
             repeatCount: e.pulseRepeatCount,
             fill: e.pulseFillMode,
@@ -99,12 +99,12 @@ const pa = {
             dur: e.pulseDur,
             repeatCount: e.pulseRepeatCount,
             fill: e.pulseFillMode,
-            values: y(w),
+            values: m(x),
             keyTimes: "0;0.1;0.9;1"
           }, null, 8, ba)
-        ], 8, ga)) : L("", !0)
+        ], 8, ga)) : _("", !0)
       ], 64))), 256)),
-      (f(), g("circle", {
+      (f(), y("circle", {
         key: `sparkline_halo_${e.pulsePathId}`,
         r: Math.max(e.pulse.radius * 1.3),
         fill: e.pulse.color,
@@ -132,24 +132,24 @@ const pa = {
           repeatCount: e.pulseRepeatCount
         }, null, 8, $a)
       ], 8, ka))
-    ])) : L("", !0);
+    ])) : _("", !0);
   }
-}, We = {
+}, qe = {
   canvas: null,
   ctx: null
 };
 function Ma() {
   if (typeof document > "u")
     throw new Error("color-utils: document is not available (browser-only).");
-  if (!We.canvas) {
+  if (!qe.canvas) {
     const e = document.createElement("canvas");
     e.width = 1, e.height = 1;
     const a = e.getContext("2d", { willReadFrequently: !0 });
     if (!a)
       throw new Error("color-utils: unable to get 2D canvas context.");
-    We.canvas = e, We.ctx = a;
+    qe.canvas = e, qe.ctx = a;
   }
-  return We.ctx;
+  return qe.ctx;
 }
 function Aa(e) {
   return e < 0 ? 0 : e > 255 ? 255 : Math.round(e);
@@ -169,15 +169,15 @@ function Ca(e, a = null) {
   if (o.fillStyle = s, o.fillStyle === d && !_a(s))
     throw new Error(`colorToRgba: unsupported or invalid color "${e}".`);
   o.fillRect(0, 0, 1, 1);
-  const y = o.getImageData(0, 0, 1, 1).data;
+  const m = o.getImageData(0, 0, 1, 1).data;
   return {
-    red: y[0],
-    green: y[1],
-    blue: y[2],
-    alpha: y[3] / 255
+    red: m[0],
+    green: m[1],
+    blue: m[2],
+    alpha: m[3] / 255
   };
 }
-function Mt(e, a = null) {
+function At(e, a = null) {
   if (!Array.isArray(e) || e.length === 0)
     throw new Error("colorsToRgba: colors must be a non-empty array.");
   const n = new Array(e.length);
@@ -201,12 +201,12 @@ function lt(e) {
   let n;
   return a <= 31308e-7 ? n = a * 12.92 : n = 1.055 * Math.pow(a, 1 / 2.4) - 0.055, Aa(n * 255);
 }
-function At(e, a, n, s) {
+function Ct(e, a, n, s) {
   const o = it(n);
   if (s === "linearRGB") {
-    const d = xe(e.red), h = xe(e.green), y = xe(e.blue), i = xe(a.red), S = xe(a.green), v = xe(a.blue), w = d + (i - d) * o, I = h + (S - h) * o, B = y + (v - y) * o;
+    const d = xe(e.red), h = xe(e.green), m = xe(e.blue), i = xe(a.red), S = xe(a.green), v = xe(a.blue), x = d + (i - d) * o, I = h + (S - h) * o, B = m + (v - m) * o;
     return {
-      red: lt(w),
+      red: lt(x),
       green: lt(I),
       blue: lt(B),
       alpha: e.alpha + (a.alpha - e.alpha) * o
@@ -245,13 +245,13 @@ function Na(e, a, n, s = !0) {
   const d = (e - a) / o;
   return s ? j(d, 0, 1) : d;
 }
-const Ct = "http://www.w3.org/2000/svg";
+const Lt = "http://www.w3.org/2000/svg";
 function Ia(e) {
   if (typeof document > "u")
     throw new Error("SvgPathGradientAsync: document is not available (browser-only implementation).");
-  const a = document.createElementNS(Ct, "svg");
+  const a = document.createElementNS(Lt, "svg");
   a.setAttribute("width", "0"), a.setAttribute("height", "0"), a.setAttribute("viewBox", "0 0 0 0"), a.style.position = "absolute", a.style.left = "-10000px", a.style.top = "-10000px", a.style.visibility = "hidden", a.style.pointerEvents = "none";
-  const n = document.createElementNS(Ct, "path");
+  const n = document.createElementNS(Lt, "path");
   return e === "M " && (e = "M 0,0"), n.setAttribute("d", e), a.appendChild(n), document.body.appendChild(a), { svgElement: a, pathElement: n };
 }
 function rt(e) {
@@ -277,14 +277,14 @@ function Ra(e, a, n) {
 }
 function Ba(e, a, n, s, o, d) {
   const h = n - a;
-  let y = Math.ceil(h / s) + 1;
-  y < 2 && (y = 2), y > d && (y = d);
-  const i = y > 1 ? h / (y - 1) : 0, S = e.getPointAtLength(a);
+  let m = Math.ceil(h / s) + 1;
+  m < 2 && (m = 2), m > d && (m = d);
+  const i = m > 1 ? h / (m - 1) : 0, S = e.getPointAtLength(a);
   let v = `M ${ie(ae(S.x, o))} ${ie(
     ae(S.y, o)
   )}`;
-  for (let w = 1; w < y; w += 1) {
-    const I = a + w * i, B = e.getPointAtLength(I);
+  for (let x = 1; x < m; x += 1) {
+    const I = a + x * i, B = e.getPointAtLength(I);
     v += ` L ${ie(ae(B.x, o))} ${ie(
       ae(B.y, o)
     )}`;
@@ -293,21 +293,21 @@ function Ba(e, a, n, s, o, d) {
 }
 function Da(e, a, n, s, o, d) {
   const h = n - a;
-  let y = Math.ceil(h / s) + 1;
-  y < 2 && (y = 2), y > d && (y = d);
-  const i = y > 1 ? h / (y - 1) : 0, S = e.getPointAtLength(a);
-  let v = S.x, w = S.x, I = S.y, B = S.y, W = `M ${ie(ae(S.x, o))} ${ie(
+  let m = Math.ceil(h / s) + 1;
+  m < 2 && (m = 2), m > d && (m = d);
+  const i = m > 1 ? h / (m - 1) : 0, S = e.getPointAtLength(a);
+  let v = S.x, x = S.x, I = S.y, B = S.y, E = `M ${ie(ae(S.x, o))} ${ie(
     ae(S.y, o)
   )}`;
-  for (let _ = 1; _ < y; _ += 1) {
-    const t = a + _ * i, E = e.getPointAtLength(t);
-    E.x < v && (v = E.x), E.x > w && (w = E.x), E.y < I && (I = E.y), E.y > B && (B = E.y), W += ` L ${ie(ae(E.x, o))} ${ie(
-      ae(E.y, o)
+  for (let A = 1; A < m; A += 1) {
+    const t = a + A * i, F = e.getPointAtLength(t);
+    F.x < v && (v = F.x), F.x > x && (x = F.x), F.y < I && (I = F.y), F.y > B && (B = F.y), E += ` L ${ie(ae(F.x, o))} ${ie(
+      ae(F.y, o)
     )}`;
   }
   return {
-    pathData: W,
-    bounds: { minX: v, maxX: w, minY: I, maxY: B }
+    pathData: E,
+    bounds: { minX: v, maxX: x, minY: I, maxY: B }
   };
 }
 function Ea(e) {
@@ -322,15 +322,15 @@ function Fa(e, a, n, s) {
   let d = s;
   for (d < 0 && (d = 0), d > e.length - 2 && (d = e.length - 2); d > 0 && o < e[d].position; ) d -= 1;
   for (; d < e.length - 2 && o > e[d + 1].position; ) d += 1;
-  const h = e[d], y = e[d + 1], i = y.position - h.position, S = i > 0 ? (o - h.position) / i : 0, v = Va(h.rgba, y.rgba, S, n);
+  const h = e[d], m = e[d + 1], i = m.position - h.position, S = i > 0 ? (o - h.position) / i : 0, v = Va(h.rgba, m.rgba, S, n);
   return st(v);
 }
 function Va(e, a, n, s) {
   const o = j(n, 0, 1);
   if (s === "linearRGB") {
-    const d = $e(e.red), h = $e(e.green), y = $e(e.blue), i = $e(a.red), S = $e(a.green), v = $e(a.blue), w = d + (i - d) * o, I = h + (S - h) * o, B = y + (v - y) * o;
+    const d = $e(e.red), h = $e(e.green), m = $e(e.blue), i = $e(a.red), S = $e(a.green), v = $e(a.blue), x = d + (i - d) * o, I = h + (S - h) * o, B = m + (v - m) * o;
     return {
-      red: ut(w),
+      red: ut(x),
       green: ut(I),
       blue: ut(B),
       alpha: e.alpha + (a.alpha - e.alpha) * o
@@ -373,7 +373,7 @@ function Wa(e) {
   }
   return n;
 }
-function Lt(e, a, n) {
+function _t(e, a, n) {
   return `<path d="${le(e)}" stroke="${le(a)}" ${n} />`;
 }
 function qa(e) {
@@ -386,7 +386,7 @@ function qa(e) {
   }
   return `<path d="${le(e.pathData)}" ${a.join(" ")} />`;
 }
-function _t(e, a) {
+function Pt(e, a) {
   const n = [];
   for (const o of Object.keys(a))
     n.push(`${o}="${le(a[o])}"`);
@@ -406,11 +406,11 @@ function Ga(e, a = null, n = {}) {
         throw new Error("SvgPathGradientAsync: colors must be a non-empty array when temperatureMode is not enabled.");
       if ((n.returnMode ?? "string") !== "string")
         throw new Error('SvgPathGradientAsync: only returnMode="string" is supported for the async version.');
-      const i = typeof n.decimalPlaces == "number" ? n.decimalPlaces : 3, S = typeof n.flattenTolerance == "number" && n.flattenTolerance > 0 ? n.flattenTolerance : 0.25, v = n.attrs ? { ...n.attrs } : {}, w = n.groupAttrs ? { ...n.groupAttrs } : {}, I = Pa(v["stroke-width"]), B = typeof n.strokeWidth == "number" && n.strokeWidth > 0 ? n.strokeWidth : typeof I == "number" && I > 0 ? I : 1;
+      const i = typeof n.decimalPlaces == "number" ? n.decimalPlaces : 3, S = typeof n.flattenTolerance == "number" && n.flattenTolerance > 0 ? n.flattenTolerance : 0.25, v = n.attrs ? { ...n.attrs } : {}, x = n.groupAttrs ? { ...n.groupAttrs } : {}, I = Pa(v["stroke-width"]), B = typeof n.strokeWidth == "number" && n.strokeWidth > 0 ? n.strokeWidth : typeof I == "number" && I > 0 ? I : 1;
       d = Ia(e);
-      const W = d.pathElement, _ = W.getTotalLength(), t = h === null ? Mt(a, n.colorReferenceElement) : [];
-      if (h === null && (!(_ > 0) || t.length === 1)) {
-        const G = st(t[0]), J = _t(
+      const E = d.pathElement, A = E.getTotalLength(), t = h === null ? At(a, n.colorReferenceElement) : [];
+      if (h === null && (!(A > 0) || t.length === 1)) {
+        const G = st(t[0]), J = Pt(
           [
             qa({
               pathData: e,
@@ -418,39 +418,39 @@ function Ga(e, a = null, n = {}) {
               segmentAttributeMap: v
             })
           ],
-          w
+          x
         );
         rt(d), s(J);
         return;
       }
-      const E = n.colorSpace ?? "linearRGB";
+      const F = n.colorSpace ?? "linearRGB";
       if (h !== null) {
         const G = n.temperatureColors;
         if (!Array.isArray(G) || G.length !== 2)
           throw new Error("SvgPathGradientAsync: temperatureColors must be a tuple of exactly 2 colors when temperatureMode is enabled.");
       }
-      const Pe = h !== null ? Mt(n.temperatureColors, n.colorReferenceElement) : null, P = h === null ? (() => {
+      const Pe = h !== null ? At(n.temperatureColors, n.colorReferenceElement) : null, P = h === null ? (() => {
         const G = Ea(t), J = new Array(G.length);
         for (let q = 0; q < G.length; q += 1)
           J[q] = { position: G[q].position, rgba: G[q].rgba };
         return J;
-      })() : [], de = Ta(_, B, n.maxSegmentLength), ne = Ra(_, n.segments, de), X = _ / ne;
+      })() : [], de = Ta(A, B, n.maxSegmentLength), ne = Ra(A, n.segments, de), X = A / ne;
       let re = typeof n.overlap == "number" && n.overlap >= 0 ? n.overlap : B * 0.5;
-      const V = X * 0.45;
-      re > V && (re = V);
+      const W = X * 0.45;
+      re > W && (re = W);
       const Ne = typeof n.samplePointLimitPerSegment == "number" && n.samplePointLimitPerSegment > 10 ? n.samplePointLimitPerSegment : 250, ce = Wa(v), ye = [], Ie = h !== null ? [] : null, ve = h !== null ? [] : null;
       let me = 0;
-      const qe = h === null ? P.length - 2 : 0;
+      const Ge = h === null ? P.length - 2 : 0;
       let Y = 0;
       const be = () => {
         const G = performance.now(), J = typeof n.frameBudgetMs == "number" ? n.frameBudgetMs : 8;
         for (; Y < ne && performance.now() - G < J; ) {
-          const F = Y * X, ue = (Y + 1) * X;
-          let N = F, D = ue;
-          if (Y !== 0 && (N = F - re), Y !== ne - 1 && (D = ue + re), N = j(N, 0, _), D = j(D, 0, _), D > N)
+          const V = Y * X, ue = (Y + 1) * X;
+          let N = V, D = ue;
+          if (Y !== 0 && (N = V - re), Y !== ne - 1 && (D = ue + re), N = j(N, 0, A), D = j(D, 0, A), D > N)
             if (h !== null) {
               const T = Da(
-                W,
+                E,
                 N,
                 D,
                 S,
@@ -459,16 +459,16 @@ function Ga(e, a = null, n = {}) {
               );
               Ie.push(T.pathData), ve.push(T.bounds);
             } else {
-              const R = (N + D) * 0.5 / _;
-              for (; me < qe && R > P[me + 1].position; )
+              const R = (N + D) * 0.5 / A;
+              for (; me < Ge && R > P[me + 1].position; )
                 me += 1;
               const K = Fa(
                 P,
                 R,
-                E,
+                F,
                 me
               ), U = Ba(
-                W,
+                E,
                 N,
                 D,
                 S,
@@ -476,7 +476,7 @@ function Ga(e, a = null, n = {}) {
                 Ne
               );
               ye.push(
-                Lt(U, K, ce)
+                _t(U, K, ce)
               );
             }
           Y += 1;
@@ -486,21 +486,21 @@ function Ga(e, a = null, n = {}) {
           return;
         }
         if (h !== null) {
-          let F = Number.POSITIVE_INFINITY, ue = Number.NEGATIVE_INFINITY;
+          let V = Number.POSITIVE_INFINITY, ue = Number.NEGATIVE_INFINITY;
           for (let T = 0; T < ve.length; T += 1) {
             const R = ve[T], K = h === "vertical" ? R.minY : R.minX, U = h === "vertical" ? R.maxY : R.maxX;
-            K < F && (F = K), U > ue && (ue = U);
+            K < V && (V = K), U > ue && (ue = U);
           }
           const N = Pe[0], D = Pe[1];
           ye.length = 0;
           for (let T = 0; T < ve.length; T += 1) {
-            const R = ve[T], K = h === "vertical" ? R.minY : R.minX, U = h === "vertical" ? R.maxY : R.maxX, Se = (K + U) * 0.5, he = Na(Se, F, ue, !0), Me = h === "vertical" ? At(N, D, he, E) : At(D, N, he, E), Te = st(Me), fe = Ie[T];
+            const R = ve[T], K = h === "vertical" ? R.minY : R.minX, U = h === "vertical" ? R.maxY : R.maxX, Se = (K + U) * 0.5, he = Na(Se, V, ue, !0), Me = h === "vertical" ? Ct(N, D, he, F) : Ct(D, N, he, F), Te = st(Me), fe = Ie[T];
             ye.push(
-              Lt(fe, Te, ce)
+              _t(fe, Te, ce)
             );
           }
         }
-        const q = _t(ye, w);
+        const q = Pt(ye, x);
         rt(d), s(q);
       };
       requestAnimationFrame(be);
@@ -520,7 +520,7 @@ const Oa = ["innerHTML"], ja = {
     segments: { type: Number, required: !0 }
   },
   setup(e) {
-    const a = e, n = C("");
+    const a = e, n = L("");
     let s = 0;
     return z(
       () => [
@@ -551,7 +551,7 @@ const Oa = ["innerHTML"], ja = {
         d === s && (n.value = h);
       },
       { immediate: !0 }
-    ), (o, d) => (f(), g("g", { innerHTML: n.value }, null, 8, Oa));
+    ), (o, d) => (f(), y("g", { innerHTML: n.value }, null, 8, Oa));
   }
 }, za = ["id"], Ya = ["id"], Xa = { style: { position: "relative" } }, Ka = ["xmlns", "viewBox", "aria-describedby"], Ua = ["width", "height"], Ha = ["id"], Za = ["stop-color"], Ja = ["stop-color"], Qa = ["id"], el = ["stop-color"], tl = ["stop-color"], al = ["id"], ll = ["stop-color"], nl = ["stop-color"], rl = ["id"], ul = ["id"], ol = ["stop-color", "offset"], sl = { key: 1 }, il = ["d", "fill"], dl = ["d", "fill"], cl = ["id", "d", "stroke-width"], vl = ["d", "stroke", "stroke-width", "stroke-dasharray"], hl = ["d", "stroke", "stroke-width"], fl = ["id", "d", "stroke-width"], pl = ["d", "stroke", "stroke-width", "stroke-dasharray"], gl = ["d", "stroke", "stroke-width"], yl = ["x", "y", "width", "height", "fill", "rx"], ml = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], bl = ["x1", "x2", "y1", "y2", "stroke", "stroke-dasharray", "stroke-width"], kl = ["cx", "cy", "r", "fill", "stroke", "stroke-width"], wl = ["x", "y", "font-size", "font-weight", "fill"], xl = ["x", "y", "height", "width", "onMouseenter", "onMouseleave", "onClick"], $l = {
   key: 0,
@@ -592,11 +592,11 @@ const Oa = ["innerHTML"], ja = {
   },
   emits: ["hoverIndex", "selectDatapoint"],
   setup(e, { emit: a }) {
-    const n = yt(() => import("./PackageVersion-1BHnPIBZ.js")), s = yt(() => import("./SparkTooltip-BorBpltj.js")), { vue_ui_sparkline: o } = ra(), { isThemeValid: d, warnInvalidTheme: h } = sa(), y = ca(), i = e, S = p(() => Array.isArray(i.dataset) && i.dataset.length > 0), v = C(Yt()), w = C(null), I = C(null), B = C(null), W = C(null), _ = C(null), t = C(re());
-    function E(l) {
+    const n = mt(() => import("./PackageVersion-B3kmPxTR.js")), s = mt(() => import("./SparkTooltip-BorBpltj.js")), { vue_ui_sparkline: o } = ra(), { isThemeValid: d, warnInvalidTheme: h } = sa(), m = ca(), i = e, S = g(() => Array.isArray(i.dataset) && i.dataset.length > 0), v = L(Yt()), x = L(null), I = L(null), B = L(null), E = L(null), A = L(null), t = L(re());
+    function F(l) {
       return i.config?.skeletonDataset && Array.isArray(i.config.skeletonDataset) ? i.config.skeletonDataset.map((u) => ({ period: "-", value: u })) : aa(l).map((u) => ({ period: "-", value: u }));
     }
-    const Pe = p(() => kt({
+    const Pe = g(() => wt({
       defaultConfig: {
         gradientPath: { show: !1 },
         temperatureColors: { show: !1 },
@@ -623,8 +623,8 @@ const Oa = ["innerHTML"], ja = {
           await te(), Me();
         });
       },
-      skeletonDataset: E(12),
-      skeletonConfig: kt({
+      skeletonDataset: F(12),
+      skeletonConfig: wt({
         defaultConfig: t.value,
         userConfig: Pe.value
       })
@@ -655,7 +655,7 @@ const Oa = ["innerHTML"], ja = {
         u = l;
       return u;
     }
-    const V = p(() => t.value?.style?.line.pulse || {}), Ne = p(() => `${Math.max(200, Number(V.value.durationMs) || 4e3) / 1e3}s`), ce = C(0), ye = p(() => V.value?.begin || "0ms"), Ie = C("0;1"), ve = p(() => V.value?.loop === !1 ? "1" : "indefinite"), me = p(() => V.value?.loop === !1 ? "freeze" : void 0), qe = p(() => V.value.trail.show && J.value.lengthPx || 1), Y = p(() => !!V.value?.show && !O.value && !y.value && !P.value && (m.value?.length || 0) > 1);
+    const W = g(() => t.value?.style?.line.pulse || {}), Ne = g(() => `${Math.max(200, Number(W.value.durationMs) || 4e3) / 1e3}s`), ce = L(0), ye = g(() => W.value?.begin || "0ms"), Ie = L("0;1"), ve = g(() => W.value?.loop === !1 ? "1" : "indefinite"), me = g(() => W.value?.loop === !1 ? "freeze" : void 0), Ge = g(() => W.value.trail.show && J.value.lengthPx || 1), Y = g(() => !!W.value?.show && !O.value && !m.value && !P.value && (p.value?.length || 0) > 1);
     function be() {
       if (!Y.value) {
         ce.value = 0;
@@ -672,13 +672,13 @@ const Oa = ["innerHTML"], ja = {
       requestAnimationFrame(() => {
         const c = l.querySelector?.(u);
         if (c && typeof c.getTotalLength == "function") {
-          const k = c.getTotalLength();
-          Number.isFinite(k) && k > 0 && (ce.value = k);
+          const w = c.getTotalLength();
+          Number.isFinite(w) && w > 0 && (ce.value = w);
         }
       });
     }
-    const G = p(() => {
-      const l = V.value?.easing || "ease-in-out", u = {
+    const G = g(() => {
+      const l = W.value?.easing || "ease-in-out", u = {
         ease: [0.25, 0.1, 0.25, 1],
         "ease-in": [0.42, 0, 1, 1],
         "ease-out": [0, 0, 0.58, 1],
@@ -694,11 +694,11 @@ const Oa = ["innerHTML"], ja = {
         keyTimes: "0;1"
       } : {
         calcMode: "spline",
-        keySplines: (l === "cubic-bezier" ? Array.isArray(V.value?.cubicBezier) && V.value.cubicBezier.length === 4 ? V.value.cubicBezier : [0.4, 0, 0.2, 1] : u[l] || u["ease-in-out"]).join(" "),
+        keySplines: (l === "cubic-bezier" ? Array.isArray(W.value?.cubicBezier) && W.value.cubicBezier.length === 4 ? W.value.cubicBezier : [0.4, 0, 0.2, 1] : u[l] || u["ease-in-out"]).join(" "),
         keyTimes: "0;1"
       };
-    }), J = p(() => {
-      const l = V.value?.trail || {}, u = t.value.style.line.strokeWidth || 1;
+    }), J = g(() => {
+      const l = W.value?.trail || {}, u = t.value.style.line.strokeWidth || 1;
       return {
         show: l.show !== !1,
         lengthPx: l.length,
@@ -707,14 +707,14 @@ const Oa = ["innerHTML"], ja = {
         fadeIn: 0.5,
         fadeOut: 0.2
       };
-    }), q = p(() => Qe({
+    }), q = g(() => Qe({
       data: de.value,
       threshold: t.value.downsample.threshold
     }));
     z(() => i.config, (l) => {
-      P.value || (t.value = re()), vt(), x.value.chartWidth = t.value.style.chartWidth;
+      P.value || (t.value = re()), vt(), $.value.chartWidth = t.value.style.chartWidth;
     }, { deep: !0 }), z(() => i.dataset, (l) => {
-      Array.isArray(l) && l.length > 0 && (ne.value = !1), F.value = Qe({
+      Array.isArray(l) && l.length > 0 && (ne.value = !1), V.value = Qe({
         data: de.value.map((u) => ({
           ...u,
           value: [void 0].includes(u.value) ? null : u.value
@@ -722,7 +722,7 @@ const Oa = ["innerHTML"], ja = {
         threshold: t.value.downsample.threshold
       });
     }, { deep: !0 });
-    const F = C(ue());
+    const V = L(ue());
     function ue() {
       return Qe({
         data: de.value.map((l) => t.value.style.animation.show && de.value.length > 1 ? {
@@ -735,8 +735,8 @@ const Oa = ["innerHTML"], ja = {
         threshold: t.value.downsample.threshold
       });
     }
-    const N = mt(null), D = mt(null), T = C(!1), R = C(0), K = C([]), U = C(""), Se = p(() => {
-      const u = (q.value || []).map((k) => `${k.period}::${Number.isFinite(k.value) ? k.value : 0}`).join("|"), r = t.value?.style?.animation || {}, c = !!t.value?.gradientPath?.show && !t.value.temperatureColors.show;
+    const N = bt(null), D = bt(null), T = L(!1), R = L(0), K = L([]), U = L(""), Se = g(() => {
+      const u = (q.value || []).map((w) => `${w.period}::${Number.isFinite(w.value) ? w.value : 0}`).join("|"), r = t.value?.style?.animation || {}, c = !!t.value?.gradientPath?.show && !t.value.temperatureColors.show;
       return `${u}#${!!r.show}#${r.animationFrames || 0}#${c}`;
     });
     function he() {
@@ -744,39 +744,39 @@ const Oa = ["innerHTML"], ja = {
     }
     function Me() {
       const l = t.value?.style?.animation || {}, u = q.value || [], r = Se.value, c = !!t.value.gradientPath.show && !t.value.temperatureColors.show;
-      if (r && r === U.value && (T.value || F.value.length === u.length))
+      if (r && r === U.value && (T.value || V.value.length === u.length))
         return;
       if (he(), c || !l.show || P.value || u.length <= 1) {
-        F.value = u, U.value = r;
+        V.value = u, U.value = r;
         return;
       }
-      T.value = !0, U.value = r, F.value = [];
-      const k = Math.max(1, Number(l.animationFrames) || 1), He = Math.max(1, Math.floor(k / u.length));
+      T.value = !0, U.value = r, V.value = [];
+      const w = Math.max(1, Number(l.animationFrames) || 1), He = Math.max(1, Math.floor(w / u.length));
       let ee = 0;
-      const De = () => {
+      const Ee = () => {
         if (r !== Se.value) {
           he();
           return;
         }
         if (ee < u.length) {
-          F.value.push(u[ee]);
-          const Ee = setTimeout(() => {
-            R.value = requestAnimationFrame(De);
+          V.value.push(u[ee]);
+          const Fe = setTimeout(() => {
+            R.value = requestAnimationFrame(Ee);
           }, He);
-          K.value.push(Ee), ee += 1;
+          K.value.push(Fe), ee += 1;
         } else
-          F.value = u, he();
+          V.value = u, he();
       };
-      R.value = requestAnimationFrame(De);
+      R.value = requestAnimationFrame(Ee);
     }
     z(Se, () => {
       Me();
-    }), bt(() => {
+    }), kt(() => {
       vt(), Me();
     }), ot(() => {
       he();
     });
-    const Te = C(0);
+    const Te = L(0);
     z(
       () => P.value,
       async (l) => {
@@ -788,13 +788,13 @@ const Oa = ["innerHTML"], ja = {
         l || P.value || (await te(), Te.value += 1);
       }
     );
-    const fe = p(() => `sparkline_line_path_${v.value}`), Ge = C(!0);
+    const fe = g(() => `sparkline_line_path_${v.value}`), Oe = L(!0);
     async function dt() {
-      Ge.value = !1, await te(), Ge.value = !0, await te(), be();
+      Oe.value = !1, await te(), Oe.value = !0, await te(), be();
     }
-    const ct = p(() => !!t.value.debug);
+    const ct = g(() => !!t.value.debug);
     function vt() {
-      if (wt(i.dataset) ? (xt({
+      if (xt(i.dataset) ? ($t({
         componentName: "VueUiSparkline",
         type: "dataset",
         debug: ct.value
@@ -803,7 +803,7 @@ const Oa = ["innerHTML"], ja = {
           datasetObject: l,
           requiredAttributes: ["period", "value"]
         }).forEach((r) => {
-          xt({
+          $t({
             componentName: "VueUiSparkline",
             type: "datasetSerieAttribute",
             property: r,
@@ -811,47 +811,47 @@ const Oa = ["innerHTML"], ja = {
             debug: ct.value
           });
         });
-      }), wt(i.dataset) || (ne.value = t.value.loading), t.value.responsive) {
+      }), xt(i.dataset) || (ne.value = t.value.loading), t.value.responsive) {
         const l = la(() => {
           const { width: u, height: r } = na({
-            chart: w.value,
+            chart: x.value,
             title: t.value.style.title.show && i.showInfo ? I.value : null,
             source: B.value
           });
           requestAnimationFrame(() => {
-            x.value.width = u, x.value.height = r, x.value.chartWidth = t.value.style.chartWidth / 500 * u, x.value.padding = i.forcedPadding / 500 * u;
+            $.value.width = u, $.value.height = r, $.value.chartWidth = t.value.style.chartWidth / 500 * u, $.value.padding = i.forcedPadding / 500 * u;
           });
         });
-        N.value && (D.value && N.value.unobserve(D.value), N.value.disconnect()), N.value = new ResizeObserver(l), D.value = w.value.parentNode, N.value.observe(D.value);
+        N.value && (D.value && N.value.unobserve(D.value), N.value.disconnect()), N.value = new ResizeObserver(l), D.value = x.value.parentNode, N.value.observe(D.value);
       }
     }
     ot(() => {
       N.value && (D.value && N.value.unobserve(D.value), N.value.disconnect());
     });
-    const x = C({
+    const $ = L({
       height: 80 * i.heightRatio,
       width: 500,
       chartWidth: t.value.style.chartWidth,
       padding: i.forcedPadding
-    }), Re = a, A = p(() => {
+    }), Re = a, C = g(() => {
       const { top: l, right: u, bottom: r, left: c } = t.value.style.padding;
       return {
         top: l,
         left: c,
-        right: x.value.width - u,
-        bottom: x.value.height - r,
-        start: i.showInfo && t.value.style.dataLabel.show && t.value.style.dataLabel.position === "left" ? x.value.width - x.value.chartWidth + c : x.value.padding + c,
-        width: i.showInfo && t.value.style.dataLabel.show ? x.value.chartWidth - c - u : x.value.width - x.value.padding - c - u,
-        height: x.value.height - l - r
+        right: $.value.width - u,
+        bottom: $.value.height - r,
+        start: i.showInfo && t.value.style.dataLabel.show && t.value.style.dataLabel.position === "left" ? $.value.width - $.value.chartWidth + c : $.value.padding + c,
+        width: i.showInfo && t.value.style.dataLabel.show ? $.value.chartWidth - c - u : $.value.width - $.value.padding - c - u,
+        height: $.value.height - l - r
       };
-    }), Oe = p(() => [null, void 0].includes(t.value.style.scaleMin) ? Math.min(...F.value.map((l) => isNaN(l.value) || [void 0, null, "NaN", NaN, 1 / 0, -1 / 0].includes(l.value) ? 0 : l.value || 0)) : t.value.style.scaleMin), Pt = p(() => [null, void 0].includes(t.value.style.scaleMax) ? Math.max(...F.value.map((l) => isNaN(l.value) || [void 0, null, "NaN", NaN, 1 / 0, -1 / 0].includes(l.value) ? 0 : l.value || 0)) : t.value.style.scaleMax), Ae = p(() => {
-      const l = Oe.value >= 0 ? 0 : Oe.value;
+    }), je = g(() => [null, void 0].includes(t.value.style.scaleMin) ? Math.min(...V.value.map((l) => isNaN(l.value) || [void 0, null, "NaN", NaN, 1 / 0, -1 / 0].includes(l.value) ? 0 : l.value || 0)) : t.value.style.scaleMin), Nt = g(() => [null, void 0].includes(t.value.style.scaleMax) ? Math.max(...V.value.map((l) => isNaN(l.value) || [void 0, null, "NaN", NaN, 1 / 0, -1 / 0].includes(l.value) ? 0 : l.value || 0)) : t.value.style.scaleMax), Ae = g(() => {
+      const l = je.value >= 0 ? 0 : je.value;
       return Math.abs(l);
-    }), ht = p(() => Pt.value + Ae.value), ke = p(() => A.value.bottom - A.value.height * je(Ae.value));
-    function je(l) {
+    }), ht = g(() => Nt.value + Ae.value), ke = g(() => C.value.bottom - C.value.height * ze(Ae.value));
+    function ze(l) {
       return isNaN(l / ht.value) ? 0 : l / ht.value;
     }
-    const we = p(() => q.value.length - 1 || 1), Ce = C([]);
+    const we = g(() => q.value.length - 1 || 1), Ce = L([]);
     let ft = 0;
     Gt(() => {
       const l = ++ft;
@@ -866,44 +866,44 @@ const Oa = ["innerHTML"], ja = {
         l === ft && (Ce.value = u);
       })();
     });
-    const m = p(() => F.value.map((l, u) => {
-      const r = isNaN(l.value) || [void 0, null, "NaN", NaN, 1 / 0, -1 / 0].includes(l.value) ? 0 : l.value || 0, c = A.value.width / we.value;
+    const p = g(() => V.value.map((l, u) => {
+      const r = isNaN(l.value) || [void 0, null, "NaN", NaN, 1 / 0, -1 / 0].includes(l.value) ? 0 : l.value || 0, c = C.value.width / we.value;
       return {
         value: l.value,
         absoluteValue: r,
         period: Ce.value && Ce.value[u] && Ce.value[u].text ? Ce.value[u].text : l.period,
         plotValue: r + Ae.value,
-        toMax: je(r + Ae.value),
-        x: A.value.start + u * c,
-        y: A.value.bottom - A.value.height * je(r + Ae.value),
+        toMax: ze(r + Ae.value),
+        x: C.value.start + u * c,
+        y: C.value.bottom - C.value.height * ze(r + Ae.value),
         id: `plot_${v.value}_${u}`,
-        color: O.value ? t.value.style.bar.color : t.value.style.area.useGradient ? Fe(t.value.style.line.color, 0.05 * (1 - u / we.value)) : t.value.style.line.color,
+        color: O.value ? t.value.style.bar.color : t.value.style.area.useGradient ? Ve(t.value.style.line.color, 0.05 * (1 - u / we.value)) : t.value.style.line.color,
         width: c
       };
-    })), Nt = p(() => i.selectedIndex !== void 0 && i.selectedIndex !== null && i.selectedIndex >= 0 && i.selectedIndex < m.value.length ? i.selectedIndex : _.value !== void 0 && _.value !== null && _.value >= 0 && _.value < m.value.length ? _.value : null), It = p(() => {
-      const l = { x: m.value[0].x || 0, y: (x.value.height || 0) - 6 }, u = { x: m.value[m.value.length - 1].x || 0, y: (x.value.height || 0) - 6 }, r = [];
-      return m.value.forEach((c) => {
+    })), pt = g(() => i.selectedIndex !== void 0 && i.selectedIndex !== null && i.selectedIndex >= 0 && i.selectedIndex < p.value.length ? i.selectedIndex : A.value !== void 0 && A.value !== null && A.value >= 0 && A.value < p.value.length ? A.value : null), It = g(() => {
+      const l = { x: p.value[0].x || 0, y: ($.value.height || 0) - 6 }, u = { x: p.value[p.value.length - 1].x || 0, y: ($.value.height || 0) - 6 }, r = [];
+      return p.value.forEach((c) => {
         r.push(`${c.x || 0},${c.y || 0} `);
       }), [l.x, l.y, ...r, u.x, u.y].toString();
-    }), $ = C(void 0), oe = C(void 0);
-    function ze(l, u) {
-      t.value.events.datapointEnter && t.value.events.datapointEnter({ datapoint: l, seriesIndex: u }), _.value = u, W.value = u, $.value = l, oe.value || (oe.value = l), Re("hoverIndex", { index: u });
+    }), k = L(void 0), oe = L(void 0);
+    function Ye(l, u) {
+      t.value.events.datapointEnter && t.value.events.datapointEnter({ datapoint: l, seriesIndex: u }), A.value = u, E.value = u, k.value = l, oe.value || (oe.value = l), Re("hoverIndex", { index: u });
     }
     function Tt(l, u) {
-      t.value.events.datapointLeave && t.value.events.datapointLeave({ datapoint: l, seriesIndex: u }), oe.value = $.value, $.value = void 0, _.value = null, W.value = null, Re("hoverIndex", { index: void 0 });
+      t.value.events.datapointLeave && t.value.events.datapointLeave({ datapoint: l, seriesIndex: u }), oe.value = k.value, k.value = void 0, A.value = null, E.value = null, Re("hoverIndex", { index: void 0 });
     }
-    const se = p(() => {
+    const se = g(() => {
       if (S.value) {
-        const l = m.value.map((r) => r.absoluteValue), u = l.reduce((r, c) => r + c, 0);
+        const l = p.value.map((r) => r.absoluteValue), u = l.reduce((r, c) => r + c, 0);
         return {
-          latest: m.value[m.value.length - 1] ? m.value[m.value.length - 1].absoluteValue : 0,
+          latest: p.value[p.value.length - 1] ? p.value[p.value.length - 1].absoluteValue : 0,
           sum: u,
-          average: u / m.value.length,
+          average: u / p.value.length,
           median: Ut(l),
-          trend: Kt(m.value.map(({ x: r, y: c, absoluteValue: k }) => ({
+          trend: Kt(p.value.map(({ x: r, y: c, absoluteValue: w }) => ({
             x: r,
             y: c,
-            value: k
+            value: w
           }))).trend
         };
       } else
@@ -914,31 +914,31 @@ const Oa = ["innerHTML"], ja = {
           median: null,
           trend: null
         };
-    }), pt = p(() => S.value ? t.value.style.dataLabel.valueType === "latest" ? se.value.latest : t.value.style.dataLabel.valueType === "sum" ? se.value.sum : t.value.style.dataLabel.valueType === "average" ? se.value.average : 0 : 0), O = p(() => t.value.type && t.value.type === "bar");
+    }), gt = g(() => S.value ? t.value.style.dataLabel.valueType === "latest" ? se.value.latest : t.value.style.dataLabel.valueType === "sum" ? se.value.sum : t.value.style.dataLabel.valueType === "average" ? se.value.average : 0 : 0), O = g(() => t.value.type && t.value.type === "bar");
     function Rt(l, u) {
       t.value.events.datapointClick && t.value.events.datapointClick({ datapoint: l, seriesIndex: u }), Re("selectDatapoint", { datapoint: l, index: u });
     }
-    const Be = p(() => Array.isArray(t.value.style.line.dashIndices) && t.value.style.line.dashIndices.length > 0), Ye = p(() => O.value ? "" : $t(m.value)), Xe = p(() => O.value ? "" : Ht(m.value)), Bt = p(() => O.value || !Be.value ? [] : Zt(
-      m.value,
+    const Be = g(() => Array.isArray(t.value.style.line.dashIndices) && t.value.style.line.dashIndices.length > 0), Xe = g(() => O.value ? "" : St(p.value)), Ke = g(() => O.value ? "" : Ht(p.value)), Bt = g(() => O.value || !Be.value ? [] : Zt(
+      p.value,
       t.value.style.line.dashIndices
-    )), Dt = p(() => O.value || !Be.value ? [] : Jt(
-      m.value,
+    )), Dt = g(() => O.value || !Be.value ? [] : Jt(
+      p.value,
       t.value.style.line.dashIndices
-    )), gt = p(() => O.value || !t.value.gradientPath.show || t.value.temperatureColors.show ? "" : `M ${(t.value.style.line.smooth ? Ye.value : Xe.value) || "0,0"}`), Q = p(() => !t.value.temperatureColors.show || t.value.temperatureColors.colors.length === 0 ? null : t.value.temperatureColors.colors.map((l) => Qt(l)));
+    )), yt = g(() => O.value || !t.value.gradientPath.show || t.value.temperatureColors.show ? "" : `M ${(t.value.style.line.smooth ? Xe.value : Ke.value) || "0,0"}`), Q = g(() => !t.value.temperatureColors.show || t.value.temperatureColors.colors.length === 0 ? null : t.value.temperatureColors.colors.map((l) => Qt(l)));
     z(
       () => [
         Y.value,
         fe.value,
-        m.value.length,
-        x.value.width,
-        x.value.height,
+        p.value.length,
+        $.value.width,
+        $.value.height,
         t.value?.style?.line?.smooth
       ],
       async () => {
         await te(), be();
       },
       { immediate: !0 }
-    ), bt(async () => {
+    ), kt(async () => {
       await te(), be();
     }), z(
       () => P.value,
@@ -953,42 +953,54 @@ const Oa = ["innerHTML"], ja = {
     ), z(
       () => i.selectedIndex,
       (l) => {
-        if (l == null || l < 0 || l >= m.value.length) return;
-        const u = m.value[l];
-        u && (_.value = l, W.value = l, $.value = u);
+        if (l == null) {
+          A.value = null, E.value = null, k.value = void 0;
+          return;
+        }
+        if (l < 0 || l >= p.value.length) return;
+        const u = p.value[l];
+        u && (A.value = l, E.value = l, k.value = u);
       }
     );
-    const Ke = C(!1);
+    const De = L(!1);
     function Et() {
-      W.value = null, $.value || ze(m.value.at(-1), m.value.length - 1), Ke.value = !0;
+      const l = pt.value;
+      if (l !== null && l >= 0 && l < p.value.length) {
+        const u = p.value[l];
+        if (u) {
+          E.value = l, k.value = u, A.value = l, De.value = !0;
+          return;
+        }
+      }
+      E.value = null, !k.value && p.value.length && Ye(p.value.at(-1), p.value.length - 1), De.value = !0;
     }
     function Ft() {
-      W.value = null, oe.value = $.value, $.value = void 0, Re("hoverIndex", { index: void 0 }), Ke.value = !1;
+      oe.value = k.value, (i.selectedIndex === void 0 || i.selectedIndex === null) && (E.value = null, k.value = void 0, A.value = null, Re("hoverIndex", { index: void 0 })), De.value = !1;
     }
     function Vt(l) {
       if (!X.value || document.activeElement !== X.value) return;
-      oe.value = $.value;
+      oe.value = k.value;
       const u = l.key === "ArrowLeft", r = l.key === "ArrowRight";
       if (!u && !r) return;
-      const c = m.value.length;
+      const c = p.value.length;
       if (!c) return;
       l.preventDefault(), l.stopPropagation();
-      let k = W.value;
-      const He = k !== null && k >= 0 && k < c, ee = $.value ? m.value.findIndex((Wt) => Wt.id === $.value.id) : -1, De = ee !== null && ee >= 0 && ee < c;
-      He ? r ? (k += 1, k >= c && (k = 0)) : u && (k -= 1, k < 0 && (k = c - 1)) : De ? (k = r ? ee + 1 : ee - 1, k >= c && (k = 0), k < 0 && (k = c - 1)) : r ? k = 0 : k = c - 1;
-      const Ee = m.value[k];
-      Ee && (W.value = k, ze(Ee, k));
+      let w = E.value;
+      const He = w !== null && w >= 0 && w < c, ee = k.value ? p.value.findIndex((Wt) => Wt.id === k.value.id) : -1, Ee = ee !== null && ee >= 0 && ee < c;
+      He ? r ? (w += 1, w >= c && (w = 0)) : u && (w -= 1, w < 0 && (w = c - 1)) : Ee ? (w = r ? ee + 1 : ee - 1, w >= c && (w = 0), w < 0 && (w = c - 1)) : r ? w = 0 : w = c - 1;
+      const Fe = p.value[w];
+      Fe && (E.value = w, Ye(Fe, w));
     }
-    const Ue = p(() => {
+    const Ue = g(() => {
       const l = [
         t.value.translations.period,
         t.value.translations.value
-      ], u = m.value.map((r) => [r.period, r.absoluteValue]);
+      ], u = p.value.map((r) => [r.period, r.absoluteValue]);
       return { headers: l, rows: u };
     });
-    return (l, u) => (f(), g("div", {
+    return (l, u) => (f(), y("div", {
       ref_key: "sparklineChart",
-      ref: w,
+      ref: x,
       class: "vue-data-ui-component vue-ui-sparkline",
       id: v.value,
       style: H(`width:100%;font-family:${t.value.style.fontFamily};`)
@@ -1004,16 +1016,16 @@ const Oa = ["innerHTML"], ja = {
         body: Ue.value.rows,
         notice: t.value.a11y.translations.tableAvailable,
         caption: t.value.a11y.translations.tableCaption
-      }, null, 8, ["uid", "head", "body", "notice", "caption"])) : L("", !0),
+      }, null, 8, ["uid", "head", "body", "notice", "caption"])) : _("", !0),
       pe(l.$slots, "before", Ze(Je({
-        selected: $.value,
+        selected: k.value,
         latest: se.value.latest,
         sum: se.value.sum,
         average: se.value.average,
         median: se.value.median,
         trend: se.value.trend
       })), void 0, !0),
-      t.value.style.title.show && e.showInfo ? (f(), g("div", {
+      t.value.style.title.show && e.showInfo ? (f(), y("div", {
         key: 1,
         ref_key: "chartTitle",
         ref: I,
@@ -1022,14 +1034,14 @@ const Oa = ["innerHTML"], ja = {
       }, [
         M("span", {
           style: H(`padding:${t.value.style.title.textAlign === "left" ? "0 0 0 12px" : t.value.style.title.textAlign === "right" ? "0 12px 0 0" : "0"}`)
-        }, Le($.value ? $.value.period : t.value.style.title.text), 5)
-      ], 4)) : L("", !0),
+        }, Le(k.value ? k.value.period : t.value.style.title.text), 5)
+      ], 4)) : _("", !0),
       M("div", Xa, [
-        (f(), g("svg", {
+        (f(), y("svg", {
           ref_key: "svgRef",
           ref: X,
           xmlns: b(ea),
-          viewBox: `0 0 ${x.value.width} ${x.value.height}`,
+          viewBox: `0 0 ${$.value.width} ${$.value.height}`,
           style: H(`background:${t.value.style.backgroundColor};overflow:visible;direction:ltr`),
           tabindex: "0",
           "aria-describedby": `chart-instructions-${v.value}`,
@@ -1039,18 +1051,18 @@ const Oa = ["innerHTML"], ja = {
           onKeydown: Vt
         }, [
           Ot(b(n)),
-          l.$slots["chart-background"] ? (f(), g("foreignObject", {
+          l.$slots["chart-background"] ? (f(), y("foreignObject", {
             key: 0,
             x: 0,
             y: 0,
-            width: x.value.width <= 0 ? 10 : x.value.width,
-            height: x.value.height <= 0 ? 10 : x.value.height,
+            width: $.value.width <= 0 ? 10 : $.value.width,
+            height: $.value.height <= 0 ? 10 : $.value.height,
             style: {
               pointerEvents: "none"
             }
           }, [
             pe(l.$slots, "chart-background", {}, void 0, !0)
-          ], 8, Ua)) : L("", !0),
+          ], 8, Ua)) : _("", !0),
           M("defs", null, [
             M("linearGradient", {
               x1: "0%",
@@ -1061,11 +1073,11 @@ const Oa = ["innerHTML"], ja = {
             }, [
               M("stop", {
                 offset: "0%",
-                "stop-color": b(Ve)(b(Fe)(t.value.style.area.color, 0.05), t.value.style.area.opacity)
+                "stop-color": b(We)(b(Ve)(t.value.style.area.color, 0.05), t.value.style.area.opacity)
               }, null, 8, Za),
               M("stop", {
                 offset: "100%",
-                "stop-color": b(Ve)(t.value.style.area.color, t.value.style.area.opacity)
+                "stop-color": b(We)(t.value.style.area.color, t.value.style.area.opacity)
               }, null, 8, Ja)
             ], 8, Ha),
             M("linearGradient", {
@@ -1079,7 +1091,7 @@ const Oa = ["innerHTML"], ja = {
               }, null, 8, el),
               M("stop", {
                 offset: "100%",
-                "stop-color": b(Fe)(t.value.style.bar.color, 0.05)
+                "stop-color": b(Ve)(t.value.style.bar.color, 0.05)
               }, null, 8, tl)
             ], 8, Qa),
             M("linearGradient", {
@@ -1089,7 +1101,7 @@ const Oa = ["innerHTML"], ja = {
             }, [
               M("stop", {
                 offset: "0%",
-                "stop-color": b(Fe)(t.value.style.bar.color, 0.05)
+                "stop-color": b(Ve)(t.value.style.bar.color, 0.05)
               }, null, 8, ll),
               M("stop", {
                 offset: "100%",
@@ -1114,52 +1126,52 @@ const Oa = ["innerHTML"], ja = {
                 M("feMergeNode", { in: "SourceGraphic" })
               ], -1)
             ])], 8, rl),
-            t.value.temperatureColors.show && Q.value ? (f(), g("linearGradient", {
+            t.value.temperatureColors.show && Q.value ? (f(), y("linearGradient", {
               key: 0,
               id: `temperature_grad_sparkline_${v.value}`,
               gradientTransform: "rotate(90)"
             }, [
-              (f(!0), g(Z, null, ge(Q.value, (r, c) => (f(), g("stop", {
+              (f(!0), y(Z, null, ge(Q.value, (r, c) => (f(), y("stop", {
                 key: `temperature_grad_stop_${c}_${v.value}`,
                 "stop-color": r,
                 offset: b(ta)(c, Q.value.length)
               }, null, 8, ol))), 128))
-            ], 8, ul)) : L("", !0)
+            ], 8, ul)) : _("", !0)
           ]),
-          t.value.style.area.show && !O.value && m.value[0] && m.value.length > 1 ? (f(), g("g", sl, [
-            t.value.style.line.smooth ? (f(), g("path", {
+          t.value.style.area.show && !O.value && p.value[0] && p.value.length > 1 ? (f(), y("g", sl, [
+            t.value.style.line.smooth ? (f(), y("path", {
               key: 0,
               class: "vue-ui-sparkline-area",
-              d: `M ${m.value[0].x},${A.value.bottom} ${b($t)(m.value)} L ${m.value.at(-1).x},${A.value.bottom} Z`,
-              fill: t.value.style.area.useGradient ? `url(#sparkline_gradient_${v.value})` : b(Ve)(t.value.style.area.color, t.value.style.area.opacity),
+              d: `M ${p.value[0].x},${C.value.bottom} ${b(St)(p.value)} L ${p.value.at(-1).x},${C.value.bottom} Z`,
+              fill: t.value.style.area.useGradient ? `url(#sparkline_gradient_${v.value})` : b(We)(t.value.style.area.color, t.value.style.area.opacity),
               "stroke-linecap": "round",
               "stroke-linejoin": "round",
               style: H({
                 transition: b(P) ? void 0 : "all 0.2s"
               })
-            }, null, 12, il)) : (f(), g("path", {
+            }, null, 12, il)) : (f(), y("path", {
               key: 1,
               class: "vue-ui-sparkline-area",
               d: `M${It.value}Z`,
-              fill: t.value.style.area.useGradient ? `url(#sparkline_gradient_${v.value})` : b(Ve)(t.value.style.area.color, t.value.style.area.opacity),
+              fill: t.value.style.area.useGradient ? `url(#sparkline_gradient_${v.value})` : b(We)(t.value.style.area.color, t.value.style.area.opacity),
               "stroke-linecap": "round",
               "stroke-linejoin": "round",
               style: H({
                 transition: b(P) ? void 0 : "all 0.2s"
               })
             }, null, 12, dl))
-          ])) : L("", !0),
-          t.value.style.line.smooth && !O.value ? (f(), g(Z, { key: 2 }, [
+          ])) : _("", !0),
+          t.value.style.line.smooth && !O.value ? (f(), y(Z, { key: 2 }, [
             M("path", {
               id: fe.value,
-              d: `M ${Ye.value || "0,0"}`,
+              d: `M ${Xe.value || "0,0"}`,
               fill: "none",
               stroke: "transparent",
               "stroke-width": t.value.style.line.strokeWidth,
               "stroke-linecap": "round",
               "stroke-linejoin": "round"
             }, null, 8, cl),
-            Be.value ? (f(!0), g(Z, { key: 0 }, ge(Bt.value, (r) => (f(), g("path", {
+            Be.value ? (f(!0), y(Z, { key: 0 }, ge(Bt.value, (r) => (f(), y("path", {
               key: r.path,
               class: "vue-ui-sparkline-path",
               d: `M ${r.path}`,
@@ -1172,10 +1184,10 @@ const Oa = ["innerHTML"], ja = {
               style: H({
                 transition: b(P) ? void 0 : "all 0.2s"
               })
-            }, null, 12, vl))), 128)) : (f(), g("path", {
+            }, null, 12, vl))), 128)) : (f(), y("path", {
               key: 1,
               class: "vue-ui-sparkline-path",
-              d: `M ${Ye.value || "0,0"}`,
+              d: `M ${Xe.value || "0,0"}`,
               stroke: Q.value ? `url(#temperature_grad_sparkline_${v.value})` : t.value.style.line.color,
               fill: "none",
               "stroke-width": t.value.style.line.strokeWidth,
@@ -1185,18 +1197,18 @@ const Oa = ["innerHTML"], ja = {
                 transition: b(P) ? void 0 : "all 0.2s"
               })
             }, null, 12, hl))
-          ], 64)) : L("", !0),
-          !t.value.style.line.smooth && !O.value ? (f(), g(Z, { key: 3 }, [
+          ], 64)) : _("", !0),
+          !t.value.style.line.smooth && !O.value ? (f(), y(Z, { key: 3 }, [
             M("path", {
               id: fe.value,
-              d: `M ${Xe.value || "0,0"}`,
+              d: `M ${Ke.value || "0,0"}`,
               fill: "none",
               stroke: "transparent",
               "stroke-width": t.value.style.line.strokeWidth,
               "stroke-linecap": "round",
               "stroke-linejoin": "round"
             }, null, 8, fl),
-            Be.value ? (f(!0), g(Z, { key: 0 }, ge(Dt.value, (r) => (f(), g("path", {
+            Be.value ? (f(!0), y(Z, { key: 0 }, ge(Dt.value, (r) => (f(), y("path", {
               key: r.path,
               class: "vue-ui-sparkline-path",
               d: `M ${r.path}`,
@@ -1209,10 +1221,10 @@ const Oa = ["innerHTML"], ja = {
               style: H({
                 transition: b(P) ? void 0 : "all 0.2s"
               })
-            }, null, 12, pl))), 128)) : (f(), g("path", {
+            }, null, 12, pl))), 128)) : (f(), y("path", {
               key: 1,
               class: "vue-ui-sparkline-path",
-              d: `M ${Xe.value || "0,0"}`,
+              d: `M ${Ke.value || "0,0"}`,
               stroke: Q.value ? `url(#temperature_grad_sparkline_${v.value})` : t.value.style.line.color,
               fill: "none",
               "stroke-width": t.value.style.line.strokeWidth,
@@ -1222,17 +1234,17 @@ const Oa = ["innerHTML"], ja = {
                 transition: b(P) ? void 0 : "all 0.2s"
               })
             }, null, 12, gl))
-          ], 64)) : L("", !0),
-          gt.value && !Q.value ? (f(), _e(ja, {
+          ], 64)) : _("", !0),
+          yt.value && !Q.value ? (f(), _e(ja, {
             key: 4,
-            svgPathData: gt.value,
+            svgPathData: yt.value,
             enabled: t.value.gradientPath.show && !O.value && !Q.value,
             strokeWidth: t.value.style.line.strokeWidth,
             highColor: t.value.gradientPath.colors.high,
             lowColor: t.value.gradientPath.colors.low,
             segments: t.value.gradientPath.segments
-          }, null, 8, ["svgPathData", "enabled", "strokeWidth", "highColor", "lowColor", "segments"])) : L("", !0),
-          Ge.value && Y.value ? (f(), _e(Sa, {
+          }, null, 8, ["svgPathData", "enabled", "strokeWidth", "highColor", "lowColor", "segments"])) : _("", !0),
+          Oe.value && Y.value ? (f(), _e(Sa, {
             key: 5,
             uid: v.value,
             svgRef: b(X),
@@ -1244,15 +1256,15 @@ const Oa = ["innerHTML"], ja = {
             pulseFillMode: me.value,
             pulseKeyPoints: Ie.value,
             pulseMotion: G.value,
-            pulse: V.value,
+            pulse: W.value,
             pulseTrail: J.value,
-            pulseTrailLength: qe.value,
-            prefersReducedMotion: b(y),
+            pulseTrailLength: Ge.value,
+            prefersReducedMotion: b(m),
             loading: b(P),
             isBar: O.value
-          }, null, 8, ["uid", "svgRef", "pulsePathId", "pulsePathLength", "pulseDur", "pulseBegin", "pulseRepeatCount", "pulseFillMode", "pulseKeyPoints", "pulseMotion", "pulse", "pulseTrail", "pulseTrailLength", "prefersReducedMotion", "loading", "isBar"])) : L("", !0),
-          (f(!0), g(Z, null, ge(m.value, (r, c) => (f(), g("g", null, [
-            O.value ? (f(), g("rect", {
+          }, null, 8, ["uid", "svgRef", "pulsePathId", "pulsePathLength", "pulseDur", "pulseBegin", "pulseRepeatCount", "pulseFillMode", "pulseKeyPoints", "pulseMotion", "pulse", "pulseTrail", "pulseTrailLength", "prefersReducedMotion", "loading", "isBar"])) : _("", !0),
+          (f(!0), y(Z, null, ge(p.value, (r, c) => (f(), y("g", null, [
+            O.value ? (f(), y("rect", {
               key: 0,
               x: r.x - r.width / 2,
               y: isNaN(r.absoluteValue > 0 ? r.y : ke.value) ? 0 : r.absoluteValue > 0 ? r.y : ke.value,
@@ -1260,32 +1272,32 @@ const Oa = ["innerHTML"], ja = {
               height: isNaN(Math.abs(r.y - ke.value)) ? 0 : Math.abs(r.y - ke.value),
               fill: r.absoluteValue > 0 ? `url(#sparkline_bar_gradient_pos_${v.value})` : `url(#sparkline_bar_gradient_neg_${v.value})`,
               rx: t.value.style.bar.borderRadius
-            }, null, 8, yl)) : L("", !0),
-            t.value.style.verticalIndicator.show && ($.value && r.id === $.value.id || Nt.value === c) ? (f(), g("line", {
+            }, null, 8, yl)) : _("", !0),
+            t.value.style.verticalIndicator.show && (k.value && r.id === k.value.id || pt.value === c) ? (f(), y("line", {
               key: 1,
               x1: r.x,
               x2: r.x,
-              y1: A.value.top - 6,
-              y2: A.value.bottom,
+              y1: C.value.top - 6,
+              y2: C.value.bottom,
               stroke: t.value.style.verticalIndicator.color || r.color,
               "stroke-width": t.value.style.verticalIndicator.strokeWidth,
               "stroke-linecap": "round",
               "stroke-dasharray": t.value.style.verticalIndicator.strokeDasharray || 0
-            }, null, 8, ml)) : L("", !0)
+            }, null, 8, ml)) : _("", !0)
           ]))), 256)),
-          Oe.value < 0 ? (f(), g("line", {
+          je.value < 0 ? (f(), y("line", {
             key: 6,
-            x1: A.value.start,
-            x2: A.value.start + A.value.width,
-            y1: b(St)(ke.value, A.value.bottom),
-            y2: b(St)(ke.value, A.value.bottom),
+            x1: C.value.start,
+            x2: C.value.start + C.value.width,
+            y1: b(Mt)(ke.value, C.value.bottom),
+            y2: b(Mt)(ke.value, C.value.bottom),
             stroke: t.value.style.zeroLine.color,
             "stroke-dasharray": t.value.style.zeroLine.strokeWidth * 2,
             "stroke-width": t.value.style.zeroLine.strokeWidth,
             "stroke-linecap": "round"
-          }, null, 8, bl)) : L("", !0),
-          t.value.style.plot.show ? (f(!0), g(Z, { key: 7 }, ge(m.value, (r, c) => (f(), g("g", null, [
-            $.value && r.id === $.value.id || e.selectedIndex === c || b(de).length === 1 ? (f(), g("circle", {
+          }, null, 8, bl)) : _("", !0),
+          t.value.style.plot.show ? (f(!0), y(Z, { key: 7 }, ge(p.value, (r, c) => (f(), y("g", null, [
+            k.value && r.id === k.value.id || e.selectedIndex === c || b(de).length === 1 ? (f(), y("circle", {
               key: 0,
               cx: r.x,
               cy: r.y,
@@ -1293,45 +1305,45 @@ const Oa = ["innerHTML"], ja = {
               fill: r.color,
               stroke: t.value.style.plot.stroke,
               "stroke-width": t.value.style.plot.strokeWidth
-            }, null, 8, kl)) : L("", !0)
-          ]))), 256)) : L("", !0),
-          e.showInfo && t.value.style.dataLabel.show ? (f(), g("text", {
+            }, null, 8, kl)) : _("", !0)
+          ]))), 256)) : _("", !0),
+          e.showInfo && t.value.style.dataLabel.show ? (f(), y("text", {
             key: 8,
-            x: t.value.style.dataLabel.position === "left" ? 12 + t.value.style.dataLabel.offsetX : A.value.width + 12 + t.value.style.dataLabel.offsetX,
-            y: x.value.height / 2 + t.value.style.dataLabel.fontSize / 2.5 + t.value.style.dataLabel.offsetY,
+            x: t.value.style.dataLabel.position === "left" ? 12 + t.value.style.dataLabel.offsetX : C.value.width + 12 + t.value.style.dataLabel.offsetX,
+            y: $.value.height / 2 + t.value.style.dataLabel.fontSize / 2.5 + t.value.style.dataLabel.offsetY,
             "font-size": t.value.style.dataLabel.fontSize,
             "font-weight": t.value.style.dataLabel.bold ? "bold" : "normal",
             fill: t.value.style.dataLabel.color
-          }, Le($.value ? b(et)(
+          }, Le(k.value ? b(et)(
             t.value.style.dataLabel.formatter,
-            $.value.absoluteValue,
-            b(tt)({ p: t.value.style.dataLabel.prefix, v: $.value.absoluteValue, s: t.value.style.dataLabel.suffix, r: t.value.style.dataLabel.roundingValue }),
-            { datapoint: $.value }
+            k.value.absoluteValue,
+            b(tt)({ p: t.value.style.dataLabel.prefix, v: k.value.absoluteValue, s: t.value.style.dataLabel.suffix, r: t.value.style.dataLabel.roundingValue }),
+            { datapoint: k.value }
           ) : b(et)(
             t.value.style.dataLabel.formatter,
-            pt.value,
-            b(tt)({ p: t.value.style.dataLabel.prefix, v: pt.value, s: t.value.style.dataLabel.suffix, r: t.value.style.dataLabel.roundingValue })
-          )), 9, wl)) : L("", !0),
-          (f(!0), g(Z, null, ge(m.value, (r, c) => (f(), g("rect", {
-            x: r.x - (A.value.width / (we.value + 1) > x.value.padding ? x.value.padding : A.value.width / (we.value + 1)) / 2,
-            y: A.value.top - 6,
-            height: A.value.height + 6,
-            width: A.value.width / (we.value + 1) > x.value.padding ? x.value.padding : A.value.width / (we.value + 1),
+            gt.value,
+            b(tt)({ p: t.value.style.dataLabel.prefix, v: gt.value, s: t.value.style.dataLabel.suffix, r: t.value.style.dataLabel.roundingValue })
+          )), 9, wl)) : _("", !0),
+          (f(!0), y(Z, null, ge(p.value, (r, c) => (f(), y("rect", {
+            x: r.x - (C.value.width / (we.value + 1) > $.value.padding ? $.value.padding : C.value.width / (we.value + 1)) / 2,
+            y: C.value.top - 6,
+            height: C.value.height + 6,
+            width: C.value.width / (we.value + 1) > $.value.padding ? $.value.padding : C.value.width / (we.value + 1),
             fill: "transparent",
-            onMouseenter: () => ze(r, c),
+            onMouseenter: () => Ye(r, c),
             onMouseleave: () => Tt(r, c),
             onClick: () => Rt(r, c)
           }, null, 40, xl))), 256)),
-          pe(l.$slots, "svg", { svg: x.value }, void 0, !0)
+          pe(l.$slots, "svg", { svg: $.value }, void 0, !0)
         ], 44, Ka)),
-        l.$slots.hint ? (f(), g("div", $l, [
-          pe(l.$slots, "hint", Ze(Je({ hint: t.value.a11y.translations.keyboardNavigation, isVisible: Ke.value })), void 0, !0)
-        ])) : L("", !0)
+        l.$slots.hint ? (f(), y("div", $l, [
+          pe(l.$slots, "hint", Ze(Je({ hint: t.value.a11y.translations.keyboardNavigation, isVisible: De.value })), void 0, !0)
+        ])) : _("", !0)
       ]),
-      $.value && t.value.style.tooltip.show ? (f(), _e(b(s), {
+      k.value && t.value.style.tooltip.show ? (f(), _e(b(s), {
         key: 2,
-        x: $.value.x,
-        y: $.value.y,
+        x: k.value.x,
+        y: k.value.y,
         prevX: oe.value.x,
         prevY: oe.value.y,
         offsetY: t.value.style.plot.radius * 3 + t.value.style.tooltip.offsetY,
@@ -1345,36 +1357,36 @@ const Oa = ["innerHTML"], ja = {
         backgroundOpacity: t.value.style.tooltip.backgroundOpacity
       }, {
         default: jt(() => [
-          pe(l.$slots, "tooltip", Ze(Je({ ...$.value })), () => [
-            zt(Le($.value.period) + ": " + Le(b(et)(
+          pe(l.$slots, "tooltip", Ze(Je({ ...k.value })), () => [
+            zt(Le(k.value.period) + ": " + Le(b(et)(
               t.value.style.dataLabel.formatter,
-              $.value.absoluteValue,
+              k.value.absoluteValue,
               b(tt)({
                 p: t.value.style.dataLabel.prefix,
-                v: $.value.absoluteValue,
+                v: k.value.absoluteValue,
                 s: t.value.style.dataLabel.suffix,
                 r: t.value.style.dataLabel.roundingValue
               }),
-              { datapoint: $.value }
+              { datapoint: k.value }
             )), 1)
           ], !0)
         ]),
         _: 3
-      }, 8, ["x", "y", "prevX", "prevY", "offsetY", "svgRef", "background", "color", "fontSize", "borderWidth", "borderColor", "borderRadius", "backgroundOpacity"])) : L("", !0),
-      l.$slots.source ? (f(), g("div", {
+      }, 8, ["x", "y", "prevX", "prevY", "offsetY", "svgRef", "background", "color", "fontSize", "borderWidth", "borderColor", "borderRadius", "backgroundOpacity"])) : _("", !0),
+      l.$slots.source ? (f(), y("div", {
         key: 3,
         ref_key: "source",
         ref: B,
         dir: "auto"
       }, [
         pe(l.$slots, "source", {}, void 0, !0)
-      ], 512)) : L("", !0),
+      ], 512)) : _("", !0),
       pe(l.$slots, "skeleton", {}, () => [
-        b(P) ? (f(), _e(oa, { key: 0 })) : L("", !0)
+        b(P) ? (f(), _e(oa, { key: 0 })) : _("", !0)
       ], !0)
     ], 12, za));
   }
-}, Fl = /* @__PURE__ */ fa(Sl, [["__scopeId", "data-v-0b583ff2"]]);
+}, Fl = /* @__PURE__ */ fa(Sl, [["__scopeId", "data-v-5e51bb77"]]);
 export {
   Fl as default
 };