@calo-design/cli 0.5.0 → 0.6.0

package/bin/cli.js

@@ -18,6 +18,7 @@ const path = require("node:path");
 const { cmdPush } = require("./mirror-push");
 const { cmdArtPush } = require("./art-push");
 const { cmdShare } = require("./share");
+const { cmdImage } = require("./imagegen");
 const { cmdLogin, cmdLogout, ensureLoggedIn, githubToken, reportEvent, ensureSession, loadSession, BROKER } = require("./login");
 
 const ORG = "Calo-Design";
@@ -48,7 +49,8 @@ const PEERS = [
 // subprocess only (see gitTokenEnv). No GitHub account, PAT, or SSH key needed.
 const PKG_SPECS = [
   `git+https://github.com/${ORG}/calo-design-system.git`,
-  `git+https://github.com/${ORG}/calo-flows.git`
+  `git+https://github.com/${ORG}/calo-flows.git`,
+  `git+https://github.com/${ORG}/calo-creatives.git`
 ];
 
 const args = process.argv.slice(2);
@@ -770,6 +772,9 @@ function help() {
   ${c.dim("    push --slug x --title \"…\" --owner \"…\" --screenshot path  --dry-run  --direct")}
   ${c.dim("art push <dir>")}                            upload a bulk image set to the CDN + emit a remote-source manifest (login only)
   ${c.dim("    art push ./art/byo --set byo --manifest src/byo-art.ts  --dry-run  --force  --direct")}
+  ${c.dim("image \"<prompt>\"")}                          AI image generation via the broker (metered per user; login only)
+  ${c.dim("    image \"…\" --out hero.png --ref photo.jpg --model google/gemini-3-pro-image --json")}
+  ${c.dim("image usage")}                               your monthly image-generation metering (images + USD)
   ${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)
@@ -793,6 +798,7 @@ function help() {
     else if (cmd === "art" && args[1] === "push") await cmdArtPush(args.slice(2));
     else if (cmd === "art") throw new Error("unknown art command — did you mean `calo-design art push <dir>`?");
     else if (cmd === "share") await cmdShare(args.slice(1));
+    else if (cmd === "image") await cmdImage(args.slice(1));
     else if (cmd === "feed") await cmdFeed();
     else if (cmd === "insights") await cmdInsights();
     else if (cmd === "whoami") await cmdWhoami();

package/bin/imagegen.js

@@ -0,0 +1,171 @@
+"use strict";
+
+/**
+ * `calo-design image` — metered AI image generation through the Calo broker.
+ *
+ *   calo-design image "prompt"                  generate → writes ./<slug>.png, prints path + URL + cost
+ *   calo-design image "prompt" --out hero.png   choose the output path
+ *   calo-design image "prompt" --ref photo.jpg  reference/edit input (repeatable, ≤4)
+ *   calo-design image "prompt" --model <id>     pick an allowed model (default: broker's)
+ *   calo-design image usage                     your monthly metering (images + USD, caps)
+ *   --json on either form for machine callers (the design/marketing skills use this)
+ *
+ * The OpenRouter key lives on the broker only; identity is the normal CLI session,
+ * and the broker meters every generated image per user per month. The broker also
+ * mirrors each image to the CDN (content-hashed, immutable) and returns that URL —
+ * use it directly in prototypes; the local file is for creatives/mockups.
+ */
+
+const fs = require("node:fs");
+const path = require("node:path");
+const { ensureSession, BROKER } = require("./login");
+
+const c = { dim: (s) => `\x1b[2m${s}\x1b[0m`, b: (s) => `\x1b[1m${s}\x1b[0m`, g: (s) => `\x1b[32m${s}\x1b[0m` };
+const log = (s = "") => console.log(s);
+
+const MIMES = { ".png": "image/png", ".jpg": "image/jpeg", ".jpeg": "image/jpeg", ".webp": "image/webp" };
+const EXTS = { "image/png": "png", "image/jpeg": "jpg", "image/webp": "webp" };
+
+// --flag value (both `--flag=v` and `--flag v`), collecting repeats.
+function flagAll(args, name) {
+  const out = [];
+  for (let i = 0; i < args.length; i++) {
+    if (args[i] === `--${name}` && args[i + 1] != null) out.push(args[++i]);
+    else if (args[i].startsWith(`--${name}=`)) out.push(args[i].split("=").slice(1).join("="));
+  }
+  return out;
+}
+const flag = (args, name) => flagAll(args, name)[0];
+
+async function apiGet(pathname, session) {
+  let res;
+  try {
+    res = await fetch(BROKER + pathname, {
+      headers: { authorization: `Bearer ${session}` },
+      signal: AbortSignal.timeout(15000),
+    });
+  } catch (e) {
+    throw new Error(`can't reach the Calo broker at ${BROKER} (${e.message})`);
+  }
+  const json = await res.json().catch(() => ({}));
+  if (!res.ok) throw new Error(json.error || `${pathname} → HTTP ${res.status}`);
+  return json;
+}
+
+function refToDataUrl(file) {
+  const mime = MIMES[path.extname(file).toLowerCase()];
+  if (!mime) throw new Error(`--ref ${file}: must be a .png/.jpg/.jpeg/.webp file`);
+  let buf;
+  try {
+    buf = fs.readFileSync(file);
+  } catch {
+    throw new Error(`--ref ${file}: can't read file`);
+  }
+  if (buf.length > 6e6) throw new Error(`--ref ${file}: over 6 MB — resize it first`);
+  return `data:${mime};base64,${buf.toString("base64")}`;
+}
+
+// "A hero shot of a grain bowl!" → "a-hero-shot-of-a-grain"
+const promptSlug = (p) =>
+  p.toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, "").split("-").slice(0, 5).join("-") || "image";
+
+// Unique output path: <base>.<ext>, <base>-2.<ext>, ... (never overwrite silently).
+function outPath(base, ext, taken) {
+  for (let n = 1; ; n++) {
+    const p = n === 1 ? `${base}.${ext}` : `${base}-${n}.${ext}`;
+    if (!taken.has(p) && !fs.existsSync(p)) {
+      taken.add(p);
+      return p;
+    }
+  }
+}
+
+const money = (v) => `$${(Number(v) || 0).toFixed(v >= 0.1 ? 2 : 4)}`;
+
+async function cmdImageUsage(jsonOut) {
+  const session = await ensureSession();
+  const u = await apiGet("/v1/imagegen/usage", session);
+  if (jsonOut) {
+    process.stdout.write("\n" + JSON.stringify(u) + "\n"); // own line — machine callers parse the last non-empty line
+    return;
+  }
+  const cur = u.months[u.month] || { images: 0, cost: 0, byModel: {} };
+  log(`${c.b(u.email)} — image generation for ${c.b(u.month)}`);
+  log(`  ${cur.images}/${u.limits.monthlyImages || "∞"} images · ${money(cur.cost)}/$${u.limits.monthlyCostUsd || "∞"}`);
+  for (const [m, v] of Object.entries(cur.byModel || {})) log(c.dim(`    ${m}: ${v.images} images · ${money(v.cost)}`));
+  log(c.dim(`  org this month: ${u.orgMonth.images} images · ${money(u.orgMonth.cost)} (budget $${u.limits.globalMonthlyCostUsd || "∞"})`));
+  const past = Object.keys(u.months).filter((m) => m !== u.month).sort().reverse();
+  for (const m of past.slice(0, 6)) log(c.dim(`  ${m}: ${u.months[m].images} images · ${money(u.months[m].cost)}`));
+  if (!u.configured) log(c.dim("  (generation currently disabled on the broker — no OPENROUTER_API_KEY)"));
+}
+
+async function cmdImage(args) {
+  const jsonOut = args.includes("--json");
+  if (args[0] === "usage") return cmdImageUsage(jsonOut);
+
+  // First positional = the prompt. Walk the args so a space-separated flag value
+  // (`--ref img.png`) is never mistaken for it.
+  const VALUE_FLAGS = new Set(["--out", "--model", "--ref"]);
+  let prompt;
+  for (let i = 0; i < args.length; i++) {
+    if (VALUE_FLAGS.has(args[i])) i++; // skip the flag's value
+    else if (!args[i].startsWith("--")) { prompt = args[i]; break; }
+  }
+  if (!prompt) {
+    throw new Error(
+      'usage: calo-design image "<prompt>" [--out file.png] [--ref img.png]... [--model id] [--json]\n  or:  calo-design image usage'
+    );
+  }
+  const refImages = flagAll(args, "ref").map(refToDataUrl);
+  const model = flag(args, "model");
+  const out = flag(args, "out");
+
+  const session = await ensureSession();
+  if (!jsonOut) log(c.dim(`Generating${model ? ` with ${model}` : ""}… (typically 10–30s)`));
+  let res;
+  try {
+    res = await fetch(BROKER + "/v1/imagegen", {
+      method: "POST",
+      headers: { "content-type": "application/json", authorization: `Bearer ${session}` },
+      body: JSON.stringify({ prompt, ...(model ? { model } : {}), ...(refImages.length ? { refImages } : {}) }),
+      signal: AbortSignal.timeout(180000),
+    });
+  } catch (e) {
+    throw new Error(`can't reach the Calo broker at ${BROKER} (${e.message})`);
+  }
+  const data = await res.json().catch(() => ({}));
+  if (!res.ok) throw new Error(data.error || `imagegen → HTTP ${res.status}`);
+
+  // Write files. --out names the first image exactly (extension from the actual
+  // mime wins over a mismatched one); extras and the no---out case get slug names.
+  const taken = new Set();
+  const files = [];
+  for (const [i, img] of data.images.entries()) {
+    const ext = EXTS[img.mime] || "png";
+    let file;
+    if (out && i === 0) {
+      const wanted = out.replace(/\.(png|jpe?g|webp)$/i, "");
+      file = outPath(wanted, ext, taken);
+    } else {
+      file = outPath(path.join(process.cwd(), promptSlug(prompt)), ext, taken);
+    }
+    fs.mkdirSync(path.dirname(path.resolve(file)), { recursive: true });
+    fs.writeFileSync(file, Buffer.from(img.b64, "base64"));
+    files.push({ file: path.resolve(file), url: img.url, mime: img.mime });
+  }
+
+  if (jsonOut) {
+    const { images: _images, ...rest } = data; // drop the base64 payload from machine output
+    process.stdout.write("\n" + JSON.stringify({ ...rest, files }) + "\n");
+    return;
+  }
+  for (const f of files) {
+    log(`${c.g("✓")} ${f.file}`);
+    if (f.url) log(c.dim(`  hosted: ${f.url}`));
+  }
+  if (data.text) log(c.dim(`  model note: ${data.text}`));
+  const u = data.usage;
+  log(c.dim(`  ${data.model} · this call ${money(data.cost)} · ${u.month}: ${u.images}/${u.limits.monthlyImages || "∞"} images, ${money(u.cost)}/$${u.limits.monthlyCostUsd || "∞"}`));
+}
+
+module.exports = { cmdImage };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@calo-design/cli",
-  "version": "0.5.0",
+  "version": "0.6.0",
   "description": "One-line setup for Calo design tooling: logs in with your Calo email and installs the calo-design skill + design-system packages. No GitHub account needed.",
   "bin": {
     "calo-design": "bin/cli.js"