Cuatro claves nuevas (22 → 26), un literal firmado, un préstamo adjudicado y
trece tokens PREEXISTENTES medidos uno a uno: el componente nunca había pasado
por R-5.4. Diff de computed 0 sobre 2.336 valores en 8 estados.
LAS CUATRO CLAVES
color-field IS-A Field y no realiasa nada suyo, así que lo que faltaba era
pequeño y concreto:
- separator-bg + separator-thickness — los separadores de canal («,», « / ») se
pintan como líneas verticales de un pelo, y ni su tinta (--color-border-default)
ni su grosor (1px) eran alcanzables. El 1px ES --border-width: es un filete, y
dropdown-menu.separator-thickness lee la misma familia. El MISMO nodo
renderizado como glifo («#», «%») ya tenía su literal-fg — una parte, dos
tratamientos, ahora los dos con mando.
- segment-min-width (3ch) + hex-segment-min-width (6ch) — el ancho fijo por
número de caracteres, el que impide el reflujo al teclear (99 → 100). Los
gemelos date-field y time-field cargan el mismo hecho DENTRO de un
calc(2ch + 2 * var(--…-segment-padding-inline)), así que el suyo ya viajaba con
un token; aquí iba a pelo. Precedentes de `ch` en el catálogo:
editable.area-min-inline-size (12ch) y tags-input.input-min-inline-size (8ch).
EL 7 % QUE QUEDA ES UNA FILA, Y ES DOCTRINA
El chip lee var(--field-control-radius) porque IGUALA el radio del control —el
comentario del CSS lo dice: «so the chip tracks the control»—. Qué DECIDE ese
token: el radio del control de campo. Un swatch-radius propio daría un segundo
mando para una decisión ajena y permitiría desincronizar el chip del campo que
lo contiene. Préstamo con dueño: se tema en la ficha de field — misma lectura
que el --slider-disabled-opacity de waveform, hoy mismo.
TRECE ADJUDICACIONES, TODAS PROBADAS SOBRE NODOS REALES
La demo arranca con valor, en md, editable y con tres formatos: cada estado y
cada paso de talla que no monta no tiene nodo que pintar. Seis de estado
(placeholder, invalid, los tres de readonly, disabled), cuatro de la escala del
chip (14→77, 16→77, 20→77, 32→77 px), la etiqueta del formato BLOQUEADO —que
sólo existe con un único formato permitido, medida desmarcando rgb y hsl CON LOS
CHIPS DE LA PROPIA DEMO, no fabricando el nodo— y las dos de transición.
LAS DOS DE TRANSICIÓN, DOS DIAGNÓSTICOS FALSOS Y EL SEGUNDO ES NUEVO
El primero es la ley ya escrita: el guard congela `transition` para hacer
medible todo lo demás, así que los tokens que SON la transición no se mueven
bajo él. El segundo fue mío: midiéndolas a mano leí 0s y sospeché del
@media (prefers-reduced-motion: reduce) del final del fichero — lo comprobé
corriendo con reducedMotion: 'no-preference' y SEGUÍA dando 0s, porque el nodo
que había cogido (querySelector('[data-color-field-segment]')) es el PRIMER
segmento, que es un `literal` y declara transition: none de su propia cosecha.
Sobre un segmento editable: 0.12s → 11.5s y cubic-bezier(0.4,0,0.2,1) →
steps(7). Mide el nodo que PINTA, no el primero que casa el selector.
VERIFICACIÓN
Sonda antes/después 0 diffs (2.336 valores · 8 estados · 10 nodos) · R-5.4 13/26
con las trece restantes adjudicadas y medidas, cero STALE · component:audit PASS
· censo 93 % · eidos-lint 14 morfo-backed / 14 eidos-only / 0 invalid / 0
class-hooks · rtl:check 0 · docs:check 0 · suite eidos 439/440 (el rojo es
skin-media-player, el conocido) · Chrome: los dos glifos con tinta y sin fondo,
el divisor a 1px con el fondo del borde, hex 64.4px (6ch), chip 18px.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
## 2. Sistema transversal (0) — informativo, fuera del ratio
Un tema los alcanza **a nivel de sistema**, por diseño (recipe-contract §2).
@ -61,7 +56,7 @@ _Ninguno._
- **Consume tokens públicos de `field`.** Un token prestado importa la semántica de su dueño: la corrección no es duplicarlo con prefijo propio, sino la decisión de familia que la auditoría de fase 1 dejó registrada (`theming-audit.md` §B, familia calendar).
- **Tiene eje `size`**: los tokens dimensionales van por talla (`{part}-{eje}-{k}`) apuntando al bundle `--size-{k}-*`, nunca al primitivo crudo (theming §5; el guard `recipe-css-contract` prohíbe el primitivo).
### 4.1 Tokens a declarar en `lib/recipes/base.ts` (4)
### 4.1 Tokens a declarar en `lib/recipes/base.ts` (2)
Valor **verbatim** del CSS de hoy: el default no se mueve, sólo cambia quién
puede moverlo. Nombres derivados de recipe-contract §1 (ejes lógicos, talla
@ -71,8 +66,6 @@ no distingue lo que debería — se marca `⚠`.
