title: Mermaid.js Examples
h1:

Mermaid is integrated into Purple Tree 3. Quite basic for now.

## Mind Map
```mer
mindmap
  root((Central Idea))
    Concept A
      Sub-point 1
      Sub-point 2
    Concept B
      Sub-topic I
      Sub-topic II
        Related Detail
    Connecting Principle
```
## Decision Flowchart
```mer
graph TD
    A[Analyze Request] --> B{Valid Input?}
    B -- Yes --> C(Process Data)
    C --> D{Critical Alert?}
    D -- Yes --> E[Notify Administrator]
    D -- No --> F[Log Entry]
    E --> G[Resolve Issue]
    F --> H[Archive Record]
    B -- No --> I[Report Error]
    I --> H
    G --> H
```
## Entity Connection Diagram
```mer
graph LR
    Core[Main Interest] --> Dependency_A(Required Factor)
    Core --> Dependency_B(Supporting Idea)
    Dependency_A --> Related_Subtopic1
    Dependency_A --> Related_Subtopic2
    Dependency_B --> Related_Subtopic3
    Related_Subtopic1 --- CommonGround[Shared Principle]
    Related_Subtopic3 --- CommonGround
```
## Sequential Flow
```mer
sequenceDiagram
    actor Researcher
    participant Library
    participant Database

    Researcher->>Library: Request Access
    alt Access Granted
        Library-->>Researcher: Provide Credentials
        Researcher->>Database: Query Archives
        Database-->>Researcher: Return Results
    else Access Denied
        Library-->>Researcher: "Notification & Reason"
    end
```
## Hierarchical Structure
```mer
graph TD
    Root[Total System] --> BranchA[Component Group A]
    Root --> BranchB[Component Group B]
    BranchA --> Leaf1[Detailed Unit 1]
    BranchA --> Leaf2[Detailed Unit 2]
    BranchB --> Leaf3[Detailed Unit 3]
    BranchB --> SubBranchB1[Subcategory B1]
    SubBranchB1 --> Leaf4[Detailed Unit 4]
```
## State Diagram
```mer
stateDiagram-v2
    [*] --> Germination: New Thought
    Germination --> Researching: Active Interest
    Researching --> Draft: Knowledge Gathered
    
    state Researching {
        [*] --> Reading
        Reading --> NoteTaking
        NoteTaking --> Reading
    }

    Draft --> Review: Self-Correction
    Review --> Published: Vector Image Created
    Review --> Researching: Gaps Found
    Published --> [*]
```