mermaid-diagram-generator

# Mermaid Diagram Generator Skill

## Purpose

This skill automatically converts text descriptions of system architectures, module specifications, workflow documentation, and design concepts into valid Mermaid diagram syntax. It enables clear visual communication of complex systems, ensuring diagrams are production-ready and embeddable in markdown documentation.

## When to Use This Skill

- **Architecture Visualization**: Convert architecture descriptions into flowcharts or block diagrams
- **Module Relationships**: Create diagrams showing how brick modules connect via their studs (public contracts)
- **Workflow Documentation**: Visualize workflow states, decisions, and transitions (DDD phases, investigation stages)
- **System Design**: Display system components, data flow, and interactions
- **Sequence Diagrams**: Show agent interactions, request/response patterns, or call sequences
- **Class Hierarchies**: Document module structure and class relationships
- **State Machines**: Model workflow states and valid transitions
- **Entity Relationships**: Display data model structures and relationships
- **Timeline Planning**: Create Gantt charts for project phases or milestones

## Supported Diagram Types

### 1. Flowcharts (Default)

Best for: workflow sequences, decision trees, process flows, module relationships

```mermaid
flowchart TD
    A[Start] --> B{Decision}
    B -->|Yes| C[Action A]
    B -->|No| D[Action B]
    C --> E[End]
    D --> E
```

### 2. Sequence Diagrams

Best for: agent interactions, API calls, multi-step processes, request/response patterns

```mermaid
sequenceDiagram
    participant User
    participant API
    participant Service
    User->>API: Request
    API->>Service: Process
    Service-->>API: Response
    API-->>User: Result
```

### 3. Class Diagrams

Best for: module structure, inheritance hierarchies, data models, component relationships

```mermaid
classDiagram
    class Brick {
        +String responsibility
        +PublicContrac