← Conceitos

Descoberta de tokens

"Descoberta de tokens" é como o SDK identifica o que precisa ser traduzido — automaticamente, a partir da forma como você escreve sua interface. Há quatro blocos de construção, cada um para um tipo de conteúdo.

t() — uma string inline

O carro-chefe. Chame-o com o texto de origem e ele retorna a tradução para o idioma atual (ou o próprio texto de origem, caso esse idioma ainda não esteja pronto). A categoria opcional agrupa frases relacionadas e é enviada ao tradutor automático como contexto; os parâmetros preenchem os {placeholders}.

const t = useT();

// t(phrase, category?, params?)
t('Hello, {name}!', 'Greetings', { name });

<Translate> — um bloco de conteúdo

Envolva uma região de markup e o SDK a transforma em tokens como um bloco de conteúdo — cada nó de texto vira uma frase — e então traduz o bloco inteiro novamente a cada mudança de idioma. Ele é identificado por um ID estável derivado do conteúdo e da categoria, de modo que o mesmo bloco é reconhecido entre renderizações e recarregamentos.

<Translate category="Home">
  <p>Welcome to our store. Browse the catalog in your language.</p>
</Translate>

<Phrase> — uma frase, com marcação

Quando uma frase contém marcação inline ou interpolação, <Phrase> a mantém como uma única unidade traduzível — assim, "Olá Sarah, você tem 3 itens" é traduzida como uma frase natural, e não como fragmentos soltos. Ele oferece suporte a parâmetros e pluralização.

<Phrase category="Cart" params={{ name: 'Sarah', count: 3 }}>
  Hi %name%, you have %count% items in your cart.
</Phrase>

<DontTranslate> — deixe como está

Nomes de marca, código, identificadores, endereços — marque uma região para nunca ser traduzida. Ela é renderizada como translate="no" e é ignorada completamente pela descoberta.

<p>Welcome! <DontTranslate>This sentence always stays in English.</DontTranslate> Thanks for visiting!</p>