# Telescopo Mermaid Capability Sample

This sample reflects the 18 diagram capabilities registered in Telescopo Markdown Studio as verified in August 2026. Mermaid syntax evolves; consult the [official syntax reference](https://mermaid.js.org/intro/syntax-reference.html) for upstream language details.

## Flow and Interaction

### Flowchart

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

### Sequence Diagram

```mermaid
sequenceDiagram
    participant Client
    participant Server
    participant DB
    Client->>Server: Request
    Server->>DB: Query
    DB-->>Server: Results
    Server-->>Client: Response
```

### ZenUML Sequence Diagram

```zenuml
Controller.Get(id) {
    item = Repository.Get(id)
    if(item) {
        return item
    }
    return null
}
```

### State Diagram

```mermaid
stateDiagram-v2
    [*] --> Idle
    Idle --> Loading : fetch
    Loading --> Success : resolve
    Loading --> Error : reject
    Error --> Loading : retry
    Success --> [*]
```

### Journey

```mermaid
journey
    title User Onboarding
    section Sign Up
      Visit site: 5: User
      Create account: 3: User
    section First Use
      Open app: 4: User
      Create first document: 5: User
```

### Timeline

```mermaid
timeline
    title Project History
    2024 : Founded
         : First prototype
    2025 : Public beta
    2026 : Major release
```

## Software and Systems

### C4 Diagram

```mermaid
C4Context
    title System Context
    Person(user, "Reader")
    System(telescopo, "Telescopo", "Markdown studio")
    Rel(user, telescopo, "Reads and edits Markdown")
```

### Class Diagram

```mermaid
classDiagram
    class Animal {
      +String name
      +makeSound()
    }
    class Dog {
      +fetch()
    }
    Animal <|-- Dog
```

### ER Diagram

```mermaid
erDiagram
    USER ||--o{ POST : writes
    POST ||--o{ COMMENT : has
    USER ||--o{ COMMENT : writes
```

### Requirement

```mermaid
requirementDiagram
    requirement req1 {
        id: 1
        text: System shall be fast
        risk: low
        verifymethod: test
    }
    element app {
        type: application
    }
    app - satisfies -> req1
```

### Git Graph

```mermaid
gitGraph
    commit
    branch feature
    checkout feature
    commit
    checkout main
    merge feature
    commit
```

## Planning and Strategy

### Gantt Chart

```mermaid
gantt
    title Project Plan
    dateFormat YYYY-MM-DD
    section Phase 1
    Research      :done, a1, 2026-01-01, 14d
    Development   :active, a2, after a1, 21d
    section Phase 2
    Testing       :a3, after a2, 14d
    Launch        :a4, after a3, 7d
```

### Kanban

```mermaid
kanban
    todo[Todo]
        task1[Plan release]
        task2[Write documentation]
    doing[In Progress]
        task3[Implement feature]
    done[Done]
        task4[Design review]
```

### Event Modeling

```mermaid
eventmodeling
    tf 01 ui CartUI
    tf 02 cmd AddItem
    tf 03 evt ItemAdded
    tf 04 rmo CartItems
```

### Mindmap

```mermaid
mindmap
    root((Central Topic))
        Branch A
            Detail 1
            Detail 2
        Branch B
            Detail 3
            Detail 4
```

## Data and Analysis

### Pie Chart

```mermaid
pie title Distribution
    "Category A" : 45
    "Category B" : 30
    "Category C" : 25
```

### Donut Chart

```mermaid
---
config:
  pie:
    donutHole: 0.55
---
pie showData title Distribution
    "Category A" : 45
    "Category B" : 30
    "Category C" : 25
```

### Quadrant Chart

```mermaid
quadrantChart
    title Priority Matrix
    x-axis Low Effort --> High Effort
    y-axis Low Impact --> High Impact
    quadrant-1 Do First
    quadrant-2 Schedule
    quadrant-3 Delegate
    quadrant-4 Eliminate
    Task A: [0.2, 0.8]
    Task B: [0.7, 0.9]
    Task C: [0.8, 0.3]
```