Pular para o conteúdo

Versão atual: 0.9.0

Histórico de versões

Não lançado

0.9.0 — 2026-10-19

Adicionado

  • Marca ITpS em produtos, conforme o padrão publicado no Figma (Brand Usage): no header, o símbolo ITpS, um divisor e a marca do produto (classes itps-brand-lockup); no fim do footer, a linha de assinatura ITpS, obrigatória em todo produto do ITpS (classes itps-signature). Nova seção “Marca ITpS em produtos” na página Marca e exemplo na página do Footer.
  • Item itps-brand no registry (React e Vue) com ItpsLogo, ItpsLockup e ItpsSignature, com a arte oficial embutida e versão negativa no modo escuro. O item footer passa a instalar o itps-brand.
  • Logo e símbolo ITpS em /brand/itps/, em cor e negativo, tirados dos arquivos oficiais sem redesenho. O comando de download de marca baixa também esses arquivos.
  • Regras para agentes: todo produto do ITpS leva o símbolo ITpS no header e a linha de assinatura no footer.

Alterado

  • Site do DS: o header mostra o símbolo ITpS ao lado do logo Sinapse, e o footer termina com a linha de assinatura ITpS no lugar do bloco “Uma iniciativa do”.

Corrigido

  • Guia Nuxt 4 e regras para agentes: na Node 22, atualizar o npm para a versão 11 antes do shadcn-vue init -t nuxt. O npm 10, que vem com a Node 22, falha ao instalar o template Nuxt (Cannot read properties of null (reading 'edgesOut')).
  • Prévias das páginas de componente: parágrafos dentro da prévia mantêm a cor do próprio componente. Antes a cor do texto da página passava por cima (por exemplo, na descrição do Footer).

0.8.0 — 2026-10-03

Alterado

  • Button Sinapse em React, React Base e Vue: cantos em pílula (rounded-form), como o .itps-btn do HTML e o token --rounded-form. Antes ele mantinha o rounded-md do shadcn. O tamanho continua o do shadcn.

Adicionado

  • Páginas de componente (e o Markdown delas): seção “Em cada stack”, que diz o que o HTML e o React/Vue recebem, gerada a partir do mapeamento do registry.

0.7.1 — 2026-10-02

Corrigido

  • Guia “Migrar um app existente”, com achados do teste de adoção por IA (rodada 5): o checklist final roda no zsh (padrões entre aspas) e deixa de fora o tema gravado no CSS principal; a instalação inclui o @types/node e o texto cobre projetos com um tsconfig só; a Open Sans inclui o peso 500, usado pelos componentes.

0.7.0 — 2026-10-02

Adicionado

  • Seção Visualização de dados: “Escolher o gráfico” (que gráfico responde a cada pergunta, biblioteca por stack e moldura do gráfico) e “Acessibilidade e números” (contraste, cor, alternativa em texto, teclado e números em pt-BR com Intl). As páginas entram no llms.txt e no llms-full.txt.
  • Guia “Migrar um app existente” (/desenvolver/migrar): leva um app React, Next.js ou Vue com CSS próprio, sem shadcn nem Tailwind, ao Sinapse. Cobre Tailwind e alias, init, troca de cores fixas e variáveis antigas por tokens, Open Sans local, ícones Tabler, pt-BR e um checklist final. O pnpm test:registry ganhou os cenários react-existing e vue-existing, que seguem o guia passo a passo.
  • Regras para agentes: app Vue existente sem shadcn-vue e link para o guia de migração.

Alterado

  • Cabeçalho do site: a seção nova aparece como “Dados” no menu do topo. No desktop, o item “Início” saiu do menu (o logo leva à página inicial) e o menu completo aparece a partir de 1160 px; abaixo disso fica o menu do celular, que mantém o “Início”.

0.6.0 — 2026-10-02

