liteagents 2.5.3 → 2.6.0

package/packages/claude/CLAUDE.md

@@ -31,6 +31,7 @@ These subagents are available when using Claude Code CLI. Droid can reference th
 | condition-based-waiting | Replaces arbitrary timeouts with condition polling to wait for actual state changes | /condition-based-waiting <condition-type> <timeout-specs> | false |
 | docs-builder | Create comprehensive project documentation with structured /docs hierarchy | /docs-builder | false |
 | root-cause-tracing | Systematically traces bugs backward through call stack to identify source | /root-cause-tracing <issue-description> | false |
+| live-canvas | Conduct design interviews, generate UI variations, collect live click-to-annotate feedback via a browser overlay that streams into the session | /live-canvas | false |
 | skill-creator | Guide for creating effective skills and extending Claude capabilities | /skill-creator <skill-type> <skill-description> | false |
 | systematic-debugging | Four-phase debugging framework - investigate root cause before any fixes | /systematic-debugging <bug-or-error-description> | false |
 | test-driven-development | Write test first, watch it fail, write minimal code to pass | /test-driven-development <feature-or-behavior-to-test> | true |

package/packages/claude/commands/friction/friction.js

@@ -1940,12 +1940,21 @@ function clusterCandidates(allCandidates) {
   const clusters = Object.values(clusterMap).map(cl => {
     const weight = signalWeights[cl.anchor_signal] || 1;
     const peaks = cl.peaks.sort((a, b) => a - b);
+    // Session IDs follow "project/dateStr-shortId", so the first segment is
+    // the project. Preserve both the ID list and the deduped project set so
+    // downstream renderers can surface which repos produced the cluster.
+    const sessionIds = Object.keys(cl.sessions);
+    const projects = [...new Set(
+      sessionIds.map(s => s.includes('/') ? s.split('/')[0] : 'unknown')
+    )].sort();
     return {
       anchor_signal: cl.anchor_signal,
       tool_pattern: cl.tool_pattern,
       count: cl.count,
       score: cl.count * weight,
-      sessions: Object.keys(cl.sessions).length,
+      sessions: sessionIds.length,
+      session_ids: sessionIds,
+      projects: projects,
       median_peak: peaks[Math.floor(peaks.length / 2)],
       max_peak: peaks[peaks.length - 1],
       contexts: cl.contexts,
@@ -2048,10 +2057,13 @@ function extractMain(sessionsDir) {
 
   // Summary table
   reviewLines.push('## Cluster Summary\n\n');
-  reviewLines.push('| # | Signal | Tool Pattern | Count | Sessions | Score | Median Peak |\n');
-  reviewLines.push('|---|--------|-------------|-------|----------|-------|-------------|\n');
+  reviewLines.push('| # | Signal | Tool Pattern | Count | Sessions | Projects | Score | Median Peak |\n');
+  reviewLines.push('|---|--------|-------------|-------|----------|----------|-------|-------------|\n');
   reviewClusters.forEach((cl, idx) => {
-    reviewLines.push(`| ${idx + 1} | ${cl.anchor_signal} | ${cl.tool_pattern} | ${cl.count} | ${cl.sessions} | ${cl.score} | ${cl.median_peak} |\n`);
+    const projs = cl.projects || [];
+    const projectsShort = projs.slice(0, 3).join(', ') +
+      (projs.length > 3 ? `, +${projs.length - 3}` : '');
+    reviewLines.push(`| ${idx + 1} | ${cl.anchor_signal} | ${cl.tool_pattern} | ${cl.count} | ${cl.sessions} | ${projectsShort || '-'} | ${cl.score} | ${cl.median_peak} |\n`);
   });
   reviewLines.push('\n---\n\n');
 
@@ -2059,6 +2071,9 @@ function extractMain(sessionsDir) {
   reviewClusters.forEach((cl, idx) => {
     reviewLines.push(`## Cluster ${idx + 1}: ${cl.anchor_signal} | ${cl.tool_pattern}\n\n`);
     reviewLines.push(`**Occurrences:** ${cl.count} across ${cl.sessions} sessions | **Score:** ${cl.score} | **Median peak:** ${cl.median_peak} | **Max peak:** ${cl.max_peak}\n\n`);
+    if (cl.projects && cl.projects.length > 0) {
+      reviewLines.push(`**Projects:** ${cl.projects.join(', ')}\n\n`);
+    }
 
     if (cl.contexts.length > 0) {
       reviewLines.push('### User Context (what the user said)\n\n');

package/packages/claude/plugins/live-canvas-marketplace/.claude-plugin/marketplace.json

@@ -0,0 +1,14 @@
+{
+  "name": "live-canvas-marketplace",
+  "description": "Live Canvas — push click-to-annotate feedback from the browser overlay into a Claude Code session.",
+  "owner": {
+    "name": "liteagents"
+  },
+  "plugins": [
+    {
+      "name": "live-canvas-channel",
+      "source": "./plugins/live-canvas-channel",
+      "description": "Channel plugin that bridges the Live Canvas overlay (HTTP) to the Claude session (MCP notifications)."
+    }
+  ]
+}

package/packages/claude/plugins/live-canvas-marketplace/plugins/live-canvas-channel/.claude-plugin/plugin.json

@@ -0,0 +1,18 @@
+{
+  "name": "live-canvas-channel",
+  "version": "0.1.0",
+  "description": "Bridges the Live Canvas browser overlay to a Claude Code session. Each overlay Save becomes a claude/channel notification delivered over MCP.",
+  "author": { "name": "liteagents" },
+  "channels": [
+    { "server": "live-canvas" }
+  ],
+  "mcpServers": {
+    "live-canvas": {
+      "command": "node",
+      "args": ["${CLAUDE_PLUGIN_ROOT}/server.js"],
+      "env": {
+        "LIVE_CANVAS_PORT": "8788"
+      }
+    }
+  }
+}

package/packages/claude/plugins/live-canvas-marketplace/plugins/live-canvas-channel/README.md

@@ -0,0 +1,89 @@
+# live-canvas-channel
+
+Claude Code channel plugin that bridges the Live Canvas browser overlay to a running Claude session. Each Save in the overlay becomes a `notifications/claude/channel` event — Claude reacts immediately without the user leaving the browser.
+
+## How it fits
+
+```
+┌──────────────────┐   POST /feedback    ┌───────────────────┐   MCP stdio  ┌──────────────┐
+│ Overlay in page  │ ──────────────────▶ │ live-canvas-      │ ──────────▶  │ Claude Code  │
+│ (any framework)  │ ◀── 200/ok ────────│ channel (node)    │              │ session      │
+└──────────────────┘                    └───────────────────┘              └──────────────┘
+```
+
+- HTTP listener: `127.0.0.1:8788` (override with `LIVE_CANVAS_PORT`)
+- `GET /health` — overlay probes this to select Live vs Batch mode
+- `POST /feedback` — wire-compatible with the overlay's v1.0 schema
+- stdio: MCP protocol using `@modelcontextprotocol/sdk`
+
+## Install (local dev)
+
+```bash
+# Point Claude at this marketplace (one-time)
+claude /plugin marketplace add /absolute/path/to/live-canvas-marketplace
+
+# Install the plugin from it
+claude /plugin install live-canvas-channel@live-canvas-marketplace
+```
+
+The marketplace directory is the parent that contains `.claude-plugin/marketplace.json`.
+
+## Activate the channel on a session
+
+**Channels are in research preview and custom channels aren't on the approved allowlist.** `/plugin install` spawns the MCP server but does NOT auto-subscribe the session. To receive channel events, start a fresh Claude session with the development flag:
+
+```bash
+claude --dangerously-load-development-channels plugin:live-canvas-channel@live-canvas-marketplace
+```
+
+You'll see a confirmation prompt the first time. After confirming, channel events arrive in the assistant's context wrapped as `<channel source="live-canvas" ...>...</channel>` tags.
+
+Requirements: Claude Code v2.1.80+, claude.ai login (not API key or Console auth). On Team/Enterprise, channels must be explicitly enabled by the admin.
+
+## First run
+
+```bash
+cd /path/to/live-canvas-marketplace/plugins/live-canvas-channel
+npm install
+```
+
+This installs `@modelcontextprotocol/sdk`. After that, `/plugin install` can launch `server.js` on demand.
+
+## Debugging standalone
+
+The process expects stdio to be held open (Claude Code does this; the shell doesn't unless you trick it):
+
+```bash
+LIVE_CANVAS_PORT=8788 tail -f /dev/null | node server.js
+```
+
+Then in another terminal:
+
+```bash
+curl http://localhost:8788/health
+curl -X POST http://localhost:8788/feedback \
+  -H 'content-type: application/json' \
+  -d '{"version":"1.0","target":"PostCard","comment":{"id":"test","variant":"A","element":{"selector":"button","tagName":"button","textContent":"Like"},"text":"too small"}}'
+```
+
+## Protocol emitted
+
+| Method | When | Params |
+|---|---|---|
+| `notifications/claude/channel` | Valid feedback POST | `{ content: string, meta: Record<string,string> }` |
+
+**content** — human-readable text delivered to the active Claude turn:
+
+```
+[LIVE-CANVAS A · PostCard] too small
+  selector: `button`, button with "Like"
+  comment_id: test
+```
+
+**meta** — machine-structured fields the assistant can parse: `source`, `target`, `variant`, `selector`, `tagName`, `commentId`.
+
+## Failure modes
+
+- **Port in use** — another Claude session owns 8788. Logs to stderr and exits; overlay health probe fails; overlay falls back to Batch mode silently.
+- **Invalid payload** — HTTP 400 with reason; no notification emitted.
+- **MCP transport not connected** — HTTP call still returns 200 (so the overlay shows "pushed"), but stderr logs the drop. Avoids false-negative toasts.