hadars 0.1.22 → 0.1.24

package/src/slim-react/render.ts

@@ -30,6 +30,10 @@ import {
   popComponentScope,
   snapshotContext,
   restoreContext,
+  pushContextValue,
+  popContextValue,
+  getContextValue,
+  runWithContextStore,
 } from "./renderContext";
 
 // ---------------------------------------------------------------------------
@@ -566,7 +570,7 @@ function renderComponent(
   // React.Consumer (React 19) — call the children render prop with the current value
   if (typeOf === REACT_CONSUMER) {
     const ctx = (type as any)._context;
-    const value = ctx?._currentValue;
+    const value = ctx ? getContextValue(ctx) : undefined;
     const result: SlimNode =
       typeof props.children === "function" ? props.children(value) : null;
     const savedScope = pushComponentScope();
@@ -594,8 +598,7 @@ function renderComponent(
   if (isProvider) {
     // Resolve the actual context object from any provider variant
     ctx = (type as any)._context ?? type;
-    prevCtxValue = ctx._currentValue;
-    ctx._currentValue = props.value;
+    prevCtxValue = pushContextValue(ctx, props.value);
   }
 
   // Each component gets a fresh local-ID counter (for multiple useId calls).
@@ -606,11 +609,11 @@ function renderComponent(
   if (isProvider && typeof type !== "function") {
     const finish = () => {
       popComponentScope(savedScope);
-      ctx._currentValue = prevCtxValue;
+      popContextValue(ctx, prevCtxValue);
     };
     const r = renderChildren(props.children, writer, isSvg);
     if (r && typeof (r as any).then === "function") {
-      return (r as Promise<void>).then(finish);
+      return (r as Promise<void>).then(finish, (e) => { finish(); throw e; });
     }
     finish();
     return;
@@ -631,13 +634,13 @@ function renderComponent(
     }
   } catch (e) {
     popComponentScope(savedScope);
-    if (isProvider) ctx._currentValue = prevCtxValue;
+    if (isProvider) popContextValue(ctx, prevCtxValue);
     throw e;
   }
 
   const finish = () => {
     popComponentScope(savedScope);
-    if (isProvider) ctx._currentValue = prevCtxValue;
+    if (isProvider) popContextValue(ctx, prevCtxValue);
   };
 
   // Async component
@@ -645,16 +648,16 @@ function renderComponent(
     return result.then((resolved) => {
       const r = renderNode(resolved, writer, isSvg);
       if (r && typeof (r as any).then === "function") {
-        return (r as Promise<void>).then(finish);
+        return (r as Promise<void>).then(finish, (e) => { finish(); throw e; });
       }
       finish();
-    });
+    }, (e) => { finish(); throw e; });
   }
 
   const r = renderNode(result, writer, isSvg);
 
   if (r && typeof (r as any).then === "function") {
-    return (r as Promise<void>).then(finish);
+    return (r as Promise<void>).then(finish, (e) => { finish(); throw e; });
   }
   finish();
 }
@@ -803,7 +806,7 @@ async function renderSuspense(
 export function renderToStream(element: SlimNode): ReadableStream<Uint8Array> {
   const encoder = new TextEncoder();
 
-  return new ReadableStream({
+  return runWithContextStore(() => new ReadableStream({
     async start(controller) {
       resetRenderState();
 
@@ -827,7 +830,7 @@ export function renderToStream(element: SlimNode): ReadableStream<Uint8Array> {
         controller.error(error);
       }
     },
-  });
+  }));
 }
 
 /**
@@ -835,28 +838,30 @@ export function renderToStream(element: SlimNode): ReadableStream<Uint8Array> {
  * Retries the full tree when a component throws a Promise (Suspense protocol),
  * so useServerData and similar hooks work without requiring explicit <Suspense>.
  */
-export async function renderToString(element: SlimNode): Promise<string> {
-  for (let attempt = 0; attempt < MAX_SUSPENSE_RETRIES; attempt++) {
-    resetRenderState();
-    const chunks: string[] = [];
-    const writer: Writer = {
-      lastWasText: false,
-      write(c) { chunks.push(c); this.lastWasText = false; },
-      text(s) { chunks.push(s); this.lastWasText = true; },
-    };
-    try {
-      const r = renderNode(element, writer);
-      if (r && typeof (r as any).then === "function") await r;
-      return chunks.join("");
-    } catch (error) {
-      if (error && typeof (error as any).then === "function") {
-        await (error as Promise<unknown>);
-        continue;
+export function renderToString(element: SlimNode): Promise<string> {
+  return runWithContextStore(async () => {
+    for (let attempt = 0; attempt < MAX_SUSPENSE_RETRIES; attempt++) {
+      resetRenderState();
+      const chunks: string[] = [];
+      const writer: Writer = {
+        lastWasText: false,
+        write(c) { chunks.push(c); this.lastWasText = false; },
+        text(s) { chunks.push(s); this.lastWasText = true; },
+      };
+      try {
+        const r = renderNode(element, writer);
+        if (r && typeof (r as any).then === "function") await r;
+        return chunks.join("");
+      } catch (error) {
+        if (error && typeof (error as any).then === "function") {
+          await (error as Promise<unknown>);
+          continue;
+        }
+        throw error;
       }
-      throw error;
     }
-  }
-  throw new Error("[slim-react] renderToString exceeded maximum retries");
+    throw new Error("[slim-react] renderToString exceeded maximum retries");
+  });
 }
 
 /** Alias matching React 18+ server API naming. */

package/src/slim-react/renderContext.ts

@@ -1,12 +1,71 @@
 /**
- * Render-time context for tree-position-based `useId`.
+ * Render-time context for tree-position-based `useId` and React Context values.
  *
  * State lives on `globalThis` rather than module-level variables so that
  * multiple slim-react instances (the render worker's direct import and the
- * SSR bundle's bundled copy) share the same context without any coordination.
- * Safe because each worker processes one render at a time; `resetRenderState`
- * is always called at the top of every `renderToString` / `renderToStream`.
+ * SSR bundle's bundled copy) share the same singletons without coordination.
+ *
+ * Context values are stored in an AsyncLocalStorage<Map> so each concurrent
+ * SSR request gets its own isolated scope that propagates through all awaits.
+ * Call `runWithContextStore` at the start of every render to establish the scope.
+ */
+
+// Shared AsyncLocalStorage instance — kept on globalThis so both copies of
+// slim-react (direct import + SSR bundle) use the same store.
+// The import is done with require() inside a try/catch so that bundlers that
+// cannot resolve node:async_hooks (e.g. rspack without target:node set) do
+// not fail at build time — the SSR render process always runs in Node.js and
+// will find the module at runtime regardless.
+const CONTEXT_STORE_KEY = "__slimReactContextStore";
+const _g = globalThis as any;
+if (!_g[CONTEXT_STORE_KEY]) {
+  try {
+    // eslint-disable-next-line @typescript-eslint/no-require-imports
+    const { AsyncLocalStorage } = require("node:async_hooks") as typeof import("node:async_hooks");
+    _g[CONTEXT_STORE_KEY] = new AsyncLocalStorage<Map<object, unknown>>();
+  } catch {
+    // Fallback: no-op store — context values fall back to _defaultValue.
+    // This should never happen in a real SSR environment.
+    _g[CONTEXT_STORE_KEY] = null;
+  }
+}
+const _contextStore: { run<T>(store: Map<object,unknown>, fn: () => T): T; getStore(): Map<object,unknown> | undefined } | null = _g[CONTEXT_STORE_KEY];
+
+/** Wrap a render entry-point so it gets its own isolated context-value scope. */
+export function runWithContextStore<T>(fn: () => T): T {
+  return _contextStore ? _contextStore.run(new Map(), fn) : fn();
+}
+
+/**
+ * Read the current value for a context within the active render.
+ * Falls back to `_defaultValue` (or `_currentValue` for external contexts).
+ */
+export function getContextValue<T>(context: object): T {
+  const store = _contextStore?.getStore();
+  if (store && store.has(context)) return store.get(context) as T;
+  const c = context as any;
+  return ("_defaultValue" in c ? c._defaultValue : c._currentValue) as T;
+}
+
+/**
+ * Push a new value for a context Provider onto the per-request store.
+ * Returns the previous value so the caller can restore it later.
  */
+export function pushContextValue(context: object, value: unknown): unknown {
+  const store = _contextStore?.getStore();
+  const c = context as any;
+  const prev = store && store.has(context)
+    ? store.get(context)
+    : ("_defaultValue" in c ? c._defaultValue : c._currentValue);
+  if (store) store.set(context, value);
+  return prev;
+}
+
+/** Restore a previously saved context value (called by Provider on exit). */
+export function popContextValue(context: object, prev: unknown): void {
+  const store = _contextStore?.getStore();
+  if (store) store.set(context, prev);
+}
 
 export interface TreeContext {
   id: number;

package/src/utils/rspack.ts

@@ -18,7 +18,7 @@ const loaderPath = existsSync(pathMod.resolve(packageDir, 'loader.cjs'))
     ? pathMod.resolve(packageDir, 'loader.cjs')
     : pathMod.resolve(packageDir, 'loader.ts');
 
-const getConfigBase = (mode: "development" | "production"): Omit<Configuration, "entry" | "output" | "plugins"> => {
+const getConfigBase = (mode: "development" | "production", isServerBuild = false): Omit<Configuration, "entry" | "output" | "plugins"> => {
     const isDev = mode === 'development';
     return {
         experiments: {
@@ -141,9 +141,12 @@ const buildCompilerConfig = (
     opts: EntryOptions,
     includeHotPlugin: boolean,
 ): Configuration => {
-    const Config = getConfigBase(opts.mode);
     const { base } = opts;
     const isDev = opts.mode === 'development';
+    const isServerBuild = Boolean(
+        (opts.output && typeof opts.output === 'object' && (opts.output.library || String(opts.output.filename || '').includes('ssr')))
+    );
+    const Config = getConfigBase(opts.mode, isServerBuild);
 
     // shallow-clone base config to avoid mutating shared Config while preserving RegExp and plugin instances
     const localConfig: any = {
@@ -203,15 +206,6 @@ const buildCompilerConfig = (
         localConfig.module.rules.push(...opts.moduleRules);
     }
 
-    // For server (SSR) builds we should avoid bundling react/react-dom so
-    // the runtime uses the same React instance as the host. If the output
-    // is a library/module (i.e. `opts.output.library` present or filename
-    // contains "ssr"), treat it as a server build and mark react/react-dom
-    // as externals and alias React imports to the project's node_modules.
-    const isServerBuild = Boolean(
-        (opts.output && typeof opts.output === 'object' && (opts.output.library || String(opts.output.filename || '').includes('ssr')))
-    );
-
     // slim-react: the SSR-only React-compatible renderer bundled with hadars.
     // On server builds we replace the real React with slim-react so that hooks
     // get safe SSR stubs, context works, and renderToStream / Suspense are
@@ -232,6 +226,11 @@ const buildCompilerConfig = (
     } : undefined;
 
     const externals = isServerBuild ? [
+        // Node.js built-ins — must not be bundled; resolved by the runtime.
+        // Both the bare name and the node: prefix are listed because rspack
+        // may encounter either form depending on how the import is written.
+        'node:async_hooks', 'async_hooks',
+        'node:fs', 'node:path', 'node:os', 'node:stream', 'node:util',
         // react / react-dom are replaced by slim-react via alias above — not external.
         // emotion should be external on server builds to avoid client/browser code
         '@emotion/react',
@@ -291,7 +290,7 @@ const buildCompilerConfig = (
         externals,
         ...(optimization !== undefined ? { optimization } : {}),
         plugins: [
-            new rspack.HtmlRspackPlugin({
+            !isServerBuild && new rspack.HtmlRspackPlugin({
                 publicPath: base || '/',
                 template: opts.htmlTemplate
                     ? pathMod.resolve(process.cwd(), opts.htmlTemplate)
@@ -301,12 +300,7 @@ const buildCompilerConfig = (
                 inject: 'head',
                 minify: opts.mode === 'production',
             }),
-            // Add `async` to the emitted module script so DOMContentLoaded fires
-            // as soon as HTML is parsed — without waiting for the bundle to execute.
-            // `<script type="module" async>` is valid: it downloads in parallel and
-            // executes without blocking DOMContentLoaded, while retaining module
-            // semantics (strict mode, ES imports, etc.).
-            {
+            !isServerBuild && {
                 apply(compiler: any) {
                     compiler.hooks.emit.tapAsync('HadarsAsyncModuleScript', (compilation: any, cb: () => void) => {
                         const asset = compilation.assets['out.html'];
@@ -327,7 +321,7 @@ const buildCompilerConfig = (
                 },
             },
             isDev && !isServerBuild && new ReactRefreshPlugin(),
-            includeHotPlugin && isDev && new rspack.HotModuleReplacementPlugin(),
+            includeHotPlugin && isDev && !isServerBuild && new rspack.HotModuleReplacementPlugin(),
             ...extraPlugins,
         ],
         ...localConfig,