Draw.io AI Sidebar

AI sidebar for app.diagrams.net: natural language to draw.io XML with direct canvas injection. This is a Chrome extension for draw.io (app.diagrams.net). It injects an AI sidebar into the page, allowing users to generate or modify diagrams with natural language and inject XML directly into the current canvas.

In a traditional workflow, users usually open "Edit Diagram" and paste XML manually. This extension streamlines the process into "describe -> generate XML -> inject", which significantly improves iteration speed.

Key Features

1. Chat-style AI interaction directly inside draw.io. 2. Natural-language generation of diagram XML with one-click injection. 3. Multi-profile configuration (baseLLMUrl, API key, model list, etc.) stored locally in the browser. 4. Image upload for multimodal context to improve model understanding. 5. Canvas-region screenshot with annotation support (freehand drawing and text notes) before sending to the model. 6. Multi-turn context support for continuous diagram refinement.

Usage

1. Open `chrome://extensions` in Chrome and enable Developer mode. 2. Click Load unpacked and select the `drawio-ai-sidebar-extension` folder. 3. Open `https://app.diagrams.net/`, then click the extension icon in the browser toolbar to open the sidebar. 4. Open Settings, create or select a profile, and fill in `baseLLMUrl`, `API Key`, and `modelList` (one model per line). 5. Click Test. Only passed models will appear in the top `Profile/Model` dropdown. 6. Enter your prompt, optionally add an uploaded image or screenshot annotations, then click Generate only or Generate and inject. 7. If needed, use the XML panel to review/edit XML and inject manually.