Componentes
59. Campos de valor do domínio — monetário, medida e duração
seed-componentes.md v1.43 · §59seção 65 de 9859-campos-de-valor-do-dominio-monetario-medida-e.md · MD5 bc52714aTítulo completo no canon: Campos de valor do domínio — monetário, medida e duração — estável (F7.5 · promovido em 2026-08-17 pelo gate do Rafael — verbatim: "aprovo. siga"; ver a nota de rastreabilidade no §78 do MANIFESTO: o gate foi declarado, e não há registro de quais capturas ele abriu — se não tiver ocorrido neste artefato, corrigir por errata) · VD1–VD16 · bancada banco-dominio.html · fecha C9 e C10 · suite-dominio 28 · 0 · BT7 medido e verde em 2026-08-17
Rodada zero, e o veredito aqui é de um TIPO NOVO. As fases anteriores perguntavam se o arquétipo tinha leitura visual no produto de referência. Para estes componentes a pergunta não se aplica: o ClickUp não tem campo de potência em kWp nem de energia em kWh — estes campos são do domínio SEED, e não existem lá para serem observados. A base correta não é navegação: é canon de entrada numérica + normas + o domínio.
Isto é diferente dos bloqueios do A6 e do A15, que são de ambiente. Aqui não há o que visitar. Registrar a distinção importa: "não tem leitura" pode significar três coisas — não foi visitado, não existe instância, ou não se aplica —, e tratá-las como a mesma coisa é como se chega a "vamos navegar" para um problema que a navegação não resolve.
Base. R1 canon: a régua do USWDS é literal e vira o contrato central — use prefixo ou sufixo quando o campo se refere a uma unidade ou valor monetário, mas a entrada do usuário deve conter apenas dígitos, não a unidade nem o símbolo; e não use prefixo quando o campo é aberto o bastante para admitir resposta que não seja número. R2 stack: o React Aria é explícito sobre por que não usar
<input type="number">— comportamento inconsistente entre navegadores e plataformas, opções de formatação localizada limitadas e stepper difícil de estilizar. E traz o fato que decide a implementação: o navegador só FORMATA, não faz PARSING — oIntl.NumberFormatgera a string, e ler de volta exige parser próprio construído a partir do formatador. R3 normas: rótulo associado (1.3.1), instruções (3.3.2), erro que identifica o problema (3.3.1) e sugere a correção (3.3.3), e validação que não depende só de cor. Sobre o 1.3.5 Identify Input Purpose, a resposta oficial do W3C é a que aplicamos no VD12.
59.1 Os contratos#
| # | Contrato | O que ele descarta, e por quê |
|---|---|---|
| VD1 | O usuário digita SÓ DÍGITOS. A unidade é adorno do campo, não conteúdo digitável | Deixar o usuário escrever "R$ 1.240,00 kWp". Régua literal do USWDS, e ela evita o parser ter de adivinhar o que é unidade e o que é valor |
| VD2 | A posição da unidade é convenção, não estética: moeda é prefixo em pt-BR (R$), unidade de medida é sufixo (kWp, kWh, kVA, V, A) |
Escolher a posição por gosto. A posição vem do idioma e da unidade — há moedas que são sufixo, e trocar isso confunde quem lê rápido |
| VD3 | A unidade é aria-hidden, e o NOME ACESSÍVEL do campo a inclui ("Potência em quilowatt-pico") |
Deixar o leitor de tela ler "erre cifrão". Símbolo é atalho visual; o nome acessível é o que informa |
| VD4 | Formata no blur, guarda o valor CRU. A submissão envia número, nunca a string formatada |
Guardar "1.240,00". O separador é apresentação; o dado é 1240 |
| VD5 | Locale pt-BR declarado: decimal é vírgula, milhar é ponto | Deixar implícito. O mesmo número lido em en-US é mil vezes outro, e um ERP de engenharia não pode ter essa ambiguidade |
| VD6 | inputmode="decimal", nunca <input type="number"> |
O type=number — comportamento inconsistente entre navegadores, formatação localizada limitada e stepper impossível de estilizar. O inputmode traz o teclado numérico no toque sem trazer os defeitos |
| VD7 | Formatar com Intl.NumberFormat; LER de volta com parser próprio derivado do formatador |
Regex artesanal. O navegador só formata — não há API de parsing —, e um regex escrito à mão erra em locale que ele não previu |
| VD8 | Alinhamento à direita e tabular-nums (herda o PN21d) |
Alinhar à esquerda. Coluna de valor só é escaneável quando as casas se alinham |
| VD9 | Lista FECHADA de unidades do domínio SEED, declarada no canônico: R$ · kWp · kWh · kW · kVA · V · A · % |
Unidade livre por texto. Unidade digitável vira "Kwp", "kwp", "KWP" no mesmo banco |
| VD10 | Duração aceita entrada COMPOSTA e normaliza: "3d 4h" → 28h (jornada declarada) | Só horas. Cronograma de obra fala em dias; apontamento fala em horas, e obrigar conversão mental é onde o erro entra |
| VD11 | Erro identifica o problema E sugere a correção, com mecanismo além de cor (SC 3.3.1 e 3.3.3) | "Valor inválido". Não diz o que está errado nem o que fazer |
| VD12 | autocomplete NÃO se aplica a estes campos, e isso é DECLARADO |
Inventar token. A orientação oficial do W3C é literal: se o campo pede informação fora da lista de propósitos, o critério não é aplicável e o campo passa. Inventar autocomplete="kwp" seria a falha F107 — token que não corresponde a propósito reconhecido |
| VD13 | O passo do stepper é da UNIDADE, declarado por campo (R$ 0,01 · kWp 0,01 · h 0,5) | Passo 1 para tudo. Passo errado é pior que passo nenhum: transforma ajuste fino em digitação |
| VD14 | Valor exibido FORA de campo usa a MESMA formatação do campo | Duas formatações no mesmo produto — a tela mostra 1.240,00 e o campo abre 1240.00 |
| VD15 | Conversão entre unidades NÃO é do Design System | Converter kWh↔kWp no componente. Isso é regra de engenharia, com premissa (irradiação, perdas) que o DS não conhece e não pode inventar |
| VD16 | Campo vazio ≠ zero. Vazio é ausência e exibe travessão em leitura (herda o PD6) | Preencher com 0. Potência zero e potência desconhecida são coisas diferentes, e um relatório que soma as duas mente |
59.2 Anatomia#
Potência ← rótulo visível (1.3.1)
┌──────────────────────────────┬─────┐
│ 1.240,00 │ kWp │ ← sufixo, aria-hidden (VD2, VD3)
└──────────────────────────────┴─────┘
Use ponto para milhar e vírgula para decimal. ← instrução (3.3.2)
┌─────┬────────────────────────────────┐
│ R$ │ 486.200,00 │ ← prefixo (VD2)
└─────┴────────────────────────────────┘
O adorno vive dentro da fronteira do campo e o texto digitado não passa por baixo dele —
o contêiner carrega a borda e o estado de foco, e o <input> entra sem borda própria. É o terceiro
dos três caminhos possíveis, e o único que não deixa o texto vazar sob o adorno.
59.3 Erro — os três casos, com a frase#
| Situação | Mensagem |
|---|---|
| Fora da faixa | "A potência precisa ficar entre 0,01 e 9.999,99 kWp. Você digitou 12.000,00." |
| Formato irreconhecível | "Não consegui ler esse valor. Use vírgula para o decimal — por exemplo, 1.240,50." |
| Obrigatório vazio | "Informe a potência em kWp. Se ainda não souber, deixe a obra sem potência em vez de preencher com zero." |
As três dizem o que houve E o que fazer (SC 3.3.1 + 3.3.3). A terceira carrega o VD16: ela existe para impedir que "não sei" vire zero.
59.4 Números MEDIDOS na produção da bancada#
| Medida | Valor |
|---|---|
| Altura do campo (com e sem adorno) | 40px, igual nos dois |
| Alvo do stepper | 44px de largura |
| Recuo do texto contra o adorno | 8px de cada lado |
| Casas decimais por família | monetário 2 · potência 2 · energia 0 · duração 1 |
| Passos declarados | R$ 100,00 · kWp 0,01 · kWh 10 · duração 0,5h |
| Jornada do VD10 no gabarito | 8h (parâmetro do produto, VD-P2) |
| Pares de cor medidos (F7.3 + F7.4 + F7.5) | 76 pares × 2 temas = 152 · 0 |
Um achado real na medição, e ele quase virou conveniência. O separador entre o adorno e o campo
nasceu com border-subtle e mediu 1,11 — reprova o SC 1.4.11. A saída fácil seria declará-lo
decorativo, como se fez com o separador entre campos no §56. Aqui não cabia, e a razão é medida:
a diferença entre as duas superfícies (surface-subtle do adorno e surface-raised do campo) é de
apenas 1,08 — a superfície não separa nada. A linha é o único sinal de que ali termina o
adorno e começa o campo, e sinal único não pode medir 1,11. Trocado por border-interactive.
Quarto achado seguido da mesma família. O padrão está firme:
border-defaulteborder-subtlesão fronteiras de LEITURA; onde a fronteira precisa ser VISTA, o token éborder-interactive. E a régua para decidir se cabe declarar decorativo agora tem um teste: meça se existe OUTRO sinal. Se a superfície separa, a linha é reforço; se não separa, a linha é o sinal, e sinal se mede.
59.5 Validação#
| Camada | Placar |
|---|---|
suite-dominio.mjs — blocos ANA · TEC · FMT · DUR · ERR · PAS · LEI · UNI · VIV |
28 · 0 |
contraste-f73.py — 76 pares × 2 temas |
152 · 0 |
| Console e erros de página | limpo |
A guarda que vale mais é o bloco
FMT, e em particular aFMT-02. Ela prova o VD5 com o caso que separa um ERP correto de um ERP perigoso: em pt-BR o ponto é separador de MILHAR. Digitar1240.5não significa mil duzentos e quarenta e meio — significa doze mil quatrocentos e cinco, e a guarda verifica que o parser lê assim e reprova pelo teto. Um parser que "adivinha" trocaria o valor de um contrato por mil vezes ele mesmo.Uma calibração de instrumento, declarada: a primeira execução acusou dois falsos porque os blocos
ERRePASliam o estado deixado pelos blocos anteriores. A suíte passou a recarregar a página entre blocos — guarda que depende da ordem de execução das outras não é guarda, é sequência.
59.5 Pendências#
| # | Pendência | Por que fica aberta |
|---|---|---|
| VD-P1 | FECHADA em 2026-08-16: banco-dominio.html produzido com gerador, molde e suíte própria (28 · 0) |
|
| VD-P4 | Máscara durante a digitação não implementada — a formatação acontece no blur |
Formatar enquanto se digita conflita com métodos de entrada compostos, e o canon alerta para isso. Reabre se o gate pedir |
| VD-P2 | Jornada de trabalho do VD10 não é decidida aqui | "1 dia" são 8h, 8h48 ou 24h conforme o regime, e isso é parâmetro do produto, não do DS. O componente recebe a jornada; não a define |
| VD-P3 | C1–C8 e C11–C15 (intervalo de datas, data+hora, multi-select com chips, seletor de pessoa, de entidade, de ícone, editor rico, menção, prioridade, toggle group, senha, OTP, edição inline) | Restante da F7.5. Vários têm leitura visual na §13 e no estudo — a rodada zero de cada um decide se navega ou não |
Também cita o §59: banco-data, banco-edicao-linha.