fix(compiler): preserve server-only component props during hydration

bun.lock

@@ -320,7 +320,7 @@
     },
     "packages/compiler": {
       "name": "@wrnexus/compiler",
-      "version": "0.8.24",
+      "version": "0.8.25",
       "dependencies": {
         "@wrnexus/csr": "workspace:*",
         "@wrnexus/store": "workspace:*",

packages/compiler/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wrnexus/compiler",
-  "version": "0.8.24",
+  "version": "0.8.25",
   "type": "module",
   "main": "src/index.ts",
   "exports": {

packages/compiler/src/codegen.ts

@@ -3196,7 +3196,7 @@ function __wrnProp(v: unknown): string {
 function renderPageComponentAttr(
   attr: Attr,
   dynamicExpressions: string[],
-  _reactive: PageReactive | null,
+  reactive: PageReactive | null,
 ): string {
   if (attr.event) {
     return ` ${componentEventAttribute(attr.name)}="${attrEscape(attr.value)}"`;
@@ -3215,6 +3215,13 @@ function renderPageComponentAttr(
   dynamicExpressions.push(`\${__wrnexusPropAttr(${expression})}`);
 
   const marker = `\x00WRNEACH${dynamicExpressions.length - 1}\x00`;
+  if (
+    reactive &&
+    exprRefsState(expression, reactive.runtimeStateNames) &&
+    !exprRefsState(expression, reactive.stateNames)
+  ) {
+    return ` ${attr.name}="${marker}"`;
+  }
   // The mount disappears during SSR. Preserve every dynamic component prop
   // as a parent-owned binding; server-only expressions simply fail closed in
   // the browser, while page state can continue driving the mounted child.

packages/compiler/test/server-load-attributes.test.ts

@@ -3,10 +3,12 @@ import { generate, parse } from "../src/index.ts";
 
 test("server-only loader data renders native input attributes without client state", async () => {
   const code = generate(
-    parse(`page Profile {
+    parse(`import UserSelect from "./UserSelect.wrn"
+page Profile {
     load server account { return {} }
     view {
       <h1>{account.name}</h1>
+      <UserSelect value="{account.name}" options="{account.items}" />
       {#if account.readonly}<p>Read only</p>{:else}<p>Editable</p>{/if}
       {#each account.items as item}<strong>{item}</strong>{/each}
       <input value="{account.name}" readonly="{account.readonly}" />
@@ -34,6 +36,7 @@ test("server-only loader data renders native input attributes without client sta
   expect(html).toContain('<option value="dark" selected>Dark</option>');
   expect(html).toContain('identity="{&quot;name&quot;:&quot;Alice&quot;}"');
   expect(html).not.toContain("data-wrn-bind");
+  expect(html).not.toContain("data-wrn-prop-bind");
   expect(html).not.toContain("{account.");
   expect(html).toContain("<h1>A &quot;&lt;User&gt;&quot;</h1>");
   expect(html).toContain("<p>Editable</p>");