@solidjs/web 2.0.0-rc.0 → 2.0.0-rc.1

package/server-functions/dist/server.dev.js

@@ -26,6 +26,7 @@ function withMeta(fn, meta) {
   Object.assign(metadata, meta);
   return fn;
 }
+const LIVE_SOURCE = Symbol.for("solid.LiveSource");
 const SERVER_FUNCTION_RPC = Symbol.for("solid.ServerFunctionRPC");
 function provideServerFunctionRPC(rpc) {
   globalThis[SERVER_FUNCTION_RPC] || (globalThis[SERVER_FUNCTION_RPC] = rpc);
@@ -130,7 +131,7 @@ const BodyFormat = {
   Uint8Array: "7",
   Json: "8"
 };
-const JSON_SAFE_DEPTH_LIMIT = 10000;
+const JSON_SAFE_DEPTH_LIMIT = 4096;
 const EXIT = {};
 function isJSONSafe(value) {
   const stack = [value];
@@ -157,6 +158,7 @@ function isJSONSafe(value) {
     } else {
       const proto = Object.getPrototypeOf(v);
       if (proto !== Object.prototype && proto !== null) return false;
+      if (Symbol.asyncIterator in v || Symbol.iterator in v) return false;
       for (const k in v) stack.push(v[k]);
     }
   }
@@ -319,27 +321,6 @@ class ChunkReader {
     }
   }
 }
-function serializeStream(value, codecOptions) {
-  return new ReadableStream({
-    async start(controller) {
-      const {
-        serializeJSON
-      } = await import('@solidjs/web/serialization');
-      serializeJSON(value, {
-        ...codecOptions,
-        onParse(node) {
-          controller.enqueue(createChunk(JSON.stringify(node)));
-        },
-        onDone() {
-          controller.close();
-        },
-        onError(error) {
-          controller.error(error);
-        }
-      });
-    }
-  });
-}
 async function deserializeStream(source, codecOptions) {
   if (!source.body) {
     throw new Error("missing body");
@@ -354,7 +335,7 @@ async function deserializeStream(source, codecOptions) {
     function interpretChunk(chunk) {
       return deserializeChunk(JSON.parse(chunk));
     }
-    void reader.drain(interpretChunk);
+    reader.drain(interpretChunk).then(() => deserializeChunk.abort(new Error("Server function stream ended unexpectedly.")), error => deserializeChunk.abort(error));
     return interpretChunk(result.value);
   }
   return undefined;
@@ -634,6 +615,29 @@ function GET(fn) {
     method: "GET"
   });
 }
+function live(fn) {
+  if (!isServerFunction(fn) || typeof fn.id !== "string") {
+    throw new Error("live expects a server function reference");
+  }
+  const metadata = {
+    ...getServerFunctionMetadata(fn),
+    live: true
+  };
+  const wrapped = async (...args) => {
+    const result = await fn(...args);
+    if (result !== null && typeof result === "object" && result[Symbol.asyncIterator]) {
+      result[LIVE_SOURCE] = true;
+    }
+    return result;
+  };
+  wrapped[SERVER_FUNCTION_METADATA] = metadata;
+  wrapped.id = fn.id;
+  Object.defineProperty(wrapped, "url", {
+    get: () => fn.url,
+    configurable: true
+  });
+  return wrapped;
+}
 function getServerFunctionInvocation() {
   return getEventServerFunctionInvocation(getRequestEvent());
 }
@@ -805,14 +809,102 @@ function isFormPost(request) {
   const type = request.headers.get("content-type") || "";
   return type.startsWith("application/x-www-form-urlencoded") || type.startsWith("multipart/form-data");
 }
