@invisibleloop/pulse 0.1.36 → 0.1.37

package/docs/public/docs.css

@@ -1,5 +1,21 @@
 /* Pulse Documentation — Design System */
 
+.skip-link {
+  position: absolute;
+  top: -100%;
+  left: 1rem;
+  padding: .5rem 1rem;
+  background: var(--accent);
+  color: var(--accent-text);
+  font-weight: 600;
+  border-radius: 0 0 .375rem .375rem;
+  text-decoration: none;
+  z-index: 9999;
+}
+.skip-link:focus {
+  top: 0;
+}
+
 *,
 *::before,
 *::after {
@@ -16,7 +32,7 @@
   --border: #38383f;
   --border-subtle: #1a1a20;
   --text: #e2e2ea;
-  --muted: #9090a0;
+  --muted: ##3d3d38;
   --muted-2: #7e7e92;
   --accent: #c9b800;
   --accent-text: #0a0a0a;
@@ -171,7 +187,7 @@ a:hover {
   font-size: 0.95rem;
   font-weight: 500;
   color: #0a0a0a;
-  opacity: 0.55;
+  opacity: 0.7;
   margin-bottom: 1rem;
   letter-spacing: 0.01em;
 }
@@ -189,7 +205,6 @@ a:hover {
   padding: 0.3rem 0.85rem;
   margin-bottom: 2rem;
   letter-spacing: 0.06em;
-  text-transform: uppercase;
 }
 
 .hero h1 {
@@ -470,7 +485,6 @@ a:hover {
   line-height: 1.65;
 }
 
-
 /* ─── FAQ page ───────────────────────────────────────────────────────────────── */
 .faq-item {
   padding: 2rem 0;
@@ -571,6 +585,7 @@ a:hover {
   height: 2.5rem;
   background: #f0e642;
   flex-shrink: 0;
+  opacity: 0.3;
 }
 
 /* ─── How it works — black band ─────────────────────────────────────────────── */
@@ -653,6 +668,7 @@ a:hover {
   background: #f0e642;
   margin-top: 1.25rem;
   flex-shrink: 0;
+  opacity: 0.3;
 }
 
 /* ─── AI-first section ───────────────────────────────────────────────────────── */

package/docs/src/lib/layout.js

@@ -63,6 +63,7 @@ function prevNextBar(prev, next) {
 
 export function renderLayout({ currentHref, content, prev = null, next = null }) {
   return `
+    <a href="#main-content" class="skip-link">Skip to main content</a>
     <div class="sidebar-overlay" aria-hidden="true"></div>
     ${sidebar(currentHref)}
     <div class="docs-main">
@@ -77,14 +78,14 @@ export function renderLayout({ currentHref, content, prev = null, next = null })
             <path d="M13 2L4.5 13.5H11L10 22L19.5 10.5H13L13 2Z" fill="var(--accent)" stroke="var(--accent)" stroke-width="1" stroke-linejoin="round"/>
           </svg>
         </a>
-        <a href="https://github.com/invisibleloop/pulse-framework" class="header-github" aria-label="View on GitHub" target="_blank" rel="noopener noreferrer">
+        <a href="https://github.com/invisibleloop/pulse-framework" class="header-github" aria-label="View on GitHub (opens in new tab)" target="_blank" rel="noopener noreferrer">
           <svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
             <path d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"/>
           </svg>
           GitHub
         </a>
       </header>
-      <main class="docs-content">
+      <main class="docs-content" id="main-content">
         ${content}
         ${prevNextBar(prev, next)}
       </main>
@@ -119,12 +120,13 @@ export function codeBlock(highlighted, filename = '') {
   return `${header}<pre class="code-block"><code>${highlighted}</code></pre>`
 }
 
-export function table(headers, rows) {
+export function table(headers, rows, caption = '') {
+  const cap = caption ? `<caption>${esc(caption)}</caption>` : ''
   const ths = headers.map(h => `<th scope="col">${h}</th>`).join('')
   const trs = rows.map(row =>
     `<tr>${row.map(cell => `<td>${cell}</td>`).join('')}</tr>`
   ).join('')
-  return `<div class="table-wrap"><table><thead><tr>${ths}</tr></thead><tbody>${trs}</tbody></table></div>`
+  return `<div class="table-wrap"><table>${cap}<thead><tr>${ths}</tr></thead><tbody>${trs}</tbody></table></div>`
 }
 
 export function callout(type, content) {

package/docs/src/pages/actions.js

@@ -156,7 +156,7 @@ onError: (state, err) => ({
 }),`, 'js'))}
       <p><code>_toast</code> works in <code>onStart</code>, <code>onSuccess</code>, and <code>onError</code>, and also in mutations. The toast container is injected into <code>document.body</code> once and survives client-side navigations.</p>
       ${table(
-        ['Option', 'Type', 'Default', ''],
+        ['Option', 'Type', 'Default', 'Description'],
         [
           ['<code>message</code>', 'string', '—', 'Required. The notification text.'],
           ['<code>variant</code>', '<code>success | error | warning | info</code>', '<code>info</code>', ''],

package/docs/src/pages/constraints.js

@@ -45,7 +45,7 @@ export default {
 
       ${section('vs-validation', 'Constraints vs Validation')}
       ${table(
-        ['', 'Constraints', 'Validation'],
+        ['Aspect', 'Constraints', 'Validation'],
         [
           ['When it runs', 'After <strong>every</strong> mutation, automatically', 'Only when an action has <code>validate: true</code>'],
           ['What it does', 'Clamps numeric values silently', 'Rejects the action and surfaces errors'],

package/docs/src/pages/getting-started.js

@@ -22,8 +22,8 @@ export default {
 
       ${section('requirements', 'Requirements')}
       <ul>
-        <li><strong>Node.js 22 or later</strong> — <a href="https://nodejs.org" target="_blank" rel="noopener">nodejs.org</a></li>
-        <li><strong>Claude Code</strong> — the CLI for Claude, installed and authenticated — <a href="https://docs.anthropic.com/en/docs/claude-code/getting-started" target="_blank" rel="noopener">installation guide</a></li>
+        <li><strong>Node.js 22 or later</strong> — <a href="https://nodejs.org" target="_blank" rel="noopener" aria-label="nodejs.org (opens in new tab)">nodejs.org</a></li>
+        <li><strong>Claude Code</strong> — the CLI for Claude, installed and authenticated — <a href="https://docs.anthropic.com/en/docs/claude-code/getting-started" target="_blank" rel="noopener" aria-label="Claude Code installation guide (opens in new tab)">installation guide</a></li>
       </ul>
       <p>Claude Code provides the <code>claude</code> command. Pulse launches it automatically with the Pulse MCP server wired in — so the agent has instant access to the framework reference, your project structure, and all Pulse tools without any manual configuration.</p>
       ${callout('note', 'GitHub Copilot integration is coming soon. For now, Pulse works exclusively with Claude Code.')}

package/docs/src/pages/home.js

@@ -55,7 +55,7 @@ export default {
         </a>
         <div class="home-nav-links">
           <a href="/getting-started">Docs</a>
-          <a href="https://github.com/invisibleloop/pulse-framework" target="_blank" rel="noopener">GitHub</a>
+          <a href="https://github.com/invisibleloop/pulse-framework" target="_blank" rel="noopener" aria-label="GitHub (opens in new tab)">GitHub</a>
         </div>
       </nav>
 
@@ -398,7 +398,7 @@ export default {
 
       </main>
       <footer class="home-footer">
-        <p>MIT License · <a href="https://github.com/invisibleloop/pulse-framework" target="_blank" rel="noopener">GitHub</a> · <a href="/getting-started">Get started in 2 minutes</a></p>
+        <p>MIT License · <a href="https://github.com/invisibleloop/pulse-framework" target="_blank" rel="noopener" aria-label="GitHub (opens in new tab)">GitHub</a> · <a href="/getting-started">Get started in 2 minutes</a></p>
       </footer>
     </div>
   `,

package/docs/src/pages/meta.js

@@ -68,7 +68,7 @@ export default {
       ${callout('tip', 'Use an absolute URL for <code>ogImage</code> — social media crawlers need the full URL to fetch the image. Recommended size: 1200×630 pixels.')}
 
       ${section('structured-data', 'Structured data (ld+json)')}
-      <p>The <code>schema</code> field accepts a plain object conforming to <a href="https://schema.org" target="_blank" rel="noopener">schema.org</a> vocabulary. Pulse serialises it as a <code>&lt;script type="application/ld+json"&gt;</code> tag in the head:</p>
+      <p>The <code>schema</code> field accepts a plain object conforming to <a href="https://schema.org" target="_blank" rel="noopener" aria-label="schema.org (opens in new tab)">schema.org</a> vocabulary. Pulse serialises it as a <code>&lt;script type="application/ld+json"&gt;</code> tag in the head:</p>
       ${codeBlock(highlight(`meta: {
   title: 'How to make sourdough — My Blog',
   schema: {

package/docs/src/pages/server-api.js

@@ -230,7 +230,7 @@ Cross-Origin-Resource-Policy: same-origin`, 'bash'))}
       ${section('hsts', 'HSTS')}
       <p>When a request arrives with <code>x-forwarded-proto: https</code> (or over a TLS socket), Pulse adds:</p>
       ${codeBlock(highlight(`Strict-Transport-Security: max-age=31536000; includeSubDomains; preload`, 'bash'))}
-      <p>This is automatic — no configuration required. On plain HTTP the header is omitted. The <code>preload</code> directive means you can submit the domain to <a href="https://hstspreload.org" target="_blank" rel="noopener">hstspreload.org</a> so browsers enforce HTTPS before the first connection — this is a separate manual step, not automatic.</p>
+      <p>This is automatic — no configuration required. On plain HTTP the header is omitted. The <code>preload</code> directive means you can submit the domain to <a href="https://hstspreload.org" target="_blank" rel="noopener" aria-label="hstspreload.org (opens in new tab)">hstspreload.org</a> so browsers enforce HTTPS before the first connection — this is a separate manual step, not automatic.</p>
 
       ${section('cookies', 'Cookie defaults')}
       <p>Cookies set via <code>ctx.setCookie()</code> default to <code>SameSite=Lax</code>. CSRF protection is on by default — omitting a <code>sameSite</code> option does not weaken it.</p>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@invisibleloop/pulse",
-  "version": "0.1.36",
+  "version": "0.1.37",
   "type": "module",
   "description": "AI-first frontend framework. The spec is the source of truth.",
   "license": "MIT",

package/public/.pulse-ui-version

@@ -1 +1 @@
-0.1.36
+0.1.37