@kage-core/kage-graph-mcp 1.1.33 → 1.1.35
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +10 -4
- package/package.json +1 -1
- package/viewer/app.js +579 -30
- package/viewer/index.html +218 -103
- package/viewer/styles.css +519 -55
package/viewer/index.html
CHANGED
|
@@ -3,14 +3,14 @@
|
|
|
3
3
|
<head>
|
|
4
4
|
<meta charset="utf-8">
|
|
5
5
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
6
|
-
<title>Kage
|
|
7
|
-
<link rel="stylesheet" href="./styles.css?v=
|
|
6
|
+
<title>Kage Graph Viewer</title>
|
|
7
|
+
<link rel="stylesheet" href="./styles.css?v=26">
|
|
8
8
|
</head>
|
|
9
9
|
<body>
|
|
10
10
|
<header class="app-header">
|
|
11
11
|
<div class="brand-block">
|
|
12
|
-
<span class="eyebrow">kage://repo-
|
|
13
|
-
<h1>
|
|
12
|
+
<span class="eyebrow">kage://repo-intelligence</span>
|
|
13
|
+
<h1>Kage Graph</h1>
|
|
14
14
|
<p id="graphSummary">Load memory, code, and metrics graphs to inspect what agents know and why.</p>
|
|
15
15
|
</div>
|
|
16
16
|
<nav class="site-links" aria-label="Kage site links">
|
|
@@ -19,6 +19,14 @@
|
|
|
19
19
|
<a href="../releases.html">Releases</a>
|
|
20
20
|
<a href="https://github.com/kage-core/Kage">GitHub</a>
|
|
21
21
|
</nav>
|
|
22
|
+
<nav class="viewer-sections" aria-label="Kage viewer sections">
|
|
23
|
+
<button class="viewer-section active" type="button" data-viewer-section="overview" aria-selected="true">Overview</button>
|
|
24
|
+
<button class="viewer-section" type="button" data-viewer-section="graph" aria-selected="false">Graph</button>
|
|
25
|
+
<button class="viewer-section" type="button" data-dashboard-action="memory" aria-selected="false">Memory</button>
|
|
26
|
+
<button class="viewer-section" type="button" data-dashboard-action="intelligence" aria-selected="false">Intel</button>
|
|
27
|
+
<button class="viewer-section" type="button" data-dashboard-action="review" aria-selected="false">Review</button>
|
|
28
|
+
<button class="viewer-section" type="button" data-dashboard-action="data" aria-selected="false">Data</button>
|
|
29
|
+
</nav>
|
|
22
30
|
<div id="statusStrip" class="status-strip" aria-label="Graph health"></div>
|
|
23
31
|
<div id="autoLoadStatus" class="autoload-status">auto-load: waiting</div>
|
|
24
32
|
<label class="file-picker">
|
|
@@ -28,10 +36,70 @@
|
|
|
28
36
|
</header>
|
|
29
37
|
|
|
30
38
|
<main class="layout">
|
|
39
|
+
<section class="dashboard-panel" aria-label="Kage repo dashboard">
|
|
40
|
+
<div class="dashboard-hero">
|
|
41
|
+
<div>
|
|
42
|
+
<span class="dashboard-kicker">Repo Memory Dashboard</span>
|
|
43
|
+
<h2>What agents know, where it maps to code, and what needs attention.</h2>
|
|
44
|
+
<p>Kage turns repo-local memory packets, source graph facts, git signals, and review state into one navigable dashboard before you dive into the graph.</p>
|
|
45
|
+
</div>
|
|
46
|
+
<div class="dashboard-actions">
|
|
47
|
+
<button type="button" data-viewer-section="graph">Open graph</button>
|
|
48
|
+
<button type="button" data-dashboard-action="intelligence">Repo intelligence</button>
|
|
49
|
+
<button type="button" data-dashboard-action="memory">Memory review</button>
|
|
50
|
+
</div>
|
|
51
|
+
</div>
|
|
52
|
+
<div id="dashboardStats" class="dashboard-stats" aria-label="Repo dashboard stats"></div>
|
|
53
|
+
<div class="dashboard-grid">
|
|
54
|
+
<article class="dashboard-card" id="dashboardMemory">
|
|
55
|
+
<div class="dashboard-card-head"><span>Memory</span><strong>repo lore</strong></div>
|
|
56
|
+
<h3>Shareable agent context</h3>
|
|
57
|
+
<p>Approved packets, memory-code links, and review state.</p>
|
|
58
|
+
<ul></ul>
|
|
59
|
+
<button type="button" data-dashboard-action="memory">Open memory</button>
|
|
60
|
+
</article>
|
|
61
|
+
<article class="dashboard-card" id="dashboardGraph">
|
|
62
|
+
<div class="dashboard-card-head"><span>Graph</span><strong>source map</strong></div>
|
|
63
|
+
<h3>Files, symbols, calls, routes, tests</h3>
|
|
64
|
+
<p>Explore the source graph and memory-code bridge.</p>
|
|
65
|
+
<ul></ul>
|
|
66
|
+
<button type="button" data-viewer-section="graph">Explore graph</button>
|
|
67
|
+
</article>
|
|
68
|
+
<article class="dashboard-card" id="dashboardIntel">
|
|
69
|
+
<div class="dashboard-card-head"><span>Intel</span><strong>reports</strong></div>
|
|
70
|
+
<h3>Risk, modules, owners, decisions</h3>
|
|
71
|
+
<p>Operational maps generated from local artifacts.</p>
|
|
72
|
+
<ul></ul>
|
|
73
|
+
<button type="button" data-dashboard-action="intelligence">Open intel</button>
|
|
74
|
+
</article>
|
|
75
|
+
<article class="dashboard-card" id="dashboardRisk">
|
|
76
|
+
<div class="dashboard-card-head"><span>Risk</span><strong>impact</strong></div>
|
|
77
|
+
<h3>Hotspots and blast radius</h3>
|
|
78
|
+
<p>Git and graph signals for risky change areas.</p>
|
|
79
|
+
<ul></ul>
|
|
80
|
+
<button type="button" data-dashboard-action="intelligence">Open risk map</button>
|
|
81
|
+
</article>
|
|
82
|
+
<article class="dashboard-card" id="dashboardReview">
|
|
83
|
+
<div class="dashboard-card-head"><span>Review</span><strong>handoff</strong></div>
|
|
84
|
+
<h3>Inbox, proof, and merge readiness</h3>
|
|
85
|
+
<p>Check pending memory, graph freshness, and proof metrics.</p>
|
|
86
|
+
<ul></ul>
|
|
87
|
+
<button type="button" data-dashboard-action="review">Open review</button>
|
|
88
|
+
</article>
|
|
89
|
+
<article class="dashboard-card" id="dashboardWorkspace">
|
|
90
|
+
<div class="dashboard-card-head"><span>Workspace</span><strong>team map</strong></div>
|
|
91
|
+
<h3>Cross-repo links and collaboration</h3>
|
|
92
|
+
<p>Package links, contracts, topics, and co-change pairs.</p>
|
|
93
|
+
<ul></ul>
|
|
94
|
+
<button type="button" data-dashboard-action="data">Open data</button>
|
|
95
|
+
</article>
|
|
96
|
+
</div>
|
|
97
|
+
</section>
|
|
98
|
+
|
|
31
99
|
<section class="graph-panel" aria-label="Graph rendering">
|
|
32
100
|
<div class="graph-toolbar">
|
|
33
101
|
<div>
|
|
34
|
-
<h2>Graph
|
|
102
|
+
<h2>Dependency Graph</h2>
|
|
35
103
|
<p id="graphSubhead">Combined repo memory and source graph.</p>
|
|
36
104
|
</div>
|
|
37
105
|
<div class="graph-actions" aria-label="Graph view controls">
|
|
@@ -41,6 +109,24 @@
|
|
|
41
109
|
<button id="zoomIn" type="button">+</button>
|
|
42
110
|
</div>
|
|
43
111
|
</div>
|
|
112
|
+
<div class="graph-quickbar" aria-label="Graph quick controls">
|
|
113
|
+
<div class="quick-group" aria-label="Scope">
|
|
114
|
+
<span>Scope</span>
|
|
115
|
+
<button type="button" data-quick-view="combined">Combined</button>
|
|
116
|
+
<button type="button" data-quick-view="memory">Memory</button>
|
|
117
|
+
<button type="button" data-quick-view="code">Code</button>
|
|
118
|
+
</div>
|
|
119
|
+
<div class="quick-group" aria-label="Render mode">
|
|
120
|
+
<span>Mode</span>
|
|
121
|
+
<button type="button" data-quick-render="2d">2D</button>
|
|
122
|
+
<button type="button" data-quick-render="3d">3D</button>
|
|
123
|
+
</div>
|
|
124
|
+
<div class="quick-group quick-actions" aria-label="Graph tools">
|
|
125
|
+
<button id="quickSearch" type="button">Search</button>
|
|
126
|
+
<button id="quickPath" type="button">Path</button>
|
|
127
|
+
<button id="quickInspector" type="button">Inspect</button>
|
|
128
|
+
</div>
|
|
129
|
+
</div>
|
|
44
130
|
<div id="graphCanvasWrap" class="graph-canvas-wrap">
|
|
45
131
|
<canvas id="graphCanvas" aria-label="Interactive Kage memory and code graph"></canvas>
|
|
46
132
|
<div id="threeGraph" class="three-graph" aria-label="Interactive 3D Kage memory and code graph"></div>
|
|
@@ -63,114 +149,143 @@
|
|
|
63
149
|
</div>
|
|
64
150
|
</section>
|
|
65
151
|
|
|
66
|
-
<
|
|
67
|
-
<div class="
|
|
68
|
-
<
|
|
69
|
-
|
|
152
|
+
<section class="workspace-shell" aria-label="Viewer workspace">
|
|
153
|
+
<div class="workspace-top">
|
|
154
|
+
<nav class="workspace-tabs" aria-label="Viewer panels">
|
|
155
|
+
<button class="workspace-tab active" type="button" data-workspace-tab="controls" aria-selected="true">Tools</button>
|
|
156
|
+
<button class="workspace-tab" type="button" data-workspace-tab="inspector" aria-selected="false">Inspect</button>
|
|
157
|
+
<button class="workspace-tab" type="button" data-workspace-tab="intelligence" aria-selected="false">Intel</button>
|
|
158
|
+
<button class="workspace-tab" type="button" data-workspace-tab="review" aria-selected="false">Review</button>
|
|
159
|
+
<button class="workspace-tab" type="button" data-workspace-tab="tables" aria-selected="false">Data</button>
|
|
160
|
+
</nav>
|
|
161
|
+
<button id="closeWorkspace" class="workspace-close" type="button" aria-label="Close viewer workspace">x</button>
|
|
70
162
|
</div>
|
|
71
|
-
<div id="metricsSummary" class="metrics-grid"></div>
|
|
72
|
-
<label>
|
|
73
|
-
<span>Search</span>
|
|
74
|
-
<input id="searchInput" type="search" placeholder="Entity, edge, type, tag, path...">
|
|
75
|
-
</label>
|
|
76
|
-
<label>
|
|
77
|
-
<span>View</span>
|
|
78
|
-
<select id="viewMode">
|
|
79
|
-
<option value="combined">Combined</option>
|
|
80
|
-
<option value="memory">Memory</option>
|
|
81
|
-
<option value="code">Code</option>
|
|
82
|
-
</select>
|
|
83
|
-
</label>
|
|
84
|
-
<label>
|
|
85
|
-
<span>Graph Mode</span>
|
|
86
|
-
<select id="renderMode">
|
|
87
|
-
<option value="2d" selected>2D Canvas</option>
|
|
88
|
-
<option value="3d">3D Space</option>
|
|
89
|
-
</select>
|
|
90
|
-
</label>
|
|
91
|
-
<label>
|
|
92
|
-
<span>Node Type</span>
|
|
93
|
-
<select id="typeFilter">
|
|
94
|
-
<option value="">All types</option>
|
|
95
|
-
</select>
|
|
96
|
-
</label>
|
|
97
|
-
<label>
|
|
98
|
-
<span>Relation</span>
|
|
99
|
-
<select id="relationFilter">
|
|
100
|
-
<option value="">All relations</option>
|
|
101
|
-
</select>
|
|
102
|
-
</label>
|
|
103
|
-
<input id="scopeFilter" type="hidden" value="signal">
|
|
104
|
-
<label>
|
|
105
|
-
<span>Max Nodes</span>
|
|
106
|
-
<select id="maxNodes">
|
|
107
|
-
<option value="60">60</option>
|
|
108
|
-
<option value="90" selected>90</option>
|
|
109
|
-
<option value="140">140</option>
|
|
110
|
-
<option value="220">220</option>
|
|
111
|
-
</select>
|
|
112
|
-
</label>
|
|
113
|
-
<label class="toggle-control">
|
|
114
|
-
<input id="showDependencies" type="checkbox">
|
|
115
|
-
<span>Show dependency noise</span>
|
|
116
|
-
</label>
|
|
117
|
-
<button id="resetView" type="button">Reset</button>
|
|
118
|
-
<div class="legend" aria-label="Legend">
|
|
119
|
-
<span><i class="dot memory-dot"></i>memory packet</span>
|
|
120
|
-
<span><i class="dot code-dot"></i>code artifact</span>
|
|
121
|
-
<span><i class="line sample-line"></i>relation</span>
|
|
122
|
-
</div>
|
|
123
|
-
</aside>
|
|
124
163
|
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
164
|
+
<div class="workspace-body">
|
|
165
|
+
<aside class="control-panel" aria-label="Graph controls">
|
|
166
|
+
<div class="panel-heading compact">
|
|
167
|
+
<h2>Workspace</h2>
|
|
168
|
+
<span id="workspaceMode">Combined</span>
|
|
169
|
+
</div>
|
|
170
|
+
<div id="metricsSummary" class="metrics-grid"></div>
|
|
171
|
+
<label>
|
|
172
|
+
<span>Search</span>
|
|
173
|
+
<input id="searchInput" type="search" placeholder="Entity, edge, type, tag, path...">
|
|
174
|
+
</label>
|
|
175
|
+
<div class="path-finder" aria-label="Dependency path finder">
|
|
176
|
+
<div class="path-finder-header">
|
|
177
|
+
<span>Path Finder</span>
|
|
178
|
+
<button id="clearPath" type="button">Clear</button>
|
|
179
|
+
</div>
|
|
180
|
+
<div class="path-finder-inputs">
|
|
181
|
+
<input id="pathFromInput" type="search" list="pathNodeOptions" placeholder="From file, symbol, route...">
|
|
182
|
+
<input id="pathToInput" type="search" list="pathNodeOptions" placeholder="To file, symbol, route...">
|
|
183
|
+
<button id="findPath" type="button">Find</button>
|
|
184
|
+
</div>
|
|
185
|
+
<datalist id="pathNodeOptions"></datalist>
|
|
186
|
+
<div id="pathStatus" class="path-status">Pick two code nodes to trace a dependency path.</div>
|
|
187
|
+
<div id="pathResult" class="path-result"></div>
|
|
188
|
+
</div>
|
|
189
|
+
<label>
|
|
190
|
+
<span>View</span>
|
|
191
|
+
<select id="viewMode">
|
|
192
|
+
<option value="combined">Combined</option>
|
|
193
|
+
<option value="memory">Memory</option>
|
|
194
|
+
<option value="code">Code</option>
|
|
195
|
+
</select>
|
|
196
|
+
</label>
|
|
197
|
+
<label>
|
|
198
|
+
<span>Graph Mode</span>
|
|
199
|
+
<select id="renderMode">
|
|
200
|
+
<option value="2d" selected>2D Canvas</option>
|
|
201
|
+
<option value="3d">3D Space</option>
|
|
202
|
+
</select>
|
|
203
|
+
</label>
|
|
204
|
+
<label>
|
|
205
|
+
<span>Node Type</span>
|
|
206
|
+
<select id="typeFilter">
|
|
207
|
+
<option value="">All types</option>
|
|
208
|
+
</select>
|
|
209
|
+
</label>
|
|
210
|
+
<label>
|
|
211
|
+
<span>Relation</span>
|
|
212
|
+
<select id="relationFilter">
|
|
213
|
+
<option value="">All relations</option>
|
|
214
|
+
</select>
|
|
215
|
+
</label>
|
|
216
|
+
<input id="scopeFilter" type="hidden" value="signal">
|
|
217
|
+
<label>
|
|
218
|
+
<span>Max Nodes</span>
|
|
219
|
+
<select id="maxNodes">
|
|
220
|
+
<option value="60">60</option>
|
|
221
|
+
<option value="90" selected>90</option>
|
|
222
|
+
<option value="140">140</option>
|
|
223
|
+
<option value="220">220</option>
|
|
224
|
+
</select>
|
|
225
|
+
</label>
|
|
226
|
+
<label class="toggle-control">
|
|
227
|
+
<input id="showDependencies" type="checkbox">
|
|
228
|
+
<span>Show dependency noise</span>
|
|
229
|
+
</label>
|
|
230
|
+
<button id="resetView" type="button">Reset</button>
|
|
231
|
+
<div class="legend" aria-label="Legend">
|
|
232
|
+
<span><i class="dot memory-dot"></i>memory packet</span>
|
|
233
|
+
<span><i class="dot code-dot"></i>code artifact</span>
|
|
234
|
+
<span><i class="line sample-line"></i>relation</span>
|
|
235
|
+
</div>
|
|
236
|
+
</aside>
|
|
132
237
|
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
238
|
+
<aside class="details-panel" aria-label="Selection details">
|
|
239
|
+
<div class="panel-heading compact">
|
|
240
|
+
<h2>Inspector</h2>
|
|
241
|
+
<span id="selectionStatus">No selection</span>
|
|
242
|
+
</div>
|
|
243
|
+
<div id="selectionDetails" class="details-empty">Select an entity or edge.</div>
|
|
244
|
+
</aside>
|
|
140
245
|
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
246
|
+
<section class="review-panel" aria-label="Review queue">
|
|
247
|
+
<div class="panel-heading">
|
|
248
|
+
<h2>Memory Inbox</h2>
|
|
249
|
+
<span id="reviewCount">0</span>
|
|
250
|
+
</div>
|
|
251
|
+
<div id="reviewList" class="review-list"></div>
|
|
252
|
+
</section>
|
|
148
253
|
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
254
|
+
<section class="proof-panel" aria-label="Quality and benchmark">
|
|
255
|
+
<div class="panel-heading">
|
|
256
|
+
<h2>Proof</h2>
|
|
257
|
+
<span id="proofStatus">metrics</span>
|
|
258
|
+
</div>
|
|
259
|
+
<div id="proofList" class="proof-list"></div>
|
|
260
|
+
</section>
|
|
156
261
|
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
262
|
+
<section class="intelligence-panel" aria-label="Repo intelligence">
|
|
263
|
+
<div class="panel-heading">
|
|
264
|
+
<h2>Repo Intelligence</h2>
|
|
265
|
+
<span id="intelligenceStatus">reports</span>
|
|
266
|
+
</div>
|
|
267
|
+
<div id="intelligenceList" class="intelligence-list"></div>
|
|
268
|
+
</section>
|
|
269
|
+
|
|
270
|
+
<section class="table-panel entities-panel" aria-label="Nodes">
|
|
271
|
+
<div class="panel-heading">
|
|
272
|
+
<h2>Nodes</h2>
|
|
273
|
+
<span id="entityCount">0</span>
|
|
274
|
+
</div>
|
|
275
|
+
<div id="entityList" class="list"></div>
|
|
276
|
+
</section>
|
|
164
277
|
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
278
|
+
<section class="table-panel edges-panel" aria-label="Relations">
|
|
279
|
+
<div class="panel-heading">
|
|
280
|
+
<h2>Relations</h2>
|
|
281
|
+
<span id="edgeCount">0</span>
|
|
282
|
+
</div>
|
|
283
|
+
<div id="edgeList" class="list"></div>
|
|
284
|
+
</section>
|
|
169
285
|
</div>
|
|
170
|
-
<div id="edgeList" class="list"></div>
|
|
171
286
|
</section>
|
|
172
287
|
</main>
|
|
173
288
|
|
|
174
|
-
<script src="./app.js?v=
|
|
289
|
+
<script src="./app.js?v=26"></script>
|
|
175
290
|
</body>
|
|
176
291
|
</html>
|