Coding Agent Viewer

GitHub Copilot などコーディングエージェントサービスの エージェント定義ファイル を可視化する VS Code 拡張機能です。 ライブ Markdown プレビューと専用のアウトラインビュー、そして *.agent.md 専用の Agent Collaboration Visualizer（エージェント連携可視化ツール）を 1 つの拡張機能にまとめています。

エージェント定義の見出し構造をブラウズし、エディタとプレビューを同期スクロールさせ、 カスタムエージェント同士がどのように仕事をハンドオフしているかを有向グラフでその場で編集可能です。

機能

Markdown プレビュー & アウトライン

• 編集と同時に再描画される ライブ Markdown プレビュー
• 表示モード 2 種類：横並び（side-by-side）／現在のエディタ列を置き換え
• アウトラインビュー（H1〜H6） を専用 Activity Bar コンテナに表示。見出しクリックでジャンプ
• プレビューや Output パネルにフォーカス移動してもアウトラインは直近の Markdown を保持
• エディタとプレビューの同期スクロール
• シンタックスハイライト付きコードブロック
• 強固なセキュリティを意識した WebView レンダリング

Agent Collaboration Visualizer（エージェント連携可視化）

• ワークスペース内の *.agent.md を自動検出（glob パターンで設定可能）
• エージェント間の handoffs を 有向グラフ として cytoscape + cytoscape-dagre で描画（上から下の階層レイアウト）
• Agent Detail ツリービュー に現在のエージェントファイルの name, namespace, description, tools, handoffs を表示
• ツールバー：検索、ネームスペースフィルタ（ユーザー単位で永続化）、エッジ追加、サブツリーフォーカス、SVG / PNG エクスポート
• グラフから直接編集：エッジをダブルクリックでラベル変更、右クリックで削除、Add edge で新規追加。すべて YAML フロントマターへ書き戻し
• ノードクリックで該当 .agent.md を最小の非グラフエディタ列に開く（余計な分割を作らない）
• テーマ対応、厳格な CSP、レンダリング毎の Nonce、楽観的編集（拡張ホスト拒否時はロールバック）

必要環境

• Visual Studio Code 1.120 以降

インストール

VS Code Marketplace から「Coding Agent Viewer」を検索するか、下のボタンから直接ストアを開いてください。