docs(theming): la auditoría de alcance de tema, componente a componente, con su propuesta
El censo medía el eje y no lo explicaba: 5.205 knobs en dos tablas del plan no
dicen QUÉ knob de QUÉ línea no alcanza un tema, ni qué token habría que crear.
Ahora `theming-census.ts --report` escribe la auditoría entera bajo
`docs/audit/theming/`: un README con la vista de conjunto y 170 fichas — 162
recetas con CSS + 8 componentes sin receta, el árbol completo de
`eidos/components/`.
Cada ficha de receta: knobs fuera de alcance con fichero:línea Y selector
(agrupados por clase), sistema transversal aparte, los privados con la columna
que decide («¿deriva de un público?»), y una PROPUESTA de corrección — el token
a declarar en `base.ts` con su valor VERBATIM y su scope TSC. La propuesta
deriva los nombres de recipe-contract §1 y theming §6.7; donde la doctrina no
decide, marca `⚠ decisión` en vez de inventar. Y no propone acuñar lo que la
doctrina prohíbe: lo que posee una capa compartida, el foco, la capa de estado,
un token prestado de otra receta, un shorthand o un eje físico.
Las 8 fichas sin receta dicen —medido, no supuesto— dónde vive su visual: el
componente que componen (icon-button → button), la capa que consumen (affix →
viewport-placement) o la receta ajena que pinta sus attrs (svg → badge/button).
Defectos del instrumento corregidos en el mismo pase, todos encontrados
mirando la salida: un `@import` pegado al primer selector se comía 2 knobs de
color-picker (el suelo del censo no puede moverse); `:not(:disabled)` se leía
como estado y producía `hover-disabled-*`; un knob que lee un privado se
proponía a sí mismo en vez de resolverse por talla; `--icon-size-sm` se
reportaba como préstamo del componente `icon` (ahora el préstamo se verifica
contra las claves del dueño en `base.ts`); y el default de talla salía sin
nombrar en vez de `-md`.
Verificación: censo global idéntico al suelo publicado (5205 · 1621/33% · 856 ·
1880 · 614 · 234) y COMPONENTE A COMPONENTE contra la tabla §9 del plan — 0
diferencias en 162 · regenerar dos veces da el árbol idéntico · el bloque de
veredicto escrito a mano sobrevive · docs:check 0 errores sobre 813 docs ·
prettier limpio (el árbol generado entra en .prettierignore junto a
eidos/generated).
Las 10 primeras fichas llevan ya su veredicto de revisión: análisis correcto en
las 10, propuesta apta en 2 (gradient-builder como piloto, combobox con cinco
correcciones — dos de ellas evitaban romper el default), y 5 que no se
tokenizan en solitario porque son alias de --calendar-*/--field-* y esperan la
decisión de familia. Cuatro destaparon privados con prefijo ajeno o abreviado
declarados en su propio CSS.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
2 months ago
|
|
|
|
# Auditoría de alcance de tema — el catálogo entero
|
|
|
|
|
|
|
|
|
|
|
|
> **Generado**, no escrito a mano: `node --import tsx/esm scripts/theming-census.ts --report`.
|
|
|
|
|
|
> Este README es la vista de conjunto; **una ficha por componente** al lado, con
|
|
|
|
|
|
> su análisis y su **propuesta de corrección**. Método, clases, protocolo de
|
|
|
|
|
|
> verificación y fases: [`PLAN-theming.md`](../../process/PLAN-theming.md).
|
|
|
|
|
|
> La auditoría del SISTEMA de theming (fase 1, cerrada 2026-07-07) es
|
|
|
|
|
|
> [`theming-audit.md`](../theming-audit.md); ésta es la deuda de adopción que
|
|
|
|
|
|
> aquélla dejó apuntada en su §5.3-3.
|
|
|
|
|
|
|
|
|
|
|
|
- **Medido**: 2026-08-19 · **162 recetas** con CSS + **8 componentes sin receta** = 170 fichas, el árbol entero de `eidos/components/`
|
|
|
|
|
|
- **La pregunta**: ¿cuánto de la apariencia de cada componente puede cambiar un tema **sin tocar el sistema ni la receta**?
|
|
|
|
|
|
- **Alcance global**: **33%** — 1621 de 4971 knobs pasan por un token público del componente
|
|
|
|
|
|
- **Reparto**: público 1621 · privado 856 · global 1880 · literal 614 · sistema transversal 234 _(fuera del ratio)_
|
|
|
|
|
|
- **Sin token público propio**: 62 · **alcance < 20 %**: 59 · **alcance 100 %**: 6 · **con eje `size`**: 82
|
|
|
|
|
|
|
|
|
|
|
|
## Cómo se lee
|
|
|
|
|
|
|
|
|
|
|
|
| clase | qué es | ¿lo alcanza un tema del componente? |
|
|
|
|
|
|
| --- | --- | --- |
|
|
|
|
|
|
| `public` | `var(--{c}-…)`, el contrato del componente | **sí** |
|
|
|
|
|
|
| `private` | `var(--_{c}-…)`, nombre interno | sólo si el privado deriva de un público (cada ficha lo dice en §3) |
|
|
|
|
|
|
| `global` | primitivo del sistema (`--space-*`, `--radius-*`, `--color-*`, bundle `--size-{k}-*`…) | sólo moviendo el sistema entero |
|
|
|
|
|
|
| `literal` | ni token: `8px`, `1.25`, `#fff` | no — y viola R-2/R-4 |
|
|
|
|
|
|
| `system` | sistemas transversales que la receta CONSUME por contrato (capa de estado, anillo de foco, planos de depth, motion, bandas z, opacidad, shape, floating-gap) | sí, **a nivel de sistema**, por diseño (recipe-contract §2) — fuera del ratio |
|
|
|
|
|
|
|
|
|
|
|
|
**Alcance** = `public / (public + private + global + literal)`.
|
|
|
|
|
|
|
|
|
|
|
|
**Límites de la medida** (regex sobre el CSS; sobre-reporta, nunca infra-reporta):
|
|
|
|
|
|
una declaración con varios tokens se clasifica por la primera clase que casa
|
|
|
|
|
|
(público → privado → sistema → global); el token público de OTRO componente
|
|
|
|
|
|
cuenta como `global` y la ficha lo marca «⤴ prestado»; los valores dentro de
|
|
|
|
|
|
`@keyframes` cuentan como cualquier otro. Tres defectos que ningún regex ve —
|
|
|
|
|
|
privado que no deriva, velo en el nodo equivocado, doble animación — van en la
|
|
|
|
|
|
checklist §4.4 de cada ficha.
|
|
|
|
|
|
|
|
|
|
|
|
## Qué NO propone una ficha
|
|
|
|
|
|
|
|
|
|
|
|
La propuesta deriva nombres de la doctrina; **no la contradice**. Por eso una
|
|
|
|
|
|
ficha nunca propone acuñar un token para:
|
|
|
|
|
|
|
|
|
|
|
|
- **lo que posee una capa compartida** (`list-surface`, `spin-field`,
|
|
|
|
|
|
`picker-shell`, `viewport-placement`, `field-segment-state`,
|
|
|
|
|
|
`menu-indicator`, `sliding-indicator`): un eje = un token público de la capa
|
|
|
|
|
|
+ una ranura privada, consumido `var(--_x, var(--x))` — el consumidor no acuña
|
|
|
|
|
|
`--{c}-{eje}` (README de `eidos/components`, «Capas compartidas» regla 2);
|
|
|
|
|
|
- **el foco** (`--focus-ring-*`, theming §32) ni **la capa de estado**
|
|
|
|
|
|
(`--state-*`, §38): un knob del sistema, no del componente;
|
|
|
|
|
|
- **un token prestado de otro componente** (la familia `calendar` en los
|
|
|
|
|
|
pickers): la corrección es la decisión de familia registrada en
|
|
|
|
|
|
[`theming-audit.md`](../theming-audit.md) §B, no un duplicado con prefijo propio;
|
|
|
|
|
|
- **un shorthand o un eje físico** (`padding`, `border`, `height`): primero se
|
|
|
|
|
|
parte en ejes lógicos (recipe-contract §1, R-4.4), y eso es decisión.
|
|
|
|
|
|
|
|
|
|
|
|
## Sin receta CSS (8)
|
|
|
|
|
|
|
|
|
|
|
|
Ni un `.css` en su directorio: **no hay knob que medir**, y eso es una
|
|
|
|
|
|
respuesta, no un hueco. Cada ficha dice —medido, no supuesto— dónde vive su
|
|
|
|
|
|
visual: el componente que compone, la capa compartida que consume, o la receta
|
|
|
|
|
|
ajena que pinta sus attrs (y cuyos knobs ya están contados allí).
|
|
|
|
|
|
|
|
|
|
|
|
[`affix`](./affix.md) · [`count-up`](./count-up.md) · [`format-date`](./format-date.md) · [`format-number`](./format-number.md) · [`icon-button`](./icon-button.md) · [`relative-time`](./relative-time.md) · [`svg`](./svg.md) · [`trans`](./trans.md)
|
|
|
|
|
|
|
|
|
|
|
|
Y el **vocabulario de nombres tiene una desviación medida**: el catálogo habla
|
|
|
|
|
|
mayoritariamente con el modificador al final (`-bg-hover`, `-bg-active`) mientras
|
|
|
|
|
|
theming §6.7 lo pone delante (`hover-bg`). Las fichas proponen la forma
|
|
|
|
|
|
**documentada** y lo dejan anotado: la normalización es **D-TH.6**, sin firmar.
|
|
|
|
|
|
|
|
|
|
|
|
## Los 20 con más knobs fuera del contrato
|
|
|
|
|
|
|
|
|
|
|
|
| # | componente | fuera de alcance | alcance | knobs | contrato |
|
|
|
|
|
|
| ---: | --- | ---: | ---: | ---: | ---: |
|
|
|
|
|
|
| 1 | [palabras](./palabras.md) | 363 | 22% | 471 | 0 |
|
|
|
|
|
|
| 2 | [chronos](./chronos.md) | 236 | 1% | 245 | 9 |
|
|
|
|
|
|
| 3 | [range-calendar](./range-calendar.md) | 95 | 0% | 98 | 0 |
|
|
|
|
|
|
| 4 | [proof-of-human](./proof-of-human.md) | 91 | 0% | 95 | 0 |
|
|
|
|
|
|
| 5 | [combobox](./combobox.md) | 88 | 0% | 96 | 1 |
|
|
|
|
|
|
| 6 | [time-range-picker](./time-range-picker.md) | 84 | 0% | 88 | 0 |
|
|
|
|
|
|
| 7 | [chart](./chart.md) | 80 | 9% | 92 | 17 |
|
|
|
|
|
|
| 8 | [natural-time-picker](./natural-time-picker.md) | 76 | 0% | 78 | 0 |
|
|
|
|
|
|
| 9 | [prose](./prose.md) | 73 | 1% | 74 | 2 |
|
|
|
|
|
|
| 10 | [month-grid](./month-grid.md) | 58 | 0% | 61 | 0 |
|
|
|
|
|
|
| 11 | [year-grid](./year-grid.md) | 58 | 0% | 61 | 0 |
|
|
|
|
|
|
| 12 | [gradient-builder](./gradient-builder.md) | 57 | 0% | 62 | 0 |
|
|
|
|
|
|
| 13 | [time-picker](./time-picker.md) | 57 | 0% | 59 | 0 |
|
|
|
|
|
|
| 14 | [date-range-picker](./date-range-picker.md) | 52 | 0% | 55 | 0 |
|
|
|
|
|
|
| 15 | [command](./command.md) | 50 | 0% | 52 | 0 |
|
|
|
|
|
|
| 16 | [media-player](./media-player.md) | 45 | 0% | 45 | 2 |
|
|
|
|
|
|
| 17 | [color-picker](./color-picker.md) | 43 | 46% | 82 | 54 |
|
|
|
|
|
|
| 18 | [table](./table.md) | 42 | 0% | 46 | 0 |
|
|
|
|
|
|
| 19 | [field-langs](./field-langs.md) | 39 | 0% | 41 | 0 |
|
|
|
|
|
|
| 20 | [tree-grid](./tree-grid.md) | 39 | 0% | 42 | 0 |
|
|
|
|
|
|
|
|
|
|
|
|
## Sin ningún token público propio (62)
|
|
|
|
|
|
|
|
|
|
|
|
Ni una clave pública en `lib/recipes/base.ts` — alguno tiene privados forward
|
|
|
|
|
|
(`_palette-*`), que no son contrato: un tema no puede nombrarlos.
|
|
|
|
|
|
|
|
|
|
|
|
[`alert-dialog`](./alert-dialog.md) · [`announce`](./announce.md) · [`aspect-ratio`](./aspect-ratio.md) · [`auto-grid`](./auto-grid.md) · [`avatar`](./avatar.md) · [`card-group`](./card-group.md) · [`carousel`](./carousel.md) · [`cascade`](./cascade.md) · [`clipboard`](./clipboard.md) · [`code`](./code.md) · [`code-block`](./code-block.md) · [`command`](./command.md) · [`css-field`](./css-field.md) · [`date-picker`](./date-picker.md) · [`date-range-picker`](./date-range-picker.md) · [`display`](./display.md) · [`feed`](./feed.md) · [`field-langs`](./field-langs.md) · [`gradient-builder`](./gradient-builder.md) · [`gradient-picker`](./gradient-picker.md) · [`grid-list`](./grid-list.md) · [`heading`](./heading.md) · [`highlight`](./highlight.md) · [`kbd`](./kbd.md) · [`knob`](./knob.md) · [`label`](./label.md) · [`link`](./link.md) · [`link-preview`](./link-preview.md) · [`listbox`](./listbox.md) · [`mark`](./mark.md) · [`mask-field`](./mask-field.md) · [`menu-dial`](./menu-dial.md) · [`mockup`](./mockup.md) · [`month-grid`](./month-grid.md) · [`motion`](./motion.md) · [`natural-time-picker`](./natural-time-picker.md) · [`number-field`](./number-field.md) · [`palabras`](./palabras.md) · [`picker-shell`](./picker-shell.md) · [`proof-of-human`](./proof-of-human.md) · [`range-calendar`](./range-calendar.md) · [`scroll-frames`](./scroll-frames.md) · [`skeleton`](./skeleton.md) · [`skin-media-player`](./skin-media-player.md) · [`spinner`](./spinner.md) · [`stack`](./stack.md) · [`table`](./table.md) · [`text`](./text.md) · [`text-blur`](./text-blur.md) · [`text-circular`](./text-circular.md) · [`text-focus`](./text-focus.md) · [`text-gradient`](./text-gradient.md) · [`text-scramble`](./text-scramble.md) · [`textarea`](./textarea.md) · [`time-picker`](./time-picker.md) · [`time-range-picker`](./time-range-picker.md) · [`tree-grid`](./tree-grid.md) · [`tree-view`](./tree-view.md) · [`virtual-grid`](./virtual-grid.md) · [`virtual-list`](./virtual-list.md) · [`wrap`](./wrap.md) · [`year-grid`](./year-grid.md)
|
|
|
|
|
|
|
|
|
|
|
|
## Tabla completa (162 recetas, por alcance ascendente)
|
|
|
|
|
|
|
|
|
|
|
|
La columna «contrato» cuenta las claves **públicas** del bloque del componente.
|
|
|
|
|
|
|
|
|
|
|
|
| componente | alcance | knobs | público | privado | global | literal | sistema | contrato | size |
|
|
|
|
|
|
| --- | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: | :-: |
|
|
|
|
|
|
| [range-calendar](./range-calendar.md) | 0% | 98 | 0 | 7 | 84 | 4 | 3 | 0 | y |
|
|
|
|
|
|
| [combobox](./combobox.md) | 0% | 96 | 0 | 15 | 67 | 6 | 8 | 1 | y |
|
|
|
|
|
|
| [proof-of-human](./proof-of-human.md) | 0% | 95 | 0 | 18 | 36 | 37 | 4 | 0 | y |
|
|
|
|
|
|
| [time-range-picker](./time-range-picker.md) | 0% | 88 | 0 | 6 | 61 | 17 | 4 | 0 | y |
|
|
|
|
|
|
| [natural-time-picker](./natural-time-picker.md) | 0% | 78 | 0 | 0 | 69 | 7 | 2 | 0 | y |
|
|
|
|
|
|
| [gradient-builder](./gradient-builder.md) | 0% | 62 | 0 | 8 | 46 | 3 | 5 | 0 | y |
|
|
|
|
|
|
| [month-grid](./month-grid.md) | 0% | 61 | 0 | 13 | 40 | 5 | 3 | 0 | y |
|
|
|
|
|
|
| [year-grid](./year-grid.md) | 0% | 61 | 0 | 13 | 40 | 5 | 3 | 0 | y |
|
|
|
|
|
|
| [time-picker](./time-picker.md) | 0% | 59 | 0 | 3 | 42 | 12 | 2 | 0 | y |
|
|
|
|
|
|
| [date-range-picker](./date-range-picker.md) | 0% | 55 | 0 | 0 | 49 | 3 | 3 | 0 | y |
|
|
|
|
|
|
| [command](./command.md) | 0% | 52 | 0 | 9 | 35 | 6 | 2 | 0 | y |
|
|
|
|
|
|
| [table](./table.md) | 0% | 46 | 0 | 23 | 14 | 5 | 4 | 0 | y |
|
|
|
|
|
|
| [media-player](./media-player.md) | 0% | 45 | 0 | 0 | 37 | 8 | 0 | 2 | y |
|
|
|
|
|
|
| [tree-grid](./tree-grid.md) | 0% | 42 | 0 | 29 | 8 | 2 | 3 | 0 | y |
|
|
|
|
|
|
| [field-langs](./field-langs.md) | 0% | 41 | 0 | 0 | 31 | 8 | 2 | 0 | – |
|
|
|
|
|
|
| [gradient-picker](./gradient-picker.md) | 0% | 38 | 0 | 7 | 23 | 5 | 3 | 0 | y |
|
|
|
|
|
|
| [listbox](./listbox.md) | 0% | 38 | 0 | 9 | 23 | 3 | 3 | 0 | – |
|
|
|
|
|
|
| [carousel](./carousel.md) | 0% | 36 | 0 | 14 | 12 | 5 | 5 | 0 | y |
|
|
|
|
|
|
| [heading](./heading.md) | 0% | 36 | 0 | 36 | 0 | 0 | 0 | 0 | – |
|
|
|
|
|
|
| [feed](./feed.md) | 0% | 33 | 0 | 13 | 16 | 3 | 1 | 0 | y |
|
|
|
|
|
|
| [grid-list](./grid-list.md) | 0% | 32 | 0 | 8 | 17 | 2 | 5 | 0 | y |
|
|
|
|
|
|
| [textarea](./textarea.md) | 0% | 28 | 0 | 16 | 5 | 4 | 3 | 0 | y |
|
|
|
|
|
|
| [tree-view](./tree-view.md) | 0% | 28 | 0 | 8 | 14 | 4 | 2 | 0 | y |
|
|
|
|
|
|
| [code-block](./code-block.md) | 0% | 26 | 0 | 2 | 24 | 0 | 0 | 0 | – |
|
|
|
|
|
|
| [card-group](./card-group.md) | 0% | 24 | 0 | 0 | 18 | 4 | 2 | 0 | y |
|
|
|
|
|
|
| [text](./text.md) | 0% | 24 | 0 | 24 | 0 | 0 | 0 | 0 | – |
|
|
|
|
|
|
| [spinner](./spinner.md) | 0% | 23 | 0 | 15 | 4 | 4 | 0 | 0 | y |
|
|
|
|
|
|
| [picker-shell](./picker-shell.md) | 0% | 21 | 0 | 4 | 17 | 0 | 0 | 0 | y |
|
|
|
|
|
|
| [link-preview](./link-preview.md) | 0% | 17 | 0 | 4 | 9 | 1 | 3 | 0 | y |
|
|
|
|
|
|
| [drag-drop](./drag-drop.md) | 0% | 16 | 0 | 3 | 6 | 0 | 7 | 1 | – |
|
|
|
|
|
|
| [kbd](./kbd.md) | 0% | 14 | 0 | 1 | 9 | 4 | 0 | 0 | – |
|
|
|
|
|
|
| [link](./link.md) | 0% | 14 | 0 | 4 | 2 | 5 | 3 | 0 | – |
|
|
|
|
|
|
| [code](./code.md) | 0% | 13 | 0 | 6 | 3 | 4 | 0 | 0 | – |
|
|
|
|
|
|
| [virtual-list](./virtual-list.md) | 0% | 13 | 0 | 2 | 6 | 4 | 1 | 0 | y |
|
|
|
|
|
|
| [virtual-grid](./virtual-grid.md) | 0% | 12 | 0 | 2 | 6 | 3 | 1 | 0 | y |
|
|
|
|
|
|
| [skeleton](./skeleton.md) | 0% | 11 | 0 | 9 | 1 | 1 | 0 | 0 | y |
|
|
|
|
|
|
| [skin-media-player](./skin-media-player.md) | 0% | 11 | 0 | 0 | 2 | 7 | 2 | 0 | y |
|
|
|
|
|
|
| [scroll-frames](./scroll-frames.md) | 0% | 9 | 0 | 1 | 4 | 4 | 0 | 0 | – |
|
|
|
|
|
|
| [announce](./announce.md) | 0% | 8 | 0 | 0 | 8 | 0 | 0 | 0 | – |
|
|
|
|
|
|
| [clipboard](./clipboard.md) | 0% | 8 | 0 | 2 | 5 | 1 | 0 | 0 | – |
|
|
|
|
|
|
| [label](./label.md) | 0% | 8 | 0 | 6 | 2 | 0 | 0 | 0 | – |
|
|
|
|
|
|
| [menu-dial](./menu-dial.md) | 0% | 8 | 0 | 3 | 1 | 4 | 0 | 0 | y |
|
|
|
|
|
|
| [display](./display.md) | 0% | 6 | 0 | 6 | 0 | 0 | 0 | 0 | – |
|
|
|
|
|
|
| [mark](./mark.md) | 0% | 5 | 0 | 2 | 1 | 2 | 0 | 0 | – |
|
|
|
|
|
|
| [aspect-ratio](./aspect-ratio.md) | 0% | 3 | 0 | 0 | 1 | 2 | 0 | 0 | – |
|
|
|
|
|
|
| [date-picker](./date-picker.md) | 0% | 2 | 0 | 0 | 0 | 2 | 0 | 0 | – |
|
|
|
|
|
|
| [sticky](./sticky.md) | 0% | 2 | 0 | 1 | 0 | 1 | 0 | 1 | – |
|
|
|
|
|
|
| [text-blur](./text-blur.md) | 0% | 2 | 0 | 0 | 0 | 2 | 0 | 0 | – |
|
|
|
|
|
|
| [cascade](./cascade.md) | 0% | 1 | 0 | 0 | 0 | 1 | 0 | 0 | – |
|
|
|
|
|
|
| [motion](./motion.md) | 0% | 1 | 0 | 0 | 0 | 1 | 0 | 0 | – |
|
|
|
|
|
|
| [section](./section.md) | 0% | 1 | 0 | 0 | 0 | 1 | 0 | 4 | – |
|
|
|
|
|
|
| [chronos](./chronos.md) | 1% | 245 | 2 | 22 | 202 | 12 | 7 | 9 | y |
|
|
|
|
|
|
| [prose](./prose.md) | 1% | 74 | 1 | 0 | 43 | 30 | 0 | 2 | y |
|
|
|
|
|
|
| [nav-tree](./nav-tree.md) | 4% | 25 | 1 | 0 | 17 | 6 | 1 | 1 | – |
|
|
|
|
|
|
| [s-text](./s-text.md) | 7% | 30 | 2 | 28 | 0 | 0 | 0 | 3 | – |
|
|
|
|
|
|
| [chart](./chart.md) | 9% | 92 | 8 | 0 | 66 | 14 | 4 | 17 | – |
|
|
|
|
|
|
| [result](./result.md) | 9% | 22 | 2 | 1 | 15 | 4 | 0 | 8 | – |
|
|
|
|
|
|
| [mockup](./mockup.md) | 14% | 29 | 4 | 7 | 13 | 5 | 0 | 0 | – |
|
|
|
|
|
|
| [menubar](./menubar.md) | 15% | 27 | 4 | 6 | 16 | 0 | 1 | 5 | y |
|
|
|
|
|
|
| [anchor-nav](./anchor-nav.md) | 20% | 11 | 2 | 0 | 8 | 0 | 1 | 2 | – |
|
|
|
|
|
|
| [banner](./banner.md) | 20% | 10 | 2 | 6 | 1 | 1 | 0 | 42 | y |
|
|
|
|
|
|
| [button](./button.md) | 21% | 30 | 6 | 16 | 0 | 7 | 1 | 105 | y |
|
|
|
|
|
|
| [palabras](./palabras.md) | 22% | 471 | 103 | 1 | 272 | 90 | 5 | 0 | – |
|
|
|
|
|
|
| [toggle](./toggle.md) | 22% | 28 | 6 | 17 | 1 | 3 | 1 | 119 | y |
|
|
|
|
|
|
| [date-range-field](./date-range-field.md) | 25% | 9 | 2 | 0 | 4 | 2 | 1 | 3 | – |
|
|
|
|
|
|
| [time-range-field](./time-range-field.md) | 25% | 9 | 2 | 0 | 4 | 2 | 1 | 3 | – |
|
|
|
|
|
|
| [surface](./surface.md) | 25% | 4 | 1 | 3 | 0 | 0 | 0 | 25 | – |
|
|
|
|
|
|
| [callout](./callout.md) | 27% | 15 | 4 | 3 | 7 | 1 | 0 | 28 | – |
|
|
|
|
|
|
| [meter](./meter.md) | 29% | 14 | 4 | 6 | 2 | 2 | 0 | 28 | y |
|
|
|
|
|
|
| [knob](./knob.md) | 29% | 27 | 7 | 4 | 9 | 4 | 3 | 0 | y |
|
|
|
|
|
|
| [onion-menu](./onion-menu.md) | 29% | 27 | 7 | 0 | 8 | 9 | 3 | 12 | – |
|
|
|
|
|
|
| [empty-state](./empty-state.md) | 29% | 17 | 5 | 7 | 5 | 0 | 0 | 6 | y |
|
|
|
|
|
|
| [search-field](./search-field.md) | 31% | 14 | 4 | 5 | 0 | 4 | 1 | 17 | y |
|
|
|
|
|
|
| [password-field](./password-field.md) | 31% | 36 | 11 | 5 | 9 | 10 | 1 | 23 | y |
|
|
|
|
|
|
| [aura](./aura.md) | 31% | 35 | 11 | 4 | 14 | 6 | 0 | 24 | y |
|
|
|
|
|
|
| [toggle-group](./toggle-group.md) | 33% | 3 | 1 | 0 | 1 | 1 | 0 | 1 | – |
|
|
|
|
|
|
| [background](./background.md) | 35% | 26 | 8 | 6 | 6 | 3 | 3 | 31 | – |
|
|
|
|
|
|
| [avatar](./avatar.md) | 36% | 36 | 13 | 17 | 0 | 6 | 0 | 0 | y |
|
|
|
|
|
|
| [audio-player](./audio-player.md) | 37% | 19 | 7 | 0 | 8 | 4 | 0 | 5 | – |
|
|
|
|
|
|
| [tooltip](./tooltip.md) | 38% | 22 | 8 | 9 | 3 | 1 | 1 | 20 | y |
|
|
|
|
|
|
| [button-group](./button-group.md) | 40% | 5 | 2 | 0 | 0 | 3 | 0 | 1 | – |
|
|
|
|
|
|
| [badge](./badge.md) | 41% | 22 | 9 | 10 | 1 | 2 | 0 | 65 | y |
|
|
|
|
|
|
| [popover](./popover.md) | 42% | 51 | 20 | 6 | 22 | 0 | 3 | 36 | y |
|
|
|
|
|
|
| [qr-code](./qr-code.md) | 43% | 7 | 3 | 0 | 0 | 4 | 0 | 10 | – |
|
|
|
|
|
|
| [navigation-menu](./navigation-menu.md) | 44% | 38 | 15 | 1 | 13 | 5 | 4 | 26 | y |
|
|
|
|
|
|
| [waveform](./waveform.md) | 45% | 11 | 5 | 1 | 1 | 4 | 0 | 10 | y |
|
|
|
|
|
|
| [color-picker](./color-picker.md) | 46% | 82 | 36 | 10 | 22 | 11 | 3 | 54 | y |
|
|
|
|
|
|
| [checkbox](./checkbox.md) | 48% | 34 | 16 | 12 | 2 | 3 | 1 | 45 | y |
|
|
|
|
|
|
| [progress](./progress.md) | 49% | 35 | 17 | 9 | 3 | 6 | 0 | 41 | y |
|
|
|
|
|
|
| [tag-group](./tag-group.md) | 49% | 46 | 21 | 21 | 0 | 1 | 3 | 91 | y |
|
|
|
|
|
|
| [color-swatch](./color-swatch.md) | 50% | 10 | 5 | 2 | 3 | 0 | 0 | 12 | y |
|
|
|
|
|
|
| [text-scramble](./text-scramble.md) | 50% | 4 | 2 | 0 | 0 | 2 | 0 | 0 | – |
|
|
|
|
|
|
| [split-button](./split-button.md) | 50% | 2 | 1 | 0 | 1 | 0 | 0 | 1 | y |
|
|
|
|
|
|
| [timeline](./timeline.md) | 51% | 49 | 25 | 21 | 0 | 3 | 0 | 45 | y |
|
|
|
|
|
|
| [field](./field.md) | 51% | 73 | 35 | 15 | 7 | 11 | 5 | 60 | y |
|
|
|
|
|
|
| [context-menu](./context-menu.md) | 53% | 33 | 16 | 0 | 11 | 3 | 3 | 18 | – |
|
|
|
|
|
|
| [rating-group](./rating-group.md) | 53% | 16 | 8 | 4 | 1 | 2 | 1 | 25 | y |
|
|
|
|
|
|
| [metrics](./metrics.md) | 54% | 50 | 27 | 10 | 9 | 4 | 0 | 68 | y |
|
|
|
|
|
|
| [sidebar](./sidebar.md) | 55% | 45 | 23 | 0 | 14 | 5 | 3 | 50 | – |
|
|
|
|
|
|
| [drawer](./drawer.md) | 55% | 62 | 33 | 9 | 13 | 5 | 2 | 44 | y |
|
|
|
|
|
|
| [color-field](./color-field.md) | 56% | 16 | 9 | 0 | 2 | 5 | 0 | 22 | y |
|
|
|
|
|
|
| [image](./image.md) | 57% | 35 | 20 | 2 | 1 | 12 | 0 | 22 | y |
|
|
|
|
|
|
| [dropdown-menu](./dropdown-menu.md) | 57% | 30 | 16 | 0 | 9 | 3 | 2 | 19 | – |
|
|
|
|
|
|
| [switch](./switch.md) | 57% | 22 | 12 | 8 | 1 | 0 | 1 | 52 | y |
|
|
|
|
|
|
| [s-text-virtual-list](./s-text-virtual-list.md) | 58% | 12 | 7 | 0 | 3 | 2 | 0 | 9 | – |
|
|
|
|
|
|
| [form](./form.md) | 59% | 52 | 30 | 14 | 5 | 2 | 1 | 54 | y |
|
|
|
|
|
|
| [float-panel](./float-panel.md) | 59% | 53 | 29 | 3 | 12 | 5 | 4 | 28 | – |
|
|
|
|
|
|
| [slider](./slider.md) | 59% | 33 | 19 | 12 | 0 | 1 | 1 | 39 | y |
|
|
|
|
|
|
| [radio-cards](./radio-cards.md) | 60% | 72 | 42 | 0 | 24 | 4 | 2 | 39 | y |
|
|
|
|
|
|
| [card](./card.md) | 60% | 36 | 21 | 14 | 0 | 0 | 1 | 97 | y |
|
|
|
|
|
|
| [cropper](./cropper.md) | 60% | 27 | 15 | 0 | 3 | 7 | 2 | 15 | – |
|
|
|
|
|
|
| [emoji-picker](./emoji-picker.md) | 61% | 32 | 17 | 0 | 8 | 3 | 4 | 17 | – |
|
|
|
|
|
|
| [pin-input](./pin-input.md) | 61% | 19 | 11 | 0 | 6 | 1 | 1 | 20 | y |
|
|
|
|
|
|
| [editable](./editable.md) | 63% | 44 | 25 | 12 | 1 | 2 | 4 | 56 | y |
|
|
|
|
|
|
| [text-focus](./text-focus.md) | 63% | 8 | 5 | 0 | 1 | 2 | 0 | 0 | – |
|
|
|
|
|
|
| [spin-field](./spin-field.md) | 64% | 27 | 16 | 0 | 8 | 1 | 2 | 20 | – |
|
|
|
|
|
|
| [file-upload](./file-upload.md) | 64% | 61 | 38 | 16 | 1 | 4 | 2 | 98 | y |
|
|
|
|
|
|
| [tags-input](./tags-input.md) | 67% | 46 | 28 | 13 | 1 | 0 | 4 | 90 | y |
|
|
|
|
|
|
| [toolbar](./toolbar.md) | 67% | 35 | 22 | 10 | 0 | 1 | 2 | 54 | y |
|
|
|
|
|
|
| [image-adjustments](./image-adjustments.md) | 67% | 18 | 10 | 0 | 4 | 1 | 3 | 12 | – |
|
|
|
|
|
|
| [text-gradient](./text-gradient.md) | 67% | 9 | 6 | 0 | 0 | 3 | 0 | 0 | – |
|
|
|
|
|
|
| [separator](./separator.md) | 67% | 6 | 4 | 0 | 0 | 2 | 0 | 3 | – |
|
|
|
|
|
|
| [select](./select.md) | 69% | 72 | 45 | 14 | 3 | 3 | 7 | 101 | y |
|
|
|
|
|
|
| [dialog](./dialog.md) | 70% | 33 | 23 | 5 | 4 | 1 | 0 | 37 | y |
|
|
|
|
|
|
| [image-picker](./image-picker.md) | 71% | 20 | 12 | 0 | 1 | 4 | 3 | 13 | – |
|
|
|
|
|
|
| [pagination](./pagination.md) | 71% | 26 | 17 | 7 | 0 | 0 | 2 | 34 | y |
|
|
|
|
|
|
| [stepper](./stepper.md) | 71% | 60 | 40 | 15 | 0 | 1 | 4 | 69 | y |
|
|
|
|
|
|
| [skip-link](./skip-link.md) | 71% | 8 | 5 | 0 | 0 | 2 | 1 | 8 | – |
|
|
|
|
|
|
| [date-field](./date-field.md) | 73% | 11 | 8 | 3 | 0 | 0 | 0 | 21 | y |
|
|
|
|
|
|
| [time-field](./time-field.md) | 73% | 11 | 8 | 3 | 0 | 0 | 0 | 21 | y |
|
|
|
|
|
|
| [calendar](./calendar.md) | 75% | 71 | 51 | 13 | 0 | 4 | 3 | 76 | y |
|
|
|
|
|
|
| [accordion](./accordion.md) | 77% | 65 | 49 | 10 | 0 | 5 | 1 | 76 | y |
|
|
|
|
|
|
| [radio-group](./radio-group.md) | 77% | 75 | 56 | 10 | 7 | 0 | 2 | 61 | y |
|
|
|
|
|
|
| [chat-log](./chat-log.md) | 77% | 42 | 30 | 0 | 4 | 5 | 3 | 31 | – |
|
|
|
|
|
|
| [chat-composer](./chat-composer.md) | 79% | 44 | 31 | 0 | 3 | 5 | 5 | 31 | – |
|
|
|
|
|
|
| [chat-message](./chat-message.md) | 82% | 84 | 63 | 2 | 6 | 6 | 7 | 75 | y |
|
|
|
|
|
|
| [fab](./fab.md) | 82% | 17 | 14 | 0 | 2 | 1 | 0 | 10 | – |
|
|
|
|
|
|
| [toast](./toast.md) | 83% | 42 | 35 | 6 | 0 | 1 | 0 | 85 | – |
|
|
|
|
|
|
| [text-circular](./text-circular.md) | 83% | 6 | 5 | 0 | 1 | 0 | 0 | 0 | – |
|
|
|
|
|
|
| [tabs](./tabs.md) | 88% | 76 | 66 | 6 | 2 | 1 | 1 | 79 | y |
|
|
|
|
|
|
| [chat-typing](./chat-typing.md) | 89% | 9 | 8 | 0 | 1 | 0 | 0 | 7 | – |
|
|
|
|
|
|
| [breadcrumb](./breadcrumb.md) | 90% | 23 | 18 | 2 | 0 | 0 | 3 | 28 | y |
|
|
|
|
|
|
| [collapsible](./collapsible.md) | 90% | 12 | 9 | 0 | 1 | 0 | 2 | 11 | – |
|
|
|
|
|
|
| [scroll-area](./scroll-area.md) | 94% | 17 | 15 | 0 | 0 | 1 | 1 | 13 | – |
|
|
|
|
|
|
| [splitter](./splitter.md) | 100% | 19 | 18 | 0 | 0 | 0 | 1 | 16 | – |
|
|
|
|
|
|
| [chat-list](./chat-list.md) | 100% | 18 | 18 | 0 | 0 | 0 | 0 | 18 | – |
|
|
|
|
|
|
| [box](./box.md) | 100% | 9 | 9 | 0 | 0 | 0 | 0 | 43 | – |
|
|
|
|
|
|
| [barcode](./barcode.md) | 100% | 5 | 5 | 0 | 0 | 0 | 0 | 7 | – |
|
|
|
|
|
|
| [flex](./flex.md) | 100% | 2 | 2 | 0 | 0 | 0 | 0 | 7 | – |
|
|
|
|
|
|
| [grid](./grid.md) | 100% | 2 | 2 | 0 | 0 | 0 | 0 | 13 | – |
|
|
|
|
|
|
| [alert-dialog](./alert-dialog.md) | — | 0 | 0 | 0 | 0 | 0 | 0 | 0 | – |
|
|
|
|
|
|
| [auto-grid](./auto-grid.md) | — | 0 | 0 | 0 | 0 | 0 | 0 | 0 | – |
|
|
|
|
|
|
| [container](./container.md) | — | 0 | 0 | 0 | 0 | 0 | 0 | 1 | – |
|
|
|
|
|
|
| [css-field](./css-field.md) | — | 0 | 0 | 0 | 0 | 0 | 0 | 0 | – |
|
|
|
|
|
|
| [float](./float.md) | — | 0 | 0 | 0 | 0 | 0 | 0 | 1 | – |
|
|
|
|
|
|
| [group](./group.md) | — | 0 | 0 | 0 | 0 | 0 | 0 | 1 | – |
|
|
|
|
|
|
| [highlight](./highlight.md) | — | 0 | 0 | 0 | 0 | 0 | 0 | 0 | – |
|
|
|
|
|
|
| [icon](./icon.md) | — | 0 | 0 | 0 | 0 | 0 | 0 | 2 | – |
|
|
|
|
|
|
| [mask-field](./mask-field.md) | — | 0 | 0 | 0 | 0 | 0 | 0 | 0 | – |
|
|
|
|
|
|
| [number-field](./number-field.md) | — | 0 | 0 | 0 | 0 | 0 | 0 | 0 | – |
|
|
|
|
|
|
| [stack](./stack.md) | — | 0 | 0 | 0 | 0 | 0 | 0 | 0 | – |
|
|
|
|
|
|
| [wrap](./wrap.md) | — | 0 | 0 | 0 | 0 | 0 | 0 | 0 | – |
|
|
|
|
|
|
|
|
|
|
|
|
## Veredicto y decisiones
|
|
|
|
|
|
|
|
|
|
|
|
<!-- veredicto:start -->
|
|
|
|
|
|
|
|
|
|
|
|
_(pendiente — lo escribe el autor; se conserva al regenerar)_
|
|
|
|
|
|
|
|
|
|
|
|
<!-- veredicto:end -->
|
