@ramme-io/ui 3.0.0 → 4.0.0

package/dist/components/ai/CompanyProfileCard/CompanyProfileCard.js

@@ -0,0 +1,109 @@
+import { jsx as r, jsxs as t, Fragment as u } from "react/jsx-runtime";
+import { useState as n, useEffect as v } from "react";
+import { Icon as a } from "../../ui/Icon.js";
+const l = { BASE_URL: "/", DEV: !1, MODE: "production", PROD: !0, SSR: !1 }, E = ({ ticker: i }) => {
+  const [e, x] = n(null), [h, m] = n(!0), [p, f] = n(null), [o, g] = n(!1);
+  if (v(() => {
+    (async () => {
+      try {
+        m(!0), f(null);
+        const d = (l == null ? void 0 : l.VITE_API_URL) ?? "http://localhost:8000", c = await fetch(`${d}/companies/${i.toUpperCase()}/profile`);
+        if (!c.ok)
+          throw new Error(`Failed to fetch profile: ${c.statusText}`);
+        const w = await c.json();
+        x(w);
+      } catch (d) {
+        f(d instanceof Error ? d.message : "Failed to fetch company profile");
+      } finally {
+        m(!1);
+      }
+    })();
+  }, [i]), h)
+    return /* @__PURE__ */ r("div", { className: "w-full min-w-[320px] max-w-2xl rounded-lg border border-border bg-card p-4 animate-pulse", children: /* @__PURE__ */ t("div", { className: "space-y-3", children: [
+      /* @__PURE__ */ r("div", { className: "h-5 w-32 bg-muted rounded" }),
+      /* @__PURE__ */ r("div", { className: "h-4 w-48 bg-muted rounded" }),
+      /* @__PURE__ */ t("div", { className: "grid grid-cols-2 gap-3", children: [
+        /* @__PURE__ */ r("div", { className: "h-16 bg-muted rounded" }),
+        /* @__PURE__ */ r("div", { className: "h-16 bg-muted rounded" })
+      ] }),
+      /* @__PURE__ */ r("div", { className: "h-20 bg-muted rounded" })
+    ] }) });
+  if (p || !e)
+    return /* @__PURE__ */ r("div", { className: "w-full min-w-[320px] max-w-2xl rounded-lg border border-destructive/40 bg-destructive/5 p-4", children: /* @__PURE__ */ t("div", { className: "flex items-start gap-2", children: [
+      /* @__PURE__ */ r(a, { name: "alert-triangle", className: "h-4 w-4 text-destructive flex-shrink-0 mt-0.5" }),
+      /* @__PURE__ */ t("div", { className: "min-w-0", children: [
+        /* @__PURE__ */ r("p", { className: "text-sm font-medium text-destructive", children: "Profile unavailable" }),
+        /* @__PURE__ */ r("p", { className: "text-xs text-muted-foreground mt-1", children: p || `Unable to load profile for ${i}` })
+      ] })
+    ] }) });
+  const b = (s) => s >= 1e12 ? `$${(s / 1e12).toFixed(2)}T` : s >= 1e9 ? `$${(s / 1e9).toFixed(2)}B` : s >= 1e6 ? `$${(s / 1e6).toFixed(1)}M` : `$${s.toLocaleString()}`, N = e.description && e.description.length > 200 ? e.description.slice(0, 200) + "..." : e.description;
+  return /* @__PURE__ */ t("div", { className: "w-full min-w-[320px] max-w-2xl rounded-lg border border-border bg-card p-4 space-y-3", children: [
+    /* @__PURE__ */ t("div", { className: "flex items-start justify-between gap-2", children: [
+      /* @__PURE__ */ t("div", { className: "min-w-0 flex-1", children: [
+        /* @__PURE__ */ t("div", { className: "flex items-center gap-2 mb-1", children: [
+          /* @__PURE__ */ r("h3", { className: "text-base font-bold font-mono text-foreground", children: e.ticker }),
+          e.source === "cache_stale" && e.warning && /* @__PURE__ */ t("span", { className: "text-xs text-amber-500 flex items-center gap-1", children: [
+            /* @__PURE__ */ r(a, { name: "alert-circle", className: "h-3 w-3" }),
+            "Stale"
+          ] })
+        ] }),
+        /* @__PURE__ */ r("p", { className: "text-sm font-semibold text-foreground/90", children: e.company_name })
+      ] }),
+      /* @__PURE__ */ r(a, { name: "building", className: "h-5 w-5 text-muted-foreground flex-shrink-0" })
+    ] }),
+    (e.sector || e.industry) && /* @__PURE__ */ t("div", { className: "flex flex-wrap gap-2", children: [
+      e.sector && /* @__PURE__ */ t("span", { className: "inline-flex items-center gap-1 rounded-md bg-primary/10 px-2 py-1 text-xs font-medium text-primary ring-1 ring-primary/20", children: [
+        /* @__PURE__ */ r(a, { name: "bar-chart-2", className: "h-3 w-3" }),
+        e.sector
+      ] }),
+      e.industry && /* @__PURE__ */ t("span", { className: "inline-flex items-center gap-1 rounded-md bg-muted px-2 py-1 text-xs font-medium text-muted-foreground", children: [
+        /* @__PURE__ */ r(a, { name: "briefcase", className: "h-3 w-3" }),
+        e.industry
+      ] })
+    ] }),
+    (e.market_cap || e.pe_ratio) && /* @__PURE__ */ t("div", { className: "grid grid-cols-2 gap-3", children: [
+      e.market_cap && /* @__PURE__ */ t("div", { className: "rounded-md border border-border bg-muted/30 p-3 space-y-1", children: [
+        /* @__PURE__ */ r("p", { className: "text-xs font-semibold uppercase tracking-wide text-muted-foreground", children: "Market Cap" }),
+        /* @__PURE__ */ r("p", { className: "text-lg font-bold font-mono text-foreground", children: b(e.market_cap) })
+      ] }),
+      e.pe_ratio && /* @__PURE__ */ t("div", { className: "rounded-md border border-border bg-muted/30 p-3 space-y-1", children: [
+        /* @__PURE__ */ r("p", { className: "text-xs font-semibold uppercase tracking-wide text-muted-foreground", children: "P/E Ratio" }),
+        /* @__PURE__ */ t("p", { className: "text-lg font-bold font-mono text-foreground", children: [
+          e.pe_ratio.toFixed(2),
+          "x"
+        ] })
+      ] })
+    ] }),
+    e.description && /* @__PURE__ */ t("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ t("p", { className: "text-xs font-semibold uppercase tracking-wide text-muted-foreground flex items-center gap-1", children: [
+        /* @__PURE__ */ r(a, { name: "file-text", className: "h-3 w-3" }),
+        "Company Overview"
+      ] }),
+      /* @__PURE__ */ r("p", { className: "text-sm text-muted-foreground leading-relaxed", children: o ? e.description : N }),
+      e.description.length > 200 && /* @__PURE__ */ r(
+        "button",
+        {
+          onClick: () => g(!o),
+          className: "text-xs text-primary hover:underline flex items-center gap-1",
+          children: o ? /* @__PURE__ */ t(u, { children: [
+            /* @__PURE__ */ r(a, { name: "chevron-up", className: "h-3 w-3" }),
+            "Show less"
+          ] }) : /* @__PURE__ */ t(u, { children: [
+            /* @__PURE__ */ r(a, { name: "chevron-down", className: "h-3 w-3" }),
+            "Read more"
+          ] })
+        }
+      )
+    ] }),
+    /* @__PURE__ */ t("div", { className: "pt-2 border-t border-border/50 flex items-center justify-between text-xs text-muted-foreground", children: [
+      /* @__PURE__ */ t("span", { className: "flex items-center gap-1", children: [
+        /* @__PURE__ */ r(a, { name: "database", className: "h-3 w-3" }),
+        e.source === "cache" ? "Cached" : e.source === "yfinance" ? "Live" : "Cached (stale)"
+      ] }),
+      /* @__PURE__ */ r("span", { children: new Date(e.updated_at).toLocaleDateString() })
+    ] })
+  ] });
+};
+export {
+  E as CompanyProfileCard
+};

