vlite3 1.2.4 → 1.2.7

package/components/Chart/SpeedometerChart.vue.d.ts

@@ -0,0 +1,54 @@
+export type SpeedometerVariant = 'classic' | 'modern' | 'sport' | 'minimal';
+export interface SpeedometerChartProps {
+    /** Current speed / value */
+    value: number;
+    /** Minimum value on the scale (default 0) */
+    min?: number;
+    /** Maximum value on the scale (default 240) */
+    max?: number;
+    /**
+     * classic — Traditional car speedometer with full tick marks and numbers
+     * modern — Sleek dark-themed speedometer with glowing accents
+     * sport  — Racing-style with red-zone, aggressive ticks
+     * minimal — Clean minimal speedometer with fewer markings
+     */
+    variant?: SpeedometerVariant;
+    /** SVG bounding diameter in px */
+    size?: number;
+    /** Opening gap at the bottom, in degrees (default 60) */
+    gapAngle?: number;
+    /** Semantic color name ('primary', 'success', etc.) or any CSS color */
+    color?: string;
+    /** Needle color — defaults to 'danger' for sport, color for others */
+    needleColor?: string;
+    /** Step between major tick labels (e.g. 20 → 0, 20, 40, 60, ...) */
+    majorStep?: number;
+    /** Number of minor ticks between major ticks */
+    minorTicks?: number;
+    /** Unit label (e.g. 'km/h', 'mph', 'RPM') */
+    unit?: string;
+    /** Show the current value in the center */
+    showValue?: boolean;
+    /** Custom value formatter */
+    formatValue?: (v: number) => string;
+    /** Primary label (e.g. vehicle model or metric name) */
+    label?: string;
+    /** Start of the danger zone (absolute value). Rendered in red/danger color. */
+    redZoneStart?: number;
+    /** Animate needle sweep on mount and value change */
+    animate?: boolean;
+}
+declare const _default: import('vue').DefineComponent<SpeedometerChartProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<SpeedometerChartProps> & Readonly<{}>, {
+    animate: boolean;
+    color: string;
+    variant: SpeedometerVariant;
+    size: number;
+    unit: string;
+    min: number;
+    max: number;
+    showValue: boolean;
+    gapAngle: number;
+    majorStep: number;
+    minorTicks: number;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+export default _default;

package/components/Chart/SpeedometerChart.vue.js

@@ -0,0 +1,558 @@
+import { defineComponent as fe, computed as i, ref as ye, onMounted as me, watch as xe, onUnmounted as ge, openBlock as o, createElementBlock as a, createElementVNode as n, unref as f, createCommentVNode as c, Fragment as M, renderList as j, toDisplayString as y, normalizeStyle as S } from "vue";
+import { resolveColor as ae, clamp as ke, animateProgress as we } from "./utils.js";
+const be = { class: "vlite-speedometer-chart inline-flex flex-col items-center gap-1 select-none" }, Se = ["width", "height", "viewBox", "aria-label"], $e = ["id"], pe = ["stop-color"], ze = ["stop-color"], Me = ["id"], je = ["flood-color"], Ze = ["id"], Fe = ["stop-color"], Ve = ["id"], Ce = ["id"], Ae = { key: 0 }, Pe = ["d", "stroke-width"], Re = ["d", "stroke", "stroke-width"], Be = ["d", "stroke", "stroke-width"], De = ["x1", "y1", "x2", "y2", "stroke", "stroke-width", "opacity"], Ie = ["x", "y", "font-size", "fill", "opacity"], Le = ["filter"], Te = ["d", "fill"], Xe = ["cx", "cy", "r", "fill"], Ye = ["x", "y", "width", "height"], Ge = {
+  xmlns: "http://www.w3.org/1999/xhtml",
+  class: "w-full h-full flex flex-col items-center justify-center text-center"
+}, Ne = { key: 1 }, Oe = ["cx", "cy", "r"], _e = ["d", "stroke-width"], We = ["d", "stroke", "stroke-width"], Ee = ["filter"], Ue = ["d", "stroke", "stroke-width"], qe = ["x1", "y1", "x2", "y2", "stroke", "stroke-width", "opacity"], He = ["x", "y", "font-size", "fill", "opacity"], Je = ["filter"], Ke = ["d", "fill"], Qe = ["cx", "cy", "r", "fill"], et = ["x", "y", "width", "height"], tt = {
+  xmlns: "http://www.w3.org/1999/xhtml",
+  class: "w-full h-full flex flex-col items-center justify-center text-center"
+}, lt = { key: 2 }, ot = ["cx", "cy", "r"], at = ["cx", "cy", "r"], nt = ["d", "stroke-width"], rt = ["d", "stroke", "stroke-width"], it = ["d", "stroke", "stroke-width", "filter"], st = ["x1", "y1", "x2", "y2", "stroke", "stroke-width", "opacity"], ut = ["x", "y", "font-size", "fill", "opacity"], ct = ["filter"], dt = ["d", "fill"], vt = ["cx", "cy", "r", "stroke"], ht = ["cx", "cy", "r", "fill"], ft = ["x", "y", "width", "height"], yt = {
+  xmlns: "http://www.w3.org/1999/xhtml",
+  class: "w-full h-full flex flex-col items-center justify-center text-center"
+}, mt = { key: 3 }, xt = ["d", "stroke-width"], gt = ["d", "stroke", "stroke-width"], kt = ["x1", "y1", "x2", "y2", "stroke-width"], wt = ["x", "y", "font-size"], bt = ["filter"], St = ["d", "fill"], $t = ["cx", "cy", "r"], pt = ["x", "y", "width", "height"], zt = {
+  xmlns: "http://www.w3.org/1999/xhtml",
+  class: "w-full h-full flex flex-col items-center justify-center text-center"
+}, Zt = /* @__PURE__ */ fe({
+  __name: "SpeedometerChart",
+  props: {
+    value: {},
+    min: { default: 0 },
+    max: { default: 240 },
+    variant: { default: "classic" },
+    size: { default: 280 },
+    gapAngle: { default: 60 },
+    color: { default: "primary" },
+    needleColor: {},
+    majorStep: { default: 20 },
+    minorTicks: { default: 4 },
+    unit: { default: "km/h" },
+    showValue: { type: Boolean, default: !0 },
+    formatValue: {},
+    label: {},
+    redZoneStart: {},
+    animate: { type: Boolean, default: !0 }
+  },
+  setup(t) {
+    const l = t, v = Math.random().toString(36).slice(2, 8), A = i(() => 360 - l.gapAngle), $ = i(() => 90 + l.gapAngle / 2), h = i(() => l.size / 2), m = i(() => l.size / 2), k = i(() => (l.size - 8) / 2 - 24), G = (r) => ke((r - l.min) / (l.max - l.min), 0, 1);
+    function D(r, s) {
+      const e = r * Math.PI / 180;
+      return [h.value + s * Math.cos(e), m.value + s * Math.sin(e)];
+    }
+    function K(r, s, e) {
+      const u = s - r;
+      if (Math.abs(u) < 0.01) return "";
+      const w = Math.abs(u) > 180 ? 1 : 0, g = u > 0 ? 1 : 0, [T, X] = D(r, e), [C, b] = D(s, e);
+      return `M ${T},${X} A ${e},${e} 0 ${w} ${g} ${C},${b}`;
+    }
+    const Q = i(() => G(l.value)), Z = ye(l.animate ? 0 : Q.value);
+    let ee = null;
+    function oe(r) {
+      ee?.();
+      const s = Z.value;
+      ee = we(1200, (e) => {
+        Z.value = s + (r - s) * e;
+      });
+    }
+    me(() => {
+      l.animate && oe(Q.value);
+    }), xe(Q, (r) => {
+      l.animate ? oe(r) : Z.value = r;
+    }), ge(() => ee?.());
+    const P = i(() => ae(l.color ?? "primary")), F = i(() => l.needleColor ? ae(l.needleColor) : l.variant === "sport" ? "#ef4444" : P.value), d = i(() => "#ef4444"), p = i(() => {
+      const r = [], s = l.max - l.min, e = Math.floor(s / l.majorStep), u = l.minorTicks + 1, w = e * u, g = k.value, T = g - (l.variant === "minimal" ? 10 : l.variant === "sport" ? 16 : 14), X = g - (l.variant === "minimal" ? 6 : l.variant === "sport" ? 9 : 8), C = g - (l.variant === "minimal" ? 22 : l.variant === "sport" ? 28 : 26);
+      for (let b = 0; b <= w; b++) {
+        const H = l.min + s * b / w, le = G(H), B = $.value + A.value * le, Y = b % u === 0, ie = Y ? T : X, [se, ue] = D(B, g), [ce, de] = D(B, ie), J = { angle: B, x1: se, y1: ue, x2: ce, y2: de, isMajor: Y };
+        if (Y) {
+          const [ve, he] = D(B, C);
+          J.label = String(Math.round(H)), J.labelX = ve, J.labelY = he;
+        }
+        r.push(J);
+      }
+      return r;
+    }), N = i(
+      () => K($.value, $.value + A.value, k.value)
+    ), z = i(() => {
+      const r = A.value * Z.value;
+      return r < 0.01 ? "" : K($.value, $.value + r, k.value);
+    }), R = i(() => {
+      if (l.redZoneStart == null) return "";
+      const r = G(l.redZoneStart), s = $.value + A.value * r, e = $.value + A.value;
+      return K(s, e, k.value);
+    }), ne = i(() => $.value + A.value * Z.value), O = i(() => {
+      const r = k.value * 0.82, s = k.value * 0.15, e = l.variant === "sport" ? 5 : l.variant === "minimal" ? 3 : 4.5, w = ne.value * Math.PI / 180, g = w + Math.PI / 2, T = h.value + r * Math.cos(w), X = m.value + r * Math.sin(w), C = h.value - s * Math.cos(w), b = m.value - s * Math.sin(w), H = C + e * Math.cos(g), le = b + e * Math.sin(g), B = C - e * Math.cos(g), Y = b - e * Math.sin(g);
+      return `M ${T},${X} L ${H},${le} L ${C},${b} L ${B},${Y} Z`;
+    }), I = i(() => l.variant === "sport" ? 10 : l.variant === "minimal" ? 7 : 9), L = i(() => {
+      const r = l.min + (l.max - l.min) * Z.value;
+      return l.formatValue ? l.formatValue(r) : String(Math.round(r));
+    }), _ = i(() => Math.max(16, l.size * 0.14)), W = i(() => Math.max(9, l.size * 0.048)), re = i(() => Math.max(9, l.size * 0.042)), E = i(() => Math.max(8, l.size * 0.042)), x = i(() => l.variant === "minimal" ? 3 : l.variant === "sport" ? 6 : l.variant === "modern" ? 5 : 4), U = i(() => l.variant === "sport" ? 2.5 : l.variant === "minimal" ? 1.5 : 2), te = i(() => l.variant === "sport" ? 1.5 : (l.variant === "minimal", 1)), V = i(() => l.redZoneStart == null ? !1 : l.min + (l.max - l.min) * Z.value >= l.redZoneStart), q = i(() => m.value + k.value * 0.35);
+    return (r, s) => (o(), a("div", be, [
+      (o(), a("svg", {
+        width: t.size,
+        height: t.size,
+        viewBox: `0 0 ${t.size} ${t.size}`,
+        role: "img",
+        "aria-label": `Speedometer: ${L.value} ${t.unit}`,
+        class: "overflow-visible"
+      }, [
+        n("defs", null, [
+          n("linearGradient", {
+            id: `spg-${f(v)}`,
+            x1: "0",
+            y1: "0",
+            x2: "1",
+            y2: "0"
+          }, [
+            n("stop", {
+              offset: "0%",
+              "stop-color": P.value,
+              "stop-opacity": "0.3"
+            }, null, 8, pe),
+            n("stop", {
+              offset: "100%",
+              "stop-color": P.value
+            }, null, 8, ze)
+          ], 8, $e),
+          n("filter", {
+            id: `ns-${f(v)}`,
+            x: "-50%",
+            y: "-50%",
+            width: "200%",
+            height: "200%"
+          }, [
+            n("feDropShadow", {
+              dx: "0",
+              dy: "1",
+              stdDeviation: "2",
+              "flood-color": F.value,
+              "flood-opacity": "0.4"
+            }, null, 8, je)
+          ], 8, Me),
+          n("radialGradient", {
+            id: `sh-${f(v)}`
+          }, [
+            s[0] || (s[0] = n("stop", {
+              offset: "0%",
+              "stop-color": "var(--color-foreground)",
+              "stop-opacity": "0.9"
+            }, null, -1)),
+            n("stop", {
+              offset: "100%",
+              "stop-color": F.value
+            }, null, 8, Fe)
+          ], 8, Ze),
+          n("filter", {
+            id: `glow-${f(v)}`,
+            x: "-30%",
+            y: "-30%",
+            width: "160%",
+            height: "160%"
+          }, [...s[1] || (s[1] = [
+            n("feGaussianBlur", {
+              stdDeviation: "3",
+              result: "blur"
+            }, null, -1),
+            n("feMerge", null, [
+              n("feMergeNode", { in: "blur" }),
+              n("feMergeNode", { in: "SourceGraphic" })
+            ], -1)
+          ])], 8, Ve),
+          n("filter", {
+            id: `as-${f(v)}`,
+            x: "-10%",
+            y: "-10%",
+            width: "120%",
+            height: "120%"
+          }, [...s[2] || (s[2] = [
+            n("feDropShadow", {
+              dx: "0",
+              dy: "1",
+              stdDeviation: "2",
+              "flood-opacity": "0.1"
+            }, null, -1)
+          ])], 8, Ce)
+        ]),
+        t.variant === "classic" ? (o(), a("g", Ae, [
+          n("path", {
+            d: N.value,
+            fill: "none",
+            stroke: "var(--color-muted)",
+            "stroke-width": x.value,
+            "stroke-linecap": "butt",
+            opacity: "0.5"
+          }, null, 8, Pe),
+          R.value ? (o(), a("path", {
+            key: 0,
+            d: R.value,
+            fill: "none",
+            stroke: d.value,
+            "stroke-width": x.value + 2,
+            "stroke-linecap": "butt",
+            opacity: "0.25"
+          }, null, 8, Re)) : c("", !0),
+          z.value ? (o(), a("path", {
+            key: 1,
+            d: z.value,
+            fill: "none",
+            stroke: P.value,
+            "stroke-width": x.value,
+            "stroke-linecap": "round",
+            opacity: "0.6"
+          }, null, 8, Be)) : c("", !0),
+          (o(!0), a(M, null, j(p.value, (e, u) => (o(), a("line", {
+            key: `t-${u}`,
+            x1: e.x1,
+            y1: e.y1,
+            x2: e.x2,
+            y2: e.y2,
+            stroke: t.redZoneStart != null && l.min + (l.max - l.min) * G(parseFloat(e.label ?? "0")) >= t.redZoneStart && e.isMajor ? d.value : "var(--color-foreground)",
+            "stroke-width": e.isMajor ? U.value : te.value,
+            opacity: e.isMajor ? 0.8 : 0.35,
+            "stroke-linecap": "round"
+          }, null, 8, De))), 128)),
+          (o(!0), a(M, null, j(p.value.filter((e) => e.isMajor), (e, u) => (o(), a("text", {
+            key: `tl-${u}`,
+            x: e.labelX,
+            y: e.labelY,
+            "text-anchor": "middle",
+            "dominant-baseline": "central",
+            "font-size": E.value,
+            "font-weight": "600",
+            fill: t.redZoneStart != null && parseFloat(e.label ?? "0") >= t.redZoneStart ? d.value : "var(--color-foreground)",
+            opacity: t.redZoneStart != null && parseFloat(e.label ?? "0") >= t.redZoneStart ? 0.9 : 0.7
+          }, y(e.label), 9, Ie))), 128)),
+          n("g", {
+            filter: `url(#ns-${f(v)})`
+          }, [
+            n("path", {
+              d: O.value,
+              fill: F.value,
+              "fill-opacity": 0.9
+            }, null, 8, Te)
+          ], 8, Le),
+          n("circle", {
+            cx: h.value,
+            cy: m.value,
+            r: I.value,
+            fill: `url(#sh-${f(v)})`,
+            stroke: "var(--color-background)",
+            "stroke-width": "2"
+          }, null, 8, Xe),
+          (o(), a("foreignObject", {
+            x: h.value - t.size * 0.3,
+            y: q.value - t.size * 0.06,
+            width: t.size * 0.6,
+            height: t.size * 0.18
+          }, [
+            n("div", Ge, [
+              t.showValue ? (o(), a("span", {
+                key: 0,
+                class: "font-black tabular-nums leading-none",
+                style: S({ fontSize: `${_.value}px`, color: V.value ? d.value : "var(--color-foreground)" })
+              }, y(L.value), 5)) : c("", !0),
+              t.unit ? (o(), a("span", {
+                key: 1,
+                class: "font-medium leading-tight mt-0.5",
+                style: S({ fontSize: `${W.value}px`, color: "var(--color-muted-foreground)" })
+              }, y(t.unit), 5)) : c("", !0)
+            ])
+          ], 8, Ye))
+        ])) : t.variant === "modern" ? (o(), a("g", Ne, [
+          n("circle", {
+            cx: h.value,
+            cy: m.value,
+            r: k.value + 8,
+            fill: "none",
+            stroke: "var(--color-muted)",
+            "stroke-width": "1",
+            opacity: "0.2"
+          }, null, 8, Oe),
+          n("path", {
+            d: N.value,
+            fill: "none",
+            stroke: "var(--color-muted)",
+            "stroke-width": x.value,
+            "stroke-linecap": "round",
+            opacity: "0.3"
+          }, null, 8, _e),
+          R.value ? (o(), a("path", {
+            key: 0,
+            d: R.value,
+            fill: "none",
+            stroke: d.value,
+            "stroke-width": x.value + 1,
+            "stroke-linecap": "butt",
+            opacity: "0.2"
+          }, null, 8, We)) : c("", !0),
+          z.value ? (o(), a("g", {
+            key: 1,
+            filter: `url(#glow-${f(v)})`
+          }, [
+            n("path", {
+              d: z.value,
+              fill: "none",
+              stroke: `url(#spg-${f(v)})`,
+              "stroke-width": x.value + 1,
+              "stroke-linecap": "round"
+            }, null, 8, Ue)
+          ], 8, Ee)) : c("", !0),
+          (o(!0), a(M, null, j(p.value, (e, u) => (o(), a("line", {
+            key: `t-${u}`,
+            x1: e.x1,
+            y1: e.y1,
+            x2: e.x2,
+            y2: e.y2,
+            stroke: t.redZoneStart != null && e.isMajor && parseFloat(e.label ?? "0") >= t.redZoneStart ? d.value : "var(--color-foreground)",
+            "stroke-width": e.isMajor ? U.value : te.value,
+            opacity: e.isMajor ? 0.6 : 0.2,
+            "stroke-linecap": "round"
+          }, null, 8, qe))), 128)),
+          (o(!0), a(M, null, j(p.value.filter((e) => e.isMajor), (e, u) => (o(), a("text", {
+            key: `tl-${u}`,
+            x: e.labelX,
+            y: e.labelY,
+            "text-anchor": "middle",
+            "dominant-baseline": "central",
+            "font-size": E.value,
+            "font-weight": "500",
+            fill: t.redZoneStart != null && parseFloat(e.label ?? "0") >= t.redZoneStart ? d.value : "var(--color-foreground)",
+            opacity: t.redZoneStart != null && parseFloat(e.label ?? "0") >= t.redZoneStart ? 0.8 : 0.55
+          }, y(e.label), 9, He))), 128)),
+          n("g", {
+            filter: `url(#ns-${f(v)})`
+          }, [
+            n("path", {
+              d: O.value,
+              fill: F.value,
+              "fill-opacity": 0.85
+            }, null, 8, Ke)
+          ], 8, Je),
+          n("circle", {
+            cx: h.value,
+            cy: m.value,
+            r: I.value,
+            fill: `url(#sh-${f(v)})`,
+            stroke: "var(--color-background)",
+            "stroke-width": "2"
+          }, null, 8, Qe),
+          (o(), a("foreignObject", {
+            x: h.value - t.size * 0.3,
+            y: q.value - t.size * 0.06,
+            width: t.size * 0.6,
+            height: t.size * 0.18
+          }, [
+            n("div", tt, [
+              t.showValue ? (o(), a("span", {
+                key: 0,
+                class: "font-black tabular-nums leading-none",
+                style: S({ fontSize: `${_.value}px`, color: V.value ? d.value : "var(--color-foreground)" })
+              }, y(L.value), 5)) : c("", !0),
+              t.unit ? (o(), a("span", {
+                key: 1,
+                class: "font-medium leading-tight mt-0.5",
+                style: S({ fontSize: `${W.value}px`, color: "var(--color-muted-foreground)" })
+              }, y(t.unit), 5)) : c("", !0)
+            ])
+          ], 8, et))
+        ])) : t.variant === "sport" ? (o(), a("g", lt, [
+          n("circle", {
+            cx: h.value,
+            cy: m.value,
+            r: k.value + 12,
+            fill: "none",
+            stroke: "var(--color-foreground)",
+            "stroke-width": "1.5",
+            opacity: "0.1"
+          }, null, 8, ot),
+          n("circle", {
+            cx: h.value,
+            cy: m.value,
+            r: k.value + 6,
+            fill: "none",
+            stroke: "var(--color-foreground)",
+            "stroke-width": "0.5",
+            opacity: "0.08"
+          }, null, 8, at),
+          n("path", {
+            d: N.value,
+            fill: "none",
+            stroke: "var(--color-muted)",
+            "stroke-width": x.value + 2,
+            "stroke-linecap": "butt",
+            opacity: "0.25"
+          }, null, 8, nt),
+          R.value ? (o(), a("path", {
+            key: 0,
+            d: R.value,
+            fill: "none",
+            stroke: d.value,
+            "stroke-width": x.value + 4,
+            "stroke-linecap": "butt",
+            opacity: "0.3"
+          }, null, 8, rt)) : c("", !0),
+          z.value ? (o(), a("path", {
+            key: 1,
+            d: z.value,
+            fill: "none",
+            stroke: V.value ? d.value : P.value,
+            "stroke-width": x.value + 1,
+            "stroke-linecap": "butt",
+            opacity: "0.7",
+            filter: `url(#glow-${f(v)})`
+          }, null, 8, it)) : c("", !0),
+          (o(!0), a(M, null, j(p.value, (e, u) => (o(), a("line", {
+            key: `t-${u}`,
+            x1: e.x1,
+            y1: e.y1,
+            x2: e.x2,
+            y2: e.y2,
+            stroke: t.redZoneStart != null && e.isMajor && parseFloat(e.label ?? "0") >= t.redZoneStart ? d.value : "var(--color-foreground)",
+            "stroke-width": e.isMajor ? U.value : te.value,
+            opacity: e.isMajor ? 0.9 : 0.4,
+            "stroke-linecap": "butt"
+          }, null, 8, st))), 128)),
+          (o(!0), a(M, null, j(p.value.filter((e) => e.isMajor), (e, u) => (o(), a("text", {
+            key: `tl-${u}`,
+            x: e.labelX,
+            y: e.labelY,
+            "text-anchor": "middle",
+            "dominant-baseline": "central",
+            "font-size": E.value,
+            "font-weight": "700",
+            fill: t.redZoneStart != null && parseFloat(e.label ?? "0") >= t.redZoneStart ? d.value : "var(--color-foreground)",
+            opacity: t.redZoneStart != null && parseFloat(e.label ?? "0") >= t.redZoneStart ? 1 : 0.8
+          }, y(e.label), 9, ut))), 128)),
+          n("g", {
+            filter: `url(#ns-${f(v)})`
+          }, [
+            n("path", {
+              d: O.value,
+              fill: V.value ? d.value : F.value,
+              "fill-opacity": 0.95
+            }, null, 8, dt)
+          ], 8, ct),
+          n("circle", {
+            cx: h.value,
+            cy: m.value,
+            r: I.value + 2,
+            fill: "none",
+            stroke: V.value ? d.value : F.value,
+            "stroke-width": "1.5",
+            opacity: "0.4"
+          }, null, 8, vt),
+          n("circle", {
+            cx: h.value,
+            cy: m.value,
+            r: I.value,
+            fill: `url(#sh-${f(v)})`,
+            stroke: "var(--color-background)",
+            "stroke-width": "2"
+          }, null, 8, ht),
+          (o(), a("foreignObject", {
+            x: h.value - t.size * 0.3,
+            y: q.value - t.size * 0.06,
+            width: t.size * 0.6,
+            height: t.size * 0.18
+          }, [
+            n("div", yt, [
+              t.showValue ? (o(), a("span", {
+                key: 0,
+                class: "font-black tabular-nums leading-none",
+                style: S({ fontSize: `${_.value * 1.1}px`, color: V.value ? d.value : "var(--color-foreground)" })
+              }, y(L.value), 5)) : c("", !0),
+              t.unit ? (o(), a("span", {
+                key: 1,
+                class: "font-bold leading-tight mt-0.5 uppercase tracking-widest",
+                style: S({ fontSize: `${W.value * 0.9}px`, color: V.value ? d.value : "var(--color-muted-foreground)", opacity: 0.7 })
+              }, y(t.unit), 5)) : c("", !0)
+            ])
+          ], 8, ft))
+        ])) : t.variant === "minimal" ? (o(), a("g", mt, [
+          n("path", {
+            d: N.value,
+            fill: "none",
+            stroke: "var(--color-muted)",
+            "stroke-width": x.value,
+            "stroke-linecap": "round",
+            opacity: "0.4"
+          }, null, 8, xt),
+          z.value ? (o(), a("path", {
+            key: 0,
+            d: z.value,
+            fill: "none",
+            stroke: P.value,
+            "stroke-width": x.value,
+            "stroke-linecap": "round",
+            opacity: "0.8"
+          }, null, 8, gt)) : c("", !0),
+          (o(!0), a(M, null, j(p.value.filter((e) => e.isMajor), (e, u) => (o(), a("line", {
+            key: `t-${u}`,
+            x1: e.x1,
+            y1: e.y1,
+            x2: e.x2,
+            y2: e.y2,
+            stroke: "var(--color-foreground)",
+            "stroke-width": U.value,
+            opacity: "0.45",
+            "stroke-linecap": "round"
+          }, null, 8, kt))), 128)),
+          (o(!0), a(M, null, j(p.value.filter((e) => e.isMajor), (e, u) => (o(), a("text", {
+            key: `tl-${u}`,
+            x: e.labelX,
+            y: e.labelY,
+            "text-anchor": "middle",
+            "dominant-baseline": "central",
+            "font-size": E.value,
+            "font-weight": "500",
+            fill: "var(--color-foreground)",
+            opacity: "0.5"
+          }, y(e.label), 9, wt))), 128)),
+          n("g", {
+            filter: `url(#ns-${f(v)})`
+          }, [
+            n("path", {
+              d: O.value,
+              fill: F.value,
+              "fill-opacity": 0.8
+            }, null, 8, St)
+          ], 8, bt),
+          n("circle", {
+            cx: h.value,
+            cy: m.value,
+            r: I.value,
+            fill: "var(--color-foreground)",
+            stroke: "var(--color-background)",
+            "stroke-width": "2",
+            opacity: "0.8"
+          }, null, 8, $t),
+          (o(), a("foreignObject", {
+            x: h.value - t.size * 0.3,
+            y: q.value - t.size * 0.06,
+            width: t.size * 0.6,
+            height: t.size * 0.18
+          }, [
+            n("div", zt, [
+              t.showValue ? (o(), a("span", {
+                key: 0,
+                class: "font-bold tabular-nums leading-none",
+                style: S({ fontSize: `${_.value * 0.9}px`, color: "var(--color-foreground)" })
+              }, y(L.value), 5)) : c("", !0),
+              t.unit ? (o(), a("span", {
+                key: 1,
+                class: "font-medium leading-tight mt-0.5",
+                style: S({ fontSize: `${W.value}px`, color: "var(--color-muted-foreground)" })
+              }, y(t.unit), 5)) : c("", !0)
+            ])
+          ], 8, pt))
+        ])) : c("", !0)
+      ], 8, Se)),
+      t.label ? (o(), a("p", {
+        key: 0,
+        class: "text-center font-semibold text-foreground -mt-1",
+        style: S({ fontSize: `${re.value}px` })
+      }, y(t.label), 5)) : c("", !0)
+    ]));
+  }
+});
+export {
+  Zt as default
+};

package/components/Chart/SpeedometerChart.vue2.js

@@ -0,0 +1,4 @@
+import f from "./SpeedometerChart.vue.js";
+export {
+  f as default
+};

package/components/Chart/index.d.ts

@@ -3,8 +3,10 @@ export { default as BarChart } from './BarChart.vue';
 export { default as PieChart } from './PieChart.vue';
 export { default as CircleChart } from './CircleChart.vue';
 export { default as GaugeChart } from './GaugeChart.vue';
+export { default as SpeedometerChart } from './SpeedometerChart.vue';
 export { default as TimelineChart } from './TimelineChart.vue';
 export { default as SegmentBarChart } from './SegmentBarChart.vue';
 export { default as StatCardChart } from './StatCardChart.vue';
 export { default as WaffleChart } from './WaffleChart.vue';
-export type { ChartDataPoint, ChartDataset, LineChartProps, BarChartProps, PieChartProps, CircleChartProps, GaugeChartProps, GaugeVariant, GaugeZone, TimelineChartProps, TimelineTask, SegmentBarChartProps, StatCardChartProps, StatCardItem, WaffleChartProps, } from './types';
+export { default as GanttChart } from './GanttChart.vue';
+export type { ChartDataPoint, ChartDataset, LineChartProps, BarChartProps, PieChartProps, CircleChartProps, GaugeChartProps, GaugeVariant, GaugeZone, SpeedometerChartProps, SpeedometerVariant, TimelineChartProps, TimelineTask, SegmentBarChartProps, StatCardChartProps, StatCardItem, WaffleChartProps, GanttChartProps, GanttTask, GanttViewMode, } from './types';