@lexydesign/kit

Kit HTML / low-fi del Lexy Design System: los mismos componentes y blocks del registry en HTML plano, sin React ni Radix, con un kit.css autocontenido (theme Lexy + utilidades Tailwind ya compiladas). Sirve para prototipos low-fi y para que un agente componga páginas con el look real de Lexy.

No se importa como librería — se trae como carpeta:

npx create-lexy kit            # copia el kit a ./lexy-kit

O directo por CDN de npm (jsdelivr sirve cada archivo como texto, con CORS abierto):

# Página central para una IA (catálogo + cómo prototipar + enlaces absolutos)
https://cdn.jsdelivr.net/npm/@lexydesign/kit@latest/kit/llms.txt
# Todo el contexto inline en un solo archivo
https://cdn.jsdelivr.net/npm/@lexydesign/kit@latest/kit/llms-full.txt
# Índice máquina-legible y catálogo navegable
https://cdn.jsdelivr.net/npm/@lexydesign/kit@latest/kit/manifest.json
https://cdn.jsdelivr.net/npm/@lexydesign/kit@latest/kit/index.html

Una IA que pueda navegar (ChatGPT, etc.) lee llms.txt y sigue los enlaces para el markup de cada componente — igual que el registry se consume por CDN.

Estructura: index.html (catálogo), components/<nombre>.html, blocks/<nombre>.html, kit.css, kit.js, fonts/, manifest.json (índice máquina-legible), AGENTS.md (guía para que una IA construya prototipos) y pautas/ (las pautas de diseño de Lexy, para decidir bien — no solo emitir HTML válido).

Para una IA: AGENTS.md explica el flujo; manifest.json lista el inventario (con assets, guides e interactive); el markup de cada pieza está en su .html; las decisiones de diseño en pautas/. Es la paridad del flujo React, en HTML.

El contenido es generado por scripts/generate-kit.ts ejecutando los componentes a partir de registry/components/, registry/blocks/ y registry/theme/lexy-theme.css (la fuente de verdad). No se edita a mano; cada merge a main regenera y publica.

Estados interactivos: los overlays (menús, selects, popovers, tooltips, diálogos) traen un specimen Interactivo — su contenido abierto se captura del componente real (ejecutándolo en un DOM en proceso) y kit.js lo togglea al click/hover. Sin React ni Radix.

Límite: las visualizaciones que miden el DOM (Chart) quedan en su estado base; los paneles se posicionan de forma simple (no con Floating UI). Suficiente para un kit low-fi.