How etosin/arc-draw works
ARC-DRAW is an MCP server and draw.io plugin that lets an AI agent create SAP BTP solution diagrams on a live canvas. The main workflow is: an architect prompts an MCP client, which receives SAP diagram guidance and invokes diagram tools; the server routes requests over WebSocket to the connected draw.io plugin, which edits the canvas. Tool coverage includes SAP shape lookup and placement, diagram editing, Mermaid/diagram import and export, and document/page/layer operations. The README documents these capabilities; the sampled server entry point is partial, so uncertain internal dispatch details are omitted.
Main entry points: index.ts MCP server · plugin.ts draw.io plugin · drawio-tools.ts Plugin drawing tools · background.ts Extension background
Components 18
MCP interface
- MCP server
packages/drawio-mcp-server/src/index.ts - Diagram tools
packages/drawio-mcp-server/src/tools/index.ts
Live connection
- WebSocket bridge
packages/drawio-mcp-server/src/index.ts - Request queue
packages/drawio-mcp-server/src/request_queue.ts
Diagram editing
- draw.io plugin
packages/drawio-mcp-plugin/src/plugin.ts - Plugin tool registry
packages/drawio-mcp-plugin/src/tool-registry.ts - Plugin drawing tools
packages/drawio-mcp-plugin/src/drawio-tools.ts - Mermaid import
packages/drawio-mcp-plugin/src/tools/import-mermaid/index.ts
SAP guidance
- SAP guidance tools
packages/drawio-mcp-server/src/tools/index.ts - SAP rules and patterns
packages/drawio-mcp-server/src/sap-constitution.ts - SAP shape catalog
packages/drawio-mcp-plugin/src/sap-shapes.ts
Browser extension
- Extension background
packages/drawio-mcp-extension/entrypoints/background.ts - Content scripts
packages/drawio-mcp-extension/contentScript.ts - Extension popup
packages/drawio-mcp-extension/entrypoints/popup/App.tsx
Other components
- Architect
- MCP client
- Live draw.io canvas
- draw.io
Connections 18
- Architect → MCP client: prompts
- MCP client → MCP server: invokes tools
- MCP server → MCP client: provides SAP rules
- MCP server → Diagram tools: registers tools
- MCP server → SAP guidance tools: registers tools
- SAP guidance tools → SAP rules and patterns: reads guidance
- MCP server → WebSocket bridge: routes requests
- WebSocket bridge → Request queue: queues requests
- WebSocket bridge → Extension background: WebSocket messages
- Extension background → Content scripts: routes messages
- Content scripts → draw.io plugin: forwards messages
- draw.io plugin → Plugin tool registry: dispatches tools
- Plugin tool registry → Plugin drawing tools: invokes drawing
- Plugin drawing tools → Live draw.io canvas: edits diagram
- draw.io plugin → SAP shape catalog: uses shapes
- Plugin drawing tools → Mermaid import: imports Mermaid
- draw.io → Live draw.io canvas: hosts
- Extension background → Extension popup: sends status