You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
svelte-kit-vice/docs/audit/theming/command.md

6.5 KiB

command — alcance de tema: análisis y propuesta

Generado por node --import tsx/esm scripts/theming-census.ts --report. Lo medido y la propuesta se regeneran; el Veredicto (§5) se conserva. Vista de conjunto: README · método y protocolo: PLAN-theming.md §1, §2, §7.

  • Medido: 2026-08-25 · Alcance: 98% — 49 de 50 knobs por token público
  • Knobs de apariencia: 52 — público 49 · privado 0 · global 0 · literal 1 · sistema 2 · excepción 0 · estructural 0 · puente 0 · canal 0 (los cinco últimos, fuera del ratio)
  • Contrato hoy (lib/recipes/base.ts): 57 pública(s) — input-padding-inline-sm, input-padding-inline-md, input-padding-inline-lg, input-font-size-sm, input-font-size-md, input-font-size-lg, item-padding-inline-sm, item-padding-inline-md, item-padding-inline-lg, item-font-size-sm, item-font-size-md, item-font-size-lg, input-padding-inline, input-font-size, item-padding-inline, item-font-size, radius, font-family, line-height, fg, input-padding-block, input-margin, input-border-width, input-border, input-radius, input-bg, input-fg, input-placeholder-fg, focus-input-border, loading-height, loading-fg, viewport-max-block, viewport-gap, viewport-padding-inline, viewport-padding-block-end, scrollbar-inset, viewport-padding, group-gap, group-heading-padding-block, group-heading-fg, group-heading-font-size, group-heading-font-weight, group-heading-tracking, group-items-gap, item-gap, item-fg, item-icon-size, item-icon-fg, item-shortcut-gap, item-shortcut-fg, item-shortcut-font-size, selected-item-sub-fg, empty-padding-block, empty-fg, separator-height, separator-margin-block, separator-bg
  • Eje size: no · ficheros: command.css

1. Knobs fuera de alcance

1.1 Directo a primitivo global (0)

Ninguno.

1.2 A través de un privado (0)

Ninguno.

1.3 Literales (1)

# fichero:línea selector propiedad valor
1 command.css:42 [data-command] inline-size 100%

1.4 Excepciones firmadas (0) — fuera del ratio

Literales que llevan su anotación /* literal: <razón> */ en la propia declaración: la válvula de recipe-contract §3, la misma que honra component-audit. Una desviación firmada no es deuda — se listan para que la razón se lea, no para acuñarlas.

Ninguno.

2. Sistema transversal (2) — informativo, fuera del ratio

Un tema los alcanza a nivel de sistema, por diseño (recipe-contract §2).

# fichero:línea selector propiedad valor
1 command.css:132 [data-command-input]:focus-visible outline var(--focus-ring-width) solid var(--focus-ring-color)
2 command.css:243 [data-command-item][data-disabled], [data-command-link-item][data-disabled] opacity var(--opacity-disabled)

3. Privados de la receta — ¿de dónde sale su valor?

La receta no declara privados propios en su CSS.

Consumidos y no declarados en el CSS (vienen de base.ts o de un estilo inline del wrapper): --_command-loading-progress.

4. Propuesta de corrección

  • Consume la capa compartida list-surface. Un eje que la capa posee se consume como var(--_x, var(--x)); el consumidor no acuña --command-{eje} para él — sería un vocabulario paralelo (README de eidos/components, «Capas compartidas» regla 2).

4.1 Tokens a declarar en lib/recipes/base.ts (0)

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 al final) y theming §6.7 (slots de color, modificador delante). Un token con DOS valores distintos es una colisión de nombre: son dos knobs, o el nombre no distingue lo que debería — se marca ⚠.

token (--command-…) scope TSC valor propuesto usos

4.2 Sin nombre mecánico (1)

  • ⚠ decisión: 100% es un valor identidad o geometría de layout, no un knob de tema — el perímetro de «knob» es D-TH.2, sin firmar — 1: inline-size.

4.4 Lo que hay que comprobar a mano (PLAN-theming §1.3 · §7.4)

  • Privado que no deriva de un público — §3 lo marca; el privado debe leer el público o desaparecer.
  • Velo o acento en el nodo equivocado (archetype: 'item' en un envoltorio, un background en shorthand que mata la capa de estado) — se mide desde el píxel hacia arriba.
  • Doble animación al mover un sello a una superficie con animación propia — registro de animationstart/animationend.
  • Diff de computed = 0 en reposo · hover · abierto · disabled · foco, por talla, antes y después.
  • Centinela por token nuevo: valor imposible en el root → el nodo lo sigue. Si no, el token miente.

5. Veredicto

Revisión 2026-08-20 — verificación previa a implementación (Opus).

Análisis: CORRECTO (52 · 0 · 9 · 35 · 6 · 2, reproducido). La nota de capa compartida es real: consume list-surface (ritmo de filas) — nada de lo que la capa posee se acuña.

Propuesta: APTA CON TRES CORRECCIONES.

  1. El ⚠ de radius no es colisión — es CONTEXTO: la receta adapta el radio cuando vive dentro de un Dialog (command.css:71: [data-dialog-content] [data-command] { --_command-radius: var(--dialog-content-radius) } — el modo <Command.Dialog>). Se acuña radius con el valor suelto (--radius-lg); la regla de contexto se queda como está — lee un PÚBLICO de dialog, que es legítimo (el panel ES un dialog ahí). No partir en dos tokens.
  2. El ⚠ de list-padding-inline es el hueco del scrollbar (base + calc(base + space-3-5)), el mismo caso que combobox resolvió con scrollbar-inset: acuñar list-padding-inline + scrollbar-inset y la regla del overflow compone.
  3. Forma por talla: coordenadas en root + nombre RESUELTO con default host (patrón Sidebar); data-size vive en el root ✓, sin parts. Alturas/tipografías por la coordenada del bundle donde casen 1:1.

Los privados: verificar en §3 cuáles derivan ya y pasar el resto a leer el público resuelto o morir. Sonda §7.2 con el palette ABIERTO (si el modo Dialog portala, medir dentro).

Bloqueos de firma: ninguno duro — ejecutable como combobox.

Powered by TurnKey Linux.