@calo-design/cli 0.4.2 → 0.4.4

package/bin/cli.js

@@ -17,7 +17,7 @@ const os = require("node:os");
 const path = require("node:path");
 const { cmdPush } = require("./mirror-push");
 const { cmdShare } = require("./share");
-const { cmdLogin, cmdLogout, ensureLoggedIn, githubToken } = require("./login");
+const { cmdLogin, cmdLogout, ensureLoggedIn, githubToken, reportEvent, ensureSession, loadSession, BROKER } = require("./login");
 
 const ORG = "Calo-Design";
 const SKILL_REPO = `${ORG}/calo-design`;
@@ -141,11 +141,77 @@ function ensureBabelConfig(dir) {
   fs.writeFileSync(p, 'module.exports = (api) => {\n  api.cache(true);\n  return { presets: ["babel-preset-expo"] };\n};\n');
 }
 
+// The skill is re-installed fresh on every init, but the runtime used to freeze at
+// first install — fresh guidance driving a stale library (the skill can reference
+// primitives the installed @calo/design-system doesn't have yet). Detect when the
+// installed @calo git deps are behind their repo HEAD so init can re-pin in place.
+function installedCaloShas(rt) {
+  // npm records a git dep as  "resolved": "git+https://…/<repo>.git#<40-hex-sha>"
+  const locks = [path.join(rt, "package-lock.json"), path.join(rt, "node_modules", ".package-lock.json")];
+  for (const lp of locks) {
+    try {
+      const lock = JSON.parse(fs.readFileSync(lp, "utf8"));
+      const out = {};
+      for (const spec of PKG_SPECS) {
+        const repo = spec.match(/\/([^/]+?)(?:\.git)?$/)[1];
+        for (const v of Object.values(lock.packages || {})) {
+          const m = v && v.resolved && String(v.resolved).match(new RegExp(`${repo}(?:\\.git)?#([0-9a-f]{40})`));
+          if (m) { out[repo] = m[1]; break; }
+        }
+      }
+      if (Object.keys(out).length) return out;
+    } catch {}
+  }
+  return null;
+}
+
+function remoteHeadSha(repoUrl, env) {
+  const r = spawnSync("git", ["ls-remote", repoUrl, "HEAD"], { env, encoding: "utf8" });
+  if (r.error || r.status !== 0 || !r.stdout) return null;
+  const m = r.stdout.match(/^([0-9a-f]{40})\s/);
+  return m ? m[1] : null;
+}
+
+function staleCaloDeps(rt, env) {
+  const installed = installedCaloShas(rt);
+  if (!installed) return []; // can't tell — don't churn a working runtime
+  const stale = [];
+  for (const spec of PKG_SPECS) {
+    const repo = spec.match(/\/([^/]+?)(?:\.git)?$/)[1];
+    const head = remoteHeadSha(spec.replace(/^git\+/, ""), env);
+    // Unknown local sha with a reachable remote also counts, so old runtimes self-heal.
+    if (head && head !== installed[repo]) stale.push(repo);
+  }
+  return stale;
+}
+
 async function ensureRuntime({ force } = {}) {
   const rt = runtimeDir();
   if (!force && runtimeExists()) {
     ensureBabelConfig(rt); // backfill: runtimes built before this shipped no babel.config.js
-    ok(`shared runtime ready (${tilde(rt)})`);
+    let stale = [];
+    let env;
+    try {
+      env = gitTokenEnv(await githubToken());
+      stale = staleCaloDeps(rt, env);
+    } catch {} // offline / broker hiccup — keep the existing runtime, don't block init
+    if (!stale.length) {
+      ok(`shared runtime ready (${tilde(rt)})`);
+      return;
+    }
+    log(c.b(`\n[runtime] ${stale.join(" + ")} behind latest — refreshing the shared runtime`));
+    try {
+      // Non-destructive: `npm install` of the git specs re-resolves HEAD and updates
+      // node_modules in place; a failure aborts cleanly and leaves the runtime working.
+      runWithRetry("npm", ["install", ...PKG_SPECS, "--legacy-peer-deps"], 3, { cwd: rt, env });
+      let manifest = { pkgSpecs: PKG_SPECS, peers: PEERS };
+      try { manifest = { ...JSON.parse(fs.readFileSync(runtimeManifestPath(), "utf8")), ...manifest }; } catch {}
+      manifest.refreshedAt = new Date().toISOString();
+      fs.writeFileSync(runtimeManifestPath(), JSON.stringify(manifest, null, 2) + "\n");
+      ok("shared runtime refreshed — every linked prototype now uses the latest Calo stack");
+    } catch (e) {
+      warn(`couldn't refresh the runtime (${e.message}) — continuing with the existing install; \`calo-design update\` retries this.`);
+    }
     return;
   }
   const scaffolded = fs.existsSync(path.join(rt, "package.json"));
@@ -342,6 +408,44 @@ export default function Index() {
 `);
 }
 
+// The component gallery's routes: a root layout (fonts + providers, no local imports so it's
+// portable) and the @calo/design-system showroom (bundled with the CLI) as the index route.
+// Always (re)written so a `calo-design update` + relaunch also ships the latest showroom.
+function writeGalleryApp(projectRoot) {
+  const srcDir = path.join(projectRoot, "src");
+  const appDir = path.join(srcDir, "app");
+  fs.mkdirSync(appDir, { recursive: true });
+  // Silences known non-actionable RNW-on-React-19 dev warnings (nested Pressables, deprecated
+  // style props) so the embedded gallery has a clean overlay. Imported first in _layout.
+  fs.cpSync(path.join(__dirname, "templates", "gallery-suppress.ts"), path.join(srcDir, "suppress-dev-warnings.ts"));
+  fs.writeFileSync(path.join(appDir, "_layout.tsx"), `import "../suppress-dev-warnings";
+import { Stack } from "expo-router";
+import { useFonts } from "expo-font";
+import { CaloBottomSheetProvider, CaloScreen, caloFonts, caloTokens } from "@calo/design-system";
+import { SafeAreaProvider } from "react-native-safe-area-context";
+
+export default function Layout() {
+  const [loaded] = useFonts(caloFonts);
+  return (
+    <SafeAreaProvider>
+      {loaded ? (
+        <CaloBottomSheetProvider>
+          <Stack screenOptions={{ headerShown: false, contentStyle: { backgroundColor: caloTokens.color.canvas } }} />
+        </CaloBottomSheetProvider>
+      ) : (
+        <CaloScreen />
+      )}
+    </SafeAreaProvider>
+  );
+}
+`);
+  const showroom = fs.readFileSync(path.join(__dirname, "templates", "gallery-index.tsx"), "utf8");
+  fs.writeFileSync(path.join(appDir, "index.tsx"), showroom);
+  // The showroom require()s a few local images (../assets/... from src/app) — ship them too.
+  const assetsSrc = path.join(__dirname, "templates", "gallery-assets");
+  if (fs.existsSync(assetsSrc)) fs.cpSync(assetsSrc, path.join(projectRoot, "src", "assets"), { recursive: true });
+}
+
 function writeGitignore(projectRoot) {
   const gi = path.join(projectRoot, ".gitignore");
   const needed = ["node_modules/", ".expo/", "dist/", "*.log"];
@@ -424,6 +528,8 @@ async function cmdInit() {
     log(c.dim(`\n  Prototype folder: ${tilde(dir)}`));
   }
   const cd = targetName;
+  // Slug used for the design-ops feed (The Pass) — the prototype's folder name.
+  const slug = targetName || path.basename(process.cwd());
 
   // Machine setup runs every time, independent of this folder: the skill is installed
   // above; ensure the shared runtime so @calo/design-system + @calo/flows live on this
@@ -441,12 +547,14 @@ async function cmdInit() {
     // Re-running in an already-linked prototype: refresh the link if the runtime is ok.
     if (runtimeReady) linkProject(process.cwd());
     else warn("shared runtime unavailable — left the existing link untouched.");
+    await reportEvent("init", slug);
     return nextSteps({ linked: true, cd });
   }
   if (isExistingProject()) {
     warn("existing project detected — installing the Calo stack here (not linking), to avoid clobbering your node_modules.");
     await installCaloDeps(process.cwd());
     ok("packages + peers installed in this project");
+    await reportEvent("init", slug);
     return nextSteps({ cd });
   }
   if (!dirIsScaffoldable()) {
@@ -462,6 +570,7 @@ async function cmdInit() {
   }
 
   // Fresh prototype folder → link to the shared runtime, with a per-project fallback.
+  await reportEvent("init", slug);
   if (!runtimeReady) { await installHere(); return nextSteps({ cd }); }
   try {
     linkProject(process.cwd());
@@ -486,6 +595,80 @@ async function cmdUpdate() {
   } else {
     log(c.dim("  No shared runtime yet — run `calo-design init` in a prototype folder to create one."));
   }
+  // Report the refresh to the design-ops feed, tagged with the DS version we floated to.
+  let dsVersion = "";
+  try {
+    dsVersion = require(path.join(runtimeDir(), "node_modules", "@calo", "design-system", "package.json")).version || "";
+  } catch { /* runtime not present — report without a version */ }
+  await reportEvent("update", dsVersion);
+}
+
+// Print the logged-in identity. `--json` for machine callers (The Pass). The JSON is written
+// on its own line (leading newline) so a chatty shell rc can't fuse output onto the JSON line;
+// The Pass parses the last non-empty stdout line.
+async function cmdWhoami() {
+  const s = loadSession();
+  if (!s || !s.email) {
+    if (has("--json")) { process.stdout.write("\n" + JSON.stringify({ email: null }) + "\n"); return; }
+    log("Not logged in — run `calo-design login`.");
+    process.exit(1);
+  }
+  if (has("--json")) { process.stdout.write("\n" + JSON.stringify({ email: s.email, expiresAt: s.expiresAt }) + "\n"); return; }
+  log(s.email);
+}
+
+// The design-ops feed (The Pass reads this via `--json`). Reuses the stored session —
+// no second login. ensureSession refreshes a stale JWT silently using the refresh token.
+async function cmdFeed() {
+  const session = await ensureSession();
+  const li = args.indexOf("--limit");
+  const limit = li >= 0 && /^\d+$/.test(args[li + 1] || "") ? Math.max(1, Math.min(500, parseInt(args[li + 1], 10))) : 100;
+  let res;
+  try {
+    // Bounded so a black-holed broker can't hang the CLI (and, in turn, The Pass shelling out here).
+    res = await fetch(`${BROKER}/v1/events?limit=${limit}`, {
+      headers: { authorization: `Bearer ${session}` },
+      signal: AbortSignal.timeout(15000),
+    });
+  } catch (e) {
+    throw new Error(`can't reach the Calo broker at ${BROKER} (${e.message})`);
+  }
+  const text = await res.text();
+  if (!res.ok) throw new Error(`feed failed (${res.status}): ${text.slice(0, 200)}`);
+  if (has("--json")) { process.stdout.write("\n" + text + "\n"); return; }
+  const data = JSON.parse(text);
+  for (const e of data.events) log(`${c.dim(e.ts)}  ${e.email}  ${c.b(e.action)}  ${e.target || ""}`);
+}
+
+// Serve the component gallery (the @calo/design-system showroom) locally, rendered LIVE from
+// the shared runtime — so `calo-design update` keeps it current (no rebuild/redeploy). Design
+// Kitchen auto-starts this; it also works standalone in a terminal. Runs Metro in the
+// foreground so whoever launched it owns the process lifecycle.
+async function cmdGallery() {
+  if (!runtimeExists()) {
+    throw new Error("The Calo runtime isn't set up on this machine yet — run `calo-design init` first, then retry.");
+  }
+  const dir = path.join(designchefHome(), "gallery");
+  fs.mkdirSync(dir, { recursive: true });
+  // Materialize / refresh a thin project linked to the shared runtime (same machinery as
+  // a linked prototype), then swap in the showroom routes.
+  writeThinConfigs(dir);
+  ensureBabelConfig(dir);
+  writeMetroConfig(dir);
+  writeGitignore(dir);
+  linkNodeModules(dir);
+  writeGalleryApp(dir);
+
+  let port = "8091";
+  const pj = args.find((a) => a.startsWith("--port="));
+  if (pj) port = pj.slice(7);
+  else { const pi = args.indexOf("--port"); if (pi >= 0) port = args[pi + 1] || port; }
+  if (!/^\d+$/.test(port)) port = "8091";
+
+  log(c.b(`\n[gallery] Serving the Calo component gallery on http://localhost:${port}`));
+  log(c.dim(`  Live from the shared runtime (${tilde(runtimeDir())}) — always the installed @calo/design-system.`));
+  log(c.dim("  First launch compiles the design system (~30–60s). Ctrl-C to stop."));
+  run("npx", ["expo", "start", "--web", "--port", port], { cwd: dir });
 }
 
 function help() {
@@ -503,6 +686,8 @@ function help() {
   ${c.dim("    push --slug x --title \"…\" --owner \"…\" --screenshot path  --dry-run  --direct")}
   ${c.dim("share")}                                     publish THIS web prototype (React/Vite/CRA/Next) to Cloudflare Pages → share link
   ${c.dim("    share --slug x --dir dist --build --project calo-prototypes  --dry-run")}
+  ${c.dim("gallery")}                                   serve the @calo/design-system component gallery locally (live from the runtime)
+  ${c.dim("    gallery --port 8091")}
 
   Login is required once before init; the session refreshes automatically.
   init always installs the skill and ensures the shared ds/flows runtime on your machine;
@@ -513,16 +698,22 @@ function help() {
 
 (async () => {
   try {
+    if (cmd === "--version" || cmd === "-v" || cmd === "version") { console.log(require("../package.json").version); return; }
     if (cmd === "login") await cmdLogin(args.slice(1));
     else if (cmd === "logout") cmdLogout();
     else if (cmd === "init") await cmdInit();
     else if (cmd === "update") await cmdUpdate();
     else if (cmd === "push") await cmdPush(args.slice(1));
     else if (cmd === "share") await cmdShare(args.slice(1));
+    else if (cmd === "feed") await cmdFeed();
+    else if (cmd === "whoami") await cmdWhoami();
+    else if (cmd === "gallery") await cmdGallery();
     else help();
   } catch (err) {
-    log(`\n\x1b[31m✗\x1b[0m ${err.message}`);
-    log(c.dim("  Stuck? Re-run `calo-design login`, then retry. Or check that the Calo broker is reachable."));
+    // Diagnostics go to stderr so stdout stays pure for machine callers (The Pass parses
+    // `feed --json` / `whoami --json` from stdout); a non-zero exit is the failure signal.
+    console.error(`\n\x1b[31m✗\x1b[0m ${err.message}`);
+    console.error(c.dim("  Stuck? Re-run `calo-design login`, then retry. Or check that the Calo broker is reachable."));
     process.exit(1);
   }
 })();

package/bin/login.js

@@ -42,13 +42,16 @@ function clearSession() {
   } catch {}
 }
 
-async function api(pathname, body, token) {
+async function api(pathname, body, token, { timeoutMs } = {}) {
   let res;
   try {
     res = await fetch(BROKER + pathname, {
       method: "POST",
       headers: { "content-type": "application/json", ...(token ? { authorization: `Bearer ${token}` } : {}) },
       body: JSON.stringify(body || {}),
+      // Opt-in timeout. Existing callers keep their (unbounded) behavior; telemetry passes a
+      // tight bound so a black-holed broker (connect-but-silent) can never hang the command.
+      ...(timeoutMs ? { signal: AbortSignal.timeout(timeoutMs) } : {}),
     });
   } catch (e) {
     throw new Error(`can't reach the Calo broker at ${BROKER} (${e.message})`);
@@ -190,4 +193,17 @@ async function publishToMirror(payload) {
   return api("/v1/publish", payload, session);
 }
 
-module.exports = { cmdLogin, cmdLogout, ensureSession, ensureLoggedIn, githubToken, easToken, publishWeb, publishToMirror, BROKER, loadSession };
+// Best-effort design-ops telemetry: report an init/update to the broker feed (The Pass).
+// Never throws and never blocks the command on failure — telemetry is not the job. Uses the
+// existing session if it's still valid; won't trigger a refresh just to report an event.
+async function reportEvent(action, target) {
+  try {
+    const s = loadSession();
+    if (!s || !s.session || expSec(s) - 60 <= nowSec()) return; // not logged in / expired — skip
+    await api("/v1/events", { action, target: target || "" }, s.session, { timeoutMs: 3000 });
+  } catch {
+    /* swallow — telemetry must never break a command */
+  }
+}
+
+module.exports = { cmdLogin, cmdLogout, ensureSession, ensureLoggedIn, githubToken, easToken, publishWeb, publishToMirror, reportEvent, BROKER, loadSession };

package/bin/share.js

@@ -144,10 +144,19 @@ async function cmdShare(args = []) {
     const sizeMb = (fs.statSync(tgz).size / 1e6).toFixed(1);
     log(c.b(`\n[upload] ${sizeMb} MB → broker → wrangler pages deploy`));
     const r = await publishWeb({ slug, project, tarball: fs.readFileSync(tgz) });
+    const url = r.url || aliasUrl(slug, project);
     log("");
-    ok(`Live: ${c.g(r.url || aliasUrl(slug, project))}`);
+    // The broker verifies the URL actually serves (verified:false => deployed but the link
+    // didn't answer). Don't print a confident "Live" for a link the broker couldn't reach.
+    if (r.verified === false) {
+      warn(`Deployed, but ${url} did not respond yet.`);
+      log(c.dim("  If it's still blank in ~30s, the broker likely deployed to a different"));
+      log(c.dim("  Cloudflare account/project than this URL implies — check broker CLOUDFLARE_* config."));
+    } else {
+      ok(`Live: ${c.g(url)}`);
+      log(c.dim(`  Re-run \`calo-design share\` to update “${slug}” in place. Share the link above.`));
+    }
     if (r.version) log(c.dim(`  this version: ${r.version}`));
-    log(c.dim(`  Re-run \`calo-design share\` to update “${slug}” in place. Share the link above.`));
   } finally {
     try { fs.rmSync(tgz); } catch {}
   }