diff --git a/compiled/facebook-www/REVISION b/compiled/facebook-www/REVISION
index 3c87ef3594564..2893ed166de0a 100644
--- a/compiled/facebook-www/REVISION
+++ b/compiled/facebook-www/REVISION
@@ -1 +1 @@
-db281b3d9cd033cdc3d63e00fc9f3153c03aa70c
+0131d0cff40d4054ac72c857d3a13c5173c46e0a
diff --git a/compiled/facebook-www/React-dev.modern.js b/compiled/facebook-www/React-dev.modern.js
index ae3448924444f..b79edb61aafdb 100644
--- a/compiled/facebook-www/React-dev.modern.js
+++ b/compiled/facebook-www/React-dev.modern.js
@@ -27,7 +27,7 @@ if (
 }
           "use strict";
 
-var ReactVersion = "18.3.0-www-modern-eb67b0a3";
+var ReactVersion = "18.3.0-www-modern-1ad200fa";
 
 // ATTENTION
 // When adding new symbols to this file,
diff --git a/compiled/facebook-www/ReactART-dev.classic.js b/compiled/facebook-www/ReactART-dev.classic.js
index 70038b3383f1f..3e98b0e7d2d0d 100644
--- a/compiled/facebook-www/ReactART-dev.classic.js
+++ b/compiled/facebook-www/ReactART-dev.classic.js
@@ -69,7 +69,7 @@ function _assertThisInitialized(self) {
   return self;
 }
 
-var ReactVersion = "18.3.0-www-classic-5da08f8d";
+var ReactVersion = "18.3.0-www-classic-ca4ffb9c";
 
 var LegacyRoot = 0;
 var ConcurrentRoot = 1;
