@agent-native/core 0.79.26 → 0.80.0

package/docs/content/locales/pt-BR/mcp-apps.mdx

@@ -30,14 +30,70 @@ Em raras ocasiões, o alvo certo é uma rota de aplicativo focada que renderiza
 
 Não escreva à mão aplicativos HTML MCP simples e únicos para o produto UI; se a ação precisar de uma superfície personalizada, primeiro adicione ou reutilize uma rota/componente real do aplicativo e incorpore essa rota.
 
-```an-diagram title="MCP Aplicativo incorporado de ida e volta" summary="O destino do link da ação também é o destino incorporado. Hosts capazes carregam a mesma rota de aplicativo assinada em linha; todos os outros voltam para o link direto."
-{
-  "html": "<div class=\"diagram-embed\"><div class=\"diagram-card\" data-rough><strong>Action</strong><small class=\"diagram-muted\">`link` target = MCP App embed target</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-card\" data-rough><strong>embedApp()</strong><span class=\"diagram-pill accent\">create_embed_session</span><small class=\"diagram-muted\">mints short-lived embed session</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-card\" data-rough><strong>/_agent-native/embed/start</strong><small class=\"diagram-muted\">troca ticket SQL de uso único</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-card\" data-rough><strong>Signed app route</strong><span class=\"diagram-pill ok\">rota React real</span><small class=\"diagram-muted\">short-lived browser session</small></div><div class=\"diagram-fallback\"><span class=\"diagram-pill warn\">sem suporte a MCP Apps</span><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&darr;</div><div class=\"diagram-box\" data-rough>&quot;Open in … &rarr;&quot; deep link</div></div></div>",
-"css": ".diagram-embed{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.diagram-embed .diagram-card{display:flex;flex-direction:column;gap:6px;padding:14px 16px;min-width:140px}.diagram-embed .diagram-arrow{font-size:22px;line-height:1}.diagram-embed .diagram-fallback{display:flex;flex-direction:column;align-items:center;gap:6px;margin-inline-start:8px}"
-}
+<Diagram id="doc-block-13mdnqm" title="MCP Aplicativo incorporado de ida e volta" summary={"O destino do link da ação também é o destino incorporado. Hosts capazes carregam a mesma rota de aplicativo assinada em linha; todos os outros voltam para o link direto."}>
+
+```html
+<div class="diagram-embed">
+  <div class="diagram-card" data-rough>
+    <strong>Action</strong
+    ><small class="diagram-muted">`link` target = MCP App embed target</small>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-card" data-rough>
+    <strong>embedApp()</strong
+    ><span class="diagram-pill accent">create_embed_session</span
+    ><small class="diagram-muted">mints short-lived embed session</small>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-card" data-rough>
+    <strong>/_agent-native/embed/start</strong
+    ><small class="diagram-muted">troca ticket SQL de uso único</small>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-card" data-rough>
+    <strong>Signed app route</strong
+    ><span class="diagram-pill ok">rota React real</span
+    ><small class="diagram-muted">short-lived browser session</small>
+  </div>
+  <div class="diagram-fallback">
+    <span class="diagram-pill warn">sem suporte a MCP Apps</span>
+    <div class="diagram-arrow diagram-muted" aria-hidden="true">&darr;</div>
+    <div class="diagram-box" data-rough>
+      &quot;Open in … &rarr;&quot; deep link
+    </div>
+  </div>
+</div>
+```
 
+```css
+.diagram-embed {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  flex-wrap: wrap;
+}
+.diagram-embed .diagram-card {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  padding: 14px 16px;
+  min-width: 140px;
+}
+.diagram-embed .diagram-arrow {
+  font-size: 22px;
+  line-height: 1;
+}
+.diagram-embed .diagram-fallback {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 6px;
+  margin-inline-start: 8px;
+}
 ```
 
+</Diagram>
+
 ```ts
 import { embedApp } from "@agent-native/core";
 
@@ -93,14 +149,68 @@ Dentro dessas rotas `embedApp()`, `sendToAgentChat()` tem reconhecimento de inco
 
 As incorporações de aplicativos MCP são incorporações de rota, e não miniprodutos separados. `embedApp()` inicia a partir do destino `link` da ação, cria uma sessão de incorporação de curta duração e inicia a rota do aplicativo assinada. Os hosts de aplicativos MCP padrão podem navegar pelo próprio quadro do aplicativo MCP quando o host pode hidratar a rota diretamente.
 
