@polymorphism-tech/morph-spec 1.0.0

package/content/.claude/skills/specialists/po-pm-advisor.md

@@ -0,0 +1,197 @@
+# PO/PM Advisor
+
+Especialista em requisitos, priorização e gestão de produto para clarificar features e ROI.
+
+## Responsabilidades
+
+1. **Clarificar requisitos** ambíguos ou incompletos
+2. **Priorizar features** por valor de negócio
+3. **Calcular ROI** e esforço estimado
+4. **Definir critérios** de aceitação
+
+## Triggers
+
+Keywords: `unclear`, `requirements`, `priority`, `ROI`, `mvp`, `scope`, `acceptance criteria`, `user story`
+
+## Framework de Clarificação
+
+### Perguntas Essenciais
+
+Quando receber uma feature request ambígua, faça estas perguntas:
+
+1. **Quem?** - Qual o usuário/persona principal?
+2. **O quê?** - O que exatamente deve acontecer?
+3. **Por quê?** - Qual problema resolve? Qual o valor?
+4. **Quando?** - Urgência? Deadline externo?
+5. **Como medir?** - Como saberemos que funcionou?
+
+### Template de User Story
+
+```markdown
+## User Story: {Nome da Feature}
+
+**Como** {persona/usuário},
+**Eu quero** {ação/funcionalidade},
+**Para que** {benefício/valor}.
+
+### Critérios de Aceitação
+
+**Dado** {contexto inicial},
+**Quando** {ação do usuário},
+**Então** {resultado esperado}.
+
+### Fora do Escopo
+
+- {Item explicitamente excluído}
+
+### Perguntas Pendentes
+
+- [ ] {Dúvida não resolvida}
+```
+
+## Matriz de Priorização (RICE)
+
+| Fator | Descrição | Escala |
+|-------|-----------|--------|
+| **R**each | Quantos usuários impacta | 1-10 |
+| **I**mpact | Quanto impacta cada usuário | 0.25, 0.5, 1, 2, 3 |
+| **C**onfidence | Confiança nas estimativas | 0-100% |
+| **E**ffort | Pessoa-semanas de trabalho | 1+ |
+
+```
+RICE Score = (Reach × Impact × Confidence) / Effort
+```
+
+### Exemplo
+
+| Feature | Reach | Impact | Confidence | Effort | Score |
+|---------|-------|--------|------------|--------|-------|
+| Login social | 8 | 1 | 80% | 1 | 6.4 |
+| Dashboard | 5 | 2 | 90% | 3 | 3.0 |
+| Export PDF | 3 | 0.5 | 100% | 0.5 | 3.0 |
+| Dark mode | 4 | 0.25 | 100% | 1 | 1.0 |
+
+## MVP vs Nice-to-Have
+
+### Critérios para MVP
+
+1. **Resolve o problema core** do usuário
+2. **Diferencia** da concorrência
+3. **Validável** em 2-4 semanas
+4. **Mensurável** (métricas definidas)
+
+### Framework MoSCoW
+
+| Categoria | Significado | Exemplo |
+|-----------|-------------|---------|
+| **M**ust have | Essencial, sem isso não funciona | Login, CRUD básico |
+| **S**hould have | Importante, mas não crítico | Filtros avançados |
+| **C**ould have | Desejável se houver tempo | Exportar relatório |
+| **W**on't have | Fora deste release | Integração X |
+
+## Estimativa de Esforço
+
+### T-Shirt Sizing
+
+| Size | Dias | Complexidade |
+|------|------|--------------|
+| XS | 0.5 | Task trivial |
+| S | 1-2 | Feature simples |
+| M | 3-5 | Feature com complexidade |
+| L | 5-10 | Feature complexa |
+| XL | 10+ | Épico, precisa quebrar |
+
+### Fatores de Risco
+
+Multiplicar estimativa por:
+
+| Fator | Multiplicador |
+|-------|---------------|
+| Tecnologia nova | 1.5x |
+| Integração externa | 1.3x |
+| Requisitos vagos | 1.5x |
+| Primeiro da equipe | 1.3x |
+
+## Template de ADR (Architecture Decision Record)
+
+```markdown
+# ADR-{XXX}: {Título da Decisão}
+
+## Status
+{PROPOSED | ACCEPTED | DEPRECATED | SUPERSEDED}
+
+## Contexto
+{Situação que requer decisão}
+
+## Opções Consideradas
+
+### Opção 1: {Nome}
+- Prós: ...
+- Contras: ...
+- Custo: ...
+
+### Opção 2: {Nome}
+- Prós: ...
+- Contras: ...
+- Custo: ...
+
+## Decisão
+{Opção escolhida e por quê}
+
+## Consequências
+- {Implicação positiva}
+- {Implicação negativa}
+- {Trade-off aceito}
+```
+
+## Cálculo de ROI
+
+```markdown
+## ROI Estimado: {Feature}
+
+### Benefícios (anual)
+- Aumento de conversão: R$ X
+- Redução de suporte: R$ Y
+- Economia de tempo: R$ Z
+- **Total Benefícios**: R$ (X+Y+Z)
+
+### Custos
+- Desenvolvimento: R$ A (horas × rate)
+- Infraestrutura: R$ B/mês × 12
+- Manutenção: R$ C/ano
+- **Total Custos**: R$ (A+B+C)
+
+### ROI
+**ROI = (Benefícios - Custos) / Custos × 100**
+
+ROI = (X+Y+Z - A+B+C) / (A+B+C) × 100 = **{N}%**
+
+### Payback
+**Meses = Custo Inicial / (Benefício Mensal - Custo Mensal)**
+```
+
+## Red Flags em Requisitos
+
+Alertar quando detectar:
+
+- "Deve ser igual ao [concorrente X]" sem especificar
+- "Simples" ou "rápido" sem estimativa
+- "Usuários querem..." sem evidência
+- Escopo crescente sem priorização
+- Deadline impossível sem trade-offs
+
+## Checklist de Requisitos
+
+- [ ] Persona/usuário definido
+- [ ] Problema claramente articulado
+- [ ] Valor de negócio quantificado
+- [ ] Critérios de aceitação escritos
+- [ ] Fora do escopo explícito
+- [ ] Dependências mapeadas
+- [ ] Riscos identificados
+- [ ] Estimativa de esforço
+- [ ] Prioridade definida (RICE/MoSCoW)
+
+---
+
+*MORPH-SPEC by Polymorphism Tech*

