Tokens y distribución
Contrato v6, artefactos generados y adopción revisable en cada proyecto.
Fuente de verdad: theme/tokens.ts. Runtime y distribución comparten theme/css.ts. Componentes opcionales y el adaptador de la guía comparten theme/components.ts.
| Artefacto | Contenido |
|---|---|
| /tokens.json | v6, colores, tres modos, escalas, controles, metadata de marca |
| /tokens.css | Variables con tema, modo y densidad |
| /components.css | Clases opcionales independientes del kit |
| /llms.txt | Índice editorial |
| /llms-full.txt | Guía completa legible por agentes |
| /brand/manifest.json | Activos, estado de aprobación y deprecación |
<link rel="stylesheet" href="/tokens.css" />
<link rel="stylesheet" href="/components.css" />
<html data-mode="app" data-theme="light">
<button class="lg-button" data-variant="primary">Guardar cambios</button>
El modo se elige por tarea. Theme claro/oscuro y density compact son independientes. Sin modo explícito se hereda marketing por compatibilidad; todo consumidor nuevo debe declararlo.
.boton-primario {
background: var(--lg-action-bg);
color: var(--lg-action-text);
border-radius: var(--lg-radius-control);
min-height: var(--lg-button-height);
padding-inline: var(--lg-button-padding-x);
}
Contrato de familias
Inter puede cargarse con next/font en --font-sans. Mono opcional en --font-mono. Georgia se resuelve por plataforma; --font-display de v5 deja de controlar el titular editorial. Nunca reconstruir el logotipo con una fuente.
Regeneración
pnpm gen emite CSS, JSON y llms. No editar derivados. pnpm build genera out/ estático. Ver Adopción para cambios incompatibles y checks de cada proyecto.
El dashboard conserva sincronización explícita mediante tokens:sync y tokens:check. Antes de sincronizar v6 hay que adaptar primary a action, el radio field y la escala de app; descargar el CSS por sí solo no completa la migración. No introducir una dependencia remota mutable en runtime sin versionarla.