flowbite

Flowbite é uma biblioteca de componentes de UI de código aberto e um framework front-end construído sobre o Tailwind CSS. Seu objetivo é acelerar o desenvolvimento de websites fornecendo um conjunto de componentes web prontos que utilizam as classes de utilitário do Tailwind, permitindo que os desenvolvedores montem interfaces a partir de padrões existentes em vez de escrever cada elemento do zero. **Instalação e uso** A biblioteca pode ser adicionada como um plugin a um projeto Tailwind CSS existente via npm (`npm install flowbite`). A configuração documentada importa as variáveis de tema do Flowbite para o arquivo CSS principal, registra o plugin, configura os arquivos de origem dentro do node_modules e carrega o JavaScript empacotado que alimenta os elementos interativos. Vários temas integrados são referenciados no README, incluindo as variantes default, minimal, enterprise, playful e mono, cada uma combinada com uma fonte web específica. Uma rota CDN também é descrita para adicionar rapidamente o CSS e JS minificados a uma página. **Modelo de interação** Os componentes interativos são impulsionados principalmente por uma interface de atributos de dados: atributos como `data-modal-target` e `data-modal-toggle` conectam elementos de gatilho aos componentes sem a necessidade de scripts personalizados, e a maioria dos exemplos da documentação segue essa estratégia. Para maior controle, uma função `initFlowbite()` (ou helpers por categoria como `initDropdowns` e `initModals`) permite que frameworks como Vue e Nuxt registrem os ouvintes de eventos eles mesmos. **APIs programáticas e tipadas** O pacote expõe componentes como classes JavaScript suportando tanto ESM quanto CJS. Um modal, por exemplo, pode ser instanciado com opções que abrangem posicionamento, comportamento do backdrop e callbacks como `onShow`, `onHide` e `onToggle`. Declarações de tipo TypeScript são fornecidas, incluindo interfaces como `ModalOptions` e `ModalInterface`, para que objetos de opção e instâncias possam ser tipados. **Catálogo de componentes** O README lista uma ampla gama de componentes, entre eles alertas, badges, breadcrumbs, botões e grupos de botões, cards, dropdowns, formulários, grupos de listas, tipografia, modais, abas, navbars, paginação, timelines, barras de progresso, tabelas, toasts, tooltips, datepickers, spinners, footers, accordions, sidebars, carousels, avatars, ratings e uma variedade de entradas de formulário (campo de entrada, entrada de arquivo, entrada de pesquisa, select, textarea, checkbox, radio, toggle, range slider). **Suporte a frameworks e plataformas** Os componentes de UI do Flowbite possuem suporte nativo a RTL, habilitado através do atributo `dir="rtl"`. Existem bibliotecas independentes mantidas pela comunidade para React, Vue, Svelte, Angular e Qwik. Guias de integração também são vinculados para frameworks como Next.js, Remix, Nuxt, Astro, MeteorJS, Gatsby, SolidJS e Qwik, e para frameworks de back-end incluindo Laravel, Symfony, Ruby on Rails 7, Phoenix (Elixir), Django e Flask, já que a biblioteca depende de JavaScript vanilla. **Recursos relacionados** O projeto aponta para recursos adicionais em torno do mesmo ecossistema: um sistema de design no Figma, seções pré-fabricadas "Flowbite Blocks", um conjunto de ícones e um assistente GPT. Uma versão Pro comercial é oferecida juntamente com o pacote de código aberto, e o repositório vincula canais da comunidade, como Discord e badges de download/versão do npm. O licenciamento é declarado como MIT.