archtracker-mcp 0.6.0 → 0.7.0

package/README.md

@@ -1,3 +1,7 @@
+<p align="right">
+  <a href="README.ja.md">🇯🇵 日本語</a>
+</p>
+
 <p align="center">
   <img src="https://img.shields.io/badge/MCP-Compatible-blue?style=for-the-badge&logo=data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0id2hpdGUiPjxwYXRoIGQ9Ik0xMiAyQzYuNDggMiAyIDYuNDggMiAxMnM0LjQ4IDEwIDEwIDEwIDEwLTQuNDggMTAtMTBTMTcuNTIgMiAxMiAyem0tMiAxNWwtNS01IDEuNDEtMS40MUwxMCAxNC4xN2w3LjU5LTcuNTlMMTkgOGwtOSA5eiIvPjwvc3ZnPg==" alt="MCP Compatible">
   <img src="https://img.shields.io/npm/v/archtracker-mcp?style=for-the-badge&color=cb3837&logo=npm" alt="npm version">
@@ -19,8 +23,7 @@
   <a href="#multi-layer-architecture">Multi-Layer</a> &bull;
   <a href="#web-viewer">Web Viewer</a> &bull;
   <a href="#mcp-tools">MCP Tools</a> &bull;
-  <a href="#cli-commands">CLI</a> &bull;
-  <a href="#日本語">日本語</a>
+  <a href="#cli-commands">CLI</a>
 </p>
 
 ---
