chore: always bundle latest draw.io version in Electron builds

Remove pinned v29.3.5 tag so the build always clones the latest draw.io.
This adds the Animated GIF export and other new features to the Electron app.

Closes #770

.github/workflows/electron-release.yml

@@ -37,7 +37,7 @@ jobs:
       - name: Download draw.io static files for offline use
         run: |
           rm -rf public/drawio
-          git clone --depth 1 --branch v29.3.5 https://github.com/jgraph/drawio.git /tmp/drawio
+          git clone --depth 1 https://github.com/jgraph/drawio.git /tmp/drawio
           mkdir -p public/drawio
           cp -r /tmp/drawio/src/main/webapp/* public/drawio/
           rm -rf public/drawio/WEB-INF
@@ -70,7 +70,7 @@ jobs:
         shell: bash
         run: |
           rm -rf public/drawio
-          git clone --depth 1 --branch v29.3.5 https://github.com/jgraph/drawio.git /tmp/drawio
+          git clone --depth 1 https://github.com/jgraph/drawio.git /tmp/drawio
           mkdir -p public/drawio
           cp -r /tmp/drawio/src/main/webapp/* public/drawio/
           rm -rf public/drawio/WEB-INF

README.md

@@ -31,7 +31,7 @@ https://github.com/user-attachments/assets/9d60a3e8-4a1c-4b5e-acbb-26af2d3eabd1
   - [Table of Contents](#table-of-contents)
   - [Examples](#examples)
   - [Features](#features)
-  - [MCP Server](#mcp-server)
+  - [MCP Server (Preview)](#mcp-server-preview)
     - [Claude Code CLI](#claude-code-cli)
   - [Getting Started](#getting-started)
     - [Try it Online](#try-it-online)
@@ -99,7 +99,9 @@ Here are some example prompts and their generated diagrams:
 -   **Cloud Architecture Diagram Support**: Specialized support for generating cloud architecture diagrams (AWS, GCP, Azure)
 -   **Animated Connectors**: Create dynamic and animated connectors between diagram elements for better visualization
 
-## MCP Server
+## MCP Server (Preview)
+
+> **Preview Feature**: This feature is experimental and may not be stable.
 
 Use Next AI Draw.io with AI agents like Claude Desktop, Cursor, and VS Code via MCP (Model Context Protocol).
 

components/chat-example-panel.tsx

@@ -141,6 +141,9 @@ export default function ExamplePanel({
                                     <span className="text-sm font-medium text-foreground group-hover:text-purple-500 transition-colors">
                                         {dict.examples.mcpServer}
                                     </span>
+                                    <span className="px-1.5 py-0.5 text-[10px] font-semibold bg-purple-500 text-white rounded">
+                                        {dict.examples.preview}
+                                    </span>
                                 </div>
                                 <p className="text-xs text-muted-foreground">
                                     {dict.examples.mcpDescription}

docs/cn/README_CN.md

@@ -30,7 +30,7 @@ https://github.com/user-attachments/assets/b2eef5f3-b335-4e71-a755-dc2e80931979
   - [目录](#目录)
   - [示例](#示例)
   - [功能特性](#功能特性)
-  - [MCP服务器](#mcp服务器)
+  - [MCP服务器（预览）](#mcp服务器预览)
     - [Claude Code CLI](#claude-code-cli)
   - [快速开始](#快速开始)
     - [在线试用](#在线试用)
@@ -98,7 +98,9 @@ https://github.com/user-attachments/assets/b2eef5f3-b335-4e71-a755-dc2e80931979
 -   **云架构图支持**：专门支持生成云架构图（AWS、GCP、Azure）
 -   **动画连接器**：在图表元素之间创建动态动画连接器，实现更好的可视化效果
 
-## MCP服务器
+## MCP服务器（预览）
+
+> **预览功能**：此功能为实验性功能，可能不稳定。
 
 通过MCP（模型上下文协议）在Claude Desktop、Cursor和VS Code等AI代理中使用Next AI Draw.io。
 

docs/ja/README_JA.md

@@ -28,7 +28,7 @@ https://github.com/user-attachments/assets/b2eef5f3-b335-4e71-a755-dc2e80931979
   - [目次](#目次)
   - [例](#例)
   - [機能](#機能)
-  - [MCPサーバー](#mcpサーバー)
+  - [MCPサーバー（プレビュー）](#mcpサーバープレビュー)
     - [Claude Code CLI](#claude-code-cli)
   - [はじめに](#はじめに)
     - [オンラインで試す](#オンラインで試す)
@@ -96,7 +96,9 @@ https://github.com/user-attachments/assets/b2eef5f3-b335-4e71-a755-dc2e80931979
 -   **クラウドアーキテクチャダイアグラムサポート**：クラウドアーキテクチャダイアグラムの生成を専門的にサポート（AWS、GCP、Azure）
 -   **アニメーションコネクタ**：より良い可視化のためにダイアグラム要素間に動的でアニメーション化されたコネクタを作成
 
-## MCPサーバー
+## MCPサーバー（プレビュー）
+
+> **プレビュー機能**：この機能は実験的であり、安定しない可能性があります。
 
 MCP（Model Context Protocol）を介して、Claude Desktop、Cursor、VS CodeなどのAIエージェントでNext AI Draw.ioを使用できます。
 

lib/i18n/dictionaries/en.json

@@ -76,7 +76,8 @@
         "creativeDescription": "Draw something fun and creative",
         "cachedNote": "Examples are cached for instant response",
         "mcpServer": "MCP Server",
-        "mcpDescription": "Use in Claude Desktop, VS Code & Cursor"
+        "mcpDescription": "Use in Claude Desktop, VS Code & Cursor",
+        "preview": "PREVIEW"
     },
     "settings": {
         "title": "Settings",

lib/i18n/dictionaries/ja.json

@@ -76,7 +76,8 @@
         "creativeDescription": "楽しくてクリエイティブなものを描く",
         "cachedNote": "例はキャッシュされ、即座に応答します",
         "mcpServer": "MCP サーバー",
-        "mcpDescription": "Claude Desktop、VS Code、Cursor で使用"
+        "mcpDescription": "Claude Desktop、VS Code、Cursor で使用",
+        "preview": "プレビュー"
     },
     "settings": {
         "title": "設定",

lib/i18n/dictionaries/zh-Hant.json

@@ -76,7 +76,8 @@
         "creativeDescription": "繪製有趣且富有創意的內容",
         "cachedNote": "範例已快取，可即時回應",
         "mcpServer": "MCP 伺服器",
-        "mcpDescription": "在 Claude Desktop、VS Code 和 Cursor 中使用"
+        "mcpDescription": "在 Claude Desktop、VS Code 和 Cursor 中使用",
+        "preview": "預覽"
     },
     "settings": {
         "title": "設定",

lib/i18n/dictionaries/zh.json

@@ -76,7 +76,8 @@
         "creativeDescription": "绘制有趣且富有创意的内容",
         "cachedNote": "示例已缓存，可即时响应",
         "mcpServer": "MCP 服务器",
-        "mcpDescription": "在 Claude Desktop、VS Code 和 Cursor 中使用"
+        "mcpDescription": "在 Claude Desktop、VS Code 和 Cursor 中使用",
+        "preview": "预览"
     },
     "settings": {
         "title": "设置",

packages/mcp-server/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@next-ai-drawio/mcp-server",
-    "version": "0.1.18",
+    "version": "0.1.19",
     "description": "MCP server for Next AI Draw.io - AI-powered diagram generation with real-time browser preview",
     "type": "module",
     "main": "dist/index.js",

packages/mcp-server/src/http-server.ts

@@ -4,6 +4,29 @@
  */
 
 import http from "node:http"