-function serializedResponse(value, headers, codec) {
+function serializeResponseStream(value, codecOptions, signal) {
+  let closeIterator = null;
+  let closed = false;
+  let cancelSerialize = null;
+  let onAbort = null;
+  const teardown = () => {
+    if (closed) return;
+    closed = true;
+    if (onAbort) signal.removeEventListener("abort", onAbort);
+    if (cancelSerialize) cancelSerialize();
+    if (closeIterator) closeIterator();
+  };
+  if (value !== null && typeof value === "object" && typeof value[Symbol.asyncIterator] === "function") {
+    const source = value;
+    value = {
+      [Symbol.asyncIterator]() {
+        const it = source[Symbol.asyncIterator]();
+        let finished = false;
+        closeIterator = () => {
+          if (finished) return;
+          finished = true;
+          try {
+            const returned = it.return && it.return();
+            if (returned && typeof returned.then === "function") returned.then(undefined, () => {});
+          } catch {}
+        };
+        if (closed) closeIterator();
+        return {
+          next: () => finished ? Promise.resolve({
+            done: true,
+            value: undefined
+          }) : it.next()
+        };
+      }
+    };
+  }
+  return new ReadableStream({
+    async start(controller) {
+      if (signal) {
+        if (signal.aborted) {
+          teardown();
+          controller.close();
+          return;
+        }
+        onAbort = () => {
+          const alreadyClosed = closed;
+          teardown();
+          if (!alreadyClosed) {
+            try {
+              controller.error(signal.reason || new Error("The operation was aborted."));
+            } catch {}
+          }
+        };
+        signal.addEventListener("abort", onAbort);
+      }
+      const {
+        serializeJSON
+      } = await import('@solidjs/web/serialization');
+      if (closed) {
+        try {
+          controller.close();
+        } catch {}
+        return;
+      }
+      cancelSerialize = serializeJSON(value, {
+        ...codecOptions,
+        onParse(node) {
+          if (!closed) controller.enqueue(createChunk(JSON.stringify(node)));
+        },
+        onDone() {
+          if (closed) return;
+          closed = true;
+          if (onAbort) signal.removeEventListener("abort", onAbort);
+          controller.close();
+        },
+        onError(error) {
+          if (closed) return;
+          closed = true;
+          if (onAbort) signal.removeEventListener("abort", onAbort);
+          controller.error(error);
+        }
+      });
+    },
+    cancel() {
+      teardown();
+    }
+  });
+}
+function serializedResponse(value, headers, codec, signal) {
   headers.set(BODY_FORMAT_HEADER, BodyFormat.Serialized);
   headers.set("Content-Type", "text/plain");
-  return new Response(serializeStream(value, codec), {
+  return new Response(serializeResponseStream(value, codec, signal), {
     headers
   });
 }
-function encodeResult(value, headers, status, codec) {
+function encodeResult(value, headers, status, codec, signal) {
   const direct = getHeadersAndBody(value);
   if (direct) {
     for (const [key, val] of Object.entries(direct.headers || {})) {
@@ -840,7 +932,7 @@ function encodeResult(value, headers, status, codec) {
     }
   } catch {
   }
-  const response = serializedResponse(value, headers, codec);
+  const response = serializedResponse(value, headers, codec, signal);
   return status === 200 ? response : new Response(response.body, {
     status,
     headers
@@ -968,9 +1060,9 @@ async function handleServerFunctionRequest(request, options = {}) {
       if (!instance) {
         if (handleNoJS) return handleNoJS(result, request, parsed);
         if (result instanceof Response) return result;
-        return encodeResult(result, headers, 200, codec);
+        return encodeResult(result, headers, 200, codec, request.signal);
       }
-      return encodeResult(result, headers, status, codec);
+      return encodeResult(result, headers, status, codec, request.signal);
     } catch (x) {
       if (x instanceof Response || isResponseEnvelope(x)) {
         if (transformResult) {
@@ -1024,7 +1116,7 @@ async function handleServerFunctionRequest(request, options = {}) {
           if (handleNoJS) return handleNoJS(x ?? metadata, request, parsed, true);
           if (x instanceof Response) return x;
         }
-        return encodeResult(x, headers, status, codec);
+        return encodeResult(x, headers, status, codec, request.signal);
       }
       const safe = sanitizeServerError(x);
       if (!instance) {
@@ -1036,10 +1128,10 @@ async function handleServerFunctionRequest(request, options = {}) {
       }
       const error = safe instanceof Error ? safe.message : typeof safe === "string" ? safe : "true";
       headers.set(ERROR_HEADER, encodeErrorHeaderValue(error));
-      return encodeResult(safe, headers, 200, codec);
+      return encodeResult(safe, headers, 200, codec, request.signal);
     }
   };
   return commitEventResponse(await dispatch(), event);
 }
 
-export { ERROR_HEADER, FLASH_COOKIE, FUNCTION_HEADER, GENERIC_SERVER_ERROR_MESSAGE, GET, INSTANCE_HEADER, SINGLE_FLIGHT_HEADER, clearFlashCookie, configureServerFunctionsServer, createNoJSHandler, createServerReference, decodeErrorHeaderValue, decodeFlashCookie, decodeResponse, decodeResponsePayload, encodeErrorHeaderValue, encodeFlashCookie, foldSetCookies, getEventServerFunctionInvocation, getServerFunction, getServerFunctionInvocation, getServerFunctionMetadata, handleServerFunctionRequest, hasFlashCookie, isServerFunction, registerServerFunction, registerServerReference, sanitizeServerError, setServerFunctionsDev, subscribeFlightData, withMeta };
+export { ERROR_HEADER, FLASH_COOKIE, FUNCTION_HEADER, GENERIC_SERVER_ERROR_MESSAGE, GET, INSTANCE_HEADER, SINGLE_FLIGHT_HEADER, clearFlashCookie, configureServerFunctionsServer, createNoJSHandler, createServerReference, decodeErrorHeaderValue, decodeFlashCookie, decodeResponse, decodeResponsePayload, encodeErrorHeaderValue, encodeFlashCookie, foldSetCookies, getEventServerFunctionInvocation, getServerFunction, getServerFunctionInvocation, getServerFunctionMetadata, handleServerFunctionRequest, hasFlashCookie, isServerFunction, live, registerServerFunction, registerServerReference, sanitizeServerError, serializeResponseStream, setServerFunctionsDev, subscribeFlightData, withMeta };

package/server-functions/dist/server.js

@@ -26,6 +26,7 @@ function withMeta(fn, meta) {
   Object.assign(metadata, meta);
   return fn;
 }
+const LIVE_SOURCE = Symbol.for("solid.LiveSource");
 const SERVER_FUNCTION_RPC = Symbol.for("solid.ServerFunctionRPC");
 function provideServerFunctionRPC(rpc) {
   globalThis[SERVER_FUNCTION_RPC] || (globalThis[SERVER_FUNCTION_RPC] = rpc);
@@ -130,7 +131,7 @@ const BodyFormat = {
   Uint8Array: "7",
   Json: "8"
 };
-const JSON_SAFE_DEPTH_LIMIT = 10000;
+const JSON_SAFE_DEPTH_LIMIT = 4096;
 const EXIT = {};
 function isJSONSafe(value) {
   const stack = [value];
@@ -157,6 +158,7 @@ function isJSONSafe(value) {
     } else {
       const proto = Object.getPrototypeOf(v);
       if (proto !== Object.prototype && proto !== null) return false;
+      if (Symbol.asyncIterator in v || Symbol.iterator in v) return false;
       for (const k in v) stack.push(v[k]);
     }
   }
@@ -319,27 +321,6 @@ class ChunkReader {
     }
   }
 }
-function serializeStream(value, codecOptions) {
-  return new ReadableStream({
-    async start(controller) {
-      const {
-        serializeJSON
-      } = await import('@solidjs/web/serialization');
-      serializeJSON(value, {
-        ...codecOptions,
-        onParse(node) {
-          controller.enqueue(createChunk(JSON.stringify(node)));
-        },
-        onDone() {
-          controller.close();
-        },
-        onError(error) {
-          controller.error(error);
-        }
-      });
-    }
-  });
-}
 async function deserializeStream(source, codecOptions) {
   if (!source.body) {
     throw new Error("missing body");
@@ -354,7 +335,7 @@ async function deserializeStream(source, codecOptions) {
     function interpretChunk(chunk) {
       return deserializeChunk(JSON.parse(chunk));
     }
-    void reader.drain(interpretChunk);
+    reader.drain(interpretChunk).then(() => deserializeChunk.abort(new Error("Server function stream ended unexpectedly.")), error => deserializeChunk.abort(error));
     return interpretChunk(result.value);
   }
   return undefined;
@@ -634,6 +615,29 @@ function GET(fn) {
     method: "GET"
   });
 }
+function live(fn) {
+  if (!isServerFunction(fn) || typeof fn.id !== "string") {
+    throw new Error("live expects a server function reference");
+  }
+  const metadata = {
+    ...getServerFunctionMetadata(fn),
+    live: true
+  };
+  const wrapped = async (...args) => {
+    const result = await fn(...args);
+    if (result !== null && typeof result === "object" && result[Symbol.asyncIterator]) {
+      result[LIVE_SOURCE] = true;
+    }
+    return result;
+  };
+  wrapped[SERVER_FUNCTION_METADATA] = metadata;
+  wrapped.id = fn.id;
+  Object.defineProperty(wrapped, "url", {
+    get: () => fn.url,
+    configurable: true
+  });
+  return wrapped;
+}
 function getServerFunctionInvocation() {
   return getEventServerFunctionInvocation(getRequestEvent());
 }
@@ -805,14 +809,102 @@ function isFormPost(request) {
   const type = request.headers.get("content-type") || "";
   return type.startsWith("application/x-www-form-urlencoded") || type.startsWith("multipart/form-data");
 }
-function serializedResponse(value, headers, codec) {
+function serializeResponseStream(value, codecOptions, signal) {
+  let closeIterator = null;
+  let closed = false;
+  let cancelSerialize = null;
+  let onAbort = null;
+  const teardown = () => {
+    if (closed) return;
+    closed = true;
+    if (onAbort) signal.removeEventListener("abort", onAbort);
+    if (cancelSerialize) cancelSerialize();
+    if (closeIterator) closeIterator();
+  };
+  if (value !== null && typeof value === "object" && typeof value[Symbol.asyncIterator] === "function") {
+    const source = value;
+    value = {
+      [Symbol.asyncIterator]() {
+        const it = source[Symbol.asyncIterator]();
+        let finished = false;
+        closeIterator = () => {
+          if (finished) return;
+          finished = true;
+          try {
+            const returned = it.return && it.return();
+            if (returned && typeof returned.then === "function") returned.then(undefined, () => {});
+          } catch {}
+        };
+        if (closed) closeIterator();
+        return {
+          next: () => finished ? Promise.resolve({
+            done: true,
+            value: undefined
+          }) : it.next()
+        };
+      }
+    };
+  }
+  return new ReadableStream({
+    async start(controller) {
+      if (signal) {
+        if (signal.aborted) {
+          teardown();
+          controller.close();
+          return;
+        }
+        onAbort = () => {
+          const alreadyClosed = closed;
+          teardown();
+          if (!alreadyClosed) {
+            try {
+              controller.error(signal.reason || new Error("The operation was aborted."));
+            } catch {}
+          }
+        };
+        signal.addEventListener("abort", onAbort);
+      }
+      const {
+        serializeJSON
+      } = await import('@solidjs/web/serialization');
+      if (closed) {
+        try {
+          controller.close();
+        } catch {}
+        return;
+      }
+      cancelSerialize = serializeJSON(value, {
+        ...codecOptions,
+        onParse(node) {
+          if (!closed) controller.enqueue(createChunk(JSON.stringify(node)));
+        },
+        onDone() {
+          if (closed) return;
+          closed = true;
+          if (onAbort) signal.removeEventListener("abort", onAbort);
+          controller.close();
+        },
+        onError(error) {
+          if (closed) return;
+          closed = true;
+          if (onAbort) signal.removeEventListener("abort", onAbort);
+          controller.error(error);
+        }
+      });
+    },
+    cancel() {
+      teardown();
+    }
+  });
+}
+function serializedResponse(value, headers, codec, signal) {
   headers.set(BODY_FORMAT_HEADER, BodyFormat.Serialized);
   headers.set("Content-Type", "text/plain");
-  return new Response(serializeStream(value, codec), {
+  return new Response(serializeResponseStream(value, codec, signal), {
     headers
   });
 }
-function encodeResult(value, headers, status, codec) {
+function encodeResult(value, headers, status, codec, signal) {
   const direct = getHeadersAndBody(value);
   if (direct) {
     for (const [key, val] of Object.entries(direct.headers || {})) {
@@ -840,7 +932,7 @@ function encodeResult(value, headers, status, codec) {
     }
   } catch {
   }
-  const response = serializedResponse(value, headers, codec);
+  const response = serializedResponse(value, headers, codec, signal);
   return status === 200 ? response : new Response(response.body, {
     status,
     headers
@@ -968,9 +1060,9 @@ async function handleServerFunctionRequest(request, options = {}) {
       if (!instance) {
         if (handleNoJS) return handleNoJS(result, request, parsed);
         if (result instanceof Response) return result;
-        return encodeResult(result, headers, 200, codec);
+        return encodeResult(result, headers, 200, codec, request.signal);
       }
-      return encodeResult(result, headers, status, codec);
+      return encodeResult(result, headers, status, codec, request.signal);
     } catch (x) {
       if (x instanceof Response || isResponseEnvelope(x)) {
         if (transformResult) {
@@ -1024,7 +1116,7 @@ async function handleServerFunctionRequest(request, options = {}) {
           if (handleNoJS) return handleNoJS(x ?? metadata, request, parsed, true);
           if (x instanceof Response) return x;
         }
-        return encodeResult(x, headers, status, codec);
+        return encodeResult(x, headers, status, codec, request.signal);
       }
       const safe = sanitizeServerError(x);
       if (!instance) {
@@ -1036,10 +1128,10 @@ async function handleServerFunctionRequest(request, options = {}) {
       }
       const error = safe instanceof Error ? safe.message : typeof safe === "string" ? safe : "true";
       headers.set(ERROR_HEADER, encodeErrorHeaderValue(error));
-      return encodeResult(safe, headers, 200, codec);
+      return encodeResult(safe, headers, 200, codec, request.signal);
     }
   };
   return commitEventResponse(await dispatch(), event);
 }
 
-export { ERROR_HEADER, FLASH_COOKIE, FUNCTION_HEADER, GENERIC_SERVER_ERROR_MESSAGE, GET, INSTANCE_HEADER, SINGLE_FLIGHT_HEADER, clearFlashCookie, configureServerFunctionsServer, createNoJSHandler, createServerReference, decodeErrorHeaderValue, decodeFlashCookie, decodeResponse, decodeResponsePayload, encodeErrorHeaderValue, encodeFlashCookie, foldSetCookies, getEventServerFunctionInvocation, getServerFunction, getServerFunctionInvocation, getServerFunctionMetadata, handleServerFunctionRequest, hasFlashCookie, isServerFunction, registerServerFunction, registerServerReference, sanitizeServerError, setServerFunctionsDev, subscribeFlightData, withMeta };
+export { ERROR_HEADER, FLASH_COOKIE, FUNCTION_HEADER, GENERIC_SERVER_ERROR_MESSAGE, GET, INSTANCE_HEADER, SINGLE_FLIGHT_HEADER, clearFlashCookie, configureServerFunctionsServer, createNoJSHandler, createServerReference, decodeErrorHeaderValue, decodeFlashCookie, decodeResponse, decodeResponsePayload, encodeErrorHeaderValue, encodeFlashCookie, foldSetCookies, getEventServerFunctionInvocation, getServerFunction, getServerFunctionInvocation, getServerFunctionMetadata, handleServerFunctionRequest, hasFlashCookie, isServerFunction, live, registerServerFunction, registerServerReference, sanitizeServerError, serializeResponseStream, setServerFunctionsDev, subscribeFlightData, withMeta };

package/types/index.d.ts

@@ -102,6 +102,12 @@ export declare function render(code: () => JSX.Element, element: MountableElemen
  * Pass `options.renderId` to hydrate one of multiple roots emitted by a
  * server render that used the same id.
  *
+ * When the server renders a full document but the client hydrates only the
+ * app subtree, the server must give that subtree its own id namespace: wrap
+ * the document shell in `<NoHydration>` and re-enter with `<Hydration>`
+ * around the app. Otherwise the app's hydration ids are allocated under the
+ * document component's owner tree and this walk can never claim them.
+ *
  * @example
  * ```tsx
  * import { hydrate } from "@solidjs/web";
@@ -170,7 +176,8 @@ export declare function Dynamic<T extends ValidComponent>(props: DynamicProps<T>
  *
  * By default the import starts as soon as `clientOnly` is called (module
  * load); pass `{ lazy: true }` to defer the import to the component's first
- * render.
+ * render. Pass `{ export: "Name" }` to use a named export of the resolved
+ * module instead of its default (mirrors `lazy()`'s option).
  *
  * @example
  * ```tsx
@@ -178,11 +185,18 @@ export declare function Dynamic<T extends ValidComponent>(props: DynamicProps<T>
  * // <Chart fallback={<div>Loading chart…</div>} data={data()} />
  * ```
  */
+export declare function clientOnly<M extends Record<string, any>, K extends keyof M & string>(fn: () => Promise<M>, options: {
+    lazy?: boolean;
+    export: K;
+}, moduleUrl?: string): Component<ComponentProps<M[K]> & {
+    fallback?: JSX.Element;
+}>;
 export declare function clientOnly<T extends Component<any>>(fn: () => Promise<{
     default: T;
 }>, options?: {
     lazy?: boolean;
-}, _moduleUrl?: string): Component<ComponentProps<T> & {
+    export?: string;
+}, moduleUrl?: string): Component<ComponentProps<T> & {
     fallback?: JSX.Element;
 }>;
 /**

package/types/jsx.d.ts

@@ -249,6 +249,15 @@ export namespace JSX {
     ref?: Ref<T>;
     children?: Element | undefined;
     $ServerOnly?: boolean | undefined;
+    /**
+     * Entity identity for server markup (SSR-only): compiles to the `_key`
+     * attribute the frame morph matches keyed elements by, so live element
+     * state (form values, `open`, focus) follows the entity across
+     * reordering morphs. Sibling-scoped, like client keyed rendering.
+     * Stripped from DOM compiles; on components, `$key` is slot occurrence
+     * identity instead.
+     */
+    $key?: string | number | undefined;
   }
   interface ExplicitProperties {}
   type PropAttributes = {

package/types/server-functions/client.d.ts

@@ -156,6 +156,36 @@ export function GET<A extends readonly any[], R>(
   fn: (...args: A) => R
 ): ServerFunction<A, Awaited<R>>;
 
+/** Wire-state transitions a live call's iterable can report. */
+export type LiveSourceStatus = "connected" | "reconnecting" | "closed";
+
+/**
+ * A live call's answer: the source's iterable, plus an optional `onstatus`
+ * side channel for the wire facts the reconnect loop erases from the value
+ * stream — `"connected"` on each successful (re)connect, `"reconnecting"`
+ * (with the error) on each post-connect death, `"closed"` when the source
+ * completes or the consumer ends it.
+ */
+export type LiveSource<R> = R & {
+  onstatus?: (state: LiveSourceStatus, error?: unknown) => void;
+};
+
+/**
+ * Declares a value-shaped live source: a server function returning an async
+ * iterable whose yields are successive VALUES of one logical query, with the
+ * contract that the source re-yields current state on every invocation.
+ * Calls to the returned reference produce an iterable that survives the
+ * connection — post-connect deaths re-invoke with exponential backoff
+ * (reset per healthy value, woken early by connectivity returning),
+ * first-connect failures reject like a normal call, and `break` aborts the
+ * in-flight request. Live calls are reads and never opt into single-flight
+ * enveloping. Wire state, if wanted, rides the returned iterable's
+ * `onstatus` hook. Compose with `GET` inside-out: `live(GET(fn))`.
+ */
+export function live<A extends readonly any[], R>(
+  fn: (...args: A) => R
+): ServerFunction<A, LiveSource<Awaited<R>>>;
+
 /**
  * Compiler ABI — emitted by compiled `"use server"` client output where a
  * server function was referenced; produces the fetch-backed callable for

package/types/server-functions/server.d.ts

@@ -392,6 +392,34 @@ export function GET<A extends readonly any[], R>(
   fn: (...args: A) => R
 ): ServerFunction<A, Awaited<R>>;
 
+/** Wire-state transitions a live call's iterable can report (client side). */
+export type LiveSourceStatus = "connected" | "reconnecting" | "closed";
+
+/**
+ * Type-level mirror of the client's live answer shape so isomorphic code
+ * assigning `onstatus` typechecks against either build's declarations. On
+ * the server the hook is inert: in-process calls hand back the source's
+ * own iterable — there is no connection to report on.
+ */
+export type LiveSource<R> = R & {
+  onstatus?: (state: LiveSourceStatus, error?: unknown) => void;
+};
+
+/**
+ * Declares a value-shaped live source: a server function returning an async
+ * iterable whose yields are successive VALUES of one logical query, with
+ * the contract that the source re-yields current state on every invocation.
+ * Writes `live: true` on the metadata channel and brands the resolved
+ * iterable (registered symbol `solid.LiveSource`) so SSR faces meeting the
+ * value in-process can apply live policy (document face: first value, then
+ * client takeover). Dispatch is untouched — over-the-wire calls stream the
+ * raw registered function's result. Declare live outermost:
+ * `live(GET(fn))`.
+ */
+export function live<A extends readonly any[], R>(
+  fn: (...args: A) => R
+): ServerFunction<A, LiveSource<Awaited<R>>>;
+
 /** Identity of the currently executing server function call. */
 export interface ServerFunctionInvocation {
   id: string;

package/types-cjs/index.d.cts

@@ -102,6 +102,12 @@ export declare function render(code: () => JSX.Element, element: MountableElemen
  * Pass `options.renderId` to hydrate one of multiple roots emitted by a
  * server render that used the same id.
  *
+ * When the server renders a full document but the client hydrates only the
+ * app subtree, the server must give that subtree its own id namespace: wrap
+ * the document shell in `<NoHydration>` and re-enter with `<Hydration>`
+ * around the app. Otherwise the app's hydration ids are allocated under the
+ * document component's owner tree and this walk can never claim them.
+ *
  * @example
  * ```tsx
  * import { hydrate } from "@solidjs/web";
@@ -170,7 +176,8 @@ export declare function Dynamic<T extends ValidComponent>(props: DynamicProps<T>
  *
  * By default the import starts as soon as `clientOnly` is called (module
  * load); pass `{ lazy: true }` to defer the import to the component's first
- * render.
+ * render. Pass `{ export: "Name" }` to use a named export of the resolved
+ * module instead of its default (mirrors `lazy()`'s option).
  *
  * @example
  * ```tsx
@@ -178,11 +185,18 @@ export declare function Dynamic<T extends ValidComponent>(props: DynamicProps<T>
  * // <Chart fallback={<div>Loading chart…</div>} data={data()} />
  * ```
  */
+export declare function clientOnly<M extends Record<string, any>, K extends keyof M & string>(fn: () => Promise<M>, options: {
+    lazy?: boolean;
+    export: K;
+}, moduleUrl?: string): Component<ComponentProps<M[K]> & {
+    fallback?: JSX.Element;
+}>;
 export declare function clientOnly<T extends Component<any>>(fn: () => Promise<{
     default: T;
 }>, options?: {
     lazy?: boolean;
-}, _moduleUrl?: string): Component<ComponentProps<T> & {
+    export?: string;
+}, moduleUrl?: string): Component<ComponentProps<T> & {
     fallback?: JSX.Element;
 }>;
 /**

package/types-cjs/jsx.d.cts

@@ -249,6 +249,15 @@ export namespace JSX {
     ref?: Ref<T>;
     children?: Element | undefined;
     $ServerOnly?: boolean | undefined;
+    /**
+     * Entity identity for server markup (SSR-only): compiles to the `_key`
+     * attribute the frame morph matches keyed elements by, so live element
+     * state (form values, `open`, focus) follows the entity across
+     * reordering morphs. Sibling-scoped, like client keyed rendering.
+     * Stripped from DOM compiles; on components, `$key` is slot occurrence
+     * identity instead.
+     */
+    $key?: string | number | undefined;
   }
   interface ExplicitProperties {}
   type PropAttributes = {