Integração React

React é distribuído como source: a CLI shadcn copia o componente para a aplicação, instala suas dependências e preserva ds-tis/css como contrato visual.

Beta com canal versionado

O canal /registry/v1 mantém URLs previsíveis, mas a API React ainda pode receber ajustes compatíveis antes da promoção estável. @tis/react não é um pacote público.

1. Configure o namespace

Adicione o registry ao components.json do projeto:

{
  "registries": {
    "@tis": "https://tis-experience.github.io/ds-tis/registry/v1/{name}.json"
  }
}

2. Instale um componente

Escolha o item no catálogo de componentes e use seu comando de instalação. Exemplo com Button:

npm

npx shadcn@latest add @tis/button

pnpm

pnpm dlx shadcn@latest add @tis/button

yarn

yarn dlx shadcn@latest add @tis/button

bun

bunx --bun shadcn@latest add @tis/button

3. Carregue o visual do DS

Mantenha o import do DS antes de qualquer regra global:

@import "ds-tis/css";

Contrato de distribuição

• o source instalado é parte do código da aplicação e deve ser revisado;
• shadcn fornece estrutura de composição e distribui o source desta saída;
• Base UI fornece os primitives comportamentais quando necessários;
• HTML/CSS/JS e Ark/Zag são outras duas saídas coexistentes, com source, instalação e testes próprios;
• a matriz entre saídas mede paridade e não escolhe um provider vencedor;
• elementos nativos e composição React cobrem os casos simples;
• CSS, tokens e anatomia do DS TIS continuam canônicos;
• build, teclado, responsividade e Axe são validados em um consumer React/Vite.

Para consumo automatizado, consulte o guia para agents IA e o manifesto docs/api/consumer-context.json.