feat: replace the ssr/client data blocks with apis blocks

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

examples/basic-app/app/pages/api-block-demo.wrn

@@ -3,8 +3,8 @@ page ApiBlockDemo {
   state found = ""
   state failed = ""
 
-  client {
-    api searchDirectory POST /api/directory {
+  apis {
+    searchDirectory POST /api/directory {
       request {
         body {
           name?: string

examples/basic-app/app/pages/hello.wrn

@@ -18,37 +18,32 @@ page Hello {
     canonical = "/hello"
   }
 
-  // SSR data bindings run on the server before the HTML is sent.
-  // The API itself lives in app/api/users/ssr.ts; this block only calls it
-  // and renders the response into HTML.
-  ssr {
-    functions {
-      function userNames(users) {
-        return users.map((user) => user.name).join(", ")
+  // API calls used by this page. `ssrUsers` is bound in the initial render
+  // (its endpoint lives in app/api/users/ssr.ts); `csrUsers` is bound after
+  // hydration in the browser (app/api/users/csr.ts). Both just call the same
+  // users endpoint shape, so the response handling looks the same.
+  apis {
+    ssrUsers GET /api/users/ssr {
+      response {
+        const visits = Number(cookies.get("hello_visits") ?? "0") + 1
+        cookies.set("hello_visits", String(visits), { sameSite: "Lax" })
+        session.set("lastHelloVisit", visits)
+        return `${userNames(data.users)} - visit ${visits}`
       }
     }
 
-    api ssrUsers GET /api/users/ssr {
-      const visits = Number(cookies.get("hello_visits") ?? "0") + 1
-      cookies.set("hello_visits", String(visits), { sameSite: "Lax" })
-      session.set("lastHelloVisit", visits)
-      return `${userNames(users)} - visit ${visits}`
+    csrUsers GET /api/users/csr {
+      response {
+        const label = localStorage.get("wrnexus.label") ?? "browser"
+        session.set("lastClientLabel", label)
+        return `${userNames(data.users)} - ${label}`
+      }
     }
   }
 
-  // Client data bindings hydrate after the first paint. The browser only sees
-  // an opaque data-wrnexus-csr id; WrNexus calls app/api/users/csr.ts on the server.
-  client {
-    functions {
-      function userNames(users) {
-        return users.map((user) => user.name).join(", ")
-      }
-    }
-
-    api csrUsers GET /api/users/csr {
-      const label = localStorage.get("wrnexus.label") ?? "browser"
-      session.set("lastClientLabel", label)
-      return `${userNames(users)} - ${label}`
+  functions {
+    shared function userNames(users) {
+      return users.map((user) => user.name).join(", ")
     }
   }