SVG Editor

MCP-приложение для редактирования SVG-схем, предназначенное для Wisp Science и Claude Science.

Ключевые возможности: в диалоге открывается научная SVG-схема, которую можно редактировать вручную (выделение, перетаскивание, смена цвета/текста/шрифта) или задавать устно / печатать (отправлять хост-ассистенту или выполнять простые команды прямо на месте).

Оно упаковано по тем же соглашениям, что и Motif / Ketcher:

• .claude-plugin/plugin.json + .mcp.json + skills/*/SKILL.md

• Готовый stdio MCP (без npm install при установке)

• ui://svg-editor/editor.html (text/html;profile=mcp-app)

• Если хост не запускает live-приложение, используется svg_create_artifact как автономный HTML

Как это работает

1. Ассистент вызывает svg_open_editor (можно передать SVG-текст). Wisp / Claude Science открывает редактор в центральной панели.

2. Вы выделяете элементы на холсте и меняете их свойства; состояние выделения через ui/update-model-context попадает в следующий шаг диалога.

3. Нижняя панель команд:

   • применить локально: локальный синтаксис (изменить заголовок, сменить цвет, скрыть легенду, изменить размер шрифта, сдвиг)

   • отправить ассистенту: ui/message, а модель через svg_inspect + svg_apply делает точечные хирургические правки

4. Не перерисовывайте всю схему заново. Пути и геометрия данных по умолчанию остаются без изменений.

Related MCP server: imagetosvg-mcp

Разработка

Требуется Node.js 20.19+ (рекомендуется 22+).

npm install
npm test
npm run preview    # 浏览器里单独预览编辑器
npm run build      # UI + server + dist-plugin zip
node dist/svg-editor-mcp.mjs   # stdio MCP

Установка в Wisp Science

1. npm run build

2. Откройте Настройки → Плагины → Установить плагин и выберите svg-editor-for-wisp-science.zip

3. Для удалённой установки используйте SHA-256 из svg-editor-for-wisp-science.checksums.json

4. Включите плагин для текущего проекта и нажмите Использовать в новой сессии

Wisp открывает MCP-приложение как промежуточную вкладку и пересылает tools/call (включая доступный только приложению svg_commit), пока App всё ещё привязан к исходному MCP-соединению.

Установка в Claude Science

Загрузите dist-plugin/ или zip как плагин Claude (та же структура каталогов, что и Motif for Claude Science). После разрешения локального MCP вызывайте:

• svg_open_editor — live-редактор

• svg_create_artifact — резервный автономный HTML

Инструменты

Селекторы: #id, [data-se-id="e12"], text:精确, text:~部分, простой CSS.

Безопасность

• Удаляются <script>, foreignObject, атрибуты событий и «javascript:»-URL

• UI работает в iframe с script-only и непрозрачным origin; CSP запрещает внешние сети

• Максимальный размер схемы — 2 MB