feat(dev-tools): adiciona plugin dev-tools (agents, skills, knowledge e metadados do projeto)

2026-10-28 16:08:45 +00:00
parent ce6030ee00
commit 7b2162ff29
180 changed files with 52164 additions and 0 deletions
@@ -0,0 +1,153 @@
+---
+name: diagrama
+category: dev-tools
+description: "Gera diagramas de arquitectura, fluxo, ER e sequência em três formatos: draw.io (.drawio), Excalidraw e Mermaid. Usar quando 'diagrama', 'arquitectura', 'draw.io', 'fluxo', 'ER', 'sequência', 'infra', 'componentes'."
+version: "1.0.0"
+created: 2026-04-04
+tools: [mcp__claude_ai_Excalidraw__export_to_excalidraw, mcp__mcp-mermaid__generate, Write, Bash]
+layer: wiki
+---
+
+# Skill: /diagrama
+
+Gera diagramas técnicos em três formatos consoante o caso de uso. Suporta arquitectura de sistemas, fluxogramas, diagramas ER, sequência, infra-estrutura e redes.
+
+---
+
+## Quando usar cada formato
+
+| Formato | Quando usar | Output |
+|---------|------------|--------|
+| **draw.io** | Diagramas formais para documentação, propostas, clientes | `.drawio` (editável) |
+| **Excalidraw** | Esboços rápidos, brainstorming visual, estilo whiteboard | `.excalidraw` / MCP |
+| **Mermaid** | Diagramas como código, versionáveis em Git, embeds Markdown | `.svg` / `.png` |
+
+---
+
+## Processo de execução
+
+### 1. Identificar pedido
+
+Quando o utilizador pede um diagrama, detectar:
+- **Tipo:** arquitectura | fluxo | ER | sequência | rede | organograma | classe
+- **Formato pretendido:** draw.io (default para doc. formal) | excalidraw | mermaid
+- **Contexto:** sistemas envolvidos, entidades, actores
+
+Se não especificado, perguntar apenas: "draw.io (formal) ou Excalidraw (esboço)?"
+
+### 2. Gerar conteúdo
+
+---
+
+## Geração draw.io (.drawio)
+
+O formato draw.io é mxGraph XML. Gerar o XML e guardar como `.drawio`.
+
+### Estrutura base
+
+```xml
+<mxfile host="Claude Code" modified="YYYY-MM-DDTHH:MM:SS" agent="Claude" version="21.0">
+  <diagram name="Diagrama" id="diagram-1">
+    <mxGraphModel dx="1422" dy="762" grid="1" gridSize="10" guides="1" tooltips="1" connect="1" arrows="1" fold="1" page="1" pageScale="1" pageWidth="1169" pageHeight="827" math="0" shadow="0">
+      <root>
+        <mxCell id="0"/>
+        <mxCell id="1" parent="0"/>
+        <!-- elementos aqui -->
+      </root>
+    </mxGraphModel>
+  </diagram>
+</mxfile>
+```
+
+### Templates de elementos mxGraph
+
+**Rectângulo (componente/serviço):**
+```xml
+<mxCell id="2" value="Nome" style="rounded=1;whiteSpace=wrap;html=1;fillColor=#dae8fc;strokeColor=#6c8ebf;" vertex="1" parent="1">
+  <mxGeometry x="160" y="160" width="120" height="60" as="geometry"/>
+</mxCell>
+```
+
+**Seta/ligação:**
+```xml
+<mxCell id="10" edge="1" source="2" target="3" parent="1">
+  <mxGeometry relative="1" as="geometry"/>
+</mxCell>
+```
+
+**Cilindro (base de dados):**
+```xml
+<mxCell id="5" value="PostgreSQL" style="shape=cylinder3;whiteSpace=wrap;html=1;boundedLbl=1;backgroundOutline=1;size=15;fillColor=#f8cecc;strokeColor=#b85450;" vertex="1" parent="1">
+  <mxGeometry x="320" y="160" width="80" height="80" as="geometry"/>
+</mxCell>
+```
+
+**Cloud (serviço externo):**
+```xml
+<mxCell id="6" value="Cloudflare" style="shape=mxgraph.cisco.sites.generic_building;sketch=0;html=1;pointerEvents=1;dashed=0;fillColor=#036897;strokeColor=#ffffff;strokeWidth=2;verticalLabelPosition=bottom;verticalAlign=top;align=center;outlineConnect=0;" vertex="1" parent="1">
+  <mxGeometry x="480" y="160" width="60" height="60" as="geometry"/>
+</mxCell>
+```
+
+**Actor (pessoa/utilizador):**
+```xml
+<mxCell id="7" value="Utilizador" style="shape=mxgraph.flowchart.start_2;fillColor=#00BEF2;strokeColor=#006EAF;fontColor=#ffffff;fontStyle=1;fontSize=12;" vertex="1" parent="1">
+  <mxGeometry x="40" y="170" width="60" height="40" as="geometry"/>
+</mxCell>
+```
+
+**Swimlane (grupo/camada):**
+```xml
+<mxCell id="8" value="Camada Frontend" style="swimlane;startSize=20;fillColor=#f5f5f5;strokeColor=#666666;fontColor=#333333;" vertex="1" parent="1">
+  <mxGeometry x="0" y="0" width="400" height="200" as="geometry"/>
+</mxCell>
+```
+
+### Paleta de cores Descomplicar
+
+| Componente | fillColor | strokeColor |
+|-----------|-----------|-------------|
+| Serviço/App | `#dae8fc` | `#6c8ebf` |
+| Base de dados | `#f8cecc` | `#b85450` |
+| Fila/Queue | `#d5e8d4` | `#82b366` |
+| Externo/Cloud | `#fff2cc` | `#d6b656` |
+| Infra/Servidor | `#e1d5e7` | `#9673a6` |
+| Claude/IA | `#f0f4ff` | `#4a6cf7` |
+
+### Guardar ficheiro
+
+Guardar em `/media/ealmeida/Dados/Hub/tmp/diagramas/` com nome descritivo:
+```
+YYYY-MM-DD-nome-diagrama.drawio
+```
+
+Abrir com:
+```bash
+drawio "/media/ealmeida/Dados/Hub/tmp/diagramas/NOME.drawio" &
+```
+(ou abrir manualmente com draw.io desktop / draw.io no browser)
+
+---
+
+## Geração Excalidraw
+
+Usar o MCP `mcp__claude_ai_Excalidraw__export_to_excalidraw` para diagramas no estilo whiteboard.
+
+### Fluxo
+
+1. Chamar `mcp__claude_ai_Excalidraw__create_view` para iniciar sessão
+2. Chamar `mcp__claude_ai_Excalidraw__export_to_excalidraw` com o conteúdo estruturado
+3. Informar o utilizador do link/path gerado
+
+### Casos de uso preferidos
+
+- Brainstorming e exploração rápida
+- Diagramas de fluxo com estilo manual
+- Esboços para reuniões
+- Arquitecturas de alto nível para comunicação interna
+
+---
+
+## Geração Mermaid
+
+Usar o MCP `mcp__mcp-mermaid__generate`