opentology 0.2.0 → 0.2.1

package/README.md

@@ -1,6 +1,6 @@
 # OpenTology
 
-> CLI-managed RDF/SPARQL infrastructure with RDFS reasoning and SHACL validation -- Supabase for knowledge graphs
+> CLI-managed RDF/SPARQL infrastructure with RDFS reasoning, SHACL validation, and interactive graph visualization -- Supabase for knowledge graphs
 
 [English](#english) | [한국어](#한국어)
 
@@ -22,7 +22,7 @@ graph TB
     end
 
     subgraph MCP["MCP Server"]
-        Tools[18 Tools]
+        Tools[20 Tools]
         Resource["opentology://schema"]
     end
 
@@ -42,7 +42,7 @@ graph TB
     Pipeline --> Adapter
 ```
 
-Existing ontology tools have terrible developer experience. OpenTology gives you managed RDF with a simple CLI -- initialize a project, write Turtle, validate with SHACL, push with automatic RDFS inference, and query, all from your terminal. It ships an MCP server so AI assistants can manage your knowledge graph directly. It runs in embedded mode with zero Docker dependency, or connects to an Oxigraph server over HTTP.
+Existing ontology tools have terrible developer experience. OpenTology gives you managed RDF with a simple CLI -- initialize a project, write Turtle, validate with SHACL, push with automatic RDFS inference, query, and visualize your graph in an interactive web UI, all from your terminal. It ships an MCP server so AI assistants can manage your knowledge graph directly. It runs in embedded mode with zero Docker dependency, or connects to an Oxigraph server over HTTP.
 
 ### System Requirements
 
@@ -97,7 +97,7 @@ graph LR
 | Docker required | No (embedded mode) | Yes | Yes |
 | RDFS reasoning | Automatic on push | Manual SPARQL CONSTRUCT | Not native |
 | SHACL validation | Built-in | Manual tooling | N/A |
-| AI integration | MCP server with 18 tools | None | Plugin ecosystem |
+| AI integration | MCP server with 20 tools | None | Plugin ecosystem |
 | Query language | SPARQL (auto-prefixed) | SPARQL (raw) | Cypher |
 | Data format | Turtle files | Turtle/N-Triples | Property graph |
 | Project scoping | Automatic named graphs | Manual | Database-level |
@@ -106,7 +106,7 @@ graph LR
 
 **Core**
 
-- 14 CLI commands covering the full RDF lifecycle
+- 16 CLI commands covering the full RDF lifecycle
 - Project-level configuration with `.opentology.json`
 - Named graph scoping -- queries are automatically scoped to your project
 - Two modes: HTTP (Oxigraph server) and embedded (WASM, zero Docker)
@@ -126,10 +126,16 @@ graph LR
 
 **AI Integration**
 
-- MCP server with 18 tools and 1 resource
+- MCP server with 20 tools and 1 resource
 - `opentology://schema` resource auto-loads ontology overview
 - Works with Claude Code, Cursor, and any MCP-compatible client
 
+**Visualization**
+
+- Interactive graph visualization web UI (`opentology context graph`)
+- Explore classes, instances, and relationships visually with vis-network
+- SPARQL query editor, node filtering, search, and focus mode
+
 ### Two Modes
 
 | | HTTP Mode | Embedded Mode |
@@ -175,6 +181,8 @@ For embedded mode, no additional setup is needed.
 | `opentology infer` | Run RDFS materialization (`--clear` to remove inferred triples) |
 | `opentology graph` | List, create, or drop named graphs |
 | `opentology prefix` | List, add, or remove project prefixes |
+| `opentology context` | Project context management (`init`, `load`, `status`, `scan`, `graph`) |
+| `opentology viz` | Visualize ontology schema (`schema`) |
 | `opentology mcp` | Start the MCP server |
 
 ### MCP Integration
@@ -192,7 +200,7 @@ Add to your MCP client configuration (`.mcp.json`):
 }
 ```
 
-**18 Tools:**
+**20 Tools:**
 
 | Tool | Description |
 |------|-------------|
@@ -210,10 +218,12 @@ Add to your MCP client configuration (`.mcp.json`):
 | `opentology_graph_list` | List named graphs |
 | `opentology_graph_create` | Create a named graph |
 | `opentology_graph_drop` | Drop a named graph |
+| `opentology_visualize` | Generate schema visualization (Mermaid/DOT) |
 | `opentology_context_init` | Initialize project context graph |
 | `opentology_context_load` | Load project context |
 | `opentology_context_status` | Check context initialization status |
 | `opentology_context_scan` | Scan codebase (module or symbol-level) |
+| `opentology_context_graph` | Start interactive graph visualization web UI |
 
 **1 Resource:**
 
@@ -324,8 +334,8 @@ npm install web-tree-sitter tree-sitter-wasms
 
 ### Roadmap
 
-- [x] CLI with 14 commands
-- [x] MCP server with 18 tools and 1 resource
+- [x] CLI with 16 commands
+- [x] MCP server with 20 tools and 1 resource
 - [x] Schema introspection (MCP resource + tool)
 - [x] Complete CRUD (push --replace, drop, delete)
 - [x] SHACL validation (shape constraints on push)
@@ -338,7 +348,7 @@ npm install web-tree-sitter tree-sitter-wasms
 - [ ] OWL reasoning (owl:sameAs, owl:inverseOf)
 - [ ] Remote ontology import
 - [ ] Version control for ontology snapshots
-- [ ] Web UI for graph exploration
+- [x] Interactive graph visualization web UI
 
 ### Contributing
 
@@ -369,7 +379,7 @@ graph TB
     end
 
     subgraph MCP["MCP Server"]
-        Tools[18 Tools]
+        Tools[20 Tools]
         Resource["opentology://schema"]
     end
 
@@ -389,7 +399,7 @@ graph TB
     Pipeline --> Adapter
 ```
 
-온톨로지 도구들은 개발자 경험이 열악합니다. OpenTology는 터미널에서 RDF의 전체 생애주기를 관리합니다. 프로젝트 초기화, Turtle 작성, SHACL 검증, RDFS 추론이 포함된 푸시, SPARQL 쿼리까지 CLI 하나로 처리합니다. MCP 서버를 내장하고 있어 AI 어시스턴트가 지식 그래프를 직접 다룰 수 있고, Docker 없이 임베디드 모드로 바로 시작할 수 있습니다.
+온톨로지 도구들은 개발자 경험이 열악합니다. OpenTology는 터미널에서 RDF의 전체 생애주기를 관리합니다. 프로젝트 초기화, Turtle 작성, SHACL 검증, RDFS 추론이 포함된 푸시, SPARQL 쿼리, 인터랙티브 그래프 시각화까지 CLI 하나로 처리합니다. MCP 서버를 내장하고 있어 AI 어시스턴트가 지식 그래프를 직접 다룰 수 있고, Docker 없이 임베디드 모드로 바로 시작할 수 있습니다.
 
 ### 시스템 요구사항
 
@@ -444,7 +454,7 @@ graph LR
 | Docker 필수 | 아니오 (임베디드 모드) | 예 | 예 |
 | RDFS 추론 | 푸시 시 자동 | SPARQL CONSTRUCT 수동 작성 | 네이티브 미지원 |
 | SHACL 검증 | 내장 | 별도 도구 필요 | 해당 없음 |
-| AI 연동 | MCP 서버 18개 도구 | 없음 | 플러그인 생태계 |
+| AI 연동 | MCP 서버 20개 도구 | 없음 | 플러그인 생태계 |
 | 쿼리 언어 | SPARQL (접두사 자동 삽입) | SPARQL (수동) | Cypher |
 | 데이터 형식 | Turtle 파일 | Turtle/N-Triples | 속성 그래프 |
 | 프로젝트 구분 | Named Graph 자동 | 수동 관리 | 데이터베이스 단위 |
