vue-data-ui 3.5.2 → 3.7.0

package/dist/vue-ui-sparkgauge-CQ4Zk9-f.js

@@ -1,233 +0,0 @@
-import { defineAsyncComponent as T, ref as b, toRefs as U, onMounted as N, computed as s, watch as M, createElementBlock as r, openBlock as u, normalizeStyle as g, createCommentVNode as d, createBlock as P, toDisplayString as k, unref as i, createVNode as q, createElementVNode as m, renderSlot as F, normalizeClass as V } from "vue";
-import { u as X, a as B } from "./useNestedProp-CReNavA0.js";
-import { c as Y, t as H, o as J, f as E, g as K, ae as Q, X as W, a as Z, x, d as ee } from "./lib-C_mNZmhD.js";
-import { u as te, B as ae } from "./BaseScanner-BgWxam9d.js";
-import { u as le } from "./useChartAccessibility-9icAAmYg.js";
-import { t as oe } from "./themes-AUNCOb2G.js";
-const se = ["xmlns", "viewBox"], ue = ["width", "height"], ie = ["id"], ne = ["stop-color"], re = ["stop-color"], ve = ["d", "stroke", "stroke-linecap"], ce = ["d", "stroke", "stroke-linecap", "stroke-dashoffset"], de = ["x", "y", "width", "height"], fe = ["x", "y", "font-size", "fill", "font-weight"], me = {
-  key: 2,
-  ref: "source",
-  dir: "auto"
-}, xe = {
-  __name: "vue-ui-sparkgauge",
-  props: {
-    config: {
-      type: Object,
-      default() {
-        return {};
-      }
-    },
-    dataset: {
-      type: Object,
-      default() {
-        return {};
-      }
-    }
-  },
-  setup(D) {
-    const O = T(() => import("./PackageVersion-Y7t79Jtq.js")), { vue_ui_sparkgauge: j } = X(), c = D, _ = b(Y()), e = b(p()), { loading: h, FINAL_DATASET: v } = te({
-      ...U(c),
-      FINAL_CONFIG: e,
-      prepareConfig: p,
-      skeletonDataset: {
-        value: 0,
-        min: -1,
-        max: 1,
-        title: ""
-      },
-      skeletonConfig: H({
-        defaultConfig: e.value,
-        userConfig: {
-          style: {
-            animation: { show: !1 },
-            background: "#99999930",
-            colors: {
-              min: "#CACACA",
-              max: "#6A6A6A"
-            },
-            track: {
-              autoColor: !0
-            },
-            gutter: {
-              color: "#6A6A6A80"
-            }
-          }
-        }
-      })
-    }), { svgRef: I } = le({ config: { text: c.dataset?.title || "" } });
-    function p() {
-      const t = B({
-        userConfig: c.config,
-        defaultConfig: j
-      });
-      return t.theme ? {
-        ...B({
-          userConfig: oe.vue_ui_sparkgauge[t.theme] || c.config,
-          defaultConfig: t
-        })
-      } : t;
-    }
-    N(() => {
-      A();
-    });
-    const w = s(() => e.value.debug);
-    function A() {
-      J(c.dataset) ? E({
-        componentName: "VueUiSparkgauge",
-        type: "dataset",
-        debug: w.value
-      }) : K({
-        datasetObject: c.dataset,
-        requiredAttributes: ["value", "min", "max"]
-      }).forEach((t) => {
-        E({
-          componentName: "VueUiSparkgauge",
-          type: "datasetAttribute",
-          property: t,
-          debug: w.value
-        });
-      });
-    }
-    M(() => c.config, (t) => {
-      e.value = p(), a.value = e.value.style.animation.show ? o.value.min : v.value.value, A();
-    }, { deep: !0 });
-    const l = s(() => ({
-      height: e.value.style.height,
-      width: 128,
-      base: e.value.style.basePosition
-    })), o = s(() => {
-      const t = v.value.min ?? 0, n = v.value.max ?? 0, f = n - t;
-      return {
-        min: t,
-        max: n,
-        diff: f
-      };
-    }), a = b(e.value.style.animation.show ? o.value.min : v.value.value);
-    M(() => v.value.value, () => {
-      $(v.value.value || 0);
-    });
-    const R = s(() => a.value > o.value.max ? o.value.max : a.value < o.value.min ? o.value.min : a.value), C = s(() => o.value.diff / e.value.style.animation.speedMs);
-    N(() => {
-      $(v.value.value || 0);
-    });
-    function $(t) {
-      function n() {
-        a.value < t ? a.value = Math.min(a.value + C.value, t) : a.value > t && (a.value = Math.max(a.value - C.value, t)), a.value !== t && requestAnimationFrame(n);
-      }
-      n();
-    }
-    const y = s(() => v.value.title ?? ""), L = s(() => {
-      const t = o.value.diff;
-      if (!isFinite(t) || t === 0) return 0;
-      const n = o.value.min, f = R.value;
-      return f >= 0 ? (f - n) / t : (Math.abs(n) - Math.abs(f)) / t;
-    }), S = s(() => Q(e.value.style.colors.min, e.value.style.colors.max, o.value.min, o.value.max, a.value)), z = s(() => e.value.style.dataLabel.autoColor ? S.value : e.value.style.dataLabel.color), G = s(() => e.value.style.track.autoColor ? S.value : e.value.style.track.color);
-    return (t, n) => (u(), r("div", {
-      class: "vue-data-ui-component vue-ui-sparkgauge",
-      style: g(`font-family:${e.value.style.fontFamily};width: 100%; background:${e.value.style.background}`)
-    }, [
-      e.value.style.title.show && y.value && e.value.style.title.position === "top" ? (u(), r("div", {
-        key: 0,
-        class: "vue-data-ui-sparkgauge-label",
-        style: g(`font-size:${e.value.style.title.fontSize}px;text-align:${e.value.style.title.textAlign};font-weight:${e.value.style.title.bold ? "bold" : "normal"};color:${e.value.style.title.color}`)
-      }, k(y.value), 5)) : d("", !0),
-      (u(), r("svg", {
-        ref_key: "svgRef",
-        ref: I,
-        xmlns: i(W),
-        viewBox: `0 0 ${l.value.width} ${l.value.height}`,
-        style: "overflow: visible; background:transparent; width:100%;"
-      }, [
-        q(i(O)),
-        t.$slots["chart-background"] && !i(h) ? (u(), r("foreignObject", {
-          key: 0,
-          x: 0,
-          y: 0,
-          width: l.value.width,
-          height: l.value.height,
-          style: {
-            pointerEvents: "none"
-          }
-        }, [
-          F(t.$slots, "chart-background")
-        ], 8, ue)) : d("", !0),
-        m("defs", null, [
-          m("linearGradient", {
-            id: `gradient_${_.value}`,
-            x1: "-10%",
-            y1: "100%",
-            x2: "110%",
-            y2: "100%"
-          }, [
-            m("stop", {
-              offset: "0%",
-              "stop-color": e.value.style.colors.min
-            }, null, 8, ne),
-            m("stop", {
-              offset: "100%",
-              "stop-color": e.value.style.colors.max
-            }, null, 8, re)
-          ], 8, ie)
-        ]),
-        m("path", {
-          d: `M10 ${l.value.base} A 1 1 0 1 1 118 ${l.value.base}`,
-          stroke: e.value.style.gutter.color,
-          "stroke-width": 8,
-          "stroke-linecap": e.value.style.gutter.strokeLinecap,
-          fill: "none"
-        }, null, 8, ve),
-        L.value !== 0 ? (u(), r("path", {
-          key: 1,
-          d: `M10 ${l.value.base} A 1 1 0 1 1 118 ${l.value.base}`,
-          stroke: e.value.style.colors.showGradient ? `url(#gradient_${_.value})` : G.value,
-          "stroke-width": 8,
-          "stroke-linecap": e.value.style.track.strokeLinecap,
-          fill: "none",
-          "stroke-dasharray": 169.5,
-          "stroke-dashoffset": 169.5 - 169.5 * L.value,
-          class: V({ "vue-ui-sparkgauge-track": e.value.style.animation.show }),
-          style: g(e.value.style.animation.show ? `animation: vue-ui-sparkgauge-animation ${e.value.style.animation.speedMs}ms ease-in;` : "")
-        }, null, 14, ce)) : d("", !0),
-        i(h) ? (u(), r("rect", {
-          key: 2,
-          x: l.value.width / 2 - e.value.style.dataLabel.fontSize / 2,
-          y: l.value.base + 6 + e.value.style.dataLabel.offsetY - e.value.style.dataLabel.fontSize,
-          width: e.value.style.dataLabel.fontSize,
-          height: e.value.style.dataLabel.fontSize,
-          fill: "#6A6A6A50",
-          rx: 3
-        }, null, 8, de)) : (u(), r("text", {
-          key: 3,
-          "text-anchor": "middle",
-          x: l.value.width / 2,
-          y: l.value.base + 6 + e.value.style.dataLabel.offsetY,
-          "font-size": e.value.style.dataLabel.fontSize,
-          fill: z.value,
-          "font-weight": e.value.style.dataLabel.bold ? "bold" : "normal"
-        }, k(i(Z)(
-          e.value.style.dataLabel.formatter,
-          i(x)(a.value),
-          i(ee)({
-            p: e.value.style.dataLabel.prefix,
-            v: i(x)(a.value),
-            s: e.value.style.dataLabel.suffix,
-            r: e.value.style.dataLabel.rounding
-          }),
-          { datapoint: i(x)(a.value), color: z.value }
-        )), 9, fe))
-      ], 8, se)),
-      e.value.style.title.show && y.value && e.value.style.title.position === "bottom" ? (u(), r("div", {
-        key: 1,
-        class: "vue-data-ui-sparkgauge-label",
-        style: g(`font-size:${e.value.style.title.fontSize}px;text-align:${e.value.style.title.textAlign};font-weight:${e.value.style.title.bold ? "bold" : "normal"};font-weight:${e.value.style.title.bold ? "bold" : "normal"};color:${e.value.style.title.color}`)
-      }, k(y.value), 5)) : d("", !0),
-      t.$slots.source ? (u(), r("div", me, [
-        F(t.$slots, "source")
-      ], 512)) : d("", !0),
-      i(h) ? (u(), P(ae, { key: 3 })) : d("", !0)
-    ], 4));
-  }
-};
-export {
-  xe as default
-};

