Repolode
Enviar
lobehub

lobehub/lobe-ui

Biblioteca de componentes React para crear aplicaciones web de chat con IA y AIGC, con componentes de chat, Markdown, código y administración.

Ver en GitHubSitio web
Estrellas
2,239
Forks
280
Issues abiertos
56
Último commit
hace 8 horas

¿Qué es?

Lobe UI es la biblioteca de componentes React que usa LobeHub, dirigida a desarrolladores que crean interfaces de chat con IA y aplicaciones web de AIGC. Incluye componentes para mostrar resultados de LLM, como Markdown, bloques de código, diagramas Mermaid, diferencias y vistas previas de HTML, además de puntos de entrada para chat y dispositivos móviles.

Más allá del chat, la biblioteca cubre la interfaz general de las aplicaciones: los paneles, las tablas de datos, los formularios y las páginas de inicio comparten un mismo lenguaje de diseño. La tematización admite modos claro y oscuro, así como el cambio entre colores primarios y neutros mediante un único atributo. Incluye textos en inglés y chino simplificado.

El proyecto solo ofrece ESM y requiere React 19, además de dependencias peer como motion, @lobehub/icons y @lobehub/fluent-emoji. La documentación también se publica en formatos pensados para agentes de programación, como una referencia skills.md y un índice de páginas llms.txt.

Funciones clave

  • 01Componentes para mostrar resultados de LLM, incluidos Markdown, código, diagramas Mermaid y diferencias.
  • 02Puntos de entrada de interfaz para chat y dispositivos móviles, pensados para interfaces conversacionales.
  • 03Componentes de paneles, tablas de datos y formularios para consolas de administración.
  • 04Temas claros y oscuros, con cambio entre colores primarios y neutros.
  • 05Incluye paquetes de textos en inglés y chino simplificado.
  • 06Documentación disponible en formatos legibles por agentes, como skills.md y llms.txt.

Casos de uso

  • Crear una página de chat con una lista de mensajes y un cuadro de entrada para un asistente de IA.
  • Mostrar en una aplicación web contenido Markdown y código generado en streaming por un LLM.
  • Crear consolas de administración o tablas de datos junto con funciones de IA.
  • Añadir temas claros y oscuros a un producto React existente.

Inicio rápido

  1. 1

    Instala el paquete y sus peer dependencies con pnpm

    pnpm add @lobehub/ui @lobehub/icons @lobehub/fluent-emoji motion
  2. 2

    Importa el tema y el CSS de estilos, luego envuelve tu app en ConfigProvider y usa un componente como Button

Antes de usarlo

  • Requiere React 19 y solo admite el uso con ESM; además, hay que instalar varias peer dependencies.
  • Al actualizar desde 5.x, tendrás que dejar de usar Ant Design como parte de la migración a v6.

En colecciones

Chatbots de IA y clientes de chatFrameworks frontend y componentes de interfaz

Temas

#react#ui-components#design-system#chatbot#llm#typescript#aigc#antd#dumi#lobehub

Preguntas frecuentes

¿Qué es lobe-ui?
Biblioteca de componentes React para crear aplicaciones web de chat con IA y AIGC, con componentes de chat, Markdown, código y administración. Lobe UI es la biblioteca de componentes React que usa LobeHub, dirigida a desarrolladores que crean interfaces de chat con IA y aplicaciones web de AIGC. Incluye componentes para mostrar resultados de LLM, como Markdown, bloques de código, diagramas Mermaid, diferencias y vistas previas de HTML, además de puntos de entrada para chat y dispositivos móviles.
¿lobe-ui es gratuito? ¿Qué licencia tiene?
lobe-ui es open source bajo la licencia MIT. Revisa los términos de la licencia antes de usarlo en productos comerciales.
¿lobe-ui sigue mantenido?
Mantenimiento activo. El último commit de lobe-ui fue el 22 oct 2026.
¿Para qué puedo usar lobe-ui?
Crear una página de chat con una lista de mensajes y un cuadro de entrada para un asistente de IA. Mostrar en una aplicación web contenido Markdown y código generado en streaming por un LLM. Crear consolas de administración o tablas de datos junto con funciones de IA. Añadir temas claros y oscuros a un producto React existente.
¿Cómo se instala lobe-ui?
Instala el paquete y sus peer dependencies con pnpm: pnpm add @lobehub/ui @lobehub/icons @lobehub/fluent-emoji motion Importa el tema y el CSS de estilos, luego envuelve tu app en ConfigProvider y usa un componente como Button
¿Dónde consigo lobe-ui?
El código fuente y las instrucciones de instalación están en GitHub: https://github.com/lobehub/lobe-ui

Resumen generado por IA a partir del README del proyecto. Las estadísticas de GitHub se actualizan a diario.

Proyectos relacionados