@@ -453,7 +463,7 @@ graph LR
 
 **핵심**
 
-- RDF 전체 생애주기를 다루는 14개 CLI 명령어
+- RDF 전체 생애주기를 다루는 16개 CLI 명령어
 - `.opentology.json` 기반 프로젝트 설정
 - Named Graph 자동 스코핑 -- 쿼리가 프로젝트 그래프에 자동 한정
 - HTTP 모드(Oxigraph 서버)와 임베디드 모드(WASM, Docker 불필요) 지원
@@ -473,10 +483,16 @@ graph LR
 
 **AI 연동**
 
-- 18개 도구와 1개 리소스를 제공하는 MCP 서버
+- 20개 도구와 1개 리소스를 제공하는 MCP 서버
 - `opentology://schema` 리소스로 온톨로지 개요 자동 로드
 - Claude Code, Cursor 등 MCP 호환 클라이언트와 연동
 
+**시각화**
+
+- 인터랙티브 그래프 시각화 웹 UI (`opentology context graph`)
+- vis-network로 클래스, 인스턴스, 관계를 시각적으로 탐색
+- SPARQL 쿼리 편집기, 노드 필터링, 검색, 포커스 모드
+
 ### 두 가지 모드
 
 | | HTTP 모드 | 임베디드 모드 |
@@ -522,6 +538,8 @@ docker run -p 7878:7878 ghcr.io/oxigraph/oxigraph \
 | `opentology infer` | RDFS 물질화 실행 (`--clear`로 추론 트리플 제거) |
 | `opentology graph` | Named Graph 목록/생성/삭제 |
 | `opentology prefix` | 프로젝트 접두사 목록/추가/제거 |
+| `opentology context` | 프로젝트 컨텍스트 관리 (`init`, `load`, `status`, `scan`, `graph`) |
+| `opentology viz` | 온톨로지 스키마 시각화 (`schema`) |
 | `opentology mcp` | MCP 서버 시작 |
 
 ### MCP 연동
@@ -539,7 +557,7 @@ MCP 클라이언트 설정 파일(`.mcp.json`)에 추가:
 }
 ```
 
-**18개 도구:**
+**20개 도구:**
 
 | 도구 | 설명 |
 |------|------|
@@ -557,10 +575,12 @@ MCP 클라이언트 설정 파일(`.mcp.json`)에 추가:
 | `opentology_graph_list` | Named Graph 목록 조회 |
 | `opentology_graph_create` | Named Graph 생성 |
 | `opentology_graph_drop` | Named Graph 삭제 |
+| `opentology_visualize` | 스키마 시각화 생성 (Mermaid/DOT) |
 | `opentology_context_init` | 프로젝트 컨텍스트 그래프 초기화 |
 | `opentology_context_load` | 프로젝트 컨텍스트 로드 |
 | `opentology_context_status` | 컨텍스트 초기화 상태 확인 |
 | `opentology_context_scan` | 코드베이스 스캔 (모듈/심볼 수준) |
+| `opentology_context_graph` | 인터랙티브 그래프 시각화 웹 UI 시작 |
 
 **1개 리소스:**
 
@@ -671,8 +691,8 @@ npm install web-tree-sitter tree-sitter-wasms
 
 ### 로드맵
 
-- [x] 14개 CLI 명령어
-- [x] 18개 도구와 1개 리소스를 갖춘 MCP 서버
+- [x] 16개 CLI 명령어
+- [x] 20개 도구와 1개 리소스를 갖춘 MCP 서버
 - [x] 스키마 조회 (MCP 리소스 + 도구)
 - [x] 완전한 CRUD (push --replace, drop, delete)
 - [x] SHACL 검증 (푸시 시 형상 제약 자동 검증)
@@ -685,7 +705,7 @@ npm install web-tree-sitter tree-sitter-wasms
 - [ ] OWL 추론 (owl:sameAs, owl:inverseOf)
 - [ ] 원격 온톨로지 임포트
 - [ ] 온톨로지 스냅샷 버전 관리
-- [ ] 그래프 탐색 웹 UI
+- [x] 인터랙티브 그래프 시각화 웹 UI
 
 ### 기여 방법
 

package/dist/commands/context.js

@@ -3,6 +3,7 @@ import { existsSync, mkdirSync, writeFileSync, unlinkSync, readdirSync } from 'n
 import { join } from 'node:path';
 import { loadConfig, saveConfig } from '../lib/config.js';
 import { createReadyAdapter } from '../lib/store-factory.js';
+import { startGraphServer } from '../lib/graph-server.js';
 import { OTX_BOOTSTRAP_TURTLE } from '../templates/otx-ontology.js';
 import { generateContextSection, updateClaudeMd } from '../templates/claude-md-context.js';
 import { generateHookScript } from '../templates/session-start-hook.js';
@@ -366,4 +367,38 @@ export function registerContext(program) {
             console.log('CLAUDE.md:   ' + (hasMarkers ? pc.green('markers present') : pc.yellow('markers missing')));
         }
     });
+    // --- context graph ---
+    context
+        .command('graph')
+        .description('Open interactive graph visualization in the browser')
+        .option('--port <number>', 'Server port (default: auto)', parseInt)
+        .action(async (opts) => {
+        let config;
+        try {
+            config = loadConfig();
+        }
+        catch {
+            console.error(pc.red('Error: No .opentology.json found. Run `opentology init` first.'));
+            process.exit(1);
+        }
+        const graphs = config.graphs ?? {};
+        if (!graphs['context']) {
+            console.error(pc.red('Error: Context not initialized. Run `opentology context init` first.'));
+            process.exit(1);
+        }
+        try {
+            const { port } = await startGraphServer({ port: opts.port });
+            const url = `http://localhost:${port}`;
+            console.log(pc.green(`Graph server running at ${url}`));
+            // Open browser
+            const { exec } = await import('node:child_process');
+            const cmd = process.platform === 'darwin' ? 'open' : process.platform === 'win32' ? 'start' : 'xdg-open';
+            exec(`${cmd} ${url}`);
+            console.log(pc.dim('Press Ctrl+C to stop the server.'));
+        }
+        catch (err) {
+            console.error(pc.red(`Error: ${err.message}`));
+            process.exit(1);
+        }
+    });
 }

package/dist/lib/graph-server.d.ts

@@ -0,0 +1,7 @@
+export interface GraphServerOptions {
+    port?: number;
+}
+export declare function startGraphServer(opts?: GraphServerOptions): Promise<{
+    port: number;
+    close: () => void;
+}>;

package/dist/lib/graph-server.js

