diagram-generator

Name: diagram-generator
Author: zhaoxuya520

8.8kstars1.4kforks

How to install diagram-generator?

zhaoxuya520/reverse-skill/diagram-generator

$npx -y skills add zhaoxuya520/reverse-skill --skill diagram-generator

Installs into the current project.

Summary

generate, refine, validate, and render diagrams from natural language, notes, code snippets, schemas, tables, or existing diagram source. use for flowcharts, swimlanes, sequence diagrams, state diagrams, er diagrams, class diagrams, architecture/c4-style diagrams, dependency grap

Files · 1

View on GitHub

SKILL.md

1	# Diagram Generator
2
3	## ACTION REQUIRED（读完后立刻执行）
4
5	1. `NOW`：确认当前任务是否命中本 skill 的适用范围
6	2. `NOW`：读取 `../tool-index.md`，校验工具可用性和实际路径
7	3. `NEXT`：缺工具时调用 bootstrap，不要猜路径
8	4. `ACT`：进入"工作流"第一步并执行，不要停在确认状态
9
10	## Purpose
11
12	Create clear, editable diagrams from messy or structured inputs. Prefer text-based diagram source first so the result can be reviewed, versioned, and refined. Render to files only when the user asks for an image/PDF or when a downloadable artifact would materially help.
13
14	## Default workflow
15
16	1. Identify the user's intent, audience, and source material.
17	2. Choose the diagram family and language using the decision table below.
18	3. Normalize entities, relationships, labels, states, branches, and time/order information before writing diagram code.
19	4. Generate concise, readable diagram source.
20	5. Validate the syntax mentally and, when creating files, run `scripts/render_diagram.py`.
21	6. Return the diagram source plus a short note about assumptions. When files are generated, include links to the output files.
22
23	Do not over-ask for clarification. If the request is underspecified, make reasonable assumptions and label them briefly.
24
25	## Diagram language decision table
26
27	Use Mermaid unless another language is clearly better.
28
29	\| User wants \| Prefer \| Why \|
30	\|---\|---\|---\|
31	\| process flow, decision tree, simple swimlane \| Mermaid flowchart \| readable and easy to paste into Markdown \|
32	\| sequence of system/user interactions \| Mermaid sequenceDiagram or PlantUML sequence \| Mermaid for docs; PlantUML for UML formality \|
33	\| lifecycle, state machine, transitions \| Mermaid stateDiagram-v2 or PlantUML state \| compact transition syntax \|
34	\| database schema, entities, relationships \| Mermaid erDiagram \| portable ER notation \|
35	\| class/interface/object model \| Mermaid classDiagram or PlantUML class \| Mermaid for docs; PlantUML for detailed UML \|
36	\| project schedule \| Mermaid gantt \| concise timeline syntax \|
37	\| hierarchy, ideas, notes \| Mermaid mindmap \| good default for idea maps \|
38	\| customer/product journey \| Mermaid journey \| built-in journey notation \|
39	\| git history \| Mermaid gitGraph \| built-in git notation \|
40	\| dependency graph, package graph, large network \| Graphviz DOT \| better layout engines for dense graphs \|
41	\| architecture with layers, clusters, boundaries \| Mermaid flowchart with subgraphs, Graphviz clusters, or PlantUML C4-style \| choose based on requested fidelity \|
42	\| weighted flow/sankey-like relationship \| Mermaid sankey-beta when supported, otherwise SVG or Graphviz \| Mermaid support may vary by renderer \|
43	\| custom visual where source languages fit poorly \| SVG \| precise control over layout and styling \|
44
45	## Output policy
46
47	- Always provide editable source unless the user explicitly asks only for an image.
48	- Default to a single best diagram. Offer alternatives only when genuinely useful.
49	- Prefer stable, simple syntax over fancy features that may not render in older Mermaid/PlantUML versions.
50	- Use short labels. Split long text into notes outside the diagram when needed.
51	- Avoid ambiguous node IDs. Use ASCII IDs and human-readable labels.
52	- Preserve user terminology, but standardize capitalization within a diagram.
53	- For technical diagrams, include boundaries such as client, service, database, queue, external API, and operator/user when they are implied.
54	- For business-process diagrams, distinguish happy path, decision points, failures, retries, and manual steps when present.
55	- For diagrams created from uncertain text, include an `Assumptions` section after the code.
56
57	## Mermaid generation rules
58
59	Consult `references/diagram-patterns.md` for compact templates.
60
61	General Mermaid rules:
62	- Start with the correct diagram directive, for example `flowchart TD`, `sequenceDiagram`, `erDiagram`, `gantt`, `mindmap`, or `journey`.
63	- For flowcharts, use `flowchart TD` unless the user asks for left-to-right; use `flowchart LR` for architecture and pipelines.
64	- Use subgraphs for swimlanes or architecture layers. Name subgraphs with readable labels.
65	- Keep node IDs stable and ASCII-only, for example `ingest_service[Ingest Service]`.
66	- Quote labels that contain punctuation likely to confuse the parser.
67	- Use decision diamonds for branching: `decision{Condition?}`.
68	- Use consistent edge labels: `-- yes -->`, `-- no -->`, `-. async .->`, or `== critical ==>` only when meaningful.
69	- In sequence diagrams, declare participants before messages. Use `ac

People who liked this also viewed

6 picks

Type

diagram-generator

8.8kstars1.4kforks

View on GitHub

How to install diagram-generator?

zhaoxuya520/reverse-skill/diagram-generator

$npx -y skills add zhaoxuya520/reverse-skill --skill diagram-generator

Installs into the current project.

Summary

Files · 1

View on GitHub

SKILL.md

1	# Diagram Generator
2
3	## ACTION REQUIRED（读完后立刻执行）
4
5	1. `NOW`：确认当前任务是否命中本 skill 的适用范围
6	2. `NOW`：读取 `../tool-index.md`，校验工具可用性和实际路径
7	3. `NEXT`：缺工具时调用 bootstrap，不要猜路径
8	4. `ACT`：进入"工作流"第一步并执行，不要停在确认状态
9
10	## Purpose
11
12	Create clear, editable diagrams from messy or structured inputs. Prefer text-based diagram source first so the result can be reviewed, versioned, and refined. Render to files only when the user asks for an image/PDF or when a downloadable artifact would materially help.
13
14	## Default workflow
15
16	1. Identify the user's intent, audience, and source material.
17	2. Choose the diagram family and language using the decision table below.
18	3. Normalize entities, relationships, labels, states, branches, and time/order information before writing diagram code.
19	4. Generate concise, readable diagram source.
20	5. Validate the syntax mentally and, when creating files, run `scripts/render_diagram.py`.
21	6. Return the diagram source plus a short note about assumptions. When files are generated, include links to the output files.
22
23	Do not over-ask for clarification. If the request is underspecified, make reasonable assumptions and label them briefly.
24
25	## Diagram language decision table
26
27	Use Mermaid unless another language is clearly better.
28
29	\| User wants \| Prefer \| Why \|
30	\|---\|---\|---\|
31	\| process flow, decision tree, simple swimlane \| Mermaid flowchart \| readable and easy to paste into Markdown \|
32	\| sequence of system/user interactions \| Mermaid sequenceDiagram or PlantUML sequence \| Mermaid for docs; PlantUML for UML formality \|
33	\| lifecycle, state machine, transitions \| Mermaid stateDiagram-v2 or PlantUML state \| compact transition syntax \|
34	\| database schema, entities, relationships \| Mermaid erDiagram \| portable ER notation \|
35	\| class/interface/object model \| Mermaid classDiagram or PlantUML class \| Mermaid for docs; PlantUML for detailed UML \|
36	\| project schedule \| Mermaid gantt \| concise timeline syntax \|
37	\| hierarchy, ideas, notes \| Mermaid mindmap \| good default for idea maps \|
38	\| customer/product journey \| Mermaid journey \| built-in journey notation \|
39	\| git history \| Mermaid gitGraph \| built-in git notation \|
40	\| dependency graph, package graph, large network \| Graphviz DOT \| better layout engines for dense graphs \|
41	\| architecture with layers, clusters, boundaries \| Mermaid flowchart with subgraphs, Graphviz clusters, or PlantUML C4-style \| choose based on requested fidelity \|
42	\| weighted flow/sankey-like relationship \| Mermaid sankey-beta when supported, otherwise SVG or Graphviz \| Mermaid support may vary by renderer \|
43	\| custom visual where source languages fit poorly \| SVG \| precise control over layout and styling \|
44
45	## Output policy
46
47	- Always provide editable source unless the user explicitly asks only for an image.
48	- Default to a single best diagram. Offer alternatives only when genuinely useful.
49	- Prefer stable, simple syntax over fancy features that may not render in older Mermaid/PlantUML versions.
50	- Use short labels. Split long text into notes outside the diagram when needed.
51	- Avoid ambiguous node IDs. Use ASCII IDs and human-readable labels.
52	- Preserve user terminology, but standardize capitalization within a diagram.
53	- For technical diagrams, include boundaries such as client, service, database, queue, external API, and operator/user when they are implied.
54	- For business-process diagrams, distinguish happy path, decision points, failures, retries, and manual steps when present.
55	- For diagrams created from uncertain text, include an `Assumptions` section after the code.
56
57	## Mermaid generation rules
58
59	Consult `references/diagram-patterns.md` for compact templates.
60
61	General Mermaid rules:
62	- Start with the correct diagram directive, for example `flowchart TD`, `sequenceDiagram`, `erDiagram`, `gantt`, `mindmap`, or `journey`.
63	- For flowcharts, use `flowchart TD` unless the user asks for left-to-right; use `flowchart LR` for architecture and pipelines.
64	- Use subgraphs for swimlanes or architecture layers. Name subgraphs with readable labels.
65	- Keep node IDs stable and ASCII-only, for example `ingest_service[Ingest Service]`.
66	- Quote labels that contain punctuation likely to confuse the parser.
67	- Use decision diamonds for branching: `decision{Condition?}`.
68	- Use consistent edge labels: `-- yes -->`, `-- no -->`, `-. async .->`, or `== critical ==>` only when meaningful.
69	- In sequence diagrams, declare participants before messages. Use `ac

People who liked this also viewed

6 picks

Type