skilly. Buy ad slot
All skills
Community / AGENT SKILL

mermaid-diagrams

Vitammiin/agent-vorcl-flow
0 installs 2 GitHub stars
0

Создание диаграмм на языке Mermaid — точный синтаксис по всем 32 типам в каталоге references/ (flowchart, sequence, class, state, ER, gantt, gitGraph, C4, architecture, block, mindmap, treeView, timeline, kanban, pie, xychart, radar, quadrant, sankey, treemap, venn, packet, requirement, journey, swimlane, eventmodeling, cynefin, ishikawa, wardley, railroad, zenuml, usecase), узлы/связи, `subgraph`, `classDef`/`class`/`style`, направление, экранирование подписей, частые AI-ошибки и правила качества. Use при создании, конвертации или правке Mermaid-диаграмм.

BEFORE YOU INSTALL

Understand the trade-offs.

SECURITY REVIEW

Not yet assessed

Review the original instructions and requested permissions before installing.

No security review is available for this catalog entry yet.

SKILL QUALITY

Not yet assessed

How clearly the skill guides your agent, how complete its workflow is, and how you can check the outcome.

No quality assessment is available for this catalog entry yet.

The full skill.

Original instructions from the publisher’s SKILL.md

# Навык: Mermaid-диаграммы

По описанию/исходнику — валидный читаемый Mermaid (`.mmd`). Синтаксис версионно-зависим. Валидацию/рендер см. `$mermaid-rendering`.

**Навигатор.** База: [общий синтаксис](#общий-синтаксис) → [группировка, цвета, стили](#цветагруппы) → [правила качества](#качество). Перед сдачей обязательно: [частые AI-ошибки](#частые-ai-ошибки). Мини-примеры типов — внизу: [Типы](#типы-заголовок).

## Справочники (references/)
Точный синтаксис **не пиши по памяти** — он версионно-зависим. Рядом со скиллом лежит каталог `references/`, дистиллированный из официальной документации mermaid и проверенный рендером: `flowchart.md`, `sequence.md`, `class.md`, `state.md`, `er.md`, `gantt.md`, `gitgraph.md`, `c4.md`, `architecture.md` (+`block`), `hierarchy.md` (mindmap/treeView/timeline/kanban), `charts.md` (pie/xychart/radar/quadrant/sankey/treemap/venn/packet), `modeling.md` (requirement/journey/swimlane/eventmodeling/cynefin/ishikawa/wardley/railroad/usecase), `config.md`, `theming.md`, `gotchas.md`. Открывай только нужный файл.

## Общий синтаксис
Первая строка — тип (`flowchart TD`, `sequenceDiagram`, `classDiagram`…); опечатка ломает файл. Комментарии `%%`. Направление flowchart: `TD`/`LR`/`RL`/`BT`. Подписи со спецсимволами → в кавычки: `A["Текст (v2) & детали"]`.

## Цвета/группы
Группы — `subgraph BACKEND["Сервер"] … end` (парный `end`). Семантические цвета: `classDef service fill:#dae8fc,stroke:#6c8ebf;` + `class API,DB service`; точечно `style A fill:#f8cecc`. Роль → один класс/цвет; граф не перегружай.

## Качество
Тип под задачу (процесс→flowchart, время→sequence, данные→ER, классы→class, состояния→state, план→gantt); направление осознанно (`LR` для длинных цепочек, `TD` для деревьев); большие схемы разбивай; реальный рендер (`$mermaid-rendering`) — окончательный критерий: не отдавай `.mmd`, не прошедший `mmdc`/`mcp-mermaid`. Зелёный рендер ≠ читаемая схема: если можешь посмотреть на PNG/SVG — проверь обрезанные подписи, слипшуюся плотность, спагетти связей, пропорции и контраст; максимум два круга правок, после каждого рендер заново.

## Частые AI-ошибки
Опечатка заголовка (`lowchart`/`sequbceDiagram`); `end` в нижнем регистре как текст узла (пиши `End`/`[End]`/в кавычках); скобки/кавычки/`#`/`;` в подписях без `["..."]`; непарные `subgraph/end`, лишние/недостающие `end` в `alt/loop`; неверная кардинальность ERD; смешение синтаксиса типов; перегруженный граф без `subgraph`/направления.

## Типы (заголовок)
- **flowchart** — процессы: узлы `[..]` `(..)` `{..}` `[(БД)]` `((круг))`; связи `-->` `-.->` `==>` `-->|подпись|`; группы `subgraph … end`.
- **sequenceDiagram** — время: `->>` вызов, `-->>` ответ, `alt/loop/Note`.
- **classDiagram** — классы: `<|--` наследование, `*--` композиция, `-->` ассоциация.
- **stateDiagram-v2** — состояния: `[*] --> S --> [*]`.
- **erDiagram** — данные: `USER ||--o{ ORDER : places` (кардинальности `||`, `o{`, `|{`).
- **gantt** — план (`dateFormat`, `section`); **pie**, **gitGraph**, **mindmap**, **timeline**, **journey**, **quadrantChart**, **sankey-beta**, **C4Context**.