package/dist/components/ai/KeyInjectionOverlay.js

@@ -0,0 +1,51 @@
+import { jsx as e, jsxs as r } from "react/jsx-runtime";
+import { useState as n } from "react";
+import { Button as m } from "../ui/Button.js";
+import { Input as c } from "../forms/Input.js";
+import { Card as u } from "../layout/Card.js";
+import { Icon as f } from "../ui/Icon.js";
+function I({ status: i, setSessionKey: o }) {
+  const [s, a] = n(""), [l, d] = n(!0);
+  return i !== "BYOK_REQUIRED" && i !== "KEY_EXPIRED" ? null : /* @__PURE__ */ e("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-background/80 backdrop-blur-sm", children: /* @__PURE__ */ e(u, { className: "w-[450px] p-6 shadow-xl border-destructive/20 border", children: /* @__PURE__ */ r("form", { onSubmit: (t) => {
+    t.preventDefault(), s.trim() && o(s.trim());
+  }, className: "space-y-4", children: [
+    /* @__PURE__ */ r("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ r("div", { className: "flex items-center gap-2 text-destructive", children: [
+        /* @__PURE__ */ e(f, { name: "alert-triangle", size: 20 }),
+        /* @__PURE__ */ e("h3", { className: "font-semibold text-lg", children: "AI Key Required" })
+      ] }),
+      /* @__PURE__ */ e("p", { className: "text-sm text-muted-foreground", children: i === "KEY_EXPIRED" ? "Your AI API key has expired or is invalid. Please provide a new key." : "This terminal requires an AI API key to function. We do not bundle keys in the client for security." })
+    ] }),
+    /* @__PURE__ */ r("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ e("label", { className: "text-sm font-medium text-foreground", children: "API Key" }),
+      /* @__PURE__ */ e(
+        c,
+        {
+          type: "password",
+          placeholder: "Paste your AI provider key here...",
+          value: s,
+          onChange: (t) => a(t.target.value),
+          className: "font-mono w-full font-medium",
+          autoComplete: "off"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ r("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ e(
+        "input",
+        {
+          type: "checkbox",
+          id: "session-only",
+          checked: l,
+          onChange: (t) => d(t.target.checked),
+          className: "rounded border-input text-primary focus:ring-primary"
+        }
+      ),
+      /* @__PURE__ */ e("label", { htmlFor: "session-only", className: "text-sm text-muted-foreground", children: "Session-Only (Clears when tab is closed)" })
+    ] }),
+    /* @__PURE__ */ e(m, { type: "submit", className: "w-full font-medium mt-2", disabled: !s.trim(), children: "Initialize Session" })
+  ] }) }) });
+}
+export {
+  I as KeyInjectionOverlay
+};

