react-dom 19.0.0-rc-cc1ec60d0d-20240607 → 19.0.0-rc-20b6f4c0e8-20240607

package/cjs/react-dom-client.development.js

@@ -11289,7 +11289,7 @@ var ownerHasKeyUseWarning;
 var ownerHasFunctionTypeWarning;
 var ownerHasSymbolTypeWarning;
 
-var warnForMissingKey = function (child, returnFiber) {};
+var warnForMissingKey = function (returnFiber, workInProgress, child) {};
 
 {
   didWarnAboutMaps = false;
@@ -11304,7 +11304,7 @@ var warnForMissingKey = function (child, returnFiber) {};
   ownerHasFunctionTypeWarning = {};
   ownerHasSymbolTypeWarning = {};
 
-  warnForMissingKey = function (child, returnFiber) {
+  warnForMissingKey = function (returnFiber, workInProgress, child) {
     if (child === null || typeof child !== 'object') {
       return;
     }
@@ -11363,15 +11363,9 @@ var warnForMissingKey = function (child, returnFiber) {};
         // Give the component that originally created this child.
         childOwnerAppendix = " It was passed a child from " + ownerName + ".";
       }
-    } // We create a fake Fiber for the child to log the stack trace from.
-    // TODO: Refactor the warnForMissingKey calls to happen after fiber creation
-    // so that we can get access to the fiber that will eventually be created.
-    // That way the log can show up associated with the right instance in DevTools.
-
+    }
 
