mermaidlisted
Install: claude install-skill Voronenko/ai-files
# Mermaid Diagram Rules
When creating Mermaid diagrams, follow these rules to avoid parsing errors:
## Critical Syntax Rules
### 1. Square Brackets in Edge Labels (PRIMARY CAUSE OF PARSE ERRORS)
**ROOT CAUSE:** Square brackets `[]` in edge labels (text between `|...|`) are interpreted as node syntax, NOT literal text.
**WRONG:**
```mermaid
A -->|Returns from_assets[]| B
```
Error: `Expecting ... got 'SQS'` (Square bracket start)
**RIGHT:**
```mermaid
A -->|Returns from_assets list| B
A -->|Returns from_assets array| B
A -->|Returns assets with cg_id| B
```
**RULE:** In edge labels, replace `[]` with words like "list", "array", "collection", or omit entirely.
### 2. Parentheses in Rectangle Nodes (SECONDARY CAUSE OF PARSE ERRORS)
**ROOT CAUSE:** Parentheses `()` inside rectangle node text `[...]` conflict with rounded node syntax `Node(Text)`.
In Mermaid:
- `Node[Text]` = rectangle node
- `Node(Text)` = rounded rectangle node
- Having `()` inside `[]` creates syntax ambiguity
**WRONG:**
```mermaid
CryptoToCrypto[to_amount =<br/>(from_amount times price)<br/>divided by rate]
```
Error: `Expecting ... got 'PS'` (Parenthesis start)
**RIGHT:**
```mermaid
CryptoToCrypto[Convert via CHF:\nfrom_amount times from_asset CHF\ndivided by to_asset CHF]
CryptoToCrypto[Calculate to_amount using CHF prices]
```
**RULE:** In rectangle nodes `[...]`, replace `()` with descriptive text or omit entirely. Use mathematical formulas in tables below the diagram.
### 3. HTML Line Breaks