graphs-tui

Terminal renderer for Mermaid and D2 diagrams in Rust.

Render flowcharts, state diagrams, pie charts, and D2 diagrams as clean Unicode or ASCII text in your terminal. Zero dependencies.

Features

• Mermaid Support: Flowcharts, state diagrams, pie charts
• D2 Support: Shapes, connections, containers, edge labels
• Unicode & ASCII: Beautiful Unicode boxes by default, ASCII fallback
• Auto-Detection: Automatically detects Mermaid vs D2 format
• Zero Dependencies: Pure Rust, no external crates

Installation

[dependencies]
graphs-tui = "0.1"

Examples

Mermaid Flowchart

use graphs_tui::{render_mermaid_to_tui, RenderOptions};

let input = r#"flowchart LR
    A[Start] --> B[Process]
    B --> C{Decision}
    C -->|Yes| D[Done]
    C -->|No| B"#;

let output = render_mermaid_to_tui(input, RenderOptions::default()).unwrap();
println!("{}", output);

Output:

┌─────┐        ┌───────┐        /  \
│Start│───────▶│Process│───────▶<Dec>
└─────┘        └───────┘        \  /
                                 │
                    ┌────Yes─────┘
                    ▼
                 ┌────┐
                 │Done│
                 └────┘

Mermaid State Diagram

use graphs_tui::{render_state_diagram, RenderOptions};

let input = r#"stateDiagram-v2
    [*] --> Idle
    Idle --> Running: start
    Running --> Idle: stop
    Running --> [*]: complete"#;

let output = render_state_diagram(input, RenderOptions::default()).unwrap();
println!("{}", output);

Output:

  (●)
   │
   ▼
╭────╮
│Idle│◀──stop──┐
╰────╯         │
   │           │
   │start      │
   ▼           │
╭───────╮      │
│Running│──────┘
╰───────╯
   │
   │complete
   ▼
  (◉)

Mermaid Pie Chart

use graphs_tui::{render_pie_chart, RenderOptions};

let input = r#"pie
    title Project Status
    "Completed" : 45
    "In Progress" : 30
    "Pending" : 15
    "Blocked" : 10"#;

let output = render_pie_chart(input, RenderOptions::default()).unwrap();
println!("{}", output);

Output:

  Project Status
  ──────────────

  Completed    │██████████████                │ 45 (45.0%)
  In Progress  │█████████                     │ 30 (30.0%)
  Pending      │▒▒▒▒▒                         │ 15 (15.0%)
  Blocked      │▒▒▒                           │ 10 (10.0%)

               Total: 100

D2 Diagram

use graphs_tui::{render_d2_to_tui, RenderOptions};

let input = r#"
user: User
server: Web Server
db: Database

user -> server: HTTP request
server -> db: SQL query
db -> server: Result
server -> user: Response
"#;

let output = render_d2_to_tui(input, RenderOptions::default()).unwrap();
println!("{}", output);

Output:

┌────┐
│User│
└────┘
   │
   │HTTP request
   ▼
┌──────────┐
│Web Server│
└──────────┘
   │
   │SQL query
   ▼
┌────────┐
│Database│
└────────┘

D2 with Containers

use graphs_tui::{render_d2_to_tui, RenderOptions};

let input = r#"
backend {
    api: API Server
    db: Database
    cache: Redis
}

frontend {
    web: React App
    mobile: iOS App
}

web -> api
mobile -> api
api -> db
api -> cache
"#;

let output = render_d2_to_tui(input, RenderOptions::default()).unwrap();
println!("{}", output);

Auto-Detection

use graphs_tui::{render_diagram, detect_format, DiagramFormat, RenderOptions};

let mermaid_input = "flowchart LR\n    A --> B --> C";
let d2_input = "A -> B -> C";

// Auto-detect and render
let output1 = render_diagram(mermaid_input, RenderOptions::default()).unwrap();
let output2 = render_diagram(d2_input, RenderOptions::default()).unwrap();

// Check format
assert_eq!(detect_format(mermaid_input), DiagramFormat::Mermaid);
assert_eq!(detect_format(d2_input), DiagramFormat::D2);

ASCII Mode

For environments without Unicode support:

use graphs_tui::{render_mermaid_to_tui, RenderOptions};

let input = "flowchart LR\n    A[Start] --> B[End]";
let options = RenderOptions { ascii: true, max_width: None };
let output = render_mermaid_to_tui(input, options).unwrap();
println!("{}", output);

Output:

+-----+        +---+
|Start|------->|End|
+-----+        +---+

Supported Syntax

Mermaid Flowcharts

Mermaid State Diagrams

D2 Diagrams

Development

git clone https://github.com/decisiongraph/graphs-tui.git
cd graphs-tui
cargo test

License

AGPL-3.0-or-later

Inspiration

Inspired by tariqshams/mermaidtui