+
+const MAX_BODY_BYTES = 10 * 1024 * 1024 // 10 MiB
+
+function readBody(
+    req: http.IncomingMessage,
+    res: http.ServerResponse,
+    cb: (body: string) => void,
+): void {
+    let body = ""
+    let size = 0
+    req.on("data", (chunk: Buffer) => {
+        size += chunk.length
+        if (size > MAX_BODY_BYTES) {
+            res.writeHead(413, { "Content-Type": "application/json" })
+            res.end(JSON.stringify({ error: "Payload too large" }))
+            req.destroy()
+            return
+        }
+        body += chunk
+    })
+    req.on("end", () => cb(body))
+}
+
 import {
     addHistory,
     clearHistory,
@@ -266,11 +289,7 @@ function handleStateApi(
             }),
         )
     } else if (req.method === "POST") {
-        let body = ""
+        readBody(req, res, (body) => {
-        req.on("data", (chunk) => {
-            body += chunk
-        })
-        req.on("end", () => {
             try {
                 const data = JSON.parse(body)
                 const { sessionId } = data
@@ -347,11 +366,7 @@ function handleRestoreApi(
         return
     }
 
-    let body = ""
+    readBody(req, res, (body) => {
-    req.on("data", (chunk) => {
-        body += chunk
-    })
-    req.on("end", () => {
         try {
             const { sessionId, index } = JSON.parse(body)
             if (!sessionId || index === undefined) {
@@ -393,11 +408,7 @@ function handleHistorySvgApi(
         return
     }
 
-    let body = ""
+    readBody(req, res, (body) => {
-    req.on("data", (chunk) => {
-        body += chunk
-    })
-    req.on("end", () => {
         try {
             const { sessionId, svg } = JSON.parse(body)
             if (!sessionId || !svg) {