package/content/.claude/skills/specialists/standards-architect.md

@@ -0,0 +1,78 @@
+# Standards Architect
+
+Especialista em padrões de código, arquitetura e boas práticas para projetos .NET.
+
+## Responsabilidades
+
+1. **Garantir aderência aos padrões** definidos em `.morph/standards/`
+2. **Validar nomenclatura** de classes, métodos, variáveis
+3. **Revisar código** antes de aprovar merges
+4. **Definir convenções** de projeto
+
+## Triggers
+
+Ativado automaticamente em todo projeto MORPH-SPEC (Core Agent).
+
+Keywords: `standards`, `naming`, `convention`, `pattern`, `review`, `quality`
+
+## Padrões de Código (.NET)
+
+### Nomenclatura
+
+```csharp
+// Classes: PascalCase
+public class OrderService { }
+
+// Interfaces: I + PascalCase
+public interface IOrderService { }
+
+// Métodos: PascalCase
+public async Task<Order> GetOrderAsync(int id) { }
+
+// Variáveis: camelCase
+private readonly ILogger _logger;
+
+// Constantes: UPPER_SNAKE_CASE
+public const string DEFAULT_STATUS = "pending";
+```
+
+### Estrutura de Projeto
+
+```
+src/
+├── {Project}.Domain/          # Entidades, Value Objects
+├── {Project}.Application/     # Services, DTOs, Interfaces
+├── {Project}.Infrastructure/  # EF, External Services
+├── {Project}.Web/             # Blazor, API Controllers
+└── {Project}.Tests/           # Unit, Integration tests
+```
+
+### Padrões Blazor
+
+```razor
+@* Componentes: PascalCase.razor *@
+@* Parameters: [Parameter] obrigatório *@
+@* EventCallbacks: On{Event}Async *@
+
+<OrderList Orders="@_orders" OnSelectAsync="HandleSelectAsync" />
+```
+
+## Documentação de Referência
+
+- [C# Coding Conventions](https://learn.microsoft.com/en-us/dotnet/csharp/fundamentals/coding-style/coding-conventions)
+- [.NET Naming Guidelines](https://learn.microsoft.com/en-us/dotnet/standard/design-guidelines/naming-guidelines)
+- [Blazor Best Practices](https://learn.microsoft.com/en-us/aspnet/core/blazor/performance)
+
+## Checklist de Revisão
+
+- [ ] Nomenclatura segue convenções
+- [ ] Async/await usado corretamente
+- [ ] Nullable reference types habilitado
+- [ ] DI registrado corretamente
+- [ ] Logs estruturados com ILogger
+- [ ] Exceptions tratadas adequadamente
+- [ ] Código sem warnings
+
+---
+
+*MORPH-SPEC by Polymorphism Tech*

package/content/.claude/skills/specialists/ui-ux-designer.md

@@ -0,0 +1,325 @@
+# UI/UX Designer
+
+Especialista em design de interfaces, experiência do usuário e componentes Blazor avançados.
+
+## Responsabilidades
+
+1. **Projetar interfaces** intuitivas e acessíveis
+2. **Criar componentes** Blazor reutilizáveis
+3. **Implementar dashboards** e visualizações
+4. **Garantir responsividade** e acessibilidade
+
+## Triggers
+
+Keywords: `wizard`, `dashboard`, `complex form`, `drag-drop`, `chart`, `ui`, `ux`, `design`, `layout`, `responsive`
+
+## Princípios de Design
+
+### Hierarquia Visual
+
+1. **Títulos**: Grande, bold, alto contraste
+2. **Conteúdo principal**: Tamanho médio, legível
+3. **Informações secundárias**: Menor, cor mais suave
+4. **Ações**: Botões destacados, CTAs claros
+
+### Cores (Sistema)
+
+```css
+/* Tailwind/Bootstrap inspired */
+--primary: #3b82f6;    /* Ações principais */
+--secondary: #6b7280;  /* Ações secundárias */
+--success: #10b981;    /* Sucesso, confirmação */
+--warning: #f59e0b;    /* Alertas */
+--danger: #ef4444;     /* Erros, exclusão */
+--info: #06b6d4;       /* Informativo */
+```
+
+### Espaçamento
+
+```css
+/* Sistema de 4px */
+--space-1: 0.25rem;  /* 4px */
+--space-2: 0.5rem;   /* 8px */
+--space-3: 0.75rem;  /* 12px */
+--space-4: 1rem;     /* 16px */
+--space-6: 1.5rem;   /* 24px */
+--space-8: 2rem;     /* 32px */
+```
+
+## Componentes Comuns
+
+### Card
+
+```razor
+<!-- Components/Card.razor -->
+<div class="bg-white rounded-lg shadow-md p-6 @Class">
+    @if (Title is not null)
+    {
+        <h3 class="text-lg font-semibold text-gray-900 mb-4">@Title</h3>
+    }
+
+    <div class="@BodyClass">
+        @ChildContent
+    </div>
+
+    @if (Footer is not null)
+    {
+        <div class="mt-4 pt-4 border-t border-gray-200">
+            @Footer
+        </div>
+    }
+</div>
+
+@code {
+    [Parameter] public string? Title { get; set; }
+    [Parameter] public RenderFragment? ChildContent { get; set; }
+    [Parameter] public RenderFragment? Footer { get; set; }
+    [Parameter] public string? Class { get; set; }
+    [Parameter] public string? BodyClass { get; set; }
+}
+```
+
+### Stat Card (Dashboard)
+
+```razor
+<!-- Components/StatCard.razor -->
+<div class="bg-white rounded-lg shadow p-6">
+    <div class="flex items-center justify-between">
+        <div>
+            <p class="text-sm font-medium text-gray-600">@Label</p>
+            <p class="text-2xl font-bold text-gray-900">@Value</p>
+            @if (Change is not null)
+            {
+                <p class="text-sm @(IsPositive ? "text-green-600" : "text-red-600")">
+                    @(IsPositive ? "+" : "")@Change
+                </p>
+            }
+        </div>
+        <div class="p-3 bg-@Color-100 rounded-full">
+            <Icon Name="@IconName" Class="w-6 h-6 text-@Color-600" />
+        </div>
+    </div>
+</div>
+
+@code {
+    [Parameter, EditorRequired] public string Label { get; set; } = "";
+    [Parameter, EditorRequired] public string Value { get; set; } = "";
+    [Parameter] public string? Change { get; set; }
+    [Parameter] public bool IsPositive { get; set; }
+    [Parameter] public string Color { get; set; } = "blue";
+    [Parameter] public string IconName { get; set; } = "chart-bar";
+}
+```
+
+### Wizard/Stepper
+
+```razor
+<!-- Components/Wizard.razor -->
+<div class="w-full">
+    <!-- Steps indicator -->
+    <div class="flex items-center justify-between mb-8">
+        @for (int i = 0; i < Steps.Count; i++)
+        {
+            var step = Steps[i];
+            var isCompleted = i < CurrentStep;
+            var isCurrent = i == CurrentStep;
+
+            <div class="flex items-center @(i < Steps.Count - 1 ? "flex-1" : "")">
+                <div class="flex items-center">
+                    <span class="w-10 h-10 rounded-full flex items-center justify-center
+                        @(isCompleted ? "bg-green-500 text-white" :
+                          isCurrent ? "bg-blue-500 text-white" :
+                          "bg-gray-200 text-gray-600")">
+                        @if (isCompleted)
+                        {
+                            <Icon Name="check" Class="w-5 h-5" />
+                        }
+                        else
+                        {
+                            @(i + 1)
+                        }
+                    </span>
+                    <span class="ml-2 text-sm font-medium
+                        @(isCurrent ? "text-blue-600" : "text-gray-500")">
+                        @step.Title
+                    </span>
+                </div>
+
+                @if (i < Steps.Count - 1)
+                {
+                    <div class="flex-1 h-1 mx-4 @(isCompleted ? "bg-green-500" : "bg-gray-200")">
+                    </div>
+                }
+            </div>
+        }
+    </div>
+
+    <!-- Current step content -->
+    <div class="mb-8">
+        @Steps[CurrentStep].Content
+    </div>
+
+    <!-- Navigation -->
+    <div class="flex justify-between">
+        <button @onclick="Previous" disabled="@(CurrentStep == 0)"
+            class="px-4 py-2 text-gray-600 disabled:opacity-50">
+            Voltar
+        </button>
+
+        @if (CurrentStep < Steps.Count - 1)
+        {
+            <button @onclick="Next"
+                class="px-4 py-2 bg-blue-500 text-white rounded hover:bg-blue-600">
+                Próximo
+            </button>
+        }
+        else
+        {
+            <button @onclick="Complete"
+                class="px-4 py-2 bg-green-500 text-white rounded hover:bg-green-600">
+                Concluir
+            </button>
+        }
+    </div>
+</div>
+
+@code {
+    [Parameter] public List<WizardStep> Steps { get; set; } = new();
+    [Parameter] public EventCallback OnComplete { get; set; }
+
+    private int CurrentStep { get; set; }
+
+    private void Next() => CurrentStep++;
+    private void Previous() => CurrentStep--;
+    private async Task Complete() => await OnComplete.InvokeAsync();
+
+    public record WizardStep(string Title, RenderFragment Content);
+}
+```
+
+### Data Table
+
+```razor
+<!-- Components/DataTable.razor -->
+@typeparam TItem
+
+<div class="overflow-x-auto">
+    <table class="min-w-full divide-y divide-gray-200">
+        <thead class="bg-gray-50">
+            <tr>
+                @HeaderTemplate
+            </tr>
+        </thead>
+        <tbody class="bg-white divide-y divide-gray-200">
+            @if (Items is null || !Items.Any())
+            {
+                <tr>
+                    <td colspan="100" class="px-6 py-4 text-center text-gray-500">
+                        @EmptyMessage
+                    </td>
+                </tr>
+            }
+            else
+            {
+                @foreach (var item in Items)
+                {
+                    <tr class="hover:bg-gray-50">
+                        @RowTemplate(item)
+                    </tr>
+                }
+            }
+        </tbody>
+    </table>
+</div>
+
+@code {
+    [Parameter] public IEnumerable<TItem>? Items { get; set; }
+    [Parameter] public RenderFragment? HeaderTemplate { get; set; }
+    [Parameter] public RenderFragment<TItem> RowTemplate { get; set; } = default!;
+    [Parameter] public string EmptyMessage { get; set; } = "Nenhum registro encontrado.";
+}
+```
+
+## Padrões de Layout
+
+### Dashboard Layout
+
+```razor
+<div class="min-h-screen bg-gray-100">
+    <!-- Sidebar -->
+    <aside class="fixed inset-y-0 left-0 w-64 bg-white shadow-lg">
+        <!-- Sidebar content -->
+    </aside>
+
+    <!-- Main content -->
+    <main class="ml-64 p-8">
+        <!-- Header -->
+        <header class="mb-8">
+            <h1 class="text-2xl font-bold text-gray-900">Dashboard</h1>
+        </header>
+
+        <!-- Stats grid -->
+        <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 mb-8">
+            <StatCard Label="Vendas" Value="R$ 12.450" Change="+12%" IsPositive />
+            <!-- More stats -->
+        </div>
+
+        <!-- Content grid -->
+        <div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
+            <Card Title="Pedidos Recentes" Class="lg:col-span-2">
+                <!-- Table -->
+            </Card>
+            <Card Title="Atividade">
+                <!-- Activity feed -->
+            </Card>
+        </div>
+    </main>
+</div>
+```
+
+## Acessibilidade (A11y)
+
+1. **Contraste**: Mínimo 4.5:1 para texto
+2. **Focus visible**: Outline em elementos focáveis
+3. **Labels**: Todo input com label associado
+4. **ARIA**: Roles e labels onde necessário
+5. **Keyboard nav**: Tab order lógico
+
+```razor
+<!-- Exemplo acessível -->
+<label for="email" class="block text-sm font-medium text-gray-700">
+    Email
+</label>
+<input
+    id="email"
+    type="email"
+    aria-describedby="email-hint"
+    class="mt-1 block w-full rounded-md border-gray-300 shadow-sm
+           focus:border-blue-500 focus:ring-blue-500" />
+<p id="email-hint" class="mt-1 text-sm text-gray-500">
+    Usaremos para enviar atualizações.
+</p>
+```
+
+## Documentação de Referência
+
+- [Tailwind CSS](https://tailwindcss.com/docs)
+- [Heroicons](https://heroicons.com/)
+- [Blazor Components](https://learn.microsoft.com/en-us/aspnet/core/blazor/components/)
+- [WCAG Guidelines](https://www.w3.org/WAI/WCAG21/quickref/)
+
+## Checklist de UI
+
+- [ ] Hierarquia visual clara
+- [ ] Cores do sistema de design
+- [ ] Espaçamento consistente (múltiplos de 4px)
+- [ ] Responsivo (mobile-first)
+- [ ] Estados: hover, focus, disabled, error
+- [ ] Loading states (skeleton/spinner)
+- [ ] Empty states informativos
+- [ ] Mensagens de erro claras
+- [ ] Acessibilidade básica (WCAG AA)
+
+---
+
+*MORPH-SPEC by Polymorphism Tech*