| name | mermaid-expert |
| description | Expert in Mermaid visualizations. Provides templates, examples, and validation for creating diagrams as code. Triggers: "create diagram", "diagrama de secuencia", "mermaid template", "fix mermaid".
|
| license | MIT |
| metadata | {"version":"1.0.0","author":"mapplics","dependencies":[]} |
Mermaid Expert
"Diagrams as Code. Visuals that live with your repo."
Este skill asiste en la creación de diagramas complejos. No renderiza por sí mismo (eso lo hace docs-renderer), sino que ayuda a escribir el código Mermaid correcto.
🧠 Capacidades
1. Templates de Diagramas
Provee estructuras base para:
- Flowchart: Procesos y decisiones.
- Sequence: Interacciones de API y Sistemas.
- Class: Modelado de dominio.
- State: Ciclos de vida de entidades.
- Gantt: Cronogramas de proyecto.
- C4 Model: Arquitectura de software (Context, Container, Component).
2. Theming Advice
Guía sobre cómo aplicar estilos inline o clases CSS para integración con docs-renderer.
3. Debugging
Ayuda a identificar errores de sintaxis comunes (flechas incorrectas, IDs con espacios, etc.).
Comandos Comunes
No tiene scripts ejecutables complejos, es un skill de Conocimiento y Recursos.
Ver Ejemplos
Explora la base de conocimiento por tipo de diagrama:
view_file("skills/mermaid-expert/assets/examples/flowchart.md")
view_file("skills/mermaid-expert/assets/examples/sequence.md")
view_file("skills/mermaid-expert/assets/examples/technical.md")
view_file("skills/mermaid-expert/assets/examples/c4_model.md")
view_file("skills/mermaid-expert/assets/examples/styles_and_looks.md")
Cheatsheet & Config
view_file("skills/mermaid-expert/assets/cheatsheet.md")
Patrones de Diseño
Top-Down vs Left-Right
- Usar
TD para jerarquías.
- Usar
LR para líneas de tiempo o procesos paso a paso.
Identificadores
Usar IDs cortos y texto descriptivo.
graph TD
A[Inicio] --> B{¿Es válido?}
B -- Sí --> C[Procesar]
B -- No --> D[Error]
