toolkit-agent-skills

Container Pattern — arquitetura frontend React em 5 camadas (Types → Infra → Pages → Routes → Components). Define regras de dependência entre camadas, organização de pastas e fluxo de dados. Use ao criar novos features, refatorar componentes, decidir onde posicionar lógica (hook vs container vs presentational), revisar PRs de frontend ou planejar nova feature React/TypeScript. Trigger examples: "onde colocar este hook", "criar nova feature", "refatorar componente", "estruturar página", "container pattern". Do NOT use para projetos que não sejam React/TypeScript no padrão Container.

Manages shadcn components and projects — adding, searching, fixing, debugging, styling, and composing UI. Provides project context, component docs, and usage examples. Applies when working with shadcn/ui, component registries, presets, --preset codes, or any project with a components.json file. Also triggers for "shadcn init", "create an app with --preset", or "switch to --preset".

Extract clean markdown content from web pages using Defuddle CLI, removing clutter and navigation to save tokens. Use instead of WebFetch when the user provides a URL to read or analyze, for online documentation, articles, blog posts, or any standard web page. Do NOT use for URLs ending in .md — those are already markdown, use WebFetch directly.

Create and edit JSON Canvas files (.canvas) with nodes, edges, groups, and connections. Use when working with .canvas files, creating visual canvases, mind maps, flowcharts, or when the user mentions Canvas files in Obsidian.

Create and edit Obsidian Bases (.base files) with views, filters, formulas, and summaries. Use when working with .base files, creating database-like views of notes, or when the user mentions Bases, table views, card views, filters, or formulas in Obsidian.