composer-mcp

Composer — это инструмент визуального проектирования систем, который позволяет ИИ-агентам создавать и изменять интерактивные архитектурные диаграммы с помощью MCP (Model Context Protocol). Ваш агент получает инструменты для добавления сервисов, баз данных, очередей и связей, а вы получаете живой холст на usecomposer.com, который обновляется в режиме реального времени.

Your IDE  <-->  MCP Server (this package)  <-->  Composer API  <-->  Your Diagram

Начало работы

Подключите вашу IDE

Claude Code:

claude mcp add --transport http composer https://mcp.usecomposer.com

Cursor — создайте .cursor/mcp.json в корне вашего проекта:

{
  "mcpServers": {
    "composer": {
      "type": "http",
      "url": "https://mcp.usecomposer.com"
    }
  }
}

При первом использовании откроется браузер для авторизации.

claude mcp add --transport http composer https://mcp.usecomposer.com

Создайте .cursor/mcp.json в корне вашего проекта:

{
  "mcpServers": {
    "composer": {
      "type": "http",
      "url": "https://mcp.usecomposer.com"
    }
  }
}

codex mcp add composer -- npx -y @usecomposer/mcp --stdio

Создайте .vscode/mcp.json в корне вашего проекта:

{
  "servers": {
    "composer": {
      "type": "http",
      "url": "https://mcp.usecomposer.com"
    }
  }
}

Откройте боковую панель Cline > Настройки (значок шестеренки) > MCP Servers > Add Remote Server:

{
  "mcpServers": {
    "composer": {
      "type": "http",
      "url": "https://mcp.usecomposer.com"
    }
  }
}

Добавьте в .continue/config.yaml:

mcpServers:
  - name: composer
    url: https://mcp.usecomposer.com

Добавьте в ~/.codeium/windsurf/mcp_config.json:

{
  "mcpServers": {
    "composer": {
      "serverUrl": "https://mcp.usecomposer.com"
    }
  }
}

Примечание: Windsurf использует "serverUrl" вместо "url".

Создайте opencode.json в корне вашего проекта:

{
  "mcp": {
    "composer": {
      "type": "remote",
      "url": "https://mcp.usecomposer.com"
    }
  }
}

Related MCP server: scryer-mcp

Инструменты

Управление диаграммами

Примечание: Вызовите list_diagrams, затем select_diagram (или create_diagram) перед использованием других инструментов.

Чтение

Запись

Планирование и проверка

Типы узлов

client · frontend · backend · database · cache · queue · storage · external

Протоколы ребер

REST · gRPC · GraphQL · WebSocket · TCP · UDP · async · event · internal

Примеры промптов

После подключения попробуйте спросить своего ИИ-агента:

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

Аутентификация осуществляется через OAuth 2.1 — ваш браузер открывается для однократного подтверждения, и вы подключены. Вызовы инструментов проксируются к API Composer по адресу mcp.usecomposer.com. Данные ваших диаграмм хранятся на серверах Composer. Сам MCP-сервер является stateless (не сохраняет состояние).

Изменения, внесенные через MCP, сразу же отображаются на холсте Composer через синхронизацию WebSocket в реальном времени.

Разработка

git clone https://github.com/olivergrabner/composer-mcp
cd composer-mcp
npm install
npm run dev        # Watch mode (rebuilds on change)
npm run build      # Production build

Ссылки

• Composer — визуальный архитектурный холст

• MCP Protocol — спецификация Model Context Protocol

• Issues — отчеты об ошибках и запросы функций

Лицензия

MIT