24 lines
739 B
Markdown
24 lines
739 B
Markdown
# Skill — Design System
|
|
|
|
Use esta skill quando precisar criar, organizar ou ampliar padrões visuais.
|
|
|
|
## Método
|
|
1. Inventarie tokens existentes.
|
|
2. Inventarie componentes compartilhados.
|
|
3. Identifique duplicações.
|
|
4. Normalize primeiro os padrões mais repetidos.
|
|
5. Preserve API de componentes sempre que possível.
|
|
6. Documente novas variantes e estados.
|
|
|
|
## Tokens semânticos
|
|
Prefira nomes como `surface`, `foreground`, `primary`, `danger`, `border-muted` a nomes puramente visuais como `blue500` quando o projeto já usa semântica.
|
|
|
|
## Estados obrigatórios de componentes interativos
|
|
- default;
|
|
- hover quando aplicável;
|
|
- focus-visible;
|
|
- active;
|
|
- disabled;
|
|
- loading quando aplicável;
|
|
- error/invalid quando aplicável.
|