From 67c4ed5913024cf97c2ab2bb463a63dbc464f11a Mon Sep 17 00:00:00 2001
From: Ajay Ghanwat <ghanwat.ajay@workroot.in>
Date: Tue, 14 Jul 2026 00:40:11 +0530
Subject: [PATCH] docs: document reactive state attributes

---
 scripts/generate-docs.ts | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/scripts/generate-docs.ts b/scripts/generate-docs.ts
index 3bf405e0..a19f0a74 100644
--- a/scripts/generate-docs.ts
+++ b/scripts/generate-docs.ts
@@ -364,12 +364,18 @@ wrnexus build</code></pre><h2>Where things live</h2><ul><li><code>app/pages</cod
   view { <button @click="count++">{count}</button> }
   style { button { padding: 12px; } }
 }`)}</code></pre>
-    <h2 id="state">State and interpolation</h2><p>State is scoped to the nearest generated <code>data-scope</code>. Text expressions update reactively after hydration.</p><pre><code>${escape(`state count = 0
+    <h2 id="state">State and interpolation</h2><p>State is scoped to the nearest generated <code>data-scope</code>. Text and ordinary attribute expressions update reactively after hydration while retaining useful initial SSR values.</p><pre><code>${escape(`state count = 0
 state user = { name: "Ada" }
+state showPassword = false
 
 view {
   <p>Count: {count}</p>
   <p>{user.name}</p>
+  <input type="{showPassword ? 'text' : 'password'}">
+  <button @click="showPassword = !showPassword"
+          aria-label="{showPassword ? 'Hide password' : 'Show password'}">
+    Toggle password
+  </button>
 }`)}</code></pre>
     <h2 id="events">Events</h2><p>Any DOM event can use <code>@event="statement"</code>. The compiler emits <code>data-on-event</code>. The expression receives <code>event</code> and can mutate state.</p><div class="table-wrap"><table><thead><tr><th>Syntax</th><th>Purpose</th></tr></thead><tbody><tr><td><code>@click</code></td><td>Pointer or keyboard activation.</td></tr><tr><td><code>@input</code></td><td>Read live field values.</td></tr><tr><td><code>@change</code></td><td>React to committed field changes.</td></tr><tr><td><code>@submit</code></td><td>Handle form submission behavior.</td></tr><tr><td><code>@browser-click</code></td><td>Run only in a browser target.</td></tr><tr><td><code>@mobile-click</code></td><td>Run only in a native/mobile target.</td></tr></tbody></table></div><pre><code>${escape(`<input @input="name = event.target.value">
 <button @click="count++">Add</button>