package/dist/components/ai/LiveQuoteCard/LiveQuoteCard.js

@@ -0,0 +1,72 @@
+import { jsxs as e, jsx as t } from "react/jsx-runtime";
+import { useState as c, useEffect as g } from "react";
+import { Card as N, CardHeader as b, CardTitle as y, CardContent as v } from "../../layout/Card.js";
+import { Icon as s } from "../../ui/Icon.js";
+const d = { BASE_URL: "/", DEV: !1, MODE: "production", PROD: !0, SSR: !1 }, U = ({ params: f }) => {
+  const { ticker: i } = f, [r, x] = c(null), [l, m] = c(!0), [o, p] = c(null);
+  g(() => {
+    (async () => {
+      try {
+        m(!0), p(null);
+        const a = (d == null ? void 0 : d.VITE_API_URL) ?? "http://localhost:8000", u = await fetch(`${a}/companies/${i.toUpperCase()}/hydrate-quote`);
+        if (!u.ok)
+          throw new Error(`No quote data available for ${i.toUpperCase()}`);
+        const h = await u.json();
+        x(h);
+      } catch (a) {
+        p(a instanceof Error ? a.message : "Failed to fetch quote");
+      } finally {
+        m(!1);
+      }
+    })();
+  }, [i]);
+  const n = r && r.change_percent >= 0;
+  return /* @__PURE__ */ e(N, { className: "w-full min-w-[280px] max-w-md shadow-lg border-primary/20", children: [
+    /* @__PURE__ */ t(b, { className: "pb-3", children: /* @__PURE__ */ e(y, { className: "text-sm font-medium text-muted-foreground flex items-center gap-2", children: [
+      /* @__PURE__ */ t(s, { name: "trending-up", size: 14 }),
+      "Live Quote"
+    ] }) }),
+    /* @__PURE__ */ e(v, { className: "pt-0", children: [
+      l && /* @__PURE__ */ t("div", { className: "flex items-center justify-center py-8", children: /* @__PURE__ */ t(s, { name: "loader", size: 24, className: "animate-spin text-muted-foreground" }) }),
+      o && /* @__PURE__ */ e("div", { className: "flex items-start gap-2 rounded-lg border border-destructive/40 bg-destructive/10 px-3 py-2 text-xs text-destructive", children: [
+        /* @__PURE__ */ t(s, { name: "alert-circle", size: 14, className: "mt-px shrink-0" }),
+        /* @__PURE__ */ t("span", { children: o })
+      ] }),
+      r && !l && !o && /* @__PURE__ */ e("div", { className: "space-y-3", children: [
+        /* @__PURE__ */ t("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ t("span", { className: "px-2.5 py-1 rounded-md bg-primary/10 border border-primary/20 font-mono text-sm font-semibold text-primary", children: r.ticker }) }),
+        /* @__PURE__ */ e("div", { className: "space-y-1", children: [
+          /* @__PURE__ */ e("div", { className: "flex items-baseline gap-2", children: [
+            /* @__PURE__ */ e("span", { className: "text-3xl font-bold font-mono text-foreground", children: [
+              "$",
+              r.price.toLocaleString("en-US", {
+                minimumFractionDigits: 2,
+                maximumFractionDigits: 2
+              })
+            ] }),
+            /* @__PURE__ */ e("span", { className: `text-lg font-semibold ${n ? "text-green-500" : "text-red-500"}`, children: [
+              n ? "+" : "",
+              r.change_percent.toFixed(2),
+              "%"
+            ] })
+          ] }),
+          /* @__PURE__ */ e("p", { className: "text-xs text-muted-foreground font-mono", children: [
+            "Updated: ",
+            new Date(r.timestamp).toLocaleString("en-US", {
+              month: "short",
+              day: "numeric",
+              hour: "2-digit",
+              minute: "2-digit"
+            })
+          ] })
+        ] }),
+        /* @__PURE__ */ t("div", { className: "flex items-center gap-2 pt-2 border-t border-border/40", children: /* @__PURE__ */ e("div", { className: `flex items-center gap-1.5 text-xs font-medium ${n ? "text-green-500" : "text-red-500"}`, children: [
+          /* @__PURE__ */ t(s, { name: n ? "trending-up" : "trending-down", size: 14 }),
+          /* @__PURE__ */ t("span", { children: n ? "Gaining" : "Declining" })
+        ] }) })
+      ] })
+    ] })
+  ] });
+};
+export {
+  U as LiveQuoteCard
+};

package/dist/components/ai/NewsSummaryCard/NewsSummaryCard.js

@@ -0,0 +1,77 @@
+import { jsxs as t, jsx as e } from "react/jsx-runtime";
+import { useState as i, useEffect as g } from "react";
+import { Card as N, CardHeader as b, CardTitle as w, CardContent as y } from "../../layout/Card.js";
+import { Icon as a } from "../../ui/Icon.js";
+const d = { BASE_URL: "/", DEV: !1, MODE: "production", PROD: !0, SSR: !1 }, k = ({ params: u }) => {
+  const { ticker: n } = u, [c, x] = i([]), [l, m] = i(!0), [o, p] = i(null);
+  return g(() => {
+    (async () => {
+      try {
+        m(!0), p(null);
+        const s = (d == null ? void 0 : d.VITE_API_URL) ?? "http://localhost:8000", f = await fetch(`${s}/companies/${n.toUpperCase()}/news?limit=5`);
+        if (!f.ok)
+          throw new Error(`No news available for ${n.toUpperCase()}`);
+        const h = await f.json();
+        x(h);
+      } catch (s) {
+        p(s instanceof Error ? s.message : "Failed to fetch news");
+      } finally {
+        m(!1);
+      }
+    })();
+  }, [n]), /* @__PURE__ */ t(N, { className: "w-full min-w-[320px] max-w-2xl shadow-lg border-primary/20", children: [
+    /* @__PURE__ */ e(b, { className: "pb-3", children: /* @__PURE__ */ t(w, { className: "text-sm font-medium text-muted-foreground flex items-center gap-2", children: [
+      /* @__PURE__ */ e(a, { name: "newspaper", size: 14 }),
+      "Recent News · ",
+      n.toUpperCase()
+    ] }) }),
+    /* @__PURE__ */ t(y, { className: "pt-0", children: [
+      l && /* @__PURE__ */ e("div", { className: "flex items-center justify-center py-8", children: /* @__PURE__ */ e(a, { name: "loader", size: 24, className: "animate-spin text-muted-foreground" }) }),
+      o && /* @__PURE__ */ t("div", { className: "flex items-start gap-2 rounded-lg border border-destructive/40 bg-destructive/10 px-3 py-2 text-xs text-destructive", children: [
+        /* @__PURE__ */ e(a, { name: "alert-circle", size: 14, className: "mt-px shrink-0" }),
+        /* @__PURE__ */ e("span", { children: o })
+      ] }),
+      c.length === 0 && !l && !o && /* @__PURE__ */ t("div", { className: "flex flex-col items-center justify-center py-8 gap-2 text-muted-foreground", children: [
+        /* @__PURE__ */ e(a, { name: "inbox", size: 24, opacity: 0.5 }),
+        /* @__PURE__ */ e("p", { className: "text-sm", children: "No recent news available" })
+      ] }),
+      c.length > 0 && !l && !o && /* @__PURE__ */ e("div", { className: "space-y-3", children: c.map((r, s) => /* @__PURE__ */ e(
+        "div",
+        {
+          className: "border-b border-border/50 pb-3 last:border-0 last:pb-0",
+          children: /* @__PURE__ */ t("div", { className: "flex items-start justify-between gap-2", children: [
+            /* @__PURE__ */ t("div", { className: "flex-1 min-w-0", children: [
+              r.url ? /* @__PURE__ */ e(
+                "a",
+                {
+                  href: r.url,
+                  target: "_blank",
+                  rel: "noopener noreferrer",
+                  className: "text-sm font-medium text-foreground hover:text-primary transition-colors line-clamp-2 block",
+                  children: r.description
+                }
+              ) : /* @__PURE__ */ e("p", { className: "text-sm font-medium text-foreground line-clamp-2", children: r.description }),
+              /* @__PURE__ */ t("div", { className: "flex items-center gap-2 mt-1.5", children: [
+                /* @__PURE__ */ e("span", { className: "text-[10px] font-mono text-muted-foreground", children: new Date(r.created_at).toLocaleDateString("en-US", {
+                  month: "short",
+                  day: "numeric",
+                  year: "numeric"
+                }) }),
+                /* @__PURE__ */ t("span", { className: `text-[10px] font-medium px-1.5 py-0.5 rounded ${r.impact_score >= 7 ? "bg-red-500/10 text-red-400 ring-1 ring-red-500/20" : r.impact_score >= 5 ? "bg-amber-500/10 text-amber-400 ring-1 ring-amber-500/20" : "bg-muted/50 text-muted-foreground"}`, children: [
+                  "Impact: ",
+                  r.impact_score,
+                  "/10"
+                ] })
+              ] })
+            ] }),
+            r.url && /* @__PURE__ */ e(a, { name: "external-link", size: 12, className: "text-muted-foreground/50 flex-shrink-0 mt-0.5" })
+          ] })
+        },
+        r.id
+      )) })
+    ] })
+  ] });
+};
+export {
+  k as NewsSummaryCard
+};

package/dist/components/ai/StockChart/StockChart.js

@@ -0,0 +1,199 @@
+import { jsxs as a, jsx as e } from "react/jsx-runtime";
+import F from "react";
+import { ResponsiveContainer as W, ComposedChart as _, CartesianGrid as K, XAxis as U, YAxis as A, Tooltip as $, Legend as j, Line as S, Bar as z } from "recharts";
+import { Card as E, CardHeader as H, CardTitle as L, CardContent as V } from "../../layout/Card.js";
+import { useChartTheme as Y } from "../../../lib/hooks/useChartTheme.js";
+function G(s, p, C) {
+  const N = Date.now(), M = p && Array.isArray(p) && p.length > 0 ? p : ["price", "volume"], c = {
+    "1D": { duration: 6.5 * 60 * 60 * 1e3, points: 78, basePrice: 150 },
+    // 5-minute intervals (market hours)
+    "1W": { duration: 7 * 24 * 60 * 60 * 1e3, points: 35, basePrice: 150 },
+    // Daily close
+    "1M": { duration: 30 * 24 * 60 * 60 * 1e3, points: 30, basePrice: 150 },
+    // Daily close
+    "1Y": { duration: 365 * 24 * 60 * 60 * 1e3, points: 52, basePrice: 100 }
+    // Weekly close
+  }, g = c[s] || c["1M"], { duration: l, points: h, basePrice: r } = g, o = l / h, x = [];
+  let n = r;
+  const u = [];
+  for (let d = 0; d < h; d++) {
+    const v = N - l + d * o, m = {
+      timestamp: new Date(v).toLocaleString("en-US", {
+        ...s === "1D" && { hour: "2-digit", minute: "2-digit" },
+        ...s === "1W" && { weekday: "short", hour: "2-digit" },
+        ...s === "1M" && { month: "short", day: "numeric" },
+        ...s === "1Y" && { month: "short", year: "2-digit" }
+      })
+    };
+    M.forEach((i) => {
+      switch (i) {
+        case "price":
+          const P = r * 0.02, y = 1e-4 * r, k = (Math.random() - 0.48) * P + y;
+          n = Math.max(n + k, r * 0.7), u.push(n), m[i] = Number(n.toFixed(2));
+          break;
+        case "volume":
+          const t = 1e6, f = Math.random() > 0.7 ? Math.random() * 2 : 1;
+          m[i] = Math.round((t + Math.random() * t * 2) * f);
+          break;
+        case "moving_average":
+          const w = Math.min(20, d + 1), D = u.slice(-w).reduce((I, T) => I + T, 0) / w;
+          m[i] = Number(D.toFixed(2));
+          break;
+        default:
+          m[i] = 0;
+      }
+    }), x.push(m);
+  }
+  return x;
+}
+const b = {
+  price: { label: "Price", unit: "USD", color: "#10b981" },
+  // Emerald/green
+  volume: { label: "Volume", unit: "shares", color: "#f59e0b" },
+  // Amber
+  moving_average: { label: "MA(20)", unit: "", color: "#ef4444" }
+  // Red
+}, Q = ({
+  params: s,
+  title: p,
+  data: C
+}) => {
+  var y, k;
+  const { ticker: N, timeRange: M, metrics: c } = s, { textColor: g, gridColor: l } = Y(), h = N || s.symbol || "UNKNOWN", r = M || "1M", o = c && Array.isArray(c) && c.length > 0 ? c : ["price", "volume"], x = F.useMemo(
+    () => {
+      const t = C || G(r, o);
+      return console.log("[StockChart] Data generated:", {
+        ticker: h,
+        timeRange: r,
+        metrics: o,
+        dataPoints: t.length,
+        firstPoint: t[0],
+        lastPoint: t[t.length - 1]
+      }), t;
+    },
+    [C, r, o, h]
+  ), n = x.filter((t) => t.price !== void 0), u = ((y = n[0]) == null ? void 0 : y.price) || 0, d = ((k = n[n.length - 1]) == null ? void 0 : k.price) || 0, v = d - u, m = u > 0 ? (v / u * 100).toFixed(2) : "0.00", i = v >= 0, P = p || `${h.toUpperCase()} - ${r}`;
+  return /* @__PURE__ */ a(E, { className: "w-full max-w-2xl shadow-lg border-primary/20", children: [
+    /* @__PURE__ */ e(H, { className: "pb-2", children: /* @__PURE__ */ a("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ e(L, { className: "text-sm font-medium text-foreground/80", children: P }),
+      o.includes("price") && /* @__PURE__ */ a("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ a("span", { className: "text-base font-semibold", children: [
+          "$",
+          d.toFixed(2)
+        ] }),
+        /* @__PURE__ */ a(
+          "span",
+          {
+            className: `text-xs font-medium ${i ? "text-green-600 dark:text-green-400" : "text-red-600 dark:text-red-400"}`,
+            children: [
+              i ? "+" : "",
+              v.toFixed(2),
+              " (",
+              i ? "+" : "",
+              m,
+              "%)"
+            ]
+          }
+        )
+      ] })
+    ] }) }),
+    /* @__PURE__ */ a(V, { className: "pt-0", children: [
+      /* @__PURE__ */ e("div", { className: "h-64 w-full bg-background", style: { minHeight: "256px", minWidth: "350px" }, children: /* @__PURE__ */ e(W, { width: "100%", height: 256, children: /* @__PURE__ */ a(_, { data: x, margin: { top: 5, right: 20, bottom: 5, left: 0 }, children: [
+        /* @__PURE__ */ e(K, { strokeDasharray: "3 3", stroke: l, opacity: 0.3 }),
+        /* @__PURE__ */ e(
+          U,
+          {
+            dataKey: "timestamp",
+            tick: { fontSize: 11, fill: g },
+            stroke: l,
+            interval: "preserveStartEnd"
+          }
+        ),
+        /* @__PURE__ */ e(
+          A,
+          {
+            yAxisId: "price",
+            tick: { fontSize: 11, fill: g },
+            stroke: l,
+            width: 60
+          }
+        ),
+        /* @__PURE__ */ e(
+          A,
+          {
+            yAxisId: "volume",
+            orientation: "right",
+            tick: { fontSize: 11, fill: g },
+            stroke: l,
+            width: 60
+          }
+        ),
+        /* @__PURE__ */ e($, {}),
+        /* @__PURE__ */ e(j, {}),
+        o.includes("price") && /* @__PURE__ */ e(
+          S,
+          {
+            yAxisId: "price",
+            type: "monotone",
+            dataKey: "price",
+            stroke: b.price.color,
+            strokeWidth: 2,
+            dot: !1,
+            name: "Price (USD)"
+          }
+        ),
+        o.includes("moving_average") && /* @__PURE__ */ e(
+          S,
+          {
+            yAxisId: "price",
+            type: "monotone",
+            dataKey: "moving_average",
+            stroke: b.moving_average.color,
+            strokeWidth: 2,
+            dot: !1,
+            name: "MA(20)",
+            strokeDasharray: "5 5"
+          }
+        ),
+        o.includes("volume") && /* @__PURE__ */ e(
+          z,
+          {
+            yAxisId: "volume",
+            dataKey: "volume",
+            fill: b.volume.color,
+            opacity: 0.6,
+            name: "Volume"
+          }
+        )
+      ] }) }) }),
+      /* @__PURE__ */ e("div", { className: "mt-3 flex flex-wrap gap-2", children: o.map((t) => {
+        const f = b[t];
+        return /* @__PURE__ */ a(
+          "div",
+          {
+            className: "inline-flex items-center gap-1.5 rounded-full bg-muted/50 px-2.5 py-1 text-xs",
+            children: [
+              /* @__PURE__ */ e(
+                "span",
+                {
+                  className: "h-2 w-2 rounded-full",
+                  style: { backgroundColor: f.color }
+                }
+              ),
+              /* @__PURE__ */ e("span", { className: "font-medium", children: f.label }),
+              f.unit && /* @__PURE__ */ a("span", { className: "text-muted-foreground", children: [
+                "(",
+                f.unit,
+                ")"
+              ] })
+            ]
+          },
+          t
+        );
+      }) })
+    ] })
+  ] });
+};
+export {
+  Q as StockChart
+};

