Instalação

Configure seu projeto uma vez e instale qualquer componente via CLI ou manualmente.

Pré-requisitos

Certifique-se de ter as seguintes versões no seu projeto:

Node.jsv22+

Reactv19+

TypeScriptv5+

1. Tailwind CSS v4

Todos os componentes do hubkit usam Tailwind CSS v4. Adicione o import no seu arquivo CSS principal.

@import "tailwindcss";

Não é necessário tailwind.config.ts, o Tailwind v4 detecta as classes automaticamente. Consulte a documentação oficial para configurar com Vite, Next.js ou outro bundler.

2. Instalando componentes

Com o projeto configurado, você tem dois caminhos para adicionar componentes:

Via CLI (recomendado)

O hubkitlib instala o arquivo do componente e todas as dependências necessárias automaticamente.

npx hubkitlib add <component>

Manual

Acesse a página do componente, copie o código e instale as dependências listadas. A maioria usa clsx e tailwind-merge instale uma vez e reutilize em todos.

npm install clsx tailwind-merge

Pronto

Projeto configurado. Explore os componentes disponíveis e instale com um comando ou copie manualmente cada página mostra o comando CLI e as dependências específicas do componente.