@@ -2921,6 +2921,10 @@ function unhideTextInstance(textInstance, text) {
 function getInstanceFromNode(node) {
   throw new Error("Not implemented.");
 }
+function preloadInstance(type, props) {
+  // Return true to indicate it's already loaded
+  return true;
+}
 function waitForCommitToBeReady() {
   return null;
 } // eslint-disable-next-line no-undef
@@ -5453,6 +5457,10 @@ var SuspenseException = new Error(
     "unexpected behavior.\n\n" +
     "To handle async errors, wrap your component in an error boundary, or " +
     "call the promise's `.catch` method and pass the result to `use`"
+);
+var SuspenseyCommitException = new Error(
+  "Suspense Exception: This is not a real error, and should not leak into " +
+    "userspace. If you're seeing this, it's likely a bug in React."
 ); // This is a noop thenable that we use to trigger a fallback in throwException.
 // TODO: It would be better to refactor throwException into multiple functions
 // so we can trigger a fallback directly without having to check the type. But
@@ -17636,7 +17644,6 @@ function updateHostComponent(
       // we won't touch this node even if children changed.
       return;
     } // If we get updated because one of our children updated, we don't
-    suspendHostCommitIfNeeded(workInProgress);
     getHostContext(); // TODO: Experiencing an error where oldProps is null. Suggests a host
     // component is hitting the resume path. Figure out why. Possibly
     // related to `hidden`.
@@ -17655,12 +17662,17 @@ function updateHostComponent(
 // that suspend don't have children, so it doesn't matter. But that might not
 // always be true in the future.
 
-function suspendHostCommitIfNeeded(workInProgress, type, props, renderLanes) {
+function preloadInstanceAndSuspendIfNeeded(
+  workInProgress,
+  type,
+  props,
+  renderLanes
+) {
   // Ask the renderer if this instance should suspend the commit.
   {
     // If this flag was set previously, we can remove it. The flag represents
     // whether this particular set of props might ever need to suspend. The
-    // safest thing to do is for shouldSuspendCommit to always return true, but
+    // safest thing to do is for maySuspendCommit to always return true, but
     // if the renderer is reasonably confident that the underlying resource
     // won't be evicted, it can return false as a performance optimization.
     workInProgress.flags &= ~SuspenseyCommit;
@@ -18141,15 +18153,18 @@ function completeWork(current, workInProgress, renderLanes) {
           workInProgress.stateNode = _instance3; // Certain renderers require commit-time effects for initial mount.
         }
 
-        suspendHostCommitIfNeeded(workInProgress);
-
         if (workInProgress.ref !== null) {
           // If there is a ref on a host node we need to schedule a callback
           markRef(workInProgress);
         }
       }
 
-      bubbleProperties(workInProgress);
+      bubbleProperties(workInProgress); // This must come at the very end of the complete phase, because it might
+      // throw to suspend, and if the resource immediately loads, the work loop
+      // will resume rendering as if the work-in-progress completed. So it must
+      // fully complete.
+
+      preloadInstanceAndSuspendIfNeeded(workInProgress);
       return null;
     }
 
@@ -23119,9 +23134,11 @@ var NotSuspended = 0;
 var SuspendedOnError = 1;
 var SuspendedOnData = 2;
 var SuspendedOnImmediate = 3;
-var SuspendedOnDeprecatedThrowPromise = 4;
-var SuspendedAndReadyToContinue = 5;
-var SuspendedOnHydration = 6; // When this is true, the work-in-progress fiber just suspended (or errored) and
+var SuspendedOnInstance = 4;
+var SuspendedOnInstanceAndReadyToContinue = 5;
+var SuspendedOnDeprecatedThrowPromise = 6;
+var SuspendedAndReadyToContinue = 7;
+var SuspendedOnHydration = 8; // When this is true, the work-in-progress fiber just suspended (or errored) and
 // we've yet to unwind the stack. In some cases, we may yield to the main thread
 // after this happens. If the fiber is pinged before we resume, we can retry
 // immediately instead of unwinding the stack.
@@ -24477,6 +24494,9 @@ function handleThrow(root, thrownValue) {
         : // immediately resolved (i.e. in a microtask). Otherwise, trigger the
           // nearest Suspense fallback.
           SuspendedOnImmediate;
+  } else if (thrownValue === SuspenseyCommitException) {
+    thrownValue = getSuspendedThenable();
+    workInProgressSuspendedReason = SuspendedOnInstance;
   } else if (thrownValue === SelectiveHydrationException) {
     // An update flowed into a dehydrated boundary. Before we can apply the
     // update, we need to finish hydrating. Interrupt the work-in-progress
@@ -24847,7 +24867,7 @@ function renderRootConcurrent(root, lanes) {
         var unitOfWork = workInProgress;
         var thrownValue = workInProgressThrownValue;
 
-        switch (workInProgressSuspendedReason) {
+        resumeOrUnwind: switch (workInProgressSuspendedReason) {
           case SuspendedOnError: {
             // Unwind then continue with the normal work loop.
             workInProgressSuspendedReason = NotSuspended;
@@ -24899,6 +24919,12 @@ function renderRootConcurrent(root, lanes) {
             break outer;
           }
 
+          case SuspendedOnInstance: {
+            workInProgressSuspendedReason =
+              SuspendedOnInstanceAndReadyToContinue;
+            break outer;
+          }
+
           case SuspendedAndReadyToContinue: {
             var _thenable = thrownValue;
 
@@ -24917,6 +24943,69 @@ function renderRootConcurrent(root, lanes) {
             break;
           }
 
+          case SuspendedOnInstanceAndReadyToContinue: {
+            switch (workInProgress.tag) {
+              case HostComponent:
+              case HostHoistable:
+              case HostSingleton: {
+                // Before unwinding the stack, check one more time if the
+                // instance is ready. It may have loaded when React yielded to
+                // the main thread.
+                // Assigning this to a constant so Flow knows the binding won't
+                // be mutated by `preloadInstance`.
+                var hostFiber = workInProgress;
+                var type = hostFiber.type;
+                var props = hostFiber.pendingProps;
+                var isReady = preloadInstance(type, props);
+
+                if (isReady) {
+                  // The data resolved. Resume the work loop as if nothing
+                  // suspended. Unlike when a user component suspends, we don't
+                  // have to replay anything because the host fiber
+                  // already completed.
+                  workInProgressSuspendedReason = NotSuspended;
+                  workInProgressThrownValue = null;
+                  var sibling = hostFiber.sibling;
+
+                  if (sibling !== null) {
+                    workInProgress = sibling;
+                  } else {
+                    var returnFiber = hostFiber.return;
+
+                    if (returnFiber !== null) {
+                      workInProgress = returnFiber;
+                      completeUnitOfWork(returnFiber);
+                    } else {
+                      workInProgress = null;
+                    }
+                  }
+
+                  break resumeOrUnwind;
+                }
+
+                break;
+              }
+
+              default: {
+                // This will fail gracefully but it's not correct, so log a
+                // warning in dev.
+                if (true) {
+                  error(
+                    "Unexpected type of fiber triggered a suspensey commit. " +
+                      "This is a bug in React."
+                  );
+                }
+
+                break;
+              }
+            } // Otherwise, unwind then continue with the normal work loop.
+
+            workInProgressSuspendedReason = NotSuspended;
+            workInProgressThrownValue = null;
+            unwindSuspendedUnitOfWork(unitOfWork, thrownValue);
+            break;
+          }
+
           case SuspendedOnDeprecatedThrowPromise: {
             // Suspended by an old implementation that uses the `throw promise`
             // pattern. The newer replaying behavior can cause subtle issues
diff --git a/compiled/facebook-www/ReactART-dev.modern.js b/compiled/facebook-www/ReactART-dev.modern.js
index 72dce412db330..60c8f4a0427e0 100644
--- a/compiled/facebook-www/ReactART-dev.modern.js
+++ b/compiled/facebook-www/ReactART-dev.modern.js
@@ -69,7 +69,7 @@ function _assertThisInitialized(self) {
   return self;
 }
 
-var ReactVersion = "18.3.0-www-modern-d2f1450d";
+var ReactVersion = "18.3.0-www-modern-3f875f9f";
 
 var LegacyRoot = 0;
 var ConcurrentRoot = 1;
@@ -2918,6 +2918,10 @@ function unhideTextInstance(textInstance, text) {
 function getInstanceFromNode(node) {
   throw new Error("Not implemented.");
 }
+function preloadInstance(type, props) {
+  // Return true to indicate it's already loaded
+  return true;
+}
 function waitForCommitToBeReady() {
   return null;
 } // eslint-disable-next-line no-undef
@@ -5209,6 +5213,10 @@ var SuspenseException = new Error(
     "unexpected behavior.\n\n" +
     "To handle async errors, wrap your component in an error boundary, or " +
     "call the promise's `.catch` method and pass the result to `use`"
+);
+var SuspenseyCommitException = new Error(
+  "Suspense Exception: This is not a real error, and should not leak into " +
+    "userspace. If you're seeing this, it's likely a bug in React."
 ); // This is a noop thenable that we use to trigger a fallback in throwException.
 // TODO: It would be better to refactor throwException into multiple functions
 // so we can trigger a fallback directly without having to check the type. But
@@ -17325,7 +17333,6 @@ function updateHostComponent(
       // we won't touch this node even if children changed.
       return;
     } // If we get updated because one of our children updated, we don't
-    suspendHostCommitIfNeeded(workInProgress);
     getHostContext(); // TODO: Experiencing an error where oldProps is null. Suggests a host
     // component is hitting the resume path. Figure out why. Possibly
     // related to `hidden`.
@@ -17344,12 +17351,17 @@ function updateHostComponent(
 // that suspend don't have children, so it doesn't matter. But that might not
 // always be true in the future.
 
-function suspendHostCommitIfNeeded(workInProgress, type, props, renderLanes) {
+function preloadInstanceAndSuspendIfNeeded(
+  workInProgress,
+  type,
+  props,
+  renderLanes
+) {
   // Ask the renderer if this instance should suspend the commit.
   {
     // If this flag was set previously, we can remove it. The flag represents
     // whether this particular set of props might ever need to suspend. The
-    // safest thing to do is for shouldSuspendCommit to always return true, but
+    // safest thing to do is for maySuspendCommit to always return true, but
     // if the renderer is reasonably confident that the underlying resource
     // won't be evicted, it can return false as a performance optimization.
     workInProgress.flags &= ~SuspenseyCommit;
@@ -17823,15 +17835,18 @@ function completeWork(current, workInProgress, renderLanes) {
           workInProgress.stateNode = _instance3; // Certain renderers require commit-time effects for initial mount.
         }
 
-        suspendHostCommitIfNeeded(workInProgress);
-
         if (workInProgress.ref !== null) {
           // If there is a ref on a host node we need to schedule a callback
           markRef(workInProgress);
         }
       }
 
-      bubbleProperties(workInProgress);
+      bubbleProperties(workInProgress); // This must come at the very end of the complete phase, because it might
+      // throw to suspend, and if the resource immediately loads, the work loop
+      // will resume rendering as if the work-in-progress completed. So it must
+      // fully complete.
+
+      preloadInstanceAndSuspendIfNeeded(workInProgress);
       return null;
     }
 
@@ -22779,9 +22794,11 @@ var NotSuspended = 0;
 var SuspendedOnError = 1;
 var SuspendedOnData = 2;
 var SuspendedOnImmediate = 3;
-var SuspendedOnDeprecatedThrowPromise = 4;
-var SuspendedAndReadyToContinue = 5;
-var SuspendedOnHydration = 6; // When this is true, the work-in-progress fiber just suspended (or errored) and
+var SuspendedOnInstance = 4;
+var SuspendedOnInstanceAndReadyToContinue = 5;
+var SuspendedOnDeprecatedThrowPromise = 6;
+var SuspendedAndReadyToContinue = 7;
+var SuspendedOnHydration = 8; // When this is true, the work-in-progress fiber just suspended (or errored) and
 // we've yet to unwind the stack. In some cases, we may yield to the main thread
 // after this happens. If the fiber is pinged before we resume, we can retry
 // immediately instead of unwinding the stack.
@@ -24137,6 +24154,9 @@ function handleThrow(root, thrownValue) {
         : // immediately resolved (i.e. in a microtask). Otherwise, trigger the
           // nearest Suspense fallback.
           SuspendedOnImmediate;
+  } else if (thrownValue === SuspenseyCommitException) {
+    thrownValue = getSuspendedThenable();
+    workInProgressSuspendedReason = SuspendedOnInstance;
   } else if (thrownValue === SelectiveHydrationException) {
     // An update flowed into a dehydrated boundary. Before we can apply the
     // update, we need to finish hydrating. Interrupt the work-in-progress
@@ -24507,7 +24527,7 @@ function renderRootConcurrent(root, lanes) {
         var unitOfWork = workInProgress;
         var thrownValue = workInProgressThrownValue;
 
-        switch (workInProgressSuspendedReason) {
+        resumeOrUnwind: switch (workInProgressSuspendedReason) {
           case SuspendedOnError: {
             // Unwind then continue with the normal work loop.
             workInProgressSuspendedReason = NotSuspended;
@@ -24559,6 +24579,12 @@ function renderRootConcurrent(root, lanes) {
             break outer;
           }
 
+          case SuspendedOnInstance: {
+            workInProgressSuspendedReason =
+              SuspendedOnInstanceAndReadyToContinue;
+            break outer;
+          }
+
           case SuspendedAndReadyToContinue: {
             var _thenable = thrownValue;
 
@@ -24577,6 +24603,69 @@ function renderRootConcurrent(root, lanes) {
             break;
           }
 
+          case SuspendedOnInstanceAndReadyToContinue: {
+            switch (workInProgress.tag) {
+              case HostComponent:
+              case HostHoistable:
+              case HostSingleton: {
+                // Before unwinding the stack, check one more time if the
+                // instance is ready. It may have loaded when React yielded to
+                // the main thread.
+                // Assigning this to a constant so Flow knows the binding won't
+                // be mutated by `preloadInstance`.
+                var hostFiber = workInProgress;
+                var type = hostFiber.type;
+                var props = hostFiber.pendingProps;
+                var isReady = preloadInstance(type, props);
+
+                if (isReady) {
+                  // The data resolved. Resume the work loop as if nothing
+                  // suspended. Unlike when a user component suspends, we don't
+                  // have to replay anything because the host fiber
+                  // already completed.
+                  workInProgressSuspendedReason = NotSuspended;
+                  workInProgressThrownValue = null;
+                  var sibling = hostFiber.sibling;
+
+                  if (sibling !== null) {
+                    workInProgress = sibling;
+                  } else {
+                    var returnFiber = hostFiber.return;
+
+                    if (returnFiber !== null) {
+                      workInProgress = returnFiber;
+                      completeUnitOfWork(returnFiber);
+                    } else {
+                      workInProgress = null;
+                    }
+                  }
+
+                  break resumeOrUnwind;
+                }
+
+                break;
+              }
+
+              default: {
+                // This will fail gracefully but it's not correct, so log a
+                // warning in dev.
+                if (true) {
+                  error(
+                    "Unexpected type of fiber triggered a suspensey commit. " +
+                      "This is a bug in React."
+                  );
+                }
+
+                break;
+              }
+            } // Otherwise, unwind then continue with the normal work loop.
+
+            workInProgressSuspendedReason = NotSuspended;
+            workInProgressThrownValue = null;
+            unwindSuspendedUnitOfWork(unitOfWork, thrownValue);
+            break;
+          }
+
           case SuspendedOnDeprecatedThrowPromise: {
             // Suspended by an old implementation that uses the `throw promise`
             // pattern. The newer replaying behavior can cause subtle issues
diff --git a/compiled/facebook-www/ReactART-prod.classic.js b/compiled/facebook-www/ReactART-prod.classic.js
index 7cf151e3631fc..2592ab8698402 100644
--- a/compiled/facebook-www/ReactART-prod.classic.js
+++ b/compiled/facebook-www/ReactART-prod.classic.js
@@ -1424,6 +1424,7 @@ function describeFiber(fiber) {
   }
 }
 var SuspenseException = Error(formatProdErrorMessage(460)),
+  SuspenseyCommitException = Error(formatProdErrorMessage(474)),
   noopSuspenseyCommitThenable = { then: function () {} };
 function isThenableResolved(thenable) {
   thenable = thenable.status;
@@ -1471,8 +1472,14 @@ function trackUsedThenable(thenableState, thenable, index) {
       throw SuspenseException;
   }
 }
-var suspendedThenable = null,
-  thenableState$1 = null,
+var suspendedThenable = null;
+function getSuspendedThenable() {
+  if (null === suspendedThenable) throw Error(formatProdErrorMessage(459));
+  var thenable = suspendedThenable;
+  suspendedThenable = null;
+  return thenable;
+}
+var thenableState$1 = null,
   thenableIndexCounter$1 = 0;
 function unwrapThenable(thenable) {
   var index = thenableIndexCounter$1;
@@ -5401,8 +5408,7 @@ function completeWork(current, workInProgress, renderLanes) {
       renderLanes = workInProgress.type;
       if (null !== current && null != workInProgress.stateNode)
         current.memoizedProps !== newProps &&
-          ((workInProgress.flags &= -16777217),
-          (workInProgress.updateQueue = UPDATE_SIGNAL)) &&
+          (workInProgress.updateQueue = UPDATE_SIGNAL) &&
           (workInProgress.flags |= 4),
           current.ref !== workInProgress.ref &&
             (workInProgress.flags |= 2097664);
@@ -5463,10 +5469,10 @@ function completeWork(current, workInProgress, renderLanes) {
           renderLanes = renderLanes.sibling;
         }
         workInProgress.stateNode = current;
-        workInProgress.flags &= -16777217;
         null !== workInProgress.ref && (workInProgress.flags |= 2097664);
       }
       bubbleProperties(workInProgress);
+      workInProgress.flags &= -16777217;
       return null;
     case 6:
       if (current && null != workInProgress.stateNode)
@@ -8228,34 +8234,35 @@ function prepareFreshStack(root, lanes) {
 function handleThrow(root, thrownValue) {
   ReactCurrentDispatcher$1.current = ContextOnlyDispatcher;
   ReactCurrentOwner.current = null;
-  if (thrownValue === SuspenseException) {
-    if (null === suspendedThenable) throw Error(formatProdErrorMessage(459));
-    thrownValue = suspendedThenable;
-    suspendedThenable = null;
-    (workInProgressRootRenderLanes & 8388480) === workInProgressRootRenderLanes
-      ? (root = null === shellBoundary ? !0 : !1)
-      : ((root = suspenseHandlerStackCursor.current),
-        (root =
-          null !== root &&
-          (workInProgressRootRenderLanes & 125829120) ===
-            workInProgressRootRenderLanes
-            ? root === shellBoundary
-            : !1));
-    workInProgressSuspendedReason =
-      root &&
-      0 === (workInProgressRootSkippedLanes & 268435455) &&
-      0 === (workInProgressRootInterleavedUpdatedLanes & 268435455)
-        ? 2
-        : 3;
-  } else
-    workInProgressSuspendedReason =
-      thrownValue === SelectiveHydrationException
-        ? 6
-        : null !== thrownValue &&
-          "object" === typeof thrownValue &&
-          "function" === typeof thrownValue.then
-        ? 4
-        : 1;
+  thrownValue === SuspenseException
+    ? ((thrownValue = getSuspendedThenable()),
+      (workInProgressRootRenderLanes & 8388480) ===
+      workInProgressRootRenderLanes
+        ? (root = null === shellBoundary ? !0 : !1)
+        : ((root = suspenseHandlerStackCursor.current),
+          (root =
+            null !== root &&
+            (workInProgressRootRenderLanes & 125829120) ===
+              workInProgressRootRenderLanes
+              ? root === shellBoundary
+              : !1)),
+      (workInProgressSuspendedReason =
+        root &&
+        0 === (workInProgressRootSkippedLanes & 268435455) &&
+        0 === (workInProgressRootInterleavedUpdatedLanes & 268435455)
+          ? 2
+          : 3))
+    : thrownValue === SuspenseyCommitException
+    ? ((thrownValue = getSuspendedThenable()),
+      (workInProgressSuspendedReason = 4))
+    : (workInProgressSuspendedReason =
+        thrownValue === SelectiveHydrationException
+          ? 8
+          : null !== thrownValue &&
+            "object" === typeof thrownValue &&
+            "function" === typeof thrownValue.then
+          ? 6
+          : 1);
   workInProgressThrownValue = thrownValue;
   null === workInProgress &&
     ((workInProgressRootExitStatus = 1),
@@ -8292,7 +8299,7 @@ function renderRootSync(root, lanes) {
         lanes = workInProgress;
         var thrownValue = workInProgressThrownValue;
         switch (workInProgressSuspendedReason) {
-          case 6:
+          case 8:
             resetWorkInProgressStack();
             workInProgressRootExitStatus = 6;
             break a;
@@ -8335,7 +8342,7 @@ function renderRootConcurrent(root, lanes) {
       if (0 !== workInProgressSuspendedReason && null !== workInProgress) {
         lanes = workInProgress;
         var thrownValue = workInProgressThrownValue;
-        switch (workInProgressSuspendedReason) {
+        b: switch (workInProgressSuspendedReason) {
           case 1:
             workInProgressSuspendedReason = 0;
             workInProgressThrownValue = null;
@@ -8351,15 +8358,18 @@ function renderRootConcurrent(root, lanes) {
             lanes = function () {
               2 === workInProgressSuspendedReason &&
                 workInProgressRoot === root &&
-                (workInProgressSuspendedReason = 5);
+                (workInProgressSuspendedReason = 7);
               ensureRootIsScheduled(root, now());
             };
             thrownValue.then(lanes, lanes);
             break a;
           case 3:
+            workInProgressSuspendedReason = 7;
+            break a;
+          case 4:
             workInProgressSuspendedReason = 5;
             break a;
-          case 5:
+          case 7:
             isThenableResolved(thrownValue)
               ? ((workInProgressSuspendedReason = 0),
                 (workInProgressThrownValue = null),
@@ -8368,12 +8378,35 @@ function renderRootConcurrent(root, lanes) {
                 (workInProgressThrownValue = null),
                 unwindSuspendedUnitOfWork(lanes, thrownValue));
             break;
-          case 4:
+          case 5:
+            switch (workInProgress.tag) {
+              case 5:
+              case 26:
+              case 27:
+                lanes = workInProgress;
+                workInProgressSuspendedReason = 0;
+                workInProgressThrownValue = null;
+                var sibling = lanes.sibling;
+                if (null !== sibling) workInProgress = sibling;
+                else {
+                  var returnFiber = lanes.return;
+                  null !== returnFiber
+                    ? ((workInProgress = returnFiber),
+                      completeUnitOfWork(returnFiber))
+                    : (workInProgress = null);
+                }
+                break b;
+            }
             workInProgressSuspendedReason = 0;
             workInProgressThrownValue = null;
             unwindSuspendedUnitOfWork(lanes, thrownValue);
             break;
           case 6:
+            workInProgressSuspendedReason = 0;
+            workInProgressThrownValue = null;
+            unwindSuspendedUnitOfWork(lanes, thrownValue);
+            break;
+          case 8:
             resetWorkInProgressStack();
             workInProgressRootExitStatus = 6;
             break a;
@@ -9907,19 +9940,19 @@ var slice = Array.prototype.slice,
     };
     return Text;
   })(React.Component),
-  devToolsConfig$jscomp$inline_1155 = {
+  devToolsConfig$jscomp$inline_1158 = {
     findFiberByHostInstance: function () {
       return null;
     },
     bundleType: 0,
-    version: "18.3.0-www-classic-ca760418",
+    version: "18.3.0-www-classic-dc41ab8a",
     rendererPackageName: "react-art"
   };
-var internals$jscomp$inline_1334 = {
-  bundleType: devToolsConfig$jscomp$inline_1155.bundleType,
-  version: devToolsConfig$jscomp$inline_1155.version,
-  rendererPackageName: devToolsConfig$jscomp$inline_1155.rendererPackageName,
-  rendererConfig: devToolsConfig$jscomp$inline_1155.rendererConfig,
+var internals$jscomp$inline_1333 = {
+  bundleType: devToolsConfig$jscomp$inline_1158.bundleType,
+  version: devToolsConfig$jscomp$inline_1158.version,
+  rendererPackageName: devToolsConfig$jscomp$inline_1158.rendererPackageName,
+  rendererConfig: devToolsConfig$jscomp$inline_1158.rendererConfig,
   overrideHookState: null,
   overrideHookStateDeletePath: null,
   overrideHookStateRenamePath: null,
@@ -9936,26 +9969,26 @@ var internals$jscomp$inline_1334 = {
     return null === fiber ? null : fiber.stateNode;
   },
   findFiberByHostInstance:
-    devToolsConfig$jscomp$inline_1155.findFiberByHostInstance ||
+    devToolsConfig$jscomp$inline_1158.findFiberByHostInstance ||
     emptyFindFiberByHostInstance,
   findHostInstancesForRefresh: null,
   scheduleRefresh: null,
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-www-classic-ca760418"
+  reconcilerVersion: "18.3.0-www-classic-dc41ab8a"
 };
 if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
-  var hook$jscomp$inline_1335 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
+  var hook$jscomp$inline_1334 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
   if (
-    !hook$jscomp$inline_1335.isDisabled &&
-    hook$jscomp$inline_1335.supportsFiber
+    !hook$jscomp$inline_1334.isDisabled &&
+    hook$jscomp$inline_1334.supportsFiber
   )
     try {
-      (rendererID = hook$jscomp$inline_1335.inject(
-        internals$jscomp$inline_1334
+      (rendererID = hook$jscomp$inline_1334.inject(
+        internals$jscomp$inline_1333
       )),
-        (injectedHook = hook$jscomp$inline_1335);
+        (injectedHook = hook$jscomp$inline_1334);
     } catch (err) {}
 }
 var Path = Mode$1.Path;
diff --git a/compiled/facebook-www/ReactART-prod.modern.js b/compiled/facebook-www/ReactART-prod.modern.js
index 6164551f876cd..c782702af9708 100644
--- a/compiled/facebook-www/ReactART-prod.modern.js
+++ b/compiled/facebook-www/ReactART-prod.modern.js
@@ -1230,6 +1230,7 @@ function describeFiber(fiber) {
   }
 }
 var SuspenseException = Error(formatProdErrorMessage(460)),
+  SuspenseyCommitException = Error(formatProdErrorMessage(474)),
   noopSuspenseyCommitThenable = { then: function () {} };
 function isThenableResolved(thenable) {
   thenable = thenable.status;
@@ -1277,8 +1278,14 @@ function trackUsedThenable(thenableState, thenable, index) {
       throw SuspenseException;
   }
 }
-var suspendedThenable = null,
-  thenableState$1 = null,
+var suspendedThenable = null;
+function getSuspendedThenable() {
+  if (null === suspendedThenable) throw Error(formatProdErrorMessage(459));
+  var thenable = suspendedThenable;
+  suspendedThenable = null;
+  return thenable;
+}
+var thenableState$1 = null,
   thenableIndexCounter$1 = 0;
 function unwrapThenable(thenable) {
   var index = thenableIndexCounter$1;
@@ -5146,8 +5153,7 @@ function completeWork(current, workInProgress, renderLanes) {
       renderLanes = workInProgress.type;
       if (null !== current && null != workInProgress.stateNode)
         current.memoizedProps !== newProps &&
-          ((workInProgress.flags &= -16777217),
-          (workInProgress.updateQueue = UPDATE_SIGNAL)) &&
+          (workInProgress.updateQueue = UPDATE_SIGNAL) &&
           (workInProgress.flags |= 4),
           current.ref !== workInProgress.ref &&
             (workInProgress.flags |= 2097664);
@@ -5208,10 +5214,10 @@ function completeWork(current, workInProgress, renderLanes) {
           renderLanes = renderLanes.sibling;
         }
         workInProgress.stateNode = current;
-        workInProgress.flags &= -16777217;
         null !== workInProgress.ref && (workInProgress.flags |= 2097664);
       }
       bubbleProperties(workInProgress);
+      workInProgress.flags &= -16777217;
       return null;
     case 6:
       if (current && null != workInProgress.stateNode)
@@ -7960,34 +7966,35 @@ function prepareFreshStack(root, lanes) {
 function handleThrow(root, thrownValue) {
   ReactCurrentDispatcher$1.current = ContextOnlyDispatcher;
   ReactCurrentOwner.current = null;
-  if (thrownValue === SuspenseException) {
-    if (null === suspendedThenable) throw Error(formatProdErrorMessage(459));
-    thrownValue = suspendedThenable;
-    suspendedThenable = null;
-    (workInProgressRootRenderLanes & 8388480) === workInProgressRootRenderLanes
-      ? (root = null === shellBoundary ? !0 : !1)
-      : ((root = suspenseHandlerStackCursor.current),
-        (root =
-          null !== root &&
-          (workInProgressRootRenderLanes & 125829120) ===
-            workInProgressRootRenderLanes
-            ? root === shellBoundary
-            : !1));
-    workInProgressSuspendedReason =
-      root &&
-      0 === (workInProgressRootSkippedLanes & 268435455) &&
-      0 === (workInProgressRootInterleavedUpdatedLanes & 268435455)
-        ? 2
-        : 3;
-  } else
-    workInProgressSuspendedReason =
-      thrownValue === SelectiveHydrationException
-        ? 6
-        : null !== thrownValue &&
-          "object" === typeof thrownValue &&
-          "function" === typeof thrownValue.then
-        ? 4
-        : 1;
+  thrownValue === SuspenseException
+    ? ((thrownValue = getSuspendedThenable()),
+      (workInProgressRootRenderLanes & 8388480) ===
+      workInProgressRootRenderLanes
+        ? (root = null === shellBoundary ? !0 : !1)
+        : ((root = suspenseHandlerStackCursor.current),
+          (root =
+            null !== root &&
+            (workInProgressRootRenderLanes & 125829120) ===
+              workInProgressRootRenderLanes
+              ? root === shellBoundary
+              : !1)),
+      (workInProgressSuspendedReason =
+        root &&
+        0 === (workInProgressRootSkippedLanes & 268435455) &&
+        0 === (workInProgressRootInterleavedUpdatedLanes & 268435455)
+          ? 2
+          : 3))
+    : thrownValue === SuspenseyCommitException
+    ? ((thrownValue = getSuspendedThenable()),
+      (workInProgressSuspendedReason = 4))
+    : (workInProgressSuspendedReason =
+        thrownValue === SelectiveHydrationException
+          ? 8
+          : null !== thrownValue &&
+            "object" === typeof thrownValue &&
+            "function" === typeof thrownValue.then
+          ? 6
+          : 1);
   workInProgressThrownValue = thrownValue;
   null === workInProgress &&
     ((workInProgressRootExitStatus = 1),
@@ -8024,7 +8031,7 @@ function renderRootSync(root, lanes) {
         lanes = workInProgress;
         var thrownValue = workInProgressThrownValue;
         switch (workInProgressSuspendedReason) {
-          case 6:
+          case 8:
             resetWorkInProgressStack();
             workInProgressRootExitStatus = 6;
             break a;
@@ -8067,7 +8074,7 @@ function renderRootConcurrent(root, lanes) {
       if (0 !== workInProgressSuspendedReason && null !== workInProgress) {
         lanes = workInProgress;
         var thrownValue = workInProgressThrownValue;
-        switch (workInProgressSuspendedReason) {
+        b: switch (workInProgressSuspendedReason) {
           case 1:
             workInProgressSuspendedReason = 0;
             workInProgressThrownValue = null;
@@ -8083,15 +8090,18 @@ function renderRootConcurrent(root, lanes) {
             lanes = function () {
               2 === workInProgressSuspendedReason &&
                 workInProgressRoot === root &&
-                (workInProgressSuspendedReason = 5);
+                (workInProgressSuspendedReason = 7);
               ensureRootIsScheduled(root, now());
             };
             thrownValue.then(lanes, lanes);
             break a;
           case 3:
+            workInProgressSuspendedReason = 7;
+            break a;
+          case 4:
             workInProgressSuspendedReason = 5;
             break a;
-          case 5:
+          case 7:
             isThenableResolved(thrownValue)
               ? ((workInProgressSuspendedReason = 0),
                 (workInProgressThrownValue = null),
@@ -8100,12 +8110,35 @@ function renderRootConcurrent(root, lanes) {
                 (workInProgressThrownValue = null),
                 unwindSuspendedUnitOfWork(lanes, thrownValue));
             break;
-          case 4:
+          case 5:
+            switch (workInProgress.tag) {
+              case 5:
+              case 26:
+              case 27:
+                lanes = workInProgress;
+                workInProgressSuspendedReason = 0;
+                workInProgressThrownValue = null;
+                var sibling = lanes.sibling;
+                if (null !== sibling) workInProgress = sibling;
+                else {
+                  var returnFiber = lanes.return;
+                  null !== returnFiber
+                    ? ((workInProgress = returnFiber),
+                      completeUnitOfWork(returnFiber))
+                    : (workInProgress = null);
+                }
+                break b;
+            }
             workInProgressSuspendedReason = 0;
             workInProgressThrownValue = null;
             unwindSuspendedUnitOfWork(lanes, thrownValue);
             break;
           case 6:
+            workInProgressSuspendedReason = 0;
+            workInProgressThrownValue = null;
+            unwindSuspendedUnitOfWork(lanes, thrownValue);
+            break;
+          case 8:
             resetWorkInProgressStack();
             workInProgressRootExitStatus = 6;
             break a;
@@ -9572,19 +9605,19 @@ var slice = Array.prototype.slice,
     };
     return Text;
   })(React.Component),
-  devToolsConfig$jscomp$inline_1135 = {
+  devToolsConfig$jscomp$inline_1138 = {
     findFiberByHostInstance: function () {
       return null;
     },
     bundleType: 0,
-    version: "18.3.0-www-modern-e668f810",
+    version: "18.3.0-www-modern-52358352",
     rendererPackageName: "react-art"
   };
-var internals$jscomp$inline_1314 = {
-  bundleType: devToolsConfig$jscomp$inline_1135.bundleType,
-  version: devToolsConfig$jscomp$inline_1135.version,
-  rendererPackageName: devToolsConfig$jscomp$inline_1135.rendererPackageName,
-  rendererConfig: devToolsConfig$jscomp$inline_1135.rendererConfig,
+var internals$jscomp$inline_1313 = {
+  bundleType: devToolsConfig$jscomp$inline_1138.bundleType,
+  version: devToolsConfig$jscomp$inline_1138.version,
+  rendererPackageName: devToolsConfig$jscomp$inline_1138.rendererPackageName,
+  rendererConfig: devToolsConfig$jscomp$inline_1138.rendererConfig,
   overrideHookState: null,
   overrideHookStateDeletePath: null,
   overrideHookStateRenamePath: null,
@@ -9601,26 +9634,26 @@ var internals$jscomp$inline_1314 = {
     return null === fiber ? null : fiber.stateNode;
   },
   findFiberByHostInstance:
-    devToolsConfig$jscomp$inline_1135.findFiberByHostInstance ||
+    devToolsConfig$jscomp$inline_1138.findFiberByHostInstance ||
     emptyFindFiberByHostInstance,
   findHostInstancesForRefresh: null,
   scheduleRefresh: null,
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-www-modern-e668f810"
+  reconcilerVersion: "18.3.0-www-modern-52358352"
 };
 if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
-  var hook$jscomp$inline_1315 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
+  var hook$jscomp$inline_1314 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
   if (
-    !hook$jscomp$inline_1315.isDisabled &&
-    hook$jscomp$inline_1315.supportsFiber
+    !hook$jscomp$inline_1314.isDisabled &&
+    hook$jscomp$inline_1314.supportsFiber
   )
     try {
-      (rendererID = hook$jscomp$inline_1315.inject(
-        internals$jscomp$inline_1314
+      (rendererID = hook$jscomp$inline_1314.inject(
+        internals$jscomp$inline_1313
       )),
-        (injectedHook = hook$jscomp$inline_1315);
+        (injectedHook = hook$jscomp$inline_1314);
     } catch (err) {}
 }
 var Path = Mode$1.Path;
diff --git a/compiled/facebook-www/ReactDOM-dev.classic.js b/compiled/facebook-www/ReactDOM-dev.classic.js
index 6ecaf60e5a5e7..37cbb1ea16d3d 100644
--- a/compiled/facebook-www/ReactDOM-dev.classic.js
+++ b/compiled/facebook-www/ReactDOM-dev.classic.js
@@ -11475,6 +11475,10 @@ function requestPostPaintCallback(callback) {
     });
   });
 }
+function preloadInstance(type, props) {
+  // Return true to indicate it's already loaded
+  return true;
+}
 function waitForCommitToBeReady() {
   return null;
 } // -------------------
@@ -15018,6 +15022,10 @@ var SuspenseException = new Error(
     "unexpected behavior.\n\n" +
     "To handle async errors, wrap your component in an error boundary, or " +
     "call the promise's `.catch` method and pass the result to `use`"
+);
+var SuspenseyCommitException = new Error(
+  "Suspense Exception: This is not a real error, and should not leak into " +
+    "userspace. If you're seeing this, it's likely a bug in React."
 ); // This is a noop thenable that we use to trigger a fallback in throwException.
 // TODO: It would be better to refactor throwException into multiple functions
 // so we can trigger a fallback directly without having to check the type. But
@@ -27629,7 +27637,6 @@ function updateHostComponent(
     // Even better would be if children weren't special cased at all tho.
 
     var instance = workInProgress.stateNode;
-    suspendHostCommitIfNeeded(workInProgress);
     var currentHostContext = getHostContext(); // TODO: Experiencing an error where oldProps is null. Suggests a host
     // component is hitting the resume path. Figure out why. Possibly
     // related to `hidden`.
@@ -27654,12 +27661,17 @@ function updateHostComponent(
 // that suspend don't have children, so it doesn't matter. But that might not
 // always be true in the future.
 
-function suspendHostCommitIfNeeded(workInProgress, type, props, renderLanes) {
+function preloadInstanceAndSuspendIfNeeded(
+  workInProgress,
+  type,
+  props,
+  renderLanes
+) {
   // Ask the renderer if this instance should suspend the commit.
   {
     // If this flag was set previously, we can remove it. The flag represents
     // whether this particular set of props might ever need to suspend. The
-    // safest thing to do is for shouldSuspendCommit to always return true, but
+    // safest thing to do is for maySuspendCommit to always return true, but
     // if the renderer is reasonably confident that the underlying resource
     // won't be evicted, it can return false as a performance optimization.
     workInProgress.flags &= ~SuspenseyCommit;
@@ -28140,7 +28152,12 @@ function completeWork(current, workInProgress, renderLanes) {
           );
         }
 
-        bubbleProperties(workInProgress);
+        bubbleProperties(workInProgress); // This must come at the very end of the complete phase, because it might
+        // throw to suspend, and if the resource immediately loads, the work loop
+        // will resume rendering as if the work-in-progress completed. So it must
+        // fully complete.
+
+        preloadInstanceAndSuspendIfNeeded(workInProgress);
         return null;
       }
     }
@@ -28268,15 +28285,18 @@ function completeWork(current, workInProgress, renderLanes) {
           }
         }
 
-        suspendHostCommitIfNeeded(workInProgress);
-
         if (workInProgress.ref !== null) {
           // If there is a ref on a host node we need to schedule a callback
           markRef(workInProgress);
         }
       }
 
-      bubbleProperties(workInProgress);
+      bubbleProperties(workInProgress); // This must come at the very end of the complete phase, because it might
+      // throw to suspend, and if the resource immediately loads, the work loop
+      // will resume rendering as if the work-in-progress completed. So it must
+      // fully complete.
+
+      preloadInstanceAndSuspendIfNeeded(workInProgress);
       return null;
     }
 
@@ -33639,9 +33659,11 @@ var NotSuspended = 0;
 var SuspendedOnError = 1;
 var SuspendedOnData = 2;
 var SuspendedOnImmediate = 3;
-var SuspendedOnDeprecatedThrowPromise = 4;
-var SuspendedAndReadyToContinue = 5;
-var SuspendedOnHydration = 6; // When this is true, the work-in-progress fiber just suspended (or errored) and
+var SuspendedOnInstance = 4;
+var SuspendedOnInstanceAndReadyToContinue = 5;
+var SuspendedOnDeprecatedThrowPromise = 6;
+var SuspendedAndReadyToContinue = 7;
+var SuspendedOnHydration = 8; // When this is true, the work-in-progress fiber just suspended (or errored) and
 // we've yet to unwind the stack. In some cases, we may yield to the main thread
 // after this happens. If the fiber is pinged before we resume, we can retry
 // immediately instead of unwinding the stack.
@@ -35068,6 +35090,9 @@ function handleThrow(root, thrownValue) {
         : // immediately resolved (i.e. in a microtask). Otherwise, trigger the
           // nearest Suspense fallback.
           SuspendedOnImmediate;
+  } else if (thrownValue === SuspenseyCommitException) {
+    thrownValue = getSuspendedThenable();
+    workInProgressSuspendedReason = SuspendedOnInstance;
   } else if (thrownValue === SelectiveHydrationException) {
     // An update flowed into a dehydrated boundary. Before we can apply the
     // update, we need to finish hydrating. Interrupt the work-in-progress
@@ -35440,7 +35465,7 @@ function renderRootConcurrent(root, lanes) {
         var unitOfWork = workInProgress;
         var thrownValue = workInProgressThrownValue;
 
-        switch (workInProgressSuspendedReason) {
+        resumeOrUnwind: switch (workInProgressSuspendedReason) {
           case SuspendedOnError: {
             // Unwind then continue with the normal work loop.
             workInProgressSuspendedReason = NotSuspended;
@@ -35492,6 +35517,12 @@ function renderRootConcurrent(root, lanes) {
             break outer;
           }
 
+          case SuspendedOnInstance: {
+            workInProgressSuspendedReason =
+              SuspendedOnInstanceAndReadyToContinue;
+            break outer;
+          }
+
           case SuspendedAndReadyToContinue: {
             var _thenable = thrownValue;
 
@@ -35510,6 +35541,69 @@ function renderRootConcurrent(root, lanes) {
             break;
           }
 
+          case SuspendedOnInstanceAndReadyToContinue: {
+            switch (workInProgress.tag) {
+              case HostComponent:
+              case HostHoistable:
+              case HostSingleton: {
+                // Before unwinding the stack, check one more time if the
+                // instance is ready. It may have loaded when React yielded to
+                // the main thread.
+                // Assigning this to a constant so Flow knows the binding won't
+                // be mutated by `preloadInstance`.
+                var hostFiber = workInProgress;
+                var type = hostFiber.type;
+                var props = hostFiber.pendingProps;
+                var isReady = preloadInstance(type, props);
+
+                if (isReady) {
+                  // The data resolved. Resume the work loop as if nothing
+                  // suspended. Unlike when a user component suspends, we don't
+                  // have to replay anything because the host fiber
+                  // already completed.
+                  workInProgressSuspendedReason = NotSuspended;
+                  workInProgressThrownValue = null;
+                  var sibling = hostFiber.sibling;
+
+                  if (sibling !== null) {
+                    workInProgress = sibling;
+                  } else {
+                    var returnFiber = hostFiber.return;
+
+                    if (returnFiber !== null) {
+                      workInProgress = returnFiber;
+                      completeUnitOfWork(returnFiber);
+                    } else {
+                      workInProgress = null;
+                    }
+                  }
+
+                  break resumeOrUnwind;
+                }
+
+                break;
+              }
+
+              default: {
+                // This will fail gracefully but it's not correct, so log a
+                // warning in dev.
+                if (true) {
+                  error(
+                    "Unexpected type of fiber triggered a suspensey commit. " +
+                      "This is a bug in React."
+                  );
+                }
+
+                break;
+              }
+            } // Otherwise, unwind then continue with the normal work loop.
+
+            workInProgressSuspendedReason = NotSuspended;
+            workInProgressThrownValue = null;
+            unwindSuspendedUnitOfWork(unitOfWork, thrownValue);
+            break;
+          }
+
           case SuspendedOnDeprecatedThrowPromise: {
             // Suspended by an old implementation that uses the `throw promise`
             // pattern. The newer replaying behavior can cause subtle issues
@@ -38490,7 +38584,7 @@ function createFiberRoot(
   return root;
 }
 
-var ReactVersion = "18.3.0-www-classic-11721f2c";
+var ReactVersion = "18.3.0-www-classic-adde0958";
 
 function createPortal$1(
   children,
diff --git a/compiled/facebook-www/ReactDOM-dev.modern.js b/compiled/facebook-www/ReactDOM-dev.modern.js
index 52c3441b567bb..3edc841fa1c97 100644
--- a/compiled/facebook-www/ReactDOM-dev.modern.js
+++ b/compiled/facebook-www/ReactDOM-dev.modern.js
@@ -9908,6 +9908,10 @@ var SuspenseException = new Error(
     "unexpected behavior.\n\n" +
     "To handle async errors, wrap your component in an error boundary, or " +
     "call the promise's `.catch` method and pass the result to `use`"
+);
+var SuspenseyCommitException = new Error(
+  "Suspense Exception: This is not a real error, and should not leak into " +
+    "userspace. If you're seeing this, it's likely a bug in React."
 ); // This is a noop thenable that we use to trigger a fallback in throwException.
 // TODO: It would be better to refactor throwException into multiple functions
 // so we can trigger a fallback directly without having to check the type. But
@@ -22454,7 +22458,6 @@ function updateHostComponent(
     // Even better would be if children weren't special cased at all tho.
 
     var instance = workInProgress.stateNode;
-    suspendHostCommitIfNeeded(workInProgress);
     var currentHostContext = getHostContext(); // TODO: Experiencing an error where oldProps is null. Suggests a host
     // component is hitting the resume path. Figure out why. Possibly
     // related to `hidden`.
@@ -22479,12 +22482,17 @@ function updateHostComponent(
 // that suspend don't have children, so it doesn't matter. But that might not
 // always be true in the future.
 
-function suspendHostCommitIfNeeded(workInProgress, type, props, renderLanes) {
+function preloadInstanceAndSuspendIfNeeded(
+  workInProgress,
+  type,
+  props,
+  renderLanes
+) {
   // Ask the renderer if this instance should suspend the commit.
   {
     // If this flag was set previously, we can remove it. The flag represents
     // whether this particular set of props might ever need to suspend. The
-    // safest thing to do is for shouldSuspendCommit to always return true, but
+    // safest thing to do is for maySuspendCommit to always return true, but
     // if the renderer is reasonably confident that the underlying resource
     // won't be evicted, it can return false as a performance optimization.
     workInProgress.flags &= ~SuspenseyCommit;
@@ -22958,7 +22966,12 @@ function completeWork(current, workInProgress, renderLanes) {
           );
         }
 
-        bubbleProperties(workInProgress);
+        bubbleProperties(workInProgress); // This must come at the very end of the complete phase, because it might
+        // throw to suspend, and if the resource immediately loads, the work loop
+        // will resume rendering as if the work-in-progress completed. So it must
+        // fully complete.
+
+        preloadInstanceAndSuspendIfNeeded(workInProgress);
         return null;
       }
     }
@@ -23086,15 +23099,18 @@ function completeWork(current, workInProgress, renderLanes) {
           }
         }
 
-        suspendHostCommitIfNeeded(workInProgress);
-
         if (workInProgress.ref !== null) {
           // If there is a ref on a host node we need to schedule a callback
           markRef(workInProgress);
         }
       }
 
-      bubbleProperties(workInProgress);
+      bubbleProperties(workInProgress); // This must come at the very end of the complete phase, because it might
+      // throw to suspend, and if the resource immediately loads, the work loop
+      // will resume rendering as if the work-in-progress completed. So it must
+      // fully complete.
+
+      preloadInstanceAndSuspendIfNeeded(workInProgress);
       return null;
     }
 
@@ -28435,9 +28451,11 @@ var NotSuspended = 0;
 var SuspendedOnError = 1;
 var SuspendedOnData = 2;
 var SuspendedOnImmediate = 3;
-var SuspendedOnDeprecatedThrowPromise = 4;
-var SuspendedAndReadyToContinue = 5;
-var SuspendedOnHydration = 6; // When this is true, the work-in-progress fiber just suspended (or errored) and
+var SuspendedOnInstance = 4;
+var SuspendedOnInstanceAndReadyToContinue = 5;
+var SuspendedOnDeprecatedThrowPromise = 6;
+var SuspendedAndReadyToContinue = 7;
+var SuspendedOnHydration = 8; // When this is true, the work-in-progress fiber just suspended (or errored) and
 // we've yet to unwind the stack. In some cases, we may yield to the main thread
 // after this happens. If the fiber is pinged before we resume, we can retry
 // immediately instead of unwinding the stack.
@@ -29864,6 +29882,9 @@ function handleThrow(root, thrownValue) {
         : // immediately resolved (i.e. in a microtask). Otherwise, trigger the
           // nearest Suspense fallback.
           SuspendedOnImmediate;
+  } else if (thrownValue === SuspenseyCommitException) {
+    thrownValue = getSuspendedThenable();
+    workInProgressSuspendedReason = SuspendedOnInstance;
   } else if (thrownValue === SelectiveHydrationException) {
     // An update flowed into a dehydrated boundary. Before we can apply the
     // update, we need to finish hydrating. Interrupt the work-in-progress
@@ -30236,7 +30257,7 @@ function renderRootConcurrent(root, lanes) {
         var unitOfWork = workInProgress;
         var thrownValue = workInProgressThrownValue;
 
-        switch (workInProgressSuspendedReason) {
+        resumeOrUnwind: switch (workInProgressSuspendedReason) {
           case SuspendedOnError: {
             // Unwind then continue with the normal work loop.
             workInProgressSuspendedReason = NotSuspended;
@@ -30288,6 +30309,12 @@ function renderRootConcurrent(root, lanes) {
             break outer;
           }
 
+          case SuspendedOnInstance: {
+            workInProgressSuspendedReason =
+              SuspendedOnInstanceAndReadyToContinue;
+            break outer;
+          }
+
           case SuspendedAndReadyToContinue: {
             var _thenable = thrownValue;
 
@@ -30306,6 +30333,69 @@ function renderRootConcurrent(root, lanes) {
             break;
           }
 
+          case SuspendedOnInstanceAndReadyToContinue: {
+            switch (workInProgress.tag) {
+              case HostComponent:
+              case HostHoistable:
+              case HostSingleton: {
+                // Before unwinding the stack, check one more time if the
+                // instance is ready. It may have loaded when React yielded to
+                // the main thread.
+                // Assigning this to a constant so Flow knows the binding won't
+                // be mutated by `preloadInstance`.
+                var hostFiber = workInProgress;
+                var type = hostFiber.type;
+                var props = hostFiber.pendingProps;
+                var isReady = preloadInstance(type, props);
+
+                if (isReady) {
+                  // The data resolved. Resume the work loop as if nothing
+                  // suspended. Unlike when a user component suspends, we don't
+                  // have to replay anything because the host fiber
+                  // already completed.
+                  workInProgressSuspendedReason = NotSuspended;
+                  workInProgressThrownValue = null;
+                  var sibling = hostFiber.sibling;
+
+                  if (sibling !== null) {
+                    workInProgress = sibling;
+                  } else {
+                    var returnFiber = hostFiber.return;
+
+                    if (returnFiber !== null) {
+                      workInProgress = returnFiber;
+                      completeUnitOfWork(returnFiber);
+                    } else {
+                      workInProgress = null;
+                    }
+                  }
+
+                  break resumeOrUnwind;
+                }
+
+                break;
+              }
+
+              default: {
+                // This will fail gracefully but it's not correct, so log a
+                // warning in dev.
+                if (true) {
+                  error(
+                    "Unexpected type of fiber triggered a suspensey commit. " +
+                      "This is a bug in React."
+                  );
+                }
+
+                break;
+              }
+            } // Otherwise, unwind then continue with the normal work loop.
+
+            workInProgressSuspendedReason = NotSuspended;
+            workInProgressThrownValue = null;
+            unwindSuspendedUnitOfWork(unitOfWork, thrownValue);
+            break;
+          }
+
           case SuspendedOnDeprecatedThrowPromise: {
             // Suspended by an old implementation that uses the `throw promise`
             // pattern. The newer replaying behavior can cause subtle issues
@@ -33286,7 +33376,7 @@ function createFiberRoot(
   return root;
 }
 
-var ReactVersion = "18.3.0-www-modern-e668f810";
+var ReactVersion = "18.3.0-www-modern-52358352";
 
 function createPortal$1(
   children,
@@ -42531,6 +42621,10 @@ function requestPostPaintCallback(callback) {
     });
   });
 }
+function preloadInstance(type, props) {
+  // Return true to indicate it's already loaded
+  return true;
+}
 function waitForCommitToBeReady() {
   return null;
 } // -------------------
diff --git a/compiled/facebook-www/ReactDOM-prod.classic.js b/compiled/facebook-www/ReactDOM-prod.classic.js
index c37c9f1bee57b..5c6cf15eecbdc 100644
--- a/compiled/facebook-www/ReactDOM-prod.classic.js
+++ b/compiled/facebook-www/ReactDOM-prod.classic.js
@@ -2127,12 +2127,12 @@ function preinit$1(href, options) {
       switch (as) {
         case "style":
           as = getResourcesFromRoot(resourceRoot).hoistableStyles;
-          var key$19 = getStyleKey(href),
+          var key$22 = getStyleKey(href),
             precedence = options.precedence || "default",
-            resource = as.get(key$19);
+            resource = as.get(key$22);
           if (resource) break;
           resource = resourceRoot.querySelector(
-            getStylesheetSelectorFromKey(key$19)
+            getStylesheetSelectorFromKey(key$22)
           );
           resource ||
             ((href = {
@@ -2141,7 +2141,7 @@ function preinit$1(href, options) {
               "data-precedence": precedence,
               crossOrigin: options.crossOrigin
             }),
-            (options = preloadPropsMap.get(key$19)) &&
+            (options = preloadPropsMap.get(key$22)) &&
               adoptPreloadPropsForStylesheet(href, options),
             (resource = (
               resourceRoot.ownerDocument || resourceRoot
@@ -2150,15 +2150,15 @@ function preinit$1(href, options) {
             setInitialProperties(resource, "link", href),
             insertStylesheet(resource, precedence, resourceRoot));
           resource = { type: "stylesheet", instance: resource, count: 1 };
-          as.set(key$19, resource);
+          as.set(key$22, resource);
           break;
         case "script":
           (as = getResourcesFromRoot(resourceRoot).hoistableScripts),
-            (key$19 = getScriptKey(href)),
-            (precedence = as.get(key$19)),
+            (key$22 = getScriptKey(href)),
+            (precedence = as.get(key$22)),
             precedence ||
               ((precedence = resourceRoot.querySelector(
-                "script[async]" + key$19
+                "script[async]" + key$22
               )),
               precedence ||
                 ((href = {
@@ -2167,7 +2167,7 @@ function preinit$1(href, options) {
                   crossOrigin: options.crossOrigin,
                   integrity: options.integrity
                 }),
-                (options = preloadPropsMap.get(key$19)) &&
+                (options = preloadPropsMap.get(key$22)) &&
                   adoptPreloadPropsForScript(href, options),
                 (options = resourceRoot.ownerDocument || resourceRoot),
                 (precedence = options.createElement("script")),
@@ -2175,13 +2175,13 @@ function preinit$1(href, options) {
                 setInitialProperties(precedence, "link", href),
                 options.head.appendChild(precedence)),
               (precedence = { type: "script", instance: precedence, count: 1 }),
-              as.set(key$19, precedence));
+              as.set(key$22, precedence));
       }
     else if ("style" === as || "script" === as)
       if ((resourceRoot = getDocumentForPreloads())) {
-        key$19 = escapeSelectorAttributeValueInsideDoubleQuotes(href);
-        precedence = key$19 =
-          'link[rel="preload"][as="' + as + '"][href="' + key$19 + '"]';
+        key$22 = escapeSelectorAttributeValueInsideDoubleQuotes(href);
+        precedence = key$22 =
+          'link[rel="preload"][as="' + as + '"][href="' + key$22 + '"]';
         switch (as) {
           case "style":
             precedence = getStyleKey(href);
@@ -2198,7 +2198,7 @@ function preinit$1(href, options) {
             integrity: options.integrity
           }),
           preloadPropsMap.set(precedence, href),
-          null === resourceRoot.querySelector(key$19) &&
+          null === resourceRoot.querySelector(key$22) &&
             ((options = resourceRoot.createElement("link")),
             setInitialProperties(options, "link", href),
             markNodeAsHoistable(options),
@@ -2230,14 +2230,14 @@ function getResource(type, currentProps, pendingProps) {
         "string" === typeof pendingProps.href &&
         "string" === typeof pendingProps.precedence
       ) {
-        var key$26 = getStyleKey(pendingProps.href),
-          styles$27 = getResourcesFromRoot(currentProps).hoistableStyles;
-        type = styles$27.get(key$26);
+        var key$29 = getStyleKey(pendingProps.href),
+          styles$30 = getResourcesFromRoot(currentProps).hoistableStyles;
+        type = styles$30.get(key$29);
         type ||
           ((currentProps = currentProps.ownerDocument || currentProps),
           (type = { type: "stylesheet", instance: null, count: 0 }),
-          styles$27.set(key$26, type),
-          preloadPropsMap.has(key$26) ||
+          styles$30.set(key$29, type),
+          preloadPropsMap.has(key$29) ||
             ((pendingProps = {
               rel: "preload",
               as: "style",
@@ -2248,16 +2248,16 @@ function getResource(type, currentProps, pendingProps) {
               hrefLang: pendingProps.hrefLang,
               referrerPolicy: pendingProps.referrerPolicy
             }),
-            preloadPropsMap.set(key$26, pendingProps),
-            currentProps.querySelector(getStylesheetSelectorFromKey(key$26)) ||
+            preloadPropsMap.set(key$29, pendingProps),
+            currentProps.querySelector(getStylesheetSelectorFromKey(key$29)) ||
               null !==
                 currentProps.querySelector(
-                  'link[rel="preload"][as="style"][' + key$26 + "]"
+                  'link[rel="preload"][as="style"][' + key$29 + "]"
                 ) ||
-              ((key$26 = currentProps.createElement("link")),
-              setInitialProperties(key$26, "link", pendingProps),
-              markNodeAsHoistable(key$26),
-              currentProps.head.appendChild(key$26))));
+              ((key$29 = currentProps.createElement("link")),
+              setInitialProperties(key$29, "link", pendingProps),
+              markNodeAsHoistable(key$29),
+              currentProps.head.appendChild(key$29))));
         return type;
       }
       return null;
@@ -2307,14 +2307,14 @@ function acquireResource(hoistableRoot, resource, props) {
         return (resource.instance = key);
       case "stylesheet":
         styleProps = getStyleKey(props.href);
-        var instance$33 = hoistableRoot.querySelector(
+        var instance$37 = hoistableRoot.querySelector(
           getStylesheetSelectorFromKey(styleProps)
         );
-        if (instance$33)
+        if (instance$37)
           return (
-            (resource.instance = instance$33),
-            markNodeAsHoistable(instance$33),
-            instance$33
+            (resource.instance = instance$37),
+            markNodeAsHoistable(instance$37),
+            instance$37
           );
         key = assign({}, props, {
           "data-precedence": props.precedence,
@@ -2322,11 +2322,11 @@ function acquireResource(hoistableRoot, resource, props) {
         });
         (styleProps = preloadPropsMap.get(styleProps)) &&
           adoptPreloadPropsForStylesheet(key, styleProps);
-        instance$33 = (
+        instance$37 = (
           hoistableRoot.ownerDocument || hoistableRoot
         ).createElement("link");
-        markNodeAsHoistable(instance$33);
-        var linkInstance = instance$33;
+        markNodeAsHoistable(instance$37);
+        var linkInstance = instance$37;
         linkInstance._p = new Promise(function (resolve, reject) {
           linkInstance.onload = resolve;
           linkInstance.onerror = reject;
@@ -2338,14 +2338,14 @@ function acquireResource(hoistableRoot, resource, props) {
             return (linkInstance._p.s = "e");
           }
         );
-        setInitialProperties(instance$33, "link", key);
-        insertStylesheet(instance$33, props.precedence, hoistableRoot);
-        return (resource.instance = instance$33);
+        setInitialProperties(instance$37, "link", key);
+        insertStylesheet(instance$37, props.precedence, hoistableRoot);
+        return (resource.instance = instance$37);
       case "script":
-        instance$33 = getScriptKey(props.src);
+        instance$37 = getScriptKey(props.src);
         if (
           (styleProps = hoistableRoot.querySelector(
-            "script[async]" + instance$33
+            "script[async]" + instance$37
           ))
         )
           return (
@@ -2354,7 +2354,7 @@ function acquireResource(hoistableRoot, resource, props) {
             styleProps
           );
         key = props;
-        if ((styleProps = preloadPropsMap.get(instance$33)))
+        if ((styleProps = preloadPropsMap.get(instance$37)))
           (key = assign({}, props)),
             adoptPreloadPropsForScript(key, styleProps);
         hoistableRoot = hoistableRoot.ownerDocument || hoistableRoot;
@@ -3646,6 +3646,7 @@ function shallowEqual(objA, objB) {
   return !0;
 }
 var SuspenseException = Error(formatProdErrorMessage(460)),
+  SuspenseyCommitException = Error(formatProdErrorMessage(474)),
   noopSuspenseyCommitThenable = { then: function () {} };
 function isThenableResolved(thenable) {
   thenable = thenable.status;
@@ -3693,8 +3694,14 @@ function trackUsedThenable(thenableState, thenable, index) {
       throw SuspenseException;
   }
 }
-var suspendedThenable = null,
-  thenableState$1 = null,
+var suspendedThenable = null;
+function getSuspendedThenable() {
+  if (null === suspendedThenable) throw Error(formatProdErrorMessage(459));
+  var thenable = suspendedThenable;
+  suspendedThenable = null;
+  return thenable;
+}
+var thenableState$1 = null,
   thenableIndexCounter$1 = 0;
 function unwrapThenable(thenable) {
   var index = thenableIndexCounter$1;
@@ -4697,10 +4704,10 @@ createFunctionComponentUpdateQueue = function () {
 function use(usable) {
   if (null !== usable && "object" === typeof usable) {
     if ("function" === typeof usable.then) {
-      var index$73 = thenableIndexCounter;
+      var index$77 = thenableIndexCounter;
       thenableIndexCounter += 1;
       null === thenableState && (thenableState = []);
-      usable = trackUsedThenable(thenableState, usable, index$73);
+      usable = trackUsedThenable(thenableState, usable, index$77);
       null === currentlyRenderingFiber$1.alternate &&
         (null === workInProgressHook
           ? null === currentlyRenderingFiber$1.memoizedState
@@ -5192,16 +5199,16 @@ function refreshCache(fiber, seedKey, seedValue) {
       case 3:
         var lane = requestUpdateLane(provider);
         fiber = createUpdate(lane);
-        var root$79 = enqueueUpdate(provider, fiber, lane);
-        if (null !== root$79) {
+        var root$83 = enqueueUpdate(provider, fiber, lane);
+        if (null !== root$83) {
           var eventTime = requestEventTime();
-          scheduleUpdateOnFiber(root$79, provider, lane, eventTime);
-          entangleTransitions(root$79, provider, lane);
+          scheduleUpdateOnFiber(root$83, provider, lane, eventTime);
+          entangleTransitions(root$83, provider, lane);
         }
         provider = createCache();
         null !== seedKey &&
           void 0 !== seedKey &&
-          null !== root$79 &&
+          null !== root$83 &&
           provider.data.set(seedKey, seedValue);
         fiber.payload = { cache: provider };
         return;
@@ -5408,15 +5415,15 @@ var HooksDispatcherOnMount = {
       getServerSnapshot = getServerSnapshot();
     } else {
       getServerSnapshot = getSnapshot();
-      var root$75 = workInProgressRoot;
-      if (null === root$75) throw Error(formatProdErrorMessage(349));
-      includesBlockingLane(root$75, renderLanes$1) ||
+      var root$79 = workInProgressRoot;
+      if (null === root$79) throw Error(formatProdErrorMessage(349));
+      includesBlockingLane(root$79, renderLanes$1) ||
         pushStoreConsistencyCheck(fiber, getSnapshot, getServerSnapshot);
     }
     hook.memoizedState = getServerSnapshot;
-    root$75 = { value: getServerSnapshot, getSnapshot: getSnapshot };
-    hook.queue = root$75;
-    mountEffect(subscribeToStore.bind(null, fiber, root$75, subscribe), [
+    root$79 = { value: getServerSnapshot, getSnapshot: getSnapshot };
+    hook.queue = root$79;
+    mountEffect(subscribeToStore.bind(null, fiber, root$79, subscribe), [
       subscribe
     ]);
     fiber.flags |= 2048;
@@ -5425,7 +5432,7 @@ var HooksDispatcherOnMount = {
       updateStoreInstance.bind(
         null,
         fiber,
-        root$75,
+        root$79,
         getServerSnapshot,
         getSnapshot
       ),
@@ -5924,10 +5931,10 @@ var markerInstanceStack = createCursor(null);
 function pushRootMarkerInstance(workInProgress) {
   if (enableTransitionTracing) {
     var transitions = workInProgressTransitions,
-      root$90 = workInProgress.stateNode;
+      root$94 = workInProgress.stateNode;
     null !== transitions &&
       transitions.forEach(function (transition) {
-        if (!root$90.incompleteTransitions.has(transition)) {
+        if (!root$94.incompleteTransitions.has(transition)) {
           var markerInstance = {
             tag: 0,
             transitions: new Set([transition]),
@@ -5935,11 +5942,11 @@ function pushRootMarkerInstance(workInProgress) {
             aborts: null,
             name: null
           };
-          root$90.incompleteTransitions.set(transition, markerInstance);
+          root$94.incompleteTransitions.set(transition, markerInstance);
         }
       });
     var markerInstances = [];
-    root$90.incompleteTransitions.forEach(function (markerInstance) {
+    root$94.incompleteTransitions.forEach(function (markerInstance) {
       markerInstances.push(markerInstance);
     });
     push(markerInstanceStack, markerInstances);
@@ -6639,14 +6646,14 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) {
   }
   JSCompiler_temp = current.memoizedState;
   if (null !== JSCompiler_temp) {
-    var dehydrated$97 = JSCompiler_temp.dehydrated;
-    if (null !== dehydrated$97)
+    var dehydrated$101 = JSCompiler_temp.dehydrated;
+    if (null !== dehydrated$101)
       return updateDehydratedSuspenseComponent(
         current,
         workInProgress,
         didSuspend,
         nextProps,
-        dehydrated$97,
+        dehydrated$101,
         JSCompiler_temp,
         renderLanes
       );
@@ -6656,7 +6663,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) {
     showFallback = nextProps.fallback;
     didSuspend = workInProgress.mode;
     JSCompiler_temp = current.child;
-    dehydrated$97 = JSCompiler_temp.sibling;
+    dehydrated$101 = JSCompiler_temp.sibling;
     var primaryChildProps = { mode: "hidden", children: nextProps.children };
     0 === (didSuspend & 1) && workInProgress.child !== JSCompiler_temp
       ? ((nextProps = workInProgress.child),
@@ -6665,8 +6672,8 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) {
         (workInProgress.deletions = null))
       : ((nextProps = createWorkInProgress(JSCompiler_temp, primaryChildProps)),
         (nextProps.subtreeFlags = JSCompiler_temp.subtreeFlags & 31457280));
-    null !== dehydrated$97
-      ? (showFallback = createWorkInProgress(dehydrated$97, showFallback))
+    null !== dehydrated$101
+      ? (showFallback = createWorkInProgress(dehydrated$101, showFallback))
       : ((showFallback = createFiberFromFragment(
           showFallback,
           didSuspend,
@@ -6685,10 +6692,10 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) {
       ? (didSuspend = mountSuspenseOffscreenState(renderLanes))
       : ((JSCompiler_temp = didSuspend.cachePool),
         null !== JSCompiler_temp
-          ? ((dehydrated$97 = CacheContext._currentValue),
+          ? ((dehydrated$101 = CacheContext._currentValue),
             (JSCompiler_temp =
-              JSCompiler_temp.parent !== dehydrated$97
-                ? { parent: dehydrated$97, pool: dehydrated$97 }
+              JSCompiler_temp.parent !== dehydrated$101
+                ? { parent: dehydrated$101, pool: dehydrated$101 }
                 : JSCompiler_temp))
           : (JSCompiler_temp = getSuspendedCache()),
         (didSuspend = {
@@ -6702,23 +6709,23 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) {
         ((JSCompiler_temp = enableTransitionTracing
           ? markerInstanceStack.current
           : null),
-        (dehydrated$97 = showFallback.updateQueue),
+        (dehydrated$101 = showFallback.updateQueue),
         (primaryChildProps = current.updateQueue),
-        null === dehydrated$97
+        null === dehydrated$101
           ? (showFallback.updateQueue = {
               transitions: didSuspend,
               markerInstances: JSCompiler_temp,
               retryQueue: null
             })
-          : dehydrated$97 === primaryChildProps
+          : dehydrated$101 === primaryChildProps
           ? (showFallback.updateQueue = {
               transitions: didSuspend,
               markerInstances: JSCompiler_temp,
               retryQueue:
                 null !== primaryChildProps ? primaryChildProps.retryQueue : null
             })
-          : ((dehydrated$97.transitions = didSuspend),
-            (dehydrated$97.markerInstances = JSCompiler_temp))));
+          : ((dehydrated$101.transitions = didSuspend),
+            (dehydrated$101.markerInstances = JSCompiler_temp))));
     showFallback.childLanes = current.childLanes & ~renderLanes;
     workInProgress.memoizedState = SUSPENDED_MARKER;
     return nextProps;
@@ -7683,7 +7690,6 @@ function updateHostComponent(current, workInProgress, type, newProps) {
   var oldProps = current.memoizedProps;
   if (oldProps !== newProps) {
     current = workInProgress.stateNode;
-    workInProgress.flags &= -16777217;
     var updatePayload = null;
     switch (type) {
       case "input":
@@ -7819,14 +7825,14 @@ function cutOffTailIfNeeded(renderState, hasRenderedATailFallback) {
         break;
       case "collapsed":
         lastTailNode = renderState.tail;
-        for (var lastTailNode$128 = null; null !== lastTailNode; )
-          null !== lastTailNode.alternate && (lastTailNode$128 = lastTailNode),
+        for (var lastTailNode$132 = null; null !== lastTailNode; )
+          null !== lastTailNode.alternate && (lastTailNode$132 = lastTailNode),
             (lastTailNode = lastTailNode.sibling);
-        null === lastTailNode$128
+        null === lastTailNode$132
           ? hasRenderedATailFallback || null === renderState.tail
             ? (renderState.tail = null)
             : (renderState.tail.sibling = null)
-          : (lastTailNode$128.sibling = null);
+          : (lastTailNode$132.sibling = null);
     }
 }
 function bubbleProperties(completedWork) {
@@ -7836,19 +7842,19 @@ function bubbleProperties(completedWork) {
     newChildLanes = 0,
     subtreeFlags = 0;
   if (didBailout)
-    for (var child$129 = completedWork.child; null !== child$129; )
-      (newChildLanes |= child$129.lanes | child$129.childLanes),
-        (subtreeFlags |= child$129.subtreeFlags & 31457280),
-        (subtreeFlags |= child$129.flags & 31457280),
-        (child$129.return = completedWork),
-        (child$129 = child$129.sibling);
+    for (var child$133 = completedWork.child; null !== child$133; )
+      (newChildLanes |= child$133.lanes | child$133.childLanes),
+        (subtreeFlags |= child$133.subtreeFlags & 31457280),
+        (subtreeFlags |= child$133.flags & 31457280),
+        (child$133.return = completedWork),
+        (child$133 = child$133.sibling);
   else
-    for (child$129 = completedWork.child; null !== child$129; )
-      (newChildLanes |= child$129.lanes | child$129.childLanes),
-        (subtreeFlags |= child$129.subtreeFlags),
-        (subtreeFlags |= child$129.flags),
-        (child$129.return = completedWork),
-        (child$129 = child$129.sibling);
+    for (child$133 = completedWork.child; null !== child$133; )
+      (newChildLanes |= child$133.lanes | child$133.childLanes),
+        (subtreeFlags |= child$133.subtreeFlags),
+        (subtreeFlags |= child$133.flags),
+        (child$133.return = completedWork),
+        (child$133 = child$133.sibling);
   completedWork.subtreeFlags |= subtreeFlags;
   completedWork.childLanes = newChildLanes;
   return didBailout;
@@ -7925,6 +7931,7 @@ function completeWork(current, workInProgress, renderLanes) {
               workInProgress.pendingProps
             ),
         bubbleProperties(workInProgress),
+        (workInProgress.flags &= -16777217),
         null
       );
     case 27:
@@ -8046,10 +8053,10 @@ function completeWork(current, workInProgress, renderLanes) {
           }
           current && markUpdate(workInProgress);
         }
-        workInProgress.flags &= -16777217;
         null !== workInProgress.ref && markRef(workInProgress);
       }
       bubbleProperties(workInProgress);
+      workInProgress.flags &= -16777217;
       return null;
     case 6:
       if (current && null != workInProgress.stateNode)
@@ -8565,8 +8572,8 @@ function safelyDetachRef(current, nearestMountedAncestor) {
     else if ("function" === typeof ref)
       try {
         ref(null);
-      } catch (error$158) {
-        captureCommitPhaseError(current, nearestMountedAncestor, error$158);
+      } catch (error$162) {
+        captureCommitPhaseError(current, nearestMountedAncestor, error$162);
       }
     else ref.current = null;
 }
@@ -8873,11 +8880,11 @@ function commitLayoutEffectOnFiber(finishedRoot, current, finishedWork) {
               current,
               finishedRoot.__reactInternalSnapshotBeforeUpdate
             );
-          } catch (error$160) {
+          } catch (error$164) {
             captureCommitPhaseError(
               finishedWork,
               finishedWork.return,
-              error$160
+              error$164
             );
           }
         }
@@ -9551,8 +9558,8 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
         }
         try {
           commitHookEffectListUnmount(5, finishedWork, finishedWork.return);
-        } catch (error$173) {
-          captureCommitPhaseError(finishedWork, finishedWork.return, error$173);
+        } catch (error$177) {
+          captureCommitPhaseError(finishedWork, finishedWork.return, error$177);
         }
       }
       break;
@@ -9730,11 +9737,11 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
               newProps
             );
             domElement[internalPropsKey] = newProps;
-          } catch (error$174) {
+          } catch (error$178) {
             captureCommitPhaseError(
               finishedWork,
               finishedWork.return,
-              error$174
+              error$178
             );
           }
       break;
@@ -9770,8 +9777,8 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
         root = finishedWork.stateNode;
         try {
           setTextContent(root, "");
-        } catch (error$175) {
-          captureCommitPhaseError(finishedWork, finishedWork.return, error$175);
+        } catch (error$179) {
+          captureCommitPhaseError(finishedWork, finishedWork.return, error$179);
         }
       }
       if (
@@ -9788,8 +9795,8 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
         try {
           updateProperties(flags, maybeNodes, hoistableRoot, current, root),
             (flags[internalPropsKey] = root);
-        } catch (error$178) {
-          captureCommitPhaseError(finishedWork, finishedWork.return, error$178);
+        } catch (error$182) {
+          captureCommitPhaseError(finishedWork, finishedWork.return, error$182);
         }
       break;
     case 6:
@@ -9802,8 +9809,8 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
         flags = finishedWork.memoizedProps;
         try {
           current.nodeValue = flags;
-        } catch (error$179) {
-          captureCommitPhaseError(finishedWork, finishedWork.return, error$179);
+        } catch (error$183) {
+          captureCommitPhaseError(finishedWork, finishedWork.return, error$183);
         }
       }
       break;
@@ -9817,8 +9824,8 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
       if (flags & 4 && null !== current && current.memoizedState.isDehydrated)
         try {
           retryIfBlockedOn(root.containerInfo);
-        } catch (error$180) {
-          captureCommitPhaseError(finishedWork, finishedWork.return, error$180);
+        } catch (error$184) {
+          captureCommitPhaseError(finishedWork, finishedWork.return, error$184);
         }
       break;
     case 4:
@@ -9848,8 +9855,8 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
               null !== retryQueue && suspenseCallback(new Set(retryQueue));
             }
           }
-        } catch (error$182) {
-          captureCommitPhaseError(finishedWork, finishedWork.return, error$182);
+        } catch (error$186) {
+          captureCommitPhaseError(finishedWork, finishedWork.return, error$186);
         }
         current = finishedWork.updateQueue;
         null !== current &&
@@ -9927,11 +9934,11 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
             if (null === current)
               try {
                 root.stateNode.nodeValue = domElement ? "" : root.memoizedProps;
-              } catch (error$163) {
+              } catch (error$167) {
                 captureCommitPhaseError(
                   finishedWork,
                   finishedWork.return,
-                  error$163
+                  error$167
                 );
               }
           } else if (
@@ -10006,21 +10013,21 @@ function commitReconciliationEffects(finishedWork) {
             insertOrAppendPlacementNode(finishedWork, before, parent$jscomp$0);
             break;
           case 5:
-            var parent$164 = JSCompiler_inline_result.stateNode;
+            var parent$168 = JSCompiler_inline_result.stateNode;
             JSCompiler_inline_result.flags & 32 &&
-              (setTextContent(parent$164, ""),
+              (setTextContent(parent$168, ""),
               (JSCompiler_inline_result.flags &= -33));
-            var before$165 = getHostSibling(finishedWork);
-            insertOrAppendPlacementNode(finishedWork, before$165, parent$164);
+            var before$169 = getHostSibling(finishedWork);
+            insertOrAppendPlacementNode(finishedWork, before$169, parent$168);
             break;
           case 3:
           case 4:
-            var parent$166 = JSCompiler_inline_result.stateNode.containerInfo,
-              before$167 = getHostSibling(finishedWork);
+            var parent$170 = JSCompiler_inline_result.stateNode.containerInfo,
+              before$171 = getHostSibling(finishedWork);
             insertOrAppendPlacementNodeIntoContainer(
               finishedWork,
-              before$167,
-              parent$166
+              before$171,
+              parent$170
             );
             break;
           default:
@@ -10490,9 +10497,9 @@ function recursivelyTraverseReconnectPassiveEffects(
           );
         break;
       case 22:
-        var instance$192 = finishedWork.stateNode;
+        var instance$196 = finishedWork.stateNode;
         null !== finishedWork.memoizedState
-          ? instance$192._visibility & 4
+          ? instance$196._visibility & 4
             ? recursivelyTraverseReconnectPassiveEffects(
                 finishedRoot,
                 finishedWork,
@@ -10505,7 +10512,7 @@ function recursivelyTraverseReconnectPassiveEffects(
                 finishedRoot,
                 finishedWork
               )
-            : ((instance$192._visibility |= 4),
+            : ((instance$196._visibility |= 4),
               recursivelyTraverseReconnectPassiveEffects(
                 finishedRoot,
                 finishedWork,
@@ -10513,7 +10520,7 @@ function recursivelyTraverseReconnectPassiveEffects(
                 committedTransitions,
                 includeWorkInProgressEffects
               ))
-          : ((instance$192._visibility |= 4),
+          : ((instance$196._visibility |= 4),
             recursivelyTraverseReconnectPassiveEffects(
               finishedRoot,
               finishedWork,
@@ -10526,7 +10533,7 @@ function recursivelyTraverseReconnectPassiveEffects(
           commitOffscreenPassiveMountEffects(
             finishedWork.alternate,
             finishedWork,
-            instance$192
+            instance$196
           );
         break;
       case 24:
@@ -11080,16 +11087,16 @@ function performConcurrentWorkOnRoot(root, didTimeout) {
         exitStatus = renderRootSync(root, lanes);
         if (2 === exitStatus) {
           errorRetryLanes = lanes;
-          var errorRetryLanes$201 = getLanesToRetrySynchronouslyOnError(
+          var errorRetryLanes$205 = getLanesToRetrySynchronouslyOnError(
             root,
             errorRetryLanes
           );
-          0 !== errorRetryLanes$201 &&
-            ((lanes = errorRetryLanes$201),
+          0 !== errorRetryLanes$205 &&
+            ((lanes = errorRetryLanes$205),
             (exitStatus = recoverFromConcurrentError(
               root,
               errorRetryLanes,
-              errorRetryLanes$201
+              errorRetryLanes$205
             )));
         }
         if (1 === exitStatus)
@@ -11138,14 +11145,14 @@ function performConcurrentWorkOnRoot(root, didTimeout) {
           if ((lanes & 8388480) === lanes) break;
           exitStatus = lanes;
           errorRetryLanes = root.eventTimes;
-          for (errorRetryLanes$201 = -1; 0 < exitStatus; ) {
+          for (errorRetryLanes$205 = -1; 0 < exitStatus; ) {
             var index$11 = 31 - clz32(exitStatus),
               lane = 1 << index$11;
             index$11 = errorRetryLanes[index$11];
-            index$11 > errorRetryLanes$201 && (errorRetryLanes$201 = index$11);
+            index$11 > errorRetryLanes$205 && (errorRetryLanes$205 = index$11);
             exitStatus &= ~lane;
           }
-          exitStatus = errorRetryLanes$201;
+          exitStatus = errorRetryLanes$205;
           exitStatus = now() - exitStatus;
           exitStatus =
             (120 > exitStatus
@@ -11396,34 +11403,35 @@ function prepareFreshStack(root, lanes) {
 function handleThrow(root, thrownValue) {
   ReactCurrentDispatcher$1.current = ContextOnlyDispatcher;
   ReactCurrentOwner.current = null;
-  if (thrownValue === SuspenseException) {
-    if (null === suspendedThenable) throw Error(formatProdErrorMessage(459));
-    thrownValue = suspendedThenable;
-    suspendedThenable = null;
-    (workInProgressRootRenderLanes & 8388480) === workInProgressRootRenderLanes
-      ? (root = null === shellBoundary ? !0 : !1)
-      : ((root = suspenseHandlerStackCursor.current),
-        (root =
-          null !== root &&
-          (workInProgressRootRenderLanes & 125829120) ===
-            workInProgressRootRenderLanes
-            ? root === shellBoundary
-            : !1));
-    workInProgressSuspendedReason =
-      root &&
-      0 === (workInProgressRootSkippedLanes & 268435455) &&
-      0 === (workInProgressRootInterleavedUpdatedLanes & 268435455)
-        ? 2
-        : 3;
-  } else
-    workInProgressSuspendedReason =
-      thrownValue === SelectiveHydrationException
-        ? 6
-        : null !== thrownValue &&
-          "object" === typeof thrownValue &&
-          "function" === typeof thrownValue.then
-        ? 4
-        : 1;
+  thrownValue === SuspenseException
+    ? ((thrownValue = getSuspendedThenable()),
+      (workInProgressRootRenderLanes & 8388480) ===
+      workInProgressRootRenderLanes
+        ? (root = null === shellBoundary ? !0 : !1)
+        : ((root = suspenseHandlerStackCursor.current),
+          (root =
+            null !== root &&
+            (workInProgressRootRenderLanes & 125829120) ===
+              workInProgressRootRenderLanes
+              ? root === shellBoundary
+              : !1)),
+      (workInProgressSuspendedReason =
+        root &&
+        0 === (workInProgressRootSkippedLanes & 268435455) &&
+        0 === (workInProgressRootInterleavedUpdatedLanes & 268435455)
+          ? 2
+          : 3))
+    : thrownValue === SuspenseyCommitException
+    ? ((thrownValue = getSuspendedThenable()),
+      (workInProgressSuspendedReason = 4))
+    : (workInProgressSuspendedReason =
+        thrownValue === SelectiveHydrationException
+          ? 8
+          : null !== thrownValue &&
+            "object" === typeof thrownValue &&
+            "function" === typeof thrownValue.then
+          ? 6
+          : 1);
   workInProgressThrownValue = thrownValue;
   null === workInProgress &&
     ((workInProgressRootExitStatus = 1),
@@ -11464,7 +11472,7 @@ function renderRootSync(root, lanes) {
         lanes = workInProgress;
         var thrownValue = workInProgressThrownValue;
         switch (workInProgressSuspendedReason) {
-          case 6:
+          case 8:
             resetWorkInProgressStack();
             workInProgressRootExitStatus = 6;
             break a;
@@ -11476,8 +11484,8 @@ function renderRootSync(root, lanes) {
       }
       workLoopSync();
       break;
-    } catch (thrownValue$204) {
-      handleThrow(root, thrownValue$204);
+    } catch (thrownValue$208) {
+      handleThrow(root, thrownValue$208);
     }
   while (1);
   resetContextDependencies();
@@ -11509,7 +11517,7 @@ function renderRootConcurrent(root, lanes) {
       if (0 !== workInProgressSuspendedReason && null !== workInProgress) {
         lanes = workInProgress;
         var thrownValue = workInProgressThrownValue;
-        switch (workInProgressSuspendedReason) {
+        b: switch (workInProgressSuspendedReason) {
           case 1:
             workInProgressSuspendedReason = 0;
             workInProgressThrownValue = null;
@@ -11525,15 +11533,18 @@ function renderRootConcurrent(root, lanes) {
             lanes = function () {
               2 === workInProgressSuspendedReason &&
                 workInProgressRoot === root &&
-                (workInProgressSuspendedReason = 5);
+                (workInProgressSuspendedReason = 7);
               ensureRootIsScheduled(root, now());
             };
             thrownValue.then(lanes, lanes);
             break a;
           case 3:
+            workInProgressSuspendedReason = 7;
+            break a;
+          case 4:
             workInProgressSuspendedReason = 5;
             break a;
-          case 5:
+          case 7:
             isThenableResolved(thrownValue)
               ? ((workInProgressSuspendedReason = 0),
                 (workInProgressThrownValue = null),
@@ -11542,12 +11553,35 @@ function renderRootConcurrent(root, lanes) {
                 (workInProgressThrownValue = null),
                 unwindSuspendedUnitOfWork(lanes, thrownValue));
             break;
-          case 4:
+          case 5:
+            switch (workInProgress.tag) {
+              case 5:
+              case 26:
+              case 27:
+                lanes = workInProgress;
+                workInProgressSuspendedReason = 0;
+                workInProgressThrownValue = null;
+                var sibling = lanes.sibling;
+                if (null !== sibling) workInProgress = sibling;
+                else {
+                  var returnFiber = lanes.return;
+                  null !== returnFiber
+                    ? ((workInProgress = returnFiber),
+                      completeUnitOfWork(returnFiber))
+                    : (workInProgress = null);
+                }
+                break b;
+            }
             workInProgressSuspendedReason = 0;
             workInProgressThrownValue = null;
             unwindSuspendedUnitOfWork(lanes, thrownValue);
             break;
           case 6:
+            workInProgressSuspendedReason = 0;
+            workInProgressThrownValue = null;
+            unwindSuspendedUnitOfWork(lanes, thrownValue);
+            break;
+          case 8:
             resetWorkInProgressStack();
             workInProgressRootExitStatus = 6;
             break a;
@@ -11557,8 +11591,8 @@ function renderRootConcurrent(root, lanes) {
       }
       workLoopConcurrent();
       break;
-    } catch (thrownValue$206) {
-      handleThrow(root, thrownValue$206);
+    } catch (thrownValue$210) {
+      handleThrow(root, thrownValue$210);
     }
   while (1);
   resetContextDependencies();
@@ -11713,10 +11747,10 @@ function unwindSuspendedUnitOfWork(unitOfWork, thrownValue) {
                       };
                       suspenseBoundary.updateQueue = newOffscreenQueue;
                     } else {
-                      var retryQueue$85 = offscreenQueue.retryQueue;
-                      null === retryQueue$85
+                      var retryQueue$89 = offscreenQueue.retryQueue;
+                      null === retryQueue$89
                         ? (offscreenQueue.retryQueue = new Set([wakeable]))
-                        : retryQueue$85.add(wakeable);
+                        : retryQueue$89.add(wakeable);
                     }
                   }
                   break;
@@ -11898,12 +11932,12 @@ function commitRootImpl(
     var prevExecutionContext = executionContext;
     executionContext |= 4;
     ReactCurrentOwner.current = null;
-    var shouldFireAfterActiveInstanceBlur$209 = commitBeforeMutationEffects(
+    var shouldFireAfterActiveInstanceBlur$213 = commitBeforeMutationEffects(
       root,
       finishedWork
     );
     commitMutationEffectsOnFiber(finishedWork, root);
-    shouldFireAfterActiveInstanceBlur$209 &&
+    shouldFireAfterActiveInstanceBlur$213 &&
       ((_enabled = !0),
       dispatchAfterDetachedBlur(selectionInformation.focusedElem),
       (_enabled = !1));
@@ -11982,7 +12016,7 @@ function releaseRootPooledCache(root, remainingLanes) {
 }
 function flushPassiveEffects() {
   if (null !== rootWithPendingPassiveEffects) {
-    var root$210 = rootWithPendingPassiveEffects,
+    var root$214 = rootWithPendingPassiveEffects,
       remainingLanes = pendingPassiveEffectsRemainingLanes;
     pendingPassiveEffectsRemainingLanes = 0;
     var renderPriority = lanesToEventPriority(pendingPassiveEffectsLanes);
@@ -11998,7 +12032,7 @@ function flushPassiveEffects() {
     } finally {
       (currentUpdatePriority = previousPriority),
         (ReactCurrentBatchConfig$1.transition = prevTransition),
-        releaseRootPooledCache(root$210, remainingLanes);
+        releaseRootPooledCache(root$214, remainingLanes);
     }
   }
   return !1;
@@ -13305,12 +13339,12 @@ function getPublicRootInstance(container) {
 function attemptSynchronousHydration(fiber) {
   switch (fiber.tag) {
     case 3:
-      var root$212 = fiber.stateNode;
-      if (root$212.current.memoizedState.isDehydrated) {
-        var lanes = getHighestPriorityLanes(root$212.pendingLanes);
+      var root$216 = fiber.stateNode;
+      if (root$216.current.memoizedState.isDehydrated) {
+        var lanes = getHighestPriorityLanes(root$216.pendingLanes);
         0 !== lanes &&
-          (markRootEntangled(root$212, lanes | 2),
-          ensureRootIsScheduled(root$212, now()),
+          (markRootEntangled(root$216, lanes | 2),
+          ensureRootIsScheduled(root$216, now()),
           0 === (executionContext & 6) &&
             ((workInProgressRootRenderTargetTime = now() + 500),
             flushSyncCallbacks()));
@@ -13882,19 +13916,19 @@ function getTargetInstForChangeEvent(domEventName, targetInst) {
 }
 var isInputEventSupported = !1;
 if (canUseDOM) {
-  var JSCompiler_inline_result$jscomp$315;
+  var JSCompiler_inline_result$jscomp$319;
   if (canUseDOM) {
-    var isSupported$jscomp$inline_1612 = "oninput" in document;
-    if (!isSupported$jscomp$inline_1612) {
-      var element$jscomp$inline_1613 = document.createElement("div");
-      element$jscomp$inline_1613.setAttribute("oninput", "return;");
-      isSupported$jscomp$inline_1612 =
-        "function" === typeof element$jscomp$inline_1613.oninput;
+    var isSupported$jscomp$inline_1614 = "oninput" in document;
+    if (!isSupported$jscomp$inline_1614) {
+      var element$jscomp$inline_1615 = document.createElement("div");
+      element$jscomp$inline_1615.setAttribute("oninput", "return;");
+      isSupported$jscomp$inline_1614 =
+        "function" === typeof element$jscomp$inline_1615.oninput;
     }
-    JSCompiler_inline_result$jscomp$315 = isSupported$jscomp$inline_1612;
-  } else JSCompiler_inline_result$jscomp$315 = !1;
+    JSCompiler_inline_result$jscomp$319 = isSupported$jscomp$inline_1614;
+  } else JSCompiler_inline_result$jscomp$319 = !1;
   isInputEventSupported =
-    JSCompiler_inline_result$jscomp$315 &&
+    JSCompiler_inline_result$jscomp$319 &&
     (!document.documentMode || 9 < document.documentMode);
 }
 function stopWatchingForValueChange() {
@@ -14032,20 +14066,20 @@ function registerSimpleEvent(domEventName, reactName) {
   registerTwoPhaseEvent(reactName, [domEventName]);
 }
 for (
-  var i$jscomp$inline_1625 = 0;
-  i$jscomp$inline_1625 < simpleEventPluginEvents.length;
-  i$jscomp$inline_1625++
+  var i$jscomp$inline_1627 = 0;
+  i$jscomp$inline_1627 < simpleEventPluginEvents.length;
+  i$jscomp$inline_1627++
 ) {
-  var eventName$jscomp$inline_1626 =
-      simpleEventPluginEvents[i$jscomp$inline_1625],
-    domEventName$jscomp$inline_1627 =
-      eventName$jscomp$inline_1626.toLowerCase(),
-    capitalizedEvent$jscomp$inline_1628 =
-      eventName$jscomp$inline_1626[0].toUpperCase() +
-      eventName$jscomp$inline_1626.slice(1);
+  var eventName$jscomp$inline_1628 =
+      simpleEventPluginEvents[i$jscomp$inline_1627],
+    domEventName$jscomp$inline_1629 =
+      eventName$jscomp$inline_1628.toLowerCase(),
+    capitalizedEvent$jscomp$inline_1630 =
+      eventName$jscomp$inline_1628[0].toUpperCase() +
+      eventName$jscomp$inline_1628.slice(1);
   registerSimpleEvent(
-    domEventName$jscomp$inline_1627,
-    "on" + capitalizedEvent$jscomp$inline_1628
+    domEventName$jscomp$inline_1629,
+    "on" + capitalizedEvent$jscomp$inline_1630
   );
 }
 registerSimpleEvent(ANIMATION_END, "onAnimationEnd");
@@ -15624,11 +15658,11 @@ function legacyCreateRootFromDOMContainer(
     if ("function" === typeof callback) {
       var originalCallback = callback;
       callback = function () {
-        var instance = getPublicRootInstance(root$227);
+        var instance = getPublicRootInstance(root$231);
         originalCallback.call(instance);
       };
     }
-    var root$227 = createHydrationContainer(
+    var root$231 = createHydrationContainer(
       initialChildren,
       callback,
       container,
@@ -15640,23 +15674,23 @@ function legacyCreateRootFromDOMContainer(
       noopOnRecoverableError,
       null
     );
-    container._reactRootContainer = root$227;
-    container[internalContainerInstanceKey] = root$227.current;
+    container._reactRootContainer = root$231;
+    container[internalContainerInstanceKey] = root$231.current;
     listenToAllSupportedEvents(
       8 === container.nodeType ? container.parentNode : container
     );
     flushSync$1();
-    return root$227;
+    return root$231;
   }
   clearContainer(container);
   if ("function" === typeof callback) {
-    var originalCallback$228 = callback;
+    var originalCallback$232 = callback;
     callback = function () {
-      var instance = getPublicRootInstance(root$229);
-      originalCallback$228.call(instance);
+      var instance = getPublicRootInstance(root$233);
+      originalCallback$232.call(instance);
     };
   }
-  var root$229 = createFiberRoot(
+  var root$233 = createFiberRoot(
     container,
     0,
     !1,
@@ -15668,15 +15702,15 @@ function legacyCreateRootFromDOMContainer(
     noopOnRecoverableError,
     null
   );
-  container._reactRootContainer = root$229;
-  container[internalContainerInstanceKey] = root$229.current;
+  container._reactRootContainer = root$233;
+  container[internalContainerInstanceKey] = root$233.current;
   listenToAllSupportedEvents(
     8 === container.nodeType ? container.parentNode : container
   );
   flushSync$1(function () {
-    updateContainer(initialChildren, root$229, parentComponent, callback);
+    updateContainer(initialChildren, root$233, parentComponent, callback);
   });
-  return root$229;
+  return root$233;
 }
 function legacyRenderSubtreeIntoContainer(
   parentComponent,
@@ -15735,17 +15769,17 @@ Internals.Events = [
   restoreStateIfNeeded,
   batchedUpdates$1
 ];
-var devToolsConfig$jscomp$inline_1781 = {
+var devToolsConfig$jscomp$inline_1783 = {
   findFiberByHostInstance: getClosestInstanceFromNode,
   bundleType: 0,
-  version: "18.3.0-www-classic-4b2319d4",
+  version: "18.3.0-www-classic-71b5ccb0",
   rendererPackageName: "react-dom"
 };
-var internals$jscomp$inline_2162 = {
-  bundleType: devToolsConfig$jscomp$inline_1781.bundleType,
-  version: devToolsConfig$jscomp$inline_1781.version,
-  rendererPackageName: devToolsConfig$jscomp$inline_1781.rendererPackageName,
-  rendererConfig: devToolsConfig$jscomp$inline_1781.rendererConfig,
+var internals$jscomp$inline_2164 = {
+  bundleType: devToolsConfig$jscomp$inline_1783.bundleType,
+  version: devToolsConfig$jscomp$inline_1783.version,
+  rendererPackageName: devToolsConfig$jscomp$inline_1783.rendererPackageName,
+  rendererConfig: devToolsConfig$jscomp$inline_1783.rendererConfig,
   overrideHookState: null,
   overrideHookStateDeletePath: null,
   overrideHookStateRenamePath: null,
@@ -15761,26 +15795,26 @@ var internals$jscomp$inline_2162 = {
     return null === fiber ? null : fiber.stateNode;
   },
   findFiberByHostInstance:
-    devToolsConfig$jscomp$inline_1781.findFiberByHostInstance ||
+    devToolsConfig$jscomp$inline_1783.findFiberByHostInstance ||
     emptyFindFiberByHostInstance,
   findHostInstancesForRefresh: null,
   scheduleRefresh: null,
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-www-classic-4b2319d4"
+  reconcilerVersion: "18.3.0-www-classic-71b5ccb0"
 };
 if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
-  var hook$jscomp$inline_2163 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
+  var hook$jscomp$inline_2165 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
   if (
-    !hook$jscomp$inline_2163.isDisabled &&
-    hook$jscomp$inline_2163.supportsFiber
+    !hook$jscomp$inline_2165.isDisabled &&
+    hook$jscomp$inline_2165.supportsFiber
   )
     try {
-      (rendererID = hook$jscomp$inline_2163.inject(
-        internals$jscomp$inline_2162
+      (rendererID = hook$jscomp$inline_2165.inject(
+        internals$jscomp$inline_2164
       )),
-        (injectedHook = hook$jscomp$inline_2163);
+        (injectedHook = hook$jscomp$inline_2165);
     } catch (err) {}
 }
 assign(Internals, {
@@ -16008,4 +16042,4 @@ exports.unstable_renderSubtreeIntoContainer = function (
   );
 };
 exports.unstable_runWithPriority = runWithPriority;
-exports.version = "18.3.0-www-classic-4b2319d4";
+exports.version = "18.3.0-www-classic-71b5ccb0";
diff --git a/compiled/facebook-www/ReactDOM-prod.modern.js b/compiled/facebook-www/ReactDOM-prod.modern.js
index c0b5f23137cbd..5f192bfb8fbca 100644
--- a/compiled/facebook-www/ReactDOM-prod.modern.js
+++ b/compiled/facebook-www/ReactDOM-prod.modern.js
@@ -2381,6 +2381,7 @@ function shallowEqual(objA, objB) {
   return !0;
 }
 var SuspenseException = Error(formatProdErrorMessage(460)),
+  SuspenseyCommitException = Error(formatProdErrorMessage(474)),
   noopSuspenseyCommitThenable = { then: function () {} };
 function isThenableResolved(thenable) {
   thenable = thenable.status;
@@ -2428,8 +2429,14 @@ function trackUsedThenable(thenableState, thenable, index) {
       throw SuspenseException;
   }
 }
-var suspendedThenable = null,
-  thenableState$1 = null,
+var suspendedThenable = null;
+function getSuspendedThenable() {
+  if (null === suspendedThenable) throw Error(formatProdErrorMessage(459));
+  var thenable = suspendedThenable;
+  suspendedThenable = null;
+  return thenable;
+}
+var thenableState$1 = null,
   thenableIndexCounter$1 = 0;
 function unwrapThenable(thenable) {
   var index = thenableIndexCounter$1;
@@ -6363,7 +6370,6 @@ function updateHostComponent(current, workInProgress, type, newProps) {
   var oldProps = current.memoizedProps;
   if (oldProps !== newProps) {
     current = workInProgress.stateNode;
-    workInProgress.flags &= -16777217;
     var updatePayload = null;
     switch (type) {
       case "input":
@@ -6599,6 +6605,7 @@ function completeWork(current, workInProgress, renderLanes) {
               workInProgress.pendingProps
             ),
         bubbleProperties(workInProgress),
+        (workInProgress.flags &= -16777217),
         null
       );
     case 27:
@@ -6720,10 +6727,10 @@ function completeWork(current, workInProgress, renderLanes) {
           }
           current && markUpdate(workInProgress);
         }
-        workInProgress.flags &= -16777217;
         null !== workInProgress.ref && markRef(workInProgress);
       }
       bubbleProperties(workInProgress);
+      workInProgress.flags &= -16777217;
       return null;
     case 6:
       if (current && null != workInProgress.stateNode)
@@ -10063,34 +10070,35 @@ function prepareFreshStack(root, lanes) {
 function handleThrow(root, thrownValue) {
   ReactCurrentDispatcher$1.current = ContextOnlyDispatcher;
   ReactCurrentOwner.current = null;
-  if (thrownValue === SuspenseException) {
-    if (null === suspendedThenable) throw Error(formatProdErrorMessage(459));
-    thrownValue = suspendedThenable;
-    suspendedThenable = null;
-    (workInProgressRootRenderLanes & 8388480) === workInProgressRootRenderLanes
-      ? (root = null === shellBoundary ? !0 : !1)
-      : ((root = suspenseHandlerStackCursor.current),
-        (root =
-          null !== root &&
-          (workInProgressRootRenderLanes & 125829120) ===
-            workInProgressRootRenderLanes
-            ? root === shellBoundary
-            : !1));
-    workInProgressSuspendedReason =
-      root &&
-      0 === (workInProgressRootSkippedLanes & 268435455) &&
-      0 === (workInProgressRootInterleavedUpdatedLanes & 268435455)
-        ? 2
-        : 3;
-  } else
-    workInProgressSuspendedReason =
-      thrownValue === SelectiveHydrationException
-        ? 6
-        : null !== thrownValue &&
-          "object" === typeof thrownValue &&
-          "function" === typeof thrownValue.then
-        ? 4
-        : 1;
+  thrownValue === SuspenseException
+    ? ((thrownValue = getSuspendedThenable()),
+      (workInProgressRootRenderLanes & 8388480) ===
+      workInProgressRootRenderLanes
+        ? (root = null === shellBoundary ? !0 : !1)
+        : ((root = suspenseHandlerStackCursor.current),
+          (root =
+            null !== root &&
+            (workInProgressRootRenderLanes & 125829120) ===
+              workInProgressRootRenderLanes
+              ? root === shellBoundary
+              : !1)),
+      (workInProgressSuspendedReason =
+        root &&
+        0 === (workInProgressRootSkippedLanes & 268435455) &&
+        0 === (workInProgressRootInterleavedUpdatedLanes & 268435455)
+          ? 2
+          : 3))
+    : thrownValue === SuspenseyCommitException
+    ? ((thrownValue = getSuspendedThenable()),
+      (workInProgressSuspendedReason = 4))
+    : (workInProgressSuspendedReason =
+        thrownValue === SelectiveHydrationException
+          ? 8
+          : null !== thrownValue &&
+            "object" === typeof thrownValue &&
+            "function" === typeof thrownValue.then
+          ? 6
+          : 1);
   workInProgressThrownValue = thrownValue;
   null === workInProgress &&
     ((workInProgressRootExitStatus = 1),
@@ -10131,7 +10139,7 @@ function renderRootSync(root, lanes) {
         lanes = workInProgress;
         var thrownValue = workInProgressThrownValue;
         switch (workInProgressSuspendedReason) {
-          case 6:
+          case 8:
             resetWorkInProgressStack();
             workInProgressRootExitStatus = 6;
             break a;
@@ -10176,7 +10184,7 @@ function renderRootConcurrent(root, lanes) {
       if (0 !== workInProgressSuspendedReason && null !== workInProgress) {
         lanes = workInProgress;
         var thrownValue = workInProgressThrownValue;
-        switch (workInProgressSuspendedReason) {
+        b: switch (workInProgressSuspendedReason) {
           case 1:
             workInProgressSuspendedReason = 0;
             workInProgressThrownValue = null;
@@ -10192,15 +10200,18 @@ function renderRootConcurrent(root, lanes) {
             lanes = function () {
               2 === workInProgressSuspendedReason &&
                 workInProgressRoot === root &&
-                (workInProgressSuspendedReason = 5);
+                (workInProgressSuspendedReason = 7);
               ensureRootIsScheduled(root, now());
             };
             thrownValue.then(lanes, lanes);
             break a;
           case 3:
+            workInProgressSuspendedReason = 7;
+            break a;
+          case 4:
             workInProgressSuspendedReason = 5;
             break a;
-          case 5:
+          case 7:
             isThenableResolved(thrownValue)
               ? ((workInProgressSuspendedReason = 0),
                 (workInProgressThrownValue = null),
@@ -10209,12 +10220,35 @@ function renderRootConcurrent(root, lanes) {
                 (workInProgressThrownValue = null),
                 unwindSuspendedUnitOfWork(lanes, thrownValue));
             break;
-          case 4:
+          case 5:
+            switch (workInProgress.tag) {
+              case 5:
+              case 26:
+              case 27:
+                lanes = workInProgress;
+                workInProgressSuspendedReason = 0;
+                workInProgressThrownValue = null;
+                var sibling = lanes.sibling;
+                if (null !== sibling) workInProgress = sibling;
+                else {
+                  var returnFiber = lanes.return;
+                  null !== returnFiber
+                    ? ((workInProgress = returnFiber),
+                      completeUnitOfWork(returnFiber))
+                    : (workInProgress = null);
+                }
+                break b;
+            }
             workInProgressSuspendedReason = 0;
             workInProgressThrownValue = null;
             unwindSuspendedUnitOfWork(lanes, thrownValue);
             break;
           case 6:
+            workInProgressSuspendedReason = 0;
+            workInProgressThrownValue = null;
+            unwindSuspendedUnitOfWork(lanes, thrownValue);
+            break;
+          case 8:
             resetWorkInProgressStack();
             workInProgressRootExitStatus = 6;
             break a;
@@ -13137,19 +13171,19 @@ function getTargetInstForChangeEvent(domEventName, targetInst) {
 }
 var isInputEventSupported = !1;
 if (canUseDOM) {
-  var JSCompiler_inline_result$jscomp$298;
+  var JSCompiler_inline_result$jscomp$302;
   if (canUseDOM) {
-    var isSupported$jscomp$inline_1531 = "oninput" in document;
-    if (!isSupported$jscomp$inline_1531) {
-      var element$jscomp$inline_1532 = document.createElement("div");
-      element$jscomp$inline_1532.setAttribute("oninput", "return;");
-      isSupported$jscomp$inline_1531 =
-        "function" === typeof element$jscomp$inline_1532.oninput;
+    var isSupported$jscomp$inline_1533 = "oninput" in document;
+    if (!isSupported$jscomp$inline_1533) {
+      var element$jscomp$inline_1534 = document.createElement("div");
+      element$jscomp$inline_1534.setAttribute("oninput", "return;");
+      isSupported$jscomp$inline_1533 =
+        "function" === typeof element$jscomp$inline_1534.oninput;
     }
-    JSCompiler_inline_result$jscomp$298 = isSupported$jscomp$inline_1531;
-  } else JSCompiler_inline_result$jscomp$298 = !1;
+    JSCompiler_inline_result$jscomp$302 = isSupported$jscomp$inline_1533;
+  } else JSCompiler_inline_result$jscomp$302 = !1;
   isInputEventSupported =
-    JSCompiler_inline_result$jscomp$298 &&
+    JSCompiler_inline_result$jscomp$302 &&
     (!document.documentMode || 9 < document.documentMode);
 }
 function stopWatchingForValueChange() {
@@ -13458,20 +13492,20 @@ function registerSimpleEvent(domEventName, reactName) {
   registerTwoPhaseEvent(reactName, [domEventName]);
 }
 for (
-  var i$jscomp$inline_1572 = 0;
-  i$jscomp$inline_1572 < simpleEventPluginEvents.length;
-  i$jscomp$inline_1572++
+  var i$jscomp$inline_1574 = 0;
+  i$jscomp$inline_1574 < simpleEventPluginEvents.length;
+  i$jscomp$inline_1574++
 ) {
-  var eventName$jscomp$inline_1573 =
-      simpleEventPluginEvents[i$jscomp$inline_1572],
-    domEventName$jscomp$inline_1574 =
-      eventName$jscomp$inline_1573.toLowerCase(),
-    capitalizedEvent$jscomp$inline_1575 =
-      eventName$jscomp$inline_1573[0].toUpperCase() +
-      eventName$jscomp$inline_1573.slice(1);
+  var eventName$jscomp$inline_1575 =
+      simpleEventPluginEvents[i$jscomp$inline_1574],
+    domEventName$jscomp$inline_1576 =
+      eventName$jscomp$inline_1575.toLowerCase(),
+    capitalizedEvent$jscomp$inline_1577 =
+      eventName$jscomp$inline_1575[0].toUpperCase() +
+      eventName$jscomp$inline_1575.slice(1);
   registerSimpleEvent(
-    domEventName$jscomp$inline_1574,
-    "on" + capitalizedEvent$jscomp$inline_1575
+    domEventName$jscomp$inline_1576,
+    "on" + capitalizedEvent$jscomp$inline_1577
   );
 }
 registerSimpleEvent(ANIMATION_END, "onAnimationEnd");
@@ -14610,12 +14644,12 @@ function preinit$1(href, options) {
       switch (as) {
         case "style":
           as = getResourcesFromRoot(resourceRoot).hoistableStyles;
-          var key$200 = getStyleKey(href),
+          var key$203 = getStyleKey(href),
             precedence = options.precedence || "default",
-            resource = as.get(key$200);
+            resource = as.get(key$203);
           if (resource) break;
           resource = resourceRoot.querySelector(
-            getStylesheetSelectorFromKey(key$200)
+            getStylesheetSelectorFromKey(key$203)
           );
           resource ||
             ((href = {
@@ -14624,7 +14658,7 @@ function preinit$1(href, options) {
               "data-precedence": precedence,
               crossOrigin: options.crossOrigin
             }),
-            (options = preloadPropsMap.get(key$200)) &&
+            (options = preloadPropsMap.get(key$203)) &&
               adoptPreloadPropsForStylesheet(href, options),
             (resource = (
               resourceRoot.ownerDocument || resourceRoot
@@ -14633,15 +14667,15 @@ function preinit$1(href, options) {
             setInitialProperties(resource, "link", href),
             insertStylesheet(resource, precedence, resourceRoot));
           resource = { type: "stylesheet", instance: resource, count: 1 };
-          as.set(key$200, resource);
+          as.set(key$203, resource);
           break;
         case "script":
           (as = getResourcesFromRoot(resourceRoot).hoistableScripts),
-            (key$200 = getScriptKey(href)),
-            (precedence = as.get(key$200)),
+            (key$203 = getScriptKey(href)),
+            (precedence = as.get(key$203)),
             precedence ||
               ((precedence = resourceRoot.querySelector(
-                "script[async]" + key$200
+                "script[async]" + key$203
               )),
               precedence ||
                 ((href = {
@@ -14650,7 +14684,7 @@ function preinit$1(href, options) {
                   crossOrigin: options.crossOrigin,
                   integrity: options.integrity
                 }),
-                (options = preloadPropsMap.get(key$200)) &&
+                (options = preloadPropsMap.get(key$203)) &&
                   adoptPreloadPropsForScript(href, options),
                 (options = resourceRoot.ownerDocument || resourceRoot),
                 (precedence = options.createElement("script")),
@@ -14658,13 +14692,13 @@ function preinit$1(href, options) {
                 setInitialProperties(precedence, "link", href),
                 options.head.appendChild(precedence)),
               (precedence = { type: "script", instance: precedence, count: 1 }),
-              as.set(key$200, precedence));
+              as.set(key$203, precedence));
       }
     else if ("style" === as || "script" === as)
       if ((resourceRoot = getDocumentForPreloads())) {
-        key$200 = escapeSelectorAttributeValueInsideDoubleQuotes(href);
-        precedence = key$200 =
-          'link[rel="preload"][as="' + as + '"][href="' + key$200 + '"]';
+        key$203 = escapeSelectorAttributeValueInsideDoubleQuotes(href);
+        precedence = key$203 =
+          'link[rel="preload"][as="' + as + '"][href="' + key$203 + '"]';
         switch (as) {
           case "style":
             precedence = getStyleKey(href);
@@ -14681,7 +14715,7 @@ function preinit$1(href, options) {
             integrity: options.integrity
           }),
           preloadPropsMap.set(precedence, href),
-          null === resourceRoot.querySelector(key$200) &&
+          null === resourceRoot.querySelector(key$203) &&
             ((options = resourceRoot.createElement("link")),
             setInitialProperties(options, "link", href),
             markNodeAsHoistable(options),
@@ -14713,14 +14747,14 @@ function getResource(type, currentProps, pendingProps) {
         "string" === typeof pendingProps.href &&
         "string" === typeof pendingProps.precedence
       ) {
-        var key$207 = getStyleKey(pendingProps.href),
-          styles$208 = getResourcesFromRoot(currentProps).hoistableStyles;
-        type = styles$208.get(key$207);
+        var key$210 = getStyleKey(pendingProps.href),
+          styles$211 = getResourcesFromRoot(currentProps).hoistableStyles;
+        type = styles$211.get(key$210);
         type ||
           ((currentProps = currentProps.ownerDocument || currentProps),
           (type = { type: "stylesheet", instance: null, count: 0 }),
-          styles$208.set(key$207, type),
-          preloadPropsMap.has(key$207) ||
+          styles$211.set(key$210, type),
+          preloadPropsMap.has(key$210) ||
             ((pendingProps = {
               rel: "preload",
               as: "style",
@@ -14731,16 +14765,16 @@ function getResource(type, currentProps, pendingProps) {
               hrefLang: pendingProps.hrefLang,
               referrerPolicy: pendingProps.referrerPolicy
             }),
-            preloadPropsMap.set(key$207, pendingProps),
-            currentProps.querySelector(getStylesheetSelectorFromKey(key$207)) ||
+            preloadPropsMap.set(key$210, pendingProps),
+            currentProps.querySelector(getStylesheetSelectorFromKey(key$210)) ||
               null !==
                 currentProps.querySelector(
-                  'link[rel="preload"][as="style"][' + key$207 + "]"
+                  'link[rel="preload"][as="style"][' + key$210 + "]"
                 ) ||
-              ((key$207 = currentProps.createElement("link")),
-              setInitialProperties(key$207, "link", pendingProps),
-              markNodeAsHoistable(key$207),
-              currentProps.head.appendChild(key$207))));
+              ((key$210 = currentProps.createElement("link")),
+              setInitialProperties(key$210, "link", pendingProps),
+              markNodeAsHoistable(key$210),
+              currentProps.head.appendChild(key$210))));
         return type;
       }
       return null;
@@ -14790,14 +14824,14 @@ function acquireResource(hoistableRoot, resource, props) {
         return (resource.instance = key);
       case "stylesheet":
         styleProps = getStyleKey(props.href);
-        var instance$214 = hoistableRoot.querySelector(
+        var instance$218 = hoistableRoot.querySelector(
           getStylesheetSelectorFromKey(styleProps)
         );
-        if (instance$214)
+        if (instance$218)
           return (
-            (resource.instance = instance$214),
-            markNodeAsHoistable(instance$214),
-            instance$214
+            (resource.instance = instance$218),
+            markNodeAsHoistable(instance$218),
+            instance$218
           );
         key = assign({}, props, {
           "data-precedence": props.precedence,
@@ -14805,11 +14839,11 @@ function acquireResource(hoistableRoot, resource, props) {
         });
         (styleProps = preloadPropsMap.get(styleProps)) &&
           adoptPreloadPropsForStylesheet(key, styleProps);
-        instance$214 = (
+        instance$218 = (
           hoistableRoot.ownerDocument || hoistableRoot
         ).createElement("link");
-        markNodeAsHoistable(instance$214);
-        var linkInstance = instance$214;
+        markNodeAsHoistable(instance$218);
+        var linkInstance = instance$218;
         linkInstance._p = new Promise(function (resolve, reject) {
           linkInstance.onload = resolve;
           linkInstance.onerror = reject;
@@ -14821,14 +14855,14 @@ function acquireResource(hoistableRoot, resource, props) {
             return (linkInstance._p.s = "e");
           }
         );
-        setInitialProperties(instance$214, "link", key);
-        insertStylesheet(instance$214, props.precedence, hoistableRoot);
-        return (resource.instance = instance$214);
+        setInitialProperties(instance$218, "link", key);
+        insertStylesheet(instance$218, props.precedence, hoistableRoot);
+        return (resource.instance = instance$218);
       case "script":
-        instance$214 = getScriptKey(props.src);
+        instance$218 = getScriptKey(props.src);
         if (
           (styleProps = hoistableRoot.querySelector(
-            "script[async]" + instance$214
+            "script[async]" + instance$218
           ))
         )
           return (
@@ -14837,7 +14871,7 @@ function acquireResource(hoistableRoot, resource, props) {
             styleProps
           );
         key = props;
-        if ((styleProps = preloadPropsMap.get(instance$214)))
+        if ((styleProps = preloadPropsMap.get(instance$218)))
           (key = assign({}, props)),
             adoptPreloadPropsForScript(key, styleProps);
         hoistableRoot = hoistableRoot.ownerDocument || hoistableRoot;
@@ -15258,17 +15292,17 @@ Internals.Events = [
   restoreStateIfNeeded,
   batchedUpdates$1
 ];
-var devToolsConfig$jscomp$inline_1751 = {
+var devToolsConfig$jscomp$inline_1753 = {
   findFiberByHostInstance: getClosestInstanceFromNode,
   bundleType: 0,
-  version: "18.3.0-www-modern-3f6d3b7b",
+  version: "18.3.0-www-modern-83328b30",
   rendererPackageName: "react-dom"
 };
-var internals$jscomp$inline_2150 = {
-  bundleType: devToolsConfig$jscomp$inline_1751.bundleType,
-  version: devToolsConfig$jscomp$inline_1751.version,
-  rendererPackageName: devToolsConfig$jscomp$inline_1751.rendererPackageName,
-  rendererConfig: devToolsConfig$jscomp$inline_1751.rendererConfig,
+var internals$jscomp$inline_2152 = {
+  bundleType: devToolsConfig$jscomp$inline_1753.bundleType,
+  version: devToolsConfig$jscomp$inline_1753.version,
+  rendererPackageName: devToolsConfig$jscomp$inline_1753.rendererPackageName,
+  rendererConfig: devToolsConfig$jscomp$inline_1753.rendererConfig,
   overrideHookState: null,
   overrideHookStateDeletePath: null,
   overrideHookStateRenamePath: null,
@@ -15285,26 +15319,26 @@ var internals$jscomp$inline_2150 = {
     return null === fiber ? null : fiber.stateNode;
   },
   findFiberByHostInstance:
-    devToolsConfig$jscomp$inline_1751.findFiberByHostInstance ||
+    devToolsConfig$jscomp$inline_1753.findFiberByHostInstance ||
     emptyFindFiberByHostInstance,
   findHostInstancesForRefresh: null,
   scheduleRefresh: null,
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-www-modern-3f6d3b7b"
+  reconcilerVersion: "18.3.0-www-modern-83328b30"
 };
 if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
-  var hook$jscomp$inline_2151 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
+  var hook$jscomp$inline_2153 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
   if (
-    !hook$jscomp$inline_2151.isDisabled &&
-    hook$jscomp$inline_2151.supportsFiber
+    !hook$jscomp$inline_2153.isDisabled &&
+    hook$jscomp$inline_2153.supportsFiber
   )
     try {
-      (rendererID = hook$jscomp$inline_2151.inject(
-        internals$jscomp$inline_2150
+      (rendererID = hook$jscomp$inline_2153.inject(
+        internals$jscomp$inline_2152
       )),
-        (injectedHook = hook$jscomp$inline_2151);
+        (injectedHook = hook$jscomp$inline_2153);
     } catch (err) {}
 }
 exports.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = Internals;
@@ -15461,4 +15495,4 @@ exports.unstable_createEventHandle = function (type, options) {
   return eventHandle;
 };
 exports.unstable_runWithPriority = runWithPriority;
-exports.version = "18.3.0-www-modern-3f6d3b7b";
+exports.version = "18.3.0-www-modern-83328b30";
diff --git a/compiled/facebook-www/ReactDOM-profiling.classic.js b/compiled/facebook-www/ReactDOM-profiling.classic.js
index 32bb9aa579986..30d73243b5ad0 100644
--- a/compiled/facebook-www/ReactDOM-profiling.classic.js
+++ b/compiled/facebook-www/ReactDOM-profiling.classic.js
@@ -2275,12 +2275,12 @@ function preinit$1(href, options) {
       switch (as) {
         case "style":
           as = getResourcesFromRoot(resourceRoot).hoistableStyles;
-          var key$22 = getStyleKey(href),
+          var key$25 = getStyleKey(href),
             precedence = options.precedence || "default",
-            resource = as.get(key$22);
+            resource = as.get(key$25);
           if (resource) break;
           resource = resourceRoot.querySelector(
-            getStylesheetSelectorFromKey(key$22)
+            getStylesheetSelectorFromKey(key$25)
           );
           resource ||
             ((href = {
@@ -2289,7 +2289,7 @@ function preinit$1(href, options) {
               "data-precedence": precedence,
               crossOrigin: options.crossOrigin
             }),
-            (options = preloadPropsMap.get(key$22)) &&
+            (options = preloadPropsMap.get(key$25)) &&
               adoptPreloadPropsForStylesheet(href, options),
             (resource = (
               resourceRoot.ownerDocument || resourceRoot
@@ -2298,15 +2298,15 @@ function preinit$1(href, options) {
             setInitialProperties(resource, "link", href),
             insertStylesheet(resource, precedence, resourceRoot));
           resource = { type: "stylesheet", instance: resource, count: 1 };
-          as.set(key$22, resource);
+          as.set(key$25, resource);
           break;
         case "script":
           (as = getResourcesFromRoot(resourceRoot).hoistableScripts),
-            (key$22 = getScriptKey(href)),
-            (precedence = as.get(key$22)),
+            (key$25 = getScriptKey(href)),
+            (precedence = as.get(key$25)),
             precedence ||
               ((precedence = resourceRoot.querySelector(
-                "script[async]" + key$22
+                "script[async]" + key$25
               )),
               precedence ||
                 ((href = {
@@ -2315,7 +2315,7 @@ function preinit$1(href, options) {
                   crossOrigin: options.crossOrigin,
                   integrity: options.integrity
                 }),
-                (options = preloadPropsMap.get(key$22)) &&
+                (options = preloadPropsMap.get(key$25)) &&
                   adoptPreloadPropsForScript(href, options),
                 (options = resourceRoot.ownerDocument || resourceRoot),
                 (precedence = options.createElement("script")),
@@ -2323,13 +2323,13 @@ function preinit$1(href, options) {
                 setInitialProperties(precedence, "link", href),
                 options.head.appendChild(precedence)),
               (precedence = { type: "script", instance: precedence, count: 1 }),
-              as.set(key$22, precedence));
+              as.set(key$25, precedence));
       }
     else if ("style" === as || "script" === as)
       if ((resourceRoot = getDocumentForPreloads())) {
-        key$22 = escapeSelectorAttributeValueInsideDoubleQuotes(href);
-        precedence = key$22 =
-          'link[rel="preload"][as="' + as + '"][href="' + key$22 + '"]';
+        key$25 = escapeSelectorAttributeValueInsideDoubleQuotes(href);
+        precedence = key$25 =
+          'link[rel="preload"][as="' + as + '"][href="' + key$25 + '"]';
         switch (as) {
           case "style":
             precedence = getStyleKey(href);
@@ -2346,7 +2346,7 @@ function preinit$1(href, options) {
             integrity: options.integrity
           }),
           preloadPropsMap.set(precedence, href),
-          null === resourceRoot.querySelector(key$22) &&
+          null === resourceRoot.querySelector(key$25) &&
             ((options = resourceRoot.createElement("link")),
             setInitialProperties(options, "link", href),
             markNodeAsHoistable(options),
@@ -2378,14 +2378,14 @@ function getResource(type, currentProps, pendingProps) {
         "string" === typeof pendingProps.href &&
         "string" === typeof pendingProps.precedence
       ) {
-        var key$29 = getStyleKey(pendingProps.href),
-          styles$30 = getResourcesFromRoot(currentProps).hoistableStyles;
-        type = styles$30.get(key$29);
+        var key$32 = getStyleKey(pendingProps.href),
+          styles$33 = getResourcesFromRoot(currentProps).hoistableStyles;
+        type = styles$33.get(key$32);
         type ||
           ((currentProps = currentProps.ownerDocument || currentProps),
           (type = { type: "stylesheet", instance: null, count: 0 }),
-          styles$30.set(key$29, type),
-          preloadPropsMap.has(key$29) ||
+          styles$33.set(key$32, type),
+          preloadPropsMap.has(key$32) ||
             ((pendingProps = {
               rel: "preload",
               as: "style",
@@ -2396,16 +2396,16 @@ function getResource(type, currentProps, pendingProps) {
               hrefLang: pendingProps.hrefLang,
               referrerPolicy: pendingProps.referrerPolicy
             }),
-            preloadPropsMap.set(key$29, pendingProps),
-            currentProps.querySelector(getStylesheetSelectorFromKey(key$29)) ||
+            preloadPropsMap.set(key$32, pendingProps),
+            currentProps.querySelector(getStylesheetSelectorFromKey(key$32)) ||
               null !==
                 currentProps.querySelector(
-                  'link[rel="preload"][as="style"][' + key$29 + "]"
+                  'link[rel="preload"][as="style"][' + key$32 + "]"
                 ) ||
-              ((key$29 = currentProps.createElement("link")),
-              setInitialProperties(key$29, "link", pendingProps),
-              markNodeAsHoistable(key$29),
-              currentProps.head.appendChild(key$29))));
+              ((key$32 = currentProps.createElement("link")),
+              setInitialProperties(key$32, "link", pendingProps),
+              markNodeAsHoistable(key$32),
+              currentProps.head.appendChild(key$32))));
         return type;
       }
       return null;
@@ -2455,14 +2455,14 @@ function acquireResource(hoistableRoot, resource, props) {
         return (resource.instance = key);
       case "stylesheet":
         styleProps = getStyleKey(props.href);
-        var instance$36 = hoistableRoot.querySelector(
+        var instance$40 = hoistableRoot.querySelector(
           getStylesheetSelectorFromKey(styleProps)
         );
-        if (instance$36)
+        if (instance$40)
           return (
-            (resource.instance = instance$36),
-            markNodeAsHoistable(instance$36),
-            instance$36
+            (resource.instance = instance$40),
+            markNodeAsHoistable(instance$40),
+            instance$40
           );
         key = assign({}, props, {
           "data-precedence": props.precedence,
@@ -2470,11 +2470,11 @@ function acquireResource(hoistableRoot, resource, props) {
         });
         (styleProps = preloadPropsMap.get(styleProps)) &&
           adoptPreloadPropsForStylesheet(key, styleProps);
-        instance$36 = (
+        instance$40 = (
           hoistableRoot.ownerDocument || hoistableRoot
         ).createElement("link");
-        markNodeAsHoistable(instance$36);
-        var linkInstance = instance$36;
+        markNodeAsHoistable(instance$40);
+        var linkInstance = instance$40;
         linkInstance._p = new Promise(function (resolve, reject) {
           linkInstance.onload = resolve;
           linkInstance.onerror = reject;
@@ -2486,14 +2486,14 @@ function acquireResource(hoistableRoot, resource, props) {
             return (linkInstance._p.s = "e");
           }
         );
-        setInitialProperties(instance$36, "link", key);
-        insertStylesheet(instance$36, props.precedence, hoistableRoot);
-        return (resource.instance = instance$36);
+        setInitialProperties(instance$40, "link", key);
+        insertStylesheet(instance$40, props.precedence, hoistableRoot);
+        return (resource.instance = instance$40);
       case "script":
-        instance$36 = getScriptKey(props.src);
+        instance$40 = getScriptKey(props.src);
         if (
           (styleProps = hoistableRoot.querySelector(
-            "script[async]" + instance$36
+            "script[async]" + instance$40
           ))
         )
           return (
@@ -2502,7 +2502,7 @@ function acquireResource(hoistableRoot, resource, props) {
             styleProps
           );
         key = props;
-        if ((styleProps = preloadPropsMap.get(instance$36)))
+        if ((styleProps = preloadPropsMap.get(instance$40)))
           (key = assign({}, props)),
             adoptPreloadPropsForScript(key, styleProps);
         hoistableRoot = hoistableRoot.ownerDocument || hoistableRoot;
@@ -3794,6 +3794,7 @@ function shallowEqual(objA, objB) {
   return !0;
 }
 var SuspenseException = Error(formatProdErrorMessage(460)),
+  SuspenseyCommitException = Error(formatProdErrorMessage(474)),
   noopSuspenseyCommitThenable = { then: function () {} };
 function isThenableResolved(thenable) {
   thenable = thenable.status;
@@ -3841,8 +3842,14 @@ function trackUsedThenable(thenableState, thenable, index) {
       throw SuspenseException;
   }
 }
-var suspendedThenable = null,
-  thenableState$1 = null,
+var suspendedThenable = null;
+function getSuspendedThenable() {
+  if (null === suspendedThenable) throw Error(formatProdErrorMessage(459));
+  var thenable = suspendedThenable;
+  suspendedThenable = null;
+  return thenable;
+}
+var thenableState$1 = null,
   thenableIndexCounter$1 = 0;
 function unwrapThenable(thenable) {
   var index = thenableIndexCounter$1;
@@ -4845,10 +4852,10 @@ createFunctionComponentUpdateQueue = function () {
 function use(usable) {
   if (null !== usable && "object" === typeof usable) {
     if ("function" === typeof usable.then) {
-      var index$76 = thenableIndexCounter;
+      var index$80 = thenableIndexCounter;
       thenableIndexCounter += 1;
       null === thenableState && (thenableState = []);
-      usable = trackUsedThenable(thenableState, usable, index$76);
+      usable = trackUsedThenable(thenableState, usable, index$80);
       null === currentlyRenderingFiber$1.alternate &&
         (null === workInProgressHook
           ? null === currentlyRenderingFiber$1.memoizedState
@@ -5340,16 +5347,16 @@ function refreshCache(fiber, seedKey, seedValue) {
       case 3:
         var lane = requestUpdateLane(provider);
         fiber = createUpdate(lane);
-        var root$82 = enqueueUpdate(provider, fiber, lane);
-        if (null !== root$82) {
+        var root$86 = enqueueUpdate(provider, fiber, lane);
+        if (null !== root$86) {
           var eventTime = requestEventTime();
-          scheduleUpdateOnFiber(root$82, provider, lane, eventTime);
-          entangleTransitions(root$82, provider, lane);
+          scheduleUpdateOnFiber(root$86, provider, lane, eventTime);
+          entangleTransitions(root$86, provider, lane);
         }
         provider = createCache();
         null !== seedKey &&
           void 0 !== seedKey &&
-          null !== root$82 &&
+          null !== root$86 &&
           provider.data.set(seedKey, seedValue);
         fiber.payload = { cache: provider };
         return;
@@ -5558,15 +5565,15 @@ var HooksDispatcherOnMount = {
       getServerSnapshot = getServerSnapshot();
     } else {
       getServerSnapshot = getSnapshot();
-      var root$78 = workInProgressRoot;
-      if (null === root$78) throw Error(formatProdErrorMessage(349));
-      includesBlockingLane(root$78, renderLanes$1) ||
+      var root$82 = workInProgressRoot;
+      if (null === root$82) throw Error(formatProdErrorMessage(349));
+      includesBlockingLane(root$82, renderLanes$1) ||
         pushStoreConsistencyCheck(fiber, getSnapshot, getServerSnapshot);
     }
     hook.memoizedState = getServerSnapshot;
-    root$78 = { value: getServerSnapshot, getSnapshot: getSnapshot };
-    hook.queue = root$78;
-    mountEffect(subscribeToStore.bind(null, fiber, root$78, subscribe), [
+    root$82 = { value: getServerSnapshot, getSnapshot: getSnapshot };
+    hook.queue = root$82;
+    mountEffect(subscribeToStore.bind(null, fiber, root$82, subscribe), [
       subscribe
     ]);
     fiber.flags |= 2048;
@@ -5575,7 +5582,7 @@ var HooksDispatcherOnMount = {
       updateStoreInstance.bind(
         null,
         fiber,
-        root$78,
+        root$82,
         getServerSnapshot,
         getSnapshot
       ),
@@ -6143,10 +6150,10 @@ var markerInstanceStack = createCursor(null);
 function pushRootMarkerInstance(workInProgress) {
   if (enableTransitionTracing) {
     var transitions = workInProgressTransitions,
-      root$95 = workInProgress.stateNode;
+      root$99 = workInProgress.stateNode;
     null !== transitions &&
       transitions.forEach(function (transition) {
-        if (!root$95.incompleteTransitions.has(transition)) {
+        if (!root$99.incompleteTransitions.has(transition)) {
           var markerInstance = {
             tag: 0,
             transitions: new Set([transition]),
@@ -6154,11 +6161,11 @@ function pushRootMarkerInstance(workInProgress) {
             aborts: null,
             name: null
           };
-          root$95.incompleteTransitions.set(transition, markerInstance);
+          root$99.incompleteTransitions.set(transition, markerInstance);
         }
       });
     var markerInstances = [];
-    root$95.incompleteTransitions.forEach(function (markerInstance) {
+    root$99.incompleteTransitions.forEach(function (markerInstance) {
       markerInstances.push(markerInstance);
     });
     push(markerInstanceStack, markerInstances);
@@ -6871,14 +6878,14 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) {
   }
   JSCompiler_temp = current.memoizedState;
   if (null !== JSCompiler_temp) {
-    var dehydrated$102 = JSCompiler_temp.dehydrated;
-    if (null !== dehydrated$102)
+    var dehydrated$106 = JSCompiler_temp.dehydrated;
+    if (null !== dehydrated$106)
       return updateDehydratedSuspenseComponent(
         current,
         workInProgress,
         didSuspend,
         nextProps,
-        dehydrated$102,
+        dehydrated$106,
         JSCompiler_temp,
         renderLanes
       );
@@ -6888,7 +6895,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) {
     showFallback = nextProps.fallback;
     didSuspend = workInProgress.mode;
     JSCompiler_temp = current.child;
-    dehydrated$102 = JSCompiler_temp.sibling;
+    dehydrated$106 = JSCompiler_temp.sibling;
     var primaryChildProps = { mode: "hidden", children: nextProps.children };
     0 === (didSuspend & 1) && workInProgress.child !== JSCompiler_temp
       ? ((nextProps = workInProgress.child),
@@ -6902,8 +6909,8 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) {
         (workInProgress.deletions = null))
       : ((nextProps = createWorkInProgress(JSCompiler_temp, primaryChildProps)),
         (nextProps.subtreeFlags = JSCompiler_temp.subtreeFlags & 31457280));
-    null !== dehydrated$102
-      ? (showFallback = createWorkInProgress(dehydrated$102, showFallback))
+    null !== dehydrated$106
+      ? (showFallback = createWorkInProgress(dehydrated$106, showFallback))
       : ((showFallback = createFiberFromFragment(
           showFallback,
           didSuspend,
@@ -6922,10 +6929,10 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) {
       ? (didSuspend = mountSuspenseOffscreenState(renderLanes))
       : ((JSCompiler_temp = didSuspend.cachePool),
         null !== JSCompiler_temp
-          ? ((dehydrated$102 = CacheContext._currentValue),
+          ? ((dehydrated$106 = CacheContext._currentValue),
             (JSCompiler_temp =
-              JSCompiler_temp.parent !== dehydrated$102
-                ? { parent: dehydrated$102, pool: dehydrated$102 }
+              JSCompiler_temp.parent !== dehydrated$106
+                ? { parent: dehydrated$106, pool: dehydrated$106 }
                 : JSCompiler_temp))
           : (JSCompiler_temp = getSuspendedCache()),
         (didSuspend = {
@@ -6939,23 +6946,23 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) {
         ((JSCompiler_temp = enableTransitionTracing
           ? markerInstanceStack.current
           : null),
-        (dehydrated$102 = showFallback.updateQueue),
+        (dehydrated$106 = showFallback.updateQueue),
         (primaryChildProps = current.updateQueue),
-        null === dehydrated$102
+        null === dehydrated$106
           ? (showFallback.updateQueue = {
               transitions: didSuspend,
               markerInstances: JSCompiler_temp,
               retryQueue: null
             })
-          : dehydrated$102 === primaryChildProps
+          : dehydrated$106 === primaryChildProps
           ? (showFallback.updateQueue = {
               transitions: didSuspend,
               markerInstances: JSCompiler_temp,
               retryQueue:
                 null !== primaryChildProps ? primaryChildProps.retryQueue : null
             })
-          : ((dehydrated$102.transitions = didSuspend),
-            (dehydrated$102.markerInstances = JSCompiler_temp))));
+          : ((dehydrated$106.transitions = didSuspend),
+            (dehydrated$106.markerInstances = JSCompiler_temp))));
     showFallback.childLanes = current.childLanes & ~renderLanes;
     workInProgress.memoizedState = SUSPENDED_MARKER;
     return nextProps;
@@ -7933,7 +7940,6 @@ function updateHostComponent(current, workInProgress, type, newProps) {
   var oldProps = current.memoizedProps;
   if (oldProps !== newProps) {
     current = workInProgress.stateNode;
-    workInProgress.flags &= -16777217;
     var updatePayload = null;
     switch (type) {
       case "input":
@@ -8069,14 +8075,14 @@ function cutOffTailIfNeeded(renderState, hasRenderedATailFallback) {
         break;
       case "collapsed":
         lastTailNode = renderState.tail;
-        for (var lastTailNode$134 = null; null !== lastTailNode; )
-          null !== lastTailNode.alternate && (lastTailNode$134 = lastTailNode),
+        for (var lastTailNode$138 = null; null !== lastTailNode; )
+          null !== lastTailNode.alternate && (lastTailNode$138 = lastTailNode),
             (lastTailNode = lastTailNode.sibling);
-        null === lastTailNode$134
+        null === lastTailNode$138
           ? hasRenderedATailFallback || null === renderState.tail
             ? (renderState.tail = null)
             : (renderState.tail.sibling = null)
-          : (lastTailNode$134.sibling = null);
+          : (lastTailNode$138.sibling = null);
     }
 }
 function bubbleProperties(completedWork) {
@@ -8088,53 +8094,53 @@ function bubbleProperties(completedWork) {
   if (didBailout)
     if (0 !== (completedWork.mode & 2)) {
       for (
-        var treeBaseDuration$136 = completedWork.selfBaseDuration,
-          child$137 = completedWork.child;
-        null !== child$137;
+        var treeBaseDuration$140 = completedWork.selfBaseDuration,
+          child$141 = completedWork.child;
+        null !== child$141;
 
       )
-        (newChildLanes |= child$137.lanes | child$137.childLanes),
-          (subtreeFlags |= child$137.subtreeFlags & 31457280),
-          (subtreeFlags |= child$137.flags & 31457280),
-          (treeBaseDuration$136 += child$137.treeBaseDuration),
-          (child$137 = child$137.sibling);
-      completedWork.treeBaseDuration = treeBaseDuration$136;
+        (newChildLanes |= child$141.lanes | child$141.childLanes),
+          (subtreeFlags |= child$141.subtreeFlags & 31457280),
+          (subtreeFlags |= child$141.flags & 31457280),
+          (treeBaseDuration$140 += child$141.treeBaseDuration),
+          (child$141 = child$141.sibling);
+      completedWork.treeBaseDuration = treeBaseDuration$140;
     } else
       for (
-        treeBaseDuration$136 = completedWork.child;
-        null !== treeBaseDuration$136;
+        treeBaseDuration$140 = completedWork.child;
+        null !== treeBaseDuration$140;
 
       )
         (newChildLanes |=
-          treeBaseDuration$136.lanes | treeBaseDuration$136.childLanes),
-          (subtreeFlags |= treeBaseDuration$136.subtreeFlags & 31457280),
-          (subtreeFlags |= treeBaseDuration$136.flags & 31457280),
-          (treeBaseDuration$136.return = completedWork),
-          (treeBaseDuration$136 = treeBaseDuration$136.sibling);
+          treeBaseDuration$140.lanes | treeBaseDuration$140.childLanes),
+          (subtreeFlags |= treeBaseDuration$140.subtreeFlags & 31457280),
+          (subtreeFlags |= treeBaseDuration$140.flags & 31457280),
+          (treeBaseDuration$140.return = completedWork),
+          (treeBaseDuration$140 = treeBaseDuration$140.sibling);
   else if (0 !== (completedWork.mode & 2)) {
-    treeBaseDuration$136 = completedWork.actualDuration;
-    child$137 = completedWork.selfBaseDuration;
+    treeBaseDuration$140 = completedWork.actualDuration;
+    child$141 = completedWork.selfBaseDuration;
     for (var child = completedWork.child; null !== child; )
       (newChildLanes |= child.lanes | child.childLanes),
         (subtreeFlags |= child.subtreeFlags),
         (subtreeFlags |= child.flags),
-        (treeBaseDuration$136 += child.actualDuration),
-        (child$137 += child.treeBaseDuration),
+        (treeBaseDuration$140 += child.actualDuration),
+        (child$141 += child.treeBaseDuration),
         (child = child.sibling);
-    completedWork.actualDuration = treeBaseDuration$136;
-    completedWork.treeBaseDuration = child$137;
+    completedWork.actualDuration = treeBaseDuration$140;
+    completedWork.treeBaseDuration = child$141;
   } else
     for (
-      treeBaseDuration$136 = completedWork.child;
-      null !== treeBaseDuration$136;
+      treeBaseDuration$140 = completedWork.child;
+      null !== treeBaseDuration$140;
 
     )
       (newChildLanes |=
-        treeBaseDuration$136.lanes | treeBaseDuration$136.childLanes),
-        (subtreeFlags |= treeBaseDuration$136.subtreeFlags),
-        (subtreeFlags |= treeBaseDuration$136.flags),
-        (treeBaseDuration$136.return = completedWork),
-        (treeBaseDuration$136 = treeBaseDuration$136.sibling);
+        treeBaseDuration$140.lanes | treeBaseDuration$140.childLanes),
+        (subtreeFlags |= treeBaseDuration$140.subtreeFlags),
+        (subtreeFlags |= treeBaseDuration$140.flags),
+        (treeBaseDuration$140.return = completedWork),
+        (treeBaseDuration$140 = treeBaseDuration$140.sibling);
   completedWork.subtreeFlags |= subtreeFlags;
   completedWork.childLanes = newChildLanes;
   return didBailout;
@@ -8211,6 +8217,7 @@ function completeWork(current, workInProgress, renderLanes) {
               workInProgress.pendingProps
             ),
         bubbleProperties(workInProgress),
+        (workInProgress.flags &= -16777217),
         null
       );
     case 27:
@@ -8332,10 +8339,10 @@ function completeWork(current, workInProgress, renderLanes) {
           }
           current && markUpdate(workInProgress);
         }
-        workInProgress.flags &= -16777217;
         null !== workInProgress.ref && markRef(workInProgress);
       }
       bubbleProperties(workInProgress);
+      workInProgress.flags &= -16777217;
       return null;
     case 6:
       if (current && null != workInProgress.stateNode)
@@ -8915,8 +8922,8 @@ function safelyDetachRef(current, nearestMountedAncestor) {
             recordLayoutEffectDuration(current);
           }
         else ref(null);
-      } catch (error$169) {
-        captureCommitPhaseError(current, nearestMountedAncestor, error$169);
+      } catch (error$173) {
+        captureCommitPhaseError(current, nearestMountedAncestor, error$173);
       }
     else ref.current = null;
 }
@@ -9214,11 +9221,11 @@ function commitPassiveEffectDurations(finishedRoot, finishedWork) {
         var _finishedWork$memoize = finishedWork.memoizedProps,
           id = _finishedWork$memoize.id;
         _finishedWork$memoize = _finishedWork$memoize.onPostCommit;
-        var commitTime$171 = commitTime,
+        var commitTime$175 = commitTime,
           phase = null === finishedWork.alternate ? "mount" : "update";
         currentUpdateIsNested && (phase = "nested-update");
         "function" === typeof _finishedWork$memoize &&
-          _finishedWork$memoize(id, phase, finishedRoot, commitTime$171);
+          _finishedWork$memoize(id, phase, finishedRoot, commitTime$175);
         finishedWork = finishedWork.return;
         a: for (; null !== finishedWork; ) {
           switch (finishedWork.tag) {
@@ -9245,8 +9252,8 @@ function commitHookLayoutEffects(finishedWork, hookFlags) {
   } else
     try {
       commitHookEffectListMount(hookFlags, finishedWork);
-    } catch (error$173) {
-      captureCommitPhaseError(finishedWork, finishedWork.return, error$173);
+    } catch (error$177) {
+      captureCommitPhaseError(finishedWork, finishedWork.return, error$177);
     }
 }
 function commitClassCallbacks(finishedWork) {
@@ -9345,11 +9352,11 @@ function commitLayoutEffectOnFiber(finishedRoot, current, finishedWork) {
           } else
             try {
               finishedRoot.componentDidMount();
-            } catch (error$174) {
+            } catch (error$178) {
               captureCommitPhaseError(
                 finishedWork,
                 finishedWork.return,
-                error$174
+                error$178
               );
             }
         else {
@@ -9366,11 +9373,11 @@ function commitLayoutEffectOnFiber(finishedRoot, current, finishedWork) {
                   current,
                   finishedRoot.__reactInternalSnapshotBeforeUpdate
                 );
-            } catch (error$175) {
+            } catch (error$179) {
               captureCommitPhaseError(
                 finishedWork,
                 finishedWork.return,
-                error$175
+                error$179
               );
             }
             recordLayoutEffectDuration(finishedWork);
@@ -9381,11 +9388,11 @@ function commitLayoutEffectOnFiber(finishedRoot, current, finishedWork) {
                 current,
                 finishedRoot.__reactInternalSnapshotBeforeUpdate
               );
-            } catch (error$176) {
+            } catch (error$180) {
               captureCommitPhaseError(
                 finishedWork,
                 finishedWork.return,
-                error$176
+                error$180
               );
             }
         }
@@ -10084,22 +10091,22 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
           try {
             startLayoutEffectTimer(),
               commitHookEffectListUnmount(5, finishedWork, finishedWork.return);
-          } catch (error$191) {
+          } catch (error$195) {
             captureCommitPhaseError(
               finishedWork,
               finishedWork.return,
-              error$191
+              error$195
             );
           }
           recordLayoutEffectDuration(finishedWork);
         } else
           try {
             commitHookEffectListUnmount(5, finishedWork, finishedWork.return);
-          } catch (error$192) {
+          } catch (error$196) {
             captureCommitPhaseError(
               finishedWork,
               finishedWork.return,
-              error$192
+              error$196
             );
           }
       }
@@ -10278,11 +10285,11 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
               newProps
             );
             domElement[internalPropsKey] = newProps;
-          } catch (error$193) {
+          } catch (error$197) {
             captureCommitPhaseError(
               finishedWork,
               finishedWork.return,
-              error$193
+              error$197
             );
           }
       break;
@@ -10318,8 +10325,8 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
         root = finishedWork.stateNode;
         try {
           setTextContent(root, "");
-        } catch (error$194) {
-          captureCommitPhaseError(finishedWork, finishedWork.return, error$194);
+        } catch (error$198) {
+          captureCommitPhaseError(finishedWork, finishedWork.return, error$198);
         }
       }
       if (
@@ -10336,8 +10343,8 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
         try {
           updateProperties(flags, maybeNodes, hoistableRoot, current, root),
             (flags[internalPropsKey] = root);
-        } catch (error$197) {
-          captureCommitPhaseError(finishedWork, finishedWork.return, error$197);
+        } catch (error$201) {
+          captureCommitPhaseError(finishedWork, finishedWork.return, error$201);
         }
       break;
     case 6:
@@ -10350,8 +10357,8 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
         flags = finishedWork.memoizedProps;
         try {
           current.nodeValue = flags;
-        } catch (error$198) {
-          captureCommitPhaseError(finishedWork, finishedWork.return, error$198);
+        } catch (error$202) {
+          captureCommitPhaseError(finishedWork, finishedWork.return, error$202);
         }
       }
       break;
@@ -10365,8 +10372,8 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
       if (flags & 4 && null !== current && current.memoizedState.isDehydrated)
         try {
           retryIfBlockedOn(root.containerInfo);
-        } catch (error$199) {
-          captureCommitPhaseError(finishedWork, finishedWork.return, error$199);
+        } catch (error$203) {
+          captureCommitPhaseError(finishedWork, finishedWork.return, error$203);
         }
       break;
     case 4:
@@ -10396,8 +10403,8 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
               null !== retryQueue && suspenseCallback(new Set(retryQueue));
             }
           }
-        } catch (error$201) {
-          captureCommitPhaseError(finishedWork, finishedWork.return, error$201);
+        } catch (error$205) {
+          captureCommitPhaseError(finishedWork, finishedWork.return, error$205);
         }
         current = finishedWork.updateQueue;
         null !== current &&
@@ -10475,11 +10482,11 @@ function commitMutationEffectsOnFiber(finishedWork, root) {
             if (null === current)
               try {
                 root.stateNode.nodeValue = domElement ? "" : root.memoizedProps;
-              } catch (error$181) {
+              } catch (error$185) {
                 captureCommitPhaseError(
                   finishedWork,
                   finishedWork.return,
-                  error$181
+                  error$185
                 );
               }
           } else if (
@@ -10554,21 +10561,21 @@ function commitReconciliationEffects(finishedWork) {
             insertOrAppendPlacementNode(finishedWork, before, parent$jscomp$0);
             break;
           case 5:
-            var parent$182 = JSCompiler_inline_result.stateNode;
+            var parent$186 = JSCompiler_inline_result.stateNode;
             JSCompiler_inline_result.flags & 32 &&
-              (setTextContent(parent$182, ""),
+              (setTextContent(parent$186, ""),
               (JSCompiler_inline_result.flags &= -33));
-            var before$183 = getHostSibling(finishedWork);
-            insertOrAppendPlacementNode(finishedWork, before$183, parent$182);
+            var before$187 = getHostSibling(finishedWork);
+            insertOrAppendPlacementNode(finishedWork, before$187, parent$186);
             break;
           case 3:
           case 4:
-            var parent$184 = JSCompiler_inline_result.stateNode.containerInfo,
-              before$185 = getHostSibling(finishedWork);
+            var parent$188 = JSCompiler_inline_result.stateNode.containerInfo,
+              before$189 = getHostSibling(finishedWork);
             insertOrAppendPlacementNodeIntoContainer(
               finishedWork,
-              before$185,
-              parent$184
+              before$189,
+              parent$188
             );
             break;
           default:
@@ -10760,8 +10767,8 @@ function commitHookPassiveMountEffects(finishedWork, hookFlags) {
   } else
     try {
       commitHookEffectListMount(hookFlags, finishedWork);
-    } catch (error$207) {
-      captureCommitPhaseError(finishedWork, finishedWork.return, error$207);
+    } catch (error$211) {
+      captureCommitPhaseError(finishedWork, finishedWork.return, error$211);
     }
 }
 function commitOffscreenPassiveMountEffects(current, finishedWork, instance) {
@@ -11060,9 +11067,9 @@ function recursivelyTraverseReconnectPassiveEffects(
           );
         break;
       case 22:
-        var instance$212 = finishedWork.stateNode;
+        var instance$216 = finishedWork.stateNode;
         null !== finishedWork.memoizedState
-          ? instance$212._visibility & 4
+          ? instance$216._visibility & 4
             ? recursivelyTraverseReconnectPassiveEffects(
                 finishedRoot,
                 finishedWork,
@@ -11075,7 +11082,7 @@ function recursivelyTraverseReconnectPassiveEffects(
                 finishedRoot,
                 finishedWork
               )
-            : ((instance$212._visibility |= 4),
+            : ((instance$216._visibility |= 4),
               recursivelyTraverseReconnectPassiveEffects(
                 finishedRoot,
                 finishedWork,
@@ -11083,7 +11090,7 @@ function recursivelyTraverseReconnectPassiveEffects(
                 committedTransitions,
                 includeWorkInProgressEffects
               ))
-          : ((instance$212._visibility |= 4),
+          : ((instance$216._visibility |= 4),
             recursivelyTraverseReconnectPassiveEffects(
               finishedRoot,
               finishedWork,
@@ -11096,7 +11103,7 @@ function recursivelyTraverseReconnectPassiveEffects(
           commitOffscreenPassiveMountEffects(
             finishedWork.alternate,
             finishedWork,
-            instance$212
+            instance$216
           );
         break;
       case 24:
@@ -11688,16 +11695,16 @@ function performConcurrentWorkOnRoot(root, didTimeout) {
         exitStatus = renderRootSync(root, lanes);
         if (2 === exitStatus) {
           errorRetryLanes = lanes;
-          var errorRetryLanes$221 = getLanesToRetrySynchronouslyOnError(
+          var errorRetryLanes$225 = getLanesToRetrySynchronouslyOnError(
             root,
             errorRetryLanes
           );
-          0 !== errorRetryLanes$221 &&
-            ((lanes = errorRetryLanes$221),
+          0 !== errorRetryLanes$225 &&
+            ((lanes = errorRetryLanes$225),
             (exitStatus = recoverFromConcurrentError(
               root,
               errorRetryLanes,
-              errorRetryLanes$221
+              errorRetryLanes$225
             )));
         }
         if (1 === exitStatus)
@@ -11746,14 +11753,14 @@ function performConcurrentWorkOnRoot(root, didTimeout) {
           if ((lanes & 8388480) === lanes) break;
           exitStatus = lanes;
           errorRetryLanes = root.eventTimes;
-          for (errorRetryLanes$221 = -1; 0 < exitStatus; ) {
+          for (errorRetryLanes$225 = -1; 0 < exitStatus; ) {
             var index$12 = 31 - clz32(exitStatus),
               lane = 1 << index$12;
             index$12 = errorRetryLanes[index$12];
-            index$12 > errorRetryLanes$221 && (errorRetryLanes$221 = index$12);
+            index$12 > errorRetryLanes$225 && (errorRetryLanes$225 = index$12);
             exitStatus &= ~lane;
           }
-          exitStatus = errorRetryLanes$221;
+          exitStatus = errorRetryLanes$225;
           exitStatus = now$1() - exitStatus;
           exitStatus =
             (120 > exitStatus
@@ -12006,34 +12013,35 @@ function prepareFreshStack(root, lanes) {
 function handleThrow(root, thrownValue) {
   ReactCurrentDispatcher$1.current = ContextOnlyDispatcher;
   ReactCurrentOwner.current = null;
-  if (thrownValue === SuspenseException) {
-    if (null === suspendedThenable) throw Error(formatProdErrorMessage(459));
-    thrownValue = suspendedThenable;
-    suspendedThenable = null;
-    (workInProgressRootRenderLanes & 8388480) === workInProgressRootRenderLanes
-      ? (root = null === shellBoundary ? !0 : !1)
-      : ((root = suspenseHandlerStackCursor.current),
-        (root =
-          null !== root &&
-          (workInProgressRootRenderLanes & 125829120) ===
-            workInProgressRootRenderLanes
-            ? root === shellBoundary
-            : !1));
-    workInProgressSuspendedReason =
-      root &&
-      0 === (workInProgressRootSkippedLanes & 268435455) &&
-      0 === (workInProgressRootInterleavedUpdatedLanes & 268435455)
-        ? 2
-        : 3;
-  } else
-    workInProgressSuspendedReason =
-      thrownValue === SelectiveHydrationException
-        ? 6
-        : null !== thrownValue &&
-          "object" === typeof thrownValue &&
-          "function" === typeof thrownValue.then
-        ? 4
-        : 1;
+  thrownValue === SuspenseException
+    ? ((thrownValue = getSuspendedThenable()),
+      (workInProgressRootRenderLanes & 8388480) ===
+      workInProgressRootRenderLanes
+        ? (root = null === shellBoundary ? !0 : !1)
+        : ((root = suspenseHandlerStackCursor.current),
+          (root =
+            null !== root &&
+            (workInProgressRootRenderLanes & 125829120) ===
+              workInProgressRootRenderLanes
+              ? root === shellBoundary
+              : !1)),
+      (workInProgressSuspendedReason =
+        root &&
+        0 === (workInProgressRootSkippedLanes & 268435455) &&
+        0 === (workInProgressRootInterleavedUpdatedLanes & 268435455)
+          ? 2
+          : 3))
+    : thrownValue === SuspenseyCommitException
+    ? ((thrownValue = getSuspendedThenable()),
+      (workInProgressSuspendedReason = 4))
+    : (workInProgressSuspendedReason =
+        thrownValue === SelectiveHydrationException
+          ? 8
+          : null !== thrownValue &&
+            "object" === typeof thrownValue &&
+            "function" === typeof thrownValue.then
+          ? 6
+          : 1);
   workInProgressThrownValue = thrownValue;
   root = workInProgress;
   if (null === root)
@@ -12056,8 +12064,8 @@ function handleThrow(root, thrownValue) {
         break;
       case 2:
       case 3:
-      case 4:
-      case 5:
+      case 6:
+      case 7:
         enableSchedulingProfiler &&
           null !== injectedProfilingHooks &&
           "function" === typeof injectedProfilingHooks.markComponentSuspended &&
@@ -12114,7 +12122,7 @@ function renderRootSync(root, lanes) {
           (memoizedUpdaters = workInProgressThrownValue),
           workInProgressSuspendedReason)
         ) {
-          case 6:
+          case 8:
             resetWorkInProgressStack();
             workInProgressRootExitStatus = 6;
             break a;
@@ -12125,8 +12133,8 @@ function renderRootSync(root, lanes) {
         }
       workLoopSync();
       break;
-    } catch (thrownValue$224) {
-      handleThrow(root, thrownValue$224);
+    } catch (thrownValue$228) {
+      handleThrow(root, thrownValue$228);
     }
   while (1);
   resetContextDependencies();
@@ -12166,7 +12174,7 @@ function renderRootConcurrent(root, lanes) {
   a: do
     try {
       if (0 !== workInProgressSuspendedReason && null !== workInProgress)
-        switch (
+        b: switch (
           ((lanes = workInProgress),
           (memoizedUpdaters = workInProgressThrownValue),
           workInProgressSuspendedReason)
@@ -12186,15 +12194,18 @@ function renderRootConcurrent(root, lanes) {
             lanes = function () {
               2 === workInProgressSuspendedReason &&
                 workInProgressRoot === root &&
-                (workInProgressSuspendedReason = 5);
+                (workInProgressSuspendedReason = 7);
               ensureRootIsScheduled(root, now$1());
             };
             memoizedUpdaters.then(lanes, lanes);
             break a;
           case 3:
+            workInProgressSuspendedReason = 7;
+            break a;
+          case 4:
             workInProgressSuspendedReason = 5;
             break a;
-          case 5:
+          case 7:
             isThenableResolved(memoizedUpdaters)
               ? ((workInProgressSuspendedReason = 0),
                 (workInProgressThrownValue = null),
@@ -12203,12 +12214,35 @@ function renderRootConcurrent(root, lanes) {
                 (workInProgressThrownValue = null),
                 unwindSuspendedUnitOfWork(lanes, memoizedUpdaters));
             break;
-          case 4:
+          case 5:
+            switch (workInProgress.tag) {
+              case 5:
+              case 26:
+              case 27:
+                lanes = workInProgress;
+                workInProgressSuspendedReason = 0;
+                workInProgressThrownValue = null;
+                var sibling = lanes.sibling;
+                if (null !== sibling) workInProgress = sibling;
+                else {
+                  var returnFiber = lanes.return;
+                  null !== returnFiber
+                    ? ((workInProgress = returnFiber),
+                      completeUnitOfWork(returnFiber))
+                    : (workInProgress = null);
+                }
+                break b;
+            }
             workInProgressSuspendedReason = 0;
             workInProgressThrownValue = null;
             unwindSuspendedUnitOfWork(lanes, memoizedUpdaters);
             break;
           case 6:
+            workInProgressSuspendedReason = 0;
+            workInProgressThrownValue = null;
+            unwindSuspendedUnitOfWork(lanes, memoizedUpdaters);
+            break;
+          case 8:
             resetWorkInProgressStack();
             workInProgressRootExitStatus = 6;
             break a;
@@ -12217,8 +12251,8 @@ function renderRootConcurrent(root, lanes) {
         }
       workLoopConcurrent();
       break;
-    } catch (thrownValue$226) {
-      handleThrow(root, thrownValue$226);
+    } catch (thrownValue$230) {
+      handleThrow(root, thrownValue$230);
     }
   while (1);
   resetContextDependencies();
@@ -12393,10 +12427,10 @@ function unwindSuspendedUnitOfWork(unitOfWork, thrownValue) {
                       };
                       suspenseBoundary.updateQueue = newOffscreenQueue;
                     } else {
-                      var retryQueue$90 = offscreenQueue.retryQueue;
-                      null === retryQueue$90
+                      var retryQueue$94 = offscreenQueue.retryQueue;
+                      null === retryQueue$94
                         ? (offscreenQueue.retryQueue = new Set([wakeable]))
-                        : retryQueue$90.add(wakeable);
+                        : retryQueue$94.add(wakeable);
                     }
                   }
                   break;
@@ -12595,7 +12629,7 @@ function commitRootImpl(
     var prevExecutionContext = executionContext;
     executionContext |= 4;
     ReactCurrentOwner.current = null;
-    var shouldFireAfterActiveInstanceBlur$229 = commitBeforeMutationEffects(
+    var shouldFireAfterActiveInstanceBlur$233 = commitBeforeMutationEffects(
       root,
       finishedWork
     );
@@ -12603,7 +12637,7 @@ function commitRootImpl(
     enableProfilerNestedUpdateScheduledHook &&
       (rootCommittingMutationOrLayoutEffects = root);
     commitMutationEffects(root, finishedWork, lanes);
-    shouldFireAfterActiveInstanceBlur$229 &&
+    shouldFireAfterActiveInstanceBlur$233 &&
       ((_enabled = !0),
       dispatchAfterDetachedBlur(selectionInformation.focusedElem),
       (_enabled = !1));
@@ -12697,7 +12731,7 @@ function releaseRootPooledCache(root, remainingLanes) {
 }
 function flushPassiveEffects() {
   if (null !== rootWithPendingPassiveEffects) {
-    var root$230 = rootWithPendingPassiveEffects,
+    var root$234 = rootWithPendingPassiveEffects,
       remainingLanes = pendingPassiveEffectsRemainingLanes;
     pendingPassiveEffectsRemainingLanes = 0;
     var renderPriority = lanesToEventPriority(pendingPassiveEffectsLanes);
@@ -12713,7 +12747,7 @@ function flushPassiveEffects() {
     } finally {
       (currentUpdatePriority = previousPriority),
         (ReactCurrentBatchConfig$1.transition = prevTransition),
-        releaseRootPooledCache(root$230, remainingLanes);
+        releaseRootPooledCache(root$234, remainingLanes);
     }
   }
   return !1;
@@ -14083,12 +14117,12 @@ function getPublicRootInstance(container) {
 function attemptSynchronousHydration(fiber) {
   switch (fiber.tag) {
     case 3:
-      var root$233 = fiber.stateNode;
-      if (root$233.current.memoizedState.isDehydrated) {
-        var lanes = getHighestPriorityLanes(root$233.pendingLanes);
+      var root$237 = fiber.stateNode;
+      if (root$237.current.memoizedState.isDehydrated) {
+        var lanes = getHighestPriorityLanes(root$237.pendingLanes);
         0 !== lanes &&
-          (markRootEntangled(root$233, lanes | 2),
-          ensureRootIsScheduled(root$233, now$1()),
+          (markRootEntangled(root$237, lanes | 2),
+          ensureRootIsScheduled(root$237, now$1()),
           0 === (executionContext & 6) &&
             ((workInProgressRootRenderTargetTime = now$1() + 500),
             flushSyncCallbacks()));
@@ -14660,19 +14694,19 @@ function getTargetInstForChangeEvent(domEventName, targetInst) {
 }
 var isInputEventSupported = !1;
 if (canUseDOM) {
-  var JSCompiler_inline_result$jscomp$336;
+  var JSCompiler_inline_result$jscomp$340;
   if (canUseDOM) {
-    var isSupported$jscomp$inline_1692 = "oninput" in document;
-    if (!isSupported$jscomp$inline_1692) {
-      var element$jscomp$inline_1693 = document.createElement("div");
-      element$jscomp$inline_1693.setAttribute("oninput", "return;");
-      isSupported$jscomp$inline_1692 =
-        "function" === typeof element$jscomp$inline_1693.oninput;
+    var isSupported$jscomp$inline_1694 = "oninput" in document;
+    if (!isSupported$jscomp$inline_1694) {
+      var element$jscomp$inline_1695 = document.createElement("div");
+      element$jscomp$inline_1695.setAttribute("oninput", "return;");
+      isSupported$jscomp$inline_1694 =
+        "function" === typeof element$jscomp$inline_1695.oninput;
     }
-    JSCompiler_inline_result$jscomp$336 = isSupported$jscomp$inline_1692;
-  } else JSCompiler_inline_result$jscomp$336 = !1;
+    JSCompiler_inline_result$jscomp$340 = isSupported$jscomp$inline_1694;
+  } else JSCompiler_inline_result$jscomp$340 = !1;
   isInputEventSupported =
-    JSCompiler_inline_result$jscomp$336 &&
+    JSCompiler_inline_result$jscomp$340 &&
     (!document.documentMode || 9 < document.documentMode);
 }
 function stopWatchingForValueChange() {
@@ -14810,20 +14844,20 @@ function registerSimpleEvent(domEventName, reactName) {
   registerTwoPhaseEvent(reactName, [domEventName]);
 }
 for (
-  var i$jscomp$inline_1705 = 0;
-  i$jscomp$inline_1705 < simpleEventPluginEvents.length;
-  i$jscomp$inline_1705++
+  var i$jscomp$inline_1707 = 0;
+  i$jscomp$inline_1707 < simpleEventPluginEvents.length;
+  i$jscomp$inline_1707++
 ) {
-  var eventName$jscomp$inline_1706 =
-      simpleEventPluginEvents[i$jscomp$inline_1705],
-    domEventName$jscomp$inline_1707 =
-      eventName$jscomp$inline_1706.toLowerCase(),
-    capitalizedEvent$jscomp$inline_1708 =
-      eventName$jscomp$inline_1706[0].toUpperCase() +
-      eventName$jscomp$inline_1706.slice(1);
+  var eventName$jscomp$inline_1708 =
+      simpleEventPluginEvents[i$jscomp$inline_1707],
+    domEventName$jscomp$inline_1709 =
+      eventName$jscomp$inline_1708.toLowerCase(),
+    capitalizedEvent$jscomp$inline_1710 =
+      eventName$jscomp$inline_1708[0].toUpperCase() +
+      eventName$jscomp$inline_1708.slice(1);
   registerSimpleEvent(
-    domEventName$jscomp$inline_1707,
-    "on" + capitalizedEvent$jscomp$inline_1708
+    domEventName$jscomp$inline_1709,
+    "on" + capitalizedEvent$jscomp$inline_1710
   );
 }
 registerSimpleEvent(ANIMATION_END, "onAnimationEnd");
@@ -16402,11 +16436,11 @@ function legacyCreateRootFromDOMContainer(
     if ("function" === typeof callback) {
       var originalCallback = callback;
       callback = function () {
-        var instance = getPublicRootInstance(root$248);
+        var instance = getPublicRootInstance(root$252);
         originalCallback.call(instance);
       };
     }
-    var root$248 = createHydrationContainer(
+    var root$252 = createHydrationContainer(
       initialChildren,
       callback,
       container,
@@ -16418,23 +16452,23 @@ function legacyCreateRootFromDOMContainer(
       noopOnRecoverableError,
       null
     );
-    container._reactRootContainer = root$248;
-    container[internalContainerInstanceKey] = root$248.current;
+    container._reactRootContainer = root$252;
+    container[internalContainerInstanceKey] = root$252.current;
     listenToAllSupportedEvents(
       8 === container.nodeType ? container.parentNode : container
     );
     flushSync$1();
-    return root$248;
+    return root$252;
   }
   clearContainer(container);
   if ("function" === typeof callback) {
-    var originalCallback$249 = callback;
+    var originalCallback$253 = callback;
     callback = function () {
-      var instance = getPublicRootInstance(root$250);
-      originalCallback$249.call(instance);
+      var instance = getPublicRootInstance(root$254);
+      originalCallback$253.call(instance);
     };
   }
-  var root$250 = createFiberRoot(
+  var root$254 = createFiberRoot(
     container,
     0,
     !1,
@@ -16446,15 +16480,15 @@ function legacyCreateRootFromDOMContainer(
     noopOnRecoverableError,
     null
   );
-  container._reactRootContainer = root$250;
-  container[internalContainerInstanceKey] = root$250.current;
+  container._reactRootContainer = root$254;
+  container[internalContainerInstanceKey] = root$254.current;
   listenToAllSupportedEvents(
     8 === container.nodeType ? container.parentNode : container
   );
   flushSync$1(function () {
-    updateContainer(initialChildren, root$250, parentComponent, callback);
+    updateContainer(initialChildren, root$254, parentComponent, callback);
   });
-  return root$250;
+  return root$254;
 }
 function legacyRenderSubtreeIntoContainer(
   parentComponent,
@@ -16513,10 +16547,10 @@ Internals.Events = [
   restoreStateIfNeeded,
   batchedUpdates$1
 ];
-var devToolsConfig$jscomp$inline_1861 = {
+var devToolsConfig$jscomp$inline_1863 = {
   findFiberByHostInstance: getClosestInstanceFromNode,
   bundleType: 0,
-  version: "18.3.0-www-classic-388a54e1",
+  version: "18.3.0-www-classic-cd7dacca",
   rendererPackageName: "react-dom"
 };
 (function (internals) {
@@ -16534,10 +16568,10 @@ var devToolsConfig$jscomp$inline_1861 = {
   } catch (err) {}
   return hook.checkDCE ? !0 : !1;
 })({
-  bundleType: devToolsConfig$jscomp$inline_1861.bundleType,
-  version: devToolsConfig$jscomp$inline_1861.version,
-  rendererPackageName: devToolsConfig$jscomp$inline_1861.rendererPackageName,
-  rendererConfig: devToolsConfig$jscomp$inline_1861.rendererConfig,
+  bundleType: devToolsConfig$jscomp$inline_1863.bundleType,
+  version: devToolsConfig$jscomp$inline_1863.version,
+  rendererPackageName: devToolsConfig$jscomp$inline_1863.rendererPackageName,
+  rendererConfig: devToolsConfig$jscomp$inline_1863.rendererConfig,
   overrideHookState: null,
   overrideHookStateDeletePath: null,
   overrideHookStateRenamePath: null,
@@ -16553,14 +16587,14 @@ var devToolsConfig$jscomp$inline_1861 = {
     return null === fiber ? null : fiber.stateNode;
   },
   findFiberByHostInstance:
-    devToolsConfig$jscomp$inline_1861.findFiberByHostInstance ||
+    devToolsConfig$jscomp$inline_1863.findFiberByHostInstance ||
     emptyFindFiberByHostInstance,
   findHostInstancesForRefresh: null,
   scheduleRefresh: null,
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-www-classic-388a54e1"
+  reconcilerVersion: "18.3.0-www-classic-cd7dacca"
 });
 assign(Internals, {
   ReactBrowserEventEmitter: {
@@ -16787,7 +16821,7 @@ exports.unstable_renderSubtreeIntoContainer = function (
   );
 };
 exports.unstable_runWithPriority = runWithPriority;
-exports.version = "18.3.0-www-classic-388a54e1";
+exports.version = "18.3.0-www-classic-cd7dacca";
 
           /* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */
 if (
diff --git a/compiled/facebook-www/ReactDOM-profiling.modern.js b/compiled/facebook-www/ReactDOM-profiling.modern.js
index 0634d49a94ce9..df406f3c23278 100644
--- a/compiled/facebook-www/ReactDOM-profiling.modern.js
+++ b/compiled/facebook-www/ReactDOM-profiling.modern.js
@@ -2529,6 +2529,7 @@ function shallowEqual(objA, objB) {
   return !0;
 }
 var SuspenseException = Error(formatProdErrorMessage(460)),
+  SuspenseyCommitException = Error(formatProdErrorMessage(474)),
   noopSuspenseyCommitThenable = { then: function () {} };
 function isThenableResolved(thenable) {
   thenable = thenable.status;
@@ -2576,8 +2577,14 @@ function trackUsedThenable(thenableState, thenable, index) {
       throw SuspenseException;
   }
 }
-var suspendedThenable = null,
-  thenableState$1 = null,
+var suspendedThenable = null;
+function getSuspendedThenable() {
+  if (null === suspendedThenable) throw Error(formatProdErrorMessage(459));
+  var thenable = suspendedThenable;
+  suspendedThenable = null;
+  return thenable;
+}
+var thenableState$1 = null,
   thenableIndexCounter$1 = 0;
 function unwrapThenable(thenable) {
   var index = thenableIndexCounter$1;
@@ -6607,7 +6614,6 @@ function updateHostComponent(current, workInProgress, type, newProps) {
   var oldProps = current.memoizedProps;
   if (oldProps !== newProps) {
     current = workInProgress.stateNode;
-    workInProgress.flags &= -16777217;
     var updatePayload = null;
     switch (type) {
       case "input":
@@ -6879,6 +6885,7 @@ function completeWork(current, workInProgress, renderLanes) {
               workInProgress.pendingProps
             ),
         bubbleProperties(workInProgress),
+        (workInProgress.flags &= -16777217),
         null
       );
     case 27:
@@ -7000,10 +7007,10 @@ function completeWork(current, workInProgress, renderLanes) {
           }
           current && markUpdate(workInProgress);
         }
-        workInProgress.flags &= -16777217;
         null !== workInProgress.ref && markRef(workInProgress);
       }
       bubbleProperties(workInProgress);
+      workInProgress.flags &= -16777217;
       return null;
     case 6:
       if (current && null != workInProgress.stateNode)
@@ -10667,34 +10674,35 @@ function prepareFreshStack(root, lanes) {
 function handleThrow(root, thrownValue) {
   ReactCurrentDispatcher$1.current = ContextOnlyDispatcher;
   ReactCurrentOwner.current = null;
-  if (thrownValue === SuspenseException) {
-    if (null === suspendedThenable) throw Error(formatProdErrorMessage(459));
-    thrownValue = suspendedThenable;
-    suspendedThenable = null;
-    (workInProgressRootRenderLanes & 8388480) === workInProgressRootRenderLanes
-      ? (root = null === shellBoundary ? !0 : !1)
-      : ((root = suspenseHandlerStackCursor.current),
-        (root =
-          null !== root &&
-          (workInProgressRootRenderLanes & 125829120) ===
-            workInProgressRootRenderLanes
-            ? root === shellBoundary
-            : !1));
-    workInProgressSuspendedReason =
-      root &&
-      0 === (workInProgressRootSkippedLanes & 268435455) &&
-      0 === (workInProgressRootInterleavedUpdatedLanes & 268435455)
-        ? 2
-        : 3;
-  } else
-    workInProgressSuspendedReason =
-      thrownValue === SelectiveHydrationException
-        ? 6
-        : null !== thrownValue &&
-          "object" === typeof thrownValue &&
-          "function" === typeof thrownValue.then
-        ? 4
-        : 1;
+  thrownValue === SuspenseException
+    ? ((thrownValue = getSuspendedThenable()),
+      (workInProgressRootRenderLanes & 8388480) ===
+      workInProgressRootRenderLanes
+        ? (root = null === shellBoundary ? !0 : !1)
+        : ((root = suspenseHandlerStackCursor.current),
+          (root =
+            null !== root &&
+            (workInProgressRootRenderLanes & 125829120) ===
+              workInProgressRootRenderLanes
+              ? root === shellBoundary
+              : !1)),
+      (workInProgressSuspendedReason =
+        root &&
+        0 === (workInProgressRootSkippedLanes & 268435455) &&
+        0 === (workInProgressRootInterleavedUpdatedLanes & 268435455)
+          ? 2
+          : 3))
+    : thrownValue === SuspenseyCommitException
+    ? ((thrownValue = getSuspendedThenable()),
+      (workInProgressSuspendedReason = 4))
+    : (workInProgressSuspendedReason =
+        thrownValue === SelectiveHydrationException
+          ? 8
+          : null !== thrownValue &&
+            "object" === typeof thrownValue &&
+            "function" === typeof thrownValue.then
+          ? 6
+          : 1);
   workInProgressThrownValue = thrownValue;
   root = workInProgress;
   if (null === root)
@@ -10717,8 +10725,8 @@ function handleThrow(root, thrownValue) {
         break;
       case 2:
       case 3:
-      case 4:
-      case 5:
+      case 6:
+      case 7:
         enableSchedulingProfiler &&
           null !== injectedProfilingHooks &&
           "function" === typeof injectedProfilingHooks.markComponentSuspended &&
@@ -10775,7 +10783,7 @@ function renderRootSync(root, lanes) {
           (memoizedUpdaters = workInProgressThrownValue),
           workInProgressSuspendedReason)
         ) {
-          case 6:
+          case 8:
             resetWorkInProgressStack();
             workInProgressRootExitStatus = 6;
             break a;
@@ -10827,7 +10835,7 @@ function renderRootConcurrent(root, lanes) {
   a: do
     try {
       if (0 !== workInProgressSuspendedReason && null !== workInProgress)
-        switch (
+        b: switch (
           ((lanes = workInProgress),
           (memoizedUpdaters = workInProgressThrownValue),
           workInProgressSuspendedReason)
@@ -10847,15 +10855,18 @@ function renderRootConcurrent(root, lanes) {
             lanes = function () {
               2 === workInProgressSuspendedReason &&
                 workInProgressRoot === root &&
-                (workInProgressSuspendedReason = 5);
+                (workInProgressSuspendedReason = 7);
               ensureRootIsScheduled(root, now$1());
             };
             memoizedUpdaters.then(lanes, lanes);
             break a;
           case 3:
+            workInProgressSuspendedReason = 7;
+            break a;
+          case 4:
             workInProgressSuspendedReason = 5;
             break a;
-          case 5:
+          case 7:
             isThenableResolved(memoizedUpdaters)
               ? ((workInProgressSuspendedReason = 0),
                 (workInProgressThrownValue = null),
@@ -10864,12 +10875,35 @@ function renderRootConcurrent(root, lanes) {
                 (workInProgressThrownValue = null),
                 unwindSuspendedUnitOfWork(lanes, memoizedUpdaters));
             break;
-          case 4:
+          case 5:
+            switch (workInProgress.tag) {
+              case 5:
+              case 26:
+              case 27:
+                lanes = workInProgress;
+                workInProgressSuspendedReason = 0;
+                workInProgressThrownValue = null;
+                var sibling = lanes.sibling;
+                if (null !== sibling) workInProgress = sibling;
+                else {
+                  var returnFiber = lanes.return;
+                  null !== returnFiber
+                    ? ((workInProgress = returnFiber),
+                      completeUnitOfWork(returnFiber))
+                    : (workInProgress = null);
+                }
+                break b;
+            }
             workInProgressSuspendedReason = 0;
             workInProgressThrownValue = null;
             unwindSuspendedUnitOfWork(lanes, memoizedUpdaters);
             break;
           case 6:
+            workInProgressSuspendedReason = 0;
+            workInProgressThrownValue = null;
+            unwindSuspendedUnitOfWork(lanes, memoizedUpdaters);
+            break;
+          case 8:
             resetWorkInProgressStack();
             workInProgressRootExitStatus = 6;
             break a;
@@ -13909,19 +13943,19 @@ function getTargetInstForChangeEvent(domEventName, targetInst) {
 }
 var isInputEventSupported = !1;
 if (canUseDOM) {
-  var JSCompiler_inline_result$jscomp$319;
+  var JSCompiler_inline_result$jscomp$323;
   if (canUseDOM) {
-    var isSupported$jscomp$inline_1611 = "oninput" in document;
-    if (!isSupported$jscomp$inline_1611) {
-      var element$jscomp$inline_1612 = document.createElement("div");
-      element$jscomp$inline_1612.setAttribute("oninput", "return;");
-      isSupported$jscomp$inline_1611 =
-        "function" === typeof element$jscomp$inline_1612.oninput;
-    }
-    JSCompiler_inline_result$jscomp$319 = isSupported$jscomp$inline_1611;
-  } else JSCompiler_inline_result$jscomp$319 = !1;
+    var isSupported$jscomp$inline_1613 = "oninput" in document;
+    if (!isSupported$jscomp$inline_1613) {
+      var element$jscomp$inline_1614 = document.createElement("div");
+      element$jscomp$inline_1614.setAttribute("oninput", "return;");
+      isSupported$jscomp$inline_1613 =
+        "function" === typeof element$jscomp$inline_1614.oninput;
+    }
+    JSCompiler_inline_result$jscomp$323 = isSupported$jscomp$inline_1613;
+  } else JSCompiler_inline_result$jscomp$323 = !1;
   isInputEventSupported =
-    JSCompiler_inline_result$jscomp$319 &&
+    JSCompiler_inline_result$jscomp$323 &&
     (!document.documentMode || 9 < document.documentMode);
 }
 function stopWatchingForValueChange() {
@@ -14230,20 +14264,20 @@ function registerSimpleEvent(domEventName, reactName) {
   registerTwoPhaseEvent(reactName, [domEventName]);
 }
 for (
-  var i$jscomp$inline_1652 = 0;
-  i$jscomp$inline_1652 < simpleEventPluginEvents.length;
-  i$jscomp$inline_1652++
+  var i$jscomp$inline_1654 = 0;
+  i$jscomp$inline_1654 < simpleEventPluginEvents.length;
+  i$jscomp$inline_1654++
 ) {
-  var eventName$jscomp$inline_1653 =
-      simpleEventPluginEvents[i$jscomp$inline_1652],
-    domEventName$jscomp$inline_1654 =
-      eventName$jscomp$inline_1653.toLowerCase(),
-    capitalizedEvent$jscomp$inline_1655 =
-      eventName$jscomp$inline_1653[0].toUpperCase() +
-      eventName$jscomp$inline_1653.slice(1);
+  var eventName$jscomp$inline_1655 =
+      simpleEventPluginEvents[i$jscomp$inline_1654],
+    domEventName$jscomp$inline_1656 =
+      eventName$jscomp$inline_1655.toLowerCase(),
+    capitalizedEvent$jscomp$inline_1657 =
+      eventName$jscomp$inline_1655[0].toUpperCase() +
+      eventName$jscomp$inline_1655.slice(1);
   registerSimpleEvent(
-    domEventName$jscomp$inline_1654,
-    "on" + capitalizedEvent$jscomp$inline_1655
+    domEventName$jscomp$inline_1656,
+    "on" + capitalizedEvent$jscomp$inline_1657
   );
 }
 registerSimpleEvent(ANIMATION_END, "onAnimationEnd");
@@ -15382,12 +15416,12 @@ function preinit$1(href, options) {
       switch (as) {
         case "style":
           as = getResourcesFromRoot(resourceRoot).hoistableStyles;
-          var key$221 = getStyleKey(href),
+          var key$224 = getStyleKey(href),
             precedence = options.precedence || "default",
-            resource = as.get(key$221);
+            resource = as.get(key$224);
           if (resource) break;
           resource = resourceRoot.querySelector(
-            getStylesheetSelectorFromKey(key$221)
+            getStylesheetSelectorFromKey(key$224)
           );
           resource ||
             ((href = {
@@ -15396,7 +15430,7 @@ function preinit$1(href, options) {
               "data-precedence": precedence,
               crossOrigin: options.crossOrigin
             }),
-            (options = preloadPropsMap.get(key$221)) &&
+            (options = preloadPropsMap.get(key$224)) &&
               adoptPreloadPropsForStylesheet(href, options),
             (resource = (
               resourceRoot.ownerDocument || resourceRoot
@@ -15405,15 +15439,15 @@ function preinit$1(href, options) {
             setInitialProperties(resource, "link", href),
             insertStylesheet(resource, precedence, resourceRoot));
           resource = { type: "stylesheet", instance: resource, count: 1 };
-          as.set(key$221, resource);
+          as.set(key$224, resource);
           break;
         case "script":
           (as = getResourcesFromRoot(resourceRoot).hoistableScripts),
-            (key$221 = getScriptKey(href)),
-            (precedence = as.get(key$221)),
+            (key$224 = getScriptKey(href)),
+            (precedence = as.get(key$224)),
             precedence ||
               ((precedence = resourceRoot.querySelector(
-                "script[async]" + key$221
+                "script[async]" + key$224
               )),
               precedence ||
                 ((href = {
@@ -15422,7 +15456,7 @@ function preinit$1(href, options) {
                   crossOrigin: options.crossOrigin,
                   integrity: options.integrity
                 }),
-                (options = preloadPropsMap.get(key$221)) &&
+                (options = preloadPropsMap.get(key$224)) &&
                   adoptPreloadPropsForScript(href, options),
                 (options = resourceRoot.ownerDocument || resourceRoot),
                 (precedence = options.createElement("script")),
@@ -15430,13 +15464,13 @@ function preinit$1(href, options) {
                 setInitialProperties(precedence, "link", href),
                 options.head.appendChild(precedence)),
               (precedence = { type: "script", instance: precedence, count: 1 }),
-              as.set(key$221, precedence));
+              as.set(key$224, precedence));
       }
     else if ("style" === as || "script" === as)
       if ((resourceRoot = getDocumentForPreloads())) {
-        key$221 = escapeSelectorAttributeValueInsideDoubleQuotes(href);
-        precedence = key$221 =
-          'link[rel="preload"][as="' + as + '"][href="' + key$221 + '"]';
+        key$224 = escapeSelectorAttributeValueInsideDoubleQuotes(href);
+        precedence = key$224 =
+          'link[rel="preload"][as="' + as + '"][href="' + key$224 + '"]';
         switch (as) {
           case "style":
             precedence = getStyleKey(href);
@@ -15453,7 +15487,7 @@ function preinit$1(href, options) {
             integrity: options.integrity
           }),
           preloadPropsMap.set(precedence, href),
-          null === resourceRoot.querySelector(key$221) &&
+          null === resourceRoot.querySelector(key$224) &&
             ((options = resourceRoot.createElement("link")),
             setInitialProperties(options, "link", href),
             markNodeAsHoistable(options),
@@ -15485,14 +15519,14 @@ function getResource(type, currentProps, pendingProps) {
         "string" === typeof pendingProps.href &&
         "string" === typeof pendingProps.precedence
       ) {
-        var key$228 = getStyleKey(pendingProps.href),
-          styles$229 = getResourcesFromRoot(currentProps).hoistableStyles;
-        type = styles$229.get(key$228);
+        var key$231 = getStyleKey(pendingProps.href),
+          styles$232 = getResourcesFromRoot(currentProps).hoistableStyles;
+        type = styles$232.get(key$231);
         type ||
           ((currentProps = currentProps.ownerDocument || currentProps),
           (type = { type: "stylesheet", instance: null, count: 0 }),
-          styles$229.set(key$228, type),
-          preloadPropsMap.has(key$228) ||
+          styles$232.set(key$231, type),
+          preloadPropsMap.has(key$231) ||
             ((pendingProps = {
               rel: "preload",
               as: "style",
@@ -15503,16 +15537,16 @@ function getResource(type, currentProps, pendingProps) {
               hrefLang: pendingProps.hrefLang,
               referrerPolicy: pendingProps.referrerPolicy
             }),
-            preloadPropsMap.set(key$228, pendingProps),
-            currentProps.querySelector(getStylesheetSelectorFromKey(key$228)) ||
+            preloadPropsMap.set(key$231, pendingProps),
+            currentProps.querySelector(getStylesheetSelectorFromKey(key$231)) ||
               null !==
                 currentProps.querySelector(
-                  'link[rel="preload"][as="style"][' + key$228 + "]"
+                  'link[rel="preload"][as="style"][' + key$231 + "]"
                 ) ||
-              ((key$228 = currentProps.createElement("link")),
-              setInitialProperties(key$228, "link", pendingProps),
-              markNodeAsHoistable(key$228),
-              currentProps.head.appendChild(key$228))));
+              ((key$231 = currentProps.createElement("link")),
+              setInitialProperties(key$231, "link", pendingProps),
+              markNodeAsHoistable(key$231),
+              currentProps.head.appendChild(key$231))));
         return type;
       }
       return null;
@@ -15562,14 +15596,14 @@ function acquireResource(hoistableRoot, resource, props) {
         return (resource.instance = key);
       case "stylesheet":
         styleProps = getStyleKey(props.href);
-        var instance$235 = hoistableRoot.querySelector(
+        var instance$239 = hoistableRoot.querySelector(
           getStylesheetSelectorFromKey(styleProps)
         );
-        if (instance$235)
+        if (instance$239)
           return (
-            (resource.instance = instance$235),
-            markNodeAsHoistable(instance$235),
-            instance$235
+            (resource.instance = instance$239),
+            markNodeAsHoistable(instance$239),
+            instance$239
           );
         key = assign({}, props, {
           "data-precedence": props.precedence,
@@ -15577,11 +15611,11 @@ function acquireResource(hoistableRoot, resource, props) {
         });
         (styleProps = preloadPropsMap.get(styleProps)) &&
           adoptPreloadPropsForStylesheet(key, styleProps);
-        instance$235 = (
+        instance$239 = (
           hoistableRoot.ownerDocument || hoistableRoot
         ).createElement("link");
-        markNodeAsHoistable(instance$235);
-        var linkInstance = instance$235;
+        markNodeAsHoistable(instance$239);
+        var linkInstance = instance$239;
         linkInstance._p = new Promise(function (resolve, reject) {
           linkInstance.onload = resolve;
           linkInstance.onerror = reject;
@@ -15593,14 +15627,14 @@ function acquireResource(hoistableRoot, resource, props) {
             return (linkInstance._p.s = "e");
           }
         );
-        setInitialProperties(instance$235, "link", key);
-        insertStylesheet(instance$235, props.precedence, hoistableRoot);
-        return (resource.instance = instance$235);
+        setInitialProperties(instance$239, "link", key);
+        insertStylesheet(instance$239, props.precedence, hoistableRoot);
+        return (resource.instance = instance$239);
       case "script":
-        instance$235 = getScriptKey(props.src);
+        instance$239 = getScriptKey(props.src);
         if (
           (styleProps = hoistableRoot.querySelector(
-            "script[async]" + instance$235
+            "script[async]" + instance$239
           ))
         )
           return (
@@ -15609,7 +15643,7 @@ function acquireResource(hoistableRoot, resource, props) {
             styleProps
           );
         key = props;
-        if ((styleProps = preloadPropsMap.get(instance$235)))
+        if ((styleProps = preloadPropsMap.get(instance$239)))
           (key = assign({}, props)),
             adoptPreloadPropsForScript(key, styleProps);
         hoistableRoot = hoistableRoot.ownerDocument || hoistableRoot;
@@ -16030,10 +16064,10 @@ Internals.Events = [
   restoreStateIfNeeded,
   batchedUpdates$1
 ];
-var devToolsConfig$jscomp$inline_1831 = {
+var devToolsConfig$jscomp$inline_1833 = {
   findFiberByHostInstance: getClosestInstanceFromNode,
   bundleType: 0,
-  version: "18.3.0-www-modern-cfc72a8d",
+  version: "18.3.0-www-modern-e393cc91",
   rendererPackageName: "react-dom"
 };
 (function (internals) {
@@ -16051,10 +16085,10 @@ var devToolsConfig$jscomp$inline_1831 = {
   } catch (err) {}
   return hook.checkDCE ? !0 : !1;
 })({
-  bundleType: devToolsConfig$jscomp$inline_1831.bundleType,
-  version: devToolsConfig$jscomp$inline_1831.version,
-  rendererPackageName: devToolsConfig$jscomp$inline_1831.rendererPackageName,
-  rendererConfig: devToolsConfig$jscomp$inline_1831.rendererConfig,
+  bundleType: devToolsConfig$jscomp$inline_1833.bundleType,
+  version: devToolsConfig$jscomp$inline_1833.version,
+  rendererPackageName: devToolsConfig$jscomp$inline_1833.rendererPackageName,
+  rendererConfig: devToolsConfig$jscomp$inline_1833.rendererConfig,
   overrideHookState: null,
   overrideHookStateDeletePath: null,
   overrideHookStateRenamePath: null,
@@ -16071,14 +16105,14 @@ var devToolsConfig$jscomp$inline_1831 = {
     return null === fiber ? null : fiber.stateNode;
   },
   findFiberByHostInstance:
-    devToolsConfig$jscomp$inline_1831.findFiberByHostInstance ||
+    devToolsConfig$jscomp$inline_1833.findFiberByHostInstance ||
     emptyFindFiberByHostInstance,
   findHostInstancesForRefresh: null,
   scheduleRefresh: null,
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-www-modern-cfc72a8d"
+  reconcilerVersion: "18.3.0-www-modern-e393cc91"
 });
 exports.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = Internals;
 exports.createPortal = function (children, container) {
@@ -16234,7 +16268,7 @@ exports.unstable_createEventHandle = function (type, options) {
   return eventHandle;
 };
 exports.unstable_runWithPriority = runWithPriority;
-exports.version = "18.3.0-www-modern-cfc72a8d";
+exports.version = "18.3.0-www-modern-e393cc91";
 
           /* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */
 if (
diff --git a/compiled/facebook-www/ReactDOMTesting-dev.classic.js b/compiled/facebook-www/ReactDOMTesting-dev.classic.js
index fa7d812095d43..3a415c511f64c 100644
--- a/compiled/facebook-www/ReactDOMTesting-dev.classic.js
+++ b/compiled/facebook-www/ReactDOMTesting-dev.classic.js
@@ -12245,6 +12245,10 @@ var SuspenseException = new Error(
     "unexpected behavior.\n\n" +
     "To handle async errors, wrap your component in an error boundary, or " +
     "call the promise's `.catch` method and pass the result to `use`"
+);
+var SuspenseyCommitException = new Error(
+  "Suspense Exception: This is not a real error, and should not leak into " +
+    "userspace. If you're seeing this, it's likely a bug in React."
 ); // This is a noop thenable that we use to trigger a fallback in throwException.
 // TODO: It would be better to refactor throwException into multiple functions
 // so we can trigger a fallback directly without having to check the type. But
@@ -24858,7 +24862,6 @@ function updateHostComponent(
     // Even better would be if children weren't special cased at all tho.
 
     var instance = workInProgress.stateNode;
-    suspendHostCommitIfNeeded(workInProgress);
     var currentHostContext = getHostContext(); // TODO: Experiencing an error where oldProps is null. Suggests a host
     // component is hitting the resume path. Figure out why. Possibly
     // related to `hidden`.
@@ -24883,12 +24886,17 @@ function updateHostComponent(
 // that suspend don't have children, so it doesn't matter. But that might not
 // always be true in the future.
 
-function suspendHostCommitIfNeeded(workInProgress, type, props, renderLanes) {
+function preloadInstanceAndSuspendIfNeeded(
+  workInProgress,
+  type,
+  props,
+  renderLanes
+) {
   // Ask the renderer if this instance should suspend the commit.
   {
     // If this flag was set previously, we can remove it. The flag represents
     // whether this particular set of props might ever need to suspend. The
-    // safest thing to do is for shouldSuspendCommit to always return true, but
+    // safest thing to do is for maySuspendCommit to always return true, but
     // if the renderer is reasonably confident that the underlying resource
     // won't be evicted, it can return false as a performance optimization.
     workInProgress.flags &= ~SuspenseyCommit;
@@ -25369,7 +25377,12 @@ function completeWork(current, workInProgress, renderLanes) {
           );
         }
 
-        bubbleProperties(workInProgress);
+        bubbleProperties(workInProgress); // This must come at the very end of the complete phase, because it might
+        // throw to suspend, and if the resource immediately loads, the work loop
+        // will resume rendering as if the work-in-progress completed. So it must
+        // fully complete.
+
+        preloadInstanceAndSuspendIfNeeded(workInProgress);
         return null;
       }
     }
@@ -25497,15 +25510,18 @@ function completeWork(current, workInProgress, renderLanes) {
           }
         }
 
-        suspendHostCommitIfNeeded(workInProgress);
-
         if (workInProgress.ref !== null) {
           // If there is a ref on a host node we need to schedule a callback
           markRef(workInProgress);
         }
       }
 
-      bubbleProperties(workInProgress);
+      bubbleProperties(workInProgress); // This must come at the very end of the complete phase, because it might
+      // throw to suspend, and if the resource immediately loads, the work loop
+      // will resume rendering as if the work-in-progress completed. So it must
+      // fully complete.
+
+      preloadInstanceAndSuspendIfNeeded(workInProgress);
       return null;
     }
 
@@ -31351,9 +31367,11 @@ var NotSuspended = 0;
 var SuspendedOnError = 1;
 var SuspendedOnData = 2;
 var SuspendedOnImmediate = 3;
-var SuspendedOnDeprecatedThrowPromise = 4;
-var SuspendedAndReadyToContinue = 5;
-var SuspendedOnHydration = 6; // When this is true, the work-in-progress fiber just suspended (or errored) and
+var SuspendedOnInstance = 4;
+var SuspendedOnInstanceAndReadyToContinue = 5;
+var SuspendedOnDeprecatedThrowPromise = 6;
+var SuspendedAndReadyToContinue = 7;
+var SuspendedOnHydration = 8; // When this is true, the work-in-progress fiber just suspended (or errored) and
 // we've yet to unwind the stack. In some cases, we may yield to the main thread
 // after this happens. If the fiber is pinged before we resume, we can retry
 // immediately instead of unwinding the stack.
@@ -32780,6 +32798,9 @@ function handleThrow(root, thrownValue) {
         : // immediately resolved (i.e. in a microtask). Otherwise, trigger the
           // nearest Suspense fallback.
           SuspendedOnImmediate;
+  } else if (thrownValue === SuspenseyCommitException) {
+    thrownValue = getSuspendedThenable();
+    workInProgressSuspendedReason = SuspendedOnInstance;
   } else if (thrownValue === SelectiveHydrationException) {
     // An update flowed into a dehydrated boundary. Before we can apply the
     // update, we need to finish hydrating. Interrupt the work-in-progress
@@ -33152,7 +33173,7 @@ function renderRootConcurrent(root, lanes) {
         var unitOfWork = workInProgress;
         var thrownValue = workInProgressThrownValue;
 
-        switch (workInProgressSuspendedReason) {
+        resumeOrUnwind: switch (workInProgressSuspendedReason) {
           case SuspendedOnError: {
             // Unwind then continue with the normal work loop.
             workInProgressSuspendedReason = NotSuspended;
@@ -33204,6 +33225,12 @@ function renderRootConcurrent(root, lanes) {
             break outer;
           }
 
+          case SuspendedOnInstance: {
+            workInProgressSuspendedReason =
+              SuspendedOnInstanceAndReadyToContinue;
+            break outer;
+          }
+
           case SuspendedAndReadyToContinue: {
             var _thenable = thrownValue;
 
@@ -33222,6 +33249,69 @@ function renderRootConcurrent(root, lanes) {
             break;
           }
 
+          case SuspendedOnInstanceAndReadyToContinue: {
+            switch (workInProgress.tag) {
+              case HostComponent:
+              case HostHoistable:
+              case HostSingleton: {
+                // Before unwinding the stack, check one more time if the
+                // instance is ready. It may have loaded when React yielded to
+                // the main thread.
+                // Assigning this to a constant so Flow knows the binding won't
+                // be mutated by `preloadInstance`.
+                var hostFiber = workInProgress;
+                var type = hostFiber.type;
+                var props = hostFiber.pendingProps;
+                var isReady = preloadInstance(type, props);
+
+                if (isReady) {
+                  // The data resolved. Resume the work loop as if nothing
+                  // suspended. Unlike when a user component suspends, we don't
+                  // have to replay anything because the host fiber
+                  // already completed.
+                  workInProgressSuspendedReason = NotSuspended;
+                  workInProgressThrownValue = null;
+                  var sibling = hostFiber.sibling;
+
+                  if (sibling !== null) {
+                    workInProgress = sibling;
+                  } else {
+                    var returnFiber = hostFiber.return;
+
+                    if (returnFiber !== null) {
+                      workInProgress = returnFiber;
+                      completeUnitOfWork(returnFiber);
+                    } else {
+                      workInProgress = null;
+                    }
+                  }
+
+                  break resumeOrUnwind;
+                }
+
+                break;
+              }
+
+              default: {
+                // This will fail gracefully but it's not correct, so log a
+                // warning in dev.
+                if (true) {
+                  error(
+                    "Unexpected type of fiber triggered a suspensey commit. " +
+                      "This is a bug in React."
+                  );
+                }
+
+                break;
+              }
+            } // Otherwise, unwind then continue with the normal work loop.
+
+            workInProgressSuspendedReason = NotSuspended;
+            workInProgressThrownValue = null;
+            unwindSuspendedUnitOfWork(unitOfWork, thrownValue);
+            break;
+          }
+
           case SuspendedOnDeprecatedThrowPromise: {
             // Suspended by an old implementation that uses the `throw promise`
             // pattern. The newer replaying behavior can cause subtle issues
@@ -36202,7 +36292,7 @@ function createFiberRoot(
   return root;
 }
 
-var ReactVersion = "18.3.0-www-classic-5d2fcef7";
+var ReactVersion = "18.3.0-www-classic-c0090de0";
 
 function createPortal$1(
   children,
@@ -40307,6 +40397,10 @@ function requestPostPaintCallback(callback) {
     });
   });
 }
+function preloadInstance(type, props) {
+  // Return true to indicate it's already loaded
+  return true;
+}
 function waitForCommitToBeReady() {
   return null;
 } // -------------------
diff --git a/compiled/facebook-www/ReactDOMTesting-dev.modern.js b/compiled/facebook-www/ReactDOMTesting-dev.modern.js
index 9c525bf29485b..398bfa7c68d51 100644
--- a/compiled/facebook-www/ReactDOMTesting-dev.modern.js
+++ b/compiled/facebook-www/ReactDOMTesting-dev.modern.js
@@ -10042,6 +10042,10 @@ var SuspenseException = new Error(
     "unexpected behavior.\n\n" +
     "To handle async errors, wrap your component in an error boundary, or " +
     "call the promise's `.catch` method and pass the result to `use`"
+);
+var SuspenseyCommitException = new Error(
+  "Suspense Exception: This is not a real error, and should not leak into " +
+    "userspace. If you're seeing this, it's likely a bug in React."
 ); // This is a noop thenable that we use to trigger a fallback in throwException.
 // TODO: It would be better to refactor throwException into multiple functions
 // so we can trigger a fallback directly without having to check the type. But
@@ -22588,7 +22592,6 @@ function updateHostComponent(
     // Even better would be if children weren't special cased at all tho.
 
     var instance = workInProgress.stateNode;
-    suspendHostCommitIfNeeded(workInProgress);
     var currentHostContext = getHostContext(); // TODO: Experiencing an error where oldProps is null. Suggests a host
     // component is hitting the resume path. Figure out why. Possibly
     // related to `hidden`.
@@ -22613,12 +22616,17 @@ function updateHostComponent(
 // that suspend don't have children, so it doesn't matter. But that might not
 // always be true in the future.
 
-function suspendHostCommitIfNeeded(workInProgress, type, props, renderLanes) {
+function preloadInstanceAndSuspendIfNeeded(
+  workInProgress,
+  type,
+  props,
+  renderLanes
+) {
   // Ask the renderer if this instance should suspend the commit.
   {
     // If this flag was set previously, we can remove it. The flag represents
     // whether this particular set of props might ever need to suspend. The
-    // safest thing to do is for shouldSuspendCommit to always return true, but
+    // safest thing to do is for maySuspendCommit to always return true, but
     // if the renderer is reasonably confident that the underlying resource
     // won't be evicted, it can return false as a performance optimization.
     workInProgress.flags &= ~SuspenseyCommit;
@@ -23092,7 +23100,12 @@ function completeWork(current, workInProgress, renderLanes) {
           );
         }
 
-        bubbleProperties(workInProgress);
+        bubbleProperties(workInProgress); // This must come at the very end of the complete phase, because it might
+        // throw to suspend, and if the resource immediately loads, the work loop
+        // will resume rendering as if the work-in-progress completed. So it must
+        // fully complete.
+
+        preloadInstanceAndSuspendIfNeeded(workInProgress);
         return null;
       }
     }
@@ -23220,15 +23233,18 @@ function completeWork(current, workInProgress, renderLanes) {
           }
         }
 
-        suspendHostCommitIfNeeded(workInProgress);
-
         if (workInProgress.ref !== null) {
           // If there is a ref on a host node we need to schedule a callback
           markRef(workInProgress);
         }
       }
 
-      bubbleProperties(workInProgress);
+      bubbleProperties(workInProgress); // This must come at the very end of the complete phase, because it might
+      // throw to suspend, and if the resource immediately loads, the work loop
+      // will resume rendering as if the work-in-progress completed. So it must
+      // fully complete.
+
+      preloadInstanceAndSuspendIfNeeded(workInProgress);
       return null;
     }
 
@@ -29052,9 +29068,11 @@ var NotSuspended = 0;
 var SuspendedOnError = 1;
 var SuspendedOnData = 2;
 var SuspendedOnImmediate = 3;
-var SuspendedOnDeprecatedThrowPromise = 4;
-var SuspendedAndReadyToContinue = 5;
-var SuspendedOnHydration = 6; // When this is true, the work-in-progress fiber just suspended (or errored) and
+var SuspendedOnInstance = 4;
+var SuspendedOnInstanceAndReadyToContinue = 5;
+var SuspendedOnDeprecatedThrowPromise = 6;
+var SuspendedAndReadyToContinue = 7;
+var SuspendedOnHydration = 8; // When this is true, the work-in-progress fiber just suspended (or errored) and
 // we've yet to unwind the stack. In some cases, we may yield to the main thread
 // after this happens. If the fiber is pinged before we resume, we can retry
 // immediately instead of unwinding the stack.
@@ -30481,6 +30499,9 @@ function handleThrow(root, thrownValue) {
         : // immediately resolved (i.e. in a microtask). Otherwise, trigger the
           // nearest Suspense fallback.
           SuspendedOnImmediate;
+  } else if (thrownValue === SuspenseyCommitException) {
+    thrownValue = getSuspendedThenable();
+    workInProgressSuspendedReason = SuspendedOnInstance;
   } else if (thrownValue === SelectiveHydrationException) {
     // An update flowed into a dehydrated boundary. Before we can apply the
     // update, we need to finish hydrating. Interrupt the work-in-progress
@@ -30853,7 +30874,7 @@ function renderRootConcurrent(root, lanes) {
         var unitOfWork = workInProgress;
         var thrownValue = workInProgressThrownValue;
 
-        switch (workInProgressSuspendedReason) {
+        resumeOrUnwind: switch (workInProgressSuspendedReason) {
           case SuspendedOnError: {
             // Unwind then continue with the normal work loop.
             workInProgressSuspendedReason = NotSuspended;
@@ -30905,6 +30926,12 @@ function renderRootConcurrent(root, lanes) {
             break outer;
           }
 
+          case SuspendedOnInstance: {
+            workInProgressSuspendedReason =
+              SuspendedOnInstanceAndReadyToContinue;
+            break outer;
+          }
+
           case SuspendedAndReadyToContinue: {
             var _thenable = thrownValue;
 
@@ -30923,6 +30950,69 @@ function renderRootConcurrent(root, lanes) {
             break;
           }
 
+          case SuspendedOnInstanceAndReadyToContinue: {
+            switch (workInProgress.tag) {
+              case HostComponent:
+              case HostHoistable:
+              case HostSingleton: {
+                // Before unwinding the stack, check one more time if the
+                // instance is ready. It may have loaded when React yielded to
+                // the main thread.
+                // Assigning this to a constant so Flow knows the binding won't
+                // be mutated by `preloadInstance`.
+                var hostFiber = workInProgress;
+                var type = hostFiber.type;
+                var props = hostFiber.pendingProps;
+                var isReady = preloadInstance(type, props);
+
+                if (isReady) {
+                  // The data resolved. Resume the work loop as if nothing
+                  // suspended. Unlike when a user component suspends, we don't
+                  // have to replay anything because the host fiber
+                  // already completed.
+                  workInProgressSuspendedReason = NotSuspended;
+                  workInProgressThrownValue = null;
+                  var sibling = hostFiber.sibling;
+
+                  if (sibling !== null) {
+                    workInProgress = sibling;
+                  } else {
+                    var returnFiber = hostFiber.return;
+
+                    if (returnFiber !== null) {
+                      workInProgress = returnFiber;
+                      completeUnitOfWork(returnFiber);
+                    } else {
+                      workInProgress = null;
+                    }
+                  }
+
+                  break resumeOrUnwind;
+                }
+
+                break;
+              }
+
+              default: {
+                // This will fail gracefully but it's not correct, so log a
+                // warning in dev.
+                if (true) {
+                  error(
+                    "Unexpected type of fiber triggered a suspensey commit. " +
+                      "This is a bug in React."
+                  );
+                }
+
+                break;
+              }
+            } // Otherwise, unwind then continue with the normal work loop.
+
+            workInProgressSuspendedReason = NotSuspended;
+            workInProgressThrownValue = null;
+            unwindSuspendedUnitOfWork(unitOfWork, thrownValue);
+            break;
+          }
+
           case SuspendedOnDeprecatedThrowPromise: {
             // Suspended by an old implementation that uses the `throw promise`
             // pattern. The newer replaying behavior can cause subtle issues
@@ -33903,7 +33993,7 @@ function createFiberRoot(
   return root;
 }
 
-var ReactVersion = "18.3.0-www-modern-afcf4d74";
+var ReactVersion = "18.3.0-www-modern-9f593914";
 
 function createPortal$1(
   children,
@@ -43282,6 +43372,10 @@ function requestPostPaintCallback(callback) {
     });
   });
 }
+function preloadInstance(type, props) {
+  // Return true to indicate it's already loaded
+  return true;
+}
 function waitForCommitToBeReady() {
   return null;
 } // -------------------
diff --git a/compiled/facebook-www/ReactDOMTesting-prod.classic.js b/compiled/facebook-www/ReactDOMTesting-prod.classic.js
index f9daae8f35f83..7b2c7da7e46ea 100644
--- a/compiled/facebook-www/ReactDOMTesting-prod.classic.js
+++ b/compiled/facebook-www/ReactDOMTesting-prod.classic.js
@@ -2886,6 +2886,7 @@ function shallowEqual(objA, objB) {
   return !0;
 }
 var SuspenseException = Error(formatProdErrorMessage(460)),
+  SuspenseyCommitException = Error(formatProdErrorMessage(474)),
   noopSuspenseyCommitThenable = { then: function () {} };
 function isThenableResolved(thenable) {
   thenable = thenable.status;
@@ -2933,8 +2934,14 @@ function trackUsedThenable(thenableState, thenable, index) {
       throw SuspenseException;
   }
 }
-var suspendedThenable = null,
-  thenableState$1 = null,
+var suspendedThenable = null;
+function getSuspendedThenable() {
+  if (null === suspendedThenable) throw Error(formatProdErrorMessage(459));
+  var thenable = suspendedThenable;
+  suspendedThenable = null;
+  return thenable;
+}
+var thenableState$1 = null,
   thenableIndexCounter$1 = 0;
 function unwrapThenable(thenable) {
   var index = thenableIndexCounter$1;
@@ -6923,7 +6930,6 @@ function updateHostComponent(current, workInProgress, type, newProps) {
   var oldProps = current.memoizedProps;
   if (oldProps !== newProps) {
     current = workInProgress.stateNode;
-    workInProgress.flags &= -16777217;
     var updatePayload = null;
     switch (type) {
       case "input":
@@ -7165,6 +7171,7 @@ function completeWork(current, workInProgress, renderLanes) {
               workInProgress.pendingProps
             ),
         bubbleProperties(workInProgress),
+        (workInProgress.flags &= -16777217),
         null
       );
     case 27:
@@ -7286,10 +7293,10 @@ function completeWork(current, workInProgress, renderLanes) {
           }
           current && markUpdate(workInProgress);
         }
-        workInProgress.flags &= -16777217;
         null !== workInProgress.ref && markRef(workInProgress);
       }
       bubbleProperties(workInProgress);
+      workInProgress.flags &= -16777217;
       return null;
     case 6:
       if (current && null != workInProgress.stateNode)
@@ -10815,34 +10822,35 @@ function prepareFreshStack(root, lanes) {
 function handleThrow(root, thrownValue) {
   ReactCurrentDispatcher$1.current = ContextOnlyDispatcher;
   ReactCurrentOwner.current = null;
-  if (thrownValue === SuspenseException) {
-    if (null === suspendedThenable) throw Error(formatProdErrorMessage(459));
-    thrownValue = suspendedThenable;
-    suspendedThenable = null;
-    (workInProgressRootRenderLanes & 8388480) === workInProgressRootRenderLanes
-      ? (root = null === shellBoundary ? !0 : !1)
-      : ((root = suspenseHandlerStackCursor.current),
-        (root =
-          null !== root &&
-          (workInProgressRootRenderLanes & 125829120) ===
-            workInProgressRootRenderLanes
-            ? root === shellBoundary
-            : !1));
-    workInProgressSuspendedReason =
-      root &&
-      0 === (workInProgressRootSkippedLanes & 268435455) &&
-      0 === (workInProgressRootInterleavedUpdatedLanes & 268435455)
-        ? 2
-        : 3;
-  } else
-    workInProgressSuspendedReason =
-      thrownValue === SelectiveHydrationException
-        ? 6
-        : null !== thrownValue &&
-          "object" === typeof thrownValue &&
-          "function" === typeof thrownValue.then
-        ? 4
-        : 1;
+  thrownValue === SuspenseException
+    ? ((thrownValue = getSuspendedThenable()),
+      (workInProgressRootRenderLanes & 8388480) ===
+      workInProgressRootRenderLanes
+        ? (root = null === shellBoundary ? !0 : !1)
+        : ((root = suspenseHandlerStackCursor.current),
+          (root =
+            null !== root &&
+            (workInProgressRootRenderLanes & 125829120) ===
+              workInProgressRootRenderLanes
+              ? root === shellBoundary
+              : !1)),
+      (workInProgressSuspendedReason =
+        root &&
+        0 === (workInProgressRootSkippedLanes & 268435455) &&
+        0 === (workInProgressRootInterleavedUpdatedLanes & 268435455)
+          ? 2
+          : 3))
+    : thrownValue === SuspenseyCommitException
+    ? ((thrownValue = getSuspendedThenable()),
+      (workInProgressSuspendedReason = 4))
+    : (workInProgressSuspendedReason =
+        thrownValue === SelectiveHydrationException
+          ? 8
+          : null !== thrownValue &&
+            "object" === typeof thrownValue &&
+            "function" === typeof thrownValue.then
+          ? 6
+          : 1);
   workInProgressThrownValue = thrownValue;
   null === workInProgress &&
     ((workInProgressRootExitStatus = 1),
@@ -10883,7 +10891,7 @@ function renderRootSync(root, lanes) {
         lanes = workInProgress;
         var thrownValue = workInProgressThrownValue;
         switch (workInProgressSuspendedReason) {
-          case 6:
+          case 8:
             resetWorkInProgressStack();
             workInProgressRootExitStatus = 6;
             break a;
@@ -10928,7 +10936,7 @@ function renderRootConcurrent(root, lanes) {
       if (0 !== workInProgressSuspendedReason && null !== workInProgress) {
         lanes = workInProgress;
         var thrownValue = workInProgressThrownValue;
-        switch (workInProgressSuspendedReason) {
+        b: switch (workInProgressSuspendedReason) {
           case 1:
             workInProgressSuspendedReason = 0;
             workInProgressThrownValue = null;
@@ -10944,15 +10952,18 @@ function renderRootConcurrent(root, lanes) {
             lanes = function () {
               2 === workInProgressSuspendedReason &&
                 workInProgressRoot === root &&
-                (workInProgressSuspendedReason = 5);
+                (workInProgressSuspendedReason = 7);
               ensureRootIsScheduled(root, now());
             };
             thrownValue.then(lanes, lanes);
             break a;
           case 3:
+            workInProgressSuspendedReason = 7;
+            break a;
+          case 4:
             workInProgressSuspendedReason = 5;
             break a;
-          case 5:
+          case 7:
             isThenableResolved(thrownValue)
               ? ((workInProgressSuspendedReason = 0),
                 (workInProgressThrownValue = null),
@@ -10961,12 +10972,35 @@ function renderRootConcurrent(root, lanes) {
                 (workInProgressThrownValue = null),
                 unwindSuspendedUnitOfWork(lanes, thrownValue));
             break;
-          case 4:
+          case 5:
+            switch (workInProgress.tag) {
+              case 5:
+              case 26:
+              case 27:
+                lanes = workInProgress;
+                workInProgressSuspendedReason = 0;
+                workInProgressThrownValue = null;
+                var sibling = lanes.sibling;
+                if (null !== sibling) workInProgress = sibling;
+                else {
+                  var returnFiber = lanes.return;
+                  null !== returnFiber
+                    ? ((workInProgress = returnFiber),
+                      completeUnitOfWork(returnFiber))
+                    : (workInProgress = null);
+                }
+                break b;
+            }
             workInProgressSuspendedReason = 0;
             workInProgressThrownValue = null;
             unwindSuspendedUnitOfWork(lanes, thrownValue);
             break;
           case 6:
+            workInProgressSuspendedReason = 0;
+            workInProgressThrownValue = null;
+            unwindSuspendedUnitOfWork(lanes, thrownValue);
+            break;
+          case 8:
             resetWorkInProgressStack();
             workInProgressRootExitStatus = 6;
             break a;
@@ -13019,17 +13053,17 @@ Internals.Events = [
   restoreStateIfNeeded,
   batchedUpdates$1
 ];
-var devToolsConfig$jscomp$inline_1644 = {
+var devToolsConfig$jscomp$inline_1646 = {
   findFiberByHostInstance: getClosestInstanceFromNode,
   bundleType: 0,
-  version: "18.3.0-www-classic-5da08f8d",
+  version: "18.3.0-www-classic-ca4ffb9c",
   rendererPackageName: "react-dom"
 };
-var internals$jscomp$inline_2203 = {
-  bundleType: devToolsConfig$jscomp$inline_1644.bundleType,
-  version: devToolsConfig$jscomp$inline_1644.version,
-  rendererPackageName: devToolsConfig$jscomp$inline_1644.rendererPackageName,
-  rendererConfig: devToolsConfig$jscomp$inline_1644.rendererConfig,
+var internals$jscomp$inline_2205 = {
+  bundleType: devToolsConfig$jscomp$inline_1646.bundleType,
+  version: devToolsConfig$jscomp$inline_1646.version,
+  rendererPackageName: devToolsConfig$jscomp$inline_1646.rendererPackageName,
+  rendererConfig: devToolsConfig$jscomp$inline_1646.rendererConfig,
   overrideHookState: null,
   overrideHookStateDeletePath: null,
   overrideHookStateRenamePath: null,
@@ -13045,26 +13079,26 @@ var internals$jscomp$inline_2203 = {
     return null === fiber ? null : fiber.stateNode;
   },
   findFiberByHostInstance:
-    devToolsConfig$jscomp$inline_1644.findFiberByHostInstance ||
+    devToolsConfig$jscomp$inline_1646.findFiberByHostInstance ||
     emptyFindFiberByHostInstance,
   findHostInstancesForRefresh: null,
   scheduleRefresh: null,
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-www-classic-5da08f8d"
+  reconcilerVersion: "18.3.0-www-classic-ca4ffb9c"
 };
 if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
-  var hook$jscomp$inline_2204 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
+  var hook$jscomp$inline_2206 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
   if (
-    !hook$jscomp$inline_2204.isDisabled &&
-    hook$jscomp$inline_2204.supportsFiber
+    !hook$jscomp$inline_2206.isDisabled &&
+    hook$jscomp$inline_2206.supportsFiber
   )
     try {
-      (rendererID = hook$jscomp$inline_2204.inject(
-        internals$jscomp$inline_2203
+      (rendererID = hook$jscomp$inline_2206.inject(
+        internals$jscomp$inline_2205
       )),
-        (injectedHook = hook$jscomp$inline_2204);
+        (injectedHook = hook$jscomp$inline_2206);
     } catch (err) {}
 }
 var Dispatcher = Internals.Dispatcher,
@@ -13183,12 +13217,12 @@ function preinit(href, options) {
       switch (as) {
         case "style":
           as = getResourcesFromRoot(resourceRoot).hoistableStyles;
-          var key$191 = getStyleKey(href),
+          var key$194 = getStyleKey(href),
             precedence = options.precedence || "default",
-            resource = as.get(key$191);
+            resource = as.get(key$194);
           if (resource) break;
           resource = resourceRoot.querySelector(
-            getStylesheetSelectorFromKey(key$191)
+            getStylesheetSelectorFromKey(key$194)
           );
           resource ||
             ((href = {
@@ -13197,7 +13231,7 @@ function preinit(href, options) {
               "data-precedence": precedence,
               crossOrigin: options.crossOrigin
             }),
-            (options = preloadPropsMap.get(key$191)) &&
+            (options = preloadPropsMap.get(key$194)) &&
               adoptPreloadPropsForStylesheet(href, options),
             (resource = (
               resourceRoot.ownerDocument || resourceRoot
@@ -13206,15 +13240,15 @@ function preinit(href, options) {
             setInitialProperties(resource, "link", href),
             insertStylesheet(resource, precedence, resourceRoot));
           resource = { type: "stylesheet", instance: resource, count: 1 };
-          as.set(key$191, resource);
+          as.set(key$194, resource);
           break;
         case "script":
           (as = getResourcesFromRoot(resourceRoot).hoistableScripts),
-            (key$191 = getScriptKey(href)),
-            (precedence = as.get(key$191)),
+            (key$194 = getScriptKey(href)),
+            (precedence = as.get(key$194)),
             precedence ||
               ((precedence = resourceRoot.querySelector(
-                "script[async]" + key$191
+                "script[async]" + key$194
               )),
               precedence ||
                 ((href = {
@@ -13223,7 +13257,7 @@ function preinit(href, options) {
                   crossOrigin: options.crossOrigin,
                   integrity: options.integrity
                 }),
-                (options = preloadPropsMap.get(key$191)) &&
+                (options = preloadPropsMap.get(key$194)) &&
                   adoptPreloadPropsForScript(href, options),
                 (options = resourceRoot.ownerDocument || resourceRoot),
                 (precedence = options.createElement("script")),
@@ -13231,13 +13265,13 @@ function preinit(href, options) {
                 setInitialProperties(precedence, "link", href),
                 options.head.appendChild(precedence)),
               (precedence = { type: "script", instance: precedence, count: 1 }),
-              as.set(key$191, precedence));
+              as.set(key$194, precedence));
       }
     else if ("style" === as || "script" === as)
       if ((resourceRoot = getDocumentForPreloads())) {
-        key$191 = escapeSelectorAttributeValueInsideDoubleQuotes(href);
-        precedence = key$191 =
-          'link[rel="preload"][as="' + as + '"][href="' + key$191 + '"]';
+        key$194 = escapeSelectorAttributeValueInsideDoubleQuotes(href);
+        precedence = key$194 =
+          'link[rel="preload"][as="' + as + '"][href="' + key$194 + '"]';
         switch (as) {
           case "style":
             precedence = getStyleKey(href);
@@ -13254,7 +13288,7 @@ function preinit(href, options) {
             integrity: options.integrity
           }),
           preloadPropsMap.set(precedence, href),
-          null === resourceRoot.querySelector(key$191) &&
+          null === resourceRoot.querySelector(key$194) &&
             ((options = resourceRoot.createElement("link")),
             setInitialProperties(options, "link", href),
             markNodeAsHoistable(options),
@@ -13286,14 +13320,14 @@ function getResource(type, currentProps, pendingProps) {
         "string" === typeof pendingProps.href &&
         "string" === typeof pendingProps.precedence
       ) {
-        var key$198 = getStyleKey(pendingProps.href),
-          styles$199 = getResourcesFromRoot(currentProps).hoistableStyles;
-        type = styles$199.get(key$198);
+        var key$201 = getStyleKey(pendingProps.href),
+          styles$202 = getResourcesFromRoot(currentProps).hoistableStyles;
+        type = styles$202.get(key$201);
         type ||
           ((currentProps = currentProps.ownerDocument || currentProps),
           (type = { type: "stylesheet", instance: null, count: 0 }),
-          styles$199.set(key$198, type),
-          preloadPropsMap.has(key$198) ||
+          styles$202.set(key$201, type),
+          preloadPropsMap.has(key$201) ||
             ((pendingProps = {
               rel: "preload",
               as: "style",
@@ -13304,16 +13338,16 @@ function getResource(type, currentProps, pendingProps) {
               hrefLang: pendingProps.hrefLang,
               referrerPolicy: pendingProps.referrerPolicy
             }),
-            preloadPropsMap.set(key$198, pendingProps),
-            currentProps.querySelector(getStylesheetSelectorFromKey(key$198)) ||
+            preloadPropsMap.set(key$201, pendingProps),
+            currentProps.querySelector(getStylesheetSelectorFromKey(key$201)) ||
               null !==
                 currentProps.querySelector(
-                  'link[rel="preload"][as="style"][' + key$198 + "]"
+                  'link[rel="preload"][as="style"][' + key$201 + "]"
                 ) ||
-              ((key$198 = currentProps.createElement("link")),
-              setInitialProperties(key$198, "link", pendingProps),
-              markNodeAsHoistable(key$198),
-              currentProps.head.appendChild(key$198))));
+              ((key$201 = currentProps.createElement("link")),
+              setInitialProperties(key$201, "link", pendingProps),
+              markNodeAsHoistable(key$201),
+              currentProps.head.appendChild(key$201))));
         return type;
       }
       return null;
@@ -13363,14 +13397,14 @@ function acquireResource(hoistableRoot, resource, props) {
         return (resource.instance = key);
       case "stylesheet":
         styleProps = getStyleKey(props.href);
-        var instance$205 = hoistableRoot.querySelector(
+        var instance$209 = hoistableRoot.querySelector(
           getStylesheetSelectorFromKey(styleProps)
         );
-        if (instance$205)
+        if (instance$209)
           return (
-            (resource.instance = instance$205),
-            markNodeAsHoistable(instance$205),
-            instance$205
+            (resource.instance = instance$209),
+            markNodeAsHoistable(instance$209),
+            instance$209
           );
         key = assign({}, props, {
           "data-precedence": props.precedence,
@@ -13378,11 +13412,11 @@ function acquireResource(hoistableRoot, resource, props) {
         });
         (styleProps = preloadPropsMap.get(styleProps)) &&
           adoptPreloadPropsForStylesheet(key, styleProps);
-        instance$205 = (
+        instance$209 = (
           hoistableRoot.ownerDocument || hoistableRoot
         ).createElement("link");
-        markNodeAsHoistable(instance$205);
-        var linkInstance = instance$205;
+        markNodeAsHoistable(instance$209);
+        var linkInstance = instance$209;
         linkInstance._p = new Promise(function (resolve, reject) {
           linkInstance.onload = resolve;
           linkInstance.onerror = reject;
@@ -13394,14 +13428,14 @@ function acquireResource(hoistableRoot, resource, props) {
             return (linkInstance._p.s = "e");
           }
         );
-        setInitialProperties(instance$205, "link", key);
-        insertStylesheet(instance$205, props.precedence, hoistableRoot);
-        return (resource.instance = instance$205);
+        setInitialProperties(instance$209, "link", key);
+        insertStylesheet(instance$209, props.precedence, hoistableRoot);
+        return (resource.instance = instance$209);
       case "script":
-        instance$205 = getScriptKey(props.src);
+        instance$209 = getScriptKey(props.src);
         if (
           (styleProps = hoistableRoot.querySelector(
-            "script[async]" + instance$205
+            "script[async]" + instance$209
           ))
         )
           return (
@@ -13410,7 +13444,7 @@ function acquireResource(hoistableRoot, resource, props) {
             styleProps
           );
         key = props;
-        if ((styleProps = preloadPropsMap.get(instance$205)))
+        if ((styleProps = preloadPropsMap.get(instance$209)))
           (key = assign({}, props)),
             adoptPreloadPropsForScript(key, styleProps);
         hoistableRoot = hoistableRoot.ownerDocument || hoistableRoot;
@@ -14444,19 +14478,19 @@ function getTargetInstForChangeEvent(domEventName, targetInst) {
 }
 var isInputEventSupported = !1;
 if (canUseDOM) {
-  var JSCompiler_inline_result$jscomp$324;
+  var JSCompiler_inline_result$jscomp$328;
   if (canUseDOM) {
-    var isSupported$jscomp$inline_1721 = "oninput" in document;
-    if (!isSupported$jscomp$inline_1721) {
-      var element$jscomp$inline_1722 = document.createElement("div");
-      element$jscomp$inline_1722.setAttribute("oninput", "return;");
-      isSupported$jscomp$inline_1721 =
-        "function" === typeof element$jscomp$inline_1722.oninput;
+    var isSupported$jscomp$inline_1723 = "oninput" in document;
+    if (!isSupported$jscomp$inline_1723) {
+      var element$jscomp$inline_1724 = document.createElement("div");
+      element$jscomp$inline_1724.setAttribute("oninput", "return;");
+      isSupported$jscomp$inline_1723 =
+        "function" === typeof element$jscomp$inline_1724.oninput;
     }
-    JSCompiler_inline_result$jscomp$324 = isSupported$jscomp$inline_1721;
-  } else JSCompiler_inline_result$jscomp$324 = !1;
+    JSCompiler_inline_result$jscomp$328 = isSupported$jscomp$inline_1723;
+  } else JSCompiler_inline_result$jscomp$328 = !1;
   isInputEventSupported =
-    JSCompiler_inline_result$jscomp$324 &&
+    JSCompiler_inline_result$jscomp$328 &&
     (!document.documentMode || 9 < document.documentMode);
 }
 function stopWatchingForValueChange() {
@@ -14594,20 +14628,20 @@ function registerSimpleEvent(domEventName, reactName) {
   registerTwoPhaseEvent(reactName, [domEventName]);
 }
 for (
-  var i$jscomp$inline_1734 = 0;
-  i$jscomp$inline_1734 < simpleEventPluginEvents.length;
-  i$jscomp$inline_1734++
+  var i$jscomp$inline_1736 = 0;
+  i$jscomp$inline_1736 < simpleEventPluginEvents.length;
+  i$jscomp$inline_1736++
 ) {
-  var eventName$jscomp$inline_1735 =
-      simpleEventPluginEvents[i$jscomp$inline_1734],
-    domEventName$jscomp$inline_1736 =
-      eventName$jscomp$inline_1735.toLowerCase(),
-    capitalizedEvent$jscomp$inline_1737 =
-      eventName$jscomp$inline_1735[0].toUpperCase() +
-      eventName$jscomp$inline_1735.slice(1);
+  var eventName$jscomp$inline_1737 =
+      simpleEventPluginEvents[i$jscomp$inline_1736],
+    domEventName$jscomp$inline_1738 =
+      eventName$jscomp$inline_1737.toLowerCase(),
+    capitalizedEvent$jscomp$inline_1739 =
+      eventName$jscomp$inline_1737[0].toUpperCase() +
+      eventName$jscomp$inline_1737.slice(1);
   registerSimpleEvent(
-    domEventName$jscomp$inline_1736,
-    "on" + capitalizedEvent$jscomp$inline_1737
+    domEventName$jscomp$inline_1738,
+    "on" + capitalizedEvent$jscomp$inline_1739
   );
 }
 registerSimpleEvent(ANIMATION_END, "onAnimationEnd");
@@ -16484,4 +16518,4 @@ exports.unstable_renderSubtreeIntoContainer = function (
   );
 };
 exports.unstable_runWithPriority = runWithPriority;
-exports.version = "18.3.0-www-classic-5da08f8d";
+exports.version = "18.3.0-www-classic-ca4ffb9c";
diff --git a/compiled/facebook-www/ReactDOMTesting-prod.modern.js b/compiled/facebook-www/ReactDOMTesting-prod.modern.js
index 1c77b43ca7e4f..9d62cd8e07765 100644
--- a/compiled/facebook-www/ReactDOMTesting-prod.modern.js
+++ b/compiled/facebook-www/ReactDOMTesting-prod.modern.js
@@ -2522,6 +2522,7 @@ function shallowEqual(objA, objB) {
   return !0;
 }
 var SuspenseException = Error(formatProdErrorMessage(460)),
+  SuspenseyCommitException = Error(formatProdErrorMessage(474)),
   noopSuspenseyCommitThenable = { then: function () {} };
 function isThenableResolved(thenable) {
   thenable = thenable.status;
@@ -2569,8 +2570,14 @@ function trackUsedThenable(thenableState, thenable, index) {
       throw SuspenseException;
   }
 }
-var suspendedThenable = null,
-  thenableState$1 = null,
+var suspendedThenable = null;
+function getSuspendedThenable() {
+  if (null === suspendedThenable) throw Error(formatProdErrorMessage(459));
+  var thenable = suspendedThenable;
+  suspendedThenable = null;
+  return thenable;
+}
+var thenableState$1 = null,
   thenableIndexCounter$1 = 0;
 function unwrapThenable(thenable) {
   var index = thenableIndexCounter$1;
@@ -6504,7 +6511,6 @@ function updateHostComponent(current, workInProgress, type, newProps) {
   var oldProps = current.memoizedProps;
   if (oldProps !== newProps) {
     current = workInProgress.stateNode;
-    workInProgress.flags &= -16777217;
     var updatePayload = null;
     switch (type) {
       case "input":
@@ -6740,6 +6746,7 @@ function completeWork(current, workInProgress, renderLanes) {
               workInProgress.pendingProps
             ),
         bubbleProperties(workInProgress),
+        (workInProgress.flags &= -16777217),
         null
       );
     case 27:
@@ -6861,10 +6868,10 @@ function completeWork(current, workInProgress, renderLanes) {
           }
           current && markUpdate(workInProgress);
         }
-        workInProgress.flags &= -16777217;
         null !== workInProgress.ref && markRef(workInProgress);
       }
       bubbleProperties(workInProgress);
+      workInProgress.flags &= -16777217;
       return null;
     case 6:
       if (current && null != workInProgress.stateNode)
@@ -10390,34 +10397,35 @@ function prepareFreshStack(root, lanes) {
 function handleThrow(root, thrownValue) {
   ReactCurrentDispatcher$1.current = ContextOnlyDispatcher;
   ReactCurrentOwner.current = null;
-  if (thrownValue === SuspenseException) {
-    if (null === suspendedThenable) throw Error(formatProdErrorMessage(459));
-    thrownValue = suspendedThenable;
-    suspendedThenable = null;
-    (workInProgressRootRenderLanes & 8388480) === workInProgressRootRenderLanes
-      ? (root = null === shellBoundary ? !0 : !1)
-      : ((root = suspenseHandlerStackCursor.current),
-        (root =
-          null !== root &&
-          (workInProgressRootRenderLanes & 125829120) ===
-            workInProgressRootRenderLanes
-            ? root === shellBoundary
-            : !1));
-    workInProgressSuspendedReason =
-      root &&
-      0 === (workInProgressRootSkippedLanes & 268435455) &&
-      0 === (workInProgressRootInterleavedUpdatedLanes & 268435455)
-        ? 2
-        : 3;
-  } else
-    workInProgressSuspendedReason =
-      thrownValue === SelectiveHydrationException
-        ? 6
-        : null !== thrownValue &&
-          "object" === typeof thrownValue &&
-          "function" === typeof thrownValue.then
-        ? 4
-        : 1;
+  thrownValue === SuspenseException
+    ? ((thrownValue = getSuspendedThenable()),
+      (workInProgressRootRenderLanes & 8388480) ===
+      workInProgressRootRenderLanes
+        ? (root = null === shellBoundary ? !0 : !1)
+        : ((root = suspenseHandlerStackCursor.current),
+          (root =
+            null !== root &&
+            (workInProgressRootRenderLanes & 125829120) ===
+              workInProgressRootRenderLanes
+              ? root === shellBoundary
+              : !1)),
+      (workInProgressSuspendedReason =
+        root &&
+        0 === (workInProgressRootSkippedLanes & 268435455) &&
+        0 === (workInProgressRootInterleavedUpdatedLanes & 268435455)
+          ? 2
+          : 3))
+    : thrownValue === SuspenseyCommitException
+    ? ((thrownValue = getSuspendedThenable()),
+      (workInProgressSuspendedReason = 4))
+    : (workInProgressSuspendedReason =
+        thrownValue === SelectiveHydrationException
+          ? 8
+          : null !== thrownValue &&
+            "object" === typeof thrownValue &&
+            "function" === typeof thrownValue.then
+          ? 6
+          : 1);
   workInProgressThrownValue = thrownValue;
   null === workInProgress &&
     ((workInProgressRootExitStatus = 1),
@@ -10458,7 +10466,7 @@ function renderRootSync(root, lanes) {
         lanes = workInProgress;
         var thrownValue = workInProgressThrownValue;
         switch (workInProgressSuspendedReason) {
-          case 6:
+          case 8:
             resetWorkInProgressStack();
             workInProgressRootExitStatus = 6;
             break a;
@@ -10503,7 +10511,7 @@ function renderRootConcurrent(root, lanes) {
       if (0 !== workInProgressSuspendedReason && null !== workInProgress) {
         lanes = workInProgress;
         var thrownValue = workInProgressThrownValue;
-        switch (workInProgressSuspendedReason) {
+        b: switch (workInProgressSuspendedReason) {
           case 1:
             workInProgressSuspendedReason = 0;
             workInProgressThrownValue = null;
@@ -10519,15 +10527,18 @@ function renderRootConcurrent(root, lanes) {
             lanes = function () {
               2 === workInProgressSuspendedReason &&
                 workInProgressRoot === root &&
-                (workInProgressSuspendedReason = 5);
+                (workInProgressSuspendedReason = 7);
               ensureRootIsScheduled(root, now());
             };
             thrownValue.then(lanes, lanes);
             break a;
           case 3:
+            workInProgressSuspendedReason = 7;
+            break a;
+          case 4:
             workInProgressSuspendedReason = 5;
             break a;
-          case 5:
+          case 7:
             isThenableResolved(thrownValue)
               ? ((workInProgressSuspendedReason = 0),
                 (workInProgressThrownValue = null),
@@ -10536,12 +10547,35 @@ function renderRootConcurrent(root, lanes) {
                 (workInProgressThrownValue = null),
                 unwindSuspendedUnitOfWork(lanes, thrownValue));
             break;
-          case 4:
+          case 5:
+            switch (workInProgress.tag) {
+              case 5:
+              case 26:
+              case 27:
+                lanes = workInProgress;
+                workInProgressSuspendedReason = 0;
+                workInProgressThrownValue = null;
+                var sibling = lanes.sibling;
+                if (null !== sibling) workInProgress = sibling;
+                else {
+                  var returnFiber = lanes.return;
+                  null !== returnFiber
+                    ? ((workInProgress = returnFiber),
+                      completeUnitOfWork(returnFiber))
+                    : (workInProgress = null);
+                }
+                break b;
+            }
             workInProgressSuspendedReason = 0;
             workInProgressThrownValue = null;
             unwindSuspendedUnitOfWork(lanes, thrownValue);
             break;
           case 6:
+            workInProgressSuspendedReason = 0;
+            workInProgressThrownValue = null;
+            unwindSuspendedUnitOfWork(lanes, thrownValue);
+            break;
+          case 8:
             resetWorkInProgressStack();
             workInProgressRootExitStatus = 6;
             break a;
@@ -13464,19 +13498,19 @@ function getTargetInstForChangeEvent(domEventName, targetInst) {
 }
 var isInputEventSupported = !1;
 if (canUseDOM) {
-  var JSCompiler_inline_result$jscomp$300;
+  var JSCompiler_inline_result$jscomp$304;
   if (canUseDOM) {
-    var isSupported$jscomp$inline_1560 = "oninput" in document;
-    if (!isSupported$jscomp$inline_1560) {
-      var element$jscomp$inline_1561 = document.createElement("div");
-      element$jscomp$inline_1561.setAttribute("oninput", "return;");
-      isSupported$jscomp$inline_1560 =
-        "function" === typeof element$jscomp$inline_1561.oninput;
+    var isSupported$jscomp$inline_1562 = "oninput" in document;
+    if (!isSupported$jscomp$inline_1562) {
+      var element$jscomp$inline_1563 = document.createElement("div");
+      element$jscomp$inline_1563.setAttribute("oninput", "return;");
+      isSupported$jscomp$inline_1562 =
+        "function" === typeof element$jscomp$inline_1563.oninput;
     }
-    JSCompiler_inline_result$jscomp$300 = isSupported$jscomp$inline_1560;
-  } else JSCompiler_inline_result$jscomp$300 = !1;
+    JSCompiler_inline_result$jscomp$304 = isSupported$jscomp$inline_1562;
+  } else JSCompiler_inline_result$jscomp$304 = !1;
   isInputEventSupported =
-    JSCompiler_inline_result$jscomp$300 &&
+    JSCompiler_inline_result$jscomp$304 &&
     (!document.documentMode || 9 < document.documentMode);
 }
 function stopWatchingForValueChange() {
@@ -13785,20 +13819,20 @@ function registerSimpleEvent(domEventName, reactName) {
   registerTwoPhaseEvent(reactName, [domEventName]);
 }
 for (
-  var i$jscomp$inline_1601 = 0;
-  i$jscomp$inline_1601 < simpleEventPluginEvents.length;
-  i$jscomp$inline_1601++
+  var i$jscomp$inline_1603 = 0;
+  i$jscomp$inline_1603 < simpleEventPluginEvents.length;
+  i$jscomp$inline_1603++
 ) {
-  var eventName$jscomp$inline_1602 =
-      simpleEventPluginEvents[i$jscomp$inline_1601],
-    domEventName$jscomp$inline_1603 =
-      eventName$jscomp$inline_1602.toLowerCase(),
-    capitalizedEvent$jscomp$inline_1604 =
-      eventName$jscomp$inline_1602[0].toUpperCase() +
-      eventName$jscomp$inline_1602.slice(1);
+  var eventName$jscomp$inline_1604 =
+      simpleEventPluginEvents[i$jscomp$inline_1603],
+    domEventName$jscomp$inline_1605 =
+      eventName$jscomp$inline_1604.toLowerCase(),
+    capitalizedEvent$jscomp$inline_1606 =
+      eventName$jscomp$inline_1604[0].toUpperCase() +
+      eventName$jscomp$inline_1604.slice(1);
   registerSimpleEvent(
-    domEventName$jscomp$inline_1603,
-    "on" + capitalizedEvent$jscomp$inline_1604
+    domEventName$jscomp$inline_1605,
+    "on" + capitalizedEvent$jscomp$inline_1606
   );
 }
 registerSimpleEvent(ANIMATION_END, "onAnimationEnd");
@@ -14937,12 +14971,12 @@ function preinit$1(href, options) {
       switch (as) {
         case "style":
           as = getResourcesFromRoot(resourceRoot).hoistableStyles;
-          var key$201 = getStyleKey(href),
+          var key$204 = getStyleKey(href),
             precedence = options.precedence || "default",
-            resource = as.get(key$201);
+            resource = as.get(key$204);
           if (resource) break;
           resource = resourceRoot.querySelector(
-            getStylesheetSelectorFromKey(key$201)
+            getStylesheetSelectorFromKey(key$204)
           );
           resource ||
             ((href = {
@@ -14951,7 +14985,7 @@ function preinit$1(href, options) {
               "data-precedence": precedence,
               crossOrigin: options.crossOrigin
             }),
-            (options = preloadPropsMap.get(key$201)) &&
+            (options = preloadPropsMap.get(key$204)) &&
               adoptPreloadPropsForStylesheet(href, options),
             (resource = (
               resourceRoot.ownerDocument || resourceRoot
@@ -14960,15 +14994,15 @@ function preinit$1(href, options) {
             setInitialProperties(resource, "link", href),
             insertStylesheet(resource, precedence, resourceRoot));
           resource = { type: "stylesheet", instance: resource, count: 1 };
-          as.set(key$201, resource);
+          as.set(key$204, resource);
           break;
         case "script":
           (as = getResourcesFromRoot(resourceRoot).hoistableScripts),
-            (key$201 = getScriptKey(href)),
-            (precedence = as.get(key$201)),
+            (key$204 = getScriptKey(href)),
+            (precedence = as.get(key$204)),
             precedence ||
               ((precedence = resourceRoot.querySelector(
-                "script[async]" + key$201
+                "script[async]" + key$204
               )),
               precedence ||
                 ((href = {
@@ -14977,7 +15011,7 @@ function preinit$1(href, options) {
                   crossOrigin: options.crossOrigin,
                   integrity: options.integrity
                 }),
-                (options = preloadPropsMap.get(key$201)) &&
+                (options = preloadPropsMap.get(key$204)) &&
                   adoptPreloadPropsForScript(href, options),
                 (options = resourceRoot.ownerDocument || resourceRoot),
                 (precedence = options.createElement("script")),
@@ -14985,13 +15019,13 @@ function preinit$1(href, options) {
                 setInitialProperties(precedence, "link", href),
                 options.head.appendChild(precedence)),
               (precedence = { type: "script", instance: precedence, count: 1 }),
-              as.set(key$201, precedence));
+              as.set(key$204, precedence));
       }
     else if ("style" === as || "script" === as)
       if ((resourceRoot = getDocumentForPreloads())) {
-        key$201 = escapeSelectorAttributeValueInsideDoubleQuotes(href);
-        precedence = key$201 =
-          'link[rel="preload"][as="' + as + '"][href="' + key$201 + '"]';
+        key$204 = escapeSelectorAttributeValueInsideDoubleQuotes(href);
+        precedence = key$204 =
+          'link[rel="preload"][as="' + as + '"][href="' + key$204 + '"]';
         switch (as) {
           case "style":
             precedence = getStyleKey(href);
@@ -15008,7 +15042,7 @@ function preinit$1(href, options) {
             integrity: options.integrity
           }),
           preloadPropsMap.set(precedence, href),
-          null === resourceRoot.querySelector(key$201) &&
+          null === resourceRoot.querySelector(key$204) &&
             ((options = resourceRoot.createElement("link")),
             setInitialProperties(options, "link", href),
             markNodeAsHoistable(options),
@@ -15040,14 +15074,14 @@ function getResource(type, currentProps, pendingProps) {
         "string" === typeof pendingProps.href &&
         "string" === typeof pendingProps.precedence
       ) {
-        var key$208 = getStyleKey(pendingProps.href),
-          styles$209 = getResourcesFromRoot(currentProps).hoistableStyles;
-        type = styles$209.get(key$208);
+        var key$211 = getStyleKey(pendingProps.href),
+          styles$212 = getResourcesFromRoot(currentProps).hoistableStyles;
+        type = styles$212.get(key$211);
         type ||
           ((currentProps = currentProps.ownerDocument || currentProps),
           (type = { type: "stylesheet", instance: null, count: 0 }),
-          styles$209.set(key$208, type),
-          preloadPropsMap.has(key$208) ||
+          styles$212.set(key$211, type),
+          preloadPropsMap.has(key$211) ||
             ((pendingProps = {
               rel: "preload",
               as: "style",
@@ -15058,16 +15092,16 @@ function getResource(type, currentProps, pendingProps) {
               hrefLang: pendingProps.hrefLang,
               referrerPolicy: pendingProps.referrerPolicy
             }),
-            preloadPropsMap.set(key$208, pendingProps),
-            currentProps.querySelector(getStylesheetSelectorFromKey(key$208)) ||
+            preloadPropsMap.set(key$211, pendingProps),
+            currentProps.querySelector(getStylesheetSelectorFromKey(key$211)) ||
               null !==
                 currentProps.querySelector(
-                  'link[rel="preload"][as="style"][' + key$208 + "]"
+                  'link[rel="preload"][as="style"][' + key$211 + "]"
                 ) ||
-              ((key$208 = currentProps.createElement("link")),
-              setInitialProperties(key$208, "link", pendingProps),
-              markNodeAsHoistable(key$208),
-              currentProps.head.appendChild(key$208))));
+              ((key$211 = currentProps.createElement("link")),
+              setInitialProperties(key$211, "link", pendingProps),
+              markNodeAsHoistable(key$211),
+              currentProps.head.appendChild(key$211))));
         return type;
       }
       return null;
@@ -15117,14 +15151,14 @@ function acquireResource(hoistableRoot, resource, props) {
         return (resource.instance = key);
       case "stylesheet":
         styleProps = getStyleKey(props.href);
-        var instance$215 = hoistableRoot.querySelector(
+        var instance$219 = hoistableRoot.querySelector(
           getStylesheetSelectorFromKey(styleProps)
         );
-        if (instance$215)
+        if (instance$219)
           return (
-            (resource.instance = instance$215),
-            markNodeAsHoistable(instance$215),
-            instance$215
+            (resource.instance = instance$219),
+            markNodeAsHoistable(instance$219),
+            instance$219
           );
         key = assign({}, props, {
           "data-precedence": props.precedence,
@@ -15132,11 +15166,11 @@ function acquireResource(hoistableRoot, resource, props) {
         });
         (styleProps = preloadPropsMap.get(styleProps)) &&
           adoptPreloadPropsForStylesheet(key, styleProps);
-        instance$215 = (
+        instance$219 = (
           hoistableRoot.ownerDocument || hoistableRoot
         ).createElement("link");
-        markNodeAsHoistable(instance$215);
-        var linkInstance = instance$215;
+        markNodeAsHoistable(instance$219);
+        var linkInstance = instance$219;
         linkInstance._p = new Promise(function (resolve, reject) {
           linkInstance.onload = resolve;
           linkInstance.onerror = reject;
@@ -15148,14 +15182,14 @@ function acquireResource(hoistableRoot, resource, props) {
             return (linkInstance._p.s = "e");
           }
         );
-        setInitialProperties(instance$215, "link", key);
-        insertStylesheet(instance$215, props.precedence, hoistableRoot);
-        return (resource.instance = instance$215);
+        setInitialProperties(instance$219, "link", key);
+        insertStylesheet(instance$219, props.precedence, hoistableRoot);
+        return (resource.instance = instance$219);
       case "script":
-        instance$215 = getScriptKey(props.src);
+        instance$219 = getScriptKey(props.src);
         if (
           (styleProps = hoistableRoot.querySelector(
-            "script[async]" + instance$215
+            "script[async]" + instance$219
           ))
         )
           return (
@@ -15164,7 +15198,7 @@ function acquireResource(hoistableRoot, resource, props) {
             styleProps
           );
         key = props;
-        if ((styleProps = preloadPropsMap.get(instance$215)))
+        if ((styleProps = preloadPropsMap.get(instance$219)))
           (key = assign({}, props)),
             adoptPreloadPropsForScript(key, styleProps);
         hoistableRoot = hoistableRoot.ownerDocument || hoistableRoot;
@@ -15642,17 +15676,17 @@ Internals.Events = [
   restoreStateIfNeeded,
   batchedUpdates$1
 ];
-var devToolsConfig$jscomp$inline_1780 = {
+var devToolsConfig$jscomp$inline_1782 = {
   findFiberByHostInstance: getClosestInstanceFromNode,
   bundleType: 0,
-  version: "18.3.0-www-modern-eb67b0a3",
+  version: "18.3.0-www-modern-1ad200fa",
   rendererPackageName: "react-dom"
 };
-var internals$jscomp$inline_2184 = {
-  bundleType: devToolsConfig$jscomp$inline_1780.bundleType,
-  version: devToolsConfig$jscomp$inline_1780.version,
-  rendererPackageName: devToolsConfig$jscomp$inline_1780.rendererPackageName,
-  rendererConfig: devToolsConfig$jscomp$inline_1780.rendererConfig,
+var internals$jscomp$inline_2186 = {
+  bundleType: devToolsConfig$jscomp$inline_1782.bundleType,
+  version: devToolsConfig$jscomp$inline_1782.version,
+  rendererPackageName: devToolsConfig$jscomp$inline_1782.rendererPackageName,
+  rendererConfig: devToolsConfig$jscomp$inline_1782.rendererConfig,
   overrideHookState: null,
   overrideHookStateDeletePath: null,
   overrideHookStateRenamePath: null,
@@ -15669,26 +15703,26 @@ var internals$jscomp$inline_2184 = {
     return null === fiber ? null : fiber.stateNode;
   },
   findFiberByHostInstance:
-    devToolsConfig$jscomp$inline_1780.findFiberByHostInstance ||
+    devToolsConfig$jscomp$inline_1782.findFiberByHostInstance ||
     emptyFindFiberByHostInstance,
   findHostInstancesForRefresh: null,
   scheduleRefresh: null,
   scheduleRoot: null,
   setRefreshHandler: null,
   getCurrentFiber: null,
-  reconcilerVersion: "18.3.0-www-modern-eb67b0a3"
+  reconcilerVersion: "18.3.0-www-modern-1ad200fa"
 };
 if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
-  var hook$jscomp$inline_2185 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
+  var hook$jscomp$inline_2187 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
   if (
-    !hook$jscomp$inline_2185.isDisabled &&
-    hook$jscomp$inline_2185.supportsFiber
+    !hook$jscomp$inline_2187.isDisabled &&
+    hook$jscomp$inline_2187.supportsFiber
   )
     try {
-      (rendererID = hook$jscomp$inline_2185.inject(
-        internals$jscomp$inline_2184
+      (rendererID = hook$jscomp$inline_2187.inject(
+        internals$jscomp$inline_2186
       )),
-        (injectedHook = hook$jscomp$inline_2185);
+        (injectedHook = hook$jscomp$inline_2187);
     } catch (err) {}
 }
 exports.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = Internals;
@@ -15996,4 +16030,4 @@ exports.unstable_createEventHandle = function (type, options) {
   return eventHandle;
 };
 exports.unstable_runWithPriority = runWithPriority;
-exports.version = "18.3.0-www-modern-eb67b0a3";
+exports.version = "18.3.0-www-modern-1ad200fa";
diff --git a/compiled/facebook-www/ReactTestRenderer-dev.classic.js b/compiled/facebook-www/ReactTestRenderer-dev.classic.js
index 3e0307f46cbcf..e45200f130952 100644
--- a/compiled/facebook-www/ReactTestRenderer-dev.classic.js
+++ b/compiled/facebook-www/ReactTestRenderer-dev.classic.js
@@ -2132,6 +2132,10 @@ function prepareScopeUpdate(scopeInstance, inst) {
 function getInstanceFromScope(scopeInstance) {
   return nodeToInstanceMap.get(scopeInstance) || null;
 }
+function preloadInstance(type, props) {
+  // Return true to indicate it's already loaded
+  return true;
+}
 function waitForCommitToBeReady() {
   return null;
 }
@@ -4422,6 +4426,10 @@ var SuspenseException = new Error(
     "unexpected behavior.\n\n" +
     "To handle async errors, wrap your component in an error boundary, or " +
     "call the promise's `.catch` method and pass the result to `use`"
+);
+var SuspenseyCommitException = new Error(
+  "Suspense Exception: This is not a real error, and should not leak into " +
+    "userspace. If you're seeing this, it's likely a bug in React."
 ); // This is a noop thenable that we use to trigger a fallback in throwException.
 // TODO: It would be better to refactor throwException into multiple functions
 // so we can trigger a fallback directly without having to check the type. But
@@ -15243,7 +15251,6 @@ function updateHostComponent(
       // we won't touch this node even if children changed.
       return;
     } // If we get updated because one of our children updated, we don't
-    suspendHostCommitIfNeeded(workInProgress);
     getHostContext(); // TODO: Experiencing an error where oldProps is null. Suggests a host
     // component is hitting the resume path. Figure out why. Possibly
     // related to `hidden`.
@@ -15262,12 +15269,17 @@ function updateHostComponent(
 // that suspend don't have children, so it doesn't matter. But that might not
 // always be true in the future.
 
-function suspendHostCommitIfNeeded(workInProgress, type, props, renderLanes) {
+function preloadInstanceAndSuspendIfNeeded(
+  workInProgress,
+  type,
+  props,
+  renderLanes
+) {
   // Ask the renderer if this instance should suspend the commit.
   {
     // If this flag was set previously, we can remove it. The flag represents
     // whether this particular set of props might ever need to suspend. The
-    // safest thing to do is for shouldSuspendCommit to always return true, but
+    // safest thing to do is for maySuspendCommit to always return true, but
     // if the renderer is reasonably confident that the underlying resource
     // won't be evicted, it can return false as a performance optimization.
     workInProgress.flags &= ~SuspenseyCommit;
@@ -15729,15 +15741,18 @@ function completeWork(current, workInProgress, renderLanes) {
           workInProgress.stateNode = _instance3; // Certain renderers require commit-time effects for initial mount.
         }
 
-        suspendHostCommitIfNeeded(workInProgress);
-
         if (workInProgress.ref !== null) {
           // If there is a ref on a host node we need to schedule a callback
           markRef(workInProgress);
         }
       }
 
-      bubbleProperties(workInProgress);
+      bubbleProperties(workInProgress); // This must come at the very end of the complete phase, because it might
+      // throw to suspend, and if the resource immediately loads, the work loop
+      // will resume rendering as if the work-in-progress completed. So it must
+      // fully complete.
+
+      preloadInstanceAndSuspendIfNeeded(workInProgress);
       return null;
     }
 
@@ -20014,9 +20029,11 @@ var NotSuspended = 0;
 var SuspendedOnError = 1;
 var SuspendedOnData = 2;
 var SuspendedOnImmediate = 3;
-var SuspendedOnDeprecatedThrowPromise = 4;
-var SuspendedAndReadyToContinue = 5;
-var SuspendedOnHydration = 6; // When this is true, the work-in-progress fiber just suspended (or errored) and
+var SuspendedOnInstance = 4;
+var SuspendedOnInstanceAndReadyToContinue = 5;
+var SuspendedOnDeprecatedThrowPromise = 6;
+var SuspendedAndReadyToContinue = 7;
+var SuspendedOnHydration = 8; // When this is true, the work-in-progress fiber just suspended (or errored) and
 // we've yet to unwind the stack. In some cases, we may yield to the main thread
 // after this happens. If the fiber is pinged before we resume, we can retry
 // immediately instead of unwinding the stack.
@@ -21184,6 +21201,9 @@ function handleThrow(root, thrownValue) {
         : // immediately resolved (i.e. in a microtask). Otherwise, trigger the
           // nearest Suspense fallback.
           SuspendedOnImmediate;
+  } else if (thrownValue === SuspenseyCommitException) {
+    thrownValue = getSuspendedThenable();
+    workInProgressSuspendedReason = SuspendedOnInstance;
   } else if (thrownValue === SelectiveHydrationException) {
     // An update flowed into a dehydrated boundary. Before we can apply the
     // update, we need to finish hydrating. Interrupt the work-in-progress
@@ -21464,7 +21484,7 @@ function renderRootConcurrent(root, lanes) {
         var unitOfWork = workInProgress;
         var thrownValue = workInProgressThrownValue;
 
-        switch (workInProgressSuspendedReason) {
+        resumeOrUnwind: switch (workInProgressSuspendedReason) {
           case SuspendedOnError: {
             // Unwind then continue with the normal work loop.
             workInProgressSuspendedReason = NotSuspended;
@@ -21516,6 +21536,12 @@ function renderRootConcurrent(root, lanes) {
             break outer;
           }
 
+          case SuspendedOnInstance: {
+            workInProgressSuspendedReason =
+              SuspendedOnInstanceAndReadyToContinue;
+            break outer;
+          }
+
           case SuspendedAndReadyToContinue: {
             var _thenable = thrownValue;
 
@@ -21534,6 +21560,69 @@ function renderRootConcurrent(root, lanes) {
             break;
           }
 
+          case SuspendedOnInstanceAndReadyToContinue: {
+            switch (workInProgress.tag) {
+              case HostComponent:
+              case HostHoistable:
+              case HostSingleton: {
+                // Before unwinding the stack, check one more time if the
+                // instance is ready. It may have loaded when React yielded to
+                // the main thread.
+                // Assigning this to a constant so Flow knows the binding won't
+                // be mutated by `preloadInstance`.
+                var hostFiber = workInProgress;
+                var type = hostFiber.type;
+                var props = hostFiber.pendingProps;
+                var isReady = preloadInstance(type, props);
+
+                if (isReady) {
+                  // The data resolved. Resume the work loop as if nothing
+                  // suspended. Unlike when a user component suspends, we don't
+                  // have to replay anything because the host fiber
+                  // already completed.
+                  workInProgressSuspendedReason = NotSuspended;
+                  workInProgressThrownValue = null;
+                  var sibling = hostFiber.sibling;
+
+                  if (sibling !== null) {
+                    workInProgress = sibling;
+                  } else {
+                    var returnFiber = hostFiber.return;
+
+                    if (returnFiber !== null) {
+                      workInProgress = returnFiber;
+                      completeUnitOfWork(returnFiber);
+                    } else {
+                      workInProgress = null;
+                    }
+                  }
+
+                  break resumeOrUnwind;
+                }
+
+                break;
+              }
+
+              default: {
+                // This will fail gracefully but it's not correct, so log a
+                // warning in dev.
+                if (true) {
+                  error(
+                    "Unexpected type of fiber triggered a suspensey commit. " +
+                      "This is a bug in React."
+                  );
+                }
+
+                break;
+              }
+            } // Otherwise, unwind then continue with the normal work loop.
+
+            workInProgressSuspendedReason = NotSuspended;
+            workInProgressThrownValue = null;
+            unwindSuspendedUnitOfWork(unitOfWork, thrownValue);
+            break;
+          }
+
           case SuspendedOnDeprecatedThrowPromise: {
             // Suspended by an old implementation that uses the `throw promise`
             // pattern. The newer replaying behavior can cause subtle issues
@@ -24109,7 +24198,7 @@ function createFiberRoot(
   return root;
 }
 
-var ReactVersion = "18.3.0-www-classic-f6defb2c";
+var ReactVersion = "18.3.0-www-classic-57dde557";
 
 // Might add PROFILE later.
 
diff --git a/compiled/facebook-www/ReactTestRenderer-dev.modern.js b/compiled/facebook-www/ReactTestRenderer-dev.modern.js
index eec95c521af66..5b47775d42767 100644
--- a/compiled/facebook-www/ReactTestRenderer-dev.modern.js
+++ b/compiled/facebook-www/ReactTestRenderer-dev.modern.js
@@ -2132,6 +2132,10 @@ function prepareScopeUpdate(scopeInstance, inst) {
 function getInstanceFromScope(scopeInstance) {
   return nodeToInstanceMap.get(scopeInstance) || null;
 }
+function preloadInstance(type, props) {
+  // Return true to indicate it's already loaded
+  return true;
+}
 function waitForCommitToBeReady() {
   return null;
 }
@@ -4422,6 +4426,10 @@ var SuspenseException = new Error(
     "unexpected behavior.\n\n" +
     "To handle async errors, wrap your component in an error boundary, or " +
     "call the promise's `.catch` method and pass the result to `use`"
+);
+var SuspenseyCommitException = new Error(
+  "Suspense Exception: This is not a real error, and should not leak into " +
+    "userspace. If you're seeing this, it's likely a bug in React."
 ); // This is a noop thenable that we use to trigger a fallback in throwException.
 // TODO: It would be better to refactor throwException into multiple functions
 // so we can trigger a fallback directly without having to check the type. But
@@ -15243,7 +15251,6 @@ function updateHostComponent(
       // we won't touch this node even if children changed.
       return;
     } // If we get updated because one of our children updated, we don't
-    suspendHostCommitIfNeeded(workInProgress);
     getHostContext(); // TODO: Experiencing an error where oldProps is null. Suggests a host
     // component is hitting the resume path. Figure out why. Possibly
     // related to `hidden`.
@@ -15262,12 +15269,17 @@ function updateHostComponent(
 // that suspend don't have children, so it doesn't matter. But that might not
 // always be true in the future.
 
-function suspendHostCommitIfNeeded(workInProgress, type, props, renderLanes) {
+function preloadInstanceAndSuspendIfNeeded(
+  workInProgress,
+  type,
+  props,
+  renderLanes
+) {
   // Ask the renderer if this instance should suspend the commit.
   {
     // If this flag was set previously, we can remove it. The flag represents
     // whether this particular set of props might ever need to suspend. The
-    // safest thing to do is for shouldSuspendCommit to always return true, but
+    // safest thing to do is for maySuspendCommit to always return true, but
     // if the renderer is reasonably confident that the underlying resource
     // won't be evicted, it can return false as a performance optimization.
     workInProgress.flags &= ~SuspenseyCommit;
@@ -15729,15 +15741,18 @@ function completeWork(current, workInProgress, renderLanes) {
           workInProgress.stateNode = _instance3; // Certain renderers require commit-time effects for initial mount.
         }
 
-        suspendHostCommitIfNeeded(workInProgress);
-
         if (workInProgress.ref !== null) {
           // If there is a ref on a host node we need to schedule a callback
           markRef(workInProgress);
         }
       }
 
-      bubbleProperties(workInProgress);
+      bubbleProperties(workInProgress); // This must come at the very end of the complete phase, because it might
+      // throw to suspend, and if the resource immediately loads, the work loop
+      // will resume rendering as if the work-in-progress completed. So it must
+      // fully complete.
+
+      preloadInstanceAndSuspendIfNeeded(workInProgress);
       return null;
     }
 
@@ -20014,9 +20029,11 @@ var NotSuspended = 0;
 var SuspendedOnError = 1;
 var SuspendedOnData = 2;
 var SuspendedOnImmediate = 3;
-var SuspendedOnDeprecatedThrowPromise = 4;
-var SuspendedAndReadyToContinue = 5;
-var SuspendedOnHydration = 6; // When this is true, the work-in-progress fiber just suspended (or errored) and
+var SuspendedOnInstance = 4;
+var SuspendedOnInstanceAndReadyToContinue = 5;
+var SuspendedOnDeprecatedThrowPromise = 6;
+var SuspendedAndReadyToContinue = 7;
+var SuspendedOnHydration = 8; // When this is true, the work-in-progress fiber just suspended (or errored) and
 // we've yet to unwind the stack. In some cases, we may yield to the main thread
 // after this happens. If the fiber is pinged before we resume, we can retry
 // immediately instead of unwinding the stack.
@@ -21184,6 +21201,9 @@ function handleThrow(root, thrownValue) {
         : // immediately resolved (i.e. in a microtask). Otherwise, trigger the
           // nearest Suspense fallback.
           SuspendedOnImmediate;
+  } else if (thrownValue === SuspenseyCommitException) {
+    thrownValue = getSuspendedThenable();
+    workInProgressSuspendedReason = SuspendedOnInstance;
   } else if (thrownValue === SelectiveHydrationException) {
     // An update flowed into a dehydrated boundary. Before we can apply the
     // update, we need to finish hydrating. Interrupt the work-in-progress
@@ -21464,7 +21484,7 @@ function renderRootConcurrent(root, lanes) {
         var unitOfWork = workInProgress;
         var thrownValue = workInProgressThrownValue;
 
-        switch (workInProgressSuspendedReason) {
+        resumeOrUnwind: switch (workInProgressSuspendedReason) {
           case SuspendedOnError: {
             // Unwind then continue with the normal work loop.
             workInProgressSuspendedReason = NotSuspended;
@@ -21516,6 +21536,12 @@ function renderRootConcurrent(root, lanes) {
             break outer;
           }
 
+          case SuspendedOnInstance: {
+            workInProgressSuspendedReason =
+              SuspendedOnInstanceAndReadyToContinue;
+            break outer;
+          }
+
           case SuspendedAndReadyToContinue: {
             var _thenable = thrownValue;
 
@@ -21534,6 +21560,69 @@ function renderRootConcurrent(root, lanes) {
             break;
           }
 
+          case SuspendedOnInstanceAndReadyToContinue: {
+            switch (workInProgress.tag) {
+              case HostComponent:
+              case HostHoistable:
+              case HostSingleton: {
+                // Before unwinding the stack, check one more time if the
+                // instance is ready. It may have loaded when React yielded to
+                // the main thread.
+                // Assigning this to a constant so Flow knows the binding won't
+                // be mutated by `preloadInstance`.
+                var hostFiber = workInProgress;
+                var type = hostFiber.type;
+                var props = hostFiber.pendingProps;
+                var isReady = preloadInstance(type, props);
+
+                if (isReady) {
+                  // The data resolved. Resume the work loop as if nothing
+                  // suspended. Unlike when a user component suspends, we don't
+                  // have to replay anything because the host fiber
+                  // already completed.
+                  workInProgressSuspendedReason = NotSuspended;
+                  workInProgressThrownValue = null;
+                  var sibling = hostFiber.sibling;
+
+                  if (sibling !== null) {
+                    workInProgress = sibling;
+                  } else {
+                    var returnFiber = hostFiber.return;
+
+                    if (returnFiber !== null) {
+                      workInProgress = returnFiber;
+                      completeUnitOfWork(returnFiber);
+                    } else {
+                      workInProgress = null;
+                    }
+                  }
+
+                  break resumeOrUnwind;
+                }
+
+                break;
+              }
+
+              default: {
+                // This will fail gracefully but it's not correct, so log a
+                // warning in dev.
+                if (true) {
+                  error(
+                    "Unexpected type of fiber triggered a suspensey commit. " +
+                      "This is a bug in React."
+                  );
+                }
+
+                break;
+              }
+            } // Otherwise, unwind then continue with the normal work loop.
+
+            workInProgressSuspendedReason = NotSuspended;
+            workInProgressThrownValue = null;
+            unwindSuspendedUnitOfWork(unitOfWork, thrownValue);
+            break;
+          }
+
           case SuspendedOnDeprecatedThrowPromise: {
             // Suspended by an old implementation that uses the `throw promise`
             // pattern. The newer replaying behavior can cause subtle issues
@@ -24109,7 +24198,7 @@ function createFiberRoot(
   return root;
 }
 
-var ReactVersion = "18.3.0-www-modern-eb67b0a3";
+var ReactVersion = "18.3.0-www-modern-1ad200fa";
 
 // Might add PROFILE later.
 
diff --git a/compiled/facebook-www/WARNINGS b/compiled/facebook-www/WARNINGS
index ab647cc26754b..8fcbd1631ca93 100644
--- a/compiled/facebook-www/WARNINGS
+++ b/compiled/facebook-www/WARNINGS
@@ -311,6 +311,7 @@
 "Unexpected ref object provided for %s. Use either a ref-setter function or React.createRef()."
 "Unexpected return value from a callback ref in %s. A callback ref should not return a function."
 "Unexpected type for suspenseCallback."
+"Unexpected type of fiber triggered a suspensey commit. This is a bug in React."
 "Unexpectedly popped too many stack frames. This is a bug in React."
 "Unknown ARIA attribute `%s`. Did you mean `%s`?"
 "Unknown event handler property `%s`. It will be ignored."