x12i-downloads 0.1.1

package/.cursor/rules/graphify.mdc

@@ -0,0 +1,21 @@
+---
+description: graphify knowledge graph context
+alwaysApply: true
+---
+
+This project has a graphify knowledge graph at graphify-out/.
+
+**MANDATORY: Before using Read, Grep, Glob, or Bash to explore the codebase, you MUST run graphify first:**
+- `graphify query "<question>"` — scoped subgraph for any codebase or architecture question
+- `graphify path "<A>" "<B>"` — dependency path between two symbols
+- `graphify explain "<concept>"` — all nodes related to a concept
+
+This applies to YOU and to every subagent you spawn. Include this rule explicitly in every subagent prompt that involves code exploration. Do not skip graphify because files are "already known" or because you are executing a plan — the graph surfaces cross-file dependencies and INFERRED edges that grep and Read cannot find.
+
+Only use Read/Grep/Glob directly when:
+1. graphify has already oriented you and you need to modify or debug specific lines
+2. `graphify-out/graph.json` does not exist yet
+
+- If `graphify-out/wiki/index.md` exists, navigate it instead of reading raw files
+- Read `graphify-out/GRAPH_REPORT.md` only for broad architecture review when query/path/explain do not surface enough context
+- After modifying code files, run `graphify update .` to keep the graph current (AST-only, no API cost)

package/.openai/hosting.json

@@ -0,0 +1 @@
+{}

package/.vinext/fonts/geist-8ac0455e797f/style.css

