spectoflow 0.20.1 → 0.21.1

package/README.md

@@ -16,17 +16,49 @@
   <a href="./LICENSE"><img src="https://img.shields.io/badge/license-MIT-blue" alt="MIT license"></a>
 </p>
 
+<p align="center">
+  <img src="https://raw.githubusercontent.com/georgesmomo/spectoflow/main/docs/screenshot-board.png" alt="spectoflow dashboard — Board overview" width="880">
+</p>
+
 An **agent-agnostic** spec-driven development framework with a **real-time local control plane**.
 You speak in plain language; the framework classifies your intent and runs the right workflow. No
 ceremonial command to start.
 
-**Works with whichever coding agent you have** — Claude Code, Codex, Cursor, Gemini CLI, OpenCode,
-Kiro CLI, Antigravity, and Kimi CLI are auto-detected at `init`. The dashboard's topbar always shows
-the **active agent**, front and center, with a switcher: pick another and it's verified as genuinely
-installed before activating (a red **"No agent found"** if none is) — it never silently activates
-something that isn't there. (Kimi CLI doesn't yet ship a non-interactive run mode, so spectoflow can
-set it as active but won't try to spawn it — the agent pickers that launch a run grey it out rather
-than hide it.)
+**Works with whichever coding agent you have.** `init` auto-detects what's installed; the dashboard's
+topbar always shows the **active agent**, front and center, with a switcher — pick another and it's
+verified as genuinely installed before activating (a red **"No agent found"** if none is), never
+silently activating something that isn't there.
+
+> Note the terminology: "agent" is overloaded here on purpose, matching how the ecosystem uses the
+> word. The table below is about **coding-agent CLIs** — the tool you already run in your terminal
+> (Claude Code, Copilot CLI, …). spectoflow's own **team personas** (developer, qa-engineer, …) are a
+> different, unrelated use of "agent" — see [Agents vs skills](#agents-vs-skills) further down.
+
+## Supported coding agents
+
+| Coding agent | Headless run | Docs |
+|---|---|---|
+| Claude Code | ✓ | [code.claude.com/docs/en/cli-reference](https://code.claude.com/docs/en/cli-reference) |
+| Codex | ✓ | [developers.openai.com/codex/cli/reference](https://developers.openai.com/codex/cli/reference) |
+| Cursor CLI | ✓ | [cursor.com/docs/cli/overview](https://cursor.com/docs/cli/overview) |
+| Gemini CLI | ✓ | [github.com/google-gemini/gemini-cli](https://github.com/google-gemini/gemini-cli) |
+| OpenCode | ✓ | [opencode.ai/docs/cli](https://opencode.ai/docs/cli/) |
+| Kiro CLI | ✓ | [kiro.dev/docs/cli/headless](https://kiro.dev/docs/cli/headless/) |
+| Antigravity | ✓ | [antigravity.google/docs/cli/headless](https://antigravity.google/docs/cli/headless/) |
+| GitHub Copilot CLI | ✓ | [docs.github.com/copilot/…/about-copilot-cli](https://docs.github.com/copilot/concepts/agents/about-copilot-cli) |
+| Amazon Q Developer CLI | ✓ | [docs.aws.amazon.com/amazonq/…/command-line-chat](https://docs.aws.amazon.com/amazonq/latest/qdeveloper-ug/command-line-chat.html) |
+| Factory Droid CLI | ✓ | [docs.factory.ai/droid-exec/overview](https://docs.factory.ai/droid-exec/overview) |
+| Auggie CLI (Augment Code) | ✓ | [docs.augmentcode.com/cli/overview](https://docs.augmentcode.com/cli/overview) |
+| Goose CLI (Block) | ✓ | [block.github.io/goose](https://block.github.io/goose/) |
+| Kimi CLI | detectable, manual only | [github.com/MoonshotAI/kimi-cli](https://github.com/MoonshotAI/kimi-cli) |
+
+"Headless run" means spectoflow can actually spawn it non-interactively (`Run`/`Orchestrate`/
+`Summarize` work). Kimi CLI has no confirmed one-shot mode as of this writing — spectoflow still
+detects it and lets you set it as the active agent, it just won't try to spawn it (the pickers that
+launch a run grey it out rather than hide it); drive it yourself in its own terminal meanwhile. The
+same live table, with your own install status, is in the dashboard's **Documentation** tab. Missing
+one you use? `config.json → runners` still takes any custom command by hand — see
+[`templates/README.md`](templates/README.md) — or open an issue.
 
 ## Install
 
@@ -75,8 +107,8 @@ spectoflow --help      (-h)                    show help   (append -h to any com
   `.claude/commands/spectoflow.md`.
 - `.spectoflow/runtime.json` is gitignored (volatile execution state).
 
-`init` **auto-detects your installed agent(s)** (probes PATH for `claude`, `codex`, `cursor-agent`,
-`gemini`, and existing `.claude`/`.codex`/… dirs): it writes shims for each, sets the active agent in
+`init` **auto-detects your installed agent(s)** (probes PATH for each of the 13 supported CLIs above,
+and existing `.claude`/`.codex`/… dirs): it writes shims for each, sets the active agent in
 `config.json`, and seeds the runner commands. Override with `--agent=claude,codex`; if nothing is
 detected it falls back to claude + codex.
 
@@ -140,52 +172,72 @@ spectoflow dashboard                     # → http://localhost:4319 (or --port=
 
 `spectoflow dashboard` is the simple way — it prints the URL and won't double-start (it detects a
 dashboard already running on the port). `spectoflow status` tells you whether one is up. Running the
-`server.js` directly still works for a manual/embedded setup. Zero dependencies, updates live via SSE +
-file watching. Eight tabs behind a dense icon-tab header (brand logo · subtitle · a slim
-global-progress meter · a sync dot · a **Run** quick-action · a **settings** gear): **Board** (the
-control-room Overview — KPI cards, a status donut, a **scope-vs-delivered area curve**, a
-workflow-at-a-glance strip, per-phase progress bars, filter chips + search — plus the phase board),
-**Requests** (tasks awaiting you — `to_validate`/`to_analyze`), **Attention** (points the agent raised
-via a `::spectoflow attention msg=…` sentinel or that you noted — edit/resolve/delete, or **validate →
-task**), **Backlog** (a flat sortable/filterable, paginated table of every task, defaulting to open
-work), **Workflow** (the pipeline as step cards — click one to enable/disable it, which edits
-`workflow.md`), **Agents & Skills** (enriched cards that open a full-body markdown drawer), **Chat** (a
-full-height group-chat panel), and **Info** (a project-at-a-glance summary). URLs are real routes
-(`/board`, `/backlog/T-012`, …). Charts are zero-dep, hand-rolled SVG in `dashboard/public/charts.js`
-(donut/area/bars/ring, animated, `prefers-reduced-motion`-aware), and every aggregate is computed
-client-side.
-
-**Designs & theme.** The dashboard ships **switchable designs** (Settings → *Dashboard design*):
-**Control Room** (violet), **Obsidian Ops** (near-black lime/cyan, mono), **Neon Command**
-(glassmorphism aurora), and **Mission Control** (indigo control panel). Each works in light and dark
-(the moon toggle). A design is a `data-design`
-skin — a scoped CSS token block plus a one-line entry in `dashboard/public/designs.js`, so adding one
-is trivial. Fonts are **self-hosted** (`dashboard/public/fonts/*.woff2`), keeping the dashboard fully
-offline and dependency-free. Your choice persists per viewer (localStorage) and as the project
-default (`config.design`).
-
-A floating **💬 chat widget** (bottom-right, redesigned) and the **Chat** tab render the same
-`runtime.messages` log via a shared `renderChatLog()`, so they never drift. A running agent identifies
-itself by printing `::spectoflow role=… kind=… msg=…` sentinels, which become labelled messages
-(analyst / developer / qa …); other output streams raw. The board refreshes live as it edits plans.
-Either surface can also **Orchestrate** the enabled workflow: each step runs its agent, gated by mode
-+ policy. The Chat tab can also **Summarize** the recent log into one digest (via the active agent)
-or **Clear** it outright, when it's grown long. The Agents & Skills drawer is served by the one
-read-only endpoint, `GET /api/agentfile?path=` (scoped to `.spectoflow/agents/**` +
-`.spectoflow/skills/**`, path-traversal-safe) — the framework's only other server surface is
-unchanged.
-
-**Customize.** Settings → **Customize** lets you extend the project's own spectoflow install: add a
+`server.js` directly still works for a manual/embedded setup. Zero dependencies, updates live via SSE
++ file watching.
+
+The header bar always shows the brand, the **active agent**, autonomy mode, language, a global-progress
+meter, a sync dot, and a **Run** quick-action. Ten tabs:
+
+- **Board** — the control-room Overview (compact KPI cards, a status donut, a **scope-vs-delivered
+  area curve**, a workflow-at-a-glance strip, per-phase progress bars, filter chips + search) plus the
+  phase board.
+- **Chat** — a full-height group-chat panel with **Summarize** / **Clear**.
+- **Requests** — tasks awaiting you (`to_validate` / `to_analyze`).
+- **Attention** — points the agent raised (a `::spectoflow attention msg=…` sentinel) or that you
+  noted yourself — edit / resolve / delete, or **validate → task**.
+- **Backlog** — a flat sortable/filterable, paginated table of every task, defaulting to open work.
+- **Workflow** — the pipeline as step cards; click one to enable/disable it, which edits `workflow.md`.
+- **Agents & Skills** — enriched cards that open a full-body markdown drawer.
+- **Info** — a project-at-a-glance summary.
+- **Documentation** — the live supported-agents table (your own install status + links) plus the CLI
+  command reference.
+- **Personalize** — autonomy mode, language, design, the active agent, and **Extend spectoflow** (see
+  *Customize* below).
+
+URLs are real routes (`/board`, `/backlog/T-012`, …). Charts are zero-dep, hand-rolled SVG in
+`dashboard/public/charts.js` (donut/area/bars/ring, animated, `prefers-reduced-motion`-aware), and
+every aggregate is computed client-side.
+
+### Designs & theme
+
+The dashboard ships **switchable designs** (Personalize → *Dashboard design*): **Spectral Console**
+(dark-first, ⌘K palette — the default), **Orbit** (light, circular radial menu), **Control Room**
+(violet), **Obsidian Ops** (near-black lime/cyan, mono), **Neon Command** (glassmorphism aurora), and
+**Mission Control** (indigo control panel). Each works in light and dark (the moon toggle). A design
+is a `data-design` skin — a scoped CSS token block plus a one-line entry in
+`dashboard/public/designs.js`, so adding one is trivial. Fonts are **self-hosted**
+(`dashboard/public/fonts/*.woff2`), keeping the dashboard fully offline and dependency-free. Your
+choice persists per viewer (localStorage) and as the project default (`config.design`).
+
+### Chat
+
+A floating **💬 chat widget** and the **Chat** tab render the same `runtime.messages` log via a shared
+`renderChatLog()`, so they never drift. A running agent identifies itself by printing `::spectoflow
+role=… kind=… msg=…` sentinels, which become labelled messages (analyst / developer / qa …); other
+output streams raw. The board refreshes live as it edits plans. Either surface can also
+**Orchestrate** the enabled workflow (each step runs its agent, gated by mode + policy), **Summarize**
+the recent log into one digest via the active agent, or **Clear** it outright. The Agents & Skills
+drawer is served by the one read-only endpoint, `GET /api/agentfile?path=` (scoped to
+`.spectoflow/agents/**` + `.spectoflow/skills/**`, path-traversal-safe) — the framework's only other
+server surface is unchanged.
+
+### Customize
+
+Personalize → **Extend spectoflow** lets you extend the project's own spectoflow install: add a
 dashboard, a skill, or an agent by describing what you want (or hit **Auto** to have the agent survey
-the project and propose candidates), and it clarifies first if the ask is ambiguous. Dashboards are
-never raw HTML — they're a small **declarative block spec** (`markdown`, `kpi-row`, `chart-bars`,
-`chart-donut`, `table`, `list`, `stat-tile-row`) rendered by the same components the built-in Board
-uses, so a generated dashboard automatically matches whatever design is active, in both themes, and
-keeps matching if you switch designs later. Blocks can bind live to project stats (`bind:
-"phases.0.pct"`) or hold a static value. Generated skills and agents follow the same gold-standard
-shape as the shipped ones, cite real domain standards (OWASP, WCAG, C4/ADR, …) instead of generic
-advice, and are marked `origin: user-generated` so they're easy to tell apart in the UI. The same
-generators are available from the terminal:
+the project and propose candidates) — it clarifies first if the ask is ambiguous.
+
+- Dashboards are never raw HTML — they're a small **declarative block spec** (`markdown`, `kpi-row`,
+  `chart-bars`, `chart-donut`, `table`, `list`, `stat-tile-row`) rendered by the same components the
+  built-in Board uses, so a generated dashboard automatically matches whatever design is active, in
+  both themes, and keeps matching if you switch designs later. Blocks can bind live to project stats
+  (`bind: "phases.0.pct"`) or hold a static value.
+- Generated skills and agents follow the same gold-standard shape as the shipped ones, cite real
+  domain standards (OWASP, WCAG, C4/ADR, …) instead of generic advice, and are marked `origin:
+  user-generated` so they're easy to tell apart in the UI.
+
+The same generators are available from the terminal — each streams the agent's run live and exits
+with its status, the same pipeline the dashboard's Generate/Auto buttons use:
 
 ```bash
 spectoflow skill create "reviews PRs for accessibility"      # or: --auto to propose candidates
@@ -193,9 +245,6 @@ spectoflow agent create "owns accessibility review"          # or: --auto
 spectoflow dashboard create "a KPI overview for support"     # or: --auto
 ```
 
-Each streams the agent's run live and exits with its status — the same pipeline the dashboard's
-Generate/Auto buttons use, just from a shell.
-
 ## Agents vs skills
 
 Agents (`.spectoflow/agents/`) are **stable team personas** (Product Manager, Developer, QA Engineer…).
@@ -205,25 +254,38 @@ runs a skill. Improve a skill without touching the agent.
 Agents and skills follow real domain standards, cited in-file — TDD, OWASP ASVS/Top 10, C4/ADR,
 INVEST, Playwright E2E, Conventional Commits, and more — not generic one-liners.
 
-**Clarify before acting.** spectoflow is an **expert analyst, not an order-taker**. When a request is
-vague ("login displays badly, users can't sign in"), an always-on **Clarify reflex** — in the agent's
-memory (`AGENTS.md`) and backed by the `clarify` skill — reflects it back and asks **one targeted
-question at a time**, each with a recommendation anchored in the project's goals and best practices,
-until the need is crisp; then it runs the normal workflow. It's additive: it feeds the router, never
-replaces it, and it's mode-aware.
-
-**End-to-end tests run headed, in the real browser, by default.** `write-e2e-tests` defaults to
-**Playwright lib, `--headed`** for its own local runs — the browser window is visible so a flow that
-"passes" for the wrong reason gets caught, not just a bare pass/fail line. `--ui` mode is used for
-authoring a flow or chasing a failure interactively. It only steps down — to headless, then
-**Playwright MCP**, then the client's native browser tooling (e.g. Claude Code's Chrome extension), then
-writing the spec and raising a `need` — when you asked for something else or headed genuinely can't
-launch, and it **always says why** via the `::spectoflow` sentinel, never a silent switch. CI keeps
-running the committed suite headless — that's the pipeline's job, not a fallback. `init` idempotently
-wires a `playwright` entry into the target project's `.mcp.json` (and `.cursor/mcp.json` for Cursor) so
-the MCP rung works out of the box — `npx` fetches the server on first use, so spectoflow stays zero-dep
-(the config lives in *your* project). The durable artifact is always the committed `*.spec.ts`; the
-Workflow tab's End-to-end step shows this policy in its dashboard popover.
+### Clarify before acting
+
+spectoflow is an **expert analyst, not an order-taker**. When a request is vague ("login displays
+badly, users can't sign in"), an always-on **Clarify reflex** — in the agent's memory (`AGENTS.md`)
+and backed by the `clarify` skill — reflects it back and asks **one targeted question at a time**,
+each with a recommendation anchored in the project's goals and best practices, until the need is
+crisp; then it runs the normal workflow. It's additive: it feeds the router, never replaces it, and
+it's mode-aware.
+
+### End-to-end tests run headed, in the real browser, by default
+
+`write-e2e-tests` defaults to **Playwright lib, `--headed`** for its own local runs — the browser
+window is visible so a flow that "passes" for the wrong reason gets caught, not just a bare pass/fail
+line. `--ui` mode is used for authoring a flow or chasing a failure interactively. It only steps down
+when you asked for something else or headed genuinely can't launch — and it **always says why** via
+the `::spectoflow` sentinel, never a silent switch:
+
+1. Playwright lib, headed (default)
+2. `--ui` (interactive authoring/debugging)
+3. Playwright lib, headless
+4. **Playwright MCP**
+5. the client's native browser tooling (e.g. Claude Code's Chrome extension)
+6. write the spec and raise a `need`
+
+CI keeps running the committed suite headless — that's the pipeline's job, not a fallback. `init`
+idempotently wires a `playwright` entry into the target project's `.mcp.json` (and
+`.cursor/mcp.json` for Cursor) so the MCP rung works out of the box — `npx` fetches the server on
+first use, so spectoflow stays zero-dep (the config lives in *your* project). The durable artifact is
+always the committed `*.spec.ts`; the Workflow tab's End-to-end step shows this policy in its
+dashboard popover.
+
+### Keeping spec and code honest
 
 A `governance` capability adds a **Spec Source Guardian** (skill `audit-source`): it keeps the spec
 (intent) and the code/tests (reality) coherent — flagging drift in both directions, never auto-fixing,
@@ -233,12 +295,30 @@ drift helper (`lib/spec-drift.js`) and an opt-in Claude Code `Stop` hook (`hooks
 ## Language
 
 `.spectoflow/config.json` → `language` (default `en`, incl. code comments). Switchable from the CLI
-(`config.json`) or the dashboard's **settings** gear (mode + language).
+(`config.json`), the dashboard's **Personalize** tab, or the topbar's language select directly.
 
 ## Studied, not copied
 
-Structure informed by spec-kit, OpenSpec (markdown + per-agent adapters), and BMAD (agent-personas).
-spectoflow keeps the good ideas, removes the ceremony, and adds a real-time control plane.
+spectoflow's design was informed by three open-source projects worth knowing about in their own
+right — credit where it's due:
+
+- **[GitHub spec-kit](https://github.com/github/spec-kit)** — the spec-driven workflow itself
+  (spec → plan → tasks) and its own multi-agent integration list, which shaped how spectoflow thinks
+  about agent-agnosticism.
+- **[OpenSpec](https://github.com/Fission-AI/OpenSpec)** by Fission AI — markdown as the source of
+  truth and the per-agent adapter pattern (a thin native entry file per coding agent, pointing back
+  to one canonical brain) that `lib/adapters.js` is built on.
+- **[BMAD-METHOD](https://github.com/bmad-code-org/BMAD-METHOD)** — stable, named agent personas
+  (PM, Architect, Developer, QA, …) as the right way to give an AI coding agent a consistent role,
+  rather than one undifferentiated prompt.
+
+spectoflow keeps what worked, drops the ceremony each of those needs from you, and adds what none of
+them had: a real-time local dashboard (board, chat, live agent-run tracking) and a genuinely
+exhaustive, individually-verified agent-CLI compatibility list — see [Supported coding
+agents](#supported-coding-agents) above.
+
+If you use spec-kit, OpenSpec, or BMAD-METHOD today, spectoflow is worth a look; if you're evaluating
+spectoflow, those three are worth a look too.
 
 ## License & author
 

package/bin/spectoflow.js

@@ -474,10 +474,12 @@ ${c.dim('Docs:')} https://github.com/georgesmomo/spectoflow`);
 const HELP = {
   init: `${c.bold('spectoflow init')} ${c.dim('[dir] [--agent=a,b]')}\n
   Scaffold spectoflow into <dir> (default: current directory).
-  Auto-detects installed agents (${c.dim('claude, codex, cursor, gemini')}) and writes their entry
-  shims; override with ${c.g('--agent=claude,codex')}. Also wires ${c.bold('Playwright MCP')} into the
-  project's ${c.dim('.mcp.json')} (idempotent — never touches an existing entry).
-  ${c.dim('An existing CLAUDE.md is preserved as CLAUDE.md.tomerge for you to merge on first run.')}`,
+  Auto-detects installed agents (${c.dim('claude, codex, cursor, gemini, opencode, kiro, antigravity,')}
+  ${c.dim('copilot, amazon-q, droid, auggie, goose, kimi')}) and writes their entry shims; override
+  with ${c.g('--agent=claude,codex')}. Also wires ${c.bold('Playwright MCP')} into the project's
+  ${c.dim('.mcp.json')} (idempotent — never touches an existing entry).
+  ${c.dim('An existing CLAUDE.md is preserved as CLAUDE.md.tomerge for you to merge on first run.')}
+  ${c.dim('Full list with docs links: the dashboard\'s Documentation tab, or the README.')}`,
   update: `${c.bold('spectoflow update')} ${c.dim('[--dry-run] [--force|-f]')}\n
   Refresh framework-owned files (engine, dashboard, default agents & skills, AGENTS.md, policy…)
   to this CLI's version, ${c.bold('preserving your work')}: config.json, workflow.md, specs/, plans/

package/lib/adapters.js

@@ -68,6 +68,10 @@ Argument: \`$ARGUMENTS\`
 
 // Priority order = which agent becomes the default when several are detected.
 //
+// `docsUrl` points at that agent's own official CLI docs — cited from the research pass that set
+// `runner`/`headless`, never guessed; it's surfaced verbatim in the dashboard's Documentation tab so
+// "which agent is this and where do I read about it" has a real answer, not just an id.
+//
 // `headless: false` marks an agent spectoflow can DETECT and let you set as active, but never spawn
 // itself — no confirmed non-interactive one-shot mode (prompt as trailing arg → stdout → exit) as of
 // this research pass, so `runner` is null on purpose (a fabricated command would just fail silently
@@ -75,6 +79,16 @@ Argument: \`$ARGUMENTS\`
 // for it, rather than hiding it — you can drive it yourself in its own terminal meanwhile, and
 // `config.json → runners` is still yours to hand-wire a command into if one ships later.
 //
+// A runner string with more than one flag deliberately puts the trailing prompt right after whichever
+// flag takes a value (e.g. `copilot -s --allow-all-tools -p`, not `copilot -p --allow-all-tools`) —
+// runner.js spawns `[...parts.slice(1), prompt]`, appending the prompt as the LAST token, so a
+// value-taking flag must be the last one in the string or the prompt lands on the wrong flag.
+//
+// Researched against both github.com/Fission-AI/OpenSpec/blob/main/docs/supported-tools.md and
+// github.github.io/spec-kit/reference/integrations.html (broad agent-compatibility lists) — those
+// pages document IDE/slash-command integration, not headless CLI support, so every entry below was
+// independently verified against that tool's own primary docs regardless of appearing there.
+//
 // Left out of KNOWN_AGENTS entirely (not even headless:false) — researched, not re-added on a whim:
 // DeepSeek Harness (deepseek-ai/deepseek-harness). It has no single installable binary to detect —
 // it's invoked as `npx @deepseek-ai/dsh <subcommand>`, is explicitly a local WEB-APP framework (not a
@@ -85,63 +99,127 @@ Argument: \`$ARGUMENTS\`
 const REGISTRY = [
   {
     id: 'claude',
+    label: 'Claude Code',
     entries: [
       { path: 'CLAUDE.md', content: CLAUDE_MD },
       { path: '.claude/commands/spectoflow.md', content: SLASH_CMD },
     ],
     runner: 'claude -p --permission-mode acceptEdits',
     headless: true,
+    docsUrl: 'https://code.claude.com/docs/en/cli-reference',
     detect: { bin: 'claude', dirs: ['.claude'] },
   },
   {
     id: 'codex',
+    label: 'Codex',
     entries: [{ path: 'AGENTS.md', content: ROOT_AGENTS_MD }],
     runner: 'codex exec',
     headless: true,
+    docsUrl: 'https://developers.openai.com/codex/cli/reference',
     detect: { bin: 'codex', dirs: ['.codex'] },
   },
   {
     id: 'cursor',
+    label: 'Cursor',
     entries: [{ path: 'AGENTS.md', content: ROOT_AGENTS_MD }],
     runner: 'cursor-agent -p',
     headless: true,
+    docsUrl: 'https://cursor.com/docs/cli/overview',
     detect: { bin: 'cursor-agent', dirs: ['.cursor'] },
   },
   {
     id: 'gemini',
+    label: 'Gemini CLI',
     entries: [{ path: 'GEMINI.md', content: GEMINI_MD }],
     runner: 'gemini -p',
     headless: true,
+    docsUrl: 'https://github.com/google-gemini/gemini-cli',
     detect: { bin: 'gemini', dirs: ['.gemini'] },
   },
   {
     id: 'opencode',
+    label: 'OpenCode',
     entries: [{ path: 'AGENTS.md', content: ROOT_AGENTS_MD }],
     runner: 'opencode run --quiet',
     headless: true,
+    docsUrl: 'https://opencode.ai/docs/cli/',
     detect: { bin: 'opencode', dirs: ['.opencode'] },
   },
   {
     id: 'kiro',
+    label: 'Kiro CLI',
     entries: [{ path: 'AGENTS.md', content: ROOT_AGENTS_MD }],
     runner: 'kiro-cli chat --no-interactive --trust-all-tools',
     headless: true,
+    docsUrl: 'https://kiro.dev/docs/cli/headless/',
     detect: { bin: 'kiro-cli', dirs: ['.kiro'] },
   },
   {
     id: 'antigravity',
+    label: 'Antigravity',
     entries: [{ path: 'AGENTS.md', content: ROOT_AGENTS_MD }],
     runner: 'agy -p',
     headless: true,
-    detect: { bin: 'agy' },
+    docsUrl: 'https://antigravity.google/docs/cli/headless/',
+    detect: { bin: 'agy', dirs: [] },
   },
   {
     id: 'kimi',
+    label: 'Kimi CLI',
     entries: [{ path: 'AGENTS.md', content: ROOT_AGENTS_MD }],
     runner: null, // no confirmed non-interactive one-shot mode — see the note above REGISTRY
     headless: false,
+    docsUrl: 'https://github.com/MoonshotAI/kimi-cli',
     detect: { bin: 'kimi', dirs: [] },
   },
+  {
+    id: 'copilot',
+    label: 'GitHub Copilot CLI',
+    entries: [{ path: 'AGENTS.md', content: ROOT_AGENTS_MD }], // also reads CLAUDE.md/GEMINI.md and its own .github/copilot-instructions.md natively
+    runner: 'copilot -s --allow-all-tools -p',
+    headless: true,
+    docsUrl: 'https://docs.github.com/copilot/concepts/agents/about-copilot-cli',
+    // No detect.dirs on purpose: `.github/` is common on any project with GitHub Actions, whether or
+    // not Copilot CLI is set up — using it as a signal would falsely mark Copilot "installed" on
+    // countless unrelated projects. PATH detection (the bin) only.
+    detect: { bin: 'copilot', dirs: [] },
+  },
+  {
+    id: 'amazon-q',
+    label: 'Amazon Q Developer CLI',
+    entries: [{ path: 'AGENTS.md', content: ROOT_AGENTS_MD }], // NOT confirmed native — Q wires memory via `.amazonq/rules/**/*.md` referenced in its own agent config; this pointer is a harmless, forward-compatible default in the meantime
+    runner: 'q chat --no-interactive --trust-all-tools',
+    headless: true,
+    docsUrl: 'https://docs.aws.amazon.com/amazonq/latest/qdeveloper-ug/command-line-chat.html',
+    detect: { bin: 'q', dirs: ['.amazonq'] },
+  },
+  {
+    id: 'droid',
+    label: 'Factory Droid CLI',
+    entries: [{ path: 'AGENTS.md', content: ROOT_AGENTS_MD }],
+    runner: 'droid exec',
+    headless: true,
+    docsUrl: 'https://docs.factory.ai/droid-exec/overview',
+    detect: { bin: 'droid', dirs: ['.factory'] },
+  },
+  {
+    id: 'auggie',
+    label: 'Auggie CLI',
+    entries: [{ path: 'AGENTS.md', content: ROOT_AGENTS_MD }],
+    runner: 'auggie --quiet --print',
+    headless: true,
+    docsUrl: 'https://docs.augmentcode.com/cli/overview',
+    detect: { bin: 'auggie', dirs: ['.augment'] },
+  },
+  {
+    id: 'goose',
+    label: 'Goose CLI',
+    entries: [{ path: 'AGENTS.md', content: ROOT_AGENTS_MD }], // memory-file convention not confirmed AGENTS.md-native — same harmless-default treatment as amazon-q
+    runner: 'goose run -t',
+    headless: true,
+    docsUrl: 'https://block.github.io/goose/',
+    detect: { bin: 'goose', dirs: ['.goose'] },
+  },
 ];
 
 const byId = (id) => REGISTRY.find((a) => a.id === id);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "spectoflow",
-  "version": "0.20.1",
+  "version": "0.21.1",
   "description": "Agent-agnostic spec-driven development framework + real-time local control plane. Markdown artifacts, intent router, workflow-by-scope.",
   "keywords": [
     "spec-driven-development",

package/templates/README.md

@@ -28,6 +28,8 @@ sit at the project root and just point back here.
   ```
 - **See what you got:** `spectoflow list` (agents, skills & workflow at a glance), or `spectoflow
   agents` / `spectoflow skills` / `spectoflow workflow`. Append `-h` to any command for its help.
+  (These "agents" are spectoflow's own team personas below, not the coding-agent CLI you're typing
+  into — see the dashboard's **Documentation** tab for which coding-agent CLIs spectoflow can drive.)
 - **Change how it runs** in the dashboard's **Personalize** tab (the **active agent**, always shown
   in the topbar too — switching is verified against what's actually installed before it activates —
   plus autonomy mode, output language, and the dashboard **design**), or by editing `config.json`.

package/templates/dashboard/public/app.js

@@ -151,7 +151,7 @@ function render(){
   if(meter) meter.title=`${t('kpi.globalProgress')}: ${s.pct}% (${s.done}/${s.total} ${t('kpi.tasksLabel')})`;
   renderOverview(); renderBoard(); renderBacklog(); renderWorkflow(); renderTeam();
   renderChatLog($('#chatLog')); renderChatLog($('#chatTabLog'));
-  renderSidebar(); renderRequests(); renderAttention(); renderInfo(); renderSettings();
+  renderSidebar(); renderRequests(); renderAttention(); renderInfo(); renderDocs(); renderSettings();
   renderCustomDashboards(); // adds/removes nav tabs + panels before applyActiveTab() below reads them
   applyActiveTab(); // re-apply the current tab so an SSE-driven re-render never resets to Board
   applyI18nStatic(); // re-translate the static markup (nav, headers, placeholders…) for this tick's language
@@ -264,7 +264,7 @@ function renderOverview(){
 
   // KPI row
   const kpis=el('div','kpi-row');
-  kpis.append(kpiCard(t('kpi.globalProgress'), ring(s.pct,72), `${s.done}/${s.total} ${t('kpi.tasksLabel')}`, cssv('--s-done')));
+  kpis.append(kpiCard(t('kpi.globalProgress'), ring(s.pct,52), `${s.done}/${s.total} ${t('kpi.tasksLabel')}`, cssv('--s-done')));
   kpis.append(kpiCard(t('status.in_progress'), numBlock(s.byStatus.in_progress||0,'var(--s-in_progress)'), t('kpi.tasksLabel'), cssv('--s-in_progress')));
   kpis.append(kpiCard(t('status.to_validate'), numBlock(s.byStatus.to_validate||0,'var(--s-to_validate)'), t('kpi.awaitingReview'), cssv('--s-to_validate')));
   const r=s.running||{};
@@ -967,7 +967,7 @@ async function czSubmit(kind,description,agent){
 // A custom dashboard (Customize page) gets its own tab id "custom:<id>" and its own URL shape
 // /custom/<id> — kept out of ROUTES (a fixed list) since the set of custom ids is dynamic; recognized
 // by a dedicated branch in tabFromPath()/navigateTab() instead.
-const ROUTES=['board','requests','attention','backlog','workflow','team','chat','info','settings'];
+const ROUTES=['board','requests','attention','backlog','workflow','team','chat','info','docs','settings'];
 function tabFromPath(){
   const s=location.pathname.split('/').filter(Boolean);
   if(s[0]==='custom'&&s[1]) return 'custom:'+decodeURIComponent(s[1]);
@@ -1046,7 +1046,11 @@ function mdLite(raw){
   // 2) escape HTML — everything below builds markup only from this escaped text
   text=escHtml(text);
   // 3) convert a small markdown subset to HTML
-  const inline=s=> s.replace(/`([^`]+)`/g,'<code>$1</code>').replace(/\*\*([^*]+)\*\*/g,'<strong>$1</strong>');
+  const inline=s=> s
+    .replace(/`([^`]+)`/g,'<code>$1</code>')
+    .replace(/\*\*([^*]+)\*\*/g,'<strong>$1</strong>')
+    .replace(/\[([^\]]+)\]\((https?:\/\/[^\s)]+)\)/g,'<a href="$2" target="_blank" rel="noopener">$1</a>') // [text](url)
+    .replace(/(^|[^"'>])(https?:\/\/[^\s<]+)/g,'$1<a href="$2" target="_blank" rel="noopener">$2</a>'); // bare https://… URLs, skipping ones already inside an href/text we just built
   const lines=text.split('\n');
   let html='', inCode=false, codeBuf=[], listBuf=[], paraBuf=[];
   const flushPara=()=>{ if(paraBuf.length){ html+='<p>'+paraBuf.join(' ')+'</p>'; paraBuf=[]; } };
@@ -1165,6 +1169,73 @@ function renderInfo(){
   box.append(infoSection(t('info.workflowLabel'),'workflow',wfList));
 }
 
+// ---- Documentation tab: which coding agents spectoflow can drive (with links to each one's own
+// docs, sourced from the same registry the topbar switcher reads) + the CLI command reference.
+// Never build this table from anything but P.knownAgents/P.installedAgents — that data comes from a
+// real PATH/config-dir test on the server, never a guess spectoflow hasn't verified. ----
+function linkEl(text,url){ const a=document.createElement('a'); a.href=url; a.target='_blank'; a.rel='noopener'; a.textContent=text; return a; }
+function docsAgentsTable(){
+  const known=P.knownAgents||[], installed=P.installedAgents||[];
+  const wrap=el('div','table-scroll'); const tbl=el('table','backlog-table');
+  const thead=el('thead'); const htr=el('tr');
+  [t('docs.colAgent'),t('docs.colStatus'),t('docs.colDocs')].forEach(c=>htr.append(el('th',null,c)));
+  thead.append(htr); tbl.append(thead);
+  const tbody=el('tbody');
+  known.forEach(a=>{
+    const tr=el('tr');
+    tr.append(el('td',null,a.label));
+    const statusTd=el('td');
+    const isInstalled=installed.includes(a.id);
+    const chip=el('span','chip s-'+(isInstalled?'done':'todo'), isInstalled?t('docs.installed'):t('docs.notInstalled'));
+    statusTd.append(chip);
+    if(!a.headless){ statusTd.append(document.createTextNode(' ')); statusTd.append(el('span','docs-manual-badge',t('docs.manualOnly'))); }
+    tr.append(statusTd);
+    const docsTd=el('td');
+    if(a.docsUrl) docsTd.append(linkEl(t('docs.officialDocs'),a.docsUrl));
+    tr.append(docsTd);
+    tbody.append(tr);
+  });
+  tbl.append(tbody); wrap.append(tbl);
+  return wrap;
+}
+function docsCommandsTable(){
+  const rows=[
+    ['spectoflow init [dir] [--agent=a,b]', t('docs.cmd.init')],
+    ['spectoflow update [--dry-run] [--force|-f]', t('docs.cmd.update')],
+    ['spectoflow status', t('docs.cmd.status')],
+    ['spectoflow dashboard [--port=NNNN]', t('docs.cmd.dashboard')],
+    ['spectoflow dashboard status|stop|restart', t('docs.cmd.dashboardSub')],
+    ['spectoflow dashboard create "…" | --auto', t('docs.cmd.dashboardCreate')],
+    ['spectoflow skill create "…" | --auto', t('docs.cmd.skillCreate')],
+    ['spectoflow agent create "…" | --auto', t('docs.cmd.agentCreate')],
+    ['spectoflow list', t('docs.cmd.list')],
+    ['spectoflow agents · skills · workflow', t('docs.cmd.explore')],
+  ];
+  const wrap=el('div','table-scroll'); const tbl=el('table','backlog-table');
+  const thead=el('thead'); const htr=el('tr');
+  [t('docs.colCommand'),t('docs.colWhatItDoes')].forEach(c=>htr.append(el('th',null,c)));
+  thead.append(htr); tbl.append(thead);
+  const tbody=el('tbody');
+  rows.forEach(([cmd,desc])=>{
+    const tr=el('tr');
+    const cmdTd=el('td'); const code=el('code',null,cmd); cmdTd.append(code); tr.append(cmdTd);
+    tr.append(el('td',null,desc));
+    tbody.append(tr);
+  });
+  tbl.append(tbody); wrap.append(tbl);
+  return wrap;
+}
+function renderDocs(){
+  const box=$('#docsBody'); if(!box) return;
+  box.innerHTML='';
+  box.append(infoSection(t('docs.agentsTitle'),'agents',docsAgentsTable()));
+  box.append(infoSection(t('docs.commandsTitle'),'run',docsCommandsTable()));
+  const note=el('p','docs-note');
+  note.append(document.createTextNode(t('docs.moreNote')+' '));
+  note.append(linkEl('github.com/georgesmomo/spectoflow','https://github.com/georgesmomo/spectoflow'));
+  box.append(note);
+}
+
 function openDrawer(id,keep){
   // named `task`, not `t` — `t` is the global translation function (see i18n.js) and this whole
   // function calls it repeatedly below; shadowing it with a task variable would break every call.

package/templates/dashboard/public/i18n.js

@@ -20,7 +20,7 @@
 const I18N = {
 en: {
   'nav.board':'Board','nav.requests':'Requests','nav.attention':'Attention','nav.backlog':'Backlog',
-  'nav.workflow':'Workflow','nav.team':'Agents & Skills','nav.chat':'Chat','nav.info':'Info','nav.settings':'Personalize',
+  'nav.workflow':'Workflow','nav.team':'Agents & Skills','nav.chat':'Chat','nav.info':'Info','nav.docs':'Documentation','nav.settings':'Personalize',
   'status.todo':'To do','status.in_progress':'In progress','status.to_validate':'To validate',
   'status.to_analyze':'To analyze','status.done':'Done','status.blocked':'Blocked',
   'filter.all':'All','filter.open':'Open','filter.resolved':'Resolved',
@@ -114,10 +114,25 @@ en: {
   'customize.add.dashboard':'Add dashboard','customize.add.skill':'Add skill','customize.add.agent':'Add agent',
   'customize.empty.dashboard':'No custom dashboards yet.','customize.empty.skill':'No custom skills yet.','customize.empty.agent':'No custom agents yet.',
   'customize.describePh':'Describe what you want…','customize.auto':'Auto','customize.generate':'Generate','customize.blocksSub':'block(s)',
+  'docs.title':'Documentation','docs.sub':'Which coding agents spectoflow can drive, and the commands that drive them.',
+  'docs.agentsTitle':'Supported agents','docs.commandsTitle':'Commands',
+  'docs.colAgent':'Agent','docs.colStatus':'Status','docs.colDocs':'Docs','docs.colCommand':'Command','docs.colWhatItDoes':'What it does',
+  'docs.installed':'Installed','docs.notInstalled':'Not installed','docs.manualOnly':'Manual only','docs.officialDocs':'Official docs ↗',
+  'docs.moreNote':'Full reference, source and license on GitHub:',
+  'docs.cmd.init':'Scaffold a project (auto-detects agents; wires Playwright MCP).',
+  'docs.cmd.update':'Refresh framework files to this kit version, preserving your work.',
+  'docs.cmd.status':'Progress + whether the dashboard is running.',
+  'docs.cmd.dashboard':'Start the control plane in the background.',
+  'docs.cmd.dashboardSub':'Check, stop, or restart the running dashboard.',
+  'docs.cmd.dashboardCreate':'Generate a custom dashboard from the terminal.',
+  'docs.cmd.skillCreate':'Generate a project-specific skill from the terminal.',
+  'docs.cmd.agentCreate':'Generate a project-specific agent persona from the terminal.',
+  'docs.cmd.list':'Agents, skills and the workflow at a glance.',
+  'docs.cmd.explore':'List the team personas, the procedures, or the pipeline steps.',
 },
 fr: {
   'nav.board':'Tableau','nav.requests':'Demandes','nav.attention':'Attention','nav.backlog':'Backlog',
-  'nav.workflow':'Workflow','nav.team':'Agents et compétences','nav.chat':'Chat','nav.info':'Infos','nav.settings':'Personnalisation',
+  'nav.workflow':'Workflow','nav.team':'Agents et compétences','nav.chat':'Chat','nav.info':'Infos','nav.docs':'Documentation','nav.settings':'Personnalisation',
   'status.todo':'À faire','status.in_progress':'En cours','status.to_validate':'À valider',
   'status.to_analyze':'À analyser','status.done':'Terminé','status.blocked':'Bloqué',
   'filter.all':'Tous','filter.open':'Ouverts','filter.resolved':'Résolus',
@@ -211,10 +226,25 @@ fr: {
   'customize.add.dashboard':'Ajouter un dashboard','customize.add.skill':'Ajouter une compétence','customize.add.agent':'Ajouter un agent',
   'customize.empty.dashboard':'Aucun dashboard personnalisé pour l’instant.','customize.empty.skill':'Aucune compétence personnalisée pour l’instant.','customize.empty.agent':'Aucun agent personnalisé pour l’instant.',
   'customize.describePh':'Décrivez ce que vous voulez…','customize.auto':'Auto','customize.generate':'Générer','customize.blocksSub':'bloc(s)',
+  'docs.title':'Documentation','docs.sub':'Les agents de code que spectoflow peut piloter, et les commandes qui les pilotent.',
+  'docs.agentsTitle':'Agents pris en charge','docs.commandsTitle':'Commandes',
+  'docs.colAgent':'Agent','docs.colStatus':'Statut','docs.colDocs':'Docs','docs.colCommand':'Commande','docs.colWhatItDoes':'Ce que ça fait',
+  'docs.installed':'Installé','docs.notInstalled':'Non installé','docs.manualOnly':'Manuel uniquement','docs.officialDocs':'Doc officielle ↗',
+  'docs.moreNote':'Référence complète, source et licence sur GitHub :',
+  'docs.cmd.init':'Initialise un projet (détecte les agents automatiquement ; câble Playwright MCP).',
+  'docs.cmd.update':'Met à jour les fichiers du framework vers cette version, en préservant vos modifications.',
+  'docs.cmd.status':'Progression + si le dashboard tourne.',
+  'docs.cmd.dashboard':'Démarre le plan de contrôle en arrière-plan.',
+  'docs.cmd.dashboardSub':'Vérifie, arrête ou redémarre le dashboard en cours.',
+  'docs.cmd.dashboardCreate':'Génère un dashboard personnalisé depuis le terminal.',
+  'docs.cmd.skillCreate':'Génère une compétence propre au projet depuis le terminal.',
+  'docs.cmd.agentCreate':'Génère un agent (persona) propre au projet depuis le terminal.',
+  'docs.cmd.list':'Agents, compétences et workflow en un coup d’œil.',
+  'docs.cmd.explore':'Liste les personas de l’équipe, les procédures ou les étapes du pipeline.',
 },
 es: {
   'nav.board':'Tablero','nav.requests':'Solicitudes','nav.attention':'Atención','nav.backlog':'Backlog',
-  'nav.workflow':'Workflow','nav.team':'Agentes y habilidades','nav.chat':'Chat','nav.info':'Info','nav.settings':'Personalizar',
+  'nav.workflow':'Workflow','nav.team':'Agentes y habilidades','nav.chat':'Chat','nav.info':'Info','nav.docs':'Documentación','nav.settings':'Personalizar',
   'status.todo':'Por hacer','status.in_progress':'En curso','status.to_validate':'Por validar',
   'status.to_analyze':'Por analizar','status.done':'Hecho','status.blocked':'Bloqueado',
   'filter.all':'Todos','filter.open':'Abiertos','filter.resolved':'Resueltos',
@@ -308,10 +338,25 @@ es: {
   'customize.add.dashboard':'Añadir dashboard','customize.add.skill':'Añadir habilidad','customize.add.agent':'Añadir agente',
   'customize.empty.dashboard':'Aún no hay dashboards personalizados.','customize.empty.skill':'Aún no hay habilidades personalizadas.','customize.empty.agent':'Aún no hay agentes personalizados.',
   'customize.describePh':'Describe lo que quieres…','customize.auto':'Auto','customize.generate':'Generar','customize.blocksSub':'bloque(s)',
+  'docs.title':'Documentación','docs.sub':'Qué agentes de código puede pilotar spectoflow, y los comandos que los pilotan.',
+  'docs.agentsTitle':'Agentes compatibles','docs.commandsTitle':'Comandos',
+  'docs.colAgent':'Agente','docs.colStatus':'Estado','docs.colDocs':'Docs','docs.colCommand':'Comando','docs.colWhatItDoes':'Qué hace',
+  'docs.installed':'Instalado','docs.notInstalled':'No instalado','docs.manualOnly':'Solo manual','docs.officialDocs':'Docs oficial ↗',
+  'docs.moreNote':'Referencia completa, código fuente y licencia en GitHub:',
+  'docs.cmd.init':'Crea un proyecto (detecta agentes automáticamente; conecta Playwright MCP).',
+  'docs.cmd.update':'Actualiza los archivos del framework a esta versión, preservando tu trabajo.',
+  'docs.cmd.status':'Progreso + si el dashboard está en ejecución.',
+  'docs.cmd.dashboard':'Inicia el panel de control en segundo plano.',
+  'docs.cmd.dashboardSub':'Consulta, detiene o reinicia el dashboard en ejecución.',
+  'docs.cmd.dashboardCreate':'Genera un dashboard personalizado desde la terminal.',
+  'docs.cmd.skillCreate':'Genera una habilidad propia del proyecto desde la terminal.',
+  'docs.cmd.agentCreate':'Genera un agente (persona) propio del proyecto desde la terminal.',
+  'docs.cmd.list':'Agentes, habilidades y workflow de un vistazo.',
+  'docs.cmd.explore':'Lista los personas del equipo, los procedimientos o los pasos del pipeline.',
 },
 de: {
   'nav.board':'Board','nav.requests':'Anfragen','nav.attention':'Hinweise','nav.backlog':'Backlog',
-  'nav.workflow':'Workflow','nav.team':'Agenten & Skills','nav.chat':'Chat','nav.info':'Info','nav.settings':'Personalisieren',
+  'nav.workflow':'Workflow','nav.team':'Agenten & Skills','nav.chat':'Chat','nav.info':'Info','nav.docs':'Dokumentation','nav.settings':'Personalisieren',
   'status.todo':'Offen','status.in_progress':'In Arbeit','status.to_validate':'Zu prüfen',
   'status.to_analyze':'Zu analysieren','status.done':'Erledigt','status.blocked':'Blockiert',
   'filter.all':'Alle','filter.open':'Offen','filter.resolved':'Erledigt',
@@ -405,10 +450,25 @@ de: {
   'customize.add.dashboard':'Dashboard hinzufügen','customize.add.skill':'Skill hinzufügen','customize.add.agent':'Agent hinzufügen',
   'customize.empty.dashboard':'Noch keine eigenen Dashboards.','customize.empty.skill':'Noch keine eigenen Skills.','customize.empty.agent':'Noch keine eigenen Agenten.',
   'customize.describePh':'Beschreiben Sie, was Sie wollen…','customize.auto':'Auto','customize.generate':'Generieren','customize.blocksSub':'Block/Blöcke',
+  'docs.title':'Dokumentation','docs.sub':'Welche Coding-Agenten spectoflow steuern kann, und die Befehle dafür.',
+  'docs.agentsTitle':'Unterstützte Agenten','docs.commandsTitle':'Befehle',
+  'docs.colAgent':'Agent','docs.colStatus':'Status','docs.colDocs':'Docs','docs.colCommand':'Befehl','docs.colWhatItDoes':'Was er macht',
+  'docs.installed':'Installiert','docs.notInstalled':'Nicht installiert','docs.manualOnly':'Nur manuell','docs.officialDocs':'Offizielle Docs ↗',
+  'docs.moreNote':'Vollständige Referenz, Quellcode und Lizenz auf GitHub:',
+  'docs.cmd.init':'Projekt aufsetzen (erkennt Agenten automatisch; verdrahtet Playwright MCP).',
+  'docs.cmd.update':'Framework-Dateien auf diese Version aktualisieren, eigene Änderungen bleiben erhalten.',
+  'docs.cmd.status':'Fortschritt + ob das Dashboard läuft.',
+  'docs.cmd.dashboard':'Startet die Kontrollzentrale im Hintergrund.',
+  'docs.cmd.dashboardSub':'Prüft, stoppt oder startet das laufende Dashboard neu.',
+  'docs.cmd.dashboardCreate':'Erzeugt ein individuelles Dashboard über das Terminal.',
+  'docs.cmd.skillCreate':'Erzeugt einen projektspezifischen Skill über das Terminal.',
+  'docs.cmd.agentCreate':'Erzeugt eine projektspezifische Agenten-Persona über das Terminal.',
+  'docs.cmd.list':'Agenten, Skills und Workflow auf einen Blick.',
+  'docs.cmd.explore':'Listet die Team-Personas, die Verfahren oder die Pipeline-Schritte.',
 },
 pt: {
   'nav.board':'Painel','nav.requests':'Pedidos','nav.attention':'Atenção','nav.backlog':'Backlog',
-  'nav.workflow':'Workflow','nav.team':'Agentes e habilidades','nav.chat':'Chat','nav.info':'Info','nav.settings':'Personalizar',
+  'nav.workflow':'Workflow','nav.team':'Agentes e habilidades','nav.chat':'Chat','nav.info':'Info','nav.docs':'Documentação','nav.settings':'Personalizar',
   'status.todo':'A fazer','status.in_progress':'Em curso','status.to_validate':'Por validar',
   'status.to_analyze':'Por analisar','status.done':'Concluído','status.blocked':'Bloqueado',
   'filter.all':'Todos','filter.open':'Abertos','filter.resolved':'Resolvidos',
@@ -502,10 +562,25 @@ pt: {
   'customize.add.dashboard':'Adicionar dashboard','customize.add.skill':'Adicionar habilidade','customize.add.agent':'Adicionar agente',
   'customize.empty.dashboard':'Ainda sem dashboards personalizados.','customize.empty.skill':'Ainda sem habilidades personalizadas.','customize.empty.agent':'Ainda sem agentes personalizados.',
   'customize.describePh':'Descreva o que quer…','customize.auto':'Auto','customize.generate':'Gerar','customize.blocksSub':'bloco(s)',
+  'docs.title':'Documentação','docs.sub':'Quais agentes de código o spectoflow consegue conduzir, e os comandos que os conduzem.',
+  'docs.agentsTitle':'Agentes suportados','docs.commandsTitle':'Comandos',
+  'docs.colAgent':'Agente','docs.colStatus':'Estado','docs.colDocs':'Docs','docs.colCommand':'Comando','docs.colWhatItDoes':'O que faz',
+  'docs.installed':'Instalado','docs.notInstalled':'Não instalado','docs.manualOnly':'Só manual','docs.officialDocs':'Docs oficial ↗',
+  'docs.moreNote':'Referência completa, código-fonte e licença no GitHub:',
+  'docs.cmd.init':'Cria um projeto (deteta agentes automaticamente; liga o Playwright MCP).',
+  'docs.cmd.update':'Atualiza os ficheiros do framework para esta versão, preservando o seu trabalho.',
+  'docs.cmd.status':'Progresso + se o dashboard está em execução.',
+  'docs.cmd.dashboard':'Inicia o painel de controlo em segundo plano.',
+  'docs.cmd.dashboardSub':'Verifica, para ou reinicia o dashboard em execução.',
+  'docs.cmd.dashboardCreate':'Gera um dashboard personalizado a partir do terminal.',
+  'docs.cmd.skillCreate':'Gera uma competência própria do projeto a partir do terminal.',
+  'docs.cmd.agentCreate':'Gera um agente (persona) próprio do projeto a partir do terminal.',
+  'docs.cmd.list':'Agentes, competências e workflow de relance.',
+  'docs.cmd.explore':'Lista os personas da equipa, os procedimentos ou os passos do pipeline.',
 },
 it: {
   'nav.board':'Bacheca','nav.requests':'Richieste','nav.attention':'Attenzione','nav.backlog':'Backlog',
-  'nav.workflow':'Workflow','nav.team':'Agenti e competenze','nav.chat':'Chat','nav.info':'Info','nav.settings':'Personalizza',
+  'nav.workflow':'Workflow','nav.team':'Agenti e competenze','nav.chat':'Chat','nav.info':'Info','nav.docs':'Documentazione','nav.settings':'Personalizza',
   'status.todo':'Da fare','status.in_progress':'In corso','status.to_validate':'Da convalidare',
   'status.to_analyze':'Da analizzare','status.done':'Fatto','status.blocked':'Bloccato',
   'filter.all':'Tutti','filter.open':'Aperti','filter.resolved':'Risolti',
@@ -599,6 +674,21 @@ it: {
   'customize.add.dashboard':'Aggiungi dashboard','customize.add.skill':'Aggiungi skill','customize.add.agent':'Aggiungi agente',
   'customize.empty.dashboard':'Ancora nessuna dashboard personalizzata.','customize.empty.skill':'Ancora nessuna skill personalizzata.','customize.empty.agent':'Ancora nessun agente personalizzato.',
   'customize.describePh':'Descrivi cosa vuoi…','customize.auto':'Auto','customize.generate':'Genera','customize.blocksSub':'blocco/i',
+  'docs.title':'Documentazione','docs.sub':'Quali agenti di codice spectoflow può guidare, e i comandi che li guidano.',
+  'docs.agentsTitle':'Agenti supportati','docs.commandsTitle':'Comandi',
+  'docs.colAgent':'Agente','docs.colStatus':'Stato','docs.colDocs':'Docs','docs.colCommand':'Comando','docs.colWhatItDoes':'Cosa fa',
+  'docs.installed':'Installato','docs.notInstalled':'Non installato','docs.manualOnly':'Solo manuale','docs.officialDocs':'Docs ufficiale ↗',
+  'docs.moreNote':'Riferimento completo, codice sorgente e licenza su GitHub:',
+  'docs.cmd.init':'Crea un progetto (rileva gli agenti automaticamente; collega Playwright MCP).',
+  'docs.cmd.update':'Aggiorna i file del framework a questa versione, preservando il tuo lavoro.',
+  'docs.cmd.status':'Avanzamento + se il dashboard è in esecuzione.',
+  'docs.cmd.dashboard':'Avvia il pannello di controllo in background.',
+  'docs.cmd.dashboardSub':'Controlla, ferma o riavvia il dashboard in esecuzione.',
+  'docs.cmd.dashboardCreate':'Genera una dashboard personalizzata dal terminale.',
+  'docs.cmd.skillCreate':'Genera una skill specifica del progetto dal terminale.',
+  'docs.cmd.agentCreate':'Genera un agente (persona) specifico del progetto dal terminale.',
+  'docs.cmd.list':'Agenti, skill e workflow a colpo d’occhio.',
+  'docs.cmd.explore':'Elenca le persona del team, le procedure o i passaggi della pipeline.',
 },
 };
 

package/templates/dashboard/public/icons.js

@@ -25,6 +25,8 @@
     attention: wrap('<line x1="4.5" y1="2.4" x2="4.5" y2="15.6"/><path d="M4.5 3.4h8.2l-1.7 2.6 1.7 2.6H4.5z"/>'),
     // gear — settings (proper cog with teeth)
     settings: wrap('<circle cx="9" cy="9" r="2.4"/><path d="M9 1.6v2.2M9 14.2v2.2M16.4 9h-2.2M3.8 9H1.6M14.2 3.8l-1.55 1.55M5.35 12.65 3.8 14.2M14.2 14.2l-1.55-1.55M5.35 5.35 3.8 3.8"/>'),
+    // open book — documentation
+    docs: wrap('<path d="M9 5.4C7.4 4.2 5.2 3.7 2.8 4v9c2.4-.3 4.6.2 6.2 1.4 1.6-1.2 3.8-1.7 6.2-1.4V4c-2.4-.3-4.6.2-6.2 1.4z"/><line x1="9" y1="5.4" x2="9" y2="14.4"/>'),
     // crescent moon — theme toggle
     theme: wrap('<path d="M14.6 10.8A5.6 5.6 0 0 1 7.2 3.4 5.7 5.7 0 1 0 14.6 10.8z"/>'),
   };

package/templates/dashboard/public/index.html

@@ -57,6 +57,7 @@
       <button class="tab" data-tab="workflow" data-i18n-title="nav.workflow" title="Workflow"><span class="tab-ico" data-icon="workflow"></span><span class="tab-label" data-i18n="nav.workflow">Workflow</span></button>
       <button class="tab" data-tab="team" data-i18n-title="nav.team" title="Agents &amp; Skills"><span class="tab-ico" data-icon="agents"></span><span class="tab-label" data-i18n="nav.team">Agents &amp; Skills</span></button>
       <button class="tab" data-tab="info" data-i18n-title="nav.info" title="Info"><span class="tab-ico" data-icon="info"></span><span class="tab-label" data-i18n="nav.info">Info</span></button>
+      <button class="tab" data-tab="docs" data-i18n-title="nav.docs" title="Documentation"><span class="tab-ico" data-icon="docs"></span><span class="tab-label" data-i18n="nav.docs">Documentation</span></button>
       <button class="tab" data-tab="settings" data-i18n-title="nav.settings" title="Personalize"><span class="tab-ico" data-icon="settings"></span><span class="tab-label" data-i18n="nav.settings">Personalize</span></button>
     </nav>
     <div class="top-right">
@@ -233,6 +234,15 @@
       </div>
     </section>
 
+    <!-- DOCUMENTATION (agent compatibility + CLI command reference — filled by renderDocs() in app.js) -->
+    <section class="panel" data-panel="docs">
+      <div class="info-wrap">
+        <h2 class="panel-title" data-i18n="docs.title">Documentation</h2>
+        <p class="panel-sub" data-i18n="docs.sub">Which coding agents spectoflow can drive, and the commands that drive them.</p>
+        <div class="info-grid docs-grid" id="docsBody"></div>
+      </div>
+    </section>
+
     <!-- SETTINGS (change autonomy mode + output language → config.json) -->
     <section class="panel" data-panel="settings">
       <div class="settings-wrap">

package/templates/dashboard/public/styles.css

@@ -97,17 +97,17 @@ body { background:var(--bg); color:var(--ink); font-family:var(--sans); font-siz
 
 /* overview: KPI cards + status donut + workflow strip + phase bars */
 .overview { padding:22px 24px 6px; display:flex; flex-direction:column; gap:14px; }
-.kpi-row { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
-.kpi { background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:14px 16px; display:flex; flex-direction:column; gap:8px; transition:box-shadow .15s; }
+.kpi-row { display:grid; grid-template-columns:repeat(4,1fr); gap:9px; }
+.kpi { background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:10px 13px; display:flex; flex-direction:column; gap:4px; transition:box-shadow .15s; }
 .kpi:hover { box-shadow:var(--shadow); }
-.kpi-label { font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:var(--faint); font-weight:700; }
+.kpi-label { font-size:10px; text-transform:uppercase; letter-spacing:.07em; color:var(--faint); font-weight:700; }
 .kpi-body { display:flex; align-items:center; }
-.kpi-num { font-family:var(--mono); font-size:30px; font-weight:700; line-height:1; color:var(--ink); }
-.kpi-num.is-text { font-size:17px; text-transform:capitalize; }
-.kpi-sub { font-size:11.5px; color:var(--muted); }
+.kpi-num { font-family:var(--mono); font-size:23px; font-weight:700; line-height:1; color:var(--ink); }
+.kpi-num.is-text { font-size:14px; text-transform:capitalize; }
+.kpi-sub { font-size:10.5px; color:var(--muted); }
 
 .ring-wrap { position:relative; display:inline-flex; align-items:center; justify-content:center; }
-.ring-wrap .ring-label { position:absolute; font-family:var(--mono); font-size:13px; font-weight:700; color:var(--ink); }
+.ring-wrap .ring-label { position:absolute; font-family:var(--mono); font-size:10.5px; font-weight:700; color:var(--ink); }
 .ring-svg circle { transition:stroke-dashoffset .5s ease; }
 
 .ocard { background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:16px 18px; }
@@ -556,6 +556,14 @@ body.booting .ring-svg circle:last-of-type { transform-origin:center; animation:
 .settings-select:focus { outline:2px solid var(--signal); outline-offset:1px; }
 .settings-field-hint { font-size:12px; }
 .settings-field-hint.is-empty { color:var(--s-blocked); }
+.docs-grid { grid-template-columns:1fr; } /* the built-in tables are wide — full width beats 2-up */
+.docs-grid .backlog-table a { color:var(--signal); text-decoration:none; }
+.docs-grid .backlog-table a:hover { text-decoration:underline; }
+.docs-grid .backlog-table code { font-family:var(--mono); font-size:12px; }
+.docs-manual-badge { font-size:10px; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); border:1px solid var(--line); border-radius:999px; padding:2px 7px; }
+.docs-note { margin:14px 2px 0; font-size:12.5px; color:var(--muted); }
+.docs-note a { color:var(--signal); text-decoration:none; }
+.docs-note a:hover { text-decoration:underline; }
 .settings-saved { align-self:flex-start; font-size:12px; color:var(--s-done); font-family:var(--mono); }
 .settings-saved[hidden] { display:none; }
 .settings-readonly { background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; }

package/templates/dashboard/server.js

@@ -35,7 +35,7 @@ function project(){
   // Known vs. actually-installed agents — the topbar switcher needs both: the full list to offer,
   // and which ones are real (bin on PATH, or the project already has that agent's config dir) so it
   // can refuse to activate one that isn't there.
-  p.knownAgents = agentsRegistry.KNOWN_AGENTS.map((a) => ({ id: a.id, label: a.label, headless: a.headless }));
+  p.knownAgents = agentsRegistry.KNOWN_AGENTS.map((a) => ({ id: a.id, label: a.label, headless: a.headless, docsUrl: a.docsUrl }));
   p.installedAgents = agentsRegistry.installedAgents(ROOT);
   return p;
 }

package/templates/lib/agents-registry.js

@@ -11,17 +11,25 @@ const path = require('path');
 
 // headless:false = detectable and selectable as the active agent, but spectoflow never spawns it
 // itself (no confirmed non-interactive one-shot mode) — Run/Orchestrate/Summarize stay disabled for
-// it client-side; runner/summarize.js also refuse server-side (defense in depth). See the longer
-// rationale above lib/adapters.js's REGISTRY, the richer install-time twin of this list.
+// it client-side; runner/summarize.js also refuse server-side (defense in depth). `docsUrl` is that
+// agent's own official CLI docs, surfaced verbatim in the dashboard's Documentation tab. See the
+// longer rationale above lib/adapters.js's REGISTRY, the richer install-time twin of this list —
+// including why DeepSeek Harness isn't here at all, and why some runner strings order their flags
+// the way they do (the trailing prompt must land right after whichever flag takes a value).
 const KNOWN_AGENTS = [
-  { id: 'claude', label: 'Claude Code', bin: 'claude', dirs: ['.claude'], runner: 'claude -p --permission-mode acceptEdits', headless: true },
-  { id: 'codex', label: 'Codex', bin: 'codex', dirs: ['.codex'], runner: 'codex exec', headless: true },
-  { id: 'cursor', label: 'Cursor', bin: 'cursor-agent', dirs: ['.cursor'], runner: 'cursor-agent -p', headless: true },
-  { id: 'gemini', label: 'Gemini CLI', bin: 'gemini', dirs: ['.gemini'], runner: 'gemini -p', headless: true },
-  { id: 'opencode', label: 'OpenCode', bin: 'opencode', dirs: ['.opencode'], runner: 'opencode run --quiet', headless: true },
-  { id: 'kiro', label: 'Kiro CLI', bin: 'kiro-cli', dirs: ['.kiro'], runner: 'kiro-cli chat --no-interactive --trust-all-tools', headless: true },
-  { id: 'antigravity', label: 'Antigravity', bin: 'agy', dirs: [], runner: 'agy -p', headless: true },
-  { id: 'kimi', label: 'Kimi CLI', bin: 'kimi', dirs: [], runner: null, headless: false },
+  { id: 'claude', label: 'Claude Code', bin: 'claude', dirs: ['.claude'], runner: 'claude -p --permission-mode acceptEdits', headless: true, docsUrl: 'https://code.claude.com/docs/en/cli-reference' },
+  { id: 'codex', label: 'Codex', bin: 'codex', dirs: ['.codex'], runner: 'codex exec', headless: true, docsUrl: 'https://developers.openai.com/codex/cli/reference' },
+  { id: 'cursor', label: 'Cursor', bin: 'cursor-agent', dirs: ['.cursor'], runner: 'cursor-agent -p', headless: true, docsUrl: 'https://cursor.com/docs/cli/overview' },
+  { id: 'gemini', label: 'Gemini CLI', bin: 'gemini', dirs: ['.gemini'], runner: 'gemini -p', headless: true, docsUrl: 'https://github.com/google-gemini/gemini-cli' },
+  { id: 'opencode', label: 'OpenCode', bin: 'opencode', dirs: ['.opencode'], runner: 'opencode run --quiet', headless: true, docsUrl: 'https://opencode.ai/docs/cli/' },
+  { id: 'kiro', label: 'Kiro CLI', bin: 'kiro-cli', dirs: ['.kiro'], runner: 'kiro-cli chat --no-interactive --trust-all-tools', headless: true, docsUrl: 'https://kiro.dev/docs/cli/headless/' },
+  { id: 'antigravity', label: 'Antigravity', bin: 'agy', dirs: [], runner: 'agy -p', headless: true, docsUrl: 'https://antigravity.google/docs/cli/headless/' },
+  { id: 'kimi', label: 'Kimi CLI', bin: 'kimi', dirs: [], runner: null, headless: false, docsUrl: 'https://github.com/MoonshotAI/kimi-cli' },
+  { id: 'copilot', label: 'GitHub Copilot CLI', bin: 'copilot', dirs: [], runner: 'copilot -s --allow-all-tools -p', headless: true, docsUrl: 'https://docs.github.com/copilot/concepts/agents/about-copilot-cli' },
+  { id: 'amazon-q', label: 'Amazon Q Developer CLI', bin: 'q', dirs: ['.amazonq'], runner: 'q chat --no-interactive --trust-all-tools', headless: true, docsUrl: 'https://docs.aws.amazon.com/amazonq/latest/qdeveloper-ug/command-line-chat.html' },
+  { id: 'droid', label: 'Factory Droid CLI', bin: 'droid', dirs: ['.factory'], runner: 'droid exec', headless: true, docsUrl: 'https://docs.factory.ai/droid-exec/overview' },
+  { id: 'auggie', label: 'Auggie CLI', bin: 'auggie', dirs: ['.augment'], runner: 'auggie --quiet --print', headless: true, docsUrl: 'https://docs.augmentcode.com/cli/overview' },
+  { id: 'goose', label: 'Goose CLI', bin: 'goose', dirs: ['.goose'], runner: 'goose run -t', headless: true, docsUrl: 'https://block.github.io/goose/' },
 ];
 
 // Is `bin` an executable resolvable on PATH? On win32, an extension from PATHEXT is required, so we