Adicionado

  • Tokens de texto com contraste AA: brand-text, destructive-text e danger-text (#D3242D no tema claro, #FF4C43 no escuro) e success-text. Também brand-hover e brand-hover-foreground para o hover do botão. Todos entram no tema do registry.

Alterado

  • Texto coral sobre superfície clara passa de #EB5E57 (3,35:1) para #D3242D (5,17:1): título do Feature Card, iniciais do Avatar, asterisco de campo obrigatório, mensagem de erro do campo, hover de Paginação, Breadcrumb, Tabs, links de navegação e aba ativa do Side Panel. O coral #EB5E57 continua em bordas, ícones e fundos.
  • Botão primary e outline (HTML, compat shadcn, React e Vue): hover e active em #D3242D com texto branco nos dois temas (5,17:1). Antes, o tema claro tinha texto branco sobre coral (3,35:1).
  • --itps-success-950 passa de #00804D para #007848 no tema claro. Tag success (HTML, React e Vue) e textos de sucesso do Callout e da Classificação de risco usam success-text (4,52:1 sobre a tinta).
  • Descrição do Data Overlay (HTML, React e Vue) em secondary-800 (5,04:1 em vez de 4,08:1).
  • Regras para agentes: texto coral, de erro e de sucesso usa os tokens *-text.

Migração

  • Quem usa text-brand ou text-destructive para texto deve trocar por text-brand-text ou text-destructive-text. bg-brand, border-brand e ícones em text-brand continuam iguais.

0.5.3 — 2026-09-28

Corrigido

  • Data Overlay sem Body (HTML, React e Vue): o bloco do valor atual arredonda os cantos de baixo em vez de ficar reto dentro da borda.
  • Regras para agentes: variant="ghost" para ação discreta, como o Cancelar do Modal; o índice do registry lista o Button como sinapse-button, e a instalação continua @sinapse/button.
  • Página Tokens: grupo “Barra lateral” com os tokens sidebar-*.
  • comecar.md: os arquivos CSS vêm de /css/<versão>/, em vez de mandar copiar da página HTML.
  • Acessibilidade da documentação: exemplo do Select com nome acessível, abas dos exemplos de código com tablist válido, tabelas roláveis de Cores acessíveis pelo teclado e rótulos de status legíveis no tema escuro em Layout.

0.5.2 — 2026-09-28

Corrigido

  • Regra para agentes e guias React e Next.js: o --yes vale só para add e init. O registry add não aceita a opção, e a regra anterior fazia o namespace @sinapse não ser registrado.
  • App React existente sem shadcn: o guia manda rodar init com o base.json na própria pasta (tema, Button, Tabler e namespace de uma vez) e criar o alias @ só com paths, sem o baseUrl que o TypeScript 6 rejeita.
  • Tag default: contorno border para não sumir sobre Card e Data Overlay no tema claro.

0.5.1 — 2026-09-28

Corrigido

  • Tag alert e danger (HTML, React e Vue): o texto usa warning-foreground e destructive-foreground. Antes, o danger tinha texto branco sobre coral (3,35:1), e o alert tinha texto claro sobre amarelo no tema escuro.
  • Data Overlay alert e danger: o número fica na cor do texto; só o ícone de tendência leva a cor da severidade (alert-950 e primary-950). Antes, amarelo e coral sobre o fundo tingido ficavam em 1,5:1 e 2,8:1.
  • Data Overlay: o título quebra em até duas linhas em vez de ser cortado; a página explica como usá-lo numa grade de indicadores (w-full max-w-none).
  • Guias React e Next.js e regras para agentes: sem terminal interativo, os comandos do shadcn precisam de --yes; sem ele, o CLI cancela e o pnpm ainda mostra “Done”.

0.5.0 — 2026-09-27

Adicionado

  • Registry React e Vue: @sinapse/tag, @sinapse/data-overlay e @sinapse/search instalam componentes Sinapse (Tag, DataOverlay, Search) com as variantes do HTML: Tag success, alert, danger, disabled e tamanhos xs a lg; Data Overlay alert e danger com pin; Search em pílula com sm/lg, floating, rótulo em linha e botão “Limpar busca”. Antes esses itens instalavam o Badge, o Card e o Input Group do shadcn só com o tema.
  • llms.txt e a página Componentes indicam, por componente, se o React/Vue recebe um componente Sinapse ou o shadcn com o tema.
  • Regras para agentes: usar Tag, DataOverlay e Search do Sinapse em vez de recriá-los com Badge, Card ou Input Group, e trocar o rótulo “Close” do Dialog e do Sheet do shadcn por “Fechar”.

Alterado

  • r/base.json instala também o Button Sinapse: o projeto novo já sai com o botão do DS, e os add seguintes não precisam sobrescrever nada.
  • llms-full.txt passa a incluir as páginas de Estilos e Fundamentos (cores, tokens com --chart-1..5, ícones, tipografia, layout e marca).
  • Guias React e Next.js: projeto existente instala o Button Sinapse uma vez com --overwrite; pré-requisitos para projetos sem shadcn nem Tailwind; lista dos ajustes do projeto gerado pelo shadcn (fonte Geist, lang, next-themes, lucide-react).

Corrigido

  • Página de Cores: brand (coral) é a ênfase de marca; primary é o azul das ações principais.
  • /comecar: um só caminho para o CSS (src/styles/sinapse/, igual ao llms.txt) e sem “3 arquivos” ao lado do comando que baixa 5.
  • Páginas de componente e de Ícones não citam mais @itps/styles, que não é publicado; apontam para o CSS em /css/<versão>/.

Migração

  • Projetos que já instalaram @sinapse/tag, @sinapse/data-overlay ou @sinapse/search têm o Badge, o Card ou o Input Group do shadcn. Rode o add de novo para receber tag, data-overlay e search em components/ui/; os componentes do shadcn continuam lá e podem ser trocados aos poucos.

0.4.1 — 2026-09-26

Alterado

  • Tooltip (itps-tooltip): o conteúdo visível aceita o mouse e continua aberto enquanto é lido (WCAG 1.4.13). Novo atributo data-dismissed, usado pelo Esc para esconder o tooltip; a página do Tooltip traz o script.
  • Modal, Tooltip e Toast documentam teclado, foco e tempo na tela. O exemplo de confirmação do Modal começa em “Cancelar”.
  • sinapse.min.css compilado com Tailwind 4.3.3 (antes 4.3.1).

Corrigido

  • Páginas de erro (404, 5xx) saem com Cache-Control: no-store. Um arquivo pedido antes de existir não fica mais preso como 404 no cache do Cloudflare depois do deploy.

0.4.0 — 2026-09-25

Adicionado

  • Registry shadcn/shadcn-vue servido pelo próprio site em /r/: theme, base (tema, ícones Tabler e namespace @sinapse), agents e os 27 componentes documentados. Há cópias por style do shadcn (/r/styles/<style>/, Radix e Base UI) e para Vue (/r/vue/). Todo item traz meta.version.
  • CSS versionado para Astro e HTML em /css/<versão>/ e /css/latest/: fontes do @itps/styles e sinapse.min.css, pré-compilado para páginas sem build. As versões lançadas ficam congeladas e continuam disponíveis.
  • Camada para agentes de IA: llms.txt e llms-full.txt gerados a partir do site, versão Markdown (.md) de toda página de documentação, página “Usar com IA” e item @sinapse/agents, que instala SINAPSE.md e uma skill do Claude Code com as regras do DS.
  • Marca oficial do Sinapse: SVGs do logotipo e do símbolo (cor, mono e negativo) em /brand/sinapse/, favicon Sinapse, imagem Open Graph e assinatura ITpS no rodapé.
  • Página “Marca” em Fundamentos (/fundamentos/marca), com as regras das marcas Sinapse e ITpS, os downloads e o manual do Sinapse. As regras de marca também entram no llms.txt e no SINAPSE.md instalado nos projetos.
  • Componente SinapseLogo (item sinapse-logo, React e Vue), que desenha a arte oficial com versão negativa no modo escuro, tamanho mínimo e nome acessível. Para Astro, HTML e arquivos de imagem, comando que baixa os SVGs oficiais.
  • Página 404 com a identidade Sinapse e página de histórico de versões (/changelog, /changelog.md).
  • Ferramentas de release: pnpm release:version <x.y.z> e notas de release restritas à versão da tag.

Alterado

  • A fonte de ícones passa a vir dentro do @itps/styles (fonts/tabler-icons.woff2, referenciada de forma relativa pelo icons.css). Ícones Tabler em todas as stacks.
  • Licença proprietária, só para produtos ITpS (SEE LICENSE IN LICENSE). O texto aguarda revisão jurídica.
  • Nome oficial do produto: Sinapse Design System (forma curta: Sinapse DS), no lugar de Sinapse UI Theme Layer.
  • /desenvolver, /desenvolver/usando-tokens, /desenvolver/com-shadcn e /desenvolver/com-shadcn-vue redirecionam para /comecar.

Removido

  • @itps/cli (packages/cli) e o repositório de teste DevJanderson/sinapse-ui-cli, substituídos pelo registry. O dono do repositório deve arquivá-lo.
  • Blocks e templates legados (/blocks, /templates), que nunca foram consolidados.

Migração

  • React/Next.js: pnpm dlx shadcn@latest registry add "@sinapse=https://dsystem.sinapse.org.br/r/styles/{style}/{name}.json" e depois pnpm dlx shadcn@latest add @sinapse/theme.
  • Vue/Nuxt: pnpm dlx shadcn-vue@latest add https://dsystem.sinapse.org.br/r/vue/theme.json.
  • O bloco /* itps-theme:start */ gravado pela CLI antiga pode ser apagado depois de aplicar o tema do registry.
  • Projetos que copiaram /fonts/tabler-icons.woff2 do site devem copiar packages/styles/fonts/ ao lado do icons.css ou usar /css/<versão>/.
  • Links para /blocks e /templates não têm substituto.

0.3.0

Adicionado

  • Entrada @itps/styles/shadcn.css, para usar o tema de forma compatível com o shadcn.
  • @itps/cli, para inicializar os estilos Sinapse em projetos consumidores.
  • Ajustes de compatibilidade com os componentes Button e Switch gerados pelo shadcn.