Começar
Adotar num produto
Cada produto copia uma versão marcada da biblioteca e da marca para o seu repositório e adota pelo processo de lá.
O que o produto recebe
| Arquivo | Para quê |
|---|---|
dist/hibex.min.css | tokens, base e componentes |
dist/hibex.js | opcional: abertura declarativa de diálogos |
dist/fonts/ | Plex Serif e Questrial em woff2, com as licenças |
dist/icons/sprite.svg | os ícones da tabela de papéis |
dist/REGRAS.md | as regras de design e marca, resumidas, na versão copiada — para pessoas e para o agente de IA do produto |
marca/hibex/, marca/systems/<família>/ | logotipo, símbolo e o logo, favicon e ícones de aplicativo do sistema |
Copiar uma versão
No repositório do produto, um script de cópia busca só a versão marcada (design-system-vX.Y.Z) e a família de cor do sistema, e grava tudo numa pasta que é commitada lá e nunca editada à mão. O script completo está no guia de adoção do repositório do design system.
eng/atualizar-design-system.sh v0.1.1 ocean # versão e família do sistemaConviver com o Bootstrap
@layer bootstrap, hibex;
@import url("/vendor/bootstrap/bootstrap.min.css") layer(bootstrap);
@import url("/vendor/hibex/hibex.min.css");As classes não colidem (hx-button × btn), então uma tela migra componente a componente.
Ordem sugerida
- Fundação: folha, fontes, favicon da família, sem negrito sintético;
- Estados e mensagens: o mapa único estado → papel;
- Formulários e ações, com o diálogo de confirmação;
- Dados: tabelas, formatos, gráficos;
- A navegação de três cantos;
- As landings.
Para o agente de IA do produto
O CLAUDE.md do produto aponta para vendor/hibex/REGRAS.md e proíbe editar a cópia. Necessidade nova vira pedido ao design system, não exceção local — o design system está acima do produto (ADR-0013).
Origem: docs/guias/adocao.md · ADR-0013, ADR-0032 · desde a versão 0.1.0