# MCP Sequence Diagram Server
A Model Context Protocol (MCP) server that generates sequence diagram images using Mermaid syntax.
## Features
- Generate sequence diagrams from Mermaid syntax
- Convert natural language descriptions to sequence diagrams
- Support for multiple output formats (SVG, PNG)
- Customizable themes and dimensions
- Syntax validation
- File output with custom naming
## Installation
1. Clone or create the project directory:
```bash
mkdir mcp-sequence-diagram-server
cd mcp-sequence-diagram-server
```
2. Install dependencies:
```bash
npm install
```
3. Make the script executable:
```bash
chmod +x index.js
```
## Usage
### As MCP Server
Add to your MCP client configuration:
```json
{
"mcpServers": {
"sequence-diagram": {
"command": "node",
"args": ["index.js"],
"cwd": "/path/to/your/mcp-sequence-diagram-server"
}
}
}
```
### Available Tools
#### 1. `generate_sequence_diagram`
Generate a sequence diagram from Mermaid syntax.
**Parameters:**
- `diagram` (required): Mermaid sequence diagram syntax
- `format` (optional): Output format ('svg' or 'png', default: 'svg')
- `filename` (optional): Custom filename for output
- `width` (optional): Image width in pixels (default: 800)
- `height` (optional): Image height in pixels (default: 600)
- `theme` (optional): Mermaid theme ('default', 'dark', 'forest', 'neutral')
**Example:**
```javascript
{
"diagram": "sequenceDiagram\n Alice->>Bob: Hello Bob, how are you?\n Bob-->>Alice: Great!",
"format": "svg",
"filename": "greeting_sequence"
}
```
#### 2. `create_diagram_from_description`
Create a sequence diagram from natural language description.
**Parameters:**
- `description` (required): Natural language description
- `participants` (optional): Array of participant names
- `format` (optional): Output format ('svg' or 'png')
- `filename` (optional): Custom filename
**Example:**
```javascript
{
"description": "User logs in. Server validates credentials. Server returns authentication token.",
"participants": ["User", "Server"],
"format": "png"
}
```
#### 3. `validate_mermaid_syntax`
Validate Mermaid sequence diagram syntax.
**Parameters:**
- `diagram` (required): Mermaid syntax to validate
## Mermaid Sequence Diagram Syntax
### Basic Syntax
```mermaid
sequenceDiagram
participant A as Alice
participant B as Bob
A->>B: Hello Bob, how are you?
B-->>A: Great!
A-)B: See you later!
```
### Message Types
- `A->>B: message` - Solid arrow (synchronous)
- `A-->>B: message` - Dashed arrow (asynchronous response)
- `A-)B: message` - Open arrow (asynchronous)
- `A-xB: message` - Cross arrow (lost message)
### Advanced Features
```mermaid
sequenceDiagram
participant C as Client
participant S as Server
participant D as Database
C->>S: Login Request
alt successful case
S->>D: Query User
D-->>S: User Data
S-->>C: Login Success
else failure case
S-->>C: Login Failed
end
Note over C,S: Session established
loop every minute
C->>S: Heartbeat
S-->>C: ACK
end
```
## Examples
### Example 1: API Authentication Flow
```javascript
{
"diagram": `sequenceDiagram
participant Client
participant API
participant Auth
participant Database
Client->>API: POST /login
API->>Auth: Validate credentials
Auth->>Database: Query user
Database-->>Auth: User data
Auth-->>API: Token
API-->>Client: 200 OK + JWT`,
"format": "svg",
"filename": "auth_flow"
}
```
### Example 2: Natural Language
```javascript
{
"description": "Customer places order. System checks inventory. Payment is processed. Order confirmation is sent.",
"participants": ["Customer", "System", "Payment", "Inventory"],
"format": "png"
}
```
## Development
### Running in Development Mode
```bash
npm run dev
```
### Testing the Server
You can test the server using any MCP client or by running it directly:
```bash
node index.js
```
## Troubleshooting
### Common Issues
1. **Puppeteer Installation**: If Puppeteer fails to install, try:
```bash
npm install puppeteer --unsafe-perm=true --allow-root
```
2. **Linux Dependencies**: On Linux, you may need additional packages:
```bash
sudo apt-get install -y libgbm-dev gconf-service libasound2 libatk1.0-0 libc6 libcairo2 libcups2 libdbus-1-3 libexpat1 libfontconfig1 libgcc1 libgconf-2-4 libgdk-pixbuf2.0-0 libglib2.0-0 libgtk-3-0 libnspr4 libpango-1.0-0 libpangocairo-1.0-0 libstdc++6 libx11-6 libx11-xcb1 libxcb1 libxcomposite1 libxcursor1 libxdamage1 libxext6 libxfixes3 libxi6 libxrandr2 libxrender1 libxss1 libxtst6 ca-certificates fonts-liberation libappindicator1 libnss3 lsb-release xdg-utils wget
```
3. **Memory Issues**: For large diagrams, you may need to increase Node.js memory:
```bash
node --max-old-space-size=4096 index.js
```
## License
MIT License