package/dist/vue-ui-sparkhistogram-BlTV9wfn.js

@@ -1,384 +0,0 @@
-import { useCssVars as be, computed as x, defineAsyncComponent as pe, ref as h, toRefs as me, onMounted as X, watch as j, nextTick as G, createElementBlock as s, openBlock as a, normalizeStyle as M, createCommentVNode as d, createBlock as q, createElementVNode as g, createTextVNode as _e, toDisplayString as b, unref as n, createVNode as ke, renderSlot as Y, Fragment as y, renderList as f, normalizeClass as P } from "vue";
-import { c as xe, t as Ce, o as Ae, f as J, g as we, s as p, a as K, d as Q, X as Le, i as H } from "./lib-C_mNZmhD.js";
-import { t as $e, u as ze } from "./useResponsive-DfdjqQps.js";
-import { u as Se, a as Z } from "./useNestedProp-CReNavA0.js";
-import { u as Me, B as Fe } from "./BaseScanner-BgWxam9d.js";
-import { u as Ie } from "./useFitSvgText-2crs6Fv5.js";
-import { u as Te } from "./useChartAccessibility-9icAAmYg.js";
-import { _ as Ee } from "./Shape-CNXKB8O0.js";
-import { t as Ne } from "./themes-AUNCOb2G.js";
-import { _ as De } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-const He = { key: 0 }, We = { key: 1 }, Ve = ["xmlns", "viewBox"], Oe = ["width", "height"], Re = ["id"], Be = ["stop-color"], Ue = ["stop-color"], Xe = ["id"], je = ["stop-color"], Ge = ["stop-color"], qe = ["id"], Ye = ["stop-color"], Pe = ["stop-color"], Je = ["height", "width", "fill", "x", "stroke", "stroke-width", "rx", "stroke-dasharray"], Ke = { key: 1 }, Qe = ["x", "y", "height", "width", "fill", "stroke", "stroke-width", "rx"], Ze = { key: 2 }, et = ["x", "y", "font-size", "font-weight", "fill"], tt = ["x", "y", "font-size", "fill"], lt = ["x", "y", "font-size", "fill"], at = ["height", "width", "x", "onMouseover", "onMouseleave", "onClick"], st = {
-  __name: "vue-ui-sparkhistogram",
-  props: {
-    config: {
-      type: Object,
-      default() {
-        return {};
-      }
-    },
-    dataset: {
-      type: Array,
-      default() {
-        return [];
-      }
-    }
-  },
-  emits: ["selectDatapoint"],
-  setup(ee, { emit: te }) {
-    be((l) => ({
-      v151ed470: ce.value
-    }));
-    const le = pe(() => import("./PackageVersion-Y7t79Jtq.js")), { vue_ui_sparkhistogram: ae } = Se(), m = ee, _ = h(xe()), W = h(null), V = h(null), F = h(null), C = h(null), L = h(null), e = h(E()), { loading: O, FINAL_DATASET: A } = Me({
-      ...me(m),
-      FINAL_CONFIG: e,
-      prepareConfig: E,
-      skeletonDataset: [
-        { value: 1, intensity: 0.2, color: "#CACACA" },
-        { value: 2, intensity: 0.3, color: "#CACACA" },
-        { value: 3, intensity: 0.5, color: "#CACACA" },
-        { value: 5, intensity: 0.7, color: "#CACACA" },
-        { value: 8, intensity: 0.9, color: "#CACACA" },
-        { value: 13, intensity: 0.95, color: "#CACACA" },
-        { value: 21, intensity: 1, color: "#CACACA" },
-        { value: 13, intensity: 0.95, color: "#CACACA" },
-        { value: 8, intensity: 0.9, color: "#CACACA" },
-        { value: 5, intensity: 0.7, color: "#CACACA" },
-        { value: 3, intensity: 0.5, color: "#CACACA" },
-        { value: 2, intensity: 0.3, color: "#CACACA" },
-        { value: 1, intensity: 0.2, color: "#CACACA" }
-      ],
-      skeletonConfig: Ce({
-        defaultConfig: e.value,
-        userConfig: {
-          style: {
-            animation: { show: !1 },
-            backgroundColor: "#99999930"
-          }
-        }
-      })
-    }), I = h(e.value.style.layout.width), T = h(e.value.style.layout.height), { svgRef: R } = Te({ config: e.value.style.title });
-    function E() {
-      const l = Z({
-        userConfig: m.config,
-        defaultConfig: ae
-      });
-      return l.theme ? {
-        ...Z({
-          userConfig: Ne.vue_ui_sparkhistogram[l.theme] || m.config,
-          defaultConfig: l
-        })
-      } : l;
-    }
-    X(() => {
-      U();
-    });
-    const B = x(() => !!e.value.debug);
-    function U() {
-      if (Ae(m.dataset) ? J({
-        componentName: "VueUiSparkHistogram",
-        type: "dataset",
-        debug: B.value
-      }) : m.dataset.forEach((l, i) => {
-        we({
-          datasetObject: l,
-          requiredAttributes: ["value"]
-        }).forEach((t) => {
-          J({
-            componentName: "VueUiSparkHistogram",
-            type: "datasetSerieAttribute",
-            property: t,
-            index: i,
-            debug: B.value
-          });
-        });
-      }), e.value.responsive) {
-        const l = $e(() => {
-          const { width: i, height: t } = ze({
-            chart: F.value,
-            title: e.value.style.title.text ? V.value : null,
-            source: W.value
-          }), o = e.value.style.labels.timeLabel.show ? e.value.style.labels.timeLabel.fontSize * 2 : 0, c = e.value.style.labels.valueLabel.show ? e.value.style.labels.valueLabel.fontSize * 2 : 0;
-          requestAnimationFrame(() => {
-            I.value = Math.max(10, i), T.value = Math.max(10, t - 12 - o - c);
-          });
-        });
-        C.value && (L.value && C.value.unobserve(L.value), C.value.disconnect()), C.value = new ResizeObserver(l), L.value = F.value.parentNode, C.value.observe(L.value);
-      }
-    }
-    j(() => m.config, (l) => {
-      e.value = E(), U();
-    }, { deep: !0 });
-    const v = x(() => {
-      const l = e.value.style.labels.timeLabel.show ? e.value.style.labels.timeLabel.fontSize * 2 : 0, i = e.value.style.labels.valueLabel.show ? e.value.style.labels.valueLabel.fontSize * 2 : 0, t = T.value + l + i, o = I.value, c = e.value.style.layout.padding.top, $ = t - e.value.style.layout.padding.bottom, z = e.value.style.layout.padding.left, N = o - e.value.style.layout.padding.right, S = c + (t - c - e.value.style.layout.padding.bottom) / 2, D = t - e.value.style.layout.padding.top - e.value.style.layout.padding.bottom - l - i, w = o - e.value.style.layout.padding.left - e.value.style.layout.padding.right;
-      return {
-        bottom: $,
-        centerY: S,
-        drawingHeight: D,
-        drawingWidth: w,
-        height: t,
-        left: z,
-        right: N,
-        top: c,
-        width: o
-      };
-    }), se = x(() => Math.max(...A.value.map((l) => Math.abs(l.value || 0))));
-    function oe(l) {
-      return Math.abs(l) / se.value;
-    }
-    const u = x(() => A.value.map((l, i) => {
-      const t = oe(l.value || 0), o = v.value.drawingHeight * t, c = v.value.drawingWidth / A.value.length, $ = c * (e.value.style.bars.gap / 100), z = c - $, N = v.value.centerY - o / 2, S = v.value.left + ($ / 2 + i * c), D = v.value.left + i * c, w = typeof l.intensity > "u" ? 100 : Math.round(l.intensity * 100), ye = l.color ? l.color : l.value >= 0 ? p(e.value.style.bars.colors.positive, w) : p(e.value.style.bars.colors.negative, w), he = l.color ? l.color : l.value >= 0 ? e.value.style.bars.colors.positive : e.value.style.bars.colors.negative, fe = l.color ? `url(#gradient_datapoint_${i}_${_.value})` : l.value >= 0 ? `url(#gradient_positive_${i}_${_.value})` : `url(#gradient_negative_${i}_${_.value})`, ge = S + z / 2;
-      return {
-        ...l,
-        color: ye,
-        gradient: fe,
-        height: o,
-        intensity: w,
-        proportion: t,
-        stroke: he,
-        textAnchor: ge,
-        trapX: D,
-        unitWidth: c,
-        width: z,
-        x: S,
-        y: N
-      };
-    }));
-    function ie(l, i) {
-      return K(
-        e.value.style.labels.value.formatter,
-        l.value,
-        Q({
-          p: e.value.style.labels.value.prefix,
-          v: l.value,
-          s: e.value.style.labels.value.suffix,
-          r: e.value.style.labels.value.rounding
-        }),
-        { datapoint: l, seriesIndex: i }
-      );
-    }
-    const r = h(null), ue = te;
-    function ne(l, i) {
-      ue("selectDatapoint", { datapoint: l, index: i }), e.value.events.datapointClick && e.value.events.datapointClick({ datapoint: l, seriesIndex: i });
-    }
-    function re(l, i) {
-      r.value = i, e.value.events.datapointEnter && e.value.events.datapointEnter({ datapoint: l, seriesIndex: i });
-    }
-    function ve(l, i) {
-      r.value = null, e.value.events.datapointLeave && e.value.events.datapointLeave({ datapoint: l, seriesIndex: i });
-    }
-    const ce = x(() => `${e.value.style.animation.speedMs}ms`), de = x(() => v.value.drawingWidth / A.value.length * 0.9), { fitText: k } = Ie({
-      svgRef: R,
-      unitWidth: de
-    });
-    return X(async () => {
-      await G(), k(".vue-ui-sparkhistogram-top-label", e.value.style.labels.value.minFontSize), k(".vue-ui-sparkhistogram-bottom-label", e.value.style.labels.valueLabel.minFontSize), k(".vue-ui-sparkhistogram-time-label", e.value.style.labels.timeLabel.minFontSize);
-    }), j([I, T, () => A.value], async () => {
-      await G(), k(".vue-ui-sparkhistogram-top-label", e.value.style.labels.value.minFontSize), k(".vue-ui-sparkhistogram-bottom-label", e.value.style.labels.valueLabel.minFontSize), k(".vue-ui-sparkhistogram-time-label", e.value.style.labels.timeLabel.minFontSize);
-    }), (l, i) => (a(), s("div", {
-      class: "vue-data-ui-component vue-ui-spark-histogram",
-      ref_key: "histogramChart",
-      ref: F,
-      style: M(`width:100%;background:${e.value.style.backgroundColor};font-family:${e.value.style.fontFamily}`),
-      onMouseleave: i[0] || (i[0] = (t) => r.value = null)
-    }, [
-      e.value.style.title.text ? (a(), s("div", {
-        key: 0,
-        ref_key: "chartTitle",
-        ref: V,
-        style: M(`width:calc(100% - 12px);background:transparent;margin:0 auto;margin:${e.value.style.title.margin};padding: 0 6px;text-align:${e.value.style.title.textAlign}`)
-      }, [
-        g("div", {
-          style: M(`font-size:${e.value.style.title.fontSize}px;color:${e.value.style.title.color};font-weight:${e.value.style.title.bold ? "bold" : "normal"}`)
-        }, [
-          _e(b(e.value.style.title.text) + " ", 1),
-          r.value !== null ? (a(), s("span", He, "- " + b(u.value[r.value].timeLabel || "") + " " + b(n(K)(
-            e.value.style.labels.value.formatter,
-            u.value[r.value].value,
-            n(Q)({
-              p: e.value.style.labels.value.prefix,
-              v: u.value[r.value].value,
-              s: e.value.style.labels.value.suffix,
-              r: e.value.style.labels.value.rounding
-            }),
-            { datapoint: u.value[r.value], seriesIndex: r.value }
-          )), 1)) : d("", !0),
-          ![void 0, null].includes(r.value) && ![null, void 0].includes(u.value[r.value].valueLabel) ? (a(), s("span", We, b(` (${u.value[r.value].valueLabel || 0})`), 1)) : d("", !0)
-        ], 4),
-        e.value.style.title.subtitle.text ? (a(), s("div", {
-          key: 0,
-          style: M(`font-size:${e.value.style.title.subtitle.fontSize}px;color:${e.value.style.title.subtitle.color};font-weight:${e.value.style.title.subtitle.bold ? "bold" : "normal"}`)
-        }, b(e.value.style.title.subtitle.text), 5)) : d("", !0)
-      ], 4)) : d("", !0),
-      (a(), s("svg", {
-        ref_key: "svgRef",
-        ref: R,
-        xmlns: n(Le),
-        viewBox: `0 0 ${v.value.width} ${v.value.height}`,
-        style: { overflow: "visible" }
-      }, [
-        ke(n(le)),
-        l.$slots["chart-background"] ? (a(), s("foreignObject", {
-          key: 0,
-          x: 0,
-          y: 0,
-          width: v.value.width,
-          height: v.value.height,
-          style: {
-            pointerEvents: "none"
-          }
-        }, [
-          Y(l.$slots, "chart-background", {}, void 0, !0)
-        ], 8, Oe)) : d("", !0),
-        g("defs", null, [
-          (a(!0), s(y, null, f(u.value, (t, o) => (a(), s("radialGradient", {
-            id: `gradient_positive_${o}_${_.value}`,
-            cy: "50%",
-            cx: "50%",
-            r: "50%",
-            fx: "50%",
-            fy: "50%"
-          }, [
-            g("stop", {
-              offset: "0%",
-              "stop-color": n(p)(n(H)(e.value.style.bars.colors.positive, 0.05), t.intensity)
-            }, null, 8, Be),
-            g("stop", {
-              offset: "100%",
-              "stop-color": n(p)(e.value.style.bars.colors.positive, t.intensity)
-            }, null, 8, Ue)
-          ], 8, Re))), 256)),
-          (a(!0), s(y, null, f(u.value, (t, o) => (a(), s("radialGradient", {
-            id: `gradient_negative_${o}_${_.value}`,
-            cy: "50%",
-            cx: "50%",
-            r: "50%",
-            fx: "50%",
-            fy: "50%"
-          }, [
-            g("stop", {
-              offset: "0%",
-              "stop-color": n(p)(n(H)(e.value.style.bars.colors.negative, 0.05), t.intensity)
-            }, null, 8, je),
-            g("stop", {
-              offset: "100%",
-              "stop-color": n(p)(e.value.style.bars.colors.negative, t.intensity)
-            }, null, 8, Ge)
-          ], 8, Xe))), 256)),
-          (a(!0), s(y, null, f(u.value, (t, o) => (a(), s("radialGradient", {
-            id: `gradient_datapoint_${o}_${_.value}`,
-            cy: "50%",
-            cx: "50%",
-            r: "50%",
-            fx: "50%",
-            fy: "50%"
-          }, [
-            g("stop", {
-              offset: "0%",
-              "stop-color": n(p)(n(H)(t.color, 0.05), t.intensity)
-            }, null, 8, Ye),
-            g("stop", {
-              offset: "100%",
-              "stop-color": n(p)(t.color, t.intensity)
-            }, null, 8, Pe)
-          ], 8, qe))), 256))
-        ]),
-        (a(!0), s(y, null, f(u.value, (t, o) => (a(), s("g", null, [
-          r.value !== null && r.value === o ? (a(), s("rect", {
-            key: 0,
-            height: v.value.height,
-            width: t.unitWidth,
-            fill: e.value.style.selector.fill,
-            x: t.trapX,
-            y: 0,
-            stroke: e.value.style.selector.stroke,
-            "stroke-width": e.value.style.selector.strokeWidth,
-            rx: e.value.style.selector.borderRadius,
-            "stroke-dasharray": e.value.style.selector.strokeDasharray
-          }, null, 8, Je)) : d("", !0)
-        ]))), 256)),
-        !e.value.style.bars.shape || e.value.style.bars.shape === "square" ? (a(), s("g", Ke, [
-          (a(!0), s(y, null, f(u.value, (t, o) => (a(), s("rect", {
-            x: t.x,
-            y: t.y,
-            height: t.height,
-            width: t.width,
-            fill: e.value.style.bars.colors.gradient.show ? t.gradient : t.color,
-            stroke: t.stroke,
-            "stroke-width": e.value.style.bars.strokeWidth,
-            rx: `${e.value.style.bars.borderRadius * t.proportion / 12}%`,
-            class: P({ "vue-ui-sparkhistogram-shape": e.value.style.animation.show })
-          }, null, 10, Qe))), 256))
-        ])) : (a(), s("g", Ze, [
-          (a(!0), s(y, null, f(u.value, (t, o) => (a(), q(Ee, {
-            plot: { x: t.x + t.width / 2, y: t.y + t.height / 2 },
-            color: e.value.style.bars.colors.gradient.show ? t.gradient : t.color,
-            shape: e.value.style.bars.shape,
-            radius: Math.min(t.height * 0.4, t.width * 0.4),
-            class: P({ "vue-ui-sparkhistogram-shape": e.value.style.animation.show })
-          }, null, 8, ["plot", "color", "shape", "radius", "class"]))), 256))
-        ])),
-        n(O) ? d("", !0) : (a(), s(y, { key: 3 }, [
-          (a(!0), s(y, null, f(u.value, (t, o) => (a(), s("g", null, [
-            e.value.style.labels.value.show ? (a(), s("text", {
-              key: 0,
-              class: "vue-ui-sparkhistogram-top-label",
-              "text-anchor": "middle",
-              x: t.textAnchor,
-              y: t.y - e.value.style.labels.value.fontSize / 3 + e.value.style.labels.value.offsetY,
-              "font-size": e.value.style.labels.value.fontSize,
-              "font-weight": e.value.style.labels.value.bold ? "bold" : "normal",
-              fill: e.value.style.labels.value.color
-            }, b(ie(t, o)), 9, et)) : d("", !0)
-          ]))), 256)),
-          (a(!0), s(y, null, f(u.value, (t, o) => (a(), s("g", null, [
-            t.valueLabel && e.value.style.labels.valueLabel.show ? (a(), s("text", {
-              key: 0,
-              class: "vue-ui-sparkhistogram-bottom-label",
-              x: t.textAnchor,
-              y: t.y + t.height + e.value.style.labels.valueLabel.fontSize,
-              "font-size": e.value.style.labels.valueLabel.fontSize,
-              "text-anchor": "middle",
-              fill: e.value.style.labels.valueLabel.color
-            }, b(t.valueLabel), 9, tt)) : d("", !0)
-          ]))), 256)),
-          (a(!0), s(y, null, f(u.value, (t, o) => (a(), s("g", null, [
-            t.timeLabel && e.value.style.labels.timeLabel.show ? (a(), s("text", {
-              key: 0,
-              class: "vue-ui-sparkhistogram-time-label",
-              x: t.textAnchor,
-              y: v.value.height,
-              "font-size": e.value.style.labels.timeLabel.fontSize,
-              fill: e.value.style.labels.timeLabel.color,
-              "text-anchor": "middle"
-            }, b(t.timeLabel), 9, lt)) : d("", !0)
-          ]))), 256))
-        ], 64)),
-        (a(!0), s(y, null, f(u.value, (t, o) => (a(), s("g", null, [
-          g("rect", {
-            height: v.value.height,
-            width: t.unitWidth,
-            fill: "transparent",
-            x: t.trapX,
-            y: 0,
-            onMouseover: (c) => re(t, o),
-            onMouseleave: (c) => ve(t, o),
-            onClick: () => ne(t, o)
-          }, null, 40, at)
-        ]))), 256))
-      ], 8, Ve)),
-      l.$slots.source ? (a(), s("div", {
-        key: 1,
-        ref_key: "source",
-        ref: W,
-        dir: "auto"
-      }, [
-        Y(l.$slots, "source", {}, void 0, !0)
-      ], 512)) : d("", !0),
-      n(O) ? (a(), q(Fe, { key: 2 })) : d("", !0)
-    ], 36));
-  }
-}, ft = /* @__PURE__ */ De(st, [["__scopeId", "data-v-7f6b6b54"]]);
-export {
-  ft as default
-};