Instalação

A 4UI é distribuída via registry compatível com o shadcn CLI. Você adiciona componentes sob demanda no seu projeto.

Pré-requisitos

  • Node.js 20+ (recomendado)
  • Projeto Angular configurado com Tailwind CSS v4
  • shadcn CLI

1) Inicialize o shadcn no projeto

Isso cria/atualiza o arquivo components.json que o CLI usa para saber onde instalar os arquivos.

npx shadcn@latest init

2) Configure o registry da 4UI

Adicione um registry no components.json apontando para a URL onde este registry está hospedado. Os arquivos públicos ficam em /registry.

{
  "registries": {
    "@4ui": "https://SEU-DOMINIO/registry/{name}.json"
  }
}

3) Instale o setup base (opcional)

Se você quiser aplicar os tokens base do registry, instale o recurso @4ui/init.

npx shadcn@latest add @4ui/init

4) Instale componentes sob demanda

Cada componente está disponível no namespace @4ui.

npx shadcn@latest add @4ui/button
npx shadcn@latest add @4ui/dialog
npx shadcn@latest add @4ui/tabs

Dica

Se você estiver rodando este registry localmente, a URL normalmente será algo como http://localhost:5173/registry.