docs: expand full-width guides and package navigation

scripts/generate-docs.ts

@@ -352,6 +352,17 @@ const registry = createDevToolbarRegistry();`,
     .join("");
 }
 
+const packageNavigation = catalog
+  .map(([name]) => `<a href="/packages/${name}">@wrnexus/${name}</a>`)
+  .join("");
+const sectionNavigation = `<aside class="docs-section-menu" aria-label="Documentation sections"><nav>
+  <section><strong>Get started</strong><a href="/getting-started">Quick start</a><a href="/tutorial">Tutorial</a><a href="/guides/full-stack-auth-demo">Auth dashboard demo</a><a href="/guides/configuration-and-profiles">Configuration</a></section>
+  <section><strong>Build</strong><a href="/guides/pages-and-components">Pages and components</a><a href="/guides/routing">Routing</a><a href="/guides/server-data">Server data</a><a href="/guides/forms-and-validation">Forms and validation</a><a href="/guides/database">Database</a></section>
+  <section><strong>Auth and security</strong><a href="/guides/authentication">Authentication</a><a href="/guides/authorization">Authorization</a><a href="/guides/security">Application security</a><a href="/security">Security policy</a></section>
+  <section><strong>Reference</strong><a href="/packages">Packages overview</a><a href="/packages/cli">CLI</a><a href="/language">.wrn language</a><a href="https://component.wrnexusjs.dev/">Components</a><a href="/examples">Examples</a></section>
+  <section class="package-menu"><strong>Packages</strong>${packageNavigation}</section>
+</nav></aside>`;
+
 function shell(title: string, description: string, content: string, state = ""): string {
   const document = `page ${title.replace(/[^A-Za-z0-9]/g, "")} {
   seo {
@@ -405,7 +416,7 @@ writeFileSync(
   shell(
     "Packages",
     "Explore every WrNexus package, API, function, and copy-ready usage example.",
-    `<main class="page"><section class="hero compact"><span class="eyebrow">${catalog.length} focused packages</span><h1>Package reference</h1><p>Everything in the framework, organized by responsibility and documented from the published ${frameworkVersion} APIs.</p><input class="search" type="search" placeholder="Search packages, features, or categories…" @input="query = event.target.value" /></section><section class="category-filter" aria-label="Filter packages by category"><div class="category-row">${categoryButtons}</div><p>Showing <strong>{category}</strong> packages</p></section><section class="package-grid">${cards}</section></main>`,
+    `<main id="main" class="portal-main docs-layout docs-layout--navigation">${sectionNavigation}<div class="docs-reading-column"><nav class="breadcrumbs" aria-label="Breadcrumb"><a href="/">Home</a><span>/</span><span aria-current="page">Packages</span></nav><article class="documentation prose standalone package-index-document"><section class="doc-intro"><span class="eyebrow">${catalog.length} focused packages</span><h1>Package reference</h1><p>Everything in the framework, organized by responsibility and documented from the published ${frameworkVersion} APIs.</p><input class="search" type="search" placeholder="Search packages, features, or categories…" @input="query = event.target.value" /></section><section id="filter" class="category-filter" aria-label="Filter packages by category"><h2>Find a package</h2><div class="category-row">${categoryButtons}</div><p>Showing <strong>{category}</strong> packages</p></section><section id="catalog"><h2>All packages</h2><div class="package-grid">${cards}</div></section></article></div><aside class="on-this-page"><h2>On this page</h2><nav><a href="#filter">Find a package</a><a href="#catalog">All packages</a></nav></aside></main>`,
     '  state query = ""\n  state category = "All"\n',
   ),
 );
@@ -440,8 +451,8 @@ for (const [name, category, summary] of catalog) {
         `<a class="toc-level-${heading.level}" href="#${heading.id}">${escape(heading.title)}</a>`,
     )
     .join("");
-  const content = `<main class="portal-main docs-layout">
-      <article id="main" class="documentation prose standalone package-document"><nav class="breadcrumbs" aria-label="Breadcrumb"><a href="/">Home</a><span>/</span><a href="/packages">Packages</a><span>/</span><span aria-current="page">@wrnexus/${name}</span></nav><section class="doc-intro"><span class="eyebrow">${category} · Package reference</span><h1>@wrnexus/${name}</h1><p>${summary}</p><div class="doc-meta"><span>v${frameworkVersion}</span><span>Private registry</span><span>${category}</span></div><section id="access" class="access-callout"><h2>Install the package</h2><p>After WorkRoot approves private registry access, install the release-aligned package:</p><pre><code>bun add @wrnexus/${name}@${frameworkVersion}</code><button type="button" class="copy-button" aria-label="Copy installation command">Copy</button></pre><p><a href="/access">Request preview access</a>. Never put registry tokens in source control.</p></section></section><section id="guide">${guide.html}</section><section id="api" class="api"><h2>Complete TypeScript API</h2><p>Generated from the exact installed package declarations.</p><pre data-language="typescript"><code>${escape(types)}</code></pre></section><section id="examples" class="examples"><h2>Examples</h2><p>Copy-ready examples from the installed package documentation.</p><div class="example-grid">${examplesFrom(readme, name)}</div></section>${componentReference}</article>
+  const content = `<main id="main" class="portal-main docs-layout docs-layout--navigation">${sectionNavigation}<div class="docs-reading-column">
+      <article class="documentation prose standalone package-document"><nav class="breadcrumbs" aria-label="Breadcrumb"><a href="/">Home</a><span>/</span><a href="/packages">Packages</a><span>/</span><span aria-current="page">@wrnexus/${name}</span></nav><section class="doc-intro"><span class="eyebrow">${category} · Package reference</span><h1>@wrnexus/${name}</h1><p>${summary}</p><div class="doc-meta"><span>v${frameworkVersion}</span><span>Private registry</span><span>${category}</span></div><section id="access" class="access-callout"><h2>Install the package</h2><p>After WorkRoot approves private registry access, install the release-aligned package:</p><pre><code>bun add @wrnexus/${name}@${frameworkVersion}</code><button type="button" class="copy-button" aria-label="Copy installation command">Copy</button></pre><p><a href="/access">Request preview access</a>. Never put registry tokens in source control.</p></section></section><section id="guide">${guide.html}</section><section id="api" class="api"><h2>Complete TypeScript API</h2><p>Generated from the exact installed package declarations.</p><pre data-language="typescript"><code>${escape(types)}</code></pre></section><section id="examples" class="examples"><h2>Examples</h2><p>Copy-ready examples from the installed package documentation.</p><div class="example-grid">${examplesFrom(readme, name)}</div></section>${componentReference}</article></div>
       <aside class="on-this-page"><h2>On this page</h2><nav>${toc}</nav></aside>
     </main>`;
   writeFileSync(join(packagePages, `${name}.wrn`), shell(`@wrnexus/${name}`, summary, content));