# Ficha — Chip (seed-componentes.md §22, v2.00)

> Gerada por `06-validacao/geradores/gen-vitrine.py` a partir do canon. Esta é a ficha INTEIRA: todas as linhas, com o texto completo de cada célula (a página mostra uma versão de uma tela, encurtada). Onde a seção não tem o item em subseção própria, a ficha diz "ver a seção" e não inventa. Seção completa: https://ds.seed.eng.br/canon/seed-componentes/22-chip-estavel-validado-pelo-rafael-em-2026-08-04/ · fatia em Markdown: https://ds.seed.eng.br/10-publicacao/ia/seed-componentes/22-chip-estavel-validado-pelo-rafael-em-2026-08-04.md

## Anatomia e partes

Altura 28px (denso) / 32px (confortável), radius 999, borda 1px em cinza-600 (token de componente `chip-border`; par light 4.74 e dark 3.60, ambos ≥3:1 — o `border-default` cinza-300 REPROVOU com 1.91 na medição e foi descartado: a borda é o sinal de interatividade do W2, não decoração), texto `--seed-text-primary`, fundo `--seed-surface-page`; hover: fundo `--seed-surface-subtle`; selecionado (filtro): fundo `--seed-action-primary`, texto `--seed-text-on-action-primary`, checkmark 14px; X: ícone 14px em botão de 24×24 com hitbox touch estendida; focus ring padrão. Grupo: flex com wrap (reflow W7), gap 8px, rótulo visível ou aria-label.

