conductor-figma 0.1.0 → 0.2.0

package/bin/conductor.js

@@ -3,21 +3,27 @@
 import { startServer } from '../src/server.js';
 import { TOOLS, CATEGORIES } from '../src/tools/registry.js';
 
-const args = process.argv.slice(2);
+var args = process.argv.slice(2);
 
 if (args.includes('--help') || args.includes('-h')) {
   console.log(`
   ⊞ CONDUCTOR — Design-intelligent MCP server for Figma
 
   Usage:
-    conductor-figma              Start MCP server (stdio)
-    conductor-figma --list       List all ${TOOLS.length} tools
-    conductor-figma --categories Show tool categories
-    conductor-figma --help       Show this help
+    conductor-figma                Start MCP server + Figma relay
+    conductor-figma --port 9800    Set WebSocket port (default: 9800)
+    conductor-figma --list         List all ${TOOLS.length} tools
+    conductor-figma --categories   Show tool categories
+    conductor-figma --help         Show this help
 
-  MCP Setup (Cursor):
-    Add to ~/.cursor/mcp.json:
+  How it works:
+    1. Cursor sends tool calls via MCP (stdio)
+    2. Design tools (color, type, spacing) resolve locally
+    3. Figma tools forward through WebSocket to the plugin
+    4. Plugin executes on canvas, results flow back
 
+  Setup:
+    ~/.cursor/mcp.json:
     {
       "mcpServers": {
         "conductor": {
@@ -27,32 +33,43 @@ if (args.includes('--help') || args.includes('-h')) {
       }
     }
 
-  ${TOOLS.length} tools · ${Object.keys(CATEGORIES).length} categories · Zero dependencies
+  Then open the CONDUCTOR plugin in Figma and click Connect.
+
+  ${TOOLS.length} tools · ${Object.keys(CATEGORIES).length} categories
   Built by 0xDragoon · MIT License
 `);
   process.exit(0);
 }
 
 if (args.includes('--list')) {
-  for (const [catKey, cat] of Object.entries(CATEGORIES)) {
-    const tools = TOOLS.filter(t => t.category === catKey);
-    console.log(`\n  ${cat.icon} ${cat.label} (${tools.length})`);
-    for (const t of tools) {
-      console.log(`    ${t.name.padEnd(28)} ${t.description.slice(0, 70)}`);
+  for (var entries = Object.entries(CATEGORIES), i = 0; i < entries.length; i++) {
+    var catKey = entries[i][0], cat = entries[i][1];
+    var tools = TOOLS.filter(function(t) { return t.category === catKey; });
+    console.log('\n  ' + cat.icon + ' ' + cat.label + ' (' + tools.length + ')');
+    for (var j = 0; j < tools.length; j++) {
+      console.log('    ' + tools[j].name.padEnd(28) + ' ' + tools[j].description.slice(0, 70));
     }
   }
-  console.log(`\n  ${TOOLS.length} tools total\n`);
+  console.log('\n  ' + TOOLS.length + ' tools total\n');
   process.exit(0);
 }
 
 if (args.includes('--categories')) {
-  for (const [key, cat] of Object.entries(CATEGORIES)) {
-    const tools = TOOLS.filter(t => t.category === key);
-    console.log(`  ${cat.icon} ${cat.label.padEnd(18)} ${tools.length} tools`);
+  for (var entries2 = Object.entries(CATEGORIES), k = 0; k < entries2.length; k++) {
+    var key = entries2[k][0], cat2 = entries2[k][1];
+    var count = TOOLS.filter(function(t) { return t.category === key; }).length;
+    console.log('  ' + cat2.icon + ' ' + cat2.label.padEnd(18) + ' ' + count + ' tools');
   }
-  console.log(`\n  ${TOOLS.length} tools total`);
+  console.log('\n  ' + TOOLS.length + ' tools total');
   process.exit(0);
 }
 
-// Default: start MCP server
-startServer();
+// Parse port
+var port = 9800;
+var portIdx = args.indexOf('--port');
+if (portIdx !== -1 && args[portIdx + 1]) {
+  port = parseInt(args[portIdx + 1]) || 9800;
+}
+
+// Start MCP server with relay
+startServer({ port: port });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "conductor-figma",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "description": "Design-intelligent MCP server for Figma. 61 tools across 10 categories. 8px grid, type scale ratios, auto-layout, component reuse, accessibility — real design intelligence, not shape proxying.",
   "author": "0xDragoon",
   "license": "MIT",
@@ -33,5 +33,8 @@
   "engines": {
     "node": ">=18.0.0"
   },
-  "dependencies": {}
+  "dependencies": {},
+  "optionalDependencies": {
+    "ws": "^8.0.0"
+  }
 }

package/src/index.js

@@ -3,6 +3,7 @@
 // ═══════════════════════════════════════════
 
 export { startServer } from './server.js';
+export { Relay } from './relay.js';
 export { TOOLS, CATEGORIES, getToolByName, getToolsByCategory, getAllToolNames } from './tools/registry.js';
 export { handleTool } from './tools/handlers.js';
 

package/src/relay.js

@@ -0,0 +1,174 @@
+// ═══════════════════════════════════════════
+// CONDUCTOR — WebSocket Relay
+// ═══════════════════════════════════════════
+// Bridges MCP stdio (from Cursor) to WebSocket (to Figma plugin).
+//
+// Flow:
+//   Cursor → MCP stdio → CONDUCTOR → design logic (local)
+//                                   → figma commands (WebSocket) → Plugin → Figma API
+//                                   ← results ← WebSocket ←
+//         ← MCP stdio ← CONDUCTOR ←
+
+import { createServer } from 'node:http';
+
+// Tools that need Figma (sent over WebSocket to plugin)
+const FIGMA_COMMANDS = new Set([
+  // Create
+  'create_frame', 'create_text', 'create_rect', 'create_section', 'create_component',
+  // Layout
+  'set_auto_layout', 'set_constraints', 'apply_grid', 'align_nodes',
+  // Style
+  'set_fills', 'set_strokes', 'set_effects', 'set_corner_radius', 'set_opacity',
+  // Typography
+  'set_text_props', 'load_font',
+  // Read
+  'get_selection', 'get_page_info', 'get_styles', 'get_components',
+  'read_node', 'read_tree', 'read_spacing', 'read_colors', 'read_typography',
+  // Edit
+  'rename_node', 'move_node', 'resize_node', 'delete_node',
+  'clone_node', 'group_nodes', 'ungroup_node', 'reorder_node',
+  // Export
+  'export_png', 'export_svg',
+  // Viewport
+  'zoom_to', 'scroll_to',
+  // Meta
+  'ping',
+]);
+
+export class Relay {
+  constructor(port) {
+    this.port = port || 9800;
+    this.pluginSocket = null;
+    this.pendingCallbacks = new Map();
+    this.cmdId = 0;
+    this.server = null;
+    this.wss = null;
+  }
+
+  async start() {
+    // Dynamic import ws (may not be installed — we bundle our own minimal WS)
+    let WebSocketServer;
+    try {
+      const ws = await import('ws');
+      WebSocketServer = ws.WebSocketServer || ws.default.WebSocketServer;
+    } catch (e) {
+      process.stderr.write('CONDUCTOR relay: "ws" package not found. Install with: npm install ws\n');
+      process.stderr.write('Falling back to MCP-only mode (no Figma bridge).\n');
+      return false;
+    }
+
+    this.server = createServer();
+    this.wss = new WebSocketServer({ server: this.server });
+
+    this.wss.on('connection', (socket) => {
+      this.pluginSocket = socket;
+      process.stderr.write('CONDUCTOR relay: Figma plugin connected\n');
+
+      socket.on('message', (data) => {
+        try {
+          const msg = JSON.parse(data.toString());
+          this.handlePluginMessage(msg);
+        } catch (e) {
+          // ignore
+        }
+      });
+
+      socket.on('close', () => {
+        this.pluginSocket = null;
+        process.stderr.write('CONDUCTOR relay: Figma plugin disconnected\n');
+      });
+
+      socket.on('error', () => {
+        this.pluginSocket = null;
+      });
+    });
+
+    return new Promise((resolve) => {
+      this.server.listen(this.port, () => {
+        process.stderr.write(`CONDUCTOR relay: WebSocket listening on ws://localhost:${this.port}\n`);
+        resolve(true);
+      });
+    });
+  }
+
+  handlePluginMessage(msg) {
+    if (msg.type === 'plugin_ready') {
+      process.stderr.write(`CONDUCTOR relay: Plugin ready (v${msg.version || '?'})\n`);
+      return;
+    }
+
+    if (msg.type === 'result' && msg.id !== undefined) {
+      const callback = this.pendingCallbacks.get(msg.id);
+      if (callback) {
+        this.pendingCallbacks.delete(msg.id);
+        callback(msg.data || {});
+      }
+      return;
+    }
+  }
+
+  isConnected() {
+    return this.pluginSocket !== null && this.pluginSocket.readyState === 1; // WebSocket.OPEN
+  }
+
+  /**
+   * Send a command to the Figma plugin and wait for result.
+   * Returns a Promise that resolves with the plugin's response.
+   */
+  sendToPlugin(commandType, commandData, timeout) {
+    timeout = timeout || 15000;
+
+    return new Promise((resolve, reject) => {
+      if (!this.isConnected()) {
+        resolve({ error: 'Figma plugin not connected. Open the CONDUCTOR plugin in Figma and click Connect.' });
+        return;
+      }
+
+      var id = ++this.cmdId;
+      var timer = setTimeout(function() {
+        this.pendingCallbacks.delete(id);
+        resolve({ error: 'Timeout waiting for Figma plugin response' });
+      }.bind(this), timeout);
+
+      this.pendingCallbacks.set(id, function(result) {
+        clearTimeout(timer);
+        resolve(result);
+      });
+
+      this.pluginSocket.send(JSON.stringify({
+        type: 'command',
+        id: id,
+        command: { type: commandType, data: commandData || {} },
+      }));
+    });
+  }
+
+  /**
+   * Check if a tool name maps to a Figma command.
+   */
+  isFigmaCommand(toolName) {
+    return FIGMA_COMMANDS.has(toolName);
+  }
+
+  /**
+   * Map a high-level tool call to one or more Figma commands.
+   * Some tools (like create_page) produce multiple Figma commands.
+   * Some tools (like color_palette) are pure design logic — no Figma needed.
+   */
+  getFigmaCommand(toolName, toolArgs) {
+    // Direct mappings — tool name IS the Figma command
+    if (FIGMA_COMMANDS.has(toolName)) {
+      return { command: toolName, data: toolArgs };
+    }
+
+    // Tools that generate Figma commands from design logic output
+    // The handler produces a JSON response with an "action" field
+    // that maps to a Figma command
+    return null;
+  }
+
+  stop() {
+    if (this.wss) this.wss.close();
+    if (this.server) this.server.close();
+  }
+}

package/src/server.js

@@ -1,115 +1,141 @@
 // ═══════════════════════════════════════════
-// CONDUCTOR — MCP Server
+// CONDUCTOR — MCP Server + Relay Bridge
 // ═══════════════════════════════════════════
-// Model Context Protocol server over stdio.
-// Registers 61 design-intelligent tools for AI editors.
+// MCP protocol over stdio (for Cursor/Claude Code).
+// WebSocket relay to Figma plugin (for canvas operations).
+//
+// Pure design tools (color_palette, type_scale, etc.) resolve locally.
+// Figma tools (create_frame, read_node, etc.) forward through WebSocket.
 
 import { TOOLS } from './tools/registry.js';
 import { handleTool } from './tools/handlers.js';
+import { Relay } from './relay.js';
 
-const SERVER_INFO = {
-  name: 'conductor-figma',
-  version: '0.1.0',
-};
+var SERVER_INFO = { name: 'conductor-figma', version: '0.2.0' };
+var CAPABILITIES = { tools: {} };
+var relay = null;
 
-const CAPABILITIES = {
-  tools: {},
-};
+export async function startServer(options) {
+  options = options || {};
+  var port = options.port || 9800;
 
-/**
- * Start the MCP server on stdio.
- * Reads JSON-RPC messages from stdin, writes responses to stdout.
- */
-export function startServer() {
-  let buffer = '';
+  relay = new Relay(port);
+  var relayStarted = await relay.start();
+
+  if (relayStarted) {
+    process.stderr.write('CONDUCTOR: MCP + relay started (' + TOOLS.length + ' tools, ws://localhost:' + port + ')\n');
+  } else {
+    process.stderr.write('CONDUCTOR: MCP started (' + TOOLS.length + ' tools, no relay — install ws for Figma bridge)\n');
+  }
+
+  var buffer = '';
 
   process.stdin.setEncoding('utf-8');
-  process.stdin.on('data', (chunk) => {
+  process.stdin.on('data', function(chunk) {
     buffer += chunk;
-
-    // Process complete lines
-    const lines = buffer.split('\n');
+    var lines = buffer.split('\n');
     buffer = lines.pop() || '';
 
-    for (const line of lines) {
-      const trimmed = line.trim();
+    for (var i = 0; i < lines.length; i++) {
+      var trimmed = lines[i].trim();
       if (!trimmed) continue;
-
       try {
-        const message = JSON.parse(trimmed);
-        handleMessage(message);
+        handleMessage(JSON.parse(trimmed));
       } catch (err) {
         sendError(null, -32700, 'Parse error');
       }
     }
   });
 
-  process.stdin.on('end', () => {
+  process.stdin.on('end', function() {
+    if (relay) relay.stop();
     process.exit(0);
   });
-
-  // Log startup to stderr (not stdout — that's for MCP protocol)
-  process.stderr.write(`CONDUCTOR MCP server started (${TOOLS.length} tools)\n`);
 }
 
-function handleMessage(msg) {
-  // JSON-RPC 2.0
-  const { id, method, params } = msg;
+async function handleMessage(msg) {
+  var id = msg.id;
+  var method = msg.method;
+  var params = msg.params || {};
 
   switch (method) {
     case 'initialize':
-      sendResult(id, {
-        protocolVersion: '2024-11-05',
-        serverInfo: SERVER_INFO,
-        capabilities: CAPABILITIES,
-      });
+      sendResult(id, { protocolVersion: '2024-11-05', serverInfo: SERVER_INFO, capabilities: CAPABILITIES });
       break;
 
     case 'initialized':
-      // Notification, no response needed
       break;
 
     case 'tools/list':
       sendResult(id, {
-        tools: TOOLS.map(t => ({
-          name: t.name,
-          description: t.description,
-          inputSchema: t.inputSchema,
-        })),
+        tools: TOOLS.map(function(t) { return { name: t.name, description: t.description, inputSchema: t.inputSchema }; }),
       });
       break;
 
-    case 'tools/call': {
-      const toolName = params?.name;
-      const toolArgs = params?.arguments || {};
-
-      if (!toolName) {
-        sendError(id, -32602, 'Missing tool name');
-        return;
-      }
-
-      const result = handleTool(toolName, toolArgs, null);
-      sendResult(id, result);
+    case 'tools/call':
+      var toolName = params.name;
+      var toolArgs = params.arguments || {};
+      if (!toolName) { sendError(id, -32602, 'Missing tool name'); return; }
+      await handleToolCall(id, toolName, toolArgs);
       break;
-    }
 
     case 'ping':
       sendResult(id, {});
       break;
 
     default:
-      if (id !== undefined) {
-        sendError(id, -32601, `Method not found: ${method}`);
+      if (id !== undefined) sendError(id, -32601, 'Method not found: ' + method);
+  }
+}
+
+async function handleToolCall(id, toolName, toolArgs) {
+  // If tool is a direct Figma command and plugin is connected — forward it
+  if (relay && relay.isFigmaCommand(toolName) && relay.isConnected()) {
+    process.stderr.write('CONDUCTOR: -> Figma: ' + toolName + '\n');
+    try {
+      var figmaResult = await relay.sendToPlugin(toolName, toolArgs);
+      process.stderr.write('CONDUCTOR: <- Figma: ' + (figmaResult.name || figmaResult.id || 'ok') + '\n');
+      sendResult(id, { content: [{ type: 'text', text: JSON.stringify(figmaResult, null, 2) }] });
+    } catch (err) {
+      sendResult(id, { content: [{ type: 'text', text: JSON.stringify({ error: String(err) }) }] });
+    }
+    return;
+  }
+
+  // Run through design intelligence handler
+  var result = handleTool(toolName, toolArgs, null);
+
+  // Check if handler produced a Figma action we should forward
+  if (relay && relay.isConnected()) {
+    try {
+      var data = JSON.parse(result.content[0].text);
+      if (data.action && relay.isFigmaCommand(data.action)) {
+        process.stderr.write('CONDUCTOR: -> Figma (via ' + toolName + '): ' + data.action + '\n');
+        var fResult = await relay.sendToPlugin(data.action, data);
+        process.stderr.write('CONDUCTOR: <- Figma: ' + (fResult.name || fResult.id || 'ok') + '\n');
+        data._figmaResult = fResult;
+        sendResult(id, { content: [{ type: 'text', text: JSON.stringify(data, null, 2) }] });
+        return;
       }
+    } catch (e) { /* not JSON or no action */ }
   }
+
+  // If Figma command but plugin not connected — add note
+  if (relay && relay.isFigmaCommand(toolName) && !relay.isConnected()) {
+    try {
+      var parsed = JSON.parse(result.content[0].text);
+      parsed._note = 'Figma plugin not connected. Connect the CONDUCTOR plugin in Figma to execute on canvas.';
+      result = { content: [{ type: 'text', text: JSON.stringify(parsed, null, 2) }] };
+    } catch (e) { /* ignore */ }
+  }
+
+  sendResult(id, result);
 }
 
 function sendResult(id, result) {
-  const response = { jsonrpc: '2.0', id, result };
-  process.stdout.write(JSON.stringify(response) + '\n');
+  process.stdout.write(JSON.stringify({ jsonrpc: '2.0', id: id, result: result }) + '\n');
 }
 
 function sendError(id, code, message) {
-  const response = { jsonrpc: '2.0', id, error: { code, message } };
-  process.stdout.write(JSON.stringify(response) + '\n');
+  process.stdout.write(JSON.stringify({ jsonrpc: '2.0', id: id, error: { code: code, message: message } }) + '\n');
 }