@dfosco/storyboard 0.6.0-beta.5 → 0.6.0-beta.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dfosco/storyboard",
-  "version": "0.6.0-beta.5",
+  "version": "0.6.0-beta.7",
   "type": "module",
   "license": "MIT",
   "description": "Storyboard prototyping framework — core engine, React integration, and canvas",

package/scaffold/gitignore

@@ -52,8 +52,18 @@ packages/core/dist/storyboard-ui.*
 # Agent Browser
 agent-browser.json
 
-# Selected widgets bridge (real-time canvas selection for Copilot)
-.storyboard
+# Auto-generated scaffold dir (copies of library config defaults — overwritten on every dev-server boot)
+.storyboard/scaffold/
+
+# Real-time canvas selection bridge for Copilot
+.storyboard/.selectedwidgets.json
+
+# Runtime/transient state (per-machine, per-session)
+.storyboard/agent-sessions/
+.storyboard/hot-pool/
+.storyboard/logs/
+.storyboard/terminal-buffers/
+.storyboard/messages/
 
 # Private canvas images (tilde prefix = not committed)
 src/canvas/images/~*

package/src/core/canvas/configReader.js

@@ -0,0 +1,110 @@
+/**
+ * Server-side reader for terminal + agents config.
+ *
+ * Replaces direct `JSON.parse(readFileSync('storyboard.config.json')).canvas.agents`
+ * reads in terminal-server / hot-pool / canvas server / terminal-welcome /
+ * server-plugin so the new `terminal.config.json` (and the library's default
+ * one shipped under `node_modules/@dfosco/storyboard/terminal.config.json`)
+ * is honored everywhere with leaf-level merge.
+ *
+ * Resolution order (lowest → highest priority), all leaf-merged:
+ *   1. Library default `<root>/{packages/storyboard,node_modules/@dfosco/storyboard}/terminal.config.json`
+ *   2. `storyboard.config.json` `canvas.terminal` + `canvas.agents` (legacy)
+ *   3. Root `terminal.config.json`
+ *
+ * Returns `{ terminal, agents, showAgentsInAddMenu }`. Empty objects when
+ * nothing is configured (rather than null) so callers can spread freely.
+ */
+
+import { readFileSync, existsSync } from 'node:fs'
+import { resolve, join } from 'node:path'
+
+/** Same shape as data-plugin's `deepMergeBuild`. */
+function deepMerge(target, source) {
+  if (!source || typeof source !== 'object') return target
+  if (!target || typeof target !== 'object') return source
+  const result = { ...target }
+  for (const key of Object.keys(source)) {
+    const sv = source[key]
+    const tv = target[key]
+    if (sv && typeof sv === 'object' && !Array.isArray(sv) && tv && typeof tv === 'object' && !Array.isArray(tv)) {
+      result[key] = deepMerge(tv, sv)
+    } else {
+      result[key] = sv
+    }
+  }
+  return result
+}
+
+function readJson(filePath) {
+  try {
+    return JSON.parse(readFileSync(filePath, 'utf8'))
+  } catch {
+    return null
+  }
+}
+
+function resolveLibTerminalConfig(root) {
+  const candidates = [
+    join(root, 'packages', 'storyboard', 'terminal.config.json'),
+    join(root, 'node_modules', '@dfosco', 'storyboard', 'terminal.config.json'),
+  ]
+  for (const p of candidates) {
+    if (existsSync(p)) {
+      const parsed = readJson(p)
+      if (parsed) return parsed
+    }
+  }
+  return null
+}
+
+/**
+ * Read the merged terminal + agents + hotPool config for a project root.
+ *
+ * @param {string} [root] - Project root, defaults to `process.cwd()`.
+ * @returns {{ terminal: object, agents: object, showAgentsInAddMenu: boolean|undefined, hotPool: object }}
+ */
+export function readTerminalConfigMerged(root = process.cwd()) {
+  const lib = resolveLibTerminalConfig(root) || {}
+  const sb = readJson(resolve(root, 'storyboard.config.json')) || {}
+  const userTerminal = readJson(resolve(root, 'terminal.config.json')) || {}
+
+  const sbCanvas = sb.canvas || {}
+  const sbLayer = {
+    ...(sbCanvas.terminal ? { terminal: sbCanvas.terminal } : {}),
+    ...(sbCanvas.agents ? { agents: sbCanvas.agents } : {}),
+    ...(sbCanvas.showAgentsInAddMenu !== undefined
+      ? { showAgentsInAddMenu: sbCanvas.showAgentsInAddMenu }
+      : {}),
+    ...(sb.hotPool ? { hotPool: sb.hotPool } : {}),
+  }
+
+  const merged = deepMerge(deepMerge(lib, sbLayer), userTerminal)
+  return {
+    terminal: merged.terminal || {},
+    agents: merged.agents || {},
+    showAgentsInAddMenu: merged.showAgentsInAddMenu,
+    hotPool: merged.hotPool || {},
+  }
+}
+
+/**
+ * Convenience: just the agents map.
+ */
+export function readAgentsConfig(root = process.cwd()) {
+  return readTerminalConfigMerged(root).agents
+}
+
+/**
+ * Convenience: just the terminal-widget settings.
+ */
+export function readTerminalSettings(root = process.cwd()) {
+  return readTerminalConfigMerged(root).terminal
+}
+
+/**
+ * Convenience: just the hotPool config.
+ */
+export function readHotPoolConfig(root = process.cwd()) {
+  return readTerminalConfigMerged(root).hotPool
+}