package/dist/components/ai/TelemetryGraph/TelemetryGraph.js

@@ -0,0 +1,125 @@
+import { jsxs as d, jsx as r } from "react/jsx-runtime";
+import f from "react";
+import { LineChart as x } from "../../data-display/LineChart.js";
+import { Card as N, CardHeader as y, CardTitle as w, CardContent as C } from "../../layout/Card.js";
+function M(i, u) {
+  const l = Date.now(), m = {
+    "1h": { duration: 60 * 60 * 1e3, points: 60 },
+    // 1 minute intervals
+    "24h": { duration: 24 * 60 * 60 * 1e3, points: 144 },
+    // 10 minute intervals
+    "7d": { duration: 7 * 24 * 60 * 60 * 1e3, points: 168 }
+    // 1 hour intervals
+  }, { duration: s, points: a } = m[i], p = s / a, c = [];
+  for (let n = 0; n < a; n++) {
+    const b = l - s + n * p, t = n / a * Math.PI * 2, e = {
+      timestamp: new Date(b).toLocaleTimeString("en-US", {
+        hour: "2-digit",
+        minute: "2-digit",
+        ...i === "7d" && { month: "short", day: "numeric" }
+      })
+    };
+    u.forEach((o) => {
+      switch (o) {
+        case "temperature":
+          e[o] = Number((20 + 5 * Math.sin(t)).toFixed(1));
+          break;
+        case "humidity":
+          e[o] = Number((60 + 15 * Math.cos(t)).toFixed(1));
+          break;
+        case "vwc":
+          e[o] = Number((35 + 10 * Math.sin(t / 2)).toFixed(1));
+          break;
+        case "ec":
+          e[o] = Number((1.2 + 0.3 * Math.sin(t * 1.5)).toFixed(2));
+          break;
+        case "ph":
+          e[o] = Number((6.5 + 0.5 * Math.cos(t * 0.8)).toFixed(2));
+          break;
+        case "pressure":
+          e[o] = Math.round(1013 + 10 * Math.sin(t * 1.2));
+          break;
+        case "co2":
+          e[o] = Math.round(400 + 100 * Math.cos(t * 1.3));
+          break;
+        default:
+          e[o] = 0;
+      }
+    }), c.push(e);
+  }
+  return c;
+}
+const h = {
+  temperature: { label: "Temperature", unit: "°C", color: "#ef4444" },
+  humidity: { label: "Humidity", unit: "%", color: "#3b82f6" },
+  vwc: { label: "VWC", unit: "%", color: "#10b981" },
+  ec: { label: "EC", unit: "mS/cm", color: "#f59e0b" },
+  ph: { label: "pH", unit: "", color: "#8b5cf6" },
+  pressure: { label: "Pressure", unit: "hPa", color: "#06b6d4" },
+  co2: { label: "CO₂", unit: "ppm", color: "#ec4899" }
+}, F = ({
+  params: i,
+  title: u,
+  data: l
+}) => {
+  const { deviceId: m, timeRange: s, metrics: a } = i, p = f.useMemo(
+    () => l || M(s, a),
+    [l, s, a]
+  ), c = u || `${a.map((t) => {
+    var e;
+    return ((e = h[t]) == null ? void 0 : e.label) || t;
+  }).join(" & ")} - ${m} (${s})`, n = a.map((t) => {
+    var e;
+    return ((e = h[t]) == null ? void 0 : e.color) || "#64748b";
+  });
+  return /* @__PURE__ */ d(N, { className: "w-full max-w-2xl shadow-lg border-primary/20", children: [
+    /* @__PURE__ */ r(y, { className: "pb-2", children: /* @__PURE__ */ r(w, { className: "text-sm font-medium text-foreground/80", children: c }) }),
+    /* @__PURE__ */ d(C, { className: "pt-0", children: [
+      /* @__PURE__ */ r("div", { className: "h-64 w-full", children: /* @__PURE__ */ r(
+        x,
+        {
+          data: p,
+          dataKeyX: "timestamp",
+          lineKeys: a,
+          colors: n,
+          xAxisProps: {
+            tick: { fontSize: 11 },
+            interval: "preserveStartEnd"
+          },
+          yAxisProps: {
+            tick: { fontSize: 11 },
+            width: 45
+          }
+        }
+      ) }),
+      /* @__PURE__ */ r("div", { className: "mt-3 flex flex-wrap gap-2", children: a.map((t) => {
+        const e = h[t];
+        return /* @__PURE__ */ d(
+          "div",
+          {
+            className: "inline-flex items-center gap-1.5 rounded-full bg-muted/50 px-2.5 py-1 text-xs",
+            children: [
+              /* @__PURE__ */ r(
+                "span",
+                {
+                  className: "h-2 w-2 rounded-full",
+                  style: { backgroundColor: e.color }
+                }
+              ),
+              /* @__PURE__ */ r("span", { className: "font-medium", children: e.label }),
+              e.unit && /* @__PURE__ */ d("span", { className: "text-muted-foreground", children: [
+                "(",
+                e.unit,
+                ")"
+              ] })
+            ]
+          },
+          t
+        );
+      }) })
+    ] })
+  ] });
+};
+export {
+  F as TelemetryGraph
+};

package/dist/components/auth/AuthLayout.d.ts

@@ -1,2 +1,10 @@
 import React from 'react';
+/**
+ * @wizard
+ * @name AuthLayout
+ * @description The centred, chrome-free frame for unauthenticated screens, rendering the matched child route via an Outlet. Strategic purpose: sign-in and sign-up must not show the app shell's sidebar or header — wrap those routes in this instead of conditionally hiding chrome inside AppShell.
+ * @tags layout, auth, login, shell, route
+ * @category layout
+ * @id auth-layout
+ */
 export declare const AuthLayout: React.FC;