@@ -0,0 +1,45 @@
+/* cyrillic-ext */
+@font-face {
+  font-family: 'Geist';
+  font-style: normal;
+  font-weight: 100 900;
+  font-display: swap;
+  src: url(/Users/ami/Documents/prometheus/x12i/x12i-stat/.vinext/fonts/geist-8ac0455e797f/geist-ff2310f5.woff2) format('woff2');
+  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
+}
+/* cyrillic */
+@font-face {
+  font-family: 'Geist';
+  font-style: normal;
+  font-weight: 100 900;
+  font-display: swap;
+  src: url(/Users/ami/Documents/prometheus/x12i/x12i-stat/.vinext/fonts/geist-8ac0455e797f/geist-875ccdd4.woff2) format('woff2');
+  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
+}
+/* vietnamese */
+@font-face {
+  font-family: 'Geist';
+  font-style: normal;
+  font-weight: 100 900;
+  font-display: swap;
+  src: url(/Users/ami/Documents/prometheus/x12i/x12i-stat/.vinext/fonts/geist-8ac0455e797f/geist-52306abf.woff2) format('woff2');
+  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+/* latin-ext */
+@font-face {
+  font-family: 'Geist';
+  font-style: normal;
+  font-weight: 100 900;
+  font-display: swap;
+  src: url(/Users/ami/Documents/prometheus/x12i/x12i-stat/.vinext/fonts/geist-8ac0455e797f/geist-001175b1.woff2) format('woff2');
+  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+/* latin */
+@font-face {
+  font-family: 'Geist';
+  font-style: normal;
+  font-weight: 100 900;
+  font-display: swap;
+  src: url(/Users/ami/Documents/prometheus/x12i/x12i-stat/.vinext/fonts/geist-8ac0455e797f/geist-98bbbccb.woff2) format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}

package/.vinext/fonts/geist-mono-00e989178794/style.css

@@ -0,0 +1,54 @@
+/* cyrillic-ext */
+@font-face {
+  font-family: 'Geist Mono';
+  font-style: normal;
+  font-weight: 100 900;
+  font-display: swap;
+  src: url(/Users/ami/Documents/prometheus/x12i/x12i-stat/.vinext/fonts/geist-mono-00e989178794/geist-mono-f6b33328.woff2) format('woff2');
+  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
+}
+/* cyrillic */
+@font-face {
+  font-family: 'Geist Mono';
+  font-style: normal;
+  font-weight: 100 900;
+  font-display: swap;
+  src: url(/Users/ami/Documents/prometheus/x12i/x12i-stat/.vinext/fonts/geist-mono-00e989178794/geist-mono-44e03052.woff2) format('woff2');
+  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
+}
+/* symbols2 */
+@font-face {
+  font-family: 'Geist Mono';
+  font-style: normal;
+  font-weight: 100 900;
+  font-display: swap;
+  src: url(/Users/ami/Documents/prometheus/x12i/x12i-stat/.vinext/fonts/geist-mono-00e989178794/geist-mono-0638449e.woff2) format('woff2');
+  unicode-range: U+2000-2001, U+2004-2008, U+200A, U+23B8-23BD, U+2500-259F;
+}
+/* vietnamese */
+@font-face {
+  font-family: 'Geist Mono';
+  font-style: normal;
+  font-weight: 100 900;
+  font-display: swap;
+  src: url(/Users/ami/Documents/prometheus/x12i/x12i-stat/.vinext/fonts/geist-mono-00e989178794/geist-mono-971fb274.woff2) format('woff2');
+  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+/* latin-ext */
+@font-face {
+  font-family: 'Geist Mono';
+  font-style: normal;
+  font-weight: 100 900;
+  font-display: swap;
+  src: url(/Users/ami/Documents/prometheus/x12i/x12i-stat/.vinext/fonts/geist-mono-00e989178794/geist-mono-44745446.woff2) format('woff2');
+  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+/* latin */
+@font-face {
+  font-family: 'Geist Mono';
+  font-style: normal;
+  font-weight: 100 900;
+  font-display: swap;
+  src: url(/Users/ami/Documents/prometheus/x12i/x12i-stat/.vinext/fonts/geist-mono-00e989178794/geist-mono-013b2f2f.woff2) format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}

package/README.md

@@ -0,0 +1,54 @@
+# @x12i Total Downloads
+
+A React dashboard that discovers every public package in the `@x12i` npm scope and calculates cumulative downloads since April 1, 2026.
+
+## What it does
+
+- Discovers public `@x12i/*` packages anonymously through npm's public registry.
+- Filters npm's fuzzy search results to exact `@x12i/` package names.
+- Removes duplicates before calculating downloads.
+- Serves a generated verified snapshot immediately, so visitors make no npm API calls.
+- Includes a controlled update command with retry/backoff to avoid anonymous npm rate-limit bursts.
+- Aggregates exact daily package ranges into cumulative 14-day chart points.
+- Verifies the chart total against the independently accumulated package total.
+- Replaces the published snapshot only after all package ranges load and the integrity check passes.
+- Omits all horizontal-axis labels as requested.
+
+## Run locally
+
+Requirements: Node.js 22.13 or newer.
+
+```bash
+npm install
+npm run dev
+```
+
+Open the local URL printed by the development server.
+
+## Production build
+
+```bash
+npm run build
+```
+
+## Refresh the statistics
+
+Run this before publishing a new snapshot or from a scheduled workflow:
+
+```bash
+npm run update:stats
+```
+
+The updater discovers all current public packages, downloads every daily range, verifies the aggregate, and atomically replaces `public/x12i-stats.json` only after success. Daily package-range work is resumable through an ignored local cache, so an interrupted or throttled run continues instead of starting over.
+
+## Main source files
+
+- `app/page.tsx` — page entry point
+- `components/downloads-dashboard.tsx` — verified snapshot display and empty-state UI
+- `components/cumulative-chart.tsx` — responsive accessible SVG chart
+- `public/x12i-stats.json` — generated verified snapshot rendered by React
+- `scripts/update-stats.mjs` — anonymous npm discovery and snapshot calculation
+- `lib/npm-stats-shared.ts` — shared result types and runtime validation
+- `app/globals.css` — responsive visual styling
+
+No npm login, token, database or environment variables are required.

package/app/api/cron/update-stats/route.ts

@@ -0,0 +1,23 @@
+import { NextResponse } from "next/server";
+import { fetchLiveStats } from "@/lib/npm-stats-live";
+
+/**
+ * Local / non-Worker fallback. In production the Worker handles this path
+ * and persists results to STATS_KV asynchronously (see worker/index.ts).
+ */
+export async function GET() {
+  try {
+    const stats = await fetchLiveStats();
+    return NextResponse.json(
+      { success: true, accepted: false, stats },
+      { headers: { "Cache-Control": "no-store" } },
+    );
+  } catch (err: unknown) {
+    const message = err instanceof Error ? err.message : String(err);
+    return NextResponse.json({ success: false, error: message }, { status: 500 });
+  }
+}
+
+export async function POST() {
+  return GET();
+}

package/app/api/stats/route.ts

@@ -0,0 +1,14 @@
+import { NextResponse } from "next/server";
+import statsJson from "@/public/x12i-stats.json";
+import { isNpmStatsResult } from "@/lib/npm-stats-shared";
+
+export async function GET() {
+  if (isNpmStatsResult(statsJson)) {
+    return NextResponse.json(statsJson, {
+      headers: {
+        "Cache-Control": "public, max-age=3600, s-maxage=86400, stale-while-revalidate=604800",
+      },
+    });
+  }
+  return NextResponse.json({ error: "Invalid stats" }, { status: 500 });
+}

package/app/chatgpt-auth.ts

@@ -0,0 +1,86 @@
+import { headers } from "next/headers";
+import { redirect } from "next/navigation";
+
+export type ChatGPTUser = {
+  displayName: string;
+  email: string;
+  fullName: string | null;
+};
+
+const USER_EMAIL_HEADER = "oai-authenticated-user-email";
+const USER_FULL_NAME_HEADER = "oai-authenticated-user-full-name";
+const USER_FULL_NAME_ENCODING_HEADER =
+  "oai-authenticated-user-full-name-encoding";
+const PERCENT_ENCODED_UTF8 = "percent-encoded-utf-8";
+const SIGN_IN_PATH = "/signin-with-chatgpt";
+const SIGN_OUT_PATH = "/signout-with-chatgpt";
+const CALLBACK_PATH = "/callback";
+
+export async function getChatGPTUser(): Promise<ChatGPTUser | null> {
+  const requestHeaders = await headers();
+  const email = requestHeaders.get(USER_EMAIL_HEADER);
+  if (!email) return null;
+
+  const encodedFullName = requestHeaders.get(USER_FULL_NAME_HEADER);
+  const fullName =
+    encodedFullName &&
+    requestHeaders.get(USER_FULL_NAME_ENCODING_HEADER) === PERCENT_ENCODED_UTF8
+      ? safeDecodeURIComponent(encodedFullName)
+      : null;
+
+  return {
+    displayName: fullName ?? email,
+    email,
+    fullName,
+  };
+}
+
+export async function requireChatGPTUser(
+  returnTo: string,
+): Promise<ChatGPTUser> {
+  const user = await getChatGPTUser();
+  if (user) return user;
+
+  redirect(chatGPTSignInPath(returnTo));
+}
+
+export function chatGPTSignInPath(returnTo: string): string {
+  const safeReturnTo = safeRelativeReturnPath(returnTo);
+  return `${SIGN_IN_PATH}?return_to=${encodeURIComponent(safeReturnTo)}`;
+}
+
+export function chatGPTSignOutPath(returnTo = "/"): string {
+  const safeReturnTo = safeRelativeReturnPath(returnTo);
+  return `${SIGN_OUT_PATH}?return_to=${encodeURIComponent(safeReturnTo)}`;
+}
+
+function safeRelativeReturnPath(value: string): string {
+  if (!value.startsWith("/") || value.startsWith("//")) return "/";
+
+  let url: URL;
+  try {
+    url = new URL(value, "https://app.local");
+  } catch {
+    return "/";
+  }
+  if (url.origin !== "https://app.local") return "/";
+  if (isReservedAuthPath(url.pathname)) return "/";
+
+  return `${url.pathname}${url.search}${url.hash}`;
+}
+
+function isReservedAuthPath(pathname: string): boolean {
+  return (
+    pathname === SIGN_IN_PATH ||
+    pathname === SIGN_OUT_PATH ||
+    pathname === CALLBACK_PATH
+  );
+}
+
+function safeDecodeURIComponent(value: string): string | null {
+  try {
+    return decodeURIComponent(value);
+  } catch {
+    return null;
+  }
+}

package/app/globals.css

@@ -0,0 +1,301 @@
+@import "tailwindcss";
+
+:root {
+  --background: #0f172a;
+  --surface: #111c30;
+  --surface-border: #253149;
+  --foreground: #f8fafc;
+  --muted: #94a3b8;
+  --muted-dark: #64748b;
+  --accent: #38bdf8;
+  --accent-soft: rgba(56, 189, 248, 0.12);
+  --grid: #334155;
+  --danger: #f87171;
+  --anim-duration: 2s;
+}
+
+* {
+  box-sizing: border-box;
+}
+
+html {
+  min-width: 320px;
+  background: var(--background);
+}
+
+body {
+  min-height: 100vh;
+  margin: 0;
+  background:
+    radial-gradient(circle at 50% 0%, rgba(56, 189, 248, 0.08), transparent 32rem),
+    var(--background);
+  color: var(--foreground);
+  font-family: var(--font-geist-sans), Inter, ui-sans-serif, system-ui, sans-serif;
+}
+
+button,
+input,
+textarea,
+select {
+  font: inherit;
+}
+
+.dashboard-shell {
+  display: grid;
+  min-height: 100vh;
+  place-items: center;
+  padding: 2rem;
+}
+
+.dashboard-card {
+  width: min(100%, 44rem);
+  overflow: hidden;
+  border: 1px solid var(--surface-border);
+  border-radius: 1.75rem;
+  background: rgba(15, 23, 42, 0.82);
+  box-shadow: 0 32px 90px rgba(2, 6, 23, 0.48);
+  backdrop-filter: blur(16px);
+}
+
+.dashboard-content {
+  padding: 2.25rem 2.5rem 2.5rem;
+  text-align: center;
+}
+
+.eyebrow {
+  margin: 0.5rem 0 0;
+  color: var(--muted);
+  font-size: 0.72rem;
+  font-weight: 700;
+  letter-spacing: 0.18em;
+  text-transform: uppercase;
+}
+
+.title {
+  margin: 0;
+  font-size: clamp(2rem, 7vw, 2.75rem);
+  font-weight: 850;
+  letter-spacing: -0.045em;
+}
+
+.metric-block {
+  margin: 2.5rem 0 2rem;
+}
+
+.total {
+  min-height: 1.05em;
+  color: var(--accent);
+  font-size: clamp(3.5rem, 12vw, 5.25rem);
+  font-variant-numeric: tabular-nums;
+  font-weight: 900;
+  letter-spacing: -0.065em;
+  line-height: 1;
+}
+
+.total-pending {
+  color: var(--muted);
+  font-size: clamp(2.25rem, 8vw, 3.5rem);
+  letter-spacing: -0.045em;
+}
+
+.metric-description {
+  margin: 0.65rem 0 0;
+  color: var(--muted-dark);
+  font-size: 0.875rem;
+}
+
+.status-row {
+  display: flex;
+  min-height: 1.5rem;
+  align-items: center;
+  justify-content: center;
+  gap: 0.5rem;
+  margin-top: 0.4rem;
+  color: var(--muted-dark);
+  font-size: 0.75rem;
+}
+
+.status-row.error {
+  color: var(--danger);
+}
+
+.spinner {
+  width: 0.75rem;
+  height: 0.75rem;
+  flex: none;
+  border: 2px solid rgba(56, 189, 248, 0.2);
+  border-top-color: var(--accent);
+  border-radius: 999px;
+  animation: spin 0.85s linear infinite;
+}
+
+.retry-button {
+  margin-left: 0.25rem;
+  border: 0;
+  border-bottom: 1px solid currentColor;
+  padding: 0;
+  background: transparent;
+  color: inherit;
+  cursor: pointer;
+  font-weight: 700;
+}
+
+.retry-button:focus-visible {
+  outline: 2px solid var(--accent);
+  outline-offset: 4px;
+}
+
+/* ── Chart ─────────────────────────────────────────────── */
+
+.chart-frame {
+  position: relative;
+  width: 100%;
+  height: 16rem;
+  margin-top: 1rem;
+}
+
+.chart-frame svg {
+  display: block;
+  width: 100%;
+  height: 100%;
+  overflow: visible;
+}
+
+.chart-empty {
+  display: grid;
+  height: 100%;
+  place-items: center;
+  color: var(--muted-dark);
+  font-size: 0.8rem;
+}
+
+.chart-grid {
+  stroke: var(--grid);
+  stroke-width: 1;
+  vector-effect: non-scaling-stroke;
+}
+
+.chart-y-label {
+  fill: var(--muted);
+  font-size: 12px;
+  font-variant-numeric: tabular-nums;
+}
+
+.chart-line {
+  fill: none;
+  stroke: var(--accent);
+  stroke-linecap: round;
+  stroke-linejoin: round;
+  stroke-width: 3;
+  vector-effect: non-scaling-stroke;
+  /* Draw animation — uses a very large dasharray; the offset animates to 0 */
+  stroke-dasharray: 2000;
+  stroke-dashoffset: 2000;
+  animation: draw-line var(--anim-duration) ease-out forwards;
+}
+
+.chart-area {
+  fill: url(#area-gradient);
+  opacity: 0;
+  animation: fade-area var(--anim-duration) ease-out forwards;
+}
+
+/* ── npm link ─────────────────────────────────────────── */
+
+.npm-link {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.4rem;
+  margin-top: 1.5rem;
+  padding: 0.55rem 1.15rem;
+  border: 1px solid var(--surface-border);
+  border-radius: 0.65rem;
+  background: var(--accent-soft);
+  color: var(--accent);
+  font-size: 0.82rem;
+  font-weight: 600;
+  text-decoration: none;
+  transition: background 0.2s, border-color 0.2s, transform 0.15s;
+}
+
+.npm-link:hover {
+  border-color: var(--accent);
+  background: rgba(56, 189, 248, 0.18);
+  transform: translateY(-1px);
+}
+
+.npm-link:active {
+  transform: translateY(0);
+}
+
+.npm-link:focus-visible {
+  outline: 2px solid var(--accent);
+  outline-offset: 3px;
+}
+
+.npm-link-icon {
+  width: 0.95rem;
+  height: 0.95rem;
+  flex: none;
+}
+
+/* ── Keyframes ────────────────────────────────────────── */
+
+@keyframes spin {
+  to { transform: rotate(360deg); }
+}
+
+@keyframes draw-line {
+  to { stroke-dashoffset: 0; }
+}
+
+@keyframes fade-area {
+  0%  { opacity: 0; }
+  40% { opacity: 0; }
+  100% { opacity: 1; }
+}
+
+/* ── Responsive ───────────────────────────────────────── */
+
+@media (max-width: 640px) {
+  .dashboard-shell {
+    align-items: stretch;
+    padding: 0;
+  }
+
+  .dashboard-card {
+    min-height: 100vh;
+    border: 0;
+    border-radius: 0;
+  }
+
+  .dashboard-content {
+    padding: 3rem 1.25rem 2rem;
+  }
+
+  .metric-block {
+    margin-top: 3rem;
+  }
+
+  .chart-frame {
+    height: 14rem;
+    margin-top: 2rem;
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .spinner {
+    animation-duration: 2s;
+  }
+
+  .chart-line {
+    stroke-dasharray: none;
+    stroke-dashoffset: 0;
+    animation: none;
+  }
+
+  .chart-area {
+    opacity: 1;
+    animation: none;
+  }
+}

package/app/layout.tsx

@@ -0,0 +1,44 @@
+import type { Metadata } from "next";
+import { Geist, Geist_Mono } from "next/font/google";
+import { BRAND_NAME, PACKAGE_SCOPE } from "@/lib/config";
+import "./globals.css";
+
+const geistSans = Geist({
+  variable: "--font-geist-sans",
+  subsets: ["latin"],
+});
+
+const geistMono = Geist_Mono({
+  variable: "--font-geist-mono",
+  subsets: ["latin"],
+});
+
+const scopeDisplay = PACKAGE_SCOPE.replace(/\/$/, "");
+
+export const metadata: Metadata = {
+  title: `${scopeDisplay} Total Downloads`,
+  description: `Live cumulative downloads across every public ${scopeDisplay} npm package.`,
+  other: {
+    "codex-preview": "development",
+  },
+  icons: {
+    icon: "/favicon.svg",
+    shortcut: "/favicon.svg",
+  },
+};
+
+export default function RootLayout({
+  children,
+}: Readonly<{
+  children: React.ReactNode;
+}>) {
+  return (
+    <html lang="en">
+      <body
+        className={`${geistSans.variable} ${geistMono.variable} antialiased`}
+      >
+        {children}
+      </body>
+    </html>
+  );
+}