flowbite

Flowbite es una biblioteca de componentes de UI y un framework de front-end de código abierto construido sobre Tailwind CSS. Su objetivo es acelerar el desarrollo de sitios web proporcionando un conjunto de componentes web ya listos que utilizan las clases de utilidad de Tailwind, para que los desarrolladores puedan ensamblar interfaces a partir de patrones existentes en lugar de escribir cada elemento desde cero. **Instalación y uso** La biblioteca se puede añadir como un plugin a un proyecto de Tailwind CSS existente a través de npm (`npm install flowbite`). La configuración documentada importa las variables de tema de Flowbite en el archivo CSS principal, registra el plugin, configura los archivos fuente dentro de node_modules y carga el JavaScript empaquetado que impulsa los elementos interactivos. En el README se hace referencia a varios temas integrados, incluyendo las variantes default, minimal, enterprise, playful y mono, cada una emparejada con una fuente web específica. También se describe una ruta de CDN para añadir rápidamente el CSS y JS minificados a una página. **Modelo de interacción** Los componentes interactivos se impulsan principalmente a través de una interfaz de atributos de datos: atributos como `data-modal-target` y `data-modal-toggle` vinculan los elementos activadores con los componentes sin necesidad de scripts personalizados, y la mayoría de los ejemplos de la documentación siguen esta estrategia. Para un mayor control, una función `initFlowbite()` (o ayudantes por categoría como `initDropdowns` e `initModals`) permite que frameworks como Vue y Nuxt registren los escuchadores de eventos por sí mismos. **APIs programáticas y tipadas** El paquete expone los componentes como clases de JavaScript que admiten tanto ESM como CJS. Un modal, por ejemplo, puede instanciarse con opciones que cubren la ubicación, el comportamiento del fondo y callbacks como `onShow`, `onHide` y `onToggle`. Se proporcionan declaraciones de tipos de TypeScript, incluyendo interfaces como `ModalOptions` y `ModalInterface`, para que los objetos de opciones y las instancias puedan estar tipados. **Catálogo de componentes** El README enumera una amplia gama de componentes, entre ellos alertas, insignias, migas de pan, botones y grupos de botones, tarjetas, menús desplegables, formularios, grupos de listas, tipografía, modales, pestañas, barras de navegación, paginación, líneas de tiempo, barras de progreso, tablas, notificaciones, tooltips, selectores de fecha, spinners, pies de página, acordeones, barras laterales, carruseles, avatares, calificaciones y una variedad de entradas de formulario (campo de entrada, entrada de archivo, entrada de búsqueda, select, textarea, checkbox, radio, toggle, deslizador de rango). **Soporte de frameworks y plataformas** Los componentes de Flowbite UI tienen soporte nativo para RTL, habilitado a través del atributo `dir="rtl"`. Existen bibliotecas independientes mantenidas por la comunidad para React, Vue, Svelte, Angular y Qwik. También se incluyen guías de integración para frameworks como Next.js, Remix, Nuxt, Astro, MeteorJS, Gatsby, SolidJS y Qwik, y para frameworks de back-end incluyendo Laravel, Symfony, Ruby on Rails 7, Phoenix (Elixir), Django y Flask, ya que la biblioteca depende de JavaScript vanilla. **Recursos relacionados** El proyecto remite a recursos adicionales dentro del mismo ecosistema: un sistema de diseño en Figma, secciones prefabricadas "Flowbite Blocks", un conjunto de iconos y un asistente GPT. Se ofrece una versión Pro comercial junto con el paquete de código abierto, y el repositorio enlaza a canales comunitarios como Discord y insignias de descarga/versión de npm. La licencia se indica como MIT.