claude-monet-mcp 1.0.0 → 1.0.2

package/README.md

@@ -1,9 +1,9 @@
 <p align="center">
-  <img src="src/public/claude-monet-mcp-with-text.webp" alt="Claude Monet MCP" width="400">
+  <img src="src/public/claude-monet-mcp-bg.webp" alt="Claude Monet MCP" width="400">
 </p>
 
 <p align="center">
-  <em>Give Claude eyes to see your sketches. Draw in Excalidraw, Claude reads the SVG.</em>
+  <em>Let your ideas flow in strokes, not keystrokes.</em>
 </p>
 
 <p align="center">
@@ -16,21 +16,25 @@
 
 ## What is this?
 
-* :art: **Visual Input for Claude** - Sketch UI layouts, flows, and ideas visually instead of describing them in text. Claude receives your drawing as SVG and understands your visual intent.
-* :zap: **Minimal & Focused** - Just ~200 lines of code. This is NOT a diagram generator - it's visual input for Claude.
-* :rocket: **Real-time Sync** - Draw with Excalidraw's hand-drawn style canvas, changes sync instantly to Claude via MCP.
+* 🎨 **Visual thinking, amplified** - Some ideas are easier to draw than describe. Sketch freely and let AI see what you mean.
+* ✨ **Beautifully simple** - A lightweight canvas that does one thing well: bridge your imagination to AI understanding.
+* 🔄 **Instant connection** - Your strokes flow to AI in real-time via MCP. No exports, no uploads—just draw.
+
+<p align="center">
+  <img src="src/public/demo.gif" alt="Claude Monet MCP Demo" width="800">
+</p>
 
 ---
 
 ## Quick Add
 
-### Claude Code
+### <img src="https://cdn.simpleicons.org/anthropic/D97757" height="20" align="center"> Claude Code
 
 ```bash
 claude mcp add claude-monet -- npx -y claude-monet-mcp
 ```
 
-### Claude Desktop
+### <img src="https://cdn.simpleicons.org/anthropic/D97757" height="20" align="center"> Claude Desktop
 
 Add to your `claude_desktop_config.json`:
 
@@ -45,8 +49,23 @@ Add to your `claude_desktop_config.json`:
 }
 ```
 
+### <img src="https://cdn.simpleicons.org/cursor/000000" height="20" align="center"> Cursor
+
+Add to your Cursor MCP settings (`Cursor Settings` → `Features` → `Model Context Protocol`):
+
+```json
+{
+  "mcpServers": {
+    "claude-monet": {
+      "command": "npx",
+      "args": ["-y", "claude-monet-mcp"]
+    }
+  }
+}
+```
+
 > [!TIP]
-> After adding the server, restart Claude Desktop/Code to load the MCP tools.
+> After adding the server, restart Claude Desktop/Code/Cursor to load the MCP tools.
 
 ---
 
@@ -82,7 +101,7 @@ pnpm run build
 pnpm start
 ```
 
-The web interface will be available at `http://localhost:3000`
+The web interface will be available at `http://localhost:51423`
 
 ### Configure MCP
 
@@ -104,7 +123,7 @@ Add to your MCP settings:
 ## Usage
 
 1. **Start the server** - Run `pnpm start` or use `npx claude-monet-mcp`
-2. **Open the canvas** - Navigate to `http://localhost:3000` in your browser
+2. **Open the canvas** - Navigate to `http://localhost:51423` in your browser
 3. **Draw your idea** - Use Excalidraw tools to sketch rectangles, circles, arrows, text, or freehand
 4. **Ask Claude** - "Can you see my sketch? What do you think?"
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "claude-monet-mcp",
-  "version": "1.0.0",
+  "version": "1.0.2",
   "description": "MCP server that gives Claude 'eyes' - sketch in Excalidraw, Claude reads the SVG",
   "type": "module",
   "main": "server.js",
@@ -15,20 +15,29 @@
     "dev": "vite",
     "build": "vite build",
     "start": "node server.js",
-    "dev:full": "pnpm run build && pnpm start"
+    "dev:full": "pnpm run build && pnpm start",
+    "release": "release-it"
   },
-  "keywords": ["mcp", "excalidraw", "sketch", "visual-input", "claude"],
+  "keywords": [
+    "mcp",
+    "excalidraw",
+    "sketch",
+    "visual-input",
+    "claude"
+  ],
   "author": "",
   "license": "MIT",
   "dependencies": {
-    "@modelcontextprotocol/sdk": "^1.0.0",
     "@excalidraw/excalidraw": "^0.18.0",
+    "@modelcontextprotocol/sdk": "^1.0.0",
     "express": "^4.18.0",
+    "open": "^11.0.0",
     "react": "^18.0.0",
     "react-dom": "^18.0.0"
   },
   "devDependencies": {
-    "vite": "^5.0.0",
-    "@vitejs/plugin-react": "^4.0.0"
+    "@vitejs/plugin-react": "^4.0.0",
+    "release-it": "^19.2.3",
+    "vite": "^5.0.0"
   }
 }

package/server.js

@@ -5,6 +5,7 @@ import { ListToolsRequestSchema, CallToolRequestSchema } from '@modelcontextprot
 import express from 'express';
 import { fileURLToPath } from 'url';
 import { dirname, join } from 'path';
+import open from 'open';
 
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = dirname(__filename);
@@ -93,10 +94,11 @@ app.post('/api/svg', (req, res) => {
 });
 
 // Start Express server
-const PORT = 3000;
-app.listen(PORT, () => {
+const PORT = 51423;
+app.listen(PORT, async () => {
   console.log(`Web interface running at http://localhost:${PORT}`);
   console.log('MCP server running on stdio');
+  await open(`http://localhost:${PORT}`);
 });
 
 // Start MCP server on stdio