@@ -0,0 +1,531 @@
+import { createServer } from 'node:http';
+import { loadConfig } from './config.js';
+import { createReadyAdapter } from './store-factory.js';
+function html(config) {
+    const projectId = config.projectId;
+    return `<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <title>OpenTology — ${projectId}</title>
+  <script src="https://unpkg.com/vis-network@9.1.9/standalone/umd/vis-network.min.js"></script>
+  <style>
+    * { margin: 0; padding: 0; box-sizing: border-box; }
+    body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif; background: #ffffff; color: #1f2328; }
+    #app { display: flex; height: 100vh; overflow: hidden; }
+    #sidebar { width: 320px; min-width: 320px; background: #f6f8fa; border-right: 1px solid #d1d9e0; display: flex; flex-direction: column; overflow: hidden; }
+    #sidebar h1 { padding: 16px; font-size: 16px; border-bottom: 1px solid #d1d9e0; color: #0550ae; }
+    #graph-list { padding: 8px 16px; border-bottom: 1px solid #d1d9e0; }
+    #graph-list select { width: 100%; padding: 6px 8px; background: #ffffff; color: #1f2328; border: 1px solid #d1d9e0; border-radius: 6px; font-size: 13px; }
+    #query-box { padding: 12px 16px; border-bottom: 1px solid #d1d9e0; }
+    #query-box textarea { width: 100%; height: 80px; padding: 8px; background: #ffffff; color: #1f2328; border: 1px solid #d1d9e0; border-radius: 6px; font-family: 'SF Mono', Monaco, monospace; font-size: 12px; resize: vertical; }
+    #query-box button { margin-top: 8px; padding: 6px 16px; background: #1a7f37; color: #fff; border: none; border-radius: 6px; cursor: pointer; font-size: 13px; }
+    #query-box button:hover { background: #218739; }
+    #details { flex: 1; overflow-y: auto; padding: 12px 16px; font-size: 13px; }
+    #details h3 { color: #0550ae; margin-bottom: 8px; }
+    #details table { width: 100%; border-collapse: collapse; }
+    #details td { padding: 4px 6px; border-bottom: 1px solid #d1d9e0; word-break: break-all; }
+    #details td:first-child { color: #656d76; width: 90px; }
+    #results-table { display: none; padding: 12px 16px; overflow: auto; max-height: 300px; border-bottom: 1px solid #d1d9e0; }
+    #results-table table { width: 100%; border-collapse: collapse; font-size: 12px; }
+    #results-table th { text-align: left; padding: 6px 8px; background: #eef1f5; border-bottom: 2px solid #d1d9e0; color: #0550ae; position: sticky; top: 0; }
+    #results-table td { padding: 4px 8px; border-bottom: 1px solid #d1d9e0; word-break: break-all; }
+    #results-table tr:hover td { background: #f0f4ff; }
+    #center { flex: 1; display: flex; flex-direction: column; position: relative; min-height: 0; overflow: hidden; }
+    #network-wrap { flex: 1; position: relative; min-height: 0; overflow: hidden; }
+    #network { position: absolute; top: 0; left: 0; right: 0; bottom: 0; }
+    #focus-bar { display: none; padding: 8px 16px; background: #ddf4ff; border-bottom: 1px solid #54aeff; font-size: 13px; color: #0550ae; align-items: center; gap: 8px; }
+    #focus-bar button { padding: 4px 12px; background: #0550ae; color: #fff; border: none; border-radius: 6px; cursor: pointer; font-size: 12px; }
+    #focus-bar button:hover { background: #0969da; }
+    #filter-panel { width: 280px; min-width: 280px; background: #f6f8fa; border-left: 1px solid #d1d9e0; display: flex; flex-direction: column; overflow: hidden; }
+    .panel-section { border-bottom: 1px solid #d1d9e0; }
+    .panel-header { padding: 10px 16px; font-size: 13px; font-weight: 600; color: #1f2328; cursor: pointer; display: flex; justify-content: space-between; align-items: center; user-select: none; }
+    .panel-header:hover { background: #eef1f5; }
+    .panel-header .arrow { font-size: 10px; color: #656d76; transition: transform 0.15s; }
+    .panel-header .arrow.collapsed { transform: rotate(-90deg); }
+    .panel-body { padding: 4px 16px 10px; }
+    .panel-body.collapsed { display: none; }
+    .filter-item { display: flex; align-items: center; gap: 8px; padding: 3px 0; font-size: 12px; cursor: pointer; }
+    .filter-item:hover { color: #0550ae; }
+    .filter-item input { margin: 0; cursor: pointer; }
+    .filter-count { color: #656d76; margin-left: auto; font-size: 11px; }
+    .filter-actions { display: flex; gap: 8px; padding: 6px 0 2px; }
+    .filter-actions button { padding: 2px 8px; background: none; border: 1px solid #d1d9e0; border-radius: 4px; cursor: pointer; font-size: 11px; color: #656d76; }
+    .filter-actions button:hover { background: #eef1f5; color: #1f2328; }
+    #search-box { padding: 10px 16px; border-bottom: 1px solid #d1d9e0; }
+    #search-box input { width: 100%; padding: 6px 10px; background: #ffffff; color: #1f2328; border: 1px solid #d1d9e0; border-radius: 6px; font-size: 13px; outline: none; }
+    #search-box input:focus { border-color: #0969da; box-shadow: 0 0 0 3px rgba(9,105,218,0.15); }
+    #search-results { max-height: 200px; overflow-y: auto; padding: 0 16px; }
+    .search-item { padding: 5px 8px; font-size: 12px; cursor: pointer; border-radius: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
+    .search-item:hover { background: #ddf4ff; color: #0550ae; }
+    .filter-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
+    .legend { position: absolute; bottom: 16px; left: 16px; background: #f6f8faee; padding: 12px 16px; border-radius: 8px; border: 1px solid #d1d9e0; font-size: 12px; color: #1f2328; }
+    .legend-item { display: flex; align-items: center; gap: 8px; margin: 4px 0; }
+    .legend-dot { width: 12px; height: 12px; border-radius: 50%; }
+    .stats { padding: 8px 16px; border-bottom: 1px solid #d1d9e0; font-size: 12px; color: #656d76; }
+  </style>
+</head>
+<body>
+  <div id="app">
+    <div id="sidebar">
+      <h1>OpenTology — ${projectId}</h1>
+      <div id="graph-list">
+        <select id="graphSelect"><option value="">Loading graphs...</option></select>
+      </div>
+      <div class="stats" id="stats"></div>
+      <div id="query-box">
+        <textarea id="sparql" placeholder="SPARQL query...">SELECT ?s ?p ?o WHERE { ?s ?p ?o } LIMIT 100</textarea>
+        <button onclick="runQuery()">Run Query</button>
+      </div>
+      <div id="results-table"></div>
+      <div id="details"></div>
+    </div>
+    <div id="center">
+      <div id="focus-bar">
+        <span id="focus-label"></span>
+        <button onclick="exitFocus()">Show All</button>
+      </div>
+      <div id="network-wrap">
+      <div id="network">
+        <div class="legend">
+          <div class="legend-item"><div class="legend-dot" style="background:#0550ae"></div> Class</div>
+          <div class="legend-item"><div class="legend-dot" style="background:#cf222e"></div> Instance</div>
+          <div class="legend-item"><div class="legend-dot" style="background:#1a7f37"></div> Property</div>
+          <div class="legend-item"><div class="legend-dot" style="background:#ffffff;border:1px solid #d1d9e0"></div> Literal</div>
+        </div>
+      </div>
+      </div>
+    </div>
+    <div id="filter-panel">
+      <div id="search-box">
+        <input type="text" id="searchInput" placeholder="Search nodes..." oninput="onSearch(this.value)" />
+      </div>
+      <div id="search-results"></div>
+      <div class="panel-section">
+        <div class="panel-header" onclick="toggleSection(this)">Node Types <span class="arrow">&#9660;</span></div>
+        <div class="panel-body" id="nodeTypeFilters"></div>
+      </div>
+      <div class="panel-section">
+        <div class="panel-header" onclick="toggleSection(this)">Classes (rdf:type) <span class="arrow">&#9660;</span></div>
+        <div class="panel-body" id="classFilters"></div>
+      </div>
+    </div>
+  </div>
+  <script>
+    const COLORS = {
+      class: '#0550ae', instance: '#cf222e', property: '#1a7f37',
+      literal: '#ffffff', edge: '#d1d9e0', edgeLabel: '#656d76'
+    };
+    const NODE_TYPE_COLORS = { Class: COLORS.class, Instance: COLORS.instance, Property: COLORS.property, Literal: COLORS.literal };
+    const PREFIXES = {
+      'http://www.w3.org/1999/02/22-rdf-syntax-ns#': 'rdf:',
+      'http://www.w3.org/2000/01/rdf-schema#': 'rdfs:',
+      'http://www.w3.org/2002/07/owl#': 'owl:',
+      'http://www.w3.org/2001/XMLSchema#': 'xsd:',
+      'https://opentology.dev/vocab#': 'otx:',
+    };
+    const RDF_TYPE = 'http://www.w3.org/1999/02/22-rdf-syntax-ns#type';
+
+    function shorten(uri) {
+      if (!uri) return '';
+      for (const [full, prefix] of Object.entries(PREFIXES)) {
+        if (uri.startsWith(full)) return prefix + uri.slice(full.length);
+      }
+      const hash = uri.lastIndexOf('#');
+      if (hash > 0) return uri.slice(hash + 1);
+      const slash = uri.lastIndexOf('/');
+      if (slash > 0) return uri.slice(slash + 1);
+      return uri;
+    }
+
+    let network, nodesDS, edgesDS, classSet = new Set();
+    // Full graph data for filtering
+    let allNodes = new Map(), allEdges = [];
+    // rdf:type map: nodeId -> Set of class URIs
+    let nodeTypeMap = new Map();
+    // Filter state
+    let activeNodeTypes = new Set(['Class', 'Instance', 'Property', 'Literal']);
+    let activeClasses = new Set();
+    let allClasses = new Map(); // classUri -> count
+    let focusNodeId = null;
+
+    function getNodeType(id) {
+      if (id.includes('|')) return 'Literal';
+      if (classSet.has(id)) return 'Class';
+      if (id.startsWith('http://www.w3.org/') || id.startsWith('https://opentology.dev/vocab#')) return 'Property';
+      return 'Instance';
+    }
+
+    async function init() {
+      const gs = await fetch('/api/graphs').then(r => r.json());
+      const sel = document.getElementById('graphSelect');
+      sel.innerHTML = '';
+      for (const g of gs) {
+        sel.innerHTML += '<option value="' + g.uri + '">' + g.name + ' (' + g.triples + ')</option>';
+      }
+      sel.onchange = () => { exitFocus(); loadGraph(sel.value); };
+
+      try {
+        const schema = await fetch('/api/schema').then(r => r.json());
+        (schema.classes || []).forEach(c => classSet.add(c));
+      } catch {}
+
+      nodesDS = new vis.DataSet();
+      edgesDS = new vis.DataSet();
+      network = new vis.Network(document.getElementById('network'), { nodes: nodesDS, edges: edgesDS }, {
+        physics: { solver: 'forceAtlas2Based', forceAtlas2Based: { gravitationalConstant: -80, springLength: 120 } },
+        nodes: { shape: 'dot', font: { color: '#1f2328', size: 12 }, borderWidth: 0 },
+        edges: { arrows: 'to', color: { color: COLORS.edge, highlight: '#0550ae' }, font: { color: COLORS.edgeLabel, size: 10, strokeWidth: 0 }, smooth: { type: 'curvedCW', roundness: 0.15 } },
+        interaction: { hover: true, tooltipDelay: 100 },
+      });
+      network.on('click', params => {
+        if (params.nodes.length) {
+          const nid = params.nodes[0];
+          showNodeDetails(nid);
+          enterFocus(nid);
+        }
+      });
+      loadGraph(sel.value);
+    }
+
+    async function loadGraph(graphUri) {
+      const q = graphUri
+        ? 'SELECT ?s ?p ?o WHERE { GRAPH <' + graphUri + '> { ?s ?p ?o } } LIMIT 500'
+        : 'SELECT ?s ?p ?o WHERE { ?s ?p ?o } LIMIT 500';
+      document.getElementById('sparql').value = q;
+      await runQuery();
+    }
+
+    async function runQuery() {
+      const sparql = document.getElementById('sparql').value;
+      const res = await fetch('/api/query?sparql=' + encodeURIComponent(sparql) + '&raw=true').then(r => r.json());
+      const bindings = res.results?.bindings || [];
+      const vars = res.head?.vars || [];
+      const isSPO = vars.includes('s') && vars.includes('p') && vars.includes('o');
+      const tableEl = document.getElementById('results-table');
+      if (isSPO) {
+        tableEl.style.display = 'none';
+        buildGraphData(bindings);
+        applyFilters();
+        buildFilterPanel();
+      } else {
+        renderTable(vars, bindings);
+        nodesDS.clear(); edgesDS.clear();
+      }
+      document.getElementById('stats').textContent = bindings.length + ' results';
+    }
+
+    function renderTable(vars, bindings) {
+      const tableEl = document.getElementById('results-table');
+      if (!bindings.length) {
+        tableEl.style.display = 'block';
+        tableEl.innerHTML = '<p style="color:#656d76">No results</p>';
+        return;
+      }
+      let h = '<table><thead><tr>';
+      for (const v of vars) h += '<th>' + v + '</th>';
+      h += '</tr></thead><tbody>';
+      for (const b of bindings) {
+        h += '<tr>';
+        for (const v of vars) {
+          const cell = b[v];
+          const val = cell ? (cell.type === 'uri' ? shorten(cell.value) : cell.value) : '';
+          h += '<td>' + val + '</td>';
+        }
+        h += '</tr>';
+      }
+      h += '</tbody></table>';
+      tableEl.style.display = 'block';
+      tableEl.innerHTML = h;
+    }
+
+    function nodeColor(uri) {
+      if (classSet.has(uri)) return COLORS.class;
+      if (uri.startsWith('http://www.w3.org/') || uri.startsWith('https://opentology.dev/vocab#')) return COLORS.property;
+      return COLORS.instance;
+    }
+
+    function buildGraphData(bindings) {
+      allNodes = new Map();
+      allEdges = [];
+      nodeTypeMap = new Map();
+      allClasses = new Map();
+
+      // First pass: collect rdf:type relationships
+      for (const b of bindings) {
+        if (b.p && b.p.value === RDF_TYPE && b.o && (b.o.type === 'uri' || b.o.type === 'bnode')) {
+          if (!nodeTypeMap.has(b.s.value)) nodeTypeMap.set(b.s.value, new Set());
+          nodeTypeMap.get(b.s.value).add(b.o.value);
+        }
+      }
+
+      // Second pass: build nodes and edges
+      for (const b of bindings) {
+        const ks = Object.keys(b);
+        if (!ks.includes('s') || !ks.includes('p') || !ks.includes('o')) continue;
+        const s = b.s, p = b.p, o = b.o;
+        if (!allNodes.has(s.value)) {
+          allNodes.set(s.value, { id: s.value, label: shorten(s.value), color: nodeColor(s.value), size: 14, title: s.value });
+        }
+        if (o.type === 'uri' || o.type === 'bnode') {
+          if (!allNodes.has(o.value)) {
+            allNodes.set(o.value, { id: o.value, label: shorten(o.value), color: nodeColor(o.value), size: 12, title: o.value });
+          }
+          allEdges.push({ from: s.value, to: o.value, label: shorten(p.value), title: p.value });
+        } else {
+          const litId = s.value + '|' + p.value + '|' + o.value;
+          const litLabel = o.value.length > 40 ? o.value.slice(0, 40) + '...' : o.value;
+          if (!allNodes.has(litId)) {
+            allNodes.set(litId, { id: litId, label: litLabel, color: { background: COLORS.literal, border: '#d1d9e0' }, borderWidth: 1, size: 8, shape: 'box', font: { size: 10, color: '#1f2328' }, title: o.value });
+          }
+          allEdges.push({ from: s.value, to: litId, label: shorten(p.value), title: p.value });
+        }
+      }
+
+      // Build class counts
+      for (const [nodeId, types] of nodeTypeMap) {
+        for (const cls of types) {
+          allClasses.set(cls, (allClasses.get(cls) || 0) + 1);
+        }
+      }
+      activeClasses = new Set(allClasses.keys());
+    }
+
+    function applyFilters() {
+      const visibleNodes = new Set();
+      for (const [id, node] of allNodes) {
+        const ntype = getNodeType(id);
+        if (!activeNodeTypes.has(ntype)) continue;
+        // For instances, check class filter
+        if (ntype === 'Instance' && nodeTypeMap.has(id)) {
+          const types = nodeTypeMap.get(id);
+          let anyActive = false;
+          for (const t of types) { if (activeClasses.has(t)) { anyActive = true; break; } }
+          if (!anyActive) continue;
+        }
+        visibleNodes.add(id);
+      }
+
+      // If focus mode, restrict to neighbors
+      if (focusNodeId && visibleNodes.has(focusNodeId)) {
+        const neighbors = new Set([focusNodeId]);
+        for (const e of allEdges) {
+          if (e.from === focusNodeId && visibleNodes.has(e.to)) neighbors.add(e.to);
+          if (e.to === focusNodeId && visibleNodes.has(e.from)) neighbors.add(e.from);
+        }
+        for (const id of [...visibleNodes]) {
+          if (!neighbors.has(id)) visibleNodes.delete(id);
+        }
+      }
+
+      const filteredEdges = allEdges.filter(e => visibleNodes.has(e.from) && visibleNodes.has(e.to));
+
+      nodesDS.clear(); edgesDS.clear();
+      const nodeArr = [];
+      for (const id of visibleNodes) {
+        const n = { ...allNodes.get(id) };
+        if (focusNodeId === id) { n.size = 22; n.borderWidth = 3; n.color = { background: n.color.background || n.color, border: '#0969da' }; }
+        nodeArr.push(n);
+      }
+      nodesDS.add(nodeArr);
+      edgesDS.add(filteredEdges);
+      network.fit();
+    }
+
+    function buildFilterPanel() {
+      // Node types
+      const ntEl = document.getElementById('nodeTypeFilters');
+      let ntHtml = '<div class="filter-actions"><button onclick="toggleAll(\\'nodeType\\', true)">All</button><button onclick="toggleAll(\\'nodeType\\', false)">None</button></div>';
+      for (const t of ['Class', 'Instance', 'Property', 'Literal']) {
+        const c = NODE_TYPE_COLORS[t];
+        const bg = t === 'Literal' ? '#ffffff;border:1px solid #d1d9e0' : c;
+        let count = 0;
+        for (const [id] of allNodes) { if (getNodeType(id) === t) count++; }
+        ntHtml += '<label class="filter-item"><input type="checkbox" ' + (activeNodeTypes.has(t) ? 'checked' : '') + ' onchange="toggleNodeType(\\'' + t + '\\', this.checked)"><div class="filter-dot" style="background:' + bg + '"></div>' + t + '<span class="filter-count">' + count + '</span></label>';
+      }
+      ntEl.innerHTML = ntHtml;
+
+      // Classes
+      const clEl = document.getElementById('classFilters');
+      const sorted = [...allClasses.entries()].sort((a, b) => b[1] - a[1]);
+      let clHtml = '<div class="filter-actions"><button onclick="toggleAll(\\'class\\', true)">All</button><button onclick="toggleAll(\\'class\\', false)">None</button></div>';
+      if (!sorted.length) {
+        clHtml += '<div style="color:#656d76;font-size:12px;padding:4px 0">No typed instances</div>';
+      }
+      for (const [cls, count] of sorted) {
+        clHtml += '<label class="filter-item"><input type="checkbox" ' + (activeClasses.has(cls) ? 'checked' : '') + ' onchange="toggleClass(\\'' + cls.replace(/'/g, "\\\\'") + '\\', this.checked)">' + shorten(cls) + '<span class="filter-count">' + count + '</span></label>';
+      }
+      clEl.innerHTML = clHtml;
+    }
+
+    function toggleNodeType(t, on) {
+      if (on) activeNodeTypes.add(t); else activeNodeTypes.delete(t);
+      applyFilters();
+    }
+    function toggleClass(cls, on) {
+      if (on) activeClasses.add(cls); else activeClasses.delete(cls);
+      applyFilters();
+    }
+    function toggleAll(kind, on) {
+      if (kind === 'nodeType') {
+        activeNodeTypes = on ? new Set(['Class', 'Instance', 'Property', 'Literal']) : new Set();
+      } else {
+        activeClasses = on ? new Set(allClasses.keys()) : new Set();
+      }
+      applyFilters();
+      buildFilterPanel();
+    }
+
+    function toggleSection(header) {
+      const body = header.nextElementSibling;
+      const arrow = header.querySelector('.arrow');
+      body.classList.toggle('collapsed');
+      arrow.classList.toggle('collapsed');
+    }
+
+    // Search
+    function onSearch(query) {
+      const el = document.getElementById('search-results');
+      if (!query || query.length < 2) { el.innerHTML = ''; return; }
+      const q = query.toLowerCase();
+      const matches = [];
+      for (const [id, node] of allNodes) {
+        if (node.label.toLowerCase().includes(q) || id.toLowerCase().includes(q)) {
+          matches.push({ id, label: node.label });
+          if (matches.length >= 20) break;
+        }
+      }
+      el.innerHTML = matches.map(m =>
+        '<div class="search-item" onclick="focusNode(\\'' + m.id.replace(/'/g, "\\\\'") + '\\')">' + m.label + '</div>'
+      ).join('');
+    }
+
+    // Focus mode
+    function focusNode(nodeId) {
+      enterFocus(nodeId);
+      showNodeDetails(nodeId);
+      document.getElementById('searchInput').value = '';
+      document.getElementById('search-results').innerHTML = '';
+    }
+
+    function enterFocus(nodeId) {
+      if (!allNodes.has(nodeId)) return;
+      focusNodeId = nodeId;
+      const bar = document.getElementById('focus-bar');
+      document.getElementById('focus-label').textContent = 'Focused: ' + shorten(nodeId);
+      bar.style.display = 'flex';
+      applyFilters();
+    }
+
+    function exitFocus() {
+      focusNodeId = null;
+      document.getElementById('focus-bar').style.display = 'none';
+      applyFilters();
+    }
+
+    async function showNodeDetails(nodeId) {
+      const cleanId = nodeId.includes('|') ? nodeId.split('|')[0] : nodeId;
+      const q = 'SELECT ?p ?o WHERE { <' + cleanId + '> ?p ?o }';
+      const res = await fetch('/api/query?sparql=' + encodeURIComponent(q) + '&raw=true').then(r => r.json());
+      const bindings = res.results?.bindings || [];
+      let html = '<h3>' + shorten(cleanId) + '</h3><table>';
+      for (const b of bindings) {
+        html += '<tr><td>' + shorten(b.p.value) + '</td><td>' + (b.o.type === 'uri' ? shorten(b.o.value) : b.o.value) + '</td></tr>';
+      }
+      html += '</table>';
+      document.getElementById('details').innerHTML = html;
+    }
+
+    init();
+  </script>
+</body>
+</html>`;
+}
+function cors(res) {
+    res.setHeader('Access-Control-Allow-Origin', '*');
+    res.setHeader('Access-Control-Allow-Methods', 'GET, OPTIONS');
+}
+function json(res, data) {
+    cors(res);
+    res.setHeader('Content-Type', 'application/json');
+    res.end(JSON.stringify(data));
+}
+export async function startGraphServer(opts = {}) {
+    const config = loadConfig();
+    const adapter = await createReadyAdapter(config);
+    const server = createServer(async (req, res) => {
+        const url = new URL(req.url ?? '/', `http://localhost`);
+        const path = url.pathname;
+        if (req.method === 'OPTIONS') {
+            cors(res);
+            res.end();
+            return;
+        }
+        try {
+            if (path === '/' || path === '/index.html') {
+                cors(res);
+                res.setHeader('Content-Type', 'text/html');
+                res.end(html(config));
+                return;
+            }
+            if (path === '/api/graphs') {
+                const graphs = config.graphs ?? {};
+                const result = [];
+                for (const [name, uri] of Object.entries(graphs)) {
+                    const triples = await adapter.getGraphTripleCount(uri).catch(() => 0);
+                    result.push({ name, uri, triples });
+                }
+                // Also include default graph
+                const defaultTriples = await adapter.getGraphTripleCount(config.graphUri).catch(() => 0);
+                result.unshift({ name: 'default', uri: config.graphUri, triples: defaultTriples });
+                json(res, result);
+                return;
+            }
+            if (path === '/api/schema') {
+                const graphUri = url.searchParams.get('graphUri') ?? config.graphUri;
+                const overview = await adapter.getSchemaOverview(graphUri);
+                json(res, overview);
+                return;
+            }
+            if (path === '/api/query') {
+                const sparql = url.searchParams.get('sparql');
+                if (!sparql) {
+                    res.statusCode = 400;
+                    json(res, { error: 'Missing sparql parameter' });
+                    return;
+                }
+                const raw = url.searchParams.get('raw') === 'true';
+                let query = sparql;
+                if (!raw) {
+                    const { hasGraphScope, autoScopeQuery } = await import('./sparql-utils.js');
+                    if (!hasGraphScope(query)) {
+                        const scoped = autoScopeQuery(query, config.graphUri);
+                        if (scoped)
+                            query = scoped;
+                    }
+                }
+                const result = await adapter.sparqlQuery(query);
+                json(res, result);
+                return;
+            }
+            res.statusCode = 404;
+            json(res, { error: 'Not found' });
+        }
+        catch (err) {
+            res.statusCode = 500;
+            json(res, { error: err.message });
+        }
+    });
+    const port = opts.port ?? 0; // 0 = auto-assign
+    return new Promise((resolve) => {
+        server.listen(port, '127.0.0.1', () => {
+            const addr = server.address();
+            const assignedPort = typeof addr === 'object' && addr ? addr.port : port;
+            resolve({
+                port: assignedPort,
+                close: () => server.close(),
+            });
+        });
+    });
+}

