Files
SIG-CM2.0/.atl/skill-registry.md
dmolinari fa76d0055a feat(web): infra UI completa pre-ADM-001 — DataTable + 8 shadcn + MCP global
shadcn MCP server registrado globalmente (claude mcp add -s user shadcn -- npx -y shadcn@latest mcp). Disponible en cualquier sesion/proyecto.

8 componentes shadcn nuevos via CLI (cd src/web && npx shadcn@latest add ...):
- table, select, popover, pagination, breadcrumb, alert-dialog
- command, dialog (deps de combobox y alert-dialog)
Total instalados ahora: 22

Fix gotcha shadcn CLI: agregado compilerOptions.paths al root tsconfig.json
(sino crea folder literal '@/' en lugar de resolver el alias). Antes solo
estaba en tsconfig.app.json que el CLI no lee.

@tanstack/react-table 8.21 instalado.

Nuevo componente <DataTable> generico (src/web/src/components/ui/data-table.tsx):
- Wrapper sobre TanStack Table
- Priority columns: meta { priority: 'high' | 'medium' | 'low' }
  → hidden md:table-cell / hidden lg:table-cell automatico
- Tap-to-expand row mobile (chevron auto-aparece cuando hay cols hidden,
  click despliega panel con hidden cells como dl/dt/dd)
- Loading state con DataTableSkeleton
- Empty state customizable
- onRowClick callback con stop-propagation correcto en chevron
- 14 tests cubriendo todas las features

Refactor UsersTable a DataTable como dogfood (mismo output visual,
columnas con priority alta/media/baja). 150 tests frontend totales verde.

Doc Obsidian 2.14 v2.4 actualizado con seccion DataTable completa,
componentes ampliados a 22, MCP global, y gotcha del tsconfig.

Engram sig-cm2/design-system actualizado a v2.4.

Skill registry actualizado con compact rules de DataTable y MCP.
2026-04-16 11:54:14 -03:00

5.9 KiB

Skill Registry — sig-cm2

Generated: 2026-04-13

User Skills

Skill Trigger
sdd-init User says "sdd init", "iniciar sdd", "openspec init"
sdd-explore Orchestrator launches exploration of a feature or codebase area
sdd-propose Orchestrator launches proposal for a change
sdd-spec Orchestrator launches spec writing for a change
sdd-design Orchestrator launches technical design for a change
sdd-tasks Orchestrator launches task breakdown for a change
sdd-apply Orchestrator launches implementation of tasks
sdd-verify Orchestrator launches verification of a completed change
sdd-archive Orchestrator launches archival of a completed change
sdd-onboard User wants a guided SDD walkthrough
judgment-day User says "judgment day", "review adversarial", "doble review", "juzgar"
go-testing Writing Go tests, using teatest, Bubbletea TUI testing
skill-creator Creating a new AI agent skill
branch-pr Creating a pull request, preparing changes for review
issue-creation Creating a GitHub issue, bug report, or feature request
skill-registry Update skill registry, "actualizar skills"
obsidian-cli Interact with Obsidian vault via CLI
obsidian-markdown Creating/editing Obsidian Flavored Markdown (.md files in vault)
gitea-workflow Agile workflow for Gitea repos, "run the workflow", "what's next"
find-skills "Find a skill for X", "how do I do X", discover capabilities

Project Conventions

File Role
Obsidian/SPEC.md Source of truth — visión, módulos, tech stack
Obsidian/STATUS.md Estado de UDTs — ÚNICO lugar para marcar tareas [x]
Obsidian/INSTRUCCIONES_IA.md SOP del agente: bucle de ejecución, reglas de lectura
Obsidian/02-ARQUITECTURA-y-TECH-STACK/ UDTs por módulo con CMV (Contexto Mínimo Viable)
Obsidian/04-DOMINIO-y-REGLAS-de-NEGOCIO/ Reglas de negocio — consultar ante dudas

Compact Rules

