vue-data-ui 3.10.0 → 3.10.2

package/dist/{vue-ui-sparkline-BWdvoOYj.js → vue-ui-sparkline-Bm0OmFUB.js}

@@ -1,30 +1,34 @@
-import { defineAsyncComponent as he, computed as f, ref as y, toRefs as Xe, watch as Q, shallowRef as ye, onMounted as Ye, onBeforeUnmount as pe, createElementBlock as c, openBlock as n, normalizeStyle as z, renderSlot as F, createCommentVNode as h, createBlock as ge, normalizeProps as be, guardReactiveProps as me, createElementVNode as p, toDisplayString as B, unref as u, createVNode as qe, Fragment as J, renderList as ee, withCtx as Ze, createTextVNode as Ke, nextTick as He } from "vue";
-import { c as Qe, t as Je, a1 as ke, an as te, o as xe, g as Ae, l as et, h as E, n as tt, ao as at, X as lt, s as V, A as _e, C as ot, Q as Ce, a as ae, d as le, ap as rt } from "./lib-2iaAPQ_c.js";
-import { t as ut, u as st } from "./useResponsive-DfdjqQps.js";
-import { u as nt, a as oe } from "./useNestedProp-BCt4DMkT.js";
-import { u as it, B as vt } from "./BaseScanner-BMpwQAfz.js";
-import { u as dt } from "./useThemeCheck-DGJ31Vi5.js";
-import { u as ct } from "./useTimeLabels-DKoynYae.js";
-import { u as ft } from "./useChartAccessibility-9icAAmYg.js";
-import { _ as ht } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const we = { style: { backgroundColor: "#1A1A1A", zeroLine: { color: "#5A5A5A" }, plot: { stroke: "#1A1A1A" }, verticalIndicator: { color: "#8A8A8A" }, dataLabel: { color: "#CCCCCC" }, title: { color: "#CCCCCC" }, tooltip: { color: "#CCCCCC", backgroundColor: "#1A1A1A", borderColor: "#5A5A5A", backgroundOpacity: 70 } } }, Le = { style: { backgroundColor: "#FFF8E1", line: { color: "#D32F2F" }, bar: { color: "#D32F2F", borderRadius: 0 }, zeroLine: { color: "#5D4037" }, plot: { stroke: "#FFF8E1" }, verticalIndicator: { color: "#FF9800" }, dataLabel: { color: "#424242" }, title: { color: "#424242" }, area: { color: "#E64A19" } } }, $e = { style: { backgroundColor: "#1E1E1E", line: { color: "#D32F2F" }, bar: { color: "#D32F2F", borderRadius: 0 }, zeroLine: { color: "#5D4037" }, plot: { stroke: "#1E1E1E" }, verticalIndicator: { color: "#B71C1C" }, dataLabel: { color: "#BDBDBD" }, title: { color: "#BDBDBD" }, area: { color: "#E64A19" } } }, Ne = { style: { backgroundColor: "#1A1A1A", line: { color: "#66CC66" }, bar: { color: "#66CC66", borderRadius: 0 }, zeroLine: { color: "#5F6A5F" }, plot: { stroke: "#1A1A1A" }, verticalIndicator: { color: "#66CC66" }, dataLabel: { color: "#AACCAA" }, title: { color: "#66CC66" }, area: { color: "#66CC66" } } }, Me = { style: { backgroundColor: "#fbfafa", line: { color: "#B9B99D", smooth: !0 }, bar: { color: "#B9B99D", borderRadius: 3 }, zeroLine: { strokeWidth: 0 }, plot: { stroke: "#fbfafa" }, verticalIndicator: { color: "#B9B99D" }, dataLabel: { color: "#A0AC94" }, title: { color: "#8A9892" }, area: { color: "#B9B99D" } } }, Ie = { style: { backgroundColor: "#f6f6fb", line: { color: "#4A6A75" }, bar: { color: "#4A6A75", borderRadius: 0 }, zeroLine: { color: "#9FA9BE" }, plot: { stroke: "#f6f6fb" }, verticalIndicator: { color: "#4A6A75" }, dataLabel: { color: "#61747E" }, title: { color: "#50606C" }, area: { color: "#4A6A75" } } }, Fe = {
+import { defineAsyncComponent as he, computed as f, ref as y, toRefs as qe, watch as Q, shallowRef as ye, onMounted as Ze, onBeforeUnmount as pe, createElementBlock as c, openBlock as n, normalizeStyle as z, renderSlot as D, createCommentVNode as h, createBlock as ge, normalizeProps as be, guardReactiveProps as me, createElementVNode as p, toDisplayString as B, unref as u, createVNode as Ke, Fragment as J, renderList as ee, withCtx as He, createTextVNode as Qe, nextTick as Je } from "vue";
+import { c as et, t as tt, a1 as ke, an as te, o as Ae, g as Ce, l as at, h as E, n as lt, ao as ot, X as rt, s as V, A as xe, C as ut, Q as _e, a as ae, d as le, ap as st } from "./lib-CVHM9FhP.js";
+import { t as nt, u as it } from "./useResponsive-DfdjqQps.js";
+import { u as dt, a as oe } from "./useNestedProp-Ckf_2P_V.js";
+import { u as vt, B as ct } from "./BaseScanner-BMpwQAfz.js";
+import { u as ft } from "./useThemeCheck-D1ZYXUwG.js";
+import { u as ht } from "./useTimeLabels-DKoynYae.js";
+import { u as yt } from "./useChartAccessibility-9icAAmYg.js";
+import { _ as pt } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const we = {}, Le = { style: { backgroundColor: "#1A1A1A", zeroLine: { color: "#5A5A5A" }, plot: { stroke: "#1A1A1A" }, verticalIndicator: { color: "#8A8A8A" }, dataLabel: { color: "#CCCCCC" }, title: { color: "#CCCCCC" }, tooltip: { backgroundColor: "#1A1A1A", backgroundOpacity: 70, color: "#CCCCCC", borderColor: "#3A3A3A" } } }, $e = { style: { backgroundColor: "#1A1A1A", zeroLine: { color: "#5A5A5A" }, plot: { stroke: "#1A1A1A" }, verticalIndicator: { color: "#8A8A8A" }, dataLabel: { color: "#CCCCCC" }, title: { color: "#CCCCCC" }, tooltip: { color: "#CCCCCC", backgroundColor: "#1A1A1A", borderColor: "#5A5A5A", backgroundOpacity: 70 } } }, Ne = { style: { backgroundColor: "#FFF8E1", line: { color: "#D32F2F" }, bar: { color: "#D32F2F", borderRadius: 0 }, zeroLine: { color: "#5D4037" }, plot: { stroke: "#FFF8E1" }, verticalIndicator: { color: "#FF9800" }, dataLabel: { color: "#424242" }, title: { color: "#424242" }, area: { color: "#E64A19" } } }, Ie = { style: { backgroundColor: "#1E1E1E", line: { color: "#D32F2F" }, bar: { color: "#D32F2F", borderRadius: 0 }, zeroLine: { color: "#5D4037" }, plot: { stroke: "#1E1E1E" }, verticalIndicator: { color: "#B71C1C" }, dataLabel: { color: "#BDBDBD" }, title: { color: "#BDBDBD" }, area: { color: "#E64A19" } } }, Me = { style: { backgroundColor: "#1A1A1A", line: { color: "#66CC66" }, bar: { color: "#66CC66", borderRadius: 0 }, zeroLine: { color: "#5F6A5F" }, plot: { stroke: "#1A1A1A" }, verticalIndicator: { color: "#66CC66" }, dataLabel: { color: "#AACCAA" }, title: { color: "#66CC66" }, area: { color: "#66CC66" } } }, De = { style: { backgroundColor: "#fbfafa", line: { color: "#B9B99D", smooth: !0 }, bar: { color: "#B9B99D", borderRadius: 3 }, zeroLine: { strokeWidth: 0 }, plot: { stroke: "#fbfafa" }, verticalIndicator: { color: "#B9B99D" }, dataLabel: { color: "#A0AC94" }, title: { color: "#8A9892" }, area: { color: "#B9B99D" } } }, Fe = { style: { backgroundColor: "#f6f6fb", line: { color: "#4A6A75" }, bar: { color: "#4A6A75", borderRadius: 0 }, zeroLine: { color: "#9FA9BE" }, plot: { stroke: "#f6f6fb" }, verticalIndicator: { color: "#4A6A75" }, dataLabel: { color: "#61747E" }, title: { color: "#50606C" }, area: { color: "#4A6A75" } } }, Se = {
   default: {},
-  dark: we,
-  celebration: Le,
-  celebrationNight: $e,
-  hack: Ne,
-  zen: Me,
-  concrete: Ie
-}, Zt = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  minimal: we,
+  minimalDark: Le,
+  dark: $e,
+  celebration: Ne,
+  celebrationNight: Ie,
+  hack: Me,
+  zen: De,
+  concrete: Fe
+}, Ht = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
-  celebration: Le,
-  celebrationNight: $e,
-  concrete: Ie,
-  dark: we,
-  default: Fe,
-  hack: Ne,
-  zen: Me
-}, Symbol.toStringTag, { value: "Module" })), yt = ["id"], pt = ["xmlns", "viewBox"], gt = ["width", "height"], bt = ["id"], mt = ["stop-color"], kt = ["stop-color"], xt = ["id"], At = ["stop-color"], _t = ["stop-color"], Ct = ["id"], wt = ["stop-color"], Lt = ["stop-color"], $t = { key: 1 }, Nt = ["d", "fill"], Mt = ["d", "fill"], It = ["d", "stroke", "stroke-width"], Ft = ["d", "stroke", "stroke-width"], Dt = ["x", "y", "width", "height", "fill", "rx"], St = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], zt = ["x1", "x2", "y1", "y2", "stroke", "stroke-dasharray", "stroke-width"], Bt = ["cx", "cy", "r", "fill", "stroke", "stroke-width"], Et = ["x", "y", "font-size", "font-weight", "fill"], Vt = ["x", "y", "height", "width", "onMouseenter", "onMouseleave", "onClick"], Tt = {
+  celebration: Ne,
+  celebrationNight: Ie,
+  concrete: Fe,
+  dark: $e,
+  default: Se,
+  hack: Me,
+  minimal: we,
+  minimalDark: Le,
+  zen: De
+}, Symbol.toStringTag, { value: "Module" })), gt = ["id"], bt = ["xmlns", "viewBox"], mt = ["width", "height"], kt = ["id"], At = ["stop-color"], Ct = ["stop-color"], xt = ["id"], _t = ["stop-color"], wt = ["stop-color"], Lt = ["id"], $t = ["stop-color"], Nt = ["stop-color"], It = { key: 1 }, Mt = ["d", "fill"], Dt = ["d", "fill"], Ft = ["d", "stroke", "stroke-width"], St = ["d", "stroke", "stroke-width"], zt = ["x", "y", "width", "height", "fill", "rx"], Bt = ["x1", "x2", "y1", "y2", "stroke", "stroke-width", "stroke-dasharray"], Et = ["x1", "x2", "y1", "y2", "stroke", "stroke-dasharray", "stroke-width"], Vt = ["cx", "cy", "r", "fill", "stroke", "stroke-width"], Tt = ["x", "y", "font-size", "font-weight", "fill"], Rt = ["x", "y", "height", "width", "onMouseenter", "onMouseleave", "onClick"], Ot = {
   __name: "vue-ui-sparkline",
   props: {
     config: {
@@ -57,22 +61,22 @@ const we = { style: { backgroundColor: "#1A1A1A", zeroLine: { color: "#5A5A5A" }
     }
   },
   emits: ["hoverIndex", "selectDatapoint"],
-  setup(L, { emit: De }) {
-    const Se = he(() => import("./PackageVersion-C-JOGZBL.js")), ze = he(() => import("./SparkTooltip-D_OsZuuE.js")), { vue_ui_sparkline: Be } = nt(), { isThemeValid: Ee, warnInvalidTheme: Ve } = dt(), s = L, re = f(() => Array.isArray(s.dataset) && s.dataset.length > 0), g = y(Qe()), T = y(null), ue = y(null), se = y(null), e = y(W());
-    function Te(t) {
-      return rt(t).map((a) => ({ period: "-", value: a }));
+  setup(L, { emit: ze }) {
+    const Be = he(() => import("./PackageVersion-CQxJyGQr.js")), Ee = he(() => import("./SparkTooltip-BLTVhvm2.js")), { vue_ui_sparkline: Ve } = dt(), { isThemeValid: Te, warnInvalidTheme: Re } = ft(), s = L, re = f(() => Array.isArray(s.dataset) && s.dataset.length > 0), g = y(et()), T = y(null), ue = y(null), se = y(null), e = y(P());
+    function Oe(t) {
+      return st(t).map((a) => ({ period: "-", value: a }));
     }
-    const { loading: R, FINAL_DATASET: $, manualLoading: P } = it({
-      ...Xe(s),
+    const { loading: R, FINAL_DATASET: $, manualLoading: O } = vt({
+      ...qe(s),
       FINAL_CONFIG: e,
-      prepareConfig: W,
+      prepareConfig: P,
       callback: () => {
         Promise.resolve().then(async () => {
-          await He(), X();
+          await Je(), X();
         });
       },
-      skeletonDataset: Te(12),
-      skeletonConfig: Je({
+      skeletonDataset: Oe(12),
+      skeletonConfig: tt({
         defaultConfig: e.value,
         userConfig: {
           style: {
@@ -89,20 +93,20 @@ const we = { style: { backgroundColor: "#1A1A1A", zeroLine: { color: "#5A5A5A" }
           }
         }
       })
-    }), { svgRef: ne } = ft({ config: e.value.style.title });
-    function W() {
+    }), { svgRef: ne } = yt({ config: e.value.style.title });
+    function P() {
       const t = oe({
         userConfig: s.config,
-        defaultConfig: Be
+        defaultConfig: Ve
       });
       let a = {};
       const l = t.theme;
       if (l)
-        if (!Ee.value(t))
-          Ve(t), a = t;
+        if (!Te.value(t))
+          Re(t), a = t;
         else {
           const o = oe({
-            userConfig: Fe[l] || s.config,
+            userConfig: Se[l] || s.config,
             defaultConfig: t
           });
           a = {
@@ -116,14 +120,14 @@ const we = { style: { backgroundColor: "#1A1A1A", zeroLine: { color: "#5A5A5A" }
         a = t;
       return s.config && ke(s.config, "style.scaleMin") ? a.style.scaleMin = s.config.style.scaleMin : a.style.scaleMin = null, s.config && ke(s.config, "style.scaleMax") ? a.style.scaleMax = s.config.style.scaleMax : a.style.scaleMax = null, a;
     }
-    const x = f(() => te({
+    const A = f(() => te({
       data: $.value,
       threshold: e.value.downsample.threshold
     }));
     Q(() => s.config, (t) => {
-      R.value || (e.value = W()), ve(), r.value.chartWidth = e.value.style.chartWidth;
+      R.value || (e.value = P()), de(), r.value.chartWidth = e.value.style.chartWidth;
     }, { deep: !0 }), Q(() => s.dataset, (t) => {
-      Array.isArray(t) && t.length > 0 && (P.value = !1), b.value = te({
+      Array.isArray(t) && t.length > 0 && (O.value = !1), b.value = te({
         data: $.value.map((a) => ({
           ...a,
           value: [void 0].includes(a.value) ? null : a.value
@@ -131,8 +135,8 @@ const we = { style: { backgroundColor: "#1A1A1A", zeroLine: { color: "#5A5A5A" }
         threshold: e.value.downsample.threshold
       });
     }, { deep: !0 });
-    const b = y(Re());
-    function Re() {
+    const b = y(Pe());
+    function Pe() {
       return te({
         data: $.value.map((t) => e.value.style.animation.show && $.value.length > 1 ? {
           ...t,
@@ -144,59 +148,59 @@ const we = { style: { backgroundColor: "#1A1A1A", zeroLine: { color: "#5A5A5A" }
         threshold: e.value.downsample.threshold
       });
     }
-    const m = ye(null), A = ye(null), O = y(!1), N = y(0), j = y([]), G = y(""), U = f(() => {
-      const a = (x.value || []).map((o) => `${o.period}::${Number.isFinite(o.value) ? o.value : 0}`).join("|"), l = e.value?.style?.animation || {};
+    const m = ye(null), C = ye(null), W = y(!1), N = y(0), j = y([]), G = y(""), U = f(() => {
+      const a = (A.value || []).map((o) => `${o.period}::${Number.isFinite(o.value) ? o.value : 0}`).join("|"), l = e.value?.style?.animation || {};
       return `${a}#${!!l.show}#${l.animationFrames || 0}`;
     });
-    function D() {
-      N.value && (cancelAnimationFrame(N.value), N.value = 0), j.value.forEach((t) => clearTimeout(t)), j.value = [], O.value = !1;
+    function F() {
+      N.value && (cancelAnimationFrame(N.value), N.value = 0), j.value.forEach((t) => clearTimeout(t)), j.value = [], W.value = !1;
     }
     function X() {
-      const t = e.value?.style?.animation || {}, a = x.value || [], l = U.value;
-      if (l && l === G.value && (O.value || b.value.length === a.length))
+      const t = e.value?.style?.animation || {}, a = A.value || [], l = U.value;
+      if (l && l === G.value && (W.value || b.value.length === a.length))
         return;
-      if (D(), !t.show || R.value || a.length <= 1) {
+      if (F(), !t.show || R.value || a.length <= 1) {
         b.value = a, G.value = l;
         return;
       }
-      O.value = !0, G.value = l, b.value = [];
+      W.value = !0, G.value = l, b.value = [];
       const o = Math.max(1, Number(t.animationFrames) || 1), K = Math.max(1, Math.floor(o / a.length));
       let H = 0;
       const fe = () => {
         if (l !== U.value) {
-          D();
+          F();
           return;
         }
         if (H < a.length) {
           b.value.push(a[H]);
-          const Ue = setTimeout(() => {
+          const Ye = setTimeout(() => {
             N.value = requestAnimationFrame(fe);
           }, K);
-          j.value.push(Ue), H += 1;
+          j.value.push(Ye), H += 1;
         } else
-          b.value = a, D();
+          b.value = a, F();
       };
       N.value = requestAnimationFrame(fe);
     }
     Q(U, () => {
       X();
-    }), Ye(() => {
-      ve(), X();
+    }), Ze(() => {
+      de(), X();
     }), pe(() => {
-      D();
+      F();
     });
     const ie = f(() => !!e.value.debug);
-    function ve() {
-      if (xe(s.dataset) ? (Ae({
+    function de() {
+      if (Ae(s.dataset) ? (Ce({
         componentName: "VueUiSparkline",
         type: "dataset",
         debug: ie.value
-      }), P.value = !0) : s.dataset.forEach((t, a) => {
-        et({
+      }), O.value = !0) : s.dataset.forEach((t, a) => {
+        at({
           datasetObject: t,
           requiredAttributes: ["period", "value"]
         }).forEach((l) => {
-          Ae({
+          Ce({
             componentName: "VueUiSparkline",
             type: "datasetSerieAttribute",
             property: l,
@@ -204,9 +208,9 @@ const we = { style: { backgroundColor: "#1A1A1A", zeroLine: { color: "#5A5A5A" }
             debug: ie.value
           });
         });
-      }), xe(s.dataset) || (P.value = e.value.loading), e.value.responsive) {
-        const t = ut(() => {
-          const { width: a, height: l } = st({
+      }), Ae(s.dataset) || (O.value = e.value.loading), e.value.responsive) {
+        const t = nt(() => {
+          const { width: a, height: l } = it({
             chart: T.value,
             title: e.value.style.title.show && s.showInfo ? ue.value : null,
             source: se.value
@@ -215,18 +219,18 @@ const we = { style: { backgroundColor: "#1A1A1A", zeroLine: { color: "#5A5A5A" }
             r.value.width = a, r.value.height = l, r.value.chartWidth = e.value.style.chartWidth / 500 * a, r.value.padding = s.forcedPadding / 500 * a;
           });
         });
-        m.value && (A.value && m.value.unobserve(A.value), m.value.disconnect()), m.value = new ResizeObserver(t), A.value = T.value.parentNode, m.value.observe(A.value);
+        m.value && (C.value && m.value.unobserve(C.value), m.value.disconnect()), m.value = new ResizeObserver(t), C.value = T.value.parentNode, m.value.observe(C.value);
       }
     }
     pe(() => {
-      m.value && (A.value && m.value.unobserve(A.value), m.value.disconnect());
+      m.value && (C.value && m.value.unobserve(C.value), m.value.disconnect());
     });
     const r = y({
       height: 80 * s.heightRatio,
       width: 500,
       chartWidth: e.value.style.chartWidth,
       padding: s.forcedPadding
-    }), Y = De, i = f(() => {
+    }), Y = ze, i = f(() => {
       const { top: t, right: a, bottom: l, left: o } = e.value.style.padding;
       return {
         top: t,
@@ -237,53 +241,53 @@ const we = { style: { backgroundColor: "#1A1A1A", zeroLine: { color: "#5A5A5A" }
         width: s.showInfo && e.value.style.dataLabel.show ? r.value.chartWidth - o - a : r.value.width - r.value.padding - o - a,
         height: r.value.height - t - l
       };
-    }), q = f(() => [null, void 0].includes(e.value.style.scaleMin) ? Math.min(...b.value.map((t) => isNaN(t.value) || [void 0, null, "NaN", NaN, 1 / 0, -1 / 0].includes(t.value) ? 0 : t.value || 0)) : e.value.style.scaleMin), Pe = f(() => [null, void 0].includes(e.value.style.scaleMax) ? Math.max(...b.value.map((t) => isNaN(t.value) || [void 0, null, "NaN", NaN, 1 / 0, -1 / 0].includes(t.value) ? 0 : t.value || 0)) : e.value.style.scaleMax), M = f(() => {
+    }), q = f(() => [null, void 0].includes(e.value.style.scaleMin) ? Math.min(...b.value.map((t) => isNaN(t.value) || [void 0, null, "NaN", NaN, 1 / 0, -1 / 0].includes(t.value) ? 0 : t.value || 0)) : e.value.style.scaleMin), We = f(() => [null, void 0].includes(e.value.style.scaleMax) ? Math.max(...b.value.map((t) => isNaN(t.value) || [void 0, null, "NaN", NaN, 1 / 0, -1 / 0].includes(t.value) ? 0 : t.value || 0)) : e.value.style.scaleMax), I = f(() => {
       const t = q.value >= 0 ? 0 : q.value;
       return Math.abs(t);
-    }), de = f(() => Pe.value + M.value), _ = f(() => i.value.bottom - i.value.height * Z(M.value));
+    }), ve = f(() => We.value + I.value), x = f(() => i.value.bottom - i.value.height * Z(I.value));
     function Z(t) {
-      return isNaN(t / de.value) ? 0 : t / de.value;
+      return isNaN(t / ve.value) ? 0 : t / ve.value;
     }
-    const C = f(() => x.value.length - 1 || 1), S = f(() => ct({
-      values: x.value.map((t) => t.period),
-      maxDatapoints: x.value.length,
+    const _ = f(() => A.value.length - 1 || 1), S = f(() => ht({
+      values: A.value.map((t) => t.period),
+      maxDatapoints: A.value.length,
       formatter: e.value.style.dataLabel.datetimeFormatter,
       start: 0,
-      end: x.value.length
-    })), d = f(() => b.value.map((t, a) => {
-      const l = isNaN(t.value) || [void 0, null, "NaN", NaN, 1 / 0, -1 / 0].includes(t.value) ? 0 : t.value || 0, o = i.value.width / C.value;
+      end: A.value.length
+    })), v = f(() => b.value.map((t, a) => {
+      const l = isNaN(t.value) || [void 0, null, "NaN", NaN, 1 / 0, -1 / 0].includes(t.value) ? 0 : t.value || 0, o = i.value.width / _.value;
       return {
         absoluteValue: l,
         period: S.value && S.value[a] && S.value[a].text ? S.value[a].text : t.period,
-        plotValue: l + M.value,
-        toMax: Z(l + M.value),
+        plotValue: l + I.value,
+        toMax: Z(l + I.value),
         x: i.value.start + a * o,
-        y: i.value.bottom - i.value.height * Z(l + M.value),
+        y: i.value.bottom - i.value.height * Z(l + I.value),
         id: `plot_${g.value}_${a}`,
-        color: I.value ? e.value.style.bar.color : e.value.style.area.useGradient ? E(e.value.style.line.color, 0.05 * (1 - a / C.value)) : e.value.style.line.color,
+        color: M.value ? e.value.style.bar.color : e.value.style.area.useGradient ? E(e.value.style.line.color, 0.05 * (1 - a / _.value)) : e.value.style.line.color,
         width: o
       };
-    })), We = f(() => {
-      const t = { x: d.value[0].x || 0, y: (r.value.height || 0) - 6 }, a = { x: d.value[d.value.length - 1].x || 0, y: (r.value.height || 0) - 6 }, l = [];
-      return d.value.forEach((o) => {
+    })), je = f(() => {
+      const t = { x: v.value[0].x || 0, y: (r.value.height || 0) - 6 }, a = { x: v.value[v.value.length - 1].x || 0, y: (r.value.height || 0) - 6 }, l = [];
+      return v.value.forEach((o) => {
         l.push(`${o.x || 0},${o.y || 0} `);
       }), [t.x, t.y, ...l, a.x, a.y].toString();
-    }), v = y(void 0), w = y(void 0);
-    function Oe(t, a) {
-      e.value.events.datapointEnter && e.value.events.datapointEnter({ datapoint: t, seriesIndex: a }), v.value = t, w.value || (w.value = t), Y("hoverIndex", { index: a });
+    }), d = y(void 0), w = y(void 0);
+    function Ge(t, a) {
+      e.value.events.datapointEnter && e.value.events.datapointEnter({ datapoint: t, seriesIndex: a }), d.value = t, w.value || (w.value = t), Y("hoverIndex", { index: a });
     }
-    function je(t, a) {
-      e.value.events.datapointLeave && e.value.events.datapointLeave({ datapoint: t, seriesIndex: a }), w.value = v.value, v.value = void 0, Y("hoverIndex", { index: void 0 });
+    function Ue(t, a) {
+      e.value.events.datapointLeave && e.value.events.datapointLeave({ datapoint: t, seriesIndex: a }), w.value = d.value, d.value = void 0, Y("hoverIndex", { index: void 0 });
     }
     const k = f(() => {
       if (re.value) {
-        const t = d.value.map((l) => l.absoluteValue), a = t.reduce((l, o) => l + o, 0);
+        const t = v.value.map((l) => l.absoluteValue), a = t.reduce((l, o) => l + o, 0);
         return {
-          latest: d.value[d.value.length - 1] ? d.value[d.value.length - 1].absoluteValue : 0,
+          latest: v.value[v.value.length - 1] ? v.value[v.value.length - 1].absoluteValue : 0,
           sum: a,
-          average: a / d.value.length,
-          median: at(t),
-          trend: tt(d.value.map(({ x: l, y: o, absoluteValue: K }) => ({
+          average: a / v.value.length,
+          median: ot(t),
+          trend: lt(v.value.map(({ x: l, y: o, absoluteValue: K }) => ({
             x: l,
             y: o,
             value: K
@@ -297,8 +301,8 @@ const we = { style: { backgroundColor: "#1A1A1A", zeroLine: { color: "#5A5A5A" }
           median: null,
           trend: null
         };
-    }), ce = f(() => re.value ? e.value.style.dataLabel.valueType === "latest" ? k.value.latest : e.value.style.dataLabel.valueType === "sum" ? k.value.sum : e.value.style.dataLabel.valueType === "average" ? k.value.average : 0 : 0), I = f(() => e.value.type && e.value.type === "bar");
-    function Ge(t, a) {
+    }), ce = f(() => re.value ? e.value.style.dataLabel.valueType === "latest" ? k.value.latest : e.value.style.dataLabel.valueType === "sum" ? k.value.sum : e.value.style.dataLabel.valueType === "average" ? k.value.average : 0 : 0), M = f(() => e.value.type && e.value.type === "bar");
+    function Xe(t, a) {
       e.value.events.datapointClick && e.value.events.datapointClick({ datapoint: t, seriesIndex: a }), Y("selectDatapoint", { datapoint: t, index: a });
     }
     return (t, a) => (n(), c("div", {
@@ -308,8 +312,8 @@ const we = { style: { backgroundColor: "#1A1A1A", zeroLine: { color: "#5A5A5A" }
       id: g.value,
       style: z(`width:100%;font-family:${e.value.style.fontFamily};`)
     }, [
-      F(t.$slots, "before", be(me({
-        selected: v.value,
+      D(t.$slots, "before", be(me({
+        selected: d.value,
         latest: k.value.latest,
         sum: k.value.sum,
         average: k.value.average,
@@ -325,17 +329,17 @@ const we = { style: { backgroundColor: "#1A1A1A", zeroLine: { color: "#5A5A5A" }
       }, [
         p("span", {
           style: z(`padding:${e.value.style.title.textAlign === "left" ? "0 0 0 12px" : e.value.style.title.textAlign === "right" ? "0 12px 0 0" : "0"}`)
-        }, B(v.value ? v.value.period : e.value.style.title.text), 5)
+        }, B(d.value ? d.value.period : e.value.style.title.text), 5)
       ], 4)) : h("", !0),
       (n(), c("svg", {
         ref_key: "svgRef",
         ref: ne,
-        xmlns: u(lt),
+        xmlns: u(rt),
         viewBox: `0 0 ${r.value.width} ${r.value.height}`,
         style: z(`background:${e.value.style.backgroundColor};overflow:visible`),
         onMouseleave: a[0] || (a[0] = (l) => w.value = void 0)
       }, [
-        qe(u(Se)),
+        Ke(u(Be)),
         t.$slots["chart-background"] ? (n(), c("foreignObject", {
           key: 0,
           x: 0,
@@ -346,8 +350,8 @@ const we = { style: { backgroundColor: "#1A1A1A", zeroLine: { color: "#5A5A5A" }
             pointerEvents: "none"
           }
         }, [
-          F(t.$slots, "chart-background", {}, void 0, !0)
-        ], 8, gt)) : h("", !0),
+          D(t.$slots, "chart-background", {}, void 0, !0)
+        ], 8, mt)) : h("", !0),
         p("defs", null, [
           p("linearGradient", {
             x1: "0%",
@@ -359,12 +363,12 @@ const we = { style: { backgroundColor: "#1A1A1A", zeroLine: { color: "#5A5A5A" }
             p("stop", {
               offset: "0%",
               "stop-color": u(V)(u(E)(e.value.style.area.color, 0.05), e.value.style.area.opacity)
-            }, null, 8, mt),
+            }, null, 8, At),
             p("stop", {
               offset: "100%",
               "stop-color": u(V)(e.value.style.area.color, e.value.style.area.opacity)
-            }, null, 8, kt)
-          ], 8, bt),
+            }, null, 8, Ct)
+          ], 8, kt),
           p("linearGradient", {
             x2: "0%",
             y2: "100%",
@@ -373,11 +377,11 @@ const we = { style: { backgroundColor: "#1A1A1A", zeroLine: { color: "#5A5A5A" }
             p("stop", {
               offset: "0%",
               "stop-color": e.value.style.bar.color
-            }, null, 8, At),
+            }, null, 8, _t),
             p("stop", {
               offset: "100%",
               "stop-color": u(E)(e.value.style.bar.color, 0.05)
-            }, null, 8, _t)
+            }, null, 8, wt)
           ], 8, xt),
           p("linearGradient", {
             x2: "0%",
@@ -387,51 +391,57 @@ const we = { style: { backgroundColor: "#1A1A1A", zeroLine: { color: "#5A5A5A" }
             p("stop", {
               offset: "0%",
               "stop-color": u(E)(e.value.style.bar.color, 0.05)
-            }, null, 8, wt),
+            }, null, 8, $t),
             p("stop", {
               offset: "100%",
               "stop-color": e.value.style.bar.color
-            }, null, 8, Lt)
-          ], 8, Ct)
+            }, null, 8, Nt)
+          ], 8, Lt)
         ]),
-        e.value.style.area.show && !I.value && d.value[0] && d.value.length > 1 ? (n(), c("g", $t, [
+        e.value.style.area.show && !M.value && v.value[0] && v.value.length > 1 ? (n(), c("g", It, [
           e.value.style.line.smooth ? (n(), c("path", {
             key: 0,
-            d: `M ${d.value[0].x},${i.value.bottom} ${u(_e)(d.value)} L ${d.value.at(-1).x},${i.value.bottom} Z`,
-            fill: e.value.style.area.useGradient ? `url(#sparkline_gradient_${g.value})` : u(V)(e.value.style.area.color, e.value.style.area.opacity)
-          }, null, 8, Nt)) : (n(), c("path", {
+            d: `M ${v.value[0].x},${i.value.bottom} ${u(xe)(v.value)} L ${v.value.at(-1).x},${i.value.bottom} Z`,
+            fill: e.value.style.area.useGradient ? `url(#sparkline_gradient_${g.value})` : u(V)(e.value.style.area.color, e.value.style.area.opacity),
+            "stroke-linecap": "round",
+            "stroke-linejoin": "round"
+          }, null, 8, Mt)) : (n(), c("path", {
             key: 1,
-            d: `M${We.value}Z`,
-            fill: e.value.style.area.useGradient ? `url(#sparkline_gradient_${g.value})` : u(V)(e.value.style.area.color, e.value.style.area.opacity)
-          }, null, 8, Mt))
+            d: `M${je.value}Z`,
+            fill: e.value.style.area.useGradient ? `url(#sparkline_gradient_${g.value})` : u(V)(e.value.style.area.color, e.value.style.area.opacity),
+            "stroke-linecap": "round",
+            "stroke-linejoin": "round"
+          }, null, 8, Dt))
         ])) : h("", !0),
-        e.value.style.line.smooth && !I.value ? (n(), c("path", {
+        e.value.style.line.smooth && !M.value ? (n(), c("path", {
           key: 2,
-          d: `M ${u(_e)(d.value) || "0,0"}`,
+          d: `M ${u(xe)(v.value) || "0,0"}`,
           stroke: e.value.style.line.color,
           fill: "none",
           "stroke-width": e.value.style.line.strokeWidth,
-          "stroke-linecap": "round"
-        }, null, 8, It)) : h("", !0),
-        !e.value.style.line.smooth && !I.value ? (n(), c("path", {
+          "stroke-linecap": "round",
+          "stroke-linejoin": "round"
+        }, null, 8, Ft)) : h("", !0),
+        !e.value.style.line.smooth && !M.value ? (n(), c("path", {
           key: 3,
-          d: `M ${u(ot)(d.value) || "0,0"}`,
+          d: `M ${u(ut)(v.value) || "0,0"}`,
           stroke: e.value.style.line.color,
           fill: "none",
           "stroke-width": e.value.style.line.strokeWidth,
-          "stroke-linecap": "round"
-        }, null, 8, Ft)) : h("", !0),
-        (n(!0), c(J, null, ee(d.value, (l, o) => (n(), c("g", null, [
-          I.value ? (n(), c("rect", {
+          "stroke-linecap": "round",
+          "stroke-linejoin": "round"
+        }, null, 8, St)) : h("", !0),
+        (n(!0), c(J, null, ee(v.value, (l, o) => (n(), c("g", null, [
+          M.value ? (n(), c("rect", {
             key: 0,
             x: l.x - l.width / 2,
-            y: isNaN(l.absoluteValue > 0 ? l.y : _.value) ? 0 : l.absoluteValue > 0 ? l.y : _.value,
+            y: isNaN(l.absoluteValue > 0 ? l.y : x.value) ? 0 : l.absoluteValue > 0 ? l.y : x.value,
             width: l.width,
-            height: isNaN(Math.abs(l.y - _.value)) ? 0 : Math.abs(l.y - _.value),
+            height: isNaN(Math.abs(l.y - x.value)) ? 0 : Math.abs(l.y - x.value),
             fill: l.absoluteValue > 0 ? `url(#sparkline_bar_gradient_pos_${g.value})` : `url(#sparkline_bar_gradient_neg_${g.value})`,
             rx: e.value.style.bar.borderRadius
-          }, null, 8, Dt)) : h("", !0),
-          e.value.style.verticalIndicator.show && (v.value && l.id === v.value.id || L.selectedIndex === o) ? (n(), c("line", {
+          }, null, 8, zt)) : h("", !0),
+          e.value.style.verticalIndicator.show && (d.value && l.id === d.value.id || L.selectedIndex === o) ? (n(), c("line", {
             key: 1,
             x1: l.x,
             x2: l.x,
@@ -441,21 +451,21 @@ const we = { style: { backgroundColor: "#1A1A1A", zeroLine: { color: "#5A5A5A" }
             "stroke-width": e.value.style.verticalIndicator.strokeWidth,
             "stroke-linecap": "round",
             "stroke-dasharray": e.value.style.verticalIndicator.strokeDasharray || 0
-          }, null, 8, St)) : h("", !0)
+          }, null, 8, Bt)) : h("", !0)
         ]))), 256)),
         q.value < 0 ? (n(), c("line", {
           key: 4,
           x1: i.value.start,
           x2: i.value.start + i.value.width,
-          y1: u(Ce)(_.value, i.value.bottom),
-          y2: u(Ce)(_.value, i.value.bottom),
+          y1: u(_e)(x.value, i.value.bottom),
+          y2: u(_e)(x.value, i.value.bottom),
           stroke: e.value.style.zeroLine.color,
           "stroke-dasharray": e.value.style.zeroLine.strokeWidth * 2,
           "stroke-width": e.value.style.zeroLine.strokeWidth,
           "stroke-linecap": "round"
-        }, null, 8, zt)) : h("", !0),
-        e.value.style.plot.show ? (n(!0), c(J, { key: 5 }, ee(d.value, (l, o) => (n(), c("g", null, [
-          v.value && l.id === v.value.id || L.selectedIndex === o || u($).length === 1 ? (n(), c("circle", {
+        }, null, 8, Et)) : h("", !0),
+        e.value.style.plot.show ? (n(!0), c(J, { key: 5 }, ee(v.value, (l, o) => (n(), c("g", null, [
+          d.value && l.id === d.value.id || L.selectedIndex === o || u($).length === 1 ? (n(), c("circle", {
             key: 0,
             cx: l.x,
             cy: l.y,
@@ -463,7 +473,7 @@ const we = { style: { backgroundColor: "#1A1A1A", zeroLine: { color: "#5A5A5A" }
             fill: l.color,
             stroke: e.value.style.plot.stroke,
             "stroke-width": e.value.style.plot.strokeWidth
-          }, null, 8, Bt)) : h("", !0)
+          }, null, 8, Vt)) : h("", !0)
         ]))), 256)) : h("", !0),
         L.showInfo && e.value.style.dataLabel.show ? (n(), c("text", {
           key: 6,
@@ -472,32 +482,32 @@ const we = { style: { backgroundColor: "#1A1A1A", zeroLine: { color: "#5A5A5A" }
           "font-size": e.value.style.dataLabel.fontSize,
           "font-weight": e.value.style.dataLabel.bold ? "bold" : "normal",
           fill: e.value.style.dataLabel.color
-        }, B(v.value ? u(ae)(
+        }, B(d.value ? u(ae)(
           e.value.style.dataLabel.formatter,
-          v.value.absoluteValue,
-          u(le)({ p: e.value.style.dataLabel.prefix, v: v.value.absoluteValue, s: e.value.style.dataLabel.suffix, r: e.value.style.dataLabel.roundingValue }),
-          { datapoint: v.value }
+          d.value.absoluteValue,
+          u(le)({ p: e.value.style.dataLabel.prefix, v: d.value.absoluteValue, s: e.value.style.dataLabel.suffix, r: e.value.style.dataLabel.roundingValue }),
+          { datapoint: d.value }
         ) : u(ae)(
           e.value.style.dataLabel.formatter,
           ce.value,
           u(le)({ p: e.value.style.dataLabel.prefix, v: ce.value, s: e.value.style.dataLabel.suffix, r: e.value.style.dataLabel.roundingValue })
-        )), 9, Et)) : h("", !0),
-        (n(!0), c(J, null, ee(d.value, (l, o) => (n(), c("rect", {
-          x: l.x - (i.value.width / (C.value + 1) > r.value.padding ? r.value.padding : i.value.width / (C.value + 1)) / 2,
+        )), 9, Tt)) : h("", !0),
+        (n(!0), c(J, null, ee(v.value, (l, o) => (n(), c("rect", {
+          x: l.x - (i.value.width / (_.value + 1) > r.value.padding ? r.value.padding : i.value.width / (_.value + 1)) / 2,
           y: i.value.top - 6,
           height: i.value.height + 6,
-          width: i.value.width / (C.value + 1) > r.value.padding ? r.value.padding : i.value.width / (C.value + 1),
+          width: i.value.width / (_.value + 1) > r.value.padding ? r.value.padding : i.value.width / (_.value + 1),
           fill: "transparent",
-          onMouseenter: () => Oe(l, o),
-          onMouseleave: () => je(l, o),
-          onClick: () => Ge(l, o)
-        }, null, 40, Vt))), 256)),
-        F(t.$slots, "svg", { svg: r.value }, void 0, !0)
-      ], 44, pt)),
-      v.value && e.value.style.tooltip.show ? (n(), ge(u(ze), {
+          onMouseenter: () => Ge(l, o),
+          onMouseleave: () => Ue(l, o),
+          onClick: () => Xe(l, o)
+        }, null, 40, Rt))), 256)),
+        D(t.$slots, "svg", { svg: r.value }, void 0, !0)
+      ], 44, bt)),
+      d.value && e.value.style.tooltip.show ? (n(), ge(u(Ee), {
         key: 1,
-        x: v.value.x,
-        y: v.value.y,
+        x: d.value.x,
+        y: d.value.y,
         prevX: w.value.x,
         prevY: w.value.y,
         offsetY: e.value.style.plot.radius * 3 + e.value.style.tooltip.offsetY,
@@ -510,18 +520,18 @@ const we = { style: { backgroundColor: "#1A1A1A", zeroLine: { color: "#5A5A5A" }
         borderRadius: e.value.style.tooltip.borderRadius,
         backgroundOpacity: e.value.style.tooltip.backgroundOpacity
       }, {
-        default: Ze(() => [
-          F(t.$slots, "tooltip", be(me({ ...v.value })), () => [
-            Ke(B(v.value.period) + ": " + B(u(ae)(
+        default: He(() => [
+          D(t.$slots, "tooltip", be(me({ ...d.value })), () => [
+            Qe(B(d.value.period) + ": " + B(u(ae)(
               e.value.style.dataLabel.formatter,
-              v.value.absoluteValue,
+              d.value.absoluteValue,
               u(le)({
                 p: e.value.style.dataLabel.prefix,
-                v: v.value.absoluteValue,
+                v: d.value.absoluteValue,
                 s: e.value.style.dataLabel.suffix,
                 r: e.value.style.dataLabel.roundingValue
               }),
-              { datapoint: v.value }
+              { datapoint: d.value }
             )), 1)
           ], !0)
         ]),
@@ -533,17 +543,17 @@ const we = { style: { backgroundColor: "#1A1A1A", zeroLine: { color: "#5A5A5A" }
         ref: se,
         dir: "auto"
       }, [
-        F(t.$slots, "source", {}, void 0, !0)
+        D(t.$slots, "source", {}, void 0, !0)
       ], 512)) : h("", !0),
-      u(R) ? (n(), ge(vt, { key: 3 })) : h("", !0)
-    ], 12, yt));
+      u(R) ? (n(), ge(ct, { key: 3 })) : h("", !0)
+    ], 12, gt));
   }
-}, Rt = /* @__PURE__ */ ht(Tt, [["__scopeId", "data-v-1b368031"]]), Kt = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+}, Pt = /* @__PURE__ */ pt(Ot, [["__scopeId", "data-v-a90be8f4"]]), Qt = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
-  default: Rt
+  default: Pt
 }, Symbol.toStringTag, { value: "Module" }));
 export {
-  Zt as a,
-  Kt as b,
-  Rt as v
+  Ht as a,
+  Qt as b,
+  Pt as v
 };