react-server-dom-webpack 19.0.0-canary-95e6f032c-20240401 → 19.0.0-canary-7a2609eed-20240403

package/cjs/react-server-dom-webpack-server.browser.development.js

@@ -1034,10 +1034,6 @@ function use(usable) {
   }
 }
 
-function createSignal() {
-  return new AbortController().signal;
-}
-
 function resolveCache() {
   var request = resolveRequest();
 
@@ -1049,17 +1045,6 @@ function resolveCache() {
 }
 
 var DefaultCacheDispatcher = {
-  getCacheSignal: function () {
-    var cache = resolveCache();
-    var entry = cache.get(createSignal);
-
-    if (entry === undefined) {
-      entry = createSignal();
-      cache.set(createSignal, entry);
-    }
-
-    return entry;
-  },
   getCacheForType: function (resourceType) {
     var cache = resolveCache();
     var entry = cache.get(resourceType);
@@ -1422,11 +1407,15 @@ if (!ReactSharedServerInternals) {
 var ObjectPrototype = Object.prototype;
 var stringify = JSON.stringify; // Serializable values
 // Thenable<ReactClientValue>
+// task status
 
 var PENDING$1 = 0;
 var COMPLETED = 1;
 var ABORTED = 3;
-var ERRORED$1 = 4;
+var ERRORED$1 = 4; // object reference status
+
+var SEEN_BUT_NOT_YET_OUTLINED = -1;
+var NEVER_OUTLINED = -2;
 var ReactCurrentCache = ReactSharedServerInternals.ReactCurrentCache;
 var ReactCurrentDispatcher = ReactSharedInternals.ReactCurrentDispatcher;
 
@@ -1732,15 +1721,68 @@ function renderFragment(request, task, children) {
     }
   }
 
-  {
-    return children;
-  }
+  if (task.keyPath !== null) {
+    // We have a Server Component that specifies a key but we're now splitting
+    // the tree using a fragment.
+    var fragment = [REACT_ELEMENT_TYPE, REACT_FRAGMENT_TYPE, task.keyPath, {
+      children: children
+    }];
+
+    if (!task.implicitSlot) {
+      // If this was keyed inside a set. I.e. the outer Server Component was keyed
+      // then we need to handle reorders of the whole set. To do this we need to wrap
+      // this array in a keyed Fragment.
+      return fragment;
+    } // If the outer Server Component was implicit but then an inner one had a key
+    // we don't actually need to be able to move the whole set around. It'll always be
+    // in an implicit slot. The key only exists to be able to reset the state of the
+    // children. We could achieve the same effect by passing on the keyPath to the next
+    // set of components inside the fragment. This would also allow a keyless fragment
+    // reconcile against a single child.
+    // Unfortunately because of JSON.stringify, we can't call the recursive loop for
+    // each child within this context because we can't return a set with already resolved
+    // values. E.g. a string would get double encoded. Returning would pop the context.
+    // So instead, we wrap it with an unkeyed fragment and inner keyed fragment.
+
+
+    return [fragment];
+  } // Since we're yielding here, that implicitly resets the keyPath context on the
+  // way up. Which is what we want since we've consumed it. If this changes to
+  // be recursive serialization, we need to reset the keyPath and implicitSlot,
+  // before recursing here.
+
+
+  return children;
 }
 
 function renderClientElement(task, type, key, props) {
-  {
-    return [REACT_ELEMENT_TYPE, type, key, props];
-  } // We prepend the terminal client element that actually gets serialized with
+  // the keys of any Server Components which are not serialized.
+
+
+  var keyPath = task.keyPath;
+
+  if (key === null) {
+    key = keyPath;
+  } else if (keyPath !== null) {
+    key = keyPath + ',' + key;
+  }
+
+  var element = [REACT_ELEMENT_TYPE, type, key, props];
+
+  if (task.implicitSlot && key !== null) {
+    // The root Server Component had no key so it was in an implicit slot.
+    // If we had a key lower, it would end up in that slot with an explicit key.
+    // We wrap the element in a fragment to give it an implicit key slot with
+    // an inner explicit key.
+    return [element];
+  } // Since we're yielding here, that implicitly resets the keyPath context on the
+  // way up. Which is what we want since we've consumed it. If this changes to
+  // be recursive serialization, we need to reset the keyPath and implicitSlot,
+  // before recursing here. We also need to reset it once we render into an array
+  // or anything else too which we also get implicitly.
+
+
+  return element;
 } // The chunk ID we're currently rendering that we can assign debug data to.
 
 
@@ -1859,7 +1901,7 @@ function createTask(request, model, keyPath, implicitSlot, abortSet) {
   if (typeof model === 'object' && model !== null) {
     // If we're about to write this into a new task we can assign it an ID early so that
     // any other references can refer to the value we're about to write.
-    {
+    if ((keyPath !== null || implicitSlot)) ; else {
       request.writtenObjects.set(model, id);
     }
   }
@@ -2066,8 +2108,7 @@ function serializeMap(request, map) {
       var existingId = writtenObjects.get(key);
 
       if (existingId === undefined) {
-        // Mark all object keys as seen so that they're always outlined.
-        writtenObjects.set(key, -1);
+        writtenObjects.set(key, SEEN_BUT_NOT_YET_OUTLINED);
       }
     }
   }
@@ -2087,8 +2128,7 @@ function serializeSet(request, set) {
       var existingId = writtenObjects.get(key);
 
       if (existingId === undefined) {
-        // Mark all object keys as seen so that they're always outlined.
-        writtenObjects.set(key, -1);
+        writtenObjects.set(key, SEEN_BUT_NOT_YET_OUTLINED);
       }
     }
   }
@@ -2192,12 +2232,11 @@ function renderModelDestructive(request, task, parent, parentPropertyName, value
           var _existingId = _writtenObjects.get(value);
 
           if (_existingId !== undefined) {
-            if (modelRoot === value) {
+            if ((task.keyPath !== null || task.implicitSlot)) ; else if (modelRoot === value) {
               // This is the ID we're currently emitting so we need to write it
               // once but if we discover it again, we refer to it by id.
               modelRoot = null;
-            } else if (_existingId === -1) {
-              // Seen but not yet outlined.
+            } else if (_existingId === SEEN_BUT_NOT_YET_OUTLINED) {
               // TODO: If we throw here we can treat this as suspending which causes an outline
               // but that is able to reuse the same task if we're already in one but then that
               // will be a lazy future value rather than guaranteed to exist but maybe that's good.
@@ -2216,7 +2255,11 @@ function renderModelDestructive(request, task, parent, parentPropertyName, value
           } else {
             // This is the first time we've seen this object. We may never see it again
             // so we'll inline it. Mark it as seen. If we see it again, we'll outline.
-            _writtenObjects.set(value, -1);
+            _writtenObjects.set(value, SEEN_BUT_NOT_YET_OUTLINED); // The element's props are marked as "never outlined" so that they are inlined into
+            // the same row as the element itself.
+
+
+            _writtenObjects.set(value.props, NEVER_OUTLINED);
           }
 
           var element = value;
@@ -2241,7 +2284,11 @@ function renderModelDestructive(request, task, parent, parentPropertyName, value
           var ref;
 
           {
-            ref = element.ref;
+            // TODO: This is a temporary, intermediate step. Once the feature
+            // flag is removed, we should get the ref off the props object right
+            // before using it.
+            var refProp = props.ref;
+            ref = refProp !== undefined ? refProp : null;
           } // Attempt to render the Server Component.
 
 
@@ -2290,7 +2337,14 @@ function renderModelDestructive(request, task, parent, parentPropertyName, value
 
     if (typeof value.then === 'function') {
       if (existingId !== undefined) {
-        if (modelRoot === value) {
+        if ((task.keyPath !== null || task.implicitSlot)) {
+          // If we're in some kind of context we can't reuse the result of this render or
+          // previous renders of this element. We only reuse Promises if they're not wrapped
+          // by another Server Component.
+          var _promiseId = serializeThenable(request, task, value);
+
+          return serializePromiseID(_promiseId);
+        } else if (modelRoot === value) {
           // This is the ID we're currently emitting so we need to write it
           // once but if we discover it again, we refer to it by id.
           modelRoot = null;
@@ -2312,12 +2366,11 @@ function renderModelDestructive(request, task, parent, parentPropertyName, value
         // This is the ID we're currently emitting so we need to write it
         // once but if we discover it again, we refer to it by id.
         modelRoot = null;
-      } else if (existingId === -1) {
-        // Seen but not yet outlined.
+      } else if (existingId === SEEN_BUT_NOT_YET_OUTLINED) {
         var _newId = outlineModel(request, value);
 
         return serializeByValueID(_newId);
-      } else {
+      } else if (existingId !== NEVER_OUTLINED) {
         // We've already emitted this as an outlined object, so we can
         // just refer to that by its existing ID.
         return serializeByValueID(existingId);
@@ -2325,7 +2378,7 @@ function renderModelDestructive(request, task, parent, parentPropertyName, value
     } else {
       // This is the first time we've seen this object. We may never see it again
       // so we'll inline it. Mark it as seen. If we see it again, we'll outline.
-      writtenObjects.set(value, -1);
+      writtenObjects.set(value, SEEN_BUT_NOT_YET_OUTLINED);
     }
 
     if (isArray(value)) {

package/cjs/react-server-dom-webpack-server.browser.production.js

@@ -992,10 +992,6 @@ function use(usable) {
   }
 }
 
-function createSignal() {
-  return new AbortController().signal;
-}
-
 function resolveCache() {
   const request = resolveRequest();
 
@@ -1007,18 +1003,6 @@ function resolveCache() {
 }
 
 const DefaultCacheDispatcher = {
-  getCacheSignal() {
-    const cache = resolveCache();
-    let entry = cache.get(createSignal);
-
-    if (entry === undefined) {
-      entry = createSignal();
-      cache.set(createSignal, entry);
-    }
-
-    return entry;
-  },
-
   getCacheForType(resourceType) {
     const cache = resolveCache();
     let entry = cache.get(resourceType);
@@ -1251,11 +1235,15 @@ if (!ReactSharedServerInternals) {
 const ObjectPrototype = Object.prototype;
 const stringify = JSON.stringify; // Serializable values
 // Thenable<ReactClientValue>
+// task status
 
 const PENDING$1 = 0;
 const COMPLETED = 1;
 const ABORTED = 3;
-const ERRORED$1 = 4;
+const ERRORED$1 = 4; // object reference status
+
+const SEEN_BUT_NOT_YET_OUTLINED = -1;
+const NEVER_OUTLINED = -2;
 const ReactCurrentCache = ReactSharedServerInternals.ReactCurrentCache;
 const ReactCurrentDispatcher = ReactSharedInternals.ReactCurrentDispatcher;
 
@@ -1508,15 +1496,68 @@ function renderFunctionComponent(request, task, key, Component, props) {
 
 function renderFragment(request, task, children) {
 
-  {
-    return children;
-  }
+  if (task.keyPath !== null) {
+    // We have a Server Component that specifies a key but we're now splitting
+    // the tree using a fragment.
+    const fragment = [REACT_ELEMENT_TYPE, REACT_FRAGMENT_TYPE, task.keyPath, {
+      children
+    }];
+
+    if (!task.implicitSlot) {
+      // If this was keyed inside a set. I.e. the outer Server Component was keyed
+      // then we need to handle reorders of the whole set. To do this we need to wrap
+      // this array in a keyed Fragment.
+      return fragment;
+    } // If the outer Server Component was implicit but then an inner one had a key
+    // we don't actually need to be able to move the whole set around. It'll always be
+    // in an implicit slot. The key only exists to be able to reset the state of the
+    // children. We could achieve the same effect by passing on the keyPath to the next
+    // set of components inside the fragment. This would also allow a keyless fragment
+    // reconcile against a single child.
+    // Unfortunately because of JSON.stringify, we can't call the recursive loop for
+    // each child within this context because we can't return a set with already resolved
+    // values. E.g. a string would get double encoded. Returning would pop the context.
+    // So instead, we wrap it with an unkeyed fragment and inner keyed fragment.
+
+
+    return [fragment];
+  } // Since we're yielding here, that implicitly resets the keyPath context on the
+  // way up. Which is what we want since we've consumed it. If this changes to
+  // be recursive serialization, we need to reset the keyPath and implicitSlot,
+  // before recursing here.
+
+
+  return children;
 }
 
 function renderClientElement(task, type, key, props) {
-  {
-    return [REACT_ELEMENT_TYPE, type, key, props];
-  } // We prepend the terminal client element that actually gets serialized with
+  // the keys of any Server Components which are not serialized.
+
+
+  const keyPath = task.keyPath;
+
+  if (key === null) {
+    key = keyPath;
+  } else if (keyPath !== null) {
+    key = keyPath + ',' + key;
+  }
+
+  const element = [REACT_ELEMENT_TYPE, type, key, props];
+
+  if (task.implicitSlot && key !== null) {
+    // The root Server Component had no key so it was in an implicit slot.
+    // If we had a key lower, it would end up in that slot with an explicit key.
+    // We wrap the element in a fragment to give it an implicit key slot with
+    // an inner explicit key.
+    return [element];
+  } // Since we're yielding here, that implicitly resets the keyPath context on the
+  // way up. Which is what we want since we've consumed it. If this changes to
+  // be recursive serialization, we need to reset the keyPath and implicitSlot,
+  // before recursing here. We also need to reset it once we render into an array
+  // or anything else too which we also get implicitly.
+
+
+  return element;
 } // The chunk ID we're currently rendering that we can assign debug data to.
 
 
@@ -1608,7 +1649,7 @@ function createTask(request, model, keyPath, implicitSlot, abortSet) {
   if (typeof model === 'object' && model !== null) {
     // If we're about to write this into a new task we can assign it an ID early so that
     // any other references can refer to the value we're about to write.
-    {
+    if ((keyPath !== null || implicitSlot)) ; else {
       request.writtenObjects.set(model, id);
     }
   }
@@ -1794,8 +1835,7 @@ function serializeMap(request, map) {
       const existingId = writtenObjects.get(key);
 
       if (existingId === undefined) {
-        // Mark all object keys as seen so that they're always outlined.
-        writtenObjects.set(key, -1);
+        writtenObjects.set(key, SEEN_BUT_NOT_YET_OUTLINED);
       }
     }
   }
@@ -1815,8 +1855,7 @@ function serializeSet(request, set) {
       const existingId = writtenObjects.get(key);
 
       if (existingId === undefined) {
-        // Mark all object keys as seen so that they're always outlined.
-        writtenObjects.set(key, -1);
+        writtenObjects.set(key, SEEN_BUT_NOT_YET_OUTLINED);
       }
     }
   }
@@ -1919,12 +1958,11 @@ function renderModelDestructive(request, task, parent, parentPropertyName, value
           const existingId = writtenObjects.get(value);
 
           if (existingId !== undefined) {
-            if (modelRoot === value) {
+            if ((task.keyPath !== null || task.implicitSlot)) ; else if (modelRoot === value) {
               // This is the ID we're currently emitting so we need to write it
               // once but if we discover it again, we refer to it by id.
               modelRoot = null;
-            } else if (existingId === -1) {
-              // Seen but not yet outlined.
+            } else if (existingId === SEEN_BUT_NOT_YET_OUTLINED) {
               // TODO: If we throw here we can treat this as suspending which causes an outline
               // but that is able to reuse the same task if we're already in one but then that
               // will be a lazy future value rather than guaranteed to exist but maybe that's good.
@@ -1943,7 +1981,10 @@ function renderModelDestructive(request, task, parent, parentPropertyName, value
           } else {
             // This is the first time we've seen this object. We may never see it again
             // so we'll inline it. Mark it as seen. If we see it again, we'll outline.
-            writtenObjects.set(value, -1);
+            writtenObjects.set(value, SEEN_BUT_NOT_YET_OUTLINED); // The element's props are marked as "never outlined" so that they are inlined into
+            // the same row as the element itself.
+
+            writtenObjects.set(value.props, NEVER_OUTLINED);
           }
 
           const element = value;
@@ -1952,7 +1993,11 @@ function renderModelDestructive(request, task, parent, parentPropertyName, value
           let ref;
 
           {
-            ref = element.ref;
+            // TODO: This is a temporary, intermediate step. Once the feature
+            // flag is removed, we should get the ref off the props object right
+            // before using it.
+            const refProp = props.ref;
+            ref = refProp !== undefined ? refProp : null;
           } // Attempt to render the Server Component.
 
 
@@ -1983,7 +2028,13 @@ function renderModelDestructive(request, task, parent, parentPropertyName, value
 
     if (typeof value.then === 'function') {
       if (existingId !== undefined) {
-        if (modelRoot === value) {
+        if ((task.keyPath !== null || task.implicitSlot)) {
+          // If we're in some kind of context we can't reuse the result of this render or
+          // previous renders of this element. We only reuse Promises if they're not wrapped
+          // by another Server Component.
+          const promiseId = serializeThenable(request, task, value);
+          return serializePromiseID(promiseId);
+        } else if (modelRoot === value) {
           // This is the ID we're currently emitting so we need to write it
           // once but if we discover it again, we refer to it by id.
           modelRoot = null;
@@ -2005,11 +2056,10 @@ function renderModelDestructive(request, task, parent, parentPropertyName, value
         // This is the ID we're currently emitting so we need to write it
         // once but if we discover it again, we refer to it by id.
         modelRoot = null;
-      } else if (existingId === -1) {
-        // Seen but not yet outlined.
+      } else if (existingId === SEEN_BUT_NOT_YET_OUTLINED) {
         const newId = outlineModel(request, value);
         return serializeByValueID(newId);
-      } else {
+      } else if (existingId !== NEVER_OUTLINED) {
         // We've already emitted this as an outlined object, so we can
         // just refer to that by its existing ID.
         return serializeByValueID(existingId);
@@ -2017,7 +2067,7 @@ function renderModelDestructive(request, task, parent, parentPropertyName, value
     } else {
       // This is the first time we've seen this object. We may never see it again
       // so we'll inline it. Mark it as seen. If we see it again, we'll outline.
-      writtenObjects.set(value, -1);
+      writtenObjects.set(value, SEEN_BUT_NOT_YET_OUTLINED);
     }
 
     if (isArray(value)) {