@@ -42,11 +45,12 @@ When AI agents modify code, they **miss cascading impacts**:
 ## Features
 
 - **Dependency Graph Analysis** — Regex-based static analysis for **13 languages** (JS/TS, Python, Rust, Go, Java, C/C++, C#, Ruby, PHP, Swift, Kotlin, Dart, Scala)
-- **Multi-Layer Architecture** — Analyze multiple services/layers as a unified graph with cross-layer connection detection (NEW in v0.5.0)
+- **Multi-Layer Architecture** — Analyze multiple services/layers as a unified graph with cross-layer connection detection
 - **Interactive Web Viewer** — Force-directed graph with convex hull layer grouping, hierarchy diagram, diff view with D3.js
+- **Security Hardened** — XSS-safe HTML escaping, path traversal protection on all MCP tools (v0.6.0)
 - **Impact Simulation** — Click any file to visualize transitive dependents (BFS traversal)
 - **Snapshot Diffing** — Save architecture snapshots and detect drift over time
-- **MCP Server** — 5 tools for Claude Code / AI agents via Model Context Protocol
+- **MCP Server** — 6 tools for Claude Code / AI agents via Model Context Protocol
 - **Claude Code Skills** — 6 slash commands (`/arch-check`, `/arch-snapshot`, `/arch-serve`, etc.)
 - **CI Integration** — `--ci` mode + auto-generated GitHub Actions workflow
 - **Bilingual** — Full English/Japanese support (auto-detected from `LANG` env)
@@ -168,6 +172,14 @@ The interactive web viewer provides three visualization modes:
 
 ![Impact Simulation](docs/screenshots/impact-simulation.png)
 
+#### Layer Focus
+
+![Layer Focus](docs/screenshots/layer-focus.png)
+
+- Shift+click a layer tab to **solo** it; click others to add
+- Convex hulls show layer boundaries; dashed lines show cross-layer links
+- Filtered physics automatically adjust for clearer separation
+
 ### Hierarchy View (DAG Layout)
 
 ![Hierarchy View](docs/screenshots/hierarchy-view.png)
@@ -350,320 +362,3 @@ See [CONTRIBUTING.md](CONTRIBUTING.md) for guidelines.
 ## License
 
 [MIT](LICENSE) &copy; un907
-
----
-
-<a id="日本語"></a>
-
-<h1 align="center">archtracker-mcp <sub>(日本語)</sub></h1>
-
-<p align="center">
-  <b>AI駆動開発のためのアーキテクチャ & 依存関係トラッカー</b><br>
-  MCP サーバー + CLI + Web ビューア + Claude Code Skills
-</p>
-
-## なぜ archtracker？
-
-AI エージェントがコードを修正する際、**波及的な影響を見逃します**：
-
-| 問題 | archtracker なし | archtracker あり |
-|------|-----------------|-----------------|
-| `auth.ts` を変更 | 12ファイルが依存していることを知らない | 影響を受ける全12ファイルを即座に表示 |
-| リファクタでファイル名変更 | 次のセッションで古いパスを参照 | `context` コマンドで現在の有効パスを取得 |
-| 新しい依存関係を追加 | 結合度の増加が見えない | 差分レポートがアーキテクチャ変更を検出 |
-| PRレビュー | 手動で依存関係を追跡 | CIが自動でアーキテクチャドリフトをチェック |
-| マルチサービス構成 | サービス境界を跨ぐ影響が見えない | レイヤー対応分析でクロスレイヤー接続を検出 |
-
-**archtracker-mcp** は依存関係分析、スナップショット差分、影響シミュレーション、インタラクティブな可視化を提供します。MCP ツール、CLI、Web UI、Claude Code Skills からアクセス可能です。
-
-## 機能
-
-- **依存関係グラフ分析** — 正規表現ベースの静的解析、**13言語**対応（JS/TS, Python, Rust, Go, Java, C/C++, C#, Ruby, PHP, Swift, Kotlin, Dart, Scala）
-- **マルチレイヤーアーキテクチャ** — 複数サービス/レイヤーを統合グラフとして分析、クロスレイヤー接続の自動検出（v0.5.0 新機能）
-- **インタラクティブ Web ビューア** — D3.js による力学モデルグラフ（凸包レイヤーグループ表示）、階層図、差分ビュー
-- **影響シミュレーション** — ファイルをクリックして推移的な被依存ファイルを可視化（BFS探索）
-- **スナップショット差分** — アーキテクチャスナップショットを保存し、ドリフトを検出
-- **MCP サーバー** — Model Context Protocol 経由で5つのツールを提供
-- **Claude Code Skills** — 6つのスラッシュコマンド（`/arch-check`、`/arch-snapshot`、`/arch-serve` 等）
-- **CI 統合** — `--ci` モード + GitHub Actions ワークフロー自動生成
-- **多言語対応** — 日本語・英語完全対応（`LANG` 環境変数から自動検出）
-- **ダーク/ライトテーマ** — localStorage で設定を永続化
-- **SVG/PNG エクスポート** — ドキュメント用にグラフをエクスポート
-
-## クイックスタート
-
-### インストール
-
-```bash
-npm install -g archtracker-mcp
-```
-
-### 1. プロジェクトを分析
-
-```bash
-archtracker analyze --target src
-```
-
-### 2. ベースラインスナップショットを保存
-
-```bash
-archtracker init --target src
-```
-
-### 3. Web ビューアを起動
-
-```bash
-archtracker serve --target src --watch
-# => http://localhost:3000
-```
-
-### 4. アーキテクチャドリフトをチェック
-
-```bash
-archtracker check --target src
-```
-
-## マルチレイヤーアーキテクチャ
-
-フロントエンド + バックエンド + 共有ライブラリなど、複数のサービスやレイヤーを持つプロジェクトを統合的に分析できます。
-
-### セットアップ
-
-プロジェクトルートに `.archtracker/layers.json` を作成：
-
-```json
-{
-  "version": "1.0",
-  "layers": [
-    {
-      "name": "Frontend",
-      "targetDir": "frontend/src",
-      "language": "javascript",
-      "color": "#58a6ff",
-      "description": "React Web App"
-    },
-    {
-      "name": "Backend",
-      "targetDir": "backend/app",
-      "language": "python",
-      "color": "#3fb950",
-      "description": "FastAPI Server"
-    }
-  ],
-  "connections": [
-    {
-      "fromLayer": "Frontend",
-      "fromFile": "api/client.ts",
-      "toLayer": "Backend",
-      "toFile": "main.py",
-      "type": "api-call",
-      "label": "REST API"
-    }
-  ]
-}
-```
-
-テンプレートの自動生成：
-
-```bash
-archtracker layers init
-```
-
-### 使い方
-
-`layers.json` が存在する場合、全コマンドが自動的にマルチレイヤーモードで動作します：
-
-```bash
-archtracker analyze --root .          # 全レイヤーを分析
-archtracker serve --root . --watch    # レイヤータブ・凸包表示付き Web ビューア
-archtracker check --root .            # クロスレイヤー差分チェック
-```
-
-各レイヤーは独立した言語設定で個別に分析され、プレフィックス付きパス（例: `Backend/worker.py`）で統合グラフにマージされます。
-
-### Web ビューアでのレイヤー表示
-
-- **レイヤータブ**: 複数選択トグルで特定レイヤーにフォーカス（Shift+クリックでソロモード）
-- **凸包グループ**: 各レイヤーが色付きの境界で視覚的にグループ化
-- **クロスレイヤーリンク**: レイヤー間接続を点線で表示（設定で切替可能）
-- **Layer Cohesion スライダー**: レイヤー内ノードの凝集度を調整
-- **差分ハイライト**: 変更を含むレイヤーの境界がハイライト
-
-## Web ビューア
-
-インタラクティブな Web ビューアは3つの可視化モードを提供します：
-
-### グラフビュー（力学モデル）
-
-![グラフビュー](docs/screenshots/graph-view-dark.png)
-
-- ドラッグ、ズーム、クリックでノードの依存関係を探索
-- ノードをクリックでハイライトを**ピン固定** — 他のノードをホバーして比較
-- 下部のピルでディレクトリごと、上部のタブでレイヤーごとにフィルタリング
-- 重力、レイヤー凝集力、ノードサイズ、フォントサイズ、リンク透明度を調整可能
-- **影響モード**: ファイルをクリックして推移的に影響を受ける全ファイルを表示
-
-![影響シミュレーション](docs/screenshots/impact-simulation.png)
-
-### 階層ビュー（DAGレイアウト）
-
-![階層ビュー](docs/screenshots/hierarchy-view.png)
-
-- 依存の深さを示すレイヤー型トップダウンレイアウト
-- クリックでピン固定 + 詳細パネル
-- レイヤー対応フィルタリング + コンパクト再配置
-
-### 差分ビュー
-
-![差分ビュー](docs/screenshots/diff-view.png)
-
-- アーキテクチャ変更の色分け可視化
-- 緑=追加、赤=削除、黄=変更、青=影響
-- 変更を含むレイヤー境界のハイライト表示
-- スナップショットが存在する場合に利用可能
-
-```bash
-# ファイル変更の自動リロード付きで起動
-archtracker serve --target src --port 3456 --watch
-```
-
-## MCP ツール
-
-archtracker を MCP サーバーとして Claude Code や MCP 互換 AI エージェントに追加：
-
-```json
-{
-  "mcpServers": {
-    "archtracker": {
-      "command": "npx",
-      "args": ["-y", "archtracker-mcp"]
-    }
-  }
-}
-```
-
-| ツール | 説明 |
-|--------|------|
-| `generate_map` | 依存関係グラフを解析し構造化JSONで返す（プログラム用） |
-| `analyze_existing_architecture` | 包括的な人間向け分析レポート |
-| `save_architecture_snapshot` | `.archtracker/snapshot.json` にスナップショットを保存 |
-| `check_architecture_diff` | スナップショットと現在のコードを比較し影響を表示 |
-| `get_current_context` | 有効なファイルパスとアーキテクチャサマリーを取得 |
-| `search_architecture` | パス、影響範囲、重要度、孤立ファイルで検索 |
-
-`.archtracker/layers.json` が存在する場合、全ツールがマルチレイヤーモードを自動検出します。
-
-## CLI コマンド
-
-```
-archtracker init [options]       初期アーキテクチャスナップショットを生成
-archtracker analyze [options]    包括的な分析レポート
-archtracker check [options]      スナップショットと現在のコードを比較
-archtracker context [options]    アーキテクチャコンテキストを表示（AIセッション用）
-archtracker serve [options]      インタラクティブ Web ビューアを起動
-archtracker ci-setup [options]   GitHub Actions ワークフローを生成
-archtracker layers init          テンプレート layers.json を作成
-archtracker layers list          設定済みレイヤーを一覧表示
-
-オプション:
-  -t, --target <dir>       対象ディレクトリ（デフォルト: "src"）
-  -r, --root <dir>         プロジェクトルート（デフォルト: "."）
-  -l, --language <lang>    対象言語（省略時は自動検出）
-  -p, --port <number>      Web ビューアのポート（デフォルト: 3000）
-  -w, --watch              ファイル変更の監視と自動リロード
-  -e, --exclude <pattern>  除外パターン（正規表現）
-  -n, --top <number>       分析の上位N件（デフォルト: 10）
-  --save                   分析後にスナップショットを保存
-  --ci                     CIモード: 要確認ファイルがあれば exit 1
-  --json                   JSON形式で出力（context コマンド）
-  --lang <locale>          言語: en | ja（LANG から自動検出）
-```
-
-> **マルチレイヤー**: `.archtracker/layers.json` が存在し `--target` が明示指定されていない場合、全コマンドが自動的にマルチレイヤー分析を使用します。`--root` でプロジェクトルートを指定してください。
-
-## Claude Code Skills
-
-`skills/` ディレクトリをプロジェクトにコピー：
-
-```bash
-cp -r node_modules/archtracker-mcp/skills/ .claude/skills/
-```
-
-| スキル | 説明 |
-|--------|------|
-| `/arch-analyze` | 包括的なアーキテクチャ分析を実行 |
-| `/arch-check` | スナップショットと現在のコードを比較 |
-| `/arch-snapshot` | 現在のアーキテクチャスナップショットを保存 |
-| `/arch-context` | 有効なファイルパスでAIセッションを初期化 |
-| `/arch-search` | アーキテクチャ検索（パス、影響、重要度、孤立） |
-| `/arch-serve` | インタラクティブ Web ビューアを起動 |
-
-全スキルがマルチレイヤープロジェクトに自動対応します。
-
-## プログラマティック API
-
-```typescript
-import {
-  analyzeProject,
-  analyzeMultiLayer,
-  saveSnapshot,
-  loadSnapshot,
-  computeDiff,
-  formatDiffReport,
-  formatAnalysisReport,
-} from "archtracker-mcp";
-
-// 単一ディレクトリ分析
-const graph = await analyzeProject("src", { exclude: ["__tests__"] });
-
-// マルチレイヤー分析
-const layers = [
-  { name: "Frontend", targetDir: "frontend/src", language: "javascript" },
-  { name: "Backend", targetDir: "backend/app", language: "python" },
-];
-const multi = await analyzeMultiLayer(".", layers);
-
-// スナップショット
-const snapshot = await saveSnapshot(".", graph);
-
-// 差分比較
-const prev = await loadSnapshot(".");
-if (prev) {
-  const diff = computeDiff(prev.graph, graph);
-  console.log(formatDiffReport(diff));
-}
-```
-
-## CI / CD
-
-### GitHub Actions ワークフローの自動生成
-
-```bash
-archtracker ci-setup --target src
-# .github/workflows/arch-check.yml を生成
-```
-
-## 多言語対応
-
-`LANG` / `LC_ALL` 環境変数から自動検出されます：
-
-```bash
-LANG=ja_JP.UTF-8 archtracker analyze   # 日本語出力
-archtracker --lang ja check             # 明示的に日本語指定
-```
-
-Web ビューアでも設定パネルから言語を切り替え可能です。
-
-## 動作要件
-
-- **Node.js** >= 18.0.0
-
-対応言語: JavaScript/TypeScript, Python, Rust, Go, Java, C/C++, C#, Ruby, PHP, Swift, Kotlin, Dart, Scala
-
-## コントリビュート
-
-[CONTRIBUTING.md](CONTRIBUTING.md) をご覧ください。
-
-## ライセンス
-
-[MIT](LICENSE) &copy; un907

package/dist/bin.js

@@ -1,7 +1,7 @@
 #!/usr/bin/env node
 
 // src/bin.ts
-var CLI_COMMANDS = ["init", "analyze", "check", "context", "serve", "ci-setup", "layers", "help"];
+var CLI_COMMANDS = ["init", "analyze", "check", "context", "serve", "ci-setup", "layers", "history", "help"];
 var CLI_FLAGS = ["--help", "-h", "--version", "-V"];
 var args = process.argv.slice(2);
 var hasCommand = args.some((arg) => CLI_COMMANDS.includes(arg));

package/dist/bin.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/bin.ts"],"sourcesContent":["/**\n * Smart entry point for `archtracker-mcp` binary.\n *\n * - If CLI subcommands are detected (serve, analyze, init, etc.) → run CLI\n * - Otherwise → start MCP server on stdio\n *\n * This allows both:\n *   npx archtracker-mcp                          → MCP server\n *   npx archtracker-mcp serve --target src        → Web viewer (CLI mode)\n *   npx archtracker-mcp analyze --target src      → Analysis report (CLI mode)\n */\n\nconst CLI_COMMANDS = [\"init\", \"analyze\", \"check\", \"context\", \"serve\", \"ci-setup\", \"layers\", \"help\"];\nconst CLI_FLAGS = [\"--help\", \"-h\", \"--version\", \"-V\"];\n\nconst args = process.argv.slice(2);\nconst hasCommand = args.some((arg) => CLI_COMMANDS.includes(arg));\nconst hasFlag = args.some((arg) => CLI_FLAGS.includes(arg));\n\nif (hasCommand || hasFlag) {\n  await import(\"./cli/index.js\");\n} else {\n  await import(\"./mcp/index.js\");\n}\n\nexport {};\n"],"mappings":";;;AAYA,IAAM,eAAe,CAAC,QAAQ,WAAW,SAAS,WAAW,SAAS,YAAY,UAAU,MAAM;AAClG,IAAM,YAAY,CAAC,UAAU,MAAM,aAAa,IAAI;AAEpD,IAAM,OAAO,QAAQ,KAAK,MAAM,CAAC;AACjC,IAAM,aAAa,KAAK,KAAK,CAAC,QAAQ,aAAa,SAAS,GAAG,CAAC;AAChE,IAAM,UAAU,KAAK,KAAK,CAAC,QAAQ,UAAU,SAAS,GAAG,CAAC;AAE1D,IAAI,cAAc,SAAS;AACzB,QAAM,OAAO,gBAAgB;AAC/B,OAAO;AACL,QAAM,OAAO,gBAAgB;AAC/B;","names":[]}
+{"version":3,"sources":["../src/bin.ts"],"sourcesContent":["/**\n * Smart entry point for `archtracker-mcp` binary.\n *\n * - If CLI subcommands are detected (serve, analyze, init, etc.) → run CLI\n * - Otherwise → start MCP server on stdio\n *\n * This allows both:\n *   npx archtracker-mcp                          → MCP server\n *   npx archtracker-mcp serve --target src        → Web viewer (CLI mode)\n *   npx archtracker-mcp analyze --target src      → Analysis report (CLI mode)\n */\n\nconst CLI_COMMANDS = [\"init\", \"analyze\", \"check\", \"context\", \"serve\", \"ci-setup\", \"layers\", \"history\", \"help\"];\nconst CLI_FLAGS = [\"--help\", \"-h\", \"--version\", \"-V\"];\n\nconst args = process.argv.slice(2);\nconst hasCommand = args.some((arg) => CLI_COMMANDS.includes(arg));\nconst hasFlag = args.some((arg) => CLI_FLAGS.includes(arg));\n\nif (hasCommand || hasFlag) {\n  await import(\"./cli/index.js\");\n} else {\n  await import(\"./mcp/index.js\");\n}\n\nexport {};\n"],"mappings":";;;AAYA,IAAM,eAAe,CAAC,QAAQ,WAAW,SAAS,WAAW,SAAS,YAAY,UAAU,WAAW,MAAM;AAC7G,IAAM,YAAY,CAAC,UAAU,MAAM,aAAa,IAAI;AAEpD,IAAM,OAAO,QAAQ,KAAK,MAAM,CAAC;AACjC,IAAM,aAAa,KAAK,KAAK,CAAC,QAAQ,aAAa,SAAS,GAAG,CAAC;AAChE,IAAM,UAAU,KAAK,KAAK,CAAC,QAAQ,UAAU,SAAS,GAAG,CAAC;AAE1D,IAAI,cAAc,SAAS;AACzB,QAAM,OAAO,gBAAgB;AAC/B,OAAO;AACL,QAAM,OAAO,gBAAgB;AAC/B;","names":[]}