rwsdk 1.0.0-beta.42 → 1.0.0-beta.43

package/dist/runtime/client/client.d.ts

@@ -13,7 +13,11 @@ export declare const fetchTransport: Transport;
  * making the page interactive. Call this from your client entry point.
  *
  * @param transport - Custom transport for server communication (defaults to fetchTransport)
- * @param hydrateRootOptions - Options passed to React's hydrateRoot
+ * @param hydrateRootOptions - Options passed to React's `hydrateRoot`. Supports all React hydration options including:
+ *                             - `onUncaughtError`: Handler for uncaught errors (async errors, event handler errors).
+ *                               If not provided, defaults to logging errors to console.
+ *                             - `onCaughtError`: Handler for errors caught by error boundaries
+ *                             - `onRecoverableError`: Handler for recoverable errors
  * @param handleResponse - Custom response handler for navigation errors (navigation GETs)
  * @param onHydrationUpdate - Callback invoked after a new RSC payload has been committed on the client
  * @param onActionResponse - Optional hook invoked when an action returns a Response;
@@ -34,6 +38,23 @@ export declare const fetchTransport: Transport;
  * initClient({ handleResponse });
  *
  * @example
+ * // With error handling
+ * initClient({
+ *   hydrateRootOptions: {
+ *     onUncaughtError: (error, errorInfo) => {
+ *       console.error("Uncaught error:", error);
+ *       // Send to monitoring service
+ *       sendToSentry(error, errorInfo);
+ *     },
+ *     onCaughtError: (error, errorInfo) => {
+ *       console.error("Caught error:", error);
+ *       // Handle errors from error boundaries
+ *       sendToSentry(error, errorInfo);
+ *     },
+ *   },
+ * });
+ *
+ * @example
  * // With custom React hydration options
  * initClient({
  *   hydrateRootOptions: {

package/dist/runtime/client/client.js

@@ -105,7 +105,11 @@ export const fetchTransport = (transportContext) => {
  * making the page interactive. Call this from your client entry point.
  *
  * @param transport - Custom transport for server communication (defaults to fetchTransport)
- * @param hydrateRootOptions - Options passed to React's hydrateRoot
+ * @param hydrateRootOptions - Options passed to React's `hydrateRoot`. Supports all React hydration options including:
+ *                             - `onUncaughtError`: Handler for uncaught errors (async errors, event handler errors).
+ *                               If not provided, defaults to logging errors to console.
+ *                             - `onCaughtError`: Handler for errors caught by error boundaries
+ *                             - `onRecoverableError`: Handler for recoverable errors
  * @param handleResponse - Custom response handler for navigation errors (navigation GETs)
  * @param onHydrationUpdate - Callback invoked after a new RSC payload has been committed on the client
  * @param onActionResponse - Optional hook invoked when an action returns a Response;
@@ -126,6 +130,23 @@ export const fetchTransport = (transportContext) => {
  * initClient({ handleResponse });
  *
  * @example
+ * // With error handling
+ * initClient({
+ *   hydrateRootOptions: {
+ *     onUncaughtError: (error, errorInfo) => {
+ *       console.error("Uncaught error:", error);
+ *       // Send to monitoring service
+ *       sendToSentry(error, errorInfo);
+ *     },
+ *     onCaughtError: (error, errorInfo) => {
+ *       console.error("Caught error:", error);
+ *       // Handle errors from error boundaries
+ *       sendToSentry(error, errorInfo);
+ *     },
+ *   },
+ * });
+ *
+ * @example
  * // With custom React hydration options
  * initClient({
  *   hydrateRootOptions: {

package/dist/use-synced-state/SyncedStateServer.d.mts

@@ -1,17 +1,32 @@
 import { RpcStub } from "capnweb";
 import { DurableObject } from "cloudflare:workers";
+import type { RequestInfo } from "../runtime/requestInfo/types";
 export type SyncedStateValue = unknown;
-type OnSetHandler = (key: string, value: SyncedStateValue) => void;
-type OnGetHandler = (key: string, value: SyncedStateValue | undefined) => void;
+type OnSetHandler = (key: string, value: SyncedStateValue, stub: DurableObjectStub<SyncedStateServer>) => void;
+type OnGetHandler = (key: string, value: SyncedStateValue | undefined, stub: DurableObjectStub<SyncedStateServer>) => void;
+type OnKeyHandler = (key: string, stub: DurableObjectStub<SyncedStateServer>) => Promise<string>;
+type OnRoomHandler = (roomId: string | undefined, requestInfo: RequestInfo | null) => Promise<string>;
+type OnSubscribeHandler = (key: string, stub: DurableObjectStub<SyncedStateServer>) => void;
+type OnUnsubscribeHandler = (key: string, stub: DurableObjectStub<SyncedStateServer>) => void;
 /**
  * Durable Object that keeps shared state for multiple clients and notifies subscribers.
  */
 export declare class SyncedStateServer extends DurableObject {
     #private;
-    static registerKeyHandler(handler: (key: string) => Promise<string>): void;
-    static getKeyHandler(): ((key: string) => Promise<string>) | null;
+    static registerKeyHandler(handler: OnKeyHandler | null): void;
+    static getKeyHandler(): OnKeyHandler | null;
+    static registerRoomHandler(handler: OnRoomHandler | null): void;
+    static getRoomHandler(): OnRoomHandler | null;
+    static registerNamespace(namespace: DurableObjectNamespace<SyncedStateServer>, durableObjectName?: string): void;
+    static getNamespace(): DurableObjectNamespace<SyncedStateServer> | null;
+    static getDurableObjectName(): string;
+    setStub(stub: DurableObjectStub<SyncedStateServer>): void;
     static registerSetStateHandler(handler: OnSetHandler | null): void;
     static registerGetStateHandler(handler: OnGetHandler | null): void;
+    static registerSubscribeHandler(handler: OnSubscribeHandler | null): void;
+    static registerUnsubscribeHandler(handler: OnUnsubscribeHandler | null): void;
+    static getSubscribeHandler(): OnSubscribeHandler | null;
+    static getUnsubscribeHandler(): OnUnsubscribeHandler | null;
     getState(key: string): SyncedStateValue;
     setState(value: SyncedStateValue, key: string): void;
     subscribe(key: string, client: RpcStub<(value: SyncedStateValue) => void>): void;

package/dist/use-synced-state/SyncedStateServer.mjs

@@ -9,7 +9,7 @@ var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (
     if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
     return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
 };
-var _a, _SyncedStateServer_keyHandler, _SyncedStateServer_setStateHandler, _SyncedStateServer_getStateHandler, _SyncedStateServer_stateStore, _SyncedStateServer_subscriptions, _SyncedStateServer_subscriptionRefs, _CoordinatorApi_coordinator;
+var _SyncedStateServer_instances, _a, _SyncedStateServer_keyHandler, _SyncedStateServer_roomHandler, _SyncedStateServer_setStateHandler, _SyncedStateServer_getStateHandler, _SyncedStateServer_subscribeHandler, _SyncedStateServer_unsubscribeHandler, _SyncedStateServer_namespace, _SyncedStateServer_durableObjectName, _SyncedStateServer_stub, _SyncedStateServer_stateStore, _SyncedStateServer_subscriptions, _SyncedStateServer_subscriptionRefs, _SyncedStateServer_getStubForHandlers, _CoordinatorApi_coordinator, _CoordinatorApi_stub;
 import { RpcTarget, newWorkersRpcResponse } from "capnweb";
 import { DurableObject } from "cloudflare:workers";
 /**
@@ -18,6 +18,8 @@ import { DurableObject } from "cloudflare:workers";
 export class SyncedStateServer extends DurableObject {
     constructor() {
         super(...arguments);
+        _SyncedStateServer_instances.add(this);
+        _SyncedStateServer_stub.set(this, null);
         _SyncedStateServer_stateStore.set(this, new Map());
         _SyncedStateServer_subscriptions.set(this, new Map());
         _SyncedStateServer_subscriptionRefs.set(this, new Map());
@@ -28,23 +30,62 @@ export class SyncedStateServer extends DurableObject {
     static getKeyHandler() {
         return __classPrivateFieldGet(_a, _a, "f", _SyncedStateServer_keyHandler);
     }
+    static registerRoomHandler(handler) {
+        __classPrivateFieldSet(_a, _a, handler, "f", _SyncedStateServer_roomHandler);
+    }
+    static getRoomHandler() {
+        return __classPrivateFieldGet(_a, _a, "f", _SyncedStateServer_roomHandler);
+    }
+    static registerNamespace(namespace, durableObjectName) {
+        __classPrivateFieldSet(_a, _a, namespace, "f", _SyncedStateServer_namespace);
+        if (durableObjectName) {
+            __classPrivateFieldSet(_a, _a, durableObjectName, "f", _SyncedStateServer_durableObjectName);
+        }
+    }
+    static getNamespace() {
+        return __classPrivateFieldGet(_a, _a, "f", _SyncedStateServer_namespace);
+    }
+    static getDurableObjectName() {
+        return __classPrivateFieldGet(_a, _a, "f", _SyncedStateServer_durableObjectName);
+    }
+    setStub(stub) {
+        __classPrivateFieldSet(this, _SyncedStateServer_stub, stub, "f");
+    }
     static registerSetStateHandler(handler) {
         __classPrivateFieldSet(_a, _a, handler, "f", _SyncedStateServer_setStateHandler);
     }
     static registerGetStateHandler(handler) {
         __classPrivateFieldSet(_a, _a, handler, "f", _SyncedStateServer_getStateHandler);
     }
+    static registerSubscribeHandler(handler) {
+        __classPrivateFieldSet(_a, _a, handler, "f", _SyncedStateServer_subscribeHandler);
+    }
+    static registerUnsubscribeHandler(handler) {
+        __classPrivateFieldSet(_a, _a, handler, "f", _SyncedStateServer_unsubscribeHandler);
+    }
+    static getSubscribeHandler() {
+        return __classPrivateFieldGet(_a, _a, "f", _SyncedStateServer_subscribeHandler);
+    }
+    static getUnsubscribeHandler() {
+        return __classPrivateFieldGet(_a, _a, "f", _SyncedStateServer_unsubscribeHandler);
+    }
     getState(key) {
         const value = __classPrivateFieldGet(this, _SyncedStateServer_stateStore, "f").get(key);
         if (__classPrivateFieldGet(_a, _a, "f", _SyncedStateServer_getStateHandler)) {
-            __classPrivateFieldGet(_a, _a, "f", _SyncedStateServer_getStateHandler).call(_a, key, value);
+            const stub = __classPrivateFieldGet(this, _SyncedStateServer_instances, "m", _SyncedStateServer_getStubForHandlers).call(this);
+            if (stub) {
+                __classPrivateFieldGet(_a, _a, "f", _SyncedStateServer_getStateHandler).call(_a, key, value, stub);
+            }
         }
         return value;
     }
     setState(value, key) {
         __classPrivateFieldGet(this, _SyncedStateServer_stateStore, "f").set(key, value);
         if (__classPrivateFieldGet(_a, _a, "f", _SyncedStateServer_setStateHandler)) {
-            __classPrivateFieldGet(_a, _a, "f", _SyncedStateServer_setStateHandler).call(_a, key, value);
+            const stub = __classPrivateFieldGet(this, _SyncedStateServer_instances, "m", _SyncedStateServer_getStubForHandlers).call(this);
+            if (stub) {
+                __classPrivateFieldGet(_a, _a, "f", _SyncedStateServer_setStateHandler).call(_a, key, value, stub);
+            }
         }
         const subscribers = __classPrivateFieldGet(this, _SyncedStateServer_subscriptions, "f").get(key);
         if (!subscribers) {
@@ -78,7 +119,9 @@ export class SyncedStateServer extends DurableObject {
         if (!__classPrivateFieldGet(this, _SyncedStateServer_subscriptionRefs, "f").has(key)) {
             __classPrivateFieldGet(this, _SyncedStateServer_subscriptionRefs, "f").set(key, new Map());
         }
-        const duplicate = client.dup();
+        const duplicate = typeof client.dup === "function"
+            ? client.dup()
+            : client;
         __classPrivateFieldGet(this, _SyncedStateServer_subscriptions, "f").get(key).add(duplicate);
         __classPrivateFieldGet(this, _SyncedStateServer_subscriptionRefs, "f").get(key).set(client, duplicate);
     }
@@ -98,19 +141,44 @@ export class SyncedStateServer extends DurableObject {
         }
     }
     async fetch(request) {
-        const api = new CoordinatorApi(this);
+        // Create a placeholder stub - it will be set by the worker via _setStub
+        const api = new CoordinatorApi(this, __classPrivateFieldGet(this, _SyncedStateServer_stub, "f") || {});
         return newWorkersRpcResponse(request, api);
     }
 }
-_a = SyncedStateServer, _SyncedStateServer_stateStore = new WeakMap(), _SyncedStateServer_subscriptions = new WeakMap(), _SyncedStateServer_subscriptionRefs = new WeakMap();
+_a = SyncedStateServer, _SyncedStateServer_stub = new WeakMap(), _SyncedStateServer_stateStore = new WeakMap(), _SyncedStateServer_subscriptions = new WeakMap(), _SyncedStateServer_subscriptionRefs = new WeakMap(), _SyncedStateServer_instances = new WeakSet(), _SyncedStateServer_getStubForHandlers = function _SyncedStateServer_getStubForHandlers() {
+    // If we have a stub already, use it
+    if (__classPrivateFieldGet(this, _SyncedStateServer_stub, "f")) {
+        return __classPrivateFieldGet(this, _SyncedStateServer_stub, "f");
+    }
+    // Otherwise, try to get a stub from the registered namespace using our own ID
+    const namespace = __classPrivateFieldGet(_a, _a, "f", _SyncedStateServer_namespace);
+    if (namespace) {
+        return namespace.get(this.ctx.id);
+    }
+    return null;
+};
 _SyncedStateServer_keyHandler = { value: null };
+_SyncedStateServer_roomHandler = { value: null };
 _SyncedStateServer_setStateHandler = { value: null };
 _SyncedStateServer_getStateHandler = { value: null };
+_SyncedStateServer_subscribeHandler = { value: null };
+_SyncedStateServer_unsubscribeHandler = { value: null };
+_SyncedStateServer_namespace = { value: null };
+_SyncedStateServer_durableObjectName = { value: "syncedState" };
 class CoordinatorApi extends RpcTarget {
-    constructor(coordinator) {
+    constructor(coordinator, stub) {
         super();
         _CoordinatorApi_coordinator.set(this, void 0);
+        _CoordinatorApi_stub.set(this, void 0);
         __classPrivateFieldSet(this, _CoordinatorApi_coordinator, coordinator, "f");
+        __classPrivateFieldSet(this, _CoordinatorApi_stub, stub, "f");
+        coordinator.setStub(stub);
+    }
+    // Internal method to set the stub - called from worker
+    _setStub(stub) {
+        __classPrivateFieldSet(this, _CoordinatorApi_stub, stub, "f");
+        __classPrivateFieldGet(this, _CoordinatorApi_coordinator, "f").setStub(stub);
     }
     getState(key) {
         return __classPrivateFieldGet(this, _CoordinatorApi_coordinator, "f").getState(key);
@@ -125,4 +193,4 @@ class CoordinatorApi extends RpcTarget {
         __classPrivateFieldGet(this, _CoordinatorApi_coordinator, "f").unsubscribe(key, client);
     }
 }
-_CoordinatorApi_coordinator = new WeakMap();
+_CoordinatorApi_coordinator = new WeakMap(), _CoordinatorApi_stub = new WeakMap();

package/dist/use-synced-state/__tests__/SyncStateServer.test.mjs

@@ -46,9 +46,12 @@ describe("SyncedStateServer", () => {
     });
     it("invokes registered onSet handler", () => {
         const coordinator = new SyncedStateServer({}, {});
+        const mockStub = {};
+        coordinator.setStub(mockStub);
         const calls = [];
-        SyncedStateServer.registerSetStateHandler((key, value) => {
+        SyncedStateServer.registerSetStateHandler((key, value, stub) => {
             calls.push({ key, value });
+            expect(stub).toBe(mockStub);
         });
         coordinator.setState(2, "counter");
         expect(calls).toEqual([{ key: "counter", value: 2 }]);
@@ -56,9 +59,12 @@ describe("SyncedStateServer", () => {
     });
     it("invokes registered onGet handler", () => {
         const coordinator = new SyncedStateServer({}, {});
+        const mockStub = {};
+        coordinator.setStub(mockStub);
         const calls = [];
-        SyncedStateServer.registerGetStateHandler((key, value) => {
+        SyncedStateServer.registerGetStateHandler((key, value, stub) => {
             calls.push({ key, value });
+            expect(stub).toBe(mockStub);
         });
         coordinator.setState(4, "counter");
         expect(coordinator.getState("counter")).toBe(4);
@@ -66,43 +72,44 @@ describe("SyncedStateServer", () => {
         SyncedStateServer.registerGetStateHandler(null);
     });
     describe("registerKeyHandler", () => {
+        const mockStub = {};
         afterEach(() => {
-            SyncedStateServer.registerKeyHandler(async (key) => key);
+            SyncedStateServer.registerKeyHandler(async (key, stub) => key);
         });
         it("stores and retrieves the registered handler", async () => {
-            const handler = async (key) => `transformed:${key}`;
+            const handler = async (key, stub) => `transformed:${key}`;
             SyncedStateServer.registerKeyHandler(handler);
             const retrievedHandler = SyncedStateServer.getKeyHandler();
             expect(retrievedHandler).toBe(handler);
         });
         it("transforms keys using the registered handler", async () => {
-            const handler = async (key) => `user:123:${key}`;
+            const handler = async (key, stub) => `user:123:${key}`;
             SyncedStateServer.registerKeyHandler(handler);
-            const result = await handler("counter");
+            const result = await handler("counter", mockStub);
             expect(result).toBe("user:123:counter");
         });
         it("returns null when no handler is registered", () => {
-            SyncedStateServer.registerKeyHandler(async (key) => key);
+            SyncedStateServer.registerKeyHandler(async (key, stub) => key);
             const handler = SyncedStateServer.getKeyHandler();
             expect(handler).not.toBeNull();
         });
         it("allows handler to be async", async () => {
-            const handler = async (key) => {
+            const handler = async (key, stub) => {
                 await new Promise((resolve) => setTimeout(resolve, 10));
                 return `async:${key}`;
             };
             SyncedStateServer.registerKeyHandler(handler);
-            const result = await handler("test");
+            const result = await handler("test", mockStub);
             expect(result).toBe("async:test");
         });
         it("handler receives the correct key parameter", async () => {
             let receivedKey = "";
-            const handler = async (key) => {
+            const handler = async (key, stub) => {
                 receivedKey = key;
                 return key;
             };
             SyncedStateServer.registerKeyHandler(handler);
-            await handler("myKey");
+            await handler("myKey", mockStub);
             expect(receivedKey).toBe("myKey");
         });
     });

package/dist/use-synced-state/__tests__/worker.test.mjs

@@ -18,52 +18,53 @@ describe("SyncedStateProxy", () => {
     beforeEach(() => {
         mockCoordinator = new SyncedStateServer({}, {});
     });
+    const mockStub = {};
     afterEach(() => {
-        SyncedStateServer.registerKeyHandler(async (key) => key);
+        SyncedStateServer.registerKeyHandler(async (key, stub) => key);
     });
     it("transforms keys before calling coordinator methods when handler is registered", async () => {
-        const handler = async (key) => `transformed:${key}`;
+        const handler = async (key, stub) => `transformed:${key}`;
         SyncedStateServer.registerKeyHandler(handler);
-        const transformedKey = await handler("counter");
+        const transformedKey = await handler("counter", mockStub);
         expect(transformedKey).toBe("transformed:counter");
         mockCoordinator.setState(5, transformedKey);
         const value = mockCoordinator.getState(transformedKey);
         expect(value).toBe(5);
     });
     it("does not transform keys when no handler is registered", () => {
-        SyncedStateServer.registerKeyHandler(async (key) => key);
+        SyncedStateServer.registerKeyHandler(async (key, stub) => key);
         const handler = SyncedStateServer.getKeyHandler();
         expect(handler).not.toBeNull();
     });
     it("passes through original key when handler returns it unchanged", async () => {
-        const handler = async (key) => key;
+        const handler = async (key, stub) => key;
         SyncedStateServer.registerKeyHandler(handler);
-        const result = await handler("counter");
+        const result = await handler("counter", mockStub);
         expect(result).toBe("counter");
     });
     it("handler can scope keys per user", async () => {
-        const handler = async (key) => {
+        const handler = async (key, stub) => {
             const userId = "user123";
             return `user:${userId}:${key}`;
         };
         SyncedStateServer.registerKeyHandler(handler);
-        const result = await handler("settings");
+        const result = await handler("settings", mockStub);
         expect(result).toBe("user:user123:settings");
     });
     it("allows errors from handler to propagate", async () => {
-        const handler = async (_key) => {
+        const handler = async (_key, stub) => {
             throw new Error("Handler error");
         };
         SyncedStateServer.registerKeyHandler(handler);
-        await expect(handler("test")).rejects.toThrow("Handler error");
+        await expect(handler("test", mockStub)).rejects.toThrow("Handler error");
     });
     it("handles async operations in handler", async () => {
-        const handler = async (key) => {
+        const handler = async (key, stub) => {
             await new Promise((resolve) => setTimeout(resolve, 5));
             return `async:${key}`;
         };
         SyncedStateServer.registerKeyHandler(handler);
-        const result = await handler("data");
+        const result = await handler("data", mockStub);
         expect(result).toBe("async:data");
     });
 });

package/dist/use-synced-state/client-core.d.ts

@@ -6,12 +6,14 @@ export type SyncedStateClient = {
 };
 /**
  * Returns a cached client for the provided endpoint, creating it when necessary.
+ * The client is wrapped to track subscriptions for cleanup on page reload.
  * @param endpoint Endpoint to connect to.
  * @returns RPC client instance.
  */
 export declare const getSyncedStateClient: (endpoint?: string) => SyncedStateClient;
 /**
  * Initializes and caches an RPC client instance for the sync state endpoint.
+ * The client is wrapped to track subscriptions for cleanup on page reload.
  * @param options Optional endpoint override.
  * @returns Cached client instance or `null` when running without `window`.
  */
@@ -20,6 +22,7 @@ export declare const initSyncedStateClient: (options?: {
 }) => SyncedStateClient | null;
 /**
  * Injects a client instance for tests and updates the cached endpoint.
+ * Also clears the subscription registry for test isolation.
  * @param client Stub client instance or `null` to clear the cache.
  * @param endpoint Endpoint associated with the injected client.
  */

package/dist/use-synced-state/client-core.js

@@ -1,39 +1,103 @@
 import { newWebSocketRpcSession } from "capnweb";
 import { DEFAULT_SYNCED_STATE_PATH } from "./constants.mjs";
-let cachedClient = null;
-let cachedEndpoint = DEFAULT_SYNCED_STATE_PATH;
+// Map of endpoint URLs to their respective clients
+const clientCache = new Map();
+const activeSubscriptions = new Set();
+// Set up beforeunload handler to unsubscribe all active subscriptions
+if (typeof window !== "undefined") {
+    const handleBeforeUnload = () => {
+        if (activeSubscriptions.size === 0) {
+            return;
+        }
+        // Unsubscribe all active subscriptions
+        // Use a synchronous approach where possible, but don't block page unload
+        const subscriptions = Array.from(activeSubscriptions);
+        activeSubscriptions.clear();
+        // Fire-and-forget unsubscribe calls - we can't await during beforeunload
+        for (const { key, handler, client } of subscriptions) {
+            void client.unsubscribe(key, handler).catch(() => {
+                // Ignore errors during page unload - the connection will be closed anyway
+            });
+        }
+    };
+    window.addEventListener("beforeunload", handleBeforeUnload);
+}
 /**
  * Returns a cached client for the provided endpoint, creating it when necessary.
+ * The client is wrapped to track subscriptions for cleanup on page reload.
  * @param endpoint Endpoint to connect to.
  * @returns RPC client instance.
  */
-export const getSyncedStateClient = (endpoint = cachedEndpoint) => {
-    if (cachedClient && endpoint === cachedEndpoint) {
-        return cachedClient;
+export const getSyncedStateClient = (endpoint = DEFAULT_SYNCED_STATE_PATH) => {
+    // Return existing client if already cached for this endpoint
+    const existingClient = clientCache.get(endpoint);
+    if (existingClient) {
+        return existingClient;
     }
-    cachedEndpoint = endpoint;
-    cachedClient = newWebSocketRpcSession(cachedEndpoint);
-    return cachedClient;
+    const baseClient = newWebSocketRpcSession(endpoint);
+    // Wrap the client using a Proxy to track subscriptions
+    // The RPC client uses dynamic property access, so we can't use .bind()
+    const wrappedClient = new Proxy(baseClient, {
+        get(target, prop) {
+            if (prop === "subscribe") {
+                return async (key, handler) => {
+                    const subscription = {
+                        key,
+                        handler,
+                        client: wrappedClient,
+                    };
+                    activeSubscriptions.add(subscription);
+                    return target[prop](key, handler);
+                };
+            }
+            if (prop === "unsubscribe") {
+                return async (key, handler) => {
+                    // Find and remove the subscription
+                    for (const sub of activeSubscriptions) {
+                        if (sub.key === key &&
+                            sub.handler === handler &&
+                            sub.client === wrappedClient) {
+                            activeSubscriptions.delete(sub);
+                            break;
+                        }
+                    }
+                    return target[prop](key, handler);
+                };
+            }
+            // Pass through all other properties/methods
+            return target[prop];
+        },
+    });
+    // Cache the client for this endpoint
+    clientCache.set(endpoint, wrappedClient);
+    return wrappedClient;
 };
 /**
  * Initializes and caches an RPC client instance for the sync state endpoint.
+ * The client is wrapped to track subscriptions for cleanup on page reload.
  * @param options Optional endpoint override.
  * @returns Cached client instance or `null` when running without `window`.
  */
 export const initSyncedStateClient = (options = {}) => {
-    cachedEndpoint = options.endpoint ?? DEFAULT_SYNCED_STATE_PATH;
+    const endpoint = options.endpoint ?? DEFAULT_SYNCED_STATE_PATH;
     if (typeof window === "undefined") {
         return null;
     }
-    cachedClient = newWebSocketRpcSession(cachedEndpoint);
-    return cachedClient;
+    // Use getSyncedStateClient which now handles caching via Map
+    return getSyncedStateClient(endpoint);
 };
 /**
  * Injects a client instance for tests and updates the cached endpoint.
+ * Also clears the subscription registry for test isolation.
  * @param client Stub client instance or `null` to clear the cache.
  * @param endpoint Endpoint associated with the injected client.
  */
 export const setSyncedStateClientForTesting = (client, endpoint = DEFAULT_SYNCED_STATE_PATH) => {
-    cachedClient = client;
-    cachedEndpoint = endpoint;
+    if (client) {
+        clientCache.set(endpoint, client);
+    }
+    else {
+        clientCache.delete(endpoint);
+    }
+    activeSubscriptions.clear();
 };

package/dist/use-synced-state/useSyncedState.d.ts

@@ -8,6 +8,7 @@ type HookDeps = {
 type Setter<T> = (value: T | ((previous: T) => T)) => void;
 export type CreateSyncedStateHookOptions = {
     url?: string;
+    roomId?: string;
     hooks?: HookDeps;
 };
 /**
@@ -15,6 +16,6 @@ export type CreateSyncedStateHookOptions = {
  * @param options Optional overrides for endpoint and React primitives.
  * @returns Hook that syncs state through the sync state service.
  */
-export declare const createSyncedStateHook: (options?: CreateSyncedStateHookOptions) => <T>(initialValue: T, key: string) => [T, Setter<T>];
-export declare const useSyncedState: <T>(initialValue: T, key: string) => [T, Setter<T>];
+export declare const createSyncedStateHook: (options?: CreateSyncedStateHookOptions) => <T>(initialValue: T, key: string, roomId?: string | undefined) => [T, Setter<T>];
+export declare const useSyncedState: <T>(initialValue: T, key: string, roomId?: string | undefined) => [T, Setter<T>];
 export {};

package/dist/use-synced-state/useSyncedState.js

@@ -13,13 +13,14 @@ const defaultDeps = {
  * @returns Hook that syncs state through the sync state service.
  */
 export const createSyncedStateHook = (options = {}) => {
-    const resolvedUrl = options.url ?? DEFAULT_SYNCED_STATE_PATH;
+    const basePath = options.url ?? DEFAULT_SYNCED_STATE_PATH;
     const deps = options.hooks ?? defaultDeps;
     const { useState, useEffect, useRef, useCallback } = deps;
-    return function useSyncedState(initialValue, key) {
+    return function useSyncedState(initialValue, key, roomId = options.roomId) {
         if (typeof window === "undefined" && !options.hooks) {
             return [initialValue, () => { }];
         }
+        const resolvedUrl = roomId ? `${basePath}/${roomId}` : basePath;
         const client = getSyncedStateClient(resolvedUrl);
         const [value, setValue] = useState(initialValue);
         const valueRef = useRef(value);
@@ -49,7 +50,12 @@ export const createSyncedStateHook = (options = {}) => {
             void client.subscribe(key, handleUpdate);
             return () => {
                 isActive = false;
-                void client.unsubscribe(key, handleUpdate);
+                // Call unsubscribe when component unmounts
+                // Page reloads are handled by the beforeunload event listener in client-core.ts
+                void client.unsubscribe(key, handleUpdate).catch((error) => {
+                    // Log but don't throw - cleanup should not prevent unmounting
+                    console.error("[useSyncedState] Error during unsubscribe:", error);
+                });
             };
         }, [client, key, setValue, valueRef]);
         return [value, setSyncValue];

package/dist/use-synced-state/worker.d.mts

@@ -1,3 +1,4 @@
+import type { RequestInfo } from "../runtime/requestInfo/types";
 import { SyncedStateServer } from "./SyncedStateServer.mjs";
 export { SyncedStateServer };
 export type SyncedStateRouteOptions = {
@@ -10,4 +11,4 @@ export type SyncedStateRouteOptions = {
  * @param options Optional overrides for base path and object name.
  * @returns Router entries for the sync state API.
  */
-export declare const syncedStateRoutes: (getNamespace: (env: Cloudflare.Env) => DurableObjectNamespace<SyncedStateServer>, options?: SyncedStateRouteOptions) => import("../runtime/lib/router.js").RouteDefinition<`/${string}`, import("../runtime/worker.js").RequestInfo<any, import("../runtime/worker.js").DefaultAppContext>>[];
+export declare const syncedStateRoutes: (getNamespace: (env: Cloudflare.Env) => DurableObjectNamespace<SyncedStateServer>, options?: SyncedStateRouteOptions) => import("../runtime/lib/router.js").RouteDefinition<`/${string}`, RequestInfo<any, import("../runtime/requestInfo/types").DefaultAppContext>>[];

package/dist/use-synced-state/worker.mjs

@@ -9,40 +9,91 @@ var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (
     if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
     return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
 };
-var _SyncedStateProxy_stub, _SyncedStateProxy_keyHandler;
+var _SyncedStateProxy_instances, _SyncedStateProxy_stub, _SyncedStateProxy_keyHandler, _SyncedStateProxy_requestInfo, _SyncedStateProxy_transformKey, _SyncedStateProxy_callHandler;
 import { RpcTarget, newWorkersRpcResponse } from "capnweb";
 import { env } from "cloudflare:workers";
 import { route } from "../runtime/entries/router";
+import { runWithRequestInfo } from "../runtime/requestInfo/worker";
 import { SyncedStateServer, } from "./SyncedStateServer.mjs";
 import { DEFAULT_SYNCED_STATE_PATH } from "./constants.mjs";
 export { SyncedStateServer };
 const DEFAULT_SYNC_STATE_NAME = "syncedState";
 class SyncedStateProxy extends RpcTarget {
-    constructor(stub, keyHandler) {
+    constructor(stub, keyHandler, requestInfo) {
         super();
+        _SyncedStateProxy_instances.add(this);
         _SyncedStateProxy_stub.set(this, void 0);
         _SyncedStateProxy_keyHandler.set(this, void 0);
+        _SyncedStateProxy_requestInfo.set(this, void 0);
         __classPrivateFieldSet(this, _SyncedStateProxy_stub, stub, "f");
         __classPrivateFieldSet(this, _SyncedStateProxy_keyHandler, keyHandler, "f");
+        __classPrivateFieldSet(this, _SyncedStateProxy_requestInfo, requestInfo, "f");
+        // Set stub in DO instance so handlers can access it
+        if (stub && typeof stub._setStub === "function") {
+            void stub._setStub(stub);
+        }
     }
     async getState(key) {
-        const transformedKey = __classPrivateFieldGet(this, _SyncedStateProxy_keyHandler, "f") ? await __classPrivateFieldGet(this, _SyncedStateProxy_keyHandler, "f").call(this, key) : key;
+        const transformedKey = await __classPrivateFieldGet(this, _SyncedStateProxy_instances, "m", _SyncedStateProxy_transformKey).call(this, key);
         return __classPrivateFieldGet(this, _SyncedStateProxy_stub, "f").getState(transformedKey);
     }
     async setState(value, key) {
-        const transformedKey = __classPrivateFieldGet(this, _SyncedStateProxy_keyHandler, "f") ? await __classPrivateFieldGet(this, _SyncedStateProxy_keyHandler, "f").call(this, key) : key;
+        const transformedKey = await __classPrivateFieldGet(this, _SyncedStateProxy_instances, "m", _SyncedStateProxy_transformKey).call(this, key);
         return __classPrivateFieldGet(this, _SyncedStateProxy_stub, "f").setState(value, transformedKey);
     }
     async subscribe(key, client) {
-        const transformedKey = __classPrivateFieldGet(this, _SyncedStateProxy_keyHandler, "f") ? await __classPrivateFieldGet(this, _SyncedStateProxy_keyHandler, "f").call(this, key) : key;
-        return __classPrivateFieldGet(this, _SyncedStateProxy_stub, "f").subscribe(transformedKey, client);
+        const transformedKey = await __classPrivateFieldGet(this, _SyncedStateProxy_instances, "m", _SyncedStateProxy_transformKey).call(this, key);
+        const subscribeHandler = SyncedStateServer.getSubscribeHandler();
+        if (subscribeHandler) {
+            __classPrivateFieldGet(this, _SyncedStateProxy_instances, "m", _SyncedStateProxy_callHandler).call(this, subscribeHandler, transformedKey, __classPrivateFieldGet(this, _SyncedStateProxy_stub, "f"));
+        }
+        // dup the client if it is a function; otherwise, pass it as is;
+        // this is because the client is a WebSocketRpcSession, and we need to pass a new instance of the client to the DO;
+        const clientToPass = typeof client.dup === "function" ? client.dup() : client;
+        return __classPrivateFieldGet(this, _SyncedStateProxy_stub, "f").subscribe(transformedKey, clientToPass);
     }
     async unsubscribe(key, client) {
-        const transformedKey = __classPrivateFieldGet(this, _SyncedStateProxy_keyHandler, "f") ? await __classPrivateFieldGet(this, _SyncedStateProxy_keyHandler, "f").call(this, key) : key;
-        return __classPrivateFieldGet(this, _SyncedStateProxy_stub, "f").unsubscribe(transformedKey, client);
+        const transformedKey = await __classPrivateFieldGet(this, _SyncedStateProxy_instances, "m", _SyncedStateProxy_transformKey).call(this, key);
+        // Call unsubscribe handler before unsubscribe, similar to subscribe handler
+        // This ensures the handler is called even if the unsubscribe doesn't find a match
+        // or if the RPC call fails
+        const unsubscribeHandler = SyncedStateServer.getUnsubscribeHandler();
+        if (unsubscribeHandler) {
+            __classPrivateFieldGet(this, _SyncedStateProxy_instances, "m", _SyncedStateProxy_callHandler).call(this, unsubscribeHandler, transformedKey, __classPrivateFieldGet(this, _SyncedStateProxy_stub, "f"));
+        }
+        try {
+            await __classPrivateFieldGet(this, _SyncedStateProxy_stub, "f").unsubscribe(transformedKey, client);
+        }
+        catch (error) {
+            // Ignore errors during unsubscribe - handler has already been called
+            // This prevents RPC stub disposal errors from propagating
+        }
     }
 }
-_SyncedStateProxy_stub = new WeakMap(), _SyncedStateProxy_keyHandler = new WeakMap();
+_SyncedStateProxy_stub = new WeakMap(), _SyncedStateProxy_keyHandler = new WeakMap(), _SyncedStateProxy_requestInfo = new WeakMap(), _SyncedStateProxy_instances = new WeakSet(), _SyncedStateProxy_transformKey = 
+/**
+ * Transforms a key using the keyHandler, preserving async context so requestInfo.ctx is available.
+ */
+async function _SyncedStateProxy_transformKey(key) {
+    if (!__classPrivateFieldGet(this, _SyncedStateProxy_keyHandler, "f")) {
+        return key;
+    }
+    if (__classPrivateFieldGet(this, _SyncedStateProxy_requestInfo, "f")) {
+        // Preserve async context when calling keyHandler so requestInfo.ctx is available
+        return await runWithRequestInfo(__classPrivateFieldGet(this, _SyncedStateProxy_requestInfo, "f"), async () => await __classPrivateFieldGet(this, _SyncedStateProxy_keyHandler, "f")(key, __classPrivateFieldGet(this, _SyncedStateProxy_stub, "f")));
+    }
+    return await __classPrivateFieldGet(this, _SyncedStateProxy_keyHandler, "f").call(this, key, __classPrivateFieldGet(this, _SyncedStateProxy_stub, "f"));
+}, _SyncedStateProxy_callHandler = function _SyncedStateProxy_callHandler(handler, key, stub) {
+    if (__classPrivateFieldGet(this, _SyncedStateProxy_requestInfo, "f")) {
+        // Preserve async context when calling handler so requestInfo.ctx is available
+        runWithRequestInfo(__classPrivateFieldGet(this, _SyncedStateProxy_requestInfo, "f"), () => {
+            handler(key, stub);
+        });
+    }
+    else {
+        handler(key, stub);
+    }
+};
 /**
  * Registers routes that forward sync state requests to the configured Durable Object namespace.
  * @param getNamespace Function that returns the Durable Object namespace from the Worker env.
@@ -52,18 +103,33 @@ _SyncedStateProxy_stub = new WeakMap(), _SyncedStateProxy_keyHandler = new WeakM
 export const syncedStateRoutes = (getNamespace, options = {}) => {
     const basePath = options.basePath ?? DEFAULT_SYNCED_STATE_PATH;
     const durableObjectName = options.durableObjectName ?? DEFAULT_SYNC_STATE_NAME;
-    const forwardRequest = async (request) => {
+    const forwardRequest = async (request, requestInfo) => {
+        const namespace = getNamespace(env);
+        // Register the namespace and DO name so handlers can access it
+        SyncedStateServer.registerNamespace(namespace, durableObjectName);
         const keyHandler = SyncedStateServer.getKeyHandler();
+        const roomHandler = SyncedStateServer.getRoomHandler();
+        // Get the room ID from the URL parameter, or undefined if not present
+        const idParam = requestInfo.params?.id;
+        // Resolve the room name using the roomHandler if present, otherwise use the param or default
+        let resolvedRoomName;
+        if (roomHandler) {
+            resolvedRoomName = await runWithRequestInfo(requestInfo, async () => await roomHandler(idParam, requestInfo));
+        }
+        else {
+            resolvedRoomName = idParam ?? durableObjectName;
+        }
         if (!keyHandler) {
-            const namespace = getNamespace(env);
-            const id = namespace.idFromName(durableObjectName);
+            const id = namespace.idFromName(resolvedRoomName);
             return namespace.get(id).fetch(request);
         }
-        const namespace = getNamespace(env);
-        const id = namespace.idFromName(durableObjectName);
+        const id = namespace.idFromName(resolvedRoomName);
         const coordinator = namespace.get(id);
-        const proxy = new SyncedStateProxy(coordinator, keyHandler);
+        const proxy = new SyncedStateProxy(coordinator, keyHandler, requestInfo);
         return newWorkersRpcResponse(request, proxy);
     };
-    return [route(basePath, ({ request }) => forwardRequest(request))];
+    return [
+        route(basePath, (requestInfo) => forwardRequest(requestInfo.request, requestInfo)),
+        route(basePath + "/:id", (requestInfo) => forwardRequest(requestInfo.request, requestInfo)),
+    ];
 };

package/dist/vite/transformClientComponents.test.mjs

@@ -288,6 +288,7 @@ function SidebarGroup() { return jsx("div", {}); }
 function SidebarGroupLabel() { return jsx("div", {}); }
 function SidebarGroupAction() { return jsx("div", {}); }
 function SidebarGroupContent() { return jsx("div", {}); }
+function SidebarGroupContent() { return jsx("div", {}); }
 function SidebarMenu() { return jsx("div", {}); }
 function SidebarMenuItem() { return jsx("div", {}); }
 function SidebarMenuButton() { return jsx("div", {}); }
@@ -326,6 +327,37 @@ const SidebarSeparator = registerClientReference(SSRModule, "/test/file.tsx", "S
 const SidebarTrigger = registerClientReference(SSRModule, "/test/file.tsx", "SidebarTrigger");
 const useSidebar = registerClientReference(SSRModule, "/test/file.tsx", "useSidebar");
 export { Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, useSidebar };
+`);
+    });
+    it("does not transform inlined functions (Issue #471)", async () => {
+        const code = `"use client"
+
+export function Stars({ level }) {
+  const renderStars = (level) => {
+    return level;
+  }
+  return renderStars(level);
+}`;
+        expect((await transform(code)) ?? "").toEqual(`import { ssrLoadModule } from "rwsdk/__ssr_bridge";
+import { registerClientReference } from "rwsdk/worker";
+const SSRModule = await ssrLoadModule("/test/file.tsx");
+const Stars = registerClientReference(SSRModule, "/test/file.tsx", "Stars");
+export { Stars };
+`);
+    });
+    it("does not transform inlined functions in default export (Issue #471)", async () => {
+        const code = `"use client"
+
+export default function Stars({ level }) {
+  const renderStars = (level) => {
+    return level;
+  }
+  return renderStars(level);
+}`;
+        expect((await transform(code)) ?? "").toEqual(`import { ssrLoadModule } from "rwsdk/__ssr_bridge";
+import { registerClientReference } from "rwsdk/worker";
+const SSRModule = await ssrLoadModule("/test/file.tsx");
+export default registerClientReference(SSRModule, "/test/file.tsx", "default");
 `);
     });
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rwsdk",
-  "version": "1.0.0-beta.42",
+  "version": "1.0.0-beta.43",
   "description": "Build fast, server-driven webapps on Cloudflare with SSR, RSC, and realtime",
   "type": "module",
   "bin": {
@@ -18,13 +18,16 @@
     "build:watch": "npm run build -- --watch",
     "release": "./scripts/release.sh",
     "test": "vitest --run",
+    "bench": "vitest bench --run",
+    "bench:baseline": "vitest bench --run --outputJson=benchmarks/router-bench-baseline.json",
+    "bench:compare": "vitest bench --run --compare=benchmarks/router-bench-baseline.json",
     "debug:sync": "tsx ./src/scripts/debug-sync.mts",
     "smoke-test": "tsx ./src/scripts/smoke-test.mts"
   },
   "exports": {
     "./vite": {
-      "default": "./dist/vite/index.mjs",
-      "types": "./dist/vite/index.d.mts"
+      "types": "./dist/vite/index.d.mts",
+      "default": "./dist/vite/index.mjs"
     },
     "./worker": {
       "react-server": "./dist/runtime/entries/worker.js",