retiam 1.0.0 → 1.0.1

package/bin/init.js

@@ -1,425 +1,425 @@
-#!/usr/bin/env node
-
-// =========================================================================
-// File: bin/init.js - Retiam Project Starter & Skeleton Generator
-// =========================================================================
-
-import fs from 'fs';
-import path from 'path';
-import readline from 'readline/promises';
-import { spawnSync } from 'child_process';
-
-const args = process.argv.slice(2);
-
-// Check for --help
-const isHelp = args.includes('--help') || args.includes('-h') || args.includes('help');
-if (isHelp) {
-    console.log(`
-🚀 Retiam WebGPU Engine - Project Initializer
-
-Usage:
-  npx retiam init [directory] [options]
-  npx retiam create [directory] [options]
-
-Arguments:
-  [directory]               Destination directory (default: ./retiam-animation)
-
-Options:
-  -n, --name <name>         Project name for package.json (default: directory name)
-  --title <text>            Hero text to display in Hello World scene (default: Hello World)
-  --pm <manager>            Package manager: npm, pnpm, yarn, bun (default: auto-detected or npm)
-  -f, --force               Overwrite destination directory if files already exist
-  -y, --yes                 Skip interactive prompts and use defaults
-  --install                 Automatically install dependencies after generation
-  --git                     Initialize a Git repository (git init)
-  --json                    Output structured machine-readable JSON for agents and CI
-  --help, -h                Show this help message and exit
-
-Examples:
-  npx retiam init
-  npx retiam init my-animation
-  npx retiam create intro-scene --title "Quantum Mechanics" --pm pnpm
-  npx retiam init my-project -y --install
-  npx retiam init agent-project --json --yes
-`);
-    process.exit(0);
-}
-
-// Auto-detect package manager from npm_config_user_agent
-function detectPackageManager() {
-    const userAgent = process.env.npm_config_user_agent || '';
-    if (userAgent.startsWith('pnpm')) return 'pnpm';
-    if (userAgent.startsWith('yarn')) return 'yarn';
-    if (userAgent.startsWith('bun')) return 'bun';
-    return 'npm';
-}
-
-// Parse CLI flags
-let targetDir = null;
-let projectName = null;
-let heroTitle = 'Hello World';
-let packageManager = detectPackageManager();
-let force = false;
-let nonInteractive = false;
-let runInstall = false;
-let initGit = false;
-let jsonOutput = false;
-
-for (let i = 0; i < args.length; i++) {
-    const arg = args[i];
-    if (arg === '--json') {
-        jsonOutput = true;
-        nonInteractive = true;
-    } else if (arg === '-y' || arg === '--yes') {
-        nonInteractive = true;
-    } else if (arg === '-f' || arg === '--force') {
-        force = true;
-    } else if (arg === '--install') {
-        runInstall = true;
-    } else if (arg === '--git') {
-        initGit = true;
-    } else if (arg === '-n' || arg === '--name') {
-        projectName = args[++i];
-    } else if (arg === '--title') {
-        heroTitle = args[++i] || 'Hello World';
-    } else if (arg === '--pm') {
-        packageManager = args[++i] || packageManager;
-    } else if (!arg.startsWith('-') && !targetDir) {
-        targetDir = arg;
-    }
-}
-
-async function main() {
-    // Interactive setup if TTY and not in --yes / --json mode
-    const isTTY = process.stdin.isTTY && !nonInteractive;
-
-    if (isTTY) {
-        const rl = readline.createInterface({
-            input: process.stdin,
-            output: process.stdout
-        });
-
-        try {
-            console.log(`\n✨ Welcome to Retiam - WebGPU Animation Project Generator\n`);
-
-            if (!targetDir) {
-                const inputDir = await rl.question(`📁 Destination directory (./retiam-animation): `);
-                targetDir = inputDir.trim() || 'retiam-animation';
-            }
-
-            const defaultName = path.basename(path.resolve(process.cwd(), targetDir))
-                .toLowerCase()
-                .replace(/[^a-z0-9_-]/g, '-');
-
-            if (!projectName) {
-                const inputName = await rl.question(`📦 Project name (${defaultName}): `);
-                projectName = inputName.trim() || defaultName;
-            }
-
-            const inputTitle = await rl.question(`🎨 Starter animation text (${heroTitle}): `);
-            if (inputTitle.trim()) {
-                heroTitle = inputTitle.trim();
-            }
-
-            const inputPm = await rl.question(`⚡ Package manager [npm/pnpm/yarn/bun] (${packageManager}): `);
-            if (inputPm.trim()) {
-                packageManager = inputPm.trim().toLowerCase();
-            }
-
-            const inputInstall = await rl.question(`📥 Run '${packageManager} install' now? [y/N]: `);
-            if (inputInstall.trim().toLowerCase().startsWith('y')) {
-                runInstall = true;
-            }
-        } finally {
-            rl.close();
-        }
-    }
-
-    if (!targetDir) {
-        targetDir = 'retiam-animation';
-    }
-
-    const resolvedDir = path.resolve(process.cwd(), targetDir);
-    const resolvedName = projectName || path.basename(resolvedDir)
-        .toLowerCase()
-        .replace(/[^a-z0-9_-]/g, '-') || 'retiam-animation';
-
-    // Conflict check
-    if (fs.existsSync(resolvedDir)) {
-        const existingFiles = fs.readdirSync(resolvedDir).filter(f => !f.startsWith('.'));
-        if (existingFiles.length > 0 && !force) {
-            if (jsonOutput) {
-                console.log(JSON.stringify({
-                    status: 'error',
-                    message: `Target directory '${targetDir}' already exists and is not empty. Use -f or --force to overwrite.`
-                }));
-            } else {
-                console.error(`\n❌ Error: Directory '${targetDir}' is not empty (${existingFiles.length} files found).`);
-                console.error(`   Use -f or --force to proceed anyway.\n`);
-            }
-            process.exit(1);
-        }
-    }
-
-    // Ensure directory structure
-    const srcDir = path.join(resolvedDir, 'src');
-    const scenesDir = path.join(srcDir, 'scenes');
-    fs.mkdirSync(scenesDir, { recursive: true });
-
-    // 1. package.json
-    const packageJson = {
-        name: resolvedName,
-        version: '0.1.0',
-        private: true,
-        type: 'module',
-        scripts: {
-            dev: 'vite',
-            build: 'tsc && vite build',
-            preview: 'vite preview',
-            render: 'retiam render src/scenes/HelloWorld.ts'
-        },
-        dependencies: {
-            retiam: '^1.0.0'
-        },
-        devDependencies: {
-            '@webgpu/types': '^0.1.31',
-            typescript: '^5.5.0',
-            vite: '^5.4.0'
-        }
-    };
-
-    // 2. tsconfig.json
-    const tsconfigJson = {
-        compilerOptions: {
-            target: 'ES2022',
-            module: 'ESNext',
-            moduleResolution: 'bundler',
-            lib: ['ES2022', 'DOM', 'DOM.Iterable'],
-            types: ['@webgpu/types', 'vite/client'],
-            strict: true,
-            esModuleInterop: true,
-            skipLibCheck: true,
-            isolatedModules: true
-        },
-        include: ['src']
-    };
-
-    // 3. vite.config.ts
-    const viteConfig = `import { defineConfig } from 'vite';
-
-export default defineConfig({
-  optimizeDeps: {
-    esbuildOptions: {
-      target: 'es2022',
-      supported: {
-        'top-level-await': true
-      }
-    }
-  },
-  esbuild: {
-    target: 'es2022'
-  },
-  server: {
-    port: 3000,
-    open: true
-  }
-});
-`;
-
-    // 4. index.html
-    const indexHtml = `<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>${resolvedName} - Retiam WebGPU Animation</title>
-    <style>
-      * {
-        box-sizing: border-box;
-      }
-      body {
-        margin: 0;
-        overflow: hidden;
-        background-color: #080C14;
-        width: 100vw;
-        height: 100vh;
-      }
-      canvas {
-        display: block;
-        width: 100vw;
-        height: 100vh;
-      }
-    </style>
-  </head>
-  <body>
-    <canvas id="canvas"></canvas>
-    <script type="module" src="/src/main.ts"></script>
-  </body>
-</html>
-`;
-
-    // 5. src/main.ts
-    const mainTs = `import HelloWorldScene from './scenes/HelloWorld';
-
-async function bootstrap() {
-  const canvas = document.getElementById('canvas') as HTMLCanvasElement;
-  if (!canvas) {
-    console.error('Canvas element not found');
-    return;
-  }
-
-  canvas.width = window.innerWidth;
-  canvas.height = window.innerHeight;
-
-  window.addEventListener('resize', () => {
-    canvas.width = window.innerWidth;
-    canvas.height = window.innerHeight;
-  });
-
-  const scene = new HelloWorldScene();
-  await scene.start(canvas);
-}
-
-bootstrap().catch((err) => {
-  console.error('Failed to initialize Retiam animation:', err);
-});
-`;
-
-    // 6. src/scenes/HelloWorld.ts
-    const helloWorldTs = `import { Scene, hex, SDFText, Write } from "retiam";
-
-/**
- * Starter Retiam Scene: Hello World
- * Features a cinematic Write animation over an obsidian dark substrate.
- */
-export default class HelloWorldScene extends Scene {
-    public async run(): Promise<void> {
-        // 1. Setup camera and obsidian canvas
-        this.camera.position.set([0, 0, 14]);
-        this.clearColor(hex("#080C14"));
-
-        // 2. Create the hero typography
-        const text = new SDFText("${heroTitle.replace(/"/g, '\\"')}", { fontSize: 1.1 });
-        text.paint.fill = hex("#38BDF8");
-        text.center();
-
-        // 3. Register entity and frame camera with balanced padding
-        this.add(text);
-        this.camera.frame(text, { padding: 0.3 });
-
-        // 4. Choreographed motion: Write animation
-        await this.play(new Write(text, { duration: 1500 }));
-        await this.wait(2000);
-    }
-}
-`;
-
-    // 7. .gitignore
-    const gitignore = `node_modules
-dist
-outputs
-.DS_Store
-*.local
-`;
-
-    // 8. README.md
-    const readme = `# ${resolvedName}
-
-A cinematic WebGPU mathematical animation built with [Retiam](https://github.com/abhilasbiswas/Retiam).
-
-## 🚀 Quick Start
-
-1. **Install dependencies**:
-   \`\`\`bash
-   ${packageManager} install
-   \`\`\`
-
-2. **Start real-time development server (60-144 FPS)**:
-   \`\`\`bash
-   ${packageManager} run dev
-   \`\`\`
-
-3. **Render broadcast video (MP4/WebM)**:
-   \`\`\`bash
-   ${packageManager} run render
-   \`\`\`
-
-## 📁 Project Structure
-
-- \`src/main.ts\`: Entrypoint mounting the WebGPU canvas.
-- \`src/scenes/HelloWorld.ts\`: Starter scene with hero typography and \`Write\` animation.
-- \`vite.config.ts\`: Real-time WebGPU bundler configuration with hot module reload.
-`;
-
-    // Write all template files
-    fs.writeFileSync(path.join(resolvedDir, 'package.json'), JSON.stringify(packageJson, null, 2) + '\n', 'utf8');
-    fs.writeFileSync(path.join(resolvedDir, 'tsconfig.json'), JSON.stringify(tsconfigJson, null, 2) + '\n', 'utf8');
-    fs.writeFileSync(path.join(resolvedDir, 'vite.config.ts'), viteConfig, 'utf8');
-    fs.writeFileSync(path.join(resolvedDir, 'index.html'), indexHtml, 'utf8');
-    fs.writeFileSync(path.join(resolvedDir, '.gitignore'), gitignore, 'utf8');
-    fs.writeFileSync(path.join(resolvedDir, 'README.md'), readme, 'utf8');
-    fs.writeFileSync(path.join(srcDir, 'main.ts'), mainTs, 'utf8');
-    fs.writeFileSync(path.join(scenesDir, 'HelloWorld.ts'), helloWorldTs, 'utf8');
-
-    const createdFiles = [
-        'package.json',
-        'tsconfig.json',
-        'vite.config.ts',
-        'index.html',
-        '.gitignore',
-        'README.md',
-        'src/main.ts',
-        'src/scenes/HelloWorld.ts'
-    ];
-
-    // Optional git init
-    if (initGit) {
-        try {
-            spawnSync('git', ['init'], { cwd: resolvedDir, stdio: 'ignore' });
-        } catch (_) {}
-    }
-
-    // Optional install
-    if (runInstall) {
-        if (!jsonOutput) {
-            console.log(`\n📦 Installing dependencies with ${packageManager}...`);
-        }
-        try {
-            spawnSync(packageManager, ['install'], { cwd: resolvedDir, stdio: jsonOutput ? 'ignore' : 'inherit' });
-        } catch (err) {
-            if (!jsonOutput) {
-                console.warn(`⚠️ Failed to run '${packageManager} install'. Please run it manually.`);
-            }
-        }
-    }
-
-    if (jsonOutput) {
-        console.log(JSON.stringify({
-            status: 'success',
-            directory: targetDir,
-            absolutePath: resolvedDir,
-            projectName: resolvedName,
-            packageManager,
-            files: createdFiles
-        }, null, 2));
-    } else {
-        console.log(`\n✨ Successfully created Retiam project in '${targetDir}'!\n`);
-        console.log(`Next steps:`);
-        if (path.resolve(process.cwd()) !== resolvedDir) {
-            console.log(`  1. cd ${targetDir}`);
-        }
-        if (!runInstall) {
-            console.log(`  2. ${packageManager} install`);
-            console.log(`  3. ${packageManager} run dev          # Real-time WebGPU preview`);
-            console.log(`  4. ${packageManager} run render       # Export MP4 broadcast video\n`);
-        } else {
-            console.log(`  2. ${packageManager} run dev          # Real-time WebGPU preview`);
-            console.log(`  3. ${packageManager} run render       # Export MP4 broadcast video\n`);
-        }
-    }
-}
-
-main().catch((err) => {
-    console.error('Initialization failed:', err);
-    process.exit(1);
-});
+#!/usr/bin/env node
+
+// =========================================================================
+// File: bin/init.js - Retiam Project Starter & Skeleton Generator
+// =========================================================================
+
+import fs from 'fs';
+import path from 'path';
+import readline from 'readline/promises';
+import { spawnSync } from 'child_process';
+
+const args = process.argv.slice(2);
+
+// Check for --help
+const isHelp = args.includes('--help') || args.includes('-h') || args.includes('help');
+if (isHelp) {
+    console.log(`
+🚀 Retiam WebGPU Engine - Project Initializer
+
+Usage:
+  npx retiam init [directory] [options]
+  npx retiam create [directory] [options]
+
+Arguments:
+  [directory]               Destination directory (default: ./retiam-animation)
+
+Options:
+  -n, --name <name>         Project name for package.json (default: directory name)
+  --title <text>            Hero text to display in Hello World scene (default: Hello World)
+  --pm <manager>            Package manager: npm, pnpm, yarn, bun (default: auto-detected or npm)
+  -f, --force               Overwrite destination directory if files already exist
+  -y, --yes                 Skip interactive prompts and use defaults
+  --install                 Automatically install dependencies after generation
+  --git                     Initialize a Git repository (git init)
+  --json                    Output structured machine-readable JSON for agents and CI
+  --help, -h                Show this help message and exit
+
+Examples:
+  npx retiam init
+  npx retiam init my-animation
+  npx retiam create intro-scene --title "Quantum Mechanics" --pm pnpm
+  npx retiam init my-project -y --install
+  npx retiam init agent-project --json --yes
+`);
+    process.exit(0);
+}
+
+// Auto-detect package manager from npm_config_user_agent
+function detectPackageManager() {
+    const userAgent = process.env.npm_config_user_agent || '';
+    if (userAgent.startsWith('pnpm')) return 'pnpm';
+    if (userAgent.startsWith('yarn')) return 'yarn';
+    if (userAgent.startsWith('bun')) return 'bun';
+    return 'npm';
+}
+
+// Parse CLI flags
+let targetDir = null;
+let projectName = null;
+let heroTitle = 'Hello World';
+let packageManager = detectPackageManager();
+let force = false;
+let nonInteractive = false;
+let runInstall = false;
+let initGit = false;
+let jsonOutput = false;
+
+for (let i = 0; i < args.length; i++) {
+    const arg = args[i];
+    if (arg === '--json') {
+        jsonOutput = true;
+        nonInteractive = true;
+    } else if (arg === '-y' || arg === '--yes') {
+        nonInteractive = true;
+    } else if (arg === '-f' || arg === '--force') {
+        force = true;
+    } else if (arg === '--install') {
+        runInstall = true;
+    } else if (arg === '--git') {
+        initGit = true;
+    } else if (arg === '-n' || arg === '--name') {
+        projectName = args[++i];
+    } else if (arg === '--title') {
+        heroTitle = args[++i] || 'Hello World';
+    } else if (arg === '--pm') {
+        packageManager = args[++i] || packageManager;
+    } else if (!arg.startsWith('-') && !targetDir) {
+        targetDir = arg;
+    }
+}
+
+async function main() {
+    // Interactive setup if TTY and not in --yes / --json mode
+    const isTTY = process.stdin.isTTY && !nonInteractive;
+
+    if (isTTY) {
+        const rl = readline.createInterface({
+            input: process.stdin,
+            output: process.stdout
+        });
+
+        try {
+            console.log(`\n✨ Welcome to Retiam - WebGPU Animation Project Generator\n`);
+
+            if (!targetDir) {
+                const inputDir = await rl.question(`📁 Destination directory (./retiam-animation): `);
+                targetDir = inputDir.trim() || 'retiam-animation';
+            }
+
+            const defaultName = path.basename(path.resolve(process.cwd(), targetDir))
+                .toLowerCase()
+                .replace(/[^a-z0-9_-]/g, '-');
+
+            if (!projectName) {
+                const inputName = await rl.question(`📦 Project name (${defaultName}): `);
+                projectName = inputName.trim() || defaultName;
+            }
+
+            const inputTitle = await rl.question(`🎨 Starter animation text (${heroTitle}): `);
+            if (inputTitle.trim()) {
+                heroTitle = inputTitle.trim();
+            }
+
+            const inputPm = await rl.question(`⚡ Package manager [npm/pnpm/yarn/bun] (${packageManager}): `);
+            if (inputPm.trim()) {
+                packageManager = inputPm.trim().toLowerCase();
+            }
+
+            const inputInstall = await rl.question(`📥 Run '${packageManager} install' now? [y/N]: `);
+            if (inputInstall.trim().toLowerCase().startsWith('y')) {
+                runInstall = true;
+            }
+        } finally {
+            rl.close();
+        }
+    }
+
+    if (!targetDir) {
+        targetDir = 'retiam-animation';
+    }
+
+    const resolvedDir = path.resolve(process.cwd(), targetDir);
+    const resolvedName = projectName || path.basename(resolvedDir)
+        .toLowerCase()
+        .replace(/[^a-z0-9_-]/g, '-') || 'retiam-animation';
+
+    // Conflict check
+    if (fs.existsSync(resolvedDir)) {
+        const existingFiles = fs.readdirSync(resolvedDir).filter(f => !f.startsWith('.'));
+        if (existingFiles.length > 0 && !force) {
+            if (jsonOutput) {
+                console.log(JSON.stringify({
+                    status: 'error',
+                    message: `Target directory '${targetDir}' already exists and is not empty. Use -f or --force to overwrite.`
+                }));
+            } else {
+                console.error(`\n❌ Error: Directory '${targetDir}' is not empty (${existingFiles.length} files found).`);
+                console.error(`   Use -f or --force to proceed anyway.\n`);
+            }
+            process.exit(1);
+        }
+    }
+
+    // Ensure directory structure
+    const srcDir = path.join(resolvedDir, 'src');
+    const scenesDir = path.join(srcDir, 'scenes');
+    fs.mkdirSync(scenesDir, { recursive: true });
+
+    // 1. package.json
+    const packageJson = {
+        name: resolvedName,
+        version: '0.1.0',
+        private: true,
+        type: 'module',
+        scripts: {
+            dev: 'vite',
+            build: 'tsc && vite build',
+            preview: 'vite preview',
+            render: 'retiam render src/scenes/HelloWorld.ts'
+        },
+        dependencies: {
+            retiam: '^1.0.0'
+        },
+        devDependencies: {
+            '@webgpu/types': '^0.1.31',
+            typescript: '^5.5.0',
+            vite: '^5.4.0'
+        }
+    };
+
+    // 2. tsconfig.json
+    const tsconfigJson = {
+        compilerOptions: {
+            target: 'ES2022',
+            module: 'ESNext',
+            moduleResolution: 'bundler',
+            lib: ['ES2022', 'DOM', 'DOM.Iterable'],
+            types: ['@webgpu/types', 'vite/client'],
+            strict: true,
+            esModuleInterop: true,
+            skipLibCheck: true,
+            isolatedModules: true
+        },
+        include: ['src']
+    };
+
+    // 3. vite.config.ts
+    const viteConfig = `import { defineConfig } from 'vite';
+
+export default defineConfig({
+  optimizeDeps: {
+    esbuildOptions: {
+      target: 'es2022',
+      supported: {
+        'top-level-await': true
+      }
+    }
+  },
+  esbuild: {
+    target: 'es2022'
+  },
+  server: {
+    port: 3000,
+    open: true
+  }
+});
+`;
+
+    // 4. index.html
+    const indexHtml = `<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>${resolvedName} - Retiam WebGPU Animation</title>
+    <style>
+      * {
+        box-sizing: border-box;
+      }
+      body {
+        margin: 0;
+        overflow: hidden;
+        background-color: #080C14;
+        width: 100vw;
+        height: 100vh;
+      }
+      canvas {
+        display: block;
+        width: 100vw;
+        height: 100vh;
+      }
+    </style>
+  </head>
+  <body>
+    <canvas id="canvas"></canvas>
+    <script type="module" src="/src/main.ts"></script>
+  </body>
+</html>
+`;
+
+    // 5. src/main.ts
+    const mainTs = `import HelloWorldScene from './scenes/HelloWorld';
+
+async function bootstrap() {
+  const canvas = document.getElementById('canvas') as HTMLCanvasElement;
+  if (!canvas) {
+    console.error('Canvas element not found');
+    return;
+  }
+
+  canvas.width = window.innerWidth;
+  canvas.height = window.innerHeight;
+
+  window.addEventListener('resize', () => {
+    canvas.width = window.innerWidth;
+    canvas.height = window.innerHeight;
+  });
+
+  const scene = new HelloWorldScene();
+  await scene.start(canvas);
+}
+
+bootstrap().catch((err) => {
+  console.error('Failed to initialize Retiam animation:', err);
+});
+`;
+
+    // 6. src/scenes/HelloWorld.ts
+    const helloWorldTs = `import { Scene, hex, SDFText, Write } from "retiam";
+
+/**
+ * Starter Retiam Scene: Hello World
+ * Features a cinematic Write animation over an obsidian dark substrate.
+ */
+export default class HelloWorldScene extends Scene {
+    public async run(): Promise<void> {
+        // 1. Setup camera and obsidian canvas
+        this.camera.position.set([0, 0, 14]);
+        this.clearColor(hex("#080C14"));
+
+        // 2. Create the hero typography
+        const text = new SDFText("${heroTitle.replace(/"/g, '\\"')}", { fontSize: 1.1 });
+        text.paint.fill = hex("#38BDF8");
+        text.center();
+
+        // 3. Register entity and frame camera with balanced padding
+        this.add(text);
+        this.camera.frame(text, { padding: 0.3 });
+
+        // 4. Choreographed motion: Write animation
+        await this.play(new Write(text, { duration: 1500 }));
+        await this.wait(2000);
+    }
+}
+`;
+
+    // 7. .gitignore
+    const gitignore = `node_modules
+dist
+outputs
+.DS_Store
+*.local
+`;
+
+    // 8. README.md
+    const readme = `# ${resolvedName}
+
+A cinematic WebGPU mathematical animation built with [Retiam](https://github.com/abhilasbiswas/Retiam).
+
+## 🚀 Quick Start
+
+1. **Install dependencies**:
+   \`\`\`bash
+   ${packageManager} install
+   \`\`\`
+
+2. **Start real-time development server (60-144 FPS)**:
+   \`\`\`bash
+   ${packageManager} run dev
+   \`\`\`
+
+3. **Render broadcast video (MP4/WebM)**:
+   \`\`\`bash
+   ${packageManager} run render
+   \`\`\`
+
+## 📁 Project Structure
+
+- \`src/main.ts\`: Entrypoint mounting the WebGPU canvas.
+- \`src/scenes/HelloWorld.ts\`: Starter scene with hero typography and \`Write\` animation.
+- \`vite.config.ts\`: Real-time WebGPU bundler configuration with hot module reload.
+`;
+
+    // Write all template files
+    fs.writeFileSync(path.join(resolvedDir, 'package.json'), JSON.stringify(packageJson, null, 2) + '\n', 'utf8');
+    fs.writeFileSync(path.join(resolvedDir, 'tsconfig.json'), JSON.stringify(tsconfigJson, null, 2) + '\n', 'utf8');
+    fs.writeFileSync(path.join(resolvedDir, 'vite.config.ts'), viteConfig, 'utf8');
+    fs.writeFileSync(path.join(resolvedDir, 'index.html'), indexHtml, 'utf8');
+    fs.writeFileSync(path.join(resolvedDir, '.gitignore'), gitignore, 'utf8');
+    fs.writeFileSync(path.join(resolvedDir, 'README.md'), readme, 'utf8');
+    fs.writeFileSync(path.join(srcDir, 'main.ts'), mainTs, 'utf8');
+    fs.writeFileSync(path.join(scenesDir, 'HelloWorld.ts'), helloWorldTs, 'utf8');
+
+    const createdFiles = [
+        'package.json',
+        'tsconfig.json',
+        'vite.config.ts',
+        'index.html',
+        '.gitignore',
+        'README.md',
+        'src/main.ts',
+        'src/scenes/HelloWorld.ts'
+    ];
+
+    // Optional git init
+    if (initGit) {
+        try {
+            spawnSync('git', ['init'], { cwd: resolvedDir, stdio: 'ignore' });
+        } catch (_) {}
+    }
+
+    // Optional install
+    if (runInstall) {
+        if (!jsonOutput) {
+            console.log(`\n📦 Installing dependencies with ${packageManager}...`);
+        }
+        try {
+            spawnSync(packageManager, ['install'], { cwd: resolvedDir, stdio: jsonOutput ? 'ignore' : 'inherit' });
+        } catch (err) {
+            if (!jsonOutput) {
+                console.warn(`⚠️ Failed to run '${packageManager} install'. Please run it manually.`);
+            }
+        }
+    }
+
+    if (jsonOutput) {
+        console.log(JSON.stringify({
+            status: 'success',
+            directory: targetDir,
+            absolutePath: resolvedDir,
+            projectName: resolvedName,
+            packageManager,
+            files: createdFiles
+        }, null, 2));
+    } else {
+        console.log(`\n✨ Successfully created Retiam project in '${targetDir}'!\n`);
+        console.log(`Next steps:`);
+        if (path.resolve(process.cwd()) !== resolvedDir) {
+            console.log(`  1. cd ${targetDir}`);
+        }
+        if (!runInstall) {
+            console.log(`  2. ${packageManager} install`);
+            console.log(`  3. ${packageManager} run dev          # Real-time WebGPU preview`);
+            console.log(`  4. ${packageManager} run render       # Export MP4 broadcast video\n`);
+        } else {
+            console.log(`  2. ${packageManager} run dev          # Real-time WebGPU preview`);
+            console.log(`  3. ${packageManager} run render       # Export MP4 broadcast video\n`);
+        }
+    }
+}
+
+main().catch((err) => {
+    console.error('Initialization failed:', err);
+    process.exit(1);
+});