Neba UI
Uma biblioteca de componentes React para montar interfaces de aplicação. Botões, campos, menus, caixas de diálogo, tabelas e gráficos partilham o mesmo conjunto de propriedades, chegam acessíveis e acompanham o modo escuro sem ficheiro de tema.
Sobre este projeto
O Neba UI é uma biblioteca de componentes React para construir interfaces de aplicação. Traz as peças de que um produto real precisa — botões e campos de formulário, menus e caixas de diálogo, tabelas e separadores, gráficos, progresso e notificações — já com estilo, já acessíveis e já de acordo umas com as outras, de modo que um ecrã se monta em vez de ser desenhado uma segunda vez. Traz também aquilo de que a interface de um agente de IA precisa — um campo de prompt, texto em streaming, chamadas a ferramentas, pedidos de aprovação, um painel de raciocínio e uma lista de passos — e um renderizador A2UI em neba/a2ui transforma em componentes Neba o ecrã que um agente descreve em JSON.
Todos os componentes bebem do mesmo vocabulário. Size, color, variant, density e elevation significam o mesmo em qualquer lado, por isso um controlo médio tem a mesma altura em qualquer componente e a cor primária é a mesma cor em todos. Papéis, etiquetas, gestão do foco e uso pelo teclado vivem dentro dos componentes em vez de serem aparafusados depois, e o modo escuro segue o sistema sem se escrever nada. O seu aspeto é uma linguagem de desenho e não um ficheiro de tema: uma superfície translúcida com um bordo finíssimo, uma única assinatura de movimento e sombras que têm de ser pedidas.
A instalação é um pacote e uma linha de CSS. Não há provider na raiz, nem objeto de tema para montar, nem ficheiro de configuração. O pacote é apenas ESM, traz declarações de TypeScript e permite tree shaking a sério — cada componente compila para o seu próprio módulo, pelo que importar um botão custa mais ou menos aquilo que um botão custa. Corre em React 18 ou 19 com duas dependências de execução; o renderizador A2UI traz três dependências de par opcionais próprias, que um projeto que não o importe nunca chega a resolver. Cada componente está documentado com pré-visualizações vivas em vez de capturas de ecrã.
Funcionalidades
Site de documentação
Tipos de TypeScript
Vários idiomas
Verificado por testes
Acessível de origem
Modo escuro
Permite tree shaking