package/dist/mcp/server.js

@@ -17,6 +17,7 @@ import { generateContextSection, updateClaudeMd } from '../templates/claude-md-c
 import { generateHookScript } from '../templates/session-start-hook.js';
 import { generateSlashCommands } from '../templates/slash-commands.js';
 import { scanCodebase } from '../lib/codebase-scanner.js';
+import { startGraphServer } from '../lib/graph-server.js';
 export const MAX_TRIPLES_PER_PUSH = 100;
 export function assertTripleLimit(tripleCount) {
     if (tripleCount > MAX_TRIPLES_PER_PUSH) {
@@ -333,7 +334,7 @@ async function handleContextScan(args) {
             _experimental: true,
             _hint: pushStats
                 ? `Symbol triples pushed: ${pushStats.triplesInserted} triples in ${pushStats.batchCount} batches. Query with: SELECT ?c WHERE { ?c a otx:Class ; otx:definedIn <urn:module:...> }`
-                : 'Deep scan completed but triple push failed. Use opentology_push manually with the generated triples.',
+                : 'Deep scan completed but triple push failed. Use push manually with the generated triples.',
         };
     }
     // Default: module-level scan (existing behavior)
@@ -342,8 +343,8 @@ async function handleContextScan(args) {
     return {
         codebaseSnapshot: snapshot,
         _hint: snapshot.dependencyGraph && snapshot.dependencyGraph.modules.length > 0
-            ? 'Analyze codebaseSnapshot and push Knowledge triples via opentology_push. Module dependency triples (otx:Module + otx:dependsOn) are available in dependencyGraph — push them to the context graph as-is.'
-            : 'Analyze codebaseSnapshot and push Knowledge triples via opentology_push. No dependency graph was auto-extracted (non-JS/TS project or parsing issue). Inspect key source files manually and push otx:Module + otx:dependsOn triples for the important modules you identify.',
+            ? 'Analyze codebaseSnapshot and push Knowledge triples via push. Module dependency triples (otx:Module + otx:dependsOn) are available in dependencyGraph — push them to the context graph as-is.'
+            : 'Analyze codebaseSnapshot and push Knowledge triples via push. No dependency graph was auto-extracted (non-JS/TS project or parsing issue). Inspect key source files manually and push otx:Module + otx:dependsOn triples for the important modules you identify.',
     };
 }
 async function handleContextInit(args) {
@@ -461,7 +462,7 @@ async function handleContextLoad() {
     const config = loadConfig();
     const graphs = config.graphs ?? {};
     if (!graphs['context'] || !graphs['sessions']) {
-        throw new Error('Context not initialized. Use opentology_context_init first.');
+        throw new Error('Context not initialized. Use context_init first.');
     }
     const contextUri = graphs['context'];
     const sessionsUri = graphs['sessions'];
@@ -669,7 +670,7 @@ export async function startMcpServer() {
     server.setRequestHandler(ListToolsRequestSchema, async () => ({
         tools: [
             {
-                name: 'opentology_init',
+                name: 'init',
                 description: 'Initialize a new OpenTology project. Creates .opentology.json config with the project ID, SPARQL endpoint, and named graph URI. Must be run before other tools if no config exists.',
                 inputSchema: {
                     type: 'object',
@@ -692,7 +693,7 @@ export async function startMcpServer() {
                 },
             },
             {
-                name: 'opentology_validate',
+                name: 'validate',
                 description: 'Validate Turtle (RDF) content for syntax correctness. Returns triple count and prefixes if valid, or an error message if invalid. Use before pushing to catch errors early. When shacl is true, also validates against SHACL shapes in shapes/ directory.',
                 inputSchema: {
                     type: 'object',
@@ -710,7 +711,7 @@ export async function startMcpServer() {
                 },
             },
             {
-                name: 'opentology_push',
+                name: 'push',
                 description: 'Validate and insert Turtle (RDF) triples into the project graph. Validates syntax first, then pushes to the SPARQL endpoint. Auto-validates against SHACL shapes when shapes/ directory exists. Returns success status and triple count. IMPORTANT: Maximum 100 triples per call. For larger datasets, split into multiple pushes of 20-50 triples each.',
                 inputSchema: {
                     type: 'object',
@@ -733,7 +734,7 @@ export async function startMcpServer() {
                         },
                         graph: {
                             type: 'string',
-                            description: 'Logical graph name (as created by opentology_graph_create). Resolves to a graph URI via config.',
+                            description: 'Logical graph name (as created by graph_create). Resolves to a graph URI via config.',
                         },
                         graphUri: {
                             type: 'string',
@@ -744,7 +745,7 @@ export async function startMcpServer() {
                 },
             },
             {
-                name: 'opentology_query',
+                name: 'query',
                 description: 'Execute a SPARQL query against the project graph. Automatically scopes unscoped queries to the project named graph unless raw mode is enabled.',
                 inputSchema: {
                     type: 'object',
@@ -755,7 +756,7 @@ export async function startMcpServer() {
                         },
                         graph: {
                             type: 'string',
-                            description: 'Logical graph name (as created by opentology_graph_create). Resolves to a graph URI via config.',
+                            description: 'Logical graph name (as created by graph_create). Resolves to a graph URI via config.',
                         },
                         graphUri: {
                             type: 'string',
@@ -770,14 +771,14 @@ export async function startMcpServer() {
                 },
             },
             {
-                name: 'opentology_status',
+                name: 'status',
                 description: 'Get the current status of the OpenTology project, including project ID, endpoint, graph URI, and the number of triples stored in the graph.',
                 inputSchema: {
                     type: 'object',
                     properties: {
                         graph: {
                             type: 'string',
-                            description: 'Logical graph name (as created by opentology_graph_create). Resolves to a graph URI via config.',
+                            description: 'Logical graph name (as created by graph_create). Resolves to a graph URI via config.',
                         },
                         graphUri: {
                             type: 'string',
@@ -787,14 +788,14 @@ export async function startMcpServer() {
                 },
             },
             {
-                name: 'opentology_pull',
+                name: 'pull',
                 description: 'Export the entire project graph as Turtle (RDF). Returns all triples from the named graph serialized in Turtle format.',
                 inputSchema: {
                     type: 'object',
                     properties: {
                         graph: {
                             type: 'string',
-                            description: 'Logical graph name (as created by opentology_graph_create). Resolves to a graph URI via config.',
+                            description: 'Logical graph name (as created by graph_create). Resolves to a graph URI via config.',
                         },
                         graphUri: {
                             type: 'string',
@@ -804,7 +805,7 @@ export async function startMcpServer() {
                 },
             },
             {
-                name: 'opentology_schema',
+                name: 'schema',
                 description: 'Inspect the ontology schema. Without parameters, returns all classes and properties (same as opentology://schema resource). With a class parameter, returns detailed info: instance count, properties used by that class, and sample triples.',
                 inputSchema: {
                     type: 'object',
@@ -815,7 +816,7 @@ export async function startMcpServer() {
                         },
                         graph: {
                             type: 'string',
-                            description: 'Logical graph name (as created by opentology_graph_create). Resolves to a graph URI via config.',
+                            description: 'Logical graph name (as created by graph_create). Resolves to a graph URI via config.',
                         },
                         graphUri: {
                             type: 'string',
@@ -825,7 +826,7 @@ export async function startMcpServer() {
                 },
             },
             {
-                name: 'opentology_drop',
+                name: 'drop',
                 description: 'Drop (delete) the entire project graph. Requires confirm: true to prevent accidental deletion.',
                 inputSchema: {
                     type: 'object',
@@ -836,7 +837,7 @@ export async function startMcpServer() {
                         },
                         graph: {
                             type: 'string',
-                            description: 'Logical graph name (as created by opentology_graph_create). Resolves to a graph URI via config.',
+                            description: 'Logical graph name (as created by graph_create). Resolves to a graph URI via config.',
                         },
                         graphUri: {
                             type: 'string',
@@ -847,7 +848,7 @@ export async function startMcpServer() {
                 },
             },
             {
-                name: 'opentology_delete',
+                name: 'delete',
                 description: 'Delete specific triples. Provide Turtle content to remove those exact triples, or a SPARQL WHERE pattern for pattern-based deletion.',
                 inputSchema: {
                     type: 'object',
@@ -862,7 +863,7 @@ export async function startMcpServer() {
                         },
                         graph: {
                             type: 'string',
-                            description: 'Logical graph name (as created by opentology_graph_create). Resolves to a graph URI via config.',
+                            description: 'Logical graph name (as created by graph_create). Resolves to a graph URI via config.',
                         },
                         graphUri: {
                             type: 'string',
@@ -872,7 +873,7 @@ export async function startMcpServer() {
                 },
             },
             {
-                name: 'opentology_diff',
+                name: 'diff',
                 description: 'Compare local Turtle content against the remote graph. Returns added triples (in local but not remote), removed triples (in remote but not local), and count of unchanged triples.',
                 inputSchema: {
                     type: 'object',
@@ -883,7 +884,7 @@ export async function startMcpServer() {
                         },
                         graph: {
                             type: 'string',
-                            description: 'Logical graph name (as created by opentology_graph_create). Resolves to a graph URI via config.',
+                            description: 'Logical graph name (as created by graph_create). Resolves to a graph URI via config.',
                         },
                         graphUri: {
                             type: 'string',
@@ -894,7 +895,7 @@ export async function startMcpServer() {
                 },
             },
             {
-                name: 'opentology_graph_list',
+                name: 'graph_list',
                 description: 'List all named graphs for the project. Shows graph name, URI, and triple count.',
                 inputSchema: {
                     type: 'object',
@@ -902,7 +903,7 @@ export async function startMcpServer() {
                 },
             },
             {
-                name: 'opentology_graph_create',
+                name: 'graph_create',
                 description: 'Create a new named graph. Generates a URI based on the project graph URI and registers it in the config.',
                 inputSchema: {
                     type: 'object',
@@ -916,7 +917,7 @@ export async function startMcpServer() {
                 },
             },
             {
-                name: 'opentology_graph_drop',
+                name: 'graph_drop',
                 description: 'Drop a named graph and remove it from config. Requires confirm: true to prevent accidental deletion.',
                 inputSchema: {
                     type: 'object',
@@ -934,7 +935,7 @@ export async function startMcpServer() {
                 },
             },
             {
-                name: 'opentology_infer',
+                name: 'infer',
                 description: 'Run RDFS inference on the project graph, materializing inferred triples into the main graph (so queries work naturally). A bookkeeping copy is kept in the inference graph for status reporting and clear support. With clear: true, removes inferred triples from both graphs.',
                 inputSchema: {
                     type: 'object',
@@ -945,7 +946,7 @@ export async function startMcpServer() {
                         },
                         graph: {
                             type: 'string',
-                            description: 'Logical graph name (as created by opentology_graph_create). Resolves to a graph URI via config.',
+                            description: 'Logical graph name (as created by graph_create). Resolves to a graph URI via config.',
                         },
                         graphUri: {
                             type: 'string',
@@ -955,7 +956,7 @@ export async function startMcpServer() {
                 },
             },
             {
-                name: 'opentology_context_init',
+                name: 'context_init',
                 description: 'Initialize project context graph for session-based knowledge management. Creates context/sessions named graphs, bootstraps otx ontology vocabulary, generates a Claude Code SessionStart hook script, and updates CLAUDE.md. Idempotent — safe to call multiple times. Use force: true to regenerate hook and CLAUDE.md.',
                 inputSchema: {
                     type: 'object',
@@ -968,15 +969,15 @@ export async function startMcpServer() {
                 },
             },
             {
-                name: 'opentology_context_load',
-                description: 'Load project context: recent sessions (last 3), open issues (up to 10), and recent decisions (last 3) from the context graph. Returns structured JSON. Call this at the start of a session to understand project state. Requires context to be initialized first (opentology_context_init).',
+                name: 'context_load',
+                description: 'Load project context: recent sessions (last 3), open issues (up to 10), and recent decisions (last 3) from the context graph. Returns structured JSON. Call this at the start of a session to understand project state. Requires context to be initialized first (context_init).',
                 inputSchema: {
                     type: 'object',
                     properties: {},
                 },
             },
             {
-                name: 'opentology_context_status',
+                name: 'context_status',
                 description: 'Check whether project context is initialized. Shows graph triple counts, hook script presence, and CLAUDE.md marker status.',
                 inputSchema: {
                     type: 'object',
@@ -984,7 +985,7 @@ export async function startMcpServer() {
                 },
             },
             {
-                name: 'opentology_context_scan',
+                name: 'context_scan',
                 description: 'Scan the current project codebase. depth="module" (default) returns a structured snapshot with file-level dependency graph. depth="symbol" (experimental) extracts class/interface/method-level dependencies and auto-pushes OTX triples to the context graph. Supports TypeScript (ts-morph), Python, Go, Rust, Java, Swift (Tree-sitter).',
                 inputSchema: {
                     type: 'object',
@@ -1023,7 +1024,7 @@ export async function startMcpServer() {
                 },
             },
             {
-                name: 'opentology_visualize',
+                name: 'visualize',
                 description: 'Generate a visual diagram of the graph schema. Returns Mermaid or DOT text showing classes, properties, and their relationships (subClassOf, domain/range).',
                 inputSchema: {
                     type: 'object',
@@ -1040,7 +1041,7 @@ export async function startMcpServer() {
                         },
                         graph: {
                             type: 'string',
-                            description: 'Logical graph name (as created by opentology_graph_create). Resolves to a graph URI via config.',
+                            description: 'Logical graph name (as created by graph_create). Resolves to a graph URI via config.',
                         },
                         graphUri: {
                             type: 'string',
@@ -1049,6 +1050,19 @@ export async function startMcpServer() {
                     },
                 },
             },
+            {
+                name: 'context_graph',
+                description: 'Start an interactive graph visualization web server. Opens a local web UI where you can explore classes, instances, and relationships visually. Returns the server URL. The server runs until the process exits.',
+                inputSchema: {
+                    type: 'object',
+                    properties: {
+                        port: {
+                            type: 'number',
+                            description: 'Server port (default: auto-assigned)',
+                        },
+                    },
+                },
+            },
         ],
     }));
     server.setRequestHandler(CallToolRequestSchema, async (request) => {
@@ -1056,63 +1070,69 @@ export async function startMcpServer() {
         try {
             let result;
             switch (name) {
-                case 'opentology_init':
+                case 'init':
                     result = await handleInit(args);
                     break;
-                case 'opentology_validate':
+                case 'validate':
                     result = await handleValidate(args);
                     break;
-                case 'opentology_push':
+                case 'push':
                     result = await handlePush(args);
                     break;
-                case 'opentology_query':
+                case 'query':
                     result = await handleQuery(args);
                     break;
-                case 'opentology_status':
+                case 'status':
                     result = await handleStatus(args);
                     break;
-                case 'opentology_pull':
+                case 'pull':
                     result = await handlePull(args);
                     break;
-                case 'opentology_schema':
+                case 'schema':
                     result = await handleSchema(args);
                     break;
-                case 'opentology_drop':
+                case 'drop':
                     result = await handleDrop(args);
                     break;
-                case 'opentology_delete':
+                case 'delete':
                     result = await handleDelete(args);
                     break;
-                case 'opentology_diff':
+                case 'diff':
                     result = await handleDiff(args);
                     break;
-                case 'opentology_graph_list':
+                case 'graph_list':
                     result = await handleGraphList(args);
                     break;
-                case 'opentology_graph_create':
+                case 'graph_create':
                     result = await handleGraphCreate(args);
                     break;
-                case 'opentology_graph_drop':
+                case 'graph_drop':
                     result = await handleGraphDrop(args);
                     break;
-                case 'opentology_infer':
+                case 'infer':
                     result = await handleInfer(args);
                     break;
-                case 'opentology_context_scan':
+                case 'context_scan':
                     result = await handleContextScan(args);
                     break;
-                case 'opentology_context_init':
+                case 'context_init':
                     result = await handleContextInit(args);
                     break;
-                case 'opentology_context_load':
+                case 'context_load':
                     result = await handleContextLoad();
                     break;
-                case 'opentology_context_status':
+                case 'context_status':
                     result = await handleContextStatus();
                     break;
-                case 'opentology_visualize':
+                case 'visualize':
                     result = await handleVisualize(args);
                     break;
+                case 'context_graph': {
+                    const port = args.port;
+                    const srv = await startGraphServer({ port });
+                    result = { url: `http://localhost:${srv.port}`, port: srv.port, message: `Graph server running at http://localhost:${srv.port}` };
+                    break;
+                }
                 default:
                     throw new Error(`Unknown tool: ${name}`);
             }

package/dist/templates/session-start-hook.js

@@ -64,8 +64,8 @@ function formatOutput(data) {
 
   lines.push('---');
   lines.push('Dependency graph (otx:Module + otx:dependsOn) is available in the context graph.');
-  lines.push('If significant code changes occurred since last scan, consider running opentology_context_scan to update dependency triples.');
-  lines.push('Reminder: At session end, push a session summary using opentology_push to the sessions graph.');
+  lines.push('If significant code changes occurred since last scan, consider running context_scan to update dependency triples.');
+  lines.push('Reminder: At session end, push a session summary using push to the sessions graph.');
 
   return lines.join('\\n');
 }

package/dist/templates/slash-commands.js

@@ -2,7 +2,7 @@ export function generateSlashCommands() {
     return [
         {
             filename: 'context-init.md',
-            content: `Use the opentology_context_init MCP tool to initialize the project context graph.
+            content: `Use the context_init MCP tool to initialize the project context graph.
 
 After initialization:
 1. Report what was created (graphs, hook script, CLAUDE.md, slash commands).
@@ -10,9 +10,9 @@ After initialization:
 
 ## Codebase Analysis
 
-After context_init completes, call opentology_context_scan to get a codebase snapshot.
+After context_init completes, call context_scan to get a codebase snapshot.
 
-Analyze the \`codebaseSnapshot\` field from the response and create Knowledge triples to push via \`opentology_push\`.
+Analyze the \`codebaseSnapshot\` field from the response and create Knowledge triples to push via \`push\`.
 
 ### What to extract:
 - **Project triple** (\`otx:Project\`): name, description, tech stack (\`otx:stack\`), status "active"
@@ -52,7 +52,7 @@ Analyze the \`codebaseSnapshot\` field from the response and create Knowledge tr
         },
         {
             filename: 'context-load.md',
-            content: `Use the opentology_context_load MCP tool to load the current project context.
+            content: `Use the context_load MCP tool to load the current project context.
 
 Display the results in a readable format:
 - Recent sessions with dates and next todos
@@ -68,7 +68,7 @@ If context is not initialized, suggest running /context-init first.
 
 Ask the user what was accomplished in this session, or summarize the conversation so far.
 
-Then use opentology_push to insert a session record:
+Then use push to insert a session record:
 
 \`\`\`turtle
 @prefix otx: <https://opentology.dev/vocab#> .
@@ -86,11 +86,14 @@ Push to the sessions graph (use graph name "sessions").
         },
         {
             filename: 'context-scan.md',
-            content: `Use the opentology_context_scan MCP tool to scan the current project codebase.
+            content: `Before scanning, ask the user which scan depth they want:
 
-The tool returns a structured \`codebaseSnapshot\` containing package.json, directory tree, entry points, detected imports, and README.
+1. **Module scan** (default) — fast, file-level analysis. Returns directory tree, entry points, detected imports, and dependency graph. Good for a quick project overview.
+2. **Deep scan** (symbol) — slower, extracts classes, interfaces, functions, and method calls using ts-morph (TypeScript) or Tree-sitter (Go, Python, Rust, Java, Swift). Auto-pushes symbol triples to the context graph. Use when you need detailed architectural understanding.
 
-Analyze the snapshot and create Knowledge triples to push via \`opentology_push\`:
+Once the user chooses (or accepts the default), call the context_scan MCP tool with the appropriate \`depth\` parameter ("module" or "symbol").
+
+After the scan completes, analyze the results and create Knowledge triples to push via \`push\`:
 - **Project triple** (\`otx:Project\`): name, description, tech stack, status "active"
 - **Knowledge triples** (\`otx:Knowledge\`): architectural patterns, framework choices, build setup, project structure
 
@@ -99,9 +102,24 @@ Push to the **context** graph (use graph name "context"). Keep each push under 1
         },
         {
             filename: 'context-status.md',
-            content: `Use the opentology_context_status MCP tool to check the project context initialization status.
+            content: `Use the context_status MCP tool to check the project context initialization status.
 
 Display the results clearly: whether context is initialized, graph triple counts, hook presence, and CLAUDE.md status.
+`,
+        },
+        {
+            filename: 'context-graph.md',
+            content: `Use the context_graph MCP tool to start an interactive graph visualization web server.
+
+The tool starts a local web server and returns a URL. Tell the user:
+1. The URL to open in their browser (e.g. http://localhost:PORT)
+2. They can explore classes, instances, and relationships visually
+3. The sidebar has a SPARQL query box for custom queries
+4. Click any node to see its properties
+5. Use the graph selector dropdown to switch between named graphs
+6. Press Ctrl+C in the terminal to stop the server
+
+If context is not initialized, suggest running /context-init first.
 `,
         },
     ];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "opentology",
-  "version": "0.2.0",
+  "version": "0.2.1",
   "description": "CLI-managed RDF/SPARQL infrastructure — Supabase for RDF",
   "type": "module",
   "bin": {