blumenjs 0.1.6 → 0.2.0

package/dist/cli/blumen.js

@@ -68,7 +68,7 @@ async function select(question, options) {
     input: process.stdin,
     output: process.stdout
   });
-  return new Promise((resolve2) => {
+  return new Promise((resolve3) => {
     console.log(`
   ${c.bold}${question}${c.reset}`);
     options.forEach((opt, i) => {
@@ -79,9 +79,9 @@ async function select(question, options) {
       rl.close();
       const idx = parseInt(answer, 10) - 1;
       if (idx >= 0 && idx < options.length) {
-        resolve2(options[idx]);
+        resolve3(options[idx]);
       } else {
-        resolve2(options[0]);
+        resolve3(options[0]);
       }
     });
   });
@@ -93,14 +93,14 @@ async function confirm(question, defaultYes = true) {
     output: process.stdout
   });
   const hint = defaultYes ? "Y/n" : "y/N";
-  return new Promise((resolve2) => {
+  return new Promise((resolve3) => {
     rl.question(`  ${c.bold}${question}${c.reset} ${c.dim}(${hint})${c.reset} `, (answer) => {
       rl.close();
       const a = answer.trim().toLowerCase();
       if (a === "")
-        resolve2(defaultYes);
+        resolve3(defaultYes);
       else
-        resolve2(a === "y" || a === "yes");
+        resolve3(a === "y" || a === "yes");
     });
   });
 }
@@ -243,7 +243,7 @@ async function dev() {
       label: " go",
       color: c.green,
       cmd: "go",
-      args: ["run", "go-server/main.go"],
+      args: ["run", "go-server/main.go", "go-server/image.go", "go-server/cache.go"],
       readyPattern: /Go server starting/
     }
   ];
@@ -321,9 +321,13 @@ async function dev() {
 
 // cli/commands/build.ts
 import { execSync as execSync3 } from "child_process";
-async function build() {
+async function build(args = []) {
   banner();
+  const analyze = args.includes("--analyze");
   log.info("Creating production build...");
+  if (analyze) {
+    log.info(`${c.magenta}Bundle analyzer${c.reset} will open after build.`);
+  }
   log.blank();
   const steps = [
     {
@@ -332,11 +336,12 @@ async function build() {
     },
     {
       label: "Building client bundle",
-      cmd: "npx webpack --mode production"
+      cmd: "npx webpack --mode production",
+      env: analyze ? { BLUMEN_ANALYZE: "1" } : void 0
     },
     {
       label: "Building SSR server",
-      cmd: "npx esbuild node-ssr/server.ts --bundle --platform=node --format=esm --outfile=dist/ssr-server.js --external:react --external:react-dom"
+      cmd: "npx esbuild node-ssr/server.ts --bundle --platform=node --format=esm --outfile=dist/ssr-server.js --packages=external"
     }
   ];
   const startTime = Date.now();
@@ -344,7 +349,11 @@ async function build() {
     const step = steps[i];
     log.step(`[${i + 1}/${steps.length}] ${step.label}...`);
     try {
-      execSync3(step.cmd, { stdio: "inherit", cwd: process.cwd() });
+      execSync3(step.cmd, {
+        stdio: "inherit",
+        cwd: process.cwd(),
+        env: { ...process.env, ...step.env || {} }
+      });
       log.success(step.label);
     } catch {
       log.error(`Failed: ${step.label}`);
@@ -392,7 +401,7 @@ async function start() {
       label: " go",
       color: c.green,
       cmd: "go",
-      args: ["run", "go-server/main.go"],
+      args: ["run", "go-server/main.go", "go-server/image.go", "go-server/cache.go"],
       readyPattern: /Go server starting/
     }
   ];
@@ -691,7 +700,7 @@ RUN npm install --production=false
 RUN npx tsx scripts/generate-routes.ts
 RUN npx webpack --mode production
 RUN npx esbuild node-ssr/server.ts --bundle --platform=node --format=esm \\
-    --outfile=dist/ssr-server.js --external:react --external:react-dom
+    --outfile=dist/ssr-server.js --packages=external
 
 # \u2500\u2500 Stage 3: Production image \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500
 FROM node:20-alpine
@@ -1139,6 +1148,236 @@ async function deploy(subcommand) {
   }
 }
 
+// cli/commands/fonts.ts
+import * as fs5 from "fs";
+import * as path4 from "path";
+import * as https from "https";
+var FONTS_DIR = path4.resolve("static/fonts");
+var FONTS_CSS = path4.resolve("static/css/fonts.css");
+var FONTS_CONFIG = path4.resolve("blumen.fonts.json");
+var DEFAULT_MANIFEST = {
+  fonts: []
+};
+var FALLBACK_MAP = {
+  "Inter": { fallback: "system-ui, -apple-system, sans-serif", sizeAdjust: "107%" },
+  "Roboto": { fallback: "Arial, Helvetica, sans-serif", sizeAdjust: "100.3%" },
+  "Open Sans": { fallback: "Arial, Helvetica, sans-serif", sizeAdjust: "105.2%" },
+  "Lato": { fallback: "Arial, Helvetica, sans-serif", sizeAdjust: "97.4%" },
+  "Montserrat": { fallback: "Arial, Helvetica, sans-serif", sizeAdjust: "112.5%" },
+  "Poppins": { fallback: "Arial, Helvetica, sans-serif", sizeAdjust: "112%" },
+  "Outfit": { fallback: "system-ui, -apple-system, sans-serif", sizeAdjust: "105%" },
+  "Roboto Mono": { fallback: "'Courier New', Courier, monospace", sizeAdjust: "101%" },
+  "Source Code Pro": { fallback: "'Courier New', Courier, monospace", sizeAdjust: "97.5%" },
+  "Fira Code": { fallback: "'Courier New', Courier, monospace", sizeAdjust: "99%" },
+  "JetBrains Mono": { fallback: "'Courier New', Courier, monospace", sizeAdjust: "103%" }
+};
+function downloadFile(url, dest) {
+  return new Promise((resolve3, reject) => {
+    const file = fs5.createWriteStream(dest);
+    https.get(url, { headers: { "User-Agent": "Mozilla/5.0" } }, (response) => {
+      if (response.statusCode === 301 || response.statusCode === 302) {
+        const redirectUrl = response.headers.location;
+        if (redirectUrl) {
+          downloadFile(redirectUrl, dest).then(resolve3).catch(reject);
+          return;
+        }
+      }
+      if (response.statusCode !== 200) {
+        reject(new Error(`HTTP ${response.statusCode} for ${url}`));
+        return;
+      }
+      response.pipe(file);
+      file.on("finish", () => {
+        file.close();
+        resolve3();
+      });
+    }).on("error", (err) => {
+      fs5.unlink(dest, () => {
+      });
+      reject(err);
+    });
+  });
+}
+function fetchGoogleFontsCSS(family, weights, subsets) {
+  return new Promise((resolve3, reject) => {
+    const weightStr = weights.join(";");
+    const url = `https://fonts.googleapis.com/css2?family=${encodeURIComponent(family)}:wght@${weightStr}&display=swap&subset=${subsets.join(",")}`;
+    https.get(url, {
+      headers: {
+        // Request WOFF2 format by pretending to be a modern browser
+        "User-Agent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36"
+      }
+    }, (response) => {
+      let data = "";
+      response.on("data", (chunk) => {
+        data += chunk.toString();
+      });
+      response.on("end", () => resolve3(data));
+    }).on("error", reject);
+  });
+}
+function parseFontUrls(css) {
+  const results = [];
+  const blocks = css.split("@font-face");
+  for (const block of blocks) {
+    if (!block.includes("url("))
+      continue;
+    const urlMatch = block.match(/url\((https?:\/\/[^)]+)\)/);
+    const weightMatch = block.match(/font-weight:\s*(\d+)/);
+    const styleMatch = block.match(/font-style:\s*(\w+)/);
+    const formatMatch = block.match(/format\('([^']+)'\)/);
+    const unicodeMatch = block.match(/unicode-range:\s*([^;]+)/);
+    if (urlMatch) {
+      results.push({
+        url: urlMatch[1],
+        weight: weightMatch?.[1] || "400",
+        style: styleMatch?.[1] || "normal",
+        format: formatMatch?.[1] || "woff2",
+        unicodeRange: unicodeMatch?.[1]?.trim()
+      });
+    }
+  }
+  return results;
+}
+function generateFontFaceCSS(family, weight, style, fileName, display, unicodeRange) {
+  let css = `@font-face {
+  font-family: '${family}';
+  font-style: ${style};
+  font-weight: ${weight};
+  font-display: ${display};
+  src: url('/static/fonts/${fileName}') format('woff2');`;
+  if (unicodeRange) {
+    css += `
+  unicode-range: ${unicodeRange};`;
+  }
+  css += "\n}\n";
+  return css;
+}
+function generateFallbackCSS(family) {
+  const fallback = FALLBACK_MAP[family];
+  if (!fallback)
+    return "";
+  return `/* Fallback font with size-adjust to prevent layout shift */
+@font-face {
+  font-family: '${family} Fallback';
+  src: local(${fallback.fallback.split(",")[0].trim()});
+  size-adjust: ${fallback.sizeAdjust};
+  ascent-override: 90%;
+  descent-override: 22%;
+  line-gap-override: 0%;
+}
+`;
+}
+async function processFont(config) {
+  console.log(`  Downloading: ${config.family} (weights: ${config.weights.join(", ")})`);
+  const css = await fetchGoogleFontsCSS(config.family, config.weights, config.subsets);
+  const fontUrls = parseFontUrls(css);
+  if (fontUrls.length === 0) {
+    console.log(`    Warning: No font files found for ${config.family}`);
+    return "";
+  }
+  let generatedCSS = "";
+  generatedCSS += generateFallbackCSS(config.family);
+  for (const font of fontUrls) {
+    const ext = font.format === "woff2" ? "woff2" : "woff";
+    const safeName = config.family.replace(/\s+/g, "-").toLowerCase();
+    const fileName = `${safeName}-${font.weight}-${font.style}.${ext}`;
+    const filePath = path4.join(FONTS_DIR, fileName);
+    if (!fs5.existsSync(filePath)) {
+      try {
+        await downloadFile(font.url, filePath);
+        const size = fs5.statSync(filePath).size;
+        console.log(`    Downloaded: ${fileName} (${(size / 1024).toFixed(1)} KB)`);
+      } catch (err) {
+        console.error(`    Failed to download ${fileName}: ${err}`);
+        continue;
+      }
+    } else {
+      console.log(`    Cached: ${fileName}`);
+    }
+    generatedCSS += generateFontFaceCSS(
+      config.family,
+      font.weight,
+      font.style,
+      fileName,
+      config.display,
+      font.unicodeRange
+    );
+  }
+  return generatedCSS;
+}
+function loadManifest() {
+  if (fs5.existsSync(FONTS_CONFIG)) {
+    return JSON.parse(fs5.readFileSync(FONTS_CONFIG, "utf-8"));
+  }
+  return { ...DEFAULT_MANIFEST };
+}
+function saveManifest(manifest) {
+  fs5.writeFileSync(FONTS_CONFIG, JSON.stringify(manifest, null, 2), "utf-8");
+}
+async function fontsCommand(args) {
+  console.log("\n  \u{1F338} Blumen Font Optimizer\n");
+  const addIndex = args.indexOf("--add");
+  const listMode = args.includes("--list");
+  const manifest = loadManifest();
+  if (listMode) {
+    if (manifest.fonts.length === 0) {
+      console.log("  No fonts configured.");
+      console.log('  Add a font: blumen fonts --add "Inter"');
+    } else {
+      console.log("  Configured fonts:");
+      for (const font of manifest.fonts) {
+        console.log(`    - ${font.family} (weights: ${font.weights.join(", ")})`);
+      }
+    }
+    return;
+  }
+  if (addIndex !== -1 && args[addIndex + 1]) {
+    const family = args[addIndex + 1].replace(/"/g, "").replace(/'/g, "");
+    const existing = manifest.fonts.find((f) => f.family === family);
+    if (existing) {
+      console.log(`  Font "${family}" is already configured.`);
+      return;
+    }
+    manifest.fonts.push({
+      family,
+      weights: [400, 500, 600, 700],
+      subsets: ["latin"],
+      display: "swap",
+      style: "normal"
+    });
+    saveManifest(manifest);
+    console.log(`  Added "${family}" to blumen.fonts.json`);
+  }
+  if (manifest.fonts.length === 0) {
+    console.log("  No fonts configured. Add one first:");
+    console.log('    blumen fonts --add "Inter"');
+    console.log('    blumen fonts --add "Roboto"');
+    return;
+  }
+  fs5.mkdirSync(FONTS_DIR, { recursive: true });
+  fs5.mkdirSync(path4.dirname(FONTS_CSS), { recursive: true });
+  let allCSS = `/* Auto-generated by Blumen Font Optimizer */
+/* Do not edit manually - run 'blumen fonts' to regenerate */
+
+`;
+  for (const fontConfig of manifest.fonts) {
+    const css = await processFont(fontConfig);
+    allCSS += css + "\n";
+  }
+  fs5.writeFileSync(FONTS_CSS, allCSS, "utf-8");
+  console.log(`
+  \u2705 Font CSS written to: ${path4.relative(process.cwd(), FONTS_CSS)}`);
+  console.log(`  \u2705 Font files saved to: ${path4.relative(process.cwd(), FONTS_DIR)}/`);
+  console.log(`
+  To use these fonts, import the CSS in your _app.tsx or _document.tsx:`);
+  console.log(`    import '../../static/css/fonts.css';`);
+  console.log(`
+  Or add to your CSS:`);
+  console.log(`    body { font-family: '${manifest.fonts[0].family}', '${manifest.fonts[0].family} Fallback', sans-serif; }`);
+  console.log();
+}
+
 // cli/blumen.ts
 async function main() {
   const command = process.argv[2];
@@ -1160,6 +1399,9 @@ async function main() {
     console.log(
       `    deploy     Deploy to Docker, Fly.io, or Railway`
     );
+    console.log(
+      `    fonts      Download and optimize fonts`
+    );
     console.log("");
     console.log(`  ${c.bold}Options${c.reset}`);
     console.log(`    --help     Show this help message`);
@@ -1187,6 +1429,9 @@ async function main() {
     case "deploy":
       await deploy(process.argv[3]);
       break;
+    case "fonts":
+      await fontsCommand(process.argv.slice(3));
+      break;
     default:
       log.error(
         `Unknown command: ${c.bold}${command}${c.reset}`

package/dist/cli/commands/build.js

@@ -61,9 +61,13 @@ function divider() {
 }
 
 // cli/commands/build.ts
-async function build() {
+async function build(args = []) {
   banner();
+  const analyze = args.includes("--analyze");
   log.info("Creating production build...");
+  if (analyze) {
+    log.info(`${c.magenta}Bundle analyzer${c.reset} will open after build.`);
+  }
   log.blank();
   const steps = [
     {
@@ -72,11 +76,12 @@ async function build() {
     },
     {
       label: "Building client bundle",
-      cmd: "npx webpack --mode production"
+      cmd: "npx webpack --mode production",
+      env: analyze ? { BLUMEN_ANALYZE: "1" } : void 0
     },
     {
       label: "Building SSR server",
-      cmd: "npx esbuild node-ssr/server.ts --bundle --platform=node --format=esm --outfile=dist/ssr-server.js --external:react --external:react-dom"
+      cmd: "npx esbuild node-ssr/server.ts --bundle --platform=node --format=esm --outfile=dist/ssr-server.js --packages=external"
     }
   ];
   const startTime = Date.now();
@@ -84,7 +89,11 @@ async function build() {
     const step = steps[i];
     log.step(`[${i + 1}/${steps.length}] ${step.label}...`);
     try {
-      execSync(step.cmd, { stdio: "inherit", cwd: process.cwd() });
+      execSync(step.cmd, {
+        stdio: "inherit",
+        cwd: process.cwd(),
+        env: { ...process.env, ...step.env || {} }
+      });
       log.success(step.label);
     } catch {
       log.error(`Failed: ${step.label}`);

package/dist/cli/commands/create.js

@@ -435,7 +435,7 @@ RUN npm install --production=false
 RUN npx tsx scripts/generate-routes.ts
 RUN npx webpack --mode production
 RUN npx esbuild node-ssr/server.ts --bundle --platform=node --format=esm \\
-    --outfile=dist/ssr-server.js --external:react --external:react-dom
+    --outfile=dist/ssr-server.js --packages=external
 
 # \u2500\u2500 Stage 3: Production image \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500
 FROM node:20-alpine

package/dist/cli/commands/dev.js

@@ -218,7 +218,7 @@ async function dev() {
       label: " go",
       color: c.green,
       cmd: "go",
-      args: ["run", "go-server/main.go"],
+      args: ["run", "go-server/main.go", "go-server/image.go", "go-server/cache.go"],
       readyPattern: /Go server starting/
     }
   ];

package/dist/cli/commands/fonts.js

@@ -0,0 +1,232 @@
+// cli/commands/fonts.ts
+import * as fs from "fs";
+import * as path from "path";
+import * as https from "https";
+var FONTS_DIR = path.resolve("static/fonts");
+var FONTS_CSS = path.resolve("static/css/fonts.css");
+var FONTS_CONFIG = path.resolve("blumen.fonts.json");
+var DEFAULT_MANIFEST = {
+  fonts: []
+};
+var FALLBACK_MAP = {
+  "Inter": { fallback: "system-ui, -apple-system, sans-serif", sizeAdjust: "107%" },
+  "Roboto": { fallback: "Arial, Helvetica, sans-serif", sizeAdjust: "100.3%" },
+  "Open Sans": { fallback: "Arial, Helvetica, sans-serif", sizeAdjust: "105.2%" },
+  "Lato": { fallback: "Arial, Helvetica, sans-serif", sizeAdjust: "97.4%" },
+  "Montserrat": { fallback: "Arial, Helvetica, sans-serif", sizeAdjust: "112.5%" },
+  "Poppins": { fallback: "Arial, Helvetica, sans-serif", sizeAdjust: "112%" },
+  "Outfit": { fallback: "system-ui, -apple-system, sans-serif", sizeAdjust: "105%" },
+  "Roboto Mono": { fallback: "'Courier New', Courier, monospace", sizeAdjust: "101%" },
+  "Source Code Pro": { fallback: "'Courier New', Courier, monospace", sizeAdjust: "97.5%" },
+  "Fira Code": { fallback: "'Courier New', Courier, monospace", sizeAdjust: "99%" },
+  "JetBrains Mono": { fallback: "'Courier New', Courier, monospace", sizeAdjust: "103%" }
+};
+function downloadFile(url, dest) {
+  return new Promise((resolve2, reject) => {
+    const file = fs.createWriteStream(dest);
+    https.get(url, { headers: { "User-Agent": "Mozilla/5.0" } }, (response) => {
+      if (response.statusCode === 301 || response.statusCode === 302) {
+        const redirectUrl = response.headers.location;
+        if (redirectUrl) {
+          downloadFile(redirectUrl, dest).then(resolve2).catch(reject);
+          return;
+        }
+      }
+      if (response.statusCode !== 200) {
+        reject(new Error(`HTTP ${response.statusCode} for ${url}`));
+        return;
+      }
+      response.pipe(file);
+      file.on("finish", () => {
+        file.close();
+        resolve2();
+      });
+    }).on("error", (err) => {
+      fs.unlink(dest, () => {
+      });
+      reject(err);
+    });
+  });
+}
+function fetchGoogleFontsCSS(family, weights, subsets) {
+  return new Promise((resolve2, reject) => {
+    const weightStr = weights.join(";");
+    const url = `https://fonts.googleapis.com/css2?family=${encodeURIComponent(family)}:wght@${weightStr}&display=swap&subset=${subsets.join(",")}`;
+    https.get(url, {
+      headers: {
+        // Request WOFF2 format by pretending to be a modern browser
+        "User-Agent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36"
+      }
+    }, (response) => {
+      let data = "";
+      response.on("data", (chunk) => {
+        data += chunk.toString();
+      });
+      response.on("end", () => resolve2(data));
+    }).on("error", reject);
+  });
+}
+function parseFontUrls(css) {
+  const results = [];
+  const blocks = css.split("@font-face");
+  for (const block of blocks) {
+    if (!block.includes("url("))
+      continue;
+    const urlMatch = block.match(/url\((https?:\/\/[^)]+)\)/);
+    const weightMatch = block.match(/font-weight:\s*(\d+)/);
+    const styleMatch = block.match(/font-style:\s*(\w+)/);
+    const formatMatch = block.match(/format\('([^']+)'\)/);
+    const unicodeMatch = block.match(/unicode-range:\s*([^;]+)/);
+    if (urlMatch) {
+      results.push({
+        url: urlMatch[1],
+        weight: weightMatch?.[1] || "400",
+        style: styleMatch?.[1] || "normal",
+        format: formatMatch?.[1] || "woff2",
+        unicodeRange: unicodeMatch?.[1]?.trim()
+      });
+    }
+  }
+  return results;
+}
+function generateFontFaceCSS(family, weight, style, fileName, display, unicodeRange) {
+  let css = `@font-face {
+  font-family: '${family}';
+  font-style: ${style};
+  font-weight: ${weight};
+  font-display: ${display};
+  src: url('/static/fonts/${fileName}') format('woff2');`;
+  if (unicodeRange) {
+    css += `
+  unicode-range: ${unicodeRange};`;
+  }
+  css += "\n}\n";
+  return css;
+}
+function generateFallbackCSS(family) {
+  const fallback = FALLBACK_MAP[family];
+  if (!fallback)
+    return "";
+  return `/* Fallback font with size-adjust to prevent layout shift */
+@font-face {
+  font-family: '${family} Fallback';
+  src: local(${fallback.fallback.split(",")[0].trim()});
+  size-adjust: ${fallback.sizeAdjust};
+  ascent-override: 90%;
+  descent-override: 22%;
+  line-gap-override: 0%;
+}
+`;
+}
+async function processFont(config) {
+  console.log(`  Downloading: ${config.family} (weights: ${config.weights.join(", ")})`);
+  const css = await fetchGoogleFontsCSS(config.family, config.weights, config.subsets);
+  const fontUrls = parseFontUrls(css);
+  if (fontUrls.length === 0) {
+    console.log(`    Warning: No font files found for ${config.family}`);
+    return "";
+  }
+  let generatedCSS = "";
+  generatedCSS += generateFallbackCSS(config.family);
+  for (const font of fontUrls) {
+    const ext = font.format === "woff2" ? "woff2" : "woff";
+    const safeName = config.family.replace(/\s+/g, "-").toLowerCase();
+    const fileName = `${safeName}-${font.weight}-${font.style}.${ext}`;
+    const filePath = path.join(FONTS_DIR, fileName);
+    if (!fs.existsSync(filePath)) {
+      try {
+        await downloadFile(font.url, filePath);
+        const size = fs.statSync(filePath).size;
+        console.log(`    Downloaded: ${fileName} (${(size / 1024).toFixed(1)} KB)`);
+      } catch (err) {
+        console.error(`    Failed to download ${fileName}: ${err}`);
+        continue;
+      }
+    } else {
+      console.log(`    Cached: ${fileName}`);
+    }
+    generatedCSS += generateFontFaceCSS(
+      config.family,
+      font.weight,
+      font.style,
+      fileName,
+      config.display,
+      font.unicodeRange
+    );
+  }
+  return generatedCSS;
+}
+function loadManifest() {
+  if (fs.existsSync(FONTS_CONFIG)) {
+    return JSON.parse(fs.readFileSync(FONTS_CONFIG, "utf-8"));
+  }
+  return { ...DEFAULT_MANIFEST };
+}
+function saveManifest(manifest) {
+  fs.writeFileSync(FONTS_CONFIG, JSON.stringify(manifest, null, 2), "utf-8");
+}
+async function fontsCommand(args) {
+  console.log("\n  \u{1F338} Blumen Font Optimizer\n");
+  const addIndex = args.indexOf("--add");
+  const listMode = args.includes("--list");
+  const manifest = loadManifest();
+  if (listMode) {
+    if (manifest.fonts.length === 0) {
+      console.log("  No fonts configured.");
+      console.log('  Add a font: blumen fonts --add "Inter"');
+    } else {
+      console.log("  Configured fonts:");
+      for (const font of manifest.fonts) {
+        console.log(`    - ${font.family} (weights: ${font.weights.join(", ")})`);
+      }
+    }
+    return;
+  }
+  if (addIndex !== -1 && args[addIndex + 1]) {
+    const family = args[addIndex + 1].replace(/"/g, "").replace(/'/g, "");
+    const existing = manifest.fonts.find((f) => f.family === family);
+    if (existing) {
+      console.log(`  Font "${family}" is already configured.`);
+      return;
+    }
+    manifest.fonts.push({
+      family,
+      weights: [400, 500, 600, 700],
+      subsets: ["latin"],
+      display: "swap",
+      style: "normal"
+    });
+    saveManifest(manifest);
+    console.log(`  Added "${family}" to blumen.fonts.json`);
+  }
+  if (manifest.fonts.length === 0) {
+    console.log("  No fonts configured. Add one first:");
+    console.log('    blumen fonts --add "Inter"');
+    console.log('    blumen fonts --add "Roboto"');
+    return;
+  }
+  fs.mkdirSync(FONTS_DIR, { recursive: true });
+  fs.mkdirSync(path.dirname(FONTS_CSS), { recursive: true });
+  let allCSS = `/* Auto-generated by Blumen Font Optimizer */
+/* Do not edit manually - run 'blumen fonts' to regenerate */
+
+`;
+  for (const fontConfig of manifest.fonts) {
+    const css = await processFont(fontConfig);
+    allCSS += css + "\n";
+  }
+  fs.writeFileSync(FONTS_CSS, allCSS, "utf-8");
+  console.log(`
+  \u2705 Font CSS written to: ${path.relative(process.cwd(), FONTS_CSS)}`);
+  console.log(`  \u2705 Font files saved to: ${path.relative(process.cwd(), FONTS_DIR)}/`);
+  console.log(`
+  To use these fonts, import the CSS in your _app.tsx or _document.tsx:`);
+  console.log(`    import '../../static/css/fonts.css';`);
+  console.log(`
+  Or add to your CSS:`);
+  console.log(`    body { font-family: '${manifest.fonts[0].family}', '${manifest.fonts[0].family} Fallback', sans-serif; }`);
+  console.log();
+}
+export {
+  fontsCommand
+};

package/dist/cli/commands/start.js

@@ -87,7 +87,7 @@ async function start() {
       label: " go",
       color: c.green,
       cmd: "go",
-      args: ["run", "go-server/main.go"],
+      args: ["run", "go-server/main.go", "go-server/image.go", "go-server/cache.go"],
       readyPattern: /Go server starting/
     }
   ];

package/dist/templates/app/client/entry.tsx

@@ -19,7 +19,8 @@ function init() {
 	const initialProps = propsText ? JSON.parse(propsText) : {};
 
 	// Hydrate the app with the RouterProvider.
-	// The provider handles route matching, page rendering, and SPA navigation.
+	// Error boundaries are handled inside RouterProvider to ensure
+	// the DOM tree matches what the SSR server produces.
 	hydrateRoot(
 		container,
 		<RouterProvider
@@ -39,3 +40,4 @@ if (document.readyState === "loading") {
 } else {
 	init();
 }
+