SIG-CM2 Development Rules

  • Orden de implementación SIEMPRE: BD → Backend → Frontend
  • Rama por UDT: feature/UDT-XXX (o VTA-XXX, TAS-XXX, INT-XXX, ADM-XXX)
  • Commits: tipo(módulo): descripción — feat/fix/docs/refactor/test/chore/security
  • NUNCA leer Obsidian/07-RELEVAMIENTOS/ sin instrucción humana explícita
  • Para dudas de negocio: consultar 04-DOMINIO-y-REGLAS-de-NEGOCIO/ o SPEC.md
  • Antes de cada UDT: leer STATUS.md → leer UDT en carpeta 02 → cargar solo el CMV indicado

Architecture

  • Clean Architecture: SIGCM2.Api / SIGCM2.Application / SIGCM2.Domain / SIGCM2.Infrastructure
  • Backend ORM: Dapper 2.x (NO Entity Framework — decisión arquitectural)
  • Lógica crítica de negocio: Stored Procedures en SQL Server
  • Frontend state: Zustand (global) + TanStack Query (server state)
  • Frontend estructura: src/api, src/components/{ui,features}, src/features/*, src/hooks, src/layouts, src/pages, src/stores, src/utils

Strict TDD Mode (ACTIVE)

  • Tests ANTES del código de producción (Red → Green → Refactor)
  • Backend: xUnit + NSubstitute — comando: dotnet test
  • Frontend: Vitest + React Testing Library — comando: vitest
  • Coverage backend: dotnet test --collect:"XPlat Code Coverage"
  • Coverage frontend: vitest --coverage

Design System (frontend) — v2.3

  • Source of truth: Obsidian/02-ARQUITECTURA-y-TECH-STACK/2.14 🎨 Design System.md. Engram topic_key: sig-cm2/design-system
  • Personality: tech sophisticated (Vercel/Linear/Railway). Glass + gradient mesh + multi-layer shadows + glow blobs corners
  • Brand #008fbe (logo) → escalado OKLCH --brand-50..950. Violet accent oklch(0.62 0.20 280) (--accent-violet-*) para combos tech. Neutral cool slate con shift hue 250-252 (--neutral-50..950)
  • NO usar gray-*/slate-*/blue-* genéricos de Tailwind. Solo brand/neutral/violet/semantic
  • Tokens semánticos: bg-background, text-foreground, bg-primary, bg-card, text-muted-foreground, border-border, ring-ring, bg-input (con border-input-border). NUNCA hardcodear bg-white/text-black/hex inline
  • Density compact: button 32-40px, input 40px (h-10), table row 40px. --radius base 10px (sm/md/lg/xl = 6/8/10/14)
  • Light + Dark con default = system preference (useTheme() hook). Dark NO es pure black (slate-violet). Smoke test ambos antes de mergear
  • Forms: ≤4 campos single col, ≥5 campos grid grid-cols-1 md:grid-cols-2 gap-4
  • Tablas mobile: priority columns + tap-to-expand (NO cards-on-mobile, NO pure horizontal scroll)
  • Utilities CSS (@layer components en index.css): .glass, .gradient-mesh, .grid-bg (usar en root layouts), .surface (tablas), .focus-glow
  • Card variants: default (shadow-md) / elevated / glass / flat
  • Tooltips: usar SIEMPRE <Tooltip> de @/components/ui/tooltip (Radix Portal). NO CSS absolute en sidebars/modals — clipping issue
  • Sidebar: colapsable con useSidebar() hook (persiste en localStorage). Toggle en top header al lado del brand
  • DataTable: usar SIEMPRE <DataTable> de @/components/ui/data-table para tablas. NUNCA HTML <table> crudo. Soporta meta: { priority: 'high'|'medium'|'low' } para responsive + tap-to-expand row mobile automático
  • shadcn MCP: registrado globalmente (user scope). Pedirle a Claude que instale componentes shadcn — lo hace via MCP sin que el dev toque CLI. 22 componentes ya instalados
  • Toasts via sonner (<Toaster richColors closeButton position="top-right" /> ya montado en App.tsx). toast.success() / toast.error()
  • TooltipProvider ya envuelve App con delayDuration={150}
  • Componentes shadcn: instalar via shadcn MCP server o npx shadcn@latest add. NUNCA copy-paste manual del website
  • WCAG AA obligatorio: focus rings visibles (ya forzado en CSS base), contrast ≥ 4.5:1 texto normal, aria-label en botones icon-only
  • Browser autofill fix ya aplicado en @layer base — respeta tokens del DS