Stats
Actions
Tags
Help us improve
Share bugs, ideas, or general feedback.
From drupal-dev-framework
Generates Mermaid diagrams for data flows, service relationships, entity structures, sequences, and states to visualize software architecture.
npx claudepluginhub camoa/claude-skills --plugin drupal-dev-frameworkHow this skill is triggered — by the user, by Claude, or both
Slash command
/drupal-dev-framework:diagram-generatorThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
Create Mermaid diagrams for architecture visualization.
Generates Mermaid diagrams for flowcharts, sequence diagrams, state diagrams, class diagrams, ERDs, and system architectures to visualize complex concepts and processes.
Provides Mermaid templates for flowcharts, sequence diagrams, class diagrams, ER diagrams, and C4 models for technical documentation.
Generates Mermaid diagrams from text descriptions by analyzing intent to select types like activity, sequence, deployment, architecture, class, ER, or state.
Share bugs, ideas, or general feedback.
Create Mermaid diagrams for architecture visualization.
Activate when you detect:
Ask if unclear:
What should this diagram show?
1. Data flow (how data moves through system)
2. Service relationships (dependencies between services)
3. Entity relationships (database structure)
4. Sequence (interaction over time)
5. State (entity lifecycle)
Based on type, ask:
Data Flow:
Service Relationships:
Entity Relationships:
Create appropriate Mermaid code:
Data Flow:
flowchart LR
A[Input] --> B[Process]
B --> C[Output]
Service Dependencies:
graph TD
A[MainService] --> B[Dependency1]
A --> C[Dependency2]
Entity Relationships:
erDiagram
ENTITY1 ||--o{ ENTITY2 : has
ENTITY1 ||--|| ENTITY3 : references
Sequence:
sequenceDiagram
Actor->>Component: Action
Component-->>Actor: Response
State:
stateDiagram-v2
[*] --> State1
State1 --> State2
State2 --> [*]
Show the Mermaid code to user and ask:
Here's the diagram:
{mermaid code block}
Adjustments needed? (describe changes or "looks good")
Once approved, use Edit tool to add to appropriate architecture file:
## {Diagram Title}
{One sentence describing what this shows}
\`\`\`mermaid
{diagram code}
\`\`\`
flowchart LR
A[Request] --> B[Routing]
B --> C[Controller]
C --> D[Service]
D --> E[Entity]
E --> F[Response]
graph TD
A[PluginManager] --> B[Discovery]
A --> C[Factory]
B --> D[Annotations]
B --> E[YAML]
C --> F[Plugin Instance]
sequenceDiagram
User->>Form: Submit
Form->>Form: validateForm()
Form->>Form: submitForm()
Form->>Service: Process data
Service-->>Form: Result
Form-->>User: Redirect/Message
STOP and wait for user: