reelme 0.3.0 → 0.5.0

package/src/cache.mjs

@@ -12,7 +12,7 @@ import {
   rmSync,
 } from "node:fs";
 import { homedir } from "node:os";
-import { basename, dirname, join } from "node:path";
+import { basename, dirname, isAbsolute, join, relative, resolve } from "node:path";
 import { fileURLToPath } from "node:url";
 import { spawnSync } from "node:child_process";
 
@@ -26,6 +26,19 @@ const CLI_VERSION = JSON.parse(
   readFileSync(join(PKG_ROOT, "package.json"), "utf8")
 ).version;
 
+// Cache-invalidation key. The per-render `src/` re-sync keeps scene code fresh,
+// but dependencies and pnpm config only reach an existing cache on a full
+// rebuild — so the marker hashes those files, not just the CLI version (F8).
+// A bumped Remotion version or workspace change now forces a reinstall.
+function templateFingerprint() {
+  const hash = createHash("sha256").update(CLI_VERSION);
+  for (const file of ["package.json", "pnpm-workspace.yaml"]) {
+    const path = join(TEMPLATE_DIR, file);
+    if (existsSync(path)) hash.update(readFileSync(path));
+  }
+  return hash.digest("hex").slice(0, 16);
+}
+
 // Not copied into the cache scaffold (mirrors the old SKILL.md rsync excludes).
 const SCAFFOLD_EXCLUDES = new Set([
   "node_modules",
@@ -48,6 +61,86 @@ export function loadPlatforms() {
   );
 }
 
+// Per-scene contract, mirroring the TypeScript union in template/src/brief.ts.
+// The CLI runs first and owns the error UX, so it validates exhaustively here
+// (F4/F13/F24): a typo'd scene type or a missing required prop is caught with a
+// named error instead of a cryptic NaN duration or crash minutes into Remotion.
+const SCENE_REQUIRED = {
+  problem: ["headline"],
+  "code-reveal": ["language", "code"],
+  terminal: ["commands"],
+  "data-flow": ["nodes", "edges"],
+  cta: ["installCommand", "repoUrl"],
+  browser: ["url"],
+  split: ["before", "after"],
+  "feature-list": ["items"],
+  "stat-callout": ["stats"],
+  "file-tree": ["entries"],
+  mobile: [],
+  "os-window": ["items"],
+  hotkey: ["keys"],
+  hook: ["text"],
+  clip: ["src", "frame"],
+  benchmark: ["bars"],
+  custom: ["component", "durationInFrames"],
+};
+const ARRAY_FIELDS = new Set([
+  "commands", "nodes", "edges", "items", "stats", "entries", "keys", "bars",
+]);
+const CLIP_EXTS = ["mp4", "mov", "gif"];
+const IMAGE_EXTS = ["png", "jpg", "jpeg", "webp"];
+
+function extOf(p) {
+  const dot = p.lastIndexOf(".");
+  return dot === -1 ? "" : p.slice(dot + 1).toLowerCase();
+}
+
+function validateScene(scene, where, errors) {
+  if (!scene || typeof scene !== "object") {
+    errors.push(`${where}: scene must be an object.`);
+    return;
+  }
+  const spec = SCENE_REQUIRED[scene.type];
+  if (!spec) {
+    errors.push(
+      `${where}: unknown scene type "${scene.type ?? "(none)"}". Valid types: ${Object.keys(SCENE_REQUIRED).join(", ")}.`
+    );
+    return;
+  }
+  for (const field of spec) {
+    if (scene[field] === undefined || scene[field] === null) {
+      errors.push(`${where} (${scene.type}): missing required field "${field}".`);
+    } else if (ARRAY_FIELDS.has(field) && !Array.isArray(scene[field])) {
+      errors.push(`${where} (${scene.type}): "${field}" must be an array.`);
+    }
+  }
+  // Asset extension checks — the direct-CLI path has no skill to pre-validate.
+  const assetChecks = [
+    ["clip", "src", CLIP_EXTS],
+    ["mobile", "screenshot", IMAGE_EXTS],
+    ["browser", "image", IMAGE_EXTS],
+    ["custom", "component", ["tsx"]],
+  ];
+  for (const [type, field, exts] of assetChecks) {
+    if (scene.type === type && typeof scene[field] === "string" && !exts.includes(extOf(scene[field]))) {
+      errors.push(
+        `${where} (${type}): "${field}" must be one of ${exts.join(", ")} (got "${scene[field]}").`
+      );
+    }
+  }
+}
+
+// Empty cut arrays are normalized to absent so a `"vertical": []` behaves like a
+// missing vertical cut everywhere (F3): the CLI and the template agree on the
+// main-cut fallback instead of building a zero-duration composition.
+function normalizeCuts(brief) {
+  for (const key of ["vertical", "teaser"]) {
+    if (Array.isArray(brief.cuts?.[key]) && brief.cuts[key].length === 0) {
+      delete brief.cuts[key];
+    }
+  }
+}
+
 export function readBrief(repoRoot) {
   const briefPath = join(repoRoot, "reelme.json");
   if (!existsSync(briefPath)) {
@@ -83,6 +176,17 @@ export function readBrief(repoRoot) {
   if (!Array.isArray(brief.cuts?.main) || brief.cuts.main.length === 0) {
     fail(`cuts.main is missing or empty — the main cut is required.`);
   }
+  normalizeCuts(brief);
+
+  const errors = [];
+  for (const key of ["main", "vertical", "teaser"]) {
+    const cut = brief.cuts[key];
+    if (!Array.isArray(cut)) continue;
+    cut.forEach((scene, i) => validateScene(scene, `cuts.${key}[${i}]`, errors));
+  }
+  if (errors.length > 0) {
+    fail(`reelme.json has ${errors.length} scene problem(s):\n${errors.map((e) => `  ${e}`).join("\n")}`);
+  }
   return brief;
 }
 
@@ -91,8 +195,16 @@ export function projectCacheDir(repoRoot) {
   return join(CACHE_ROOT, hash);
 }
 
+// spawnSync with the pnpm/npx shims resolved on every OS. On Windows those
+// shims are `.cmd` files, which Node's spawnSync can only launch via a shell
+// (and since CVE-2024-27980 that is the only sanctioned route). Elsewhere we
+// avoid the shell so arguments never go through word-splitting.
+export function runShell(command, args, cwd) {
+  return spawnSync(command, args, { cwd, stdio: "inherit", shell: process.platform === "win32" });
+}
+
 function run(command, args, cwd) {
-  const result = spawnSync(command, args, { cwd, stdio: "inherit" });
+  const result = runShell(command, args, cwd);
   if (result.error) fail(`failed to run ${command}: ${result.error.message}`);
   if (result.status !== 0) {
     fail(`${command} ${args.join(" ")} exited with status ${result.status}`);
@@ -105,13 +217,18 @@ function run(command, args, cwd) {
 export function ensureScaffold(repoRoot) {
   const cacheDir = projectCacheDir(repoRoot);
   const versionMarker = join(cacheDir, ".reelme-template-version");
+  const fingerprint = templateFingerprint();
 
-  const stale =
-    existsSync(versionMarker) &&
-    readFileSync(versionMarker, "utf8").trim() !== CLI_VERSION;
-  if (stale) {
+  // A cache with a package.json but a missing or mismatched marker is stale — a
+  // missing marker is treated as stale, not fresh (F8), so half-built or
+  // pre-marker caches always rebuild.
+  const cacheExists = existsSync(join(cacheDir, "package.json"));
+  const markerValue = existsSync(versionMarker)
+    ? readFileSync(versionMarker, "utf8").trim()
+    : null;
+  if (cacheExists && markerValue !== fingerprint) {
     console.log(
-      `reelme: template updated (CLI ${CLI_VERSION}) — rebuilding the cache scaffold.`
+      `reelme: template changed (CLI ${CLI_VERSION}) — rebuilding the cache scaffold.`
     );
     rmSync(cacheDir, { recursive: true, force: true });
   }
@@ -123,27 +240,140 @@ export function ensureScaffold(repoRoot) {
       recursive: true,
       filter: (src) => !SCAFFOLD_EXCLUDES.has(basename(src)),
     });
-    writeFileSync(versionMarker, `${CLI_VERSION}\n`);
+    writeFileSync(versionMarker, `${fingerprint}\n`);
   }
 
-  // The user's brief always wins over the template sample.
+  // Re-sync the template source on every render. The version marker only fires
+  // on a CLI bump, so without this a render reuses whatever scene code the cache
+  // was scaffolded with — local template edits (and the gallery render eval)
+  // would silently test stale code. This is a cheap dir copy; node_modules stays
+  // gated below so we don't reinstall. (Deleted template files aren't pruned from
+  // the cache — a CLI bump or `reelme clean` does a full rebuild.)
+  cpSync(join(TEMPLATE_DIR, "src"), join(cacheDir, "src"), {
+    recursive: true,
+    filter: (src) => !SCAFFOLD_EXCLUDES.has(basename(src)),
+  });
+
+  // The user's brief always wins over the template sample. On the way in, the
+  // chosen track's BPM is injected from the audio manifest so the template can
+  // quantize scene cuts to the beat — the manifest stays the single source of
+  // truth and briefs never hand-write bpm.
   cpSync(join(repoRoot, "reelme.json"), join(cacheDir, "src", "brief.json"));
+  try {
+    const briefPath = join(cacheDir, "src", "brief.json");
+    const staged = JSON.parse(readFileSync(briefPath, "utf8"));
+    const track = staged?.project?.audio?.track;
+    if (track) {
+      const manifest = JSON.parse(readFileSync(join(AUDIO_DIR, "manifest.json"), "utf8"));
+      const entry = Array.isArray(manifest) ? manifest.find((e) => e.file === track) : undefined;
+      if (entry && typeof entry.bpm === "number") {
+        staged.project.audio.bpm = entry.bpm;
+        writeFileSync(briefPath, JSON.stringify(staged, null, 2) + "\n");
+      }
+    }
+  } catch {
+    // Malformed briefs/manifests are reported by validation, not here.
+  }
+
+  stageCustomScenes(repoRoot, cacheDir);
 
   if (!existsSync(join(cacheDir, "node_modules"))) {
     console.log("reelme: installing render dependencies (first run only)…");
+    // esbuild's build script is pre-approved in template/pnpm-workspace.yaml
+    // (allowBuilds), so `pnpm install` runs it without a blanket approval of
+    // every dependency's scripts (F15) — the supply-chain gate stays closed.
     run("pnpm", ["install"], cacheDir);
-    // esbuild needs its post-install script; pnpm-workspace.yaml persists the approval.
-    run("pnpm", ["approve-builds", "--all"], cacheDir);
   }
 
   return cacheDir;
 }
 
-export function cleanCache() {
-  if (!existsSync(CACHE_ROOT)) {
-    console.log("reelme: cache is already empty.");
+/**
+ * Stage skill-authored bespoke scenes and regenerate the import registry the
+ * template's SceneRenderer resolves against. The template's default
+ * custom-scenes.ts (synced a moment earlier) exports an empty registry, so
+ * briefs without custom scenes keep exactly the stock behavior. Remotion
+ * bundles statically, so a generated barrel of real imports is the only way a
+ * brief-referenced path can become a renderable component.
+ */
+function stageCustomScenes(repoRoot, cacheDir) {
+  let components = [];
+  try {
+    const staged = JSON.parse(readFileSync(join(cacheDir, "src", "brief.json"), "utf8"));
+    for (const cut of Object.values(staged?.cuts ?? {})) {
+      if (!Array.isArray(cut)) continue;
+      for (const scene of cut) {
+        if (scene?.type === "custom" && typeof scene.component === "string") {
+          components.push(scene.component);
+        }
+      }
+    }
+  } catch {
+    return; // malformed briefs are reported by validation
+  }
+  components = [...new Set(components)];
+  if (components.length === 0) return;
+
+  const customDir = join(cacheDir, "src", "custom");
+  mkdirSync(customDir, { recursive: true });
+
+  const imports = [];
+  const entries = [];
+  components.forEach((rel, i) => {
+    // Containment: the component must live inside the repo.
+    const source = resolve(repoRoot, rel);
+    const contained = relative(repoRoot, source);
+    if (isAbsolute(rel) || contained.startsWith("..") || isAbsolute(contained)) {
+      fail(`custom scene component must be a repo-relative path (got "${rel}").`);
+    }
+    if (!existsSync(source)) {
+      fail(`custom scene component not found: ${rel}`);
+    }
+    cpSync(source, join(customDir, `scene-${i}.tsx`));
+    imports.push(`import Custom${i} from "./custom/scene-${i}";`);
+    entries.push(`  ${JSON.stringify(rel)}: Custom${i},`);
+  });
+
+  const generated = `// GENERATED by the reelme CLI at stage time — do not edit.
+import type { ComponentType } from "react";
+import { Theme } from "./theme";
+import { ProjectMeta } from "./brief";
+import { PlatformPreset } from "./platforms";
+${imports.join("\n")}
+
+export interface CustomSceneProps {
+  theme: Theme;
+  project: ProjectMeta;
+  platform: PlatformPreset;
+  bottomInset: number;
+  caption?: string;
+}
+
+export const CUSTOM_SCENES: Record<string, ComponentType<CustomSceneProps>> = {
+${entries.join("\n")}
+};
+`;
+  writeFileSync(join(cacheDir, "src", "custom-scenes.ts"), generated);
+}
+
+// Removes the current project's cache by default; pass `all` to wipe every
+// project's cache (F16). A moved/renamed repo hashes to a new dir, so `--all`
+// is the way to reclaim orphaned caches.
+export function cleanCache(repoRoot, all = false) {
+  if (all) {
+    if (!existsSync(CACHE_ROOT)) {
+      console.log("reelme: cache is already empty.");
+      return;
+    }
+    rmSync(CACHE_ROOT, { recursive: true, force: true });
+    console.log(`reelme: removed all project caches (${CACHE_ROOT})`);
+    return;
+  }
+  const cacheDir = projectCacheDir(repoRoot);
+  if (!existsSync(cacheDir)) {
+    console.log("reelme: no cache for this project. Use `reelme clean --all` to wipe every project's cache.");
     return;
   }
-  rmSync(CACHE_ROOT, { recursive: true, force: true });
-  console.log(`reelme: removed ${CACHE_ROOT}`);
+  rmSync(cacheDir, { recursive: true, force: true });
+  console.log(`reelme: removed this project's cache (${cacheDir})`);
 }

package/src/cli.mjs

@@ -4,30 +4,33 @@
 // skill owns the intelligence and writes reelme.json; this CLI never asks
 // questions.
 
-import { spawnSync } from "node:child_process";
-import { ensureScaffold, cleanCache, fail } from "./cache.mjs";
-import { render } from "./render.mjs";
+import { ensureScaffold, cleanCache, readBrief, runShell, fail } from "./cache.mjs";
+import { render, stageInputs } from "./render.mjs";
 
 const USAGE = `reelme — launch videos for your repo, rendered locally
 
 Usage: npx reelme <command>
 
 Commands:
-  render   Render every platform in reelme.json to ./reelme-out/
-  studio   Open Remotion Studio against the cached project (preview/tweak)
-  clean    Remove the reelme cache (~/.reelme/cache)
+  render       Render every platform in reelme.json to ./reelme-out/
+  studio       Open Remotion Studio against the cached project (preview/tweak)
+  validate     Check reelme.json (schema, platforms, scenes) without rendering
+  clean        Remove this project's reelme cache
+  clean --all  Remove every project's cache (~/.reelme/cache)
 
 The brief (reelme.json) lives at your repo root — create it with the
 /reelme agent skill: npx skills add RubenGlez/reelme
 `;
 
+// Studio runs the same staging pipeline as render (minus the render loop) so a
+// preview shows exactly what render() would produce — assets, audio, and logo
+// all staged, and a missing brief reported cleanly (F1).
 function studio(repoRoot) {
+  const brief = readBrief(repoRoot);
   const cacheDir = ensureScaffold(repoRoot);
+  stageInputs(repoRoot, cacheDir, brief);
   console.log("reelme: opening Remotion Studio (Ctrl+C to stop)…");
-  const result = spawnSync("pnpm", ["exec", "remotion", "studio"], {
-    cwd: cacheDir,
-    stdio: "inherit",
-  });
+  const result = runShell("pnpm", ["exec", "remotion", "studio"], cacheDir);
   if (result.error) fail(`failed to open Studio: ${result.error.message}`);
 }
 
@@ -41,8 +44,14 @@ switch (command) {
   case "studio":
     studio(repoRoot);
     break;
+  case "validate":
+    // readBrief validates schema, platforms, and every scene, exiting non-zero
+    // with named errors on failure. A cheap pre-render check for the skill.
+    readBrief(repoRoot);
+    console.log("reelme: reelme.json is valid.");
+    break;
   case "clean":
-    cleanCache();
+    cleanCache(repoRoot, process.argv.includes("--all"));
     break;
   case "--help":
   case "-h":

package/src/render.mjs

@@ -2,22 +2,74 @@
 // variant per social platform when the brief has a teaser cut. Outputs land
 // in <repo>/reelme-out/; the heavy Remotion project stays in the cache.
 
-import { cpSync, existsSync, mkdirSync, readFileSync } from "node:fs";
-import { basename, dirname, join } from "node:path";
+import { cpSync, existsSync, mkdirSync, readFileSync, rmSync } from "node:fs";
+import { basename, dirname, join, resolve, relative, isAbsolute } from "node:path";
 import { spawnSync } from "node:child_process";
-import { AUDIO_DIR, ensureScaffold, loadPlatforms, readBrief, fail } from "./cache.mjs";
+import { createRequire } from "node:module";
+import { AUDIO_DIR, ensureScaffold, loadPlatforms, readBrief, runShell, fail } from "./cache.mjs";
+
+const require = createRequire(import.meta.url);
+
+// Reject asset paths that escape their base dir. A reelme.json is authored by an
+// agent and gets committed/shared, so a `../../…` src/logo would otherwise copy
+// (or read) files outside the cache at render time (F11). Guards both the repo
+// source and the cache destination.
+function safeJoin(baseDir, relPath, label) {
+  if (typeof relPath !== "string" || relPath.length === 0 || isAbsolute(relPath)) {
+    fail(`${label} "${relPath}" must be a repo-relative path.`);
+  }
+  const dest = resolve(baseDir, relPath);
+  const rel = relative(baseDir, dest);
+  if (rel.startsWith("..") || isAbsolute(rel)) {
+    fail(`${label} "${relPath}" escapes the project directory — refusing to copy.`);
+  }
+  return dest;
+}
+
+// Resolve the gifsicle binary: prefer the optionalDependency's bundled build,
+// fall back to a system install on PATH. Returns null when neither is present.
+function gifsicleBin() {
+  try {
+    const mod = require("gifsicle");
+    // The package exports the binary path; under Node's require-ESM it arrives
+    // as a namespace ({ default: path }) rather than a bare string.
+    const p = typeof mod === "string" ? mod : mod?.default;
+    if (typeof p === "string" && existsSync(p)) return p;
+  } catch {
+    // optionalDependency not installed — fall through to a PATH lookup.
+  }
+  return "gifsicle";
+}
+
+// Lossy gif pass. Remotion's native gif is already well quantized, but a
+// gifsicle --lossy run roughly halves it again with text left crisp. Our
+// atmosphere gradients band under palette/colour reduction, so we keep the full
+// palette and only apply --lossy. Best-effort: a missing gifsicle is non-fatal.
+function optimizeGif(file) {
+  const res = spawnSync(gifsicleBin(), ["-b", "-O3", "--lossy=60", file], { stdio: "ignore" });
+  if (res.error || res.status !== 0) {
+    console.warn("reelme: note — gif left unoptimized (install gifsicle for ~50% smaller files).");
+  }
+}
 
 function renderComposition(cacheDir, compositionId, outFile, codec) {
   const args = ["exec", "remotion", "render", compositionId, join("out", outFile)];
   // Render gifs at 0.6 scale (e.g. 1920x1080 -> 1152x648): a README gif needs no
   // more, and fewer pixels roughly halves the file size. Layout and timing are
   // unchanged — --scale downscales the output, not the composition coordinates.
-  if (codec === "gif") args.push("--codec=gif", "--scale=0.6");
+  if (codec === "gif") {
+    args.push("--codec=gif", "--scale=0.6");
+  } else {
+    // Remotion's default h264 bitrate is far higher than a social upload needs;
+    // crf 20 is visually lossless and cuts the file to roughly a third.
+    args.push("--crf=20");
+  }
   console.log(`reelme: rendering ${compositionId} → reelme-out/${outFile}`);
-  const result = spawnSync("pnpm", args, { cwd: cacheDir, stdio: "inherit" });
+  const result = runShell("pnpm", args, cacheDir);
   if (result.error || result.status !== 0) {
     fail(`render failed for platform composition "${compositionId}".`);
   }
+  if (codec === "gif") optimizeGif(join(cacheDir, "out", outFile));
 }
 
 function collectAssets(brief) {
@@ -38,14 +90,19 @@ function copyAssets(repoRoot, cacheDir, brief) {
   if (assets.length === 0) return;
   const publicDir = join(cacheDir, "public");
   mkdirSync(publicDir, { recursive: true });
-  const missing = assets.filter((a) => !existsSync(join(repoRoot, a)));
+  // Resolve every path through the traversal guard before touching the disk.
+  const resolved = assets.map((asset) => ({
+    asset,
+    source: safeJoin(repoRoot, asset, "asset"),
+    dest: safeJoin(publicDir, asset, "asset"),
+  }));
+  const missing = resolved.filter(({ source }) => !existsSync(source));
   if (missing.length > 0) {
-    fail(`missing asset file(s):\n${missing.map((a) => `  ${join(repoRoot, a)}`).join("\n")}`);
+    fail(`missing asset file(s):\n${missing.map(({ source }) => `  ${source}`).join("\n")}`);
   }
-  for (const asset of assets) {
-    const dest = join(publicDir, asset);
+  for (const { source, dest } of resolved) {
     mkdirSync(dirname(dest), { recursive: true });
-    cpSync(join(repoRoot, asset), dest);
+    cpSync(source, dest);
   }
 }
 
@@ -89,21 +146,37 @@ function copyAudioTrack(cacheDir, brief) {
   const audioDir = join(cacheDir, "public", "audio");
   mkdirSync(audioDir, { recursive: true });
   cpSync(source, join(audioDir, track));
+
+  // Cut SFX ride along whenever music is enabled (Root.tsx plays them under
+  // scene transitions; audio: false disables both together).
+  const sfxDir = join(AUDIO_DIR, "sfx");
+  if (existsSync(sfxDir)) {
+    cpSync(sfxDir, join(audioDir, "sfx"), { recursive: true });
+  }
 }
 
 function copyLogo(repoRoot, cacheDir, brief) {
   const logo = brief.project?.logo;
   if (!logo) return;
-  const source = join(repoRoot, logo);
+  const source = safeJoin(repoRoot, logo, "project.logo");
   if (!existsSync(source)) {
     fail(`project.logo file not found: ${source}`);
   }
   const publicDir = join(cacheDir, "public");
-  const dest = join(publicDir, logo);
+  const dest = safeJoin(publicDir, logo, "project.logo");
   mkdirSync(dirname(dest), { recursive: true });
   cpSync(source, dest);
 }
 
+// Stage every render input into the cache. Shared by render() and studio() so
+// Studio previews exactly what render() produces (F1) instead of showing 404s
+// for missing assets/audio/logo.
+export function stageInputs(repoRoot, cacheDir, brief) {
+  copyAssets(repoRoot, cacheDir, brief);
+  copyAudioTrack(cacheDir, brief);
+  copyLogo(repoRoot, cacheDir, brief);
+}
+
 export function render(repoRoot) {
   const brief = readBrief(repoRoot);
   const platforms = loadPlatforms();
@@ -111,17 +184,15 @@ export function render(repoRoot) {
   const outDir = join(repoRoot, "reelme-out");
   mkdirSync(outDir, { recursive: true });
 
-  copyAssets(repoRoot, cacheDir, brief);
-  copyAudioTrack(cacheDir, brief);
-  copyLogo(repoRoot, cacheDir, brief);
+  stageInputs(repoRoot, cacheDir, brief);
 
   const verticalFallback = brief.project.platforms.filter(
     (id) => platforms[id].cut === "vertical" && !brief.cuts.vertical?.length
   );
   if (verticalFallback.length > 0) {
     console.warn(
-      `reelme: warning — no cuts.vertical in reelme.json; ${verticalFallback.join(", ")} will render ` +
-        `the main cut letterboxed into 9:16. Author a vertical cut for better results.`
+      `reelme: warning — no cuts.vertical in reelme.json; ${verticalFallback.join(", ")} will re-render ` +
+        `the main cut at 9:16. Dense wide scenes may cramp — author a vertical cut for better results.`
     );
   }
 
@@ -129,7 +200,7 @@ export function render(repoRoot) {
     const preset = platforms[id];
     const outFile = basename(preset.output.file);
     renderComposition(cacheDir, `Reel-${id}`, outFile, preset.output.codec);
-    cpSync(join(cacheDir, "out", outFile), join(outDir, outFile));
+    copyOut(cacheDir, outFile, outDir);
   }
 
   const hasTeaser = Array.isArray(brief.cuts.teaser) && brief.cuts.teaser.length > 0;
@@ -140,9 +211,17 @@ export function render(repoRoot) {
     for (const id of socialIds) {
       const outFile = `${id}-teaser.mp4`;
       renderComposition(cacheDir, `Reel-${id}-teaser`, outFile, "h264");
-      cpSync(join(cacheDir, "out", outFile), join(outDir, outFile));
+      copyOut(cacheDir, outFile, outDir);
     }
   }
 
   console.log(`reelme: done — outputs in ${outDir}`);
 }
+
+// Copy a finished render to reelme-out/, then drop the cache copy so out/ doesn't
+// accumulate every render forever (F16). The deliverable already lives in the repo.
+function copyOut(cacheDir, outFile, outDir) {
+  const cached = join(cacheDir, "out", outFile);
+  cpSync(cached, join(outDir, outFile));
+  rmSync(cached, { force: true });
+}

package/template/package.json

@@ -9,12 +9,14 @@
     "test": "vitest run"
   },
   "dependencies": {
-    "@remotion/cli": "4.0.290",
-    "@remotion/gif": "4.0.290",
-    "@remotion/google-fonts": "4.0.290",
+    "@remotion/cli": "4.0.410",
+    "@remotion/gif": "4.0.410",
+    "@remotion/google-fonts": "4.0.410",
     "chroma-js": "^3.1.2",
     "lucide-react": "^0.511.0",
-    "remotion": "4.0.290"
+    "react": "^18.3.0",
+    "react-dom": "^18.3.0",
+    "remotion": "4.0.410"
   },
   "devDependencies": {
     "@types/chroma-js": "^2.4.4",
@@ -22,8 +24,6 @@
     "@typescript-eslint/eslint-plugin": "^8.0.0",
     "@typescript-eslint/parser": "^8.0.0",
     "eslint": "^9.0.0",
-    "react": "^18.3.0",
-    "react-dom": "^18.3.0",
     "typescript": "^5.4.0",
     "vite": "^7.3.5",
     "vitest": "^4.1.8"