synthesisui 0.16.435 → 0.16.436

package/dist/report-html.js

@@ -1,4 +1,12 @@
 import { FAMILY_SEAM_PREFIX } from "./fonts.js";
+/**
+ * A PÁGINA QUE O BOTÃO ABRE (dono, 19/09) - e ela SOMA ao passo a passo, nunca o substitui.
+ *
+ * Um endereço não é uma requisição: a página desenha inteira sem rede, e o navegador só o segue se
+ * a pessoa clicar. É por isso que ele convive com o auto-contido - e é por isso que os três
+ * comandos continuam escritos aqui dentro, para quem abrir o arquivo offline.
+ */
+const INSTALL_URL = "https://www.synthesisui.com/install";
 import { HALOGEN_TOKENS, HALOGEN_VERSION } from "./report-theme.js";
 import { semCor } from "./transcript.js";
 /**
@@ -143,9 +151,11 @@ function desenharPassos(passos) {
           </li>`)
         .join("\n");
     return `      <section class="chapter passos" style="--ordem:12">
-        <h2><span>How to install it, start to finish</span></h2>
-        <p class="callout">Three commands, in this order. Each one says what it does before it says what to type - a command without a stated consequence is somebody pasting into their terminal on faith.</p>
-        <a class="botao" href="#passo-1">Install SynthesisUI</a>
+        <div class="passos-topo">
+          <h2><span>How to install it, start to finish</span></h2>
+          <a class="botao" href="${INSTALL_URL}" target="_blank" rel="noreferrer">Open the install page</a>
+        </div>
+        <p class="callout">Three commands, in this order. Each one says what it does before it says what to type - a command without a stated consequence is somebody pasting into their terminal on faith. They are all here, so this works with no internet at all.</p>
         <ol class="lista-passos" id="passo-1">
 ${itens}
         </ol>
@@ -730,11 +740,20 @@ footer { margin-top: 40px; color: var(--ds-color-semantic-muted); font-size: 13p
   .lado { position: static; max-height: none; padding-bottom: 20px; }
 }
 
-/* O BOTAO: um alvo unico para quem leu a conta e decidiu. Ele leva para o primeiro passo DENTRO da
-   pagina - sair para a internet contradiria o arquivo que nao faz requisicao nenhuma. */
+/* O BOTAO: um alvo unico para quem leu a conta e decidiu, no topo direito do capitulo. Ele abre a
+   pagina publica de instalacao - e isso nao quebra o auto-contido, porque um endereco so e buscado
+   se a pessoa clicar. Os tres comandos seguem escritos aqui embaixo, para quem esta sem rede. */
+.passos-topo {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 16px;
+  flex-wrap: wrap;
+}
+.passos-topo h2 { margin-bottom: 0; }
 .botao {
   display: inline-block;
-  margin: 4px 0 20px;
+  margin: 0;
   padding: 12px 22px;
   border-radius: var(--ds-radius-lg, 12px);
   background: var(--ds-color-semantic-accent);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "synthesisui",
-  "version": "0.16.435",
+  "version": "0.16.436",
   "description": "Bring SynthesisUI design systems into any project - tokens, typed components, whole pages and an agent-ready CLAUDE.md manifest.",
   "type": "module",
   "bin": {