No canon: [§22.2 Anatomia e tokens](https://ds.seed.eng.br/canon/seed-componentes/22-chip-estavel-validado-pelo-rafael-em-2026-08-04/#sec-22-2-anatomia-e-tokens)

## Propriedades e variantes

A seção não traz este item em subseção própria — ver a seção §22 (https://ds.seed.eng.br/canon/seed-componentes/22-chip-estavel-validado-pelo-rafael-em-2026-08-04/).

## Estados

A seção não traz este item em subseção própria — ver a seção §22 (https://ds.seed.eng.br/canon/seed-componentes/22-chip-estavel-validado-pelo-rafael-em-2026-08-04/). A regra geral dos estados de todo componente interativo é a do §0, item 2 (https://ds.seed.eng.br/canon/seed-componentes/00-fundamentos-de-componente-valem-para-todos-os/).

## Acessibilidade

A seção não traz este item em subseção própria — ver a seção §22 (https://ds.seed.eng.br/canon/seed-componentes/22-chip-estavel-validado-pelo-rafael-em-2026-08-04/).

## Faça · não faça

As decisões do canon (faça) e a alternativa que cada uma descartou (não faça) — todas as 10, na ordem do canon.

| faça (decisão) | não faça (descartado) |
|---|---|
| W1 — 3 tipos SEED: filtro (selecionável, alternativa a grupo de checkbox/switch), entrada (dismissível, valor inserido pelo usuário — o multi-select do combobox §11 consumirá este) e ação contextual (raro; ação primária/recorrente = botão §1). "Suggestion" do M3 DESCARTADO (predição/chat sem caso no SIGA; o tipo ação cobre se surgir) | Os 4 tipos do M3 |
| W2 — Interatividade VISÍVEL: chip tem borda + cursor + hover/pressed que o badge NUNCA tem | Chip com cara de badge |
| W3 — Filtro selecionado = checkmark visível + mudança de cor — nunca só cor | Seleção só por preenchimento |
| W4 — Remoção: X com `aria-label="Remover {valor}"`; alvo do X ≥24×24 (WCAG 2.5.8) no desktop denso; em superfície touch, hitbox estendida ≥44px INVISÍVEL (pseudo-elemento) — visual compacto, alvo generoso | X 16px sem hitbox; chip de 44px de altura (mata a densidade) |
| W5 — Teclado = padrão GRID (React Aria): grupo ROTULADO; setas navegam (roving tabindex); Delete/Backspace remove o focado; após remover, foco → chip SEGUINTE (anterior se era o último; grupo/campo se esvaziou); live region ÚNICA do grupo anuncia ("Filtro Coelba removido") — regime discreto 1.13-b | Cada chip como tab-stop (Tab-maratona); foco morto pós-remoção |
| W6 — Touch: X SEMPRE visível — divergência declarada do M3 (que dispensa o X quando remover é a única ação, via tecla Delete — pressupõe teclado físico; no toque não existe Delete: sem X, sem caminho) | M3 literal (beco sem saída no touch) |
| W7 — Overflow: default reflow (todos visíveis, empurrando conteúdo — filtro ativo nunca se esconde); variante densa "+N" abre a lista em popover — ESBOÇADA, spec final espera o §popover (sub-bloco D; ponta declarada) | Rolagem horizontal de chips (esconde filtros ativos — mortal em ERP) |
| W8 — Proibições: chip nunca é LINK para outra página; nunca multifunção (máx.: corpo selecionável + X = 2 focusables); nunca aninhar controles dentro | Chip-canivete |
| W9 (QD-P18, 2026-10-10) — A COR do chip de STATUS é um campo editável por quem tem permissão de criar ou editar status (a permissão é do produto; o DS dá a forma), escolhida numa paleta FECHADA do DS (onze cores, §22.4.3), sem campo de hex livre. Cada status do conjunto padrão nasce com a sugestão do DS já marcada (§22.4.2). Só entra cor cujo chip passa 4,5 no texto nos dois temas. Veredito dele, verbatim (folha 3, G2, 2026-10-10 14:45:58Z): "a cor dos status quero que deixe a pessoa que tiver acesso a editar ou criar status, possa escolher a cor que quiser, dentro da nossa paleta de cores no DS. ja pode vir com as sugestoes, mas deve ser um campo editavel." | Cor fixa por estado; campo de hex livre (fora da paleta e sem garantia de contraste); só as cinco cores semânticas (4 dos 5 já são os padrões, sobra 1 escolha) |
| W10 (H3 = a, folha 4, 2026-10-11) — Cada TIPO de registro tem o SEU conjunto de status (obras e ordens de serviço: um; notas fiscais: outro; propostas: outro), e todos têm a cor editável da W9 — o mesmo controle, a mesma paleta fechada de onze cores, a sugestão inicial marcada. Quem muda entre os tipos é o vocabulário (os nomes dos status), não a regra da cor. O conjunto de obras e OS é Pendente · Em andamento · Ganho · Perdido (§22.4.2); notas fiscais (`tela-lista`) seguem Em aberto · Paga · Vencida · Em negociação, e propostas (`tela-referencia`) seguem Em análise · Enviada · Aprovada — esses dois vocabulários continuam próprios e só passam a seguir a regra da cor. A tela onde se edita é Configurações → Status (§86.4). | Um único conjunto para todos os tipos (as notas fiscais não têm "Ganho"; as propostas não têm "Vencida"); cor fixa por tipo |

No canon: [§22.1 Decisões W1–W8](https://ds.seed.eng.br/canon/seed-componentes/22-chip-estavel-validado-pelo-rafael-em-2026-08-04/#sec-22-1-decisoes-w1-w8)

## Relacionados

Todas as seções do componentes citadas no texto desta seção (5), da mais citada para a menos:

- §9 [Radio](https://ds.seed.eng.br/canon/seed-componentes/09-radio-estavel-validado-pelo-rafael-em-2026-08/) — 2×
- §86 [TELA A18 — CONFIGURAÇÕES / PREFERÊNCIAS](https://ds.seed.eng.br/canon/seed-componentes/86-tela-a18-configuracoes-preferencias-estavel/) — 2×
- §1 [Botão](https://ds.seed.eng.br/canon/seed-componentes/01-botao-estavel/) — 1×
- §11 [Combobox](https://ds.seed.eng.br/canon/seed-componentes/11-combobox-estavel-validado-pelo-rafael-em-2026/) — 1×
- §73 [HV-P5 FECHADA — a tinta de marca não sobrevive a NENHUMA superfície de interação, e isso é um número](https://ds.seed.eng.br/canon/seed-componentes/73-hv-p5-fechada-a-tinta-de-marca-nao-sobrevive-a/) — 1×