Los argumentos a favor de Lily

Lily te entrega las partes difíciles —semántica, accesibilidad, comportamiento del teclado, internacionalización— y deja el aspecto por completo, y con gusto, en tus manos.

Empieza desde tu diseño

Tu equipo ya sabe cómo debe verse su producto. Lily parte exactamente de ahí: aporta lo que es realmente difícil de acertar y costoso de rehacer —el elemento semántico correcto, los estados ARIA, el contrato del teclado, la gestión del foco— y deja cada decisión visual por completo, y con alegría, en tus manos. Tu CSS es el aspecto del sistema de diseño desde el primer día.

Como cada componente lleva una clase de enlace estable y una estructura pura, tu estilo sigue siendo tuyo con cada actualización, y la accesibilidad que hay debajo sigue funcionando versión tras versión.

A qué se compromete Lily

  • Accesible por defecto. WCAG 2.2 AAA es el objetivo de todos los componentes. Los patrones siguen las Prácticas de Creación de WAI-ARIA; todo componente interactivo se puede manejar con el teclado según un contrato documentado; las aplicaciones de ejemplo mantienen una base limpia de axe-core.
  • Internacionalizable por construcción. Cada cadena visible para el usuario —cada etiqueta, error y anuncio— es una propiedad con nombres estables en todos los frameworks, de modo que la traducción fluye con naturalidad. El texto de derecha a izquierda y el bidireccional heredan de tu dir. Los componentes sensibles a la configuración regional reciben el idioma como propiedad, siempre de forma explícita.
  • Un catálogo, ocho frameworks. Los mismos 571 componentes (536 como Web Components nativos) con las mismas clases de enlace y convenciones de propiedades en HTML, Svelte, React, Vue, Angular, Blazor, Nunjucks y Web Components. Tu CSS y los conocimientos de tu equipo se trasladan de una tecnología a otra.
  • Independiente de la estrategia de CSS. Una clase estable en kebab-case por cada raíz de componente. CSS semántico, utilidades de Tailwind, CSS-in-JS o uno de los 45 temas listos para usar: Lily los acepta todos y se mantiene discretamente al margen.
  • Gratis, para siempre y en tus términos. Código abierto con la licencia que elijas entre BSD, MIT, Apache-2.0, GPL-2.0 o GPL-3.0. Sin nivel de pago, sin licencias por usuario, sin telemetría.

Profundidad donde importa

Más allá de los botones y diálogos habituales, el catálogo llega más lejos que la mayoría:

  • Patrones del sector público investigados a partir de los sistemas de diseño de NHS UK, GOV.UK, USWDS y ONS: resúmenes de errores, avisos de advertencia, listas de resumen, banners de fase y enlaces de salto.
  • 140 componentes de identificadores personales nacionales que abarcan identificadores sanitarios, de documento nacional, fiscales y de pasaporte de más de 50 países, cada uno con su formato y su algoritmo de validación documentados.
  • Elementos editoriales y de scrollytelling adaptados de Reuters Graphics: diseños de artículo, desplazadores, líneas de tiempo y mapas de mosaicos.
  • Asistentes de selección: paquetes pequeños que se encargan de una interacción de principio a fin: cambio de tema (con carga de hojas de estilo en tiempo de ejecución), idioma, tamaño del texto, movimiento reducido, búsqueda, enlaces de página, compartir y entrada de fecha y hora. Cada uno es un botón de icono headless que abre una ventana emergente —no un <select> nativo— con persistencia y compatibilidad con SSR integradas.

Temas para el sector público, listos para usar

Lily incluye 45 temas de referencia independientes que apuntan directamente a sus clases de enlace: NHS England, NHS Scotland y NHS Wales (cada uno en variantes para pacientes y para profesionales), GOV.UK, USWDS, paletas inspiradas en Adobe Spectrum y Mozilla Protocol, y un conjunto de temas claros y oscuros de uso general. Enlaza una hoja de estilo y tendrás un aspecto de nivel gubernamental; el asistente theme-picker los cambia en tiempo de ejecución.

Cómo se compara Lily

Mantenemos una comparación honesta, componente por componente, con otros sistemas de diseño: con y sin estilo, headless, comerciales y del sector público. Donde otra biblioteca te convenga más, la comparación lo mostrará; Lily aprende de todas ellas y cita sus inspiraciones abiertamente.

Quién está detrás

Lily es un proyecto de código abierto joven e independiente que agradece la colaboración, la orientación y los comentarios; consulta Acerca de para conocer su historia y sus inspiraciones. Todo —la especificación, las pruebas, la hoja de ruta, incluso las herramientas de auditoría— está a la vista en github.com/LilyDesignSystem.

Ayuda a que Lily crezca

Si Lily te resulta útil, lo más valioso que puedes hacer es:

  • Dar una estrella y compartir. Da una estrella al repositorio principal y enseña el catálogo a un compañero: la visibilidad es el recurso más escaso de un proyecto joven.
  • Construir algo y contárnoslo. Los informes de uso real —qué funcionó y qué podría ser más fluido— influyen en la hoja de ruta más que ninguna otra cosa.
  • Auditar la accesibilidad. Las pruebas con lectores de pantalla (VoiceOver, NVDA, JAWS) en las aplicaciones de ejemplo valen oro; cuéntanos lo que encuentres.
  • Aportar un tema o una traducción. Ambas son primeras contribuciones independientes y bien acotadas.
  • Comparte lo que encuentres, con un caso reproducible mínimo, en el repositorio correspondiente, o escribe a joel@joelparkerhenderson.com.