-```an-diagram title="Dois caminhos de ponte de host, uma rota assinada" summary="Claude transplanta a via hidratada e utiliza a ui/_bridge direta; ChatGPT obtém um iframe controlado via window.openai e retransmite as ações do host por postMessage. Ambos apontam para a mesma rota de aplicativo assinada."
-{
-  "html": "<div class=\"diagram-bridge\"><div class=\"diagram-col\"><div class=\"diagram-card\" data-rough><strong>Claude web</strong><span class=\"diagram-pill accent\">single-frame transplant</span><small class=\"diagram-muted\">hidrata o HTML assinado do app no iframe do Claude, depois ponte direta do host `ui/_`</small></div><div class=\"diagram-card\" data-rough><strong>ChatGPT web</strong><span class=\"diagram-pill accent\">controlled route iframe</span><small class=\"diagram-muted\">`window.openai`host APIs ·`agentNative.mcpHost.*` postMessage relay</small></div></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-box\" data-rough>Same signed app route<br><small class=\"diagram-muted\">rota normal + componentes React</small></div></div>",
-"css": ".diagram-bridge{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.diagram-bridge .diagram-col{display:flex;flex-direction:column;gap:12px}.diagram-bridge .diagram-card{display:flex;flex-direction:column;gap:6px;padding:14px 16px;max-width:300px}.diagram-bridge .diagram-arrow{font-size:22px;line-height:1}.diagram-bridge .diagram-box{padding:16px 18px;text-align:center}"
-}
+<Diagram id="doc-block-14hyaa7" title="Dois caminhos de ponte de host, uma rota assinada" summary={"Claude transplanta a via hidratada e utiliza a ui/_bridge direta; ChatGPT obtém um iframe controlado via window.openai e retransmite as ações do host por postMessage. Ambos apontam para a mesma rota de aplicativo assinada."}>
+
+```html
+<div class="diagram-bridge">
+  <div class="diagram-col">
+    <div class="diagram-card" data-rough>
+      <strong>Claude web</strong
+      ><span class="diagram-pill accent">single-frame transplant</span
+      ><small class="diagram-muted"
+        >hidrata o HTML assinado do app no iframe do Claude, depois ponte direta
+        do host `ui/_`</small
+      >
+    </div>
+    <div class="diagram-card" data-rough>
+      <strong>ChatGPT web</strong
+      ><span class="diagram-pill accent">controlled route iframe</span
+      ><small class="diagram-muted"
+        >`window.openai`host APIs ·`agentNative.mcpHost.*` postMessage
+        relay</small
+      >
+    </div>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-box" data-rough>
+    Same signed app route<br /><small class="diagram-muted"
+      >rota normal + componentes React</small
+    >
+  </div>
+</div>
+```
 
+```css
+.diagram-bridge {
+  display: flex;
+  align-items: center;
+  gap: 14px;
+  flex-wrap: wrap;
+}
+.diagram-bridge .diagram-col {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+}
+.diagram-bridge .diagram-card {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  padding: 14px 16px;
+  max-width: 300px;
+}
+.diagram-bridge .diagram-arrow {
+  font-size: 22px;
+  line-height: 1;
+}
+.diagram-bridge .diagram-box {
+  padding: 16px 18px;
+  text-align: center;
+}
 ```
 
+</Diagram>
+
 Claude web usa um caminho de transplante de quadro único: o documento de recurso busca o aplicativo assinado HTML e o hidrata dentro do iframe do aplicativo MCP de Claude porque Claude não permite de forma confiável iframes filhos de propriedade do aplicativo ou navegação de quadro externo. A web ChatGPT obtém um iframe de rota controlada porque sua ponte de aplicativos nos fornece hosts `window.openai` estáveis ​​​​APIs e controle de altura limitado. Todos os caminhos apontam para a mesma rota de aplicativo assinada e renderizam a rota normal e os componentes React. Projete rotas incorporadas para que uma recarga com o mesmo URL assinado reconstrua a mesma visualização.
 
 Para `open_app({ embed: true })` do mesmo aplicativo, a estrutura cria o ticket de início incorporado durante a chamada da ferramenta original e armazena o URL de início assinado em metadados de ferramenta ocultos. actions personalizado pode retornar `embedStartUrl` para o mesmo caminho rápido; a camada MCP retira aquele URL com ticket do `structuredContent` visível ao modelo e dos metadados normais de link aberto. Quando não há URL de início incorporado, o recurso volta para o auxiliar `create_embed_session` somente de aplicativo. Isso mantém os hosts de produção que restringem as chamadas de ferramenta iniciadas por iframe na rota direta sem vazar URLs de sessão única do aplicativo na transcrição. Se um usuário reabrir um bate-papo antigo após a expiração de um ticket inicial único, a rota inicial retornará uma pequena página de atualização e postará `agentNative.embedSessionExpired` no wrapper; `embedApp()` limpa o início obsoleto URL e cria um novo ticket através de `create_embed_session` quando ainda tem a rota original do aplicativo.

package/docs/content/locales/pt-BR/mcp-clients.mdx

@@ -20,13 +20,82 @@ Você também pode [connect remote (HTTP) MCP servers at runtime](#remote-via-ui
 
 Cada fonte é resolvida em um **gerenciador MCP** de tempo de execução, e cada ferramenta que ela aprende chega ao registro de ferramentas do agente sob um prefixo `mcp__<server-id>__<tool>` à prova de colisão — pesquisável por intenção por meio de `tool-search`.
 
-```an-diagram title="Direção do cliente: muitas fontes, um registro de ferramenta" summary="Arquivos de configuração, env e UI de tempo de execução são mesclados no gerenciador MCP; suas ferramentas aparecem prefixadas e pesquisáveis ​​junto com as ações do seu aplicativo. Este é o espelho da direção do servidor."
-{
-  "html": "<div class=\"mcp-merge\"><div class=\"diagram-col sources\"><div class=\"diagram-box\" data-rough>Workspace <code>mcp.config.json</code><br><small class=\"diagram-muted\">compartilhado entre apps</small></div><div class=\"diagram-box\" data-rough>Raiz do app <code>mcp.config.json</code><br><small class=\"diagram-muted\">substituição por app</small></div><div class=\"diagram-box\" data-rough><code>MCP_SERVERS</code> env<br><small class=\"diagram-muted\">CI / produção</small></div><div class=\"diagram-box\" data-rough>Remoto pela UI de configurações<br><small class=\"diagram-muted\">personal &amp; org scope</small></div></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-panel center\" data-rough><span class=\"diagram-pill accent\">Gerenciador MCP</span><small class=\"diagram-muted\">merge &middot; hot-reload</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-col out\"><div class=\"diagram-node\">Ferramenta do agente registry<br><small class=\"diagram-muted\"><code>mcp__&lt;server-id&gt;__&lt;tool&gt;</code></small></div><div class=\"diagram-node\"><code>tool-search</code><br><small class=\"diagram-muted\">descobrir por intenção</small></div></div></div>",
-  "css": ".mcp-merge{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.mcp-merge .diagram-col{display:flex;flex-direction:column;gap:8px}.mcp-merge .center{display:flex;flex-direction:column;align-items:center;gap:4px}.mcp-merge .diagram-arrow{font-size:22px;line-height:1}.mcp-merge code{font-size:.85em}"
+<Diagram id="doc-block-1pkuuh" title={"Direção do cliente: muitas fontes, um registro de ferramenta"} summary={"Arquivos de configuração, env e UI de tempo de execução são mesclados no gerenciador MCP; suas ferramentas aparecem prefixadas e pesquisáveis ​​junto com as ações do seu aplicativo. Este é o espelho da direção do servidor."}>
+
+```html
+<div class="mcp-merge">
+  <div class="diagram-col sources">
+    <div class="diagram-box" data-rough>
+      Workspace <code>mcp.config.json</code><br /><small class="diagram-muted"
+        >compartilhado entre apps</small
+      >
+    </div>
+    <div class="diagram-box" data-rough>
+      Raiz do app <code>mcp.config.json</code><br /><small class="diagram-muted"
+        >substituição por app</small
+      >
+    </div>
+    <div class="diagram-box" data-rough>
+      <code>MCP_SERVERS</code> env<br /><small class="diagram-muted"
+        >CI / produção</small
+      >
+    </div>
+    <div class="diagram-box" data-rough>
+      Remoto pela UI de configurações<br /><small class="diagram-muted"
+        >personal &amp; org scope</small
+      >
+    </div>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-panel center" data-rough>
+    <span class="diagram-pill accent">Gerenciador MCP</span
+    ><small class="diagram-muted">merge &middot; hot-reload</small>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-col out">
+    <div class="diagram-node">
+      Ferramenta do agente registry<br /><small class="diagram-muted"
+        ><code>mcp__&lt;server-id&gt;__&lt;tool&gt;</code></small
+      >
+    </div>
+    <div class="diagram-node">
+      <code>tool-search</code><br /><small class="diagram-muted"
+        >descobrir por intenção</small
+      >
+    </div>
+  </div>
+</div>
+```
+
+```css
+.mcp-merge {
+  display: flex;
+  align-items: center;
+  gap: 14px;
+  flex-wrap: wrap;
+}
+.mcp-merge .diagram-col {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+.mcp-merge .center {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 4px;
+}
+.mcp-merge .diagram-arrow {
+  font-size: 22px;
+  line-height: 1;
+}
+.mcp-merge code {
+  font-size: 0.85em;
 }
 ```
 
+</Diagram>
+
 > A direção oposta - tornar _seu_ aplicativo um servidor MCP que outros hosts consomem - reside em [MCP Protocol](/docs/mcp-protocol) e [External Agents](/docs/external-agents).
 
 ## Navegador integrado e recursos de uso do computador {#built-in-capabilities}
@@ -216,13 +285,69 @@ Se seu espaço de trabalho executa vários aplicativos nativos de agente (por ex
 
 O Dispatch é o hub convencional: ele já coordena todos os aplicativos.
 
-```an-diagram title="Modelo de hub: um aplicativo atende servidores MCP de escopo organizacional" summary="Dispatch mantém os servidores MCP de escopo organizacional; aplicativos de consumo os extraem e mesclam como mcp__hub_<orgId>_<name>__*. Apenas as linhas do escopo organizacional são compartilhadas – as credenciais pessoais permanecem inalteradas."
-{
-  "html": "<div class=\"mcp-hub\"><div class=\"diagram-panel center\" data-rough><span class=\"diagram-pill accent\">Dispatch hub</span><small class=\"diagram-muted\">servidores MCP no escopo da organização</small><small class=\"diagram-muted\"><code>GET /mcp/hub/servers</code></small></div><div class=\"diagram-col arrows\"><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div></div><div class=\"diagram-col consumers\"><div class=\"diagram-box\" data-rough>Mail<br><small class=\"diagram-muted\"><code>mcp__hub_&lt;orgId&gt;_&lt;name&gt;__*</code></small></div><div class=\"diagram-box\" data-rough>Clips<br><small class=\"diagram-muted\">pull + merge a cada ~60 s</small></div></div></div><p class=\"diagram-muted note\">Bearer-gated by <code>AGENT_NATIVE_MCP_HUB_TOKEN</code>. Personal (user-scope) servers are never re-exposed.</p>",
-  "css": ".mcp-hub{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.mcp-hub .center{display:flex;flex-direction:column;align-items:center;gap:4px}.mcp-hub .diagram-col{display:flex;flex-direction:column;gap:10px}.mcp-hub .arrows .diagram-arrow{font-size:22px;line-height:1}.mcp-hub .note{margin:8px 0 0;font-size:.85em}.mcp-hub code{font-size:.85em}"
+<Diagram id="doc-block-u8qid6" title="Modelo de hub: um aplicativo atende servidores MCP de escopo organizacional" summary={"Dispatch mantém os servidores MCP de escopo organizacional; aplicativos de consumo os extraem e mesclam como mcp__hub_<orgId>_<name>__*. Apenas as linhas do escopo organizacional são compartilhadas – as credenciais pessoais permanecem inalteradas."}>
+
+```html
+<div class="mcp-hub">
+  <div class="diagram-panel center" data-rough>
+    <span class="diagram-pill accent">Dispatch hub</span
+    ><small class="diagram-muted">servidores MCP no escopo da organização</small
+    ><small class="diagram-muted"><code>GET /mcp/hub/servers</code></small>
+  </div>
+  <div class="diagram-col arrows">
+    <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+    <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  </div>
+  <div class="diagram-col consumers">
+    <div class="diagram-box" data-rough>
+      Mail<br /><small class="diagram-muted"
+        ><code>mcp__hub_&lt;orgId&gt;_&lt;name&gt;__*</code></small
+      >
+    </div>
+    <div class="diagram-box" data-rough>
+      Clips<br /><small class="diagram-muted">pull + merge a cada ~60 s</small>
+    </div>
+  </div>
+</div>
+<p class="diagram-muted note">
+  Bearer-gated by <code>AGENT_NATIVE_MCP_HUB_TOKEN</code>. Personal (user-scope)
+  servers are never re-exposed.
+</p>
+```
+
+```css
+.mcp-hub {
+  display: flex;
+  align-items: center;
+  gap: 14px;
+  flex-wrap: wrap;
+}
+.mcp-hub .center {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 4px;
+}
+.mcp-hub .diagram-col {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+}
+.mcp-hub .arrows .diagram-arrow {
+  font-size: 22px;
+  line-height: 1;
+}
+.mcp-hub .note {
+  margin: 8px 0 0;
+  font-size: 0.85em;
+}
+.mcp-hub code {
+  font-size: 0.85em;
 }
 ```
 
+</Diagram>
+
 Para novas configurações de espaço de trabalho, prefira **Enviar recursos MCP do espaço de trabalho** ao
 deseja o mesmo modelo de concessão para todos os aplicativos versus aplicativos selecionados usado pelo espaço de trabalho skills,
 instruções e recursos de referência. Adicione um recurso de espaço de trabalho com:

package/docs/content/locales/pt-BR/mcp-protocol.mdx

@@ -30,13 +30,61 @@ Conceitos principais:
 - **MCP remoto padrão OAuth** — descoberta OAuth 2.1, registro dinâmico de cliente, código de autorização + PKCE, rotação de token de atualização
 - **Bearer auth fallback** — usa `ACCESS_TOKEN`, `ACCESS_TOKENS` ou JWTs criados por conexão para clientes que não podem executar OAuth
 
-```an-diagram title="Seu aplicativo como um servidor MCP" summary="Hosts externos se conectam por Streamable HTTP. Cada ação é uma ferramenta; ask-agent delega para o loop completo do agente."
-{
-  "html": "<div class=\"diagram-mcp\"><div class=\"diagram-col\"><div class=\"diagram-node\">Claude</div><div class=\"diagram-node\">ChatGPT</div><div class=\"diagram-node\">Cursor · Codex</div></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-panel\"><span class=\"diagram-pill accent\">POST /_agent-native/mcp</span><small class=\"diagram-muted\">Streamable HTTP</small><small class=\"diagram-muted\">initialize &rarr; tools/list &rarr; tools/call</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-col\"><div class=\"diagram-box\" data-rough>each action<br><small class=\"diagram-muted\">= one tool</small></div><div class=\"diagram-box\" data-rough>ask-agent<br><small class=\"diagram-muted\">&rarr; full agent loop</small></div></div></div>",
-  "css": ".diagram-mcp{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.diagram-mcp .diagram-col{display:flex;flex-direction:column;gap:8px}.diagram-mcp .diagram-panel{display:flex;flex-direction:column;align-items:center;gap:4px}.diagram-mcp .diagram-arrow{font-size:20px;line-height:1}"
+<Diagram id="doc-block-1tzzedn" title="Seu aplicativo como um servidor MCP" summary={"Hosts externos se conectam por Streamable HTTP. Cada ação é uma ferramenta; ask-agent delega para o loop completo do agente."}>
+
+```html
+<div class="diagram-mcp">
+  <div class="diagram-col">
+    <div class="diagram-node">Claude</div>
+    <div class="diagram-node">ChatGPT</div>
+    <div class="diagram-node">Cursor · Codex</div>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-panel">
+    <span class="diagram-pill accent">POST /_agent-native/mcp</span
+    ><small class="diagram-muted">Streamable HTTP</small
+    ><small class="diagram-muted"
+      >initialize &rarr; tools/list &rarr; tools/call</small
+    >
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-col">
+    <div class="diagram-box" data-rough>
+      each action<br /><small class="diagram-muted">= one tool</small>
+    </div>
+    <div class="diagram-box" data-rough>
+      ask-agent<br /><small class="diagram-muted">&rarr; full agent loop</small>
+    </div>
+  </div>
+</div>
+```
+
+```css
+.diagram-mcp {
+  display: flex;
+  align-items: center;
+  gap: 16px;
+  flex-wrap: wrap;
+}
+.diagram-mcp .diagram-col {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+.diagram-mcp .diagram-panel {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 4px;
+}
+.diagram-mcp .diagram-arrow {
+  font-size: 20px;
+  line-height: 1;
 }
 ```
 
+</Diagram>
+
 ## MCP versus A2A {#mcp-vs-a2a}
 
 Ambos os protocolos são montados automaticamente. Use o que for mais adequado ao seu caso de uso:
@@ -205,13 +253,62 @@ Endpoints de descoberta:
 | `/_agent-native/mcp/oauth/authorize`      | Autorização + consentimento do navegador                   |
 | `/_agent-native/mcp/oauth/token`          | Concessões de código de autorização e token de atualização |
 
-```an-diagram title="Fluxo de descoberta OAuth" summary="Um 401 inicia a descoberta, o registro e uma autorização PKCE → troca de tokens. O token Bearer é vinculado ao público e tem escopo definido."
-{
-  "html": "<div class=\"diagram-oauth\"><div class=\"diagram-box\" data-rough>first request<br><small class=\"diagram-muted\">no token</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-pill warn\">401 · WWW-Authenticate</div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-panel\"><span class=\"diagram-pill\">/.well-known/oauth-protected-resource</span><span class=\"diagram-pill\">/.well-known/oauth-authorization-server</span><small class=\"diagram-muted\">discover</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-col\"><div class=\"diagram-pill\">register</div><div class=\"diagram-pill\">authorize (PKCE)</div><div class=\"diagram-pill\">token</div></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-box\" data-rough>Bearer access token<br><small class=\"diagram-muted\">vinculado à audiência · mcp:read / write / apps</small></div></div>",
-  "css": ".diagram-oauth{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.diagram-oauth .diagram-panel{display:flex;flex-direction:column;align-items:center;gap:4px}.diagram-oauth .diagram-col{display:flex;flex-direction:column;gap:6px}.diagram-oauth .diagram-arrow{font-size:20px;line-height:1}"
+<Diagram id="doc-block-yoa2u7" title="Fluxo de descoberta OAuth" summary={"Um 401 inicia a descoberta, o registro e uma autorização PKCE → troca de tokens. O token Bearer é vinculado ao público e tem escopo definido."}>
+
+```html
+<div class="diagram-oauth">
+  <div class="diagram-box" data-rough>
+    first request<br /><small class="diagram-muted">no token</small>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-pill warn">401 · WWW-Authenticate</div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-panel">
+    <span class="diagram-pill">/.well-known/oauth-protected-resource</span
+    ><span class="diagram-pill">/.well-known/oauth-authorization-server</span
+    ><small class="diagram-muted">discover</small>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-col">
+    <div class="diagram-pill">register</div>
+    <div class="diagram-pill">authorize (PKCE)</div>
+    <div class="diagram-pill">token</div>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-box" data-rough>
+    Bearer access token<br /><small class="diagram-muted"
+      >vinculado à audiência · mcp:read / write / apps</small
+    >
+  </div>
+</div>
+```
+
+```css
+.diagram-oauth {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  flex-wrap: wrap;
+}
+.diagram-oauth .diagram-panel {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 4px;
+}
+.diagram-oauth .diagram-col {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+}
+.diagram-oauth .diagram-arrow {
+  font-size: 20px;
+  line-height: 1;
 }
 ```
 
+</Diagram>
+
 Tokens de acesso são JWTs assinados cujo público é exatamente o recurso MCP URL. O servidor aceita apenas tokens emitidos para si mesmo e aplica escopos antes de listar/chamar ferramentas:
 
 | Escopo      | Permite                                             |

package/docs/content/locales/pt-BR/messaging.mdx

@@ -18,13 +18,52 @@ Conecte seu agente ao Slack, e-mail, Telegram ou WhatsApp para que você possa c
 - **Mesmo agente, mesma memória.** Tudo o que você contar no Slack será lembrado quando você enviar por e-mail mais tarde. O bate-papo na web e as mensagens externas compartilham um histórico de conversa.
 - Para alertas unidirecionais no aplicativo (ícone de sino, webhooks), consulte [Notifications](/docs/notifications).
 
-```an-diagram title="Muitos canais, um agente" summary="Cada plataforma segue o mesmo loop de agente e o mesmo histórico de thread SQL - então, um DM Slack e um e-mail continuam a mesma conversa."
-{
-  "html": "<div class=\"msg-fanin\"><div class=\"diagram-col\"><div class=\"diagram-node\">Slack</div><div class=\"diagram-node\">Email</div><div class=\"diagram-node\">Telegram</div><div class=\"diagram-node\">WhatsApp</div></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-panel center\" data-rough><span class=\"diagram-pill accent\">Um loop de agente</span><small class=\"diagram-muted\">mesma memória · mesmas ferramentas</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-box\" data-rough>Um histórico de thread SQL<br><small class=\"diagram-muted\">web chat + external messages share it</small></div></div>",
-  "css": ".msg-fanin{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.msg-fanin .diagram-col{display:flex;flex-direction:column;gap:8px}.msg-fanin .center{display:flex;flex-direction:column;align-items:center;gap:4px}"
+<Diagram id="doc-block-125omhz" title="Muitos canais, um agente" summary={"Cada plataforma segue o mesmo loop de agente e o mesmo histórico de thread SQL - então, um DM Slack e um e-mail continuam a mesma conversa."}>
+
+```html
+<div class="msg-fanin">
+  <div class="diagram-col">
+    <div class="diagram-node">Slack</div>
+    <div class="diagram-node">Email</div>
+    <div class="diagram-node">Telegram</div>
+    <div class="diagram-node">WhatsApp</div>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-panel center" data-rough>
+    <span class="diagram-pill accent">Um loop de agente</span
+    ><small class="diagram-muted">mesma memória · mesmas ferramentas</small>
+  </div>
+  <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+  <div class="diagram-box" data-rough>
+    Um histórico de thread SQL<br /><small class="diagram-muted"
+      >web chat + external messages share it</small
+    >
+  </div>
+</div>
+```
+
+```css
+.msg-fanin {
+  display: flex;
+  align-items: center;
+  gap: 14px;
+  flex-wrap: wrap;
+}
+.msg-fanin .diagram-col {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+.msg-fanin .center {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 4px;
 }
 ```
 
+</Diagram>
+
 ## Configurar Slack {#slack}
 
 ### O que você precisa
@@ -231,13 +270,81 @@ A plataforma de entrada webhooks usa um padrão de fila SQL de plataforma cruzad
 3. O endpoint do processador é executado em uma **nova execução de função** com seu próprio orçamento de tempo limite completo. Ele reivindica a tarefa atomicamente (`pending` → `processing` via `claimPendingTask`), executa o loop do agente, envia a resposta por meio do adaptador e marca a tarefa como `completed`.
 4. Um trabalho de repetição recorrente (`startPendingTasksRetryJob`, a cada 60s) varre tarefas presas em `pending` >90s ou `processing` >5min e reinicia o processador. Limitado a três tentativas e marcado como `failed`.
 
-```an-diagram title="Ciclo de vida do webhook de entrada" summary="O webhook apenas verifica, enfileira e retorna 200. Uma nova execução de função drena a fila e executa o loop do agente, com um trabalho de repetição de 60 anos como rede de segurança."
-{
-  "html": "<div class=\"msg-flow\"><div class=\"msg-row\"><div class=\"diagram-node\">Platform<br><small class=\"diagram-muted\">Slack · e-mail · etc.</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-box\" data-rough><strong>/webhook</strong><br><small class=\"diagram-muted\">verify signature + parse</small><br><span class=\"diagram-pill\">INSERT tarefa pendente</span></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-pill ok\">return 200</div></div><div class=\"msg-fire\"><span class=\"diagram-muted\">fire-and-forget</span> <span class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&darr;</span></div><div class=\"msg-row\"><div class=\"diagram-box\" data-rough><strong>/process-task</strong><br><small class=\"diagram-muted\">execução nova · timeout próprio</small></div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-pill accent\">claim</div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-pill accent\">agent loop</div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-pill accent\">adapter.sendResponse</div><div class=\"diagram-arrow diagram-muted\" aria-hidden=\"true\">&rarr;</div><div class=\"diagram-pill ok\">completed</div></div><div class=\"diagram-panel msg-retry\" data-rough><span class=\"diagram-pill warn\">every 60s</span> <span class=\"diagram-muted\">retry job sweeps stuck tasks (pending &gt;90s · processing &gt;5min) and re-fires /process-task &mdash; capped at 3 attempts, then <strong>failed</strong></span></div></div>",
-  "css": ".msg-flow{display:flex;flex-direction:column;gap:12px}.msg-flow .msg-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.msg-flow .msg-fire{display:flex;align-items:center;gap:8px;padding-inline-start:12px}.msg-flow .msg-retry{display:flex;align-items:center;gap:8px;flex-wrap:wrap}"
+<Diagram id="doc-block-od5wm4" title="Ciclo de vida do webhook de entrada" summary={"O webhook apenas verifica, enfileira e retorna 200. Uma nova execução de função drena a fila e executa o loop do agente, com um trabalho de repetição de 60 anos como rede de segurança."}>
+
+```html
+<div class="msg-flow">
+  <div class="msg-row">
+    <div class="diagram-node">
+      Platform<br /><small class="diagram-muted">Slack · e-mail · etc.</small>
+    </div>
+    <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+    <div class="diagram-box" data-rough>
+      <strong>/webhook</strong><br /><small class="diagram-muted"
+        >verify signature + parse</small
+      ><br /><span class="diagram-pill">INSERT tarefa pendente</span>
+    </div>
+    <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+    <div class="diagram-pill ok">return 200</div>
+  </div>
+  <div class="msg-fire">
+    <span class="diagram-muted">fire-and-forget</span>
+    <span class="diagram-arrow diagram-muted" aria-hidden="true">&darr;</span>
+  </div>
+  <div class="msg-row">
+    <div class="diagram-box" data-rough>
+      <strong>/process-task</strong><br /><small class="diagram-muted"
+        >execução nova · timeout próprio</small
+      >
+    </div>
+    <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+    <div class="diagram-pill accent">claim</div>
+    <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+    <div class="diagram-pill accent">agent loop</div>
+    <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+    <div class="diagram-pill accent">adapter.sendResponse</div>
+    <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
+    <div class="diagram-pill ok">completed</div>
+  </div>
+  <div class="diagram-panel msg-retry" data-rough>
+    <span class="diagram-pill warn">every 60s</span>
+    <span class="diagram-muted"
+      >retry job sweeps stuck tasks (pending &gt;90s · processing &gt;5min) and
+      re-fires /process-task &mdash; capped at 3 attempts, then
+      <strong>failed</strong></span
+    >
+  </div>
+</div>
+```
+
+```css
+.msg-flow {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+}
+.msg-flow .msg-row {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  flex-wrap: wrap;
+}
+.msg-flow .msg-fire {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding-inline-start: 12px;
+}
+.msg-flow .msg-retry {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  flex-wrap: wrap;
 }
 ```
 
+</Diagram>
+
 As conversas de entrada e saída vivem no mesmo thread SQL, então você pode continuar um DM Slack da web UI ou vice-versa.
 
 <Endpoint id="doc-block-1d4u8v9" method="POST" path="/_agent-native/integrations/slack/webhook" summary="Slack Eventos API webhook de entrada" auth={"HMAC-SHA256 of the raw body using `SLACK_SIGNING_SECRET`, checked against the `X-Slack-Signature` header. In production also gated by `SLACK_ALLOWED_TEAM_IDS` / `SLACK_ALLOWED_API_APP_IDS`."} params={[