package/src/core/canvas/hot-pool.js

@@ -25,7 +25,7 @@
  * Scale-down: After cooldown minutes with no acquisitions, the pool scales
  *             back to pool_size by killing excess warm sessions.
  *
- * ## Configuration (storyboard.config.json → hotPool)
+ * ## Configuration (terminal.config.json → hotPool, or storyboard.config.json → hotPool for legacy back-compat)
  *
  *   hotPool.enabled         — enable/disable all pools (default: true)
  *   hotPool.verbose         — log to Vite terminal (default: false)

package/src/core/canvas/server.js

@@ -52,6 +52,7 @@ import { markCanvasWrite, unmarkCanvasWrite } from './writeGuard.js'
 import { devLog } from '../logger/devLogger.js'
 import widgetsConfig from '../../../widgets.config.json' with { type: 'json' }
 import { listHubRoles, getDefaultRoleId } from './hub-roles.js'
+import { readAgentsConfig } from './configReader.js'
 
 /**
  * Read the prompt widget's execution config from widgets.config.json.
@@ -713,9 +714,7 @@ export function createCanvasHandler(ctx) {
     // For agent widgets, resolve startupCommand from canvas.agents config if not provided
     if (type === 'agent' && props.agentId && !props.startupCommand) {
       try {
-        const configPath = path.join(root, 'storyboard.config.json')
-        const config = JSON.parse(fs.readFileSync(configPath, 'utf-8'))
-        const agentCfg = config?.canvas?.agents?.[props.agentId]
+        const agentCfg = readAgentsConfig(root)?.[props.agentId]
         if (agentCfg?.startupCommand) {
           props.startupCommand = agentCfg.startupCommand
         }
@@ -725,9 +724,7 @@ export function createCanvasHandler(ctx) {
     // For agent widgets without agentId, default to the first canvas.agents entry
     if (type === 'agent' && !props.agentId) {
       try {
-        const configPath = path.join(root, 'storyboard.config.json')
-        const config = JSON.parse(fs.readFileSync(configPath, 'utf-8'))
-        const agents = config?.canvas?.agents || {}
+        const agents = readAgentsConfig(root) || {}
         const defaultEntry = Object.entries(agents).find(([, cfg]) => cfg.default) || Object.entries(agents)[0]
         if (defaultEntry) {
           const [id, cfg] = defaultEntry
@@ -3106,15 +3103,16 @@ export function Default() {
         // Write env file for this terminal session — sourced before copilot launch
         // This avoids race conditions with tmux send-keys export
         const envFile = path.join(root, '.storyboard', 'terminals', `${tmuxName}.env`)
-        const envContent = Object.entries(envMap).map(([k, v]) => `export ${k}=${JSON.stringify(v)}`).join('\n') + '\n'
+        // Trailing echo is the readiness signal the post-startup poller
+        // matches against. Don't drop it — without it /allow-all and the
+        // identity/role/broadcast bind wait the full 30s timeout fallback.
+        const envContent = Object.entries(envMap).map(([k, v]) => `export ${k}=${JSON.stringify(v)}`).join('\n') + '\necho "Environment loaded:"\n'
         fsModule.writeFileSync(envFile, envContent)
 
         // Resolve agent config from storyboard.config.json
         let agentConfig = null
         try {
-          const configPath = path.join(root, 'storyboard.config.json')
-          const config = JSON.parse(fs.readFileSync(configPath, 'utf-8'))
-          const agents = config?.canvas?.agents || {}
+          const agents = readAgentsConfig(root) || {}
           if (agentId && agents[agentId]) {
             agentConfig = agents[agentId]
           } else {

package/src/core/canvas/terminal-server.js

@@ -158,15 +158,11 @@ function cleanEnv() {
   return filtered
 }
 
-/** Read terminal config from storyboard.config.json */
+import { readTerminalSettings, readAgentsConfig } from './configReader.js'
+
+/** Read terminal-widget settings (merged from lib defaults + storyboard.config.json + terminal.config.json). */
 function readTerminalConfig() {
-  try {
-    const raw = readFileSync(resolve(process.cwd(), 'storyboard.config.json'), 'utf8')
-    const config = JSON.parse(raw)
-    return config?.canvas?.terminal ?? {}
-  } catch {
-    return {}
-  }
+  return readTerminalSettings()
 }
 
 /**
@@ -175,22 +171,19 @@ function readTerminalConfig() {
  */
 function resolveAgentConfig(startupCommand) {
   if (!startupCommand || startupCommand === 'shell') return null
-  try {
-    const raw = readFileSync(resolve(process.cwd(), 'storyboard.config.json'), 'utf8')
-    const agentsConfig = JSON.parse(raw)?.canvas?.agents
-    if (!agentsConfig || typeof agentsConfig !== 'object') return null
-    for (const [id, cfg] of Object.entries(agentsConfig)) {
-      if (!cfg?.startupCommand) continue
-      // Prefer exact/prefix match for deterministic routing; keep binary fallback for backwards compat.
-      if (
-        startupCommand === cfg.startupCommand
-        || startupCommand.startsWith(`${cfg.startupCommand} `)
-        || startupCommand.startsWith(cfg.startupCommand.split(' ')[0])
-      ) {
-        return { id, cfg }
-      }
+  const agentsConfig = readAgentsConfig()
+  if (!agentsConfig || typeof agentsConfig !== 'object') return null
+  for (const [id, cfg] of Object.entries(agentsConfig)) {
+    if (!cfg?.startupCommand) continue
+    // Prefer exact/prefix match for deterministic routing; keep binary fallback for backwards compat.
+    if (
+      startupCommand === cfg.startupCommand
+      || startupCommand.startsWith(`${cfg.startupCommand} `)
+      || startupCommand.startsWith(cfg.startupCommand.split(' ')[0])
+    ) {
+      return { id, cfg }
     }
-  } catch { /* empty */ }
+  }
   return null
 }
 
@@ -1107,8 +1100,7 @@ function handleConnection(ws, widgetId, canvasId, prettyName, widgetStartupComma
 
         // Agent shorthand scripts (copilot, claude, codex, etc.)
         try {
-          const raw = readFileSync(resolve(process.cwd(), 'storyboard.config.json'), 'utf8')
-          const agentsConfig = JSON.parse(raw)?.canvas?.agents
+          const agentsConfig = readAgentsConfig()
           if (agentsConfig && typeof agentsConfig === 'object') {
             for (const [id, cfg] of Object.entries(agentsConfig)) {
               if (!cfg.startupCommand) continue
@@ -1138,8 +1130,7 @@ function handleConnection(ws, widgetId, canvasId, prettyName, widgetStartupComma
           `start() { if [ $# -eq 0 ]; then ${welcomeBase}; else ${welcomeBase} --startup "$*"; fi; }`,
         ]
         try {
-          const raw = readFileSync(resolve(process.cwd(), 'storyboard.config.json'), 'utf8')
-          const agentsConfig = JSON.parse(raw)?.canvas?.agents
+          const agentsConfig = readAgentsConfig()
           if (agentsConfig && typeof agentsConfig === 'object') {
             for (const [id, cfg] of Object.entries(agentsConfig)) {
               if (!cfg.startupCommand) continue
@@ -1246,17 +1237,27 @@ function handleConnection(ws, widgetId, canvasId, prettyName, widgetStartupComma
         const binDir = join(cwd, '.storyboard', 'terminals', 'bin')
         envParts.push(`export PATH="${binDir}:$PATH"`)
 
-        // Chain clear before exports so the typed env soup is wiped from
-        // view as soon as Enter executes, then chain clear again after so
-        // the agent starts on a clean screen.
-        let envExports = envParts.join(' && ')
-        if (startupCommand) {
-          envExports = `clear && ${envExports} && clear`
-        }
+        // Write env exports to a per-widget shell script and source it via a
+        // short send-keys. Avoids tmux send-keys -l truncation when the env
+        // soup (especially PATH expansion) gets large — observed: a 4 KB+
+        // chain stops mid-line on macOS, the agent command never runs.
+        const envScriptDir = join(cwd, '.storyboard', 'terminals')
+        try { mkdirSync(envScriptDir, { recursive: true }) } catch { /* empty */ }
+        const envScriptPath = join(envScriptDir, `${widgetId}.env.sh`)
+        try {
+          // Trailing echo is the readiness signal the post-startup poller
+          // looks for. Without it, the 30s timeout fallback fires before
+          // /allow-all, identity, role/broadcast bind are sent — making
+          // the agent feel "stuck" for the first half-minute after launch.
+          writeFileSync(envScriptPath, envParts.join('\n') + '\necho "Environment loaded:"\n')
+        } catch { /* empty */ }
+        const envSourceCmd = startupCommand
+          ? `clear && source ${JSON.stringify(envScriptPath)} && clear`
+          : `source ${JSON.stringify(envScriptPath)}`
 
         setTimeout(() => {
           try {
-            execSync(`tmux send-keys -t "${tmuxName}" -l ${JSON.stringify(envExports)}`, { stdio: 'ignore' })
+            execSync(`tmux send-keys -t "${tmuxName}" -l ${JSON.stringify(envSourceCmd)}`, { stdio: 'ignore' })
             execSync(`tmux send-keys -t "${tmuxName}" Enter`, { stdio: 'ignore' })
           } catch { /* empty */ }
         }, 300)

package/src/core/cli/dev.js

@@ -21,6 +21,21 @@ import { detectWorktreeName, getPort, releasePort } from '../worktree/port.js'
 import { startRenameWatcher } from '../rename-watcher/watcher.js'
 import { compactAll } from '../canvas/compact.js'
 import { parseFlags } from './flags.js'
+import { setupNeeded, writeUserState, getInstalledStoryboardVersion } from './userState.js'
+import { dim, magenta, bold } from './intro.js'
+
+/** Render the storyboard mascot with two info lines beside it. */
+function mascotBanner(line1, line2) {
+  const d = dim('·')
+  const f = magenta
+  const b = dim
+  return [
+    `        ${b('╭─────────────────╮')}`,
+    `        ${b('│')}  ${d}  ${f('◠')}  ${f('◡')}  ${f('◠')}  ${d}  ${b('│')}  ${line1}`,
+    `        ${b('│')}  ${d}  ${d}  ${d}  ${d}  ${d}  ${b('│')}  ${line2}`,
+    `        ${b('╰─────────────────╯')}`,
+  ].join('\n')
+}
 
 const flagSchema = {
   port: { type: 'number', description: 'Override dev server port' },
@@ -55,6 +70,34 @@ async function main() {
   p.intro('storyboard dev')
   p.log.info(`worktree: ${worktreeName}`)
 
+  // Re-run setup automatically if it has never run here, or if the installed
+  // @dfosco/storyboard version no longer matches the one setup was last run
+  // against. This lets `npm install` upgrades trigger fresh scaffolding
+  // without requiring `npx storyboard update`.
+  {
+    const need = setupNeeded(targetCwd)
+    if (need) {
+      const why = need.reason === 'first-run'
+        ? 'first run in this repo'
+        : `version changed ${need.from} → ${need.to}`
+      p.log.info(`Running setup (${why})…`)
+      await new Promise((resolveSetup) => {
+        const setupChild = spawn(
+          process.platform === 'win32' ? 'npx.cmd' : 'npx',
+          ['storyboard', 'setup', '--skip-branch'],
+          { cwd: targetCwd, stdio: 'inherit' }
+        )
+        setupChild.on('exit', () => resolveSetup())
+        setupChild.on('error', () => resolveSetup())
+      })
+      // Belt-and-suspenders: even if setup failed to write the marker,
+      // stamp the current version so dev doesn't loop forever asking to run
+      // setup on every boot.
+      const version = getInstalledStoryboardVersion(targetCwd)
+      if (version) writeUserState({ setupVersion: version, setupRanAt: new Date().toISOString() }, targetCwd)
+    }
+  }
+
   // Compact bloated canvas JSONL files before booting Vite.
   const compacted = compactAll(targetCwd)
   for (const r of compacted) {
@@ -78,15 +121,23 @@ async function main() {
   const viteArgs = ['vite', '--port', String(port)]
   if (strictPort) viteArgs.push('--strictPort')
   if (strictPort) p.log.info(`port ${port} (strict — from storyboard.config.json)`)
+
+  // Render the storyboard mascot just before Vite takes over stdio. The
+  // mascot acts as a visual anchor between our setup output and Vite's
+  // own "ready in Xms" banner.
+  console.log()
+  console.log(mascotBanner(
+    bold(`http://localhost:${port}/storyboard/`),
+    dim('Stop with Ctrl+C'),
+  ))
+  console.log()
+
   const child = spawn(npmBin, viteArgs, {
     cwd: targetCwd,
     stdio: 'inherit',
     env: { ...process.env, STORYBOARD_WORKTREE: worktreeName },
   })
 
-  p.log.success(`http://localhost:${port}/storyboard/`)
-  p.log.info('Stop with Ctrl+C')
-
   function shutdown() {
     clearInterval(compactInterval)
     renameWatcher.close()

package/src/core/cli/setup.js

@@ -12,9 +12,10 @@
 import * as p from '@clack/prompts'
 import { existsSync, writeFileSync, readFileSync, mkdirSync, readdirSync, symlinkSync } from 'fs'
 import path from 'path'
-import { execSync } from 'child_process'
+import { execSync, spawn } from 'child_process'
 import { gettingStartedLines, dim, magenta, bold, yellow, green } from './intro.js'
 import { parseFlags } from './flags.js'
+import { readUserState, writeUserState, getInstalledStoryboardVersion } from './userState.js'
 
 const flagSchema = {
   'skip-branch': { type: 'boolean', default: false, description: 'Skip the branch prompt at the end' },
@@ -43,7 +44,8 @@ if (flags.nuke) {
 
 /**
  * Run a potentially slow task with a spinner that only appears after 500ms.
- * If the task completes quickly, shows the done message immediately.
+ * IMPORTANT: `fn` must be async (don't use execSync — it blocks the event loop
+ * and prevents the spinner from animating).
  */
 async function withSpin(label, doneMsg, fn) {
   const spin = p.spinner()
@@ -59,6 +61,54 @@ async function withSpin(label, doneMsg, fn) {
   }
 }
 
+/**
+ * Async command runner — does NOT block the event loop, so spinners animate.
+ */
+function runAsync(cmd, args = [], opts = {}) {
+  return new Promise((resolve, reject) => {
+    const child = spawn(cmd, args, { stdio: 'ignore', ...opts })
+    child.on('error', reject)
+    child.on('exit', (code) => {
+      if (code === 0) resolve()
+      else reject(new Error(`${cmd} exited with code ${code}`))
+    })
+  })
+}
+
+/**
+ * Install a brew package with an animated spinner.
+ */
+async function brewInstall(pkg, label) {
+  const spin = p.spinner()
+  spin.start(`Installing ${label}`)
+  try {
+    await runAsync('brew', ['install', pkg])
+    spin.stop(`${label} installed`)
+    return true
+  } catch {
+    spin.stop(`Failed to install ${label}`)
+    p.log.warning(`Install manually: brew install ${pkg}`)
+    return false
+  }
+}
+
+/**
+ * Quick network probe — alerts the user if GitHub looks unreachable.
+ * We don't block on failure; downstream installers will surface their own errors.
+ */
+async function checkNetwork() {
+  const http = await import('node:https')
+  return new Promise((resolve) => {
+    const req = http.request('https://api.github.com', { method: 'HEAD', timeout: 4000 }, (res) => {
+      resolve(res.statusCode != null && res.statusCode < 500)
+      res.resume()
+    })
+    req.on('error', () => resolve(false))
+    req.on('timeout', () => { req.destroy(); resolve(false) })
+    req.end()
+  })
+}
+
 function mascot() {
   const d = dim('·')
   const f = magenta
@@ -87,13 +137,20 @@ function isInstalled(cmd) {
 
 p.intro('storyboard setup')
 
-// 1. Check for node_modules (quick sanity check — full install runs at the end)
-if (!existsSync('node_modules')) {
-  p.log.info('node_modules not found — will install at end of setup')
-} else {
-  p.log.success('Dependencies present')
+// 0. Network probe — alert if GitHub is unreachable; don't block.
+{
+  const online = await checkNetwork()
+  if (!online) {
+    p.log.warning('Network looks offline — installers/downloads may fail')
+    p.log.info(dim('  Tried HEAD https://api.github.com; check VPN/proxy/DNS'))
+  } else {
+    p.log.success('Network reachable')
+  }
 }
 
+// Node is assumed to be present (you already ran `npx storyboard setup`).
+// node_modules will be installed at the end if missing.
+
 // 2. Homebrew
 let hasBrew = isInstalled('brew')
 if (!hasBrew) {
@@ -121,35 +178,43 @@ if (hasBrew) {
   if (isInstalled('git')) {
     p.log.success('Git installed')
   } else {
-    const gitSpin = p.spinner()
-    gitSpin.start('Installing Git')
-    try {
-      run('brew install git')
-      gitSpin.stop('Git installed')
-    } catch {
-      gitSpin.stop('Failed to install Git')
-      p.log.warning('Install manually: brew install git')
-    }
+    await brewInstall('git', 'Git')
   }
 }
 
 // 4. Caddy is no longer used. Worktrees run their own Vite directly on
-//    `http://localhost:<port>/storyboard/`. The block below intentionally
-//    skips the previous Caddy install + start steps.
+//    `http://localhost:<port>/storyboard/`.
 
 if (hasBrew) {
-  // 5. GitHub CLI
+  // 5. GitHub CLI — required for `gh auth`, `gh pr`, `gh issue` in agents.
+  let ghNewlyInstalled = false
   if (isInstalled('gh')) {
     p.log.success('GitHub CLI installed')
   } else {
-    const ghSpin = p.spinner()
-    ghSpin.start('Installing GitHub CLI')
+    ghNewlyInstalled = await brewInstall('gh', 'GitHub CLI')
+  }
+
+  // 5a. tmux (required for headless agent sessions)
+  if (isInstalled('tmux')) {
+    p.log.success('tmux installed')
+  } else {
+    await brewInstall('tmux', 'tmux')
+  }
+
+  // 5b. Surface gh auth status. Even if gh was already installed, we should
+  //     prompt the user to log in — agents that shell out to `gh` will fail
+  //     silently otherwise.
+  if (isInstalled('gh')) {
+    let authed = false
     try {
-      run('brew install gh')
-      ghSpin.stop('GitHub CLI installed')
-    } catch {
-      ghSpin.stop('Failed to install GitHub CLI')
-      p.log.warning('Install manually: brew install gh')
+      execSync('gh auth status', { stdio: 'ignore' })
+      authed = true
+    } catch { /* not authed */ }
+    if (authed) {
+      p.log.success('GitHub CLI authenticated')
+    } else {
+      p.log.warning(ghNewlyInstalled ? 'GitHub CLI installed but not logged in' : 'GitHub CLI is not logged in')
+      p.log.info(`  Run ${yellow('gh auth login')} to authenticate`)
     }
   }
 }
@@ -195,25 +260,102 @@ if (isInstalled('code')) {
   }
 }
 
-// 6a. Copilot CLI
-if (isInstalled('copilot')) {
-  p.log.success('Copilot CLI installed')
-} else {
-  const copilotSpin = p.spinner()
-  copilotSpin.start('Installing Copilot CLI')
-  try {
-    run('curl -fsSL https://gh.io/copilot-install | bash')
-    // Add ~/.local/bin to PATH if not already there
+// 6a. Coding agents (Copilot CLI / Claude Code / Codex CLI).
+//     On first-time setup, ask the user which agents they want installed.
+//     On subsequent runs, only install the previously-opted-in agents that
+//     went missing — never re-prompt to avoid being annoying after upgrades.
+{
+  const priorState = readUserState()
+  const priorAgents = priorState.agents || null
+  const firstRun = !priorState.setupVersion
+
+  const ensureLocalBinOnPath = () => {
     const localBin = `${process.env.HOME}/.local/bin`
     if (!process.env.PATH.includes(localBin)) {
       process.env.PATH = `${localBin}:${process.env.PATH}`
     }
-    copilotSpin.stop('Copilot CLI installed')
-    p.log.info(dim('  Note: You may need to restart your terminal or add ~/.local/bin to PATH'))
-  } catch {
-    copilotSpin.stop('Failed to install Copilot CLI')
-    p.log.warning('Install manually: curl -fsSL https://gh.io/copilot-install | bash')
   }
+
+  const installers = {
+    copilot: {
+      label: 'Copilot CLI',
+      bin: 'copilot',
+      install: async () => {
+        await runAsync('bash', ['-c', 'curl -fsSL https://gh.io/copilot-install | bash'])
+        ensureLocalBinOnPath()
+      },
+      manualHint: 'curl -fsSL https://gh.io/copilot-install | bash',
+      authHint: `Auth is separate from gh — run ${yellow('copilot')} then ${yellow('/login')}`,
+    },
+    claude: {
+      label: 'Claude Code',
+      bin: 'claude',
+      install: async () => {
+        await runAsync('bash', ['-c', 'curl -fsSL https://claude.ai/install.sh | bash'])
+        ensureLocalBinOnPath()
+      },
+      manualHint: 'curl -fsSL https://claude.ai/install.sh | bash',
+      authHint: `Run ${yellow('claude')} once to authenticate`,
+    },
+    codex: {
+      label: 'Codex CLI',
+      bin: 'codex',
+      install: async () => {
+        await runAsync('npm', ['install', '-g', '@openai/codex'])
+      },
+      manualHint: 'npm i -g @openai/codex',
+      authHint: `Run ${yellow('codex login')} to authenticate`,
+    },
+  }
+
+  let chosen
+  if (firstRun) {
+    const selection = await p.multiselect({
+      message: 'Which coding agents do you want installed?',
+      options: [
+        { value: 'copilot', label: 'Copilot CLI', hint: 'recommended' },
+        { value: 'claude', label: 'Claude Code' },
+        { value: 'codex', label: 'Codex CLI' },
+      ],
+      initialValues: ['copilot'],
+      required: false,
+    })
+    if (p.isCancel(selection)) {
+      chosen = { copilot: true, claude: false, codex: false }
+    } else {
+      chosen = Object.fromEntries(Object.keys(installers).map((k) => [k, selection.includes(k)]))
+    }
+  } else {
+    // Returning user — install only what they previously opted into and is
+    // currently missing. If we have no record (older setup), default to
+    // re-installing copilot only when missing.
+    chosen = priorAgents || { copilot: true, claude: false, codex: false }
+  }
+
+  for (const [key, agent] of Object.entries(installers)) {
+    if (!chosen[key]) continue
+    if (isInstalled(agent.bin)) {
+      p.log.success(`${agent.label} installed`)
+      p.log.info(`  ${agent.authHint}`)
+      continue
+    }
+    const spin = p.spinner()
+    spin.start(`Installing ${agent.label}`)
+    try {
+      await agent.install()
+      spin.stop(`${agent.label} installed`)
+      if (!isInstalled(agent.bin)) {
+        p.log.warning(`${agent.bin} not on PATH — add ${yellow('export PATH="$HOME/.local/bin:$PATH"')} to your shell rc`)
+      }
+      p.log.info(`  ${agent.authHint}`)
+    } catch {
+      spin.stop(`Failed to install ${agent.label}`)
+      p.log.warning(`Install manually: ${agent.manualHint}`)
+    }
+  }
+
+  // Persist the choice so future setups know what to keep installed.
+  writeUserState({ agents: chosen })
 }
 
 // 8. Git hooks
@@ -283,6 +425,8 @@ if (isInstalled('copilot')) {
     'src/canvas/~*/',
     'src/prototypes/~*/',
     'src/prototypes/**/~*.{flow,object,record,prototype,folder}.json',
+    // Per-user local state (setup version marker, agent prefs, future onboarding state)
+    '.storyboard/.user.json',
   ]
   if (existsSync(gitignorePath)) {
     try {
@@ -352,18 +496,26 @@ if (isInstalled('copilot')) {
 
 // 10. Install / sync dependencies
 {
+  const installSpin = p.spinner()
+  installSpin.start('Installing dependencies')
   try {
-    await withSpin(
-      'Installing dependencies...',
-      'Dependencies installed',
-      () => { run('npm install', { stdio: 'ignore' }) }
-    )
+    await runAsync('npm', ['install'])
+    installSpin.stop('Dependencies installed')
   } catch {
-    p.log.warning('npm install failed — run it manually to see details')
+    installSpin.stop('npm install failed')
+    p.log.warning('Run it manually to see details:')
     p.log.info(`  ${dim('npm install')}`)
   }
 }
 
+// 11. Stamp the user-state marker so `npm run dev` knows setup is fresh
+//     and won't re-run it until the storyboard package version changes.
+{
+  const version = getInstalledStoryboardVersion() || 'unknown'
+  writeUserState({ setupVersion: version, setupRanAt: new Date().toISOString() })
+  p.log.success(`Setup marker written (.storyboard/.user.json @ ${version})`)
+}
+
 p.note(
   [
     ...gettingStartedLines(),

package/src/core/cli/terminal-welcome.js

@@ -17,11 +17,12 @@
 
 import * as p from '@clack/prompts'
 import { execSync, spawn } from 'node:child_process'
-import { readFileSync, existsSync } from 'node:fs'
-import { resolve, join } from 'node:path'
+import { existsSync } from 'node:fs'
+import { join } from 'node:path'
 import { parseFlags } from './flags.js'
 import { dim, bold } from './intro.js'
 import { takePendingMessages } from '../canvas/terminal-config.js'
+import { readAgentsConfig } from '../canvas/configReader.js'
 
 const blue = (s) => `\x1b[34m${s}\x1b[0m`
 const yellow = (s) => `\x1b[33m${s}\x1b[0m`
@@ -76,14 +77,12 @@ function agentEnv() {
 }
 
 /**
- * Read agents config from storyboard.config.json.
+ * Read agents config (lib defaults + storyboard.config.json + terminal.config.json merged).
  * Returns an array of { id, label, startupCommand, resumeCommand } entries.
  */
 function loadAgents() {
   try {
-    const raw = readFileSync(resolve(process.cwd(), 'storyboard.config.json'), 'utf8')
-    const config = JSON.parse(raw)
-    const agents = config?.canvas?.agents
+    const agents = readAgentsConfig()
     if (!agents || typeof agents !== 'object') return []
     return Object.entries(agents).map(([id, cfg]) => ({
       id,

package/src/core/cli/userState.js

@@ -0,0 +1,63 @@
+/**
+ * userState — Per-user local state for the current repo, stored in
+ * `.storyboard/.user.json` (gitignored).
+ *
+ * This is a free-form key/value bag for things that should persist across
+ * runs but never be committed:
+ *   - setupVersion   (string) — @dfosco/storyboard version setup was last
+ *     run against. Compared against the installed version on `npm run dev`
+ *     to decide whether scaffolding needs to re-run.
+ *   - setupRanAt     (ISO date) — last setup timestamp.
+ *   - agents         (object) — per-agent opt-in flags from the
+ *     first-run install prompt (copilot/claude/codex booleans).
+ *   - … future:        onboarded, username, lastSeenChangelog, etc.
+ */
+
+import { existsSync, readFileSync, writeFileSync, mkdirSync } from 'node:fs'
+import { resolve, dirname } from 'node:path'
+
+const FILE = '.storyboard/.user.json'
+
+export function userStatePath(cwd = process.cwd()) {
+  return resolve(cwd, FILE)
+}
+
+export function readUserState(cwd = process.cwd()) {
+  const file = userStatePath(cwd)
+  if (!existsSync(file)) return {}
+  try { return JSON.parse(readFileSync(file, 'utf8')) } catch { return {} }
+}
+
+export function writeUserState(patch, cwd = process.cwd()) {
+  const file = userStatePath(cwd)
+  const dir = dirname(file)
+  if (!existsSync(dir)) mkdirSync(dir, { recursive: true })
+  const next = { ...readUserState(cwd), ...patch }
+  writeFileSync(file, JSON.stringify(next, null, 2) + '\n', 'utf8')
+  return next
+}
+
+/**
+ * Read the installed @dfosco/storyboard package version, or null if not
+ * resolvable (e.g. running from a worktree without node_modules).
+ */
+export function getInstalledStoryboardVersion(cwd = process.cwd()) {
+  try {
+    const pkgPath = resolve(cwd, 'node_modules', '@dfosco', 'storyboard', 'package.json')
+    return JSON.parse(readFileSync(pkgPath, 'utf8')).version || null
+  } catch { return null }
+}
+
+/**
+ * Decide whether `storyboard setup` should run before `dev`.
+ * Returns null when up-to-date, or { reason, ... } otherwise.
+ */
+export function setupNeeded(cwd = process.cwd()) {
+  const state = readUserState(cwd)
+  const current = getInstalledStoryboardVersion(cwd)
+  if (!state.setupVersion) return { reason: 'first-run', current }
+  if (current && state.setupVersion !== current) {
+    return { reason: 'version-changed', from: state.setupVersion, to: current }
+  }
+  return null
+}

package/src/core/vite/server-plugin.js

@@ -19,6 +19,7 @@ import { serverFeatures as workshopFeatures } from '../workshop/features/registr
 import { docsHandler, collectFiles } from './docs-handler.js'
 import { createCanvasHandler } from '../canvas/server.js'
 import { setupSelectedWidgets } from '../canvas/selectedWidgets.js'
+import { readAgentsConfig, readHotPoolConfig } from '../canvas/configReader.js'
 import { HotPoolManager } from '../canvas/hot-pool.js'
 import { createAutosyncHandler } from '../autosync/server.js'
 import { setupTerminalServer } from '../canvas/terminal-server.js'
@@ -279,8 +280,8 @@ export default function storyboardServer() {
       routeHandlers.set('docs', docsHandler({ root, sendJson: sendJsonLogged }))
 
       // Create shared hot pool manager (per-type pre-warmed sessions)
-      const hotPoolConfig = config.hotPool || {}
-      const agentsConfig = config.canvas?.agents || {}
+      const hotPoolConfig = readHotPoolConfig(root)
+      const agentsConfig = readAgentsConfig(root)
       const wsSend = server.ws.send.bind(server.ws)
       const hotPool = new HotPoolManager({ root, config: hotPoolConfig, agentsConfig, wsSend })
       hotPool.start().catch((err) => {

package/terminal.config.json

@@ -44,5 +44,20 @@
       "resizable": true
     }
   },
-  "showAgentsInAddMenu": false
+  "showAgentsInAddMenu": false,
+  "hotPool": {
+    "enabled": true,
+    "verbose": false,
+    "default_pool_size": 1,
+    "default_max_pool_size": 3,
+    "load_balancer": true,
+    "load_balancer_cooldown_mins": 10,
+    "pools": {
+      "terminal": { "pool_size": 1 },
+      "copilot": { "pool_size": 1, "webgl_ready_slots": 1 },
+      "claude": { "pool_size": 1, "webgl_ready_slots": 1 },
+      "codex": { "pool_size": 0 },
+      "prompt": { "pool_size": 1, "webgl_ready_slots": 1 }
+    }
+  }
 }