refactor(cli): move templates to templates/ for remote fetching (#161)

* refactor(cli): move templates to examples/ for remote fetching

* refactor(cli): rename examples/ to templates/ for clarity

Follows Remix/Vite convention — these are init scaffolds, not general examples.

scripts/generate-template-previews.ts

@@ -39,7 +39,7 @@ import {
 const scriptDir = dirname(fileURLToPath(import.meta.url));
 const repoRoot = resolve(scriptDir, "..");
 const bundledTemplatesDir = resolve(repoRoot, "packages/cli/src/templates");
-const examplesDir = resolve(repoRoot, "examples");
+const remoteTemplatesDir = resolve(repoRoot, "templates");
 const outputDir = resolve(repoRoot, "docs/images/templates");
 
 if (!process.env.PRODUCER_HYPERFRAME_MANIFEST_PATH) {
@@ -86,7 +86,7 @@ function parseArgs(): { only: string | null; skipVideo: boolean } {
 }
 
 function resolveTemplateDir(templateId: string): string | null {
-  for (const base of [bundledTemplatesDir, examplesDir]) {
+  for (const base of [bundledTemplatesDir, remoteTemplatesDir]) {
     const dir = join(base, templateId);
     if (existsSync(join(dir, "index.html"))) return dir;
   }
@@ -97,7 +97,7 @@ function discoverTemplates(only: string | null): string[] {
   const seen = new Set<string>();
   const all: string[] = [];
 
-  for (const dir of [bundledTemplatesDir, examplesDir]) {
+  for (const dir of [bundledTemplatesDir, remoteTemplatesDir]) {
     if (!existsSync(dir)) continue;
     for (const e of readdirSync(dir, { withFileTypes: true })) {
       if (

templates/templates.json

@@ -0,0 +1,58 @@
+{
+  "templates": [
+    {
+      "id": "blank",
+      "label": "Blank",
+      "hint": "Empty composition — just the scaffolding",
+      "bundled": true
+    },
+    {
+      "id": "warm-grain",
+      "label": "Warm Grain",
+      "hint": "Cream aesthetic with grain texture",
+      "bundled": false
+    },
+    {
+      "id": "play-mode",
+      "label": "Play Mode",
+      "hint": "Playful elastic animations",
+      "bundled": false
+    },
+    {
+      "id": "swiss-grid",
+      "label": "Swiss Grid",
+      "hint": "Structured grid layout",
+      "bundled": false
+    },
+    {
+      "id": "vignelli",
+      "label": "Vignelli",
+      "hint": "Bold typography with red accents",
+      "bundled": false
+    },
+    {
+      "id": "decision-tree",
+      "label": "Decision Tree",
+      "hint": "Animated flowchart with branching paths",
+      "bundled": false
+    },
+    {
+      "id": "kinetic-type",
+      "label": "Kinetic Type",
+      "hint": "Bold kinetic typography promo",
+      "bundled": false
+    },
+    {
+      "id": "product-promo",
+      "label": "Product Promo",
+      "hint": "Multi-scene product showcase with SVG assets",
+      "bundled": false
+    },
+    {
+      "id": "nyt-graph",
+      "label": "NYT Graph",
+      "hint": "Animated data chart in print editorial style",
+      "bundled": false
+    }
+  ]
+}