# Available Diagram Types for Flow in diagram-design: Supported Mermaid Kinds

> Discover the four flow diagram types supported by diagram-design: flowchart, sequenceDiagram, stateDiagram-v2, and erDiagram. Visualize your processes effectively with Mermaid.

- Repository: [Cathryn Lavery/diagram-design](https://github.com/cathrynlavery/diagram-design)
- Tags: api-reference
- Published: 2026-09-08

---

**The cathrynlavery/diagram-design repository supports exactly four diagram types for flow-related visualizations: flowchart (aliased as graph), sequenceDiagram, stateDiagram-v2, and erDiagram.**

These diagram kinds are hardcoded in the Mermaid extractor and represent the only formats recognized for processing flow-based diagrams. When working with the diagram-design skill, using any Mermaid syntax outside of these four types will result in parsing errors.

## Supported Diagram Types for Flow

The parser defined in [`skills/diagram-design/scripts/mermaid_extract.py`](https://github.com/cathrynlavery/diagram-design/blob/main/skills/diagram-design/scripts/mermaid_extract.py) explicitly enumerates four allowed diagram kinds. Each serves distinct flow visualization purposes within the engine.

### Flowchart (Graph)

The **flowchart** diagram kind—also referenced as **graph**—provides classic flow-chart representation with nodes and directed edges. This is the primary flow type recognized by the parser for general workflow visualization.

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

```

### Sequence Diagram

**sequenceDiagram** visualizes interactions between participants over time, displaying message sequences that represent temporal workflow communications between system actors.

```mermaid
sequenceDiagram
    participant Alice
    participant Bob
    Alice->>Bob: Hello Bob, how are you?
    Bob-->>Alice: I'm good, thanks!

```

### State Diagram v2

The **stateDiagram-v2** kind models state-machine transitions, making it ideal for workflow visualization where entities progress through discrete states based on triggering events.

```mermaid
stateDiagram-v2
    [*] --> Idle
    Idle --> Running : start
    Running --> Idle : stop
    Running --> Error : fail
    Error --> Idle : reset

```

### Entity-Relationship Diagram

While primarily for data modeling, **erDiagram** supports flow-related visualizations by representing entity relationships and data flows within system architectures.

```mermaid
erDiagram
    CUSTOMER ||--o{ ORDER : places
    ORDER ||--|{ LINE_ITEM : contains
    CUSTOMER {
        string name
        string address
    }
    ORDER {
        int id
        date orderDate
    }

```

## Implementation in the Source Code

The available diagram types for flow are strictly defined in the `SUPPORTED_KINDS` constant at line 35 of [`skills/diagram-design/scripts/mermaid_extract.py`](https://github.com/cathrynlavery/diagram-design/blob/main/skills/diagram-design/scripts/mermaid_extract.py). This constant enumerates the four allowed values, ensuring the parser only accepts these specific Mermaid declarations.

The parser's grammar comment at line 9 explicitly lists the four kinds, mentioning `flowchart/graph` as the primary flow type. This implementation choice means that unsupported diagram kinds—such as `pie`, `gantt`, or `gitGraph`—trigger validation failures.

At line 770, the extractor's error handling logic rejects any unsupported diagram kind with a specific error message, preventing downstream processing of invalid Mermaid syntax.

## Processing Flow Diagrams with the Extractor

To utilize these diagram types, save your Mermaid definitions in `.mmd` files and process them through the extractor:

```bash
python -m skills.diagram-design.scripts.mermaid_extract example.mmd

```

The repository also includes [`skills/diagram-design/scripts/drawio_extract.py`](https://github.com/cathrynlavery/diagram-design/blob/main/skills/diagram-design/scripts/drawio_extract.py) for handling Draw.io imports with compatible flowchart candidates. For validation testing, the [`scripts/verify-mermaid-import.py`](https://github.com/cathrynlavery/diagram-design/blob/main/scripts/verify-mermaid-import.py) test suite verifies parser behavior across all supported diagram kinds, ensuring consistent handling of flow syntax.

## Summary

- The cathrynlavery/diagram-design repository recognizes exactly **four diagram types** specifically for flow-related visualizations: flowchart/graph, sequenceDiagram, stateDiagram-v2, and erDiagram.
- Valid diagram kinds are hardcoded in the `SUPPORTED_KINDS` constant within [`mermaid_extract.py`](https://github.com/cathrynlavery/diagram-design/blob/main/mermaid_extract.py) at line 35.
- Attempting to use unsupported Mermaid types results in explicit errors at line 770 of the extractor.
- The engine supports both native Mermaid files and Draw.io imports through separate extractor modules.

## Frequently Asked Questions

### What happens if I use an unsupported diagram type like Gantt or Pie?

The parser will reject the file with an "unsupported diagram kind" error. According to the error handling implementation at line 770 of [`mermaid_extract.py`](https://github.com/cathrynlavery/diagram-design/blob/main/mermaid_extract.py), only the four types listed in `SUPPORTED_KINDS` are permitted; any other Mermaid declaration triggers immediate validation failure.

### Can I use "graph" instead of "flowchart" in my Mermaid syntax?

Yes, the parser recognizes `graph` as a valid alias for `flowchart`. The grammar comments at line 9 of [`mermaid_extract.py`](https://github.com/cathrynlavery/diagram-design/blob/main/mermaid_extract.py) explicitly mention `flowchart/graph` as the primary flow type, allowing both keywords interchangeably.

### How do I verify that my diagram type is supported before processing?

Use the [`scripts/verify-mermaid-import.py`](https://github.com/cathrynlavery/diagram-design/blob/main/scripts/verify-mermaid-import.py) test suite, which validates the parser's behavior for each supported diagram kind. This script tests against the `SUPPORTED_KINDS` definitions and will flag any unsupported syntax before production processing.

### Are there plans to support additional flow diagram types?

Based on the current source code analysis, the `SUPPORTED_KINDS` constant at line 35 contains only the four enumerated types, and line 770's strict validation logic suggests that extending support would require modifying both the constant definition and the parser's grammar rules.