# Contrato · Tag

> Segue o modelo de `contratos/ruler.md`. Implementado em
> `app/src/componentes/Tag/Tag.tsx`, com CSS em `estilo/02-shell.css`
> (`.chip`). Sem contrato original — não é um dos 7 da Fase 1.

> **Não é um dos 7 da Fase 1.** Tem página própria em `/componentes/tag`
> desde 27/ago/2026, além da vitrine.

**Correção de um mapeamento errado do CHANGELOG v0.16.0.** Naquela entrega,
o texto "Moema · 2 lotes · 3.180 m²" de um print do usuário foi mapeado
como `.chip`. Está errado: é `.met` (linha de metadado com separador
`.ponto`), texto solto, não um componente. `Tag` é o `.chip` de verdade —
"Segmento **MCMV e econômico** ✎", usado na barra de premissa.

**Não é uma etiqueta estática.** É um botão que abre a edição de uma
premissa — sempre clicável, sempre com o ícone de lápis.

## Props

**Nome em inglês desde 31/ago/2026** (era `rotulo`/`valor`/`corrigido`) — troca
de convenção de nomenclatura de engenharia.

| Prop | Tipo | Observação |
|---|---|---|
| `label` | `ReactNode` | ex. "Segmento" |
| `value` | `ReactNode` | ex. "MCMV e econômico", renderizado em `<b>` |
| `corrected` | `boolean` | `.chip.corrigido` — fundo transparente, borda em vez de preenchido |

Sem prop `icon`: o lápis (`data-ic="pencil"`) é sempre renderizado — nenhum
`.chip` do protótipo aparece sem ele, então uma prop pra escolher outro
ícone seria configuração sem caso de uso real por trás.

## Achado construindo, não estava previsto

- **Sem estado desabilitado no CSS original.** Adicionado
  `.chip[disabled]{opacity:.45;pointer-events:none}`, mesma convenção já
  usada nesta sessão.

## Acessibilidade

- `<button type="button">` — nome acessível vem do texto visível
  (`label` + `value`), nunca de `aria-label` solto.
- O ícone de lápis é decorativo (`aria-hidden`).

## Pendências deste componente

Nenhuma aberta.

*Resolvido: "sem página de documentação própria" — ver nota no topo do
contrato. Achado desatualizado na auditoria de 21/set/2026.*