-    var fiber = createFiberFromElement(child, returnFiber.mode, 0);
-    fiber.return = returnFiber;
-    runWithFiberInDEV(fiber, function () {
+    runWithFiberInDEV(workInProgress, function () {
       error('Each child in a list should have a unique "key" prop.' + '%s%s See https://react.dev/link/warning-keys for more information.', currentComponentErrorInfo, childOwnerAppendix);
     });
   };
@@ -11968,7 +11962,7 @@ function createChildReconciler(shouldTrackSideEffects) {
    */
 
 
-  function warnOnInvalidKey(child, knownKeys, returnFiber) {
+  function warnOnInvalidKey(returnFiber, workInProgress, child, knownKeys) {
     {
       if (typeof child !== 'object' || child === null) {
         return knownKeys;
@@ -11977,7 +11971,7 @@ function createChildReconciler(shouldTrackSideEffects) {
       switch (child.$$typeof) {
         case REACT_ELEMENT_TYPE:
         case REACT_PORTAL_TYPE:
-          warnForMissingKey(child, returnFiber);
+          warnForMissingKey(returnFiber, workInProgress, child);
           var key = child.key;
 
           if (typeof key !== 'string') {
@@ -11995,8 +11989,9 @@ function createChildReconciler(shouldTrackSideEffects) {
             break;
           }
 
-          error('Encountered two children with the same key, `%s`. ' + 'Keys should be unique so that components maintain their identity ' + 'across updates. Non-unique keys may cause children to be ' + 'duplicated and/or omitted — the behavior is unsupported and ' + 'could change in a future version.', key);
-
+          runWithFiberInDEV(workInProgress, function () {
+            error('Encountered two children with the same key, `%s`. ' + 'Keys should be unique so that components maintain their identity ' + 'across updates. Non-unique keys may cause children to be ' + 'duplicated and/or omitted — the behavior is unsupported and ' + 'could change in a future version.', key);
+          });
           break;
 
         case REACT_LAZY_TYPE:
@@ -12007,7 +12002,7 @@ function createChildReconciler(shouldTrackSideEffects) {
               resolvedChild = callLazyInitInDEV(child);
             }
 
-            warnOnInvalidKey(resolvedChild, knownKeys, returnFiber);
+            warnOnInvalidKey(returnFiber, workInProgress, resolvedChild, knownKeys);
             break;
           }
       }
@@ -12032,16 +12027,7 @@ function createChildReconciler(shouldTrackSideEffects) {
     // (adding everything to a Map) in for every insert/move.
     // If you change this code, also update reconcileChildrenIterator() which
     // uses the same algorithm.
-    {
-      // First, validate keys.
-      var knownKeys = null;
-
-      for (var i = 0; i < newChildren.length; i++) {
-        var child = newChildren[i];
-        knownKeys = warnOnInvalidKey(child, knownKeys, returnFiber);
-      }
-    }
-
+    var knownKeys = null;
     var resultingFirstChild = null;
     var previousNewFiber = null;
     var oldFiber = currentFirstChild;
@@ -12071,6 +12057,10 @@ function createChildReconciler(shouldTrackSideEffects) {
         break;
       }
 
+      {
+        knownKeys = warnOnInvalidKey(returnFiber, newFiber, newChildren[newIdx], knownKeys);
+      }
+
       if (shouldTrackSideEffects) {
         if (oldFiber && newFiber.alternate === null) {
           // We matched the slot, but we didn't reuse the existing fiber, so we
@@ -12118,6 +12108,10 @@ function createChildReconciler(shouldTrackSideEffects) {
           continue;
         }
 
+        {
+          knownKeys = warnOnInvalidKey(returnFiber, _newFiber, newChildren[newIdx], knownKeys);
+        }
+
         lastPlacedIndex = placeChild(_newFiber, lastPlacedIndex, newIdx);
 
         if (previousNewFiber === null) {
@@ -12145,6 +12139,10 @@ function createChildReconciler(shouldTrackSideEffects) {
       var _newFiber2 = updateFromMap(existingChildren, returnFiber, newIdx, newChildren[newIdx], lanes, debugInfo);
 
       if (_newFiber2 !== null) {
+        {
+          knownKeys = warnOnInvalidKey(returnFiber, _newFiber2, newChildren[newIdx], knownKeys);
+        }
+
         if (shouldTrackSideEffects) {
           if (_newFiber2.alternate !== null) {
             // The new fiber is a work in progress, but if there exists a
@@ -12239,11 +12237,7 @@ function createChildReconciler(shouldTrackSideEffects) {
     var knownKeys = null;
     var step = newChildren.next();
 
-    {
-      knownKeys = warnOnInvalidKey(step.value, knownKeys, returnFiber);
-    }
-
-    for (; oldFiber !== null && !step.done; newIdx++, step = newChildren.next(), knownKeys = warnOnInvalidKey(step.value, knownKeys, returnFiber) ) {
+    for (; oldFiber !== null && !step.done; newIdx++, step = newChildren.next()) {
       if (oldFiber.index > newIdx) {
         nextOldFiber = oldFiber;
         oldFiber = null;
@@ -12265,6 +12259,10 @@ function createChildReconciler(shouldTrackSideEffects) {
         break;
       }
 
+      {
+        knownKeys = warnOnInvalidKey(returnFiber, newFiber, step.value, knownKeys);
+      }
+
       if (shouldTrackSideEffects) {
         if (oldFiber && newFiber.alternate === null) {
           // We matched the slot, but we didn't reuse the existing fiber, so we
@@ -12305,13 +12303,17 @@ function createChildReconciler(shouldTrackSideEffects) {
     if (oldFiber === null) {
       // If we don't have any more existing children we can choose a fast path
       // since the rest will all be insertions.
-      for (; !step.done; newIdx++, step = newChildren.next(), knownKeys = warnOnInvalidKey(step.value, knownKeys, returnFiber) ) {
+      for (; !step.done; newIdx++, step = newChildren.next()) {
         var _newFiber3 = createChild(returnFiber, step.value, lanes, debugInfo);
 
         if (_newFiber3 === null) {
           continue;
         }
 
+        {
+          knownKeys = warnOnInvalidKey(returnFiber, _newFiber3, step.value, knownKeys);
+        }
+
         lastPlacedIndex = placeChild(_newFiber3, lastPlacedIndex, newIdx);
 
         if (previousNewFiber === null) {
@@ -12335,10 +12337,14 @@ function createChildReconciler(shouldTrackSideEffects) {
 
     var existingChildren = mapRemainingChildren(oldFiber); // Keep scanning and use the map to restore deleted items as moves.
 
-    for (; !step.done; newIdx++, step = newChildren.next(), knownKeys = warnOnInvalidKey(step.value, knownKeys, returnFiber) ) {
+    for (; !step.done; newIdx++, step = newChildren.next()) {
       var _newFiber4 = updateFromMap(existingChildren, returnFiber, newIdx, step.value, lanes, debugInfo);
 
       if (_newFiber4 !== null) {
+        {
+          knownKeys = warnOnInvalidKey(returnFiber, _newFiber4, step.value, knownKeys);
+        }
+
         if (shouldTrackSideEffects) {
           if (_newFiber4.alternate !== null) {
             // The new fiber is a work in progress, but if there exists a
@@ -35384,8 +35390,25 @@ function getResource(type, currentProps, pendingProps, currentResource) {
 
             _styles.set(_key, _resource);
 
+            var instance = ownerDocument.querySelector(getStylesheetSelectorFromKey(_key));
+
+            if (instance) {
+              var loadingState = instance._p;
+
+              if (loadingState) ; else {
+                // This instance is already loaded
+                _resource.instance = instance;
+                _resource.state.loading = Loaded | Inserted;
+              }
+            }
+
             if (!preloadPropsMap.has(_key)) {
-              preloadStylesheet(ownerDocument, _key, preloadPropsFromStylesheet(qualifiedProps), _resource.state);
+              var preloadProps = preloadPropsFromStylesheet(qualifiedProps);
+              preloadPropsMap.set(_key, preloadProps);
+
+              if (!instance) {
+                preloadStylesheet(ownerDocument, _key, preloadProps, _resource.state);
+              }
             }
           }
 
@@ -35532,31 +35555,24 @@ function stylesheetPropsFromRawProps(rawProps) {
 }
 
 function preloadStylesheet(ownerDocument, key, preloadProps, state) {
-  preloadPropsMap.set(key, preloadProps);
-
-  if (!ownerDocument.querySelector(getStylesheetSelectorFromKey(key))) {
-    // There is no matching stylesheet instance in the Document.
-    // We will insert a preload now to kick off loading because
-    // we expect this stylesheet to commit
-    var preloadEl = ownerDocument.querySelector(getPreloadStylesheetSelectorFromKey(key));
-
-    if (preloadEl) {
-      // If we find a preload already it was SSR'd and we won't have an actual
-      // loading state to track. For now we will just assume it is loaded
-      state.loading = Loaded;
-    } else {
-      var instance = ownerDocument.createElement('link');
-      state.preload = instance;
-      instance.addEventListener('load', function () {
-        return state.loading |= Loaded;
-      });
-      instance.addEventListener('error', function () {
-        return state.loading |= Errored;
-      });
-      setInitialProperties(instance, 'link', preloadProps);
-      markNodeAsHoistable(instance);
-      ownerDocument.head.appendChild(instance);
-    }
+  var preloadEl = ownerDocument.querySelector(getPreloadStylesheetSelectorFromKey(key));
+
+  if (preloadEl) {
+    // If we find a preload already it was SSR'd and we won't have an actual
+    // loading state to track. For now we will just assume it is loaded
+    state.loading = Loaded;
+  } else {
+    var instance = ownerDocument.createElement('link');
+    state.preload = instance;
+    instance.addEventListener('load', function () {
+      return state.loading |= Loaded;
+    });
+    instance.addEventListener('error', function () {
+      return state.loading |= Errored;
+    });
+    setInitialProperties(instance, 'link', preloadProps);
+    markNodeAsHoistable(instance);
+    ownerDocument.head.appendChild(instance);
   }
 }
 
@@ -36424,7 +36440,7 @@ identifierPrefix, onUncaughtError, onCaughtError, onRecoverableError, transition
   return root;
 }
 
-var ReactVersion = '19.0.0-rc-cc1ec60d0d-20240607';
+var ReactVersion = '19.0.0-rc-20b6f4c0e8-20240607';
 
 // Might add PROFILE later.
 

package/cjs/react-dom-client.production.js

@@ -3082,7 +3082,7 @@ function createChildReconciler(shouldTrackSideEffects) {
         nextOldFiber = null,
         step = newChildren.next();
       null !== oldFiber && !step.done;
-      newIdx++, step = newChildren.next(), null
+      newIdx++, step = newChildren.next()
     ) {
       oldFiber.index > newIdx
         ? ((nextOldFiber = oldFiber), (oldFiber = null))
@@ -3110,7 +3110,7 @@ function createChildReconciler(shouldTrackSideEffects) {
         resultingFirstChild
       );
     if (null === oldFiber) {
-      for (; !step.done; newIdx++, step = newChildren.next(), null)
+      for (; !step.done; newIdx++, step = newChildren.next())
         (step = createChild(returnFiber, step.value, lanes)),
           null !== step &&
             ((currentFirstChild = placeChild(step, currentFirstChild, newIdx)),
@@ -3124,7 +3124,7 @@ function createChildReconciler(shouldTrackSideEffects) {
     for (
       oldFiber = mapRemainingChildren(oldFiber);
       !step.done;
-      newIdx++, step = newChildren.next(), null
+      newIdx++, step = newChildren.next()
     )
       (step = updateFromMap(oldFiber, returnFiber, newIdx, step.value, lanes)),
         null !== step &&
@@ -13413,20 +13413,20 @@ function getResource(type, currentProps, pendingProps, currentResource) {
     case "style":
       return "string" === typeof pendingProps.precedence &&
         "string" === typeof pendingProps.href
-        ? ((pendingProps = getStyleKey(pendingProps.href)),
-          (JSCompiler_inline_result = getResourcesFromRoot(
+        ? ((currentProps = getStyleKey(pendingProps.href)),
+          (pendingProps = getResourcesFromRoot(
             JSCompiler_inline_result
           ).hoistableStyles),
-          (currentProps = JSCompiler_inline_result.get(pendingProps)),
-          currentProps ||
-            ((currentProps = {
+          (currentResource = pendingProps.get(currentProps)),
+          currentResource ||
+            ((currentResource = {
               type: "style",
               instance: null,
               count: 0,
               state: null
             }),
-            JSCompiler_inline_result.set(pendingProps, currentProps)),
-          currentProps)
+            pendingProps.set(currentProps, currentResource)),
+          currentResource)
         : { type: "void", instance: null, count: 0, state: null };
     case "link":
       if (
@@ -13449,22 +13449,31 @@ function getResource(type, currentProps, pendingProps, currentResource) {
             state: { loading: 0, preload: null }
           }),
           styles$229.set(type, resource$230),
+          (styles$229 = JSCompiler_inline_result.querySelector(
+            getStylesheetSelectorFromKey(type)
+          )) &&
+            !styles$229._p &&
+            ((resource$230.instance = styles$229),
+            (resource$230.state.loading = 5)),
           preloadPropsMap.has(type) ||
-            preloadStylesheet(
-              JSCompiler_inline_result,
-              type,
-              {
-                rel: "preload",
-                as: "style",
-                href: pendingProps.href,
-                crossOrigin: pendingProps.crossOrigin,
-                integrity: pendingProps.integrity,
-                media: pendingProps.media,
-                hrefLang: pendingProps.hrefLang,
-                referrerPolicy: pendingProps.referrerPolicy
-              },
-              resource$230.state
-            ));
+            ((pendingProps = {
+              rel: "preload",
+              as: "style",
+              href: pendingProps.href,
+              crossOrigin: pendingProps.crossOrigin,
+              integrity: pendingProps.integrity,
+              media: pendingProps.media,
+              hrefLang: pendingProps.hrefLang,
+              referrerPolicy: pendingProps.referrerPolicy
+            }),
+            preloadPropsMap.set(type, pendingProps),
+            styles$229 ||
+              preloadStylesheet(
+                JSCompiler_inline_result,
+                type,
+                pendingProps,
+                resource$230.state
+              )));
         if (currentProps && null === currentResource)
           throw Error(formatProdErrorMessage(528, ""));
         return resource$230;
@@ -13480,20 +13489,20 @@ function getResource(type, currentProps, pendingProps, currentResource) {
         currentProps &&
         "function" !== typeof currentProps &&
         "symbol" !== typeof currentProps
-          ? ((pendingProps = getScriptKey(pendingProps)),
-            (JSCompiler_inline_result = getResourcesFromRoot(
+          ? ((currentProps = getScriptKey(pendingProps)),
+            (pendingProps = getResourcesFromRoot(
               JSCompiler_inline_result
             ).hoistableScripts),
-            (currentProps = JSCompiler_inline_result.get(pendingProps)),
-            currentProps ||
-              ((currentProps = {
+            (currentResource = pendingProps.get(currentProps)),
+            currentResource ||
+              ((currentResource = {
                 type: "script",
                 instance: null,
                 count: 0,
                 state: null
               }),
-              JSCompiler_inline_result.set(pendingProps, currentProps)),
-            currentProps)
+              pendingProps.set(currentProps, currentResource)),
+            currentResource)
           : { type: "void", instance: null, count: 0, state: null }
       );
     default:
@@ -13513,21 +13522,19 @@ function stylesheetPropsFromRawProps(rawProps) {
   });
 }
 function preloadStylesheet(ownerDocument, key, preloadProps, state) {
-  preloadPropsMap.set(key, preloadProps);
-  ownerDocument.querySelector(getStylesheetSelectorFromKey(key)) ||
-    (ownerDocument.querySelector('link[rel="preload"][as="style"][' + key + "]")
-      ? (state.loading = 1)
-      : ((key = ownerDocument.createElement("link")),
-        (state.preload = key),
-        key.addEventListener("load", function () {
-          return (state.loading |= 1);
-        }),
-        key.addEventListener("error", function () {
-          return (state.loading |= 2);
-        }),
-        setInitialProperties(key, "link", preloadProps),
-        markNodeAsHoistable(key),
-        ownerDocument.head.appendChild(key)));
+  ownerDocument.querySelector('link[rel="preload"][as="style"][' + key + "]")
+    ? (state.loading = 1)
+    : ((key = ownerDocument.createElement("link")),
+      (state.preload = key),
+      key.addEventListener("load", function () {
+        return (state.loading |= 1);
+      }),
+      key.addEventListener("error", function () {
+        return (state.loading |= 2);
+      }),
+      setInitialProperties(key, "link", preloadProps),
+      markNodeAsHoistable(key),
+      ownerDocument.head.appendChild(key));
 }
 function getScriptKey(src) {
   return '[src="' + escapeSelectorAttributeValueInsideDoubleQuotes(src) + '"]';
@@ -14626,14 +14633,14 @@ ReactDOMHydrationRoot.prototype.unstable_scheduleHydration = function (target) {
 };
 var isomorphicReactPackageVersion$jscomp$inline_1651 = React.version;
 if (
-  "19.0.0-rc-cc1ec60d0d-20240607" !==
+  "19.0.0-rc-20b6f4c0e8-20240607" !==
   isomorphicReactPackageVersion$jscomp$inline_1651
 )
   throw Error(
     formatProdErrorMessage(
       527,
       isomorphicReactPackageVersion$jscomp$inline_1651,
-      "19.0.0-rc-cc1ec60d0d-20240607"
+      "19.0.0-rc-20b6f4c0e8-20240607"
     )
   );
 ReactDOMSharedInternals.findDOMNode = function (componentOrElement) {
@@ -14652,7 +14659,7 @@ ReactDOMSharedInternals.findDOMNode = function (componentOrElement) {
 var devToolsConfig$jscomp$inline_1658 = {
   findFiberByHostInstance: getClosestInstanceFromNode,
   bundleType: 0,
-  version: "19.0.0-rc-cc1ec60d0d-20240607",
+  version: "19.0.0-rc-20b6f4c0e8-20240607",
   rendererPackageName: "react-dom"
 };
 var internals$jscomp$inline_2036 = {
@@ -14682,7 +14689,7 @@ var internals$jscomp$inline_2036 = {
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "19.0.0-rc-cc1ec60d0d-20240607"
+  reconcilerVersion: "19.0.0-rc-20b6f4c0e8-20240607"
 };
 if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
   var hook$jscomp$inline_2037 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
@@ -14788,4 +14795,4 @@ exports.hydrateRoot = function (container, initialChildren, options) {
   listenToAllSupportedEvents(container);
   return new ReactDOMHydrationRoot(initialChildren);
 };
-exports.version = "19.0.0-rc-cc1ec60d0d-20240607";
+exports.version = "19.0.0-rc-20b6f4c0e8-20240607";