@coursebuilder/analytics 1.1.0

package/dist/components/index.js

@@ -0,0 +1,1258 @@
+var __defProp = Object.defineProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+
+// src/components/omnibus-dashboard.tsx
+import React3, { useState as useState2, useTransition } from "react";
+import { CheckIcon, ChevronDownIcon, ClipboardIcon, ClipboardListIcon, ClockIcon, DollarSignIcon, ExternalLinkIcon, FilmIcon, GlobeIcon, LinkIcon, Loader2Icon, MousePointerClickIcon, PlayIcon, ShoppingCartIcon, TrendingUpIcon } from "lucide-react";
+import { parseAsStringLiteral, useQueryState } from "nuqs";
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@coursebuilder/ui";
+
+// src/components/country-chart.tsx
+import React from "react";
+import { Bar, BarChart, CartesianGrid, ResponsiveContainer, Tooltip, XAxis, YAxis } from "recharts";
+
+// src/components/use-chart-colors.ts
+import { useEffect, useState } from "react";
+var FALLBACK = {
+  primary: "#d4a053",
+  primaryMuted: "rgba(212, 160, 83, 0.2)",
+  foreground: "#e5e5e5",
+  mutedForeground: "#999",
+  gridLine: "#333",
+  cardBg: "#1a1a1a",
+  hoverBg: "#222"
+};
+function getCSSVar(name) {
+  return getComputedStyle(document.documentElement).getPropertyValue(name).trim();
+}
+__name(getCSSVar, "getCSSVar");
+function oklchToUsable(raw) {
+  if (!raw)
+    return "";
+  return raw.startsWith("oklch") ? raw : raw;
+}
+__name(oklchToUsable, "oklchToUsable");
+function useChartColors() {
+  const [colors, setColors] = useState(FALLBACK);
+  useEffect(() => {
+    function update() {
+      const primary = getCSSVar("--primary");
+      const muted = getCSSVar("--muted");
+      const mutedFg = getCSSVar("--muted-foreground");
+      const fg = getCSSVar("--foreground");
+      const border = getCSSVar("--border");
+      const card = getCSSVar("--card");
+      if (!primary)
+        return;
+      setColors({
+        primary: oklchToUsable(primary),
+        primaryMuted: oklchToUsable(primary).replace(")", " / 0.2)"),
+        foreground: oklchToUsable(fg),
+        mutedForeground: oklchToUsable(mutedFg),
+        gridLine: oklchToUsable(border),
+        cardBg: oklchToUsable(card),
+        hoverBg: oklchToUsable(muted)
+      });
+    }
+    __name(update, "update");
+    update();
+    const observer = new MutationObserver(update);
+    observer.observe(document.documentElement, {
+      attributes: true,
+      attributeFilter: [
+        "class"
+      ]
+    });
+    return () => observer.disconnect();
+  }, []);
+  return colors;
+}
+__name(useChartColors, "useChartColors");
+
+// src/components/country-chart.tsx
+function countryFlag(code) {
+  if (!code || code.length !== 2)
+    return "\u{1F30D}";
+  const offset = 127462;
+  const a = code.toUpperCase().charCodeAt(0) - 65 + offset;
+  const b = code.toUpperCase().charCodeAt(1) - 65 + offset;
+  return String.fromCodePoint(a, b);
+}
+__name(countryFlag, "countryFlag");
+function formatCurrency(value) {
+  if (value >= 1e3)
+    return `$${(value / 1e3).toFixed(1)}k`;
+  return `$${value.toFixed(0)}`;
+}
+__name(formatCurrency, "formatCurrency");
+function CustomTooltip({ active, payload }) {
+  if (!active || !payload?.length)
+    return null;
+  const d = payload[0]?.payload;
+  if (!d)
+    return null;
+  return /* @__PURE__ */ React.createElement("div", {
+    className: "border-border/50 bg-card rounded-lg border px-3 py-2 shadow-xl"
+  }, /* @__PURE__ */ React.createElement("p", {
+    className: "text-foreground text-sm font-medium"
+  }, countryFlag(d.country), " ", d.country), /* @__PURE__ */ React.createElement("p", {
+    className: "text-foreground text-lg font-bold tabular-nums"
+  }, "$", d.revenue.toLocaleString(void 0, {
+    minimumFractionDigits: 0,
+    maximumFractionDigits: 0
+  })), /* @__PURE__ */ React.createElement("p", {
+    className: "text-muted-foreground text-xs"
+  }, d.count, " purchases"));
+}
+__name(CustomTooltip, "CustomTooltip");
+function CountryChart({ data }) {
+  const colors = useChartColors();
+  const chartData = data.slice(0, 10).map((d) => ({
+    ...d,
+    label: `${countryFlag(d.country)} ${d.country}`
+  }));
+  return /* @__PURE__ */ React.createElement("div", {
+    className: "h-[280px] w-full"
+  }, /* @__PURE__ */ React.createElement(ResponsiveContainer, {
+    width: "100%",
+    height: "100%"
+  }, /* @__PURE__ */ React.createElement(BarChart, {
+    data: chartData,
+    layout: "vertical",
+    margin: {
+      top: 4,
+      right: 8,
+      left: 4,
+      bottom: 4
+    }
+  }, /* @__PURE__ */ React.createElement(CartesianGrid, {
+    strokeDasharray: "3 3",
+    stroke: colors.gridLine,
+    horizontal: false
+  }), /* @__PURE__ */ React.createElement(XAxis, {
+    type: "number",
+    tick: {
+      fill: colors.mutedForeground,
+      fontSize: 11
+    },
+    axisLine: {
+      stroke: colors.gridLine
+    },
+    tickLine: false,
+    tickFormatter: formatCurrency
+  }), /* @__PURE__ */ React.createElement(YAxis, {
+    type: "category",
+    dataKey: "label",
+    tick: {
+      fill: colors.mutedForeground,
+      fontSize: 12
+    },
+    axisLine: false,
+    tickLine: false,
+    width: 60
+  }), /* @__PURE__ */ React.createElement(Tooltip, {
+    content: /* @__PURE__ */ React.createElement(CustomTooltip, null),
+    cursor: {
+      fill: colors.hoverBg
+    }
+  }), /* @__PURE__ */ React.createElement(Bar, {
+    dataKey: "revenue",
+    radius: [
+      0,
+      4,
+      4,
+      0
+    ],
+    maxBarSize: 24,
+    fill: "#22c55e",
+    fillOpacity: 0.7
+  }))));
+}
+__name(CountryChart, "CountryChart");
+
+// src/components/revenue-chart.tsx
+import React2, { useMemo } from "react";
+import { Area, AreaChart, CartesianGrid as CartesianGrid2, ResponsiveContainer as ResponsiveContainer2, Tooltip as Tooltip2, XAxis as XAxis2, YAxis as YAxis2 } from "recharts";
+function formatDate(dateStr) {
+  const d = /* @__PURE__ */ new Date(dateStr + "T00:00:00");
+  return d.toLocaleDateString("en-US", {
+    month: "short",
+    day: "numeric"
+  });
+}
+__name(formatDate, "formatDate");
+function formatCurrency2(value) {
+  if (value >= 1e3)
+    return `$${(value / 1e3).toFixed(1)}k`;
+  return `$${value.toFixed(0)}`;
+}
+__name(formatCurrency2, "formatCurrency");
+function CustomTooltip2({ active, payload, label }) {
+  if (!active || !payload?.length || !label)
+    return null;
+  const merged = payload[0]?.payload;
+  if (!merged)
+    return null;
+  const current = merged.revenue ?? 0;
+  const previous = merged.prevRevenue ?? 0;
+  const hasPrev = previous > 0;
+  let delta = "";
+  let deltaColor = "";
+  if (hasPrev && current > 0) {
+    const pct = (current - previous) / previous * 100;
+    delta = pct >= 0 ? `+${pct.toFixed(0)}%` : `${pct.toFixed(0)}%`;
+    deltaColor = pct >= 0 ? "text-emerald-500" : "text-red-400";
+  }
+  return /* @__PURE__ */ React2.createElement("div", {
+    className: "border-border/50 bg-card rounded-lg border px-3 py-2 shadow-xl"
+  }, /* @__PURE__ */ React2.createElement("p", {
+    className: "text-muted-foreground text-xs"
+  }, formatDate(label)), /* @__PURE__ */ React2.createElement("div", {
+    className: "mt-1 flex items-baseline gap-2"
+  }, /* @__PURE__ */ React2.createElement("p", {
+    className: "text-foreground text-lg font-bold tabular-nums"
+  }, "$", current.toLocaleString(void 0, {
+    minimumFractionDigits: 0,
+    maximumFractionDigits: 0
+  })), delta && /* @__PURE__ */ React2.createElement("span", {
+    className: `text-xs font-semibold ${deltaColor}`
+  }, delta)), /* @__PURE__ */ React2.createElement("p", {
+    className: "text-muted-foreground text-xs"
+  }, merged.count ?? 0, " purchases"), hasPrev && /* @__PURE__ */ React2.createElement("p", {
+    className: "text-muted-foreground border-border/30 mt-1 border-t pt-1 text-[11px]"
+  }, "prev: $", previous.toLocaleString(void 0, {
+    minimumFractionDigits: 0,
+    maximumFractionDigits: 0
+  }), " ", "\xB7 ", merged.prevCount ?? 0, " purchases"));
+}
+__name(CustomTooltip2, "CustomTooltip");
+function RevenueChart({ data, previousData = [] }) {
+  const colors = useChartColors();
+  const merged = useMemo(() => {
+    if (previousData.length === 0) {
+      return data.map((d) => ({
+        ...d,
+        prevRevenue: null,
+        prevCount: null
+      }));
+    }
+    return data.map((d, i) => {
+      const prev = previousData[i];
+      return {
+        ...d,
+        prevRevenue: prev?.revenue ?? null,
+        prevCount: prev?.count ?? null
+      };
+    });
+  }, [
+    data,
+    previousData
+  ]);
+  const maxRevenue = useMemo(() => Math.max(...merged.map((d) => d.revenue), ...merged.map((d) => d.prevRevenue ?? 0), 0), [
+    merged
+  ]);
+  const nonZeroVals = useMemo(() => merged.map((d) => d.revenue).filter((v) => v > 0).sort((a, b) => a - b), [
+    merged
+  ]);
+  const useLog = useMemo(() => {
+    if (nonZeroVals.length < 3)
+      return false;
+    const median = nonZeroVals[Math.floor(nonZeroVals.length / 2)];
+    return maxRevenue > median * 10;
+  }, [
+    nonZeroVals,
+    maxRevenue
+  ]);
+  const logFloor = nonZeroVals.length > 0 ? Math.floor(nonZeroVals[0] * 0.7) : 100;
+  const hasPrev = previousData.length > 0;
+  return /* @__PURE__ */ React2.createElement("div", {
+    className: "h-[280px] w-full"
+  }, /* @__PURE__ */ React2.createElement(ResponsiveContainer2, {
+    width: "100%",
+    height: "100%"
+  }, /* @__PURE__ */ React2.createElement(AreaChart, {
+    data: merged,
+    margin: {
+      top: 8,
+      right: 8,
+      left: -12,
+      bottom: 0
+    }
+  }, /* @__PURE__ */ React2.createElement("defs", null, /* @__PURE__ */ React2.createElement("linearGradient", {
+    id: "revenueGradient",
+    x1: "0",
+    y1: "0",
+    x2: "0",
+    y2: "1"
+  }, /* @__PURE__ */ React2.createElement("stop", {
+    offset: "0%",
+    stopColor: "#22c55e",
+    stopOpacity: 0.3
+  }), /* @__PURE__ */ React2.createElement("stop", {
+    offset: "100%",
+    stopColor: "#22c55e",
+    stopOpacity: 0
+  }))), /* @__PURE__ */ React2.createElement(CartesianGrid2, {
+    strokeDasharray: "3 3",
+    stroke: colors.gridLine,
+    vertical: false
+  }), /* @__PURE__ */ React2.createElement(XAxis2, {
+    dataKey: "date",
+    tickFormatter: formatDate,
+    tick: {
+      fill: colors.mutedForeground,
+      fontSize: 11
+    },
+    axisLine: {
+      stroke: colors.gridLine
+    },
+    tickLine: false,
+    interval: "preserveStartEnd",
+    minTickGap: 40
+  }), /* @__PURE__ */ React2.createElement(YAxis2, {
+    tick: {
+      fill: colors.mutedForeground,
+      fontSize: 11
+    },
+    axisLine: false,
+    tickLine: false,
+    scale: useLog ? "log" : "auto",
+    domain: useLog ? [
+      logFloor,
+      "auto"
+    ] : [
+      0,
+      Math.ceil(maxRevenue * 1.1)
+    ],
+    allowDataOverflow: useLog,
+    tickFormatter: formatCurrency2
+  }), /* @__PURE__ */ React2.createElement(Tooltip2, {
+    content: /* @__PURE__ */ React2.createElement(CustomTooltip2, null),
+    cursor: {
+      stroke: "#22c55e",
+      strokeWidth: 1,
+      strokeDasharray: "4 4"
+    }
+  }), hasPrev && /* @__PURE__ */ React2.createElement(Area, {
+    type: "linear",
+    dataKey: "prevRevenue",
+    stroke: colors.mutedForeground,
+    strokeWidth: 1.5,
+    strokeDasharray: "4 3",
+    fill: "none",
+    dot: false,
+    activeDot: false,
+    connectNulls: true
+  }), /* @__PURE__ */ React2.createElement(Area, {
+    type: "linear",
+    dataKey: "revenue",
+    stroke: "#22c55e",
+    strokeWidth: 2,
+    fill: "url(#revenueGradient)",
+    dot: false,
+    activeDot: {
+      r: 5,
+      fill: "#22c55e",
+      stroke: colors.cardBg,
+      strokeWidth: 2
+    }
+  }))), hasPrev && /* @__PURE__ */ React2.createElement("div", {
+    className: "mt-2 flex items-center gap-4 text-[11px]"
+  }, /* @__PURE__ */ React2.createElement("span", {
+    className: "flex items-center gap-1.5"
+  }, /* @__PURE__ */ React2.createElement("span", {
+    className: "inline-block h-0.5 w-4 rounded bg-emerald-500"
+  }), /* @__PURE__ */ React2.createElement("span", {
+    className: "text-muted-foreground"
+  }, "Current period")), /* @__PURE__ */ React2.createElement("span", {
+    className: "flex items-center gap-1.5"
+  }, /* @__PURE__ */ React2.createElement("span", {
+    className: "inline-block h-0.5 w-4 rounded",
+    style: {
+      background: colors.mutedForeground,
+      backgroundImage: "repeating-linear-gradient(90deg, transparent, transparent 3px, currentColor 3px, currentColor 5px)"
+    }
+  }), /* @__PURE__ */ React2.createElement("span", {
+    className: "text-muted-foreground"
+  }, "Previous period"))));
+}
+__name(RevenueChart, "RevenueChart");
+
+// src/components/omnibus-dashboard.tsx
+function fmt$(v) {
+  return new Intl.NumberFormat("en-US", {
+    style: "currency",
+    currency: "USD",
+    minimumFractionDigits: 0,
+    maximumFractionDigits: 0
+  }).format(v);
+}
+__name(fmt$, "fmt$");
+function fmtK(v) {
+  if (v >= 1e6)
+    return `${(v / 1e6).toFixed(1)}M`;
+  if (v >= 1e3)
+    return `${(v / 1e3).toFixed(1)}K`;
+  return v.toLocaleString();
+}
+__name(fmtK, "fmtK");
+function fmtWatchMs(ms) {
+  const hours = ms / 1e3 / 60 / 60;
+  if (hours >= 1e3)
+    return `${(hours / 1e3).toFixed(1)}k hrs`;
+  if (hours >= 1)
+    return `${hours.toFixed(0)} hrs`;
+  return `${(ms / 1e3 / 60).toFixed(0)} min`;
+}
+__name(fmtWatchMs, "fmtWatchMs");
+function fmtAgo(date) {
+  const ms = Date.now() - new Date(date).getTime();
+  const h = Math.floor(ms / 36e5);
+  if (h < 1)
+    return "just now";
+  if (h < 24)
+    return `${h}h ago`;
+  const d = Math.floor(h / 24);
+  return d === 1 ? "yesterday" : `${d}d ago`;
+}
+__name(fmtAgo, "fmtAgo");
+function countryFlag2(code) {
+  if (!code || code.length !== 2)
+    return "\u{1F30D}";
+  const offset = 127462;
+  const a = code.toUpperCase().charCodeAt(0) - 65 + offset;
+  const b = code.toUpperCase().charCodeAt(1) - 65 + offset;
+  return String.fromCodePoint(a, b);
+}
+__name(countryFlag2, "countryFlag");
+function Stat({ label, value, sub, icon: Icon, accent }) {
+  return /* @__PURE__ */ React3.createElement("div", {
+    className: `rounded-xl border p-4 transition-[transform,box-shadow] duration-[160ms] ease-[cubic-bezier(0.23,1,0.32,1)] active:scale-[0.97] motion-safe:hover:-translate-y-0.5 motion-safe:hover:shadow-md [@media(hover:hover)]:cursor-default ${accent ? "border-emerald-500/20 bg-emerald-500/[0.03]" : "border-border/50 bg-card/50"}`
+  }, /* @__PURE__ */ React3.createElement("div", {
+    className: "flex items-center justify-between"
+  }, /* @__PURE__ */ React3.createElement("span", {
+    className: "text-muted-foreground text-[11px] font-medium uppercase tracking-wider"
+  }, label), /* @__PURE__ */ React3.createElement(Icon, {
+    className: "text-muted-foreground/40 group-hover:text-muted-foreground/70 h-3.5 w-3.5 transition-colors duration-200"
+  })), /* @__PURE__ */ React3.createElement("div", {
+    className: "mt-1.5"
+  }, /* @__PURE__ */ React3.createElement("span", {
+    className: "text-foreground text-xl font-bold tabular-nums tracking-tight"
+  }, value)), sub && /* @__PURE__ */ React3.createElement("p", {
+    className: "text-muted-foreground mt-0.5 text-[11px] leading-relaxed"
+  }, sub));
+}
+__name(Stat, "Stat");
+function AgentApiCard({ appName = "aihero" }) {
+  const [state, setState] = useState2("idle");
+  const baseUrl = typeof window !== "undefined" ? window.location.origin : "https://www.aihero.dev";
+  const endpoint = `${baseUrl}/api/analytics`;
+  const handleCopy = /* @__PURE__ */ __name(async () => {
+    setState("generating");
+    try {
+      const [tokenRes, catalogRes] = await Promise.all([
+        fetch("/api/analytics/token", {
+          method: "POST"
+        }),
+        fetch("/api/analytics").then((r) => r.json()).catch(() => null)
+      ]);
+      if (!tokenRes.ok)
+        throw new Error("Failed to generate token");
+      const { token, ttlLabel, expiresAt } = await tokenRes.json();
+      const surfaces = catalogRes?.surfaces ?? [];
+      const categories = /* @__PURE__ */ new Map();
+      for (const s of surfaces) {
+        categories.set(s.category, (categories.get(s.category) ?? 0) + 1);
+      }
+      const categoryLine = [
+        ...categories.entries()
+      ].map(([cat, count]) => `${cat} (${count})`).join(", ");
+      const picks = [
+        {
+          name: "",
+          description: "surface catalog"
+        }
+      ];
+      const seen = /* @__PURE__ */ new Set();
+      const preferred = [
+        "summary",
+        "attribution/coverage",
+        "traffic",
+        "youtube/videos",
+        "surveys",
+        "correlation/traffic-revenue",
+        "correlation/youtube-revenue",
+        "attribution/email-campaigns"
+      ];
+      for (const name of preferred) {
+        const s = surfaces.find((x) => x.name === name);
+        if (s && !seen.has(s.category)) {
+          seen.add(s.category);
+          picks.push({
+            name: s.name,
+            description: s.description
+          });
+        }
+      }
+      for (const s of surfaces) {
+        if (!seen.has(s.category)) {
+          seen.add(s.category);
+          picks.push({
+            name: s.name,
+            description: s.description
+          });
+        }
+      }
+      const exampleLines = picks.map((p) => p.name ? `GET ${endpoint}?surface=${p.name}&range=30d  \u2192 ${p.description}` : `GET ${endpoint}  \u2192 ${p.description}`).join("\n");
+      const hasYouTube = surfaces.some((s) => s.category === "youtube");
+      const ytNote = hasYouTube ? `
+Important:
+- YouTube surfaces are useful for correlation and content analysis, not live dashboard ops
+- YouTube Analytics data lags by about 48 hours, so call out the delay when interpreting fresh periods
+` : "";
+      const prompt = `# ${appName} Analytics API
+Base: ${endpoint}
+Auth: Bearer ${token}
+Token expires: ${new Date(expiresAt).toLocaleString()} (${ttlLabel})
+
+${exampleLines}
+${ytNote}
+Example:
+curl -H "Authorization: Bearer ${token}" "${endpoint}?surface=summary&range=30d"
+
+Categories: ${categoryLine}
+Every response has contextual next_actions. Errors have codes + fix hints.`;
+      await navigator.clipboard.writeText(prompt);
+      setState("copied");
+      setTimeout(() => setState("idle"), 3e3);
+    } catch {
+      setState("idle");
+    }
+  }, "handleCopy");
+  return /* @__PURE__ */ React3.createElement("div", {
+    className: "border-border/30 flex flex-wrap items-center justify-between gap-2 rounded-lg border px-3 py-2 sm:px-4 sm:py-2.5"
+  }, /* @__PURE__ */ React3.createElement("div", {
+    className: "flex min-w-0 items-center gap-2 text-xs"
+  }, /* @__PURE__ */ React3.createElement("span", {
+    className: "text-muted-foreground/60 shrink-0"
+  }, "\u26A1"), /* @__PURE__ */ React3.createElement("a", {
+    href: "/api/analytics",
+    target: "_blank",
+    rel: "noopener noreferrer",
+    className: "text-muted-foreground hover:text-foreground shrink-0 font-medium underline-offset-2 transition-colors hover:underline"
+  }, "/api/analytics"), /* @__PURE__ */ React3.createElement("span", {
+    className: "text-muted-foreground/40 hidden sm:inline"
+  }, "\xB7"), /* @__PURE__ */ React3.createElement("span", {
+    className: "text-muted-foreground/60 hidden sm:inline"
+  }, "HATEOAS catalog")), /* @__PURE__ */ React3.createElement("button", {
+    onClick: handleCopy,
+    disabled: state === "generating",
+    className: `flex shrink-0 items-center gap-1.5 rounded-md px-3 py-1.5 text-[11px] font-semibold transition-[transform,background-color,color,box-shadow] duration-[160ms] ease-[cubic-bezier(0.23,1,0.32,1)] active:scale-[0.97] disabled:pointer-events-none ${state === "copied" ? "bg-emerald-500/10 text-emerald-600 dark:text-emerald-400" : state === "generating" ? "bg-muted text-muted-foreground" : "bg-primary/10 text-primary hover:bg-primary/20 shadow-sm"}`
+  }, state === "generating" ? /* @__PURE__ */ React3.createElement(React3.Fragment, null, /* @__PURE__ */ React3.createElement(Loader2Icon, {
+    className: "h-3 w-3 animate-spin"
+  }), "Generating token\u2026") : state === "copied" ? /* @__PURE__ */ React3.createElement(React3.Fragment, null, /* @__PURE__ */ React3.createElement(CheckIcon, {
+    className: "h-3 w-3"
+  }), "Copied with token") : /* @__PURE__ */ React3.createElement(React3.Fragment, null, /* @__PURE__ */ React3.createElement(ClipboardIcon, {
+    className: "h-3 w-3"
+  }), "Copy agent prompt")));
+}
+__name(AgentApiCard, "AgentApiCard");
+function TopVideosCard({ label, subtitle, icon: Icon, iconColor, videos }) {
+  if (videos.length === 0)
+    return null;
+  return /* @__PURE__ */ React3.createElement(Card, {
+    className: "flex-1"
+  }, /* @__PURE__ */ React3.createElement(CardHeader, {
+    className: "pb-3"
+  }, /* @__PURE__ */ React3.createElement("div", {
+    className: "flex items-center gap-2.5"
+  }, /* @__PURE__ */ React3.createElement("div", {
+    className: `flex h-7 w-7 items-center justify-center rounded-lg ${iconColor}`
+  }, /* @__PURE__ */ React3.createElement(Icon, {
+    className: "h-3.5 w-3.5"
+  })), /* @__PURE__ */ React3.createElement("div", null, /* @__PURE__ */ React3.createElement(CardTitle, {
+    className: "text-sm font-semibold"
+  }, label), /* @__PURE__ */ React3.createElement(CardDescription, {
+    className: "text-[11px]"
+  }, subtitle)))), /* @__PURE__ */ React3.createElement(CardContent, {
+    className: "space-y-0 pt-0"
+  }, videos.map((v, i) => {
+    const Row = v.href ? "a" : "div";
+    const linkProps = v.href ? {
+      href: v.href,
+      target: "_blank",
+      rel: "noopener noreferrer"
+    } : {};
+    return /* @__PURE__ */ React3.createElement(Row, {
+      key: v.title,
+      ...linkProps,
+      className: "hover:bg-muted/40 group -mx-2 flex items-center gap-3 rounded-lg px-2 py-2.5 transition-[background-color] duration-[150ms] ease-[cubic-bezier(0.23,1,0.32,1)]"
+    }, /* @__PURE__ */ React3.createElement("span", {
+      className: "text-muted-foreground/50 w-4 text-right text-xs font-medium tabular-nums"
+    }, i + 1), v.thumbnailUrl ? /* @__PURE__ */ React3.createElement("img", {
+      src: v.thumbnailUrl,
+      alt: "",
+      width: 72,
+      height: 40,
+      loading: "lazy",
+      className: "hidden h-10 w-[72px] shrink-0 rounded object-cover sm:block"
+    }) : /* @__PURE__ */ React3.createElement("div", {
+      className: "bg-muted hidden h-10 w-[72px] shrink-0 items-center justify-center rounded sm:flex"
+    }, /* @__PURE__ */ React3.createElement(PlayIcon, {
+      className: "text-muted-foreground/40 h-4 w-4",
+      "aria-hidden": "true"
+    })), /* @__PURE__ */ React3.createElement("div", {
+      className: "min-w-0 flex-1"
+    }, /* @__PURE__ */ React3.createElement("p", {
+      className: "text-foreground/90 group-hover:text-foreground line-clamp-2 text-[13px] font-medium leading-snug transition-colors"
+    }, v.title), /* @__PURE__ */ React3.createElement("div", {
+      className: "text-muted-foreground mt-1 flex flex-wrap items-center gap-x-3 gap-y-0.5 text-[11px]"
+    }, /* @__PURE__ */ React3.createElement("span", {
+      className: "flex items-center gap-1"
+    }, /* @__PURE__ */ React3.createElement(ClockIcon, {
+      className: "h-3 w-3",
+      "aria-hidden": "true"
+    }), v.watchTime), /* @__PURE__ */ React3.createElement("span", null, fmtK(v.views), " views"), v.badge && /* @__PURE__ */ React3.createElement("span", {
+      className: "text-emerald-600 dark:text-emerald-400"
+    }, v.badge))), v.href && /* @__PURE__ */ React3.createElement(ExternalLinkIcon, {
+      className: "text-muted-foreground/0 group-hover:text-muted-foreground/60 h-3.5 w-3.5 shrink-0 transition-colors",
+      "aria-hidden": "true"
+    }));
+  })));
+}
+__name(TopVideosCard, "TopVideosCard");
+function ShortlinksCard({ shortlinks, totalClicks }) {
+  const [expanded, setExpanded] = useState2(false);
+  if (shortlinks.length === 0)
+    return null;
+  const visible = expanded ? shortlinks : shortlinks.slice(0, 10);
+  const hasMore = shortlinks.length > 10;
+  const totalSignups = shortlinks.reduce((s, l) => s + l.signups, 0);
+  const totalPurchases = shortlinks.reduce((s, l) => s + l.purchases, 0);
+  return /* @__PURE__ */ React3.createElement(Card, null, /* @__PURE__ */ React3.createElement(CardHeader, null, /* @__PURE__ */ React3.createElement("div", {
+    className: "flex items-center gap-2.5"
+  }, /* @__PURE__ */ React3.createElement(LinkIcon, {
+    className: "text-muted-foreground h-4 w-4"
+  }), /* @__PURE__ */ React3.createElement("div", null, /* @__PURE__ */ React3.createElement(CardTitle, {
+    className: "text-sm font-semibold"
+  }, "Top Shortlinks"), /* @__PURE__ */ React3.createElement(CardDescription, {
+    className: "text-[11px]"
+  }, fmtK(totalClicks), " clicks \xB7 ", totalSignups.toLocaleString(), " ", "signups \xB7 ", totalPurchases.toLocaleString(), " purchases")))), /* @__PURE__ */ React3.createElement(CardContent, null, /* @__PURE__ */ React3.createElement("div", {
+    className: "overflow-x-auto"
+  }, /* @__PURE__ */ React3.createElement("table", {
+    className: "w-full"
+  }, /* @__PURE__ */ React3.createElement("thead", null, /* @__PURE__ */ React3.createElement("tr", {
+    className: "text-muted-foreground border-border/50 border-b text-left text-[11px] uppercase tracking-wider"
+  }, /* @__PURE__ */ React3.createElement("th", {
+    className: "pb-2.5 pr-4 font-medium"
+  }, "Link"), /* @__PURE__ */ React3.createElement("th", {
+    className: "pb-2.5 pr-4 font-medium"
+  }, "Destination"), /* @__PURE__ */ React3.createElement("th", {
+    className: "pb-2.5 text-right font-medium"
+  }, "Clicks"), /* @__PURE__ */ React3.createElement("th", {
+    className: "hidden pb-2.5 text-right font-medium sm:table-cell"
+  }, "Signups"), /* @__PURE__ */ React3.createElement("th", {
+    className: "hidden pb-2.5 text-right font-medium sm:table-cell"
+  }, "Purchases"))), /* @__PURE__ */ React3.createElement("tbody", {
+    className: "divide-border/30 divide-y"
+  }, visible.map((link) => /* @__PURE__ */ React3.createElement("tr", {
+    key: link.shortlinkId,
+    className: "group"
+  }, /* @__PURE__ */ React3.createElement("td", {
+    className: "py-2.5 pr-4 text-sm font-medium"
+  }, "/s/", link.slug), /* @__PURE__ */ React3.createElement("td", {
+    className: "text-muted-foreground max-w-xs truncate py-2.5 pr-4 text-sm"
+  }, /* @__PURE__ */ React3.createElement("a", {
+    href: link.url,
+    target: "_blank",
+    rel: "noopener noreferrer",
+    className: "hover:text-foreground inline-flex items-center gap-1 transition-colors"
+  }, link.url.replace(/^https?:\/\/(www\.)?/, "").substring(0, 50), /* @__PURE__ */ React3.createElement(ExternalLinkIcon, {
+    className: "h-3 w-3 opacity-0 transition-opacity group-hover:opacity-100",
+    "aria-hidden": "true"
+  }))), /* @__PURE__ */ React3.createElement("td", {
+    className: "text-foreground py-2.5 text-right text-sm font-semibold tabular-nums"
+  }, link.clicks.toLocaleString()), /* @__PURE__ */ React3.createElement("td", {
+    className: "hidden py-2.5 text-right text-sm tabular-nums sm:table-cell"
+  }, link.signups > 0 ? link.signups.toLocaleString() : "\u2013"), /* @__PURE__ */ React3.createElement("td", {
+    className: `hidden py-2.5 text-right text-sm font-semibold tabular-nums sm:table-cell ${link.purchases > 0 ? "text-emerald-600 dark:text-emerald-400" : "text-muted-foreground"}`
+  }, link.purchases > 0 ? link.purchases.toLocaleString() : "\u2013")))))), hasMore && /* @__PURE__ */ React3.createElement("button", {
+    onClick: () => setExpanded(!expanded),
+    className: "text-muted-foreground hover:text-foreground mt-3 flex w-full items-center justify-center gap-1 text-xs transition-[color,transform] duration-[160ms] ease-[cubic-bezier(0.23,1,0.32,1)] active:scale-[0.97]"
+  }, /* @__PURE__ */ React3.createElement(ChevronDownIcon, {
+    className: `h-3 w-3 transition-transform duration-[200ms] ease-[cubic-bezier(0.23,1,0.32,1)] ${expanded ? "rotate-180" : ""}`
+  }), expanded ? "Show less" : `Show ${shortlinks.length - 10} more`)));
+}
+__name(ShortlinksCard, "ShortlinksCard");
+var RANGES = [
+  {
+    value: "24h",
+    label: "24h"
+  },
+  {
+    value: "7d",
+    label: "7d"
+  },
+  {
+    value: "30d",
+    label: "30d"
+  },
+  {
+    value: "90d",
+    label: "90d"
+  },
+  {
+    value: "all",
+    label: "All"
+  }
+];
+var rangeParser = parseAsStringLiteral([
+  "24h",
+  "7d",
+  "30d",
+  "90d",
+  "all"
+]).withDefault("30d");
+function OmnibusDashboard({ data, initialRange, appName, surveyDrilldownHref }) {
+  const [range, setRange] = useQueryState("range", rangeParser);
+  const [isPending, startTransition] = useTransition();
+  const rangeLabel = range === "24h" ? "24 hours" : range === "7d" ? "7 days" : range === "90d" ? "90 days" : range === "all" ? "all time" : "30 days";
+  const signupCount = data.attribution.find((a) => a.type === "signup")?.count ?? 0;
+  const purchaseAttrCount = data.attribution.find((a) => a.type === "purchase")?.count ?? 0;
+  const totalClicks = data.shortlinks.reduce((s, l) => s + l.clicks, 0);
+  const hasRevenue = data.summary.totalRevenue > 0 || data.summary.purchaseCount > 0;
+  const hasRevenueChart = data.daily.some((d) => d.revenue > 0);
+  const hasByProduct = data.byProduct.length > 0;
+  const hasByCountry = data.byCountry.length > 0;
+  const hasRecentPurchases = data.recentPurchases.length > 0;
+  const hasAttribution = data.attribution.length > 0;
+  const hasAttributionCoverage = data.attributionCoverage != null;
+  const hasMux = data.mux != null;
+  const hasTraffic = data.traffic != null;
+  const hasSurveys = data.surveySegments != null && data.surveySegments.length > 0;
+  const hasSurveyCorrelation = data.surveyCorrelation != null;
+  const hasShortlinks = data.shortlinks.length > 0;
+  return /* @__PURE__ */ React3.createElement("div", {
+    className: "flex flex-col gap-5 lg:gap-7"
+  }, /* @__PURE__ */ React3.createElement("div", {
+    className: "flex flex-col gap-3 sm:flex-row sm:items-end sm:justify-between"
+  }, /* @__PURE__ */ React3.createElement("div", {
+    className: "min-w-0"
+  }, /* @__PURE__ */ React3.createElement("h1", {
+    className: "text-pretty text-xl font-bold tracking-tight sm:text-2xl"
+  }, "Analytics"), /* @__PURE__ */ React3.createElement("p", {
+    className: "text-muted-foreground truncate text-[13px]"
+  }, "Revenue \xB7 Attribution \xB7 Video \xB7 Traffic \xB7 Surveys \u2014 ", rangeLabel)), /* @__PURE__ */ React3.createElement("div", {
+    className: "flex shrink-0 items-center gap-2"
+  }, isPending && /* @__PURE__ */ React3.createElement("span", {
+    className: "text-muted-foreground animate-pulse text-xs"
+  }, "Loading\u2026"), /* @__PURE__ */ React3.createElement("div", {
+    className: "border-border/40 bg-muted/20 inline-flex items-center gap-0.5 overflow-x-auto rounded-lg border p-0.5"
+  }, RANGES.map(({ value, label }) => /* @__PURE__ */ React3.createElement("button", {
+    key: value,
+    onClick: () => startTransition(() => {
+      setRange(value);
+    }),
+    disabled: isPending,
+    className: `shrink-0 rounded-md px-2.5 py-1 text-[11px] font-medium transition-[background-color,color,transform] duration-[150ms] ease-[cubic-bezier(0.23,1,0.32,1)] active:scale-[0.95] ${range === value ? "bg-foreground text-background shadow-sm" : "text-muted-foreground hover:text-foreground"} ${isPending ? "cursor-wait opacity-60" : ""}`
+  }, label))))), /* @__PURE__ */ React3.createElement("div", {
+    className: `flex flex-col gap-5 transition-opacity duration-200 lg:gap-7 ${isPending ? "pointer-events-none opacity-50" : ""}`
+  }, /* @__PURE__ */ React3.createElement(AgentApiCard, {
+    appName
+  }), /* @__PURE__ */ React3.createElement("div", {
+    className: "grid grid-cols-2 gap-2.5 lg:grid-cols-3 xl:grid-cols-5"
+  }, hasRevenue && /* @__PURE__ */ React3.createElement(Stat, {
+    label: "Revenue",
+    value: fmt$(data.summary.totalRevenue),
+    sub: `${data.summary.purchaseCount} purchases \xB7 ${fmt$(data.summary.avgOrderValue)} avg`,
+    icon: DollarSignIcon,
+    accent: true
+  }), hasMux && /* @__PURE__ */ React3.createElement(Stat, {
+    label: "Site Watch Time",
+    value: fmtWatchMs(data.mux.overview.totalPlayingTimeMs),
+    sub: `${fmtK(data.mux.overview.totalViews)} views \xB7 ${fmtK(data.mux.overview.uniqueViewers)} viewers`,
+    icon: FilmIcon
+  }), hasTraffic && /* @__PURE__ */ React3.createElement(Stat, {
+    label: "Sessions",
+    value: fmtK(data.traffic.sessions),
+    sub: `${fmtK(data.traffic.totalUsers)} users \xB7 ${fmtK(data.traffic.pageviews)} pages`,
+    icon: GlobeIcon
+  }), purchaseAttrCount > 0 && /* @__PURE__ */ React3.createElement(Stat, {
+    label: "Conversions",
+    value: `${purchaseAttrCount.toLocaleString()}`,
+    sub: `${signupCount} signups \xB7 ${totalClicks > 0 ? (purchaseAttrCount / signupCount * 100).toFixed(1) : 0}% signup\u2192purchase`,
+    icon: TrendingUpIcon
+  }), hasShortlinks && /* @__PURE__ */ React3.createElement(Stat, {
+    label: "Link Clicks",
+    value: fmtK(totalClicks),
+    sub: `${data.shortlinks.length} active \xB7 ${signupCount} signups`,
+    icon: MousePointerClickIcon
+  }), hasSurveys && /* @__PURE__ */ React3.createElement(Stat, {
+    label: "Surveys",
+    value: `${data.surveySegments.length}`,
+    sub: `${data.surveySegments.reduce((s, q) => s + q.responses, 0).toLocaleString()} responses`,
+    icon: ClipboardListIcon
+  })), hasMux && data.mux.topVideos.length > 0 && /* @__PURE__ */ React3.createElement(TopVideosCard, {
+    label: "Site Videos",
+    subtitle: `${fmtWatchMs(data.mux.overview.totalPlayingTimeMs)} watch time \xB7 ${fmtK(data.mux.overview.uniqueViewers)} viewers`,
+    icon: FilmIcon,
+    iconColor: "bg-violet-500/10 text-violet-500",
+    videos: data.mux.topVideos.slice(0, 5).map((v) => ({
+      title: v.title,
+      thumbnailUrl: data.muxThumbnails[v.title] ?? null,
+      watchTime: fmtWatchMs(v.playingTimeMs),
+      views: v.views,
+      href: null
+    }))
+  }), purchaseAttrCount > 0 && /* @__PURE__ */ React3.createElement(Card, null, /* @__PURE__ */ React3.createElement(CardHeader, {
+    className: "pb-3"
+  }, /* @__PURE__ */ React3.createElement("div", {
+    className: "flex items-center gap-2.5"
+  }, /* @__PURE__ */ React3.createElement(LinkIcon, {
+    className: "text-muted-foreground h-4 w-4"
+  }), /* @__PURE__ */ React3.createElement("div", null, /* @__PURE__ */ React3.createElement(CardTitle, {
+    className: "text-sm font-semibold"
+  }, "Attribution Trail"), /* @__PURE__ */ React3.createElement(CardDescription, {
+    className: "text-[11px]"
+  }, "Shortlink conversions \xB7 first-touch UTMs accumulating")))), /* @__PURE__ */ React3.createElement(CardContent, null, /* @__PURE__ */ React3.createElement("div", {
+    className: "grid gap-3 sm:grid-cols-3"
+  }, /* @__PURE__ */ React3.createElement("div", {
+    className: "bg-muted/20 rounded-lg p-3.5"
+  }, /* @__PURE__ */ React3.createElement("span", {
+    className: "text-muted-foreground block text-[11px] font-medium uppercase tracking-wider"
+  }, "Click \u2192 Signup"), /* @__PURE__ */ React3.createElement("span", {
+    className: "text-foreground mt-1 block text-xl font-bold tabular-nums"
+  }, signupCount.toLocaleString())), /* @__PURE__ */ React3.createElement("div", {
+    className: "bg-muted/20 rounded-lg p-3.5"
+  }, /* @__PURE__ */ React3.createElement("span", {
+    className: "text-muted-foreground block text-[11px] font-medium uppercase tracking-wider"
+  }, "Click \u2192 Purchase"), /* @__PURE__ */ React3.createElement("span", {
+    className: "text-foreground mt-1 block text-xl font-bold tabular-nums"
+  }, purchaseAttrCount.toLocaleString())), /* @__PURE__ */ React3.createElement("div", {
+    className: "bg-muted/20 rounded-lg p-3.5"
+  }, /* @__PURE__ */ React3.createElement("span", {
+    className: "text-muted-foreground block text-[11px] font-medium uppercase tracking-wider"
+  }, "Conversion Rate"), /* @__PURE__ */ React3.createElement("span", {
+    className: "text-foreground mt-1 block text-xl font-bold tabular-nums"
+  }, signupCount > 0 ? `${(purchaseAttrCount / signupCount * 100).toFixed(1)}%` : "\u2014"))))), hasAttributionCoverage && data.attributionCoverage.totalPurchases > 0 && /* @__PURE__ */ React3.createElement(Card, null, /* @__PURE__ */ React3.createElement(CardHeader, {
+    className: "pb-3"
+  }, /* @__PURE__ */ React3.createElement("div", {
+    className: "flex items-center gap-2.5"
+  }, /* @__PURE__ */ React3.createElement(TrendingUpIcon, {
+    className: "text-muted-foreground h-4 w-4"
+  }), /* @__PURE__ */ React3.createElement("div", null, /* @__PURE__ */ React3.createElement(CardTitle, {
+    className: "text-sm font-semibold"
+  }, "Attribution Coverage"), /* @__PURE__ */ React3.createElement(CardDescription, {
+    className: "text-[11px]"
+  }, "Attributed vs dark revenue")))), /* @__PURE__ */ React3.createElement(CardContent, null, /* @__PURE__ */ React3.createElement("div", {
+    className: "grid gap-3 sm:grid-cols-3"
+  }, /* @__PURE__ */ React3.createElement("div", {
+    className: "bg-muted/20 rounded-lg p-3.5"
+  }, /* @__PURE__ */ React3.createElement("span", {
+    className: "text-muted-foreground block text-[11px] font-medium uppercase tracking-wider"
+  }, "Attributed"), /* @__PURE__ */ React3.createElement("span", {
+    className: "text-foreground mt-1 block text-xl font-bold tabular-nums"
+  }, fmt$(data.attributionCoverage.attributedRevenue)), /* @__PURE__ */ React3.createElement("span", {
+    className: "text-muted-foreground text-[11px]"
+  }, (data.attributionCoverage.attributionRate * 100).toFixed(1), "% of total")), /* @__PURE__ */ React3.createElement("div", {
+    className: "bg-muted/20 rounded-lg p-3.5"
+  }, /* @__PURE__ */ React3.createElement("span", {
+    className: "text-muted-foreground block text-[11px] font-medium uppercase tracking-wider"
+  }, "Dark / Unknown"), /* @__PURE__ */ React3.createElement("span", {
+    className: "text-foreground mt-1 block text-xl font-bold tabular-nums"
+  }, fmt$(data.attributionCoverage.unattributedRevenue))), /* @__PURE__ */ React3.createElement("div", {
+    className: "bg-muted/20 rounded-lg p-3.5"
+  }, /* @__PURE__ */ React3.createElement("span", {
+    className: "text-muted-foreground block text-[11px] font-medium uppercase tracking-wider"
+  }, "Total Purchases"), /* @__PURE__ */ React3.createElement("span", {
+    className: "text-foreground mt-1 block text-xl font-bold tabular-nums"
+  }, data.attributionCoverage.totalPurchases.toLocaleString()))))), hasSurveys && /* @__PURE__ */ React3.createElement(Card, null, /* @__PURE__ */ React3.createElement(CardHeader, {
+    className: "pb-3"
+  }, /* @__PURE__ */ React3.createElement("div", {
+    className: "flex items-center justify-between"
+  }, /* @__PURE__ */ React3.createElement("div", {
+    className: "flex items-center gap-2.5"
+  }, /* @__PURE__ */ React3.createElement("div", {
+    className: "flex h-7 w-7 items-center justify-center rounded-lg bg-indigo-500/10 text-indigo-500"
+  }, /* @__PURE__ */ React3.createElement(ClipboardListIcon, {
+    className: "h-3.5 w-3.5"
+  })), /* @__PURE__ */ React3.createElement("div", null, /* @__PURE__ */ React3.createElement(CardTitle, {
+    className: "text-sm font-semibold"
+  }, "Survey Segments"), /* @__PURE__ */ React3.createElement(CardDescription, {
+    className: "text-[11px]"
+  }, "How users self-categorize across survey questions"))), surveyDrilldownHref && /* @__PURE__ */ React3.createElement("a", {
+    href: surveyDrilldownHref,
+    className: "text-muted-foreground hover:text-foreground text-[11px] font-medium transition-colors"
+  }, "View all surveys \u2192"))), /* @__PURE__ */ React3.createElement(CardContent, {
+    className: "space-y-6"
+  }, data.surveySegments.slice(0, 8).map((q) => {
+    const totalForQuestion = q.answerDistribution.reduce((s, a) => s + a.count, 0);
+    return /* @__PURE__ */ React3.createElement("div", {
+      key: q.questionId
+    }, /* @__PURE__ */ React3.createElement("div", {
+      className: "mb-2.5 flex items-start justify-between gap-2"
+    }, /* @__PURE__ */ React3.createElement("p", {
+      className: "text-foreground text-[13px] font-medium leading-snug"
+    }, q.question), /* @__PURE__ */ React3.createElement("span", {
+      className: "text-muted-foreground shrink-0 text-[11px] tabular-nums"
+    }, totalForQuestion.toLocaleString(), " responses")), /* @__PURE__ */ React3.createElement("div", {
+      className: "space-y-1.5"
+    }, q.answerDistribution.slice(0, 6).map((a) => {
+      const pct = totalForQuestion > 0 ? a.count / totalForQuestion * 100 : 0;
+      return /* @__PURE__ */ React3.createElement("div", {
+        key: a.answer,
+        className: "group flex items-center gap-2.5"
+      }, /* @__PURE__ */ React3.createElement("span", {
+        className: "text-muted-foreground w-[120px] shrink-0 truncate text-right text-[12px]",
+        title: a.answer
+      }, a.answer), /* @__PURE__ */ React3.createElement("div", {
+        className: "bg-muted/50 relative h-5 flex-1 overflow-hidden rounded"
+      }, /* @__PURE__ */ React3.createElement("div", {
+        className: "absolute inset-y-0 left-0 rounded bg-indigo-500/20 transition-all duration-300",
+        style: {
+          width: `${Math.max(pct, 1)}%`
+        }
+      }), /* @__PURE__ */ React3.createElement("div", {
+        className: "relative flex h-full items-center px-2"
+      }, /* @__PURE__ */ React3.createElement("span", {
+        className: "text-foreground/70 text-[11px] font-medium tabular-nums"
+      }, pct.toFixed(0), "%"))), /* @__PURE__ */ React3.createElement("span", {
+        className: "text-muted-foreground w-10 shrink-0 text-right text-[11px] tabular-nums"
+      }, a.count.toLocaleString()));
+    }), q.answerDistribution.length > 6 && /* @__PURE__ */ React3.createElement("p", {
+      className: "text-muted-foreground/60 pl-[132px] text-[11px]"
+    }, "+", q.answerDistribution.length - 6, " more answers")));
+  }))), hasSurveyCorrelation && /* @__PURE__ */ React3.createElement(Card, null, /* @__PURE__ */ React3.createElement(CardHeader, {
+    className: "pb-3"
+  }, /* @__PURE__ */ React3.createElement("div", {
+    className: "flex items-center gap-2.5"
+  }, /* @__PURE__ */ React3.createElement("div", {
+    className: "flex h-7 w-7 items-center justify-center rounded-lg bg-emerald-500/10 text-emerald-500"
+  }, /* @__PURE__ */ React3.createElement(TrendingUpIcon, {
+    className: "h-3.5 w-3.5"
+  })), /* @__PURE__ */ React3.createElement("div", null, /* @__PURE__ */ React3.createElement(CardTitle, {
+    className: "text-sm font-semibold"
+  }, "Survey \u2192 Purchase Correlation"), /* @__PURE__ */ React3.createElement(CardDescription, {
+    className: "text-[11px]"
+  }, "Which survey answers predict purchases? We match survey respondents against the purchases table to find conversion rates per answer.")))), /* @__PURE__ */ React3.createElement(CardContent, {
+    className: "space-y-5"
+  }, /* @__PURE__ */ React3.createElement("p", {
+    className: "text-muted-foreground text-[12px] leading-relaxed"
+  }, "We look at every user who answered a survey and check if they ever made a purchase.", /* @__PURE__ */ React3.createElement("strong", {
+    className: "text-foreground"
+  }, " Conversion"), " = respondents who purchased / total respondents.", /* @__PURE__ */ React3.createElement("strong", {
+    className: "text-foreground"
+  }, " Baseline"), " = purchase rate of users who ", /* @__PURE__ */ React3.createElement("em", null, "never"), " took a survey, so you can see if survey-takers convert at a higher or lower rate.", /* @__PURE__ */ React3.createElement("strong", {
+    className: "text-foreground"
+  }, " Revenue"), " = total lifetime spend of respondents who purchased."), (() => {
+    const sc = data.surveyCorrelation;
+    const totalRespondents = sc.totalRespondents ?? 0;
+    const purchased = sc.respondentsWhoPurchased ?? 0;
+    const convRate = sc.overallConversionRate ?? 0;
+    const revenue = sc.totalRevenueFromRespondents ?? 0;
+    const baseline = sc.baselineConversionRate ?? 0;
+    const pre = sc.prePurchaseRespondents ?? 0;
+    const post = sc.postPurchaseRespondents ?? 0;
+    const never = sc.neverPurchasedRespondents ?? 0;
+    return /* @__PURE__ */ React3.createElement(React3.Fragment, null, /* @__PURE__ */ React3.createElement("div", {
+      className: "grid grid-cols-2 gap-2 sm:grid-cols-5"
+    }, /* @__PURE__ */ React3.createElement("div", {
+      className: "bg-muted/20 rounded-lg p-3"
+    }, /* @__PURE__ */ React3.createElement("span", {
+      className: "text-muted-foreground block text-[11px] font-medium uppercase tracking-wider"
+    }, "Respondents"), /* @__PURE__ */ React3.createElement("span", {
+      className: "text-foreground mt-1 block text-lg font-bold tabular-nums"
+    }, totalRespondents.toLocaleString()), /* @__PURE__ */ React3.createElement("span", {
+      className: "text-muted-foreground/70 text-[10px]"
+    }, "unique users who answered")), /* @__PURE__ */ React3.createElement("div", {
+      className: "bg-muted/20 rounded-lg p-3"
+    }, /* @__PURE__ */ React3.createElement("span", {
+      className: "text-muted-foreground block text-[11px] font-medium uppercase tracking-wider"
+    }, "Purchased"), /* @__PURE__ */ React3.createElement("span", {
+      className: "text-foreground mt-1 block text-lg font-bold tabular-nums"
+    }, purchased.toLocaleString()), /* @__PURE__ */ React3.createElement("span", {
+      className: "text-muted-foreground/70 text-[10px]"
+    }, "of those also bought")), /* @__PURE__ */ React3.createElement("div", {
+      className: "bg-muted/20 rounded-lg p-3"
+    }, /* @__PURE__ */ React3.createElement("span", {
+      className: "text-muted-foreground block text-[11px] font-medium uppercase tracking-wider"
+    }, "Conversion"), /* @__PURE__ */ React3.createElement("span", {
+      className: "text-foreground mt-1 block text-lg font-bold tabular-nums"
+    }, (convRate * 100).toFixed(1), "%"), /* @__PURE__ */ React3.createElement("span", {
+      className: "text-muted-foreground/70 text-[10px]"
+    }, "respondent \u2192 purchaser")), /* @__PURE__ */ React3.createElement("div", {
+      className: "bg-muted/20 rounded-lg p-3"
+    }, /* @__PURE__ */ React3.createElement("span", {
+      className: "text-muted-foreground block text-[11px] font-medium uppercase tracking-wider"
+    }, "Revenue"), /* @__PURE__ */ React3.createElement("span", {
+      className: "text-foreground mt-1 block text-lg font-bold tabular-nums"
+    }, fmt$(revenue)), /* @__PURE__ */ React3.createElement("span", {
+      className: "text-muted-foreground/70 text-[10px]"
+    }, "lifetime spend of purchasers")), /* @__PURE__ */ React3.createElement("div", {
+      className: "bg-muted/20 rounded-lg p-3"
+    }, /* @__PURE__ */ React3.createElement("span", {
+      className: "text-muted-foreground block text-[11px] font-medium uppercase tracking-wider"
+    }, "Baseline"), /* @__PURE__ */ React3.createElement("span", {
+      className: "text-foreground mt-1 block text-lg font-bold tabular-nums"
+    }, (baseline * 100).toFixed(1), "%"), /* @__PURE__ */ React3.createElement("span", {
+      className: "text-muted-foreground/70 text-[10px]"
+    }, "users who never took a survey"))), /* @__PURE__ */ React3.createElement("div", {
+      className: "border-border/30 rounded-lg border px-4 py-3"
+    }, /* @__PURE__ */ React3.createElement("p", {
+      className: "text-muted-foreground mb-2 text-[11px]"
+    }, "Of the ", purchased.toLocaleString(), " purchasers, when did they first respond relative to their first purchase?"), /* @__PURE__ */ React3.createElement("div", {
+      className: "flex flex-wrap items-center gap-x-6 gap-y-2"
+    }, /* @__PURE__ */ React3.createElement("div", {
+      className: "flex items-center gap-2"
+    }, /* @__PURE__ */ React3.createElement("span", {
+      className: "inline-block h-2 w-2 rounded-full bg-emerald-500"
+    }), /* @__PURE__ */ React3.createElement("span", {
+      className: "text-[12px]"
+    }, "Responded first, then bought:", " ", /* @__PURE__ */ React3.createElement("span", {
+      className: "text-foreground font-semibold tabular-nums"
+    }, pre.toLocaleString()))), /* @__PURE__ */ React3.createElement("div", {
+      className: "flex items-center gap-2"
+    }, /* @__PURE__ */ React3.createElement("span", {
+      className: "inline-block h-2 w-2 rounded-full bg-blue-500"
+    }), /* @__PURE__ */ React3.createElement("span", {
+      className: "text-[12px]"
+    }, "Bought first, then responded:", " ", /* @__PURE__ */ React3.createElement("span", {
+      className: "text-foreground font-semibold tabular-nums"
+    }, post.toLocaleString()))), /* @__PURE__ */ React3.createElement("div", {
+      className: "flex items-center gap-2"
+    }, /* @__PURE__ */ React3.createElement("span", {
+      className: "inline-block h-2 w-2 rounded-full bg-gray-400"
+    }), /* @__PURE__ */ React3.createElement("span", {
+      className: "text-[12px]"
+    }, "Responded but never bought:", " ", /* @__PURE__ */ React3.createElement("span", {
+      className: "text-foreground font-semibold tabular-nums"
+    }, never.toLocaleString()))))));
+  })(), (() => {
+    const allRows = data.surveyCorrelation.byQuestion ?? [];
+    if (allRows.length === 0)
+      return null;
+    const seen = {};
+    const questionIds = [];
+    const answerCounts = {};
+    for (const r of allRows) {
+      if (!seen[r.questionId]) {
+        seen[r.questionId] = true;
+        questionIds.push(r.questionId);
+        answerCounts[r.questionId] = 0;
+      }
+      answerCounts[r.questionId]++;
+    }
+    const filteredQIds = questionIds.filter((qId) => (answerCounts[qId] ?? 0) <= 10);
+    if (filteredQIds.length === 0)
+      return null;
+    return /* @__PURE__ */ React3.createElement("div", {
+      className: "space-y-6"
+    }, /* @__PURE__ */ React3.createElement("p", {
+      className: "text-muted-foreground text-[11px]"
+    }, "Per answer: of everyone who chose this option, what % went on to purchase?"), filteredQIds.map((qId) => {
+      const answers = allRows.filter((r) => r.questionId === qId && r.answer !== "[free text]").sort((a, b) => (b.respondents ?? 0) - (a.respondents ?? 0));
+      if (answers.length === 0)
+        return null;
+      const title = answers[0]?.questionTitle ?? qId;
+      return /* @__PURE__ */ React3.createElement("div", {
+        key: qId
+      }, /* @__PURE__ */ React3.createElement("p", {
+        className: "text-foreground mb-2 text-[13px] font-semibold leading-snug"
+      }, title), /* @__PURE__ */ React3.createElement("div", {
+        className: "space-y-1.5"
+      }, answers.map((row) => {
+        const pct = (row.conversionRate ?? 0) * 100;
+        const purchased = row.purchasers ?? 0;
+        const responded = row.respondents ?? 0;
+        return /* @__PURE__ */ React3.createElement("div", {
+          key: row.answer,
+          className: "group flex items-center gap-2.5"
+        }, /* @__PURE__ */ React3.createElement("span", {
+          className: "text-muted-foreground w-[120px] shrink-0 truncate text-right text-[12px]",
+          title: row.answer
+        }, row.answer), /* @__PURE__ */ React3.createElement("div", {
+          className: "bg-muted/50 relative h-5 flex-1 overflow-hidden rounded"
+        }, /* @__PURE__ */ React3.createElement("div", {
+          className: "absolute inset-y-0 left-0 rounded bg-emerald-500/20 transition-all duration-300",
+          style: {
+            width: `${Math.max(pct, 1)}%`
+          }
+        }), /* @__PURE__ */ React3.createElement("div", {
+          className: "relative flex h-full items-center px-2"
+        }, /* @__PURE__ */ React3.createElement("span", {
+          className: "text-foreground/70 text-[11px] font-medium tabular-nums"
+        }, pct.toFixed(1), "%"))), /* @__PURE__ */ React3.createElement("span", {
+          className: "text-muted-foreground w-12 shrink-0 text-right text-[11px] tabular-nums"
+        }, purchased, "/", responded));
+      })));
+    }));
+  })())), hasRevenueChart && /* @__PURE__ */ React3.createElement(Card, {
+    className: "overflow-hidden"
+  }, /* @__PURE__ */ React3.createElement(CardHeader, {
+    className: "pb-3"
+  }, /* @__PURE__ */ React3.createElement("div", {
+    className: "flex items-center gap-2.5"
+  }, /* @__PURE__ */ React3.createElement(TrendingUpIcon, {
+    className: "text-muted-foreground h-4 w-4"
+  }), /* @__PURE__ */ React3.createElement("div", null, /* @__PURE__ */ React3.createElement(CardTitle, {
+    className: "text-sm font-semibold"
+  }, "Daily Revenue"), /* @__PURE__ */ React3.createElement(CardDescription, {
+    className: "text-[11px]"
+  }, rangeLabel)))), /* @__PURE__ */ React3.createElement(CardContent, {
+    className: "pb-3"
+  }, /* @__PURE__ */ React3.createElement(RevenueChart, {
+    data: data.daily,
+    previousData: data.previousDaily
+  }))), (hasByProduct || hasByCountry) && /* @__PURE__ */ React3.createElement("div", {
+    className: "grid gap-3 md:grid-cols-2"
+  }, hasByProduct && /* @__PURE__ */ React3.createElement(Card, null, /* @__PURE__ */ React3.createElement(CardHeader, {
+    className: "pb-3"
+  }, /* @__PURE__ */ React3.createElement("div", {
+    className: "flex items-center gap-2.5"
+  }, /* @__PURE__ */ React3.createElement(ShoppingCartIcon, {
+    className: "text-muted-foreground h-4 w-4"
+  }), /* @__PURE__ */ React3.createElement("div", null, /* @__PURE__ */ React3.createElement(CardTitle, {
+    className: "text-sm font-semibold"
+  }, "By Product"), /* @__PURE__ */ React3.createElement(CardDescription, {
+    className: "text-[11px]"
+  }, "Revenue breakdown")))), /* @__PURE__ */ React3.createElement(CardContent, null, /* @__PURE__ */ React3.createElement("div", {
+    className: "flex flex-col gap-3"
+  }, data.byProduct.map((p) => {
+    const pct = data.summary.totalRevenue > 0 ? p.revenue / data.summary.totalRevenue * 100 : 0;
+    return /* @__PURE__ */ React3.createElement("div", {
+      key: p.productId,
+      className: "space-y-1.5"
+    }, /* @__PURE__ */ React3.createElement("div", {
+      className: "flex items-center justify-between gap-2"
+    }, /* @__PURE__ */ React3.createElement("span", {
+      className: "truncate text-sm font-medium"
+    }, p.productName), /* @__PURE__ */ React3.createElement("span", {
+      className: "text-foreground shrink-0 text-sm font-semibold tabular-nums"
+    }, fmt$(p.revenue))), /* @__PURE__ */ React3.createElement("div", {
+      className: "flex items-center gap-2"
+    }, /* @__PURE__ */ React3.createElement("div", {
+      className: "bg-muted/50 relative h-1.5 flex-1 overflow-hidden rounded-full"
+    }, /* @__PURE__ */ React3.createElement("div", {
+      className: "absolute inset-y-0 left-0 rounded-full bg-emerald-500/60",
+      style: {
+        width: `${Math.min(pct, 100)}%`
+      }
+    })), /* @__PURE__ */ React3.createElement("span", {
+      className: "text-muted-foreground text-[11px] tabular-nums"
+    }, p.count)));
+  })))), hasByCountry && /* @__PURE__ */ React3.createElement(Card, {
+    className: "overflow-hidden"
+  }, /* @__PURE__ */ React3.createElement(CardHeader, {
+    className: "pb-3"
+  }, /* @__PURE__ */ React3.createElement("div", {
+    className: "flex items-center gap-2.5"
+  }, /* @__PURE__ */ React3.createElement(GlobeIcon, {
+    className: "text-muted-foreground h-4 w-4"
+  }), /* @__PURE__ */ React3.createElement("div", null, /* @__PURE__ */ React3.createElement(CardTitle, {
+    className: "text-sm font-semibold"
+  }, "By Country"), /* @__PURE__ */ React3.createElement(CardDescription, {
+    className: "text-[11px]"
+  }, "Top 10 by revenue")))), /* @__PURE__ */ React3.createElement(CardContent, {
+    className: "pb-3"
+  }, /* @__PURE__ */ React3.createElement(CountryChart, {
+    data: data.byCountry
+  })))), hasMux && data.mux.topVideos.length > 5 && /* @__PURE__ */ React3.createElement(Card, null, /* @__PURE__ */ React3.createElement(CardHeader, {
+    className: "pb-3"
+  }, /* @__PURE__ */ React3.createElement("div", {
+    className: "flex items-center gap-2.5"
+  }, /* @__PURE__ */ React3.createElement(FilmIcon, {
+    className: "text-muted-foreground h-4 w-4"
+  }), /* @__PURE__ */ React3.createElement("div", null, /* @__PURE__ */ React3.createElement(CardTitle, {
+    className: "text-sm font-semibold"
+  }, "All Site Videos"), /* @__PURE__ */ React3.createElement(CardDescription, {
+    className: "text-[11px]"
+  }, "By watch time (Mux)")))), /* @__PURE__ */ React3.createElement(CardContent, null, /* @__PURE__ */ React3.createElement("div", {
+    className: "overflow-x-auto"
+  }, /* @__PURE__ */ React3.createElement("table", {
+    className: "w-full"
+  }, /* @__PURE__ */ React3.createElement("thead", null, /* @__PURE__ */ React3.createElement("tr", {
+    className: "text-muted-foreground border-border/50 border-b text-left text-[11px] uppercase tracking-wider"
+  }, /* @__PURE__ */ React3.createElement("th", {
+    className: "pb-2.5 pr-4 font-medium"
+  }, "#"), /* @__PURE__ */ React3.createElement("th", {
+    className: "pb-2.5 pr-4 font-medium"
+  }, "Title"), /* @__PURE__ */ React3.createElement("th", {
+    className: "pb-2.5 pr-4 text-right font-medium"
+  }, "Watch Time"), /* @__PURE__ */ React3.createElement("th", {
+    className: "pb-2.5 text-right font-medium"
+  }, "Views"))), /* @__PURE__ */ React3.createElement("tbody", {
+    className: "divide-border/30 divide-y"
+  }, data.mux.topVideos.slice(0, 10).map((v, i) => /* @__PURE__ */ React3.createElement("tr", {
+    key: v.title,
+    className: "group"
+  }, /* @__PURE__ */ React3.createElement("td", {
+    className: "text-muted-foreground py-2.5 pr-4 text-sm tabular-nums"
+  }, i + 1), /* @__PURE__ */ React3.createElement("td", {
+    className: "max-w-[300px] truncate py-2.5 pr-4 text-sm font-medium"
+  }, v.title), /* @__PURE__ */ React3.createElement("td", {
+    className: "text-foreground py-2.5 pr-4 text-right text-sm font-semibold tabular-nums"
+  }, fmtWatchMs(v.playingTimeMs)), /* @__PURE__ */ React3.createElement("td", {
+    className: "text-muted-foreground py-2.5 text-right text-sm tabular-nums"
+  }, fmtK(v.views))))))))), hasShortlinks && /* @__PURE__ */ React3.createElement(ShortlinksCard, {
+    shortlinks: data.shortlinks,
+    totalClicks
+  }), hasRecentPurchases && /* @__PURE__ */ React3.createElement(Card, null, /* @__PURE__ */ React3.createElement(CardHeader, {
+    className: "pb-3"
+  }, /* @__PURE__ */ React3.createElement("div", {
+    className: "flex items-center justify-between"
+  }, /* @__PURE__ */ React3.createElement("div", {
+    className: "flex items-center gap-2.5"
+  }, /* @__PURE__ */ React3.createElement("div", {
+    className: "bg-muted flex h-6 w-6 items-center justify-center rounded-md"
+  }, /* @__PURE__ */ React3.createElement(ShoppingCartIcon, {
+    className: "text-muted-foreground h-3.5 w-3.5"
+  })), /* @__PURE__ */ React3.createElement("div", null, /* @__PURE__ */ React3.createElement(CardTitle, {
+    className: "text-sm font-semibold"
+  }, "Team Purchases"), /* @__PURE__ */ React3.createElement(CardDescription, {
+    className: "text-[11px]"
+  }, "Multi-seat deals \xB7 sorted by amount"))), /* @__PURE__ */ React3.createElement("span", {
+    className: "rounded-full bg-red-500/10 px-2 py-0.5 text-[10px] font-medium uppercase tracking-wider text-red-600 dark:text-red-400"
+  }, "OH YEAH"))), /* @__PURE__ */ React3.createElement(CardContent, null, /* @__PURE__ */ React3.createElement("div", {
+    className: "overflow-x-auto"
+  }, /* @__PURE__ */ React3.createElement("table", {
+    className: "w-full"
+  }, /* @__PURE__ */ React3.createElement("thead", null, /* @__PURE__ */ React3.createElement("tr", {
+    className: "text-muted-foreground border-border/50 border-b text-left text-[11px] uppercase tracking-wider"
+  }, /* @__PURE__ */ React3.createElement("th", {
+    className: "pb-2.5 pr-4 text-right font-medium"
+  }, "Amount"), /* @__PURE__ */ React3.createElement("th", {
+    className: "pb-2.5 pr-4 text-right font-medium"
+  }, "Seats"), /* @__PURE__ */ React3.createElement("th", {
+    className: "pb-2.5 pr-4 font-medium"
+  }, "Product"), /* @__PURE__ */ React3.createElement("th", {
+    className: "hidden pb-2.5 pr-4 font-medium sm:table-cell"
+  }, "Buyer"), /* @__PURE__ */ React3.createElement("th", {
+    className: "hidden pb-2.5 pr-4 font-medium sm:table-cell"
+  }, "Country"), /* @__PURE__ */ React3.createElement("th", {
+    className: "pb-2.5 pr-4 font-medium"
+  }, "When"))), /* @__PURE__ */ React3.createElement("tbody", {
+    className: "divide-border/30 divide-y"
+  }, data.recentPurchases.map((p) => /* @__PURE__ */ React3.createElement("tr", {
+    key: p.id
+  }, /* @__PURE__ */ React3.createElement("td", {
+    className: `py-2.5 pr-4 text-right text-sm font-semibold tabular-nums ${p.totalAmount > 0 ? "text-emerald-600 dark:text-emerald-400" : "text-muted-foreground"}`
+  }, p.totalAmount > 0 ? fmt$(p.totalAmount) : "Free"), /* @__PURE__ */ React3.createElement("td", {
+    className: "py-2.5 pr-4 text-right text-sm tabular-nums"
+  }, p.seats ?? "\u2014"), /* @__PURE__ */ React3.createElement("td", {
+    className: "max-w-[200px] truncate py-2.5 pr-4 text-sm font-medium"
+  }, p.productName), /* @__PURE__ */ React3.createElement("td", {
+    className: "text-muted-foreground hidden max-w-[150px] truncate py-2.5 pr-4 text-sm sm:table-cell"
+  }, p.userName ?? p.userEmail ?? "\u2014"), /* @__PURE__ */ React3.createElement("td", {
+    className: "text-muted-foreground hidden py-2.5 pr-4 text-sm sm:table-cell"
+  }, p.country ? `${countryFlag2(p.country)} ${p.country}` : "\u2014"), /* @__PURE__ */ React3.createElement("td", {
+    className: "text-muted-foreground whitespace-nowrap py-2.5 pr-4 text-sm"
+  }, fmtAgo(p.createdAt)))))))))));
+}
+__name(OmnibusDashboard, "OmnibusDashboard");
+export {
+  CountryChart,
+  OmnibusDashboard,
+  RevenueChart,
+  useChartColors
+};
+//# sourceMappingURL=index.js.map